Difference between revisions of "Team:Bordeaux"

Line 4: Line 4:
 
<style>
 
<style>
  
 +
/* Wrapper for the menu */
 +
 +
a {
 +
    color: #23dbdb;
 +
    text-decoration: none;
 +
}
 +
 +
a:hover {
 +
    color: #000;
 +
}
 +
ol, ul {
 +
    list-style: none;
 +
    padding:0px;
 +
    margin:0px;
 +
}
 +
 +
#wrap {
 +
    margin: 0 auto;
 +
}
 +
 +
.inner {
 +
    margin: 0 auto;
 +
    max-width: 100%;;
 +
    padding: 0 40px;
 +
}
 +
 +
.relative {
 +
    position: relative;
 +
}
 +
 +
.right {
 +
    float: right;
 +
}
 +
 +
.left {
 +
    float: left;
 +
}
 +
 +
/* HEADER */
 +
#wrap > header {
 +
    background-color: #0b1b33;
 +
    padding-bottom: 20px;
 +
}
 +
 +
#navigation {
 +
    position: absolute;
 +
    right: 40px;
 +
    bottom: 0px;
 +
}
 +
 +
#menu-toggle {
 +
    display: none;
 +
    float: right;
 +
}
 +
 +
/* HEADER > MENU */
 +
#main-menu {
 +
    float: right;
 +
    font-size: 0;
 +
    margin: 10px 0;
 +
}
 +
 +
#main-menu > li {
 +
    display: inline-block;
 +
    margin-left: 30px;
 +
    padding: 2px 0;
 +
}
 +
 +
#main-menu > li.parent {
 +
    background-image: url(../images/plus-gray.png);
 +
    background-size: 7px 7px;
 +
    background-repeat: no-repeat;
 +
    background-position: left center;
 +
}
 +
 +
#main-menu > li.parent > a {
 +
    padding-left: 14px;
 +
}
 +
 +
#main-menu > li > a {
 +
    color: #eee;
 +
    font-size: 14px;
 +
    line-height: 14px;
 +
    padding: 30px 0;
 +
    text-decoration:none;
 +
}
 +
 +
#main-menu > li:hover > a,
 +
#main-menu > li.current-menu-item > a {
 +
    color: #23dbdb;
 +
}
 +
 +
/* HEADER > MENU > DROPDOWN */
 +
#main-menu li {
 +
    position: relative;
 +
}
 +
 +
ul.sub-menu { /* level 2 */
 +
    display: none;
 +
    left: 0px;
 +
    top: 38px;
 +
    padding-top: 10px;
 +
    position: absolute;
 +
    width: 150px;
 +
    z-index: 9999;
 +
}
 +
 +
ul.sub-menu ul.sub-menu { /* level 3+ */
 +
    margin-top: -1px;
 +
    padding-top: 0;
 +
    left: 149px;
 +
    top: 0px;
 +
}
 +
 +
ul.sub-menu > li > a {
 +
    background-color: #333;
 +
    border: 1px solid #444;
 +
    border-top: none;
 +
    color: #bbb;
 +
    display: block;
 +
    font-size: 12px;
 +
    line-height: 15px;
 +
    padding: 10px 12px;
 +
}
 +
 +
ul.sub-menu > li > a:hover {
 +
    background-color: #2a2a2a;
 +
    color: #fff;
 +
}
 +
 +
ul.sub-menu > li:first-child {
 +
    border-top: 3px solid #23dbdb;
 +
}
 +
 +
ul.sub-menu ul.sub-menu > li:first-child {
 +
    border-top: 1px solid #444;
 +
}
 +
 +
ul.sub-menu > li:last-child > a {
 +
    border-radius: 0 0 2px 2px;
 +
}
 +
 +
ul.sub-menu > li > a.parent {
 +
    background-image: url(../images/arrow.png);
 +
    background-size: 5px 9px;
 +
    background-repeat: no-repeat;
 +
    background-position: 95% center;
 +
}
 +
 +
#main-menu li:hover > ul.sub-menu {
 +
    display: block; /* show the submenu */
 +
}
 +
 +
@media all and (max-width: 700px) {
 +
 +
    #navigation {
 +
        position: static;
 +
        margin-top: 20px;
 +
    }
 +
 +
    #menu-toggle {
 +
        display: block;
 +
    }
 +
 +
    #main-menu {
 +
        display: block;
 +
        float: none;
 +
    }
 +
 +
    #main-menu li {
 +
        display: block;
 +
        margin: 0;
 +
        padding: 0;
 +
    }
 +
 +
    #main-menu > li {
 +
        margin-top: -1px;
 +
    }
 +
 +
    #main-menu > li:first-child {
 +
        margin-top: 0;
 +
    }
 +
 +
    #main-menu > li > a {
 +
        background-color: #333;
 +
        border: 1px solid #444;
 +
        color: #bbb;
 +
        display: block;
 +
        font-size: 14px;ove
 +
        padding: 12px !important;
 +
        padding: 0;
 +
    }
 +
 +
    #main-menu li > a:hover {
 +
        background-color: #444;
 +
    }
 +
 +
    #main-menu > li.parent {
 +
        background: none !important;
 +
        padding: 0;
 +
    }
 +
 +
    #main-menu > li:hover > a,
 +
    #main-menu > li.current-menu-item > a {
 +
        border: 1px solid #444 !important;
 +
        color: #fff !important;
 +
    }
 +
 +
    ul.sub-menu {
 +
        display: block;
 +
        margin-top: -1px;
 +
        margin-left: 20px;
 +
        position: static;
 +
        padding: 0;
 +
        width: inherit;
 +
    }
 +
 +
    ul.sub-menu > li:first-child {
 +
        border-top: 1px solid #444 !important;
 +
    }
 +
 +
    ul.sub-menu > li > a.parent {
 +
        background: #333 !important;
 +
    }
 +
}
 +
 +
</style>
 +
 +
<!-- Menu bar -->
 +
<div style="background:#5A5E6B; font-family: 'Architects Daughter', cursive;
 +
font-size:2.5em; text-align:center; color:#DAA520; font-weight:bold; width:100%; height:80px; padding-top:25px">Stargate WCC</div>
 +
<div id="wrap">
 +
    <header>
 +
        <div class="inner relative">
 +
           
 +
            <nav id="navigation">
 +
                <ul id="main-menu">
 +
                    <li class="current-menu-item"><a href="https://2016.igem.org/Team:Bordeaux">HOME</a></li>
 +
                    <li class="parent">
 +
                        <a href="#">TEAM</a>
 +
                        <ul class="sub-menu">
 +
                            <li><a href="https://2016.igem.org/Team:Bordeaux/Team">Meet us!</a></li>
 +
                            <li><a href="https://2016.igem.org/Team:Bordeaux/Collaborations">Collaborations</a></li>
 +
                            </li>
 +
                        </ul>
 +
                    </li>
 +
                    <li class="parent">
 +
                        <a href="#">PROJECT</a>
 +
                        <ul class="sub-menu">
 +
                            <li><a href="https://2016.igem.org/Team:Bordeaux/Description">Description</a></li>
 +
                            <li><a href="https://2016.igem.org/Team:Bordeaux/Safety">Safety</a></li>
 +
                        </ul>
 +
                    </li>
 +
                    <li class="parent">
 +
                        <a href="#">LABWORK</a>
 +
                        <ul class="sub-menu">
 +
                            <li><a href="https://2016.igem.org/Team:Bordeaux/Experiments">Experiments</a></li>
 +
                            <li><a href="https://2016.igem.org/Team:Bordeaux/Results">Results</a></li>
 +
                            <li><a href="https://2016.igem.org/Team:Bordeaux/Notebook">Notebook</a></li>
 +
                        </ul>
 +
                    </li>
 +
                    <li><a href="https://2016.igem.org/Team:Bordeaux/Parts">PARTS</a></li>
 +
 +
                    <li class="parent">
 +
                        <a href="#">BIOINFO WORK</a>
 +
                        <ul class="sub-menu">
 +
                            <li><a href="https://2016.igem.org/Team:Bordeaux/Model">Model</a></li>
 +
                            <li><a href="https://2016.igem.org/Team:Bordeaux/Software">Software</a></li>
 +
                        </ul>
 +
                  </li>
 +
                   
 +
                    <li class="parent">
 +
                        <a href="#">HUMAN PRACTICES</a>
 +
                        <ul class="sub-menu">
 +
                            <li><a href="https://2016.igem.org/Team:Bordeaux/Human_Practices">Human Practices Summary</a></li>
 +
                            <li><a href="https://2016.igem.org/Team:Bordeaux/HP/Silver">Ethical aspects on CRISPR-CAS9</a></li>
 +
                            <li><a href="https://2016.igem.org/Team:Bordeaux/HP/Gold">Popularization and Education</a></li>
 +
                            <li><a href="https://2016.igem.org/Team:Bordeaux/Integrated_Practices">Integrated Practices</a></li>
 +
                            <li><a href="https://2016.igem.org/Team:Bordeaux/Engagement">Public Engagement</a></li>
 +
                        </ul>
 +
                    </li>
 +
 +
                  <li><a href="https://2016.igem.org/Team:Bordeaux/Press_Highlights">PRESS</a></li>
 +
 +
                  <li class="parent">
 +
                        <a href="#">GOALS</a>
 +
                        <ul class="sub-menu">
 +
                            <li><a href="https://2016.igem.org/Team:Bordeaux/Achievements">Achievements</a></li>
 +
                            <li><a href="https://2016.igem.org/Team:Bordeaux/Attributions">Attributions</a></li>
 +
                        </ul>
 +
                    </li>
 +
                </ul>
 +
            </nav>
 +
            <div class="clear"></div>
 +
        </div>
 +
    </header>
 +
 +
</div> 
 +
 +
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  
 
<script>
 
<script>

Revision as of 14:14, 6 September 2017

Wrong