/* CSS Document */
body {
	background-color:#999;
	-webkit-text-size-adjust: none;
}
body,td,th {
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
a:link {
	color: #999999;
	text-decoration: none;
}
a:visited {
	color: #999999;
	text-decoration: none;
}
a:hover {
	color: #CCCCCC;
	text-decoration: none;
}
a:active {
	color: #CCCCCC;
	text-decoration: none;
}

#v_view {
	background-color:#333;border:solid 1px #444; -webkit-box-shadow:0px 3px 6px #333; -moz-box-shadow:0px 3px 6px #333; -ms-box-shadow:0px 3px 6px #333; -o-box-shadow:0px 3px 6px #333; box-shadow:0px 3px 6px #333; 
	z-index: 1;
	position: absolute; top:50%; margin-top:-208px; left:50%; margin-left:-160px; 
	width: 319px;
	height: 416px;
}

#top_bar {
	position: absolute;	width: 320px; left: 0px; height: 45px;	top: 0px; z-index: 0;
	background-image:-webkit-gradient(linear, right bottom, right top, color-stop(0, #444), color-stop(0.53, #000));
	text-align:center; color:rgba(255, 255, 220, 0.9); font-family:"Arial Rounded MT Bold"; font-size: 20px; line-height: 45px;
	padding-top: 1px;
}
#top_bar_glossy {
	position: absolute;	width: 320px; left: 0px; height: 22px;	top: 0px; z-index: 1;
	background-color:rgba(255, 255, 255, 0.2);
}
#link_home {
	position:absolute; top:9px; left:10px; width:34px; height:25px; cursor:pointer;
	background-repeat:no-repeat; background-image:url(../img/home.png); cursor:pointer;
}
#link_email {
	position:absolute; top:11px; right:10px; width:25px; height:25px; cursor:pointer;
	background-repeat:no-repeat; background-image:url(../img/twitter.png);
	font-size:20px; line-height:25px; cursor:pointer;
}


/* loading frame */
#loading {
	height: 200px;
	width: 320px;
	margin-left: 0px;
	position: absolute;
	z-index: 3;
	left: 0px;
	top: 50px;
	font-family:Verdana, Geneva, sans-serif;
	color:#FFF;
	line-height:40px;
	text-align:center;
}
#loading .title {
	font-size:17px;
}
#loading .normal {
	font-size:14px;
}
#loading #pro-frame {
	position: absolute;	top: 80px; left: 60px; width: 200px; height: 4px; z-index:0;
	background-color:#666;
	-webkit-border-radius:2px; border-radius:2px;
}
#loading #pro-bar {
	position: absolute; top: 80px; left: 60px; height: 4px; z-index:1;
	background-color:#ccc;
	-webkit-border-radius:2px; border-radius:2px;
}


/* menu */
#menu {
	width: 320px;
	position: absolute;
	left: 0px;
	top: 45px;
	height: 370px;
}

#menu #menu-pic {
	position:absolute;
	top:20px;
	left:30px;
	width: 260px;
	height: 150px;
	background-image:url(../img/dna.png);
	background-repeat:no-repeat;
	background-position:center center;
	background-color:#FFF;
	
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px; 
	border-radius: 8px; 
	-webkit-box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.8);
	box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.8);
}

#menu .menu-obj {
	position:absolute;
	width: 250px;
	height: 35px;
	padding: 5px;
	background-color:#000;
	background-image: -webkit-gradient(linear, right bottom, right top, from(rgba(255,255,255,0)), color-stop(0.50, rgba(255,255,255,0)), color-stop(0.52, rgba(255,255,255,0.15)), to(rgba(255,255,255,0.25)));
	cursor:pointer;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px; 
	-webkit-box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.8);
	box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.8);
	left: 30px;
	
	color:#FFF; line-height:35px; font-size:17px; text-indent:10px;
}


/* Nucleobases */
#base {
	width: 320px;
	position: absolute;
	left: 0px;
	top: 45px;
	height: 370px;
}

#base #sec_obj {
	position:absolute;
	top:33px;
	width: 278px;
	height: 35px;
	padding: 5px;
	background-color: #000;

	-webkit-border-radius: 8px;
	-moz-border-radius: 8px; 
	border-radius: 8px; 
	-webkit-box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.8);
	box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.8);
	left: 15px;
}
#base #sec_obj_light {
	position:absolute;
	top:34px;
	width: 276px;
	height: 12px;
	padding: 5px;
	background-color: #fff;
	opacity:.18;

	-webkit-border-top-left-radius: 8px;
	-webkit-border-top-right-radius: 8px; 
	border-top-left-radius: 8px;
	border-top-right-radius: 8px; 
	-moz-border-radius-topleft: 8px;
	-moz-border-radius-topright: 8px;
	left: 16px;
	z-index: 2;
}
#base #sec_obj .code_box {
	position: absolute;
	height: 31px;
	width: 31px;
	top: 6px;
	background-color:#FFF;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px; 
	border-radius: 5px; 
	font-family: Trebuchet MS;
	font-size: 25px;
	color:#333;
	padding: 1px;
	text-align: center;
	line-height:31px;
	font-weight: bold;
	cursor:pointer;
	opacity:.95;
	z-index: 3;
}
#base #sec_obj #A {
	left: 18px;
}
#base #sec_obj #T {
	left: 73px;
}
#base #sec_obj #C {
	left: 128px;
}
#base #sec_obj #G {
	left: 183px;
}
#base #sec_obj #U {
	left: 238px;
}
#base #details {
	position:absolute;
	top:90px;
	width: 268px;
	height: 155px;
	padding: 10px;
	background-color: #000;
	background-image: -webkit-gradient(linear, right bottom, right top, from(rgba(255,255,255,0)), color-stop(0.50, rgba(255,255,255,0)), color-stop(0.52, rgba(255,255,255,0.15)), to(rgba(255,255,255,0.25)));

	-webkit-border-radius: 8px;
	-moz-border-radius: 8px; 
	border-radius: 8px;
	text-align: center;
	-webkit-box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.8);
	box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.8);
	left: 15px;
	color:#FFF;
	text-align:justify;
}

#base #details .title {
	font-size:16px; font-weight:bold;
}
#base #details .content {
	font-size:13px; font-family:Arial;
}

/* main interface */
#rna {
	width: 320px;
	position: absolute;
	left: 0px;
	top: 45px;
	height: 90px;
}
#aa {
	width: 320px;
	position: absolute;
	left: 0px;
	top: 125px;
	height: 296px;
}
#sec_title {
	margin: 8px;
	font-family:"Arial Rounded MT Bold";
	font-size: 16px;
	color: #fff;
}
#rna #sec_obj {
	position:absolute;
	top:33px;
	width: 278px;
	height: 35px;
	padding: 5px;
	background-color: #000;

	-webkit-border-radius: 8px;
	border-radius: 8px;
	-moz-border-radius: 8px; 
	-webkit-box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.8);
	box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.8);
	left: 15px;
}
#rna #sec_obj_light {
	position:absolute;
	top:34px;
	width: 276px;
	height: 12px;
	padding: 5px;
	background-color: #fff;
	opacity:.18;

	-webkit-border-top-left-radius: 8px;
	-webkit-border-top-right-radius: 8px; 
	border-top-left-radius: 8px;
	border-top-right-radius: 8px; 
	-moz-border-radius-topleft: 8px;
	-moz-border-radius-topright: 8px;
	left: 16px;
	z-index: 2;
}

#rna #sec_obj .code_box {
	position: absolute;
	height: 31px;
	width: 31px;
	top: 6px;
	background-color:#FFF;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px; 
	font-family: Trebuchet MS;
	font-size: 25px;
	color:#333;
	padding: 1px;
	text-align: center;
	line-height:31px;
	font-weight: bold;
	cursor:pointer;
	opacity:.95;
	z-index: 3;
}
#rna #sec_obj #c1 {
	left: 73px;
}
#rna #sec_obj #c2 {
	left: 133px;
}
#rna #sec_obj #c3 {
	left: 193px;
}

#aa #sec_obj {
	position:absolute;
	top:33px;
	width: 278px;
	height: 180px;
	padding: 5px;
	background-color: #000;

	-webkit-border-radius: 8px;
	border-radius: 8px;
	-moz-border-radius: 8px; 
	text-align: center;
	-webkit-box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.8);
	box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.8);
	left: 15px;
}
#aa #sec_obj #sec_obj_light {
	position:absolute;
	top:1px;
	width: 276px;
	height: 85px;
	padding: 5px;
	background-color: #fff;
	opacity:.18;

	-webkit-border-top-left-radius: 8px;
	-webkit-border-top-right-radius: 8px;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px; 
	-moz-border-radius-topleft: 8px;
	-moz-border-radius-topright: 8px;
	left: 1px;
	z-index: 1;
}
#aa #sec_obj #aalist {
	position: absolute;
	top:5px;
	left:43px;
	width: 200px;
	border: 1px solid #FFFFFF;
	font-family: Arial;
	font-size: 14px;
	color: #fff;
	background-color: #000;
	z-index: 3;
}
#aa #sec_obj #txt {
	position: absolute;
	width: 260px;
	left:14px;
	top:35px;
	font-size: 13px;
	color: #FFFFFF;
	height: 50px;
	font-family: Trebuchet MS;
	text-align: justify;
}
#aa #sec_obj #pic1 {
	position: absolute;
	height: 90px;
	width: 90px;
	left: 35px;
	top: 90px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px; 
}
#aa #sec_obj #pic2 {
	position: absolute;
	height: 90px;
	width: 90px;
	right: 35px;
	top: 90px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px; 
	border-radius: 8px;
}



.menu-back {
	position:absolute;
	width: 160px;
	height: 25px;
	padding: 5px;
	background-color:#000;
	background-image: -webkit-gradient(linear, right bottom, right top, from(rgba(255,255,255,0)), color-stop(0.50, rgba(255,255,255,0)), color-stop(0.52, rgba(255,255,255,0.15)), to(rgba(255,255,255,0.25)));

	cursor:pointer;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px; 
	-webkit-box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.8);
	box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.8);
	left: 75px; top:235px;
	
	color:#FFF; line-height:25px; font-size:17px; text-align:center;
}

#footage {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #CCCCCC;
	position: absolute;
	width: 320px;
	left: 0px;
	text-align: center;
	z-index: 2;
	height: 16px;
	top: 300px;
}
.ads{
	position: absolute;
	width: 320px;
	left:0px;
	bottom:0px;
}

