Template:Team:NCTU Formosa/header-home

From 2012.igem.org

(Difference between revisions)
 
(47 intermediate revisions not shown)
Line 5: 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 15: 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 50: 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;
}
}
Line 102: Line 115:
     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 144: Line 165:
padding-left:20px;
padding-left:20px;
position:relative;
position:relative;
-
z-index:5;
+
//z-index:5;
cursor:pointer;
cursor:pointer;
}
}
Line 152: 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 171: Line 192:
body {margin: 0;}
body {margin: 0;}
#lbOverlay {
#lbOverlay {
-
position: absolute;
+
z-index:2;
 +
position: fixed;
left: 0;
left: 0;
width: 100%;
width: 100%;
 +
height: 100%;
background-color: #000;
background-color: #000;
cursor: pointer;
cursor: pointer;
Line 179: Line 202:
#lbCenter, #lbBottomContainer {
#lbCenter, #lbBottomContainer {
 +
z-index:2;
position: absolute;
position: absolute;
left: 50%;
left: 50%;
Line 186: Line 210:
.lbLoading {
.lbLoading {
 +
z-index:2;
background: #fff url(https://static.igem.org/mediawiki/2012/4/42/Loading.gif) no-repeat center;
background: #fff url(https://static.igem.org/mediawiki/2012/4/42/Loading.gif) no-repeat center;
}
}
#lbImage {
#lbImage {
 +
z-index:2;
border: 10px solid #fff;
border: 10px solid #fff;
}
}
#lbPrevLink, #lbNextLink {
#lbPrevLink, #lbNextLink {
 +
z-index:2;
display: block;
display: block;
position: absolute;
position: absolute;
Line 202: Line 229:
#lbBottom {
#lbBottom {
 +
z-index:2;
font-family: Verdana, Helvetica, sans-serif;
font-family: Verdana, Helvetica, sans-serif;
font-size: 10px;
font-size: 10px;
Line 212: Line 240:
#lbCloseLink {
#lbCloseLink {
 +
z-index:2;
display: block;
display: block;
float: right;
float: right;
Line 219: Line 248:
margin: 5px 0;
margin: 5px 0;
}
}
-
 
#lbCaption, #lbNumber {
#lbCaption, #lbNumber {
 +
z-index:2;
margin-right: 71px;
margin-right: 71px;
}
}
-
 
#lbCaption {
#lbCaption {
 +
z-index:2;
font-weight: bold;
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>
<script src="https://2012.igem.org/Template:Team:NCTU_Formosa/vbox?action=raw"></script>
</head>
</head>
Line 234: 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">
Line 241: Line 430:
       <li class="m2"><a href="https://2012.igem.org/Team:NCTU_Formosa/Project" title="Project" class="link">Project</a>
       <li class="m2"><a href="https://2012.igem.org/Team:NCTU_Formosa/Project" title="Project" class="link">Project</a>
<ul id="m2s" class="ms">
<ul id="m2s" class="ms">
-
<li class="ms1"><a href="https://2012.igem.org/Team:NCTU_Formosa/Project#sub1">Introduction</a></li>
+
<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="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="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="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>
+
<li class="ms5"><a href="https://2012.igem.org/Team:NCTU_Formosa/Project-sub5">Future Works</a></li>
</ul>
</ul>
</li>
</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>
       <li class="m3"><a href="https://2012.igem.org/Team:NCTU_Formosa/Team" title="Team" class="link">Team</a>
<ul id="m3s" class="ms">
<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="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">Gallery</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">Notes</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>
</ul>
</li>
</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">Safety</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
+
       <li class="m6"><a href="https://2012.igem.org/Team:NCTU_Formosa/HumanPractice" title="Human Practice" class="link">Human Practice</a>
<ul id="m6s" class="ms">
<ul id="m6s" class="ms">
-
<li class="ms1"><a href="https://2012.igem.org/Team:NCTU_Formosa/HumanPractice#sub1">Introduction</a></li>
+
<li class="ms2"><a href="https://2012.igem.org/Team:NCTU_Formosa/HumanPractice#sub2-1">Bio-camp</a></li>
-
<li class="ms2"><a href="https://2012.igem.org/Team:NCTU_Formosa/HumanPractice#sub2">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="ms3"><a href="https://2012.igem.org/Team:NCTU_Formosa/HumanPractice#sub3">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="ms4"><a href="https://2012.igem.org/Team:NCTU_Formosa/HumanPractice#sub4">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="ms5"><a href="https://2012.igem.org/Team:NCTU_Formosa/HumanPractice#sub5">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="ms6"><a href="https://2012.igem.org/Team:NCTU_Formosa/HumanPractice#sub6">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="ms7"><a href="https://2012.igem.org/Team:NCTU_Formosa/HumanPractice#sub7">L-shaped Folders</a></li>
+
<li class="ms8"><a href="https://2012.igem.org/Team:NCTU_Formosa/HumanPractice#sub3">Gallery</a></li>
</ul>
</ul>
-
</a></li>
+
</li>
-
      <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>
     </ul>
   </div>
   </div>
</div>
</div>
</div>
</div>

Latest revision as of 16:49, 26 October 2012