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

(Undo revision 103013 by ThomasStarck (talk))
Line 1: Line 1:
−
{{Pasteur_Paris/Fonts}}
+
{{Pasteur_Paris/MenuBlock}}
−
<!--doctype html-->
+
 
<html>
 
<html>
−
    <head>
+
<style type="text/css">
−
        <title>""</title>
+
#runningchip {
−
        <meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+
left: 125px;
−
    </head>
+
}
−
    <style>
+
#project_small {
−
        /* BEGIN : Default Wiki Settings */
+
background-color: #292929;
−
            #home_logo, #sideMenu { display:none; }
+
}
−
            #sideMenu, #top_title, .patrollink  {display:none;}
+
#banner {
−
            #content { margin-left:0px; margin-top:-7px; padding:0px; width:100%;}
+
background-image: ;
−
            body {background-color:white; }
+
}
−
            #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
+
</style>
−
            .judges-will-not-evaluate { border: 4px solid #e4dede; padding: 2% !important; width: 92%!important;};
+
<div id="banner">
−
        /* END : Default Wiki Settings */
+
<h1>PROJECT</h1>
−
        *{
+
</div>
−
            margin: 0;
+
<div id="GeneralContent">
−
            padding: 0;
+
<div id="MainContent">
−
        }
+
<a href="">
−
        body {
+
<div class="block half onglet">
−
            padding-top: 70px;
+
<div class="ongletImg" style="background-image: url(http://selection.readersdigest.ca/wp-content/uploads/2016/03/dites-je-t-aime-avec-fleurs.jpg);">
−
            font-family: 'Raleway', Arial Black, sans-serif;
+
</div>
−
        }
+
<div class= "textOnglet">
−
        /* BEGIN : Menu Bar Settings */
+
<h1>DescriptionW</h1>
−
            /* BEGIN : General Settings of Menu Bar */
+
</div>
−
                /* BEGIN: Settings Menu Containers and List */
+
</div>
−
                    #Menu {
+
</a>
−
                        opacity: .95;
+
<a href="">
−
                        height: 70px;
+
<div class="block half onglet">
−
                        position: fixed;
+
<div class="ongletImg" style="background-image: url(http://selection.readersdigest.ca/wp-content/uploads/2016/03/dites-je-t-aime-avec-fleurs.jpg);">
−
                        top: 18px;
+
</div>
−
                        left: 0%;
+
<div class= "textOnglet">
−
                        width: 100%;
+
<h1>Infection</h1>
−
                        z-index: 2;
+
</div>
−
                        border-bottom-left-radius: 15px;
+
</div>
−
                        border-bottom-right-radius: 15px;
+
<a href="">
−
                        z-index: 3000;
+
</a>
−
                    }
+
<div class="block half onglet">
−
                    #Menu img {
+
<div class="ongletImg" style="background-image: url(http://selection.readersdigest.ca/wp-content/uploads/2016/03/dites-je-t-aime-avec-fleurs.jpg);">
−
                        float: left;
+
</div>
−
                        height: 100%;
+
<div class= "textOnglet">
−
                        width: auto;
+
<h1>Conductivity</h1>
−
                    }
+
</div>
−
                    #naviconwrapper {
+
</div>
−
                        height: 100%;
+
<a href="">
−
                        margin: 0px ;    /*auto centers wrapper*/
+
<div class="block half onglet">
−
                        min-width: 900px;
+
<div class="ongletImg" style="background-image: url(http://selection.readersdigest.ca/wp-content/uploads/2016/03/dites-je-t-aime-avec-fleurs.jpg);">
−
                        z-index: -100;
+
</div>
−
                    }
+
<div class= "textOnglet">
−
                    #naviconbar {
+
<h1>Design</h1>
−
                        height: 100%;
+
</div>
−
                        min-width: 900px;
+
</div>
−
                        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));
+
</a>
−
                        z-index: -60;
+
</div>
−
                        text-align: center;
+
</div>
−
                    }
+
−
                    #navicons {
+
−
                        width: 960px;
+
−
                        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 {
+
−
                        padding: 0px;
+
−
                        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: 'Raleway', 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 Menu Containers and List */
+
−
                /* BEGIN : Classes for Main Menu Icons */
+
−
                    #home {
+
−
                        background: url(https://static.igem.org/mediawiki/2018/3/39/T--Pasteur_Paris--teamlogoigemwhite_99x60.png) no-repeat;
+
−
                        height: 60px;
+
−
                        background-position: center;
+
−
                    }
+
−
                    #home a {
+
−
                        color: #ffffff;
+
−
                    }
+
−
                    #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;
+
−
                    }
+
−
                    #modeling {
+
−
                        background:url(https://static.igem.org/mediawiki/2018/2/26/T--Pasteur_Paris--icon-neuroneblanc.png) no-repeat;
+
−
                        height: 60px;
+
−
                        background-position: center;
+
−
                    }
+
−
                    #modeling 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 Main Menu Icons */
+
−
                /* BEGIN : Running Chip Settings */
+
−
                    /* Begin Chip Design */
+
−
                        #runningchip {
+
−
                            position: absolute;
+
−
                            width: 110px;
+
−
                            height: 120%;
+
−
                            left: 5px;
+
−
                            -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 */
+
−
                        #home:hover ~ #runningchip {
+
−
                            left: 5px;
+
−
                        }
+
−
                        #project:hover ~ #runningchip {
+
−
                            left: 125px;
+
−
                        }
+
−
                        #labwork:hover ~ #runningchip {
+
−
                            left: 245px;
+
−
                        }
+
−
                        #parts:hover ~ #runningchip {
+
−
                            left: 365px;
+
−
                        }
+
−
                        #modeling:hover ~ #runningchip {
+
−
                            left: 485px;
+
−
                        }
+
−
                        #achievements:hover ~ #runningchip {
+
−
                            left: 605px;
+
−
                        }
+
−
                        #hp:hover ~ #runningchip {
+
−
                            left: 725px;
+
−
                        }
+
−
                        #aboutus:hover ~ #runningchip {
+
−
                            left: 845px;
+
−
                        }
+
−
                    /* End Chip Movment */
+
−
                /* END : Running Chip Settings */
+
−
                /* 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: 'Raleway',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;
+
−
                    }   
+
−
                    #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: 64.5px;
+
−
                    }
+
−
                    #labwork-sub {
+
−
                        display: none;
+
−
                        left: 183px;
+
−
                    }
+
−
                    #parts-sub {
+
−
                        /*background-color: #ac34fe;*/
+
−
                        display: none;
+
−
                        left: 292.5px;
+
−
                    }
+
−
                    #modeling-sub{
+
−
                        display: none;
+
−
                        left: 445.5px;
+
−
                    }
+
−
                    #achievements-sub{
+
−
                        display: none;
+
−
                        left: 532.5px;
+
−
                    }
+
−
                    #hp-sub{
+
−
                        display: none;
+
−
                        left: 618.5px;
+
−
                    }
+
−
                    #aboutus-sub{
+
−
                        display: none;
+
−
                        left: 788.5px;
+
−
                    }
+
−
                    .chip_gap {
+
−
                        content: none;
+
−
                    }
+
−
                    .navsub1 {
+
−
                        background-color: #000000;
+
−
                    opacity: 1;
+
−
                    } 
+
−
                /* END : Settings Submenu Level 1 */
+
−
            /* END : General Settings of Menu Bar */
+
−
            /* BEGIN 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-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));
+
−
                    font-size: 11pt;
+
−
                    font-family: 'Raleway', Arial, sans-serif;
+
−
                    position: fixed;
+
−
                    top: 18px;
+
−
                    left: 0%;
+
−
                    z-index: 3000;
+
−
                    opacity: 0.9;
+
−
                }
+
−
                #smallnav ul {
+
−
                    padding: 0;
+
−
                    margin: 0 auto;
+
−
                    width: 770px;
+
−
                    height: 40px;
+
−
                }
+
−
                #smallnav li {
+
−
                    display: inline;
+
−
                    float: left;
+
−
                }
+
−
                #smallnav a {
+
−
                    color: #ffffff;
+
−
                    display: inline-block;
+
−
                    width: 110px;
+
−
                    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: #000000;
+
−
                }
+
−
                #smallnav a#pull {
+
−
                    display: none;
+
−
                }
+
−
            /* END Styles for smallnav*/
+
−
        /* END : Menu Bar Settings */
+
−
        /* BEGIN : Content blocks settings */
+
−
            #banner {
+
−
                width: 100%;
+
−
                height: 70vh;
+
−
                background-image: url("https://medicor.nu/wp-content/uploads/2015/11/igem3.jpg");
+
−
                background-repeat: no-repeat;
+
−
                background-attachment: fixed;
+
−
                background-size: cover;
+
−
                background-position: 50% 50%;
+
−
            }
+
−
            #banner h1 {
+
−
                text-align: center;
+
−
                color: white;
+
−
                padding-top: 40vh;
+
−
                font-size: 15vh;
+
−
                line-height: 15vh;
+
−
            }
+
−
            #GeneralContent {
+
−
                position:relative;
+
−
                width: 100%;
+
−
                background-color: #fffafc;
+
−
            }
+
−
            #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%;
+
−
                margin-left: 1%;
+
−
                margin-right: 1%;
+
−
            }
+
−
            .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.half {
+
−
                width: 45%;
+
−
            }
+
−
            .block.separator {
+
−
                height: 1px;
+
−
                width: 90%;
+
−
                margin-top: 3%;
+
−
                margin-bottom: 3%;
+
−
            }
+
−
            .block.separator-invisible {
+
−
                height: 1px;
+
−
                width: 90%;
+
−
            }
+
−
            .block.separator-mark {
+
−
                height: 2px;
+
−
                width: 70%;
+
−
                margin-top: 15%;
+
−
                margin-bottom: 20%;
+
−
                background-color: black;
+
−
                opacity: 0.3;
+
−
            }
+
−
            .onglet{
+
−
                position: relative;
+
−
                border-radius: 20px;
+
−
                background-color: red;
+
−
                width: 43%;
+
−
                box-shadow: 5px 5px 30px grey;
+
−
                background-color: #fffafc;
+
−
            }
+
−
            .onglet:hover{
+
−
                opacity: .8;
+
−
                transform: scale(1.05,1.05);
+
−
            }
+
−
            .ongletImg {
+
−
                width: 100%;
+
−
                padding-top: 60%;
+
−
                background-repeat: no-repeat;
+
−
                background-size: cover;
+
−
                background-position: center;
+
−
                border-top-left-radius: 20px;
+
−
                border-top-right-radius: 20px;
+
−
            }
+
−
            .textOnglet{
+
−
                height: 50px;
+
−
            }
+
−
            .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;
+
−
            }
+
−
        /* END : Content block settings */
+
−
        /* BEGIN : Media Query Responsive Design */
+
−
            /* BEGIN : Style for large screens above 950 */
+
−
            @media screen and (min-width: 951px){
+
−
                #smallnav{
+
−
                    display: none;
+
−
                }
+
−
            }/* END : Style for large screens above 950 */
+
−
            /* BEGIN : Style for screens 950 and lower */
+
−
            @media screen and (max-width: 950px){
+
−
                #Menu{
+
−
                    top: -9000px;
+
−
                    opacity: 0;
+
−
                }
+
−
                /* avoid space to content box */
+
−
                .content_background_wrapper{
+
−
                    padding-top: 20px;
+
−
                }
+
−
                .block.two-third, .block.one-third, .block.half {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%;}
+
−
                body {padding-top: 40px;}
+
−
            }/* END : Style for screens 950 and lower */
+
−
            /* BEGIN : Style for screen 760 and lower */
+
−
            @media screen and (max-width: 760px) {
+
−
                #smallnav {
+
−
                    height: auto;
+
−
                    background: #ffffff;
+
−
                }
+
−
                #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-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));
+
−
                    width: 100%;
+
−
                    position: relative;
+
−
                }
+
−
                #smallnav a#pull:after {
+
−
                    content:"";
+
−
                    background: url('') no-repeat;
+
−
                    background-size: auto 90%;
+
−
                    width: 30px;
+
−
                    height: 30px;
+
−
                    display: inline-block;
+
−
                    position: absolute;
+
−
                    right: 15px;
+
−
                    top: 5px;
+
−
                }
+
−
                /* BEGINclasses for icons */
+
−
                    #home_small {
+
−
                        background-color: #345292;
+
−
                    }
+
−
                    #home_small a {
+
−
                        background: url(https://static.igem.org/mediawiki/2018/7/7b/T--Pasteur_Paris--icon-neuroneblanc_43x44.png) no-repeat;
+
−
                        background-position: left;
+
−
                        background-size: auto 100%;
+
−
                        background-repeat: no-repeat;
+
−
                        padding-left: 40px;
+
−
                        color: #FFF;
+
−
                    }
+
−
                    #project_small {
+
−
                        background-color: #345292;
+
−
                    }
+
−
                    #project_small a {
+
−
                        background: url(https://static.igem.org/mediawiki/2018/7/7b/T--Pasteur_Paris--icon-neuroneblanc_43x44.png) no-repeat;
+
−
                        background-position: left;
+
−
                        background-size: auto 90%;
+
−
                        background-repeat: no-repeat;
+
−
                        padding-left: 40px;
+
−
                        color: #FFF;
+
−
                    }
+
−
                    #labwork_small {
+
−
                        background-color:#345292;
+
−
                    }
+
−
                    #labwork_small a {
+
−
                        background: url(https://static.igem.org/mediawiki/2018/7/7b/T--Pasteur_Paris--icon-neuroneblanc_43x44.png) no-repeat;
+
−
                        background-position: left;
+
−
                        background-size: auto 90%;
+
−
                        background-repeat: no-repeat;
+
−
                        padding-left: 40px;
+
−
                        color: #FFF;
+
−
                    }
+
−
                    #parts_small {
+
−
                        background-color: #345292;
+
−
                    }
+
−
                    #parts_small a {
+
−
                        background: url(https://static.igem.org/mediawiki/2018/7/7b/T--Pasteur_Paris--icon-neuroneblanc_43x44.png) no-repeat;
+
−
                        background-position: left;
+
−
                        background-size: auto 90%;
+
−
                        background-repeat: no-repeat;
+
−
                        padding-left: 40px;
+
−
                        color: #FFF;
+
−
                    }
+
−
                    #modeling_small {
+
−
                        background-color: #345292;
+
−
                    }
+
−
                    #modeling_small a {
+
−
                        color: #FFF;
+
−
                        padding-left: 40px;
+
−
                        background-image: url(https://static.igem.org/mediawiki/2018/7/7b/T--Pasteur_Paris--icon-neuroneblanc_43x44.png);
+
−
                        background-position: left;
+
−
                        background-size: auto 90%;
+
−
                        background-repeat: no-repeat;
+
−
                    }
+
−
                    #achievements_small {
+
−
                        background-color: #345292;
+
−
                    }
+
−
                    #achievements_small a {
+
−
                        color: #FFF;
+
−
                        padding-left: 40px;
+
−
                        background-image: url(https://static.igem.org/mediawiki/2018/7/7b/T--Pasteur_Paris--icon-neuroneblanc_43x44.png);
+
−
                        background-position: left;
+
−
                        background-size: auto 90%;
+
−
                        background-repeat: no-repeat;
+
−
                    }
+
−
                    #hp_small {
+
−
                        background-color: #345292;
+
−
                    }
+
−
                    #hp_small a {
+
−
                        color: #FFF;
+
−
                        padding-left: 40px;
+
−
                        background-image: url(https://static.igem.org/mediawiki/2018/7/7b/T--Pasteur_Paris--icon-neuroneblanc_43x44.png);
+
−
                        background-position: left;
+
−
                        background-size: auto 90%;
+
−
                        background-repeat: no-repeat;
+
−
                    }
+
−
                    #aboutus_small {
+
−
                        background-color: #345292;
+
−
                    }
+
−
                    #aboutus_small a {
+
−
                        background: url(https://static.igem.org/mediawiki/2018/7/7b/T--Pasteur_Paris--icon-neuroneblanc_43x44.png) no-repeat;
+
−
                        background-position: left;
+
−
                        background-size: auto 90%;
+
−
                        background-repeat: no-repeat;
+
−
                        padding-left: 40px;
+
−
                        color: #FFF;
+
−
                    }
+
−
                /* END classes for icons */
+
−
                .block.two-third, .block.one-third, .block.two-third.center, .block.full, .block.separator, .block.title, .block.half {width: 96%; margin-left: 2%; margin-right: 2%; max-width: 495px;}
+
−
                #Menu {display:none;}
+
−
                body {padding-top: 40px;}
+
−
            }/* END : Style for screen 760 and lower */
+
−
            /* BEGIN : Style for Smartphones 320 and lower*/
+
−
            @media only screen and (max-width : 320px) {
+
−
                #smallnav li {
+
−
                    display: block;
+
−
                    float: none;
+
−
                    width: 100%;
+
−
                }
+
−
            }/* END : Style for Smartphones 320 and lower*/
+
−
        /* END : Media query Responsive Design */
+
−
    </style>
+
−
    <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 //
+
−
                $("#home").hover(function(){
+
−
                    $("#project-sub") .hide();
+
−
                    $("#parts-sub") .hide();
+
−
                    $("#labwork-sub") .hide();
+
−
                    $("#modeling-sub") .hide();
+
−
                    $("#achievements-sub") .hide();
+
−
                    $("#hp-sub") .hide();
+
−
                    $("#aboutus-sub") .hide();
+
−
                });
+
−
                $("#project").hover(function(){
+
−
                    $("#project-sub") .show();
+
−
                    $("#labwork-sub") .hide();
+
−
                    $("#parts-sub") .hide();
+
−
                    $("#modeling-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();
+
−
                    $("#modeling-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();
+
−
                    $("#modeling-sub") .hide();
+
−
                    $("#achievements-sub") .hide();
+
−
                    $("#hp-sub") .hide();
+
−
                    $("#aboutus-sub") .hide();
+
−
                },
+
−
                                        function(){
+
−
                    $("#parts-sub") .hide();
+
−
                });
+
−
               
+
−
                $("#modeling").hover(function(){
+
−
                    $("#modeling-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();
+
−
                    $("#modeling-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();
+
−
                    $("#modeling-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();
+
−
                    $("#modeling-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','125px');
+
−
                    $("#project-sub") .show();
+
−
                },
+
−
                                        function(){
+
−
                    $("#runningchip") .css('left','');
+
−
                    $("#project-sub") .hide();
+
−
                });
+
−
                $("#labwork-sub") .hover(function(){
+
−
                    $("#runningchip") .css('left','245px');
+
−
                    $("#labwork-sub") .show();
+
−
                },
+
−
                                        function(){
+
−
                    $("#runningchip") .css('left','');
+
−
                    $("#labwork-sub") .hide();
+
−
                });
+
−
                $("#parts-sub") .hover(function(){
+
−
                    $("#runningchip") .css('left','365px');
+
−
                    $("#parts-sub") .show();
+
−
                },
+
−
                                        function(){
+
−
                    $("#runningchip") .css('left','');
+
−
                    $("#parts-sub") .hide();
+
−
                });
+
−
                $("#modeling-sub") .hover(function(){
+
−
                    $("#runningchip") .css('left','485px');
+
−
                    $("#modeling-sub") .show();
+
−
                },
+
−
                                        function(){
+
−
                    $("#runningchip") .css('left','');
+
−
                    $("#modeling-sub") .hide();
+
−
                });
+
−
                $("#achievements-sub") .hover(function(){
+
−
                    $("#runningchip") .css('left','605px');
+
−
                    $("#achievements-sub") .show();
+
−
                },
+
−
                                        function(){
+
−
                    $("#runningchip") .css('left','');
+
−
                    $("#achievements-sub") .hide();
+
−
                });
+
−
                $("#hp-sub") .hover(function(){
+
−
                    $("#runningchip") .css('left','725px');
+
−
                    $("#hp-sub") .show();
+
−
                },
+
−
                                        function(){
+
−
                    $("#runningchip") .css('left','');
+
−
                    $("#hp-sub") .hide();
+
−
                });
+
−
                $("#aboutus-sub") .hover(function(){
+
−
                    $("#runningchip") .css('left','845px');
+
−
                    $("#aboutus-sub") .show();
+
−
                },
+
−
                                        function(){
+
−
                    $("#runningchip") .css('left','');
+
−
                    $("#aboutus-sub") .hide();
+
−
                });
+
−
            });
+
−
    </script>
+
−
    <script>
+
−
        /*Attachable menu code*/
+
−
        $( document ).ready(function() {
+
−
       
+
−
            $(window).scroll(function (event) {
+
−
                var y = $(this).scrollTop();
+
−
                if(y>60){
+
−
                    $("#header").css('position','fixed');
+
−
                    $("#header").css('width','100%');
+
−
                    $("#header").css('margin-top','-61px');
+
−
                    $("#bottom-arrow").css('display','none');
+
−
                    $("#runningchip-back").css('display','none');
+
−
                    $("#navtext").css('margin-top','-20px');
+
−
                    $(".chip_gap").css('height','30px');
+
−
                }else{
+
−
                    var offsetTop = -y;
+
−
                    $("#header").css('margin-top',offsetTop+'px');
+
−
                    $("#bottom-arrow").removeAttr('style');
+
−
                    $("#runningchip-back").removeAttr('style');
+
−
                    $("#navtext").removeAttr('style');
+
−
                    $(".chip_gap").css('height','23px');
+
−
                }
+
−
            });
+
−
        /*Fix for when a link targets an id -> check the position on pageload*/
+
−
        $(window).scroll();
+
−
        });
+
−
    </script>
+
−
    <body>
+
−
        <!-- BEGIN normal Menubar-->
+
−
            <div id="Menu">
+
−
                <div id="naviconwrapper">
+
−
                    <!-- BEGIN icons -->
+
−
                    <div id="naviconbar">
+
−
                        <div id="navicons">
+
−
                            <ul>
+
−
                                <li id="home" ><a href="https://2018.igem.org/Team:Pasteur_Paris/Home"></a>
+
−
                                </li>
+
−
                                <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="modeling"><a href="https://2018.igem.org/Team:Pasteur_Paris/Model">Modeling</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 Practices</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>
+
−
                        </div>
+
−
                    </div>
+
−
                    <!-- END icons -->
+
−
                </div>
+
−
                    <!-- 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="modeling-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>  
+
−
        <!-- END: normal Menubar -->
+
−
        <!-- BEGIN: Mobile Navigation Menu -->
+
−
            <div class="clearfix" id="smallnav">
+
−
                <ul class="clearfix">
+
−
                    <li id="home_small"><a href="https://2018.igem.org/Team:Pasteur_Paris">Home</a></li>
+
−
                    <li id="project_small"><a href="https://2018.igem.org/Team:Pasteur_Paris/Project">Project</a></li>
+
−
                    <li id="parts_small"><a href="https://2018.igem.org/Team:Pasteur_Paris/Parts">Parts</a></li>
+
−
                    <li id="modeling_small"><a href="https://2018.igem.org/Team:Pasteur_Paris/Modeling">Modeling</a></li>
+
−
                    <li id="achievements_small"><a href="https://2018.igem.org/Team:Pasteur_Paris/">Achievements</a></li>
+
−
                    <li id="hp_small"><a href="https://2018.igem.org/Team:Pasteur_Paris/Human_Practices">HP</a></li> 
+
−
                    <li id="aboutus_small"><a href="https://2018.igem.org/Team:Pasteur_Paris/Team">About us</a></li>
+
−
                </ul>
+
−
                <a href="#" id="pull">Menu</a>
+
−
            </div>
+
−
        <!-- END: Mobile Navigation Menu -->
+
−
    </body>
+
 
</html>
 
</html>
−
<!-- Bar code inspired from Freiburg 2015 : https://2015.igem.org/Team:Freiburg -->
 

Revision as of 09:28, 21 August 2018

""