Difference between revisions of "Team:Exeter/revised"

 
(36 intermediate revisions by the same user not shown)
Line 1: Line 1:
<html>  
+
<html>
    <meta charset="utf-8">
+
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
    <meta name="viewport" content="width=device-width, initial-scale=1">
+
</head>
    <meta name="description" content="">
+
    <meta name="author" content="">
+
  
 
     <!-- Bootstrap Core CSS -->
 
     <!-- Bootstrap Core CSS -->
Line 12: Line 10:
 
     <link href="https://2015.igem.org/Team:Exeter/sb-admin-2.css?action=raw&amp;ctype=text/css" rel="stylesheet">
 
     <link href="https://2015.igem.org/Team:Exeter/sb-admin-2.css?action=raw&amp;ctype=text/css" rel="stylesheet">
  
     <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
+
     <link href="https://2015.igem.org/Team:Exeter/lib/jquery.bxslider.css?action=raw&amp;ctype=text/css" rel="stylesheet">
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+
 
     <!--[if lt IE 9]>
+
     <link href='http://fonts.googleapis.com/css?family=Ek+Mukta' rel='stylesheet' type='text/css'>
        <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+
 
        <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
+
    <script src="https://2015.igem.org/Team:Exeter/ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js?action=raw&amp;ctype=text/javascript"></script>
    <![endif]-->   
+
 
+
    <script src="https://2015.igem.org/Team:Exeter/js/jquery.bxslider.min.js?action=raw&ctype=text/javascript"></script>
<!-- jQuery Scripts -->
+
 
<script src="https://2015.igem.org/Team:Exeter/jquery-1-11-0-min.js?action=raw&amp;ctype=text/javascript"></script>
+
    <link href="https://2015.igem.org/Team:Exeter/lib/jquery.bxslider.css?action=raw&amp;ctype=text/css" rel="stylesheet">
<script src="https://2015.igem.org/Team:Exeter/jquery-migrate-1-2-1-min?action=raw&amp;ctype=text/javascript"></script>
+
  
<!-- Start of CSS-->
 
 
<style type="text/css">
 
<style type="text/css">
 +
body {background:#FFFFFF; margin: 0px; text-align:justify;}/*rgb(239,239,242)*/
 +
#content {width:100%; border:none;}
  
#content {width:100%;}
+
#bodyContent {font-family: 'Ek Mukta', Verdana, sans-serif; font-size:1em; color: #34282C;}
#bodyContent {font-family: 'Ek Mukta', Verdana, sans-serif; font-size:1.1em; color: rgb(33,33,55);}
+
 
body {background: rgb(239,239,242);}
+
h1{
h1, h2, h3, h4, h5, h6 {border-bottom:none; font-weight:bold; color: rgb(33,33,55);}
+
    border-bottom:none; 
section {text-align:justify; margin: 5px; margin-top:25px;}
+
    /*background-image: url(https://static.igem.org/mediawiki/2015/9/93/Header_background_ex.png);
#wrapper {margin:20px; width:95%;}
+
  background-repeat: no-repeat;
 +
  background-size:auto;
 +
  background-position: 0px, -200px;
 +
  background-color:#FFFFFF;*/
 +
    font-weight:bold;
 +
    color:#00a000;
 +
    font-size:2.5em;
 +
}
 +
 
 +
.headerbanner{
 +
    border-bottom:none; 
 +
    background-image: url(https://static.igem.org/mediawiki/2015/9/93/Header_background_ex.png);
 +
  background-repeat: no-repeat;
 +
  /*background-size:auto;*/
 +
  background-position: 0px, 0px;
 +
  background-color:#FFFFFF;
 +
    font-weight:bold;
 +
    color:#FFFFFF;
 +
    font-size:2.5em;
 +
}
 +
 
 +
 
 +
h2 {border-bottom:none; font-weight:bold; color: #333333; font-size:2em}/*rgb(33,33,55)*/
 +
h3, h4, h5, h6 {border-bottom:none; font-weight:bold; color: #333333; font-size:1.5em}
 +
 
 +
section {text-align:justify; /*margin: 5px; margin-top:25px;*/}
 +
#wrapper {margin:20px; width:97%;}
 
html, body {height: 100%;}
 
html, body {height: 100%;}
.carousel {height: 450px;}
+
 
.item, .active, .carousel-inner {height: 100%;}
+
/* WIKI SETTINGS*/
.fill {width: 100%; height: 100%; background-position: center; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; -o-background-size: cover;}
+
 +
/* Hide first heading */
 +
.firstHeading {
 +
display: none;
 +
}
 +
 +
/*-- Remove borders, float content left and remove padding/margin */
 +
#globalWrapper, #content{
 +
background-color: transparent;
 +
border: 0px;
 +
float: left;
 +
margin:0px;
 +
padding: 0px;
 +
}
 +
 
 +
/*left align Black Menu Bar */
 +
#top_menu_inside {  
 +
margin-left: 20px; width:100%;
 +
}
 +
 
 +
#top_menu_under {
 +
    position: relative;
 +
    width: 100%;
 +
    height: 16px;
 +
    border-bottom: none;
 +
}
 +
 
  
 
a {
 
a {
Line 45: Line 95:
 
text-decoration:none !important;
 
text-decoration:none !important;
 
}
 
}
li {
+
 
text-decoration:none !important;
+
#twitterfeed {
display:inline !important;
+
    margin-top:130px;
 
}
 
}
  
 
nav {
 
nav {
 
   border-bottom:none !important;
 
   border-bottom:none !important;
 +
  background-color:#FFFFFF;
 
}
 
}
 
/* Center the Navbar Items */
 
/* Center the Navbar Items */
Line 62: Line 113:
 
   text-align:center;
 
   text-align:center;
 
   margin-top:105px;
 
   margin-top:105px;
 +
  background-color:#FFFFFF;
 +
  top:500px;
 +
  position:relative;
 +
}
 +
.navbar-default {
 +
  border:none !important;
 +
  background-color:#FFFFFF;
 
}
 
}
 
.navbar-fixed-top {
 
.navbar-fixed-top {
   background-color:#f8f8f8;
+
   background-color:#FFFFFF;
   margin-top:25px !important;
+
   margin-top:15px !important;
   padding-bottom:30px !important;
+
   padding-bottom:32px !important;
   border-bottom:#000 thin solid;
+
   box-shadow:0px 10px 10px #888888;
 +
  border-radius:0px;
 +
  /*opacity:0.9;*/
 
}
 
}
 
/* Nav Button Style */
 
/* Nav Button Style */
 +
.btn {
 +
background-color:#FFFFFF;
 +
        border:none;
 +
        box-shadow:none !important;
 +
        z-index:0;
 +
}
 +
.btn:hover {
 +
        z-index:0 !important;
 +
}
 +
.nav-btn {
 +
padding-right:0px;
 +
        z-index:1;
 +
}
 +
.nav-btn:hover {
 +
        z-index:1 !important;
 +
}
 
.dropdown-toggle {
 
.dropdown-toggle {
 
color:#229640;
 
color:#229640;
 
font-weight:bold;
 
font-weight:bold;
 +
        height:34px;
 
}
 
}
 
.open a {
 
.open a {
 
color:#96C11E !important;
 
color:#96C11E !important;
 
text-decoration:none !important;
 
text-decoration:none !important;
background-color:#f8f8f8 !important;
+
background-color:#FFFFFF; !important;
 
}
 
}
 
/* Dropdown Style */
 
/* Dropdown Style */
.dropdown-menu{
+
.dropdown-menu {
min-width:1000px;
+
/*width:fit-content;*/
background-color:#f8f8f8;
+
background-color:#FFFFFF;
 
border:none;
 
border:none;
 
box-shadow:none;
 
box-shadow:none;
Line 89: Line 166:
 
color:#229640 !important;
 
color:#229640 !important;
 
font-weight:bold;
 
font-weight:bold;
padding:10px;
+
padding: 0px 10px 0px 10px;
 
}
 
}
 
.list-inline li a:hover {
 
.list-inline li a:hover {
 
color:#96C11E !important;
 
color:#96C11E !important;
 
text-decoration:none;
 
text-decoration:none;
 +
}
 +
.list-inline {
 +
  width: 100%;
 +
  display: table;
 +
  table-layout: auto; /* optional */
 +
}
 +
 +
.list-inline li {
 +
  padding-top:0px;
 +
  padding-bottom:0px;
 +
  display: table-cell;
 +
  width: auto;
 +
  text-align: center;
 +
  white-space: nowrap;
 
}
 
}
 
/* Navbar Header including Animation */
 
/* Navbar Header including Animation */
Line 106: Line 197:
 
   background-size:auto 80px;
 
   background-size:auto 80px;
 
   background-position:20px 5px;
 
   background-position:20px 5px;
 +
  background-color:#FFFFFF;
 
}
 
}
 
#collapse-button {
 
#collapse-button {
Line 123: Line 215:
 
right:80px;
 
right:80px;
 
}
 
}
 
+
/* Footer */
 +
footer {
 +
text-align:center;
 +
}
 
.toeholdfooter {
 
.toeholdfooter {
 
position:relative;
 
position:relative;
 
overflow:hidden;
 
overflow:hidden;
margin:50px 0px 0px 20px;
+
margin:50px 0px 0px 0px;
 
}
 
}
 
.toeholdfooter img {
 
.toeholdfooter img {
 
     height:80px;
 
     height:80px;
 
}
 
}
.sponsors img, #twitter img, #facebook img, #exeter img{
+
.sponsors img, #twitter img, #facebook img, #exeter img {
 
height:60px;
 
height:60px;
         padding:5px;
+
}
 +
.sponsors, #twitter, #facebook, #exeter {
 +
        text-decoration:none !important;
 +
display:inline-block !important;
 +
         padding:10px;
 +
}
 +
.sponsors {
 +
        /*border-bottom: 1px solid black;
 +
        border-top: 1px solid black;*/
 
}
 
}
 
#twitter, #facebook {
 
#twitter, #facebook {
Line 147: Line 250:
  
 
/* For Smaller Screens */
 
/* For Smaller Screens */
@media screen and (max-width: 768px) {
+
@media only screen and (max-width: 768px) {
 
.dropdown-menu{
 
.dropdown-menu{
min-width:auto;
+
background-color:none;
background-color:#f8f8f8;
+
 
border:none;
 
border:none;
 
box-shadow:none;
 
box-shadow:none;
 +
        margin-top:-5px !important; 
 
}
 
}
 
.navbar-header {
 
.navbar-header {
     height:100px;
+
     height:150px;
 +
}
 +
}
 +
/* For mobile */
 +
@media only screen and (max-device-width: 768px) {
 +
.igem{
 +
    display:none;
 
}
 
}
 
}
 
}
  
</style>
+
/*Carousel*/
 +
.carousel {height: 350px;}
 +
.item, .active, .carousel-inner {height: 100%;}
 +
.fill {width: 100%; height: 100%; background-position: center; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; -o-background-size: cover;}
  
<link href='http://fonts.googleapis.com/css?family=Ek+Mukta' rel='stylesheet' type='text/css'>
+
/*TEAM MEMBER PAGE STYLING*/
 +
.active {display:block;}
 +
.profile {display:none;}
 +
.profiletown {display:block; text-align:justify;}
 +
.profiletown ul {padding:0px; margin:0px;}
 +
.profiletown ul li img {margin:0px 10px 10px 0px; float:left;}
 +
.swagville {margin-top:50px; padding:0px; text-align:center;}
 +
.swagville li {display:inline-block; margin:5px; text-decoration:none; background: rgb(160,198,138); border:2px solid #229640; border-radius:5px; color:#229640; font-size:20px; font-weight:bold;}
 +
.swagville p {margin:0px; vertical-align:top;}
 +
.swagville div {padding:10px 20px 10px 20px;}
 +
.swagville div:hover {background: rgba(188,208,116, 0.5); color:#96C11E; cursor:pointer; cursor:hand;}
  
<!-- Start of CSS-->
+
/*MEDAL PAGE STYLING*/
<style type="text/css">
+
.medalcontent ul {list-style-type: none !important;}
 +
.medalcontent li {text-decoration: none;}
 +
.bronzetitle h4 {color: rgb(178,71,0);}
 +
.silvertitle h4 {color: rgb(107,107,107);}
 +
.goldtitle h4 {color: rgb(230,184,0);}
  
/* WIKI SETTINGS*/
 
 
/* Hide first heading */
 
.firstHeading {
 
display: none;
 
}
 
 
/*-- Remove borders, float content left and remove padding/margin */
 
#globalWrapper, #content{
 
background-color: transparent;
 
border: 0px;
 
float: left;
 
margin:0px;
 
padding: 0px;
 
}
 
  
/*left align Black Menu Bar */
+
/* Level 3 nav bar
#top_menu_inside {
+
-------------------------------------------------*/
margin-left: 20px; width:100%;
+
}
+
</style>
+
  
<div id="page-top" data-spy="scroll" data-target=".navbar-collapse">
+
.level_3 {
 +
  width:0%;
 +
  min-width: 140px;
 +
  cursor:pointer;
 +
  position: static;
 +
  left: 93px;
 +
  top: 21px;
 +
  height: 100%;
 +
  display: table;
 +
}
  
<!-- FACEBOOK SDK-->
+
.level_3 p {
 +
display: table-cell;
 +
  vertical-align: middle;
 +
  text-align: center;
 +
}
  
     <script>
+
#topmenu {
      window.fbAsyncInit = function() {
+
     display: block;
        FB.init({
+
    position: relative;
          appId      : 'your-app-id',
+
    top: 0px;
          xfbml      : true,
+
    left: 0px;
          version    : 'v2.3'
+
    width: 100%;
        });
+
    height: 80px;
      };
+
    background: url('https://static.igem.org/mediawiki/2013/1/1d/Top-gradient.png') #f1f1f1 repeat-x left top;
 +
    box-shadow: 0 0 5px #888;
 +
    z-index: 10;
 +
}
  
      (function(d, s, id){
+
#topmenu .selflink {font-weight: normal !important; color: #0d9c64; cursor: default; padding: 0 12px 0 8px;}
        var js, fjs = d.getElementsByTagName(s)[0];
+
#topmenu .menucenter li:hover .selflink {padding: 0 11px 0 9px}
        if (d.getElementById(id)) {return;}
+
        js = d.createElement(s); js.id = id;
+
        js.src = "//connect.facebook.net/en_US/sdk.js";
+
        fjs.parentNode.insertBefore(js, fjs);
+
      }(document, 'script', 'facebook-jssdk'));
+
    </script>
+
  
<!-- FACEBOOK thing 1 -->
+
#topmenu .menucenter{position: relative; display: block; line-height: 20px;}
  
<div id="fb-root"></div>
+
#topmenu .menuleft {position: absolute; line-height: 76px; z-index: 3;}
<script>(function(d, s, id) {
+
#topmenu .menuleft a img {position: relative; height: 60px; top: 10px;}
  var js, fjs = d.getElementsByTagName(s)[0];
+
  if (d.getElementById(id)) return;
+
  js = d.createElement(s); js.id = id;
+
  js.src = "//connect.facebook.net/en_GB/sdk.js#xfbml=1&amp;version=v2.3";
+
  fjs.parentNode.insertBefore(js, fjs);
+
}(document, 'script', 'facebook-jssdk'));</script>
+
  
     <!-- Half Page Image Background Carousel Header -->
+
#topmenu .menucenter {
     <header id="myCarousel" class="carousel slide">
+
     display:block;
         <!-- Indicators -->
+
    margin: 0 auto;
         <ol class="carousel-indicators">
+
    width:100%;
            <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
+
    text-align: center;
            <li data-target="#myCarousel" data-slide-to="1"></li>
+
    font-size: 0;}
            <li data-target="#myCarousel" data-slide-to="2"></li>
+
     #topmenu .menucenter .level_3 {
         </ol>
+
         display:inline-block;
 +
         margin: 0;
 +
        background: url('') no-repeat right top;
 +
        font-size: 16px;}
 +
    #topmenu .menucenter .level_3:first-child {
 +
        background: url('') no-repeat left top, url('') no-repeat right top;}
 +
    #topmenu .menucenter .level_3:hover {
 +
        background: url('') repeat-x top left;
 +
        border-left:1px solid #ccc;
 +
        border-right:1px solid #ccc;
 +
        margin: 0 0 0 -2px;}
 +
         #topmenu .menucenter .level_3 a {display:block; height: 79px; padding: 0 12px 0 8px;}
 +
        #topmenu .menucenter .level_3:hover a {padding: 0 11px 0 9px}
  
        <!-- Wrapper for Slides -->
+
#topmenu .menuright {position: absolute; display: block; width: 109px; height: 80px; right: 5.46878%; top: 0; z-index: 3;}
        <div class="carousel-inner">
+
   
            <div class="item active">
+
#topmenu .menuright a{display: inline-block; position: relative;}
                <!-- Set the first background image using inline CSS below. -->
+
                <div class="fill" style="background:#999;"></div>
+
                <div class="carousel-caption">
+
                    <h2>Caption 1</h2>
+
                </div>
+
            </div>
+
            <div class="item">
+
                <!-- Set the second background image using inline CSS below. -->
+
                <div class="fill" style="background:#999;"></div>
+
                <div class="carousel-caption">
+
                    <h2>Caption 2</h2>
+
                </div>
+
            </div>
+
            <div class="item">
+
                <!-- Set the third background image using inline CSS below. -->
+
                <div class="fill" style="background:#999;"></div>
+
                <div class="carousel-caption">
+
                    <h2>Caption 3</h2>
+
                </div>
+
            </div>
+
        </div>
+
  
         <!-- Controls -->
+
    #topmenu .menuright a.twitter {
         <a class="left carousel-control" href="#myCarousel" data-slide="prev">
+
         display:block;
            <span class="icon-prev"></span>
+
        float: left;
         </a>
+
        width: 36px;
         <a class="right carousel-control" href="#myCarousel" data-slide="next">
+
        height: 30px;
            <span class="icon-next"></span>
+
        margin-top: 25px;
         </a>
+
         padding: 0;
 +
        background: url('https://static.igem.org/mediawiki/2013/d/de/Twitterbtn.png') left top no-repeat;
 +
    }
 +
    #topmenu .menuright a.facebook {
 +
        display:block;
 +
        float: left;
 +
        width: 36px;
 +
        height: 34px;
 +
        margin-top: 23px;
 +
         padding: 0;
 +
         background: url('https://static.igem.org/mediawiki/2013/7/7c/Facebookbtn.png') left top no-repeat;
 +
    }
 +
    #topmenu .menuright a.mail {
 +
        display:block;
 +
        float: left;
 +
        width: 37px;
 +
        height: 29px;
 +
        margin-top: 26px;
 +
         padding: 0;
 +
        background: url('https://static.igem.org/mediawiki/2013/9/94/Mailbtn.png') left top no-repeat;
 +
    }
 +
    #topmenu .menuright a:hover {
 +
        background-position: right top;
 +
    }
  
    </header>
 
  
     <!-- Page Content -->
+
#topmenu ul, topmenu .level_3 {
     <div id="wrapper">
+
     -webkit-margin-before: 0;
   
+
    -webkit-margin-after: 0;
<nav class="navbar navbar-default">
+
     -webkit-padding-start: 0;}
  <div class="container-fluid">
+
 
     <!-- Brand and toggle get grouped for better mobile display -->
+
 
 +
/*ScrollUp*/
 +
#bodycontent {
 +
    padding-top: 100px;
 +
}
 +
 
 +
.navbar-fixed-top {
 +
    height: 100px;
 +
    position: fixed;
 +
    top: 0px;
 +
    transition: top 0.2s ease-in-out;
 +
}
 +
 
 +
.nav-up {
 +
top:-100px;
 +
}
 +
</style>
 +
 
 +
<script>
 +
$(document).ready(function() {
 +
 
 +
  $(window).scroll(function () {
 +
      //if you hard code, then use console
 +
      //.log to determine when you want the
 +
      //nav bar to stick. 
 +
      console.log($(window).scrollTop())
 +
    if ($(window).scrollTop() > 182) {
 +
      $('.navbar-collapse').addClass('navbar-fixed-top');
 +
     }
 +
    if ($(window).scrollTop() < 183) {
 +
      $('.navbar-collapse').removeClass('navbar-fixed-top');
 +
    }
 +
  });
 +
});
 +
</script>
 +
 
 +
<div id="wrapper">
 
     <div class="navbar-header">
 
     <div class="navbar-header">
 
       <button id="collapse-button" type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
 
       <button id="collapse-button" type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
Line 285: Line 446:
 
     <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
 
     <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
 
       <ul class="span12 offset1 nav navbar-nav">
 
       <ul class="span12 offset1 nav navbar-nav">
         <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="https://2015.igem.org/Team:Exeter/Description">PROJECT</a>
+
         <li class="dropdown btn-group">
 +
        <button type="button" class="btn nav-btn"><a href="https://2015.igem.org/Team:Exeter/Description">PROJECT</a></button>
 +
  <button type="button" class="btn dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 +
    <span class="caret"></span>
 +
    <span class="sr-only">Toggle Dropdown</span>
 +
  </button>
 
         <ul class="dropdown-menu">
 
         <ul class="dropdown-menu">
 
               <ul class='list-inline'>
 
               <ul class='list-inline'>
 
             <li><a href="https://2015.igem.org/Team:Exeter/Design">Design</a></li>
 
             <li><a href="https://2015.igem.org/Team:Exeter/Design">Design</a></li>
<li><a href="https://2015.igem.org/Team:Exeter/Toehold_Background">Toehold Background</a></li>
+
<li><a href="https://2015.igem.org/Team:Exeter/RNA_Riboswitches">Toehold Background</a></li>
 
<li><a href="https://2015.igem.org/Team:Exeter/Toehold_Design">Toehold Design</a></li>
 
<li><a href="https://2015.igem.org/Team:Exeter/Toehold_Design">Toehold Design</a></li>
 
                 <li><a href="https://2015.igem.org/Team:Exeter/diary">General Diary</a></li>
 
                 <li><a href="https://2015.igem.org/Team:Exeter/diary">General Diary</a></li>
Line 296: Line 462:
 
         </ul>
 
         </ul>
 
     </li>
 
     </li>
    <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="https://2015.igem.org/Team:Exeter/Lab">LAB</a>
+
        <li class="dropdown btn-group">
 +
        <button type="button" class="btn nav-btn"><a href="https://2015.igem.org/Team:Exeter/Lab">LAB</a></button>
 +
  <button type="button" class="btn dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 +
    <span class="caret"></span>
 +
    <span class="sr-only">Toggle Dropdown</span>
 +
  </button>
 
         <ul class="dropdown-menu">
 
         <ul class="dropdown-menu">
 
               <ul class='list-inline'>
 
               <ul class='list-inline'>
Line 306: Line 477:
 
         </ul>
 
         </ul>
 
     </li>
 
     </li>
         <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="https://2015.igem.org/Team:Exeter/Modeling">MODELLING</a>
+
         <li class="dropdown btn-group">
 +
        <button type="button" class="btn nav-btn"><a href="https://2015.igem.org/Team:Exeter/Modeling">MODELLING</a></button>
 +
  <button type="button" class="btn dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 +
    <span class="caret"></span>
 +
    <span class="sr-only">Toggle Dropdown</span>
 +
  </button>
 
             <ul class="dropdown-menu">
 
             <ul class="dropdown-menu">
 
               <ul class='list-inline'>
 
               <ul class='list-inline'>
Line 313: Line 489:
 
             </ul>
 
             </ul>
 
         </li>
 
         </li>
         <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="https://2015.igem.org/Team:Exeter/Practices">BEYOND THE BENCH</a>
+
         <li class="dropdown btn-group">
 +
        <button type="button" class="btn nav-btn"><a href="https://2015.igem.org/Team:Exeter/Practices">BEYOND THE BENCH</a></button>
 +
  <button type="button" class="btn dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 +
    <span class="caret"></span>
 +
    <span class="sr-only">Toggle Dropdown</span>
 +
  </button>
 
         <ul class="dropdown-menu">
 
         <ul class="dropdown-menu">
 
               <ul class='list-inline'>
 
               <ul class='list-inline'>
Line 323: Line 504:
 
         </ul>
 
         </ul>
 
     </li>
 
     </li>
    <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="https://2015.igem.org/Team:Exeter/Team">PARTICIPANTS</a>
+
        <li class="dropdown btn-group">
 +
        <button type="button" class="btn nav-btn"><a href="https://2015.igem.org/Team:Exeter/Team">PARTICIPANTS</a></button>
 +
  <button type="button" class="btn dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 +
    <span class="caret"></span>
 +
    <span class="sr-only">Toggle Dropdown</span>
 +
  </button>
 
         <ul class="dropdown-menu">
 
         <ul class="dropdown-menu">
 
               <ul class='list-inline'>
 
               <ul class='list-inline'>
Line 333: Line 519:
 
       </ul>
 
       </ul>
 
  </li>
 
  </li>
    <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="https://2015.igem.org/Team:Exeter/Parts">PARTS</a>
+
        <li class="dropdown btn-group">
 +
        <button type="button" class="btn nav-btn" style="padding-right:10px;"><a href="https://2015.igem.org/Team:Exeter/Parts">PARTS</a></button>
 
     </li>
 
     </li>
    <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="https://2015.igem.org/Team:Exeter/Medal_Requirements">MEDALS</a>
+
        <li class="dropdown btn-group">
 +
        <button type="button" class="btn nav-btn"><a href="https://2015.igem.org/Team:Exeter/Medal_Requirements">MEDALS</a></button>
 +
  <button type="button" class="btn dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 +
    <span class="caret"></span>
 +
    <span class="sr-only">Toggle Dropdown</span>
 +
  </button>
 
       <ul class="dropdown-menu">
 
       <ul class="dropdown-menu">
 
               <ul class='list-inline'>
 
               <ul class='list-inline'>
Line 345: Line 537:
 
     </li>
 
     </li>
 
       </ul><!-- /.navbar-nav -->
 
       </ul><!-- /.navbar-nav -->
     </div><!-- /.navbar-collapse -->
+
     </div><!-- /.navbar-collapse -->      
  </div><!-- /.container-fluid -->
+
</nav>
+
  
 
+
                 <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
            <div class="row">
+
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
                 <div class="col-md-8">
+
    <!--[if lt IE 9]>
<section>
+
        <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
                    <h1> Welcome to Exeter iGEM 2015! </h1>
+
        <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
</br>
+
    <![endif]-->  
<h1> Project Description </h1>
+
 
+
<!-- jQuery Scripts -->
<p> The primary aim of our project is to design a toehold switch (a type of riboregulator) with the potential to detect any given RNA sequence, and to standardise it into a BioBrick for the future use by other iGEM teams. </p>
+
<script src="https://2015.igem.org/Team:Exeter/jquery-1-11-0-min.js?action=raw&amp;ctype=text/javascript"></script>
<p> Tuberculosis in cattle is a problem local to our region, Devon, causing devastating economic and personal losses to farmers in the dairy and beef industries. Therefore, the immediate application of our project is the detection of <i>Mycobacterium bovis</i>, the causative agent of tuberculosis in cattle, in a safe, low-tech and cost-effective manner. </p>
+
<script src="https://2015.igem.org/Team:Exeter/jquery-migrate-1-2-1-min?action=raw&amp;ctype=text/javascript"></script>
<p> In order to make this a simple test which can be used in the field, we are aiming to express it as a cell-free system. We hope to use a chromoprotein as an indicator, and subsequently characterise it for use in cell-free systems. </p>
+
 
+
<p style="font-size:1.2em;">Keep updated on our progress on our <a href="https://2015.igem.org/Team:Exeter/diary">diary</a></p>
+
<p style="font-size:1.2em;">Contact us at <a href="mailto:exeterigem@gmail.com?body=Hello Exeter,">exeterigem@gmail.com</a></p>
+
</section>
+
                </div>
+
                <!-- /.col-md-8 -->
+
               
+
               
+
               
+
                <div class="col-md-4">
+
                    <section class="panel panel-default">
+
                    <!-- TWITTER thing-->
+
<a class="twitter-timeline" href="https://twitter.com/ExeteriGEM2015" width="500px" height="355px" data-widget-id="616553862611271680">Tweets by @ExeteriGEM2015 </a> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
+
                    </section>
+
                    <!-- /.panel -->
+
                    <div class="panel panel-default">
+
                    <!-- FACEBOOK thing 2 -->
+
<div class="fb-page" data-href="https://www.facebook.com/exeterigem2015?fref=ts" style="margin-left:15px;" data-width="300" data-height="300" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true" data-show-posts="true"><div class="fb-xfbml-parse-ignore"><blockquote cite="https://www.facebook.com/exeterigem2015?fref=ts"><a href="https://www.facebook.com/exeterigem2015?fref=ts">Exeter iGEM 2015</a></blockquote></div></div>
+
                    </div>
+
                    <!-- /.panel -->
+
                    <center>
+
                    <a href="#wrapper" class="btn btn-default">TOP ^</a>
+
                    </center>
+
                </div>
+
                <!-- /.col-md-4 -->
+
            </div>
+
            <!-- /.row -->
+
 
+
<footer>
+
  <div class="container-fluid">
+
     
+
      <div class="row toeholdfooter">
+
      <img src="https://static.igem.org/mediawiki/2015/b/b2/Exeter_switch.png">
+
      </div>
+
 
+
      <div class="row">
+
        <ul>
+
          <li id="twitter"><a href="https://twitter.com/exeterigem2015" target="_blank"><img src="https://static.igem.org/mediawiki/2015/7/76/Exe_twitter_logo.png"/></a></li>
+
          <li id="facebook"><a href="https://www.facebook.com/exeterigem2015?fref=ts" target="_blank"><img src="https://static.igem.org/mediawiki/2015/1/17/Exe_fb_logo.png"/></a></li>
+
          <li id="exeter"><a href="http://www.exeter.ac.uk/"><img src="https://static.igem.org/mediawiki/2015/c/cb/Exeter_uni_logo.png"/></a></li>
+
        </ul>
+
      </div>
+
 
+
      <div class="list-inline row">
+
      <ul>
+
          <li class="sponsors"><a href="http://www.bioline.com/" target="_blank"><img src="https://static.igem.org/mediawiki/2015/7/79/BBK_Team_2015_Bioline_Logo.png"/></a></li>
+
          <li class="sponsors"><a href="http://www.bmglabtech.com/" target="_blank"><img src="https://static.igem.org/mediawiki/2015/4/4d/BMG_Labtech_logo.png"/></a></li>
+
          <li class="sponsors"><a href="https://www.idtdna.com/site" target="_blank"><img src="https://static.igem.org/mediawiki/2015/e/e0/IDT-Logo-2014-sm.png"/></a></li>
+
          <li class="sponsors"><a href="https://www.eppendorf.com/UK-en/" target="_blank"><img src="https://static.igem.org/mediawiki/2015/b/b8/Exeter_LogoEppendorf.png"/></a></li>
+
          <li class="sponsors"><a href="https://www.neb.com/" target="_blank"><img src="https://static.igem.org/mediawiki/2015/a/ac/NEB_logo.jpeg"/></a></li>
+
          <li class="sponsors"><a href="http://www.shieldscientific.com/public/shieldskin-gloves/" target="_blank"><img src="https://static.igem.org/mediawiki/2015/2/2a/Sheild_skin_logo.png"/></a></li>
+
        </ul>
+
      </div>
+
     
+
  </div> <!-- /.container-fluid -->
+
</footer>
+
 
+
</div>
+
<!-- /#wrapper -->
+
  
 
     <!-- jQuery -->
 
     <!-- jQuery -->
Line 434: Line 564:
 
      
 
      
 
<script>
 
<script>
 
+
       
 
var main = function() {
 
var main = function() {
+
 
var mouseX = 0, limitX = 1000;
+
var width = $(window).width();
 +
var mouseX = 0, limitX = width-350;
 
$(window).mousemove(function(e){
 
$(window).mousemove(function(e){
 
// don't follow mouse while collapsed
 
// don't follow mouse while collapsed
 
if ($(window).width() > 768) {
 
if ($(window).width() > 768) {
   var offset = $('.toehold').offset();
+
   var offset = $('.navbar-header').offset();
 
   mouseX = Math.min(e.pageX - offset.left, limitX);
 
   mouseX = Math.min(e.pageX - offset.left, limitX);
 
   if (mouseX < 0) mouseX = 0;
 
   if (mouseX < 0) mouseX = 0;
Line 447: Line 578:
 
}
 
}
 
// but it will still return to original position when resized
 
// but it will still return to original position when resized
   if (e.pageY > 200) mouseX = 0;
+
   if (e.pageY > 220) mouseX = 0;
 
});
 
});
  
Line 458: Line 589:
 
if (xp < 100) follower.css({left:100});
 
if (xp < 100) follower.css({left:100});
 
     else follower.css({left:xp});
 
     else follower.css({left:xp});
   
+
 
 
}, 30);
 
}, 30);
  
 
};
 
};
 +
   
 
$(document).ready(main);
 
$(document).ready(main);
  
Line 467: Line 599:
  
 
<script>
 
<script>
$(document).ready(function() {
+
var main = function() {
 
+
   $("#Bra").click(function() {
   $(window).scroll(function () {
+
$(".active").addClass("profile");
      //if you hard code, then use console
+
$(".active").removeClass("active");
      //.log to determine when you want the
+
     $("#Brad").addClass("active");
      //nav bar to stick. 
+
$("#Brad").removeClass("profile");
      console.log($(window).scrollTop())
+
    if ($(window).scrollTop() > 600) {
+
      $('.navbar-collapse').addClass('navbar-fixed-top');
+
     }
+
    if ($(window).scrollTop() < 601) {
+
      $('.navbar-collapse').removeClass('navbar-fixed-top');
+
    }
+
 
   });
 
   });
});
+
  $("#Tod").click(function() {
 +
$(".active").addClass("profile");
 +
$(".active").removeClass("active");
 +
    $("#Todd").addClass("active");
 +
$("#Todd").removeClass("profile");
 +
  });
 +
  $("#Rac").click(function() {
 +
$(".active").addClass("profile");
 +
$(".active").removeClass("active");
 +
    $("#Rach").addClass("active");
 +
$("#Rach").removeClass("profile");
 +
  });
 +
  $("#Yem").click(function() {
 +
$(".active").addClass("profile");
 +
$(".active").removeClass("active");
 +
    $("#Yemi").addClass("active");
 +
$("#Yemi").removeClass("profile");
 +
  });
 +
  $("#Dan").click(function() {
 +
$(".active").addClass("profile");
 +
$(".active").removeClass("active");
 +
    $("#Dani").addClass("active");
 +
$("#Dani").removeClass("profile");
 +
  });
 +
  $("#Dav").click(function() {
 +
$(".active").addClass("profile");
 +
$(".active").removeClass("active");
 +
    $("#Davi").addClass("active");
 +
$("#Davi").removeClass("profile");
 +
  });
 +
  $("#Amy").click(function() {
 +
$(".active").addClass("profile");
 +
$(".active").removeClass("active");
 +
    $("#Amy_").addClass("active");
 +
$("#Amy_").removeClass("profile");
 +
  });
 +
  $("#Jos").click(function() {
 +
$(".active").addClass("profile");
 +
$(".active").removeClass("active");
 +
    $("#Jose").addClass("active");
 +
$("#Jose").removeClass("profile");
 +
  });
 +
  $("#Geo").click(function() {
 +
$(".active").addClass("profile");
 +
$(".active").removeClass("active");
 +
    $("#Geor").addClass("active");
 +
$("#Geor").removeClass("profile");
 +
  });
 +
  $("#Emi").click(function() {
 +
$(".active").addClass("profile");
 +
$(".active").removeClass("active");
 +
    $("#Emil").addClass("active");
 +
$("#Emil").removeClass("profile");
 +
  });
 +
  $("#Jas").click(function() {
 +
$(".active").addClass("profile");
 +
$(".active").removeClass("active");
 +
    $("#Jasm").addClass("active");
 +
$("#Jasm").removeClass("profile");
 +
  });
 +
  $("#Team").click(function() {
 +
$(".active").addClass("profile");
 +
$(".active").removeClass("active");
 +
    $("#Home").addClass("active");
 +
$("#Home").removeClass("profile");
 +
  });
 +
};
 +
 
 +
$(document).ready(main);
 
</script>
 
</script>
  
 +
<link href='http://fonts.googleapis.com/css?family=Ek+Mukta' rel='stylesheet' type='text/css'>
 +
 +
<!-- FACEBOOK SDK-->
 +
 +
    <script>
 +
      window.fbAsyncInit = function() {
 +
        FB.init({
 +
          appId      : 'your-app-id',
 +
          xfbml      : true,
 +
          version    : 'v2.3'
 +
        });
 +
      };
 +
 +
      (function(d, s, id){
 +
        var js, fjs = d.getElementsByTagName(s)[0];
 +
        if (d.getElementById(id)) {return;}
 +
        js = d.createElement(s); js.id = id;
 +
        js.src = "//connect.facebook.net/en_US/sdk.js";
 +
        fjs.parentNode.insertBefore(js, fjs);
 +
      }(document, 'script', 'facebook-jssdk'));
 +
    </script>
 +
 +
<!-- FACEBOOK thing 1 -->
 +
 +
<div id="fb-root"></div>
 +
<script>(function(d, s, id) {
 +
  var js, fjs = d.getElementsByTagName(s)[0];
 +
  if (d.getElementById(id)) return;
 +
  js = d.createElement(s); js.id = id;
 +
  js.src = "//connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v2.3";
 +
  fjs.parentNode.insertBefore(js, fjs);
 +
}(document, 'script', 'facebook-jssdk'));</script>
 +
 +
<div class="container">
 +
 +
<div class="row">
 +
                <div class="col-md-8">
 +
<section>
 +
                    <h1> Welcome to Exeter iGEM 2015! </h1>
 +
 +
 +
<div id="carouselcontainer" class="panel panel-default">
 +
<!-- Half Page Image Background Carousel Header -->
 +
<header id="myCarousel" class="carousel slide">
 +
    <!-- Indicators -->
 +
    <ol class="carousel-indicators">
 +
        <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
 +
        <li data-target="#myCarousel" data-slide-to="1"></li>
 +
        <li data-target="#myCarousel" data-slide-to="2"></li>
 +
        <li data-target="#myCarousel" data-slide-to="3"></li>
 +
        <li data-target="#myCarousel" data-slide-to="4"></li>
 +
    </ol>
 +
 +
    <!-- Wrapper for Slides -->
 +
    <div class="carousel-inner">
 +
        <div class="item active">
 +
            <!-- Set the first background image using inline CSS below. -->
 +
            <a href="https://2015.igem.org/Team:Exeter/Team">
 +
            <img class="fill" src="https://static.igem.org/mediawiki/2015/2/21/Team_carousel_ex.JPG"/>
 +
            <div class="carousel-caption">
 +
                <h2 style="color:#FFFFFF;"></h2>
 +
            </div>
 +
            </a>
 +
        </div>
 +
        <div class="item">
 +
            <!-- Set the second background image using inline CSS below. -->
 +
            <a href="https://2015.igem.org/Team:Exeter/Practices">
 +
            <img class="fill" src="https://static.igem.org/mediawiki/2015/9/95/Exeter_Joe_carousel_1.png"/>
 +
            <div class="carousel-caption">
 +
                <h2 style="color:#FFFFFF;"></h2>
 +
            </div>
 +
            </a>
 +
        </div>
 +
        <div class="item">
 +
            <!-- Set the third background image using inline CSS below. -->
 +
            <a href="https://2015.igem.org/Team:Exeter/Modeling">
 +
            <img class="fill" src="https://static.igem.org/mediawiki/2015/3/3b/Model_carousel_ex.gif"/>
 +
            <div class="carousel-caption">
 +
                <h2></h2>
 +
            </div>
 +
            </a>
 +
        </div>
 +
      <div class="item">
 +
            <!-- Set the third background image using inline CSS below. -->
 +
            <a href="https://2015.igem.org/Team:Exeter/Experiments">
 +
            <img class="fill" src="https://static.igem.org/mediawiki/2015/2/21/Exeter_lab_carousel.png"/>
 +
            <div class="carousel-caption">
 +
                <h2></h2>
 +
            </div>
 +
            </a>
 +
        </div>
 +
    <div class="item">
 +
            <!-- Set the third background image using inline CSS below. -->
 +
            <a href="https://2015.igem.org/Team:Exeter/Timeline">
 +
            <img class="fill" src="https://static.igem.org/mediawiki/2015/1/1b/Exeter_ribonostics_logo.png"/>
 +
            <div class="carousel-caption">
 +
                <h2 style="color:#FFFFFF;"></h2>
 +
            </div>
 +
            </a>
 +
        </div>
 +
    </div>
 +
 +
    <!-- Controls -->
 +
    <a class="left carousel-control" href="#myCarousel" data-slide="prev">
 +
        <span class="icon-prev"></span>
 +
    </a>
 +
    <a class="right carousel-control" href="#myCarousel" data-slide="next">
 +
        <span class="icon-next"></span>
 +
    </a>
 +
 +
</header> <!-- End of  carousel-->
 +
</div>
 +
<h2> Project Description </h2>
 +
 +
<p> The primary aim of our project is to design a toehold switch (a type of riboregulator) with the potential to detect any given RNA sequence, and to standardise it into a BioBrick for the future use by other iGEM teams. </p>
 +
<p> Tuberculosis in cattle is a problem local to our region, Devon, causing devastating economic and personal losses to farmers in the dairy and beef industries. Therefore, the immediate application of our project is the detection of <i>Mycobacterium bovis</i>, the causative agent of tuberculosis in cattle, in a safe, low-tech and cost-effective manner. </p>
 +
<p> In order to make this a simple test which can be used in the field, we are aiming to express it as a cell-free system. We hope to use a chromoprotein as an indicator, and subsequently characterise it for use in cell-free systems. </p>
 +
 +
<p style="font-size:1.2em;">Keep updated on our progress on our <a href="https://2015.igem.org/Team:Exeter/diary">diary</a></p>
 +
<p style="font-size:1.2em;">Contact us at <a href="mailto:exeterigem@gmail.com?body=Hello Exeter,">exeterigem@gmail.com</a></p>
 +
</section>
 +
                </div>
 +
                <!-- /.col-md-8 -->
 +
               
 +
               
 +
               
 +
                <div class="col-md-4">
 +
                    <section class="panel panel-default" id="twitterfeed">
 +
                    <!-- TWITTER thing-->
 +
<a class="twitter-timeline" href="https://twitter.com/ExeteriGEM2015" width="500px" height="355px" data-widget-id="616553862611271680">Tweets by @ExeteriGEM2015 </a> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
 +
                    </section>
 +
                    <!-- /.panel -->
 +
                    <div class="panel panel-default">
 +
                    <!-- FACEBOOK thing 2 -->
 +
<div class="fb-page" data-href="https://www.facebook.com/exeterigem2015?fref=ts" data-width="500" data-height="355" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true" data-show-posts="true"><div class="fb-xfbml-parse-ignore"><blockquote cite="https://www.facebook.com/exeterigem2015?fref=ts"><a href="https://www.facebook.com/exeterigem2015?fref=ts">Exeter iGEM 2015</a></blockquote></div></div>
 +
                    </div>
 +
                    <!-- /.panel -->
 +
                    <center>
 +
                    <a href="#wrapper" class="btn btn-default">TOP ^</a>
 +
                    </center>
 +
                </div>
 +
                <!-- /.col-md-4 -->
 +
            </div>
 +
            <!-- /.row -->
 
</div>
 
</div>
<!--body-->
 
 
</html>
 
</html>

Latest revision as of 12:59, 28 August 2015

Welcome to Exeter iGEM 2015!

Project Description

The primary aim of our project is to design a toehold switch (a type of riboregulator) with the potential to detect any given RNA sequence, and to standardise it into a BioBrick for the future use by other iGEM teams.

Tuberculosis in cattle is a problem local to our region, Devon, causing devastating economic and personal losses to farmers in the dairy and beef industries. Therefore, the immediate application of our project is the detection of Mycobacterium bovis, the causative agent of tuberculosis in cattle, in a safe, low-tech and cost-effective manner.

In order to make this a simple test which can be used in the field, we are aiming to express it as a cell-free system. We hope to use a chromoprotein as an indicator, and subsequently characterise it for use in cell-free systems.

Keep updated on our progress on our diary

Contact us at exeterigem@gmail.com

TOP ^