/* Custom Style */ .quelle-offre-est-faite-pour-vous { background-color: #F7A42A; background-size: 60%; background-repeat: no-repeat; background-position: 100% center; overflow: hidden } @media(max-width: 1200px){ .quelle-offre-est-faite-pour-vous { background-size: auto 100%; } } @media(max-width: 991px){ .quelle-offre-est-faite-pour-vous { background-image: none !important; } } .quelle-offre-est-faite-pour-vous img.deco-safran { bottom: -130px; left: 40px; } .quelle-offre-est-faite-pour-vous img.deco-vanille { left: -40px; top: -130px; } .quelle-offre-est-faite-pour-vous img.deco-canl { top: -120px; right: 0; } .quelle-offre-est-faite-pour-vous .container{ background: rgb(247,211,56); background: -moz-linear-gradient(90deg, rgba(247,211,56,0) 0%, rgba(247,211,56,1) 20%, rgba(247,211,56,1) 48%, rgba(247,211,56,0) 100%); background: -webkit-linear-gradient(90deg, rgba(247,211,56,0) 0%, rgba(247,211,56,1) 20%, rgba(247,211,56,1) 48%, rgba(247,211,56,0) 100%); background: linear-gradient(90deg, rgba(247,211,56,0) 0%, rgba(247,211,56,1) 20%, rgba(247,211,56,1) 48%, rgba(247,211,56,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f7d338",endColorstr="#f7d338",GradientType=1); } .bubble p{margin:0} .bubble{background-color:#d9dcdF} .bubble.bubble-0,.bubble.bubble-4{background-color:transparent;border:1px solid #D91E3D} .bubble.bubble-1{border-radius:60px 10px 60px 60px} .bubble.bubble-0,.bubble.bubble-2{border-radius:60px 60px 10px 60px} .bubble.bubble-3{border-radius:60px 60px 60px 10px} .bubble.bubble-4{border-radius:10px 60px 60px 60px} .bubble .prenom { background-color: #D91E3D; color: white; border-radius: 20px; font-size: 14px; padding: 0 15px 4px; top: -10px; box-shadow: 0 3px 6px rgb(0,0,0,0.12); } .bubble .prenom.prenom-left{left: 0} .bubble .prenom.prenom-right{right: 0} /* KEYFRAMES */ /* Spinner Loading */ @-webkit-keyframes wd-rotate { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg) } } @keyframes wd-rotate { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg) } } .page-template-page-jeu section.header-title{position:relative;height: auto !important;} .page-template-page-jeu section.header-title::before { content: ""; position: absolute; width: 100%; height: 40%; background-color: #112f3a; top: 30%; left: 0; } .page-template-page-jeu .step{display:none;margin:0 0 120px} .page-template-page-jeu .step1{display:block;} .page-template-page-jeu label{position:relative} .page-template-page-jeu label span { position: relative; padding-left: 20px; padding-right: 40px; } .page-template-page-jeu label input{position:absolute;width:100%;height:100%;top:0;left:0;opacity:0} .page-template-page-jeu label span::after { content: ""; position: absolute; width: 8px; height: 8px; background-color: #D91C3D; border-radius: 100px; left: 2px; top: calc(50% - 4px);opacity:0; } .page-template-page-jeu label span::before { content: ""; position: absolute; width: 12px; height: 12px; border: 1px solid #D91C3D; border-radius: 100px; left: 0; top: calc(50% - 6px); } .page-template-page-jeu label input:checked ~ span::after { opacity:1; } .page-template-page-jeu p.question{font-size: 20px; color: #000; font-weight: bold;} .page-template-page-jeu p.question span { display: block; background: #D91C3D; padding: 7px 13px; color: #FFF; font-size: 10px; font-weight: 700; border-radius: 0 0 3px 3px; text-transform: uppercase; width: 100px; margin: 0 auto; } .page-template-page-jeu section.intro{padding: 60px 0 } .page-template-page-jeu section.jeu{padding: 60px 0 180px;background-image:url(../img/bg-graphique.png);background-color: #F8FAFB;} .page-template-page-jeu .step a { color: #D91C3D; font-size: 20px; position:relative; padding-left: 20px;margin:0 20px; } .page-template-page-jeu .step a::before { content: ""; position: absolute; background-image: url(../img/arrow-canl.png); background-repeat: no-repeat; background-size: 13px; background-position: left center; width: 13px; height: 100%; left: 0; display: block; top: 0; } .page-template-page-jeu .step a.back:before{transform:rotate(180deg)} .page-template-page-jeu input[type="text"], .page-template-page-jeu input[type="email"] { border: 0; border-bottom: 1px solid #D91E3D; background-color: transparent; text-align: center; font-size: 15px; width: 100%; padding: 16px 20px; margin-bottom: 30px; } .page-template-page-jeu .btn-send { background-color: #D91E3D; padding: 5px 15px 7px; border: 1px solid #D91E3D; border-radius: 2px; margin: 10px auto; transition: all 0.3s ease-in-out; display: block; color: white; width: 100px; text-align: center; } /* GLOBAL */ body { font-family: 'Lato', sans-serif; font-size: 16px; line-height: 1.6; color: #485660; font-weight: 400; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .light { font-weight: 300; font-style: normal; } .regular { font-weight: 400; font-style: normal; } .semi-bold { font-weight: 600; font-style: normal; } .bold, strong { font-weight: 700; font-style: normal; } .black { font-weight: 900; font-style: normal; } .uppercase { text-transform: uppercase; } .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { line-height: 1.3; } h1, .h1 { color: #000000; font-size: 32px; font-weight: 600; } h2, .h2 { color: #000; font-size: 30px; font-weight: 700; margin-bottom: 10px; } h2 span { font-weight: 300; } h3, .h3 { font-size: 20px; color: #D91E3D; } h3 span { color: #000000; } .h4, h4 { font-size: 20px; color: #000; font-weight: bold; } .noir { color: #000000; } .blanc { color: #FFFFFF; } .gris { color: #485660; } .gris-clair { color: #9FA8AF; } .rouge { color: #D91F3D; } .underline { text-decoration: underline; } .hidden { display: none; } .clear { clear: both; width: 100% } .flex { display: -ms-flexbox; display: flex; } .flex-center, .row.flex-center { display: -ms-flexbox; display: flex; align-items: center; } .inline-flex { display: inline-flex; } .inline-flex-center { display: inline-flex; align-items: center; } .row.row-eq-height { flex-direction: row; align-items: normal; } .block { display: block; } .inline-block { display: inline-block; } .txt-center { text-align: center; } .txt-right { text-align: right; } .txt-left { text-align: left; } .right { float: right; } img.alignright { max-width: 50%; float: right; margin: 0 0 15px 15px; } .left { float: left; } img.alignleft { max-width: 50%; float: left; margin: 0 15px 15px 0; } img.size-full { width: 100%; height: auto; } .center { margin-left: auto; margin-right: auto; } img.aligncenter { margin: 5px auto 15px; display: inline-block; } .italic { font-style: italic; } .relative { position: relative !important; } .absolute { position: absolute !important; } .fixed { position: fixed !important; } .ft18 { font-size: 18px; } .no-margin { margin: 0!important; } .no-padding { padding: 0!important; } .mb5 { margin-bottom: 5px !important; } .mb10 { margin-bottom: 10px !important; } .mb15 { margin-bottom: 15px; } .mb30 { margin-bottom: 30px; } .no-letter-spacing { letter-spacing: 0 !important; } .invisible { visibility: hidden!important; } .visible { visibility: visible!important; } .overflow-hidden { overflow: hidden; } .anim500 { -webkit-transition: all 500ms; -moz-transition: all 500ms; -o-transition: all 500ms; transition: all 500ms; } a { color: #485660; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } a, a:hover, .btn:hover { text-decoration: none; color: #485660; } a.underline:hover { text-decoration: underline; opacity: 0.8; } a.blanc.underline:hover { color: #FFFFFF; text-decoration: underline; opacity: 0.8; } :focus, a:focus, .btn:focus { outline: 0; box-shadow: none; } .btn, li.btn-menu a, a.lire-plus, .lire-plus, a.link-plus { font-size: 14px; font-weight: 400; color: #FFFFFF; display: inline-block; position: relative; } .btn-link.focus, .btn-link:focus { text-decoration: none; } .link-voir-tout, a.link-voir-tout { margin-top: 0; position: absolute; top: 0; right: 15px; font-size: 15px; z-index: 1; } a.lire-plus::before, .lire-plus::before { content: ""; position: absolute; height: 1px; width: 0; top: 0; left: 0; padding: 10px 0; border-bottom: 1px solid #485660; -webkit-transition: width 0.4s; -moz-transition: width 0.4s; transition: width 0.4s; } a.lire-plus:hover::before, .lire-plus:hover::before { width: 100%; } a.link-plus, .btn-plus { display: inline-flex; align-items: center; position: relative; } .btn { background-color: #D91E3D; padding: 5px 15px 7px; border: 1px solid #D91E3D; border-radius: 2px; margin-top: 10px; transition: all 0.3s ease-in-out; } .btn.big { padding: 3px 40px 6px 65px; border-radius: 3px; } a.btn.blanc, li.btn.blanc a, .btn.blanc { border: 1px solid #FFFFFF; color: #FFFFFF; } a.btn.gris, li.btn.gris a, .btn.gris { background-color: #485760; border: 1px solid #485760; color: #FFFFFF; } .btn:hover, li.btn-menu a:hover { background-color: #D91E3D; border-color: #D91E3D; color: #FFF; } a.link-plus:before, .btn-plus:before { content: ""; background: #FFFFFF url(../img/picto-plus.png) no-repeat scroll center center / 16.5px auto; border-radius: 50px; border: 4px solid #FFF; height: 36px; width: 36px; position: relative; box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.15); } .btn-picto { display: inline-flex; box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.1) !important; border-radius: 2px 0 0px 2px; } .btn-picto span.text { background: #FFFFFF; border-radius: 2px 0 0px 2px; color: #293136; font-size: 16px; width: 235px; position: relative; text-align: center; } .btn-picto span.text span { position: absolute; width: 100%; top: 50%; left: 50%; transform: translate(-50%,-50%); } .btn-picto span.picto { background-color: #D91C3D; border-radius: 0 2px 2px 0; position: relative; top: 0; right: 0; display: inline-flex; align-items: center; justify-content: center; height: 45px; width: 45px; } a.link-plus { -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } a.link-plus:hover { transform: scale(1.04); } a.link-plus:before { margin-right: 10px; } .btn.btn_loadmore { margin-top: 50px; } button:focus { outline: 0 none; } ul.red { list-style: none; padding: 0; margin: 0; } ul.red li::before { content: "•"; color: #E30613; display: inline-block; width: 1em; margin-left: -1em } .picto-round-white { background-color: #FFFFFF; border-radius: 50px; height: 24px; width: 24px; display: inline-flex; align-items: center; justify-content: center; transition: all 0.3s; } .width100 { width: 100% } p { margin-top: 0; margin-bottom: 15px; line-height: 1.6; } p:empty { display: none; } button:not(.toggle), .button, .faux-button, .wp-block-button__link, .wp-block-file .wp-block-file__button, input[type="button"], input[type="reset"], input[type="submit"], .bg-accent, .bg-accent-hover:hover, .bg-accent-hover:focus, :root .has-accent-background-color, .comment-reply-link { background-color: transparent; } /* Fix flexbox Bug on Safari */ .row { align-items: flex-start; } /* Checkbox / Radio Ajax */ ul.radiotags { list-style: none; margin: 0; padding: 0; } ul.radiotags li { display: inline; } ul.radiotags li input[type="radio"] { position: absolute; opacity: 0; } ul.radiotags li input[type="radio"] + label { display: inline-block; font-size: 13px; font-weight: 400; letter-spacing: 0.13em; color: #FFFFFF; text-transform: uppercase; white-space: nowrap; margin: 0 7px; padding: 5px 15px; cursor: pointer; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent; -webkit-transition: all .3s; transition: all .3s; } ul.radiotags li input[type="radio"]:checked + label { color: #FFDA31; -webkit-transition: all .3s; transition: all .3s; } .sep { width: 65px; height: 1px; background: #E30713; margin: 15px auto; } .min-desktop { display: none; } .max-tablet{ display: none; } .min-tablet { display: none; } .max-mobile-xl { display: none; } /* Swiper Slider */ .swiper-container { overflow: visible; } .swiper-button-prev { background-image: url(../img/arrow-prev-slide-projets.png); left: -80px; right: auto; } .swiper-button-next { background-image: url(../img/arrow-next-slide-projets.png); right: -80px; left: auto; } /* Picto social */ .picto-social { display: flex; align-items: center; width: 100%; } .picto-social a { font-size: 14px; margin-right: 8px; color: #FFFFFF; } .picto-social a:last-child { margin-right: 0 !important; } /* Scroll top #scrollTop { position: fixed; bottom: -60px; right: 30px; z-index: 99999; transition: bottom 0.3s ease-in-out; } */ @media (max-width: 1385px) { .swiper-button-next { right: -45px; left: auto; } .swiper-button-prev { left: -45px; right: auto; } } @media (min-width: 992px) { .min-desktop { display: block; } } @media (max-width: 991px) { body { font-size: 15px; } h1, .h1 { font-size: 27px; } h2 { font-size: 23px; } img { max-width: 100%; } .picto-round-white { height: 21px; width: 21px; } .picto-social a { font-size: 11px; } .max-tablet { display: block; } } @media (max-width: 767px) { body { font-size: 14px; } h1, h2 { text-align: center; } h3 { text-align: center; font-size: 18px; } .btn { font-size: 13px; padding: 10px 18px; } .link-voir-tout, a.link-voir-tout { bottom: -55px; top: inherit; right: 50%; transform: translateX(50%); font-size: 13px; } .max-mobile-xl { display: block; } /* #scrollTop { display: none }*/ } @media (max-width: 575px) { h2, .h2 { font-size: 25px; } h2 br { display: none; } h3 { font-size: 16px; } .h4, h4 { font-size: 19px; } .btn { font-size: 12px; } .link-voir-tout, a.link-voir-tout { font-size: 12px; } .max-mobile { display: block; } .container { padding-right: 30px; padding-left: 30px; } a.link-plus { font-size: 12px; } } @media (max-width: 450px) { .btn-picto span.text { width: 198px; } } /* HEADERS */ header#masthead { position: absolute; width: 100%; z-index: 999; } .branding-header-main { background: transparent; position: relative; height: 135px; display: -ms-flexbox; display: flex; top: 0; right: 0; left: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; } .sticky-row { width: 100%; } .sur-header { background-color: #F8FAFB; height: 30px; display: flex; align-items: center; position: relative; z-index: 1; } .sur-header .row, .header .row { align-items: center; flex-wrap: nowrap; padding: 0px 15px; position: relative; justify-content: space-between; } .sur-header .bloc-right, .sur-header .bloc-left { display: inline-flex; } .sur-header #sur-header-nav { display: inline-flex; } .sur-header .menu-sur-header-container { display: inline-flex; } .sur-header .bloc-right ul { display: inline-flex; margin: 0; padding: 0; } .sur-header .bloc-right ul li { display: inline-flex; list-style: none; padding: 0 10px; position: relative; } .sur-header .bloc-right img { margin: 0 0 0 10px; vertical-align: text-top; width: 5px; height: 9.5px; } .sur-header .bloc-right .picto-social a { margin-left: 10px; } .sur-header a, nav#sur-header-nav li a { color: #485760; font-size: 9px; font-weight: 400; letter-spacing: 0.1em; text-transform: uppercase; } .sur-header .bloc-left a.resp { display: none; } /* Header */ .header { background-color: #FFFFFF; display: flex; align-items: center; height: 105px; border-bottom: 1px solid rgba(159,168,175,0.15); } #site-logo h1 { margin: 0; } #site-logo img { width: 76px; height: 76px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } nav#desktop-nav { display: -ms-flexbox; display: flex; flex-flow: row-reverse; width: 100%; } .main-menu-more { display: none; } .main-nav ul { float: left; border-radius: 5px; list-style: none; padding: 0 30px; margin: 0; } .main-nav li { float: left; padding: 0; position: relative; } .main-nav li:after { content: ""; background: #D91F3D; width: 1px; height: 19px; position: absolute; right: 0px; top: 4px; } .main-nav li:last-child:after { display: none; } ul.menu .menu-item-has-children { padding: 0; } ul.menu .menu-item-has-children > a { padding: 0 17px 25px; } .main-nav li a { letter-spacing: 0.03em; font-size: 16px; padding: 5px 20px; } .main-nav li.menu-item.current_page_item a, .main-nav li.menu-item.current-menu-ancestor > a { color: #E30613; position: relative; } #desktop-nav a { opacity: 1; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } #desktop-nav a:hover { opacity: 0.7; } #desktop-nav li.menu-item.current_page_item a:hover { opacity: 1; } /* Sub menu */ button.submenu-expand { display: none; } li.mobile-parent-nav-menu-item { display: none !important; } header .main-nav ul.sub-menu { background: #FFF; box-shadow: 0 1px 8px -2px rgba(0,0,0,.1); position: absolute; padding: 15px 20px; top: 45px; left: -5px; width: 315px; visibility: hidden; opacity: 0; transition: all 0.3s ease; } header ul.sub-menu.active { left: 0px; visibility: visible; opacity: 1; } header ul.sub-menu li.menu-item { display: block; padding: 0 10px; line-height: 2;width: 100%; } header ul.sub-menu li.menu-item:before { background: transparent url(../img/picto-canl.png) no-repeat scroll 0 0 / 12px auto; content: ""; width: 12px; height: 12px; display: inline-block; margin-right: 8px; } header ul.sub-menu li.menu-item:after { display: none; } header ul.sub-menu li.menu-item a { font-size: 15px; padding: 0; } header ul.sub-menu li.menu-item a:before, #mobile-nav ul.sub-menu li.menu-item a:before { display: none } /* Sticky header */ .branding-header.sticky-prepared .branding-header-main { position: absolute; } .branding-header.sticked .branding-header-main { height: 110px; position: fixed; z-index: 99; } .branding-header.sticked .branding-header-main .sur-header { height: 30px; } .branding-header.sticked .branding-header-main .sur-header .picto-social a { font-size: 11px; } .branding-header.sticked .branding-header-main .sur-header .picto-social a .picto-round-white { height: 20px; width: 20px; } .branding-header.sticked .branding-header-main .sur-header .contact-lang a.contact-link { font-size: 12px; } .branding-header.sticked .branding-header-main .sur-header .contact-lang ul { right: 6.5px; bottom: 2px; } .branding-header.sticked .branding-header-main .sur-header .contact-lang ul li a { font-size: 7px; } .branding-header.sticked .branding-header-main .sur-header .contact-lang img { width: 23px; } .branding-header.sticked .branding-header-main .header { height: 80px; border: none; } .scroll-slide.scroll-down .branding-header-main, .scroll-slide.scroll-up .branding-header-main { transition: transform .4s ease, -webkit-transform .4s ease; transition: transform .4s ease, -webkit-transform .4s ease; } .sticky-shadow.sticked .branding-header-main { box-shadow: 0 1px 8px -2px rgba(0,0,0,.1); } .scroll-slide.hide-on-scroll.sticked .branding-header-main { -webkit-transform: translateY(-100%); transform: translateY(-100%); -webkit-animation: none; animation: none; } .scroll-slide.hide-on-scroll.scroll-up .branding-header-main { -webkit-transform: none; transform: none; } .sticked #site-logo img { width: 55px; height: 55px; } .sticked .main-nav li a { font-size: 15px; } /* Menu Mobile */ #mobile-nav { display: none; opacity: 0; background: #000; position: fixed; top: 0; left: -100%; text-align: center; width: 100%; z-index: 999; height: 100%; -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } #page #mobile-nav { background: rgba(11,15,18,0.95); } #mobile-nav.open { opacity: 1; left: 0; } #mobile-nav .menu-main-menu-container, #mobile-nav .menu-main-menu-en-container { width: 100%; height: 100%; } #mobile-nav ul:first-child { background-color: transparent !important; display: inline-block; float: none; margin-top: 0; position: relative; top: 50%; transform: translateY(-50%); } #mobile-nav ul li { display: block; float: none; padding: 15px; } #mobile-nav ul li a { color: #D91E3D; font-size: 14px; text-transform: uppercase; letter-spacing: 0.13em; position: relative; } #mobile-nav ul li ul.sub-menu li a { color: #FFFFFF; font-size: 15px; text-transform: inherit; letter-spacing: 0.03em; padding: 0; } #mobile-nav li.menu-item:before { display: none; } #mobile-nav ul li.menu-item-has-children > a:before { content: ""; background: transparent url(../img/arrow-menu-mobile.png) no-repeat scroll 0 0 / 9px auto; width: 9px; height: 6px; position: absolute; right: -2px; top: 6px; } #mobile-nav ul li.menu-item-has-children > a.active:before { transform: rotate(-180deg); } #mobile-nav ul.sub-menu { float: none; display: none; position: relative; top: 0; left: 0; padding: 0; width: 100% !important; } #mobile-nav .sub-menu li { font-weight: 400; font-size: 15px; padding-bottom: 0px; } #mobile-nav .btn-menu a { border-color: #FFF; } #mobile-nav .btn-menu a:hover { border-color: #00E48F; } /* Button Menu Mobile */ .navbar-toggle { background: transparent; border: 0; padding: 15px; display: inline-flex; position: absolute; top: 0; height: 105px; left: 30px; display: none; z-index: 9999; } .navbar-toggle.sticked { position: fixed; height: 105px; top: 0; } .navbar-toggle.scroll-down, .navbar-toggle.scroll-up { transition: transform .4s ease, -webkit-transform .4s ease; } .navbar-toggle.sticked { -webkit-transform: translateY(-165%); transform: translateY(-165%); -webkit-animation: none; animation: none; } .navbar-toggle.scroll-up { -webkit-transform: none; transform: none; } .navbar-toggle:focus { outline: none; } .navbar-toggle.navbar-toggle-left { float: left; margin-left: 15px; } .navbar-toggle-icon { position: relative; display: block; width: 22px; height: 14px; transform: rotate(0deg); -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; cursor: pointer; } .navbar-toggle-icon span { display: block; position: absolute; opacity: 1; left: 0; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .navbar-toggle .icon-bar { background-color: #FFF; display: block; width: 22px; height: 2px; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .sticked .navbar-toggle .icon-bar { background-color: #000; } .navbar-toggle.collapsed .icon-bar { background-color: #000; } .navbar-toggle.collapsed .icon-bar:nth-child(1) { top: 0; } .navbar-toggle.collapsed .icon-bar:nth-child(2) { top: 6px; width: 12px; left: 50%; transform: translate(-50%); } .navbar-toggle.collapsed .icon-bar:nth-child(3) { top: 12px; } .navbar-toggle:not(.collapsed) .icon-bar:nth-child(1) { top: 6px; transform: rotate(45deg); } .navbar-toggle:not(.collapsed) .icon-bar:nth-child(2) { opacity: 0; } .navbar-toggle:not(.collapsed) .icon-bar:nth-child(3) { top: 6px; transform: rotate(-45deg); } @media (max-width: 1199px) { #mobile-nav li { font-size: 16px; padding: 15px; } } @media (max-width: 991px) { .header, .branding-header.sticked .branding-header-main .header { height: 80px; } .branding-header.sticked .branding-header-main .header { box-shadow: 0 1px 8px -2px rgba(0,0,0,.1) } .sur-header .row, .header .row { justify-content: center; } .sur-header .bloc-right img { margin: 0 0 0 5px; } .sur-header .bloc-right ul li { padding: 0 5px; } .sur-header .bloc-left a { padding: 0 5px 0 0; display: none } .sur-header .bloc-left a.resp { display: block; } .contact-lang a.contact-link { font-size: 12px; } .contact-lang ul { right: 6.5px; bottom: 2px; } .contact-lang ul li a { font-size: 7px; } .contact-lang img { width: 23px; } .sticky-shadow.sticked .branding-header-main { box-shadow: none; } .branding-header-main, .branding-header.sticked .branding-header-main { height: 110px; } #site-logo { margin: 0 auto; } #site-logo img, .sticked #site-logo img { width: 50px; height: 50px; } nav#desktop-nav { display: none; } nav#mobile-nav { display: block; } .navbar-toggle, .navbar-toggle.sticked { display: block; top: 30px; height: 80px; } .main-nav li:after { display: none; } } /* MAIN */ #page-wrapper { padding-top: 135px; overflow: hidden; } section.page-container { padding: 60px 0; } .container { position: relative; } .picto-canl:before { background: transparent url(../img/picto-canl.png) no-repeat scroll 0 0 / 22px auto; content: ""; width: 22px; height: 22px; display: inline-block; margin-right: 10px; } .col-cannelle > div:before, .col-cannelle > div:after { background: rgb(187,108,7); background: -moz-linear-gradient(90deg, rgba(187,108,7,1) 0%, rgba(252,164,32,1) 100%); background: -webkit-linear-gradient(90deg, rgba(187,108,7,1) 0%, rgba(252,164,32,1) 100%); background: linear-gradient(90deg, rgba(187,108,7,1) 0%, rgba(252,164,32,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#bb6c07",endColorstr="#fca420",GradientType=1); } .col-vanille > div:before, .col-vanille > div:after { background: rgb(197,160,15); background: -moz-linear-gradient(90deg, rgba(197,160,15,1) 0%, rgba(241,205,49,1) 100%); background: -webkit-linear-gradient(90deg, rgba(197,160,15,1) 0%, rgba(241,205,49,1) 100%); background: linear-gradient(90deg, rgba(197,160,15,1) 0%, rgba(241,205,49,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#c5a00f",endColorstr="#f1cd31",GradientType=1); } .col-safran > div:before, .col-safran > div:after { background: rgb(177,61,8); background: -moz-linear-gradient(90deg, rgba(177,61,8,1) 0%, rgba(236,94,28,1) 100%); background: -webkit-linear-gradient(90deg, rgba(177,61,8,1) 0%, rgba(236,94,28,1) 100%); background: linear-gradient(90deg, rgba(177,61,8,1) 0%, rgba(236,94,28,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#b13d08",endColorstr="#ec5e1c",GradientType=1); } .col-eco > div:before, .col-eco > div:after { background: rgb(151,155,157); background: -moz-linear-gradient(90deg, rgba(151,155,157,1) 0%, rgba(189,192,195,1) 100%); background: -webkit-linear-gradient(90deg, rgba(151,155,157,1) 0%, rgba(189,192,195,1) 100%); background: linear-gradient(90deg, rgba(151,155,157,1) 0%, rgba(189,192,195,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#979b9d",endColorstr="#bdc0c3",GradientType=1); } .col-max > div:before, .col-max > div:after { background: rgb(58,72,81); background: -moz-linear-gradient(90deg, rgba(58,72,81,1) 0%, rgba(76,99,112,1) 100%); background: -webkit-linear-gradient(90deg, rgba(58,72,81,1) 0%, rgba(76,99,112,1) 100%); background: linear-gradient(90deg, rgba(58,72,81,1) 0%, rgba(76,99,112,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3a4851",endColorstr="#4c6370",GradientType=1); } .bg-canl { background: rgb(215,30,61); background: -moz-linear-gradient(90deg, rgba(215,30,61,1) 0%, rgba(168,38,60,1) 100%); background: -webkit-linear-gradient(90deg, rgba(215,30,61,1) 0%, rgba(168,38,60,1) 100%); background: linear-gradient(90deg, rgba(215,30,61,1) 0%, rgba(168,38,60,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#d71e3d",endColorstr="#a8263c",GradientType=1); } .bg-cannelle { background: rgb(187,108,7); background: -moz-linear-gradient(-90deg, rgba(187,108,7,1) 0%, rgba(252,164,32,1) 100%); background: -webkit-linear-gradient(-90deg, rgba(187,108,7,1) 0%, rgba(252,164,32,1) 100%); background: linear-gradient(-90deg, rgba(187,108,7,1) 0%, rgba(252,164,32,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#bb6c07",endColorstr="#fca420",GradientType=1); border: 0; } .bg-vanille { background: rgb(197,160,15); background: -moz-linear-gradient(-90deg, rgba(197,160,15,1) 0%, rgba(241,205,49,1) 100%); background: -webkit-linear-gradient(-90deg, rgba(197,160,15,1) 0%, rgba(241,205,49,1) 100%); background: linear-gradient(-90deg, rgba(197,160,15,1) 0%, rgba(241,205,49,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#c5a00f",endColorstr="#f1cd31",GradientType=1); border: 0; } .bg-safran { background: rgb(177,61,8); background: -moz-linear-gradient(-90deg, rgba(177,61,8,1) 0%, rgba(236,94,28,1) 100%); background: -webkit-linear-gradient(-90deg, rgba(177,61,8,1) 0%, rgba(236,94,28,1) 100%); background: linear-gradient(-90deg, rgba(177,61,8,1) 0%, rgba(236,94,28,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#b13d08",endColorstr="#ec5e1c",GradientType=1); border: 0; } .bg-eco { background: rgb(151,155,157); background: -moz-linear-gradient(-90deg, rgba(151,155,157,1) 0%, rgba(189,192,195,1) 100%); background: -webkit-linear-gradient(-90deg, rgba(151,155,157,1) 0%, rgba(189,192,195,1) 100%); background: linear-gradient(-90deg, rgba(151,155,157,1) 0%, rgba(189,192,195,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#979b9d",endColorstr="#bdc0c3",GradientType=1); border: 0; } .bg-max { background: rgb(58,72,81); background: -moz-linear-gradient(-90deg, rgba(58,72,81,1) 0%, rgba(76,99,112,1) 100%); background: -webkit-linear-gradient(-90deg, rgba(58,72,81,1) 0%, rgba(76,99,112,1) 100%); background: linear-gradient(-90deg, rgba(58,72,81,1) 0%, rgba(76,99,112,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3a4851",endColorstr="#4c6370",GradientType=1); border: 0; } .link-arrow-abo { color: #FFFFFF; font-size: 14px; display: inline-flex; padding: 10px 0; justify-content: center; align-items: center; position: relative; } .link-arrow-abo.big { font-size: 21px; } .link-arrow-abo:before { content: ""; width: 13px; height: 9px; position: absolute; left: -20px; top: 50%; transform: translateY(calc(-50% + 1px)); } .link-arrow-abo.big:before { width: 22px; height: 14px; left: -30px; } .link-arrow-canl:before { background: transparent url(../img/arrow-canl.png) no-repeat scroll 0 0 / 13px auto; } .link-arrow-cannelle:before { background: transparent url(../img/arrow-cannelle.png) no-repeat scroll 0 0 / 13px auto; } .link-arrow-cannelle.big:before { background: transparent url(../img/arrow-cannelle-big.png) no-repeat scroll 0 0 / 22px auto; } .link-arrow-vanille:before { background: transparent url(../img/arrow-vanille.png) no-repeat scroll 0 0 / 13px auto; } .link-arrow-vanille.big:before { background: transparent url(../img/arrow-vanille-big.png) no-repeat scroll 0 0 / 22px auto; } .link-arrow-safran:before { background: transparent url(../img/arrow-safran.png) no-repeat scroll 0 0 / 13px auto; } .link-arrow-safran.big:before { background: transparent url(../img/arrow-safran-big.png) no-repeat scroll 0 0 / 22px auto; } .link-arrow-eco:before { background: transparent url(../img/arrow-eco.png) no-repeat scroll 0 0 / 13px auto; } .link-arrow-eco.big:before { background: transparent url(../img/arrow-eco-big.png) no-repeat scroll 0 0 / 22px auto; } .link-arrow-max:before { background: transparent url(../img/arrow-max.png) no-repeat scroll 0 0 / 13px auto; } .link-arrow-max.big:before { background: transparent url(../img/arrow-max-big.png) no-repeat scroll 0 0 / 22px auto; } .bg-graphique { background: #F8FAFB url(../img/bg-graphique.png) no-repeat scroll center bottom / 1920px auto; } @media (min-width: 1921px) { .bg-graphique { background-size: 100% auto !important; } } @media (max-width: 991px) { #page-wrapper { padding-top: 110px; } .header-title h1 { margin-top: 30px; } } @media (max-width: 767px) { section.page-container { padding: 40px 0 50px; } #page .header-title, body.single .header-title, body.archive .header-title, body.blog .header-title { height: 175px; } .btn.big { padding: 0px 27px 3px 52px; } .link-arrow-abo { padding: 15px 0; } .link-arrow-abo.big { font-size: 17px; padding: 12px 0; } .link-arrow-cannelle.big:before, .link-arrow-vanille.big:before, .link-arrow-safran.big:before, .link-arrow-eco.big:before, .link-arrow-max.big:before { background-size: 16px auto; } .link-arrow-abo.big:before { width: 16px; height: 10px; left: -25px; } } @media (max-width: 450px) { .link-arrow-abo.big { font-size: 15px; } .btn.big { padding: 2px 20px 5px 45px; } } /* HOMEPAGE */ #header-home.header-title { display: block; margin: 0; } #header-home.header-title .slider-header-home { background-color: #f8fafb; } /* Slider Header */ #header-home.header-title .slider { height: 100%; max-height: 600px; overflow: hidden; } #header-home.header-title .slider .item { height: 520px; } #header-home.header-title .slider .bloc-text { position: absolute; text-align: center; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; max-width: 995px; padding: 15px; } #header-home.header-title .slider h3 { color: #FFFFFF; font-size: 40px; line-height: 1.4; margin-bottom: 20px; } .owl-theme .owl-dots { position: absolute; bottom: 15px; left: 50%; transform: translateX(-50%); } .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background: #FFF; } .owl-theme .owl-dots .owl-dot span { width: 14px; height: 14px; background: #FFF; position: relative; } .owl-theme .owl-dots .owl-dot span:before { content: ""; opacity: 0; width: 6px; height: 6px; background: #E30713; border-radius: 40px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 0.3s ease-in-out; } .owl-theme .owl-dots .owl-dot.active span:before { opacity: 1; } section#fil-alerte { background: #D91C3D; color: #FFF; text-align: center; padding: 20px 0; } section#fil-alerte p { margin: 0; } /* Fil d'alerte */ #fil-alerte .owl-carousel .owl-stage { display: flex; align-items: center; } #fil-alerte .owl-carousel .item { padding: 0 10px; } #fil-alerte .owl-carousel .item > a { color: #FFFFFF; } #fil-alerte .owl-carousel p { position: relative; padding-left: 35px; display: inline-block; } #fil-alerte .owl-carousel p:empty { display: none; } #fil-alerte .owl-carousel p:before { content: ""; background: transparent url(../img/picto-incident.png) no-repeat scroll center center / 23px auto; width: 23px; height: 20px; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } .navBtn { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 30px; } .navBtn div { height: 30px; width: 30px; position: absolute; cursor: pointer } #fil-alerte .navBtn .prevBtn { background: transparent url(../img/arrow-prev-white.png) no-repeat scroll center center / 9px auto; left: -40px; } #fil-alerte .navBtn .nextBtn { background: transparent url(../img/arrow-next-white.png) no-repeat scroll center center / 9px auto; right: -40px; } body.page-home h2 { font-size: 30px; } section#offre-all, section#offre-sans-engagement { background: transparent url(../img/bg-graphique.png) no-repeat scroll center bottom / 1920px auto; padding: 60px 0 180px; position: relative; } section#offre-sans-engagement { background-position: center 350px; } #offre-all:before, #offre-sans-engagement:before { content: ""; background: #F8FAFB; position: absolute; bottom: 0; left: 0; width: 100%; height: 555px; z-index: -1; } #offre-sans-engagement:before { height: 390px; } .bloc-offres { margin-top: 55px; } .col-offre { border-radius: 3px; background: #FFFFFF; text-align: center; position: relative; box-shadow: 0px 0px 10px 0 rgba(0,0,0,0.07); transition: all 0.3s ease-in-out; position: relative; } .col-offre:after { content: ""; background: transparent url(../img/shadow-col-offres.png) no-repeat scroll center center / 270px auto; position: absolute; bottom: -85px; left: 50%; width: 270px; height: 57px; transform: translateX(-50%); } .col-offre > div { display: block; padding: 37px 40px 70px; position: relative; } .col-offre > div:before { content: ""; height: 10px; width: 100%; position: absolute; left: 0; top: 0; border-radius: 3px 3px 0 0; } .offres-inet .col-offre > div { padding-top: 60px; } .col-offre .bloc-img { display: flex; align-items: center; justify-content: center; height: 27px; } .col-offre .logo-inet { position: absolute; left: 17px; top: 24px; width: 65px; height: auto; } .col-cannelle h3 { color: #FFA521; } .col-vanille h3 { color: #F7D136; } .col-safran h3 { color: #FF6722; } .col-eco h3 { color: #C7CACD; } .col-max h3 { color: #506977; } .bloc-offres h3 { font-size: 36px; font-weight: 900; margin-bottom: -5px; } .bloc-offres h4.title { color: #FFF; font-size: 10px; text-transform: uppercase; letter-spacing: 0.2em; font-weight: 900; padding: 5px 0; max-width: 93%; margin: 20px auto; } .bloc-offres h5.subtitle, .bloc-offres h5.subtitle a { font-size: 18px; color: #000; font-weight: 900; margin: 10px 0 0 0; } .bloc-offres p { font-size: 14px; color: #9FA8AF; } .bloc-offres a.show-map { font-size: 14px; color: #9FA8AF; text-decoration: underline; } .bloc-prix h4.prix { font-size: 50px; color: #D91E3D; font-weight: 900; line-height: 1; margin: 25px 0 15px; } .bloc-prix h4.prix sup { font-size: 14px; font-weight: 400; top: -30px; left: 3px; } .bloc-prix p { font-size: 12px; } .bloc-prix p span.barre { text-decoration: line-through; } .col-offre .savoir-plus { border-radius: 0 0 3px 3px; position: absolute; left: 0; bottom: 0; width: 100%; text-align: center; } .col-offre .savoir-plus a { display: block; } .asterisque { font-size: 11px; color: #9FA8AF; } .asterisque a, .asterisque a:hover { text-decoration: underline; color: #9FA8AF; } #offre-all .asterisque { position: absolute; bottom: -170px; left: 15px; } #home-actus { padding: 60px 0 100px; } #home-actus .row-actu { margin-top: 15px } #home-actus .bloc-actu a.bloc-img, #last-actus .bloc-actu a.bloc-img { position: relative; display: block; margin: 0 0 40px; } #home-actus .bloc-actu a.bloc-img img, #last-actus .bloc-actu a.bloc-img img{height: 165px;width: 100%;object-fit: cover} #home-actus .bloc-actu .date:before, #home-actus .bloc-actu .link-cat:before, #last-actus .bloc-actu .date:before, #last-actus .bloc-actu .link-cat:before { display: none; } #home-actus .bloc-actu .date, #last-actus .bloc-actu .date { position: absolute; top: 0; left: 50%; transform: translateX(-50%); background: #D91C3D; padding: 7px 13px; color: #FFF; font-size: 10px; font-weight: 700; border-radius: 0 0 3px 3px; } #home-actus .bloc-actu .btn-plus, #last-actus .bloc-actu .btn-plus { position: absolute; bottom: -17px; left: 50%; transform: translate(-50%); } #home-actus .bloc-actu h4.link-cat, #last-actus .bloc-actu h4.link-cat { margin: 10px 0 15px; padding: 0 } #home-actus .bloc-actu h3, #last-actus .bloc-actu h3 { padding: 0 10px; } @media (min-width: 1921px) { section#offre-all, section#offre-sans-engagement { background-size: 100% auto !important; } } @media (max-width: 1250px) { #header-home.header-title { height: auto; } } @media (max-width: 1199px) { .col-offre.col-safran { margin-top: 30px; } } @media (max-width: 991px) { #home-actus .row-actu > div:last-child { display: none; } } @media (max-width: 767px) { body.page-home h2 { font-size: 25px; } section#offre-all, section#offre-sans-engagement { padding: 40px 0 120px; } section#offre-sans-engagement { background-position: center bottom; } .bloc-offres { margin-top: 30px; } .col-offre.col-vanille, .col-offre.col-max { margin-top: 30px; } .page-home .bloc-offres h4.title, .page-home .bloc-offres h5.subtitle, .page-home .bloc-offres p { display: none; } .page-home .bloc-prix p { display: block; } #offre-all .asterisque { position: relative; bottom: -110px; left: 0; } #home-actus { padding: 40px 0 140px; } #home-actus .row-actu { margin-top: 0; } #home-actus .bloc-actu a.bloc-img, #last-actus .bloc-actu a.bloc-img { margin: 30px 0px 30px; } } @media (max-width: 575px) { body.page-home h2 { font-size: 25px; } .col-offre > div { padding: 37px 20px 70px; } .bloc-offres h3 { font-size: 32px; } .bloc-offres p { font-size: 12px; } .bloc-offres h4.title { font-size: 9px; } .bloc-offres h5.subtitle { font-size: 16px; } .bloc-prix h4.prix { font-size: 43px; } } /* OFFRES INTERNET */ /* Menu offres */ .menu-offres { display: flex; align-items: center; justify-content: center; height: 85px; } .menu-offres ul { padding: 0; margin: 0; } .menu-offres ul li { display: inline-block; margin: 0 15px; position: relative; } .menu-offres ul li.active:before { content: ""; width: 10px; height: 9px; position: absolute; bottom: -17px; left: 50%; transform: translateX(-50%); } .menu-offres ul li.menu-cannelle.active:before { background: transparent url(../img/arrow-menu-cannelle.png) no-repeat scroll center bottom / 10px auto; } .menu-offres ul li.menu-vanille.active:before { background: transparent url(../img/arrow-menu-vanille.png) no-repeat scroll center bottom / 10px auto; } .menu-offres ul li.menu-safran.active:before { background: transparent url(../img/arrow-menu-safran.png) no-repeat scroll center bottom / 10px auto; } .menu-offres ul li.menu-eco.active:before { background: transparent url(../img/arrow-menu-eco.png) no-repeat scroll center bottom / 10px auto; } .menu-offres ul li.menu-max.active:before { background: transparent url(../img/arrow-menu-max.png) no-repeat scroll center bottom / 10px auto; } .menu-offres ul li a { color: #FFF; font-weight: 400; letter-spacing: 0.1em; font-size: 10px; padding: 7px 15px; margin: 0; min-width: 88px; text-transform: uppercase; } #sticky-bar-abo a, #sticky-bar-abo-bottom a { display: block; } #sticky-bar-abo .link-arrow-abo, #sticky-bar-abo-bottom .link-arrow-abo { font-size: 15px; display: block; } #sticky-bar-abo .link-arrow-abo:before, #sticky-bar-abo-bottom .link-arrow-abo:before { left: 50%; transform: translate(-52px, calc(-50% + 1px)); } #sticky-bar-abo.sticked { position: fixed; top: 0; right: 0; width: 100%; z-index: 998; } #sticky-bar-abo-bottom { position: fixed; right: 0; width: 100%; z-index: 998; bottom: -54px; -webkit-transition: all 500ms; -moz-transition: all 500ms; -o-transition: all 500ms; transition: all 500ms; } #modal-abo { width: 300px; } .modal-abo { visibility: hidden; opacity: 0; } .offres-internet h2 { font-size: 44px; } /* Description */ .single-offre { padding: 60px 0 5px; position: relative; } .single-offre.just-net { padding-bottom: 0; } .single-offre h2 { margin-bottom: 15px; } .single-offre .bg-graphique { background: #F8FAFB url(../img/bg-graphique.png) no-repeat scroll center bottom / 1920px auto; height: 580px; position: absolute; top: 218px; width: 100%; } .single-offre .bloc-title-offre { margin-bottom: 60px; } .single-offre ul { margin: 55px 0 40px; padding: 0 16px 0 0; display: inline-block; } .single-offre .description ul li { font-size: 18px; margin-bottom: 30px; list-style: none; } .single-offre .img-pack-all { margin: 0 auto; display: block; } .single-offre .img-just-net { margin: -77px 0 0 -95px; } .single-offre .bloc-offres { margin-top: 0px; } .single-offre .col-offre > div { padding: 37px 40px; } .single-offre .offres-inet .col-offre > div { padding-top: 60px; margin-top: 90px; } .single-offre .col-offre > div:after { content: ""; height: 10px; width: 100%; position: absolute; left: 0; bottom: 0; border-radius: 0 0 3px 3px; } .single-offre p.asterisque { margin-top: 30px; } /* GOTV */ #gotv { background: #0b0f1a url(../img/bg-gotv.jpg) no-repeat scroll center center / 1920px auto; color: #FFFFFF; padding: 60px 0 70px; font-size: 18px } @media all and (-webkit-min-device-pixel-ratio: 1.5) { #gotv { background-image: url(../img/bg-gotv@2x.jpg); } } #gotv .bloc-title { display: inline-flex; align-items: flex-end; margin-bottom: 40px; justify-content: space-between; width: 100%; } #gotv h2 { color: #FFFFFF; line-height: 1.2; margin: 0 } #gotv .logo-gotv { } #gotv .ruban-all-screen { margin: 40px 0 25px; } img.picto-devices { margin: 10px 0; } #gotv .bloc-btn { display: grid; float: right; text-align: right; width: 175px; } #gotv .bloc-btn .btn { font-size: 14px; text-transform: none; } #gotv .slider-chaines { position: absolute; bottom: 0; right: -295px; width: 829px; } /* Popup chaines */ .modal-chaines,.modal-chaines-beIN { visibility: hidden; opacity: 0; } #liste-chaines, #liste-chaines-beIN { width: fit-content; width: -webkit-fit-content; width: -moz-fit-content; height: 100%; justify-content: center; } #bloc-chaines { margin: 10px 0; position: relative; display: flex; box-shadow: 0 12px 18px 0 rgba(0,0,0,0.35); overflow: auto; } #bloc-chaines > div { background: rgb(0,0,0); background: -moz-linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(72,72,72,0.35) 70%); background: -webkit-linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(72,72,72,0.35) 70%); background: linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(72,72,72,0.35) 70%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#484848",GradientType=1); margin: 0px 2px; border-radius: 0 0 5px 5px; position: relative; overflow: auto; } #bloc-chaines .inline-flex-center { margin: 20px 10px; width: 190px; align-items: center; justify-content: center; } #bloc-chaines h4 { background: #FFF; font-size: 14px; text-transform: uppercase; letter-spacing: 0.08em; padding: 8px 0; } #bloc-chaines ul { list-style-type: none; padding: 0; margin: 0 } #bloc-chaines ul li { color: #FFFFFF; font-size: 12px; line-height: 1.6; text-transform: uppercase; margin: 8px 0; } /* Android TV */ #box-android { padding: 80px 0; position: relative; color: #9FA8AF; } #box-android img { margin: 0 auto 40px; display: block; } #box-android .bloc-text { } #box-android h2 { margin-bottom: 35px; } #box-android p { color: #000000; font-size: 16px; } #box-android p.bold { font-size: 18px; } #box-android ul { padding: 0 0 0px 21px; margin: 35px 0 0 0; } #box-android ul li { margin-bottom: 5px; } #box-android ul li:last-child { margin-bottom: 0px; } /* Téléphonie Illimité */ #tel-illi { padding: 120px 0; } #tel-illi h2 { line-height: 1.2; } #tel-illi .bloc-text p { font-size: 18px; color: #485760; } #tel-illi .bloc-text p:first-of-type { font-size: 24px; color: #D91F3D; } #tel-illi img.plus-rouge { margin-right: 8px; } #tel-illi p a.btn { color: #FFF; font-weight: 400; letter-spacing: 0.1em; font-size: 10px; padding: 7px 15px; margin: 0 5px; min-width: 88px; text-transform: uppercase; } #tel-illi img.map-world { position: absolute; top: 50%; margin-top: -169px; right: -300px; } /* Popup Tel */ .modal-tels { visibility: hidden; opacity: 0; } #liste-pays { width: fit-content; width: -webkit-fit-content; width: -moz-fit-content; height: 100%; justify-content: center; } #tel-pays { overflow: auto; margin: 10px 0; position: relative; box-shadow: 0 12px 18px 0 rgba(0,0,0,0.35); } #tel-pays > div { background: rgb(0,0,0); background: -moz-linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(72,72,72,0.35) 70%); background: -webkit-linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(72,72,72,0.35) 70%); background: linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(72,72,72,0.35) 70%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#484848",GradientType=1); border-radius: 0 0 5px 5px; } #tel-pays .inline-flex-center { margin: 20px 10px; width: 190px; justify-content: center; } #tel-pays h4 { background: #FFF; font-size: 14px; text-transform: uppercase; letter-spacing: 0.08em; padding: 8px 0; } #tel-pays ul { list-style-type: none; padding: 0; margin: 0 } #tel-pays ul li { color: #FFFFFF; font-size: 12px; line-height: 1.6; text-transform: uppercase; margin: 8px 0; } /* Qualité prix */ #qualite-prix { padding: 0 0 190px; } #qualite-prix h2 { margin-bottom: 35px; } #qualite-prix p { font-size: 18px; color: #9FA8AF } #qualite-prix .img-qualite-prix { position: absolute; top: 50%; transform: translateY(-50%); right: -15px; } /* Sans Engagement */ #sans-engagement { background: transparent url(../img/bg-sans-engagement.png) no-repeat scroll center center / 1920px auto; height: 342px; } #sans-engagement h2 { margin-bottom: 35px; } #sans-engagement p { font-size: 18px; color: #9FA8AF; margin-bottom: 0; } .img-sans-enga1 { margin-top: -125px; } .img-sans-enga2 { position: absolute; top: -170px; left: 50%; transform: translateX(calc(-50% - 30px)); } /* Fidélité récompensée */ #fidelite { padding: 70px 0 150px; } #fidelite h2 { } #fidelite .bloc-prix { margin-bottom: 35px; } #fidelite .bloc-prix h4 { font-size: 79px; position: relative; right: -10px; margin: 25px 0; } #fidelite .bloc-prix h4 sup { font-size: 21px; top: -44px; left: 6px; } #fidelite .bloc-prix p { font-size: 18px } #fidelite .bloc-text a { font-size: 21px } @media (max-width: 1199px) { #gotv { background-size: cover; } #gotv .slider-chaines { right: -346px; } .img-sans-enga1 { margin-left: -100px; } } @media (min-width: 992px) and (max-width: 1199px) { .single-offre.just-net .bg-graphique { top: 275px; } } @media (max-width: 991px) { .single-offre { padding: 60px 0; } .single-offre .col-offre > div { margin-top: 45px; } .single-offre .img-just-net { margin: -77px 0 -25px -15px; } .single-offre .offres-inet .col-offre:after { display: none; } .single-offre .offres-inet .col-offre > div { margin-top: 45px; } #gotv { background-position: calc(50% - 290px) center; } #gotv .slider-chaines { position: relative; bottom: 0; right: 0; margin-top: 35px; width: 100%; } #qualite-prix { padding: 60px 0; } #qualite-prix .img-qualite-prix { width: 252px; height: auto; } .img-sans-enga1 { margin: 40px 0 0 0; } .img-sans-enga2 { display: none; } } @media (max-width: 767px) { #sticky-bar-abo.sticked { position: relative; } #sticky-bar-abo-bottom.sticked { bottom: 0; } .menu-offres ul li a { padding: 10px 15px; } .single-offre, #gotv, #box-android, #tel-illi { padding: 40px 0 50px; } .single-offre .bloc-title-offre { margin-bottom: 50px; } .single-offre .bg-graphique { top: 172px; } .single-offre .img-just-net { margin: -27px 0 -27px -27px; } .offres-internet h2 { font-size: 36px; } .single-offre ul { margin: 45px 0 30px; padding: 0; } .single-offre .description ul li { font-size: 16px; margin-bottom: 25px; text-align: center; } #gotv { font-size: 16px; background-position: calc(50% - 350px) center; } #gotv .bloc-title { display: block; text-align: center; margin-bottom: 30px; } #gotv h2 { margin-bottom: 30px; } #gotv .bloc-btn { display: block; float: none; margin: 0 auto 30px; text-align: center; width: auto; } #gotv p { text-align: center; } #gotv .ruban-all-screen { margin: 30px auto; display: block; } #gotv img.picto-devices { margin: 20px auto 10px; display: block; } #box-android { font-size: 16px; text-align: center; } #box-android img { width: 50%; height: auto; margin: 0 auto 30px; } #box-android h2 { margin-bottom: 20px; } #box-android .col-md-6:first-child { margin-bottom: 25px; } #box-android ul { padding: 0; margin: 0; } #box-android ul li { list-style-position: inside; } #tel-illi { text-align: center; } #tel-illi img.map-world { display: none; } #tel-illi .bloc-text p:first-of-type { font-size: 19px; } #tel-illi .bloc-text p { font-size: 16px; } #tel-illi p a.btn { padding: 10px 15px; } #fidelite { padding: 50px 0 120px; } #fidelite .bloc-prix { margin-bottom: 20px; } #fidelite .bloc-prix h4 { font-size: 55px; margin: 15px 0; } #fidelite .bloc-prix h4 sup { font-size: 15px; top: -38px; left: 3px; } #fidelite .bloc-prix p { font-size: 16px; } #modal-abo, #liste-pays, #liste-chaines { width: 90%; } #bloc-chaines { display: block; } #bloc-chaines > div { padding: 0 0 10px 0; } #tel-pays .inline-flex-center, #bloc-chaines .inline-flex-center { width: auto; display: block; margin: 0 20px; } #tel-pays > div { padding: 0 0 10px 0; } #tel-pays ul, #bloc-chainess ul { margin: 0; } #tel-pays ul li, #bloc-chaines ul li { display: inline-block; margin-right: 5px; } #qualite-prix { padding: 40px 0; text-align: center; } #qualite-prix .img-qualite-prix { display: none; } #qualite-prix h2, #sans-engagement h2 { margin-bottom: 20px; } #qualite-prix p { font-size: 16px; } #sans-engagement { background: transparent url(../img/bg-sans-engagement.png) no-repeat scroll center right / 1920px auto; height: 265px; display: flex; justify-content: center; align-items: center; text-align: center; } #sans-engagement p { font-size: 16px; } .img-sans-enga1 { display: none; } } @media (max-width: 575px) { .offres-internet h2 { font-size: 25px; } .single-offre .bg-graphique { top: 154px; } } @media (max-width: 450px) { .menu-offres ul li { margin: 0 5px; } .menu-offres ul li a { font-size: 8px; padding: 9px 10px; min-width: 65px; } .single-offre .bg-graphique { top: 168px; } .single-offre.just-net .bg-graphique { top: 183px; } .single-offre .img-just-net { margin: -25px -3px; } .single-offre .bloc-title-offre { margin-bottom: 40px; } .single-offre .description ul li { font-size: 14px; margin-bottom: 20px; } #gotv { font-size: 14px; background-position: calc(50% - 450px) center; } #box-android { font-size: 14px; } #box-android img { margin: 0 auto 20px; } #tel-illi .bloc-text p { font-size: 14px; } #tel-illi .bloc-text p:first-of-type { font-size: 16px; } #tel-illi .bloc-text p br { display: none; } #tel-illi p a.btn { font-size: 9px; padding: 7px 9px; min-width: 70px; } #fidelite { padding: 50px 0 105px; } #fidelite .bloc-prix p { font-size: 14px; } #qualite-prix p { font-size: 14px; } #sans-engagement { height: 200px; } #sans-engagement p { font-size: 14px; } } /* ASSISTANCE */ section#assistance { padding: 60px 0; } #assistance .bloc-tel { text-align: right; } #blocs_rubriques_assistance { background: #F8FAFB; padding: 55px 0 60px; } #blocs_rubriques_assistance h2 { font-size: 44px; text-align: center; margin-bottom: 50px; } #blocs_rubriques_assistance .bloc-rubrique { background: #FFFFFF; box-shadow: 0 10px 15px 0 rgba(0,0,0,0.1); height: 180px; border-radius: 3px; display: flex; align-items: center; justify-content: center; text-align: center; margin-bottom: 30px; } #blocs_rubriques_assistance h3 { color: #485760; text-transform: uppercase; font-size: 16px; font-weight: 700; margin-top: 17px; } #fil_infos_incidents { background: #FFF; padding: 55px 0 60px; } #fil_infos_incidents .bloc-title { margin-bottom: 60px; } #fil_infos_incidents h2 { font-size: 44px; text-align: center; margin-bottom: 20px; } #fil_infos_incidents h3 { color: #485660; text-align: center; font-weight: 300; } #fil_infos_incidents .fil-info { margin-bottom: 25px; padding-bottom: 25px; position: relative; } #fil_infos_incidents .fil-info:last-child { padding: 0; } #fil_infos_incidents .fil-info:after { content: ""; background-color: #485660; height: 1px; width: 50px; position: absolute; left: 0; bottom: 0; } #fil_infos_incidents .fil-info:last-child:after { display: none; } #fil_infos_incidents h4 { margin-bottom: 10px; color: #D91E3D; } #fil_infos_incidents .date { position: relative; top: 0; left: 0; transform: none; background: transparent; padding: 0; font-size: 12px; line-height: 20px; font-weight: 400; border-radius: 0; padding-left: 20px; margin-bottom: 5px; } #fil_infos_incidents .date:before { content: ""; background: transparent url(../img/picto-date.png) no-repeat scroll center bottom / 13px auto; width: 13px; height: 13px; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } #fil_infos_incidents .fil-info p { margin-bottom: 5px; } #fil_infos_incidents .fil-info p:nth-last-child(2) { margin-bottom: 0; } #map-assistance #map_assistance { height: 700px; } #map-assistance.map .infoBox > img { display: none; } /* RUBRIQUES ASSISTANCE */ #rubrique_assistance { background: #F8FAFB; padding: 55px 0 30px; text-align: center; } #rubrique_assistance .back-menu { position: absolute; display: flex; align-items: center; top: -25px; } #rubrique_assistance .back-menu a:before { content: ""; background: transparent url("../img/faq-back.png") no-repeat scroll center center / 21px auto; position: absolute; height: 21px; width: 21px; left: 0; } #rubrique_assistance .back-menu a { position: relative; color: #9FA8AF; font-size: 13px; padding-left: 30px; } #rubrique_assistance .bloc-title h2 { font-size: 44px; margin-bottom: 40px; } #rubrique_assistance .bloc-search h3 { margin-bottom: 20px; } #rubrique_assistance .bloc-search input { border: 0; border-radius: 3px; padding: 15px 25px; box-shadow: 0 3px 6px 0 rgba(0,0,0,0.1); width: 750px; margin-bottom: 50px; text-align: center; } #rubrique_assistance .sep { background: #E7E9EB; width: 100%; margin: 0; } #rubrique_assistance .sous-rubrique .bloc-title h3 { margin: 35px 0 20px; } /* Accordion */ #rubrique_assistance .accordion .card { border: 0; border-radius: 0; margin-bottom: 5px; background-color: transparent; } #rubrique_assistance .accordion .card .card-header { background: #FFFFFF; border: 0; margin: 0; padding: 0; border-radius: calc(.25rem - 1px) calc(.25rem - 1px) 0 0 !important; } #rubrique_assistance .accordion .card .accordion-body { background-color: #FCFCFC; padding: 0 25px; } #rubrique_assistance .accordion .card .card-header .accordion-question a { padding: 15px 2.3rem; display: block; position: relative; } #rubrique_assistance .accordion .card .card-header .accordion-question a h4 { margin: 0; font-size: 18px } #rubrique_assistance .accordion .card .card-header .accordion-question a i { transition: all 0.4s; color: #D91B3D; position: absolute; top: 50%; right: 15px; margin-top: -6px; } #rubrique_assistance .accordion .card .card-header .accordion-question > .collapsed > i{ transform: rotate(-90deg); } #rubrique_assistance .accordion .accordion-body .accordion-reponse p { margin: 15px 0px; padding: 0; text-align: left; color: #9FA8AF; } #rubrique_assistance .accordion .accordion-body .accordion-reponse p strong { color: #485660; } #rubrique_assistance .accordion .accordion-body .accordion-reponse p:nth-child(2) { margin-top: 20px; } #rubrique_assistance .accordion .accordion-body .accordion-reponse p:nth-last-child(2) { margin-bottom: 25px; } #rubrique_assistance .accordion .accordion-body .accordion-reponse li { text-align: left; color: #9FA8AF; } #rubrique_assistance .no-result { display: none; text-align: center; margin: 50px 0; } #slider_rubrique_assistance { background: #F8FAFB; padding: 30px 0 85px; } #slider_rubrique_assistance .bloc-rubrique { background: #FFFFFF; box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1); height: 180px; border-radius: 3px; display: flex; align-items: center; justify-content: center; text-align: center; } #slider_rubrique_assistance .slider-faq { padding: 25px 15px; overflow: hidden; } #slider_rubrique_assistance .slider-faq .owl-stage-outer { overflow: visible; } #slider_rubrique_assistance .owl-carousel .owl-item img { width: auto; display: inline-block; } #slider_rubrique_assistance h3 { color: #485760; text-transform: uppercase; font-size: 16px; font-weight: 700; margin-top: 17px; } #slider_rubrique_assistance .navBtn .prevBtn { background: transparent url(../img/arrow-slider-left.png) no-repeat scroll center center / 9px auto; left: -25px; } #slider_rubrique_assistance .navBtn .nextBtn { background: transparent url(../img/arrow-slider-right.png) no-repeat scroll center center / 9px auto; right: -25px; } @media (max-width: 767px) { section#assistance { padding: 40px 0 50px; } #assistance .bloc-tel { text-align: center; margin-top: 20px; } } @media (max-width: 450px) { #assistance { padding: 40px 0; } } /* POINTS DE VENTE */ section#pdv { padding: 60px 0; } #pdv .bloc-tel { text-align: right; } #pdv .bloc-tel .btn { margin: 0 0 0 10px; } #map-pdv #map_revendeurs { height: 700px; } .map .infoBox > img { position: absolute !important; top: 10px; right: 10px; width: 15px; height: auto; } .map .container-box { background-color: rgba(255,255,255,0.8); border-radius: 2px; color: #485760; font-size: 12px; margin-top: 0; padding: 30px 25px; text-align: center; box-shadow: 0px 3px 4px 0px rgba(0,0,0,0.05); } .map .container-box h4 { font-size: 18px; margin: 0 auto; } .map .container-box .sep { background: rgba(72,87,96,0.5); margin: 10px auto; width: 100%; } .map .container-box p { margin: 0; } .map .container-box .img-reseller { border-radius: 100%; width: 72px; height: auto; margin: 0px 0 15px; } .map .container-box p.tel-mail { font-weight: bold; color: #000000; display: inline-flex; align-items: center; justify-content: center; width: 100%; margin: 10px 0 0; } .map .container-box p.tel-mail a { color: #000000; } .map .container-box .picto { background-color: #D91C3D; width: 27px; height: 27px; display: inline-flex; align-items: center; justify-content: center; border-radius: 100%; margin: 0 8px 0 0px; } .map .container-box .picto.icon-tel img { width: 14px; height: auto; } .map .container-box .picto.icon-mail img { width: 13px; height: auto; } section#pdv-rdv { padding: 45px 0 80px; } section#pdv-rdv p { line-height: 1.8em; font-size: 18px; } @media (max-width: 767px) { section#pdv { padding: 40px 0 50px; } #pdv .bloc-tel { text-align: center; margin-top: 20px; } #pdv .bloc-tel .btn { margin: 0; } section#pdv-rdv p { line-height: 1.6; font-size: 16px; } } @media (max-width: 575px) { section#pdv-rdv { padding: 45px 0 70px; } } @media (max-width: 450px) { section#pdv { padding: 40px 0; } #pdv .bloc-tel .btn { margin: 0 0 10px 0; } section#pdv-rdv p br { display: none } } /* ACTUALITÉS */ /* Commun */ .section-actu .page-title { margin-bottom: 35px; } .section-actu .bloc-actu h4.link-cat { margin-bottom: 10px; } .section-actu .bloc-actu h4.link-cat a { font-size: 12px; color: black; } .section-actu .bloc-actu h3 { font-size: 16px; text-transform: uppercase; font-weight: 700; } .section-actu .bloc-actu h3 a { color: #000000; } .section-actu .bloc-actu p { color: #9FA8AF; margin: 0 15px 20px; } .single .section-actu .bloc-actu p { color:#485660; } .single .section-actu .bloc-actu ul li{ margin-bottom:10px; } .section-actu .infos-article { display: flex; margin-bottom: 10px; } .section-actu .bloc-actu .date:before { content: ""; background: transparent url(../img/picto-date.png) no-repeat scroll center bottom / 20px auto; width: 20px; height: 20px; position: absolute; left: 0; top: 0; } .section-actu .bloc-actu .link-cat:before { content: ""; background: transparent url(../img/picto-category.png) no-repeat scroll center bottom / 21px auto; width: 21px; height: 16px; position: absolute; left: 0; top: 0; } .section-actu .bloc-actu .date, .section-actu .bloc-actu .link-cat { position: relative; top: 0; left: 0; transform: none; background: transparent; padding: 0; color: #D91C3D; font-size: 12px; line-height: 20px; font-weight: 400; border-radius: 0; padding-left: 28px; } .section-actu .bloc-actu .link-cat { margin-left: 30px; } .section-actu .bloc-actu .link-cat a { color: #D91C3D; } /* Page Blog */ section#actualites { padding: 60px 0 120px; } #actualites .bloc-title { margin: 0 0 10px; } #actualites .bloc-actu { margin: 30px 0; } #actualites .sep { margin: 15px 0 20px; } /* Single */ section#actualite { padding: 50px 0 60px; } section#breadcrumbs { margin: 0; position: relative; } p.breadcrumbs { font-size: 13px; font-weight: 900; text-transform: uppercase; letter-spacing: 0.2em; line-height: 1.8; } body.single .bloc-title { max-width: 80%; } body.single .bloc-title h1 { margin-bottom: 30px; } body.single .bloc-img { margin-bottom: 30px; } body.single .row-cat { display: inline-flex; align-items: flex-end; position: relative; } body.single .article { margin-top: 20px; position: relative; } body.single .article h2 { font-size: 23px; font-weight: bold; margin: 25px 0 15px; } body.single .article p { margin-bottom: 10px; } body.single .article iframe { margin-top: 5px; } body.single .article ul { margin: 0 0 20px 0; padding-left: 30px; } body.single .single-post-navigation { display: flex; align-items: center; justify-content: center; margin-top: 50px; } .back-to-news a { display: flex; align-items: center; } .back-to-news a i.fa.fa-bars { color: #D91C3D; font-size: 20px; } .blog-posts-nav-btn { margin: 0 30px; } .blog-posts-nav-btn img { display: block; } /* Dernières Actus */ #last-actus { background-color: #F5F7F8; padding: 65px 0 90px; } #last-actus .other-actu { margin-bottom: 45px; } @media (max-width: 1199px) { } @media (max-width: 991px) { #actualites .bloc-actu { display: block; } .section-actu .bloc-actu h3 { margin-top: 20px; } } @media (max-width: 767px) { section#actualites { padding: 40px 0 90px; } #actualites .sep { margin: 15px auto 20px; } #actualites.section-actu .infos-article { justify-content: center; } #actualites.section-actu .bloc-actu p { text-align: center; } #actualites .btn { margin: 10px auto 0; display: table; } #actualites .btn.btn_loadmore { margin-top: 50px; display: inline-block; width: 65%; } section#actualite { padding: 40px 0 50px; } #actualite .link-voir-tout { display: none; } body.single .bloc-title { max-width: 100%; text-align: center; display: block; } body.single .article h2 { font-size: 21px; text-align: left; } #last-actus { padding: 40px 0 90px; } } /* DÉCOUVRIR CAN'L */ #about { padding: 60px 0 0; color: #9FA8AF; } #about .bloc-title { margin-bottom: 35px; } #about .img-decouvrir-canl { } #about p { padding-right: 20px; font-size: 18px } #dates { color: #9FA8AF; position: relative; padding: 75px 0 105px; margin-bottom: 20px; } #dates .bg-graphique { position: absolute; top: 50%; transform: translateY(-50%); width: 100%; height: 362px; background-position: center center; } #dates h4 { margin-bottom: 30px; } #dates .bloc-date { background-color: #FFFFFF; border-radius: 3px; box-shadow: 0 3px 6px 0 rgba(0,0,0,0.16); height: 187px; display: flex; align-items: center; padding: 25px; margin-bottom: 30px; } #dates .bloc-date .date { font-size: 30px; font-weight: bold; color: #D91E3D; display: flex; align-items: center; } #dates .bloc-date .date img { margin-right: 10px; } #dates .bloc-date p { font-size: 18px } @media (max-width: 1199px) { } @media (max-width: 991px) { #about .img-decouvrir-canl { margin-top: 20px; } } @media (max-width: 767px) { #about { padding: 40px 0 0px; } #about p { font-size: 16px; padding: 0; text-align: center; } #dates { padding: 50px 0 55px; text-align: center; } #dates .bloc-date { justify-content: center; } #dates .bloc-date .date { font-size: 27px; justify-content: center; } #dates .bloc-date p { font-size: 16px; } } @media (max-width: 450px) { #dates .bloc-date .date { font-size: 25px; } #about p { font-size: 14px; } #dates .bloc-date .date img { display: none; } #dates .bloc-date p { font-size: 14px; } } /* CONTACT */ section#contact-adresse { padding: 60px 0; } section#contact-adresse .bloc-title { padding-right: 40px; } section#contact-adresse h3 { line-height: 1.4; } #contact-adresse .boutique { position: relative; margin: 40px 0 0; } #contact-adresse .boutique h4 { } #contact-adresse .boutique p { color: #9FA8AF; font-size: 18px; } #contact-adresse .boutique .img-contact { position: absolute; top: -43px; right: -95px; z-index: 1; } .bloc-map { width: 100%; padding: 0; position: relative; z-index: -1; } #map { height: 320px; width: 100% } section#contact-tel { min-height: 385px; background-position: center -110px; } section#contact-tel .col-md-6:after { content: ""; background-color: #485760; width: 1px; height: 120px; position: absolute; top: 50%; transform: translateY(-50%); right: 0; } section#contact-tel .col-md-6:last-child:after { display: none; } section#contact-tel .btn-picto { margin: 37px 0; } section#contact-tel .horaires { font-size: 17px; } section#contact-form { padding: 60px 0 100px; } form.wpcf7-form { margin-top: 25px; } .formulaire br { display: none; } .bloc-input { margin-bottom: 30px } .wpcf7 label { display : block; margin-bottom: 30px } .wpcf7 label span.label { color: #1F3244; font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; } ::placeholder {color: #000000; opacity: 1;} .wpcf7-form-control::-webkit-input-placeholder, ::-webkit-input-placeholder { color: #000000 !important; opacity: 0.35; } .wpcf7-form-control::-moz-placeholder, *::-moz-placeholder {color: #000000 !important; opacity: 1; opacity: 0.35; } .wpcf7-form-control::-moz-placeholder, ::-moz-placeholder { color: #000000 !important; opacity: 0.35; } .wpcf7-form-control::-ms-input-placeholder, ::-ms-input-placeholder { color: #000000 !important; opacity: 0.35; } .wpcf7-form-control::-ms-input-placeholder, ::-ms-input-placeholder { color: #000000 !important; opacity: 0.35; } .form-control, .wpcf7 .wpcf7-validation-errors, .wpcf7 input[type=color], .wpcf7 input[type=date], .wpcf7 input[type=datetime-local], .wpcf7 input[type=datetime], .wpcf7 input[type=email], .wpcf7 input[type=file], .wpcf7 input[type=month], .wpcf7 input[type=number], .wpcf7 input[type=range], .wpcf7 input[type=search], .wpcf7 input[type=tel], .wpcf7 input[type=text], .wpcf7 input[type=time], .wpcf7 input[type=url], .wpcf7 input[type=week], .wpcf7 select, .wpcf7 textarea { width: 100%; padding: 16px 20px; border: none; border-bottom: 1px solid #D91E3D; outline: 0; color: #000000; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; background-color: transparent; -webkit-transition: border-color .2s ease-out; -moz-transition: border-color .2s ease-out; transition: border-color .2s ease-out; resize: none; font-size: 15px; margin-bottom: 3px; margin-top: 0; text-align: center } .form-control:focus, .wpcf7 .wpcf7-validation-errors:focus, .wpcf7 input[type=color]:focus, .wpcf7 input[type=date]:focus, .wpcf7 input[type=datetime-local]:focus, .wpcf7 input[type=datetime]:focus, .wpcf7 input[type=email]:focus, .wpcf7 input[type=file]:focus, .wpcf7 input[type=month]:focus, .wpcf7 input[type=number]:focus, .wpcf7 input[type=range]:focus, .wpcf7 input[type=search]:focus, .wpcf7 input[type=tel]:focus, .wpcf7 input[type=text]:focus, .wpcf7 input[type=time]:focus, .wpcf7 input[type=url]:focus, .wpcf7 input[type=week]:focus, .wpcf7 select:focus, .wpcf7 textarea:focus { background-color: transparent; } select { background-image: url(../img/arrow-select.png) !important; background-position: right 10px top 50%; background-size: 19px auto; background-repeat: no-repeat; -webkit-appearance: none; -moz-appearance: none; appearance: none; } select option { color: #000000; } .wpcf7-form-control.wpcf7-textarea { width: 100%; padding: 16px 20px; border: 1px solid transparent; outline: 0; color: #000000; font-family: "Open Sans",sans-serif; box-sizing: border-box; background-color: #F8FAFB; transition: border-color .2s ease-out; resize: vertical; border-radius: 5px; font-size: 16px; height: 154px; display: block; margin-bottom: 3px; } .wpcf7 textarea:focus { background-color: #F8FAFB; } div#google-captcha { display: inline-block; } .wpcf7 select:not([size]):not([multiple]), select.form-control:not([size]):not([multiple]) { height: auto; } .acceptance-conditions { margin-top: 10px; display: inline-block; } span.wpcf7-list-item { margin: 0; } .wpcf7-acceptance label span { font-size: 14px; margin-left: 5px; } .bloc-btn-submit { position: relative; margin: 20px auto; text-align: center; display: table; } .wpcf7-submit.btn { background-color: #D91E3D; margin-top: 0; } div.wpcf7 .ajax-loader { background-image: none; position: absolute; top: 50%; right: -35px; transform: translateY(-50%); width: 20px; height: 20px; margin: 0; } div.wpcf7 .ajax-loader:before { position: relative; left: 0; content: ""; display: inline-block; width: 16px; height: 16px; border: 1px solid #bbb; border-left-color: #17005d; border-radius: 50%; } div.wpcf7 .ajax-loader.is-active:before { -webkit-animation: wd-rotate 450ms infinite linear; animation: wd-rotate 450ms infinite linear; } span.wpcf7-not-valid-tip { font-size: 11px; font-weight: 300; display: block; color: #E30613; } .wpcf7 .wpcf7-response-output { background: transparent; text-align: center; width: 100%; padding: 20px; margin: 15px auto 0; border: 0; } div.wpcf7-validation-errors { } @media only screen and (max-width: 1024px) { } @media (max-width: 991px) { #contact-adresse .boutique { position: relative; margin: 40px 0; display: flex; align-items: center; justify-content: center; } #contact-adresse .boutique .img-contact { position: relative; top: 0; right: 0; margin: 0 0 0 25px; } } @media (max-width: 767px) { section#contact-adresse { padding: 40px 0 60px; } section#contact-adresse .bloc-title { padding-right: 15px; } #contact-adresse .boutique p { font-size: 16px; } section#contact-tel { background-position: center bottom; padding: 50px 0; } section#contact-tel .col-md-6:after { display: none; } section#contact-tel .infos-service-tech { margin-top: 50px; } section#contact-tel .horaires { font-size: 16px; } section#contact-tel .btn-picto { margin: 25px 0; } section#contact-form { padding: 40px 0 100px; text-align: center; } .wpcf7 label { margin-bottom: 10px; } } @media (max-width: 450px) { #contact-adresse .boutique p { font-size: 14px; } section#contact-tel .horaires { font-size: 14px; } section#contact-form { padding: 40px 0 80px; } } /* MENTIONS LEGALES */ body.privacy-policy .page-container h2 { font-weight: 900; margin: 20px 0 } body.privacy-policy .page-container h2:first-child { margin-top: 0; } body.privacy-policy .page-container h3 { font-size: 20px; font-weight: 900; margin: 15px 0 } body.privacy-policy .page-container p { margin-bottom: 15px; } body.privacy-policy .page-container ul { margin: 0 0 20px 0; padding-left: 30px; } /* COMING SOON */ #page.page-comingsoon header#masthead { display: none; } #page.page-comingsoon #page-wrapper { padding-top: 0; } #page.page-comingsoon #coming { padding: 0 0 25px; } #page.page-comingsoon #coming .top-row { background-color: #1f3444; height: 45px; width: 100%; } #page.page-comingsoon #coming img { margin-bottom: 20px } #page.page-comingsoon #coming h3 { font-size: 42px; font-weight: 600; color: #1f3444; } #page.page-comingsoon #intro { background-color: #F5F7F8; padding: 40px 0 25px; } #page.page-comingsoon #contact { padding: 40px 0; } #page.page-comingsoon #contact h2 { margin-bottom: 30px; } #page.page-comingsoon footer#wrapper-footer { background-image: none; height: 45px; } #page.page-comingsoon footer .container { display: none } @media only screen and (max-width: 991px){ #page.page-comingsoon .navbar-toggle { display: none; } } @media only screen and (max-width: 480px){ #page.page-comingsoon #coming h3 { font-size: 21px; } } /* FOOTER */ footer#wrapper-footer { position: relative; background-color: #293136; display: -ms-flexbox; display: flex; align-items: center; padding: 0 0 55px 0; color: #FFF; font-size: 14px; } #wrapper-footer h4 { font-size: 14px; color: #D91E3D; text-transform: uppercase; font-weight: 700; margin: 15px 0 5px; letter-spacing: 0.07em; } #wrapper-footer img.logo { position: relative; margin-top: -33px; margin-bottom: 20px; } #wrapper-footer .col { text-align: center; } #wrapper-footer .col:after { content: ""; background-color: #636669; width: 1px; height: 240px; position: absolute; top: 18px; right: 0; } #wrapper-footer ul { padding: 0; list-style: none; margin: 0; } #wrapper-footer ul li { padding: 13px 0; position: relative; } #wrapper-footer ul li:after { content: ""; background-color: #D91E3D; height: 1px; width: 10px; position: absolute; bottom: 0px; left: 50%; transform: translate(-50%); } #wrapper-footer .col:last-child:after { display: none; } #wrapper-footer ul li:last-child:after { display: none; } #wrapper-footer ul li.social a { padding: 0 10px; } #wrapper-footer ul li a { color: #FFF; } #wrapper-footer .picto-social { display: flex; align-items: center; width: 100%; justify-content: center; } #wrapper-footer .btn-picto { margin: 4px 0; } #wrapper-footer .btn-picto .text { font-size: 11px; width: 145px; } #wrapper-footer .btn-picto span.picto { height: 30px; width: 30px; } .sub-footer p, .sub-footer a { color: #485760; font-size: 10px; font-weight: 400; letter-spacing: 0.05em; text-transform: uppercase; margin: 0; line-height: 1.5; display: inline-flex; padding: 10px 0; } .mentions-legales { text-align: right; } .mentions-legales ul { padding: 0; margin: 0; } .mentions-legales ul li { position: relative; list-style: none; display: inline-block; padding: 0 10px; } .mentions-legales ul li:last-child { padding-right: 0; } .mentions-legales ul li:after { content: ""; background-color: #293136; width: 1px; height: 8px; position: absolute; right: -2px; top: 50%; transform: translateY(-50%); } .mentions-legales ul li:last-child:after { display: none; } @media (max-width: 1199px) { } @media (max-width: 991px) { } @media (max-width: 767px) { #wrapper-footer .btn-picto span.picto { height: 35px; } #wrapper-footer .col:last-child { margin-top: 30px; } .page-home .sub-footer, .page-offre-cannelle .sub-footer, .page-offre-vanille .sub-footer, .page-offre-safran .sub-footer, .page-offre-eco .sub-footer, .page-offre-max .sub-footer { padding: 10px 0 69px; } .sub-footer { padding: 10px 0; } .copyright, .mentions-legales { text-align: center; } .sub-footer p, .sub-footer a { padding: 0; } } @media (max-width: 575px) { footer#wrapper-footer { padding: 0 0 25px 0; } #wrapper-footer .col { flex-basis: auto; } #wrapper-footer .col:after { display: none; } #wrapper-footer .col:last-child { margin-top: 0; } } /* MENTIONS LEGALES / CGV */ #mentions-legales h2, #cgv h2 { margin-bottom: 30px } #mentions-legales h3, #cgv h3 { font-size: 20px; text-transform: uppercase; } #mentions-legales h4, #cgv h4 { font-size: 18px; font-weight: 700 } @media (max-width: 767px) { #mentions-legales h3, #cgv h3 { font-size: 19px; text-align: left; } #mentions-legales h4, #cgv h4 { font-size: 17px; } } @media (max-width: 575px) { #mentions-legales h3, #cgv h3 { font-size: 18px; } #mentions-legales h4, #cgv h4 { font-size: 16px; } } /* PAGE 404 */ section#page-404 { padding: 170px 0; } section#page-404 h2 { margin-bottom: 30px; } section#page-404 p { margin-bottom: 30px; } /* MODAL */ .close-button { background: url(../img/close.png) no-repeat scroll center center / 32px auto; height: 32px; width: 32px; display: table; margin: 15px auto 40px; } .modal-overlay, .modal-overlay2 { position: fixed; display: flex; align-items: center; justify-content: center; visibility: hidden; opacity: 0; z-index: 99999; top: 0; width: 100%; height: 100%; -webkit-transition: all 0.3s; transition: all 0.3s; } .modal-defaut { background-color: rgba(11,15,18,0.9); } .modal-canl { background: rgb(28,28,28); background: -moz-linear-gradient(90deg, rgba(28,28,28,0.9) 0%, rgba(177,36,60,0.9) 100%); background: -webkit-linear-gradient(90deg, rgba(28,28,28,0.9) 0%, rgba(177,36,60,0.9) 100%); background: linear-gradient(90deg, rgba(28,28,28,0.9) 0%, rgba(177,36,60,0.9) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1c1c1c",endColorstr="#b1243c",GradientType=1); } .modal-cannelle { background: rgb(28,28,28); background: -moz-linear-gradient(90deg, rgba(28,28,28,0.9) 0%, rgba(137,77,6,0.9) 100%); background: -webkit-linear-gradient(90deg, rgba(28,28,28,0.9) 0%, rgba(137,77,6,0.9) 100%); background: linear-gradient(90deg, rgba(28,28,28,0.9) 0%, rgba(137,77,6,0.9) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1c1c1c",endColorstr="#894d06",GradientType=1); } .modal-vanille { background: rgb(28,28,28); background: -moz-linear-gradient(90deg, rgba(28,28,28,0.9) 0%, rgba(191,164,41,0.9) 100%); background: -webkit-linear-gradient(90deg, rgba(28,28,28,0.9) 0%, rgba(191,164,41,0.9) 100%); background: linear-gradient(90deg, rgba(28,28,28,0.9) 0%, rgba(191,164,41,0.9) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1c1c1c",endColorstr="#bfa429",GradientType=1); } .modal-safran { background: rgb(28,28,28); background: -moz-linear-gradient(90deg, rgba(28,28,28,0.9) 0%, rgba(188,79,27,0.9) 100%); background: -webkit-linear-gradient(90deg, rgba(28,28,28,0.9) 0%, rgba(188,79,27,0.9) 100%); background: linear-gradient(90deg, rgba(28,28,28,0.9) 0%, rgba(188,79,27,0.9) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1c1c1c",endColorstr="#bc4f1b",GradientType=1); } .modal-eco { background: rgb(28,28,28); background: -moz-linear-gradient(90deg, rgba(28,28,28,0.9) 0%, rgba(153,156,158,0.9) 100%); background: -webkit-linear-gradient(90deg, rgba(28,28,28,0.9) 0%, rgba(153,156,158,0.9) 100%); background: linear-gradient(90deg, rgba(28,28,28,0.9) 0%, rgba(153,156,158,0.9) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1c1c1c",endColorstr="#999c9e",GradientType=1); } .modal-max { background: rgb(28,28,28); background: -moz-linear-gradient(90deg, rgba(28,28,28,0.9) 0%, rgba(63,80,90,0.9) 100%); background: -webkit-linear-gradient(90deg, rgba(28,28,28,0.9) 0%, rgba(63,80,90,0.9) 100%); background: linear-gradient(90deg, rgba(28,28,28,0.9) 0%, rgba(63,80,90,0.9) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1c1c1c",endColorstr="#3f505a",GradientType=1); } .modal-content { z-index: 999999; border: 0; top: 50%; left: 50%; transform: translate(-50%, -50%); position: fixed; background-color: transparent; text-align: center; width: inherit; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } /* Effect 1: Fade in up */ .md-effect-1 { -webkit-transform: translate(-50%, -20%); -ms-transform: translate(-50%, -20%); transform: translate(-50%, -20%); opacity: 0; } .md-show.md-effect-1, .md-show2.md-effect-1 { -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); opacity: 1; } .md-show, .md-show2 { visibility: visible; } .md-show ~ .modal-overlay, .md-show2 ~ .modal-overlay2 { opacity: 1; visibility: visible; } .modal-content h3 { font-size: 26px; color: #FFF; font-weight: bold; margin-bottom: 35px; } .modal-content h3 span { color: #FFF; } .modal-content .abo-way a { margin-bottom: 10px; } .modal-mentions { color: #9FA8AF; font-size: 12px; font-weight: 300; margin-top: 25px; } .form-rappel { max-width: 280px; margin: 0 auto; } .form-rappel form.wpcf7-form { margin-top: 0px; } .form-rappel .wpcf7 label { margin-bottom: 10px; } .form-rappel ::placeholder {color: #FFFFFF; opacity: 1;} .form-rappel .wpcf7-form-control::-webkit-input-placeholder, .form-rappel ::-webkit-input-placeholder { color: #FFFFFF !important; opacity: 0.7; } .form-rappel .wpcf7-form-control::-moz-placeholder, .form-rappel *::-moz-placeholder {color: #FFFFFF !important; opacity: 0.7; } .form-rappel .wpcf7-form-control::-moz-placeholder, .form-rappel ::-moz-placeholder { color: #FFFFFF !important; opacity: 0.7; } .form-rappel .wpcf7-form-control::-ms-input-placeholder, .form-rappel ::-ms-input-placeholder { color: #FFFFFF !important; opacity: 0.7; } .form-rappel .wpcf7-form-control::-ms-input-placeholder, .form-rappel ::-ms-input-placeholder { color: #FFFFFF !important; opacity: 0.7; } .form-rappel .wpcf7 input[type=text] { color: #FFF; border-bottom: 1px solid #FFFFFF; padding: 7px; font-size: 12px; } .form-rappel .wpcf7 .bloc-btn-submit { width: 100%; margin: 0px auto 10px; } .form-rappel .wpcf7 input[type=submit] { width: 100%; } .form-rappel span.wpcf7-not-valid-tip { color: #FFF; } .form-rappel .wpcf7 .wpcf7-response-output { padding: 5px 15px 15px 15px; margin: 0px auto; font-size: 12px; color: #FFF; } @media (max-width: 767px) { .close-button { margin: 15px auto; } .modal-content h3 { margin-top: 10px; } } /* MODAL PLUGIN */ .spu-box { box-shadow: 10px 10px 8px 0 rgba(11, 15, 18, 0.15) !important; border-radius: 3px !important; } .spu-box h2 { font-size: 26px !important; color: #D91F3D !important; font-weight: 900 !important; margin-bottom: 20px !important; } .spu-box p { color: #000000; } .spu-box .spu-content p:last-child { margin-bottom: 0; } /* COOKIE BAR */ .cookie-notice-container { padding: 12px 12px 15px 12px; } span#cn-notice-text { margin: 5px 10px; display: inline-block; } #cookie-notice .cn-button { margin: 5px 3px; display: inline-block; font-size: 10px; padding: 7px 15px; color: #FFF; } #cookie-notice .cn-button:hover { border-color: #FFFFFF; } @media (max-width: 1240px) { span#cn-notice-text { display: block; } } /* IMG RETINA */ @media all and (-webkit-min-device-pixel-ratio: 1.5) { } .page-template-page-carriere section { padding: 60px 0; } .page-template-page-carriere .post { margin: 40px 0 0; } .page-template-page-carriere .post h3{font-size: 16px; text-transform: uppercase;color: black; font-weight: 700;} .page-template-page-carriere .post .infos-article { display: flex; margin-bottom: 10px; } .page-template-page-carriere .post .infos-article .date::before { content: ""; background: transparent url(../img/picto-date.png) no-repeat scroll center bottom / 20px auto; width: 20px; height: 20px; position: absolute; left: 0; top: 0; } .page-template-page-carriere .post .infos-article .date, .page-template-page-carriere .post .infos-article .link-cat { position: relative; top: 0; left: 0; transform: none; background: transparent; padding: 0; padding-left: 0px; color: #D91C3D; font-size: 12px; line-height: 20px; font-weight: 400; border-radius: 0; padding-left: 28px; } .page-template-page-carriere .post .infos-article .link-cat { margin-left: 30px; } .page-template-page-carriere .post .infos-article .link-cat::before { content: ""; background: transparent url(../img/picto-category.png) no-repeat scroll center bottom / 21px auto; width: 21px; height: 16px; position: absolute; left: 0; top: 0; } .page-template-page-carriere .post .extrait, .page-template-page-carriere .post .detail { color: #9FA8AF; } .page-template-page-carriere .post .detail{margin-top:30px} .page-template-page-carriere .post .sep { margin: 15px 0 20px; } .page-template-page-carriere .post h4 { font-size: 18px; color: #D91C3D; } .page-template-page-carriere .post .detail .profil,.page-template-page-carriere .post .detail .profil h4{color:black} .page-template-page-carriere section.temoignages, .page-template-page-carriere section.formulaire{position:relative;background: transparent url(../img/bg-graphique.png) no-repeat scroll center bottom / 1920px auto;} .page-template-page-carriere section.temoignages::before{ content: ""; background: #F8FAFB; position: absolute; bottom: 0; left: 0; width: 100%; height: 555px; z-index: -1; } .page-template-page-carriere section.formulaire{background-color:#F8FAFB} .page-template-page-carriere #temoignages{margin-top:60px} .page-template-page-carriere #temoignages .owl-stage{display:flex} .page-template-page-carriere #temoignages .col-offre { height: calc(100% - 10px); width: calc(100% - 10px); margin-left: 5px; text-align: left; color: #9FA8AF; } .page-template-page-carriere #temoignages .col-offre img{margin-bottom:20px} .page-template-page-carriere #temoignages .col-offre strong{color:#293136} .page-template-page-carriere #temoignages .col-offre > div::before { background-color: #D91E3D; } .page-template-page-carriere #temoignages .owl-dots { display: flex; justify-content: center; } .page-template-page-carriere #temoignages .owl-dots button { border-radius: 100px; width: 10px; height: 10px; border: 1px solid #293136; margin: 5px; } .page-template-page-carriere #temoignages .owl-dots button.active{background-color:#293136;} .page-template-page-offre-tout-compris section.intro h1 br{display: none} .new-offer section.intro, .page-template-page-questionnaire-offre section.intro{padding: 30px 0} .page-template-page-offre-tout-compris.page-id-1608 section.intro{ background: rgb(247,164,42); background: -moz-linear-gradient(93deg, rgba(247,164,42,1) 0%, rgba(168,93,22,1) 100%); background: -webkit-linear-gradient(93deg, rgba(247,164,42,1) 0%, rgba(168,93,22,1) 100%); background: linear-gradient(93deg, rgba(247,164,42,1) 0%, rgba(168,93,22,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f7a42a",endColorstr="#a85d16",GradientType=1); } .page-template-page-offre-tout-compris.page-id-1644 section.intro{ background: rgb(247,211,56); background: -moz-linear-gradient(93deg, rgba(247,211,56,1) 0%, rgba(177,139,15,1) 100%); background: -webkit-linear-gradient(93deg, rgba(247,211,56,1) 0%, rgba(177,139,15,1) 100%); background: linear-gradient(93deg, rgba(247,211,56,1) 0%, rgba(177,139,15,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f7d338",endColorstr="#b18b0f",GradientType=1); } .page-template-page-offre-tout-compris.page-id-1654 section.intro{ background: rgb(236,103,46); background: -moz-linear-gradient(93deg, rgba(236,103,46,1) 0%, rgba(154,50,21,1) 100%); background: -webkit-linear-gradient(93deg, rgba(236,103,46,1) 0%, rgba(154,50,21,1) 100%); background: linear-gradient(93deg, rgba(236,103,46,1) 0%, rgba(154,50,21,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ec672e",endColorstr="#9a3215",GradientType=1); } .page-template-page-offre-tout-compris section.intro h1, .page-template-page-offre-tout-compris section.intro h3, .page-template-page-offre-tout-compris section.intro p{color: white} .page-template-page-offre-tout-compris section#formulaire .encart-titre-vertical { height: calc(100% - 37px); margin: 8px 0 0; } .page-template-page-offre-tout-compris.page-id-1608 section#formulaire .encart-titre-vertical { background: rgb(247,164,42); background: -moz-linear-gradient(93deg, rgba(247,164,42,1) 0%, rgba(168,93,22,1) 100%); background: -webkit-linear-gradient(93deg, rgba(247,164,42,1) 0%, rgba(168,93,22,1) 100%); background: linear-gradient(93deg, rgba(247,164,42,1) 0%, rgba(168,93,22,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f7a42a",endColorstr="#a85d16",GradientType=1); } .page-template-page-offre-tout-compris.page-id-1644 section#formulaire .encart-titre-vertical { background: rgb(247,211,56); background: -moz-linear-gradient(93deg, rgba(247,211,56,1) 0%, rgba(177,139,15,1) 100%); background: -webkit-linear-gradient(93deg, rgba(247,211,56,1) 0%, rgba(177,139,15,1) 100%); background: linear-gradient(93deg, rgba(247,211,56,1) 0%, rgba(177,139,15,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f7d338",endColorstr="#b18b0f",GradientType=1); } .page-template-page-offre-tout-compris.page-id-1654 section#formulaire .encart-titre-vertical{ background: rgb(236,103,46); background: -moz-linear-gradient(93deg, rgba(236,103,46,1) 0%, rgba(154,50,21,1) 100%); background: -webkit-linear-gradient(93deg, rgba(236,103,46,1) 0%, rgba(154,50,21,1) 100%); background: linear-gradient(93deg, rgba(236,103,46,1) 0%, rgba(154,50,21,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ec672e",endColorstr="#9a3215",GradientType=1); } .page-template-page-offres-a-la-carte section.intro .illus{height: 100%;width: 50%;top: 0;right: 0;background-size: cover;background-position: center} .page-template-page-offres-a-la-carte section.intro .illus:before, .page-template-page-questionnaire-offre section.intro .illus:before{ z-index: 1; content: "";position: absolute;top: 0;left: 0;height: 100%;width: 100%; background: rgb(255,255,255); background: -moz-linear-gradient(90deg, rgba(255,255,255,1) 5%, rgba(255,255,255,0) 50%); background: -webkit-linear-gradient(90deg, rgba(255,255,255,1) 5%, rgba(255,255,255,0) 50%); background: linear-gradient(90deg, rgba(255,255,255,1) 5%, rgba(255,255,255,0) 50%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#ffffff",GradientType=1); } .new-offer section.intro hr, .page-template-page-questionnaire-offre section.intro hr { border-top: 2px solid #D91E3D; width: 120px; margin: 40px 0 0; } .new-offer section#formulaire article{padding: 30px 0} section#formulaire article#options{background-color: #F8FAFB} .new-offer section#formulaire article .item { border-radius: 0 0 15px 15px; margin-bottom: 30px; width: calc(50% - 20px); background-color: white; } #alert-form .content-alert{display: none;background-color: white} #alert-form.md-show2 .content-alert{display: block} .home .new-offer section#formulaire article .item{margin-bottom: 80px} .new-offer section#formulaire article .align-items-stretch .item{min-height: auto !important} .new-offer section#formulaire article#materiel .item { width: calc(50% - 20px); } img.partenaire-club { width: calc(100% - 20px); margin-left: auto; max-width: 230px; margin-right: auto; display: block; } .new-offer section#formulaire article#materiel .item img{width: 80px} .new-offer section#formulaire article#materiel .item#wifi{width: 100%} .new-offer section#formulaire article .item h5 { text-transform: uppercase; color: white; font-weight: 800; font-size: 15px; letter-spacing: 1.5px; text-align: center; padding: 3px 5px; } .new-offer section#formulaire article .item .contenu { margin: 20px 10px 20px; } .new-offer section#formulaire article .item .contenu a { color: #D91E3D; font-size: 12px; margin-left: -20px;position: relative; } .new-offer section#formulaire article .item .contenu a::before { content: ""; position: absolute; background-image: url(../img/arrow-more.svg); width: 12px; height: 7px; left: calc(50% + 42px); top: calc(50% - 3.5px); } .new-offer section#formulaire article .item .contenu p { line-height: 1.1; } .new-offer section#formulaire article .item .contenu .detail p { font-size: 12px; } .new-offer section#formulaire article .item .contenu .texte ul { margin-top: 10px; font-size: 14px; line-height: 1.1; text-align: left; height: 130px; list-style: none; } .new-offer section#formulaire article .item .contenu .texte ul li { position: relative; margin-bottom: 3px; } .new-offer section#formulaire article .item .contenu .texte ul li::before { content: "+"; position: absolute; left: -14px; font-weight: 800; } .new-offer section#formulaire article .item#parfume .contenu .texte ul li::before{color: #F9D457} .new-offer section#formulaire article .item#epice .contenu .texte ul li::before{color: #EC672E} .new-offer section#formulaire article .item#pimente .contenu .texte ul li::before{color: #D91E3D} .new-offer section#formulaire article .item .contenu .texte ul li:nth-child(1)::before,.new-offer section#formulaire article .item .contenu .texte ul li:nth-child(2)::before{content: ""} .new-offer section#formulaire article .item .contenu .prix { font-size: 22px; font-weight: 800; margin: 8px 0 0; line-height: 1.1; } .new-offer section#formulaire article .item .contenu .detail { display: none; padding-bottom: 40px; } .new-offer section#formulaire article .item input, .new-offer section#formulaire article .item input ~ span{width: 20px;height: 20px;left: calc(50% - 10px);bottom: -10px;border: 1px solid #BCC0C3;box-shadow: inset 2px 2px 2px rgb(0,0,0,0.16)} .new-offer section#formulaire #total-cart input, .new-offer section#formulaire #total-cart input ~ span{width: 20px;height: 20px;left: 0;top: 0px;border: 1px solid #BCC0C3;box-shadow: inset 2px 2px 2px rgb(0,0,0,0.16)} .new-offer section#formulaire article .item input, .new-offer section#formulaire #total-cart input{opacity: 0;z-index: 1} .new-offer section#formulaire article .item input[type="radio"] ~ span{border-radius: 100px;background-color: white} .new-offer section#formulaire article .item input[type="radio"] ~ span:after{content: "";opacity: 0;width: 14px;height: 14px;position: absolute;background-color: #D91E3D;left: 2px;top: 2px;border-radius: 100px} .new-offer section#formulaire article .item input[type="radio"]:checked ~ span:after{opacity: 1} .new-offer section#formulaire #total-cart input[type="radio"] ~ span{border-radius: 100px;background-color: white} .new-offer section#formulaire #total-cart input[type="radio"] ~ span:after{content: "";opacity: 0;width: 14px;height: 14px;position: absolute;background-color: #D91E3D;left: 2px;top: 2px;border-radius: 100px} .new-offer section#formulaire #total-cart input[type="radio"]:checked ~ span:after{opacity: 1} .new-offer section#formulaire article .item input[type="checkbox"] ~ span{border-radius: 3px;background-color: #E9E9E9} .new-offer section#formulaire article .item input[type="checkbox"] ~ span:after{content: "";opacity: 0;width: 14px;height: 14px;position: absolute;background-image: url(../img/check.svg);background-size: contain;background-position: center;background-repeat: no-repeat;left: 3px;top: 3px} .new-offer section#formulaire article .item input[type="checkbox"]:checked ~ span:after{opacity: 1} .new-offer section#formulaire article .choices .item h5{background-color: #D91E3D} .new-offer section#formulaire article .choices .item .contenu .prix{color: #D91E3D} .new-offer section#formulaire article .options .item h5, .new-offer section#formulaire article .item#modem h5, .new-offer section#formulaire article .item#tel-france h5, .new-offer section#formulaire article .item#mobile-france h5, .new-offer section#formulaire article .item#boitier_inclus h5, .new-offer section#formulaire article .item#tel-pacific h5{background-color: #5F666A} .new-offer section#formulaire article .options .item .contenu .prix{color: #5F666A} .new-offer section#formulaire article .options .item > img { height: 70px; right: -10px; top: calc(100% - 50px); width: 100px; object-fit: contain; object-position: right bottom; } .new-offer section#formulaire article .options .item .mention { top: calc(100% + 5px); right: -10px; font-size: 10px; } .new-offer section#formulaire article .item .img .mention { top: 5px; right: 5px; color: #BCC0C3; font-size: 10px; } .new-offer section#formulaire article .item .contenu .mention { top: 0; right: 0; color: #BCC0C3; font-size: 10px; } .new-offer section#formulaire article .choices .item {border: 1px solid #D91E3D;} .new-offer section#formulaire article .choices .item#leger, .new-offer section#formulaire article .choices .item#parfume, .new-offer section#formulaire article .choices .item#epice, .new-offer section#formulaire article .choices .item#pimente {max-width: 230px;} .new-offer section#formulaire article .options .item, .new-offer section#formulaire article .item#modem, .new-offer section#formulaire article .item#tel-france, .new-offer section#formulaire article .item#mobile-france, .new-offer section#formulaire article .item#boitier_inclus, .new-offer section#formulaire article .item#tel-pacific{border: 1px solid #5F666A; } .new-offer section#formulaire article .options{display: none} .new-offer section#formulaire article#internet .choices .img { padding: 25% 0; position: relative; background-size: cover; background-position: center; background-repeat: no-repeat; } .new-offer section#formulaire article#internet .choices #modem .img{ background-size: contain; background-color: #5F666A; } .new-offer section#formulaire article#internet .choices .img::before { content: ""; width: 105px; height: 59px; position: absolute; left: calc(50% - 52.5px); top: calc(50% - 30px); } .new-offer[title='leger'] section#formulaire article#internet .choices .item, .new-offer[title='parfume'] section#formulaire article#internet .choices .item, .new-offer[title='epice'] section#formulaire article#internet .choices .item, .new-offer[title='pimente'] section#formulaire article#internet .choices .item{display: none} @media(min-width: 767px){ .new-offer[title='leger'] section#formulaire article#internet .choices .item#leger, .new-offer[title='parfume'] section#formulaire article#internet .choices .item#parfume, .new-offer[title='epice'] section#formulaire article#internet .choices .item#epice, .new-offer[title='pimente'] section#formulaire article#internet .choices .item#pimente{display: flex; width: 100% !important; max-width: 100%; align-items: stretch;} .new-offer[title='leger'] section#formulaire article#internet .choices .item#leger > div, .new-offer[title='parfume'] section#formulaire article#internet .choices .item#parfume > div, .new-offer[title='epice'] section#formulaire article#internet .choices .item#epice > div, .new-offer[title='pimente'] section#formulaire article#internet .choices .item#pimente > div{width: 50%} .new-offer[title='leger'] section#formulaire article#internet .choices .item#leger .img, .new-offer[title='parfume'] section#formulaire article#internet .choices .item#parfume .img, .new-offer[title='epice'] section#formulaire article#internet .choices .item#epice .img, .new-offer[title='pimente'] section#formulaire article#internet .choices .item#pimente .img { padding: 0;height: calc(100% - 25px); } .new-offer[title='leger'] section#formulaire article#internet .choices .item#leger input, .new-offer[title='parfume'] section#formulaire article#internet .choices .item#parfume input, .new-offer[title='epice'] section#formulaire article#internet .choices .item#epice input, .new-offer[title='pimente'] section#formulaire article#internet .choices .item#pimente input, .new-offer[title='leger'] section#formulaire article#internet .choices .item#leger span, .new-offer[title='parfume'] section#formulaire article#internet .choices .item#parfume span, .new-offer[title='epice'] section#formulaire article#internet .choices .item#epice span, .new-offer[title='pimente'] section#formulaire article#internet .choices .item#pimente span{display: none} .new-offer[title='leger'] section#formulaire article#internet .choices .item#leger ul, .new-offer[title='parfume'] section#formulaire article#internet .choices .item#parfume ul, .new-offer[title='epice'] section#formulaire article#internet .choices .item#epice ul, .new-offer[title='pimente'] section#formulaire article#internet .choices .item#pimente ul { display: flex; flex-direction: column; align-items: center; padding: 0; } } .new-offer[title='leger'] section#formulaire article .item .contenu .texte ul, .new-offer[title='parfume'] section#formulaire article .item .contenu .texte ul, .new-offer[title='epice'] section#formulaire article .item .contenu .texte ul, .new-offer[title='pimente'] section#formulaire article .item .contenu .texte ul{height: auto} .new-offer section#formulaire article#internet .choices .item#leger{border-color: #27C58D} .new-offer section#formulaire article#internet .choices .item#leger h5{background-color: #27C58D} .new-offer section#formulaire article#internet .choices .item#leger .contenu .prix{color: #27C58D} .new-offer section#formulaire article#internet .choices .item#leger input[type="radio"] ~ span:after{background-color: #27C58D;} .new-offer section#formulaire article#internet .choices .item#leger .img::before {background-image: url(../img/picto-compteur-leger.svg);} .new-offer section#formulaire article#internet .choices .item#parfume{border-color: #F9D457} .new-offer section#formulaire article#internet .choices .item#parfume h5{background-color: #F9D457} .new-offer section#formulaire article#internet .choices .item#parfume .contenu .prix{color: #F9D457} .new-offer section#formulaire article#internet .choices .item#parfume input[type="radio"] ~ span:after{background-color: #F9D457;} .new-offer section#formulaire article#internet .choices .item#parfume .img::before {background-image: url(../img/picto-compteur-parfume.svg);} .new-offer section#formulaire article#internet .choices .item#epice{border-color: #EC672E} .new-offer section#formulaire article#internet .choices .item#epice h5{background-color: #EC672E} .new-offer section#formulaire article#internet .choices .item#epice .contenu .prix{color: #EC672E} .new-offer section#formulaire article#internet .choices .item#epice input[type="radio"] ~ span:after{background-color: #EC672E;} .new-offer section#formulaire article#internet .choices .item#epice .img::before {background-image: url(../img/picto-compteur-epice.svg);} .new-offer section#formulaire article#internet .choices .item#leger .img::after, .new-offer section#formulaire article#internet .choices .item#epice .img::after, .new-offer section#formulaire article#internet .choices .item#pimente .img::after, .new-offer section#formulaire article#internet .choices .item#parfume .img::after, .home .pack-cannelle .img::after, .home .pack-vanille .img::after, .home .pack-safran .img::after { content: ""; position: absolute; background-image: url(../img/stampOPTIMO-adsl.png); background-repeat: no-repeat; width: 60px; height: 60px; background-size: contain; right: -20px; top: -20px; background-position: center; } .new-offer section#formulaire article#internet .choices .item#epice .img::after{ background-image: url(../img/stampOPTIMO-hd-thd.png); } .page-template-page-offre-tout-compris .new-offer section#formulaire article#internet .choices .item .img::after{ display: none; } .new-offer section#formulaire article#internet .choices .item#pimente .img::after { background-image: url(../img/stampOPTIMO-thd.png); } .home .pack-vanille .img::after, .home .pack-safran .img::after { background-image: url(../img/stampOPTIMO-adsl-hd-thd.png); } .new-offer section#formulaire article#internet .choices .item#parfume .img::after, .home .pack-cannelle .img::after { background-image: url(../img/stampOPTIMO-adsl-hd.png); } .new-offer section#formulaire article#internet .choices .item#pimente .img::before { background-image: url(../img/picto-compteur-pimente.svg);} .new-offer section#formulaire article .titre_option { color: #979B9E; font-size: 20px; font-weight: 700; padding: 15px 0 20px; border-top: 1px solid #979B9E; margin-top: 10px; } .new-offer section#formulaire article .titre_option::after { content: ""; position: absolute; width: 12px; height: 12px; border-top: 1px solid #979B9E; border-left: 1px solid #979B9E; top: -6px; transform: rotate(45deg); background-color: white; left: calc(50% - 6px); } .new-offer section#formulaire article#TV .choices .item img { width: calc(100% - 40px); max-width: 130px; max-height: 100px; object-fit: contain; } .new-offer section#formulaire article .item.non-merci img {width: 40px !important} .new-offer section#formulaire article .item.non-merci .contenu { height: calc(100% - 55px); display: flex; flex-direction: column; justify-content: center; align-items: center; } .new-offer section#formulaire article h4{color: #D91E3D;font-size: 26px;margin: 0} .new-offer section#formulaire #cart { background-color: white; z-index: 10; box-shadow: 5px 10px 10px rgb(0,0,0,0.2); border-radius: 0 0 25px 25px; } .new-offer section#formulaire #cart .box, .new-offer section#formulaire #cart #total-cart{ margin: 20px 25px 0; border-radius: 0 0 15px 15px; border: 1px solid #BCC0C3; } .new-offer section#formulaire #cart #total-cart{ border-color: #D91E3D; } .new-offer section#formulaire #cart .box, .new-offer section#formulaire #cart .line{display: none} .new-offer section#formulaire #cart .line h5, .new-offer section#formulaire #cart .line .prix{color: #D91E3D} .new-offer section#formulaire #cart .line.line-option h5, .new-offer section#formulaire #cart .line.line-option .prix{color: #979B9E} .new-offer section#formulaire #cart .line h5, .new-offer section#formulaire #cart .line .prix, .new-offer section#formulaire #cart #total-cart h5{font-size: 14px;font-weight: 800;margin: 0} .new-offer section#formulaire #cart #total-cart h5{font-weight: 700} .new-offer section#formulaire #cart .line#line-leger h5:before, .new-offer section#formulaire #cart .line#line-parfume h5:before, .new-offer section#formulaire #cart .line#line-epice h5:before, .new-offer section#formulaire #cart .line#line-pimente h5:before{content: "Forfait ";} .new-offer section#formulaire #cart .line.line-option h5, .new-offer section#formulaire #cart #line-modem h5, .new-offer section#formulaire #cart #line-tel-france h5, .new-offer section#formulaire #cart #line-mobile-france h5, .new-offer section#formulaire #cart #line-boitier_inclus h5, .new-offer section#formulaire #cart #line-tel-pacific h5, .new-offer section#formulaire #cart #line-modem .prix, .new-offer section#formulaire #cart #line-tel-france .prix{font-size: 12px;font-weight: 500;color: #979B9E;} .new-offer section#formulaire #cart #title-cart { background-color: #5F666A; font-size: 20px; font-weight: 700; padding: 13px; } .new-offer section#formulaire #cart h4 { background-color: #BCC0C3; font-size: 16px; font-weight: 800; letter-spacing: 1.5px; padding: 3px; } .new-offer section#formulaire #cart #total-cart h4{background-color: #D91E3D} .new-offer section#formulaire .prix sup { top: -0.5em; font-size: 60%; } .new-offer section#formulaire #cart #total-cart .prix{font-size: 18px;font-weight: 800} .new-offer section#formulaire #cart h5 p{margin: 0} .new-offer section#formulaire #cart a.btn { border-radius: 0 0 11px 11px; font-size: 15px; text-transform: uppercase; font-weight: 800; letter-spacing: 1.5px; padding: 10px; margin: 0 auto 25px; display: block; width: 130px; } .home .pack { border-radius: 0 0 15px 15px; border: 1px solid #F7A42A; margin-bottom: 50px; height: calc(100% - 50px); } .home .pack-vanille{border-color:#F7D338 } .home .pack-safran{border-color: #EC672E } .home .pack .img{} .home .pack-cannelle .img { background: rgb(247,164,42); background: -moz-linear-gradient(93deg, rgba(247,164,42,1) 0%, rgba(168,93,22,1) 100%); background: -webkit-linear-gradient(93deg, rgba(247,164,42,1) 0%, rgba(168,93,22,1) 100%); background: linear-gradient(93deg, rgba(247,164,42,1) 0%, rgba(168,93,22,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f7a42a",endColorstr="#a85d16",GradientType=1); } .home .pack-vanille .img { background: rgb(247,211,56); background: -moz-linear-gradient(93deg, rgba(247,211,56,1) 0%, rgba(177,139,15,1) 100%); background: -webkit-linear-gradient(93deg, rgba(247,211,56,1) 0%, rgba(177,139,15,1) 100%); background: linear-gradient(93deg, rgba(247,211,56,1) 0%, rgba(177,139,15,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f7d338",endColorstr="#b18b0f",GradientType=1); } .home .pack-safran .img { background: rgb(236,103,46); background: -moz-linear-gradient(93deg, rgba(236,103,46,1) 0%, rgba(154,50,21,1) 100%); background: -webkit-linear-gradient(93deg, rgba(236,103,46,1) 0%, rgba(154,50,21,1) 100%); background: linear-gradient(93deg, rgba(236,103,46,1) 0%, rgba(154,50,21,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ec672e",endColorstr="#9a3215",GradientType=1); } .home .pack .img img{width: 120px;height: 80px;margin: 10px 0;object-fit: contain;object-position: center} .home .pack h5{ text-transform: uppercase; color: white; font-weight: 800; font-size: 15px; letter-spacing: 1.5px; text-align: center; padding: 3px 5px; } .home .pack-cannelle h5{background-color: #F7A42A} .home .pack-vanille h5{background-color: #F7D338} .home .pack-safran h5{background-color: #EC672E} .home .pack .prix { font-size: 22px; font-weight: 800; line-height: 1.1; } .home .pack .prix sup { top: -0.5em; font-size: 60%; } .home .pack-cannelle .prix{color: #A85D16} .home .pack-vanille .prix{color: #B18B0F} .home .pack-safran .prix{color: #9A3215} .home .pack .contenu{padding: 15px} .home .pack .contenu .texte{line-height: 1.1;margin-bottom: 15px;} .home .pack a.btn { border-radius: 0 0 11px 11px; font-size: 15px; text-transform: uppercase; font-weight: 800; letter-spacing: 1.5px; padding: 10px; display: block; width: 130px; bottom: -45px; left: calc(50% - 65px); } .home #offres_a_la_carte{display: none} .home h2.offre{ font-size: 44px; font-weight: 200; } .home h2.offre b{font-weight: 600} .home .intro p{ font-size: 20px; line-height: 1.3; font-weight: 600; } .home .container-onglet { background-color: #EEEFF0; border-radius: 30px; font-size: 15px; text-transform: uppercase; font-weight: 800; letter-spacing: 1.1px; padding: 5px; max-width: 500px; margin: 20px auto 0; } .home .container-onglet a { background-color: transparent; padding: 10px; border-radius: 30px; width: 50%; text-align: center; } .home .container-onglet a.active { background-color: white; box-shadow: 0 0 15px rgba(0, 0, 0, 0.16); color: #D91E3D; } .home article#offres_a_la_carte a.btn { border-radius: 0 0 11px 11px; font-size: 15px; text-transform: uppercase; font-weight: 800; letter-spacing: 1.5px; padding: 10px; display: block; width: 130px; bottom: -45px;left: calc(50% - 65px); } .bg-grey{background-color:#F8FAFB} #pourquoi_nous_choisir .owl-stage { display: flex; align-items: stretch; } #pourquoi_nous_choisir .item,#home-actus .bloc-actu { margin: 0 1px; background-color: white; border-radius: 0 0 15px 15px; border: 1px solid #BCC0C3;height: 100%; } #pourquoi_nous_choisir .item h5, #home-actus .bloc-actu h3 a{ text-transform: uppercase; color: #D91E3D; text-align: center; font-size: 15px; font-weight: 800; letter-spacing: 0.5px; margin: 20Px 15px 10px; } #pourquoi_nous_choisir .item,#home-actus .bloc-actu { line-height: 1.3; font-size: 14px; color: #9FA8AF; } #pourquoi_nous_choisir .owl-nav{ display: flex; justify-content: center; } #pourquoi_nous_choisir .owl-nav button{background-image: url(../img/arrow-left-slide.svg);width: 13px;height: 30px;background-size: contain;background-cposition: center;margin: 10px;background-repeat: no-repeat;color: transparent} #pourquoi_nous_choisir .owl-nav button.owl-next{background-image: url(../img/arrow-right-slide.svg)} #questionnaire-offre { background-color: #F8FAFB; padding: 1px 0; min-height: 650px; } #questionnaire-offre h3.question small { font-size: 14px; color: #979B9E; } #questionnaire-offre h3.question::after { content: ""; background-image: url(../img/line-arrow.svg); width: 100%; height: 8px; display: block; background-position: left center; margin-top: 10px; margin-left: -10px; } #questionnaire-offre .slide-question input[type='radio'], #questionnaire-offre .slide-question input[type='checkbox']{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;opacity: 0} #questionnaire-offre .slide-question input[type='radio'] ~ span, #questionnaire-offre .slide-question input[type='checkbox'] ~ span { width: 20px; height: 20px; border-radius: 100%; border: 1px solid #BCC0C3; box-shadow: 2px 2px 2px inset rgba(0, 0, 0, 0.16); } #questionnaire-offre .slide-question input[type="radio"] ~ span::before, #questionnaire-offre .slide-question input[type="checkbox"] ~ span::before { content: ""; width: 10px; height: 10px; position: absolute; top: 4.5px; left: 4.5px; background-color: #D91E3D; opacity: 0; border-radius: 100%; } #questionnaire-offre .slide-question input[type="checkbox"] ~ span::before { border-radius: 4px; } #questionnaire-offre .slide-question input[type='radio']:checked ~ span:before, #questionnaire-offre .slide-question input[type='checkbox']:checked ~ span:before{ opacity: 1; } #questionnaire-offre .slide-question input[type='checkbox'] ~ span { border-radius: 4px; } #questionnaire-offre .slide-question label { margin-left: 20px; font-weight: bold; margin-bottom: 0; } #questionnaire-offre .slide-question .cursor { font-size: 25px; font-weight: bold;margin-top: 150px; } #questionnaire-offre .slide-question .cursor span{color: #D91E3D} #questionnaire-offre .slide-question a.btn.prev-question { padding: 0; margin-right: 10px; width: 30px; background-color: transparent; color: transparent; background-image: url(../img/arrow-prev.svg); background-repeat: no-repeat; background-position: center; } #questionnaire-offre #ending-slide a.btn.prev-question { background-color: white; border-color: white; color: #D91E3D; width: inherit; background-position: 9px center; padding: 5px 15px 7px 30px; } #questionnaire-offre .slide-question a.btn{padding-right: 10px;padding-left: 10px} .page-template-page-questionnaire-offre .reponse_offre .description br{display: none} .page-template-page-questionnaire-offre .reponse_offre { font-size: 20px;padding: 50px 0; } .page-template-page-questionnaire-offre .reponse_offre h3 { font-size: 38px; font-weight: bold; line-height: 1; margin: 0; text-transform: uppercase; } .page-template-page-questionnaire-offre article.reponse.offre-leger,.page-template-page-questionnaire-offre article.reponse.offre-leger h3{ color: #27C58D; } .page-template-page-questionnaire-offre article.reponse.offre-parfume, .page-template-page-questionnaire-offre article.reponse.offre-parfume H3, .page-template-page-questionnaire-offre article.reponse.offre-vanille,.page-template-page-questionnaire-offre article.reponse.offre-vanille h3{ color: #B18B0F; } .page-template-page-questionnaire-offre article.reponse.offre-epice, .page-template-page-questionnaire-offre article.reponse.offre-epice h3, .page-template-page-questionnaire-offre article.reponse.offre-safran, .page-template-page-questionnaire-offre article.reponse.offre-safran h3{ color: #9A3215; } .page-template-page-questionnaire-offre article.reponse.offre-pimente, .page-template-page-questionnaire-offre article.reponse.offre-pimente H3{ color: #D91E3D; } .page-template-page-questionnaire-offre .reponse_offre .description img {display: none} .page-template-page-questionnaire-offre .reponse_offre .description p { line-height: 1.3; margin: 0; } .page-template-page-questionnaire-offre .reponse_offre .description p:last-child { margin-bottom: 30px; } .upgrade_pack_tout_compris { font-size: 24px; line-height: 1.3; margin-top: 70px; } .upgrade_pack_tout_compris::before { content: ""; width: 120px; height: 2px; display: block; margin-bottom: 20px; } .upgrade_pack_tout_compris.upgrade_pack_tout_compris a.toggle { font-size: 14px; display: flex; align-items: center; } .upgrade_pack_tout_compris.upgrade_pack_tout_compris a.toggle::after { content: ""; width: 12px; height: 12px; border-left: 2px solid black; border-bottom: 2px solid black; transform: rotate(-45deg); display: block; margin-left: 10px; margin-top: -4px; } .upgrade_pack_tout_compris.upgrade_pack_tout_compris-safran, .upgrade_pack_tout_compris.upgrade_pack_tout_compris-safran a { color: #a0321a; } .upgrade_pack_tout_compris.upgrade_pack_tout_compris-safran:before{background-color: #a0321a;} .upgrade_pack_tout_compris.upgrade_pack_tout_compris-safran a.toggle::after{border-color: #a0321a;} .upgrade_pack_tout_compris.upgrade_pack_tout_compris-vanille, .upgrade_pack_tout_compris.upgrade_pack_tout_compris-vanille a { color: #B18B0F; } .upgrade_pack_tout_compris.upgrade_pack_tout_compris-vanille:before{background-color: #B18B0F;} .upgrade_pack_tout_compris.upgrade_pack_tout_compris-vanille a.toggle::after{border-color: #B18B0F;} .upgrade_pack_tout_compris strong { font-weight: 800; } .upgrade_pack_tout_compris img { width: 31px; } .upgrade_pack_tout_compris .toggled { font-size: 14px; margin-top: 10px; } .upgrade_pack_tout_compris .toggled ul { padding-left: 12px; } .upgrade_pack_tout_compris .toggled a{font-weight: 800} .page-template-page-questionnaire-offre .reponse_offre .sous-titre { font-size: 25px; text-transform: uppercase; font-weight: bold; } .page-template-page-questionnaire-offre article:before{content: "";width: 100%;height: 15px;display: block} .page-template-page-questionnaire-offre article.reponse.offre-leger:before{ background-color: #27C58D; } .page-template-page-questionnaire-offre article.reponse.offre-parfume:before{ background-color: #F9D457; } .page-template-page-questionnaire-offre article.reponse.offre-epice:before{ background-color: #EC672E; } .page-template-page-questionnaire-offre article.reponse.offre-pimente:before{ background-color: #D91E3D; } .page-template-page-questionnaire-offre article.reponse.offre-vanille:before { /* background: rgb(247,211,56); */ /* background: -moz-linear-gradient(93deg, rgba(247,211,56,1) 0%, rgba(177,139,15,1) 100%); */ /* background: -webkit-linear-gradient(93deg, rgba(247,211,56,1) 0%, rgba(177,139,15,1) 100%); */ background: linear-gradient(93deg, rgba(247,211,56,1) 0%, rgba(177,139,15,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f7d338",endColorstr="#b18b0f",GradientType=1); } .page-template-page-questionnaire-offre article.reponse.offre-safran:before { background: rgb(236,103,46); background: -moz-linear-gradient(93deg, rgba(236,103,46,1) 0%, rgba(154,50,21,1) 100%); background: -webkit-linear-gradient(93deg, rgba(236,103,46,1) 0%, rgba(154,50,21,1) 100%); background: linear-gradient(93deg, rgba(236,103,46,1) 0%, rgba(154,50,21,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ec672e",endColorstr="#9a3215",GradientType=1); } .page-template-page-questionnaire-offre .reponse_offre .detail h3{background-size: cover} .page-template-page-questionnaire-offre .reponse_offre.reponse_epice .detail h3, .page-template-page-questionnaire-offre .reponse_offre.reponse_vanille .detail h3{ background-image: url(https://canl.nc/wp-content/uploads/2023/02/epice.jpg); } .page-template-page-questionnaire-offre .reponse_offre.reponse_leger .detail h3{ background-image: url(https://canl.nc/wp-content/uploads/2023/02/leger.jpg); } .page-template-page-questionnaire-offre .reponse_offre.reponse_parfume .detail h3{ background-image: url(https://canl.nc/wp-content/uploads/2023/02/parfume.jpg); } .page-template-page-questionnaire-offre .reponse_offre.reponse_pimente .detail h3, .page-template-page-questionnaire-offre .reponse_offre.reponse_safran .detail h3{ background-image: url(https://canl.nc/wp-content/uploads/2023/02/pimente.jpg); } .page-template-page-questionnaire-offre .reponse_offre img{max-width: 100%} .page-template-page-questionnaire-offre .reponse_offre .detail { background-color: white; border-radius: 0 0 15px 15px; padding-bottom: 10px; box-shadow: 5px 10px 10Px rgba(0, 0, 0, 0.2); } .page-template-page-questionnaire-offre .reponse_offre .detail h3 { font-size: 20px; padding: 20px 0; text-align: center; color: white; } .page-template-page-questionnaire-offre .reponse_offre .detail .encart { margin: 20px 25px 0; border-radius: 0 0 15px 15px; border: 1px solid #BCC0C3; } .page-template-page-questionnaire-offre .reponse_offre .detail .encart.encart-red{border-color: #D91E3D} .page-template-page-questionnaire-offre .reponse_offre .detail .encart h4 { background-color: #BCC0C3; color: white; font-size: 16px; letter-spacing: 1px; padding: 3Px 0; } .page-template-page-questionnaire-offre .reponse_offre .detail .encart.encart-red h4{background-color: #D91E3D;} .page-template-page-questionnaire-offre .reponse_offre .detail .encart h5,.page-template-page-questionnaire-offre .reponse_offre .detail .encart .prix { font-size: 12px; font-weight: 500; color: #979B9E; } .page-template-page-questionnaire-offre .reponse_offre .detail .encart h5 p{margin: 0} .page-template-page-questionnaire-offre .reponse_offre .detail .encart .line-choice-title h5,.page-template-page-questionnaire-offre .reponse_offre .detail .encart .line-choice-title .prix{font-weight: 800;color: #D91E3D;} .page-template-page-questionnaire-offre .reponse_offre .detail .encart.encart-red h5 { font-size: 14px; font-weight: 600; color: #5F666A; } .page-template-page-questionnaire-offre .reponse_offre .detail .encart h5{max-width:calc(100% - 80px)} .page-template-page-questionnaire-offre .reponse_offre .detail .encart.encart-red .prix { font-size: 20px; font-weight: 800; color: #5F666A; } .page-template-page-questionnaire-offre .reponse_offre a.btn.discover { border-radius: 0 0 11px 11px; font-size: 15px; text-transform: uppercase; font-weight: 800; letter-spacing: 1.5px; padding: 10px; margin: 0 auto 25px; display: block; width: 130px; } .page-template-page-questionnaire-offre section.intro .illus{height: 100%;width: 50%;top: 0;right: 0;} .page-template-page-questionnaire-offre section.intro .illus div{height: 100%;width: 100%;top: 0;right: 0;background-size: cover;background-position: center} .page-template-page-questionnaire-offre section.intro { padding: 140px 0; } .page-template-page-questionnaire-offre .reponse_offre .cta{margin: 20px 0 -10px} @media(min-width: 992px){ .page-template-page-offres-a-la-carte .new-offer section#formulaire article#internet .choices .item, .home .new-offer section#formulaire article#internet .choices .item{width: calc(25% - 20px)} .page-template-page-offres-a-la-carte section#formulaire article#TV .choices .item{width: calc(33.33% - 20px)} } @media(max-width: 1199px){ .page-template-page-questionnaire-offre section.intro .illus:before{display: none} #questionnaire-offre section.intro { padding: 80px 0; } #questionnaire-offre #ending-slide a.btn.prev-question { padding: 10px 15px 10px 30px; } .page-template-page-questionnaire-offre .reponse_offre .sous-titre { font-size: 18px; } .page-template-page-questionnaire-offre .reponse_offre { font-size: 15px; } .page-template-page-questionnaire-offre .reponse_offre h3{margin-top: 10px;font-size: 30px} .reponse_offre > div > div { width: 100%; } #questionnaire-offre .img-picto-questionnaire, #questionnaire-offre .cursor img{width: 80px} #questionnaire-offre .slide-question .cursor{margin-top: 20px} .new-offer section#formulaire #cart { position: absolute !important; top: 188px !important; } .page-template-page-offre-tout-compris .new-offer section#formulaire #cart { position: absolute !important; top: 50px !important; } } @media(max-width: 991px){ .page-template-page-offre-tout-compris section.intro img{max-width: 150px} .new-offer section#formulaire #cart .box, .new-offer section#formulaire #cart .line { border-bottom: 1px solid #BCC0C3; } } @media(max-width: 767px){ .new-offer section#formulaire #cart .box, .new-offer section#formulaire #cart .line { border-bottom: 0; } .new-offer section#formulaire #cart, .page-template-page-offre-tout-compris .new-offer section#formulaire #cart { position: relative !important; width: calc(100% - 60px) !important; margin: 0 30px 80px; top: 0 !important; right: 0 !important; padding-bottom: 1px; } .new-offer section#formulaire article { padding: 40px 0; } .new-offer section#formulaire article h4 { font-size: 20px; } .new-offer section#formulaire article .item { width: calc(50% - 10px); } .new-offer section#formulaire #cart #title-cart { font-size: 18px; padding: 10px; } .page-template-page-offres-a-la-carte section.intro .illus::before, .page-template-page-questionnaire-offre section.intro .illus::before{display: none} .new-offer section.intro .illus{background-image: none !important} .new-offer section.intro { padding: 40px 0 0; } } @media(max-width: 575px){ .new-offer section#formulaire article .item { width: 100%; } .new-offer section#formulaire article.article1 .illus{display: none} }