/* stylesheet for japanesetranslator.co.uk */

/**********************/
/*   Generic stuff    */
/**********************/

/* Global overrides */

body, table, img, ul, li  { margin:0; padding:0; border:0; font-size:1em; }
table { text-align:left; }

h1 { text-transform: uppercase; font-size: 1.2em; margin: 0 0 0 -0.5em; padding: 0.05em 0.5em 0.05em 0.5em; font-weight: normal; letter-spacing: 0.5em; background-color: #fff9e6; border: 1px solid #bbb; color: #789; }

h2 { font-size: 1.2em; font-weight: bold; margin: 1em 0 0 0; }

h3 { font-size: 1.1em; font-weight: bold; margin: 1em 0 0 0; }

h4 { font-size: 1em; font-weight: normal; margin: 0.5em 0 0 0; }

h5 { font-size: 1em; font-weight: normal; margin: 0.5em 0 0 1em; display: list-item; list-style-type: square; }

h6 { font-size: 1em; font-weight: normal; font-style: italic; margin: 0.5em 0 0 0; }

strong { font-weight: bold; }

sup, sub { font-size: 70%; position:relative; }
sup { top:-0.15em; }
sub { top:0.05em; }

a { color: #34f; text-decoration: none; }
a:visited { color: #45d; }
a:hover { color: #78f; text-decoration:underline; }
a:active { text-decoration: none; }

a.fn { background-color:#fff; }
a.fn:hover { color:#fff; background-color:#34f; text-decoration: none; }
a.fn:active { background-color:#12d; }

i, em { font-style: italic; font-weight: normal; }

b, strong { font-style: normal; font-weight: bold; }

blockquote { line-height: 1.25em; margin: 0 5em 0 3em; color: #456; }

kbd, code, pre, samp, var, tt { font-family: "Lucida Sans Typewriter", Monaco, "Andale Mono", monospace; font-size: 0.95em; font-style: normal; font-weight: normal; color:#346; background-color:#fff; }

samp { color: #191; }

var { color: #191; font-weight: bold; }

cite { font-style: normal; font-weight: normal; color: #000; }

ins { text-decoration: underline; color: #f43; }

del { color: #9ab; }

pre { line-height: 1em; background: #f2f2fa; padding: 0.5em; border: 1px solid #bbb; }
/* This rule causes IE/Mac to hide all PRE content: \*/
pre { overflow: auto; }
/* End suckage */

ul { margin: 0 0 0 1.5em; padding: 0; list-style-type: square; }
ul#sitemap > li { margin-bottom:1em; }
ul#sitemap ul { font-size:94%; list-style-type: disc; margin-right:6em; }
ul#sitemap ul ul { font-size:94%; list-style-type: circle; margin-right:6em; }

ol { margin: 0.25em 0 0.25em 1.5em; padding: 0; list-style-type: decimal; }

li { margin: 0.2em 0; padding: 0; }



ol ol { list-style-type: lower-alpha; }

ol ol ol { list-style-type: lower-roman; }

dd { margin-left: 0; }

dt { font-weight: bold; }

dt+dd { margin-bottom: 1em; }

abbr, acronym { cursor:help; background:#efe; color:#070; outline:none; border:none; }

abbr:hover, acronym:hover { background-color:#ff4; }

p { margin: 0.5em 0; padding: 0; }

.center { text-align: center; }

.nobr { white-space: nowrap; }

hr { margin: 1em 0; }


/**********************/
/* Site-specific bits */
/**********************/

body { background: #dae6ff url(/style/gradient.png) fixed bottom center repeat-x; margin: 0; padding: 0; font-family:"Trebuchet MS","Lucida Grande","Lucida Sans","Lucida Sans Unicode",sans-serif; font-size:95%; line-height: 1.4em; color: #101418; }

/* Page top */

div#masthead { width: 100%; height: 84px; background: #fff url(/style/banner-bg.png) top left repeat-x; margin: 0; }

p#logo { margin: 0 0 0 2em; padding: 0; height: 84px; line-height: 1em; width:400px;float:left }

/* Main content area */

div#content { background-color: #fff; margin: 0 auto; padding: 0 0 12px 0; min-width: 49em; max-width:60em; border:6px solid #abd; border-top:none; }

p#footer { text-transform: uppercase; font-size: 0.8em; letter-spacing: 0.2em; text-align: right; margin-right: 3em; color: #789; clear: both; }
p#footlinks { margin: 0 auto 2em auto; padding: 0 6px 3px 6px; font-size:0.8em; line-height:1em; min-width: 61.25em; max-width:75em; color:#56a; background-color:#abd; }
p#footlinks small { font-size:1em; }
p#footlinks a:link, p#footlinks a:visited { text-decoration: none; color: #56a; }
p#footlinks a:hover { text-decoration: none; color:#fff; }
p#footlinks a:active { color:#44f; }

p.note { font-size:85%; line-height:1.25em; }
p.note small { font-size:100%; }


div#modal { background-color: #fff; margin: 50px 80px; padding: 24px 3em 30px 3em; min-width: 30em; border-right: 1px solid #bbb; border-left: 1px solid #bbb; border-bottom: 1px solid #bbb; }

div#modal h1 { margin: 0 -0.5em 20px -0.5em; padding: 0.05em 0.5em 0.05em 0.5em; font-weight: normal; letter-spacing: 0.5em; background-color: #fff9e6; border: 1px solid #bbb; color: #789; }

div#modal table p { margin: 0.25em 0; }

.smallnote { font-size:0.9em; border: 1px solid #bbb; padding:0 1em; margin:0.5em 0; }

/* forms */

/* textarea { resize:none; } */

.stdtxt {
	width: 19em;
 	background-color: #f8f8ff;
	border: 1px solid #bbb;
	padding: 0.2em;
	font:inherit;
}

.stdtxt:focus {
 	background-color: #fff;
	outline:none;
}

.stdbtn {
	font:inherit;
}

.okbtn { background:url(/style/button-ok.png) top center no-repeat; }
.okbtn:hover { background-position:center center; }
.okbtn:focus { background-position:bottom center; }

/* Breadcrumbs */

#breadcrumbs { font-size: 0.9em; line-height: 1em; margin:0; padding:0 0 0.25em 0; color: #789; }
#breadcrumbs small { font-size: 1em; }

/* Headers */

p.header { margin: 0; padding: 0; height: 33px; background: top left no-repeat; }
p.header big { position: relative; top: -1000px; left: -1000px; font-size: 10px; }

/* Two-column layout */

div#left { float:left; width: 63%; margin: 0; padding: 0; }
div#left > div { margin: 12px 0 24px 36px; }

div#right { float:right; width: 37%; max-width:360px; margin: 0; padding: 0; }
div#right > div { margin: 12px 30px 24px 20px; background-color: #fff9e6; border: 1px solid #bbb; font-size:92%; line-height: 1.25em; padding: 0 1em 0.5em 1em; }

div#right h2 { text-align: center; font-size: 1.25em; font-weight: normal; letter-spacing: 0.3em; text-transform: uppercase; color: #789; margin: 0.7em 0 0.5em 0; }

div#right h2.img { padding: 84px 0 0 0; background: #fff9e6 top center no-repeat; }

div#right p { margin: 0.5em 0 0 0; }

div#right ul { margin: 0; padding: 0.5em 0; }

div#right li { list-style:square inside; }

div#right li + li { margin-top: 0.75em; }

div#right blockquote { background-image:none; margin:0 0 0.5em 1em; padding: 0; font-style: italic; }

/* Single column layout */

div#solo { clear:left; float:left; width:100%; padding:0 }
div#solo > div { margin: 12px 30px 24px 36px; }

/* Site search */

#search { width:20em;float:right; font-size:91%; margin-top:24px; }

#search2 {
	position: relative;
	left: 0;
	margin: 0 30px 0 auto;
	text-align: right;
	width: 13.5em;
	line-height:0.75em;
}

#search form input, div#search form button {
	font-size: inherit;
	background-color: #fff;
	border: 1px solid #bbb;
	padding: 0 0.25em;
}


#search form input.srchbtn { width:21px; height:21px; padding:0; margin:0; border:none; position:relative; top:5px; background:transparent url(/style/src1.png) no-repeat; border:0; }
#search form input.srchbtn:hover { background-image: url(/style/src2.png); }
#search form input.srchbtn:focus { outline:none; }

.floatleft, .floatright {
	line-height:1em; font-size:0.91em; padding:1em;
}

.floatleft {
	float: left;
	clear: left;
	margin-right: 1em;
}

.floatright {
	float: right;
	clear: right;
	margin-left: 1em;
}

.digginfo { float:left; padding-right:10px; padding-top:0.6em; }
.digginfo2 { float:right; padding-left:10px; padding-top:0.6em; }

.do { color:#fff; background-color:#0b0; padding:0 0.2em; text-transform:uppercase; }
.dont { color:#fff; background-color:#f41; padding:0 0.2em; text-transform:uppercase; }

p.backup { text-align:right; }
p.backup small { padding-left:14px; background:url(/style/backup.png) left center no-repeat; }

div#tandc { font-size: 0.91em; margin:0 2em; line-height: 1.2em; }
div#tandc p { margin-left: 4em; text-indent:-2.5em; }
div#tandc p b { display:block; float:left; width:0; overflow:visible; }


div.toc { width:16em; float:right; margin:1em 0 1em 1em; background-color: #fff9e6; border: 1px solid #bbb; padding: 0 1em 0.75em 1em; }
div.toc ul { list-style-type: none; margin-left: 0; }


div.addendum { margin-right:20em; margin-top:2em; color:#789; }
div.addendum dd { margin-left: 1em; }

table.basic { padding:0.5em; background-color: #fff9e6; border: 1px solid #bbb; }
td+td { padding-left: 1em; }
th+th { padding-left: 1em; }

table.tight td+td { padding-left: 0; }
table.tight th+th { padding-left: 0; }



/* CSS menu system

   If you want a decent cross-browser CSS menu system for your website, don't
   bother trying to pick this section apart. Visit the mother lode instead:
   
   http://www.grc.com/menu2/invitro.htm  */

#menu {
	position:relative;
	float:left;
	margin:0;
	padding:0;
	border:0;
	height:1.5em;
	width:100%;
	background:#b0c1f3 url(/style/mb0.png) top center repeat-x;
	font-size:0.95em;
	border-top:1px solid #bbb;
	border-bottom:1px solid #bbb;
}

#menu a {
	padding: 0 0.5em;
}

#menu ul {
	padding:0 0 0 1.5em;
	margin:0;
	border:0;
	list-style-type:none;
	line-height:1.5em;
}

#menu li {
	float:left;
	position:relative;
	margin:0;
}

.mtop {
	padding-right: 0.5em;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.mtop ul {
	text-transform: none;
	letter-spacing: 0;
}

#menu ul li table {
	margin:-1px 0;              /* IE5 needs -1px top and bottom table margins */
	m\61rgin:0;                 /* re-zero the table margins for everyone but IE5 */
	border-collapse:collapse;   /* IE5 needs this for the sub-menus to work */
	font-size:1em;
}

.drop, .nodrop {
	display:block;
	padding:0px 0.33em;
	margin:0;
	text-align:right;
	cursor:pointer;
}

.nodrop {
	text-align:left;
}

.drop span {
	float:left;
}

#menu ul li ul {
	display:none;
	padding:1px;
}

#menu ul li a,
#menu ul li a:visited {
	display:block;
	float:left;
	text-decoration:none;
	height:1.5em;
}

#menu ul li:hover a,
#menu ul li a:hover {
	background:#ebdbc2 url(/style/mb1.png) top center repeat-x;
}

#menu ul li:hover ul,
#menu ul li a:hover ul {
	display:block;
	position:absolute;
	margin:0;
	top:1.5em;
	left:-1px;
	height:auto;
	width:12.0em;
	background:#bbb;
}

#menu ul li:hover ul li a,
#menu ul li a:hover ul li a {
	border:0;
	margin:0;
	padding:0;
	height:auto;
	background:#dbedf4;
	width:12.0em;
}

#menu ul li:hover ul li:hover a,
#menu ul li a:hover ul li a:hover {
	background:#fff9e6;
}


#menu ul li:hover ul li ul,
#menu ul li a:hover ul li a ul {
	visibility:hidden;
}
     
#menu ul li:hover ul li:hover ul,
#menu ul li a:hover ul li a:hover ul {
	visibility:visible;
	position:absolute;
	margin-top:-1px;
	top:0;
	left:12em;
	width:12em;
}

#menu ul li:hover ul li:hover ul li a,
#menu ul li a:hover ul li a:hover ul li a {
	width:12em;
	background:#fff9e6;
}

#menu ul li:hover ul li:hover ul li a:hover,
#menu ul li a:hover ul li a:hover ul li a:hover {
	width:12em;
	background:#fff9e6;
}

#menu ul li a#yah, #yah .drop, #yah .nodrop {
	cursor: default !important;
	color: #101418 !important;
	background:#fff9e6 !important;
}

#menu ul li a#yah, #yah .drop ul, #yah .nodrop ul {
	background:#dbedf4;
}

#menu ul li.mtop a#yah {
	background:#ebdbc2 url(/style/mb1.png) top repeat-x;
}

/* (end of menu bits) */

span.show, span.noshow { font-weight:bold; }
span.noshow em { display:block; position:absolute; top:-1000px; left:-1000px; }

div.extlinks { margin: 24px 0 0 0; background-color: #fff9e6; border: 1px solid #bbb; font-size:92%; line-height: 1.25em; padding: 0.5em 1em 0.75em 1em; }
div.extlinks h2 { margin:0.25em 0 0.5em 0; }
div.extlinks li+li { margin-top:0.5em; }
div.extlinks a { font-weight:bold; }

.hide { display:none; }

.inset {
	background-color: #fff9e6; border: 1px solid #bbb; margin: 1em 0.5em 1em 0; padding:0.25em 1em;
}

.smallinset {
	background-color: #fff9e6; border: 1px solid #bbb; margin: 1em 5em; padding:0.25em 1em;
}

img.appicon { position:relative; top:2px; }

table.form td { vertical-align: top; padding:0.2em 0; }
input, button, select, option, textarea { font-family:inherit; font-size:inherit; }
input[type=text], textarea { padding:0.2em 0.1em; }

fieldset.contact {
	background-color: #fff9e6; border: 1px solid #bbb; margin: 1em 0; padding:0.25em 1em;
}

.offscreen { position:absolute; top:-1000px; left:-1000px; }


.alert, .floatAlert {
	font-family:sans-serif;
	font-size:0.9em;
	line-height:1.2em;
	display:block;
	width:26em;
	background-color:#f5f7fe;  /* #e9eef4 */
	border:1px solid #666;
	margin:0;
	padding:0;
}

.alert {
	margin:1em auto;
}

.floatAlert {
	position:absolute;
	top:10em;
	left:5em;
}

.alert h2, .floatAlert h2 {
	background:#a7bed2 url(/style/tfill.png) center center repeat;
	text-align:center;
	font-weight:bold;
	font-size:1em;
	margin:0;
	padding:0.25em;
}

.floatAlert h2 {
	cursor:default;
}

.alert div, .floatAlert div {
	background:url(/style/icnalrt.png) top left no-repeat;
	margin:0;
	padding:12px 12px 12px 80px;
}

.alert div p, .floatAlert div p {
	margin:0 0 0.75em 0;
	padding:0;
}

.alert li, .floatAlert li {
	margin-bottom:0.75em;
}


/* Feedback form */

table#contactform { width:100%; }
table#contactform td { vertical-align:top; width:75%; }
table#contactform tr>td:first-child { width:25%; }
table#contactform td+td { padding-right:1em; }

table#contactform input[type=text], table#contactform textarea { font-family:inherit; font-size:1em; width:100%; margin:0; padding:3px; border:1px solid #bbb; }

div.txt_exp { visibility:hidden; width:100%; height:10px; background:#b5c5f2 url(/img/tar3.png) center center no-repeat; cursor:s-resize; margin:0; padding:0 4px; position:relative; top:-1px; }

button, input.btn { border:1px solid #789; background:url(/img/btn.png) #e1e6ff top center repeat-x; }
button:hover, input.btn:hover { background-position:center center; }
button:active, input.btn:active { background-position:bottom center; }

.emailconf { background-color:#f5f6f7; border:1px solid #bbb; padding:0.5em 1em; font-size:0.9em; line-height:1.2em; overflow:auto; }

.fleft { width:49%; float:left; clear:left; margin-top:0.5em; border:1px solid #bbb; }
.fright { width:49%; float:right; clear:right; margin-top:0.5em; border:1px solid #bbb; }
.float2 { margin:1em 1em 0.25em 1em; background:url(/img/spin0.png) top center no-repeat; padding-top:80px; }

a[hreflang="ja"] { background:url(/img/ja.png) left center no-repeat; padding-left:36px; }


.newsimg { display:block; float:right; margin:3px 0 3px 8px; padding:0; border:none; }
.grey { color: #888; }


/* Your name in Japanese */
input#ntxt { font:inherit; margin:0; padding:3px; border:1px solid #bbb; }