/* GENERAL */ * {padding:0; margin:0} body {font:normal 11px "Lucida Grande", arial, sans-serif; color:#FFF; line-height:13px; background-color:#FFF; background:url(../images/fond.png) repeat} ul {list-style:none} h1 span, h2 span {display:block; overflow:hidden; position:relative; left:-9999px; top:-9999px; text-indent:-5000px} a {color:#FFF; background:url(../images/puceBlanche.gif) left center no-repeat; padding:0 5px 0 10px} a img {border:5px solid #FFF} .btnOn img, a:hover img {border:5px solid #1bc3d7} input, textarea, select {font:normal 11px "Lucida Grande", arial, sans-serif; background-color:#3d2b00; border:solid 1px #1bc3d7; color:#1bc3d7} input, textarea, option {padding-left:4px} label {color:#1bc3d7} fieldset {border:0} /* DEBUT - ID PRINCIPAUX */ #conteneurPrincipal {width:994px; background-color:#1b1201; margin:0 auto;} /* DEBUT - header */ #header {background:url(../images/header.png) no-repeat; width:994px; height:137px; margin-bottom:10px} #header #carte {float:left; width:375px; height:137px} #header #carte h1 {background:url(../images/headerCarte.png) no-repeat; width:375px; height:137px} #header #accesClient {float:right; margin-right:26px; width:135px; margin-top:11px} #header #accesClient h2 {background:url(../images/hautAccesClient.png) no-repeat; width:135px; height:15px} #header #accesClient #basCadre {background:url(../images/basAccesClient.png) no-repeat; width:135px; height:21px} #header #accesClient fieldset {padding:2px 5px 0 5px} #header #accesClient fieldset input {width:118px; height:12px; margin-top:1px; font-size:10px} #header #accesClient .boutonEnvoyer {color:#FFF; height:16px; width:58px; border-width:0; padding-bottom:2px; background:url(../images/puceBlanche.gif) 2px center no-repeat; padding-left:10px; margin-right:20px; cursor:pointer; float:right} /* FIN - header */ /* DEBUT - conteneurContenuSup */ #conteneurContenuSup {min-height:408px; height:408px} /* DEBUT - A propos */ #conteneurContenuSup #conteneurApropos {width:250px; float:left; padding:0 15px; text-align:justify} #conteneurContenuSup #conteneurApropos h2 {background:url(../images/titreApropos.png) no-repeat; width:152px; height:29px} #conteneurContenuSup #conteneurApropos p {padding:10px 0px} /* FIN - A propos */ /* DEBUT - Dernier Projet */ #conteneurContenuSup #conteneurProjet {position:relative; width:490px; float:left; padding:0 0 0 15px} #conteneurContenuSup #conteneurProjet h2 {background:url(../images/titreDernierProjet.png) no-repeat; width:243px; height:29px} #conteneurContenuSup #conteneurProjet #vignettesSmall {position:absolute; z-index:4; padding-top:10px} #conteneurContenuSup #conteneurProjet #vignettesSmall li {height:37px; width:42px; float:left; margin:0 6px 0 0} #conteneurContenuSup #conteneurProjet #vignettesSmall a {background:none; padding:0} #conteneurContenuSup #conteneurProjet #conteneurVignetteBig {position:absolute; z-index:2; left:74px; top:73px} #conteneurContenuSup #conteneurProjet .cacheBig {visibility:hidden; position:absolute; z-index:2; left:74px; top:73px} #conteneurContenuSup #conteneurProjet #cadre {position:absolute; z-index:1; left:0; top:0; background:url(../images/projetCadre.png) no-repeat; width:480px; height:387px} #conteneurContenuSup #conteneurProjet #infoProjet {font:normal 12px georgia, "Times new roman", sans-serif; position:absolute; z-index:3; padding:12px 0 12px 16px; top:306px; background-color:#1bc3d7; width:460px; min-height:60px} #conteneurContenuSup #conteneurProjet div.conteneurTitreFilet {display:table; text-transform:uppercase; padding-bottom:6px !important; padding-bottom:4px; height:16px} #conteneurContenuSup #conteneurProjet #infoProjet h3 {font:normal 16px georgia, "Times new roman", sans-serif; text-transform:uppercase; display:table-cell !important; float:left; white-space:nowrap; height:14px} #conteneurContenuSup #conteneurProjet #infoProjet h3 a {font:normal 12px georgia, "Times new roman", sans-serif; text-transform:none; margin-right:12px !important; margin-right:0} #conteneurContenuSup #conteneurProjet div.filet {border-bottom:10px solid #d6fbfe; display:table-cell !important; height:6px; line-height:6px; width:100% !important; width:} /* FIN - Dernier Projet */ /* DEBUT - Références */ #conteneurContenuSup #conteneurReferences {width:190px; float:left; padding:0 0 0 5px} #conteneurContenuSup #conteneurReferences h2 {background:url(../images/titreReferences.png) no-repeat; width:180px; height:23px; margin-bottom:10px} #conteneurContenuSup #conteneurReferences .conteneurLiens {padding:0 0 5px 0; width:190px; background-color:#3d2b00; -moz-border-radius:0px; clear:both; position:relative; overflow:hidden; /* causes the clipping */display:none; /* component turns it on when first item is rendered */} #conteneurContenuSup #conteneurReferences .conteneurLiens ul.carouselListe {text-align:left; padding:1px; /* for some reason, this is needed for IE6 & 7 */} #conteneurContenuSup #conteneurReferences .conteneurLiens .carouselListe li {text-align:left; display:block; width:190px} #conteneurContenuSup #conteneurReferences .conteneurLiens a {display:block; color:#FFF; background:none; padding:1px 5px 0 5px; height:14px; text-decoration:none} #conteneurContenuSup #conteneurReferences .conteneurLiens a:hover, #conteneurContenuSup #conteneurReferences .conteneurLiens li.On a {background:url(../images/puceBlanche.gif) 2px center no-repeat; padding:1px 5px 0 12px; background-color:#1BC3D7} #conteneurContenuSup #conteneurReferences #up-arrow {cursor:pointer} #conteneurContenuSup #conteneurReferences #down-arrow {cursor:pointer} /* FIN - Références */ /* FIN - conteneurContenuSup */ /* DEBUT - ConteneurContenuInf */ #conteneurContenuInf {background-color:#3d2b00; padding-top:10px} /* DEBUT - Services */ #conteneurContenuInf #conteneurServices {width:255px; float:left; padding:0 15px 0 10px} #conteneurContenuInf #conteneurServices h2 {background:url(../images/titreServices.png) no-repeat; width:138px; height:22px} #conteneurContenuInf #conteneurServices ul {padding:10px 0 0 0} /* FIN - Services */ /* DEBUT - Contact */ #conteneurContenuInf #conteneurContact {width:320px; float:left; padding:0 0 0 20px} #conteneurContenuInf #conteneurContact h2 {background:url(../images/titreContact.png) no-repeat; width:130px; height:22px} #conteneurContenuInf #conteneurContact p {padding:10px 0} /* FIN - Contact */ /* DEBUT - Formulaire */ #conteneurContenuInf #accolade {width:46px; height:89px; float:left; background:url(../images/contactAccolade.png) no-repeat; margin-top:30px} #conteneurContenuInf #conteneurFormulaire {font-size:11px; width:310px; float:left} #conteneurContenuInf #conteneurFormulaire a {background:none; padding:0} #onglets ul {padding-left:100px} #onglets li {float:left} .ongletDevisOff {background:url(../images/ongletDevisOff.png) no-repeat; width:78px; height:25px} .ongletDevisOn {background:url(../images/ongletDevisOn.png) no-repeat; width:85px; height:25px} .ongletContactOff {background:url(../images/ongletContactOff.png) no-repeat; width:78px; height:25px} .ongletContactOn {background:url(../images/ongletContactOn.png) no-repeat; width:85px; height:25px} .ongletDevisOff a {position:relative; display:block; width:78px !important; width:73px; height:25px; float:left} .ongletDevisOn a {position:relative; display:block; width:85px !important; width:80px; height:25px; float:left} .ongletContactOff a {position:relative; display:block; width:78px; height:25px; float:left} .ongletContactOn a {position:relative; display:block; width:85px; height:25px; float:left} #onglets .inputMessage {height:79px; margin:0 0 3px 5px !important; margin:0 0 1px 3px; width:236px} #onglets .filetBouton {float:right; background-color:#1bc3d7; width:182px; height:6px; margin-top:6px; overflow:hidden} #onglets .boutonEnvoyer {height:16px; width:58px; border-width:0; background:url(../images/puceBleue.gif) 2px center no-repeat; padding-left:10px; cursor:pointer; float:right; padding-bottom:2px} /* DEBUT - Devis */ #contenuDevis {width:310px} #contenuDevis input {height:15px; margin:0 0 3px 5px !important; margin:0 0 1px 3px; width:236px} #contenuDevis label {display:block; width:60px; text-align:right; float:left; margin-top:2px !important; margin-top:3px} #contenuDevis .devisPour {color:#FFF; display:block; width:186px; text-align:right; float:left; margin-top:2px !important; margin-top:3px} #contenuDevis .selectDevisPour {height:15px; color:#1bc3d7; margin:0 0 3px 5px !important; margin:0 0 1px 3px; width:116px} #contenuDevis .possedezSite {color:#FFF; display:block; width:186px; text-align:right; float:left; margin-top:2px !important; margin-top:3px} #contenuDevis .selectPossedezSite {height:15px; color:#1bc3d7; margin:0 0 3px 5px !important; margin:0 0 1px 3px; width:116px} #contenuDevis .indiquezSite {color:#FFF; display:block; width:186px; text-align:right; float:left; margin-top:2px !important; margin-top:3px} #contenuDevis .inputIndiquezSite {height:15px; color:#1bc3d7; margin:0 0 3px 5px !important; margin:0 0 1px 3px; width:110px} #contenuDevis .typeSite {color:#FFF; display:block; width:126px; text-align:right; float:left; margin-top:2px !important; margin-top:3px} #contenuDevis .selectTypeSite {height:15px; color:#1bc3d7; margin:0 0 3px 5px !important; margin:0 0 1px 3px; width:176px} #contenuDevis .moduleSite {color:#FFF; display:block; width:175px; text-align:right; float:left; margin-top:2px !important; margin-top:3px} #contenuDevis .selectModuleSite {height:15px; color:#1bc3d7; margin:0 0 3px 5px !important; margin:0 0 1px 3px; width:127px} #contenuDevis .possedezLogo {color:#FFF; display:block; width:186px; text-align:right; float:left; margin-top:2px !important; margin-top:3px} #contenuDevis .selectPossedezLogo {height:15px; color:#1bc3d7; margin:0 0 3px 5px !important; margin:0 0 1px 3px; width:116px} #contenuDevis .inputMessage {height:39px; color:#1bc3d7; margin:0 0 3px 5px !important; margin:0 0 1px 3px; width:236px} #contenuDevis input#formDevisTelephone {border:1px solid #68521c; color:#68521c} /* FIN - Devis */ /* DEBUT - Contact */ #contenuContact {width:310px} #conteneurContact a {background:url(../images/puceBlanche.gif) 2px center no-repeat; padding:0 5px 1px 12px; background-color:#1BC3D7; text-decoration:none} #contenuContact input {height:15px; margin:0 0 3px 5px !important; margin:0 0 1px 3px; width:236px} #contenuContact label {display:block; width:60px; text-align:right; float:left; margin-top:2px !important; margin-top:3px} #contenuContact input#formContactTelephone {border:1px solid #68521c; color:#68521c} #conteneurContact a.social {background:none; padding:0; margin-right:5px; ext-decoration:none} #conteneurContact a.social img {border:none; vertical-align:sub} /* FIN - Contact */ /* FIN - Formulaire */ /* FIN - ConteneurContenuInf */ /* DEBUT - Footer */ #footer {text-align:center; padding:6px 0 4px 0} #footer h2 {font:normal 11px "Lucida Grande", arial, tahoma, sans-serif} #footer p {font:normal 9px "Lucida Grande", arial, tahoma, sans-serif} /* FIN - Footer */ /* DEBUT - CLASSES PRINCIPALES */ #separation {background:#1bc3d7 url(../images/pointilles.gif) left bottom repeat-x; height:7px; font-size:5px} .efface {clear:both; overflow:hidden; height:0} #conteneurContenuSup #conteneurReferences .conteneurLiens a.cache {display:none; visibility:hidden; height:0; overflow:hidden} .champFacultatif {color:#68521c} .blocPopup {padding:5px; background-color:#1bc3d7; color:#FFF} .surligne {padding:0 2px 1px 2px; margin-bottom:2px; background-color:#1BC3D7; text-decoration:none} .surligne2 {padding:0 1px 1px 1px; background-color:#3f2d00; text-decoration:none} .alerte {color:white; background:url(../images/panneauWarning.gif) 2px top no-repeat; padding:2px 2px 0 21px; height:18px; margin-left:66px; background-color:red; margin-bottom:2px} .envoiOk {color:#FFF; background:url(../images/envoiOk.gif) 4px top no-repeat; padding:2px 2px 0 23px; height:18px; margin-left:66px; background-color:#1bc3d7} .lienLightbox {color:#999; background-image:none; padding:0} a.normal {background:none; padding:0; font-size:10px} /* FIN - CLASSES PRINCIPALES */ /* HACKS POUR IE7 */ *:first-child+html #contenuDevis .selectPossedezSite, *:first-child+html #contenuDevis .selectTypeSite, *:first-child+html #contenuDevis .selectModuleSite, *:first-child+html #contenuDevis .selectPossedezLogo, *:first-child+html #contenuDevis .selectDevisPour {height:18px} /* HACKS pour IE6 */ * html #header {filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/header.png'); background:none} * html #header #carte h1 {filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/headerCarte.png'); background:none} * html #conteneurContenuSup #conteneurApropos h2 {filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/titreApropos.png'); background:none} * html #conteneurContenuSup #conteneurReferences h2 {filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/titreReferences.png'); background:none} * html #conteneurContenuSup #conteneurProjet h2 {filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/titreDernierProjet.png'); background:none} * html #conteneurContenuInf #conteneurServices h2 {filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/titreServices.png'); background:none} * html #conteneurContenuInf #conteneurContact h2 {filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/titreContact.png'); background:none} * html .ongletDevisOff {filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/ongletDevisOff.png'); background:none} * html .ongletDevisOn {filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/ongletDevisOn.png'); background:none} * html .ongletContactOff {filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/ongletContactOff.png'); background:none} * html .ongletContactOn {filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/ongletContactOn.png'); background:none} * html #conteneurContenuInf #accolade {filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/contactAccolade.png'); background:none}