body {color: #fff; background-color: #090909; font-family: 'Zen Kaku Gothic New'; font-size: 18px} a {color: #fff} input, textarea, select, option {font: 400 1em Zen Kaku Gothic New} header, aside#nav {} header .background_header, aside#nav .background_header, aside > nav .background_header, body.mobile header nav ul, body.mobile aside#nav div > nav ul.no_flex, body:not(#accueil) header .flex > div.container_flex.large > .background_header {background-color: #090909; } header .header_wrapper { } header .header_wrapper a { } header a:not(.button), aside#nav a:not(.button), #button_open, #button_close {} header nav ul > li > a:not(.button), aside#nav nav ul > li > a:not(.button), header nav .menu_link, aside#nav nav .menu_link, header > .center > .no_flex {transition: all 0.3s linear} #button_open, #button_close {transition: all 0.3s linear} header #change-langue {} header nav ul > li:hover, header nav ul > li:hover > a, aside#nav nav ul > li:hover, aside#nav nav ul > li:hover > a {transition: all 0.3s linear} header nav ul > li:hover > a:not(.button), aside#nav nav ul > li:hover > a:not(.button) {} header nav ul > li#active, aside#nav nav ul > li#active, header nav ul > li#active > a, aside#nav nav ul > li#active, aside#nav nav ul > li#active > a {transition: all 0.3s linear} header nav ul > li#active, aside#nav nav ul > li#active, header nav ul > li#active > a:not(.button), header nav ul > li#active > span, aside#nav nav ul > li#active > a:not(.button), aside#nav nav ul > li#active > span {color: #f6912f; transition: all 0.3s linear} header #logo, aside#nav #logo {} header > .center > ul.flex > li * {} footer {background-color: #181818; } footer a:not(.button) {} .footer_wrapper {} .footer_wrapper a {} footer i, footer .background_i_footer {} body.formulaire section#main, body.formulaire section#main a:not(.button) {} body.formulaire section#main {} body.formulaire section#main h1 {} body.formulaire section#main .block {} body.formulaire section#main .block a:not(.button) {} body.formulaire section form input, body.formulaire section form select, body.formulaire section form textarea , body.formulaire section form option {color: #fff; background-color: #090909; border-color: #797979; } body.formulaire section form input::placeholder, body.formulaire section form textarea::placeholder {color: #fff; } body.formulaire section form input:focus, body.formulaire section form select:focus, body.formulaire section form textarea:focus, body.formulaire section form option:focus {border-color: #f6912f; } body.formulaire section form .button {} body.formulaire section form .button:hover {} /* NE RIEN AJOUTER AU DESSUS DE CE NIVEAU CAR LE CONTENU Y EST AUTOMATIQUEMENT GENERE PAR LE SYSTEME ; TOUT AJOUT DOIT SE FAIRE CI-DESSOUS */ @keyframes fadeIn { from { opacity:0; visibility:hidden} to { opacity:1; visibility:visible)} } body { position: relative; animation: fadeIn 2.5s ease-out 0s 1 both} body.hide { overflow: hidden} body #main section .center { z-index: 2} .center { width: 100%; max-width: 1680px; margin: 0 auto; position: relative;} @media screen and (max-width: 1290px) { .center { width: 95%} } @media screen and (max-width: 768px) { section .flex > .container_flex.xlarge, section .flex > .container_flex.large, section .flex > .container_flex.slarge, section .flex > .container_flex.xmedium, section .flex > .container_flex.medium, section .flex > .container_flex.smedium, section .flex > .container_flex.small, section .flex > .container_flex.xsmall, section .flex > .container_flex.xxsmall { margin: 0 0 4em !important} } section { position: relative; z-index: 2} section > .no_flex { width: 100%; margin: 0 0 0} section .center p { line-height: 1.5em} section:not(#slider) h1, section:not(#slider) h2 { margin: 0 0 1em} section h1, section h2 { padding: 0 0 0; margin: 0 0 0.5em} section h1, section p.title { font-size: 2.5em; font-weight: bold; text-align: initial; text-transform: uppercase; text-shadow: 0 1px 0 rgba(255,255,255,0.6), 0 2px 0 rgba(0,0,0,0.4), -1px 0 0 rgba(255,255,255,0.6), -1px 0 0 rgba(0,0,0,0.4)} @media screen and (max-width: 1366px) { section h1, section p.title { font-size: 1.9em} } @media screen and (max-width: 768px) { section h1, section p.title { text-align: center} } @media screen and (max-width: 480px) { section h1, section p.title { font-size: 1.4em} } section h2 { font-size: 1.7em; font-weight: bold; text-transform: uppercase; text-shadow: 0 1px 0 rgba(255,255,255,0.6), 0 2px 0 rgba(0,0,0,0.4), -1px 0 0 rgba(255,255,255,0.6), -1px 0 0 rgba(0,0,0,0.4)} @media screen and (max-width: 480px) { section h2 { font-size: 1.2em} } section h3 { font-size: 1.3em; padding: 0 0 0; font-weight: bold} @media screen and (max-width: 480px) { section h3 { font-size: 1em} } .block { padding: 0; border-radius: 0} strong, b { color: #f6912f} .no_flex a.shadowbox.thumb { display: inline-block; width: 32.5%; height: 14.5vw; position: relative; line-height: 0; vertical-align: top} .container_flex > a.shadowbox.thumb, .container_flex > * > a.shadowbox.thumb { display: block; height: 100%; width: 100%; position: relative; line-height: 0} a.shadowbox.thumb:before, a.shadowbox.thumb:after{ content: ''; position: absolute; width: 50%; height: 1em; max-height: 50%; z-index: -1; background:#181818} a.shadowbox.thumb:before { bottom: 14px; left: 7px; transform: rotate(-3deg); box-shadow: 0 6px 15px #181818} .no_flex > .skitter:before, section .flex.content_end > .container_flex.medium > p > a.shadowbox.thumb:before { transform: rotate(-1deg)} a.shadowbox.thumb:after { bottom: 14px; right: 7px; transform: rotate(3deg); box-shadow: 0 6px 15px #181818} section .flex.content_end > .container_flex.medium > p > a.shadowbox.thumb:after { transform: rotate(1deg)} a.shadowbox.thumb > img { width: 100%} .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent} .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0} .slick-list:focus { outline: none} .slick-list.dragging { cursor: pointer; cursor: hand} .slick-slider .slick-track,.slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0)} .slick-track { position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto} .slick-loading .slick-track { visibility: hidden} .slick-slide { display: none; float: left;height: 100%;min-height: 1px;min-height: 1px;} .slick-initialized .slick-slide { display: block} .slick-loading .slick-slide { visibility: hidden} .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent} .slick-arrow.slick-hidden { display: none} p.hidden { display: none} p.hidden_5 { display: block} @media screen and (max-width: 1290px) { p.hidden_4 { display: block; margin-bottom: 1em !important} } @media screen and (max-width: 1024px) { p.hidden_3, p.hidden_4 { display: block; margin-bottom: 1em !important} } @media screen and (max-width: 768px) { p.hidden_2, p.hidden_3, p.hidden_4 { display: block; margin-bottom: 1em !important} } .skitter { max-width: 1290px; max-height: 100%; height: 100% !important; min-height: 300px; background: none; z-index: 1; margin: 0 auto 2em} .skitter .container_skitter { max-height: 100%; height: 100% !important} .skitter .image, .skitter img { border-radius: 0; object-fit: cover; object-position: center} .skitter .image > .shadowbox { width: 100%; height: 100%; display: block} .skitter .box_clone, .skitter .box_clone img { height: 100% !important} .skitter .info_slide_dots { bottom: 0; background: rgba(53, 78, 113,0.6); border-radius: 0} .skitter .info_slide_dots .image_number { background: rgba(255, 255, 255,0.4);} .skitter .info_slide_dots .image_number.image_number_select { background: rgba(255, 255, 255,1)} svg.icon { height: 1.4em; width: 1.4em; fill: #333; vertical-align: bottom; margin-right: 0.5em} svg.icon.after { margin-left: 0.5em} svg.icon.after:not(.before) { margin-right: 0} svg.icon.only { margin-right: 0; margin-left: 0} img.icon { max-height: 3.5em} img.miniature { max-height: 8.5em} ul.align_center > li { padding: 0 0 0} ul.align_center > li:before { content: ''; display: none} #main .button:not(.wide):not(.current):not(.empty) { width: auto; border: none; position: relative; text-shadow: none; padding: 0.15em 0.75em 0.4em; text-transform: uppercase; color: #000; background: none; font-weight: bold; font: 18px 'Zen Kaku Gothic New';} #main .button:not(.wide):not(.current):not(.empty):before, #main .button:not(.wide):not(.current):not(.empty):after { content: ''; position: absolute; left: 0; z-index: -1; transition: all 0.3s linear} #main .button:not(.wide):not(.current):not(.empty):before { top: 0; left: 0; right: 0; bottom: 0; background: #f6912f} #main .button:not(.wide):not(.current):not(.empty):before { background: #f6912f} #main .button:not(.wide):not(.current):not(.empty):after { top: 0.25em; left: 0.25em; bottom: -0.25em; right: -0.217em; z-index: -2; background: #ef632f; border-radius: 0; height: 100%; width: 100%; transition: all 0.3s linear 0.1s, border-radius 0.1s linear 0s, z-index 0.1s linear 0s} #main .button:not(.wide):not(.current):not(.empty):after { background: #ef632f} #main .button:not(.wide):not(.current):not(.empty):hover:after { top: calc(100% - 0.25em); left: calc(100% - 0.25em); border-radius: 50%; height: 0.5em; width: 0.5em; z-index: 0; transition: all 0.3s linear, border-radius 0.1s linear 0.3s, z-index 0.1s linear 0.3s} .pagination > .button { border: none} .pagination > .current { text-transform: uppercase; font-weight: bold; text-shadow: 0 1px 0 rgba(255,255,255,0.6), 0 2px 0 rgba(0,0,0,0.4), -1px 0 0 rgba(255,255,255,0.6), -1px 0 0 rgba(0,0,0,0.4); font-size: 1.3em; margin: 0 0 2em} .pagination > .button:nth-child(1):not(.empty) { margin: 0 1em 0 0} .pagination > .button:nth-child(2):not(.empty), .pagination > .current, .pagination > .button:nth-child(4):not(.empty) { margin: 0 1em} .pagination > .button:nth-child(5):not(.empty) { margin: 0 0 0 1em} .pagination > .button.empty { padding: 0 0 0 0; margin: 0 0 0 0} @media screen and (max-width: 768px) { .pagination > .button:nth-child(1):not(.empty), .pagination > .button:nth-child(4):not(.empty) { margin: 0 1em 0 0 !important} .pagination > .button:nth-child(2):not(.empty), .pagination > .button:nth-child(5):not(.empty) { margin: 0 0 0 1em !important} .pagination > .container_flex.xxsmall.current { margin: 1em 0 1em !important} .pagination > .button.empty { visibility: hidden; width: 0} .pagination > .button.empty:first-child { margin-right: -1em !important} .pagination > .button.empty:last-child { margin-left: -1em !important} } #main table { margin: 0 0 1em; width: 100%; table-layout: fixed} #main table tr > th { font-weight: bold; text-transform: uppercase; border-top: 1px solid; border-left: 1px solid; border-right: 1px solid; padding: 0.75em 0.25em} #main table tr > td { border-top: 1px solid; border-left: 1px solid; padding: 0.75em 0.25em} #main table tr > td:last-child { border-right: 1px solid} #main table tr:last-child > td { border-bottom: 1px solid} #main table tr > td { vertical-align: middle; width: 1%} #main table tr > td > h3 { font-size: 1.1em; font-weight: bold; text-transform: uppercase} @media screen and (max-width: 640px) { #main table, #main table > * { display: block} #main table tr { display: flex; flex-wrap: wrap; border: 1px solid} #main table tr > td { width: 100% !important; border: 1px solid; border-bottom: none; text-align: center !important} #main table tr > td *:not(ul):not(li) { text-align: center !important} #main table tr:last-child > td { border-bottom: none} #main table tr:last-child > td:last-child { border-bottom: 1px solid} #main table tr > td:first-child, #main table tr > td:first-child * { font-weight: bold} } body .slider { min-height: 100vh} .slider-container { position: relative; height: 100%; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: grab; overflow: hidden;} .slider-control { z-index: 2; position: absolute; top: 0; width: 1em; height: 100%; -webkit-transition: opacity 0.3s; transition: opacity 0.3s; will-change: opacity; opacity: 0.3; display: flex; align-items: center; flex-wrap: nowrap; font-size: 3em; color: #fff} .slider-control.inactive:hover { cursor: auto} .slider-control:not(.inactive):hover { opacity: 1; cursor: pointer} #slider.inactive .slider-pagi { display: none} .slider-control.left { left: 0; justify-content: start; padding-left: 0.25em; background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0) 100%); background: linear-gradient(to right, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0) 100%)} .slider-control.right { right: 0; justify-content: end; padding-right: 0.25em; background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.18) 100%); background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.18) 100%)} .slider-control.inactive, .slider-control.inactive:hover { opacity: 0} .slider-pagi { position: absolute; z-index: 3; left: 50%; bottom: 8rem; opacity: 0.3; -webkit-transform: translateX(-50%); transform: translateX(-50%); font-size: 0; list-style-type: none; transition: opacity 0.3s} @media screen and (max-width: 1024px) { .slider-pagi { left: 75%; bottom: 2rem; -webkit-transform: none; transform: none} } @media screen and (max-width: 768px) { .slider-pagi { display: none} } .slider-pagi:hover { opacity: 1} .slider-pagi__elem { position: relative; display: inline-block; vertical-align: top; width: 2rem; height: 2rem; margin: 0 0.5rem; border-radius: 50%; border: 2px solid #fff; cursor: pointer} .slider-pagi__elem:before { content: ""; position: absolute; left: 50%; top: 50%; width: 1.2rem; height: 1.2rem; background: #fff; border-radius: 50%; -webkit-transition: -webkit-transform 0.3s; transition: -webkit-transform 0.3s; transition: transform 0.3s; transition: transform 0.3s, -webkit-transform 0.3s; -webkit-transform: translate(-50%, -50%) scale(0); transform: translate(-50%, -50%) scale(0)} .slider-pagi__elem.active:before, .slider-pagi__elem:hover:before { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1)} .slider { z-index: 1; position: relative; height: 100%} .slider.animating { -webkit-transition: -webkit-transform 0.5s; transition: -webkit-transform 0.5s; transition: transform 0.5s; transition: transform 0.5s, -webkit-transform 0.5s; will-change: transform} .slider.animating .slide__bg { -webkit-transition: -webkit-transform 0.5s; transition: -webkit-transform 0.5s; transition: transform 0.5s; transition: transform 0.5s, -webkit-transform 0.5s; will-change: transform} .slide { position: absolute; top: 0; width: 100%; height: 100%; overflow: hidden; margin: 0 0} @media screen and (max-width: 360px) { .slide { margin: 0 0; width: 100%} } .slide.active .slide__overlay, .slide.active .slide__text { opacity: 1; padding: 2em 20%} .slide.active .slide__overlay { opacity: 0.8} .slide__bg { position: absolute; top: 0; left: -50%; width: 100%; height: 100%; will-change: transform; background-size: cover; background-position: 50% 25%; background-repeat: no-repeat} body:not(.scroll) .slide__bg { background-position: 50% 25% !important} @media screen and (max-width: 640px) and (orientation: landscape) { body:not(.scroll) .slide__bg, .slide__bg { background-position: 50% 0% !important} } @media screen and (max-width: 480px) and (orientation: landscape) { body:not(.scroll) .slide__bg, .slide__bg { background-size: auto 100vh; background-position: 50% 25% !important} } @media screen and (orientation: portrait) { body .slider { min-height: 30vh} body:not(.scroll) .slide__bg, .slide__bg { background-size: auto 30vh; background-position: 50% 0% !important} } .slide .slide__overlay-path { fill: #fff} .slide:nth-child(1) { left: 0} .slide:nth-child(1) .slide__bg { left: 0} .slide:nth-child(2) { left: 100%} .slide:nth-child(2) .slide__bg { left: -50%} .slide:nth-child(3) { left: 200%} .slide:nth-child(3) .slide__bg { left: -100%} .slide:nth-child(4) { left: 300%} .slide:nth-child(4) .slide__bg { left: -150%} .slide__content { position: absolute; top: 0; left: 0; right: 0; bottom: 0} .slide__overlay { -webkit-transition: opacity 0.2s 0.5s, -webkit-transform 0.5s 0.5s; transition: opacity 0.2s 0.5s, -webkit-transform 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.2s 0.5s; transition: transform 0.5s 0.5s, opacity 0.2s 0.5s, -webkit-transform 0.5s 0.5s; will-change: transform, opacity; -webkit-transform: translate3d(20%, 0, 0); transform: translate3d(20%, 0, 0); opacity: 0} @media (max-width: 1024px) { .slide.active .slide__overlay { -webkit-transform: translateX(-25%); transform: translateX(-25%)} } @media (max-width: 768px) { .slide.active .slide__overlay { display: none} } .slide__overlay path { opacity: 0.8} .overlay_slider { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: #000; opacity: 0.45} .slide__text { position: absolute; top: 50%; left: 0; right: 0; padding: 2em 20%; transform: translateY(-50%); -webkit-transition: opacity 0.5s 0.8s, -webkit-transform 0.5s 0.8s; transition: opacity 0.5s 0.8s, -webkit-transform 0.5s 0.8s; transition: transform 0.5s 0.8s, opacity 0.5s 0.8s; transition: transform 0.5s 0.8s, opacity 0.5s 0.8s, -webkit-transform 0.5s 0.8s; will-change: transform, opacity; opacity: 1} @media screen and (max-width: 1366px) { .slide__text { right: 0} } @media screen and (max-width: 1024px) { .slide__text { -webkit-transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; padding: 0 1em 0 0} } @media screen and (max-width: 768px) { .slide__text { left: 0; padding: 3em 1.5em 0; width: 100%; -webkit-transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s} .slide.active .slide__overlay, .slide.active .slide__text { padding: 3em 1.5em 0} } .slide__text .slide-title:nth-child(n+2) { margin-top: 1rem} .slide__text .slide-text:nth-child(n+2) { margin-top: 2rem} .slide__text h1 { font-size: 3rem; margin: 0 0; position: relative; padding: 0; text-align: center; font-weight: bold; text-shadow: 0 1px 0 rgba(255,255,255,0.6), 0 2px 0 rgba(0,0,0,0.4), -1px 0 0 rgba(255,255,255,0.6), -1px 0 0 rgba(0,0,0,0.4); text-transform: uppercase} .slide__text h2 { font-size: 1.8rem; margin: 0 0; position: relative; padding: 0; text-align: center; font-weight: normal; text-shadow: 0 1px 0 rgba(255,255,255,0.6), 0 2px 0 rgba(0,0,0,0.4), -1px 0 0 rgba(255,255,255,0.6), -1px 0 0 rgba(0,0,0,0.4); text-transform: uppercase} .slide__text p { text-align: center} @media screen and (max-width: 1366px) { .slide__text h1 { font-size: 1.9rem} .slide__text h2 { font-size: 1.4rem} } @media screen and (max-width: 768px) { .slide__text h1, .slide__text h2, .slide__text p { text-align: center} } @media screen and (max-width: 480px) { .slide__text h1 { font-size: 1.4rem} .slide__text h2 { font-size: 1rem} .slide__text a { font-size: 0.8rem} } /* .slide__text > h1 > span > span, */ /* .slide__text > h2 > span > span { display: block} */ .slide__text p { font-weight: normal; text-shadow: 0 1px 0 rgba(255,255,255,0.6), 0 2px 0 rgba(0,0,0,0.4), -1px 0 0 rgba(255,255,255,0.6), -1px 0 0 rgba(0,0,0,0.4); font-size: 1.4rem} .slide__text > * { animation: fadeInUp 1s linear 0.5s 1 both} body.hidden { max-height: 100vh; overflow: hidden} body.hidden > header > .flex > .no_flex, body.hidden > header > .fixed, body.hidden > section, body.hidden #main, body.hidden > footer { opacity: 0.05; transition: all 0.3s linear} .responsiveslide { padding: 4rem 0 0} .rslides { position: relative; list-style: none; overflow: hidden; width: 100% !important; padding: 0; margin: 2em 0 0 !important} .rslides li { -webkit-backface-visibility: hidden; position: absolute; display: block; display: none; width: 100%; left: 0; top: 0; padding: 0 !important} .rslides li:first-child { position: relative; display: block} .rslides li:before { content: ''; display: none} .rslides img { display: block; height: auto; float: left; width: 100%; border: 0} .callbacks_container { position: relative; overflow: hidden} .callbacks { position: relative; list-style: none; overflow: hidden; width: 100%; padding: 0; margin: 0} .callbacks > .no_flex { width: 100%} .callbacks li { width: 100%; margin: 0 !important; position: absolute; left: 0; top: 0} .callbacks img { display: block; position: relative; z-index: 1; height: auto; width: 100%; border: 0} .callbacks .caption { display: block; position: absolute; z-index: 2; font-size: 20px; text-shadow: none; color: #fff; background: #000; background: rgba(0,0,0, .8); left: 0; right: 0; bottom: 0; padding: 10px 20px; margin: 0; max-width: none} .callbacks_nav { position: absolute; top: 0; color: #616161 !important; padding: 0.5em 0.6em 1.5em!important; border: none; overflow: hidden} .callbacks_nav:hover { border: none} .callbacks_nav:active { opacity: 1.0} .callbacks_nav.prev { left: 0} .callbacks_nav.next { right: 0} .callbacks_nav:after { content: ''; position: absolute; left: 50%; bottom: -1.2em; transform: translateX(-50%); border-radius: 50%; width: 0.7em; height: 0.7em; z-index: -2; background: #a0db3d; transition: all 500ms cubic-bezier(0.77, 0, 0.175, 1); box-shadow: 0 -2px 3px rgba(0,0,0,0.2)} .callbacks_nav:hover { color: #616161 !important; padding-top: 0.5em !important; padding-bottom: 1.5em !important; transition: all 500ms cubic-bezier(0.77, 0, 0.175, 1)} .callbacks_nav:hover:after { bottom: 3px; transition: all 500ms cubic-bezier(0.77, 0, 0.175, 1)} .ui-helper-hidden { display: none} .ui-helper-hidden-accessible { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px} .ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none} .ui-helper-clearfix:before, .ui-helper-clearfix:after { content: ""; display: table; border-collapse: collapse} .ui-helper-clearfix:after { clear: both} .ui-helper-clearfix { min-height: 0} .ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0)} .ui-front { z-index: 100} .ui-state-disabled { cursor: default !important} .ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat} .ui-widget-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%} .ui-accordion .ui-accordion-header { display: block; cursor: pointer; position: relative; margin: 2px 0 0 0; padding: .5em .5em .5em .7em; min-height: 0; font-size: 100%} .ui-accordion .ui-accordion-icons { padding-left: 2.2em} .ui-accordion .ui-accordion-icons .ui-accordion-icons { padding-left: 2.2em} .ui-accordion .ui-accordion-header .ui-accordion-header-icon { position: absolute; left: .5em; top: 50%; margin-top: -8px} .ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; overflow: auto} .ui-autocomplete { position: absolute; top: 0; left: 0; cursor: default} .ui-button { display: inline-block; position: relative; padding: 0; line-height: normal; margin-right: .1em; cursor: pointer; vertical-align: middle; text-align: center; overflow: visible} .ui-button, .ui-button:link, .ui-button:visited, .ui-button:hover, .ui-button:active { text-decoration: none} .ui-button-icon-only { width: 2.2em} button.ui-button-icon-only { width: 2.4em} .ui-button-icons-only { width: 3.4em} button.ui-button-icons-only { width: 3.7em} .ui-button .ui-button-text { display: block; line-height: normal} .ui-button-text-only .ui-button-text { padding: .4em 1em} .ui-button-icon-only .ui-button-text, .ui-button-icons-only .ui-button-text { padding: .4em; text-indent: -9999999px} .ui-button-text-icon-primary .ui-button-text, .ui-button-text-icons .ui-button-text { padding: .4em 1em .4em 2.1em} .ui-button-text-icon-secondary .ui-button-text, .ui-button-text-icons .ui-button-text { padding: .4em 2.1em .4em 1em} .ui-button-text-icons .ui-button-text { padding-left: 2.1em; padding-right: 2.1em} input.ui-button { padding: .4em 1em} .ui-button-icon-only .ui-icon, .ui-button-text-icon-primary .ui-icon, .ui-button-text-icon-secondary .ui-icon, .ui-button-text-icons .ui-icon, .ui-button-icons-only .ui-icon { position: absolute; top: 50%; margin-top: -8px} .ui-button-icon-only .ui-icon { left: 50%; margin-left: -8px} .ui-button-text-icon-primary .ui-button-icon-primary, .ui-button-text-icons .ui-button-icon-primary, .ui-button-icons-only .ui-button-icon-primary { left: .5em} .ui-button-text-icon-secondary .ui-button-icon-secondary, .ui-button-text-icons .ui-button-icon-secondary, .ui-button-icons-only .ui-button-icon-secondary { right: .5em} .ui-buttonset { margin-right: 7px} .ui-buttonset .ui-button { margin-left: 0; margin-right: -.3em} input.ui-button::-moz-focus-inner, button.ui-button::-moz-focus-inner { border: 0; padding: 0} .ui-datepicker { width: 17em; padding: .2em; display: none} .ui-datepicker .ui-datepicker-header { position: relative; padding: .2em 0} .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position: absolute; background: none !important; cursor: pointer; font-weight: 900; font-size: 1.5em} .ui-datepicker .ui-datepicker-prev { left: 0 !important} .ui-datepicker .ui-datepicker-next { right: 0 !important} .ui-datepicker .ui-datepicker-prev:hover, .ui-datepicker .ui-datepicker-next:hover, .ui-datepicker .ui-datepicker-prev .ui-state-hover, .ui-datepicker .ui-datepicker-next .ui-state-hover { color: #a0db3d !important} .ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: none} .ui-datepicker .ui-datepicker-prev:before { content: '←'} .ui-datepicker .ui-datepicker-prev.ui-state-disabled:before { content: ''} .ui-datepicker .ui-datepicker-next:after { content: '→'} .ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; text-transform: uppercase; text-shadow: 0 1px 0 rgba(255,255,255,0.6), 0 2px 0 rgba(0,0,0,0.4), -1px 0 0 rgba(255,255,255,0.6), -1px 0 0 rgba(0,0,0,0.4)} .ui-datepicker .ui-datepicker-title select { font-size: 1em; margin: 1px 0} .ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year { width: 45%; } .ui-datepicker table { width: 100%; font-size: .9em; border-collapse: collapse; margin: 0 0 .4em} .ui-datepicker th { padding: .7em .3em; text-align: center; border: 0; vertical-align: middle} .ui-datepicker td { border: 0; padding: 1px; vertical-align: middle} .ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: center; text-decoration: none} .ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding: 0 .2em; border-left: 0; border-right: 0; border-bottom: 0} .ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width: auto; overflow: visible} .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float: left} .ui-datepicker.ui-datepicker-multi { width: auto} .ui-datepicker-multi .ui-datepicker-group { float: left} .ui-datepicker-multi .ui-datepicker-group table { width: 95%; margin: 0 auto .4em} .ui-datepicker-multi-2 .ui-datepicker-group { width: 50%} .ui-datepicker-multi-3 .ui-datepicker-group { width: 33.3%} .ui-datepicker-multi-4 .ui-datepicker-group { width: 25%} .ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header, .ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width: 0} .ui-datepicker-multi .ui-datepicker-buttonpane { clear: left} .ui-datepicker-row-break { clear: both; width: 100%; font-size: 0} /* RTL support */ .ui-datepicker-rtl { direction: rtl} .ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto} .ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto} .ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto} .ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto} .ui-datepicker-rtl .ui-datepicker-buttonpane { clear: right} .ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left} .ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current, .ui-datepicker-rtl .ui-datepicker-group { float: right} .ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header, .ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width: 0; border-left-width: 1px} .ui-dialog { overflow: hidden; position: absolute; top: 0; left: 0; padding: .2em; outline: 0} .ui-dialog .ui-dialog-titlebar { padding: .4em 1em; position: relative} .ui-dialog .ui-dialog-title { float: left; margin: .1em 0; white-space: nowrap; width: 90%; overflow: hidden; text-overflow: ellipsis} .ui-dialog .ui-dialog-titlebar-close { position: absolute; right: .3em; top: 50%; width: 20px; margin: -10px 0 0 0; padding: 1px; height: 20px} .ui-dialog .ui-dialog-content { position: relative; border: 0; padding: .5em 1em; background: none; overflow: auto} .ui-dialog .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background-image: none; margin-top: .5em; padding: .3em 1em .5em .4em} .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset { float: right} .ui-dialog .ui-dialog-buttonpane button { margin: .5em .4em .5em 0; cursor: pointer} .ui-dialog .ui-resizable-se { width: 12px; height: 12px; right: -5px; bottom: -5px; background-position: 16px 16px} .ui-draggable .ui-dialog-titlebar { cursor: move} .ui-draggable-handle { -ms-touch-action: none; touch-action: none} .ui-menu { list-style: none; padding: 0; margin: 0; display: block; outline: none} .ui-menu .ui-menu { position: absolute} .ui-menu .ui-menu-item { position: relative; margin: 0; padding: 3px 1em 3px .4em; cursor: pointer; min-height: 0; list-style-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7")} .ui-menu .ui-menu-divider { margin: 5px 0; height: 0; font-size: 0; line-height: 0; border-width: 1px 0 0 0} .ui-menu .ui-state-focus, .ui-menu .ui-state-active { margin: -1px} .ui-menu-icons { position: relative} .ui-menu-icons .ui-menu-item { padding-left: 2em} .ui-menu .ui-icon { position: absolute; top: 0; bottom: 0; left: .2em; margin: auto 0} .ui-menu .ui-menu-icon { left: auto; right: 0} .ui-progressbar { height: 2em; text-align: left; overflow: hidden} .ui-progressbar .ui-progressbar-value { margin: -1px; height: 100%} .ui-progressbar .ui-progressbar-overlay { background: url("data:image/gif;base64,R0lGODlhKAAoAIABAAAAAP///yH/C05FVFNDQVBFMi4wAwEAAAAh+QQJAQABACwAAAAAKAAoAAACkYwNqXrdC52DS06a7MFZI+4FHBCKoDeWKXqymPqGqxvJrXZbMx7Ttc+w9XgU2FB3lOyQRWET2IFGiU9m1frDVpxZZc6bfHwv4c1YXP6k1Vdy292Fb6UkuvFtXpvWSzA+HycXJHUXiGYIiMg2R6W459gnWGfHNdjIqDWVqemH2ekpObkpOlppWUqZiqr6edqqWQAAIfkECQEAAQAsAAAAACgAKAAAApSMgZnGfaqcg1E2uuzDmmHUBR8Qil95hiPKqWn3aqtLsS18y7G1SzNeowWBENtQd+T1JktP05nzPTdJZlR6vUxNWWjV+vUWhWNkWFwxl9VpZRedYcflIOLafaa28XdsH/ynlcc1uPVDZxQIR0K25+cICCmoqCe5mGhZOfeYSUh5yJcJyrkZWWpaR8doJ2o4NYq62lAAACH5BAkBAAEALAAAAAAoACgAAAKVDI4Yy22ZnINRNqosw0Bv7i1gyHUkFj7oSaWlu3ovC8GxNso5fluz3qLVhBVeT/Lz7ZTHyxL5dDalQWPVOsQWtRnuwXaFTj9jVVh8pma9JjZ4zYSj5ZOyma7uuolffh+IR5aW97cHuBUXKGKXlKjn+DiHWMcYJah4N0lYCMlJOXipGRr5qdgoSTrqWSq6WFl2ypoaUAAAIfkECQEAAQAsAAAAACgAKAAAApaEb6HLgd/iO7FNWtcFWe+ufODGjRfoiJ2akShbueb0wtI50zm02pbvwfWEMWBQ1zKGlLIhskiEPm9R6vRXxV4ZzWT2yHOGpWMyorblKlNp8HmHEb/lCXjcW7bmtXP8Xt229OVWR1fod2eWqNfHuMjXCPkIGNileOiImVmCOEmoSfn3yXlJWmoHGhqp6ilYuWYpmTqKUgAAIfkECQEAAQAsAAAAACgAKAAAApiEH6kb58biQ3FNWtMFWW3eNVcojuFGfqnZqSebuS06w5V80/X02pKe8zFwP6EFWOT1lDFk8rGERh1TTNOocQ61Hm4Xm2VexUHpzjymViHrFbiELsefVrn6XKfnt2Q9G/+Xdie499XHd2g4h7ioOGhXGJboGAnXSBnoBwKYyfioubZJ2Hn0RuRZaflZOil56Zp6iioKSXpUAAAh+QQJAQABACwAAAAAKAAoAAACkoQRqRvnxuI7kU1a1UU5bd5tnSeOZXhmn5lWK3qNTWvRdQxP8qvaC+/yaYQzXO7BMvaUEmJRd3TsiMAgswmNYrSgZdYrTX6tSHGZO73ezuAw2uxuQ+BbeZfMxsexY35+/Qe4J1inV0g4x3WHuMhIl2jXOKT2Q+VU5fgoSUI52VfZyfkJGkha6jmY+aaYdirq+lQAACH5BAkBAAEALAAAAAAoACgAAAKWBIKpYe0L3YNKToqswUlvznigd4wiR4KhZrKt9Upqip61i9E3vMvxRdHlbEFiEXfk9YARYxOZZD6VQ2pUunBmtRXo1Lf8hMVVcNl8JafV38aM2/Fu5V16Bn63r6xt97j09+MXSFi4BniGFae3hzbH9+hYBzkpuUh5aZmHuanZOZgIuvbGiNeomCnaxxap2upaCZsq+1kAACH5BAkBAAEALAAAAAAoACgAAAKXjI8By5zf4kOxTVrXNVlv1X0d8IGZGKLnNpYtm8Lr9cqVeuOSvfOW79D9aDHizNhDJidFZhNydEahOaDH6nomtJjp1tutKoNWkvA6JqfRVLHU/QUfau9l2x7G54d1fl995xcIGAdXqMfBNadoYrhH+Mg2KBlpVpbluCiXmMnZ2Sh4GBqJ+ckIOqqJ6LmKSllZmsoq6wpQAAAh+QQJAQABACwAAAAAKAAoAAAClYx/oLvoxuJDkU1a1YUZbJ59nSd2ZXhWqbRa2/gF8Gu2DY3iqs7yrq+xBYEkYvFSM8aSSObE+ZgRl1BHFZNr7pRCavZ5BW2142hY3AN/zWtsmf12p9XxxFl2lpLn1rseztfXZjdIWIf2s5dItwjYKBgo9yg5pHgzJXTEeGlZuenpyPmpGQoKOWkYmSpaSnqKileI2FAAACH5BAkBAAEALAAAAAAoACgAAAKVjB+gu+jG4kORTVrVhRlsnn2dJ3ZleFaptFrb+CXmO9OozeL5VfP99HvAWhpiUdcwkpBH3825AwYdU8xTqlLGhtCosArKMpvfa1mMRae9VvWZfeB2XfPkeLmm18lUcBj+p5dnN8jXZ3YIGEhYuOUn45aoCDkp16hl5IjYJvjWKcnoGQpqyPlpOhr3aElaqrq56Bq7VAAAOw=="); height: 100%; filter: alpha(opacity=25); opacity: 0.25} .ui-progressbar-indeterminate .ui-progressbar-value { background-image: none} .ui-resizable { position: relative} .ui-resizable-handle { position: absolute; font-size: 0.1px; display: block; -ms-touch-action: none; touch-action: none} .ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none} .ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0} .ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0} .ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0; height: 100%} .ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0; height: 100%} .ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; bottom: 1px} .ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: -5px; bottom: -5px} .ui-resizable-nw { cursor: nw-resize; width: 9px; height: 9px; left: -5px; top: -5px} .ui-resizable-ne { cursor: ne-resize; width: 9px; height: 9px; right: -5px; top: -5px} .ui-selectable { -ms-touch-action: none; touch-action: none} .ui-selectable-helper { position: absolute; z-index: 100; border: 1px dotted black} .ui-selectmenu-menu { padding: 0; margin: 0; position: absolute; top: 0; left: 0; display: none} .ui-selectmenu-menu .ui-menu { overflow: auto; overflow-x: hidden; padding-bottom: 1px} .ui-selectmenu-menu .ui-menu .ui-selectmenu-optgroup { font-size: 1em; font-weight: bold; line-height: 1.5; padding: 2px 0.4em; margin: 0.5em 0 0 0; height: auto; border: 0} .ui-selectmenu-open { display: block} .ui-selectmenu-button { display: inline-block; overflow: hidden; position: relative; text-decoration: none; cursor: pointer} .ui-selectmenu-button span.ui-icon { right: 0.5em; left: auto; margin-top: -8px; position: absolute; top: 50%} .ui-selectmenu-button span.ui-selectmenu-text { text-align: left; padding: 0.4em 2.1em 0.4em 1em; display: block; line-height: 1.4; overflow: hidden; text-overflow: ellipsis; white-space: nowrap} .ui-slider { position: relative; text-align: left} .ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1.2em; height: 1.2em; cursor: default; -ms-touch-action: none; touch-action: none} .ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0} .ui-slider.ui-state-disabled .ui-slider-handle, .ui-slider.ui-state-disabled .ui-slider-range { filter: inherit} .ui-slider-horizontal { height: .8em} .ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left: -.6em} .ui-slider-horizontal .ui-slider-range { top: 0; height: 100%} .ui-slider-horizontal .ui-slider-range-min { left: 0} .ui-slider-horizontal .ui-slider-range-max { right: 0} .ui-slider-vertical { width: .8em; height: 100px} .ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em} .ui-slider-vertical .ui-slider-range { left: 0; width: 100%} .ui-slider-vertical .ui-slider-range-min { bottom: 0} .ui-slider-vertical .ui-slider-range-max { top: 0} .ui-sortable-handle { -ms-touch-action: none; touch-action: none} .ui-spinner { position: relative; display: inline-block; overflow: hidden; padding: 0; vertical-align: middle} .ui-spinner-input { border: none; background: none; color: inherit; padding: 0; margin: .2em 0; vertical-align: middle; margin-left: .4em; margin-right: 22px} .ui-spinner-button { width: 16px; height: 50%; font-size: .5em; padding: 0; margin: 0; text-align: center; position: absolute; cursor: default; display: block; overflow: hidden; right: 0} .ui-spinner a.ui-spinner-button { border-top: none; border-bottom: none; border-right: none} .ui-spinner .ui-icon { position: absolute; margin-top: -8px; top: 50%; left: 0} .ui-spinner-up { top: 0} .ui-spinner-down { bottom: 0} .ui-spinner .ui-icon-triangle-1-s { background-position: -65px -16px} .ui-tabs { position: relative; padding: .2em} .ui-tabs .ui-tabs-nav { margin: 0; padding: .2em .2em 0} .ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 0; margin: 1px .2em 0 0; border-bottom-width: 0; padding: 0; white-space: nowrap} .ui-tabs .ui-tabs-nav .ui-tabs-anchor { float: left; padding: .5em 1em; text-decoration: none} .ui-tabs .ui-tabs-nav li.ui-tabs-active { margin-bottom: -1px; padding-bottom: 1px} .ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor, .ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor, .ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor { cursor: text} .ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor { cursor: pointer} .ui-tabs .ui-tabs-panel { display: block; border-width: 0; padding: 1em 1.4em; background: none} .ui-tooltip { padding: 8px; position: absolute; z-index: 9999; max-width: 300px; -webkit-box-shadow: 0 0 5px #aaa; box-shadow: 0 0 5px #aaa} body .ui-tooltip { border-width: 2px} .ui-widget { font-family: 'Assistant', sans-serif; font-size: 1em} .ui-widget .ui-widget { font-size: 1em} .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-size: 1em} .ui-widget-content { border: 1px solid #e39831; border-top: none; background: #fff; color: #616161; font-family: 'Manrope'; z-index: 100 !important} .ui-widget-header a { border: none; text-decoration: none} .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { color: #f0f0f0 !important; font-weight: bold; letter-spacing: 1px; padding-top: 0.5em !important; padding-bottom: 0.5em !important; height: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; position: relative; overflow: hidden; border: none; text-decoration: none; text-shadow: 0 1px 0 rgba(240, 240, 240,0.6), 0 2px 0 rgba(0,0,0,0.4), -1px 0 0 rgba(240, 240, 240,0.6), -1px 0 0 rgba(0,0,0,0.4); transition: all 500ms cubic-bezier(0.77, 0, 0.175, 1)} .ui-state-default:before, .ui-widget-content .ui-state-default:before, .ui-widget-header .ui-state-default:before, .ui-state-highlight:before, .ui-widget-content .ui-state-highlight:before, .ui-widget-header .ui-state-highlight:before, .ui-state-active:before, .ui-widget-content .ui-state-active:before, .ui-widget-header .ui-state-active:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; border-radius: 0; z-index: -2; background: #a0db3d; transition: all 500ms cubic-bezier(0.77, 0, 0.175, 1); transform: none; box-shadow: 0 2px 3px rgba(0,0,0,0.2)} .ui-state-default:after, .ui-widget-content .ui-state-default:after, .ui-widget-header .ui-state-default:after, .ui-state-highlight:after, .ui-widget-content .ui-state-highlight:after, .ui-widget-header .ui-state-highlight:after, .ui-state-active:after, .ui-widget-content .ui-state-active:after, .ui-widget-header .ui-state-active:after { content: ''; position: absolute; left: 50%; bottom: -0.6em; transform: translateX(-50%); border-radius: 50%; width: 0.5em; height: 0.5em; z-index: -2; background: #a0db3d; transition: all 500ms cubic-bezier(0.77, 0, 0.175, 1); box-shadow: 0 -2px 3px rgba(0,0,0,0.2)} .ui-state-default:hover:before, .ui-widget-content .ui-state-default:hover:before, .ui-widget-header .ui-state-default:hover:before, .ui-state-highlight:before, .ui-widget-content .ui-state-highlight:before, .ui-widget-header .ui-state-highlight:before, .ui-state-active:before, .ui-widget-content .ui-state-active:before, .ui-widget-header .ui-state-active:before { top: 100%; left: 50%; right: 50%; bottom: 0; border-radius: 50%} .ui-state-default:hover:after, .ui-widget-content .ui-state-default:hover:after, .ui-widget-header .ui-state-default:hover:after, .ui-state-highlight:after, .ui-widget-content .ui-state-highlight:after, .ui-widget-header .ui-state-highlight:after, .ui-state-active:after, .ui-widget-content .ui-state-active:after, .ui-widget-header .ui-state-active:after { bottom: 1px; transition: all 500ms cubic-bezier(0.77, 0, 0.175, 1)} .ui-state-default.ui-state-hover, .ui-widget-content .ui-state-default.ui-state-hover, .ui-widget-header .ui-state-default.ui-state-hover, .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight, .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, /* .ui-state-hover, */ .ui-state-focus a, .ui-state-focus a:hover, .ui-state-focus a:link, .ui-state-focus a:visited { color: #616161 !important; padding-top: 0.25em !important; padding-bottom: 0.75em !important; border: none; text-decoration: none; transition: all 500ms cubic-bezier(0.77, 0, 0.175, 1)} /* .ui-state-active, */ /* .ui-widget-content .ui-state-active, */ /* .ui-widget-header .ui-state-active { */ /* border: 1px solid #bb2330; */ /* background: #bb2330; */ /* font-weight: normal} */ /* .ui-state-active a, */ /* .ui-state-active a:link, */ /* .ui-state-active a:visited { */ /* color: #212121; */ /* text-decoration: none} */ .ui-state-highlight:before, .ui-widget-content .ui-state-highlight:before, .ui-widget-header .ui-state-highlight:before, .ui-state-highlight:after, .ui-widget-content .ui-state-highlight:after, .ui-widget-header .ui-state-highlight:after { background: #c02452} /* .ui-state-highlight a, */ /* .ui-widget-content .ui-state-highlight a, */ /* .ui-widget-header .ui-state-highlight a { */ /* color: #363636} */ .ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error { border: 1px solid #cd0a0a; background: #fef1ec; color: #cd0a0a} .ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a { color: #cd0a0a} .ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { color: #cd0a0a} .ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary { font-weight: bold} .ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); font-weight: normal} .ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); background-image: none} .ui-state-disabled .ui-icon { filter:Alpha(Opacity=35)} .ui-icon { width: 16px; height: 16px} .ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { border-top-left-radius: 0} .ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { border-top-right-radius: 0} .ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { border-bottom-left-radius: 0} .ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { border-bottom-right-radius: 0} .ui-widget-overlay { background: #aaaaaa; opacity: .3; filter: Alpha(Opacity=30)} .ui-widget-shadow { margin: -8px 0 0 -8px; padding: 8px; background: #aaaaaa; opacity: .3; filter: Alpha(Opacity=30); border-radius: 8px} .xdsoft_datetimepicker { background: #fafafa; border: 1px solid #bb2330; padding: 0.5em; position: absolute; z-index: 100 !important; -moz-box-sizing: border-box; box-sizing: border-box; display: none} .xdsoft_datetimepicker.xdsoft_rtl { padding: 8px 0 8px 8px} .xdsoft_datetimepicker iframe { position: absolute; left: 0; top: 0; width: 75px; height: 210px; background: transparent; border: none} .xdsoft_datetimepicker button { border: none !important} .xdsoft_noselect { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none} .xdsoft_noselect::selection { background: transparent } .xdsoft_noselect::-moz-selection { background: transparent } .xdsoft_datetimepicker.xdsoft_inline { display: inline-block; position: static; box-shadow: none} .xdsoft_datetimepicker * { -moz-box-sizing: border-box; box-sizing: border-box; padding: 0; margin: 0} .xdsoft_datetimepicker .xdsoft_datepicker, .xdsoft_datetimepicker .xdsoft_timepicker { display: none} .xdsoft_datetimepicker .xdsoft_datepicker.active, .xdsoft_datetimepicker .xdsoft_timepicker.active { display: block} .xdsoft_datetimepicker .xdsoft_datepicker { width: 224px; float: left; margin-left: 8px} .xdsoft_datetimepicker.xdsoft_rtl .xdsoft_datepicker { float: right; margin-right: 8px; margin-left: 0} .xdsoft_datetimepicker.xdsoft_showweeks .xdsoft_datepicker { width: 256px} .xdsoft_datetimepicker .xdsoft_timepicker { width: 5em; float: left; text-align: center; margin: 0 0 0} .xdsoft_datetimepicker.xdsoft_rtl .xdsoft_timepicker { float: right; margin: 0 0 0} .xdsoft_datetimepicker .xdsoft_datepicker.active+.xdsoft_timepicker { margin-top: 8px; margin-bottom: 3px} .xdsoft_datetimepicker .xdsoft_monthpicker { position: relative; text-align: center} .xdsoft_datetimepicker .xdsoft_label i, .xdsoft_datetimepicker .xdsoft_prev:before { content: '↑'; font-weight: 900; font-size: 2.6em; position: absolute; top: 0; left: 0; right: 0} .xdsoft_datetimepicker .xdsoft_next:after { content: '↓'; font-weight: 900; font-size: 2.6em; position: absolute; top: 0; left: 0; right: 0} .xdsoft_datetimepicker .xdsoft_label i { opacity: 0.5; display: inline-block; width: 9px; height: 20px; vertical-align: middle} .xdsoft_datetimepicker .xdsoft_prev { float: left} .xdsoft_datetimepicker .xdsoft_today_button { float: left} .xdsoft_datetimepicker .xdsoft_next { float: right} .xdsoft_datetimepicker .xdsoft_next, .xdsoft_datetimepicker .xdsoft_prev , .xdsoft_datetimepicker .xdsoft_today_button { background-color: transparent; border: none; cursor: pointer; width: 2.8em; height: 2.8em; padding: 0; position: relative; font-size: 0.5em; line-height: 2.5em; color: #666; font-family: 'Manrope'} .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_prev, .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_next, .xdsoft_datetimepicker.xdsoft_rtl .xdsoft_timepicker .xdsoft_prev, .xdsoft_datetimepicker.xdsoft_rtl .xdsoft_timepicker .xdsoft_next { float: none; display: none} .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box { height: 10.1em; overflow: hidden; border-bottom: 1px solid #666; padding-right: 7px} .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div { text-align: center; border-collapse: collapse; cursor: pointer; border-bottom-width: 0; height: 1.6em; line-height: 1.6em; position: relative; background: none; color: #fff; border: 1px solid #555} .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div:nth-child(n+2) { margin-top: 0.25em} .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: -1; background-color: #555; transition: all 0.5s ease-in} .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div:after { content: ''; position: absolute; top: 0; left: 0; right: 100%; bottom: 0; z-index: -1; background-color: #bb2330; transition: all 0.5s ease-in} .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div:hover:after { right: 0; transition: all 0.5s ease-in} .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box >div > div:first-child { border-top-width: 0} .xdsoft_datetimepicker .xdsoft_label { display: inline; position: relative; z-index: 9999; margin: 0; padding: 5px 3px; font-size: 14px; line-height: 20px; font-weight: bold; background-color: #fff; float: left; width: 182px; text-align: center; cursor: pointer} .xdsoft_datetimepicker .xdsoft_label:hover>span { text-decoration: underline} .xdsoft_datetimepicker .xdsoft_label:hover i { opacity: 1.0} .xdsoft_datetimepicker .xdsoft_label > .xdsoft_select { border: 1px solid #c2e5ab; position: absolute; right: 0; top: 30px; z-index: 101; display: none; background: #fff; max-height: 160px; overflow-y: hidden} .xdsoft_datetimepicker .xdsoft_label > .xdsoft_select.xdsoft_monthselect{ right: -7px } .xdsoft_datetimepicker .xdsoft_label > .xdsoft_select.xdsoft_yearselect{ right: 2px } .xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option:hover { color: #c2e5ab} .xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option { padding: 2px 10px 2px 5px; text-decoration: none !important} .xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option.xdsoft_current { background: #c2e5ab; color: #fff} .xdsoft_datetimepicker .xdsoft_month { width: 100px; text-align: right} .xdsoft_datetimepicker .xdsoft_calendar { clear: both} .xdsoft_datetimepicker .xdsoft_year{ width: 48px; margin-left: 5px} .xdsoft_datetimepicker .xdsoft_calendar table { border-collapse: collapse; width: 100%} .xdsoft_datetimepicker .xdsoft_calendar td > div { padding-right: 5px} .xdsoft_datetimepicker .xdsoft_calendar th { height: 25px} .xdsoft_datetimepicker .xdsoft_calendar td,.xdsoft_datetimepicker .xdsoft_calendar th { width: 14.2857142%; background: #f5f5f5; border: 1px solid #c2e5ab; color: #666; font-size: 12px; text-align: right; vertical-align: middle; padding: 0; border-collapse: collapse; cursor: pointer; height: 25px} .xdsoft_datetimepicker.xdsoft_showweeks .xdsoft_calendar td,.xdsoft_datetimepicker.xdsoft_showweeks .xdsoft_calendar th { width: 12.5%} .xdsoft_datetimepicker .xdsoft_calendar th { background: #f1f1f1} .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_today { color: #33aaff} .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_highlighted_default { background: #ffe9d2; box-shadow: #ffb871 0 1px 4px 0 inset; color: #000} .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_highlighted_mint { background: #c1ffc9; box-shadow: #00dd1c 0 1px 4px 0 inset; color: #000} .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_default, .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current, .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box >div >div.xdsoft_current { background: #bb2330; color: #fff} .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_other_month, .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_disabled, .xdsoft_datetimepicker .xdsoft_time_box >div >div.xdsoft_disabled { opacity: 0.3; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; cursor: default} .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_other_month.xdsoft_disabled { opacity: 0.2; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)"} .xdsoft_datetimepicker .xdsoft_calendar th { font-weight: 700; text-align: center; color: #999; cursor: default} .xdsoft_datetimepicker .xdsoft_copyright { color: #bb2330 !important; font-size: 10px; clear: both; float: none; margin-left: 8px} .xdsoft_datetimepicker .xdsoft_copyright a { color: #eee !important } .xdsoft_datetimepicker .xdsoft_copyright a:hover { color: #aaa !important } .xdsoft_time_box { position: relative; border: 1px solid #666} .xdsoft_scrollbar >.xdsoft_scroller { background: #999 !important; border-color: #999 !important; height: 20px; border-radius: 0} .xdsoft_scrollbar { position: absolute; width: 7px; right: 0; top: 0; bottom: 0; cursor: pointer} .xdsoft_datetimepicker.xdsoft_rtl .xdsoft_scrollbar { left: 0; right: auto} .xdsoft_scroller_box { position: relative} .xdsoft_datetimepicker.xdsoft_dark { box-shadow: 0 5px 15px -5px rgba(255, 255, 255, 0.506); background: #000; border-bottom: 1px solid #444; border-left: 1px solid #333; border-right: 1px solid #333; border-top: 1px solid #333; color: #c2e5ab} .xdsoft_datetimepicker.xdsoft_dark .xdsoft_timepicker .xdsoft_time_box { border-bottom: 1px solid #222} .xdsoft_datetimepicker.xdsoft_dark .xdsoft_timepicker .xdsoft_time_box >div >div { background: #0a0a0a; border-top: 1px solid #222; color: #999} .xdsoft_datetimepicker.xdsoft_dark .xdsoft_label { background-color: #000} .xdsoft_datetimepicker.xdsoft_dark .xdsoft_label > .xdsoft_select { border: 1px solid #333; background: #000} .xdsoft_datetimepicker.xdsoft_dark .xdsoft_label > .xdsoft_select > div > .xdsoft_option:hover { color: #000; background: #007fff} .xdsoft_datetimepicker.xdsoft_dark .xdsoft_label > .xdsoft_select > div > .xdsoft_option.xdsoft_current { background: #cc5500; box-shadow: #b03e00 0 1px 3px 0 inset; color: #000} .xdsoft_datetimepicker.xdsoft_dark .xdsoft_label i, .xdsoft_datetimepicker.xdsoft_dark .xdsoft_prev, .xdsoft_datetimepicker.xdsoft_dark .xdsoft_next, .xdsoft_datetimepicker.xdsoft_dark .xdsoft_today_button { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAAAeCAYAAADaW7vzAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QUExQUUzOTA0M0UyMTFFNDlBM0FFQTJENTExRDVBODYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QUExQUUzOTE0M0UyMTFFNDlBM0FFQTJENTExRDVBODYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpBQTFBRTM4RTQzRTIxMUU0OUEzQUVBMkQ1MTFENUE4NiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpBQTFBRTM4RjQzRTIxMUU0OUEzQUVBMkQ1MTFENUE4NiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pp0VxGEAAAIASURBVHja7JrNSgMxEMebtgh+3MSLr1T1Xn2CHoSKB08+QmR8Bx9A8e7RixdB9CKCoNdexIugxFlJa7rNZneTbLIpM/CnNLsdMvNjM8l0mRCiQ9Ye61IKCAgZAUnH+mU3MMZaHYChBnJUDzWOFZdVfc5+ZFLbrWDeXPwbxIqrLLfaeS0hEBVGIRQCEiZoHQwtlGSByCCdYBl8g8egTTAWoKQMRBRBcZxYlhzhKegqMOageErsCHVkk3hXIFooDgHB1KkHIHVgzKB4ADJQ/A1jAFmAYhkQqA5TOBtocrKrgXwQA8gcFIuAIO8sQSA7hidvPwaQGZSaAYHOUWJABhWWw2EMIH9QagQERU4SArJXo0ZZL18uvaxejXt/Em8xjVBXmvFr1KVm/AJ10tRe2XnraNqaJvKE3KHuUbfK1E+VHB0q40/y3sdQSxY4FHWeKJCunP8UyDdqJZenT3ntVV5jIYCAh20vT7ioP8tpf6E2lfEMwERe+whV1MHjwZB7PBiCxcGQWwKZKD62lfGNnP/1poFAA60T7rF1UgcKd2id3KDeUS+oLWV8DfWAepOfq00CgQabi9zjcgJVYVD7PVzQUAUGAQkbNJTBICDhgwYTjDYD6XeW08ZKh+A4pYkzenOxXUbvZcWz7E8ykRMnIHGX1XPl+1m2vPYpL+2qdb8CDAARlKFEz/ZVkAAAAABJRU5ErkJggg==);} .xdsoft_datetimepicker.xdsoft_dark .xdsoft_calendar td, .xdsoft_datetimepicker.xdsoft_dark .xdsoft_calendar th { background: #0a0a0a; border: 1px solid #222; color: #999} .xdsoft_datetimepicker.xdsoft_dark .xdsoft_calendar th { background: #0e0e0e} .xdsof_datetimepicker.xdsoft_dark .xdsoft_calendar td.xdsoft_today { color: #cc5500} .xdsof_datetimepicker.xdsoft_dark .xdsoft_calendar td.xdsoft_today { color: #cc5500} .xdsoft_datetimepicker.xdsoft_dark .xdsoft_calendar td.xdsoft_highlighted_default { background: #ffe9d2; box-shadow: #ffb871 0 1px 4px 0 inset; color:#000} .xdsoft_datetimepicker.xdsoft_dark .xdsoft_calendar td.xdsoft_highlighted_mint { background: #c1ffc9; box-shadow: #00dd1c 0 1px 4px 0 inset; color:#000} .xdsoft_datetimepicker.xdsoft_dark .xdsoft_calendar td.xdsoft_default, .xdsoft_datetimepicker.xdsoft_dark .xdsoft_calendar td.xdsoft_current, .xdsoft_datetimepicker.xdsoft_dark .xdsoft_timepicker .xdsoft_time_box >div >div.xdsoft_current { background: #cc5500; box-shadow: #b03e00 0 1px 3px 0 inset; color: #000} .xdsoft_datetimepicker.xdsoft_dark .xdsoft_calendar td:hover, .xdsoft_datetimepicker.xdsoft_dark .xdsoft_timepicker .xdsoft_time_box >div >div:hover { color: #000 !important; background: #007fff !important} .xdsoft_datetimepicker.xdsoft_dark .xdsoft_calendar th { color: #666} .xdsoft_datetimepicker.xdsoft_dark .xdsoft_copyright { color: #333 !important } .xdsoft_datetimepicker.xdsoft_dark .xdsoft_copyright a { color: #111 !important } .xdsoft_datetimepicker.xdsoft_dark .xdsoft_copyright a:hover { color: #555 !important } .xdsoft_dark .xdsoft_time_box { border: 1px solid #333} .xdsoft_dark .xdsoft_scrollbar >.xdsoft_scroller { background: #333 !important} .xdsoft_datetimepicker .xdsoft_save_selected { display: block; border: 1px solid #c2e5ab !important; margin-top: 5px; width: 100%; color: #454551; font-size: 13px} .xdsoft_datetimepicker .blue-gradient-button { font-family: "museo-sans", "Book Antiqua", sans-serif; font-size: 12px; font-weight: 300; color: #82878c; height: 28px; position: relative; padding: 4px 17px 4px 33px; border: 1px solid #d7d8da; background: -moz-linear-gradient(top, #fff 0%, #f4f8fa 73%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fff), color-stop(73%, #f4f8fa)); background: -webkit-linear-gradient(top, #fff 0%, #f4f8fa 73%); background: -o-linear-gradient(top, #fff 0%, #f4f8fa 73%); background: -ms-linear-gradient(top, #fff 0%, #f4f8fa 73%); background: linear-gradient(to bottom, #fff 0%, #f4f8fa 73%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#f4f8fa',GradientType=0 )} .xdsoft_datetimepicker .blue-gradient-button:hover, .xdsoft_datetimepicker .blue-gradient-button:focus, .xdsoft_datetimepicker .blue-gradient-button:hover span, .xdsoft_datetimepicker .blue-gradient-button:focus span { color: #454551; background: -moz-linear-gradient(top, #f4f8fa 0%, #FFF 73%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f4f8fa), color-stop(73%, #FFF)); background: -webkit-linear-gradient(top, #f4f8fa 0%, #FFF 73%); background: -o-linear-gradient(top, #f4f8fa 0%, #FFF 73%); background: -ms-linear-gradient(top, #f4f8fa 0%, #FFF 73%); background: linear-gradient(to bottom, #f4f8fa 0%, #FFF 73%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f8fa', endColorstr='#FFF',GradientType=0 )} .swal-overlay { cursor: alias; background-color: rgba(9,9, 9,.8) !important; font-size: 18px} .swal-modal { width: 99% !important; max-width: 100% !important; /* max-height: 100vh; */ overflow: auto; text-align: initial !important; background-color: #090909 !important; cursor: initial; margin: 0 0 0; padding: 3em 2.5em 1.5em !important; box-shadow: 0 0 12px rgba(0,0,0,0.25)} .swal-modal > .swal-content { margin-top: 0} .swal-modal section > .no_flex { padding: 0 0 !important} .swal-modal section > .no_flex > .center > div { margin: 0 0 4em} .swal-modal .swal-footer { margin: 2em 0 0} .swal-modal button { display: inline-block; font-size: 18px; font-weight: normal; cursor: pointer; margin: 0; text-align: center; padding: 0.2em; border-style: solid; transition: 0.3s all linear; width: auto; border: none; position: relative; text-shadow: none; padding: 0.15em 0.75em 0.3em; text-transform: uppercase; color: #000; background: #f6912f; border-radius: 0; font-family: 'Zen Kaku Gothic New'; font-weight: bold; box-shadow: none} .swal-modal .swal-button:focus {box-shadow: none} .swal-modal .swal-button:active { background-color: #f6912f} .swal-modal .swal-button:before { content: url('data:image/svg+xml; utf8, '); margin-right: 0.5em; display: inline-block; width: 0.8em; height: 0.8em; vertical-align: top; position: relative; top: 4px; transition: all 0.3s linear} /************************************************************************************************************************************************************/ /* ACCUEIL */ /************************************************************************************************************************************************************/ body.accueil section#slider { margin-top: 0} @media screen and (max-width: 480px) and (orientation: landscape) { body.accueil #main > section#slider { margin-top: 50vh !important} } @media screen and (min-width: 481px) and (orientation: portrait) { body.accueil #main > section#slider { margin-top: 160px !important} } @media screen and (max-width: 480px) and (orientation: portrait) { body.accueil #main > section#slider { margin-top: 180px !important} } body.accueil section > .no_flex * { text-align-last: center} body.accueil #main > section { position: relative} body.accueil #main > section.vh { padding-top: 0; padding-bottom: 0} body.accueil section#open_map { min-height: 900px; webkit-clip-path: polygon(0 6em, 100% 0, 100% 100%, 0 100%); clip-path: polygon(0 6em, 100% 0, 100% 100%, 0 100%)} @media screen and (max-width: 768px) { body.accueil section > .no_flex { padding: 4em 0} body.accueil #main > section:nth-child(3) > .no_flex { padding: 4em 0} body.accueil #main > section:last-child > .no_flex { padding-bottom: 4em} body.accueil section#open_map { webkit-clip-path: none; clip-path: none} } body.accueil section > .no_flex { min-height: 1px; padding: 8em 0; display: flex; align-content: center; align-items: center; background: #090909} body.accueil #main > section#sect_3 > .no_flex { padding: 0 0} body.accueil #main > section#sect_3 > .no_flex:before { content: ''; position: absolute; top: -6em; left: 0; right: 0; bottom: 0; z-index: 0; background: #181818; webkit-clip-path: polygon(0 6em, 100% 0, 100% calc(100% - 6em), 0 calc(100% - 10px)); clip-path: polygon(0 6em, 100% 0, 100% calc(100% - 6em), 0 calc(100% - 10px))} @media screen and (max-width: 768px) { body.accueil #main > section#sect_3 > .no_flex:before { display: none} } body.accueil #main > section:last-child > .no_flex { padding-bottom: 8em} body.accueil section#slider + section > .no_flex { position: relative; top: -6em; margin-bottom: -6em !important; webkit-clip-path: polygon(0 6em, 100% 0, 100% 100%, 0 100%); clip-path: polygon(0 6em, 100% 0, 100% 100%, 0 100%)} @media screen and (max-width: 1024px) { body.accueil section > .no_flex { padding: 4em 0 0} body.accueil #main > section:nth-child(3) > .no_flex { padding: 4em 0 1em} body.accueil #main > section:last-child > .no_flex { padding-bottom: 4em} body.accueil section#slider + section > .no_flex { top: 0; margin-bottom: 0 !important; webkit-clip-path: none; clip-path: none} } body.accueil #main > section > .no_flex > .center > .no_flex, body.accueil #main > section > .no_flex > .center > .no_flex > .no_flex, body.accueil #main > section > .no_flex > .center > .flex { margin: 0 0 8em} @media screen and (max-width: 1024px) { body.accueil #main > section > .no_flex > .center > .no_flex, body.accueil #main > section > .no_flex > .center > .no_flex > .no_flex, body.accueil #main > section > .no_flex > .center > .flex { margin: 0 0 4em} } body.accueil #main > section .flex > .container_flex:not(.on_screen), body.accueil #main > section .center > .no_flex:not(.on_screen), body.accueil #main > section#galeries_photos > .no_flex > .center > h2:not(.on_screen), body.accueil section#open_map:not(.on_screen), #carousel-photos:not(.on_screen) { opacity: 0; visibility:hidden} body.accueil #main > section .flex > .container_flex.on_screen, body.accueil #main > section .center > .no_flex.on_screen, body.accueil #main > section#galeries_photos > .no_flex > .center > h2.on_screen, body.accueil section#open_map.on_screen, #carousel-photos.on_screen { animation: fadeIn 2s linear 0s 1 both} body.accueil section#slider + section > .no_flex > .center > .flex.carousel article > div { padding: 0 1em} body.accueil section#slider + section > .no_flex > .center > .flex.carousel article .container_flex.xsmall { padding: 4em; position: relative; webkit-clip-path: polygon(2em 0, 100% 0, 100% calc(100% - 1.75em), calc(100% - 1.85em) 100%,0 100%, 0 2em); clip-path: polygon(2em 0, 100% 0, 100% calc(100% - 1.75em), calc(100% - 1.85em) 100%,0 100%, 0 2em)} body.accueil section#slider + section > .no_flex > .center > .flex.carousel article .container_flex.xsmall:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.6); z-index: 1} body.accueil section#slider + section > .no_flex > .center > .flex.carousel article .container_flex.xsmall:after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 0; background-size: cover; background-position: center; background-repeat: no-repeat} body.accueil section#slider + section > .no_flex > .center > .flex.carousel article .container_flex.xsmall.bloc_1:after { background-image: url('https://www.ams-chauffage.fr/upload/actu-1643028420.jpg')} body.accueil section#slider + section > .no_flex > .center > .flex.carousel article .container_flex.xsmall.bloc_2:after { background-image: url('https://www.ams-chauffage.fr/upload/tuyauterie-1643029167.jpg')} body.accueil section#slider + section > .no_flex > .center > .flex.carousel article .container_flex.xsmall.bloc_3:after { background-image: url('https://www.ams-chauffage.fr/upload/systeme-chauffage-1643042841.jpg')} body.accueil section#slider + section > .no_flex > .center > .flex.carousel article .container_flex.xsmall.bloc_4:after { background-image: url('https://www.ams-chauffage.fr/upload/devis-1643028421.jpg')} body.accueil section#slider + section > .no_flex > .center > .flex.carousel article .container_flex.xsmall > * { position: relative; z-index: 2; text-align-last: center} body.accueil section#slider + section > .no_flex > .center > .flex.carousel article .container_flex.xsmall h2 { font-size: 1.3em} body.accueil section#slider + section > .no_flex > .center > .flex.carousel article .container_flex.xsmall svg { width: 2.5em; height: 2.5em} body.accueil section#sect_2 > .no_flex { padding: 2em 0} body.accueil section#sect_2 > .no_flex * { text-align-last: left} body.accueil section#open_map .leaflet-top { top: 12em} body.accueil #main > section#sect_3 > .no_flex > .center { padding: 4em 0 8em} @media screen and (max-width: 768px) { body.accueil #main > section#sect_3 > .no_flex { padding: 4em 0 0} body.accueil #main > section#sect_3 > .no_flex > .center { padding: 0 0 0} } body.accueil #main > section .flex > .container_flex .button, body.accueil #main > section .no_flex > .no_flex .button, body.accueil #main > section .flex > .container_flex img, body.accueil #main > section .no_flex > .no_flex img { margin: 0 0.5em} @media screen and (max-width: 768px) { body.accueil #main > section .flex > .container_flex .button, body.accueil #main > section .no_flex > .no_flex .button, body.accueil #main > section .flex > .container_flex img, body.accueil #main > section .no_flex > .no_flex img { display: inline-block; min-width: 51%; margin: 0 0 0} body.accueil #main > section .flex > .container_flex .button:nth-child(n+2), body.accueil #main > section .no_flex > .no_flex .button:nth-child(n+2), body.accueil #main > section .flex > .container_flex img:nth-child(n+2), body.accueil #main > section .no_flex > .no_flex img:nth-child(n+2) { margin-top: 0.75em} body.accueil #main > section .flex > .container_flex .button, body.accueil #main > section .no_flex > .no_flex .button { font-size: 0.8em} } body.accueil #main > section#galeries_photos > .no_flex > .center > .carousel-button { padding: 0 1em; z-index: 2} body.accueil #main > section#galeries_photos > .no_flex > .center > .carousel-button > button { position: absolute; top: 50%; transform: translateY(-50%); border: none; cursor: pointer; line-height: 0; padding: 5px; opacity: 1; z-index: 10; background: #f6912f; transition: all 0.3s linear;} body.accueil #main > section#galeries_photos > .no_flex > .center > .carousel-button > button > svg { width: 1.7em; height: 1.7em} body.accueil #main > section#galeries_photos > .no_flex > .center > .carousel-button > button > svg > path { transition: all 0.3s linear} body.accueil #main > section#galeries_photos > .no_flex > .center > .carousel-button > button.btn.prev { left: 0} body.accueil #main > section#galeries_photos > .no_flex > .center > .carousel-button > button.btn.next { right: 0} body.accueil #main > section#galeries_photos > .no_flex > .center > .carousel-button > button:hover { background: #fff} body.accueil #main > section#galeries_photos > .no_flex > .center > .carousel-button > button.slick-disabled { opacity: 0; cursor: default; transition: all 0.3s linear} body.accueil #main > section#galeries_photos > .no_flex > .center > .carousel-button > div > div > article > div { padding: 0 30px} @media screen and (max-width: 768px) { body.accueil #main > section#galeries_photos > .no_flex > .center > .carousel-button > div > div > article > div { padding: 0 0} } body.accueil #main > section#galeries_photos > .no_flex > .center > .carousel-button > div > div > article div { display: block; width: 100%; height: 100%} body.accueil #main > section#galeries_photos > .no_flex > .center > .carousel-button > div > div > article > div > .no_flex { webkit-clip-path: polygon(2em 0, 100% 0, 100% calc(100% - 1.75em), calc(100% - 1.85em) 100%,0 100%, 0 2em); clip-path: polygon(2em 0, 100% 0, 100% calc(100% - 1.75em), calc(100% - 1.85em) 100%,0 100%, 0 2em)} body.accueil #main > section#galeries_photos > .no_flex > .center > .carousel-button > div > div > article .no_flex > .no_flex >.absolute { top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.6); z-index: 0} body.accueil #main > section#galeries_photos > .no_flex > .center > .carousel-button > div > div > article > div > .no_flex > .no_flex { padding-top: 48.5%} body.accueil #main > section#galeries_photos > .no_flex > .center > .carousel-button > div > div > article > div > .no_flex img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; object-position: center} body.accueil #main > section#galeries_photos > .no_flex > .center > .carousel-button > div > div > article > div > .no_flex h3 { position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%); z-index: 9; font-size: 1.1em; color: #fff; padding: 0.3em; font-weight: bold; text-transform: uppercase; text-shadow: 0 1px 0 rgba(255,255,255,0.6), 0 2px 0 rgba(0,0,0,0.4), -1px 0 0 rgba(255,255,255,0.6), -1px 0 0 rgba(0,0,0,0.4);} body.accueil #main > section#galeries_photos > .no_flex > .center > .carousel-button > div > div > article > div > .no_flex .no_flex > .absolute > a { display: block; width: 100%; height: 100%} body.accueil #main > section#galeries_photos > .no_flex > .center > h2 { margin: 0 0 1.175em} body.accueil #main > section#galeries_photos > .no_flex > .center > .no_flex { margin: 2em 0 0} @media screen and (max-width: 480px) { body.accueil #main > section#galeries_photos > .no_flex > .center > .no_flex { margin: 5em 0 0} body.accueil #main > section#galeries_photos > .no_flex > .center > .no_flex > .button { font-size: 0.8em} } /************************************************************************************************************************************************************/ /* CMS */ /************************************************************************************************************************************************************/ body.cms #main > section.vh { padding-top: 100vh; position: relative; background-position: top center; background-size: 100% 100vh; background-repeat: no-repeat; background-attachment: fixed} body.cms:not(.scroll) #main > section.vh:not(.cover) { background-position: top center !important} body.cms #main > section.vh.cover { background-image: url('https://www.ams-chauffage.fr/upload/l-equipe-ams-chauffage-1643616974.jpg'); background-size: cover} @media screen and (min-width: 481px) and (orientation: portrait) { body.cms #main > section:nth-child(1) { margin-top: 160px !important} } @media screen and (max-width: 640px) and (orientation: landscape) { body.cms #main > section.vh { background-position: 50% 0% !important} } @media screen and (max-width: 480px) and (orientation: landscape) { body.cms #main > section:nth-child(1) { margin-top: 50vh !important} body.cms #main > section.vh.cover, body.cms #main > section.vh { background-attachment: initial; background-size: auto 100vh !important; background-position: 50% 25% !important} } @media screen and (max-width: 480px) and (orientation: portrait) { body.cms #main > section:nth-child(1) { margin-top: 180px !important} } @media screen and (orientation: portrait) { body.cms #main > section.vh.cover, body.cms #main > section.vh { padding-top: 40vh; background-attachment: initial; background-size: auto 50vh; background-position: 50% 0% !important} } body.cms #main > section.vh:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 10em; background: rgba(0,0,0,0.45); z-index: 0} body.cms #main > section > .absolute { position: absolute; top: 50vh; left: 0; right: 0; padding: 2em 20%; -webkit-transition: opacity 0.5s 0.8s, -webkit-transform 0.5s 0.8s; transition: opacity 0.5s 0.8s, -webkit-transform 0.5s 0.8s; transition: transform 0.5s 0.8s, opacity 0.5s 0.8s; transition: transform 0.5s 0.8s, opacity 0.5s 0.8s, -webkit-transform 0.5s 0.8s; will-change: transform, opacity; -webkit-transform: translateY(-80%); transform: translateY(-80%); opacity: 0} body.cms #main > section > .absolute.on_screen { opacity: 1; -webkit-transform: translateY(-50%); transform: translateY(-50%)} @media screen and (max-width: 1366px) { body.cms #main > section > .absolute { right: 0} } @media screen and (max-width: 1024px) { body.cms #main > section > .absolute { -webkit-transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; padding: 0 1em 0 0} } @media screen and (max-width: 768px) { body.cms #main > section > .absolute { left: 0; padding: 3em 1.5em 0; width: 100%; -webkit-transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s} } @media screen and (orientation: portrait) { body.cms #main > section > .absolute { top: 21vh} } body.cms #main > section > .absolute { font-size: 2.5em} @media screen and (max-width: 1366px) { body.cms #main > section > .absolute { font-size: 1.9em} } @media screen and (max-width: 768px) { body.cms #main > section > .absolute { text-align: center} } @media screen and (max-width: 480px) { body.cms #main > section > .absolute { font-size: 1.4em} body.cms #main > section > .absolute a { font-size: 0.8em} } body.cms #main > section > .absolute > * { font-size: 1em; margin: 0 0; position: relative; padding: 0; text-align: center; font-weight: bold; text-transform: uppercase; text-shadow: 0 1px 0 rgba(255,255,255,0.6), 0 2px 0 rgba(0,0,0,0.4), -1px 0 0 rgba(255,255,255,0.6), -1px 0 0 rgba(0,0,0,0.4)} body.cms #main > section > .absolute > p { font-weight: normal; font-size: 0.59em; margin-top: 0.59em} body.cms #main > section > .no_flex { min-height: 1px; padding: 8em 0 4em; display: flex; align-content: center; align-items: center; background: #090909; position: relative; top: -6em; margin-bottom: -6em !important; width: 100%; webkit-clip-path: polygon(0 6em, 100% 0, 100% 100%, 0 100%); clip-path: polygon(0 6em, 100% 0, 100% 100%, 0 100%)} body.cms #main > section#sect_2 > .no_flex { padding: 0 0; top: 0; margin-bottom: 0 !important; webkit-clip-path: none; clip-path: none} body.cms #main > section#sect_2 > .no_flex:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 0; background: #181818; webkit-clip-path: polygon(0 6em, 100% 0, 100% calc(100% - 6em), 0 calc(100% - 10px)); clip-path: polygon(0 6em, 100% 0, 100% calc(100% - 6em), 0 calc(100% - 10px))} @media screen and (max-width: 1024px) { body.cms #main > section#sect_2 > .no_flex:before { webkit-clip-path: none; clip-path: none} } body.cms #main > section#sect_2 > .no_flex > .center { padding: 10em 0 8em} body.cms #main > section#sect_3 > .no_flex { padding: 10em 0 6em} @media screen and (max-width: 1024px) { body.cms #main > section#sect_2 > .no_flex > .center { padding: 0 0 0} body.cms #main > section#sect_2 > .no_flex, body.cms #main > section#sect_3 > .no_flex { padding: 4em 0 0} body.cms #main > section > .no_flex { padding: 4em 0 0} body.cms #main > section:last-child > .no_flex { padding-bottom: 4em !important} body.cms #main > section#sect_2 { margin-top: 4em} body.cms #main > section#sect_2 > .no_flex { padding: 4em 0 4em} body.cms #main > section > .no_flex { top: 0; margin-bottom: 0 !important; webkit-clip-path: none; clip-path: none} } body.cms.depannage-chaudiere-fioul-gaz-bois-epinal-10 #main > section#sect_2 > .no_flex { padding: 0 0; top: 0; margin-bottom: -6em !important;} body.cms.depannage-chaudiere-fioul-gaz-bois-epinal-10 #main > section#sect_2 > .no_flex:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 0; background: #181818; webkit-clip-path: polygon(0 6em, 100% 0, 100% calc(100% - 6em), 0 calc(100% - 10px)); clip-path: polygon(0 6em, 100% 0, 100% calc(100% - 6em), 0 calc(100% - 10px))} body.cms.depannage-chaudiere-fioul-gaz-bois-epinal-10 #main > section#sect_2 > .no_flex > .center { padding: 7em 0} body.cms #main > section > .no_flex * { text-align-last: center} body.cms #main > section > .no_flex > .center > .no_flex, body.cms #main > section > .no_flex > .center > .no_flex > .no_flex, body.cms #main > section > .no_flex > .center > .flex { margin: 0 0 8em} @media screen and (max-width: 1024px) { body.cms #main > section > .no_flex > .center > .no_flex, body.cms #main > section > .no_flex > .center > .no_flex > .no_flex, body.cms #main > section > .no_flex > .center > .flex { margin: 0 0 4em} } body.cms #main > section .flex > .container_flex:not(.on_screen), body.cms #main > section .center > .no_flex:not(.on_screen) { opacity: 0; visibility:hidden} body.cms #main > section .flex > .container_flex.on_screen, body.cms #main > section .center > .no_flex.on_screen { animation: fadeIn 2s linear 0s 1 both} body.cms #main > section > .no_flex > .center > .carousel { z-index: 2; padding: 0 1em} body.cms #main > section > .no_flex > .center > .carousel > button { position: absolute; top: 50%; transform: translateY(-50%); border: none; cursor: pointer; line-height: 0; padding: 5px; opacity: 1; z-index: 10; background: #f6912f; transition: all 0.3s linear} body.cms #main > section > .no_flex > .center > .carousel > button > svg { width: 1.7em; height: 1.7em} body.cms #main > section > .no_flex > .center > .carousel > button > svg > path { transition: all 0.3s linear} body.cms #main > section > .no_flex > .center > .carousel > button.btn.prev { left: 0} body.cms #main > section > .no_flex > .center > .carousel > button.btn.next { right: 0} body.cms #main > section > .no_flex > .center > .carousel > button:hover { background: #fff} body.cms #main > section > .no_flex > .center > .carousel > button.slick-disabled { opacity: 0; cursor: default; transition: all 0.3s linear} body.cms #main > section > .no_flex > .center > .carousel > div > div > article div { display: block; width: 100%; height: 100%; padding: 0 1em} body.cms #main > section > .no_flex > .center > .carousel > div > div > article > div > .no_flex { webkit-clip-path: polygon(2em 0, 100% 0, 100% calc(100% - 1.75em), calc(100% - 1.85em) 100%,0 100%, 0 2em); clip-path: polygon(2em 0, 100% 0, 100% calc(100% - 1.75em), calc(100% - 1.85em) 100%,0 100%, 0 2em)} body.accueil section#slider + section > .no_flex > .center > .flex.carousel article > div { padding: 0 1em} body.cms #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall { padding: 2em; position: relative; webkit-clip-path: polygon(2em 0, 100% 0, 100% calc(100% - 1.75em), calc(100% - 1.85em) 100%,0 100%, 0 2em); clip-path: polygon(2em 0, 100% 0, 100% calc(100% - 1.75em), calc(100% - 1.85em) 100%,0 100%, 0 2em)} body.cms #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.6); z-index: 1} body.cms #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall:after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 0; background-size: cover; background-position: center; background-repeat: no-repeat} body.cms.installation-chauffage-fioul-gaz-bois-solaire-remiremont-2 #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall.bloc_1:after { background-image: url('https://www.ams-chauffage.fr/upload/chaudiere-a-gaz-1646301203.jpg')} body.cms.installation-chauffage-fioul-gaz-bois-solaire-remiremont-2 #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall.bloc_2:after { background-image: url('https://www.ams-chauffage.fr/upload/chaudiere-biomasse-1646300907.jpg')} body.cms.installation-chauffage-fioul-gaz-bois-solaire-remiremont-2 #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall.bloc_3:after { background-image: url('https://www.ams-chauffage.fr/upload/chauffage-solaire-2-1646301294.jpg')} body.cms.installation-chauffage-fioul-gaz-bois-solaire-remiremont-2 #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall.bloc_4:after { background-image: url('https://www.ams-chauffage.fr/upload/pompe-a-chaleur-1643725397.jpg')} body.cms.travaux-de-plomberie-sanitaire-epinal-8 #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall.bloc_1:after { background-image: url('https://www.ams-chauffage.fr/upload/plomberie-1643895225.jpg')} body.cms.travaux-de-plomberie-sanitaire-epinal-8 #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall.bloc_2:after { background-image: url('https://www.ams-chauffage.fr/upload/robinetterie-1643895225.jpg')} body.cms.travaux-de-plomberie-sanitaire-epinal-8 #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall.bloc_3:after { background-image: url('https://www.ams-chauffage.fr/upload/adoucisseur-eau-1643895312.jpg')} body.cms.travaux-de-plomberie-sanitaire-epinal-8 #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall.bloc_4:after { background-image: url('https://www.ams-chauffage.fr/upload/canalisations-eau-1643895225.jpg')} body.cms.travaux-de-plomberie-sanitaire-epinal-8 #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall.bloc_5:after { background-image: url('https://www.ams-chauffage.fr/upload/appareils-sanitaires-1643895225.jpg')} body.cms.plombier-chauffagiste-pres-d-epinal-9 #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall:after { background-image: none} body.cms.plombier-chauffagiste-pres-d-epinal-9 #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall:before { background: #181818} body.cms.plombier-chauffagiste-pres-d-epinal-9 #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall h2 { font-size: 1.3em} @media screen and (max-width: 480px) { body.cms.plombier-chauffagiste-pres-d-epinal-9 #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall h2 { font-size: 1.2em} } body.cms #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall > * { position: relative; z-index: 2; text-align-last: center} body.cms #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall > h2 { min-height: 2.6em} body.cms #main > section > .no_flex > .center > .carousel > div > div > article h3 { font-weight: bold; text-transform: uppercase; text-shadow: 0 1px 0 rgba(255,255,255,0.6), 0 2px 0 rgba(0,0,0,0.4), -1px 0 0 rgba(255,255,255,0.6), -1px 0 0 rgba(0,0,0,0.4)} body.cms #main > section > .no_flex > .center > .carousel > div > div > article svg { width: 2.5em; height: 2.5em} @media screen and (max-width: 768px) { body.cms #main > section > .no_flex > .center > .carousel > div > div > article svg { width: 2em; height: 2em} } @media screen and (max-width: 480px) { body.cms #main > section > .no_flex > .center > .carousel > div > div > article svg { width: 1.6em; height: 1.6em} } body.cms #main > section > .no_flex > .center > .carousel > div > div > article .button svg { width: 1.4em; height: 1.4em} body.cms #main > section > .no_flex > .center > h2 { margin: 0 0 1.175em} body.cms #main > section > .no_flex > .center > .no_flex { margin: 2em 0 0} body.cms #main > section .flex > .container_flex .button, body.cms #main > section .no_flex > .no_flex .button { margin: 0 0.5em} @media screen and (max-width: 768px) { body.cms #main > section .flex > .container_flex .button, body.cms #main > section .no_flex > .no_flex .button { display: inline-block; min-width: 51%; margin: 0 0 0; font-size: 0.8em} body.cms #main > section .flex > .container_flex .button:nth-child(n+2), body.cms #main > section .no_flex > .no_flex .button:nth-child(n+2) { margin-top: 0.75em} body.cms #main > section > .no_flex > .center > .carousel > div > div > article .button { font-size: 0.8em} body.cms #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall .button svg { display: none} } @media screen and (max-width: 384px) { body.cms #main > section > .no_flex > .center > .flex.carousel article .container_flex.xsmall .button svg { display: none} } body.cms #main > section#sect_2 > .no_flex > .center > .flex > .container_flex.small { position: relative; webkit-clip-path: polygon(2em 0, 100% 0, 100% calc(100% - 1.75em), calc(100% - 1.85em) 100%,0 100%, 0 2em); clip-path: polygon(2em 0, 100% 0, 100% calc(100% - 1.75em), calc(100% - 1.85em) 100%,0 100%, 0 2em)} body.cms #main > section#sect_2 > .no_flex > .center > .flex > .container_flex.small:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.6); z-index: 1} body.cms #main > section#sect_2 > .no_flex > .center > .flex > .container_flex.small > p { line-height: 0} body.cms section#open_map { min-height: 900px; webkit-clip-path: polygon(0 6em, 100% 0, 100% 100%, 0 100%); clip-path: polygon(0 6em, 100% 0, 100% 100%, 0 100%)} /************************************************************************************************************************************************************/ /* GALERIES PHOTOS */ /************************************************************************************************************************************************************/ body.photos #main > section.vh { padding-top: 100vh; position: relative; background-position: top center; background-size: 100% 100vh; background-repeat: no-repeat; background-attachment: fixed} body.photos:not(.scroll) #main > section.vh:not(.cover) { background-position: top center !important} body.photos #main > section.vh.cover { background-size: cover} @media screen and (min-width: 481px) and (orientation: portrait) { body.photos #main > section:nth-child(1) { margin-top: 160px !important} } @media screen and (max-width: 640px) and (orientation: landscape) { body.photos #main > section.vh { background-position: 50% 0% !important} } @media screen and (max-width: 480px) and (orientation: landscape) { body.photos #main > section:nth-child(1) { margin-top: 50vh !important} body.photos #main > section.vh.cover, body.photos #main > section.vh { background-attachment: initial; background-size: auto 100vh !important; background-position: 50% 25% !important} } @media screen and (max-width: 480px) and (orientation: portrait) { body.photos #main > section:nth-child(1) { margin-top: 180px !important} } @media screen and (orientation: portrait) { body.photos #main > section.vh.cover, body.photos #main > section.vh { padding-top: 40vh; background-attachment: initial; background-size: auto 50vh; background-position: 50% 0% !important} } body.photos #main > section.vh:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 10em; background: rgba(0,0,0,0.45); z-index: 0} body.photos #main > section > .absolute { position: absolute; top: 50vh; left: 0; right: 0; padding: 2em 20%; -webkit-transition: opacity 0.5s 0.8s, -webkit-transform 0.5s 0.8s; transition: opacity 0.5s 0.8s, -webkit-transform 0.5s 0.8s; transition: transform 0.5s 0.8s, opacity 0.5s 0.8s; transition: transform 0.5s 0.8s, opacity 0.5s 0.8s, -webkit-transform 0.5s 0.8s; will-change: transform, opacity; -webkit-transform: translateY(-80%); transform: translateY(-80%); opacity: 0} body.photos #main > section > .absolute.on_screen { opacity: 1; -webkit-transform: translateY(-50%); transform: translateY(-50%)} @media screen and (max-width: 1366px) { body.photos #main > section > .absolute { right: 0} } @media screen and (max-width: 1024px) { body.photos #main > section > .absolute { -webkit-transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; padding: 0 1em 0 0} } @media screen and (max-width: 768px) { body.photos #main > section > .absolute { left: 0; padding: 3em 1.5em 0; width: 100%; -webkit-transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s} } @media screen and (orientation: portrait) { body.photos #main > section > .absolute { top: 21vh} } body.photos #main > section > .absolute { font-size: 2.5em} @media screen and (max-width: 1366px) { body.photos #main > section > .absolute { font-size: 1.9em} } @media screen and (max-width: 768px) { body.photos #main > section > .absolute { text-align: center} } @media screen and (max-width: 480px) { body.photos #main > section > .absolute { font-size: 1.4em} body.photos #main > section > .absolute a { font-size: 0.8em} } body.photos #main > section > .absolute > * { font-size: 1em; margin: 0 0; position: relative; padding: 0; text-align: center; font-weight: bold; text-transform: uppercase; text-shadow: 0 1px 0 rgba(255,255,255,0.6), 0 2px 0 rgba(0,0,0,0.4), -1px 0 0 rgba(255,255,255,0.6), -1px 0 0 rgba(0,0,0,0.4)} body.photos #main > section > .absolute > p { font-weight: normal; font-size: 0.59em; margin-top: 0.59em} body.photos #main > section > .no_flex { min-height: 1px; padding: 8em 0; display: flex; align-content: center; align-items: center; background: #090909; position: relative; top: -6em; margin-bottom: -6em !important; width: 100%; webkit-clip-path: polygon(0 6em, 100% 0, 100% 100%, 0 100%); clip-path: polygon(0 6em, 100% 0, 100% 100%, 0 100%)} @media screen and (max-width: 1024px) { body.photos #main > section > .no_flex { padding: 4em 0 0; top: 0; margin-bottom: 0 !important; webkit-clip-path: none; clip-path: none} body.photos #main > section:last-child > .no_flex { padding-bottom: 4em !important} } body.photos #main > section > .no_flex > .center > .flex > .container_flex.small { webkit-clip-path: polygon(2em 0, 100% 0, 100% calc(100% - 1.75em), calc(100% - 1.85em) 100%,0 100%, 0 2em); clip-path: polygon(2em 0, 100% 0, 100% calc(100% - 1.75em), calc(100% - 1.85em) 100%,0 100%, 0 2em)} body.photos #main > section > .no_flex > .center > .flex > .container_flex.small:nth-child(n+4) { margin-top: 4em} body.photos #main > section > .no_flex > .center > .flex > .container_flex.small:not(.on_screen) { opacity: 0; visibility:hidden} body.photos #main > section > .no_flex > .center > .flex > .container_flex.small.on_screen { animation: fadeIn 2s linear 0s 1 both} body.photos #main > section > .no_flex > .center > .flex > .container_flex.small > .no_flex { padding-top: 48.5%} body.photos #main > section > .no_flex > .center > .flex > .container_flex.small > .no_flex >.absolute { top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.6); z-index: 0} body.photos #main > section > .no_flex > .center > .flex > .container_flex.small > .no_flex img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; object-position: center} body.photos #main > section > .no_flex > .center > .flex > .container_flex.small > .no_flex h2 { position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%); z-index: 9; font-size: 1em; color: #fff; padding: 0.3em; font-weight: normal} body.photos #main > section > .no_flex > .center > .flex > .container_flex.small > .no_flex > .absolute > a { display: block; width: 100%; height: 100%} body.photos #main > section > .no_flex > .center > h2 { margin: 0 0 1.175em} body.photos #main > section > .no_flex > .center > .no_flex { margin: 2em 0 0} body.photos #main > section#galeries_liste > .no_flex > .center > #carousel { padding: 0 1em} body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > button { position: absolute; top: 50%; transform: translateY(-50%); border: none; cursor: pointer; line-height: 0; padding: 5px; opacity: 1; z-index: 10; background: #f6912f; transition: all 0.3s linear} body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > button > svg { width: 1.7em; height: 1.7em} body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > button > svg > path {²transition: all 0.3s linear} body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > button.btn.prev { left: 0} body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > button.btn.next { right: 0} body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > button:hover { background: #fff} body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > button.slick-disabled { opacity: 0; cursor: default; transition: all 0.3s linear} body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > div > div > article > div { padding: 0 30px} @media screen and (max-width: 768px) { body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > div > div > article div { padding: 0 0} } body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > div > div > article div { display: block; width: 100%; height: 100%} body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > div > div > article > div > .no_flex { webkit-clip-path: polygon(2em 0, 100% 0, 100% calc(100% - 1.75em), calc(100% - 1.85em) 100%,0 100%, 0 2em); clip-path: polygon(2em 0, 100% 0, 100% calc(100% - 1.75em), calc(100% - 1.85em) 100%,0 100%, 0 2em)} body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > div > div > article .no_flex > .no_flex > div.absolute { top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.6); z-index: 0} body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > div > div > article > div > .no_flex > .no_flex { padding-top: 48.5%} body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > div > div > article > div > .no_flex > .no_flex.current > div.absolute:before { content: ''; position: absolute; bottom: 0.25em; left: 0.75em; background: #ef632f; width: 2em; height: 2em; z-index: 1} body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > div > div > article > div > .no_flex > .no_flex.current:before { content: ''; position: absolute; bottom: 0.5em; left: 0.5em; background: #f6912f; width: 2em; height: 2em; z-index: 1} body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > div > div > article > div > .no_flex > .no_flex.current:after { content: url('data:image/svg+xml; utf8, '); position: absolute; bottom: 1em; left: 1em; width: 1em; height: 1em; z-index: 2} @media screen and (max-width: 1024px) { body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > div > div > article > div > .no_flex > .no_flex.current > div.absolute:before, body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > div > div > article > div > .no_flex > .no_flex.current:before { width: 1.5em; height: 1.5em} body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > div > div > article > div > .no_flex > .no_flex.current:after { bottom: 1.25em; left: 0.9em; width: 0.75em; height: 0.75em} } body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > div > div > article > div > .no_flex img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; object-position: center} body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > div > div > article > div > .no_flex h3 { position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%); z-index: 9; font-size: 1em; color: #fff; padding: 0.3em; font-weight: normal} body.photos #main > section#galeries_liste > .no_flex > .center > #carousel > div > div > article > div > .no_flex .no_flex > .absolute > a { display: block; width: 100%; height: 100%} body.photos #main > section#galeries_liste > .no_flex > .center > h2 { margin: 0 0 1.175em} body.photos #main > section#galeries_liste > .no_flex > .center > .no_flex { margin: 2em 0 0} /************************************************************************************************************************************************************/ /* FORMULAIRE */ /************************************************************************************************************************************************************/ body.formulaire #main > section.vh { padding-top: 100vh; position: relative; background-position: top center; background-size: 100% 100vh; background-repeat: no-repeat; background-attachment: fixed} body.formulaire:not(.scroll) #main > section.vh:not(.cover) { background-position: top center !important} body.formulaire #main > section.vh.cover { background-image: url('https://www.ams-chauffage.fr/upload/l-equipe-ams-chauffage-1643616974.jpg'); background-size: cover} @media screen and (min-width: 481px) and (orientation: portrait) { body.formulaire #main > section:nth-child(1) { margin-top: 160px !important} } @media screen and (max-width: 640px) and (orientation: landscape) { body.formulaire #main > section.vh { background-position: 50% 0% !important} } @media screen and (max-width: 480px) and (orientation: landscape) { body.formulaire #main > section:nth-child(1) { margin-top: 50vh !important} body.formulaire #main > section.vh.cover, body.formulaire #main > section.vh { background-attachment: initial; background-size: auto 100vh !important; background-position: 50% 25% !important} } @media screen and (max-width: 480px) and (orientation: portrait) { body.formulaire #main > section:nth-child(1) { margin-top: 180px !important} } @media screen and (orientation: portrait) { body.formulaire #main > section.vh.cover, body.formulaire #main > section.vh { padding-top: 40vh; background-attachment: initial; background-size: auto 50vh; background-position: 50% 0% !important} } body.formulaire #main > section.vh:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 10em; background: rgba(0,0,0,0.45); z-index: 0} body.formulaire #main > section > .absolute { position: absolute; top: 50vh; left: 0; right: 0; padding: 2em 20%; -webkit-transition: opacity 0.5s 0.8s, -webkit-transform 0.5s 0.8s; transition: opacity 0.5s 0.8s, -webkit-transform 0.5s 0.8s; transition: transform 0.5s 0.8s, opacity 0.5s 0.8s; transition: transform 0.5s 0.8s, opacity 0.5s 0.8s, -webkit-transform 0.5s 0.8s; will-change: transform, opacity; -webkit-transform: translateY(-80%); transform: translateY(-80%); opacity: 0} body.formulaire #main > section > .absolute.on_screen { opacity: 1; -webkit-transform: translateY(-50%); transform: translateY(-50%)} @media screen and (max-width: 1366px) { body.formulaire #main > section > .absolute { right: 0} } @media screen and (max-width: 1024px) { body.formulaire #main > section > .absolute { -webkit-transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; padding: 0 1em 0 0} } @media screen and (max-width: 768px) { body.formulaire #main > section > .absolute { left: 0; padding: 3em 1.5em 0; width: 100%; -webkit-transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s} } @media screen and (orientation: portrait) { body.formulaire #main > section > .absolute { top: 21vh} } body.formulaire #main > section > .absolute { font-size: 2.5em} @media screen and (max-width: 1366px) { body.formulaire #main > section > .absolute { font-size: 1.9em} } @media screen and (max-width: 768px) { body.formulaire #main > section > .absolute { text-align: center} } @media screen and (max-width: 480px) { body.formulaire #main > section > .absolute { font-size: 1.4em} body.formulaire #main > section > .absolute a { font-size: 0.8em} } body.formulaire #main > section > .absolute > * { font-size: 1em; margin: 0 0; position: relative; padding: 0; text-align: center; font-weight: bold; text-transform: uppercase; text-shadow: 0 1px 0 rgba(255,255,255,0.6), 0 2px 0 rgba(0,0,0,0.4), -1px 0 0 rgba(255,255,255,0.6), -1px 0 0 rgba(0,0,0,0.4)} body.formulaire #main > section > .absolute > p { font-weight: normal; font-size: 0.59em; margin-top: 0.59em} body.formulaire #main > section > .no_flex { min-height: 1px; padding: 8em 0 4em; display: flex; align-content: center; align-items: center; background: #090909; position: relative; top: -6em; margin-bottom: -6em !important; width: 100%; webkit-clip-path: polygon(0 6em, 100% 0, 100% 100%, 0 100%); clip-path: polygon(0 6em, 100% 0, 100% 100%, 0 100%)} body.formulaire #main > section:nth-child(2) > .no_flex { padding: 0 0; top: 0} body.formulaire #main > section:nth-child(2) > .no_flex:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 0; background: #181818; webkit-clip-path: polygon(0 6em, 100% 0, 100% calc(100% - 6em), 0 calc(100% - 10px)); clip-path: polygon(0 6em, 100% 0, 100% calc(100% - 6em), 0 calc(100% - 10px))} @media screen and (max-width: 1024px) { body.formulaire #main > section:nth-child(2) > .no_flex:before { webkit-clip-path: none; clip-path: none} } body.formulaire #main > section:nth-child(2) > .no_flex > .center { padding: 7em 0 8em} @media screen and (max-width: 1024px) { body.formulaire #main > section:nth-child(2) > .no_flex > .center { padding: 0 0 0} body.formulaire #main > section > .no_flex { padding: 4em 0 0} body.formulaire #main > section:last-child > .no_flex { padding-bottom: 4em !important} body.formulaire #main > section:nth-child(2) { margin-top: 4em} body.formulaire #main > section:nth-child(2) > .no_flex { padding: 4em 0 6em; margin-bottom: -4em !important} body.formulaire #main > section > .no_flex { top: 0; margin-bottom: 0 !important; webkit-clip-path: none; clip-path: none} } @media screen and (max-width: 768px) { body.formulaire #main > section:nth-child(2) > .no_flex { padding: 4em 0 4em} } body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form > .flex { margin: 0 0 1em} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form input, body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form textarea { border-top: none; border-left: none; border-right: none} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form .button { font: 18px 'Zen Kaku Gothic New'; background: transparent} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form .file-button { font: 18px 'Zen Kaku Gothic New'; display: inline-block; width: auto; max-width: 100%; border: none; position: relative; text-shadow: none; padding: 0.15em 0.75em 0.15em; line-height: 1em; text-transform: uppercase; color: #000} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form .file-button:before, body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form .file-button:after { content: ''; position: absolute; left: 0; z-index: -1; transition: all 0.3s linear} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form .file-button:before { top: 0; left: 0; right: 0; bottom: 0; background: #f6912f} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form .file-button:after { top: 0.25em; left: 0.25em; bottom: -0.25em; right: -0.217em; z-index: -2; background: #ef632f; border-radius: 0; height: 100%; width: 100%; transition: all 0.3s linear 0.1s, border-radius 0.1s linear 0s, z-index 0.1s linear 0s} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form .file-button:hover:after { top: calc(100% - 0.25em); left: calc(100% - 0.25em); border-radius: 50%; height: 0.5em; width: 0.5em; z-index: 0; transition: all 0.3s linear, border-radius 0.1s linear 0.3s, z-index 0.1s linear 0.3s} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form .file-button > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; display: inline-block; font: 18px 'Zen Kaku Gothic New'} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form .input-file { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 0; margin: 0; border: 0; cursor: pointer !important; opacity: 0 !important; filter: alpha(opacity=0); font-size: 0} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form > .flex#captcha br { line-height: 2em} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form > .flex#captcha svg { color: #fff; fill: #fff} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form .file-button svg, body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form .button svg { width: 1em} @media screen and (max-width: 768px) { body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form > .flex { margin-bottom: 1.5em !important} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form label { margin-bottom: 0.5em !important} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form label br { display: none} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form label br + strong { margin-left: 0.25em} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form > .flex:last-child { margin-top: 2em} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form > .flex:last-child > div { width: 100%; text-align: center} body.formulaire #main > section > .no_flex > .center > .flex > .container_flex > form .file-button, body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form .button { font-size: 0.8em; width: 95%} body.formulaire #main > section > .no_flex > .center > .flex > .container_flex > form .file-button > span { font: 14.4px 'Zen Kaku Gothic New'} } body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form .bloc-info { min-height: 1px; margin-bottom: 1em !important} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > form .bloc-info p > .absolute { font-size: 1em} body.formulaire section#open_map { min-height: 900px; webkit-clip-path: polygon(0 6em, 100% 0, 100% 100%, 0 100%); clip-path: polygon(0 6em, 100% 0, 100% 100%, 0 100%)} body.formulaire #main > section > .no_flex > .center > .flex { margin: 0 0 8em} @media screen and (max-width: 1024px) { body.formulaire #main > section > .no_flex > .center > .flex > .container_flex.xmedium { width: 85% !important} } @media screen and (max-width: 480px) { body.formulaire #main > section > .no_flex > .center > .flex > .container_flex.xmedium { width: 100% !important} } body.formulaire #main > section > .no_flex > .center > .flex >.container_flex:not(.on_screen), body.formulaire #main > section#open_map:not(.on_screen) { opacity: 0; visibility:hidden} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex.on_screen, body.formulaire #main > section#open_map.on_screen { animation: fadeIn 2s linear 0s 1 both} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > .align_center { margin: 0 0 2em} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > ul > li:last-child { padding-bottom: 0.5em} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > ul > li > .button:first-child { margin-right: 0.5em} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > ul > li > .button:last-child { margin-left: 0.5em} @media screen and (max-width: 768px) { body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > ul > li > .button { display: inline-block; min-width: 51%; margin: 0 0 0; font-size: 0.8em} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > ul > li > .button:first-child { margin-right: 0} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > ul > li > .button:last-child { margin-left: 0} body.formulaire #main > section > .no_flex > .center > .flex >.container_flex > ul > li > .button:nth-child(n+2) { margin-top: 0.75em} } /************************************************************************************************************************************************************/ /* MENTIONS LÉGALES */ /************************************************************************************************************************************************************/ body.mentions_legales #main > section { min-height: 66vh; margin: 0 0; display: flex; justify-content: center; align-items: start; flex-wrap: wrap; animation: fadeIn 1s linear 0s 1 both} @media screen and (min-width: 481px) and (orientation: portrait) { body.mentions_legales #main > section { margin-top: 160px !important} } @media screen and (max-width: 480px) and (orientation: landscape) { body.mentions_legales #main > section { margin-top: 50vh !important} } @media screen and (max-width: 480px) and (orientation: portrait) { body.mentions_legales #main > section { margin-top: 180px !important} } body.mentions_legales #main > section > .no_flex { width: 100%; padding: 8em 0; background: rgba(9,9,9,1)} body.mentions_legales #main > section > .no_flex > .center > .flex, body.mentions_legales #main > section > .no_flex > .center > .no_flex, body.mentions_legales #main > section > .no_flex > .center > .no_flex > .no_flex, body.mentions_legales #main > section > .no_flex > .center > .no_flex > .flex { margin: 8em 0 0} body.mentions_legales #main > section > .no_flex > .center > .no_flex { margin: 4em 0 0} @media screen and (max-width: 1024px) { body.mentions_legales #main > section > .no_flex { padding: 4em 0 0} body.mentions_legales #main > section:last-child > .no_flex { padding-bottom: 4em !important} body.mentions_legales #main > section > .no_flex > .center > .flex, body.mentions_legales #main > section > .no_flex > .center > .no_flex, body.mentions_legales #main > section > .no_flex > .center > .no_flex > .no_flex, body.mentions_legales #main > section > .no_flex > .center > .no_flex > .flex { margin: 4em 0 0} } body.mentions_legales #main > section > .no_flex > .center > .flex:not(.on_screen) { opacity: 0; visibility:hidden} body.mentions_legales #main > section > .no_flex > .center > .flex.on_screen { animation: fadeIn 2s linear 0s 1 both} body.mentions_legales #main > section > .no_flex > .center > .no_flex > ol > li { margin: 0 0 0.5em} body.mentions_legales #main > section > .no_flex > .center > .no_flex > ol > li > a { border: none} body.mentions_legales #main > section > .no_flex > .center > .no_flex > ol > li > a > span { margin-left: 1em} /************************************************************************************************************************************************************/ /* ERREURS */ /************************************************************************************************************************************************************/ body.erreur #main > section { min-height: 66vh; margin: 0 0; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; animation: fadeIn 1s linear 0s 1 both} @media screen and (min-width: 481px) and (orientation: portrait) { body.erreur #main > section { margin-top: 160px !important} } @media screen and (max-width: 480px) and (orientation: landscape) { body.erreur #main > section { margin-top: 50vh !important} } @media screen and (max-width: 480px) and (orientation: portrait) { body.erreur #main > section { margin-top: 180px !important} } body.erreur #main > section > .no_flex { width: 100%; padding: 8em 0; background: rgba(9,9,9,1)} body.erreur #main > section > .no_flex > .center > .flex, body.erreur #main > section > .no_flex > .center > .no_flex, body.erreur #main > section > .no_flex > .center > .no_flex > .no_flex, body.erreur #main > section > .no_flex > .center > .no_flex > .flex { margin: 8em 0 0} body.erreur #main > section > .no_flex > .center > .no_flex { margin: 4em 0 0} @media screen and (max-width: 1024px) { body.erreur #main > section > .no_flex { padding: 4em 0 0} body.erreur #main > section:last-child > .no_flex { padding-bottom: 4em !important} body.erreur #main > section > .no_flex > .center > .flex, body.erreur #main > section > .no_flex > .center > .no_flex, body.erreur #main > section > .no_flex > .center > .no_flex > .no_flex, body.erreur #main > section > .no_flex > .center > .no_flex > .flex { margin: 4em 0 0} } body.erreur #main > section > .no_flex > .center > .flex:not(.on_screen) { opacity: 0; visibility:hidden} body.erreur #main > section > .no_flex > .center > .flex.on_screen { animation: fadeIn 2s linear 0s 1 both} body.erreur #main > section > .no_flex > .center > .no_flex > ol > li { margin: 0 0 0.5em} body.erreur #main > section > .no_flex > .center > .no_flex > ol > li > a { border: none} body.erreur #main > section > .no_flex > .center > .no_flex > ol > li > a > span { margin-left: 1em} /************************************************************************************************************************************************************/ /* AVIS CLIENTS */ /************************************************************************************************************************************************************/ body.avis-clients #main > section.vh { padding-top: 100vh; position: relative; background-position: top center; background-size: 100% 100vh; background-repeat: no-repeat; background-attachment: fixed} body.avis-clients:not(.scroll) #main > section.vh:not(.cover) { background-position: top center !important} body.avis-clients #main > section.vh.cover { background-image: url('https://www.ams-chauffage.fr/upload/l-equipe-ams-chauffage-1643616974.jpg'); background-size: cover} @media screen and (min-width: 481px) and (orientation: portrait) { body.avis-clients #main > section:nth-child(1) { margin-top: 160px !important} } @media screen and (max-width: 640px) and (orientation: landscape) { body.avis-clients #main > section.vh { background-position: 50% 0% !important} } @media screen and (max-width: 480px) and (orientation: landscape) { body.avis-clients #main > section:nth-child(1) { margin-top: 50vh !important} body.avis-clients #main > section.vh.cover, body.avis-clients #main > section.vh { background-attachment: initial; background-size: auto 100vh !important; background-position: 50% 25% !important} } @media screen and (max-width: 480px) and (orientation: portrait) { body.avis-clients #main > section:nth-child(1) { margin-top: 180px !important} } @media screen and (orientation: portrait) { body.avis-clients #main > section.vh.cover, body.avis-clients #main > section.vh { padding-top: 40vh; background-attachment: initial; background-size: auto 50vh; background-position: 50% 0% !important} } body.avis-clients #main > section.vh:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 10em; background: rgba(0,0,0,0.45); z-index: 0} body.avis-clients #main > section > .absolute { position: absolute; top: 50vh; left: 0; right: 0; padding: 2em 20%; -webkit-transition: opacity 0.5s 0.8s, -webkit-transform 0.5s 0.8s; transition: opacity 0.5s 0.8s, -webkit-transform 0.5s 0.8s; transition: transform 0.5s 0.8s, opacity 0.5s 0.8s; transition: transform 0.5s 0.8s, opacity 0.5s 0.8s, -webkit-transform 0.5s 0.8s; will-change: transform, opacity; -webkit-transform: translateY(-80%); transform: translateY(-80%); opacity: 0} body.avis-clients #main > section > .absolute.on_screen { opacity: 1; -webkit-transform: translateY(-50%); transform: translateY(-50%)} @media screen and (max-width: 1366px) { body.avis-clients #main > section > .absolute { right: 0} } @media screen and (max-width: 1024px) { body.avis-clients #main > section > .absolute { -webkit-transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; padding: 0 1em 0 0} } @media screen and (max-width: 768px) { body.avis-clients #main > section > .absolute { left: 0; padding: 3em 1.5em 0; width: 100%; -webkit-transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s} } @media screen and (orientation: portrait) { body.avis-clients #main > section > .absolute { top: 21vh} } body.avis-clients #main > section > .absolute { font-size: 2.5em} @media screen and (max-width: 1366px) { body.avis-clients #main > section > .absolute { font-size: 1.9em} } @media screen and (max-width: 768px) { body.avis-clients #main > section > .absolute { text-align: center} } @media screen and (max-width: 480px) { body.avis-clients #main > section > .absolute { font-size: 1.4em} body.avis-clients #main > section > .absolute a { font-size: 0.8em} } body.avis-clients #main > section > .absolute > * { font-size: 1em; margin: 0 0; position: relative; padding: 0; text-align: center; font-weight: bold; text-transform: uppercase; text-shadow: 0 1px 0 rgba(255,255,255,0.6), 0 2px 0 rgba(0,0,0,0.4), -1px 0 0 rgba(255,255,255,0.6), -1px 0 0 rgba(0,0,0,0.4)} body.avis-clients #main > section > .absolute > p { font-weight: normal; font-size: 0.59em; margin-top: 0.59em} body.avis-clients #main > section > .no_flex { min-height: 1px; padding: 8em 0 4em; display: flex; align-content: center; align-items: center; background: #090909; position: relative; top: -6em; margin-bottom: -6em !important; width: 100%; webkit-clip-path: polygon(0 6em, 100% 0, 100% 100%, 0 100%); clip-path: polygon(0 6em, 100% 0, 100% 100%, 0 100%)} body.avis-clients #main > section:nth-child(2) > .no_flex { padding: 0 0; top: 0} body.avis-clients #main > section:nth-child(2) > .no_flex:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 0; background: #181818; webkit-clip-path: polygon(0 6em, 100% 0, 100% calc(100% - 6em), 0 calc(100% - 10px)); clip-path: polygon(0 6em, 100% 0, 100% calc(100% - 6em), 0 calc(100% - 10px))} @media screen and (max-width: 1024px) { body.avis-clients #main > section:nth-child(2) > .no_flex:before { webkit-clip-path: none; clip-path: none} } body.avis-clients #main > section:nth-child(2) > .no_flex > .center { padding: 7em 0 8em} @media screen and (max-width: 1024px) { body.avis-clients #main > section:nth-child(2) > .no_flex > .center { padding: 0 0 0} body.avis-clients #main > section > .no_flex { padding: 4em 0 0} body.avis-clients #main > section:last-child > .no_flex { padding-bottom: 4em !important} body.avis-clients #main > section:nth-child(2) { margin-top: 4em} body.avis-clients #main > section:nth-child(2) > .no_flex { padding: 4em 0 6em; margin-bottom: -4em !important} body.avis-clients #main > section > .no_flex { top: 0; margin-bottom: 0 !important; padding-bottom: 4em; webkit-clip-path: none; clip-path: none} } @media screen and (max-width: 768px) { body.avis-clients #main > section:nth-child(2) > .no_flex { padding: 4em 0 4em} } body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex form > .flex { margin: 0 0 1em} body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex form input, body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex form textarea { border-top: none; border-left: none; border-right: none; color: #fff; background-color: #090909; border-color: #797979} body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex form input::placeholder, body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex > form textarea::placeholder { opacity: 0.4; font-size: 0.85em; -webkit-transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s; transition: transform 0.5s 0.5s, opacity 0.5s 0.5s, -webkit-transform 0.5s 0.5s; color: #fff} body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex form input:focus::placeholder, body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex > form textarea:focus::placeholder { opacity: 0} body.avis-clients.depot #main > section > .no_flex > .center > .flex >.container_flex form .star { cursor: pointer} body.avis-clients.depot #main > section > .no_flex > .center > .flex >.container_flex form .star:not(.hover):not(.selected) { opacity: 0.4} body.avis-clients.depot #main > section > .no_flex > .center > .flex >.container_flex form .star.hover, body.avis-clients.depot #main > section > .no_flex > .center > .flex >.container_flex form .star.selected { opacity: 1} body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex > form .button svg { width: 1em} @media screen and (max-width: 768px) { body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex > form > .flex { margin-bottom: 1.5em !important} body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex > form label { margin-bottom: 0.5em !important} body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex > form label br { display: none} body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex > form label br + strong { margin-left: 0.25em} body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex > form > .flex:last-child { margin-top: 2em} body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex > form > .flex:last-child > div { width: 100%; text-align: center} body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex > form .button { font-size: 0.8em; width: 100%} } body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex > form .bloc-info { min-height: 1px; margin-bottom: 1em !important} body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex > form .bloc-info p > .absolute { font-size: 1em} body.avis-clients #main > section > .no_flex > .center > .flex { margin: 0 0 2.5em} @media screen and (max-width: 1024px) { body.avis-clients #main > section > .no_flex > .center > .flex > .container_flex.xmedium { width: 85% !important} body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex form > .flex.content_between { justify-content: space-between} } @media screen and (max-width: 480px) { body.avis-clients #main > section > .no_flex > .center > .flex > .container_flex.xmedium { width: 100% !important} body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex form > .flex.content_between { justify-content: center} body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex form > .flex.content_between > p { width: 100%; text-align: center; margin: 0 0 1em} } body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex:not(.on_screen) { opacity: 0; visibility:hidden} body.avis-clients #main > section > .no_flex > .center > .flex >.container_flex.on_screen { animation: fadeIn 2s linear 0s 1 both} body.avis-clients.depot #main > section > .no_flex > .center > .flex >.container_flex form .flex.swal { margin: 0 0 0; top: 0; left: 0; right: 0; bottom: 0; background: #090909} body.avis-clients.depot #main > section > .no_flex > .center > .flex >.container_flex form .flex.swal:not(.show) { opacity: 0; visibility: hidden; top: 100%; -webkit-transform: translateX(0) translateY(50%); transform: translateX(0) translateY(50%); transition: transform 0.5s 0s, visibility 0.5s 0s, z-index 0.5s 0s, top 0.5s 0s, opacity 0.5s 0s, -webkit-transform 0.5s 0s; will-change: transform, opacity} body.avis-clients.depot #main > section > .no_flex > .center > .flex >.container_flex form .flex.swal.show { opacity: 1; visibility: visible; top: 0; -webkit-transform: translateX(0) translateY(0); transform: translateX(0) translateY(0); transition:transform 0.5s 0s, visibility 0.5s 0s,top 0.5s 0s, opacity 0.5s 0s, -webkit-transform 0.5s 0s; will-change: transform, opacity} body.avis-clients.depot #main > section > .no_flex > .center > .flex >.container_flex ul { width: 100% !important; margin: 2em 0 0 !important; padding: 0 0 0 !important} body.avis-clients.depot #main > section > .no_flex > .center > .flex >.container_flex ul > li { margin: 0 2% 2em !important; padding: 0 0 0 !important} body.avis-clients.depot #main > section > .no_flex > .center > .flex >.container_flex ul > li:not(.on_screen) { opacity: 0; transition: 0.36s cubic-bezier(0.4, 0, 1, 1)} body.avis-clients.depot #main > section > .no_flex > .center > .flex >.container_flex ul > li.on_screen { opacity: 1; transition: 0.36s cubic-bezier(0.4, 0, 1, 1)} body.avis-clients.depot #main > section > .no_flex > .center > .flex >.container_flex ul > li::before { display: none!important} body.avis-clients #main > section > .no_flex > .center > .flex form select { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: auto; overflow: hidden; text-overflow: ellipsis; padding-right: 1.5em; background: #f6912f; color: #000; border: none; text-align: left; cursor: pointer} body.avis-clients #main > section > .no_flex > .center > .flex > .container_flex.medium .hidden { display: none} body.avis-clients #main > section > .no_flex > .center > .flex > .container_flex.medium { background: #181818; padding: 2em 2em 2em 3em; position: relative; webkit-clip-path: polygon(0 0, 100% 0, 100% calc(100% - 1.75em), calc(100% - 1.85em) 100%,0 100%, 0 2em); clip-path: polygon(-1em -1em, 100% 0, 100% calc(100% - 1.75em), calc(100% - 1.85em) 100%,0 100%, -1em -1em);} body.avis-clients #main > section > .no_flex > .center > .flex > .container_flex.medium > .flex > .absolute { top: -0.5em; left: -0.5em; background: rgb(246, 145, 47) none repeat scroll 0% 0%; border-radius: 50%; width: 3em; height: 3em; display: flex; align-items: center; justify-content: center; font-weight: bold; color: rgb(0, 0, 0);} body.avis-clients #main > section > .no_flex > .center > .flex > .container_flex.medium > .flex > .container_flex { margin-bottom: 1em} body.avis-clients #main > section > .no_flex > .center > .flex > .container_flex.medium > .flex > .container_flex h2 { margin-bottom: 0} body.avis-clients #main > section > .no_flex > .center > .flex > .container_flex.medium > .flex > .container_flex.flex > .no_flex:first-child { margin-right: 1em} body.avis-clients #main > section > .no_flex > .center > .flex > .container_flex.medium > .flex > .container_flex.flex > .no_flex:last-child { margin-left: 1em} body.avis-clients #main > section > .no_flex > .center > .flex > .container_flex.medium > .flex > .container_flex:last-child { padding-top: 0.5em; border-top: 1px solid #797979} body.avis-clients #swal { display: none} @media screen and (max-width: 1700px) { body.avis-clients #main > section > .no_flex > .center > .flex > .container_flex.medium > .flex > .absolute { left: 0} } @media screen and (max-width: 1440px) { body.avis-clients #main > section > .no_flex > .center > .flex > .container_flex.medium > .flex > .flex.content_between { justify-content: end} body.avis-clients #main > section > .no_flex > .center > .flex > .container_flex.medium > .flex > .container_flex.flex > h2 { width: 100%; order: 2} body.avis-clients #main > section > .no_flex > .center > .flex > .container_flex.medium > .flex > .container_flex.flex > .container_flex.small { order: 1; width: 51%; margin-top: -1em} }