/* Main Style */

html,body{
	margin:0;
	padding:0;
}

body{
	font-size: 86%;
	font-family: Verdana, Osaka, Arial, sans-Serif;
	text-align:center;
	background: url('../img/bodybg.gif') repeat;
}

div#header{
	position:relative;
	background-color: #FFFFFF;
	background: url('../img/headerbg.jpg') no-repeat;
	height: 50px;
}

div#header h1{
	margin:0;
	padding: 4px 0 0 4px;
}

div#header .right{
	position:absolute;
	right: 20px;
	top: 6px;
}

div#wrapper{
	clear: both;
}

div#container{
	width:800px;
	margin:0 auto;
	text-align:left;
	background-color: #FFFFFF;

}

div#content{
	float:right;
	width: 620px
}

body#wide div#content{
	width: 800px;
}

div#content p{
	line-height:1.4;
}

div#sidebar{
	float:left;
	width:180px;
	padding-bottom: 400px;
	margin-bottom: -400px;
}

div#navigation{
	background:#CC6600;
}
div#extra{
	clear:both;
	width:100%;
	border-top: 1px solid #39496A;
}


div#footer{
	background: #50668F;
	color: #FFF;
	clear:both;
	width:100%;
}
div#footer p{
	margin:0;
	padding:5px 10px;
}
div#footer a{
	display:inline;
	padding:0;
	color: #EEEEFF;
}

/* content */


div#contentbody {
	border-left: 1px solid #39496A;
	padding: 6px;

}

body#wide div#contentbody{
	border: 0;
}


div#extra ul{
	text-align: right;
	margin: 0;
	padding: 6px;
	font-size: 90%;
	float: right;
}
div#extra li{
	float: left;
  	list-style-type: none;
  	padding: 0 8px 0 14px;
  	background: url('../img/style5.gif') no-repeat 2px 4px;
}


div#footer p{
	text-align: center;
	margin: 0;
	padding: 6px;
	font-size: 90%;
}
/* form */
form {
	margin: 4px 0 8px 0;
}
/* image */
img{
	border: 0;
}

img.shot{
	padding: 8px;
	border: 0;
}

/* Link Style */
a:link{
	color: #0000FF;
	text-decoration: underline;
}
a:visited{
	color: #0000FF;
	text-decoration: underline;
}
a:hover{
	color: #FF0000;
	text-decoration: underline;
}

p{
	margin:8px 10px 8px 30px;
}

/* indent */

.indent{
	margin-left: 30px;

}

ul{
	margin: 0px 8px;
	padding: 0;
}

ul li{
	list-style: none;
	line-height: 1.5;
	padding: 0 0 0 12px;
	margin: 0;
	background: url('../img/style15.gif') no-repeat 0 6px;
}
/* healine */

h1{
	font-size : 130%;
}
div#content h1{
	padding: 8px 0 8px 12px;
	margin: 10px 0 8px 8px;
    background: url('../img/h1bg.gif') no-repeat;
    border-bottom: 1px solid #CDD5B9;
}


h2{
	padding: 6px 0px 6px 10px;
	margin: 12px 0 8px 8px;
	font-size : 110%;
	color: #333333;
    background: url('../img/h2bg.gif') no-repeat;
    border-bottom: 1px solid #CDD5B9;
}

h3{
	padding: 6px 0px 6px 10px;
	margin: 12px 0 8px 8px;
	font-size : 100%;
	font-weight : bold;
    border-bottom: 1px solid #CDD5B9;
}

.note{
	font-size: 80%;
	color: #666;
}


fieldset{
	margin: 1em;
}

fieldset legend{
    color: #666666;
    font-weight: bold;
}
fieldset a{
	color: #0000FF;
	text-decoration: underline;
    font-weight: normal;
}

.greyout, .greyout a {
	color: #999999;
	text-decoration: none;
}

.datetime {
	color: #666666;
	font-size: 80%;
}


/* page bread list */

div#breadlist{
	padding:0;
	background-color: #CCCCCC;
}

div#breadlistbody{
	margin: 1px;
	padding: 8px;
	border-bottom: 1px solid #DDDDDD;
	font-size: 90%;
	background: url('../img/breadlistbg.gif') repeat-x;
}

/* error */
.error {
	color: red;
	background-color: #ffff55;
	padding: 4px;
}

.marker {
	color: blue;
	background-color: #ffff55;
}

/* form advice */

.example {
	color: darkgreen;
	font-size: 85%;
}


/* table style */

table.listtable {
	border: solid 1px #DFE2EC;
	margin: 5pt;
}
table.formtable {
	border: solid 1px #DFE2EC;
	background-color: #F3F6ED;
	margin: 5pt;
}

table.listtable th, table.formtable th {
	padding: 4px;
	background-color: #E7EBDE;
	vertical-align: top;
}

table.listtable td {
	padding: 4px;
	border-bottom: dashed 1px #999999;
	vertical-align: top;
}
table.formtable td {
	padding: 3px;
}

table.listtable tr#selectedrow{
	background-color: #FFFFEE;
}

ul.formtable {
	border: solid 1px #DFE2EC;
	background-color: #F3F6ED;
	margin: 0 14px;
	padding: 4px 0 4px 28px;
}
ul.formtable form{
	margin: 2px 0;
}


/* navigation bar */

div#navigation{
	margin: 0;
	padding:0;
	height: 26px;
	border-bottom: solid #898E79 1px;
	background: url('../img/mainnavibg.gif') repeat-x 0 0;
}

div#navigation ul{
	margin: 0;
	padding: 0 50px;
}
div#navigation li{
	margin: 0; 
	padding: 0;
	text-align:center;
	width:100px;
	height:18px;
  	display: inline;
  	list-style-type: none;
}

div#navigation a:link, div#navigation a:visited {
	color: #EEEEEE;
	font-size: 12px;
	font-weight: bold;
	line-height: 14px;
	margin:0;
	padding:0;
	padding-top:5px;
	float: left;
	text-decoration: none;
	text-align:center;
	width:100px;
	height:21px;
	background: url("../img/mainnavioff.gif") no-repeat;
}

div#navigation #here a:link, div#navigation #here a:visited, div#navigation a:hover{
	color: #FFFFFF;
	font-size: 12px;
	font-weight: bold;
	line-height: 14px;
	margin:0;
	padding:0;
	padding-top:5px;
	float: left;
	text-decoration: none;
	text-align:center;
	width:100px;
	height:21px;
	background: url("../img/mainnavion.gif") no-repeat;
}

div#navigation a:hover, div#navigation #here a:hover {
	color: #FCC900;
	text-decoration: none;
}

/* sub menu */

div#subnavi
{
	width: 180px;
	padding: 0;
	margin: 0px;
	color: #666666;
	float: left;
/*
	filter: alpha(style=0, opacity=80);
	-moz-opacity: 0.8;
	opacity:0.8;
*/
}

div#subnavi ul
{
	list-style: none;
	margin: 0;
	padding: 0;
	border: none;
}

div#subnavi li
{
	border-bottom: 1px solid #CCCCCC;
	margin: 0;
	padding: 0;
}

div#subnavi li a
{
	display: block;
	padding: 5px 5px 5px 18px;
	border-left: 10px solid #5A6785;
	color: #3333FF;
	text-decoration: none;
	width: auto;
	background: url('../img/style6.gif') no-repeat 8px 10px;
	_background: url('../img/style6.gif') no-repeat 17px 10px;
	background-color: #FFFFFF;
}
/* IE Hack */
*+html body div#subnavi ul li a, * html body div#subnavi ul li a{
 background: url('../img/style6.gif') no-repeat 17px 10px;
 background-color: #FFFFFF;
}

div#subnavi li#subhere a
{
	display: block;
	padding: 5px 5px 5px 18px;
	border-left: 10px solid #B0C2D2;
	color: #3333FF;
	text-decoration: none;
	width: auto;
	background: url('../img/style7.gif') no-repeat 8px 10px;
	_background: url('../img/style7.gif') no-repeat 17px 10px;
	background-color: #F0F4F7;
}
/* IE Hack */
*+html body div#subnavi ul li#subhere a, * html body div#subnavi ul li#subhere a{
  background: url('../img/style7.gif') no-repeat 17px 10px;
   background-color: #F0F4F7;
}

div#subnavi li a:hover, div#subnavi li#subhere a:hover
{
	display: block;
	border-left: 10px solid #FCC900;
	background-color: #FFEB9B;
	color: #0000FF;
	text-decoration: underline;
}


/* ASP */

body#asp{
	background: url('../img/asp-bodybg.gif') repeat;
}

body#asp div#header{
	background: url('../img/asp-headerbg.jpg') no-repeat;
}

body#asp div#navigation{
	background: url('../img/asp-mainnavibg.gif') repeat-x 0 0;
}

body#asp div#navigation a:link, body#asp div#navigation a:visited {
	color: #FFFFFF;
	background: url("../img/asp-mainnavioff.gif") no-repeat;
}

body#asp div#navigation #here a:link, body#asp div#navigation #here a:visited, body#asp div#navigation a:hover{
	color: #3333FF;
	background: url("../img/asp-mainnavion.gif") no-repeat;
}

body#asp div#navigation a:hover, body#asp div#navigation #here a:hover {
	color: #FF3333;
	text-decoration: none;
}

body#asp div#subnavi li a
{
	border-left: 10px solid #98A970;
}

body#asp div#subnavi li#subhere a
{
	border-left: 10px solid #CDD5B9;
	background-color: #E7EBDE;
}

body#asp div#subnavi li a:hover, body#asp div#subnavi li#subhere a:hover
{
}


/* background */
body.home div#sidebar{
	background: url('../img/sidebg-officerun.jpg') no-repeat;
}
body.about div#sidebar{
	background: url('../img/sidebg-olpc.jpg') no-repeat;
}
body.price div#sidebar{
	background: url('../img/sidebg-olnote.jpg') no-repeat;
}
body.download div#sidebar {
	background: url('../img/sidebg-balls.jpg') no-repeat;
}
body.manual div#sidebar {
	background: url('../img/sidebg-news.jpg') no-repeat;
}
body.casestudy div#sidebar {
	background: url('../img/sidebg-handshake.jpg') no-repeat;
}
body.support div#sidebar {
	background: url('../img/sidebg-oleye.jpg') no-repeat;
}
/* sub */
div.bg-board{
	background: url('../img/sidebg-board.jpg') no-repeat;
}
div.bg-calendar{
	background: url('../img/sidebg-calendar.jpg') no-repeat;
}
div.bg-guts{
	background: url('../img/sidebg-guts.jpg') no-repeat;
}
div.bg-hurry{
	background: url('../img/sidebg-hurry.jpg') no-repeat;
}
div.bg-keyboard{
	background: url('../img/sidebg-keyboard.jpg') no-repeat;
}
div.bg-keytouch{
	background: url('../img/sidebg-keytouch.jpg') no-repeat;
}
div.bg-meetingpc{
	background: url('../img/sidebg-meetingpc.jpg') no-repeat;
}
div.bg-mobile{
	background: url('../img/sidebg-mobile.jpg') no-repeat;
}
div.bg-newspaper{
	background: url('../img/sidebg-newspaper.jpg') no-repeat;
}
div.bg-officedesk{
	background: url('../img/sidebg-officedesk.jpg') no-repeat;
}
div.bg-outdoormobile{
	background: url('../img/sidebg-outdoormobile.jpg') no-repeat;
}
div.bg-pedxing{
	background: url('../img/sidebg-pedxing.jpg') no-repeat;
}
div.bg-watch{
	background: url('../img/sidebg-watch.jpg') no-repeat;
}

/* top page */

div#top {
}

div#top h1{
	font-size: 200%;
	background: none;
}

div#top h2{
	font-size: 16px;
	background: none;
	margin-top: 10px;
	border: 0 none;
	background: url('../img/home-topbg.gif') no-repeat;
	padding: 8px 8px 8px 40px;
}
div#top p{
	font-size: 85%;
	color: #666666;
}

 /* IE Hack */
 *+html body div#subnavi ul li a{
         background: url('../img/style6.gif') no-repeat 17px 10px;
         background-color: #FFFFFF;
 }
 *+html body div#subnavi ul li#subhere a{
         background: url('../img/style7.gif') no-repeat 17px 10px;
         background-color: #F0F4F7;
 }