Difference between revisions of "Team:Northwestern/Team"

 
(108 intermediate revisions by 3 users not shown)
Line 8: Line 8:
 
.foo:hover img:first-child{display:none}
 
.foo:hover img:first-child{display:none}
 
.foo:hover img:last-child{display:inline-block}
 
.foo:hover img:last-child{display:inline-block}
 
 
p {padding-top: 0px; padding-right: 200px; padding-bottom: 10px; padding-left: 200px;}
 
 
}
 
}
  
 
/*h2 {
 
/*h2 {
padding: 10;
+
padding: 0;
font-weight: 300;*/
+
font-weight: 200;*/
 
}
 
}
 +
 
h2 span {
 
h2 span {
 
margin-left: 1em;
 
margin-left: 1em;
 
color: #aaa;
 
color: #aaa;
font-size: 85%;
+
font-size: 32%;
 
}
 
}
  
/* Modal Image */
+
</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) */
 
/* The Modal (background) */
 
.modal {
 
.modal {
Line 44: Line 62:
 
     margin: auto;
 
     margin: auto;
 
     display: block;
 
     display: block;
     width: 80%;
+
     width: 60%;
 +
    height: 90%;
 
     max-width: 700px;
 
     max-width: 700px;
 
}
 
}
Line 52: Line 71:
 
     margin: auto;
 
     margin: auto;
 
     display: block;
 
     display: block;
     width: 80%;
+
     width: 60%;
 
     max-width: 700px;
 
     max-width: 700px;
 
     text-align: center;
 
     text-align: center;
Line 123: Line 142:
 
</style>
 
</style>
 
</head>
 
</head>
 
  
  
  
 
<body>
 
<body>
 +
 +
<body style="height:100%;">
 
<div>
 
<div>
<center><h2><br><br>Our Team<br><br>Meet our advisors</font>
+
<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>
 
<p style="padding-top: 5%; padding-left: 15%; padding-right: 15%>
 
<p style="padding-top: 5%; padding-left: 15%; padding-right: 15%>
 
<h2 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">  
 
<button class="foo">  
<a style="text-decoration:none !important;" class="foo">  
+
<a style="text-decoration:none !important;" class="foo" href="#JL">
<img id="Leonard" src="https://static.igem.org/mediawiki/2017/c/cb/T--Northwestern--Leonard.png" width="200px"/>
+
<img src="https://static.igem.org/mediawiki/2017/c/cb/T--Northwestern--Leonard.png" width="200px"/>
<img id="click" src="https://static.igem.org/mediawiki/2017/e/e4/T--Northwestern--Leonard4.png" width="200px"/>
+
<img src="https://static.igem.org/mediawiki/2017/e/e4/T--Northwestern--Leonard4.png" width="200px"/>
 
</a>
 
</a>
 
</button>
 
</button>
  
 
<button class="foo">   
 
<button class="foo">   
<a style="text-decoration:none !important;" 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/6/66/T--Northwestern--tyo.png" width="200px" />
 
<img src="https://static.igem.org/mediawiki/2017/9/91/T--Northwestern--Tyo.png" width="200px"/>
 
<img src="https://static.igem.org/mediawiki/2017/9/91/T--Northwestern--Tyo.png" width="200px"/>
 
</a>
 
</a>
 +
 
</button>
 
</button>
 
<button class="foo">   
 
<button class="foo">   
<a style="text-decoration:none !important;" 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/d/d8/T--Northwestern--dte.png"width="200px" />
 
<img src="https://static.igem.org/mediawiki/2017/a/ae/T--Northwestern--dte2.png" width="200px"/>
 
<img src="https://static.igem.org/mediawiki/2017/a/ae/T--Northwestern--dte2.png" width="200px"/>
 
</a>
 
</a>
 
</button>
 
</button>
<button class="foo">
+
 
<a style="text-decoration:none !important;" class="foo">
+
<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/4/44/T--Northwestern--Mordacq.png" width="200px" />
 
<img src="https://static.igem.org/mediawiki/2017/2/29/T--Northwestern--Mordacq2.png" width="200px"/>
 
<img src="https://static.igem.org/mediawiki/2017/2/29/T--Northwestern--Mordacq2.png" width="200px"/>
 
</a>
 
</a>
 
</button>
 
</button>
 +
</center>
 +
 
</p>
 
</p>
 
</div>
 
</div>
  
<!-- Leonard Modal -->
 
<div id="myModal" class="modal">
 
  <span class="close">&times;</span>
 
  <img class="modal-content" id="img01">
 
  <div id="caption"></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>
  
<script>
 
// Get the modal
 
var modal = document.getElementById('myModal');
 
 
// Get the image and insert it inside the modal - use its "alt" text as a caption
 
var click = document.getElementById('click');
 
var img = document.getElementById('Leonard');
 
var modalImg = document.getElementById("img01");
 
var captionText = document.getElementById("caption");
 
click.onclick = function(){
 
    modal.style.display = "block";
 
    modalImg.src = img.src;
 
    captionText.innerHTML = img.alt;
 
}
 
 
// Get the <span> element that closes the modal
 
var span = document.getElementsByClassName("close")[0];
 
 
// When the user clicks on <span> (x), close the modal
 
span.onclick = function() {
 
    modal.style.display = "none";
 
}
 
</script>
 
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 03:07, 2 November 2017

Northwestern Template Northwestern Template



Meet our Team

Not shown: Charley Rees and Karen Taylor



Meet our advisors



Graduate and undergraduate student network


Patrick Bon Lisa Devin Joe Taylor Han Jasmine Taylor Michelle Cai Sam Davidson Tyler Lazar Cameron Glasscock Chelsea Hu Jordan Harrison Peter Su Paul Perkovich Shu Huang Bradley Biggs Tasfia Azim Sarah Stainbrook