/* ***************************************************************** - cbm_base.css => contient les styles partages par tous les sites - ***************************************************************** */ .bookmarkAuthenticationContainer { border-radius: 8px; padding: 20px; background-color: var(--lcui-primary--100); margin-top: 20px; text-align: center; } * { padding: 0; margin: 0; } html { font-family: Arial, sans-serif; -webkit-text-size-adjust: none; } body { background: none; color: #333; } a img, fieldset { border: 0; } ul, ol, li { list-style-type: none; } p { margin-bottom: 10px; } h3 sup { font-size: 8px; } label, input[type="submit"] { cursor: pointer; } a, a:link, a:visited, a:hover, a:active, a:focus, button { text-decoration: none; outline: none; } article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; } /* ********************************************************************************** * HELPERS : CONSOLE ********************************************************************************** */ .console { background: #222; color: #2d2; padding: 10px; border: 1px dotted #2d2; border-radius: 5px; margin: 20px; overflow: auto; max-height: 400px; } .js .jsHide { display: none !important; /* actif si et seulement si javascript est actif */ } /************************************************************************************ * HELPERS : CONTAINERS * ************************************************************************************ * o .containerGlobal : La conteneur general, situe directement apres le * * * * o .containerSite : * * - Une ligne/zone du conteneurGlobal/body. * * - Ex : Ligne de header, ligne de menu, ligne de body, ligne de footer ... * * * * o Noms des containers basiques qui devront heriter de .containerSite : * * ---------------------------- * * .containerHeader : header (bandeau pub + logos + slogan ...) * * .containerPub : header (bandeau de pub uniquement) * * .containerHeadband : header (ligne de "logo + slogans du site" uniquement) * * .containerMenu * * .containerBody * * .containerFooter * ************************************************************************************/ .containerSite { margin: 0 auto; clear: both; } .containerSite:before, .containerSite:after { content: ""; display: table; line-height: 0; } .containerSite:after { clear: both; } /***************************** - HELPERS : POSITIONNEMENTS - *****************************/ .outOfScreen { position: absolute; left: -20000px; } .txtHidden { font: 0/0 a; color: transparent; text-shadow: none; background-color: transparent; border: 0; } .clear, .cbm_clear { *zoom: 1; } .clear:before, .clear:after, .cbm_clear:before, .cbm_clear:after { content: ""; display: table; line-height: 0; } .clear, .clear:after, .cbm_clear, .cbm_clear:after { clear: both !important; } .floatL { float: left !important; } .floatR { float: right !important; } .noFloat { float: none !important; } .relative { position: relative !important; } .absolute { position: absolute !important; } .fixed { position: fixed !important; } .vTop { vertical-align: top !important; } .vMiddle { vertical-align: middle !important; } .vBottom { vertical-align: bottom !important; } .vBaseline { vertical-align: baseline !important; } .cursorPointer { cursor: pointer !important; } .cursorText { cursor: text !important; } .cursorDefault { cursor: default !important; } .top0 { top: 0 !important; } .bottom0 { bottom: 0 !important; } .right0 { right: 0 !important; } .left0 { left: 0 !important; } .top5 { top: 5px !important; } .bottom5 { bottom: 5px !important; } .right5 { right: 5px !important; } .left5 { left: 5px !important; } .autoOverflow { overflow: auto !important; } .visibleOverflow { overflow: visible !important; } .hiddenOverflow { overflow: hidden !important; } .ellipsis { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .originTop { transform-origin: top; } .scale70 { transform: scale(0.7); -webkit-transform: scale(0.7); -ms-transform: scale(0.7); } .scale80 { transform: scale(0.8); -webkit-transform: scale(0.8); -ms-transform: scale(0.8); } .scale90 { transform: scale(0.9); -webkit-transform: scale(0.9); -ms-transform: scale(0.9); } .hide { display: none !important; } .block { display: block !important; } .inlineBlock { display: inline-block !important; } .inline { display: inline !important; } .displayTable { display: table !important; } .displayTableCell { display: table-cell !important; } .hiddenVisibility { visibility: hidden !important; } .borderBox { box-sizing: border-box; } .index0 { z-index: 0 !important; } .index1 { z-index: 1 !important; } .index10 { z-index: 10 !important; } .index100 { z-index: 100 !important; } .index1000 { z-index: 1000 !important; } .index2 { z-index: 2 !important; } .index20 { z-index: 20 !important; } .index200 { z-index: 200 !important; } .index2000 { z-index: 2000 !important; } .index3 { z-index: 3 !important; } .index30 { z-index: 30 !important; } .index300 { z-index: 300 !important; } .index3000 { z-index: 3000 !important; } .index4 { z-index: 4 !important; } .index40 { z-index: 40 !important; } .index400 { z-index: 400 !important; } .index4000 { z-index: 4000 !important; } .index5 { z-index: 5 !important; } .index50 { z-index: 50 !important; } .index500 { z-index: 500 !important; } .index5000 { z-index: 5000 !important; } /* *************************** - HELPERS : TAILLES DE BLOC - *************************** */ /* Width */ .wAuto { width: auto !important; } .w0 { width: 0 !important; } .w5 { width: 5% !important; } .w10 { width: 10% !important; } .w15 { width: 15% !important; } .w20 { width: 20% !important; } .w25 { width: 25% !important; } .w30 { width: 30% !important; } .w33 { width: 33% !important; } .w66 { width: 66% !important; } .w35 { width: 35% !important; } .w40 { width: 40% !important; } .w45 { width: 45% !important; } .w50 { width: 50% !important; } .w46 { width: 46% !important; } .w55 { width: 55% !important; } .w60 { width: 60% !important; } .w65 { width: 65% !important; } .w70 { width: 70% !important; } .w75 { width: 75% !important; } .w80 { width: 80% !important; } .w85 { width: 85% !important; } .w90 { width: 90% !important; } .w95 { width: 95% !important; } .w100 { width: 100% !important; } /* cas particulier */ .w47 { width: 47% !important; } /* utilise notamment sur les selecteurs de tri min et max du moteur de recherche */ .w5p { width: 5px !important; } .w10p { width: 10px !important; } .w15p { width: 15px !important; } .w20p { width: 20px !important; } .w25p { width: 25px !important; } .w30p { width: 30px !important; } .w33p { width: 33px !important; } .w66p { width: 66px !important; } .w35p { width: 35px !important; } .w40p { width: 40px !important; } .w45p { width: 45px !important; } .w50p { width: 50px !important; } .w55p { width: 55px !important; } .w60p { width: 60px !important; } .w65p { width: 65px !important; } .w70p { width: 70px !important; } .w75p { width: 75px !important; } .w80p { width: 80px !important; } .w85p { width: 85px !important; } .w90p { width: 90px !important; } .w95p { width: 95px !important; } .w100p { width: 100px !important; } .w150p { width: 150px !important; } .w200p { width: 200px !important; } .w250p { width: 250px !important; } .w300p { width: 300px !important; } .w350p { width: 350px !important; } .w400p { width: 400px !important; } .w450p { width: 450px !important; } .w500p { width: 500px !important; } /* Max-width */ .wMxAuto { max-width: inherit !important; } .wMx5 { max-width: 5% !important; } .wMx10 { max-width: 10% !important; } .wMx15 { max-width: 15% !important; } .wMx20 { max-width: 20% !important; } .wMx25 { max-width: 25% !important; } .wMx30 { max-width: 30% !important; } .wMx33 { max-width: 33% !important; } .wMx66 { max-width: 66% !important; } .wMx35 { max-width: 35% !important; } .wMx40 { max-width: 40% !important; } .wMx45 { max-width: 45% !important; } .wMx50 { max-width: 50% !important; } .wMx55 { max-width: 55% !important; } .wMx60 { max-width: 60% !important; } .wMx65 { max-width: 65% !important; } .wMx70 { max-width: 70% !important; } .wMx75 { max-width: 75% !important; } .wMx80 { max-width: 80% !important; } .wMx85 { max-width: 85% !important; } .wMx90 { max-width: 90% !important; } .wMx95 { max-width: 95% !important; } .wMx100 { max-width: 100% !important; } /* Min-width */ .wMnAuto { min-width: inherit !important; } .wMn5 { min-width: 5% !important; } .wMn10 { min-width: 10% !important; } .wMn15 { min-width: 15% !important; } .wMn20 { min-width: 20% !important; } .wMn25 { min-width: 25% !important; } .wMn30 { min-width: 30% !important; } .wMn33 { min-width: 33% !important; } .wMn66 { min-width: 66% !important; } .wMn35 { min-width: 35% !important; } .wMn40 { min-width: 40% !important; } .wMn45 { min-width: 45% !important; } .wMn50 { min-width: 50% !important; } .wMn55 { min-width: 55% !important; } .wMn60 { min-width: 60% !important; } .wMn65 { min-width: 65% !important; } .wMn70 { min-width: 70% !important; } .wMn75 { min-width: 75% !important; } .wMn80 { min-width: 80% !important; } .wMn85 { min-width: 85% !important; } .wMn90 { min-width: 90% !important; } .wMn95 { min-width: 95% !important; } .wMn100 { min-width: 100% !important; } /* Height */ .hAuto { height: auto !important; } .h0 { height: 0 !important; } .h100 { height: 100% !important; } .h5p { height: 5px !important; } .h10p { height: 10px !important; } .h15p { height: 15px !important; } .h20p { height: 20px !important; } .h25p { height: 25px !important; } .h30p { height: 30px !important; } .h33p { height: 33px !important; } .h66p { height: 66px !important; } .h35p { height: 35px !important; } .h40p { height: 40px !important; } .h45p { height: 45px !important; } .h50p { height: 50px !important; } .h55p { height: 55px !important; } .h60p { height: 60px !important; } .h65p { height: 65px !important; } .h70p { height: 70px !important; } .h75p { height: 75px !important; } .h80p { height: 80px !important; } .h85p { height: 85px !important; } .h90p { height: 90px !important; } .h95p { height: 95px !important; } .h100p { height: 100px !important; } .h150p { height: 150px !important; } .h200p { height: 200px !important; } .h250p { height: 250px !important; } .h300p { height: 300px !important; } .h350p { height: 350px !important; } .h400p { height: 400px !important; } .h450p { height: 450px !important; } .h500p { height: 500px !important; } .h32p { height: 32px !important; } .hMx100 { max-height: 100% !important; } /* Common */ .max100 { max-width: 100% !important; max-height: 100% !important; } /**************************** - HELPERS : PADDINGS - ****************************/ .p2 { padding: 2px !important; } .pT2, .pH2 { padding-top: 2px !important; } .pB2, .pH2 { padding-bottom: 2px !important; } .pR2, .pW2 { padding-right: 2px !important; } .pL2, .pW2 { padding-left: 2px !important; } .p3 { padding: 3px !important; } .pT3, .pH3 { padding-top: 3px !important; } .pB3, .pH3 { padding-bottom: 3px !important; } .pR3, .pW3 { padding-right: 3px !important; } .pL3, .pW3 { padding-left: 3px !important; } .p4 { padding: 4px !important; } .pT4, .pH4 { padding-top: 4px !important; } .pB4, .pH4 { padding-bottom: 4px !important; } .pR4, .pW4 { padding-right: 4px !important; } .pL4, .pW4 { padding-left: 4px !important; } .p5 { padding: 5px !important; } .pT5, .pH5 { padding-top: 5px !important; } .pB5, .pH5 { padding-bottom: 5px !important; } .pR5, .pW5 { padding-right: 5px !important; } .pL5, .pW5 { padding-left: 5px !important; } .p8 { padding: 8px !important; } .pT8, .pH8 { padding-top: 8px !important; } .pB8, .pH8 { padding-bottom: 8px !important; } .pR8, .pW8 { padding-right: 8px !important; } .pL8, .pW8 { padding-left: 8px !important; } .p10 { padding: 10px !important; } .pT10, .pH10 { padding-top: 10px !important; } .pB10, .pH10 { padding-bottom: 10px !important; } .pR10, .pW10 { padding-right: 10px !important; } .pL10, .pW10 { padding-left: 10px !important; } .p12 { padding: 12px !important; } .pT12, .pH12 { padding-top: 12px !important; } .pB12, .pH12 { padding-bottom: 12px !important; } .pR12, .pW12 { padding-right: 12px !important; } .pL12, .pW12 { padding-left: 12px !important; } .p15 { padding: 15px !important; } .pT15, .pH15 { padding-top: 15px !important; } .pB15, .pH15 { padding-bottom: 15px !important; } .pR15, .pW15 { padding-right: 15px !important; } .pL15, .pW15 { padding-left: 15px !important; } .p20 { padding: 20px !important; } .pT20, .pH20 { padding-top: 20px !important; } .pB20, .pH20 { padding-bottom: 20px !important; } .pR20, .pW20 { padding-right: 20px !important; } .pL20, .pW20 { padding-left: 20px !important; } .p22 { padding: 22px !important; } .pT22, .pH22 { padding-top: 22px !important; } .pB22, .pH22 { padding-bottom: 22px !important; } .pR22, .pW22 { padding-right: 22px !important; } .pL22, .pW22 { padding-left: 22px !important; } .p30 { padding: 30px !important; } .pT30, .pH30 { padding-top: 30px !important; } .pB30, .pH30 { padding-bottom: 30px !important; } .pR30, .pW30 { padding-right: 30px !important; } .pL30, .pW30 { padding-left: 30px !important; } .p40 { padding: 40px !important; } .pT40, .pH40 { padding-top: 40px !important; } .pB40, .pH40 { padding-bottom: 40px !important; } .pR40, .pW40 { padding-right: 40px !important; } .pL40, .pW40 { padding-left: 40px !important; } .p50 { padding: 50px !important; } .pT50, .pH50 { padding-top: 50px !important; } .pB50, .pH50 { padding-bottom: 50px !important; } .pR50, .pW50 { padding-right: 50px !important; } .pL50, .pW50 { padding-left: 50px !important; } .p0 { padding: 0 !important; } .pT0, .pH0 { padding-top: 0 !important; } .pB0, .pH0 { padding-bottom: 0 !important; } .pR0, .pW0 { padding-right: 0 !important; } .pL0, .pW0 { padding-left: 0 !important; } /******************** - HELPERS : MARGES - ********************/ .m2 { margin: 2px !important; } .mT2, .mH2 { margin-top: 2px !important; } .mB2, .mH2 { margin-bottom: 2px !important; } .mR2, .mW2 { margin-right: 2px !important; } .mL2, .mW2 { margin-left: 2px !important; } .m3 { margin: 3px !important; } .mT3, .mH3 { margin-top: 3px !important; } .mB3, .mH3 { margin-bottom: 3px !important; } .mR3, .mW3 { margin-right: 3px !important; } .mL3, .mW3 { margin-left: 3px !important; } .m5 { margin: 5px !important; } .mT5, .mH5 { margin-top: 5px !important; } .mB5, .mH5 { margin-bottom: 5px !important; } .mR5, .mW5 { margin-right: 5px !important; } .mL5, .mW5 { margin-left: 5px !important; } .m8 { margin: 8px !important; } .mT8, .mH8 { margin-top: 8px !important; } .mB8, .mH8 { margin-bottom: 8px !important; } .mR8, .mW8 { margin-right: 8px !important; } .mL8, .mW8 { margin-left: 8px !important; } .m10 { margin: 10px !important; } .mT10, .mH10 { margin-top: 10px !important; } .mB10, .mH10 { margin-bottom: 10px !important; } .mR10, .mW10 { margin-right: 10px !important; } .mL10, .mW10 { margin-left: 10px !important; } .m15 { margin: 15px !important; } .mT15, .mH15 { margin-top: 15px !important; } .mB15, .mH15 { margin-bottom: 15px !important; } .mR15, .mW15 { margin-right: 15px !important; } .mL15, .mW15 { margin-left: 15px !important; } .m20 { margin: 20px !important; } .mT20, .mH20 { margin-top: 20px !important; } .mB20, .mH20 { margin-bottom: 20px !important; } .mR20, .mW20 { margin-right: 20px !important; } .mL20, .mW20 { margin-left: 20px !important; } .m22 { margin: 22px !important; } .mT22, .mH22 { margin-top: 22px !important; } .mB22, .mH22 { margin-bottom: 22px !important; } .mR22, .mW22 { margin-right: 22px !important; } .mL22, .mW22 { margin-left: 22px !important; } .m25 { margin: 25px !important; } .mT25, .mH25 { margin-top: 25px !important; } .mB25, .mH25 { margin-bottom: 25px !important; } .mR25, .mW25 { margin-right: 25px !important; } .mL25, .mW25 { margin-left: 25px !important; } .m30 { margin: 30px !important; } .mT30, .mH30 { margin-top: 30px !important; } .mB30, .mH30 { margin-bottom: 30px !important; } .mR30, .mW30 { margin-right: 30px !important; } .mL30, .mW30 { margin-left: 30px !important; } .m35 { margin: 35px !important; } .mT35, .mH35 { margin-top: 35px !important; } .mB35, .mH35 { margin-bottom: 35px !important; } .mR35, .mW35 { margin-right: 35px !important; } .mL35, .mW35 { margin-left: 35px !important; } .m40 { margin: 40px !important; } .mT40, .mH40 { margin-top: 40px !important; } .mB40, .mH40 { margin-bottom: 40px !important; } .mR40, .mW40 { margin-right: 40px !important; } .mL40, .mW40 { margin-left: 40px !important; } .m45 { margin: 45px !important; } .mT45, .mH45 { margin-top: 45px !important; } .mB45, .mH45 { margin-bottom: 45px !important; } .mR45, .mW45 { margin-right: 45px !important; } .mL45, .mW45 { margin-left: 45px !important; } .m50 { margin: 50px !important; } .mT50, .mH50 { margin-top: 50px !important; } .mB50, .mH50 { margin-bottom: 50px !important; } .mR50, .mW50 { margin-right: 50px !important; } .mL50, .mW50 { margin-left: 50px !important; } .m60 { margin: 60px !important; } .mT60, .mH60 { margin-top: 60px !important; } .mB60, .mH60 { margin-bottom: 60px !important; } .mR60, .mW60 { margin-right: 60px !important; } .mL60, .mW60 { margin-left: 60px !important; } .m0 { margin: 0 !important; } .mT0, .mH0 { margin-top: 0 !important; } .mB0, .mH0 { margin-bottom: 0 !important; } .mR0, .mW0 { margin-right: 0 !important; } .mL0, .mW0 { margin-left: 0 !important; } .m-1 { margin: -1px !important; } .mT-1, .mH-1 { margin-top: -1px !important; } .mB-1, .mH-1 { margin-bottom: -1px !important; } .mR-1, .mW-1 { margin-right: -1px !important; } .mL-1, .mW-1 { margin-left: -1px !important; } .mR5prct { margin-right: 5%; } .centered { margin-left: auto !important; margin-right: auto !important; } /******************** - HELPERS : TEXTES - ********************/ .f0 { font-size: 0px !important; } .f8 { font-size: 8px !important; } .f9 { font-size: 9px !important; } .f10 { font-size: 10px !important; } .f11 { font-size: 11px !important; } .f12 { font-size: 12px !important; } .f13 { font-size: 13px !important; } .f14 { font-size: 14px !important; } .f15 { font-size: 15px !important; } .f16 { font-size: 16px !important; } .f18 { font-size: 18px !important; } .f20 { font-size: 20px !important; } .f22 { font-size: 22px !important; } .f25 { font-size: 25px !important; } .f30 { font-size: 30px !important; } .f35 { font-size: 35px !important; } .f40 { font-size: 40px !important; } .f45 { font-size: 45px !important; } .f50 { font-size: 50px !important; } .f55 { font-size: 55px !important; } .f60 { font-size: 60px !important; } .lH8 { line-height: 8px !important; } .lH9 { line-height: 9px !important; } .lH10 { line-height: 10px !important; } .lH11 { line-height: 11px !important; } .lH12 { line-height: 12px !important; } .lH13 { line-height: 13px !important; } .lH14 { line-height: 14px !important; } .lH15 { line-height: 15px !important; } .lH16 { line-height: 16px !important; } .lH18 { line-height: 18px !important; } .lH20 { line-height: 20px !important; } .lH22 { line-height: 22px !important; } .lH25 { line-height: 25px !important; } .lH30 { line-height: 30px !important; } .lH32 { line-height: 32px !important; } .lH35 { line-height: 35px !important; } .lH40 { line-height: 40px !important; } .lH45 { line-height: 45px !important; } .lH50 { line-height: 50px !important; } .lH55 { line-height: 55px !important; } .lH60 { line-height: 60px !important; } .lH90 { line-height: 90px !important; } .noLine { line-height: normal !important; } .txtC { text-align: center !important; } .txtL { text-align: left !important; } .txtR { text-align: right !important; } .txtJ { text-align: justify !important; } .arial { font-family: Arial, sans-serif !important; } .cuprum { font-family: Cuprum, sans-serif !important; } .signika { font-family: Signika, sans-serif !important; } .trebuchet { font-family: "Trebuchet MS", sans-serif !important; } .helvetica { font-family: "Helvetica Neue", sans-serif !important; } .verdana { font-family: Verdana, sans-serif !important; } .noBold { font-weight: normal !important; } .bold { font-weight: bold !important; } .noItalic { font-style: normal !important; } .italic { font-style: italic !important; } .noTransform { text-transform: none !important; } .uppercase { text-transform: uppercase !important; } .capitalize { text-transform: capitalize !important; } .noWrap { white-space: nowrap !important; } .wrap { white-space: normal !important; } .fwrap { flex-wrap: wrap; } .noUnderline { text-decoration: none !important; } .underline { text-decoration: underline !important; } .underlineHover:hover { text-decoration: underline !important; } /************************************ - HELPERS : COULEURS DE TEXTES - ************************************/ .txtBlack { color: #000 !important; } .txtGrey3 { color: #333 !important; } .txtGrey58 { color: #585858 !important; } .txtGrey6 { color: #666 !important; } .txtGrey7C { color: #7c7c7c !important; } .txtGrey9 { color: #999 !important; } .txtWhite { color: #fff !important; } .txtError, .fieldError { color: #a70010 !important; } .txtSuccess { color: #48a829 !important; } /************************************ - HELPERS : OMBRES DE TEXTES - ************************************/ .txtShadWhite { text-shadow: 1px 1px #fff !important; } .txtShadBlack { text-shadow: 1px 1px #000 !important; } .noTxtShad { text-shadow: none !important; } ul.disc li, li.disc { list-style-type: disc; } ul.square li, li.square { list-style-type: square; width: auto !important; height: auto !important; } ul.circle li, li.circle { list-style-type: circle; width: auto !important; height: auto !important; } ul.noDeco, li.noDeco { list-style: none !important; } /******************************************************************************* * HELPERS : TABLEAUX * ******************************************************************************** ************************************************************************* * Classe de base pour les tableaux : .table * * * * Surcharge de .table : * * * * o Bordures : * * .tableL : Avec bordures a gauche * * .tableR : Avec bordures a droite * * .tableB : Avec bordures basses * * .tableBordered : Tableau avec toutes les bordures * * * * o Fonds alternes : * * .tableStriped : Lignes avec couleurs de fonds alternees * * * * o Survol : * * .tableHover : Lignes avec effet Hover * * * *************************************************************************/ table { max-width: 100%; background-color: transparent; border-collapse: collapse; border-spacing: 0; } .tableCBM, .tableCBM a { color: #333; } .tableCBM tbody + tbody { border-top: 2px solid #dddddd; } .tableCBM th, .tableCBM td { padding: 8px; line-height: 20px; text-align: left; vertical-align: middle; border-top: 1px solid #dddddd; } .tableCBM th { font-weight: bold; } .tableL th, .tableL td { border-left: 1px solid #dddddd; } .tableR th, .tableR td { border-right: 1px solid #dddddd; } .tableB th, .tableB td { border-bottom: 1px solid #dddddd; } .tableBordered th, .tableBordered td { border: 1px solid #dddddd; } .tableStriped tbody > tr:nth-child(odd) > td, .tableStriped tbody > tr:nth-child(odd) > th { background-color: #f9f9f9; } .tableHover tbody tr:hover > td, .tableHover tbody tr:hover > th { background-color: #f5f5f5; } /************************************************************************************************************************************************ - HELPERS : FONDS, FONDS DEGRADES, BORDURES, OPACITES, ANGLES ARRONDIS, OMBRES PORTEES - ************************************************************************************************************************************************/ /************************************ - HELPERS : FONDS SIMPLES - ************************************/ .bgBlack { background-color: #000 !important; } .bgGrey3 { background-color: #333 !important; } .bgGrey6 { background-color: #666 !important; } .bgGrey9 { background-color: #999 !important; } .bgGreyA { background-color: #aaa !important; } .bgGreyB { background-color: #bbb !important; } .bgGreyC { background-color: #ccc !important; } .bgGreyD { background-color: #ddd !important; } .bgGreyE { background-color: #eee !important; } .bgGreyE7 { background-color: #e7e7e7 !important; } .bgGreyEF { background-color: #efefef !important; } .bgGreyF3 { background-color: #f3f3f3 !important; } .bgGrey282 { background-color: #282b34 !important; } .bgWhite { background-color: #fff !important; } .bgRed { background-color: #a70010 !important; } .bgBlue { background-color: #0783ac !important; } .bgBlackTrans { background-color: rgba(0, 0, 0, 0.7); } .bgWhiteTrans { background-color: rgba(255, 255, 255, 0.7); } .bgError { background-color: #ebc2cb; } .bgSuccess { background-color: #eefee0; } /******************************************************************** * HELPERS : FONDS DEGRADES * ******************************************************************** * Syntaxe : * * ------- * * gradBlueBrown par exemple pour les cas specifiques * * gradBlueBrown2 par exemple pour les cas specifiques * * gradF-S-E si on a un ou des stop(s) au milieu du gradient * ********************************************************************/ .ie9 [class^="btn"], .ie9 [class*=" btn"], .ie9 [class^="grad"], .ie9 [class*=" grad"], .recent [class^="btn"], .recent [class*=" btn"] .recent [class^="grad"], .recent [class*=" grad"] { filter: none; } .gradF-E { background-color: #eeeeee; /* Old browsers */ background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZWVlZWUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #eeeeee) ); /* Chrome,Safari4+ */ background-image: -webkit-linear-gradient( top, #ffffff 0%, #eeeeee 100% ); /* Chrome10+,Safari5.1+ */ background-image: -moz-linear-gradient( top, #ffffff 0%, #eeeeee 100% ); /* FF3.6+ */ background-image: -o-linear-gradient( top, #ffffff 0%, #eeeeee 100% ); /* Opera 11.10+ */ background-image: -ms-linear-gradient( top, #ffffff 0%, #eeeeee 100% ); /* IE10+ */ background-image: linear-gradient( to bottom, #ffffff 0%, #eeeeee 100% ); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 ); /* IE6-8 */ } .gradF-E1 { background-color: #e1e1e1; /* Old browsers */ background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlMWUxZTEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #e1e1e1) ); /* Chrome,Safari4+ */ background-image: -webkit-linear-gradient( top, #ffffff 0%, #e1e1e1 100% ); /* Chrome10+,Safari5.1+ */ background-image: -moz-linear-gradient( top, #ffffff 0%, #e1e1e1 100% ); /* FF3.6+ */ background-image: -o-linear-gradient( top, #ffffff 0%, #e1e1e1 100% ); /* Opera 11.10+ */ background-image: -ms-linear-gradient( top, #ffffff 0%, #e1e1e1 100% ); /* IE10+ */ background-image: linear-gradient( to bottom, #ffffff 0%, #e1e1e1 100% ); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e1e1e1',GradientType=0 ); /* IE6-8 */ } .gradE-B { background: #bbbbbb; /* Old browsers */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VlZWVlZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNiNWI1YjUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: -webkit-gradient( linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #bbbbbb) ); /* Chrome,Safari4+ */ background: -webkit-linear-gradient( top, #eeeeee 0%, #bbbbbb 100% ); /* Chrome10+,Safari5.1+ */ background: -moz-linear-gradient( top, #eeeeee 0%, #bbbbbb 100% ); /* FF3.6+ */ background: -o-linear-gradient( top, #eeeeee 0%, #bbbbbb 100% ); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #eeeeee 0%, #bbbbbb 100%); /* IE10+ */ background: linear-gradient(to bottom, #eeeeee 0%, #bbbbbb 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#bbbbbb',GradientType=0 ); /* IE6-8 */ } /************************************************ - HELPERS : FONDS DEGRADES HORIZONTAUX - ************************************************/ .hGradE-F { background: #eeeeee; background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2RlZGVkZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -webkit-gradient( linear, left top, right top, color-stop(0%, #eeeeee), color-stop(100%, #ffffff) ); background: -webkit-linear-gradient(left, #eeeeee 0%, #ffffff 100%); background: -moz-linear-gradient(left, #eeeeee 0%, #ffffff 100%); background: -o-linear-gradient(left, #eeeeee 0%, #ffffff 100%); background: -ms-linear-gradient(left, #eeeeee 0%, #ffffff 100%); background: linear-gradient(to right, #eeeeee 0%, #ffffff 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#ffffff',GradientType=1 ); } .hGradD-F { background: #dddddd; background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2RlZGVkZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -webkit-gradient( linear, left top, right top, color-stop(0%, #dddddd), color-stop(100%, #ffffff) ); background: -webkit-linear-gradient(left, #dddddd 0%, #ffffff 100%); background: -moz-linear-gradient(left, #dddddd 0%, #ffffff 100%); background: -o-linear-gradient(left, #dddddd 0%, #ffffff 100%); background: -ms-linear-gradient(left, #dddddd 0%, #ffffff 100%); background: linear-gradient(to right, #dddddd 0%, #ffffff 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#ffffff',GradientType=1 ); } /******************************** - HELPERS : BORDURES - ********************************/ .bBlack { border: 1px solid #000000 !important; } .bBlackT { border-top: 1px solid #000000 !important; } .bBlackB { border-bottom: 1px solid #000000 !important; } .bBlackR { border-right: 1px solid #000000 !important; } .bBlackL { border-left: 1px solid #000000 !important; } .bRed { border: 1px solid #a70010 !important; } .bRedT { border-top: 1px solid #a70010 !important; } .bRedB { border-bottom: 1px solid #a70010 !important; } .bRedR { border-right: 1px solid #a70010 !important; } .bRedL { border-left: 1px solid #a70010 !important; } .bGrey9 { border: 1px solid #999999 !important; } .bGrey9T { border-top: 1px solid #999999 !important; } .bGrey9B { border-bottom: 1px solid #999999 !important; } .bGrey9R { border-right: 1px solid #999999 !important; } .bGrey9L { border-left: 1px solid #999999 !important; } .bGreyC { border: 1px solid #cccccc !important; } .bGreyCT { border-top: 1px solid #cccccc !important; } .bGreyCB { border-bottom: 1px solid #cccccc !important; } .bGreyCR { border-right: 1px solid #cccccc !important; } .bGreyCL { border-left: 1px solid #cccccc !important; } .bGreyD { border: 1px solid #dddddd !important; } .bGreyDT { border-top: 1px solid #dddddd !important; } .bGreyDB { border-bottom: 1px solid #dddddd !important; } .bGreyDR { border-right: 1px solid #dddddd !important; } .bGreyDL { border-left: 1px solid #dddddd !important; } .bGreyE1 { border: 1px solid #e1e1e1 !important; } .bGreyEF { border: 1px solid #efefef !important; } .bWhite { border: 1px solid #ffffff !important; } .bWhiteT { border-top: 1px solid #ffffff !important; } .bWhiteB { border-bottom: 1px solid #ffffff !important; } .bWhiteR { border-right: 1px solid #ffffff !important; } .bWhiteL { border-left: 1px solid #ffffff !important; } .bBlue { border: 1px solid #0783ac !important; } .outError { outline: 1px solid #a70010 !important; } .bError { border: 1px solid #a70010 !important; } .bSuccess { border: 1px solid #48a829 !important; } .b2 { border-width: 2px !important; } .b3 { border-width: 3px !important; } .b4 { border-width: 4px !important; } .b5 { border-width: 5px !important; } .b8 { border-width: 8px !important; } .b10 { border-width: 10px !important; } .bDotted { border-style: dotted !important; } .b0 { border: none !important; } .b0T, .b0H { border-top: none !important; } .b0B, .b0H { border-bottom: none !important; } .b0R, .b0W { border-right: none !important; } .b0L, .b0W { border-left: none !important; } /************************************ - HELPERS : OPACITE - ************************************/ .op10 { -moz-opacity: 0.1; -khtml-opacity: 0.1; -ms-filter: "alpha(opacity=10)"; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=10); filter: alpha(opacity=10); opacity: 0.1; zoom: 1; } .op20 { -moz-opacity: 0.2; -khtml-opacity: 0.2; -ms-filter: "alpha(opacity=20)"; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=20); filter: alpha(opacity=20); opacity: 0.2; zoom: 1; } .op30 { -moz-opacity: 0.3; -khtml-opacity: 0.3; -ms-filter: "alpha(opacity=30)"; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=30); filter: alpha(opacity=30); opacity: 0.3; zoom: 1; } .op40 { -moz-opacity: 0.4; -khtml-opacity: 0.4; -ms-filter: "alpha(opacity=40)"; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=40); filter: alpha(opacity=40); opacity: 0.4; zoom: 1; } .op50 { -moz-opacity: 0.5; -khtml-opacity: 0.5; -ms-filter: "alpha(opacity=50)"; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50); filter: alpha(opacity=50); opacity: 0.5; zoom: 1; } .op60 { -moz-opacity: 0.6; -khtml-opacity: 0.6; -ms-filter: "alpha(opacity=60)"; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60); filter: alpha(opacity=60); opacity: 0.6; zoom: 1; } .op70 { -moz-opacity: 0.7; -khtml-opacity: 0.7; -ms-filter: "alpha(opacity=70)"; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70); filter: alpha(opacity=70); opacity: 0.7; zoom: 1; } .op80 { -moz-opacity: 0.8; -khtml-opacity: 0.8; -ms-filter: "alpha(opacity=80)"; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80); filter: alpha(opacity=80); opacity: 0.8; zoom: 1; } .op90 { -moz-opacity: 0.9; -khtml-opacity: 0.9; -ms-filter: "alpha(opacity=90)"; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=90); filter: alpha(opacity=90); opacity: 0.9; zoom: 1; } .op100 { -moz-opacity: 1 !important; -khtml-opacity: 1 !important; -ms-filter: "alpha(opacity=100)" !important; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100); filter: alpha(opacity=100) !important; opacity: 1 !important; zoom: 1; } /******************************************** - HELPERS : ANGLES ARRONDIS - ********************************************/ .rad0 { -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; } .rad1 { -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; } .rad2 { -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .rad3 { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .rad5 { -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .rad8 { -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; } .rad10 { -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } .rad12 { -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; } .rad15 { -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; } .radTL0, .radT0, .radL0 { -webkit-border-top-left-radius: 0px; -moz-border-radius-topleft: 0px; border-top-left-radius: 0px; } .radTR0, .radT0, .radR0 { -webkit-border-top-right-radius: 0px; -moz-border-radius-topright: 0px; border-top-right-radius: 0px; } .radBL0, .radB0, .radL0 { -webkit-border-bottom-left-radius: 0px; -moz-border-radius-bottomleft: 0px; border-bottom-left-radius: 0px; } .radBR0, .radB0, .radR0 { -webkit-border-bottom-right-radius: 0px; -moz-border-radius-bottomright: 0px; border-bottom-right-radius: 0px; } /******************************************** - HELPERS : OMBRES PORTEES - ********************************************/ .shadGreyT { -webkit-box-shadow: 0px -5px 10px 0px #ccc; -moz-box-shadow: 0px -5px 10px 0px #ccc; -o-box-shadow: 0px -5px 10px 0px #ccc; box-shadow: 0px -5px 10px 0px #ccc; filter: progid:DXImageTransform.Microsoft.Shadow(color=#ccc, Direction=90, Strength=10); } .shadGreyR { -webkit-box-shadow: 5px 0px 10px 0px #ccc; -moz-box-shadow: 5px 0px 10px 0px #ccc; -o-box-shadow: 5px 0px 10px 0px #ccc; box-shadow: 5px 0px 10px 0px #ccc; filter: progid:DXImageTransform.Microsoft.Shadow(color=#ccc, Direction=90, Strength=10); } .shadGreyB { -webkit-box-shadow: 0px 5px 10px 0px #ccc; -moz-box-shadow: 0px 5px 10px 0px #ccc; -o-box-shadow: 0px 5px 10px 0px #ccc; box-shadow: 0px 5px 10px 0px #ccc; filter: progid:DXImageTransform.Microsoft.Shadow(color=#ccc, Direction=180, Strength=10); } .shadGreyL { -webkit-box-shadow: -5px 0px 10px 0px #ccc; -moz-box-shadow: -5px 0px 10px 0px #ccc; -o-box-shadow: -5px 0px 10px 0px #ccc; box-shadow: -5px 0px 10px 0px #ccc; filter: progid:DXImageTransform.Microsoft.Shadow(color=#ccc, Direction=180, Strength=10); } /************************************************************************************************************************************************ - HELPERS : PICTOS - ************************************************************************************************************************************************/ .txtPictoR { display: inline-block; margin-left: 5px; line-height: 35px; } .txtPictoL { display: inline-block; margin-right: 5px; line-height: 35px; } .txtPictoRMultiLine { display: inline-block; margin-left: 5px; vertical-align: top; } .txtPictoLMultiLine { display: inline-block; margin-right: 5px; vertical-align: top; } .pictoTel { background-position: 0 0 !important; } .pictoTelWhite { background-position: 0 -35px !important; } .pictoMail { background-position: -35px 0 !important; } .pictoMailWhite { background-position: -35px -35px !important; } .pictoMapPointer { background-position: -70px 0 !important; } .pictoMapPointerWhite { background-position: -70px -35px !important; } .pictoMapPointerBlue { background-position: -70px -175px !important; } .pictoAccount { background-position: -105px 0 !important; } .pictoAccountWhite { background-position: -105px -35px !important; } .pictoFrance { background-position: -140px 0 !important; } .pictoFranceBlue { background-position: -140px -105px !important; } .pictoFeatures { background-position: -175px 0 !important; } .pictoFeaturesWhite { background-position: -175px -35px !important; } .pictoBell { background-position: -210px 0 !important; } .pictoBellWhite { background-position: -210px -35px !important; } .pictoHome { background-position: -245px 0 !important; } .pictoHomeBlue { background-position: -245px -105px !important; } .pictoPhoto { background-position: -280px 0 !important; } .pictoRoute { background-position: -315px 0 !important; } .pictoRouteBlue { background-position: -315px -105px !important; } .pictoAutoviza { background-position: -350px 0 !important; } .pictoSpeaker { background-position: -385px 0 !important; } .pictoSpeakerWhite { background-position: -385px -35px !important; } .pictoCatAuto { background-position: -420px 0 !important; } .pictoCatAutoWhite { background-position: -420px -35px !important; } .pictoCatAutoGrey { background-position: -420px -70px !important; } .pictoCatUtilitaire, .pictoCatUtils { background-position: -455px 0 !important; } .pictoCatUtilitaireWhite, .pictoCatUtilsWhite { background-position: -455px -35px !important; } .pictoCatUtilitaireGrey, .pictoCatUtilsGrey { background-position: -455px -70px !important; } .pictoCatMoto { background-position: -490px 0 !important; } .pictoCatMotoWhite { background-position: -490px -35px !important; } .pictoCatMotoGrey { background-position: -490px -70px !important; } .pictoCatScooter { background-position: -525px 0 !important; } .pictoCatScooterWhite { background-position: -525px -35px !important; } .pictoCatScooterGrey { background-position: -525px -70px !important; } .pictoCatQuad { background-position: -560px 0 !important; } .pictoCatQuadWhite { background-position: -560px -35px !important; } .pictoCatQuadGrey { background-position: -560px -70px !important; } .pictoCatLoisir { background-position: -595px 0 !important; } .pictoCatLoisirWhite { background-position: -595px -35px !important; } .pictoCatLoisirGrey { background-position: -595px -70px !important; } .pictoVideo { background-position: -630px 0 !important; } .pictoVideoWhite { background-position: -630px -35px !important; } .pictoVideoBlue { background-position: -630px -105px !important; } .pictoVideoLightBlue { background-position: -630px -175px !important; } .pictoWarning { background-position: -665px 0 !important; } .pictoWarningWhite { background-position: -665px -35px !important; } .pictoWarningRed { background-position: -665px -140px !important; } .pictoWarningBlue { background-position: -665px -105px !important; } .pictoQuotation { background-position: -700px 0 !important; } .pictoQuotationWhite { background-position: -700px -35px !important; } .pictoValid { background-position: -150px -325px !important; } .pictoSpeak { background-position: -175px -325px !important; } .pictoTrash { background-position: -735px 0 !important; } .pictoZoom { background-position: -770px 0 !important; } .pictoZoomWhite { background-position: -770px -35px !important; } .pictoZoomGrey { background-position: -770px -70px !important; } .pictoFavAdd { background-position: -805px 0 !important; } .pictoFavAddWhite { background-position: -805px -35px !important; } .pictoFavAddGrey { background-position: -805px -70px !important; } .pictoFavAddBlue { background-position: -805px -105px !important; } .pictoFavAddBlueHover, .pictoFavAddBlue:hover { background-position: -805px -140px !important; } .pictoFavActive { background-position: -840px 0 !important; } .pictoFavActiveWhite { background-position: -840px -35px !important; } .pictoFavActiveOrange { background-position: -840px -105px !important; } .pictoFavActiveRed { background-position: -840px -140px !important; } .pictoShare { background-position: -875px 0 !important; } .pictoShareWhite { background-position: -875px -35px !important; } .pictoShareGrey { background-position: -875px -70px !important; } .pictoShareBlue { background-position: -875px -105px !important; } .pictoShareBlueHover, .pictoShareBlue:hover { background-position: -875px -140px !important; } .pictoPrint { background-position: -910px 0 !important; } .pictoPrintWhite { background-position: -910px -35px !important; } .pictoPrintGrey { background-position: -910px -70px !important; } .pictoPrintBlue { background-position: -910px -105px !important; } .pictoPrintBlueHover, .pictoPrintBlue:hover { background-position: -910px -140px !important; } .pictoPreview { background-position: -945px 0 !important; } .pictoPreviewWhite { background-position: -945px -35px !important; } .pictoMapEngine { background-position: -980px 0 !important; } .pictoMapEngineBlue { background-position: -980px -105px !important; } .pictoShield { background-position: -1015px 0 !important; } .pictoShieldBlue { background-position: -1015px -105px !important; } .pictoCatVoilierVague { background-position: -1050px 0 !important; } .pictoBubble { background-position: -1085px 0 !important; } .pictoBubbleWhite { background-position: -1085px -35px !important; } .pictoBubbleBlue { background-position: -1085px -105px !important; } .pictoCatVoilier { background-position: -1120px 0 !important; } .pictoCatVoilierWhite { background-position: -1120px -35px !important; } .pictoCatVoilierBlue { background-position: -1120px -105px !important; } .pictoCatBateau { background-position: -1155px 0 !important; } .pictoCatBateauWhite { background-position: -1155px -35px !important; } .pictoCatBateauBlue { background-position: -1155px -105px !important; } .pictoCatMoteur { background-position: -1190px 0 !important; } .pictoCatMoteurWhite { background-position: -1190px -35px !important; } .pictoCatMoteurBlue { background-position: -1190px -105px !important; } .pictoCatDivers { background-position: -1225px 0 !important; } .pictoCatDiversWhite { background-position: -1225px -35px !important; } .pictoCatDiversBlue { background-position: -1225px -105px !important; } .pictoDeparture { background-position: -1260px 0 !important; } .pictoArrival { background-position: -1295px 0 !important; } .pictoPrev { background-position: -1330px 0 !important; } .pictoPrevWhite { background-position: -1330px -35px !important; } .pictoNext { background-position: -1365px 0 !important; } .pictoNextWhite { background-position: -1365px -35px !important; } .pictoCatEmplacement { background-position: -1400px 0 !important; } .pictoCatEmplacementWhite { background-position: -1400px -35px !important; } .pictoCatEmplacementBlue { background-position: -1400px -105px !important; } .pictoQuestion { background-position: -1435px 0 !important; } .pictoQuestionBlue { background-position: -1435px -105px !important; } .pictoQuestionLightBlue { background-position: -1435px -175px !important; } .pictoReload { background-position: -1470px 0 !important; } .pictoReloadBlue { background-position: -1470px -105px !important; } .pictoAndroid1 { background-position: -1505px 0 !important; } .pictoAndroidWhite1 { background-position: -1505px -35px !important; } .pictoAndroid2 { background-position: -1540px 0 !important; } .pictoAndroidWhite2 { background-position: -1540px -35px !important; } .pictoAttachment { background-position: -1575px 0 !important; } .pictoAttachmentWhite { background-position: -1575px -35px !important; } .pictoEarth { background-position: -1610px 0 !important; } .pictoEarthWhite { background-position: -1610px -35px !important; } .pictoEarthBlue { background-position: -1610px -105px !important; } .pictoAutoFill { background-position: -1645px 0 !important; } .pictoInternet { background-position: -1680px 0 !important; } .pictoWarranty { background-position: -1715px 0 !important; } .pictoValid { background-position: -1750px 0 !important; } .pictoSpeak { background-position: -1785px 0 !important; } .pictoRenew { background-position: -1925px 0 !important; } .pictoRenewWhite { background-position: -1925px -35px !important; } .pictoDisk { background-position: -1995px 0 !important; } .pictoPhoto2 { background-position: -2030px 0 !important; } .pictoAdviceBlue { background-position: -2065px -175px !important; } .pictoSecuritel { background-position: -2310px 0 !important; } .pictoStats { background-position: -2415px 0 !important; } .pictoDisconnect { background-position: -2450px 0 !important; } .pictoMailAnswer { background-position: -2485px 0 !important; } .pictoArrowL { background-position: -2520px 0 !important; } .pictoArrowR { background-position: -2555px 0 !important; } .pictoVendre { background-position: -2590px 0 !important; } .pictoGreenArrow { background-position: -2695px 0px !important; } .pictoStatsDecrease { background-position: -2730px 0px !important; } .pictoStarFull { background-position: -2765px 0px !important; } .pictoStarHalf { background-position: -2800px 0px !important; } .pictoStarEmpty { background-position: -2835px 0px !important; } .pictoClose { background-position: -2870px 0px !important; } .pictoCloseWhite { background-position: -2870px -35px !important; } .pictoPhotoSmall { background-position: -2905px 0px !important; } .pictoPhotoSmallWhite { background-position: -2905px -35px !important; } .pictoDepopassWhite { background-position: -2940px -35px !important; } .pictoSavedSearchWhite { background-position: -2975px -35px !important; } /* pictos 90*90*/ .spriteShield { background-position: 0px 0 !important; } .spriteDeal { background-position: -90px 0 !important; } .spriteExpertise { background-position: -180px 0 !important; } .spriteMecanic { background-position: -270px 0 !important; } .spritePrice { background-position: -360px 0 !important; } .spriteVendor { background-position: -450px 0 !important; } .spriteMapPointer { background-position: -540px 0 !important; } .spriteArrowL { background-position: -630px 0 !important; } .spriteArrowR { background-position: -720px 0 !important; } .spriteVendre { background-position: -810px 0 !important; } /* Pictos 60x60 */ .sprite360int { background-position: -1180px -14px !important; } .sprite360ext { background-position: -1090px -14px !important; } /* Rollovers de Pictos (reserves au desktop) */ @media only screen and (min-width: 1201px) { .stockPro a:hover .pictoCatAuto { background-position: -420px -70px !important; } .stockPro a:hover .pictoCatUtils, .stockPro a:hover .pictoCatUtilitaire { background-position: -455px -70px !important; } .stockPro a:hover .pictoCatMoto { background-position: -490px -70px !important; } .stockPro a:hover .pictoCatScooter { background-position: -525px -70px !important; } .stockPro a:hover .pictoCatQuad { background-position: -560px -70px !important; } .stockPro a:hover .pictoCatLoisir { background-position: -595px -70px !important; } a:hover .pictoFavAdd { background-position: -840px -140px !important; } .adCtrls a:hover .pictoShare { background-position: -875px -70px !important; } .adCtrls a:hover .pictoPrint { background-position: -910px -70px !important; } } /************************************************************************ - HELPERS : Pictos fait en CSS - prefixe .icon - ************************************************************************/ /* Lignes horizontales */ .iconLine, .iconLineShadow { background-color: #f5f5f5; border-radius: 1px; display: block; height: 3px; width: 18px; } .iconLineShadow { height: 2px; box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25); } /************************************************************ - HELPERS : Pictos - Cercles - ************************************************************/ .circ { /* rajouter les classes "bgGreyC bGreyC" pour l'avoir en gris par exemple */ background-color: #ccc; border: 1px solid #ccc; text-align: center; display: inline-block; vertical-align: middle; width: 5px; height: 5px; border-radius: 5px; } .circ6 { width: 6px; height: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; line-height: 6px; } .circ10 { width: 10px; height: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; line-height: 10px; } .circ15 { width: 15px; height: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; line-height: 15px; } .circ20 { width: 20px; height: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; line-height: 20px; } .circ25 { width: 25px; height: 25px; -moz-border-radius: 25px; -webkit-border-radius: 25px; border-radius: 25px; line-height: 25px; } .circ30 { width: 30px; height: 30px; -moz-border-radius: 30px; -webkit-border-radius: 30px; border-radius: 30px; line-height: 30px; } .circ40 { width: 40px; height: 40px; -moz-border-radius: 40px; -webkit-border-radius: 40px; border-radius: 40px; line-height: 40px; } .circ50 { width: 50px; height: 50px; -moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px; line-height: 50px; } .circ60 { width: 60px; height: 60px; -moz-border-radius: 60px; -webkit-border-radius: 60px; border-radius: 60px; line-height: 60px; } .circ70 { width: 70px; height: 70px; -moz-border-radius: 70px; -webkit-border-radius: 70px; border-radius: 70px; line-height: 70px; } .circ80 { width: 80px; height: 80px; -moz-border-radius: 80px; -webkit-border-radius: 80px; border-radius: 80px; line-height: 80px; } .circ90 { width: 90px; height: 90px; -moz-border-radius: 90px; -webkit-border-radius: 90px; border-radius: 90px; line-height: 90px; } /************************************************************ - HELPERS : Pictos - Triangles - ************************************************************/ .triangle { width: 0px; height: 0px; border-style: solid; text-align: center; display: inline-block; } .triangleT { border-width: 0 5px 7px 5px !important; border-top-color: transparent !important; border-right-color: transparent !important; border-left-color: transparent !important; } .triangleR { border-width: 5px 0 5px 7px !important; border-top-color: transparent !important; border-right-color: transparent !important; border-bottom-color: transparent !important; } .triangleB { border-width: 7px 5px 0 5px !important; border-right-color: transparent !important; border-bottom-color: transparent !important; border-left-color: transparent !important; } .triangleL { border-width: 5px 7px 5px 0 !important; border-top-color: transparent !important; border-bottom-color: transparent !important; border-left-color: transparent !important; } .triangleMedT { border-width: 0 7px 12px 7px !important; border-top-color: transparent !important; border-right-color: transparent !important; border-left-color: transparent !important; } .triangleMedR { border-width: 7px 0 7px 12px !important; border-top-color: transparent !important; border-right-color: transparent !important; border-bottom-color: transparent !important; } .triangleMedB { border-width: 12px 7px 0 7px !important; border-right-color: transparent !important; border-bottom-color: transparent !important; border-left-color: transparent !important; } .triangleMedL { border-width: 7px 12px 7px 0 !important; border-top-color: transparent !important; border-bottom-color: transparent !important; border-left-color: transparent !important; } .triangleBigT { border-width: 0 10px 18px 10px !important; border-top-color: transparent !important; border-right-color: transparent !important; border-left-color: transparent !important; } .triangleBigR { border-width: 10px 0 10px 18px !important; border-top-color: transparent !important; border-right-color: transparent !important; border-bottom-color: transparent !important; } .triangleBigB { border-width: 18px 10px 0 10px !important; border-right-color: transparent !important; border-bottom-color: transparent !important; border-left-color: transparent !important; } .triangleBigL { border-width: 10px 18px 10px 0 !important; border-top-color: transparent !important; border-bottom-color: transparent !important; border-left-color: transparent !important; } /******************************************************** - HELPERS : Pictos - Carres - ********************************************************/ .square:not(ul, li) { width: 10px; height: 10px; background-color: #000; text-align: center; display: inline-block; vertical-align: middle; } .square10 { width: 10px; height: 10px; } .square15 { width: 15px; height: 15px; } .square20 { width: 20px; height: 20px; } .square25 { width: 25px; height: 25px; } .square30 { width: 30px; height: 30px; } .square40 { width: 40px; height: 40px; } .square50 { width: 50px; height: 50px; } .square60 { width: 60px; height: 60px; } .square70 { width: 70px; height: 70px; } .square80 { width: 80px; height: 80px; } .square90 { width: 90px; height: 90px; } /************************************************************************************************************************************************ - HELPERS : DIVERS - ************************************************************************************************************************************************/ .asterisk { clear: both; font-size: 12px; font-style: italic; color: #666; } .noFilter { filter: none; } /* Pour IE7 et IE8 : suppression des filters qui ajoutent un overflow:hidden automatique sur l'element concerne */ .newsImage { display: flex; align-items: center; } .newsImage img { max-width: 100%; max-height: 100%; } .logoSmaller { width: 35%; margin-top: 15px; margin-bottom: 20px; } .textCenter > p { margin-bottom: 0; } .textCenter { text-align: center; } .red { color: red; } .big { font-size: x-large; } .veryBig { font-size: xx-large; } .biggerText { font-size: larger; } .turquoise { color: #2099b4; } /************************************************************************ - Loader ********************************************************************** */ .globalLoader { height: 100%; left: 0; opacity: 0.8; position: fixed; top: 0; width: 100%; z-index: 5000; } /************************************************************************************************************************************************ - HELPERS : CSS PRINT - ************************************************************************************************************************************************/ .onlyPrint { display: none !important; } @media print { .hiddenPrint { display: none !important; } .onlyPrint { display: inherit !important; } .visiblePrint { /* .visiblePrint affiche l'element en print mais n'agit pas en mode desktop ou mobile !!! Contrairement a .onlyPrint */ display: block !important; opacity: 1 !important; filter: alpha(opacity=100); } .clearPrint { float: none !important; clear: both !important; width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; padding: 0 !important; } } /************************************************************************************************************************************************ - Popins - ************************************************************************************************************************************************/ .popinMask { position: fixed; width: 100%; height: 100%; left: 0px; top: 0px; z-index: 100000001; background: black; opacity: 0.5; filter: alpha(opacity=50); } .popin { background-color: #ffffff; box-shadow: 3px 3px 10px 5px #656565; /* ou moins d'ombre => box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); */ border: 1px solid #999; border-radius: 6px; overflow: hidden; padding: 1px; /* Pour decaler le scroll vertical du bloc de contenu si le contenu est trop grand */ position: fixed; width: 560px; top: 20px; z-index: 100000002; } /* On redessine les scrollbars internes pour chrome qui les masque */ .popin ::-webkit-scrollbar { border-radius: 10px; height: 8px; width: 8px; background: GhostWhite; } .popin ::-webkit-scrollbar-thumb { background: #e1e1e1; border-radius: 10px; } /*ascenseur*/ .popin ::-webkit-scrollbar-thumb:hover { background: #e1e1e1; } .popin ::-webkit-scrollbar-button { display: none; } /*bouton bas et haut*/ .popin .popinClose { padding: 10px; position: absolute; right: 0; top: 0; z-index: 100; } .popin .popinClose .popinCloseTxt { color: #333; display: inline-block; vertical-align: middle; text-decoration: underline; } .popin .popinClose .popinCloseCross { box-sizing: border-box; margin-left: 4px; min-width: 40px; text-align: center; } .popinContent { padding: 0; } .popinHeader { clear: both; font-weight: bold; color: #282b34; padding: 0 10px; margin-top: 10px; } .popinHeader img { float: left; margin-right: 12px; } .popin .popinHeaderContext { align-items: center; border-bottom: 2px solid #e1e1e1; display: flex; min-height: 40px; padding-right: 75px; padding-bottom: 10px; } .popin .popinHeaderContext [class^="picto"], .popin .popinHeaderContext [class*=" picto"] { line-height: 40px; height: 40px; } .popinBody { box-sizing: border-box; clear: both; margin: 10px 0; overflow: auto; padding: 0 10px; position: relative; } .popinBtn { text-align: right; } .popinBtn [class^="btn"], .popinBtn [class*=" btn"] { margin-left: 10px; } /* Specificites pour les popins de Confirmation et d'Alerte : */ .popin.popinAlert .popinBody, .popin.popinConfirm .popinBody { color: #333; } .popin.popinAlert .popinFooter, .popin.popinConfirm .popinFooter { padding: 5px; }