"

From 2012.igem.org

/* -------------------

Title: display.css Team: Shenzhen Author: BGI_K2 Twitter: @BGI_K2 Email: im.ss.kk@gmail.com

Please contact me if you would like to use this script

---

*/

body{

   background:#D9D9D9 ;

color: #D9D9D9; font-family: 'Terminal Dosis', Arial, sans-serif !important; font-size: 13px; }

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0; border-bottom: 0px; }

1. content {

width: 1040px; background: #D9D9D9; border:0px; }

.container{ position:relative; } a{ color: #fff; text-decoration: none;

outline: none !important; hide-focus: expression(this.hideFocus=true); } .clr{ clear: both; } .content{ position:relative; } h1{ margin:0px; padding:20px; font-size:32px; color:#000;

   text-shadow:1px 1px 1px rgba(255,255,255,0.9);

text-align:center; font-weight:400; } h1 span{

   display:block;

font-size:14px; color:#666;

   font-style:italic;
   font-family:Georgia, serif;

padding-top:5px; } h2 { font-size:18px !important; font-family:'Terminal Dosis', Arial, sans-serif !important; font-weight:bold !important; color: #000; } /* Header Style */ .header{ font-family:'Arial Narrow', Arial, sans-serif; line-height: 24px; font-size: 11px; background: #000; opacity: 0.9; text-transform: uppercase; z-index: 9999; position: relative; -moz-box-shadow: 1px 0px 2px #000; -webkit-box-shadow: 1px 0px 2px #000; box-shadow: 1px 0px 2px #000; } .header a{ padding: 0px 10px; letter-spacing: 1px; color: #ddd; display: block; float: left; } .header a:hover{ color: #fff; } .header span.right{ float: right; } .header span.right a{ float: none; display: inline; } .more{ position:relative; clear:both;

   font-size: 11px;
   padding: 20px 0px;
   text-transform:uppercase;
   width: 390px;
   height:55px;
   margin: 0 auto;

} .more ul{ display:block; text-align:center; } .more ul li{ display: block;

   padding: 4px 4px;
   float:left;

} .more ul li.selected a, .more ul li.selected a:hover{ background:#0099c5; color:#fff; text-shadow:none;

   font-weight:bold;

} .more ul li a{ color:#555;

   float:left;

background:#fff;

   width:64px;

padding: 2px 5px; -moz-box-shadow:1px 1px 2px #aaa; -webkit-box-shadow:1px 1px 2px #aaa; box-shadow:1px 1px 2px #aaa; } .more ul li a:hover{ background:#000; color:#fff; } ul li { list-style:none; }

a, p{ font-size:15px !important; line-height:20px !important; font-family:'Terminal Dosis', Arial, sans-serif !important; color: #D9D9D9 !important; }

1. bodymain {

position:relative; width: 865px; top:-15px; MARGIN-RIGHT: 3px; MARGIN-LEFT: auto; }

.context, #picshow, .personleftlong, .personrightlong, .personleftshort, .personrightshort{ background-color:#333; opacity:0.8; } .context:hover, #picshow:hover, #intro:hover, .personleftlong:hover, .personrightlong:hover, .personleftshort:hover, .personrightshort:hover{ opacity:1; }

1. media {

top:0px; width: 533px; height: 447px; float:left; display:inline; background-color:#666; }

1. intro {

background-color:#333; float:right; display:inline; top:0px; padding:4px; width: 320px; height: 240px; }

1. picshow {

float:right; display:inline; padding:0x; MARGIN-top: 5px; MARGIN-bottom: 0px; width: 328px; height: 194px; } .context { float:left; display:inline; MARGIN-top: 5px; MARGIN-bottom: 0px; padding: 4px #666; width: 865px; height: auto; }

.personleftlong, .personrightlong, .personleftshort, .personrightshort {

display:inline; MARGIN-top: 5px; MARGIN-bottom: 0px; padding: 4px #666; height: auto; }

.personleftlong, .personrightlong{

width: 480px; }

.personleftshort, .personrightshort{

width: 380px; }

.personintrolong,.personintroshort , .personleftshort img, .personrightshort img, .personleftlong img, .personrightlong img { position:relative; display:inline; } .personintrolong { width:292px; } .personintroshort { width:192px; } .personintrolong,.personintroshort { padding-left:4px; padding-right:4px; padding-top: auto; padding-bottom: auto; }

.personleftshort,  .personleftlong, .personleftlong img,.personleftshort img, .personrightlong .personintrolong , .personrightshort .personintroshort{

float:left; } .personrightlong, .personrightshort, .personrightshort img, .personrightlong img,.personleftlong .personintrolong ,.personleftshort .personintroshort{ float:right; } h5 { background-color:#666; font-size:15px; color:#d9d9d9 ; line-height: 24px; height: 24px auto; padding-left:5px; padding-right:5px; } .context:hover h5, #picshow:hover h5 { background-color:#FBB042; color:#333 ; } h6 { font-size:15px; color:#d9d9d9; line-height: 24px; height: 24px auto; padding-left:5px; padding-right:5px; }

1. picshow p, .context p,.context li{

list-style:none; padding-left:5px; padding-right:5px; }

1. intro img{

width:100%; height:auto; } .context li, .personintrolong li, .personintroshort li{ color:#fff; } .context:hover li, .personleftlong:hover li, .personleftshort:hover li, .personrightlong:hover li, .personrightshort:hover li{ color:#FBB042; } .context:hover table{ border:3px solid #FBB042; }

.context ul{ MARGIN-top: 10px; MARGIN-bottom: 10px; }

.figurep { width:100%; text-align: center !important; MARGIN-left: auto; MARGIN-right: auto; } .figurep img { text-align: center !important; MARGIN-left: auto; MARGIN-right: auto; } .figurep p{ width:30% auto; MARGIN-left: auto; MARGIN-right: auto; } table { background-color:#333; color:#D9D9D9 ; border:3px solid #999; text-align: center !important; MARGIN-left: auto; MARGIN-right: auto; } table td{ padding: 2px; border:2px solid #333; }

1. backtotop {

position: fixed; bottom:15px; right:15px; z-index:1000000; opacity:0.75; }

1. backtotop:hover {

opacity:1; }