Template:WHUcss

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href='http://fonts.googleapis.com/css?family=Prata|Vidaloka|Adamina|Andika|Vollkorn|Numans|Tienne|Alice|Lobster|Droid+Serif|Droid+Sans|Open+Sans|Oswald|PT+Sans|Ubuntu' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Molengo' rel='stylesheet' type='text/css'>
<style type="text/css">

html, body {
font-family:Calibri;
  margin: 0;
  padding: 0;
}
#visit h3
{
font-family: 'Lobster',arial,tahoma,宋体b8b\4f53,sans-serif, cursive;
font-size:22px;
color:#EB5649;
}
div.back
{
 background:#FCD208;
 height:160px
}

.static
{
font-size:22px;
font-style:semi-bold;
margin:5px;
font-family: 'Vollkorn',arial,tahoma,宋体b8b\4f53,sans-serif;
color:#4CB848;
}
.dyna
{
font-size:25px;
margin:5px;
font-family: 'Vollkorn',arial,tahoma,宋体b8b\4f53,sans-serif;
font-style:Italic;
color:#EB5649;
}
#countdown title h3
{ 
  font-family: 'Lobster',arial,tahoma,宋体b8b\4f53,sans-serif, cursive;
font-size:22px;
color:#EB5649;
}

#menus
{
height:26px;
text-align:center;
position:absolute;
top:165px;
width:960px;
left:32px;	
}
  
#menus ul li ul{
	position:absolute; 
         z-index:99; 
        display:none;
        top:22px; 
        left:-19px;
         -webkit-border-radius: 5px;
        -moz-border-radius:5px;
        background-color:#FFF;
       
}
#menus ul li ul a li
{
display:block; width:118px; height:26px;-moz-border-radius:5px; -webkit-border-radius: 5px;
        
}
li.mainlevel
{
 -webkit-border-radius: 5px;
 -moz-border-radius:5px; 
}
#menulist a
{
width:90px;
}
#menus ul li
{
position:relative;
width:88px;   
float:left; 
height:26px;  
display:inline; 
padding:0px 5px;

}
#menus ul li a{
        font-size:18.5px; 
        text-decoration:none;
        color:black;
        height:26px;
        z-index:99;
        width:118px;
        font-family: 'Lobster',arial,tahoma,宋体b8b\4f53,sans-serif, cursive;
      
	}
#menulist a:hover{color:#fff;text-decoration:none;}



#groupparts
{
position:absolute;
top:230px;
z-index:1;
left:150px;
}
#head{margin:auto; width:1000px;}
#title
{text-align:center;}
#countdown
{
position:absolute;
-webkit-border-radius: 5px;
-moz-border-radius:5px;
width:170px;
height:200px;
top:1460px;
background:#FCD208;
left:1010px;
font-size:15px;
}
#follow
{
position:absolute;
-webkit-border-radius: 5px;
-moz-border-radius:5px;
text-align:center;
width:170px;
height:120px;
top:1300px;
background:#FCD208;
left:1010px;
font-size:15px;
}
#follow h3
{
font-family: 'Lobster',arial,tahoma,宋体b8b\4f53,sans-serif, cursive;
font-size:22px;
color:#EB5649;
}
#back
{
text-align:left;
}
#visit
{
position:absolute;
text-align:center;
-webkit-border-radius: 5px;
-moz-border-radius:5px;
width:170px;
height:150px;
top:1700px;
left:1015px;
background:#FCD208;
}


 
#WHU1 {
        position:relative;
	height: 220px;
	width: 1000px;
        top:-26px;
}

/*我自己的css内容*/

.firstHeading 
{ display:none; }
#top-section {
border:hidden;
}

#siteSub {
display:none;
}

#search-controls {
display:none;
}

.firstHeading {
display:none;
}

#search-controls {
margin-top:0px;
}

#catlinks
{display:none;}

#contentSub {
display:none;
}

#siteSub {
display:none;
}

#search-controls {
display:none;
}

.firstHeading {
display:none;
}

#search-controls {
margin-top:0px;
}


.left-menu {
margin-top:-12px;
}

.right-menu {
margin-top:-12px;
}

.left-menu ul {
border: none;
}

#menubar li a {
	color:#8C8984;
         background-color:transparent
}

#menubar ul {
	color:transparent;
        background-color:transparent;
        border:none;
}


.left-menu {
	left:0;
	padding-left: 0px;
}
.right-menu  {
	right:0;
       
}

.firstHeading { display:none; }
}


#menubar.right-menu {
margin-top:-12px;
}

.right-menu ul {
border: none;
}


#content
{
background-color:transparent;
height:auto;
border:none;
}
#content1
{
position:absolute;
background-image:url(/wiki/images/c/c0/Whu-backpeice.jpg);
background-repeat:repeat;
z-index:1;
width:1000px;
margin-left:5px;
top:204px;
}
#p-logo
{
display:none;
}
#menubar {
        color:transparent;
	font-size:85%;
	line-height:1em;
	position:absolute;
	top:10px;
	white-space:nowrap;
	width:50%;
	z-index:5;
	height:20px;
	overflow:hidden;
        border:none;

}
#footer-box
{
display:none;
}
#top-section {
	height: 10px;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://gettopup.com/releases/latest/top_up-min.js"></script>
<script type="text/javascript">

var mouseover_tid = [];
var mouseout_tid = [];
jQuery(document).ready(function(){
	jQuery('#menulist > li').each(function(index){
		jQuery(this).hover(

			function(){
				var _self = this;
				clearTimeout(mouseout_tid[index]);
				mouseover_tid[index] = setTimeout(function() {
					jQuery(_self).css({"background":"#BA353E"}).find('ul:eq(0)').slideDown(230);
				}, 50);
			},

			function(){
				var _self = this;
				clearTimeout(mouseover_tid[index]);
				mouseout_tid[index] = setTimeout(function() {
					jQuery(_self).css({"background":"transparent"}).find('ul:eq(0)').slideUp(70);
				}, 50);
			}

		);
	});
$("#menus ul li ul a li").hover(function(){
     $(this).css({"background-color":"#BA353E"});
	 },function(){
	 $(this).css({"background-color":"transparent"});
	 })
});
$(function() {
		$( "#tabs" ).tabs().addClass( "ui-tabs-vertical ui-helper-clearfix" );
		$( "#tabs li" ).removeClass( "ui-corner-top" ).addClass( "ui-corner-left" );
	});

</script>
</head>
<body  background="/wiki/images/4/4e/WHU-Background.jpg">
<div id="content">
<div class="WHUlogo" id="WHU1">
<a href="https://2011.igem.org/Team:WHU-China"><img src="/wiki/images/3/3a/Whu-Head.jpg" height="220" width="1000"></a>
<a href="https://igem.org/Main_Page" title="igem.org"><img src="/wiki/images/9/90/Whu-igem.png" height="80" width="100" style="position:absolute;top:20px;right:50px;"></a>
</div>
<div id="menus"> 
<ul id="menulist"> 
   <li class="mainlevel"> <a href="/Team:WHU-China">Home</li></a> 
   <li class="mainlevel"><a href="/Team:WHU-China/Team"> Team</a> 
         <ul> 
            <a  href="/Team:WHU-China/Team/History"><li>History</li></a> 
            <a href="/Team:WHU-China/Team/Gallary"><li >Gallery</li></a> 
            <a href="/Team:WHU-China/Team/Collaboration"><li>Collaboration</li></a>
            <a  href="/Team:WHU-China/Team/WhuUniversity"><li>Our University</li></a>
        </ul>
     </li>    
     <li class="mainlevel"><a href="/Team:WHU-China/Project">Project</a> 
         <ul> 
            <a href="/Team:WHU-China/Project/Overview"><li>Overview</li></a> 
           <a href="/Team:WHU-China/Project/Design"> <li >Design</li></a> 
            <a href="/Team:WHU-China/Project/Modeling"><li>Modeling</li> </a>
            <a href="/Team:WHU-China/Project/Results"><li>Results</li></a> 
            
         </ul>   
     </li> 
     <li class="mainlevel" style="width:80px;"><a href="/Team:WHU-China/Parts">Parts</a> 
         <ul>  
           
	    <a href="/Team:WHU-China/Parts/Submitted" ><li >Submitted</li></a>
            <a href="/Team:WHU-China/Parts/Data"><li>Data</li></a>
           
         </ul> 
     </li> 
     
     <li  class="mainlevel" style="width:95px"><a href="/Team:WHU-China/Notebook">Notebook</a> 
         <ul>
           <a href="/Team:WHU-China/Notebook/Daytoday"> <li >Progress</li>  </a>
            <a href="/Team:WHU-China/Notebook/Protocols"><li >Protocols</li></a> 
           
         </ul> 
     </li> 
     <li style="width:95px" class="mainlevel"><a href="/Team:WHU-China/Safety">Safety</a> 
     </li> 
     <li style="width:144px;" class="mainlevel"><a href="/Team:WHU-China/Humanpractice">Human Practice</a> 
     </li> 
     <li style="width:118px;" class="mainlevel"><a href="/Team:WHU-China/Standard">Standard</a> 
     </li> 
 
</ul>
 
</div>

<div id="countdown"><div id="title">
<h3>
Count Down</h3></div>
<div class="back">
<p class="static" id="pday"> <span class="dyna" id="sday"></span> days</p>
<p class="static" id="phour"><span class="dyna" id="shour"></span> hours</p>
<p class="static" id="pmin"> <span class="dyna" id="smin"></span> minutes</p>
<p class="static" id="psec"> <span class="dyna" id="ssec"></span> seconds</p>
</div>
</div>
<script type="text/javascript">
// to get the count time
var now = new Date();
function createtime(){
var grt= new Date("10/15/2011 8:00:00");
now.setTime(now.getTime()+250);
days = (grt - now) / 1000 / 60 / 60 / 24;
dnum = Math.floor(days);
hours = (grt - now) / 1000 / 60 / 60 - (24 * dnum);
hnum = Math.floor(hours);

minutes = (grt - now) / 1000 /60 - (24 * 60 * dnum) - (60 * hnum);
mnum = Math.floor(minutes);

seconds = (grt - now) / 1000 - (24 * 60 * 60 * dnum) - (60 * 60 * hnum) - (60 * mnum);
snum = Math.round(seconds);


if(days>0)
{
    document.getElementById("sday").innerHTML = String(dnum);
    document.getElementById("shour").innerHTML = hnum;
    document.getElementById("smin").innerHTML = mnum;
    document.getElementById("ssec").innerHTML = snum;
}
else
{
    document.getElementById("title").innerHTML = "iGEM 2011 Final";
    document.getElementById("pday").style.display = "none";
    document.getElementById("phour").innerHTML = "WHU Bioers";
    document.getElementById("pmin").innerText = "Are the";
    document.getElementById("psec").innerHTML = "BEST!";
}
}

var getd;
if(getd==null)
{
    getd = setInterval("createtime()",250);
}




$(function() 
{
		$("#accordion").accordion({
			event: "click hoverintent"
		});
	});
	
	var cfg = ($.hoverintent = {
		sensitivity: 1,
		interval: 150
	});

	$.event.special.hoverintent = {
		setup: function() {
			$( this ).bind( "mouseover", jQuery.event.special.hoverintent.handler );
		},
		teardown: function() {
			$( this ).unbind( "mouseover", jQuery.event.special.hoverintent.handler );
		},
		handler: function( event ) {
			event.type = "hoverintent";
			var self = this,
				args = arguments,
				target = $( event.target ),
				cX, cY, pX, pY;
			
			function track( event ) {
				cX = event.pageX;
				cY = event.pageY;
			};
			pX = event.pageX;
			pY = event.pageY;
			function clear() {
				target
					.unbind( "mousemove", track )
					.unbind( "mouseout", arguments.callee );
				clearTimeout( timeout );
			}
			function handler() {
				if ( ( Math.abs( pX - cX ) + Math.abs( pY - cY ) ) < cfg.sensitivity ) {
					clear();
					jQuery.event.handle.apply( self, args );
				} else {
					pX = cX;
					pY = cY;
					timeout = setTimeout( handler, cfg.interval );
				}
			}
			var timeout = setTimeout( handler, cfg.interval );
			target.mousemove( track ).mouseout( clear );
			return true;
		}
	};


	
	
	
		

</script>

</div>



</div> 

<div id="follow">
<h3>Follow Us</h3>

</div>

<div id="visit">
<h3>Visitor</h3>
<div id="clustrmaps-widget" style="position:absolute;top:5px;left:5px;"></div><script type="text/javascript">var _clustrmaps = {'url' : 'https://2011.igem.org/Team:WHU-China', 'user' : 934877, 'server' : '4', 'id' : 'clustrmaps-widget', 'version' : 1, 'date' : '2011-09-24', 'lang' : 'zh', 'corners' : 'square' };(function (){ var s = document.createElement('script'); s.type = 'text/javascript'; s.async = true; s.src = 'http://www4.clustrmaps.com/counter/map.js'; var x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x);})();</script><noscript><a href="http://www4.clustrmaps.com/user/782e43dd"><img src="http://www4.clustrmaps.com/stats/maps-no_clusters/2011.igem.org-Team-WHU-China-thumb.jpg" alt="Locations of visitors to this page" width="230" height="160" /></a></noscript>


</div>
</div>
</body>
</html>