/* CSS Document 	background:#f7f7f7 url(../img/pattern.png) repeat top left;	*/
html{
    	height:100%;
}
body{
	height:100%;
	padding:0; 
	margin:auto; 
	color:#818181; 
	font:Tahoma, sans-serif;
}
img{
	border: none;
}
#indexbody{
	height:100%;
	padding:0; 
	margin:auto;
	color:#818181; 
	font:Tahoma, sans-serif;
	background:#ffffff url(../img/background.png) no-repeat top left; 
 }
div, p, ul, h2, h3, h4, img{
	padding:0; 
	margin:0;
}
ul{
	list-style-type:none;
}

/* CONTAINER */

#indexcontainer{
	height:100%;
	width:1000px;
	margin:auto;
}
#container{
	height:100%;
	width:1000px;
	margin:auto;
	background:#ffffff url(../img/background_half.png) no-repeat top left; 
}

/* TopPage-HEADER */

#topheader{
	width:600px; 
	height:240px; 
}
#topheader #ocha{
	font-size:20px;
	color:#880066;
	margin:13% 0px 0px 13% ;	
}
#topheader #title{
	font-size:50px; 
	color:#000;
	position : relative;	
 	margin:0px 0px 0px 13% ;
}
#topheader #comment{
	width:800px;
	position : relative;
	margin:2% auto auto 20%;
}

/* HEADER */

#header{
	position : relative; 
	margin:0;
	height:240px;
}
#header #title{
	width:800px;
	float:left;
	font-size:50px; 
	position : relative;
	color:#000;
	margin-left:10%; 
}
#header #gotop {
	width:150px;
	height:47px;
	margin:5px;
	float:left;
	padding:auto;
	background:transparent url(../img/navicon_gotop.png) no-repeat 0px 0px;
	font-family: "Trebuchet MS", sans-serif;
	font-weight:normal;
    	font-size:18px;
	color:#000;
	text-decoration:none;
	text-shadow:1px 1px 1px #fff;
	outline:none;
}
#header #gotop:hover{
	color:#808080;
	text-decoration:none;
    	background-position:0px -47px;
}
#header #gotop p{
	margin-top:12px;
	margin-left:70px;
}

#header #comment{
	position : relative;
	margin-left:20px;
	font-size:16px; 
	color:#818181; 
	font:Tahoma, sans-serif;
}

/* CONTENT */

#content{
	position:relative; 
	clear:both; 
	width:800px;
	margin:2% auto 0px auto ;
	padding:50px; 
	line-height: 1.5em;
}

#content .contentimg{
	text-align:center;
	margin:20px;
}
#content .contentimg .right{
	float:right;
	width:350px;
	height:350px;
	margin:20px;
}
#content .contentimg .left{
	float:left;
	width:350px;
	height:350px;
	margin:20px;
}
#content h1{
	margin:25px auto 25px auto;
	height:26px;
	padding-left:30px;
	font-size:20px;
	color:#000;
	background:#fff url(../img/h1image.png) no-repeat top left;
}
#content h2{
	margin:auto auto 25px auto;
	height:26px;
	padding-left:50px;
	font-size:18px;
	color:#555;
}
#content p{
	font-size:14px;
	color:#000;
}
#content ul{
	margin:20px auto 20px 40px;
	vertical-align: middle; 
	list-style-image: url(../img/list1.png);
}
#content table{
	margin:40px;
	text-align:center;
}

#content table th{
	color:#6699cc;
	padding:5px;
}
#content table td{
	color:#6699cc;
	padding:5px;
}
#content a{
	font:16px Tahoma, sans-serif; 
	color:#909090; 
	font-weight:bold; 
	text-decoration:none;
	outline:none; 
}
#content a:hover{
	color:#d0d0d0;
	text-decoration:none 
}

#content #lefttable{
	margin:40px;
	text-align:left;
}

#content .labquestion{
	margin:50px;
	height:26px;
	padding-left:20px;
	font-size:16px;
	font-weight:bold;
	color:#000;
	background:transparent url(../img/labquestion.png) no-repeat top left;
}
#content .labnote{
	margin:50px auto auto auto;
	padding-left:40px;
	height:50px;
	font-size:16px;
	font-weight:bold;
	color:#fff;
	background:transparent url(../img/labnote.png) no-repeat top left;
}
#content .labanswer{
	margin:auto;
	width:650px;
}


/* TopMenu */
.topmenu .item{
	width:120px;
	position:relative;
	float:left;
	margin:30px;
	text-decoration:none;
}
.topmenu a.icon{
	width:100px;
	height:100px;
	position:absolute;
	top:0px;
	left:0px;
	cursor:pointer;
	outline:none;
}
.topmenu .motivation a.icon{
    	background:transparent url(../img/icon_motivation.png) no-repeat 0px 0px;
}
.topmenu .feature a.icon{
    	background:transparent url(../img/icon_feature.png) no-repeat 0px 0px;
}
.topmenu .fromog a.icon{
    	background:transparent url(../img/icon_fromog.png) no-repeat 0px 0px;
}
.topmenu .labintro a.icon{
    	background:transparent url(../img/icon_labintro.png) no-repeat 0px 0px;
}
.topmenu .outlink a.icon{
    	background:transparent url(../img/icon_outlink.png) no-repeat 0px 0px;
}
.topmenu .item a:hover{
    	background-position:0px -100px;
}
.topmenu .item img.circle{
   	position:absolute;
    	top:0px;
    	left:0px;
    	width:100px;
    	height:100px;
    	opacity:0.1;
}
.topmenu .item h2{
	display:none;
    	position:absolute;
    	width:147px;
    	height:100px;
    	color:#222;
    	font-size:18px;
    	top:75px;
    	left:10px;
    	text-indent:10px;
    	line-height:100px;
    	text-shadow:1px 1px 1px #fff;
    	text-transform:uppercase;
}
.topmenu .item h2.active{
    color:#fff;
    text-shadow:1px 0px 1px #555;
}
.topmenu .item h3{
	display:none;
    	position:absolute;
    	width:200px;
    	height:50px;
    	color:#eee;
    	font-size:14px;
    	top:140px;
    	left:28px;
    	text-indent:0px;
    	line-height:18px;
    	text-transform:uppercase;
}
.topmenu .item ul{
	list-style:none;
	position:absolute;
	top:120px;
	left:100px;
	display:none;
}
.topmenu .item ul li a{
    	font-size:15px;
    	text-decoration:none;
    	letter-spacing:1.5px;
    	text-transform:uppercase;
    	color:#222;
    	padding:3px;
    	float:left;
    	clear:both;
    	width:100px;
    	text-shadow:1px 1px 1px #fff;
}
.topmenu .item ul li a:hover{
    	background-color:#fff;
    	color:#444;
    	-moz-border-radius:5px;
    	-webkit-border-radius:5px;
    	border-radius:5px;
    	-moz-box-shadow:1px 1px 4px #666;
    	-webkit-box-shadow:1px 1px 4px #666;
    	box-shadow:1px 1px 4px #666;
}

/* FOOTER  */

#footer{
	position:relative;
    	height:250px; 
    	margin:8% auto auto auto;
	background:#ffffff url(../img/background_half2.png) no-repeat bottom left; 
}
#footer #totop{
	width:50px;
	height:50px;
	margin-left:auto;
	border:none	
}
#footer #totop img{
	border:none	
}
#indexfooter{
    	margin-bottom:5%;
}
#indexfooter #inquiry{
	font:10px/16px Tahoma, Arial, Helvetica, sans-serif; 
	text-align:center;
	margin:auto;
}

/*	Navigation	*/

#navigation{
    height:64px;
    margin:0;
    padding:5px;
    font-family: "Trebuchet MS", sans-serif;
    font-size: 16px;
    font-style: normal;
    text-transform: uppercase;
}
#navigation .navitem{
    position:relative;
    background-color:#EFEFEF;
    float:right;
    width:51px;
    margin:0px 5px;
    height:51px;
/*
    -moz-border-radius:30px;
    -webkit-border-radius:30px;
*/
    cursor:pointer;
    overflow:hidden;
}
#navigation .navlink{
    left:2px;
    top:2px;
    position:absolute;
    width:48px;
    height:48px;
    outline:none;
}
#navigation .navicon_motivation{
    background:transparent url(../img/navicon_motivation.png) no-repeat top left;
}
#navigation .navicon_feature{
    background:transparent url(../img/navicon_feature.png) no-repeat top left;
}
#navigation .navicon_fromog{
    background:transparent url(../img/navicon_fromog.png) no-repeat top left;
}
#navigation .navicon_labintro{
    background:transparent url(../img/navicon_labintro.png) no-repeat top left;
}
#navigation .navicon_outlink{
    background:transparent url(../img/navicon_outlink.png) no-repeat top left;
}

#navigation .navitem_content{
    position:absolute;
    height:52px;
    width:220px;
    overflow:hidden;
    left:56px;
    top:7px;
    background:transparent;
}
#navigation .navitem_content h2{
    color:#aaa;
    text-shadow: 1px 1px 1px #fff;
    background-color:transparent;
    font-size:14px;
}
#navigation .navitem_content a{
    background-color:transparent;
    float:left;
    margin-right:7px;
    color:#bbb;
    text-shadow: 1px 1px 1px #fff;
    text-decoration:none;
    font-size:12px;
    outline:none;
}
#navigation .navitem_content a:hover{
    color:#336699;
}
#navigation .navitem_content p {
    background-color:transparent;
}

/* CLEAR */

.clear {clear: both; margin: 0}