/*  ------  reset   ------  */

#main:not(.main-homepage) {padding-top: 0px; }
.breadcrumb {display: none !important; }
#wrapper { max-width: 100%; }

@media (max-width: 640px) { 
    .offerbumper-loader { display: none !important;}
}

i-footer footer { margin-top: 0px; }
.footer-wrapper { position: relative; }

.eco__page .producttile-loader { width: 100%; }
.eco__page .product-tile { margin-right: 0; margin-left: 0; max-width: unset; border:none; }
.eco__page .product-tile .product-image img { display:block; }
.eco__page .product-tile .product-tile__variations img { width: unset; }
.eco__page .product-tile__desc--initial { align-items:flex-start; }
.eco__page .product-tile__swatch-text { padding-left: 7px; }



/*  ------  fonts   ------  */

@font-face {
  font-family: "Gotham_Light";
  src: url("../fonts/GothamLight.woff2") format("woff2"),
  url("../fonts/GothamLight.woff") format("woff"),
  url("../fonts/GothamLight.ttf") format("truetype");
}

@font-face {
  font-family: "Gotham_ExtraLight";
  src: url("../fonts/GothamExtraLight.woff2") format("woff2"),
  url("../fonts/GothamExtraLight.woff") format("woff"),
  url("../fonts/GothamExtraLight.ttf") format("truetype");
}


/*  ------  variables   ------  */

.eco__page { 
    --CLARINS-FONT: ClarinsRegular, Clarins;
    --GOTHAM-EXTRALIGHT: "Gotham_ExtraLight";
    --GOTHAM-LIGHT: "Gotham_Light";
    --GOTHAM-BOOK: "Gotham SSm book A", "Gotham SSm book B", "Gotham Book",Helvetica, Arial, sans-serif;
    --GOTHAM-MEDIUM: "Gotham SSm medium A", "Gotham SSm medium B", "Gotham Medium",Helvetica, Arial, sans-serif;
    --COLOR-DEFAULT:#333333;
    --COLOR-RED-A:#b40024;
    --COLOR-RED-B:#8c0b26;
    --RADIUS:5px; 
    --mainOffset: 60px;
}


@media (min-width: 769px) { 
    .eco__page {   
     --mainOffset: 147px;
 }
}

/*  ------  page   ------  */

.eco__page {font-family: var(--GOTHAM-BOOK);font-weight: normal; color: var(--COLOR-DEFAULT); position: relative;width: 100%; }

.eco__page * {box-sizing: border-box; }

.eco__page h1,
.eco__page h2,
.eco__page h3,
.eco__page h4 {margin: 0;padding: 0;font-weight: normal; }

.eco__page h1,
.eco__page h2 {  font-family: var(--GOTHAM-MEDIUM);}

.eco__page p {margin: 0;padding: 0; }

.eco__page strong {  font-family: var(--GOTHAM-MEDIUM);}

.eco__page picture {display: block; }

.eco__page img {width: 100%;display: block; }

.eco__page a {color: #333;text-decoration: none; }
.eco__page sup { /* position: relative; line-height: 0; top:-0.6em; vertical-align: baseline; font-size: 0.7em; */
    position: unset; vertical-align: super; line-height: 1em; font-size: 0.55em; }

    .eco__page .eco__suptitle { font-size: 14px;line-height: 1.2em; }
    .eco__page .eco__title { font-size: 30px;line-height: 1.2em; font-family: var(--GOTHAM-MEDIUM); color: var(--COLOR-RED-A); }
    .eco__page .eco__subtitle { font-size: 18px; line-height: 1.2em;}
    .eco__page .eco__text { font-size: 16px; line-height: 1.45em; }
    .eco__page .eco__text .eco__nowrap { white-space: nowrap; }

    .eco__page .eco__text-color { color: var(--COLOR-RED-A); }

    .eco__page .eco__price {font-size: 16px;line-height: 20px; }

    .eco__page .eco__cta {  }
    .eco__page .eco__cta-btn {cursor: pointer; display: inline-flex;min-width: 120px;height: auto;padding: 14px 17px; font-size: 14px;line-height: 1em;text-align: center;text-decoration: none;letter-spacing: 0;color: #fff;background-color: var(--COLOR-RED-A);border: 2px solid var(--COLOR-RED-A);border-radius: 5px;font-family: var(--GOTHAM-MEDIUM, Helvetica, Arial);font-weight: 500; position: relative; top:0; left:0; align-items: center;justify-content: center;}
    .eco__page .eco__cta-text {color: #fff; white-space: nowrap; }

    .eco__page .eco__cta-white {color: var(--COLOR-DEFAULT); background: #fff;  border: 1px solid #B0A9A5; transition:all 0.3s; }
    .eco__page .eco__cta-white .eco__cta-text {color: var(--COLOR-DEFAULT); white-space: nowrap; }

    .eco__page a.eco__link { cursor: pointer; color: var(--COLOR-DEFAULT); text-decoration: underline; font-family: var(--GOTHAM-MEDIUM); font-size: 11px; line-height: 1.42em; letter-spacing: 0.02em;  text-transform: uppercase; }
    .eco__page .eco__link-text {color: var(--COLOR-DEFAULT);}

    .eco__page a.eco__link.eco__white { color: #fff; }
    .eco__page .eco__link.eco__white .eco__link-text {color: #fff;}

    .eco__page .eco__quickshop { display: none; }
    .eco__page .eco__addtobag  { display: none; }

/*
.eco__page .eco__bkgd { position:fixed; top:0; left:0; width:100%; height:100vh; background: url(../common/bkgd.jpg) top left no-repeat; background-position:50% 0; background-size:cover; }
*/
    .eco__page .eco__nowrap { white-space: nowrap; }
    .eco__page .eco__uppercase { text-transform: uppercase; }
    .eco__page a.eco__underline { text-decoration:underline; }

    .eco__page .eco__decor { position: absolute; pointer-events:none; }
    .eco__page .eco__decor img { width: 100%; display: block; }

    .eco__page .eco__group { position: relative; }

    .eco__page .eco__gradient { background: linear-gradient(90.89deg, #D3A484 20.92%, #994A23 83.28%);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        -moz-background-clip: text;
        -moz-text-fill-color: transparent } 

        .eco__page .eco__btn-more { cursor: pointer; display: inline-flex; align-items:center; }
        .eco__page .eco__btn-more svg,
        .eco__page .eco__btn-more img { width: 34px; display: block; }

        .eco__page .eco__btn-more-text { font-size: 11px; line-height: 1.2em; font-family: var(--GOTHAM-MEDIUM); text-transform: uppercase; padding-left: 5px; text-decoration: underline; }

        .eco__page .eco__btn-more-plus {  transform: scale(1); transition:transform 0.4s; transform-origin:50% 50%; }
        .eco__page .eco__btn-more-circle {  transform: rotate(0);  transition:transform 0.4s;  transform-origin:50% 50%; }

/*
.eco__page .eco__cta a.eco__disabled { background-color: #cfcac9; border-color:#cfcac9; cursor: default; }
*/


        .eco__page .eco__only-mobile { display: none; }
        .eco__page .eco__only-desktop { display: none; }

        .eco__page .eco__padding-bottom-24 { padding-bottom: 24px; }

        @media (max-width: 768px) { 

            .eco__page .eco__only-mobile { display: block; }

            .eco__page a.eco__link.eco__white-only-mobile { color: #fff; }
            .eco__page .eco__link.eco__white-only-mobile .eco__link-text {color: #fff;}


        }


        @media (min-width: 769px) { 

            .eco__page .eco__page { overflow: hidden;}

            .eco__page .eco__only-desktop { display: block; }

            .eco__page .eco__suptitle { font-size: 16px;line-height: 1.2em; }
            .eco__page .eco__title { font-size: 50px; line-height: 1.2em; }
            .eco__page .eco__subtitle { font-size: 24px; line-height: 1.45em; }
            .eco__page .eco__text { font-size: 14px; line-height: 1.45em; }

            .eco__page .eco__quickview-btn.eco__only-desktop { display: inline-block; }
            .eco__page .eco__cta-btn.eco__only-desktop { display: inline-flex; }

            .eco__page .eco__cta-btn:hover { color: #fff; outline: 0 !important;  background-color: var(--COLOR-RED-B);  border-color: var(--COLOR-RED-B); }
            .eco__page .eco__cta-white:hover { color: var(--COLOR-DEFAULT);  border: 1px solid #797674; background: #fff;  box-shadow: 0px 0px 7px 0px #00000026; }

            .eco__page a.eco__link:hover { color: var(--COLOR-DEFAULT); text-decoration: none; }
            .eco__page a.eco__link:hover .eco__link-text {  color: var(--COLOR-DEFAULT); }

            .eco__page a.eco__link.eco__white:hover { color: #fff; }
            .eco__page a.eco__link.eco__white:hover .eco__link-text {  color: #fff; }

            .eco__page a.eco__underline:hover { text-decoration: none; }

            .eco__page .eco__btn-more:hover .eco__btn-more-plus {  transform: scale(0.8); }
            .eco__page .eco__btn-more:hover .eco__btn-more-circle {  transform: rotate(45deg); }
            .eco__page .eco__btn-more:hover .eco__btn-more-text { text-decoration: none; }

        }


/*   bloc    */

.eco__page .eco__bloc { position: relative; }

@media (min-width: 768px) { 

    .eco__page .eco__bloc {}

}


/*   header    */

.eco__page .eco__bloc-header { position: relative; padding: 0; /*! height:2000px; */ /*! padding-top: 1000px; */  }

.eco__page .eco__header { --ratioHeaderWidth: 1px; /*! position: fixed; */ /*! top:var(--mainOffset); */ left:0; width: 100%; /*! height: calc(100vh - var(--mainOffset)); */ opacity: 1; transition:opacity 0.3s ease-out; padding-top: 270px;padding-bottom: 300px;}
.eco__page .eco__header.eco__hidden { opacity: 0; }

.eco__page .eco__header-body { position: relative; top:0; left:0; width: 100%; height: 100%; display: flex;flex-direction: column;justify-content: center;}
.eco__page .eco__header-content {position: relative; top:0; left:0; }

.eco__page .eco__header-title {text-align: center; text-transform: uppercase; }
.eco__page .eco__header-title-1 { font-size: calc(54 * var(--ratioHeaderWidth));line-height: 1.3em;  letter-spacing:-0.04em; display: block; }
.eco__page .eco__header-title-2 {font-size: calc(32 * var(--ratioHeaderWidth));line-height: 1.3em;   letter-spacing:-0.04em; display: block; max-width: calc(300 * var(--ratioHeaderWidth)); ; margin: 0 auto; }

@media (min-width: 769px) { 

    .eco__page .eco__bloc-header { height:1680px; padding-top: 1000px; }

    .eco__page .eco__header {  --ratioHeaderWidth: calc(100vw / 1264); height: calc(100vh - var(--mainOffset));  position: fixed; top:var(--mainOffset);  padding-top: 0; padding-bottom: 0; }

    .eco__page .eco__header-title-1 {font-size: calc(120 * var(--ratioHeaderWidth)); letter-spacing:-0.04em; line-height: 1.3em; }
    .eco__page .eco__header-title-2 {font-size: calc(60 * var(--ratioHeaderWidth)); letter-spacing:-0.04em; line-height: 1.3em; max-width: calc(825 * var(--ratioHeaderWidth)); margin: 0 auto; }

}

@media (min-width: 1264px) { 

    .eco__page .eco__header { --ratioHeaderWidth: 1px;   }

}




/*   navigation    */

.eco__page .eco__bloc-navigation { padding: 0; z-index: 15; }

.eco__page .eco__navigation { position: fixed; left:50%; bottom:15px; z-index: 10; transform: translate(-50%, 100px); }
.eco__page .eco__navigation.eco__stacked { transform: translate(-50%, 0); }
.eco__page .eco__navigation.eco__initialised { transition:transform 0.4s ease-out; }

.eco__page .eco__navigation-inside { text-align: center; background: #000; border-radius: 32px; }
.eco__page .eco__navigation-content { position: relative; left: 0; top:0; height:64px; display: flex; justify-content:space-between; align-items:center; }

.eco__page .eco__navigation-handler .eco__cta { padding: 0 10px; }
.eco__page .eco__navigation-content .eco__cta { padding: 0 12px 0 90px; }
.eco__page .eco__navigation .eco__cta-btn { border-radius: 22px; }

.eco__page .eco__navigation-items { display:inline-flex; flex-direction:column; list-style: none;  margin:0; padding: 0; }
.eco__page .eco__navigation-item { list-style: none; text-align: center; position: relative; top:0; left:0; }
.eco__page .eco__navigation-item-inside { position: relative; top:0; left:0; padding: 0 15px; display: flex; align-items:center; }
.eco__page .eco__navigation-item-inside::before { content: ""; background: #000; border-radius: 22px; width:100%; height: 44px; position: absolute; top:calc( 50% - 22px ); left:0; display: block; transition:background 0.3s; }
.eco__page .eco__navigation-item[data-active="1"] .eco__navigation-item-inside::before { background:#333; }
.eco__page .eco__navigation-item-text { color: #fff;  font-size: 13px; line-height: 1.2em;  text-transform: uppercase; position: relative; top:0; left:0; display: block; white-space: nowrap; }

.eco__page .eco__navigation-item-picto { width: 20px; display: inline-block; position: relative; top:0; left:0; margin-right: 12px; }

.eco__page .eco__navigation .button--primary { border-radius: 23px; }

@media (min-width: 769px) { 

    .eco__page .eco__navigation-handler { display: none !important; }
    .eco__page .eco__navigation-content { border-radius: 32px; height: 64px; }
    .eco__page .eco__navigation-items { display:inline-flex; flex-direction:row; justify-content:center; align-items:center; }
    .eco__page .eco__navigation-item:nth-child(1) { padding-left: 15px; }
    .eco__page .eco__navigation-item:nth-child(3) { padding-right: 15px; }
    .eco__page .eco__navigation-item:last-child { padding-right: 15px; padding-left: 15px; border-left: solid 1px #fff; }
    .eco__page .eco__navigation-item-inside { cursor: pointer; }

}

@media (max-width: 768px) { 

    .eco__page .eco__navigation { width: calc(100% - 36px); margin: 0 auto; bottom: 10px; }

    .eco__page .eco__navigation-handler { height: 64px; display:flex; justify-content:space-between; align-items:center; position: relative; top:0; left:0; cursor: pointer; margin: 0; padding: 0; }
    .eco__page .eco__navigation-handler-click { position: absolute; top:0; left:0; width: 100%; height:100%; display: block; cursor:pointer; }
    .eco__page .eco__navigation-handler-left { pointer-events:none; text-align:left; width: calc(100% - 140px); overflow: hidden; position: relative; top:0; left:0; }
    .eco__page .eco__navigation-handler-left::after { content: ""; background:linear-gradient(90deg, rgba(0,0,0,0) 0%,  rgba(0,0,0,1) 100%) ;height: 100%; width:20px; position: absolute; right:0px; top:0; display: block; }
    .eco__page .eco__navigation-handler-right { position: relative; top:0; left:0; }

    .eco__page .eco__navigation-handler-text { color: #fff;  font-size: 13px; line-height: 1.2em;  text-transform: uppercase; user-select:none; position: relative; left:0; top:0; padding-left: 44px;  pointer-events:none; white-space: nowrap; }
    .eco__page .eco__navigation .eco__navigation-handler-text::before { content: ""; background: url(../common/arrow-down-white-icon.svg) left top no-repeat; background-size:100% auto; height: 20px; width:20px; position: absolute; left:18px; top:calc(50% - 12px); display: block; }
    .eco__page .eco__navigation.eco__opened .eco__navigation-handler-text::before { background: url(../common/close-white.svg); height: 15px; width:15px;  top:calc(50% - 8px);  left:20px;  }

    .eco__page .eco__navigation-content { width: 100%; height:unset; max-height: 0px; overflow: hidden; transition:max-height 0.3s; }
    .eco__page .eco__navigation.eco__opened .eco__navigation-content { max-height: 300px; }

    .eco__page .eco__navigation-content .eco__navigation-cta { display: none; }

    .eco__page .eco__navigation-items { width: 100%; flex-direction:column; align-items:flex-start; padding: 10px 0; }
    .eco__page .eco__navigation-item { margin: 0 15px 8px 15px; width: calc(100% - 30px); text-align: left; }
    .eco__page .eco__navigation-item:last-child::before { content:""; background:#fff; position:relative; margin:0 15px; width:calc(100% - 30px); height:1px; display: block; margin-bottom: 8px;}

    .eco__page .eco__navigation-item-inside { min-height: 44px; }
    .eco__page .eco__navigation-item-inside:hover::before { background:#333; }

}



/*  hero */

.eco__page .eco__hero { --ratioHero: calc(100vw/375); position: relative; top:0; left:0; width: 100%; }

.eco__page .eco__hero-inside { position: relative; top:0; left:0; width: 100%; display: flex; align-items:center; justify-content:center; overflow: hidden;  }

.eco__page .eco__hero-media { position: relative; top:0; left:0; width: 100%; overflow: hidden; height:100%; margin: 0 auto; position: relative; }
.eco__page .eco__hero-picture { width: 100%; height: 100%; }
.eco__page .eco__hero-img { width: 100%; height: 100%; object-fit: cover;}

.eco__page .eco__hero-media-inside { width: 100%; height: 100%; }

.eco__page .eco__hero-body { position: absolute; top:calc(365 * var(--ratioHero)); left:0; width:100%; height:100%; display: flex; flex-direction:row; justify-content:center; align-items:flex-start; }
.eco__page .eco__hero-content { text-align: center; width: 92%;}

.eco__page .eco__hero-title { font-size: calc(40 * var(--ratioHero)); line-height: 1.2em; padding-bottom: 24px; color: var(--COLOR-DEFAULT); }
.eco__page .eco__hero-text { font-size: calc(16 * var(--ratioHero)); line-height: 1.35em; }

.eco__page .eco__hero-bottom { width: 92%; max-width: 1048px; margin: 0 auto; text-align: center;  padding-top:40px; }
.eco__page .eco__hero-bottom-subtitle { font-size: 20px; line-height: 1.45em; font-family:var(--GOTHAM-MEDIUM); padding-bottom: 40px; }
.eco__page .eco__hero-bottom-text { font-size: 16px; line-height: 1.45em; }


@media (min-width: 769px) { 

.eco__page .eco__hero { --ratioHero: 1px; }
.eco__page .eco__hero-inside { height: 536px; }

    .eco__page .eco__hero-body { top:0; left:50%; width:50%; justify-content:flex-start; align-items:center; }

    .eco__page .eco__hero-content { text-align: left; width: 100%; max-width: 598px; }
    .eco__page .eco__hero-title { font-size: 60px; line-height: 1.2em; padding-bottom: 24px; }
    .eco__page .eco__hero-text { font-size: 24px; line-height: 1.45em;  }

    .eco__page .eco__hero-bottom { padding-top:72px; }
    .eco__page .eco__hero-bottom-subtitle { font-size: 24px; line-height: 1.45em; padding-bottom: 32px; }
    .eco__page .eco__hero-bottom-text { font-size: 20px; line-height: 1.45em; }


}




/*  reduce */

.eco__page .eco__reduce { position: relative; top:0; left:0; width: 92%; max-width:1264px; margin:0 auto; padding-bottom:40px; }

.eco__page .eco__reduce-inside { text-align:center; width: 100%; }

.eco__page .eco__reduce-top { padding: 40px 0 32px 0; }

.eco__page .eco__reduce-bloc { position: relative; width: 100%; background: #FBF6F3; display: flex; flex-direction: column; align-items: stretch; overflow: hidden; border-radius: 8px; }

.eco__page .eco__reduce-media { width: 100%; overflow: hidden; height:100%; margin: 0 auto;  }
.eco__page .eco__reduce-picture { width: 100%;  height: 100%; }
.eco__page .eco__reduce-img { width: 100%; height: 100%; object-fit: cover;}
.eco__page .eco__reduce-overlay { display: none; }

.eco__page .eco__reduce-body { width:100%; display: flex; flex-direction:row; justify-content:center; align-items:flex-end; }
.eco__page .eco__reduce-content { text-align: left; width: 92%; padding-top:40px; }

.eco__page .eco__reduce-title { padding-bottom: 24px; }
.eco__page .eco__reduce-text { font-size: 16px; line-height: 1.45em; }

.eco__page .eco__reduce-item { padding-bottom:40px; display: flex; flex-direction: row; }

.eco__page .eco__reduce-item-number { font-size: 48px; line-height: 1em; font-family: var(--GOTHAM-MEDIUM); display:flex; align-items:flex-start; }
.eco__page .eco__reduce-item-glyph { font-size: 0.5em; line-height: 1em; }

.eco__page .eco__reduce-item-text { font-size:14px; line-height:1.45em; padding-left:12px; }
    .eco__page .eco__reduce-item[data-item="3"] .eco__reduce-item-text-percent { display: none; }


@media (max-width: 768px) { 



}


@media (min-width: 769px) { 

    .eco__page .eco__reduce { padding-bottom:80px; }

    .eco__page .eco__reduce-top { max-width: 832px; margin: 0 auto; padding: 80px 0 40px 0; }
    .eco__page .eco__reduce-title { padding-bottom: 24px; }
    .eco__page .eco__reduce-text { font-size: 16px; line-height: 1.45em; }

    .eco__page .eco__reduce-bloc { flex-direction: row; align-items: stretch; justify-content: space-between; }

    .eco__page .eco__reduce-media { width:calc(50% - 16px); margin:0; }

    .eco__page .eco__reduce-body { width:calc(50% - 16px); flex-direction:row; justify-content:center; align-items:center; }

    .eco__page .eco__reduce-content { text-align: left; width: 100%; padding:24px 40px; }

    .eco__page .eco__reduce-item { }
    .eco__page .eco__reduce-item:last-child { padding-bottom:0px; }

    .eco__page .eco__reduce-item-text { padding-left:8px; }

}



/*  reuse */

.eco__page .eco__reuse { position: relative; top:0; left:0; width: 100%; }

.eco__page .eco__reuse-inside { text-align:center; width: 100%; background:#FBF6F3; overflow: hidden; }
.eco__page .eco__reuse-top { width: 92%; margin: 0 auto; padding: 40px 0 32px 0; }
.eco__page .eco__reuse-bottom { width: 92%; margin: 0 auto; padding:32px 0 40px 0; }

.eco__page .eco__reuse-title { padding-bottom: 24px; }
.eco__page .eco__reuse-text { font-size: 16px; line-height: 1.45em; }

.eco__page .eco__reuse-slider { position: relative; width: 92%; margin: 0 auto; }

.eco__page .eco__reuse-slide { display: flex; flex-direction: column; }

.eco__page .eco__reuse-slide-media { width: 100%; }
.eco__page .eco__reuse-slide-picture { width: 100%; height: 100%; }
.eco__page .eco__reuse-slide-img { width: 100%; height: 100%; object-fit: cover; }
.eco__page .eco__reuse-slide-overlay { display: none; }

.eco__page .eco__reuse-slide-body { width:100%; display: flex; flex-direction:row; justify-content:center; align-items:flex-start; }
.eco__page .eco__reuse-slide-content { text-align: left; }
.eco__page .eco__reuse-slide-title { font-size: 20px; line-height: 1.45em; padding-bottom: 12px; }

.eco__page .eco__reuse-bottom-text {  font-family: var(--GOTHAM-MEDIUM); }

.eco__page .eco__reuse-bottom-cta { padding-top: 32px; }

@media (max-width: 768px) { 

    .eco__page .eco__reuse-slide { width:70%; }
    .eco__page .eco__reuse-slide-media { border-radius: 8px; overflow: hidden; }
    .eco__page .eco__reuse-slide-content { padding-top: 16px; }
}



@media (min-width: 769px) { 

 .eco__page .eco__reuse-top { max-width: 832px; padding: 80px 0 40px 0; }
 .eco__page .eco__reuse-bottom {  max-width: 1048px; padding:32px 0 80px 0; }

 .eco__page .eco__reuse-title { padding-bottom: 24px; }
 .eco__page .eco__reuse-text { font-size: 16px; line-height: 1.45em; }

 .eco__page .eco__reuse-slider { max-width: 1264px; }

 .eco__page .eco__reuse-slide { background: #fff; display: flex; flex-direction: row-reverse; justify-content: space-between; width: unset; border-radius: 8px; overflow: hidden; }

 .eco__page .eco__reuse-slide-media { width:calc(50% - 20px); }
 .eco__page .eco__reuse-slide-body { width:calc(50% + 20px); justify-content:center; align-items:center; }
 .eco__page .eco__reuse-slide-content { width:92%; max-width:508px; }
 .eco__page .eco__reuse-slide-title { font-size: 30px; line-height: 1.2em; padding-bottom: 24px; }

 .eco__page .eco__reuse-slider .swiper-control { margin-top: 32px; }

 .eco__page .eco__reuse-bottom-text { font-size: 20px; line-height: 1.45em; }


}


/*  recycle */

.eco__page .eco__recycle { position: relative; top:0; left:0; width: 92%; max-width:1264px; margin: 0 auto; padding-top:40px; padding-bottom: 40px; }

.eco__page .eco__recycle-bloc { position: relative; width: 100%; display: flex; flex-direction: column; }

.eco__page .eco__recycle-body { width:100%; display: flex; flex-direction:row; justify-content:flex-start; }
.eco__page .eco__recycle-content { text-align: center;  }

.eco__page .eco__recycle-title { padding-bottom: 24px; }
.eco__page .eco__recycle-text { font-size: 16px; line-height: 1.45em; }

.eco__page .eco__recycle-item { padding-top:24px; text-align: left; }
.eco__page .eco__recycle-item-category { font-size: 16px; line-height: 1.45em; text-transform:uppercase; color:var(--COLOR-RED-A); font-family: var(--GOTHAM-MEDIUM); }
.eco__page .eco__recycle-item-category::after { content: ""; background:var(--COLOR-RED-A); width: 32px; height: 2px; display: block; margin-bottom: 12px; }
.eco__page .eco__recycle-item-number { font-size: 35px; line-height: 1em; font-family: var(--GOTHAM-MEDIUM); }
.eco__page .eco__recycle-item-text { padding-bottom: 4px;}

.eco__page .eco__recycle-cta { padding-top: 24px; }

.eco__page .eco__recycle-film { position: relative; left:0; top:0; width: 100%; }

.eco__page .eco__recycle-film-video { position: relative; left:0; top:0; width: 100%; overflow: hidden; border-radius:8px; }
.eco__page .eco__recycle-film-picture { width: 100%; }
.eco__page .eco__recycle-film-img {width: 100%;display: block; }
.eco__page .eco__recycle-film-play {position: absolute;top: calc(50% - 27px);left: calc(50% - 27px);width: 54px;height: 54px; display: block;margin: 0 auto;}



@media (max-width: 768px) { 

    .eco__page .eco__recycle-media { display: none; }
    .eco__page .eco__recycle-picture { overflow: hidden; border-radius:8px; margin-top:32px; }

}


@media (min-width: 769px) { 

    .eco__page .eco__recycle { padding-top:100px; padding-bottom:100px; }

    .eco__page .eco__recycle-bloc { flex-direction: row; align-items: stretch; justify-content: space-between; }

    .eco__page .eco__recycle-media { width:calc(50% - 16px); }
    .eco__page .eco__recycle-picture { width: 100%;  height: 100%; }

    .eco__page .eco__recycle-body { width:calc(50% - 16px); justify-content:flex-start; align-items:center; }


    .eco__page .eco__recycle-content { text-align: left; width: 100%; }
    .eco__page .eco__recycle-title { padding-bottom: 24px;  }
    .eco__page .eco__recycle-text { font-size: 16px; line-height: 1.45em; }

        .eco__page .eco__recycle-content .eco__recycle-picture { display:none; }

    .eco__page .eco__recycle-item { padding-top:40px; }

    .eco__page .eco__recycle-cta { padding-top: 32px; }

}




/*  more */

.eco__page .eco__more { position: relative; top:0; left:0; width: 92%; max-width:1264px; margin: 0 auto; padding-bottom:64px; }

.eco__page .eco__more-top { text-align:center; width:92%; margin: 0 auto; }

.eco__page .eco__more-title { padding-bottom: 24px; }
.eco__page .eco__more-text { font-size: 16px; line-height: 1.45em; }

.eco__page .eco__more-item { display:flex; flex-direction:column; border-radius:8px; overflow: hidden; }
.eco__page .eco__more-item:nth-child(1) { background:#FDFAF8; flex-direction:column-reverse; margin-top:24px; }
.eco__page .eco__more-item:nth-child(2) { border:solid 1px #E9E3DE; margin-top:40px; }

.eco__page .eco__more-item-media { width: 100%; }
.eco__page .eco__more-item-picture { width: 100%; height: 100%; }
.eco__page .eco__more-item-img { width: 100%; height: 100%; object-fit: cover;}
.eco__page .eco__more-item-overlay { display: none; }

.eco__page .eco__more-item-body { width:100%; display: flex; flex-direction:row; justify-content:center; align-items:flex-end; }
.eco__page .eco__more-item-content { text-align: left; width: 92%; padding-top: 32px; }
.eco__page .eco__more-item:nth-child(1) .eco__more-item-content { text-align: center; }
.eco__page .eco__more-item:nth-child(2) .eco__more-item-content { padding-bottom:40px; }

.eco__page .eco__more-item-title { font-size: 20px; line-height: 1.45em; font-family: var(--GOTHAM-MEDIUM); padding-bottom: 8px; }
.eco__page .eco__more-item-subtitle { font-size: 16px; line-height: 1.45em; font-family: var(--GOTHAM-MEDIUM); padding-bottom: 8px; }

.eco__page .eco__more-item-cta { padding-top: 24px; }


@media (min-width: 769px) { 

    .eco__page .eco__more { padding-bottom:80px; }

    .eco__page .eco__more-top { max-width:832px; }

    .eco__page .eco__more-item { flex-direction:row; justify-content: space-between; align-items: stretch; margin-top: 64px; }
    .eco__page .eco__more-item:nth-child(1) { flex-direction:row-reverse; }

    .eco__page .eco__more-item-media { width:calc(50% - 16px); }
    
    .eco__page .eco__more-item-body { width:calc(50% - 16px); justify-content:space-around; align-items:center; }

    .eco__page .eco__more-item-content { text-align: left; width: 100%; padding-top:0; }
    .eco__page .eco__more-item:nth-child(1) .eco__more-item-content { padding-left:20%; }
    .eco__page .eco__more-item:nth-child(2) .eco__more-item-content { padding-bottom:0; }

    .eco__page .eco__more-item-title { font-size: 30px; line-height: 1.45em;  width: 92% }
    .eco__page .eco__more-item-subtitle { font-size: 22px; line-height: 1.45em; }

    .eco__page .eco__more-item-text { max-width: 92%; }

    .eco__page .eco__more-item-cta { padding-top: 32px; }

}





/*  legendes */

.eco__page .eco__bloc-legendes { padding-bottom:64px; }

.eco__page .eco__legendes { width: 92%; max-width: 1048px; margin: 0 auto; text-align: center;  }
.eco__page .eco__legende { font-size: 12px; line-height: 1.45em; display: inline-block; }


@media (min-width: 769px) { 

    .eco__page .eco__legende { display:block; }

}





/*    Slider    */




/*    Swiper    */

.eco__page .swiper-container {
 width: 100%;
 height: 100%;
 margin: 0 auto;
 position: relative;
 overflow: hidden;
 list-style: none;
 display: block;
}

.eco__page .eco__reuse-slider .swiper-container { overflow: unset; }

.eco__page .swiper-container-initialized { opacity: 1; }

.eco__page .swiper-container-no-flexbox .swiper-slide { float: left; }

.eco__page .swiper-container-vertical > .swiper-wrapper {
 -webkit-box-orient: vertical;
 -webkit-box-direction: normal;
 -webkit-flex-direction: column;
 -ms-flex-direction: column;
 flex-direction: column;
}

.eco__page .swiper-wrapper {
 position: relative;
 /* width: 100%; */
 height: 100%;
 /* z-index: 1; */
 display: -webkit-box;
 display: -webkit-flex;
 display: -ms-flexbox;
 display: flex;
 flex-wrap: nowrap;
 -webkit-transition-property: -webkit-transform;
 transition-property: -webkit-transform;
 -o-transition-property: transform;
 transition-property: transform;
 transition-property: transform,-webkit-transform;
 -webkit-box-sizing: content-box;
 box-sizing: content-box;
}
.eco__page .swiper-container-android .swiper-slide,
.eco__page .swiper-wrapper {
 -webkit-transform: translate3d(0px, 0, 0);
 transform: translate3d(0px, 0, 0);
}
.eco__page .swiper-container-multirow > .swiper-wrapper {
 -webkit-flex-wrap: wrap;
 -ms-flex-wrap: wrap;
 flex-wrap: wrap;
}
.eco__page .swiper-container-free-mode > .swiper-wrapper {
 -webkit-transition-timing-function: ease-out;
 -o-transition-timing-function: ease-out;
 transition-timing-function: ease-out;
 margin: 0 auto;
}
.eco__page .swiper-slide {
 -webkit-flex-shrink: 0;
 -ms-flex-negative: 0;
 flex-shrink: 0;
 position: relative;
 -webkit-transition-property: -webkit-transform;
 transition-property: -webkit-transform;
 -o-transition-property: transform;
 transition-property: transform;
 transition-property: transform, -webkit-transform;
}

.eco__page .swiper-slide:before,.swiper-slide:after { content: ""; display: table; }
.eco__page .swiper-slide:after { clear: both; }

.eco__page .swiper-slide-invisible-blank {
 visibility: hidden;
}
/* Auto Height */
.eco__page .swiper-container-autoheight,
.eco__page .swiper-container-autoheight .swiper-slide {
 height: auto;
}
.eco__page .swiper-container-autoheight .swiper-wrapper {
 -webkit-box-align: start;
 -webkit-align-items: flex-start;
 -ms-flex-align: start;
 align-items: flex-start;
 -webkit-transition-property: height, -webkit-transform;
 transition-property: height, -webkit-transform;
 -o-transition-property: transform, height;
 transition-property: transform, height;
 transition-property: transform, height, -webkit-transform;
}

/* IE10 Windows Phone 8 Fixes */
.eco__page .swiper-container-wp8-horizontal,
.eco__page .swiper-container-wp8-horizontal > .swiper-wrapper {
 -ms-touch-action: pan-y;
 touch-action: pan-y;
}
.eco__page .swiper-container-wp8-vertical,
.eco__page .swiper-container-wp8-vertical > .swiper-wrapper {
 -ms-touch-action: pan-x;
 touch-action: pan-x;
}

.swiper-backface-hidden .swiper-slide {
 transform:translateZ(0);
 -webkit-backface-visibility:hidden;
 backface-visibility:hidden
}

.eco__page .swiper-button {
   position: absolute;
   top: 0;
   width: 25px;
   height: 25px;
   z-index: 10;
   cursor: pointer;
}
.eco__page .swiper-button:after { content:"";  background-size: 75% auto; background-position: center; background-repeat: no-repeat; width: 100%; height: 100%; display: block; }
.eco__page .eco__game-container .swiper-button::after { }

.eco__page .swiper-button:focus {  outline: none; }

.eco__page .swiper-button-prev.swiper-button-disabled,
.eco__page .swiper-button-next.swiper-button-disabled {
   opacity: 0.4;
   cursor: auto;
   pointer-events: none;
}
.eco__page .swiper-button-prev,
.eco__page .swiper-container-rtl .swiper-button-next,
html[dir="rtl"] .swiper-button-next {
   left: -28px;
   right: auto;
   top: calc(50% - 12.5px);
}
.eco__page .swiper-button-prev::after,
.eco__page .swiper-container-rtl .swiper-button-next::after,
html[dir="rtl"] .swiper-button-next::after {
   background-image: url(../common/arrow-left-grey-icon.svg);
}
.eco__page .swiper-button-next,
.eco__page .swiper-container-rtl .swiper-button-prev,
html[dir="rtl"] .swiper-button-prev {
   right: -28px;
   left: auto;
   top: calc(50% - 12.5px);
}
.eco__page .swiper-button-next:after,
.eco__page .swiper-container-rtl .swiper-button-prev:after,
html[dir="rtl"] .swiper-button-prev:after {
  background-image: url(../common/arrow-right-grey-icon.svg);
}

.eco__page .swiper-button-lock {
   display: none;
}

.eco__page .swiper-pagination {
 position: relative; 
 top:0; 
 left:50%;
 transform:translateX(-50%);
 text-align: center;
}

.eco__page .swiper-pagination.swiper-pagination-hidden {
 opacity:0
}
.eco__page .swiper-pagination-bullet {
 width:16px;
 height:16px;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 opacity:1;
 position: relative;
}
.eco__page .swiper-pagination-bullet:after {
    content: "";
    position: relative;
    width:8px;
    height:8px;
    display:block;
    border-radius:4px;
    background:#D3CCC8;
    opacity:1
}
.eco__page button.swiper-pagination-bullet {
 border:none;
 margin:0;
 padding:0;
 box-shadow:none;
 -webkit-appearance:none;
 appearance:none
}
.eco__page .swiper-pagination-clickable .swiper-pagination-bullet {
 cursor:pointer
}
.eco__page .swiper-pagination-bullet:only-child {
 display:none!important
}
.eco__page .swiper-pagination-bullet-active:after {
 opacity:1;
 background:#333;
}

.eco__page .swiper-scrollbar {
   position:relative;
   left:0;
   height:4px;
   background:#E9E3DE;
   box-sizing:border-box;
   z-index:10;
   border-radius:2px
}
.eco__page .swiper-scrollbar span {
   width:25%;
   position:absolute;
   background:#797674;
   height:100%;
   border-radius:2px;
   top:0px;
   left:0px;
   animation:motion-scrollbar-handle 4s infinite
}
.eco__page .wrapper {
   transform:translateX(calc(320px / 2 - 160px / 2 - 16px))
}

.eco__page .swiper-notification { display: none; }

/*
.eco__page .swiper-wrapper {
    justify-content: center;
}

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

.eco__page .swiper-wrapper {
    justify-content: unset;
}
}

*/



.eco__page .swiper-control { display: flex; flex-direction:row; align-items: center; justify-content:space-between; width: 100%; }
.eco__page .swiper-control.eco__center { justify-content:center; }

.eco__page .swiper-control .swiper-pagination { left:0; transform:unset; text-align: left; }
.eco__page .swiper-buttons { display: flex; flex-direction:row; }
.eco__page .swiper-control .swiper-button { position: relative; left:0; }

.eco__page .swiper-control .swiper-pagination-bullet { transition:width 0.3s; }
.eco__page .swiper-control .swiper-pagination-bullet-active { width: 40px; }
.eco__page .swiper-control .swiper-pagination-bullet::after { transition:width 0.3s; }
.eco__page .swiper-control .swiper-pagination-bullet-active::after { width: 32px; }

.eco__page .swiper-control.eco__white .swiper-button-prev::after,
.eco__page .swiper-control.eco__white .swiper-container-rtl .swiper-button-next::after,
html[dir="rtl"] .eco__page .swiper-control.eco__white .swiper-button-next::after {
   background-image: url(../common/arrow-left-white-icon.svg);
}

.eco__page .swiper-control.eco__white .swiper-button-next:after,
.eco__page .swiper-control.eco__white .swiper-container-rtl .swiper-button-prev:after,
html[dir="rtl"] .eco__page .swiper-control.eco__white .swiper-button-prev:after {
  background-image: url(../common/arrow-right-white-icon.svg);
}


.eco__page .swiper-control.eco__white .swiper-pagination-bullet:after { background: #fff; }
.eco__page .swiper-control.eco__white .swiper-pagination-bullet-active:after { background:#fff; }
.eco__page .swiper-control.eco__charcoal .swiper-pagination-bullet:after { background: #333; }
.eco__page .swiper-control.eco__charcoal .swiper-pagination-bullet-active:after { background:#333; }




@media (max-width: 768px) { 

    .eco__page .swiper-control { margin-top: 32px; }

  /*
    .eco__page .swiper-button-prev,
    .eco__page .swiper-container-rtl .swiper-button-next,
    html[dir="rtl"] .swiper-button-next,
    .eco__page .swiper-button-next,
    .eco__page .swiper-container-rtl .swiper-button-prev,
    html[dir="rtl"] .swiper-button-prev {  display: none; }

*/
}






/*  ---   Popin   --- */
/*  ---   v0.4   --- */

.eco__bloc-popin { background: #eac27c; padding: 30px 0; text-align: center; }

.eco__page .popin__content-opener { display: none; }

.eco__page .popin__content-wrapper { --popin_height:100vh; --popin_top:180px; position: fixed; bottom:0; left:0; width: 100vw; height:0; z-index: 10000; }

@supports(height: 100dvh) {
   .eco__page .popin__content-wrapper { --popin_height:100dvh; --popin_top:90px; }
}

.eco__page .popin__content-overlay { background: #000; opacity: 0; position: absolute; top:0;left:0;  width: 100%; height: 100%; display: block; transition:opacity 0.2s ease-out;  transition-delay:0.2s;  }
.eco__page .popin__content-wrapper[data-open="1"]  .popin__content-overlay { transition-delay:0s; opacity: 0.5; }

.eco__page .popin__content { position: absolute; bottom:0;left:50%; display: flex; align-items:flex-end; justify-content:center; transform:translate(-50%, 100%); }

.eco__page .popin__content-body { background: #fff; border-radius: 8px; max-height: calc(var(--popin_height) - var(--popin_top)); text-rendering: optimizeLegibility; overflow: hidden; }
.eco__page .popin__content-content { max-height: calc(var(--popin_height) - var(--popin_top)); overflow: hidden; }
.eco__page .popin__content-wrapper[data-scrollable="1"] .popin__content-content {  overflow-x: hidden; overflow-y:scroll; -webkit-overflow-scrolling: touch; overscroll-behavior-y: contain; }

.eco__page .popin__content-closer { cursor: pointer; position: absolute; top:10px; right: 10px; z-index:1; width: 24px; height: 24px; background: transparent; }
.eco__page .popin__content-closer-white path { fill:#fff; }

.eco__page .popin__content-wrapper[data-open="1"] { height: calc( var(--popin_height) + 1px); }


.eco__page .popin__content { width:100%; max-width:1048px; transition:transform 0.25s ease-out; }
.eco__page .popin__content-wrapper[data-open="1"] .popin__content {  transform:translate(-50%, 0); top:auto; bottom:0; left:50%; }

.eco__page .popin__content-body { border-radius: 8px 8px 0 0; width: 100%; }
.eco__page .popin__content-content { width: 100%; max-height: calc(var(--popin_height) - var(--popin_top) - 40px); overflow-x: hidden; overflow-y:scroll; -webkit-overflow-scrolling: touch; overscroll-behavior-y: contain; }

.eco__page .popin__content-handler { border-bottom: solid 1px #ccc; height: 40px; position: relative; top:0; left:0; }
.eco__page .popin__content-closer-white path { fill:#000; }

.eco__page .popin__content-opener { display: inline-block; cursor: pointer; }
.eco__page .popin__content-toClone { display: none; }


@media (min-width:768px){

    .eco__page .popin__content-wrapper[data-style="center"]  .popin__content,
    .eco__page .popin__content-wrapper[data-style="center"][data-open="1"] .popin__content { transition:unset; }

    .eco__page .popin__content-wrapper[data-style="center"][data-open="1"] .popin__content { top: 50%; bottom: auto; transform:translate(-50%, -50%); }

    .eco__page .popin__content-wrapper[data-style="center"] .popin__content-body { border-radius: 8px; }
    .eco__page .popin__content-wrapper[data-style="center"] .popin__content-content { max-height: calc(var(--popin_height) - var(--popin_top)); }

    .eco__page .popin__content-wrapper[data-style="center"] .popin__content-handler { height: 0; border: unset; }
    
}