Difference between revisions of "Team:Dalhousie"

 
(35 intermediate revisions by 3 users not shown)
Line 1: Line 1:
−
<html lang="en">
+
<html>
−
 
+
 
<head>
 
<head>
 +
<style>
 +
#bg-video {
 +
        position: fixed;
 +
        top: 0;
 +
        right: 0;
 +
        bottom: 0px;
 +
        left: 0;
 +
        overflow: hidden;
 +
        z-index: -100;
 +
        width:100%;
 +
        height:100%;
  
−
+
}
  
−
<!--just added all this shit-->
 
  
−
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
+
</style>
−
<script>
+
−
$(document).ready(function(){
+
−
  // Add smooth scrolling to all links
+
−
  $("a").on('click', function(event) {
+
  
−
    // Make sure this.hash has a value before overriding default behavior
+
<!--glyphicons-->
−
    if (this.hash !== "") {
+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
−
      // Prevent default anchor click behavior
+
  <link  rel="stylesheet" href="https://2017.igem.org/Team:Dalhousie/libraries/css/Bootstrap?action=raw&ctype=text/css" />
−
      event.preventDefault();
+
  <link rel="stylesheet" href="https://2017.igem.org/Team:Dalhousie/libraries/css/fonts?action=raw&ctype=text/css" />
 +
<link rel="stylesheet" href="https://2017.igem.org/Team:Dalhousie/css3?action=raw&ctype=text/css" />
  
−
      // Store hash
+
<!--------------------oldnavbar--------------->
−
      var hash = this.hash;
+
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  
−
      // Using jQuery's animate() method to add smooth page scroll
 
−
      // The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
 
−
      $('html, body').animate({
 
−
        scrollTop: $(hash).offset().top
 
−
      }, 800, function(){
 
−
 
 
−
        // Add hash (#) to URL when done scrolling (default click behavior)
 
−
        window.location.hash = hash;
 
−
      });
 
−
    } // End if
 
−
  });
 
−
});
 
−
</script>
 
−
<style>
 
−
body, html, .main {
 
−
    height: 100%;
 
−
}
 
  
−
section {
+
<!-------------------------------------need this--------------------------->
−
    min-height: 100%;
+
<style>
 +
#home_logo, #sideMenu { display:none; }
 +
#sideMenu, #top_title, .patrollink  {display:none;}
 +
#content { width:100%; padding:0px;  margin-top:-20px; margin-left:0px; background-color: black;}
 +
body {background-color:white; height:100%; }
 +
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px;  background-color: transparent; z-index:100;}
 +
        .jumbotron {
 +
            height: 850px;
 +
            position: relative;
 +
         
 +
            }
 +
.navbar-default .navbar-nav>.active>a, .nav > li > a:hover, .nav > li > a:focus {
 +
  background-color: #C1D35D;
 +
  text-decoration: none;
 
}
 
}
 +
</style>
  
 +
</head>
  
 +
<body>
  
  
 +
<!-------------------navbar---------------------->
 +
<div id="nav" class="noBackground" style="width:100%; z-index:100;" >
 +
            <div class="inner" >
 +
<div id="navWrap">
 +
    <nav >
 +
<div class="container-fluid">
 +
    <ul class="nav navbar-nav navbar-center">
  
 +
      <li class="active" ><a href="https://2017.igem.org/Team:Dalhousie" style=" color: white;">Home</a></li>
  
−
#home_logo, #sideMenu { display:none; }
+
<li class="dropdown" >
−
#sideMenu, #top_title, .patrollink  {display:none;}
+
        <a class="dropdown-toggle" data-toggle="dropdown" href="#" style=" color: white;">Project
−
#content { width:100%; padding:0px; margin-top:-42px; margin-left:0px;}</style>
+
        </a>
 +
        <ul class="dropdown-menu" style=" background-color: rgba(193,211,93,0.8);">
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Description" >Description</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Design">Design</a></li>
 +
<li><a href="https://2017.igem.org/Team:Dalhousie/Requirements">Requirements</a></li>
 +
        </ul>
 +
      </li>
  
 +
<li class="dropdown">
 +
        <a class="dropdown-toggle" data-toggle="dropdown" href="#" style=" color: white;">Results
 +
        </a>
 +
        <ul class="dropdown-menu" style=" background-color: rgba(193,211,93,0.8);">
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/InterLab">Interlab</a></li>
 +
  <li><a href="https://2017.igem.org/Team:Dalhousie/Results">Results</a></li>
 +
        </ul>
 +
</li>   
  
 +
 
 +
<li class="dropdown">
 +
        <a class="dropdown-toggle" data-toggle="dropdown" href="#" style=" color: white;">Team
 +
        </a>
 +
        <ul class="dropdown-menu" style=" background-color: rgba(193,211,93,0.8);">
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Team">Team</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Collaborations">Collaborations</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Attributions">Attributions</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Sponsors">Sponsors</a></li>
 +
        </ul>
 +
</li>
  
−
    <meta charset="utf-8">
+
<li class="dropdown">
−
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+
        <a class="dropdown-toggle" data-toggle="dropdown" href="#" style=" color: white;">Human Practices
−
    <meta name="viewport" content="width=device-width, initial-scale=1">
+
        </a>
−
    <meta name="description" content="">
+
        <ul class="dropdown-menu" style=" background-color: rgba(193,211,93,0.8);">
−
    <meta name="author" content="">
+
      <li><a href="https://2017.igem.org/Team:Dalhousie/Human_Practices">Summary</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/HP/Silver">Science Communication</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/HP/Gold_Integrated">Integrated and Gold</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Engagement">Public Engagement</a></li>
 +
<li><a href="https://2017.igem.org/Team:Dalhousie/SocialMedia">Social Media</a></li>
 +
     
 +
        </ul>
 +
      </li>
  
−
    <title>Dalhousie iGem</title>
+
<li class="dropdown">
 +
        <a class="dropdown-toggle" data-toggle="dropdown" href="#" style=" color: white;">Lab
 +
        </a>
 +
        <ul class="dropdown-menu" style=" background-color: rgba(193,211,93,0.8);">
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Parts">Parts</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Safety" >Safety</a></li>
 +
            <li><a href="https://2017.igem.org/Team:Dalhousie/Experiments">Experiments</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Notebook">Notebook</a></li>
 +
<li><a href="https://2017.igem.org/Team:Dalhousie/Improve">Improve</a></li>
 +
        </ul>
 +
      </li>
  
−
    <!-- Bootstrap Core CSS -->
+
     
−
  <link href="https://2017.igem.org/wiki/index.php?title=Team:Dalhousie/bootstrapmincss&action=raw&ctype=text/css" rel="stylesheet">
+
  
−
<!-- Custom Fonts -->
 
−
<link href="https://2017.igem.org/wiki/index.php?title=Team:Dalhousie/fontawesome?action=raw&ctype=text/css" rel="stylesheet" type="text/css">
 
−
    <link href="https://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic" rel="stylesheet" type="text/css">
 
−
    <link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css">
 
−
    <link href="https://2017.igem.org/Team:Dalhousie/libraries/css/fonts?action=raw&ctype=text/css" rel="stylesheet" type="text/css">
 
  
  
−
<!-- Theme CSS -->
+
    </ul>
−
<link href="https://2017.igem.org/wiki/index.php?title=Team:Dalhousie/grayscale&action=raw&ctype=text/css" rel="stylesheet">
+
  
−
   
 
  
−
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
 
−
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
 
−
    <!--[if lt IE 9]>
 
−
        <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>
 
−
    <![endif]-->
 
  
−
</head>
+
<!--------------------------contact us------------------------------------------>
 +
<ul class="nav navbar-nav navbar-right">
 +
    <div class="navbar-header">
 +
      <a class="navbar-brand" style=" color: white;">Contact us today </a>
 +
    </div>
 +
<li>
 +
                        <a href="mailto:igemdalhousie@gmail.com" ><i class="fa fa-envelope-o fa-fw" style=" color: white;"  ></i> <span class="network-name"></span></a>
 +
                    </li>
 +
<li>
 +
                        <a target="_blank" href="https://twitter.com/dalhousie_igem?lang=en" ><i class="fa fa-twitter fa-fw" style=" color: white;" ></i> <span class="network-name"></span></a>
 +
                    </li>
 +
                    <li>
 +
                        <a target="_blank" href="https://www.facebook.com/Dalhousie.iGEM/" ><i class="fa fa-facebook fa-fw" style=" color: white;" ></i> <span class="network-name"></span></a>
 +
                    </li>
  
−
<body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">
+
     </ul>
−
 
+
  </div>
−
     <!-- Navigation -->
+
</nav>
−
    <nav class="navbar navbar-custom navbar-fixed-top" role="navigation">
+
</div>
−
        <div class="container">
+
−
            <div class="navbar-header">
+
−
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-main-collapse">
+
−
                    Menu <i class="fa fa-bars"></i>
+
−
                </button>
+
−
               
+
 
             </div>
 
             </div>
 +
        </div>
  
−
            <!-- Collect the nav links, forms, and other content for toggling -->
 
−
            <div class="collapse navbar-collapse navbar-right navbar-main-collapse">
 
−
                <ul class="nav navbar-nav">
 
−
                    <!-- Hidden li included to remove active class from about link when scrolled up past about section -->
 
−
                    <li class="hidden">
 
−
                        <a href="#page-top"></a>
 
−
                    </li>
 
  
  
 +
        <div class="panel" id="panel1" >
  
 +
            <div class="inner" >
 +
<div class="top" ><div class="title" >Dalhousie iGEM 2017</div></div>
  
 +
 
  
−
                    <li>
+
<video  id= "myVideo" class="bg-video" style="top:0px; left:0px; padding-bottom:0px; position:fixed; width:100%;z-index:-100; " autoplay="true" loop="loop" preload="metadata" muted="muted">
−
                        <a class="page-scroll" href="#about">The Project</a>
+
        <source src="https://static.igem.org/mediawiki/2017/6/68/Thisfinal.mp4" type="video/mp4" />
−
                    </li>
+
−
                   
+
−
                    <li>
+
−
                        <a class="page-scroll" href="#contact">Contact</a>
+
−
                    </li>
+
−
                </ul>
+
−
            </div>
+
−
            <!-- /.navbar-collapse -->
+
−
        </div>
+
−
        <!-- /.container -->
+
−
    </nav>
+
  
−
    <!-- Intro Header -->
 
−
    <header class="intro">
 
−
        <div class="intro-body">
 
−
            <div class="container">
 
−
                <div class="row">
 
−
                    <div class="col-md-8 col-md-offset-2">
 
−
                        <h1 class="brand-heading">Dalhousie iGEM</h1>
 
−
                     
 
−
                        <a href="#about" class="btn btn-circle page-scroll">
 
  
−
                            <span class="caret"></span>
 
−
                        </a>
 
−
                    </div>
 
−
                </div>
 
−
            </div>
 
−
        </div>
 
−
    </header>
 
  
−
    <!-- About Section -->
+
<!--------------------------------fade title---------------------------->
−
    <section id="about" class="container content-section text-center">
+
<style>
−
        <div class="row">
+
 
−
            <div class="col-lg-4 col-md-offset-2">
+
body {
−
                <h2>The Project</h2>
+
  margin: 0;
−
  <h4>Background</h4>   
+
  height: 10px;
−
       
+
}
−
<p style="text-align:center">
+
 
 +
.top {
 +
 
 +
  margin-top: 350px;
 +
  position: absolute;
 +
width:65%;
 +
  left:250px;
 +
  background-color: transparent;
 +
  height: 150px;
 +
  text-align: center;
 +
  font-family: 'Trebuchet MS';
 +
  font-size: 80px;
 +
  font-weight: 400;
 +
  color: white;
 +
line-height: 60px;
 +
}
 +
 
 +
.title {
 +
  position: relative;
 +
  top: 10%;
 +
 
 +
  left: 0px;
 +
}
 +
 
 +
</style>
 +
 
 +
 
 +
<!---------------------------------------------------------------------------------this------------------------------------------------------------------------------------------->
 +
<script> $(window).scroll(function(){
 +
    $(".top").css("opacity", 1 - $(window).scrollTop() / 300);
 +
  });
 +
</script>
  
−
Canada’s forests represent not only an established source of economic revenue, but also a potential source for biofuel substrate. Ligno-cellulosic by-products from pulp and paper processing are removed using chemicals, heat, and water. Microbial cellulose-degrading enzymes are high-value targets for industrial applications. Focused on innovative applications of synthetic biology, the undergraduate Dalhousie iGEM team has undertaken a multi-year project to harness the degradative capacity of microorganisms to convert cellulose into ethanol for biofuel applications. Advances in DNA sequencing technology and bioinformatics have revolutionized our ability to identify useful genes in complex biological samples. We hypothesize that the porcupine microbiome, which includes microorganisms capable of digesting bark and tree resin, will be a rich source of these useful genes. If our hypothesis is correct, mining the porcupine microbiome has the advantage of finding a suite of enzymes that have evolved to work in concert to efficiently degrade cellulose. </p>
 
−
 
−
<h4>The Project</h4>
 
−
<p style="text-align:center">
 
−
Using a combination of metagenomic library construction and bioinformatic analysis we aim to find known cellulolytic enzymes as well as discover novel enzymes.
 
−
Screening of our metagenomic library will allow us to look for a diverse selection of enzymes, including cellulolytic and lignolytic ones by plating on cellulose-only media. The clones that grow can be sequenced for confirmation and cloned into biobricks.
 
−
Our new bioinformatic pipeline now allows us to look for conserved domains rather than known enzymes. This is extremely powerful as it may allow us to discover new enzymes that share catalytic domains with cellulases but are otherwise totally novel.
 
−
The goal of this project is to construct a bioreactor where cellulose would be the input, D-glucose the output and E.coli expressing a suite of cellulolytic enzymes would be the workhorse, converting one to the other. Future goals would be to combine this in co-culture with yeast for the last step in bio-ethanol production.</p>
 
  
−
<h4>Human Practices </h4>
 
−
<p style="text-align:center">
 
−
As we progress through our project collaborating with industry, community and academia, we have noticed just how important science communication is. Selling our story has been important for getting funding, initiating community support and presenting to groups at Dalhousie University who aren’t versed in synthetic biology. As we reflected on how important science communication is, we broadened our scope to Halifax’s recent measles outbreaks and saw just how much pain science miscommunication can cause.
 
−
Our goal this year is to better understand the scope of scientific literacy within the general public through a survey asking ten short questions on how people read scientific media ( interested? Here’s the link). This information will allow us to draw some conclusions about people's reading and sharing habits online. This can then be used to interview science communicators, media outlets, scientists and members of the general public to get more fleshed out opinions on how science communication can improve, and how miscommunication can be spotted in the media. From this, we would like to create a webpage describing how to maneuver science communication and scientific media in the mainstream, with specific tips on how to spot fake articles. Our overarching goal is to discover ways science communication can progress to make science more accessible, and in the meantime create a document to help guide people through the maze of real science news and fake science news.
 
−
</p>
 
−
               
 
−
               
 
 
             </div>
 
             </div>
 +
        </div>
 +
 +
 +
 +
 +
        <div class="panel" id="panel2">
 +
<h1>
 +
<center><font color= "#ffffff">Mining the Microbiome</font></center>
 +
</h1>
 +
<center><img src="https://static.igem.org/mediawiki/parts/3/34/BIG_FRont_DESIGN.png" height="617" width="1097" style="margin-bottom:40px;"></center> 
 
         </div>
 
         </div>
−
    </section>
 
  
−
 
 
  
−
  <!-- Contact Section -->
+
 
−
    <section id="contact" class="content-section text-center">
+
<div class="container" style="height:450px; width:100%; position: relative;">
−
        <div class="download-section">
+
 
−
            <div class="container">
+
</div>
−
                <div class="col-lg-8 col-lg-offset-2">
+
 
−
                    <h2>Contact us</h2>
+
 
−
                    <p style="text-align:center">Feel free to contact us to collab, or to just say hello!</p>
+
        <div class="panel panel-red" id="panel3">
−
               
+
<p style="text-align: center; ">
−
                <ul class="list-inline banner-social-buttons">
+
<a href="http://www.plosibilities.wordpress.com"><img src="https://static.igem.org/mediawiki/2017/archive/8/8c/20171031235427%21Dalscreen.png" height="20%" width="20%" ></a>
−
                   
+
<img src="https://static.igem.org/mediawiki/parts/d/d7/Porcupinelogo2017.png" height="20%" width="20%" >
−
<li>
+
<img src="https://static.igem.org/mediawiki/2017/e/ef/Whitetigerlogo.png" height="20%" width="20%" >
−
                        <a href="mailto:igemdalhousie@gmail.com" class="btn btn-default btn-lg"><i class="fa fa-google-plus fa-fw"></i> <span class="network-name">Email+</span></a>
+
</p>
−
                    </li>
+
           
−
<li>
+
−
                        <a href="https://twitter.com/dalhousie_igem?lang=en" class="btn btn-default btn-lg"><i class="fa fa-twitter fa-fw"></i> <span class="network-name">Twitter</span></a>
+
−
                    </li>
+
−
                    <li>
+
−
                        <a href="https://www.facebook.com/Dalhousie.iGEM/" class="btn btn-default btn-lg"><i class="fa fa-github fa-fw"></i> <span class="network-name">Facebook</span></a>
+
−
                    </li>
+
−
                   
+
−
                    </li>
+
−
                </ul>
+
−
                </div>
+
−
          </div>
+
 
         </div>
 
         </div>
−
    </section>
 
  
  
 +
<style>
 +
html {
 +
height: 100%;
 +
min-height: 100%;
 +
}
  
 +
body {
 +
height: 100%;
 +
}
  
−
    <!-- jQuery -->
+
.panel {
−
    <script src="https://2017.igem.org/wiki/index.php?title=Team:Dalhousie/jquery&action=raw&ctype=script/js"></script>
+
width: 100%;
 +
height: 100%;
 +
background: black;
 +
color: #fff;
 +
padding-left: 5%;
 +
padding-right: 5%;
 +
text-align: center;
 +
}
  
−
    <!-- Bootstrap Core JavaScript -->
 
−
    <script src="https://2017.igem.org/wiki/index.php?title=Team:Dalhousie/bootstrapminjs&action=raw&ctype=script/js"></script>
 
  
−
    <!-- Plugin JavaScript -->
 
−
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
 
  
−
   
 
  
−
    <!-- Theme JavaScript -->
 
−
    <script src="https://2017.igem.org/wiki/index.php?title=Team:Dalhousie/grayscaleminjs&action=raw&ctype=script/js"></script>
 
  
−
</body>
+
.panel.panel-red {
 +
background: black;
  
−
</html>
+
}
 +
#nav {
 +
position: fixed;
 +
top: 0;
 +
left: 0;
 +
width: 96%;
 +
padding: 2%;
 +
z-index: 100;
 +
color: white;
 +
height: 80px;
 +
}
 +
 
 +
.noBackground {
 +
background-color: rgba(0,0,0,0);
 +
visibility: visible;
 +
width:100%;
 +
padding-right:0px;
 +
    -webkit-transition: all 1.0s ease;
 +
    -moz-transition: all 1.0s ease;
 +
    -o-transition: all 1.0s ease;
 +
    transition: all 1.0s ease;
 +
}
 +
 
 +
.blackBackground {
 +
background-color: rgba(35,47,19,0.7);
 +
visibility: visible;
 +
width:100%;
 +
 
 +
}
 +
 
 +
#nav .inner {
 +
z-index:100;
 +
padding-bottom:40px;
 +
color: red;
 +
}
 +
 
 +
#nav ul {
 +
list-style: none;
 +
margin: 0;
 +
padding: 0;
 +
}
 +
 
 +
 
 +
 
 +
#inner{
 +
z-index:101;
 +
 
 +
}
 +
 
 +
#panel1{
 +
background: transparent;
 +
height: 950px;
 +
width:100%;
 +
z-index:100;
 +
}
 +
#panel2{
 +
width:100%;
 +
height: 600px;
 +
margin-bottom:0px;
 +
background:  white;
 +
color: white;
 +
font-size: 40px;
 +
line-height: 40px;
 +
background-image: url("https://static.igem.org/mediawiki/2017/a/a5/Woodbackground.jpeg");
 +
height: 200%;
 +
}
 +
#panel3{
 +
width:100%;
 +
height: 100%;
 +
margin-bottom:-100px;
 +
background: rgba(35,47,19,0.9);
 +
}
 +
 
 +
 
 +
 
 +
 
 +
</style>
 +
<script>
 +
$( function() {
 +
//caches a jQuery object containing the header element
 +
var header = $('.noBackground');
 +
$(window).scroll(function() {
 +
var scroll = $(window).scrollTop();
 +
 
 +
if (scroll >= 100) {
 +
header.addClass('blackBackground');
 +
} else {
 +
header.removeClass('blackBackground');
 +
                     
 +
}
 +
});
 +
});
 +
</script>
 +
 
 +
</body>
 +
<html>

Latest revision as of 00:13, 1 November 2017

Dalhousie iGEM 2017

Mining the Microbiome