
.ads_box_container{    height: 28vh;
    width: 55.9vw;
    background: #EEE;
    border: 1px solid #CCC;
    overflow:hidden;
    }

    .ads_box_img_container {width:100%;}
    .ads_box_img_container img{
    width: 100%;
    overflow: hidden;
    object-fit: scale-down;}

    ads_header{
    grid-area: ads_header;
    /* border: 1px solid #F00; */
    height: 21.9vh;
    width: 100vw;
    position: relative;
    }

    ads_header:hover{cursor:pointer}

    ads_left{
      grid-area:ads_left;   
    /* border: 1px solid #F00; */
    height: 100vh;
    width: 22.9vw;
    position: fixed;
    left: -20px;
    top:0;

    }

    ads_left:hover{cursor:pointer}

    ads_right{
    grid-area: ads_right;
    /* border: 1px solid #F00; */
    height: 100vh;
    width: 21.9vw;
    position: fixed;
    right: 0;
    top:0;
    }

    ads_right:hover{cursor:pointer}



    .ads_product_partners{
      height: 20vh;
      width: 54vw;
      background: #EEE;
      margin-left: 1vw;
      margin-bottom: 1vh;
      margin-top: 1vh;
      border: 1px solid #d1cece;}
      .ads_product_partners_box_container{margin-top:1vh;margin-left:1vw;display:inline-flex;}
      .ads_product_banner_box_container{height:16vh;display:inline-flex}
      .ads_product_banner_box_container:hover{cursor:pointer;}
      .ads_product_banner_item{height: 15vh;width: 9vw;}
      .ads_product_banner_item img{height:100%}
     
    body {
      font-family: Arial, sans-serif;
      margin: 0;
      padding: 0;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      min-height: 100vh;
      background-color: #f4f4f4;
    }



    /* Set the background image */
    .background {
      background-image: url('https://crcdn01.adnxs-simple.com/creative20/p/10712/2025/1/7/64317166/c20dc344-442f-4316-ad10-c0b1300a0786.jpg');
      background-size: cover;
      background-position: center;
      background-attachment: fixed; /* This makes the background fixed */
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: -1; /* Keeps the background behind other content */
    }



    .header {
      display: inline-flex;
      height: 5vh;
      padding: .5vw;
      width: 55vw;
    }

    .item_product_box_container{width:8.65vw;margin-top:1vh;margin-bottom:1vh;}

    .item_category_title{
    margin-top: -3vh;
    position: relative;
    color: #FFF;}

    .item_title{
    text-align: left;
    font-size: .85rem;
    position: relative;
    height: 4vh;
    margin-top:1vh;
    margin-bottom: .15vh;
}
.item_description{
    margin-top: 1vh;
    margin-bottom: 1vh;
    font-size: 0.75rem;
    text-align: left;
    line-height: 1.5vh;
}

    


    .item_price{
    font-size: 1rem;
    position: relative;
    text-align: left;
    }


    .carousel-container {
    position: relative;
    width: 55.9vw;
    margin: 20px 0;
    overflow: hidden;
    border-radius: 8px;
    background-color: #fff;
    height: 11vh;
    }


    .carousel-container-product {
    position: relative;
    width: 55.9vw;
    margin: 20px 0;
    overflow: hidden;
    /* border: 1px solid #ddd; */
    border-radius: 8px;
    background-color: #fff;
    height: 23vh;
    }


    .carousel {
      display: flex;
      transition: transform 0.3s ease-in-out;
      flex-wrap: nowrap;
    }

    .carousel-item {
      flex: 0 0 calc(34% / 6); /* 6 items visible */
      padding: 10px;
      opacity: 0;
      visibility: hidden;
      text-align: center;
      transition: opacity 0.3s ease-in-out;
    }

    .carousel-item.active {
      opacity: 1;
      visibility: visible;
    }
    
    .carousel-item img{
    width: 8.68vw;
    border-radius: 1vh;
    height: 9vh;
    object-fit: cover;
    overflow: hidden;}

    .carousel-btn {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      background-color: rgba(0, 0, 0, 0.5);
      color: #fff;
      border: none;
      padding: 10px 15px;
      border-radius: 50%;
      cursor: pointer;
      z-index: 10;
      border:1px solid #FFF;
    }

    .carousel-btn-position-1{position:relative;margin-top:-4vh}
    .carousel-btn-position-2{position:relative;margin-top:-17vh}
    .carousel-btn-position-3{position:relative;margin-top:-17vh}


    .carousel-btn.prev {
      left: 10px;
    }

    .carousel-btn.next {
      right: 10px;
    }

    .carousel-btn:hover {
      background-color: rgba(0, 0, 0, 0.8);
    }


    .carousel_product {
      height:24vh;
      display: flex;
      transition: transform 0.3s ease-in-out;
      flex-wrap: nowrap;
    }


    

    footer {
      width: 56vw;
      background: #898f9e;
      display:inline-flex;
    }

    .item_product {
      height: 3vh;
      width: 4vw;
      background: #EEE;
      margin-left: 1vw;
      margin-right: 1vw;
    }

    main_container{
      grid-area: main_container;
      grid-template: "ads_left wrapper ads_right";
      left: 0;
      position: relative;
      display: inline-flex ;
    }
    main_slider {
      display: flex;
      width: 72vw;
    }

    main_left {
      /* width: 14vw; */
      height: 100vh;
      background: #f8f8f8;
    }

    main_right {
      width: 57vw;
    }

    popup{
      grid-area:popup;

    position: fixed;
    background: #000;
    opacity: 0.3;
    height: 100vh;
    width: 100vw;
    z-index: 99;
    top: 0;
    display:none;

    }

    popup_info{    
        grid-area: popup_info;
        height: 40vh;
        width: 50vw;
        margin-left: 1vw;
        position: fixed;
        z-index: 999999;
        background: #FFF;
        top: 20vh;
        display:none;
    }

    popup_rgpd{
      grid-area: popup_rgpd;
      height: 14vh;
      width: 44vw;
      background: #FFF;
      position: fixed;
      bottom: 2vh;
      z-index: 99999;
      display:none;
    }

    
    .small_watermark{font-family: 'Monoton', cursive;
      color: #000;
      font-size: 1em;
      margin-left: 1.75vw;
      margin-right: 2vw;
      width: 8.5vw;
      margin-top: 0.25vh;
      display: grid;}

      
    .sub_footer {
    width: 13vw;
    color:#FFF;
    margin-right: 1vw;
    }
    .sub_footer_padding{
      padding:1vh;
    }

    .sub_footer_title{
      font-weight:600;
      font-size:0.75rem;
    }


    .sub_footer_sub_title{
      font-weight:600;
      font-size:0.65rem;
    }



    copyright{
      grid-area:copyright;
      height: 16vh;
      width: 56vw;
      background: #687282;
      display:inline-flex;
      margin-bottom:1vh;

    }

    .watermark{font-family: 'Monoton', cursive;
      color: #000;
      font-size: 1.8em;
      margin-left: 1.75vw;
      margin-right: 2vw;
      width: 8.5vw;
      margin-top: 0.25vh;
      display: grid;}

    wrapper{
      grid-area:wrapper;
      width:55.95vw;
      background:#FFF;
      grid-template-areas:
      "header"
      "main_slider"
      "footer";
    } 