/* * MAX RENAUD CSS * * * * * * * * */ /* ============================================================================= HTML5 display definitions ========================================================================== */ article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; } audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; } audio:not([controls]) { display: none; } [hidden] { display: none; } /* ============================================================================= Base ========================================================================== */ /* * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units * 2. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g */ html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } html, button, input, select, textarea { font-family: sans-serif; color: #222; } /* * Remove text-shadow in selection highlight: h5bp.com/i * These selection declarations have to be separate * Also: hot pink! (or customize the background color to match your design) */ ::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; } ::selection { background: #fe57a1; color: #fff; text-shadow: none; } .left { float:left;} .right { float:right; } .clear { clear:both;} /* ============================================================================= Links ========================================================================== */ a { color: #8D8D8D; cursor:pointer; } a:visited { color:none; } a:hover { color: #d6df5b; } a:focus { outline: thin dotted; } /* Improve readability when focused and hovered in all browsers: h5bp.com/h */ a:hover, a:active { outline: 0; } /* ============================================================================= Typography ========================================================================== */ abbr[title] { border-bottom: 1px dotted; } b, strong { font-weight: bold; } blockquote { margin: 1em 40px; } dfn { font-style: italic; } hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; } ins { background: #ff9; color: #000; text-decoration: none; } mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; } /* Redeclare monospace font family: h5bp.com/j */ pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; } /* Improve readability of pre-formatted text in all browsers */ pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; } q { quotes: none; } q:before, q:after { content: ""; content: none; } small { font-size: 85%; } /* Position subscript and superscript content without affecting line-height: h5bp.com/k */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /* ============================================================================= Lists ========================================================================== */ ul, ol { margin: 1em 0; padding: 0 0 0 40px; } dd { margin: 0 0 0 40px; } nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; } /* ============================================================================= Embedded content ========================================================================== */ /* * 1. Improve image quality when scaled in IE7: h5bp.com/d * 2. Remove the gap between images and borders on image containers: h5bp.com/i/440 */ img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; } /* * Correct overflow not hidden in IE9 */ svg:not(:root) { overflow: hidden; } /* ============================================================================= Figures ========================================================================== */ figure { margin: 0; } /* ============================================================================= Forms ========================================================================== */ form { margin: 0; } fieldset { border: 0; margin: 0; padding: 0; text-align:left;} /* Indicate that 'label' will shift focus to the associated form element */ label { cursor: pointer; } /* * 1. Correct color not inheriting in IE6/7/8/9 * 2. Correct alignment displayed oddly in IE6/7 */ legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; } /* * 1. Correct font-size not inheriting in all browsers * 2. Remove margins in FF3/4 S5 Chrome * 3. Define consistent vertical alignment display in all browsers */ button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; } /* * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet) */ button, input { line-height: normal; } /* * 1. Display hand cursor for clickable form elements * 2. Allow styling of clickable form elements in iOS * 3. Correct inner spacing displayed oddly in IE7 (doesn't effect IE6) */ button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; } /* * Re-set default cursor for disabled elements */ button[disabled], input[disabled] { cursor: default; } /* * Consistent box sizing and appearance */ input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; } input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; } input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; } /* * Remove inner padding and border in FF3/4: h5bp.com/l */ button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } /* * 1. Remove default vertical scrollbar in IE6/7/8/9 * 2. Allow only vertical resizing */ textarea { overflow: auto; vertical-align: top; resize: vertical; } /* Colors for form validity */ input:valid, textarea:valid { } input:invalid, textarea:invalid { background-color: #f0dddd; } /* ============================================================================= Tables ========================================================================== */ table { border-collapse: collapse; border-spacing: 0; } td { vertical-align: top; } /* ============================================================================= Chrome Frame Prompt ========================================================================== */ .chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; } /* ==|== primary styles ===================================================== Author: ========================================================================== */ /* General */ @font-face { font-family: bigNoodle; src: url(fonts/big_noodle_titling.ttf); } * { font-size:13px; border: 0; text-decoration: none; list-style-type: none; } body { margin: 0; padding: 0; color:#fff; overflow:hidden; background:url(../img/bg.jpg) repeat; text-shadow:1px 1px 1px rgba(3,44,66,.8); -webkit-font-smoothing: subpixel-antialiased; overflow:auto; font-family: 'Trebuchet MS' } h2 { margin:0; font-size: 2em; font-weight:normal; color: #fff; } .titrePage { background:url(../img/bg_titre.png) no-repeat; width:958px; height:36px; margin-top:60px; } .pageC .titrePage, .pageMax .titrePage { background:url(../img/bg_titre.png) no-repeat; height:36px; margin: 0; width: 100%; } .titrePage h1 { text-transform:uppercase; font-family:'bigNoodle'; color:#fff; font-size:27px; font-weight:normal; margin-left: 15px; padding-top: 3px; } .pageC .titrePage h1, .pageMax .titrePage h1 { text-transform:uppercase; font-family:'bigNoodle'; color:#fff; font-size:27px; font-weight:normal; margin-left: 15px; padding-top: 3px; margin:0; margin-left: 15px;} /* Wrapper */ #wrap { width:990px; height:auto; margin:0 auto; padding-top: 10px; } /* HEADER */ header { position:relative; } header section#logo { background:url(../img/bg_blindage.png) 60% 50% no-repeat; height: 285px; width: 350px;} header .tel { background:url(../img/tel.png) no-repeat center left; padding: 10px 0 10px 40px; } header .tel span { font-family:'bigNoodle'; font-size:29px;} .sociaux { margin-top:15px; width:90px; height:40px;} .sociaux #fb a { background:url(../img/fb.png) no-repeat; background-position:0 0; width:35px; height:35px; display:block; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .sociaux #fb a:hover { background:url(../img/fb_on.png) no-repeat; width:35px; height:35px; display:block; } .sociaux #tw a { background:url(../img/tw.png) no-repeat; width:35px; height:35px; display:block; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .sociaux #tw a:hover { background:url(../img/tw_on.png) no-repeat; width:35px; height:35px; display:block; } #element_menu { position:absolute; left:60%; top:30%; } nav { width:965px; height:68px; } nav ul li {display:inline; float:left; padding-top:29px; text-align: center; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } nav ul li a { font-family:'bigNoodle'; color:#fff; font-size:22px; text-shadow:1px 1px 1px #051941; } nav ul li a:hover { color:#fff; } nav .menu1 { background:url(../img/1.png) no-repeat; width:67px; height:69px; display:block; padding-top:12px; } nav .menu1 .icon-acc { background:url(../img/icon-acc.jpg) no-repeat; width:30px; height:32px; display:block; margin-left: 19px; } nav .menu2 { background:url(../img/2.png) no-repeat; width:105px; height:69px; display:block; } nav .menu2:hover { background:url(../img/2_on.png) no-repeat; width:105px; height:69px; display:block; padding-top:18px; } nav .menu2Actif { background:url(../img/2_on.png) no-repeat; width:105px; height:69px; display:block; padding-top:18px; } nav .menu3 { background:url(../img/3.png) no-repeat; width:181px; height:69px; display:block; } nav .menu3:hover { background:url(../img/3_on.png) no-repeat; width:181px; height:69px; display:block; padding-top:18px; } nav .menu3Actif { background:url(../img/3_on.png) no-repeat; width:181px; height:69px; display:block; padding-top:18px; } nav .menu4 { background:url(../img/4.png) no-repeat; width:228px; height:69px; display:block; } nav .menu4:hover { background:url(../img/4_on.png) no-repeat; width:228px; height:69px; display:block; padding-top:18px; } nav .menu4Actif { background:url(../img/4_on.png) no-repeat; width:228px; height:69px; display:block; padding-top:18px; } nav .menu5 { background:url(../img/5.png) no-repeat; width:207px; height:69px; display:block; } nav .menu5:hover { background:url(../img/5_on.png) no-repeat; width:207px; height:69px; display:block; padding-top:18px; } nav .menu5Actif { background:url(../img/5_on.png) no-repeat; width:207px; height:69px; display:block; padding-top:18px; } nav .menu6 { background:url(../img/6.png) no-repeat; width:83px; height:69px; display:block; } nav .menu6:hover { background:url(../img/6_on.png) no-repeat; width:83px; height:69px; display:block; padding-top:18px; } nav .menu6Actif { background:url(../img/6_on.png) no-repeat; width:83px; height:69px; display:block; padding-top:18px; } nav .menu7 { background:url(../img/7.png) no-repeat; width:94px; height:69px; display:block; } nav .menu7:hover { background:url(../img/7_on.png) no-repeat; width:94px; height:69px; display:block; padding-top:18px; } nav .menu7Actif { background:url(../img/7_on.png) no-repeat; width:94px; height:69px; display:block; padding-top:18px; } /** ACCUEIL */ .quatreBlocks { background:url(../img/bg_4blocks.png) no-repeat; width:949px; height:408px; margin-top:100px; -moz-box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); -webkit-box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); -goog-ms-box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); } .quatreBlocks a { text-decoration:none; color:#fff; } #blockUn { width:350px; height:210px; float:left; margin-left: 25px;} #blockDeux { width:350px; height:210px; float:right; margin-right: 80px;} #blockTrois { width:350px; height:210px; float:left; margin-left: 25px; } #blockQuatre { width:350px; height:210px; float:right; margin-right: 80px; } #blockImg { padding-top:33px; } .block #blockTxt{ font-family:'bigNoodle'; font-size:33px; text-shadow:3px 3px 3px #102838; margin-top: 80px; line-height: 10px;} #produitObtu {margin-top:15px; } #blockTxt span { display:block; padding-bottom: 15px; font-size:35px;} #blockTxt .rotate { -webkit-transform: rotate(-90deg); margin-left: 10px; -moz-transform: rotate(-90deg); filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); float:left; display:block; } #resteTxt { margin-top:9px; } .block:hover #blockTxt .spanUn { -webkit-animation: moveFromTop 1000ms ease; -moz-animation: moveFromTop 1000ms ease; -ms-animation: moveFromTop 1000ms ease; } .block:hover #blockImg{ -webkit-animation: moveFromRight 1000ms ease; -moz-animation: moveFromRight 1000ms ease; -ms-animation: moveFromRight 1000ms ease; } .block:hover #resteTxt { -webkit-animation: moveFromLeft 1000ms ease; -moz-animation: moveFromLeft 1000ms ease; -ms-animation: moveFromLeft 1000ms ease; } @-webkit-keyframes moveFromTop { from { -webkit-transform: translateY(-50%); } to { -webkit-transform: translateY(0%); } } @-moz-keyframes moveFromTop { from { -moz-transform: translateY(-50%); } to { -moz-transform: translateY(0%); } } @-ms-keyframes moveFromTop { from { -ms-transform: translateY(-50%); } to { -ms-transform: translateY(0%); } } @-webkit-keyframes moveFromLeft{ from { -webkit-transform: translateX(0%); } to { -webkit-transform: translateX(50%); } } @-moz-keyframes moveFromLeft{ from { -moz-transform: translateX(0%); } to { -moz-transform: translateX(50%); } } @-ms-keyframes moveFromLeft { from { -ms-transform: translateX(0%); } to { -ms-transform: translateX(50%); } } @-webkit-keyframes moveFromRight{ from { -webkit-transform: translateX(0%); } to { -webkit-transform: translateX(-50%); } } @-moz-keyframes moveFromRight{ from { -moz-transform: translateX(0%); } to { -moz-transform: translateX(-50%); } } @-ms-keyframes moveFromRight { from { -ms-transform: translateX(0%); } to { -ms-transform: translateX(-50%); } } /** PAGE BLINDAGES */ #produitBlindage { margin-top:35px; } #produitBlindage span { background:url(../img/puce.png) no-repeat center left; padding-left:15px; padding-left: 35px; text-transform: uppercase; font-size:13px;} #produitBlindage #blockB { width:195px; height:255px; background:url(../img/bg_block_blindage.png) repeat-x; margin-top:31px; -moz-box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); -webkit-box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); -goog-ms-box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); position:relative; padding-right: 10px;} #produitBlindage #blockB:hover { background:url(../img/bg_block_blindage_on.png) repeat-x; cursor:pointer; } #produitBlindage img {position:absolute; top: -10px;left: -25px;} #produitBlindage ul {padding-top: 140px; padding-left: 10px; } #produitBlindage ul li { background:url(../img/border.png) repeat-x center top; padding-bottom:2px; padding-top:2px; } #produitBlindage ul li span {padding-left:18px; background:url(../img/puce2.png) no-repeat center left; } #col1 { width:240px; margin-left:25px;} #col2 { width:230px; margin-left:25px;} #col3 { margin-right: 30px; } .pageB { height:669px; background-color: rgba(124, 148, 175, 0.5); width: 956px;} .pageO { background-color: rgba(124, 148, 175, 0.5); width: 915px; padding:20px;} .warning { padding-top:140px; padding-left:10px;} .warning p { background:url(../img/puce_warning.png) no-repeat center left; padding-left:30px; font-size:13px; padding-top: 10px; padding-bottom: 10px;} #blockR .warning { padding-top:0px; padding-left:10px;} #produitBlindage #blockB.blockCoulissant { height:190px; } #produitBlindage #blockB.blockLateraux { height:535px; } .caract { background:url(../img/bg_caract.jpg) repeat-x; width:355px; height:403px; padding-top: 35px; } .caract .titreCaract { background:#5a8199; padding-top:4px; padding-bottom:4px; } .caract .titreCaract .spanCaract { background:url(../img/puce.png) center left no-repeat; margin-left: 7px; padding-left: 35px; text-transform: uppercase; } .caract ul {padding-left: 10px; padding-right: 10px; } .caract ul li { background:url(../img/border.png) repeat-x center top; padding-bottom:2px; padding-top:2px; text-align:right; } .caract ul li.specialLi { background:none; } .caract ul li span {padding-left:18px; background:url(../img/puce2.png) no-repeat center left; width: 160px; display: block; float: left; text-align: left; text-transform:uppercase;} .caract ul li span.lastSpan {width: 280px;} .caract ul ul li span { width: 200px; background:none; text-transform:none;} .caract ul ul { padding-right:0; padding-top:10px; } .caract ul li strong { text-align:right; } .caract ul li.first {background:none;} .caract small {font-size:11px; } .fade { opacity:0; } #LBM{ display:none; } #STANDARD { display:none; } #M78 { display:none; } #Minibox { display:none; } #LBM4V { display:none; } #LBM4V2 { display:none; } #regard{ display:none; } #standard4v{ display:none; } #extra1{ display:none; } #std{ display:none; } #extra2{ display:none; } #magnum1{ display:none; } #magnum2{ display:none; } .engagement { background:url(../img/bg_engagement.jpg) no-repeat; width:356px; height:189px; } .engagement p { text-transform:uppercase; color:#d1d9e3; text-shadow: 1px 1px 1px #333; margin-left: 100px; padding-top: 25px;} /** MAX RENAUD */ #maxContainer { padding:10px;} .pageMax { background-color: rgba(124, 148, 175, 0.5); width: 568px;} .pageMax a { color:#fff; text-decoration:none;} .pageMax a:hover { color:#102838; text-decoration:none;} .visuelPr { background: url(../img/bg_maps.jpg) repeat-x; width: 380px; padding-bottom: 7px; } .visuelPr img { margin-left: 7px; margin-top: 7px; } /** CONTACT */ .pageC { height:1524px; background-color: rgba(124, 148, 175, 0.5); width: 568px;} #maps { margin-right: 32px; } .uneMaps { background:url(../img/bg_maps.jpg) repeat-x; width: 380px; height:492px; padding-bottom:25px;} .uneMaps iframe {margin-left: 7px; margin-top: 7px; } .uneMaps #unMagasin { width:100%; margin-left:10px; margin-top:10px; padding-right:0; } .uneMaps #unMagasin .ico-tel { float:left; } .uneMaps #unMagasin .ico-fax { float:right; margin-right: 120px; } #contactForm { padding:10px;} #contactForm p {color:#D1D9E3; text-shadow: 1px 1px 1px #000; text-transform:uppercase;} #colGContact { width:45%; margin-top:15px; } #colDContact { width:45%; margin-top:15px; } #contactForm label { text-transform:uppercase; font-size: 12px; margin-top: 10px; display:block; } #champs { margin-top:15px; height: 70px;} #champsCheck { padding-right:25px; padding-bottom:25px; } #champsCheck label { padding-bottom:0; } .error{ background-color:#AB0000; color:white; font-size:10px; font-weight:bold; margin-top:10px; padding:10px; text-transform:uppercase; width:240px; } #loading{ position:relative; bottom:9px; visibility:hidden; } .jqTransformSelectWrapper span { color:#333; text-shadow:none; } #jqTransformTextarea-mm {width:550px;} /** PAGE OBTURATEUR */ .pageO .blindage2 { margin-left:50px; } .pageO .blindage4 { margin-right:90px; } .obtuCont {width: 550px; float: left; } #produitObtu span { background:url(../img/puce.png) no-repeat center left; padding-left:15px; padding-left: 35px; text-transform: uppercase; font-size:13px;} #produitObtu #blockB { width:195px; background:url(../img/bg_block_blindage.png) repeat-x; margin-top:31px; -moz-box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); -webkit-box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); -goog-ms-box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); position:relative; padding-right: 10px;} #produitObtu #blockB:hover { background:url(../img/bg_block_blindage_on.png) repeat-x; cursor:pointer; } #produitObtu #blockR { background:url(../img/bg_block_blindage.png) repeat-x; margin-top:31px; -moz-box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); -webkit-box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); -goog-ms-box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); position:relative; padding-right: 10px;} #produitObtu #blockR:hover { background:url(../img/bg_block_blindage_on.png) repeat-x; cursor:pointer; } #produitObtu ul {padding-left: 10px; padding-top:10px; } #produitObtu ul li { background:url(../img/border.png) repeat-x center top; padding-bottom:2px; padding-top:2px; } #produitObtu ul li span {padding-left:18px; } #produitObtu ul li a {padding-left:18px; text-transform: uppercase; font-size: 13px; color: #fff; } #diversUl.navigation li {background: url(../img/border.png) repeat-x center top; padding-bottom: 2px; padding-top: 2px;} #diversUl.navigation li a { background: url(../img/puce2.png) no-repeat center left; padding-left: 18px; text-transform: uppercase; font-size: 13px; color: #fff; } .navigation .toggleSubMenu a { background: url(../img/puce_on.png) no-repeat center left; } #produitObtu .navigation span { background: url(../img/puce2.png) no-repeat center left; } .navigation .open a, .navigation .open span { background: url(../img/puce_off.png) no-repeat center left; } .navigation ul.subMenu a { background: url(../img/puce2.png) no-repeat center left; } .caractObtu { background:url(../img/bg_caract.jpg) repeat-x; width: 355px; padding-bottom:15px; height: 320px; padding-top: 15px; margin-top:20px; position:relative;} .caractObtu .titreCaract, .optionDivers .titreCaract { background:#5a8199; padding-top:4px; padding-bottom:4px; } .caractObtu .titreCaract .spanCaract, .optionDivers .titreCaract .spanCaract { background:url(../img/puce.png) center left no-repeat; margin-left: 7px; padding-left: 35px; text-transform: uppercase; } .caractObtu img {position:absolute; top: -60px; left: 200px;} .spacer { height:20px; clear:both; } .caractObtu .fade { opacity:1; } p.info { padding:0; background:url(../img/ico_info.png) no-repeat center left; padding-left:25px;} .caractObtu ul, .optionDivers ul {padding-left: 10px; padding-right: 10px; } .caractObtu ul li, .optionDivers ul li { background:url(../img/border.png) repeat-x center top; padding-bottom:2px; padding-top:2px; text-align:right; } .caractObtu ul li.specialLi, .optionDivers ul li.specialLi { background:none; } .caractObtu ul li span, .optionDivers ul li span {padding-left:18px; background:url(../img/puce2.png) no-repeat center left; width: 160px; display: block; float: left; text-align: left; text-transform:uppercase;} .caractObtu ul li span.lastSpan, .optionDivers ul li span.lastSpan {width: 280px;} .caractObtu ul ul li span { width: 200px; background:none; text-transform:none;} .caractObtu ul ul { padding-right:0; padding-top:10px; } .caractObtu ul li strong { text-align:right; } .caractObtu ul li.first {background:none;} .caractObtu small {font-size:11px; } .pageO .engagement {margin-top: 45px;} /** PAGE DIVERS */ .alphabet {background:url(../img/bg_block_blindage.png) repeat-x; -moz-box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); -webkit-box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); -goog-ms-box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); position:relative; padding-right: 10px; } .alphabet ul { margin:0 ; padding:0;} .alphabet ul li {display:inline; margin-left:7px; } .alphabet ul li a { font-size:15px; color:#fff; padding:7px; } .alphabet ul li a:hover { background:url(../img/bg_block_blindage_on.png) repeat-x; text-shadow:none;} #pdtDivers { margin-left:80px; margin-top:40px; } .optionDivers { background:url(../img/bg_caract.jpg) repeat-x; width: 355px; padding-bottom:15px; padding-top: 15px; margin-top:20px; position:relative;} /** FOOTER */ footer { background:url(../img/barre_footer.jpg) center top repeat-x; height:280px; width:947px; margin-top:50px; clear: both;} footer .titleFooter { padding-top:25px; } footer .title { background:#102838; padding: 5px 15px 5px 15px; color:#fff; font-family:'bigNoodle'; font-size:26px; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; display:block; width:150px; } .qTipPerso { background:#000066; } #unMagasin { margin-top:25px; width:200px; font-size:14px; padding-right:55px; } .magasinTitle { background:url(../img/puce.png) center left no-repeat; padding-left:30px; line-height: 25px; } .ico-tel { background:url(../img/ico-tel.png) no-repeat center left; padding-left:25px; display:block; margin-top:15px; } .ico-fax { background:url(../img/ico-fax.png) no-repeat center left; padding-left:25px; display:block; margin-top:15px; } .ico-mail { background:url(../img/ico-mail.png) no-repeat center left; padding-left:25px; display:block; margin-top:15px; } .ico-mail a { color:#fff; text-decoration:none; } footer .fiche { margin-top:20px; } footer .fiche a { color:#fff; font-family:'bigNoodle'; background:url(../img/puce.png) no-repeat; padding: 5px 5px 5px; border-top:1px solid #cad4de; background:#69839e; font-size:25px; -moz-box-shadow: 20px 20px 5px 0px #405a7d; -moz-box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); -webkit-box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); -goog-ms-box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); box-shadow: 20px 20px 5px 0px rgba(59, 85, 118, .5); } /** * Twitter Bootstrap style. * * Tested with IE 8, IE 9, Chrome 18, Firefox 9, Opera 11. * Does not work with IE 7. */ .ui-tooltip-bootstrap{ font-size: 13px; line-height: 18px; color: #333333; background-color: #ffffff; border: 1px solid #ccc; border: 1px solid rgba(0, 0, 0, 0.2); *border-right-width: 2px; *border-bottom-width: 2px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; } .ui-tooltip-bootstrap .ui-tooltip-titlebar{ font-size: 18px; line-height: 22px; border-bottom: 1px solid #ccc; background-color: transparent; } .ui-tooltip-bootstrap .ui-tooltip-titlebar .ui-state-default{ right: 9px; top: 49%; border-style: none; } .ui-tooltip-bootstrap .ui-tooltip-icon{ background: white; } .ui-tooltip-bootstrap .ui-tooltip-icon .ui-icon{ width: auto; height: auto; float: right; font-size: 20px; font-weight: bold; line-height: 18px; color: #000000; text-shadow: 0 1px 0 #ffffff; opacity: 0.2; filter: alpha(opacity=20); } .ui-tooltip-bootstrap .ui-tooltip-icon .ui-icon:hover{ color: #000000; text-decoration: none; cursor: pointer; opacity: 0.4; filter: alpha(opacity=40); } /* IE9 fix - removes all filters */ .ui-tooltip:not(.ie9haxors) div.ui-tooltip-content, .ui-tooltip:not(.ie9haxors) div.ui-tooltip-titlebar{ filter: none; -ms-filter: none; } /* ==|== media queries ====================================================== EXAMPLE Media Query for Responsive Design. This example overrides the primary ('mobile first') styles Modify as content requires. ========================================================================== */ @media only screen and (min-width: 35em) { /* Style adjustments for viewports that meet the condition */ } /* ==|== non-semantic helper classes ======================================== Please define your styles before this section. ========================================================================== */ /* For image replacement */ .ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; } .ir br { display: none; } /* Hide from both screenreaders and browsers: h5bp.com/u */ .hidden { display: none !important; visibility: hidden; } /* Hide only visually, but have it available for screenreaders: h5bp.com/v */ .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } /* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */ .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } /* Hide visually and from screenreaders, but maintain layout */ .invisible { visibility: hidden; } /* Contain floats: h5bp.com/q */ .clearfix:before, .clearfix:after { content: ""; display: table; } .clearfix:after { clear: both; } .clearfix { *zoom: 1; } /* ==|== print styles ======================================================= Print styles. Inlined to avoid required HTTP connection: h5bp.com/r ========================================================================== */ @media print { * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */ a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */ pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } thead { display: table-header-group; } /* h5bp.com/t */ tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } }