(38 intermediate revisions by 2 users not shown) | |||
Line 6: | Line 6: | ||
<link href='http://fonts.googleapis.com/css?family=Archivo+Narrow:400,700' rel='stylesheet' type='text/css'> | <link href='http://fonts.googleapis.com/css?family=Archivo+Narrow:400,700' rel='stylesheet' type='text/css'> | ||
<link href='http://fonts.googleapis.com/css?family=Lato:400,700' rel='stylesheet' type='text/css'> | <link href='http://fonts.googleapis.com/css?family=Lato:400,700' rel='stylesheet' type='text/css'> | ||
+ | <link rel="stylesheet" type="text/css" href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css"> | ||
<style type="text/css"> | <style type="text/css"> | ||
Line 104: | Line 105: | ||
margin-bottom : 20px; | margin-bottom : 20px; | ||
color : rgb(64,64,64); | color : rgb(64,64,64); | ||
+ | } | ||
+ | .textbody h6 { | ||
+ | text-align : center; | ||
+ | font-size : 15px; | ||
} | } | ||
.textbody table { | .textbody table { | ||
Line 126: | Line 131: | ||
background-color : rgb(200,200,200); | background-color : rgb(200,200,200); | ||
text-align : center; | text-align : center; | ||
− | + | line-height : 100px; | |
− | + | ||
font-family : "Avenir", Lato, sans-serif; | font-family : "Avenir", Lato, sans-serif; | ||
− | |||
font-size : 100px; | font-size : 100px; | ||
color : white; | color : white; | ||
font-weight : bold; | font-weight : bold; | ||
+ | display: flex; | ||
+ | align-items: center; | ||
+ | justify-content: center; | ||
} | } | ||
.textbody { | .textbody { | ||
Line 143: | Line 149: | ||
color : rgb(64,64,64); | color : rgb(64,64,64); | ||
font-size : 15px; | font-size : 15px; | ||
− | |||
margin-bottom : 50px; | margin-bottom : 50px; | ||
text-indent : 15px; | text-indent : 15px; | ||
} | } | ||
+ | |||
+ | #HQ_page .textbody p { | ||
+ | font-family : "Avenir", Lato, sans-serif; | ||
+ | color : rgb(64,64,64); | ||
+ | font-size : 15px; | ||
+ | } | ||
+ | |||
@supports (-webkit-appearance:none) { | @supports (-webkit-appearance:none) { | ||
.textbody { | .textbody { | ||
Line 166: | Line 178: | ||
font-size : 30px; | font-size : 30px; | ||
font-variant: small-caps; | font-variant: small-caps; | ||
+ | line-height : 30px; | ||
+ | text-decoration : none; | ||
} | } | ||
Line 188: | Line 202: | ||
margin-left : 25%; | margin-left : 25%; | ||
margin-right : 25%; | margin-right : 25%; | ||
− | margin- | + | } |
+ | .text1 span { | ||
+ | width : 50%; | ||
+ | margin-left : 25%; | ||
+ | margin-right : 25%; | ||
+ | display : inline-block; | ||
} | } | ||
/*Text in two equal block*/ | /*Text in two equal block*/ | ||
Line 308: | Line 327: | ||
/*Nav bar CSS*/ | /*Nav bar CSS*/ | ||
− | + | /* | |
#menu { | #menu { | ||
position : fixed; | position : fixed; | ||
Line 482: | Line 501: | ||
} | } | ||
#twitapp{ | #twitapp{ | ||
+ | } | ||
+ | */ | ||
+ | .image-span{ | ||
+ | display:block; | ||
+ | } | ||
+ | |||
+ | .top50 { | ||
+ | margin-top: 50px; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | ul.wtf-menu{ | ||
+ | height:65px; | ||
+ | padding-bottom: 0; | ||
+ | margin-bottom: 0; | ||
+ | margin-top: 0; | ||
+ | |||
+ | margin-right: 30px; | ||
+ | } | ||
+ | |||
+ | |||
+ | ul.wtf-menu li{ | ||
+ | list-style: none; | ||
+ | float: left; | ||
+ | padding: 0px 0px; | ||
+ | margin: 0px 0px; | ||
+ | line-height: 65px; | ||
+ | display: block; | ||
+ | position: relative; | ||
+ | text-transform: uppercase; | ||
+ | } | ||
+ | |||
+ | ul.wtf-menu li a{ | ||
+ | color: #7F7F7F;; | ||
+ | text-decoration: none; | ||
+ | display:block; | ||
+ | |||
+ | |||
+ | padding: 0px 15px; | ||
+ | margin: 0px 0px; | ||
+ | display: block; | ||
+ | |||
+ | } | ||
+ | |||
+ | ul.wtf-menu li:hover, ul.wtf-menu li:hover >a{ | ||
+ | background-color /*:#E8292F*/: rgb(124,124,124); | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | ul.wtf-menu li.parent:hover:after { | ||
+ | color:white; | ||
+ | } | ||
+ | |||
+ | .wtf-menu ul.submenu{ | ||
+ | |||
+ | width: 200px; | ||
+ | padding: 0px 0px; | ||
+ | margin: 0px; | ||
+ | background: #fff; | ||
+ | position: absolute; | ||
+ | top:65px; | ||
+ | left:0px; | ||
+ | display:none; | ||
+ | |||
+ | /* Dropdown shadow */ | ||
+ | -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,.3); | ||
+ | box-shadow: 0 2px 2px 0 rgba(0,0,0,.3); | ||
+ | } | ||
+ | |||
+ | .wtf-menu li.main-item >a{ | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | .wtf-menu ul.submenu ul{ | ||
+ | left: 200px; | ||
+ | top:0px; | ||
+ | } | ||
+ | |||
+ | .wtf-menu ul.submenu li{ | ||
+ | padding: 0px; | ||
+ | margin: 0px; | ||
+ | display: block; | ||
+ | float: none; | ||
+ | border-bottom: 1px solid #eee; | ||
+ | line-height: 40px; | ||
+ | text-transform: none; | ||
+ | } | ||
+ | |||
+ | .wtf-menu ul.submenu li:last-child{ | ||
+ | border: none; | ||
+ | } | ||
+ | |||
+ | ul.wtf-menu ul li.parent:after { | ||
+ | font-family: 'Fontawesome'; | ||
+ | content: "\f0da"; | ||
+ | color: #999; | ||
+ | position: absolute; | ||
+ | right: 10px; | ||
+ | top: 0px; | ||
+ | margin-left: 5px; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | .wtf-menu li:hover > ul{ | ||
+ | display: block; | ||
+ | -moz-animation: zoomIn .3s ease-in; | ||
+ | -webkit-animation: zoomIn .3s ease-in ; | ||
+ | animation: zoomIn .3s ease-in; | ||
+ | |||
+ | } | ||
+ | |||
+ | .wtf-menu ul li:hover > ul{ | ||
+ | display:block; | ||
+ | -moz-animation: zoomIn .3s ease-in ; | ||
+ | -webkit-animation: zoomIn .3s ease-in ; | ||
+ | animation: zoomIn .3s ease-in; | ||
+ | } | ||
+ | |||
+ | .top-menu{ | ||
+ | background-color: rgb(94,94,94); color:white; | ||
+ | |||
+ | z-index: 2000; | ||
+ | position: fixed; | ||
+ | width: 100%; | ||
+ | padding-right: 30px; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | .top5{ | ||
+ | margin-top: 5px; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | #logoigem img{ | ||
+ | width:38px; | ||
+ | height:38px; | ||
+ | } | ||
+ | |||
+ | #home{ | ||
+ | margin-top: 2px; | ||
+ | margin-right: 10px; | ||
+ | |||
+ | |||
+ | width : 60px; | ||
+ | top : 0; | ||
+ | margin-left : 10px; | ||
+ | |||
+ | } | ||
+ | |||
+ | |||
+ | #logolist2 div { | ||
+ | margin-right: 20px; | ||
+ | width: 38px; | ||
+ | } | ||
+ | |||
+ | #logolist2{ | ||
+ | float: right; | ||
+ | display: flex; | ||
+ | |||
+ | width: 175px; | ||
+ | margin-top: -54px; | ||
+ | margin-right: 50px; | ||
+ | |||
+ | } | ||
+ | #logolist2 a{ | ||
+ | |||
+ | color: white; | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | #logolist2 a i { | ||
+ | font-size: 30px; | ||
+ | } | ||
+ | |||
+ | #mainpage { | ||
+ | float: left; | ||
} | } | ||
Line 498: | Line 698: | ||
<body> | <body> | ||
<div style="clear: both;"></div> | <div style="clear: both;"></div> | ||
− | <div id=menu> | + | |
+ | |||
+ | <nav class="row top-menu"> | ||
+ | <!--div class="col-md-4 home-link"><a href="index.html"><i class="fa fa-home fa-3" aria-hidden="true"></i></a></div--> | ||
+ | <div class="col-md-8"> | ||
+ | <a href="https://2017.igem.org/Team:Paris_Bettencourt" id="mainpage"><img id="home" src="https://static.igem.org/mediawiki/2017/a/a8/Logo_medusablancPB.png" class=" b-error"></a> | ||
+ | <ul class=" text-left wtf-menu "> | ||
+ | <li class="parent main-item"><a href="#">Project <i class="fa fa-caret-down" aria-hidden="true"></i></a> | ||
+ | <ul class="submenu"> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Overview">Overview</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Transmembrane_Proteins">Membrane Photoreceptor</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Proteins_Caging">Protein Caging</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Logic_Circuit">Logic Circuit</a></li> | ||
+ | <li class="parent"><a href="https://2017.igem.org/Team:Paris_Bettencourt/Biomaterials">Biomaterials</a> | ||
+ | <ul class="submenu"> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Biomaterials#header2">PHA</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Biomaterials#header3">Calcium Carbonate</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Biomaterials#header4">Polysilicate</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/RNA">RNA</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Hardware_setup">Gel Optics</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="parent main-item"><a href="https://2017.igem.org/Team:Paris_Bettencourt/Model">Modeling <i class="fa fa-caret-down" aria-hidden="true"></i></a> | ||
+ | <ul class="submenu"> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Model#firstmodel">Gel Optics</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Model#secondmodel">RNA</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Model#thirdmodel">Logic Circuit</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="parent main-item"><a href="#">Achievements <i class="fa fa-caret-down" aria-hidden="true"></i></a> | ||
+ | <ul class="submenu"> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Medal_Criteria">Medal Criteria</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Results">Results</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Contribution">Contributions</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="parent main-item"><a href="#">Human Practices <i class="fa fa-caret-down" aria-hidden="true"></i></a> | ||
+ | <ul class="submenu"> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/HP/Silver">Silver HP</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/HP/Gold_Integrated">Gold & Integrated HP</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Engagement">Public Engagement</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Safety">Safety</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="parent main-item"> | ||
+ | <a href="https://2017.igem.org/Team:Paris_Bettencourt/Lab_Notebook">Lab Book</a> | ||
+ | </li> | ||
+ | <li class="parent main-item"><a href="#">Parts <i class="fa fa-caret-down" aria-hidden="true"></i></a> | ||
+ | <ul class="submenu"> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Improve">Improved Part</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Basic_Part">Basics Parts</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Composite_Part">Composite Parts</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Part_Collection">Part Collection</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Parts">Parts</a></li> | ||
+ | |||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="parent main-item"><a href="#">Team <i class="fa fa-caret-down" aria-hidden="true"></i></a> | ||
+ | <ul class="submenu"> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Team">Team Members</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Collaborations">Collaborations</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Attributions">Attributions</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:Paris_Bettencourt/Sponsors">Sponsors</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | <div id="logolist2"> | ||
+ | <div id="logoigem" class="sidelogos"> | ||
+ | <a href="https://2017.igem.org/Main_Page" title="iGEM 2017" target="_blank"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/f/fd/Logo-iGEMPB.png" class=" b-error"> | ||
+ | </a> | ||
+ | </div> | ||
+ | <div class="sidelogos top5"> | ||
+ | <a href="http://twitter.com/iGEM_Paris" target="_blank"> | ||
+ | <i class="fa fa-twitter" aria-hidden="true"></i> | ||
+ | </a><div id="twitapp"><a href="http://twitter.com/iGEM_Paris" target="_blank"> | ||
+ | </a><a class="twitter-timeline" width="250" height="400" data-dnt="true" href="https://twitter.com/iGEM_Paris" data-widget-id="368144501119795201">@iGEM_Paris</a> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | <div class="sidelogos top5"> | ||
+ | <a href="https://www.facebook.com/ParisiGEM2017/" target="_blank"> | ||
+ | <i class="fa fa-facebook" aria-hidden="true"></i> | ||
+ | <div id="fbapp"> | ||
+ | <div class="fb-like-box" data-href="" 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 class="sidelogos top5 "> | ||
+ | <a href="https://www.instagram.com/igem_paris_bettencourt/" target="_blank"> | ||
+ | <i class="fa fa-instagram" aria-hidden="true"></i> | ||
+ | <div id="instaapp"> | ||
+ | <div class="" data-href="" 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> | ||
+ | |||
+ | </nav> | ||
+ | |||
+ | |||
+ | <!--div id=menu> | ||
<a href="https://2017.igem.org/Team:Paris_Bettencourt" id=mainpage><img id=home src="https://static.igem.org/mediawiki/2017/a/a8/Logo_medusablancPB.png"></a> | <a href="https://2017.igem.org/Team:Paris_Bettencourt" id=mainpage><img id=home src="https://static.igem.org/mediawiki/2017/a/a8/Logo_medusablancPB.png"></a> | ||
<ul class=menulist> | <ul class=menulist> | ||
Line 579: | Line 883: | ||
</div> | </div> | ||
</div> | </div> | ||
− | </div> | + | </div--> |
Latest revision as of 18:09, 12 December 2017