@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap");
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@300;400;700;900&family=Montserrat+Alternates:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Advent+Pro:wght@400;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cardo&display=swap');

html {
    font-size: 10px;
}

@media only screen and (max-width: 400px) {
    html {
        font-size: 9.375px;
    }
}

body {
    background: #1E2F3B;
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 1.875;
}

a {
    color: #fff;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

a:hover {
    color: #ffef30;
}

  /* ===================================================================
 * # buttons
 *
 * ------------------------------------------------------------------- */

 .btn,
 button,
 input[type="submit"],
 input[type="reset"],
 input[type="button"] {
     display: inline-block;
     font-family: 'Montserrat', sans-serif;
     font-size: 14px;
     text-transform: uppercase;
     font-weight: 600;
     line-height: 1.48;
     padding: 10px;
     margin: 0 0.3rem;
     color: #fff;
     text-decoration: none;
     text-align: center;
     border-radius: 4px;
     cursor: pointer;
     -webkit-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
     background-color: #808080;
 }
 
 .btn:hover,
 button:hover,
 input[type="submit"]:hover,
 input[type="reset"]:hover,
 input[type="button"]:hover,
 .btn:focus,
 button:focus,
 input[type="submit"]:focus,
 input[type="reset"]:focus,
 input[type="button"]:focus {
     background-color: #000;
     border-color: #000;
     color: #fff;
     outline: 0;
 }
 
 h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
     font-family: 'Montserrat', sans-serif;
     /* color: #ff9ecc; */
     font-style: normal;
     font-weight: bold;
     /* line-height: 1.7; */
     text-rendering: optimizeLegibility;
   }

.s-content__header > div {
    background: #0003;
  }

  .s-content__header h2 {
    font-family: 'Advent Pro', sans-serif;
    position: relative;
    padding: 10px 0;
    display: inline;
    font-style: normal;
    font-weight: 700;
    font-size: 45px;
    line-height: 1.25;
    text-align: center;
    color: #FFFFFF;
    text-shadow: 1px 2px 3px black;
  }

  .s-content__header h2 span {
    margin-bottom: 10px;
    font-family: 'Samsung Sharp Sans', sans-serif;
    color: #ffef30;
    text-shadow: 1px 2px 3px black;
  }
  @media (min-width: 767px) {
    .s-content__header h2 span {
        display: block;
    }
  }

  .s-content__header h5 {
    font-family: Poppins;
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
  }
  .s-content__header h5 img {
    height: 20px;
    margin: -8px 4px 0;
    /* width: 100px; */
  }

  #welcome {
    color: #ffef30;
    font-weight: bold;
    font-size: 16px;
  }

  .btn-header {
    background: #192b3a;
    border: 2px solid #5ADF18 !important;
      border-top-color: rgb(90, 223, 24);
      border-right-color: rgb(90, 223, 24);
      border-bottom-color: rgb(90, 223, 24);
      border-left-color: rgb(90, 223, 24);
    border-color: #5ADF18 !important;
    padding: 10px 27px;
    font-family: Poppins;
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 1;
    text-transform: capitalize;
  }

  .btn-header:hover {
    background: #5ADF18 !important;
    color:#192b3a !important;
}

  #done-message h6 {
    font-size: 24px;
    color: #fff;
    text-transform: uppercase;
  }

  #done-message h6 span {
    color: #ffef30;
  }

  label, legend {
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    font-weight: normal;
    margin-bottom: 0.9rem;
    line-height: 1.714;
    color: #fff;
    display: block;
    line-height: 2rem;
  }

  #google-sheet-form h6 {
    font-size: 24px;
    color: #fff;
    line-height: 24px;
  }

  .btn.disabled, .btn:disabled {
    opacity: 0.65;
    background: #858585;
    color: #fff;
    cursor: default;
  }

  .btn-header {
    background: #192b3a;
    border: 2px solid #5ADF18 !important;
    border-color: #5ADF18 !important;
    padding: 10px 27px;
    font-family: Poppins;
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 1;
    text-transform: capitalize;
  }

  /* @media (min-width: 1200px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl {
      max-width: 1180px;
    }
  } */

  ul.q {
    padding: 0;
    text-align: left;
    margin-bottom: 0;
  }

  ul.q li {
    margin: 0 6px;
    display: inline-flex;
    position: relative;
  }

  /* custom input */
  .custom_radio{
    margin-top: 20px;
 }
 .custom_radio input[type="radio"]{
   display: none;
 }
 .custom_radio input[type="radio"] + label{
    font-size: 17px;
   position: relative;
   display: inline-block;
   padding-left: 2em;
   margin-right: 2em;
   cursor: pointer;
   line-height: 1.5em;
   -webkit-transition: all 0.3s ease-in-out;
   transition: all 0.3s ease-in-out;
 }
 .custom_radio input[type="radio"] + label:before,
 .custom_radio input[type="radio"] + label:after{
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   width: 1.5em;
   height: 1.5em;
   text-align: center;
   color: white;
   border-radius: 50%;
   -webkit-transition: all .3s ease;
   transition: all .3s ease;
 }
 .custom_radio input[type="radio"] + label:before {
   -webkit-transition: all .3s ease;
   transition: all .3s ease;
   box-shadow: inset 0 0 0 0.2em white, inset 0 0 0 1em white;
 }
 .custom_radio input[type="radio"] + label:hover:before {
   -webkit-transition: all .3s ease;
   transition: all .3s ease;
   box-shadow: inset 0 0 0 0.3em white, inset 0 0 0 1em #f1cdcd;
 }
 .custom_radio input[type="radio"]:checked + label:before {
   -webkit-transition: all .3s ease;
   transition: all .3s ease;
   box-shadow: inset 0 0 0 0.2em white, inset 0 0 0 1em #e96793;
 }
  

.form-control.is-valid,
.was-validated .form-control:valid {
    background-position: right calc(1.375em + .1875rem) center
}
.form-check-input:disabled~.form-check-label, .form-check-input[disabled]~.form-check-label{
    opacity: 1;
}
.about-txt {
    font-family: 'Advent Pro', sans-serif;
    font-size: 30px;
    line-height: 1.53;
    font-weight: bold;
    color: #ffffff;
    text-transform: uppercase;
    text-shadow: 1px 2px 3px black;
}

.about-txt-red {
    font-weight: bold;
    color: #d4d4d4;
    font-family: 'Advent Pro', sans-serif;
    font-size: 30px;
}

.about-us-p-bold {
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    line-height: 1.5;
    color: #ffffff;
    font-weight: bold;
}

.about-us-p {
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    line-height: 1.5;
    color: #ffffff;
    text-align: justify;
}


/* cara undian  */

.dotted_border_bottom {
    border-bottom: 1px dashed #999;
    text-decoration: none;
}

.xiaomi-cara-undi-btn {
    border-radius: 10px;
    padding: 8px 12px;
    color: white;
    background-color: #312535;
}

.xiaomi-cara-undi-btn a {
    color: white;
}

.xiaomi-cara-undi-btn.active {
    background-color: #eb611d !important;
}


/*owl setting same items same height*/

.owl-carousel .owl-stage {
    display: flex;
}

.owl-carousel .owl-item .about-items {
    width: 100%;
    overflow: hidden;
    position: relative;
    border-radius: 2px;
    text-align: center;
}

.owl-carousel .owl-item .about-items:before {
    content: "";
    float: left;
    padding-bottom: 80%;
}

.owl-carousel .owl-item .about-items>img {
    width: 100%;
    height: 100%;
    overflow: hidden;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
}

.owl-theme .owl-nav {
    margin-top: 0px !important;
    position: absolute;
    top: -50px;
    right: 0;
}


/*.owl-theme .owl-nav [class*=owl-]{
  margin: 8px !important;
}
*/

.owl-theme .owl-nav [class*="owl-"]:hover {
    background: none !important;
}

/*.owl-prev i,
.owl-next i {
    color: #cf3755;
    font-size: 20px;
}*/

.bg-opacity {
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), #000000);
    position: absolute;
    bottom: 0;
    padding: 8px 12px;
}

.about-slider-text {
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    font-weight: bold;
    line-height: 1.25;
    color: #ffffff;
    text-align: center;
}

.entrys {
    background: #592331;
    height: 100%;
}

.entrys .entry__contents {
    padding: 5px 8px;
}

.article-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.1;
    color: #ffffff;
}

.article-details {
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    line-height: 1.56;
    color: #ffffff;
    font-weight: 400;
}

.selanjutnya {
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    font-weight: bold;
    line-height: 1.79;
    color: #fef130;
    text-shadow: 2px 1px black;
}

.pagination a {
    width: 30.5px;
    height: 30.5px;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 3px;
    font-size: 20px;
}

.pagination_active a {
    width: 30.5px;
    height: 30.5px;
    color: white;
    background-color: #cf3755;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 3px;
}

.pagination a:hover {
    width: 30.5px;
    height: 30.5px;
    color: white;
    background-color: #cf3755;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 3px;
}

.page-item.active .page-link {
    width: 30.5px;
    height: 30.5px;
    color: #000;
    background-color: #5ADF18;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 3px;
    font-weight: bold;
}

.page-item .page-link:hover {
    width: 30.5px;
    height: 30.5px;
    color: white;
    background-color: #cf3755;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 3px;
    border: none;
}

.page-link {
    position: relative;
    display: block;
    padding: 0.5rem 0.75rem;
    margin-left: -1px;
    line-height: 1.25;
    border: none;
    background-color: transparent;
    width: 30.5px;
    height: 30.5px;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 3px;
}

.page-item.disabled .page-link {
    color: #6c757d;
    pointer-events: none;
    cursor: auto;
    background-color: #fff0;
    color: #fff;
    font-size: 30px;
}

.page-item:first-child .page-link {
    margin-left: 0;
    font-size: 30px;
}

.page-item:last-child .page-link {
    font-size: 30px;
}

@media only screen and (max-width: 480px) {
    .about-txt {
        font-size: 22px;
    }

    .about-txt-red {
        font-size: 22px;
    }

    .article-title {
        font-size: 16px;
    }

    .article-details {
        font-size: 13px;
    }

    .selanjutnya {
        font-size: 13px;
    }

    .about-us-p-bold {
        font-size: 13px;
    }

    .about-us-p {
        font-size: 13px;
    }
}

*/ .owl-theme .owl-nav [class*="owl-"]:hover {
    background: none !important;
}

.owl-prev i,
.owl-next i {
    color: #cf3755;
    font-size: 20px;
}

.bg-opacity {
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), #000000);
    position: absolute;
    bottom: 0;
    padding: 8px 12px;
}

.about-slider-text {
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    font-weight: bold;
    line-height: 1.25;
    color: #ffffff;
    text-align: center;
}

.div-main-bg {
    background: #172631;
}

.article-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.1;
    color: #ffffff;
}

.article-details {
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    line-height: 1.56;
    color: #ffffff;
}



.pagination {
    width: 30.5px;
    height: 30.5px;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 3px;
}

.pagination_active {
    width: 30.5px;
    height: 30.5px;
    color: white;
    background-color: #cf3755;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 3px;
}

@media only screen and (max-width: 480px) {
    .about-txt {
        font-size: 22px;
    }

    .about-txt-red {
        font-size: 22px;
    }

    .article-title {
        font-size: 16px;
    }

    .article-details {
        font-size: 13px;
    }

    .selanjutnya {
        font-size: 13px;
    }

    .about-us-p-bold {
        font-size: 13px;
    }

    .about-us-p {
        font-size: 13px;
    }
}


/* timeline */

.experiencebubble {
    background: #312535;
    position: relative;
    padding: 12px;
    height: 117px;
    display: flex;
    align-items: center;
    margin-left: 8px;
}

.experiencebubble:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0%;
    transform: translate(-50%, -50%);
    width: 0;
    height: 0;
    border-top: 13px solid transparent;
    border-right: 26px solid #312535;
    border-bottom: 13px solid transparent;
}

.experience {
    border-left: 8px solid #bcbec0;
    padding: 0 30px;
    margin-left: 35%;
}

.experience_item_mobile {
    width: 60% !important;
    margin: 0 auto;
}

@media (max-width: 991px) {
    .experience_item_mobile {
        width: 95% !important;
        margin: 0 auto;
    }
}

@media (max-width: 767px) {
    .experience {
        margin-left: 0;
        padding-right: 0;
    }

    .experience_item_mobile {
        width: 90% !important;
        margin: 0 auto;
    }

    .experiencebubble {
        margin-left: 8px;
    }
}

@media (max-width: 480px) {}

.experience .item {
    position: relative;
    margin: 8px 0;
    width: 100%;
}

.experience .item::before {
    content: "";
    position: absolute;
    left: -52px;
    top: 39px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #000000;
    border: 3px solid #ffffff;
}

.experience_steps {
    font-size: 19px;
    font-weight: bold;
    line-height: 1.21;
    letter-spacing: 1.9px;
    color: #ffffff;
}

.experience_steps_no {
    font-size: 44px;
    font-weight: bold;
    line-height: 1.16;
    letter-spacing: normal;
    color: #ffffff;
}

.experience_steps_shape {
    width: 90px;
    height: 90px;
    border: 8px solid #eb611d;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.experience .item::after {
    content: "";
    position: absolute;
    left: -44px;
    top: 47px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #eb611d;
}

.experience .company-name {
    color: #bcbec0;
}

.experience .location {
    position: absolute;
    right: 0;
    top: 2px;
}

.experience_ul_li {
    margin: 0 !important;
    list-style-type: none;
    padding: 8px 0 8px 8px;
    word-break: break-word;
}

.experience .location .fa {
    margin-right: 8px;
}

.experience .job-info {
    position: absolute;
    left: -265px;
    top: 12px;
}

.experience .job-info .title {
    color: #009688;
}

@media (max-width: 767px) {
    .experience .job-info {
        position: static;
        margin-bottom: 1rem;
    }
}


/* langganan */

.langkah_title {
    opacity: 1;
    font-size: 28px;
    line-height: 1.17;
    color: #ff644c;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
}

.langgananbubble {
    background: #013c55;
    position: relative;
    padding: 12px;
    height: 117px;
    display: flex;
    align-items: center;
    margin-left: 8px;
}

.langgananbubble:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0%;
    transform: translate(-50%, -50%);
    width: 0;
    height: 0;
    border-top: 13px solid transparent;
    border-right: 26px solid #013c55;
    border-bottom: 13px solid transparent;
}

.langganan {
    border-left: 8px solid #bcbec0;
    padding: 0 30px;
    margin-left: 35%;
}

.langganan_item_mobile {
    width: 70% !important;
    margin: 0 auto;
}

@media (max-width: 991px) {
    .langganan_item_mobile {
        width: 95% !important;
        margin: 0 auto;
    }
}

@media (max-width: 767px) {
    .langganan {
        margin-left: 0;
        padding-right: 0;
    }

    .langganan_item_mobile {
        width: 90% !important;
        margin: 0 auto;
    }

    .langgananbubble {
        margin-left: 8px;
    }
}

@media (max-width: 480px) {}

.langganan .item {
    position: relative;
    margin: 8px 0;
    width: 100%;
}

.langganan .item::before {
    content: "";
    position: absolute;
    left: -52px;
    top: 39px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #000000;
    border: 3px solid #ffffff;
}

.langganan_steps {
    font-size: 19px;
    font-weight: bold;
    line-height: 1.21;
    letter-spacing: 1.9px;
    color: #ffffff;
}

.langganan_steps_no {
    font-size: 44px;
    font-weight: bold;
    line-height: 1.16;
    letter-spacing: normal;
    color: #ffffff;
}

.langganan_steps_shape {
    width: 90px;
    height: 90px;
    border: 8px solid #ff644c;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.langganan .item::after {
    content: "";
    position: absolute;
    left: -44px;
    top: 47px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #ff644c;
}

.langganan .company-name {
    color: #bcbec0;
}

.langganan .location {
    position: absolute;
    right: 0;
    top: 2px;
}

.langganan_ul_li {
    margin: 0 !important;
    list-style-type: none;
    padding: 8px 0 8px 8px;
    word-break: break-word;
}

.subscription_txt {
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    line-height: 1.25;
    color: #ffffff;
    font-weight: bold;
    color: #cf3755;
}

.tonton_txt {
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    line-height: 1.25;
    color: #ffffff;
    font-weight: bold;
    color: #01a0de;
}
.tonton_txt a {
    font-size: inherit;
    color: #53c0e8;
    font-weight: inherit;
}

.btn-tonton{
    background-color: #00446e;
}
.btn-subscribe{
    background-color:  #e52352;
}    

.langganan_ul_li li {
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.25;
    color: #ffffff;
}

.langganan .location .fa {
    margin-right: 8px;
}

.langganan .job-info {
    position: absolute;
    left: -265px;
    top: 12px;
}

.langganan .job-info .title {
    color: #009688;
}

@media (max-width: 767px) {
    .langganan .job-info {
        position: static;
        margin-bottom: 1rem;
    }

    .langgananbubble {
        height: 160px;
    }
}

.langkah-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.langkah-wrapper-container {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 550px;
    margin: auto;
}

.langkah-no-wrapper {
    display: flex;
    justify-content: center;
    position: relative;
    margin-bottom: -10px;
}

.langkah-no-wrapper h6 {
    position: absolute;
    bottom: 15px;
    left: 0;
    font-family: Poppins;
    font-style: normal;
    font-weight: 800;
    font-size: 19px;
    line-height: 1.2;
    color: #ffffff;
}

.langkah-no-wrapper .numbering-wrapper {
    width: 90px;
    height: 90px;
    background: #EC388E;
    border: 7px solid #5ADF18;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.numbering-wrapper h1 {
    font-family: Poppins;
    font-style: normal;
    font-weight: 800;
    font-size: 44px;
    line-height: 1.2;
    color: #5ADF18;
    margin: 0;
}

.langkah-content-wrapper {
    background: #1D2F3B;
    border: 3px solid #FFF02F;
    border-radius: 10px;
    padding: 29px 2rem;
}

.langkah-content-wrapper p {
    width: 100%;
    max-width: 400px;
    margin: auto;
    font-family: Poppins;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.2;
    text-align: center;
    color: #FFFFFF;
}

.connector-wrapper {
    width: 100%;
    max-width: 7.9px;
    margin: auto;
    height: 30px;
    background: #ffda8f;
}

/* undian xiaomi */

.undian_xiaomi_title {
    font-family: 'Montserrat', sans-serif;
    font-size: 44px;
    line-height: 1.23;
    letter-spacing: normal;
    color: #ffffff;
}

.undian_xiaomi_title .orange-bold {
    font-weight: bold;
    color: #eb611d;
}

.undian_xiaomi_title .red-bold {
    font-weight: bold;
    color: #cf3755;
}

.undian_xiaomi_purple_bg {
    background: #3e181e94;
}

.undian_xiaomi_black_bg {
    background: #0000006e;
}

.undian_xiaomi_icon_size {
    width: 195px;
    height: 195px;
}

.undian_langganan_icon_size {
    width: 195px;
}

.undian_xiaomi_artist_size {
    width: 152px;
}

.undian_xiaomi_peranti_title {
    font-family: 'Montserrat', sans-serif;
    font-size: 30px;
    font-weight: 500;
    line-height: 0.83;
    color: #eb611d;
}

.undian_xiaomi_peranti_title_white {
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    line-height: 1.56;
    color: #ffffff;
}

.undian_langganan_a {
    color: #ff3265;
}

.undian_langganan_title {
    font-family: 'Montserrat', sans-serif;
    font-size: 30px;
    font-weight: 500;
    line-height: 0.83;
    color: #ff3265;
}

.undian_langganan_title_white {
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    line-height: 1.56;
    color: #ffffff;
    font-weight: bold;
}

.undian_xiaomi_artis_steps_txt {
    font-family: 'Montserrat', sans-serif;
    font-size: 20px;
    font-weight: bold;
    line-height: 1.5;
    color: #eb611d;
}

.undian_langganan_artis_steps_txt {
    font-family: 'Montserrat', sans-serif;
    font-size: 20px;
    font-weight: bold;
    line-height: 1.5;
    color: #ff3265;
}

.custom-select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='rgb(235, 97, 29)' d='M0 7.33l2.829-2.83 9.175 9.339 9.167-9.339 2.829 2.83-11.996 12.17z'/%3E%3C/svg%3E");
    padding: 4px 15px;
    border-radius: 5px;
    text-transform: uppercase;
}

.undian-xiaomi-langkah-div {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 22;
}

.undian-xiaomi-langkah-box {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: #eb611d;
}

.undian-langganan-langkah-box {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: #ff3265;
}

.undian-xiaomi-langkah-box p,
.undian-langganan-langkah-box p {
    opacity: 1;
    font-family: 'Montserrat', sans-serif;
    font-size: 40px;
    font-weight: 500;
    line-height: 0.7;
    color: #ffffff;
}

.undi-xiaomi-btn {
    border-radius: 10px;
    background-color: #eb611d;
    color: white;
    border: none;
    padding: 10px 33px;
}

.undi-langganan-btn {
    border-radius: 10px;
    background-color: #ff3265;
    color: white;
    border: none;
    padding: 10px 33px;
}

.undian-xiaomi-imei-undi-p {
    font-size: 14px;
    line-height: 1.43;
    color: #ffffff;
}

.undi-xiaomi-peranti-phone-image-div {
    width: 310px;
}

.undi-xiaomi-imei-phone-image-div {
    width: 190px;
}

@media (max-width: 767px) {
    .undian-xiaomi-langkah-div {
        transform: translate(-50%, -75%);
    }
}

.home-xiaomi-bg-purple {
    background: #121212;

}

.home-xiaomi-item {

    border-radius: 24px;
    border: 4px solid #fff;
}

.home-xiaomi-bg-orange {
    background: #eb611d;
}

.xiaomi-logo-home {
    width: 50px;
    margin: 0 auto;
}

.xiaomi-logo-undian-imei {
    width: 50px;
}

.xiaomi-home-undian-imei-title {
    font-size: 18px;
    font-weight: bold;
    line-height: 1.4;
    color: #ffffff;
}

.xiaomi-mata-undian-imei-top {
    font-size: 18px;
    font-weight: bold;
    line-height: 1.4;
    color: #ffffff;
}

.xiaomi-mata-undian-imei-small {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4;
    color: #ffffff;
}

.xiaomi-undian-imei-details-div {
    height: 150px;
}

.xiaomi-home-text {
    font-size: 16px;
    font-weight: bold;
    line-height: 1.4;
    color: #ffffff;
}

.xiaomi-mata-undian-top {
    font-size: 24px;
    font-weight: bold;
    line-height: 1.4;
    color: #ffffff;
}

.xiaomi-mata-undian-small {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.4;
    color: #ffffff;
}

.header-wrapper {
    display: flex;
    justify-content: center;
    flex-wrap: nowrap;
    align-items: center;
    /* margin: 20px; */
    padding: 0 50px;
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .header-wrapper {
        padding-left: 9rem;
        padding-right: 9rem;
    }
}

@media (max-width:767px) {

    .header-wrapper {
        flex-wrap: wrap;
        flex-direction: column-reverse;
        padding-left: 0rem;
        padding-right: 0rem;
        background: none;
    }


}

.header-content-container {
    width: 100%;
    max-width: 430px;
}

.header-wrapper img {
    width: 100%;
    height: 275px;
    object-fit: contain;
}

@media (max-width:767px) {
    .header-wrapper img {
        width: 300px;
        height: unset;
        object-fit: contain;
    }
}

@media (max-width:475px) {
    .header-wrapper img {
        width: 200px;
    }
}

@media (max-width:375px) {
    .header-wrapper img {
        width: 155px;
    }
}

.homepage_main_text {
    font-family: 'Advent Pro', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 53px;
    line-height: 1.2;
    color: #FFFFFF;
    word-break: break-word;
}

.homepage_main_text_tiktok {
    font-family: 'Montserrat', sans-serif;
    font-size: 45px;
    line-height: 1.4;
    color: #ffffff;
    word-break: break-word;
    /*text-shadow: 4px 3px 5px #3a2bca;*/
    text-shadow: 1px 2px 4px #85c5d0;
}

.homepage_tiktok_text {
    font-family: 'Montserrat', sans-serif;
    font-size: 36px;
    line-height: 1.4;
    color: #ffffff;
    word-break: break-word;
    /*text-shadow: 4px 3px 5px #3a2bca;*/
    text-shadow: 1px 2px 4px #85c5d0;
}

.homepage_tiktok_text2 {
    font-family: 'Montserrat', sans-serif;
    font-size: 30px;
    line-height: 1.4;
    color: #ffffff;
    word-break: break-word;
    /*text-shadow: 4px 3px 5px #3a2bca;*/
    text-shadow: 1px 2px 4px #85c5d0;
}

.bold-white {
    font-weight: 700;
}

.homepage_main_text .bold-white {
    font-weight: 700;
}

.homepage_main_text_tiktok .bold-white {
    font-weight: bold;
}

.homepage_main_text .bold-red {
    color: #cf3755;
}

.homepage_main_text_small {
    width: 100%;
    /* max-width: 404px; */
    font-family: 'Advent Pro', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 1.2;
    color: #FFFFFF;
}


@media only screen and (min-width:768px) and (max-width:991px) {
    .homepage_main_text {
        font-size: 32px;
    }

    .homepage_main_text_small {
        font-size: 14px;
    }
}

@media (max-width:767px) {
    .header-content-container {
        max-width: 560px;
        width: auto;
    }

    .homepage_main_text {
        font-size: 65px;
        padding-left: 5rem;
    }

    .homepage_main_text_small {
        max-width: 485px;
        font-size: 30px;
        padding-left: 5rem;
    }

}

@media only screen and (min-width:426px) and (max-width:575px) {
    .header-content-container {
        max-width: 371px;
    }

    .homepage_main_text {
        font-size: 39px;
        padding-left: 1.5rem;
    }

    .homepage_main_text_small {
        font-size: 22px;
        padding-left: 1.5rem;
    }
}

@media (max-width:425px) {

    .homepage_main_text {
        font-size: 24px;
        padding-left: 1rem;
        margin-top: 2rem !important;
    }

    .homepage_main_text_small {
        font-size: 18px;
        padding-left: 1rem;
    }

   
}

@media (max-width:320px) {
    .homepage_main_text {
        font-size: 25px;
        margin-top: 0rem !important;
    }

    .homepage_main_text_small {
        font-size: 16px;
    }
}

.homepage_main_text_small .white-bold {
    font-weight: bold;
}

.sticky {
    position: fixed;
    top: 0;
    width: 342px;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
}

.footer-logo {
    height: 55px;
}

.footer-logo-kool {
    height: 38px;
}

.footer-logo-tv3 {
    width: 45px;
}

.footer-text-style {
    font-family: Poppins;
    font-weight: 600;
    color: #000000;
    font-size: 16px;
    line-height: 1.2;
}

@media (max-width: 768px) {
    .xiaomi-undian-imei-details-div {
        height: 120px;
    }

    .homepage_main_text_tiktok {
        font-size: 30px;
        word-break: break-word;
    }

    .xiaomi-home-text {
        font-size: 16px;
    }

    .xiaomi-mata-undian-top {
        font-size: 19px;
    }

    .xiaomi-mata-undian-small {
        font-size: 16px;
    }

    .xiaomi-logo-home {
        width: 40px;
    }

    .footer-text-style {
        font-size: 12px;
    }

}

@media (max-width: 480px) {

    .undian_xiaomi_title {

        font-size: 35px;

    }
}

/*---menu-----*/

.navbar {
    padding: 10px 10px;
    z-index: 15;
}

.navbar-dark .navbar-nav .nav-link {
    font-family: 'Advent Pro', sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 1;
    color: #E3BCB3;
}

.navbar-dark .navbar-nav .current>.nav-link,
.navbar-dark .navbar-nav .nav-link.current,
.navbar-dark .navbar-nav .nav-link.show,
.navbar-dark .navbar-nav .show>.nav-link {
    color: #AA5F68;
    padding: 5px 20px;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: .5rem 0;
    margin: .125rem 0 0;
    font-size: 20px;
    color: #ffffff;
    text-align: left;
    list-style: none;
    background-color: #0000004a;
    background-clip: padding-box;
    border: none;
}

.dropdown-menu {
    width: 100%;
}

.dropdown-item {
    display: block;
    width: 100%;
    padding: 10px 0 !important;
    clear: both;
    font-weight: 400;
    color: #fff;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
}

.dropdown-item a {
    color: #fff;
}

.dropdown-item:focus,
.dropdown-item:hover {
    color: #ffffff;
    text-decoration: none;
    background-color: #00000000;
}

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

    .navbar-dark .navbar-nav .current>.nav-link,
    .navbar-dark .navbar-nav .nav-link.current,
    .navbar-dark .navbar-nav .nav-link.show,
    .navbar-dark .navbar-nav .show>.nav-link {
        color: #fff;
        padding: 5px 20px;
        font-weight: 800;
        text-shadow: 2px 2px #af28ef;

    }

    .navbar-dark .navbar-nav .nav-link:focus,
    .navbar-dark .navbar-nav .nav-link:hover {
        color: #fff;
        padding: 5px 20px;
        font-weight: 800;
        text-shadow: 2px 2px #af28ef;

    }


}



.navbar-dark .navbar-nav .nav-link:focus,
.navbar-dark .navbar-nav .nav-link:hover {
    color: #AA5F68;
    padding: 5px 20px;
}
 ul.logo {
    padding-left: 0;
}
ul.logo li {
    display: inline;
    width: fit-content;
    padding: 14px;
    position: relative;
}

ul.logo li img {
    height: 140px;
}
@media (max-width:500px) {
    ul.logo li img {
        height: 26px;
    }
}
ul.logo li:last-child  img{
    height: 70px;
}
/* ul.logo li:after {
content: '';
width: 2px;
height: 100%;
background: #f6855b;
position: absolute;
right: 0;
top: 0;
} */
@media (max-width:500px) {
    ul.logo li:after {
        height: 50%;
        top: 30%;
    }
}
ul.logo li:last-child:after {
    display: none;
}

.navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 15px;
    padding-left: 15px;
    margin-right: 7px;
}

.navbar-expand-lg .navbar-nav .nav-link:hover {
    padding-right: 20px;
    padding-left: 20px;
    margin-right: 7px;

}

.menu-block {

    width: 100%;
    position: relative;
    background: #E3BCB3
}

/*.menu-block::after{
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  background: inherit;
  z-index: 10;
  bottom: 0;
  transform-origin: left bottom;
  transform: skewY(1deg);

}*/


.nav-socials-wrapper ul {
    list-style-type: none;
    display: flex;
    gap: 0 12px;
    margin: 0;
    justify-content: flex-end;
    margin-right: 50px;
    padding: 15px 0;
}

.nav-socials-wrapper img {
    max-width: 30px;
    height: 30px;
    object-fit: contain;
    transition: 0s ease-in-out;
}

.nav-socials-wrapper img:hover {
    padding: 2px;
    background-color: #AA5F68;
    border-radius: 50%;
}

#menuToggle {
    display: block;
    position: relative;
    top: 0;
    right: 0;
    z-index: 999;
    -webkit-user-select: none;
    user-select: none;
    width: fit-content;
    margin: auto;
    margin-right: 0;
}

#menuToggle a {
    text-decoration: none;
    color: #ffffff;

    transition: color 0.3s ease;
}

#menuToggle a:hover {
    color: #EA378B;
}


#menuToggle input {
    display: block;
    width: 40px;
    height: 32px;
    position: absolute;
    top: -3px;
    right: 41px;

    cursor: pointer;

    opacity: 0;
    /* hide this */
    z-index: 2;
    /* and place it over the hamburger */

    -webkit-touch-callout: none;
}

/*
  * Just a quick hamburger
  */
#menuToggle .span-wrapper {
    width: fit-content;
    margin: auto;
    margin-right: 50px;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 5px;
}

#menuToggle span {
    display: block;
    width: 22px;
    height: 2px;
    margin-bottom: 5px;
    position: relative;
    background: #e9368b;
    border-radius: 3px;
    z-index: 1;

    transform-origin: 4px 0px;

    transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),
        background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),
        opacity 0.55s ease;
}

#menuToggle .span-wrapper span:first-child {
    transform-origin: 0% 0%;
}

#menuToggle .span-wrapper span:nth-last-child(2) {
    transform-origin: 0% 100%;
    width: 25px;
}

/* 
  * Transform all the slices of hamburger
  * into a crossmark.
  */
#menuToggle input:checked~.span-wrapper span {
    opacity: 1;
    background: #e9368b;
    transform: rotate(-45deg) translate(0, -3px);
}

/*
  * But let's hide the middle one.
  */
#menuToggle input:checked~.span-wrapper span:nth-last-child(2) {
    opacity: 0;
    transform: rotate(0deg) scale(0.2, 0.2);
}

/*
  * Ohyeah and the last one should go the other direction
  */
#menuToggle input:checked~.span-wrapper span:nth-last-child(3) {
    transform: rotate(45deg) translate(0px, -1px);
}

/*
  * Make this absolute positioned
  * at the top left of the screen
  */
#menu {
    position: fixed;
    top: 0;
    right: 0;
    width: 300px;
    height: 100%;
    padding: 50px 20px;
    padding-top: 100px;
    background: #1D2F3B;
    list-style-type: none;
    -webkit-font-smoothing: antialiased;
    /* to stop flickering of text in safari */

    transform-origin: 0% 0%;
    transform: translate(100%, 0);

    transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0);
}

#menu li {
    padding: 20px 0;
    font-family: 'Advent Pro', sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 1.2;
    color: #ffffff;
    text-align: center;
    transition: 0.3s ease-in-out;
}

#menu li:hover {
    color: #EA378B;
}

/*
  * And let's slide it in from the left
  */
#menuToggle input:checked~ul {
    transform: none;
}

@media (max-width:500px) {

    #menuToggle .span-wrapper {
        margin-right: 30px;
    }

    #menuToggle input {
        right: 23px;
    }

    .nav-socials-wrapper ul {
        margin-right: 35px;
    }
}


.section1 {
    width: 100%;
    position: relative;
    background: rgb(29,46,59);
    background: linear-gradient(135deg, rgba(29,46,59,1) 17%, rgba(29,46,59,1) 45%, rgba(170,39,100,1) 85%);
    /* background: url('../images/marble.png'); */
    /* background-attachment: fixed;
    background-size: cover; */
}

.section3 {
    width: 100%;
    position: relative;
    background: rgb(29,46,59);
    background: linear-gradient(135deg, rgba(29,46,59,1) 17%, rgba(29,46,59,1) 45%, rgba(170,39,100,1) 85%);
   
}

.header-content-wrapper {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#other-page-header {
    position: relative;
    background: radial-gradient(123.54% 32.79% at 49.9% 44.22%, #3A0011 0%, #2E010F 27%, #0F0508 75%, #060606 87%);
}

#other-page-header .header-content-wrapper {
    padding: 40px 0;
    position: relative;
    top: unset;
    left: unset;
    transform: unset;
}

#other-page-header .header-wrapper img {
    height: unset;
    max-width: 570px;
    margin-left: -50px;
    margin-top: -35px;
    margin-bottom: -35px;
}

#other-page-header .other-bg {
    width: 100%;
    height: max-content;
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover;
}

#other-page-header .top-left {
    position: absolute;
    top: 0;
    left: 0;
}

#other-page-header .middle-left {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(0, -50%);
}

#other-page-header .bottom-left {
    position: absolute;
    bottom: 0;
    left: 0;
}

#other-page-header .top-right {
    position: absolute;
    top: 0;
    right: 0;
}

#other-page-header .middle-right {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translate(0, -50%);
}

#other-page-header .bottom-right {
    position: absolute;
    bottom: 0;
    right: 0;
}

#other-page-header .top-left,
#other-page-header .bottom-left,
#other-page-header .top-right,
#other-page-header .bottom-right {
    width: 100%;
    max-width: 55.74px;
    object-fit: contain;
}

#other-page-header .middle-left,
#other-page-header .middle-right {
    width: 100%;
    max-width: 100px;
    object-fit: contain;
}

#other-page-header .homepage_main_text {
    font-size: 44px;
}

.question{
    font-size: 24px;
    color: #fff;
    line-height: 28px;
    font-family: 'Montserrat', sans-serif;
    font-style: normal;
    font-weight: bold;
    text-rendering: optimizeLegibility;
}
.question_row{
    margin-bottom: 5%;
}
.question_input{
    width: 100%;
    margin-top: 1%;
    margin-left: 0;
}
.pull-right{
    text-align: right;
}
@media only screen and (min-width:768px) and (max-width:991px) {

    .header-wrapper {
        padding-left: 12rem;
    }

    #other-page-header .homepage_main_text {
        font-size: 31px;
    }

    #other-page-header .header-wrapper img {
        margin-left: 0;
    }
}

@media (max-width:767px) {
    #other-page-header .header-wrapper img {
        margin-left: 0;
        margin-bottom: 0;
    }

    #other-page-header .homepage_main_text {
        font-size: 44px;
        padding-left: 7rem;
    }

    #other-page-header .homepage_main_text_small {
        max-width: 440px;
        font-size: 22px;
        padding-left: 7rem;
    }
}

@media only screen and (min-width:426px) and (max-width:575px) {

    #other-page-header .middle-left,
    #other-page-header .middle-right {
        max-width: 60px;
    }

    #other-page-header .homepage_main_text {
        font-size: 34px;
        padding-left: 3.5rem;
    }

    #other-page-header .homepage_main_text_small {
        font-size: 18px;
        padding-left: 3.5rem;
    }

    #other-page-header .header-wrapper img {
        margin-top: -25px;
    }
}

@media (max-width:425px) {

    #other-page-header .middle-left,
    #other-page-header .middle-right {
        max-width: 55px;
    }

    #other-page-header .homepage_main_text {
        font-size: 31px;
        padding-left: 1.5rem;
    }

    #other-page-header .homepage_main_text_small {
        font-size: 18px;
        padding-left: 1.5rem;
    }

    #other-page-header .header-wrapper img {
        margin-top: -25px;
    }

    #other-page-header .btn-header {
        font-size: 12px;
    }

}

@media (max-width:320px) {

    #other-page-header .btn-header {
        margin-top: 1rem;
    }
}

.abpbh-catchup-at-cara-mengundi {
    background: #E7A693;
    padding: 50px 0;
    overflow: hidden;
}

.video-abpbh-section {
    background-color: #E5AAB1;
    padding: 80px 0;
}

.abpbh-catchup-33-section {
    background: #E7A693;
    padding: 70px 0;
}


@media (max-width:575px) {

    .video-abpbh-section,
    .abpbh-catchup-33-section {
        padding: 50px 0;
    }
}


.section2 {
    padding: 50px 0px;
    background: rgb(29,46,59);
    background: linear-gradient(135deg, rgba(29,46,59,1) 17%, rgba(29,46,59,1) 45%, rgba(170,39,100,1) 85%);
    position: relative;
}

@media (max-width:575px) {
    .section2 {
        padding: 60px 0px;
    }
}

.section3 {
    padding: 40px 0px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.section3::before {

    content: "";
    background-image: url('../images/sbg1.png');
    background-size: cover;
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    opacity: 0.5;
}
.section4 {

        width: 100%;
        /* height: 100%; */
        position: absolute;
        /* background: linear-gradient(-30deg,#e96793, #da546c, #f6855b, #ffc234, #ffe390); */
        /* background-size: 600% 100%;
        animation: gradient 16s linear infinite;
        animation-direction: alternate; */
    
    
    /* background: linear-gradient(178deg, #00000099, transparent), url(../images/FAMILI_DUO_2024_KV_FINAL_BACKGROUND.jpg); */
    /* background-size: cover; */
    /* position: relative; */
    /* background-attachment: fixed; */
    /* background-position: center; */
    /* background-repeat: no-repeat; */
}
@keyframes gradient {
    0% {background-position: 0%}
    100% {background-position: 100%}
}

#preloader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1020;
    height: 100%;
    width: 100%;
    display: table;
    background:(url(../images/RR2025-Background-Blue-HiRes.png));
    /* background: linear-gradient(135deg, rgba(29,46,59,1) 17%, rgba(29,46,59,1) 45%, rgba(170,39,100,1) 85%); */
   
    /* background: linear-gradient(-30deg,#e96793, #da546c, #f6855b, #ffc234, #ffe390); */
    /* background-repeat: no-repeat !important;
    background-size: cover !important; */
}

#loader {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}
.line-scale>div:nth-child(1) {
    -webkit-animation: line-scale 1s -0.4s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
    animation: line-scale 1s -0.4s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
}

.line-scale>div:nth-child(2) {
    -webkit-animation: line-scale 1s -0.3s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
    animation: line-scale 1s -0.3s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
}

.line-scale>div:nth-child(3) {
    -webkit-animation: line-scale 1s -0.2s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
    animation: line-scale 1s -0.2s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
}

.line-scale>div:nth-child(4) {
    -webkit-animation: line-scale 1s -0.1s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
    animation: line-scale 1s -0.1s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
}

.line-scale>div:nth-child(5) {
    -webkit-animation: line-scale 1s 0s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
    animation: line-scale 1s 0s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
}

.line-scale>div {
    background-color: #fff;
    width: 12px;
    height: 50px;
    border-radius: 10px;
    margin: 4px;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    display: inline-block;
}

@-webkit-keyframes line-scale {
    0% {
        -webkit-transform: scaley(1);
        transform: scaley(1);
    }

    50% {
        -webkit-transform: scaley(0.4);
        transform: scaley(0.4);
    }

    100% {
        -webkit-transform: scaley(1);
        transform: scaley(1);
    }
}

@keyframes line-scale {
    0% {
        -webkit-transform: scaley(1);
        transform: scaley(1);
    }

    50% {
        -webkit-transform: scaley(0.4);
        transform: scaley(0.4);
    }

    100% {
        -webkit-transform: scaley(1);
        transform: scaley(1);
    }
}


.bgads {
    /* background: #E7A693; */
    position: relative;
}

.btn-undi {
    color: #fff;
    background-color: #EF685A;
    border-color: #EF685A;

}


.btn-undi:hover {
    color: #fff;
    background-color: #f88478;
    border-color: #f88478;
}

.LOGO-01 {
    /*  padding-top:50px;*/
    position: relative;
    right: -191px;
}

.LOGO-01 img {
    width: 100%;
    object-fit: contain;

}

.btn-plus {
    background: #048c63;
    width: 50px;
    font-size: 24px;
    line-height: 0;
    font-weight: bold;
}

.btn-minus {
    background: #bb1414;
    width: 50px;
    font-size: 24px;
    line-height: 0;
    font-weight: bold;
}
.terms-and-condition{
    text-decoration: none;
}
@media screen and (max-width:1024px) {
    .LOGO-01 {
        padding-top: 50px;
        position: relative;
        right: -92px;
    }
}

@media screen and (max-width:768px) {
    .LOGO-01 {
        padding-top: 50px;
        position: relative;
        right: -65px;
    }

    .pt-100 {
        padding-top: 50px;
    }

    .abpbh-card {
        text-align: center;
    }

    .sticky {

        width: 100%;
    }

    .section1::after {
        display: none;
    }


}


@media screen and (max-width:414px) {
    .LOGO-01 {
        padding-top: 50px;
        position: relative;
        right: -44px;
    }

    h1 {
        font-size: 40px;
    }
}

.hastag {
    color: #fff;
    font-size: 30px;
    text-shadow: 1px 2px 3px black;
}

.bg-v {
    background: linear-gradient(328deg, rgba(217, 95, 250, 1) 38%, rgba(255, 255, 255, 1) 50%, rgba(176, 217, 250, 1) 61%, rgba(110, 74, 218, 1) 105%);
    border-radius: 10px;
    box-shadow: 1px 2px 3px black;
}

.btn-abp {
    border-radius: 10px;
    box-shadow: 1px 2px 3px black;
}

.border-gradient {
    border-top: 10px solid;
    border-image-slice: 1;
    border-width: 4px;
    border-image-source: linear-gradient(90deg, rgb(204 204 204) 3%, rgb(255, 255, 255) 40%, rgb(219 220 222) 95%);
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
}

.border-gradient-bottom {
    border-bottom: 10px solid;
    border-image-slice: 1;
    border-width: 4px;
    border-image-source: linear-gradient(90deg, rgb(204 204 204) 3%, rgb(255, 255, 255) 40%, rgb(219 220 222) 95%);
    border-left: 0;
    border-right: 0;
    border-top: 0;
}

.overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    padding: 20px;
    background-color: rgba(0, 0, 0, 0.7); /* Optional: semi-transparent background */
    color: white; /* Optional: text color */
    text-align: center; /* Optional: center text */
    z-index: 9999;
}

.ad-container.hidden {
    display: none !important;
  }


.ofh {
  overflow: hidden;
}

.half-circle-ribbon {
    background: #EA4335;
    color: #FFF;
    height: 60px;
    width: 60px;
    text-align: right;
    padding-top: 10px;
    padding-right: 10px;
    position: absolute;
    top: -1px;
    right: -1px;
    flex-direction: row;
    border-radius: 0 0 0 100%;
    border: 1px dashed #FFF;
    box-shadow: 0 0 0 3px #EA4335;
  }




.ribbon::after{
    position: absolute;
    content: attr(data-label);
    top: 0;
    font-size: clamp(0.625rem, 0.4243rem + 0.9174vw, 1.25rem);
    padding: 1px 7px 0px 15px;
    right: 0px;
    background-color: #ffef30;
    z-index: 13;
    font-weight: bold;
    border-bottom-left-radius: 20px;
    color: #000;
}

.form-control.is-valid, .was-validated .form-control:valid,.form-control.is-invalid, .was-validated .form-control:invalid{
    background-image: none;
}

.btn-close {
    cursor: pointer;
}

.zoom {
    position: relative;
    cursor: pointer;
}

.zoom:before,
.zoom:after {
    opacity: 0;
    -webkit-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
}

.zoom:hover:before,
.zoom:hover:after {
    opacity: 1;
}

/* .zoom:before {
    content: "\f00e";
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    width: fit-content;
    top: 40%;
    font-size: 43px;
    color: #fff;
    z-index: 1;
} */
 .zoom:before {
    content: "\f62c";
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    display: inline-block;
  font-family: bootstrap-icons !important;
  font-style: normal;
  font-weight: 400 !important;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  vertical-align: -.125em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  width: fit-content;
  top: 40%;
  font-size: 43px;
  color: #fff;
  z-index: 1;
 }
.zoom:after {
    content: '';
    background: rgba(0, 0, 0, 0.7);
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
}

#submitButton > div {
    width: fit-content;
}

#submitButton > div .loader {
    margin: -2px 9px;
}

.form-check-input.is-invalid ~ .form-check-label,
.was-validated .form-check-input:invalid ~ .form-check-label {
    color: #fff;
}
.form-check-input.is-valid ~ .form-check-label,
.was-validated .form-check-input:valid ~ .form-check-label {
    color: #fff;
  }
  .modal-thumb{
    height: 100% !important;
  }
 .s-content{
    background-image:url(../images/RR2025-Background-Blue-HiRes.png);
 }
 @media only screen and (max-width: 430px) { 
    .question{
        font-size: 12px;
        line-height: normal;
    }
    .question_input{
        height: 40px;
    }
 }