.mob-banner{
  display: none;
}
@media only screen and (min-width: 320px) and (max-width: 550px) {
    .subscription-form .options{
        display: inline-block !important;
      }
      .subscription-form .question {
         width: 100%;
      }
      .subscription-form .option {
        margin-bottom: 11px;
      }
    .header-sec-outer .navbar-brand .logo-header img {
        width: auto !important;
        height: 50px !important;
        max-width: 200px !important;
    }
    .profile-image .user-nam {
        font-size: 14px;
    }
    .profile-image .dropdown-item {
        font-size: 14px;
    }
    .sl-dashboard-title h4 {
        font-size: 17px;
    }
    .coming_soon_outer.error_entry .coming_soon_heading h4 span {
        font-size: 18px;
    }
    .coming_soon_outer.error_entry .coming_soon_heading h4{
        font-size: 16px;
    }
    .coming_soon_outer.error_entry .coming_soon_logo img {
        height: 70px;
    }
}
@media only screen and (min-width: 320px) and (max-width: 450px) {
    .otp-input{
        width: 40px;
        margin: 0 5px;
    }
    .creat-acc-link p a{
        display: block;
    }

    .view-prize-body .col-xl-3 {
        -ms-flex: 0 0 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    #rankingArea .single-ind-prizes-sec ,
    #rankingAreaAdjust .single-ind-prizes-sec {
        -ms-flex: 0 0 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
   
}

@media only screen and (min-width: 320px) and (max-width: 500px) {
  .full-w-match-pr #match-questions ul li{
      padding: 10px;
 }
  .full-w-match-pr #select_list_answers ul li{
      padding: 10px 20px;
 }
  #select_list_questions {
      width: 40%;
 }
  #select_list_answers {
      width: 60%;
 }
  #select_list_answers ul {
      width: 95%;
 }
  #predict-winn h4{
      padding: 10px 0;
 }
  #match-questions ul li img {
      max-height: 45px;
      width: auto;
      height: 40px;
      object-fit: contain;
 }
  .match-predict-head .heading-sec {
      padding: 20px 13px;
 }
  #predict-winn .camp-new-match-head h4{
      font-size: 18px;
 }
  .camp-new-match-head #getTimer {
      font-size: 18px;
 }
  .answers a .opt-label{
      padding: 10px 15px;
      border-radius: 6px 0 0 6px;
 }
  .contest-form .google-btn{
      width: 100%;
 }

 .game-summary {
    display: inline-block;
    width: 50%;
    max-width: 150px;
  }
  .game-summary .summary-item {
    justify-content: space-between;
    flex-direction: inherit;
    align-items: inherit;
  }


  .header-sec-outer .container .col-xl-12{
    /* display: inline-block !important;
    width: 100% !important; */
  }
  .navbar-brand {
    width: 100% !important;
    text-align: center;
  }
  .header-sec-outer .navbar-brand .logo-header img{
    height: 60px;
  }
  .wheel-wrapper #wheel-container #wheel .part .name img {
    height: 60px !important;
    width: 60px !important;
    object-fit: contain !important;
  }
  .reg-successful-inn h3,
  .all-thebest h4 {
    font-size: 20px !important;
  }
  .phone-numbers-inn {
    text-align: center;
  }
  .phone-num-list {
    display: inline-block;
    width: auto;
    margin: 0 auto;
  }
  .phone-numbers-inn ul li:after {
    display: none;
  }
  .phone-numbers-inn .place {
    width: 130px;
    display: inline-block;
    text-align: left;
  }
  .phone-numbers-inn ul li{
    margin-bottom: 15px !important;
    display: flex;
  }

  .num-bonus-cardupload {
    display: inline-block;
  }
  .num-bonus-cardupload .bonus-choose-date {
    margin-right: 0;
    margin-bottom: 20px;
  }
  .num-bonus-cardupload  #datepicker{
    margin-right: auto;
    margin-left: inherit;
  }

  .bonus-choose-date #ui-datepicker-div {
  left: 0 !important;
}

  .num-bonus-cardupload .form-control{
    max-width: 100%;

  }
  .num-bonus-cardupload .form-control:focus{
    border-color: #666;
  }
  .num-bonus-cardupload  #frmBonusCardUpload{
    width: 100%;
    margin-top: 20px;
  }

  .num-bon-test {
    margin-bottom: 20px;
    margin-right: 0;
  }

}

@media only screen and (min-width: 501px) and (max-width: 767px) {

    .phone-numbers-inn {
        text-align: center;
    }
    .phone-num-list {
        display: inline-block;
        width: 100%;
        margin: 0 auto;
    }
    .phone-numbers-inn ul li:after {
        display: none;
    }
    .phone-numbers-inn .place {
        width: 130px;
        display: inline-block;
        text-align: left;
    }
    .phone-numbers-inn ul li{
        margin-bottom: 15px !important;
        display: flex;
        width: 50%;
        float: left;
    }
 .bonus-choose-date #ui-datepicker-div {
  left: 0 !important;
}
     
      
}

@media only screen and (min-width: 320px) and (max-width: 767px) {
  .thanks-messa {
      margin-top: 0;
 }
  .thanks-messa-left, .thanks-messa-right{
      width: 100%;
 }
  .thank-you-text {
      font-size: 25px;
 }
  .thanks-messa-right img {
      height: 300px !important;
      width: auto !important;
 }
  .desk-banner{
      display: none;
 }
  .mob-banner{
      display: block;
 }
  .scroller-ship-bg h4 {
      position: relative;
      left: inherit;
      top: inherit;
      transform: inherit;
      padding: 40px 25px;
 }
  .scroller-ship-bg {
      height: auto !important;
      text-align: center;
 }
  .scroller-ship-bg img {
      position: relative;
      right: inherit !important;
      top: inherit !important;
      transform: inherit !important;
 }
  .scroller-ship-bg span{
      font-size: 10px;
      right: -5px;
 }
  .employee-hr-col {
      -ms-flex: 0 0 50%;
      flex: 0 0 50%;
      max-width: 50%;
 }
  .scroller-ship-bg h4{
      font-size: 20px;
      line-height: 30px 
 }
  .quiz-start-screen h5{
    font-size: 18px;
    line-height: 25px;
 }
  .quiz-start-screen h5 br{
      display: none;
 }
  .contest-form .form-group {
      margin-bottom: 25px;
 }
  .contest-form .form-control{
      min-height: 45px;
 }
  .cash-prizes{
      margin-top: -50px;
 }
  .scroller-ship-bg h4{
      padding: 20px 25px;
      text-align: center;
 }
  .coming_soon_inner {
      width: 90%;
      max-width: inherit ;
      min-width: inherit;
 }
 /* Match The Following Starts */
  .full-w-match-pr {
      height: auto;
 }
  .full-w-match-pr #predict-winn {
      margin-left: 0;
      margin-right: 0;
 }
  .match-pr-inner {
      max-width: 540px;
 }
  .full-w-match-pr #match-questions {
      padding-left: 0;
      padding-right: 0;
 }
  .full-w-match-pr #select_list_questions, .full-w-match-pr #select_list_answers {
      padding: 0 15px;
 }
  .match-pr-inner .match-predict-head {
      margin-top: 20px;
 }
 /* Match The Following Ends */
 /* Drag and Drop Starts */
  .full-w-match-drag{
      padding-left: 0;
      padding-right: 0;
 }
  .drag-drop-left {
      margin-bottom: 30px;
 }
  #getTimer {
      font-size: 18px;
 }
  .preview-btn {
      font-size: 18px;
      padding: 7px 25px;
      border-radius: 5px;
 }
  .drag-drop-left h3, .drag-drop-right h3{
      padding: 0;
 }
  .list div{
      margin: 0 10px 8px 0;
 }
  .list {
      margin-top: 30px;
 }
  .drop-zone {
      min-height: 150px;
     /* max-height: 220px;
      */
      overflow-y: auto;
      padding-top: 30px;
 }
 /* Drag and Drop Ends */
  .full-w-match-top {
      -ms-flex-direction: column !important;
      flex-direction: column !important;
 }
  .match-name-btn-left{
      order: 2;
      margin-bottom: 20px;
 }
  .full-w-match-top .countdown-outer{
      order: 1;
 }
  .full-w-match-top #startGame {
      padding-left: 0;
 }
  .drag-drop-content.full-w-match-drag .container {
      -ms-flex-direction: column !important;
      flex-direction: column !important;
      display: -ms-flexbox !important;
      display: flex !important;
 }
  .row.drag-drop-head {
      order: 1;
 }
  .list.drag-drop-list {
      order: 2;
      min-height: auto;
      margin-top: 0;
      margin-bottom: 15px;
 }
  .row.drag-drop-colum {
      order: 3;
 }
  .match-name-btn-left{
      margin-bottom: 0;
 }
  .drag-drop-content.full-w-match-drag {
      padding-bottom: 50px;
 }
  #dragModal .modal-content {
      width: 85%;
      margin: 0 auto;
 }
  #dragModal .modal-title{
      font-size: 25px;
 }
  #dragModal .modal-footer{
      padding: 0;
 }
  .thanks-messa-left .icon-match {
      width: 33.333%;
      margin-left: 0;
      margin-right: 0;
 }
  .thanks-messa-left .icon-match h4 {
      font-size: 14px;
 }
 /* New Banner Starts */
  .campaign-new-banner .carousel-caption h4 {
      font-size: 30px;
      line-height: 40px;
 }
  .campaign-new-banner .carousel-caption h3 {
      font-size: 50px;
      line-height: 60px;
 }
  .banner-image-outer img {
      object-fit: cover;
     /* height: 200px;
      */
      width: 100%;
      object-position: bottom;
 }
 /* New Banner Ends */
  .form-sec-left {
      margin-top: 0;
      margin-bottom: 25px !important;
 }
  .banner-right-form{
      box-shadow: 0px 0px 7px 3px rgba( 31, 38, 135, 0.30 );
 }
  #txtName-error, #txtMobile-error, #txtEmail-error {
      opacity: 0;
 }
  .form-control.has-error{
      border-color: red;
 }
  .introjs-tooltiptext{
      font-size: 18px;
 }
 /* Match the following Starts */
  .match-pr-inner #getTimer {
      margin-bottom: 0;
      font-weight: 600;
 }
  .full-w-match-pr #predict-winn {
      padding-top: 20px;
 }
  #predict-winn h4 {
      font-size: 18px;
 }
  .full-w-match-pr #match-questions {
      padding-top: 20px;
 }
 /* Match the following Ends */
  .congrats h3 {
      font-size: 25px;
 }
  .congrats-text {
      font-size: 18px;
      padding: 7px 20px;
 }
  p.quiz-results {
      padding: 20px;
 }
  .how-to-play-web{
      display: none;
 }
  .how-to-play-mob{
      display: block;
 }
 /* Thank You Starts */
  .modal-content{
      width: 95%;
      margin: 0 auto;
 }
  .thank-banner-bg {
      height: 130px;
 }
  .thank-banner-bg h3 {
      font-size: 30px;
 }
  #result-modal .modal-body{
      font-size: 25px;
 }
  .score-left-sec {
      margin-bottom: 20px;
 }
 /* Thank You Ends */
 /* Already Participate Starts */
 
 .already-particip-col {
    width: 90%;
    padding: 20px;
 }
  .already-particip-col .already-banner-bg h3{
      font-size: 40px !important;
      margin-bottom: 5px ;
 }
 .already-particip-col .already-banner-bg h4{
    font-size: 30px !important;
 }
 /* Already Participate ends */
  .jigsaw-section-outer #getTimer {
      font-weight: 600;
      line-height: 44px;
 }
  .quiz-section-outer .desk-timer{
      margin-top: 25px !important;
 }
  #mypreview .close {
      position: absolute;
      top: -15px;
      right: -15px;
      margin: 0;
      padding: 0;
      background: #fff;
      width: 30px;
      height: 30px;
      border-radius: 50%;
      opacity: 1;
 }
  #mypreview .close i {
      font-size: 18px;
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translateX(-50%) translateY(-50%);
 }
 /* Match the following text */
  .full-w-match-pr .match-text .match-pr-inner {
      -ms-flex: 0 0 100%;
      flex: 0 0 100%;
      max-width: 100%;
 }
  .full-w-match-pr .match-text #select_list_questions {
      width: 80%;
 }
  .full-w-match-pr .match-text #select_list_answers {
      width: 40%;
 }
  .full-w-match-pr .match-text #select_list_answers ul li {
      padding: 10px 15px;
 }
 /* Match the following Ends */
 /* Jigsaw Starts */
  .puzzle-left{
      padding: 0;
 }
  .puzzle-right {
      /* display: -ms-inline-flexbox !important;
      display: inline-flex !important; */
      margin: 15px auto 0 auto;
      width: 100% !important;
 }
  .puzzle-right #startGame{
      width: 100%;
 }
  .jigsaw-preview img {
      width: 250px;
 }
 /* Jigsaw Ends */
  .answers a .opt-label{
      padding: 10px 15px;
      border-radius: 7px 0 0 7px;
 }
  .question-container .question {
      margin-bottom: 25px;
 }
  #quiz #timer {
      position: relative;
      margin: 6px 0;
 }
  .question img {
      width: 100%;
      max-width: 100%;
      object-fit: contain;
      object-position: left;
 }
/* Video Quiz Starts */
.video-quiz-question video, .video-quiz-question iframe {
    width: 100%;
  }
  
  /* Video Quiz Ends */

  /* Memmory Game Starts */
  .swal-success-content .icon-outer {
    height: 80px;
  }
  .swal-success-content .icon {
    width: 60px;
    height: 60px;
  }
  
  /* Memmory Game Ends */ 

  .answers img {
    height: 100px;
    width: auto;
  }
  .quiz-video{
    margin-top: 10px;
  }

  .mysteryword-heading {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  .mysteryword-heading h3{
    margin-bottom: 0;
  }
  .col-xl-4.mysteryword-right {
    margin-top: 30px;
  }
  .mysteryword-right .rotate-text {
    text-align: left;
    margin-top: 30px;
  }

    /* Image Quiz Option on Right Starts */
    .img-question-container.image-quiz .answers{
        margin-top: 10px;
    }
    .img-question-container .answers li {
        margin-bottom: 20px;
    }
    .img-question-container.image-quiz .answers li {
        width: 100%;
    }
    /* Image Quiz Option on Right Ends */

    .img-question-container .question img{
        max-height: 150px;
    }
    .header-sec-outer .col-xl-12 {
        padding: 0;
      }
      .header-sec-outer .navbar-brand {
        width: 50% !important;
        float: left;
        text-align: left;
      }
      .question-container .question{
        padding-right: 0;
      }
      .quiz-results-screen {
        margin: 20px 0 10px 0;
      }

      .jigsaw-section-outer > .container-fluid {
        padding: 0;
      }
      .jigsaw-section-outer .puzzle-left {
        padding: 30px 0 0 0;
      }
      .jigsaw-section-outer .puzzle-right {
        padding-left: 15px;
        margin-top: 0;
      }
      .jigsaw-section-outer  .puzzle-right .rotate-text {
        text-align: center;
        margin-top: 20px;
      }
      .jigsaw-section-outer   .rotate-text {
        width: auto;
        margin: 0 0 0 20px !important;
      }
      .jigsaw-section-outer   #startGame{
        justify-content: inherit !important;
        -ms-flex-pack: center !important;
        justify-content: center !important;
      }
      .jigsaw-section-outer .jigsaw-preview {
        margin-top: 20px;
        text-align: center;
      }
 

      .times-up-outer.match-drag-times-up {
        max-width: 90%;
      }
      .match-drag-alre .already-particip-col {
        width: 90%;
        padding: 20px !important;
    }
      
    .drag-drop-head .full-w-match-top .match-name-btn-left{
        margin-top: 15px;
    }
    .quiz-questions-state #timer {
        margin: 0 !important;
        top: 0;
    }
    .contest-expired-inner{
        min-width: inherit;
        width: 95%;

    }
    /* Match The Following */
    .match-predict-head .heading-sec {
        display: inline-block !important;
        text-align: center;
        padding: 10px;
    }
    .match-predict-head .heading-sec #getTimer{
        display: inline-block;
        float: inherit;
        margin-top: 10px;
        width: 100px;
        min-width: 100px;
        font-size: 25px;
    }
    
    /* Match The Following */
    .wheel-wrapper #wheel-container #wheel .part .name img {
        width: 80px !important;
        height: 80px !important;
        object-fit: contain !important;
    }

    /* Quiz Image Starts */
    #quiz-pic-sec {
        text-align: center;
        margin-bottom: 20px;
    }
    #quiz-pic-sec img {
        max-height: 300px;
        width: 100%;
        height: auto;
    }
    /* Quiz Image Ends */

    /* Snake And Ladder User Admin Starts */
    .home-section{
        width: 100%;
    }
    .sidebar {
        position: fixed;
        width: 300px;
        left: -100%;
        z-index: 99;
        background: #fff;
        height: 100%;
        margin-top: 0;
        display: inline-block !important;
        top: 0;
        z-index: 99;
        padding-bottom: 32px;
        border-radius: 0;
        -webkit-transform: translate3d(0, 0, 205px);
        -moz-transform: translate3d(0, 0, 205px);
        transform: translate3d(0, 0, 205px);
        -webkit-transition: all 500ms ease-in-out;
        -moz-transition: all 500ms ease-in-out;
        transition: all 500ms ease-in-out;
        overflow-y: auto;
    }
    .menu-slide-open{
        left: 0;
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        -webkit-transition: all 500ms ease-in-out;
        -moz-transition: all 500ms ease-in-out;
        transition: all 500ms ease-in-out;
    }
    .sl-dashboard-title #userdash-mobicon{
        display: block;
        /* background-image: linear-gradient(to bottom, #206998, #318cc7); */
        color: #fff;
        border-radius: 3px;
    }
    .sl-dashboard-title,
    .sl-dashboard-sec{
        padding-left: 0;
        padding-right: 0;
    }
    .home-section{
        margin-top: 20px;
    }
   .sidebar-overlay{
        display: inline-block;
        background: rgba(0, 0, 0, .2);
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        z-index: 9;
        left: -100%;
        -webkit-transform: translate3d(0, 0, 205px);
        -moz-transform: translate3d(0, 0, 205px);
        transform: translate3d(0, 0, 205px);
        -webkit-transition: all 300ms ease-in-out;
        -moz-transition: all 300ms ease-in-out;
        transition: all 300ms ease-in-out;
   }
   .sidebar-overlay.show{
        left: 0;
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        -webkit-transition: all 300ms ease-in-out;
        -moz-transition: all 300ms ease-in-out;
        transition: all 300ms ease-in-out;
   }
   .over-hidden{
    overflow: hidden !important;
   }
    #close-icon {
        position: absolute;
        right: 10px;
        top: 10px;
        width: 30px;
        height: 30px;
        cursor: pointer;
    }
    #close-icon i {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translateX(-50%) translateY(-50%);
        font-size: 40px;
        color: #f5af16;
    }
    .dropdown-toggle-pro{
        width: 30px;
        height: 30px;
    }
    .first-letter{
        font-size: 14px;
    }
   .sl-dashboard-outer{
    padding: 0;
   }
   #close-icon{
    display: block;
   }
    /* Snake And Ladder User Admin Ends */

    /* Find The Person Starts */
 
    .find-person-img{
        height: 400px;
        width: 100%;
    }
    .find-person-img img{
        object-fit: contain;
        height: 400px;
        object-position: top center;
    }
    .find-person-head #startGame {
        position: relative;
        float: right;
        top: inherit !important;
        right: inherit;
        margin-bottom: 10px;
    }
    .find-person-head h4 {
        display: inline-block;
        width: 100%;
    }
    .find-person-head{
        margin-bottom: 10px;
    }
    .find-person-name h4{
        font-size: 20px;
    }
    .find-person-code input{
        max-width: 170px;
    }
    #find-person {
        padding-top: 15px;
    }
    .user-id {
        width: 100%;
        max-width: 400px;
    }
   
    /* Find The Person Ends */

    .frmUsers .smal-text {
        position: relative;
        bottom: inherit;
    }

    .times-up-outer .times-up-inner{
        width: 95%;
    }

    .opt-outer{
        width: 95%;
        max-width: 450px;
    }
    .opt-terminate{
        width: 95%;
        padding: 20px;max-width: 450px;
    }
    
    /* Sign Up Starts */
    .banner-form-sec{
        padding: 40px 0;
    }
    .banner-form-left h2 {
        font-size: 25px;
        line-height: 35px;
    }
    .banner-form-left h4{
        font-size: 25px;
    }
    .banner-form-left {
        margin-bottom: 30px;
    }
    /* Sign Up Ends */


    /* Registration Successful Starts */
    .reg-succ-outer {
        margin-top: 40px;
    }
    .reg-successful-inn h3{
        font-size: 25px;
    }
    .reg-successful-inn .card-body h5{
        font-size: 17px;
  line-height: 22px;
    }
    .reg-successful-inn .card-outer{
        margin-top: 30px;
    }
    .reg-successful-inn .card-body {
        padding: 20px 15px;
        padding-bottom: 30px;
    }
    .reg-successful-inn .card ul li{
        font-size: 16px;
    }
    .all-thebest{
        margin-top: 30px;
    }
    .reg-successful-inn {
        width: 95%;
    }
    /* Registration Successful Starts */
    .prizes-head h4{
        font-size: 20px;
    }
    .prizes-head{
        margin-bottom: 40px;
    }
    .ind-prizes-icon{
        max-height: 180px;
    }
    .ind-prizes-icon img{
        height: 180px;
    }

    .subscription-form{
        display: inline-block ;
      }
      .subscription-form .question {
        margin-bottom: 10px;
      }

      .family-btm{
        display: none;
      }
      .schools-prizes .prizes-head h5 {
        font-size: 15px;
      }
      .prizes-sub-top {
        max-width: 220px;
        width: 100%;
      }
     .mano-login-form  .terms-condition-group .custom-checkbox {
        min-height: initial !important;
        height: inherit !important;
      }
      .prizes-sub-head{
        margin-top: 25px;
      }
      .schools-prizes .prizes-head {
        margin-bottom: 30px;
      }
      .individual-prizes {
        margin-top: 30px;
        margin-bottom: 20px;
      }
      .banner-form-desk{
        display: none;
      }
      .banner-form-mob{
        display: block;
      }
      .phone-numbers-inn ul li{
        font-size: 13px;
 
        margin-bottom: 5px;
      }
      div:where(.swal2-container) h2:where(.swal2-title){
        font-weight: 500 !important;
        font-size: 22px !important;
      }
     
      div:where(.swal2-container) .swal2-html-container{
        font-size: 16px !important;
      }
      .congrats-thanks {
        font-weight: 400;
        font-size: 14px;
      }
      .sl-dashboard-title  .card-head.mob-menu-tilte {
        position: relative;
      }
      .only-mobile{
        display: block;
      }
      .sl-dashboard-title .card {
        border-radius: 8px;
        padding: 10px 20px;
      }
      .sl-dashboard-title #userdash-mobicon{
        font-size: 40px;
      }
      .user-points .card-head {
        display: inline-block !important;
        width: 100%;
        text-align: left;
      }
      .user-points .card-head h4{
        margin-bottom: 15px;
      }
      .user-points .card-head  #datepicker {
        margin-right: auto;
        margin-left: inherit;
      }
      .earn-points-outer .mt-30 {
        margin-bottom: 15px;
      }
      .sl-dashboard-title h4 {
        font-size: 20px;
      }
      .general-rule-bg h6{
        line-height: 25px;
        font-size: 17px;
      }
      .clientsec-heading{
        margin-bottom: 15px;
      }
      .view-prize-body .col-xl-3 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
      }

      .bonus-card-input {
        margin-bottom: 20px;
      }

    #rankingArea .single-ind-prizes-sec,
    #rankingAreaAdjust .single-ind-prizes-sec {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
      
    .school-ranking-form .school-ranking-sec form {
        margin: 0;
    }
    .last-day-answr {
        display: block;
        font-size: 14px;
        font-weight: 400;
        margin-top: 9px;
    }
    .lastday-ans-hea h4 {
        font-size: 20px;
      }
 
.bonus-card-label {
  margin-top: 10px;
}
.num-bonus-cardupload #txtBonusUpFile {
    min-height: 40px;
  }

  .num-bon-test {
    margin-right: 0;
  }

  .no-contest-today {
    width: 100%;
    max-width: 100%;
  }


}   

@media only screen and (min-width: 320px) and (max-width: 480px) {
  .campaign-new-banner .carousel-caption h4{
      font-size: 20px !important;
      line-height: 30px !important;
 }
 /* Spin the Wheel Starts */
  .wheel-wrapper {
      flex: 0 0 20rem;
 }
  .wheel-wrapper #wheel-container {
      height: 20rem;
      padding: 15px;
 }
  .wheel-wrapper #wheel-container #spin-action {
      width: 50px;
      height: 50px;
 }
  .wheel-wrapper #wheel-container .marker {
      width: 31px;
      height: 22px;
 }
  .wheel-wrapper #wheel-container #wheel .part .name {
      font-size: 13px;
      padding: 0 20px 0 20px;
 }
  .wheel-wrapper #wheel-container #wheel .part .name img{
      width: 25px;
      height: 25px;
      margin-left: 5px;
      object-fit: contain;
 }
 /* Spin the Wheel Ends */
  .contest-form h5{
      margin-bottom: 15px;
      font-size: 17px;
 }
  .quiz-results-screen {
      margin: 20px 0 10px 0;
 }
  .quiz-restart-btn{
      padding: 20px 30px !important;
 }
  .quiz-results {
      font-weight: 600;
 }
  .quiz-restart-btn {
      font-size: 15px;
 }
 /* New Banner Starts */
  .campaign-new-banner .carousel-caption h4 {
      font-size: 25px;
      line-height: 30px;
 }
  .campaign-new-banner .carousel-caption h3 {
      font-size: 30px;
      line-height: 35px;
 }
  .banner-image-outer img {
      object-fit: cover;
     /* height: 150px;
      */
      width: 100%;
      object-position: bottom;
 }
 /* New Banner Ends */
  .jigsaw-preview img {
      width: 200px !important;
 }


 .quiz-video .video {
    height: 200px;
    width: 100%;
  }
  .jigsaw-section-outer #getTimer{
    padding: 0 10px;
  }
  .jigsaw-section-outer  #getTimer {
    font-size: 16px;
  }
 
  .jigsaw-section-outer   .rotate-text span {
    font-size: 16px;
    padding: 9px 10px;
  }

  .select2-results__options li {
    font-size: 14px;
  }
  .banner-form-sec{
    background-size: cover;
    background-position: 100%;
  }
}
@media only screen and (min-width: 481px) and (max-width: 767px) {
 /* Spin the Wheel Starts */
  .wheel-wrapper {
      flex: 0 0 26rem;
 }
  .wheel-wrapper #wheel-container {
      height: 26rem;
      padding: 22px;
 }
  .wheel-wrapper #wheel-container #spin-action {
      width: 50px;
      height: 50px;
 }
  .wheel-wrapper #wheel-container .marker {
      width: 31px;
      height: 22px;
      transform: translate(-62%, -50%);
 }
  .wheel-wrapper #wheel-container #wheel .part .name {
      font-size: 13px;
      padding: 0 20px 0 20px;
 }
  .wheel-wrapper #wheel-container #wheel .part .name img{
     
      margin-left: 5px;
      object-fit: contain;
 }
 /* Spin the Wheel Ends */


 /* Client Contest List Starts */
.col-xl-4.client-single-contest {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .play-btn-outer-sec .red-btn{
    padding: 10px 15px 8px 15px;
}
.client-sin-con-img {
    height: 150px;
  }
/* Client Contest List Ends */

.image-quiz .answers li {
    width: 50%;
  }
  .quiz-video .video {
    height: 250px;
    width: 100%;
  }

  
  
}
@media only screen and (min-width: 501px) and (max-width: 991px) {
  .full-w-match-pr #predict-winn {
      padding-top: 20px;
 }
  .match-pr-inner #getTimer {
      margin-bottom: 0;
      font-weight: 600;
      margin-bottom: 0;
 }
  #match-questions ul li img {
      max-height: 45px;
      width: auto;
      height: 40px;
 }
  .match-predict-head .heading-sec {
      padding: 20px 15px;
 }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .form-sec{
      padding: 20px 0 140px 0;
 }
 /* Thank You Starts */
  .modal-content{
      width: 90%;
      margin: 0 auto;
 }
  .thank-banner-bg {
      height: 130px;
 }
  .thank-banner-bg h3 {
      font-size: 30px;
 }
  #result-modal .modal-body{
      font-size: 25px;
 }
  .score-left-sec {
      margin-bottom: 20px;
 }
 /* Thank You Ends */
 /* Already Participate Starts */
  .already-particip-col {
      width: 65%;
 }
  .already-particip-col .already-banner-bg h3{
      font-size: 40px !important;
      margin-bottom: 5px;
 }
 .already-particip-col .already-banner-bg h4{
    font-size: 30px !important;
 }
 /* Already Participate ends */
 /* Match The Following text Starts */
  .full-w-match-pr .match-text .match-pr-inner {
      -ms-flex: 0 0 70%;
      flex: 0 0 70%;
      max-width: 70%;
 }
  .full-w-match-pr #match-questions ul {
      max-width: 100%;
 }
  .full-w-match-pr .match-text #select_list_questions {
      width: 80%;
 }
  .full-w-match-pr .match-text #select_list_answers {
      width: 40%;
 }
 /* Match The Following text Ends */
  #quiz #timer {
      position: absolute;
      right: 15px;
      top: 0;
 }

 /* Video Quiz Starts */
.video-quiz-question video, .video-quiz-question iframe {
    width: 60%;
  }
  .quiz-video .video {
    height: 315px;
    width: 100%;
  }
  /* Video Quiz Ends */

/* Client Contest List Starts */
.col-xl-4.client-single-contest {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}

/* Client Contest List Ends */

.quiz-video .video {
    height: 300px;
    width: 80%;
  }

 #countdown .countdown-label {
    display: none;
  }
  #countdown #tiles {
    border-radius: 5px !important;
  }
  #countdown #tiles {
    font-size: 19px;
  }

  .mysteryword-heading {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  .mysteryword-heading h3{
    margin-bottom: 0;
  }
  .col-xl-4.mysteryword-right {
    margin-top: 30px;
  }
  .mysteryword-right .rotate-text {
    text-align: left;
    margin-top: 30px;
  }

  /* Image Quiz Option on Right Starts */
  .img-question-container.image-quiz .answers{
    margin-top: 15px;
   }
   .img-question-container .answers li {
    margin-bottom: 20px;
  }
  .img-question-container.image-quiz .answers li {
    width: 100%;
  }
  .img-question-container .question img{
    max-height: 110px;
  }
  /* Image Quiz Option on Right Ends */
  
  .jigsaw-section-outer .puzzle-right {
    padding-left: 15px;
  }
  .camp-new-match-head #getTimer{
  width: 105px;
    max-width: 110px;
  }


    /* Snake And Ladder User Admin Ends */
    .home-section{
        width: 100%;
    }
    .sidebar {
        position: fixed;
        width: 300px;
        left: -100%;
        z-index: 99;
        background: #fff;
        height: 100%;
        margin-top: 0;
        display: inline-block !important;
        top: 0;
        z-index: 99;
        padding-bottom: 32px;
        border-radius: 0;
        -webkit-transform: translate3d(0, 0, 205px);
        -moz-transform: translate3d(0, 0, 205px);
        transform: translate3d(0, 0, 205px);
        -webkit-transition: all 500ms ease-in-out;
        -moz-transition: all 500ms ease-in-out;
        transition: all 500ms ease-in-out;
        overflow-y: auto;
    }
    .menu-slide-open{
        left: 0;
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        -webkit-transition: all 500ms ease-in-out;
        -moz-transition: all 500ms ease-in-out;
        transition: all 500ms ease-in-out;
    }
    .sl-dashboard-title #userdash-mobicon{
        display: block;

        color: #fff;
        border-radius: 3px;
    }
    .sl-dashboard-title,
    .sl-dashboard-sec{
        padding-left: 0;
        padding-right: 0;
    }
    .home-section{
        margin-top: 20px;
    }
   .sidebar-overlay{
        display: inline-block;
        background: rgba(0, 0, 0, .2);
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        z-index: 9;
        right: -100%;
        -webkit-transform: translate3d(0, 0, 205px);
        -moz-transform: translate3d(0, 0, 205px);
        transform: translate3d(0, 0, 205px);
        -webkit-transition: all 500ms ease-in-out;
        -moz-transition: all 500ms ease-in-out;
        transition: all 500ms ease-in-out;
   }
   .sidebar-overlay.show{
        right: 0;
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        -webkit-transition: all 500ms ease-in-out;
        -moz-transition: all 500ms ease-in-out;
        transition: all 500ms ease-in-out;
   }
   .over-hidden{
    overflow: hidden !important;
   }
    #close-icon {
        position: absolute;
        right: 10px;
        top: 10px;
        width: 30px;
        height: 30px;
        cursor: pointer;
        display: block;
    }
    #close-icon i {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translateX(-50%) translateY(-50%);
        font-size: 40px;
        color: #f5af16;
    }
    .sl-position-box {
        -ms-flex: 0 0 66.666667%;
        flex: 0 0 66.666667%;
        max-width: 66.666667%;
    }
    .sl-edit-profile .form-group.col-xl-6 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
    /* Snake And Ladder User Admin Ends */


    /*  Manorama Quiz Starts 2024 Dec Starts */
    
    /*  Manorama Quiz Starts 2024 Dec Ends */

    .reg-successful-inn {
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%;
      }


    /* Sign Up Starts */
    .banner-form-sec{
        padding: 40px 0;
    }
    .banner-form-left h2 {
        font-size: 25px;
        line-height: 35px;
    }
    .banner-form-left h4{
        font-size: 25px;
    }
    .banner-form-left {
        margin-bottom: 30px;
    }
    /* Sign Up Ends */
    .family-btm{
        display: none;
    }
    .schools-prizes .prizes-head h5{
        font-size: 18px;
    }
    .individual-prizes {
        margin-bottom: 40px;
    }
    
    .banner-form-desk{
        display: none !important;
    }
    .banner-form-mob{
        display: block !important;
    }
    .col-xl-8.earn-points-outer {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .col-xl-4.earn-points-outer.total-point-col {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }

    .total-point-col .sl-dashboard-box {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
        margin-top: 30px;
        margin-bottom: 30px;
      }

      .only-mobile{
        display: block;
      }

      .sl-dashboard-title #userdash-mobicon {
        font-size: 40px;
      }
      .general-rule-bg h6{
        line-height: 25px;
        font-size: 17px;
      }
      #quiz #timer {
        position: absolute;
        right: 0;
        top: 22px;
      }
      .view-prize-body .col-xl-3 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
      }

     .bonus-card-input{
        -ms-flex: 0 0 40%;
        flex: 0 0 40%;
        max-width: 40%;
     }
     .bonus-card-upload{
        -ms-flex: 0 0 60%;
        flex: 0 0 60%;
        max-width: 60%;
      }

      #rankingArea .single-ind-prizes-sec,
      #rankingAreaAdjust .single-ind-prizes-sec {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
      }

      /* .last-day-answr {
        font-size: 18px;
        font-weight: 400;
        margin-top: 9px;
    } */

    .no-contest-today{
        width: 80%;
        max-width: 80%;
        margin: 0 auto 25px auto;
    }
}
@media only screen and (min-width: 320px) and (max-width: 991px) {
  .header-sec-outer .navbar.navbar-expand-lg {
      padding: 10px 15px 10px 15px;
 }
  .header-sec-outer .navbar-brand .logo-header img {
      width: auto;
      height: 60px;
      max-width: 300px;
 }
  .form-sec {
      background: #fff;
      padding: 20px 0 90px 0;
 }
  .form-sec p{
      font-size: 18px;
      line-height: 25px;
 }
  .form-sec p br {
      display: none;
 }
  .form-sec-left {
      margin-bottom: 20px;
 }
  .single-box-head h5, .single-box-bottom h5{
      font-size: 24px;
 }
  .single-box-head h5 br{
      display: none;
 }
  .cash-prizes:after {
      top: 0;
 }
  .single-box-inn{
      background: #fff;
      border-radius: 20px;
 }
  .single-box-head h5{
      color: #0082c9;
 }
  .single-box {
      margin-top: 40px;
 }
  .prize-heading h3{
      font-size: 27px;
 }
  .prize-box {
      margin-bottom: 40px;
      padding: 0 15px;
 }
  .cash-prizes .prize-box-head {
      border-radius: 20px 20px 0 0;
 }
  .cash-prizes .prize-box-text {
      border-radius: 0 0 20px 20px;
 }
  .border-left-right{
      border-left: none;
      border-right: none;
 }
  .prize-box h5, .prize-box-text h5{
      font-size: 24px;
 }
  .prize-box-head, .prize-box-text {
      padding: 25px 30px;
 }
  .single-box-head, .single-box-bottom {
      padding: 15px 30px;
 }
  .prize-box-head, .prize-box-text {
      padding: 15px 30px;
 }
  .cash-prizes {
      padding-bottom: 20px;
 }
  .banner-right-form{
      padding: 18px 20px;
 }
  #get-started-top .form-control {
      min-height: 40px !important;
      padding: 5px 10px;
      border-radius: 6px;
 }
  #get-started-top .error-message {
      font-size: 12px;
      bottom: -20px;
 }
  #get-started-top .btn {
      padding: 6px 30px;
      font-size: 16px;
 }
  .scroller-ship-img {
      padding-top: 50px;
 }
 /* quiz section section Starts*/
  .quiz-banner-sec .banner-image-outer img{
      height: auto;
 }
  .quiz-section-outer {
    padding: 0 0 20px 0;
 }
 .quiz-start-screen {
    margin-top: 30px;   
 }
  .quiz-container {
      padding: 0;
      margin: 0;
 }
  .quiz-counter {
      margin-top: 0;
      margin-bottom: 0;
 }
  .questions {
      padding: 0 0 15px 0;
      margin-top: 0;
 }
  .questions .answers {
      padding: 0;
 }
  .answers li{
      padding: 0;
 }
 .answers li:last-child{
    margin-bottom: 0;
 }
  .question span{
      font-size: 18px;
      line-height: 22px;
 }
  .questions .answers a {
      font-size: 16px;
      padding: 8px 15px;
      border-radius: 8px;
      margin-bottom: 10px;
 }
  .quiz-controls .quiz-response{
      font-size: 16px;
 }
  .quiz-start-screen {
      padding: 30px;
      margin-bottom: 40px;
      border-radius: 15px;
 }
  .quiz-next-btn, .quiz-restart-btn{
      font-size: 14px;
 }
 /* quiz section section Ends*/
  #timer {
      position: relative;
      right: inherit;
      top: inherit;
      margin: 0 auto;
      text-align: center;
 }
  #quiz {
      margin-top: 0;
      padding: 0;
      margin-bottom: 0;
 }
  .contest-form .btn{
      margin-top: 0;
 }
  .answers li{
      width: 100%;
 }
  .puzzle-left .jigsaw-puzzle #myCanvas {
      margin-top: 0;
      top: 0 !important;
 }
  .quiz-section-outer #startGame {
      margin: 0;
 }
  .quiz-section-outer #startGame #getTimer {
      margin: 0;
 }
  #startGame {
      display: flex;
      -ms-flex-pack: justify !important;
      justify-content: space-between !important;
 }
  .preview-thumb-mob{
      display: inline-block;
 }
 
  footer {
      padding: 25px 0;
 }
  .foot-inn p{
      font-size: 14px;
 }
  .foot-inn p img{
      height: 22px;
 }
  .wheel-container-outer {
      height: auto;
      margin: 50px 0;
 }
  .questions .question-container {
      padding: 20px;
      border-radius: 15px;
 }
  #al-particip {
      text-align: center;
 }
.image-quiz .question, .image-quiz .answers {
      width: 100%;
}
.image-quiz .answers {
      padding: 0;
}
#txtName-error, #txtMobile-error, #txtEmail-error {
      opacity: 0;
}
.form-control.has-error{
      border-color: red;
}
.mysteryword-outer  #startGame{
    display: block !important;
}
.correct-option img {
    max-height: 100px;
    width: 165px;
    object-fit: contain;
}

}
/* 320px- 991px Ends */
@media (max-width: 767px) {
  #google_recaptcha > div {
      height: 65px !important;
     /*width: 100% !important;
     */
 }
  #google_recaptcha iframe {
     /* height: 65px !important;
      */
     /*width: 100% !important;
     */
 }
  #google_recaptcha .rc-anchor-pt {
      display: none !important;
 }
  #rc-anchor-container {
     /*width: 100% !important;
     */
 }
  #google_recaptcha iframe .rc-anchor-normal{
     /*width: 100% !important;
     */
 }
  .rc-anchor-normal {
     /*width: 100% !important;
     */
 }
  .rc-anchor-light.rc-anchor-normal, .rc-anchor-light.rc-anchor-compact{
      border: none !important;
 }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .banner-right-form {
      width: 80%;
      margin: 0 auto;
 }
 .banner-form-left img{
    width: 80%;
    margin: 0 auto;
    display: inherit;
 }
  .single-box, .prize-box{
      width: 70%;
      margin-left: auto;
      margin-right: auto;
 }
  .banner-right-form .col-xl-6.form-group {
      -ms-flex: 0 0 50%;
      flex: 0 0 50%;
      max-width: 50%;
 }
  .employee-hr-col {
      -ms-flex: 0 0 33.333333%;
      flex: 0 0 33.333333%;
      max-width: 33.333333%;
 }
  .scroller-ship-bg {
      height: auto !important;
 }
  .scroller-ship-bg img {
      position: relative;
      right: inherit !important;
      top: inherit !important;
      transform: inherit !important;
      padding-left: 30px;
      padding-bottom: 30px;
 }
  .scroller-ship-bg h4 {
      position: relative;
      left: inherit;
      top: inherit;
      transform: inherit;
      padding: 40px 25px;
      font-size: 25px;
      line-height: 30px;
 }
 /* Spin The Wheel Starts */
  .wheel-wrapper {
      flex: 0 0 30rem;
 }
  .wheel-wrapper #wheel-container {
      height: 30rem;
      padding: 22px;
 }
  .wheel-wrapper #wheel-container .marker {
      width: 33px;
      height: 25px;
      transform: translate(-60%, -50%);
 }
  .wheel-wrapper #wheel-container #spin-action {
      width: 50px;
      height: 50px;
 }
  .wheel-wrapper #wheel-container #wheel .part .name {
      font-size: 14px;
      padding: 0 25px 0 17px;
      line-height: 16px;
 }
  .wheel-wrapper #wheel-container #wheel .part .name img{
  
      margin-left: 5px;
      object-fit: contain;
 }
 /* Spin The Wheel Ends */
 /* Match The Following Starts */
  .full-w-match-pr {
      height: auto;
 }
  .match-pr-inner .match-predict-head {
      margin-top: 20px;
 }
  .full-w-match-pr #select_list_questions, .full-w-match-pr #select_list_answers {
      padding: 0 15px;
 }
  .full-w-match-pr #match-questions ul {
      max-width: 85%;
 }
  .full-w-match-pr .match-pr-inner {
      max-width: 720px;
 }
 /* Match The Following Ends */
 /* Drag and Drop Starts */
 
  .drag-drop-sec .drag-drop-left, .drag-drop-sec .drag-drop-right {
      -ms-flex: 0 0 50%;
      flex: 0 0 50%;
      max-width: 50%;
 }
  .drag-drop-sec .col-xl-2.text-center {
      display: none;
 }
 .full-w-match-drag .match-name-btn-left{
    margin-bottom: 20px;
 }
 .drag-drop-content.full-w-match-drag  .match-name-btn-left{
    margin-bottom: 0 !important;
 }
 /* Drag and Drop Ends */
  .full-w-match-top {
      -ms-flex-direction: column !important;
      flex-direction: column !important;
 }
  .match-name-btn-left{
      order: 2;
      margin-bottom: 20px;
 }
  .full-w-match-top .countdown-outer{
      order: 1;
 }
  .full-w-match-top #getTimer{
      margin-bottom: 15px;
 }
  .full-w-match-top #startGame {
      padding-left: 0;
 }
 /* New Banner Sec Starts */
  .campaign-new-banner .desk-banner {
      height: 300px;
 }
  .campaign-new-banner .carousel-caption h4 {
      font-size: 35px;
      line-height: 40px;
 }
  .campaign-new-banner .carousel-caption h3 {
      font-size: 50px;
      line-height: 60px;
 }
  .full-w-match-pr .match-pr-inner {
      max-width: 500px;
 }
 /* New Banner Sec Starts */
 .jigsaw-section-outer > .container-fluid{
    padding: 0;
 }

  /* Quiz Image Starts */
  #quiz-pic-sec {
    text-align: center;
    margin-bottom: 20px;
}
#quiz-pic-sec img {
    height: 300px;
    width: 100%;
    object-fit: contain;
}
/* Quiz Image Ends */


}
/* 768px 991px Ends */
@media only screen and (min-width: 992px) and (max-width: 1024px) {
  .jigsaw-puzzle #myCanvas {
      margin-top: 0 !important;
      top: inherit !important;
 }
  .preview-thumb-mob {
      display: inline-block;
 }
  #startGame {
      display: flex;
      -ms-flex-pack: justify !important;
      justify-content: space-between !important;
 }
  .quiz-section-outer #startGame #getTimer {
      margin: 0;
 }
  .jigsaw-preview{
      display: none;
 }
  .scroller-ship-bg h4{
      font-size: 28px;
      line-height: 30px;
 }
  footer {
      padding: 30px 0;
 }
 /* Spin the Wheel Starts */
  .wheel-wrapper {
      flex: 0 0 35rem;
 }
  .wheel-wrapper #wheel-container {
      height: 35rem;
      padding: 25px;
 }
  .wheel-wrapper #wheel-container #spin-action {
      width: 70px;
      height: 70px;
 }
  .wheel-wrapper #wheel-container .marker {
      width: 33px;
      height: 25px;
      transform: translate(-67%, -50%);
 }
  .wheel-wrapper #wheel-container #wheel .part .name {
      font-size: 14px;
      padding: 0 25px 0 17px;
      line-height: 16px;
 }
  .wheel-wrapper #wheel-container #wheel .part .name img{
    height: 120px;
    width: 120px;
      margin-left: 5px;
      object-fit: contain;
 }
 /* Spin the Wheel Ends*/
 /* Match The Following Starts */
  .full-w-match-pr {
      height: auto;
 }
  .full-w-match-pr .match-pr-inner {
      max-width: 720px;
 }
  .full-w-match-pr #select_list_questions, .full-w-match-pr #select_list_answers {
      padding: 0 15px;
 }
  .full-w-match-pr #match-questions ul {
      max-width: 85%;
 }
 /* Match The Following Ends */
 /* Drag and Drop Starts */
 
  .drag-drop-sec .drag-drop-left, .drag-drop-sec .drag-drop-right {
      -ms-flex: 0 0 50%;
      flex: 0 0 50%;
      max-width: 50%;
 }
  .drag-drop-sec .col-xl-2.text-center {
      display: none;
 }
 /* Drag and Drop Ends */
 /* New Banner Sec Starts */
  .campaign-new-banner .desk-banner {
      height: 300px;
 }
  .campaign-new-banner .carousel-caption h4 {
      font-size: 35px;
      line-height: 40px;
 }
  .campaign-new-banner .carousel-caption h3 {
      font-size: 50px;
      line-height: 60px;
 }
 /* New Banner Sec Ends */
 /* Match The Follwing Starts */
  .match-pr-inner #getTimer {
      font-weight: 600;
 }
  #match-questions ul li img {
      max-height: 65px;
      width: auto;
      height: 60px;
 }
 /* Match The Following Starts */
  .full-w-match-pr .match-pr-inner {
      max-width: 500px;
 }
 /* Match The Following Ends */
 /* Thank You Starts */
  .modal-content{
      width: 90%;
      margin: 0 auto;
 }
  .thank-banner-bg {
      height: 150px;
 }
  .thank-banner-bg h3 {
      font-size: 35px;
 }
  #result-modal .modal-body{
      font-size: 25px;
 }
  .score-left-sec, .terms-right-sec{
      -ms-flex: 0 0 50%;
      flex: 0 0 50%;
      max-width: 50%;
 }
 /* Thank You Ends */
 /* Already Participate Starts */
  .already-particip-col {
      width: 65%;
 }
  .already-particip-col .already-banner-bg h3{
      font-size: 40px !important;
      margin-bottom: 5px;
 }
 .already-particip-col .already-banner-bg h4{
    font-size: 30px !important;
 }
 /* Already Participate ends */
 /* Match The Following text Starts */
  .full-w-match-pr .match-text .match-pr-inner {
      -ms-flex: 0 0 70%;
      flex: 0 0 70%;
      max-width: 70%;
 }
  .full-w-match-pr #match-questions ul {
      max-width: 100%;
 }
  .full-w-match-pr .match-text #select_list_questions {
      width: 80%;
 }
  .full-w-match-pr .match-text #select_list_answers {
      width: 40%;
 }
 /* Match The Following text Ends */

 .word-match-clue{
  -ms-flex: 0 0 41.666667%;
  flex: 0 0 41.666667%;
  max-width: 41.666667%;
 }
 .word-match-canvas{
  -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;

 }

 /* Client Contest List Starts */
.col-xl-4.client-single-contest {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
}
.client-sin-con-img {
    height: 200px;
  }
/* Client Contest List Ends */


.quiz-video .video {
    height: 300px;
    width: 60%;
  }
  .mysteryword-outer  #startGame{
    display: block !important;
  }
  .mysteryword-left {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .mysteryword-right{
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .quiz-section-outer{
    padding: 30px 0 30px 0;
  }

  .quiz-counter {
    margin-top: 0;
    margin-bottom: 20px;
    }
    
    /* Quiz Image Starts */
    #quiz-pic-sec {
    text-align: center;
    margin-bottom: 20px;
}
#quiz-pic-sec img {
    max-height: 200px;
    width: 100%;
    height: auto;
}
/* Quiz Image Ends */

/* Snake And Ladder User Admin Ends */
.sl-position-box {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
}
.sl-dashboard-sec .card-body {
    padding: 10px;
}
.sl-dashboard-sec .card-body .left-icon {
    width: 40px;
    height: 44px;
    padding: 8px;
}
.sl-dashboard-sec .card-body .right-text {
    margin-left: 10px;
}
.sl-edit-profile .form-group.col-xl-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}
/* Snake And Ladder User Admin Ends */

.reg-successful-inn {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
}

/* Sign Up Starts */
.banner-form-sec{
    padding: 40px 0;
}
.banner-form-left h2 {
    font-size: 25px;
    line-height: 35px;
}
.banner-form-left h4{
    font-size: 25px;
}
.banner-form-left {
    margin-bottom: 30px;
}
/* Sign Up Ends */

.family-btm{
    display: none;
}
.banner-form-left,
.banner-form-right {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }

  .earn-points-outer .sl-dashboard-box {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    margin-bottom: 20px;
  }
  .earn-points-outer .sl-dashboard-box:last-child{
    margin-bottom: 0;
  }
  .user-points .earn-points-outer,
  .user-points .earn-points-outer.total-point-col {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }

  .view-prize-body .col-xl-3 {
    -ms-flex: 0 0 33.33%;
    flex: 0 0 33.33%;
    max-width: 33.33%;
  }
  .bonus-card-input,
 .bonus-card-upload{
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }


  .form-group.mx-auto.school-ranking-selec {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  #rankingArea .single-ind-prizes-sec,
  #rankingAreaAdjust .single-ind-prizes-sec {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }


}
/* 481px 767px Ends */

@media only screen and (min-width: 1025px) and (max-width: 1199px) {
 
  .jigsaw-puzzle {
      text-align: center;
 }
  .scroller-ship-bg h4 {
      font-size: 28px;
      line-height: 30px;
 }
 /* Spin the Wheel Starts */
  .wheel-wrapper {
      flex: 0 0 35rem;
 }
  .wheel-wrapper #wheel-container {
      height: 35rem;
      padding: 25px;
 }
  .wheel-wrapper #wheel-container #spin-action {
      width: 70px;
      height: 70px;
 }
  .wheel-wrapper #wheel-container .marker {
      width: 33px;
      height: 25px;
      transform: translate(-67%, -50%);
 }
  .wheel-wrapper #wheel-container #wheel .part .name {
      font-size: 14px;
      padding: 0 25px 0 17px;
      line-height: 16px;
 }
  .wheel-wrapper #wheel-container #wheel .part .name img{
    height: 120px;
    width: 120px;
      margin-left: 5px;
      object-fit: contain;
 }
 /* Spin the Wheel Ends*/
 /* Match The Following Starts */
  .full-w-match-pr .match-pr-inner {
      max-width: 720px;
 }
  .full-w-match-pr #match-questions ul {
      max-width: 80%;
 }
 /* Match The Following Ends */
 /* Drag and Drop Starts */
  .full-w-match-drag{
     
 }
  .drag-drop-sec .drag-drop-left, .drag-drop-sec .drag-drop-right {
      -ms-flex: 0 0 50%;
      flex: 0 0 50%;
      max-width: 50%;
 }
  .drag-drop-sec .col-xl-2.text-center {
      display: none;
 }
 /* Drag and Drop Ends */
 /* New Banner Starts */
  .header-sec-outer .navbar-brand .logo-header img {
      width: auto;
      height: 80px !important;
 }
  .campaign-new-banner .desk-banner {
      height: 300px;
 }
  .campaign-new-banner .carousel-caption h4 {
      font-size: 35px;
      line-height: 40px;
 }
  .campaign-new-banner .carousel-caption h3 {
      font-size: 50px;
      line-height: 60px;
 }
 /* New Banner Ends */
  .full-w-match-pr .match-pr-inner {
      max-width: 500px;
 }
 /* Thank You Starts */
  .modal-content{
      width: 90%;
      margin: 0 auto;
 }
  .thank-banner-bg {
      height: 150px;
 }
  .thank-banner-bg h3 {
      font-size: 35px;
 }
  #result-modal .modal-body{
      font-size: 25px;
 }
  .score-left-sec, .terms-right-sec{
      -ms-flex: 0 0 50%;
      flex: 0 0 50%;
      max-width: 50%;
 }
 /* Thank You Ends */
 /* Already Participate Starts */
  .already-particip-col {
      width: 65%;
 }
  .already-particip-col .already-banner-bg h3{
      font-size: 40px !important;
      margin-bottom: 10px;
 }
 .already-particip-col .already-banner-bg h4{
    font-size: 35px !important;
 }

 /* Already Participate ends */
 /* Match The Following text Starts */
  .full-w-match-pr .match-text .match-pr-inner {
      -ms-flex: 0 0 70%;
      flex: 0 0 70%;
      max-width: 70%;
 }
  .full-w-match-pr #match-questions ul {
      max-width: 100%;
 }
  .full-w-match-pr .match-text #select_list_questions {
      width: 80%;
 }
  .full-w-match-pr .match-text #select_list_answers {
      width: 40%;
 }
 /* Match The Following text Ends */

 .word-match-clue{
  -ms-flex: 0 0 41.666667%;
  flex: 0 0 41.666667%;
  max-width: 41.666667%;
 }
 .word-match-canvas{
  -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;

 }

  /* Client Contest List Starts */
.col-xl-4.client-single-contest {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
}

/* Client Contest List Ends */

    .quiz-video .video {
        height: 380px;
        width: 80%;
    }

    .quiz-counter {
        margin-top: 0;
        margin-bottom: 20px;
    }

    .jigsaw-section-outer .rotate-text span{
        font-size: 17px;
    }  
    .jigsaw-section-outer .puzzle-right {
        padding-left: 30px;
        padding-top: 15px;
      }

  /* Snake And Ladder User Admin Starts */
      .sl-edit-profile .form-group.col-xl-6 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
    /* Snake And Ladder User Admin Ends */

/* Sign Up Starts */
.banner-form-sec{
    padding: 40px 0;
}
.banner-form-left h2 {
    font-size: 25px;
    line-height: 35px;
}
.banner-form-left h4{
    font-size: 25px;
}
.banner-form-left {
    margin-bottom: 30px;
}

/* Sign Up Ends */

.family-btm{
    display: none;
}
.banner-form-left,
.banner-form-right {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }

  .earn-points-outer .sl-dashboard-box {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    margin-bottom: 20px;
  }
  .earn-points-outer .sl-dashboard-box:last-child{
    margin-bottom: 0;
  }


  .user-points .earn-points-outer,
  .user-points .earn-points-outer.total-point-col {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }


  .view-prize-body .col-xl-3 {
    -ms-flex: 0 0 33.33%;
    flex: 0 0 33.33%;
    max-width: 33.33%;
  }

  .bonus-card-input,
  .bonus-card-upload{
     -ms-flex: 0 0 50%;
     flex: 0 0 50%;
     max-width: 50%;
   }
   
   
  .form-group.mx-auto.school-ranking-selec {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  #rankingArea .single-ind-prizes-sec,
  #rankingAreaAdjust .single-ind-prizes-sec {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }

}
 
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-sec-outer .navbar.navbar-expand-lg {
      padding: 10px 15px 10px 15px;
 }
  .form-sec{
      background: #fff;
 }
  .form-sec p{
      text-align: center;
 }
  .form-sec p br{
      display: none;
 }
 

  .form-sec-left{
      margin-bottom: 30px;
 }
  .single-box {
      -ms-flex: 0 0 33.333333%;
      flex: 0 0 33.333333%;
      max-width: 33.333333%;
 }
  .single-box-head h5, .single-box-bottom h5 {
      font-size: 22px;
 }
  .single-box-head, .single-box-bottom {
      padding: 25px 20px;
 }
  .prize-box {
      -ms-flex: 0 0 33.333333%;
      flex: 0 0 33.333333%;
      max-width: 33.333333%;
 }
  .prize-box h5, .prize-box-text h5{
      font-size: 22px;
 }
  .prize-box-head, .prize-box-text {
      padding: 25px 20px;
 }
  .prize-boxes .row{
      margin: 0;
 }
  .header-sec-outer .navbar-brand .logo-header img {
      width: auto;
      height: 80px;
 }
  .cash-prizes:after{
      top: 101px;
 }
  .quiz-banner-sec .banner-image-outer img{
      height: auto;
 }
  .banner-right-form .col-xl-6.form-group {
      -ms-flex: 0 0 50%;
      flex: 0 0 50%;
      max-width: 50%;
 }

 .quiz-counter {
    margin-top: 0;
    margin-bottom: 20px;
}
.single-ind-prizes-sec {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }


}
/* 992px 1024px Ends */
@media only screen and (min-width: 1025px) and (max-width: 1199px) {
  .form-sec {
      background: url(../images/form-sec-bg-element.jpg);
      background-size: cover;
 }
  .form-sec-left {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
 }
  .form-sec-right{
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
 }
 
  .form-sec p {
      text-align: left;
      font-size: 20px;
      line-height: 30px;
 }

    /* Quiz Image Starts */
        #quiz-pic-sec {
        text-align: center;
        margin-bottom: 20px;
    }
    #quiz-pic-sec img {
        height: 250px;
        width: 100%;
        object-fit: contain;
    }
    /* Quiz Image Ends */


}
@media only screen and (min-width: 1200px) and (max-width: 1440px) {
  .header-sec-outer .navbar.navbar-expand-lg {
      padding: 10px 0 10px 0;
 }
  .header-sec-outer .navbar-brand .logo-header img {
      width: auto;
      height: 60px;
 }
  .single-box-head h5, .single-box-bottom h5 {
      font-size: 22px;
 }
  .prize-box h5, .prize-box-text h5 {
      font-size: 22px;
 }
  .prize-heading h3{
      font-size: 30px;
 }
  .cash-prizes:after{
      top: 102px;
 }
  .form-sec-left {
      -ms-flex: 0 0 45%;
      flex: 0 0 45%;
      max-width: 45%;
 }
  .form-sec-right {
      -ms-flex: 0 0 55%;
      flex: 0 0 55%;
      max-width: 55%;
 }
 /* .banner-sec.campaign-main-banner .banner-image-outer, .banner-sec.campaign-main-banner img{
      height: 400px;
 }
  */
 /* Spin the Wheel Starts */
  .wheel-wrapper {
      flex: 0 0 30rem;
 }
  .wheel-wrapper #wheel-container {
      height: 30rem;
      padding: 25px;
 }
  .wheel-wrapper #wheel-container #spin-action {
      width: 70px;
      height: 70px;
 }
  .wheel-wrapper #wheel-container .marker {
      width: 33px;
      height: 25px;
      transform: translate(-67%, -50%);
 }
  .wheel-wrapper #wheel-container #wheel .part .name {
      font-size: 16px;
      padding: 0 25px 0 17px;
      line-height: 16px;
 }
  .wheel-wrapper #wheel-container #wheel .part .name img{
      
      margin-left: 5px;
      object-fit: contain;
 }
 /* Spin the Wheel Ends*/
 /* Match The Following Starts */
  .full-w-match-pr #select_list_questions, .full-w-match-pr #select_list_answers {
      padding: 0 15px;
 }
 /* Match The Following Ends */
 /* New Banner Starts */
  .campaign-new-banner .desk-banner {
      height: auto;
 }
  .campaign-new-banner .carousel-caption h4 {
      font-size: 35px;
      line-height: 40px;
 }
  .campaign-new-banner .carousel-caption h3 {
      font-size: 50px;
      line-height: 60px;
 }
 /* New Banner Ends */
  .full-w-match-pr .match-pr-inner {
      max-width: 500px;
 }
  #select_list_questions {
      width: 35%;
 }
  #select_list_answers {
      width: 65%;
 }
  .full-w-match-pr #match-questions ul {
      max-width: 80%;
 }
 /* Thank You Starts */
  .modal-content{
      width: 90%;
      margin: 0 auto;
 }
  .thank-banner-bg {
      height: 150px;
 }
  .thank-banner-bg h3 {
      font-size: 35px;
 }
  #result-modal .modal-body{
      font-size: 25px;
 }
  .score-left-sec, .terms-right-sec{
      -ms-flex: 0 0 50%;
      flex: 0 0 50%;
      max-width: 50%;
 }
 /* Thank You Ends */
 /* Match The Following text Starts */
  .full-w-match-pr .match-text .match-pr-inner {
      -ms-flex: 0 0 50%;
      flex: 0 0 50%;
      max-width: 50%;
 }
  .full-w-match-pr #match-questions ul {
      max-width: 100%;
 }
  .full-w-match-pr .match-text #select_list_questions {
      width: 80%;
 }
  .full-w-match-pr .match-text #select_list_answers {
      width: 40%;
 }
 /* Match The Following text Ends */

 .quiz-video .video {
    height: 400px;
    width: 70%;
 }

 .mysteryword-outer  #startGame{
    display: block !important;
  }
  .mysteryword-left {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .mysteryword-right{
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .quiz-counter {
    margin-top: 0;
    margin-bottom: 20px;
  }

  .jigsaw-section-outer .puzzle-right {
    padding-left: 30px;
    padding-top: 15px;
  }

    /* Quiz Image Starts */
    #quiz-pic-sec {
        text-align: center;
        margin-bottom: 20px;
    }
    #quiz-pic-sec img {
        height: 250px;
        width: 100%;
        object-fit: contain;
    }
    /* Quiz Image Ends */

    .find-person-img{
        height: 300px;
         width: 300px;
    }
    .find-person-img img{
        height: 300px;
        width: 300px;
    }
    .mano-login-form {
        max-width: 450px;
        margin-left: auto;
      }
      .family-btm{
        display: none;
      }
      .sl-dashboard-sec .card-body {
        padding: 20px 10px;
      }


  .view-prize-body .col-xl-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .weekly-prizbody{
    padding: 20px 10px;
  }
}
/* 1025px 1199px Ends */
@media only screen and (min-width: 1441px) and (max-width: 1920px) {
  /* .container {
      max-width: 1140px !important;
 } */
  .form-sec-left {
      -ms-flex: 0 0 50%;
      flex: 0 0 50%;
      max-width: 50%;
 }
  .form-sec-right {
      -ms-flex: 0 0 50%;
      flex: 0 0 50%;
      max-width: 50%;
 }
 /* Match The Following Starts */
  .full-w-match-pr .match-pr-inner {
      -ms-flex: 0 0 30%;
      flex: 0 0 30%;
      max-width: 30%;
 }
  .full-w-match-pr #select_list_questions, .full-w-match-pr #select_list_answers {
      padding: 0 15px;
 }
 /* Match The Following Ends */


  /* Quiz Image Starts */
  #quiz-pic-sec {
    text-align: center;
    margin-bottom: 20px;
}
#quiz-pic-sec img {
    height: 300px;
    width: 100%;
    object-fit: contain;
}
/* Quiz Image Ends */

.mano-login-form {
    max-width: 450px;
    margin-left: auto;
  }

}
@media (min-width: 1200px) {
  .container {
      max-width: 1140px;
 }
}
@media (min-width: 1920px) {
 /* html {
      max-width: 1920px;
      margin: 0 auto;
 }
  */
  .container {
      max-width: 1440px;
 }
}
@media (min-width: 768px) {
 /* #google_recaptcha > div {
      height: 65px !important;
 }
  #google_recaptcha iframe {
      height: 65px !important;
 }
  #google_recaptcha .rc-anchor-pt {
      display: none !important;
 }
  */
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .quiz-start-screen{
      box-shadow: 0 2px 12px 0 rgba( 31, 38, 135, 0.20 );
 }
  .quiz-start-screen {
      text-align: left !important;
 }
  #timer {
      position: absolute;
      right: 0;
      top: 0;
 }
  #countdown #tiles{
      border-radius: 5px !important;
 }
  .countdown-label {
      display: none;
 }
  #countdown #tiles{
      font-size: 16px;
 }
 
  .quiz-next-btn, .quiz-restart-btn {
      font-size: 16px;
 }
  .rotate-text {
      margin-top: 12px;
      order: 2;
      text-align: left;
 }
  .rotate-text span {
      font-size: 18px;
      padding: 9px 20px;
 }
  #predict-box-outer {
      margin: 0;
 }
  #predict-winn{
      padding-top: 40px;
 }
  .answer-group {
      width: 100%;
 }

 /* mysteryword Starts */
 .mysteryword-heading {
    margin-top: 20px;
    margin-bottom: 20px;
}
.circle-outer {
    height: 400px;
  }
  .mysteryword-right .rotate-text {
    text-align: left;
    margin-top: 10px;
    margin-bottom: 0;
  }
  .mysteryword-timer {
    margin: 20px 0 0 0;
  }
 /* mysteryword Ends */
 

}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .puzzle-right {
      display: -ms-inline-flexbox !important;
      display: inline-flex !important;
      width: auto !important;
      margin: 15px auto 0 auto;
 }
  .puzzle-right .jigsaw-preview {
      order: 1;
      display: inline-block;
 }
  .puzzle-right #startGame {
      display: inline-block;
      margin-top: 0 !important;
      order: 2;
      margin-left: 15px !important;
 }
  .rotate-text {
      margin-top: 25px;
 }
  .preview-thumb-mob {
      display: none;
 }
}
@media only screen and (min-width: 320px) and (max-width: 1024px) {
  .full-w-match-pr .match-text #select_list_questions {
      width: 40% !important;
 }
  .full-w-match-pr .match-text #select_list_answers {
      width: 60% !important;
 }
  .full-w-match-pr .match-text #select_list_questions.image-li-quest, .full-w-match-pr .match-text #select_list_answers.image-li-ans{
      width: 50% !important;
 }
  .full-w-match-pr #match-questions ul li {
      padding: 5px !important;
      min-height: auto !important;
 }
  #match-questions ul li img {
      max-height: 100px !important;
      width: auto !important;
      height: 100% !important;
      object-fit: contain;
 }
  .full-w-match-pr #select_list_answers ul li{
      padding: 10px 15px !important;
 }
  #select_list_answers ul li span {
      text-align: left !important;
      font-size: 14px !important;
      margin: 0;
 }
  .full-w-match-pr .match-text #select_list_questions.image-li-quest li{
      width: 90% !important;
 }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #predict-winner {
      max-width: 540px;
 }
}


@media only screen and (min-width: 768px) and (max-width: 991px) {
/* mysteryword Starts */
.mysteryword-heading {
    margin-top: 20px;
    margin-bottom: 20px;
}
.circle-outer {
    height: 400px;
  }
  .mysteryword-right .rotate-text {
    text-align: left;
    margin-top: 10px;
    margin-bottom: 0;
  }
  .mysteryword-timer {
    margin: 20px 0 0 0;
  }
 /* mysteryword Ends */
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .mysteryword-left {
        -ms-flex: 0 0 66.666667%;
        flex: 0 0 66.666667%;
        max-width: 66.666667%;
      }
      .mysteryword-right {
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
      }
}

@media only screen and (min-width: 1025px) and (max-width: 1199px) {
  .puzzle-left {
      -ms-flex: 0 0 66.666667%;
      flex: 0 0 66.666667%;
      max-width: 66.666667%;
 }
  .puzzle-right {
      -ms-flex: 0 0 33.333333%;
      flex: 0 0 33.333333%;
      max-width: 33.333333%;
 }
  #predict-winner {
      max-width: 720px;
 }
}
@media only screen and (min-width: 1025px) and (max-width: 1440px) {
  .full-w-match-pr .match-text #select_list_questions {
      width: 40% !important;
 }
  .full-w-match-pr .match-text #select_list_answers {
      width: 60% !important;
 }
  .full-w-match-pr .match-text #select_list_questions.image-li-quest, .full-w-match-pr .match-text #select_list_answers.image-li-ans{
      width: 50% !important;
 }
  .full-w-match-pr .match-text #select_list_questions.image-li-quest li{
      width: 90% !important;
 }
  .full-w-match-pr .match-text #select_list_answers.image-li-ans li img{
      margin: 0 auto;
 }
}
.full-w-match-pr .match-text #select_list_answers.image-li-ans li img{
  margin: 0 auto;
}


/* Snake & Ladder Front End Starts */
@media only screen and (min-width:320px) and (max-width:480px) {
   
    /* Snake & Ladder Starts */
    .snake-quiz-main-outer {
        margin-top: 20px;
    }
	.snake-ladder-main .main-container ul{
		gap: 4px;
	}
    .snake-ladder-main .main-container ul li{
		height: 80px;
		border: 2px solid #ec2029;
    }
	.snake-ladder-main .main-container ul li:nth-child(2n+1){
		border: 2px solid #ddd;
	}
    .snake-ladder-main .main-container ul li.box > span {
        font-size: 21px;
        text-shadow: 2px 2px 1px #464646;
        color: #bfbfbf;
		z-index: 9;
    }
	.snake-ladder-main .main-container ul li img {
		width: 70px !important;
    	height: 70px !important;
		object-fit: contain !important;
	}
 
	
    .main-container .player_in_board{
        margin-top: 25px;
        width: 26px;
    }
    
    /* Snake & Ladder Ends */

    .snake-quiz-main-outer .quiz-main-inn{
        padding: 15px !important;
    }
 
    .snake-quiz-main-outer h3 {
        font-size: 16px;
    }
    .snake-quiz-main-outer .answers li {
        padding: 0;
    }
    .snake-quiz-main-outer .answers a{
        font-size: 14px;
    }
    .snake-quiz-main-outer .btn-outter {
        margin-top: 15px;
    }
    .snake-quiz-main-outer .btn {
        font-size: 14px;
    }
    .side-container {
        text-align: center;
    }
    .dice-and-roll {
        margin:0;
        padding: 10px;
        display: inline-block;
    }
    #dice_img {
        width: 50px;
        height:  auto !important;
    }

    .snake-ladder-main .main-container ul li {
        height: 70px;
        border: 2px solid #ec2029;
    }
    .snake-ladder-main .main-container ul li img {
        width: 60px !important;
        height: 60px !important;
        object-fit: contain !important;
    }
   .main-container ul li.box .giftin-box {
        width: 50px;
        height: 50px;
        position: absolute;
        left: 50%;
        top: 40%;
        transform: translateX(-50%) translateY(-40%);
    }
    
    .snake-ladder-main .main-container ul li.box > span {
        font-size: 14px;
        color: #bfbfbf;
        z-index: 9;
        text-shadow: 1px 1px 0px #464646;
        left: 3px;
    }
    .main-container ul li.box .giftin-count {
        top: 0;
        right: 0;
        width: 20px;
        height: 20px;
    }
}

@media only screen and (min-width:320px) and (max-width:400px) {
    .snake-ladder-main{
        position: relative;
    }
    .giftbox-board, .leader-board{
        display: none;
    }
   .giftbox-board.show,
   .leader-board.show{
        display: block;
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translateX(-50%) translateY(-50%);
        width: 95%;
        z-index: 999;
    }
    .leader-board.show{
        width: 70%; 
    }


    .over-hidden{
        overflow-y: hidden;
    }
    .overlay-box.overlay-show {
        background: rgba(0,0,0,.5);
        width: 100%;
        position: absolute;
        height: 100%;
        left: 0;
        top: 0;
        z-index: 99;
    }
    .side-container {
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-pack: justify !important;
        justify-content: space-between !important;
        max-width: 320px;
        margin: 0 auto;
        padding: 15px 0;
    }
    .mob-boxbtns{
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-item-align: center !important;
        align-self: center !important;
    }
    .mob-boxbtns li{
        list-style: none;
    }
    .mob-boxbtns .btn {
        background-image: linear-gradient(to top, #333333, #3b3b3b, #444444, #4c4c4c, #555555);
        color: #fff;
        margin-right: 10px;
    }
    .border-head {
        position: relative;
        padding: 8px 15px;
    }
    #close {
        background: rgba(250,250,250,.8);
        width: 25px;
        height: 25px;
        display: inline-block;
        border-radius: 50%;
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
        cursor: pointer;
    }
    #close i {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translateX(-50%) translateY(-50%);
        color: #000;
        font-size: 20px;
    }
    .snake-ladder-main {
        min-height: calc(100vh - 70px);  
    } 
    .giftbox-board {
        height: 210px;
    }
    .giftbox-details{
        height: 170px !important;
    }
    .leader-board .lb-details {
        height: 142px !important;
    }
    .dice-and-roll{
        padding: 10px 0;
    }
    /* Leaderboard giftboard ends */

    .snake-ladder-canvas{
        margin-bottom: 50px;
    }
    .mobile-div-img {
        display: block !important;
        height: 440px;
        position: absolute;
        z-index: 99;
        width: 100%;
    }
    .snake-ladder-main .main-container ul{
        max-width: 320px;
        margin: 0 auto;
    }
    .snake-ladder-main #snake1 {
        top: 29%;
        right: 11%;
        width: 138px;
        z-index: 9;
        left: inherit;
    }
    .snake-ladder-main #snake3 {
        top: 11%;
        left: 29%;
        width: 60px;
        z-index: 9;
    }
    .snake-ladder-main #snake4 {
        top: 60%;
        left: 33%;
        width: 46px;
        z-index: 99;
    }
    .snake-ladder-main #snake2 {
        top: 74%;
        left: 71%;
        width: 25px;
        z-index: 99;
	}
    .snake-ladder-main #snake5 {
        top: 46%;
        left: 18%;
        width: 38px;
        z-index: 99;
    }
    .snake-ladder-main  #ladder1 {
        top: 44%;
        left: 8%;
        width: 28px;
        z-index: 9;
	}
	.snake-ladder-main #ladder2 {
        top: 42%;
        left: 50%;
        width: 65px;
        z-index: 9;
	}
    .snake-ladder-main #ladder3 {
        top: 25%;
        left: 50%;
        width: 80px;
        z-index: 9;
    }
    .main-container ul li .giftin-box img {
        width: 60px;
        height: 60px;
    }
    .desktop-div-img{
        display: none;
    }
    .mobile-div-img{
        display: block !important;
    }
    
}


@media only screen and (min-width:401px) and (max-width:600px) {
    /* Leaderboard giftboard Starts */
    .snake-ladder-main{
        position: relative;
    }
    .giftbox-board, .leader-board{
        display: none;
    }
   .giftbox-board.show,
   .leader-board.show{
        display: block;
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translateX(-50%) translateY(-50%);
        width: 95%;
        z-index: 999;
    }
    .over-hidden{
        overflow-y: hidden;
    }
    .overlay-box.overlay-show {
        background: rgba(0,0,0,.5);
        width: 100%;
        position: absolute;
        height: 100%;
        left: 0;
        top: 0;
        z-index: 99;
    }
    .side-container {
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-pack: justify !important;
        justify-content: space-between !important;
        max-width: 400px;
        margin: 0 auto;
        padding: 15px 0;
    }
    .mob-boxbtns{
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-item-align: center !important;
        align-self: center !important;
    }
    .mob-boxbtns li{
        list-style: none;
    }
    .mob-boxbtns .btn {
        background-image: linear-gradient(to top, #333333, #3b3b3b, #444444, #4c4c4c, #555555);
        color: #fff;
        margin-right: 10px;
    }
    .border-head {
        position: relative;
        padding: 8px 15px;
    }
    #close {
        background: rgba(250,250,250,.8);
        width: 25px;
        height: 25px;
        display: inline-block;
        border-radius: 50%;
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
        cursor: pointer;
    }
    #close i {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translateX(-50%) translateY(-50%);
        color: #000;
        font-size: 20px;
    }
    .snake-ladder-main {
        min-height: calc(100vh - 70px);  
    } 
    .quiz-info h3 {
        margin-bottom: 0;
    }
    .giftbox-board {
        height: 210px;
    }
    .giftbox-details{
        height: 170px !important;
    }
    .leader-board .lb-details {
        height: 142px !important;
    }
  
    /* Leaderboard giftboard ends */


    .snake-ladder-canvas{
        margin-bottom: 50px;
        text-align: center;
    }
    .snake-ladder-main .main-container ul li{
        text-align: left;
    }
    .snake-ladder-main .main-container {
        max-width: 400px;
        margin: 0 auto;
        width: 100%;
        float: inherit;
    }
    .mobile-div-img {
        display: block !important;
        height: 440px;
        position: absolute;
        z-index: 99;
        max-width: 400px;
        width: 100%;
    }
    .snake-ladder-main #snake1 {
        top: 29%;
        right: 10%;
        width: 150px;
        z-index: 9;
        left: inherit;
    }
    .snake-ladder-main #snake3 {
        top: 11%;
        left: 29%;
        width: 60px;
        z-index: 9;
    }
    .snake-ladder-main #snake4 {
        top: 60%;
        left: 33%;
        width: 46px;
        z-index: 99;
    }
    .snake-ladder-main #snake2 {
        top: 75%;
        left: 69%;
        width: 29px;
        z-index: 99;
    }
    .snake-ladder-main #ladder3 {
        top: 25%;
        left: 50%;
        width: 70px;
        z-index: 9;
    }
    .snake-ladder-main #snake5 {
        top: 46%;
        left: 21%;
        width: 38px;
        z-index: 99;
    }
    .snake-ladder-main #ladder1 {
        top: 45%;
        left: 11%;
        width: 28px;
        z-index: 9;
    }
    .snake-ladder-main #ladder2 {
        top: 42%;
        left: 50%;
        width: 65px;
        z-index: 9;
    }
    .snake-ladder-main .main-container ul li img {
        width: 60px !important;
        height: 60px !important;
        object-fit: contain !important;
    }
    .snake-ladder-main .main-container ul li.box > span {
        font-size: 14px;
        color: #bfbfbf;
        z-index: 9;
        text-shadow: 1px 1px 0px #464646;
        left: 3px;
    }
    .snake-ladder-main .main-container ul {
        gap: 4px;
    }
    .snake-ladder-main .main-container ul li {
        height: 70px;
        border: 2px solid #ec2029;
    }
    .snake-ladder-main .main-container ul li:nth-child(2n+1) {
        border: 2px solid #ddd;
    }
    .main-container .player_in_board {
        margin-top: 25px;
        width: 26px;
    }
    .main-container ul li.box .giftin-box {
        width: 50px;
        height: 50px;
        position: absolute;
        left: 50%;
        top: 40%;
        transform: translateX(-50%) translateY(-40%);
    }
    .main-container ul li.box .giftin-count {
        top: 0;
        right: 0;
        width: 20px;
        height: 20px;
    }
    .side-container {
        text-align: center;
    }
    .dice-and-roll {
        margin: 0;
        padding: 10px 0;
        display: inline-block;
    }
    #dice_img {
        width: 50px;
        height: auto !important;
    }
    .desktop-div-img{
        display: none;
    }
    .mobile-div-img{
        display: block !important;
    }
    .snake-quiz-main-outer h3 {
        font-size: 18px;
    }
    .snake-quiz-main-outer .btn-outter {
        margin-top: 15px;
    }
}
@media only screen and (min-width:450px) and (max-width:600px) {
    
    .snake-ladder-main #snake1 {
        top: 29%;
        right: 15%;
        width: 150px;
        z-index: 9;
        left: inherit;
    }

}

@media only screen and (min-width:601px) and (max-width:700px) {
    /* Leaderboard giftboard Starts */
    .snake-ladder-main{
        position: relative;
    }
    .giftbox-board, .leader-board{
        display: none;
    }
   .giftbox-board.show,
   .leader-board.show{
        display: block;
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translateX(-50%) translateY(-50%);
        width: 95%;
        z-index: 999;
    }
    .over-hidden{
        overflow-y: hidden;
    }
    .overlay-box.overlay-show {
        background: rgba(0,0,0,.5);
        width: 100%;
        position: absolute;
        height: 100%;
        left: 0;
        top: 0;
        z-index: 99;
    }
    .side-container {
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-pack: justify !important;
        justify-content: space-between !important;
        max-width: 500px;
        margin: 0 auto;
        padding: 15px 0;
    }
    .mob-boxbtns{
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-item-align: center !important;
        align-self: center !important;
    }
    .mob-boxbtns li{
        list-style: none;
    }
    .mob-boxbtns .btn {
        background-image: linear-gradient(to top, #333333, #3b3b3b, #444444, #4c4c4c, #555555);
        color: #fff;
        margin-right: 10px;
    }
    .border-head {
        position: relative;
        padding: 8px 15px;
    }
    #close {
        background: rgba(250,250,250,.8);
        width: 25px;
        height: 25px;
        display: inline-block;
        border-radius: 50%;
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
        cursor: pointer;
    }
    #close i {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translateX(-50%) translateY(-50%);
        color: #000;
        font-size: 20px;
    }
    .snake-ladder-main {
        min-height: calc(100vh - 70px);  
    } 
    .giftbox-board {
        height: 210px;
    }
    .giftbox-details{
        height: 170px !important;
    }
    .leader-board .lb-details {
        height: 142px !important;
    }
    .giftbox-board.show, .leader-board.show{
        width: 60%;
    }
    /* Leaderboard giftboard ends */

    .side-container {
        text-align: center;
    }
    .snake-ladder-main .main-container ul {
        gap: 4px;
    }
    .snake-ladder-main .main-container ul li {
        height: 90px;
        border: 2px solid #ec2029;
        text-align: left;
    }
    .main-container ul li.box .giftin-box {
        width: 70px;
        height: 70px;
        position: absolute;
        left: 50%;
        top: 40%;
        transform: translateX(-50%) translateY(-40%);
    }
    .snake-ladder-main .main-container ul li img {
        width: 70px !important;
        height: 70px !important;
        object-fit: contain !important;
    }
    .snake-ladder-main .main-container ul li:nth-child(2n+1) {
        border: 2px solid #ddd;
    }
    .main-container .player_in_board {
        margin-top: 25px;
        width: 26px;
    }
    .snake-ladder-main .main-container ul li.box > span {
        font-size: 14px;
        color: #bfbfbf;
        z-index: 9;
        text-shadow: 1px 1px 0px #464646;
        left: 3px;
    }
    .snake-ladder-main .main-container {
        max-width: 500px;
        margin: 0 auto;
        width: 100%;
        float: inherit;
    }
    .mobile-div-img {
        display: block !important;
        height: 560px;
        position: absolute;
        z-index: 99;
        max-width: 500px;
        width: 100%;
    }
    .snake-ladder-canvas {
        margin-bottom: 50px;
        text-align: center;
    }

    .snake-ladder-main #snake1 {
        top: 29%;
        right: 10%;
        width: 195px;
        z-index: 9;
        left: inherit;
    }
    .snake-ladder-main #snake2 {
        top: 75%;
        left: 72%;
        width: 40px;
        z-index: 99;
    }
    .snake-ladder-main #snake3 {
        top: 11%;
        left: 29%;
        width: 60px;
        z-index: 9;
    }
    .snake-ladder-main #snake4 {
        top: 60%;
        left: 33%;
        width: 63px;
        z-index: 99;
    }
    .snake-ladder-main #snake5 {
        top: 45%;
        left: 18%;
        width: 55px;
        z-index: 99
    }
    .snake-ladder-main #ladder1 {
        top: 45%;
        left: 11%;
        width: 37px;
        z-index: 9;
    }
    .snake-ladder-main #ladder2 {
        top: 42%;
        left: 50%;
        width: 95px;
        z-index: 9;
    }
    .snake-ladder-main #ladder3 {
        top: 25%;
        left: 50%;
        width: 95px;
        z-index: 9;
    }
    .side-container {
        text-align: center;
    }
    .dice-and-roll {
        margin: 0;
        padding: 10px;
        display: inline-block;
    }
    #dice_img {
        width: 50px;
        height: auto !important;
    }

    .desktop-div-img{
        display: none;
    }
    .mobile-div-img{
        display: block !important;
    }
    .snake-quiz-main-outer .btn-outter {
        margin-top: 15px;
    }
    .snake-quiz-main-outer h3 {
        font-size: 18px;
    
    }
    .quiz-info h3{
        margin-bottom: 0;
    }
    
}
@media only screen and (min-width:701px) and (max-width:991px) {
    /* Leaderboard giftboard Starts */
    .snake-ladder-main{
        position: relative;
    }
    .giftbox-board, .leader-board{
        display: none;
    }
   .giftbox-board.show,
   .leader-board.show{
        display: block;
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translateX(-50%) translateY(-50%);
        width: 50%;
        z-index: 999;
    }
    .over-hidden{
        overflow-y: hidden;
    }
    .overlay-box.overlay-show {
        background: rgba(0,0,0,.5);
        width: 100%;
        position: absolute;
        height: 100%;
        left: 0;
        top: 0;
        z-index: 99;
    }
    .side-container {
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-pack: justify !important;
        justify-content: space-between !important;
        max-width: 500px;
        margin: 0 auto;
        padding: 15px 0;
    }
    .mob-boxbtns{
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-item-align: center !important;
        align-self: center !important;
    }
    .mob-boxbtns li{
        list-style: none;
    }
    .mob-boxbtns .btn {
        background-image: linear-gradient(to top, #333333, #3b3b3b, #444444, #4c4c4c, #555555);
        color: #fff;
        margin-right: 10px;
    }
    .border-head {
        position: relative;
        padding: 8px 15px;
    }
    #close {
        background: rgba(250,250,250,.8);
        width: 25px;
        height: 25px;
        display: inline-block;
        border-radius: 50%;
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
        cursor: pointer;
    }
    #close i {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translateX(-50%) translateY(-50%);
        color: #000;
        font-size: 20px;
    }
    .snake-ladder-main {
        min-height: calc(100vh - 70px);  
    } 
    .giftbox-board {
        height: 210px;
    }
    .giftbox-details{
        height: 170px !important;
    }
    .leader-board .lb-details {
        height: 142px !important;
    }
    .giftbox-board.show, .leader-board.show{
        width: 50%;
    }
    .mob-boxbtns .btn {
        padding: 5px 20px;
    }
    /* Leaderboard giftboard ends */

    .desktop-div-img{
        display: none;
    }
    .mobile-div-img{
        display: block !important;
    }
    .side-container {
        text-align: center;
    }
    .dice-and-roll {
        margin: 0;
        padding: 0;
        display: inline-block;
    }
    #dice_img {
        width: 60px;
        height: auto !important;
    }
    .snake-ladder-canvas {
        margin-bottom: 50px;
        text-align: center;
    }
    .snake-ladder-main .main-container {
        max-width: 650px;
        margin: 0 auto;
        width: 100%;
        float: inherit;
    }
    .quiz-main-inn {
        max-width: 650px;
        margin: 0 auto;
        width: 100%;
        float: inherit;
      }
    .snake-ladder-main .main-container ul{
        gap: 4px;
    }
    .snake-ladder-main .main-container ul li {
        height: 90px;
        border: 2px solid #ec2029;
        text-align: left;
    }
    .snake-ladder-main .main-container ul li:nth-child(2n+1) {
        border: 2px solid #ddd;
    }
    .main-container ul li.box .giftin-box {
        width: 70px;
        height: 70px;
        position: absolute;
        left: 50%;
        top: 40%;
        transform: translateX(-50%) translateY(-40%);
    }
    .main-container .player_in_board {
        margin-top: 25px;
        width: 30px;
    }
    .snake-ladder-main .main-container ul li img {
        width: 70px !important;
        height: 70px !important;
        object-fit: contain !important;
    }
    .snake-ladder-main .main-container ul li.box > span {
        font-size: 14px;
        color: #bfbfbf;
        z-index: 9;
        text-shadow: 1px 1px 0px #464646;
        left: 3px;
    }

    .snake-ladder-main #snake1 {
        top: 26%;
        right: 14%;
        width: 205px;
        z-index: 9;
        left: inherit;
    }
    .snake-ladder-main #snake2 {
        top: 75%;
        left: 72%;
        width: 40px;
        z-index: 99;
    }
    .snake-ladder-main #snake3 {
        top: 11%;
        left: 32%;
        width: 80px;
        z-index: 9;
    }
    .snake-ladder-main #snake4 {
        top: 59%;
        left: 35%;
        width: 61px;
        z-index: 99;
    }
    .snake-ladder-main #snake5 {
        top: 43%;
        left: 20%;
        width: 60px;
        z-index: 99;
    }
    .snake-ladder-main #ladder1 {
        top: 45%;
        left: 11%;
        width: 37px;
        z-index: 9;
    }
    .snake-ladder-main #ladder2 {
        top: 42%;
        left: 50%;
        width: 95px;
        z-index: 9;
    }
    .snake-ladder-main #ladder3 {
        top: 25%;
        left: 50%;
        width: 95px;
        z-index: 9;
    }
    .snake-quiz-main-outer h3 {
        font-size: 18px;
      
    }
    .quiz-info h3{
        margin-bottom: 0;
    }
    .snake-quiz-main-outer .btn-outter {
        margin-top: 15px;
      }
}
 
@media only screen and (min-width: 992px) and (max-width:1199px) {
    /* Leaderboard giftboard Starts */
    .snake-ladder-main{
        position: relative;
    }
    .giftbox-board, .leader-board{
        display: none;
    }
   .giftbox-board.show,
   .leader-board.show{
        display: block;
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translateX(-50%) translateY(-50%);
        width: 50%;
        z-index: 999;
    }
    .over-hidden{
        overflow-y: hidden;
    }
    .overlay-box.overlay-show {
        background: rgba(0,0,0,.5);
        width: 100%;
        position: absolute;
        height: 100%;
        left: 0;
        top: 0;
        z-index: 99;
    }
    .snake-quiz-main-outer {
        margin-top: 0;
    }
    .side-container {
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-pack: justify !important;
        justify-content: space-between !important;
        max-width: 500px;
        margin: 0 auto;
        padding: 15px 0;
    }
    .mob-boxbtns{
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-item-align: center !important;
        align-self: center !important;
    }
    .mob-boxbtns li{
        list-style: none;
    }
    .mob-boxbtns .btn {
        background-image: linear-gradient(to top, #333333, #3b3b3b, #444444, #4c4c4c, #555555);
        color: #fff;
        margin-right: 10px;
    }
    .border-head {
        position: relative;
        padding: 8px 15px;
    }
    #close {
        background: rgba(250,250,250,.8);
        width: 25px;
        height: 25px;
        display: inline-block;
        border-radius: 50%;
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
        cursor: pointer;
    }
    #close i {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translateX(-50%) translateY(-50%);
        color: #000;
        font-size: 20px;
    }
    .snake-ladder-main {
        min-height: calc(100vh - 100px);  
    } 
    .giftbox-board {
        height: 210px;
    }
    .giftbox-details{
        height: 170px !important;
    }
    .leader-board .lb-details {
        height: 142px !important;
    }
    .giftbox-board.show, .leader-board.show{
        width: 60%;
    }
    .giftbox-board {
        height: 210px;
    }
    .giftbox-details{
        height: 170px !important;
    }
    .leader-board .lb-details {
        height: 142px !important;
    }
    .giftbox-board.show, .leader-board.show{
        width: 40%;
    }
    .mob-boxbtns .btn {
        padding: 5px 20px;
    }
    .dice-and-roll{
        margin-top: 0;
        padding: 0 10px;
    }
    .quiz-overlay h3{
        margin-bottom: 0;
    }
    .snake-ladder-main{
        margin-bottom: 40px;
    }
    /* Leaderboard giftboard ends */

    .desktop-div-img{
        display: none;
    }
    .mobile-div-img{
        display: block !important;
    }
    .snake-quiz-main-outer h3 {
        font-size: 18px;
    }
    .snake-quiz-main-outer .answers li{
        padding: 0 15px;
        margin-bottom: 10px;
    }
    .snake-quiz-main-outer .btn-outter {
        text-align: left;
        padding: 0 20px;
    }
    .snake-ladder-left {
        -ms-flex: 0 0 40%;
        flex: 0 0 40%;
        max-width: 40%;
        margin-top: 20px;
    }
    .leader-board{
        margin-top: 20px;
    }
    .snake-ladder-canvas{
        -ms-flex: 0 0 60%;
        flex: 0 0 60%;
        max-width: 60%;
    }
    .snake-ladder-canvas {
        margin-top: 20px;
    }
    .snake-ladder-main .main-container ul {
        gap: 4px;
    }
    .snake-ladder-main .main-container ul li {
        height: 90px;
        border: 2px solid #ec2029;
        text-align: left;
    }
    .snake-ladder-main .main-container ul li:nth-child(2n+1) {
        border: 2px solid #ddd;
    }
    .snake-ladder-main .main-container ul li.box > span {
        font-size: 14px;
        color: #bfbfbf;
        z-index: 9;
        text-shadow: 1px 1px 0px #464646;
        left: 3px;
    }
    .main-container ul li.box .giftin-box {
        width: 70px;
        height: 70px;
        position: absolute;
        left: 50%;
        top: 40%;
        transform: translateX(-50%) translateY(-40%);
    }
    .snake-ladder-main .main-container ul li img {
        width: 70px !important;
        height: 70px !important;
        object-fit: contain !important;
    }
    .main-container .player_in_board {
        margin-top: 25px;
        width: 30px;
    }
    .snake-ladder-main #snake1 {
        top: 26%;
        right: 14%;
        width: 205px;
        z-index: 9;
        left: inherit;
    }
    .snake-ladder-main #snake2 {
        top: 75%;
        left: 72%;
        width: 40px;
        z-index: 99;
    }
    .snake-ladder-main #snake3 {
        top: 11%;
        left: 32%;
        width: 80px;
        z-index: 9;
    }
    .snake-ladder-main #snake4 {
        top: 59%;
        left: 35%;
        width: 61px;
        z-index: 99;
    }
    .snake-ladder-main #snake5 {
        top: 43%;
        left: 20%;
        width: 60px;
        z-index: 99;
    }
    .snake-ladder-main #ladder1 {
        top: 45%;
        left: 11%;
        width: 37px;
        z-index: 9;
    }
    .snake-ladder-main #ladder2 {
        top: 42%;
        left: 50%;
        width: 95px;
        z-index: 9;
    }
    .snake-ladder-main #ladder3 {
        top: 25%;
        left: 50%;
        width: 95px;
        z-index: 9;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1440px) {
      /* Leaderboard giftboard Starts */
    .snake-ladder-main{
        position: relative;
    }
    .giftbox-board, .leader-board{
        display: none;
    }
   .giftbox-board.show,
   .leader-board.show{
        display: block;
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translateX(-50%) translateY(-50%);
        width: 50%;
        z-index: 999;
        max-width: 500px;
    }
    .over-hidden{
        overflow-y: hidden;
    }
    .overlay-box.overlay-show {
        background: rgba(0,0,0,.5);
        width: 100%;
        position: absolute;
        height: 100%;
        left: 0;
        top: 0;
        z-index: 99;
    }
    .snake-quiz-main-outer {
        margin-top: 0;
    }
    .side-container {
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-pack: justify !important;
        justify-content: space-between !important;
        max-width: 500px;
        margin: 0 auto;
        padding: 15px 0;
    }
    .mob-boxbtns{
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-item-align: center !important;
        align-self: center !important;
    }
    .mob-boxbtns li{
        list-style: none;
    }
    .mob-boxbtns .btn {
        background-image: linear-gradient(to top, #333333, #3b3b3b, #444444, #4c4c4c, #555555);
        color: #fff;
        margin-right: 10px;
    }
    .border-head {
        position: relative;
        padding: 8px 15px;
    }
    #close {
        background: rgba(250,250,250,.8);
        width: 25px;
        height: 25px;
        display: inline-block;
        border-radius: 50%;
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
        cursor: pointer;
    }
    #close i {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translateX(-50%) translateY(-50%);
        color: #000;
        font-size: 20px;
    }
    .snake-ladder-main {
        min-height: calc(100vh - 100px);  
    } 
    .snake-ladder-main {
        margin-bottom: 40px;
      }
    .dice-outer {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .snake-quiz-main-outer h3 {
        font-size: 18px;
    }
    .quiz-info h3{
        margin-bottom: 0;
    }
    .dice-and-roll{
        margin-top: 0;
    }
    /* Leaderboard giftboard ends */

    .desktop-div-img{
         display: block !important;
    }
    .mobile-div-img{
        display: none;
    }
    .snake-ladder-left {
        -ms-flex: 0 0 40%;
        flex: 0 0 40%;
        max-width: 40%;
        margin-top: 20px;
    }
    .snake-ladder-canvas {
        -ms-flex: 0 0 60%;
        flex: 0 0 60%;
        max-width: 60%;
        margin-top: 20px;
    }
    .snake-ladder-main .main-container ul {
        gap: 4px;
    }
    .snake-ladder-main .main-container ul li {
        height: 95px;
        border: 2px solid #ec2029;
        text-align: left;
    }
    .main-container ul li.box .giftin-box {
        width: 70px;
        height: 70px;
        position: absolute;
        left: 50%;
        top: 40%;
        transform: translateX(-50%) translateY(-40%);
    }
    .snake-ladder-main .main-container ul li img {
        width: 70px !important;
        height: 70px !important;
        object-fit: contain !important;
    }
    .snake-ladder-main .main-container ul li.box > span {
        font-size: 14px;
        color: #bfbfbf;
        z-index: 9;
        text-shadow: 1px 1px 0px #464646;
        left: 3px;
    }
    .snake-ladder-main #snake1 {
        top: 26%;
        right: 14%;
        width: 230px;
        z-index: 9;
        left: inherit;
      }
    .snake-ladder-main #snake2 {
        top: 75%;
        left: 72%;
        width: 40px;
        z-index: 99;
    }
    .snake-ladder-main #snake3 {
        top: 9%;
        left: 32%;
        width: 100px;
        z-index: 9;
    }
    .snake-ladder-main #snake4 {
        top: 59%;
        left: 32%;
        width: 90px;
        z-index: 99;
    }
    .snake-ladder-main #snake5 {
        top: 43%;
        left: 21%;
        width: 70px;
        z-index: 99;
    }
    .snake-ladder-main #ladder1 {
        top: 45%;
        left: 11%;
        width: 37px;
        z-index: 9;
    }
    .snake-ladder-main #ladder2 {
        top: 42%;
        left: 50%;
        width: 95px;
        z-index: 9;
    }
    .snake-ladder-main #ladder3 {
        top: 25%;
        left: 50%;
        width: 95px;
        z-index: 9;
    }
    .main-container .player_in_board {
        margin-top: 25px;
        width: 30px;
    }
}
 

@media only screen and (min-width:1300px) and (max-width:1440px) {
 
    .snake-ladder-main #snake1 {
        top: 26%;
        right: 14%;
        width: 260px;
        z-index: 9;
        left: inherit;
    }
    .snake-ladder-main #snake4 {
        top: 59%;
        left: 32%;
        width: 101px;
        z-index: 99;
    }
    .snake-ladder-main #snake3 {
        top: 9%;
        left: 32%;
        width: 114px;
        z-index: 9;
    }
    .snake-ladder-main #ladder3 {
        top: 20%;
        left: 55%;
        width: 115px;
        z-index: 9;
    }
    .snake-ladder-main #ladder3 {
        top: 20%;
        left: 55%;
        width: 115px;
        z-index: 9;
    }
    .snake-ladder-main #ladder2 {
        top: 39%;
        left: 53%;
        width: 108px;
        z-index: 9;
    }
    .snake-ladder-main #ladder1 {
        top: 42%;
        left: 12%;
        width: 46px;
        z-index: 9;
    }
}

@media only screen and (min-width:1441px) and (max-width:1600px) {
    .family-btm {
        position: absolute;
        right: 0;
        bottom: 0;
        width: 280px;
    }
 
}
@media only screen and (min-width:1601px) and (max-width:1920px) {
    .family-btm {
        position: absolute;
        right: 0;
        bottom: 0;
        width: 330px;
    }
}
@media only screen and (min-width: 1441px) and (max-width: 1920px) and (resolution: 96dpi) {
    .snake-ladder-left{
        margin-top: 20px;
    }
    .snake-ladder-canvas{
        margin-top: 20px;
    }
}
@media only screen and (min-width: 1441px) and (max-width: 1920px) and (resolution: 120dpi) {
    .snake-ladder-left{
        margin-top: 40px;
    }
    .snake-ladder-canvas{
        margin-top: 40px;
    }
    .snake-ladder-main{
        background: red !important;
    }
}
 


/* Snake & Ladder Front End Ends */

/* Snake And Ladder User Dashboard Starts  */
@media only screen and (min-width:320px) and (max-width:767px) {
    .sl-dashboard-box{
        margin-bottom: 20px;
    }
    .sl-position-box {
        margin-top: 0;
    }
    .sl-position-inn {
        width: 75%;
    }
    .sl-position-sec {
        padding: 20px 10px;
    }
    .sl-position-inn h6 {
        font-size: 15px;
    }
}

@media only screen and (min-width:767px) and (max-width:991px) {
    .sl-dashboard-sec .card-body{
        padding: 10px;
    }
    .sl-dashboard-sec .card-body .right-text {
        margin-left: 7px;
    }
    .sl-position-box {
        margin-top: 20px;
    }
    .sl-position-inn {
        width: 80%;
    }
}
/* Snake And Ladder User Dashboard Ends  */

/* Test @ 17 Jan 2025 */