@import url('fonts/stylesheet.css');

:root {
    --black: #000;
    --white: #fff;
    --primary: #b89a8d;
    --second: #8c756c;
    --tertiary: #998076;
    --quaduary: #b89a8d;
    --back:#fff;
    --gris: #d8d8d8;
}


.fixed-rdv-button {
  position: fixed;
  left: 15px;
  bottom: 15px;
  z-index: 9999;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 14px 22px;
  border-radius: 999px;

  background: var(--primary);
  color: #fff;
  text-decoration: none;

  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.2px;

  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.18);
  transition: all 0.25s ease;
}

.fixed-rdv-button:hover {
  transform: translateY(-3px);
  background: var(--second);
  color: #fff;
  box-shadow: 0 14px 38px rgba(0, 0, 0, 0.25);
}

.fixed-rdv-button:active {
  transform: translateY(-1px);
}

.fixed-rdv-button span {
  font-size: 16px;
  display: inline-block; margin-right: 3px;
  line-height: 1;
}

@media (max-width: 768px) {

  .fixed-rdv-button {
    right: 15px;
    bottom: 15px;
    padding: 13px 18px;
    font-size: 14px;
  }

  .fixed-rdv-button span {
    font-size: 15px;
  }
}

body {
    padding: 0px;
    margin: 0px;
    font-family: 'Trade Gothic LT Std';
    font-optical-sizing: auto;
    font-weight: normal;
    font-style: normal;
    font-weight: normal;
    overflow-x: hidden;
    background: var(--back);
    color:#182a1c;

}

body.kalygrafink{background: #e2e1e1;}
body.kalyderma{background: #fceff1;}

ul {
    padding: 0px;
    margin: 0px;
}

a {
    text-decoration: none !important
}

.header {
    width: 100%;
    position: relative;
    margin: 0;
    margin: 0 auto;
}

.header .d-flex {
    overflow: hidden;
    max-height: 600px;
}

.top {
    padding: 14px 15px;
    margin: 0 auto 15px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    background: var(--second);
}

.top span {
    font-size: 17px;
    font-weight: 300;
}

.top>div {
    margin: 0;
    font-size: 17px;
}

.banner {
    position: relative;
    z-index: 0;
}

.banner {

    width: 100%;

    max-height: 600px;

    overflow: hidden;
}
/*.banner>div{
     animation: zoom 8s ease infinite alternate;
     background: url(../images/banner2.jpg) no-repeat;
     background-size: cover;
     transform: scale(1.1);
     background-position: bottom;
     height: 100%;
     }*/


     .banner img {
        width: 100%; height: 100%; object-fit: cover;
    }

    .logo {
        padding: 0px 20px;
        z-index: 2;
        display: flex;
        justify-content: center;
        align-items: center;
        position: absolute;
        width: 100%;
        height: 100%;
    }

    .logo>div {
        width: 1000px;
        max-width: 100%;
        display: flex; justify-content: space-between;
        flex-wrap: wrap;
        position: relative;
    }

    .logo img {
        width: 380px;
        position: relative;
        z-index: 1;
        max-width: 100%;
    }

    /* end header */


    /* menu */

    .navbar-nav .nav-item {
        display: block;
        transition: 0.5s ease all;
        padding: 0;
        margin: 0;
        position: relative;
    }
    .navbar-nav .nav-item.btn-devis{
        padding: 0px 25px;
    }
    .navbar-nav .nav-item.btn-devis:after{
        content:"";
        background: url(../images/btn.png);
        padding: 0px 20px;
        background-size: 100% 100%;
        position: absolute;
        width: 100%;
        height: calc(100% + 10px);
        right: 0;
        top: -5px;
    }


    .dropdown-item {
        transition: 0.5s ease all;
        color: #fff;
        padding: 10px 20px;
        font-size: 15px;
    }

    .dropdown-item:hover {
        background: var(--primary);
        color: #fff;
    }

    .navbar-nav .nav-item.dropdown:hover>.dropdown-menu {
        display: block;
    }

    .dropdown-menu {
        left: 0;
        min-width: 100%;
        top: 100%;
        background: var(--second);
        border: 0;
        border-radius: 0;
        margin: 0;
        padding: 0;
    }

    .page .navbar-nav .nav-item:last-child {
        margin: 0
    }

    .navbar .navbar-nav .nav-item .nav-link {
        padding: 15px 40px;
        white-space: nowrap;
        transition: 0.3s ease all;
        font-size: 18px;
        text-align: left;
        color: var(--white);
        position: relative;
        z-index: 1;
        font-weight: 500;
    }


    .navbar .navbar-nav .nav-item:first-child {
        background: none;
    }


    .navbar .navbar-nav .nav-item .nav-link:hover {
        background: var(--tertiary);
        color: #fff;
    }


    .bloc-menu {
        display: none;
        margin-right: 15px;
        position: relative;
        left: 45px;
        cursor: pointer;
        z-index: 10;
        transition: 0.3s ease all;
    }

    .btn-menu {
        display: table;
        margin: 0 auto;
        position: relative;
        transition: 0.3s ease all;
    }

    .btn-menu:hover {
        transform: rotate(180deg);
    }

    .menubox {
        transition: 0.3s ease all;
        width: 100%;
        z-index: 20;
        position: relative;
        max-width: 1200px;
        margin: -20px auto 0px;
        background: var(--quaduary);
        padding: 0;
        border-radius: 29px;
    }
    .menubox.fixed {
        top: 0;
        z-index: 20;
        border-radius: 0px;
        position: fixed;
        max-width: 100%;
        width: 100%;
        margin: 0 auto;
        left: 0;
    }
    .menubox.activemenu {
        transform: none;
    }



    .inner-menubox {
        transition: 0.3s ease all;
        position: relative;
    }


    .navbar {
        padding: 0;
        position: relative;
        z-index: 1;
    }

    .navbar-nav {
        margin: 0px !important;
        padding: 12px 15px;
        z-index: 9;
        width: 100%;
        flex-wrap: wrap;
    }

    .navbar-nav:last-child {
        padding: 0;
        justify-content: center;
    }
    .fixed  .navbar-nav:last-child{

        justify-content: center;
    }


    /****** end menu ***/
    .s-style .titre1{font-size: 80px; margin-bottom: 30px;}
    .s-style .titre1 small{display: block; font-size: 32px;}
    .s-style .titre1:after{content: ''; display: block; width: 30px; height: 30px; margin-top: 5px; background: url(../images/ornement.png) no-repeat center/cover;}
    .s-style .titre1.text-center:after,.s-style .text-center .titre1:after{margin: 5px auto 0px;}
    .s-style{padding: 60px 15px;}
    .s-style .container{width: 1440px; max-width: 100%;}

#section-home .titre1{font-size: 50px;}

    .section-kaly:before{content: ''; display: block; width: 100%; height: 170px; position: absolute; top: 0; left: 0; z-index: 3; background: #fff;}
    .section-kaly>div{position: relative; z-index: 4;}
    .section-kaly .logo-box{display: block; margin: 0px auto 40px; width: 220px; max-width: 100%;}
    .section-kaly .banner-img{display: block; margin: 20px auto; width: 1000px; max-width: 100%;}
    .section-kaly .container{width: 1000px;}
    .section-kaly .caption-txt{background: #fff; padding: 30px; text-align: center; border-radius: 20px;}
    .section-kaly .caption-txt p{font-size: 15px;}
    .section-kaly .caption-txt p:last-child{margin-bottom: 0px;}

    #section-kalygrafink{background: url(../images/fougere.png) no-repeat bottom left/auto #efefef; position: relative; padding-top: 0px;}
    #section-kalyderma{background: #fceff1; position: relative; padding-top: 0px;}

    .section-prestation .flex-prestation{display: flex; justify-content: space-around; align-items: flex-start; flex-wrap: wrap; width: 1200px; max-width: 100%; margin: 0px auto;}
    .section-prestation .flex-prestation .box-prestation{display: block; width: 380px; max-width: 100%; margin:30px 10px;}
    .section-prestation .flex-prestation .box-prestation .img-prestation{overflow: hidden; border: 5px solid #e2e1e1; display: flex; justify-content: center; align-items: center; width: 100%; height: 400px;}
    .section-prestation .flex-prestation .box-prestation .img-prestation img{width: 100%; max-width: 100%; transition: all 0.4s; object-fit: cover; height: 100%;}
    .section-prestation .flex-prestation .box-prestation .caption-prestation{transition: all 0.4s; padding: 15px 15px; background: #e2e1e1; color: #1b1b1b; text-align: center;}
    .section-prestation .flex-prestation .box-prestation .caption-prestation h3{font-size: 32px; transition: all 0.4s; margin-bottom: 0px;}
    .section-prestation .flex-prestation .box-prestation .caption-prestation h3 small{display: block; font-size: 25px;}
    .section-prestation .flex-prestation .box-prestation .caption-prestation p{font-size: 14px;}
    .section-prestation .flex-prestation .box-prestation a:hover .caption-prestation{background: #b8b8b8 ; color: #fff;}
    .section-prestation .flex-prestation .box-prestation a:hover .caption-prestation h3{color: #fff;}
    .section-prestation .flex-prestation .box-prestation a:hover img{transform: scale(1.1);}

    #prestation-kalygrafink{background: url(../images/bg-rub.jpg) no-repeat center/cover;}
    #prestation-kalyderma{background: #fceff1; padding-top: 0px;}
    #prestation-kalyderma.section-prestation .flex-prestation{width: 1400px;}
    #prestation-kalyderma.section-prestation .flex-prestation .box-prestation{width: 360px;}
    #prestation-kalyderma.section-prestation .flex-prestation .box-prestation .caption-prestation{background: #f9e4e7;}
    #prestation-kalyderma.section-prestation .flex-prestation .box-prestation a:hover .caption-prestation{background: #f1c7cd; color: #fff;}
    #prestation-kalyderma.section-prestation .flex-prestation .box-prestation .img-prestation{border-color: #f9e4e7;}
    #prestation-kalyderma.section-prestation .flex-prestation .box-prestation .img-prestation{height: 350px;}

    .s-style p.citation{margin: 60px auto 20px; font-size: 22px; text-align: center; display: block; width: 750px; max-width: 100%; font-style: italic; font-weight: bold;}
    .s-style p.citation:before,p.citation:after{width: 40px; height: 80px; color: var(--primary); display: flex; justify-content: center; align-items: center; font-size: 150px; line-height: 0px; font-weight: 300;}
    .s-style p.citation:before{content: '”'; font-family: "Rouge Script", cursive; margin-bottom: -65px; margin-left: -40px;}
    .s-style p.citation:after{content: '“'; font-family: "Rouge Script", cursive; margin-left: auto; margin-top: 15px;}

    .flex-rs{display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
    .flex-rs a{display: inline-block; margin: 10px; transition: all 0.4s;}
    .flex-rs a:hover{opacity: 0.4;}

    #section-contact{position: relative; padding: 150px 15px;}
    #section-contact>div{position: relative; z-index: 5;}
    #section-contact:before{content: ''; background: url(../images/fougere2.png) no-repeat bottom right/contain #fff; display: block; width: 100%; height: 95%; position: absolute; bottom: 0; left: 0; z-index: 3;}
    
    #section-img1{background: #e2e0e1;}

    .flex-block-2 {
        max-width: 1080px;
        padding: 0px;
        border-radius: 30px;
    }
    .flex-block-2:after {content:""}
    .flex-block-2:before {content:"";width: 100%;position: absolute;height:565px;top: 40px;background: var(--second);border-radius: 45px;}
    .block-cuvee{
        display: table;
        margin: 0 auto;
    }

    .title-depuis{

        margin: 0;

        background: url(../images/border.png) no-repeat;

        background-position: left;

        padding: 30px 100px;

        padding-right: 0;
    }

    .title-depuis span{
        display: block;
        font-size: 46px;
        font-weight: 600;
    }
    .title-depuis b{
        font-size: 130px;
        font-weight: 800;
        display: block;
        line-height: 100px;
    }
    .flex-block-2 img {
        max-width: 100%
    }


    .flex-block-2 h2 {
        font-weight: 400;
        display: table;
        color: #fff;
        font-family: 'Mixta Sharp';
        font-size: 35px;
        padding: 60px 40px 25px;
        border-bottom: 5px solid #fff;
        padding-right: 0;
        letter-spacing: 1px;
        margin-bottom: 40px;
        margin-top: 40px;
    }

    .flex-block-2 h2 b {
        display: block;
        font-size: 34px;
        font-weight: 700;
    }

    .flex-block-2 h2 span {
        font-size: 22px;
        font-weight: 600;
    }
    .flex-block-2 h2 span:last-child{font-size: 18px;}
    .flex-block-2 h2.title-color-primary b {
        color: var(--primary);
        display: inline-block;
        font-size: 38px;
        font-weight: 600;
    }

    .flex-block-2 .flex-block_text_inner{
        padding-left: 60px;
        color: #fff;
    }
    .flex-block-2 .flex-block_text_inner h3{
        font-family: 'Mixta Sharp';
        font-weight: 400;
        color: var(--primary);
        letter-spacing: 2px;
        font-size: 38px;
    }
    .flex-block-2 .flex-block_text_inner h3 + span{
        color: var(--primary);
        font-family: 'Mixta Sharp';
        letter-spacing: 1px;
        font-size: 17px;
        font-weight: 400;
    }
    .flex-block-2 .flex-block_text_inner img{
        margin-bottom:40px
    }
    .flex-block-2 h2.title-color-primary span {
        font-size: 28px;
        color: var(--primary);
        padding-left: 5px;
    }

    .flex-block-2 p {
        font-size: 16.5px;
        margin: 20px 0px 20px;
        font-weight: 300;
        color: #ffff;
        max-width: 470px;
    }

    .flex-block-2 p:first-of-type{
        color: #fff;
    }

    .flex-block-2 .link-suite{
        color: #fff;
        border-bottom: 1px solid #fff;
        display: table;
        font-weight: 100;
        font-size: 17px;
        transition: 0.3s ease all;
    }
    .flex-block-2 .link-suite:hover{
        color:var(--primary)
    }
    .color-black {
        color: #000 !important
    }

    .flex-block-2 .col-12:last-child {
        position: relative;
    }


    .flex-block-3{
        max-width: 1200px;
        margin: 0 auto 200px;
    }
    .flex-block-3 .col-12{padding:0px}
    .flex-block-3 .col-12 .flex-block_text{
        height: 100%;
        border: 9px solid #656770;
        position: relative;
        top: 50px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .flex-block-3 .col-12 .flex-block_text a{
        color: #fff;
        text-align: center;
        display: block;
        font-size: 20px;
        transition: 0.3s ease all;
        padding: 20px;
    }
    .flex-block-3 .col-12 .flex-block_text a:hover{
        background:var(--primary);
        padding: 20px 40px;
    }
    .flex-block-3 .col-12 .flex-block_text a span{
        display: block;
        font-size: 37px;
        font-weight: 600;
    }
    .banner-header{
        width: 100%;
        height: 450px;
    }

    /****** back bloc***/


    .block-text {
        width: 100%;
        max-width: 960px;
        margin: 100px auto 100px;
        padding: 0px 20px;
    }

    .block-text p{
        max-width: 750px;
        margin: 50px auto 0px;
        text-align: justify;
        font-size: 18px;
    }

    .block-text h2 {
        text-align: center;
        font-size: 30px;
        font-weight: 400;
        margin-bottom: 0;
        color: var(--second);
        font-family: 'Mixta Sharp';
    }

    .block-text h2:before{
        content:"";
        width: 100px;
        height: 4px;
        display: block;
        margin: 0 auto 40px;
    }

    .block-text h2.title-news:before{
        width: 37px;
        height: 61px;
        margin: 0;
        position: absolute;
        right: -35px;
        top: -70px;
        z-index: 9;
    }
    .block-text h2.title-news{
        position: relative;
        display: table;
        margin: 40px auto 0px;
    }
    .block-text h2.title-news + p{
        max-width: 100%;
        margin-bottom: 40px;
    }
    .block-text .d-flex{
        justify-content: center;
    }
    .block-text .d-flex a{
        padding:0px 15px;
        transition:0.3s ease all;
    }
    .block-text .d-flex a:hover{
        transform:scale(1.1)
    }
    .top a:first-child {
    }

    .top a {
        font-size: 20px;
        margin: 0;
        transition: 0.3s ease all;
        background: none;
        color: #ffff;
        padding: 0;
        margin-right: 0;
        position: relative;
        z-index: 1;
        font-weight: 700;
        margin-left: 20px;
    }

    .top a:hover {}


    /****** text images ***/

    .flex-block {
        position: relative;
        transition: 0.5s ease all;
        background-size: cover;
        margin-left: auto;
        margin-right: auto;
    }

    .flex-block-1 {
        max-width: 1200px;
        margin: 50px auto 100px;
        padding: 40px 15px 00px;
        background-size: cover;
    }

    .flex-block-1>h1 {
        margin: 0 0px 40px;
        background: url(../images/forme.png) no-repeat;
        background-size: contain;
        padding: 62px 15px 34px;
        padding-right: 115px;
        position: relative;
        display: table;
        background-position: right 40%;
        width: 100%;
        max-width: 100%;
        color: var(--second);
    }

    .flex-block-1>h1 span {
        display: block;
        padding: 0;
        position: relative;
        z-index: 1;
    }
    .flex-block-1>h1  b{
        font-size: 58px;
        display: block;
        font-weight: 400;
    }

    .flex-block-1>h1 span:first-child {
        font-size: 30px;
        text-transform: none;
        font-weight: 300;
        margin-bottom: 5px;
    }
    .flex-block-1>h1 span:last-child{
        font-size: 32px;
        display: table;
        font-weight: 400;
    }
    .flex-block-1>div {
    }

    .flex-block-1>div img {
        max-width: 100%
    }

    .flex-block-1 p {
        font-size: 17px;
        margin: 0;
        margin-bottom: 15px;
        font-weight: 300;
        padding: 0;
        background-repeat: no-repeat;
        position: relative;
        text-align: justify;
    }

    .page .flex-block-1 p {
        display: none;
    }

    .flex-block-1 .flex-block_text {
        margin: 0 auto;
        position: relative;
    }

    .flex-block-1 .flex-block_text>div {}

    .page .flex-block-1 .flex-block_text:after {
        display: none
    }

    .back2 {
        position: relative;
        z-index: 2;
        padding: 0;
    }



    .flex-block>div {
        display: flex;
        margin: 0 auto;
        flex-wrap: wrap;
        padding: 0;
        position: relative;
        z-index: 2;
    }






    .rubrique>div {
        width: 100%;
        margin: 0 auto;
        max-width: 1200px;
    }


    .flex-rubrique .d-flex {
        justify-content: space-between;
        flex-wrap: wrap;
    }

/*.rubrique>div .col-12 {
    width: calc(100% / 5);
    max-width: calc(100% / 5);
    flex: calc(100% / 5);
    margin: 0 auto 20px;
    padding: 0;
    }*/

    .rubrique>div .col-12>div {
        padding: 0px 10px;
        color: #fff;
        position: relative;
    }

    .rubrique>div .col-12:hover .img img {transform: translateY(-20px);}

    .rubrique {
        position: relative;
        z-index: 1;
        max-width: 1440px;
        margin: 0 auto;
        background-position: top;
        background: url('../images/bg-rub.jpg');
        padding: 140px 0px;
    }
/*.rubrique:after{content:"";position: absolute;width: 100%;height: 100px;background: var(--white);top: -50px;left: 0;transform: skewY(-3deg);}
.rubrique:before{content:"";position: absolute;width: 100%;height: 100px;background: var(--white);bottom: -50px;left: 0;transform: skewY(-3deg);}*/

.rubrique>h2{
    text-align: center;
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 80px;
}

.link-rubrique {
    position: absolute;
    width: calc(100% - 30px);
    height: 100%;
    left: 15px;
    top: 0;
    cursor: pointer;
}

.rubrique>div .col-12:hover .img:after {
    border-width: 0 0 0px 0px;
}

.rubrique>div .col-12:hover .img:before {
    width: 100%;
}

.rubrique>div .col-12:hover .img:after {
    width: 100%;
}

.rubrique>div .col-12:hover h2 {
    background:var(--second);
}

/*.rubrique>div p {
    font-size: 16px;
    margin: 0 auto;
    color: #000;
    padding: 0px 20px;
    line-height: 21px;
    min-height: 245px;
    }*/

    .rubrique>div a.d-table {
        margin-left: 20px;
        margin-top: 20px;
        transition: 0.3s ease all;
    }

    .rubrique>div a.d-table img {
        transition: 0.3s ease all;
    }

    .rubrique>div .col-12:hover a.d-table img {
        transform: rotate(90deg);
    }

    .rubrique>div h2 {
        font-size: 30px /*21px*/;
        text-shadow: none;
        transition: 0.3s ease all;
        letter-spacing: 0;
        display: block;
        position: relative;
        z-index: 3;
        color: #fff;
        top: 0;
        margin: -30px auto 20px;
        padding: 0px 20px;
        text-align: center;
        font-weight: 600;
    }

    .rubrique>div h2 b {
    }

    .rubrique img {
        display: block;
        margin: 0 auto;
        max-width: 100%;
    }

    .rubrique .img img {
        transition: 0.3s cubic-bezier(0, 0.8, 1, 1) all;
        position: relative;
        z-index: 1;
    }

    .rubrique .img {
        position: relative;
        overflow: hidden;
        padding: 30px 0px 20px;
        background-repeat: no-repeat;
        background-position: 0px 0px , 100% 100%;
        background-size: contain;
        display: table;
        margin: 0 auto;
        text-align: center;
    }

    .rubrique .img a {
        display: block;
        overflow: hidden;
        position: relative;
        z-index: 3;
        clear: both;
    }



    /****** page interne ***/


    .text {
        max-width: 1400px;
        margin: 50px auto;
        padding: 0px 15px;
        position: relative;
        z-index: 2;
    }

    .textdiv {
        margin: 30px auto 30px;
        padding: 10px 15px;
        line-height: 33px;
        font-size: 17px;
        text-align: justify;
        position: relative;
        z-index: 1;
        font-weight: 300;
    }






    /****** end page interne ***/
/* DEBUT AVANT APRES  */

 .before-after-cover {
  position: relative;
  width: 100%;
  max-width: 700px;
  margin: 30px auto;
  overflow: hidden;
  border-radius: 18px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.18);
}

.ba-img {
  display: block;
  width: 100%;
  height: auto;
  user-select: none;
  pointer-events: none;
}

.ba-before-img {
  position: relative;
  z-index: 1;
}

.ba-after-img {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  object-fit: cover;

  /* Affiche 50% de l'image après au départ */
  clip-path: inset(0 50% 0 0);
}

.ba-slider-line {
  position: absolute;
  top: 0;
  left: 50%;
  width: 3px;
  height: 100%;
  background: #fff;
  z-index: 3;
  transform: translateX(-50%);
  box-shadow: 0 0 8px rgba(0,0,0,0.4);
}

.ba-slider-line::before {
  content: "\2194";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 46px;
  height: 46px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: #fff;
  color: #111;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: bold;
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}

.ba-range {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: ew-resize;
  z-index: 4;
}

.ba-label {
  position: absolute;
  top: 15px;
  z-index: 5;
  padding: 6px 12px;
  border-radius: 30px;
  background: rgba(0,0,0,0.65);
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  pointer-events: none;
}

.ba-label-before {
  left: 15px;
}

.ba-label-after {
  right: 15px;
}
/* FIN AVANT APRES  */

/* DÉBUT SLIDE STYLE */
.axo-slide-style .slick-prev, .axo-slide-style .slick-next{position: absolute; transition: all 0.4s; top: 50%; z-index: 99; background: var(--primary); width: 40px; height: 40px; display: flex; justify-content: center; align-items: center;}
.axo-slide-style .slick-prev:hover,.axo-slide-style .slick-next:focus,.axo-slide-style .slick-prev:focus, .axo-slide-style .slick-next:hover{background: #000;}
.axo-slide-style .slick-prev{left: 0px;}
.axo-slide-style .slick-next{right: 0px;}
.axo-slide-style .slick-dots{bottom: 0px; left: 0px; padding: 0px 10px !important;}
.axo-slide-style .slick-dots li{padding: 0px; margin: 0px;}
.axo-slide-style .slick-dots li button{display: flex; justify-content: center; align-items: center; padding: 0px;}
.axo-slide-style .slick-prev:before{font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f053" !important;}
.axo-slide-style .slick-next:before{font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f054" !important;}
.axo-slide-style .slick-dots li button:before{left: 50%; top: 50%; transform: translate(-50%,-50%);}
.axo-slide-style .slick-dots li button:before{background: #fff; border: 1px solid var(--primary); content: '' !important; display: block; width: 14px !important; height: 14px !important; border-radius: 15px; opacity: 1 !important;}
.axo-slide-style .slick-dots li.slick-active button:before{background: var(--primary);}
.axo-slide-style a{outline: none; text-decoration: none;}
/* END DÉBUT SLIDE STYLE */

    .logo_items:first-child {
        justify-content: center;
    }

    .logo_items {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        background: #fff;
        max-width: 970px;
        margin: 0 auto;
        border-radius: 46px;
        padding: 15px;
    }

    .logo_items img {
        margin: 0px 40px;
    }

    /****** Contact ***/


    .flex-btn{
        max-width: 970px;
        margin: 0 auto 130px;
        display: flex;
        justify-content: flex-end;
    }

    .btn-tarif {
        display: table;
        margin: 0;
        background: #7f8291;
        padding: 20px 36px;
        width: 100%;
        background-size: 100% 100%;
        text-align: center;
        color: #fff;
        transition: 0.3s ease all;
        max-width: 340px;
    }

    .btn-tarif b {
        display: block;
        font-size: 26px;
        line-height: 29px;
    }

    .btn-tarif span {
        font-size: 17px;
        font-weight: 600;
    }

    .btn-tarif:hover {
        max-width: 500px;
        background: var(--primary);
        color: #fff;
    }

    .fluid-contact {
        position: relative;
        max-width: 1440px;
        margin: 0px auto 0px;
        padding: 50px 10px 0px;
        padding-right: 0;
    }
    .img-bottom{
        background: url(../images/footer.jpg) no-repeat;
        background-size: cover;
        max-width: 1440px;
        margin: 30px auto 0px;
        padding: 40px 0px;
        background-position: 0px 100%;
    }

    .contact {
        font-size: 17px;
        background-repeat: no-repeat;
        width: 100%;
        position: relative;
        z-index: 1;
    }

    .contact .phone {
        color: var(--second);
        font-size: 20px;
        padding: 0px 21px;
        font-weight: 300;
        letter-spacing: 1px;
    }

    .contact .phone:first-child {
    }

    .adresse-block {
        margin: 0;
        padding: 0;
        color: #000;
        font-size: 16px;
        display: flex;
        justify-content: space-between;
        font-weight: 500;
        background-repeat: no-repeat;
        background-position: 22% 10px, 70% 10px;
    }
    .adresse-block a img{
        max-width:300px;
    }

    .adresse-block>div:last-child a {
    }



    .adresse-block .btn-contact {
        font-weight: 300;
        font-size: 17px;
        margin-left: 0;
        color: var(--second);
        padding: 3px 0px;
        border-radius: 0;
        transition: 0.3s ease all;
        border-bottom: 1px solid var(--second);
        margin-top: 0;
        display: table;
    }

    .adresse-block .btn-contact span {
    }

    .adresse-block .btn-contact:hover {
        background: none;
        color: #fff;
        background: var(--primary);
        padding: 3px 15px;
    }

    .adresse-block .btn-contact:after {
        display: none
    }

    .adresse-block p {
        font-size: 17px;
        color: var(--second);
        margin: 0;
        font-weight: 300;
    }
    .adresse-block p.text-gris{
        color: #9fa3b7;
        font-size: 16px;
        text-align: right;
    }
    .adresse-block p.text-gris a{
        color: #9fa3b7;
        font-weight: 600;
        margin-left: 5px;
    }
    .adresse-block p.text-white{
        font-size: 20px;
        margin-top: 15px;
    }
    .adresse-block p.text-white a{color:#fff;margin-left: 5px;font-weight: 600;font-size: 25px;}
    /****** end Contact ***/


    /****** footer ***/

    .boxfooter {
        padding: 20px 0px;
        z-index: 1;
        position: relative;
        max-width: 1440px;
        margin: 0 auto;
        background-size: cover;
    }
    .footer-ico{
        max-width: 150px !important;
        filter: brightness(0) saturate(100%) invert(29%) sepia(7%) saturate(1026%) hue-rotate(81deg) brightness(96%) contrast(84%);
    }

    .footerlink {
        color: #d0d0d0;
        font-size: 10px;
        text-align: right;
    }

    .footerlink ul {
        list-style: none;
        margin: 0px;
        padding: 0px;
        display: inline-block;
    }

    .footerlink ul li {
        display: inline-block;
    }

    .footerlink ul li a {
        text-decoration: none !important;
        transition: 0.3s ease all;
        color: #182a1c;
        padding: 0px 10px;
        font-size: 12px;
    }

    .footerlink ul li a:hover {
        color: var(--primary);
    }

    .inlineblock {
        display: inline-block;
    }

    .footerlink ul {
        padding: 0px;
        margin: 0px;
        list-style: none;
        background: none;
    }

    .boxfooter>div {
        width: 100%;
        align-items: center;
        margin: 0;
        position: relative;
        z-index: 1;
    }


    /****** footer ***/




    @media (max-width: 1280px) {
        .s-style .titre1{font-size: 60px;}
        .s-style .titre1 small{display: block; font-size: 30px;}
        .navbar .navbar-nav .nav-item .nav-link {
            text-align: center;
            padding: 13px 20px;
        }

        .navbar-nav:after {
            height: 100%;
        }
        .adresse-block a img{
            max-width: 200px;
        }
        .fluid-contact{
            margin: 0px auto 20px;
        }
    }

    @media (min-width:991px) {
        .navbar-expand-lg .navbar-collapse {
            display: block !important;
        }

        .page .logo img {
            max-width: 100%;
        }

        .page .header .banner {
            height: 500px;
        }

    }




    @media (max-width: 1200px) {
        .flex-block-1>div {
            padding: 0px 40px;
        }


    }

    @media (max-width: 991px) {
        #section-kalygrafink{background-size: 300px;}
        #section-contact:before{opacity: 0.3;}
        .flex-rs a img{width: 30px; height: 30px; object-fit: contain;}
        .s-style .titre1{font-size: 50px;}
        .s-style .titre1 small{display: block; font-size: 24px;}
        p.citation{font-size: 20px;}
        .flex-block>div .col-12 {
            flex: 0 0 100%;
            max-width: 100%;
            top: 0 !important;
        }
        .flex-block-3{
            padding:0px 15px;
            margin-bottom: 80px;
        }
        .logo_items{
            max-width: calc(100vw - 30px);
        }
        .flex-block-3 .col-12 .flex-block_text{
            top:0;
            margin-top:15px;
        }
        .title-depuis{
            display: table;
            margin: 0 auto;
        }
        .flex-block-2 h2 {
            text-align: center;
            margin: 40px auto 40px;
            padding: 20px 15px;
            font-size: 25px;
        }

        .flex-block-2 h2.title-color-primary {
            margin-bottom: 20px;
        }
        .flex-block-2{background: var(--second);}
        .flex-block-2:before{background:none;}

        .flex-block-2 .back2 {
            margin-bottom: 25px !important;
        }
        .flex-block-2 .flex-block_text_inner{
            padding: 0;
            text-align: center;
            padding: 0px 20px 120px;
        }
        .flex-block-2 .link-suite{
            display: table;
            margin: 40px auto;
        }
        .flex-block-1 .flex-block_text {
        }

        .flex-block h2:after {
            margin: 15px auto;
            position: relative;
            bottom: 0;
        }

        .flex-block p {
            text-align: center !important;
            max-width: 100%;
            float: none;
        }

        .flex-block-1 .flex-block_text:after {
            display: none
        }

        .flex-block-1 {
            background-position: right;
            margin: 0;
            padding: 30px 15px;
        }
        .block-text{
            margin-top: 0;
        }
        .flex-block-1>h1 span:first-child {
        }

        .flex-block-1>h1 span {
        }

        .flex-block-1>h1 {
            background-size: contain;
            margin-bottom: 0;
            padding-left: 0;
            padding-bottom: 10px;
        }
        .flex-block-1>h1 b{
            font-size: 37px;
        }
        .flex-block-1>h1:after {
            left: 0;
        }

        .flex-block-1>h1 {
            padding: 215px 20px 0px;
            background-size: 200px;
            background-position: 50% 0%;
            margin-bottom: 30px;
            text-align: center;
        }

        .flex-block-2 img {
            margin: 0 auto 15px;
            max-width: 200px;
        }

        .rubrique>div .col-12 {
            width: 100%;
            max-width: 100%;
            flex: 100%;
            margin-bottom: 20px;
        }

        .rubrique>div .col-12>div {
            padding-bottom: 0;
            margin-bottom: 0;
        }

        .rubrique>div h2 {
            text-align: center
        }

        .rubrique>div p {
            text-align: center;
            min-height: auto;
        }

        .rubrique>div a.d-table {
            margin: 20px auto 0px;
        }

        .flex-block-2 {
            margin-bottom: 150px !important;
        }

        .btn-tarif {
            margin: 0 auto;
            max-width: calc(100% - 30px);
        }

        .flex-block-1 img {
            display: block;
            max-width: 100%;
            margin: 15px auto 25px;
        }

        .flex-block-1:after {
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            background: none;
        }

        .flex-block-1 p {
            width: 100%;
            margin: 0px 0px 10px;
            max-width: 100%;
            text-align: center;
            border: none;
            padding: 0;
            top: 0;
            padding: 25px 0px;
        }

        .btn-contact {
            left: 0 !important;
        }
        .adresse-block .btn-contact{
            margin: 20px auto 25px;
        }

        .navbar .navbar-nav .nav-item .nav-link:before {
            display: none
        }

        .navbar {
            padding: 0px
        }

        .navbar-nav:after {
            display: none
        }

        .navbar-nav .nav-item .nav-link {
            text-align: left
        }

        .inner-menubox {
            padding: 0;
            background: none;
            left: 0;
            width: 100%;
            border: none;
        }

        .collapse:not(.show) {
            display: block;
        }

        .fluid-contact {
            padding: 15px 20px 40px;
        }

        .navbar-nav {
            align-items: center;
            flex-direction: column;
        }

        .navbar-nav:first-child {
            padding-bottom: 0;
        }

        .menubox.fixed .navbar-nav {
            flex-direction: column;
        }

        .navbar-nav:last-child {
            background: none;
            max-width: 100%;
            margin: 0 !important;
            padding-top: 0;
        }

        .navbar .navbar-nav .nav-item .nav-link {
            padding: 5px 10px;
            color: var(--white);
            font-weight: 600;
        }

        .adresse-block {
            display: block !important;
            max-width: 100%;
            margin-bottom: 0;
            background: none;
        }

        .adresse-block>div:first-child {
            width: 100%;
            width: 100%;
            max-width: 100%;
        }

        .adresse-block p {
            padding-left: 0;
            text-align: center !important;
        }

        .adresse-block a img{
            margin-bottom: 30px;
            margin-top: 15px;
        }
        .text:after {
            display: none
        }

        .collapse:not(.show) {
            display: block;
        }

        .navbar-nav {
            align-items: center;
            flex-direction: column;
        }

        .navbar-nav:first-child {
            padding-bottom: 0;
        }

        .menubox.fixed .navbar-nav {
            flex-direction: column;
        }

        .dropdown-item {
            text-transform: none;
            font-weight: 500;
            padding: 6px 15px;
            font-size: 16px;
        }

        .navbar-nav:last-child {
            background: none;
            max-width: 100%;
            margin: 0 !important;
            padding-top: 0;
        }

        .navbar .navbar-nav .nav-item .nav-link {
            padding: 5px 10px;
            font-size: 23px;
        }

        .navbar .navbar-nav .nav-item {
            background: none
        }

        .menubox:before,
        .menubox:after {
            display: none
        }

        .activemenu.menubox {
            transform: none;
        }

        .menubox {width: 100%;top: 50px !important;border: none;padding: 100px 20px;position: fixed;top: 0;left: 0;width: 100%;z-index: 10;max-width: 100%;transform: translateX(-100%);transition: 0.3s ease all;margin: 0;border-radius: 0;}
        .text {
            margin: 0 auto;
            box-shadow: none;
        }

        .top {
            top: 50px;
            align-items: flex-start;
            left: 0;
            width: 100%;
            margin-bottom: 20px;
        }

        .fluid-contact:after {
            display: none;
        }

        .contact {
            padding: 40px 00px 0px;
            text-align: center;
            height: auto;
            max-width: 100%;
        }

        .contact:after {
            position: relative;
            right: 0;
            top: 0;
        }

        .logo img {
            max-width: 300px;
        }

        .logo {
            padding: 0px 20px;
            width: 100%;
            display: block;
            left: 0;
            max-width: 100%;
            background: none;
            position: absolute;
            width: 100%;
            height: 500px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .logo>div {
            max-width: 100%;
            width: 100%;
            min-width: 100%;
            box-shadow: none;
            padding: 0;
            left: 0;
            text-align: center;
        }

        .logo a {
            text-align: center;
            padding: 0px;
            margin-bottom: 0;
            display: inline-block;
        }

        .top {
            border: 0;
        }

        .header {
            position: relative;
            padding-top: 0;
            top: 0;
            margin-top: 55px;
            margin-bottom: 0;
            max-height: initial;
        }

        .header:after {
            display: none
        }

        .header .d-flex {
            display: block !important;
            height: 500px;
            overflow: hidden;
            margin-bottom: 0;
            position: relative;
        }

        .header .d-flex:after {
            content: "";
            position: absolute;
            width: 100%;
            height: 100%;
            left: 0;
            top: 0;
        }

        .bloc-menu a {
            display: table;
            padding: 0;
            top: 0;
            left: 0;
            position: relative;
            transform: none !important;
            margin: 0;
            padding: 14px;
            background: var(--primary);
        }

        .bloc-menu {
            top: 0 !important;
            left: 0;
            width: 100% !important;
            position: fixed;
            top: 0px;
            width: 100%;
            background: var(--primary);
            height: 55px;
            overflow: hidden;
            z-index: 13;
            padding: 0 !important;
            display: block;
        }

        .bloc-menu.fixed .btn-menu {
            margin: 0;
        }

        .bloc-menu img {
            position: relative;
            left: 0;
        }

        .btn_scroll {
            display: none
        }

        .banner {
            width: 100%;
            max-width: 100%;
            height: 500px;
        }
        .banner>div{
            height:100%;
            background-position: center;
        }

        .header:before {
            display: none
        }

        .top {
            position: fixed;
            top: 11px;
            z-index: 14;
            margin: 0;
            right: 10px;
            left: initial;
            width: auto !important;
            max-width: max-content;
            background: none;
            padding: 0;
        }

        .top span {
            display: none
        }

        .top a:first-child {
            display: none
        }

        .top a {
            color: #fff !important;
        }

        .top>div:first-child {
            display: none !important;
        }
    }

    @media (max-width: 767px) {

        .logo img{
            max-width: 170px;
        }

        .flex-block-1>div {
            padding: 0;
            display: block;
        }

        .flex-block-1>h1 span:last-child{
            float: none;
            text-align: center;
            display: block;
        }
        .flex-block-1>h1 span:last-child:after{
            display:none
        }
        .block-cuvee img{
            max-width: 100px;
        }
/*.rubrique .img img{
    max-width: 120px;
    }*/
    .rubrique{
        padding: 60px 0px;
        margin: 120px auto;
    }
    
    .flex-block-1>h1 span{
        text-align: center;
        font-size: 20px !important;
        font-weight: 300 !important;
    }
    .flex-block-1>h1 b{
        font-size: 25px;
        text-align: center;
        margin: 10px auto;
    }
    .header .banner {
        width: 100%;
        max-width: 100%;
        overflow: hidden;
        background-position: center;
        height: 100%;
    }

    .header .d-flex {
        height: 300px;
    }

    .flex-block .col-12 {
        left: 0;
        top: 0;
        border: none;
        display: block;
    }

    .back2 {
        border: none;
        padding: 0px;
    }

    .footerlink {
        text-align: center;
    }

    .flex-block-2 .col-12:last-child {
        margin-top: 0;
        padding: 0;
        margin-bottom: 0 !important;
    }
    .rubrique>h2{
        margin-bottom:20px
    }

    .title-depuis b{
        font-size: 75px;
        line-height: 67px;
    }
    .title-depuis{
        padding-left: 60px;
    }
    .flex-block-1 {
        box-shadow: none;
        padding-bottom: 10px;
    }

    .block-text {
        margin: 0px auto 40px;
    }

    .block-text h2 {
        margin-bottom: 0;
    }

    .menubox:after {
        display: none;
    }
    .block-text h2.title-news{
        font-size: 25px;
    }
    .block-text h2.title-news:before{
        right: 0;
        z-index: 1;
    }
    .boxfooter {
        padding-bottom: 40px;
        background-position: right;
    }

    .contact .phone {
        display: block;
        padding: 0 !important;
    }

    .contact .phone:first-child:before {
        display: none
    }

    .logo img {
        margin: 0 auto;
        display: block;
    }

    .logo {
        align-items: center;
        top: 0;
        height: 100%;
    }

    .adresse-block .btn-contact {
        margin: 25px auto 15px;
        font-weight: 700;
        display: table;
    }

    .adresse-block p {
        margin: 0 auto 15px;
        max-width: 200px;
    }
    .logo_items{
        flex-direction: column;
        padding: 20px 15px 0px;
    }
    .fluid-contact{
        margin-top: 40px;
    }
    .logo_items img{
        margin-bottom:30px
    }

    .contact {
        text-align: center;
        margin-bottom: 0;
        padding-bottom: 0;
        padding-top: 0;
    }

    .boxfooter img {
        margin: 0 auto 20px;
        display: block;
        max-width: 100%;
        position: relative;
        float: none;
    }

.logo>div{
    width: 100%;
    max-width: 100%;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    position: relative;
}
}


/* rotate caret on hover */

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 0px rgba(0, 0, 0, 0.3);
    background-color: #999;
}

::-webkit-scrollbar {
    width: 0px;
    background-color: #999;
}

::-webkit-scrollbar-thumb {
    background-color: var(--black);
    border: 0px solid #555555;
}



.btn-contact:hover {
    text-decoration: none;
    color: var(--second);
}