/*
* CSS 2 pour Web Stands/
* By France Lavallé, http://www.webstands.net/
* sous Licence Creative Commons by-nc-sa : Paternité - Pas d'Utilisation Commerciale - Partage des Conditions Initiales à l'Identique 2.0 France./
* http://creativecommons.org/licenses/by-nc-sa/2.0/fr/
* Last mod 2009 JAnuary 18 /
*/
/*--------------------------------*/
/* Style généraux */
/*--------------------------------*/
body, html {
margin: 0;
padding: 0;
}
body{
text-align: center;
font-size: 62.4%;
background-image: url('img/bg_v.jpg');
background-repeat: repeat-x;
color: #2f4e2b; /* couleur de texte vert noir */
font-family: Georgia, Times, "Bookman Old Style", serif;
}
#gdconteneur {
text-align: left;
width: 95%;
min-width: 800px;
max-width: 1200px;
margin: 0 auto;
position: relative;
top: 0;
z-index:10;
}
p {
margin-bottom: 10px;
line-height: 19px;
text-align: justify;
font-size: 1em;
}
/*affichage des liens internes et externes, visités ou non, au contact du pointeur*/
a {
font-weight: bold;
text-decoration: none;
font-size: 0.9em;
color: #8c3918; /*orange rouge */
text-decoration: none;
}
a.external {
color: #8c3918; /*orange rouge */
font-style: italic;
text-decoration: underline;
}
a:visited, a.external:visited {color: #a65130; /*orange rouge effacé*/ }
a:hover, a:focus, a:active, a.external:hover, a.external:focus , a.external:active {
text-decoration: underline;
color: #a65130; /*orange rouge effacé*/
}
/*affichage des images liens */
a img { border: none; }
/* Titres, polices : taille couleurs*/
#contenu h2 {
margin-top: 5px;
padding: 0.5em;
font-size: 1.40em;
text-align: center;
color: #fff;
background: #3f6e3a; /*vert foncé du fond de page */
border-top: 2px solid #ee9900; /* oranger */
border-bottom: 2px solid #ee9900; /* oranger */
background-image: url('img/h2.jpg');
background-repeat: no-repeat;
background-position: right 0;
}
h3 {
margin-top: 3px;
font-size: 1.25em;
font-weight: bold;
color: #e69226; /*oranger foncé*/
}
h3:first-letter {
font-size: 120%;
font-weight: bold;
}
h4 {
margin-top: 3px;
font-size: 1.15em;
font-weight: bold;
color: #202b1f; /* noir vert*/
}
h5 {
font-size: 1em;
}
em {
font-weight: bold;
font-size: 1em;
}
/* texte centré en gras sur fond vert soutenu et bordé de noir */
p.centre {
font-size: 1em;
margin-bottom: 8px;
line-height: 19px;
text-align: center;
font-weight: bold;
color: #fff;
background: #3f6e3a; /*vert foncé du fond de page */
border-top: 1px solid #ee9900; /* oranger */
border-bottom: 1px solid #ee9900; /* oranger */
background-image: url('img/h2.jpg');
background-repeat: no-repeat;
background-position: right 0;
}
p.ital{
font-style: italic;
font-size: 0.9em;
}
blockquote { text-align: justify; }
q {font-style: italic; }
legend {
color: #b3c3b2; /* vert gris très effacé */
font-weight: bold;
}
/* sigles, acronymes, abréviations */
/* affiche un point d'interrogation sera lu en texte normal*/
abbr{
cursor:help;
border-bottom: #000 1px dotted;
}
/* affiche un point d'interrogation le sigle sera lu en épelant*/
acronym{
cursor:help;
border-bottom: #000 1px dotted;
speak:spell-out;
}
/* sert à étirer les boites apres un float */
.spacer {
clear: both;
visibility: hidden;
height: 0;
}
/*Trait de séparation */
.space {
clear: both;
margin-bottom: 8px;
height: 1px;
border-bottom: solid black 1px;
}
.retour {
height: 25px;
padding: 0.3em;
margin-left: 215px;
margin-right: 10px;
background: #ee9900; /* oranger */
text-align: right;
font-weight: bold;
font-size: 1em;
}
/*
* Styles spécifiques
*/
#header, #lienstop, #menu, #menu ul, .services ul, #contact ul {list-style: none; }
#nav span, #header span, #testaaa span, #fildariane span, .retour span, .contenu span, #gauche span, .services span, .menu span, .contact span, .formulaire span, .lienstop span { display:none; }
/* liens de navigation centrés en haut de page */
#nav {
text-align: center;
width: 100%;
z-index: 10;
position: absolute;
top: 4px;
left: 0;
right: 0;
margin: 0;
font-size: 1.1em;
}
#nav, #nav * { color: #798c76; /* vert gris très effacé*/ }
/*
*Afichage du logo de l'entête et du menu dans la même div header
*/
#header{
padding: .5em;
/*vidth: 100%;*/
}
/* l'image logo*/
a.image {
float: left;
clear: left;
margin: 0;
padding: 0;
display:inline;
/* définition de la classe "image" de la balise */
display: block; /* la balise a doit être en bloc */
width: 780px; /* largeur de l'image réactive */
height: 120px; /* hauteur de l'image réactive */
background-image: url('img/logo4.jpg'); /* source de l'image de départ */
background-repeat: no-repeat;
}
a.image:hover { /* définition de la classe "image" de la balise au survol */
background-image: url('img/logo2.jpg'); /* source de l'image d'arrivée */
}
/* arborescence du site */
#fildariane {
float: right;
text-align: right;
padding: 0;
margin-top: 0;
margin-right: 5px;
width: 100%;
/*width: 100% */
font-size: 1em;
color: #7b9e78; /* vert effacé */
}
#fildariane a{
color: #a85e42; /*orange brique */
}
#fildariane a:hover, #fildariane a:focus, #fildariane a:active {
color: #bf7357; /*orange brique effacé*/
}
/* le menu déroulant du header */
#menu, #menu ul {
float: right;
clear: right;
padding: 0;
margin-top: 0;
margin-right: 0.5em;
font-weight: bold;
font-size: 11pt;
}
#menu a {
display: block;
width: 7em;
margin: 0;
padding: 0;
font-size: 11pt;
text-align: center;
}
#menu li {
float: left;
width: 7em;
margin: 0 5px 0 0;
background: #ee9900; /*oranger */
}
#menu li ul {
position: absolute;
width: 7em;
left: -999em;
font-weight: bold;
margin: 0;
padding: 0;
font-size: 11pt;
}
#menu li:hover ul, #menu li.sfhover ul { /* listes imbriquées sous les items de listes survolés */
left: auto;
}
#menu li a:hover, #menu li a.sfhover, #menu li a:focus {background: #f3c847; /* jaune */ }
/*
*différents blocs
*/
/* affichage de la colonne gauche et du contenu au centre*/
#conteneur {
width: 100%;
margin-top: 4em;
}
#contenu {
margin-left: 220px;
margin-right: 10px;
margin-top: 0;
padding: 1em 0.5em;
background-color: #fff;
font-size: 1.2em;
clear: both;
}
#contenu {
border-right: 2px solid #ee9900; /* oranger */
border-bottom: 2px solid #ee9900; /* oranger */
}
/* Blocs spécifiques page index */
.blocIndex1 {
display: block;
float:left;
margin: 0 10px 0 0;
padding: 5px;
width: 46%;
height: auto;
text-align :left;
}
.blocIndex2 {
display: block;
float:left;
margin: 0;
padding: 5px;
width:46%;
height: auto;
text-align :left;
}
/* affichage google adense */
#adsense {
margin:0 0 0 0.5em;
padding:0 0 0 0.5em;
Float: right;
clear: right;
width: 120px;
height: 240px;
}
#adsenseLiens {
margin: 0.5em;
padding:0.5em;
Float: right;
clear: right;
width: 120px;
height: 90px;
border: 1px solid #2c8930;
}
.contenu ul, .contenu ol {
margin-left: 40px;
padding-left: 0;
}
#contenu ul li {
list-style-image: url('img/puce.gif');
list-style-position: outside;
font-size: 1.2em;
}
#contenu ol li {
list-style-type: decimal;
list-style-position: inside;
font-size: 1.2em;}
#contenu dt {
padding-top: 2ex;
font-size: 1.2em; }
#contenu dd {
list-style-position: outside;
text-align: justify;
padding-top: 1ex;
font-size: 1.2em;
}
/* affichage des images dans le contenu de page */
#contenu img {
float: left;
margin: 0;
padding: 0 0.2em;
display: inline;
border: none;
}
#contenu a img {
float: left;
margin: 0;
padding: 0 0.5em;
display: inline;
border: none;
}
#contenu p img {float: none; clear:both;}
#contenu fieldset{
margin-right: 8em;
border: solid 1px #475460; /* gris soutenu */
}
#contenu fieldset p{
font-size: 1.1em;
}
/* Texte défilant positionnement avec Javascript activé*/
#conteneur_defil {
border:0px solid;
width:250px;
margin:0 auto;
overflow:hidden;
line-height:normal;
}
#cadre_defil {
position:relative;
width:250px;
height:23px;
overflow:hidden;
background-color:#fff;}
#cadre_defil img{
vertical-align: middle;
border:0;
}
#defile {
position:absolute;
width:920px;
font-family: Georgia, Times, "Bookman Old Style", serif;
font-size:16px;
color:#000;}
#defile .liens {
text-decoration:none;
color: #8c3918; /*orange rouge */
}
/* boite de test aaa */
#testaaa{
position: relative;
margin: 0 auto;
width: 250px;
height: 30px;
padding: .3em;
background: #b3c3b2; /* vert gris très effacé */
border: 2px ridge #b3c3b2; /* vert gris très effacé */
text-align: center;
}
#testaaa p{
margin: .3em;
line-height: 12px;
text-align: center;
font-size: 1.1em;
}
#testaaa a{
text-decoration: none;
font-size: 1em;
}
#testaaa a.external:visited {color: #a65130; /*orange rouge effacé*/
text-decoration: none;
}
#testaaa a.external:hover, a.external:focus , a.external:active {
text-decoration: underline;
color: #a65130; /*orange rouge effacé*/
}
/* ---plan d'accès javascript activé--- */
#map{
float: left;
clear: left;
width: 400px;
height: 280px;
margin: 0.5em 1.5em 0.5em 0;
}
/* ---plan d'accès javascript désactivé--- */
#map2{
float: left;
width: 400px;
height: 280px;
margin:0;
}
/*
* les blocs de la colonne gauche
*/
/*bloc services positionnement, couleurs et taille des polices */
#gauche {
position: absolute;
left: 5px;
width: 200px;
font-size: 1.40em;
}
/* moteurs de recherche */
#recherche {
float: left;
clear: left;
margin-top: .2em;
margin-left: 0.5em;
}
#recherche form{
margin:0;
padding-top: 2px;
}
#recherche p{
width: 140px;
w\idth : 140px;
display: block;
padding: 0;
margin: 0;
text-align: left;
}
#recherche input {
margin-top: 3px;
background: #b3c3b2; /* vert gris très effacé */
display: inline;
}
/* moteur nouvelle recherche sur la page de résultats du moteur*/
#recherche2 {
float: left;
clear:left;
margin-left: 1em;
width: 100%;
}
#recherche2 form{
margin:0;
padding-top: 5px;
}
#recherche2 p{
width: 350px;
w\idth : 350px;
padding: 0;
margin: 0;
display: inline;
text-align: left;
}
#recherche2 p input {
margin-top: 5px;
background: #b3c3b2; /* vert gris très effacé */
display: inline;
}
/*Liste des services, colonne gauche*/
.services h2 {
margin: 0;
padding: 10px 0 0 10px;
font-size: 1em;
text-align: left;
color: #dedede; /* gris clair */
font-weight: bold;
}
.services {
padding: 0 0 0.3em 0;
margin-top: 1em;
width: 180px;
background-color: #3f6e3a; /* vert foncé */
font-size: 0.9em;
background-image: url('img/bgServices.jpg');
background-repeat: no-repeat;
}
.services ul{
width: 175px;
margin: 5px 0 0 10px;
padding: 0;
background: #ee9900; /* oranger */
}
.services li a{
margin-left : 2px;
padding: 0;
text-align: left;
}
/* Affichage des boutons publicitaires */
#gauche img{
float: left;
clear: left;
margin: 0;
padding: 2px;
display:inline;
}
/*
*les pages affichées par des sripts php
*/
/* --- affichage du formulaire de contact --- */
#mail {
margin-left: 1em;
margin-right: 1em;
margin-bottom: 2em;
padding: 1em;
}
#mail p input, #mail p textarea {
background: #b3c3b2; /* vert gris très effacé */
}
/*formulaire de devis infos*/
#devis{
margin-left: 1em;
margin-right: 1em;
margin-bottom: 2em;
padding: 1em;
}
#devis p input, #devis p textarea {
background: #b3c3b2; /* vert gris très effacé */
}
/*page erreur 404
*/
#contenu input, #contenu textarea {
background: #b3c3b2; /* vert gris très effacé */
}
.news {
clear: both;
margin: 0;
padding: 0.5em;
width: 95%;
/*width: 95% */ /* Pour Opera */
font-size: 1em;
text-align: left;
}
.news .news_date {
float: left;
clear: both;
width: 7em;
padding: .5em;
text-align: left;
font-size: 1em;
color: #36526a; /*gris noir bleuté */
}
.news .news_texte {
float: left;
clear: both;
padding: .5em;
text-align: justify;
font-size: 1em;
}
p.news_old {
clear: both;
float: right;
margin-top: 0.5em;
margin-right: 1em;
}
.news + * { clear: both; }
/* Pied de page*/
#footer {
clear:both;
margin-left: 215px;
margin-right: 10px;
height: 60px;
padding: 10px 5px 10px 0;
background: #ee9900; /* oranger */
font-size: 1em;
}
#footer p{
text-align: right;
margin-bottom: 10px;
line-height: 12px;
width: 100%;
/*width: 100%;*/
color: #2f4e2b; /* couleur de texte vert noir */
}
/*
* Pour l'impression des contenus standardisés
*/
@media print { /* on n'imprime pas les menus, images etc. */
#logo, #index, #centrage, #services , #contact, #menu, #recherche, #footer, #footerIndex { display: none;}
#contenu {
float: none;
margin: 0;
}
/* pas de fond */
html, body {
color: #000;
background: #fff;
}
a {
color: blue;
}
a:after {
content: " [" attr(href) "]";
}
h1, h2, h3, h4{
page-break-after: avoid;
}
p {
width: 90%;
}
}