Team:Paris Bettencourt/Menu

From 2013.igem.org

(Difference between revisions)
Line 5: Line 5:
<link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz' rel='stylesheet' type='text/css'>
<style type="text/css">
<style type="text/css">
-
 
/* drop up  
/* drop up  
   http://www.pmob.co.uk/temp/dropup3.htm  
   http://www.pmob.co.uk/temp/dropup3.htm  
   http://www.youtube.com/watch?v=EENF7HNS1co
   http://www.youtube.com/watch?v=EENF7HNS1co
   */
   */
-
 
/* Navigation Menu */
/* Navigation Menu */
 +
.navmenubkg {
 +
  position:fixed;
 +
  display:block;
 +
  z-index:50;
 +
  top:0;
 +
  height:40px;
 +
  left:0;
 +
  right:0;
 +
  background:rgb(228,36,62);
 +
}
 +
.navmenubkg2 {
 +
  position:fixed;
 +
  display:none;
 +
  z-index:50;
 +
  top:40px;
 +
  height:65px;
 +
  left:0;
 +
  right:0;
 +
  background:rgb(250,247,186);
 +
}
#navmenubox {
#navmenubox {
-
    position:fixed;
 
     padding:0;
     padding:0;
-
     margin:0;
+
     margin:0 auto;
-
    bottom:0px;
+
     width:1000px;
     width:1000px;
-
     height:30px;
+
     height:40px;
     z-index:100;
     z-index:100;
     display:block;
     display:block;
-
     background:rgb(30,39,43);
+
     background:transparent;
     color:rgb(250,247,186);  
     color:rgb(250,247,186);  
     text-align:center;
     text-align:center;
-
     line-height:30px;
+
     line-height:40px;
}
}
.sidelogos {
.sidelogos {
-
     position:absolute;
+
     float:left;
-
     padding:0;
+
     display:block;
-
     margin:0;
+
     margin-left:auto;
     height:100%;
     height:100%;
     width:40px;
     width:40px;
 +
}
 +
.sidelogos a {
 +
  display:block;
 +
  top:0;
 +
  bottom:0;
}
}
#pblogo{
#pblogo{
-
    float:left;
 
-
    left:0;
 
}
}
#pgmap{
#pgmap{
-
    float:left;
 
-
    left:40px;
 
}
}
#fbnoticon{
#fbnoticon{
-
    float:right;
 
-
    left:920px;
 
}
}
#twnoticon{
#twnoticon{
-
    float:right;
 
-
    left:960px;
 
}
}
#pblogo img, #pgmap:hover img{
#pblogo img, #pgmap:hover img{
Line 58: Line 71:
}
}
#twitapp, #fbapp {
#twitapp, #fbapp {
-
    display:none;
+
  display:none;
-
    position:absolute;
+
  width:250px;
-
    right:0;
+
  height:auto;
-
    width:250px;
+
  top:40px;
-
    height:400px;
+
  border-radius:3px;
-
    bottom:30px;
+
  /*border: 1px solid rgb(30,39,43);*/
-
    border-radius:3px;
+
  background: rgb(255,255,255);
-
    border: 1px solid rgb(30,39,43);
+
  z-index:100;
-
    background: rgb(255,255,255);  
+
-
    z-index:100;
+
}
}
#fbapp{
#fbapp{
-
     right:-40px;
+
     margin-left:-210px;
}
}
-
ul#nav {
+
#twitapp{
-
     position:absolute;
+
    margin-left:-170px;
 +
    border:none;
 +
}
 +
ul#nav {
 +
    display:block;
 +
     float:left;
     padding:0;
     padding:0;
     margin:0;
     margin:0;
     list-style: none;
     list-style: none;
     height:100%;
     height:100%;
-
     width:84%px;
+
     width:840px;
-
    left:80px;
+
     background:none;
     background:none;
-
     line-height:30px;
+
     line-height:40px;
     z-index:100;
     z-index:100;
     font-family: 'Yanone Kaffeesatz', sans-serif;
     font-family: 'Yanone Kaffeesatz', sans-serif;
 +
}
 +
ul#nav a {
 +
  display:block;
 +
  top:0;
 +
  bottom:0;
}
}
ul#nav ul {
ul#nav ul {
Line 90: Line 110:
     list-style:none;
     list-style:none;
     background:none;
     background:none;
-
     line-height:30px;
+
     line-height:40px;
     z-index:100;
     z-index:100;
}
}
Line 98: Line 118:
     margin:0;
     margin:0;
     width:118px;
     width:118px;
-
     height:30px;
+
     height:40px;
-
     font-size:14px;
+
     font-size:16px;
     font-weight:600;
     font-weight:600;
-
     border-left:1px solid rgb(250,247,186);
+
     border-left:1px solid rgba(250,247,186,0.5);
-
     border-right:1px solid rgb(250,247,186);
+
     border-right:1px solid rgba(250,247,186,0.5);
     background:none;
     background:none;
     font-weight:normal;
     font-weight:normal;
Line 125: Line 145:
}
}
#nav li ul {
#nav li ul {
-
     display:none;
+
     display:block;
 +
    margin:0 auto;
     padding:0;
     padding:0;
     list-style: none;
     list-style: none;
-
     position:absolute;
+
     width:1000px;
-
    margin-left:-1px;
+
     height:65px;
-
    bottom: 30px;
+
-
     height:auto;
+
-
    width:118px;
+
     border:none;
     border:none;
-
     background: rgb(30,39,43);  
+
     background:transparent;
     color:rgb(250,247,186);
     color:rgb(250,247,186);
     z-index:100;  
     z-index:100;  
Line 143: Line 161:
     float:left;
     float:left;
     background:none;
     background:none;
-
     height:30px;
+
     height:65px;
-
     width:100%;
+
     width:118px;
-
     border:1px solid rgb(250,247,186);
+
     color: rgb(30,39,43);
-
     border-bottom:none;
+
    background-color:rgb(250,247,186);
 +
    border:1px solid rgba(228,36,62,0.5);
 +
    border-top:none;
 +
     border-bottom:none;  
     z-index:100;
     z-index:100;
}
}
-
#nav li:hover ul {
+
#nav li:hover .navmenubkg2 {
     display:block;
     display:block;
}
}
-
#nav li ul:hover {
+
#nav li .navmenubkg2:hover {
     display:block;
     display:block;
}
}
ul#nav li:hover li a, ul#nav li.over li a  {
ul#nav li:hover li a, ul#nav li.over li a  {
-
    background-color: rgb(30,39,43);
 
-
    color:rgb(250,247,186);
 
     font-weight:normal;
     font-weight:normal;
}
}
ul#nav li li:hover, ul#nav li li.over, ul#nav li li:hover a, ul#nav li li.over a {
ul#nav li li:hover, ul#nav li li.over, ul#nav li li:hover a, ul#nav li li.over a {
-
    color: rgb(30,39,43);
 
-
    background-color:rgb(250,247,186);
 
     font-weight:bold;
     font-weight:bold;
}
}
Line 170: Line 187:
<body>
<body>
<div style="clear: both;"></div>
<div style="clear: both;"></div>
-
      <div id="navmenubox">
+
<div class="navmenubkg">
-
<div id="pblogo" class="sidelogos">
+
  <div id="navmenubox">
-
  <a href="https://2013.igem.org/Team:Paris_Bettencourt" title="Home Page">
+
    <div id="pblogo" class="sidelogos">
-
    <img src="https://static.igem.org/mediawiki/2013/5/5d/PB_miniLogo.gif" height="30px" width="30px"/>                       
+
      <a href="https://2013.igem.org/Team:Paris_Bettencourt" title="Home Page">
-
  </a>
+
<img src="https://static.igem.org/mediawiki/2013/5/5d/PB_miniLogo.gif" height="40px" width="40px"/>                       
-
</div>
+
      </a>
-
<div id="pgmap" class="sidelogos">
+
    </div>
-
  <a href="https://2013.igem.org/Team:Paris_Bettencourt/Site_Map" title="Site Map">
+
    <div id="pgmap" class="sidelogos">
-
    <img src="https://static.igem.org/mediawiki/2013/5/5d/PB_miniLogo.gif" height="30px" width="30px"/>                       
+
      <a href="https://2013.igem.org/Team:Paris_Bettencourt/Site_Map" title="Site Map">
-
  </a>
+
<img src="https://static.igem.org/mediawiki/2013/5/5d/PB_miniLogo.gif" height="40px" width="40px"/>                       
-
</div>
+
      </a>
-
<ul id="nav">
+
    </div>
-
  <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Project/Overview" title="Project Overview">PROJECT</a>
+
    <ul id="nav">
-
    <ul>
+
      <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Project/Overview" title="Project Overview">PROJECT</a>
-
      <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Project/Phage_Sensor" title="Phage Sensor">DETECT</a> </li>
+
        <div class="navmenubkg2">    
-
      <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Project/Drug_Screening" title="Drug Screening">TARGET</a> </li>
+
          <ul>  
-
                      <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Project/TB-ception" title="TB-ception">INFILTRATE</a> </li>
+
    <li style="margin-left:21px"> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Project/Phage_Sensor" title="Phage Sensor">DETECT</a> </li>
-
      <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Project/Trojan_Horse" title="Trojan Horse">SABOTAGE</a> </li>
+
    <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Project/Drug_Screening" title="Drug Screening">TARGET</a> </li>
-
    </ul>
+
            <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Project/TB-ception" title="TB-ception">INFILTRATE</a> </li>
-
  </li>
+
    <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Project/Trojan_Horse" title="Trojan Horse">SABOTAGE</a> </li>
-
  <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Achievements" title="Achievements">ACHIEVEMENTS</a>
+
  </ul>
-
  </li>
+
        </div>
-
                  <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Parts" title="Submitted Parts">PARTS</a> </li>
+
      </li>
-
  <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Human_Practice/Overview" title="Human Practice Overview">HUMAN PRACTICE</a>  
+
      <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Achievements" title="Achievements">ACHIEVEMENTS</a>
-
  </li>
+
        <div class="navmenubkg2"></div>
-
                  <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Human_Practice/Safety" title="Safety">SAFETY</a> </li>
+
      </li>
-
  <li> <a href="" title="">NOTEBOOK</a>
+
      <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Parts" title="Submitted Parts">PARTS</a>  
-
    <ul>
+
        <div class="navmenubkg2"></div>
-
                      <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Notebook" title="Day Notes">DAY NOTES</a> </li>
+
      </li>
-
      <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Protocols" title="Protocols">PROTOCOLS</a> </li>
+
      <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Human_Practice/Overview" title="Human Practice Overview">HUMAN PRACTICE</a>  
-
    </ul>  
+
        <div class="navmenubkg2"></div>
-
  </li>
+
      </li>
-
  <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Team" title="Team">TEAM</a>  
+
      <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Human_Practice/Safety" title="Safety">SAFETY</a>  
-
    <ul>
+
        <div class="navmenubkg2"></div>
-
      <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Contact" title="Contact">CONTACT</a> </li>
+
      </li>
-
                      <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Attributions" title="Attributions">ATTRIBUTIONS</a> </li>
+
      <li> <a href="" title="">NOTEBOOK</a>
-
                      <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Acknowledgements" title="Acknowledgements">ACKNOWLEDGEMENTS</a></li>
+
        <div class="navmenubkg2">
-
    </ul>
+
  <ul>
-
  </li>
+
            <li style="margin-left:611px"> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Notebook" title="Day Notes">DAY NOTES</a> </li>
-
</ul>
+
    <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Protocols" title="Protocols">PROTOCOLS</a> </li>
-
<div id="fbnoticon" class="sidelogos">
+
  </ul>  
-
  <a href="http://www.facebook.com/ParisiGEM2013" target="_blank">
+
        </div>
-
    <img src="https://static.igem.org/mediawiki/2013/6/60/PB_Logofacebook.gif" height="30px" width="30px"/>                      
+
      </li>
-
    <div id="fbapp">
+
      <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Team" title="Team">TEAM</a>  
-
                      <div class="fb-like-box" data-href="https://www.facebook.com/ParisiGEM2013" data-width="250" data-height="400" data-show-faces="true" data-header="false" data-stream="true" data-show-border="false"></div>
+
        <div class="navmenubkg2">
-
    </div>
+
  <ul>
-
                  </a>
+
    <li style="margin-left:611px"> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Contact" title="Contact">CONTACT</a> </li>
-
</div>
+
            <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Attributions" title="Attributions">ATTRIBUTIONS</a> </li>
-
<div id="twnoticon" class="sidelogos">
+
            <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Acknowledgements" title="Acknowledgements">ACKNOWLEDGEMENTS</a></li>
-
                  <a href="http://twitter.com/iGEM_Paris" target="_blank">
+
  </ul>
-
    <img src="https://static.igem.org/mediawiki/2013/f/f4/PB_Tweeter-logo2.gif" height="30px" width="30px"/>
+
        </div>
-
    <div id="twitapp">
+
      </li>
-
      <a class="twitter-timeline"  
+
    </ul>
-
                        width="250" height="400"
+
    <div id="twnoticon" class="sidelogos">
-
                        data-dnt="true"  
+
      <a href="http://twitter.com/iGEM_Paris" target="_blank">
-
                        href="https://twitter.com/iGEM_Paris"  
+
<img src="https://static.igem.org/mediawiki/2013/f/f4/PB_Tweeter-logo2.gif" height="40px" width="40px"/>
-
                        data-widget-id="368144501119795201">
+
<div id="twitapp">
-
                        @iGEM_Paris</a>
+
  <a class="twitter-timeline"  
-
    </div>
+
            width="250" height="400"
-
                  </a>
+
            data-dnt="true"  
-
</div>
+
            href="https://twitter.com/iGEM_Paris"  
-
      </div>
+
            data-widget-id="368144501119795201">
 +
            @iGEM_Paris</a>
 +
</div>
 +
      </a>
 +
    </div>
 +
    <div id="fbnoticon" class="sidelogos">
 +
      <a href="http://www.facebook.com/ParisiGEM2013" target="_blank">
 +
<img src="https://static.igem.org/mediawiki/2013/6/60/PB_Logofacebook.gif" height="40px" width="40px"/>                      
 +
<div id="fbapp">
 +
          <div class="fb-like-box" data-href="https://www.facebook.com/ParisiGEM2013" data-width="250" data-height="400" data-colorscheme="light" data-show-faces="true" data-header="true" data-stream="true" data-show-border="true"></div>
 +
</div>
 +
      </a>
 +
    </div>
 +
  </div>
 +
</div>
<div style="clear: both;"></div>
<div style="clear: both;"></div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<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>!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>!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");

Revision as of 18:36, 30 August 2013

Retrieved from "http://2013.igem.org/Team:Paris_Bettencourt/Menu"