@charset "utf-8";

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li 
{ margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; background: transparent; }

/* corps */
body { font-family: Verdana, Trebuchet, sans-serif; background: #FFF; margin: 0; font-size: 100%; height: 100%; }

 /*div {border: 1px solid blue; }  */

/* éléments */
img { border: 0; }
abbr { border-bottom: 1px dotted #000000; cursor: help; }
.clear { clear: both; visibility: hidden; }

h1 { color: #000; font-weight: normal; font-size: 120%; text-transform: uppercase; letter-spacing: 0.5px}
h2 { color: #000; font-weight: bold; font-size: 90%; }

a { color: #0066cc; }
a:hover { color: #669900; }

/* contour central */
#conteneur { width: 885px; margin: auto; background: #FFF; }

/* zone entete */
#header { height: 170px; }

/* menu rollover */
ul#menu { width: 100%; overflow: hidden; margin: 20px 0 0 0; padding: 0; list-style: none; }
ul#menu li { float: left; margin: 0; padding: 0; }
ul#menu li a { display: block; width: 188px; height: 84px; text-decoration: none; text-indent: -5000px; } /* texte masqué */

ul#menu li#accueil { width: 107px; height: 132px; } /* logo dans le menu */
ul#menu li#accueil a { width: 107px; height: 132px; } /* logo dans le menu */

/* fonds rubriques */
li#agence a  { background: url(/img/menu-agence.jpg) left top; margin-left: 25px; }
li#projets a { background: url(/img/menu-projets.jpg) no-repeat left top; }
li#actus a   { background: url(/img/menu-actus.jpg) no-repeat left top; }
li#liens a   { background: url(/img/menu-liens.jpg) no-repeat left top; }

/* images en couleur pour la page d'accueil */
ul.index li#agence a  { background: url(/img/menu-agence.jpg) right top; }
ul.index li#projets a { background: url(/img/menu-projets.jpg) right top; }
ul.index li#actus a   { background: url(/img/menu-actus.jpg) right top; }
ul.index li#liens a   { background: url(/img/menu-liens.jpg) right top; }

ul#menu li.menuselected a { background-position: right top; } /* fond pour menu en cours */
ul#menu li a:hover, ul#menu li a:focus { background-position: right top; } /* survol carré menu */

ul#menu ul.ssmenu { display: none; overflow: hidden; list-style: none; margin-top: 2px; } /* masque sous-menu par défaut */
ul#menu ul.ssmenu.active { display: block; } /* ne pas masquer le menu en cours */

ul#menu li:hover .ssmenu { display: block; } /* affichage du menu rollover */
ul#menu li.sfhover .ssmenu { display: block; } /* rollover IE6 */

/*  sous menu */
ul#menu ul.ssmenu li { float: none; display: inline; width: 170px; height: 13px; padding: 0; margin: 0; background: none; }
ul#menu ul.ssmenu li a { height: 13px; background: none; font-size: 70%; color: #000; font-weight: normal; text-indent: 0}

/*  couleur liens par rubrique */
li#agence ul.ssmenu a.ssmenuselected,li#agence ul.ssmenu a:hover,li#agence ul.ssmenu a:focus { color: #FF6633; }
li#projets ul.ssmenu a.ssmenuselected,li#projets ul.ssmenu a:hover,li#projets ul.ssmenu a:focus { color: #669900; }
li#actus ul.ssmenu a.ssmenuselected,li#actus ul.ssmenu a:hover,li#actus ul.ssmenu a:focus { color: #660099; }
li#liens ul.ssmenu a.ssmenuselected,li#liens ul.ssmenu a:hover,li#liens ul.ssmenu a:focus { color: #0066cc; }

/* diaporama */
#diaporama{ width: 752px; height: 370px; margin-top: 60px; }
#flash1 { }
.liste { list-style: none; padding-left: 30px; }

/* colonnes */
#colgauche { float: left; width: 126px; background: #FFF; min-height: 480px; height: 480px; position: relative; }
/* bloc contact colonne gauche */
#colgauche #contact { position: absolute; bottom: 30px; width: 126px; font-size: 70%; color: #669900; text-align: left; }
#colgauche #contact .titre a { font-weight: bold; color: #669900; font-size: 110%; text-decoration: none; }
#colgauche #contact .titre a:hover { color: #000; }
#colgauche #contact a { color: #669900; }
#colgauche #contact a:hover { color: #000; }

#colgauche #vignettes { width: 107px; text-align: center; margin-top: 25px; }
#colgauche #navigation{ width: 107px; text-align: center; }

/* contenu */
#contenu { overflow: hidden; text-align: justify; margin-left: 130px; width: 754px; height: 1% /*bug hasLayout IE */; }
#contenu { color: #000; font-size: 80%; }

/* portraits équipe */ 
#contenu .portrait { font-size: 90%; line-height: 17px; width: 260px; float: left; padding-right: 15px; margin-top: 45px; cursor: pointer; }

/* projets */
#contenu ul#liste_projets { width: 100%; overflow: hidden; margin: 10px 0 0 0; padding: 0; list-style: none; height: 60px; }
#contenu ul#liste_projets li { float: left; margin: 0; padding: 0; width: 187px; height: 20px; }
#contenu ul#liste_projets li a {text-decoration: none; color: #000; }
#contenu ul#liste_projets li a:hover { color: #669900; }

#contenu ul#liste_vignettes { width: 100%; overflow: hidden; margin: 10px 0 0 0; padding: 0; list-style: none; }
#contenu ul#liste_vignettes li { float: left; margin: 0; padding: 0; width: 187px; height: 84px; }
#contenu ul#liste_vignettes li a { display: block; background: #98c067; }
#contenu ul img.vignette { width: 187px; }

#contenu #projetgauche { width: 365px; float: left; border-right: 2px solid #98c067; padding-right: 8px; margin-bottom: 8px; height: 70px; min-height: 70px; }
#contenu #projetgauche .description { font-size: 85%; }
#contenu #projetgauche h1 { font-size: 110%; }
#contenu #projetdroite { width: 365px; float: right; margin-left: 8px; font-size: 85%; text-align: left; }
#contenu #projetdroite .legende { float: left; width: 85px; }
#contenu #projetdroite a { color: #669900; text-decoration: underline; }


/* lignes de formulaire */
#contenu .entete { width: 130px; color: #111; float: left;}
#contenu .ligne { border-bottom: 1px solid #CCC; padding: 3px; margin-left: 30px; width: 500px; }

#coord { clear: both; width: 237px; text-align: center; color: #707173; font-size: 80%; padding-left: 10px; }

/* mentions légales */
#footer { width: 100%; clear: both; text-align: right; margin-top: 15px;}
#footer ul { width: 100%; overflow: hidden; margin: 0; padding: 0; list-style: none; }
#footer li { float: right; margin: 0 0 0 0; padding: 0 15px 0 0; }
#footer li { text-decoration: none; color: #666; text-transform: uppercase; font-size: 60%}
#footer li a { text-decoration: none; color: #666; }

/* copyright bas */
#copyright { clear: both; color: #666; font-size: 70%; width: 885px; text-align: center; margin: auto; }
#copyright a { color: #666; text-decoration: none; }
#copyright a:hover { color: #0066cc; text-decoration: none; }

/* boutons et forms */
input { font-family: Arial, sans-serif; }
.form { font-size: 100%; background: #FFF url(icones/input_bg.png) left top repeat-x; border: 1px solid #bbb; }
.formc { font-size: 100%; background: #FFF url(icones/input_bg.png) left top repeat-x; border: 1px solid #bbb; text-align: center; }
.radio { background: 0; border: 0; }

.form_petit { font-size: 90%; }
.bouton	{ color: #FFF; font-size: 100%; background-color: #669900; }

input, button, select { vertical-align: middle; }

/* backoffice */
#admin { font-family: Arial, sans-serif; font-size: 70%; background: #FFF; margin-top: 10px; }
#admin .bouton	{ font-family: Arial, Helvetica, sans-serif; color: #fff; font-size: 95%; background: #669900; }
#admin a { color: #0066cc; text-decoration: none }
#admin a:hover { color: #669900; text-decoration: underline }
span.disabled { color: #CCC; }
.colonneadmin,.colonneadmin a { background-color: #d9d0af; color: #333; height: 25px; }
td.admin { color: #333; }
div.result { padding: 5px; border: 1px dotted #CCC; width: 600px; font-weight: bold; margin: auto;}
.box {	font-size: 14px; border: 1px solid #ddd; visibility: hidden; float: left; padding: 5px; width: 0px; height: 0px; margin: 5px; background: #F3EECC; z-index: 1; margin-left: 60px;}
.masque { vertical-align: middle; -moz-opacity:0.3; filter:alpha(opacity=30); -khtml-opacity: 0.3; opacity: 0.3; }
.fondrouge { color: #ff0214; padding: 5px; }
.fondvert  { color: #7EC65F; padding: 5px; }
.titre { font-size: 14px; font-weight: bold; letter-spacing: 2px; color: #333; }