Team:Grenoble/Templates/Css current.css

From 2011.igem.org

(Difference between revisions)
Line 1: Line 1:
-
/* I <3 Paris */
 
-
#globalWrapper {/* le wiki */
 
-
    background-color: #ffffff;
 
-
    -bottom:0px;
 
-
}
 
-
 
-
#top-section{/* la barre titre (baniere igem+ menu haut)*/
 
-
    height: auto;
 
-
    margin-top: 0 px;
 
-
    margin-left: 0 px;
 
-
    margin-right: auto;
 
-
    margin-bottom: 0 ;
 
-
  /* margin-bottom: 10px; */
 
-
   
 
-
    border: none;
 
-
    display: display;
 
-
}
 
-
 
-
#p-logo{/*le conteneur de la banière igem avec un lien vers igem*/
 
-
    display:none;
 
-
    border:none;
 
-
    margin:none;
 
-
}
 
-
 
-
#menubar a{/*les lien de la barre de menu du haut */
 
-
    margin:5px 5px 0 0;
 
-
    text-decoration:none;
 
-
    color:#FFFFFF;
 
-
}
 
-
 
-
body {
 
-
 
-
margin:0;
 
-
 
-
:0;
 
-
 
-
width:100%;
 
-
 
-
 
-
 
-
}
 
-
 
-
html {
 
-
 
-
padding:0;
 
-
 
-
margin:0;
 
-
 
-
}
 
-
 
-
 
-
 
-
/* utilisé dans la banière */
 
-
img.blabla  {
 
-
 
-
width:100%;
 
-
 
-
height:auto;
 
-
 
-
}
 
-
 
-
 
-
h1 {
 
-
 
-
margin:0;
 
-
 
-
padding:30px 0 30px 32px;
 
-
 
-
color:#5c5c5c;
 
-
 
-
font:bold 45px/1.1em Arial, Helvetica, sans-serif;
 
-
 
-
text-transform:uppercase;
 
-
 
-
letter-spacing:-3px;
 
-
 
-
background:#000000 url(http://farm4.static.flickr.com/3067/3084131521_36c059f6f0_b.jpg) no-repeat top left;
 
-
 
-
}
 
-
 
-
h1 a, h1 a:hover {
 
-
 
-
color:#5c5c5c;
 
-
 
-
text-decoration:none;
 
-
 
-
}
 
-
 
-
h1 span {
 
-
 
-
font-weight:bold;
 
-
 
-
color:#8fc400;
 
-
 
-
}
 
-
 
-
/* in tartiflette we trust */
 
-
h1 small {
 
-
 
-
font:normal 13px/1.2em Arial, Helvetica, sans-serif;
 
-
 
-
color:#888;
 
-
 
-
letter-spacing:normal;
 
-
 
-
}
 
-
 
-
 
-
/* ---------------------- Dolphin nav ---------------------- */
 
-
#dolphincontainer{
 
-
    position:relative;
 
-
    height:70px;
 
-
    color:#000000;
 
-
    background:#fdf9f4;
 
-
    width:100%;
 
-
    font-family:Helvetica,Arial,Verdana,sans-serif;
 
-
}
 
-
 
-
#dolphinnav{
 
-
    position:relative;
 
-
    height:33px;
 
-
    font-size:16px;
 
-
    text-transform:uppercase;
 
-
    font-weight:bold;
 
-
    background:#fff url(https://static.igem.org/mediawiki/2011/b/b7/Dolphin_bg.png) repeat-x bottom left;
 
-
    padding:0 0 0 3px;
 
-
   
 
-
}
 
-
   
 
-
#dolphinnav ul{
 
-
    margin:0;
 
-
    padding:0;
 
-
    list-style:none;
 
-
    width:auto;
 
-
    float:left;
 
-
   
 
-
}
 
-
 
-
#dolphinnav ul li{
 
-
    display:block;
 
-
    float:left;
 
-
    margin:0 1px;
 
-
   
 
-
}
 
-
 
-
#dolphinnav ul li a{
 
-
    display:block;
 
-
    float:left;
 
-
    color:#eaf8ea;
 
-
    text-decoration:none;
 
-
    /*padding:12px 20px 0 20px;*/
 
-
    height:33px;
 
-
   
 
-
}
 
-
 
-
#dolphinnav ul li li a{
 
-
color:#5f5f5f;
 
-
}
 
-
 
-
#dolphinnav ul li a.level1{
 
-
 
 
-
    padding:12px 20px 0 20px;
 
-
   
 
-
}
 
-
 
-
#dolphinnav ul li.sfhover ul li a.level2{
 
-
   
 
-
color:#5f5f5f;
 
-
    margin: 5px 5px 15px 5px;
 
-
 
-
}
 
-
 
-
#dolphinnav ul li.sfhover ul li a.level2:hover{
 
-
   
 
-
color:#8f8f8f;
 
-
font-size:18px;
 
-
 
-
 
-
}
 
-
 
-
#dolphinnav ul li ul{
 
-
    position: absolute;
 
-
    left: -999em;
 
-
}
 
-
 
-
#dolphinnav ul li.sfhover a.level1{
 
-
    color:#5f5f5f;
 
-
    padding:0 20px 0 20px;
 
-
    background: #fcf6ee;
 
-
background: -webkit-gradient(linear, 0 0, 0 bottom, from(#fcf6ee), to(#fdf9f4));
 
-
background: -webkit-linear-gradient(#fcf6ee, #fdf9f4);
 
-
background: -moz-linear-gradient(#fcf6ee, #fdf9f4);
 
-
background: -ms-linear-gradient(#fcf6ee, #fdf9f4);
 
-
background: -o-linear-gradient(#fcf6ee, #fdf9f4);
 
-
background: linear-gradient(#fcf6ee, #fdf9f4);
 
-
 
-
 
-
    border: 1px solid #696;
 
-
    border-bottom: none;
 
-
 
-
 
-
    -moz-box-shadow: -2px -2px 2px #888;
 
-
    -webkit-box-shadow: -2px -2px 2px #888;
 
-
    box-shadow: -2px -2px 2px #888;
 
-
 
-
-webkit-border-radius: 5px 5px 0 0 ;
 
-
-moz-border-radius: 5px 5px 0 0 ;
 
-
border-radius: 5px 5px 0 0 ;
 
-
 
-
    line-height:275%;
 
-
}
 
-
 
-
 
-
 
-
#dolphinnav ul li.sfhover ul{
 
-
 
-
        left: 0;
 
-
        min-height: 0;
 
-
height: 23px;
 
-
background: #fdf9f4;
 
-
color:#5f5f5f;
 
-
margin: 43px 0 0 0 ;
 
-
overflow: hidden;
 
-
 
-
}
 
-
 
-
 
-
 
-
/* ---------------------- END Dolphin nav ---------------------- */
 
-
/*en cas d'emmerde avec image flottante*/
 
-
.clearboth {
 
-
clear:both;
 
-
}
 
-
 
-
.body {
 
-
 
-
margin:0;
 
-
 
-
padding:0;
 
-
 
-
}
 
-
 
-
 
-
.blocbackground {
 
-
 
 
-
border: 1px solid #696;
 
-
 
-
 
-
margin: 5px 0 20px 0;
 
-
padding: 0 0 20px 5px;
 
-
 
-
-webkit-box-shadow: #666 0px 2px 3px;
 
-
-moz-box-shadow: #666 0px 2px 3px;
 
-
 
-
-webkit-border-radius: 8px;
 
-
-moz-border-radius: 8px;
 
-
border-radius: 8px;
 
-
 
-
background: #fcf6ee;
 
-
background: -webkit-gradient(linear, 0 0, 0 bottom, from(#fcf6ee), to(#FFFFFF));
 
-
background: -webkit-linear-gradient(#fcf6ee, #FFFFFF);
 
-
background: -moz-linear-gradient(#fcf6ee, #FFFFFF);
 
-
background: -ms-linear-gradient(#fcf6ee, #FFFFFF);
 
-
background: -o-linear-gradient(#fcf6ee, #FFFFFF);
 
-
background: linear-gradient(#fcf6ee, #FFFFFF);
 
-
 
-
}
 
-
 
-
.body h2 {
 
-
 
-
font:bold 24px Arial, Helvetica, sans-serif;
 
-
 
-
color:#323a3f;
 
-
 
-
padding:10px 5px;
 
-
 
-
margin:5px 2px 12px 0;
 
-
 
-
}
 
-
 
-
.body h1 {
 
-
 
-
font:bold 34px Arial, Helvetica, sans-serif;
 
-
 
-
color:#323a3f;
 
-
 
-
padding:10px 5px;
 
-
 
-
margin:5px 2px 12px 0;
 
-
 
-
background : none;
 
-
 
-
}
 
-
 
-
 
-
 
-
.body h3 {
 
-
 
-
font:bold 24px Arial, Helvetica, sans-serif;
 
-
 
-
color:#323a3f;
 
-
 
-
padding:10px 5px;
 
-
 
-
margin:5px 0 10px 0;
 
-
 
-
}
 
-
 
-
.body h3 span.vert{
 
-
 
-
color:#8fc400;
 
-
 
-
}
 
-
 
-
 
-
 
-
.body h2 span {
 
-
 
-
float:right;
 
-
 
-
color:#959595;
 
-
 
-
font:normal 12px Arial, Helvetica, sans-serif;
 
-
 
-
}
 
-
 
-
.body p {
 
-
 
-
font:normal 12px Arial, Helvetica, sans-serif;
 
-
 
-
color:#5f5f5f;
 
-
 
-
padding:5px;
 
-
 
-
margin:0;
 
-
 
-
line-height:1.8em;
 
-
 
-
text-indent: 30px;
 
-
 
-
}
 
-
 
-
 
-
.body img {
 
-
 
-
clear:both;
 
-
 
-
padding:0;
 
-
 
-
-webkit-border-radius: 8px;
 
-
-moz-border-radius: 8px;
 
-
border-radius: 8px;
 
-
 
-
 
-
}
 
-
 
-
/*exemple: photo memnbre équipe, c'est un flottant, utiliser .clearboth en cas de besoin*/
 
-
 
-
.body img.icon {
 
-
 
 
-
 
-
float:left;
 
-
 
-
margin: 8px 5px 2px 0;
 
-
 
-
width:80px;
 
-
 
-
height:auto;
 
-
 
-
border: 1px solid #696;
 
-
 
-
-webkit-border-radius: 5px;
 
-
-moz-border-radius: 5px;
 
-
border-radius: 5px;
 
-
 
-
-webkit-box-shadow: #666 0px 2px 3px;
 
-
-moz-box-shadow: #666 0px 2px 3px;
 
-
 
-
}
 
-
/*
 
-
pour renbdre flottant une image qui n'est pas flottante si elle n'est pas un icon car .body img luiu met le clearboth du coup elle est plus flottante*/
 
-
 
-
.body img.floated {
 
-
 
-
float:right;
 
-
 
-
margin:5px 10px 5px 0;
 
-
 
-
padding:0;
 
-
 
-
width:auto;
 
-
 
-
height:auto;
 
-
 
-
}
 
-
 
-
.body a {
 
-
 
-
color:#97c950;
 
-
 
-
text-decoration:underline;
 
-
 
-
}
 
-
 
-
.body a:hover {
 
-
 
-
color:#90c950;
 
-
 
-
text-decoration:underline;
 
-
 
-
}
 
-
 
-
/*marge à vérif*/
 
-
 
-
.body h2.lien:hover{
 
-
 
-
margin: 0px 80px 0 0 ;
 
-
 
 
-
background-color: #D8FFC8;
 
-
 
-
}
 
-
 
-
/*
 
-
limite taille de l'intérieur de la page pour pas dépasser sur le menu/colonne de droite*/
 
-
 
-
.left {
 
-
 
-
float:left;
 
-
 
-
width:65%;
 
-
 
-
margin:10px 0px 10px 25px;
 
-
 
-
padding: 0 25px;
 
-
 
-
background:url(images/l_bg.gif) top left no-repeat;
 
-
 
-
 
-
}
 
-
 
-
.left ul {
 
-
list-style: circle;
 
-
clear:both;
 
-
}
 
-
 
-
.left ul li {
 
-
 
 
-
font:bold 14px Arial, Helvetica, sans-serif;
 
-
 
-
color:#5f5f5f;
 
-
 
-
}
 
-
/*
 
-
width: alloue une certaine portion de la pge, un cadre possiblement rempli (calculé à partir de la gauche probablement du au float lefgt) les marges réduise l'occupation dans ce cadre*/
 
-
 
-
.right {
 
-
 
-
 
-
 
-
float:right;
 
-
 
-
width:20%;
 
-
 
-
margin:10px 10px 0 0;
 
-
 
-
padding:0 25px;
 
-
 
-
 
-
 
-
}
 
-
 
-
.right ul {
 
-
 
-
list-style:none;
 
-
 
-
margin:5px 0;
 
-
 
-
padding:0;
 
-
 
-
}
 
-
 
-
.right li {
 
-
 
-
background:10px 10px no-repeat;
 
-
 
-
font:normal 14px Arial, Helvetica, sans-serif;
 
-
 
-
color:#464646;
 
-
 
-
padding:5px 0;
 
-
 
-
margin:3px 0;
 
-
 
-
}
 
-
 
-
.right li a {
 
-
 
-
padding:0 0 0 5px;
 
-
 
-
margin:0;
 
-
 
-
font:bold 17px Arial, Helvetica, sans-serif;
 
-
 
-
color:#5f5f5f;
 
-
 
-
text-decoration:none;
 
-
 
-
}
 
-
 
-
.right li a:hover {
 
-
 
-
color:#97c950;
 
-
 
-
margin:5px;
 
-
 
-
/*background-color:#a2cd9a;*/
 
-
 
-
text-decoration:none;
 
-
 
-
}
 
/* I <3 Paris */
/* I <3 Paris */
#globalWrapper {/* le wiki */
#globalWrapper {/* le wiki */
Line 1,031: Line 511:
.right li a:hover {
.right li a:hover {
-
color:#97c950;
+
color:#8f8f8f;
margin:5px;
margin:5px;

Revision as of 13:37, 8 August 2011

/* I <3 Paris */

  1. globalWrapper {/* le wiki */
    background-color: #ffffff;
   -bottom:0px;

}

  1. top-section{/* la barre titre (baniere igem+ menu haut)*/
   height: auto;
   margin-top: 0 px;
   margin-left: 0 px;
   margin-right: auto;
   margin-bottom: 0 ;
  /* margin-bottom: 10px; */
   
   border: none;
   display: display;

}

  1. p-logo{/*le conteneur de la banière igem avec un lien vers igem*/
   display:none;
   border:none;
   margin:none;

}

  1. menubar a{/*les lien de la barre de menu du haut */
   margin:5px 5px 0 0;
   text-decoration:none;
   color:#FFFFFF;

}

body {

margin:0;

padding:0;

width:100%;


}

html {

padding:0;

margin:0;

}


/* utilisé dans la banière */ img.blabla {

width:100%;

height:auto;

}


h1 {

margin:0;

padding:30px 0 30px 32px;

color:#5c5c5c;

font:bold 45px/1.1em Arial, Helvetica, sans-serif;

text-transform:uppercase;

letter-spacing:-3px;

background:#000000 url(http://farm4.static.flickr.com/3067/3084131521_36c059f6f0_b.jpg) no-repeat top left;

}

h1 a, h1 a:hover {

color:#5c5c5c;

text-decoration:none;

}

h1 span {

font-weight:bold;

color:#8fc400;

}

/* in tartiflette we trust */ h1 small {

font:normal 13px/1.2em Arial, Helvetica, sans-serif;

color:#888;

letter-spacing:normal;

}


/* ---------------------- Dolphin nav ---------------------- */

  1. dolphincontainer{
   position:relative;
   height:70px;
   color:#000000;
   background:#fdf9f4;
   width:100%;
   font-family:Helvetica,Arial,Verdana,sans-serif;

}

  1. dolphinnav{
   position:relative;
   height:33px;
   font-size:12px;
   text-transform:uppercase;
   font-weight:bold;
   background:#fff url(Dolphin_bg.png) repeat-x bottom left;
   padding:0 0 0 3px;
   

}

  1. dolphinnav ul{
   margin:0;
   padding:0;
   list-style:none;
   width:auto;
   float:left;
   

}

  1. dolphinnav ul li{
   display:block;
   float:left;
   margin:0 1px;
   

}

  1. dolphinnav ul li a{
   display:block;
   float:left;
   color:#eaf8ea;
   text-decoration:none;
   /*padding:12px 20px 0 20px;*/
   height:33px;
   

}

  1. dolphinnav ul li li a{

color:#5f5f5f; }

  1. dolphinnav ul li a.level1{
   padding:12px 20px 0 20px;
   

}

  1. dolphinnav ul li.sfhover ul li a.level2{

color:#5f5f5f;

   	margin: 5px 5px 15px 5px;
   	font-size:16px;

}

  1. dolphinnav ul li.sfhover ul li a.level2:hover{

color:#8f8f8f; font-size:18px;


}

  1. dolphinnav ul li ul{
   position: absolute;
   left: -999em;

}

  1. dolphinnav ul li.sfhover a.level1{
   color:#5f5f5f;
   padding:0 20px 0 20px;
   background: #fcf6ee;

background: -webkit-gradient(linear, 0 0, 0 bottom, from(#fcf6ee), to(#fdf9f4)); background: -webkit-linear-gradient(#fcf6ee, #fdf9f4); background: -moz-linear-gradient(#fcf6ee, #fdf9f4); background: -ms-linear-gradient(#fcf6ee, #fdf9f4); background: -o-linear-gradient(#fcf6ee, #fdf9f4); background: linear-gradient(#fcf6ee, #fdf9f4);


   border: 1px solid #696;
   border-bottom: none;


    -moz-box-shadow: -2px -2px 2px #888;
    -webkit-box-shadow: -2px -2px 2px #888;
    box-shadow: -2px -2px 2px #888;

-webkit-border-radius: 5px 5px 0 0 ; -moz-border-radius: 5px 5px 0 0 ; border-radius: 5px 5px 0 0 ;

   line-height:275%;

}


  1. dolphinnav ul li.sfhover ul{
       left: 0;
       min-height: 0;

height: 23px; background: #fdf9f4; color:#5f5f5f; margin: 43px 0 0 0 ; overflow: hidden;

}


/* ---------------------- END Dolphin nav ---------------------- */ /*en cas d'emmerde avec image flottante*/ .clearboth { clear:both; }

.body {

margin:0;

padding:0;

}


.blocbackground {

border: 1px solid #696;


margin: 5px 0 20px 0; padding: 0 0 20px 5px;

-webkit-box-shadow: #666 0px 2px 3px; -moz-box-shadow: #666 0px 2px 3px;

-webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px;

background: #fcf6ee; background: -webkit-gradient(linear, 0 0, 0 bottom, from(#fcf6ee), to(#FFFFFF)); background: -webkit-linear-gradient(#fcf6ee, #FFFFFF); background: -moz-linear-gradient(#fcf6ee, #FFFFFF); background: -ms-linear-gradient(#fcf6ee, #FFFFFF); background: -o-linear-gradient(#fcf6ee, #FFFFFF); background: linear-gradient(#fcf6ee, #FFFFFF);

}

.body h2 {

font:bold 24px Arial, Helvetica, sans-serif;

color:#323a3f;

padding:10px 5px;

margin:5px 2px 12px 0;

}

.body h1 {

font:bold 34px Arial, Helvetica, sans-serif;

color:#323a3f;

padding:10px 5px;

margin:5px 2px 12px 0;

background : none;

}


.body h3 {

font:bold 24px Arial, Helvetica, sans-serif;

color:#323a3f;

padding:10px 5px;

margin:5px 0 10px 0;

}

.body h3 span.vert{

color:#8fc400;

}


.body h2 span {

float:right;

color:#959595;

font:normal 12px Arial, Helvetica, sans-serif;

}

.body p {

font:normal 12px Arial, Helvetica, sans-serif;

color:#5f5f5f;

padding:5px;

margin:0;

line-height:1.8em;

text-indent: 30px;

}


.body img {

clear:both;

padding:0;

-webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px;


}

/*exemple: photo memnbre équipe, c'est un flottant, utiliser .clearboth en cas de besoin*/

.body img.icon {


float:left;

margin: 8px 5px 2px 0;

width:80px;

height:auto;

border: 1px solid #696;

-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;

-webkit-box-shadow: #666 0px 2px 3px; -moz-box-shadow: #666 0px 2px 3px;

} /* pour renbdre flottant une image qui n'est pas flottante si elle n'est pas un icon car .body img luiu met le clearboth du coup elle est plus flottante*/

.body img.floated {

float:right;

margin:5px 10px 5px 0;

padding:0;

width:auto;

height:auto;

}

.body a {

color:#97c950;

text-decoration:underline;

}

.body a:hover {

color:#90c950;

text-decoration:underline;

}

/*marge à vérif*/

.body h2.lien:hover{

margin: 0px 80px 0 0 ;

background-color: #D8FFC8;

}

/* limite taille de l'intérieur de la page pour pas dépasser sur le menu/colonne de droite*/

.left {

float:left;

width:65%;

margin:10px 0px 10px 25px;

padding: 0 25px;

background:url(images/l_bg.gif) top left no-repeat;


}

.left ul { list-style: circle; clear:both; }

.left ul li {

font:bold 14px Arial, Helvetica, sans-serif;

color:#5f5f5f;

} /* width: alloue une certaine portion de la pge, un cadre possiblement rempli (calculé à partir de la gauche probablement du au float lefgt) les marges réduise l'occupation dans ce cadre*/

.right {


float:right;

width:20%;

margin:10px 10px 0 0;

padding:0 25px;


}

.right ul {

list-style:none;

margin:5px 0;

padding:0;

}

.right li {

background:10px 10px no-repeat;

font:normal 14px Arial, Helvetica, sans-serif;

color:#464646;

padding:5px 0;

margin:3px 0;

}

.right li a {

padding:0 0 0 5px;

margin:0;

font:bold 17px Arial, Helvetica, sans-serif;

color:#5f5f5f;

text-decoration:none;

}

.right li a:hover {

color:#8f8f8f;

margin:5px;

/*background-color:#a2cd9a;*/

text-decoration:none;

}