Difference between revisions of "Team:Pasteur Paris/TrainingThomas"

(Replaced content with "{{Pasteur_Paris/MenuBlock}}")
Line 1: Line 1:
 
+
{{Pasteur_Paris/MenuBlock}}
 
+
 
+
<html>
+
 
+
<style type="text/css">
+
 
+
 
+
#home_logo, #sideMenu { display:none; }
+
#sideMenu, #top_title, .patrollink  {display:none;}
+
#content { margin-left:0px; margin-top:-7px; padding:0px; width:100%;}
+
body {background-color:white; }
+
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
+
 
+
.judges-will-not-evaluate { border: 4px solid #e4dede; padding: 2% !important; width: 92%!important;}
+
 
+
 
+
*{
+
margin: 0;
+
padding: 0;
+
}
+
 
+
body {
+
padding-top: 30px;
+
}
+
 
+
#MenuIgem {
+
height: 18px;
+
background-color: black;
+
position: fixed;
+
top: 0%;
+
left: 0%;
+
width: 100%;
+
z-index: 2;
+
}
+
 
+
#Menu {
+
height: 70px;
+
 
+
position: fixed;
+
top: 18px;
+
left: 0%;
+
width: 100%;
+
z-index: 2;
+
border-bottom-left-radius: 15px;
+
border-bottom-right-radius: 15px;
+
}
+
 
+
#Menu img {
+
float: left;
+
height: 100%;
+
width: auto;
+
}
+
 
+
#Menu-mobile-bar {
+
display: none;
+
height: 50px;
+
background-color: pink;
+
position: fixed;
+
top: 18px;
+
left: 0%;
+
width: 100%;
+
z-index: 2;
+
border-bottom-left-radius: 5px;
+
border-bottom-right-radius: 5px;
+
}
+
 
+
#Menu-mobile-bar img {
+
float: left;
+
height: 100%;
+
width: auto;
+
}
+
 
+
 
+
#banner {
+
width: 100%;
+
height: 350px;
+
background-image: url("https://medicor.nu/wp-content/uploads/2015/11/igem3.jpg");
+
background-repeat: no-repeat;
+
background-attachment: fixed;
+
background-size: 100%;
+
}
+
 
+
#banner h1 {
+
text-align: center;
+
color: white;
+
padding-top: 250px;
+
}
+
 
+
 
+
#GeneralContent {
+
position:relative;
+
width: 100%;
+
 
+
}
+
 
+
#MainContent {
+
max-width: 1100px;
+
margin: auto;
+
padding-top: 10%;
+
padding-bottom: 10%;
+
text-align: center;
+
}
+
 
+
 
+
 
+
footer {
+
background-color: #303E91;
+
height: 70px;
+
width: 100%;
+
bottom: 0%;
+
left: 0%;
+
}
+
 
+
.block {
+
display: inline-block;
+
vertical-align: middle;
+
margin: auto;
+
margin-top: 2%;
+
margin-bottom: 2%;
+
}
+
 
+
.block.title {
+
width: 94%;
+
margin-bottom: 10%;
+
}
+
 
+
.block.two-third {
+
width: 60%;
+
}
+
 
+
.block.two-third.center {
+
width: 60%;
+
}
+
 
+
.block.one-third {
+
width: 30%;
+
}
+
 
+
.block.full {
+
width: 90%;
+
}
+
 
+
.block.separator {
+
height: 1px;
+
margin-top: 10%;
+
margin-bottom: 10%;
+
}
+
 
+
.block.separator-mark {
+
height: 2px;
+
width: 70%;
+
margin-top: 15%;
+
margin-bottom: 20%;
+
background-color: black;
+
opacity: 0.3;
+
}
+
 
+
.legend p {
+
text-indent: 0px;
+
font-size: 0.8em;
+
}
+
 
+
p {
+
text-align: justify;
+
text-indent: 30px;
+
}
+
 
+
img {
+
width: 100%;
+
}
+
 
+
a img:hover {
+
opacity: 0.4;
+
}
+
 
+
@media only screen and (max-width: 1000px) {
+
.block.two-third, .block.one-third {width: 44%; margin-left: 2%; margin-right: 2%;}
+
.block.two-third.center, .block.full, .block.separator, .block.title {width: 92%; margin-left: 4%; margin-right: 4%;}
+
#banner h1 {padding-top: 175px;}
+
}
+
 
+
@media only screen and (max-width: 500px) {
+
.block.two-third, .block.one-third, .block.two-third.center, .block.full, .block.separator, .block.title {width: 96%; margin-left: 2%; margin-right: 2%;}
+
#Menu {display:none;}
+
#Menu-mobile-bar{display: block;}
+
#banner h1 {padding-top: 100px;}
+
}
+
 
+
</style>
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
<style>
+
 
+
 
+
 
+
 
+
@media screen and (min-width: 911px){
+
 
+
#naviconwrapper {
+
height: 100%;
+
    margin: 0px ;    /*auto centers wrapper*/
+
    min-width: 900px;
+
    z-index: -100;
+
}
+
 
+
#naviconbar {
+
height: 100%;
+
    min-width: 900px;
+
    background-image:  linear-gradient(to right, rgb(168, 48, 91), rgb(161, 47, 92), rgb(128, 52, 110),rgb(84, 59, 126),rgb(52, 82, 146));
+
    z-index: -60;
+
    text-align: center;
+
}
+
   
+
 
+
/* ==== BEGIN: Settings Main Menu Icons ==== */
+
#navicons {
+
    width: 840px;
+
    background-color:  linear-gradient(to right, rgb(161, 47, 92), rgb(128, 52, 110),rgb(84, 59, 126));
+
    z-index: -20;    /*defines color behind icons */
+
    display: inline-block;
+
vertical-align: middle;
+
height: 100%;
+
}
+
 
+
#navicons ul {
+
margin: 0px;
+
height: 100%;
+
    width: 100%;
+
    position: relative;  /*makes chip go directly behind home from left corner*/
+
 
+
}
+
 
+
#navicons ul li {
+
    list-style: none;
+
    /*display: block;*/
+
    float: left;
+
    position: relative;
+
    font-family: sans-serif;
+
    font-size: 12px;
+
    background-color: rgba(161, 47, 92, 0.0);
+
    /*border: 1px solid #5781BD;*/
+
    z-index: 100;
+
    height: 90%;
+
}
+
 
+
#navicons ul li a {
+
 
+
    width: 120px;
+
    display: block;
+
    text-decoration: none;
+
    /*color: #FFF;*/
+
    text-align: center;
+
    text-transform: uppercase;
+
    z-index: 50;
+
    padding-top: 45%;
+
 
+
}
+
 
+
#navicons ul a:hover {
+
}     
+
/* ==== END: Settings Main Menu Icons ==== */
+
 
+
 
+
/* ==== classes for icons ==== */
+
#project {
+
    background: url(https://static.igem.org/mediawiki/2018/2/26/T--Pasteur_Paris--icon-neuroneblanc.png) no-repeat;
+
    height: 60px;
+
    background-position: center;
+
}
+
 
+
#project a {
+
    color: #ffffff;
+
}
+
 
+
#labwork {
+
    background: url(https://static.igem.org/mediawiki/2018/2/26/T--Pasteur_Paris--icon-neuroneblanc.png) no-repeat;
+
    height: 60px;
+
    background-position: center;
+
}
+
 
+
#labwork a {
+
    color: #ffffff;
+
}
+
 
+
#parts {
+
    background:url(https://static.igem.org/mediawiki/2018/2/26/T--Pasteur_Paris--icon-neuroneblanc.png) no-repeat;
+
    height: 60px;
+
    background-position: center;
+
}
+
 
+
#parts a {
+
    color: #ffffff;
+
}
+
 
+
#modelling {
+
    background:url(https://static.igem.org/mediawiki/2018/2/26/T--Pasteur_Paris--icon-neuroneblanc.png) no-repeat;
+
    height: 60px;
+
    background-position: center;
+
}
+
 
+
#modelling a {
+
    color: #ffffff;
+
}
+
 
+
#achievements {
+
    background:url(https://static.igem.org/mediawiki/2018/2/26/T--Pasteur_Paris--icon-neuroneblanc.png)no-repeat;
+
    height: 60px;
+
    background-position: center;
+
}
+
 
+
#achievements a {
+
    color: #ffffff;
+
}
+
 
+
#hp {
+
    background:url(https://static.igem.org/mediawiki/2018/2/26/T--Pasteur_Paris--icon-neuroneblanc.png) no-repeat;
+
    height: 60px;
+
    background-position: center;
+
}
+
 
+
#hp a {
+
    color: #ffffff;
+
}
+
 
+
#aboutus {
+
    background:url(https://static.igem.org/mediawiki/2018/2/26/T--Pasteur_Paris--icon-neuroneblanc.png) no-repeat;
+
    height: 60px;
+
    background-position: center;
+
}
+
 
+
#aboutus a {
+
    color: #ffffff;
+
}
+
/* ==== End classes for icons ==== */
+
 
+
/* ==== Begin running chip ==== */
+
/* == Begin Chip Design == */
+
#runningchip {
+
    position: absolute;
+
    width: 90px;
+
    height: 120%;
+
    left: 2.1%;
+
    -webkit-transition: all 300ms ease-out;
+
    -moz-transition: all 300ms ease-out;
+
    transition: all 300ms ease-out;
+
    z-index: 0;
+
  border-bottom-left-radius: 5px;
+
  border-bottom-right-radius: 5px;
+
  background: #000000;
+
}
+
 
+
/* == End Chip Design == */
+
 
+
 
+
/* == Begin Chip Movement == */
+
#project:hover ~ #runningchip {
+
    left: 15px;
+
}
+
 
+
#labwork:hover ~ #runningchip {
+
    left: 135px;
+
}
+
 
+
#parts:hover ~ #runningchip {
+
    left: 255px;
+
}
+
 
+
#modelling:hover ~ #runningchip {
+
    left: 375px;
+
}
+
 
+
#achievements:hover ~ #runningchip {
+
    left: 495px;
+
}
+
 
+
#hp:hover ~ #runningchip {
+
    left: 615px;
+
}
+
 
+
#aboutus:hover ~ #runningchip {
+
    left: 735px;
+
}
+
/* == End Chip Movment == */
+
/* ==== End running chip ==== */
+
 
+
 
+
/* ==== Begin Settings Submenu Level 1 ==== */
+
#navtextwrapper {                /*define background box*/
+
    margin: 0 auto;
+
    padding: 0px;
+
    top: -2px;
+
    height: 24px;
+
    width: 840px;
+
    position: relative;
+
    /*border: 2px solid #000;*/
+
}
+
 
+
#navtext {
+
    text-align: center;
+
    font-family: Roboto,sans-serif;
+
    font-size: 16px;
+
    z-index: 600;
+
}
+
 
+
#navtext ul {
+
    margin: 0px auto;
+
    top: -8px;
+
    padding: 0px;
+
    position: absolute;
+
    z-index: 600;
+
}
+
 
+
#navtext li {
+
    margin: 0px auto;        /*centers text*/
+
    list-style: none;
+
    display: block;        /*makes items go horizontal and centers them*/
+
    /*float: left;*/                /*makes items go horizontal*/
+
    position: relative;
+
    z-index: 600;
+
    height: 10px;
+
}   
+
 
+
#navtext ul li a {
+
    margin-top: 2px;
+
    height: 24px;
+
    padding-left: 10px;
+
    padding-right: 10px;
+
    text-decoration: none;
+
    color: #FFF;
+
    display: block;
+
    text-align: center;
+
    border-radius: 8px;
+
    z-index: 600;
+
}
+
 
+
#navtext ul li:hover > a {
+
  /* background-color: #6696c7;  /*makes a link stay in a certain color when hovering over it and then looking throught its subitems */
+
    color: #345292; /* couleur du sous titre quand tu passes dessus*/
+
}
+
 
+
#project-sub {
+
    display: none;
+
    left: -120px;
+
}
+
 
+
#labwork-sub {
+
    display: none;
+
    left: 0px;
+
}
+
 
+
#parts-sub {
+
    /*background-color: #ac34fe;*/
+
    display: none;
+
    left: 120px;
+
}
+
 
+
#modelling-sub{
+
    display: none;
+
    left: 240px;
+
}
+
 
+
#achievements-sub{
+
    display: none;
+
    left: 360px;
+
}
+
 
+
#hp-sub{
+
    display: none;
+
    left: 480px;
+
}
+
#aboutus-sub{
+
    display: none;
+
    left: 600px;
+
}
+
 
+
.chip_gap {
+
    content: none;
+
}
+
 
+
.navsub1 {
+
    background-color: #000000;
+
opacity: 1;
+
+
/* ==== End Settings Submenu Level 1 ==== */
+
 
+
#smallnav{
+
    display: none;
+
}
+
 
+
} /* end media query*/
+
 
+
@media screen and (max-width: 910px){
+
    #header{
+
        top: -9000px;
+
        opacity: 0;
+
    }
+
 
+
/* avoid space to content box */
+
    .content_background_wrapper{
+
        padding-top: 20px;
+
    }
+
 
+
}
+
 
+
/* Styles for smallnav */
+
 
+
/* Clearfix */
+
.clearfix:before,
+
.clearfix:after {
+
    content: " ";
+
    display: table;
+
}
+
.clearfix:after {
+
    clear: both;
+
}
+
.clearfix {
+
    *zoom: 1;
+
}
+
 
+
 
+
/* Basic Styles */
+
 
+
#smallnav {
+
    height: 40px;
+
    width: 100%;
+
    background: #0051A2;
+
    font-size: 11pt;
+
    font-family: 'PT Sans', Arial, sans-serif;
+
    font-weight: bold;
+
    position: fixed;
+
    border-bottom: 2px solid #CFCFCF;
+
    z-index: 3000;
+
    opacity: 0.9;
+
}
+
#smallnav ul {
+
    padding: 0;
+
    margin: 0 auto;
+
    width: 720px;
+
    height: 40px;
+
}
+
#smallnav li {
+
    display: inline;
+
    float: left;
+
}
+
#smallnav a {
+
    color: #fff;
+
    display: inline-block;
+
    width: 120px;
+
    text-align: center;
+
    text-decoration: none;
+
    line-height: 40px;
+
}
+
#smallnav li a {
+
    box-sizing:border-box;
+
    -moz-box-sizing:border-box;
+
    -webkit-box-sizing:border-box;
+
}
+
#smallnav li:last-child a {
+
    border-right: 0;
+
}
+
#smallnav a:hover, #smallnav a:active {
+
    background-color: #1D629F;
+
}
+
#smallnav a#pull {
+
    display: none;
+
}
+
 
+
/*Styles for screen 600px and lower*/
+
@media screen and (max-width: 720px) {
+
    #smallnav {
+
        height: auto;
+
        background: #3B7EBF;
+
    }
+
    #smallnav ul {
+
        width: 100%;
+
        display: block;
+
        height: auto;
+
    }
+
    #smallnav li {
+
        width: 50%;
+
        float: left;
+
        position: relative;
+
        margin-bottom: 0;
+
    }
+
 
+
    #smallnav a {
+
        text-align: left;
+
        width: 100%;
+
        text-indent: 25px;
+
    }
+
 
+
    #smallnav {
+
        border-bottom: 0;
+
    }
+
    #smallnav ul {
+
        display: none;
+
        height: auto;
+
    }
+
    #smallnav a#pull {
+
        display: block;
+
        background-color: #0051A2;
+
        width: 100%;
+
        position: relative;
+
    }
+
    #smallnav a#pull:after {
+
        content:"";
+
        background: url('https://static.igem.org/mediawiki/2015/e/e0/Freiburg_menu_button_white.png') no-repeat;
+
        background-size: auto 90%;
+
        width: 30px;
+
        height: 30px;
+
        display: inline-block;
+
        position: absolute;
+
        right: 15px;
+
        top: 5px;
+
    }
+
 
+
 
+
/* ==== classes for icons ==== */
+
#home_small {
+
    background-color: #3673AF;
+
 
+
}
+
 
+
#home_small a {
+
    background: url(https://static.igem.org/mediawiki/2015/1/15/Freiburg_icon_home_white_03.png) no-repeat;
+
    background-position: left;
+
    background-size: auto 100%;
+
    background-repeat: no-repeat;
+
    padding-left: 40px;
+
    color: #FFF;
+
}
+
 
+
#project_small {
+
    background-color: #3673AF;
+
 
+
}
+
 
+
#project_small a {
+
    background: url(https://static.igem.org/mediawiki/2015/7/76/Freiburg_icon_project_white_03.png) no-repeat;
+
    background-position: left;
+
    background-size: auto 90%;
+
    background-repeat: no-repeat;
+
    padding-left: 40px;
+
    color: #FFF;
+
}
+
 
+
#team_small {
+
    background-color: #3673AF;
+
 
+
}
+
 
+
#team_small a {
+
    background: url(https://static.igem.org/mediawiki/2015/4/42/Freiburg_icon_team_white_03.png) no-repeat;
+
    background-position: left;
+
    background-size: auto 90%;
+
    background-repeat: no-repeat;
+
    padding-left: 40px;
+
    color: #FFF;
+
}
+
 
+
#results_small {
+
    background-color: #3673AF;
+
 
+
}
+
 
+
#results_small a {
+
    background: url(https://static.igem.org/mediawiki/2015/1/1e/Freiburg_icon_results_white_03.png) no-repeat;
+
    background-position: left;
+
    background-size: auto 90%;
+
    background-repeat: no-repeat;
+
    padding-left: 40px;
+
    color: #FFF;
+
}
+
 
+
#policy_small {
+
    background-color: #3673AF;
+
}
+
 
+
#policy_small a {
+
    color: #FFF;
+
    padding-left: 40px;
+
    background-image: url(https://static.igem.org/mediawiki/2015/f/f9/Freiburg_icon_policy_white_03.png);
+
    background-position: left;
+
    background-size: auto 90%;
+
    background-repeat: no-repeat;
+
}
+
 
+
#notebook_small {
+
    background-color: #3673AF;
+
}
+
 
+
#notebook_small a {
+
    background: url(https://static.igem.org/mediawiki/2015/9/99/Freibur_icon_notebook_white_03.png) no-repeat;
+
    background-position: left;
+
    background-size: auto 90%;
+
    background-repeat: no-repeat;
+
    padding-left: 40px;
+
    color: #FFF;
+
}
+
/* ==== End classes for icons ==== */
+
 
+
 
+
}/* end media query
+
 
+
/*Smartphone*/
+
@media only screen and (max-width : 320px) {
+
    #smallnav li {
+
        display: block;
+
        float: none;
+
        width: 100%;
+
    }
+
}
+
 
+
</style>
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
<body>
+
 
+
<head>
+
<meta charset="UTF-8" name="Training" content="width=device-width">
+
<title>Training</title>
+
</head>
+
 
+
<header id="MenuIgem">
+
 
+
</header>
+
 
+
<header id="Menu">
+
<div id="naviconwrapper"> 
+
                <div id="naviconbar">
+
                    <a href="https://2018.igem.org/Team:Pasteur_Paris"><img src="https://static.igem.org/mediawiki/2018/3/39/T--Pasteur_Paris--teamlogoigemwhite_99x60.png"></a>
+
                <div id="navicons">
+
                    <ul>
+
                        <li id="project" ><a href="https://2018.igem.org/Team:Pasteur_Paris/Description">Project</a>
+
                        </li>
+
                        <li id="labwork"><a href="https://2018.igem.org/Team:Pasteur_Paris/Labwork">Labwork</a>
+
                        </li>
+
                        <li id="parts"><a href="https://2018.igem.org/Team:Pasteur_Paris/Parts">Parts</a>
+
                        </li>
+
                        <li id="modelling"><a href="https://2018.igem.org/Team:Pasteur_Paris/Model">Modelling</a>
+
                        </li>
+
                        <li id="achievements"><a href="https://2018.igem.org/Team:Pasteur_Paris/Achievements">Achievements</a>
+
                        </li>
+
                        <li id="hp"><a href="https://2018.igem.org/Team:Pasteur_Paris/Human_Practices">Human Practice</a>
+
                        </li>
+
                        <li id="aboutus"><a href="https://2018.igem.org/Team:Pasteur_Paris/Team">About Us</a>
+
                        </li>
+
                    <div id="runningchip">
+
                                <div id="top-arrow"></div>
+
                                <div id="runningchip-back"></div>
+
                    </div>
+
                    </ul>
+
                    <!-- Begin navigation submenu -->
+
            <div id="navtextwrapper"> <!-- only names of elements -->
+
                <div id="navtext">
+
                    <ul id="project-sub">
+
                        <li class="chip_gap"><a href="https://2018.igem.org/Team:Pasteur_Paris/Description"></a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Description">Description</a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Attributions">Infection</a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Partners">Conductivity</a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Design">Design</a></li>
+
                    </ul>
+
                    <ul id="labwork-sub">
+
                        <li class="chip_gap"><a href="https://2018.igem.org/Team:Pasteur_Paris/Labwork"></a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Experiments">Experiments</a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Demonstrate">Demonstrate</a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Notebook">Notebook</a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/InterLab">InterLab</a></li>
+
                    </ul>
+
                    <ul id="parts-sub">
+
                        <li class="chip_gap"><a href="https://2018.igem.org/Team:Pasteur_Paris/Parts"></a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Parts">Overview</a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Basic_Part">Basic Part</a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Composite_Part">Composite Part</a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Part_Collection">Part Collection</a></li>
+
                    </ul>
+
                    <ul id="modelling-sub">
+
                        <li class="chip_gap"><a href="https://2018.igem.org/Team:Pasteur_Paris/Model"></a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Model">Model</a></li>
+
                    </ul>
+
                    <ul id="achievements-sub">
+
                        <li class="chip_gap"><a href="https://2018.igem.org/Team:Pasteur_Paris/Achievements"></a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/MedalCriterias">Medals Criterias</a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Awards">Awards</a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Collaborations">Collaboration</a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Improve">Improve</a></li>
+
                    </ul>
+
                    <ul id="hp-sub">
+
                        <li class="chip_gap"><a href="https://2018.igem.org/Team:Pasteur_Paris/Human_Practices"></a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Human_Practices">Silver</a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Human_Practices">Gold & integrated HP</a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Public_Engagement">Education & Engagement</a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Safety">Safety</a></li>
+
                    </ul>
+
                    <ul id="aboutus-sub">
+
                        <li class="chip_gap"><a href="https://2018.igem.org/Team:Pasteur_Paris/Team"></a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Team">Team Members</a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Attributions">Attributions</a></li>
+
                        <li><a class="navsub1" href="https://2018.igem.org/Team:Pasteur_Paris/Sponsors">Sponsors</a></li>
+
                    </ul>
+
                </div>
+
            </div>   
+
<!-- End of navigation submenu -->
+
 
+
                </div>
+
                </div>
+
            </div>
+
<!-- End navigation menu icons -->
+
 
+
           
+
        </div>
+
 
+
<!-- End of header -->   
+
<!-- END: normal Menubar -->
+
 
+
 
+
<!-- BEGIN: Mobile Navigation -->
+
 
+
        <div class="clearfix" id="smallnav">
+
            <ul class="clearfix">
+
                <li id="home_small"><a href="https://2015.igem.org/Team:Freiburg/Home">Home</a></li>
+
                <li id="project_small"><a href="https://2015.igem.org/Team:Freiburg/Project/Overview">Project</a></li>
+
                <li id="results_small"><a href="https://2015.igem.org/Team:Freiburg/Results">Results</a></li>
+
                <li id="team_small"><a href="https://2015.igem.org/Team:Freiburg/Team">Team</a></li>
+
                <li id="policy_small"><a href="https://2015.igem.org/Team:Freiburg/Practices">Practice</a></li>
+
                <li id="notebook_small"><a href="https://2015.igem.org/Team:Freiburg/Notebook">Notebook</a></li> 
+
            </ul>
+
            <a href="#" id="pull">Menu</a>
+
        </div>
+
 
+
<!-- END: Mobile Navigation -->
+
</header>
+
 
+
<header id="Menu-mobile-bar">
+
<a href="https://2018.igem.org/Team:Pasteur_Paris"><img src="http://a398.idata.over-blog.com/3/29/19/90/rose-bleue.gif"></a>
+
</header>
+
 
+
<div id="banner">
+
<h1>ALL ABOUT FLOWERS</h1>
+
</div>
+
 
+
<div id="GeneralContent">
+
+
<div id="MainContent">
+
 
+
<div class="block title"><h1>FLOWERS, MY LIFE</h1>
+
</div>
+
 
+
<div class="block two-third">
+
<h3>I love flowers</h3>
+
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris mollis sollicitudin semper. Sed tempor vel leo at porta. Sed eleifend lacinia bibendum. Vestibulum tempor quam eget facilisis vehicula. Quisque in dolor justo. Morbi in erat sed nisi mattis molestie vitae vel leo. Mauris pellentesque aliquam nunc vitae finibus.</p>
+
</div>
+
 
+
<div class="block one-third">
+
<img src="https://media.centrakor.com/catalog/product/cache/image/800x800/0ee134d6d987b4a4dd752d2524c88dff/b/o/bouquet-deco-fleurs-rose-pale-h-35cm-294540_294540_DEB_WEB.jpg">
+
<div class="legend">
+
<p><b>Figure 1 : </b>Beautiful roses</p>
+
</div>
+
</div>
+
 
+
<div class="block separator">
+
</div>
+
 
+
 
+
 
+
<div class="block one-third">
+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris mollis sollicitudin semper. Sed tempor vel leo at porta. Sed eleifend lacinia bibendum. Vestibulum tempor quam eget facilisis vehicula. Quisque in dolor justo. Morbi in erat sed nisi mattis molestie vitae vel leo. Mauris pellentesque aliquam nunc vitae finibus. </p>
+
</div>
+
 
+
<div class="block two-third">
+
<a href=""><img src="http://www.chaussurezoo.com/media/catalog/product/cache/1/image/9df78eab33525d08d6e5fb8d27136e95/h/m/hmax313-1.jpg"></a>
+
<div class="legend">
+
<p><b>Figure 2 : </b>Flowers and shoes</p>
+
</div>
+
</div>
+
 
+
<div class=" block separator-mark">
+
</div>
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
<div class="block title"><h1>THERE ARE NOT ONLY FLOWERS IN LIFE </h1></div>
+
 
+
<div class="block two-third center">
+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris mollis sollicitudin semper. Sed tempor vel leo at porta. Sed eleifend lacinia bibendum. Vestibulum tempor quam eget facilisis vehicula. Quisque in dolor justo. Morbi in erat sed nisi mattis molestie vitae vel leo. Mauris pellentesque aliquam nunc vitae finibus.</p>
+
<p>Nulla ornare purus ac pharetra semper. Maecenas lacinia urna ac libero scelerisque pellentesque non non ipsum. Curabitur rhoncus quis nibh vestibulum gravida. Nulla consequat viverra tempus. Mauris faucibus, urna nec scelerisque malesuada, mi arcu mollis ipsum, quis euismod felis mauris et ligula. Suspendisse egestas aliquam arcu porta aliquet. Proin leo ligula, ultrices ac lacus ac, finibus lacinia turpis. Nunc at tortor sit amet risus molestie placerat. In accumsan vitae massa a molestie. Vestibulum fermentum hendrerit nulla, et maximus eros condimentum eget. Fusce volutpat lacinia velit, quis laoreet diam facilisis ut. Proin magna est, ornare in tincidunt in, feugiat et dolor. Vestibulum finibus sodales odio, nec posuere massa iaculis sit amet. Fusce non tempor diam. </p>
+
</div>
+
+
<div class="block full">
+
<img src="https://s1.qwant.com/thumbr/0x0/a/9/917c4d526cd2190f3b7282a82fbab21f4cc5dd9b862f810a29e3fb990e8478/Back-From-The-Edge-Best-Of-2016.jpg?u=http%3A%2F%2Fwww.naturephotographie.com%2Fwp-content%2Fuploads%2F2016%2F12%2FBack-From-The-Edge-Best-Of-2016.jpg&q=0&b=1&p=0&a=1">
+
<div class="legend">
+
<p><b>Figure 3 : </b>This is not a flower</p>
+
</div>
+
</div>
+
 
+
<div class="block separator"></div>
+
 
+
 
+
 
+
<div class="block two-third">
+
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris mollis sollicitudin semper. Sed tempor vel leo at porta. Sed eleifend lacinia bibendum. Vestibulum tempor quam eget facilisis vehicula. Quisque in dolor justo. Morbi in erat sed nisi mattis molestie vitae vel leo. Mauris pellentesque aliquam nunc vitae finibus.</p>
+
</div>
+
 
+
<div class="block one-third">
+
<img src="https://media.centrakor.com/catalog/product/cache/image/800x800/0ee134d6d987b4a4dd752d2524c88dff/b/o/bouquet-deco-fleurs-rose-pale-h-35cm-294540_294540_DEB_WEB.jpg">
+
<div class="legend">
+
<p><b>Figure 4 : </b>Okay, this is a flower</p>
+
</div>
+
</div>
+
 
+
<div class="block separator-mark"></div>
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
<div class="block title"><h1>REASONABLE ARGUMENTS FOR LOVING FLOWERS</h1></div>
+
 
+
 
+
<div class="block one-third">
+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris mollis sollicitudin semper. Sed tempor vel leo at porta. Sed eleifend lacinia bibendum. Vestibulum tempor quam eget facilisis vehicula. Quisque in dolor justo. Morbi in erat sed nisi mattis molestie vitae vel leo. Mauris pellentesque aliquam nunc vitae finibus. </p>
+
</div>
+
 
+
<div class="block two-third">
+
<img src="http://www.chaussurezoo.com/media/catalog/product/cache/1/image/9df78eab33525d08d6e5fb8d27136e95/h/m/hmax313-1.jpg">
+
<div class="legend">
+
<p><b>Figure 5 : </b>I already showed these, but I really like these shoes</p>
+
</div>
+
</div>
+
 
+
<div class="block separator"></div>
+
 
+
 
+
 
+
<div class="block one-third">
+
<img src="https://www150.statcan.gc.ca/n1/daily-quotidien/140221/cg140221a005-fra.gif">
+
<div class="legend">
+
<p><b>Figure 6 : </b>Flowers sells and benefits, period 2000-2018</p>
+
</div>
+
</div>
+
 
+
<div class="block one-third">
+
<img src="https://www150.statcan.gc.ca/n1/daily-quotidien/140221/cg140221a005-fra.gif">
+
<div class="legend">
+
<p><b>Figure 7 : </b>Shoes sells and benefits, period 2000-2018</p>
+
</div>
+
</div>
+
 
+
<div class="block one-third">
+
<img src="https://www150.statcan.gc.ca/n1/daily-quotidien/140221/cg140221a005-fra.gif">
+
<div class="legend">
+
<p><b>Figure 8 : </b>This one is just a random chart</p>
+
</div>
+
</div>
+
 
+
<div class="block separator"></div>
+
 
+
 
+
 
+
<div class="block one-third">
+
<h4>I</h4>
+
<p>
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris mollis sollicitudin semper. Sed tempor vel leo at porta. Sed eleifend lacinia bibendum. Vestibulum tempor quam eget facilisis vehicula. Quisque in dolor justo.
+
</p>
+
</div>
+
 
+
<div class="block one-third">
+
<h4>Love</h4>
+
<p>
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris mollis sollicitudin semper. Sed tempor vel leo at porta. Sed eleifend lacinia bibendum. Vestibulum tempor quam eget facilisis vehicula. Quisque in dolor justo.
+
</p>
+
</div>
+
 
+
<div class="block one-third">
+
<h4>Flowers</h4>
+
<p>
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris mollis sollicitudin semper. Sed tempor vel leo at porta. Sed eleifend lacinia bibendum. Vestibulum tempor quam eget facilisis vehicula. Quisque in dolor justo.
+
</p>
+
</div>
+
 
+
<div class="block separator-mark"></div>
+
 
+
 
+
 
+
<div class="block two-third">
+
<img src="http://www.chaussurezoo.com/media/catalog/product/cache/1/image/9df78eab33525d08d6e5fb8d27136e95/h/m/hmax313-1.jpg">
+
<div class="legend">
+
<p><b>Figure 9 : </b>I'm lovin' it</p>
+
</div>
+
</div>
+
 
+
<div class="block separator-mark"></div>
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
<div class="block title"><h1>Références</h1></div>
+
 
+
<div class="block full">
+
<p>1. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris mollis sollicitudin semper. Sed tempor vel leo at porta.</p>
+
<p>2. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris mollis sollicitudin semper. Sed tempor vel leo at porta.</p>
+
<p>3. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris mollis sollicitudin semper. Sed tempor vel leo at porta.</p>
+
<p>4. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris mollis sollicitudin semper. Sed tempor vel leo at porta.</p>
+
<p>5. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris mollis sollicitudin semper. Sed tempor vel leo at porta.</p>
+
</div>
+
 
+
 
+
</div>
+
 
+
+
</div>
+
 
+
<footer>
+
</footer>
+
 
+
</body>
+
 
+
 
+
 
+
 
+
<script>
+
// FOR SMALLNAV
+
    $(function() {
+
        var pull        = $('#pull');
+
            menu        = $('#smallnav ul');
+
            menuHeight  = menu.height();
+
 
+
        $(pull).on('click', function(e) {
+
            e.preventDefault();
+
            menu.slideToggle();
+
        });
+
 
+
        $(window).resize(function(){
+
            var w = $(window).width();
+
            if(w > 320) {
+
                if (menu.is(':hidden')) {
+
                menu.removeAttr('style');
+
                }
+
            }
+
        });
+
    });
+
</script>
+
 
+
<script type="text/javascript">
+
        $(document).ready(function(){
+
// make submenus appear //
+
            $("#project").hover(function(){
+
                $("#project-sub") .show();
+
                $("#parts-sub") .hide();
+
                $("#labwork-sub") .hide();
+
                $("#modelling-sub") .hide();
+
                $("#achievements-sub") .hide();
+
                $("#hp-sub") .hide();
+
                $("#aboutus-sub") .hide();
+
            },
+
                                    function(){
+
                $("#project-sub") .hide();
+
            });
+
            $("#labwork").hover(function(){
+
                $("#labwork-sub") .show();
+
                $("#project-sub") .hide();
+
                $("#parts-sub") .hide();
+
                $("#modelling-sub") .hide();
+
                $("#achievements-sub") .hide();
+
                $("#hp-sub") .hide();
+
                $("#aboutus-sub") .hide();
+
            },
+
                                    function(){
+
                $("#labwork-sub") .hide();
+
            });
+
           
+
            $("#parts").hover(function(){
+
                $("#parts-sub") .show();
+
                $("#project-sub") .hide();
+
                $("#labwork-sub") .hide();
+
                $("#modelling-sub") .hide();
+
                $("#achievements-sub") .hide();
+
                $("#hp-sub") .hide();
+
                $("#aboutus-sub") .hide();
+
            },
+
                                    function(){
+
                $("#parts-sub") .hide();
+
            });
+
           
+
            $("#modelling").hover(function(){
+
                $("#modelling-sub") .show();
+
                $("#project-sub") .hide();
+
                $("#parts-sub") .hide();
+
                $("#labwork-sub") .hide();
+
                $("#achievements-sub") .hide();
+
                $("#hp-sub") .hide();
+
                $("#aboutus-sub") .hide();
+
            });
+
           
+
            $("#achievements").hover(function(){
+
                $("#achievements-sub") .show();
+
                $("#project-sub") .hide();
+
                $("#parts-sub") .hide();
+
                $("#labwork-sub") .hide();
+
                $("#modelling-sub") .hide();
+
                $("#hp-sub") .hide();
+
                $("#aboutus-sub") .hide();
+
            },
+
                                    function(){
+
                $("#achievements-sub") .hide();
+
            });
+
           
+
            $("#hp").hover(function(){
+
                $("#hp-sub") .show();
+
                $("#project-sub") .hide();
+
                $("#parts-sub") .hide();
+
                $("#labwork-sub") .hide();
+
                $("#modelling-sub") .hide();
+
                $("#achievements-sub") .hide();
+
                $("#aboutus-sub") .hide();
+
            },
+
                                    function(){
+
                $("#hp-sub") .hide();
+
            });
+
 
+
            $("#aboutus").hover(function(){
+
                $("#aboutus-sub") .show();
+
                $("#project-sub") .hide();
+
                $("#parts-sub") .hide();
+
                $("#labwork-sub") .hide();
+
                $("#modelling-sub") .hide();
+
                $("#achievements-sub") .hide();
+
                $("#hp-sub") .hide();
+
            },
+
                                    function(){
+
                $("#aboutus-sub") .hide();
+
            });
+
// make chip stay over main menu point when its submenu appears and makes the submenu stay visible//
+
            $("#project-sub") .hover(function(){
+
                $("#runningchip") .css('left','15px');
+
                $("#project-sub") .show();
+
            },
+
                                    function(){
+
                $("#runningchip") .css('right','');
+
                $("#project-sub") .hide();
+
            });
+
            $("#labwork-sub") .hover(function(){
+
                $("#runningchip") .css('left','135px');
+
                $("#labwork-sub") .show();
+
            },
+
                                    function(){
+
                $("#runningchip") .css('left','');
+
                $("#labwork-sub") .hide();
+
            });
+
            $("#parts-sub") .hover(function(){
+
                $("#runningchip") .css('left','255px');
+
                $("#parts-sub") .show();
+
            },
+
                                    function(){
+
                $("#runningchip") .css('left','');
+
                $("#parts-sub") .hide();
+
            });
+
            $("#modelling-sub") .hover(function(){
+
                $("#runningchip") .css('left','375px');
+
                $("#modelling-sub") .show();
+
            },
+
                                    function(){
+
                $("#runningchip") .css('left','');
+
                $("#modelling-sub") .hide();
+
            });
+
            $("#achievements-sub") .hover(function(){
+
                $("#runningchip") .css('left','495px');
+
                $("#achievements-sub") .show();
+
            },
+
                                    function(){
+
                $("#runningchip") .css('left','');
+
                $("#achievements-sub") .hide();
+
            });
+
            $("#hp-sub") .hover(function(){
+
                $("#runningchip") .css('left','615px');
+
                $("#hp-sub") .show();
+
            },
+
                                    function(){
+
                $("#runningchip") .css('left','');
+
                $("#hp-sub") .hide();
+
            });
+
 
+
            $("#aboutus-sub") .hover(function(){
+
                $("#runningchip") .css('left','735px');
+
                $("#aboutus-sub") .show();
+
            },
+
                                    function(){
+
                $("#runningchip") .css('left','');
+
                $("#aboutus-sub") .hide();
+
            });
+
        });
+
</script>
+
 
+
 
+
 
+
 
+
<!-- END: jQuery -->
+
 
+
 
+
 
+
 
+
</html>
+

Revision as of 12:43, 16 August 2018

""