Difference between revisions of "Team:Exeter/Team"

 
(96 intermediate revisions by 5 users not shown)
Line 3: Line 3:
 
   <meta charset="utf-8">
 
   <meta charset="utf-8">
 
   <meta name="viewport" content="width=device-width, initial-scale=1">
 
   <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="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.4/jquery.min.js"></script>
 
+
 
+
   <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>
 
   <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
 +
  <script type="text/javascript" async
 +
  src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-MML-AM_CHTML">
 +
  MathJax.Hub.Config({
 +
  tex2jax: {
 +
    inlineMath: [['$','$'], ['\\(','\\)']],
 +
    processEscapes: true
 +
  }
 +
});
 +
</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>
 
</head>
 
+
<body onLoad="window.scroll(0, 155)">
+
<body>
 
<style type="text/css">
 
<style type="text/css">
/********************************* DEFAULT WIKI SETTINGS ********************************/
+
  @media (max-width: 920px) {
 
+
  .navbar-header {
#sideMenu, #top_title {display:none;}
+
      float: none;
+
  }
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px;}
+
  .navbar-left,.navbar-right {
body{
+
      float: none !important;
 +
  }
 +
  .navbar-toggle {
 +
      display: block;
 +
  }
 +
  .navbar-collapse {
 +
      box-shadow: inset 0 0 0 rgba(255,255,255,0.1);
 +
  }
 +
  .navbar-fixed-top {
 +
      top: 0;
 +
      border-width: 0 0 1px;
 +
  }
 +
  .navbar-collapse.collapse {
 +
      display: none!important;
 +
  }
 +
 
 +
  .navbar-nav {
 +
      float: none!important;
 +
      margin-top: 7.5px;
 +
  }
 +
  .navbar-nav>li {
 +
      float: none;
 +
  }
 +
  .navbar-nav>li>a {
 +
      padding-top: 10px;
 +
      padding-bottom: 10px;
 +
  }
 +
  .collapse.in{
 +
      display:block !important;
 +
  }
 +
  #soc{
 +
display:none;
 +
  }
 +
}
 +
#links{
 +
color:#47BCC2;
 +
/*font-size:20px;*/
 +
font-size:1.2vw;
 +
margin:0 0.9vw 0.5vh 0.9vw;
 +
padding:0;
 +
line-height:0px;
 +
padding-top:28px;
 +
}
 +
/*Fixes font size when nav-bar is collapsed*/
 +
@media (max-width: 920px) {
 +
#links{
 +
font-size:20px;
 +
}
 +
}
 +
#links:hover{
 +
color:#339499;
 +
}
 +
#links:active{
 +
color:#339499;
 +
}
 +
.navbar{
 +
background-color:#e8e8e8;
 +
border-bottom:none;
 +
min-height:54px;
 +
    margin:4px 0 0 0;
 +
}
 +
  .navbar-inverse .navbar-toggle .icon-bar {/*teal toggle */
 +
    background-color:#47BCC2;
 +
}
 +
.navbar-inverse .navbar-toggle { /*Removes toggle bobrder*/
 +
border:none;
 +
background-color:#e8e8e8;
 +
}
 +
.navbar-inverse .navbar-toggle{ /*Removes toggle bobrder*/
 +
border:none;
 +
background-color:#e8e8e8;
 +
}
 +
.navbar-inverse .navbar-toggle collapse{ /*Removes toggle bobrder*/
 +
border:none;
 +
background-color:#e8e8e8;
 +
}
 +
.navbar-inverse .navbar-toggle:hover {
 +
background-color:#47BCC2;
 +
}
 +
.navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover {
 +
    background-color:#47BCC2;  
 +
}
 +
.navbar-inverse .navbar-toggle:hover .icon-bar, .navbar-inverse .navbar-toggle:focus .icon-bar{
 
background-color:#eeeeee;
 
background-color:#eeeeee;
 +
}
 +
/*soc classes controll css for media icons*/
 +
#soc{
 +
margin-top:-12px;
 +
margin-left:-15px;
 
}
 
}
#moda{
+
.soc_1{
color:#23527c;
+
margin-right:3px;
 
}
 
}
h1{
+
.soc_2{
text-align:center;
+
margin-right:3px;
        border-style:none;
+
 
}
 
}
/*There is a <p></p> at bottom of iGEM page. In order to keep footer*/
+
.soc_3{
/*On bottom of page we have styled <p> tags to have no margin or border*/
+
margin-right:3px;
/*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%;
+
/*Navbar exgem logo styling*/
padding-left:5%;
+
#logo, #logo_inverse{
padding-right:5%;
+
margin-top:-12px;
padding-bottom:1%;
+
vertical-align:middle;
font-size:150%;
+
width:48px;  
 +
height:48px;
 +
/*Alligns logo with toggled list on thin screens*/
 +
margin-left:13px;
 +
margin-right:-12px;
 
}
 
}
#you{
+
/*Logo is visable on page load by default*/
margin-left:5%;
+
#logo{
 +
display:block;
 
}
 
}
#links{
+
/*The inverse logo is not visable by default, but becomes visable*/
color:#eeeeee;
+
/*when #logo_button is hovered over (found in jquery)*/
font-size:20px
+
#logo_inverse{
 +
display:none;
 
}
 
}
#Team_home{
+
 
position: relative;
+
/*Displays brand inline with ExGem*/
width: 100%;
+
.navbar-brand > img {
}
+
    display: inline;  
#Team_home_Text{
+
font-size:8vw;
+
    position: absolute;
+
bottom: 30px;
+
left: 50px;
+
+
color:#82828;
+
+
}
+
#text_background{
+
background-color:rgba(130, 130, 130, 0.7);
+
padding-left:10px;
+
padding-right:10px;
+
}
+
#links:hover{
+
color:#6fff00;
+
 
}
 
}
#links:active{
+
.navbar-right a{
color:#6fff00;
+
height:50px;
 +
width:48px;
 
}
 
}
 
#Top_link.navbar-brand{/*Top link styling*/
 
#Top_link.navbar-brand{/*Top link styling*/
color:#6fff00;
+
color:#47BCC2;
 
font-size:25px;
 
font-size:25px;
 
margin-bottom:5px;
 
margin-bottom:5px;
 
opacity:0.6
 
opacity:0.6
 
}
 
}
 
 
#topnav{
 
#topnav{
padding-bottom:0px;
+
padding-bottom:0px;
position:fixed;
+
position:fixed;
 
}
 
}
 
#topnav (max-width: 767px) {
 
#topnav (max-width: 767px) {
display:none;
+
display:none;
 
}
 
}
 
#text{/*Top link text*/
 
#text{/*Top link text*/
color:#6fff00;
+
color:#47BCC2;
 
}
 
}
 
+
#myNavbar{
#Top_link:hover{
+
border: none;
color:#58cc00;
+
background:#d9d9d9;
+
border-radius:10px;
+
border-color:#eeeeee;
+
 
}
 
}
#Top_link:active{
+
/*sticky footer*/
color:#eeeeee;
+
.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;
 +
}
 
.flare{
 
.flare{
background-color:#6fff00;   
+
background-color:#8cd5d9;   
padding-top:5px;
+
padding-top:3px;
 
position:relative;
 
position:relative;
 
bottom:0px;
 
bottom:0px;
width:100%;  
+
width:100%;
 
}
 
}
 +
.footer{
 +
background-color:#e8e8e8;
 +
}
 +
/*Hides igm logo and team name*/
 +
#sideMenu, #top_title {display:none;}
 +
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px;}
 +
#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 :) */
 +
/*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:20px;
 +
padding-right:40px;
 +
padding-left:40px;
 +
font-size:100%;
 +
}
 +
.container ul, .container ol{
 +
font-size:140%;
 +
padding-right:40px;
 +
padding-left:60px;
 +
padding-top:10px;
 +
}
 +
/*Heading styles*/
 +
h1, h2, h3, h4, h5{
 +
text-align:center;
 +
color:#339499;
 +
font-weight:500;
 +
    padding-left: 40px;
 +
    padding-right: 40px;
 +
padding-top: 40px;
 +
padding-bottom:0;
 +
}
 +
h1{font-size:340%;}
 +
h2{font-size:280%;}
 +
h3{font-size:290%;}
 +
h4{font-size:260%;}
 +
h5{font-size:220%;}
 +
h6{
 +
color:#339499;
 +
font-weight:500;
 +
font-size:200%;
 +
padding-left:40px;
 +
padding-top: 20px;
 +
padding-bottom:-10px;
 +
}
 +
/*Italics for Quotes using i tag*/
 +
q{
 +
text-align:center;
 +
color:#339499;
 +
padding-left:10%;
 +
padding-right:10%;
 +
font-size:120%;
 +
font-style: italic;
 +
}
 +
/*Styling for links*/
 +
a{
 +
color:#339499;
 +
font-weight:550;
 +
}
 +
/**page content styling starts**/
 +
body{
 +
background-color:#eeeeee;
 +
}
 +
h1{
 +
text-align:center;
 +
        border-style:none;
 +
}
 +
#Section_Link, #Section_Link:visited{
 +
display:block;
 +
margin:0 auto 10px auto;
 +
width:14px;
 +
}
 +
#Section_Link:hover{
  
 +
}
 +
#sectionGap, #sectionGap:focus, #contentTitle{
 +
min-width:100%;
 +
min-height:10vh;
 +
background:#e8e8e8;
 +
display:block;
 +
font-size:400%;
 +
text-align:center;
 +
color:#47BCC2;
 +
text-decoration:none;
 +
border-style:none none solid none;
 +
border-width:3px;
 +
border-color:#8cd5d9;
 +
}
 +
#sectionGap:hover, #sectionGap:active{
 +
color:#339499;
 +
}
 +
.container{
 +
min-width:100%;
 +
padding:0;
 +
}
 +
.div_vl{
 +
padding-top:2%;
 +
height:35vw;
 +
width:95vw;
 +
display:block;
 +
margin-left:auto;
 +
margin-right:auto;
 +
}
 +
.div_vl.backgroundimage{
 +
background-image: url('https://static.igem.org/mediawiki/2016/9/93/T--Exeter--Home_Background1.png');
 +
background-repeat:no-repeat;
 +
background-size: 100% auto;
 +
width:100%;
 +
height:88vh;
 +
}
 +
#title{
 +
style="font-family: 'Arial';
 +
color:#4e4e4e;
 +
text-align:center;
 +
margin-bottom:20px;
 +
font-size:400%;
 +
}
 +
.div_content{
 +
padding:0;
 +
min-height:100vh;
 +
width:100%;
 +
background:#eeeeee;
 +
}
  
#mainLink{ /*Makes ExGem larger than other tabs.*/
+
/*div_banner contains to links at the top of each page to link to*/
font-size: 25px;
+
/*each section of the page*/
color:#6fff00;
+
.div_banner{
 +
max-width:90vw;
 +
margin:12vh auto 5vh auto;
 +
display:block;
 +
height:8vh;
 +
}
 +
 
 +
/*Contains styling for the left and right pictures of the banner*/
 +
.subdiv_banner{
 +
height:8vh;
 +
padding:0;
 +
margin:auto;
 +
position:relative;
 +
bottom:0;
 +
right:0;
 +
}
 +
.subdiv_banner.left{
 +
float:left;
 +
display:block;
 +
}
 +
.subdiv_banner.right{
 +
float:right;
 +
display:block;
 +
}
 +
.subdiv_banner.middle{
 +
height:100%;
 +
}
 +
/*Positions the images in correct place in the divs*/
 +
.subdiv_banner.left img, .subdiv_banner.right img{
 +
width:100%;
 +
position: relative;
 +
top: 38%;
 +
-ms-transform: translateY(-50%) /* IE 9 */
 +
    -webkit-transform: translateY(-50%) /* Chrome, Safari, Opera */
 +
    transform: translateY(-50%);
 +
}
 +
.banner_link,.banner_link:visited{
 +
position: relative;
 +
height:100%;
 +
padding:0, 2px!important;
 +
color:#47BCC2;
 +
text-align:center;
 +
font-size:1.5vw;
 +
/*Max font size where "section" and "1" don't appear on*/
 +
}
 +
.banner_link span.oneline{
 +
position: relative;
 +
top: 34.5%;
 +
-ms-transform: translateY(-50%) /* IE 9 */
 +
    -webkit-transform: translateY(-50%) /* Chrome, Safari, Opera */
 +
    transform: translateY(-50%);
 +
}
 +
.banner_link span.twoline{
 +
position: relative;
 +
top: 7.5%;
 +
-ms-transform: translateY(-50%) /* IE 9 */
 +
    -webkit-transform: translateY(-50%) /* Chrome, Safari, Opera */
 +
    transform: translateY(-50%);
 +
}
 +
.banner_link:hover{
 +
text-decoration:none;
 +
color:#339499;
 +
}
 +
.link_fix{
 +
display:block;
 +
position:relative;
 +
height:1px;
 +
top:-15px;
 +
}
 +
/*Mobile and small screen css*/
 +
@media (max-width: 767px){
 +
.link_fix{
 +
display:none;
 +
}
 +
.div_vl.backgroundimage{
 +
background-image: url('#');
 +
background:#ddd;
 +
}
 +
#title{
 +
font-size:260%;
 +
}
 +
.banner_link{
 +
font-size:22px;
 +
}
 +
.div_banner{
 +
margin-top:20px;
 +
}
 +
/*Makes side pictures on banner invisible on small screens*/
 +
/*as it clutters screen*/
 +
.subdiv_banner.left, .subdiv_banner.right{
 +
display:none;
 +
}
 +
}
 +
 
 +
/*Team page css*/
 +
.role{
 +
text-align:center;
 +
color:6fff00;
 +
font-size:80%;
 
}
 
}
 
ul.img-list {
 
ul.img-list {
Line 173: Line 448:
 
       width: 100%;
 
       width: 100%;
 
}
 
}
 
+
#moda{
 +
color:#23527c;
 +
}
 
span.name{
 
span.name{
 
   color: black;
 
   color: black;
Line 195: Line 472:
 
opacity:0.4;
 
opacity:0.4;
 
}
 
}
* {
+
#dropdownMenu1{
  margin: 0;
+
margin-top:-0.15vw;
 +
background:#e8e8e8;
 +
border-style:none;
 
}
 
}
/*sticky footer*/
+
@media (min-width: 767px){
.wrap {
+
.dropdown-menu{
  min-height: 100%;
+
margin-top:24px;
  margin-bottom: -65px;   /* equal to footer height */
+
left:-19px;
 +
border-radius:0px;
 +
padding:4px;
 +
}
 
}
 
}
.wrap:after {
+
/*Mobile and small screen css*/
  content: "";
+
@media (max-width: 767px){
  display: block;
+
.div_vl.backgroundimage{
 +
height:37vh;
 +
background-size: auto 200%;
 +
}
 +
.div_l{
 +
display:none;
 +
}
 +
#logo_Banner_Desktop{
 +
display:none;
 +
}
 +
#logo_Banner_Mobile{
 +
display:block;
 +
width:100%;
 +
max-width:200px;
 +
margin:auto;
 +
}
 +
#dropdownMenu1{
 +
padding:2.5% 0 2% 0;
 +
margin:-1.6% auto -1.4% 0.9%;
 +
}
 +
#links{
 +
padding:10px 0;
 +
margin-left:0.85vw;
 +
}
 
}
 
}
.footer, .wrap:after {
+
#links_drop{
  height: 60px;  
+
color:#47BCC2;
  padding-top:5px;
+
/*font-size:20px;*/
 +
font-size:1.2vw;
 +
margin:8px 0.9vw 0.5vh 0.9vw;
 +
padding:0.06vw 0 0 0;
 +
line-height:0px;
 
}
 
}
.flare .wrap:after{
+
@media (max-width: 920px){
height:5px;
+
#links_drop{
}
+
margin-left:0;
.role{
+
padding-top:9px;
text-align:center;
+
margin-top:-4px;
color:6fff00;
+
font-size:20px;
font-size:80%;
+
}
 
}
 
}
.footer{
+
button.dropdown-toggle{
background-color:#4e4e4e;
+
padding-top:21px; !important
 
}
 
}
.navbar{
+
@media (max-width: 767px){
background-color:#4e4e4e;
+
button.dropdown-toggle{
border-bottom:none;
+
padding-top:5px;
min-height:54px;
+
}
        margin:6px 0 0 0;
+
 
}
 
}
.navbar-inverse .navbar-toggle .icon-bar {/*green toggle */
+
#links_drop:hover span{
    background-color:#6fff00;
+
color:#339499;
 
}
 
}
.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{
 
margin-right:3px;
 
}
 
.soc_3{
 
margin-right: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 :) */
 
 
 
</style>
 
</style>
  
 +
<div id="top_page" class="link_fix"></div>
 
<nav id="Top" class="navbar navbar-inverse navbar-static-top">
 
<nav id="Top" class="navbar navbar-inverse navbar-static-top">
 
   <div class="container-fluid">
 
   <div class="container-fluid">
Line 285: Line 550:
 
           <span class="icon-bar"></span>                         
 
           <span class="icon-bar"></span>                         
 
</button>
 
</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>
+
       <a id="logo_button" class="navbar-brand" href="https://2016.igem.org/Team:Exeter">
 +
<img id="logo" src="https://static.igem.org/mediawiki/2016/7/75/T--Exeter--Template--Logo2.png"/>
 +
<img id="logo_inverse" src="https://static.igem.org/mediawiki/2016/2/23/T--Exeter--Template_Logo2_inverse.png"/>
 +
  </a>
 
   
 
   
 
     </div>
 
     </div>
 
     <div>
 
     <div>
 
         <div class="collapse navbar-collapse" id="myNavbar">
 
         <div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav" >
+
<ul class="nav navbar-nav">
<li ><a id="links"href="https://2016.igem.org/Team:Exeter">Project</a></li>
+
<li><div id="links_drop" class="dropdown">
  <li><a id="links"href="#">Parts</a></li>
+
  <button class="dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
  <li ><a id="links"href="https://2016.igem.org/Team:Exeter/Team">Team</a></li>
+
    <span style="margin-bottom:4px;">Lab</span>
  <li><a id="links" href="#">Human Practices</a></li></li>
+
    <span class="caret"></span>
  <li><a id="links"href="#">Attributions</a></li>
+
  </button>
  <li><a id="links"href="#">Awards</a></li>
+
  <ul class="dropdown-menu" style="background:#e8e8e8;margin-left:25px;" aria-labelledby="dropdownMenu1">
</ul>
+
<li><a id="links" style="margin:10px 0 30px 2px;padding:0;font-size:1.8vh;" href="https://2016.igem.org/Team:Exeter/Project">Lab Project</a></li>
<ul class="nav navbar-nav navbar-right" >
+
    <li><a id="links" style="margin:30px 0 10px 2px;padding:0;font-size:1.8vh;" href="https://2016.igem.org/Team:Exeter/Labbook">Lab Book</a></li>
<li style="height:50px;width:48px;"class="soc_1"><a style="height:50px;width:48px;"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;"class="soc_2"><a style="height:50px;width:48px;"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>
+
  </ul>
    <li style="height:50px;width:48px;"class="soc_3"><a style="height:50px;width:48px;" href="https://twitter.com/exeter_igem"><img id = "soc" src="https://static.igem.org/mediawiki/2016/7/76/Twit.jpg"/></a></li>
+
</div></li>
 +
<li ><a id="links"href="https://2016.igem.org/Team:Exeter/Parts">Parts</a></li>
 +
<li ><a id="links"href="https://2016.igem.org/Team:Exeter/Team">Team</a></li>
 +
<li><a id="links" href="https://2016.igem.org/Team:Exeter/Interlab">InterLab</a></li>
 +
<li><div id="links_drop" class="dropdown">
 +
  <button class="dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
 +
    <span style="margin-bottom:4px;">Human Practices</span>
 +
    <span class="caret"></span>
 +
  </button>
 +
  <ul class="dropdown-menu" style="background:#e8e8e8;margin-left:25px;" aria-labelledby="dropdownMenu1">
 +
    <li><a id="links" style="margin:10px 0 10px 2px;padding:0;font-size:1.8vh;" href="https://2016.igem.org/Team:Exeter/Integrated_Practices">Integrated</a></li>
 +
<li><a id="links" style="background:none;line-height:0.7vh;margin:30px 0 10px 2px;padding:0;font-size:1.8vh;" href="https://2016.igem.org/Team:Exeter/Engagement">Public Engagement<br /><br /><br /> & Education</a></li><li><a id="links" style="margin:30px 0 10px 2px;padding:0;font-size:1.8vh;" href="https://2016.igem.org/Team:Exeter/Log">Log</a></li>
 +
 
 +
  </ul>
 +
</div></li>
 +
 
 +
<li ><a id="links"href="https://2016.igem.org/Team:Exeter/Attributions">Attributions</a></li>
 +
 
 +
<li><div id="links_drop" class="dropdown">
 +
  <button class="dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
 +
    <span style="margin-bottom:4px;">Awards</span>
 +
    <span class="caret"></span>
 +
  </button>
 +
  <ul class="dropdown-menu" style="background:#e8e8e8;margin-left:25px;" aria-labelledby="dropdownMenu1">
 +
 
 +
<li><a id="links" style="margin:10px 0 30px 2px;padding:0;font-size:1.8vh;" href="https://2016.igem.org/Team:Exeter/Awards">Awards</a></li>
 +
<li><span style="margin:10px 0 30px 2px;padding:0;">Special pages</span></li>
 +
<li><a id="links" style="margin:30px 0 10px 2px;padding:0;font-size:1.8vh;" href="https://2016.igem.org/Team:Exeter/HP/Silver">HP Silver</a></li>
 +
<li><a id="links" style="margin:30px 0 10px 2px;padding:0;font-size:1.8vh;" href="https://2016.igem.org/Team:Exeter/HP/Gold">HP Gold</a></li>
 +
 
 +
  </ul>
 +
</div></li>
 +
<li ><a id="links"href="https://2016.igem.org/Team:Exeter/Model">Models</a></li>
 +
<li ><a id="links"href="https://2016.igem.org/Team:Exeter/Collaborations">Collaborations</a></li>
 +
 
 +
 
 +
 
 
</ul>
 
</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;"class="soc_2">
 +
<a 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>
 
     </div>
 
   </div>
 
   </div>
</nav>  
+
</nav>
<div style="height:6px; background-color:#828282; margin-top:0px;" ></div>
+
<div style="height:3px; background-color:#8cd5d9; margin-top:0px;" ></div>
 +
<!--div below contains a rolling counter for scrolling position-->
 +
<div id="scrollPosition" style="display:none;">0</div>
 +
<script>
 +
$(document).ready(function(){
 +
//topnav script
 +
var width = document.documentElement.clientWidth;
 +
console.log(width, "Hello, world!");
 +
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);
 +
}
 +
})
 +
}
 +
//Causes the navbar logo to switch between the default and
 +
//inverse versions when the <a> with #logo_button is hovered over
 +
$('#logo_button').hover(function(){
 +
$('#logo').toggle();
 +
$('#logo_inverse').toggle();
 +
});
 +
});
 +
//Smooth scrolling//
 +
$('a[href^="#"]').on('click',function (e) {
 +
    e.preventDefault();
 +
 
 +
    var target = this.hash;
 +
    var $target = $(target);
 +
 
 +
    $('html, body').stop().animate({
 +
        'scrollTop': $target.offset().top
 +
    }, 900, 'swing', function () {
 +
        window.location.hash = target;
 +
    });
 +
});
 +
</script>
 +
<!--Counter and topnav ends-->
 +
<!--Content begins-->
 +
<div class="container">
 +
<div class="div_vl backgroundimage">
 +
<h1 id="title">Meet the Team </h1>
 +
<!--Contains links to sections on page-->
 +
<div class="div_banner">
 +
<!--Right picture (the teal line on right)-->
 +
<div class="col-sm-2 subdiv_banner left">
 +
<img src="https://static.igem.org/mediawiki/2016/8/8a/T--Exeter--Template_Banner_left.png">
 +
</div>
 +
<!--Contains all information of banner in the middle-->
 +
<!--of the two outer images-->
 +
<div class="col-xs-12 col-sm-8 subdiv_banner middle">
 +
<!--Use bootstrap to add links using all 12 columns-->
 +
<!--For each link please give double the coloumns for when-->
 +
<!--the screen is xs compared to when it is sm-->
 +
 +
<!--Give span class "oneline" or "twoline" depending on how llong the section text is-->
 +
<a href="#section_1" class="banner_link col-xs-6"><span class="oneline">Student Team</span></a>
 +
<a href="#section_2" class="banner_link col-xs-6"><span class="oneline">Advisory Team</span></a>
 +
 +
</div>
 +
<!--Left picture (the teal line on left)-->
 +
<div class="col-sm-2 subdiv_banner right">
 +
<img src="https://static.igem.org/mediawiki/2016/5/56/T--Exeter--Template_Banner_right.png">
 +
</div>
 +
</div>
 +
<div>
 +
<a id="Section_link" href="#section_1" style="display:block;margin:34vh auto 0 auto;width:14px;"><span style="color:#47BCC2;font-size: 25px;" class="glyphicon glyphicon-menu-down" aria-hidden="true"></span></a>
 +
</div>
 +
 +
</div>
 +
<div class="col-xs-12 div_content">
 +
<div id="section_1" class="link_fix"></div>
 +
<div id="contentTitle">
 +
Student Team
 +
</div>
 
<div class="wrap">
 
<div class="wrap">
 
<!--Content Begins-->
 
<!--Content Begins-->
Line 313: Line 719:
 
<div id="scrollPosition" style="display:none;">0</div>
 
<div id="scrollPosition" style="display:none;">0</div>
 
<!--Counter finished-->
 
<!--Counter finished-->
<div id="Team_home">
 
<img style="width:100%"src="https://static.igem.org/mediawiki/2016/4/45/T--Exeter--Team_Team.jpg">
 
<span id="Team_home_Text" ><span id="text_background">Meet The Team</span></span>
 
  
</div>
+
<div id="Team" class="container" style="padding:0px 30px 0px 30px;">
  
 
<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-12" style="padding:2% 0;">
<div class="col-xs-0 col-sm-2 col-me-5"></div>
+
<div class="col-xs-0 col-sm-0 col-me-2"></div>
<div class="col-xs-12 col-sm-8 col-me-2">
+
<div class="col-xs-12 col-sm-6 col-me-4">
 
<div class="row" style="padding-top:20px">
 
<div class="row" style="padding-top:20px">
<video style="width:99%;" controls>
+
<video style="height:356px;width:632px;margin:auto;display:block;width:90%;" controls>
 
<source src="https://static.igem.org/mediawiki/2016/c/c9/T--Exeter--Team_1.Webm" type="video/webm">
 
<source src="https://static.igem.org/mediawiki/2016/c/c9/T--Exeter--Team_1.Webm" type="video/webm">
 +
<source src="https://static.igem.org/mediawiki/2016/1/13/T--Exeter--Team_videomp4.mp4" type="video/mp4">
 +
<source src="https://static.igem.org/mediawiki/2016/7/73/T--Exeter--Team_video.ogg" type="video/ogg">
 +
 +
Your browser does not support the video tag.
 +
</video>
 +
</div>
 +
</div>
 +
<div class="col-xs-12 col-sm-6 col-me-4">
 +
<div class="row" style="padding-top:20px">
 +
<video style="height:356px;width:632px;margin:auto;display:block;width:90%;" controls>
 +
<source src="https://static.igem.org/mediawiki/2016/8/81/T--Exeter--Team_Teamvideo2mp4.mp4" type="video/mp4">
 +
<source src="https://static.igem.org/mediawiki/2016/7/7c/T--Exeter--Team_Teamvideo2ogg.ogg" type="video/ogg">
 
 
 
Your browser does not support the video tag.
 
Your browser does not support the video tag.
Line 334: Line 745:
 
</div>
 
</div>
 
</div>
 
</div>
<div class="col-xs-0 col-sm-2 col-me-5"></div>
+
<div class="col-xs-0 col-sm-0 col-me-2"></div>
 
<div class="col-xs-12"><h1>Click on a member of the team to find out more:</h1></div>
 
<div class="col-xs-12"><h1>Click on a member of the team to find out more:</h1></div>
 
<hr style="border-color:#777777; margin:0;"/>
 
<hr style="border-color:#777777; margin:0;"/>
Line 354: Line 765:
 
</div>
 
</div>
 
<div class="modal-body">
 
<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" style="text-align:left;"><span style="color:#15B5C5;";>Course:</span> Physics Mphys<span style="float:right"><span style="color:#15B5C5;">Age: </span>19</span></p>
 
<p id="pp">
 
<p id="pp">
 
Hi! My name's Leanne, and I'm a first year Physics student from Birmingham.  
 
Hi! My name's Leanne, and I'm a first year Physics student from Birmingham.  
Line 365: Line 776:
 
<div class="modal-footer">
 
<div class="modal-footer">
 
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 
<!--<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>
+
<p id="pp" style="text-align:center;"><span style="color:#15B5C5;text-align:center;">Email: </span>lds211@exeter.co.uk</p>
 
</div>
 
</div>
 
</div>
 
</div>
Line 393: Line 804:
 
<div class="modal-body">
 
<div class="modal-body">
 
<p id="pp" style="text-align:left;">
 
<p id="pp" style="text-align:left;">
<span style="color:#6fff00;";>Course:</span>   
+
<span style="color:#15B5C5;";>Course:</span>   
 
BSc Biological and Medicinal Chemistry </p>
 
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"><span style="text-align:center;"><span style="color:#15B5C5;">Age: </span>20</span></p>
 
<p id="pp">Hallo! My name’s is Jack. I live in Cornwall, though I am originally from Kent.
 
<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 enjoy doing impressions, playing football and listening to an eclectic mix of music.  
Line 405: Line 816:
 
<div class="modal-footer">
 
<div class="modal-footer">
 
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 
<!--<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>jehf201@exeter.co.uk</p>
+
<p id="pp" style="text-align:center;"><span style="color:#15B5C5;text-align:center;">Email: </span>jehf201@exeter.co.uk</p>
 
</div>
 
</div>
 
</div>
 
</div>
Line 432: Line 843:
 
</div>
 
</div>
 
<div class="modal-body">
 
<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" style="text-align:left;"><span style="color:#15B5C5;";>Course:</span>Biochemistry Bsc<span style="float:right"><span style="color:#15B5C5;">Age: </span>19</span></p>
 
<p id="pp"> Hello, my name is Eloise!
 
<p id="pp"> Hello, my name is Eloise!
 
I am a first year Biochemist on Team Science for Exeter’s iGEM 2016 team.  
 
I am a first year Biochemist on Team Science for Exeter’s iGEM 2016 team.  
Line 443: Line 854:
 
<div class="modal-footer">
 
<div class="modal-footer">
 
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 
<!--<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>egl202@exeter.co.uk</p>
+
<p id="pp" style="text-align:center;"><span style="color:#15B5C5;text-align:center;">Email: </span>egl202@exeter.co.uk</p>
 
</div>
 
</div>
 
</div>
 
</div>
Line 471: Line 882:
 
</div>
 
</div>
 
<div class="modal-body">
 
<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" style="text-align:left;"><span style="color:#15B5C5;">Course:</span> Physics Mphys<span style="float:right"><span style="color:#15B5C5;">Age: </span>20</span></p>
 
<p id="pp">Hey, I'm Alan. I'm really into science. I joined the iGEM team so I could put the skills I have learnt in my degree into practice.  
 
<p id="pp">Hey, I'm Alan. I'm really into science. I joined the iGEM team so I could put the skills I have learnt in my degree into practice.  
 
It's been great so far and I'm really enjoying the experience. I enjoy programming thus I'm one of the wiki guys.
 
It's been great so far and I'm really enjoying the experience. I enjoy programming thus I'm one of the wiki guys.
Line 479: Line 890:
 
<div class="modal-footer">
 
<div class="modal-footer">
 
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 
<!--<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>
+
<p id="pp" style="text-align:center;"><span style="color:#15B5C5;text-align:center;">Email: </span>aw505@exeter.co.uk</p>
 
</div>
 
</div>
 
</div>
 
</div>
Line 510: Line 921:
 
<div class="modal-footer">
 
<div class="modal-footer">
 
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 
<!--<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>ExeteriGEM2016@gmail.com</p>
+
<p id="pp" style="text-align:center;"><span style="color:#15B5C5;text-align:center;">Email: </span>ExeteriGEM2016@gmail.com</p>
 
</div>
 
</div>
 
</div>
 
</div>
Line 536: Line 947:
 
</div>
 
</div>
 
<div class="modal-body">
 
<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" style="text-align:left;"><span style="color:#15B5C5;";>Course:</span> Biological Sciences BsSc<span style="float:right"><span style="color:#15B5C5;">Age: </span>25</span></p>
 
<p id="pp">  
 
<p id="pp">  
 
I’m a first year biological sciences student,
 
I’m a first year biological sciences student,
Line 546: Line 957:
 
<div class="modal-footer">
 
<div class="modal-footer">
 
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 
<!--<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>db436@exeter.co.uk</p>
+
<p id="pp" style="text-align:center;"><span style="color:#15B5C5;text-align:center;">Email: </span>db436@exeter.co.uk</p>
 
</div>
 
</div>
 
</div>
 
</div>
Line 574: Line 985:
 
</div>
 
</div>
 
<div class="modal-body">
 
<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" style="text-align:left;"><span style="color:#15B5C5;";>Course:</span> Biochemistry BSc<span style="float:right"><span style="color:#15B5C5;">Age: </span>19</span></p>
 
<p id="pp">
 
<p id="pp">
 
Hello! My name is Emily.  
 
Hello! My name is Emily.  
Line 585: Line 996:
 
<div class="modal-footer">
 
<div class="modal-footer">
 
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 
<!--<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>
+
<p id="pp" style="text-align:center;"><span style="color:#15B5C5;text-align:center;">Email: </span>er373@exeter.co.uk</p>
 
</div>
 
</div>
 
</div>
 
</div>
Line 611: Line 1,022:
 
</div>
 
</div>
 
<div class="modal-body">
 
<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" style="text-align:left;"><span style="color:#15B5C5;";>Course:</span> Bioscience Bsc<span style="float:right"><span style="color:#15B5C5;">Age: </span>20</span></p>
 
<p id="pp">
 
<p id="pp">
 
Hello! My name is Alice and over the summer I’ll be documenting the progress of our team. 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, travelling to schools 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.
 
Hello! My name is Alice and over the summer I’ll be documenting the progress of our team. 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, travelling to schools 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.
Line 619: Line 1,030:
 
<div class="modal-footer">
 
<div class="modal-footer">
 
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 
<!--<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>avr207@exeter.co.uk</p>
+
<p id="pp" style="text-align:center;"><span style="color:#15B5C5;text-align:center;">Email: </span>avr207@exeter.co.uk</p>
 
</div>
 
</div>
 
</div>
 
</div>
Line 645: Line 1,056:
 
</div>
 
</div>
 
<div class="modal-body">
 
<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" style="text-align:left;"><span style="color:#15B5C5;";>Course:</span> Physics with Astrophysics Mphys<span style="float:right"><span style="color:#15B5C5;">Age: </span>20</span></p>
 
<p id="pp">Hi, I'm Hannah, a third year student passionate about space research,  
 
<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.
 
finding exoplanets and encouraging a new generation into science and space exploration.
Line 655: Line 1,066:
 
<div class="modal-footer">
 
<div class="modal-footer">
 
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 
<!--<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>
+
<p id="pp" style="text-align:center;"><span style="color:#15B5C5;text-align:center;">Email: </span>hlmo201@exeter.co.uk</p>
 
</div>
 
</div>
 
</div>
 
</div>
Line 682: Line 1,093:
 
</div>
 
</div>
 
<div class="modal-body">
 
<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" style="text-align:left;"><span style="color:#15B5C5;";>Course:</span> Physics Mphys<span style="float:right"><span style="color:#15B5C5;">Age: </span>20</span></p>
 
<p id="pp">Hi, my name is Andy. I have a passion for learning new things,
 
<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,
 
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,  
 
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,
+
so I jumped at the opportunity. Outside of science I have a great interest in fitness and general well-being, whilst still appreciating an evening in with mates.
often staying up until early hours of the morning on skype.
+
 
</p>
 
</p>
 
</div>
 
</div>
 
<div class="modal-footer">
 
<div class="modal-footer">
 
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 
<!--<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>aw553@exeter.co.uk</p>
+
<p id="pp" style="text-align:center;"><span style="color:#15B5C5;text-align:center;">Email: </span>aw553@exeter.co.uk</p>
 
</div>
 
</div>
 
</div>
 
</div>
Line 719: Line 1,129:
 
</div>
 
</div>
 
<div class="modal-body">
 
<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" style="text-align:left;"><span style="color:#15B5C5;";>Course:</span> Biological Sciences BSc<span style="float:right"><span style="color:#15B5C5;">Age: </span>20</span></p>
 
<p id="pp">HI! My name is Pablo. I speak three languages: English, Spanish and French.
 
<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.  
 
I also love travelling and meeting people with different backgrounds, as I believe that it gives a better understanding of how the world works.  
Line 727: Line 1,137:
 
<div class="modal-footer">
 
<div class="modal-footer">
 
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 
<!--<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>pcs213@exeter.co.uk</p>
+
<p id="pp" style="text-align:center;"><span style="color:#15B5C5;text-align:center;">Email: </span>pcs213@exeter.co.uk</p>
 
</div>
 
</div>
 
</div>
 
</div>
Line 755: Line 1,165:
 
</div>
 
</div>
 
<div class="modal-body">
 
<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" style="text-align:left;"><span style="color:#15B5C5;";>Course:</span> Physics Mphys<span style="float:right"><span style="color:#15B5C5;">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.
 
<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.  
 
Other than science I listen to a lot of music, mainly rock/metal and I attend as many concerts and festivals as possible.  
Line 763: Line 1,173:
 
<div class="modal-footer">
 
<div class="modal-footer">
 
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 
<!--<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>
+
<p id="pp" style="text-align:center;"><span style="color:#15B5C5;text-align:center;">Email: </span>jb702@exeter.co.uk</p>
 
</div>
 
</div>
 
</div>
 
</div>
Line 777: Line 1,187:
 
<hr style="border-color:#777777; margin:0;">
 
<hr style="border-color:#777777; margin:0;">
 
 
 
+
</div>
<div class="col-xs-12"><h1>Advisory Team</h1></div>
+
<div class="col-xs-12 div_content">
 +
<div id="section_2" class="link_fix"></div>
 +
<div id="contentTitle">
 +
Advisory Team
 +
</div>
 +
<div style="padding:0 2%;">
 
 
<hr style="border-color:#777777; margin:0;"/>
+
 
 
<div class="row">
 
<div class="row">
 
<div class="col-md-4 col-sm-6 col-xs-12">
 
<div class="col-md-4 col-sm-6 col-xs-12">
Line 800: Line 1,215:
 
</div>
 
</div>
 
<div class="modal-body">
 
<div class="modal-body">
 +
 +
 +
<p id="pp">I am a third year PhD student, working in the Exeter Microbial Biofuels Group.
 +
I am attempting to develop a set of thoroughly characterised, robust synthetic
 +
promoters in a non-model organism using statistical models that link promoter
 +
sequence and structure to function. This is my first year being involved with
 +
iGEM, but I have enjoyed working with the team and am looking forward to being
 +
a judge in Boston.</p>
 
 
 
</div>
 
</div>
 
<div class="modal-footer">
 
<div class="modal-footer">
 
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 
<!--<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>jg371@exeter.co.uk</p>
+
<p id="pp" style="text-align:center;"><span style="color:#15B5C5;text-align:center;">Email: </span>jg371@exeter.co.uk</p>
 
</div>
 
</div>
 
</div>
 
</div>
Line 837: Line 1,260:
 
<div class="modal-footer">
 
<div class="modal-footer">
 
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 
<!--<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>c.singleton@exeter.ac.uk</p>
+
<p id="pp" style="text-align:center;"><span style="color:#15B5C5;text-align:center;">Email: </span>c.singleton@exeter.ac.uk</p>
 
</div>
 
</div>
 
</div>
 
</div>
Line 867: Line 1,290:
 
<div class="modal-footer">
 
<div class="modal-footer">
 
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 
<!--<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>j.love@exeter.co.uk</p>
+
<p id="pp" style="text-align:center;"><span style="color:#15B5C5;text-align:center;">Email: </span>j.love@exeter.co.uk</p>
 
</div>
 
</div>
 
</div>
 
</div>
Line 882: Line 1,305:
 
<li>
 
<li>
 
<a data-toggle="modal" data-target="#myModalB" id="moda">
 
<a data-toggle="modal" data-target="#myModalB" id="moda">
<span class="name"><span>Dr James Paul</span></span>
+
<span class="name"><span>Dr Paul James</span></span>
 
<img class="hover" src="https://static.igem.org/mediawiki/2016/3/34/T--Exeter--Team_james.jpg" style="width:100%;"/>
 
<img class="hover" src="https://static.igem.org/mediawiki/2016/3/34/T--Exeter--Team_james.jpg" style="width:100%;"/>
 
 
Line 892: Line 1,315:
 
<div class="modal-header">
 
<div class="modal-header">
 
<button type="button" class="close" data-dismiss="#myModalB">&times;</button>
 
<button type="button" class="close" data-dismiss="#myModalB">&times;</button>
<h2 class="modal-title">Dr James Paul<br />
+
<h2 class="modal-title">Dr Paul James<br />
 
<span class="role"></span></h2>
 
<span class="role"></span></h2>
 
</div>
 
</div>
 
<div class="modal-body">
 
<div class="modal-body">
+
                <p id="pp">I am a Research Fellow working under Professor Love in the Exeter Microbial Biofuels group with our research focusing on using a synthetic biology approach to producing customisable petroleum replica fuel molecules. I have been involved with iGEM since 2013 and i continue to be amazed by the range and depth of projects that our brilliant students produce year in year out and i am looking forward to another fantastic year.</p>
 
</div>
 
</div>
 
<div class="modal-footer">
 
<div class="modal-footer">
 
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 
<!--<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>P.B.C.James@exeter.co.uk</p>
+
<p id="pp" style="text-align:center;"><span style="color:#15B5C5;text-align:center;">Email: </span>P.B.C.James@exeter.co.uk</p>
 
</div>
 
</div>
 
</div>
 
</div>
Line 932: Line 1,355:
 
<div class="modal-footer">
 
<div class="modal-footer">
 
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 
<!--<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;"> </span></p>
+
<p id="pp" style="text-align:center;"><span style="color:#15B5C5;text-align:center;"> </span></p>
 
</div>
 
</div>
 
</div>
 
</div>
Line 956: Line 1,379:
 
<div class="modal-header">
 
<div class="modal-header">
 
<button type="button" class="close" data-dismiss="#myModalA">&times;</button>
 
<button type="button" class="close" data-dismiss="#myModalA">&times;</button>
<h2 class="modal-title">Ryan Edginton<br />
+
</a><h3 class="modal-title">Ryan Edginton<br /></h3>
<a href="http://emps.exeter.ac.uk/physics-astronomy/staff/rse204"><span class="role">Research Profile</span></a></h2>
+
 
</div>
 
</div>
 
<div class="modal-body">
 
<div class="modal-body">
Line 966: Line 1,388:
 
<div class="modal-footer">
 
<div class="modal-footer">
 
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
 
<!--<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>rse204@exeter.co.uk</p>
+
<p id ="pp" style="text-align:center;"><a href="http://emps.exeter.ac.uk/physics-astronomy/staff/rse204"
 +
style="text-align:center;">Research Profile</a></p>
 +
<p id="pp" style="text-align:center;"><span style="color:#15B5C5;text-align:center;">Email: </span>rse204@exeter.co.uk</p>
 
</div>
 
</div>
 
</div>
 
</div>
Line 976: Line 1,400:
 
</div>
 
</div>
 
</div>
 
</div>
 +
 
</div>
 
</div>
 
 
</div>
 
</div>
 +
</div>
 +
 +
<div>
 +
 +
</div>
 +
 +
 +
</div>
 
</div>
 
</div>
 
<!--Content Ends-->
 
<!--Content Ends-->
<nav id="topnav" class="nav-navbar" style="right:3px;">
+
<nav id="topnav" class="nav-navbar" style="right:2px;">
 
   <div class="container-fluid">
 
   <div class="container-fluid">
 
     <div class="navbar-header">
 
     <div class="navbar-header">
       <a class="navbar-brand" id="Top_link" href="#Top"><span class="glyphicon glyphicon-menu-up" aria-hidden="true"></span></a>
+
       <a class="navbar-brand" id="Top_link" href="#top_page">
 +
<span class="glyphicon glyphicon-menu-up" aria-hidden="true" style="max-width:1%;"></span>
 +
  </a>
 
     </div>
 
     </div>
 
   </div>
 
   </div>
Line 990: Line 1,424:
 
<div class="flare"></div>
 
<div class="flare"></div>
 
<footer class="footer">
 
<footer class="footer">
<a id="you" href="https://www.youtube.com/channel/UC31qfG4hnm8gRHDCkrBtAiQ"><img src="https://static.igem.org/mediawiki/2016/2/23/You.png"/></a>
+
<a href="https://www.youtube.com/channel/UC31qfG4hnm8gRHDCkrBtAiQ">
<a href="https://www.facebook.com/ExeteriGEM2016/?ref=aymt_homepage_panel"><img src="https://static.igem.org/mediawiki/2016/5/51/Fb.png"/></a>
+
<img style="padding-left:3%" src="https://static.igem.org/mediawiki/2016/2/23/You.png"/>
<a href="https://twitter.com/exeter_igem"><img src="https://static.igem.org/mediawiki/2016/7/76/Twit.jpg"/></a>
+
</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>
 
</footer>
 
+
<!--numbr 1:  i cant get your toplink to show number 2: weird grey bar on toggle menue-->
 
</body>
 
</body>
  
<html>
+
</html>
<!--Things to add:
+
*Team vid 2
+
-->
+

Latest revision as of 21:46, 18 October 2016