/* convertir ttf en woff2 en ligne : https://transfonter.org/ */ @font-face {font-family: 'Poppins';src: url('../fonts/Poppins-Thin.woff2') format('woff2');font-weight: 100;font-style: normal;font-display: swap;} @font-face {font-family: 'Poppins';src: url('../fonts/Poppins-ThinItalic.woff2') format('woff2');font-weight: 100;font-style: italic;font-display: swap;} @font-face {font-family: 'Poppins';src: url('../fonts/Poppins-ExtraLight.woff2') format('woff2');font-weight: 200;font-style: normal;font-display: swap;} @font-face {font-family: 'Poppins';src: url('../fonts/Poppins-ExtraLightItalic.woff2') format('woff2');font-weight: 200;font-style: italic;font-display: swap;} @font-face {font-family: 'Poppins';src: url('../fonts/Poppins-Light.woff2') format('woff2');font-weight: 300;font-style: normal;font-display: swap;} @font-face {font-family: 'Poppins';src: url('../fonts/Poppins-LightItalic.woff2') format('woff2');font-weight: 300;font-style: italic;font-display: swap;} @font-face {font-family: 'Poppins';src: url('../fonts/Poppins-Regular.woff2') format('woff2');font-weight: normal;font-style: normal;font-display: swap;} @font-face {font-family: 'Poppins';src: url('../fonts/Poppins-Italic.woff2') format('woff2');font-weight: normal;font-style: italic;font-display: swap;} @font-face {font-family: 'Poppins';src: url('../fonts/Poppins-Medium.woff2') format('woff2');font-weight: 500;font-style: normal;font-display: swap;} @font-face {font-family: 'Poppins';src: url('../fonts/Poppins-MediumItalic.woff2') format('woff2');font-weight: 500;font-style: italic;font-display: swap;} @font-face {font-family: 'Poppins';src: url('../fonts/Poppins-SemiBold.woff2') format('woff2');font-weight: 600;font-style: normal;font-display: swap;} @font-face {font-family: 'Poppins';src: url('../fonts/Poppins-SemiBoldItalic.woff2') format('woff2');font-weight: 600;font-style: italic;font-display: swap;} @font-face {font-family: 'Poppins';src: url('../fonts/Poppins-Bold.woff2') format('woff2');font-weight: bold;font-style: normal;font-display: swap;} @font-face {font-family: 'Poppins';src: url('../fonts/Poppins-BoldItalic.woff2') format('woff2');font-weight: bold;font-style: italic;font-display: swap;} @font-face {font-family: 'Poppins';src: url('../fonts/Poppins-ExtraBold.woff2') format('woff2');font-weight: bold;font-style: normal;font-display: swap;} @font-face {font-family: 'Poppins';src: url('../fonts/Poppins-ExtraBoldItalic.woff2') format('woff2');font-weight: bold;font-style: italic;font-display: swap;} @font-face {font-family: 'Poppins';src: url('../fonts/Poppins-Black.woff2') format('woff2');font-weight: 900;font-style: normal;font-display: swap;} @font-face {font-family: 'Poppins';src: url('../fonts/Poppins-BlackItalic.woff2') format('woff2');font-weight: 900;font-style: italic;font-display: swap;} /* .svg-primary {fill: #eb0525;} .svg-secondary {fill: #f07e24;} .svg-primary {fill: #ff611c;} .svg-secondary {fill: #f50538;} */ :root { --error: #f82452; --error-rgb: 239, 68, 68; --success: #22c55e; --success-rgb: 34, 197, 94; --info-rgb: 76, 130, 247; --warning-rgb: 255, 186, 8; --danger-rgb: 239, 68, 68; --white: #fff; --white-rgb: 255, 255, 255; --dark: #232323; --dark-rgb: 35, 35, 35; --black: #000; --black-rgb: 0, 0, 0; --gray-lightest: #f9f9f9; --gray-lightest-rgb: 249, 249, 249; --yellow-lightest: #fff8ee; --yellow-lightest-rgb: 255, 248, 238; --yellow-rgb: 255, 255, 0; --yellow-medium-rgb: 255, 186, 8; /* =============================================================== PRIMARY = BLEU ACRONET =============================================================== */ --primary-lightest: #e6f4ff; --primary-lightest-rgb: 230, 244, 255; --primary-lighter: #bfe4ff; --primary-lighter-rgb: 191, 228, 255; --primary-light: #80c9ff; --primary-light-rgb: 128, 201, 255; --primary-light-medium: #bac6d2; --primary-light-medium-rgb: 186, 198, 210; --primary-medium-light: #3fb0fb; --primary-medium: #0598f5; --primary-medium-rgb: 5, 152, 245; --primary-medium-dark: #047ac4; --primary-dark: #192340; --primary-dark-rgb: 25, 35, 64; --primary-dark-darkest: #0c1320; --primary-dark-darkest-rgb: 12, 19, 32; --primary-darkest: #020917; --primary-darkest-rgb: 2, 9, 23; /* Teintes complémentaires PRIMARY */ --primary-fluo: #36e3ff; --primary-fluo-rgb: 36, 227, 255; --primary-leger: #f0f8ff; --primary-leger-rgb: 240, 248, 255; --primary-moyen: #046fb4; --primary-moyen-rgb: 4, 111, 180; /* =============================================================== SECONDARY = ROUGE ACRONET =============================================================== */ --secondary-lightest: #ffe6ec; --secondary-lightest-rgb: 255, 230, 236; --secondary-lighter: #ffccd9; --secondary-lighter-rgb: 255, 204, 217; --secondary-light: #ff99b3; --secondary-light-rgb: 255, 153, 179; --secondary-medium-light: #f93a5f; --secondary-medium: #f50538; --secondary-medium-rgb: 245, 5, 56; --secondary-dark: #b6042a; --secondary-dark-rgb: 176, 4, 42; --secondary-darkest: #79021c; --secondary-darkest-rgb: 121, 2, 28; /* Teintes complémentaires SECONDARY */ --secondary-fluo: #ff2b63; --secondary-fluo-rgb: 255, 43, 99; --secondary-leger: #fff0f4; --secondary-leger-rgb: 255, 240, 244; --secondary-moyen: #d90431; --secondary-moyen-rgb: 217, 4, 49; /* =============================================================== Tertiaires / Quaternaires (inchangés) =============================================================== */ --tertiary-fluo: #fc3cf9; --tertiary-fluo-rgb: 252, 60, 249; --tertiary-medium: #8633ff; --tertiary-medium-rgb: 134, 51, 255; --quaternary-fluo: #3cfffc; --quaternary-fluo-rgb: 60, 255, 252; --quaternary-leger: #37a8ff; --quaternary-leger-rgb: 55, 168, 255; --quaternary-medium: #0063cc; --quaternary-medium-rgb: 0, 99, 204; --quaternary-moyen: #0063cc; --quaternary-moyen-rgb: 0, 99, 204; /* =============================================================== QUINARY = ORANGE ACRONET (#ff611c) =============================================================== */ --quinary-lightest: #fff1e8; --quinary-lightest-rgb: 255, 241, 232; --quinary-lighter: #ffd8bf; --quinary-lighter-rgb: 255, 216, 191; --quinary-light: #ffb88c; --quinary-light-rgb: 255, 184, 140; --quinary-medium-light: #ff8747; --quinary-medium: #ff611c; --quinary-medium-rgb: 255, 97, 28; --quinary-dark: #b34414; --quinary-dark-rgb: 179, 68, 20; --quinary-darkest: #73270a; --quinary-darkest-rgb: 115, 39, 10; /* Teintes complémentaires QUINARY */ --quinary-fluo: #ff8a3d; --quinary-fluo-rgb: 255, 138, 61; --quinary-leger: #fff7f0; --quinary-leger-rgb: 255, 247, 240; --quinary-moyen: #e65519; --quinary-moyen-rgb: 230, 85, 25; /* ================================================================== */ --h1: 3.8rem; --h2: 3.8rem; --h3: 2.625rem; --h4: 2.25rem; --h5: 1.75rem; --h6: 1.5rem; --fs-max: 6rem; --fs-middle: 3rem; --menu-btn-bg-color: rgba(var(--black-rgb), 1); --menu-btn-active-width: 136%; --menu-btn-transition-duration: 0.3s; --menu-btn-transition-easing: ease; --btn-padding-y: 1rem; --btn-padding-x: 2rem; --btn-font-size: 1rem; --btn-font-weight: 600; --btn-border-color: var(--black-rgb); --btn-border-color-hover: var(--primary-dark-rgb); --btn-border-width: 0.2rem; --btn-border-radius: 0.5rem; --btn-background-color: var(--black-rgb); --btn-background-color-hover: var(--primary-dark-rgb); --btn-color: var(--white-rgb); --btn-color-hover: var(--white-rgb); --btn-shadow-color: var(--black-rgb); --btn-shadow-color-hover: var(--primary-light-rgb); --primary-font: 'Poppins', Arial, sans-serif; } *,*::before,*::after {box-sizing: border-box;} html, body {--opacity: 1;margin: 0;padding: 0;font-size: 16px;font-family: 'Poppins', Arial, sans-serif;font-weight: 400;color: rgba(var(--black-rgb), 1);background-color: rgba(var(--white-rgb), var(--opacity));} /* Animations */ @keyframes removeBlur {from {backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px);}to {backdrop-filter: blur(0px);-webkit-backdrop-filter: blur(0px);}} @keyframes addBlur {from {backdrop-filter: blur(0px);-webkit-backdrop-filter: blur(0px);}to {backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px);}} @keyframes svgFadeInUp {from {opacity: 0;transform: translate(-50%, -30%);}to {opacity: 1;transform: translate(-50%, -50%);}} a {color: inherit;text-decoration: inherit;} a:not([class]) {text-decoration-line: underline;text-underline-offset: 2px;} a:not([class]):hover {text-decoration-line: none;} a[target=_blank]:not(.no-icon):after {content:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAQElEQVR42qXKwQkAIAxDUUdxtO6/RBQkQZvSi8I/pL4BoGw/XPkh4XigPmsUgh0626AjRsgxHTkUThsG2T/sIlzdTsp52kSS1wAAAABJRU5ErkJggg==); margin:0 3px 0 5px} img, figure {max-width: 100%;height: auto;vertical-align: middle;} figure {margin: 0 0 1rem;} table {caption-side: bottom;border-collapse: collapse} caption {padding-top: .75rem;padding-bottom: .75rem;color:var(--black-rgb);text-align: left;} th {font-weight: 700;text-align: inherit;text-align: -webkit-match-parent;} thead,tbody,tfoot,tr,td,th {border-color: inherit;border-style: solid;border-width: 0;} label {display: inline-block;} button {border-radius: 0;} button:focus:not(:focus-visible) {outline: 0;} input, button, select, optgroup, textarea {margin: 0;font-family: inherit;font-size: inherit;line-height: inherit;} button, select {text-transform: none;} [role=button] {cursor: pointer;} select {word-wrap: normal;} select:disabled {opacity: 1;} [list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator {display: none !important;} button,[type=button],[type=reset],[type=submit] {-webkit-appearance: button;appearance: button;} button:not(:disabled),[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled) {cursor: pointer;} ::-moz-focus-inner {padding: 0;border-style: none;} textarea {resize: vertical;min-height: calc(1.6em + 1.25rem + 2px);} fieldset {min-width: 0;padding: 0;margin: 0;border: 0;} legend {float: left;width: 100%;padding: 0;margin-bottom: .5rem;font-size: calc(1.275rem + 0.3vw);line-height: inherit;} .visually-hidden, .visually-hidden-focusable:not(:focus):not(:focus-within) {position: absolute !important;width: 1px !important;height: 1px !important;padding: 0 !important;margin: -1px !important;overflow: hidden !important;clip: rect(0, 0, 0, 0) !important;white-space: nowrap !important;border: 0 !important;} .text-white {--opacity: 1;color: rgba(var(--white-rgb), var(--opacity));} .text-black {--opacity: 1;color: rgba(var(--black-rgb), var(--opacity));} .text-yellow-lightest {--opacity: 1;color: rgba(var(--yellow-lightest-rgb), var(--opacity));} .text-primary-lightest {--opacity: 1;color: rgba(var(--primary-lightest-rgb), var(--opacity));} .text-primary-lighter {--opacity: 1;color: rgba(var(--primary-lighter-rgb), var(--opacity));} .text-primary-light {--opacity: 1;color: rgba(var(--primary-light-rgb), var(--opacity));} .text-primary-medium {--opacity: 1;color: rgba(var(--primary-medium-rgb), var(--opacity));} .text-primary-dark {--opacity: 1;color: rgba(var(--primary-dark-rgb), var(--opacity));} .text-primary-darkest {--opacity: 1;color: rgba(var(--primary-darkest-rgb), var(--opacity));} .text-hl {position: relative;display: inline;white-space: nowrap;--opacity: 0.5;--highlight-color: rgba(var(--yellow-rgb), var(--opacity));} .text-hl::before {content: '';position: absolute;z-index: -1;top: 50%;left: -0.8rem;right: -0.8rem;height: 0.55em;transform: translateY(-45%) rotate(-1deg);background-color: var(--highlight-color);border-radius: 0.5rem;} .text-hl-yellow {--opacity: 0.5;--highlight-color: rgba(var(--yellow-rgb), var(--opacity));} .text-hl-primary {--opacity: 0.5;--highlight-color: rgba(var(--primary-medium-rgb), var(--opacity));} .text-hl-secondary {--opacity: 0.5;--highlight-color: rgba(var(--secondary-medium-rgb), var(--opacity));} .text-brun {--opacity: 1;color: rgba(var(--brun-rgb), var(--opacity));} .text-dark {--opacity: .98;color: rgba(var(--black-rgb), var(--opacity));} .text-secondary {--opacity: 1;color: rgba(var(--secondary-medium-rgb), var(--opacity));} /* ─────────────── Dégradés de texte Acronet : bleu, orange, violet ─────────────── */ .text-gradient-primary {background: linear-gradient(91.25deg, var(--primary-fluo) 4.64%, var(--primary-medium-light) 89.82%);-webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent;color: transparent;} .text-gradient-secondary {background: linear-gradient(91.25deg, var(--quinary-medium) 4.64%, var(--secondary-medium) 89.82%);-webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent;color: transparent;} .text-gradient-tertiary {background: linear-gradient(91.25deg, var(--tertiary-fluo) 4.64%, var(--tertiary-medium) 89.82%);-webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent;color: transparent;} .text-gradient-quaternary {background: linear-gradient(91.25deg, var(--quaternary-fluo) 4.64%, var(--quaternary-moyen) 89.82%);-webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent;color: transparent;} .bg-none {background-color: transparent !important;} .bg-white {--opacity: 1;background-color: rgba(var(--white-rgb), var(--opacity));} .bg-black {--opacity: 1;background-color: rgba(var(--black-rgb), var(--opacity));} .bg-dark {--opacity: .98;background-color: rgba(var(--black-rgb), var(--opacity));} .bg-gray-lightest {--opacity: 1;background-color: rgba(var(--gray-lightest-rgb), var(--opacity));} .bg-yellow-lightest {--opacity: 1;background-color: rgba(var(--yellow-lightest-rgb), var(--opacity));} .bg-primary-lightest {--opacity: 1;background-color: rgba(var(--primary-lightest-rgb), var(--opacity));} .bg-primary-lighter {--opacity: 1;background-color: rgba(var(--primary-lighter-rgb), var(--opacity));} .bg-primary-light {--opacity: 1;background-color: rgba(var(--primary-light-rgb), var(--opacity));} .bg-primary-medium {--opacity: 1;background-color: rgba(var(--primary-medium-rgb), var(--opacity));} .bg-primary-dark {--opacity: 1;background-color: rgba(var(--primary-dark-rgb), var(--opacity));} .bg-primary-darkest {--opacity: 1;background-color: rgba(var(--primary-darkest-rgb), var(--opacity));} .bg-primary-leger {background-color: var(--primary-leger);} .bg-primary-leger-rgb {--opacity: 1;background-color: rgba(var(--primary-leger-rgb), var(--opacity));} .bg-primary-moyen {background-color: var(--primary-moyen);} .bg-primary-moyen-rgb {--opacity: 1;background-color: rgba(var(--primary-moyen-rgb), var(--opacity));} .bg-secondary-rgb {--opacity: 1;background-color: rgba(var(--secondary-medium-rgb), var(--opacity));} .bg-success {--opacity: 1;background-color: rgba(var(--success-rgb), var(--opacity));} .bg-info {--opacity: 1;background-color: rgba(var(--info-rgb), var(--opacity));} .bg-warning {--opacity: 1;background-color: rgba(var(--warning-rgb), var(--opacity));} .bg-danger {--opacity: 1;background-color: rgba(var(--danger-rgb), var(--opacity));} hr {margin: 0 0;color: rgba(var(--black-rgb), .15);border: 0;border-top: 1px solid;} .icon-title {display: flex;align-items: center;justify-content: center;gap: 0.5rem;flex-wrap: nowrap;text-align: center;} .icon-title svg {flex-shrink: 0;width: 2.5rem;height: 2.5rem;} @media (max-width: 576px) {.icon-title {flex-wrap: wrap;}} ul.list-unstyled {list-style: none;padding-left: 0;} ul.list-unstyled li{padding-bottom: 0.5rem;} ul.list-unstyled li:last-child {padding-bottom: 0;} ul.infos-list{width: 100%;padding: 0;list-style: none;} ul.infos-list li {font-size: 1rem;font-style: normal;line-height: 1.2;margin-bottom: 0.4rem;} ul.infos-list li img {display: flex;align-self: stretch;width: 1.3rem;height: 1.3rem;margin-right: 0.5rem;} ul.infos-list li a, ul.infos-list li span {display: flex;align-items: center;} ul.infos-list li a:after {background-color: transparent;transform: none;} /* Grid Layout */ .grid-container {display: grid;grid-template-columns: repeat(12, 1fr);gap: 1rem;} .grid-col-1 {grid-column: span 1;} .grid-col-2 {grid-column: span 2;} .grid-col-3 {grid-column: span 3;} .grid-col-4 {grid-column: span 4;} .grid-col-5 {grid-column: span 5;} .grid-col-6 {grid-column: span 6;} .grid-col-7 {grid-column: span 7;} .grid-col-8 {grid-column: span 8;} .grid-col-9 {grid-column: span 9;} .grid-col-10 {grid-column: span 10;} .grid-col-11 {grid-column: span 11;} .grid-col-12 {grid-column: span 12;} .block {display:block;} .hidden {display:none;} .text-center {text-align: center;} .text-left,.text-start {text-align: left;} .text-right,.text-end {text-align: right;} .text-justify {text-align: justify;} .text-decoration-none {text-decoration: none;} .text-decoration-underline {text-decoration: underline;} .text-decoration-line-through {text-decoration: line-through;} .text-lowercase {text-transform: lowercase;} .text-uppercase {text-transform: uppercase;} .text-capitalize {text-transform: capitalize;} .text-wrap {white-space: normal;} .text-nowrap {white-space: nowrap;} .text-break {word-wrap: break-word;word-break: break-word;} .text-404 {font-size: 11.2rem;font-weight: 900;margin-top: -2rem;color: rgba(var(--black-rgb), .9);text-shadow: 4px 4px 0 var(--white),-4px 0 0 var(--white),7px 4px 0 rgba(var(--black-rgb), .9);} .infos-404 {max-width:650px;margin-left:auto;margin-right:auto;text-align: left;} .w-100 {width: 100%;} .w-100v {width: 100vh;} .w-80 {width: 80%;} .w-70 {width: 70%;} .w-60 {width: 60%;} .w-50 {width: 50%;} .w-25 {width: 25%;} .w-15 {width: 15%;} .h-100 {height: 100%;} .h-100v {height: 100vh;} .d-block {display: block;} .d-flex {display: flex;} .d-flex-wrap {display: flex;flex-wrap: wrap;} .d-flex-stretch {display: flex; align-items: stretch;} .d-flex-cs {display: flex;align-items: center;justify-content: start;} .d-flex-cc {display: flex;align-items: center;justify-content: center;} .d-flex-ce {display: flex;align-items: center;justify-content: end;} .flex-column {flex-direction: column;} .flex-row {flex-direction: row;} .flex-shrink-0 {flex-shrink: 0;} .row-cols-1 > * {flex: 0 0 auto;width: 100%;} .row-cols-2 > * {flex: 0 0 auto;width: 50%;} .order-first {order: -1;} .order-0 {order: 0;} .order-1 {order: 1;} .order-2 {order: 2;} .order-3 {order: 3;} .order-4 {order: 4 ;} .order-5 {order: 5;} .order-last {order: 6;} .justify-content-start {justify-content: flex-start;} .justify-content-end {justify-content: flex-end;} .justify-content-center {justify-content: center;} .justify-content-between {justify-content: space-between;} .align-items-start {align-items: flex-start;} .align-items-end {align-items: flex-end;} .align-items-center {align-items: center;} .align-items-baseline {align-items: baseline;} .align-items-stretch {align-items: stretch;} .position-static {position: static;} .position-relative {position: relative;} .position-absolute {position: absolute;} .position-fixed {position: fixed;} .position-sticky {position: sticky;top: 1rem;} .z-index-n1 {z-index: -1;} .z-index-0 {z-index: 0;} .z-index-1 {z-index: 1;} .z-index-2 {z-index: 2;} .gap-0 {gap: 0;} .gap-1 {gap: .25rem;} .gap-2 {gap: .5rem;} .gap-3 {gap: 1rem;} .gap-4 {gap: 1.5rem;} .gap-5 {gap: 3rem;} .p-0 {padding: 0 !important;} .p-1 {padding: 1rem !important;} .p-2 {padding: 2rem !important;} .p-3 {padding: 3rem !important;} .p-5 {padding: 5rem !important;} .pt-0 {padding-top: 0 !important;} .pt-1 {padding-top: 1rem !important;} .pt-2 {padding-top: 2rem !important;} .pt-3 {padding-top: 3rem !important;} .pb-0 {padding-bottom: 0 !important;} .pb-1 {padding-bottom: 1rem !important;} .pb-2 {padding-bottom: 2rem !important;} .pb-3 {padding-bottom: 3rem !important;} .ps-05 {padding-left: 0.5rem !important;} .ps-1 {padding-left: 1rem !important;} .ps-2 {padding-left: 1.5rem !important;} .pe-1 {padding-right: 1rem !important;} .pe-2 {padding-right: 1.5rem !important;} .px-1 {padding-left: 1rem;padding-right: 1rem;} .px-2 {padding-left: 1.5rem;padding-right: 1.5rem;} .py-05 {padding-top: 0.5rem;padding-bottom: 0.5rem;} .py-1 {padding-top: 1rem;padding-bottom: 1rem;} .py-3 {padding-top: 3rem;padding-bottom: 3rem;} .m-0 {margin: 0 !important;} .mt-0 {margin-top: 0 !important;} .mt-1 {margin-top: 1rem !important;} .mt-2 {margin-top: 2rem !important;} .mt-3 {margin-top: 3rem !important;} .mb-1 {margin-bottom: 1rem !important;} .mb-2 {margin-bottom: 2rem !important;} .mb-3 {margin-bottom: 3rem !important;} .ms-1 {margin-left: 1rem !important} .ms-3 {margin-left: 3rem !important} .me-1 {margin-right: 1rem !important} .me-3 {margin-right: 3rem !important} .mb-0 {margin-bottom: 0 !important;} .mx-1 {margin-left: 1rem;margin-right: 1rem;} .mx-2 {margin-left: 1.5rem;margin-right: 1.5rem;} .my-3 {margin-top: 3rem;margin-bottom: 3rem;} .ms-auto {margin-left: auto !important;} .me-auto {margin-right: auto !important;} .mx-auto {margin-right: auto !important;margin-left: auto !important;} h6,.h6,h5,.h5,h4,.h4,h3,.h3,h2,.h2,h1,.h1 {font-family: 'Poppins', Arial, sans-serif;font-size: inherit;font-weight: 600;margin-top: 0;margin-bottom: 1rem;letter-spacing: -.05em;} /* Tailles de base */ .h1 {font-size: var(--h1);} .h2 {font-size: var(--h2);} .h3 {font-size: var(--h3);} .h4 {font-size: var(--h4);} .h5 {font-size: var(--h5);} .h6 {font-size: var(--h6);} .fs-1 {font-size: calc(1.375rem + 1.5vw) !important;} .fs-2 {font-size: calc(1.325rem + 0.9vw) !important;} .fs-3 {font-size: calc(1.3rem + 0.6vw) !important;} .fs-4 {font-size: calc(1.275rem + 0.3vw) !important;} .fs-5 {font-size: 1.25rem !important;} .fs-6 {font-size: 1rem !important;} .fs-xl {font-size: 1.25rem !important;} .fs-xxl {font-size: 1.6rem !important;} .fs-lg {font-size: 1.125rem !important;} .fs-title {font-size: 1.5rem !important;} .fs-base {font-size: 1rem !important;} .fs-sm {font-size: 0.875rem !important;} .fs-xs {font-size: 0.75rem !important;} .fs-middle {font-size: var(--fs-middle);} .fs-max {font-size: var(--fs-max);} .fw-normal {font-weight: normal !important;} .fw-semibold {font-weight: 500 !important;} .fw-bold {font-weight: 600 !important;} .lh-sm {line-height: 1;} .lh-base {line-height: 1.25;} .lh-lg {line-height: 1.5;} .lh-xl {line-height: 1.75;} /* Tailles spécifiques pour les petits écrans */ @media (max-width: 1200px) { .h1 {font-size: calc(var(--h1) / 1.55);} .h2 {font-size: calc(var(--h2) / 1.55);} .h3 {font-size: calc(var(--h3) / 1.2);} .h4 {font-size: calc(var(--h4) / 1.2);} .h5 {font-size: calc(var(--h5) / 1.2);} .h6 {font-size: calc(var(--h6) / 1.2);} .fs-middle {font-size: calc(var(--fs-middle) / 2);} .fs-max {font-size: calc(var(--fs-max) / 1.2);} } @media (max-width: 600px) { .fs-max {font-size: calc(var(--fs-max) / 2);} } .opacity-0 {--opacity: 0 !important;} .opacity-05 {--opacity: 0.05 !important;} .opacity-10 {--opacity: 0.1 !important;} .opacity-25 {--opacity: 0.25 !important;} .opacity-50 {--opacity: 0.5 !important;} .opacity-75 {--opacity: 0.75 !important;} .opacity-80 {--opacity: 0.80 !important;} .opacity-90 {--opacity: 0.90 !important;} .opacity-95 {--opacity: 0.95 !important;} .opacity-98 {--opacity: 0.98 !important;} .opacity-100 {--opacity: 1 !important;} .background-image,[data-bg-src] {background-repeat:no-repeat;background-size:cover;background-position:center center} [data-overlay] {position: relative;overflow: hidden;border-radius: inherit;} [data-overlay]::before {content: "";right: 0;bottom: 0;z-index: 1;border-radius: inherit;} .overlay, [data-overlay]::before {left: 0;top: 0;position: absolute;} [data-overlay=black]:before {background-color:var(--black);} [data-overlay=white]:before {background-color:var(--white);} [data-overlay=primary]:before {background-color:var(--primary-darkest);} [data-overlay=secondary]:before {background-color:var(--secondary-medium);} [data-overlay=tertiary]:before {background-color:var(--tertiary-medium);} [data-overlay=quaternary]:before {background-color:var(--quaternary-medium);} [data-overlay=quinary]:before {background-color:var(--quinary-medium);} [data-opacity="0"]:before {opacity: 0} [data-opacity="1"]:before {opacity:.1} [data-opacity="2"]:before {opacity:.2} [data-opacity="3"]:before {opacity:.3} [data-opacity="4"]:before {opacity:.4} [data-opacity="5"]:before {opacity:.5} [data-opacity="6"]:before {opacity:.6} [data-opacity="7"]:before {opacity:.7} [data-opacity="8"]:before {opacity:.8} [data-opacity="9"]:before {opacity:.9} nav.breadcrumb {width: 100%;margin: 0 auto;overflow-wrap: break-word;background-color: var(--white);} nav.breadcrumb .breadcrumb-content {width: calc(100% - 3rem);max-width: 80em;margin: 0 auto;padding: 4rem 0;} nav.breadcrumb .breadcrumb-content.small {padding: 3rem 0;} nav.breadcrumb .title {position: relative;z-index: 1;color: var(--white);} nav.breadcrumb .links {display: block;position: relative;z-index: 1;margin: 0;padding: 0;font-weight:500;} nav.breadcrumb .links li {display:inline-block;list-style:none;margin-right: 0.4rem;padding-right: 0.4rem;} nav.breadcrumb .links li:after {content: "/";margin-left: 0.8rem;} nav.breadcrumb .links li:last-child {padding: 0;margin: 0;} nav.breadcrumb .links li:last-child::after{display: none;} nav.breadcrumb .links a, nav.breadcrumb .links li, nav.breadcrumb .links span {white-space: normal;word-break: break-word;color: var(--white);transition: .4s;} nav.breadcrumb > * a {text-decoration: none;} nav.breadcrumb > * a :hover{color: var(--primary-medium);} @media (max-width: 767px) { nav.breadcrumb .breadcrumb-content {padding: 4rem 0;} nav.breadcrumb .title {font-size: var(--h5);} nav.breadcrumb .links {display: block;font-size: 0.8rem;} nav.breadcrumb .links li {margin-right: 0.2rem;padding-right: 0;} nav.breadcrumb .links li:after {content: "/";margin-left: 0.2rem;} } .breadcrumb-simple {background: rgba(var(--primary-light-rgb),0.1);border-bottom: 1px solid rgba(var(--primary-light-rgb),.25);padding:.5rem 0;font-size:.9rem;line-height: 0;} .breadcrumb-simple.dark {background: rgba(var(--primary-darkest-rgb),0.99);border-bottom: 1px solid rgba(var(--primary-light-rgb),.15);} .breadcrumb-simple.dark a{color: rgba(var(--primary-light-rgb),0.5);} .breadcrumb-simple.dark li{color: rgba(var(--primary-light-rgb),0.5);} .breadcrumb-simple.dark li+li::before{color: rgba(var(--primary-light-rgb),0.2);} .breadcrumb-simple.dark .breadcrumb-home-icon svg{stroke:rgba(var(--primary-light-rgb),0.2);} .breadcrumb-simple .breadcrumb-inner{display:flex;align-items:center;justify-content:flex-start;max-width: 80rem; margin: 0 auto;} .breadcrumb-simple .breadcrumb-list{display:flex;align-items:center;flex-wrap:nowrap;gap:.35rem;margin:0;padding:0;list-style:none;font-size:.85rem;white-space:nowrap;overflow-x:auto;-ms-overflow-style:none;scrollbar-width:none;} .breadcrumb-simple .breadcrumb-list::-webkit-scrollbar{display:none;} .breadcrumb-simple li{display:inline-flex;align-items:center;color:rgba(var(--primary-darkest-rgb),1);} .breadcrumb-simple li+li::before{content:">";margin:0 .25rem;color:rgba(var(--primary-darkest-rgb),.6);} .breadcrumb-simple a{display:inline-flex;align-items:center;gap:.35rem;color:rgba(var(--primary-darkest-rgb),1);text-decoration:none;} .breadcrumb-simple a:hover{text-decoration:underline;} .breadcrumb-simple .breadcrumb-home-icon{display:inline-flex;align-items:center;width: 1.1rem;height: 1.1rem;} .breadcrumb-simple .breadcrumb-home-icon svg{display:block;width:100%;height:100%;stroke:rgba(var(--primary-darkest-rgb),1);transform:translateY(-0.05em) translateX(0.1em);} .breadcrumb-simple .breadcrumb-label{display:inline-block;} .breadcrumb-simple li.active .breadcrumb-label{color:rgba(var(--primary-darkest),1);font-weight:500;} .rounded {border-radius: 0.5rem !important;} .rounded-1 {border-radius: 1rem !important;} .rounded-top-0 {border-top-left-radius: 0 !important;border-top-right-radius: 0 !important;} .rounded-bottom-0 {border-bottom-left-radius: 0 !important;border-bottom-right-radius: 0 !important;} .rounded-start-0 {border-top-left-radius: 0 !important;border-bottom-left-radius: 0 !important;} .rounded-end-0 {border-top-right-radius: 0 !important;border-bottom-right-radius: 0 !important;} .rounded-circle {border-radius: 50% !important;} /* Mobile */ @media (max-width: 768px) { .sm\:grid-col-1 {grid-column: span 1;} .sm\:grid-col-2 {grid-column: span 2;} .sm\:grid-col-3 {grid-column: span 3;} .sm\:grid-col-4 {grid-column: span 4;} .sm\:grid-col-5 {grid-column: span 5;} .sm\:grid-col-6 {grid-column: span 6;} .sm\:grid-col-7 {grid-column: span 7;} .sm\:grid-col-8 {grid-column: span 8;} .sm\:grid-col-9 {grid-column: span 9;} .sm\:grid-col-10 {grid-column: span 10;} .sm\:grid-col-11 {grid-column: span 11;} .sm\:grid-col-12 {grid-column: span 12;} .sm\:block {display:block;} .sm\:hidden {display:none;} .sm\:text-center{text-align: center;} .sm\:text-left{text-align: left;} .sm\:text-right{text-align: right;} .gap-sm-0 {gap: 0 !important;} .gap-sm-1 {gap: .25rem !important;} .gap-sm-2 {gap: .5rem !important;} .gap-sm-3 {gap: 1rem !important;} .gap-sm-4 {gap: 1.5rem !important;} .gap-sm-5 {gap: 3 !important;} .h-sm-unset {height: unset !important;} .w-sm-unset {width: unset !important;} .p-sm-0 {padding: 0 !important;} .p-sm-3 {padding: 3rem !important;} .p-sm-5 {padding: 5rem !important;} .pt-sm-0 {padding-top: 0 !important;} .pt-sm-1 {padding-top: 1rem !important;} .pt-sm-2 {padding-top: 2rem !important;} .pt-sm-3 {padding-top: 3rem !important;} .pb-sm-1 {padding-bottom: 1rem !important;} .pb-sm-2 {padding-bottom: 2rem !important;} .pb-sm-3 {padding-bottom: 3rem !important;} .ps-sm-1 {padding-left: 1rem !important;} .ps-sm-2 {padding-left: 1.5rem !important;} .pe-sm-1 {padding-right: 1rem !important;} .pe-sm-2 {padding-right: 1.5rem !important;} .px-sm-1 {padding-left: 1rem !important;padding-right: 1rem !important;} .py-sm-1 {padding-top: 1rem !important;padding-bottom: 1rem !important;} .m-sm-0 {margin: 0 !important;} .mt-sm-0 {margin-top: 0 !important;} .mt-sm-3 {margin-top: 3rem !important;} .ms-sm-3 {margin-left: 3rem !important} .me-sm-3 {margin-right: 3rem !important} .mb-sm-0 {margin-bottom: 0 !important;} .mx-sm-0 {margin-right: 0 !important;margin-left: 0 !important;} .row-cols-sm-1 > * {flex: 0 0 auto;width: 100%} .row-cols-sm-2 > * {flex: 0 0 auto;width: 50%} .order-sm-first {order: -1 !important} .order-sm-0 {order: 0 !important} .order-sm-1 {order: 1 !important} .order-sm-2 {order: 2 !important} .order-sm-3 {order: 3 !important} .order-sm-4 {order: 4 !important} .order-sm-5 {order: 5 !important} .order-sm-last {order: 6 !important} .justify-content-sm-start {justify-content: flex-start !important;} .justify-content-sm-end {justify-content: flex-end !important;} .justify-content-sm-center {justify-content: center !important;} .justify-content-sm-between {justify-content: space-between !important;} .align-items-sm-start {align-items: flex-start !important;} .align-items-sm-end {align-items: flex-end !important;} .align-items-sm-center {align-items: center !important;} .align-items-sm-baseline {align-items: baseline !important;} .align-items-sm-stretch {align-items: stretch !important;} } /* Tablet */ @media (min-width: 768px) and (max-width: 1024px) { .md\:grid-col-1 {grid-column: span 1;} .md\:grid-col-2 {grid-column: span 2;} .md\:grid-col-3 {grid-column: span 3;} .md\:grid-col-4 {grid-column: span 4;} .md\:grid-col-5 {grid-column: span 5;} .md\:grid-col-6 {grid-column: span 6;} .md\:grid-col-7 {grid-column: span 7;} .md\:grid-col-8 {grid-column: span 8;} .md\:grid-col-9 {grid-column: span 9;} .md\:grid-col-10 {grid-column: span 10;} .md\:grid-col-11 {grid-column: span 11;} .md\:grid-col-12 {grid-column: span 12;} .md\:block {display:block;} .md\:hidden {display:none;} .md\:text-center{text-align: center;} .md\:text-left{text-align: left;} .md\:text-right{text-align: right;} .gap-md-0 {gap: 0 !important;} .h-md-unset {height: unset !important;} .w-md-unset {width: unset !important;} .w-md-50 {width: 50%;} .w-md-60 {width: 60%;} .p-md-0 {padding: 0 !important;} .p-md-3 {padding: 3rem !important;} .p-md-5 {padding: 5rem !important;} .pt-md-0 {padding-top: 0 !important;} .pt-md-1 {padding-top: 1rem !important;} .pt-md-2 {padding-top: 2rem !important;} .pt-md-3 {padding-top: 3rem !important;} .pb-md-1 {padding-bottom: 1rem !important;} .pb-md-2 {padding-bottom: 2rem !important;} .pb-md-3 {padding-bottom: 3rem !important;} .ps-md-1 {padding-left: 1rem !important;} .ps-md-2 {padding-left: 1.5rem !important;} .pe-md-1 {padding-right: 1rem !important;} .pe-md-2 {padding-right: 1.5rem !important;} .px-md-1 {padding-left: 1rem !important;padding-right: 1rem !important;} .py-md-1 {padding-top: 1rem !important;padding-bottom: 1rem !important;} .m-md-0 {margin: 0 !important;} .mt-md-0 {margin-top: 0 !important;} .mt-md-3 {margin-top: 3rem !important;} .ms-md-2 {margin-left: 1.5rem !important;} .ms-md-3 {margin-left: 3rem !important} .me-md-3 {margin-right: 3rem !important} .mb-md-0 {margin-bottom: 0 !important;} .ms-md-auto {margin-left: auto !important;} .me-md-auto {margin-right: auto !important;} .mx-md-0 {margin-right: 0 !important;margin-left: 0 !important;} .text-md-center {text-align: center !important;} .text-md-left,.text-md-start {text-align: left !important;} .text-md-right,.text-md-end {text-align: right !important;} .text-md-justify {text-align: justify !important;} .flex-md-row {flex-direction: row !important;} .flex-md-column {flex-direction: column !important;} .row-cols-md-1 > * {flex: 0 0 auto;width: 100%} .row-cols-md-2 > * {flex: 0 0 auto;width: 50%} .order-md-first {order: -1 !important} .order-md-0 {order: 0 !important} .order-md-1 {order: 1 !important} .order-md-2 {order: 2 !important} .order-md-3 {order: 3 !important} .order-md-4 {order: 4 !important} .order-md-5 {order: 5 !important} .order-md-last {order: 6 !important} .justify-content-md-start {justify-content: flex-start !important;} .justify-content-md-end {justify-content: flex-end !important;} .justify-content-md-center {justify-content: center !important;} .justify-content-md-between {justify-content: space-between !important;} .align-items-md-start {align-items: flex-start !important;} .align-items-md-end {align-items: flex-end !important;} .align-items-md-center {align-items: center !important;} .align-items-md-baseline {align-items: baseline !important;} .align-items-md-stretch {align-items: stretch !important;} } /* PC */ @media (min-width: 1024px) { .lg\:grid-col-1 {grid-column: span 1;} .lg\:grid-col-2 {grid-column: span 2;} .lg\:grid-col-3 {grid-column: span 3;} .lg\:grid-col-4 {grid-column: span 4;} .lg\:grid-col-5 {grid-column: span 5;} .lg\:grid-col-6 {grid-column: span 6;} .lg\:grid-col-7 {grid-column: span 7;} .lg\:grid-col-8 {grid-column: span 8;} .lg\:grid-col-9 {grid-column: span 9;} .lg\:grid-col-10 {grid-column: span 10;} .lg\:grid-col-11 {grid-column: span 11;} .lg\:grid-col-12 {grid-column: span 12;} .lg\:block {display:block;} .lg\:hidden {display:none;} .lg\:text-center{text-align: center;} .lg\:text-left{text-align: left;} .lg\:text-right{text-align: right;} .gap-lg-0 {gap: 0 !important;} .h-lg-unset {height: unset !important;} .w-lg-unset {width: unset !important;} .w-lg-50 {width: 50%;} .w-lg-60 {width: 60%;} .p-lg-0 {padding: 0 !important;} .p-lg-3 {padding: 3rem !important;} .p-lg-5 {padding: 5rem !important;} .pt-lg-0 {padding-top: 0 !important;} .pt-lg-1 {padding-top: 1rem !important;} .pt-lg-2 {padding-top: 2rem !important;} .pt-lg-3 {padding-top: 3rem !important;} .pb-lg-1 {padding-bottom: 1rem !important;} .pb-lg-2 {padding-bottom: 2rem !important;} .pb-lg-3 {padding-bottom: 3rem !important;} .ps-lg-0 {padding-left: 0rem !important;} .ps-lg-1 {padding-left: 1rem !important;} .ps-lg-2 {padding-left: 1.5rem !important;} .pe-lg-0 {padding-right: 0rem !important;} .pe-lg-1 {padding-right: 1rem !important;} .pe-lg-2 {padding-right: 1.5rem !important;} .px-lg-1 {padding-left: 1rem !important;padding-right: 1rem !important;} .py-lg-1 {padding-top: 1rem !important;padding-bottom: 1rem !important;} .m-lg-0 {margin: 0 !important;} .mt-lg-0 {margin-top: 0 !important;} .mt-lg-3 {margin-top: 3rem !important;} .ms-lg-2 {margin-left: 1.5rem !important;} .ms-lg-3 {margin-left: 3rem !important} .me-lg-3 {margin-right: 3rem !important} .mb-lg-0 {margin-bottom: 0 !important;} .ms-lg-auto {margin-left: auto !important;} .me-lg-auto {margin-right: auto !important;} .mx-lg-0 {margin-right: 0 !important;margin-left: 0 !important;} .text-lg-center {text-align: center !important;} .text-lg-left,.text-lg-start {text-align: left !important;} .text-lg-right,.text-lg-end {text-align: right !important;} .text-lg-justify {text-align: justify !important;} .flex-lg-row {flex-direction: row !important;} .flex-lg-column {flex-direction: column !important;} .row-cols-lg-1 > * {flex: 0 0 auto;width: calc(100% - 1.5rem);} .row-cols-lg-2 > * {flex: 0 0 auto;width: calc(50% - 0.75rem);} .order-lg-first {order: -1 !important} .order-lg-0 {order: 0 !important} .order-lg-1 {order: 1 !important} .order-lg-2 {order: 2 !important} .order-lg-3 {order: 3 !important} .order-lg-4 {order: 4 !important} .order-lg-5 {order: 5 !important} .order-lg-last {order: 6 !important} .justify-content-lg-start {justify-content: flex-start !important;} .justify-content-lg-end {justify-content: flex-end !important;} .justify-content-lg-center {justify-content: center !important;} .justify-content-lg-between {justify-content: space-between !important;} .align-items-lg-start {align-items: flex-start !important;} .align-items-lg-end {align-items: flex-end !important;} .align-items-lg-center {align-items: center !important;} .align-items-lg-baseline {align-items: baseline !important;} .align-items-lg-stretch {align-items: stretch !important;} } /* Global Typo */ .t-arial {font-family: Arial, sans-serif;font-weight: normal;} .t-regular {font-family: var(--primary-font);font-weight: 400;} .t-italic {font-family: var(--primary-font);font-weight: 400;font-style: italic;} .t-medium {font-family: var(--primary-font);font-weight: 500;} .t-mediumitalic {font-family: var(--primary-font);font-weight: 500;font-style: italic;} .t-semibold {font-family: var(--primary-font);font-weight: 600;} .t-semibolditalic {font-family: var(--primary-font);font-weight: 600;font-style: italic;} .t-extrabold {font-family: var(--primary-font);font-weight: 800;} .t-extrabolditalic {font-family: var(--primary-font);font-weight: 800;font-style: italic;} .t-logotype {font-family: var(--primary-font);font-weight: bold;} /* Borders */ .border {border: 0.5rem solid var(--black);} .border-top {border-top: 0.5rem solid var(--black);} .border-bottom {border-bottom: 0.5rem solid var(--black);} .border-left {border-left: 0.5rem solid var(--black);} .border-right {border-right: 0.5rem solid var(--black);} .border-0 {border: 0 !important;} .border-top-0 {border-top: 0 !important;} .border-bottom-0 {border-bottom: 0 !important;} .border-left-0 {border-left: 0 !important;} .border-right-0 {border-right: 0 !important;} .border-primary-leger {border-color: var(--primary-leger);} .border-primary-leger-rgb {--opacity-border: 1;border-color: rgba(var(--primary-leger-rgb), var(--opacity-border));} .border-primary-moyen {border-color: var(--primary-moyen);} .border-primary-moyen-rgb {--opacity-border: 1;border-color: rgba(var(--primary-moyen-rgb), var(--opacity-border));} .border-primary-medium {--opacity-border: .55;border-color: rgba(var(--primary-medium-rgb), var(--opacity-border));} .border-primary-icones {border-color: #449368;} .border-gray-200 {--opacity-border: .05;border-color: rgba(var(--black-rgb), var(--opacity-border));} .border-gray-300 {--opacity-border: .10;border-color: rgba(var(--black-rgb), var(--opacity-border));} /* Séparateurs */ .sep-line {width: 15rem;height: 0.50rem;border-radius: 0.375rem;} .sep-left {margin-left: 0;margin-right: auto;} .sep-center {margin: auto;} .sep-right {margin-left: auto;margin-right: 0;} .sep-white {background-color: var(--white);} .sep-black {background-color: var(--black);} .sep-brun {background-color: var(--brun);} .sep-primary {background-color: var(--primary-medium);} .sep-secondary {background-color: var(--secondary-medium);} .sep-tertiary {background-color: var(--primary-darkest);} .shadow-lg {box-shadow: 0 .3rem 1.525rem -0.375rem rgba(var(--black-rgb), .1), 0 .25rem .8125rem -0.125rem rgba(var(--black-rgb), .06) !important;} /* Buttons */ .btn {display: inline-flex;align-items: center;justify-content: center;cursor: pointer;white-space: nowrap;user-select: none;font-size: var(--btn-font-size);font-weight: var(--btn-font-weight);padding: var(--btn-padding-y) var(--btn-padding-x);border: var(--btn-border-width) solid rgba(var(--btn-border-color), 1);border-radius: var(--btn-border-radius);background-color: rgba(var(--btn-background-color), 1);color: rgba(var(--btn-color), 1); box-shadow:0 .5rem 1.125rem -0.5rem rgba(var(--btn-shadow-color), .15);transition: color .2s ease-in-out, background-color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out;} .btn:hover {border: var(--btn-border-width) solid rgba(var(--btn-border-color-hover), 1);background-color: rgba(var(--btn-background-color-hover), 1);color: rgba(var(--btn-color-hover), 1);box-shadow: 0 .5rem 1.125rem -0.5rem rgba(var(--btn-shadow-color-hover), .5);} .btn:hover img.white-hover {filter: brightness(0) invert(1);transition: filter .2s ease-in-out;} .btn-filter-invert img {filter: invert(0) !important;transition: filter .2s ease-in-out;} .btn-filter-invert:hover img {filter: invert(1) !important;} .btn-filter-invert-full img, .btn-filter-invert-full:hover img {filter: invert(1) !important;} .btn img {margin: 0 0.5rem 0 0;} /* ======================================= */ /* BASE COMMUNE : BOUTON + MOTOR SLIDE */ /* ======================================= */ /* ======================================= */ /* BASE COMMUNE : BOUTON + MOTOR SLIDE */ /* ======================================= */ .btn-slide { position: relative; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; white-space: nowrap; user-select: none; font-size: var(--btn-font-size); font-weight: var(--btn-font-weight); padding: var(--btn-padding-y) var(--btn-padding-x); border-radius: var(--btn-border-radius); border: var(--btn-border-width) solid var(--btn-border, transparent); background-color: var(--btn-bg, transparent); color: var(--btn-color, inherit); box-shadow: 0 .5rem 1.125rem -0.5rem rgba(var(--btn-shadow-rgb,0,0,0), .7); overflow: hidden; z-index: 1; transition: color .25s ease-in-out, border-color .25s ease-in-out, box-shadow .25s ease-in-out, background-color .25s ease-in-out; } .btn-slide > * { position: relative; z-index: 2; } .btn-slide:hover { color: var(--btn-color-hover, var(--btn-color)); border-color: var(--btn-border-hover, var(--btn-border)); background-color: var(--btn-bg-hover, var(--btn-bg)); } /* LINEAR */ .btn-slide-linear::before { content: ""; position: absolute; inset: 0; background: var(--btn-bg-hover, transparent); transform-origin: left center; transform: scaleX(0); transition: transform .35s ease-out; z-index: 0; } .btn-slide-linear:hover::before { transform: scaleX(1.05); } /* CERCLE */ .btn-slide-circle::before { content: ""; position: absolute; top: 50%; left: 50%; width: 1px; height: 1px; border-radius: 999px; background: var(--btn-bg-hover, transparent); transform: translate(-50%, -50%) scale(0); transition: transform .35s ease-out; z-index: 0; } .btn-slide-circle:hover::before { transform: translate(-50%, -50%) scale(500); } .btn-primo { --btn-bg: rgba(var(--secondary-medium-rgb), 1); --btn-bg-hover: rgba(var(--primary-medium-rgb), 1); --btn-border: rgba(var(--secondary-medium-rgb), 1); --btn-border-hover: rgba(var(--secondary-medium-rgb), 1); --btn-color: rgba(var(--white-rgb), 1); --btn-color-hover: rgba(var(--primary-lightest-rgb), 1); --btn-shadow-rgb: var(--primary-darkest-rgb); --btn-border-width: 0; } .btn-primo:hover {box-shadow: 0 0 5px rgba(var(--primary-medium-rgb),0.05),-5px 0 20px rgba(var(--primary-medium-rgb),0.7),5px 0 20px rgba(var(--primary-medium-rgb),0.7);} .btn-light { --btn-border-color: var(--primary-light-rgb); --btn-border-color-hover: var(--primary-light-rgb); --btn-background-color: var(--primary-lighter-rgb); --btn-background-color-hover: var(--primary-light-rgb); --btn-color: var(--black-rgb); --btn-color-hover: var(--black-rgb); --btn-shadow-color: var(--primary-light-rgb); --btn-shadow-color-hover: var(--primary-lighter-rgb); } .btn-white { --btn-border-color: var(--dark-rgb); --btn-border-color-hover: var(--dark-rgb); --btn-background-color: var(--dark-rgb); --btn-background-color-hover: var(--dark-rgb); --btn-color: var(--black-rgb); --btn-color-hover: var(--dark-rgb); --btn-shadow-color: var(--dark-rgb); --btn-shadow-color-hover: var(--dark-rgb); border: var(--btn-border-width) solid rgba(var(--btn-border-color), .15); background-color: rgba(var(--btn-background-color-hover), 0.03); } .btn-white:hover { border: var(--btn-border-width) solid rgba(var(--btn-border-color), 0); background-color: rgba(var(--btn-background-color-hover), 0.15); } .btn-medium { --btn-border-color: var(--primary-medium-rgb); --btn-border-color-hover: var(--primary-dark-rgb); --btn-background-color: var(--primary-medium-rgb); --btn-background-color-hover: var(--primary-dark-rgb); --btn-color: var(--white-rgb); --btn-color-hover: var(--white-rgb); --btn-shadow-color: var(--primary-light-rgb); --btn-shadow-color-hover: var(--black-rgb); } .btn-darkest { --btn-border-color: var(--primary-dark-rgb); --btn-border-color-hover: var(--primary-darkest-rgb); --btn-background-color: var(--primary-dark-rgb); --btn-background-color-hover: var(--primary-darkest-rgb); --btn-color: var(--white-rgb); --btn-color-hover: var(--white-rgb); --btn-shadow-color: var(--primary-light-rgb); --btn-shadow-color-hover: var(--primary-darkest-rgb); } .btn-black { --btn-border-color: var(--black-rgb); --btn-border-color-hover: var(--black-rgb); --btn-background-color: var(--black-rgb); --btn-background-color-hover: var(--black-rgb); --btn-color: var(--white-rgb); --btn-color-hover: var(--white-rgb); --btn-shadow-color: var(--black-rgb); --btn-shadow-color-hover: var(--black-rgb); } .btn-black:hover {border: var(--btn-border-width) solid rgba(var(--btn-border-color), .15);background-color: rgba(var(--btn-background-color-hover), 0.92);} .btn-secondary { --btn-border-color: var(--secondary-medium-rgb); --btn-border-color-hover: var(--secondary-medium-rgb); --btn-background-color: var(--secondary-medium-rgb); --btn-background-color-hover: var(--secondary-medium-rgb); --btn-color: var(--white-rgb); --btn-color-hover: var(--primary-lightest-rgb); --btn-shadow-color: var(--primary-darkest-rgb); --btn-shadow-color-hover: var(--primary-darkest-rgb); } .btn-secondary:hover {box-shadow:0 0 5px rgba(var(--secondary-medium-rgb),0.05),-5px 0 20px rgba(var(--secondary-medium-rgb),0.7),5px 0 20px rgba(var(--secondary-medium-rgb),0.7);} .btn-secondary-light { --btn-border-color: var(--secondary-medium-rgb); --btn-border-color-hover: var(--secondary-medium-rgb); --btn-background-color: var(--secondary-lighter-rgb); --btn-background-color-hover: var(--secondary-light-rgb); --btn-color: var(--primary-darkest-rgb); --btn-color-hover: var(--primary-darkest-rgb); --btn-shadow-color: var(--black-rgb); --btn-shadow-color-hover: var(--black-rgb); } .btn-secondary-light:hover {box-shadow:0 0 5px rgba(var(--secondary-light-rgb),0.05),-5px 0 20px rgba(var(--secondary-light-rgb),0.7),5px 0 20px rgba(var(--secondary-medium-rgb),0.7);} .btn-outline-secondary-medium { --btn-border-color: var(--secondary-medium-rgb);; --btn-border-color-hover: var(--secondary-medium-rgb); --btn-background-color: transparent; --btn-background-color-hover: var(--secondary-medium-rgb); --btn-color: var(--secondary-medium-rgb); --btn-color-hover: var(--white-rgb); --btn-shadow-color: var(--secondary-light-rgb); --btn-shadow-color-hover: var(--black-rgb); } .btn-outline-medium { --btn-border-color: var(--primary-medium-rgb);; --btn-border-color-hover: var(--primary-medium-rgb); --btn-background-color: transparent; --btn-background-color-hover: var(--primary-medium-rgb); --btn-color: var(--primary-medium-rgb); --btn-color-hover: var(--white-rgb); --btn-shadow-color: var(--primary-light-rgb); --btn-shadow-color-hover: var(--black-rgb); } .btn-outline-darkest { --btn-border-color: var(--primary-dark-rgb);; --btn-border-color-hover: var(--primary-dark-rgb); --btn-background-color: transparent; --btn-background-color-hover: var(--primary-dark-rgb); --btn-color: var(--primary-dark-rgb); --btn-color-hover: var(--white-rgb); --btn-shadow-color: var(--primary-light-rgb); --btn-shadow-color-hover: var(--primary-darkest-rgb); } .btn-outline-black { --btn-border-color: var(--black-rgb); --btn-border-color-hover: var(--black-rgb); --btn-background-color: transparent; --btn-background-color-hover: var(--black-rgb); --btn-color: var(--black-rgb); --btn-color-hover: var(--white-rgb); --btn-shadow-color: var(--black-rgb); --btn-shadow-color-hover: var(--black-rgb); } .btn-outline-white { --btn-border-color: var(--white-rgb); --btn-border-color-hover: var(--white-rgb); --btn-background-color: transparent; --btn-background-color-hover: transparent; --btn-color: var(--white-rgb); --btn-color-hover: var(--white-rgb); --btn-shadow-color: var(--white-rgb); --btn-shadow-color-hover: var(--white-rgb); } /* Images */ .img-box {position: relative;} .img-box .content{position: absolute;bottom: 0;left: 0;padding: 3rem;border-radius: 0 3rem 0 0;} .img-container {display: flex;align-items: center;justify-content: center;height: 200px;width: 100%;overflow: hidden;background-color: rgba(var(--black-rgb),.05)} .img-container img {max-width: 100%;max-height: 100%;object-fit: contain;} /* Aligner les icônes avec du texte */ .icon-text {display: flex;align-items: center;} .icon-text img {margin-right: 0.5rem;width: 20px;height: 20px;} /* Liste à puces */ .content-info-list {display: flex;flex-direction: column;list-style-type: none;margin: 0.5rem 0 0.5rem 0.5rem;padding: 0;} .content-info-list li {position: relative;display: flex;align-items: start;font-size: 1rem;line-height: 1.5;padding-left: 0.5rem;margin-bottom: 0.5rem;} .content-info-list li:last-child {margin: 0;} .content-info-list li .check-icon { flex-shrink: 0; width: 1.5rem; height: 1.5rem; margin-right: 0.8rem; box-shadow: 0 0 0.45rem 0 rgba(0, 0, 0, 0); border-radius: 50%; border: 0.15em solid rgba(var(--secondary-medium-rgb),1); background-color: rgba(var(--white-rgb), 0); padding: 0; background-image: url('data:image/svg+xml,%3Csvg%20viewBox=%220%200%2020%2020%22%20fill=%22none%22%20xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath%20stroke=%22%23d90431%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%20stroke-width=%222%22%20d=%22M17%205L8%2015l-5-4%22/%3E%3C/svg%3E'); background-size: 1.1rem; background-repeat: no-repeat; background-position: center; transform: translate(0, 0rem); } .content-info-list li .text {flex: 1;} .content-info-list li span {font-weight: 600;} ul.content-list {margin:0px;} /* ul.content-list li {display:flex;align-items:center;gap:0.5rem;font-size:1.2rem;line-height:1.6;list-style:none;padding-bottom:10px;} */ ul.content-list li {display: flex;align-items: flex-start;justify-content: flex-start;gap: 0.5rem;font-size: 1.2rem;line-height: 1.3;text-align: start;width: 100%;list-style: none;margin-bottom: 0.5rem;} ul.content-list li:last-child {margin-bottom: 0;} ul.content-list li svg {display:block;flex:0 0 1.6rem;overflow:visible;width:1.6rem;height:1.6rem;} @media (max-width: 768px) { ul.content-list li {font-size:1rem;line-height:1.3;} } /* .tik-list {display: grid;grid-template-columns: repeat(2, 1fr);grid-gap: 1rem;list-style: none;padding: 0;} .tik-list li {display: flex;align-items: center;font-weight: 500;} .tik-list li::before { display: inline-block; content: ""; width: 1.5rem; height: 1.5rem; background-image: url('data:image/svg+xml,%3Csvg%20viewBox=%220%200%2020%2020%22%20fill=%22none%22%20xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath%20stroke=%22%23000%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%20stroke-width=%222%22%20d=%22M17%205L8%2015l-5-4%22/%3E%3C/svg%3E'); background-size: contain; background-repeat: no-repeat; margin-right: 0.5rem; filter:invert(1); } @media (max-width: 380px) {.tik-list {grid-template-columns: repeat(1, 1fr);grid-gap: 1rem;}} */ .tik-list {list-style:none;width:100%;margin:.5rem 0 .75rem 0;padding:0;} .tik-list li{position:relative;display:block;font-size:1rem;line-height:1.4;margin-bottom:.4rem;padding-left:1.6rem;} .tik-list li::before{content: "";position: absolute;left: .0em;top: -.1em;width: 1.5rem;height: 1.5rem; background-image: url('data:image/svg+xml,%3Csvg%20viewBox=%220%200%2020%2020%22%20fill=%22none%22%20xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath%20stroke=%22%23000%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%20stroke-width=%222%22%20d=%22M17%205L8%2015l-5-4%22/%3E%3C/svg%3E'); background-size: contain; background-repeat: no-repeat; margin-right: 0.5rem; filter:invert(1); } .tik-list-simple {display: grid;grid-template-columns: repeat(2, 1fr);grid-gap: 1rem;list-style: none;padding: 0;} .tik-list-simple .icones{min-width: 40px;} .tik-list-simple li {display: flex;align-items: center;font-weight: 500;} .tik-list-simple li::before {display: inline-block;content: "";} .tik-list-simple li > * img {padding: .5rem;} @media (max-width: 768px) {.tik-list-simple {grid-template-columns: repeat(1, 1fr);grid-gap: 1rem;}} /* blockquote */ blockquote {font-style: italic;font-size: 1.2rem;line-height: 1.5;margin: 0 0 1rem;padding: 1.2rem 1.1rem;} .blockquote-black {--opacity: .75;border-left: 0.5rem solid rgba(var(--black-rgb), var(--opacity));background: rgba(var(--white-rgb), var(--opacity));} .blockquote-medium {--opacity: .75;border-left: 0.5rem solid rgba(var(--primary-medium-rgb), var(--opacity));background: rgba(var(--white-rgb), var(--opacity));} .blockquote-medium.primary{border-left: 0.5rem solid rgba(var(--primary-medium-rgb), var(--opacity));background: rgba(var(--white-rgb), var(--opacity));} .blockquote-medium.secondary{border-left: 0.5rem solid rgba(var(--secondary-medium-rgb), var(--opacity));background: rgba(var(--white-rgb), var(--opacity));} .blockquote-citation {display: block;position: relative;z-index: 1;overflow: hidden;padding: 50px 60px;margin: 35px 0;line-height: 30px;} .blockquote-citation::before { position: absolute; z-index: -1; content: ""; right: 40px; bottom: 30px; width: 11.5rem; height: 11.5rem; background-image: url('data:image/svg+xml,%3Csvg%20fill=%22%23fff%22%20viewBox=%220%200%2024%2024%22%20xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath%20d=%22M3.691%206.292C5.094%204.771%207.217%204%2010%204h1v2.819l-.804.161c-1.37.274-2.323.813-2.833%201.604A2.902%202.902%200%200%200%206.925%2010H10a1%201%200%200%201%201%201v7c0%201.103-.897%202-2%202H3a1%201%200%200%201-1-1v-5l.003-2.919c-.009-.111-.199-2.741%201.688-4.789zM20%2020h-6a1%201%200%200%201-1-1v-5l.003-2.919c-.009-.111-.199-2.741%201.688-4.789C16.094%204.771%2018.217%204%2021%204h1v2.819l-.804.161c-1.37.274-2.323.813-2.833%201.604A2.902%202.902%200%200%200%2017.925%2010H21a1%201%200%200%201%201%201v7c0%201.103-.897%202-2%202z%22/%3E%3C/svg%3E'); background-size: contain;opacity:0.05; background-repeat: no-repeat; } /* Effets */ .blur > * {backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px);} .div-logo {display: flex;justify-content: center;align-items: center;} .div-logo img {width: 4.5rem !important;height: 4.5rem !important;margin: -0;} /* Card */ .card { --card-spacer-y: 1.5rem; --card-spacer-x: 1.5rem; --card-title-spacer-y: 0.75rem; --card-box-shadow: 0 .275rem .75rem -0.0625rem rgba( var(--black-rgb), 0.03), 0 .125rem .4rem -0.0625rem rgba( var(--black-rgb), 0.03); --card-box-shadow-hover: 0 .275rem .75rem -0.0625rem rgba( var(--black-rgb), .06), 0 .125rem .4rem -0.0625rem rgba( var(--black-rgb), .03); --card-icones-border-radius: 0.5rem; --card-icones-padding: 1rem; --card-height: auto; --card-color: var(--primary-darkest); --card-bg: var(--white); --card-img-overlay-padding: 1.5rem; --card-group-margin: 0.75rem; --card-border-radius: 0.5rem; position: relative; display: flex; flex-direction: column; min-width: 0; height: var(--card-height); word-wrap: break-word; background-color: var(--card-bg); background-clip: border-box; border-radius: var(--card-border-radius); box-shadow: var(--card-box-shadow); } .card:hover { box-shadow: var(--card-box-shadow-hover); } .card a.stretched-link {text-decoration-line: underline;text-underline-offset: 2px;font-weight:500;} .card a.stretched-link:hover{text-decoration-line: none;} .card a.stretched-link::after {content: "";position: absolute;z-index: 1;top: 0;right: 0;bottom: 0;left: 0;} .card a.simple-link {text-decoration-line: underline;text-underline-offset: 2px;font-weight:500;} .card a.simple-link:hover{text-decoration-line: none;} .card a.simple-link::after {content: "";} .card-hover:not(.bg-transparent) {transition: transform .2s ease-in-out, border-color .2s ease-in-out, background-color .2s ease-in-out, box-shadow .2s ease-in-out;} .card-hover:not(.bg-transparent):hover {transform: translateY(-0.25rem);box-shadow: var(--card-box-shadow-hover);} .card-body {flex: 1 1 auto;padding: var(--card-spacer-y) var(--card-spacer-x);color: var(--card-color);} .card-body img {transition: transform 0.3s ease;} .card-body img:hover {transform: scale(1.1);} .card-body .icones {display: inline-block;flex-shrink: 0;padding: var(--card-icones-padding);border-radius: var(--card-icones-border-radius);} .card-body .icones img{filter: invert(100%);} .card-footer {color: var(--card-color);} .card-footer img, .reassurance img{margin-right: 0.25rem;} /* body.dark .card:not(.pricing-card):not(.card-featured) { */ body.dark .card { --card-bg: rgba(var(--primary-lightest-rgb), 0.8); } header {padding-top:4.4rem;} /*header.home {background: radial-gradient(ellipse at 75% -20%, #25335c, var(--primary-darkest) 60%);}*/ header.home { background-color:rgba(var(--primary-darkest-rgb),1); background-image:radial-gradient(ellipse 40% 100% at 60% -10%,rgba(119,138,232,.3),rgba(119,138,232,0)); background-repeat:no-repeat; color:#fff; display:flex; flex-direction:column; position:relative } header.home::before { background-image: radial-gradient(ellipse 100% 100% at 0 100%,rgba(119,138,232, 0.04),rgba(232,119,175,0)); background-repeat: no-repeat; content: ""; display: block; height: 100%; left: 0; position: absolute; overflow:hidden; top: 0; width: 100%; } header .header-content .logo img {width:260px;} header .header-content {position: relative;z-index: 0;width: 100%;overflow: hidden;background-image: initial;background-size: cover;background-position: center;} header .header-content::before {content: '';position: absolute;z-index: -1;top: 0;left: 0;width: 100%;animation: removeBlur 1.5s ease-out forwards;} header .header-content-cms {position: relative;z-index: 0;width: 100%;overflow: hidden;} header .header-overlay {position: absolute;top: 0;left: 0;right: 0;height: 100%;background: radial-gradient(ellipse at 75% -20%, #fff, #fff 60%);background-repeat: no-repeat;background-size: cover;z-index: 1;opacity: 0.75;pointer-events: none;} header .header-content .video-container {display: flex;position: absolute;top: 50%;left: 50%;width: 560px;height: 430px;transform: translate(-50%, -50%);align-items: center;justify-content: center;overflow: hidden; animation: svgFadeInUp 2s ease-out forwards;} header .header-content .video-container video {width: 100%;height: 100%;object-fit: cover;object-position: bottom;-webkit-mask: url(#svg-mask-video);mask: url(#svg-mask-video);} header .header-content .video-container svg {position: absolute;width: 100%;height: 100%;} header .header-content .video-container svg text {font-size: 12.3rem;fill: white;font-weight: bold;stroke: none;dominant-baseline: central;text-anchor: middle;-webkit-transform: translate(50%, 50%) translateX(-1%);transform: translate(50%, 50%) translateX(-1%);} header .header-content .video-container svg rect {fill: black;width: 100%;height: 100%;} header .header-content .additional-text {position: absolute;width: 100%;top: calc(50% + 250px);left: 50%;transform: translate(-50%, -50%);font-size: 2rem;color: black;font-weight: bold;text-align: center;} /* Menu > button */ header .menu-btn {position: fixed;z-index: 1000;top: 1.5rem;right: 3rem;width: 2.1em;height: 1.5em;cursor: pointer;outline: none;transition: all 0.3s ease;backdrop-filter: none;-webkit-backdrop-filter: none;} header .menu-btn .picto {position: absolute;left: 0;top: 0;width: 100%;height: 100%;} header .menu-btn .line {position: absolute;right: 0;height: 3px;background-color: var(--menu-btn-bg-color);transition: transform var(--menu-btn-transition-duration) var(--menu-btn-transition-easing), opacity var(--menu-btn-transition-duration) var(--menu-btn-transition-easing);} header .menu-btn .line:nth-child(1) {top: 0;width: 100%;} header .menu-btn .line:nth-child(2) {top: 50%;width: 66%;} header .menu-btn .line:nth-child(3) {top: 100%;width: 40%;} header .menu-btn.active {z-index: 1001;} header .menu-btn.active .line:nth-child(1) {top: 50%;transform: translateY(-50%) rotate(45deg);width: var(--menu-btn-active-width);} header .menu-btn.active .line:nth-child(2) {opacity: 0;} header .menu-btn.active .line:nth-child(3) {top: 50%;transform: translateY(-50%) rotate(-45deg);width: var(--menu-btn-active-width);} @media(max-width: 576px) { header .menu-btn {right: 1rem;} } /* Menu > Nav */ header .menu-content {position: fixed;z-index: 1000;top: 0;right: 0;width: 100%;height: 100vh;display: flex;flex-direction: column;align-items: center;justify-content: center;box-shadow: -5px 0 10px rgba(var(--black-rgb), 0.03);transition: transform 0.3s ease-out;transform: translateX(100%);} body.menu-active > header .menu-content {transform: translateX(0);} header .menu-content ul {list-style: none;padding: 0;} header .menu-content li {margin: 10px 0;font-family: 'Poppins', Arial, sans-serif;font-size: 2.15em;font-weight: 600;line-height: 1.24em;letter-spacing: .078em;} header .menu-content a {color: rgba(var(--black-rgb), 1);text-decoration: none;position: relative;display: inline-block;} header .menu-content a:not(.not-allowed)::after {content: "";position: absolute;left: 0;bottom: -0.25rem;width: 100%;height: 0.5rem;background-color: rgba(var(--primary-medium-rgb), 1);transform: scaleX(0);transform-origin: right; transition: transform 0.3s ease-out;} header .menu-content a:hover::after {transform: scaleX(1);transform-origin: left;transition: transform 0.3s ease-out;} header .menu-content a::after {transition: transform 0.9s ease-out;} header .menu-content a.active {color: rgba(var(--primary-medium-rgb), 1);} header .menu-content a.active::after {transition: none;} header .menu-content a.active:hover::after {background: unset;bottom: 0;height: 0;width: 0;} header .menu-content .informations a {color: rgba(var(--white-rgb), 1);} header .menu-content .informations img {filter: none;} header .menu-content .mobile a {color: rgba(var(--primary-lightest-rgb), 1);} header .menu-content .mobile a.active {color: rgba(var(--white-rgb), 1);text-decoration: underline;} /* gauche */ header .menu-content .menu {padding: 0 8em 0 0;} /* droite */ header .menu-content .informations {width: 100%;padding: 0 4em 0 8em;} header .menu-content .informations ul {width: 100%;} header .menu-content .informations ul li {font-size: 1rem !important;font-weight: 500 !important;font-style: normal !important;line-height: 1.2 !important;} header .menu-content .informations ul li img {display: flex;align-self: stretch;width: 1.3rem;height: 1.3rem;margin-right: 0.5rem;} header .menu-content .informations ul li a {display: flex !important;align-items: center !important;} header .menu-content .informations ul li a:after {background-color: transparent !important;transform: none !important;} /* Scroll */ #scrollToTop {position: fixed;z-index: 1000;display: flex;justify-content: center;align-items: center;bottom: -50px;right: 20px;width: 50px;height: 50px;background-color: rgba(var(--black-rgb), 1);color: rgba(var(--white-rgb), 1);border: none;border-radius: 50%;cursor: pointer;opacity: 0;transition: all 0.5s ease;} #scrollToTop.show {bottom: 20px;opacity: 1;} main {line-height: 1;overflow:hidden;} main p {line-height: 1.5;} main.no-overflow {overflow: visible;} /* Debug */ .mail-data pre {white-space:pre-wrap;word-break:break-word;background:#111;color:#0f0;padding:1rem;border-radius:8px;font-size:.85rem;max-width:100%;overflow-x:auto;} /* Fin - Debug */ section {position: relative;z-index: 0;} section.about {width: 100%;margin: 0 auto;overflow-wrap: break-word;} section.about .about-content {width: calc(100% - 3rem);max-width: 80em;margin: 0 auto;padding: 5rem 0;} section.about .about-screen {content: '';height: 100%;width: 100%;background-position: 60% 50%;} section.produits {width: 100%;margin: 0 auto;overflow-wrap: break-word;} section.produits .produits-content {width: calc(100% - 3rem);max-width: 80em;margin: 0 auto;padding: 5rem 0;} section.produits .produits-icons {display: inline-block;padding: 0.55rem;} section.produits .produits-svg {width:50px; height:50px;flex-shrink: 0;filter: invert(100%);} section.produits .slider-content {width: calc(100% - 3rem);max-width: 110em;margin: 0 auto;padding: 5rem 0;} /* Badge produit : neuf/occasion/reconditionné/promo etc*/ .badge { --badge-padding-x: 0.6em; --badge-padding-y: 0.35em; --badge-font-size: 0.8125em; --badge-font-weight: 600; --badge-color: #fff; --badge-border-radius: 0.25rem; display: inline-block; padding: var(--badge-padding-y) var(--badge-padding-x); font-size: var(--badge-font-size); font-weight: var(--badge-font-weight); line-height: 1; color: var(--white); text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: var(--badge-border-radius) } .badge:empty {display: none;} /* Tabs nav : fiche produit etc */ .nav { --nav-link-color: rgba(var(--dark-rgb), 1); --nav-link-hover-color: rgba(var(--white-rgb), 1); --nav-link-disabled-color: rgba(var(--dark-rgb), 0.4); --nav-tabs-link-bg: rgba(var(--primary-leger-rgb), 1); --nav-tabs-link-hover-bg: rgba(var(--primary-medium-rgb), 1); --nav-tabs-link-disabled-bg: rgba(var(--primary-leger-rgb), 0.6); --nav-tabs-border-color: rgba(var(--primary-leger-rgb), 1); --nav-tabs-border-radius: 0.375rem; --nav-tabs-link-active-color: rgba(var(--white-rgb), 1); --nav-tabs-link-active-bg: rgba(var(--primary-medium-rgb), 1); --nav-tabs-link-active-border-color: transparent; display: flex; flex-wrap: wrap; padding-left: 0; margin-bottom: 0; list-style: none; color: var(--nav-link-color); } .nav-tabs, .nav-pills {border-bottom: 0px solid var(--nav-tabs-border-color);} .nav-item {margin-bottom: 0.75rem;} .nav-tabs .nav-item:last-child,.nav-pills .nav-item:last-child {margin-right: 0;} .nav-tabs.justify-content-center .nav-item,.nav-pills.justify-content-center .nav-item,.nav-tabs.justify-content-end .nav-item,.nav-pills.justify-content-end .nav-item {margin-right: 0.5rem;margin-left: 0.5rem;} .nav-tabs.flex-column .nav-item,.nav-pills.flex-column .nav-item {margin-right: 0;margin-bottom: 0.75rem;margin-left: 0;} .nav-item button.nav-link {display: block;padding: 0.8rem 1.2rem;font-size: 0.85rem;line-height: 1rem;color: var(--nav-link-color);background-color: var(--nav-tabs-link-bg);border: 1px solid var(--nav-tabs-border-color);border-radius: var(--nav-tabs-border-radius);cursor: pointer;} .nav-item button.nav-link:hover:not(.active):not(.disabled) {background-color: var(--nav-tabs-link-hover-bg);color: var(--nav-link-hover-color);border-color: var(--nav-tabs-link-hover-bg);} .nav-item button.nav-link.active {color: var(--nav-tabs-link-active-color);background-color: var(--nav-tabs-link-active-bg);border-color: var(--nav-tabs-link-active-border-color);} .nav-item button.nav-link.disabled,.nav-item button.nav-link:disabled {color: var(--nav-link-disabled-color);background-color: var(--nav-tabs-link-disabled-bg);border-color: var(--nav-tabs-link-disabled-bg); cursor: not-allowed;pointer-events: none;} .nav-pills .nav-link {border-radius: var(--nav-pills-border-radius);} .nav-fill > .nav-link, .nav-fill .nav-item,.nav-justified > .nav-link, .nav-justified .nav-item {flex: 1 1 auto;text-align: center;width: 100%;} .tab-content > .tab-pane {display: none;} .tab-content > .active {display: block;} /* produit page article.php */ .qte-group {position: relative;width: 100%;max-width: 7rem;height: 3.5rem;display: flex;flex-wrap: wrap;align-items: stretch;border: 0.20rem solid rgba(var(--black-rgb), 1);} .qte-group > .form-control {position: relative;width: 1%;min-width: 0;flex: 1 1 auto;} .qte-group > input {border:0;padding:0;background: initial;font-size: 1.05rem;font-weight: 600;} .qte-group > input.form-control {box-shadow: initial;} .qte-group > button {width: 30%;font-size: 1.6rem;font-weight: normal;border: 0;background: initial;padding: 0;box-shadow: initial;color: rgba(var(--black-rgb), 1);} .qte-group > button:hover {border: 0;background: initial;box-shadow: initial;color: rgba(var(--black-rgb), 1);} section.marques {width: 100%;margin: 0 auto;overflow-wrap: break-word;} section.marques .slider-content {width: calc(100% - 3rem);max-width: 110em;margin: 0 auto;padding: 5rem 0;} section.reviews {width: 100%;margin: 0 auto;overflow-wrap: break-word;} section.reviews .slider-content {width: calc(100% - 3rem);max-width: 110em;margin: 0 auto;padding: 5rem 0;} section.reviews p {margin: 10px 0;} section.accompagnement {width: 100%;margin: 0 auto;overflow-wrap: break-word;} section.accompagnement .accompagnement-content {width: calc(100% - 3rem);max-width: 80em;margin: 0 auto;padding: 5rem 0;} section.accompagnement .accompagnement-screen {content: '';height: 100%;width: 100%;background-position: center center;} section.blog {width: 100%;margin: 0 auto;overflow-wrap: break-word;} section.blog .blog-content {width: calc(100% - 3rem);max-width: 80em;margin: 0 auto;padding: 5rem 0;} section.cms {width: 100%;margin: 0 auto;overflow-wrap: break-word;} section.cms .cms-content {width: calc(100% - 3rem);max-width: 80em;margin: 0 auto;padding: 5rem 0;} section.cms .btn img {filter: invert(100%);} .service-item, .blog-item {text-align: center;} .service-item img, .blog-item img {max-width: 100%;height: auto;margin-bottom: 20px;} /* Slider */ .slider-content {user-select: none;-webkit-user-select: none;-ms-user-select: none;} .slider-wrapper {position: relative;z-index: 100;width: 100%;margin: 0 auto;overflow: hidden;} .slider-box {display: flex;transition: transform 0.5s ease-in-out;} .slider-container {flex: 0 0 100%;padding: 1rem;box-sizing: border-box;} .slider-item {width: 100%;box-sizing: border-box;padding: 20px;background: rgba(var(--white-rgb), 1);box-shadow: 0 0 10px rgba(var(--black-rgb), .15);border-radius: 8px;} .quote {height: 11rem;font-size: 16px;line-height: 1.6em;} .stars {color: rgba(var(--yellow-medium-rgb), 0.1);} .author {font-weight: 500;} .date {color: rgba(var(--black-rgb), .8);} .slider-controls {display: flex;align-items: center;justify-content: center;margin-top: 20px;} .slider-controls button {display: flex;align-items: center;justify-content: center;width: 2.6rem;height: 2.6rem;font-size: 2rem;font-weight: normal;white-space: nowrap;cursor: pointer;color: rgba(var(--white-rgb), 1);background-color: rgba(var(--black-rgb), 1);border: none;margin: 0 5px;border-radius: 50%;flex-shrink: 0; box-shadow: 0 0.275rem 0.75rem -0.0625rem rgba(var(--black-rgb), 0.6), 0 0.125rem 0.4rem -0.0625rem rgba(var(--black-rgb), 0.03);} .slider-controls button:hover {background-color: rgba(var(--black-rgb), 0.85);} .slider-controls button img {filter: invert(90%);-webkit-filter: invert(90%);} .slider-controls.primary button {color: rgba(var(--black-rgb), 1);background-color: rgba(var(--primary-dark-rgb), 1);} .slider-controls.primary button:hover {color: rgba(var(--black-rgb), 1);background-color: rgba(var(--primary-medium-rgb), 1);} .slider-controls.white button {color: rgba(var(--white-rgb), 1);background-color: rgba(var(--white-rgb), 1);box-shadow: 0 0.275rem 0.75rem -0.0625rem rgba(var(--black-rgb), 0.10), 0 0.125rem 0.4rem -0.0625rem rgba(var(--black-rgb), 0.03);} .slider-controls.white button:hover {color: rgba(var(--white-rgb), 1);background-color: rgba(var(--white-rgb), 1);} .slider-controls.white button img {filter: invert(0%);-webkit-filter: invert(0%);} .slider-controls.white button:hover img {filter: invert(20%);-webkit-filter: invert(20%);} .slider-controls.secondary button {color: rgba(var(--white-rgb), 1);background-color: rgba(var(--secondary-medium-rgb), 1);box-shadow: 0 0.275rem 0.75rem -0.0625rem rgba(var(--black-rgb), 0.25), 0 0.125rem 0.4rem -0.0625rem rgba(var(--black-rgb), 0.03);} .slider-controls.secondary button:hover {color: rgba(var(--white-rgb), 1);background-color: rgba(var(--secondary-medium-rgb), 1);} /* Page : à propos */ .timeline {display: flex;flex-direction: column;position: relative;margin: 30px 0;padding: 0;} .timeline::before {content: '';position: absolute;left: 50%;top: 0;bottom: 0;width: 0.5rem;background-color: rgba(var(--primary-medium-rgb), 0.75);transform: translateX(-50%);} .timeline-item {display: flex;justify-content: space-between;align-items: center;position: relative;width: 100%;margin-bottom: 30px;} .timeline-item.left .date {order: 1;margin-right: auto;text-align: right;} .timeline-item.right .date {order: 2;margin-left: auto;text-align: left;} .timeline-item.left .content {order: 2;margin-left: auto;text-align: left;} .timeline-item.right .content {order: 1;margin-right: auto;text-align: right;} .timeline-item .date {flex: 0 0 auto;width: 100px;font-size: 1.5rem;color: var(--black);text-align: center;} .timeline-item .content {flex: 1;background: var(--white);padding: 15px;border-radius: 10px;box-shadow: 0 0 10px rgba(var(--black-rgb), 0.1);max-width: 45%;} @media (max-width: 768px) { .timeline {padding: 0 20px;} .timeline::before {left: 8px;} .timeline-item {flex-direction: column;align-items: flex-start;margin-bottom: 40px;} .timeline-item.left .content, .timeline-item.right .content {order: 2;text-align: left;max-width: 100%;} .timeline-item .date {order: 1;margin-bottom: 10px;text-align: left;font-size: 1.2rem;} .timeline-item.left .date, .timeline-item.right .date {text-align: left;margin-left: 0;} .timeline-item.left .content, .timeline-item.right .content {margin-right: 0;margin-left: 0;} } .team-photos-grid {--columns: 5;display: grid;grid-template-columns: repeat(var(--columns), 1fr);gap: 1rem;width: 100%;} .team-member {position: relative;overflow: hidden;text-align: center;} .team-member img {width: 100%;height: auto;transition: transform 0.5s ease;cursor: pointer;} .team-member .overlay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(var(--black-rgb), 0.6);opacity: 0;transition: opacity 0.5s ease;display: flex;flex-direction: column;justify-content: center;align-items: center;color: var(--white);pointer-events: none;} .team-member .text-overlay {opacity: 0;transform: translateY(20px);transition: opacity 0.5s ease, transform 0.5s ease;} .team-member:hover img {transform: scale(1.1);} .team-member:hover .overlay {opacity: 1;} .team-member:hover .overlay .text-overlay {opacity: 1;transform: translateY(0);} .team-member .text {display: none;margin-top: 1rem;} .team-member h4 {margin: 0;} .team-member p {font-size: 0.85rem;margin-top: .15rem;} @media (max-width: 768px) { .team-photos-grid {grid-template-columns: repeat(2, 1fr);} .team-member .overlay {display: none;} .team-member .text {display: block;} } /* Classes personnalisées pour modifier le nombre de colonnes */ .grid-columns-6 {--columns: 6; } .grid-columns-5 {--columns: 5; } .grid-columns-4 {--columns: 4; } .grid-columns-3 {--columns: 3; } /* zoom > img */ /* .modal-img {position: fixed;z-index: 1000;left: 0;top: 0;display: flex;justify-content: center;align-items: center;width: 100%;height: 100%;overflow: hidden;background-color: rgba(var(--black-rgb), 0.8);} .modal-img .modal-img-content {position: relative;max-width: 90%;max-height: 90%;overflow: visible;padding: 0;} .modal-img .modal-img-content img {display: block;width: auto;height: auto;max-width: 100%;max-height: 800px;margin: 0 auto;} .modal-img .close-img:before {content: "Fermer";color: var(--white);font-size: 1rem;margin-left: 1.2rem;} .modal-img .close-img {position: absolute;cursor: pointer;top: -1.3rem;right: 3.8rem;width: 1.2rem;height: 1.2rem;background: url('data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22white%22%3E%3Cpath d=%22M19.3 4.7a1 1 0 0 0-1.4 0L12 10.6 6.1 4.7a1 1 0 0 0-1.4 1.4l5.9 5.9-5.9 5.9a1 1 0 1 0 1.4 1.4l5.9-5.9 5.9 5.9a1 1 0 0 0 1.4-1.4l-5.9-5.9 5.9-5.9a1 1 0 0 0 0-1.4z%22/%3E%3C/svg%3E') no-repeat center;background-size: contain;} */ /* Slide img + Diaporama */ .zoom-img {cursor: pointer;} .zoom-modal-overlay {position: fixed;z-index: 998;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.95);} .zoom-modal-slideshow-content {position: absolute;z-index: 1000;display: flex;flex-direction: column;justify-content: center;align-items: center;top: 50%;left: 50%;transform: translate(-50%, -50%);} .zoom-modal-slideshow {position: fixed;z-index: 1000;display: flex;justify-content: center;align-items: center;top: 0;left: 0;width: 100%;height: 100%;} .zoom-modal-slideshow.visually-hidden {display: none;} .zoom-img-container {display: flex;justify-content: center;align-items: center;max-width: 100%;max-height: 100%;} .zoom-img-container img {display: block;max-width: 100%;max-height: 80vh;margin: auto;border-radius: 10px;} .zoom-close-slideshow { position: absolute; top: 20px; right: 20px; font-size: 2rem; color: white; background: rgba(0, 0, 0, 0.5); padding: 10px; cursor: pointer; z-index: 1001; width: 30px; height: 30px; display: flex; justify-content: center; align-items: center; border: 0.15rem solid #fff; opacity: 0.75; } .zoom-close-slideshow:hover {opacity: 1;} .zoom-prev-img, .zoom-next-img { position: absolute; z-index: 1001; pointer-events: auto; font-size: 2rem; color: white; background: rgba(0, 0, 0, 0.5); border-radius: 50%; cursor: pointer; top: 50%; transform: translateY(-50%); width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; border: 0.15rem solid #fff; line-height: 1; opacity: 0.5; } .zoom-prev-img:hover, .zoom-next-img:hover {opacity: 1;} .zoom-prev-img {left: 20px;} .zoom-next-img {right: 20px;} .zoom-play-slideshow { position: absolute; z-index: 1002; bottom: 20px; left: 50%; transform: translateX(-50%); font-size: 2rem; color: white; background: rgba(0, 0, 0, 0.5); padding: 15px; cursor: pointer; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; border: 0.15rem solid #fff; opacity: 0.75; } .zoom-play-slideshow:hover {opacity: 1;} .zoom-controls-container {position: absolute;display: flex;top: 0;left: 0;width: 100%;height: 100%;justify-content: space-between;align-items: center;pointer-events: none;} .zoom-prev-img, .zoom-next-img, .zoom-play-slideshow, .zoom-close-slideshow {pointer-events: auto;} @media (max-width: 768px) { .zoom-modal-slideshow-content {width: 100%;height: auto;} .zoom-img-container img {max-width: 90%;max-height: 70vh;} } /* Réalisations > Filtres */ .filter-container {text-align: center;} .filter-link {margin: 0 0.8rem;font-size: 1rem;font-weight: 500;color: var(--black);text-decoration: none;border-bottom: 2px solid transparent;transition: all 0.3s ease;} .filter-link:hover,.filter-link.active {color: var(--primary-medium);border-bottom: 2px solid var(--primary-medium);} /* Responsive */ @media (max-width: 768px) { .filter-link {display: block;margin: 0;} } /* Sommaire */ .sommaire {display: flex;flex-direction: column;color: var(--black);border-radius: 0.5rem;padding: 1.5rem;margin: 0 0 1rem 0;} .sommaire-header {display: flex;align-items: center; margin-bottom: 0.5rem;} .sommaire-icon {font-size: 1.8rem;color: var(--primary-medium);margin-right: 0.5rem;} .sommaire-title {font-size: 1.5rem;margin: 0;} .sommaire-list {list-style: none;padding: 0;margin: 0;} .sommaire-list li {margin: 0.6rem 0;} .sommaire-list a {position: relative;color: var(--black);text-decoration: none;padding-bottom: 0px;transition: all 0.2s;} .sommaire-list a::before {content: '';position: absolute;bottom: -0.25rem;left: 0;right: 100%;height: 0.35rem;background-color: var(--primary-moyen);transition: right 0.3s;} .sommaire-list a:hover::before {right: 0;} .sommaire-list a:hover {color: var(--black);} /* Accordion : Faqs etc... */ .accordion { --accordion-color: var(--black); --accordion-bg: var(--white); --accordion-transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, border-radius 0.15s ease; --accordion-border-color: transparent; --accordion-border-width: 0; --accordion-border-radius: 0.5rem; --accordion-inner-border-radius: calc(0.5rem - 1px); --accordion-btn-padding-x: 1.5rem; --accordion-btn-padding-y: 1.5rem; --accordion-btn-color: var(--black); --accordion-btn-bg: var(--accordion-bg); --accordion-btn-icon-width: 0.625rem; --accordion-btn-icon-transform: rotate(-180deg); --accordion-btn-icon-transition: transform 0.2s ease-in-out; --accordion-btn-focus-border-color: transparent; --accordion-btn-focus-box-shadow: unset; --accordion-body-padding-x: 1.5rem; --accordion-body-padding-y: 1rem; --accordion-btn-font-weight: 500; --accordion-btn-icon-box-size: 2.25rem; --accordion-btn-icon-box-border-radius: 50%; --accordion-btn-icon-box-bg: var(--primary-leger); --accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256' fill='%2333354d'%3e%3cpath d='M225.813 48.907L128 146.72 30.187 48.907 0 79.093l128 128 128-128z'/%3e%3c/svg%3e"); --accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256' fill='%23fff'%3e%3cpath d='M225.813 48.907L128 146.72 30.187 48.907 0 79.093l128 128 128-128z'/%3e%3c/svg%3e"); --accordion-active-color: var(--primary-dark); --accordion-active-bg: var(--white); --accordion-btn-icon-box-active-bg: var(--primary-medium); --accordion-btn-icon-box-active-shadow: 0 -0.5rem 1.125rem -0.5rem rgba(var(--primary-medium-rgb), 0.9); } .accordion-button { position: relative; display: flex; align-items: center; width: 100%; padding: var(--accordion-btn-padding-y) var(--accordion-btn-padding-x); font-size: 1.25rem; font-weight: var(--accordion-btn-font-weight); color: var(--accordion-btn-color); text-align: left; background-color: var(--accordion-btn-bg); overflow-anchor: none; transition: var(--accordion-transition);border: 0; border-radius: var(--accordion-border-radius); } .accordion-button:not(.collapsed) {color: var(--accordion-active-color); background-color: var(--accordion-active-bg);} .accordion-button::after {flex-shrink: 0;width: var(--accordion-btn-icon-box-size);height: var(--accordion-btn-icon-box-size);margin-left: auto;content: "";background-image: var(--accordion-btn-icon);background-repeat: no-repeat;background-size: var(--accordion-btn-icon-width);background-position: center;background-color: var(--accordion-btn-icon-box-bg);border-radius: var(--accordion-btn-icon-box-border-radius);transition: all 0.35s;} .accordion-button:not(.collapsed)::after {background-image: var(--accordion-btn-active-icon);transform: var(--accordion-btn-icon-transform);background-color: var(--accordion-btn-icon-box-active-bg);box-shadow: var(--accordion-btn-icon-box-active-shadow);} .accordion-button:hover {z-index: 2;} .accordion-button:focus {z-index: 3;border-color: var(--accordion-btn-focus-border-color);outline: 0;box-shadow: var(--accordion-btn-focus-box-shadow);} .accordion-header {margin-bottom: 0;} .accordion-item {color: var(--accordion-color);background-color: var(--accordion-bg);border: var(--accordion-border-width) solid var(--accordion-border-color);box-shadow: 0 0.275rem 0.75rem -0.0625rem rgba(var(--black-rgb), 0.06), 0 0.125rem 0.4rem -0.0625rem rgba(var(--black-rgb), 0.03) !important;margin-bottom: 1rem;border-radius: var(--accordion-border-radius);} .accordion-item:last-child {margin-bottom: 0;} .accordion-item:not(:first-of-type) {border-top: 0;} .accordion-body {padding: var(--accordion-body-padding-y) var(--accordion-body-padding-x);padding-top: 0;line-height: 1.5;} @media (prefers-reduced-motion: reduce) {.accordion-button {transition: none;}.accordion-button::after {transition: none;}} footer {--opacity: .94;width: 100%;margin: 0 auto;overflow-wrap: break-word;background-color: rgba(var(--black-rgb), var(--opacity));} footer section {--opacity: 1;width: calc(100% - 3rem);max-width: 80em;margin: 0 auto;padding: 5rem 0;color: rgba(var(--white-rgb), var(--opacity))} footer section .logo-img {filter: invert(85%);} footer section .div-logo {text-shadow: 0.1rem 0.2rem 1rem rgba(var(--primary-medium-rgb), .50);} footer section .menux2 {list-style: none;display: grid;grid-template-columns: repeat(2,1fr);grid-gap: 1rem;padding: 0;background-color:re;} footer section .menux2 a, footer section .list-unstyled a{display: block;text-decoration: none;outline: 0;-webkit-transition: .4s;-o-transition: .4s;transition: .4s;} footer section .menux2 li a:hover, footer section .list-unstyled a:hover {color: var(--primary-medium);-webkit-transform:translateX(5px);-ms-transform:translateX(5px);transform:translateX(5px);} footer section .blog-recent {display: flex;align-items: center;gap: 1.5rem;margin-bottom: 1.5rem;} footer section .blog-recent .media {max-width: 100px;overflow: hidden;border-radius: 0.25rem;} footer section .blog-recent .body > * a {display: flex;text-decoration: none;align-items: center;} footer section .blog-recent .body > * a:hover {color: var(--primary-medium);} footer section .blog-recent .body .meta {font-size: 0.8rem;margin-bottom: 0.5rem;} footer section .blog-recent .body .meta a img {filter: invert(100%);max-width: 1rem;margin-right: 0.25rem;} /* Elements */ .box-link {display: flex;justify-content: space-between;flex-direction: column;align-items: center;gap: 1rem;} .box-link-2 {display: flex;justify-content: space-between;flex-direction: column;} .box-link-2 h1 {width: 100%;} .scrollable {max-height: 12rem;overflow-y: auto;scrollbar-width: thin;} /* Mobile */ @media (max-width: 768px) { .text-404 {font-size: 9rem;} header .header-content .video-container svg text {font-size: 17rem;-webkit-transform: translate(50%, 50%) translateX(-3%);transform: translate(50%, 50%) translateX(-3%);} header .header-content .vue-pc {display: none;} header .header-content .vue-tablette {display: none;} header .header-content .vue-mobile {display: block;} } /* IOS 12 */ /* @media only screen and (max-width: 768px) { header .header-content .video-container video { -webkit-mask-image: url(#svg-mask-video) !important; mask-image: url(#svg-mask-video) !important; -webkit-mask-size: 100% 100% !important; mask-size: 100% 100% !important; -webkit-mask-repeat: no-repeat !important; mask-repeat: no-repeat !important; -webkit-mask-position: center !important; mask-position: center !important; -webkit-mask-composite: source-over; mask-composite: add; } } */ /* Cibler les appareils iOS 12, dont l'iPhone 12 */ @media only screen and (min-device-width: 375px) and (max-device-width: 390px) and (-webkit-min-device-pixel-ratio: 3) and (hover: none) and (pointer: coarse) { /* Masquer la vidéo pour les appareils ciblés */ header .header-content .video-container video {display: none;} /* Ajouter l'image SV.png à la place de la vidéo */ header .header-content .video-container {background-image: url('../img/SV.png');background-size: 90%;background-position: center center;width: 100%;height: 100vh;background-repeat: no-repeat;padding: 5%;} } /* PC */ @media (min-width: 1024px) { .box-link {display: flex;justify-content: flex-start;flex-direction: row;align-items: start;gap: 1.2rem;} .box-link-2 {display: flex;justify-content: flex-start;flex-direction: row;align-items: center;} .box-link-2 h1 {width: 55%;} } /* Tablette */ @media (min-width: 768px) and (max-width: 1150px) { header .header-content .video-container svg text {font-size: 26rem;-webkit-transform: translate(50%, 50%) translateX(-4%);transform: translate(50%, 50%) translateX(-4%);} header .header-content .vue-pc {display: none;} header .header-content .vue-tablette {display: block;} header .header-content .vue-mobile {display: none;} } /* PC */ @media (min-width: 1150px) { header .header-content .video-container {width: 1150px;max-height: 380px;} header .header-content .video-container svg .vue-pc {dominant-baseline: unset;} header .header-content .vue-pc {display: block;} header .header-content .vue-tablette {display: none;} header .header-content .vue-mobile {display: none;} header .header-content .menu-content ul li {font-size: 2.5em;} section.about .about-content {width: 100%;max-width: initial;margin: 0;padding: 0;} section.accompagnement .accompagnement-content {width: 100%;max-width: initial;margin: 0;padding: 0;} .slider-container {box-sizing: border-box;flex: 0 0 calc(100% / var(--pc-count) - 0px);} .slider-container.last {margin-right: 0;} } /* Alertes */ .alert { --sv-alert-bg: transparent; --sv-alert-padding-x: 1rem; --sv-alert-padding-y: 1rem; --sv-alert-margin-bottom: 1rem; --sv-alert-color: inherit; --sv-alert-border-color: transparent; --sv-alert-border: 1px solid var(--sv-alert-border-color); --sv-alert-border-radius: 0.5rem; position: relative; padding: var(--sv-alert-padding-y) var(--sv-alert-padding-x); margin-bottom: var(--sv-alert-margin-bottom); color: var(--sv-alert-color); background-color: var(--sv-alert-bg); border: var(--sv-alert-border); border-radius: var(--sv-alert-border-radius) } .alert-danger {--sv-alert-color: #d73d3d;--sv-alert-bg: #fdecec;--sv-alert-border-color: #f7a2a2;} .alert-success {--sv-alert-color: #1fb155;--sv-alert-bg: #e9f9ef;--sv-alert-border-color: #91e2af;} /* Form */ .form-control { --opacity: 0.2; display: block; width: 100%; padding: .625rem 1rem; font-size: 0.875rem; font-weight: normal; line-height: 1.6; color: var(--black); background-color: var(--white); background-clip: padding-box; border: 1px solid rgba(var(--black-rgb), var(--opacity)); -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0.4rem; box-shadow: inset 0 0 0 rgba(var(--black-rgb), 0); transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out } @media(prefers-reduced-motion: reduce) { .form-control {transition: none;} } .form-control[type=file] {overflow: hidden} .form-control[type=file]:not(:disabled):not([readonly]) {cursor: pointer} .form-control:focus { --opacity: 0.2; color: var(--black); background-color: var(--white); border-color: var(--dark); outline: 0; box-shadow: inset 0 0 0 rgba(var(--black-rgb), 0), 0 .5rem 1.125rem -0.5rem rgba(var(--black-rgb), var(--opacity)); } .form-control::-webkit-date-and-time-value {height: 1.6em} .form-control::placeholder, .form-control::-moz-placeholder {--opacity: 0.3;color: rgba(var(--black-rgb), var(--opacity));opacity: 1;} .form-control:disabled {background-color: rgba(var(--black-rgb), 0.05);opacity: 1} .form-control::-webkit-file-upload-button { padding: .625rem 1rem; margin: -0.625rem -1rem; -webkit-margin-end: 1rem; margin-inline-end: 1rem; color: rgba(var(--dark-rgb), 1); background-color: var(--white); pointer-events: none; border-color: inherit; border-style: solid; border-width: 0; border-inline-end-width: 1px; border-radius: 0; -webkit-transition: color .2s ease-in-out, background-color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out; transition: color .2s ease-in-out, background-color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out } .form-control::file-selector-button { padding: .625rem 1rem; margin: -0.625rem -1rem; -webkit-margin-end: 1rem; margin-inline-end: 1rem; color: rgba(var(--dark-rgb), 1); background-color: var(--white); pointer-events: none; border-color: inherit; border-style: solid; border-width: 0; border-inline-end-width: 1px; border-radius: 0; transition: color .2s ease-in-out, background-color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out } @media(prefers-reduced-motion: reduce) { .form-control::-webkit-file-upload-button {-webkit-transition: none;transition: none} .form-control::file-selector-button {transition: none} } .form-control:hover:not(:disabled):not([readonly])::-webkit-file-upload-button {background-color: rgba(var(--black-rgb), 0.05);} .form-control:hover:not(:disabled):not([readonly])::file-selector-button {background-color: rgba(var(--black-rgb), 0.05);} .form-control-plaintext {display: flex;align-items: center;padding: 0 1rem;white-space: nowrap;color: rgba(var(--black-rgb), 0.6);background-color: rgba(var(--black-rgb), 0.1);border: solid rgba(var(--black-rgb), 0.1);border-width: 0.1rem;border-radius: 0.4rem;} .form-control-plaintext:focus {outline: 0;} textarea.form-control {min-height: calc(1.6em + 1.25rem + 2px);} .form-select { --opacity: 0.2; display: block; width: 100%; padding: .625rem 3rem .625rem 1rem; -moz-padding-start: calc(1rem - 3px); font-size: 0.875rem; font-weight: normal; line-height: 1.6; color: rgba(var(--dark-rgb), 1); background-color: var(--white); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23565973' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right 1rem center; background-size: 16px 12px; border: 1px solid rgba(var(--black-rgb), var(--opacity)); border-radius: 0.4rem; box-shadow: inset 0 0 0 rgba(0, 0, 0, 0); transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out; -webkit-appearance: none; -moz-appearance: none; appearance: none; } @media(prefers-reduced-motion: reduce) { .form-select {transition: none;} } .form-select:focus {--opacity: 0.2;border-color: var(--dark);outline: 0;box-shadow: inset 0 0 0 rgba(var(--black-rgb), 0), 0 .5rem 1.125rem -0.5rem rgba(var(--black-rgb), var(--opacity));} .form-select[multiple], .form-select[size]:not([size="1"]) {padding-right: 1rem;background-image: none;} .form-select:disabled {background-color: rgba(var(--black-rgb), 0.05);} .form-select-sm {padding-top: .475rem;padding-bottom: .475rem;padding-left: .875rem;font-size: 0.75rem;border-radius: .25rem;} .form-select-lg {padding-top: .785rem;padding-bottom: .785rem;padding-left: 1.125rem;font-size: 1rem;border-radius: .5rem;} .form-label {margin-bottom: .5rem;font-size: 0.875rem;font-weight: 600;color: var(--dark);} /* Valide */ .was-validated :valid~.valid-feedback, .was-validated :valid~.valid-tooltip, .is-valid~.valid-feedback, .is-valid~.valid-tooltip {display: block;} .was-validated .form-control:valid, .form-control.is-valid { border-color: var(--success); padding-right: calc(1.6em + 1.25rem); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%2322c55e'%3e%3cpath d='M10 1.667c-4.595 0-8.333 3.738-8.333 8.333S5.405 18.333 10 18.333s8.333-3.738 8.333-8.333S14.595 1.667 10 1.667zm0 15c-3.676 0-6.667-2.991-6.667-6.667S6.324 3.333 10 3.333 16.667 6.324 16.667 10 13.676 16.667 10 16.667zm-1.668-5.345L6.416 9.41 5.24 10.59l3.094 3.088 5.588-5.588-1.178-1.178-4.412 4.412z'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(0.4em + 0.3125rem) center; background-size: calc(0.8em + 0.625rem) calc(0.8em + 0.625rem); } .was-validated .form-control:valid:focus, .form-control.is-valid:focus {--opacity: .25;border-color: var(--success);box-shadow: inset 0 0 0 rgba(var(--success-rgb), 0), 0 .5rem 1.125rem -0.5rem rgba(var(--success-rgb), var(--opacity));} .was-validated textarea.form-control:valid, textarea.form-control.is-valid {padding-right: calc(1.6em + 1.25rem);background-position: top calc(0.4em + 0.3125rem) right calc(0.4em + 0.3125rem);} .was-validated .form-select:valid,.form-select.is-valid {border-color: var(--success);} .was-validated .form-select:valid:not([multiple]):not([size]), .was-validated .form-select:valid:not([multiple])[size="1"], .form-select.is-valid:not([multiple]):not([size]), .form-select.is-valid:not([multiple])[size="1"] { padding-right: 5.5rem; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23565973' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"), url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%2322c55e'%3e%3cpath d='M10 1.667c-4.595 0-8.333 3.738-8.333 8.333S5.405 18.333 10 18.333s8.333-3.738 8.333-8.333S14.595 1.667 10 1.667zm0 15c-3.676 0-6.667-2.991-6.667-6.667S6.324 3.333 10 3.333 16.667 6.324 16.667 10 13.676 16.667 10 16.667zm-1.668-5.345L6.416 9.41 5.24 10.59l3.094 3.088 5.588-5.588-1.178-1.178-4.412 4.412z'/%3e%3c/svg%3e"); background-position: right 1rem center, center right 3rem; background-size: 16px 12px, calc(0.8em + 0.625rem) calc(0.8em + 0.625rem) } .was-validated .form-select:valid:focus, .form-select.is-valid:focus {--opacity: .25;border-color: var(--success);box-shadow: inset 0 0 0 rgba(var(--success-rgb), 0), 0 .5rem 1.125rem -0.5rem rgba(var(--success-rgb), var(--opacity));} .was-validated .form-control-color:valid, .form-control-color.is-valid {width: calc(3rem + calc(1.6em + 1.25rem));} .was-validated .form-check-input:valid, .form-check-input.is-valid {border-color: var(--success);} .was-validated .form-check-input:valid:checked,.form-check-input.is-valid:checked {background-color: var(--success);} .was-validated .form-check-input:valid:focus,.form-check-input.is-valid:focus {--opacity: .25;box-shadow: inset 0 0 0 rgba(var(--success-rgb), 0), 0 .5rem 1.125rem -0.5rem rgba(var(--success-rgb), var(--opacity));} .was-validated .form-check-input:valid~.form-check-label,.form-check-input.is-valid~.form-check-label {color: var(--success);} .form-check-inline .form-check-input~.valid-feedback {margin-left: .5em;} /* Invalide */ .invalid-feedback {display: none;width: 100%;margin-top: .25rem;font-size: 0.75rem;color: var(--error);} .invalid-tooltip {position: absolute;top: 100%;z-index: 5;display: none;max-width: 100%;padding: .25rem .5rem;margin-top: .1rem;font-size: 0.75rem;color: var(--black);background-color: rgba(var(--error-rgb), .9);border-radius: .25rem;} .was-validated :invalid~.invalid-feedback,.was-validated :invalid~.invalid-tooltip,.is-invalid~.invalid-feedback,.is-invalid~.invalid-tooltip {display: block;} .was-validated .form-control:invalid, .form-control.is-invalid { border-color: var(--error); padding-right: calc(1.6em + 1.25rem); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23ef4444'%3e%3cpath d='M7.643 13.535L10 11.178l2.357 2.357 1.178-1.178L11.178 10l2.357-2.357-1.178-1.178L10 8.822 7.643 6.465 6.465 7.643 8.822 10l-2.357 2.357 1.178 1.178zM10 18.333c4.595 0 8.333-3.738 8.333-8.333S14.595 1.667 10 1.667 1.667 5.405 1.667 10 5.405 18.333 10 18.333zm0-15c3.676 0 6.667 2.991 6.667 6.667S13.676 16.667 10 16.667 3.333 13.676 3.333 10 6.324 3.333 10 3.333z'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(0.4em + 0.3125rem) center; background-size: calc(0.8em + 0.625rem) calc(0.8em + 0.625rem); } .was-validated .form-control:invalid:focus, .form-control.is-invalid:focus {--opacity: .25;border-color: var(--error);box-shadow: inset 0 0 0 rgba(var(--error-rgb), 0), 0 .5rem 1.125rem -0.5rem rgba(var(--error-rgb), var(--opacity));} .was-validated textarea.form-control:invalid,textarea.form-control.is-invalid {padding-right: calc(1.6em + 1.25rem);background-position: top calc(0.4em + 0.3125rem) right calc(0.4em + 0.3125rem)} .was-validated .form-select:invalid,.form-select.is-invalid {border-color: var(--error)} .was-validated .form-select:invalid:not([multiple]):not([size]), .was-validated .form-select:invalid:not([multiple])[size="1"], .form-select.is-invalid:not([multiple]):not([size]), .form-select.is-invalid:not([multiple])[size="1"] { padding-right: 5.5rem; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23565973' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"), url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23ef4444'%3e%3cpath d='M7.643 13.535L10 11.178l2.357 2.357 1.178-1.178L11.178 10l2.357-2.357-1.178-1.178L10 8.822 7.643 6.465 6.465 7.643 8.822 10l-2.357 2.357 1.178 1.178zM10 18.333c4.595 0 8.333-3.738 8.333-8.333S14.595 1.667 10 1.667 1.667 5.405 1.667 10 5.405 18.333 10 18.333zm0-15c3.676 0 6.667 2.991 6.667 6.667S13.676 16.667 10 16.667 3.333 13.676 3.333 10 6.324 3.333 10 3.333z'/%3e%3c/svg%3e"); background-position: right 1rem center, center right 3rem; background-size: 16px 12px, calc(0.8em + 0.625rem) calc(0.8em + 0.625rem); } .was-validated .form-select:invalid:focus, .form-select.is-invalid:focus {--opacity: .25;border-color: var(--error);box-shadow: inset 0 0 0 rgba(var(--error-rgb), 0), 0 .5rem 1.125rem -0.5rem rgba(var(--error-rgb), var(--opacity));} .was-validated .form-control-color:invalid,.form-control-color.is-invalid {width: calc(3rem + calc(1.6em + 1.25rem));} .was-validated .form-check-input:invalid,.form-check-input.is-invalid {border-color: var(--error);} .was-validated .form-check-input:invalid:checked,.form-check-input.is-invalid:checked {background-color: var(--error);} .was-validated .form-check-input:invalid:focus,.form-check-input.is-invalid:focus {--opacity: .25;box-shadow: inset 0 0 0 rgba(var(--error-rgb), 0), 0 .5rem 1.125rem -0.5rem rgba(var(--error-rgb), var(--opacity));} .was-validated .form-check-input:invalid~.form-check-label, .form-check-input.is-invalid~.form-check-label {color: var(--error);} .form-check-inline .form-check-input~.invalid-feedback {margin-left: .5em;} /* Modal */ .fade {transition: opacity .15s linear;} .fade:not(.show) {opacity: 0;} .btn-close {box-sizing: content-box;width: .75em;height: .75em;padding: .25em .25em;color: var(--black);background: rgba(var(--black-rgb), 0) url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center/0.75em auto no-repeat;border: 0;border-radius: .375rem;opacity: .5;transition: opacity .25s ease-in-out;} .collapse:not(.show) {display: none;} .modal { --mo-modal-zindex: 1055; --mo-modal-width: 500px; --mo-modal-padding: 1.5rem; --mo-modal-margin: 0.5rem; --mo-modal-color: ; --mo-modal-bg: #fff; --mo-modal-border-color: var(--mo-border-color-translucent); --mo-modal-border-width: 0; --mo-modal-border-radius: 0.5rem; --mo-modal-box-shadow: 0 0.275rem 1.25rem rgba(11, 15, 25, 0.05), 0 0.25rem 0.5625rem rgba(11, 15, 25, 0.03); --mo-modal-inner-border-radius: 0.5rem; --mo-modal-header-padding-x: 1.5rem; --mo-modal-header-padding-y: 1.125rem; --mo-modal-header-padding: 1.125rem 1.5rem; --mo-modal-header-border-color: #e2e5f1; --mo-modal-header-border-width: 0.1rem; --mo-modal-title-line-height: 1.6; --mo-modal-footer-gap: 0.75rem; --mo-modal-footer-bg: ; --mo-modal-footer-border-color: #e2e5f1; --mo-modal-footer-border-width: 0.1rem; position: fixed; top: 0; left: 0; z-index: var(--mo-modal-zindex); display: none; width: 100%; height: 100%; overflow-x: hidden; overflow-y: auto; outline: 0 } .modal-dialog {position: relative;width: auto;margin: var(--mo-modal-margin);pointer-events: none} .modal.fade .modal-dialog {transition: transform .2s ease-out;transform: scale(0.9)} @media(prefers-reduced-motion: reduce) { .modal.fade .modal-dialog {transition: none} } .modal.show .modal-dialog {transform: none} .modal.modal-static .modal-dialog {transform: scale(1.02)} .modal-dialog-scrollable {height: calc(100% - var(--mo-modal-margin)*2)} .modal-dialog-scrollable .modal-content {max-height: 100%;overflow: hidden} .modal-dialog-scrollable .modal-body {overflow-y: auto} .modal-dialog-centered {display: flex;align-items: center;min-height: calc(100% - var(--mo-modal-margin)*2)} .modal-content { position: relative; display: flex; flex-direction: column; width: 100%; color: var(--mo-modal-color); pointer-events: auto; background-color: var(--mo-modal-bg); background-clip: padding-box; border: var(--mo-modal-border-width) solid var(--mo-modal-border-color); border-radius: var(--mo-modal-border-radius); box-shadow: var(--mo-modal-box-shadow); outline: 0 } .modal-backdrop { --mo-backdrop-zindex: 1050; --mo-backdrop-bg: #000; --mo-backdrop-opacity: 0.65; position: fixed; top: 0; left: 0; z-index: var(--mo-backdrop-zindex); width: 100vw; height: 100vh; background-color: var(--mo-backdrop-bg) } .modal-backdrop.fade {opacity: 0} .modal-backdrop.show {opacity: var(--mo-backdrop-opacity)} .modal-header { display: flex; flex-shrink: 0; align-items: center; justify-content: space-between; padding: var(--mo-modal-header-padding); border-bottom: var(--mo-modal-header-border-width) solid var(--mo-modal-header-border-color); border-top-left-radius: var(--mo-modal-inner-border-radius); border-top-right-radius: var(--mo-modal-inner-border-radius) } .modal-header img {margin: 0 0.25rem 0 0;} .modal-header .btn-close { padding: calc(var(--mo-modal-header-padding-y)*.5) calc(var(--mo-modal-header-padding-x)*.5); margin: calc(-.5*var(--mo-modal-header-padding-y)) calc(-.5*var(--mo-modal-header-padding-x)) calc(-.5*var(--mo-modal-header-padding-y)) auto; } .modal-title {margin-bottom: 0;line-height: var(--mo-modal-title-line-height)} .modal-body {position: relative;flex: 1 1 auto;padding: var(--mo-modal-padding)} .modal-footer { display: flex; flex-shrink: 0; flex-wrap: wrap; align-items: center; justify-content: flex-end; padding: calc(var(--mo-modal-padding) - var(--mo-modal-footer-gap)*.5); background-color: var(--mo-modal-footer-bg); border-top: var(--mo-modal-footer-border-width) solid var(--mo-modal-footer-border-color); border-bottom-right-radius: var(--mo-modal-inner-border-radius); border-bottom-left-radius: var(--mo-modal-inner-border-radius) } .modal-footer>* {margin: calc(var(--mo-modal-footer-gap)*.5)} @media(min-width: 500px) { .modal { --mo-modal-margin: 1.75rem; --mo-modal-box-shadow: 0 0.275rem 1.25rem rgba(11, 15, 25, 0.05), 0 0.25rem 0.5625rem rgba(11, 15, 25, 0.03) } .modal-dialog {max-width: var(--mo-modal-width);margin-right: auto;margin-left: auto} .modal-sm {--mo-modal-width: 300px} } @media(min-width: 992px) { .modal-lg, .modal-xl {--mo-modal-width: 800px} } @media(min-width: 1200px) { .modal-xl {--mo-modal-width: 1140px} } .modal-fullscreen {width: 100vw;max-width: none;height: 100%;margin: 0} .modal-fullscreen .modal-content {height: 100%;border: 0;border-radius: 0} .modal-fullscreen .modal-header, .modal-fullscreen .modal-footer {border-radius: 0} .modal-fullscreen .modal-body {overflow-y: auto} @media(max-width: 499.98px) { .modal-fullscreen-sm-down {width: 100vw;max-width: none;height: 100%;margin: 0} .modal-fullscreen-sm-down .modal-content {height: 100%;border: 0;border-radius: 0} .modal-fullscreen-sm-down .modal-header, .modal-fullscreen-sm-down .modal-footer {border-radius: 0} .modal-fullscreen-sm-down .modal-body {overflow-y: auto} } @media(max-width: 767.98px) { .modal-fullscreen-md-down {width: 100vw;max-width: none;height: 100%;margin: 0} .modal-fullscreen-md-down .modal-content {height: 100%;border: 0;border-radius: 0} .modal-fullscreen-md-down .modal-header, .modal-fullscreen-md-down .modal-footer {border-radius: 0} .modal-fullscreen-md-down .modal-body {overflow-y: auto} } @media(max-width: 991.98px) { .modal-fullscreen-lg-down {width: 100vw;max-width: none;height: 100%;margin: 0} .modal-fullscreen-lg-down .modal-content {height: 100%;border: 0;border-radius: 0} .modal-fullscreen-lg-down .modal-header, .modal-fullscreen-lg-down .modal-footer {border-radius: 0} .modal-fullscreen-lg-down .modal-body {overflow-y: auto} } @media(max-width: 1199.98px) { .modal-fullscreen-xl-down {width: 100vw;max-width: none;height: 100%;margin: 0} .modal-fullscreen-xl-down .modal-content {height: 100%;border: 0;border-radius: 0} .modal-fullscreen-xl-down .modal-header, .modal-fullscreen-xl-down .modal-footer {border-radius: 0} .modal-fullscreen-xl-down .modal-body {overflow-y: auto} } @media(max-width: 1399.98px) { .modal-fullscreen-xxl-down {width: 100vw;max-width: none;height: 100%;margin: 0} .modal-fullscreen-xxl-down .modal-content {height: 100%;border: 0;border-radius: 0} .modal-fullscreen-xxl-down .modal-header, .modal-fullscreen-xxl-down .modal-footer {border-radius: 0} .modal-fullscreen-xxl-down .modal-body {overflow-y: auto} } /* Réseaux sociaux */ .social-sharing a {width: 2.5rem;height: 2.5rem;background-size: contain;background-position: center; background-repeat: no-repeat;} .social-sharing a.facebook {background-image: url(../img/facebook.svg);} .social-sharing a.twitter {background-image: url(../img/x-social.svg);} .social-sharing a.pinterest {background-image: url(../img/pinterest.svg);} .social-sharing a.linkedin {background-image: url(../img/linkedin.svg);} .social-sharing a.instagram {background-image: url(../img/instagram.svg);} /* Appliquer si svg-white présent */ .social-sharing.svg-white a {filter: invert(100%);} /* Animations */ @keyframes fade-fromleft { 0% { opacity:0; -webkit-transform:translate(-5em); -moz-transform:translate(-5em); -ms-transform:translate(-5em); -o-transform:translate(-5em); transform:translate(-5em) } 100% { opacity:1; -webkit-transform:translate(0); -moz-transform:translate(0); -ms-transform:translate(0); -o-transform:translate(0); transform:translate(0) } } @-webkit-keyframes fade-fromleft { 0% { opacity:0; -webkit-transform:translate(-5em); -moz-transform:translate(-5em); -ms-transform:translate(-5em); -o-transform:translate(-5em); transform:translate(-5em) } 100% { opacity:1; -webkit-transform:translate(0); -moz-transform:translate(0); -ms-transform:translate(0); -o-transform:translate(0); transform:translate(0) } } @keyframes fade-fromright { 0% { opacity:0; -webkit-transform:translate(5em); -moz-transform:translate(5em); -ms-transform:translate(5em); -o-transform:translate(5em); transform:translate(5em) } 100% { opacity:1; -webkit-transform:translate(0); -moz-transform:translate(0); -ms-transform:translate(0); -o-transform:translate(0); transform:translate(0) } } @-webkit-keyframes fade-fromright { 0% { opacity:0; -webkit-transform:translate(5em); -moz-transform:translate(5em); -ms-transform:translate(5em); -o-transform:translate(5em); transform:translate(5em) } 100% { opacity:1; -webkit-transform:translate(0); -moz-transform:translate(0); -ms-transform:translate(0); -o-transform:translate(0); transform:translate(0) } } @keyframes fade-fromtop { 0% { opacity:0; -webkit-transform:translateY(-5em); -moz-transform:translateY(-5em); -ms-transform:translateY(-5em); -o-transform:translateY(-5em); transform:translateY(-5em) } 100% { opacity:1; -webkit-transform:translateY(0); -moz-transform:translateY(0); -ms-transform:translateY(0); -o-transform:translateY(0); transform:translateY(0) } } @-webkit-keyframes fade-fromtop { 0% { opacity:0; -webkit-transform:translateY(-5em); -moz-transform:translateY(-5em); -ms-transform:translateY(-5em); -o-transform:translateY(-5em); transform:translateY(-5em) } 100% { opacity:1; -webkit-transform:translateY(0); -moz-transform:translateY(0); -ms-transform:translateY(0); -o-transform:translateY(0); transform:translateY(0) } } @keyframes fade-frombot { 0% { opacity:0; -webkit-transform:translateY(5em); -moz-transform:translateY(5em); -ms-transform:translateY(5em); -o-transform:translateY(5em); transform:translateY(5em) } 100% { opacity:1; -webkit-transform:translateY(0); -moz-transform:translateY(0); -ms-transform:translateY(0); -o-transform:translateY(0); transform:translateY(0) } } @-webkit-keyframes fade-frombot { 0% { opacity:0; -webkit-transform:translateY(5em); -moz-transform:translateY(5em); -ms-transform:translateY(5em); -o-transform:translateY(5em); transform:translateY(5em) } 100% { opacity:1; -webkit-transform:translateY(0); -moz-transform:translateY(0); -ms-transform:translateY(0); -o-transform:translateY(0); transform:translateY(0) } } @keyframes translate-fromtop { 0% { -webkit-transform:translateY(-5em); -moz-transform:translateY(-5em); -ms-transform:translateY(-5em); -o-transform:translateY(-5em); transform:translateY(-5em) } 100% { -webkit-transform:translateY(0); -moz-transform:translateY(0); -ms-transform:translateY(0); -o-transform:translateY(0); transform:translateY(0) } } @-webkit-keyframes translate-fromtop { 0% { -webkit-transform:translateY(-5em); -moz-transform:translateY(-5em); -ms-transform:translateY(-5em); -o-transform:translateY(-5em); transform:translateY(-5em) } 100% { -webkit-transform:translateY(0); -moz-transform:translateY(0); -ms-transform:translateY(0); -o-transform:translateY(0); transform:translateY(0) } } @keyframes translate-frombot { 0% { -webkit-transform:translateY(5em); -moz-transform:translateY(5em); -ms-transform:translateY(5em); -o-transform:translateY(5em); transform:translateY(5em) } 100% { -webkit-transform:translateY(0); -moz-transform:translateY(0); -ms-transform:translateY(0); -o-transform:translateY(0); transform:translateY(0) } } @-webkit-keyframes translate-frombot { 0% { -webkit-transform:translateY(5em); -moz-transform:translateY(5em); -ms-transform:translateY(5em); -o-transform:translateY(5em); transform:translateY(5em) } 100% { -webkit-transform:translateY(0); -moz-transform:translateY(0); -ms-transform:translateY(0); -o-transform:translateY(0); transform:translateY(0) } } @keyframes translate-fromright { 0% { -webkit-transform:translate(5em); -moz-transform:translate(5em); -ms-transform:translate(5em); -o-transform:translate(5em); transform:translate(5em) } 100% { -webkit-transform:translate(0); -moz-transform:translate(0); -ms-transform:translate(0); -o-transform:translate(0); transform:translate(0) } } @-webkit-keyframes translate-fromright { 0% { -webkit-transform:translate(5em); -moz-transform:translate(5em); -ms-transform:translate(5em); -o-transform:translate(5em); transform:translate(5em) } 100% { -webkit-transform:translate(0); -moz-transform:translate(0); -ms-transform:translate(0); -o-transform:translate(0); transform:translate(0) } } @keyframes translate-menu { 0% { transform:translate(0); -webkit-transform:translate(0) } 100% { transform:translate(calc(-100vw + 6em)); -webkit-transform:translate(-webkit-calc(-100vw + 6em)) } } @keyframes translate-menu-reverse { 0% { transform:translate(calc(-100vw + 6em)); -webkit-transform:translate(-webkit-calc(-100vw + 6em)) } 100% { transform:translate(0); -webkit-transform:translate(0) } } @-webkit-keyframes translate-menu { 0% { transform:translate(0); -webkit-transform:translate(0) } 100% { transform:translate(calc(-100vw + 6em)); -webkit-transform:translate(-webkit-calc(-100vw + 6em)) } } @-webkit-keyframes translate-menu-reverse { 0% { transform:translate(calc(-100vw + 6em)); -webkit-transform:translate(-webkit-calc(-100vw + 6em)) } 100% { transform:translate(0); -webkit-transform:translate(0) } } @keyframes letter-clock { 0% { clip-path:polygon(50% 50%,125% 50%,125% 50%,125% 50%,125% 50%,125% 50%,125% 50%,125% 50%,125% 50%,125% 50%) } 12.5% { clip-path:polygon(50% 50%,125% 50%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%) } 25% { clip-path:polygon(50% 50%,125% 50%,100% 100%,50% 125%,50% 125%,50% 125%,50% 125%,50% 125%,50% 125%,50% 125%) } 37.5% { clip-path:polygon(50% 50%,125% 50%,100% 100%,50% 125%,0% 100%,0% 100%,0% 100%,0% 100%,0% 100%,0% 100%) } 50% { clip-path:polygon(50% 50%,125% 50%,100% 100%,50% 125%,0% 100%,-25% 50%,-25% 50%,-25% 50%,-25% 50%,-25% 50%) } 62.5% { clip-path:polygon(50% 50%,125% 50%,100% 100%,50% 125%,0% 100%,-25% 50%,0% 0%,0% 0%,0% 0%,0% 0%) } 75% { clip-path:polygon(50% 50%,125% 50%,100% 100%,50% 125%,0% 100%,-25% 50%,0% 0%,50% -25%,50% -25%,50% -25%) } 87.5% { clip-path:polygon(50% 50%,125% 50%,100% 100%,50% 125%,0% 100%,-25% 50%,0% 0%,50% -25%,100% 0%,100% 0%) } 100% { clip-path:polygon(50% 50%,125% 50%,100% 100%,50% 125%,0% 100%,-25% 50%,0% 0%,50% -25%,100% 0%,125% 50%) } } @-webkit-keyframes letter-clock { 0% { -webkit-clip-path:polygon(50% 50%,125% 50%,125% 50%,125% 50%,125% 50%,125% 50%,125% 50%,125% 50%,125% 50%,125% 50%) } 12.5% { -webkit-clip-path:polygon(50% 50%,125% 50%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%) } 25% { -webkit-clip-path:polygon(50% 50%,125% 50%,100% 100%,50% 125%,50% 125%,50% 125%,50% 125%,50% 125%,50% 125%,50% 125%) } 37.5% { -webkit-clip-path:polygon(50% 50%,125% 50%,100% 100%,50% 125%,0% 100%,0% 100%,0% 100%,0% 100%,0% 100%,0% 100%) } 50% { -webkit-clip-path:polygon(50% 50%,125% 50%,100% 100%,50% 125%,0% 100%,-25% 50%,-25% 50%,-25% 50%,-25% 50%,-25% 50%) } 62.5% { -webkit-clip-path:polygon(50% 50%,125% 50%,100% 100%,50% 125%,0% 100%,-25% 50%,0% 0%,0% 0%,0% 0%,0% 0%) } 75% { -webkit-clip-path:polygon(50% 50%,125% 50%,100% 100%,50% 125%,0% 100%,-25% 50%,0% 0%,50% -25%,50% -25%,50% -25%) } 87.5% { -webkit-clip-path:polygon(50% 50%,125% 50%,100% 100%,50% 125%,0% 100%,-25% 50%,0% 0%,50% -25%,100% 0%,100% 0%) } 100% { -webkit-clip-path:polygon(50% 50%,125% 50%,100% 100%,50% 125%,0% 100%,-25% 50%,0% 0%,50% -25%,100% 0%,125% 50%) } } @keyframes letter-clock-invert { 0% { clip-path:polygon(50% 50%,-25% 50%,-25% 50%,-25% 50%,-25% 50%,-25% 50%,-25% 50%,-25% 50%,-25% 50%,-25% 50%) } 12.5% { clip-path:polygon(50% 50%,-25% 50%,0% 100%,0% 100%,0% 100%,0% 100%,0% 100%,0% 100%,0% 100%,0% 100%) } 25% { clip-path:polygon(50% 50%,-25% 50%,0% 100%,50% 125%,50% 125%,50% 125%,50% 125%,50% 125%,50% 125%,50% 125%) } 37.5% { clip-path:polygon(50% 50%,-25% 50%,0% 100%,50% 125%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%) } 50% { clip-path:polygon(50% 50%,-25% 50%,0% 100%,50% 125%,100% 100%,125% 50%,125% 50%,125% 50%,125% 50%,125% 50%) } 62.5% { clip-path:polygon(50% 50%,-25% 50%,0% 100%,50% 125%,100% 100%,125% 50%,100% 0%,100% 0%,100% 0%,100% 0%) } 75% { clip-path:polygon(50% 50%,-25% 50%,0% 100%,50% 125%,100% 100%,125% 50%,100% 0%,50% -25%,50% -25%,50% -25%) } 87.5% { clip-path:polygon(50% 50%,-25% 50%,0% 100%,50% 125%,100% 100%,125% 50%,100% 0%,50% -25%,0% 0%,0% 0%) } 100% { clip-path:polygon(50% 50%,-25% 50%,0% 100%,50% 125%,100% 100%,125% 50%,100% 0%,50% -25%,0% 0%,-25% 50%) } } @-webkit-keyframes letter-clock-invert { 0% { clip-path:polygon(50% 50%,-25% 50%,-25% 50%,-25% 50%,-25% 50%,-25% 50%,-25% 50%,-25% 50%,-25% 50%,-25% 50%) } 12.5% { clip-path:polygon(50% 50%,-25% 50%,0% 100%,0% 100%,0% 100%,0% 100%,0% 100%,0% 100%,0% 100%,0% 100%) } 25% { clip-path:polygon(50% 50%,-25% 50%,0% 100%,50% 125%,50% 125%,50% 125%,50% 125%,50% 125%,50% 125%,50% 125%) } 37.5% { clip-path:polygon(50% 50%,-25% 50%,0% 100%,50% 125%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%) } 50% { clip-path:polygon(50% 50%,-25% 50%,0% 100%,50% 125%,100% 100%,125% 50%,125% 50%,125% 50%,125% 50%,125% 50%) } 62.5% { clip-path:polygon(50% 50%,-25% 50%,0% 100%,50% 125%,100% 100%,125% 50%,100% 0%,100% 0%,100% 0%,100% 0%) } 75% { clip-path:polygon(50% 50%,-25% 50%,0% 100%,50% 125%,100% 100%,125% 50%,100% 0%,50% -25%,50% -25%,50% -25%) } 87.5% { clip-path:polygon(50% 50%,-25% 50%,0% 100%,50% 125%,100% 100%,125% 50%,100% 0%,50% -25%,0% 0%,0% 0%) } 100% { clip-path:polygon(50% 50%,-25% 50%,0% 100%,50% 125%,100% 100%,125% 50%,100% 0%,50% -25%,0% 0%,-25% 50%) } } @keyframes scalefocus { 0% { -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); transform:scale(1) } 50% { -webkit-transform:scale(1.2); -moz-transform:scale(1.2); -ms-transform:scale(1.2); transform:scale(1.2) } 100% { -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); transform:scale(1) } } @-webkit-keyframes scalefocus { 0% { -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); transform:scale(1) } 50% { -webkit-transform:scale(1.2); -moz-transform:scale(1.2); -ms-transform:scale(1.2); transform:scale(1.2) } 100% { -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); transform:scale(1) } } @keyframes scale-in { 0% { -webkit-transform:scale(0); -moz-transform:scale(0); -ms-transform:scale(0); transform:scale(0) } 100% { -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); transform:scale(1) } } @-webkit-keyframes scale-in { 0% { -webkit-transform:scale(0) } 100% { -webkit-transform:scale(1) } } @keyframes window-fromleft { 0% { clip-path:polygon(0% 0%,0% 100%,0% 100%,0% 0%); -webkit-clip-path:polygon(0% 0%,0% 100%,0% 100%,0% 0%) } 100% { clip-path:polygon(0% 0%,0% 100%,100% 100%,100% 0%); -webkit-clip-path:polygon(0% 0%,0% 100%,100% 100%,100% 0%) } } @-webkit-keyframes window-fromleft { 0% { clip-path:polygon(0% 0%,0% 100%,0% 100%,0% 0%); -webkit-clip-path:polygon(0% 0%,0% 100%,0% 100%,0% 0%) } 100% { clip-path:polygon(0% 0%,0% 100%,100% 100%,100% 0%); -webkit-clip-path:polygon(0% 0%,0% 100%,100% 100%,100% 0%) } } @keyframes window-fromright { 0% { clip-path:polygon(100% 0%,100% 100%,100% 100%,100% 0%); -webkit-clip-path:polygon(100% 0%,100% 100%,100% 100%,100% 0%) } 100% { clip-path:polygon(100% 0%,100% 100%,0% 100%,0% 0%); -webkit-clip-path:polygon(100% 0%,100% 100%,0% 100%,0% 0%) } } @-webkit-keyframes window-fromright { 0% { clip-path:polygon(100% 0%,100% 100%,100% 100%,100% 0%); -webkit-clip-path:polygon(100% 0%,100% 100%,100% 100%,100% 0%) } 100% { clip-path:polygon(100% 0%,100% 100%,0% 100%,0% 0%); -webkit-clip-path:polygon(100% 0%,100% 100%,0% 100%,0% 0%) } } @keyframes window-frombot { 0% { clip-path:polygon(0% 100%,100% 100%,100% 100%,0% 100%); -webkit-clip-path:polygon(0% 100%,100% 100%,100% 100%,0% 100%) } 100% { clip-path:polygon(0% 100%,100% 100%,100% 0%,0% 0%); -webkit-clip-path:polygon(0% 100%,100% 100%,100% 0%,0% 0%) } } @-webkit-keyframes window-frombot { 0% { clip-path:polygon(0% 100%,100% 100%,100% 100%,0% 100%); -webkit-clip-path:polygon(0% 100%,100% 100%,100% 100%,0% 100%) } 100% { clip-path:polygon(0% 100%,100% 100%,100% 0%,0% 0%); -webkit-clip-path:polygon(0% 100%,100% 100%,100% 0%,0% 0%) } } @keyframes window-fromtop { 0% { clip-path:polygon(0% 0%,100% 0%,100% 0%,0% 0%); -webkit-clip-path:polygon(0% 0%,100% 0%,100% 0%,0% 0%) } 100% { clip-path:polygon(0% 0%,100% 0%,100% 100%,0% 100%); -webkit-clip-path:polygon(0% 0%,100% 0%,100% 100%,0% 100%) } } @-webkit-keyframes window-fromtop { 0% { clip-path:polygon(0% 0%,100% 0%,100% 0%,0% 0%); -webkit-clip-path:polygon(0% 0%,100% 0%,100% 0%,0% 0%) } 100% { clip-path:polygon(0% 0%,100% 0%,100% 100%,0% 100%); -webkit-clip-path:polygon(0% 0%,100% 0%,100% 100%,0% 100%) } } @keyframes label-window-fromleft { 0% { clip-path:polygon(0% 0%,0% 100%,0% 100%,0% 0%); -webkit-clip-path:polygon(0% 0%,0% 100%,0% 100%,0% 0%); color:rgba(255,255,255,0) } 50% { clip-path:polygon(0% 0%,0% 100%,100% 100%,100% 0%); -webkit-clip-path:polygon(0% 0%,0% 100%,100% 100%,100% 0%); color:rgba(255,255,255,0) } 100% { clip-path:polygon(0% 0%,0% 100%,100% 100%,100% 0%); -webkit-clip-path:polygon(0% 0%,0% 100%,100% 100%,100% 0%); color:rgba(255,255,255,1) } } @-webkit-keyframes label-window-fromleft { 0% { clip-path:polygon(0% 0%,0% 100%,0% 100%,0% 0%); -webkit-clip-path:polygon(0% 0%,0% 100%,0% 100%,0% 0%); color:rgba(255,255,255,0) } 50% { clip-path:polygon(0% 0%,0% 100%,100% 100%,100% 0%); -webkit-clip-path:polygon(0% 0%,0% 100%,100% 100%,100% 0%); color:rgba(255,255,255,0) } 100% { clip-path:polygon(0% 0%,0% 100%,100% 100%,100% 0%); -webkit-clip-path:polygon(0% 0%,0% 100%,100% 100%,100% 0%); color:rgba(255,255,255,1) } } @keyframes circle-fromcenter { 0% { clip-path:circle(0%); -webkit-clip-path:circle(0%) } 100% { clip-path:circle(50%); -webkit-clip-path:circle(50%) } } @-webkit-keyframes circle-fromcenter { 0% { clip-path:circle(0%); -webkit-clip-path:circle(0%) } 100% { clip-path:circle(50%); -webkit-clip-path:circle(50%) } } @keyframes circle-fromcenter-over { 0% { clip-path:circle(0%); -webkit-clip-path:circle(0%) } 100% { clip-path:circle(115%); -webkit-clip-path:circle(115%) } } @-webkit-keyframes circle-fromcenter-over { 0% { clip-path:circle(0%); -webkit-clip-path:circle(0%) } 100% { clip-path:circle(115%); -webkit-clip-path:circle(115%) } } @keyframes circle-frombot-over { 0% { clip-path:circle(0% at 50% 100%); -webkit-clip-path:circle(0% at 50% 100%) } 100% { clip-path:circle(115% at 50% 100%); -webkit-clip-path:circle(115% at 50% 100%) } } @-webkit-keyframes circle-frombot-over { 0% { clip-path:circle(0% at 50% 100%); -webkit-clip-path:circle(0% at 50% 100%) } 100% { clip-path:circle(115% at 50% 100%); -webkit-clip-path:circle(115% at 50% 100%) } } @keyframes fade-in { 0% { opacity:0 } 100% { opacity:1 } } @-webkit-keyframes fade-in { 0% { opacity:0 } 100% { opacity:1 } } @keyframes fade-out { 0% { opacity:1 } 100% { opacity:0 } } @-webkit-keyframes fade-out { 0% { opacity:1 } 100% { opacity:0 } } @keyframes blur { 0% { filter:blur(0); -webkit-filter:blur(0) } 100% { filter:blur(10px); -webkit-filter:blur(10px) } } @-webkit-keyframes blur { 0% { filter:blur(0); -webkit-filter:blur(0) } 100% { filter:blur(10px); -webkit-filter:blur(10px) } } @keyframes blur-out { 0% { filter:blur(10px); -webkit-filter:blur(10px) } 100% { filter:blur(0); -webkit-filter:blur(0) } } @-webkit-keyframes blur-out { 0% { filter:blur(10px); -webkit-filter:blur(10px) } 100% { filter:blur(0); -webkit-filter:blur(0) } } @keyframes menu-circle-big { 0% { width:0; height:0; margin-left:0; margin-top:0; opacity:0 } 25% { opacity:1 } 100% { width:200vh; height:200vh; margin-left:-100vh; margin-top:-100vh; opacity:0 } } @-webkit-keyframes menu-circle-big { 0% { width:0; height:0; margin-left:0; margin-top:0; opacity:0 } 25% { opacity:1 } 100% { width:200vh; height:200vh; margin-left:-100vh; margin-top:-100vh; opacity:0 } } @keyframes menu-circle-small { 0% { width:0; height:0; margin-left:0; margin-top:0; opacity:0 } 25% { opacity:1 } 100% { width:5em; height:5em; margin-left:-2.5em; margin-top:-2.5em; opacity:1 } } @-webkit-keyframes menu-circle-small { 0% { width:0; height:0; margin-left:0; margin-top:0; opacity:0 } 25% { opacity:1 } 100% { width:5em; height:5em; margin-left:-2.5em; margin-top:-2.5em; opacity:1 } } @keyframes cta-fromleft { 0% { height:0%; opacity:0; width:0; margin-top:0; margin-left:0 } 25% { opacity:1 } 50% { height:100%; width:2.75em; margin-top:-1.375em; margin-left:-1.375em } 100% { height:100%; opacity:1; width:100%; margin-top:-1.375em; margin-left:-1.375em } } @-webkit-keyframes cta-fromleft { 0% { height:0%; opacity:0; width:0; margin-top:0; margin-left:0 } 25% { opacity:1 } 50% { height:100%; width:2.75em; margin-top:-1.375em; margin-left:-1.375em } 100% { height:100%; opacity:1; width:100%; margin-top:-1.375em; margin-left:-1.375em } } @keyframes cta-fromcenter { 0% { height:0%; opacity:0; width:0; margin-top:0; margin-left:0; left:50% } 25% { opacity:1 } 50% { height:100%; width:2.75em; margin-top:-1.375em; margin-left:-1.375em; left:50% } 100% { height:100%; opacity:1; width:100%; margin-top:-1.375em; margin-left:-1.375em; left:1.375em } } @-webkit-keyframes cta-fromcenter { 0% { height:0%; opacity:0; width:0; margin-top:0; margin-left:0; left:50% } 25% { opacity:1 } 50% { height:100%; width:2.75em; margin-top:-1.375em; margin-left:-1.375em; left:50% } 100% { height:100%; opacity:1; width:100%; margin-top:-1.375em; margin-left:-1.375em; left:1.375em } } @keyframes cta-fromleft-big { 0% { height:0%; opacity:0; width:0; margin-top:0; margin-left:0 } 25% { opacity:1 } 50% { height:100%; width:3.375em; margin-top:-1.6875em; margin-left:-1.6875em } 100% { height:100%; opacity:1; width:100%; margin-top:-1.6875em; margin-left:-1.6875em } } @-webkit-keyframes cta-fromleft-big { 0% { height:0%; opacity:0; width:0; margin-top:0; margin-left:0 } 25% { opacity:1 } 50% { height:100%; width:3.375em; margin-top:-1.6875em; margin-left:-1.6875em } 100% { height:100%; opacity:1; width:100%; margin-top:-1.6875em; margin-left:-1.6875em } } @keyframes cta-fromcenter-big { 0% { height:0%; opacity:0; width:0; margin-top:0; margin-left:0; left:50% } 25% { opacity:1 } 50% { height:100%; width:3.375em; margin-top:-1.6875em; margin-left:-1.6875em; left:50% } 100% { height:100%; opacity:1; width:100%; margin-top:-1.6875em; margin-left:-1.6875em; left:1.6875em } } @-webkit-keyframes cta-fromcenter-big { 0% { height:0%; opacity:0; width:0; margin-top:0; margin-left:0; left:50% } 25% { opacity:1 } 50% { height:100%; width:3.375em; margin-top:-1 6875em; margin-left:-1 6875em; left:50% } 100% { height:100%; opacity:1; width:100%; margin-top:-1.6875em; margin-left:-1.6875em; left:1.6875em } } @keyframes panel-fromcenter { 0% { height:0%; opacity:0; width:0; margin-top:1.375em; margin-left:0; left:50% } 33% { height:2.75em; opacity:1; width:2.75em; margin-top:0; margin-left:-1.375em; left:50% } 66% { height:2.75em; width:100%; margin-left:-1.375em; left:1.375em } 100% { height:100%; opacity:1 } } @-webkit-keyframes panel-fromcenter { 0% { height:0%; opacity:0; width:0; margin-top:1.375em; margin-left:0; left:50% } 33% { height:2.75em; opacity:1; width:2.75em; margin-top:0; margin-left:-1.375em; left:50% } 66% { height:2.75em; width:100%; margin-left:-1.375em; left:1.375em } 100% { height:100%; opacity:1 } } @keyframes number-scale-in { 0% { opacity:0; width:0; height:0; margin-top:0; margin-left:0 } 25% { opacity:1 } 100% { opacity:1; width:3.5em; height:3.5em; margin-top:-1.75em; margin-left:-1.75em } } @-webkit-keyframes number-scale-in { 0% { opacity:0; width:0; height:0; margin-top:0; margin-left:0 } 25% { opacity:1 } 100% { opacity:1; width:3.5em; height:3.5em; margin-top:-1.75em; margin-left:-1.75em } } @keyframes number-large-scale-in { 0% { opacity:0; width:0; height:0; margin-top:0; margin-left:0 } 25% { opacity:1 } 50% { width:4em; height:4em; margin-top:-2em; margin-left:-2em } 100% { opacity:1; width:9em; height:4em; margin-top:-2em; margin-left:-4.5em } } @-webkit-keyframes number-large-scale-in { 0% { opacity:0; width:0; height:0; margin-top:0; margin-left:0 } 25% { opacity:1 } 50% { width:4em; height:4em; margin-top:-2em; margin-left:-2em } 100% { opacity:1; width:9em; height:4em; margin-top:-2em; margin-left:-4.5em } } @keyframes smooth-float { 0% { transform:translateY(0); -webkit-transform:translateY(0) } 50% { transform:translateY(1em); -webkit-transform:translateY(1em) } 100% { transform:translateY(0); -webkit-transform:translateY(0) } } @-webkit-keyframes smooth-float { 0% { transform:translateY(0); -webkit-transform:translateY(0) } 50% { transform:translateY(1em); -webkit-transform:translateY(1em) } 100% { transform:translateY(0); -webkit-transform:translateY(0) } } /* Les classes des animations */ /* .anim-wfl::before {opacity: 0;} .anim-wfl {opacity: 1 !important;animation: 1s ease-in-out 0s window-fromleft both;-webkit-animation: 1s ease-in-out 0s window-fromleft both;} .anim-wfr::before {opacity: 0;} .anim-wfr {opacity: 1 !important;animation: 1s ease-in-out 0s window-fromright both;-webkit-animation: 1s ease-in-out 0s window-fromright both;} */