Team:WPI-Worcester/Team
From 2014.igem.org
(Difference between revisions)
Line 7: | Line 7: | ||
<!--CSS--> | <!--CSS--> | ||
<style> | <style> | ||
- | body{ margin:0px; } | + | #contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading,.visualClear {display: none;} |
- | + | ||
+ | body{ | ||
+ | margin:0px; | ||
+ | } | ||
+ | |||
+ | #topmargin{ | ||
+ | margin: 0px; | ||
+ | } | ||
+ | |||
+ | #bottombox{ | ||
+ | background:#999; | ||
+ | height:50px; | ||
+ | width:700px; | ||
+ | margin-top:300px; | ||
+ | margin-left:300px; | ||
+ | float:left; | ||
+ | } | ||
+ | #floatbar { | ||
position: fixed; | position: fixed; | ||
right: 10px; | right: 10px; | ||
top: 0%; | top: 0%; | ||
width: 80px; | width: 80px; | ||
- | margin-top: 50px | + | margin-top: 50px; |
} | } | ||
- | + | #logo{ | |
- | + | float:left; | |
+ | left:-400px; | ||
+ | margin-top:0px; | ||
+ | position:fixed; | ||
+ | z-index:9; | ||
+ | transition: -webkit-transform .4s ease-in-out 0s, ease-in-out 0s; | ||
+ | -moz-transition: transform .4s ease-in-out 0s, ease-in-out 0s; | ||
+ | -ms-transition: transform .4s ease-in-out 0s, ease-in-out 0s; | ||
+ | transition: transform .4s ease-in-out 0s, ease-in-out 0s; | ||
+ | } | ||
+ | #title{ | ||
+ | float:left; | ||
+ | position:absolute; | ||
+ | margin-left:200px; | ||
+ | } | ||
+ | #shift{ | ||
+ | height:75%; | ||
+ | width:100%; | ||
+ | position:absolute; | ||
+ | } | ||
+ | #shift:hover > #logo{ | ||
+ | transform: translateX(400px); | ||
+ | -moz-transform: translateX(400px); | ||
+ | -webkit-transform: translateX(400px); | ||
+ | -ms-transform: translateX(400px); | ||
+ | -o-transform: translateX(400px); | ||
+ | } | ||
+ | #shift:hover > #menubar1 { | ||
+ | opacity:1; | ||
+ | transform: translateX(260px); | ||
+ | -moz-transform: translateX(260px); | ||
+ | -webkit-transform: translateX(260px); | ||
+ | -ms-transform: translateX(260px); | ||
+ | -o-transform: translateX(260px); | ||
+ | } | ||
+ | #shift:hover + #maintext { | ||
+ | transform: translateX(260px); | ||
+ | -moz-transform: translateX(260px); | ||
+ | -webkit-transform: translateX(260px); | ||
+ | -ms-transform: translateX(260px); | ||
+ | -o-transform: translateX(260px); | ||
+ | } | ||
+ | |||
+ | #menubar1{ | ||
+ | padding: 24px; | ||
+ | opacity: 0.5; | ||
+ | width: 200px; | ||
+ | margin-right:50px; | ||
+ | margin-left:10px; | ||
+ | margin-top:80px; | ||
+ | float:left; | ||
+ | position:fixed; | ||
+ | z-index:8; | ||
+ | transition: -webkit-transform .4s ease-in-out 0s, ease-in-out 0s, opacity 0.4s ease-in-out 0s; | ||
+ | -moz-transition: transform .4s ease-in-out 0s, ease-in-out 0s, opacity 0.4s ease-in-out 0s; | ||
+ | -ms-transition: transform .4s ease-in-out 0s, ease-in-out 0s, opacity 0.4s ease-in-out 0s; | ||
+ | transition: transform .4s ease-in-out 0s, ease-in-out 0s, opacity 0.4s ease-in-out 0s; | ||
+ | } | ||
+ | #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; | ||
} | } | ||
- | + | .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; | ||
} | } | ||
- | . | + | .menuslide > p{ |
- | + | ||
- | + | ||
- | + | ||
font-family:Arial, Helvetica, sans-serif; | font-family:Arial, Helvetica, sans-serif; | ||
- | font-size:50px; | + | 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; | ||
+ | } | ||
+ | .menuslide:hover > p{ | ||
+ | transform: translateX(40px); | ||
+ | -moz-transform: translateX(40px); | ||
+ | -webkit-transform: translateX(40px); | ||
+ | -ms-transform: translateX(40px); | ||
+ | -o-transform: translateX(40px); | ||
+ | } | ||
+ | |||
+ | #toptext { | ||
+ | float: left; | ||
+ | width: 400px; | ||
+ | height: 50%; | ||
+ | font-family:Arial, Helvetica, sans-serif; | ||
+ | font-size:25px; | ||
+ | margin:140px; | ||
+ | margin-left:520px; | ||
+ | margin-bottom:20px; | ||
+ | padding:10px; | ||
+ | |||
+ | } | ||
+ | #maintext { | ||
+ | float: left; | ||
+ | width: 100%; | ||
+ | font-family:Arial, Helvetica, sans-serif; | ||
+ | font-size:25px; | ||
+ | padding:10px; | ||
+ | margin-left:400px; | ||
+ | text-decoration:none; | ||
+ | z-index:10; | ||
+ | transition: -webkit-transform .4s ease-in-out 0s, ease-in-out 0s; | ||
+ | -moz-transition: transform .4s ease-in-out 0s, ease-in-out 0s; | ||
+ | -ms-transition: transform .4s ease-in-out 0s, ease-in-out 0s; | ||
+ | transition: transform .4s ease-in-out 0s, ease-in-out 0s; | ||
+ | } | ||
+ | |||
+ | .textitem{ | ||
+ | margin:50px; | ||
+ | padding:10px; | ||
+ | float:left; | ||
+ | } | ||
+ | |||
+ | .textitem > h1 { | ||
+ | margin-right:100%; | ||
+ | margin-bottom: 5px; | ||
+ | margin:100px; | ||
} | } | ||
Line 46: | Line 178: | ||
background:#FFF; | background:#FFF; | ||
margin-bottom:100px; | margin-bottom:100px; | ||
- | margin-left: | + | margin-left:-200px; |
margin-right:100px; | margin-right:100px; | ||
float:right; | float:right; | ||
- | text-align: | + | z-index:8; |
+ | text-align:left; | ||
line-height:1.1; | line-height:1.1; | ||
font-family:Arial, Helvetica, sans-serif; | font-family:Arial, Helvetica, sans-serif; | ||
Line 97: | Line 230: | ||
opacity:1; | opacity:1; | ||
} | } | ||
- | + | ||
</style> | </style> | ||
<!--Float Bar--> | <!--Float Bar--> | ||
- | |||
<div id="floatbar"> | <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> | + | <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> | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
<body> | <body> | ||
- | <div id=" | + | <div id="topmargin" /> |
- | <a href="https://2014.igem.org/Team:WPI-Worcester"> Home </a> | + | <div id="toptext"> |
- | + | <p>Our Team Members</p> | |
- | + | <img src="http://www.wpi.edu/Images/CMS/News/iGEM_team.jpg" height="200px" /> | |
- | + | </div> | |
- | + | <div id="page"> | |
- | + | <div id="shift"> | |
- | + | <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> | ||
+ | <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> | ||
+ | <div id="maintext"> | ||
+ | |||
+ | <div class="textitem"> | ||
+ | <h1>Students<h1> | ||
</div> | </div> | ||
- | + | <div class="textitem"> | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | <div class=" | + | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
<div class="slidebar"> | <div class="slidebar"> | ||
<b>Alex Turland</b> | <b>Alex Turland</b> | ||
Line 187: | Line 296: | ||
<span class="face"> | <span class="face"> | ||
<img src="http://i.imgur.com/t79LYq4.png" height=150px /> | <img src="http://i.imgur.com/t79LYq4.png" height=150px /> | ||
- | |||
</div> | </div> | ||
</div> | </div> | ||
- | + | </div> | |
+ | <div class="textitem"> | ||
<div class="slidebar"> | <div class="slidebar"> | ||
<b>Chloe LaJeunesse</b> | <b>Chloe LaJeunesse</b> | ||
Line 203: | Line 312: | ||
<span class="face"> | <span class="face"> | ||
<img src="" height=150px /> | <img src="" height=150px /> | ||
- | |||
</div> | </div> | ||
</div> | </div> | ||
- | + | </div> | |
+ | <div class="textitem"> | ||
<div class="slidebar"> | <div class="slidebar"> | ||
<b>Corbyn Lamy</b> | <b>Corbyn Lamy</b> | ||
Line 219: | Line 328: | ||
<span class="face"> | <span class="face"> | ||
<img src="" height=150px /> | <img src="" height=150px /> | ||
- | |||
</div> | </div> | ||
</div> | </div> | ||
- | + | </div> | |
+ | <div class="textitem"> | ||
<div class="slidebar"> | <div class="slidebar"> | ||
<b>Kayla DeSanty</b> | <b>Kayla DeSanty</b> | ||
Line 235: | Line 344: | ||
<span class="face"> | <span class="face"> | ||
<img src="http://i.imgur.com/r3Suz7p.png" height=150px /> | <img src="http://i.imgur.com/r3Suz7p.png" height=150px /> | ||
- | |||
</div> | </div> | ||
</div> | </div> | ||
- | + | </div> | |
+ | <div class="textitem"> | ||
<div class="slidebar"> | <div class="slidebar"> | ||
<b>Michael Giroux</b> | <b>Michael Giroux</b> | ||
Line 251: | Line 360: | ||
<span class="face"> | <span class="face"> | ||
<img src="" height=150px /> | <img src="" height=150px /> | ||
- | |||
</div> | </div> | ||
</div> | </div> | ||
- | + | </div> | |
+ | <div class="textitem"> | ||
<div class="slidebar"> | <div class="slidebar"> | ||
<b>Shawna Henry</b> | <b>Shawna Henry</b> | ||
Line 267: | Line 376: | ||
<span class="face"> | <span class="face"> | ||
<img src="http://i.imgur.com/O1kC45H.jpg" height=150px /> | <img src="http://i.imgur.com/O1kC45H.jpg" height=150px /> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div class="textitem"> | ||
+ | <h1>Advisors<h1> | ||
+ | </div> | ||
+ | <div class="textitem"> | ||
+ | <div class="slidebar"> | ||
+ | <b>Joseph Duffy</b> | ||
+ | <div class="open"> | ||
+ | <b>Hometown:</b> <br/> | ||
+ | <b>Interests:</b> <br/> | ||
+ | <b>Favorite Flavor of Ice Cream:</b> <br/> | ||
+ | </div> | ||
+ | <div class="closed"> | ||
+ | <span class="face"> | ||
+ | <img src="" height=150px /> | ||
</div> | </div> | ||
</div> | </div> | ||
</div> | </div> | ||
- | + | <div class="textitem"> | |
+ | <div class="slidebar"> | ||
+ | <b>Natalie Farny</b> | ||
+ | <div class="open"> | ||
+ | <b>Hometown:</b> Danvers, MA<br/> | ||
+ | <b>Interests:</b> Biology, Teaching, Hiking, and Sewing<br/> | ||
+ | <b>Favorite Flavor of Ice Cream:</b> Coffee<br/> | ||
+ | </div> | ||
+ | <div class="closed"> | ||
+ | <span class="face"> | ||
+ | <img src="" height=150px /> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div id="bottombox"/> | ||
</body> | </body> | ||
- | |||
- | |||
</html> | </html> |
Revision as of 19:31, 22 July 2014
Our Team Members