Team:Valencia Biocampus
From 2013.igem.org
(Difference between revisions)
(60 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
- | < | + | <html> |
+ | <script type="text/javascript">var activeSection = "home";</script> | ||
- | |||
- | |||
+ | <link rel="stylesheet" type="text/css" href="https://2013.igem.org/wiki/index.php?title=Template:Team:Valencia_Biocampus/Templates/css/main&action=raw&ctype=text/css" /> | ||
+ | <link rel="stylesheet" type="text/css" href="https://2013.igem.org/wiki/index.php?title=Template:Team:Valencia_Biocampus/Templates/css/bootstrap&action=raw&ctype=text/css" /> | ||
- | < | + | <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script> |
- | == | + | <script type="text/javascript" src="https://2013.igem.org/wiki/index.php?title=Template:Team:Valencia_Biocampus/Templates/js/bootstrap&action=raw&ctype=text/javascript"></script> |
- | + | <style type="text/css"> | |
+ | #toggleWikiMenu{ | ||
+ | margin-left:470px; | ||
+ | } | ||
+ | #top_menu li{ | ||
+ | margin-right:3px; | ||
+ | font-size:14px; | ||
+ | } | ||
+ | #top_menu li a{ | ||
+ | padding:5px 9px; | ||
+ | } | ||
+ | #menu_a_home img{ | ||
+ | height:30px; | ||
+ | vertical-align: middle; | ||
+ | } | ||
+ | #top_menu{ | ||
+ | padding:0; | ||
+ | } | ||
+ | #carousel-vlc_biocampus-generic{ | ||
+ | height:490px; | ||
+ | } | ||
+ | .carousel-indicators li{ | ||
+ | cursor:pointer; | ||
+ | } | ||
+ | .carousel-inner .item{ | ||
+ | background:rgba(44, 83, 130, 0.9); | ||
+ | height:490px; | ||
+ | box-shadow:inset 0px 0px 150px rgb(44, 83, 130); | ||
+ | text-align: center; | ||
+ | } | ||
+ | .carousel-caption{ | ||
+ | background: transparent; | ||
+ | width:520px; | ||
+ | left:45%; | ||
+ | bottom:auto; | ||
+ | top:40px; | ||
+ | font-size: 16px; | ||
+ | text-align: center; | ||
+ | color: #ccc; | ||
+ | /*border-radius:5px; | ||
+ | border:1px solid rgba(255,255,255, 0.8);*/ | ||
+ | } | ||
+ | .carousel-caption h3{ | ||
+ | font-family: 'Bevan'; | ||
+ | color: #fff; | ||
+ | font-size:25px; | ||
+ | font-weight: normal; | ||
+ | text-transform: uppercase; | ||
+ | padding:0; | ||
+ | } | ||
+ | a.btn-green { | ||
+ | color: #ffffff; | ||
+ | background-color: rgb(170, 200, 10); | ||
+ | border-color: rgb(170, 200, 10); | ||
+ | } | ||
+ | a.btn-green:hover, | ||
+ | a.btn-green:focus, | ||
+ | a.btn-green:active, | ||
+ | a.btn-green.active { | ||
+ | color: #fff; | ||
+ | background-color: rgb(191, 221, 10); | ||
+ | border-color: rgb(191, 221, 10); | ||
+ | |||
+ | } | ||
+ | a.btn-large{ | ||
+ | padding: 10px 16px; | ||
+ | font-size: 18px; | ||
+ | line-height: 1.33; | ||
+ | border-radius: 6px; | ||
+ | } | ||
+ | .popover{ | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | z-index: 1010; | ||
+ | display: none; | ||
+ | max-width: 460px; | ||
+ | padding: 1px; | ||
+ | text-align: left; | ||
+ | white-space: normal; | ||
+ | background-color: #ffffff; | ||
+ | border: 1px solid #cccccc; | ||
+ | border: 1px solid rgba(0, 0, 0, 0.2); | ||
+ | border-radius: 6px; | ||
+ | -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); | ||
+ | box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); | ||
+ | background-clip: padding-box; | ||
+ | } | ||
+ | .popover.right { | ||
+ | margin-left: 10px; | ||
+ | } | ||
+ | .popover-title { | ||
+ | padding: 8px 14px; | ||
+ | margin: 0; | ||
+ | font-size: 14px; | ||
+ | font-weight: normal; | ||
+ | line-height: 16px; | ||
+ | background-color: rgba(33, 76, 111, 0.9);; | ||
+ | border-bottom: 1px solid #ebebeb; | ||
+ | border-radius: 5px 5px 0 0; | ||
+ | font-family: 'Bevan'; | ||
+ | text-transform: uppercase; | ||
+ | color:#fff; | ||
+ | |||
+ | } | ||
+ | |||
+ | .popover-content { | ||
+ | padding: 4px 8px; | ||
+ | } | ||
+ | |||
+ | .popover .arrow, | ||
+ | .popover .arrow:after { | ||
+ | position: absolute; | ||
+ | display: block; | ||
+ | width: 0; | ||
+ | height: 0; | ||
+ | border-color: transparent; | ||
+ | border-style: solid; | ||
+ | } | ||
+ | |||
+ | .popover .arrow { | ||
+ | border-width: 11px; | ||
+ | } | ||
+ | |||
+ | .popover .arrow:after { | ||
+ | border-width: 10px; | ||
+ | content: ""; | ||
+ | } | ||
+ | |||
+ | .popover.top .arrow { | ||
+ | bottom: -11px; | ||
+ | left: 50%; | ||
+ | margin-left: -11px; | ||
+ | border-top-color: #999; | ||
+ | border-top-color: rgba(0, 0, 0, 0.25); | ||
+ | border-bottom-width: 0; | ||
+ | } | ||
+ | |||
+ | .popover.top .arrow:after { | ||
+ | bottom: 1px; | ||
+ | margin-left: -10px; | ||
+ | border-top-color: #ffffff; | ||
+ | border-bottom-width: 0; | ||
+ | } | ||
+ | |||
+ | .popover.right .arrow { | ||
+ | top: 50%; | ||
+ | left: -11px; | ||
+ | margin-top: -11px; | ||
+ | border-right-color: #999; | ||
+ | border-right-color: rgba(0, 0, 0, 0.25); | ||
+ | border-left-width: 0; | ||
+ | } | ||
+ | |||
+ | .popover.right .arrow:after { | ||
+ | bottom: -10px; | ||
+ | left: 1px; | ||
+ | border-right-color: #ffffff; | ||
+ | border-left-width: 0; | ||
+ | } | ||
+ | |||
+ | .popover.bottom .arrow { | ||
+ | top: -11px; | ||
+ | left: 50%; | ||
+ | margin-left: -11px; | ||
+ | border-bottom-color: #999; | ||
+ | border-bottom-color: rgba(0, 0, 0, 0.25); | ||
+ | border-top-width: 0; | ||
+ | } | ||
+ | |||
+ | .popover.bottom .arrow:after { | ||
+ | top: 1px; | ||
+ | margin-left: -10px; | ||
+ | border-bottom-color: #ffffff; | ||
+ | border-top-width: 0; | ||
+ | } | ||
+ | |||
+ | .popover.left .arrow { | ||
+ | top: 50%; | ||
+ | right: -11px; | ||
+ | margin-top: -11px; | ||
+ | border-left-color: #999; | ||
+ | border-left-color: rgba(0, 0, 0, 0.25); | ||
+ | border-right-width: 0; | ||
+ | } | ||
+ | |||
+ | .popover.left .arrow:after { | ||
+ | right: 1px; | ||
+ | bottom: -10px; | ||
+ | border-left-color: #ffffff; | ||
+ | border-right-width: 0; | ||
+ | } | ||
+ | #home-presentation img{ | ||
+ | width:100%; | ||
+ | } | ||
+ | #home-presentation h4{ | ||
+ | font-family: 'Bevan'; | ||
+ | font-size: 15px; | ||
+ | color: rgb(33, 76, 111); | ||
+ | font-weight: normal; | ||
+ | padding:2px; | ||
+ | background-color: #e7e7e7; | ||
+ | border-bottom: 1px solid #ebebeb; | ||
+ | border-radius: 5px 5px 0 0; | ||
+ | } | ||
+ | #home-pseudomonas-info{ | ||
+ | width:140px; | ||
+ | position:absolute; | ||
+ | top:90px; | ||
+ | left:0; | ||
+ | } | ||
+ | #home-pseudomonas-info-title{ | ||
+ | background:#bfd05d; | ||
+ | border-radius: 5px; | ||
+ | padding:5px 8px; | ||
+ | color: #fff; | ||
+ | font-family: 'Bevan'; | ||
+ | font-size:13px; | ||
+ | font-weight: normal; | ||
+ | text-align: center; | ||
+ | } | ||
+ | #home-pseudomonas-info-descr{ | ||
+ | border-radius: 10px; | ||
+ | border:1px solid #bfd05d; | ||
+ | color:#bfd05d; | ||
+ | background:#fff; | ||
+ | font-size:12px; | ||
+ | padding:8px; | ||
+ | margin-top:1px; | ||
+ | height:40px; | ||
+ | } | ||
+ | #home-pseudomonas-img{ | ||
+ | width:40px; | ||
+ | position:absolute; | ||
+ | top:120px; | ||
+ | left:55px; | ||
+ | } | ||
+ | #home-elegans-info{ | ||
+ | width:140px; | ||
+ | position:absolute; | ||
+ | top:305px; | ||
+ | left:0; | ||
+ | } | ||
+ | #home-elegans-info-title{ | ||
+ | background:#9bcbd9; | ||
+ | border-radius: 5px; | ||
+ | padding:5px 8px; | ||
+ | color: #fff; | ||
+ | font-family: 'Bevan'; | ||
+ | font-size:13px; | ||
+ | font-weight: normal; | ||
+ | text-align: center; | ||
+ | } | ||
+ | #home-elegans-info-descr{ | ||
+ | border-radius: 10px; | ||
+ | border:1px solid #9bcbd9; | ||
+ | color:#bfd05d; | ||
+ | background:#fff; | ||
+ | font-size:12px; | ||
+ | padding:8px; | ||
+ | margin-top:1px; | ||
+ | height:40px; | ||
+ | } | ||
+ | #home-elegans-img{ | ||
+ | width:120px; | ||
+ | position:absolute; | ||
+ | top:240px; | ||
+ | left:10px; | ||
+ | } | ||
+ | .home-icon{ | ||
+ | width:100px; | ||
+ | position:absolute; | ||
+ | top:0; | ||
+ | left:0; | ||
+ | cursor:pointer; | ||
+ | border: 0; | ||
+ | text-align:center; | ||
+ | } | ||
+ | #home-the_riding-icon{ | ||
+ | top:180px; | ||
+ | left:180px; | ||
+ | } | ||
+ | #home-the_calling-icon{ | ||
+ | position:absolute; | ||
+ | top:10px; | ||
+ | left:240px; | ||
+ | display: none; | ||
+ | } | ||
+ | #home-the_clumping-icon{ | ||
+ | position:absolute; | ||
+ | top:70px; | ||
+ | left:210px; | ||
+ | display: none; | ||
+ | } | ||
+ | #home-the_building-icon{ | ||
+ | position:absolute; | ||
+ | top:140px; | ||
+ | left:240px; | ||
+ | display: none; | ||
+ | } | ||
+ | #home-the_riding-icon img, #home-the_calling-icon img, #home-the_clumping-icon img, #home-the_building-icon img{ | ||
+ | box-shadow: 0 0 20px #fff; | ||
+ | border-radius:50px; | ||
+ | width:75px; | ||
+ | } | ||
+ | #home-the_riding-block{ | ||
+ | width:220px; | ||
+ | position: absolute; | ||
+ | top:170px; | ||
+ | left:300px; | ||
+ | } | ||
+ | #home-the_riding-description, #home-the_calling-description,#home-the_clumping-description,#home-the_building-description{ | ||
+ | font-size:12px; | ||
+ | color: #969696; | ||
+ | font-weight: bold; | ||
+ | text-align: center; | ||
+ | display: none; | ||
+ | } | ||
+ | #home-presentation p{ | ||
+ | background:#fff; | ||
+ | padding:5px; | ||
+ | border-radius: 0 0 5px 5px; | ||
+ | } | ||
+ | #home-the_riding-img{ | ||
+ | width: 150px; | ||
+ | margin:0 auto; | ||
+ | clear:both; | ||
+ | position:absolute; | ||
+ | top:110px; | ||
+ | left:50px; | ||
+ | display:none; | ||
+ | } | ||
+ | #home-the_calling-block{ | ||
+ | display:block; | ||
+ | position: absolute; | ||
+ | top:110px; | ||
+ | left:480px; | ||
+ | width:200px; | ||
+ | } | ||
+ | #home-the_calling-description{ | ||
+ | width:200px; | ||
+ | } | ||
+ | #home-ecoli-info{ | ||
+ | display: none; | ||
+ | } | ||
+ | #home-ecoli-info-title{ | ||
+ | background:#f0d700; | ||
+ | border-radius: 5px; | ||
+ | padding:5px 8px; | ||
+ | color: #fff; | ||
+ | font-family: 'Bevan'; | ||
+ | font-size:13px; | ||
+ | font-weight: normal; | ||
+ | text-align: center; | ||
+ | width:120px; | ||
+ | position: absolute; | ||
+ | top:225px; | ||
+ | left:25px; | ||
+ | } | ||
+ | #home-ecoli-img{ | ||
+ | width:84px; | ||
+ | position:absolute; | ||
+ | top:130px; | ||
+ | left:45px; | ||
+ | display:none; | ||
+ | } | ||
+ | #home-the_clumping-block{ | ||
+ | display:block; | ||
+ | position: absolute; | ||
+ | top:40px; | ||
+ | left:580px; | ||
+ | width:240px; | ||
+ | } | ||
+ | #home-the_clumping-img{ | ||
+ | width:100px; | ||
+ | position: absolute; | ||
+ | left:120px; | ||
+ | top:125px; | ||
+ | display: none; | ||
+ | } | ||
+ | #home-the_building-block{ | ||
+ | display:block; | ||
+ | position: absolute; | ||
+ | top:270px; | ||
+ | left:700px; | ||
+ | width:200px; | ||
+ | } | ||
+ | #home-the_building-description-img{ | ||
+ | display:none; | ||
+ | position: absolute; | ||
+ | top:130px; | ||
+ | left:0px; | ||
+ | } | ||
+ | #home-the_building-description{ | ||
+ | margin-top:10px; | ||
+ | display:none; | ||
+ | } | ||
+ | /* | ||
+ | #home-the_building-description, #home-the_building-description-img{ | ||
+ | display:block; | ||
+ | }*/ | ||
+ | #home-presentation-title{ | ||
+ | font-size:30px; | ||
+ | position:absolute; | ||
+ | display:block; | ||
+ | top:17px; | ||
+ | left:0px; | ||
+ | width:600px; | ||
+ | font-family: 'Bevan'; | ||
+ | color:#fff; | ||
+ | font-weight: normal; | ||
+ | padding:0; | ||
+ | margin:0; | ||
+ | text-transform: uppercase; | ||
+ | text-align: left; | ||
+ | } | ||
+ | #home-devices a{ | ||
+ | color:#fff; | ||
+ | font-weight: 600; | ||
+ | text-shadow:1 1 1px #777; | ||
+ | } | ||
+ | #home-devices a:hover{ | ||
+ | color:#fff; | ||
+ | } | ||
+ | </style> | ||
+ | |||
+ | <div id="header_wrapper" style="height:auto;background-repeat: repeat;padding-top:0;"> | ||
+ | |||
+ | <div id="top_menu_wrapper"> | ||
+ | <ul id="top_menu" class="container" style="margin-top:0;"> | ||
+ | <li><a href="https://2013.igem.org/Team:Valencia_Biocampus" id="menu_a_home" class="active"><img src="https://static.igem.org/mediawiki/2013/3/39/Small_wormboys_logo.png" alt="mini_logo" /></a></li> | ||
+ | <li><a href="https://2013.igem.org/Team:Valencia_Biocampus/Team" id="menu_a_team">Team</a></li> | ||
+ | <li><a href="https://2013.igem.org/Team:Valencia_Biocampus/Project" id="menu_a_project">Project</a></li> | ||
+ | <li><a href="https://2013.igem.org/Team:Valencia_Biocampus/Results" id="menu_a_results">Results</a></li> | ||
+ | <li><a href="https://2013.igem.org/Team:Valencia_Biocampus/Modeling" id="menu_a_modeling">Modeling</a></li> | ||
+ | <li><a href="https://2013.igem.org/Team:Valencia_Biocampus/Devices" id="menu_a_devices">Devices</a></li> | ||
+ | <li><a href="https://2013.igem.org/Team:Valencia_Biocampus/HP" id="menu_a_hp">Human Practices</a></li> | ||
+ | <li><a href="https://2013.igem.org/Team:Valencia_Biocampus/Achievements" id="menu_a_achievements">Achievements</a></li> | ||
+ | <li><a href="https://2013.igem.org/Team:Valencia_Biocampus/Attributions" id="menu_a_attributions">Attributions</a></li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | |||
+ | <div id="carousel-vlc_biocampus-generic" class="carousel slide" style="margin-bottom:0;"> | ||
+ | |||
+ | <!-- Wrapper for slides --> | ||
+ | <div class="carousel-inner" style="overflow:hidden;overflow-x:hidden;overflow:y;visible;"> | ||
+ | <div class="item active" style="overflow-y:visible;"> | ||
+ | |||
+ | |||
+ | <div id="home-presentation" class="container" style="margin-top:0;position:relative;"> | ||
+ | <h3 id="home-presentation-title">H<span class="text-green">o</span>w d<span class="text-green">o</span>es it w<span class="text-green">o</span>rk? </h3> | ||
+ | <div id="home-pseudomonas-info"> | ||
+ | <div id="home-pseudomonas-info-title"> | ||
+ | <i>P. putida</i> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div id="home-pseudomonas-img"> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/7/79/Vlc_bio-home_pseudomonas.png" alt="Pseudomonas" /> | ||
+ | </div> | ||
+ | <div id="home-elegans-info"> | ||
+ | <div id="home-elegans-info-title"> | ||
+ | <i>C. elegans</i> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | <div id="home-elegans-img"> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/3/38/Vlc_bio-home_elegans.png" alt="C. elegans" /> | ||
+ | </div> | ||
+ | <img id="home-arrow1" src="https://static.igem.org/mediawiki/2013/6/62/Vlc_bio-home_home-presentation-arrow1.png" alt="" style="width:60px;position:absolute;top:250px;left:135px;display:none;" /> | ||
+ | <img id="home-arrow2" src="https://static.igem.org/mediawiki/2013/5/52/Vlc_bio-home_home-presentation-arrow2.png" alt="" style="width:60px;position:absolute;top:150px;left:135px;display:none;" /> | ||
+ | |||
+ | <div id="home-the_riding-icon" class="home-icon"> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/0/04/Vlc_bio-home_icon_riding.png" alt="Icon Riding" data-placement="top" data-toggle="tooltip" data-original-title="Click to show 'The Riding'" /> | ||
+ | </div> | ||
+ | |||
+ | <div id="home-the_riding-block"> | ||
+ | <div id="home-the_riding-description" class="popover right"> | ||
+ | <div class="arrow"></div> | ||
+ | <h4 class="popover-title"> | ||
+ | The Riding | ||
+ | </h4> | ||
+ | <div class="popover-content"> | ||
+ | <p> | ||
+ | Pseudomonas make a biofilm on the worm | ||
+ | </p> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div id="home-the_riding-img"> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/7/70/Vlc_bio-home_worm_biofilm.png" alt="Worm with biofilm" /> | ||
+ | </div> | ||
+ | |||
+ | <div id="home-the_calling-icon" class="home-icon" data-trigger="hover" data-content="C. elegans will be attracted to a different media by chemotaxis, where PHA will be produced, because of the presence of fatty acids and [N<sub>2</sub>]" data-placement="right" data-toggle="popover" data-original-title="The calling"> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/4/4d/Vlc_bio-home_icon_calling.png" alt="Icon Calling" data-placement="top" data-toggle="tooltip" data-original-title="Click to show 'The Calling'" /> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <img id="home-arrow3" src="https://static.igem.org/mediawiki/2013/1/1f/Vlc_bio-home_home-presentation-arrow3.png" alt="" style="width:100px;position:absolute;top:210px;left:280px;display:none;" /> | ||
+ | |||
+ | <div id="home-the_calling-block"> | ||
+ | <div id="home-the_calling-description" class="popover right"> | ||
+ | <div class="arrow" style="top:87px"></div> | ||
+ | |||
+ | <h4 class="popover-title">The Calling</h4> | ||
+ | <div class="popover-content"> | ||
+ | <p> | ||
+ | The nematode is attracted towards substrate-rich hotspots | ||
+ | </p> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | <div id="home-ecoli-info"> | ||
+ | <div id="home-ecoli-info-title"> | ||
+ | <i>E. coli</i> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div id="home-ecoli-img"> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/e/e8/Vlc_bio-home_ecoli.png" alt="ecoli" style="width:84px;height:84px;" /> | ||
+ | </div> | ||
+ | |||
+ | <div id="home-the_clumping-icon" class="home-icon"> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/b/ba/Vlc_bio-home_icon_clumping.png" alt="Icon Clumping" data-placement="top" data-toggle="tooltip" data-original-title="Click to show 'The Clumping'" /> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | <img id="home-arrow4" src="https://static.igem.org/mediawiki/2013/e/e4/Vlc_bio-home_home-presentation-arrow4.png" alt="" style="width:100px;position:absolute;top:210px;left:480px;display:none;" /> | ||
+ | |||
+ | |||
+ | |||
+ | <div id="home-the_clumping-block"> | ||
+ | <div id="home-the_clumping-description" class="popover top"> | ||
+ | <div class="arrow" style="left:42px"></div> | ||
+ | |||
+ | <h4 class="popover-title">The Clumping</h4> | ||
+ | <div class="popover-content"> | ||
+ | <p> | ||
+ | RNAi from ingested <i>E. coli</i> triggers nematode altered behavior in the form of clumping | ||
+ | </p> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div id="home-the_clumping-img"> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/9/9a/Vlc_bio-home_doing_clumping.png" alt="Doing Clumping" /> | ||
+ | </div> | ||
+ | |||
+ | <div id="home-the_building-icon" class="home-icon"> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/d/d9/Vlc_bio-home_icon_building.png" alt="Icon Building" data-placement="top" data-toggle="tooltip" data-original-title="Click to show 'The Building'" /> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | <img id="home-arrow5" src="https://static.igem.org/mediawiki/2013/1/1f/Vlc_bio-home_home-presentation-arrow3.png" alt="" style="width:100px;position:absolute;top:210px;left:678px;display:none;" /> | ||
+ | |||
+ | <div id="home-the_building-block"> | ||
+ | <div id="home-the_building-description" class="popover bottom"> | ||
+ | <div class="arrow"></div> | ||
+ | |||
+ | <h4 class="popover-title">Building the bioplastic (PHA)</h4> | ||
+ | <div class="popover-content"> | ||
+ | As a result, <i>Pseudomonas</i> concentrate in the desired substrate-rich hotspot and do their work | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div id="home-the_building-description-img"> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/7/77/Vlc_bio-home_pseudomonas_building.png" alt="Pseudomonas building" /> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | <div class="item" style="background:url('https://static.igem.org/mediawiki/2013/0/00/Vlc_biocampus_team.jpg') no-repeat top center;background-size:cover;"> | ||
+ | <div class="container" style="margin-top:0;"> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | <div class="carousel-caption" style="left:50%;top:25px;background:rgba(33,63,102,0.7);width:22%;margin-left:-410px;padding:7px;border-radius:10px;font-size:18px;min-width:250px;max-width:320px;"> | ||
+ | <h3>Ab<span class="text-green">o</span>ut us</h3> | ||
+ | Meet the team who has developed this project | ||
+ | <div style="height:30px"></div> | ||
+ | <a href="https://2013.igem.org/Team:Valencia_Biocampus/Team" class="btn btn-large btn-green">Go to Team section</a> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="item" id="home-devices"> | ||
+ | <div class="container" style="margin-top:0;"> | ||
+ | <div style="text-align:center;width:900px;color:#fff;margin-top:40px;"> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/c/c4/Vlc_biocampus-igem_scanner.png" alt="iGEM Scanner" style="width:900px;" /> | ||
+ | <br/> | ||
+ | iGEM Scanner & C++ Elegans | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="carousel-caption" style="text-align:left;width:400px;left:auto;left:50%;line-height:25px"> | ||
+ | <h3>M<span class="text-green">o</span>deling & Devices</h3> | ||
+ | Discover what our engineers have been preparing: | ||
+ | <p style="padding-left:25px;padding-top:0;margin-top:7px;line-height:25px;"> | ||
+ | |||
+ | <a href="https://2013.igem.org/Team:Valencia_Biocampus/Modeling"><img src="https://static.igem.org/mediawiki/2013/archive/3/32/20130905181144!Vlc_biocampus-bullet_list.png" alt=">" style="padding-bottom:4px;padding-right:4px;" /> <strong>Modeling</strong></a> | ||
+ | <br/> | ||
+ | <a href="https://2013.igem.org/Team:Valencia_Biocampus/Devices#Hardware"><img src="https://static.igem.org/mediawiki/2013/archive/3/32/20130905181144!Vlc_biocampus-bullet_list.png" alt=">" style="padding-bottom:4px;padding-right:4px;" /> <strong>Hardware:</strong> iGEM Scanner</a> | ||
+ | <br/> | ||
+ | <a href="https://2013.igem.org/Team:Valencia_Biocampus/Devices#Software"><img src="https://static.igem.org/mediawiki/2013/archive/3/32/20130905181144!Vlc_biocampus-bullet_list.png" alt=">" style="padding-bottom:4px;padding-right:4px;" /> <strong>Software:</strong> C++ Elegans</a> | ||
+ | </p> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="item"> | ||
+ | <div class="container" style="margin-top:0;"> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/5/57/Vlc_bio-home_tentales.png" alt="Ten Tales on Synthetic Biology" /> | ||
+ | </div> | ||
+ | |||
+ | <div class="carousel-caption" style="width:380px;left:50%;margin-left:150px;"> | ||
+ | <h3>T<span class="text-green">e</span>n Ta<span class="text-green">l</span>es <span class="text-green">o</span>n S<span class="text-green">y</span>ntheti<span class="text-green">c</span> Bi<span class="text-green">o</span>logy</h3> | ||
+ | <p>We have written a book, "Ten Tales on Synthetic Biology", in which we aim to show an utopic point of view but also a catastrophic one. With that, we want to make people aware that the best option would be to do responsible research. </p> | ||
+ | <div style="height:30px;"></div> | ||
+ | <a href="https://2013.igem.org/Team:Valencia_Biocampus/HP" class="btn btn-large btn-green">Human Practices</a> | ||
+ | |||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <!-- Controls --> | ||
+ | <a class="left carousel-control" href="#carousel-vlc_biocampus-generic" data-slide="prev" style="background:rgba(191, 221, 10, 1);"> | ||
+ | <span class="icon-prev" style="color:#fff;font-size:35px;line-height:38px;margin-left:-4px"> < </span> | ||
+ | </a> | ||
+ | <a class="right carousel-control" href="#carousel-vlc_biocampus-generic" data-slide="next" style="background:rgba(191, 221, 10, 1);"> | ||
+ | <span class="icon-next" style="color:#fff;font-size:35px;line-height:38px;margin-left:4px"> > </span> | ||
+ | </a> | ||
+ | |||
+ | <!-- Indicators --> | ||
+ | <ol class="carousel-indicators" style="top:auto;bottom:10px;right:auto;left:50%;margin-left:-45px;"> | ||
+ | <li data-target="#carousel-vlc_biocampus-generic" data-slide-to="0" class="active"></li> | ||
+ | <li data-target="#carousel-vlc_biocampus-generic" data-slide-to="1"></li> | ||
+ | <li data-target="#carousel-vlc_biocampus-generic" data-slide-to="2"></li> | ||
+ | <li data-target="#carousel-vlc_biocampus-generic" data-slide-to="3"></li> | ||
+ | </ol> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | </div> | ||
+ | <a href="#" class="btn btn-primary" id="toggleWikiMenu" data-placement="bottom" data-toggle="tooltip" data-original-title="Show/hide wiki menu"><img src="https://static.igem.org/mediawiki/2013/b/bc/Togglerwikimenu.png" alt="toggle" /></a> | ||
+ | <script type="text/javascript"> | ||
+ | var showStaticMenuBar = false; | ||
+ | $(window).scroll(function() { | ||
+ | if(showStaticMenuBar == false){ | ||
+ | if($(this).scrollTop() >= 600){ | ||
+ | $("#top_menu_wrapper").addClass("fixedBar"); | ||
+ | $("#top_menu_wrapperFake").show(); | ||
+ | showStaticMenuBar=true; | ||
+ | } | ||
+ | } | ||
+ | else{ | ||
+ | if($(this).scrollTop() <= 600){ | ||
+ | $("#top_menu_wrapper").removeClass("fixedBar"); | ||
+ | $("#top_menu_wrapperFake").hide(); | ||
+ | showStaticMenuBar=false; | ||
+ | } | ||
+ | } | ||
+ | }); | ||
+ | |||
+ | if(typeof activeSection === "undefined" ) | ||
+ | var activeSection = "home"; | ||
+ | $("#top_menu li a.active").removeClass("active"); | ||
+ | |||
+ | $("#menu_a_"+activeSection).addClass("active"); | ||
+ | |||
+ | $("#toggleWikiMenu").tooltip(); | ||
+ | |||
+ | |||
+ | $("#toggleWikiMenu").click(function() { | ||
+ | $("#top-section").toggle(); | ||
+ | return false; | ||
+ | }); | ||
+ | |||
+ | $('.icono').popover(); | ||
+ | |||
+ | $("#carousel-vlc_biocampus-generic").carousel({ | ||
+ | pause: true, | ||
+ | interval: 8000 | ||
+ | }); | ||
+ | |||
+ | $(".item").hover( | ||
+ | function(){ | ||
+ | $("#carousel-vlc_biocampus-generic").carousel('pause'); | ||
+ | }, | ||
+ | function() { | ||
+ | $("#carousel-vlc_biocampus-generic").carousel('cycle'); | ||
+ | } | ||
+ | ); | ||
+ | |||
+ | |||
+ | var glowingbutton = 1; | ||
+ | |||
+ | var the_riding_showing = false; | ||
+ | var the_calling_showing = false; | ||
+ | var the_clumping_showing = false; | ||
+ | var the_building_showing = false; | ||
+ | glowbutton(); | ||
+ | |||
+ | function glowbutton(){ | ||
+ | |||
+ | if(glowingbutton == 1){ | ||
+ | $("#home-the_riding-icon img").animate({ | ||
+ | width: "85px", | ||
+ | "margin-top": "-5px" | ||
+ | |||
+ | }, 500, function() { | ||
+ | if(glowingbutton == 1){ | ||
+ | // Animation complete. | ||
+ | $("#home-the_riding-icon img").animate({width: "75px", "margin-top": "0px"}, 500); | ||
+ | glowbutton(); | ||
+ | } | ||
+ | }); | ||
+ | } | ||
+ | else if(glowingbutton == 2){ | ||
+ | $("#home-the_calling-icon img").animate({ | ||
+ | width: "85px", | ||
+ | "margin-top": "-5px" | ||
+ | |||
+ | }, 500, function() { | ||
+ | if(glowingbutton == 2){ | ||
+ | // Animation complete. | ||
+ | $("#home-the_calling-icon img").animate({width: "75px", "margin-top": "0px"}, 500); | ||
+ | glowbutton(); | ||
+ | } | ||
+ | }); | ||
+ | } | ||
+ | else if(glowingbutton == 3){ | ||
+ | $("#home-the_clumping-icon img").animate({ | ||
+ | width: "85px", | ||
+ | "margin-top": "-5px" | ||
+ | |||
+ | }, 500, function() { | ||
+ | if(glowingbutton == 3){ | ||
+ | // Animation complete. | ||
+ | $("#home-the_clumping-icon img").animate({width: "75px", "margin-top": "0px"}, 500); | ||
+ | glowbutton(); | ||
+ | } | ||
+ | }); | ||
+ | } | ||
+ | else if(glowingbutton == 4){ | ||
+ | $("#home-the_building-icon img").animate({ | ||
+ | width: "85px", | ||
+ | "margin-top": "-5px" | ||
+ | |||
+ | }, 500, function() { | ||
+ | if(glowingbutton == 4){ | ||
+ | // Animation complete. | ||
+ | $("#home-the_building-icon img").animate({width: "75px", "margin-top": "0px"}, 500); | ||
+ | glowbutton(); | ||
+ | } | ||
+ | }); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | $("#home-the_riding-icon img").tooltip(); | ||
+ | $("#home-the_riding-icon img").click(function(){ | ||
+ | |||
+ | if(!the_riding_showing){ | ||
+ | the_riding_showing = true; | ||
+ | |||
+ | $("#home-the_riding-icon").css({"cursor": "default"}); | ||
+ | |||
+ | $('#home-the_riding-icon img').tooltip('destroy') | ||
+ | |||
+ | glowingbutton = 2; | ||
+ | glowbutton(); | ||
+ | $("#home-the_riding-icon img").animate({width: "100px", "margin-top": "-15px"}, 500); | ||
+ | |||
+ | $("#home-arrow1").fadeIn("slow"); | ||
+ | $("#home-arrow2").fadeIn("slow", function(){ | ||
+ | $("#home-the_riding-description").fadeIn("slow", function(){ | ||
+ | $("#home-the_riding-img").fadeIn("slow", function(){ | ||
+ | |||
+ | $("#home-the_calling-icon").fadeIn("slow"); | ||
+ | $("#home-the_calling-icon img").tooltip(); | ||
+ | }); | ||
+ | |||
+ | |||
+ | |||
+ | }); | ||
+ | }); | ||
+ | } | ||
+ | |||
+ | |||
+ | }); | ||
+ | |||
+ | $("#home-the_calling-icon img").click(function(){ | ||
+ | |||
+ | |||
+ | if(!the_calling_showing){ | ||
+ | the_calling_showing = true; | ||
+ | |||
+ | |||
+ | $("#home-the_calling-icon").css({"cursor": "default"}); | ||
+ | |||
+ | $('#home-the_calling-icon img').tooltip('destroy') | ||
+ | |||
+ | glowingbutton = 3; | ||
+ | |||
+ | $("#home-the_calling-icon img").animate({width: "100px", "margin-top": "-15px"}, 500); | ||
+ | |||
+ | glowbutton(); | ||
+ | |||
+ | $("#home-the_riding-block").animate({"left": "220px"}, 700); | ||
+ | |||
+ | |||
+ | $("#home-the_riding-description").removeClass("right"); | ||
+ | |||
+ | |||
+ | $("#home-the_calling-icon").animate({"left": "158px"}, 700); | ||
+ | $("#home-the_riding-img").animate({"top": "210px", "left": "0px"},700); | ||
+ | |||
+ | $("#home-the_riding-description").animate({"margin-top": "115px", "margin-left": "-30px"}, 700, function(){ | ||
+ | |||
+ | $("#home-the_riding-description").addClass("bottom"); | ||
+ | $("#home-the_riding-description").find(".arrow").css({"left": "40px"}); | ||
+ | |||
+ | |||
+ | $("#home-arrow3").fadeIn("slow"); | ||
+ | |||
+ | $("#home-the_calling-description").fadeIn("slow", function(){ | ||
+ | $("#home-ecoli-info").fadeIn("slow"); | ||
+ | $("#home-ecoli-img").fadeIn("slow", function(){ | ||
+ | |||
+ | $("#home-the_clumping-icon").fadeIn("slow"); | ||
+ | $("#home-the_clumping-icon img").tooltip(); | ||
+ | }); | ||
+ | |||
+ | |||
+ | |||
+ | }); | ||
+ | }); | ||
+ | } | ||
+ | |||
+ | |||
+ | }); | ||
+ | |||
+ | $("#home-the_clumping-icon img").click(function(){ | ||
+ | |||
+ | if(!the_clumping_showing){ | ||
+ | the_clumping_showing = true; | ||
+ | |||
+ | |||
+ | $("#home-the_clumping-icon").css({"cursor": "default"}); | ||
+ | |||
+ | $('#home-the_clumping-icon img').tooltip('destroy') | ||
+ | |||
+ | glowingbutton = 4; | ||
+ | |||
+ | $("#home-the_clumping-icon img").animate({width: "100px", "margin-top": "-15px"}, 500); | ||
+ | |||
+ | glowbutton(); | ||
+ | |||
+ | $("#home-the_calling-description").removeClass("right"); | ||
+ | |||
+ | |||
+ | $("#home-ecoli-info-title").animate({"top": "250px", "left": "-20px"}, 700); | ||
+ | $("#home-ecoli-img").animate({"top": "160px", "left": "-20px"}, 700); | ||
+ | |||
+ | $("#home-the_clumping-icon").animate({"left": "95px"}, 700); | ||
+ | |||
+ | $("#home-the_calling-description").animate({"top": "-70px", "left": "-120px"}, 700, function(){ | ||
+ | |||
+ | $("#home-the_calling-description").addClass("top"); | ||
+ | $("#home-the_calling-description").find(".arrow").css({"left": "65px", "top": "auto"}); | ||
+ | |||
+ | |||
+ | |||
+ | $("#home-arrow4").fadeIn("slow"); | ||
+ | |||
+ | $("#home-the_clumping-description").fadeIn("slow", function(){ | ||
+ | $("#home-the_clumping-img").fadeIn("slow", function(){ | ||
+ | |||
+ | $("#home-the_building-icon").fadeIn("slow"); | ||
+ | $("#home-the_building-icon img").tooltip(); | ||
+ | }); | ||
+ | |||
+ | |||
+ | |||
+ | }); | ||
+ | }); | ||
+ | } | ||
+ | |||
+ | |||
+ | }); | ||
+ | $("#home-the_building-icon img").click(function(){ | ||
+ | |||
+ | if(!the_building_showing){ | ||
+ | the_building_showing = true; | ||
+ | |||
+ | |||
+ | $("#home-the_building-icon").css({"cursor": "default"}); | ||
+ | |||
+ | $('#home-the_building-icon img').tooltip('destroy') | ||
+ | |||
+ | glowingbutton = 5; | ||
+ | |||
+ | $("#home-the_clumping-img").animate({"top":"10px", "left": "250px"}) | ||
+ | |||
+ | |||
+ | |||
+ | $("#home-the_building-icon img").animate({width: "100px", "margin-top": "-15px"}, 500); | ||
+ | |||
+ | glowbutton(); | ||
+ | |||
+ | $("#home-the_building-description").removeClass("right"); | ||
+ | |||
+ | $("#home-the_building-icon").animate({"left": "195px"}, 700); | ||
+ | |||
+ | $("#home-the_building-description").animate({"left": "-10px"}, 700, function(){ | ||
+ | |||
+ | $("#home-the_building-description").find(".arrow").css({"left": "130px"}); | ||
+ | |||
+ | |||
+ | |||
+ | $("#home-arrow5").fadeIn("slow"); | ||
+ | |||
+ | $("#home-the_building-description").fadeIn("slow", function(){ | ||
+ | $("#home-the_building-description-img").fadeIn("slow", function(){ | ||
+ | |||
+ | $("#home-the_building-description-img").fadeIn("slow"); | ||
+ | |||
+ | |||
+ | }); | ||
+ | |||
+ | |||
+ | |||
+ | }); | ||
+ | }); | ||
+ | } | ||
+ | |||
+ | |||
+ | }); | ||
+ | |||
+ | </script> | ||
+ | </p> | ||
+ | |||
+ | |||
+ | |||
+ | <div class="clearfix"></div> | ||
+ | <div class="container"> | ||
+ | |||
+ | <h2>WormBoys in 150 words</h2> | ||
+ | <div style="width:585px;margin-right:15px;float:left;"> | ||
+ | Bacteria are essential in biotechnology, but they can hardly move. Nematodes, such as <i>Caenorhabditis elegans</i>, are fast crawling organisms, but they have limited biotechnological applications. By combining the best from both organisms, we present the first artificial synthetic symbiosis with bacteria engineered to ride on worms, which concentrate in hotspots where bacteria perform a desired biotechnological process, such as bioplastic (PHA) production. We have engineered <i>Pseudomonas putida</i> with a whole operon that allows the formation of a biofilm on the worm. Biofilm formation is switched on and off depending on the media, and thus bacteria get on and off the worm like travellers on a bus. We have also engineered a third partner, <i>Escherichia coli</i>, to express an interference RNA that promotes clumping. Taken together, our artificial symbiosis allows biotechnologically interesting bacteria to travel on nematodes, reach nutrient-rich biomass spots and maximize the efficiency of biotechnological fermentations in heterogeneous substrates. | ||
+ | </div> | ||
+ | |||
+ | <iframe src="//player.vimeo.com/video/75885404" width="350" height="240" frameborder="0" wmode="Opaque" webkitallowfullscreen mozallowfullscreen allowfullscreen ></iframe> | ||
+ | |||
+ | |||
+ | <div style="height:70px;clear:both;"></div> | ||
+ | <p style="text-align:center"> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/f/fe/Vlc_bio-home_sponsors.png" alt="sponsors" /> | ||
+ | </p> | ||
</div> | </div> | ||
+ | <div class="clearfix"></div> |
Latest revision as of 17:35, 26 October 2013
WormBoys in 150 words
Bacteria are essential in biotechnology, but they can hardly move. Nematodes, such as Caenorhabditis elegans, are fast crawling organisms, but they have limited biotechnological applications. By combining the best from both organisms, we present the first artificial synthetic symbiosis with bacteria engineered to ride on worms, which concentrate in hotspots where bacteria perform a desired biotechnological process, such as bioplastic (PHA) production. We have engineered Pseudomonas putida with a whole operon that allows the formation of a biofilm on the worm. Biofilm formation is switched on and off depending on the media, and thus bacteria get on and off the worm like travellers on a bus. We have also engineered a third partner, Escherichia coli, to express an interference RNA that promotes clumping. Taken together, our artificial symbiosis allows biotechnologically interesting bacteria to travel on nematodes, reach nutrient-rich biomass spots and maximize the efficiency of biotechnological fermentations in heterogeneous substrates.