body {margin:auto;font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 0.8em;} #conteneur{position:relative;width:1020px; height:900px; margin:20px auto; border:6px solid #00004c;padding:0;} #bandeau{position:absolute; width:1025px; height:200px; margin:-1px 0 0 -2px; padding:0; background: url("img/logv2.png"); background-repeat:no-repeat;z-index:10;} #bandeau a.liens1 {position:absolute; width:400px; height:100px; margin:-1px 0 0 -2px; padding:0;top : 0; left:0;} #udrbandeau {position:absolute;width:1020px;background-color:#00004c;height:50px;top:106px;line-height:10px;} #udrbandeau h2 {color:#ff9955;font-family:arial, helvetica, sans-serif; font-size:21px; font-style: italic; margin-left:350px;letter-spacing:1px;} #sousbandeau {position:absolute; background: url("img/bgmiddle.png"); background-repeat:no-repeat;top:155px; width:1020px;height:170px;} #sousbandeau p{float:left;width:200px;margin-top:50px; color:white; font-family: arial, helvetica, sans-serif; font-size:14px;} #sousbandeau p.imgleft {margin-left:55px; width:118px;} #sousbandeau p.text12 {margin-left:20px; width:158px;margin-right:10px;} #sousbandeau p.imgcent {margin-right:20px; width:250px;} #subbandeau{position:absolute;width:1020px;background-color:#00004c;top:310px;} #subbandeau h3 {color:#ff9955;font-family:arial, helvetica, sans-serif; font-size:16px; font-style: italic; text-align:center;letter-spacing:2px;} ul#menu{ position:absolute;width:1012px; margin:0; list-style-type:none; z-index:10;top:145px;} #menu li ,#texte li{display:inline;} #menu a,#menu a.real, #menu a.contact,#menu a.news { height:24px; width :200px; padding:24px 15px 0 15px; float:left; background: url(./images/accueil.png) no-repeat; text-decoration:none; text-indent:-5000px;} #menu a:hover,#menu a:hover.real,#menu a:hover.contact,#menu a:hover.news {background-position: 0px -50px;} #menu a.real {background: url(./images/tarifs.png) no-repeat;} #menu a.contact {background: url(./images/contact.png) no-repeat;} #menu a.news {background: url(./images/real.png) no-repeat;} ul#texte{position:absolute; margin:145px 0 0 0; list-style-type:none; top:210px; clear:left;padding:0;} ul#texte li,ul#texte li.droite {height:483px; width:249px; float:left; font-size:13px; color:black; font-weight:700; font-style:oblique;text-align:center;border-right:6px solid #00004c; line-height:18px; } ul#texte li.droite {border:none;} ul#texte li a,ul#texte li a.droite {color:#4d4d4d; font-size:13px; text-align:center;} ul#texte li a:hover{color:black;font-weight:bold;} #texte li img {border:none; display : block; margin-left : auto; margin-right : auto; margin-top:30px; margin-bottom:15px;} ul#texte li p.marge img.logo1,ul#texte li p.marge1 img.logo1 {display:block;} ul#texte li p.marge span.liste, ul#texte li p.marge1 span.liste {text-align :left; display:block; margin-left:60px;} ul#texte li p.marge a, ul#texte li p.marge1 a {text-align :center; display:block; margin: 0;padding:0;color:#ff6600;} ul#texte li p.marge a:hover, ul#texte li p.marge1 a:hover {text-align :center; display:block; margin: 0;padding:0;color:gray;} ul#texte li p.marge img.logo, ul#texte li p.marge1 img.logo {position:absolute; top :400px; padding-left:120px;} p.marge, p.marge1 {padding:0 15px;} #foothaut {position:absolute; width:1020px; margin:633px 0 0 0;height:38px; background :#00004c; top:205px;padding:0;} #foot p {position:absolute; width:1020px; margin:775px 0 0 0; background: url("img/foot.png"); background-repeat:no-repeat; text-align:center;top:100px;} #foot p a{color: black;height:25px; line-height:25px; font-size:11px;text-decoration:none;} #foot p a:hover{color: #ff6600;text-decoration:underline;font-weight:bold;} h1 {color:white;font-family: arial, helvetica, sans-serif; font-size:26px; font-style:italic;margin-left:350px;letter-spacing:1px;height:55px;line-height:55px;} h1 img {margin-left:40px; margin-top:25px;vertical-align:-30%;} h5 {position:absolute; margin: 600px 0 0 200px; color:white;} a:visited {color: #006600 ; } #foothaut ul.footer{width : 805px; margin:0px 0px 0 22px; list-style-type:none; } .footer li{display:inline;height:17px;} .footer a{ height:20px; line-height:20px; padding:0px 50px 0 177px; text-decoration: underline; color : white; text-align: center; border-right:1px solid ; } .footer a:hover{text-decoration:none;color :#ff6600;} li a.droite{border-right:none;padding:0px 0px 0 50px;} li a.milieu {padding:0px 90px 0 90px;} #foothaut a.defil span{visibility:hidden;} #foothaut a:hover.defil span {display:block; visibility:visible; color:#ff6600;text-align:center; font-style : italic;} /*page contact*/ #subbandeau2{position:absolute;width:1020px;background-color:#00004c;top:150px; height:90px;} #subbandeau2 h3 {color:#ff9955;font-family:arial, helvetica, sans-serif; font-size:16px; font-style: italic; text-align:center;letter-spacing:2px;margin-top:50px;} #contact, #contactz {position:absolute;width:1100px; height :400px; margin:0 0 0 60px; padding:0; top:280px} #contactx {float:left;width:350px;margin-left:30px;} #contactx h2, #contact h2 {color:#4d4d4d;font-weight:bold; font-style:italic;} #contactx ul {margin:0;padding:0;} #contactx ul li {color:#4d4d4d;font-weight:bold;padding-top:25px;font-size:14px;} #contactx ul li a {color:#ff6600;font-weight:bold;font-size:14px;width:200px;} #contactx ul li a:hover{color :#4d4d4d;} #contactx p img {margin-left:100px;} #contactx p {color:#4d4d4d;font-weight:bold;font-size:12px;} #contactx p a{color:#4d4d4d;font-weight:bold;font-size:12px;} #contactx p a:hover {color :#ff6600;} /*début du formulaire de contact*/ #formulaire {float:left;width: 500px; font-size:12px; } #formulaire p.form {color:#4d4d4d;font-weight:bold;font-size:12px;font-style:italic;margin-left:20px;} #corpForm label:hover, #piedForm input, #corpForm1 label:hover { cursor: pointer; /*** Petite astuce pour apprendre aux utilisateurs a cliquer sur les intitulés ***/ } #formulaire fieldset {display:block; margin:6px 15px;} #formulaire fieldset legend{color:#ff6600;font-weight:bold;font-size:14px;font-style:italic;} fieldset#coordonnees p {margin:0; padding:8px;} #formulaire #corpForm fieldset#coordonnees label, #corpForm1 fieldset#coordonnees label { /*** Mise en forme des intitulés de champs ***/ float: left; /*** Très important, ne pas suprimer ! ***/ width: 30%; /*** Les intitulés prennent 1/3 de la largeur totale du formulaire... ***/ text-align: right; /*** ... et ils sont alignés à droite... ***/ margin: 0; padding: 0 .5em 0 0; } #corpForm label:hover, #piedForm input,#corpForm textarea, #corpForm1 label:hover { cursor: pointer; /*** Petite astuce pour apprendre aux utilisateurs a cliquer sur les intitulés ***/ } #corpForm label.oblig,#corpForm1 label.oblig { font-weight: bold; } /*** Mise en évidence des champs obligatoires ***/ #corpForm a.aide, #corpForm1 a.aide { /*** Mise en forme des bulles d'aide ***/ text-decoration: none; } #corpForm a.aide img, #corpForm1 a.aide img { /*** Mise en forme de l'image des bulles d'aide ***/ margin: 0; padding: 0; border: 0; } #corpForm a.aide:hover, #corpForm1a.aide:hover { /*** Le curseur de la souris change d'aspect quand il passe au-dessus d'une bulle d'aide ***/ cursor: help; } #corpForm p em { /*** Le curseur de la souris change d'aspect quand il passe au-dessus d'une bulle d'aide ***/ display:block;margin-top:-10px;color:#ff6600;font-weight:bold;text-align:center;} #corpForm label:hover, #piedForm input, #corpForm1 label:hover { cursor: pointer; /*** Petite astuce pour apprendre aux utilisateurs a cliquer sur les intitulés ***/ } #corpForm .legende { /*** Mise en forme des aides contextuelles ***/ font-style: italic; color: #666; background: transparent; margin: 0; padding: 0; } .alerte{border-left: 3px solid red; background:white;} input:focus{background:#ff6600;color:black;} #infos p {font-size:12px;color:red;text-align:center;} p.cap img {position:absolute; top :420px; left:400px;border:2px solid gray;width:85px;height:20px;margin-left:150px;} p.cap input {position:absolute; top :420px; left:650px;} /* fin du formulaire de contact*/ #contact p.message {text-align:left ; font-size:16px; font-style:italic;} /*page qui sommes nous ?*/ #contacty {position:absolute; width:930px; height :500px; margin:0 0 0 30px; padding:0 30px 0 0 ; top:280px; background: url("img/bg_contacty.png"); background-repeat:repeat-x;border:3px solid #00004c;;} #contacty p.parqui,#contact p.parqui1,#contact p.parqui2 {margin-left:100px;width:700px;color: black;text-decoration:underline;font-size:14px;} #contacty p.parqui1 {text-decoration:none;color:white;margin-left:100px;margin-top : 30px;} #contacty p.parqui2 {text-decoration:none;color:white;margin-left:100px;margin-top:-30px;} #contacty p.parqui2 img {border:none;margin-left:0;vertical-align:bottom;} #contacty p.parqui1 a, #contacty p.parqui2 a{color:black;} #contacty p.parqui1 a:hover, #contacty p.parqui2 a:hover{color:#ff6600;} #contacty p.parqui1 span, #contacty p.parqui2 span{text-decoration:underline;} #contacty p.parqui span{width:600px;margin-left:150px;position:absolute;color:#F2E8C7;font-weight:bold;} #contacty p.parqui span a{color:#4d4d4d; } #contacty p.img {text-decoration:none; margin:-150px 0 55px 300px;font-size:24px; } #contacty img {margin-left:100px; margin-top:40px;} /*page mentions legales?*/ #contacty h2.haute2 {margin:0; padding:0;} #contacty h2.haute2 img {vertical-align:middle;margin-left:100px;padding-right:100px; height:135px; line-height:135px;} /*pages tarifs*/ #contact h2.haute {margin:-20px 0 0 0; padding:0;} #contact h2.haute img {vertical-align:middle;margin-left:100px;height:135px; line-height:135px;} #contact a.tarif1,#contact a.tarif2,#contact a.tarif3,#contact a.tarif4 {border:none; width:170px;margin:20px 0 0 45px; height:170px; display:block; float:left;} #contact .tarif1 {background: url("images/simple.png"); background-repeat:no-repeat;} #contact a:hover.tarif1 {background: url("images/simpleO.png"); background-repeat:no-repeat;} #contact .tarif2 {background: url("images/vitri.png"); background-repeat:no-repeat;} #contact a:hover.tarif2{background: url("images/vitriO.png"); background-repeat:no-repeat;} #contact .tarif3 {background: url("images/dyna.png"); background-repeat:no-repeat;} #contact a:hover.tarif3{background: url("images/dynaO.png"); background-repeat:no-repeat;} #contact .tarif4{background: url("images/suivis.png"); background-repeat:no-repeat;} #contact a:hover.tarif4{background: url("images/suivisO.png"); background-repeat:no-repeat;} #contact ul.align {display:block;width:1000px;height:50px;clear:left;} #contact ul.align li {list-style-type:none;display:block;float:left;width:200px;text-align:center;} #contact ul.align li a.tarif {text-align:center;text-decoration:none; color:#4d4d4d;font-weight:bold;font-size:12px;width:150px; } #contact a.tarif span {color: #FF6600;font-weight:bold;} #contact h3 {color: black; margin-top:0;margin-left:40px; font-size:14px;font-style:italic; width:800px;font-weight:bold;} #texte1, #texte3, #texte5, #texte7 {display:block;} #texte2 ,#texte4, #texte6, #texte8 {display:none;position:absolute; z-index:10; background:white; width:820px; height:330px;margin-left:40px; margin-top:0px; border:3px outset gray; top:88px;right:0; bottom:0;left:0px;font-size:15px;} #texte2 a ,#texte4 a, #texte6 a , #texte8 a{font-size:12px; color:#FF6600;text-decoration:none;} #texte2 ul,#texte4 ul , #texte6 ul , #texte8 ul {display:block; margin: 0 0 5px 230px;padding:0;} #texte2 ul li, #texte4 ul li, #texte6 ul li, #texte8 ul li{padding:0;margin:0} #texte2 p, #texte4 p,#texte6 p,#texte8 p{margin:0;padding:5px 0 5px 0;} #texte2 p.retrait,#texte4 p.retrait, #texte6 p.retrait, #texte8 p.retrait {display:block; margin-left:210px;font-style:italic;} #texte2 h4, #texte4 h4, #texte6 h4, #texte8 h4 {color: #ff6600; font-size:14px;font-style:italic; font-weight:bold;margin:0px;} #texte2 p span, #texte4 p span,#texte6 p span,#texte8 p span{color:#ff6600; font-weight:bold;} #texte2 a img, #texte4 a img, #texte6 a img, #texte8 a img {margin-left:400px;margin-top:10px;border:none;} #texte2 img.fermer,#texte4 img.fermer, #texte6 img.fermer, #texte8 img.fermer {margin:0 0 0 -20px; vertical-align:middle;height:15px; line-height:15px} #texte8 a img{text-align:left;margin:0 0 0 200px; padding:0;} #texte6 a img{margin:-8px 0 0 400px; padding:0;} /*fin de la page tarifs*/ /* page réalisation*/ #conteneurz{position:relative;width:1020px; height:1100px; margin:20px auto; border:6px solid #00004c;padding:0;} #contactz {position:absolute;width:1100px; height :800px; margin:0 0 0 60px; padding:0; top:280px} #contactz h2.haute, #contactz h2.haute2 {margin:-20px 0 0 0; padding:0;} #contactz h2.haute img, #contactz h2.haute2 img {vertical-align:middle;margin-left:50px;height:135px; line-height:135px;margin-right:50px;} #contactz h2 {margin-left:40px;font-size:17px;font-weight:bold;color:black;margin-top:15px;} #contactz img {margin:15px 0 5px 100px;} #contactz a.test {background: url("images/real1.png"); background-repeat:no-repeat;display:block; float:left; width:400px; height:400px; margin:-150px 0 5px 450px;text-indent:-5000px;} #contactz a:hover.test{background: url("images/real2.png"); background-repeat:no-repeat;} #contactz a.test2 {display:block; float:left; width:400px; height:00px;margin:-490px 0 5px 700px;text-indent:-5000px;} #foothautz {position:absolute; width:1020px; margin:633px 0 0 0;height:38px; background :#00004c; top:405px;padding:0;} #footz p {position:absolute; width:1020px; margin:775px 0 0 0; background: url("img/foot.png"); background-repeat:no-repeat; text-align:center;top:300px;} #footz p a{color: black;height:25px; line-height:25px; font-size:11px;text-decoration:none;} #footz p a:hover{color: #ff6600;text-decoration:underline;font-weight:bold;} #foothautz ul.footerz{width:805px; margin:0px 0px 0 22px; list-style-type:none; } .footerz li{display:inline;height:17px;} .footerz a{ height:20px; line-height:20px; padding:0px 50px 0 177px; text-decoration: underline; color : white; text-align: center; border-right:1px solid ; } .footerz a:hover{text-decoration:none;color :#ff6600;} #foothaut a.defil span{visibility:hidden;} #foothaut a:hover.defil span {display:block; visibility:visible; color:#ff6600;text-align:center; font-style : italic;} /*photo réalisations haut*/ #contactz ul li.deco a,#contactz ul li.diagimmo a{width:400px;} #contactz ul li.deco a img {display:block; border:none; position : absolute; top:100px; left:400px;} #contactz ul li.deco a:hover img {display:none;} #contactz ul li.diagimmo a img {display:none;} #contactz ul li.diagimmo a:hover img {display:block;border:none; position : absolute; top:100px; left:400px;} /*bulle*/ #contactz a.bulle {position:absolute;text-decoration:none; color:#4d4d4d;top:450px;} #contactz a.bulle span { display: none;} #contactz a.bulle:hover span {display: block; text-align:justify; font-size:12px; font-weight:normal; width:350px; background: white; padding: 5px; border: 1px solid #FF6600; border-left: 10px solid #FF6600;} /*fin bulle*/ #contactz li {margin-left:40px;list-style-type:square;padding-top:5px;} #contactz li a{display:block;color:#ff6600;width:125px;padding:5px 0;} a.voir,a.voir1 {margin-left:470px; text-decoration:none; color:black; list-style-type : none; border:none;font-family: verdana, arial, sans-serif;font-size:14px;} a.voir1 {margin-left:-50px;} a.voir img,a.voir1 img {vertical-align:-50%;padding-right:10px;border:none;} a.voir:hover,a.voir1:hover {color:#ff6600} #anim {position:absolute; top : 450px; left: 450px; } /*gallerie*/ #photo_strip {width:830px; margin:0px auto 20px 0;} #container {margin:0; padding:0; height:580px; overflow:auto; color:#222; background:#fff; width : 850px;} #container ul {margin:0; padding:0; list-style:none; white-space:nowrap; display:table-row;} #container ul li {display:table-cell; padding:0 30px; background:#fff; border-bottom:1px solid #888; vertical-align:top;} #container ul li img{border:1px solid #555; margin: 30px 0 10px 0;} #photo_strip h1 {text-align:center; padding:0; margin:0; width:830px; height:38px; line-height:35px; color:#555; font-weight:normal; font-size:20px; border-bottom:1px solid #888;} #container p {margin:0; padding:10px 0 0 0; font-size:14px; font-weight : bold; text-align : center; } #container a:hover {color:black;} p.w3c,p.w3c1 {display:inline;margin-left:250px;} p.w3c1 {margin-left:450px;} p.w3c a img,p.w3c1 a img {border:none;}