/*************************************************************************************************** Auteur : Isabelle Custeau Date creation : Aout 2009 Fichier : style_cgp.css Type : theme / Description : Contient toutes les style utilisés pour le site FIBROBEC ***************************************************************************************************/ /* CSS reset */ html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input,hr {margin:0; padding:0;} h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,th {font-size:1em; font-weight:normal; font-style:normal;} ul,ol {list-style:none;} fieldset,img,hr {border:none;} caption,th {text-align:left;} table {border-collapse:collapse; border-spacing:0;} td {vertical-align:top;} /* Fin CSS reset */ body { font-family: Tahoma,Verdana,Arial,Helvetica, sans-serif; text-align: center; /* Aligne le contenu du site au centre de la fenêtre */ margin: 0px; color:#2a363a; font-size:12px; /* background-color :#666666;*/ background:transparent url('../../../templates/images/fr/site/bg.jpg') repeat 0px 0px; } /********** Contrôle du contenue et de son positionnement global dans la page **********/ /*contour utilisé pour les boite principale*/ #div_main_content { position: relative; margin-left: auto; /* Permet de centrer le div au centre de la fenêtre du browser */ margin-right: auto; /* Permet de centrer le div au centre de la fenêtre du browser */ width: 958px; /* border:1px solid blue;*/ } /*contenue des pages des différente section*/ #div_page_content{ float:left; text-align: left; padding:0px 9px 8px 0px; width:947px;; background-color:#ffffff; /*border:1px solid red;*/ } /*--------------------------------------Début---Header*--------------------------------------------*/ p.flash{padding-left:10px;} div.header{ padding-left:4px; } /*--------------------------------------FIN---Header*--------------------------------------------*/ /*--------------------------------------Début---Menu*--------------------------------------------*/ #menu{float:left;width:938px;margin:9px 0px 6px 8px;} .separateur_header_menu{ float:left; width:938px; margin-left:1px; line-height:5px; background-color:#3c444f; } #menu_box{ float:left; margin:4px 1px 6px 0px; } #accueil_bouton_fr,#accueil_bouton_en,#entreprise_bouton_fr,#entreprise_bouton_en, #produit_bouton_fr,#produit_bouton_en,#promotion_bouton_fr,#promotion_bouton_en, #publication_bouton_fr,#publication_bouton_en,#contact_bouton_fr,#contact_bouton_en, #accueil_bouton_selected_fr,#accueil_bouton_selected_en,#entreprise_bouton_selected_fr,#entreprise_bouton_selected_en, #produit_bouton_selected_fr,#produit_bouton_selected_en,#promotion_bouton_selected_fr,#promotion_bouton_selected_en, #publication_bouton_selected_fr,#publication_bouton_selected_en,#contact_bouton_selected_fr,#contact_bouton_selected_en { float:left; width:152px; height:43px; margin-right:5px; } #accueil_bouton_fr{background:transparent url('../../../templates/images/fr/site/accueil_bouton.jpg') no-repeat 0px 0px;} #accueil_bouton_en{background:transparent url('../../../templates/images/en/site/accueil_bouton.jpg') no-repeat 0px 0px;} #entreprise_bouton_fr{background:transparent url('../../../templates/images/fr/site/entreprise_bouton.jpg') no-repeat 0px 0px;} #entreprise_bouton_en{background:transparent url('../../../templates/images/en/site/entreprise_bouton.jpg') no-repeat 0px 0px;} #produit_bouton_fr{background:transparent url('../../../templates/images/fr/site/produit_bouton.jpg') no-repeat 0px 0px;} #produit_bouton_en{background:transparent url('../../../templates/images/en/site/produit_bouton.jpg') no-repeat 0px 0px;} #publication_bouton_fr{background:transparent url('../../../templates/images/fr/site/publication_bouton.jpg') no-repeat 0px 0px;} #publication_bouton_en{background:transparent url('../../../templates/images/en/site/publication_bouton.jpg') no-repeat 0px 0px;} #contact_bouton_fr{margin-right:0px;background:transparent url('../../../templates/images/fr/site/contact_bouton.jpg') no-repeat 0px 0px;} #contact_bouton_en{margin-right:0px;background:transparent url('../../../templates/images/en/site/contact_bouton.jpg') no-repeat 0px 0px;} #promotion_bouton_fr{background:transparent url('../../../templates/images/fr/site/promotion_bouton.jpg') no-repeat 0px 0px;} #promotion_bouton_en{background:transparent url('../../../templates/images/en/site/promotion_bouton.jpg') no-repeat 0px 0px;} #accueil_bouton_fr a,#accueil_bouton_en a,#accueil_bouton_selected_fr a,#accueil_bouton_selected_en a, #entreprise_bouton_fr a,#entreprise_bouton_en a,#entreprise_bouton_selected_fr a,#entreprise_bouton_selected_en a, #produit_bouton_fr a,#produit_bouton_en a,#produit_bouton_selected_fr a,#produit_bouton_selected_en a, #promotion_bouton_fr a,#promotion_bouton_en a,#promotion_bouton_selected_fr a,#promotion_bouton_selected_en a, #publication_bouton_fr a,#publication_bouton_en a,#publication_bouton_selected_fr a,#publication_bouton_selected_en a, #contact_bouton_fr a,#contact_bouton_en a,#contact_bouton_selected_fr a,#contact_bouton_selected_en a { float:left; width:152px; height:43px; text-decoration:none; } #accueil_bouton_fr a:hover,#accueil_bouton_selected_fr{background:transparent url('../../../templates/images/fr/site/roll/accueil_bouton.jpg') no-repeat 0px 0px;} #accueil_bouton_en a:hover,#accueil_bouton_selected_en{background:transparent url('../../../templates/images/en/site/roll/accueil_bouton.jpg') no-repeat 0px 0px;} #entreprise_bouton_fr a:hover,#entreprise_bouton_selected_fr{background:transparent url('../../../templates/images/fr/site/roll/entreprise_bouton.jpg') no-repeat 0px 0px;} #entreprise_bouton_en a:hover,#entreprise_bouton_selected_en{background:transparent url('../../../templates/images/en/site/roll/entreprise_bouton.jpg') no-repeat 0px 0px;} #produit_bouton_fr a:hover,#produit_bouton_selected_fr{background:transparent url('../../../templates/images/fr/site/roll/produit_bouton.jpg') no-repeat 0px 0px;} #produit_bouton_en a:hover,#produit_bouton_selected_en{background:transparent url('../../../templates/images/en/site/roll/produit_bouton.jpg') no-repeat 0px 0px;} #publication_bouton_fr a:hover,#publication_bouton_selected_fr{background:transparent url('../../../templates/images/fr/site/roll/publication_bouton.jpg') no-repeat 0px 0px;} #publication_bouton_en a:hover,#publication_bouton_selected_en{background:transparent url('../../../templates/images/en/site/roll/publication_bouton.jpg') no-repeat 0px 0px;} #contact_bouton_fr a:hover,#contact_bouton_selected_fr{margin-right:0px;background:transparent url('../../../templates/images/fr/site/roll/contact_bouton.jpg') no-repeat 0px 0px;} #contact_bouton_en a:hover,#contact_bouton_selected_en{margin-right:0px;background:transparent url('../../../templates/images/en/site/roll/contact_bouton.jpg') no-repeat 0px 0px;} #promotion_bouton_fr a:hover,#promotion_bouton_selected_fr{background:transparent url('../../../templates/images/fr/site/roll/promotion_bouton.jpg') no-repeat 0px 0px;} #promotion_bouton_en a:hover,#promotion_bouton_selected_en{background:transparent url('../../../templates/images/en/site/roll/promotion_bouton.jpg') no-repeat 0px 0px;} /*--------------------------------------FIN---MENU*--------------------------------------------*/ /*--------------------------------------Début---Recherche*--------------------------------------------*/ #image_recherche_fr,#image_recherche_en{ float:left; margin-left:8px; width:939px; height:87px; background:transparent url('../../../templates/images/fr/site/recherche_fibrobec.jpg') no-repeat 0px 0px; } #image_recherche_en{background:transparent url('../../../templates/images/en/site/recherche_fibrobec.jpg') no-repeat 0px 0px;} .recherche{ float:left; text-align:center; font-weight:bold; margin:40px 0px 0px 31px; } #recherche_bouton_fr,#recherche_bouton_en{ float:left; width:150px; height:24px; margin:38px 0px 0px 6px; } #recherche_bouton_fr {background:transparent url('../../../templates/images/fr/site/recherche.jpg') no-repeat 0px 0px;} #recherche_bouton_en {background:transparent url('../../../templates/images/en/site/recherche.jpg') no-repeat 0px 0px;} #recherche_bouton_fr a,#recherche_bouton_en a{ float:left; width:150px; height:24px; text-decoration:none; } #recherche_bouton_fr a:hover{background:transparent url('../../../templates/images/fr/site/roll/recherche.jpg') no-repeat 0px 0px;} #recherche_bouton_en a:hover{background:transparent url('../../../templates/images/en/site/roll/recherche.jpg') no-repeat 0px 0px;} /*--------------------------------------FIN---Recherche*--------------------------------------------*/ /*--------------------------------------Début---footer*--------------------------------------------*/ #footer_ligne_top,#footer_ligne_bottom{ float:left; width:939px; height:3px; margin:10px 0px 0px 8px; background:transparent url('../../../templates/images/fr/site/footer_bg_top.jpg') repeat-x 0px 0px; } #footer_ligne_bottom{margin-top:0px;} .footer_ligne_left,#footer_ligne_right{ float:left; width:1px; height:81px; background:transparent url('../../../templates/images/fr/site/footer_bg_top.jpg') repeat-y 0px 0px; } #footer{ float:left; display:block; width:938px; height:81px; margin:0px 0px 0px 8px; background-color:#616060; } #menu_footer{ font-size:13px; margin:22px 0px 0px 220px; color:#ffffff; } #footer a{ color:#ffffff; } /*--------------------------------------FIN---footer*--------------------------------------------*/ /*--------------------------------------Début---colonne gauche*--------------------------------------------*/ #image_boite_neuve_fr,#image_boite_neuve_en{ width:301px; height:123px; } #image_boite_neuve_fr {background:transparent url('../../../templates/images/fr/site/boite_neuve.jpg') no-repeat 0px 0px;} #image_boite_neuve_en {background:transparent url('../../../templates/images/en/site/boite_neuve.jpg') no-repeat 0px 0px;} #image_boite_neuve_fr a,#image_boite_neuve_en a{ float:left; width:231px; height:66px; margin:29px 0px 0px 35px; text-decoration:none; } #image_boite_usage_fr,#image_boite_usage_en{ width:301px; height:124px; margin-top:4px; } #image_boite_usage_fr {background:transparent url('../../../templates/images/fr/site/boite_usage.jpg') no-repeat 0px 0px;} #image_boite_usage_en {background:transparent url('../../../templates/images/en/site/boite_usage.jpg') no-repeat 0px 0px;} #image_boite_usage_fr a ,#image_boite_usage_en a{ float:left; width:231px; height:66px; margin:29px 0px 0px 35px; text-decoration:none; } #boite_promotion{ width:293px; margin-top:9px; border:2px solid #5f6975; padding:7px 0px 7px 3px; } #image_promotion_fr,#image_promotion_en{ width:281px; height:34px; margin:5px 0px 0px 4px; } #image_promotion_fr{background:transparent url('../../../templates/images/fr/site/les_promotions_bouton.jpg') no-repeat 0px 0px;} #image_promotion_en{background:transparent url('../../../templates/images/en/site/les_promotions_bouton.jpg') no-repeat 0px 0px;} #image_promotion_fr a,#image_promotion_en a{ float:left; width:281px; height:34px; text-decoration:none; } /*--------------------------------------FIN---colonne gauche*--------------------------------------------*/ /*--------------------------------------DÉBUT---colonne DROITE*--------------------------------------------*/ #image_bienvenue_fr,#image_bienvenue_en, #image_notre_entreprise_fr,#image_notre_entreprise_en, #image_nos_produits_fr,#image_nos_produits_en, #image_nos_promotions_fr,#image_nos_promotions_en, #image_notre_promotions_fr,#image_notre_promotions_en, #image_nous_contactez_fr,#image_nous_contactez_en, #image_nos_publication_fr,#image_nos_publication_en, #image_nos_boites_neuve_fr,#image_nos_boites_neuve_en, #image_nos_boites_usagees_fr,#image_nos_boites_usagees_en, #image_nos_accessoire_fr,#image_nos_accessoire_en, #image_doc_corpo_fr,#image_doc_corpo_en { width:587px; height:54px; } #image_bienvenue_fr{background:transparent url('../../../templates/images/fr/site/bienvenue.jpg') no-repeat 0px 0px;} #image_bienvenue_en{background:transparent url('../../../templates/images/en/site/bienvenue.jpg') no-repeat 0px 0px;} #image_notre_entreprise_fr{background:transparent url('../../../templates/images/fr/site/notre_entreprise.jpg') no-repeat 0px 0px;} #image_notre_entreprise_en{background:transparent url('../../../templates/images/en/site/notre_entreprise.jpg') no-repeat 0px 0px;} #image_nos_produits_fr{background:transparent url('../../../templates/images/fr/site/nos_produits.jpg') no-repeat 0px 0px;} #image_nos_produits_en{background:transparent url('../../../templates/images/en/site/nos_produits.jpg') no-repeat 0px 0px;} #image_nos_promotions_fr{background:transparent url('../../../templates/images/fr/site/nos_promotions.jpg') no-repeat 0px 0px;} #image_nos_promotions_en{background:transparent url('../../../templates/images/en/site/nos_promotions.jpg') no-repeat 0px 0px;} #image_notre_promotions_fr{background:transparent url('../../../templates/images/fr/site/notre_promo.jpg') no-repeat 0px 0px;} #image_notre_promotions_en{background:transparent url('../../../templates/images/en/site/notre_promo.jpg') no-repeat 0px 0px;} #image_nos_publication_fr{background:transparent url('../../../templates/images/fr/site/nos_publications.jpg') no-repeat 0px 0px;} #image_nos_publication_en{background:transparent url('../../../templates/images/en/site/nos_publications.jpg') no-repeat 0px 0px;} #image_nous_contactez_fr{background:transparent url('../../../templates/images/fr/site/contactez_nous.jpg') no-repeat 0px 0px;} #image_nous_contactez_en{background:transparent url('../../../templates/images/en/site/contactez_nous.jpg') no-repeat 0px 0px;} #image_nos_boites_neuve_fr{background:transparent url('../../../templates/images/fr/site/nos_boite_neuve.jpg') no-repeat 0px 0px;} #image_nos_boites_neuve_en{background:transparent url('../../../templates/images/en/site/nos_boite_neuve.jpg') no-repeat 0px 0px;} #image_nos_boites_usagees_fr{background:transparent url('../../../templates/images/fr/site/boite_usagees.jpg') no-repeat 0px 0px;} #image_nos_boites_usagees_en{background:transparent url('../../../templates/images/en/site/boite_usagees.jpg') no-repeat 0px 0px;} #image_nos_accessoire_fr{background:transparent url('../../../templates/images/fr/site/nos_accessoire.jpg') no-repeat 0px 0px;} #image_nos_accessoire_en{background:transparent url('../../../templates/images/en/site/nos_accessoire.jpg') no-repeat 0px 0px;} #image_doc_corpo_fr{background:transparent url('../../../templates/images/fr/site/doc_corpo.jpg') no-repeat 0px 0px;} #image_doc_corpo_en{background:transparent url('../../../templates/images/en/site/doc_corpo.jpg') no-repeat 0px 0px;} #zone_text{ width:587px; text-align:justify; margin-top:10px; } #zone_boite_neuve_selection{ width:260px; float:left; } #resultat{ width:310px; float:left; padding-left:10px; margin-top:10px; border-left:1px solid #3c444f; } #resultat li{padding:5px 0px 5px 10px;} #resultat a {font-weight:bold;color:#3c444f;} .availabilitycode{font-size:10px;font-weight:normal;margin-left:15px;padding-top:0px;} #zone_text p,#zone_boite_neuve_selection p{ margin:15px 0px 15px 0px; } #zone_serie{ width:580px; float:left; margin:30px 0px 30px 0px; } #zone_serie p {padding:5px 0px 5px 0px;} /*---------Boite neuve------------------------------------------------------------------------------------------------------*/ #image_distributeur_fr,#image_distributeur_en{ float:left; width:286px; height:110px; } #image_distributeur_fr a,#image_distributeur_en a{ float:left; width:286px; height:110px; text-decoration:none; } #image_distributeur_fr{background:transparent url('../../../templates/images/fr/site/distributeur.jpg') no-repeat 0px 0px;} #image_distributeur_en{background:transparent url('../../../templates/images/en/site/distributeur.jpg') no-repeat 0px 0px;} #image_spacecap_fr,#image_spacecap_en{ float:left; width:286px; height:110px; margin-left:18px; } #image_spacecap_fr a,#image_spacecap_en a{ float:left; width:286px; height:110px; text-decoration:none; } #image_spacecap_fr{background:transparent url('../../../templates/images/fr/site/spacecap.jpg') no-repeat 0px 0px;} #image_spacecap_en{background:transparent url('../../../templates/images/en/site/spacecap.jpg') no-repeat 0px 0px;} #view_cap{ float:left; width:346px; height:240px; margin:20px 0px 0px 38px; background:transparent url('../../../templates/images/fr/site/frame.jpg') no-repeat 0px 0px; } /*--------------------------------------FIN---colonne DROITE*--------------------------------------------*/ /*--------------------------------------Image de toute les modele neuf*--------------------------------------------*/ #image_nothing_found_fr,#image_nothing_found_en{ width:587px; height:54px; padding-bottom:20px; } #image_nothing_found_fr {background:transparent url('../../../templates/images/fr/site/nothing-found.jpg') no-repeat 0px 0px;} #image_nothing_found_en {background:transparent url('../../../templates/images/en/site/nothing-found.jpg') no-repeat 0px 0px;} /*--------------------------------------Début des produits*--------------------------------------*/ #produit_neuf_image_fr,#produit_neuf_image_en,#produit_usage_image_fr,#produit_usage_image_en, #produit_accessorie_image_fr,#produit_accessorie_image_en,#produit_spacekap_image_fr,#produit_spacekap_image_en{ width:261px; height:168px; } #produit_neuf_image_fr {background:transparent url('../../../templates/images/fr/site/produit_boite_neuve.jpg') no-repeat 0px 0px;} #produit_neuf_image_en {background:transparent url('../../../templates/images/en/site/produit_boite_neuve.jpg') no-repeat 0px 0px;} #produit_usage_image_fr {background:transparent url('../../../templates/images/fr/site/produit_boite_usage.jpg') no-repeat 0px 0px;} #produit_usage_image_en {background:transparent url('../../../templates/images/en/site/produit_boite_usage.jpg') no-repeat 0px 0px;} #produit_accessorie_image_fr {background:transparent url('../../../templates/images/fr/site/produit_accesoire.jpg') no-repeat 0px 0px;} #produit_accessorie_image_en {background:transparent url('../../../templates/images/en/site/produit_accesoire.jpg') no-repeat 0px 0px;} #produit_spacekap_image_fr {background:transparent url('../../../templates/images/fr/site/produit_spacekap.jpg') no-repeat 0px 0px;} #produit_spacekap_image_en {background:transparent url('../../../templates/images/en/site/produit_spacekap.jpg') no-repeat 0px 0px;} #produit_neuf_image_fr a,#produit_neuf_image_en a,#produit_usage_image_fr a,#produit_usage_image_en a, #produit_accessorie_image_fr a,#produit_accessorie_image_en a,#produit_spacekap_image_fr a,#produit_spacekap_image_en a{ float:left; width:261px; height:168px; text-decoration:none; } .border_produit_gauche{width:290px;float:left;margin:15px 35px 20px 4px;} .border_produit_droite{width:290px;float:left;margin:15px 0px 20px 23px;} #boite_ul{ float:left; margin:10px 0px 10px 0px; width:200px; } #boite_ul li {font-weight:bold;margin:10px 0px 10px 0px;} /*--------------------------------------Fin des produits*---------------------------------------*/ /*--------------------------------------Début des boite usagé*---------------------------------------*/ .le_contour{ float:left; margin:20px 0px 10px 0px; width:587px; } .contour_description{ float:left; background-color:#616060; border:1px solid #5f6975; padding-right:10px; width:363px; height:40px; color:#ffffff; font-weight:bold; } .contour_text{ float:left; background-color:#d8d8d8; border:1px solid #5f6975; width:353px; padding:10px; height:70px; } a.no_more{ float:right; font-weight:bold; font-size:14px; } /*contour de image*/ .le_contour_image{ float:right; width:202px; border:1px solid #5f6975; } .sep_boite{ float:left; width:587px; border-top:1px solid #d8d8d8; border-bottom:1px solid #5f6975; height:0px; } .photo_vehicule{ float:left; margin:20px 50px 0px 0px; border:1px solid #5f6975; width:426px; height:278px; } .petite_photo_vehicule{ float:left; margin:20px 0px 0px 0px; border:1px solid #5f6975; width:97px; height:60px; } #boite1{ float:left; width:265px; padding-top:16px; height:120px; } #boite2{ float:left; width:318px; padding-top:16px; height:120px; } #bouton_info_fr,#bouton_info_en,#bouton_info_retour_fr,#bouton_info_retour_en{ float:left; width:190px; height:14px; padding:5px; margin-top:20px; border:1px solid #616060; background-color:#d8d8d8; } #bouton_info_retour_fr{width:178px;margin-left:20px;} #bouton_info_retour_en{width:150px;margin-left:20px;} #bouton_info_en{width:170px;} #bouton_info_fr a,#bouton_info_retour_fr a,#bouton_info_en a,#bouton_info_retour_en a{ text-decoration:none; width:190px; height:18px; } #bouton_info_retour_fr a{width:185px;} #bouton_info_retour_en a{width:173px;} /*--------------------------------------Fin des boite usagé**---------------------------------------*/ .hide{visibility:hidden;} div.long_desc{ text-indent:-8000px; position:absolute; z-index:1; text-transform:uppercase; } /*Copyright*/ #copyright{ font-size:10px; font-family:Tahoma,Arial, Helvetica, sans-serif; color: #ffffff; padding:8px 0px 8px 0px; } /************************************************** STYLE GÉNÉRAL POUR LA DISPOSITION DU CONTENUE **************************************************/ #left_column{ float:left; display: block; width:307px; margin: 0px 0px 0px 8px; margin-top:8px; } #right_column { float: left; display: block; width: 604px; text-align:justify; background-color:#f2f2f2; padding:6px 0px 0px 25px; margin-top:8px; } /*fin du Ul pour le plan du site*/ .f12{font-size:12px;} .f14{font-size:14px;} .fr {float: right;} .fl {float: left;} .clear {clear: both;} .block {display: block;} .dnone {display: none;} .case_upper{text-transform:uppercase;} .crouge{color:red;} a {color:#2a363a;font-weight:bold;} /* Alignement horizontal */ .center {text-align: center;} .justify {text-align: justify;} .left {text-align: left;} .right {text-align: right;} .bold {font-weight: bold;} .sep_gris_site{background-color:#666666;width:100%;line-height:2px;float:left;} .the_margin_p{margin:10px 0px 10px 0px;} #div_main_content:after, #div_page_content:after {content:".";display:block;height:0;clear:both;visibility:hidden;} pre.__trace {text-align: left; display: block; background-color: #FFFFCC; border: 1px solid #CC0033; padding: 10px;} pre.__trace:before{content:"::TRACE::"; font-weight:bold; color:#CC0033; display: block; border-bottom: 1px solid #CC0033; padding: 5px;} h1{color:#600101;font-weight:bold;font-size:14px;} h2{font-weight:bold;font-size:20px;} table{ font-family: Tahoma,Arial,Helvetica, sans-serif; font-size:11px; width:100%; } .div.error{color:red;padding-top:10px;} .newsticker { list-style-type: none; background: #ffffff; } /*********************************************************** fin Syle pour la page de configuration **********************************************************/