/*Reset css*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}

body {
    line-height: 1;
}

ol, ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

a {
    text-decoration: none;
    color: #000;
}

* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
body.ar .meganav,
body.ar #productpage,
body.ar .catalog .headband,
body.ar .catalog .contentlist,
.directionrtl{
    direction:rtl;
}

/********************/
/*  RESET CSS FORM  */
/********************/
input, label, select, button, textarea {
    margin: 0;
    border: 0;
    padding: 0;
    display: inline-block;
    vertical-align: middle;
    white-space: normal;
    background: none;
    line-height: 1;
    font-size: 14px;
}

input:focus {
    outline: 0;
}

input, textarea {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

button, input[type=reset], input[type=button], input[type=submit], input[type=checkbox], input[type=radio], select {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

input[type=date], input[type=datetime], input[type=datetime-local], input[type=email], input[type=month], input[type=number], input[type=password], input[type=range], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week] {
}

input[type=checkbox], input[type=radio] {
    width: 13px;
    height: 13px;
}
input[type=checkbox]{
    width: 18px;
    height: 18px;
}
input[type=file] {
}

input[type=search] {
    -webkit-appearance: textfield;
    -webkit-box-sizing: content-box;
}

::-webkit-search-decoration {
    display: none;
}

button, input[type="reset"], input[type="button"], input[type="submit"] {
    overflow: visible;
    width: auto;
}

::-webkit-file-upload-button {
    padding: 0;
    border: 0;
    background: none;
}

textarea {
    vertical-align: top;
    overflow: auto;
}

select {
}

select[multiple] {
    vertical-align: top;
}

/********************/
/*     BXSLIDER     */
/********************/
.bx-wrapper {
    position: relative;
    margin-bottom: 60px;
    padding: 0;
    *zoom: 1;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
}

.bx-wrapper img {
    max-width: 100%;
    display: block;
}

.bxslider {
    margin: 0;
    padding: 0;
}

ul.bxslider {
    list-style: none;
}

.bx-viewport {
    -webkit-transform: translatez(0);
}

.bx-wrapper {
    -moz-box-shadow: 0 0 5px #ccc;
    -webkit-box-shadow: 0 0 5px #ccc;
    box-shadow: 0 0 5px #ccc;
    border: 5px solid #fff;
    background: #fff;
}

.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {
    position: absolute;
    bottom: -30px;
    width: 100%;
}

.bx-wrapper .bx-loading {
    min-height: 50px;
    background: #ffffff;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2000;
}

.bx-wrapper .bx-pager {
    text-align: center;
    font-size: .85em;
    font-weight: bold;
    color: #666;
    padding-top: 20px;
}

.bx-wrapper .bx-pager.bx-default-pager a {
    background: #666;
    text-indent: -9999px;
    display: block;
    width: 10px;
    height: 10px;
    margin: 0 5px;
    outline: 0;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active, .bx-wrapper .bx-pager.bx-default-pager a:focus {
    background: #000;
}

.bx-wrapper .bx-pager-item, .bx-wrapper .bx-controls-auto .bx-controls-auto-item {
    display: inline-block;
    vertical-align: bottom;
    *zoom: 1;
    *display: inline;
}

.bx-wrapper .bx-pager-item {
    font-size: 0;
    line-height: 0;
}

.bx-wrapper .bx-prev {
    left: 10px;
}

.bx-wrapper .bx-prev:hover, .bx-wrapper .bx-prev:focus {
    background-position: 0 0;
}

.bx-wrapper .bx-next {
    right: 10px;
}

.bx-wrapper .bx-next:hover, .bx-wrapper .bx-next:focus {
    background-position: -43px 0;
}

.bx-wrapper .bx-controls-direction a {
    position: absolute;
    top: 50%;
    margin-top: -16px;
    outline: 0;
    width: 32px;
    height: 32px;
    text-indent: -9999px;
}

.bx-wrapper .bx-controls-direction a.disabled {
    display: none;
}

.bx-wrapper .bx-controls-auto {
    text-align: center;
}

.bx-wrapper .bx-controls-auto .bx-start {
    display: block;
    text-indent: -9999px;
    width: 10px;
    height: 11px;
    outline: 0;
    margin: 0 3px;
}

.bx-wrapper .bx-controls-auto .bx-start:hover, .bx-wrapper .bx-controls-auto .bx-start.active, .bx-wrapper .bx-controls-auto .bx-start:focus {
    background-position: -86px 0;
}

.bx-wrapper .bx-controls-auto .bx-stop {
    display: block;
    text-indent: -9999px;
    width: 9px;
    height: 11px;
    outline: 0;
    margin: 0 3px;
}

.bx-wrapper .bx-controls-auto .bx-stop:hover, .bx-wrapper .bx-controls-auto .bx-stop.active, .bx-wrapper .bx-controls-auto .bx-stop:focus {
    background-position: -86px -33px;
}

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
    text-align: left;
    width: 80%;
}

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
    right: 0;
    width: 35px;
}

.bx-wrapper .bx-caption {
    position: absolute;
    bottom: 0;
    left: 0;
    background: #666;
    background: rgba(80, 80, 80, 0.75);
    width: 100%;
}

.bx-wrapper .bx-caption span {
    color: #fff;
    display: block;
    font-size: .85em;
    padding: 10px;
}

.bx-wrapper {
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: none;
    background: none;
    margin-bottom: 35px;
}

/********************/
/*  ANIMATE V3.7.0  */
/********************/
@-webkit-keyframes bounce {
    0%, 20%, 53%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        -webkit-transform: translateZ(0);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        transform: translateZ(0)
    }
    40%, 43% {
        -webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        -webkit-transform: translate3d(0, -30px, 0);
        animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        transform: translate3d(0, -30px, 0)
    }
    70% {
        -webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        -webkit-transform: translate3d(0, -15px, 0);
        animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        transform: translate3d(0, -15px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -4px, 0);
        transform: translate3d(0, -4px, 0)
    }
}

@keyframes bounce {
    0%, 20%, 53%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        -webkit-transform: translateZ(0);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        transform: translateZ(0)
    }
    40%, 43% {
        -webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        -webkit-transform: translate3d(0, -30px, 0);
        animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        transform: translate3d(0, -30px, 0)
    }
    70% {
        -webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        -webkit-transform: translate3d(0, -15px, 0);
        animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        transform: translate3d(0, -15px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -4px, 0);
        transform: translate3d(0, -4px, 0)
    }
}

.bounce {
    -webkit-animation-name: bounce;
    -webkit-transform-origin: center bottom;
    animation-name: bounce;
    transform-origin: center bottom
}

@-webkit-keyframes flash {
    0%, 50%, to {
        opacity: 1
    }
    25%, 75% {
        opacity: 0
    }
}

@keyframes flash {
    0%, 50%, to {
        opacity: 1
    }
    25%, 75% {
        opacity: 0
    }
}

.flash {
    -webkit-animation-name: flash;
    animation-name: flash
}

@-webkit-keyframes pulse {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
    50% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05)
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes pulse {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
    50% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05)
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

.pulse {
    -webkit-animation-name: pulse;
    animation-name: pulse
}

@-webkit-keyframes rubberBand {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
    30% {
        -webkit-transform: scale3d(1.25, .75, 1);
        transform: scale3d(1.25, .75, 1)
    }
    40% {
        -webkit-transform: scale3d(.75, 1.25, 1);
        transform: scale3d(.75, 1.25, 1)
    }
    50% {
        -webkit-transform: scale3d(1.15, .85, 1);
        transform: scale3d(1.15, .85, 1)
    }
    65% {
        -webkit-transform: scale3d(.95, 1.05, 1);
        transform: scale3d(.95, 1.05, 1)
    }
    75% {
        -webkit-transform: scale3d(1.05, .95, 1);
        transform: scale3d(1.05, .95, 1)
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes rubberBand {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
    30% {
        -webkit-transform: scale3d(1.25, .75, 1);
        transform: scale3d(1.25, .75, 1)
    }
    40% {
        -webkit-transform: scale3d(.75, 1.25, 1);
        transform: scale3d(.75, 1.25, 1)
    }
    50% {
        -webkit-transform: scale3d(1.15, .85, 1);
        transform: scale3d(1.15, .85, 1)
    }
    65% {
        -webkit-transform: scale3d(.95, 1.05, 1);
        transform: scale3d(.95, 1.05, 1)
    }
    75% {
        -webkit-transform: scale3d(1.05, .95, 1);
        transform: scale3d(1.05, .95, 1)
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

.rubberBand {
    -webkit-animation-name: rubberBand;
    animation-name: rubberBand
}

@-webkit-keyframes shake {
    0%, to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    10%, 30%, 50%, 70%, 90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
    20%, 40%, 60%, 80% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }
}

@keyframes shake {
    0%, to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    10%, 30%, 50%, 70%, 90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
    20%, 40%, 60%, 80% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }
}

.shake {
    -webkit-animation-name: shake;
    animation-name: shake
}

@-webkit-keyframes headShake {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    6.5% {
        -webkit-transform: translateX(-6px) rotateY(-9deg);
        transform: translateX(-6px) rotateY(-9deg)
    }
    18.5% {
        -webkit-transform: translateX(5px) rotateY(7deg);
        transform: translateX(5px) rotateY(7deg)
    }
    31.5% {
        -webkit-transform: translateX(-3px) rotateY(-5deg);
        transform: translateX(-3px) rotateY(-5deg)
    }
    43.5% {
        -webkit-transform: translateX(2px) rotateY(3deg);
        transform: translateX(2px) rotateY(3deg)
    }
    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes headShake {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    6.5% {
        -webkit-transform: translateX(-6px) rotateY(-9deg);
        transform: translateX(-6px) rotateY(-9deg)
    }
    18.5% {
        -webkit-transform: translateX(5px) rotateY(7deg);
        transform: translateX(5px) rotateY(7deg)
    }
    31.5% {
        -webkit-transform: translateX(-3px) rotateY(-5deg);
        transform: translateX(-3px) rotateY(-5deg)
    }
    43.5% {
        -webkit-transform: translateX(2px) rotateY(3deg);
        transform: translateX(2px) rotateY(3deg)
    }
    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

.headShake {
    -webkit-animation-name: headShake;
    -webkit-animation-timing-function: ease-in-out;
    animation-name: headShake;
    animation-timing-function: ease-in-out
}

@-webkit-keyframes swing {
    20% {
        -webkit-transform: rotate(15deg);
        transform: rotate(15deg)
    }
    40% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }
    60% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg)
    }
    80% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg)
    }
    to {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

@keyframes swing {
    20% {
        -webkit-transform: rotate(15deg);
        transform: rotate(15deg)
    }
    40% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }
    60% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg)
    }
    80% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg)
    }
    to {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

.swing {
    -webkit-animation-name: swing;
    -webkit-transform-origin: top center;
    animation-name: swing;
    transform-origin: top center
}

@-webkit-keyframes tada {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
    10%, 20% {
        -webkit-transform: scale3d(.9, .9, .9) rotate(-3deg);
        transform: scale3d(.9, .9, .9) rotate(-3deg)
    }
    30%, 50%, 70%, 90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate(3deg)
    }
    40%, 60%, 80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg)
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes tada {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
    10%, 20% {
        -webkit-transform: scale3d(.9, .9, .9) rotate(-3deg);
        transform: scale3d(.9, .9, .9) rotate(-3deg)
    }
    30%, 50%, 70%, 90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate(3deg)
    }
    40%, 60%, 80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg)
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

.tada {
    -webkit-animation-name: tada;
    animation-name: tada
}

@-webkit-keyframes wobble {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    15% {
        -webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg);
        transform: translate3d(-25%, 0, 0) rotate(-5deg)
    }
    30% {
        -webkit-transform: translate3d(20%, 0, 0) rotate(3deg);
        transform: translate3d(20%, 0, 0) rotate(3deg)
    }
    45% {
        -webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg);
        transform: translate3d(-15%, 0, 0) rotate(-3deg)
    }
    60% {
        -webkit-transform: translate3d(10%, 0, 0) rotate(2deg);
        transform: translate3d(10%, 0, 0) rotate(2deg)
    }
    75% {
        -webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg);
        transform: translate3d(-5%, 0, 0) rotate(-1deg)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes wobble {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    15% {
        -webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg);
        transform: translate3d(-25%, 0, 0) rotate(-5deg)
    }
    30% {
        -webkit-transform: translate3d(20%, 0, 0) rotate(3deg);
        transform: translate3d(20%, 0, 0) rotate(3deg)
    }
    45% {
        -webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg);
        transform: translate3d(-15%, 0, 0) rotate(-3deg)
    }
    60% {
        -webkit-transform: translate3d(10%, 0, 0) rotate(2deg);
        transform: translate3d(10%, 0, 0) rotate(2deg)
    }
    75% {
        -webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg);
        transform: translate3d(-5%, 0, 0) rotate(-1deg)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.wobble {
    -webkit-animation-name: wobble;
    animation-name: wobble
}

@-webkit-keyframes jello {
    0%, 11.1%, to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    22.2% {
        -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
        transform: skewX(-12.5deg) skewY(-12.5deg)
    }
    33.3% {
        -webkit-transform: skewX(6.25deg) skewY(6.25deg);
        transform: skewX(6.25deg) skewY(6.25deg)
    }
    44.4% {
        -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
        transform: skewX(-3.125deg) skewY(-3.125deg)
    }
    55.5% {
        -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
        transform: skewX(1.5625deg) skewY(1.5625deg)
    }
    66.6% {
        -webkit-transform: skewX(-.78125deg) skewY(-.78125deg);
        transform: skewX(-.78125deg) skewY(-.78125deg)
    }
    77.7% {
        -webkit-transform: skewX(.390625deg) skewY(.390625deg);
        transform: skewX(.390625deg) skewY(.390625deg)
    }
    88.8% {
        -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg);
        transform: skewX(-.1953125deg) skewY(-.1953125deg)
    }
}

@keyframes jello {
    0%, 11.1%, to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    22.2% {
        -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
        transform: skewX(-12.5deg) skewY(-12.5deg)
    }
    33.3% {
        -webkit-transform: skewX(6.25deg) skewY(6.25deg);
        transform: skewX(6.25deg) skewY(6.25deg)
    }
    44.4% {
        -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
        transform: skewX(-3.125deg) skewY(-3.125deg)
    }
    55.5% {
        -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
        transform: skewX(1.5625deg) skewY(1.5625deg)
    }
    66.6% {
        -webkit-transform: skewX(-.78125deg) skewY(-.78125deg);
        transform: skewX(-.78125deg) skewY(-.78125deg)
    }
    77.7% {
        -webkit-transform: skewX(.390625deg) skewY(.390625deg);
        transform: skewX(.390625deg) skewY(.390625deg)
    }
    88.8% {
        -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg);
        transform: skewX(-.1953125deg) skewY(-.1953125deg)
    }
}

.jello {
    -webkit-animation-name: jello;
    -webkit-transform-origin: center;
    animation-name: jello;
    transform-origin: center
}

@-webkit-keyframes heartBeat {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
    14% {
        -webkit-transform: scale(1.3);
        transform: scale(1.3)
    }
    28% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
    42% {
        -webkit-transform: scale(1.3);
        transform: scale(1.3)
    }
    70% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes heartBeat {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
    14% {
        -webkit-transform: scale(1.3);
        transform: scale(1.3)
    }
    28% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
    42% {
        -webkit-transform: scale(1.3);
        transform: scale(1.3)
    }
    70% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.heartBeat {
    -webkit-animation-duration: 1.3s;
    -webkit-animation-name: heartBeat;
    -webkit-animation-timing-function: ease-in-out;
    animation-duration: 1.3s;
    animation-name: heartBeat;
    animation-timing-function: ease-in-out
}

@-webkit-keyframes bounceIn {
    0%, 20%, 40%, 60%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        -webkit-transform: scale3d(.3, .3, .3);
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }
    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }
    40% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    60% {
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        opacity: 1;
        transform: scale3d(1.03, 1.03, 1.03)
    }
    80% {
        -webkit-transform: scale3d(.97, .97, .97);
        transform: scale3d(.97, .97, .97)
    }
    to {
        -webkit-transform: scaleX(1);
        opacity: 1;
        transform: scaleX(1)
    }
}

@keyframes bounceIn {
    0%, 20%, 40%, 60%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        -webkit-transform: scale3d(.3, .3, .3);
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }
    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }
    40% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    60% {
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        opacity: 1;
        transform: scale3d(1.03, 1.03, 1.03)
    }
    80% {
        -webkit-transform: scale3d(.97, .97, .97);
        transform: scale3d(.97, .97, .97)
    }
    to {
        -webkit-transform: scaleX(1);
        opacity: 1;
        transform: scaleX(1)
    }
}

.bounceIn {
    -webkit-animation-duration: .75s;
    -webkit-animation-name: bounceIn;
    animation-duration: .75s;
    animation-name: bounceIn
}

@-webkit-keyframes bounceInDown {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        -webkit-transform: translate3d(0, -3000px, 0);
        opacity: 0;
        transform: translate3d(0, -3000px, 0)
    }
    60% {
        -webkit-transform: translate3d(0, 25px, 0);
        opacity: 1;
        transform: translate3d(0, 25px, 0)
    }
    75% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, 5px, 0);
        transform: translate3d(0, 5px, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes bounceInDown {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        -webkit-transform: translate3d(0, -3000px, 0);
        opacity: 0;
        transform: translate3d(0, -3000px, 0)
    }
    60% {
        -webkit-transform: translate3d(0, 25px, 0);
        opacity: 1;
        transform: translate3d(0, 25px, 0)
    }
    75% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, 5px, 0);
        transform: translate3d(0, 5px, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.bounceInDown {
    -webkit-animation-name: bounceInDown;
    animation-name: bounceInDown
}

@-webkit-keyframes bounceInLeft {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        -webkit-transform: translate3d(-3000px, 0, 0);
        opacity: 0;
        transform: translate3d(-3000px, 0, 0)
    }
    60% {
        -webkit-transform: translate3d(25px, 0, 0);
        opacity: 1;
        transform: translate3d(25px, 0, 0)
    }
    75% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
    90% {
        -webkit-transform: translate3d(5px, 0, 0);
        transform: translate3d(5px, 0, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes bounceInLeft {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        -webkit-transform: translate3d(-3000px, 0, 0);
        opacity: 0;
        transform: translate3d(-3000px, 0, 0)
    }
    60% {
        -webkit-transform: translate3d(25px, 0, 0);
        opacity: 1;
        transform: translate3d(25px, 0, 0)
    }
    75% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
    90% {
        -webkit-transform: translate3d(5px, 0, 0);
        transform: translate3d(5px, 0, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.bounceInLeft {
    -webkit-animation-name: bounceInLeft;
    animation-name: bounceInLeft
}

@-webkit-keyframes bounceInRight {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        -webkit-transform: translate3d(3000px, 0, 0);
        opacity: 0;
        transform: translate3d(3000px, 0, 0)
    }
    60% {
        -webkit-transform: translate3d(-25px, 0, 0);
        opacity: 1;
        transform: translate3d(-25px, 0, 0)
    }
    75% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }
    90% {
        -webkit-transform: translate3d(-5px, 0, 0);
        transform: translate3d(-5px, 0, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes bounceInRight {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        -webkit-transform: translate3d(3000px, 0, 0);
        opacity: 0;
        transform: translate3d(3000px, 0, 0)
    }
    60% {
        -webkit-transform: translate3d(-25px, 0, 0);
        opacity: 1;
        transform: translate3d(-25px, 0, 0)
    }
    75% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }
    90% {
        -webkit-transform: translate3d(-5px, 0, 0);
        transform: translate3d(-5px, 0, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.bounceInRight {
    -webkit-animation-name: bounceInRight;
    animation-name: bounceInRight
}

@-webkit-keyframes bounceInUp {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        -webkit-transform: translate3d(0, 3000px, 0);
        opacity: 0;
        transform: translate3d(0, 3000px, 0)
    }
    60% {
        -webkit-transform: translate3d(0, -20px, 0);
        opacity: 1;
        transform: translate3d(0, -20px, 0)
    }
    75% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -5px, 0);
        transform: translate3d(0, -5px, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes bounceInUp {
    0%, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }
    0% {
        -webkit-transform: translate3d(0, 3000px, 0);
        opacity: 0;
        transform: translate3d(0, 3000px, 0)
    }
    60% {
        -webkit-transform: translate3d(0, -20px, 0);
        opacity: 1;
        transform: translate3d(0, -20px, 0)
    }
    75% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -5px, 0);
        transform: translate3d(0, -5px, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.bounceInUp {
    -webkit-animation-name: bounceInUp;
    animation-name: bounceInUp
}

@-webkit-keyframes bounceOut {
    20% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    50%, 55% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        opacity: 1;
        transform: scale3d(1.1, 1.1, 1.1)
    }
    to {
        -webkit-transform: scale3d(.3, .3, .3);
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }
}

@keyframes bounceOut {
    20% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    50%, 55% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        opacity: 1;
        transform: scale3d(1.1, 1.1, 1.1)
    }
    to {
        -webkit-transform: scale3d(.3, .3, .3);
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }
}

.bounceOut {
    -webkit-animation-duration: .75s;
    -webkit-animation-name: bounceOut;
    animation-duration: .75s;
    animation-name: bounceOut
}

@-webkit-keyframes bounceOutDown {
    20% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }
    40%, 45% {
        -webkit-transform: translate3d(0, -20px, 0);
        opacity: 1;
        transform: translate3d(0, -20px, 0)
    }
    to {
        -webkit-transform: translate3d(0, 2000px, 0);
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }
}

@keyframes bounceOutDown {
    20% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }
    40%, 45% {
        -webkit-transform: translate3d(0, -20px, 0);
        opacity: 1;
        transform: translate3d(0, -20px, 0)
    }
    to {
        -webkit-transform: translate3d(0, 2000px, 0);
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }
}

.bounceOutDown {
    -webkit-animation-name: bounceOutDown;
    animation-name: bounceOutDown
}

@-webkit-keyframes bounceOutLeft {
    20% {
        -webkit-transform: translate3d(20px, 0, 0);
        opacity: 1;
        transform: translate3d(20px, 0, 0)
    }
    to {
        -webkit-transform: translate3d(-2000px, 0, 0);
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }
}

@keyframes bounceOutLeft {
    20% {
        -webkit-transform: translate3d(20px, 0, 0);
        opacity: 1;
        transform: translate3d(20px, 0, 0)
    }
    to {
        -webkit-transform: translate3d(-2000px, 0, 0);
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }
}

.bounceOutLeft {
    -webkit-animation-name: bounceOutLeft;
    animation-name: bounceOutLeft
}

@-webkit-keyframes bounceOutRight {
    20% {
        -webkit-transform: translate3d(-20px, 0, 0);
        opacity: 1;
        transform: translate3d(-20px, 0, 0)
    }
    to {
        -webkit-transform: translate3d(2000px, 0, 0);
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }
}

@keyframes bounceOutRight {
    20% {
        -webkit-transform: translate3d(-20px, 0, 0);
        opacity: 1;
        transform: translate3d(-20px, 0, 0)
    }
    to {
        -webkit-transform: translate3d(2000px, 0, 0);
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }
}

.bounceOutRight {
    -webkit-animation-name: bounceOutRight;
    animation-name: bounceOutRight
}

@-webkit-keyframes bounceOutUp {
    20% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0)
    }
    40%, 45% {
        -webkit-transform: translate3d(0, 20px, 0);
        opacity: 1;
        transform: translate3d(0, 20px, 0)
    }
    to {
        -webkit-transform: translate3d(0, -2000px, 0);
        opacity: 0;
        transform: translate3d(0, -2000px, 0)
    }
}

@keyframes bounceOutUp {
    20% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0)
    }
    40%, 45% {
        -webkit-transform: translate3d(0, 20px, 0);
        opacity: 1;
        transform: translate3d(0, 20px, 0)
    }
    to {
        -webkit-transform: translate3d(0, -2000px, 0);
        opacity: 0;
        transform: translate3d(0, -2000px, 0)
    }
}

.bounceOutUp {
    -webkit-animation-name: bounceOutUp;
    animation-name: bounceOutUp
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

.fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn
}

@-webkit-keyframes fadeInDown {
    0% {
        -webkit-transform: translate3d(0, -100%, 0);
        opacity: 0;
        transform: translate3d(0, -100%, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        opacity: 1;
        transform: translateZ(0)
    }
}

@keyframes fadeInDown {
    0% {
        -webkit-transform: translate3d(0, -100%, 0);
        opacity: 0;
        transform: translate3d(0, -100%, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        opacity: 1;
        transform: translateZ(0)
    }
}

.fadeInDown {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown
}

@-webkit-keyframes fadeInDownBig {
    0% {
        -webkit-transform: translate3d(0, -2000px, 0);
        opacity: 0;
        transform: translate3d(0, -2000px, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        opacity: 1;
        transform: translateZ(0)
    }
}

@keyframes fadeInDownBig {
    0% {
        -webkit-transform: translate3d(0, -2000px, 0);
        opacity: 0;
        transform: translate3d(0, -2000px, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        opacity: 1;
        transform: translateZ(0)
    }
}

.fadeInDownBig {
    -webkit-animation-name: fadeInDownBig;
    animation-name: fadeInDownBig
}

@-webkit-keyframes fadeInLeft {
    0% {
        -webkit-transform: translate3d(-100%, 0, 0);
        opacity: 0;
        transform: translate3d(-100%, 0, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        opacity: 1;
        transform: translateZ(0)
    }
}

@keyframes fadeInLeft {
    0% {
        -webkit-transform: translate3d(-100%, 0, 0);
        opacity: 0;
        transform: translate3d(-100%, 0, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        opacity: 1;
        transform: translateZ(0)
    }
}

.fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft
}

@-webkit-keyframes fadeInLeftBig {
    0% {
        -webkit-transform: translate3d(-2000px, 0, 0);
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        opacity: 1;
        transform: translateZ(0)
    }
}

@keyframes fadeInLeftBig {
    0% {
        -webkit-transform: translate3d(-2000px, 0, 0);
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        opacity: 1;
        transform: translateZ(0)
    }
}

.fadeInLeftBig {
    -webkit-animation-name: fadeInLeftBig;
    animation-name: fadeInLeftBig
}

@-webkit-keyframes fadeInRight {
    0% {
        -webkit-transform: translate3d(100%, 0, 0);
        opacity: 0;
        transform: translate3d(100%, 0, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        opacity: 1;
        transform: translateZ(0)
    }
}

@keyframes fadeInRight {
    0% {
        -webkit-transform: translate3d(100%, 0, 0);
        opacity: 0;
        transform: translate3d(100%, 0, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        opacity: 1;
        transform: translateZ(0)
    }
}

.fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight
}

@-webkit-keyframes fadeInRightBig {
    0% {
        -webkit-transform: translate3d(2000px, 0, 0);
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        opacity: 1;
        transform: translateZ(0)
    }
}

@keyframes fadeInRightBig {
    0% {
        -webkit-transform: translate3d(2000px, 0, 0);
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        opacity: 1;
        transform: translateZ(0)
    }
}

.fadeInRightBig {
    -webkit-animation-name: fadeInRightBig;
    animation-name: fadeInRightBig
}

@-webkit-keyframes fadeInUp {
    0% {
        -webkit-transform: translate3d(0, 100%, 0);
        opacity: 0;
        transform: translate3d(0, 100%, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        opacity: 1;
        transform: translateZ(0)
    }
}

@keyframes fadeInUp {
    0% {
        -webkit-transform: translate3d(0, 100%, 0);
        opacity: 0;
        transform: translate3d(0, 100%, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        opacity: 1;
        transform: translateZ(0)
    }
}

.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp
}

@-webkit-keyframes fadeInUpBig {
    0% {
        -webkit-transform: translate3d(0, 2000px, 0);
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        opacity: 1;
        transform: translateZ(0)
    }
}

@keyframes fadeInUpBig {
    0% {
        -webkit-transform: translate3d(0, 2000px, 0);
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        opacity: 1;
        transform: translateZ(0)
    }
}

.fadeInUpBig {
    -webkit-animation-name: fadeInUpBig;
    animation-name: fadeInUpBig
}

@-webkit-keyframes fadeOut {
    0% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

.fadeOut {
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut
}

@-webkit-keyframes fadeOutDown {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(0, 100%, 0);
        opacity: 0;
        transform: translate3d(0, 100%, 0)
    }
}

@keyframes fadeOutDown {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(0, 100%, 0);
        opacity: 0;
        transform: translate3d(0, 100%, 0)
    }
}

.fadeOutDown {
    -webkit-animation-name: fadeOutDown;
    animation-name: fadeOutDown
}

@-webkit-keyframes fadeOutDownBig {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(0, 2000px, 0);
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }
}

@keyframes fadeOutDownBig {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(0, 2000px, 0);
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }
}

.fadeOutDownBig {
    -webkit-animation-name: fadeOutDownBig;
    animation-name: fadeOutDownBig
}

@-webkit-keyframes fadeOutLeft {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(-100%, 0, 0);
        opacity: 0;
        transform: translate3d(-100%, 0, 0)
    }
}

@keyframes fadeOutLeft {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(-100%, 0, 0);
        opacity: 0;
        transform: translate3d(-100%, 0, 0)
    }
}

.fadeOutLeft {
    -webkit-animation-name: fadeOutLeft;
    animation-name: fadeOutLeft
}

@-webkit-keyframes fadeOutLeftBig {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(-2000px, 0, 0);
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }
}

@keyframes fadeOutLeftBig {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(-2000px, 0, 0);
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }
}

.fadeOutLeftBig {
    -webkit-animation-name: fadeOutLeftBig;
    animation-name: fadeOutLeftBig
}

@-webkit-keyframes fadeOutRight {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(100%, 0, 0);
        opacity: 0;
        transform: translate3d(100%, 0, 0)
    }
}

@keyframes fadeOutRight {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(100%, 0, 0);
        opacity: 0;
        transform: translate3d(100%, 0, 0)
    }
}

.fadeOutRight {
    -webkit-animation-name: fadeOutRight;
    animation-name: fadeOutRight
}

@-webkit-keyframes fadeOutRightBig {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(2000px, 0, 0);
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }
}

@keyframes fadeOutRightBig {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(2000px, 0, 0);
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }
}

.fadeOutRightBig {
    -webkit-animation-name: fadeOutRightBig;
    animation-name: fadeOutRightBig
}

@-webkit-keyframes fadeOutUp {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(0, -100%, 0);
        opacity: 0;
        transform: translate3d(0, -100%, 0)
    }
}

@keyframes fadeOutUp {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(0, -100%, 0);
        opacity: 0;
        transform: translate3d(0, -100%, 0)
    }
}

.fadeOutUp {
    -webkit-animation-name: fadeOutUp;
    animation-name: fadeOutUp
}

@-webkit-keyframes fadeOutUpBig {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(0, -2000px, 0);
        opacity: 0;
        transform: translate3d(0, -2000px, 0)
    }
}

@keyframes fadeOutUpBig {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(0, -2000px, 0);
        opacity: 0;
        transform: translate3d(0, -2000px, 0)
    }
}

.fadeOutUpBig {
    -webkit-animation-name: fadeOutUpBig;
    animation-name: fadeOutUpBig
}

@-webkit-keyframes flip {
    0% {
        -webkit-animation-timing-function: ease-out;
        -webkit-transform: perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn);
        animation-timing-function: ease-out;
        transform: perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn)
    }
    40% {
        -webkit-animation-timing-function: ease-out;
        -webkit-transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg);
        animation-timing-function: ease-out;
        transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg)
    }
    50% {
        -webkit-animation-timing-function: ease-in;
        -webkit-transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg);
        animation-timing-function: ease-in;
        transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg)
    }
    80% {
        -webkit-animation-timing-function: ease-in;
        -webkit-transform: perspective(400px) scale3d(.95, .95, .95) translateZ(0) rotateY(0deg);
        animation-timing-function: ease-in;
        transform: perspective(400px) scale3d(.95, .95, .95) translateZ(0) rotateY(0deg)
    }
    to {
        -webkit-animation-timing-function: ease-in;
        -webkit-transform: perspective(400px) scaleX(1) translateZ(0) rotateY(0deg);
        animation-timing-function: ease-in;
        transform: perspective(400px) scaleX(1) translateZ(0) rotateY(0deg)
    }
}

@keyframes flip {
    0% {
        -webkit-animation-timing-function: ease-out;
        -webkit-transform: perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn);
        animation-timing-function: ease-out;
        transform: perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn)
    }
    40% {
        -webkit-animation-timing-function: ease-out;
        -webkit-transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg);
        animation-timing-function: ease-out;
        transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg)
    }
    50% {
        -webkit-animation-timing-function: ease-in;
        -webkit-transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg);
        animation-timing-function: ease-in;
        transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg)
    }
    80% {
        -webkit-animation-timing-function: ease-in;
        -webkit-transform: perspective(400px) scale3d(.95, .95, .95) translateZ(0) rotateY(0deg);
        animation-timing-function: ease-in;
        transform: perspective(400px) scale3d(.95, .95, .95) translateZ(0) rotateY(0deg)
    }
    to {
        -webkit-animation-timing-function: ease-in;
        -webkit-transform: perspective(400px) scaleX(1) translateZ(0) rotateY(0deg);
        animation-timing-function: ease-in;
        transform: perspective(400px) scaleX(1) translateZ(0) rotateY(0deg)
    }
}

.animated.flip {
    -webkit-animation-name: flip;
    -webkit-backface-visibility: visible;
    animation-name: flip;
    backface-visibility: visible
}

@-webkit-keyframes flipInX {
    0% {
        -webkit-animation-timing-function: ease-in;
        -webkit-transform: perspective(400px) rotateX(90deg);
        animation-timing-function: ease-in;
        opacity: 0;
        transform: perspective(400px) rotateX(90deg)
    }
    40% {
        -webkit-animation-timing-function: ease-in;
        -webkit-transform: perspective(400px) rotateX(-20deg);
        animation-timing-function: ease-in;
        transform: perspective(400px) rotateX(-20deg)
    }
    60% {
        -webkit-transform: perspective(400px) rotateX(10deg);
        opacity: 1;
        transform: perspective(400px) rotateX(10deg)
    }
    80% {
        -webkit-transform: perspective(400px) rotateX(-5deg);
        transform: perspective(400px) rotateX(-5deg)
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

@keyframes flipInX {
    0% {
        -webkit-animation-timing-function: ease-in;
        -webkit-transform: perspective(400px) rotateX(90deg);
        animation-timing-function: ease-in;
        opacity: 0;
        transform: perspective(400px) rotateX(90deg)
    }
    40% {
        -webkit-animation-timing-function: ease-in;
        -webkit-transform: perspective(400px) rotateX(-20deg);
        animation-timing-function: ease-in;
        transform: perspective(400px) rotateX(-20deg)
    }
    60% {
        -webkit-transform: perspective(400px) rotateX(10deg);
        opacity: 1;
        transform: perspective(400px) rotateX(10deg)
    }
    80% {
        -webkit-transform: perspective(400px) rotateX(-5deg);
        transform: perspective(400px) rotateX(-5deg)
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

.flipInX {
    -webkit-animation-name: flipInX;
    -webkit-backface-visibility: visible;
    animation-name: flipInX;
    backface-visibility: visible
}

@-webkit-keyframes flipInY {
    0% {
        -webkit-animation-timing-function: ease-in;
        -webkit-transform: perspective(400px) rotateY(90deg);
        animation-timing-function: ease-in;
        opacity: 0;
        transform: perspective(400px) rotateY(90deg)
    }
    40% {
        -webkit-animation-timing-function: ease-in;
        -webkit-transform: perspective(400px) rotateY(-20deg);
        animation-timing-function: ease-in;
        transform: perspective(400px) rotateY(-20deg)
    }
    60% {
        -webkit-transform: perspective(400px) rotateY(10deg);
        opacity: 1;
        transform: perspective(400px) rotateY(10deg)
    }
    80% {
        -webkit-transform: perspective(400px) rotateY(-5deg);
        transform: perspective(400px) rotateY(-5deg)
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

@keyframes flipInY {
    0% {
        -webkit-animation-timing-function: ease-in;
        -webkit-transform: perspective(400px) rotateY(90deg);
        animation-timing-function: ease-in;
        opacity: 0;
        transform: perspective(400px) rotateY(90deg)
    }
    40% {
        -webkit-animation-timing-function: ease-in;
        -webkit-transform: perspective(400px) rotateY(-20deg);
        animation-timing-function: ease-in;
        transform: perspective(400px) rotateY(-20deg)
    }
    60% {
        -webkit-transform: perspective(400px) rotateY(10deg);
        opacity: 1;
        transform: perspective(400px) rotateY(10deg)
    }
    80% {
        -webkit-transform: perspective(400px) rotateY(-5deg);
        transform: perspective(400px) rotateY(-5deg)
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

.flipInY {
    -webkit-animation-name: flipInY;
    -webkit-backface-visibility: visible;
    animation-name: flipInY;
    backface-visibility: visible
}

@-webkit-keyframes flipOutX {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
    30% {
        -webkit-transform: perspective(400px) rotateX(-20deg);
        opacity: 1;
        transform: perspective(400px) rotateX(-20deg)
    }
    to {
        -webkit-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
        transform: perspective(400px) rotateX(90deg)
    }
}

@keyframes flipOutX {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
    30% {
        -webkit-transform: perspective(400px) rotateX(-20deg);
        opacity: 1;
        transform: perspective(400px) rotateX(-20deg)
    }
    to {
        -webkit-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
        transform: perspective(400px) rotateX(90deg)
    }
}

.flipOutX {
    -webkit-animation-duration: .75s;
    -webkit-animation-name: flipOutX;
    -webkit-backface-visibility: visible;
    animation-duration: .75s;
    animation-name: flipOutX;
    backface-visibility: visible
}

@-webkit-keyframes flipOutY {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
    30% {
        -webkit-transform: perspective(400px) rotateY(-15deg);
        opacity: 1;
        transform: perspective(400px) rotateY(-15deg)
    }
    to {
        -webkit-transform: perspective(400px) rotateY(90deg);
        opacity: 0;
        transform: perspective(400px) rotateY(90deg)
    }
}

@keyframes flipOutY {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
    30% {
        -webkit-transform: perspective(400px) rotateY(-15deg);
        opacity: 1;
        transform: perspective(400px) rotateY(-15deg)
    }
    to {
        -webkit-transform: perspective(400px) rotateY(90deg);
        opacity: 0;
        transform: perspective(400px) rotateY(90deg)
    }
}

.flipOutY {
    -webkit-animation-duration: .75s;
    -webkit-animation-name: flipOutY;
    -webkit-backface-visibility: visible;
    animation-duration: .75s;
    animation-name: flipOutY;
    backface-visibility: visible
}

@-webkit-keyframes lightSpeedIn {
    0% {
        -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0;
        transform: translate3d(100%, 0, 0) skewX(-30deg)
    }
    60% {
        -webkit-transform: skewX(20deg);
        opacity: 1;
        transform: skewX(20deg)
    }
    80% {
        -webkit-transform: skewX(-5deg);
        transform: skewX(-5deg)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes lightSpeedIn {
    0% {
        -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0;
        transform: translate3d(100%, 0, 0) skewX(-30deg)
    }
    60% {
        -webkit-transform: skewX(20deg);
        opacity: 1;
        transform: skewX(20deg)
    }
    80% {
        -webkit-transform: skewX(-5deg);
        transform: skewX(-5deg)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.lightSpeedIn {
    -webkit-animation-name: lightSpeedIn;
    -webkit-animation-timing-function: ease-out;
    animation-name: lightSpeedIn;
    animation-timing-function: ease-out
}

@-webkit-keyframes lightSpeedOut {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
        opacity: 0;
        transform: translate3d(100%, 0, 0) skewX(30deg)
    }
}

@keyframes lightSpeedOut {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
        opacity: 0;
        transform: translate3d(100%, 0, 0) skewX(30deg)
    }
}

.lightSpeedOut {
    -webkit-animation-name: lightSpeedOut;
    -webkit-animation-timing-function: ease-in;
    animation-name: lightSpeedOut;
    animation-timing-function: ease-in
}

@-webkit-keyframes rotateIn {
    0% {
        -webkit-transform: rotate(-200deg);
        -webkit-transform-origin: center;
        opacity: 0;
        transform: rotate(-200deg);
        transform-origin: center
    }
    to {
        -webkit-transform: translateZ(0);
        -webkit-transform-origin: center;
        opacity: 1;
        transform: translateZ(0);
        transform-origin: center
    }
}

@keyframes rotateIn {
    0% {
        -webkit-transform: rotate(-200deg);
        -webkit-transform-origin: center;
        opacity: 0;
        transform: rotate(-200deg);
        transform-origin: center
    }
    to {
        -webkit-transform: translateZ(0);
        -webkit-transform-origin: center;
        opacity: 1;
        transform: translateZ(0);
        transform-origin: center
    }
}

.rotateIn {
    -webkit-animation-name: rotateIn;
    animation-name: rotateIn
}

@-webkit-keyframes rotateInDownLeft {
    0% {
        -webkit-transform: rotate(-45deg);
        -webkit-transform-origin: left bottom;
        opacity: 0;
        transform: rotate(-45deg);
        transform-origin: left bottom
    }
    to {
        -webkit-transform: translateZ(0);
        -webkit-transform-origin: left bottom;
        opacity: 1;
        transform: translateZ(0);
        transform-origin: left bottom
    }
}

@keyframes rotateInDownLeft {
    0% {
        -webkit-transform: rotate(-45deg);
        -webkit-transform-origin: left bottom;
        opacity: 0;
        transform: rotate(-45deg);
        transform-origin: left bottom
    }
    to {
        -webkit-transform: translateZ(0);
        -webkit-transform-origin: left bottom;
        opacity: 1;
        transform: translateZ(0);
        transform-origin: left bottom
    }
}

.rotateInDownLeft {
    -webkit-animation-name: rotateInDownLeft;
    animation-name: rotateInDownLeft
}

@-webkit-keyframes rotateInDownRight {
    0% {
        -webkit-transform: rotate(45deg);
        -webkit-transform-origin: right bottom;
        opacity: 0;
        transform: rotate(45deg);
        transform-origin: right bottom
    }
    to {
        -webkit-transform: translateZ(0);
        -webkit-transform-origin: right bottom;
        opacity: 1;
        transform: translateZ(0);
        transform-origin: right bottom
    }
}

@keyframes rotateInDownRight {
    0% {
        -webkit-transform: rotate(45deg);
        -webkit-transform-origin: right bottom;
        opacity: 0;
        transform: rotate(45deg);
        transform-origin: right bottom
    }
    to {
        -webkit-transform: translateZ(0);
        -webkit-transform-origin: right bottom;
        opacity: 1;
        transform: translateZ(0);
        transform-origin: right bottom
    }
}

.rotateInDownRight {
    -webkit-animation-name: rotateInDownRight;
    animation-name: rotateInDownRight
}

@-webkit-keyframes rotateInUpLeft {
    0% {
        -webkit-transform: rotate(45deg);
        -webkit-transform-origin: left bottom;
        opacity: 0;
        transform: rotate(45deg);
        transform-origin: left bottom
    }
    to {
        -webkit-transform: translateZ(0);
        -webkit-transform-origin: left bottom;
        opacity: 1;
        transform: translateZ(0);
        transform-origin: left bottom
    }
}

@keyframes rotateInUpLeft {
    0% {
        -webkit-transform: rotate(45deg);
        -webkit-transform-origin: left bottom;
        opacity: 0;
        transform: rotate(45deg);
        transform-origin: left bottom
    }
    to {
        -webkit-transform: translateZ(0);
        -webkit-transform-origin: left bottom;
        opacity: 1;
        transform: translateZ(0);
        transform-origin: left bottom
    }
}

.rotateInUpLeft {
    -webkit-animation-name: rotateInUpLeft;
    animation-name: rotateInUpLeft
}

@-webkit-keyframes rotateInUpRight {
    0% {
        -webkit-transform: rotate(-90deg);
        -webkit-transform-origin: right bottom;
        opacity: 0;
        transform: rotate(-90deg);
        transform-origin: right bottom
    }
    to {
        -webkit-transform: translateZ(0);
        -webkit-transform-origin: right bottom;
        opacity: 1;
        transform: translateZ(0);
        transform-origin: right bottom
    }
}

@keyframes rotateInUpRight {
    0% {
        -webkit-transform: rotate(-90deg);
        -webkit-transform-origin: right bottom;
        opacity: 0;
        transform: rotate(-90deg);
        transform-origin: right bottom
    }
    to {
        -webkit-transform: translateZ(0);
        -webkit-transform-origin: right bottom;
        opacity: 1;
        transform: translateZ(0);
        transform-origin: right bottom
    }
}

.rotateInUpRight {
    -webkit-animation-name: rotateInUpRight;
    animation-name: rotateInUpRight
}

@-webkit-keyframes rotateOut {
    0% {
        -webkit-transform-origin: center;
        opacity: 1;
        transform-origin: center
    }
    to {
        -webkit-transform: rotate(200deg);
        -webkit-transform-origin: center;
        opacity: 0;
        transform: rotate(200deg);
        transform-origin: center
    }
}

@keyframes rotateOut {
    0% {
        -webkit-transform-origin: center;
        opacity: 1;
        transform-origin: center
    }
    to {
        -webkit-transform: rotate(200deg);
        -webkit-transform-origin: center;
        opacity: 0;
        transform: rotate(200deg);
        transform-origin: center
    }
}

.rotateOut {
    -webkit-animation-name: rotateOut;
    animation-name: rotateOut
}

@-webkit-keyframes rotateOutDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        opacity: 1;
        transform-origin: left bottom
    }
    to {
        -webkit-transform: rotate(45deg);
        -webkit-transform-origin: left bottom;
        opacity: 0;
        transform: rotate(45deg);
        transform-origin: left bottom
    }
}

@keyframes rotateOutDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        opacity: 1;
        transform-origin: left bottom
    }
    to {
        -webkit-transform: rotate(45deg);
        -webkit-transform-origin: left bottom;
        opacity: 0;
        transform: rotate(45deg);
        transform-origin: left bottom
    }
}

.rotateOutDownLeft {
    -webkit-animation-name: rotateOutDownLeft;
    animation-name: rotateOutDownLeft
}

@-webkit-keyframes rotateOutDownRight {
    0% {
        -webkit-transform-origin: right bottom;
        opacity: 1;
        transform-origin: right bottom
    }
    to {
        -webkit-transform: rotate(-45deg);
        -webkit-transform-origin: right bottom;
        opacity: 0;
        transform: rotate(-45deg);
        transform-origin: right bottom
    }
}

@keyframes rotateOutDownRight {
    0% {
        -webkit-transform-origin: right bottom;
        opacity: 1;
        transform-origin: right bottom
    }
    to {
        -webkit-transform: rotate(-45deg);
        -webkit-transform-origin: right bottom;
        opacity: 0;
        transform: rotate(-45deg);
        transform-origin: right bottom
    }
}

.rotateOutDownRight {
    -webkit-animation-name: rotateOutDownRight;
    animation-name: rotateOutDownRight
}

@-webkit-keyframes rotateOutUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        opacity: 1;
        transform-origin: left bottom
    }
    to {
        -webkit-transform: rotate(-45deg);
        -webkit-transform-origin: left bottom;
        opacity: 0;
        transform: rotate(-45deg);
        transform-origin: left bottom
    }
}

@keyframes rotateOutUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        opacity: 1;
        transform-origin: left bottom
    }
    to {
        -webkit-transform: rotate(-45deg);
        -webkit-transform-origin: left bottom;
        opacity: 0;
        transform: rotate(-45deg);
        transform-origin: left bottom
    }
}

.rotateOutUpLeft {
    -webkit-animation-name: rotateOutUpLeft;
    animation-name: rotateOutUpLeft
}

@-webkit-keyframes rotateOutUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        opacity: 1;
        transform-origin: right bottom
    }
    to {
        -webkit-transform: rotate(90deg);
        -webkit-transform-origin: right bottom;
        opacity: 0;
        transform: rotate(90deg);
        transform-origin: right bottom
    }
}

@keyframes rotateOutUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        opacity: 1;
        transform-origin: right bottom
    }
    to {
        -webkit-transform: rotate(90deg);
        -webkit-transform-origin: right bottom;
        opacity: 0;
        transform: rotate(90deg);
        transform-origin: right bottom
    }
}

.rotateOutUpRight {
    -webkit-animation-name: rotateOutUpRight;
    animation-name: rotateOutUpRight
}

@-webkit-keyframes hinge {
    0% {
        -webkit-animation-timing-function: ease-in-out;
        -webkit-transform-origin: top left;
        animation-timing-function: ease-in-out;
        transform-origin: top left
    }
    20%, 60% {
        -webkit-animation-timing-function: ease-in-out;
        -webkit-transform: rotate(80deg);
        -webkit-transform-origin: top left;
        animation-timing-function: ease-in-out;
        transform: rotate(80deg);
        transform-origin: top left
    }
    40%, 80% {
        -webkit-animation-timing-function: ease-in-out;
        -webkit-transform: rotate(60deg);
        -webkit-transform-origin: top left;
        animation-timing-function: ease-in-out;
        opacity: 1;
        transform: rotate(60deg);
        transform-origin: top left
    }
    to {
        -webkit-transform: translate3d(0, 700px, 0);
        opacity: 0;
        transform: translate3d(0, 700px, 0)
    }
}

@keyframes hinge {
    0% {
        -webkit-animation-timing-function: ease-in-out;
        -webkit-transform-origin: top left;
        animation-timing-function: ease-in-out;
        transform-origin: top left
    }
    20%, 60% {
        -webkit-animation-timing-function: ease-in-out;
        -webkit-transform: rotate(80deg);
        -webkit-transform-origin: top left;
        animation-timing-function: ease-in-out;
        transform: rotate(80deg);
        transform-origin: top left
    }
    40%, 80% {
        -webkit-animation-timing-function: ease-in-out;
        -webkit-transform: rotate(60deg);
        -webkit-transform-origin: top left;
        animation-timing-function: ease-in-out;
        opacity: 1;
        transform: rotate(60deg);
        transform-origin: top left
    }
    to {
        -webkit-transform: translate3d(0, 700px, 0);
        opacity: 0;
        transform: translate3d(0, 700px, 0)
    }
}

.hinge {
    -webkit-animation-duration: 2s;
    -webkit-animation-name: hinge;
    animation-duration: 2s;
    animation-name: hinge
}

@-webkit-keyframes jackInTheBox {
    0% {
        -webkit-transform: scale(.1) rotate(30deg);
        -webkit-transform-origin: center bottom;
        opacity: 0;
        transform: scale(.1) rotate(30deg);
        transform-origin: center bottom
    }
    50% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }
    70% {
        -webkit-transform: rotate(3deg);
        transform: rotate(3deg)
    }
    to {
        -webkit-transform: scale(1);
        opacity: 1;
        transform: scale(1)
    }
}

@keyframes jackInTheBox {
    0% {
        -webkit-transform: scale(.1) rotate(30deg);
        -webkit-transform-origin: center bottom;
        opacity: 0;
        transform: scale(.1) rotate(30deg);
        transform-origin: center bottom
    }
    50% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }
    70% {
        -webkit-transform: rotate(3deg);
        transform: rotate(3deg)
    }
    to {
        -webkit-transform: scale(1);
        opacity: 1;
        transform: scale(1)
    }
}

.jackInTheBox {
    -webkit-animation-name: jackInTheBox;
    animation-name: jackInTheBox
}

@-webkit-keyframes rollIn {
    0% {
        -webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg);
        opacity: 0;
        transform: translate3d(-100%, 0, 0) rotate(-120deg)
    }
    to {
        -webkit-transform: translateZ(0);
        opacity: 1;
        transform: translateZ(0)
    }
}

@keyframes rollIn {
    0% {
        -webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg);
        opacity: 0;
        transform: translate3d(-100%, 0, 0) rotate(-120deg)
    }
    to {
        -webkit-transform: translateZ(0);
        opacity: 1;
        transform: translateZ(0)
    }
}

.rollIn {
    -webkit-animation-name: rollIn;
    animation-name: rollIn
}

@-webkit-keyframes rollOut {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(100%, 0, 0) rotate(120deg);
        opacity: 0;
        transform: translate3d(100%, 0, 0) rotate(120deg)
    }
}

@keyframes rollOut {
    0% {
        opacity: 1
    }
    to {
        -webkit-transform: translate3d(100%, 0, 0) rotate(120deg);
        opacity: 0;
        transform: translate3d(100%, 0, 0) rotate(120deg)
    }
}

.rollOut {
    -webkit-animation-name: rollOut;
    animation-name: rollOut
}

@-webkit-keyframes zoomIn {
    0% {
        -webkit-transform: scale3d(.3, .3, .3);
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }
    50% {
        opacity: 1
    }
}

@keyframes zoomIn {
    0% {
        -webkit-transform: scale3d(.3, .3, .3);
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }
    50% {
        opacity: 1
    }
}

.zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn
}

@-webkit-keyframes zoomInDown {
    0% {
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0)
    }
    60% {
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0)
    }
}

@keyframes zoomInDown {
    0% {
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0)
    }
    60% {
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0)
    }
}

.zoomInDown {
    -webkit-animation-name: zoomInDown;
    animation-name: zoomInDown
}

@-webkit-keyframes zoomInLeft {
    0% {
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0)
    }
    60% {
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0)
    }
}

@keyframes zoomInLeft {
    0% {
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0)
    }
    60% {
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0)
    }
}

.zoomInLeft {
    -webkit-animation-name: zoomInLeft;
    animation-name: zoomInLeft
}

@-webkit-keyframes zoomInRight {
    0% {
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0)
    }
    60% {
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0)
    }
}

@keyframes zoomInRight {
    0% {
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0)
    }
    60% {
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0)
    }
}

.zoomInRight {
    -webkit-animation-name: zoomInRight;
    animation-name: zoomInRight
}

@-webkit-keyframes zoomInUp {
    0% {
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0)
    }
    60% {
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0)
    }
}

@keyframes zoomInUp {
    0% {
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0)
    }
    60% {
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0)
    }
}

.zoomInUp {
    -webkit-animation-name: zoomInUp;
    animation-name: zoomInUp
}

@-webkit-keyframes zoomOut {
    0% {
        opacity: 1
    }
    50% {
        -webkit-transform: scale3d(.3, .3, .3);
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }
    to {
        opacity: 0
    }
}

@keyframes zoomOut {
    0% {
        opacity: 1
    }
    50% {
        -webkit-transform: scale3d(.3, .3, .3);
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }
    to {
        opacity: 0
    }
}

.zoomOut {
    -webkit-animation-name: zoomOut;
    animation-name: zoomOut
}

@-webkit-keyframes zoomOutDown {
    40% {
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0)
    }
    to {
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
        -webkit-transform-origin: center bottom;
        animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
        transform-origin: center bottom
    }
}

@keyframes zoomOutDown {
    40% {
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0)
    }
    to {
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
        -webkit-transform-origin: center bottom;
        animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
        transform-origin: center bottom
    }
}

.zoomOutDown {
    -webkit-animation-name: zoomOutDown;
    animation-name: zoomOutDown
}

@-webkit-keyframes zoomOutLeft {
    40% {
        -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0)
    }
    to {
        -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
        -webkit-transform-origin: left center;
        opacity: 0;
        transform: scale(.1) translate3d(-2000px, 0, 0);
        transform-origin: left center
    }
}

@keyframes zoomOutLeft {
    40% {
        -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0)
    }
    to {
        -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
        -webkit-transform-origin: left center;
        opacity: 0;
        transform: scale(.1) translate3d(-2000px, 0, 0);
        transform-origin: left center
    }
}

.zoomOutLeft {
    -webkit-animation-name: zoomOutLeft;
    animation-name: zoomOutLeft
}

@-webkit-keyframes zoomOutRight {
    40% {
        -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0)
    }
    to {
        -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
        -webkit-transform-origin: right center;
        opacity: 0;
        transform: scale(.1) translate3d(2000px, 0, 0);
        transform-origin: right center
    }
}

@keyframes zoomOutRight {
    40% {
        -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0)
    }
    to {
        -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
        -webkit-transform-origin: right center;
        opacity: 0;
        transform: scale(.1) translate3d(2000px, 0, 0);
        transform-origin: right center
    }
}

.zoomOutRight {
    -webkit-animation-name: zoomOutRight;
    animation-name: zoomOutRight
}

@-webkit-keyframes zoomOutUp {
    40% {
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0)
    }
    to {
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
        -webkit-transform-origin: center bottom;
        animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
        transform-origin: center bottom
    }
}

@keyframes zoomOutUp {
    40% {
        -webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19);
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0)
    }
    to {
        -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
        -webkit-transform-origin: center bottom;
        animation-timing-function: cubic-bezier(.175, .885, .32, 1);
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
        transform-origin: center bottom
    }
}

.zoomOutUp {
    -webkit-animation-name: zoomOutUp;
    animation-name: zoomOutUp
}

@-webkit-keyframes slideInDown {
    0% {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes slideInDown {
    0% {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.slideInDown {
    -webkit-animation-name: slideInDown;
    animation-name: slideInDown
}

@-webkit-keyframes slideInLeft {
    0% {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes slideInLeft {
    0% {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.slideInLeft {
    -webkit-animation-name: slideInLeft;
    animation-name: slideInLeft
}

@-webkit-keyframes slideInRight {
    0% {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes slideInRight {
    0% {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.slideInRight {
    -webkit-animation-name: slideInRight;
    animation-name: slideInRight
}

@-webkit-keyframes slideInUp {
    0% {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes slideInUp {
    0% {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.slideInUp {
    -webkit-animation-name: slideInUp;
    animation-name: slideInUp
}

@-webkit-keyframes slideOutDown {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: hidden
    }
}

@keyframes slideOutDown {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: hidden
    }
}

.slideOutDown {
    -webkit-animation-name: slideOutDown;
    animation-name: slideOutDown
}

@-webkit-keyframes slideOutLeft {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        visibility: hidden
    }
}

@keyframes slideOutLeft {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        visibility: hidden
    }
}

.slideOutLeft {
    -webkit-animation-name: slideOutLeft;
    animation-name: slideOutLeft
}

@-webkit-keyframes slideOutRight {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        visibility: hidden
    }
}

@keyframes slideOutRight {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        visibility: hidden
    }
}

.slideOutRight {
    -webkit-animation-name: slideOutRight;
    animation-name: slideOutRight
}

@-webkit-keyframes slideOutUp {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        visibility: hidden
    }
}

@keyframes slideOutUp {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        visibility: hidden
    }
}

.slideOutUp {
    -webkit-animation-name: slideOutUp;
    animation-name: slideOutUp
}

.animated {
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-duration: 1s;
    animation-fill-mode: both
}

.animated.infinite {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite
}

.animated.delay-1s {
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

.animated.delay-2s {
    -webkit-animation-delay: 2s;
    animation-delay: 2s
}

.animated.delay-3s {
    -webkit-animation-delay: 3s;
    animation-delay: 3s
}

.animated.delay-4s {
    -webkit-animation-delay: 4s;
    animation-delay: 4s
}

.animated.delay-5s {
    -webkit-animation-delay: 5s;
    animation-delay: 5s
}

.animated.fast {
    -webkit-animation-duration: .8s;
    animation-duration: .8s
}

.animated.faster {
    -webkit-animation-duration: .5s;
    animation-duration: .5s
}

.animated.slow {
    -webkit-animation-duration: 2s;
    animation-duration: 2s
}

.animated.slower {
    -webkit-animation-duration: 3s;
    animation-duration: 3s
}

@media (prefers-reduced-motion) {
    .animated {
        -webkit-animation: unset;
        -webkit-transition: none;
        animation: unset;
        transition: none
    }
}

/********************/
/*       ARROW      */
/********************/
/* Arrow <i class="arrow up|right|left|down"> // FOR SIZE JUSTE PLAY WITH padding:3px <= MORE OR LESS */
.arrow {
    border: solid #000;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 3px;
    -webkit-transition: 300ms ease all;
    -moz-transition: 300ms ease all;
    -o-transition: 300ms ease all;
    transition: 300ms ease all;
}

.arrow.right {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg)
}

.arrow.left {
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg)
}

.arrow.up {
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg)
}

.arrow.down {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg)
}

/***************************/
/*******CLOSE BUTTON********/
/***************************/
/* Close Button */
[class*='close-'] {
    color: #fff;
    font: 14px/100% arial, sans-serif;
    text-decoration: none;
    cursor: pointer;
}

.close-classic:after {
    content: 'X';
}

.close-thin:after {
    content: '×';
}

.close-thik:after {
    content: '✖';
}

/**************************/
/*     TRIANGLE BULLE     */
/**************************/
.triangle-bulle:before {
    content: " ";
    top: -24px;
    right: 28%;
    position: absolute;
    border: solid transparent;
    border-bottom-color: #cccccc;
    border-width: 12px;
    margin-left: -10px;
}

.triangle-bulle:after {
    content: " ";
    width: 0;
    height: 0;
    top: -24px;
    right: 27.8%;
    position: absolute;
    border: solid transparent;
    border-bottom-color: #fff;
    border-width: 13px;
    margin-left: -10px;
}

/********************/
/*     CLEARFIX     */
/********************/
.cf:before, .cf:after {
    content: " ";
    display: table;
}

.cf:after {
    clear: both;
}

.cf {
    *zoom: 1;
}

/********************/
/*     SELECTBOX    */
/********************/
.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none;
    /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.selectbox {
    position: relative;
    height: 52px;
    cursor: pointer;
    display: inline-block
}

.selectbox:hover {
    -webkit-box-shadow: 0 0 0 0 #313131;
    -moz-box-shadow: 0 0 0 0 #313131;
    box-shadow: 0 0 0 0 #313131
}

.selectbox:after {
    content: ' ';
    border: solid #4b4853;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 4px;
    -webkit-transition: .3s ease all;
    -moz-transition: .3s ease all;
    -o-transition: .3s ease all;
    transition: .3s ease all;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    position: absolute;
    top: 20px;
    right: 10px
}

.selectbox.open:after {
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    top: 22px
}

.selectbox ul {
    position: absolute;
    top: 52px;
    left: -1px;
    z-index: 10;
    display: none;
    max-height: 150px;
    overflow-y: scroll;
    overflow-x: hidden;
}

.selectbox.open ul {
    display: block
}

.selectbox, .selectbox ul {
    width: 100%;
    border: 1px solid #cfcfcf;
    background-color: #fff
}

.selectbox span, .selectbox ul li {
    overflow: hidden;
    width: 100%;
    padding-left: 15px;
    line-height: 40px;
    height: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 8px;

}

.selectbox ul li.active, .selectbox ul li:hover {
    background-color: rgba(230, 230, 230, .5)
}

.selectbox, .selectbox * {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

/********************/
/*     MESSENGER    */
/********************/
.messenger {
    display: none;
    z-index: 10000;
    position: fixed;
    top: -100px;
    left: 0;
    width: 100%;
    height: 45px;
    background-color: #56A160;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.25px;
    text-align: center;
}

.messenger .container_msg {
    padding: 15px 20px 0 20px;
    letter-spacing: 1px;
}

.messenger .container_msg a {
    color: #fff;
    float: right;
    cursor: pointer;
    font-size: 17px;
    margin-top: -2px;
}

.messenger_error {
    background-color: #D0021B;
}


/**
 * --------------------------------------------------------------------------------------------------------------------------------------------------------------------
 *
 *  PopIt/LoadIt
 *
 * --------------------------------------------------------------------------------------------------------------------------------------------------------------------
 */
.popit {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.75);
    display: none;
    z-index: 9999;
}

.popitlight {
    background-color: rgba(255, 255, 255, 0.50);
}

.popit .box {
    position: fixed;
    width: 915px;
    top: -3000px;
    left: 50%;
    margin-left: -457.5px;
    background-color: #fff;
}

.popit.w440 .box {
    width: 440px;
    top: -3000px;
    left: 50%;
    margin-left: -220px;
}

.popit.w560 .box {
    width: 560px;
    top: -3000px;
    left: 50%;
    margin-left: -280px;
}

.popit.w790 .box {
    width: 790px;
    top: -3000px;
    left: 50%;
    margin-left: -395px;
}

.popit.absoluteposition .box {
    position: absolute;
}

.popitshort .box {
    width: 610px;
    margin-left: -305px;
}

.popit_addgift .box {
    width: 430px;
    margin-left: -215px;
}

.popit_addlook .box {
    width: 850px;
    margin-left: -425px;
}

.popit_addlook .box .conditionpromo p {
    font-size: 13px;
    text-align: center;
}

.popit .box .popitcloser {
    position: absolute;
    top: 10px;
    right: 15px;
    cursor: pointer;
    font-size: 35px;
    color: #4b4853;
}

.popit .box .popitcontent {
    display: inline-block;
    width: 96%;
    padding: 25px 0 35px 2%;
    font-size: 13px;
}

.popit .box .popitcontent p.title_1 {
    font-size: 24px;
    font-weight: 600;
    color: #4e1f5b;
    letter-spacing: 0.50px;
    padding-bottom: 35px;
}

.popit .box .popitcontent b {
    font-weight: 700;
}

.nsloader {
    color: #4e1f5b;
    margin-top: -24px;
    position: absolute;
    text-align: center;
    top: 1200px;
    width: 100%;
    z-index: 1000;
}

.popit_addbasket p,
.popit_addgift p {
    font-size: 13px;
    color: #4e1f5b;
    font-weight: 400;
    letter-spacing: 0.50px;
}

.popit_addbasket p b {
    font-weight: 700;
}

.popit_addgift p b span,
.popit_addbasket p b span {
    color: #eb0b5f;
}

.popit_addbasket p.title {
    font-size: 22px;
    color: #4e1f5b;
    font-weight: 300;
    letter-spacing: 1px;
}

.popit_addgift p.title {
    font-size: 22px;
    line-height: 24px;
    color: #4e1f5b;
    font-weight: 300;
    letter-spacing: 1px;
    text-align: center;
}

.popit_addgift .justaddedproduct {
    text-align: center;
}

.popit_addgift .justaddedproduct img {
    height: 190px;
    border: 1px solid #e0e0e0;
}

.popit_addgift .justaddedproduct p {
    color: #4e1f5b;
    font-weight: 700;
    padding: 10px 0;
}

.popit_addgift .justaddedproduct p.description {
    color: #3d3c3c;
    font-weight: normal;
    padding: 10px 0;
    width: 80%;
    margin: 0 auto;
}

.popit_addbasket .justaddedproduct .packshot {
    float: left;
    width: 225px;
    margin-right: 20px;
    text-align: center;
    border: 1px solid #e0e0e0;
}

.popit_addbasket .justaddedproduct .packshot a {
    display: inline-block;
}

.popit_addbasket .packshot img {
}

.popit_addbasket .justaddedproduct .productpreview {
    float: left;
    width: 630px;
    height: auto;
    border: none;
    text-align: left;
}

.popit_addbasket .justaddedproduct .productpreview .commerce {
    height: 90px;
}

.popit_addbasket .justaddedproduct .productpreview .popaddabsketmessenger {
    position: absolute;
    right: 65px;
    top: 116px;
}

.popit_addbasket .justaddedproduct_cta {
    margin-top: -48px;
    width: 630px;
    padding: 0 0 0 245px;
}

.popit_addbasket ul.title {
    margin-bottom: 0;
}

.popit_addbasket ul.title li {
    font-size: 18px;
}

.popit_addbasket ul.advicespushproducts li {
    float: left;
    width: 50%;
}

.popit_addbasket ul.advicespushproducts li .packshot {
    float: left;
    width: 165px;
    margin-right: 20px;
    text-align: center;
    border: 1px solid #e0e0e0;
}

.popit_addbasket ul.advicespushproducts li .packshot img {
    height: 130px !important;
    width: auto !important;
}

.popit_addbasket ul.advicespushproducts li .productpreview {
    float: left;
    width: 230px;
    height: auto;
    border: none;
    text-align: left;
}

.popit_addbasket ul.advicespushproducts li .commerce {
    height: auto;
}

.popit.w560 .box {
    width: 560px;
    top: -3000px;
    left: 50%;
    margin-left: -280px;
}

@media screen and ( max-width: 1056px ){
    .popinAddbasket.popit .box{
        width: calc(100% - 20px);
        margin-left: unset;
        left: 10px;
    }
}
.popConnexion .box {
    background-color: #fff;
}

.popConnexion .box .bg_pink {
    background-color: #fff;
}

.popConnexion .content_create {
    padding: 0 5%;
}

.popConnexion .content_login {
    padding: 0 20%;
}

.popRateproduct textarea {
    height: 150px;
}
.popinAddbasket .grey{
    color: #959595;
    font-family: "Inter Tight";
}
.popinAddbasket .product_add {
    display: flex;
    padding: 16px;
    gap: 16px;
    border: 1px solid #F1EDE8;
}
.popinAddbasket .contenance {
    color: #959595;
}
.popinAddbasket .product .cta-grey {
    width: 100%;
}

.popinAddbasket .ctaAdd {
    padding: 6px 16px;
}
.popinAddbasket .ctaAdd svg{
    margin-left: 8px;
}

.popinAddbasket img {
    width: 110px;
}
.popinAddbasket .box{
    overflow: hidden;
}
.popinAddbasket .product_suggestion {
    display: flex;
    gap: 16px;
    overflow: scroll;
}

.pop_newsletter .box{
    background-color: transparent;
    width: 450px;
    margin-left: -225px;
}
.pop_newsletter .box .popitcontent{
    padding: unset;
    width: 100%;
}
.pop_newsletter .box .popitcloser{
    z-index: 1;
}
.popin-newsletter-container{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    max-width: 450px;
    text-align: center;
}
.popin-newsletter-container .visuel{
    width: 100%;
}
.popin-newsletter-container .popin-newsletter-textblock{
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    margin: auto;
    width: calc(100% - 20px);
    height: 100%;
    box-sizing: border-box;
    padding-top: 20px;
}
.popin-newsletter-container .popin-newsletter-intro{
    color: #FFFFFF;
    font-size: 25px;
    line-height: 35px;
    font-family: 'PlayfairDisplay', sans-serif;
    margin-top: 40px;
}
.popin-newsletter-container .popin-newsletter-intro b{
    font-family: 'Inter Tight bold', sans-serif;
    font-size: 35px;
    line-height: 45px;
}
.popin-newsletter-container .popin-newsletter-offers{
    color: #FFFFFF;
    font-family: 'Inter Tight SemiBold', sans-serif;
    margin-top: 20px;
    font-size: 11px;
}
.popin-newsletter-container .popin-newsletter-mentions{
    color: #FFFFFF;
    text-align: left;
    position: absolute;
    bottom: 10px;
    font-size: 9px;
    width: calc(100% - 20px);
}
.popin-newsletter-container form{
    width: 100%;
    max-width: 365px;
    margin: 0 auto;
}
.popin-newsletter-container form .form-title{
    color: #FFFFFF;
    font-size: 24px;
    line-height: 24px;
}
.popin-newsletter-container input[type="email"].inputnew::placeholder{
    color: #FFFFFF;
}
.popin-newsletter-container input[type="email"].inputnew {
    background-color: inherit;
    color: #FFFFFF;
    text-align: left;
    max-width: 270px;
    margin-top: 10px;
}
@media screen and (max-width: 768px) {
    .pop_newsletter .box{
        width: calc(100% - 20px);
        margin-left: auto;
        left: 10px;
        max-width: 100%;
    }
    .popin-newsletter-container{
        max-width: unset;
    }
    .popin-newsletter-container .popin-newsletter-intro{
        font-size: 19px;
        line-height: 25px;
        margin-top: 25px;
    }
    .popin-newsletter-container .popin-newsletter-intro b{
        font-size: 26px;
        line-height: 30px;
    }
    .popin-newsletter-container form .form-title{
        font-size: 20px;
    }
    .popin-newsletter-container .popin-newsletter-mentions{
        position: relative;
        margin-top: 10px;
        bottom: unset;
    }
}


.pop_fidelity .popitcontent {
    padding: 0 !important;
    width: 100% !important;
}


.pop_fidelity form {
    padding: 0 10px 30px 0;
}

/***************************/
/**********SPRITE**********/
/***************************/
.sprite {
    background-image: url('../images/ui/sprite.png');
    background-repeat: no-repeat;
}

.sprite.map {
    background-position: 0 0;
    background-size: 160px;
}

.sprite.paypal {
    background-position: -89px 7px;
    background-size: 300px;
}

.sprite.francais {
    background-position: -180px -34px;
    background-size: 238px;
}

.sprite.spain {
    background-position: -209px -34px;
    background-size: 238px;
}

.sprite.anglais {
    background-position: -147px -34px;
    background-size: 238px;
}

.sprite.russe {
    background-position: -116px -34px;
    background-size: 238px;
}

.sprite.chinois {
    background-position: -81px -34px;;
    background-size: 238px;
}


/***************************************/
/*          PARAMETRES GAMMES          */
/***************************************/
.bgGamme.em {background-color: #f1f2f7;}
.txt.em {color: #0032A0;}
.iframe.em svg path{ stroke: #f1f2f7;}

.bgGamme.ro {background-color: #ffdfec;}
.txt.ro {color: #D00070;}
.iframe.ro svg path{ stroke: #ffdfec;}

.txt.prog-demaquillage{color: #D00070;}

.txt.prog-hydratation{color: #0032A0;}

.bgGamme.ra {background-color: #fcecff;}
.txt.ra {color: #87189D;}
.iframe.ra svg path{ stroke: #fcecff;}


.bgGamme.ma {background-color: #e5fff5;}
.txt.ma {color: #00AF66;}
.iframe.ma svg path{ stroke: #e5fff5;}


.bgGamme.rm {background-color: #f8ffeb;}
.txt.rm {color: #67823A;}
.iframe.rm svg path{ stroke: #f8ffeb;}


.bgGamme.ah {background-color: #fff7e0;}
.txt.ah {color: #A78C64;}
.iframe.ah svg path{ stroke: #fff7e0;}


.bgGamme.mu {background-color: #ffdde9;}
.txt.mu {color: #AC145A;}
.iframe.mu svg path{ stroke: #ffdde9;}


.bgGamme.hu {background-color: #F5E0CF;}
.txt.hu {color: #EB586B;}
.iframe.hu svg path{ stroke: #F5E0CF;}


.bgGamme.ab {background-color: #ffede1;}
.txt.ab {color: #FF8A3D;}
.iframe.ab svg path{ stroke: #ffede1;}


.bgGamme.va {background-color: #F1EECA;}
.txt.va {color: #85431E;}
.iframe.va svg path{ stroke: #F1EECA;}


.bgGamme.pa {background-color: #fde5de;}
.txt.pa {color: #FFA38B;}
.iframe.pa svg path{ stroke: #fde5de;}


.bgGamme.pc {background-color: #fff;}
.txt.pc {color: #001C2B;}
.iframe.pc svg path{ stroke: #fff ;}


.bgGamme.bu {background-color: #ffb66a;}
.iframe.bu svg path{ stroke: #ffb66a;}


.bgGamme.go {background-color: #ffede1;}
.iframe.go svg path{ stroke: #ffede1 ;}



.bgGamme.ho {background-color: #F3E3DD;}
.txt.ho {color: #FC5560;}
.iframe.ho svg path{ stroke: #F3E3DD;}



/*****************************/
/*          GENERAL          */
/*****************************/
.container.isWysiwyg{
    overflow: hidden;
}
.h2_item {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.titleinfoliv {
    font-family: 'PlayfairDisplay';
    width: 45%;
    padding: 15px 8px;
    margin: auto;
}

.theme_title {
    font-size: 32px;
    line-height: 37px;
    letter-spacing: 1px;
    font-family: 'Inter Tight Medium';
    margin-bottom: 25px;
    text-align: center;
    font-weight: 500;
}

.theme_title.wline:before,
.theme_title.wline:after {
    content: '';
    width: 40px;
    height: 1.2px;
    background-color: #000;
    display: inline-block;
    vertical-align: middle;
}

.theme_title.wline:before {
    margin-right: 20px;
}

.theme_title.wline:after {
    margin-left: 20px;
}

.textwithborder {
    font-family: 'PlayfairDisplay';
    display: block;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    color: #000;
    position: relative;
    line-height: 20px;
    letter-spacing: 1px;
}

.textwithborder:before {
    content: ' ';
    border-top: 1px solid #4b4853;
    position: relative;
    top: 12px;
    display: block;
    width: 100%;
    height: 1px;
    background: none !important;
}

.textwithborder em {
    text-decoration: none;
    font-style: normal;
    display: inline-block;
    position: relative;
    padding: 0 7px;
}

.soulignleft:after {
    content: '';
    width: 55px;
    height: 1px;
    background-color: #000;
    display: block;
    margin-top: 15px;
}

.soulignleft.pink:after {
    height: 3px;
    width: 80px;
    background-color: #F1D3CB;
}

.pastille {
    font-size: 9px;
    width: 15px;
    height: 15px;
    text-align: center;
    line-height: 14px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    display: inline-block;
    vertical-align: middle;
    font-style: normal;
    border: 1px solid;
}

.pastille.pink {
    background-color: #d9b9b1;
    border-color: #d9b9b1;
    color: #fff;
}

.addtofav {
    transition: all 0.2s ease-in-out;
}

.addtofav.active p {
    color: #E2C2BA;
}
.addtofav.active svg{
    fill: #E2C2BA;
}
.addtofav.active svg path{
    stroke: #E2C2BA;
}

.go-up {
    width: 45px;
    height: 45px;
    line-height: 44px;
    text-align: center;
    color: #000;
    font-size: 17px;
    background: rgba(255, 255, 255, 0.60);
    border: 1px solid rgba(0, 0, 0, 0.4);
    margin-bottom: 25px;
    cursor: pointer;
    position: fixed;
    bottom: 0;
    right: 10px;
    z-index: 100;
    display: block;
}

/***************+++*************/
/*          DOOFINDER          */
/***************+++*************/
#doofindercontainer .df-classic {
    height: auto !important;
    min-height: inherit !important;
    max-height: 485px !important;
    font-size: 13px !important;
    color: #3d3c3c !important;
    border: 0 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    position: static !important;
    width: 100% !important;
}

#doofindercontainer .df-classic .df-header {
    height: auto !important;
    border: none !important;
}

#doofindercontainer .df-classic .df-header .closedoofinder {
    position: absolute;
    right: 10px;
    top: 5px;
}

#doofindercontainer .df-classic .df-header span[data-role="total"] {
    color: #000 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    letter-spacing: 0.75px;
    margin: 20px auto 0;
}

#doofindercontainer .df-classic .df-results ul {
    width: 100% !important;
    height: 100% !important;
    overflow: hidden;
}

#doofindercontainer .df-classic .df-results li {
    border-top: 1px solid #f2f2f2;
}

#doofindercontainer .df-classic .df-results li:first-child,
#doofindercontainer .df-classic .df-results li:last-child {
    border-top: 0;
}

#doofindercontainer .df-classic .df-results li a {
    width: 100% !important;
    display: block;
}

#doofindercontainer .df-classic .df-results li a:not(.arrowlink) {
    padding-left: 0;
    padding-right: 0;
}

#doofindercontainer .df-classic .df-results li .packshot {
    display: inline-block;
    vertical-align: middle;
    width: 20%;
}

.df-classic[data-layout="grid"] [data-role="placeholder"] {
    border: 0;
}

#doofindercontainer .df-classic .df-results li .packshot img {
    width: 100%;
}

#doofindercontainer .df-classic .df-results li .description {
    display: inline-block;
    width: 75%;
    vertical-align: middle;
    margin-left: 5%;
}

#doofindercontainer .df-classic .df-results li .description p.gamme .drapeau {
    width: 30px;
    height: 20px;
    display: inline-block;
    vertical-align: top;
}

#doofindercontainer .df-classic .df-results li a.arrowlink {
    color: #fff;
    width: 70% !important;
    margin-left: auto;
    margin-right: auto;
    font-size: 12px;
}

#doofindercontainer .df-classic .df-results li a.arrowlink .fa {
    font-weight: bold;
    margin-right: 7.50px;
}

#doofindercontainer .commerce {
    color: #a0a0a0;
    font-size: 17px;
    margin-top: 10px;
}

#doofindercontainer .title {
    font-size: 17px;
    font-family: 'AmericanTypewriter';
    margin-top: 10px;
    line-height: 15px;
    text-transform: capitalize;
}

#doofindercontainer .gamme {
    color: #a0a0a0;
    font-size: 12px;
}

/****************************/
/*          HEADER          */
/****************************/

header {
    position: relative;
    transition: all .3s;
    background-color: #FFF;
}
header.sticky {
    position: fixed;
    animation: slideDown 0.35s ease-out;
    width: 100%;
    z-index: 2000;
    border-bottom: 1px solid #cccccc;
}
@keyframes slideDown {
    from {
        transform: translateY(-100%);
    }
    to {
        transform: translateY(0);
    }
}
header .top {
    display: flex;
    justify-content: space-between;
    gap: 70px;
    align-items: center;
    max-width: 1512px;
    margin: 0 auto;
    background-color: #FFF;
    padding: 0 24px;
    box-sizing: border-box;
    color: #111;
}
header .top .right{
    display: flex;
    gap: 32px;
    align-items: center;
}
header .top .logo img{
    width: 140px;
    height: auto;
}
header .top .left{
    display: flex;
    gap: 68px;
    align-items: center;
    font-family: 'PlayfairDisplay',sans-serif;
    font-size: 17px;
    font-style: italic;
    font-weight: 400;
    line-height: 20px;
    color: #111;
}
header .top .svg-container{
    display: flex;
    gap: 16px;
}
header .top .add-fav,
header .top .add-cart{
    position: relative;
}
header .top .add-fav:after,
header .top .add-cart:after{
    content: attr(data-qte);
    position: absolute;
    top: -8px;
    right: -6px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: #F3E3DD;
    color: #111111;
    font-size: 11px;
    display: flex;
    font-style: normal;
    justify-content: center;
    align-items: center;
    font-family: 'Inter Tight Semibold',sans-serif;
}
header .bottom{
    background-color: #333333;
    text-align: center;
}
header .bottom p{
    padding: 5px 0;
    color: #F2F1ED;
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: 0.36px;
}

header .meganav .main {
    justify-content: center;
    gap: 32px;
}

header .meganav .main .mainElement p {
    padding: 25px 0;
    overflow: hidden;
    position: relative;
    z-index: 14;
}
header .meganav .main .mainElement a {
    color: #111;
}
header .meganav .main .mainElement a[data-code="coffrets-cadeaux"],
header .meganav .main .mainElement a[data-code="coffrets-beaute"] {
    color: #e0b4ab;
    font-style: italic;
    font-weight: bold;
}


header .meganav .main .categorie a {
    display: block;
    color: #111;
}
body.fr_FR header .meganav .main .categorie a span{
    text-transform: lowercase;
}
header .meganav .souscategorie {
    background-color: #fff;
    left: 50%;
    position: absolute;
    width: 100vw;
    padding: 10px 0 0;
    top: 55px;
    z-index: 2;
    transform: translateX(-50%);
    visibility: hidden;
    transition: all 0.3s ease;
    transition-delay: .32ms;
    transition-property: opacity;
}
header .meganav .main .mainElement p:hover ~ .souscategorie,
header .meganav .main .mainElement p ~ .souscategorie:hover{
    top: 70px;
    z-index: 11;
    visibility: visible;
    opacity: 1;
}
header .meganav .souscateg_content {
    max-width: 1460px;
    width: 100%;
    margin: auto;
    padding: 32px 40px 24px;
    display: flex;
    justify-content: space-between;
}

header .meganav .souscateg_content .categ-left{
    display: flex;
    gap: 32px;
}
header .meganav .souscateg_content ul:nth-child(2) {
    margin-left: 0;
}

header .meganav .souscateg_content li:not(.titre_souscateg) {
    color: #4b4853;
    font-size: 14px;
    letter-spacing: 0.5px;
    font-weight: 100;
}
header .meganav .souscateg_content li:not(.titre_souscateg) svg{
    display: none;
}
header .meganav .souscateg_content .visuel{
    padding-right: 10px;
}
header .meganav .souscateg_content .visuel img {
    width: 450px;
}

header .meganav .souscategorie .link_all {
    padding: 10px 0;
    border-top: 1px solid #cccccc;
    letter-spacing: 0.5px;
}

header .meganav .souscategorie .link_all .fleche {
    font-size: 10px;
}

header .meganav .souscategorie .link_all .fleche {
    font-size: 10px;
}

header .openSearch:focus #f_search {
    display: block;
}
header .close-search svg{
    width: 24px;
    height: 24px;
}
header .icon-search.hide,
header .close-search.hide{
    display: none;
    transition: all .3s ease-in-out;
}
header #f_search {
    background-color: #fff;
    position: absolute;
    right: 35px;
    top: 68px;
    width: 530px;
    border: 1px solid #cccccc;
    padding: 40px;
    box-sizing: border-box;
    z-index: 1;
    font-size: 0;
    text-align: left;
    box-shadow: 0 1px 3px #d8d8d8;
    visibility: hidden;
    transition: 0.5s;
    opacity: 0;
}

header #f_search.active {
    opacity: 1;
    visibility: visible;
}

header #f_search input {
    border: 1px solid #cccccc;
    width: 90%;
    border-right: 0;
    padding: 0 20px;
}

header #f_search input,
header #f_search svg {
    height: 45px;
    vertical-align: top;
    box-sizing: border-box;
}

header #f_search svg {
    background-color: #000;
    width: 44px;
    cursor: pointer;
    padding: 10px;
}
header #f_search svg path{
    stroke: #ffffff;
}

/****************************/
/*          FOOTER          */
/****************************/
footer {
    z-index: 1;
    position: relative;
    overflow: hidden;
}

footer .informations {
    justify-content: space-between;
    flex-wrap: wrap;
    color: #707070;
    max-width: 1512px;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 40px 62px 50px;
}
footer .informations .logo{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    margin-top: 37px;
}
footer .informations li{
    margin: 0 0 14px;
}
footer .informations li:not(.title) {
    font-size: 12px;
    letter-spacing: 1px;
    line-height: 19px;
}
footer .informations li a {
    color: #707070;
}
footer .informations li a:hover {
    text-decoration: underline;
}

footer .informations .title {
    line-height: 24px;
    font-size: 14px;
}

footer .bottom{
    border-top: 1px solid #EBE9E1;
    color: #111;
    padding: 0 24px;
}
footer .bottom .wrapper{
    max-width: 1512px;
    margin: 0 auto;
}
footer .bottom p{
    white-space: nowrap;
    padding: 16px 24px;
    line-height: 24px;
}
footer .bottom .bloc{
    position: relative;
    border-left: 1px solid #EBE9E1;
    cursor: pointer
}
footer .bottom .bloc:hover .svg-container{
    bottom: 0;
}
footer .bottom .bloc:nth-child(2){
    border-right: 1px solid #EBE9E1;
}
footer .bottom .toggle .svg-container{
    display: flex;
    gap: 5px;
    justify-content: center;
    align-items: center;
    padding: 0 5px;
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: #fff;
    bottom: -100px;
    box-sizing: border-box;
    transition: 0.4s ease;
}
footer .bottom .toggle .svg-container svg {
    width: 24px;
    height: 24px;
    border-radius: 4px;
    background-color: #F4F4F4;
    padding: 0 8px;
    cursor: inherit;
}
footer .selectbox{
    width: 157px;
}
body.en_EN footer .selectbox{
    width: 187px;
}
footer .selectbox,
footer .selectbox ul{
    border: inherit;
}
footer .selectbox ul{
    top: -155px;
}
footer .selectbox span a,
footer .selectbox ul a{
    display: flex;
    align-items: center;
    gap: 8px;
}
footer .selectbox p{
    padding: inherit;
    line-height: inherit;
}
.social {
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

/****************************/
/*        BREADCRUMB        */
/****************************/
.breadcrumb{
    color: #5A5A5A;
    font-feature-settings: 'calt' off, 'liga' off;
    font-size: 12px;
    font-weight: 400;
    line-height: 24px;
    margin-top: 16px;
    padding: 0 24px;
}
.breadcrumb ul{
    display: flex;
    align-items: center;
}
.breadcrumb ul li:first-child a{
    text-decoration: underline;
}
@media screen and (max-width: 1024px) {
    .breadcrumb{
        text-align:center;
        margin-top: 10px;
        padding: 0 16px;
    }
    .breadcrumb ul li:first-child a{
        font-family: "Inter Tight Semibold";
        text-decoration: underline;
    }
}
/****************************/
/*        FEED INSTA        */
/****************************/
.feed-insta{
    max-width: 1512px;
    margin: 128px auto 100px;
    overflow: hidden;
    padding-left: 148px;
    position: relative;
    padding: 10px;
}
.feed-insta .head-slider{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-right: 24px;
}
.feed-insta .head-slider button{
    cursor: pointer;
    transition: all .3s ease;
}
.feed-insta .head-slider .slick-arrow.slick-disabled path{
    stroke: #CFCFCF;
    cursor: none;
}
.feed-insta .slider-insta{
    padding: 20px 0;
}
.feed-insta .slider-insta .slick-track{
    display: flex;
    gap: 24px;
}
.feed-insta img{
    width: 100%;
    height: auto;
}
.feed-insta .link-insta{
    display: block;
    color: #9C9C9C;
    text-align: right;
    font-size: 62px;
    font-style: italic;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: -1.08px;
    padding: 0 130px;
}
@media screen and (max-width: 1024px) {
    .feed-insta{
        margin: 80px auto;
        overflow: hidden;
        padding: 0 24px;
        position: relative;
    }
    .feed-insta .head-slider{
        flex-direction: column;
        align-items: flex-start;
        padding-right: 0;
        gap: 16Px
    }
    .feed-insta .head-slider p{
        font-size: 50px;
    }
    .feed-insta .link-insta{
        padding: 24px;
        font-size: 36px;
    }
}
/****************************/
/*          REASSURANCE     */
/****************************/
.reassurance{
    background-color: #F3E3DD;
    padding: 32px 0;
}
.reassurance .wrapper{
    max-width: 1012px;
    width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
}
.reassurance h2{
    font-size: 72px;
    line-height: 81%;
    text-align: center;
    margin-bottom: 48px;
}
.reassurance h2 span{
    font-style: italic;
    font-weight: 400;
    text-transform: initial;
}
.reassurance .benefits-bloc{
    display: flex;
    justify-content: space-between;
}
.reassurance .benefits-bloc .textblock{
    display: flex;
    line-height: 16px;
    gap: 8px;
    white-space: nowrap;
}
.reassurance .benefits-bloc .textblock span{
    text-transform: initial;
}
/******************************/
/*          HOMEPAGE          */
/******************************/

.allProducts .sliderNav {
    justify-content: space-between;
    width: 600px;
    margin: auto;
}

.allProducts .sliderNav p {
    font-size: 17px;
    letter-spacing: 1px;
    font-family: 'PlayfairDisplay';
    cursor: pointer;
}

.allProducts .sliderNav p.active {
    font-weight: 900;
    padding-bottom: 10px;
}

.allProducts .soulignonglet {
    content: '';
    width: 80px;
    height: 1px;
    background-color: #000;
    display: block;
    margin-top: 5px;
    position: relative;
    transition: 0.5s;
    left: 310px;
}
body.en_EN .allProducts .soulignonglet {
    left: 290px;
}

.allProducts .content_slider_product {
    display: none;
}

.allProducts .content_slider_product[rel="1"] {
    display: block;
}
.allProducts .product {
    width: 250px!important;
}

.soulignement:after {
    content: '';
    width: 55px;
    height: 1px;
    background-color: #fff;
    display: block;
    margin: 7px auto 0;
    transition: 0.1s;
}

.soulignement.black:after {
    background-color: #000;
}

.soulignement.pink:after {
    background-color: #F1D3CB;
}

.nouvel_imaginaire .philosophie {
    width: 350px;
    height: 558px;
}

.nouvel_imaginaire .philosophie .visuel {
    background: url(/medias/homepage/philosophie.jpg) no-repeat;
    background-size: cover;
    z-index: -1;
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transition: all 0.5s;
}

.nouvel_imaginaire .philosophie:hover .visuel {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

.nouvel_imaginaire .carre li {
    width: 250px;
}

.nouvel_imaginaire .content_philosophie {
    width: 350px;
    height: 558px;
}

.nouvel_imaginaire .philosophie a {
    width: 100%;
    height: 100%;
    flex-direction: column;
}

.nouvel_imaginaire .philosophie .txt_philo {
    margin-top: 370px;
    opacity: 0.6;
}

.nouvel_imaginaire .transparence {
    align-self: flex-end;
}

.nouvel_imaginaire .transparence img {
    margin: auto;
    display: block;
}

.nouvel_imaginaire .transparence .knowmore:after {
    background-color: #000;
}

.excellence .visuel {
    background: url(/medias/homepage/excellence.jpg) no-repeat;
    background-size: 100%;
    background-position: center;
}

.excellence .visuel .textblock {
    background-color: #fff;
    width: 315px;
    margin: auto;
    padding: 25px 40px;
    line-height: 20px;
}

.chic_blog .article {
    width: 48%;
}

.chic_blog .article img {
    width: 240px;
    height: 200px;
    object-fit: cover;
}

.chic_blog .article .name {
    padding: 12px 22px;
}

.chic_blog .article:nth-child(1) .name,
.chic_blog .article:nth-child(2) .name {
    top: 20px;
    left: 150px;
}

.chic_blog .article:nth-child(3) .name,
.chic_blog .article:nth-child(4) .name {
    top: 20px;
    right: 150px;
}

.chic_blog .article .text {
    line-height: 16px;
    padding: 0 5px 0 15px;
    height: 100px;
    margin-top: 120px;
}

.chic_blog .flexbox {
    flex-wrap: wrap;
}

.club_ambassadeur .bloc {
    height: 295px;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    overflow: hidden;
}

.club_ambassadeur .bloc .visuel {
    background: url(/medias/homepage/club_ambassadeur.jpg) no-repeat;
    background-size: cover;
    background-position: center;
    z-index: -1;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transition: all 0.5s;
}

.club_ambassadeur .bloc:hover .visuel {
    transform: scale(1.1);
}

.club_ambassadeur .main {
    text-shadow: 2px 2px 6px #a88171;
}


.allProducts .bx-wrapper {
    margin: auto;
}

.allProducts .bx-wrapper .bx-controls-direction a {
    text-indent: 0;
    width: auto;
    height: auto;
    top: 40%;
    margin-top: 0;
    font-size: 32px;
    z-index: 1;
}

.allProducts .bx-wrapper .bx-controls-direction .bx-prev {
    left: -30px;
}

.allProducts .bx-viewport {
    height: auto !important;
    padding-bottom: 20px;
}

.allProducts .bx-wrapper .bx-controls-direction .bx-next {
    right: -30px;
}

.nouvel_imaginaire .carre {
    width: 540px;
}

.nouvel_imaginaire .carre li img {
    transition: transform .5s;
}

.nouvel_imaginaire .carre li img:hover {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

.nouvel_imaginaire .carre li {
    width: 250px;
}

.instafeed ul {
    display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;      /* TWEENER - IE 10 */
    display: -webkit-flex;     /* NEW - Chrome */
    display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
    flex-wrap: wrap;
}

.instafeed li {
    width: 16.666%;
    height: 16.666vw;
    box-sizing: border-box;
}

.instafeed li img {
    height: 100%;
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    transition: 0.2s;
    box-sizing: border-box;
}

.instafeed li:hover img {
    filter: grayscale(0);
    -webkit-filter: grayscale(0);
    -moz-filter: grayscale(0);
    -ms-filter: grayscale(0);
    -o-filter: grayscale(0);
}

.instafeed li:hover {
    border: 5px solid #fff;
}

.reseaux_sociaux .theme_title a:hover {
    color: #d9b9b1;
}

/*************************************/
/*          PAGE CONNECTION          */
/*************************************/
.register .content_register {
    background: url(/medias/account/bg_register.jpg) no-repeat;
    background-position: top left;
    background-size: 52% auto;
}

.register .bloc_formulaires {
    width: 625px;
}

.register .head .connexion span {
    border-right: 2px solid #000;
}

.register p.connexion.active,
.register p.inscription.active {
    font-weight: 900;
}

.register p.connexion.active:after,
.register p.inscription.active:after {
    content: '';
    width: 100px;
    height: 1px;
    background-color: #000;
    display: block;
    margin: 10px auto 0;
}

.content_create {
    padding: 0 13%;
}

.content_login {
    padding: 0 25%;
}

/***********************************/
/*          COMPTE CLIENT          */
/***********************************/
.dashboard_g,
.dashboard {
    width: 200px;
}
.dashboard_g{
    position: sticky;
    top: 100px;
    overflow-y: hidden;
    width: fit-content;
}
.account_left {
    width: 720px;
}

.points_count {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background-color: #333333;
    color: #fff;
    text-align: center;
    font-size: 14px;
    font-family: 'PlayfairDisplay';
    line-height: 41px;
    letter-spacing: 1px;
}

.account .dashboard li {
    padding: 3px 0 3px 10px;
}

.account .dashboard li.active {
    border-left: 1px solid #000;
}

.account_left {
    width: 670px;
    min-height: 300px;
}

.line_order {
    border: 1px solid #e5e5e5;
}

.line_order.encours .statut {
    color: #c59286;
}

.line_order .statut.received {
    color: #089433;
}

.encart_fidelite {
    background: url(/medias/account/programme_fidelite.jpg) no-repeat;
    background-position: center;
    background-size: cover;
}

.account .all_points {
    justify-content: space-between;
}

.account .all_points .carre {
    width: 215px;
}

.account .all_points .carre img {
    width: 100%;
    transition: transform .7s;
}

.account .all_points .carre .description {
    background-color: #333333;
    height: 185px;
    line-height: 17px;
    letter-spacing: 1.3px;
}

.account .all_points .carre .points_count {
    top: 100px;
    right: 10px;
}

.account .question .reponse.displaynone {
    transition: 0.5s;
}
.account:has(.notauthentified){
    padding-bottom: 0;
}
.account .notauthentified .programme{
    display: flex;
    align-items: center;
    gap: 40px;
}
.account .notauthentified .programme .textblock {
    max-width: 440px;
    max-height: 432px;
}
.account .notauthentified .programme .textblock p:first-child span{
    color: #E0B4AB;
}
.account .notauthentified .programme .textblock .cta {
    font-size: 14px;
}
.account .notauthentified .programme .textblock .cta svg{
    width: 20px;
    height: 20px;
}
.account .notauthentified .programme .textblock .cta svg path{
    stroke: #fff;
}
.account .notauthentified .title_fidelity{
    color: #FFF;
    font-family: 'Outfit';
    font-size: 34px;
    line-height: 81%;
    text-transform: uppercase;
    text-align: center;
    margin-bottom: 48px;
}
.account .notauthentified .title_fidelity span{
    color: #333;
    text-transform: none;
    font-style: italic;
}
.account .notauthentified .step_fidelity{
    padding: 48px 0;
    background-color: #E0B4AB;
}
.account .notauthentified .step_fidelity .all_points {
    display: flex;
    justify-content: center;
    gap: 16px;
    padding-bottom: 32px;
}
.account .notauthentified .all_points .carre{
    width: 356px;
}
.account .notauthentified .all_points .carre .description_fidelity{
    display: flex;
    gap: 16px;
    flex-direction: column;
}
.account .notauthentified .all_points .carre .description_fidelity p:nth-child(2){
    color: #4B4853;
}
.account .history .detailsOrder {
    background-color: #F9F9F9;
    padding: 45px 35px;
    box-sizing: border-box;
    display: none;
}

.account .history .detailsOrder .titre {
    font-family: 'AmericanTypewriter';
    font-size: 13px;
    padding-bottom: 10px;
    border-bottom: 1px solid #DCDCDC;
    letter-spacing: 0.5px;
}

.account .history .detailsOrder ul {
    font-size: 0;
    letter-spacing: 0;
}

.account .history .detailsOrder li {
    width: 25%;
    display: inline-block;
    padding: 0 5px;
    margin-top: 20px;
    box-sizing: border-box;
    vertical-align: top;
}

.account .history .detailsOrder li img {
    width: 100%;
}

.account .history .detailsOrder li p {
    font-family: "AmericanTypewriter";
    font-size: 12px;
    text-align: center;
    line-height: 18px;
    margin-top: 10px;
}

.account .history .detailsOrder li p span {
    font-family: "GillSans";
    font-size: 13px;
    color: #9C9C9C;
}

.account .history .detailsOrder .icon-paypal {
    font-size: 20px;
    margin-left: -10px;
}
.account .history .line_order .all_ctas {
    display: flex;
}

/****************************/
/*          TUNNEL          */
/****************************/
.form_zeroeuro{
    box-sizing: border-box;
    background-color: #fff;
    padding: 48px 20px;
    height: fit-content;
    position: sticky;
    top: 67px;
    overflow-y: hidden;
}
.form_zeroeuro > *:not(h1){
    display: inline-block;
    vertical-align: middle;
}
.formtitle{
    display: block;
    width: 100%;
    font-size: 20px;
    text-align: center;
    margin-bottom: 20px;
}
.form_zeroeuro .icon-panier{
    font-size: 40px;
    margin-right: 30px;
}
.form_zeroeuro input[type="text"]{
    border: 1px solid #999999;
    padding: 7px 15px;
}
.form_zeroeuro a{
    width: 50px;
    height: 40px;
    line-height: 20px;
    margin-top: 15px ;
}
.form_zeroeuro .f_el .formvalidator_error{
    font-size: 11px;
    position:absolute;
}
.basket {
    background: rgba(243, 227, 221, 0.50);
    padding: 96px 0;
}
.basket .content{
    display: flex;
    gap: 24px;
}
#basket_payment .form_zeroeuro{
    margin-top: 30px;
}
#basket_payment .form_zeroeuro input[type="text"]{
    width: 360px;
}
.basket_g {
    width: 880px;
}
.basket .crosssell .cta-grey{
    padding: 6px 16px;
    display: flex;
    align-items: center;
    gap: 8px
}
.basket .crosssell .product_line .info{
    gap: 0;
}
.basket .crosssell .product_line {
    margin-bottom: 16px;
}
.basket .crosssell .product_line:last-child {
    margin-bottom: 0;
}
.basket .crosssell .product_line .info .price .prix{
    display: flex;
    align-items: center;
    gap: 12px;
}
.basket .check-echantillons{
    border: 1px solid #F1EDE8;
    padding: 24px
}
.basket_payment .back{
    gap: 8px;
    font-size: 14px;
    line-height: 20px;
    color: #181818;
    opacity: 0.6;
    margin-bottom: 24px;
}
.basket_payment .back:hover{
    text-decoration: underline;
}
.basket_payment .back svg{
    width: 20px;
    height: 20px;
}

.basket_payment .product_basket{
    gap: 48px;
}
.basket_payment .onglets{
    flex-direction: column;
    gap: 8px;
}
.basket_payment .blocklivraison{
    padding-top: 48px;
    border-top: 1px solid #F1EDE8;
}
.basket_payment .payment-checkbox{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    border: 1px solid #E5E5E5;
    padding: 24px;
    cursor: pointer;
}
.basket_payment .payment-checkbox:has(input:checked){
    border: 1px solid #FFA27F;
}
.basket_payment .payment-checkbox .radiorounded{
    display: flex;
    align-items: center;
    gap: 8px;
}
.basket_payment .payment-checkbox .radiorounded label{
    position: relative;
    font-size: 16px;
    font-family: "Inter Tight Semibold";
    white-space: nowrap;
    line-height: 24px;
    margin-bottom: 0;
    color: #181818;
}
.basket_payment .payment-checkbox .radiorounded label:after{
    left: -21px;
    top: -7px;
}
.basket_payment .payment-checkbox .svg-container{
    display: flex;
    align-items: center;
    gap: 4px;
}
.basket_payment .payment-checkbox .svg-container svg{
    border-radius: 4px;
    background: #F5F5F4;
    width: 24px;
    height: 24px;
    padding: 2px 8px
}
.basket_payment .payment-checkbox .break .cgv,
.basket_payment .payment-checkbox .break .cgv a{
    color: #959595;
    font-size: 12px;
    line-height: 18px;
}
.basket_payment .payment-checkbox .break{
    margin-top: 24px;
    flex-basis: 100%;
}
.basket_payment .payment-checkbox .break .btnpayment{
    display: flex;
    justify-content: flex-end;
}
.basket_payment .payment-checkbox .break .btnpayment span,
.line-grey{
    color: #5B5B5B;
}
.basket_confirm .product_basket{
    margin: 48px auto;
    gap: 48px;
    color: #333333;
}
.basket_confirm .head{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 24px;
    text-align: center;
}
.basket_confirm .confirm_recap,
.basket_confirm .confirm_address,
.basket_confirm .confirm_delivery{
    border-bottom: 1px solid #E5E5E5;
    padding-bottom: 48px;
}

.basket_confirm .confirm_address > div,
.basket_confirm .confirm_delivery > div{
    width: 45%;
}

.basket_confirm .confirm_recap .products{
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.basket_confirm .confirm_recap .product_line{
    width: 45%;
}
.basket_confirm .confirm_delivery p{
    display: flex;
    align-items: center;
    gap: 4px
}
.basket_confirm .confirm_delivery svg{
    width: 24px;
    height: 24px;
    border-radius: 4px;
    background-color: #F4F4F4;
    padding: 0 7px;
}
.basket_confirm .confirm_payment > div{
    width: 379px;
}
.basket_confirm .confirm_payment .info_total p{
    display: flex;
    justify-content: space-between;
}
.basket_empty{
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.basket_d{
    width: 472px;
}
.basket_recap {
    background-color: #FFF;
    width: 472px;
    padding: 48px;
    position: sticky;
    top: 67px;
    overflow-y: hidden;
}
.basket_recap .title_recap_product{
    color: #21231D;
    margin-top: 32px;
}
.basket_recap .title_recap_product p span{
    color: #757771;
}
.basket_recap .advantage_code p{
    cursor: pointer;
}
.basket_recap .advantage_code form{
    display: none;
}
.basket_recap .advantage_code .cta-grey.disable{
    background-color: #909090;
    cursor: none;
    transition: all .3s ease-in-out;
}
.basket_recap .cta-grey {
    width: 100%;
}
.basket_recap .line img {
    max-width: 80px;
}
.basket_recap .product_line{
    padding: 8px;
    margin-bottom: 8px;
}
.basket_recap .product_line .visuel_produit{
    max-width: 80px;
}
.basket_recap .product_line .info{
    gap: 16px;
}
.basket_recap .line .textblock {
    width: calc(100% - 90px);
}
.basket_recap .type-payment{
    margin-top: 32px;
    display: flex;
    justify-content: center;
    gap: 4px
}
.basket_recap .type-payment svg{
    width: 24px;
    height: 24px;
    border-radius: 4px;
    background-color: #F4F4F4;
    padding: 0 8px;
    cursor: inherit;
}
.basket_recap .moins svg path{
    stroke: #181818;
}
.boxfidelite {
    color: #111;
    font-family: "Inter Tight";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    opacity: 0.5;
    margin-top: 24px;
}
.f_fidelity{
    box-sizing: border-box;
    padding: 24px;
}

.f_fidelity input {
    width: 170px !important;
    display: inline-block !important;
    height: 45px !important;
}

.f_fidelity .orange{
    color: #FFA27F;
}
.f_fidelity .addVoucher {
    width: 90px;
}
.product_basket {
    background-color: #fff;
    padding: 48px;
    display: flex;
    gap: 16px;
    flex-direction: column;
}
.product_basket .num-article{
    color: #959595;
    font-size: 14px;
    line-height: 20px;
    text-transform: initial;
    font-family: "Inter Tight";
}
.progress-container {
    width: 100%;
    background-color: #FAF1ED;
    border-radius: 5px;
    overflow: hidden;
}
.progress-bar {
    height: 4px;
    background-color: #FFA27F;
    border-radius: 5px;
    transition: width 1s ease-in-out;
}
.product_line {
    align-items: center;
    border: 1px solid #F1EDE8;
    padding: 16px;
}
.product_line .info{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.product_line .info .bottom{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.product_line .changeQty{
    padding: 0;
    height: inherit;
}
.product_line .changeQty div svg{
    width: 15px;
    height: 15px;
    padding: 6px;
    border-radius: 4px;
    border: 1px solid #E5E5E5;
}
.product_line .changeQty div svg path{
    stroke: #181818;
}
.product_line .changeQty.step0 .lessqty,
.product_line .changeQty.step1 .suppqty{
    display: none;
}
.product_line .changeQty.step0 .suppqty,
.product_line .changeQty.step1 .lessqty{
   display: block;
}

.product_line .info .price{
    display: flex;
    align-items: center;
    align-self: flex-end;
    gap: 8px;
}
.product_line .info .price .reduc{
    color: #fff;
    background: #757575;
    border-radius: 4px;
    padding: 3px;
}
.product_line .info .price .prix-initial{
    color: #959595;
    text-align: right;
    font-size: 12px;
    line-height: 18px;
    text-decoration: line-through ;
}
.product_line.gift .tag {
    align-self: baseline;
    text-align: right;
    color: #FFF;
    font-size: 10px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 1px;
    border-radius: 4px;
    background: #FFA27F;
    width: fit-content;
    padding: 2px 11px;
}
.product_line .visuel_produit {
    max-width: 110px;
}
.product_line.gift .visuel_produit {
    max-width: 100px;
    transform: scale(0.9);
}
.product_line.gift .textblock{
    align-self: center;
}
.blocklivraison .mode-delivery{
    border: 1px solid #E5E5E5;
    padding: 24px;
    margin-bottom: 8px;
}
.blocklivraison .mode-delivery.checked{
    border: 1px solid #FFA27F;
}
.blocklivraison .mode-delivery .tag{
    border-radius: 4px;
    background: #FFA27F;
    color: #FFF;
    font-family: "Inter Tight Semibold";
    font-size: 10px;
    line-height: 20px;
    letter-spacing: 1px;
    padding: 5px 7px;
    text-transform: uppercase;
    margin-left: 8px;
}
.changeQty {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 16px 12px;
    box-sizing: border-box;
    text-align: center;
    height: 52px;
}

.changeQty input {
    width: 20px;
}


.onglets .onglet.paypal .sprite {
    width: 125px;
    height: 30px;
    display: block;
}

.onglets .onglet {
    width: 310px;
    border-radius: 5px;
}

.onglets .onglet.active {
    border-color: #d9b9b1;
}

.paypal-button.paypal-button-color-gold {
    background: transparent;
    text-indent: -999999px;
}

.livraison .infos {
    font-weight: 600;
    font-style: italic;
    margin-top: 1px;
    font-size: 13px;
}

.listpoints {
    max-height: 275px;
    overflow-y: scroll;
}
.mapcarrier {
    gap: 24px;
}
.listpoints .point-relay {
    border: 1px solid #F1EDE8;
    padding: 16px;
}
.listpoints .point-relay.active{
    border-color: #FFA27F;
}
#f_payment_carrier .formvalidator_error {
    position: absolute;
    top: 3px;
    right: 0;
}

.form-container .field-container:first-of-type {
    grid-area: name;
}

.form-container .field-container:nth-of-type(2) {
    grid-area: number;
}

.form-container .field-container:nth-of-type(3) {
    grid-area: expiration;
}

.form-container .field-container:nth-of-type(4) {
    grid-area: security;
}

.field-container input {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.field-container {
    position: relative;
}

.form-container {
    display: grid;
    grid-column-gap: 10px;
    grid-template-columns: auto auto;
    grid-template-rows: 90px 90px 90px;
    grid-template-areas: "name name" "number number" "expiration security";
    max-width: 400px;
    width: 45%;
    padding: 20px;
    color: #707070;
}

.content_card label {
    padding-bottom: 5px;
    font-size: 12px;
}

.content_card input {
    margin-top: 3px;
    padding: 15px;
    font-size: 16px;
    width: 100%;
    border-radius: 3px;
    border: 1px solid #dcdcdc;
}
.content_paypal .infopaypalstep1 img{
    margin: 40px auto 40px;
    display: block;
    width: 250px;
}
.content_paypal .transmissionpart img{
    margin: 40px auto 0;
    display: block;
    width: 290px;
}
.content_paypal .transmissionpart p{
    letter-spacing: 1.5px;
}

.ccicon {
    height: 38px;
    position: absolute;
    right: 1px;
    top: calc(50% - 14px);
    width: 60px;
}

/* CREDIT CARD IMAGE STYLING */
.preload * {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -ms-transition: none !important;
    -o-transition: none !important;
}

.content_card .container {
    margin-top: 30px;
    margin-right: 25px;
    width: 45%;
    max-width: 400px;
    max-height: 251px;
    height: 54vw;
    padding: 20px 0;
}

#ccsingle {
    position: absolute;
    right: 15px;
    top: 20px;
}

#ccsingle svg {
    width: 100px;
    max-height: 60px;
}

.creditcard svg#cardfront,
.creditcard svg#cardback {
    width: 100%;
    border-radius: 22px;
}

#generatecard {
    cursor: pointer;
    float: right;
    font-size: 12px;
    color: #fff;
    padding: 2px 4px;
    background-color: #909090;
    border-radius: 4px;
    cursor: pointer;
    float: right;
}

/* CHANGEABLE CARD ELEMENTS */
.creditcard .lightcolor,
.creditcard .darkcolor {
    -webkit-transition: fill .5s;
    transition: fill .5s;
}

.creditcard .lightblue {
    fill: #03A9F4;
}

.creditcard .lightbluedark {
    fill: #0288D1;
}

.creditcard .red {
    fill: #ef5350;
}

.creditcard .reddark {
    fill: #d32f2f;
}

.creditcard .purple {
    fill: #ab47bc;
}

.creditcard .purpledark {
    fill: #7b1fa2;
}

.creditcard .cyan {
    fill: #26c6da;
}

.creditcard .cyandark {
    fill: #0097a7;
}

.creditcard .green {
    fill: #66bb6a;
}

.creditcard .greendark {
    fill: #388e3c;
}

.creditcard .lime {
    fill: #d4e157;
}

.creditcard .limedark {
    fill: #afb42b;
}

.creditcard .yellow {
    fill: #ffeb3b;
}

.creditcard .yellowdark {
    fill: #f9a825;
}

.creditcard .orange {
    fill: #ff9800;
}

.creditcard .orangedark {
    fill: #ef6c00;
}

.creditcard .grey {
    fill: #bdbdbd;
}

.creditcard .greydark {
    fill: #616161;
}

/* FRONT OF CARD */
#svgname {
    text-transform: uppercase;
}

#cardfront .st2 {
    fill: #FFFFFF;
}

#cardfront .st3 {
    font-weight: 600;
}

#cardfront .st4 {
    font-size: 54.7817px;
}

#cardfront .st5 {
    font-weight: 400;
}

#cardfront .st6 {
    font-size: 33.1112px;
}

#cardfront .st7 {
    opacity: 0.6;
    fill: #FFFFFF;
}

#cardfront .st8 {
    font-size: 24px;
}

#cardfront .st9 {
    font-size: 36.5498px;
}

#cardfront .st10 {
    font-weight: 300;
}

#cardfront .st11 {
    font-size: 16.1716px;
}

#cardfront .st12 {
    fill: #4C4C4C;
}

/* BACK OF CARD */
#cardback .st0 {
    fill: none;
    stroke: #0F0F0F;
    stroke-miterlimit: 10;
}

#cardback .st2 {
    fill: #111111;
}

#cardback .st3 {
    fill: #F2F2F2;
}

#cardback .st4 {
    fill: #D8D2DB;
}

#cardback .st5 {
    fill: #C4C4C4;
}

#cardback .st6 {
    font-weight: 400;
}

#cardback .st7 {
    font-size: 27px;
}

#cardback .st8 {
    opacity: 0.6;
}

#cardback .st9 {
    fill: #FFFFFF;
}

#cardback .st10 {
    font-size: 24px;
}

#cardback .st11 {
    fill: #EAEAEA;
}

#cardback .st13 {
    font-size: 37.769px;
}

/* FLIP ANIMATION */
.content_card .container {
    perspective: 1000px;
}

.creditcard {
    width: 100%;
    max-width: 400px;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    transition: -webkit-transform 0.6s;
    -webkit-transition: -webkit-transform 0.6s;
    transition: transform 0.6s;
    transition: transform 0.6s, -webkit-transform 0.6s;
    cursor: pointer;
}

.creditcard .front,
.creditcard .back {
    position: absolute;
    width: 100%;
    max-width: 400px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-font-smoothing: antialiased;
    color: #47525d;
}

.creditcard .back {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
}

.creditcard.flipped {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
}

/************************************/
/*          PAGE DE MARQUE          */
/************************************/
.pagemarque .heritage .titre {
    background: url(/medias/marque/guillemets_heritage.png) no-repeat center;
    background-size: contain;
    padding: 55px 0;
}

.pagemarque .science .textblock,
.pagemarque .expertise .textblock,
.pagemarque .rigueur .textblock {
    width: 650px;
}

.pagemarque .heritage .textblock {
    width: 610px;
}

.titre_soulignpink:after {
    content: '';
    width: 125px;
    height: 1px;
    background-color: #ffcbbe;
    display: block;
    margin: 7px auto 0;
    position: absolute;
    left: 0;
    bottom: -20px;
    transition: 0.5s;
}

.pagemarque .danslemonde .textblock {
    border: 7px solid #f9f1ef;
    padding: 70px 40px;
}
.pagemarque .breadcrumb {
    padding: 35px 30px 0;
}
.pagemarque .breadcrumb,
.pagemarque .hero{
    background-color: #F3E3DD;
}
.pagemarque .hero{
    padding: 95px 0 20px;
}
.pagemarque .marque{
    background-color: #F2F1ED;
    padding: 64px 0;
    position: relative;
}
.pagemarque .marque .figure.raisin{
    position: absolute;
    top: 40px;
    right: 0;
}
.pagemarque .table_elements,
.pagemarque.v2 .science,
.pagemarque .exigence{
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding: 80px 0;
}
.pagemarque .exigence{
    background-image: url(/medias/arnaud-v2/pagemarque/bg_exigence.webp);
    background-size: 100%;
    transition: all 0.3s ease-in-out;
    background-position: center;
}
.pagemarque .exigence:hover{
    background-size: 120%;
}
.pagemarque.v2 .science .two-blocs{
    display: flex;
    justify-content: center;
}
.pagemarque .table_elements .two-blocs{
    display: flex;
    justify-content: center;
    gap: 64px;
    padding: 80px 0;
}
.pagemarque.v2 .science .two-blocs{
    padding: 80px 0;
}
.pagemarque .table_elements .two-blocs .bloc,
.pagemarque.v2 .science .two-blocs .bloc{
    display: flex;
    flex-direction: column;
    gap: 68px;
}
.pagemarque .table_elements .two-blocs .bloc:first-child p{
    align-self: flex-end;
}
.pagemarque.v2 .science .two-blocs .bloc:last-child p{
    padding-left: 118px;
}
.pagemarque.v2 .science .two-blocs .bloc:last-child p{
    align-self: center;
}
.pagemarque .distributeur {
    background-color: #F1EDE8;
    padding: 48px 0;
}

.pagemarque .distributeur .soulignement:after, .pagemarque .transparence .soulignement:after {
    background-color: #000;
}

.pagemarque .beautyathome img {
    max-height: 490px;
}
#f_voucher{
    margin-top: 16px;
}
#f_voucher .cta-grey{
    font-size: 14px;
    line-height: 20px;
}
#f_voucher_voucher div{
    display: flex;
    flex-direction: column;
    width: 100%;
}
.reassurance{
    display:flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.reassurance li{
    font-size: 17px;
}
.reassurance li span{
    width:100%;
    display: block;
    font-size: 15px;
}
.reassurance li img{
    margin-bottom: 20px;
    height: 40px;
}

@media screen and (max-width: 768px) {
    .reassurance li{
        width: 50%;
        margin-bottom: 30px;
        font-size: 16px;
    }
    .reassurance li img{
        height: 30px;
    }
}
/************************************/
/*          NEWSLETTER              */
/************************************/
.newsletter{
    background: unset;
    padding: 45px 25px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    border: none;
}
.newsletter img{
    width: 100%;
    position: absolute;
    height: 100%;
    object-fit: cover;
}
.newsletter .container{
    color: #FFFFFF;
    width: 100%;
    box-sizing: border-box;
    border: none;
    max-width: 820px;
    margin: 0 auto;
    padding: 76px 0;
    background: rgba(255, 255, 255, 0.16);
    -webkit-backdrop-filter: blur(45px);
    backdrop-filter: blur(45px);
    text-align: center;
}
.newsletter .form-newsletter{
    display: flex;
    max-width: 439px;
    margin: 24px auto 0;
    border: 1px solid #FFFFFF;
    padding: 16px 20px;
}
.newsletter .f_el{
    display:flex;
    align-items: center;
}
.newsletter .f_el input[type="email"]{
    background: transparent;
    padding: 0;
    border: none;
    max-width: 327px;
    margin: 0;
    color: #FFFFFF;
}
.newsletter .f_el input[type="email"]::placeholder{
    color: #FFFFFF;
    font-family: 'PlayfairDisplay',sans-serif;
    font-size: 14px;
    font-style: italic;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 1.54px;
}
.newsletter .f_el .cta-submit{
    border: 1px solid #333;
    background: #111;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    padding: 12px 20px;
}
@media screen and (max-width: 1024px) {
    .newsletter{
        background-image: url(/medias/arnaud-v2/homepage/newsletter_bg-mb.webp);
        padding: 45px 24px;
    }
    .newsletter .container{
        padding: 55px 15px;
    }
    .newsletter .form-newsletter{
        padding: 16px 12px;
    }
    .newsletter .f_el .cta-submit{
        padding: 12px 10px;
    }
}
/************************************/
/*          BEAUTY AT HOME          */
/************************************/
.beautyathome .intro .textblock {
    width: 420px;
    margin-left: 80px;
    margin-top: -100px;
    position: relative;
    z-index: 1;
    transition: 0.2s;
    cursor: pointer;
}

.beautyathome .intro .textblock:hover {
    background-color: #302e34;
}

.beautyathome .t_coaching:after {
    margin: 15px auto 0;
    background-color: #F1D3CB;
    width: 75px;
    height: 2px;
}

.beautyathome .onglets p {
    cursor: pointer;
}

.beautyathome .onglets p.active {
    color: #000;
}

.beautyathome .soulignonglet {
    content: '';
    width: 110px;
    height: 2px;
    background-color: #F1D3CB;
    display: block;
    margin-top: 15px;
    position: relative;
    transition: 0.5s;
    left: 55px;
}

.beautyathome .contentCoaching[rel="1"] {
    display: block;
}

.beautyathome .contentCoaching {
    display: none;
    position: relative;
    overflow: hidden;
}

.beautyathome .contentCoaching ul {
    transition: 0.5s;
    height: 340px;
}

.beautyathome .contentCoaching ul.inactif {
    transition: 0.5s;
    height: 450px;
}

.beautyathome .contentCoaching ul.inactif {
    margin-left: 100vw;
}

.beautyathome .contentCoaching li {
    width: 315px;
    cursor: pointer;
}

.beautyathome .contentCoaching li img {
    width: 100%;
    height: 265px;
    object-fit: cover;
}

.beautyathome .contentCoaching .name {
    margin-top: 20px;
    font-weight: 600;
    font-size: 13px;
    line-height: 18px;
}

.beautyathome .contentCoaching .description {
    margin-top: 15px;
    font-weight: 100;
    font-size: 13px;
    line-height: 18px;
}

.beautyathome .coachingbeaute .download::after {
    width: 200px;
    margin: 12px auto 0;
}

.beautyathome .coachingbeaute .contentvideo {
    /*display: none;*/
    position: absolute;
    top: 0;
    left: -100vw;
    width: 100%;
    height: 450px;
    transition: 0.3s;
}

.beautyathome .coachingbeaute .contentvideo.active {
    left: 0;
}

.beautyathome .coachingbeaute .contentvideo iframe {
    width: 95%;
    height: 100%;
    margin: auto;
    display: block;
}

.beautyathome .coachingbeaute .close {
    position: absolute;
    top: -10px;
    right: 0;
    font-size: 35px;
    color: grey;
    cursor: pointer;
}


.crosssell .bx-wrapper {
    margin: 0 auto;
}

.crosssell .bx-viewport {
    padding-bottom: 10px;
}

.stars_rate li {
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
}

.stars_rate li.active:before,
.stars_rate li.hover:before {
    color: #f4e4de;
}

.stars_rate li:not(:first-child) {
    padding-left: 5px;
}

.rate_line:not(:first-child) {
    margin-top: 20px;
}

.flexwrap {
    flex-wrap: wrap;
}

.bordertitle {
    border-bottom: 1px solid #cccccc;
    padding-bottom: 10px;
    margin-bottom: 15px;
}

h1.title {
    font-size: 36px;
    border-bottom: 1px solid #4b4853;
    padding-bottom: 10px;
    color: #4b4853;
    margin-bottom: 15px;
    font-weight: 500;
}

h2.title {
    color: #4b4853;
    font-weight: 500;
    font-size: 21px;
    margin-bottom: 10px;
    letter-spacing: 1.4px;
}

.catalog {
    font-family: 'Inter Tight';
}

.headband {
    align-items: center;
}

.headband .picture {
    text-align: right;
}

.headband img {
    max-width: 100%;
    max-height: 345px;
}

.headband .intro {
    padding: 0 60px;
    box-sizing: border-box;
}

.headband .intro p {
    font-size: 15.5px;
    color: #4b4853;
    letter-spacing: 0.7px;
    line-height: 20px;
    font-weight: 300;
}

body.ar .contentlist nav {
    width: 240px;
    margin-left: 20px;
    margin-right: 60px;
}

.pagesearch .contentlist section {
    width: calc(100% - 60px);
    margin: auto;
}

.account .listproducts li {
    height: 405px;
    width: 33.33333%;
    margin: 20px 0;
}

.pagesearch .listproducts li {
    width: 25%;
}

.listproducts .product a[class^="cta-"] {
    width: 180px;
}

.programmes-beaute .img-programmes {
    width: 28%;
    vertical-align: middle;
}

.programmes-beaute li {
    list-style: none;
}

.programmes-beaute .routine-nombre {
    font-size: 6em;
}

.programmes-beaute .programmes-text {
    vertical-align: bottom;
}

.programmes-beaute .step {
    font-size: 27px;
}

.programmes-beaute .cta-decouvre {
    font-size: 15px;
    font-weight: 100;
    letter-spacing: 0.5px;
    color: #919092;
}

.programmes-beaute .cta-decouvre::after {
    content: '';
    width: 55px;
    height: 1.1px;
    background-color: #919092;
    display: block;
    margin: 7px auto 0;
    transition: 0.1s;
}

.programmes-beaute .programmes-price {
    color: #a9a6ad;
    text-align: center;
}

.programmes-conseils-demaquillant {
    background-color: #FFDFEC;
}

.programmes-conseils-hydratation {
    background-color: #CEE0E7;
}

.programmes-conseils-perle-caviar {
    background-color: #393942f0;
    color: white;
}

.programmes .img-product {
    width: 48%;
    margin-right: 70px;
    vertical-align: middle;
}

.programmes .informations {
    width: 42%;
    vertical-align: middle;
}

.programmes .margin-content {
    margin: 50px auto;
}

.programmes .nbr-2 {
    margin: -65px 30px 0 0;
}

.programmes .nbr-2-caviar {
    margin: -65px 0px 0 0;
}

.programmes .nbr-3 {
    text-align: center;
    margin-right: 6em;
}

.programmes .arrow1 {
    margin-right: 30px;
}

.programmes-beaute .texte-2{
    margin-right: -150px;
    width: 100%;
    text-align: center;
}

.programmes-beaute.block2 {
    text-align: right;
}
/********************************/
/*          PAGE GAMME          */
/********************************/
.pagegamme{
    overflow: hidden;
}
.pagegamme .head .pictoElement {
    width: 180px;
}

.pagegamme .head .visuel .bgGamme {
    height: 40px;
    width: 100%;
    margin-top: -25px;
}

.pagegamme .description {
    max-width: 830px;
}

.pagegamme .allproducts{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    place-items: center;
    gap: 24px;
    max-width: 805px;
    margin: auto;
}

.pagegamme .allproducts li img {
    max-height: none;
}
@media screen and ( max-width: 1056px ){
    .pagegamme .allproducts {
        gap: 20px 8px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center
    }

}

/*******************************/
/*         PLAN DU SITE        */
/*******************************/
.sitemap .border_darkgrey li {
    width: 33%;
    margin: 5px 0;
}

/*******************************/
/*           CONTACT           */
/*******************************/
.contact .titre:after {
    content: '';
    width: 100px;
    height: 1px;
    background-color: #C1A59E;
    display: block;
    margin: 25px 0 0;
}

.contact .flexbox {
    align-items: flex-start;
}

.contact .box {
    width: 545px;
    box-shadow: 0 3px 5px rgba(218, 218, 218, 0.7);
}

.contact .boxnumber {
    color: #C1A59E;
    border: 1px solid #C1A59E;
}

.contact textarea {
    min-height: 200px;
}

/***************************************/
/*           OU NOUS TROUVER           */
/***************************************/
.ounoustrouver .recherche input {
    width: 865px;
}

.ounoustrouver .recherche .icon-localisation {
    font-size: 25px;
    border-left: 1px solid #cfcfcf;
    padding-left: 5px;
    position: absolute;
    top: 7px;
    right: 10px;
}

.ounoustrouver .recherche .cta-grey {
    height: 40px;
    line-height: 20px;
    margin-left: 20px;
}

.ounoustrouver .map-content .gauche {
    width: 400px;
    height: 550px;
    overflow-x: hidden;
    overflow-y: scroll;
}

.ounoustrouver .map-content .droite {
    width: 610px;
}

.ounoustrouver .map-content .boxadresse {
    padding: 20px 15px;
    box-sizing: border-box;
}

.ounoustrouver .map-content .boxadresse:first-child {
    margin-top: 0;
}

.ounoustrouver .map-content .fiche.boxadresse {
    margin-bottom: 15px;
}

.ounoustrouver .map-content .boxadresse .titre::after {
    content: "+";
    position: absolute;
    top: -5px;
    right: 0;
    font-size: 22px;
}

.ounoustrouver .map-content .boxadresse .titre.active::after {
    content: "-";
}

.ounoustrouver .map-content .boxadresse .cache {
    display: none;
}

/***************************************/
/*          FOIRE AUX QUESTIONS        */
/***************************************/

.faq .h2_services {
    text-transform: uppercase;
    margin-left: 40px;
    font-weight: normal;
    font-size: 11px;
    cursor: pointer;
    user-select: none;
}

.faq-list {
    padding: 20px 0px;
    border-bottom: 1px solid #e7e3e2;
    position: relative;
}

.faq-list:after {
    content: '+';
    position: absolute;
    font-size: 27px;
    top: 20px;
    right: 40px;
    font-weight: 100;
}

.faq-list.active:after {
    content: '-';
    right: 45px;
}

.faq-list-item {
    width: 100%;
    padding: 20px 0;
}

.faq-list-item p {
    width: 90%;
    margin-left: 40px;
    font-weight: 100;

}

.faq .main-thematique {
    display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;      /* TWEENER - IE 10 */
    display: -webkit-flex;     /* NEW - Chrome */
    display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
}

.faq .thematique {
    text-transform: uppercase;
    padding: 50px 0;
    border: 1px solid #DFDFDF;
    text-align: center;
    cursor: pointer;
    width: 185px;
}

.faq .thematique:hover,
.faq .thematique.active {
    border: 1px solid #D9B9B1;
    color: #D9B9B1;
}

.faq .thematique:not(:last-child) {
    margin-right: 20px;
}

.faq .thematique [class^="icon-"] {
    display: block;
    margin-bottom: 20px;
    font-size: 20px;
}

.faq .bloc_questions:not(.general) {
    display: none;
}

.faq table,
.faq td {
    border: 1px solid black;
    border-collapse: collapse;
    text-align: center;
    font-size: 11px;
    color: #000000;
}

/***************************************/
/*           GROUPE PANTHER            */
/***************************************/
.groupe_panther p {
    margin: 40px 0 40px;
}
.groupe_panther .visuel_groupe {
    width: 100%;
}

/*******************************************/
/*           DOSSIERS DE PRESSE            */
/*******************************************/
.presse .dossiers a,
.presse .communiques a,
.presse .publications a {
    margin-top: 20px;
    display: inline-block;
    vertical-align: top;
    width: 210px;
    margin-right: 29px;
}

.presse .dossiers img,
.presse .communiques img,
.presse .publications img {
    width: 100%
}

.presse .dossiers img:hover,
.presse .communiques img:hover,
.presse .publications img:hover {
    opacity: 0.7;
}

.presse .publications .onglets p {
    opacity: 0.6;
}

.presse .publications .onglets p.active {
    opacity: 1;
    border-bottom: 1px solid #F1D3CB;
    padding-bottom: 5px;
}

/***********************************/
/*           NOS ACTIFS            */
/***********************************/
.nosactifs .actif_element {
    border: 1px solid #F8F2F1;
    position: relative;
}
.nosactifs .flexbox{
    justify-content: center;
    gap: 15px;
}
.nosactifs .actif_element.ml15 {
    margin-left: 0;
}
.nosactifs .actif_element.mt15 {
    margin-top: 0;
}

.nosactifs .actif_hover,
.actif_page .actif_hover {
    display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;      /* TWEENER - IE 10 */
    display: -webkit-flex;     /* NEW - Chrome */
    display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(217, 185, 177, 0.9);
    width: 100%;
    height: 100%;
    color: #fff;
    justify-content: center;
    align-items: center;
    transition: 0.25s;
    opacity: 0;
}

.nosactifs .actif_element:hover .actif_hover,
.actif_page .slider_others .product:hover .actif_hover {
    opacity: 1;
}

.nosactifs .actif_element p::after {
    width: 80%;
}

.actif_page .slider_others .product p::after {
    width: 80%;
    background-color: #fff;
}

.actif_page .benefices {
    padding: 30px 0 75px;
}

.actif_page .bx-wrapper .bx-controls-direction a {
    text-indent: 0;
    font-size: 32px;
}

.actif_page .slider_others img {
    border: 1px solid #DEDEDE;
    box-sizing: border-box;
}

.actif_page .content_slider_product .bx-wrapper {
    margin-left: auto;
    margin-right: auto;
}

.actif_page .content_slider_product .bx-wrapper .bx-prev {
    left: -60px;
}

.actif_page .content_slider_product .bx-wrapper .bx-next {
    right: -80px;
}

.actif_page .bandeau {
    width: 100%;
}

.actif_page .benefices li {
    line-height: 18px;
    font-size: 15px;
    margin-top: 25px;
}

.actif_page .benefices li::before {
    content: '•';
    color: #D9B9B1;
    display: inline-block;
    font-size: 26px;
    vertical-align: bottom;
    margin-right: 10px;
}

/*Buriti*/
.actif_page.bu .benefices {
    background-color: #ffb66a;
}

/*Acides hyaluroniques*/
.actif_page.ah .benefices {
    background: #fff7e0;
    background-position: 72% bottom;
}

/*Eau de rose*/
.actif_page.ro .benefices {
    background: #F9F1EF;
    background-position: 80% bottom;
}

/*Abricot*/
.actif_page.ab .benefices {
    background: #ffede1;
    background-position: 72% bottom;
}

/*Goji*/
.actif_page.go .benefices {
    background-color: #ffede1;
}

/*Eau marine*/
.actif_page.em .benefices {
    background: #f1f2f7;
    background-position: 72% bottom;
}

/*Huiles*/
.actif_page.hu .benefices {
    background: #F5E0CF;
    background-position: 85% bottom;
}

/*Pamplemousse*/
.actif_page.pa .benefices {
    background: #fde5de;
    background-position: 80% bottom;
}

/*Mate*/
.actif_page.ma .benefices {
    background: #e5fff5;
    background-position: 72% bottom;
}

/*Raisin*/
.actif_page.ra .benefices {
    background: #fcecff;
    background-position: 87% bottom;
}

/*Vanille*/
.actif_page.va .benefices {
    background: #F1EECA;
    background-position: 95% bottom;
}

/*Romarin*/
.actif_page.rm .benefices {
    background: #f8ffeb;
    background-position: 72% bottom;
}

/*Mûres*/
.actif_page.mu .benefices {
    background: #ffdde9;
    background-position: 72% bottom;
}

/*Perle et caviar*/
.actif_page.pc .benefices {
    background: #f2f2f2;
    background-position: 92% 0px;
    background-size: 80%;
}

/*******************************************/
/*           ESPACE DISTRIBUTEUR           */
/*******************************************/
.distributeurs .container .onglet {
    width: 100%;
    background-color: #fff;
    padding: 10px 3% 9px;
    box-sizing: border-box;
    font-size: 20px;
    position: relative;
    cursor: pointer;
    letter-spacing: 1px;
    border: 1px solid #CCCCCC;
}

.distributeurs .container .onglet.active {
    background-color: #F5F5F5;
}

.distributeurs .container .onglet .arrow {
    position: absolute;
    right: 20px;
    padding: 5px;
    transform: rotate(45deg);
}

.distributeurs .container .onglet.active .arrow {
    top: 14px;
    transform: rotate(225deg);
}

.distributeurs .boxcontainer {
    display: none;
}

.distributeurs .boxcontainer .container {
    margin-top: 20px;
}

.distributeurs .showcontainer {
    display: block;
    text-align: center;
    font-size: 29px;
    margin-top: 20px;
}

.distributeurs .inside {
    margin: 5px 0 30px;
    display: none;
}

.distributeurs .inside .block {
    border: 1px solid #aaaaaa;
    width: 210px;
    text-align: center;
    display: inline-block;
    vertical-align: top;
    margin: 10px 3px 0 2px;
    padding: 15px 0;
    box-sizing: border-box;
}

.distributeurs .inside img {
    max-width: 100%;
}

.distributeurs .inside .cta-transparent {
    font-size: 17px;
    letter-spacing: 2px;
}

.distributeurs .inside .block .flag {
    color: #000;
    font-size: 35px;
    margin-top: 10px;
    margin-bottom: 0;
}

.distributeurs .inside .block .filename {
    width: 95%;
    display: block;
    font-size: 13px;
    margin: 13px auto;
    word-wrap: break-word;
    text-transform: uppercase;
    font-weight: 100;
}

.distributeurs .bx-wrapper .bx-controls-direction a {
    text-indent: 0;
    font-size: 32px;
}

.distributeurs .bx-wrapper .bx-controls-direction .bx-prev {
    left: -50px
}

.distributeurs .bx-wrapper .bx-controls-direction .bx-next {
    right: -50px
}

/*******************************************/
/*           TOTALE TRANSPARENCE           */
/*******************************************/
.transparence .bandeau {
    background-color: #F5E5DF;
    padding: 25px 0;
}

.transparence .h2_item::after {
    margin: 17px auto 0;
    width: 10%;
    height: 3px;
}

.transparence .h2_item:hover:after {
    -webkit-transform: translate(0, 0px);
    transform: translate(0, 0px);
}

.transparence .onglets p {
    cursor: pointer;
}

.transparence .onglets p.active {
    color: #000;
}

.transparence .soulignonglet {
    content: '';
    width: 110px;
    height: 2px;
    background-color: #F1D3CB;
    display: block;
    margin-top: 15px;
    position: relative;
    transition: 0.5s;
    left: 12px;
}

.transparence .contentTransparence {
    display: none;
    margin-top: 40px;
    text-align: center;
}

.transparence .contentTransparence[rel="1"] {
    display: block;
}

.transparence .contentTransparence .number {
    background-color: #F9F1EF;
    width: 75px;
    height: 75px;
    border-radius: 50%;
    font-size: 35px;
    display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;      /* TWEENER - IE 10 */
    display: -webkit-flex;     /* NEW - Chrome */
    display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
}

.transparence .contentTransparence .title {
    font-size: 20px;
    font-family: 'AmericanTypewriter';
    margin-top: 15px;
    font-weight: 600;
}

/* BANDEAU COOKIE */
.cnil{
    position:fixed;
    bottom:0;
    left:0;
    width:100%;
    padding:30px 0;
    background-color:#F3E3DD;
    z-index: 100;
    display: none;
}
.cnil .content{
    width:1240px;
}
.cnil a{
    text-decoration:underline;
}
.cnil a:hover{
    text-decoration:none;
}
.cnil a.fa{
    position:absolute;
    right:15px;
    top:15px;
    text-decoration:none;
    cursor:pointer;
}
.cnil a.close-thin{
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 25px;
    text-decoration: none;
    cursor:pointer;
}
/* FIN BANDEAU COOKIE */

@media screen and (max-width: 768px) {
    .account .listproducts li {
        width: 50%;
        height: 85vw;
    }
    .programmes-beaute .img-programmes {
        width: 100%;
    }
    .programmes-beaute .arrows {
        display: none;
    }
    .programmes {
        text-align: center;
    }
    .programmes-beaute.block2 {
        text-align: inherit;
    }
    .programmes-beaute .texte-2 {
         margin-right: inherit;
    }
    .programmes-beaute {
        margin-top: 20px;
    }
    .programmes .nbr-3 {
        margin-right: inherit;
    }
    .programmes-beaute .txt-3 {
        text-align: inherit;
    }
    .programmes-beaute .img2, .programmes-beaute .img3  {
        margin-top: 30px;
    }
    .nbr2-hydratation {
        z-index: 1;
        position: absolute;
        margin: 30px 0 0 175px;
        text-align: center;
    }
    .programmes-beaute .text-hydratation {
        text-align: center;
    }
    .programmes-beaute .nbre-1 {
        position: absolute;
        z-index: 1;
        margin: 30px 0 0 180px;
    }
    .f12-mb {
        font-size: 12px;
    }
}


@media screen and (min-width: 1024px) {
    .showm {
        display: none;
    }
    .flexbox-d{
        display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
        display: -ms-flexbox;      /* TWEENER - IE 10 */
        display: -webkit-flex;     /* NEW - Chrome */
        display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
    }
    .jc-spbw-d{
        justify-content: space-between;
    }

    /*****************************************/
    /*         SOULIGN PINK ANIMATION        */
    /*****************************************/
    .pagemarque .beautyathome .textblock:hover .titre_soulignpink:after,
    .productpage .beautyathome .textblock:hover .titre_soulignpink:after {
        width: 100%;
    }

    /********************/
    /*      HEADER      */
    /********************/

    /**********************/
    /*      HOMEPAGE      */
    /**********************/
    .soulignement:hover:after {
        -webkit-transform: translate(0, 4px);
        transform: translate(0, 4px);
    }

    .soulignement.noanim:hover:after {
        -webkit-transform: none;
        transform: none;
    }

    /***********************************/
    /*          COMPTE CLIENT          */
    /***********************************/
    .account .all_points .carre:hover img {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }

    /*********************************/
    /*         BEAUTY AT HOME        */
    /*********************************/
    .beautyathome .line:nth-child(odd) .textblock .titre:after {
        content: "";
        width: 200px;
        height: 1px;
        background-color: #979797;
        display: block;
        position: absolute;
        right: -210px;
        bottom: 4px;
    }

    .beautyathome .line:nth-child(even) .textblock .titre:before {
        content: "";
        width: 200px;
        height: 1px;
        background-color: #979797;
        display: block;
        position: absolute;
        left: -210px;
        bottom: 4px;
    }
}

@media screen and (min-width: 1200px) {
    .content {
        width: 1200px;
        margin-left: auto;
        margin-right: auto;
    }

}
@media screen and (max-width: 1080px) {

    header .meganav .main{
        gap: 8px
    }
    header .top .left{
        gap: 28px;
    }
    header .top .left .textblock{
        gap: 16px;
    }
}

@media screen and (max-width: 1023px) {
    .popit.w440 .box,
    .popit.w560 .box,
    .popit.w790 .box {
        width: 95% !important;
        margin-left: -47.5% !important;
        max-height: 95vh;
        overflow: scroll;
    }

    .popit.w560 .box {
        height: 90vh;
    }

    .popConnexion .content_login {
        padding: 0 2.5%;
    }

    .popConnexion .cta-pink.showd,
    .popConnexion .showPopin-mb {
        display: block;
    }

    .popConnexion p.inscription.showm {
        display: none;
    }

    /*****************************/
    /*          GENERAL          */
    /*****************************/
    .theme_title {
        font-size: 8vw;
        line-height: 9vw;
    }

    .border-tb-gey-mb {
        border-top: 1px solid #e5e5e5;
        border-bottom: 1px solid #e5e5e5;
    }

    .noborder-mb {
        border: none;
    }

    .theme_title.wline {
        display: inline-flex;
        align-items: center;
    }

    h1.title {
        font-size: 5vw;
    }


    /****************************/
    /*          HEADER          */
    /****************************/


    .header_mobile {
        width: 100%;
        display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
        display: -ms-flexbox;      /* TWEENER - IE 10 */
        display: -webkit-flex;     /* NEW - Chrome */
        display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
        align-items: center;
        justify-content: space-between;
        padding: 15px 4vw;
        border-bottom: 1px solid #cccccc;
        position: fixed;
        background-color: #fff;
        z-index: 2;
        max-height: 59px;
    }
    header .top{
        gap: 0;
        justify-content: space-between;
        padding: 11px 16px;
    }
    header .top .right{
        visibility: hidden;
        position: absolute
    }
    header .top .right.open{
        visibility: visible;
    }
    header .top .logo{
        position: relative;
        left: inherit;
        transform: inherit;
    }
    header .top .logo img{
        width: 88px;
        height: auto;
    }
    .header_mobile.notfixed {
        position: relative;
        z-index: unset;
    }
    .header_nav{
        display: flex;
    }
    .burger .bar1, .burger .bar2{
        width: 18px;
        height: 1px;
        background-color: #333;
        transition: 0.4s;
    }

    .burger .bar1 {
        margin: 0 auto 9px;
    }


    .burger.active .bar1 {
        -webkit-transform: rotate(-45deg) translate(-7px, 7px);
        transform: rotate(-45deg) translate(-7px, 7px);
    }

    .burger.active .bar2 {
        -webkit-transform: rotate(45deg) translate(0, 0px);
        transform: rotate(45deg) translate(0, 0px);
        margin: 9px auto;
    }

    .burger.active .bar3 {
        opacity: 0;
    }

    .header_mobile .search {
        font-size: 24px;
    }

    .header_mobile .search .close-thin {
        font-size: 35px;
        color: #000;
    }

    .header_mobile .compte,
    .header_mobile .panier {
        color: #000;
        font-size: 22px;
    }

    .header_mobile .compte {
        margin-right: 15px;
    }

    header #f_search {
        right: 0;
        top: 49px;
        width: 100%;
        padding: 20px;
        position: fixed;
        z-index: 10;
    }

    header #f_search::before,
    header #f_search::after {
        display: none;
    }

    header #f_search input {
        width: 85%;
    }

    header #f_search .fa-search {
        width: 15%;
    }
    header .meganav .souscateg_content .categ-left{
        flex-direction: column;
    }

    .meganav {
        width: 100vw;
        overflow-x: hidden;
        position: fixed;
        height: 100vh;
        overflow-y: scroll;
        z-index: 11;
        background-color: #fff;
        left: calc(-100% - 90vw);
        top: 49px;
        box-sizing: border-box;
        transition: 0.4s ease;
    }

    .meganav.open {
        left: 0;
        padding-bottom: 40px;
    }

    .meganav .header_nav {
        position: fixed;
        background-color: white;
        width: 90%;
        height: 58px;
        z-index: 100;
        padding: 15px 4vw;
        box-sizing: border-box;
    }

    .meganav .header_nav .burger .bar1,
    .meganav .header_nav .burger .bar2 {
        transition-duration: 0.7s;
    }

    .burger,
    header .bottom .logo {
        position: relative;
        z-index: 12;
    }

    header .meganav .main {
        flex-direction: column;
        padding: 24px 29px;
        justify-content: flex-start;
        gap: 0;
    }

    header .meganav .main .mainElement:first-child{
        margin-top: 0;
    }
    header .meganav .main .mainElement {
        position: relative;
        font-size: 24px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        margin: 10px 0;
    }
    header .meganav .main .categorie a{
        font-size: 24px;
        padding-right: 30px;
        /*line-height: 0;*/
        text-align: left;
        letter-spacing: -0.24px;
    }
    header .meganav .main .mainElement.playfairdisplay {
        font-size: 26px;
        font-style: italic;
        font-weight: 400;
        line-height: 20px;
        padding: 25px 0;
    }

    header .meganav .main:not(.hasMenuCMS) .mainElement:nth-child(1)::after,
    header .meganav .main:not(.hasMenuCMS) .mainElement:nth-child(2)::after {
        content: '';
        position: absolute;
        font-size: 27px;
        top: 20px;
        right: 5px;
        font-weight: 100;
        border: solid #4b4853;
        border-width: 0 2px 2px 0;
        display: inline-block;
        padding: 4px;
        -webkit-transition: .3s ease all;
        -moz-transition: .3s ease all;
        -o-transition: .3s ease all;
        transition: .3s ease all;
        transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
    }

    header .meganav .main.hasMenuCMS .mainElement:nth-child(2)::after,
    header .meganav .main.hasMenuCMS .mainElement:nth-child(3)::after {
        content: '';
        position: absolute;
        font-size: 27px;
        top: 20px;
        right: 5px;
        font-weight: 100;
        border: solid #4b4853;
        border-width: 0 2px 2px 0;
        display: inline-block;
        padding: 4px;
        -webkit-transition: .3s ease all;
        -moz-transition: .3s ease all;
        -o-transition: .3s ease all;
        transition: .3s ease all;
        transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
    }
    header .meganav .main .mainElement .titre_souscateg {
        position: relative;
        padding-bottom: 16px;
        border-bottom: 1px solid #000;
        margin-bottom: 0;
        text-align: left;
    }
    header .meganav .main .mainElement a{
        text-align: left;
    }
    header .meganav .main .mainElement .titre_souscateg a{
        font-size: 17px;
    }
    header .meganav .souscateg_content .subleft li:not(.titre_souscateg){
        display: none;
    }
    header .meganav .souscateg_content .subleft.active li{
        display: flex;
    }

    header .meganav .main .mainElement.active:nth-child(1)::after,
    header .meganav .main .mainElement.active:nth-child(2)::after {
        transform: rotate(-135deg);
        top: 25px;
    }
    header .meganav .souscategorie {
        display: none;
        border: none;
        position: initial;
    }

    header .meganav .main .mainElement p:hover ~ .souscategorie,
    header .meganav .main .mainElement p ~ .souscategorie:hover{
        top: 0;
        right: 0;
        position: relative;
    }
    header .meganav .souscateg_content {
        width: calc(100% - 55px);
        display: flex;
        flex-direction: column;
        left: 0;
        position: relative;
        padding: 0 26px;
        box-sizing: border-box;
    }
    header .meganav .souscateg_content li:not(.titre_souscateg) svg{
        display: block;
        margin-right: 20px;
    }

    header .meganav .souscateg_content ul {
        width: 100%;
    }

    #doofindercontainer .df-classic {
        left: 0 !important;
        margin-left: 0 !important;
    }

    #doofindercontainer .df-classic .df-results li .description {
        width: 185px;
    }

    /****************************/
    /*          FOOTER          */
    /****************************/
    footer .informations {
        justify-content: space-between;
        padding: 32px 24px 24px;
    }
    footer .informations li a{
        color: #111;
    }
    footer .informations ul {
        padding: 10px 0;
        color: #111;
        flex: 0 1 calc(1 / 2* 100%);
    }
    footer .informations ul:nth-child(2){
        order: 1;
    }
    footer .informations ul:nth-child(3){
        order: 3;
    }
    footer .informations ul:nth-child(4){
        order: 2;
    }
    footer .informations ul:nth-child(5){
        order: 4;
    }
    footer .informations ul:nth-child(6){
        order: 5;
    }
    footer .informations ul:nth-child(7){
        order: 7;
    }
    footer .informations .logo{
        margin-top: 0;
    }
    footer .informations .logo img{
        width: 180px;
        height: auto;
    }
    footer .informations ul .title {
        margin: 10px 0;
    }
    footer .social{
        margin-top: 27px
    }
    footer .bottom{
        padding: inherit;
        border-bottom: inherit;
    }
    footer .bottom .wrapper{
        flex-direction: column;
        max-width: inherit;
        width: 100%;
        padding: 0;
    }
    footer .bottom .left{
        box-sizing: border-box;
        align-items: baseline;
        padding: 16px 24px;
    }
    footer .bottom .left,
    footer .bottom .right{
        flex-direction: column;
    }
    footer .bottom .bloc{
        border-left: inherit;
        border-top: 1px solid #EBE9E1;
    }
    footer .bottom .bloc:nth-child(2){
        border-right: inherit;
        border-bottom: 1px solid #EBE9E1;
    }
    footer .selectbox{
        width: 100%;
        box-sizing: border-box;
    }
    footer .selectbox span, .selectbox ul li{
        padding: 0 24px;
    }
    footer .selectbox::after{
        top: 15px;
    }
    footer .bottom .toggle{
        display: flex;
        align-items: center;
        box-sizing: border-box;
        padding: 16px 24px;
    }
    footer .bottom p{
        padding: 0;
        margin-right: 8px;
    }
    footer .bottom .toggle .svg-container{
        display: flex;
        gap: 8px;
        position: relative;
        bottom: inherit;
        justify-content: inherit;

    }
    .footer-map{
        width: 100%;
        height: auto;
    }
    /******************************/
    /*         REASSURANCE        */
    /******************************/
    .reassurance{
        overflow: hidden;
    }
    .reassurance .benefits-bloc{
        gap: 30px;
        flex-direction: column;
        padding-left: 24px;
    }
    .reassurance .benefits-bloc .slick-track{
        display: flex;
        width: fit-content !important;
    }
    .reassurance .benefits-bloc .textblock{
        width: fit-content !important;
        margin-right: 24px;
    }

    .reassurance .slick-dots{
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 14px;
    }
    .reassurance .slick-dots li{
        width: inherit;
        margin-bottom: 0;
    }
    .reassurance .slick-dots li button{
        width: 10px;
        height: 10px;
        background-color: #9C9C9C ;
        border: none;
        border-radius: 100%;
        text-indent: -9999px;
    }
    .reassurance .slick-dots li.slick-active button{
        background-color: #000000;
    }


    /******************************/
    /*          HOMEPAGE          */
    /******************************/
    .homepage .slider_hp .text {
        font-size: 10vw;
        line-height: 14vw;
    }

    .bandeau_presentation .text {
        width: 95%;
    }

    .homepage .beautyathome .bloc {
        background-position: center center;
        background-size: auto 100%;
    }

    .homepage .beautyathome .bloc {
        background-position: center center;
        background-size: auto 100%;
    }

    .nouvel_imaginaire .flexbox {
        flex-direction: column;
    }

    .nouvel_imaginaire .content_philosophie,
    .nouvel_imaginaire .philosophie {
        height: 90vh;
        width: 100%;
    }

    .nouvel_imaginaire .carre {
        width: 100%;
    }

    .nouvel_imaginaire .philosophie .txt_philo {
        margin-top: 59vh;
    }

    .nouvel_imaginaire .philosophie .discover {
        margin-top: 12vh;
    }

    .nouvel_imaginaire .carre li {
        width: 47%;
    }

    .nouvel_imaginaire .carre li:nth-child(2),
    .nouvel_imaginaire .carre li:nth-child(4) {
        margin-left: 5%;
    }

    .nouvel_imaginaire .transparence img {
        width: 85%;
    }


    .transparence.bg_pink img {
        width: 100%;
    }

    .excellence .visuel .textblock {
        width: 95%;
        padding: 25px 20px;
    }

    .chic_blog .flexbox {
        flex-direction: column;
    }

    .chic_blog .article {
        width: 90%;
        margin-left: 5%;
        text-align: left !important;
    }
    .chic_blog .article:nth-child(2),
    .chic_blog .article:nth-child(4) {
        text-align: right !important;
    }

    .chic_blog .article a {
        align-items: start;
    }

    .chic_blog .article:nth-child(4) a {
        align-items: end;
    }

    .chic_blog .article .name {
        position: relative;
        width: 100%;
        text-align: right;
        box-sizing: border-box;
        left: 0 !important;
        top: 0 !important;
        margin-top: 0 !important;
    }

    .chic_blog .article .text {
        width: 100%;
        padding: 0;
        font-size: 4vw;
        line-height: 6vw;
        margin-top: 14px;
        text-align: left;
        height: auto;
    }

    .chic_blog .article:not(:first-child) {
        margin-top: 40px;
    }

    .chic_blog .article.flexbox-mb {
        align-items: flex-start;
        flex-direction: column;
    }

    .allProducts .sliderNav {
        width: 95%;
    }

    .allProducts .soulignonglet {
        left: 4vw;
    }

    .homepage .allProducts .bx-pager {
        display: none;
    }

    .allProducts .sliderNav p {
        font-size: 4vw;
    }

    .allProducts .product{
        width: 45vw!important;
    }

    .reseaux_sociaux .theme_title {
        font-size: 6vw;
    }


    .instafeed li {
        width: 50%;
        height: 50vw;
    }

    /************************************/
    /*          PAGE CONNEXION          */
    /************************************/
    .register .content_register {
        background-image: none;
    }

    .register .head .connexion span {
        border: none;
        padding: 0;
    }

    .register .bloc_formulaires {
        width: 100%;
        height: unset;
        background: none;
    }

    .register p.connexion.active:after,
    .register p.inscription.active:after {
        margin: 20px auto 0;
    }

    /***********************************/
    /*          COMPTE CLIENT          */
    /***********************************/
    .account_left {
        width: 100%;
    }

    .account .dashboard li.active {
        border-left: none;
    }

    .account .dashboard li a {
        font-size: 5vw;
        display: block;
        padding: 15px 5px;
    }

    .account .all_points {
        flex-direction: column;
    }

    .account .all_points .carre,
    .account .notauthentified .all_points .carre {
        width: 100%;
    }
    .account .notauthentified .programme{
        flex-direction: column;
        gap: 0;
    }
    .account .notauthentified .programme .textblock{
        max-width: inherit;
        max-height: inherit;
        padding: 60px 24px;
    }
    .account .notauthentified .step_fidelity{padding: 48px 24px;}
    .account .all_points .carre .points_count {
        top: 24vh;
    }

    .account .history .detailsOrder {
        padding: 20px 5%;
    }

    .account .history .detailsOrder li {
        width: 33%;
    }
    .account .history .line_order .all_ctas {
        flex-direction: column;
    }

    .dashboard_g, .dashboard {
        width: 100%;
    }

    .dashboard {
        transition: 0.4s;
        margin-left: -100%;
        height: 0;
    }

    .dashboard.active {
        margin-left: 0;
        height: unset;
    }

    .account_left {
        transition: 0.4s;
    }

    .account {
        position: relative;
    }

    /****************************/
    /*          TUNNEL          */
    /****************************/
    .basket{
        padding: 8px 0
    }
    .basket .content{
        flex-direction: column;
    }
    .basket .crosssell .product_line .info .price .prix{
        flex-direction: column;
        gap: 2px;
    }
    .basket_g,
    .basket_d,
    .basket_d .basket_recap {
        width: 100%;
    }

    .basket_recap{
        padding: 32px 16px;
        position: relative;
        top: 0;
    }
    .advantage_code .f_voucher input{
        width: 100%!important;
        height: 100%!important;
    }
    .basket_payment .back{
        flex-direction: row;
        padding: 14px 16px 0;
    }
    .basket_payment .payment-checkbox .break .btnpayment{
        display: none;
    }
    .basket_confirm{
        padding: 15px 0 0;
    }
    .basket_confirm .content920 {
        padding-bottom: 64px;
    }

    .basket_confirm .confirm_recap .product_line{
        width: 100%;
        padding: 8px;
    }
    .basket_confirm .confirm_recap .product_line .visuel_produit{
        max-width: 80px;
    }
    .basket_confirm .confirm_recap .product_line .name{
        font-size: 12px;
    }
    .basket_confirm .confirm_recap .product_line .title{
        font-size: 14px;
    }
    .basket_confirm .confirm_recap .product_line .capacity{
        font-size: 11px;
    }
    .basket_confirm .confirm_recap .product_line .info .price{
        flex-direction: row;
    }
    .basket_confirm .confirm_address, .basket_confirm .confirm_delivery{
        flex-direction: column;
        gap: 64px;
    }
    .basket_confirm .confirm_address > div,
    .basket_confirm .confirm_delivery > div{
        width: 100%;
    }
    .blocklivraison .mode-delivery{
        padding: 24px 16px;
    }
    .blocklivraison .mode-delivery .frais {
        white-space: nowrap;
    }
    .mapcarrier {
        flex-direction: column-reverse;
    }
    .mapcarrier .mappoints{
        height: 320px;
        width: 100%;
        overflow: inherit;
    }
    .mapcarrier .listpoints ul{
        display: flex;
        gap: 8px;
    }
    .listpoints .point-relay{
        width: 80%;
        flex-shrink: 0;
        max-height: 104px;
    }
    .product_basket{
        padding: 24px 16px;
    }
    .product_line {
        padding: 16px;
    }

    .product_line .changeQty {
        width: 100%;
        padding: 10px 0;
    }

    .product_line .changeQty input {
        width: 30px;
        font-size: 15px;
    }

    .product_line .changeQty .lessqty,
    .product_line .changeQty .moreqty {
        font-size: 15px;
    }

    .product_line .info .price{
        flex-direction: column;
        gap:5px;
    }
    .product_line.gift .visuel_produit{
        padding: 10px;
        box-sizing: border-box;
    }
    .validate-bottom{
        position: fixed;
        bottom: 0;
        width: 100%;
        background-color: #fff;
        z-index: 100;
        border-top: 1px solid #EDEAE8;
    }
    .validate-bottom .total{
        padding: 16px;
        align-items: center;
    }
    .validate-bottom .cta-grey{
       width: 100%;
    }

    .samples .hidemb {
        display: none;
    }

    .f_voucher input,
    .f_fidelity input {
        width: 55% !important;
        height: 40px !important;
    }

    .f_voucher .addVoucher,
    .f_fidelity .addVoucher {
        line-height: 25px;
    }

    .f_fidelity .addVoucher {
        width: 40%;
        padding: 7px 0;
    }

    .onglets .onglet {
        width: 95%;
    }

    .form-container {
        display: initial;
        width: 100%;
        box-sizing: border-box;
        padding: 0 2.5%;
        float: none;
    }

    .content_card label {
        font-size: 3vw;
    }

    .field-container {
        margin-top: 10px;
    }

    .content_card .container {
        width: 95%;
        margin: 0 auto;
        float: none;
    }
    .content_paypal{
        display: none !important;
    }

    /************************************/
    /*          PAGE DE MARQUE          */
    /************************************/
    .pagemarque .heritage .textblock,
    .pagemarque .science .textblock,
    .pagemarque .expertise .textblock,
    .pagemarque .rigueur .textblock {
        width: 100%;
    }
    .pagemarque .breadcrumb {
        padding: 11px 24px 0;
    }
    .pagemarque .hero{
        padding: 33px 0 0;
    }
    .pagemarque .marque {
        padding: 80px 24px 0;
    }
    .pagemarque .marque .citation{
        font-size: 36px;
    }
    .pagemarque .exigence{
        padding: 120px 24px;
        background-size: cover;
    }
    .pagemarque .exigence .title{
        text-align: center;
    }
    .pagemarque .exigence p{
        text-align: left;
     }
    .pagemarque.v2 .science {
        padding: 32px 24px
    }
    .pagemarque .table_elements{
        padding: 64px 24px;
    }
    .pagemarque .table_elements .two-blocs{
        flex-direction: column;
    }
    .pagemarque.v2 .science .two-blocs{
        flex-direction: column-reverse;
        gap: 32px;
        padding: 32px 0 0;
    }
    .pagemarque .table_elements .two-blocs .bloc, .pagemarque.v2 .science .two-blocs .bloc{
        gap: 32px;
    }
    .pagemarque .science.v2 .two-blocs .bloc:last-child {
        flex-direction: column-reverse;
    }
    .pagemarque .science.v2 .two-blocs .bloc:last-child p{
        padding-left: 0;
    }
    .pagemarque .table_elements img,
    .pagemarque .science.v2 .two-blocs img{
        width: 100%;
        height: auto;
    }
    .pagemarque .title{
        font-size: 34px;
    }
    .pagemarque.v2 .distributeur{
        padding: 64px 24px;
    }

    /*********************************/
    /*         BEAUTY AT HOME        */
    /*********************************/
    .beautyathome .intro .textblock {
        width: 100%;
        margin-left: 0;
        margin-top: 0;
    }

    .beautyathome .line:nth-child(odd) .textblock {
        padding-right: 0;
    }

    .beautyathome .line:nth-child(even) .textblock {
        padding-left: 0;
    }

    .beautyathome .contentCoaching ul {
        height: unset;
    }

    .beautyathome .contentCoaching li {
        width: 100%;
        margin-top: 50px;
    }

    .beautyathome .contentCoaching li:first-child {
        margin-top: 0;
    }

    .beautyathome .coachingbeaute .contentvideo iframe {
        margin-top: 40px;
    }



    /********************************/
    /*          PAGE GAMME          */
    /********************************/
    .pagegamme .head .visuel .bgGamme{
        height: 10px;
        margin-top: -10px;
    }
    .pagegamme .head .pictoElement {
        width: 30%;
    }

    .pagegamme .product {
        width: 100%;
        padding: 0;
    }

    /*******************************/
    /*           CONTACT           */
    /*******************************/
    .contact .box {
        width: 100%;
        box-sizing: border-box;
    }

    /*******************************/
    /*           FAQ           */
    /*******************************/
    .h2_services {
        width: 70%;
    }

    .faq .thematique {
        width: 90%;
        box-sizing: border-box;
        margin: 0 auto;
    }

    .faq .main-thematique {
        display: block;

    }

    .faq .thematique:not(:last-child) {
        margin-bottom: 20px;
    }

    /***************************************/
    /*           GROUPE PANTHER            */
    /***************************************/
    .groupe_panther img {
        width: 100%;
    }

    .groupe_panther .img-item img {
        width: 60%;
        margin: 40px auto;
    }

    /***********************************/
    /*           NOS ACTIFS            */
    /***********************************/
    .nosactifs .actif_element {
        margin-left: 0;
        margin-top: 20px;
    }

    .nosactifs .actif_element,
    .nosactifs .actif_element img {
        width: 100%;
    }

    /***************************************/
    /*           OU NOUS TROUVER           */
    /***************************************/
    .ounoustrouver .map-content .gauche {
        width: 100%;
        height: unset;
    }

    .ounoustrouver .map-content .droite {
        display: none;
    }

    .ounoustrouver .recherche .searchbar {
        width: 70%;
    }

    .ounoustrouver .recherche input {
        width: 100%;
    }

    .ounoustrouver .recherche .cta-grey {
        margin-left: 3%;
        width: 26%;
    }

    /*******************************************/
    /*           ESPACE DISTRIBUTEUR           */
    /*******************************************/
    .distributeurs .mag-slider .bx-wrapper,
    .distributeurs .mag-slider .bx-viewport,
    .distributeurs .bxslideremag li {
        width: 100vw !important;
    }

    .distributeurs .bxslideremag li img {
        margin: auto;
    }

    .distributeurs .bx-wrapper .bx-controls-direction .bx-prev {
        left: 0;
    }

    .distributeurs .bx-wrapper .bx-controls-direction .bx-next {
        right: 0;
    }

    .distributeurs .container .onglet {
        font-size: 4vw;
        word-break: break-word;
    }

    .distributeurs .inside .block {
        width: 47%;
        margin-left: 0;
        margin-right: 0;
    }

    .distributeurs .inside .block:nth-child(even) {
        margin-left: 4%;
    }


    /**********************************/
    /*          PAGES ACTIFS          */
    /**********************************/
    .actif_page .benefices img {
        width: 95%;
        margin-left: auto;
        margin-right: auto;
        display: block;
    }

    .actif_page .benefices .textblock {
        margin-left: 0;
        margin-top: 20px;
        padding: 0 2.5%;
    }

    .actif_page .content_slider_product .bx-wrapper .bx-prev {
        left: 0;
        top: 80px;
    }

    .actif_page .content_slider_product .bx-wrapper .bx-prev {
        left: 0;
        top: 50%;
    }

    .actif_page .content_slider_product .bx-wrapper .bx-next {
        right: 0;
        top: 50%;
    }

    .actif_page .content_selection .bx-wrapper .bx-prev,
    .actif_page .content_selection .bx-wrapper .bx-next {
        top: 25%;
    }

    .pop_fidelity .box {
        height: 90vh !important;
    }

    .cnil {
        padding: 25px 0;
        font-size: 11.50px;
    }

    .cnil .content {
        width: 91.5%;
    }
}

@media screen and (max-width: 700px) {
    .f3vw-mb {
        font-size: 3vw;
    }

    .f3-5vw-mb {
        font-size: 3.5vw;
    }

    .f4vw-mb {
        font-size: 4vw;
    }

    .f4-5vw-mb {
        font-size: 4.5vw;
    }

    .f5vw-mb {
        font-size: 5vw;
    }

    .f6vw-mb {
        font-size: 6vw;
    }

    .f7vw-mb {
        font-size: 7vw;
    }

    .f8vw-mb {
        font-size: 8vw;
    }

    .f9vw-mb {
        font-size: 9vw;
    }

    .f12vw-mb {
        font-size: 12vw;
    }

    .lh4vw-mb {
        line-height: 4vw;
    }

    .lh5vw-mb {
        line-height: 5vw;
    }

    .lh6vw-mb {
        line-height: 6vw;
    }

    .lh7vw-mb {
        line-height: 7vw;
    }

    .lh8vw-mb {
        line-height: 8vw;
    }

    .lh9vw-mb {
        line-height: 9vw;
    }

    .lh11vw-mb {
        line-height: 11vw;
    }

    .lh12vw-mb {
        line-height: 12vw;
    }


    .bloc_elements .head .slider_elements li:nth-of-type(1) img,
    .bloc_elements .head .slider_elements li:nth-of-type(5) img {
        width: 60%;
    }

    .bloc_elements .head .slider_elements li:nth-of-type(2) img,
    .bloc_elements .head .slider_elements li:nth-of-type(4) img {
        width: 70%;
    }

    .bloc_elements .head .slider_elements li:nth-of-type(3) img {
        width: 100%;
    }
}

@media screen and (min-width: 768px) and (max-width: 1023px) and (orientation: portrait) {
    .mt-0-t {
        margin-top: 0;
    }

    .f2vw-t {
        font-size: 2vw !important;
    }

    .f3vw-t {
        font-size: 3vw !important;
    }

    .f3-5vw-t {
        font-size: 3.5vw !important;
    }

    .f4vw-t {
        font-size: 4vw !important;
    }

    .f5vw-t {
        font-size: 5vw !important;
    }

    .f6vw-t {
        font-size: 6vw !important;
    }

    .f7vw-t {
        font-size: 7vw !important;
    }

    .lh3vw-t {
        line-height: 3vw !important;
    }

    .lh4vw-t {
        line-height: 4vw !important;
    }

    .lh5vw-t {
        line-height: 5vw !important;
    }

    .w10pc-t {
        width: 10%;
    }

    .w20pc-t {
        width: 20%;
    }

    .w30pc-t {
        width: 30%;
    }

    .w40pc-t {
        width: 40%;
    }

    .w50pc-t {
        width: 50%;
    }

    .w60pc-t {
        width: 60%;
    }

    .w70pc-t {
        width: 70%;
    }

    .w80pc-t {
        width: 80%;
    }

    .w90pc-t {
        width: 90%;
    }

    .w100pc-t {
        width: 100%;
    }

    .marginauto-t {
        margin-left: auto;
        margin-right: auto;
    }

    .displayblock-t {
        display: block;
    }

    footer .logo {
        width: 100%;
        text-align: center;
    }

    .theme_title {
        font-size: 4vw;
    }

    .nouvel_imaginaire .philosophie .discover {
        margin-top: 10vh;
    }

    .excellence .visuel .textblock {
        width: 60%;
    }

    .chic_blog .logo_chic {
        width: 50vw;
    }

    .account .notauthentified .programme .textblock {
        max-width: none;
        width: 100%;
    }

    .account .all_points {
        flex-direction: row;
    }
}

@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
    /************************************/
    /*          PAGE DE MARQUE          */
    /************************************/
    .pagemarque {
        padding: 0 2.5%;
    }

    .pagemarque .marque img,
    .pagemarque .heritage img,
    .pagemarque .science img,
    .pagemarque .expertise img,
    .pagemarque .rigueur img {
        max-width: 420px;
    }

    .pagemarque .heritage .textblock,
    .pagemarque .science .textblock,
    .pagemarque .expertise .textblock,
    .pagemarque .rigueur .textblock {
        max-width: 545px;
    }
}


/*-----------------------------------------------------------------------*/
/*Où nous trouver*/
/*-----------------------------------------------------------------------*/
.storelocator .page-title{
    font-family: "AmericanTypewriter";
    font-size: 30px;
    line-height: 34px;
    letter-spacing: 1.8px;
    color: #1E1E1E;
    text-align: center;
    margin-top: 80px;
}
.storelocator .subtitle{
    font-size: 18px;
    line-height: 24px;
    letter-spacing: 0.5px;
    color: #212121;
    text-align: center;
    margin-top: 10px;
    display: block;
}
.storelocator .map{
    height: 700px;
}
.storelocator .content-map{
    position: relative;
    width: 100%;
    transition: .5s;
}
.storelocator .f_searchaddress{
    position: absolute;
    top: 30px;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
}
.storelocator .f_searchaddress .geoloc{
    cursor:pointer;
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #F3E3DD;
}
.storelocator .f_searchaddress input{
    width: 570px;
    background-color: #fff;
    height: 50px;
    padding: 20px 30px;
    box-sizing: border-box;
    transition: .5s;
}
.storelocator .f_searchaddress .btn-submit{
    width: 160px;
    height: 50px;
}
.storelocator .gm-style .gm-style-iw-c {
    border-radius: 3px;
    padding: 15px 10px;
    box-sizing: border-box;
}
.storelocator .gm-style .gm-style-iw-t::after {
    display: none;
}
.storelocator .content-pop {
    text-align: center;
}
.storelocator .content-pop .text1{
    display: block;
    font-size: 13px;
    line-height: 20px;
    font-weight: 600;
    letter-spacing: 0.3px;
}
.storelocator .content-pop .text1b{
    margin-top: 20px;
}
.storelocator .content-pop .text2{
    display: block;
    font-size: 13px;
    line-height: 14px;
    letter-spacing: 0.5px;
    margin-top: 10px;
}
.storelocator .content-locator{
    display: flex;
    margin: 30px 0;
    height: 700px;
    overflow: hidden;
}
.storelocator .content-locator.stores-active > div{
    width: 50%;
}
.storelocator .content-locator .stores-list{
    width: 100%;
    margin-left: -100%;
    transition: .5s;
}
.storelocator .content-locator.stores-active .stores-list{
    margin-left: 0;
    position: relative;
}

.storelocator .content-locator.stores-active .stores-list .close-thin{
    position: absolute;
    right: 13px;
    top: 13px;
    color: #4B4853;
    font-size: 30px;
}

.storelocator{
    margin-top: 80px;
}

.storelocator .content-locator.stores-active .stores-list{
    margin-left: 0;
}
.storelocator .content-locator.stores-active .f_searchaddress input{
    width: 340px;
}
.storelocator .stores-list {
    background-color: #F3E3DD;
}
.storelocator .stores-list .results {
    padding: 20px;
    font-size: 13px;
    line-height: 15px;
    letter-spacing: 0.35px;
    display: block;
    border-bottom: 1px solid #F1D3CB;
}
.storelocator .stores-list .list {
    display: flex;
    flex-wrap: wrap;
    height: calc(100% - 56px);
    overflow-y: scroll;
}
.storelocator .stores-list .list li {
    width: 50%;
    box-sizing: border-box;
    padding: 30px 40px;
    text-align: center;
    border-bottom: 2px solid #F1D3CB;
}
.storelocator .stores-list .list li:nth-child(odd) {
    border-right: 2px solid #F1D3CB;
}
.storelocator .stores-list .list .distance{
    font-size: 11px;
    font-weight: 700;
    color: #E86464;
    letter-spacing: 0.3px;
    display: block;
    margin-top: 10px;
}
.storelocator .stores-list .list .name{
    font-size: 13px;
    line-height: 15px;
    font-weight: 700;
    letter-spacing: 0.3px;
    display: block;
    margin-top: 15px;
}
.storelocator .stores-list .list .address{
    font-size: 13px;
    line-height: 18px;
    letter-spacing: 0.5px;
    display: block;
    margin-top: 15px;
}
.storelocator .stores-list .list .complements{
    font-size: 13px;
    letter-spacing: 0.5px;
    display: block;
    line-height: 15px;
}
.storelocator .stores-list .list .complements::first-letter{
    text-transform: uppercase;
}

.storelocator .stores-list .list .btn-details{
    display: block;
    margin-top: 25px;
    background-color: #4B4853;
}

@media screen and (max-width: 1024px){
    .storelocator .page-title{
        font-size: 21px;
        line-height: 23px;
        padding: 0 10px;
    }
    .storelocator .subtitle{
        font-size: 14px;
        line-height: 19px;
        padding: 0 10px;
    }
    .storelocator .content-locator{
        flex-direction: column-reverse;
        height: auto;
    }
    .storelocator .map{
        width: 100%;
        height: 600px;
    }
    .storelocator .content-locator > div{
        width: 100% !important;
    }
    .storelocator .f_searchaddress{
        position: static;
        width: 100%;
        margin: auto;
        box-shadow: 0 1px 10px 0 rgba(0, 0, 0, .1);
    }
    .storelocator .f_searchaddress .btn-submit{
        width: 90px;
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .storelocator .f_searchaddress input{
        width: calc(100% - 140px);
        padding: 15px 10px;
    }
    .storelocator .stores-list{
        margin-top: 60px;
    }
}
@media screen and (max-width: 768px){
    .storelocator .stores-list .list li{
        width: 100%;
    }
    .storelocator .stores-list .list li:nth-child(odd){
        border-right: 0;
    }
}

.bck-pink {
    background-color: #f3e4dd;
}

.bck-pink.sample {
    padding: 15px;
    text-align: center;
}

#hp-full-video{
    position: relative;
}
#hp-full-video video{
    position: relative;
    z-index: 1;
}
#hp-full-video .close-video:after{
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 35px;
    font-weight: 600;
    padding: 10px;
    z-index: 10;
}

div[id^="pop"].layerright .box{
    top: 0 !important;
    height: 100vh;
    right: -100vw;
    left: auto;
    max-width: 515px;
    width: 100%;
    transition: right .3s ease;
    overflow-y: scroll;
    color: #181818;
}
div[id^="pop"].layerright  .box .popitcontent{
    padding: 0;
    width: 100%;
}
div[id^="pop"].layerright .box .popitcloser{
    top: 18px;
}
div[id^="pop"].popConnexion .content_login,
div[id^="pop"].popConnexion .content_create{
    padding: 0;
}
div[id^="pop"].layerright .box .head{
    padding: 24px 16px;
    border-bottom: 1px solid #E5E5E5;
}
div[id^="pop"].layerright .box .contentpopin{
    padding: 32px 64px;
}
div[id^="pop"].popConnexion.layerright .box .contentpopin{
    padding: 32px 45px;
}
div[id^="pop"].layerright .box .popin-bottom{
    position: fixed;
    bottom: 0;
    display: flex;
    padding: 20px 64px;
    box-sizing: border-box;
    width: 100%;
    max-width: 515px;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid #E5E5E5;
    background-color: #FFF;
}
.figure.abricot {
    position: absolute;
    left: -22%;
    top: -5%;
    width: 55%;
    transform: rotate(-10deg) scaleX(-1);
}
.figure.vanille {
    position: absolute;
    left: -12%;
    top: 45%;
    width: 40%;
    transform: rotate(-10deg) scaleX(-1);
}
.figure.rose {
    position: absolute;
    right: -12%;
    top: -65%;
    width: 33%;
}
.figure.raisins {
    width: 33%;
    position: absolute;
    bottom: -2%;
    transform: rotate(42deg);
    right: -9%;
}
.page-marque .breadcrumb{
    margin-top: 0;
    padding: 16px 24px;
}