(552 intermediate revisions by 3 users not shown) | |||
Line 1: | Line 1: | ||
− | {{ | + | {{Northwestern_Page_Head_temp}} |
− | {{ | + | {{Navbar_temp}} |
<html> | <html> | ||
− | < | + | <head> |
− | + | <style> | |
+ | .foo img:last-child{display:none} | ||
+ | .foo:hover img:first-child{display:none} | ||
+ | .foo:hover img:last-child{display:inline-block} | ||
+ | } | ||
− | + | /*h2 { | |
− | + | padding: 0; | |
− | + | font-weight: 200;*/ | |
− | + | } | |
− | + | h2 span { | |
+ | margin-left: 1em; | ||
+ | color: #aaa; | ||
+ | font-size: 32%; | ||
+ | } | ||
+ | </style> | ||
− | |||
− | < | + | <style> |
− | + | p {padding-top: 0px; padding-right: 170px; padding-bottom: 10px; padding-left: 170px;} | |
− | + | p{ background-color: #f7f3ed;} | |
− | + | center{ background-color: #f7f3ed;} | |
− | + | button{border: 0; background-color: #f7f3ed;} | |
+ | figure {background-color: #f7f3ed;} | ||
+ | h2{margin: 0; background-color: #f7f3ed;} | ||
+ | h3{margin: 0; background-color: #f7f3ed;} | ||
+ | body{background-color: #f7f3ed;} | ||
+ | </style> | ||
+ | </head> | ||
− | < | + | <style> |
− | + | p.big { | |
− | + | line-height: 1.8; | |
− | + | } | |
− | |||
− | |||
− | |||
− | |||
− | + | /* Modal Image */ | |
− | + | /* The Modal (background) */ | |
− | + | .modal { | |
+ | display: none; /* Hidden by default */ | ||
+ | position: fixed; /* Stay in place */ | ||
+ | z-index: 1; /* Sit on top */ | ||
+ | padding-top: 100px; /* Location of the box */ | ||
+ | left: 0; | ||
+ | top: 0; | ||
+ | width: 100%; /* Full width */ | ||
+ | height: 100%; /* Full height */ | ||
+ | overflow: auto; /* Enable scroll if needed */ | ||
+ | background-color: rgb(0,0,0); /* Fallback color */ | ||
+ | background-color: rgba(0,0,0,0.9); /* Black w/ opacity */ | ||
+ | } | ||
− | + | /* Modal Content (image) */ | |
− | + | .modal-content { | |
− | + | margin: auto; | |
− | + | display: block; | |
− | + | width: 60%; | |
+ | height: 90%; | ||
+ | max-width: 700px; | ||
+ | } | ||
− | + | /* Caption of Modal Image */ | |
− | + | #caption { | |
− | + | margin: auto; | |
− | + | display: block; | |
+ | width: 60%; | ||
+ | max-width: 700px; | ||
+ | text-align: center; | ||
+ | color: #ccc; | ||
+ | padding: 10px 0; | ||
+ | height: 150px; | ||
+ | } | ||
− | + | /* Add Animation */ | |
− | + | .modal-content, #caption { | |
− | + | -webkit-animation-name: zoom; | |
− | + | -webkit-animation-duration: 0.6s; | |
− | + | animation-name: zoom; | |
− | + | animation-duration: 0.6s; | |
+ | } | ||
− | + | @-webkit-keyframes zoom { | |
+ | from {-webkit-transform:scale(0)} | ||
+ | to {-webkit-transform:scale(1)} | ||
+ | } | ||
− | + | @keyframes zoom { | |
− | + | from {transform:scale(0)} | |
− | + | to {transform:scale(1)} | |
+ | } | ||
− | + | /* The Close Button */ | |
− | + | .close { | |
− | + | position: absolute; | |
− | + | top: 15px; | |
− | + | right: 35px; | |
+ | color: #f1f1f1; | ||
+ | font-size: 40px; | ||
+ | font-weight: bold; | ||
+ | transition: 0.3s; | ||
+ | } | ||
− | + | .close:hover, | |
+ | .close:focus { | ||
+ | color: #bbb; | ||
+ | text-decoration: none; | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | /* 100% Image Width on Smaller Screens */ | ||
+ | @media only screen and (max-width: 700px){ | ||
+ | .modal-content { | ||
+ | width: 100%; | ||
+ | } | ||
+ | } | ||
− | + | p { | |
+ | background-color: #f7f3ed; | ||
+ | } | ||
+ | button{ | ||
+ | border: 0; background-color: #f7f3ed; | ||
+ | } | ||
+ | figure { | ||
+ | background-color: #f7f3ed; | ||
+ | } | ||
+ | h2{ | ||
+ | background-color: #f7f3ed; | ||
+ | } | ||
+ | body { | ||
+ | background-color: #f7f3ed; | ||
+ | } | ||
+ | foo { | ||
+ | text-decoration:none; | ||
+ | } | ||
+ | </style> | ||
+ | </head> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | + | <body> | |
− | + | ||
− | + | <body style="height:100%;"> | |
− | + | <div> | |
− | + | <center><h2><br><br>Meet our Team<br><br></h2> | |
− | + | </div> | |
− | + | ||
− | "> | + | <center style="text-decoration: none;"><figure> |
− | </ | + | <img src="https://static.igem.org/mediawiki/2017/thumb/c/ce/T--Northwestern--team.png/800px-T--Northwestern--team.png" usemap="#image-map"> |
− | + | ||
+ | <map name="image-map"> | ||
+ | <area target="" alt="" title="Jack" href="https://2017.igem.org/Team:Northwestern/Team/Jack" coords="185,118,176,126,186,144,192,126" shape="poly"> | ||
+ | <area target="" alt="" title="Katerina" href="https://2017.igem.org/Team:Northwestern/Team/Katerina" coords="275,161,268,174,275,191,282,172" shape="poly"> | ||
+ | <area target="" alt="" title="Ayesha" href="https://2017.igem.org/Team:Northwestern/Team/Ayesha" coords="373,169,365,179,372,197,379,179" shape="poly"> | ||
+ | <area target="" alt="" title="Lulu" href="https://2017.igem.org/Team:Northwestern/Team/Lulu" coords="464,169,455,179,464,197,470,179" shape="poly"> | ||
+ | <area target="" alt="" title="Will" href="https://2017.igem.org/Team:Northwestern/Team/Will" coords="553,156,545,167,552,183,558,168" shape="poly"> | ||
+ | <area target="" alt="" title="Tyler" href="https://2017.igem.org/Team:Northwestern/Team/Tyler" coords="672,117,663,130,673,148,679,131" shape="poly"> | ||
+ | </map> | ||
+ | </figure><p><center>Not shown: <a href="https://2017.igem.org/Team:Northwestern/Team/Charley">Charley Rees</a> and <a href="https://2017.igem.org/Team:Northwestern/Team/Karen">Karen Taylor</a></center></p></center> | ||
+ | |||
+ | |||
+ | |||
+ | <div> | ||
+ | <center><h2><br><br>Meet our advisors</h2> | ||
</div> | </div> | ||
+ | <p style="padding-top: 5%; padding-left: 15%; padding-right: 15%> | ||
+ | <h2 style="padding-top: 5%; padding-left: 15%; padding-right: 15%> | ||
+ | |||
+ | <center> | ||
+ | <button class="foo"> | ||
+ | <a style="text-decoration:none !important;" class="foo" href="#JL"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/c/cb/T--Northwestern--Leonard.png" width="200px"/> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/e/e4/T--Northwestern--Leonard4.png" width="200px"/> | ||
+ | </a> | ||
+ | </button> | ||
+ | |||
+ | <button class="foo"> | ||
+ | <a style="text-decoration:none !important;" class="foo" href="#KT"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/6/66/T--Northwestern--tyo.png" width="200px" /> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/9/91/T--Northwestern--Tyo.png" width="200px"/> | ||
+ | </a> | ||
+ | |||
+ | </button> | ||
+ | <button class="foo"> | ||
+ | <a style="text-decoration:none !important;" class="foo" href="#DTE"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/d/d8/T--Northwestern--dte.png"width="200px" /> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/a/ae/T--Northwestern--dte2.png" width="200px"/> | ||
+ | </a> | ||
+ | </button> | ||
+ | |||
+ | <button class="foo"> | ||
+ | <a style="text-decoration:none !important;" class="foo" href="#JM"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/4/44/T--Northwestern--Mordacq.png" width="200px" /> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/2/29/T--Northwestern--Mordacq2.png" width="200px"/> | ||
+ | </a> | ||
+ | </button> | ||
+ | </center> | ||
+ | |||
+ | </p> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | <h2><center><br><br>Graduate and undergraduate student network</center><br><br></h2> | ||
+ | <center style="text-decoration: none;"><figure><img src="https://static.igem.org/mediawiki/2017/5/51/T--Northwestern--gradstudentnetwork.png" alt="" usemap="#Map" hidefocus="true" /> | ||
+ | <map style="outline: none; text-decoration: none;" name="Map" id="Map"> | ||
+ | <area alt="Patrick" title="Patrick Donahue" shape="circle" coords="134, 107, 52"> | ||
+ | <area alt="Bon" title="Bon Ikwuagwu" coords="604,121,54" shape="circle"> | ||
+ | <area target="" alt="Lisa" title="Lisa Burdette" coords="47,319,46" shape="circle"> | ||
+ | <area target="" alt="Devin" title="Devin Stanford" coords="205,448,52" shape="circle"> | ||
+ | <area target="" alt="Joe" title="Joe Muldoon" coords="62,548,55" shape="circle"> | ||
+ | <area target="" alt="Taylor" title="Taylor Dickman" coords="257,675,53" shape="circle"> | ||
+ | <area target="" alt="Han" title="Han Teng Wong" coords="497,675,59" shape="circle"> | ||
+ | <area target="" alt="Jasmine" title="Jasmine Hershewe" coords="673,548,45" shape="circle"> | ||
+ | <area target="" alt="Taylor" title="Taylor Dolberg" coords="714,320,52" shape="circle"> | ||
+ | <area target="" alt="Michelle Cai" title="Michelle Cai" coords="238,283,43" shape="circle"> | ||
+ | <area target="" alt="Sam Davidson" title="Sam Davidson" coords="301,187,44" shape="circle"> | ||
+ | <area target="" alt="Tyler Lazar" title="Tyler Lazar" coords="370,52,53" shape="circle"> | ||
+ | <area target="" alt="Cameron Glasscock" title="Cameron Glasscock" coords="434,174,50" shape="circle"> | ||
+ | <area target="" alt="Chelsea Hu" title="Chelsea Hu" coords="509,261,45" shape="circle"> | ||
+ | <area target="" alt="Jordan Harrison" title="Jordan Harrison" coords="625,253,47" shape="circle"> | ||
+ | <area target="" alt="Peter Su" title="Peter Su" coords="566,375,53" shape="circle"> | ||
+ | <area target="" alt="Paul Perkovich" title="Paul Perkovich" coords="441,424,47" shape="circle"> | ||
+ | <area target="" alt="Shu Huang" title="Shu Huang" coords="326,452,51" shape="circle"> | ||
+ | <area target="" alt="Bradley Biggs" title="Bradley Biggs" coords="529,499,50" shape="circle"> | ||
+ | <area target="" alt="Tasfia Azim" title="Tasfia Azim" coords="283,562,50" shape="circle"> | ||
+ | <area target="" alt="Sarah Stainbrook" title="Sarah Stainbrook" coords="408,564,50" shape="circle"> | ||
+ | </map></figure></center> | ||
+ | |||
+ | </body> | ||
+ | </html> |
Latest revision as of 03:07, 2 November 2017
Meet our Team
![](https://static.igem.org/mediawiki/2017/thumb/c/ce/T--Northwestern--team.png/800px-T--Northwestern--team.png)
Meet our advisors
Graduate and undergraduate student network
Graduate and undergraduate student network
![](https://static.igem.org/mediawiki/2017/5/51/T--Northwestern--gradstudentnetwork.png)