Difference between revisions of "Team:ETH Zurich/Team"

 
(47 intermediate revisions by 3 users not shown)
Line 2: Line 2:
 
<html>
 
<html>
 
<head>
 
<head>
 +
<script>
 +
function sillyPhotos() {
 +
    document.getElementById('anjaphoto').src = "https://static.igem.org/mediawiki/2015/thumb/c/cb/ETH_Anja_silly.jpg/523px-ETH_Anja_silly.jpg";
 +
    document.getElementById('annaphoto').src = "https://static.igem.org/mediawiki/2015/thumb/9/9f/ETH_Anna_silly.jpg/524px-ETH_Anna_silly.jpg";
 +
    document.getElementById('charlottephoto').src = "https://static.igem.org/mediawiki/2015/thumb/2/2b/ETH_Charlotte_silly.jpg/529px-ETH_Charlotte_silly.jpg";
 +
    document.getElementById('harunphoto').src = "https://static.igem.org/mediawiki/2015/thumb/e/ef/ETH_Harun_silly.jpg/523px-ETH_Harun_silly.jpg";
 +
    document.getElementById('lisaphoto').src = "https://static.igem.org/mediawiki/2015/thumb/a/ad/ETH_Lisa_silly.jpg/524px-ETH_Lisa_silly.jpg";
 +
    document.getElementById('mikephoto').src = "https://static.igem.org/mediawiki/2015/thumb/6/62/ETH_Mike.silly.jpg/524px-ETH_Mike.silly.jpg";
 +
}
 +
</script>
 
<style>
 
<style>
 +
#photoArray {
 +
    display:table;
 +
    position:relative;
 +
    width:100%;
 +
}
 +
#photoArrayTable {
 +
    width:100%;
 +
    display:table;
 +
    height:auto;
 +
}
 +
#photoArrayTable img {
 +
    width:100%;
 +
}
 +
#photoArrayTable .photo {
 +
    float:left;
 +
    display:block;
 +
    padding:1%;
 +
}
 +
#photoArrayTable .supervisor {
 +
    width:23%;
 +
}
 +
#photoArrayTable .advisor {
 +
    width:31%;
 +
}
 +
#photoArrayTable .member {
 +
    width:31%;
 +
}
 +
 +
 
#teamphotowrapper {
 
#teamphotowrapper {
 
     height:533px;
 
     height:533px;
Line 19: Line 58:
 
     -o-transition: transform 1s;
 
     -o-transition: transform 1s;
 
     transition: transform 1s;
 
     transition: transform 1s;
 +
    pointer-events: none;
 
}
 
}
  
Line 75: Line 115:
 
#mikebio{top: 130px;left: -50px;}
 
#mikebio{top: 130px;left: -50px;}
 
</style>
 
</style>
 +
 
<script>
 
<script>
−
$(function() {
+
var bioBox;
−
document.getElementById('bioBox').innerHTML = document.getElementById('lisabio').innerHTML;
+
var teamPhoto;
−
}
+
−
);
+
−
//var divs = ['lisabio','charlottebio','anjabio','harunbio','annabio','mikebio'];
+
 
var divs = ['lisabio','mikebio','annabio','harunbio','anjabio','charlottebio'];
 
var divs = ['lisabio','mikebio','annabio','harunbio','anjabio','charlottebio'];
 +
var bioBoxen;
 
var deg = 5;
 
var deg = 5;
 
var cur = 0;
 
var cur = 0;
 +
 
var rotateIt = function(dir) {
 
var rotateIt = function(dir) {
−
     $('#teamphotowrapper img').css('transform','rotate(' + (deg+dir*60).toString() + 'deg)');
+
     teamPhoto.css('transform','rotate(' + (deg+dir*60).toString() + 'deg)');
−
    //deg = (deg + dir*60) % 360;
+
 
     deg = deg + dir*60;
 
     deg = deg + dir*60;
 
     cur = cur + dir;
 
     cur = cur + dir;
 
     if (cur==-1) cur=5;
 
     if (cur==-1) cur=5;
 
     if (cur==6) cur=0;
 
     if (cur==6) cur=0;
−
     document.getElementById('bioBox').innerHTML = document.getElementById(divs[cur]).innerHTML;
+
     bioBox.innerHTML = bioBoxen[cur].innerHTML;
 
}
 
}
 +
 +
 +
$(function() {
 +
    bioBox = document.getElementById('bioBox');
 +
    teamPhoto = $('#teamphotowrapper img');
 +
    bioBoxen = [
 +
        document.getElementById(divs[0]),
 +
        document.getElementById(divs[1]),
 +
        document.getElementById(divs[2]),
 +
        document.getElementById(divs[3]),
 +
        document.getElementById(divs[4]),
 +
        document.getElementById(divs[5])
 +
    ];
 +
    bioBox.innerHTML = bioBoxen[0].innerHTML;
 +
});
 
</script>
 
</script>
 
</head>
 
</head>
 
<!-- Start of content -->
 
<!-- Start of content -->
−
<div class="expContainer"> <!--The closing tag for contentContainer should be placed at the bottom of each content page.-->
+
<div class="expContainer" style=position:relative> <!--The closing tag for contentContainer should be placed at the bottom of each content page.-->
  
 
<h1>Team</h1>
 
<h1>Team</h1>
−
<h2>Members</h2>
+
 
 +
 
 +
 
 +
<a style="color:black;text-decoration:none" onclick="sillyPhotos();return false;" href="#" title="Click me, I dare you ;)"><h2>Members</h2></a>
 
<div id="teamphotowrapper">
 
<div id="teamphotowrapper">
  
  
 
<img src="https://static.igem.org/mediawiki/2015/5/5e/ETH_Team_spin.png">
 
<img src="https://static.igem.org/mediawiki/2015/5/5e/ETH_Team_spin.png">
−
<p style="text-align:center;font-size:36px;z-index:100;"><a href="#" onclick="rotateIt(1);return false;">&#8635;</a>&nbsp;&nbsp;&nbsp;<a href="#" onclick="rotateIt(-1);return false;">&#8634;</a></p>
+
<p style="text-align:center;"><a href="#" onclick="rotateIt(1);return false;" style="font-size:36px;text-decoration:none;">&#8635;</a>&nbsp;&nbsp;&nbsp;<a href="#" onclick="rotateIt(-1);return false;" style="font-size:36px;text-decoration:none;">&#8634;</a></p>
 
<div id="bioBox" style="height:150px;width:50%;padding-left:25%;padding-right:25%;">
 
<div id="bioBox" style="height:150px;width:50%;padding-left:25%;padding-right:25%;">
 
</div>
 
</div>
Line 157: Line 214:
 
</div>
 
</div>
 
</div>
 
</div>
−
 
+
<!--
−
<div style="display:table;position:relative;width:100%;padding-top:220px;">
+
</html>
−
<div style="width:100%;display:table;height:auto">
+
<gallery heights=340px perrow=3 mode="packed-overlay">
−
<div style="float:left;width:30%;display:block;padding:1%;">
+
Image:ETH_Anja.jpg|<span style="font-size:20px">Anja</span><br> ''melodious pipetting expert''
−
<img style="width:100%" src="https://static.igem.org/mediawiki/2015/thumb/e/ef/ETH_Anja.jpg/514px-ETH_Anja.jpg">
+
Image:ETH_Anna.jpg|<span style="font-size:20px">Anna</span><br> ''lab photojournalist and cell destroyer''
−
<h3>Anja<p>melodious pipetting expert</p></h3>
+
Image:ETH_Charlotte.jpg|<span style="font-size:20px">Charlotte</span><br> ''number cruncher''
 +
Image:ETH_Harun.jpg|<span style="font-size:20px">Harun</span><br> ''chief nerd''
 +
Image:ETH_Lisa.jpg|<span style="font-size:20px">Lisa</span><br> ''self-appointed benevolent leader-for-life''
 +
Image:ETH_Mike.jpg|<span style="font-size:20px">Mike</span><br> ''busy beaver''
 +
</gallery>
 +
<html>
 +
-->
 +
<div id="photoArray" style="padding-top:220px;">
 +
<div id="photoArrayTable">
 +
<div class="photo member">
 +
<img id="anjaphoto" style="width:100%" src="https://static.igem.org/mediawiki/2015/thumb/e/ef/ETH_Anja.jpg/524px-ETH_Anja.jpg">
 +
<h4>Anja<p>melodious pipetting expert</p></h4>
 
</div>
 
</div>
  
−
<div style="float:left;width:30%;display:block;padding:1%;">
+
<div class="photo member">
−
<img style="width:100%" src="https://static.igem.org/mediawiki/2015/thumb/1/17/ETH_Anna.jpg/514px-ETH_Anna.jpg">
+
<img id="annaphoto" src="https://static.igem.org/mediawiki/2015/thumb/1/17/ETH_Anna.jpg/524px-ETH_Anna.jpg">
−
<h3>Anna<p>lab photojournalist and cell destroyer</p></h3>
+
<h4>Anna<p>lab photojournalist and cell destroyer</p></h4>
 
</div>
 
</div>
  
−
<div style="float:left;width:30%;display:block;padding:1%;">
+
<div class="photo member">
−
<img style="width:100%" src="https://static.igem.org/mediawiki/2015/thumb/c/c3/ETH_Charlotte.jpg/517px-ETH_Charlotte.jpg">
+
<img id="charlottephoto" src="https://static.igem.org/mediawiki/2015/thumb/c/c3/ETH_Charlotte.jpg/529px-ETH_Charlotte.jpg">
−
<h3>Charlotte<p>number cruncher</p></h3>
+
<h4>Charlotte<p>number cruncher</p></h4>
 
</div>
 
</div>
 
</div>
 
</div>
−
<div style="width:100%;display:table;height:auto">
+
<div id="photoArrayTable">
−
<div style="float:left;width:30%;display:block;padding:1%;">
+
<div class="photo member">
−
<img style="width:100%" src="https://static.igem.org/mediawiki/2015/thumb/6/67/ETH_Harun.jpg/517px-ETH_Harun.jpg">
+
<img id="harunphoto" src="https://static.igem.org/mediawiki/2015/thumb/6/67/ETH_Harun.jpg/524px-ETH_Harun.jpg">
−
<h3>Harun<p>chief nerd</p></h3>
+
<h4>Harun<p>chief nerd</p></h4>
 
</div>
 
</div>
  
−
<div style="float:left;width:30%;display:block;padding:1%;">
+
<div class="photo member">
−
<img style="width:100%" src="https://static.igem.org/mediawiki/2015/thumb/f/f8/ETH_Lisa.jpg/516px-ETH_Lisa.jpg">
+
<img id="lisaphoto" src="https://static.igem.org/mediawiki/2015/thumb/f/f8/ETH_Lisa.jpg/524px-ETH_Lisa.jpg">
−
<h3>Lisa<p>self-appointed benevolent leader-for-life</p></h3>
+
<h4>Lisa<p>self-appointed benevolent leader-for-life</p></h4>
 
</div>
 
</div>
  
−
<div style="float:left;width:30%;display:block;padding:1%;">
+
<div class="photo member">
−
<img style="width:100%" src="https://static.igem.org/mediawiki/2015/thumb/b/be/ETH_Mike.jpg/514px-ETH_Mike.jpg">
+
<img id="mikephoto" src="https://static.igem.org/mediawiki/2015/thumb/b/be/ETH_Mike.jpg/514px-ETH_Mike.jpg">
−
<h3>Mike<p>busy beaver</p></h3>
+
<h4>Mike<p>busy beaver</p></h4>
 
</div>
 
</div>
 
</div>
 
</div>
Line 195: Line 263:
  
 
<h2>Supervisors</h2>
 
<h2>Supervisors</h2>
−
<div style="display:table;position:relative;width:100%">
+
<div id="photoArray">
−
<div style="width:100%;display:table;height:auto">
+
<div id="photoArrayTable">
−
<div style="float:left;width:23%;display:block;padding:1%;">
+
<div class="photo supervisor">
−
<img style="width:100%" src="https://static.igem.org/mediawiki/2015/d/d7/Sven_Panke.jpg">
+
<img src="https://static.igem.org/mediawiki/2015/d/d7/Sven_Panke.jpg">
−
<h3>Sven Panke</h3>
+
<h4>Sven Panke</h4>
 +
<a href="http://www.bsse.ethz.ch/bpl">Bioprocess Laboratory</a>
 
</div>
 
</div>
  
−
<div style="float:left;width:23%;display:block;padding:1%;">
+
<div class="photo supervisor">
−
<img style="width:100%" src="https://static.igem.org/mediawiki/2015/7/7f/Joerg_Stelling.jpg">
+
<img src="https://static.igem.org/mediawiki/2015/7/7f/Joerg_Stelling.jpg">
−
<h3>J&ouml;rg Stelling</h3>
+
<h4>J&ouml;rg Stelling</h4>
 +
<a href="http://www.csb.ethz.ch">Computational Systems Biology Group</a>
 
</div>
 
</div>
  
−
<div style="float:left;width:23%;display:block;padding:1%;">
+
<div class="photo supervisor">
−
<img style="width:100%" src="https://static.igem.org/mediawiki/2015/c/c6/Kobi_Benenson.jpg">
+
<img src="https://static.igem.org/mediawiki/2015/c/c6/Kobi_Benenson.jpg">
−
<h3>Kobi Benenson</h3>
+
<h4>Kobi Benenson</h4>
 +
<a href="http://www.bsse.ethz.ch/synbio">Synthetic Biology Group</a>
 
</div>
 
</div>
−
<div style="float:left;width:23%;display:block;padding:1%;">
+
<div class="photo supervisor">
−
<img style="width:100%" src="https://static.igem.org/mediawiki/2015/a/a8/Savas_Tay.jpg">
+
<img src="https://static.igem.org/mediawiki/2015/a/a8/Savas_Tay.jpg">
−
<h3>Savas Tay</h3>
+
<h4>Savas Tay</h4>
 +
<a href="http://www.microfluidics.ethz.ch/">Tay Group</a>
 
</div>
 
</div>
 
</div>
 
</div>
Line 223: Line 295:
  
 
<h2>Advisors</h2>
 
<h2>Advisors</h2>
 +
<div id="photoArray">
 +
<div id="photoArrayTable"> <!-- first three -->
  
−
<!--
+
<div class="photo advisor">
−
<h4>Inspiration</h4>
+
<img src="https://static.igem.org/mediawiki/2015/d/dd/Daniel.jpg">
−
<p>You can look at what other teams did to get some inspiration! <br />
+
<h4>Daniel Gerngross</h4>
−
Here are a few examples:</p>
+
<a href="http://www.bsse.ethz.ch/bpl">Bioprocess Laboratory</a>
−
<ul>
+
</div>
−
<li><a href="https://2014.igem.org/Team:METU_Turkey_team">METU Turkey </a></li>
+
 
−
<li><a href="https://2014.igem.org/Team:Colombia/Members">Colombia</a></li>
+
<div class="photo advisor">
−
<li><a href="https://2014.igem.org/Team:Stony_Brook/Team">Stony Brook</a></li>
+
<img src="https://static.igem.org/mediawiki/2015/7/77/Sabine.jpg">
−
<li><a href="https://2014.igem.org/Team:OUC-China/Team">OUC-China</a></li>
+
<h4>Sabine &Ouml;sterle</h4>
−
</ul>
+
<a href="http://www.bsse.ethz.ch/bpl">Bioprocess Laboratory</a>
 +
</div>
 +
 
 +
<div class="photo advisor">
 +
<img src="https://static.igem.org/mediawiki/2015/f/f9/Lukas.jpg">
 +
<h4>Lukas Widmer</h4>
 +
<a href="http://www.csb.ethz.ch">Computational Systems Biology Group</a>
 +
</div>
 +
 
 +
</div>
 +
<div id="photoArrayTable"> <!-- next three -->
 +
<div class="photo advisor">
 +
<img src="https://static.igem.org/mediawiki/2015/8/80/Margaux.jpg">
 +
<h4>Margaux Dastor</h4>
 +
<a href="http://www.bsse.ethz.ch/synbio">Synthetic Biology Group</a>
 +
</div>
 +
 
 +
<div class="photo advisor">
 +
<img src="https://static.igem.org/mediawiki/2015/7/7a/Christian.jpg">
 +
<h4>Christian Jordi</h4>
 +
<a href="http://www.microfluidics.ethz.ch/">Tay Group</a>
 +
</div>
 +
 
 +
<div class="photo advisor">
 +
<img src="https://static.igem.org/mediawiki/2015/b/b3/Jana.png">
 +
<h4>Janina Linnik</h4>
 +
<a href="http://www.csb.ethz.ch">Computational Systems Biology Group</a>
 +
</div>
 +
 
 +
</div>
 +
</div>
  
−
<h5>What should this page contain?</h5>
 
−
<ul>
 
−
<li> Include pictures of your teammates, don’t forget instructors and advisors! </li>
 
−
<li>You can add a small biography or a few words from each team member, to tell us what you like, and what motivated you to participate in iGEM.</li>
 
−
<li>Take team pictures! Show us your school, your lab and little bit of your city.</li>
 
−
<li>Remember that image galleries can help you showcase many pictures while saving space.</li>
 
−
</ul>
 
  
−
-->
 
 
</div></div>
 
</div></div>
 
</html>
 
</html>
 +
{{:Template:ETH_Zurich/footer}}

Latest revision as of 01:26, 19 September 2015

"What I cannot create I do not understand."
- Richard Feynmann

Team

Members

↻   ↺

Anja MICHEL Biology
I grew up in a small village where the cow to inhabitant ratio is close to one. I prefer bacteria disassembled into their components rather than whole and healthily living.
Labwork is like cooking and I love both. Besides my life as a lab rat for iGEM, I am addicted to music, good books and my bike.
I chose to join the iGEM team because like cluttering myself with work.
Anna FOMITCHEVA KHARTCHENKO Biotechnology
After four years of a love-hate relationship with bacteria, iGEM presents an interesting new chance!
Charlotte RAMON Biomedical Engineering
Until now, I have never stepped foot in a biology lab...but I'm glad to be part of the team as a modeller!
"What I love: organization!"
Harun MUSTAFA Computational Biology and Bioinformatics
I can get computers to make magic happen...but only in small doses, so you can’t ask for too much. I’m a computer scientist who happens to have an interest in biology. When I’m not tanning in front of a monitor, I like to play music (guitar and various folk lutes) and go on spontaneous hiking trips.

"In theory, theory and practice are the same. In practice, they’re not." - Yoggi Berra
Lisa BAUMGARTNER Biochemistry
ETH and I have been together for almost 4 years now and we are excited to spend some more time together this summer! Hello iGEM!
Michael "Mike" MEIER Cell Biology
Being the oldest member of the team with an MSc title in immediate sight makes me feel–well–old. But hey, I have made most of the common mistakes already, which can be considered an asset. After countless lab hours tormenting plants I am now eager to set my evil mind once again on my old nemesis, E. coli..

Anja

melodious pipetting expert

Anna

lab photojournalist and cell destroyer

Charlotte

number cruncher

Harun

chief nerd

Lisa

self-appointed benevolent leader-for-life

Mike

busy beaver

Supervisors

Advisors

Margaux Dastor

Synthetic Biology Group

Christian Jordi

Tay Group

Janina Linnik

Computational Systems Biology Group

We would like to thank our sponsors