/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - \ | | Copyrigth (c) | Webdesign : CalliWeb | http://www.calliweb.fr | \ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ * {margin: 0; padding: 0; border: 0; font-style: normal; text-decoration: none; list-style: none;} /* --------------------- */ /* General styles */ /* --------------------*/ body {width: 100%; background: #f6f4f4 url(../img/body_bg.png) repeat-x top;text-align:center;/* for fixed layout */font-family: arial,helvetica,sans-serif; font-size: 12px; color:#474545;} a { color:#474545; text-decoration:underline;} a:hover {color: #171717} /*h1, h2, h3 {margin: .8em 0 .2em 0; padding: 0;} */ h1{color:#5f5f5f; font-size:20px; margin-bottom:26px; } /* hack FF pour masquer les contours pointillé sur les liens -------------------------------------------------------*/ a{outline: none;} :focus{-moz-outline-style: none;} p {margin: .4em 0 .8em 0; padding: 0;} img {margin: 10px 0 5px;} .bleu{ color:#0088fc } .clear, .clear2{content:".";display:block;clear:both;height:20px;font-size:0;line-height:0em;visibility:hidden;overflow:hidden;} .clear2{height:0px;} .mentions{font-size:15px;color:#03abf2;} /************************Header styles */ #header{position:relative;height:185px; background: #f6f4f4 url(../img/header_bg.png) repeat-x top; } #header a.logo{ position: absolute;left:23px; top:95px } #header a.devis_haut { position: absolute;left:700px; top:-10px!important; } /***********************column container */ #fixed {margin:0 auto;width:980px;text-align:left; background:#fff}/* for fixed layout */ .colmask {position: relative;clear: both; float: left; width: 100%;overflow: hidden;/* This chops off any overhanging divs */ border-left:1px solid #d9d9d9; border-right:1px solid #d9d9d9} /***********************2 column right menu settings */ .rightmenu { background:#fff; width:978px; /* 2px off for borders*/ } .rightmenu .colleft {float: left; width: 200%; margin-left: -360px; position: relative; right: 100%; background: #fff; } .rightmenu .col1wrap {float: left; width: 50%; position: relative; left: 50%; padding-bottom: 1em;} .rightmenu .col1 {margin: 0 0px 0 373px; overflow: hidden; border-right:1px solid #5f5f5f} .rightmenu .col2 {float: right; width: 310px; position: relative; left: 340px;} #ec .rightmenu .colleft {margin-left: 0px; } #ec .rightmenu .col1 {margin: 0 0px 0 0px; border-right:none} * html .rightmenu .col1 {border-right:none} /***********************Footer styles */ #footer {clear: both; float: left; background:#F6F4F4; width:100%; border-top: 1px solid #d9d9d9;text-align: center;} #footer p {padding: 10px; margin: 0; font-size:11px} #footer a{color:#474545} #footer a:hover {text-decoration:underline} /**********************Design */ #menu ul li a strong,h2 strong, span strong, #menu_right h2 strong, #menu_droite li strong, .titreoff, .titre1 strong, .titre2 strong,.titre3 strong,.titre4 strong{position:absolute; left:-7000px; top:-7000px;} /***********************adresse header */ #contact_header{ bottom:42px; height:89px; position:absolute; right:-101px; width:415px; } *html #contact_header{ top:55px; } address, address.ad2{float:left; color:#fff; border-left:1px solid #fff; margin:15px 0 0px 15px; padding-left:10px; line-height:18px; font-size:14px} address.ad2{margin-left:30px} address.ad2 a{color:#fff; text-decoration:underline;} #magentolinkgauche a, #magentolinkdroit a, #magentolinkcentre a, #magentolinkdroit2 a, #magentolinkgauche2 a {color:#fff; text-decoration:underline} #magentolinkgauche { left:10px; top:260px; position:absolute; color:#fff; text-decoration:underline } #magentolinkdroit { right:20px; top:260px; position:absolute; color:#fff; } #magentolinkcentre { left:350px; top:260px; position:absolute; color:#fff; } #magentolinkgauche2 { left:10px; top:285px; position:absolute; color:#fff; } #magentolinkdroit2 { right:20px; top:285px; position:absolute; color:#fff; } /***********************colonne de droite */ .tem_client{background: url(../img/fond_encart_temoignage_gif.gif) repeat-y top; } .tem_client h2#tem{width:310px; height:47px; background: url(../img/head_temoignage_client_gif.gif) no-repeat; } .tem_client h2#eng{width:310px; height:47px; background: url(../img/head_engagements_gif.gif) no-repeat; } .tem_client h3{color:#b50231; font-size:14px; padding-left:20px; margin-top:15px; background: url(../img/puce_fleche_encart_temoignage.gif) no-repeat 0 2px; } .tem_client h3.next-line{ margin-top:25px; } .promos { bottom:30px; display:block; position:absolute; right:15px; z-index:1000; } .article{ border-bottom:1px solid #000; margin:0px 20px 0px 10px } .article.last{ border-bottom:none } .tem_client span{display:block; width:310px; height:18px; margin-bottom:20px; background: url(../img/footer_encart_temoignage_gif.gif) no-repeat bottom; } .tem_client p{margin:10px 0px 10px 0px} .tem_client p.suite{text-align:right; font-size: 11px;} .tem_client p.suite a{text-decoration:underline; color:#5f5f5f;} .tem_client p.site-client{padding-top:5px } .tem_client p.site-client a{font-size: 11px; text-decoration:underline; } #menu_right, #menu_right2{ margin-bottom: 30px; } #menu_right h2{width:147px; height:42px; background: url(../img/type_de_site.jpg) no-repeat; } #menu_droite li a{display:block; width:220px; height:53px } .menu_vitrine a{background: url(../img/menu_droite_vitrine.png) no-repeat; } .menu_dynamique a{background: url(../img/menu_droite_dynamique.png) no-repeat; } .menu_ecommerce a{background: url(../img/menu_droite_e-commerce.png) no-repeat; } .menu_etplus a{background: url(../img/menu_droite_offre_et+.png) no-repeat; } #menu_right2 h2{ font-size:13px;margin-bottom:10px ;background: url(../img/pucento.gif) no-repeat;padding-left:19px;} #menu_right2 ul, #menu_right2 dl{margin:0 0 20px 5px} #menu_right2 li{margin-bottom:3px } #menu_right2 dt{margin-bottom:5px } #menu_right2 a{text-decoration:none; color:#DF0137; } #menu_right2 a:hover {text-decoration:underline; color:#AF002C; } #menu_right2 dd a{color:#A3A3A3; font-weight:bold; text-decoration: underline; } #actu{ margin:20px 0 40px 0 } #actu h2{ margin-bottom: 15px; text-transform:uppercase;font-size:15px;font-family:Verdana;color:#B50231!important;} #actu h2 a { color:#B50231!important;} #actu h3{ color: #04ABF2;font-size:12px;margin-bottom:8px;color:#282828; } #actu p{ margin: 0 0 20px 0; font-size:11px;border-bottom:1px solid #e0e0e0;padding-bottom:10px;margin-right:15px;} #actu span { font-family:georgia; font-size:10px;color:#fff;background:#04ABF2;padding:1px;margin-right:8px; } #actu a { color:#a1de03; } #actu a:hover{ color:#638900; text-decoration:none; } /***********************Eléments commun */ #flash, #agence, #solution, #vitrine, #dynamique, #ecommerce,#referencement_page, #etplus, #catalogue, #magento {margin:20px 0 40px 0; position:relative} .resume{position:absolute; top:85px; left:15px; width:250px; color:#565656} .resume.solut, .resume.eplus{color:#fff} .resume.e-commerce-magento{ color:#4C4C4C; left:15px; position:absolute; top:119px; width:580px; } .resume.reff { color:#343434; } .ref { color:#fff!important; } h1.encart-h1{ position:absolute; left:320px; top:30px; width:280px; color:#fff; font-size:18px; text-align:center} .devis{text-decoration:none;} .devis:hover{color:#fff;} .devis:hover span{color:#ccc;} .devis_ecommerce, .devis_vitrine, .devis_dynamique { position:absolute; width:218px; height:75px; top:170px; left:360px; font-size:15px; font-weight:normal; color:#fff; padding:12px 0 0 30px;} .devis_vitrine { position:absolute; width:218px; height:75px; top:190px; left:350px; font-size:15px; font-weight:normal; color:#fff; padding:12px 0 0 30px; background: url(../img/a_partir_demander_devis_png_vitrine.gif) no-repeat;} .devis_dynamique { position:absolute; width:218px; height:75px; top:190px; left:350px; font-size:15px; font-weight:normal; color:#fff; padding:12px 0 0 30px; background: url(../img/a_partir_demander_devis_png_dynamique.gif) no-repeat;} .devis.ecommerce { position:absolute; width:218px; height:75px; top:190px; left:350px; font-size:15px; font-weight:normal; color:#fff; padding:12px 0 0 30px; background: url(../img/a_partir_demander_devis_png_ecommerce.gif) no-repeat;} .devisetplus{ position:absolute; width:218px; height:75px; top:190px; left:350px; font-size:15px; font-weight:normal; color:#fff; padding:12px 0 0 30px; background: url(../img/a_partir_demander_devis_png_enplus.gif) no-repeat;} .devis.ecommerce span, .devis_vitrine span, .devis_dynamique span, .devisetplus span{ font-size: 20px; font-weight:bold;} .img-encart{position:absolute; top:0px; left:630px; } #formatage_page{ margin:0 30px } #formatage_page ul {margin-left:10px;} #formatage_page ul li { background:transparent url(../img/puce_liste.gif) no-repeat left 4px; padding-left:15px;} #formatage_page h2{ font-size:16px; color:#df0137; padding-bottom:0px;margin-bottom:10px; border-bottom: 1px solid #B9B9B9;} #formatage_page h2.next{ margin-top:25px} #formatage_page h3{ font-size:14px; color:#0088fc;margin-top: 5px} #formatage_page dd{ margin-left:20px } #formatage_page dt{color:#0088fc; margin-top:5px } /***********************Accueil */ .titre1{width:525px; height:28px; background: url(../img/titre_realisations.gif) no-repeat;} .titre2{width: 490px; height:28px; background: url(../img/titre_clients.gif) no-repeat;} .titre3{width: 490px; height:28px; background: url(../img/titre_temoignage.gif) no-repeat;} .titre4{width: 490px; height:28px; background: url(../img/titre_contact.gif) no-repeat;} #flash{height:175px; margin-bottom:60px; margin-top:0; width:980px;} .ligne{border-bottom: 1px solid #ccc; margin-bottom:20px; padding-bottom:20px; margin-right:10px} .accueil-site{ float:left; width:300px;} .accueil-site2{ float:left; width:250px;margin-left:30px} .ligne img{ margin-bottom :10px } .ligne h2{color:#b50231; font-size:14px;margin-bottom:5px} .ligne p{margin:0;margin-right:60px} .ligne .accueil-site2 p{margin:0;margin-right:0px} .ligne p.suite{text-align:right; font-size: 11px; margin-top:15px} .ligne p.suite a{text-decoration:underline;} /***********************Agence */ #agence{ width:930px; height:288px; margin-left:27px; background: url(../img/encart_agence.jpg) no-repeat; } /***********************Solution globale */ #solution{ width:930px; height:290px; margin-left:27px; background: url(../img/encart_solution.jpg) no-repeat; } #formatage_page h2.hebergement{ height:40px; padding-left:50px; padding-top:10px; background: url(../img/icon_miniature_solution_globale__hebergement_png.png) no-repeat;} #formatage_page h2.creation{ height:40px; padding-left:50px; padding-top:10px; background: url(../img/icon_miniature_solution_globale__creation_png.png) no-repeat;} #formatage_page h2.referencement{ height:40px; padding-left:50px; padding-top:10px; background: url(../img/icon_miniature_solution_globale__referencement_png.png) no-repeat;} /*********************** referencement*/ #referencement_page{ width:930px; height:290px; margin-left:27px; background: url(../img/encart_referencement.jpg) no-repeat; } .bloc_referencement {width:545px;height:140px; position:relative;margin-top:15px;border-bottom: 1px solid #d3d1d1;} .no_border { margin-bottom:40px} .col_left_ref {float:left;width:195px;text-align:center;} .col_right_ref {float:left;} .col_right_ref span{ color:#535353; font-weight:bold } .bloc_referencement dd{ margin-bottom:3px; } .bloc_referencement .titre { font-size:17px; color:#414141; padding-left:9px; } .bloc_referencement .titre a { color:#e11244; text-decoration:none; } .bloc_referencement .titre a:hover { color:#e11244; text-decoration:underline; } .bloc_referencement dd a { color:#e11244; text-decoration:underline; } .bloc_referencement dd a:hover { color:#a2032a; } /*********************** site type*/ #vitrine{ position: relative; width:930px; height:290px; margin-left:27px; background: url(../img/encart_vitrine.jpg) no-repeat; } #dynamique{ position: relative; width:930px; height:290px; margin-left:27px; background: url(../img/encart_dynamique.jpg) no-repeat; } #ecommerce{ position: relative; width:930px; height:290px; margin-left:27px; background: url(../img/encart_ecommerce.jpg) no-repeat; } #etplus{ position: relative; width:930px; height:314px; margin-left:27px; background: url(../img/encart_etplus.jpg) no-repeat;} #e-commerce-magento_offre {margin-top:25px!important; position: relative; width:930px; height:314px; margin-left:27px; background: url(../img/encart_offre.jpg) no-repeat;} #e-commerce-magento_fonctionnalites {margin-top:25px!important; position: relative; width:930px; height:314px; margin-left:27px; background: url(../img/encart_fonctionnalites.jpg) no-repeat;} #e-commerce-magento_ref {margin-top:25px!important; position: relative; width:930px; height:314px; margin-left:27px; background: url(../img/encart_ref.jpg) no-repeat;} #e-commerce-magento_atouts {margin-top:25px!important; position: relative; width:930px; height:314px; margin-left:27px; background: url(../img/encart_atouts.jpg) no-repeat;} #catalogue_magento {margin-top:25px!important;background: url(../img/fond_encart_cata.jpg) no-repeat;position: relative; width:930px; height:314px; margin-left:27px;} #site-dynamique {margin-top:25px!important;background: url(../img/fond_encart_dynamique.jpg) no-repeat;position: relative; width:930px; height:314px; margin-left:27px;} #site-dynamique .resume {color:#fff!important;left:19px; position:absolute; top:126px; width:600px;} #catalogue_magento .resume {color:#fff!important;left:19px; position:absolute; top:126px; width:600px;} #magento{ position: relative; width:930px; height:290px; margin-left:27px; background: url(../img/magento.jpg) no-repeat;} #catalogue{ position: relative; width:930px; height:290px; margin-left:27px; background: url(../img/encart_catalogue.jpg) no-repeat; } .macaron{ display: block; position: absolute; bottom: 5px; right: 15px; z-index: 1000;} .macaronecom{ display: block; position: absolute; bottom: 30px; right: 15px; z-index: 1000;} #realisations-magento { position:absolute; right:27px; top:1px; } #realisations-magento-ref { position:absolute; right:27px; top:45px; } #realisations-dynamique { position:absolute; right:29px; top:45px; z-index:1000; } #menu_magento {left:119px; position:absolute; top:227px;} #menu_magento ul {padding:0;background: url(../img/bg_ul_menu.gif) no-repeat right;} #menu_magento ul li {position:relative; float: left;margin-right:30px;} #menu_magento ul li ul {display: none;} #menu_magento ul strong { position:absolute; top:-3000px;right:-3000px; } #magento_item7 a{ display: block; width: 138px; height: 38px; background: url(../img/item_magento_1_01.gif) no-repeat top left } #magento_item7.active a:link{ background: url(../img/item_magento_1_01.gif) no-repeat bottom left } #magento_item7.active a:visited{ background: url(../img/item_magento_1_01.gif) no-repeat bottom left } #magento_item7 a:hover{background: url(../img/item_magento_1_01.gif) no-repeat bottom left } #magento_item37 a{ display: block; width: 107px; height: 38px; background: url(../img/item_magento_1_02.gif) no-repeat top left } #magento_item37.active a:link{ background: url(../img/item_magento_1_02.gif) no-repeat bottom left } #magento_item37.active a:visited{ background: url(../img/item_magento_1_02.gif) no-repeat bottom left } #magento_item37 a:hover{background: url(../img/item_magento_1_02.gif) no-repeat bottom left } #magento_item27 a{ display: block; width: 172px; height: 38px; background: url(../img/item_magento_1_03.gif) no-repeat top left } #magento_item27.active a:link{ background: url(../img/item_magento_1_03.gif) no-repeat bottom left } #magento_item27.active a:visited{ background: url(../img/item_magento_1_03.gif) no-repeat bottom left } #magento_item27 a:hover{background: url(../img/item_magento_1_03.gif) no-repeat bottom left } #magento_item2 a{ display: block; width: 179px; height: 38px; background: url(../img/item_magento_1_04.gif) no-repeat top left } #magento_item2.active a:link{ background: url(../img/item_magento_1_04.gif) no-repeat bottom left } #magento_item2.active a:visited{ background: url(../img/item_magento_1_04.gif) no-repeat bottom left } #magento_item2 a:hover{background: url(../img/item_magento_1_04.gif) no-repeat bottom left } #fonctionnalites h3{ margin-bottom:5px;} #fonctionnalites ul {margin-left:15px;} #fonctionnalites ul ul li { list-style: none;} .floatright {float:right; margin:0 0 0 15px;} .def dt {color: } .retour {float:right; text-decoration: underline;} .blocfonc {margin:auto;margin-top:20px;height:20px; width:400px;background-color:#72a4ff;border: 2px solid #72a4be;padding-bottom:5px;margin-top:10px;text-align: center; font-size: 13px; font-family: Verdana;} /***********************Nos clients */ .marg{ margin-top:70px } .client_site{ margin:20px 20px 10px 0; border-bottom: 1px solid #ccc;} .client_site img{ float:left; margin-top:5px; } .text_client{ float:right; width:320px } .text_client .suite{ text-align:right } .text_client span{ font-weight:bold } .client_site h2{color:#b50231; font-size:15px; margin-bottom:5px} .client_site h2 span{color:#727272;font-size:13px;} /***********************témoignage clients */ .temoignage{margin:0 20px 20px 0; border-bottom:1px solid #ccc; color:#7f7f7f} .temoignage h2{color: #a70000; font-size:16px} .sign{text-align: right; color:#7f7f7f; font-size:13px} /* ----------------------------*/ /* MISE EN PLACE DU MENU HAUT */ /* --------------------------*/ #menu{z-index:3000; position:relative; margin:0; height:53px; background: url(../img/bg_menu.gif) repeat-x top;} #menu ul {padding:0;background: url(../img/bg_ul_menu.gif) no-repeat right;} #menu ul li {position:relative; float: left;} #menu ul li ul {display: none;} #menu #item1 a{ display: block; width: 159px; height: 38px; background: url(../img/menu/item1.gif) no-repeat top left } #menu #item1.active a:link{ background: url(../img/menu/item1.gif) no-repeat bottom left } #menu #item1.active a:visited{ background: url(../img/menu/item1.gif) no-repeat bottom left } #menu #item1 a:hover{background: url(../img/menu/item1.gif) no-repeat bottom left } #menu #item3 a{ display: block; width: 179px; height: 38px; background: url(../img/menu/item3.gif) no-repeat top left } #menu #item3.active a:link{ background: url(../img/menu/item3.gif) no-repeat bottom left } #menu #item3.active a:visited{ background: url(../img/menu/item3.gif) no-repeat bottom left } #menu #item3 a:hover{background: url(../img/menu/item3.gif) no-repeat bottom left } #menu #item75 a{ display: block; width: 179px; height: 38px; background: url(../img/menu/item75.gif) no-repeat top left } #menu #item75.active a:link{ background: url(../img/menu/item75.gif) no-repeat bottom left } #menu #item75.active a:visited{ background: url(../img/menu/item75.gif) no-repeat bottom left } #menu #item75 a:hover{background: url(../img/menu/item75.gif) no-repeat bottom left } #menu #item69 a{ display: block; width: 137px; height: 38px; background: url(../img/menu/item4.gif) no-repeat top left } #menu #item69.active a:link{ background: url(../img/menu/item4.gif) no-repeat bottom left } #menu #item69.active a:visited{ background: url(../img/menu/item4.gif) no-repeat bottom left } #menu #item69 a:hover{background: url(../img/menu/item4.gif) no-repeat bottom left } #menu #item9 a{ display: block; width: 168px; height: 38px; background: url(../img/menu/item5.gif) no-repeat top left } #menu #item9.active a:link{ background: url(../img/menu/item5.gif) no-repeat bottom left } #menu #item9.active a:visited{ background: url(../img/menu/item5.gif) no-repeat bottom left } #menu #item9 a:hover{background: url(../img/menu/item5.gif) no-repeat bottom left } #menu #item10 a{ display: block; width: 131px; height: 38px; background: url(../img/menu/item6.gif) no-repeat top left } #menu #item10.active a:link{ background: url(../img/menu/item6.gif) no-repeat bottom left } #menu #item10.active a:visited{ background: url(../img/menu/item6.gif) no-repeat bottom left } #menu #item10 a:hover{background: url(../img/menu/item6.gif) no-repeat bottom left } /* INPUTS DU FORMULAIRE */ #feedbackForm{ margin-left:0px ; } #feedbackForm p{ margin-left:0px ; } p.thankyou{ text-align: center; padding: 10px; margin: 20px 0 40px 0; border: 1px dashed #CCC;} #errors, .errors{ color: red; background: #CCC; padding: 10px; font-size:11px; margin: 0 10px 10px 0;} input{ font-size: 12px; height:15px; padding: 1PX 0 1PX 4px; border:1px solid #b5b5b5; width: 200px;background: url(../img/bg_input.gif)repeat-x; } textarea{ font-size: 12px; padding: 4px;border:1px solid #b5b5b5; width: 330px; height:140px;background: url(../img/bg_area.gif) top left; } select{ border:1px solid #b5b5b5; width: 60px;background: url(../img/bg_input.gif)repeat-x;} #valid { background:transparent url(../img/bt.gif) no-repeat left top; cursor:pointer; display:block; height:23px; margin-left:110px; margin-bottom:30px; width:100px; border:none } #valid_en { background:transparent url(../img/bt_en.gif) no-repeat left top; cursor:pointer; display:block; height:22px; margin-left:10px; margin-bottom:30px; width:77px; border:none } iframe{ border:1px solid #4C4C4C; margin-left:44px;margin-bottom:20px; } #contact-plan{ margin-left:44px;margin-bottom:20px; } #h_accueil { margin-left:14px; margin-bottom:-17px !important; } #diaporama_offre_2 { float:right; margin-left:20px; } /* Desabonnement newsletter */ #desab{ margin: 50px 0 0 80px; width:400px; text-align: center; padding: 20px; border: 1px dashed #CDCDCD; }