Team:Paris Bettencourt

From 2013.igem.org

(Difference between revisions)
Line 9: Line 9:
     display:block;
     display:block;
     position:absolute;
     position:absolute;
-
     top:30px;
+
     top:0px;
     width:100%;
     width:100%;
-
     margin-bottom:-125px;
+
     margin-bottom:-122px;
     position:relative;
     position:relative;
     /*top:-10px;*/
     /*top:-10px;*/
Line 57: Line 57:
}
}
.carousel .next, .carousel .prev {
.carousel .next, .carousel .prev {
-
     position: absolute;
+
     position: absolu
-
    top: 0;
+
-
    width: 100%;
+
-
}
+
-
.carousel .next {
+
-
    left: 100%;
+
-
}
+
-
.carousel .prev {
+
-
    left: -100%;
+
-
}
+
-
.carousel .next.left, .carousel .prev.right {
+
-
    left: 0;
+
-
}
+
-
.carousel .active.left {
+
-
    left: -100%;
+
-
}
+
-
.carousel .active.right {
+
-
    left: 100%;
+
-
}
+
-
.carousel-control {
+
-
    display:none;
+
-
    position: absolute;
+
-
    top: 50%;
+
-
    left: 15px;
+
-
    width: 40px;
+
-
    height: 40px;
+
-
    margin-top: -20px;
+
-
    font-size: 60px;
+
-
    font-weight: 100;
+
-
    line-height: 30px;
+
-
    color: rgb(250,247,186);
+
-
    text-align: center;
+
-
    background: rgb(30,39,43);
+
-
    border: 3px solid rgb(250,247,186);
+
-
    -webkit-border-radius: 23px;
+
-
    -moz-border-radius: 23px;
+
-
    border-radius: 23px;
+
-
    opacity: 0.1;
+
-
    filter: alpha(opacity=10);
+
-
}
+
-
.carousel-control.right {
+
-
    left: auto;
+
-
    right: 15px;
+
-
}
+
-
.carousel-control:hover {
+
-
    text-decoration: none;
+
-
    opacity: 0.9;
+
-
    filter: alpha(opacity=90);
+
-
}
+
-
.carousel-caption {
+
-
    display:none;
+
-
}
+
-
.carousel-indicators {
+
-
  position: absolute;
+
-
  top: 50px;
+
-
  left:1000px;
+
-
  width:auto;
+
-
  padding:0;
+
-
  margin:0;
+
-
  text-align: center;
+
-
  list-style: none;
+
-
  z-index:4;
+
-
}
+
-
.carousel-indicators li {
+
-
    /*display: inline-block;*/
+
-
    float:left;
+
-
    width: 10px;
+
-
    height: 10px;
+
-
    margin: 5px;
+
-
    text-indent: -999px;
+
-
    cursor: pointer;
+
-
    border: 1px solid rgb(250,247,186);
+
-
    background-color: rgb(30,39,43);
+
-
    opacity: 0.5;
+
-
    filter: alpha(opacity=50);
+
-
    border-radius: 9px;
+
-
}
+
-
.carousel-indicators .active {
+
-
    background-color: rgb(250,247,186);
+
-
    border: 1px solid rgb(30,39,43);
+
-
    opacity: 0.5;
+
-
    filter: alpha(opacity=50);
+
-
}
+
-
.panel {
+
-
  width:1100px;
+
-
  height:632px;
+
-
  margin:0;
+
-
  color: rgb(30,39,43);
+
-
  font-family: 'Yanone Kaffeesatz', sans-serif;
+
-
}
+
-
/* */
+
-
.subpanel1 {
+
-
  float:left;
+
-
  width:535px;
+
-
  height:428px;
+
-
  margin-top:45px;
+
-
  margin-right:20px;
+
-
  margin-bottom:12px;
+
-
  border-radius:7px;
+
-
  background:rgb(252,250,229);
+
-
}
+
-
.subpanel2 {
+
-
  float:left;
+
-
  width:125px;
+
-
  height:492px;
+
-
  font-size:22px;
+
-
  text-align:center;
+
-
  margin-top:45px;
+
-
  margin-right:11px;
+
-
  border-radius:7px;
+
-
  overflow:hidden;
+
-
}
+
-
.panel a {
+
-
  color: rgb(46,43,52);
+
-
  text-decoration:none;
+
-
}
+
-
.subpanel2:hover{
+
-
  font-weight:bold;
+
-
}
+
-
.subpanel3 {
+
-
  float:left;
+
-
  width:535px;
+
-
  height:50px;
+
-
  font-size:30px;
+
-
  text-align:left;
+
-
  line-height:50px;
+
-
  background:rgb(51,51,51);
+
-
  color:white;
+
-
  border-radius:7px;
+
-
  position:relative;
+
-
  bottom:50px;
+
-
  font-family: 'Great Vibes', cursive;
+
-
  font-size: 35px;
+
-
}
+
-
.spdesc {
+
-
  display:none;
+
-
  height:100px;
+
-
  color:rgb(51,51,51);
+
-
}
+
-
.cont {
+
-
  width:90%;
+
-
  height:auto;
+
-
  margin-left:5%;
+
-
  margin-top:5%;
+
-
  background:transparent;
+
-
}
+
-
.cont p {
+
-
  font-size:24px;
+
-
  line-height:26px;
+
-
  width:auto;
+
-
  height:auto;
+
-
  margin:5% 2%;
+
-
}
+
-
.narrowimg {
+
-
  /*position:absolute;*/
+
-
  z-index:2;
+
-
  opacity:0.3;
+
-
  filter: alpha(opacity=30);
+
-
}
+
-
.titlebox {
+
-
  z-index:1;
+
-
  position:relative;
+
-
  bottom:150px;
+
-
  background:transparent;
+
-
}
+
-
.narrowimg:hover {
+
-
  opacity:0.8;
+
-
  filter: alpha(opacity=80);
+
-
}
+
-
</style>
+
-
 
+
-
<div id="topheader">
+
-
<div id="TBBanner" class="carousel slide">
+
-
  <ol class="carousel-indicators">
+
-
      <li data-target="#TBBanner" data-slide-to="0" class="active"></li>
+
-
      <li data-target="#TBBanner" data-slide-to="1" ></li>
+
-
      <li data-target="#TBBanner" data-slide-to="2" ></li>
+
-
  </ol>
+
-
    <div class="carousel-inner">
+
-
      <div class="active item" data-slide="0"><img style="margin-top:-1px" src="https://static.igem.org/mediawiki/2013/b/b0/PBTBbannerFrontPage3.jpg" width="1100" height="632"/></div>
+
-
      <div class="item" data-slide="1"><img style="margin-top:-1px" src="https://static.igem.org/mediawiki/2013/5/52/PBTBbanner4rontPage3.jpg" width="1100" height="632"/></div>
+
-
      <div class="item" data-slide="2"><img style="margin-top:-1px" src="https://static.igem.org/mediawiki/2013/f/fe/PBTBbanner5rontPage3.jpg" width="1100" height="632"/></div> 
+
-
    </div>
+
-
  </div>
+
-
  <div id="bgkBanner2">
+
-
    <img src="https://static.igem.org/mediawiki/2013/7/7d/PB_Banner_Lines2.gif" width="1100"> 
+
-
  </div>
+
-
  <img src="https://static.igem.org/mediawiki/2013/3/3a/PB_logoParis.gif" width="122px" style="position:relative;bottom:610px;left:30px;"/>
+
-
</div>
+
-
<div style="clear: both;"></div>
+
-
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+
-
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0-wip/js/bootstrap.min.js"></script>
+
-
<script type="text/javascript">
+
-
jQuery(document).ready(function($) {
+
-
$('.carousel').carousel({
+
-
  interval: 5000
+
-
  })
+
-
});
+
-
</script>
+
-
<div id="page">
+
-
<div class="panel">
+
-
  <div class="subpanel1">
+
-
    <!--<img style="opacity:0.8" src="https://static.igem.org/mediawiki/2013/7/78/PB_ProjectLarge1.jpg" width="535px" height="428px" />--!>
+
-
    <div style="position:relative;bottom:0px">
+
-
    <div class="cont"><p style="  font-size:30px;line-height:32px;">FIGHT TUBERCULOSIS WITH MODERN WEAPONS </p></div>
+
-
    <div class="cont">
+
-
      <p>
+
-
      Tuberculosis is an infectious disease caused by <i>Mycobacterium tuberculosis</i> affecting millions of people over the world. Using <i>Escherichia coli</i> as a model organism we are developing different approaches that could contribute to the fight against TB.
+
-
      </p>
+
-
    </div>
+
-
    <div id="psdesc" class="spdesc">
+
-
      <div class="cont">
+
-
<p>A biosensor that detects the presence of sequence specific antibiotic resistance genes.</p>
+
-
      </div>
+
-
    </div>
+
-
    <div id="dsdesc" class="spdesc">
+
-
      <div class="cont">
+
-
<p>A safe and specific high-throughput drug screening method that targets essential mycobacterial metabolic proteins.</p>
+
-
      </div>  
+
-
    </div>
+
-
    <div id="thdesc" class="spdesc">
+
-
      <div class="cont">
+
-
<p>A phage system with low fitness cost producing sRNA, which inhibit the synthesis of antibiotic resistance proteins.</p>
+
-
      </div>
+
-
    </div>
+
-
    <div id="tcdesc" class="spdesc">
+
-
      <div class="cont">
+
-
<p>An <i>E. coli</i> which invades macrophages and kills mycobacteria.</p>
+
-
      </div>
+
-
    </div>
+
-
    </div>
+
-
  </div>
+
-
  <a href="https://2013.igem.org/Team:Paris_Bettencourt/Project/Phage_Sensor">
+
-
    <div id="pspanel" class="subpanel2">
+
-
      <img class="narrowimg" src="https://static.igem.org/mediawiki/2013/a/a8/PB_DetectNarrow.jpg" width="125px" height="500px"/>
+
-
      <div class="titlebox">
+
-
      <center><img src="https://static.igem.org/mediawiki/2013/0/0b/PB_detecticon.gif" style="height:60px;margin-bottom:20px;"/></center>
+
-
      <div style="width:60%;margin-left:20%;margin-bottom:20px;"><hr></div>
+
-
      Detect
+
-
      </div>
+
-
    </div>
+
-
  </a>
+
-
  <a href="https://2013.igem.org/Team:Paris_Bettencourt/Project/Drug_Screening">
+
-
    <div id="dspanel" class="subpanel2">
+
-
      <img class="narrowimg" src="https://static.igem.org/mediawiki/2013/e/e2/PB_TargetNarrow.jpg" width="125px" height="500px"/>
+
-
      <div class="titlebox">
+
-
      <center><img src="https://static.igem.org/mediawiki/2013/1/11/PB_TargetIcon.gif" style="height:60px;margin-bottom:20px;"/></center>
+
-
      <div style="width:60%;margin-left:20%;margin-bottom:20px;"><hr></div>
+
-
      Target
+
-
      </div>
+
-
    </div>
+
-
  </a>
+
-
  <a href="https://2013.igem.org/Team:Paris_Bettencourt/Project/TB-ception">
+
-
    <div id="tcpanel" class="subpanel2">
+
-
      <img class="narrowimg" src="https://static.igem.org/mediawiki/2013/2/21/PB_InfiltrateNarrow.jpg" width="125px" height="500px"/>
+
-
      <div class="titlebox">
+
-
      <center><img src="https://static.igem.org/mediawiki/2013/6/6c/PB_infiltrate.gif" style="height:60px;margin-bottom:20px;"/></center>
+
-
      <div style="width:60%;margin-left:20%;margin-bottom:20px;"><hr></div>
+
-
      Infiltrate
+
-
      </div>
+
-
    </div>
+
-
  </a>
+
-
  <a href="https://2013.igem.org/Team:Paris_Bettencourt/Project/Trojan_Horse">
+
-
    <div id="thpanel" class="subpanel2">     
+
-
      <img class="narrowimg" src="https://static.igem.org/mediawiki/2013/4/42/PB_SabotageNarrow.jpg" width="125px" height="500px"/>
+
-
      <div class="titlebox">
+
-
      <center><img src="https://static.igem.org/mediawiki/2013/8/81/PB_sabotageicone.gif" style="height:60px;margin-bottom:20px;"/></center>
+
-
      <div style="width:60%;margin-left:20%;margin-bottom:20px;"><hr></div>
+
-
      Sabotage
+
-
      </div>
+
-
    </div>
+
-
  </a>
+
-
  <div class="subpanel3" >
+
-
    <img width="70px" style="margin-left:120px;margin-right:15px;position:relative;bottom:1px" src="https://static.igem.org/mediawiki/2013/d/d5/PB_handresults.gif"/>Our results here
+
-
  </div>
+
-
</div>
+
-
<center>
+
-
<img style="margin-bottom:-24px;" src="https://static.igem.org/mediawiki/2013/4/48/PB_WhiteArrow.gif"/ height="25px">
+
-
</center>
+
-
<div style="clear: both;"></div>
+
-
<div class="panel" style="background:rgb(228,45,51);">
+
-
</div>
+
-
<center>
+
-
<img style="margin-bottom:-24px;" src="https://static.igem.org/mediawiki/2013/a/ad/PB_RedArrow.gif"/ height="25px">
+
-
</center>
+
-
<div style="clear: both;"></div>
+
-
</div>
+
-
 
+
-
<script>
+
-
  $(document).ready(function(){$('div .igemlogo').mouseover(function(){div = $('.left-menu'); div.fadeIn(1);}).mouseout(function(){div.fadeOut(100);});});
+
-
  $(document).ready(function(){$('div #pspanel').mouseover(function(){div = $('#psdesc');div.fadeIn(1);}).mouseout(function(){div.fadeOut(1);});});
+
-
  $(document).ready(function(){$('div #dspanel').mouseover(function(){div = $('#dsdesc');div.fadeIn(1);}).mouseout(function(){div.fadeOut(1);});});
+
-
  $(document).ready(function(){$('div #thpanel').mouseover(function(){div = $('#thdesc');div.fadeIn(1);}).mouseout(function(){div.fadeOut(1);});});
+
-
  $(document).ready(function(){$('div #tcpanel').mouseover(function(){div = $('#tcdesc');div.fadeIn(1);}).mouseout(function(){div.fadeOut(1);});});
+
-
</script>
+
-
 
+
-
</div>
+
-
</html>
+
-
 
+
-
{{:Team:Paris_Bettencourt/footer}}
+

Revision as of 09:40, 26 September 2013