Difference between revisions of "Team:Exeter/Team"

(Prototype team page)
 
Line 1: Line 1:
−
{{Exeter}}
 
 
<html>
 
<html>
 +
</div></div></div></div></div>
 +
  <meta charset="utf-8">
 +
  <meta name="viewport" content="width=device-width, initial-scale=1">
 +
 
 +
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
 +
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
 +
 
 +
 
 +
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
 +
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
 +
 
 +
  <link rel="stylesheet" type="text/css" href="Style.css" />
 +
<script>
 +
$(document).ready(function(){
 +
var w = $(".navbar-brand").innerWidth() - 30; // keeps div constant
 +
$("#mainLink").mouseenter(function(){
 +
$(".navbar-brand").width(w);
 +
$(this).html("Home");
 +
$(this).css("color","#6fff00");
 +
});
 +
$("#mainLink").mouseleave(function(){
 +
$(this).html("ExGem");
 +
$(this).css("color","#6fff00");
 +
$(".navbar-brand").width(w);
 +
});
 +
$(".navbar-toggle").mouseleave(function(){$(this).css("background-color","#4e4e4e");});//toggle backound
 +
 +
//topnav script
 +
var width = document.documentElement.clientWidth;
 +
if (width > 539){
 +
$( window ).scroll(function(){
 +
//id scrollPosition links to a hidden div at top of html that
 +
//constantly counts the pixels you have scrolled down.
 +
//Any other solution only worked when page is refreshed.
 +
$('#scrollPosition').html($( window ).scrollTop());
 +
//Handles #topnav at bottom of page
 +
var distHeight = $( document ).height() - $('#scrollPosition').html() - window.innerHeight;
 +
var boxHeight = $("#topnav").height();
 +
var manualPaddingbot = 5;
 +
var padding = boxHeight - distHeight + manualPaddingbot;
 +
//Causes #topnav to be a variable height from bottom when
 +
//footer is in view, and a fixed position on screen when
 +
//footer is out of view
 +
if (distHeight <= boxHeight){
 +
$("#topnav").css("bottom",(padding + manualPaddingbot));
 +
}
 +
if (distHeight > boxHeight){
 +
$("#topnav").css("bottom",manualPaddingbot);
 +
}
 +
})
 +
}
 +
});
 +
</script>
 +
</head>
  
 +
<body>
 +
<style type="text/css">
 +
/********************************* DEFAULT WIKI SETTINGS  ********************************/
  
 +
#sideMenu, #top_title {display:none;}
 +
 +
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px;}
 +
body{
 +
background-color:#eeeeee;
 +
}
 +
#moda{
 +
color:#23527c;
 +
}
 +
h1{
 +
text-align:center;
 +
        border-style:none;
 +
}
 +
/*There is a <p></p> at bottom of iGEM page. In order to keep footer*/
 +
/*On bottom of page we have styled <p> tags to have no margin or border*/
 +
/*Therefore on all of our paragraphs need to id "pp" to work properly*/
 +
p{
 +
        margin:0;
 +
        padding:0;
 +
        border-style:none;
 +
}
 +
#pp{
 +
padding-top:3%;
 +
padding-left:5%;
 +
padding-right:5%;
 +
padding-bottom:1%;
 +
font-size:150%;
 +
}
 +
#you{
 +
padding-left:50px;
 +
}
 +
#links{
 +
color:#eeeeee;
 +
font-size:20px
 +
}
 +
#links:hover{
 +
color:#6fff00;
 +
}
 +
#links:active{
 +
color:#6fff00;
 +
}
 +
#Top_link.navbar-brand{/*Top link styling*/
 +
color:#6fff00;
 +
font-size:25px;
 +
margin-bottom:5px;
 +
opacity:0.6
 +
}
 +
#topnav{
 +
padding-bottom:0px;
 +
position:fixed;
 +
}
 +
#topnav (max-width: 767px) {
 +
display:none;
 +
}
 +
#text{/*Top link text*/
 +
color:#6fff00;
 +
}
  
−
<div class="column full_size" >
+
#Top_link:hover{
 +
color:#58cc00;
 +
background:#d9d9d9;
 +
border-radius:10px;
 +
border-color:#eeeeee;
 +
}
 +
#Top_link:active{
 +
color:#eeeeee;
 +
}
 +
.flare{
 +
background-color:#6fff00; 
 +
padding-top:5px;
 +
position:relative;
 +
bottom:0px;
 +
width:100%;
 +
}
  
−
<p>In this page you can introduce your team members, instructors, and advisors. </p>
 
  
 +
#mainLink{ /*Makes ExGem larger than other tabs.*/
 +
font-size: 25px;
 +
color:#6fff00;
 +
}
 +
ul.img-list {
 +
  list-style-type: none;
 +
  margin: 0;
 +
  padding: 3% 0;
 +
  text-align: center;
 +
}
 +
  .affix {
 +
      bottom: 0;
 +
      width: 100%;
 +
  }
  
−
</div>
+
span.name{
 +
  color: black;
 +
  cursor: pointer;
 +
  display: table;
 +
  left: 10%;
 +
  position: absolute;
 +
  top: 75%;
 +
  opacity: 0;
 +
  font-size:30px;
 +
  -webkit-transition: opacity 500ms;
 +
  -moz-transition: opacity 500ms;
 +
  -o-transition: opacity 500ms;
 +
  transition: opacity 500ms;
 +
}
 +
ul.img-list li:hover span.name {
 +
transition: opacity 0ms;
 +
  opacity: 1;
 +
}
 +
.hover:hover{
 +
opacity:0.4;
 +
}
 +
* {
 +
  margin: 0;
 +
}
 +
/*sticky footer*/
 +
.wrap {
 +
  min-height: 100%;
 +
  margin-bottom: -65px;  /* equal to footer height */
 +
}
 +
.wrap:after {
 +
  content: "";
 +
  display: block;
 +
}
 +
.footer, .wrap:after {
 +
  height: 60px;
 +
  padding-top:5px;
 +
}
 +
.flare .wrap:after{
 +
height:5px;
 +
}
 +
.role{
 +
text-align:center;
 +
color:6fff00;
 +
font-size:80%;
 +
}
 +
.footer{
 +
background-color:#4e4e4e;
 +
}
 +
.navbar{
 +
background-color:#4e4e4e;
 +
border-bottom:none;
 +
height:54px;
 +
        margin:6px 0 0 0;
 +
}
 +
.navbar-inverse .navbar-toggle .icon-bar {/*green toggle */
 +
    background-color:#6fff00;
 +
}
 +
.navbar-inverse .navbar-toggle { /*Removes toggle bobrder*/
 +
border:none;
 +
background-color:4e4e4e;
 +
}
 +
.navbar-inverse .navbar-toggle{ /*Removes toggle bobrder*/
 +
border:none;
 +
background-color:#4e4e4e;
 +
}
 +
.navbar-inverse .navbar-toggle collapse{ /*Removes toggle bobrder*/
 +
border:none;
 +
background-color:#4e4e4e;
 +
}
 +
.navbar-inverse .navbar-toggle:hover {
 +
background-color:#4e4e4e;
 +
}
 +
.navbar-inverse .navbar-toggle:hover .icon-bar{
 +
background-color:#eeeeee;
 +
}
 +
hr {
 +
border-color:#828282;
 +
}
 +
/*soc classes controll css for media icons*/
 +
#soc{
 +
margin-top:-12px;
 +
margin-left:-15px;
 +
}
 +
.soc_1{
 +
margin-right:3px;
 +
}
 +
.soc_2{
 +
 +
}
 +
.soc_3{
 +
margin-right:3px;
 +
margin-left:3px;
 +
}
 +
/*Hides igm logo and team name*/
 +
#top_title{visibility: hidden; background:#eeeeee;}
 +
#bodyContent{background:#eeeeee;}
 +
#mw-content-text{background:#eeeeee;}
 +
#HQ_page{background:none; height:0px; width:0px;}
 +
#content{background:none;}
 +
#globalWrapper{height:0px;background:#eeeeee;}
 +
/*end of hacky css :) */
  
−
<div class="column half_size" >
+
</style>
−
<h5>Inspiration</h5>
+
−
<p>You can look at what other teams did to get some inspiration! <br />
+
−
Here are a few examples:</p>
+
−
<ul>
+
−
<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>
+
−
<li><a href="https://2014.igem.org/Team:Stony_Brook/Team">Stony Brook</a></li>
+
−
<li><a href="https://2014.igem.org/Team:OUC-China/Team">OUC-China</a></li>
+
−
</ul>
+
  
 +
<nav id="Top" class="navbar navbar-inverse navbar-static-top">
 +
  <div class="container-fluid">
 +
    <div class="navbar-header">
 +
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
 +
          <span class="icon-bar"></span>
 +
          <span class="icon-bar"></span>
 +
          <span class="icon-bar"></span>                       
 +
</button>
 +
      <a class="navbar-brand" href="https://2016.igem.org/Team:Exeter" style="height:54px;border-right: solid 3px #777777; border"id="mainLink">ExGem</a>
 +
 
 +
    </div>
 +
    <div>
 +
        <div class="collapse navbar-collapse" id="myNavbar">
 +
<ul class="nav navbar-nav" >
 +
  <li ><a id="links"href="https://2016.igem.org/Team:Exeter">Project</a></li>
 +
  <!--<li ><a id="links"href="#">Parts</a></li>-->
 +
  <!--<li ><a id="links"href="#">Team</a></li>-->
 +
  <!--<li ><a id="links"href="#">Attributions</a></li>-->
 +
  <!--<li ><a id="links"href="#">Awards</a></li>-->
 +
</ul>
 +
<ul class="nav navbar-nav navbar-right" >
 +
<li style="height:50px;width:48px;"class="soc_1"><a href="https://www.youtube.com/channel/UC31qfG4hnm8gRHDCkrBtAiQ"><img id = "soc" src="https://static.igem.org/mediawiki/2016/2/23/You.png"/></a></li>
 +
    <li style="height:50px;width:48px;"><a class="soc_2" href="https://www.facebook.com/ExeteriGEM2016/?ref=aymt_homepage_panel"><img id = "soc" src="https://static.igem.org/mediawiki/2016/5/51/Fb.png"/></a></li>
 +
    <li style="height:50px;width:48px;"class="soc_3"><a  href="https://twitter.com/exeter_igem"><img id = "soc" src="https://static.igem.org/mediawiki/2016/7/76/Twit.jpg"/></a></li>
 +
</ul>
 +
    </div>
 +
    </div>
 +
  </div>
 +
</nav>
 +
<div style="height:6px; background-color:#828282; margin-top:0px;" ></div>
 +
<div class="wrap">
 +
<!--Content Begins-->
 +
<!--div below contains a rolling counter for scrolling position-->
 +
<div id="scrollPosition" style="display:none;">0</div>
 +
<!--Counter finished-->
 +
<div id="Team" class="container">
 +
<h1>Meet The Team!</h1>
 +
<hr style="border-color:#777777; margin:0;">
 +
<div class="col-xs-12" style="padding:2% 0;">
 +
<div class="col-xs-0 col-sm-2 col-me-5"></div>
 +
<div class="col-xs-12 col-sm-8 col-me-2">
 +
<div class="row" style="padding-top:20px">
 +
<video style="width:99%;" controls>
 +
<source src="team_1.ogg" type="video/ogg">
 +
<source src="team_1.mp4" type="video/mp4">
 +
<source src="team_1.mov" type="video/mov">
 +
Your browser does not support the video tag.
 +
</video>
 +
</div>
 +
</div>
 +
<div class="col-xs-0 col-sm-2 col-me-5"></div>
 +
</div>
 +
<hr />
 +
<h1>Click on a member of the team to find out more:</h1>
 +
<hr style="border-color:#777777; margin:0;">
 +
<div class="col-md-4 col-sm-6 col-xs-12">
 +
<ul class="img-list">
 +
<li>
 +
<a data-toggle="modal" data-target="#myModal1" id="moda"><span class="name"><span>Leanne Stanfield</span></span><img class="hover" src="Leanne.jpg" style="width:100%; ">
 +
<!-- Modal -->
 +
<div class="modal" id="myModal1" role="dialog">
 +
<div class="modal-dialog">
 +
 +
<!-- Modal content-->
 +
<div class="modal-content">
 +
<div class="modal-header">
 +
<button type="button" class="close" data-dismiss="#myModal1">&times;</button>
 +
<h2 class="modal-title">Leanne Stanfield<br />
 +
<span class="role">Catcher of melon</span></h2>
 +
</div>
 +
<div class="modal-body">
 +
<p id="pp" style="text-align:left;"><span style="color:#6fff00;";>Course:</span> Physics Mphys<span style="float:right"><span style="color:#6fff00;">Age: </span>19</span></p>
 +
<p id="pp">
 +
Hi! My name's Leanne, and I'm a first year Physics student from Birmingham.
 +
I'm super excited (and grateful) to be involved with iGEM,
 +
and it's definitely making me rather interested in Biophysics!
 +
I really really really love coffee and lemon cheesecakes,
 +
and quite enjoy going for runs.
 +
</p>
 +
</div>
 +
<div class="modal-footer">
 +
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 +
<p id="pp" style="text-align:center;"><span style="color:#6fff00;text-align:center;">Email: </span>lds211@exeter.co.uk</p>
 +
</div>
 +
</div>
 +
 
 +
</div>
 +
</div>
 +
</a>
 +
</li>
 +
</ul>
 +
</div>
 +
<div class="col-md-4 col-sm-6 col-xs-12">
 +
<ul class="img-list">
 +
<li>
 +
<a data-toggle="modal" data-target="#myModal2" id="moda"><span class="name"><span>Jack Fleet</span></span><img class="hover" src="Jack.jpg" style="width:100%; ">
 +
<!-- Modal -->
 +
<div class="modal" id="myModal2" role="dialog">
 +
<div class="modal-dialog">
 +
 +
<!-- Modal content-->
 +
<div class="modal-content">
 +
<div class="modal-header">
 +
<button type="button" class="close" data-dismiss="#myModal2">&times;</button>
 +
<h2 class="modal-title">Jack Fleet<br />
 +
<span class="role">Eater of Cheese</span></h2>
 +
 +
</div>
 +
<div class="modal-body">
 +
<p id="pp" style="text-align:left;">
 +
<span style="color:#6fff00;";>Course:</span> 
 +
BSc Biological and Medicinal Chemistry </p>
 +
<p id="pp"><span style="text-align:center;"><span style="color:#6fff00;">Age: </span>20</span></p>
 +
<p id="pp">Hallo! My name’s is Jack. I live in Cornwall, though I am originally from Kent.
 +
I enjoy doing impressions, playing football and listening to an eclectic mix of music.
 +
I would love to live and study abroad, however this may be a little bit difficult considering England’s current situation.
 +
I am excited to be a member of the Exeter iGEM team as it is a fantastic opportunity for me to meet a wide variety of people from different countries and industries across the globe.
 +
 +
</p>
 +
</div>
 +
<div class="modal-footer">
 +
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 +
<p id="pp" style="text-align:center;"><span style="color:#6fff00;text-align:center;">Email: </span>@exeter.co.uk</p>
 +
</div>
 +
</div>
 +
 
 +
</div>
 +
</div>
 +
</a>
 +
</li>
 +
</ul>
 +
</div>
 +
<div class="col-md-4 col-sm-6 col-xs-12">
 +
<ul class="img-list">
 +
<li>
 +
<a data-toggle="modal" data-target="#myModal3" id="moda"><span class="name"><span>Eloise Lloyd</span></span><img class="hover" src="Ellie.jpg" style="width:100%; ">
 +
<!-- Modal -->
 +
<div class="modal" id="myModal3" role="dialog">
 +
<div class="modal-dialog">
 +
 +
<!-- Modal content-->
 +
<div class="modal-content">
 +
<div class="modal-header">
 +
<button type="button" class="close" data-dismiss="#myModal3">&times;</button>
 +
<h2 class="modal-title">Eloise Lloyd<br />
 +
<span class="role">Warmer of rain</span></h2>
 +
 +
</div>
 +
<div class="modal-body">
 +
<p id="pp" style="text-align:left;"><span style="color:#6fff00;";>Course:</span>Biochemistry Bsc<span style="float:right"><span style="color:#6fff00;">Age: </span>19</span></p>
 +
<p id="pp"> Hello, my name is Eloise!
 +
I am a first year Biochemist on Team Science for Exeter’s iGEM 2016 team.
 +
Science is a big part of my life considering the dream is to one day help cure cancer.
 +
The iGEM competition is proving to be an amazing platform for widening my view of science and exposing me to how different scientific fields can be integrated. I am originally from Essex so exploring Exeter’s beautiful countryside and endless hills on my bicycle is an excellent way to spend my summer when outside of the lab.
 +
My other interests include yoga,
 +
elephants and Formula 1, Team Lewis all the way!
 +
</p>
 +
</div>
 +
<div class="modal-footer">
 +
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 +
<p id="pp" style="text-align:center;"><span style="color:#6fff00;text-align:center;">Email: </span>@exeter.co.uk</p>
 +
</div>
 +
</div>
 +
 
 +
</div>
 +
</div>
 +
</a>
 +
</li>
 +
</ul>
 +
</div>
 +
<div class="col-md-4 col-sm-6 col-xs-12">
 +
<ul class="img-list">
 +
<li>
 +
<a data-toggle="modal" data-target="#myModal4" id="moda"><span class="name"><span>Alan Williams</span></span><img class="hover" src="Alan.jpg" style="width:100%; ">
 +
<!-- Modal -->
 +
<div class="modal" id="myModal4" role="dialog">
 +
<div class="modal-dialog">
 +
 +
<!-- Modal content-->
 +
<div class="modal-content">
 +
<div class="modal-header">
 +
<button type="button" class="close" data-dismiss="#myModal4">&times;</button>
 +
<h2 class="modal-title">Alan Williams<br />
 +
<span class="role">Destroyer of wiki</span></h2>
 +
</div>
 +
<div class="modal-body">
 +
<p id="pp" style="text-align:left;"><span style="color:#6fff00;">Course:</span> Physics Mphys<span style="float:right"><span style="color:#6fff00;">Age: </span>20</span></p>
 +
<p id="pp">Hey, Im Alan. Im really into sience. I joined the iGem team so I could put the skills I have learnt in my degree into practice.
 +
Its been great so far and im really enjoying the experiance. I enjoy programming thus I'm one of the wiki guys.
 +
  Im a massive sports fan. Rugby and skateboarding are my favorites, Although I do love to surf when I get the chance.
 +
</p>
 +
</div>
 +
<div class="modal-footer">
 +
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 +
<p id="pp" style="text-align:center;"><span style="color:#6fff00;text-align:center;">Email: </span>Aw505@exeter.co.uk</p>
 +
</div>
 +
</div>
 +
 
 +
</div>
 +
</div>
 +
     
 +
</li>
 +
</ul>
 +
</div>
 +
<div class="col-md-4 col-sm-6 col-xs-12">
 +
<ul class="img-list">
 +
<li>
 +
<a data-toggle="modal" data-target="#myModal5" id="moda"><span class="name"><span>The Team</span></span><img class="hover" src="Team.jpg" style="width:100%; ">
 +
<!-- Modal -->
 +
<div class="modal" id="myModal5" role="dialog">
 +
<div class="modal-dialog">
 +
 +
<!-- Modal content-->
 +
<div class="modal-content">
 +
<div class="modal-header">
 +
<button type="button" class="close" data-dismiss="#myModal5">&times;</button>
 +
<h2 class="modal-title">The Team<br />
 +
<span class="role">Destroyer of wiki</span></h2>
 +
</div>
 +
<div class="modal-body">
 +
<p id="pp" style="text-align:left;"><span style="color:#6fff00;";>Course:</span> Physics Mphys<span style="float:right"><span style="color:#6fff00;">Age: </span>20</span></p>
 +
<p id="pp">Hey, Im Alan. Im really into sience. I joined the iGem team so I could put the skills I have learnt in my degree into practice.
 +
Its been great so far and im really enjoying the experiance. I enjoy programming thus I'm one of the wiki guys.
 +
  Im a massive sports fan. Rugby and skateboarding are my favorites, Although I do love to surf when I get the chance.
 +
</p>
 +
</div>
 +
<div class="modal-footer">
 +
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 +
<p id="pp" style="text-align:center;"><span style="color:#6fff00;text-align:center;">Email: </span>@exeter.co.uk</p>
 +
</div>
 +
</div>
 +
 
 +
</div>
 +
</div>
 +
 
 +
</li>
 +
</ul>
 +
</div>
 +
<div class="col-md-4 col-sm-6 col-xs-12">
 +
<ul class="img-list">
 +
<li>
 +
<a data-toggle="modal" data-target="#myModal6" id="moda"><span class="name"><span>Dan Barber</span></span><img class="hover" src="Dan.jpg" style="width:100%; ">
 +
<!-- Modal -->
 +
<div class="modal" id="myModal6" role="dialog">
 +
<div class="modal-dialog">
 +
 +
<!-- Modal content-->
 +
<div class="modal-content">
 +
<div class="modal-header">
 +
<button type="button" class="close" data-dismiss="#myModal6">&times;</button>
 +
<h2 class="modal-title">Dan Barber<br />
 +
<span class="role">Hater of Queen</span></h2>
 +
</div>
 +
<div class="modal-body">
 +
<p id="pp" style="text-align:left;"><span style="color:#6fff00;";>Course:</span> Biological Sciences BsSc<span style="float:right"><span style="color:#6fff00;">Age: </span>25</span></p>
 +
<p id="pp">
 +
I’m a first year biological sciences student,
 +
my background is in art and illustration but I decided to come back to university to try something I’m not terrible at!
 +
iGEM is a really exciting opportunity for me because there's lots of scope for creativity.
 +
I love fungi, climbing, painting and playing music.
 +
</p>
 +
</div>
 +
<div class="modal-footer">
 +
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 +
<p id="pp" style="text-align:center;"><span style="color:#6fff00;text-align:center;">Email: </span>@exeter.co.uk</p>
 +
</div>
 +
</div>
 +
 
 +
</div>
 +
</div>
 +
</a>
 +
</li>
 +
</ul>
 +
</div>
 +
<div class="col-md-4 col-sm-6 col-xs-12">
 +
<ul class="img-list">
 +
<li>
 +
<a data-toggle="modal" data-target="#myModal7" id="moda"><span class="name"><span>Emily Reeves</span></span><img class="hover" src="Emily.jpg" style="width:100%; ">
 +
<!-- Modal -->
 +
<div class="modal" id="myModal7" role="dialog">
 +
<div class="modal-dialog">
 +
 +
<!-- Modal content-->
 +
<div class="modal-content">
 +
<div class="modal-header">
 +
<button type="button" class="close" data-dismiss="#myModal7">&times;</button>
 +
<h2 class="modal-title">Emily Reeves<br />
 +
<span class="role"></span></h2>
 +
</div>
 +
<div class="modal-body">
 +
<p id="pp" style="text-align:left;"><span style="color:#6fff00;";>Course:</span> Biochemistry BSc<span style="float:right"><span style="color:#6fff00;">Age: </span>19</span></p>
 +
<p id="pp">
 +
Hello! My name is Emily.
 +
I am excited to be a part of the Exeter iGEM team of 2016 as it is a great opportunity to get a taster of the various disciplines that make up synthetic biology,
 +
as well as the chance to meet people from around the world who share a similar interest in science.
 +
Outside of my studies I like running, cycling and bad science puns.
 +
I am also interested in learning about health and nutrition.
 +
</p>
 +
</div>
 +
<div class="modal-footer">
 +
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 +
<p id="pp" style="text-align:center;"><span style="color:#6fff00;text-align:center;">Email: </span>er373@exeter.co.uk</p>
 +
</div>
 +
</div>
 +
 
 +
</div>
 +
</div>
 +
</a>
 +
</li>
 +
</ul>
 +
</div>
 +
<div class="col-md-4 col-sm-6 col-xs-12"><a href="#">
 +
<ul class="img-list">
 +
<li>
 +
<a data-toggle="modal" data-target="#myModal8" id="moda"><span class="name"><span>Alice Redgate</span></span><img class="hover" src="Boss.jpg" style="width:100%; ">
 +
<!-- Modal -->
 +
<div class="modal" id="myModal8" role="dialog">
 +
<div class="modal-dialog">
 +
 +
<!-- Modal content-->
 +
<div class="modal-content">
 +
<div class="modal-header">
 +
<button type="button" class="close" data-dismiss="#myModal8">&times;</button>
 +
<h2 class="modal-title">Alice Redgate<br />
 +
<span class="role">Filmer of Videos</span></h2>
 +
</div>
 +
<div class="modal-body">
 +
<p id="pp" style="text-align:left;"><span style="color:#6fff00;";>Course:</span> Bioscience Bsc<span style="float:right"><span style="color:#6fff00;">Age: </span>20</span></p>
 +
<p id="pp">
 +
Hello! My name is Alice. I’m a 1st year biologist who is loving life.
 +
I’m really looking forward to being a part of this exciting iGEM competition and over the summer I’ll be documenting the progress of our team along the way.
 +
I love filming and it enables us to reach a wider audience with what we are doing.
 +
I have also been working on the human practices side of our project, travelling to schools across the country to introduce our synthetic biology board game. Besides iGEM, I like producing videos for XTV (our student television station) for
 +
which I am Head of Factual on committee next year.
 +
I also love scuba diving and spent my gap year working as an instructor on the Great Barrier Reef.
 +
If you've seen our YouTube channel, come and talk to me at the jamboree!
 +
</p>
 +
</div>
 +
<div class="modal-footer">
 +
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 +
<p id="pp" style="text-align:center;"><span style="color:#6fff00;text-align:center;">Email: </span>@exeter.co.uk</p>
 +
</div>
 +
</div>
 +
 
 +
</div>
 +
</div>
 +
</a>
 +
</li>
 +
</ul>
 +
</div>
 +
<div class="col-md-4 col-sm-6 col-xs-12">
 +
<ul class="img-list">
 +
<li>
 +
<a data-toggle="modal" data-target="#myModal9" id="moda"><span class="name"><span>Hannah Osborne</span></span><img class="hover" src="Hannah.jpg" style="width:100%; ">
 +
<!-- Modal -->
 +
<div class="modal" id="myModal9" role="dialog">
 +
<div class="modal-dialog">
 +
 +
<!-- Modal content-->
 +
<div class="modal-content">
 +
<div class="modal-header">
 +
<button type="button" class="close" data-dismiss="#myModal9">&times;</button>
 +
<h2 class="modal-title">Hannah Osborne<br />
 +
<span class="role">Lover of Space</span></h2>
 +
</div>
 +
<div class="modal-body">
 +
<p id="pp" style="text-align:left;"><span style="color:#6fff00;";>Course:</span> Physics with Astrophysics Mphys<span style="float:right"><span style="color:#6fff00;">Age: </span>20</span></p>
 +
<p id="pp">Hi, I'm Hannah, a third year student passionate about space research,
 +
finding exoplanets and encouraging a new generation into science and space exploration.
 +
Last year I helped set up Exeter University Space Society and climbed Mt Kilimanjaro to raise money for the charity Hope for Children.
 +
I have had experience in science outreach with UKSEDS (UK Students for the Exploration and Development of Space) and presenting at the National Student Space Conference but I hope iGEM will give me a whole new set of skills,
 +
starting with how to light a Bunsen burner!
 +
</p>
 +
</div>
 +
<div class="modal-footer">
 +
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 +
<p id="pp" style="text-align:center;"><span style="color:#6fff00;text-align:center;">Email: </span>hlmo201@exeter.co.uk</p>
 +
</div>
 +
</div>
 +
 +
</div>
 +
</div>
 +
</a>
 +
</li>
 +
</ul>
 +
</div>
 +
<div class="col-md-4 col-sm-6 col-xs-12">
 +
<ul class="img-list">
 +
<li>
 +
<a data-toggle="modal" data-target="#myModal10" id="moda"><span class="name"><span>Andy Wild</span></span><img class="hover" src="Andy.jpg" style="width:100%; ">
 +
<!-- Modal -->
 +
<div class="modal" id="myModal10" role="dialog">
 +
<div class="modal-dialog">
 +
 +
<!-- Modal content-->
 +
<div class="modal-content">
 +
<div class="modal-header">
 +
<button type="button" class="close" data-dismiss="#myModal10">&times;</button>
 +
<h2 class="modal-title">Andy Wild<br />
 +
<span class="role">Drawrer of Cards</span></h2>
 +
</div>
 +
<div class="modal-body">
 +
<p id="pp" style="text-align:left;"><span style="color:#6fff00;";>Course:</span> Physics Mphys<span style="float:right"><span style="color:#6fff00;">Age: </span>20</span></p>
 +
<p id="pp">Hi, my name is Andy. I have a passion for learning new things,
 +
it’s one of the aspects that attracted me to iGEM. Being a physicist,
 +
an opportunity to experience a whole new field of science doesn’t occur too often,
 +
so I jumped at the opportunity. Outside of science I have a great interest in fitness and general well-being, and jump at the opportunity to hang out with friends,
 +
often staying up until early hours of the morning on skype.
 +
</p>
 +
</div>
 +
<div class="modal-footer">
 +
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 +
<p id="pp" style="text-align:center;"><span style="color:#6fff00;text-align:center;">Email: </span>@exeter.co.uk</p>
 +
</div>
 +
</div>
 +
 
 +
</div>
 +
</div>
 +
</a>
 +
</li>
 +
</ul>
 +
</div>
 +
<div class="col-md-4 col-sm-6 col-xs-12">
 +
<ul class="img-list">
 +
<li>
 +
<a data-toggle="modal" data-target="#myModal11" id="moda"><span class="name"><span>Pablo Sharrock</span></span><img class="hover" src="Pablo.jpg" style="width:100%; ">
 +
<!-- Modal -->
 +
<div class="modal" id="myModal11" role="dialog">
 +
<div class="modal-dialog">
 +
 +
<!-- Modal content-->
 +
<div class="modal-content">
 +
<div class="modal-header">
 +
<button type="button" class="close" data-dismiss="#myModal11">&times;</button>
 +
<h2 class="modal-title">Pablo Sharrock<br />
 +
<span class="role">King of Articulation</span></h2>
 +
 +
</div>
 +
<div class="modal-body">
 +
<p id="pp" style="text-align:left;"><span style="color:#6fff00;";>Course:</span> Biological Sciences BSc<span style="float:right"><span style="color:#6fff00;">Age: </span>20</span></p>
 +
<p id="pp">HI! My name is Pablo. I speak three languages: English, Spanish and French.
 +
I also love travelling and meeting people with different backgrounds, as I believe that it gives a better understanding of how the world works.
 +
Similarly iGEM has given me a better understanding of how all the different sciences are related and how collaboration between them is now more important than ever in order to progress in all scientific fields.
 +
</p>
 +
</div>
 +
<div class="modal-footer">
 +
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 +
<p id="pp" style="text-align:center;"><span style="color:#6fff00;text-align:center;">Email: </span>@exeter.co.uk</p>
 +
</div>
 +
</div>
 +
 
 +
</div>
 +
</div>
 +
</a>
 +
</li>
 +
</ul>
 +
</div>
 +
<div class="col-md-4 col-sm-6 col-xs-12">
 +
<ul class="img-list">
 +
<li>
 +
<a data-toggle="modal" data-target="#myModal" id="moda">
 +
<span class="name"><span>Joelan Burton-Lowe</span></span>
 +
<img class="hover" src="jolean.jpg" style="width:100%;"/>
 +
 +
<!-- Modal -->
 +
<div class="modal" id="myModal" role="dialog">
 +
<div class="modal-dialog">
 +
<!-- Modal content-->
 +
<div class="modal-content">
 +
<div class="modal-header">
 +
<button type="button" class="close" data-dismiss="#myModal">&times;</button>
 +
<h2 class="modal-title">Joelan Burton-Lowe<br />
 +
<span class="role">Illistrator of Boards</span></h2>
 +
</div>
 +
<div class="modal-body">
 +
<p id="pp" style="text-align:left;"><span style="color:#6fff00;";>Course:</span> Physics Mphys<span style="float:right"><span style="color:#6fff00;">Age: </span>20</span></p>
 +
<p id="pp">Hi I’m Joel, my main area of interest within my studies is biophysics this led me to join the iGEM team to expand my knowledge and develop my research skills.
 +
Other than science I listen to a lot of music, mainly rock/metal and I attend as many concerts and festivals as possible.
 +
As well as this i enjoy snowboarding, rugby, gaming the list goes on.
 +
</p>
 +
</div>
 +
<div class="modal-footer">
 +
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 +
<p id="pp" style="text-align:center;"><span style="color:#6fff00;text-align:center;">Email: </span>jb702@exeter.co.uk</p>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
</a>
 +
</li>
 +
</ul>
 +
</div>
 +
 +
</div>
 +
</div>
 
</div>
 
</div>
 +
<!--Content Ends-->
 +
<nav id="topnav" class="nav-navbar" style="right:3px;">
 +
  <div class="container-fluid">
 +
    <div class="navbar-header">
 +
      <a class="navbar-brand" id="Top_link" href="#Top"><span class="glyphicon glyphicon-menu-up" aria-hidden="true"></span></a>
 +
    </div>
 +
  </div>
 +
</nav>
 +
<div class="flare"></div>
 +
<footer class="footer">
 +
<a href="https://www.youtube.com/channel/UC31qfG4hnm8gRHDCkrBtAiQ"><img id="you" src="https://static.igem.org/mediawiki/2016/2/23/You.png"/></a>
 +
<a href="https://www.facebook.com/ExeteriGEM2016/?ref=aymt_homepage_panel"><img src="https://static.igem.org/mediawiki/2016/5/51/Fb.png"/></a>
 +
<a href="https://twitter.com/exeter_igem"><img src="https://static.igem.org/mediawiki/2016/7/76/Twit.jpg"/></a>
 +
</footer>
 +
</body>
  
−
<div class="column half_size" >
+
<html>
−
<h5>What should this page contain?</h5>
+
<!--Things to add:
−
<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>
+
−
 
+
−
 
+
−
 
+
  
−
</html>
+
*Email adress
 +
*Role in the team
 +
*Team vid 2
 +
*Advisors
 +
*Fix top styling
 +
-->

Revision as of 11:49, 21 July 2016