/* ------------------------ --------- ------------------------ */
/* ------------------------ --------- ------------------------ */
/* ------------------------ - BASIC - ------------------------ */
/* ------------------------ --------- ------------------------ */
/* ------------------------ --------- ------------------------ */



/* ------------------------ -------- ------------------------ */
/* -------------------- ---------------- -------------------- */
/* -------------------- COVER -- SECTION -------------------- */
/* -------------------- ---------------- -------------------- */
/* ------------------------ -------- ------------------------ */

.Collection-Cover-Section{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: 3000px;
    /* background-color: royalblue; */
    z-index: 800;
}

/* -------------------- ---------------- -------------------- */
/* -------------------- COVER --- TITLES -------------------- */
/* -------------------- ---------------- -------------------- */

.Cover-Title-Main-Container{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: var(--Cover-Title-Main-Container-Height);
    z-index: 120;
}

.Cover-Title-Container{
    /* position: fixed; */
    position: sticky;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: 100vh;
}

.Cover-Title{
    position: absolute;
    width: 100vw;
    top: 404px;
    top: var(--Cover-Title-Top);
    left: 0px;
    /* background-color: darkblue; */
    /* background-color: lightpink; */
}

/* -------------------- ---------------- -------------------- */
/* -------------------- COVER --- IMAGES -------------------- */
/* -------------------- ---------------- -------------------- */

.Cover-Container{
    position: absolute;
    top: 166px;
    top: var(--Cover-Collection-Container-Top);
    left: 50vw;
    transform: translateX(-50%);
    width: var(--Cover-Container-Width);
    height: var(--Cover-Container-Height);
    overflow: hidden;
}


.Cover-Bg-Container{
    z-index: 110;
    /* background-color: thistle; */
}

.Cover-Bijou-Container{
    z-index: 130!important;
    /* background-color: tomato; */
    /* opacity: 0; */
}

.Cover-Image{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 101%;
    height: auto;
}

/* ------------------------ -------- ------------------------ */
/* ------------------- ------------------ ------------------- */
/* ------------------- -- SECTION -- 1 -- ------------------- */
/* ------------------- ------------------ ------------------- */
/* ------------------------ -------- ------------------------ */

.Collection-First-Section{
    /* display: none; */
    position: absolute;
    left: 0px;
    top: var(--Collection-First-Section-Top);
    width: 100vw;
    z-index: 1000;
    background-color: var(--white);
}

/* -------------------- ---------------- -------------------- */
/* -------------------- INTRO -- SECTION -------------------- */
/* -------------------- ---------------- -------------------- */



.Collection-Intro-Main-Container{
    position: absolute;
    top: var(--Collection-Intro-Main-Container-Top);
    left: 0px;
    width: 100vw;
    /* background-color: maroon; */
    z-index: 1100;
}

.Collection-Intro-Container{
    position: absolute;
    top: var(--Collection-Intro-Container-Top);
    /* left: 50vw; */
    /* transform: translateX(-50%); */
    left: var(--Collection-Intro-Container-Left);
    width: var(--Collection-Intro-Container-Width);
    /* background-color: aliceblue; */
    /* background-color: orange; */
}

.Collection-Intro{
    position: absolute;
    width: 100%;
    left: 0px;
    /* background-color: midnightblue; */
    /* background-color: RED; */
    display: none;
}


.Collection-Intro-1{
    display: block;
}



/* ------------------ -------------------- ------------------ */
/* ------------------ -- INFO - SECTION -- ------------------ */
/* ------------------ -------------------- ------------------ */

.Collection-Info-Global-Container{
    position: absolute;
    left: 0px;
    width: 100vw;
    /* height: var(--Collection-Info-Global-Container-Height); */
    /* background-color: red; */
    z-index: 1200;
}

.Collection-Info-Principal-Container{
    position: absolute;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    left: 50vw;
    transform: translateX(-50%);
    width: var(--Collection-Info-Principal-Container-Width);
    /* height: var(--Collection-Info-Principal-Container-Height); */
    /* background-color: deepskyblue; */
}

.Collection-Info-Full-Container{
    position: relative;
    left: 0px;
    width: var(--Collection-Info-Full-Container-Width);
    /* height: var(--Collection-Info-Full-Container-Height); */
}


.Collection-Info-Main-Container{
    position: absolute;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    /* height: var(--Collection-Info-Main-Container-Height); */
    width: var(--Collection-Info-Main-Container-Width);
    top: 0px;
    left: 0px;
}

.Collection-Info-Container{
    position: relative;
    width: var(--Collection-Info-Container-Width);
    /* height: var(--Collection-Info-Container-Height); */
    overflow: hidden;
    /* background-color: blue; */
}

.Collection-Info-Image{
    position: absolute;
    /* width: 101%; */
    /* height: auto; */
    height: 101%;
    width: auto;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.Collection-Info-Text{
    display: none;
    position: absolute;
    width: 110%;
    left: 0px;
    /* background-color: linen; */
}

.Collection-Info-Text-11, .Collection-Info-Text-21{
    display: block;
}

/* ------------------------ -------- ------------------------ */
/* ------------------- ------------------ ------------------- */
/* ------------------- -- SECTION -- 2 -- ------------------- */
/* ------------------- ------------------ ------------------- */
/* ------------------------ -------- ------------------------ */

.Collection-Second-Section{
    position: absolute;
    left: 0px;
    top: var(--Collection-Second-Section-Top);
    width: 100vw;
    z-index: 600;
    background-color: var(--white);
    /* opacity: 0.3; */
    /* background-color: khaki; */
}

.Collection-Second-Section-Global-Container{
    position: absolute;
    left: 0px;
    width: 100vw;
    top: var(--Collection-Second-Section-Global-Container-Top);
    height: var(--Collection-Second-Section-Global-Container-Height);
}

/* ------------------- ------------------ ------------------- */
/* ------------------- SECTION 2 ACCROCHE ------------------- */
/* ------------------- ------------------ ------------------- */

.Collection-Accroche-Principal-Container{
    position: absolute;
    width: 100vw;
    left: 0px;
    top: 0px;
    /* background-color: lime; */
}

.Collection-Accroche-Full-Container{
    position: sticky;
    left: 0px;
    width: 100vw;
    height: 100vh;
    /* background-color: cornflowerblue; */
    /* opacity: 0; */
}

.Collection-Accroche-Main-Container{
    position: absolute;
    left: 0px;
    width: 100vw;
    /* height: var(--Collection-Accroche-Main-Container-Height); */
    bottom: 0px;
    background-color: var(--brown);
}


.Collection-Accroche{
    position: absolute;
    left: 40px;
    width: var(--Content-Width);
    top: var(--Collection-Accroche-Top);
    /* background-color: red; */
}



/* ------------------ -------------------- ------------------ */
/* ------------------ - SECTION 2 BANNER - ------------------ */
/* ------------------ -------------------- ------------------ */

.Collection-Banner-Principal-Container{
    position: absolute;
    left: 0px;
    width: 100vw;
    height: var(--Collection-Banner-Principal-Container-Height);
    overflow: hidden;
    /* background-color: red; */
    /* background-color: blue; */
    /* display: none; */
}

.Collection-Banner{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 101%;
    height: auto;
}

.Collection-Banner-2{
    display: none;
}


/* ------------------------ --------- ----------------------- */
/* ------------------------ - ANCRE - ----------------------- */
/* ------------------------ --------- ----------------------- */

.Ios-Prdcts-Ancre{
    position: absolute;
    left: 36px;
    /* top: var(--Ios-Prdcts-Ancre-Top); */
    /* top: var(--Product-Ultra-Container-Top); */
    bottom: -2px;
    width: 36px;
    height: 0px;
    /* background-color: red; */
    z-index: 3612000;
}


/* ------------------------ -------- ------------------------ */
/* ------------------------ -------- ------------------------ */
/* ------------------------ PRODUCTS ------------------------ */
/* ------------------------ -------- ------------------------ */
/* ------------------------ -------- ------------------------ */

.Collection-Third-Section{
    position: absolute;
    left: 0px;
    top: var(--Collection-Third-Section-Top);
    width: 100vw;
    z-index: 400;
    background-color: var(--white);
    /* background-color: mediumslateblue; */
}

.Products-Max-Container{
    position: absolute;
    top: var(--Scroll-Gap-Large);
    left: 0px;
    width: 100vw;
    /* background-color: dodgerblue; */
}
.Products-Massive-Container{
    position: sticky;
    top: 0px;
    /* background-color: gold; */
}

.Products-Ultra-Container{
    position: absolute;
    /* width: 100vw; */
    width: var(--Products-Ultra-Container-Width);
    /* height: var(--Products-Ultra-Container-Height); */
    /* height: 1180px!important; */
    /* top: 7100px; */
    top: var(--Product-Ultra-Container-Top);
    /* left: 0px; */
    left: 40px;
    /* background-color:aqua; */
    overflow-x: hidden;
    /* overflow-x: scroll; */
    z-index: 30000;
    scrollbar-width: none;
}

.Products-Ultra-Container::-webkit-scrollbar {
    display: none;
}

.Products-Global-Container{
    position: absolute;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: var(--Products-Global-Container-Width);
    top: 0px;
    left: 0px;
    /* left: 40px; */
    transition: left 0.24s ease-in;
    /* height: var(--Products-Global-Container-Height); */
    /* height: 1180px!important; */
    /* background-color:rosybrown; */
}

.Product-Principal-Container{
    position: relative;
    width: var(--Product-Principal-Container-Width);
    /* height: var(--Product-Principal-Container-Height); */
    /* height: 1180px!important; */
    top: 0px;
    /* background-color: slateblue; */
}






/* ------------------------ ------ ------------------------ */
/* ------------------------ IMAGES ------------------------ */
/* ------------------------ ------ ------------------------ */

.View-Global-Container{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 445px;
    overflow: hidden;
}

.View-Main-Container{
    position: absolute;
    /* width: 1200px; */
    /* width: 1335px; */
    width: var(--View-Main-Container-Width);
    height: 445px;
    top: 0px;
    left: 0px;
    transition: left 0.3s ease-in;
}

.View-Main-Container-0{
    visibility: hidden;
}


.View-Main-Container-2, .View-Main-Container-3, .View-Main-Container-4, .View-Main-Container-5, .View-Main-Container-6, .View-Main-Container-7, .View-Main-Container-8{
    display: none;
}

.View-Container{
    position: absolute;
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 100%;
    left: 0px;
    transition: left 0.3s ease-in;
}

.View-Container-2, .View-Container-3{
    display: none;
}

.View{
    position: relative;
    width: var(--View-Width);
    height: 100%;
    top: 0px;
    background-color: #333;
    /* background-color: red; */
}

.bague{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    width: 101%;
    height: auto;
}


/* ------------------------ -------- ------------------------ */
/* ------------------------ COMMANDS ------------------------ */
/* ------------------------ -------- ------------------------ */

/* ---------------------- COMMAND CACHE --------------------- */

.Global-Command-Cache{
    position: absolute;
    left: 0px;
    width: 100vw;
    z-index: 600;
    background-color: var(--white);
}

.Global-Command-Cache-1{
    top: 0px;
    height: 2000px;
    /* background-color: red; */
}

.Global-Command-Cache-2{
    height: var(--Glolbal-Command-Cache-2-Height);
    /* background-color: gold */
}


/* ------------------------ COMMANDS PRDCTS ----------------- */


.Products-Global-Command-Principal-Container{
    display: none;
    position: absolute;
    top: var(--Products-Global-Command-Prinicpal-Container-Top);
    left: 0px;
    width: 100vw;
}

.Products-Global-Command-Full-Container{
    position: sticky;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: 100vh;
}

.Products-Global-Command-Main-Container{
    display: none;
    /* display: none!important; */
    /* position: absolute; */
    position: fixed;
    bottom: 50px;
    height: 30px;
    /* right: 60px; */
    left: 50vw;
    transform: translateX(-50%);
    width: 70px;
    z-index: 500;
    /* background-color: red; */
}

.Products-Global-Command-Container{
    position: absolute;
    top: 0px;
    width: 30px;
    height: 30px;
    /* background-color: var(--white); */
    /* border: 1px solid var(--black); */
    box-sizing: border-box;
}

.Products-Global-Command-Container-Prev{
    left: 0px;
    /* display: none; */
}

.Products-Global-Command-Container-Next{
    right: 0px;
}

.Products-Global-Command{
    position: absolute;
    left: 0px;
    top: 0px;
    width: 30px;
    height: auto;
    /* background-color: red; */
    /* opacity: 0.2; */
}

/* .Products-Global-Command-Prev{ */
    /* right: 12px; */
/* } */

/* .Products-Global-Command-Next{ */
    /* left: 12px; */
/* } */

.Products-Global-Command-Container-Prev-1, .Products-Global-Command-Container-Next-1, .Products-Global-Command-Container-Prev-2, .Products-Global-Command-Container-Next-2, .Products-Global-Command-Container-Prev-3, .Products-Global-Command-Container-Next-3, .Products-Global-Command-Container-Prev-4, .Products-Global-Command-Container-Next-4, .Products-Global-Command-Container-Prev-5, .Products-Global-Command-Container-Next-5{
    display: none;
}

/* .Products-Global-Command-Container-Prev-1, .Products-Global-Command-Container-Next-1{
    background-color: turquoise;
}

.Products-Global-Command-Container-Prev-2, .Products-Global-Command-Container-Next-2{
    background-color: steelblue;
}
  
.Products-Global-Command-Container-Prev-3, .Products-Global-Command-Container-Next-3{
    background-color: slategray;
}

.Products-Global-Command-Container-Prev-4, .Products-Global-Command-Container-Next-4{ 
    background-color: slateblue;
}

.Products-Global-Command-Container-Prev-5, .Products-Global-Command-Container-Next-5{
    background-color: silver;
} */

/* ------------------------ COMMANDS VIEW ------------------------ */
.Command-Container{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0px;
    top: 0px;
    z-index: 500;
}

.Command{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 50px;
    height: 150px;
    /* background-color: black; */
}

.Command-1{
    left: 0px;
    display: none;
}

.Command-2{
    right: 0px;
}

.Cmd{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    width: 30px;
    height: 30px;
}

/* ------------------------ -------- ------------------------ */
/* ------------------------ CONTROLS ------------------------ */
/* ------------------------ -------- ------------------------ */

.Controls-Full-Container{
    position: absolute;
    width: 100%;
    /* height: 27px; */
    height: var(--Controls-Full-Container-Height);
    left: 0px;
    /* top: 375px; */
    top: var(--Controls-Full-Container-Top);
}

.Controls-Line{
    position: absolute;
    left: 0px;
    top: var(--Controls-Line-Top);
    height: 1px;
    width: 100%;
    background-color: var(--black);
}
/* ------------------------ CONTROLS GOLD ------------------------ */
.Controls-Gold-Container{
    position: absolute;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 390px;
    width: var(--Controls-Gold-Container-Width);
    /* height: 27px; */
    height: var(--Controls-Gold-Container-Height);
    /* background-color: cornflowerblue; */
    left: 0px;
    top: 0px;
}

.Controls-Gold-Btn{
    position: relative;
    top: 0px;
    /* height: 27px; */
    height: var(--Controls-Gold-Container-Height);
    width: 120px;
    /* box-sizing: border-box; */
    /* border: 1px var(--black) solid; */
}

/* .Gold-Btn-Text{ */
/* position: absolute; */
/* top: 50%; */
/* left: 50%; */
/* transform: translateX(-50%) translateY(-50%); */
/* background-color: aliceblue; */
/* white-space: nowrap; */
/* } */


/* ------------------------ CONTROLS PIERRE ------------------------ */
.Controls-Pierre-Main-Container{
    position: absolute;
    width: 100%;
    height: var(--Controls-Pierre-Main-Container-Height);
    top: var(--Controls-Pierre-Main-Container-Top);
    left: 0px;
}

.Controls-Pierre-Container{
    position: absolute;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
    height: var(--Controls-Pierre-Container-Height);
    /* background-color: cornflowerblue; */
}

.Controls-Pierre-Container-1{
    top: 0px;
    /* background-color: plum; */
}

.Controls-Pierre-Container-2{
    top: 44px;
    /* background-color: wheat; */
}
    

.Controls-Pierre-Btn{
    position: relative;
    top: 0px;
    /* height: 27px; */
    height: var(--Controls-Pierre-Container-Height);
    /* box-sizing: border-box; */
    /* border: 1px var(--black) solid; */
}

.Controls-Saphir-Btn{
    width: 88px;
}
.Controls-SaphirRose-Btn{
    width: 137px;
}
.Controls-Rubis-Btn{
    width: 77px;
}
.Controls-Peridot-Btn{
    width: 98px;
}
.Controls-Diamant-Btn{
    width: 105px;
}
.Controls-AigueMarine-Btn{
    width: 149px;
}
.Controls-Topaze-Btn{
    width: 91px;
}
.Controls-Mix-Btn{
    width: 55px;
}


.Controls-Mix-Btn-Signature-Pticarre, .Controls-Mix-Btn-Signature-PtiRonde{
    visibility: hidden;
}



/* ------------------------ ----- ------------------------ */
/* ------------------------ INFOS ------------------------ */
/* ------------------------ ----- ------------------------ */

.Product-Infos-Main-Container{
    position: absolute;
    width: 100%;
    left: 0px;
    /* background-color: salmon; */
    /* opacity: 0.3; */
}

.Product-Title{
    position: absolute;
    left: 0px;
    top: 0px;
}

.Product-Price{
    position: absolute;
    left: 0px;
    top: var(--Product-Price-Collection-Top);
}

.Product-Descritpion-Container{
    position: absolute;
    width: 100%;
    left: 0px;
    top: var(--Product-Description-Collection-Top);
    /* background-color: rgba(20, 240, 220, 0.3); */
}

.Product-Description-2{
    display: none;
}


/* ------------------------ ------- ------------------------ */
/* ------------------------ BUTTONS ------------------------ */
/* ------------------------ ------- ------------------------ */

.Product-Btn-Container{
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    height: 50px;
    /* box-sizing: border-box; */
    /* border: 1px var(--black) solid; */
}







/* ------------------------ -------- ------------------------ */
/* ------------------------ -------- ------------------------ */
/* ----------------------- IOS PRDCTS ----------------------- */
/* ------------------------ -------- ------------------------ */
/* ------------------------ -------- ------------------------ */

.Ios-Prdcts-Ultra-Container{
    position: absolute;
    display: none;
    width: var(--Ios-Prdcts-Ultra-Container-Width);
    height: var(--Ios-Prdcts-Ultra-Container-Height);
    left: var(--Site-Margins);
    top: var(--Product-Ultra-Container-Top);
    /* background-color: lightslategrey; */
    background-color: var(--white);
    z-index: 30000;
}

.Ios-Prdcts-Global-Container{
    position: absolute;
    left: 0px;
    width: var(--Ios-Prdcts-Global-Container-Width);
    height: var(--Ios-Prdcts-Global-Container-Height);
    /* visibility: hidden; */
}

.Ios-Prdcts-Global-Container-1{
    top: 0px;
    /* background-color: lightpink; */
}

.Ios-Prdcts-Global-Container-2{
    bottom: 0px;
    /* background-color: lightseagreen; */
}

.Ios-Prdcts-Principal-Container{
    position: absolute;
    top: 0px;
    width: var(--Ios-Prdcts-Principal-Container-Width);
    height: var(--Ios-Prdcts-Principal-Container-Height);
}

.Ios-Prdcts-Principal-Container-1, .Ios-Prdcts-Principal-Container-3{
    left: 0px;
}

.Ios-Prdcts-Principal-Container-2, .Ios-Prdcts-Principal-Container-4{
    right: 0px;
}

/* ------------------------ ------ ------------------------ */
/* ------------------------ IMAGES ------------------------ */
/* ------------------------ ------ ------------------------ */

.Ios-Prdcts-Image-Main-Container{
    position: absolute;
    top: 0px;
    left: 0px;
    width: var(--Ios-Prdcts-Image-Main-Container-Width);
    height: var(--Ios-Prdcts-Image-Main-Container-Height);
    /* background-color: red; */
    background-color: var(--green);
    overflow: hidden;
}

.Ios-Prdcts-Image{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 101%;
    height: auto;
}

/* ------------------------ ------- ------------------------ */
/* ------------------------ CONTENT ------------------------ */
/* ------------------------ ------- ------------------------ */

.Ios-Prdcts-Content-Main-Container{
    position: absolute;
    top: var(--Ios-Prdcts-Content-Main-Container-Top);
    left: 0px;
    width: var(--Ios-Prdcts-Content-Main-Container-Width);
    height: var(--Ios-Prdcts-Content-Main-Container-Height);
    /* background-color: blanchedalmond; */
}

.Ios-Prdcts-Title{
    position: absolute;
    left: 0px;
    top: var(--Ios-Prdcts-Title-Top);
    /* background-color: coral; */
}

.Ios-Prdcts-Price{
    position: absolute;
    left: 0px;
    top: var(--Ios-Prdcts-Price-Top);
    /* background-color: coral; */
}

.Ios-Prdcts-Info{
    position: absolute;
    left: 0px;
    bottom: var(--Ios-Prdcts-Info-Bottom);
    /* background-color: coral; */
}

.Ios-Prdcts-Info-12, .Ios-Prdcts-Info-22, .Ios-Prdcts-Info-32, .Ios-Prdcts-Info-42, .Ios-Prdcts-Info-13, .Ios-Prdcts-Info-23, .Ios-Prdcts-Info-33, .Ios-Prdcts-Info-43{
    display: none;
}





/* ------------------------ ------- ------------------------ */
/* ------------------------ BUTTONS ------------------------ */
/* ------------------------ ------- ------------------------ */

.Ios-Prdcts-Btn-Container{
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: var(--Ios-Prdcts-Btn-Container-Width);
    height: var(--Ios-Prdcts-Btn-Container-Height);
    z-index: 100;
}

/* ------------------------ -------- ------------------------ */
/* ------------------------ TAP ZONE ------------------------ */
/* ------------------------ -------- ------------------------ */

.Ios-Prdcts-Tap-Zone{
    /* background-color: slateblue; */
    z-index: 80;
    opacity: 0;
}


/* ------------------------ -------- ------------------------ */
/* ------------------- ------------------ ------------------- */
/* ------------------- -- SECTION -- 4 -- ------------------- */
/* ------------------- ------------------ ------------------- */
/* ------------------------ -------- ------------------------ */

.Collection-Fourth-Section{
    position: absolute;
    left: 0px;
    /* top: var(--Collection-Fourth-Section-Top); */
    width: 100vw;
    height: var(--Collection-Fourth-Section-Height);
    z-index: 600;
    background-color: paleturquoise;
    background-color: var(--white);
}



/* --------------- -------------------------- --------------- */
/* --------------- -- SECTION 4 -- QUALITY -- --------------- */
/* --------------- -------------------------- --------------- */

.Quality-Main-Container{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: var(--Quality-Main-Container-Height);
    background-color: var(--white);
    /* background-color: tomato; */
    /* display: none; */
}

.Quality-Container{
    position: absolute;
    top: var(--Quality-Container-Top);
    /* left: 50vw; */
    /* transform: translateX(-50%); */
    left: 0px;
    /* width: var(--Quality-Container-Width); */
    width: 100vw;
    height: var(--Quality-Container-Height);
    /* background-color: deeppink; */
}

.Quality{
    display: none;
    position: absolute;
    width: var(--Quality-Width);
    left: 0px;
    left: 50vw;
    transform: translateX(-50%);
    top: 0px;
    /* background-color: turquoise; */
}

.Quality-Infos-Txt-1{
    display: block;
}

/* --------------- -------------------------- --------------- */
/* --------------- -- SECTION 4 -- SUGGEST -- --------------- */
/* --------------- -------------------------- --------------- */

.Suggestions-Global-Container{
    position: absolute;
    top: var(--Suggestions-Global-Container-Top);
    left: 0px;
    width: 100vw;
    height: var(--Suggestions-Global-Container-Height);
    /* background-color: deepskyblue; */
    background-color: var(--white);
    transform: translateZ(0);
}

.Suggestions-Principal-Container{
    position: absolute;
    top: 0px;
    left: 50vw;
    /* transform: translateX(-50%); */
    transform: translateX(-50%) translateZ(0);
    width: var(--Suggestions-Principal-Container-Width);
    height: var(--Suggestions-Principal-Container-Height);
    /* background-color: khaki; */
}


/* ------------------ -- SUGGEST -- TOP -- ------------------ */
.Suggestions-Top-Container{
    position: absolute;
    top: 0px;
    left: 0px;
    width: var(--Suggestions-Top-Container-Width);
    height: var(--Suggestions-Top-Container-Height);
    /* background-color: lightblue; */
}

.Suggestions-Title{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    /* background-color: darkseagreen; */
}

.Suggestions-Title-2{
    display: none;
}

.Suggestions-Accroche{
    position: absolute;
    top: var(--Suggestions-Accroche-Top);
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    /* background-color: thistle; */
    background-color: var(--white);
}

.Suggestions-Accroche-Txt-2{
    display: none;
}

/* ------------------ -- SUGGEST - FULL -- ------------------ */

.Suggestions-Full-Container{
    position: absolute;
    top: var(--Suggestions-Full-Container-Top);
    left: 0px;
    width: var(--Suggestions-Full-Container-Width);
    height: var(--Suggestions-Full-Container-Height);
    background-color: lawngreen;
    background-color: var(--white);
    transform: translateZ(0);
}

/* ------------------ -- SUGGEST - MAIN -- ------------------ */

.Suggestions-Main-Container{
    position: absolute;
    top: 0px;
    width: var(--Suggestions-Main-Container-Width);
    height: var(--Suggestions-Main-Container-Height);
    transform: translateZ(0);
}

.Suggestions-Main-Container-1{
    left: 0px;
    /* background-color: darkblue; */
}

.Suggestions-Main-Container-2{
    right: 0px;
    /* background-color: wheat; */
}

/* ------------------ -- SUGGEST -- IMG -- ------------------ */

.Suggestions-Image-Container{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: var(--Suggestions-Image-Container-Height);
    /* background-color: rgb(120, 13, 13); */
    overflow: hidden;
}

.Suggestion-Image{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 102%;
    width: auto;
}


/* --------------- -- SUGGEST -- CONTAINER -- --------------- */

.Suggestions-Container{
    position: absolute;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    top: var(--Suggestions-Container-Top);
    left: 0px;
    width: var(--Suggestions-Container-Width);
    height: var(--Suggestions-Container-Height);
    /* background-color: lightskyblue; */
}

.Suggestions-Infos-Title{
    position: relative;
    /* background-color: thistle; */
}

.Suggestions-Infos{
    position: relative;
    display: none;
    /* background-color: aliceblue; */
}

.Suggestions-Infos-Txt-11, .Suggestions-Infos-Txt-21, .Suggestions-Infos-Txt-31{
    display: block;
}

/* ------------------ -- SUGGEST -- BTN -- ------------------ */

.Suggestions-Btn-Container{
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    /* height: 50px; */
    height: var(--Suggestions-Btn-Container-Height);
    z-index: 100;
    transform: translateZ(0);
}

/* ------------------ -- SUGGEST -- TAP -- ------------------ */

.Suggestions-Tap-Zone{
    /* position: absolute; */
    /* display: none; */
    /* width: 100%; */
    /* height: 100%; */
    /* top: 0px; */
    /* left: 0px; */
    /* background-color: slateblue; */
    z-index: 80;
    opacity: 0;
}



/* --------------- -------------------------- --------------- */
/* --------------- -- SECTION 4 -- WARNING -- --------------- */
/* --------------- -------------------------- --------------- */

.Warning-Global-Container{
    position: absolute;
    top: var(--Warning-Global-Container-Top);
    left: 0px;
    width: 100vw;
    height: var(--Warning-Global-Container-Height);
    /* background-color: darkseagreen; */
    background-color: var(--white);
}

.Warning-Principal-Container{
    position: absolute;
    top: var(--Warning-Principal-Container-Top);
    left: 50vw;
    transform: translateX(-50%);
    width: var(--Warning-Principal-Container-Width);
    height: var(--Warning-Principal-Container-Height);
    /* background-color: lightcoral; */
}

.Warning-Full-Container{
    position: absolute;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    left: 0px;
    width: 100%;
    height: var(--Warning-Full-Container-Height);
}

.Warning-Full-Container-20{
    flex-direction: column;
}

.Warning-Full-Container-0, .Warning-Full-Container-11, .Warning-Full-Container-20{
    top: 0px;
}

.Warning-Full-Container-12{
    bottom: 0px;
    /* background-color:navajowhite; */
}

.Warning-Full-Container-11, .Warning-Full-Container-12, .Warning-Full-Container-20{
    display: none;
}

.Warning-Main-Container{
    position: relative;
    top: 0px;
    width: var(--Warning-Main-Container-Width);
    height: var(--Warning-Main-Container-Height);
    /* background-color: olive; */
}

.Warning-Container{
    position: absolute;
    top: 0px;
    left: 0px;
    width: var(--Warning-Container-Width);
    height: var(--Warning-Container-Height);
    /* background-color: aquamarine; */
}

.Warning-Title{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
}

.Warning-Info{
    position: absolute;
    top: var(--Warning-Info-Top);
    left: 50%;
    transform: translateX(-50%);
    /* width: 110%; */
    width: var(--Warning-Info-Width);
    /* background-color: #aaa; */
}

.Warning-Info-12, .Warning-Info-22, .Warning-Info-32, .Warning-Info-42{
    display: none;
}

/* --------------- -------------------------- --------------- */


.Footer-Principal-Container{
    z-index: 1000;
}






/* --------------- -------------------------- --------------- */
/* --------------- -------------------------- --------------- */
/* --------------- -------------------------- --------------- */
/* --------------- -------------------------- --------------- */
/* --------------- -------------------------- --------------- */



/* .Footer-Principal-Container-Large-Dolce{ */
    /* display: none; */
/* } */