Team:Grenoble/Design/css
From 2012.igem.org
m |
|||
(670 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
+ | /******************************************************************************************/ | ||
+ | /* Thanks to iGEM team DTU 2011 for their helpful tutorial, for any information see here :*/ | ||
+ | /***********https://2011.igem.org/Team:DTU-Denmark/How_to_customize_an_iGEM_wiki************/ | ||
+ | /******************************************************************************************/ | ||
+ | |||
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo | #contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo | ||
{ | { | ||
Line 34: | Line 39: | ||
margin: 0 0 0 0; | margin: 0 0 0 0; | ||
padding: 0; | padding: 0; | ||
+ | width: 100%; | ||
+ | } | ||
+ | |||
+ | body[id="Project"] | ||
+ | { | ||
+ | background: url('https://static.igem.org/mediawiki/2012/f/f2/Project_fond.png') fixed no-repeat; | ||
+ | } | ||
+ | |||
+ | body[id="Team"] | ||
+ | { | ||
+ | background: url('https://static.igem.org/mediawiki/2012/5/5f/Team_fond.png') fixed no-repeat; | ||
+ | } | ||
+ | |||
+ | body[id="Biology"] | ||
+ | { | ||
+ | background: url('https://static.igem.org/mediawiki/2012/a/ac/Biology_fond.png') fixed no-repeat; | ||
+ | } | ||
+ | |||
+ | body[id="Safety"] | ||
+ | { | ||
+ | background: url('https://static.igem.org/mediawiki/2012/6/65/Safety_fond.png') fixed no-repeat; | ||
+ | } | ||
+ | |||
+ | body[id="Parts"] | ||
+ | { | ||
+ | background: url('https://static.igem.org/mediawiki/2012/3/3a/Parts_fond.png') fixed no-repeat; | ||
+ | } | ||
+ | |||
+ | body[id="Modeling"] | ||
+ | { | ||
+ | background: url('https://static.igem.org/mediawiki/2012/6/62/Modelling_fond.png') fixed no-repeat; | ||
+ | } | ||
+ | |||
+ | body[id="HP"] | ||
+ | { | ||
+ | background: url('https://static.igem.org/mediawiki/2012/4/44/HP_fond.png') fixed no-repeat; | ||
+ | } | ||
+ | |||
+ | body[id="Gre"] | ||
+ | { | ||
+ | background: url('https://static.igem.org/mediawiki/2012/0/05/Grenoble_fond.png') fixed no-repeat; | ||
} | } | ||
Line 90: | Line 136: | ||
position: absolute; | position: absolute; | ||
left: -150px; | left: -150px; | ||
- | |||
width: 1280px; | width: 1280px; | ||
height: 1024px; | height: 1024px; | ||
Line 97: | Line 142: | ||
nav | nav | ||
{ | { | ||
- | margin-left: | + | margin-left: 95px; |
} | } | ||
Line 107: | Line 152: | ||
ul.topnav li a { | ul.topnav li a { | ||
padding: 10px 10px 10px 10px; | padding: 10px 10px 10px 10px; | ||
- | |||
display: block; | display: block; | ||
text-decoration: none; | text-decoration: none; | ||
- | + | margin-left: -10px; | |
- | + | } | |
+ | |||
+ | ul.topnav li ul.subnav li a | ||
+ | { | ||
+ | margin-left: 5px; | ||
+ | } | ||
+ | |||
+ | #model_icon | ||
+ | { | ||
+ | margin-top: -1px; | ||
+ | } | ||
+ | |||
+ | #HP_icon | ||
+ | { | ||
+ | margin-top: -7px; | ||
+ | } | ||
+ | |||
+ | #Gre_icon | ||
+ | { | ||
+ | margin-top: 0px; | ||
} | } | ||
Line 130: | Line 193: | ||
} | } | ||
- | /************************************************************** | + | /****************************************/ |
- | + | /* Barre de menu en haut de chaque page */ | |
+ | /****************************************/ | ||
- | ul.topnav ul li | + | /*ul.topnav ul li |
{ | { | ||
opacity: 0.7; | opacity: 0.7; | ||
Line 141: | Line 205: | ||
{ | { | ||
opacity: 1; | opacity: 1; | ||
- | } | + | }*/ |
- | ul.topnav li[id="model_icon"] ul.subnav li:hover | + | ul.topnav li[id="model_icon"] ul.subnav li:hover, .menu_gauche[id="model_icon"] ul li:hover |
{ | { | ||
background-color: #ffc000; | background-color: #ffc000; | ||
} | } | ||
- | ul.topnav li[id="project_icon"] ul.subnav li:hover | + | ul.topnav li[id="project_icon"] ul.subnav li:hover, .menu_gauche[id="project_icon"] ul li:hover |
{ | { | ||
- | background-color: # | + | background-color: #b80100; |
} | } | ||
- | ul.topnav li[id="bio_icon"] ul.subnav li:hover | + | ul.topnav li[id="bio_icon"] ul.subnav li:hover, .menu_gauche[id="bio_icon"] ul li:hover |
{ | { | ||
background-color: #30849b; | background-color: #30849b; | ||
} | } | ||
- | ul.topnav li[id="safety_icon"] ul.subnav li:hover | + | ul.topnav li[id="safety_icon"] ul.subnav li:hover, .menu_gauche[id="safety_icon"] ul li:hover |
{ | { | ||
background-color: #e46c0a; | background-color: #e46c0a; | ||
} | } | ||
- | ul.topnav li[id="team_icon"] ul.subnav li:hover | + | ul.topnav li[id="team_icon"] ul.subnav li:hover, .menu_gauche[id="team_icon"] ul li:hover |
{ | { | ||
- | background-color: # | + | background-color: #007f00; |
} | } | ||
- | ul.topnav li ul.subnav li a:hover { | + | ul.topnav li[id="HP_icon"] ul.subnav li:hover, .menu_gauche[id="HP_icon"] ul li:hover |
+ | { | ||
+ | background-color: #1c477b; | ||
+ | } | ||
+ | |||
+ | ul.topnav li[id="Gre_icon"] ul.subnav li:hover | ||
+ | { | ||
+ | background-color: white; | ||
+ | } | ||
+ | |||
+ | .menu_gauche[id="gre_icon"] ul li:hover | ||
+ | { | ||
+ | background-color: white; | ||
+ | } | ||
+ | |||
+ | .menu_gauche[id="HP_icon"] ul li:hover | ||
+ | { | ||
+ | background-color: #1c477b; | ||
+ | } | ||
+ | |||
+ | ul.topnav li[id="HP_icon"] ul.subnav li a:hover, ul.topnav li[id="bio_icon"] ul.subnav li a:hover, | ||
+ | ul.topnav li[id="model_icon"] ul.subnav li a:hover, ul.topnav li[id="team_icon"] ul.subnav li a:hover, | ||
+ | ul.topnav li[id="safety_icon"] ul.subnav li a:hover, ul.topnav li[id="project_icon"] ul.subnav li a:hover | ||
+ | { | ||
font-weight: bold; | font-weight: bold; | ||
color: white; | color: white; | ||
+ | } | ||
+ | |||
+ | ul.topnav li[id="Gre_icon"] ul.subnav li a:hover | ||
+ | { | ||
+ | font-weight: bold; | ||
} | } | ||
Line 193: | Line 285: | ||
{ | { | ||
position: absolute; | position: absolute; | ||
- | left: -10px; | + | left: -19px; |
- | top: | + | top: 110px; |
+ | background: #e6e6e6; | ||
+ | display: none; | ||
+ | float: left; | ||
+ | border-radius: 10px; | ||
+ | } | ||
+ | |||
+ | ul.topnav li[id="HP_icon"] ul.subnav | ||
+ | { | ||
+ | position: absolute; | ||
+ | letf: -10px; | ||
+ | top: 117px; | ||
background: #e6e6e6; | background: #e6e6e6; | ||
display: none; | display: none; | ||
Line 219: | Line 322: | ||
{ | { | ||
width: 160px; | width: 160px; | ||
+ | } | ||
+ | |||
+ | /**********************/ | ||
+ | /* Menu sur la gauche */ | ||
+ | /**********************/ | ||
+ | |||
+ | .menu_gauche ul.menu li | ||
+ | { | ||
+ | list-style: none; | ||
+ | width: 145px; | ||
+ | height: 30px; | ||
+ | margin-top: 10px; | ||
+ | margin-bottom: 10px; | ||
+ | background: #e6e6e6; | ||
+ | border-radius: 10px; | ||
+ | padding: 15px 10px 10px 10px; | ||
+ | } | ||
+ | |||
+ | ul.menu li ul.submenu | ||
+ | { | ||
+ | position: relative; | ||
+ | width: 130px; | ||
+ | top: 21px; | ||
+ | left: 0px; | ||
+ | margin-top: 0px; | ||
+ | background: #e6e6e6; | ||
+ | border-radius: 10px; | ||
+ | } | ||
+ | |||
+ | ul.menu li ul.submenu li | ||
+ | { | ||
+ | width: 120px; | ||
+ | height: 20px; | ||
+ | margin-top: 0px; | ||
+ | margin-bottom: 0px; | ||
+ | } | ||
+ | |||
+ | .menu_gauche | ||
+ | { | ||
+ | position: fixed; | ||
+ | top: 210px; | ||
+ | left: 37px; | ||
+ | } | ||
+ | |||
+ | .menu_gauche ul a li | ||
+ | { | ||
+ | color: black; | ||
+ | font-size: 1.1em; | ||
+ | } | ||
+ | |||
+ | .menu_gauche ul li a | ||
+ | { | ||
+ | color: black; | ||
+ | font-size: 1.1em; | ||
+ | } | ||
+ | |||
+ | .menu_gauche ul li | ||
+ | { | ||
+ | color: black; | ||
+ | font-size: 1.1em; | ||
+ | } | ||
+ | |||
+ | .menu_gauche ul a | ||
+ | { | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | .menu_gauche ul.menu li ul.submenu a li | ||
+ | { | ||
+ | font-size: 0.9em; | ||
+ | padding: 5px 5px 5px 5px; | ||
+ | } | ||
+ | |||
+ | .menu_gauche[id="project_icon"] ul a li:hover | ||
+ | { | ||
+ | font-weight: bold; | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | .menu_gauche[id="model_icon"] ul a li:hover | ||
+ | { | ||
+ | font-weight: bold; | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | .menu_gauche[id="model_icon"] ul li:hover a | ||
+ | { | ||
+ | font-weight: bold; | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | .menu_gauche[id="safety_icon"] ul a li:hover | ||
+ | { | ||
+ | font-weight: bold; | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | .menu_gauche[id="bio_icon"] ul a li:hover | ||
+ | { | ||
+ | font-weight: bold; | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | .menu_gauche[id="bio_icon"] ul li:hover a | ||
+ | { | ||
+ | font-weight: bold; | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | .menu_gauche[id="team_icon"] ul a li:hover | ||
+ | { | ||
+ | font-weight: bold; | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | .menu_gauche[id="gre_icon"] ul a li:hover | ||
+ | { | ||
+ | font-weight: bold; | ||
+ | } | ||
+ | |||
+ | .menu_gauche[id="HP_icon"] ul a li:hover | ||
+ | { | ||
+ | font-weight: bold; | ||
+ | color: white; | ||
} | } | ||
#cadre | #cadre | ||
{ | { | ||
- | + | position: absolute; | |
- | + | top: 150px; | |
- | + | left: 110px; | |
- | + | width: 860px; | |
- | + | ||
} | } | ||
#icon | #icon | ||
{ | { | ||
- | position: | + | position: fixed; |
- | left: | + | left: 55px; |
- | top: | + | top: 20px; |
} | } | ||
- | # | + | /*Flèche vers le haut de la page*/ |
+ | #up | ||
{ | { | ||
- | position: | + | position: fixed; |
- | + | right: 65px; | |
- | + | bottom: 30px; | |
} | } | ||
- | # | + | /*Logo de l'équipe vers la page d'accueil*/ |
+ | #home_icon | ||
{ | { | ||
- | position: | + | position: fixed; |
- | left: | + | top: 20px; |
- | bottom: 50px; | + | right: 60px; |
+ | } | ||
+ | |||
+ | /*Lien vers la page officielle d'igem*/ | ||
+ | #igem | ||
+ | { | ||
+ | position: fixed; | ||
+ | top: 140px; | ||
+ | right: 50px; | ||
+ | } | ||
+ | |||
+ | section | ||
+ | { | ||
+ | font-size: 1.1em; | ||
+ | background-color: white; | ||
+ | text-align: justify; | ||
+ | padding: 10px; | ||
+ | border-radius: 10px; | ||
+ | font-family: Verdana; | ||
+ | margin-bottom: 40px; | ||
+ | } | ||
+ | |||
+ | h4 | ||
+ | { | ||
+ | /*font-size: 2.5em; | ||
+ | margin-left: 100px; | ||
+ | text-shadow: 2px 2px 2px black; | ||
+ | opacity: 0.4; | ||
+ | margin-bottom: 40px;*/ | ||
+ | } | ||
+ | |||
+ | .champ | ||
+ | { | ||
+ | margin-bottom: 20px; | ||
+ | margin-left: 50px; | ||
+ | } | ||
+ | |||
+ | .champ_title | ||
+ | { | ||
+ | font-size: 1.6em; | ||
+ | color: #77933c; | ||
+ | margin-right: 15px; | ||
+ | position: relative; | ||
+ | bottom: 15px; | ||
+ | right: 50px; | ||
+ | } | ||
+ | |||
+ | .portrait | ||
+ | { | ||
+ | margin-bottom: 40px; | ||
+ | } | ||
+ | |||
+ | ul | ||
+ | { | ||
+ | list-style: circle; | ||
+ | } | ||
+ | |||
+ | .exposant | ||
+ | { | ||
+ | font-size: 0.7em; | ||
+ | position: relative; | ||
+ | bottom: 5px; | ||
+ | } | ||
+ | |||
+ | .indice | ||
+ | { | ||
+ | font-size: 0.7em; | ||
+ | position: relative; | ||
+ | top: 5px; | ||
+ | } | ||
+ | |||
+ | .legend | ||
+ | { | ||
+ | font-size: 0.7em; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | width: 300px; | ||
+ | text-align: left; | ||
+ | } | ||
+ | |||
+ | .code | ||
+ | { | ||
+ | font-size: 0.7em; | ||
+ | font-weight: bold; | ||
+ | } | ||
+ | |||
+ | .petit | ||
+ | { | ||
+ | font-size: 0.8em; | ||
+ | text-align: justify; | ||
+ | } | ||
+ | |||
+ | .encadre | ||
+ | { | ||
+ | padding : 10px 10px 10px 10px; | ||
+ | border-radius: 10px; | ||
+ | } | ||
+ | |||
+ | .encadre[id="red"] | ||
+ | { | ||
+ | border: 2px red solid; | ||
+ | } | ||
+ | |||
+ | |||
+ | .encadre[id="blue"] | ||
+ | { | ||
+ | border: 2px blue solid; | ||
+ | } | ||
+ | |||
+ | |||
+ | .encadre[id="green"] | ||
+ | { | ||
+ | border: 2px green solid; | ||
+ | } | ||
+ | |||
+ | table.tableau | ||
+ | { | ||
+ | border-collapse: collapse; | ||
+ | padding: 7px; | ||
+ | } | ||
+ | |||
+ | table.tableau td, table.tableau th | ||
+ | { | ||
+ | border: solid 1px black; | ||
+ | padding: 7px; | ||
+ | } | ||
+ | |||
+ | span.gras | ||
+ | { | ||
+ | font-weight: bold; | ||
+ | } | ||
+ | |||
+ | .schema | ||
+ | { | ||
+ | opacity: 0.6; | ||
+ | } | ||
+ | |||
+ | .schema:hover | ||
+ | { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | /******************************************/ | ||
+ | /*Design des @!^&#_ tableaux de paramètres*/ | ||
+ | /******************************************/ | ||
+ | |||
+ | table[id="param"], table[id="param_2"] | ||
+ | { | ||
+ | width: 840px; | ||
+ | text-align: center; | ||
+ | font-size: 1.3em; | ||
+ | border: none; | ||
+ | } | ||
+ | |||
+ | |||
+ | table[id="param_3"] | ||
+ | { | ||
+ | width: 840px; | ||
+ | text-align: center; | ||
+ | font-size: 1.3em; | ||
+ | border: none; | ||
+ | } | ||
+ | |||
+ | table[id="param"] thead tr, table[id="param_2"] thead tr | ||
+ | { | ||
+ | height: 50px; | ||
+ | color: white; | ||
+ | background-color: #f79646; | ||
+ | text-align: center; | ||
+ | font-size: 1.1em; | ||
+ | } | ||
+ | |||
+ | table[id="param_3"] thead tr | ||
+ | { | ||
+ | height: 50px; | ||
+ | color: #595959; | ||
+ | background-color: #ffdb69; | ||
+ | text-align: center; | ||
+ | font-size: 1.1em; | ||
+ | } | ||
+ | |||
+ | table[id="param_3"] tbody tr td | ||
+ | { | ||
+ | padding: 10px 10px 10px 10px; | ||
+ | } | ||
+ | |||
+ | table[id="param"] tbody tr, table[id="param_2"] tbody tr | ||
+ | { | ||
+ | height: 50px; | ||
+ | } | ||
+ | |||
+ | table[id="param"] tbody tr td.colonne1, table[id="param_2"] tbody tr td.colonne1 | ||
+ | { | ||
+ | width: 254px; | ||
+ | } | ||
+ | |||
+ | table[id="param_3"] tbody tr td.column1 | ||
+ | { | ||
+ | width: 10px; | ||
+ | color: #595959; | ||
+ | background-color: #ffdb69; | ||
+ | font-weight: bold; | ||
+ | } | ||
+ | |||
+ | table[id="param"] tbody tr td.colonne2, table[id="param_2"] tbody tr td.colonne2 | ||
+ | { | ||
+ | width: 200px; | ||
+ | } | ||
+ | |||
+ | table[id="param_3"] tbody tr td.column2 | ||
+ | { | ||
+ | width: 150px; | ||
+ | font-size: 0.8em; | ||
+ | } | ||
+ | |||
+ | table[id="param"] tbody tr td.colonne3, table[id="param_2"] tbody tr td.colonne3 | ||
+ | { | ||
+ | width: 178px; | ||
+ | } | ||
+ | |||
+ | table[id="param_3"] tbody tr td.column3 | ||
+ | { | ||
+ | width: 350px; | ||
+ | font-size: 0.8em; | ||
+ | } | ||
+ | |||
+ | table[id="param"] tbody tr td.colonne4, table[id="param_2"] tbody tr td.colonne4 | ||
+ | { | ||
+ | width: 208px; | ||
+ | } | ||
+ | |||
+ | table[id="param_3"] tbody tr | ||
+ | { | ||
+ | background: #ddd9c3; | ||
+ | } | ||
+ | |||
+ | table tbody tr.impair | ||
+ | { | ||
+ | background: #fdefe9; | ||
+ | } | ||
+ | |||
+ | table tbody tr.pair | ||
+ | { | ||
+ | background: #fcddcf; | ||
} | } |
Latest revision as of 21:23, 26 September 2012
/******************************************************************************************/ /* Thanks to iGEM team DTU 2011 for their helpful tutorial, for any information see here :*/ /***********https://2011.igem.org/Team:DTU-Denmark/How_to_customize_an_iGEM_wiki************/ /******************************************************************************************/
- contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo
{
display:none; background-color: none;
}
body, html {
margin: 0; padding: 0; height: 100%;
}
- top-section
{
border: none; height: 0px;
}
- content
{
border: none; background: none;
}
- menubar
{
width: auto;
}
body {
margin: 0 0 0 0; padding: 0; width: 100%;
}
body[id="Project"] { background: url('https://static.igem.org/mediawiki/2012/f/f2/Project_fond.png') fixed no-repeat; }
body[id="Team"] { background: url('https://static.igem.org/mediawiki/2012/5/5f/Team_fond.png') fixed no-repeat; }
body[id="Biology"] { background: url('https://static.igem.org/mediawiki/2012/a/ac/Biology_fond.png') fixed no-repeat; }
body[id="Safety"] { background: url('https://static.igem.org/mediawiki/2012/6/65/Safety_fond.png') fixed no-repeat; }
body[id="Parts"] { background: url('https://static.igem.org/mediawiki/2012/3/3a/Parts_fond.png') fixed no-repeat; }
body[id="Modeling"] { background: url('https://static.igem.org/mediawiki/2012/6/62/Modelling_fond.png') fixed no-repeat; }
body[id="HP"] { background: url('https://static.igem.org/mediawiki/2012/4/44/HP_fond.png') fixed no-repeat; }
body[id="Gre"] { background: url('https://static.igem.org/mediawiki/2012/0/05/Grenoble_fond.png') fixed no-repeat; }
- top-section
{
width: 965px; height: 0; margin: 0 auto; padding: 0; border: none;
}
- menubar
{
font-size: 65%; top: 0px;
}
.left-menu:hover {
background-color: transparent;
}
- menubar li a
{
background-color: transparent;
}
- menubar:hover
{
color: white;
}
- menubar li a
{
color: transparent;
}
- menubar:hover li a
{
color: white;
}
.letf-menu: hover { background-color: transparent; }
.right-box { width: 0px; }
- page
{ position: absolute; left: -150px; width: 1280px; height: 1024px; }
nav { margin-left: 95px; }
ul.topnav li a { display: inline-block; }
ul.topnav li a { padding: 10px 10px 10px 10px; display: block; text-decoration: none;
margin-left: -10px;
}
ul.topnav li ul.subnav li a { margin-left: 5px; }
- model_icon
{ margin-top: -1px; }
- HP_icon
{ margin-top: -7px; }
- Gre_icon
{ margin-top: 0px; }
html ul.topnav li a: hover { /*opacity: 0.7;*/ }
ul.topnav ul, ul.topnav ul li { list-style: none; }
ul.topnav ul, ul.topnav ul li:visited { text-decoration: none; style-effect: none; }
/****************************************/ /* Barre de menu en haut de chaque page */ /****************************************/
/*ul.topnav ul li { opacity: 0.7; }
ul.topnav ul li:hover { opacity: 1; }*/
ul.topnav li[id="model_icon"] ul.subnav li:hover, .menu_gauche[id="model_icon"] ul li:hover { background-color: #ffc000; }
ul.topnav li[id="project_icon"] ul.subnav li:hover, .menu_gauche[id="project_icon"] ul li:hover { background-color: #b80100; }
ul.topnav li[id="bio_icon"] ul.subnav li:hover, .menu_gauche[id="bio_icon"] ul li:hover { background-color: #30849b; }
ul.topnav li[id="safety_icon"] ul.subnav li:hover, .menu_gauche[id="safety_icon"] ul li:hover { background-color: #e46c0a; }
ul.topnav li[id="team_icon"] ul.subnav li:hover, .menu_gauche[id="team_icon"] ul li:hover { background-color: #007f00; }
ul.topnav li[id="HP_icon"] ul.subnav li:hover, .menu_gauche[id="HP_icon"] ul li:hover { background-color: #1c477b; }
ul.topnav li[id="Gre_icon"] ul.subnav li:hover { background-color: white; }
.menu_gauche[id="gre_icon"] ul li:hover { background-color: white; }
.menu_gauche[id="HP_icon"] ul li:hover { background-color: #1c477b; }
ul.topnav li[id="HP_icon"] ul.subnav li a:hover, ul.topnav li[id="bio_icon"] ul.subnav li a:hover, ul.topnav li[id="model_icon"] ul.subnav li a:hover, ul.topnav li[id="team_icon"] ul.subnav li a:hover, ul.topnav li[id="safety_icon"] ul.subnav li a:hover, ul.topnav li[id="project_icon"] ul.subnav li a:hover { font-weight: bold; color: white; }
ul.topnav li[id="Gre_icon"] ul.subnav li a:hover { font-weight: bold; }
ul.topnav ul a:hover { text-decoration: none; }
ul.topnav li { float: left; position: relative; }
ul.topnav > li > a { height: 28px; overflow: hidden; }
ul.topnav li ul.subnav { position: absolute; left: -19px; top: 110px; background: #e6e6e6; display: none; float: left; border-radius: 10px; }
ul.topnav li[id="HP_icon"] ul.subnav { position: absolute; letf: -10px; top: 117px; background: #e6e6e6; display: none; float: left; border-radius: 10px; }
ul.topnav li ul.subnav li { border-radius: 10px; }
ul.topnav li ul.subnav li a { color: black; /*text-align: justify;*/ }
ul.topnav li ul.subnav li: hover { }
ul.topnav li ul.subnav, ul.topnav li ul.subnav li { width: 160px; }
/**********************/ /* Menu sur la gauche */ /**********************/
.menu_gauche ul.menu li { list-style: none; width: 145px; height: 30px; margin-top: 10px; margin-bottom: 10px; background: #e6e6e6; border-radius: 10px; padding: 15px 10px 10px 10px; }
ul.menu li ul.submenu { position: relative; width: 130px; top: 21px; left: 0px; margin-top: 0px; background: #e6e6e6; border-radius: 10px; }
ul.menu li ul.submenu li { width: 120px; height: 20px; margin-top: 0px; margin-bottom: 0px; }
.menu_gauche { position: fixed; top: 210px; left: 37px; }
.menu_gauche ul a li { color: black; font-size: 1.1em; }
.menu_gauche ul li a { color: black; font-size: 1.1em; }
.menu_gauche ul li { color: black; font-size: 1.1em; }
.menu_gauche ul a { text-decoration: none; }
.menu_gauche ul.menu li ul.submenu a li { font-size: 0.9em; padding: 5px 5px 5px 5px; }
.menu_gauche[id="project_icon"] ul a li:hover { font-weight: bold; color: white; }
.menu_gauche[id="model_icon"] ul a li:hover { font-weight: bold; color: white; }
.menu_gauche[id="model_icon"] ul li:hover a { font-weight: bold; color: white; }
.menu_gauche[id="safety_icon"] ul a li:hover { font-weight: bold; color: white; }
.menu_gauche[id="bio_icon"] ul a li:hover { font-weight: bold; color: white; }
.menu_gauche[id="bio_icon"] ul li:hover a { font-weight: bold; color: white; }
.menu_gauche[id="team_icon"] ul a li:hover { font-weight: bold; color: white; }
.menu_gauche[id="gre_icon"] ul a li:hover { font-weight: bold; }
.menu_gauche[id="HP_icon"] ul a li:hover { font-weight: bold; color: white; }
- cadre
{ position: absolute; top: 150px; left: 110px; width: 860px; }
- icon
{ position: fixed; left: 55px; top: 20px; }
/*Flèche vers le haut de la page*/
- up
{ position: fixed; right: 65px; bottom: 30px; }
/*Logo de l'équipe vers la page d'accueil*/
- home_icon
{ position: fixed; top: 20px; right: 60px; }
/*Lien vers la page officielle d'igem*/
- igem
{ position: fixed; top: 140px; right: 50px; }
section { font-size: 1.1em; background-color: white; text-align: justify; padding: 10px; border-radius: 10px; font-family: Verdana; margin-bottom: 40px; }
h4 { /*font-size: 2.5em; margin-left: 100px; text-shadow: 2px 2px 2px black; opacity: 0.4; margin-bottom: 40px;*/ }
.champ { margin-bottom: 20px; margin-left: 50px; }
.champ_title { font-size: 1.6em; color: #77933c; margin-right: 15px; position: relative; bottom: 15px; right: 50px; }
.portrait { margin-bottom: 40px; }
ul { list-style: circle; }
.exposant { font-size: 0.7em; position: relative; bottom: 5px; }
.indice { font-size: 0.7em; position: relative; top: 5px; }
.legend { font-size: 0.7em; margin-left: auto; margin-right: auto; width: 300px; text-align: left; }
.code { font-size: 0.7em; font-weight: bold; }
.petit { font-size: 0.8em; text-align: justify; }
.encadre { padding : 10px 10px 10px 10px; border-radius: 10px; }
.encadre[id="red"] { border: 2px red solid; }
.encadre[id="blue"]
{
border: 2px blue solid;
}
.encadre[id="green"]
{
border: 2px green solid;
}
table.tableau { border-collapse: collapse; padding: 7px; }
table.tableau td, table.tableau th { border: solid 1px black; padding: 7px; }
span.gras { font-weight: bold; }
.schema { opacity: 0.6; }
.schema:hover { opacity: 1; }
/******************************************/ /*Design des @!^&#_ tableaux de paramètres*/ /******************************************/
table[id="param"], table[id="param_2"] { width: 840px; text-align: center; font-size: 1.3em; border: none; }
table[id="param_3"]
{
width: 840px;
text-align: center;
font-size: 1.3em;
border: none;
}
table[id="param"] thead tr, table[id="param_2"] thead tr { height: 50px; color: white; background-color: #f79646; text-align: center; font-size: 1.1em; }
table[id="param_3"] thead tr { height: 50px; color: #595959; background-color: #ffdb69; text-align: center; font-size: 1.1em; }
table[id="param_3"] tbody tr td { padding: 10px 10px 10px 10px; }
table[id="param"] tbody tr, table[id="param_2"] tbody tr { height: 50px; }
table[id="param"] tbody tr td.colonne1, table[id="param_2"] tbody tr td.colonne1 { width: 254px; }
table[id="param_3"] tbody tr td.column1 { width: 10px; color: #595959; background-color: #ffdb69; font-weight: bold; }
table[id="param"] tbody tr td.colonne2, table[id="param_2"] tbody tr td.colonne2 { width: 200px; }
table[id="param_3"] tbody tr td.column2 { width: 150px; font-size: 0.8em; }
table[id="param"] tbody tr td.colonne3, table[id="param_2"] tbody tr td.colonne3 { width: 178px; }
table[id="param_3"] tbody tr td.column3 { width: 350px; font-size: 0.8em; }
table[id="param"] tbody tr td.colonne4, table[id="param_2"] tbody tr td.colonne4 { width: 208px; }
table[id="param_3"] tbody tr { background: #ddd9c3; }
table tbody tr.impair { background: #fdefe9; }
table tbody tr.pair { background: #fcddcf; }