Difference between revisions of "Team:UMaryland/Model"

Line 11: Line 11:
 
     <script src="https://static.igem.org/mediawiki/2016/c/ce/T--UMaryland--parallax.txt"></script>
 
     <script src="https://static.igem.org/mediawiki/2016/c/ce/T--UMaryland--parallax.txt"></script>
 
     <script src="https://static.igem.org/mediawiki/2016/d/d3/T--UMaryland--slick.txt" type="text/javascript"></script>
 
     <script src="https://static.igem.org/mediawiki/2016/d/d3/T--UMaryland--slick.txt" type="text/javascript"></script>
−
     <title>Modeling</title>
+
     <title>Human Practices</title>
 
</head>
 
</head>
  
Line 357: Line 357:
 
<style>
 
<style>
 
.caption {
 
.caption {
 +
font-size: 12pt;
 
font-weight: bold;
 
font-weight: bold;
 
margin-left: 25px;
 
margin-left: 25px;
 
}
 
}
−
+
 +
#div-figures{
 +
padding-bottom: 100px;
 +
font-size: 14pt;
 +
}
 +
 
.titleText {
 
.titleText {
−
margin-left: auto;
+
position: absolute;
−
margin-right: auto;
+
top: 350px;
 +
left: 50%;
 +
margin-left: -40%;
 +
right: auto;
 
width: 80%;
 
width: 80%;
 
min-width: 1000px;
 
min-width: 1000px;
 
max-width: 1500px;
 
max-width: 1500px;
 
}
 
}
−
#div-figures{
+
−
padding-bottom: 100px;
+
h11, h21, h31 {
−
font-size: 14pt;
+
font-family: Lora;
 +
display: inline-block;
 +
position: relative;
 +
padding-bottom: 10px;
 +
padding-left: 10px;
 +
padding-top: 10px;
 +
padding-right: 10px;
 +
background: rgba(0,0,0, 0.7);
 +
line-height: 1em;
 
}
 
}
−
         h11 {
+
 +
         h11 {
 
             color: white;
 
             color: white;
 
             font-size: 30pt;
 
             font-size: 30pt;
 
             font-weight: 400;
 
             font-weight: 400;
 
             text-align: left;
 
             text-align: left;
−
            display: block;
 
−
margin-top: 60px;
 
−
padding-top: 180px;
 
−
            margin-bottom: 0.83em;
 
 
         }
 
         }
  
Line 388: Line 402:
 
             font-weight: 300;
 
             font-weight: 300;
 
             text-align: left;
 
             text-align: left;
−
            display: block;
 
−
            margin-top: 0.83em;
 
−
            margin-bottom:: 0.83em;
 
 
         }
 
         }
  
 
         h31 {
 
         h31 {
 
             color: white;
 
             color: white;
−
             font-size: 18pt;
+
             font-size: 20pt;
 
             font-weight: 200;
 
             font-weight: 200;
 
             text-align: left;
 
             text-align: left;
−
            display: block;
 
−
            margin-top: 0.83em;
 
−
            margin-bottom:: 0.83em;
 
 
         }
 
         }
  
 
         #div-text {
 
         #div-text {
 
padding-top: 50px;
 
padding-top: 50px;
−
background-color: #f9f9f9;
+
padding-bottom: 150px;
 
         }
 
         }
  
−
         #div-pic {
+
         .div-scrollPic {
 
             z-index: -999;
 
             z-index: -999;
 
             height: 500px;
 
             height: 500px;
Line 414: Line 422:
 
         }
 
         }
  
 +
.scrollContainer {
 +
 +
position: relative;
 +
width: 100%;
 +
}
 +
 
         .imageEmbed {
 
         .imageEmbed {
 
             /* creates border around image on each page */
 
             /* creates border around image on each page */
Line 423: Line 437:
 
         }
 
         }
  
−
         #div-text p, .longText li {
+
.longText li {
 +
 +
            font-size: 14pt;
 +
            line-height: 2;
 +
            font-weight: 400;
 +
}
 +
 +
         #div-text p {
 
             /* formats text and lists within .longText */
 
             /* formats text and lists within .longText */
 +
padding-top: 15px;
 +
padding-bottom: 15px;
 
             font-size: 14pt;
 
             font-size: 14pt;
 
             line-height: 2;
 
             line-height: 2;
Line 455: Line 478:
 
         }
 
         }
  
−
        .figure {
 
−
            /* fixes the width of images in results tables */
 
−
            width: 800px;
 
−
display: block;
 
−
            border-style: solid;
 
−
            border-color: #A8A8A8;
 
−
            border-width: 2px;
 
−
margin-top: 50px;
 
−
margin-bottom: 20px;
 
−
margin-left: auto;
 
−
margin-right: auto;
 
−
        }
 
  
 
         /* formats caption and heading of results tables */
 
         /* formats caption and heading of results tables */
Line 496: Line 507:
 
             margin-top: 50px;
 
             margin-top: 50px;
 
         }
 
         }
 +
 +
#div-slideshow {
 +
margin-top: 40px;
 +
margin-bottom: 40px;
 +
margin-left: auto;
 +
margin-right: auto;
 +
width: 800px;
 +
}
 +
 +
#div-slideshow img {
 +
width: 750px;
 +
margin-top: 15px;
 +
margin-bottom: 15px;
 +
margin-left: auto;
 +
margin-right: auto;
 +
border: 2px solid #A8A8A8;
 +
}
 +
 +
#div-dots {
 +
            height: 100px;
 +
        }
 +
 +
#div-dots {
 +
            height: 100px;
 +
        }
 +
 
         </style>
 
         </style>
 
<nav>
 
<nav>
−
<img src="https://static.igem.org/mediawiki/2016/2/26/T--UMaryland--newlogo.jpeg" id="img-logo" width="128px">
+
<a href="https://2016.igem.org/Team:UMaryland"><img src="https://static.igem.org/mediawiki/2016/2/26/T--UMaryland--newlogo.jpeg" id="img-logo" width="128px"></a>
 
<ul>
 
<ul>
 
<a style="opacity: 0">Fix</a>
 
<a style="opacity: 0">Fix</a>
Line 522: Line 559:
 
</ul>
 
</ul>
 
</div>
 
</div>
−
<div data-parallax="scroll" data-image-src="https://static.igem.org/mediawiki/2016/a/a8/T--UMaryland--smmo.jpg" id="div-pic">
+
<div class="scrollContainer">
−
<div class="titleText">  
+
<div data-parallax="scroll" data-image-src="https://static.igem.org/mediawiki/2016/5/5a/T--UMaryland--il.jpg" class="div-scrollPic" style="height: 650px;">
−
<!-- where background image below titles show -->
+
<div class="titleText">  
−
<h11>Modeling</h11>
+
<style>
−
<h21>Predicting Data and Optimizing Results</h21>
+
</style>
−
<h31>Applying engineering principals to biological systems</h31>
+
<!-- where background image below titles show -->
−
</div>
+
<h11>Modeling</h11></br>
−
        </div>
+
<h21>Predicting Data and Optimizing Results</h21></br>
−
<div id="div-text"> <!-- Start of main text of page -->
+
<h31>Applying engineering principals to biological systems</h31></br>
 +
</div>
 +
</div>
 +
</div>
 
<!-- Heading text -->
 
<!-- Heading text -->
 
 
−
+
<div id="div-text">
 
<div class="longText">
 
<div class="longText">
 
<p>Modeling is crucial to designing biological systems such as ours, where we want both predictability and optimization of our organism. We used the SimBiology package in MatLab in order to model our multiple metabolic pathways using data gathered experimentally and from literature. We then optimized the parameters to determine what the optimal growth conditions of our organisms will be in order to most efficiently biosequester methane.</p>
 
<p>Modeling is crucial to designing biological systems such as ours, where we want both predictability and optimization of our organism. We used the SimBiology package in MatLab in order to model our multiple metabolic pathways using data gathered experimentally and from literature. We then optimized the parameters to determine what the optimal growth conditions of our organisms will be in order to most efficiently biosequester methane.</p>
Line 547: Line 587:
 
</div>
 
</div>
 
<div class="longText" id="div-protocol">
 
<div class="longText" id="div-protocol">
−
<h4>Protocol</h4>
+
<h4>Parameters</h4>
 
</div>
 
</div>
 
<div class="longText">
 
<div class="longText">
Line 580: Line 620:
 
 
 
<script>
 
<script>
 +
 +
        $('#div-slideshow').slick({
 +
dots: true
 +
        });
 +
 
$(window).resize(function() {
 
$(window).resize(function() {
−
var marginTotal = $('.titleText').outerWidth(true) - $('.titleText').outerWidth(false);
+
var marginTotal = $(window).outerWidth(true) - $('.titleText').outerWidth(false);
 
var marginLeft = marginTotal / 2;
 
var marginLeft = marginTotal / 2;
 
if (marginLeft > 14) {
 
if (marginLeft > 14) {
Line 589: Line 634:
 
}
 
}
 
 
−
var marginTitle = $('.titleText').outerWidth(true) - $('.titleText').outerWidth(false);
+
var marginTitle = $(window).outerWidth(true) - $('.titleText').outerWidth(false);
 
var marginCheck = marginTitle / 2;
 
var marginCheck = marginTitle / 2;
 
if (marginCheck < 15) {
 
if (marginCheck < 15) {
−
$('.titleText').css('margin-left','15px');
+
$('.titleText').css('left','15px');
 +
$('.titleText').css('margin-left','0px');
 
} else {
 
} else {
−
$('.titleText').css('margin-left','auto');
+
$('.titleText').css('left','50%');
 +
$('.titleText').css('margin-left','-40%');
 
}
 
}
 
})
 
})
 
 
 
$(window).load(function() {
 
$(window).load(function() {
−
var marginTotal = $('.titleText').outerWidth(true) - $('.titleText').outerWidth(false);
+
var marginTotal = $(window).outerWidth(true) - $('.titleText').outerWidth(false);
 
var marginLeft = marginTotal / 2;
 
var marginLeft = marginTotal / 2;
 
if (marginLeft > 14) {
 
if (marginLeft > 14) {
Line 607: Line 654:
 
}
 
}
 
 
−
var marginTitle = $('.titleText').outerWidth(true) - $('.titleText').outerWidth(false);
+
var marginTitle = $(window).outerWidth(true) - $('.titleText').outerWidth(false);
 
var marginCheck = marginTitle / 2;
 
var marginCheck = marginTitle / 2;
 
if (marginCheck < 15) {
 
if (marginCheck < 15) {
−
$('.titleText').css('margin-left','15px');
+
$('.titleText').css('left','15px');
 +
$('.titleText').css('margin-left','0px');
 
} else {
 
} else {
−
$('.titleText').css('margin-left','auto');
+
$('.titleText').css('left','50%');
 +
$('.titleText').css('margin-left','-40%');
 
}
 
}
 
})
 
})
Line 619: Line 668:
 
       <script>
 
       <script>
 
/* Hiding stupid stuff*/
 
/* Hiding stupid stuff*/
−
    $('#top_title').css('display', 'none');
+
        $('#top_title').css('display', 'none');
 
$('#top_menu').css('display', 'none');
 
$('#top_menu').css('display', 'none');
−
  $('#HQ_page').css('display', 'none');
+
        $('#HQ_page').css('display', 'none');
 
$('#top_menu_under').css('display', 'none');
 
$('#top_menu_under').css('display', 'none');
 
$('#content').removeClass('mw-body')
 
$('#content').removeClass('mw-body')
Line 642: Line 691:
 
var scroll = $(window).scrollTop();
 
var scroll = $(window).scrollTop();
 
if (scroll > 0) {if ( $(window).width() >= 1090) { var pushed = $('body').hasClass('pushed'); if (pushed == false) {
 
if (scroll > 0) {if ( $(window).width() >= 1090) { var pushed = $('body').hasClass('pushed'); if (pushed == false) {
−
$('#img-logo').css('transition', '.25s ease')
 
−
    .css('opacity', '0');
 
 
$('nav ul').removeClass("hover");
 
$('nav ul').removeClass("hover");
 
$('nav').css('transition', '.5s ease');
 
$('nav').css('transition', '.5s ease');
 +
    $('#img-logo').css('transition', '.25s ease')
 +
        .css('opacity', '0');
 
}}}
 
}}}
  
Line 682: Line 731:
 
$('nav img').toggleClass('pushed');
 
$('nav img').toggleClass('pushed');
 
$('body').toggleClass('pushed');
 
$('body').toggleClass('pushed');
−
if ($(window).width() >= 980) { var pushed = $('body').hasClass('pushed'); if (pushed == false){
+
if ($(window).width() >= 1090) { var pushed = $('body').hasClass('pushed'); if (pushed == false){
 
$('nav li').css('display', 'inline');
 
$('nav li').css('display', 'inline');
 
$('#img-more').css('display','none');
 
$('#img-more').css('display','none');
Line 704: Line 753:
 
});
 
});
 
</script>
 
</script>
−
         <script> $('#iGEM').css('display','block'); </script>
+
         <script> $('#iGEM').css('display','block');
 +
 +
$('body').css('display', 'block');</script>
 
<script>
 
<script>
 
$(document).ready(function(){
 
$(document).ready(function(){
−
  $('#div-figures').slick({
+
   
−
  });
+
−
  $('body').css('display', 'block')
+
 
});
 
});
 
 
Line 721: Line 771:
 
});
 
});
 
 
−
var element_position = $('#div-protocol').offset().top;
 
 
var toggle = 1;
 
var toggle = 1;
  
 +
 +
 
</script>
 
</script>
 
</html>
 
</html>

Revision as of 01:46, 10 October 2016

</div> </div> Human Practices

Modeling
Predicting Data and Optimizing Results
Applying engineering principals to biological systems

Modeling is crucial to designing biological systems such as ours, where we want both predictability and optimization of our organism. We used the SimBiology package in MatLab in order to model our multiple metabolic pathways using data gathered experimentally and from literature. We then optimized the parameters to determine what the optimal growth conditions of our organisms will be in order to most efficiently biosequester methane.

Pathways

Three different constructs were synthesized by UMaryland iGEM in hopes of being co-cultured. They were:

  • sMMO Construct: oxidizing methane into methanol using oxygen
  • Formate Construct: further oxidizing methanol into carbon dioxide using NADH
  • Fructose Construct: further oxidizing methanol into cellular metabolites

Parameters

Results