/* --------------------------------------------------------------------------------- DEFAUT --------------------------------------------------------------------------------- */ body { background: #333; margin: 0; padding: 0; font-family: helvetica, arial, sans-serif;} p, ul { margin: 0 0 1.4em 0; } p, ul li, ol li, table td, table th { line-height: 1.4em; color: #666; font-size: 0.8em; } p a { color: #666; } p a:hover { color: #000; } h1, h2, h3, h4, h5, h6 { margin: 0 0 0.6em 0; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: #000; } h1 { color: #666; font-weight: normal; font-size: 1.05em; line-height: 1.35em; margin: 0 0 1.6em 0; } h2, h3 { color: #000; font-size: 0.8em; margin: 0 0 0.2em 0; } h2 a { text-decoration: none; } h2 a:hover { text-decoration: underline; } ul li p, ul li h2 { font-size: 1.0em; } ul li a { color: #666; } a img { border: none; } hr { display: none; } #wrap-outer { width: 100%; float: left; background-color:#f0f0f0; }/*f7f7ed*/ #wrap { width: 100%; float: left; background-color:#f0f0f0; } #main-outer { width: 100%; float: left; background-color:#f0f0f0; } #main, #subfooter, #footer { width: 960px; margin: 0 auto; padding: 0 15px; } #header { width: 100%; float: left; height: 101px; background: url(../img/header-div.jpg) no-repeat 0 bottom; } #content { width: 100%; float: left; padding: 30px 0; } #plane-path { width: 100%; background: url(../images/path.gif) no-repeat center 0; float: left; } #header #logo { float: left; background: url(../img/logo_album.gif) no-repeat 0 0; margin: 30px 0 0 0; } #header #logo a { width: 260px; height: 41px; float: left; } #header #logo a span { display: none; } #printlogo { display: none; } #social { margin: 0 0 0 0; padding: 0 5px; float: right;background-color:#000; } #social li { float: left; list-style-type: none;padding: 0 4px 0 8px; font-size: 0.9em; line-height: 1.0em; text-align: center;} #social li a { color: #9e9f98; text-decoration: none; padding: 2px 0; float: left; } #social li a:hover { border: none; color: #666; } #nav { margin: 41px 0 0 100px; padding: 0; float: right; } #nav li { float: left; list-style-type: none; padding: 0 0 0 15px; font-size: 0.9em; line-height: 1.0em; text-align: center; text-shadow: #FFF 0px 1px 0px;} #nav li a { color: #9e9f98; text-decoration: none; padding: 2px 0; float: left; } #nav li a:hover { border-bottom: solid 1px #bdbfb5; color: #666; } #header #nav #hfacebook { float: right; margin: 0px 0 0 0; padding: 0 0 0 15px; } #hfacebook a { width: 77px; height: 15px; background: url(../img/header_facebook.gif) no-repeat 0 0; float: left;} #hfacebook a span { display: none; } #hfacebook a:hover { background-position: 0 bottom; } #pHome #nav #n01 a, #pHome #nav #n02 a, #pHome #nav #n03 a, #pHome #nav #n04 a, #pHome #nav #n05 a, #pAbout #nav #n02 a, #pServices #nav #n03 a, #pWork #nav #n04 a, #pContact #nav #n05 a { color: #666; }/*font-weight: bold;*/ #home { width: 290px; float: left; background: url(../images/h1-titre.gif) no-repeat 1px 24px; padding: 123px 0 15px 0; } #home h1 { margin: 0; } #home p { color: #666; font-weight: normal; font-size: 1.0em; } #home h1, #pStandards h1 { } #home h1 a, #home p a { color: #a8a9a1; } #home h1 a:hover, #home p a:hover { color: #000; } /* --------------------------------------------------------------------------------- PAGE ALBUM (vFlo) --------------------------------------------------------------------------------- */ #album { width: 320px; float: left; background: url(../img/h1-justeVraie.gif) no-repeat 1px 24px; padding: 123px 0 15px 0; } #album ul{margin:0 25px 0 0;} #album li { float: left; list-style-type:none; background: url(../img/fleche3.png) no-repeat 0px 3px; padding: 0 0 0 26px; font-size: 0.9em; line-height: 1.5em; text-align: left; text-shadow: #FFF 0px 1px 0px;} #album li a { color: #666; text-decoration: none; padding: 2px 0px 0 0px; float: left; } #album li a:hover {color: #9e9f98; } /* --------------------------------------------------------------------------------- PAGE 20ans --------------------------------------------------------------------------------- */ /*#album2 { width: 250px; float: left; background: url(../img/h1-justeVraie.gif) no-repeat 1px 24px; padding: 123px 0 15px 0; }*/ #album2 { width: 320px; float: left; background: url(../img/h1-justeVraie.gif) no-repeat 1px 24px; padding: 123px 0 15px 0; } #album2 ul{margin:0 25px 0 0;} #album2 li { float: left; list-style-type:none; background: url(../img/fleche3.png) no-repeat 0px 3px; padding: 0 0 0 26px; font-size: 0.9em; line-height: 1.5em; text-align: left; text-shadow: #FFF 0px 1px 0px;} #album2 li a { color: #666; text-decoration: none; padding: 2px 0px 0 0px; float: left; } #album2 li a:hover {color: #9e9f98; } /* --------------------------------------------------------------------------------- PAGE contact --------------------------------------------------------------------------------- */ /*#album2 { width: 250px; float: left; background: url(../img/h1-justeVraie.gif) no-repeat 1px 24px; padding: 123px 0 15px 0; }*/ #album3 { width: 320px; float: left; background: url(../images/h2-meet.gif) no-repeat 1px 24px; padding: 123px 0 15px 0; } #album3 ul{margin:0 25px 0 0;} #album3 li { float: left; list-style-type:none; background: url(../img/fleche3.png) no-repeat 0px 3px; padding: 0 0 0 26px; font-size: 0.9em; line-height: 1.5em; text-align: left; text-shadow: #FFF 0px 1px 0px;} #album3 li a { color: #666; text-decoration: none; padding: 2px 0px 0 0px; float: left; } #album3 li a:hover {color: #9e9f98; } /* --------------------------------------------------------------------------------- FOLIO --------------------------------------------------------------------------------- */ #intro { float: right; width: 660px; padding: 34px 0 59px 0; margin: 0; } #content .imgReplace { float: left; height: 88px; } #content .imgReplace span { display: none; } #h1-work { width: 300px; background: url(../img/h1_references.gif) no-repeat 0 0; margin: 22px 0 0 0; } #h1-philosophie { width: 300px; height: 88px; background: url(../img/h1-philosophie.gif) no-repeat 0 0; margin: 18px 0 0 0; } #h1-services { width: 100%; background: url(../images/h1-services.gif) no-repeat 0 0; margin: 24px 0 23px 0; } #h3-more { float: right; width: 200px;background: url(../img/h3_clients.gif) no-repeat 0 0; margin: 24px 0 0 0; } #h3-more2 { float: right; width: 645px; padding: 20px 0 0 0; margin: 0 50px 0px 0; font-size:1.1em; border-bottom:solid; border-bottom-color:#e3e3e3; border-bottom-width:thin; } #h3-more3 { float: right; width: 549px; padding: 20px 0 0 0; margin: 0 50px 0px 0; font-size:1.1em; border-bottom:solid; border-bottom-color:#e3e3e3; border-bottom-width:thin; } #h3-more2bis { float: right; width: 645px; padding: 20px 0 0 0; margin: 0 50px 0px 0; font-size:1.1em; border-bottom:solid; border-bottom-color:#e3e3e3; border-bottom-width:thin; font-size: 0.8em; } #featured { float: left; width: 960px; background: url(../images/header-div.jpg) no-repeat 0 0; padding: 30px 0; margin: 0; } #featured h2 a { color: #000; } #featured li { list-style-type: none; float: left; width: 300px; padding: 0 30px 0 0; } #featured li img { margin: 0 0 20px 0; } #featured .noPadd { padding: 0; } #more { float: left; width: 960px; background: url(../images/header-div.jpg) no-repeat 0 0; padding: 0; } #more ul { float: right; width: 645px; padding: 20px 0 0 0; margin: 0 0 16px 0; } #more ul li { float: left; width: 210px; list-style-type: none; padding: 0; } #more ul li a { text-decoration: none; float: left; width: 180px; padding: 10px 15px; } #more ul li a span { color: #000; width: 180px; float: left; } #more ul li a:hover { background: #fff; } #more ul li a:hover, #more ul li a:hover span { background: #fff; } #more2 { float: left; width: 740px; background: url(../images/header-div.jpg) no-repeat 0 0; padding: 0; } #more2 ul { float: right; width: 645px; padding: 20px 0 0 0; margin: 0 0 16px 0; } #more2 ul li { float: left; width: 210px; list-style-type: none; padding: 0; } #more2 ul li a { text-decoration: none; float: left; width: 180px; padding: 10px 15px; } #more2 ul li a span { color: #000; width: 180px; float: left; } #more2 ul li a:hover { background: #fff; } #more2 ul li a:hover, #more2 ul li a:hover span { background: #fff; } #more3 { float: left; width: 550px; background: url(../images/header-div.jpg) no-repeat 0 0; margin: 0 0 0 200px; } #more3 ul { float: right; width: 645px; padding: 20px 0 0 0; margin: 0 0 16px 0; } #more3 ul li { float: left; width: 210px; list-style-type: none; padding: 0; } #more3 ul li a { text-decoration: none; float: left; width: 180px; padding: 10px 15px; } #more3 ul li a span { color: #000; width: 180px; float: left; } #more3 ul li a:hover { background: #fff; } #more3 ul li a:hover, #more ul li a:hover span { background: #fff; } #details { width: 330px; float: left; padding: 96px 0 15px 0; }/*background: url(../images/h1-work.gif) no-repeat 0 22px;*/ #details h1 { margin: 0 0 0.3em 0; } #details p { width: 290px; margin: 0 0 1.0em 0; } #details p a { text-decoration: none; } #details ul { padding: 0; margin: 0 0 30px 0; } #details ul li, #details .sm { list-style-type: none; font-size: 0.7em; } #details h2 { padding-top: 10px; } #details .view { background: url(../images/details-view-bg.gif) repeat-y 0 0 #dadbcf; width: 290px; float: left; border-top: solid 1px #c7c9b9; border-bottom: solid 1px #c7c9b9; padding: 17px 20px 8px 20px; } #details .view h3 { margin: 0; } #details .view p a, #details .back a { text-decoration: underline; } #gallery { width: 630px; float: right; margin: 0 0 30px 0; position: relative; background: url(../images/loading.gif) no-repeat center 133px; } #gshadow { width: 630px; height: 271px; background: url(../images/gallery-shadow.png) no-repeat 0 -12px; position: absolute; top: 0; left: 0; z-index: 500; } a.survol_fleche{ background: url(../img/fleche.gif) no-repeat 0 0; text-decoration:none; } a.survol_fleche:hover{ background-position: 0 -34px; text-decoration:none; } a.survol_fleche2{ background: url(../img/fleche_ret.gif) no-repeat -2px 0; text-decoration:none; } a.survol_fleche2:hover{ background-position: -2px -34px; text-decoration:none; } /* --------------------------------------------------------------------------------- CODA STYLES --------------------------------------------------------------------------------- */ /* #screens, #screens2 { width: 630px; height: 542px; overflow: hidden; float: left; } #screens2 { height: 460px; } .panel { float: left; width: 630px; height: 542px; } .stripViewer { position: relative; overflow: hidden; margin: auto; width: 630px; height: 542px; clear: both; z-index: 100; } .stripViewer .panelContainer { position: relative; left: 0; top: 0; width: 100%; list-style-type: none; z-index: 100; } .stripNav { display: none; } .stripNavL a, .stripNavR a { width: 41px; height: 47px; text-indent: -5000px; display: block; position: absolute; top: 135px; z-index: 600; outline: none; } .stripNavL a { background: url(../img/gallery-arrow-left.png) no-repeat 0 0; float: left; left: -19px; } .stripNavR a { background: url(../img/gallery-arrow-right.png) no-repeat 0 0; float: right; left: 608px; } .stripNavL a:hover, .stripNavR a:hover { background-position: 0 -47px; cursor: pointer; outline: none; } #pHome #screens { height: 320px; } #pHome #screens .panel img { border-bottom: solid 5px #000; float: left; } #pHome #screens .panel p { width: 630px; margin: 0; border-bottom: solid 0px #f00; margin-top: 278px; font-size: 0.7em; float: left; } #pHome #screens .panel p a { color: #545252; width: 300px; float: left; padding: 12px 15px 7px 15px; float: left; text-decoration: none; background: #000; } #pHome #screens .panel p a span { font-weight: bold; color: #868686; } #pHome #screens .panel p a:hover { background: url(../images/featured-arrow.gif) no-repeat 306px 15px #000; color: #ccc; } #pHome #screens .panel p a:hover span { color: #fff; } #pHome #gallery { margin: 0; } #img1 { background: url(../home/flash_code.gif) no-repeat 0 0; } #img2 { background: url(../home/cclement_menus.gif) no-repeat 0 0; } #img3 { background: url(../home/vts_brochure_tarifs.gif) no-repeat 0 0; } #img4 { background: url(../home/cclement_menus.gif) no-repeat 0 0; } #gallery blockquote { margin: 0; float: left; width: 510px; padding: 20px 60px 0 60px; font-size: 0.7em; text-align: center; color: #848484; line-height: 1.4em; background: url(../images/blockquote.gif) no-repeat 0 25px; } #gallery blockquote span { color: #666; font-weight: bold; } */ /* --------------------------------------------------------------------------------- SERVICES --------------------------------------------------------------------------------- */ .sbox, .accounting { width: 300px; padding: 0 30px 15px 0; float: left; } .nopadd { padding-right: 0; } .accounting { width: 580px; background: url(../images/accounting-bg.gif) repeat-y 0 0; padding: 20px 25px 10px 25px; margin: 3px 30px 0 0; border-top: solid 1px #cdcec2; border-bottom: solid 1px #cdcec2; } .accounting h2 { padding-top: 3px; } .accounting img { float: right; margin: -2px 0 0 40px; } /* --------------------------------------------------------------------------------- STANDARDS --------------------------------------------------------------------------------- */ #pStandards #content { background: url(../images/h1-standards.gif) no-repeat 0 52px; padding-top: 126px; } #pAbout #content { background: url(../images/h1-about.gif) no-repeat 0 52px; padding-top: 126px; padding-bottom: 20px; } #pContact #content { background: url(../images/h1-getintouch.gif) no-repeat 0 53px; padding: 126px 0 0 0; height: 350px; } #pContact.questionaire #content { height: auto; } #pHosting #content { background: url(../images/h1-hosting.gif) no-repeat 0 53px; padding-top: 126px; } #pAbout .logos { padding-top: 6px; } #pAbout h1 { float: left; width: 100%; } .wide { width: 600px; padding-right: 0; } /* --------------------------------------------------------------------------------- HOSTING --------------------------------------------------------------------------------- */ #hosting { width: 100%; margin: -20px 0 30px 0; border-collapse: collapse; } #hosting th { background: url(../images/hosting-th.gif) repeat-x 0 0 #8bc401; padding: 12px 0; color: #fff; } #hosting td { text-align: center; padding: 12px 0; border-bottom: solid 1px #c1c2b9; border-right: solid 1px #c1c2b9; background: #dee0c8; } #hosting .noBG { background: none; } #hosting .left { width: 285px; text-align: left; background: #fff; padding-left: 15px; border: solid 1px #c1c2b9; } #hosting td.h2 { background: #c9cbb1; border-bottom: solid 1px #b0b298; } #hosting th.h2 { background: url(../images/hosting-th-2.gif) repeat-x 0 0 #6fb100; } /* --------------------------------------------------------------------------------- SUBFOOTER --------------------------------------------------------------------------------- */ /* VERT POMME #82ba00*/ #subfooter-wrap { float: left; width: 100%; height: 15px; }/*background: url(../images/subfooter-wrap-bg.jpg) repeat-y center 0 #9f005a;*/ #subfooter { height: 15px; } /* -- SubFooter - homepage styles -- */ #pHome #content { padding-bottom: 0px; } .homebox { float: left; padding: 41px 30px 20px 0; width: 300px; text-shadow: #FFF 0px 1px 0px; } .homebox h2 { width: 100%; height: 29px; text-indent: -5000px; } .homeboxbis { float: left; padding: 41px 30px 20px 0; width: 300px; text-shadow: #FFF 0px 1px 0px; } .homeboxbis h2 { width: 100%; height: 29px; font-size:18px; color:#999;} .homeboxequipe { float: left; padding: 41px 30px 20px 0; width: 300px; text-shadow: #FFF 0px 1px 0px; } .homeboxequipe h2 { width: 100%; height: 29px; font-size:18px; color:#999;} .homeboxreseau { float: left; padding: 41px 30px 20px 0; width: 300px; text-shadow: #FFF 0px 1px 0px; } .homeboxreseau h2 { width: 100%; height: 29px; font-size:18px; color:#999;} .homeboxcontact { float: left; padding: 41px 30px 20px 0; width: 300px; text-shadow: #FFF 0px 1px 0px; } .homeboxcontact h2 { width: 100%; height: 29px; text-indent: -5000px;} .homeboxcontact2 { float: left; padding: 41px 5px 20px 0; width: 325px; text-shadow: #FFF 0px 1px 0px; } .homeboxcontact2 h2 { width: 100%; height: 29px; text-indent: -5000px;} /*#homebox1 h2 { background: url(../images/h2-meet.gif) no-repeat 0 0; }*/ #homebox1 h2 { background: url(../images/h2-work.gif) no-repeat 0 0; } #homebox2 h2 { background: url(../images/h2-create.gif) no-repeat 0 0; } #homebox3 h2 { background: url(../images/h2-work.gif) no-repeat 0 0; } #homebox1 { background: url(../img/header-div.jpg) no-repeat 0 0; } #homebox3 { width: 240px; padding: 35px 30px 43px 30px; } /*#homebox1bis h2 { background: url(../images/h2-meet.gif) no-repeat 0 0; } #homebox2bis h2 { background: url(../images/h2-create.gif) no-repeat 0 0; } #homebox3bis h2 { background: url(../images/h2-work.gif) no-repeat 0 0; }*/ /*#homebox1bis { background: url(../img/header-div.jpg) no-repeat 0 0; }*/ #homebox3bis { width: 240px; padding: 35px 30px 43px 30px; } /*#homebox1equipe h2 { background: url(../images/h2-meet.gif) no-repeat 0 0; } #homebox2equipe h2 { background: url(../images/h2-create.gif) no-repeat 0 0; } #homebox3equipe h2 { background: url(../images/h2-work.gif) no-repeat 0 0; }*/ /*#homebox1equipe { background: url(../img/header-div.jpg) no-repeat 0 0; }*/ #homebox3equipe { width: 240px; padding: 35px 30px 43px 30px; } /*#homebox1reseau h2 { background: url(../images/h2-meet.gif) no-repeat 0 0; } #homebox2reseau h2 { background: url(../images/h2-create.gif) no-repeat 0 0; } #homebox3reseau h2 { background: url(../images/h2-work.gif) no-repeat 0 0; }*/ /*#homebox1reseau { background: url(../img/header-div.jpg) no-repeat 0 0; }*/ #homebox3reseau { width: 240px; padding: 35px 30px 43px 30px; } /************CONTACT*************/ #homebox1contact h2 { background: url(../img/h2-album.gif) no-repeat 0 0; } #homebox2contact h2 { background: url(../img/h2-contact.gif) no-repeat 0 0; } /*#homebox3contact h2 { background: url(../images/h2-contact-direPlus.gif) no-repeat 0 0; }*/ /*#homebox1contact { background: url(../img/header-div.jpg) no-repeat 0 0; }*/ #homebox3contact { width: 240px; padding: 35px 30px 43px 30px; } #project { padding: 2px 0 15px 0; margin: 0; } #project a { width: 240px; height: 18px; background: url(../images/project-q.gif) no-repeat 0 1px; display: block; } #project a:hover { background-position: 0 bottom; } #project a span { display: none; } #subHome { float: left; width: 100%; margin-top: -1px; } /* --------------------------------------------------------------------------------- PAGE CONTACT ADRESSE (vFlo) --------------------------------------------------------------------------------- */ .contact { /*float: left;*/ padding: 41px 30px 20px 15px; width: 380px; text-shadow: #FFF 0px 1px 0px; } .contact h2 { width: 100%; height: 29px; text-indent: -5000px; } .contact ul li {list-style-type: none;} #contactbox3 li a { background: url(../img/fleche3.png) no-repeat 0px 0px; padding-left:23px; line-height:1.8em; font-size:12px} #contactbox1 {/* background: url(../img/contactbox3-bg.jpg) no-repeat 0px 10px; margin-left:600px;*/} /*#contactbox2 { background: url(../img/contactbox3-bg.jpg) no-repeat 0px 10px; margin-left:200px;}*/ #contactbox2 { /*background: url(../img/contactbox3-bg.jpg) no-repeat 0px 10px; margin-left:200px;*/} #contactbox3 { /*background: url(../img/contactbox3-bg.jpg) no-repeat 0px 10px; margin-left:500px;*/} #contactbox1 h2 { background: url(../img/h2-album.gif) no-repeat 0 9px; } #contactbox2 h2 { background: url(../img/h2-contact.gif) no-repeat 0 9px; } #contactbox3 h2 { background: url(../img/h2-contact-direPlus.gif) no-repeat 0 9px;} /* --------------------------------------------------------------------------------- FOOTER --------------------------------------------------------------------------------- */ #footer-wrap { float: left; width: 100%; } #ftop { float: left; width: 100%; border-bottom: solid 1px #121212; padding: 20px 0 22px 0; } #fbot { float: left; width: 100%; padding: 21px 0 60px 0; } #footer p { color: #666666; margin: 0; } #footer p a { color: #666666; text-decoration: none; } #footer p a:hover { color: #dee0c8; text-decoration: underline; } #footer #facebook { float: right; margin: 17px 0 0 0; } #facebook a { width: 77px; height: 15px; background: url(../img/facebook.gif) no-repeat 0 0; float: left; } #facebook a span { display: none; } #facebook a:hover { background-position: 0 bottom; } #footer #phone, #footer #email { width: 150px; float: left; } #footer #copyright { width: 300px; float: left; padding-left: 30px; } #footer #phone span, #footer #email span, #footer #copyright span { font-weight: bold; color: #4c4c4c; width: 100%; float: left; } #footer #copyright span { width: 300px; } #fbot ul { margin: 0; padding: 0; } #fbot ul li { list-style-type: none; float: left; font-size: 0.7em; padding: 0 7px; border-left: solid 1px #121212; line-height: 1.0em; } #fbot ul li a { color: #666666; text-decoration: none; } #fbot #noDiv { padding-left: 0; border: none; } #fbot ul li a:hover { text-decoration: underline; color: #dee0c8; } #fbot #fNav { float: left; } #fbot #valid { float: right; } #fbot #valid li { border: none; padding-right: 0; } #fbot #valid li a { padding-left: 16px; background: url(../images/tick.gif) no-repeat 0 2px; } #fbot #valid li a:hover { background: url(../images/tick.gif) no-repeat 0 -13px; }