/* Theme Name: Falcon Heavy I Author: Tuvedlacom Description: Thème personnalisé Version: 1.0 Text Domain: tuvedlacom Domain Path: /languages */ /**************************** GENERAL ****************************/ html{ overflow: auto; position: relative; scroll-behavior: smooth;} html, body{ -webkit-overflow-scrolling: touch; } body{height: 100%!important;} a{ text-decoration: underline; font-weight: bold; color:#005b5b; text-shadow: .5px 0 0; } a:hover { text-decoration: underline; } * { font-size: medium; box-sizing: border-box; } p { font-size: 1.1em; margin: 0.3em 0; line-height: 1.5; } p > * { font-size: inherit; } li { list-style-position: inside; } @media screen and (max-width: 720px){ .center{ text-align: left!important; } } img { max-width: 100%; } img.alignright { float: right; margin-left: 10px; } img.alignleft { float: left; margin-right: 10px; } .light { font-weight: 100; } .bold { font-weight: bold; text-shadow: .5px 0 0; } .black{ color:#000; } .js-link{ text-decoration: none; } .js-link:hover{ cursor: pointer; text-decoration: underline; } @media screen and (min-width: 1201px){ .container.full { max-width: inherit; width: 100%; } } @media screen and (min-width: 1201px){ .container.extralarge { max-width: 80rem; width: 100%; } } @media screen and (min-width: 1201px){ .container.large { max-width: 80rem; } } @media screen and (max-width: 1200px){ .container { width: 100%; max-width: none;} } .container{ overflow:initial; } a[href^="tel"] { color:inherit; text-decoration:none; } p > span[class^=col] { margin: 0!important; float: inherit!important; min-height: inherit!important; } /*************************** Icons ***************************/ @font-face { font-family: 'walkway'; src: url('fonts/walkway_semibold-webfont.eot'); src: url('fonts/walkway_semibold-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/walkway_semibold-webfont.woff2') format('woff2'), url('fonts/walkway_semibold-webfont.woff') format('woff'), url('fonts/walkway_semibold-webfont.ttf') format('truetype'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'walkway'; src: url('fonts/walkway_bold-webfont.eot'); src: url('fonts/walkway_bold-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/walkway_bold-webfont.woff2') format('woff2'), url('fonts/walkway_bold-webfont.woff') format('woff'), url('fonts/walkway_bold-webfont.ttf') format('truetype'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: "falconheavy"; src:url("includes/icons/falconheavy.eot"); src:url("includes/icons/falconheavy.eot?#iefix") format("embedded-opentype"), url("includes/icons/falconheavy.woff") format("woff"), url("includes/icons/falconheavy.ttf") format("truetype"), url("includes/icons/falconheavy.svg#falconheavy") format("svg"); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Glyphter'; src: url('fonts/Glyphter.eot'); src: url('fonts/Glyphter.eot?#iefix') format('embedded-opentype'), url('fonts/Glyphter.woff') format('woff'), url('fonts/Glyphter.ttf') format('truetype'), url('fonts/Glyphter.svg#Glyphter') format('svg'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'roboto'; src: url('fonts/roboto-bold-webfont.eot'); src: url('fonts/roboto-bold-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/roboto-bold-webfont.woff2') format('woff2'), url('fonts/roboto-bold-webfont.woff') format('woff'), url('fonts/roboto-bold-webfont.ttf') format('truetype'), url('fonts/roboto-bold-webfont.svg#robotobold') format('svg'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'roboto'; src: url('fonts/roboto-light-webfont.eot'); src: url('fonts/roboto-light-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/roboto-light-webfont.woff2') format('woff2'), url('fonts/roboto-light-webfont.woff') format('woff'), url('fonts/roboto-light-webfont.ttf') format('truetype'), url('fonts/roboto-light-webfont.svg#robotolight') format('svg'); font-weight: 100; font-style: normal; font-display: swap; } @font-face { font-family: 'roboto'; src: url('fonts/roboto-medium-webfont.eot'); src: url('fonts/roboto-medium-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/roboto-medium-webfont.woff2') format('woff2'), url('fonts/roboto-medium-webfont.woff') format('woff'), url('fonts/roboto-medium-webfont.ttf') format('truetype'), url('fonts/roboto-medium-webfont.svg#robotomedium') format('svg'); font-weight: normal; font-style: normal; font-display: swap; } .icon-prix2:before{content:'\0041';} .icon-plan3:before{content:'\0042';} .icon-virement:before{content:'\0043';} .icon-contrat3:before{content:'\0044';} .icon-cheque:before{content:'\0045';} .icon-cb:before{content:'\0046';} .icon-brochure3:before{content:'\0047';} .icon-ANCV:before{content:'\0048';} i.icon-nombres-chambres::before { content: ""; background-image: url(/wp-content/themes/falconheavy/images/room.png); background-size: contain; background-position: center; background-repeat: no-repeat; width: 18px; height: 18px; display: block; } #section-pdf i:before{font-family: Glyphter !important;} #section-pdf .icon-book-open:before{content:'\0047';} #section-pdf .icon-map:before{content:'\0042';} #section-pdf .icon-file:before{content:'\0044';} #section-pdf .icon-tag:before{content:'\0041';} .paiement:before{ font-family: Glyphter !important; display: block; width: 50px; height: 50px; position: absolute; left: 0; font-size: 40px; } .paiement#one:before{ content:'\0046'; } .paiement#two:before{ content:'\0043'; } .paiement#three:before{ content:'\0045'; } .paiement#four:before{ content:'\0048'; } .paiement{padding-left: 50px; position: relative;text-transform: uppercase;font-weight: bold;} [data-icon]:before { font-family: "falconheavy" !important; content: attr(data-icon); font-style: normal !important; font-weight: normal !important; font-variant: normal !important; text-transform: none !important; speak: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } [class^="icon-"]:before, [class*=" icon-"]:before { font-family: "falconheavy" !important; font-style: normal !important; font-weight: normal !important; font-variant: normal !important; text-transform: none !important; speak: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-mail:before{content:"\61"}.icon-calendar:before{content:"\62"}.icon-search:before{content:"\63"}.icon-right-open-big:before{content:"\64"}.icon-play-circle:before{content:"\65"}.icon-facebook:before{content:"\66"}.icon-google-plus:before{content:"\67"}.icon-thumbs-up:before{content:"\68"}.icon-tripadvisor:before{content:"\69"}.icon-book-open:before{content:"\6a"}.icon-map:before{content:"\6b"}.icon-file:before{content:"\6c"}.icon-tag:before{content:"\6d"}.icon-mobile:before{content:"\6e"}.icon-location:before{content:"\6f"}.icon-angle-up:before{content:"\70"}.icon-cog:before{content:"\71"}.icon-angle-down:before{content:"\72"}.icon-list-ol:before{content:"\73"}.icon-x:before{content:"\74"}.icon-checklist:before{content:"\75"}.icon-paper-plane:before{content:"\76"}.icon-hand-o-up:before{content:"\77"}.icon-rocket:before{content:"\78"}.icon-home:before{content:"\79"}.icon-comment:before{content:"\41"}.icon-quote-left:before{content:"\7a"}.icon-quote-right:before{content:"\42"}.icon-bed:before{content:"\43"}.icon-user-outline:before{content:"\45"}.icon-measure:before{content:"\44"}.icon-info-circled:before{content:"\46"}.icon-burst:before{content:"\47"}.icon-arrows-expand:before{content:"\48"}.icon-users:before{content:"\49"}.icon-water:before{content:"\4a"}.icon-television-tv:before{content:"\4d"}.icon-flame:before{content:"\4b"}.icon-zoover:before{content:"\4c"}.icon-c2b:before{content:"\4e"}.icon-caret-right:before{content:"\4f"}.icon-twitter:before{content:"\50"}.icon-pinterest:before{content:"\51"}.icon-times:before{content:"\53"}.icon-accessoires-bb:before{content:"\54"}.icon-bouilloire:before{content:"\57"}.icon-barbecue:before{content:"\58"}.icon-animalautorise:before{content:"\59"}.icon-cafetiere:before{content:"\32"}.icon-lavabo:before{content:"\35"}.icon-hotte:before{content:"\36"}.icon-handicap:before{content:"\37"}.icon-frigo:before{content:"\38"}.icon-forfaitmenage:before{content:"\39"}.icon-evier:before{content:"\21"}.icon-espresso:before{content:"\22"}.icon-dryer:before{content:"\23"}.icon-douche:before{content:"\24"}.icon-coussins-confort:before{content:"\25"}.icon-canape:before{content:"\27"}.icon-litssimples:before{content:"\28"}.icon-litssup:before{content:"\29"}.icon-maison-metres-carres:before{content:"\2b"}.icon-micro-ondes:before{content:"\2c"}.icon-mobilhome:before{content:"\2d"}.icon-nombres-chambres:before{content:"\2e"}.icon-nombres-personnes:before{content:"\2f"}.icon-oven:before{content:"\3a"}.icon-packhoteliercomplet:before{content:"\3b"}.icon-packlingecuisine:before{content:"\3c"}.icon-packlingetoilette:before{content:"\3d"}.icon-penderie:before{content:"\3e"}.icon-vaisselle:before{content:"\3f"}.icon-vacuum:before{content:"\40"}.icon-toast:before{content:"\5d"}.icon-tables-chaises:before{content:"\5e"}.icon-salledebains:before{content:"\60"}.icon-plaques:before{content:"\5c"}.icon-placard:before{content:"\e000"}.icon-washer:before{content:"\e001"}.icon-wifi:before{content:"\e002"}.icon-linkedin:before{content:"\52"}.icon-angle-right:before{content:"\55"}.icon-angle-left:before{content:"\56"}.icon-anwb:before{content:"\5a"}.icon-ancv:before{content:"\30"}.icon-alloc-familiales:before{content:"\31"}.icon-adac:before{content:"\33"}.icon-acsi:before{content:"\34"}.icon-clefverte:before{content:"\26"}.icon-camping-qualite:before{content:"\2a"}.icon-handicap-1:before{content:"\5f"}.icon-ffcc:before{content:"\7b"}.icon-regionaquitaine:before{content:"\7c"}.icon-qualite-tourisme:before{content:"\7d"}.icon-pontarcardeche:before{content:"\7e"}.icon-loireavelo:before{content:"\e003"} ul li { text-align: justify; } @media screen and (max-width: 720px){ ul {padding-inline-start: 10px!important;} } p.justify.ouvert { text-align: justify; font-size: 1em; } /****************************** SCROLLBAR ******************************/ .object-fit body:not(.mobile)::-webkit-scrollbar { width: 10px; background-color: #F5F5F5; } .object-fit body:not(.mobile)::-webkit-scrollbar-thumb { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3); } .object-fit body:not(.mobile)::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); background-color: #F5F5F5; } /****************************** BACK TO TOP ******************************/ #top{ position: absolute; top: 0; left: 0; } #back-to-top { position: fixed; bottom: 1rem; width: 3rem; height: 3rem; text-decoration: none; text-align: center; line-height: 3rem; padding-top: 5px; font-weight: bold; cursor: pointer; background: rgba(0, 91, 91, .43)!important; right: 0; border: 1px solid #fff; border-right: 0; border-radius: 15px 0 0 15px; transform: translateX(100%); z-index: 999999999; transition: 0.2s ease-out; } #back-to-top i{ font-size: x-large; color:#fff; } #back-to-top i { color: #fff; } #back-to-top:hover { background: rgba(0, 91, 91, .9)!important; text-decoration: none; } .sticky #back-to-top { transform: translateX(0%); } @media screen and (max-width: 720px){ #back-to-top { bottom: 60px; } } /******************************** Horizontal scroll mobile ********************************/ .scroll-x-title{ display: none; } @media screen and (max-width: 720px){ .scroll-x-mobile { position: relative; height: auto; overflow-x: scroll; white-space: nowrap; overflow-y: hidden; -ms-overflow-style: none; margin:0; line-height: 0; } .scroll-x-mobile [class^=col] { max-width: 450px!important; width: 90vw!important; display: inline-block; float: none!important; margin-bottom: 0!important; white-space: normal; } .scroll-x-title { display: block; margin: 0 2%; font-size: x-small; font-weight: bold; text-transform: uppercase; text-align: left; white-space: nowrap; } .scroll-x-title i{ display: inline-block; height: 22px; vertical-align: middle; position: relative; margin-left: 0.5rem; -webkit-animation: bounce 2s infinite ease-in-out; -moz-animation: bounce 2s infinite ease-in-out; -ms-animation: bounce 2s infinite ease-in-out; -o-animation: bounce 2s infinite ease-in-out; animation: bounce 2s infinite ease-in-out; } } @-webkit-keyframes bounce { 0%, 20%, 60%, 100% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); -webkit-transform: translateX(0); transform: translateX(0); } 40% { -webkit-transform: translateX(-10px); -moz-transform: translateX(-10px); -ms-transform: translateX(-10px); -o-transform: translateX(-10px); -webkit-transform: translateX(-10px); transform: translateX(-10px); } 80% { -webkit-transform: translateX(-5px); -moz-transform: translateX(-5px); -ms-transform: translateX(-5px); -o-transform: translateX(-5px); -webkit-transform: translateX(-5px); transform: translateX(-5px); } } @keyframes bounce { 0%, 20%, 60%, 100% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); -webkit-transform: translateX(0); transform: translateX(0); } 40% { -webkit-transform: translateX(-10px); -moz-transform: translateX(-10px); -ms-transform: translateX(-10px); -o-transform: translateX(-10px); -webkit-transform: translateX(-10px); transform: translateX(-10px); } 80% { -webkit-transform: translateX(-5px); -moz-transform: translateX(-5px); -ms-transform: translateX(-5px); -o-transform: translateX(-5px); -webkit-transform: translateX(-5px); transform: translateX(-5px); } } /********************* Header *********************/ #header { background-color: rgba(178,188,180,.6) !important; z-index: 999; position: fixed; width: 100%; top: 0px; padding: 0 1rem; z-index: 999; } .customize-support:not(.hide-adminbar) #header { top: 32px!important; } .customize-support.hide-adminbar{ margin-top: -32px; } .customize-support.hide-adminbar #wpadminbar{ display: none!important; } .customize-support.hide-adminbar #header { top: 0; } #header .menu > li > a:hover, #header .menu > li:hover > a, #header .menu > li.current_page_item > a, #header .menu > li.current-menu-ancestor > a, #header .menu > li .sub-menu li > a{ color: #fff!important; font-weight: 300; } #header .menu > li.current_page_item, #header .menu > li.current-menu-ancestor, #header .menu > li .sub-menu{ background-color: rgba(143,158,146,.8) !important; } #header::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #005b5b; transform: translateX(-100%); transition: 0.5s ease-out; } body.sticky #header::before { transform: translateX(0%); } body.sticky #header { box-shadow: 1px 1px 5px rgba(0,0,0,0.5); } /* Menu Desktop */ @media screen and (min-width: 800px){ #header .menu { padding: 0; margin: 0; list-style: none; text-align: center; } #header .menu > li { display: inline-block; position: relative; transition: 0.2s ease-in-out; } #header .menu > li:hover { position: relative; z-index: 2; background-color: rgba(143,158,146,.8) !important; } #header .menu > li > a { color: #fff; text-transform: uppercase; padding: 0 10px; line-height: 50px; display: block; text-decoration: none; position: relative; transition: 0.2s ease-in-out; font-weight: normal; letter-spacing: 1px; } #header .menu > li > a:hover, #header .menu > li:hover > a{ text-decoration: none; color:#fff !important; } #header .sub-menu { display: none; } #header .menu > li:hover .sub-menu { display: block!important; } #header .menu > li .sub-menu { position: absolute; text-align: left; list-style: none; padding: 0; background: #fff; z-index: 2; min-width: 250px; } #header .menu > li .sub-menu > li > a { padding: 0px 10px; display: block; transition:0.2s ease-in-out; text-decoration: none; line-height: 40px; text-transform: uppercase; border-bottom: .5px solid; font-size: medium; } body.sticky #header .menu > li .sub-menu { background-color: rgba(143,158,146,.95) !important; } body.sticky #header .menu > li .sub-menu > li > a { font-size: .9em; line-height: 30px; } #header .menu > li .sub-menu > li:hover > a { background: rgba(0, 91, 91, .43)!important; } body.sticky #header .menu > li .sub-menu > li:hover > a { background: rgba(0, 91, 91, 1)!important; } #header .menu > li .sub-menu > li:last-of-type > a { border-bottom:none; } #header .menu > li .sub-menu > li > a:hover { color:#fff; text-decoration:none } } @media screen and (max-width: 1200px) and (min-width: 800px){ #header .menu > li > a { font-size: .9rem!important; padding: 0 .25rem; } } @media screen and (max-width: 850px) and (min-width: 800px){ #header .menu > li > a { font-size: .85rem!important; } } a#tel-top span { font-weight: 300; } /* Flags */ .falconheavy-switcher{ max-height: 24px; width: 40px; overflow: hidden; position: absolute; padding: 0; right: 1rem; z-index: 4; top: 13px; } .falconheavy-switcher:after { content: "\72"; color: #fff; left: 25px; font-family: "falconheavy" !important; top: 0; position: absolute; line-height: 105px; } .falconheavy-switcher ul { padding: 0; margin: 0; } .falconheavy-switcher-item { display: block!important; } .falconheavy-flag { width: auto; height: auto; } .obf-link { text-decoration: none !important; font-family: "roboto"; font-weight: 300; color: #5f6443 !important; cursor: initial; text-shadow: unset; } .falconheavy-switcher:hover { max-height: inherit; } .falconheavy-switcher-item:not(:first-of-type) img:hover{ -webkit-transform: scale(0.9) rotate(5deg); -moz-transform: scale(0.9) rotate(5deg); -ms-transform: scale(0.9) rotate(5deg); -o-transform: scale(0.9) rotate(5deg); transform: scale(0.9) rotate(5deg); cursor: pointer; } .wpml-ls-current-language a:hover{ cursor:default!important; } /* Responsive nav */ input#burger, .book-resp, .tel-resp{ display: none; } @media screen and (min-width: 800px){ #nav-wrap label { display: none; } } @media screen and (max-width: 800px){ #header{ top: 0; left: 0; width: 100%; z-index: 9999; display: block!important; height: 50px; } #nav-container::before { content: ""; position: fixed; top: 0; left: 0; width: 100%; height: 50px; background: #005b5b; z-index: 2; } #nav-wrap input + label{ position: fixed; top: 15px; right: 15px; height: 20px; width: 2rem; z-index: 5; } #nav-wrap input + label span{ position: absolute; width: 100%; height: 3px; top: 50%; margin-top: -1px; left: 0; display: block; background: #fff; transition: .5s; } #nav-wrap input + label span:first-child{ top: 3px; } #nav-wrap input + label span:last-child{ top: 17px; } #nav-wrap label:hover{ cursor: pointer; } #nav-wrap input:checked + label span{ opacity: 0; top: 50%; } #nav-wrap input:checked + label span:first-child{ opacity: 1; -webkit-transform: rotate(405deg); -moz-transform: rotate(405deg); -ms-transform: rotate(405deg); -o-transform: rotate(405deg); transform: rotate(405deg); } #nav-wrap input:checked + label span:last-child{ opacity: 1; -webkit-transform: rotate(-405deg); -moz-transform: rotate(-405deg); -ms-transform: rotate(-405deg); -o-transform: rotate(-405deg); transform: rotate(-405deg); } #nav-wrap input ~ #nav-container{ top: 0; left: 0; width: 100%; position: relative; height: 50px; z-index: 3; transition: .2s; transition-delay: .2s; overflow: hidden; } #nav-wrap input ~ #nav-container > ul{ max-width: 22rem; text-align: left; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%); margin: 0; list-style: none; padding: 0; width: 90%; } #nav-wrap input ~ #nav-container > ul > li{ opacity: 0; transition-delay: 0s; padding: 10px 0 !important; margin:10px 0!important; width: 100%; border-bottom: 1px solid rgba(255,255,255,0.6); cursor: pointer !important; display: block; position: relative; } .menu-item-has-children:after { content: "\72"; color: #fff; right: 0; font-size: large; font-family: "falconheavy" !important; top: 0; line-height: 120px; height: 20px; position: absolute; display: block; z-index: -1; } .menu-item-has-children:hover::after { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } #nav-wrap input ~ #nav-container > ul > li > a{ padding: 0!important; } #nav-wrap input ~ #nav-container > ul ul{ position: relative; width: 100%; padding-top: 0; height: 0; opacity: 0; overflow: hidden; transition:all .2s ease-in-out .2s; } #nav-wrap input ~ #nav-container > ul ul > li > a{ font-size: 12px !important; text-transform: uppercase; margin: 0 !important; color:#fff; display: block; position: relative; line-height: 2!important; } #nav-wrap input ~ #nav-container > ul ul > li { margin: 5px 0 !important; display: block; position: relative; } #nav-wrap a, #nav-wrap a *{ text-decoration: none; line-height: 1!important; } #nav-wrap input ~ #nav-container > ul > li > a{ text-transform: uppercase; display: block; font-size: large; font-weight: bold; color: #fff!important; letter-spacing: 0.1rem; border-right: 0!important; border-bottom: 0 !important; } #nav-wrap input:checked ~ #nav-container{ height: 100%; transition-delay: 0s; position: fixed; } #nav-wrap input:checked ~ #nav-container > ul > li{ opacity: 1; transition-delay: .2s; position: relative; } #nav-wrap .sub-menu li{ display: block; float: none; } #nav-wrap .sub-menu li a{ width: auto; min-width: 100px; padding: 0 20px; } #nav-wrap .menu-item-has-children:hover .sub-menu { height: 100%!important; padding-top: 10px!important; overflow: visible!important; opacity: 1!important; } } @media screen and (max-width: 500px){ #nav-wrap input ~ #nav-container > ul > li { margin: .25rem!important; } #nav-wrap input ~ #nav-container > ul > li > a { font-size: small; } } /* contact top */ #contact-top { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); left: 1rem; z-index: 4; } #contact-top-right{ position: absolute; right: 1rem; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); height: 50px; } #mail-top{ width: 50px !important; height: 50px !important; background:transparent!important; } #mail-top i{ font-size: 2rem !important; line-height: 58px !important; } #tel-top { display: inline-block; vertical-align: middle; color: #fff; transition: 0.2s ease-in-out; width: auto!important; height: auto!important; border: none!important; line-height: 50px !important; padding: 0 3rem 0 1rem!important; } #client-top { display: inline-block; vertical-align: middle; color: #fff; transition: 0.2s ease-in-out; width: auto!important; height: auto!important; border: none!important; line-height: 50px !important; padding: 0 1rem!important; background-color: #005b5b; text-decoration: none; } #client-top span { color: #fff; line-height: 1; } #tel-top i { display: none; } #tel-top span { color: #fff; line-height: 1; } #contact-top a, #contact-top .js-link { display: inline-block; vertical-align: middle; text-align: center; text-decoration: none; line-height: 50px; overflow: hidden; position: relative; transition: 0.2s ease-in-out; } #contact-top a i, #contact-top .js-link i { color: #fff; font-size: large; line-height: 50px; transition: 0.2s ease-in-out; width: 50px; height: 50px; padding-top: 3px; padding-left: 1px; } #contact-top a:hover, #contact-top .js-link:hover{ color:#fff; text-decoration: none; } #contact-top a:hover *, #contact-top .js-link:hover *{ color:#fff; } @media screen and (max-width: 1780px){ #contact-top-right { transform: none; top: 100%; right: 0; } #tel-top { padding: 0 1rem!important; } } @media screen and (max-width: 992px) and (min-width: 800px){ #contact-top { transform: none; top: 100%; left: 0; background: #005b5b; } .falconheavy-switcher { top: 100%; right: inherit; left: 60px; transform: translateY(50%); } } @media screen and (max-width: 720px){ .falconheavy-switcher { right: initial; left: 100px; margin-left: 1rem; } #contact-top-right { top: initial; left: 0; right: initial; position: fixed; bottom: 50px; height: auto; } #tel-top { line-height: 30px!important; display: flex; flex-direction: row-reverse; align-items: center; justify-content: center; } #tel-top i { display: block; height: 30px; color: #fff; margin-right: .25rem; line-height: 35px; } } /* header img */ #header-banner { position: relative; overflow: hidden; display: block; line-height: 0; width: 100%; } .no-object-fit body:not(.home) #header-banner { max-height: 400px!important; } @media screen and (min-width: 720px){ #header-banner::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0, .51); z-index: 1; } } #header-logo { position: absolute; top: 60px; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); z-index: 3; text-align: center; width: 180px; } @media screen and (min-width: 720px){ body:not(.home) #header-logo{top: 50%; transform: translate(-50%,-50%) scale(.1); opacity:0; transition: .5s ease-out; transition-delay: .5s;} body:not(.home) .in-view #header-logo{ opacity: 1; transform: translate(-50%,-50%) scale(1); } } @media screen and (max-width: 1000px){ #header-logo { max-width: 150px!important; } } @media screen and (max-width: 720px){ #header-logo {top:.25rem!important; } } #header-img { display: block; width: 100%; position: relative; z-index: -1; height: 100vh; max-height: 1000px; overflow: hidden; } #header-img img { height: 100%; object-fit: cover; object-position: center center; } body:not(.home) #header-img{ height: 65vh; } .no-object-fit #header-banner #header-img { height: auto; width: auto; min-width: 100%; min-height: 100%; } @media screen and (max-width: 720px){ #header-banner{ margin-top: 50px; } .no-object-fit #header-banner{ height: 300px; } #header-img{ height: auto; } #header-img img{ min-height: 300px!important; object-fit: cover; } html.no-object-fit #header-img{ width: auto; height: auto; min-width: 100%; max-width: none; min-height: 100%; } #header-logo { max-width: none!important; width: 100px; background: #9aaea3; padding: .5rem; border-radius: 0; position: fixed; top: 0!important; left: 0; transform: none; z-index: 9999; } } /* Slider home */ .slide { position: relative; width: 100%; height: 500px; } .slide ul{ margin:0; } .slide ul li { position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; list-style: none; z-index: 1; } .slide ul li:first-of-type { z-index: 1; } .slide ul li { z-index: 0; } #slider-home ul li::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.13); } .slide .dots { position: absolute; left: 0; right: 0; bottom: 20px; width: 100%; z-index: 3; text-align: center; } .slide .dots li { display: inline-block; margin: 0 10px; width: 10px; height: 10px; border: 2px solid #fff; border-radius: 50%; opacity: 0.4; cursor: pointer; transition: background .5s, opacity .5s; list-style: none; } .slide .dots li.active { background: #fff; opacity: 1; } .slide .arrow { position: absolute; z-index: 2; top: 0; left: 0; width: 100%; height: 100%; transition: background .5s, opacity .5s; } .slide .arrow .arrow-left, .slide .arrow .arrow-right { position: absolute; top: 50%; margin-top: -25px; display: block; width: 50px; height: 50px; cursor: pointer; opacity: 1; transition: background .5s, opacity .5s; } .slide .arrow .arrow-right { right: 0; } .slide .arrow .arrow-left:hover, .slide .arrow .arrow-right:hover { opacity: 1; text-decoration: none; } a.arrow-left::before, a.arrow-right::before { font-size: 80px; color: #fff; text-decoration: none; position: absolute; line-height: 0; display: block; left: 0; width: 100%; text-align: center; } a.arrow-left::before { content: "‹"; } a.arrow-right::before { content:"›"; } /* Slogan home */ .slogan-header { position: absolute !important; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(.5); font-size: 48px; line-height: 1; color: #fff; z-index: 2; display: table; border: 0; text-align: center; padding: 0 2rem; font-weight: normal; width: 96%; font-style: italic; opacity: 0; transition: 1s ease-out; } .in-view .slogan-header{ transform: translate(-50%, -50%) scale(1); opacity: 1; } .slogan-header span{ line-height: 1; transform: scale(0); height: 0; opacity: 0; overflow:hidden; } .slogan-header span:first-of-type { color: #fff; display: block; font-size: 30px; font-style: normal; position: relative; transform: scale(1); opacity: 1; transition: transform .5s ease-in-out 1s, opacity .5s ease-in-out 1s, height .5s ease-in-out .5s; } .in-view .slogan-header span:first-of-type{ height: 35px; } .slogan-header span:last-of-type { font-size: 38px; color: #fff; display: block; text-transform: uppercase; font-weight: bold; font-style: normal; transform: scale(1); opacity: 1; transition: transform 1s ease-out 1.5s, opacity 1s ease-out 1.5s, height .5s ease-in-out .2s; } .in-view .slogan-header span:last-of-type{ height: 38px; } @media screen and (max-width:720px){ .slogan-header { display: none; } } /* Vidéo home */ #header-video{ position: relative; width: 100%; overflow: hidden; } #tv { position: absolute; padding-bottom: 56.25%; /* 16:9 */ height: 0; width: 100%; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%); } #tv iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* Progressive images */ a.progressive { position: relative; display: block; overflow: hidden; outline: none; } a.progressive:not(.replace) { cursor: default; } a.progressive img { display: block; width: 100%; max-width: none; height: auto; border: 0 none; } a.progressive img.preview { filter: blur(2vw); transform: scale(1.05); } a.progressive img.reveal { position: absolute; left: 0; top: 0; will-change: transform, opacity; animation: reveal 1s ease-out; } @keyframes reveal { 0% { transform: scale(1.05); opacity: 0; } 100% { transform: scale(1); opacity: 1; } } /************************** Bloc Texte **************************/ .row.in-view p, .bloc-text-with-images p { text-align: justify; } /************************** Bloc Promo **************************/ /* Promo thème option */ #bloc-promo { position: absolute; top: 50%; right: 0; z-index: 4; width: 250px; overflow: hidden; transform: translateY(-50%); } #bloc-promo:not(home){ top: 45%; } #bloc-promo:not(home) a.progressive{ max-height: 220px; } #lien-promo:not(home){ padding:.4rem; } .promo .content:not(home){ padding:.2rem; } #promo-wrap{ white-space: nowrap; overflow: hidden; padding: 0; margin:0; list-style: none; } .promo { display: inline-block; width: 250px; white-space: normal; background: rgba(178,188,180,.43) !important; vertical-align: top; } #titre-bloc-promo { background-color:rgba(178,188,180,.43) !important; text-align: center; line-height: 36px; color: #fff; font-size: 1.1em; font-weight: bold; } #titre-bloc-promo i { color: #fff; font-size: large; position: absolute; padding-left: 10px; } .promo .titre { color: #fff; text-transform: uppercase; font-size: large; font-weight: bold; padding: .25rem 1rem 0; } .promo .content { color: #fff; padding: .5rem; text-align: center; } #nav-promo { position: absolute; top: 0; left: 50%; width: 95%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); display: flex; align-items: center; justify-content: space-between; } #nav-promo span { color: #fff; font-weight: bold; font-size: x-large; margin: 0 2px; display: inline-block; vertical-align: middle; cursor: pointer; line-height: 31px; } @media screen and (max-width: 1000px){ #bloc-promo { transform: rotate(-90deg) translate(50%); transform-origin: top right; right: 37px; width: 200px; transition: 0.2s ease-in-out; top: 50%; } #promo-wrap li{ width: 200px; } #titre-bloc-promo{ background-color: #005b5b!important; } #titre-bloc-promo::before { content: "<"; transform: rotate(90deg); display: inline-block; vertical-align: middle; margin-right: 10px; } #nav-promo { opacity: 0; } #bloc-promo:hover { transform: rotate(0deg) translateY(-50%); right: 0; } #bloc-promo:hover #nav-promo { opacity: 1; } #bloc-promo:hover #titre-bloc-promo::before { opacity: 0; margin-right: 0; } #bloc-promo:hover #titre-bloc-promo i{ left: 0; padding-left: 5px; } .promo { background: rgba(178,188,180,.9) !important; } } @media screen and (max-width: 720px){ ul#promo-wrap { padding-inline-start : 0px!important; } .promo .titre { font-size: smaller; } .promo img { height: 90px!important; object-fit: cover; object-position: center center; width: 100%; } .promo .content{font-size: small;} #bloc-promo {width: 175px;} #titre-bloc-promo {font-size: .9em;} #lien-promo {font-size: small;} #promo-wrap li{ width: 175px; } } #lien-promo { background-color: #8f9e92; color: #fff; width: 100%; display: block; padding: 0.6rem; text-align: center; text-decoration: none; transition: .2s ease-in-out; font-weight: bold; } #lien-promo:hover { background-color: #005b5b; } /******************** C2B header ********************/ div#c2b { position: absolute; z-index: 16; bottom: -14px; left: -7px; } @media screen and (max-width: 1200px){ div#c2b { bottom: 53px; left: 48px; } } @media screen and (max-width: 720px){ div#c2b { bottom: 16px; } } @media screen and (max-width: 50px){ div#c2b { display: none; } } /******************** SOCIAL HEADER ********************/ #social-header{ display: flex; flex-direction: column; position: absolute; top: 50%; left: 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); background-color:rgba(143,158,146,.3); padding: 3rem .5rem 3rem .5rem; height: 60vh; display: flex; align-items: center; justify-content: center; z-index: 15; } #social-header .social-link{ margin: .5rem 0; width: 40px; height: 40px; line-height: 40px; margin: .25rem 0; border-color: #fff; } #social-header .social-link:hover{ background: #005b5b; } #social-header .social-link i{ width: 40px; height: 40px; line-height: 40px; font-size: 1.3em; color: #fff!important; } #social-header *{ color: #fff; } @media screen and (max-width: 720px){ #social-header{ background-color:rgba(143,158,146,.8); } } /************************* Open Dates **************************/ @media screen and (min-width: 721px){ #open-dates { position: absolute; bottom: 65px; right: 50%; transform: translateX(50%); z-index: 4; padding: .4rem 1rem; text-align: center; border-radius: 20px 20px 0 0; overflow: hidden; color: #fff; } #open-dates::before { content: "\62"; font-family: "falconheavy" !important; position: absolute; z-index: 1; line-height: 375px; color: #fff; opacity: 0.2; display: block; font-size: 60px; height: 60px; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%) rotate(15deg); -moz-transform: translate(-50%,-50%) rotate(15deg); -ms-transform: translate(-50%,-50%) rotate(15deg); -o-transform: translate(-50%,-50%) rotate(15deg); transform: translate(-50%,-50%) rotate(15deg); } #open-dates span{ font-size:large; margin: 0 5px; font-weight:bold; color: #fff; } } @media screen and (max-width: 720px){ #open-dates { color: #fff; text-align: center; font-size: x-small; z-index: 999; position: absolute; line-height: 1!important; display: block; bottom: 0; padding: .5rem .25rem; width: 100%; text-transform: uppercase; } #open-dates span { color: #fff; margin-left: 3px; display: inline-block; line-height: 1; font-size: small; font-weight: bold; } } /************************ Bloc resa ************************/ @media screen and (min-width: 720px){ #bloc-resa { padding: 1rem 0; z-index: 2; position: absolute; bottom: 0; left: 50%; width: 75%; max-width: 65rem; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); background-color: transparent !important; } .no-object-fit body:not(.home) #bloc-resa{ position: absolute; bottom: 0; width: 100%; } #titre-resa-mobile{ display: none; } #submit-resa{ background-color: rgba(143, 158, 146, 1) !important; border: 0 !important; padding: 0!important; } #submit-resa:hover{ background-color: #005b5b!important; } #bloc-resa .input-date, #bloc-resa #select-type, #bloc-resa #submit-resa, #bloc-resa .btn-cart { background-color: transparent; border: 1px solid #fff; } } @media screen and (max-width: 720px){ #bloc-resa { position: fixed; bottom: 0; margin: 0; left: 0; transform: translateY(100%); width: 100%; max-width: none; background: #005b5b!important; transition: 0.2s ease-in-out; z-index: 99999999999999; } #bloc-resa:hover{ transform: translateY(0%); } #bloc-resa form { width: 96%; max-width: 330px; padding-top: .5rem; margin: 0 auto; } #titre-resa-mobile { position: fixed; bottom: 100%; background: #9aaea3; width: 100%; padding: 1rem; margin: 0; } #select-type{ width: 100%!important; display: block!important; margin: .25rem 0!important; height: 40px; position: relative; } #bloc-resa .input-date, #submit-resa, .btn-cart { display: inline-block!important; width: calc(50% - 3px)!important; min-width: 0; margin: 0!important; height: 40px; position: relative; } #titre-resa-mobile { display: block; color: #fff; text-align: center; font-size: large; line-height: 1; text-transform: uppercase; } #submit-resa input, a.btn-cart { padding: 0 .5rem!important; line-height: 30px; color:#9aaea3!important; text-align: center; } #submit-resa i { display: none!important; } #submit-resa{ background:#fff!important; width: 100%!important; max-width: none!important; } } @media screen and (min-width: 721px){ #bloc-resa form { display: table; margin: 0 auto; border-collapse: separate; border-spacing: .5rem 0; width: 100%; } #bloc-resa .input-date, #bloc-resa #select-type, #bloc-resa #submit-resa, #bloc-resa .btn-cart { display: table-cell; padding: 0 .5rem; position: relative; width: 25%; height: 40px; } } .input-date:hover, .input-date *:hover{ cursor: pointer; } .input-date input{ -webkit-appearance: none; -moz-appearance: none; appearance: none; clip-path: inset(0 30px 0 0); border:none; z-index: 2; color:#fff; font-weight: bold; position: absolute; left: 0; top: 0; font-size: 1.1em; height: 40px; width: calc(100% + 30px); padding:0 .5rem; background: transparent; } .input-date i, #select-type i { position: absolute; right: 10px; top: 0; color: #fff; line-height: 45px; font-size: 1.2em; display: block; z-index: 1; height: 100%; overflow: hidden; } .input-date input::-webkit-inner-spin-button, /* Removes arrows */ .input-date input::-webkit-clear-button { /* Removes blue cross */ -webkit-appearance: none; -moz-appearance: none; margin: 0; display: none; } .input-date input[type=date]::-webkit-calendar-picker-indicator { background: transparent!important; position: absolute; width: 100%; height: 100%; color:transparent; } #type { z-index: 2; color: #fff; background: transparent; position: absolute; left: 0; top: 0; width: 100%; height: 40px; padding:0 .5rem; cursor: pointer; font-weight: bold; border: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-size: 1.1em; } select::-ms-expand { display: none; } #type option { color: #fff; } #submit-resa { position: relative; transition: 0.2s ease-in-out; } #submit-resa input { width: 100%; height: 100%; text-align: left; border: none; z-index: 2; color: #fff; text-transform: uppercase; font-weight: bold; font-size: smaller; cursor: pointer; background: transparent; position: relative; padding: 0; padding: 0 .5rem; text-align: center; font-size: 1.2em; z-index: 1; } #submit-resa i { position: absolute; right: 5px; display: block; top: 0; line-height: 38px; height: 38px; font-size: x-large; color: #fff; transition: 0.2s ease-in-out; } #submit-resa:hover i{ -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } @media screen and (min-width: 720px) and (max-width: 810px){ #bloc-resa form input, #bloc-resa form select { font-size: smaller!important; } #bloc-resa form #submit-resa input { font-size: 12px!important; } #submit-resa i { right: 5px; font-size: large; } } /************************* YOAST *************************/ .yoast_bread { padding: .5rem; border-bottom: 1px solid; text-align: right; } .yoast_bread * { font-size: small; } /************************* Sections *************************/ /* Global */ section{ padding: 4rem 0; overflow:hidden;} section::before { transform: translateY(-50%); opacity: 0; transition: 1s ease-in-out; } section.in-view::before { transform: translateY(0%); opacity: 1; } .no_padding_top{ padding-top:0!important; } .no_padding_bottom{ padding-bottom:0!important; } /* Titre section */ .section-title{ display: block; font-size: xx-large; text-transform: uppercase; font-weight: bold; color: #9aaea3 !important; line-height: 1; margin: 1rem 2% 3rem 2%; } .section-title span { display: block; font-size: xx-large; text-transform: uppercase; font-weight: bold; color: #005b5b; line-height: 1; } h1, h2, h3{ font-size: x-large; margin: 0; } @media screen and (max-width: 720px){ .section-title { font-size: x-large; padding: 1rem; margin-bottom: 1rem; } h1, h2, h3 { font-size: large; } } /* Inline titre */ .inline-title { display: block; font-size: xx-large; text-transform: uppercase; font-weight: bold; color: #9aaea3 !important; line-height: 1; border-bottom: 1px solid #005b5b; padding-bottom: 1rem; margin-bottom: 1rem; } .inline-title span { display: block; font-size: xx-large; text-transform: uppercase; font-weight: bold; color: #005b5b; line-height: 1; } @media screen and (max-width: 720px){ .inline-title{ padding:1rem!important; } } /* Bloc text */ .bloc-text { margin: 2rem 2% 1rem auto; } .full > .bloc-text { width: 96%; max-width: 80rem; margin: 2rem auto 1rem auto; } /* Citation */ .citation { position: relative; display: block; padding: 0.5rem 0; font-size: large; text-transform: uppercase; } .citation::before { content: "\42"; font-family: falconheavy; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%) rotate(15deg); -moz-transform: translate(-50%,-50%) rotate(15deg); -ms-transform: translate(-50%,-50%) rotate(15deg); -o-transform: translate(-50%,-50%) rotate(15deg); transform: translate(-50%,-50%) rotate(15deg); font-size: 60px; height: 70px; z-index: -1; opacity: 0.1; line-height: 390px; } /* Img full */ .image-full-width { position: relative; height: 500px; } .image-full-width .progressive{ height: 100%; } .image-full-width .progressive img{ object-fit: cover; height: 100%; } .object-fit .img-full { width: 100%; max-height: 700px; object-fit: cover; object-position: center center; line-height: 0; display: block; } .no-object-fit .img-full{ width: 100%; } .image-full-width .content { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; line-height: 1.2; } .image-full-width .content:after{ position: absolute; content: ''; width: 100%; height: 100%; background-color: rgba(0, 91, 91, .7); z-index: -1; } .image-full-width .content p:not(.titre-img-full){ width: 80%; color: #fff; text-align: center; font-size: large; line-height: 1.8; font-size: 1.4rem; } .image-full-width .content .titre-img-full{ color: #fff !important; text-transform: uppercase; font-weight: bold; font-size: 3rem; } .image-full-width .content .titre-img-full::before { content: ''; position: absolute; left: -5rem; bottom: 0; height: 500px; width: 2px; background-color: #fff; transform: translateY(-200px); opacity: 0; transition-delay: 1s; transition: .1s ease-in-out; } .image-full-width .content .titre-img-full::after { content: ''; position: absolute; right: -5rem; top: 0; height: 500px; width: 2px; background-color: #fff; transform: translateY(120px); opacity: 0; transition-delay: 1s; } .in-view .image-full-width .content .titre-img-full::before, .in-view .image-full-width .content .titre-img-full::after{ transform: translateY(0); transition-delay: 1s; opacity: 1; transition: 1.3s ease-in-out; } .image-full-width .content a{ color:#8f9e92 !important; font-weight: bold; } @media screen and (max-width: 720px){ .image-full-width .content .titre-img-full { padding-left: 1rem; } } /* Btn vidéo */ .video-btn { text-transform: uppercase; font-size: large; background: #fff; padding: .5rem 2rem; cursor: pointer; overflow: hidden; border: none; transition: 0.2s ease-in-out; } .video-btn:hover{ color: #fff; } .video-btn::after{ content:"\65"; font-family: falconheavy; text-transform: none; font-size: xx-large; height: 0; position: relative; display: inline-block; vertical-align: middle; line-height: 160px; margin-left: .25rem; width: 0px; opacity: 0; color: #fff; transition: 0.2s ease-in-out; } .video-btn:hover::after{ width: 20px; opacity: 1; } /* Section list pages */ .list-pages { padding: 0; margin: 0; display: flex; flex-wrap: wrap; } @media screen and (max-width: 720px){ .list-pages { display: block; } } .list-pages.list-of-2 { max-width: 35rem; margin: 0 auto; } .list-pages.list-of-1 { max-width: 20rem; margin: 0 auto; } .cta { margin: 0.5%!important; width: 24%; list-style: none; cursor: pointer; background: transparent !important; position: relative; } a.cta-link { position: absolute!important; top: 0; left: 0; width: 100%; height: 100%; z-index: 5; } .cta .progressive { height: 0; position: relative; padding-top: 56.25%; } .cta .progressive img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; transition: 0.2s ease-in-out; } .cta.ishover .progressive img { transform: scale(1.1); } .list-of-7 .cta:nth-last-of-type(1), .list-of-7 .cta:nth-last-of-type(2), .list-of-7 .cta:nth-last-of-type(3) { width: 32.333%; } .list-of-5 .cta{ width: 19%; } .list-of-3 .cta{ width: 32.333%; } .list-of-2 .cta{ width: 49%; } .list-of-1 .cta{ width: 99%; } .cta a{ text-decoration: none; display: block; position: relative; overflow: hidden; } .cta-img { position: relative; line-height: 0; overflow: hidden; } .cta-img::before { content: ""; position: absolute; top: 0; left: 0; opacity: 0; width: 100%; height: 100%; display: block; z-index: 2; transition: 0.2s ease-in-out; } .cta:hover .cta-img::before, .cta.ishover .cta-img::before{ opacity: 0.7; } .cta-img > img { transition: 0.2s ease-in-out; z-index: 1; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); width: 100%; } .cta:not(.cta-heberg):hover .cta-img > img, .cta:not(.cta-heberg).ishover .cta-img > img { -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } .cta .cta-img > span { z-index: 3; position: absolute; top: 60%; left: 50%; -webkit-transform: translate(-50%,-50%) scale(1.2); -ms-transform: translate(-50%,-50%) scale(1.2); -o-transform: translate(-50%,-50%) scale(1.2); transform: translate(-50%,-50%) scale(1.2); color: #fff; text-transform: uppercase; display: table; width: 100%; text-align: center; line-height: 1; transition: 0.2s ease-in-out; opacity: 0; font-size: 4rem; font-weight: bold; width: 70px; height: 70px; border: 3px solid #fff; border-radius: 100%; line-height: 30px; } .cta:not(.cta-heberg):hover .cta-img > span, .cta:not(.cta-heberg).ishover .cta-img > span{ opacity: 1; top:50%; -webkit-transform: translate(-50%,-50%) scale(1); -ms-transform: translate(-50%,-50%) scale(1); -o-transform: translate(-50%,-50%) scale(1); transform: translate(-50%,-50%) scale(1); } .cta:hover .cta-img > span::after, .cta.ishover .cta-img > span::after { margin-left: .5rem; } .cta-descr { margin-top: .2rem; background-color: #b2bcb4; text-align: left; padding: 1rem; font-size: x-large; transition: 0.2s ease-in-out; } .cta:not(.cta-heberg):hover .cta-descr, .cta:not(.cta-heberg).ishover .cta-descr{ background-color: #8f9e92; } .bggrey .cta{ background:#fff; } .cta-descr .cta-title{ text-transform: uppercase; font-size: large; font-weight: bold; color: #fff; } .cta-subtitle { line-height: 0.8; font-size: small; } .cta-descr > .cta-resume { font-size: x-small; display: block; text-transform: none; line-height: 1; } .cta.ishover .cta-descr *, .cta:hover .cta-descr *{ color:#fff; } .prix-appel { position: absolute; top: 1rem; right: 0; color: #fff; font-size: x-small; line-height: 1; text-align: center; padding: .25rem .5rem; z-index: 3; transition: 0.2s ease-in-out; } .prix-appel > span { display: block; color: #fff; line-height: 1; font-size: large; } .cta:hover .prix-appel, .cta.ishover .prix-appel{ right: -100%; } @media screen and (max-width: 720px){ ul.row.scroll-x-mobile.list-pages.custom-list.list-of-3.in-view li.col-3.cta { position: relative!important; top: initial!important; left: initial!important; } } /* FIlters */ .filters { padding: .5rem 0; display: flex; flex-wrap: wrap; justify-content: center; } .button-group { margin: .5rem; display: inline-flex; flex-wrap: wrap; } .filter-title { font-size: smaller; width: 100%; } .button-group button { text-transform: uppercase; border: .5px solid; cursor: pointer; transition: 0.2s ease-in-out; flex-basis: 0; flex-grow: 1; flex: 1 1 auto; font-size: smaller; margin: .125rem; padding: .25rem; background-color: #fff; border-color: #005b5b; color: #005b5b; } .button-group button:hover, .button-group button.active{ color: #fff; background-color: #9aaea3; border-color: #9aaea3; } /* Hebergements */ /* FIlters */ .filters { padding: .5rem 0; display: flex; flex-wrap: wrap; justify-content: center; } .button-group { margin: .5rem; display: inline-flex; flex-wrap: wrap; } .filter-title { font-size: smaller; width: 100%; } .button-group button { text-transform: uppercase; border: .5px solid; cursor: pointer; transition: 0.2s ease-in-out; flex-basis: 0; flex-grow: 1; flex: 1 1 auto; font-size: smaller; margin: .125rem; padding: .25rem; } .button-group button:hover, .button-group button.active{ color: #fff; } @media screen and (max-width: 720px){ .button-group{ display: inline-flex!important; flex-wrap: nowrap!important; white-space: normal!important; } .button-group button{ white-space: nowrap!important; } } /* Hebergements */ .heberg-list{ height: auto!important; justify-content: center; } .cta-heberg:hover .cta-img > img { transform: scale(1.1); } .cta-info { position: absolute; top: 0; left: 0; height: 100%; width: 100%; display: flex; flex-direction: column; justify-content: center; background: -moz-linear-gradient(left, rgba(0,0,0,.7) 0%, rgba(0,0,0,0) 35%, rgba(0,0,0,0) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, rgba(0,0,0,.7) 0%,rgba(0,0,0,0) 35%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, rgba(0,0,0,.7) 0%,rgba(0,0,0,0) 35%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 */ padding-left: 1rem; font-size: small; opacity: 1; } .cta-info, .cta-info *{ color: #fff; } .cta-info i { height: 15px; display: inline-block; vertical-align: middle; overflow: hidden; font-size: small; margin-right: .25rem; } .cta-info > div{ font-size: smaller; transition: 0.3s ease-in-out; position: relative; left: 0; } .cta-info > div:not(:last-of-type){ margin-bottom: .25rem; } .cta-gamme span{ font-size: inherit; } .cta-gamme span:not(:last-of-type)::after { content: ","; display: inline-block; margin-right: .25rem; } .cta-heberg:hover .cta-info, .cta-heberg.ishover .cta-info { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); transition: 0.2s ease-in-out; flex-direction: row; align-items: center; justify-content: center; } .cta-heberg .cta-info > div { transition: 0.2s ease-in-out; } .cta-heberg:hover .cta-info > div, .cta-heberg.ishover .cta-info > div { margin: .25rem; font-size: small; text-align: center!important; } .cta-heberg .cta-title{ text-align: center; } .cta-price { position: absolute; top: 0; font-size: x-small; z-index: 9; background: #fff; text-transform: uppercase; font-weight: bold; padding: 0 1rem; transform: rotate(-45deg) translateX(-30%); } /* Heberg details */ .heberg-detail { position: relative; max-width: calc(100% - 40px); margin: 0 20px; } .close-detail{ background: red; position: absolute; top: 0px; right: 0px; font-size: 35px; line-height: 30px; text-align: center; height: 30px; color: #fff; width: 30px; font-weight: bold; -webkit-transform: translate(50%,-50%); -moz-transform: translate(50%,-50%); -ms-transform: translate(50%,-50%); -o-transform: translate(50%,-50%); transform: translate(50%,-50%); cursor: pointer; border-radius: 100%; transition: 0.2s ease-in-out; } .heberg-content-wrap { display: flex; align-items: center; padding: 1rem; margin: 1rem .5% 0; position: relative; z-index: 1; } .heberg-img, .heberg-slider { position: relative; } a.heberg-vv { position: absolute; bottom: 0; background: #005b5b; right: 0; border: 1px solid #fff; color: #fff!important; width: 100px; height: 100px; display: flex; align-items: center; justify-content: center; text-align: center; text-transform: uppercase; z-index: 2; border-radius: 100%; line-height: 1; text-decoration: none; font-weight: bold; transition: 0.2s ease-in-out; } a.heberg-vv:hover { background: #8f9e92; transform: rotate(360deg) scale(1.1); } .heberg-slider { margin: 1rem 2rem 1rem 1rem; width: 50%; line-height: 0; } @media screen and (max-width: 720px){ .heberg-slider { width: 100%; } } .slider-nav .slide-nav { border-top: 2px solid #fff; border-bottom: 2px solid #fff; border-right: 1px solid #fff; border-left: 1px solid #fff; cursor: pointer; } .slider-nav { margin: .25rem 0 0; } .heberg-img .slick-list.draggable { height: auto!important; } .heberg-content { margin-left: 1rem; width: 50%; } .heberg-title { text-transform: uppercase; font-weight: bold; font-size: larger; border-bottom: .5px solid; margin-bottom: .5rem; } .heberg-price { color: #8f9e92; float: right; font-size: small; display: block; line-height: 30px; font-weight: bold; } .heberg-icons { display: flex; flex-wrap: wrap; } .heberg-icons .cta-ico { flex-grow: 1; font-size: small; display: flex; } .heberg-icons .cta-ico i { display: inline-block; vertical-align: middle; height: 0; margin-right: .25rem; } .heberg-description * { font-size: small; } .heberg-description { margin-top: .5rem; } .heberg-resa { background: #fff; padding-top: calc(1rem + 20px); } .heberg-content-wrap::after { content: ""; position: absolute; bottom: 0; left: 50%; -webkit-transform: translate(-50%, 50%) rotate(45deg); -moz-transform: translate(-50%, 50%) rotate(45deg); -ms-transform: translate(-50%, 50%) rotate(45deg); -o-transform: translate(-50%, 50%) rotate(45deg); transform: translate(-50%, 50%) rotate(45deg); width: 40px; height: 40px; z-index: -1; } .heberg-wrap.hide{ display: none; } .heberg-wrap.show{ display: block; } .heberg-resa iframe { margin: 0 auto; display: block; width: 100%; border: none; } @media screen and (max-width: 720px){ .heberg-resa iframe { width: 100% !important; height: 700px !important; } .list-pages { height: auto!important; padding-bottom: .5rem; } .cta-heberg { position: relative!important; top: 0!important; left: 0!important; max-width: 250px!important; } .filters { display: block; white-space: nowrap; width: 100%; overflow-x: scroll; } .button-group { display: inline-block; position: relative; } .button-group button { min-width: 50px; white-space: normal; } .filter-title { position: absolute; bottom: 100%; } .heberg-detail { width: 100%; max-width: none!important; margin: 0; } .heberg-img { width: 100%; margin: 0; } .heberg-img img { height: 250px; object-fit: cover; object-position: center center; } .heberg-content { width: 100%; margin: 1rem 0 0; } .heberg-content-wrap { display: block; padding: .5rem; } span.close-detail { top: 0; right: 0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); z-index: 2; } .slick-next { right: 5px!important; } .slick-prev { left: 5px!important; } } /* Modale hébergement */ .popup-overlay.active { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); z-index: 9999999999; display: flex; align-items: center; justify-content: center; cursor: pointer; } .popup-content{ cursor: initial; } .popup-content { width: 600px; max-height: 90vh; max-width: 96%; } /*Slider heberg */ .slick-prev { left: 1rem; z-index: 2; } .slick-next{ right: 1rem; z-index: 2; } /* Adaptation css escale st gilles hebergements V2*/ @media screen and (min-width: 720px){ .cta.cta-heberg{ cursor: pointer; width: 22%!important; margin: 1%!important; position: relative!important; top: 0!important; left: 0!important; } } @media screen and (max-width: 1000px) and (min-width: 720px){ .cta.cta-heberg { width: 31.333%!important; } } .cta.cta-heberg:after{ content: '+'; position: absolute; top: 0; right: 0; width: 40px; height: 40px; color: #fff; background-color: #005b5b; -webkit-transform: translate(50%,-50%) rotate(0deg); -moz-transform: translate(50%,-50%) rotate(0deg); -ms-transform: translate(50%,-50%) rotate(0deg); -o-transform: translate(50%,-50%) rotate(0deg); transform: translate(50%,-50%) rotate(0deg); z-index: 2; text-align: center; vertical-align: middle; font-weight: bold; font-size: 45px; line-height: 32px; transition: .2s ease-in-out; } @media screen and (max-width: 720px){ .cta.cta-heberg:after { -webkit-transform: none!important; -moz-transform: none!important; -ms-transform: none!important; -o-transform: none!important; transform: none!important; border-radius: 0!important; } } .cta-info{ z-index: 2; } .cta.cta-heberg .cta-descr{ margin-top: -1px; background-color: #005b5b; padding: 1rem 0; transition: .2s ease-in-out; } .cta.cta-heberg .cta-descr * { color: #fff; font-weight: bold; } .heberg-description p { font-weight: bold; font-size: medium; text-shadow: .5px 0 0; } .heberg-title { font-size: xx-large; margin-bottom: 1rem; } .cta.cta-heberg:hover:after, .cta.cta-heberg.ishover:after{ border-radius: 100%; -webkit-transform: translate(50%,-50%) rotate(360deg); -moz-transform: translate(50%,-50%) rotate(360deg); -ms-transform: translate(50%,-50%) rotate(360deg); -o-transform: translate(50%,-50%) rotate(360deg); transform: translate(50%,-50%) rotate(360deg); background-color: #8f9e92; } .cta.cta-heberg:hover .cta-descr, .cta.cta-heberg.ishover .cta-descr{ background-color: #8f9e92; } .close-detail { background-color: #8f9e92; line-height: 25px; } .cta.cta-heberg.ishover .cta-img:before, .cta.cta-heberg:hover .cta-img:before{background-color: #8f9e92;} .cta-ico{ display: flex; flex-direction: row; justify-content: center; padding: .1rem .2rem; margin: 0 .2rem; background-color: #005b5b; color: #fff; } .cta-ico * { color: #fff; } .slider{ position: relative; } .slider:after{ content: ''; position: absolute; top: 10px; left: 10px; width: calc(100% - 22px); height: calc(100% - 20px); border:1px solid #fff; } .button-group button.active{ border-color: #005b5b; background-color:#005b5b; } .button-group button:hover, .close-detail{ background-color: #8f9e92 !important; } .heberg-img.slider .slick-next::before, .heberg-img.slider .slick-prev::before{ color: #8f9e92; } a.heberg-doc { display: inline-flex; align-items: center; justify-content: center; background: #005b5b; color: #fff; padding: .5rem 1rem; margin: .5rem 0; min-width: 150px; text-transform: uppercase; text-decoration: none; transition: 0.2s ease-in-out; } a.heberg-doc:not(:last-of-type) { margin-right: .5rem; } a.heberg-doc:hover { background: #00a1b5; } /* Accordeon slider */ @media screen and (min-width: 720px){ .flexbox-slider { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; height: 350px; visibility: hidden; } .flexbox-slider .flexbox-slide { -webkit-transition-property: all; transition-property: all; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transition-delay: 0s; transition-delay: 0s; width: 20%; height: 100%; position: relative; overflow: hidden; cursor: pointer; visibility: visible; border-right: 5px solid #fff; max-width: 90%; } .flexbox-slider.slides-1 .flexbox-slide { width: 100%; } .flexbox-slider.slides-2 .flexbox-slide { width: 50%; } .flexbox-slider.slides-3 .flexbox-slide { width: 33.3333%; } .flexbox-slider.slides-4 .flexbox-slide { width: 25%; } .flexbox-slider .flexbox-slide:last-of-type{ border-right: none; } .flexbox-slider .flexbox-slide:after { position: absolute; top: 0; left: 0; content: ""; display: block; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.6); z-index: 2; opacity: 0; } .flexbox-slide a { position: static; } .flexbox-slider .flexbox-slide img { position: absolute; top: 50%; left: 50%; height: auto; width: auto; max-width: none; min-width: 100%; min-height: 100%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 1; } html:not(.no-object-fit) .flexbox-slider .flexbox-slide img { object-fit: cover; } html.no-object-fit .flexbox-slider .flexbox-slide img { max-width: none!important; height:auto!important; } .flexbox-slider:not(.slides-1):hover .flexbox-slide:hover { -ms-flex-negative: 0; flex-shrink: 0; width: 50%; } } @media screen and (max-width: 720px){ .flexbox-slider{ height:auto!important; } .scroll-x-mobile .flexbox-slide{ display: inline-block; height: 175px; vertical-align: top; position: relative; } .scroll-x-mobile .flexbox-slide img{ height: 100%; max-width: none; } .slider-container .scroll-x-title { margin-top: 1rem; } } /* Bloc de texte + image */ .flex-row { display: flex; flex-wrap: wrap; } .v-align { align-items: center; } .reverse-row { flex-direction: row-reverse; } img.full { max-width: none; width: 100%; } /* Map */ img.leaflet-marker-icon { top: -18px; left: -2px; } #map-row > .col-6 { margin: 0 .5%; width: 49%; } #gmaps{ height: 350px; height: 100%; width: 100%; } #map-list { margin: 0; padding: 0; } .list-of-6 #map-list .cta { width: 32.333%; } @media screen and (max-width: 1200px){ #map-list .cta-descr { font-size: x-small; font-weight: bold; } } @media screen and (max-width: 720px){ #map-list.scroll-x-mobile [class^=col] { width: 150px!important; } #map-row > .col-6 { width: 99%; } #gmaps{ height: 350px; } .list-of-2 .cta { width: 49%!important; } .list-of-2 .cta { width: 99%!important; } .list-of-3 .scroll-x-title { display: none; } .list-of-2 .scroll-x-title { display: none; } .list-of-1 .scroll-x-title { display: none; } } .list-of-5 #map-list .cta { width: 32.333%; } .list-of-5 #map-list .cta:nth-last-of-type(1), .list-of-5 #map-list .cta:nth-last-of-type(2) { width: 49%; } /* WPCF7 */ .form-title { color:#fff; text-transform: uppercase; font-weight: bold; text-align: center; font-size: 2rem; } .wpcf7-text, .wpcf7-textarea, .wpcf7-captchar { border: none !important; margin:5px 1%; -moz-border-radius: 0 !important; -webkit-border-radius: 0 !important; border-radius: 0 !important; -moz-box-sizing: border-box; padding: 10px; -webkit-box-sizing: border-box; box-sizing: border-box; } .wpcf7-text{width: 48% !important;} .wpcf7-textarea{width: 98% !important;} .wpcf7-acceptance a{color: #005b5b!important;} .acceptance-553{ margin: auto; text-align: center; width: 98%; display: inline-block; } .wpcf7-submit { color:#fff!important; margin: 0 1%!important; cursor: pointer; font-weight: bold!important; font-size: 1.5rem !important; display: block; padding: 6px 20px; border-radius: 0; background: transparent; letter-spacing: 2px; text-transform: uppercase; width: 98%; font-size: small; border: 2px solid; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -moz-transition: all 0.2s; -webkit-transition: all 0.2s; transition: all 0.2s; } .wpcf7-submit:hover{ background-color:#b2bcb4 !important; } @media screen and (max-width: 720px){ #map-row.contact-row { display: block; width: 100%; flex-wrap: inherit; } #map-row.contact-row > .col-6 { width: 100%; max-width: 450px; display: block; margin: 0 auto; float: none; } #map-row.contact-row #gmaps { height: 200px; } } /* Numbers row */ .numbers-row { text-align: center; position: relative; display: block; z-index: 1; padding: 3rem 0;ç } @media screen and (min-width: 720px){ .numbers-row::before { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 50%; z-index: -1; } } .number-box { display: inline-flex; background: #fff; flex-direction: column; width: 180px; height: 180px; vertical-align: top; border-radius: 100%; padding: 1rem; margin: 1rem; justify-content: center; position: relative; transition: 0.2s ease-in-out; } .number-box::before { content: ""; height: calc(100% + 10px); position: absolute; top: 50%; width: calc(100% + 10px); left: 50%; border-radius: 100%; border: 3px solid; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); transition: 0.2s ease-in-out; } .number-wrap span { font-weight: bold; font-size: x-large; text-transform: uppercase; line-height: 1; transition: 0.2s ease-in-out; } .number-box .subtitle-number { line-height: 1; border-bottom: 1px solid; margin: 0 auto .5rem; padding-bottom: .5rem; text-transform: uppercase; transition: 0.2s ease-in-out; } .number-box .description-number { line-height: 1; font-size: small; } @media screen and (max-width: 900px) and (min-width: 720px){ .number-box { width: 140px; height: 140px; margin: .75rem; } .number-wrap span { font-size: larger; } .number-wrap { font-size: large; } .number-box .subtitle-number { font-size: small; margin-bottom: .25rem; padding-bottom: .25rem; } } @media screen and (max-width: 720px){ .numbers-row { padding: 1rem 0; } .number-box { white-space: normal; } } /* Gallery */ .falcon-gallery { display: flex; flex-wrap: wrap; height: 400px; position: relative; } .falcon-gallery > * { flex-grow: 1; flex-basis: 0; } .falcon-gallery a { height: 100%; object-fit: cover; object-position: center center; width: 100%; -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); z-index: -1; transition: 0.2s ease-in-out; } .falcon-gallery a img { height: 100%!important; object-fit: cover; object-position: center center; } .img-grid-wrap:hover a{ -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } .img-grid-wrap { position: relative; overflow: hidden; height: 100%; border-left: 3px solid; border-right: 3px solid; border-top: 6px solid; border-bottom: 6px solid; flex-grow: 1; flex-basis: 0; color: #fff; } .img-grid-wrap::before { content: ""; position: absolute; z-index: 1; width: calc(100% - 20px); height: calc(100% - 20px); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); top: 50%; left: 50%; border: .5px solid; transition: 0.2s ease-out; } .img-grid-wrap:hover::before{ width: 100%; height: 100%; } .falcon-gallery > .img-grid-wrap:last-of-type { border-right: 6px solid; } .falcon-gallery > .img-grid-wrap:first-of-type { border-left: 6px solid; } @media screen and (min-width: 720px){ .grid-middle { flex-basis: 0; position: relative; height: 100%; width: 100%; flex-grow: 1; } } .grid-middle .img-grid-wrap { width: 100%; height: 50%; } .grid-middle .img-grid-wrap:first-of-type { border-bottom: 3px solid; } .grid-middle .img-grid-wrap:last-of-type { border-top: 3px solid; } .grid-middle img { flex-grow: 1; flex-basis: 0; height: 100%!important; width: 100%; } .falcon-gallery.gallery-of-5 .grid-middle .img-grid-wrap:nth-last-of-type(1), .falcon-gallery.gallery-of-5 .grid-middle .img-grid-wrap:nth-last-of-type(2) { width: 50%; float: left; } .falcon-gallery.gallery-of-5 .grid-middle .img-grid-wrap:nth-last-of-type(2) { border-top: 1.5px solid; } .falcon-gallery.gallery-of-6 .grid-middle .img-grid-wrap{ width: 50%; float: left; } .falcon-gallery.gallery-of-6 .grid-middle .img-grid-wrap:nth-last-of-type(1), .falcon-gallery.gallery-of-6 .grid-middle .img-grid-wrap:nth-last-of-type(2){ border-top: 3px solid; } .falcon-gallery.gallery-of-6 .grid-middle .img-grid-wrap:nth-child(1), .falcon-gallery.gallery-of-6 .grid-middle .img-grid-wrap:nth-child(2){ border-bottom: 3px solid; } @media screen and (max-width: 720px){ .falcon-gallery { display: block; white-space: nowrap; overflow-x: scroll; height: auto; } .img-grid-wrap { display: inline-block; width: 200px!important; height: 150px!important; } .grid-middle { display: inline-block; } .grid-middle > .img-grid-wrap { float: none!important; border: 6px solid; } } /* Widget produits ctoutvert */ .widgets-price-ctoutvert-wrap { overflow: auto; } .widget-price-ctoutvert { display: inline-block; margin: .5rem; vertical-align: top; float: left; } /************************ BLOG *************************/ #section-single .section-title { margin: 0; } #sidebar { padding: 1rem; } #sidebar .widget:not(:last-of-type) { margin-bottom: 1rem; } #sidebar ul { margin: 0; padding-left: 2rem; } #sidebar .inline-title { font-size: smaller; } #sidebar a { font-size: small; } .single-meta { margin: 2rem 0; text-align: right; } .single-meta, .single-meta * { font-size: small; font-style: italic; } #section-blog span { float: unset; margin: 0; min-height: unset; } /**************************** SOCIAL SHARE *****************************/ .social-share{ display: table; margin:1rem auto 0; } #social-share-fixed i.icon-x { display: none; } .social-share > a { display: inline-block; float: left; margin: .10rem; } .social-share > a { width: 35px; height: 35px; display: block; text-align: center; line-height: 35px; text-decoration: none; position: relative; color: initial!important; background: #fff; } .social-share > a:not(:last-of-type){ border-bottom: 1px solid; } .social-share > a > i { font-size: large; display:inline-block; width: 35px; height: 35px; line-height:35px; padding-top:3px; transition: 0.2s ease-in-out; } .social-share > a:hover > i { color: #fff; -webkit-transform: scale(1.3) rotate(360deg); -moz-transform: scale(1.3) rotate(360deg); -ms-transform: scale(1.3) rotate(360deg); -o-transform: scale(1.3) rotate(360deg); transform: scale(1.3) rotate(360deg); } @media screen and (min-width: 721px){ #social-share-fixed { position: fixed; z-index: 999999; top: 50%; left: 0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); transition: 0.2s ease-in-out; } #social-share-fixed i.icon-x { position: absolute; font-size: small; top: 0; right: 0; color: #fff; line-height: 1; -webkit-transform: translate(50%, -50%); -moz-transform: translate(50%, -50%); -ms-transform: translate(50%, -50%); -o-transform: translate(50%, -50%); transform: translate(50%, -50%); z-index: 2; text-shadow: 2px 2px 5px rgba(0,0,0,0.8); opacity: 0; display: block; line-height: 110px; display: block; transition: 0.2s ease-in-out; } #social-share-fixed:hover i.icon-x{ opacity: 0.8; } #social-share-fixed i.icon-x:hover{ cursor: pointer; opacity: 1; } #social-share-fixed a { display: block; float: none; margin: 0; overflow: hidden; } } #social-share-single{ display: table; margin-left:auto; margin-top: .5rem; } #social-share-single a{ border: none; } #social-share-single a i{ color:#fff; } @media screen and (max-width: 720px){ .social-share > a { border: none!important; } } /**************************** Labels *****************************/ #section-labels { padding: 2rem 0; text-align: center; margin-bottom: -5px; } .label-link { display: inline-block; height: 80px; line-height: 80px; position: relative; overflow: hidden; min-width: 90px; } .label-link i { display: inline-block; width: 80px; height: 80px; line-height: 105px; font-size: 70px; text-align: center; transition: 0.2s ease-in-out; } .label-link:hover i{ transform: scale(1.2); } .label-link img { transition: 0.2s ease-in-out; left: 50% !important; top: 50% !important; position: absolute; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .label-link .hovered { position: absolute; top: 0; left: 0; opacity: 0; } .label-link:hover img.hovered { opacity: 1; } .label-link:hover img { opacity: 0; -webkit-transform: scale(1.2) translate(-40%, -40%); -moz-transform: scale(1.2) translate(-40%, -40%); -ms-transform: scale(1.2) translate(-40%, -40%); -o-transform: scale(1.2) translate(-40%, -40%); transform: scale(1.2) translate(-40%, -40%); } /**************************** FOOTER *****************************/ #guestapp-widget-wrap a { text-decoration: none; } #horaires a { text-decoration: none; text-align: left; font-size: large; color: white; padding: 1rem 2rem; background: #165b5a; } @media screen and (max-width: 1530px){ #horaires a { font-size: medium; padding: 1rem 1rem; } } @media screen and (max-width: 1310px){ #horaires a { font-size: small; padding: 1rem 0.4rem; display: block; text-align: center; text-transform: uppercase; } } /* Section social & avis */ #section-social { padding: 2rem 0; position: relative; background:#fff!important; } @media screen and (max-width: 720px){ #section-social { text-align: center; } #social-box, #avis-box { float: none!important; width: auto; display: inline-block; margin:10px; } } #section-social .row{ display:flex; align-items: center; } #social-box, #avis-box{ display: flex; align-items: center; justify-content: flex-start; } #avis-box{ justify-content: center; } #section-social .container { padding: 0 5rem; } #social-box span:not(.social-link), #avis-box span:not(.social-link) { font-size: xx-large; font-weight: bold; margin-right: 12px; color:#8f9e92; } .social-link { display: inline-block; vertical-align: middle; width: 80px; height: 80px; position: relative; overflow: hidden; text-align: center; line-height: 80px; border: 1px solid; border-radius: 100%; margin: 0 8px; transition: 0.2s ease-in-out; color:#8f9e92 !important; } .social-link i { font-size: 45px; width: 80px; height: 80px; display: inline-block; line-height: 80px; position: relative; text-align: center; padding-top: 3px; padding-right: 1px; color: #8f9e92 !important; border-color: #005b5b!important; transition: .2s ease-in-out; } .social-link:hover, .social-link:hover i{ color: #005b5b!important } .social-link img { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); height: 28px; transition: 0.2s ease-in-out; } .social-link img.hovered { opacity: 0; } .social-link:hover { -webkit-transform: rotate(360deg) scale(1.2); -moz-transform: rotate(360deg) scale(1.2); -ms-transform: rotate(360deg) scale(1.2); -o-transform: rotate(360deg) scale(1.2); transform: rotate(360deg) scale(1.2); } .social-link:hover img.hovered { opacity: 1; } .social-link:hover img { opacity: 0; } @media screen and (max-width: 720px){ #social-box, #avis-box { display: block; } #section-social .row { display: block; } #avis-box span:first-of-type{ display: block; } .label-link { vertical-align: middle; } } /* Section pdf */ #section-pdf { padding: 2rem 0; text-align: center; background-color: #8f9e92 !important; } @media screen and (min-width: 721px){ #section-pdf .row { display: flex; flex-wrap: wrap; justify-content: center; } } @media screen and (max-width: 720px){ #section-pdf{ padding: 1rem 0 0; } } #section-pdf .pdf-link { transition: 0.2s ease-in-out; margin: 1rem; text-decoration: none; width: 160px; height: 160px; border: 1px solid #fff; border-radius: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; } #section-pdf .pdf-link i { display: inline-block; width: 70px; height: 70px; color:#fff !important; line-height: 70px; font-size: 3rem; padding-top: 3px; vertical-align: middle; transition: 0.2s ease-in-out; margin-right: 5px; } #section-pdf .pdf-link-decr { display: block; vertical-align: middle; margin-top: .5rem; } #section-pdf .pdf-link-decr, .pdf-link-decr * { text-align: center; line-height: 1; transition: 0.2s ease-in-out; color:#fff; text-transform: uppercase; } #section-pdf .pdf-link-decr span { text-transform: uppercase; display: block; } #section-pdf .pdf-link:hover { text-decoration: none; } #section-pdf .pdf-link:hover{ background:#005b5b; border-color:#005b5b; } #section-pdf .scroll-x-title, #section-pdf .scroll-x-title i{ color: #fff; } #section-pdf .pdf-link{ margin: 1rem 5%; } @media screen and (max-width: 720px){ #section-pdf .pdf-link-decr { margin-top: 0px; } #section-pdf .pdf-link i { padding-top:0px; vertical-align: initial; margin-right: 0px; font-size: 2.5rem; line-height: 60px; width: 60px; height: 65px; } } /* Section labels */ #label-img { margin: 2rem auto; display: block; } /************************** Footer *************************/ footer { text-align: center; padding: 0 2rem; background:#e5e5e5!important; } footer .col-4{ margin: 0!important; padding: 1rem; } footer .col-4:first-of-type{ background: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; } footer .col-4:first-of-type *{ color: #005b5b; } footer .col-4:nth-child(2){ padding: 2rem 2rem; display: flex; flex-direction: column; justify-content: center; } .contact-foot { display: flex; align-items: center; flex-wrap:wrap; } .adress{ margin-bottom: 2rem; position: relative; } .adress:before{ content: ''; display: block; width: 100%; height: 120px; background-image: url(images/camping-bois-du-ce-deco-footer.png); background-repeat: no-repeat; background-size: 100%; background-position: center center; margin-bottom: 2rem; } .telephone *, .mail *{ text-transform: initial !important; font-weight: bold; } #horaires{ text-align: left; margin-bottom: 50px; } .contact-foot i { display: inline-block; width: 35px; height: 35px; border-radius: 100%; margin: 0 auto 5px; line-height: 35px; overflow: hidden; font-size: x-large; padding-top: 4px; transition: 0.2s ease-in-out; } .contact-foot .contact-box { text-align: center; display: inline-block; } .contact-foot .contact-box, .contact-foot .contact-box *{ font-size: large; text-transform: uppercase; line-height: 1; transition: 0.2s ease-in-out; } .contact-foot:hover i{ -webkit-transform: rotate(360deg) scale(1.1); -moz-transform: rotate(360deg) scale(1.1); -ms-transform: rotate(360deg) scale(1.1); -o-transform: rotate(360deg) scale(1.1); transform: rotate(360deg) scale(1.1); } .row.microdata{ display: flex; align-items: stretch; justify-content: center; } @media screen and (max-width: 920px){ .row.microdata { display: flex; flex-wrap: wrap; justify-content: center; } .contact-foot { float: none!important; width: auto; margin: 0 .25rem!important; flex-basis: 0; flex-grow: 1; } } #title-adress{ text-transform: uppercase; font-size: xx-large; font-weight: bold; } #titre-horaires{ text-transform: uppercase; font-size: x-large; font-weight: bold; color: #005b5b; } #horaires a:after { content: ">"; padding-left: 10px; } .content-horaires { line-height: 1; color: #005b5b; } #titre-paiements{ text-transform: uppercase; font-size: large; font-weight: bold; color: #9aaea3; text-align: left; } .paiement{ line-height: 1; color: #9aaea3; display: inline-block; text-align: left; width: 49%; margin: 0; } .paiement span{ display: block; color: #9aaea3; text-align: left; } @media screen and (max-width: 720px){ footer { padding: 0; } footer .col-4:first-of-type { width: 100%; } footer .col-4:nth-child(2) { display: block; padding: 1rem; } } /* Copyrights */ #copyrights { text-align: center; padding: 0.5rem; background:#9aaea3; } #copyrights * { font-size: medium; color: #fff !important; } @media screen and (max-width: 720px) { #copyrights { padding-bottom: 130px!important; } } /* Logo foot */ #logo-foot { margin: 0 auto; display: block; } /* RGPD */ .gdpr.gdpr-privacy-bar .gdpr-wrapper, .gdpr.gdpr-reconsent-bar .gdpr-wrapper { padding: 5px 30px; } div.gdpr.gdpr-privacy-bar div.gdpr-wrapper div.gdpr-content { padding: 0; } div.gdpr-wrapper .gdpr-info p, .gdpr-wrapper .gdpr-info .gdpr-cookies span, .gdpr-wrapper .gdpr-info .gdpr-cookies span a { font-size: small; } .gdpr.gdpr-privacy-bar .gdpr-wrapper .gdpr-right .gdpr-buttons button.gdpr-agreement, .gdpr.gdpr-reconsent-bar .gdpr-wrapper .gdpr-right .gdpr-buttons button.gdpr-agreement { margin: 0 10px !important; } .gdpr.gdpr-privacy-bar, .gdpr.gdpr-reconsent-bar { bottom: -1px; top: auto; z-index: 999999999; position: fixed !important; } .gdpr.gdpr-privacy-preferences .gdpr-wrapper form>footer input[type="submit"]:active, .gdpr.gdpr-privacy-preferences .gdpr-wrapper form>footer input[type="submit"].focus, .gdpr.gdpr-general-confirmation .gdpr-wrapper form>footer input[type="submit"]:active, .gdpr.gdpr-general-confirmation .gdpr-wrapper form>footer input[type="submit"].focus { vertical-align: top; } .gdpr.gdpr-privacy-preferences .gdpr-wrapper .gdpr-content .gdpr-tab-content>div .gdpr-info .gdpr-cookies-used .gdpr-cookie-title .gdpr-always-active, .gdpr.gdpr-general-confirmation .gdpr-wrapper .gdpr-content .gdpr-tab-content>div .gdpr-info .gdpr-cookies-used .gdpr-cookie-title .gdpr-always-active { font-size: smaller; } .gdpr.gdpr-privacy-preferences .gdpr-wrapper form>footer input[type="submit"]:hover, .gdpr.gdpr-general-confirmation .gdpr-wrapper form>footer input[type="submit"]:hover { color: #fff; text-shadow: none; text-decoration: none; } .gdpr.gdpr-privacy-preferences .gdpr-wrapper form>footer input[type="submit"], .gdpr.gdpr-general-confirmation .gdpr-wrapper form>footer input[type="submit"] { color: #fff; text-shadow: none; text-decoration: none; } div.gdpr-content p a { font-size: inherit; } .gdpr.gdpr-privacy-bar .gdpr-agreement:active, .gdpr.gdpr-privacy-bar .gdpr-agreement:focus, .gdpr.gdpr-reconsent-bar .gdpr-agreement:active, .gdpr.gdpr-reconsent-bar .gdpr-agreement:focus{ border-color: rgba(0, 0, 0, 0.1); box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.1); } .gdpr.gdpr-privacy-bar .gdpr-agreement, .gdpr.gdpr-reconsent-bar .gdpr-agreement{ color: #fff; } /* LINK BUTTON */ .link-button{ padding: .5rem 1rem; color:#fff !important; text-decoration: none; background:#8f9e92; text-transform: uppercase; font-size: 1.2rem; font-weight: bold; transition: .2s ease-in-out; display: table; } .link-button:hover{ background:#b2bcb4 !important; } /* Parallax */ /* HOME FIRST */ #home-first:before{ content: ''; width: 220px; height: 100px; background-image: url(images/camping-bois-du-ce-deco-section.png); background-repeat: no-repeat; background-size: contain; display:block; margin:0 auto; } /* HOME SECOND */ #home-second{ background-image: url(/wp-content/uploads/2020/08/piscine-camping-vendee.jpg); background-repeat: no-repeat; background-size: 100%; background-position: center top; position: relative; margin-bottom: 100px; position: relative; z-index: 1; } #home-second::after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 25%; background: #fff; z-index: -1; } #home-second .row{ display: flex; flex-wrap: wrap; align-items: stretch; } #home-second .row .col-4{ display: flex; flex-direction: column; align-items: flex-start; justify-content: center; position: relative; z-index: 1; } #home-second .row .col-4::before{ content:""; position: absolute; width: 100%; height: 100%; z-index: -1; background-image: url(images/camping-bois-du-ce-deco-goute.png); background-repeat: no-repeat; background-size: contain; background-position: center center; transform: translateY(-5%); opacity: 0; transition: 1s ease-in-out 1s; } #home-second .row.in-view .col-4::before{ opacity: 1; transform: translateY(0%); } #home-second .col-4 .inline-title { transition-delay: 1s!important; } @media screen and (min-width: 720px){ #home-second .bloc-code { max-width: 80%; margin: 20rem auto 0 auto; background-color: #fff; } } .titre-home-second, .titre-home-fifth{ width: 100%; background: #8f9e92; color: #fff; text-align: center; font-size: xx-large; text-transform: uppercase; margin: 0 0 1rem 0!important; padding: .5rem 0; } #home-second .link-button{ background-color: #005b5b; } @media screen and (max-width: 720px){ #home-second::before { content: ""; width: 100%; height: 150px; background-image: url(/wp-content/uploads/2020/08/piscine-camping-vendee.jpg); display: block; background-size: cover; background-repeat: no-repeat; background-position: center; } #home-second { background-image: none; } .bloc-code p, .bloc-text p { padding: .25rem 1rem; } } /* HOME THIRD */ #home-third .bloc-code{text-align: center;} div#lipsum p a, div#lipsum p strong { display: contents; } #home-third .cta { width: 32%; } @media screen and (min-width: 720px){ #home-third .cta-title, #home-third .link-button { font-size: 1.8rem; } } #home-third .custom-list { max-width: 100%; } #home-third .bloc-text{ margin-top: 2rem; } #home-third p{ display: flex; align-items: center; justify-content: flex-start; } @media screen and (min-width: 720px){ #home-third p:before{ content: ''; display: inline-block; width: 200px; height: 90px; background-image: url(images/arbre.png); background-repeat: no-repeat; background-size: contain; margin: 0 2rem 0 0; background-position: center; } } #home-third .link-button{ display: inline-block; } /* HOME FOURTH */ .services.in-view a { margin-right: 45px; } #home-fourth{ background-image: url(images/camping-bois-du-ce-deco-full.png); background-repeat: no-repeat; background-size: contain; background-position: center center; padding:6rem 0; } #home-fourth .bloc-code{ margin: 2rem 0; } #home-fourth .bloc-text{ text-align: center; margin: 4rem auto 2rem auto !important; } .services{ display: flex; align-items: center; justify-content: center; } .service{ margin: 0 2%; position: relative; line-height: 0; cursor: pointer; } .service:hover:before, .service.ishover:before{ background:rgba(0,91,91,.8); } .service:before{ content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color:rgba(0,0,0,0.3); border-radius: 100%; transition: .2s ease-in-out; } .service:after{ content: ''; position: absolute; top: -5%; left: -5%; width: 110%; height: 110%; border-radius: 100%; border: 1px solid rgba(0,0,0,0.2); z-index: 10; } .titre-service{ position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%); color:#fff !important; text-transform: uppercase; font-weight: bold; font-size: 1.2rem; } .image-service { border-radius: 100%; overflow: hidden; background-color:#fff; } @media screen and (max-width: 720px){ .services { display: block; white-space: nowrap; overflow-x: scroll; } .services a { width: 200px; display: inline-block; margin: 1rem .5rem!important; } } /* HOME FIFTH */ #home-fifth{ background-image: url(images/camping-bois-du-ce-full-width-home-alentours.jpg); background-repeat: no-repeat; background-size: 100%; background-position: center top; position: relative; margin-bottom: 100px; } @media screen and (min-width: 720px){ #home-fifth .bloc-code:first-child { max-width: 80%; margin: 20rem auto 0 auto; background-color: #fff; } } @media screen and (max-width: 720px){ #home-fifth { background-position: center top; padding-top: 9rem; } } #home-fifth .bloc-code:last-child { margin-top: 25px; width: 100%; } #home-fifth .titre-service { font-size: 1.5rem; width: 200px; text-align: center; } section#home-fifth { margin-bottom: 0; } #home-fifth .cta { width: 49%; position: relative; } #home-fifth .custom-list { max-width: 80%; } #home-fifth .cta-descr{ position: absolute; top: 50%; left: 50%; -webkit-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); transform:translate(-50%,-50%); background:transparent; z-index: 10; transition: .2s ease-in-out; } #home-fifth .cta-descr .cta-title{ font-size: xx-large; } #home-fifth .cta-img span{ top: 60% !important; } #home-fifth .cta:hover .cta-descr, #home-fifth .cta.ishover .cta-descr{ top: 40%; } .col-map iframe { height: 100%; } #home-fifth .row { display: flex; flex-wrap: wrap; } .titre-home-fifth { width: 100%; } @media screen and (max-width: 720px){ #home-fifth .titre-service { width: 90%; font-size: large; white-space: normal; } } /* Bloc de texte + images */ .col-images { display: flex; flex-wrap: wrap; } .col-images .progressive { width: 50%; } .inline-title{ padding: 0 1rem 1rem 0; } .col-content p{ margin:.3rem 1rem; } /* Animations */ .col-images .progressive:nth-child(1) { transform: translate(-10px, -10px) scale(0.8); } .col-images .progressive { opacity: 0; transition: 1s ease-in-out; } .col-images .progressive:nth-child(2) { transform: translate(10px, -10px) scale(0.8); transition-delay: .2s!important; } .col-images .progressive:nth-child(3) { transform: translate(-10px, 10px) scale(0.8); transition-delay: .4s!important; } .col-images .progressive:nth-child(4) { transform: translate(10px, 10px) scale(0.8); transition-delay: .5s!important; } .col-images.in-view .progressive { transform: translate(0,0) scale(1); opacity: 1; } .inline-title, .titre-img-full { transform: translateX(-5%); opacity: 0; transition: 1s ease-in-out; } .inline-title span { transition: 1s ease-in-out .5s; transform: translateX(-10%); opacity: 0; } .in-view .inline-title, .in-view .inline-title span, .in-view .titre-img-full { transform: translateX(0%); opacity: 1; } .link-button { transform: scale(.8) translateX(-5%); opacity: 0; transition: 1s ease-in-out, background .2s ease-in-out; } .link-button.in-view { transform: scale(1) translateX(0); opacity: 1; } .section-title { transform: translateY(-15%); opacity: 0; transition: 1s ease-in-out; } .section-title span { transform: translateY(-15%); opacity: 0; transition: 1s ease-in-out .5s; } .in-view .section-title, .in-view .section-title span { transform: translateY(0%); opacity: 1; } .list-of-2 .cta:first-of-type { transform: translateX(-5%); transition: 1s ease-in-out .2s; } .list-of-2 .cta:last-of-type { transform: translateX(5%); transition: 1s ease-in-out .4s; } .list-of-2 .cta { opacity: 0; } .list-of-2.in-view .cta { opacity: 1; transform: translateX(0%); } .service, .pdf-link { transform: translateX(-15%); opacity: 0; transition: 1s ease-in-out; } .pdf-link{ transition: 1s ease-in-out, background .2s ease-in-out 0s!important; } .service:nth-child(2), .pdf-link:nth-child(2) { transition: 1s ease-in-out .2s, background .2s ease-in-out 0s!important; } .service:nth-child(3), .pdf-link:nth-child(3) { transition: 1s ease-in-out .4s, background .2s ease-in-out 0s!important; } .service:nth-child(4), .pdf-link:nth-child(4) { transition: 1s ease-in-out .6s, background .2s ease-in-out 0s!important; } .services.in-view .service, .in-view > .pdf-link { transform: translateX(0%); opacity: 1; } @media screen and (max-width: 720px){ #section-pdf .pdf-link { margin: 1rem auto; display: inline-flex; } #section-pdf .pdf-link .pdf-link-decr { max-width: 80%; white-space: initial; } } /* biblio */ #biblio-second .cta{ width: 49% } #biblio-second .list-pages{ width: 90%; max-width: none; } #biblio-second .cta-title{ font-size: 1.7rem; } .heberg-content-wrap li{ list-style-image:url(images/puce.png); } /* Bloc 2 cols with image */ /* + bloc texte + image de fond + double image */ .container{position: relative;} .bloc-2-cols-with-img, .bloc-text-with-bg-img{ flex-wrap: wrap; position: relative; width: 80%; margin: 20rem auto 0; background-color: #fff; } .titre-2-cols-with-img, .titre-bloc-text-with-bg-img{ width: 100%; background:#8f9e92; color:#fff; text-align: center; font-size: xx-large; text-transform: uppercase; margin: 0 0 1rem 0 !important; padding: .5rem 0; } .bg-bloc-2-cols-with-img, .bg-bloc-text-with-bg-img{ position: absolute !important; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -1; object-position: center; max-height: 700px; } .container-double-image{ display: flex; align-items: center; justify-content: center; } .container-double-image > a.progressive { flex-basis: 0; flex-grow: 1; } .container-double-image > a.progressive:first-of-type{ margin: 0 1% 0 0; transition: .6s ease-in-out; transition-delay: .6s; -webkit-transform:translate(-15px,0) scale(.9); -ms-transform:translate(-15px,0) scale(.9); -o-transform:translate(-15px,0) scale(.9); transform:translate(-15px,0) scale(.9); opacity: 0; } .container-double-image > a.progressive:last-of-type{ margin: 0 0 0 1%; transition: .6s ease-in-out; transition-delay: .8s; -webkit-transform:translate(15px,0) scale(.9); -ms-transform:translate(15px,0) scale(.9); -o-transform:translate(15px,0) scale(.9); transform:translate(15px,0) scale(.9); opacity: 0; } .in-view .container-double-image > a.progressive{ opacity: 1; -webkit-transform: translate(0) scale(1); -ms-transform: translate(0) scale(1); -o-transform: translate(0) scale(1); transform: translate(0) scale(1); } /* bloc text with map */ .bloc-with-map{ align-items: stretch; } .bloc-with-map:before{ content: ''; position: absolute; left: 50%; top: -10%; -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); -o-transform:rotate(45deg); transform:rotate(45deg); height: 60px; width: 60px; background-color: #fff; z-index: 1; } .bloc-with-map .col-6{ margin: 0 !important; flex-basis: 0; flex-grow: 1; } .bloc-with-map .col-text{ padding: 4rem 2rem; background-color: #e5e5e5 !important; } .bloc-with-map .col-text .inline-title{ text-align: center; border-bottom: 0; } .bloc-with-map .col-text p{ text-align: center; } .bloc-with-map .link-button{ margin: 1rem auto; } /* map alone */ .map-alone{ margin: auto; background-color: #8f9e92; padding: 1rem 0; } @media screen and (min-width: 720px){ #form-container{ margin: auto; max-width: 50vw; } } /******************************* BANDEAU GDPR *******************************/ #moove_gdpr_cookie_info_bar.moove-gdpr-dark-scheme { background: #005B5B !important; /* Couleur Background */ border-top: 3px solid #8F9E92 !important; /* Couleur 1 */ /* Bordure au choix */ padding: 10px !important; z-index: 99009999999 !important; } span.change-settings-button { color: #8F9E92 !important; /* Couleur 1 */ text-decoration: none !important; } span.change-settings-button:hover { text-decoration: underline !important; } #moove_gdpr_cookie_modal .moove-gdpr-modal-content .moove-gdpr-modal-close i, #moove_gdpr_cookie_modal .moove-gdpr-modal-content .moove-gdpr-modal-close span.gdpr-icon { background-color: #005B5B !important; /* Couleur 2 */ border: 1px solid #005B5B !important; /* Couleur 2 */ } #moove_gdpr_cookie_modal .moove-gdpr-modal-content .moove-gdpr-modal-left-content #moove-gdpr-menu li a i, #moove_gdpr_cookie_modal .moove-gdpr-modal-content .moove-gdpr-modal-left-content #moove-gdpr-menu li a span.gdpr-icon, #moove_gdpr_cookie_modal .moove-gdpr-modal-content .moove-gdpr-modal-left-content #moove-gdpr-menu li button i, #moove_gdpr_cookie_modal .moove-gdpr-modal-content .moove-gdpr-modal-left-content #moove-gdpr-menu li button span.gdpr-icon { color: #005B5B !important; /* Couleur 2 */ } #moove_gdpr_cookie_modal .moove-gdpr-modal-content .moove-gdpr-modal-close:hover i, #moove_gdpr_cookie_modal .moove-gdpr-modal-content .moove-gdpr-modal-close:hover span.gdpr-icon { background-color: #fff !important; color: #005B5B !important; /* Couleur 2 */ } #moove_gdpr_cookie_modal .cookie-switch .cookie-slider { background-color: #8F9E92 !important; /* Couleur 1 */ } #moove_gdpr_cookie_modal .cookie-switch .cookie-slider:after { color: #8F9E92 !important; /* Couleur 1 */ } #moove_gdpr_cookie_modal .checkbox-selected .cookie-switch .cookie-slider { background: #191919 !important; /* Couleur Switch Off */ } #moove_gdpr_cookie_modal .checkbox-selected .cookie-switch .cookie-slider:after { color: #191919 !important; /* Couleur Switch Off */ } div#moove_gdpr_cookie_info_bar { z-index: 9999999999 !important; } .lity { z-index: 99999999999 !important; } @media screen and (max-width: 767px) { button.mgbutton.moove-gdpr-modal-save-settings.button-visible, #moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container .moove-gdpr-info-bar-content a.mgbutton, #moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container .moove-gdpr-info-bar-content button.mgbutton { font-size: 14px !important; padding: 8px 16px !important; float: right; } } div#lipsum { text-align: justify; } .map-google .bloc-code { text-align: center; margin-top: 30px; } .lien-puy a{color: #005b5b;} .inter-lien ul li { margin-bottom: 15px; } #widgetContainer .header-widget.clearfix { display: none !important; } /* RESPO */ @media screen and (max-width: 767px) { section#section-3190, section#ouvert-contact, section#section-18230, section#section-18250, section#section-18430, section#section-18431, section#section-18433, section#section-3170, section#section-3171, section#section-3173, section#section-18420, section#section-18421, section#section-18423, section#brasserie, section#cheminfer, section#maulevrier{ padding: 0px 10px; } section#maulevrier iframe { max-width: 100%; } }