/*
 * Theme Name: Le Studio
 * Description: 
 * Author: Le Studio
 * Version: 2.0.1
 * Tags: 
 */


body {
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 1em;
    font-family: 'Montserrat';
    color: black;
    position: relative;
    overflow-x: hidden;
    margin: 0;
}

body, section, article, div, ul, li, p, img, textarea, input {
    box-sizing: border-box;
}

.wrapper.clearfix{
    overflow-x: hidden;
}

h1 { font-size: 2em;  margin: 0; }
h2 { font-size: 1.5em; margin: 0; }
h3 { font-size: 1.17em; margin: 0; }
h4 { font-size: 1.12em; margin: 0; }
h5 { font-size: .83em;  margin: 0; }
h6 { font-size: .75em;  margin: 0; }

img { max-width: 100%; height: auto; }



/* *** TYPOS *** */
/* montserrat-300 - latin */
/* montserrat-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 300;
  src: url('/wp-content/themes/lestudio/fonts/montserrat-v30-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/wp-content/themes/lestudio/fonts/montserrat-v30-latin-300.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* montserrat-300italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 300;
  src: url('/wp-content/themes/lestudio/fonts/montserrat-v30-latin-300italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/wp-content/themes/lestudio/fonts/montserrat-v30-latin-300italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* montserrat-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url('/wp-content/themes/lestudio/fonts/montserrat-v30-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/wp-content/themes/lestudio/fonts/montserrat-v30-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* montserrat-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 400;
  src: url('/wp-content/themes/lestudio/fonts/montserrat-v30-latin-italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/wp-content/themes/lestudio/fonts/montserrat-v30-latin-italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* montserrat-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  src: url('/wp-content/themes/lestudio/fonts/montserrat-v30-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/wp-content/themes/lestudio/fonts/montserrat-v30-latin-600.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* montserrat-600italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 600;
  src: url('/wp-content/themes/lestudio/fonts/montserrat-v30-latin-600italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/wp-content/themes/lestudio/fonts/montserrat-v30-latin-600italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* montserrat-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  src: url('/wp-content/themes/lestudio/fonts/montserrat-v30-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/wp-content/themes/lestudio/fonts/montserrat-v30-latin-700.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* montserrat-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 700;
  src: url('/wp-content/themes/lestudio/fonts/montserrat-v30-latin-700italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/wp-content/themes/lestudio/fonts/montserrat-v30-latin-700italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}


/* *** CLASS FLEX *** */
.flex {
    display: flex;
}
.flex-column {
    display: flex;
    flex-direction: column;
}
.flex-wrap {
    flex-wrap: wrap;
}
.ai-center {
    align-items: center;
}
.ai-flex-start {
    align-items: flex-start;
}
.ai-flex-end {
    align-items: flex-end;
}
.jc-space-around {
    justify-content: space-around; 
}
.jc-space-between {
    justify-content: space-between; 
}
.jc-flex-end {
    justify-content: flex-end;
}
.jc-flex-start {
    justify-content: flex-start;
}
.jc-center {
    justify-content: center;
}

/* *** COULEURS *** */
:root {
    --blue1: #2DAEE7;
    --blue1-var: #5096CF;
    --blue2: #1D4382;
    --blue2-var: #192E52;
    --grey1: #D0D0D0;
    --grey2: #9E9E9E;
    --grey3: #6C6C6C;
    --grey4: #565656;
    --green: #06A192;
}

.has-blue-1-background-color {
    background-color: #2DAEE7;
}
.has-blue-1-color,
.has-blue-1-color h1,
.has-blue-1-color h2,
.has-blue-1-color h3,
.has-blue-1-color h4,
.has-blue-1-color p,
.has-blue-1-color a{
    color: #2DAEE7;
}
.has-blue-1-var-background-color {
    background-color: #5096CF;
}
.has-blue-1-var-color,
.has-blue-1-var-color h1,
.has-blue-1-var-color h2,
.has-blue-1-var-color h3,
.has-blue-1-var-color h4,
.has-blue-1-var-color p,
.has-blue-1-var-color a{
    color: #5096CF;
}
.has-blue-2-background-color {
    background-color: #1D4382;
}
.has-blue-2-color,
.has-blue-2-color h1,
.has-blue-2-color h2,
.has-blue-2-color h3,
.has-blue-2-color h4,
.has-blue-2-color p,
.has-blue-2-color a{
    color: #1D4382;
}
.has-blue-2-var-background-color {
    background-color: #192E52;
}
.has-blue-2-var-color,
.has-blue-2-var-color h1,
.has-blue-2-var-color h2,
.has-blue-2-var-color h3,
.has-blue-2-var-color h4,
.has-blue-2-var-color p,
.has-blue-2-var-color a{
    color: #192E52;
}

.has-grey-1-background-color {
    background-color: #D0D0D0;
}
.has-grey-1-color,
.has-grey-1-color h1,
.has-grey-1-color h2,
.has-grey-1-color h3,
.has-grey-1-color h4,
.has-grey-1-color p,
.has-grey-1-color a{
    color: #D0D0D0;
}
.has-grey-2-background-color {
    background-color: #9E9E9E;
}
.has-grey-2-color,
.has-grey-2-color h1,
.has-grey-2-color h2,
.has-grey-2-color h3,
.has-grey-2-color h4,
.has-grey-2-color p,
.has-grey-2-color a{
    color: #9E9E9E;
}
.has-grey-3-background-color {
    background-color: #6C6C6C;
}
.has-grey-3-color,
.has-grey-3-color h1,
.has-grey-3-color h2,
.has-grey-3-color h3,
.has-grey-3-color h4,
.has-grey-3-color p,
.has-grey-3-color a{
    color: #6C6C6C;
}
.has-grey-4-background-color {
    background-color: #565656;
}
.has-grey-4-color,
.has-grey-4-color h1,
.has-grey-4-color h2,
.has-grey-4-color h3,
.has-grey-4-color h4,
.has-grey-4-color p,
.has-grey-4-color a{
    color: #565656;
}

.has-green-background-color {
    background-color: #06A192;
}
.has-green-color,
.has-green-color h1,
.has-green-color h2,
.has-green-color h3,
.has-green-color h4,
.has-green-color p,
.has-green-color a{
    color: #06A192;
}

.has-noir-background-color {
    background-color: #000000;
}
.has-noir-color,
.has-noir-color h1,
.has-noir-color h2,
.has-noir-color h3,
.has-noir-color h4,
.has-noir-color p,
.has-noir-color a{
    color: #000000;
}

.has-blanc-background-color {
    background-color: #FFFFFF;
}
.has-blanc-color,
.has-blanc-color h1,
.has-blanc-color h2,
.has-blanc-color h3,
.has-blanc-color h4,
.has-blanc-color p,
.has-blanc-color a{
    color: #FFFFFF;
}



/* ************************ GLOBALE ************************ */

body > *{
    position: relative;
    z-index: 1;
}
#fond-site{
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 0;
    object-fit: cover;
    object-position: bottom left;
}
#header_accueil,
#header_accueil_hydro{
    background: rgba(0, 0, 0, 0.2);
}

/* *** PRELOADER *** */
#preloader{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: white;
    z-index: 9999999999;
    display: flex;
    align-items: center ;
    justify-content: center ;
}
  
#loading{
    width: 150px;
    height: 150px;
    position: relative;
    -webkit-animation: mymove 1.5s infinite; 
    animation: mymove 1.5s infinite;
}

/*** ANIMATION PRELOADER ***/
@-webkit-keyframes mymove {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.5);
    }
    100% {
        transform: scale(1);
    }
}   


/* ************************ NAGIGATION ************************ */
.menu_ordi{
    display: block;
}
.menu_mobile{
    display: none;
}

/* *** MENU ORDI *** */
.header{
    position: relative;
}
.header > *{
    position: relative;
    z-index: 1;
}
#filtre-header{
    position: fixed;
    z-index: 0;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: linear-gradient(to bottom, var(--blue2), var(--blue1));
    mix-blend-mode: color;
}

#filtre-header.blog-2{
    background: linear-gradient(to bottom, var(--green),  var(--blue1));
    background: transparent;
    mix-blend-mode: color;
}

#inner-bandeau-navigation{
    max-width: 1800px;
    margin-left: auto;
    margin-right: auto;
    padding: 15px;
}

#menu-menuprincipal,
#menu-menumobile-1{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
}
#menu-menuprincipal li,
#menu-menumobile-1 li{
    list-style: none;
}
#menu-menuprincipal li a,
#menu-menumobile-1 li a{
    position: relative;
    color: white;
    font-size: 1.2em;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s ease-in-out;
}

#menu-menuprincipal li a:after,
#menu-menumobile-1 li a:after{
    position: absolute;
    content: "";
    width: 50px;
    left: 0;
    height: 4px;
    bottom: -15px;
    transform: scaleX(0);
    transform-origin: left center;
    background-color: white;
    transition: all 0.2s ease-in-out;
}
#menu-menuprincipal li a:hover:after,
#menu-menuprincipal li a.active:after,
#menu-menumobile-1 li a:hover:after,
#menu-menumobile-1 li a.active:after {
    transform: scaleX(1);
}

#menu-menuprincipal li:last-child a:after,
#menu-menumobile-1 li:last-child a:after{
    display: none;
}
#menu-menuprincipal li svg,
#menu-menumobile-1 li svg{
    width: 35px;
    height: 35px;
}

#contacts-header{
    gap: 30px;
}
#tel-header a{
    color: white;
    font-size: 1.2em;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s ease-in-out;
}
#tel-header svg{
    margin-right: 5px;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    
}

#tel-header svg path{
    transition: all 0.2s ease-in-out;
}

#contacts-header, #logo-header{
    width: 321px;
}
#nav-header{
    width: calc(100% - 642px);
}

#logo-header img {
    transition: opacity 0.2s ease;
}

#logo-header img.is-switching {
    opacity: 0;
}

#bandeau-navigation{
    position: fixed;
    z-index: 5;
    top: 0;
    left: 0;
    width: 100%;
    transition: all 0.2s ease-in-out;
}

#logo-header img{
    transition: all 0.2s ease-in-out;
}

#reseaux-header svg circle,
#reseaux-header svg path{
    transition: all 0.2s ease-in-out;
}

#bandeau-navigation.scrolled,
#header_page #bandeau-navigation{
    background-color: white;
    box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 1px, rgba(0, 0, 0, 0.07) 0px 2px 2px, rgba(0, 0, 0, 0.07) 0px 4px 4px, rgba(0, 0, 0, 0.07) 0px 8px 8px, rgba(0, 0, 0, 0.07) 0px 16px 16px;
}
#bandeau-navigation.scrolled #menu-menuprincipal li a,
#header_page #bandeau-navigation #menu-menumobile-1 li a{
    color: black;
}

#bandeau-navigation.scrolled #tel-header a,
#header_page #bandeau-navigation #tel-header a{
    color: var(--blue2);
}
#bandeau-navigation.scrolled  #tel-header svg path,
#header_page #bandeau-navigation  #tel-header svg path{
    stroke: var(--blue2);
}
#bandeau-navigation.scrolled #reseaux-header svg circle,
#header_page #bandeau-navigation #reseaux-header svg circle{
    stroke: var(--blue2);
}
#bandeau-navigation.scrolled #reseaux-header svg  path,
#header_page #bandeau-navigation #reseaux-header svg  path{
    fill: var(--blue2);
}
#bandeau-navigation.scrolled #menu-menuprincipal li a:after,
#header_page #bandeau-navigation #menu-menumobile-1 li a:after{
    background-color: black;
}


/*** menu mobile ***/
/* Container du burger */
#burger-container {
    position: fixed;
    top: 10px;
    left: 10px;
    z-index: 9999;
    background: var(--blue1);
    width: 50px;
    height: 50px;
    border-radius: 50%;
    transition: all 0.2s ease-in-out;
}
/*#burger-container:hover {
    background-color: var(--blue2);
}*/

body.page-template-accueil_hydro #burger-container{
    background: var(--green);
}

/* Bouton burger */
#burger-button {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
    gap: 5px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
}
#burger-button span {
    display: block;
    height: 4px;
    width: 30px;
    background: white;
}

/* Menu latéral */
#mobile-menu {
    position: fixed;
    top: 0;
    left: -150%;
    width: 280px;
    height: 100vh;
    background-color: white;
    box-shadow: 2px 0 10px rgba(0,0,0,0.2);
    transition: left 0.3s ease;
    padding: 20px;
    z-index: 9998;
}

/* Menu visible */
#mobile-menu.open {
    left: 0;
}

/* Bouton fermer */
#close-menu {
    background: none;
    border: none;
    font-size: 2rem;
    position: absolute;
    top: 10px;
    right: 15px;
    cursor: pointer;
}

/* Menu items */
.mobile-nav {
    list-style: none;
    padding: 50px 0 0 0;
}
.mobile-nav li {
    margin: 15px 0;
}
.mobile-nav a {
    text-decoration: none;
    font-size: 18px;
    color: black;
}


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

#contenu-header{
    position: relative;
    min-height: calc(100vh - 65px);
    width: 100%;
    max-width: 1800px;
    margin-left: auto;
    margin-right: auto;
}

#titre-header {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 300px;
    margin-top: 60px;
}

#bandeau-bas-header {
    width: 100%;
    height: auto;
}

#titre-header h1 {
    position: relative;
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease, transform 0.6s ease;
    transition-delay: 1s;

    font-weight: normal;
    font-size: 2.8em;
    line-height: 150%;
    text-align: left;
    padding-left: 80px;
    color: white;
}

#titre-header h1:before{
    content: "";
    position: absolute;
    top: 0.2em;
    left: 0;
    width: 60px;
    height: 60px;
    background: url(/wp-content/themes/lestudio/img/guillemet.png);
    background-size: contain;
    background-position: top left;
    background-repeat: no-repeat;

}
#titre-header h1.visible {
  opacity: 1;
  transform: translateY(0);
}

#bandeau-bas-header{
    position: relative;
    padding: 50px 15px;
    max-width: 1800px;
    margin-left: auto;
    margin-right: auto;
}

#bloc-sf-header ul{
    padding: 0;
}
#bloc-sf-header li{
    position: relative;
    list-style: none;
    color: white;
    font-size: 1.4em;
    line-height: 200%;
    padding-left: 70px;

    opacity: 0;
    transform: translateX(-20px);
    transition: opacity 0.5s ease, transform 0.5s ease;
}
#bloc-sf-header ul li.visible {
    opacity: 1;
    transform: translateX(0);
}
#bloc-sf-header li:before{
    content: "";
    position: absolute;
    height: 10px;
    width: 10px;
    border: 1px solid white;
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);

    left: 0;
}
#bloc-sf-header li:after{
    content: "";
    position: absolute;
    height: 1px;
    width: 50px;
    background-color: white;
    top: 50%;
    transform: translateY(-50%);
    left: 15px;
}

#bloc-sf-header li:nth-child(1){
    margin-left: 40px;
}
#bloc-sf-header li:nth-child(2){
    margin-left: 20px;
}
#bloc-sf-header li:nth-child(3){
    margin-left: 0;
}

a#btn-site{
    display: flex;
    padding: 10px 15px 10px 10px;
    text-transform: uppercase;
    text-decoration: none;
    color: white;
    border: 1px solid white;
    margin-top: 15px;
}

a#btn-site img{
    margin-right: 10px;
    margin-left: 0;
    transition: all 0.2s ease-in-out;
}
a#btn-site:hover img{
    margin-right: 5px;
    margin-left: 5px;
}

#wrapper-contenu-header{
    overflow: hidden;
    width: 100%;
}

#contenu-header::before {
    content: "";
    position: absolute;
    top: 0;
    left: 30px;
    aspect-ratio: 1 / 2.75; /* largeur / hauteur = tan(70°) */
    height: 100%;
    background-color: var(--blue1, #fff);
    clip-path: polygon(100% 0, 0 0, 0 100%);
    z-index: -1;
    pointer-events: none;
}
#contenu-header::after {
    content: "";
    position: absolute;
    top: 0;
    left: calc(-50vw + 31px);
    width: 50vw;
    height: 100%;
    background: var(--blue1);
    z-index: -1;
}

header.blog-2 #contenu-header::before,
header.blog-2 #contenu-header::after{
     background-color: var(--green, #fff);
}


#btn-scroll-down{
    position: absolute;
    bottom: -20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
    transition: all 0.2s ease-in-out;
    cursor: pointer;
}

#btn-scroll-down:hover{
    opacity: 0.8;
}


/*** parallax ***/
#wrapper-contenu-header::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    z-index: 0;
    width: 18vw;
    height: 100%;
    background: url(/wp-content/themes/lestudio/img/vagues.svg);
    background-size: contain;
    background-position: center left;
    background-repeat: no-repeat;
    transform: translateY(var(--parallax-offset, 0));
    transition: transform 0.1s linear;
    pointer-events: none;
}

section#experience::before {
    position: absolute;
    content: "";
    top: -100%;
    right: 0;
    z-index: 0;
    width: 15vw;
    height: 100%;
    background: url(/wp-content/themes/lestudio/img/vagues_3.svg);
    background-size: contain;
    background-position: top right;
    background-repeat: no-repeat;
    transform: translateY(var(--parallax-offset, 0));
    transition: transform 0.1s linear;
    pointer-events: none;
}

section#realisations::before {
    position: absolute;
    content: "";
    top: -75%;
    left: 0;
    z-index: 0;
    width: 12vw;
    height: 100%;
    background: url(/wp-content/themes/lestudio/img/vagues_4.svg);
    background-size: contain;
    background-position: top left;
    background-repeat: no-repeat;
    transform: translateY(var(--parallax-offset, 0));
    transition: transform 0.1s linear;
    pointer-events: none;
}

section#equipe::before {
    position: absolute;
    content: "";
    top: -60%;
    right: 0;
    z-index: 0;
    width: 12vw;
    height: 100%;
    background: url(/wp-content/themes/lestudio/img/vagues_5.svg);
    background-size: contain;
    background-position: top right;
    background-repeat: no-repeat;
    transform: translateY(var(--parallax-offset, 0));
    transition: transform 0.1s linear;
    pointer-events: none;
}

/* ************************ PAGE ACCUEIL ************************ */

#main{
    background-color: white;
    overflow: hidden;
}

/* ************************ PAGE ... ************************ */

.pre-titre{
    position: relative;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding: 15px 30px;
    font-weight: 600;
    color: var(--grey4);
    text-transform: uppercase;
}

#presentation .pre-titre:before,
#experience .pre-titre:before,
#savoir-faire .pre-titre:before,
#realisations .pre-titre:before,
#equipe .pre-titre:before,
#contact .pre-titre:before,
#bandeau-sponsoring .pre-titre:before{
    position: absolute;
    content: "";
    width: 50vw;
    height: 1px;
    background: var(--grey4);
    top: 50%;
    transform: translateY(-50%);
    left: -50vw;
}

#experience .pre-titre,
#equipe .pre-titre,
#bandeau-sponsoring .pre-titre{
    display: inline-block;
    left: 50%;
    transform: translateX(-50%);
}


/* ************************ PAGE GLOBALE ************************ */

.section_contenu{
    background-color: white;
    padding-top: 100px;
    position: relative;
}

.section_contenu > *{
    position: relative;
    z-index: 1;
}

/* Gutenberg */
.contenu_gutenberg{
    max-width: 1200px;
    margin: 0 auto;
    padding: 30px 15px;
}

.contenu_gutenberg > *{
    padding-left: 15px;
    padding-right: 15px;
}

.contenu_gutenberg p{
    margin-bottom: 15px;
    line-height: 180%;
}
.contenu_gutenberg p.has-text-align-center{
    text-align: center;
}
.contenu_gutenberg p.has-text-align-left{
    text-align: left;
}
.contenu_gutenberg p.has-text-align-right{
    text-align: right;
}
.contenu_gutenberg p.has-background{
    margin-top: 30px;
    margin-bottom: 30px;
    padding: 15px;
}

.contenu_gutenberg ul,
.contenu_gutenberg ol{
    margin-bottom: 15px;
    padding-left: 35px;
}
.contenu_gutenberg .wp-block-group__inner-container > ul,
.contenu_gutenberg .wp-block-group__inner-container > ol{
    padding: 0;
    padding-left: 20px;
}
.contenu_gutenberg ul li,
.contenu_gutenberg ol li{
    line-height: 140%;
    list-style-position: outside;
    padding-bottom: 5px;
}
.contenu_gutenberg .wp-block-group, .contenu_gutenberg .wp-block-columns, .contenu_gutenberg .wp-block-media-text{
    margin-top: 30px;
    margin-bottom: 30px;
    padding: 15px;
}
.contenu_gutenberg .wp-block-buttons, .contenu_gutenberg .wp-block-table{
    margin-top: 30px;
    margin-bottom: 30px;
}

.contenu_gutenberg .wp-block-columns .wp-block-media-text{
    padding: 0;
    margin-top: 0;
    margin-bottom: 0;
}

.contenu_gutenberg .wp-block-image{
    margin-top: 30px;
    margin-bottom: 30px;    
}

.wp-block-image.ombre img{
    box-shadow: 0 0 10px 1px rgba(41, 56, 115, 0.4);
}

.contenu_gutenberg .wp-block-group.titre-section{
    margin-top: 0;
    margin-bottom: 0;
    padding: 0;
}

.contenu_gutenberg .wp-block-group.titre-section .wp-block-image{
    margin-top: 30px;
    margin-bottom: 0;
}

.contenu_gutenberg h2{
    margin-top: 30px;
    margin-bottom: 30px;
    font-size: 2em;
    text-transform: uppercase;
    color: var(--blue2);
    font-weight: normal;
}

.contenu_gutenberg h3{
    margin-top: 25px;
    margin-bottom: 20px;
    color: var(--blue2);
    font-weight: normal;
    font-size: 1.3em;
}

.contenu_gutenberg h4{
    margin-top: 20px;
    margin-bottom: 15px;
}

.contenu_gutenberg > *:last-child,
.contenu_gutenberg .wp-block-columns p:last-child, /*.contenu_gutenberg .wp-block-media-text p:last-child,*/
.contenu_gutenberg .wp-block-columns ul:last-child, /*.contenu_gutenberg .wp-block-media-text ul:last-child,*/
.contenu_gutenberg .wp-block-columns ol:last-child/*, .contenu_gutenberg .wp-block-media-text ol:last-child*/{
    margin-bottom: 0;
}

.contenu_gutenberg > *:first-child,
.contenu_gutenberg .wp-block-columns p:first-child, .contenu_gutenberg .wp-block-media-text p:first-child,
.contenu_gutenberg .wp-block-columns ul:first-child, .contenu_gutenberg .wp-block-media-text ul:first-child,
.contenu_gutenberg .wp-block-columns ol:first-child, .contenu_gutenberg .wp-block-media-text ol:first-child{
    margin-top: 0;
}

.contenu_gutenberg .wp-block-media-text .wp-block-media-text__content{
    padding-right: 0;
    padding-left: 8%;
}
.contenu_gutenberg .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content{
    padding-right: 8%;
    padding-left: 0;
}
.contenu_gutenberg a{
    color: var(--blue2);
}

/* ************************ DIAPO SLICK ************************ */

.diaporama-slick {
    width: 100%;
}

.diapo {
    height: 100%;
    width: 100%;
}

.diaporama-slick  .slick-list{
    border: 1px solid var(--grey4);
}

.diapo-texte {
    position: relative;
    width: 460px;
    padding: 50px 30px;
    background-color: white;
    z-index: 2;
    min-height: 500px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.diapo-image {
    width: calc(100% - 460px);
    height: auto;
    background-size: cover;
    background-position: center;
}

.diapo-texte::before {
    content: "";
    position: absolute;
    top: 0;
    left: calc(100% - 2px);
    aspect-ratio: 1 / 2.75;
    height: 100%;
    background-color: white;
    clip-path: polygon(100% 0, 0 0, 0 100%);
    z-index: -1;
    pointer-events: none;
}

#savoir-faire{
    position: relative;
    padding-top: 0;
    margin-top: 100px;
    background-color: white;
}

#savoir-faire::before {
    content: "";
    position: absolute;
    top: 0;
    left: calc(50% - 150px);
    aspect-ratio: 1 / 2.75;
    height: 100%;
    background-color: var(--blue1-var);
    clip-path: polygon(100% 100%, 100% 0, 0 100%);;
    z-index: 0;
    pointer-events: none;
}

#savoir-faire::after {
    content: "";
    position: absolute;
    top: 0;
    width: 100vw;
    left: calc(50% + 122px);
    height: 100%;
    background-color: var(--blue1-var);
    z-index: 0;
}

#savoir-faire > *{
    position: relative;
    z-index: 1;
}

.slick-prev, .slick-next {
    width: 40px !important;
    height: 40px !important;
    z-index: 5;
    transition: all 0.2s ease-in-out;
}
.slick-prev:before, .slick-next:before {
    content: "" !important;
    position: absolute !important;
    width: 40px !important;
    height: 40px !important;
    background: url(/wp-content/themes/lestudio/img/fleche_slider.svg) !important;
    background-size: contain !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    opacity: 1 !important;
    top: 0 !important;
    left: 0 !important;
}
.slick-prev:hover, .slick-next:hover {
    opacity: 0.8 !important;
}

.slick-prev:before{
    transform: rotate(180deg) !important;
}

.slick-prev {
    left: -5px !important;
}
.slick-next {
    right: -5px !important;
}

.slick-dots {
    display: flex !important;
    justify-content: center;
    gap: 1rem;
    bottom: -50px !important;
}

.slick-custom-dot {
    background: none;
    border: 1px solid white;
    color: white;
    padding: 8px 12px;
    cursor: pointer;
    font-size: 1rem;
    transition: background 0.3s, color 0.3s;
}

#savoir-faire .slick-dots{
    width: 65%;
    left: 35%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0;
}
#savoir-faire .slick-dots li{
    width: auto;
}
#savoir-faire .slick-dots li button{
    display: inline-block;
    width: auto;
    height: auto;
    font-size: 14px;
    background-color: transparent;
    color: white;
    padding: 10px;
    border: 1px solid transparent;
    line-height: 100%;

}
#savoir-faire .slick-dots li button:before{
    display: none;
}
#savoir-faire .slick-dots li.slick-active button{
        border: 1px solid white;
}
.slick-dotted.slick-slider{
    margin-bottom: 80px !important;
}


/*** réalisations ***/
.ligne-etude {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 50px;
    color: white;
}

.ligne-etude h3{
    color: white;
    font-weight: bold;
    line-height: 140%;
    margin-top: 20px;
    margin-bottom: 20px;
}

#etudes .ligne-etude:nth-child(1) {
    background-color: var(--blue1-var);
}
#etudes .ligne-etude:nth-child(2) {
    background-color: var(--blue2-var);
}
#etudes .ligne-etude:nth-child(3) {
    background-color: var(--blue1);
    margin-bottom: 0;
}

#etudes .ligne-etude:nth-child(odd) .col-gauche,
#etudes .ligne-etude:nth-child(even) .col-droite{
    order: 2;
}
#etudes .ligne-etude:nth-child(even) .col-gauche,
#etudes .ligne-etude:nth-child(odd) .col-droite{
    order: 1;
}

.col-gauche,
.col-droite {
    width: 100%;
}

@media (min-width: 768px) {
    .col-gauche,
    .col-droite {
        width: 50%;
    }
}

.col-gauche {
    padding: 50px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.col-gauche p:last-child{
    margin-bottom: 0;
}

.col-droite .image-slide {
    height: 100%;
    background-size: cover;
    background-position: center;
}
.slick-etude.slick-dotted.slick-slider{
    margin-bottom: 0 !important;

}
.slick-etude, .slick-etude .slick-list, .slick-etude .slick-track{
    height: 100% !important;
    border: none !important;
}
#etudes  .slick-dots{
    bottom: 0 !important;
}
.col-gauche > *{
    width: 100%;
}

#etudes .slick-dots li button:before{
    font-size: 15px;
    color: white;
}
#etudes .slick-dots li.slick-active button:before{
    color: white;
}

#equipe{
    padding-bottom: 80px;
}
#equipe .colonnes-equipe .wp-block-column{
    max-width: 300px;
    position: relative;
    z-index: 1;
}
#equipe .wp-block-columns.colonnes-equipe{
    position: relative;
    justify-content: space-around;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

#equipe .wp-block-columns.colonnes-equipe:before{
    position: absolute;
    content: "";
    height: 160px;
    width: 100vw;
    top: 50px;
    left: 50%;
    transform: translateX(-50%);
    background: url(/wp-content/themes/lestudio/img/vagues_2.svg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 0;
}


#header_page{
    padding-top: 100px;
}

.titre-page{
    text-align: center;
    padding: 50px 15px;
    color: white;
    background-color: var(--blue2);
}
article.page{
    padding-top: 50px;
    padding-bottom: 80px;
    box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 1px, rgba(0, 0, 0, 0.07) 0px 2px 2px, rgba(0, 0, 0, 0.07) 0px 4px 4px, rgba(0, 0, 0, 0.07) 0px 8px 8px, rgba(0, 0, 0, 0.07) 0px 16px 16px;
    position: relative;
    z-index: 1;
}

/* ************************ PAGE ERREUR (404) ************************ */


/*** logos partenaires ***/
#bandeau-partenaires h2{
    text-align: center;
    color: var(--blue2);
    font-weight: normal;
}
#main.blog-2 #bandeau-partenaires h2{
    color: var(--green);
}
#partenaires.wrapper_contenu{
    padding: 30px;
}
.slick-partenaires {
    margin: 40px auto;
    max-width: 1600px;
    padding-left: 30px;
    padding-right: 30px;
}
.partenaire-item {
    text-align: center;
    padding: 15px;
}
.partenaire-logo {
    width: 100%;
    height: 100px;
    object-fit: contain;
    object-position: center;
    transition: filter 0.3s ease, transform 0.3s ease;
}
.partenaire-logo:hover {
    transform: scale(1.05);
}

#bandeau-partenaires .slick-prev{
    left: 5px !important;
}
#bandeau-partenaires .slick-next{
    right: 5px !important;
}

#bandeau-partenaires .slick-prev:before, #bandeau-partenaires .slick-next:before,
#bandeau-partenaires .slick-prev, #bandeau-partenaires .slick-next{
    width: 30px !important;
    height:30px !important;
}


/*** sponsoring ***/

.sponsoring-logos{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 15px;
    margin-bottom: 80px !important;
}
.sponsoring-logo-item img{
    width: 180px;
    height: 180px;
    padding: 15px;
    object-fit: contain;
    object-position: center;
}
.sponsoring-logo-item a{
    display: block;
    max-width: 150px;
    line-height: 140%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    background-color: var(--blue2);
    color: white;
    border-radius: 5px;
    padding: 5px;
    text-decoration: none;
    transition: all 0.2s ease-in-out;
}

.sponsoring-logo-item a:hover{
    opacity: 0.8;
}


/* ************************ FOOTER ************************ */
section#contact{
    background-color: rgba(0, 0, 0, 0.2);
    color: white;
    position: relative;
    overflow: hidden;
    padding-bottom: 0px;
}
section#contact .inner_section_contenu{
    min-height: 750px;
}
section#contact > *{
    position: relative;
    z-index: 1;
}
section#contact h2,
#contact .pre-titre{
    color: white;
}
section#contact h2{
    margin-top: 0;
}
section#contact .pre-titre:before{
    background-color: white;
}

section#contact::before {
    content: "";
    position: absolute;
    top: 0;
    left: calc(50vw - 600px);
    aspect-ratio: 1 / 2.75;
    height: 100%;
    background-color: var(--blue1-var);
    clip-path: polygon(100% 100%, 100% 0, 0 100%);
    z-index: 0;
    pointer-events: none;
}
section#contact::after {
    content: "";
    position: absolute;
    top: 0;
    width: 100vw;
    left: calc(50vw - 276px);
    height: 100%;
    background-color: var(--blue1-var);
    z-index: 0;
}

section#contact.blog-2::before, section#contact.blog-2::after {
    background-color: var(--green);
}

.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 textarea {
    width: 100%;
    padding: 10px 15px;
    background-color: white;
    border: none;
    font-size: 14px;
    font-family: 'Montserrat';
}
.wpcf7 input[type="submit"] {
    display: block;
    padding: 10px 15px;
    background: var(--blue1);
    color: white;
    font-weight: bold;
    border: none;
    transition: all 0.2s ease-in-out;
    cursor: pointer;
    font-size: 14px;
    font-family: 'Montserrat';
}
.wpcf7 input[type="submit"]:hover {
    background: var(--blue2);
}


footer{
    position: relative;
    background-color: white;
}

#bandeau_footer{
    position: relative;
    width: 100%;
    max-width: 1600px;
    margin-left: auto;
    margin-right: auto;
    padding: 60px 30px 0px 30px;
}
#contacts-footer {
    margin-left: 0;
    margin-right: auto;
    width: calc(50% - 60px);
}
#logo-footer{
    width: 120px;
    text-align: center;
}
#accreditation-footer{
    padding: 30px 15px;
    width: calc(50% - 60px);
}
#contacts-footer a{
    color: black;
    text-decoration: none;
}
#contacts-footer a:hover{
    text-decoration: underline;
}

.tel-footer{
    margin-top: 15px !important;
    margin-bottom: 5px !important;
}
.email-footer{
    margin-bottom: 15px !important;
    margin-top: 5px !important;
}

#cofrac{
    gap: 15px;
}
#cofrac div{
    font-size: 0.9em;
}  

/* ************************ COPYRIGHT ************************ */
#copyright {
    text-align: center;
    padding: 25px;
    margin-bottom: 50px;
    line-height: 140%;
}
#copyright a{
    color: black;
    text-decoration: none;
}
#copyright a:hover{
    text-decoration: underline;
}
.lestudio {
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 15px;
    box-shadow: inset 0px 0px 15px 5px rgba(0,0,0,0.2);
}
.lestudio img {
    margin: 5px;
}


/*** couleurs HCR 22 ***/
#main.blog-2 .contenu_gutenberg h2,
#main.blog-2 .contenu_gutenberg h3,
.blog-2 #bandeau-navigation.scrolled #tel-header a,
#header_page.blog-2 #bandeau-navigation #tel-header a{
    color: var(--green);
}
.blog-2 #bandeau-navigation.scrolled #reseaux-header svg path,
#header_page.blog-2 #bandeau-navigation #reseaux-header svg path{
    fill: var(--green);
}
.blog-2 #bandeau-navigation.scrolled #tel-header svg path,
#header_page.blog-2 #bandeau-navigation #tel-header svg path{
    stroke: var(--green);
}
.blog-2 #bandeau-navigation.scrolled #reseaux-header svg circle,
#header_page.blog-2 #bandeau-navigation #reseaux-header svg circle{
    stroke: var(--green);
}
.blog-2 .titre-page{
    background-color: var(--green);
}
section#contact.blog-2 .wpcf7 input[type="submit"] {
    background: #222;
}
section#contact.blog-2 .wpcf7 input[type="submit"]:hover {
    background: black;
}
#main.blog-2 #etudes h3{
    color: white;
}
#main.blog-2 #etudes .ligne-etude{
    background-color: var(--green) !important;
}
#main.blog-2 #savoir-faire::after,
#main.blog-2 #savoir-faire::before{
    background-color: var(--green);
}


/*******************************************/
/************** MEDIA QUERIES **************/
/*******************************************/


/* ********** ECRANS EN DESSOUS DE 1400px ***********/
@media only screen and (max-width : 1450px) {
    #menu-menuprincipal li a, #menu-menumobile-1 li a{ font-size: 1.1em; }
    #tel-header a{ font-size: 1.1em;  }
    #menu-menuprincipal li svg, #menu-menumobile-1 li svg{ width: 30px; height: 30px; }
    #reseaux-header svg{ width: 30px; }
    #contacts-header, #logo-header {width: 250px;}
    #nav-header { width: calc(100% - 500px); }
    #menu-menuprincipal, #contacts-header, #menu-menumobile-1{ gap: 20px; }
}

/* ********** ECRANS EN DESSOUS DE 1220px ***********/
@media only screen and (max-width : 1220px) {
    #tel-header span{ display: none; }
    #contacts-header{ width: 100px; }
    #logo-header{ width: 220px }
    #nav-header{ width: calc(100% - 320px); }
    #bloc-sf-header li{ font-size: 1.2em }
    #titre-header h1 { font-size: 2.5em; }

    #savoir-faire{ background-color: var(--blue1-var); padding-top: 50px; }
    #savoir-faire h2, #savoir-faire .pre-titre{ color: white; }
    #savoir-faire:after, #savoir-faire:before{ display: none; }
    .diaporama-slick  .slick-list{border: 0px solid var(--grey4);}
    .diapo-texte{ width: 35%; }
    .diapo-image{ width: 65%; }
    #savoir-faire .slick-dots{ width: 100%; left: 0%;}

    section#contact{ background-color: var(--blue1-var); }
    section#contact:after, section#contact:before{ display: none; }
    section#contact .inner_section_contenu{ min-height: 0px;}

    #presentation .pre-titre,
    #savoir-faire .pre-titre,
    #realisations .pre-titre,
    #contact .pre-titre{
        display: inline-block;
        left: 50%;
        transform: translateX(-50%);
    }
    #savoir-faire .pre-titre:before{ background-color: white; }

}


/* ********** ECRANS EN DESSOUS DE 1023px ********** */
@media only screen and (max-width : 1023px) {
    .menu_ordi{ display: none; }
    .menu_mobile{ display: block; }
    #logo-header, #logo-header_page{ width: calc(100% - 200px); text-align: center; margin-left: 100px;}
    #nav-header{ width: 0; }
    #wrapper-contenu-header:before,
    #contenu-header::before,
    #contenu-header::after,
    section#experience::before,
    section#realisations::before,
    section#equipe::before {
        display: none;
    }
    #bandeau-bas-header{ flex-direction: column; gap: 50px; }
    #titre-header{ margin-top: 100px !important; min-height: 0 !important }
    #contenu-header{ padding: 120px 15px; }
    #bloc-site-annexe{ display: none; }
    #titre-header h1 { font-size: 2em; }
    #bloc-sf-header li{ font-size: 1.1em; line-height: 150% }
    #btn-scroll-down{ bottom: 70px; }

    #wrapper-contenu-header{ margin-top: 70px; }
    #titre-header{ margin-top: 0 !important; }
    #inner-bandeau-navigation{ min-height: 70px; padding: 0 15px; }

    #header_accueil #contenu-header, #header_accueil_hydro #contenu-header{ min-height: calc(100vh - 70px) !important; display: flex; flex-direction: column; align-items: center; justify-content: center; }

    /*** menu mobile actif ***/
    #bandeau-navigation{
        background-color: white;
        box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 1px, rgba(0, 0, 0, 0.07) 0px 2px 2px, rgba(0, 0, 0, 0.07) 0px 4px 4px, rgba(0, 0, 0, 0.07) 0px 8px 8px, rgba(0, 0, 0, 0.07) 0px 16px 16px;
    }
    #bandeau-navigation #menu-menuprincipal li a{
        color: black;
    }
    #bandeau-navigation #tel-header a{
        color: var(--blue2);
    }
    #bandeau-navigation  #tel-header svg path{
        stroke: var(--blue2);
    }
    #bandeau-navigation #reseaux-header svg circle{
        stroke: var(--blue2);
    }
    #bandeau-navigation #reseaux-header svg  path{
        fill: var(--blue2);
    }
    #bandeau-navigation #menu-menuprincipal li a:after{
        background-color: black;
    }

}

/* ********** ECRANS EN DESSOUS DE 900px ********** */
@media only screen and (max-width : 900px) {
    .colonnes-experience.wp-block-columns{ flex-wrap: wrap!important;}
    .colonnes-experience.wp-block-columns .wp-block-column { flex-basis: 100%!important; }
}


/* ********** ECRANS EN DESSOUS DE 767px********** */
@media only screen and (max-width : 767px) {
    body { font-size: 0.9em; }
    .diapo-image { width: 100%; height: 50vw;}
    .diapo-texte{ width: 100%; padding: 30px; min-height: 300px; }
    .diapo .flex{ flex-wrap: wrap; }
    #savoir-faire .slick-dots{ display: none !important; }
    .col-droite{ order: 1 !important }
    .col-gauche{ order: 2 !important; padding: 30px; }
    .col-droite .image-slide{ min-height: 60vw; }
    #bandeau_footer{ flex-wrap: wrap; }
    #contacts-footer, #logo-footer, #accreditation-footer{ width: 100%; }
    #contacts-footer{ order: 2 }
    #logo-footer{ order: 1; margin-bottom: 30px; }
    #accreditation-footer{ order: 3 }
    #cofrac{ justify-content: center; }

}

/* ********** ECRANS EN DESSOUS DE 600px********** */
@media only screen and (max-width : 600px) {
    #contacts-header{ gap: 10px; width: 80px;}
    #logo-header{ width: calc(100% - 160px); margin-left: 80px;}
    #logo-header img{ width: 150px; max-width: 100%; }
    .section_contenu{ padding-top: 60px; }
}

/* ********** ECRANS EN DESSOUS DE 480px ********** */
@media only screen and (max-width: 480px) {

}

/*** SLICK ***/
/* Slider */
.slick-slider{ position: relative; display: block; box-sizing: border-box; -webkit-user-select: none;  -moz-user-select: none;  -ms-user-select: none;  user-select: none;  -webkit-touch-callout: none;  -khtml-user-select: none; -ms-touch-action: pan-y;  touch-action: pan-y; -webkit-tap-highlight-color: transparent;}

.slick-list{  position: relative;  display: block;  overflow: hidden; margin: 0; padding: 0;}
.slick-list:focus{ outline: none;}
.slick-list.dragging{ cursor: pointer; cursor: hand;}

.slick-slider .slick-track,
.slick-slider .slick-list{ -webkit-transform: translate3d(0, 0, 0);  -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0);  transform: translate3d(0, 0, 0);}

.slick-track{ position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto;}
.slick-track:before,
.slick-track:after{ display: table;  content: '';}
.slick-track:after{ clear: both;}
.slick-loading .slick-track{ visibility: hidden;}

.slick-slide{ display: none; float: left; height: 100%; min-height: 1px;}
[dir='rtl'] .slick-slide{ float: right;}
.slick-slide img{ display: block;}
.slick-slide.slick-loading img{ display: none;}
.slick-slide.dragging img{  pointer-events: none;}
.slick-initialized .slick-slide{ display: block;}
.slick-loading .slick-slide{ visibility: hidden;}
.slick-vertical .slick-slide{ display: block;height: auto;  border: 1px solid transparent;}
.slick-arrow.slick-hidden { display: none;}

/* Slider */
.slick-loading .slick-list{ background: #fff url('/wp-content/themes/lestudio/img/ajax-loader.gif') center center no-repeat;}

/* Icons */
@font-face{ font-family: 'slick'; font-weight: normal; font-style: normal;src: url('/wp-content/themes/lestudio/fonts/slick.eot'); src: url('/wp-content/themes/lestudio/fonts/slick.eot?#iefix') format('embedded-opentype'), url('/wp-content/themes/lestudio/fonts/slick.woff') format('woff'), url('/wp-content/themes/lestudio/fonts/slick.ttf') format('truetype'), url('/wp-content/themes/lestudio/fonts/slick.svg#slick') format('svg');}
/* Arrows */
.slick-prev,
.slick-next{ font-size: 0; line-height: 0; position: absolute; top: 50%; display: block; width: 20px; height: 20px; padding: 0;  -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%);  cursor: pointer; color: transparent;  border: none; outline: none; background: transparent;}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus{ color: transparent; outline: none; background: transparent;}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before{ opacity: 1;}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before{ opacity: .25;}

.slick-prev:before,
.slick-next:before{ font-family: 'slick'; font-size: 20px; line-height: 1; opacity: .75; color: white; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}

.slick-prev{ left: -40px;}
[dir='rtl'] .slick-prev{ right: -40px; left: auto;}
.slick-prev:before{  content: '←';}
[dir='rtl'] .slick-prev:before{ content: '→';}
.slick-next{ right: -40px;}
[dir='rtl'] .slick-next{ right: auto; left: -40px;}
.slick-next:before{ content: '→';}
[dir='rtl'] .slick-next:before{ content: '←';}

/* Dots */
.slick-dotted.slick-slider{ margin-bottom: 30px;}
.slick-dots{ position: absolute; bottom: -25px; display: block;  width: 100%; padding: 0; margin: 0; list-style: none; text-align: center;}
.slick-dots li{ position: relative; display: inline-block; width: 20px; height: 20px; margin: 0 5px; padding: 0; cursor: pointer;}
.slick-dots li button{ font-size: 0; line-height: 0; display: block; width: 20px; height: 20px; padding: 5px; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent;}
.slick-dots li button:hover,
.slick-dots li button:focus{outline: none;}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before{opacity: 1;}
.slick-dots li button:before { font-family: 'slick';font-size: 6px; line-height: 20px; position: absolute; top: 0; left: 0; width: 20px; height: 20px; content: '•'; text-align: center; opacity: .25; color: black; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
.slick-dots li.slick-active button:before{opacity: .75;color: black;}