@font-face {
    font-family: Brevia;
    src: url('fonts/Brevia-Regular.otf');
}

@font-face { 
    font-family: Brevia;
    font-weight: bold;
    src: url('fonts/Brevia-Bold.otf');
}

@font-face {
    font-family: Brevia;
    font-weight: bold;
    font-style: italic;
    src: url('fonts/Brevia-Bold.otf');
}

@font-face {
    font-family: Choripan;
    font-weight: bold;
    src: url('fonts/Choripan.otf');
}

@font-face {
    font-family: GothicNext;
    src: url('fonts/Trade-Gothic-Next-LT-Pro-Cn.ttf');
}


@font-face {
    font-family: nutella;
    src: url('fonts/Nutella.otf');
}

body {
    margin: 0;
    padding: 0;
    background-color: #fff !important;
    font-family: nutella !important;
    background-image: url('images/assets/img_bg_2.png');
    background-size: cover;
    font-size: 16px;
    line-height: 1.2;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #000;
    overflow-x: hidden;
}
body::-webkit-scrollbar {
    width: 0;
    background: transparent;
}
*{
    scrollbar-width: none;
}

a           {color:blue}

.swal2-title                {font-family:Nutella!important}

/*CONTAINERS*/
.show-desktop {display: block}
.show-mobile {display:none;}

/*CONTENTS*/
.section{
    width: 100svw;
    /* overflow: hidden; */
}
/*1. Home*/
    #home           {position: relative; background-image: url('ph/Assets/img_header_bg.png');z-index: 10;background-size:cover;background-position:center;}
    .img_title      {position:relative; left: 10vw; width: 30vw; top: 12vw; }
    .img_button     {position:relative; left: 10vw; width: 15vw; top: 14vw; }


    #img_winnerlist {
        position: absolute; 
        bottom: 7vh; 
        height: 6vh; 
        left: 50%; 
        transform: translateX(-50%);
        z-index: 130;
        opacity: 1;
        cursor: pointer;
    }
    
    #img_scroll {
        position: absolute; 
        bottom: -3vh; 
        height: 6vh; 
        left: 50%; 
        transform: translateX(-50%);
        z-index: 130;
        opacity: 1;
        cursor: pointer;
        animation: bounce 1.5s infinite;
        -webkit-animation: bounce 1.5s infinite;
    }
    
    @keyframes bounce {
        0%, 100% { transform: translate(-50%, 0); }
        50% { transform: translate(-50%, -10px); }
    }

    @-webkit-keyframes bounce {
        0%, 100% { -webkit-transform: translate(-50%, 0); }
        50% { -webkit-transform: translate(-50%, -10px); }
    }

    /* Ready to win section */
    #ready_to_win {
        position: relative; 
        background-image: url('');
        z-index: 10;
        background-size: cover;
        background-position: center; 
        height: 100vh;
    }
    
    #text_readytowin {
        position: absolute;
        top: 12vh;
        width: 30svw;
        left: 65%;
        transform: translateX(-50%);
    }
    
    /* Product list */
    #listproductdesk {
        position: absolute;
        width: 80svw;
        min-height: 75svw;
        max-height: 85svw;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        object-fit: contain;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* How to enter section */
    #howtoenter {
        position: relative;
        background-color: #E20019;
        height: 76vh; 
        z-index: 10;
        background-size: cover;
        background-position: center;
    }
    
    #text_howtoenter {
        position: absolute;
        top: 10vh;
        width: 20svw;
        left: 50%;
        display: block;
        transform: translateX(-50%);
    }

    #howtoenterlistdesk {
        position: absolute;
        top: 20vh;
        width: 60svw;
        left: 50%;
        transform: translateX(-50%);
    }

    .tnctext {
        position: absolute;
        bottom: 0vh;
        left: 50%;
        transform: translateX(-50%);
    }
    
    .tnctext p {
        font-size: 13px;
        color: #fff;
        text-align: center;
        line-height: 1px;
    }    
    /* Share section */
    #share-section {
        position: relative; 
        height: auto;
        background-color: white;
    }
    
    #shareflex {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding: 20px;
        gap: 20px;
    }
    
    #shareflexwinners {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 20px;
        gap: 2px;
    }
    
    #shareflexwinners img {
        width: 15vw;
        object-fit: contain;
    }
    
    .share-text {
        color: #E20019; 
    }
    
    .share-textwinner {
        font-size: 15px;
    }

/* How to win section */
#cara_berpartisipasi {
    background-color: #F5EFDE;
    overflow: hidden;
}

#howtowin_title {
    position: absolute; 
    top: 105vh; 
    height: 15vh; 
    left: 10%; 
    z-index: 1;
    opacity: 1; 
    font-size: 8vh;
    color: #E3091D;
}

.img_line1 {
    position: relative; 
    top: 28vh; 
    width: 94%; 
    left: 0%; 
    z-index: 1;
    opacity: 1;
}

#img_step1 {
    position: absolute; 
    top: 140vh; 
    height: 35vh; 
    left: 50%; 
    transform: translateX(-50%);
    z-index: 110;
}

#img_step2 {
    position: absolute; 
    top: 115vh; 
    height: 35vh; 
    left: 80%; 
    transform: translateX(-50%);
    z-index: 110;
}

#img_step3 {
    position: absolute; 
    top: 160vh; 
    height: 35vh; 
    left: 75%; 
    transform: translateX(-50%);
    z-index: 110;
}
     
/*3. Prizes*/
    #masterclass  {background-color:#5F3C24;}
  
    .split       {position:relative; top:50vh; height:60vh; width:80vw; left:50%; transform:translate(-50%, -50%); z-index:150;display:flex;flex-direction:row;}
    .split .left {width:50%; color:#fff;}
    .split .left .title         {font-size:4vh;}
    .split .left .sub_title     {font-size:3vh;margin-top:10px;}
    .split .left .details       {display:flex;flex-direction:column;gap:10px;margin-top:20px;}
    .split .left .details .detail      {width:100%;display:flex; flex-direction:row; gap:20px; }
    .split .left .details .detail .icon      {width:40px;}
    .split .left .details .detail .icon  img       {width:80%;margin:10%;}
    .split .left .details .detail .desc      {width:75%; font-size:2.5vh; padding-top:10px; font-weight:normal; }
    .split .left .details .detail .desc  b   {font-size:3vh; }
    .split .left .details .detail .desc  a   {color:#fff;}
    
    .split .right{width:50%;overflow:hidden;}
    .split .right   img {width:100%;}

    /*4. Forms*/
    input, select, textarea {
        -webkit-box-sizing: content-box;
           -moz-box-sizing: content-box;
            -ms-box-sizing: content-box;
                box-sizing: content-box;
    }


    #form_title     {position: relative; top:2vh; height:8vh; left:50%; transform:translateX(-50%);z-index:110;opacity:1;font-size: 3vh;color:#E3091D; text-align:center;}
    .form_container {position:relative; top:5vh; min-height:70vh; width:40vw; left:50%; transform:translateX(-50%); z-index:150;display:flex;flex-direction:column;
                     background-color:#F5EFDE;border-radius:40px;border:solid 1px #E3091D;padding:20px 0px;
                    }
        .form_container .form_row       {width:100%; margin-bottom:10px; }
        .form_container .form_row.text  {padding-left:3vw; width:calc(100% - 3vw); font-size:15px;margin-bottom:1vh}
        .form_container .form_row  input[type=text],input[type=number]       { border:solid 1px #E3091D; border-radius:20px;padding:10px 20px; width:80%;margin:0px auto; display:block; font-size:2vh; }
        .form_container .form_row  input::placeholder     { color:#000;}
        .form_container .form_row  select    { border:solid 1px #E3091D; border-radius:20px;padding:8px 20px; width:80%;margin:0px auto; display:block; font-size:2vh;}
        .form_container .form_row  img       { width:calc(80% + 40px); margin:0px auto; display:block;}
        .form_container .form_row  label     { position:relative;top:-2px;cursor:pointer;}

        #uploadImg      {max-width:250px;max-height:200px;left:50%;transform:translateX(-50%);position:relative;margin:20px 0; width:unset;}

        #btn_upload, #btn_submit {cursor:pointer;}
    .footer_tnc     {position:relative; bottom:-80px; width:30vw;font-size:10px;font-weight:normal;left:50vw; transform:translateX(-50%); text-align:center}

/*5. Reynold*/
    #reynold      {background-color:#F5EFDE;}
    .split2       {position:relative; top:50vh; height:60vh; width:80vw; left:50%; transform:translate(-50%, -50%); z-index:150;display:flex;flex-direction:row;gap:40px;}
    .split2 .left     {width:40%;}  
    .split2 .left  img   {width:100%;}  
    .split2 .right    {width:60%;font-size:15px;}  
/*DONE Page*/    
    .done_container     {position:relative; top:20vh; width: 35vw; min-width:600px; height: 60vh; left:50%; transform:translateX(-50%); background-color:#F5EFDE;border:solid 1px #E3091D;border-radius:40px; }
    .done_header        {position:relative; top:60px;left:50%;transform:translateX(-50%);height:40px;}
    .done_content       {position:relative; top:90px;left:50%;transform:translateX(-50%);height:30vh; width:90%; text-align:center;}
    .done_content  img  {width:65%;margin-top:30px;}     

    
.feedback-form        { width:80%;margin:60px auto 20px; font-size:12px; height:45vh; padding:0px 50px;font-size:16px; }
.feedback-row         { width:100%; padding:8px 0px;}
.feedback-text        { width:calc(100%);padding:30px 10px;border:solid 2px black;}
.btn_send             { width:400px;margin:0px auto;position:absolute;left:0;right:0;cursor:pointer}
.btn_suggest          { cursor:pointer;}
/*QUITCLAIM Page*/

/*QUITCLAIM Done Page*/
       

/*SECTION 4*/
#listproductdesk{ display: block;}
#listproducthp{ display: none;}

    #howtoenterlistdesk{
        display: block;
    }
    #howtoenterlisthp{
        display: none;
    }

    /* thankyou  */
    .backgroundbg{
    display: none;
    }
    .homemobile{
        display: none;
    }
      .homemobilefold{
display: none;
       }
 
 @media print, screen and (max-width:40em) {
        #img_scroll {
            position: absolute;
            bottom: -3vh;
            width: 50px;
            height: 50px;
            left: calc(50% - 25px);
            z-index: 130;
            opacity: 1;
            cursor: pointer;
            animation: bounceY 1.5s infinite;
            -webkit-animation: bounceY 1.5s infinite;
        }

        @keyframes bounceY {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-10px); }
        }
        
        @-webkit-keyframes bounceY {
            0%, 100% { -webkit-transform: translateY(0); }
            50% { -webkit-transform: translateY(-10px); }
        }

    .backgroundbg{
    display: block;
    }
    .homemobile{
        display: block;
    }

    .show-desktop {display:none;}
    .show-mobile {display: block;}

       #home {
        position: relative;
        background-image: url('');
        z-index: 10;
        background-size: cover ;
        background-position: center;
        background-repeat: no-repeat;
        height: 100svh;
        width: 100svw;
    }
    .backgroundbg{
        position: absolute;
        z-index: 3;
        width: 100svw;
        background-repeat: no-repeat;
        height: 100svh;
        display: block;
        /* background-position: bottom; */
        background-size: cover;
        /* background-image: url('ph/Assets/brown\ paper.png'); */
    }
    .homemobile{
        position: absolute; z-index: 20; object-fit: cover;width: 100svw;  height: 100svh; left: 50%; transform: translateX(-50%);
    }
   
    .img_title      {position:relative;width:80vw;top:10vh;}
    .img_button     {position:relative;width:60vw;top:12vh;left:50%;transform:translateX(-50%);}

    #cara_berpartisipasi {background-color:#F5EFDE;overflow:hidden;height: 100vh!important;}
    #howtowin_title {position: absolute; top:115vh; height:15vh; left:10%; z-index:1;opacity:1; font-size: 8vw;color:#E3091D; }

    .img_line1      {position: relative; top:unset; bottom:-45vh; width:94%; left:0%; z-index:1;opacity:1;}
    #img_step1      {position: absolute; top:150vh; width:50vw; height:unset;left:25%; transform:translateX(-50%);z-index:110;}
    #img_step2      {position: absolute; top:135vh; width:50vw; height:unset;left:75%; transform:translateX(-50%);z-index:110;}
    #img_step3      {position: absolute; top:170vh; width:50vw; height:unset;left:60%; transform:translateX(-50%);z-index:110;}
     

    
    .split       {position:relative; top:66vh; height:60vh; width:96vw; left:50%; transform:translate(-50%, -50%); z-index:150;display:flex;flex-direction:column-reverse;overflow:unset; gap:20px;}
    .split .left {width:100%; color:#fff; }
    .split .left .title         {font-size:5vw;text-align:center;}
    .split .left .sub_title     {font-size:4vw;margin-top:10px;text-align:center;}
    .split .left .details       {display:flex;flex-direction:column;gap:10px;margin-top:20px;}
    .split .left .details .detail      {width:100%;display:flex; flex-direction:row; gap:20px; }
    .split .left .details .detail .icon      {width:40px;}
    .split .left .details .detail .icon  img       {width:80%;margin:10%;}
    .split .left .details .detail .desc      {width:75%; font-size:3vw; padding-top:10px; font-weight:normal; }
    .split .left .details .detail .desc  b   {font-size:4vw; }
    .split .left .details .detail .desc  a   {color:#fff;}
    
    .split .right{width:100%;overflow:unset;height:400px;}
    .split .right   img {width:100%;}

    #reynold      {min-height:1300px;}
    .split2       {position:relative; top:40vh; height:60vh; width:100vw; left:50%; transform:translate(-50%, -50%); z-index:150;display:flex;flex-direction:column;gap:10px;}
    .split2 .left     {width:100%;}  
    .split2 .left  img   {width:80%;padding:3% 10%;}  
    .split2 .right    {width:80%;padding:3% 10%; text-align:center;}  

    #form_title     {position: relative; top:10vh; height:8vh; left:50%; transform:translateX(-50%);z-index:110;opacity:1;font-size: 3vh;color:#E3091D; text-align:center;}
    .form_container {position:relative; top:13vh; min-height:70vh; width:90vw; left:50%; transform:translateX(-50%); z-index:150;display:flex;flex-direction:column;
                     background-color:#F5EFDE;border-radius:40px;border:solid 1px #E3091D;padding:20px 0px;
                    }
        .form_container .form_row       {width:100%; margin-bottom:10px; }
        .form_container .form_row.text  {padding-left:3vw; width:calc(100% - 3vw); font-size:2.5vw;margin-bottom:1vh}
        .form_container .form_row  input[type=text],input[type=number]       { border:solid 1px #E3091D; border-radius:20px;padding:10px 20px; width:80%;margin:0px auto; display:block; font-size:2vh; }
        .form_container .form_row  input::placeholder     { color:#000;}
        .form_container .form_row  select    { border:solid 1px #E3091D; border-radius:20px;padding:8px 20px; width:80%;margin:0px auto; display:block; font-size:2vh;}
        .form_container .form_row  img       { width:calc(80% + 40px); margin:0px auto; display:block;}
        .form_container .form_row  label     { position:relative;top:-2px;cursor:pointer;}


    .footer_tnc     {position:relative; bottom:-170px; width:90vw;font-size:1.5vh;font-weight:normal;left:50vw; transform:translateX(-50%); text-align:center}


      .done_container     {position:relative; top:20vh;  min-width:unset;width: 96vw; height: 70vh; left:50%; transform:translateX(-50%); background-color:#F5EFDE;border:solid 1px #E3091D;border-radius:40px; }
    .done_header        {position:relative; top:60px;left:50%;transform:translateX(-50%);height:40px;}
    .done_content       {position:relative; top:90px;left:50%;transform:translateX(-50%);height:40vh; width:90%; text-align:center;}
    .done_content  img  {width:86%;margin-top:30px;}  

    
    
    .feedback-form        { width:96%;margin:70px auto 20px; font-size:12px; height:37vh; padding:0px 10px;font-size:16px; }
    .feedback-row         { width:100%; padding:8px 0px;}
    .feedback-text        { width:calc(100% - 30px);padding:10px 10px;border:solid 1px #000;}
    .btn_send             { width:50%;margin:0px auto;position:absolute;left:0;right:0;cursor:pointer}



     #ready_to_win{
           position: relative; background-image: url('');z-index: 10;background-size:cover;background-position:center; height: 100svh;

           
    }
      .homemobilefold{
display: none;
       }
#listproductdesk{ display: none;}
#listproducthp{ display: block;}
    #listproducthp{
        position: absolute;
        width: 60svw;
        max-width: 60svw;
        left: 50%;
        transform: translateX(-50%);
        top: 5vh;
        object-fit: contain;
    }
    #text_readytowin {
  position: absolute;
  top: 5vh;
  width: 48svw;
  left: 50%;
  transform: translateX(-50%);
}
 #text_howtoenter {
        position: absolute;
        top: 5vh;
        width: 50svw;
        left: 50%;
        display: block;
        transform: translateX(-50%);
    }
        #uploadImg      {max-width:100px;max-height:200px;left:50%;transform:translateX(-50%);position:relative;margin:20px 0; width:unset;}

    #howtoenterlistdesk{
        display: none;
    }
    #howtoenterlisthp{
        display: block;
    }
    #howtoenterlisthp{
        display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
        top: 10vh;
    }    #howtoenterlisthp .numberimage{
        object-fit: contain;
        width: 10svw;
        margin: 0 auto;
        display: block;
    }
    #howtoenterlisthp .imagehte{
        object-fit: contain;
        width: 65svw;
        max-width: 65vw;
        position: relative;
        left: 50%;
        transform: translateX(-50%);
    }
    #howtoenterlisthp .listhte{
       display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
        
        /* top: 5vh; */
    }
    #howtoenter {
        position: relative;background-color: #E20019 ;height: 140svh; z-index: 10;background-size:cover;background-position:center;

    }
    .tnctext {
        width: 75%;
    
    }

    .tnctext p {
        font-size: 10px;
        color: #fff;
        text-align: center;
        line-height: 1;
        margin: 0;
        padding: 0;
    }
    
    #share-section{position: relative; height: 20svh;background-color: white;}
    #shareflex{
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding: 20px;
        gap: 20px;
    }    .share-text{
        color: #E20019;
        font-size: 12px;
    }
    
    /* Responsive SVG styling */
     .social-icons {
        display: flex;
        gap: 15px;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
    }
    
    .social-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        /* padding: 8px; */
        border-radius: 50%;
        background-color: #f8f9fa;
        transition: all 0.3s ease;
        min-width: 10px;
        min-height: 10px;
    }
    
    .social-icon:hover {
        transform: scale(1.1);
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    }
    
    .social-icons svg {
        width: 100%;
        height: 100%;
        max-width: 25px;
        max-height: 25px;
        min-width: 20px;
        min-height: 20px;
        object-fit: contain;
        transition: all 0.3s ease;
    }
        #shareflexwinners {
        display: flex;
        position: absolute;
        /* top: 5px; */
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 0px;
        height: auto;
        gap: 2px;
        bottom: 5vh;
        left: 50%;
        transform: translateX(-50%);
        text-align: center;
        width: 100%;
    }
    
    /* Mobile responsive breakpoints */
   
    
}

#end {text-align:center;padding-top:50px;}
    #end span {
        font-size: 36px;
    }
    .end_container     {position:relative; top:5vh; width: 35vw; min-width:600px; height: 590px; left:50%; transform:translateX(-50%); background-color:#F5EFDE;border:solid 1px #E3091D;border-radius:40px; margin-bottom:50px; }
    .end_content       {position:relative; top:0px;left:50%;transform:translateX(-50%);height:30vh; width:90%; text-align:center;}
    .end_header        {position:relative; top:20px;left:50%;transform:translateX(-50%);height:35px; width:50%; text-align:center;border-radius:30px;background-color:#E20019; color:#fff;font-size:20px;padding-top:5px;}
    
    .winners           {position:relative; top: 20px; display:flex; flex-direction:column; gap:20px;font-size:14px;}
    .winners .rows     {position:relative; top: 20px; display:flex; flex-direction:row; gap:20px;height: 80px;}
    .winners .rows .winner   {position:relative; width:calc(25% - 20px);}
    .winners .rows .winner .name  {width:100%;margin-bottom:5px;text-align:center;}
    .winners .rows .winner .phone  {width:100%;margin-bottom:0px;text-align:center;}

h1 {
    color: #E20019;
}

#img_winnerlist {
    position: absolute; 
    bottom: 3vh; 
    height: 6vh; 
    left: 50%; 
    transform: translateX(-50%);
    z-index: 130;
    opacity: 1;
    cursor: pointer;
}

@media print, screen and (max-width:40em) {
    #end {
        text-align: center;
        padding-top: 50px;
    }

        #end span {
            font-size: 26px;
        }


    .end_container     {position:relative; top:5vh; width: 35vw; min-width:unset; width:92%; height: 620px; left:50%; transform:translateX(-50%); background-color:#F5EFDE;border:solid 1px #E3091D;border-radius:40px; margin-bottom:50px; }
    .end_content       {position:relative; top:0px;left:50%;transform:translateX(-50%);height:30vh; width:90%; text-align:center;}
    .end_header        {position:relative; top:20px;left:50%;transform:translateX(-50%);height:35px; width:50%; text-align:center;border-radius:30px;background-color:#E20019; color:#fff;font-size:20px;padding-top:5px;}
    
    .winners           {position:relative; top: 20px; display:flex; flex-direction:column; gap:20px;font-size:14px;}
    .winners .rows     {position:relative; top: 20px; display:flex; flex-direction:row; gap:20px;height: 80px;}
    .winners .rows .winner   {position:relative; width:calc(20% - 16px);}
    .winners .rows .winner .name  {width:100%;margin-bottom:5px;text-align:center;}
    .winners .rows .winner .phone  {width:100%;margin-bottom:0px;text-align:center;}

}

/* Untuk iPad dan Fold yang punya rasio mirip */
@media screen and (min-width: 37em) and (max-width: 48em) {
  /* #home {
    position: relative;
    background-image: url('');
    z-index: 13;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 100vh;
    width: 100vw;
  } */
    /* #home           {position: relative; background-image: url('ph/Assets/img_header_bg.png');z-index: 10;background-size:contain;background-position:center;} */
    #home {
        height: 100dvh;
        width: 100dvw;
    

    }
.homemobilefold{
    display: none;
}
   .backgroundbg {
    position: absolute;
    z-index: 6;
    width: 100dvw;
    background-repeat: no-repeat;
    height: 100dvh;
    background-position: bottom;
    background-size: cover;
  }
  .homemobile {
    position: absolute;
    z-index: 20;
    object-fit: contain;
    width: 100dvw;
    height: 100dvh;
    left: 50%;
    transform: translateX(-50%);
  }
      .homemobile{
        display: block;
    }
.backgroundbg{
        display: block;
    }
    .show-desktop {display:none;}
    .show-mobile {display: none;} 



     .img_title      {position:relative;width:80vw;top:10vh;}
    .img_button     {position:relative;width:60vw;top:12vh;left:50%;transform:translateX(-50%);}
    #img_scroll     {position: absolute; bottom:-3vh; height:6vh; left:50%; transform:translateX(-50%);z-index:130;opacity:1;cursor:pointer;  }

    #cara_berpartisipasi {background-color:#F5EFDE;overflow:hidden;height: 100vh!important;}
    #howtowin_title {position: absolute; top:115vh; height:15vh; left:10%; z-index:1;opacity:1; font-size: 8vw;color:#E3091D; }

    .img_line1      {position: relative; top:unset; bottom:-45vh; width:94%; left:0%; z-index:1;opacity:1;}
    #img_step1      {position: absolute; top:150vh; width:50vw; height:unset;left:25%; transform:translateX(-50%);z-index:110;}
    #img_step2      {position: absolute; top:135vh; width:50vw; height:unset;left:75%; transform:translateX(-50%);z-index:110;}
    #img_step3      {position: absolute; top:170vh; width:50vw; height:unset;left:60%; transform:translateX(-50%);z-index:110;}
     

    
    .split       {position:relative; top:66vh; height:60vh; width:96vw; left:50%; transform:translate(-50%, -50%); z-index:150;display:flex;flex-direction:column-reverse;overflow:unset; gap:20px;}
    .split .left {width:100%; color:#fff; }
    .split .left .title         {font-size:5vw;text-align:center;}
    .split .left .sub_title     {font-size:4vw;margin-top:10px;text-align:center;}
    .split .left .details       {display:flex;flex-direction:column;gap:10px;margin-top:20px;}
    .split .left .details .detail      {width:100%;display:flex; flex-direction:row; gap:20px; }
    .split .left .details .detail .icon      {width:40px;}
    .split .left .details .detail .icon  img       {width:80%;margin:10%;}
    .split .left .details .detail .desc      {width:75%; font-size:3vw; padding-top:10px; font-weight:normal; }
    .split .left .details .detail .desc  b   {font-size:4vw; }
    .split .left .details .detail .desc  a   {color:#fff;}
    
    .split .right{width:100%;overflow:unset;height:400px;}
    .split .right   img {width:100%;}

    #reynold      {min-height:1300px;}
    .split2       {position:relative; top:40vh; height:60vh; width:100vw; left:50%; transform:translate(-50%, -50%); z-index:150;display:flex;flex-direction:column;gap:10px;}
    .split2 .left     {width:100%;}  
    .split2 .left  img   {width:80%;padding:3% 10%;}  
    .split2 .right    {width:80%;padding:3% 10%; text-align:center;}  

    #form_title     {position: relative; top:10vh; height:8vh; left:50%; transform:translateX(-50%);z-index:110;opacity:1;font-size: 3vh;color:#E3091D; text-align:center;}
    .form_container {position:relative; top:13vh; min-height:70vh; width:90vw; left:50%; transform:translateX(-50%); z-index:150;display:flex;flex-direction:column;
                     background-color:#F5EFDE;border-radius:40px;border:solid 1px #E3091D;padding:20px 0px;
                    }
        .form_container .form_row       {width:100%; margin-bottom:10px; }
        .form_container .form_row.text  {padding-left:3vw; width:calc(100% - 3vw); font-size:2.5vw;margin-bottom:1vh}
        .form_container .form_row  input[type=text],input[type=number]       { border:solid 1px #E3091D; border-radius:20px;padding:10px 20px; width:80%;margin:0px auto; display:block; font-size:2vh; }
        .form_container .form_row  input::placeholder     { color:#000;}
        .form_container .form_row  select    { border:solid 1px #E3091D; border-radius:20px;padding:8px 20px; width:80%;margin:0px auto; display:block; font-size:2vh;}
        .form_container .form_row  img       { width:calc(80% + 40px); margin:0px auto; display:block;}
        .form_container .form_row  label     { position:relative;top:-2px;cursor:pointer;}


    .footer_tnc     {position:relative; bottom:-170px; width:90vw;font-size:1.5vh;font-weight:normal;left:50vw; transform:translateX(-50%); text-align:center}


      .done_container     {position:relative; top:20vh;  min-width:unset;width: 96vw; height: 70vh; left:50%; transform:translateX(-50%); background-color:#F5EFDE;border:solid 1px #E3091D;border-radius:40px; }
    .done_header        {position:relative; top:60px;left:50%;transform:translateX(-50%);height:40px;}
    .done_content       {position:relative; top:90px;left:50%;transform:translateX(-50%);height:40vh; width:90%; text-align:center;}
    .done_content  img  {width:86%;margin-top:30px;}  

    
    
    .feedback-form        { width:96%;margin:70px auto 20px; font-size:12px; height:37vh; padding:0px 10px;font-size:16px; }
    .feedback-row         { width:100%; padding:8px 0px;}
    .feedback-text        { width:calc(100% - 30px);padding:10px 10px;border:solid 1px #000;}
    .btn_send             { width:50%;margin:0px auto;position:absolute;left:0;right:0;cursor:pointer}



     #ready_to_win{
           position: relative; background-image: url('');z-index: 10;background-size:cover;background-position:center; height: 100svh;

    }
#listproductdesk{ display: none;}
#listproducthp{ display: block;}
    #listproducthp{
       position: absolute;
    width: 25svw;
    max-width: 26svw;
    left: 50%;
    transform: translateX(-50%);
    top: 15vh;
    object-fit: contain;
    }
    #text_readytowin {
  position: absolute;
  top: 10vh;
  width: 48svw;
  left: 50%;
  transform: translateX(-50%);
}
 #text_howtoenter {
        position: absolute;
        top: 5vh;
        width: 50svw;
        left: 50%;
        display: block;
        transform: translateX(-50%);
    }
        #uploadImg      {max-width:100px;max-height:200px;left:50%;transform:translateX(-50%);position:relative;margin:20px 0; width:unset;}

    #howtoenterlistdesk{
        display: none;
    }
    #howtoenterlisthp{
        display: block;
    }
    #howtoenterlisthp{
        display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
        top: 13vh;
    }    #howtoenterlisthp .numberimage{
        object-fit: contain;
        width: 10svw;
        margin: 0 auto;
        display: block;
    }
    #howtoenterlisthp .imagehte{
        object-fit: contain;
        width: 30svw;
        max-width: 32svw;
        position: relative;
        left: 50%;
        transform: translateX(-50%);
    }
    #howtoenterlisthp .listhte{
       display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
        
        /* top: 5vh; */
    }
    #howtoenter {
        position: relative;background-color: #E20019 ;height: 140svh; z-index: 10;background-size:cover;background-position:center;

    }
    .tnctext{
        width: 80%;
          

    }
    .tnctext p {
          font-size: 10px;
        color: #fff;
        text-align: center;
        line-height: 1;
        margin: 0;
    }
    
    #share-section{position: relative; height: 20svh;background-color: white;}
    #shareflex{
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding: 20px;
        gap: 20px;
    }    .share-text{
        color: #E20019;
        font-size: 12px;
    }
    
    /* Responsive SVG styling */
     .social-icons {
        display: flex;
        gap: 15px;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
    }
    
    .social-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        /* padding: 8px; */
        border-radius: 50%;
        background-color: #f8f9fa;
        transition: all 0.3s ease;
        min-width: 10px;
        min-height: 10px;
    }
    
    .social-icon:hover {
        transform: scale(1.1);
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    }
    
    .social-icons svg {
        width: 100%;
        height: 100%;
        max-width: 25px;
        max-height: 25px;
        min-width: 20px;
        min-height: 20px;
        object-fit: contain;
        transition: all 0.3s ease;
    }
        #shareflexwinners {
        display: flex;
        position: absolute;
        /* top: 5px; */
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 0px;
        height: auto;
        gap: 2px;
        bottom: 5vh;
        left: 50%;
        transform: translateX(-50%);
        text-align: center;
        width: 100%;
    }
    
  
       
    
}

#end {text-align:center;padding-top:50px;}
    #end span {
        font-size: 36px;
    }
    .end_container     {position:relative; top:5vh; width: 35vw; min-width:600px; height: 590px; left:50%; transform:translateX(-50%); background-color:#F5EFDE;border:solid 1px #E3091D;border-radius:40px; margin-bottom:50px; }
    .end_content       {position:relative; top:0px;left:50%;transform:translateX(-50%);height:30vh; width:90%; text-align:center;}
    .end_header        {position:relative; top:20px;left:50%;transform:translateX(-50%);height:35px; width:50%; text-align:center;border-radius:30px;background-color:#E20019; color:#fff;font-size:20px;padding-top:5px;}
    
    .winners           {position:relative; top: 20px; display:flex; flex-direction:column; gap:20px;font-size:14px;}
    .winners .rows     {position:relative; top: 20px; display:flex; flex-direction:row; gap:20px;height: 80px;}
    .winners .rows .winner   {position:relative; width:calc(25% - 20px);}
    .winners .rows .winner .name  {width:100%;margin-bottom:5px;text-align:center;}
    .winners .rows .winner .phone  {width:100%;margin-bottom:0px;text-align:center;}

/* Samsung Galaxy Z Fold Media Queries */
@media screen and (min-width: 49em) and (max-width: 53em) {
    #home {
        background-image: none;
        width: 100dvw;
        height: 100dvh;
    }
    
    .homemobile {
        display: none;
    }

    
 
        .homemobilefold {
        display: block;
        object-fit: contain;
        width: 60dvw;
        z-index: 11;
        position: absolute;
        height: 100dvh;
        left: 50%;
        transform: translateX(-50%);
    }

    .backgroundbg {
        position: absolute;
        z-index: 6;
        display: block;
        width: 100dvw;
        background-repeat: no-repeat;
        height: 100dvh;
        background-position: bottom;
        z-index: 10;
        background-size: cover;
    }                               
 
    #howtoenterlistdesk {
        width: 78svw;
    }
    
    .tnctext {
        width: 100%;
    }
        #listproducthp {
        position: absolute;
        width: 27svw;
        max-width: 27svw;
        left: 50%;
        transform: translateX(-50%);
        top: 15vh;
        object-fit: contain;
    }
}