controlmind11/Site-agence-immobiliere — Issue #1: style.css
Author: controlmind11
Created: 2011-12-03 09:32:37+00:00
State: open

/*Inclusion des fichiers necessaires pour le font .*/
@font-face { font-family: "Raleway"; font-style: normal; src: local("Raleway"), url('font/Raleway.ttf'); }
@font-face { font-family: "Graublau"; font-style: normal; src: local("Graublau"), url('font/Graublau.otf'); }

body
{
padding-left: 13em;
/*background-color : #A0F0F0; */
width:900px;

background:url(../images/bg.jpg) top;
/*background="images/bg.jpg" width="100%" height="100%" */
}

h1
{
font-family: 'Arial';
color : blue;
}

.element_menu_droite
{
position: absolute;
float:left;

top: 2em;
left: 1em;
width: 9em;
right: 0;

margin-top: 35.5em;

border-width : 5px;
background-color: #fff;
padding: 10px 10px 10px 10px;
padding: 10px 10px 10px 10px;
border: 1px solid #9b9b9b;
border-style:inset;
border-radius: 8px ;
}

.alert_message
{
position: relatif;
float:right;
top: 2em;
left: 0em;
width: 11em;

margin-top: -20.5em;
margin-right: -20em;

background-color:#B0C4DE;
text-align:center;

border:2px solid;
border-color:#DCDCDC #696969 #DCDCDC #696969;
}

.logo
{
font-family: Raleway, Georgia, "Comic Sans MS", Arial, serif;
color : #00008B;
font-size: 2.3em;

}

.center
{
text-align : center;
font-family:'Comic Sans MS';
font-size : 14px;
}

.Titre
{
text-align : center;

font-family: Raleway, Georgia, "Comic Sans MS", Arial, serif;
color : red;
font-size : 40px;
text-decoration:underline;
}

#entete
{

}

#pied_de_page
{
font-family: 'Arial';
color : #696969;
font-size : 9px;
}

#corps
{
background-color: #fff;
padding: 20px 20px 20px 20px;
margin-left: 0px;
margin-right: 5px;
min-height: 475px;
width: 960px;
border: 1px solid #9b9b9b;
border-radius: 8px ;
}

#header
{
height:240px;
margin-left:auto;
margin-right:auto;
background-image:url(images/smiley/1.gif);
text-align:center;
padding:0;
}

#corps ul
{
padding : 2;
margin : 0;
top : 2em;
list-style-type:none;
}

#corps li
{
margin-left:2px;
font-size:26px;

}

#corps ul li a
{
display:block;
float:left;
width:305px;
background-color:#6495ED;
text-align:center;
text-decoration:none;

}
#corps ul li a:hover
{
background-color:#D3D3D3;
border-color:#696969 #DCDCDC #DCDCDC #696969;
}
#corps ul li a:link
{
}
#corps ul li a:visited
{

}
/*.element_menu_gauche
{

position: absolute;
float:left;

top: 2em;
left: 1em;
width: 11em;
right: 0;

margin-top: 20.5em;*/

/*
border-width : 5px;
border-color : green;
border-style : inset;*/

/*}

.element_menu_gauche ul
{
padding : 5px;
margin : 0;
list-style-type:none;
}

.element_menu_gauche li
{
margin-left:2px;
float:left;
}

.element_menu_gauche ul li a
{
display:block;
float:left;
width:150px;
background-color:#6495ED;
color: black;
text-align:center;
text-decoration:none;
padding:7px;
border:2.5px solid;
border-color:#DCDCDC #696969 #DCDCDC #696969;

}
.element_menu_gauche ul li a:hover
{
background-color:#D3D3D3;
border-color:#696969 #DCDCDC #DCDCDC #696969;
}*/

.explication
{
color : #800000;
font-size : 20px;
text-decoration: underline blink;

font-family: Raleway, Georgia, "Comic Sans MS", Arial, serif;

font-size : 40px;

}

.connexion
{
position: absolute;
float :right;
top: 1em;
width: 15em;
height:10em;
right: 8em;

margin-top: 0em;
margin-left: 10.5em;

border-width : 10px;
border-color : #DCDCDC;
border-style : inset;
border-radius: 82px ;
text-align:center;
}

.connexion a
{
text-decoration:none;
text-align:center;
}

#acheter
{
background-color: #fff;
padding: 20px 20px 20px 20px;
margin-left: 0px;
margin-right: 5px;
min-height: 475px;
width: 960px;
border: 1px solid #9b9b9b;
border-radius: 8px ;
}

#vendre
{
background-color: #fff;
padding: 20px 20px 20px 20px;
margin-left: 0px;
margin-right: 5px;
min-height: 475px;
width: 960px;
border: 1px solid #9b9b9b;
border-radius: 8px ;
}

.contenu-recherche
{
display:block;
float:left;
width:70em;
margin-left: 60px;

}

.titre-recherche
{
font-family: Raleway, Georgia, "Comic Sans MS", Arial, serif;
color : #00008B;
font-size: 1.3em;
text-decoration:underline;

}
.element_menu_gauche
{

position: absolute;
float:left;

top: 2em;
left: 1em;
right: 0;

margin-top: 15.5em;

/*
border-width : 5px;
border-color : green;
border-style : inset;*/

}

.element_menu_gauche ul
{
padding : 5px;
margin:0px;
list-style:none;
font: 1em "lucida grande",arial;
}

.element_menu_gauche li
{
float:left;
clear:left;
background:#6495ED;

/* Already working on webkit */

-webkit-transition-property: background-color, padding-left;
-webkit-transition-duration: .5s, .3s;
-webkit-transition-timing-function: linear, ease-out;

/* When being supported by FF */

-moz-transition-property: background-color, padding-left;
-moz-transition-duration: .5s, .3s;
-moz-transition-timing-function: linear, ease-out;

/* … and if it's standardised one day (#optimism) */

transition-property: background-color, padding-left;
transition-duration: .5s, .3s;
transition-timing-function: linear, ease-out;

}

.element_menu_gauche a
{
border:2.5px solid;
border-color:#DCDCDC #696969 #DCDCDC #696969;

display:block;
padding:3px 8px;
color:#fff;
text-decoration:none;

}

.element_menu_gauche li:hover
{
background:#09f;
padding-left:15px;
}
.changerCouleur {

padding: 2px;

/* Fonctionne déjà sur webkit */
-webkit-transition-property: background-color;
-webkit-transition-duration: 2s;

/* Bientôt supporté par Firefox */
-moz-transition-property: background-color;
-moz-transition-duration: 2s;

/* … et lorsque ce sera standardisé */
transition-property: background-color;
transition-duration: 2s;

}

.changerCouleur:hover, .changerCouleur:focus
{
background-color: #fc0;
}

.contactez-nous
{
padding : 5px;
margin:0px;
list-style:none;
font-size: 18px;
}
.contact-form
{
background-color:#B0C4DE;
text-align:center;
}

.awesome
{
background-color:#9ACD32;
color:#F5F5F5;

}
.awesome:hover
{
color:black;
background-color:#9ACD32;
}

#styleTable table {
border-width:1px;
border-style:solid;
border-color:black;
width:50%;
}
#styleTable td {
border-width:1px;
border-style:solid;
border-color:red;
width:50%;
}
.grise {
border:1px solid black;
background-color:silver;
}
.blue {
border:1px solid blue;
}

#mail table {
width: 50%; /* La largeur c'est pour le test, mais ça montre qu'il est aussi possible de la spécifier en CSS */
border: 1px gray; /* Et on met une jolie bordure originale autour du tableau */
}
#mail caption {
text-align: center; /* Classique : texte centré */
font-style: italic; /* en italique */
font-weight: bold; /* en gras */
color: #0066CC; /* et en bleu */
}
#mail tr { /* Préférable à thead car offre plus de possibilités */
background-color: #D3E2ED; /* Chaque case d'en-tête aura un fond bleu */
color: #666666; /* Et un gris un peu plus foncé que la moyenne */
width:140px;
}
/*#mail td {
border: 1px inset gray;*/ /* Vous pouvez essayer de dé-commenter : cela produit un affichage classique des cases
}*/
#mail td:hover
{
background-color:#9ACD32;
}