(391 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> | <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; | 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; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | background-color: # | + | |
} | } | ||
− | + | button{ | |
− | + | border: 0; background-color: #f7f3ed; | |
− | + | ||
} | } | ||
− | + | figure { | |
− | + | background-color: #f7f3ed; | |
− | + | ||
} | } | ||
− | + | h2{ | |
− | + | background-color: #f7f3ed; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | background-color: # | + | |
} | } | ||
− | + | body { | |
− | + | background-color: #f7f3ed; | |
− | color: | + | } |
− | + | foo { | |
− | + | text-decoration:none; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | |||
</style> | </style> | ||
− | |||
</head> | </head> | ||
− | |||
− | |||
− | < | + | <body> |
− | + | ||
− | + | <body style="height:100%;"> | |
+ | <div> | ||
+ | <center><h2><br><br>Meet our Team<br><br></h2> | ||
</div> | </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> | </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
Meet our advisors
Graduate and undergraduate student network
Graduate and undergraduate student network