toute la page **

bandeau superieur (logo, etc) ** zone utile ** */ #main { margin: 0px auto; width: 1016px; position: relative; } #content { float: left; position: relative; width: 660px; padding-top: 20px; padding-right: 30px; padding-left: 30px; padding-bottom: 20px; } /* ** Bandeau superieur ** ======================================================================================== ** */ #header { height: 135px; background: url(../img/entete/bgheader.png) no-repeat; } #header .homebtn { display: block; position: absolute; background: url(../img/entete/bt_accueil.jpg) no-repeat; padding-left: 25px; padding-top: 3px; color: white; } #header .homebtn:hover { text-decoration:underline; } #header .logo { display: block; position: absolute; top: 37px; left: 53px; } /* ** Pied de page ** ======================================================================================== */ #footer { clear: both; height: 58px; background-image: url(../img/pied/bg_piedpage.jpg); background-repeat: no-repeat; } #footer P { padding-top: 25px; padding-right: 20px; font-size: 10px; color: #eea812; text-align: right; } #footer A { font-size: 10px; color: #eea812; text-decoration: none; } #footer A:hover { font-size: 10px; color: #ffffff; text-decoration: underline; } /* ** Barre de menu ** ======================================================================================== */ #menubar { height: 40px; background: url(../img/menu/background.png); } #menubar A { display: block; float: left; text-align: center; padding-top: 9px; padding-left: 17px; padding-right: 17px; height: 20px; background: url(../img/menu/separator.gif) right center no-repeat; overflow: hidden; font-size: 12px; color: #5a566d; text-decoration: none; } #menubar A:hover, #menubar A.selected { color: #ffffff; font-size: 12px; text-decoration: none; } #sub_fonctionnalites { position: absolute; top: 167px; left: 120px; z-index: 100; background-color: #ea960e; display: none; padding: 5px 20px 20px 20px; } #sub_fonctionnalites P { padding: 5px 0px 0px 5px; } #sub_fonctionnalites A { font-size: 12px; color: #58546a; text-decoration: none; } #sub_fonctionnalites A:hover { color: #ffffff; font-size: 12px; text-decoration: none; } /* ** Bandeau de droite (solutions) ** ======================================================================================== ** ** Avec la classe "solutions", on affiche le bandeau des solutions teambox ** */ #rightpanel { float: left; position: relative; left: 0px; width: 272px; padding-bottom: 30px; margin-top: 50px; } #rightpanel.solutions { margin-top: -61px; margin-left: 2px; background: url(../img/solutions/bg_solutions.png) no-repeat; } #rightpanel IMG { border: none; } /* ** Page d'accueil ** ======================================================================================== ** */ #accueil .left { width: 460px; float: left; } #accueil .right { width: 190px; float: left; } #accueil .news { width: 448px; padding-top: 13px; text-align: left; background: url(../img/accueil/boite_infos.jpg) no-repeat center top; } #accueil .news H2 { font-size: 17px; color: #eea812; font-weight: normal; padding-left: 17px; } #accueil .news IMG { padding-right: 12px; float: left; border: 1px solid #cccbd2; } #titre-accueil { display: block; width: 222px; height: 58px; background: url(../img/entete/logo_teambox.jpg) left top no-repeat; } #titre-accueil span { display: none; } #phoneTeambox { position: absolute; top: 6px; left: 709px; } #menuSolutions { position: absolute; top: 54px; left: 93px; z-index: 100; background-color: #ea960e; display: none; } #menuInfos { position: absolute; top: 54px; left: 390px; z-index: 100; background-color: #ea960e; display: none; } .titreSolutions { padding-top: 9px; padding-bottom: 11px; text-align: center; } .titreSolutions h2 { font-size: 17px; color: #eea812; font-weight: normal; } .solutions { padding-left: 7px; padding-right: 5px; padding-top: 0px; padding-bottom: 0px; } .solutions p { font-size: 11px; color: #000000; text-align: left; line-height: 18px; } .solutions h3 { padding-left: 14px; padding-bottom: 8px; } .solutions a { font-size: 12px; color: #5a566d; text-decoration: none; } .solutions a:hover { font-size: 12px; color: #fe9601; text-decoration: none; } .solutions img { padding-right: 10px; padding-left: 5px; padding-top: 5px; float: left; } .solutions DIV { padding-top: 12px; padding-right: 5px; } .solutions P { padding-bottom: 24px; background: url(../img/solutions/separation.gif) center bottom no-repeat; } .solutions DIV.selected { border-left: 4px solid #EEA812; border-right: 4px solid #EEA812; } .solutions DIV.selected H3 A { color: #D78702; } .line { padding: 0px; margin: 0px; border-top: 1px solid #cccbd2; clear: both; } #entete img { border: none; } .intro { font-size: 12px; color: #4b4256; } .intro img { float: left; border: 0px; margin-right: 15px; } #accueil img { border: none; } #accueil p { font-size: 12px; color: #38302b; line-height: 16px; } #accueil a { font-size: 12px; color: #38302b; text-decoration: none; } #accueil a:hover { font-size: 12px; color: #fe9601; text-decoration: underline; } .btOffreG { position: absolute; top: 267px; left: 27px; } .btOffreC { position: absolute; top: 267px; left: 181px; } .btOffreD { position: absolute; top: 259px; left: 344px; } .sousMenusAccueil p { font-size: 12px; color: #38302b; margin-bottom: 5px; background: url(../img/accueil/puce.gif) left top no-repeat; } .sousMenusAccueil a { color: #38302b; padding-left: 22px; } .sousMenusAccueil a:hover { color: #fe9601; } .sousMenusAccueil a span { font-size: 9px; letter-spacing:-1px; } .offreSpeciale { margin-top: 35px; } img.imgActualite { border: 1px solid #cccbd2; } .actualites { margin-top: 25px; padding-left: 15px; padding-right: 15px; padding-bottom: 30px; min-height: 75px; } #notreOffre h3 { padding: 0; margin: 0; } #notreOffre h3 a { font-size: 12px; color: #5a566d; text-decoration: none; } #notreOffre h3 a:hover { font-size: 12px; color: #eea812; text-decoration: none; } #notreOffre .btOffreG { position: relative; top: 13px; float: left; left: 127px; width: 100px; height: 20px; } #notreOffre .btOffreC { position: relative; top: 13px; float: left; left: 180px; width: 100px; height: 20px; } #notreOffre .btOffreD { position: relative; float: left; top: 5px; left: 230px; width: 100px; height: 35px; } .uneOffre { padding-top: 20px; margin-bottom: 0px; } .uneOffreG { float: left; width: 320px; padding-bottom: 28px; padding-right: 10px; } .uneOffreD { float: right; left: 0px; width: 319px; padding-bottom: 28px; padding-left: 10px; } .uneOffre img { float: left; border: 0px; margin: 0px 10px 0px 10px; } .uneOffre p { font-size: 12px; text-align: justify; } .tableauOffre img { border: 0px; } #fonctionnalites .btOffreG { position: relative; top: 13px; float: left; left: 127px; width: 100px; height: 20px; } #fonctionnalites .btOffreC { position: relative; top: 13px; float: left; left: 180px; width: 100px; height: 20px; } #fonctionnalites .btOffreD { position: relative; float: left; top: 5px; left: 230px; width: 100px; height: 35px; } .uneFonctionnalite { padding-top: 15px; padding-bottom: 15px; } .uneFonctionnalite h2 { padding-bottom: 10px; } .uneFonctionnalite h2 a { font-size: 14px; color: #d78702; text-decoration: none; } .uneFonctionnalite h2 a:hover { font-size: 14px; color: #565066; text-decoration: none; } .uneFonctionnalite img { float: left; margin-right: 30px; margin-bottom: 15px; border: 0px; } .detailDeLaFonct { padding-top: 20px; margin-bottom: 0px; } .detailDeLaFonct h2 a { color: #d78702; text-decoration: none; } .detailDeLaFonctG { float: left; width: 390px; padding-bottom: 28px; } .detailDeLaFonctD { float: right; left: 0px; width: 268px; text-align: right; padding-top: 7px; padding-bottom: 28px; } #btDemoOnLine { float: right; margin-right: 50px; text-align: center; width: 135px; height: 31px; padding: 13px 0px 0px 0px; background: url(../img/fonctionnalites/bouton.gif) no-repeat; } #btDemoOnLine a { font-size: 12px; color: #4a4255; font-weight: normal; text-decoration: none; } #btDemoOnLine a:hover { font-weight: normal; color: #ffffff; text-decoration: none; } #solutions .uneSolution { padding-top: 15px; padding-bottom: 15px; } #solutions .uneSolution h2 { padding-bottom: 10px; } #solutions .uneSolution h2 a { font-size: 14px; color: #eea812; text-decoration: none; } #solutions .uneSolution h2 a:hover { font-size: 14px; color: #565066; text-decoration: none; } #solutions .uneSolution img { float: left; margin-right: 30px; margin-bottom: 15px; border: none; } #btDevisOnLine { text-align: center; float: right; width: 135px; height: 31px; padding: 13px 0px 0px 0px; background: url(../img/fonctionnalites/bouton.gif) no-repeat; margin-left: auto; margin-right: auto; float: none; } #btDevisOnLine a { font-size: 12px; color: #4a4255; font-weight: normal; text-decoration: none; } #btDevisOnLine a:hover { font-weight: normal; color: #ffffff; text-decoration: none; } .uneSolution { padding-top: 20px; margin-bottom: 0px; } .uneSolution h3 a { font-size: 12px; color: #5a566d; text-decoration: underline; } .uneSolution h3 a:hover { font-size: 12px; color: #fe9601; text-decoration: none; } .uneSolutionG { float: left; width: 390px; padding-bottom: 28px; } .uneSolutionD { float: right; left: 0px; width: 268px; text-align: center; padding-top: 7px; padding-bottom: 28px; } .uneActualite { padding-top: 25px; padding-bottom: 45px; } .uneActualite h2 { color: #5a566d; padding-bottom: 10px; } .uneActualite h2 a { font-size: 14px; color: #5a566d; text-decoration: none; } .uneActualite h2 a:hover { font-size: 14px; color: #eea812; text-decoration: none; } a.linkActualite { float: left; margin-right: 20px; margin-bottom: 45px; margin-top: 10px; } a.linkActualite .imgActualite { float: left; margin-right: 20px; margin-bottom: 45px; border: 1px solid #cccbd2; } .imgActualite { float: left; margin-right: 20px; margin-bottom: 15px; } .uneActualite p a img { border: 0px; float: none; margin-top: -8px; margin-bottom: 0px; } .listeTemoignages { padding-top: 15px; padding-bottom: 15px; } .listeTemoignages h2 { padding-bottom: 10px; } .listeTemoignages h2 a { font-size: 14px; color: #eea812; text-decoration: none; } .listeTemoignages h2 a:hover { font-size: 14px; color: #565066; text-decoration: none; } .listeTemoignages img { float: left; margin-right: 30px; margin-bottom: 15px; } #temoignage h1 a { color: #38302b; font-size: 18px; text-decoration: none; } #temoignage h1 a:hover { color: #fe9601; font-size: 18px; text-decoration: none; } .unTemoignage { padding-top: 30px; margin-bottom: 0px; } .unTemoignageG { float: left; padding-top: 4px; width: 276px; padding-bottom: 40px; } .unTemoignageD { float: right; left: 0px; width: 383px; padding-bottom: 40px; } .unCasClient { padding-top: 30px; margin-bottom: 0px; } .unCasClientG { float: left; padding-top: 4px; width: 175px; padding-bottom: 40px; } .unCasClientD { float: right; width: 484px; padding-bottom: 40px; } .autres { padding-top: 30px; margin-bottom: 0px; } #autres h2 a { font-size: 14px; color: #d78702; text-decoration: none; } .autresG { float: left; width: 473px; padding-bottom: 40px; } .autresG p { /* text-align: justify; */ } .autresD { float: right; text-align: right; padding-top: 4px; width: 186px; padding-bottom: 40px; } /* === */ /* FIN CSS SPECIFIQUE AUTRES */ /* === */ /* === */ /* CSS SPECIFIQUE DEVIS */ /* === */ #devis form { padding: 0px; margin: 0px; } #devis span { font-size: 10px; color: #F00; } #devis p { color: #000000; margin: 0px; } #monChoix1, #monChoix2, #monChoix3 { margin-left: 60px; } #monChoix1 p, #monChoix2 p, #monChoix3 p { padding: 0 0 0 15px; } /* === */ /* FIN CSS SPECIFIQUE DEVIS */ /* === */ /* === */ /* CSS SPECIFIQUE CONTACT (sans formulaire) */ /* === */ #contactTeambox { text-align: center; } #contactTeambox p { text-align: center; color: #5a566d; font-size: 13px; } #contactTeambox strong { color: #d78702; } /* === */ /* FIN CSS SPECIFIQUE CONTACT (sans formulaire) */ /* === */ /* === */ /* CSS SPECIFIQUE AU DIFFERENTS FORMULAIRES DE CONTACT (contact / nous vous rappelons) */ /* === */ #formulairecontact { width: 540px; padding-top: 20px; padding-bottom: 20px; margin: 0 0 0 20px; /* background-color: #e5e5e5; */ border-radius: 1em; -moz-border-radius: 1em; } #formulairecontact fieldset { border: none; } #formulairecontact error_message { color: red; } #formulairecontact legend { font-size: 14px; color: #5a566d; font-weight: bold; margin-left: 15px; } #formulairecontact label { font-size: 12px; display: block; float: left; width: 100px; padding-top: 3px; padding-right: 20px; text-align: right; } /* #formulairecontact input, #formulairecontact select, #formulairecontact textarea { width: 250px; } */ #formulairecontact span { font-size: 12px; color: #F00; } #formulairecontact table { margin: auto; } #formulairecontact #formContact { margin: 0px 0px 0px 35px; } /* === */ /* FIN CSS SPECIFIQUE AU DIFFERENTS FORMULAIRES DE CONTACT (contact / nous vous rappelons) */ /* === */ /* === */ /* CSS SPECIFIQUE TELEPHONES */ /* === */ /* .unTelephone { padding-top: 20px; margin-bottom: 0px; } .unTelephoneG { float: left; width: 319px; padding-bottom: 28px; padding-right: 10px; border-right: 1px solid #666; } .unTelephoneD { float: right; left: 0px; width: 319px; padding-bottom: 28px; padding-left: 10px; } .unTelephone img { float: left; border: 0px; margin: 0px 20px 0px 10px; } .unTelephone p { font-size: 12px; text-align: justify; } .unTelephone h3 { display: block; background-color: #CCC; height: 30px; padding: 10px 0 0 25px; } .unTelephone h3 a { font-size: 14px; color: #5a566d; text-decoration: none; } .unTelephone h3 a:hover { font-size: 14px; color: #eea812; text-decoration: none; } */ .unTelephone { padding-top: 25px; padding-bottom: 45px; } .unTelephone h2 { color: #5a566d; padding-bottom: 10px; } .unTelephone h2 a { font-size: 14px; color: #5a566d; text-decoration: none; } .unTelephone h2 a:hover { font-size: 14px; color: #eea812; text-decoration: none; } .unTelephone img { float: left; margin-right: 20px; margin-bottom: 45px; } .unTelephone p a img { border: 0px; float: none; margin-top: -8px; margin-bottom: 0px; } /* === */ /* FIN CSS SPECIFIQUE TELEPHONES */ /* === */ DIV.avantageSolution { display: block; float: none; width: 242px; height: 140px; padding: 2px; text-align: left; margin-top:20px; margin-left: auto; margin-right: auto; background: url(../img/solutions/bgavantages.png) no-repeat; } DIV.avantageSolution .titre { display: block; font-weight: bold; padding: 4px; border-bottom: 1px solid white; text-align: center; } DIV.avantageSolution UL { list-style-type: square; padding-left: 25px; padding-right: 10px; } DIV.avantageSolution LI { padding-bottom: 4px; } /* ** Lexique ** */ .lexiqueIndex { font-size: 10px; color: #565066; } .lexiqueIndex A { font-size: 13px; font-weight: bold; color: black; text-decoration:none; } /* ** Videos ** */ .videocontainer { border-top:1px solid #D78702; position:relative; height: 150px; width: 550px; } .videocontainer .texte { position:absolute; left: 0; right: 170px; margin-top: 10px; } .videocontainer UL { list-style-position: outside; padding-left: 15px; } .videocontainer LI { padding-bottom: 5px; } DIV.videocontainer DIV.lettrine { position:absolute; right:0; } IMG.videothumb { width: 160px; height: 126px; cursor: pointer; } DIV.blocker { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1000; background-color: white; } IFRAME.videoframe { position: fixed; width: 796px; height: 670px; left: 50%; top: 50%; padding: 0; margin: 0; margin-left: -394px; margin-top: -350px; background-color:white; border: 1px solid #404040; z-index: 10000; overflow: hidden; } #flashcontainer { position: relative; width: 776px; height: 600px; background-color:red; margin-top: 6px; margin-bottom: 8px; } DIV.framebody { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; } /* ** ** Boutons ** ======= ** */ DIV.button A { display: block; text-decoration:none; } DIV.button A:hover { color: #565066; } DIV.button { position: relative; width: 134px; height: 42px; background: url(../img/autres/bgbtn.png) no-repeat; font-size: 12px; padding-top: 12px; cursor: pointer; color: black; } DIV.button:hover { background: url(../img/autres/bgbtn_over.png) no-repeat; color: #565066; } /* ** Formulaire devis en ligne ** ** */ #formulaireDevis .error_message { color: red; padding: 10px; font-size: 12px; border: 1px solid red; background-color:#FFe0e0; } #formulaireDevis INPUT { padding: 0; margin: 0; margin-right:5px; } #formulaireDevis H2 { margin-top: 10px; padding-bottom: 10px; } #formulaireDevis DIV.error { margin-top: 10px; padding-bottom: 7px; padding-top: 0px; padding-left: 10px; border-left: 3px solid red; background-color:#FFe0e0; } #formulaireDevis DIV.error H2 { color: red; } /* ** Zones "expandable" ** ** */ A.expand { cursor: pointer; } A.shrink { cursor: pointer; display: none; } .expandable { display: none; } /* ** Boutons ** ======= ** */ DIV.btnbar { height: 44px; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; } DIV.imgbutton, DIV.button { color:#4A4255 !important; font-size:10px !important; margin-left:5px; margin-right:5px; float: left; display: block; position: relative; width: 134px; height: 44px; overflow:hidden; line-height:44px; background: url(../img/btn/btn.gif) no-repeat; } DIV.button A, DIV.imgbutton A { display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; text-align: center; } DIV.imgbutton A { padding-left:200px; } DIV.imgbutton:hover { background: url(../img/btn/btn_over.gif) no-repeat; color:black !important; text-decoration:none !important; } /* ** Boutons "image" ** */ DIV.imgbutton.btdemo { background: url(../img/btn/btdemo.gif) no-repeat; } DIV.imgbutton.btdemo:hover { background: url(../img/btn/btdemo_over.gif) no-repeat; } DIV.imgbutton.btdevis { background: url(../img/btn/btdevis.gif) no-repeat; } DIV.imgbutton.btdevis:hover { background: url(../img/btn/btdevis_over.gif) no-repeat; } DIV.imgbutton.btrappel { background: url(../img/btn/btrappel.gif) no-repeat; } DIV.imgbutton.btrappel:hover { background: url(../img/btn/btrappel_over.gif) no-repeat; } DIV.imgbutton.btsavoirplus { background: url(../img/btn/btsavoirplus.gif) no-repeat; } DIV.imgbutton.btsavoirplus:hover { background: url(../img/btn/btsavoirplus_over.gif) no-repeat; } /* ** Divers ** */ .floatright { float:right; } .floatleft { float:left; }