/*===================================================== // Version : 2.0 // Project : Atelier motosport // Madeby : Delaplace Design //=====================================================*/ /* ----- HTML TAG RESET & CLEARFIX ----- */ body,div,dl,dt,dd,ul,ol,li,h1, h2,h3,h4,h4,h6,pre,form,fieldset, input,textarea,p,blockquote,th,td { margin: 0; padding: 0; } table { border-collapse: collapse; border-spacing: 0; } fieldset,img { border: 0; vertical-align: middle; } a,h1 { overflow: hidden; } ol,ul { list-style: none; } caption,th { text-align: left; } h1,h2,h3,h4,h4,h6 { font-size: 100%; font-weight: normal; overflow: hidden; } q:before,q:after { content: ''; } abbr,acronym { border: 0;} .clear:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .clear { display: inline-block; } html[xmlns] .clear { display: block; } * html .clear { height: 1%; } .clear-bot { clear: both; } a { outline: none; color: #000 } .white { background: #fff !important; } /* ---------- CONTENT HOLDERS */ body { font-family: verdana, tahoma, geneva, sans-serif; font-size: 12px; color: #000; background: #ca0000 url(../images/bg.png) repeat-x; } #wrapper { width: 100%; background: transparent url(../images/wrapper-bg.png) repeat-y center top; margin: 0 auto; } #container { width: 980px; margin: 0 auto; position: relative; } /* ----- top */ #home { position:absolute; left:0px; top:11px;} #top { margin: 0 auto; text-align:center; width: 980px; height: 30px; padding: 10px 8px 0 0; position: relative; font-size: 10px; color: #fff; } #top p img { margin: 0 5px; } #top p a { color: #fff; text-decoration: none } #top a:hover { color: #ff0000 !important; } #top #language { position: absolute; top: 15px; right: 2px; color: #fff; text-decoration: none; font-weight: bold; } #top #language { color:#FFFFFF; font-weight:bold; position:absolute; right:3px; text-decoration:none; top:15px;} /* ----- header */ #header { width: 980px; height: 99px; } #header.en { background: #ca0000 url(../images/header-en.png) no-repeat; } #header.fr { background: #ca0000 url(../images/header-fr.png) no-repeat; } #header h1 { display: none } /* ----- navigation */ #nav { background: #ca0000 url(../images/menu-bg.png) no-repeat; width: 980px; height: 44px; } #nav .last { background: none; } #nav li { float: left; background: transparent url(../images/menu-sep.png) no-repeat top right; height: 40px; margin: 2px 0 0 0; } #nav a { font-weight: bold; color: #fff; text-decoration: none; font-size: 11px; display: block; text-align: center; line-height: 36px; } #nav a:hover, #nav .active { color: #ff0000; } #nav img { vertical-align: middle; margin: 0 5px 0 0; } #link-01 { width: 137px; height: 40px; } #link-02 { width: 118px; height: 40px; } #link-03 { width: 134px; height: 40px; } #link-04 { width: 117px; height: 40px; } #link-05 { width: 118px; height: 40px; } #link-06 { width: 118px; height: 40px; } #link-07 { width: 118px; height: 40px; } #link-08 { width: 120px; height: 40px; } .edit_admin { float:right; z-index:10000;} /* #link-01 { background: transparent url(../images/up/motorcycle.png) no-repeat center left; width: 142px; height: 40px;} #link-01:hover, #link-01 .active { background: transparent url(../images/down/motorcycle.png) no-repeat center left;} #link-02 { background: transparent url(../images/up/atv.png) no-repeat center left; width: 98px; height: 40px; } #link-02:hover, #link-02 .active { background: transparent url(../images/down/atv.png) no-repeat center left; } #link-03 { background: transparent url(../images/up/accessories.png) no-repeat center left; width: 134px; height: 40px; } #link-03:hover, #link-03 .active { background: transparent url(../images/down/accessories.png) no-repeat center left; } #link-04 { background: transparent url(../images/up/apparel.png) no-repeat center left; width: 112px; height: 40px; } #link-04:hover, #link-04 .active { background: transparent url(../images/down/apparel.png) no-repeat center left; } #link-05 { background: transparent url(../images/up/bargains.png) no-repeat center left; width: 113px; height: 40px; } #link-05:hover, #link-05 .active { background: transparent url(../images/down/bargains.png) no-repeat center left; } #link-06 { background: transparent url(../images/up/service.png) no-repeat center left; width: 113px; height: 40px; } #link-06:hover, #link-06 .active { background: transparent url(../images/down/service.png) no-repeat center left; } #link-07 { background: transparent url(../images/up/webcam.png) no-repeat center left; width: 113px; height: 40px; } #link-07:hover { background: transparent url(../images/down/webcam.png) no-repeat center left; } #link-08 { background: transparent url(../images/up/contact.png) no-repeat center left; width: 115px; height: 40px; } #link-08:hover { background: transparent url(../images/down/contact.png) no-repeat center left; } */ /* ----- slideshow */ #slideshow { position: relative; width: 980px; height: 410px; background: transparent url(../images/slideshow-bg.png) no-repeat bottom left; } #slides { width: 980px; height: 400px; } #slides img { display: block; width: 980px; height: 400px; z-index: 5; } #slides a { display: block; position: relative; } #nav-slideshow { position: absolute; bottom: 20px; right: 0; z-index: 10; } #nav-slideshow a { display: block; float: left; margin: 0 10px 0 0; color: #8a8a8a; background: transparent url(../images/sllideshow-button.png) no-repeat; width: 26px; height: 25px; text-align: center; font-weight: bold; text-decoration: none; line-height: 24px; } #nav-slideshow .activeSlide { color: #fff; } #slides .slidetitle { font-size:1.8em; font-weight:bold; display: block; position:absolute; bottom: 20px; left: 20px; color:#fff; padding: 2px 10px; background: transparent url(../images/overlay.png) repeat scroll 0 0} #slides a { text-decoration:none; } /* ----- grid/general */ #content { background: transparent url(../images/content-bg.png) repeat; position: relative; padding: 10px 15px 0 15px; } #content h2 { position: relative; z-index: 5; } #content h2 a { display: block; } .push { padding-top: 72px; } .left { float: left; } .right { float: right; } .w950 { width: 950px; } .w470 { width: 470px; } .w560 { width: 560px; } .w375 { width: 375px; } .box { background: #fff; margin-top: -15px; margin-bottom: 30px; position: relative; z-index: 10; } .box h3 { background: transparent url(../images/h-bg.png) repeat-x; height: 27px; padding: 10px 0 0 10px; } .box .text p { margin: 0 0 10px 0; line-height: 16px; } .box .inner { padding: 5px; border: 2px solid #cccccc; border-top: 0; } .box .border { border: 2px solid #cccccc; border-top: 0; } /* ----- products/portfolio */ .slider { position: relative; height: 160px; } #prevBtn-1 a { outline: none; display: block; text-indent: -9999px; position: absolute; top: 70px; left: 10px; background: transparent url(../images/prev-1.png) no-repeat; width: 22px; height: 38px; } #nextBtn-1 a { outline: none; display: block; text-indent: -9999px; position: absolute; top: 70px; right: 10px; background: transparent url(../images/next-1.png) no-repeat; width: 22px; height: 38px; } #products-select { width: 850px; height: 145px; position: relative; top: 10px; left: 50px; } #products-select ul { width: 850px; height: 145px; overflow:hidden; } #products-select ul li { width: 850px; height: 145px; } #products-select ul li a { float: left; width: 198px; height: 138px; margin: 0 4px; border: 2px solid #757575 } #prevBtn-2 a { outline: none; display: block; text-indent: -9999px; position: absolute; bottom: 50px; left: 15px; background: transparent url(../images/prev-2.png) no-repeat; width: 9px; height: 15px; } #nextBtn-2 a { outline: none; display: block; text-indent: -9999px; position: absolute; bottom: 50px; right: 15px; background: transparent url(../images/next-2.png) no-repeat; width: 9px; height: 15px; } #pictures-select { width: 400px; height: 83px; position: relative; top: 12px; left: 35px; } #pictures-select ul { width: 400px; height: 83px; overflow:hidden;} #pictures-select ul li { width: 400px; height: 83px; } #pictures-select ul li a { float: left; width: 118px; height: 79px; margin: 0 4px; border: 2px solid #808080 } .project-gallery .box { height: 450px; } .project-gallery .left .brand { display: block; margin: 0 auto; } .project-gallery .left .inner, .project-gallery .right .inner { height: 402px; } .project-gallery .left ul { margin: 20px 0 0 0; } .project-gallery .left ul span { float: left; width: 100px; font-weight: bold; text-align: right; padding: 0 10px 0 0; } .project-gallery .left #desc-block { margin: 20px 0 0 14px; } .project-gallery .left .inner div .desc { float: left; width: 100px; } .project-gallery .left .inner div div { float: left; width: 300px; } .project-gallery #featured { border: 1px solid #696969; position: relative } .project-gallery #featured img { width: 454px; height: 300px; } .project-gallery #featured h4 { position: absolute; bottom: 0; left: 0; background: transparent url(../images/trans.png) repeat; width: 444px; height: 35px; color: #fff; text-transform: uppercase; font-family: arial; font-size: 26px; padding: 0 0 0 10px; } /* ----- home */ .home #footer { margin: 350px 0 0 0; } #moto-draw { position: absolute; left: 100px; bottom: 100px; } #find-us { float: left; } #talk-us { float: right; text-align: right } #talk-us a { color: #fe0000; font-weight: bold; text-decoration: underline; } #click-open { clear: both; font-size: 10px; padding: 40px 0 0 0; line-height: 0px; } #newsletter { padding: 10px 0 0 0; } #newsletter label { float: left; padding: 4px 5px 0 0; } #newsletter_i_en { float: left; width: 210px; padding: 2px; border: 1px solid #000; margin: 0 10px 0 0; } #newsletter_i_fr { float: left; width: 190px; padding: 2px; border: 1px solid #000; margin: 0 10px 0 0; } #newsletter_b_en { float: left; display: block; background: transparent url(../images/sign-up-en.png) no-repeat; width: 86px; height: 27px; text-indent: -9999px; } #newsletter_b_fr { float: left; display: block; background: transparent url(../images/sign-up-fr.png) no-repeat; width: 86px; height: 27px; text-indent: -9999px; } /* ----- contact */ #infos { font-size: 11px; height: 100px; padding-top: 10px; } #infos h4, #schedule h4 { color: #ff0000; text-transform: uppercase;font-size: 16px; } #infos-address { float: left; width: 170px; } #infos-phone { float: left; width: 110px; } #infos-fax { float: left; width: 110px; } #infos-mail { float: left; width: 130px; } #schedule table { font-size: 11px; margin: 10px 0 0 0; } #schedule table td { width: 100px; background: #cccccc; text-align: center; border-bottom: 1px solid #696969 } #schedule .last td { border: 0 !important; } .contact #map { width: 556px; height: 357px; } .contact-form { background: #b7b7b7; height: 480px; } .contact-form form { margin: 30px 0 0 0; } .contact-form div { clear: both; height: 35px; } .contact-form label { float: left; width: 120px; padding: 2px 10px 0 0; text-align: right; color: #fff; text-transform: uppercase; font-weight: bold } .i-text { border: 1px solid #000; padding: 2px; width: 220px; height: 16px; } .contact-form textarea { border: 1px solid #000; padding: 2px; width: 220px; height: 150px; font-family: verdana; font-size: 12px; } #msg { height: 170px; } #submit { margin: 0 0 0 130px; } /* ---------- FOOTER */ #footer { border-top: 1px solid #423434; padding-top: 10px; height: 25px; } #footer #copyright { float: left; font-size: 9px; width: 200px; } #footer ul { float: right; } #footer ul li { float: left; font-size: 10px; color: #000; } #footer ul a { font-size: 10px; font-weight: bold; color: #000; text-decoration: none } #footer ul a:hover { color: #ff0000; } #footer ul li span { margin: 0 5px; } #wrapper-footer { margin: 0 auto; background: transparent url(../images/footer-bg.png) no-repeat center top; width: 100%; height: 17px; } #madeby { width: 980px; margin: 5px auto 10px auto; text-align: right; }