                @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');
                                    .default_title{
                                        text-align:0;
                                        color:#484848;
                                        background:;
                                        font:24px  'Open Sans', sans-serif;
                    }

                                    .without_title{
                    display:none;
                    }
                
    :root {
    --color-primary: #00d8ff;
    --color-hover: #FF2775E0;
    --color-secondary: #ff2775;
    --font-main: "Roboto", sans-serif;
    --font-title: "Poppins", sans-serif;
    --font-slider: "Lobster", cursive;
    --font-header: "Poppins", sans-serif;
    --color-link: #ff2775;
    --color-linkhover: #FF2775E0;
    --color-arbo: #11bbef;
    --color-arbo-hover: #FF2775E0;
    --color-topbar: #f7f7f7;
    --color-topbarbackground: #11bbef;
    --color-topsocial: #f7f7f7;

    --color-topsocialbackground: #ff2775;

    --color-topsocialbackground-hover: #FF2775E0;
    --header-spacing: 0 1rem;
    --color-header-link: #ffffff;
    --color-header-linkhover: #FF2775E0;
    --color-border-submenu: #11bbef;
    --color-menu-before: #11bbef;
    --size-header-logo: 140px;
    --color-stickymenu-background: #ffffff;
    --color-stickymenu-button: #003649;
    --color-stickytitle: #f7f7f7;
    --color-slogan: #000;
    --color-slider: #f7f7f7;
    --slider-titlefontsize: 5rem;
    --slider-fontweight: 500;
    --slider-subtitlefontsize: 1.2rem;
    --color-slider-link: #ff2775;
    --color-slider-linkhover: #FF2775E0;
    --color-slider-overlay: #2424244a;
    --color-contact-btn-background: #ff2775;
    --color-contact-btn: #f7f7f7;
    --color-contact-btn-hover-background: #FF2775E0;
    --color-contact-btn-hover: #fff;
    --color-rightside-background: #f7f7f7;
    --color-rightside: #ff2775;
    --color-rightside-border: #ff2775;
    --color-rightside-text: #000;
    --color-galery: #ff2775;
    --color-galery-border-color: #ff2775;
    --color-btn-galery-background: #ff2775;
    --color-gal-info: #000000;
    --color-gal-content: #f7f7f7e0;
    --color-accordion: #003649;
    --color-accordion-background: #f7f7f7;
    --color-accordion-border-color: #000000;
    --color-blocktitle: #000000;
    --color-block-content: #003649;
    --color-block-icon: #ff2775;
    --color-block-icon-background: #003649;
    --color-block_box-background: #f7f7f7;
    --color-block-border-color: #eee;
    --color-actu-title: #f7f7f7;
    --actu-title-fontsize: 4rem;
    --color-actu-filter: #00000070;
    --color-actu-text-background: transparent;
    --color-actu-link: #ff2775;
    --color-actu-link-hover: #FF2775E0;
    --color-actu-text: #f7f7f7;
    --color-actu-strong: #f7f7f7;
    --color-defaulttitle: #003649;
    --default-title-fontsize: 2.5rem;
    --color-posttitle: #000;
    --color-posttitlehover: #FF2775E0;
    --post-title-fontsize: 20px;
    --color-post-background: #f7f7f7e3;
    --color-post: #000;
    --post-link-color: #ff2775;
    --post-link-color-hover: #FF2775E0;
    --color-infotitle: #000000;
    --color-cardtitle: #ff2775;
    --color-icon: #ff2775;
    --color-icon-title: #000000;
    --icon-fontsize: 30px;
    --color-nav-button: #003649;
    --color-nav-button-hover: #FF2775E0;
    --color-nav-button-background: #2a2a2a94;
    --color-testimonial: #000;
    --testimonial-fontsize: 1.1rem;
    --testimonial-fontweight: 500;
    --testimonial-fontstyle: italic;
    --testimonial-background: #f8f8f8;
    --testimonial-activebackground: #ff2775;
    --color-footerbackground: #f8f8f883;
    --color-footerlink: #11bbef;
    --color-footerlinkhover: #FF2775E0;
    --color-footericon: #11bbef;
    --color-footer-border: #11bbef;
    --color-picto-reso: #ff2775;
    --color-picto-reso-hover: #FF2775E0;
    --picto-reso-color: #f7f7f7;
    --color-footer-primarybtn: #ff2775;
    --color-footer-primarybtn-hover: #FF2775E0;
    --color-cls-1: #f7f7f7;
    --color-cls-2: #ff2775;
    --color-copyrigtlink: #f7f7f7;
    --color-copyrigtlinkhover: #FF2775E0;
    --color-copyrightbackground: #11bbef;
    --color-btnprimary-background: #ff2775;
    --color-btnprimary-border: #ff2775;
    --color-btnprimary-color: #f7f7f7;
    --color-btnprimary-hover-background: #FF2775E0;
    --color-btnprimary-hover-border: #FF2775E0;
    --color-btnprimary-hover-color: #fff;
    --color-btnsuccess-background: #ff2775;
    --color-btnsuccess-border: #ff2775;
    --color-btnsuccess-color: #f7f7f7;
    --color-btnsuccess-hover-background: #FF2775E0;
    --color-btnsuccess-hover-border: #FF2775E0;
    --color-btnsuccess-hover-color: #fff;
    --color-btninfo-background: #ff2775;
    --color-btninfo-border: #ff2775;
    --color-btninfo-color: #f7f7f7;
    --color-btninfo-hover-background: #FF2775E0;
    --color-btninfo-hover-border: #FF2775E0;
    --color-btninfo-hover-color: #fff;
    --color-btndanger-background: #ff2775;
    --color-btndanger-border: #ff2775;
    --color-btndanger-color: #f7f7f7;
    --color-btndanger-hover-background: #FF2775E0;
    --color-btndanger-hover-border: #FF2775E0;
    --color-btndanger-hover-color: #fff;
    --color-btag-background: #ff2775;
    --color-btag-border: #ff2775;
    --color-btag-color: #fff;
    --color-btag-hover-background: #ff2775;
    --color-btag-hover-border: #FF2775E0;
    --color-btag-hover-color: #fff;
    --color-btn-outline-secondary-background: #ff2775;
    --color-btn-outline-secondary-border: #ff2775;
    --color-btn-outline-secondary-color: #ff;
    --color-btn-outline-secondary-hover-background: #FF2775E0;
    --color-btn-outline-secondary-hover-border: #FF2775E0;
    --color-btn-outline-secondary-hover-color: #fff;
}

/* ######################## CSS ######################## */

.article-box {
    position: relative;
    z-index: 10;
}

#header {
    z-index: 11;
}
a.btn.btn-outline-secondary{
    color: white !important;
}

/* ************** */

body {
    font-family: var(--font-main) !important;
}

.box-logo {
    padding: 0 1rem !important;
}

.logo img {
    width: var(--size-header-logo) !important;
    margin: 5px 0;
}

#header {
    height: 220px;
    z-index: 100;
}

#header:not(.sticky-header) .logo img {
    filter: brightness(125%);
}

#header:not(.sticky-header) .dark-logo {
    display: none;
}

#header {
    height: auto !important;
    z-index: 100 !important;
}

/* TOB BAR */
#slogan {
    color: var(--color-slogan);
    padding-right: 1rem !important;
    align-self: flex-end !important;
    justify-content: center !important;
    font-size: 0.8rem !important;
    display: flex !important;
}

#slogan-home{
    color: black !important;
    padding-right: 1rem !important;
    align-self: flex-end !important;
    justify-content: center !important;
    font-size: 0.8rem !important;
    display: flex !important;
}

#top-bar {
    background-color: var(--color-topbarbackground) !important;
    color: var(--color-topbar);
}

#top-bar .top-links ul li a {
    color: var(--color-topbar) !important;
    text-transform: uppercase !important;
    font-weight: 600 !important;
    font-size: 14px;
}

#top-bar .top-links ul li a:hover {
    color: inherit !important;
    text-transform: uppercase !important;
    font-weight: 600 !important;
    font-size: 14px;
}

#top-social ul {
    padding: 0 !important;
}

.top-links ul {
    padding: 0 1.5rem 0 0 !important;
}

.top-links ul li {
    border-left: 0 !important;
    margin: 0 0.25rem;
}

#top-social li a {
    height: 100%;
    float: none;
    min-width: 160px !important;
    color: var(--color-topsocial) !important;
    background-color: var(--color-topsocialbackground) !important;
}

#top-social li a:hover {
    color: var(--color-topsocial) !important;
    background-color: var(--color-topsocialbackground-hover) !important;
}

/* HEADER */
#primary-menu > div.container {
    display: flex;
    justify-content: center;
    align-items: center;
}

#primary-menu > ul > li > a {
    font-size: 1rem !important;
    line-height: 1em;
    text-align: center;
    letter-spacing: 0.2px;
    transition: 0.3s;
    color: black ;
    font-family: var(--font-header);
}

#primary-menu > ul > li > a i {
    position: relative;
    top: 0;
    font-size: 1.1rem;
    width: 16px;
    text-align: center;
    margin-left: 0;
    vertical-align: top;
    color: var(--color-actu-link);
}

.ts-text {
    display: none !important;
}

#primary-menu > ul > li > a::before {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -10px;
    display: block;
    height: 3px;
    width: 0;
    background: var(--color-secondary);
    transition: 0.4s;
}

#primary-menu > ul > li > a:hover::before {
    width: 100% !important;
}

#primary-menu ul {
    padding: 1.5rem;
}

#primary-menu ul ul li > a {
    font-size: 1rem !important;
    color: var(--color-submenuheader-link) !important;
}

#primary-menu ul ul li > a:hover {
    color: var(--color-submenuheader-link) !important;
}

.standard-logo{
    filter: brightness(125%) !important;
}

#primary-menu ul ul li:hover {
    padding-right: 2px !important;
    border-right: 2px solid var(--color-secondary) !important;
}

/*#primary-menu ul > li {
    margin: var(--header-spacing) !important;
}*/

#primary-menu ul > li {
    margin: 0 1rem!important;
}



#primary-menu ul ul:not(.mega-menu-column) {
    top: 33px;
}

.si-call:hover,
.si-colored.si-call {
    background: transparent !important;
}

.header-transparent > .container > div {
    justify-content: space-between;
}

#header.sticky-header #header-wrap {
    /* background: linear-gradient(45deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 55%, rgba(255, 255, 255, 1) 55%, rgba(255, 255, 255, 1) 55%); */
    background: transparent;
    box-shadow: none;
}

#header.sticky-header .box-menu {
    height: 100px;
}

#header.sticky-header #primary-menu {
    position: relative !important;
    height: 100% !important;
    background-color: var(--color-stickymenu-background) !important;
    width: 100% !important;
    justify-content: center !important;
}

#header.sticky-header #primary-menu ul li a{
    color: black !important;
}

#header.sticky-header #primary-menu::before {
    content: "";
    position: absolute;
    top: 0;
    left: -21px;
    height: 100px;
    width: 100px;
    background-color: var(--color-stickymenu-background);
    transform: skew(23deg);
    z-index: -1;
}

#header.sticky-header .box-logo {
    position: relative;
    background: var(--color-stickymenu-background) !important;
}

#header.sticky-header .box-logo::before {
    content: "";
    position: absolute;
    top: 0;
    right: -21px;
    height: 100px;
    width: 100px;
    background-color: var(--color-stickymenu-background);
    transform: skew(-23deg);
    z-index: -1;
}

/*
#header.sticky-header #primary-menu,
#header.sticky-header .box-logo {
    box-shadow: rgba(33, 35, 38, 0.1) 0px 18px 10px -10px !important;
}
*/

#header.sticky-header #primary-menu::before {
    box-shadow: rgba(33, 35, 38, 0.1) -16px 11px 10px -10px;
}

/*
#header.sticky-header .box-logo::before {
    box-shadow: rgba(33, 35, 38, 0.1) 16px 11px 10px -10px;
}
*/

#header.sticky-header #primary-menu > ul {
    background-color: initial;
    padding: initial;
    border-radius: initial;
    box-shadow: initial;
    flex: 1;
}

#header.sticky-header #primary-menu > ul > li > a {
    font-size: 1rem !important;
    line-height: 1em;
    text-align: center;
    letter-spacing: 0.2px;
    transition: 0.3s;
    font-weight: 500;
    color: var(--color-headersticky-link);
}

#header.sticky-header .menu-button {
    color: var(--color-stickymenu-button) !important;
}

#header.sticky-header #slogan, #header.sticky-header #slogan-home {
    color: var(--color-stickyslogan) !important;
    background: var(--color-stickymenu-background) !important;
    text-align: center !important;
    padding-top:3px;
    margin-bottom:0px !important;
}

/* SLIDE */
.slider-caption {
    max-width: none !important;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    width: 100%;
    left: 0;
    position: relative;
}

.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;
}

.slider__title {
    color: var(--color-slider);
    font-family: var(--font-slider);
    font-weight: var(--slider-fontweight);
    font-size: var(--slider-titlefontsize);
}

.slider__subtitle {
    color: var(--color-slider);
    font-family: var(--font-slider);
    font-size: var(--slider-subtitlefontsize);
}

.slider__link {
    margin-top: 1.5rem;
}

.slider__link a {
    background-color: var(--color-slider-link) !important;
    color: var(--color-slider) !important;
    padding: 1rem 2rem;
    letter-spacing: 0.7px;
    transition: 0.3s;
    border-radius: 10px;
}

.slider__link a:hover {
    background-color: var(--color-slider-linkhover) !important;
    color: var(--color-slider) !important;
}

.slider__link a:hover {
    background-color: var(--color-slider-linkhover) !important;
    color: var(--color-slider) !important;
}

.one-page-arrow {
    font-size: 40px !important;
}

/* TITLE */
.default_title {
    margin-top: 15px !important;
    font-size: var(--default-title-fontsize) !important;
}

.default_title,
h2,

h4 {
    font-family: var(--font-title);
    color: var(--color-primary);
    font-weight: 600 !important;
}

h3{
    color: black !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;
}

.img-footer{
    width: 20% !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_redirect a,
    .picto-reso a,
    .post__text a,
    .post__content .post_link a,
    .social 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_redirect a,
    .picto-reso a,
    .post__text a,
    .post__content .post_link a,
    .social 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;
}

.actu__content span, .actu__content span:hover{
    font-family: unset !important;
    font-weight: unset !important;
}

.actu__content span strong{
    font-weight: unset !important;
    font-family: unset !important;
}
/*
#arbo{
    padding-top: 100px !important;
}
*/

.nav_home_white .animsition-link{
    color:white !important;
}


nav ul {
    justify-content: end !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-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
}

.btag {
    background-color: var(--color-btag-background) !important;
    border-color: var(--color-btag-border) !important;
    color: var(--color-btag-color) !important;
    margin: 0.5rem;
}

.btag:hover {
    background-color: var(--color-btag-hover-background) !important;
    border-color: var(--color-btag-hover-border) !important;
    color: var(--color-btag-hover-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-rightside-border) 1px solid;
    color: var(--color-rightside);
    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-rightside) !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-rightside-border);
    color: var(--color-rightside);
    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: 30px;
    width: 30px;
    border-radius: 10px;
    border: 1px solid var(--color-rightside-border);
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

/* 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 ul{
    list-style: none;
}
*/

.article img {
    position: relative;
    box-shadow: 10px 13px 0px #00d8ff54;
    z-index: 1;
}

.article .table img {
    box-shadow: none !important;
}

/* CAROUSEL */
.container.partenaires-container {
    margin-bottom: 1.4rem;
}


.revGallery-anchor:hover .nak-gallery-poster{
    transform: unset !important;
}


/* 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;
}

.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;
    font-size: 1.5rem;
}

/* 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_redirect 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);
}

.embed-responsive-item{
    width: 100% !important;
    height: 100% !important;
}


.embed-responsive {
    height: 99% !important;
}

.embed-responsive p {
    height: 100% !important;
}


.card-img,
.card-img-top {
    height: 13em !important;
}

.card-prod {
    border-radius: 20px 20px 10px 10px !important;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px !important;
    overflow: hidden !important;
}

.card-prod > .card-title {
    font-size: 1.5rem !important;
}

.alert-info, .alert-warning{
    background-color: #00d8ff54 !important;

    border-color: #00d8ff54 !important;

    border: #00d8ff54 solid 1px;
    color: black !important;
}


.card-prod .btn-primary {
    width: 100% !important;
    border-radius: 0px !important;
}

/* ACTU */
#actu {
    margin-top: 50px;
    min-height: auto !important;
    position: relative !important;
    z-index: 0 !important;
    padding: 2rem 0 !important;
    background-attachment: fixed !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    background-position: center !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    min-height: 330px !important;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset !important;
}

#actu::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--color-actu-filter);
    z-index: -1;
}

#actu > .container {
    display: flex;
    position: relative;
    justify-content: center;
}

#actu > .row {
    align-items: center;
    justify-content: center;
}

#actu a:not(.btn-primary),
#actu a strong {
    color: var(--color-actu-link) !important;
}

#actu a:not(.btn-primary):hover,
#actu a strong:hover {
    color: var(--color-actu-link-hover) !important;
}

#actu p,
#actu li {
    color: var(--color-actu-text) !important;
}

#actu strong {
    color: var(--color-actu-strong) !important;
}

#actu img {
    width: 520px;
    border-radius: 7px;
    box-shadow: rgba(255, 254, 254, 0.12) 0px 1px 3px, rgba(83, 83, 83, 0.24) 0px 1px 2px;
}

#actu h3 {
    color: var(--color-actu-title) !important;
    font-size: 25pt !important;
}

.background col-lg-8 {
    font-weight: lighter;
}

.image-bloc{
    width: 80% !important;
}

.actu__content {
    background-color: var(--color-actu-background);
    border-radius: 12px;
    padding: 2rem;
    box-shadow: rgba(100, 100, 111, 0.2) 0 7px 29px 0;
}

/* POST */
.post-container {
    padding: 2rem 1.4rem;
}

.post {
    position: relative;
    height: 350px;
    overflow: hidden;
    margin: 0.4rem 0;
}

.post__image {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 0;
}

.post__image img {
    object-fit: cover;
    height: 100%;
    width: 100%;
}

.post__content {
    display: flex;
    justify-content: center;
    height: 100%;
    width: 100%;
    background: #00d8ffc9;
    transform: translateY(70%);
    flex-direction: column;
    transition: 0.5s;
}

.post:hover .post__text p{
    color: black !important;
}

.post:hover .post__content {
    transform: translateY(0px);
}

.nak-gallery-poster{
background-position:unset !important;
    padding-bottom:140% !important;
}


.post__title {
    font-size: 22px;
    margin-top: 2rem;
    margin-bottom: 1rem;
    font-weight: 700;
    text-align: center;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    color: var(--color-post);
}

div.post__title > a {
    color: var(--color-posttitle) !important;
}

div.post__title > a:hover {
    color: var(--color-posttitlehover) !important;
    font-weight: 700;
}

.post__text {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 1rem;
    padding-right: 1rem;
    color: var(--color-post);
    opacity: 0;
    transition: 0.5s;
    transition-delay: 0.2s;
}

.post:hover .post__text {
    opacity: 1;
}

.post__text a,
.post__text a > strong,
.post__text strong a {
    color: var(--post-link-color) !important;
}

.post__text a:hover,
.post__text a > strong:hover,
.post__text strong a:hover {
    color: var(--post-link-color-hover) !important;
}

/* BLOCK */
.block__box > div.block__title {
    color: var(--color-blocktitle) !important;
    font-weight: 600 !important;
    display: flex;
    justify-content: center;
}

.block__box {
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding: 0.4rem;
    background: #f7f7f7;
    border-radius: 12px;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    transition: 0.2s;
}

.block__box:hover {
    scale: 1.02;
}

.block-container {
    position: relative;
    z-index: 1;
}

.block-container .container-flud {
    padding: 0 2rem;
}

.block__icon {
    color: var(--color-block-icon) !important;
    font-size: 2rem;
    margin-bottom: 1rem;
    display: flex;
    justify-content: center;
}

.block__text p {
    text-align: center;
    color: rgb(0, 0, 0) !important;
}

/* ICON CONTAINER*/
.icon-container .icon__img {
    color: var(--color-icon);
    font-size: var(--icon-fontsize);
}

.icon__title {
    font-weight: 600;
}

.icon-container {
    text-align: center;
}

.icon-container > .row > div {
    height: 180px;
    justify-content: center;
    align-items: center;
    display: flex;
    flex-direction: column;
}

/* FOOTER */

.footer-info {
    background: var(--color-footerbackground);
    position: relative;
    box-shadow: rgba(17, 17, 26, 0.04) 0px -1px 0px;
}

.footer-info > .container {
    position: relative;
    z-index: 1;
}

.footer-title-col {
    text-align: center;
    margin-bottom: 1.25rem;
    color: var(--color-primary);
    font-size: 1.15rem;
}

.footer-text-col > .container {
    padding: 0 22%;
}

.footer-text-col > .container > p {
    text-align: center;
}

.footer-logo-col {
    display: flex;
    align-items: center;
    flex-direction: column;
}

.footer-social-col {
    display: flex;
    align-items: center;
    justify-content: center;
}

.content-wrap{
    margin-top: 110px !important;
}

.footer-social-col i {
    font-size: 1rem;
    margin: 0 !important;
    border: 1px solid var(--color-footer-primarybtn) !important;
    border-radius: 10px;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.footer-social-col a {
    margin: 0 10px;
}

.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-secondary);
    width: 30px;
    height: 30px;
    border-radius: 10px;
    border: var(--color-secondary) 1px solid;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.footer-logo-col img {
    width: 45% !important;
}

/* COPYRIGHTS */
#copyrights-container {
    background-color: var(--color-copyrightbackground);
}

.copyrights-container {
    padding: 10px;
}

#menu-bas a,
#kreatic_logo .block__content span,
#kreatic_logo a {
    color: var(--color-copyrigtlink) !important;
}

#menu-bas a:hover,
#kreatic_logo span:hover,
#kreatic_logo a:hover {
    color: var(--color-copyrigtlinkhover) !important;
}

.cls-1 {
    fill: var(--color-cls-1) !important;
}

.cls-2 {
    fill: var(--color-cls-2) !important;
}


/* MEDIA */
@media (min-width: 991px) {
    .post-container > .row > div {
        padding-left: 1rem !important;
        padding-right: 0 !important;
    }

}

@media (max-width: 991px) {
    #header.sticky-header .box-logo {
        background: transparent !important;
    }

    .revGallery-anchor{
        padding: 15px .4rem 0 !important;
        width: calc((100% / 2)) !important;
    }

    .img-footer{
        width: 50% !important;
    }

    .actu__content{
        margin-left: 5% !important;
    }

    .content-wrap{
        margin-top: unset !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, #slogan-home {
        font-size: 0.75rem !important;
    }

    .menu-button {
        bottom: 30px !important;
    }
}

@media (max-width: 768px) {
    .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: transparent !important;
        color: #000 !important;
    }

    .post-active {
        flex-direction: column;
    }

    .post__image,
    .post__content {
        width: 100%;
    }


    .post__content::after {
        display: none;
    }
}

@media (max-width: 576px) {
    .post__image::after {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        z-index: 1;
    }

    .copyrights-container {
        margin-bottom: 10vh !important;
    }

    #actu h3 {
        font-size: 2rem !important;
    }

    .footer-infos-societe {
        text-align: center;
    }

    /*  .logo img {
          width: 100px !important;
          margin: 5px 0 !important;
      }
  */
    #slogan, #slogan-home {
        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;
    }



    .footer-text-col > .container {
        padding: 0;
    }

    .info-col {
        margin-top: 1.25rem !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;
    }
}

