/* ---------------------------------------------------------------------------- * Filename: style.css * Description: Default theme * Version: 1.0 (2010-10-14) ------------------------------------------------------------------------- */ /* ---------------------------------------------------------------------------- 1. Layouts ----------------------------------------------------------------------------- */ /* home (B1) ----------------------------------------------------------------------------- */ .home { background: #ffffff url(../images/layout/bg-fix2.png) no-repeat center top ;} .home #bg1 { background: url(../images/layout/bg-x.png) repeat-x left top ; } .home #bg2 { background: transparent /* url(../images/layout/bg2.jpg) no-repeat center top */; } .home #bg3 { background: transparent /* url(../images/layout/bg3.jpg) no-repeat center bottom */; } .home #wrap-container { margin-top: 0px; background: url(../images/layout/bg-fix.png) no-repeat center top; } .home #container { width: 996px; background: #FFFFFF /* url(../images/layout/container-bg.jpg) repeat-y left top */; } .home #header { width: 996px; height: 438px; } .home #content { width: 996px; background: transparent /* url(../images/layout/content-bg.jpg) no-repeat center top */; } .home #sidebar { width: 247px; background: url(../images/layout/bg-sidebar.jpg) repeat-y left top ; margin:21px 0 10px 0; font-size:11px;} .home #sidebar-inner { } .home #main { width: 749px; background: #FFFFFF /* url(../images/layout/main-bg.jpg) no-repeat left top */; } .home #main-inner { padding:11px 0 0 15px;} .home #wrap-footer { margin-bottom: 0px; padding-bottom: 0px; background: url(../images/layout/bg-x-footer.jpg) repeat-x left top; } .home #footer { width: 996px; background:url(../images/layout/bg-fix-footer.png) no-repeat center top; font-size:11px;} .home #footer-inner { padding:10px 0 8px 0;} a:link, a:visited { color: #eb0008; } a:hover, a:active { color: #000000; } /* ---------------------------------------------------------------------------- 2. Header elements ----------------------------------------------------------------------------- */ /* ---------------------------------------------------------------------------- 3. Content elements ----------------------------------------------------------------------------- */ #main h1 { margin: 0 0 16px 0; } #info { width:246px; float:left; background:url(../images/layout/bg-coordonnees.jpg) no-repeat left top; } #info-inner { padding:34px 15px 0 0;} .info-title {clear:both; background:#ffb300; font-size:14px; font-weight:bold; color:#ffffff; padding:0 0 0 9px;} .info-address { line-height:16px; padding-top:11px;} .info-mail {clear:both; background:url(../images/layout/mail-icon.jpg) no-repeat left 7px; padding-left:19px; font-weight:bold; margin-top:4px;} .paragraph-box {clear:both; border:1px solid #c0c0c0; padding:1px; background:#ffffff; margin: 0 0 15px 0;} .paragraph-inner {clear:both; background:url(../images/layout/bg-paragraph.jpg) repeat-x left bottom;} .paragraph-holder {clear:both; padding:10px 13px 9px 14px; float:left; width:703px;} .paragraph-image-right {float:right; width:504px;} .paragraph-image-left {float:left; width:504px;} .text-holder {float:left; width:504px;} .slideshow-holder {float:right; width:186px; } .slideshow-holder-left {float:left; width:215px; } a:link.btn-devis, a:visited.btn-devis { float:left; background:url(../images/layout/btn-devis.jpg) no-repeat right top; padding:9px 54px 11px 0; color:#ffffff;} a:hover.btn-devis, a:active.btn-devis { color:#ffffff; text-decoration:none; } a:link.btn-devis span, a:visited.btn-devis span {background:url(../images/layout/bg-btn.jpg) repeat-x left top; float:left; padding:3px 0 2px 16px; font-weight:bold; } a:hover.btn-devis span, a:active.btn-devis span {background:url(../images/layout/bg-btn-over.jpg) repeat-x left top; float:left; padding:3px 0 2px 16px; font-weight:bold; } /* --- Padding, margin, height, line-height --- */ .h2 {height:2px;} .h3 {height:3px;} .h5 {height:5px;} .h6 {height:6px;} .h8 {height:8px;} .h10 {height:10px;} .h15 {height:15px;} .h17 {height:17px;} .h23 {height:23px;} .ml7 {margin-left:7px;} .ml32 {margin-left:32px;} .mt-1 {margin-top:-1px;} .mt-2 {margin-top:-2px;} .pt10 {padding-top:10px;} .pt12 {padding-top:12px;} .pr10 {padding-right:10px;} .pl30 {padding-left:30px;} .pl50 {padding-left:50px;} /* ---------------------------------------------------------------------------- 4. Footer elements ----------------------------------------------------------------------------- */ #footer .box1 { float: left; text-align: left; padding-top:3px;} #footer .box2 { float: right; text-align: right; } #copyright { float:left; margin-top:-2px; padding-left:60px; } #copyright .site-name { font-weight: bold; } #made-by { float:left;} #made-by-logo { display: inline-block; } #made-by a:link, #made-by a:visited { } #made-by a:hover, #made-by a:active { } #legal { } #legal a:link, #legal a:visited { } #legal a:hover, #legal a:active { } .menu { float:right; padding-top:1px; margin-right:-1px;} .menu li { float: left; } .menu li span { padding: 0 6px; } .menu li a:link, .menu li a:visited { color:#555555; text-decoration:none;} .menu li a:hover, .menu li a:active, .menu li.active a { color:#eb0008; text-decoration:none;} /* ---------------------------------------------------------------------------- 5. Generic elements ----------------------------------------------------------------------------- */ span#main-left {float:left; width:734px;} .plan-buttons {float:left; } #plan_image {border:1px solid #B7B7B7; padding:1px; float:left; } #plan_image2 {border:1px solid #B7B7B7; padding:1px; float:left; } /* Breadcrumbs ----------------------------------------------------------------------------- */ .breadcrumbs { background: #DDDDDD; padding: 10px; margin: 0 0 10px 0; font-weight: bold; } /* Lists ----------------------------------------------------------------------------- */ .list { float: left; width:734px; } .list li { padding: 3px 0 3px 15px; background: url(../images/bullets/bullet.jpg) no-repeat 0px 11px; border-bottom:1px solid #eaeaea;} .list li:hover { background: url(../images/bullets/bullet1.gif) no-repeat 3px 9px; border-bottom:1px solid #FFB300;} .list2 { float: left; } .list2 li { padding: 0 0 0 14px; background: url(../images/bullets/bullet.jpg) no-repeat 0px 7px; text-align:justify;} .list3 { float: left; } .list3 li { padding: 0 0 0 10px; background: url(../images/bullets/bullet.jpg) no-repeat 0px 5px; display:inline; text-align:justify} /* Loaders ----------------------------------------------------------------------------- */ .loading-full { cursor: wait; background: #FFFFFF url(../images/loading.gif) no-repeat center center; } .loading-elem { cursor: wait; background: #FFFFFF url(../images/loading.gif) no-repeat center center; } /* Paginations ----------------------------------------------------------------------------- */ .pagination { clear: both; float: left; display: table; width: 100%; font-size: 11px; line-height: 17px; text-align: center; } .pagination a:link, .pagination a:visited, .pagination span { display: inline-block; overflow: hidden; margin: 0 5px 0 0; padding: 1px 7px; border-width: 1px; border-style: solid; text-decoration: none; background: #EAEAEA; color: #000000; border-color: #bcbcbc;} .pagination a:hover { background: #FFB300; color: #ffffff; border-color: #bcbcbc; font-weight:bold;} .pagination .active { background: #F03F1C; color: #ffffff; border-color: #888888; font-weight:bold;} .pagination .disabled { background: #EAEAEA; color: #999999; border-color: #BEBEBE; } /* Separators ----------------------------------------------------------------------------- */ .s1 { height: 1px; margin: 9px 0; background: #d6d6d6; } /* Thumbnails ----------------------------------------------------------------------------- */ .thumb { display: inline-block; border: 1px solid #ababab; background: #ffffff; padding:1px;} a.thumb:hover { border: 1px solid #000000; } /* Typography ----------------------------------------------------------------------------- */ .highlight { color: #CC0000; } .star { font: normal 11px Verdana, Arial, Helvetica, sans-serif; } /* ---------------------------------------------------------------------------- 6. Modules ----------------------------------------------------------------------------- */ #panes{ width: 734px; height: 390px; position: relative;} #panes div{ display: none; position: absolute; top: 0px; left: 0px; font-size: 13px; color: #444; width: 734px;} /* --- Tabs --- */ /* root element for tabs */ ul.tabs{ list-style:none; margin:0 !important; padding:0; height:30px;} /* single tab */ ul.tabs li{ float:left; text-indent:0; padding:0; margin:0 !important; list-style-image:none !important;} /* link inside the tab. uses a background image */ ul.tabs a{ display:block; line-height:28px; width: 254px; text-align:center; text-decoration:none; color:#ffffff; position:relative; top:0px; font-weight: bold; background-color: #FFB300; border: 1px solid #D6D6D6; height:28px;} ul.tabs a:active{ outline:none;} /* when mouse enters the tab move the background image */ ul.tabs a:hover{ font-weight: bold; background:#F03F1C; text-decoration:none; color:#ffffff;} /* active tab uses a class name "current". it's highlight is also done by moving the background image. */ ul.tabs a.current, ul.tabs a.current:hover, ul.tabs li.current a{ cursor:default !important; font-weight: bold; background:#F03F1C; border: 1px solid #D6D6D6; } /* Different widths for tabs: use a class name: w1, w2, w3 or w2 */ /* width 1 */ ul.tabs a.s{ background-position: -553px 0; width:81px; } ul.tabs a.s:hover{ background-position: -553px -31px; } ul.tabs a.s.current{ background-position: -553px -62px; } /* width 2 */ ul.tabs a.l{ background-position: -248px -0px; width:174px; } ul.tabs a.l:hover{ background-position: -248px -31px; } ul.tabs a.l.current{ background-position: -248px -62px; } /* width 3 */ ul.tabs a.xl{ background-position: 0 -0px; width:248px; } ul.tabs a.xl:hover{ background-position: 0 -31px; } ul.tabs a.xl.current{ background-position: 0 -62px; } /* initially all panes are hidden */ div.panes div.pane{ display:none;} /* ---------------------------------------------------------------------------- Product Filters ----------------------------------------------------------------------------- */ .product-filters { clear:both;} .product-filters .button-recherche { float: left; border:none; background:#F03F1C; font-weight:bold; color:#ffffff; padding:3px 9px 4px 9px; font-size:11px; margin-left:10px; display:inline-block; cursor:pointer; width:95px; height:23px;} .product-filters .button-recherche-over { float: left; border:none; background:#FFB300; font-weight:bold; color:#ffffff; padding:3px 9px 4px 9px; font-size:11px; margin-left:10px; display:inline-block; cursor:pointer; width:95px; height:23px;} /*addons-style_css*/ /* ---------------------------------------------------------------------------- Modules > Content management ----------------------------------------------------------------------------- */ .content-management { } .content-management .paragraph { } .content-management .paragraph-title { margin: 0 0 7px 0; padding: 5px 10px; font-weight: bold; background: #222222; color: #FFFFFF; } .content-management .paragraph-text { } .content-management .paragraph-images { } .paragraph.images .paragraph-images { } .paragraph.images-left .paragraph-images { float: left; margin: 0 10px 0 0; } .paragraph.images-right .paragraph-images { float: right; margin: 0 0 0 10px; } .paragraph.images-left .thumb {float:left;} .paragraph.images-right .thumb {float:right;} .paragraph.images-right {padding-bottom:20px;} /* ---------------------------------------------------------------------------- Modules > MDM ----------------------------------------------------------------------------- */ #news { width:246px; float:left; background:url(../images/layout/bg-actualites.jpg) no-repeat left top;} #news-inner { padding: 34px 15px 35px 0; } #news .news-title { font-weight: bold; margin-top:-6px;} #news .news-photo { float: left; margin: 6px 14px 0 0; border: 1px solid #b7b7b7; } #news .news-text { text-align: justify; line-height:16px; margin-top:-2px;} #news .news-btn { float: right; font-weight: bold; width:72px; background:#f03f1c; color:#ffffff; margin-top:14px; padding:0 0 0 12px;} #news .news-btn:hover { color:#ffffff; text-decoration:none; background:#ffb300;} /* ---------------------------------------------------------------------------- Module > Actualites ----------------------------------------------------------------------------- */ #news-list { } #news-list-inner { } #news-list .news { margin: 0 0 10px 0; } #news-list .news-title { margin: 0 0 7px 0; font-weight: bold; color: #000000; } #news-list .news-date { } #news-list .news-photo { float: left; margin: 0 10px 10px 0; border: 1px solid #B7B7B7; } #news-list .news-text { text-align: justify; } #news-list .news-url { } /* ---------------------------------------------------------------------------- Modules > Annuaires Web ----------------------------------------------------------------------------- */ #web-directory-desc { width: 100%; margin: 10px auto; } #web-directory-desc p { padding: 10px 0; text-align: center; } #web-directory-desc a:link, #web-directory-desc a:visited { } #web-directory-desc a:hover, #web-directory-desc a:active { } table#web-directory { width: 100%; margin: 0 auto; } table#web-directory td { padding: 0 10px 0 0; vertical-align: top; } table#web-directory img { float: left; margin: 3px 5px; } table#web-directory a:link, table#web-directory a:visited { } table#web-directory a:hover, table#directory a:active { } /* ---------------------------------------------------------------------------- Modules > Liste Galerie ----------------------------------------------------------------------------- */ .gallerylist { } .gallerylist .gallery { float: left; width:163px; padding: 5px; border: 1px solid #CCCCCC; text-align: center; margin-right:11px; } .gallerylist .gallery-last { margin-right:0 !important; } .gallerylist .photo-holder { float: left; width:159px; padding: 1px; border: 1px solid #ABABAB; } .gallerylist .photo-holder:hover{ border: 1px solid #000000; } .gallerylist .gallery-title { float:left; width:163px; text-align:center;} .gallerylist .gallery-btn { width:119px; float:left; text-align:center; padding-left:44px;} .gallery-btn .details-btn { font-weight: bold; width:72px; background:#f03f1c; color:#ffffff !important; padding:0 6px 0 6px; font-size:11px; float:left; text-align:center; text-decoration:none;} .gallery-btn .details-btn:hover { text-decoration:none; color:#ffffff; background:#ffb300;} /* ---------------------------------------------------------------------------- Modules > Liste Galerie > Details ----------------------------------------------------------------------------- */ #gallery-detail { } #gallery-detail .gallery-title { margin: 0 0 7px 0; padding: 5px 10px; font-weight: bold; background: #222222; color: #FFFFFF; } #gallery-detail .photoBig-holder { float:left; border:1px solid #ababab; padding:1px; background:#ffffff; margin-left:20px;} #gallery-detail .photoBig-holder:hover { border:1px solid #000000;} #gallery-detail .photos-holder { float: left; width:354px;} #gallery-detail .details-holder { float: right; width:380px;} #gallery-detail .gallery-text { text-align: justify; } #gallery-detail .retour { float: right; font-weight: bold; width:52px; background:#f03f1c; color:#ffffff; padding:0 0 0 17px; font-size:11px;} #gallery-detail .retour:hover { color:#ffffff; text-decoration:none; background:#ffb300;}