/* Google Fonts */ @import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|Pinyon+Script); /* Reset -------------------------------------------------------------- */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { border: 0; font-family: inherit; font-size: 100%; font-style: inherit; font-weight: inherit; margin: 0; outline: 0; padding: 0; vertical-align: baseline; } :focus { outline: 0; } body { background: #222; line-height: 1; } ol, ul { list-style: none; } img { border:none; } a img { border: 0; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } ::-moz-selection { background: #0099FF; color:#FFFFFF; text-shadow: #333333; } ::selection { background:#0099FF; color: #FFFFFF; text-shadow: #333333; } /*********************************** BODY ******************************/ body { min-width: 960px; height: 100%; background: #88817C url(img/bg-body.png) repeat 0 -8px; } body, input, textarea { color: #404940; font: 13px/17px "Helvetica Neue", Arial, Helvetica, sans-serif; } /*********************************** MENU BARRE ******************************/ #page { position: relative; height: auto; overflow: hidden;} #sidebar { position: relative; float: left; width:100%; height:80px; position: fixed; left: 0; top: 0; font-size: 11px; line-height: 13px; color: #E5E2DF; z-index: 1000; } #sidebar #ocultar, #sidebar #mostrar { position: absolute; } #sidebar #ocultar { top:5px; right:5px; display: block; width:9px; height:8px; background: url(img/mes-negatiu2.png) center no-repeat #000000; text-indent: -9999px; opacity: .6; padding:10px; } #sidebar #mostrar { background: #222 url(img/mes-negatiu.png) no-repeat bottom; display: block; width: 10px; height:80px; padding: 16px; right: 0; top: 0; text-indent: -9999px; } #sidebar #ocultar:hover { opacity: 1; } #sidebar #mostrar:hover { background-color:#0082C0; } #sidebar #bloc_logo {position: relative; float: left; clear:left; left:10px; top:5px; } #sidebar #bloc_links {float: left; width:700px; height:20px; margin-top:40px; margin-left:40px;} #sidebar .Fright {float: right;} #sidebar #admin_div a{position: absolute; right:38px; top:5px; height:28px; width:28px; background-image:url(../images/admin.png); background-position:center; background-repeat:no-repeat; background-color:rgba(00,00,00,0.7) } #sidebar #admin_div a:hover{position: absolute; right:38px; top:5px; height:28px; width:28px; background-image:url(../images/admin.png); background-position:center; background-repeat:no-repeat; background-color: #CC0000 } #sidebar #face_div a{position: absolute; right:70px; top:5px; height:28px; width:28px; background-image:url(../images/face.png); background-position:center; background-repeat:no-repeat; background-color:rgba(00,00,00,0.7) } #sidebar #face_div a:hover{position: absolute; right:70px; top:5px; height:28px; width:28px; background-image:url(../images/face.png); background-position:center; background-repeat:no-repeat; background-color:#385597 } /*********************************** flashnews ******************************/ #flashnews{ padding: 0 10px; } #sidebar #flashnews{ position: absolute; width:100%; height:30px; background:url(../images/bg.png) repeat; line-height:30px; left:0px; top:81px;} /*********************************** PAGE INDEX ******************************/ #bloc_accueil {position: relative; width:750px; top:115px; left:215px; bottom:0px; z-index:900; background:url(../images/bg.png) repeat; padding:10px; } #bloc_accueil h1{ font-family:'Open Sans Condensed', Arial, Helvetica, sans-serif; font-size:35px; color: #FFFFFF; margin:15px 10px; text-transform:uppercase;} #bloc_accueil h2{ font-family:'Open Sans Condensed','Pinyon Script',"Helvetica Neue", Arial, Helvetica, sans-serif; font-size:20px; color: #FFFFFF; padding:5px 15px; } #bloc_accueil #ocultar-accueil{ background: url(img/x9neg.gif) no-repeat center; display: block; height: 9px; opacity: 1; padding: 10px; position: absolute; right: 10px; text-indent: -9999px; top:10px; width: 9px; z-index: 100; } #bloc_accueil #ocultar-accueil:hover, #mostrar-accueil:hover { background-color:#0082C0; } #mostrar-accueil { background: #FFFFFF url(img/agrandir.png) no-repeat center; width:29px; height: 29px; position: fixed; right:0px; top: 137px; text-indent:-9999px; z-index: 1000; } #bloc_galerie {position: relative; width:800px; height:450px; top:115px; left:230px; bottom:0px; z-index:900; background:url(../images/bg.png) repeat; padding:10px; } .div_navig{ right:30px; top:10px; height:20px; width:auto; position: absolute; margin:5px 15px; } .div_navig_cat{ top:10px; right:30px; height:20px; width:auto; position: absolute; margin:5px 15px; } /*********************************** CONTENUE ******************************/ #bloc_dynamiques { margin:0 auto; width:750px; min-height:400px; color: #333333; overflow:auto; } #news{ position: relative; margin:5px 0; width:750px; height: 400px;overflow:auto; color:#FFFFFF; border-bottom:1px solid #ccc; } #news .news_img{ position: relative; float:left; margin-right:5px; width:300px; } #news p{ position: relative; float:left; width:420px; } #news .btn_plus{ position: relative; float:right; bottom:0px; width:100px; text-align:center; color:#222; height:25px; line-height:25px; background:#fff; } #news h1{ font-family:'Open Sans Condensed','Pinyon Script',"Helvetica Neue", Arial, Helvetica, sans-serif; font-size:20px; color: #0066ff; padding:5px;} #bloc_texte{ position: relative; margin:5px ; width:750px; height: auto; color: #333333; color:#FFFFFF; } #bloc_texte ul { margin:5px 40px; float: left; list-style:circle } #bloc_texte_presentation{ float:left; margin:5px 0 0 5px; width:790px; height:auto; color: #333333; background-color: rgba(00, 00, 00, 0.8); color:#FFFFFF; } #browse_holder{ float:right; clear:right; height:auto; width:46px; margin:2px 50px 0px 0px;} #content a { color: #5DC43D; } #content a:hover, #footer a:hover { color: #FFFFFF; text-decoration: none; } #bloc_accueil photo { float:left; width:220px; height:200px; overflow:hidden; } #bloc_accueil a span { float:left; width:220px; height:200px; overflow:hidden; } #bloc_accueil a:hover span { float:left; width:220px; height:200px; overflow:hidden; background:url(../images/fluxrss.png) center no-repeat; background-color:rgba(00,00,00,0.5); } /*----- DETAILS produits ----- */ #bloc_details_produits{ position:relative; float:left; min-height:30px; width:100%; padding:5px; } #bloc_details_prix{ position:relative; float:left; font-size:14px; font-weight:bold; color:#FF0000; padding:5px; } /*----- DETAILS NEWS ----- */ #bloc_details_news{ position:absolute; bottom:0; min-height:30px; width:290px; padding:5px; } .bloc_global_nbiplus{ float:left; height:auto;width:635px; margin:5px; } .div_nbiplus_printpdf{ float:left; height:auto; width:260px; margin:5px; } #bloc_details_news_icones{ height:auto; width:auto; margin-right:5px; } .bloc_details_news_posRight{ float: right;} .btn_print{ position:absolute; right:0; top:0; margin:10px;} .bloc_url{ background:url(../images/url.png) left no-repeat; padding-left:34px; float: left; width:260px; } .bloc_url a{ color: #FFFFFF; text-decoration:none; line-height:30px; } .bloc_pdf{ background: url(../images/pdf.png) left no-repeat; padding:0px 34px; float: right; margin-left:20px; color:#FFFFFF } /************************************MENU*********************************************/ #menu{ position: absolute; float: left; width:200px; height:250px; top:113px; font-family:'Open Sans Condensed' ,"Helvetica Neue", Arial, Helvetica, sans-serif; font-size:25px; color: #C6BD9C; font-weight:lighter; text-transform: uppercase; } #menu li{ list-style:none; display: block;} #menu #separation{ background: none;} #menu li a{float: left; width:200px; height:30px; color: #FFFFFF; display: block; text-decoration:none; text-align:right; line-height:30px; padding:5px; background:url(../images/bg_1.png) repeat; margin:2px 0 } #menu li a:hover, #menu li a.active {float: left;width:200px; height:30px; color: #FFFFFF; display: block; text-decoration: none; text-align:right; line-height:30px; background:url(../images/bg.png) repeat;} /*********************************** PIED DE PAGE ******************************/ #footer { float: left; width:100%; height:25px; position: fixed; left:0px; bottom: 0px;background:url(../images/bg.png) repeat; color: #ddd; z-index: 9000; font-size: 10px; font-family:Verdana, Arial, Helvetica, sans-serif; border-top:solid 1px #000000;} #footer a{ color:#FFFFFF; text-decoration: none;} #footer a:hover { color: #0099FF; } #footer p { margin-bottom: 1.2em; } #footer h1{ font-family:'Open Sans Condensed','Pinyon Script',"Helvetica Neue", Arial, Helvetica, sans-serif; font-size:20px; color: #5DC43D; } #pied_page{ float:left; width:100%; height:107px; background:url(../images/bg_footer.jpg) right bottom no-repeat;} #bloc_logofooter { float:left; width:auto; height:auto; padding-left:5px; margin:10px 60px 5px 5px;} #bloc_coord { float:left; width:auto; height:auto; padding-left:5px;} .class_footer{ margin:23px 30px;} .class_footer2{ margin:20px 5px;} #bloc_liens{ position: fixed; left:10px; bottom:5px; width:auto; height:auto; } #bloc_copy { position: fixed; right:10px; bottom:5px; width:auto; height:auto; } #bloc_admin { position: fixed; right:10px; bottom:25px; width:auto; height:auto; } #bloc_facebook { position: fixed; right:130px; bottom:25px; width:auto; height:auto; } #bloc_faceiframe { position: fixed; left:5px; bottom:0px; width:auto; height:auto; } #bloc_versus { position: fixed; right:5px; bottom:5px; width:auto; height:auto; } /*--------------------------------------- PAGE CHANTIER ---------------------------------------*/ /*------------------------------ FORMULAIRE ------------------------------------*/ #bloc_contact {position: relative; top:115px; left:215px; width:720px; height:100%; color: #ddd; z-index:900; background-color:rgba(00,00,00,0.8); overflow:auto; z-index:3000 } #bloc_contact h1{position: relative; font-family:'Open Sans Condensed', "Helvetica Neue", Arial, Helvetica, sans-serif; font-size:35px; color: #FFFFFF; padding:15px 10px; text-transform:uppercase; } #bloc_contact h2{ font-family:'Open Sans Condensed','Pinyon Script',"Helvetica Neue", Arial, Helvetica, sans-serif; font-size:18px; color: #FFFFFF; padding:5px; bloc_contact-color:#000000; } #bloc_contact #ocultar-contact{ background: #000000 url(img/x9neg.gif) no-repeat center; display: block; height: 9px; opacity: 1; padding: 10px; position: absolute; right:5px; text-indent: -9999px; top:5px; width:9px; z-index: 100; } #bloc_contact #ocultar-contact:hover, #mostrar-contact:hover { background-color: #0099CC; } #mostrar-contact { background: #FFFFFF url(img/agrandir.png) no-repeat center; width:29px; height: 29px; position: fixed; right:0px; top: 175px; text-indent:-9999px; z-index: 1000; } #coordonne { position: relative; width:700px; height:auto;padding:5px; border-bottom:1px dotted #CCCCCC;} #form_contact { position: relative; width:700px;height:auto; padding-left:10px; } #formulaire {float:left; width:330px;height:auto;padding:5px; } #formulaire2{float:left; width:330px;height:auto;padding:5px; } #contactform ol { float:left; margin:0; padding:0; list-style:none;} #contactform #bloc_textearea { float:left; margin:0; padding:0; list-style:none;} #contactform li {margin:0; padding:0; background:none; border:none; display:block; clear:both; width:350px; border:1 px solid #FFFFFF} #contactform li.buttons { margin:5px 0 5px 0;} #contactform label {margin:0; width:150px; display:block; padding:5px 0; color: #FFFFFF; float:left; font-size:12px;} #contactform label2 {margin:0; width:100px; display:block; padding:5px 0; color: #FFFFFF; text-transform:capitalize; float:left; font-size:12px;} #contactform label span { color: #FF0000;} #contactform input.text { width:160px; border:none; margin:2px 0; padding:5px 2px; height:16px; background-color: rgba(00, 00, 00, 0.4); border:solid 1px #CCCCCC; float:left; color: #FFFFFF;} #contactform textarea { float:left; clear:right; width:310px; height:215px; margin:2px 0; padding:2px; float:left; color: #FFFFFF; border:none;background-color: rgba(00, 00, 00, 0.4); border:solid 1px #CCCCCC; overflow:hidden; } #contactform select { float:left; clear:right; width:165px; height:25px; margin:2px 0; padding:2px; float:left; color: #FFFFFF; border:none;background-color: rgba(00, 00, 00, 0.4); border:solid 1px #CCCCCC; overflow:hidden; } #contactform .buttons{ width:146px; height:29px; float:left; background: url(../images/submit.png) center no-repeat; border:none; margin-right:5px;} #contactform .reset{width:146px; height:29px; float:left; background: url(../images/annuler.png) center no-repeat; border:none;} /*---------erreur------*/ #error{ float:left; height:28px; width:620px; color: #990000; visibility:hidden; text-align:center; line-height:28px; background:url(../images/alert.png) left no-repeat; font-family: Verdana, Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold;} /*---- Estilos generales----------------------------------------------- */ p { margin-bottom: 15px; } strong { font-weight: bold; } cite, em, i { font-style: italic; } .peq { font-size: 11px; line-height: 13px; } /* Links */ a { color: #FFFFFF; text-decoration: none; } a:focus, a:active, a:hover { color:#5DC43D; } /* Imagenes */ img.alignright { float: right; margin: 5px 0 12px 12px; } img.alignleft { float: left; margin: 5px 12px 12px 0; } img.aligncenter { display: block; margin: 0 auto 20px; } img.alignnone { display: block; margin: 0 0 20px; } .entry { height: auto; font-size: 13px; text-align:justify; line-height:20px; color:#FFFFFF; padding-bottom:150px} .entry ul, .entry ol { margin: 40px; } .proveedores .entry ul { margin: 20px 40px 40px 50px; float: left; font-size: 14px; } .entry li { margin-bottom: 5px; } .entry img, .entry object, .entry embed { max-width: 500px; } /* CONDIUTION GENERAL */ #lean_overlay { position: fixed; z-index:100; top: 0; left: 0; height:100%; width:100%; background: #000; display: none; } #avislegal { position: relative; width: 700px; padding: 30px; display:none; background-color: #fff; -webkit-box-shadow: 0 0 5px #222; -moz-box-shadow: 0 0 5px #222; box-shadow: 0 0 5px #222; font-size: 11px; line-height: 13px; color: #666; } #avislegal h3 { font-size: 20px; font-weight: bold; line-height: 22px; margin: 0 0 10px; } #avislegal h4 { font-size: 11px; font-weight: normal; line-height: 13px; margin: 15px 0 5px; text-transform: uppercase; } #avislegal p { margin-bottom: 10px; } #avislegal a { color: #777; } #avislegal #avislegal_cerrar { position: absolute; top: 6px; right: 6px; width: 9px; height: 9px; padding: 10px; background: #3A342E url(img/x9neg.gif) no-repeat center; text-indent: -9999px; } #avislegal #avislegal_cerrar:hover { background-color: #C6BD9C; } /*-------------------SIEGE SOCIAL-------------------*/ #siegesocial { position: relative; width: 700px; padding: 30px; display:none; background-color: #fff; -webkit-box-shadow: 0 0 5px #222; -moz-box-shadow: 0 0 5px #222; box-shadow: 0 0 5px #222; font-size: 11px; line-height: 13px; color: #666; } #siegesocial h3 { font-size: 20px; font-weight: bold; line-height: 22px; margin: 0 0 10px; } #siegesocial h4 { font-size: 11px; font-weight: normal; line-height: 13px; margin: 15px 0 5px; text-transform: uppercase; } #siegesocial p { margin-bottom: 10px; } #siegesocial a { color: #777; } #siegesocial #siegesocial_cerrar { position: absolute; top: 6px; right: 6px; width: 9px; height: 9px; padding: 10px; background: #3A342E url(img/x9neg.gif) no-repeat center; text-indent: -9999px; } #siegesocial #siegesocial_cerrar:hover { background-color: #C6BD9C; } /* SLIDER */ #supersized-loader { position:absolute; top:50%; left:50%; z-index:0; width:60px; height:60px; margin:-30px 0 0 -30px; text-indent:-999em; background:url(img/loader.gif) no-repeat center center;} #supersized { display:block; position:fixed; left:0; top:0; overflow:hidden; z-index:-999; height:100%; width:100%; margin: 0; } #supersized img { width:auto; height:auto; position:relative; display:none; outline:none; border:none; } #supersized.speed img { -ms-interpolation-mode:nearest-neighbor; image-rendering: -moz-crisp-edges; } #supersized.quality img { -ms-interpolation-mode:bicubic; image-rendering: optimizeQuality; } #supersized li { display:block; list-style:none; z-index:-30; position:fixed; overflow:hidden; top:0; left:0; width:100%; height:100%; } #supersized a { width:100%; height:100%; display:block; } #supersized li.prevslide { z-index:-20; } #supersized li.activeslide { z-index:-10; } #supersized li.image-loading { background: url(img/loader.gif) no-repeat center center; width:100%; height:100%; } #supersized li.image-loading img{ visibility:hidden; } #supersized li.prevslide img, #supersized li.activeslide img{ display:inline; } #supersized li.prevslide img, #supersized li.activeslide img{ display:inline; } /* NAVIGATION */ .arrow-nav a { display: block; width: 40px; height: 80px; float: left; margin-left: 1px; background-color: rgba(00, 00, 00, 0.6); background-repeat: no-repeat; background-position: center; opacity: 1 !important; } .arrow-nav #prevslide { background-image: url(img/arrow-prev.png); position: fixed; left:5px; top:50%;} .arrow-nav #nextslide { background-image: url(img/arrow-next.png); position: fixed; right:5px; top:50%; } #nextslide:hover{ cursor: crosshair; background-color: rgba(256, 256, 256, 0.6); background-image: url(img/arrow-next2.png); } #prevslide:hover{ cursor: crosshair; background-color: rgba(256, 256, 256, 0.6); background-image: url(img/arrow-prev2.png); } /* FORMULAIRE */ /* Colorbox */ #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;} #cboxOverlay{position:fixed; width:100%; height:100%;} #cboxMiddleLeft, #cboxBottomLeft{clear:left;} #cboxContent{position:relative; overflow:hidden;} #cboxLoadedContent{overflow:auto;} #cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;} #cboxTitle{margin:0;} #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} #cboxOverlay { background: #454545 url(img/bg-body.png) 0 0 repeat; } #cboxContent { background: none; padding: 10px 45px; } #cboxLoadedContent { margin-bottom: 28px; background-color: #111; -moz-box-shadow: 0 0 6px #333; -webkit-box-shadow: 0 0 6px #333; box-shadow: 0 0 6px #333; } #cboxTitle, #cboxCurrent, #cboxSlideshow { color: #eee; bottom:14px; } #cboxTitle { position: absolute; right: 55px; text-align: right; width: 300px; } #cboxCurrent { position: absolute; left: 55px; } #cboxSlideshow { position: absolute; left: 65px; text-transform: uppercase;} #cboxPrevious, #cboxNext { bottom: 45px; width: 70px; height: 70px; position: absolute; text-indent: -9999px; } #cboxPrevious { right: 123px; background: #111 url(img/arrow-prev.png) no-repeat center; } #cboxNext { right: 52px; background: #111 url(img/arrow-next.png) no-repeat center; } #cboxPrevious:hover, #cboxNext:hover, #cboxClose:hover { opacity: 1; background-color: #E2C04A; } #cboxLoadingOverlay { background: #333; } #cboxLoadingGraphic { } #cboxClose { background: #fff url(img/x11pos.gif) no-repeat center; height: 11px; padding: 12px; position: absolute; right: 45px; text-indent: -9999px; top: 10px; width: 11px; } #cboxClose:hover { background-color: #E2C04A; } /* Media queries ----------------------------------------------- */ @media only screen and (max-device-width: 480px) { body { min-width: 100% !important; } ul#supersized, .arrow-nav, #sidebar #ocultar, #panel_coleccion, .lines { display: none !important; } .nav .sub-menu { display: block; margin: 6px 0 10px 30px; font-size: 15px; line-height: 20px; } #sidebar { width: auto !important; position: relative; float: none; padding: 20px; } #footer { background: none; padding: 0; position: static; width: 100%; color: inherit; font-size: inherit; line-height: inherit; } #content { padding: 20px; position: relative; width: auto; } #content h1 { font-size: 35px; line-height: 38px; font-weight: bold; margin: 40px 0 15px; padding: 0 0 5px; } #map_canvas { width: 100%; height: 200px; } } @media only screen and (max-height: 550px) { #sidebar footer { display: none; } } @media only screen and (max-width: 750px) { #menu { width:500px; } #footer { display: none; } } @media only screen and (max-device-width:1024px) { } /************************************* PAGINATION------------------------*/ .pagination { font-family: Verdana, Arial, Helvetica, sans-serif; font-size:0.9em; margin:10px; padding:10px; } .pagination .courante { background: #33CC00 none repeat scroll 0 0; border:1px solid #FFFFFF; color: #000000; margin-left:5px; padding:4px 8px; text-decoration:none; } .pagination .desactive { color:#918A7B; margin-left:5px; padding:3px 7px; text-decoration:none; border:1px solid #000000; background-color:#DBDBDB none repeat scroll 0 0; visibility:hidden; } .pagination a { background: #000000 none repeat scroll 0 0; background-image:url('background.png'); background-repeat:repeat-x; border:1px solid #999999; color:black; margin-left:5px; padding:3px 7px; text-decoration:none; } .pagination a:hover { background: #000000 none repeat scroll 0 0; border:1px solid #33CC00; color: #FFFF00; } #format { width:100px; height:24px; margin:10px; } .bold { float:left; width:26px; height: 24px; margin-right:3px; } .italique { float:left; width:26px; height: 24px; margin-right:3px; } .souligner { float:left; width:26px; height: 24px; } /*-------------------------------------*/ .boxgrid{ text-align: center; width:240px; height:200px; margin:2px; background: #FFFFFF; overflow:hidden; position:relative; float:left; line-height:20px;} .boxgrid img{ border: 0; height: 200px;} .boxgrid p{text-align: left; padding:10px; color: #CCCCCC; font-weight:bold; font:11px Verdana, Arial, Helvetica, sans-serif; text-transform:capitalize } .boxgrid a div{position: relative; margin:0 auto; color: #000000; text-decoration:none; background-color:#00CCFF; padding:3px 5px; margin-bottom:1px; } .boxgrid a:hover div{ color: #00CCFF; text-decoration:none; background-color: #FFFFFF;} .boxcaption { float: left; top: 200px; position: absolute; background: #000; height: 200px; width: 100%; opacity: .8; overflow: auto; /* For IE 5-7 */ filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80); /* For IE 8 */ -MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; } .captionfull .boxcaption {top: 200; left: 0; } .caption .boxcaption { top: 220;left: 0;} #inscription{ margin-left: 0; float: left; } span.inscription{ float: left; font-size: 9px; line-height: 12px !important; margin-bottom: 5px; margin-top: 6px; width: 285px !important; }