Template:Team:NCTU Formosa/header-home

From 2012.igem.org

(Difference between revisions)
 
(59 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
-
<script type="text/javascript">
 
-
//<![CDATA[
 
-
function showPopup(url) {
 
-
newwindow=window.open(url,'name','height=445,width=697,top=200,left=300,resizable');
 
-
newwindow.focus();
 
-
}
 
-
//]]>
 
-
</script>
 
<style type="text/css">  
<style type="text/css">  
/*
/*
Line 13: Line 5:
*/
*/
-
#cover-wrapper, #abstract-wrapper, #news-wrapper {
+
#cover-wrapper, #abstract-wrapper, #news-wrapper, #sharing-wrapper {
background:url(https://static.igem.org/mediawiki/2012/8/84/Px.png) transparent repeat;
background:url(https://static.igem.org/mediawiki/2012/8/84/Px.png) transparent repeat;
-moz-box-shadow:4px 4px 8px 2px rgba(20%,20%,40%,0.5);
-moz-box-shadow:4px 4px 8px 2px rgba(20%,20%,40%,0.5);
Line 23: Line 15:
-moz-border-radius: 3px;
-moz-border-radius: 3px;
padding:10px;
padding:10px;
 +
}
 +
#sharing-wrapper {
 +
height: 180px;
 +
width: 47%;
 +
float: right;
}
}
#cover-wrapper {
#cover-wrapper {
Line 58: Line 55:
}
}
#news-title span {
#news-title span {
 +
display: none;
 +
}
 +
#sharing-title {
 +
width: 307px;
 +
height: 30px!important;
 +
background:url(https://static.igem.org/mediawiki/2012/d/db/Subtitle-sharing.png) transparent no-repeat;
 +
}
 +
#sharing-title span {
display: none;
display: none;
}
}
.date {
.date {
 +
float:left;
 +
margin:10px;
 +
margin-top:0px;
font-weight:normal!important;
font-weight:normal!important;
text-indent:0px!important;
text-indent:0px!important;
line-height: 1!important;
line-height: 1!important;
-
width: 130px; height: 160px;
+
width: 65px; height: 80px;
background: #fcfcfc;  
background: #fcfcfc;  
background: linear-gradient(top, #fcfcfc 0%,#dad8d8 100%);  
background: linear-gradient(top, #fcfcfc 0%,#dad8d8 100%);  
background: -moz-linear-gradient(top, #fcfcfc 0%, #dad8d8 100%);  
background: -moz-linear-gradient(top, #fcfcfc 0%, #dad8d8 100%);  
background: -webkit-linear-gradient(top, #fcfcfc 0%,#dad8d8 100%);  
background: -webkit-linear-gradient(top, #fcfcfc 0%,#dad8d8 100%);  
-
border: 1px solid #d2d2d2;
+
border: 0px;
-
border-radius: 10px;
+
border-radius: 5px;
-
-moz-border-radius: 10px;
+
-moz-border-radius: 5px;
-
-webkit-border-radius: 10px;
+
-webkit-border-radius: 2px;
box-shadow: 0px 0px 15px rgba(0,0,0,0.1);
box-shadow: 0px 0px 15px rgba(0,0,0,0.1);
-moz-box-shadow: 0px 0px 15px rgba(0,0,0,0.1);
-moz-box-shadow: 0px 0px 15px rgba(0,0,0,0.1);
Line 78: Line 86:
}
}
.date p {
.date p {
 +
margin:0!important;
text-indent:0px!important;
text-indent:0px!important;
line-height: 1!important;
line-height: 1!important;
font-family: Helvetica, sans-serif;
font-family: Helvetica, sans-serif;
-
font-size: 100px; text-align: center; color: #9e9e9e;  
+
font-size: 50px; text-align: center; color: #9e9e9e;  
}
}
Line 91: Line 100:
background: -moz-linear-gradient(top, #d10000 0%, #7a0909 100%);
background: -moz-linear-gradient(top, #d10000 0%, #7a0909 100%);
background: -webkit-linear-gradient(top, #d10000 0%, #7a0909 100%);
background: -webkit-linear-gradient(top, #d10000 0%, #7a0909 100%);
-
font-size: 45px; font-weight: bold; color: #fff; text-transform: uppercase;
+
font-size: 22px; font-weight: bold; color: #fff; text-transform: uppercase;
display: block;
display: block;
-
border-top: 3px solid #a13838;
+
border-top: 2px solid #a13838;
-
border-radius: 0 0 10px 10px;
+
border-radius: 0 0 5px 5px;
-
-moz-border-radius: 0 0 10px 10px;
+
-moz-border-radius: 0 0 5px 5px;
-
-webkit-border-radius: 0 0 10px 10px;
+
-webkit-border-radius: 0 0 5px 5px;
-
padding: 6px 0 6px 0!impottant;
+
padding: 3px 0 3px 0!important;
}
}
@-moz-document url-prefix() {
@-moz-document url-prefix() {
     .date {
     .date {
-
         padding: 16px 0 0 0;
+
         padding: 8px 0 0 0;
     }
     }
     .date p span {
     .date p span {
     padding: 9px 0 3px 0;
     padding: 9px 0 3px 0;
     }
     }
 +
}
 +
.anews {
 +
padding-bottom:5px;
 +
margin-top:5px;
 +
border-bottom: 1px #666 dotted;
 +
}
 +
.firstn {
 +
border-bottom: 0;
}
}
/* slider */
/* slider */
Line 148: Line 165:
padding-left:20px;
padding-left:20px;
position:relative;
position:relative;
-
z-index:5;
+
//z-index:5;
cursor:pointer;
cursor:pointer;
}
}
Line 156: Line 173:
{
{
     width:11px; height:11px;
     width:11px; height:11px;
-
     background:transparent url(https://static.igem.org/mediawiki/2012/7/7a/Bullet.png) no-repeat 0 0;
+
     background:transparent url(https://static.igem.org/mediawiki/2012/3/35/Nctubullet.png) no-repeat 0 0;
     float:left;overflow:hidden;vertical-align:middle;cursor:pointer;
     float:left;overflow:hidden;vertical-align:middle;cursor:pointer;
     margin-right:11px;/* distance between each bullet*/
     margin-right:11px;/* distance between each bullet*/
Line 172: Line 189:
     -moz-transform:translate3d(0,0,0);
     -moz-transform:translate3d(0,0,0);
     -o-transform:translate3d(0,0,0);
     -o-transform:translate3d(0,0,0);
 +
}
 +
body {margin: 0;}
 +
#lbOverlay {
 +
z-index:2;
 +
position: fixed;
 +
left: 0;
 +
width: 100%;
 +
height: 100%;
 +
background-color: #000;
 +
cursor: pointer;
 +
}
 +
 +
#lbCenter, #lbBottomContainer {
 +
z-index:2;
 +
position: absolute;
 +
left: 50%;
 +
overflow: hidden;
 +
background-color: #fff; text-align: center; padding: 5px;
 +
}
 +
 +
.lbLoading {
 +
z-index:2;
 +
background: #fff url(https://static.igem.org/mediawiki/2012/4/42/Loading.gif) no-repeat center;
 +
}
 +
 +
#lbImage {
 +
z-index:2;
 +
border: 10px solid #fff;
 +
}
 +
 +
#lbPrevLink, #lbNextLink {
 +
z-index:2;
 +
display: block;
 +
position: absolute;
 +
top: 0;
 +
width: 50%;
 +
outline: none;
 +
}
 +
 +
#lbBottom {
 +
z-index:2;
 +
font-family: Verdana, Helvetica, sans-serif;
 +
font-size: 10px;
 +
color: #666;
 +
line-height: 1.4em;
 +
text-align: left;
 +
border: 5px solid #fff;
 +
border-top-style: none;
 +
}
 +
 +
#lbCloseLink {
 +
z-index:2;
 +
display: block;
 +
float: right;
 +
width: 66px;
 +
height: 22px;
 +
background: transparent url(https://static.igem.org/mediawiki/2012/8/8e/Closelabel.gif) no-repeat center;
 +
margin: 5px 0;
 +
}
 +
#lbCaption, #lbNumber {
 +
z-index:2;
 +
margin-right: 71px;
 +
}
 +
#lbCaption {
 +
z-index:2;
 +
font-weight: bold;
 +
}
 +
#sharingbutton {
 +
width:290px;
 +
margin-left:150px;
 +
}
 +
.coolHandLuke {
 +
display: inline-block;
 +
margin: 0;
 +
width:160px;
 +
}
 +
.coolHandLuke li,
 +
.coolHandLuke li a,
 +
.coolHandLuke li span {
 +
height:23px;
 +
display: block;
 +
float: left;
 +
}
 +
.coolHandLuke li a {
 +
width: 150px;
 +
}
 +
.coolHandLuke li {
 +
font: 14px/145% Verdana;
 +
margin-bottom: 25px;
 +
-moz-border-radius: 4px;
 +
-webkit-border-radius: 4px;
 +
border-radius: 4px;
 +
box-shadow: 1px 7px 2px 0 rgba(0,0,0,0.3);
 +
cursor: pointer;
 +
-webkit-transition: all 0.1s linear;
 +
-moz-transition: all 0.1s linear;
 +
transition: all 0.1s linear;
 +
}
 +
.coolHandLuke li:first-child {
 +
margin-left: 0;
 +
}
 +
.coolHandLuke li a {
 +
border-left-width: 0;
 +
-moz-border-radius: 0 4px 4px 0;
 +
-webkit-border-radius: 0 4px 4px 0;
 +
border-radius: 0 4px 4px 0;
 +
font-family: 'Verdana';
 +
font-weight: 500;
 +
color: #838383;
 +
text-shadow: 0 1px 0 #FFF;
 +
padding: 5px 15px;
 +
background: #e7e7f9;
 +
background: -moz-linear-gradient(top, #f7f7f7 0%, #e7e7f9 100%);
 +
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f7f7f7), color-stop(100%,#e7e7f9));
 +
-moz-box-shadow: 0 -1px 0 0 rgba(255,255,255,0.5) inset, 0 5px 0 0 #c4c5d5, 0 1px 0 0 #FFF inset;
 +
-webkit-box-shadow: 0 -1px 0 0 rgba(255,255,255,0.5) inset, 0 5px 0 0 #c4c5d5, 0 1px 0 0 #FFF inset;
 +
box-shadow: 0 -1px 0 0 rgba(255,255,255,0.5) inset, 0 5px 0 0 #c4c5d5, 0 1px 0 0 #FFF inset;
 +
border-bottom-width: 0;
 +
-webkit-transition: all 0.1s linear;
 +
-moz-transition: all 0.1s linear;
 +
transition: all 0.1s linear;
 +
}
 +
.coolHandLuke li span {
 +
-moz-border-radius: 4px 0 0 4px;
 +
-webkit-border-radius: 4px 0 0 4px;
 +
border-radius: 4px 0 0 4px;
 +
-moz-box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 5px 0 0 #447700;
 +
-webkit-box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 5px 0 0 #447700;
 +
box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 5px 0 0 #447700;
 +
background: #f7f7f7;
 +
background: -moz-linear-gradient(top, #98c100 0%, #659506 100%);
 +
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#98c100), color-stop(100%,#659506));
 +
text-shadow: 0 1px 0 rgba(0,0,0,0.3);
 +
color: #FFF;
 +
font-weight: bold;
 +
padding: 5px 5px;
 +
-webkit-transition: all 0.1s linear;
 +
-moz-transition: all 0.1s linear;
 +
transition: all 0.1s linear;
 +
}
 +
.coolHandLuke li span.green {
 +
background: #98c100;
 +
background: -moz-linear-gradient(top, #98c100 0%, #659506 100%);
 +
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#98c100), color-stop(100%,#659506));
 +
text-shadow: 0 1px 0 rgba(0,0,0,0.3);
 +
box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 5px 0 0 #722300;
 +
-moz-box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 5px 0 0 #722300;
 +
-webkit-box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 5px 0 0 #722300;
 +
 +
}
 +
.coolHandLuke li span.red {
 +
background: #ee706b;
 +
background: -moz-linear-gradient(top, #ee706b 0%, #9c3107 100%);
 +
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ee706b), color-stop(100%,#9c3107));
 +
text-shadow: 0 1px 0 rgba(0,0,0,0.3);
 +
box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 5px 0 0 #722300;
 +
-moz-box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 5px 0 0 #722300;
 +
-webkit-box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 5px 0 0 #722300;
 +
 +
}
 +
.coolHandLuke li span.yellow {
 +
background: #ffd800;
 +
background: -moz-linear-gradient(top, #ffd800 0%, #ffb400 100%);
 +
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffd800), color-stop(100%,#ffb400));
 +
box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 5px 0 0 #c79700;
 +
-moz-box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 5px 0 0 #c79700;
 +
-webkit-box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 5px 0 0 #c79700;
 +
}
 +
 +
 +
.coolHandLuke li:hover a {
 +
background: -moz-linear-gradient(top, #FFFFFF 0%, #e7e7f9 100%);
 +
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFFFFF), color-stop(100%,#e7e7f9));
 +
text-decoration:none;
 +
}
 +
.coolHandLuke li:hover span.green {
 +
background: -moz-linear-gradient(top, #abcc00 0%, #659506 100%);
 +
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#abcc00), color-stop(100%,#659506));
 +
}
 +
.coolHandLuke li:hover span.red {
 +
background: -moz-linear-gradient(top, #f0807c 0%, #9c3107 100%);
 +
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f0807c), color-stop(100%,#9c3107));
 +
}
 +
.coolHandLuke li:hover span.yellow {
 +
background: -moz-linear-gradient(top, #ffe300 0%, #ffb400 100%);
 +
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffe300), color-stop(100%,#ffb400));
 +
}
 +
 +
.coolHandLuke li:active {
 +
-webkit-transform: translateY(3px);
 +
-moz-transform: translateY(3px);
 +
transform: translateY(3px);
 +
}
 +
 +
.coolHandLuke li:active a {
 +
box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 2px 0 0 #cecfe0;
 +
-moz-box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 2px 0 0 #cecfe0;
 +
-webkit-box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 2px 0 0 #cecfe0;
 +
}
 +
.coolHandLuke li:active span {
 +
box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 2px 0 0 #447700;
 +
-moz-box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 2px 0 0 #447700;
 +
-webkit-box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 2px 0 0 #447700;
 +
}
 +
.coolHandLuke li:active {
 +
box-shadow: 1px 3px 2px 0 rgba(0,0,0,0.3);
 +
-moz-box-shadow: 1px 3px 2px 0 rgba(0,0,0,0.3);
 +
-webkit-box-shadow: 1px 3px 2px 0 rgba(0,0,0,0.3);
 +
}
 +
.coolHandLuke li:active span.red {
 +
box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 2px 0 0 #722300;
 +
-moz-box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 2px 0 0 #722300;
 +
-webkit-box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 2px 0 0 #722300;
 +
}
 +
.coolHandLuke li:active span.yellow {
 +
-moz-box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 2px 0 0 #c79700;
 +
-webkit-box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 2px 0 0 #c79700;
 +
box-shadow: 0 -1px 0 0 rgba(255,255,255,0.2) inset, 0 2px 0 0 #c79700;
}
}
</style>
</style>
 +
<script src="https://2012.igem.org/Template:Team:NCTU_Formosa/mtool?action=raw"></script>
 +
<script src="https://2012.igem.org/Template:Team:NCTU_Formosa/swfo?action=raw"></script>
 +
<script src="https://2012.igem.org/Template:Team:NCTU_Formosa/vbox?action=raw"></script>
</head>
</head>
<body>
<body>
Line 179: Line 417:
<div id="header">
<div id="header">
   <div id="title">
   <div id="title">
-
     <p>NCTU_Formosa</p>
+
<div id="tmenu">
 +
<ul>
 +
<li class="m1"><a href="https://2012.igem.org" title="iGEM 2012">iGEM 2012</a></li>
 +
<li class="m2"><a href="https://igem.org/Team.cgi?year=2012&team_name=NCTU_Formosa" title="Official Team Profile">Official Team Profile</a></li>
 +
     <span><p>NCTU_Formosa</p></span>
 +
</ul>
 +
</div>
   </div>
   </div>
   <div id="menu">
   <div id="menu">
     <ul>
     <ul>
       <li class="m1 current"><a href="https://2012.igem.org/Team:NCTU_Formosa" title="Home" class="current">Home</a></li>
       <li class="m1 current"><a href="https://2012.igem.org/Team:NCTU_Formosa" title="Home" class="current">Home</a></li>
-
       <li class="m2"><a href="https://2012.igem.org/Team:NCTU_Formosa/Project" title="Project" class="link">Project</a></li>
+
       <li class="m2"><a href="https://2012.igem.org/Team:NCTU_Formosa/Project" title="Project" class="link">Project</a>
-
       <li class="m3"><a href="https://2012.igem.org/Team:NCTU_Formosa/Team" title="Team" class="link">Team</a></li>
+
<ul id="m2s" class="ms">
 +
<li class="ms1"><a href="https://2012.igem.org/Team:NCTU_Formosa/Project">Introduction</a></li>
 +
<li class="ms2"><a href="https://2012.igem.org/Team:NCTU_Formosa/Project-sub2">Project Details</a></li>
 +
<li class="ms3"><a href="https://2012.igem.org/Team:NCTU_Formosa/Project-sub3">Conclusion</a></li>
 +
<li class="ms4"><a href="https://2012.igem.org/Team:NCTU_Formosa/Project-sub4">Optimization</a></li>
 +
<li class="ms5"><a href="https://2012.igem.org/Team:NCTU_Formosa/Project-sub5">Future Works</a></li>
 +
</ul>
 +
</li>
 +
      <li class="m8"><a href="https://2012.igem.org/Team:NCTU_Formosa/Modeling" title="Modeling" class="link">Modeling</a></li>
 +
       <li class="m3"><a href="https://2012.igem.org/Team:NCTU_Formosa/Team" title="Team" class="link">Team</a>
 +
<ul id="m3s" class="ms">
 +
<li class="ms1"><a href="https://2012.igem.org/Team:NCTU_Formosa/Team#sub1">Members & Advisors</a></li>
 +
<li class="ms2"><a href="https://2012.igem.org/Team:NCTU_Formosa/Team#sub2">Host Lab</a></li>
 +
<li class="ms3"><a href="https://2012.igem.org/Team:NCTU_Formosa/Team#sub3">Gallery</a></li>
 +
<li class="ms4"><a href="https://2012.igem.org/Team:NCTU_Formosa/Team#sub4">Notes</a></li>
 +
</ul>
 +
</li>
       <li class="m4"><a href="https://2012.igem.org/Team:NCTU_Formosa/Parts" title="Parts Submitted" class="link">Parts Submitted</a></li>
       <li class="m4"><a href="https://2012.igem.org/Team:NCTU_Formosa/Parts" title="Parts Submitted" class="link">Parts Submitted</a></li>
-
       <li class="m5"><a href="https://2012.igem.org/Team:NCTU_Formosa/Safety" title="Safety" class="link">Satety</a></li>
+
       <li class="m5"><a href="https://2012.igem.org/Team:NCTU_Formosa/Safety" title="Safety" class="link">Safety</a></li>
-
       <li class="m6"><a href="https://2012.igem.org/Team:NCTU_Formosa/HumanPractice" title="Human Practice" class="link">Human Practice</a></li>
+
       <li class="m6"><a href="https://2012.igem.org/Team:NCTU_Formosa/HumanPractice" title="Human Practice" class="link">Human Practice</a>
-
      <li class="m7"><a href="https://igem.org/Team.cgi?year=2012&team_name=NCTU_Formosa" title="Official Team Profile" class="link">Official Team Profile</a></li>
+
<ul id="m6s" class="ms">
 +
<li class="ms2"><a href="https://2012.igem.org/Team:NCTU_Formosa/HumanPractice#sub2-1">Bio-camp</a></li>
 +
<li class="ms3"><a href="https://2012.igem.org/Team:NCTU_Formosa/HumanPractice#sub2-2">iGEM Cooperation</a></li>
 +
<li class="ms4"><a href="https://2012.igem.org/Team:NCTU_Formosa/HumanPractice#sub2-3">Popularization on Campus</a></li>
 +
<li class="ms5"><a href="https://2012.igem.org/Team:NCTU_Formosa/HumanPractice#sub2-4">Popular Science Creation</a></li>
 +
<li class="ms6"><a href="https://2012.igem.org/Team:NCTU_Formosa/HumanPractice#sub2-5">Surveys</a></li>
 +
<li class="ms7"><a href="https://2012.igem.org/Team:NCTU_Formosa/HumanPractice#sub2-6">L-shaped Folders</a></li>
 +
<li class="ms8"><a href="https://2012.igem.org/Team:NCTU_Formosa/HumanPractice#sub3">Gallery</a></li>
 +
</ul>
 +
</li>
     </ul>
     </ul>
   </div>
   </div>
</div>
</div>
</div>
</div>

Latest revision as of 16:49, 26 October 2012

Retrieved from "http://2012.igem.org/Template:Team:NCTU_Formosa/header-home"