Team:WPI-Worcester
From 2014.igem.org
(Difference between revisions)
m |
|||
Line 8: | Line 8: | ||
<style> | <style> | ||
body{ margin:0px; } | body{ margin:0px; } | ||
+ | div#topmargin{ | ||
+ | margin: 0px; | ||
+ | } | ||
+ | div#page{ | ||
+ | width:800px; | ||
+ | } | ||
div#floatbar { | div#floatbar { | ||
position: fixed; | position: fixed; | ||
Line 13: | Line 19: | ||
top: 0%; | top: 0%; | ||
width: 80px; | width: 80px; | ||
- | margin-top: 50px | + | margin-top: 50px; |
} | } | ||
- | div#menubar1{ padding: 24px; border:#999 1 px dashed; } | + | div#logo{ |
+ | float:left; | ||
+ | position:absolute; | ||
+ | } | ||
+ | div#title{ | ||
+ | float:left; | ||
+ | position:absolute; | ||
+ | margin-left:200px; | ||
+ | } | ||
+ | div#menubar1{ | ||
+ | padding: 24px; | ||
+ | border:#999 1 px dashed; | ||
+ | width: 100px; | ||
+ | margin-right:50px; | ||
+ | margin-left:80px; | ||
+ | float:left; | ||
+ | } | ||
div#menubar1 > a{ | div#menubar1 > a{ | ||
font-family:Arial, Helvetica, sans-serif; | font-family:Arial, Helvetica, sans-serif; | ||
font-size:17px; | font-size:17px; | ||
- | + | padding: 8px 10px; | |
- | padding: | + | |
color:#000; | color:#000; | ||
margin-right: 10px; | margin-right: 10px; | ||
margin-bottom: 5px; | margin-bottom: 5px; | ||
text-decoration:none; | text-decoration:none; | ||
- | |||
float:left; | float:left; | ||
transition: background 0.3s ease-in-out 0s, color 0.4s ease-in-out 0s; | transition: background 0.3s ease-in-out 0s, color 0.4s ease-in-out 0s; | ||
} | } | ||
- | div#menubar1 > a | + | div#menubar1 > .menuslide > a{ |
- | + | font-family:Arial, Helvetica, sans-serif; | |
- | color: # | + | font-size:20px; |
+ | padding: 8px 10px; | ||
+ | color:#000; | ||
+ | margin-right: 10px; | ||
+ | margin-bottom: 5px; | ||
+ | text-decoration:none; | ||
+ | float:left; | ||
+ | transition: background 0.3s ease-in-out 0s, color 0.4s ease-in-out 0s; | ||
+ | } | ||
+ | div#menubar1 > .menuslide > p{ | ||
+ | font-family:Arial, Helvetica, sans-serif; | ||
+ | font-size:20px; | ||
+ | padding: 8px 10px; | ||
+ | color:#000; | ||
+ | margin-left: 120px; | ||
+ | margin-bottom: 5px; | ||
+ | text-decoration:none; | ||
+ | transition: -webkit-transform .2s ease-in-out 0s, ease-in-out 0s; | ||
+ | -moz-transition: transform .2s ease-in-out 0s, ease-in-out 0s; | ||
+ | -ms-transition: transform .2s ease-in-out 0s, ease-in-out 0s; | ||
+ | transition: transform .2s ease-in-out 0s, ease-in-out 0s; | ||
+ | } | ||
+ | div#menubar1 > .menuslide:hover > p{ | ||
+ | transform: translateX(40px); | ||
+ | -moz-transform: translateX(40px); | ||
+ | -webkit-transform: translateX(40px); | ||
+ | -ms-transform: translateX(40px); | ||
+ | -o-transform: translateX(40px); | ||
} | } | ||
- | + | div#maintext { | |
- | { | + | float: left; |
- | float:left; | + | width: 400px; |
+ | font-family:Arial, Helvetica, sans-serif; | ||
+ | font-size:14px; | ||
+ | margin:50px; | ||
+ | margin-bottom:20px; | ||
+ | |||
} | } | ||
- | |||
- | |||
- | + | div#lab { | |
- | + | font-family:Arial, Helvetica, sans-serif; | |
- | + | font-size:30px; | |
- | + | margin-left:50px; | |
- | + | float: left; | |
+ | } | ||
- | + | #down figure{ | |
- | + | position: absolute; | |
+ | margin:0; | ||
+ | -webkit-animation:xfade 10s infinite ease-in-out; | ||
+ | -moz-animation:xfade 10s infinite ease-in-out; | ||
+ | -o-animation:xfade 10s infinite ease-in-out; | ||
+ | animation:xfade 10s infinite ease-in-out; | ||
+ | } | ||
- | |||
- | + | @-webkit-keyframes xfade{ | |
- | + | 0%{ | |
+ | opacity: 1; | ||
+ | } | ||
+ | 17% { | ||
+ | opacity:1; | ||
+ | } | ||
+ | 25%{ | ||
+ | opacity: 0; | ||
+ | } | ||
+ | 92% { | ||
+ | opacity:0; | ||
+ | } | ||
+ | 100% { | ||
+ | opacity:1; | ||
+ | } | ||
+ | } | ||
+ | @keyframes xfade{ | ||
+ | from{opacity:1;} | ||
+ | to{opacity:0;} | ||
+ | } | ||
- | |||
- | |||
- | |||
- | |||
- | + | figure#top { | |
- | + | -webkit-animation-delay: 7.5s; | |
- | + | -moz-animation-delay: 7.5s; | |
- | + | animation-delay: 7.5s; | |
- | + | } | |
- | + | figure#pic2 { | |
- | + | -webkit-animation-delay: 5s; | |
- | + | -moz-animation-delay: 5s; | |
- | + | animation-delay: 5s; | |
- | + | } | |
- | + | figure#pic3 { | |
- | + | -webkit-animation-delay: 2.5s; | |
+ | -moz-animation-delay: 2.5s; | ||
+ | animation-delay: 2.5s; | ||
+ | } | ||
+ | figure#pic4 { | ||
+ | -webkit-animation-delay: 0s; | ||
+ | -moz-animation-delay: 0s; | ||
+ | animation-delay: 0s; | ||
+ | } | ||
+ | |||
+ | #down figure#top{ | ||
+ | opacity:0; | ||
+ | } | ||
- | < | + | </style> |
- | This | + | |
- | </ | + | <!--Float Bar--> |
- | </ | + | <div id="floatbar"> |
+ | <a href="https://2014.igem.org/Main_Page"> <img src= "https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" align="right" width="55px"/></a> | ||
+ | </div> | ||
+ | <div id="topmargin" /> | ||
+ | <div id="page"> | ||
+ | <div id="logo"> | ||
+ | <img src="https://static.igem.org/mediawiki/2014/c/c8/WPI_Team_Logo.png" width="300px"/> | ||
+ | </div> | ||
+ | <div id="title"> | ||
+ | <img src="https://static.igem.org/mediawiki/2014/9/9a/WPI_Title.png" width="800px"/> | ||
+ | </> | ||
+ | <div id="menubar1"> | ||
+ | <div class="menuslide"> | ||
+ | <a href="https://2014.igem.org/Team:WPI-Worcester"> Home </a> | ||
+ | <p><img src="https://static.igem.org/mediawiki/2014/f/f8/WPI_Home_Link.png"/></p> | ||
+ | </div> | ||
+ | <div class="menuslide"> | ||
+ | <a href="https://2014.igem.org/Team:WPI-Worcester/Team"> Team </a> | ||
+ | <p><img src="https://static.igem.org/mediawiki/2014/6/64/WPI_Team_Link.png"/></p> | ||
+ | </div> | ||
+ | <div class="menuslide"> | ||
+ | <a href="https://igem.org/Team.cgi?id=1423"> Official </a> | ||
+ | <p><img src="https://static.igem.org/mediawiki/2014/a/af/WPI_Official_Link.png"/></p> | ||
+ | </div> | ||
+ | <div class="menuslide"> | ||
+ | <a href="https://2014.igem.org/Team:WPI-Worcester/Project"> Project </a> | ||
+ | <p><img src="https://static.igem.org/mediawiki/2014/4/41/WPI_Project_Link.png"/></p> | ||
+ | </div> | ||
+ | <div class="menuslide"> | ||
+ | <a href="https://2014.igem.org/Team:WPI-Worcester/Notebook"> Notebook </a> | ||
+ | <p><img src="https://static.igem.org/mediawiki/2014/7/7e/WPI_Notes_Link.png"/></p> | ||
+ | </div> | ||
+ | <div class="menuslide"> | ||
+ | <a href="https://2014.igem.org/Team:WPI-Worcester/Safety"> Safety </a> | ||
+ | <p><img src="https://static.igem.org/mediawiki/2014/d/d4/WPI_Safety_Link.png"/></p> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div id="maintext"> | ||
+ | This wiki is under heavy construction. Look under the Notebook tab for our experiments. | ||
+ | </div> | ||
+ | <div id="lab"> | ||
+ | Gateway Labs | ||
+ | <div id="down"> | ||
+ | <figure id="top"> | ||
+ | <img src="http://i.imgur.com/iD2knlx.jpg" height=300px /> | ||
+ | </figure> | ||
+ | <figure id="pic2"> | ||
+ | <img src="http://i.imgur.com/GOsAvOI.jpg" height=300px /> | ||
+ | </figure> | ||
+ | <figure id="pic3"> | ||
+ | <img src="http://i.imgur.com/jwGcKeB.jpg" height=300px /> | ||
+ | </figure> | ||
+ | <figure id="pic4"> | ||
+ | <img src="http://i.imgur.com/uiMsH2C.jpg" height=300px /> | ||
+ | </figure | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
</html> | </html> |
Revision as of 17:50, 2 July 2014
>
This wiki is under heavy construction. Look under the Notebook tab for our experiments.
Gateway Labs