Team:Bordeaux/xr main.css
From 2014.igem.org
(11 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
+ | body | ||
+ | { | ||
+ | color: #000; | ||
+ | font-family: Arial,sans-serif; | ||
+ | font-size: 13px; | ||
+ | font-weight: normal; | ||
+ | font-style: normal; | ||
+ | background-repeat:repeat-x; | ||
+ | background-size: cover; | ||
+ | background-color : #FFF; | ||
+ | margin:0px 0px 0px 0px; | ||
+ | /*-webkit-hyphens: auto; | ||
+ | -moz-hyphens: auto; | ||
+ | -ms-hyphens: auto; | ||
+ | -o-hyphens: auto; | ||
+ | hyphens: auto;*/ | ||
+ | text-decoration: none; | ||
+ | letter-spacing: 0em; | ||
+ | } | ||
+ | |||
+ | /* la barre titre (banniere igem+ menu haut)*/ | ||
+ | #top-section | ||
+ | { | ||
+ | height: 5px; | ||
+ | width: auto; | ||
+ | margin: 0; | ||
+ | margin-bottom: -1.5em; | ||
+ | padding: 0; | ||
+ | border: 0 /*none transport*/; | ||
+ | } | ||
+ | |||
+ | /*le conteneur de la banière igem avec un lien vers igem*/ | ||
+ | #p-logo | ||
+ | { | ||
+ | display:none; | ||
+ | border:none; | ||
+ | margin:none; | ||
+ | } | ||
+ | |||
+ | /* la barre de menu du haut */ | ||
+ | #menubar | ||
+ | { | ||
+ | background: none repeat scroll 0 0 transparent !important; | ||
+ | color: transparent !important; | ||
+ | position: absolute; | ||
+ | top: -6px; | ||
+ | display: table-cell; | ||
+ | } | ||
+ | |||
+ | /*les lien de la barre de menu du haut */ | ||
+ | #menubar a | ||
+ | { | ||
+ | text-decoration:none; | ||
+ | color:#000000; | ||
+ | } | ||
+ | |||
+ | /* le menu de haut gauche */ | ||
+ | #menubar .left-menu | ||
+ | { | ||
+ | width: 100%; | ||
+ | background-color:transparent; | ||
+ | /*display:none;*/ | ||
+ | } | ||
+ | |||
+ | /* le menu de login haut droite*/ | ||
+ | .right-menu | ||
+ | { | ||
+ | color:transparent; | ||
+ | text-decoration:none; | ||
+ | text-align: right; | ||
+ | background-color:none; | ||
+ | right: 15px; | ||
+ | } | ||
+ | |||
+ | /* les lien du login */ | ||
+ | .right-menu a | ||
+ | { | ||
+ | color:transparent; | ||
+ | text-decoration:transparent; | ||
+ | background-color:none; | ||
+ | } | ||
+ | |||
+ | #menubar * | ||
+ | { | ||
+ | color: transparent !important; | ||
+ | background: transparent !important; | ||
+ | } | ||
+ | |||
+ | #top-section:hover #menubar * | ||
+ | { | ||
+ | color: blue !important; | ||
+ | } | ||
+ | |||
+ | #top-section:hover #menubar | ||
+ | { | ||
+ | background: rgba(255, 255, 255, 0.75) !important; | ||
+ | } | ||
+ | |||
+ | /* la barre de recherche*/ | ||
+ | #search-controls | ||
+ | { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | /* le body de la page*/ | ||
+ | #content | ||
+ | { | ||
+ | width: 100%; | ||
+ | background-color: transparent; | ||
+ | border:none; | ||
+ | padding:none; | ||
+ | margin:none; | ||
+ | line-height:1em; | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | #globalWrapper | ||
+ | { | ||
+ | font-size: 150%; | ||
+ | } | ||
+ | |||
+ | /*titre de page */ | ||
+ | .firstHeading | ||
+ | { | ||
+ | display:none; | ||
+ | border: none; | ||
+ | } | ||
+ | |||
+ | #footer-wrapper | ||
+ | { | ||
+ | position: relative; | ||
+ | width: 70%; | ||
+ | margin: auto; | ||
+ | margin-top:15px; | ||
+ | margin-bottom:5px; | ||
+ | background-color: transparent; | ||
+ | /* -moz-border-radius:15px; | ||
+ | -webkit-border-radius:15px; | ||
+ | border-radius: 15px; | ||
+ | box-shadow: 0px 4px 4px #1c1a19;*/ | ||
+ | } | ||
+ | |||
+ | #f-copyrightico | ||
+ | { | ||
+ | margin: 1% 0 1% 1%; | ||
+ | } | ||
+ | |||
+ | #f-poweredbyico | ||
+ | { | ||
+ | margin: 1% 1% 1% 0; | ||
+ | } | ||
+ | |||
+ | /* la boite en bas de page*/ | ||
+ | #footer-box | ||
+ | { | ||
+ | display: none; | ||
+ | margin-bottom: 10px; | ||
+ | } | ||
+ | |||
+ | /* le cadre sous le body useless */ | ||
+ | #catlinks | ||
+ | { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | ul | ||
+ | { | ||
+ | list-style-image: none; | ||
+ | line-height: 1.2em; | ||
+ | } | ||
+ | |||
+ | #maincontainer | ||
+ | { | ||
+ | padding-bottom: 15px; | ||
+ | margin-top: 30px; | ||
+ | background: transparent; | ||
+ | margin: auto; | ||
+ | text-align: justify; | ||
+ | width: 70%; /*940px*/ | ||
+ | heigth: auto; | ||
+ | border-bottom: 2px solid black; | ||
+ | } | ||
+ | |||
+ | |||
/* Site settings */ | /* Site settings */ | ||
- | + | a { | |
+ | text-decoration: underline; | ||
+ | } | ||
+ | |||
+ | a:link { | ||
+ | color: #927D9E; | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | |||
+ | a:visited { | ||
+ | color: #927D9E; | ||
+ | } | ||
+ | |||
+ | a:hover { | ||
+ | color: #E56FCC; | ||
+ | } | ||
+ | |||
+ | a * { | ||
+ | color: #927D9E; | ||
+ | text-decoration: underline; | ||
+ | } | ||
+ | |||
+ | sup { | ||
+ | font-size: 0.7em; | ||
+ | vertical-align: 0.3em; | ||
+ | } | ||
+ | |||
+ | sub { | ||
+ | font-size: 0.7em; | ||
+ | } | ||
+ | |||
+ | #header { | ||
+ | position: relative; | ||
+ | width: 80%; | ||
+ | left: 10%; | ||
+ | } | ||
- | + | #menu { | |
+ | width: 60%; | ||
+ | padding-left: 30%; | ||
+ | } | ||
- | + | /*********| HEADER |*************/ | |
- | + | #menu{ | |
+ | font-family: Helvetica, Arial, Sans serif; | ||
+ | padding: 0; | ||
+ | margin: 0 !important; | ||
+ | text-align: center; | ||
+ | font-size: 80%; | ||
+ | font-size: 1.3ch; | ||
+ | font-size: 0.98vw; | ||
+ | font-weight: bold; | ||
+ | background-color: #460000; | ||
+ | /*background-image: -webkit-linear-gradient(#7B0000,#BB1010); | ||
+ | background-image: -moz-linear-gradient(#7B0000,#BB1010); | ||
+ | background-image: -ms-linear-gradient(#7B0000,#BB1010); | ||
+ | background-image: -o-linear-gradient(#7B0000,#BB1010); | ||
+ | background-image: linear-gradient(#7B0000,#BB1010); | ||
+ | background-image: linear-gradient(#7B0000, #D0AD0F 50%, #F5DF00 50%, #7B0000); | ||
+ | background-image: linear-gradient(#7B0000, #D0AD0F 140%);*/ | ||
+ | border-top: 3px solid #370000; | ||
+ | box-shadow: 0 4px 4px #1C1A19; | ||
+ | -webkit-hyphens: none; | ||
+ | -moz-hyphens: none; | ||
+ | -ms-hyphens: none; | ||
+ | -o-hyphens: none; | ||
+ | hyphens: none; | ||
+ | z-index: 50; | ||
+ | } | ||
+ | |||
+ | #menu ul { | ||
+ | position: absolute; | ||
+ | top: 5.5em; | ||
+ | top: 5.5vw; | ||
+ | left:0; | ||
+ | max-height:0em; | ||
+ | margin:0 !important; | ||
+ | padding:0; | ||
+ | background-color: #7B0000; | ||
+ | background-image: linear-gradient(#7B0000, #460000); | ||
+ | overflow:hidden; | ||
+ | transition: 0.5s max-height 0.3s; | ||
+ | border-radius: 0 0 8px 8px; | ||
+ | } | ||
+ | |||
+ | #menu li { | ||
+ | display: inline-block; | ||
+ | list-style: none; /* for IE7 */ | ||
+ | margin: 0 0 0 -0.35%; | ||
+ | padding-bottom: 0.3%; | ||
+ | } | ||
+ | |||
+ | #menu > li { | ||
+ | width: 8%; | ||
+ | } | ||
+ | |||
+ | #menu > li, #menu > li li { | ||
+ | position: relative; | ||
+ | display:inline-block; | ||
+ | padding: auto; | ||
+ | background-color: transparent; | ||
+ | } | ||
- | + | #menu > li li { | |
+ | width: 100%; | ||
+ | padding: 3% 0; | ||
+ | } | ||
+ | |||
+ | #menu a { | ||
+ | display:inline-block; | ||
+ | margin: auto; | ||
+ | color: #fff; | ||
+ | text-decoration:none; | ||
+ | width: 100%; | ||
+ | } | ||
- | a | + | #menu a span{ |
+ | display: block; | ||
+ | margin: auto; | ||
+ | width: 50%; | ||
+ | } | ||
+ | |||
+ | #menu > li li { background: transparent none; } | ||
+ | |||
+ | #menu > li li a { color: #FFF; } | ||
- | + | #menu > li li:hover a { color: #F5DF00; } | |
+ | |||
+ | #menu > li li:hover { | ||
+ | background:#888888; | ||
+ | } | ||
+ | |||
+ | #menu > li:first-child { | ||
+ | border-left: 0; | ||
+ | } | ||
+ | |||
+ | #menu > li + li { | ||
+ | border-left: 1px solid #F5DF00; | ||
+ | } | ||
+ | |||
+ | #menu > li:last-child { | ||
+ | border-left: 1px solid #F5DF00; | ||
+ | } | ||
+ | |||
+ | #menu > li li:first-child { | ||
+ | border-bottom: 1px solid #F5DF00; | ||
+ | } | ||
+ | |||
+ | #menu > li li + li{ | ||
+ | border-top: 1px solid #aaa; | ||
+ | border-bottom: 1px solid #F5DF00; | ||
+ | } | ||
+ | |||
+ | #menu > li li:last-child { | ||
+ | border-top: 1px solid #aaa; | ||
+ | border-right: 0; | ||
+ | } | ||
- | + | #menu > li:hover { | |
+ | background-color: #7B0000; | ||
+ | } | ||
+ | |||
+ | #menu > li:hover ul { | ||
+ | max-height:20em; | ||
+ | } | ||
- | .xr_tl {position: absolute; white-space: pre; unicode-bidi:bidi-override;} | + | /* |
+ | .xr_tl { | ||
+ | position: absolute; | ||
+ | white-space: pre; | ||
+ | unicode-bidi: bidi-override; | ||
+ | } | ||
- | .xr_tr {position: absolute; white-space: pre; unicode-bidi:bidi-override; text-align:right;} | + | .xr_tr { |
+ | position: absolute; | ||
+ | white-space: pre; | ||
+ | unicode-bidi: bidi-override; | ||
+ | text-align: right; | ||
+ | } | ||
- | .xr_tc {position: absolute; white-space: pre; unicode-bidi:bidi-override; text-align:center;} | + | .xr_tc { |
+ | position: absolute; | ||
+ | white-space: pre; | ||
+ | unicode-bidi: bidi-override; | ||
+ | text-align: center; | ||
+ | } | ||
- | .xr_tj {position: absolute; unicode-bidi:bidi-override; text-align:justify;} | + | .xr_tj { |
+ | position: absolute; | ||
+ | unicode-bidi: bidi-override; | ||
+ | text-align:justify; | ||
+ | } | ||
- | .xr_ap {position: absolute; border:none;} | + | .xr_ap { |
+ | position: absolute; | ||
+ | border: none; | ||
+ | } | ||
- | .xr_ar {position: absolute; display:block;} | + | .xr_ar { |
+ | position: absolute; | ||
+ | display:block; | ||
+ | } | ||
- | .xr_ae {position: relative; border:none;} | + | .xr_ae { |
+ | position: relative; | ||
+ | border: none; | ||
+ | } | ||
- | .xr_tb {position: absolute; unicode-bidi:bidi-override;} | + | .xr_tb { |
+ | position: absolute; | ||
+ | unicode-bidi: bidi-override; | ||
+ | } | ||
- | .xr_tu {unicode-bidi:bidi-override;margin-top:0px;margin-bottom:0px;} | + | .xr_tu { |
+ | unicode-bidi: bidi-override; | ||
+ | margin-top: 0px; | ||
+ | margin-bottom: 0px; | ||
+ | } | ||
- | .xr_c_Theme_Color_1 {color:#5E5265;} | + | .xr_c_Theme_Color_1 { |
+ | color: #5E5265; | ||
+ | } | ||
- | .xr_c_Theme_Color_2 {color:#B6369B;} | + | .xr_c_Theme_Color_2 { |
+ | color: #B6369B; | ||
+ | } | ||
- | .xr_c_Website_Backdrop {color:#473F4C;} | + | .xr_c_Website_Backdrop { |
+ | color: #473F4C; | ||
+ | } | ||
- | .xr_c_Theme_Color_3 {color:#742191;} | + | .xr_c_Theme_Color_3 { |
+ | color: #742191; | ||
+ | } | ||
- | .xr_c_Light_Text {color:#FFFFFF;} | + | .xr_c_Light_Text { |
+ | color: #FFFFFF; | ||
+ | } */ |
Latest revision as of 10:15, 6 August 2014
body {
color: #000; font-family: Arial,sans-serif; font-size: 13px; font-weight: normal; font-style: normal; background-repeat:repeat-x; background-size: cover; background-color : #FFF; margin:0px 0px 0px 0px; /*-webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; -o-hyphens: auto; hyphens: auto;*/ text-decoration: none; letter-spacing: 0em;
}
/* la barre titre (banniere igem+ menu haut)*/
- top-section
{
height: 5px; width: auto; margin: 0; margin-bottom: -1.5em; padding: 0; border: 0 /*none transport*/;
}
/*le conteneur de la banière igem avec un lien vers igem*/
- p-logo
{
display:none; border:none; margin:none;
}
/* la barre de menu du haut */
- menubar
{
background: none repeat scroll 0 0 transparent !important; color: transparent !important; position: absolute; top: -6px; display: table-cell;
}
/*les lien de la barre de menu du haut */
- menubar a
{
text-decoration:none; color:#000000;
}
/* le menu de haut gauche */
- menubar .left-menu
{
width: 100%; background-color:transparent; /*display:none;*/
}
/* le menu de login haut droite*/ .right-menu {
color:transparent; text-decoration:none; text-align: right; background-color:none; right: 15px;
}
/* les lien du login */ .right-menu a {
color:transparent; text-decoration:transparent; background-color:none;
}
- menubar *
{ color: transparent !important; background: transparent !important; }
- top-section:hover #menubar *
{ color: blue !important; }
- top-section:hover #menubar
{ background: rgba(255, 255, 255, 0.75) !important; }
/* la barre de recherche*/
- search-controls
{
display:none;
}
/* le body de la page*/
- content
{
width: 100%; background-color: transparent; border:none; padding:none; margin:none; line-height:1em; color: white;
}
- globalWrapper
{
font-size: 150%;
}
/*titre de page */ .firstHeading {
display:none; border: none;
}
- footer-wrapper
{
position: relative; width: 70%; margin: auto; margin-top:15px; margin-bottom:5px; background-color: transparent;
/* -moz-border-radius:15px;
-webkit-border-radius:15px; border-radius: 15px; box-shadow: 0px 4px 4px #1c1a19;*/
}
- f-copyrightico
{
margin: 1% 0 1% 1%;
}
- f-poweredbyico
{
margin: 1% 1% 1% 0;
}
/* la boite en bas de page*/
- footer-box
{
display: none; margin-bottom: 10px;
}
/* le cadre sous le body useless */
- catlinks
{
display: none;
}
ul {
list-style-image: none; line-height: 1.2em;
}
- maincontainer
{
padding-bottom: 15px; margin-top: 30px; background: transparent; margin: auto; text-align: justify; width: 70%; /*940px*/ heigth: auto; border-bottom: 2px solid black;
}
/* Site settings */
a {
text-decoration: underline;
}
a:link {
color: #927D9E; cursor: pointer;
}
a:visited {
color: #927D9E;
}
a:hover {
color: #E56FCC;
}
a * {
color: #927D9E; text-decoration: underline;
}
sup {
font-size: 0.7em; vertical-align: 0.3em;
}
sub { font-size: 0.7em; }
- header {
position: relative; width: 80%; left: 10%;
}
- menu {
width: 60%; padding-left: 30%;
}
/*********| HEADER |*************/
- menu{
font-family: Helvetica, Arial, Sans serif; padding: 0; margin: 0 !important; text-align: center; font-size: 80%; font-size: 1.3ch; font-size: 0.98vw; font-weight: bold; background-color: #460000; /*background-image: -webkit-linear-gradient(#7B0000,#BB1010); background-image: -moz-linear-gradient(#7B0000,#BB1010); background-image: -ms-linear-gradient(#7B0000,#BB1010); background-image: -o-linear-gradient(#7B0000,#BB1010); background-image: linear-gradient(#7B0000,#BB1010); background-image: linear-gradient(#7B0000, #D0AD0F 50%, #F5DF00 50%, #7B0000); background-image: linear-gradient(#7B0000, #D0AD0F 140%);*/ border-top: 3px solid #370000; box-shadow: 0 4px 4px #1C1A19; -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; -o-hyphens: none; hyphens: none; z-index: 50;
}
- menu ul {
position: absolute; top: 5.5em; top: 5.5vw; left:0; max-height:0em; margin:0 !important; padding:0; background-color: #7B0000; background-image: linear-gradient(#7B0000, #460000); overflow:hidden; transition: 0.5s max-height 0.3s; border-radius: 0 0 8px 8px;
}
- menu li {
display: inline-block; list-style: none; /* for IE7 */ margin: 0 0 0 -0.35%; padding-bottom: 0.3%;
}
- menu > li {
width: 8%;
}
- menu > li, #menu > li li {
position: relative; display:inline-block; padding: auto; background-color: transparent;
}
- menu > li li {
width: 100%; padding: 3% 0;
}
- menu a {
display:inline-block; margin: auto; color: #fff; text-decoration:none; width: 100%;
}
- menu a span{
display: block; margin: auto; width: 50%;
}
- menu > li li { background: transparent none; }
- menu > li li a { color: #FFF; }
- menu > li li:hover a { color: #F5DF00; }
- menu > li li:hover {
background:#888888;
}
- menu > li:first-child {
border-left: 0;
}
- menu > li + li {
border-left: 1px solid #F5DF00;
}
- menu > li:last-child {
border-left: 1px solid #F5DF00;
}
- menu > li li:first-child {
border-bottom: 1px solid #F5DF00;
}
- menu > li li + li{
border-top: 1px solid #aaa; border-bottom: 1px solid #F5DF00;
}
- menu > li li:last-child {
border-top: 1px solid #aaa; border-right: 0;
}
- menu > li:hover {
background-color: #7B0000;
}
- menu > li:hover ul {
max-height:20em;
}
/* .xr_tl {
position: absolute; white-space: pre; unicode-bidi: bidi-override;
}
.xr_tr {
position: absolute; white-space: pre; unicode-bidi: bidi-override; text-align: right;
}
.xr_tc {
position: absolute; white-space: pre; unicode-bidi: bidi-override; text-align: center;
}
.xr_tj {
position: absolute; unicode-bidi: bidi-override; text-align:justify;
}
.xr_ap {
position: absolute; border: none;
}
.xr_ar {
position: absolute; display:block;
}
.xr_ae {
position: relative; border: none;
}
.xr_tb {
position: absolute; unicode-bidi: bidi-override;
}
.xr_tu {
unicode-bidi: bidi-override; margin-top: 0px; margin-bottom: 0px;
}
.xr_c_Theme_Color_1 {
color: #5E5265;
}
.xr_c_Theme_Color_2 {
color: #B6369B;
}
.xr_c_Website_Backdrop {
color: #473F4C;
}
.xr_c_Theme_Color_3 {
color: #742191;
}
.xr_c_Light_Text {
color: #FFFFFF;
} */