@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,800');
                                @import url('https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300');
                                @import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap');
                                @import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500&display=swap');
                                @import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');
                                @import url('https://fonts.googleapis.com/css2?family=Kanit&display=swap');
                                @import url('https://fonts.googleapis.com/css2?family=Comfortaa&display=swap');
                                @import url('https://fonts.googleapis.com/css2?family=Nunito&display=swap');
                                @import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
                                https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap
                                    .default_title{
                                        text-align:0;
                                        color:#484848;
                                        background:;
                                        font:24px  'Open Sans', sans-serif;
                    }

                                    .without_title{
                    display:none;
                    }
                
    :root {
    /*######################## GENERAL ########################*/
    --color-primary: #000000;
    --color-hover: #282828;
    --color-secondary: rgb(245, 130, 30);
    --color-accent: #a8c3b0;
    --color-grey: #264653;

    --color-dark: #000000;
    --color-light: #ffffff;

    /*######################## FONTS ########################*/
    --font-main: "DM", sans-serif;
    --font-title: "DM", sans-serif;
    --font-slider: "DM", sans-serif;
    --font-header: "DM", sans-serif;
    /*######################## LINKS ########################*/
    --color-link: rgb(245, 130, 30);
    --color-linkhover: #ffd968;
    --color-arbo: #575757;
    --color-arbo-hover: #8a8a8a;
    /*######################## HEADER ########################*/
    --color-topbar: #f7f7f7;
    --color-topbarbackground: #fff;
    --color-topsocial: #f7f7f7;
    --color-topsocialbackground: #8a8a8a;
    --color-topsocialbackground-hover: #d3d3d3;
    --header-spacing: 0 0.8rem;
    --color-header-link: #3f3f3f;
    --color-header-linkhover: #3f3f3f;
    --color-border-submenu: #fff;
    --color-menu-before: #fff;
    --size-header-logo: 120px;

    /* STICKY */
    --color-stickymenu-button: #003649;
    --color-stickytitle: #f7f7f7;
    --color-slogan: rgb(255, 255, 255);

    /*######################## SLIDER ########################*/
    --color-slider: #f7f7f7;
    --slider-titlefontsize: 4rem;
    --slider-fontweight: 500;
    --slider-subtitlefontsize: 1.2rem;
    --color-slider-link: #f7f7f7;
    --color-slider-linkhover: #ffd26b4d;
    --color-slider-overlay: #2424244a;
    /*######################## CONTACT ########################*/
    --color-contact-btn-background: rgb(245, 130, 30);
    --color-contact-btn: #f7f7f7;

    --color-contact-btn-hover-background: #000;
    --color-contact-btn-hover: #f7f7f7;

    --color-rightside-background: #dfdfdf3a;
    --color-rightside: #8a8a8a;
    --color-rightside-border: #8a8a8a;
    --color-rightside-text: #000;

    /*######################## GALERY ########################*/
    --color-galery: #eb821e;
    --color-galery-border-color: #8a8a8a;
    --color-btn-galery-background: #8a8a8a;
    --color-gal-info: #000000;
    --color-gal-content: #f7f7f7e0;

    /*######################## ACCORDION ########################*/
    --color-accordion: #3f3f3f;
    --color-accordion-background: #f7f7f7;
    --color-accordion-border-color: #3f3f3f;

    /*######################## BLOCK ########################*/
    --color-blocktitle: #3f3f3f;
    --color-block-content: #003649;
    --color-block-icon: #04990e;
    /* --color-block-icon-background: #003649; */
    --color-block_box-background: #f7f7f7;
    --color-block-border-color: #eee;
    /* --color-blocktitlehover: #12a088; */

    /*######################## ACTU ########################*/
    --color-actu-title: #ffffff;
    --actu-title-fontsize: 2.2rem;
    --color-actu-filter: #00000070;
    --color-actu-text-background: transparent;
    --color-actu-link: #fdff00;
    --color-actu-link-hover: #ffd968;
    --color-actu-text: #ffffff;
    --color-actu-strong: #ffffff;
    /*######################## TITLE ########################*/
    /* DEFAULT TITLE */
    --color-defaulttitle: #3f3f3f;
    --default-title-fontsize: 2.5rem;

    /* POST TITLE */
    --color-posttitle: #3f3f3f;
    --color-posttitlehover: #3f3f3f;
    --post-title-fontsize: 20px;
    --color-post-background: #8a8a8a;
    --color-post: #f7f7f7e3;
    --post-link-color: #8a8a8a;
    --post-link-color-hover: #d3d3d3;

    /* INFO TITLE */
    --color-infotitle: #3f3f3f;
    /* --color-infotitlehover: #12a088; */

    /* CARD TITLE */
    --color-cardtitle: #3f3f3f;
    /* --color-cardtitlehover: #12a088; */

    /*######################## ICON  ########################*/
    --color-icon: #04990e;
    --color-icon-title: #3f3f3f;
    --icon-fontsize: 30px;
    /* --color-iconhover: #12a088; */

    /*######################## DIAPO  ########################*/
    --color-nav-button: #000;
    --color-nav-button-hover: #fff;
    --color-nav-button-background: #2a2a2a94;
    /*######################## TESTIMONIAL ########################*/
    --color-testimonial: #000;
    --testimonial-fontsize: 1.1rem;
    --testimonial-fontweight: 500;
    --testimonial-fontstyle: italic;
    --testimonial-background: #f8f8f8;
    --testimonial-activebackground: #04990e;
    /*######################## FOOTER ########################*/
    --color-footer: #202020;
    --color-footerbackground: transparent;
    --color-footerlink: #fff;
    --color-footerlinkhover: #fff;
    --color-footericon: #04990e;
    --color-footer-border: #fff;
    --color-picto-reso: #8a8a8a;
    --color-picto-reso-hover: #d3d3d3;
    --picto-reso-color: #f7f7f7;
    --color-footer-primarybtn: #04990e;
    --color-footer-primarybtn-hover: #d3d3d3;
    /* #81fb6f1c */
    /*######################## COPYRIGHTS ########################*/
    --color-cls-1: #04990e;
    --color-cls-2: #000000;
    --color-copyrigtlink: #000000;
    --color-copyrigtlinkhover: #3f3f3f;
    --color-copyrightbackground: #fff;

    /*######################## BTN ########################*/
    /* BTN PRIMARY */
    --color-btnprimary-background: rgb(245, 130, 30);
    --color-btnprimary-border: rgb(245, 130, 30);
    --color-btnprimary-color: #f7f7f7;

    --color-btnprimary-hover-background: rgb(245, 130, 30);
    --color-btnprimary-hover-border: rgb(245, 130, 30);
    --color-btnprimary-hover-color: #000;

    /* BTN SUCCESS */
    --color-btnsuccess-background: #04990e;
    --color-btnsuccess-border: #04990e;
    --color-btnsuccess-color: #f7f7f7;

    --color-btnsuccess-hover-background: #ffd968;
    --color-btnsuccess-hover-border: #ffd968;
    --color-btnsuccess-hover-color: #f7f7f7;

    /* BTN INFO */
    --color-btninfo-background: #04990e;
    --color-btninfo-border: #04990e;
    --color-btninfo-color: #f7f7f7;
    /* color:rgba(129, 251, 111, 0.11); */
    --color-btninfo-hover-background: #ffd968;
    --color-btninfo-hover-border: #ffd968;
    --color-btninfo-hover-color: #f7f7f7;

    /* BTN DANGER */
    --color-btndanger-background: #04990e;
    --color-btndanger-border: #04990e;
    --color-btndanger-color: #f7f7f7;

    --color-btndanger-hover-background: #ffd968;
    --color-btndanger-hover-border: #ffd968;
    --color-btndanger-hover-color: #f7f7f7;

    /* BTN TAG */
    --color-btag-background: rgb(245, 130, 30 );
    --color-btag-color: #fff;

    --color-btag-hover-background: #ffd968;
    --color-btag-hover-border: #ffd968;
    --color-btag-hover-color: #fff;

    /* BTN OUTLINE SECONDARY */
    --color-btn-outline-secondary-background: #04990e;
    --color-btn-outline-secondary-border: #04990e;
    --color-btn-outline-secondary-color: #fff;

    --color-btn-outline-secondary-hover-background: #ffd968;
    --color-btn-outline-secondary-hover-border: #ffd968;
    --color-btn-outline-secondary-hover-color: #fff;
}

/* ######################## CSS ######################## */

/*Patch Slider*/
body,
#content,
#footer,
#wrapper,
.article-box {
    background-color: #fff !important;
    color: #000 !important;
    text-align: justify !important;
}

a{
    color: #000 !important;
}

.article-box {
    position: relative;
    z-index: 10;
}

#header {
    z-index: 11;
}

#header.sticky-header.classique-style #top-bar {
    display: none !important;
}

/* ************** */

body {
    font-family: var(--font-main) !important;
}

.logo img {
    width: 130px !important;
    margin: 0;
    height: inherit !important;
}





#header {
    height: auto !important;
    z-index: 100;
}

/* TOB BAR */

.header_overlay {
    /*  overflow: hidden;*/
}

#header-wrap {
    background: var(--color-dark) !important;
}

.header-classique{
    background-color: var(--color-light) !important;
}

#header.sticky-header .header-classique {
    background: var(--color-light) !important;

}

#top-bar {
    height: 30px !important;
    display: flex !important;
    align-items: center !important;
    align-content: center !important;
    position: relative;
    background: var(--color-primary);
}

.top-links{
    display: none !important;
}

.phoneTopBar{
    color: var(--color-primaryary) !important;
    text-transform: uppercase !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    letter-spacing: 0.6px !important;
    background: white !important;
    border-radius: 5px !important;
    padding: 15px !important;

}

#top-bar .top__wrapper {
    position: relative;
    display: flex;
    align-items: center;
    background: var(--color-primary);
    height: 50px;
    padding: 0 1rem;
}

.top__wrapper::before {
    content: "";
    position: absolute;
    left: -8px;
    width: 16px;
    height: 100%;
    transform: skew(12deg);
    background: var(--color-primary);
    top: 0;
}

.header-align {
    padding: 0.5rem 0;
}

.top__recall {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.top__recall span {
    color: #fff !important;
    font-weight: 500;
    font-size: 15px;
    margin-right: 0.5rem;
}

.top__recall span i {
    margin-right: 0.25rem;
}

.top__recall a {
    color: #fff !important;
    font-size: 1.1rem;
    font-weight: 500;
    transition: 0.3s;
}

.top__recall a:hover {
    color: rgba(255, 255, 255, 0.6) !important;
}

.top__social {
    border-right: 1px solid rgba(255, 255, 255, 0.2);
    margin-right: 1rem;
}

.header-classique .header__wrapper {
    display: flex;
    justify-content: space-between;

}

#primary-menu {
    position: relative;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    width: 100%;
    background: var(--color-light);
    padding: 0.4rem 0;
    align-content: center !important;
}

.overlay_slide::before {
    content: "";
    position: absolute;
    top: 40px;
    right: -20px;
    width: 300px;
    height: 100px;
    background-image: url(../images/devis.png);
}

#primary-menu > .container > ul {
    padding: 0 !important;
}

#primary-menu > .container > ul > li {
    margin: 0 !important;
}

#primary-menu > .container > ul > li > a {
    color: var(--color-primary) !important;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: 0.3s;
    text-align: center;
    line-height: 100%;
    font-size: 0.95rem;
/*    font-weight: bold;*/
    padding: 0.6rem 1.5rem;
    border-left: solid 1px #ffffff38;
    transition: all 0.4s ease;
    text-transform: uppercase;
}

#primary-menu > .container > ul > li > a:hover {
    color: var(--color-primary) !important;
    background-color: var(--color-secondary) !important;
}

#primary-menu ul {
    justify-content: center;
}

#primary-menu ul ul li > a {
    color: #121212 !important;
}

#primary-menu ul ul li > a:hover {
    color: var(--color-primary) !important;
}

.header__info-item:not(:last-child) {
    padding-right: 2.5rem;
    margin-right: 2.5rem;
}

.header__info {
    display: flex;
}

.header__info .header__info-item:nth-child(2) {
    border-right: 1px solid rgba(0, 0, 0, 0.1);
}

.header__info-text {
    align-items: center;
}

.fa-phone {
    transform: rotateY(180deg);
}

 .fa-envelope:before {
    font-size: 20px !important;
    display: none !important;
}


.header__info-text a {
    color: var(--color-secondary) !important;
}

.header__info-item {
    display: flex;
    align-items: center;
}

.header__info-icon {
    margin-right: 1rem;
    border-radius: 2px;
}

.header__info-icon i {
    color: var(--color-primary);
    font-size: 24px;
}

.header__info-text span {
    color: var(--color-primary);
    font-size: 2rem;
}

.header__info-social {
    display: flex;
}

.header__info-social a {
    display: flex;
    height: 35px;
    width: 35px;
    justify-content: center;
    align-items: center;
    background: var(--color-light) !important;
    color: var(--color-primary) !important;
    border-radius: 5px !important;
    transition: 0.3s;
    font-size:16pt !important;

}

.header__info-social a:not(:last-child) {
    margin-right: 0.5rem;
}

.header__info-social a:hover {
    color: rgb(245, 130, 30) !important;
}

.top__social {
    color: #fff;
}

.top__social span {
    color: var(--color-secondary-hg);
    font-size: 14px;
    margin-right: 1rem;
    display: inline-block;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.top__social a {
    color: #fff !important;
    font-size: 18px;
}

.top__social a:hover {
    color: var(--color-secondary-hg) !important;
}

#slogan {
    color: var(--color-slogan);
    font-size: 14px;
    font-weight: 300;
}

#top-social li,
#top-social li a,
    /* #top-social li .ts-icon, */
#top-social li .ts-text {
    line-height: 45px !important;
    height: 45px !important;
}

.ts-icon {
    display: none !important;
}

#top-social li a {
    font-weight: bold;
    width: 199px !important;
    background: #04990e;
    font-size: 0.9rem;
    text-transform: uppercase;
}

#top-social li a:hover {
    background-color: #bababa !important;
}

#top-social ul {
    padding: 0 !important;
}

.top-links ul {
    padding: 0 1.5rem 0 0 !important;
    margin: 0.1rem 0 !important;
}

.top-links ul li {
    border-left: 0 !important;
    margin: 0 0.25rem;
}

.top-links {
    margin-right: 1rem;
}

#top-bar .top-links ul li a:not(.phoneTopBar) {
    color: #fff !important;
    text-transform: uppercase !important;
    font-weight: 600 !important;
    font-size: 14px;
    letter-spacing: 0.6px;
}

/* SLIDE */
.slider-caption {
    max-width: none !important;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: start;
    max-width: 600px !important;
    left: 0;
    position: relative;
    opacity: 1 !important;
    padding-left: 1rem !important;
}

.slider-caption::before {
    content: "";
    position: absolute;
    top: -10rem;
    right: 140px;
    width: 200px;
    height: 200px;
    background-image: url(../images/devis200.png);
    background-size: cover;
    scale: 0.6;
}

.slider-caption::after {
    content: "";
    position: absolute;
    top: -10rem;
    right: 10px;
    width: 200px;
    height: 200px;
    background-image: url(../images/garantie200.png);
    background-repeat: no-repeat;
    scale: 0.6;
}

.overlay_slide {
    background: linear-gradient(133deg, rgb(2 9 0 / 84%) 27%, rgba(2, 6, 9, 0) 70%) !important;
    opacity: 1 !important;
}

.slider__title {
    color: var(--color-slider);
    font-family: var(--font-slider);
    font-weight: var(--slider-fontweight);
    font-size: var(--slider-titlefontsize);
    border-radius: 5px;
    color: var(--color-light);
}

.slider__subtitle {
    color: var(--color-slider);
    font-family: var(--font-slider);
    font-size: var(--slider-subtitlefontsize);
}

.slider__link {
    margin-top: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: start;
}

.slider__link a {
    background-color: var(--color-secondary) !important;
    color: var(--color-light) !important;
    padding: 1rem 2rem;
    letter-spacing: 0.7px;
    transition: 0.3s;
    position: relative;
    overflow: hidden !important;
    border-radius: 5px !important;
}

/*
.slider__link a::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: #fff solid 1px;
    transition: 0.3s;
    z-index: -1;
}

.slider__link a::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: -10px;
    width: 0%;
    height: 100%;
    background-color: var(--color-slogan) !important;
    transition: 0.2s;
    z-index: -2;
    transform: skew(20deg);
    overflow: hidden;
}
*/






.slider__link a:hover::after {
    width: 115%;
    transition: width 0.3s ease-in-out;
}
.slider__link a:hover::before {
    border : var(--color-slogan) solid 1px !important;
}

.slider__link a:hover{
    color: var(--color-primary) !important;
}

.one-page-arrow {
    font-size: 40px !important;
    color: #fff !important;
}

/* TITLE */
.default_title {
    margin-top: 15px !important;
    font-size: var(--default-title-fontsize) !important;
    color: var(--color-secondary) !important;
    font-weight: 600 !important;
    font-family: var(--font-title);
}

h2.titre span {
padding-left: 0 !important;
}

h2.titre span::before {
    content: "";
    position: absolute;
    top: 0;
    left: -20px;
    width: 4px;
    height: 100%;
    background: var(--color-secondary);
}

h2,
h3,
h4 {
    font-family: var(--font-title);
    color: var(--color-secondary) !important;
    font-weight: 600 !important;
}

.default_title a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover {
    font-family: var(--font-title);
    color: inherit;
    font-weight: inherit !important;
}

/* LINK */
a:not(
    .btn-mob,
    .close_contact_menu,
    .btag,
    .btn-primary,
    .slider__link a,
    #top-social li a,
    #menu-bas a,
    #primary-menu a,
    #over_mobile_menu a,
    .post__title a,
    .actu__filter a,
    .btn-outline-secondary,
    #arbo a,
    #actu a,
    #kreatic_logo a,
    .Product_3f3f3firect a,
    .picto-reso a,
    .post__text a,
    .post__content .post_link a,
    .social a,
    .top-links a,
    .text-reset,
    .one-page-arrow,
    .btn-contact-footer,
    .header__info-text a,

  ) {
    color: var(--color-link) !important;
}

a:hover:not(
    .btn-mob,
    .close_contact_menu,
    .btag,
    .btn-primary,
    .slider__link a,
    #top-social li a,
    #menu-bas a,
    #primary-menu a,
    #over_mobile_menu a,
    .post__title a,
    .actu__filter a,
    .btn-outline-secondary,
    #arbo a,
    #actu a,
    #kreatic_logo a,
    .Product_3f3f3firect a,
    .picto-reso a,
    .post__text a,
    .post__content .post_link a,
    .social a,
    .top-links a,
    .text-reset,
    .btn-contact-footer,
    .header__info-text a,

  ) {
    color: var(--color-linkhover) !important;
}

strong a,
strong a:hover,
a strong,
a strong:hover {
    font-weight: 700 !important;
}

#arbo a {
    color: var(--color-arbo) !important;
}

#arbo a:hover {
    color: var(--color-arbo-hover) !important;
}

/* BTN PRIMARY*/
.btn-primary {
    background-color: var(--color-btnprimary-background) !important;
    border-color: var(--color-btnprimary-border) !important;
    color: var(--color-btnprimary-color) !important;
    font-weight: bold !important;
}

.btn-primary:hover {
    background-color: var(--color-btnprimary-hover-background) !important;
    border-color: var(--color-btnprimary-hover-border) !important;
    color: var(--color-btnprimary-hover-color) !important;
}

/* BTN SUCCESS*/
.btn-success {
    background-color: var(--color-btnsuccess-background) !important;
    border-color: var(--color-btnsuccess-border) !important;
    color: var(--color-btnsuccess-color) !important;
}

.btn-success:hover {
    background-color: var(--color-btnsuccess-hover-background) !important;
    border-color: var(--color-btnsuccess-hover-border) !important;
    color: var(--color-btnsuccess-hover-color) !important;
}

/* BTN INFO*/
.btn-info {
    background-color: var(--color-btninfo-background) !important;
    border-color: var(--color-btninfo-border) !important;
    color: var(--color-btninfo-color) !important;
}

.btn-info:hover {
    background-color: var(--color-btninfo-hover-background) !important;
    border-color: var(--color-btninfo-hover-border) !important;
    color: var(--color-btninfo-hover-color) !important;
}

/* BTN DANGER*/
.btn-danger {
    background-color: var(--color-btndanger-background) !important;
    border-color: var(--color-btndanger-border) !important;
    color: var(--color-btndanger-color) !important;
}

.btn-danger:hover {
    background-color: var(--color-btndanger-hover-background) !important;
    border-color: var(--color-btndanger-hover-border) !important;
    color: var(--color-btndanger-hover-color) !important;
}

/* BUTTON TAG */

.btag {
    background-color: transparent !important;
    color: var(--color-btag-color) !important;
    margin: 0.5rem 0;
}

.btag:hover {
    background-color: var(--color-primary) !important;
    color: var(--color-btag-color) !important;
}

/* BUTTON OUTLINE SECONDARY */
.btn-outline-secondary {
    background-color: var(--color-btn-outline-secondary-background) !important;
    border-color: var(--color-btn-outline-secondary-border) !important;
    color: var(--color-btn-outline-secondary-color) !important;
    margin: 0.5rem 0;
    font-weight: bold !important;
}

.btn-outline-secondary:hover {
    background-color: var(--color-btn-outline-secondary-hover-background) !important;
    border-color: var(--color-btn-outline-secondary-hover-border) !important;
    color: var(--color-btn-outline-secondary-hover-color) !important;
}

/* ACCESS */
.access_ligne {
    margin: 0.4rem 0;
}

/* CONTACT */
#contact_button {
    background-color: var(--color-contact-btn-background) !important;
    color: var(--color-contact-btn) !important;
}

.close_contact_menu,
a.btn-mob {
    background-color: var(--color-contact-btn-background) !important;
    color: var(--color-contact-btn) !important;
}

.close_contact_menu:hover,
a.btn-mob:hover {
    background-color: var(--color-contact-btn-hover-background) !important;
    color: var(--color-contact-btn-hover) !important;
}

.contact_right_side {
    background-color: var(--color-rightside-background);
    border: var(--color-primary) 1px solid;
    color: var(--color-primary);
    border-radius: 15px;
    height: fit-content !important;
}

.contact_right_side .social a {
    margin: 0 0.1rem !important;
}

.contact_right_side h2,
.ico_ico {
    color: var(--color-primary) !important;
}

.contact_right_side .ico_text {
    color: var(--color-rightside-text) !important;
}

.ico_text {
    display: flex;
    align-items: center;
}

.ico {
    width: 45px;
    height: 45px;
    border-radius: 10px;
    border: 1px solid var(--color-primary);
    color: var(--color-primary);
    display: flex;
    justify-content: center;
    align-items: center;
}

.social a {
    cursor: pointer;
    width: 45px !important;
    height: 45px !important;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border: var(--color-rightside-border) solid 1px;
    background: var(--color-rightside-border);
    color: #fff !important;
    border-radius: 50%;
    margin-right: 0.5rem;
}

.social a:hover {
    border: var(--color-hover) solid 1px;
    background: var(--color-linkhover);
    color: #fff !important;
}

.social {
    display: flex !important;
}

.contact-social i {
    height: 45px;
    width: 45px;
    border-radius: 10px;
    border: 1px solid var(--color-primary);
    display: inline-flex;
    justify-content: center;
    align-items: center;
    color: var(--color-primary) !important;
}

/* GALERY */

.gal-content {
    background-color: var(--color-gal-content);
    margin: 0.4rem;
}

.gal-title,
.gal-desc {
    color: var(--color-gal-info);
    font-weight: 600;
}

.button-gallery-list h3,
.before-after h3 {
    color: var(--color-galery) !important;
    font-weight: 600 !important;
    font-size: 24px !important;
}

.button-gallery,
.is-checked {
    border-color: var(--color-galery-border-color) !important;
    color: var(--color-galery-border-color) !important;
}

.button-gallery:hover,
.is-checked {
    background: var(--color-btn-galery-background) !important;
    color: #ffff !important;
}

.revGallery-anchor {
    padding: 15px 0.4rem 0;
    width: calc((100% / 4));
}

.revGallery-anchor:hover .gal-content {
    transform: translateY(10px);
}

.gal-overlay {
    width: 97%;
    height: 97%;
    top: 5px;
    left: 5px;
    background: none !important;
}

.twentytwenty-container img,
.twentytwenty-after-label {
    min-width: 100%;
}

.twentytwenty-container {
    height: 300px;
}

/* ARTICLE */
.article div:not(.card) p img {
    position: relative;
    z-index: 1;
    border-radius: 4px;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
}

.article .table img {
    box-shadow: none !important;
}

/* CAROUSEL */
.container.partenaires-container {
    margin-bottom: 1.4rem;
}

/* TESTIMONIAL */
.testimonial .testimonial-description {
    color: var(--color-testimonial) !important;
    font-size: var(--testimonial-fontsize) !important;
    font-weight: var(--slider-fontweight) !important;
    font-style: var(--testimonial-fontstyle) !important;
}

.reviews-wrapper .testimonial .testimonial-content,
.testimonial .testimonial-content {
    background-color: var(--testimonial-background) !important;
}

.testimonial-content > p {
    color: var(--color-primary) !important;
}

.pagination > .active > span {
    background-color: var(--testimonial-activebackground) !important;
    color: white !important;
    border-color: transparent !important;
}

.pagination > .active > span:hover {
    background-color: var(--testimonial-activebackground) !important;
    color: white !important;
    border-color: transparent !important;
}

/* ACCORDION */
.accordion-button:not(.collapsed) {
    color: var(--color-accordion) !important;
    background-color: var(--color-accordion-background) !important;
    border-color: var(--color-accordion-border-color) !important;
    box-shadow: none !important;
}

.accordion-button:focus {
    box-shadow: none !important;
}

.accordion-button::after {
    /* fill = 23 puis code couleur */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}

/* CARD */
div.card-body > .card-title {
    color: var(--color-cardtitle);
    font-weight: 600;
}

/* DIAPO */
.flex-prev i,
.flex-next i {
    color: var(--color-nav-button) !important;
}

.flex-prev:hover i,
.flex-next:hover i {
    color: var(--color-nav-button-hover) !important;
}

.flex-prev:hover,
.flex-next:hover {
    background: var(--color-nav-button-background) !important;
}

/* PRODUCT */
.Product_3f3f3firect a {
    color: #fff !important;
}

.card div.hover-zoom {
    overflow: hidden;
}

.card div.hover-zoom img {
    width: 100%;
    transition: transform 0.1s;
}

.card div.hover-zoom img:hover {
    -ms-transform: scale(1.12);
    /* IE 9 */
    -webkit-transform: scale(1.12);
    /* Safari 3-8 */
    transform: scale(1.12);
}


/* ACTU */
#actu {
    position: relative;
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}

#actu::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--color-dark);
    z-index: 0;
    opacity: 0.5;
}

#actu a:not(.btn-primary),
#actu a strong {
    color: var(--color-secondary) !important;
}

#actu a:not(.btn-primary):hover,
#actu a strong:hover {
    color: var(--color-actu-hover) !important;
}

#actu p,
#actu li {
    color: var(--color-actu-text) !important;
}

#actu strong {
    color: var(--color-actu-strong) !important;
}

#actu img {
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

#actu h3 {
    color: var(--color-actu-title) !important;
    font-size: var(--actu-title-fontsize) !important;
    position: relative;
}

.actu__content {
    z-index: 1;
    display: flex;
    flex-direction: column;
    padding-top: 2rem;
    padding-bottom: 6rem;
}

/* POST */
.post-container {
    padding-top: 4rem;
    padding-bottom: 4em;
    position: relative;
    z-index: 0;
    margin-top: -10rem;
}


.post {
    color: #fff;
    position: relative;
    overflow: hidden;
    margin: 0;
    height: 100%;
    width: 100%;
    background: var(--color-light);
    text-align: start;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    box-shadow: rgb(38, 57, 77) 0px 20px 30px -10px;
    border-bottom: solid var(--color-secondary) 4px;
    z-index: 0;
}

.post:hover::before {
    opacity: 0.8;
}

.post__image {
    max-width: 100%;
    height: 100%;
    object-fit: cover;
    width: 100%;
    overflow: hidden;
}

.post__image img {
    object-fit: cover;
    height: 100%;
    width: 100%;
    transition: 0.8s all cubic-bezier(0.19, 1, 0.22, 1);
}

.post:hover .post__image img {
    transform: scale(1.1);
}

.post__content {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 1.5em;
    transition: 0.8s all cubic-bezier(0.19, 1, 0.22, 1);
    z-index: 1;
}

.post__text a {
    color: var(--color-primary) !important;
}

.post__text a:hover {
    color: var(--color-secondary) !important;
}

.post__content p {
    color: var(--color-dark) !important;
    font-weight: 300 !important;
    margin-bottom: 0rem;
}

.post__title {
    line-height: 100%;
    margin-bottom: 1rem;
}

.post__title a {
    color: var(--color-dark) !important;
    font-size: 1.5rem;
    font-weight: 600;
    font-family: var(--font-title);
}

.post__title a:hover {
    color: var(--color-secondary) !important;
}

/* BLOCK */
.block-container {
    position: relative;
    padding-top: 1rem;
    padding-bottom: 1rem;
    z-index: 0;
}

.block-overlay {
    position: relative;
    width: 100%;
}

.block__box {
    height: 100%;
    width: 100%;
    background-color: #fff;
    padding: 2rem;
    /*
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    */
    transition: 0.3s;
}

.bg-block {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: repeating-linear-gradient(-45deg, #fff, #fff 2.5px, #483b33 4px, #483b33 0);
    z-index: -1;
}

/*.block__box:hover {
    border-color: #fff;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
    transform: translate3d(-12px, -12px, 0);
}*/

.block__icon {
    font-size: 34px;
}

.block__title {
    font-size: 24px;
    margin: 1rem 0;
    font-weight: 500;
    font-family: var(--font-title);
    text-align: center;
    color: var(--color-dark);
}

.block__text {
    color: rgba(0, 0, 0, 0.6) !important;
}

.block-container .container-flud {
    padding: 0 2rem;
}

.block__icon {
    color: var(--color-secondary) !important;
    font-size: 2rem;
    margin-bottom: 1rem;
    display: flex;
    justify-content: center;
}

.block__text p {
    text-align: center;
    color: rgb(0, 0, 0) !important;
}

.block__text a {
    color: var(--color-secondary) !important;
}

#block-main .btn-primary {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
    color: #fff !important;
    font-weight: 600 !important;
}

#block-main .btn-primary:hover {
    background-color: var(--color-hover) !important;
    border-color: var(--color-hover) !important;
    color: #fff !important;
}

/* ICON CONTAINER*/
.icon__item {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.icon__img {
    font-size: 36px;
    color: var(--color-secondary);
}

.icon__title {
    margin-top: 0.5rem;
    font-weight: 400;
    color: #707070;
    text-align: center;
}

.icon-container {
    padding-top: 2rem;
    padding-bottom: 2rem;
}
.icon-container .icon__img {
    color: var(--color-primary);
    font-size: var(--icon-fontsize);
}

.icon__title {
    margin-top: 0.7rem;
    font-weight: 600;
    color: var(--color-icon-title);
}

.icon-container {
    text-align: center;
    padding: 1rem 0;
}

.icon-container > .row > div {
    height: 180px;
    justify-content: center;
    align-items: center;
    display: flex;
    flex-direction: column;
}

/* AVIS */
.section-reviews {
    padding: 1rem 0;
}

/* FOOTER */

#footer {
    background: transparent !important;
}

.footer__services img{
    width: 80% !important;
}

.footer {
    position: relative;
    z-index: 0;
    background: #000000;
    padding: 0.5rem;
    color: #3f3f3f !important;
}

.footer::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    /*
    background-image: url("../modeles/templates/template_7/backgrounddgelec.jpg");
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
    */
    background-color: var(--color-primary) !important;
    z-index: -1;
}

.footer-info-col {
    display: flex;
    align-items: center;
    flex-direction: column;
}

.footer-info-col > ul {
    list-style: none;
}

.footer-info-col > ul > li {
    margin-bottom: 1.25rem;
}

.footer-info-col > ul > li > i {
    font-size: 1.25rem;
    color: var(--color-footericon);
    width: 30px;
    height: 30px;
    border-radius: 10px;
    border: var(--color-secondary) 1px solid;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.footer .container .row .col-lg-7{
    justify-content: center !important;
    display: flex !important;
    align-items: center !important;

}

.title-footer {
    padding-top: 1rem;
    padding-bottom: 1rem;
    margin: 0;
    background: #fff;
}

.title-footer h2 {
    text-align: left !important;
    margin: 0;
}

.title-footer__title span {
    display: inline-block;
    position: relative;
    z-index: 0;
}

.title-footer__title span::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 12px;
    z-index: -1;
    background: var(--color-secondary);
}

.title-footer h2 {
    color: var(--color-primary) !important;
    text-align: center !important;
}

.title-footer p {
    color: rgba(255, 255, 255, 0.7) !important;
}

.title-footer__text {
    color: #707070 !important;
    font-weight: 300;
}

.footer {
    padding: 3rem 0 1rem 0;
    background: var(--color-grey);
}

.footer__content {
    border-right: 1px solid #fff;
    margin-right: 1rem;
    padding-right: 10rem;
}

.footer__main-title {
    color: #fff;
    font-size: 32px;
    font-weight: 500;
    margin-bottom: 0.5rem;
    line-height: 120%;
}

.footer__main-title span {
    font-weight: 600;
}

.footer__info-item {
    display: flex;
    font-size: 22px;
    color: rgba(255, 255, 255, 0.8);
}

.footer__info-item span {
    padding-left: 0.5rem;
}

.footer__info-item:not(:last-child) {
    margin-bottom: 1rem;
}

.footer__info-item a {
    padding-left: 0.5rem;
    color: var(--color-primary) !important;
    font-weight: 500;
}

.footer__info-item svg {
    fill: var(--color-primary);
    margin-right: 0.5rem;
}

.footer__services {
    display: flex;
    flex-direction: column;
}

.footer__services a {
    display: inline-block;
    margin-bottom: 0.1rem;
    font-size: 18px;
    white-space: nowrap;
    transition: 0.3s;
}

.footer__title {
    font-size: 26px;
    margin-bottom: 1rem;
    color: #fff;
    font-weight: 600;
}

.footer__copyright {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding-top: 1rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.footer__copyright span {
    color: rgba(255, 255, 255, 0.6) !important;
    padding-right: 1rem;
}

.footer__copyright a {
    font-weight: 300;
    margin-left: 1rem;
    color: rgba(255, 255, 255, 0.6) !important;
}

.footer__copyright svg {
    height: 40px;
}

.footer__network {
    display: flex;
    align-items: center;
}

.footer__network a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 48px;
    width: 48px;
    background: transparent;
    border-radius: 50px;
    border: 2px solid rgb(245, 130, 30);
    color: var(--color-topbarbackground) !important;
    transition: 0.3s;
}

.footer__network a:hover {
    background: var(--color-primary);
}

.footer__network a:not(:last-child) {
    margin-right: 0.5rem;
}

.text-reset {
    font-size: 1.4rem !important;
    color: var(--color-grey) !important;
}

.btn-contact-footer {
    background-color: var(--color-secondary) !important;
    border-color: var(--color-primary) !important;
    color: #fff !important;
    font-weight: 600 !important;
    font-size: 1.2rem !important;
    padding: 0.5rem 1rem !important;
    margin-top: 1rem !important;
    border-radius: 0.25rem !important;
}

.btn-contact-footer:hover {
    background-color: var(--color-dark) !important;
    color: var(--color-secondary) !important;
    border: 1px solid var(--color-secondary) !important;
}

/* COPYRIGHTS */
#copyrights-container {
    background-color: var(--color-dark) !important;
}

.copyrights-container {
    padding: 10px;
}

#menu-bas a,
#kreatic_logo .block__content span,
#kreatic_logo a {
    color: var(--color-light) !important;
}

#menu-bas a:hover,
#kreatic_logo span:hover,
#kreatic_logo a:hover {
    color: var(--color-accent) !important;
}

.cls-1 {
    fill: var(--color-light) !important;}

.cls-2 {
    fill: var(--color-secondary) !important;

}

/* MEDIA */
@media (max-width: 1200px) {
    #top-bar::before {
        background: linear-gradient(45deg, rgb(189, 189, 189) 0%, rgb(189, 189, 189) 45%, rgb(220, 178, 83) 45%, rgb(220, 178, 83) 100%) !important;
    }
}
@media (min-width: 991px) {
    .post-container > .row > div {
        padding-left: 1rem !important;
        padding-right: 0 !important;
    }
}

@media (max-width: 991px) {
  /*  h2.titre {
        text-align: start !important;
    }*/


    #header.sticky-header .header-classique {
        background: var(--color-light) !important;
    }

    .swiper-slide .container{
        display: flex !important;
        justify-content: center !important;
    }
    .footer__content{
        padding-right: 0 !important;
        text-align: center !important;
    }

    .slider-caption{
        align-items: center !important;
    }
    .footer__info-item{
        justify-content: center !important;
    }

    .footer__main-title{
        margin-bottom: 15px !important;
    }

    .slider__link a{
        padding: 0 !important;
        background-color: transparent !important;
    }

    #actu {
        min-height: 0;
    }

    .header-classique .header__wrapper {
        justify-content: center !important;
    }

    #top-bar::before {
        background: linear-gradient(45deg, rgb(189, 189, 189) 0%, rgb(189, 189, 189) 52%, rgb(220, 178, 83) 52%, rgb(220, 178, 83) 100%) !important;
    }

    .top-links {
        display: none;
    }

    #actu {
        display: flex;
        justify-content: center;
    }

    .actu__img {
        display: flex;
        justify-content: center;
        margin-top: 0.4rem;
    }

    .slider-caption::before,
    .slider-caption::after {
        display: none;
    }

    .picto-reso {
        margin-top: 15px !important;
        justify-content: center;
    }

    .header-transparent > .container > div {
        justify-content: center;
    }

    .logo img {
        width: 120px !important;
        margin: 5px 0 !important;
    }


    #slogan {
        font-size: 0.75rem !important;
    }

    .menu-button {
        bottom: 35px !important;
    }

    .post-container {
        margin-top: 0;
        padding-top: 2rem;
    }

    .post {
        margin: 1rem 0;
    }

    #actu h3::before {
        bottom: 4px;
    }

    #actu h3::after {
        bottom: -2px;
    }

    .title-footer__title {
        font-size: 38px;
        margin-bottom: 1rem;
    }

    .title-footer {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    .footer__content {
        border: 0;
        margin-right: 0;
    }

    .block-container {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    .actu__content {
        margin-left: 0;
    }

    .footer__services a{
        justify-content: center !important;
        display: flex !important;
        margin-top: 10px !important;
    }
}

@media (max-width: 768px) {
    .overlay_slide::before {
        display: none;
    }

    .article .table img {
        display: none !important;
    }

    .slider__title {
        font-size: 26px !important;
        text-align: center;
    }

    .slider__subtitle {
        font-size: 16px;
        text-align: center;
    }

    #top-bar {
        background: var(--color-dark) !important;
        color: #000 !important;
        padding: 5px;
        text-align: center;
    }

    .post-active {
        flex-direction: column;
    }

    .post__image,
    .post__content {
        width: 100%;
    }

    .post__content::after {
        display: none;
    }
}

@media (max-width: 576px) {
    #actu h3 {
        font-size: 2rem !important;
    }

    .footer-infos-societe {
        text-align: center;
    }

    .logo img {
        width: 120px !important;
        margin: 5px 0 !important;
    }

    #slogan {
        font-size: 0.75rem !important;
    }

    .picto-reso {
        position: relative;
        height: 100px;
    }

    .picto-reso a {
        margin-bottom: 10px;
    }

    .picto-link {
        justify-content: center;
        position: absolute;
        top: 45%;
    }

    .slider__title {
        font-size: 1.5rem !important;
    }

    .slider__subtitle {
        font-size: 0.8rem !important;
    }

    #slider .container {
        display: flex;
    }

    .default_title,
    h2,
    h3,
    h4 {
        font-size: 25px !important;
    }

    .float-contact-btn {
        bottom: 0;
        width: 100%;
        justify-content: center;
        flex-direction: row;
    }

    .float-contact-btn span {
        margin-bottom: 0;
        writing-mode: horizontal-tb;
        margin-left: 0.5rem;
    }

    .copyrights-container {
        margin-bottom: 10vh !important;
    }
}


.btag {
    border: unset !important;
}

.btn:focus{
box-shadow: 0 0 0 0 !important;
}

.btn.btntag {
  color: white;
}

.btn.btag {
  font-size: 0.9rem;
}

.btn.btntag:hover {
  color: white;
}