@charset "utf-8";

/* This is My Custom CSS */
/* 
   Author: Company Name,
   Author URL: Company URL,
   
   Site Name: Site Title,   
   Site Description: Site Field,
   Template: Responsive,
   Framework: Bootstrap v4.0.0    
*/
body {
  margin: 0;
  padding: 0;
  overflow-y: scroll !important;
  color: #000000;
  /* word-break: break-all; */
}

/* HTML Elements */
ul,
ol {
  margin: 0;
  padding: 0;
}

/* HTML Elements ends */

/* Typography CSS starts */
 
/* titillium-web-300 - latin */
@font-face {
  font-display: swap;  
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/hoc-employee/titillium-web-v17-latin-300.woff2') format('woff2');  
}
/* titillium-web-regular - latin */
@font-face {
  font-display: swap; 
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/hoc-employee/titillium-web-v17-latin-regular.woff2') format('woff2');  
}
/* titillium-web-600 - latin */
@font-face {
  font-display: swap; 
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/hoc-employee/titillium-web-v17-latin-600.woff2') format('woff2');  
}
/* titillium-web-700 - latin */
@font-face {
  font-display: swap; 
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/hoc-employee/titillium-web-v17-latin-700.woff2') format('woff2');  
}


@font-face {
  font-family: 'Krona One';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/krona-one-regular.woff') format('woff'), 
       url('../fonts/krona-one-regular.ttf') format('truetype'), 
       url('../fonts/krona-one-regular.svg#TitilliumWeb') format('svg');
}

/* Spartan Regular- latin */
@font-face {
  font-family: "Spartan";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/spartan-regular.woff") format("woff2"), url("../fonts/spartan-regular.ttf") format("woff"), url("../fonts/spartan-regular.ttf") format("truetype"), url("../fonts/spartan-regular.svg") format("svg");
}
/* Spartan Bold - latin */
@font-face {
  font-family: "Spartan";
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/spartan-bold.woff") format("woff2"), url("../fonts/spartan-bold.ttf") format("woff"), url("../fonts/spartan-regular.ttf") format("truetype"), url("../fonts/spartan-regular.svg") format("svg");
}
/* Spartan Extra Bold - latin */
@font-face {
  font-family: "Spartan";
  font-style: normal;
  font-weight: 800;
  src: url("../fonts/spartan-extrabold.woff") format("woff2"), url("../fonts/spartan-extrabold.ttf") format("woff"), url("../fonts/spartan-extrabold.ttf") format("truetype"), url("../fonts/spartan-extrabold.svg") format("svg");
}



/* poppins-300 - latin */
@font-face {
  font-display: swap;  
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/poppins-300.woff2') format('woff2'); 
}
/* poppins-regular - latin */
@font-face {
  font-display: swap;  
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/poppins-regular.woff2') format('woff2');  
}
/* poppins-500 - latin */
@font-face {
  font-display: swap;  
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/poppins-500.woff2') format('woff2');  
}
/* poppins-600 - latin */
@font-face {
  font-display: swap; 
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/poppins-600.woff2') format('woff2');  
}
/* poppins-700 - latin */
@font-face {
  font-display: swap;  
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/poppins-700.woff2') format('woff2');  
}
@font-face {
  font-display: swap;  
  font-family: 'Anton';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/anton-regular.woff2') format('woff2'); 
}



/* Malayalam Fonts Starts */
@font-face {
  font-family: 'Indulekha';
  src: url('Indulekha-Normal.woff2') format('woff2'),
      url('Indulekha-Normal.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Indulekha';
  src: url('Indulekha-Bold.woff2') format('woff2'),
      url('Indulekha-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'IndulekhaHeavy';
  src: url('IndulekhaHeavy-Bold.woff2') format('woff2'),
      url('IndulekhaHeavy-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

/* Malayalam Fonts Ends */

.question-container.lang-mal .question{
  font-family: 'IndulekhaHeavy';
  font-weight: bold;
  line-height: 33px;
}
.question-container.lang-mal .question span{
  font-size: 18px !important;
  line-height: 33px;
}

.question-container.lang-mal   .answers a{
  font-family: 'Indulekha' !important;
  font-style: normal  !important;
  font-weight: bold !important;
  color: #000;
  font-size: 15px;
}
.question-container.lang-mal .answers a.correct, .question-container.lang-mal .answers a.incorrect{
  color: #fff;
}
.question-container.lang-mal .opt-label .label-text{
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
}
/* Typography CSS ends */







/* Global CSS */
.clear {
  clear: both;
}

.no-padding {
  padding-right: 0;
  padding-left: 0;
}

.no-paddingR {
  padding-right: 0;
}

.no-paddingL {
  padding-left: 0;
}

/* Some Padding Field Changes ( for below media queries written) */
.change-padding {
  padding-right: 15px;
  padding-left: 15px;
}

.change-paddingR {
  padding-right: 0px;
}

.change-paddingL {
  padding-left: 0px;
}

.spl-padding {
  padding-right: 0;
  padding-left: 0;
}

/* Some Padding Field Changes ends */
body{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
}
img {
  max-width: 100%;
}

:root {
    --main-bg-color: #eebc1d;
    --main-bg-hover: #000000;
    --main-text-color: #000000;
    --white-text-color: #ffffff;
  
    --normal-text: 14px;
    --medium-weight: 600;
    --bold-weight: 700;

    --h3-size: 32px;
    --h3-weight: 600;
    --h4-size: 23px;
    --h4-weight: 600;
    --h5-size: 20;
    --h5-weight: 600;
}


@media only screen and (min-width: 320px) and (max-width: 767px) {
  .change-padding {
    padding-right: 0px;
    padding-left: 0px;
  }
  .change-paddingR {
    padding-right: 15px;
  }
  .change-paddingL {
    padding-left: 15px;
  }
  .spl-padding {
    padding-right: 15px;
    padding-left: 15px;
  }
}

button:focus {
  outline: none;
  box-shadow: none;

}


/* Loader Starts */
.preloader {
  position: fixed;
  background: #fff;
  width: 100%;
  height: 100%;
  z-index: 9;
}
.loader {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}
/* Loader Ends */
 
/* Menu Starts */
.header-sec-outer{
  background: #ffffff;
  box-shadow: 0 1px 5px 2px #2222221a;
}
.logo-header {
  display: inline-block;
}
.header-sec-outer .navbar-brand .logo-header img {
  width: auto;
  height: 70px;
  max-width: 400px;
  object-fit: contain;
}
.header-sec-outer .navbar-brand {
  margin: 0;
  padding: 0;
}
.header-sec-outer .navbar.navbar-expand-lg {
  padding: 10px 0 10px 0;
}
.header-sec-outer .container > .row{
  width: 100%;
  margin: 0;
  width: 100%;
}
 
.header-sec-outer .container .col-xl-12{
  display: -ms-flexbox !important;
  display: flex !important;
  -ms-flex-pack: justify !important;
  justify-content: space-between !important;
}
/* Menu Ends */

/* Banner Starts */
.banner-image-outer{
  padding: 0;
  position: relative;
  text-align: left;
  /* background: rgb(255,201,5); */
  /* height: 250px; */
  /* background: linear-gradient(90deg, rgb(255, 221, 0) 0%, rgb(255, 221, 0) 50%, rgb(255, 221, 0) 50%, rgb(255, 221, 0) 100%);   */
}
 

.banner-image-element{
  position: absolute;
  left: 0;
  top: 0;
}
.banner-image-outer img{
  object-fit: cover;
  /* height: 250px; */
  width: 100%;
}
/* Banner Ends */

/* Form Sec Starts */
.form-sec{
  padding: 60px 0 150px 0;
}
.form-sec p{
    font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
  font-size: 22px;
  line-height: 35px;
  margin-bottom: 0;
  color: #000;
}
 

/* Form Starts */
.banner-right-form{
  background: #efeff0;
  padding: 25px 30px;
  border-radius: 20px;
  box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.20 );
}
.mano-login-form{

}
.contest-form {
  margin: 0;
}
.contest-form h5{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-size: 25px;
  color: var(--headingColor);
  margin-bottom: 20px;
  margin: 0 auto;
  margin-bottom: 25px;
}
.contest-form .form-control{
  border-radius: 7px;
  background: #fff;
  min-height: 41px;
  border: 1px solid #ccc;
  color: #000;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-size: 15px;
}
.contest-form  textarea.form-control{
  min-height: 100px;
}
.contest-form .form-control:focus{
  border-color: #626262;
  box-shadow: none;
  outline: none;
}
.contest-form .btn{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  background: var(--buttonBgColor);
  color: var(--buttonColor);
  border-radius: 7px;
  padding: 5px 30px;
  font-size: 18px;
  margin-top: 0;
}
.contest-form .btn:focus{
  outline: none;
  box-shadow: none;
}
.contest-form #txtName-error,
.contest-form #ddlGrade-error,
.contest-form #txtSchool-error,
.contest-form #txtMobile-error,
.contest-form #txtEmail-error,
.contest-form #ddlLocation-error,
.contest-form #txtEmployee-error,
.contest-form #txtDesignation-error,
.contest-form #txtEmpID-error,
.contest-form #txtDesg-error,
.contest-form #ddlDepartment-error,
.contest-form #ddlSchools-error,
.contest-form #txtPwd-error,
.contest-form #error_login,
.contest-form #txtCnfrmPwd-error,
.contest-form #ddlSchoolCategory-error{
  color: red !important;
  font-size: 13px;
  margin-bottom: 0;
  position: absolute;
  bottom: -23px;
  left: 22px;
  line-height: 20px;
  font-weight: 400;
}
.contest-form .form-group {
  margin-bottom: 24px;
}
/* Form Ends */


/* Form Sec Ends */



/* Cash prizes Starts */
.cash-prizes{
  background: transparent;
  position: relative;
  overflow: hidden;
  margin-top: -80px;
  padding-bottom: 60px;
}
 .cash-prizes:after{
  background: var(--bgColor)!important;
  content: "";
  position: absolute;
  top: 80px;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.scroller-ship-bg{
  background: #fff;
  height: 243px;
  border-radius: 45px;
  border: 1px solid #e9e9e9;
}
.scroller-ship-bg h4{
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
  font-size: 35px;
  line-height: 46px;
  margin-bottom: 0;
  color: #000;
  position: absolute;
  left: 10%;
  top: 50%;
  transform: translateY(-50%);
}
.scroller-ship-bg span{
  transform: rotate(-90deg);
  position: absolute;
  right: -60px;
  bottom: 50px;
  color: var(--buttonColor);
  font-size: 12px;
}
.scroller-ship-bg img {
  width: auto;
  height: 200px;
  object-fit: contain;
  position: absolute;
  right: 10%;
  top: 50%;
  transform: translateY(-50%);
}

/* .footer-top-bg{
  background: var(--bgColor)!important;
  position: absolute;
  top: 80px;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
} */
.single-box-head,
.single-box-bottom{
  padding: 25px 30px;
}
.single-box-head h5,
.single-box-bottom  h5{
  font-family: 'Montserrat';
  font-weight: 600;
  font-size: 30px;
  color: #fff;
  text-align: center;
  margin-bottom: 0;
}
.single-box-inn {
  background: #0082c9;
  border-radius: 20px 20px 0 0;
}
.single-box-bottom {
  text-align: center;
  background: #f48120;
  border-radius: 0 0 20px 20px;
}
.prize-heading{
  margin-top: 60px;
}
.prize-heading h3{
  font-family: 'Montserrat';
  font-weight: 600;
  font-size: 40px;
  color: #000;
  text-align: center;
  margin-bottom: 30px;
} 
.prize-box {
  padding: 0;
}
.prize-box-head {
  background: #ffdd00;
}
.prize-box-text{
  background: #fff;
}
.border-r-top-left{
  border-radius: 20px 0 0 20px ;
}
.border-r-top-left .prize-box-head{
  border-radius: 20px 0 0 0 ;
}
.border-r-top-left .prize-box-text{
  border-radius: 0 0 0 20px;
}
.border-r-top-right{
  border-radius: 0 20px 20px 0 ;
}
.border-r-top-right .prize-box-head {
  border-radius: 0 20px 0 0 ;
}
.border-r-top-right .prize-box-text{
  border-radius: 0 0 20px 0 ;
}

.prize-box h5,
.prize-box-text h5{
  font-family: 'Montserrat';
  font-weight: 600;
  font-size: 30px;
  text-align: center;
  margin-bottom: 0;
}
.prize-box-head h5{
  color:   #000;
}
.prize-box-text{
  color: #000;
}
.prize-box-head,
.prize-box-text {
  padding: 30px 20px;
}
.border-bottm{
  border-bottom: 5px solid #febd2d;
}
.border-left-right{
  border-left: 3px solid #febd2d;
  border-right: 3px solid #febd2d;
}
.prize-box-text h5 small {
  font-size: 70%;
  font-weight: 600;
  margin-right: 5px;
}
/* Cash prizes Ends */

/* Footer Starts */
footer {
  padding: 20px 0;
  background: #8f2e7f;
}
.foot-inn p{
  margin-bottom: 0;
      font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
}
.footer-link a{
  color: #fff;

  text-decoration: underline;
}
.footer-link h6{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  color: #fff;
  margin-bottom: 0;
  font-size: 14px;
}


/* Footer Ends */
.scroller-ship-img{
  position: relative;
}
.scroller-ship-img span{
  transform: rotate(-90deg);
  position: absolute;
  right: -60px;
  bottom: 50px;
  color: var(--headingColor);
  font-size: 12px;
}









/* quiz section section */
.quiz-banner-sec .banner-image-outer{
  
}
.quiz-banner-sec .banner-image-outer img{
  height: auto;
}
.quiz-container {
  padding: 0 !important;
  margin: 0 !important;
}
.quiz-section-outer{
  padding: 0 0 100px 0;
  background: #f1f1f1;
}
.quiz-start-screen {
  margin-top: 0;
  text-align: center;
  padding: 70px 40px;
  border-radius: 25px;
  background: rgba( 255, 255, 255, 1 );
  /* box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.20 );
  backdrop-filter: blur( 0px );
  -webkit-backdrop-filter: blur( 0px ); */
  border-radius: 25px;
 
}
.quiz-start-btn.quiz-button{
    font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
  background: var(--buttonBgColor)!important;
  color: #fff !important;
  border-radius: 7px !important;
  padding: 5px 40px !important;
  font-size: 18px;
  margin-top: 0;
  display: inline-block !important;
}
.quiz-start-btn.quiz-button:hover{
 
}
.quiz-counter {
  margin-top: 0;
  margin-bottom: 40px;
}
.questions span{
  font-size: 22px;
}
.questions {
    font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
 
}
.questions .question-container {
  background: rgba( 255, 255, 255, 1 );
  box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.20 );
  /* backdrop-filter: blur( 0px );
  -webkit-backdrop-filter: blur( 0px ); */
  border-radius: 25px;
  width: 100%;
  float: left;
  padding: 50px 40px;
}
.question span{
  display: block;
}
.question img {
  max-height: 160px;
  margin-top: 15px;
  padding-left: 30px;
  max-width: 300px;
}
.questions .answers {
  margin-top: 25px;
  padding: 0 -15px;
}
.answers li {
  width: 50%;
  float: left;
  margin-bottom: 15px;
  padding: 0 25px;
}
.questions .answers a {
  border-radius: 10px;
  padding: 15px 20px;
  margin-bottom: 0;
  cursor: pointer;
  font-size: 18px;
  -moz-box-shadow: 0 2px 3px 0 rgba(0,0,0,.10);
  -webkit-box-shadow: 0 2px 3px 0 rgba(0,0,0,.10);
  box-shadow: 0 2px 3px 0 rgba(0,0,0,.10);
}
.questions .answers a:hover{
  -moz-box-shadow: 0 2px 3px 0 rgba(0,0,0,.40);
  -webkit-box-shadow: 0 2px 3px 0 rgba(0,0,0,.40);
  box-shadow: 0 2px 3px 0 rgba(0,0,0,.40);
}
.quiz-controls {
  padding: 15px 40px;
  background: transparent !important;
  color: #000;
}
.quiz-controls .quiz-response{
  color: #000;
  font-weight: 500;
  font-size: 18px;
  display: inline-block;
  width: 100%;
  margin-top: 25px;
}
.quiz-next-btn,
.quiz-restart-btn {
    font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
  background: var(--buttonBgColor)!important;
  color: #fff !important;
  border-radius: 7px !important;
  padding: 5px 40px !important;
  font-size: 18px;
  margin-top: 0;
}
.quiz-finish-btn{
    font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
  background: var(--bgColor)!important;
  color: #fff !important;
  border-radius: 7px !important;
  padding: 5px 40px !important;
  font-size: 18px;
  margin-top: 0;
}
.quiz-results {
  display: inline-block;
  border-radius: 12px;
  font-weight: 500;
  font-size: 14px;
}
.quiz-results {
  background: rgba( 255, 255, 255, 1 );
  box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.20 );
  backdrop-filter: blur( 0px );
  -webkit-backdrop-filter: blur( 0px );
  padding: 40px;
}
.quiz-results-screen {
  margin: 30px 0 10px 0;
}
.quiz-restart-btn {
  background: transparent !important;
  color: #000 !important;
  font-size: 18px;
}
.quiz-restart-btn ol {
    list-style: none;
}
.quiz-restart-btn h1 {
    font-size: 22px;
    font-weight: 600;
}
 
/* quiz section section  Ends*/

/* Quiz section Starts*/
.answers img {
  height: 120px;
  width: auto;
}
.correct-option img {
  max-height: 100px;
}
/* Quiz section Ends*/



.g-recaptcha {
transform:scale(0.77);
-webkit-transform:scal(0.77);
transform-origin:0 0;
-webkit-transform-origin:0 0;
} 

.countdown-label {
 font-family: 'Titillium Web';
	color: #65584c;
	text-align: center;
	text-transform: uppercase;
	display: inline-block;
  letter-spacing: 2px;
  margin-top: 9px
}
#countdown{
  box-shadow: 0 1px 2px 0 rgba(1, 1, 1, 0.4);
  width: 240px;
  height: 96px;
  text-align: center;
  background: #f1f1f1;
  border-radius: 5px;
  margin: auto;
}
#countdown #tiles{
  color: #fff;
  position: relative;
  z-index: 1;
  text-shadow: 1px 1px 0px #ccc;
  display: inline-block;
  font-family: Arial, sans-serif;
  text-align: center;
  padding: 20px;
  border-radius: 5px 5px 0 0;
  font-size: 48px;
  font-weight: thin;
  display: block;
}

.color-full {
  background: #53bb74;
}
.color-half {
  background: #ebc85d;
}
.color-empty {
  background: #e5554e;
}

#countdown #tiles > span{
	width: 70px;
	max-width: 70px;

	padding: 18px 0;
	position: relative;
}
#countdown .labels{
	width: 100%;
	height: 25px;
	text-align: center;
	position: absolute;
	bottom: 8px;
}

#countdown .labels li{
	width: 102px;
 	color: #f47321;
	text-shadow: 1px 1px 0px #000;
	text-align: center;
	text-transform: uppercase;
	display: inline-block;
}

#countdown {
  width: auto;
  display: inline-block;
  height: auto;
  background: #fff;
  box-shadow: none;
}
#countdown #tiles {
font-size: 25px;
  padding: 5px 10px;
  background: var(--bgColor);;
  color: #fff;;
  text-shadow: none;
}
.countdown-label {
  font-size: 12px;
  padding: 8px;
  margin: 0;
 font-family: 'Titillium Web';
  font-weight: 400;
  letter-spacing: 1px;
  color: #000;
}
#timer {
  position: absolute;
  right: 15px;
  top: 0;
}

.quiz-header h3 {
  font-family: 'Titillium Web' !important;
  font-weight: 600;
  display: inline-block;
  color: var(--headingColor);
  margin-bottom: 0;
}
.quiz-start-screen h5{
    font-family: 'Titillium Web' !important;
    font-weight: 400;
    line-height: 40px;
    font-size: 22px;
    margin-bottom: 25px;
}
 
#al-particip{
  margin-top: 25px;
}


.mb-0{
      margin-bottom: 0;
}

.banner-sec.quiz-banner-sec{
   background: #ffca05;
}
.quiz-banner-sec .banner-image-outer {
  text-align: left !important;
  padding: 0 15px; 
  position: relative;
}

.quiz-banner-sec .banner-image-outer h4{
    font-family: 'Titillium Web';
    font-weight: 600;
    font-size: 44px;
    line-height: 44px;
    color: #000;
    position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 15px;
}


.quiz-banner-sec .banner-image-outer {
  background: url("https://www.tadaang.com/static/img/hoc_employee/pattern.png") #c00;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: right;
}


#google_recaptcha .rc-anchor-pt {
  display: none !important;
}

#timeupsHead {
  text-align: center;
  color: red;
  font-size: 23px;
  font-weight: 600;
}
#timeupstext{
    text-align: center;
}
#al-particip{
 
  color: red;
}
.quiz-restart-btn {
  /* background: rgba( 255, 255, 255, 0.15 );
  box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.20 );
  backdrop-filter: blur( 0px );
  -webkit-backdrop-filter: blur( 0px );
  border-radius: 25px !important; */
  width: 100%;
  float: left;
  padding: 50px 40px !important;
}


/* Jigsaw Starts */
body{
  background-color: transparent !important;
  overflow-y: scroll !important;
}
.jigsaw-puzzle canvas {
  background-color: #d0eef8 !important;
}
.jigsaw-puzzle #myCanvas {
  position: relative !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin-top: 20px;
}
#getTimer {
  font-size: 25px;
  color: #fb1230;
  float: left;
  display: inline-block;
  text-align: left;
  font-weight: 500;
  background-color: #f7f7f7;
  margin-bottom: 25px;
  border-radius: 5px;
  padding: 0 10px;
  -moz-box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.2), inset 2px 4px 0 0 rgba(255, 255, 255, 0.08);
  -webkit-box-shadow: 0 3px 4px 0 rgb(0 0 0 / 20%), inset 2px 4px 0 0 rgb(255 255 255 / 8%);
  box-shadow: 0 3px 4px 0 rgb(0 0 0 / 20%), inset 2px 4px 0 0 rgb(255 255 255 / 8%);
}
.preview-thumb-mob{
  display: none;
}
.jigsaw-section-outer .container{
  /* max-width: 100% !important; */
  padding: 0;

}
.quiz-section-outer.jigsaw-section-outer {
  padding-top: 0;
}
.preview-btn {
  background: #ff001e;
  color: #fff;
  border: none;
 
  font-size: 18px;
  border: none;
  padding: 7px 25px;
  font-family: 'Titillium Web' !important;
  font-style: normal;
  
}
/* Jigsaw Ends */

/* .banner-sec.campaign-main-banner .banner-image-outer,
.banner-sec.campaign-main-banner img{
  height: 450px;
} */

.banner-sec.inner-campaign-banner .banner-image-outer,
.banner-sec.inner-campaign-banner img{
  height: auto;
}


/* Spin The Wheel Starts */
.wheel-wrapper {
 flex: 0 0 38rem;
}
.wheel-wrapper #wheel-container {
 height: 38rem;
 position: relative;
 border-radius: 50%;
 box-shadow: 0 0 6px 6px rgba(0, 0, 0, .1);
 margin-top: 15px;
 background: url(../img/spin-wheel-bg.png);
 background-size: contain;
 padding: 30px;
}
.wheel-wrapper #wheel-container #spin-action {
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 width: 80px;
 height: 80px;
 display: block;
 border: 0;
 border-radius: 50%;
 font-size: 25px;
 outline: none;
 cursor: pointer;
 background: url(../img/spin-bg-btn.png);
 background-size: cover;
 color: #555555;
 font-size: 0;
}  
.wheel-wrapper #wheel-container  .center-action{
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 width: 7rem;
 height: 7rem;
 display: block;
 border: 0;
 border-radius: 50%;
 font-size: 25px;
 outline: none;
 cursor: pointer;
 background: url(../img/center-btn.png);
 background-size: cover;
 color: #555555;
 font-size: 0;
}
.wheel-wrapper #wheel-container #spin-action:hover {
 color: #ffb739;
} 
.wheel-wrapper #wheel-container .marker{
 background: url(../img/spin-arrow.png);
 background-size: auto;
 position: absolute;
 top: 50%;
 transform: translate(-43%, -50%);
 width: 69px;
 height: 50px;
 background-size: cover;
}
.wheel-wrapper #wheel-container #wheel {
 height: 100%;
 position: relative;
 border-radius: 50%;
 overflow: hidden;
 transition: transform 3s ease;
}
.wheel-wrapper #wheel-container #wheel .part {
 width: 50%;
 position: absolute;
 transform-origin: center right;
}
.wheel-wrapper #wheel-container #wheel .part .name {
 width: 100%;
 height: 100%;
 padding: 0 82px 0 45px;
 box-sizing: border-box;
 display: flex;
 align-items: center;
 color: #000;
 font-size: 18px;
 font-weight: 600;
 overflow: hidden;
}
/* Spin Modal Starts */

#result-modal .modal-title{
 font-family: 'Cookie';
 font-style: normal;
 font-weight: 400;
 font-size: 90px;
 margin: 0 auto;
 color: #ec2125;
 line-height: 90px;
}
#result-modal .modal-title span{
 font-size: 38px;
}
#result-modal .modal-header h6{
 font-size: 22px;
 margin-top: 20px;
 margin-bottom: 0;
 color: #6b584c;
}
#result-modal .modal-body{
 padding-top: 0;
 padding-bottom: 20px;
}
#result-modal .quiz-result-ok,
#dragModal .result-sec {
 margin: 0 auto 20px auto;
 padding: 0;
}
.wheel-container-outer .action-buttons{
 display: none !important;
}
#result-modal .modal-body{
 text-align: center;
 font-size: 30px;
 color: #000;
 font-weight: 600;
}
#result-modal  .modal-content{
 border: none;
 outline: 0;
 border-radius: 25px;
}
#result-modal .modal-dialog{
   max-width: 700px;
   margin: 1.75rem auto;
}
#result-modal .close-button  {
   position: absolute;
   right: -15px;
   width: 40px;
   height: 40px;
   background: #fff;
   border-radius: 50%;
   top: -12px;
   padding: 0;
}
#result-modal .close-button img{
   width: 16px;
}
#result-modal .modal-header{
   border: none;
   display: inline-block;
   text-align: center;
   margin-top: 15px;
   padding-bottom: 0;
}
#result-modal  .modal-footer{
   padding: 0;
   border: none;
}
#result-modal .modal-content .icon-outer{
 padding: 0;
 background: url(../img/spin-modal-bg.jpg);
 background-size: cover;
 background-position: bottom;
 height: 100px;
 position: relative;
 border-radius: 25px 25px 0 0;
}
#result-modal .modal-content .icon-outer .icon{
 width: 100px;
 height: 100px;
 border-radius: 50%;
 background: #fff;
 margin: 0 auto;
 position: absolute;
 left: 50%;
 transform: translateX(-50%);
 bottom: -40px;
 box-shadow: 0px 6px 10px 0px rgba(0,0,0,0.1);
}
#result-modal .modal-content .icon-outer .icon:before{
 content: "";
 border: 1px solid #fff;
 width: 115px;
 height: 115px;
 position: absolute;
 left: 50%;
 top: 50%;
 transform: translateX(-50%) translateY(-50%);
 border-radius: 50%;
}
#result-modal .modal-content .icon-outer .icon img{
 width: 140px;
 border-radius: 50%;
}
#result-modal .modal-title img{
 width: 220px;
}
.modal-footer{
  border: none;
}
.result-sec .new-btn-red-text {
  color: #fff;
}
.result-sec .form-btn:hover .new-btn-red-text {
  color: #ff001e;
}

/* Spin Modal Ends */

.new-spin-wheel{
   margin-bottom: 40px;
   margin-top: 30px;
}
body.spin-fixed{
 overflow: hidden !important;
}
.full-w-spin.wheel-container-outer .go-back-btn-left {
  position: absolute;
  top: 15px;
  left: 50%;
  transform: translateX(-50%);
}
.full-w-spin.wheel-container-outer {
  position: relative;
}
.go-back-btn i {
  margin-right: 8px; 
}

.go-back-btn {
  font-size: 15px;
  background: #ff001e;
  border: 2px solid #ff001e;
  padding: 6px 12px 5px 12px;
  border-radius: 0;
  cursor: pointer;
  color: #fff !important;
  display: inline-block !important;
  font-family: "Spartan";
  font-style: normal;
  font-weight: 500;
}
.go-back-btn:hover{
  text-decoration: none;
}

.form-btn {
  background-color: #4e4e4e;
  font-family: "Spartan";
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  color: #fff !important;
  padding: 7px 20px 7px 20px !important;
  border-radius: 0;
}
.btn {
  display: inline-block;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: 1px solid transparent;
  padding: .375rem .75rem;
  font-size: 1rem;
  line-height: 1.5;
  border-radius: .25rem;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.form-btn {
  position: relative;
  z-index: 1;
  border: none;
  background: #333;
  cursor: pointer;
}
.form-btn:after, .form-btn:before {
  content: "";
  position: absolute;
  background: #fff;
  left: 0;
  top: 0;
  border: 2px solid #333;
}
.form-btn:after {
  height: 100%;
  width: 0;
  z-index: -1;
  -webkit-transition: all 0.6s;
  -moz-transition: all 0.6s;
  -o-transition: all 0.6s;
  transition: all 0.6s;
}
.quiz-result-ok .form-btn:after,
#dragModal .result-sec .form-btn:after {
  border: 2px solid #ff001e;
}
.form-btn:before {
  background: #333;
  width: 100%;
  height: 100%;
  z-index: -1;
  -webkit-transition: all 0.6s;
  -moz-transition: all 0.6s;
  -o-transition: all 0.6s;
  transition: all 0.6s;
}
.quiz-result-ok .form-btn:before,
#dragModal .result-sec .form-btn:before {
  background: #ff001e;
  border: 2px solid #ff001e;
}
.quiz-result-ok .new-btn-red-text {
  color: #fff;
}
.new-btn-red-text {
  z-index: 9;
  position: inherit;
  color: #ff001e;
  -webkit-transition: all 0.9s;
  -moz-transition: all 0.9s;
  -o-transition: all 0.9s;
  transition: all 0.9s;
  font-family: "Spartan";
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
}
.form-btn:hover:after {
  width: 100%;
}
.quiz-result-ok .form-btn:hover .new-btn-red-text {
  color: #ff001e;
}
/* Spin The Wheel Ends */

#timeupstext {
  font-size: 20px;
  font-weight: 600;
  padding-top: 50px;
}
.spin-start-screen #al-particip {
  background: #fff;
  text-align: center;
  padding: 100px 0;
  font-size: 30px !important;
  font-weight: 600;
  margin: 0;
}
div.rc-anchor-normal {
    height: 63px !important;
    width: 300px !important;
}

/* Comming Soon Starts */
.coming_soon_outer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999;
  background: rgba(0,0,0,.5);
  
}

.coming_soon_inner {
  background: #fff;
  display: inline-block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  border-radius: 10px;
  padding: 35px 20px;
  max-width: 500px;
  min-width: 500px;
}
.coming_soon_inner p{
  font-size: 18px;
  margin-bottom: 0;
}
.coming_soon_logo{
  text-align: center;
  margin-bottom: 40px;
}
.coming_soon_logo img{
  height: 100px;
}
.coming_soon_heading{
  text-align: center;
}
.coming_soon_heading h4{
  border-bottom: 1px solid #333;
  display: inline-block;
  font-weight: 600;
}
.coming_soon_body{
  text-align: center;
}
.coming_soon_body p{
  margin-top: 10px;
}
.coming-soon-dash{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  color: #8f2e7f;
}
.coming-soon-dash:hover{
  color: #000;
  text-decoration: none;
}
.start-end-tme{
  display: inline-block;
}
.start-end-tme {
  display: inline-block;
  font-weight: 400;
  margin-top: 6px;
}
/* Comming Soon Ends */

/* Quiz imag starts */
/* .image-quiz .question{
  width: 50%;
  float: left;
}
.image-quiz .answers{
  width: 50%;
  float: left;
} 
.image-quiz .answers a {
  border-radius: 12px;
  padding: 8px 20px;
  margin-bottom: 13px;
  cursor: pointer;
}
.image-quiz .answers {
  margin-top: 0;
}
.image-quiz .answers li:last-child a {
  margin-bottom: 0 !important;
}
.image-quiz .question {
  margin-bottom: 0;
}
.image-quiz .answers li {
  width: 100%;
  margin-bottom: 0;
  padding: 0;
} */
.image-quiz .answers img {
  height: 100px;
}
/* Quiz img Ends */



/* Math The Following  Starts */
.full-w-match-pr {
  height: auto;
  min-height: 80vh;
}
#predict-winn {
  -ms-flex-pack: center !important;
  justify-content: center !important;
  padding-top: 20px;
  padding-bottom: 40px;
}
.row.match-predict-head {
  width: 100%;
  margin: 0; 
  margin-top: 0;
}
.match-predict-head .heading-sec {
  text-align: center;
  background: #cfcfcf;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
  border-radius: 15px 15px 0 0;
}
#predict-winn h4 {
  font-family: 'Krona One';
  font-style: normal;
  font-weight: 400;
  font-size: 20px;
  color: #000;
  margin-bottom: 0;
  padding: 20px 0;
}
.full-w-match-pr #match-questions {
  background: #fff;
  border-radius: 0 0 15px 15px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
  padding-top: 30px;
  padding-bottom: 30px;
  width: 100%;
  position: relative;
  display: -ms-flexbox !important;
  display: flex !important;
  -ms-flex-pack: justify !important;
  justify-content: space-between !important;
}
#select_list_questions, #select_list_answers {
  width: 400px;
}
.full-w-match-pr #match-questions ul {
  max-width: 100%;
}
#match-questions ul {
  width: 100%;
  max-width: 200px;
  padding: 5px 0;
  float: left;
}
#match-questions ul li {
  margin-bottom: 20px;
  list-style: none;
  background-color: #f1f1f1;
  height: auto;
  padding: 5px 15px;
  cursor: pointer;
  border: 1px solid #666;
  font-family: "WorkSans";
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  border-radius: 6px;
  position: relative;
}
.full-w-match-pr #match-questions ul li {
  border: 1px solid #d3d3d3;
  background: #fff;
}
.full-w-match-pr #match-questions ul li {
  padding: 15px;
  box-shadow: rgba(94, 94, 94, 0.3) 0px 0px 4px 1px;
  border: none;
}
#select_list_questions ul li:before {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  background: white;
  right: -11px;
  border-radius: 50%;
  top: 50%;
  transform: translateY(-50%);
  border: 1px solid #ccc;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}
.full-w-match-pr #match-questions ul li:hover::before {
  background: #000;
}
.jtk-endpoint circle {
  fill: #000;
}
#select_list_answers ul li:before {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  background: white;
  left: -11px;
  border-radius: 50%;
  top: 50%;
  transform: translateY(-50%);
  border: 1px solid #666;
  border: 1px solid #ccc;
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
}
.jtk-connector path {
  stroke: #8a8a8a;
  stroke-width: 3;
}
.full-w-match-pr #select_list_answers ul {
  float: right;
}
/* Match The Following Ends */

/* Predict Starts */
#predict-box-outer {
  margin-bottom: 50px;
}
.employer-red-btn {
  padding: 10px 25px;
  border-radius: 0;
  color: #fff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, .25);
  background-image: linear-gradient(to bottom, #ff001e, #c50c09);
  background-repeat: repeat-x;
  border: none !important;
  font-size: 16px;
  line-height: 18px;
  box-shadow: none;
  font-family: "Spartan";
  font-style: normal;
  font-weight: 500;
  text-shadow: none;
  cursor: pointer;
}
#predict-box-outer .form-control:focus {
  box-shadow: none;
  border-color: #666;
}

#predict-box-outer .form-icon i:before{
  content: "\f0a7";
}
#predict-box-outer .form-icon i{
  transform: rotate(90deg);
  -moz-animation: bounce 2s infinite;
  -webkit-animation: bounce 2s infinite;
  animation: bounce 2s infinite;
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-30px);
  }
  60% {
    transform: translateY(-15px);
  }
}
/* Predict Ends */

/* Drag and Drop Starts */
.full-w-match-drag {
  min-height: 60vh;
  height: auto;
  background-size: cover !important;
  background-position: top center !important;
}
.drag-drop-ribbon {
  position: relative;
  padding: 15px 0;
  border-radius: 15px 15px 0 0;
  background: rgb(238, 238, 238);
  backdrop-filter: blur(4.2px);
  -webkit-backdrop-filter: blur(4.2px);
}
.drag-drop-left h3, .drag-drop-right h3 {
  color: #000;
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
  font-size: 18px; 
  margin-bottom: 0;
  padding: 10px 0;
}
.full-w-match-drag .drop-zone {
  background: #fff;
}
.drop-zone {
  min-height: 300px;
  width: 100%;
  padding: 15px;
  border-top: none;
  box-shadow: 0 4px 60px 0 rgba(0,0,0,0.2);
  border-radius: 0 0 15px 15px;
}
.list {
  position: relative;
  width: 100%;
  bottom: 0;
  text-align: center;
  margin-top: 50px;
  min-height: auto;
  margin-bottom: 40px;
}
.list div {
  display: inline-block;
  margin: 0 15px 20px 0;
  font-size: 18px;
  background: #5f5f5f;
  border-radius: 5px;
  padding: 3px 20px;
  cursor: pointer;
}
.list div {
  box-shadow: 0 1px 2px rgba(0,0,0,0.15);
  transition: all .6s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.list div p {
  margin-bottom: 0;
  color: #fff;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0px;
}
.drop-zone .draggable {
  color: #000;
  display: inline-block;
  margin: 0 15px 20px 0;
  font-size: 18px;
  background: #5f5f5f;
  border-radius: 5px;
  padding: 3px 10px;
  cursor: pointer;
}
.drop-zone .draggable p {
  margin-bottom: 0;
  color: #fff;
  line-height: 25px;
  font-size: 14px;
  font-weight: bold;
}

.draggable:focus {
  background: #4648a9;
}

#dragModal .icon {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: #fff;
  margin: 0 auto;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -40px;
  box-shadow: 0px 6px 10px 0px rgba(0,0,0,0.1);
}
#dragModal .icon-outer {
  padding: 0;
  background: url("../img//modal-bg.jpg");
  background-position-x: 0%;
  background-position-y: 0%;
  background-size: auto;
  background-size: cover;
  background-position: bottom;
  height: 100px;
  position: relative;
  border-radius: 10px 10px 0 0;
}
#dragModal .modal-content {
  border: none;
  outline: 0;
  border-radius: 10px;
}
#dragModal .modal-header {
  border: none;
  display: inline-block;
  text-align: center;
  margin-top: 30px;
  padding-bottom: 0;
}
#dragModal  .modal-title {
  font-family: 'Krona One';
  font-style: normal;
  font-weight: 400;
  color: #000;
  font-size: 35px;
}
#dragModal .close-button {
  position: absolute;
  right: -15px;
  width: 40px;
  height: 40px;
  background: #fff;
  border-radius: 50%;
  top: -12px;
  padding: 0;
  z-index: 99;
  border: none;
  cursor: pointer;
}
#dragModal  .close-button i {
  font-size: 20px;
  color: #7a7878;
  line-height: 25px;
}
#dragModal .modal-body p {
  margin-bottom: 0;
  text-align: center;
  font-size: 20px;
  line-height: 25px;
  font-weight: 600;
}
#dragModal .modal-body h4 {
  text-align: center;
  font-size: 20px;
  margin-top: 10px;
  font-weight: 600;
  margin-bottom: 0;
}
#dragModal .modal-footer .btn-primary{
  margin: 0 auto;
}
.drag-sucess.show{
  display: block;
}
/* Drag and Drop Ends */

.full-w-match-top .match-name-btn-left h3 {
  margin-bottom: 0;
}
.match-name-btn-left h3 {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 600;
  font-size: 25px;
  line-height: 35px;
  margin-bottom: 0;
 
}
.full-w-match-top  #startGame{
  width: 125px;

}
 
.full-w-match-top #getTimer {
  margin-bottom: 0;
}
.spin-start-screen.match-drag-alre #al-particip {
  min-height: 45vh;
}

#timeupstext img {
  height: 139px;
  display: inline-block;
  margin: 0 auto;
}
.thank-you-text {
  display: block;
  font-size: 40px;
  text-transform: uppercase;
}
.thanks-messa-left p{
  font-size: 17px;
}
.match-end {
  min-height: 60vh;
}
.match-end #timeupstext {
  padding-bottom: 50px;
}
.match-end #timeupstext p {
  margin-bottom: 0;
  font-weight: 400;
}

.drag-sucess.show:after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  background: rgba(0,0,0,.5);
  width: 100%;
  height: 100%;
  z-index: -1;
}
.view-contest-modal .match-follg-head-s {
  margin-bottom: 0;
}
div:where(.swal2-container) button:where(.swal2-styled).swal2-confirm{
  background-color: #ff001e;
}
div:where(.swal2-container) button:where(.swal2-styled).swal2-confirm:focus{
  outline: none !important;
}
div:where(.swal2-container) button:where(.swal2-styled).swal2-confirm{
  padding: 10px 20px;
  height: auto !important;
  line-height: 15px;
}

/* Thanks Message HOC Starts */
.thanks-messa{
  margin-top: 30px;
}
.icon-match {
  margin: 0 15px;
  border-radius: 10px;
}
.icon-match img {
  padding: 10px 20px;
  object-fit: contain;
}
.icon-match h4 {
  font-family: 'Titillium Web' !important;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  margin-bottom: 15px;
}
.thanks-messa-left {
  display: inline-block;
  width: 70%;
  float: left;
  text-align: left;
}
.thanks-messa-right {
  width: 30%;
  float: left;
}
.thanks-messa-right img {
  width: 60%;
  height: auto !important;
}
.thanks-messa-left .icon-match{
  margin-top: 25px;
  text-align: center;
}
.thanks-messa-left .icon-match img {
  width: 90px;
  height: auto !important;
}
.swal2-confirm.swal2-styled {
  background-color: #EC2134;
}
.swal2-confirm.swal2-styled:focus {
  outline: none;
  box-shadow: none;
}
/* Thanks Message HOC Ends */


/* Mangal Banner Starts */
.campaign-new-banner .container.carousel-caption {
  text-align: left;
  padding: 0 15px;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  bottom: inherit;
}
.campaign-new-banner  .carousel-caption h3,
.campaign-new-banner  .carousel-caption h4{
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 700;
  margin-bottom: 0;
 
}
.campaign-new-banner  .carousel-caption h4{
  font-size: 53px;
  line-height: 75px;  
}
.campaign-new-banner .carousel-caption h3{
  font-size: 82px;
  line-height: 75px;  
  display: inherit;
}

/* Mangal Banner Ends */


/* Tour Starts */
.introjs-tooltiptext {
  color: #000 !important;
  font-weight: 600;
  font-family: 'Titillium Web' !important;
  font-style: normal !important;
  font-size: 25px;
  line-height: 30px;
}
.introjs-bullets {
  display: none;
}
.introjs-button.introjs-skipbutton {
  display: none !important;
}
.introjs-button.introjs-skipbutton.introjs-donebutton,
.introjs-button.introjs-prevbutton,
.introjs-button.introjs-nextbutton {
  border: none;
  background: rgba(255, 221, 0, 1); 
  color: #000 !important;
  text-shadow: none;
  font-family: 'Titillium Web' !important;
  font-style: normal !important;
  font-size: 14px;
  font-weight: 600;
}
.introjs-button.introjs-skipbutton.introjs-donebutton:hover,
.introjs-button.introjs-prevbutton:hover,
.introjs-button.introjs-nextbutton:hover {
  background: rgba(255, 221, 0, 1); 
  color: #000 !important;
}
.introjs-button.introjs-nextbutton.introjs-disabled,
.introjs-button.introjs-prevbutton.introjs-disabled{
  background: rgba(255, 221, 0, .4); 
}
.introjs-progress {
  height: 4px !important;
}
.introjs-helperLayer {
  background: rgba(255, 221, 0, .5) !important;
  border: none !important;
}
.introjs-button.introjs-skipbutton.introjs-donebutton {
  display: inline-block !important;
  background: green;
  color: #fff !important;
}
.introjs-progressbar{
  background-color: #aea8a8 !important; 
}
.introjs-button.introjs-nextbutton.introjs-disabled {
  display: none;
}
.introjs-tooltipbuttons {
  display: flex;
  -ms-flex-pack: end !important;
  justify-content: flex-end !important;
}
.introjs-tooltipbuttons .introjs-button.introjs-prevbutton {
  order: 1;
}
.introjs-tooltipbuttons .introjs-button.introjs-nextbutton {
  order: 2;
}
.introjs-button.introjs-skipbutton.introjs-donebutton {
  order: 3;
  border-radius: 0 .2em .2em 0;
}
.introjs-button.introjs-skipbutton.introjs-donebutton:hover{
  background: green;
  color: #fff !important;
}
.drag-drop-left .drag-drop-ribbon {
  background-color: #d4edda;
}
.drag-drop-right .drag-drop-ribbon {
  background-color: #d4edda;
}
/* Tour Ends */


/* Match The Following Starts */
#match-questions ul li img {
  max-height: 45px;
  width: auto;
}
#match-questions ul li .hidden {
  display: none;
}
#match-questions ul li{
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 600;
}
#match-questions ul li{
  display: -ms-flexbox !important;
  display: flex !important;
}
#match-questions ul li span{
  -ms-flex-item-align: center !important;
  align-self: center !important;
}
#match-questions ul li.red-box {
  background-color: #FF9999;
  border-color: #FF9999;
  color: #000;
}
#match-questions ul li.green-box {
  background-color: #d4edda;
  border-color: #c3e6cb;
  color: #000;
}

#match-questions ul li.red-box {
  animation: shake 0.5s;
}
@keyframes shake {
  0% {
    transform: rotate(0deg);
  }

  25% {
    transform: rotate(5deg);
  }

  50% {
    transform: rotate(0eg);
  }

  75% {
    transform: rotate(-5deg);
  }

  100% {
    transform: rotate(0deg);
  }
}

#select_list_answers ul li span{
  margin: 0 auto;
}
/* Match the Following Ends */

.congrats h3 {
  font-size: 35px;
  font-weight: 600;
  color: #e70c31;
}
.congrats-text {
  display: inline-block;
  background-color: #36bf55;
  padding: 7px 25px;
  font-size: 18px;
  font-weight: 600;
  border-radius: 6px;
  color: #000;
  width: auto;
}
.congrats-thanks {
  font-size: 18px;
  font-weight: 600;
  margin-top: 10px;
  color: #000;
}
.congrat-icon img {
  height: 100px;
}

#dragModal .modal-body {
  padding-top: 60px;
}

/* Match The Following Starts  */
#select_list_questions ul li img {
  margin: 0 auto;
}
#select_list_questions {
  width: 35%;
}
#select_list_questions li {
  width: 80%;
}
#select_list_answers {
  width: 65%;
}
#select_list_answers ul {
  width: 80%;
}
.camp-new-match-head #getTimer {
  margin-bottom: 0;
  font-weight: 500;
  font-size: 25px;
  min-width: 105px;
  width: 105px;
  -ms-flex-item-align: start !important;
  align-self: flex-start !important;
}
.camp-new-match-quest {
  padding: 0;
}
.camp-new-match-quest h4 {
  margin: 0;
  padding: 0 !important;
  line-height: 31px;
}
#predict-winn  .camp-new-match-head h4{
  font-size: 25px;
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 600;
  padding: 0;
  -ms-flex-item-align: center !important;
  align-self: center !important;
}
.match-predict-head .heading-sec{
  padding: 20px 30px;
}
/* Match The Following Ends */

.terms-condition-group .custom-checkbox {
  min-height: 41px;
  background: transparent;
  border: none;
}
.custom-control-label {
  margin-top: 2px;
  cursor: pointer;
}
.terms-condition-group  #txtTermsCondition-error {
  display: none !important; 
}
.terms-condition-group .custom-checkbox.has-error {
  border-color: red;
}
.terms-condition-group .custom-checkbox.has-error .custom-control-label {
  color: red;
}
.modal-backdrop.in {
  background: rgba(0,0,0,.6);
}
.terms-condi-text h4 {
  font-size: 16px;
  color: #f00;
  margin-top: 25px;
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 600;
  cursor: pointer;
}
#terms-condt-modal .modal-body ol {
  padding: 0 25px;
}
#terms-condt-modal .modal-body ol li {
  margin-bottom: 15px;
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 500;
  font-size: 18px;
}
#terms-condt-modal .modal-title{
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 600;
}
#terms-condt-modal .modal-header {
  padding: 10px 25px;
}
.form-control.has-error {
  border-color: red;
}
/* #txtName-error, #txtMobile-error, #txtEmail-error {
  opacity: 0;
} */
.container.camp-new-match-quest{
  text-align: center;
}
.camp-new-match-outer {
  width: 100%;
  display: inline-block;
}
#terms-condt-modal .modal-header {
  padding: 10px 25px;
  background: #dbc404;
  color: #000;
  border-radius: 0;
}
.modal-header .close {
  color: #fff;
  opacity: 1;
  font-size: 33px;
  margin: 0;
  padding: 0;
  line-height: 27px;
}

#terms-condt-modal .modal-header {
  padding: 10px 25px;
  background: #dbc404;
  color: #000;
  border-radius: 0;
  position: relative;
}

/* Modal How to Play Starts */
#over-lay-modal{
  content: "";
  position: fixed;
  background: rgba(0,0,0,.6);
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 9;
}
#how-to-play .modal-body img {
  width: 100%;
}
.how-to-play-mob{
  display: none;
}
#how-to-play .close-icon {
  border-radius: 50%;
  width: 40px;
  height: 40px;
  background: #fff;
  border: none;
}
#how-to-play .close-icon  svg{
  width: 30px;
  height: 30px;
  background: #fff;
  border: #fff;
  border-radius: 50%;
}
#how-to-play .modal-header {
  padding: 10px 25px;
  background: #3f8fd7;
}
#how-to-play .modal-body{
  padding: 0;
}
#how-to-play .modal-footer {
  padding: 10px 25px;
  border-top: none;
 
}
#how-to-play  .modal-lg {
  max-width: 70%;
  margin-left: auto;
  margin-right: auto;
}
/* Modal How to play ends */


/* Thank You Starts */
.thank-banner-bg {
  min-height: 200px;
  margin-top: 20px;
  margin-bottom: 20px;
  border-radius: 10px;
  height: auto;
  display: -ms-flexbox !important;
  display: flex !important;
  -ms-flex-pack: center !important;
  justify-content: center !important;
  padding: 30px;
}
 
.thank-banner-bg h3 {
  color: #fff;
  font-size: 55px;
  margin-bottom: 0;
  font-weight: 600;
  text-shadow: rgb(43, 43, 43) 1px 0px 10px;
  -ms-flex-item-align: center !important;
  align-self: center !important;
}
.score-text-left{
  background: rgba(255, 255, 255, 0.15);
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.20);
  backdrop-filter: blur(0px);
  -webkit-backdrop-filter: blur(0px);
  padding: 40px 20px;
  border-radius: 10px;
  height: 100%;
}
.score-text {
  font-size: 30px;
  color: green;
  font-weight: 600;
  margin-bottom: 20px;
}
.score-text-left p{
  font-size: 18px;
  color: #000;
  margin-bottom: 0;
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
 
}
.terms-conditions-right{
  background: rgba(255, 255, 255, 0.15);
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.20);
  backdrop-filter: blur(0px);
  -webkit-backdrop-filter: blur(0px);
  padding: 40px 20px;
  border-radius: 10px;
  height: 100%;
}
.terms-conditions-right ol li {
  font-size: 18px;
  color: #000;
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
  margin-bottom: 10px;
}
.terms-conditions-right ol {
  padding-left: 15px;
}
.terms-conditions-right h4 {
  font-weight: 600;
  font-size: 20px;
}
 
.score-left-sec.full-width {
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
}
.thank-you-banner {
  margin-bottom: 100px;
}
/* Thank You Ends */

/* Already Participate Starts */
.already-participated-sec{
  padding-top: 40px;
  padding-bottom: 40px;
  width: 100%;
}
.already-participated-sec,
.already-participated-sec .row{
   /* min-height: 600px;
   height: 80vh; */
}
.already-particip-col {
   padding: 0px 20px;
   border-radius: 10px;
   -ms-flex-item-align: center !important;
   align-self: center !important;
   padding: 30px 10px;
   background-image: linear-gradient(to right top, #28458b, #28468d, #28488f, #284990, #284b92, #284c93, #294d94, #294e95, #2a4f96, #2a4f97, #2b5099, #2b519a);
   width: 100%;
}
.already-particip-col .already-banner-bg h3{
   color: #fffbcc;
   font-size: 60px;
   font-family: 'Anton';
   font-style: normal;
   font-weight: 400;
   margin-bottom: 0;
} 
.already-particip-col .already-banner-bg h4{
  font-family: 'Anton';
  font-style: normal;
  font-weight: 400;
  font-size: 40px;
  color: #fffbcc;
}
.already-icon {
 
  margin: 0 auto 10px auto;
  border-radius: 50%;
  position: relative;
}
.already-icon i {
  color: #fff;
  font-size: 25px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
}
.already-banner-bg h6 {
  font-size: 22px;
  font-family: "Poppins";
  font-style: normal;
  font-weight: 400 !important;
  margin-top: 20px;
  color: #fff;
  line-height: 30px;

}
/* Already Participate Ends */

.carousel-caption{
  color: inherit !important;
}
.campaign-new-banner .carousel-caption h4{
  color: var(--buttonColor);
}
.custom-checkbox {
  position: relative;
  padding: 0;
}
.custom-checkbox .custom-control-label {
  padding-left: 30px;
}
.custom-checkbox .custom-control-label:before {
  left: 0;
}
.custom-control-label:after {
  left: 0;
}

.custom-control-label a{
 border-bottom: 1px solid #000;
}
.custom-control-label a:hover{
  border-color: #8f2e7f !important;
}
.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-text #select_list_questions {
  width: 50%;
}
.full-w-match-pr .match-text #select_list_answers {
  width: 50%;
}

.full-w-match-pr #select_list_answers ul li,
.full-w-match-pr #match-questions ul li {
  min-height: 80px;
}

.quiz-start-screen .already-participated-sec, .quiz-start-screen .already-participated-sec .row{
  height: auto !important; 
  min-height: inherit;
}
 
.quiz-start-screen .already-particip-col {
  box-shadow: none;
}
 
#predict-winn .camp-new-match-head h4{
  color: #fff;
}

.congrats-thanks span {
  display: block;
}

#terms-condt-modal ol li ul {
  margin-left: 30px;
}
  #terms-condt-modal .modal-body  ol li ul li {
    margin-bottom: 4px;
}
.modal-open {
  padding-right: 0 !important;
  overflow: hidden !important;
}

.google-btn {
  display: -ms-flexbox !important;
  display: flex !important;
  width: 100%;
  background: #4285f4;
  border: 1px solid #4285f4;
  padding: 0 !important;
  border-radius: 7px;
}

.google-btn:hover {
  text-decoration: none;
}
.google-btn .icon-outer {
  background: #fff;
  padding: 11px;
  display: inline-block;
  border-radius: 7px 0 0 7px;
}

.google_login {
  border: 1px solid #dadce0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: relative;
  margin: 0 auto;
}

.google-btn svg {
  width: 25px;
}
.btn-text {
  -ms-flex-positive: 1 !important;
  flex-grow: 1 !important;
  -ms-flex-item-align: center !important;
  align-self: center !important;
  text-align: center;
  color: #fff;
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
  font-size: 17px;
  line-height: 35px;
  margin-bottom: 0;
  color: #fff;
}
.google-btn {
  font-family: "Spartan";
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
}
.google_login_bar{
  position: relative;
  text-align: center;
}
.google_login_bar::before {
  background: #d1d1d1;
  content: "";
  position: absolute;
  left: 0;
  height: 1px;
  width: 46%;
  top: 50%;
  transform: translateY(-50%);
}
.google_login_bar:after {
  background: #d1d1d1;
  content: "";
  position: absolute;
  right: 0;
  height: 1px;
  width: 46%;
  top: 50%;
  transform: translateY(-50%);
}
.google_login_bar span{
 
}

.question{
  padding-right: 25px;
}
 .answers a .opt-label {
  background: #ffeded;
  color: #000;
  padding: 0;
  border-radius: 9px 0 0 9px;
  font-size: 14px;
  position: absolute;
  left: 0;
  top: 0;
  font-weight: 500;
  height: 100%;
  width: 38px;
}
.opt-label .label-text{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  font-size: 14px;
  font-weight: 600;
}
.answers a {
  padding-left: 55px !important;
  position: relative;
}
.correct-option {
  display: inline-block;
  width: 100%;
}

.quiz-response p {
  font-weight: 500;
  margin-top: 20px;
  margin-bottom: 0;
}

.full-w-match-pr #select_list_answers ul li, .full-w-match-pr #match-questions ul li{
  min-height: 120px;
  padding: 5px;
}
#match-questions ul li img{
  max-height: 120px;
}



.rotate-text span {
  background-color: #f7f7f7;
  -moz-box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.2), inset 2px 4px 0 0 rgba(255, 255, 255, 0.08);
  -webkit-box-shadow: 0 3px 4px 0 rgb(0 0 0 / 20%), inset 2px 4px 0 0 rgb(255 255 255 / 8%);
  box-shadow: 0 3px 4px 0 rgb(0 0 0 / 20%), inset 2px 4px 0 0 rgb(255 255 255 / 8%);
  display: inline-block;
  padding: 4px 20px;
  font-size: 24px;
  color: #fb1230;
  border-radius: 7px;
  font-weight: 600;
}
 
.rotate-text {
  display: inline-block;
  width: 100%;
  margin-bottom: 25px;
}
#mypreview .modal-footer {
  padding-top: 0;
}

/* Smrithi Starts */
.contest-grid-template{

  box-shadow: 
  rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 
  0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 
  0px 12px 13px, rgba(0, 0, 0, 0.09)
   0px -3px 5px;
}
.contest-list .contest-grid-template .card{
      display: inline-block;
      min-height: 300px!important;
}


/*  Word Match Starts */
.word-search-main{
  min-height: 80vh;
}
.word-search-time{
  margin-top: 30px;
}
.word-match-outer {
  -ms-flex-align: center !important;
  align-items: center !important;
}
.word-search-heading h3{
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 600;
  font-size: 30px;
  line-height: 35px;
  margin-bottom: 0;
  color: #000;
}
.word-search-heading h6{
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  line-height: 35px;
}
.word-match-outer h4{
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 25px;
}
.clues p{
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
  font-size: 20px;
  line-height: 25px;
}
/*  Word Match Ends */
/* swal Custom Starts */
div:where(.swal2-container).swal2-center > .swal2-popup{
  border-radius: 10px;
}
div:where(.swal2-container).swal2-backdrop-show, 
div:where(.swal2-container).swal2-noanimation {
  background: rgba(0,0,0,.2) !important;
}  
.swal2-html-container {
  padding: 0 !important;
  margin: 0 !important;
}
.swal-success-content .icon-outer{
  padding: 0;
  background: url("https://www.tadaang.in/static/img/modal-bg.jpg") no-repeat;
  background-size: cover;
  background-position: bottom;
  height: 100px;
  position: relative;
  border-radius: 10px 10px 0 0 ;
}
.swal-success-content .icon{
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: #fff;
  margin: 0 auto;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -40px;
  box-shadow: 0px 6px 10px 0px rgba(0,0,0,0.1);
}
.swal-success-content .icon img{

  height: 80%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);

}
.swal-success-content .swal-header {
  padding: 45px 15px 15px 15px;
  margin-top: 25px;
}
.swal-success-content .swal-header .modal-title {
  font-size: 35px;
  line-height: 40px;
  font-weight: 600;
  color: #000;
}
.swal-success-content .swal-body {
  padding: 15px;
  text-align: center;
}
.swal-success-content .swal-body p{
  font-size: 20px;
  line-height: 25px;
  font-weight: 600;
  color: #000;
}
.swal-success-content .swal-body h4{
  text-align: center;
  font-size: 20px;
  margin-top: 10px;
  font-weight: 600;
  margin-bottom: 0;
  color: #000;
}
.swal2-actions {
margin: 15px 0 5px 0;
}
.swal2-popup.swal2-modal.swal2-icon-error {
color: #000 !important;
}
.swal2-icon.swal2-error.swal2-icon-show {
font-size: 8px;
}


.game-summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 80%;
  margin: 20px auto 0 auto;
}
.game-summary .summary-item {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.game-summary .label {
  font-size: 17px;
  color: #000;
  margin-bottom: 4px;
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 600;
}
.game-summary .value {
  font-size: 18px;
  font-weight: bold;
  color: #000;
}

/* swal Custom Ends */


/* Video Quiz Starts */
.video-quiz-question {
  width: auto;
  height: 250px !important;
  text-align: center;
  border-radius: 15px;
  padding: 0;
  margin: 25px auto;
}
.video-quiz-question video, 
.video-quiz-question iframe {
  width: 45%;
  height: 100%;
  object-fit: contain;
}
.quiz-video {
  text-align: center;
}
.quiz-video .video {
  height: 450px;
  width: 80%;
}
/*  Video Quiz Ends */

/* Mystery Word Starts */
.mysteryword-outer{
  padding-bottom: 60px;
}
.mysteryword-outer .desk-timer{
  display: -ms-flexbox !important;
  display: flex !important;
  -ms-flex-direction: column !important;
  flex-direction: column !important;
  height: 100%;
}
.mysteryword-outer .try-form-outer{
  margin-top: 40px;
}
.mysteryword-heading{
  margin-top: 60px;
  margin-bottom: 60px;
}
.mysteryword-heading h3{
  font-size: 25px;
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 600;
}
 
 
.mysteryword-timer{
  display: inline-block;
  text-align: right;
  width: 100%;
}
.mysteryword-timer #timer{
  position: relative;
  right: inherit;
  top: inherit;
  float: left;
}
.mysteryword-timer #getTimer{
  margin-top: 0;
  margin-bottom: 0;
}
.mysteryword-right .rotate-text{
  text-align: left;
  margin-top: 60px;
}


#formMystery {
  padding: 0 15px;
  display: flex;
  -ms-flex-pack: center !important;
  justify-content: center !important;
}
#formMystery .form-group {
  margin-bottom: 0;
}
#formMystery .form-control{
  border-radius: 7px 0 0 7px;
  height: 39px;
  box-shadow: none;
  border: 1px solid #ccc;
  padding: 5px 10px;
  margin-right: 15px;
  font-size: 15px;
}
#formMystery .form-control:focus{
  outline: none;
  border: 1px solid #666;
}
#formMystery .btn-primary{
  padding: 8px 15px;
  cursor: pointer;
  border: none;
  font-size: 15px;
  font-weight: 600;
  background: #f91431;
  color: #fff;
  border-radius: 0 7px 7px 0;
}
#formMystery .btn-primary:focus{
  outline: none;
  box-shadow: none;
}
.start-btn-outer {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  z-index: 99;
}
.start-btn-outer #startBtn{
  border: none;
  font-size: 15px;
  font-weight: 600;
  background: #f91431;
  color: #fff;
  padding: 10px 20px;
  cursor: pointer;
}
/* Mystery Word Ends */

/* Decathalon Download Link */
.download-app {
  margin-top: 25px;
  border-top: 1px solid #ccc;
  padding-top: 20px;
}
.download-app p {
  font-size: 18px;
  font-family: 'Titillium Web' !important;
  font-style: normal;
  font-weight: 500;
}
.download-btn {
  border-radius: 8px;
  overflow: hidden;
  height: 65px;
  display: inline-block;
}
.download-btn img {
  height: 65px;
}

/* Client Contest List Starts */
.client-contest-list{
  padding-bottom: 20px;
}
.client-contest-heading{
  text-align: center;
  margin-top: 30px;
  margin-bottom: 30px;
}
.client-contest-heading h3{
  font-family: 'Krona One';
  font-style: normal;
  font-weight: 400;
  font-size: 24px;
  color: #000;
  margin-bottom: 0;
}
.client-sin-con {
  margin-bottom: 40px;
  background: #fff;
  box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.2);
}
.client-sin-con-img {
  overflow: hidden;
  height: 250px;
}
.client-sin-con-img img {
  height: auto;
  object-fit: cover;
  width: 100%;
  transform: scale(1);
 transition: transform .6s;
 height: 100%;
}
.client-sin-con-img:hover img {
  transform: scale(1.1);
}

 
.play-btn-outer-sec {
  background: #fff;
  text-align: center;
  padding: 23px 0;
  display: inline-block;
  width: 100%;
  margin-top: 15px;
}
.play-btn-outer-sec .red-btn {
  font-family: "Spartan";
  font-style: normal;
  font-weight: 700;
  font-size: 14px;
  background: none;
  color: #ff001e;
  position: relative;
  padding: 13px 28px 11px 28px;
  color: #ff001e;
  -webkit-transition: all 0.9s;
  -moz-transition: all 0.9s;
  -o-transition: all 0.9s;
  transition: all 0.9s;
  border-radius: 0;
}

.play-btn-outer-sec .btn {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  background: var(--buttonBgColor);
  color: var(--buttonColor);
  border-radius: 0;
  padding: 5px 30px;
  font-size: 18px;
  font-weight: 600;
  margin-top: 0;
}
.play-btn-outer-sec .btn:focus{
  box-shadow: none;
  border: none;
}
.play-btn-outer-sec .btn:hover {
  opacity: .8;
}

.play-btn-outer-sec .red-btn:before {
  content: "";
  position: absolute;
  background: transparent;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  border: 3px solid #ff001e;
}
.play-btn-outer-sec .red-btn:after {
  background: #ff001e;
  content: '';
  position: absolute;
  z-index: 0;
  -webkit-transition: all 0.6s;
  -moz-transition: all 0.6s;
  -o-transition: all 0.6s;
  transition: all 0.6s;
  height: 100%;
  left: 0;
  top: 0;
  width: 0;
}
.client-play-now {
  z-index: 9;
  position: inherit;
  color: #ff001e;
  -webkit-transition: all 0.9s;
  -moz-transition: all 0.9s;
  -o-transition: all 0.9s;
  transition: all 0.9s;
  font-family: "Spartan";
  font-style: normal;
  font-weight: 600;
  font-size: 14px;
}
.play-btn-outer-sec .red-btn:hover {
  color: #fff;
  text-decoration: none;
}
.play-btn-outer-sec .red-btn:before {
  content: "";
  position: absolute;
  background: transparent;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  border: 3px solid #ff001e;
}
.play-btn-outer-sec .red-btn:hover:after {
  width: 100%;
}
.play-btn-outer-sec .red-btn:hover .client-play-now {
  color: #fff;
}
/* Client Contest List Ends */

/* list contset banner Starts  */
 
.all-contest-banner .banner-image-outer img{
  max-height: 500px !important;
}
/* list contset banner Ends  */

/* Mysterious Word  Start */

.circle-outer {
  max-width: 800px;
  height: 500px;
  position: relative;
  margin: 0 auto;
  background: #f1f1f1;
  border-radius: 10px; 
  box-shadow: inset 9px 9px 17px #dedede,
              inset -9px -9px 17px #ffffff;
}
.circle {
  position: absolute;
  
  border-radius: 50%;
  text-align: center;
  width: 150px;
  height: 150px;
  line-height: 150px;
  cursor: pointer;
  transform: scale(0);
  opacity: 0
}

.circle .letter {
  color: #fff;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  font-weight: 600;
  font-size: 22px
}
.animation-start .circle {
  animation: scaleAnimation 5s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}

@keyframes scaleAnimation {
  0% {
    transform: scale(0);
    opacity: 0;
  }
  50% {
    transform: scale(1.2); /* Slightly bigger for bubble effect */
    opacity: 1;
  }
  100% {
    transform: scale(0); /* Settle to original size */
    opacity: 0;
  }
}

.animation-start .circle {
  opacity: 1
}
 .start-btn-outer {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  z-index: 99
}
.start-btn-outer #startBtn {
  border: none;
  font-size: 15px;
  font-weight: 600;
  background: #f91431;
  color: #fff;
  padding: 10px 20px;
  cursor: pointer
}
.circle-outer .preview-btn{
  background: #ff001e;
  color: #fff !important;
  border: none !important;
  font-size: 18px !important;
  border: none !important;
  padding: 7px 25px !important;
  font-family: 'Titillium Web' !important;
  font-style: normal;
}
.circle-outer .preview-btn.disable {
  opacity: .8;
  cursor: not-allowed;
} 
.circle-outer .btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}
.btn-hide{
  visibility: hidden;
}
.rotate-text h4 {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 600;
  font-size: 24px;
}
.rotate-text p{
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 20px;
}
/* Mysterious Word  Ends */



/* Quiz Starts */
ul.answers {
  display: flex; /* Use flexbox for horizontal alignment */
  flex-wrap: wrap; /* Allow wrapping of items */
}
ul.answers li a {
  display: flex; /* Use flexbox for height alignment */
  align-items: center; /* Center items vertically */
  justify-content: flex-start; /* Align items to the left */
  height: 100%; /* Ensure <a> takes the full height of the <li> */
}


/* Memory Game Starts 14 Oct 2024 Starts */
/*
 * Styles for the deck of cards
 */
 .matchgame {
  margin: 40px auto;
}
.matchgame .score-panel {
   font-size: 17px;
   font-family: "WorkSans";
   font-style: normal;
   font-weight: 500;
   margin-bottom: 0;
}
.matchgame .card{
           font-family: "WorkSans";
   font-style: normal;
   font-weight: 400;
   font-size: 16px;
}
.deck {
   align-items: center;
   /*background: url('../img/banner.jpg') bottom;*/
   border-radius: 10px;
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
   margin: 0 auto;
   min-height: 570px;
   padding: 0 32px;
   width: 635px;
}

.deck .card {
   align-items: center;
   background: #2e3d49;
   border-radius: 8px;
   /* box-shadow: 5px 2px 20px 0 rgba(46, 61, 73, 0.5); */
   box-shadow: 5px 0px 9px 0px rgba(0,0,0,0.5);
   color: #ffffff;
   cursor: pointer;
   display: flex;
   font-size: 0;
   justify-content: center;
   height: 125px;
   width: 125px;
   text-align: center;

}

.deck .card.open {
   background: #02b3e4;
   cursor: default;
   transform: rotateY(0);
}

.deck .card.show {
   font-size: 16px;
   font-weight: 400;
}
.deck .card.match {
   cursor: default;
   background: #02ccba;
   font-size: 16px;
   font-weight: 400;
}


/*
* Styles for the Score Panel
*/

.score-panel {
   display: flex;
   flex-wrap: nowrap;
   margin: 0 auto;
   padding-top: 10px;
   padding-bottom: 10px;
   text-align: center;
    width: 660px;
        -ms-flex-pack: center!important;
   justify-content: center!important;
}

.score-panel .stars {
   display: inline-block;
   margin: 0;
   margin: 0 5px 0 0;
   padding: 0;
   width: 15%;
}

.score-panel .stars li {
   display: inline-block;
   list-style: none;
}

.score-panel .timeElapsed {
   display: inline-block;
   width: 25%;
}

.score-panel .moves {
   display: inline-block;
   width: 25%;
}

.score-panel .matched {
   display: inline-block;
   width: 25%;
}

.score-panel .restart {
   cursor: pointer;
   float: right;
   text-align: right;
   text-align: center;
}


/*
* Styles for the Previous Score
*/

.previous-score__container {
   display: none;
}

.previous-score__container h2 {
   text-align: center;
}

.previous-score__table {
   margin: auto;
   width: 660px;
}

.previous-score__table th {
   background-color: #4568dc;
   color: #fff;
   font-weight: 200;
}

.previous-score__table tr,
.previous-score__table td {
   background-color: white;
}

.previous-score__table tr,
.previous-score__table th,
.previous-score__table td {
   border: 1px solid silver;
   border-radius: 5px;
   padding: 10px;
   text-align: center;
}


/*
* Styles for Footer
*/

.footer__container {
   background-color: #2f3d48;
   color: #fff;
   height: 180px;
   margin-top: 20px;
   padding-top: 5px;
   text-align: center;
   width: 100%;
}

.footer__social-media {
   list-style: none;
}

.footer__social-media li {
   display: inline-block;
}


/*
* Styles for Contacts Links
*/

.contacts-link {
   background-color: #27afc4;
   border: 1px double #fff;
   border-radius: 50%;
   font-size: 18px;
   line-height: 1.5em;
   margin-left: 15px;
   margin-right: 15px;
   padding: 0.5em;
   position: relative;
   text-decoration: none;
   width: 45px;
}

.contacts-link a {
   color: #fff;
   margin: -14px;
   padding: 14px;
}

.contacts-link:hover {
   background-color: #1e8495;
   cursor: pointer;
}

.contacts-link a:visited {
   color: #fff;
}


/*
* Styles for Animations
*/

@keyframes shake {
   0% {
       transform: translate(1px, 1px) rotate(0deg);
   }
   10% {
       transform: translate(-1px, -2px) rotate(-1deg);
   }
   20% {
       transform: translate(-3px, 0px) rotate(1deg);
   }
   30% {
       transform: translate(3px, 2px) rotate(0deg);
   }
   40% {
       transform: translate(1px, -1px) rotate(1deg);
   }
   50% {
       transform: translate(-1px, 2px) rotate(-1deg);
   }
   60% {
       transform: translate(-3px, 1px) rotate(0deg);
   }
   70% {
       transform: translate(3px, 1px) rotate(-1deg);
   }
   80% {
       transform: translate(-1px, -1px) rotate(1deg);
   }
   90% {
       transform: translate(1px, 2px) rotate(0deg);
   }
   100% {
       transform: translate(1px, -2px) rotate(-1deg);
   }
}

.shake-to-shuffle {
   animation: shake 1s;
   /*animation-iteration-count: infinite;*/
}

@keyframes wrong-cards-color {
   0% {
       background-color: #ff3f00;
   }
   25% {
       background-color: #ffbb00;
   }
   100% {
       background-color: #ff3f00;
   }
}

@keyframes matching-cards-color {
   0% {
       background-color: #02ccba;
   }
   25% {
       background-color: #02cc16;
   }
   50% {
       background-color: #88ff00;
   }
   75% {
       background-color: #02cc16;
   }
   100% {
       background-color: #02ccba;
   }
}

.toBeReflipped {
   animation: wrong-cards-color 1.2s;
}

.match {
   animation: matching-cards-color 1.2s;
}
.deck .card img{
   z-index: -1;
   object-fit: contain;
   height: 100%;
}
.deck .card.match img {
   z-index: 1;
 }
#restartButton {
display: none;
}
  
@media only screen and (min-width: 320px) and (max-width: 600px) {
   .deck .card {
        width: 31%;
       margin-bottom: 10px;
   }
   .deck .card.show {
       font-size: 14px;
       font-weight: 500;
   }
   .deck .card.match {
       cursor: default;
       background: #02ccba;
       font-size: 14px;
       font-weight: 500;
   }
   .deck {
       min-height: auto;
   }
   .deck .card{
       height: 88px;
       width: 23%;
   }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
   .deck {
       width: 100%;
       padding: 10px;
       min-height: auto;
   }
   .deck .card{
       height: 88px;
       width: 23%;
       margin-bottom: 15px;
   }  
   .score-panel {
       display: inline-block !important;
       width: 100%;
   }
   .score-panel ul.stars {
       width: 50%;
       margin: 0;
       float: left;
   }
   .score-panel .timeElapsed {
       width: 50%;
       float: left;
   }
   .score-panel .moves {
       width: 50%;
       float: left;
       margin-top: 10px;
   }
   .score-panel .matched {
       width: 50%;
       float: left;
       margin-top: 10px;
   }
}

/* Memory Game Starts 14 Oct 2024 Ends */

/* Image Quiz Option on Right Starts */
.img-question-container .question {
  width: 50%;
  float: left;
  margin-bottom: 0;
}
.img-question-container .question img {
  width: auto;
  max-height: 250px;
}
.img-question-container .answers {
  width: 50%;
  float: left;
  margin-top: 0;
}
.img-question-container .answers li {
  width: 100%;
}
.img-question-container .answers li:last-child{
  margin-bottom: 0;
}
.img-question-container .question span {
  font-size: 20px;
  line-height: 26px;
}
.img-question-container .answers a{
  padding: 15px 20px;
} 
/* Image Quiz Option on Right Ends */



/* Draggable Order Starts */
#drag-game-single .drag-drop-outer{
  background: #fff;
}
#drag-game-single .drag-drop-head{
  margin-top: 40px;
  margin-bottom: 25px;
}
#drag-game-single .drag-slot-outer{ 
  max-height: 400px;
  overflow: auto;
  padding: 20px 0;
}
#drag-game-single .ui-draggable {
  cursor: move;
  margin: 10px;
  background: #f1f1f1;
  padding: 10px;
  border: 1px solid #ccc;
  position: relative; 
  display: inline-block !important;
}
#drag-game-single .ui-droppable.active {
  background-image: repeating-linear-gradient(2deg, #333333, #333333 8px, transparent 8px, transparent 16px, #333333 16px), repeating-linear-gradient(92deg, #333333, #333333 8px, transparent 8px, transparent 16px, #333333 16px), repeating-linear-gradient(182deg, #333333, #333333 8px, transparent 8px, transparent 16px, #333333 16px), repeating-linear-gradient(272deg, #333333, #333333 8px, transparent 8px, transparent 16px, #333333 16px);
  background-size: 2px calc(100% + 16.01px), calc(100% + 16.01px) 2px, 2px calc(100% + 16.01px) , calc(100% + 16.01px) 2px;
  background-position: 0 0, 0 0, 100% 0, 0 100%;
  background-repeat: no-repeat;
  animation: borderAnimation 0.7s infinite linear;
  border: none !important;
}
  

@keyframes borderAnimation {
  from { background-position: 0 0, -16.01px 0, 100% -16.01px, 0 100%; }
  to { background-position: 0 -16.01px, 0 0, 100% 0, -16.01px 100%; }
}

#drag-game-single .ui-droppable.inactive {
  background-color: rgba(255, 0, 0, 0.5); /* Semi-transparent red to indicate it's inactive */
} 
#drag-game-single .ui-droppable {
  border: 2px dashed #ccc;
  min-height: 50px;
  margin: 10px;
  position: relative;
}
#drag-game-single .success-drop {
  background-color: lightgreen !important;
}
#drag-game-single .failed-drop {
  background-color: lightcoral !important;
}
#drag-game-single .ui-droppable .ui-draggable {
  display: block !important;
  margin: 0;
}

#drag-game-single .ui-droppable.active:after{
  content: "Drop Here";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  color: #666;
  font-size: 14px;
  line-height: 14px;
}

#drag-game-single .ui-droppable:last-child{
  margin-bottom: 50px;
}

#drag-game-single .ui-draggable img {
  height: 50px;
}
/* Draggable Order Ends */


#download-red-btn {
  text-align: center;
  margin-top: 25px;
}
#download-red-btn .download-red-btn {
  border: none;
  background: #ff0000;
  color: #fff;
  padding: 6px 20px;
  border-radius: 5px;
  cursor :pointer;
}
#download-red-btn .download-red-btn i{
  margin-left: 10px;
}

.drop-zone .draggable {
  position: relative!important;
  z-index: 10!important; /* Ensures that the draggable content is above the background */
}

.drop-zone {
  position: relative!important;
  z-index: 1!important; /* Background remains behind the draggable elements */
}



/* Quiz Contest Starts  */
/* .campaign-footer {
  display: block; 
}
#countdown #tiles {
  border-radius: 5px;
}
.quiz-counter {
  margin-bottom: 10px;
}
.quiz-controls {
  display: inline-block;
  width: 100%;
}
.quiz-controls .quiz-response{
  margin-top: 15px;
}
.correct-option {
  font-weight: 600 !important;
}
#countdown #tiles{
  padding: 3px 15px;
} */
/* Quiz Contest Ends  */

#countdown #tiles{
  border-radius: 5px !important;
}
.header-sec-outer .navbar-brand.sponsor-images {
  text-align: right;
}

/* Congrats Starts */
.congrat-icon {
  position: relative;
  border: 2px dashed #ff001e;
  width: 140px;
  height: 140px;
  border-radius: 50%;
  margin: 0 auto 25px auto;
  margin-top: 25px;
}
.congrat-icon .trophy-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}
.fa.fa-trophy {
  color: #ff001e;
  font-size: 65px;
}
.center-star.fa.fa-star {
  position: absolute;
  font-size: 18px;
  color: #fff;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  margin-top: -10px;
}

.congrat-head h3 {
  font-size: 35px;
  font-weight: 600;
  color: #e70c31;
  margin-bottom: 15px;
}
.congrat-icon {
  display: inline-block; /* Allow for rotation */
  perspective: 1000px; /* Create a 3D space */
  animation: rotateCoin 4s linear forwards; /* Animation settings */
}
.congrat-icon .trophy-icon {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-image: radial-gradient(circle, #f1f1f1, #fbe3bd, #fff3e7, #ffeaff, #fff);
}

@keyframes rotateCoin {
    0% {
        transform: rotateY(0deg); /* Start position */
        animation-timing-function: linear; /* Constant speed */
    }
    80% {
        transform: rotateY(720deg); /* Midway rotation */
        animation-timing-function: cubic-bezier(0.5, 0, 1, 1); /* Slow down */
    }
    100% {
        transform: rotateY(720deg); /* End position */
    }
}
.swal-success-content .congrat-icon {
  margin-top: 25px;
}
.congrats-thanks p {
  color: #000;
}
.matchdrag-cong h4 {
  font-weight: 600;
  color: #000;
  margin-bottom: 0;
}
.swal-success-content.matchdrag-cong {
  overflow: hidden;
}
.swal-success-content.matchdrag-cong .congrat-icon .trophy-icon{
  color: #ff001e !important;
}
.swal-success-content.matchdrag-cong  .center-star.fa.fa-star{
  color: #fff !important;
}
.swal-success-content.matchdrag-cong  .congrats-thanks h4 {
  font-weight: 600;
  color: #000;
}
.congrats-thanks .fa.fa-bullhorn {
  margin-right: 10px;
  color: #e70c31;
}
/* Congrats Ends */

/*Quiz Times Up*/

.times-up-outer {
  margin: 0 auto;
  text-align: center;
  display: inline-block;
  width: 100%;
  padding-top: 50px;
}
.times-up-outer .times-up-inner{
  background: rgba( 255, 255, 255, 1 );
  box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.20 );
  backdrop-filter: blur( 0px );
  -webkit-backdrop-filter: blur( 0px );
  padding: 40px;
  text-align: center;
  max-width: 500px;
  border-radius: 20px;
  display: inline-block;
}
.times-up-outer #timeupstext {
  padding-top: 0;
  font-weight: 400;
}
.times-up-outer .stopwatch-icon .fa-stopwatch {
  font-size: 45px;
  color: #1f2937;
}
.times-up-outer .trophy-icon .fa-trophy {
  font-size: 65px;
}
.times-up-outer .times-up-outer h5 {
  color: #1f2937;
}
.times-up-outer .trophy-icon i {
  animation: colorChange 5s linear infinite; /* 5s duration for smooth animation */
}
.times-up-outer #timeupsHead {
  text-align: center;
  font-size: 35px;
  font-weight: 600;
  color: #e70c31;
  margin-top: 20px;
}

@keyframes colorChange {
  0% {
      color: #dcc610; /* Starting color */
  }
  50% {
      color: #dac40d; /* Midpoint color */
  }
  100% {
      color: #dcc610; /* Back to starting color */
  }
}
.times-up-outer.match-drag-times-up {
  margin-top: 40px;
}


/* Jigsaw Starts */
.jigsaw-section-outer .jigsaw-puzzle #myCanvas {
  top: inherit !important;
}
.jigsaw-section-outer {
  padding-bottom: 0;
}
.jigsaw-section-outer .puzzle-left {
  padding: 15px 0 15px 0;
}
.jigsaw-section-outer .jigsaw-puzzle #myCanvas{
  margin-top: 0;
}
.jigsaw-section-outer .puzzle-right {
  padding-left: 30px;
}
.jigsaw-section-outer #getTimer {
  background-color: #fb1230;
  color: #fff;
  padding: 0 15px;
}
.jigsaw-section-outer .puzzle-right{
  padding-top: 15px;
}
.jigsaw-preview img {
  width: 300px;
}
.nicescroll-box {
  overflow-x: hidden;
}
.nicescroll-rails-vr {
  background: #f1f1f1;

}
.nicescroll-rails-vr .nicescroll-cursors {
  margin: 5px 0;
  width: auto !important;
  min-width: 10px !important;
}
.jigsaw-section-outer .puzzle-right #startGame {
  margin: 0;
}
/* Jigsaw Ends */

/* Spin The Wheel Starts */
.wheel-container-outer {
  padding-top: 50px;
  padding-bottom: 50px;
}

/* Spin The Wheel Ends */

/* Common heading Starts */
.clientsec-heading{
  margin-top: 30px;
  margin-bottom: 30px;
}
.clientsec-heading h3{
  font-size: 25px;
  font-family: "Titillium Web";
  font-style: normal;
  font-weight: 600;
  margin-bottom: 0;
}
.contestsec-title{
  color: #fff !important;
}
.quiz-questions-state #timer {
  top: 21px;
}
.quiz-questions-state .quiz-counter {
  margin-top: 10px;
  margin-bottom:20px;
}
.drag-drop-head .full-w-match-top {
  margin-top: 30px;
  margin-bottom: 30px;
}
/* Common heading Ends */




.spin-start-screen.match-drag-alre .already-particip-col {
  padding: 40px;
}
.highlight-green{
  background:#008000 !important;
}
.highlight-red{
  background: #ff0000 !important;
}
.match-drag-alre .already-participated-sec, .match-drag-alre .already-participated-sec .row {
  min-height: auto !important;
  height: auto !important;
}
.spin-start-screen.match-drag-alre .already-participated-sec {
  padding-top: 60px;
}


/* The Contest is Expired */

.contest-expired-outer{
  margin: 30px auto 0 auto;
  text-align: center;
  display: inline-block;
  width: 100%;
}
.contest-expired-inner {
    padding: 40px;
    text-align: center;
    min-width : 600px;
    border-radius: 20px;
    display: inline-block;
    text-align: center;
    border-radius: 20px;
    display: inline-block;
}
.hourglass-icon i{
  transform: rotate(180deg);
    font-size: 45px;
  color: #1f2937;
}
.contest-expired-inner #timeupsHead {
    text-align: center;
    font-size: 35px;
    font-weight: 600;
    color: #e70c31;
    margin-top: 20px;
}
.contest-expired-inner #timeupstext {
  padding-top: 0;
  font-weight: 400;
}
.spin-modal .modal-content {
  text-align: center;
  display: inline-block;
}
.spin-modal  .congrats-thanks {
  margin-bottom: 30px;
}


/* results winners  Starts  */

.no-results-winners {
  background: rgba( 255, 255, 255, 0.15 );
  box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.20 );
  backdrop-filter: blur( 0px );
  -webkit-backdrop-filter: blur( 0px );
  padding: 40px;
  text-align: center;
  max-width: 500px;
  border-radius: 20px;
  display: inline-block;
}
.no-results-winners-outer {
  text-align: center;
  margin-bottom: 80px;
}
.no-results-winners .trophy-icon i {
  color: #0003;
}
.no-results-winners .trophy-icon {
  margin-bottom: 25px;
}
.no-results-winners  h4 {
  text-align: center;
  font-size: 30px;
  font-weight: 600;
  color: #e70c31;
  margin-top: 20px;
  color: #000;
}
/* results winners  Ends  */

.camp-new-match-head .contestsec-title {
  font-size: 25px;
  font-family: "Titillium Web";
  font-style: normal;
  font-weight: 600;
  margin-bottom: 0;
}

.predict-start-screen #predict-winn{
  padding-top: 40px;
  padding-bottom: 20px;
}
.predict-start-screen .go-back-btn{

}
.predict-start-screen #getTimer {
  margin-bottom: 0;
}
.predict-start-screen #formans {
  margin-top: 20px;
}
.predict-start-screen .countdown-outer {
  display: inline-block;
}
.predict-start-screen .predict-win-box {
  padding: 0;
}
.predict-start-screen #txtans {
  background-image: repeating-linear-gradient(2deg, #666666, #666666 8px, transparent 8px, transparent 16px, #666666 16px), repeating-linear-gradient(92deg, #666666, #666666 8px, transparent 8px, transparent 16px, #666666 16px), repeating-linear-gradient(182deg, #666666, #666666 8px, transparent 8px, transparent 16px, #666666 16px), repeating-linear-gradient(272deg, #666666, #666666 8px, transparent 8px, transparent 16px, #666666 16px);
     background-size: 2px calc(100% + 16.01px), calc(100% + 16.01px) 2px, 2px calc(100% + 16.01px) , calc(100% + 16.01px) 2px;
     background-position: 0 0, 0 0, 100% 0, 0 100%;
     background-repeat: no-repeat;
     animation: borderAnimation 0.7s infinite linear;
     border: none !important;
     font-size: 18px;
 }
 
 @keyframes borderAnimation {
     from { background-position: 0 0, -16.01px 0, 100% -16.01px, 0 100%; }
     to { background-position: 0 -16.01px, 0 0, 100% 0, -16.01px 100%; }
 }

/* Word puzzle game Starts */

.wordmatch-start #puzzle {
	display: grid;
	grid-template-columns: repeat(10, 60px);
	gap: 15px;
	margin-bottom: 20px;
	perspective: 1000px;
	justify-content: center;
}
.wordmatch-start .cell {
	width: 60px;
	height: 60px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: bold;
	font-size: 1.2rem;
	background-color: #fff;
	cursor: pointer;
	user-select: none;
	border-radius: 8px;
  box-shadow: 1px 1px 1px 2px rgba(0, 0, 0, 0.1);
	transition: all 0.3s ease;
 
}
.cell:hover {
	transform: translateZ(10px);
  box-shadow: 1px 1px 1px 2px rgba(0, 0, 0, 0.2);
}
.cell.selected {
	background-color: #ffd700;
	/* transform: translateZ(20px) rotate(5deg); */
}
.cell.found {
	background-color: #7fff7f;
	/* transform: translateZ(15px) rotate(-5deg); */
}
#puzzle  button {
	padding: 12px 24px;
	font-size: 1rem;
	cursor: pointer;
	background-color: #6e8efb;
	color: white;
	border: none;
	border-radius: 30px;
	transition: all 0.3s ease;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	margin-bottom: 1.5rem;
}
#puzzle  button:hover {
	background-color: #5c7cfa;
	transform: translateY(-2px);
	box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15);
}
#words {
	margin-top: 20px;
	/* display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px; */
  display: inline-block;
}
.word {
	padding: 8px 16px;
	border: 2px solid #6e8efb;
	border-radius: 20px;
	transition: all 0.3s ease;
	background-color: white;
}
.word.found {
	background-color: #7fff7f;
	border-color: #4caf50;
	text-decoration: line-through;
	transform: scale(0.95);
}
@keyframes celebrate {
	0%,
	100% {
		transform: translateY(0);
	}
	50% {
		transform: translateY(-20px);
	}
}

/* Word puzzle game Ends */


/* Spin The Wheel Starts */
.wheel-wrapper #wheel-container #wheel .part .name img {
  height: 100px;
  width: 100px;
  object-fit: contain;
}
/* Spin The Wheel Ends */

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

/* Snake And Ladder Starts */
/* Header Starts */
#profileDropdown img {
  height: 45px;
  width: 45px;
  object-fit: contain;
}
#profileDropdown{
  user-select: none;  
  -webkit-user-select: none;  
  -ms-user-select: none;  
  padding: 0;
  cursor: pointer;
}
.profile-drosec{
  -ms-flex-item-align: center !important;
  align-self: center !important;
}
.profile-drosec .dropdown-toggle:after{
  display: none;
}
.profile-drosec .navbar-dropdown li{
  list-style: none;
}
.profile-drosec .navbar-dropdown li a{
  cursor: pointer;
}
.profile-drosec .navbar-dropdown {
  visibility: hidden;
  opacity: 0; 
  transform: translateY(40px);
  transition: 0.3s ease-in-out;
  position: absolute;
  background-color: #fff;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  z-index: 1000;
  padding: 5px 0;
}
.profile-drosec .navbar-dropdown li a:hover{
  background: #e4e4e5;
}
.profile-drosec .navbar-dropdown.open {
  visibility: visible;
  opacity: 1;
  transform: translateY(20px);
}
/* Header Ends */


.snake-ladder-main {
  background: #f1f1f1;
}
.snake-ladder-main .main-container {
  display: inline-block;
  width: 100%;
  float: left;
  position: relative;
}
.snake-ladder-main .main-container ul {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: repeat(6, 1fr);
  gap: 8px;
  margin: 0;
  padding: 0;
  width: 100%;
}
.snake-ladder-main .main-container ul li  {
  display: flex;
  align-items: center;
  justify-content: center;   
  border: 3px solid #ec2029;
  background: #ec2029;
  font-size: 18px;
  font-weight: bold;
  height: 135px;
  position: relative;
}
.snake-ladder-main .main-container ul li:before {
  content: "";
  position: absolute;
  background: url(../images/corn-shape.png);
  background-size: cover;
  background-position: left top;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.snake-ladder-main .main-container ul li:nth-child(2n+1) {
  background-color: #f3f3f3 !important;
  border: 3px solid #ddd;
}
.snake-ladder-main .main-container ul li:nth-child(2n+1):before{
  display: none;
}
.snake-ladder-main .main-container img {
  position: absolute;
}
.snake-ladder-main .main-container ul li img{
  width: 105px;
  height: 105px;
  object-fit: contain !important;
}

#roll-dice {
  width: 60%;
  display: inline-block;
  background: #333;
  border-radius: 10px;
  margin-top: 10px;
  color: #fff;
  cursor: pointer;
}

#snake5 {
  top: 7%;
  left: 45%;
  width: 250px;
  z-index: 99;
}
#snake4{
  top: 26%;
  left: 73%;
  width: 200px;
  z-index: 99;
}
#snake2{
  top: 42%;
  left: 14%;
  width: 167px;
  z-index: 99;
}
#ladder2{
  top: 60%;
  left: 73%;
  width: 80px;
  z-index: 9;
}
 

/* Giftbox Board Leader Board */
.giftbox-board,
.leader-board {

    border: 1px solid #333;
    overflow: hidden;
    border-radius: 10px;
    background: #fff;
}
.giftbox-board{
  height: 250px;
}
.border-head {
    background: #333;
    color: #fff;
    padding: 8px 20px;
    border-radius: 7px 7px 0 0;
}
.gift-box {
  display: -ms-flexbox !important;
  display: flex !important;
  -ms-flex-pack: start !important;
  justify-content: flex-start !important;
  padding: 10px 10px;
}
.giftbox-slider {
  display: inline-block;
  width: 100%;
}
.gift-details {
  display: -ms-flexbox !important;
  display: flex !important;
  -ms-flex-direction: column !important;
  flex-direction: column !important;
  width: 100%;
  text-align: center;
}
.giftdetails img {
    width: 80px !important;
    height: 80px !important;
    object-fit: contain;
    background: #e9e9e9;
    border-radius: 10px;
}
.gift-details {
  display: -ms-flexbox !important;
  display: flex !important;
  -ms-flex-direction: column !important;
  flex-direction: column !important;
  width: 100%;
}
.giftdetails{
  position: relative;
  /* -ms-flex: 1 1 auto !important;
  flex: 1 1 auto !important; */
  margin-right: 30px;
}
.gift-counter {
  position: absolute;
  right: -8px;
  top: -8px;
  background: #bcbcbc;
  border-radius: 50%;
  width: 22px;
  height: 22px;
  z-index: 9;
}
.counter-number{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    color: #000;
    font-size: 12px;
    font-weight: 500;
}
 
.gift-day {
  -ms-flex-item-align: center !important;
  align-self: center !important;
  font-weight: 600;
  width: 120px;
  margin-right: 10px;
  min-height: 150px;
}
.gift-outer {
  display: -ms-flexbox !important;
  display: flex !important;
  margin-bottom: 15px;
}
.gift-outer:last-child{
  margin-bottom: 0;
}
/* Giftbox Board Leader Board Ends */ 




/* Leader Board Starts */
.leader-slider {
	display: inline-block;
	width: 100%;
  }

.leader-board-box {
	display: inline-block;
	/* background: #333; */
	width: 100%;
	color: #333;
	border-bottom: 1px solid #ccc;
}

.leader-board-box{
	display: -ms-flexbox !important;
    display: flex !important;
    -ms-flex-pack: start !important;
    justify-content: flex-start !important;
	-ms-flex-align: center !important;
    align-items: center !important;
    padding: 10px 10px;
    margin-top: 20px;
}
.user-pic-bg {
	width: 25px;
	height: 25px;
	display: inline-block;
	border-radius: 50%;
	position: relative;
	background: #bcbcbc;
}
.user-pic {
	color: #000;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	line-height: 15px;
  	font-size: 12px;
}
.lb-gift-img img {
	width: 50px !important;
	height: 50px !important;
	object-fit: contain;
}
.user-name{
	font-weight: 600;
	-ms-flex-item-align: center !important;
    align-self: center !important;
	margin: 0 10px;
}
/* Leader Board Ends */


/* Dice Starts */
.dice-and-roll {
  max-width: 200px;
  margin-left: auto;
  border-radius: 10px;
  background: transparent;
  margin-top: 30px;
  text-align: right;
  padding: 20px 0;
}
/* Dice Ends */

/* Quiz Starts */
.snake-quiz-main-outer .quiz-main-inn {
  background: #fff;
  border-radius: 15px;
  padding: 30px 15px 30px 15px;
  position: relative;
}
.snake-quiz-main-outer {
  margin-top: 20px;
}
.snake-quiz-main-outer ul.answers {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
}
.snake-quiz-main-outer .answers li {
  width: 100%;
  float: left;
  margin-bottom: 15px;
  padding: 0 25px;
}
.snake-quiz-main-outer .answers a {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  position: relative;
  height: 100%;
  border-radius: 8px;
  padding: 8px 15px;
  padding-left: 20px;
  margin-bottom: 0;
  cursor: pointer;
  font-size: 18px;
  -moz-box-shadow: 0 2px 3px 0 rgba(0,0,0,.10);
  -webkit-box-shadow: 0 2px 3px 0 rgba(0,0,0,.10);
  box-shadow: 0 2px 3px 0 rgba(0,0,0,.10);
  padding-left: 55px !important;
  color: #000;
}
.snake-quiz-main-outer .answers a:hover {
  text-decoration: none;
  -moz-box-shadow: 0 2px 3px 0 rgba(0,0,0,.40);
  -webkit-box-shadow: 0 2px 3px 0 rgba(0,0,0,.40);
  box-shadow: 0 2px 3px 0 rgba(0,0,0,.40);
}
.snake-quiz-main-outer .answers a .opt-label {
  background: #ffeded;
  color: #000;
  padding: 0;
  border-radius: 9px 0 0 9px;
  font-size: 14px;
  position: absolute;
  left: 0;
  top: 0;
  font-weight: 500;
  height: 100%;
  width: 38px;
}
.snake-quiz-main-outer .opt-label .label-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  font-size: 14px;
  font-weight: 600;
}
.snake-quiz-main-outer h3 {
  color: #000;
  margin-bottom: 20px;
}
.snake-quiz-main-outer .btn-outter{
  text-align: center;
}
.snake-quiz-main-outer .btn{
border-radius: 7px;
padding: 5px 30px;
font-size: 18px;
font-weight: 600;
margin-top: 0;
background: #c00;
color: #fff;
}
.snake-quiz-main-outer .btn:hover,
.snake-quiz-main-outer .btn:focus{
  box-shadow: none;
  outline: none;

}
.quiz-overlay {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,.8);
  left: 0;
  border-radius: 15px;
}
.quiz-info {
  position: absolute;
  background: #fff;
  width: 60%;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  text-align: center;
  border-radius: 15px;
  padding: 20px;
}
/* Quiz Ends */

.main-container .player_in_board {
	width: 50px;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	transition: all 1s;
  margin-left: 25px !important;
  z-index: 999;
}
  
.snake-quiz-main-outer .answers a.selected {
  background-color: #d3d3d3;
}
.snake-quiz-main-outer  .incorrect {
  background-color: #f44336;
  color: white;
}
.snake-quiz-main-outer  .option {
  cursor: pointer;
}
.snake-quiz-main-outer  .option:hover {
  background-color: #e0e0e0;
}
.snake-quiz-main-outer  .quiz-overlay {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, .4);
  left: 0;
  border-radius: 15px;
}
.snake-quiz-main-outer  .quiz-info {
  position: absolute;
  background: #fff;
  width: 80%;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  text-align: center;
  border-radius: 15px;
  padding: 20px;
}
.snake-ladder-main .main-container ul li.box > span {
	position: absolute;
	top: 0;
	left: 10px;
	font-size: 25px;
	font-family: 'Forte';
	font-style: normal;
	font-style: italic;
	color: #b3b5b4;
	text-shadow: 2px 2px 1px #000;
	font-size: 30px;
  } 
  .snake-ladder-main .main-container ul li h4 {
    font-size: 12px;
  }

#ladder1{
    top: 44%;
    left: 14%;
    width: 60px;
    z-index: 9;
}
#ladder2{
    top: 40%;
    left: 55%;
    width: 160px;
    z-index: 9;
}
#ladder3{
    top: 19%;
    left: 55%;
    width: 160px;
    z-index: 9;
}
#snake1{
    top: 25%;
    left: 55%;
    width: 380px;
    z-index: 9;
}
#snake2{
    top: 73%;
    left: 73%;
    width: 65px;
    z-index: 9;
}
#snake3{
    top: 7%;
    left: 33%;
    width: 160px;
    z-index: 9;
}
#snake4{
    top: 59%;
    left: 35%;
    width: 145px;
    z-index: 9;
}
#snake5{
    top: 42%;
    left: 24%;
    width: 110px;
    z-index: 9;
}
.mobile-div-img{
  display: none;
}
.dice-and-roll img {
  height: 90px !important;
  width: auto;
}
.mob-boxbtns{
  display: none;
}
.mob-boxbtns .btn:focus{
  outline: none;
  box-shadow: none;
}
#close {
  display: none;
}
/* Snake And Ladder Ends */

/* Snake And Ladder User Admin Starts */
.sl-dashboard-title{
  padding: 0 25px;
  margin-bottom: 25px;
}
.sl-dashboard-sec{
  padding: 0 25px;
  margin-bottom: 45px;
}
.sl-dashboard-title .card{
  border: none;
  background: rgba(255, 255, 255, 0.2);
  
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  border: 1px solid rgba(255, 255, 255, 0.3);
  padding: 20px;
  border-radius: 16px;
}
.sl-dashboard-title .card-body{
  padding: 0;
}
.sl-dashboard-title #userdash-mobicon {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  font-size: 27px;
  cursor: pointer;
  padding: 5px 9px;
  display: none;
}
.sl-dashboard-sec  .card {
 
  box-shadow: none;
  border: none;
  border-radius: 8px;
}
.sl-dashboard-sec  .card-body {
  display: -ms-flexbox !important;
  display: flex !important;
}
.sl-dashboard-sec .view-prize-body{
  display: inline-block !important;
}
.sl-dashboard-sec .card-body .left-icon {
  background: #f5af16;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  position: relative;
  background-image: linear-gradient(to bottom, #f5af16, #e09f0e);
  align-self: center !important;
  padding: 10px;

}

.sl-dashboard-title h4{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500 !important;
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
  color: #fff;
} 

.sl-dashboard-sec  .right-text h5 {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-size: 15px;
  color: #333333;
}
.sl-dashboard-sec .card-body .right-text {
  margin-left: 20px;
}
.sl-dashboard-sec .card-body .right-text p {
  font-weight: 600;
  margin-bottom: 0;
  line-height: 30px;
}
.fs-30 {
  font-size: 30px;
}

.profile-image {
  position: relative;
  -ms-flex-item-align: center !important;
  align-self: center !important;

}
.profile-image  .nav-link.dropdown-toggle{
  display: -ms-flexbox !important;
  display: flex !important;
  padding: 0;
  cursor: pointer;
}
.user-nam{
  -ms-flex-item-align: center !important;
  align-self: center !important;
  margin-left: 10px;
  font-weight: 400;
}
.dropdown-toggle-pro{
  padding: 0;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  overflow: hidden;
  background-image: linear-gradient(to bottom, #f5af16, #e09f0e);
  cursor: pointer;
  position: relative;
}
.profile-image  .dropdown-toggle {

}
.profile-image .dropdown-toggle:after{
  display: none;
}
.profile-image .dropdown-toggle .fa {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  font-size: 20px;
  color: #000;
}
.profile-image .dropdown-menu {
  right: 0;
  left: auto;
  display: none;
  position: absolute;
  margin-top: 10px;
  padding: 0;
  border-radius: 0;
}
.profile-image .dropdown-item {
  padding: 8px 15px;
  color: #212529;
}
.profile-image .dropdown-item:hover,
.profile-image .dropdown-item:active{
  background: #e9e9e9;
  color: #212529;
}
.profile-image .dropdown-item i{
  margin-right: 10px;
  color: #424242;
}
.profile-image .dropdown-item:hover i{
  color: #f5af16;
}
.dropdown-icon{
  width: 30px;
  display: inline-block;
} 
.sidebar .first-letter{
  font-size: 20px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  font-weight: 600;
  color: #fff !important;
}
.sl-position-box{
  margin-top: 30px;
}
.sl-position-inn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  width: 60%;
}
.sl-position-sec{
  background: rgba(255, 255, 255, 0.9);
  text-align: center;
  border-radius: 8px;
  padding: 20px;
  box-shadow: 0px 2px 10px 0px rgba(58, 53, 65, 0.9);
  animation: beat 2s linear infinite;
}
.sl-position-inn h4{
  margin-bottom: 0;
  color: #000;
  font-size: 25px;
}
#position-number{
  font-weight: 600;
  color: #ed1e25;
}
.sl-position-inn h6 {
  font-size: 18px;
  font-weight: 500;
  margin-top: 10px;
  margin-bottom: 0;
}
@keyframes beat {
  0% {
    transform: scale(1);
  }
  15% {
    transform: scale(0.9);
  }
  21% {
    transform: scale(1.1);
  }
  28% {
    transform: scale(1);
  }
  35% {
    transform: scale(1);
  }
}
.card-header{
  /* background-image: linear-gradient(to right top, #dbdbdb, #dadada, #d8d9d8, #d7d7d7, #d6d6d6); */
background-image: linear-gradient(to top, #333333, #3b3b3b, #444444, #4c4c4c, #555555);
  border-radius: 8px 8px 0 0;
  border: none;
}
.card-header-title {
  font-size: 18px;
  font-weight: 600;
  color: #fff;
}



.main-container ul li .giftin-box img {
  width: 80px;
  height: 80px;
}
.main-container ul li .capin-box {
  font-size: 14px;
  margin-bottom: 0;
  position: absolute;
  bottom: 14px;
  left: 50%;
  transform: translateX(-50%);
  width: 90%;
  text-align: center;
  color: #000;
  font-weight: 600;
}

.main-container ul li.box .giftin-count {
  text-shadow: none;
  background: #fff;
  display: inline-block;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  left: auto;
  right: -10px;
  position: absolute;
  font-family: 'Titillium Web' !important;
  font-style: normal;
  font-weight: 600;
  top: -10px;
  animation: beat 2s linear infinite;
}
@keyframes beat {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(0.8);
  }
  100% {
    transform: scale(1.1);
  }
   
}
.main-container ul li.box  .giftin-box {
  width: 80px;
  height: 80px;
  position: absolute;
  left: 50%;
  top: 40%;
  transform: translateX(-50%) translateY(-40%);

}
.main-container ul li.box .giftin-count .gift-countnum {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  font-size: 14px;
  text-shadow: none;
  color: #000;
  font-family: 'Titillium Web' !important;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
  height: 25px;
}
.main-container ul li:nth-child(2n+1) .giftin-count {
  background: #000;
}
 
.main-container ul li:nth-child(2n+1)  .gift-countnum {
    color: #fff !important;
}


/* Admin New  With Side Bar Starts */

.sidebar{
    width: 25%;
    float: left;
    position: sticky;
    top: 0;
    margin-top: 40px;
    border-right: none;
    background: rgba( 255, 255, 255, 0.30 );
    box-shadow: none;
    border-radius: 10px;
    padding-bottom: 150px;
    /* background: url(../img/admin-topmenu-bg.jpg) repeat; */
    background-size: cover;

    background: rgba(255, 255, 255, 0.2);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    margin-bottom: 40px;
}
.home-section{
    width: 75%;
    float: left;
    margin-top: 40px;
}


 
.sidebar i {
  color: #fff;
  height: 60px;
  min-width: 50px;
  font-size: 28px;
  text-align: center;
  line-height: 60px;  
}
.sidebar .nav-list {
  height: calc(100% - 140px); 
  padding: 0 15px;
}
.sidebar li {
  position: relative;
 
  list-style: none;
  margin-top: 10px;
}
.sidebar li .tooltip {
  position: absolute;
  top: -20px;
  left: calc(100% + 15px);
  z-index: 3;
  background: #fff;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
  padding: 6px 12px;
  border-radius: 4px;
  font-size: 15px;
  font-weight: 400;
  opacity: 0;
  pointer-events: none;
  transition: 0s;
}
.sidebar li:hover .tooltip {
  opacity: 1; 
  pointer-events: auto;
  transition: all 0.4s ease;
  top: 50%;
  transform: translateY(-50%);
}

.user .photo {
  padding: 0;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  overflow: hidden;
  background-image: linear-gradient(to left bottom, #bcbcbc, #adadad, #9f9f9f, #909090, #828282, #828282, #828282, #828282, #909090, #9f9f9f, #adadad, #bcbcbc);
  cursor: pointer;
  position: relative;
  margin-right: 10px;
  margin: 0 auto;
}
.first-letter{
  font-size: 20px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  font-weight: 500;
  color: #fff;
}
.info {
  text-align: center;
  margin-top: 15px;
}
.user-name {
  font-size: 20px;
  color: #f5af16;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
}
.user-location {
  font-size: 13px;
  display: block;
  color: #fff;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
}
.user {
  border-bottom: 1px solid #ccc;
  padding: 40px 15px 20px 15px;
  margin-bottom: 25px;
}
.sidebar li .nav {
  -ms-flex-direction: column !important;
  flex-direction: column !important;
  border-bottom: 1px solid #ccc;
}
.sidebar li .nav li {
  padding: 10px 15px;
}
.sidebar li a {
  display: flex;
  height: 100%;
  width: 100%;
  border-radius: 12px;
  align-items: center;
  text-decoration: none;
  transition: all 0.4s ease;
  color: #11101d;
  background: #ddd;
  transition: all 0.5s ease;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
}
.sidebar li a:hover .links_name {
  transition: all 0.5s ease;
}
.sidebar li a:hover i {
  transition: all 0.5s ease;
}
.sidebar li a .links_name {
  color: #000;
  font-size: 15px;
  font-weight: 400;
  white-space: nowrap;
  pointer-events: none;
  transition: 0.4s;
}
.sidebar li i {
  height: 50px;
  line-height: 50px; 
  font-size: 18px;
  border-radius: 12px;
  color: #000;
}
.sidebar li a.active,
.sidebar li a:hover{
  background-image: linear-gradient(to bottom, #f5af16, #e09f0e);
}
.sidebar li a.active i,
.sidebar li a:hover i{
  color: #000;
}
.sidebar li a.active span,
.sidebar li a:hover span{
  color: #000;
}


 
 
.home-section {
  position: relative;
 
  min-height: 100vh;
 
  width: 75%; 
  float: left;
  transition: all 0.5s ease;
  z-index: 2;
}
.sidebar-overlay{
  display: none;
}
.sl-edit-profile form {
  width: 100%;
}
.sl-edit-profile form label {
  font-size: 15px;
  color: #000;
}
.sl-edit-profile  .form-control{
  border: 1px solid #ccc;
}
.sl-edit-profile  .form-control:focus{
  box-shadow: none;
  outline: none;
  border-color: #999;
}
.sl-edit-profile .form-control.has-error {
  border-color: red;
}
.sl-edit-profile  #txtName-error,
.sl-edit-profile  #txtemail-error {
  display: none !important;
}
.sl-edit-profile  input:read-only{
  cursor: not-allowed;
}
.sl-edit-profile .form-group{
  margin-bottom: 20px;
}
.sl-dashbord-btn{
  background-color: #f5af16;
  background-image: linear-gradient(to bottom, #f5af16, #e09f0e);
  color: #fff;
  border-radius: 6px;
  font-weight: 600;
  padding: 7px 25px;
  border: none;
}
.sl-dashbord-btn:hover{
  background-color: #f5af16;
  background-image: linear-gradient(to bottom, #e09f0e, #f5af16);
  border: none;
}
.sl-dashbord-btn:focus{
  outline: none;
  box-shadow: none;
}
/* Admin New  With Side Bar Ends */

/* Find The Person Starts */
#find-person{
  padding-top: 30px;
  padding-bottom: 30px;
}
.find-person-right,
.find-person-left{
  text-align: center;
}
.user-person-img,
.find-person-img {
  height: 350px;
  width: 350px;
  border-radius: 20px;
  overflow: hidden;
  margin: 0 auto;
}
.user-person-img{
  background: #ccc;
  position: relative;
}
.user-first-letter {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
}
.user-avatar{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  font-size: 75px;
  color: #6e6e6e;
}
.find-person-img img {
  object-fit: contain;
  height: 350px;
  width: 350px;
  object-position: top center;
  border-radius: 20px; 
}
.user-person-code {
  display: inline-block;
}
.find-person-left {
  text-align: center;
}
.find-person-code {
  display: -ms-flexbox !important;
  display: flex !important;
  -ms-flex-align: center !important;
  align-items: center !important;
  -ms-flex-pack: center !important;
  justify-content: center !important;
  background: #fff;
  margin-top: 20px;
 
}
.find-person-code input{
  border:1px solid #ccc;
  height: 38px;
  padding: 10px 15px;
 
  border-radius:0;
}
.find-person-code .employer-red-btn {
  margin-left: -1px;
}
.find-person-code input:focus{
  outline: none;
  box-shadow: none;
}
.find-person-name {
  margin-top: 20px;
}
.find-person-name h4{
  margin-bottom: 0;
  font-family: "Spartan";
  font-style: normal;
  font-weight: 600;
  color: #333;
}
.find-person-submit{
  margin-top: 20px;
  text-align: center;
}
.find-person-timer {
  text-align: right;
  margin-top: 20px;
  margin-bottom: 20px;
}
.find-person-timer #startGame{
  display: inline-block;
}
.user-person-code {
  display: inline-block;
  width: 500px;
}
.user-person-code{
  margin-bottom: 20px;
}
.user-person-code h4{
  margin-bottom: 0;
}
.find-person-head #startGame {
  position: absolute;
  right: 10px;
  top: -10px;
}
.find-person-head h4 {
  display: inline-block;
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 600;
  font-size: 25px;
  color: #c00;
  margin-bottom: 0;
}
.find-person-head {
  text-align: center;
  margin-bottom: 20px;
}
.user-id {
  width: 400px;
  margin: 0 auto;
  text-align: center;
}
.user-id h6{
  margin-bottom: 10px;
}
.user-id h6 {
  background-color: #e6e6e6;
  margin-bottom: 15px;
  border-radius: 5px;
  -moz-box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.2), inset 2px 4px 0 0 rgba(255, 255, 255, 0.08);
  -webkit-box-shadow: 0 3px 4px 0 rgb(0 0 0 / 20%), inset 2px 4px 0 0 rgb(255 255 255 / 8%);
  box-shadow: 0 3px 4px 0 rgb(0 0 0 / 20%), inset 2px 4px 0 0 rgb(255 255 255 / 8%);
  display: inline-block;
  padding: 10px 20px;
  font-weight: 600;
}
.emp-id-box {
  font-size: 15px;
  margin-top: 8px;
  display: inline-block;
}
/* Find The Person Ends */


/* Front end design for Find the person Starts  */
.smal-text {
  font-size: 13px;
  color: #333;
}
.contest-form .btn:hover{
  border-color: none;
}
.frmUsers .col-xl-6.form-group {
  position: relative;
}
.frmUsers .smal-text {
  position: absolute;
  bottom: -25px;
}
.switch-btns-sec .star-rating {
  padding: 6px 12px;
  border: 1px solid #d2d2d2;
}
.find-person-right {
  padding-bottom: 30px;
}
/* Front end design for Find the person Ends  */



/* Snake And Ladder User Admin Ends */


.contest-deta-outer h4{ 
  margin-bottom: 0;
}
.contest-deta-sec {
  -ms-flex-pack: justify !important;
  justify-content: space-between !important;
  -ms-flex-align: center !important;
  align-items: center !important;
  border: 1px solid #ccc;
  margin-top: 12px;
  padding: 10px 20px;
}
.contest-deta-sec a.btn{
  -ms-flex-item-align: center !important;
  align-self: center !important;
}


/*  Manorama Quiz Starts 2024 Dec Starts */
.mano-signup-form .select2-container {
  width: 100% !important;
}
.mano-signup-form  .select2-container .select2-selection--single {
  min-height: 41px;
  border-radius: 7px;
  background: #fff;
  border: 1px solid #ccc;
  color: #000;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-size: 15px;
}
.mano-signup-form .select2-container.has-error .select2-selection--single{
  border-color: red;
}
.mano-signup-form .select2-container--default .select2-selection--single .select2-selection__rendered{
  color: #000;
  line-height: 41px;
}
.mano-signup-form  .select2-container--default .select2-selection--single .select2-selection__arrow{
  height: 39px;
}
.mano-signup-form .select2-search--dropdown .select2-search__field:focus-visible{
  border-color: #0890fd !important;
  outline: none;
}
.select2-search__field:focus-visible{
  border: 1px solid #0890fd !important; 
  box-shadow: none;
  outline: none;
}
.mano-signup-form  .select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: #0890fd;
  color: #fff;
}
.mano-signup-form .select2-container--default .select2-search--dropdown .select2-search__field {
  border: 1px solid #0890fd;
}
.mano-signup-form  .select2-selection__clear {
  font-size: 15px;
  line-height: 40px;
  color: red;
}
.mano-signup-form #txtMobile-error{
  bottom: -22px;
}

/* #ddlSchoolCategory-error {
  display: none !important;
} */
.opt-outer{
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  width: 450px;
  background: #fff;
  z-index: 99;
  padding: 25px;
  border-radius: 16px;
 
  display: none;
}
.opt-inner {
  text-align: center;
}
.new-otp-mess,
.otp-incorrect {
  display: block;
}
.opt-close {
  position: absolute;
  right: -1px;
  top: -1px;
  background: #b7b1b1;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  cursor: pointer;
}
.opt-close i {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  color: #333;
}
.opt-header{
  margin-bottom: 20px;
}
.opt-header h4 {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-size: 25px;
  color: #000;
  margin-bottom: 0;
}
.opt-body h6 {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-size: 15px;
  color: #333;
  margin-bottom: 0;
}
.opt-overlay {
  position: fixed;
  background: rgba(0,0,0,.3);
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 9;
  display: none;
}
.otp-container {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 20px;
  margin-bottom: 20px;
}
.otp-input {
  width: 50px;
  height: 50px;
  font-size: 20px;
  text-align: center;
  margin: 0 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
}
.otp-input:focus{
  outline: none;
  border-color: #999;
}
.opt-error-messages {
  margin-bottom: 0;
}
.opt-error-messages {
  position: relative;
}
 
.otp-incorrect {
  font-size: 15px;
  color: red;
 
  width: 100%;
}
.opt-timer #timer {
  display: inline-block;
  position: relative;
}
.opt-timer  #getTimer {
  margin-bottom: 0;
  color: #000;
  box-shadow: none;
}
.opt-outer .opt-resend {
  margin-top: 20px;
}
.opt-outer .opt-resend a {
  color: #0f8dfc;
  margin-left: 5px;
}
.opt-outer .opt-resend a:hover{
  text-decoration: none;
}
.opt-outer .opt-resend h5{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
}
.opt-outer .opt-timer {
  margin-top: 20px;
}
.opt-outer  .hide{
  display: none !important;
}
.opt-outer .new-otp-mess {
  color: #0f8dfc;
}
.opt-terminate {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  width: 410px;
  background: #fff;
  z-index: 999;
  padding: 25px;
  border-radius: 16px;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transition: transform 0.25s;
}
.opt-terminate-inn h5 {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  margin-bottom: 20px;
  font-size: 16px;
}
.opt-terminate-inn ul li a{
  width: 100%;
  text-align: center;
}
.opt-terminate-inn ul{
  display: inline-block;
  width: 100%;
  text-align: center;
}
.opt-terminate-inn ul li{
  list-style: none;
  width: 45% ;
  display: inline-block;
  margin-right: 15px;
}
.opt-terminate-inn ul li:last-child{
  margin-right: 0;
}
.opt-terminate-inn ul li .btn{
  background-color: #f1f1f1;
}
.opt-terminate-inn ul li .btn:hover,
.opt-terminate-inn ul li a.active{
  background-color: #8f2e7f;
  color: #fff;
}
.opt-terminate-overlay {
  position: fixed;
  background: rgba(0,0,0,.3);
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: transform 0.25s;
  visibility: hidden;
}
.opt-terminate-overlay.show{
  z-index: 99;
  opacity: 1;
  visibility: visible;
}
.opt-terminate.show{
  opacity: 1;
  visibility: visible;
}
.opt-outer.show{
  display: block;
}
.opt-overlay.show{
  display: block;
}

.earn-points-outer .mt-30 {
  margin-bottom: 30px;
}
.total-points-outer .card{
  height: 100%;
}
.total-points-outer  .card-body{
  -ms-flex-direction: column !important;
  flex-direction: column !important;
}
.total-points-outer  .card-body .top-icon,
.total-points-outer  .card-body  .bottom-text{
  text-align: center;
}
.total-points-outer  .card-body  .bottom-text h5{
  font-weight: 600;
  font-size: 21px;
  margin-bottom: 0;
  margin-top: 20px;
}
.earn-points-filter{
  text-align: right;
}
.earn-points-filter form {
 
  margin-left: auto;
}
#datepicker {
  max-width: 200px;
  margin-left: auto;
  cursor: pointer;
}
.col-xl-12.earn-points-filter {
  position: relative;
}
#ui-datepicker-div {
  top: 50px !important;
  left: inherit !important;
  right: 15px !important;
}
.earn-points-filter .form-control:focus{
  outline: none;
  box-shadow: none !important;
}
#ui-datepicker-div {
  padding: 0;
}
.points-filter .ui-datepicker-header {
  background-image: linear-gradient(to bottom, #f5af16, #e09f0e);
  color: #fff;
  border: none;
  border-radius: 0;
}
.points-filter .ui-datepicker-today {
  opacity: 1 !important;
}
.points-filter .ui-datepicker-today .ui-state-default {
  border: none !important;
  box-shadow: none !important;
  background-image: linear-gradient(to bottom, #f5af16, #e09f0e);
  color: #fff;
}
.points-filter .ui-state-default:hover{
  background-image: linear-gradient(to bottom, #e09f0e, #f5af16);
  color: #000;
}
.ui-widget-header .ui-icon{
  font-size: 0 ;
}
.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover{
  background-color: transparent !important;
  border: none !important;
  cursor: pointer;
}
.earn-points-filter .form-control{
  background: #fff;
}
.earn-points-filter .form-control:focus{
  outline: none;
  border-color: #ccc;
}


.total-points-outer .circular-progress {
  /* position: relative;
  width: 130px;
  height: 130px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: conic-gradient(#9bc63d 0%, #9bc63d var(--percentage, 75%), #ddd var(--percentage, 75%));
  margin: 0 auto; */
  text-align: center;
}
.total-points-outer  .inner-circle {
  /* width: 110px;
  height: 110px;
  background: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center; */
}
.total-points-outer  .percentage {
  font-size: 35px;
  font-weight: bold;
  color: #000;
}
#close-icon{
  display: none;
}


/* Registration Successful Starts */
.reg-successful-outer {
  min-height: calc(100vh - 56px);
  background-image: radial-gradient(circle, #128bfc, #149aff, #2ba8ff, #46b6ff, #60c3ff, #61c4ff, #63c4ff, #64c5ff, #4cbaff, #34aeff, #1aa2ff, #0095fe);

}
.reg-successful-outer {
  padding: 60px 0  60px 0;
}
.reg-successful-inn{
  box-shadow: rgba(0, 0, 0, 0.20) 0px 0px 15px 0px;
  border-radius: 30px;
  background: #fff;
  max-width: 600px;
}
.reg-succ-outer {
  margin-top: 30px;
}
.reg-succ-icon {
  width: 60px;
  height: 60px;
  margin: 0 auto;
  background: #4aac4a;
  border-radius: 50%;
  position: relative;
}
.reg-succ-icon i {
  position: absolute;
  font-size: 25px;
  color: #fff;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
}
.reg-successful-inn h3 {
  text-align: center;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-size: 30px;
  margin-top: 20px;
  color: #000;
}
.reg-successful-inn h6{
  text-align: center;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  margin-top: 0;
  color: #333;
  font-size: 18px;
}
.reg-successful-inn .card{
  border: none;
  -webkit-box-shadow: 0px 0px 5px 1px rgba(214,214,214,1);
  -moz-box-shadow: 0px 0px 5px 1px rgba(214,214,214,1);
  box-shadow: 0px 0px 5px 1px rgba(214,214,214,1);
}
.reg-successful-inn .card-header{
  background-image: linear-gradient(to right top, #318cc7, #318cc7, #318cc7, #318cc7, #318cc7);
  border-radius: 15px 15px 0 0;
}
.reg-successful-inn .card-header h4{
  color: #fff;
  margin-bottom: 0;
  font-size: 22px;
}
.reg-successful-inn .card-body{
  padding-bottom: 30px;
}
.reg-successful-inn .card-body h5{
  margin-bottom: 0;
  color: #000;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 30px;
}
.reg-successful-inn .card ul {
  border-bottom: 1px solid #ccc;
  padding-bottom: 25px;
}
.reg-successful-inn .card ul{
  display: -ms-flexbox !important;
  display: flex !important;
  -ms-flex-pack: center !important;
  justify-content: center !important;
  margin-bottom: 20px;
 
}
.reg-successful-inn .card ul li {
list-style: none;
text-align: center;
font-size: 18px;
}
.reg-successful-inn .card ul li span{
  width: 100%;
  display: inline-block;
}
.reg-successful-inn .card-outer {
  text-align: center;
  margin-top: 60px;
}
.reg-successful-inn .card {
  display: inline-block;
  margin: 0 auto;
  border-radius: 20px;
}
.reg-successful-inn .card ul li span{
  width: 100%;
  display: inline-block;
  font-size: 18px;
  color: #000;
  font-weight: 600;
}
.all-thebest {
  text-align: center;
  margin-top: 40px;
}
.all-thebest h4 {
  text-align: center;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  margin-top: 30px;
  color: #000;
}
.reg-successful-inn {

  padding: 30px;
 
}

.family-btm {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 400px;
}
/*  Registration Successful Ends */


 

/*  Manorama Quiz Starts 2024 Dec Ends */



.banner-form-right{
  -ms-flex-item-align: center !important;
  align-self: center !important;
}

.banner-form-sec{
  /* background: #318cc7; */
  /* background-image: linear-gradient(to right, #128bfc, #0095fe, #009eff, #00a7ff, #00afff, #00afff, #00afff, #00afff, #00a7ff, #009eff, #0095fe, #128bfc); */
  background: url(../img/main-bg.jpg);
  padding: 40px 0;
  position: relative;
}
.banner-btm{
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: auto;
  z-index: 0;
}
 
.banner-form-left h2{
  font-family: 'Krona One';
  font-style: normal;
  font-weight: 400;
  font-size: 30px;
  text-transform: uppercase;
  margin-bottom: 0;
  line-height: 45px;
  text-shadow: 1px 1px #ebebeb;
}
.banner-form-left h4 {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 600;
  font-size: 35px;
  margin-top: 15px;
  margin-bottom: 0;
  text-shadow: 1px 1px #ebebeb;
}

.banner-form-left h6{
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  margin-bottom: 0;
  text-shadow: 1px 1px #ebebeb;
}
.contest-form h5{
  /* color: #318cc7; */
}
.contest-form .btn{
  /* background: #318cc7; */
}
.banner-right-form{
  background: #fff;
  box-shadow: 0 5px 15px 0 rgba( 31, 38, 135, 0.40 );
}
.banner-form-left {
  -ms-flex-item-align: center !important;
  align-self: center !important;
}
.pr-icon {
  width: 150px;
  height: 150px; 
  border: 8px solid #9bc63d;
  border-radius: 50%;
  overflow: hidden;
}
.pr-icon img{
  height: 150px;
  width: 150px;
  object-fit: contain;
}

.single-prizes-sec{
  display: flex;
}
.prizes-sec{
  margin-top: 50px;
}
.priz-icon {
  margin-right: 15px;
}
.prizes-details h3 {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 600;
}
.prizes-details h4{
  margin-bottom: 0;
  font-size: 18px;
  line-height: 24px;
}
.prizes-details {
  -ms-flex-item-align: center !important;
  align-self: center !important;
  padding-right: 30px;
}
.single-prizes-sec{
  margin-bottom: 40px;
}

.prizes-head {
  text-align: center;
  margin-bottom: 50px;
}
.schools-prizes .prizes-head {
  margin-bottom: 30px;
}
.prizes-head h4 {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-size: 35px;
  text-transform: uppercase;
  color: #8f2e7f;
}
.prizes-head h6{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-size: 20px;
  margin-bottom: 0;
}

/* Individual Prizes Starts */
.single-ind-prizes-sec {
  margin-bottom: 40px;
}
.ind-prizes-icon {
  max-height: 200px;
  background: url(../img/campaign/prizes-bg.png) no-repeat;
  background-position: center center;
  background-size: cover;
   border-radius: 15px 15px 0 0;
   /* background-image: linear-gradient(to left top, #128bfc, #3999fe, #55a7ff, #6db5ff, #85c2ff, #85c2ff, #85c2ff, #85c2ff, #6db5ff, #55a7ff, #3999fe, #128bfc); */
   
}
.ind-prizes-icon img{
  height: 200px;
  width: 100%;
  object-fit: contain;
  object-position: center center;
  padding: 10px 20px;
}
.ind-prizes-details{
  box-shadow: 2px 2px 15px rgba(0, 0, 0, 0.20);
  padding: 15px 20px;
}
.ind-prizes-details h3{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-size: 22px;
  margin-bottom: 15px;
  color: #8f2e7f;
}
.ind-prizes-details h6{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
}
.ind-prizes-details h4{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  margin-bottom: 0;
  line-height: 28px;
  color: #000;
  min-height: 64px;
}
/* Individual Prizes Ends */

/* #txtMobile-error{
  display: none !important;
} */

.schools-prizes .ind-prizes-details ul{
  padding-left: 15px;
}
.schools-prizes .ind-prizes-details ul li{
  margin-bottom: 10px;
  font-weight: 400;
}
.schools-prizes .ind-prizes-details ul li:last-child{
  margin-bottom: 0;
}
.schools-prizes .ind-prizes-details ul li span{
  font-weight: 600;
}
.subscription-form .question{
  font-size: 16px;
  padding-right: 0;
  margin-bottom: 0;
  margin-right: 40px;
}
.subscription-form {
  margin-bottom: 24px;
  display: flex;
}
 
.subscription-form .options {
  display: -ms-flexbox !important;
  display: flex !important;
}
.subscription-form .option {
  display: flex;
  align-items: center;
  position: relative;
  cursor: pointer;
  font-size: 14px;
  margin-right: 20px;
  margin-bottom: 0;
}
.subscription-form .option:last-child {
  margin-right: 0;
}
.subscription-form .option input {
  opacity: 0;
  position: absolute;
}
.subscription-form .radio {
  width: 20px;
  height: 20px;
  border: 2px solid #999;
  border-radius: 50%;
  margin-right: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: background-color 0.3s ease, border-color 0.3s ease;
}
.subscription-form .option input:checked + .radio {
  background-color: #007BFF;
  border-color: #0056b3;
}
.subscription-form .radio:after {
  content: '';
  width: 10px;
  height: 10px;
  background-color: white;
  border-radius: 50%;
  transform: scale(0);
  transition: transform 0.2s ease;
}
.subscription-form .option input:checked + .radio:after {
  transform: scale(1);
}

/* Manorma Quiz 05-1-2025 Starts */
.subscription-form {
  display: inline-block;
}
.subscription-form .question {
  margin-right: 0;
  margin-bottom: 10px;
}
.schools-prizes .prizes-head h4{
  margin-bottom: 15px;
}
.schools-prizes .prizes-head h6 {
  margin-bottom: 15px;
}
.schools-prizes .prizes-head  h5 {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-size: 25px;
  color: #8f2e7f;
  text-transform: uppercase;
}
.prizes-sub-head {
  text-align: center;
  margin-top: 40px;
  background: #f6f2c3;
  display: inline-block;
  border-radius: 15px;
  padding: 45px 25px 20px 25px;
  position: relative;
}
.prizes-sub-top {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  border-radius: 50px;
  padding: 8px 30px;
  color: #fff;
  text-transform: uppercase;
  background: #8f2e7f;
  display: inline-block;
  position: absolute;
  top: -22px;
  left: 50%;
  transform: translateX(-50%);
}
.individual-prizes{
  margin-bottom: 60px;
}
.form-control.custom-checkbox {
  min-height: inherit !important;
  height: auto;
}
.banner-form-left img{
  max-height: 650px;
  width: auto;
}
#txtPincode-error{
  display: none !important;
}
.banner-form-mob{
  display: none;
}
#terms-condt-modal .modal-content {
  border: none;
}
#terms-condt-modal .modal-body ol{
  margin-bottom: 15px;
}
#terms-condt-modal .modal-body ol li {
  margin-bottom: 2px;
}
#terms-condt-modal .modal-body h5 {
  font-weight: 600;
}
#terms-condt-modal .btn.btn-danger{
  background: #8f2e7f;
}
#terms-condt-modal .modal-header .close{
  color: #000;
}
 
#terms-condt-modal .modal-text-sec {
  padding: 10px 20px;
}

.modal-dialog-scrollable .modal-content {
  max-height: 80vh;
  overflow: hidden;
}
.modal-dialog-scrollable .modal-body {
  overflow-y: auto;
}
/* Manorma Quiz 05-1-2025 Ends */

.custom-control-label a:hover {
  color: #8f2e7f !important;
}
/* #ddlSchools-error{
  display: none !important;
} */

.sl-dashboard-bg{
  background: url(../img/user-dash-bg.jpg) center right;
  background-size: cover;
}

.already-participated-sec{
  padding: 0;
}
.already-participated-div{
display: -ms-flexbox !important;
  display: flex !important;
  -ms-flex-pack: center !important;
  justify-content: center !important;
}

.already-participated-sec{
  -ms-flex-item-align: center !important;
  align-self: center !important;
  padding: 80px 0;
}


.phone-numbers-inn {
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 30px 15px 10px 15px;
  margin-bottom: 60px;
}
.phone-numbers-inn ul li {
  list-style: none;
  display: inline-block;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  position: relative;
  padding: 0 15px;
  margin-bottom: 10px;
  font-size: 14px;
}
.phone-numbers-inn ul li a{
  color: #8f2e7f;
  margin-left: 8px;
}
.phone-numbers-inn ul li a:hover{
  text-decoration: none;
  border-bottom: 1px solid #8f2e7f;
}
.phone-numbers-inn ul li:after{
  content: "";
  background: #ccc;
  top: 0;
  right: 0;
  width: 1px;
  height: 100%;
  position: absolute;
}
.phone-numbers-inn ul li:last-child:after{
  display: none;
}
.creat-acc-link p{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  font-size: 14px;
  margin-bottom: 0;
  margin-top: 24px;
}
 
.creat-acc-link p a{
    color: #8f2e7f !important;
    font-weight: 400 !important;
}
.card.r-login-txt {
  box-shadow: none;
}
.card.r-login-txt a{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500 !important;
  background: #8f2e7f !important;
  color: #fff !important;
  border-radius: 7px;
  padding: 10px 35px;
  font-size: 18px;
  margin-top: 0;
}
.card.r-login-txt a:hover{
  text-decoration: none;
}


.quiz-section-outer{
  background: url(../img/user-dash-bg.jpg) center right;
  background-size: cover;
}
.quiz-questions-state .quiz-counter{
  color: #fff;
}
.schools-points .card-head{
  text-align: left;
  margin-bottom: 15px;
}
.schools-points .sl-dashboard-box .card{
  background: #fff;
  padding: 15px;
  border-radius: 10px;
  height: 100%;
  overflow: hidden;
}
.user-points .sl-dashboard-box .card,
.user-points .total-points-outer .card{
  border-radius: 10px;
}
.schools-points  .sl-dashboard-box{
  margin-bottom: 15px;
}
 
.schools-points .sl-dashboard-box .school-poin-img{
  position: absolute;
  right: -20px;
  bottom: -43px;
  opacity: 0.1;
  transform: rotate(-20deg);
  width: 120px;
}


.schools-points  .sl-dashboard-box .circular-progress {
  /* position: relative;
  width: 130px;
  height: 130px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: conic-gradient(#9bc63d 0%, #9bc63d var(--percentage, 75%), #ddd var(--percentage, 75%));
  margin: 0 auto; */
  text-align: center;
}
.schools-points  .sl-dashboard-box  .inner-circle {
  /* width: 110px;
  height: 110px;
  background: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center; */
}
.schools-points  .sl-dashboard-box  .percentage {
  font-size: 35px;
  font-weight: bold;
  color: #000;
}
.schools-points .sl-dashboard-box .bottom-text{
  text-align: center;
}
.schools-points .sl-dashboard-box .bottom-text h5 {
  font-weight: 600;
  font-size: 21px;
  margin-bottom: 0;
  margin-top: 20px;
}
.schools-points .sl-dashboard-box .card-head{
  margin-bottom: 0;
}

.school-name h5 .sch-grade{
 
  font-weight: 600;
}
.school-name{
  text-align: center;
  width: 100%;
}
.school-name h4{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500 !important;
  font-size: 14px;
  color: #000;
}
.school-name h5{
  margin-top: 20px;
  font-weight: 500;
  font-size: 21px;
  margin-bottom: 0;
}

.schools-points .school-poin-box .card-body {
  -ms-flex-align: end !important;
  align-items: flex-end !important;
  display: -ms-flexbox !important;
  display: flex !important;
}
 
.user-points .card-body .left-icon {
  background: #f5af16;
    background-image: none;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  position: relative;
  background-image: linear-gradient(to bottom, #f5af16, #e09f0e);
  align-self: center !important;
  padding: 10px;
}
.user-points .sl-dashboard-box .card-body {
  display: -ms-flexbox !important;
  display: flex !important;
  -ms-flex-pack: justify !important;
  justify-content: space-between !important;
  text-align: left
}
.user-points .sl-dashboard-box .right-text {
  margin-left: 0;
}
.user-points .sl-dashboard-box .right-text h5 {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-size: 15px;
  color: #333333;
  margin-bottom: 0;
}
.user-points .sl-dashboard-box .right-text p {
  font-weight: 600;
  margin-bottom: 0;
  line-height: 30px;
  text-align: left;
  margin-bottom: 10px;
}
.user-points .sl-dashboard-box .card,
.user-points  .total-points-outer .card{
  padding: 0;
  background: #fff;
}
.user-points  .total-points-outer .card,
.user-points .sl-dashboard-box  .card-body{
  padding: 15px;
}
.user-points .card-head .form-group {
  margin-bottom: 0;
  padding-top: 0;
}
.user-points .card-head{
  margin-bottom: 15px;
}
.user-points .card-head h4{
  -ms-flex-item-align: center !important;
  align-self: center !important;
}
.already-participated-div{
  background: url(../img/user-dash-bg.jpg) center right;
  background-size: cover;
}
 
.question-box ul {
  padding-left: 25px;
}
.question-box ul li {
  list-style: none;
  font-size: 14px;
}
.question-box ul li span{
  font-weight: 500;
}
.question-box ul li.corr-answer span {
  color: green;
}
.question-box ul li.ur-answer span {
  color: #b52626;
}
.question-box ul li.ur-answer span .valid-ans{
  color: green;
  margin-left: 5px;
}

.question-box label {
  background: #cdcdcd;
  border-radius: 7px;
  padding: 4px 18px;
  font-weight: 400;
  font-size: 15px;
  display: -ms-flexbox !important;
  display: flex !important;
}
.user-points .sl-dashboard-box .card {
  border-top: 5px solid #fff !important;
}
.user-points .total-point-col .card {
  border-top: 5px solid #8f2e7f !important;
}
div:where(.swal2-container) div:where(.swal2-popup) {
  padding-bottom: 0;
  padding: 25px 0;
}
div:where(.swal2-container) h2:where(.swal2-title){
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600 !important;
  color: #000 !important;
}
div:where(.swal2-container) .swal2-html-container {
  font-size: 16px;
  padding: 0 25px !important;
}
.swal2-confirm,
.swal2-deny,
.swal2-cancel {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400 !important;
  font-size: 14px !important;
}
div:where(.swal2-container) .swal2-html-container{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400 !important;
  font-size: 17px !important;
  margin-top: 16px !important;
  color: #000 !important;
  line-height: 23px !important;
}
.swal2-deny{
  background: #f5af16 !important;
  
}
.quest-number {
  margin-right: 8px;
}

div:where(.swal2-container).swal2-backdrop-show, div:where(.swal2-container).swal2-noanimation{
 
  background: rgba(0,0,0,.6) !important;
}
.swal2-default-outline:focus {
  outline: none !important;
   box-shadow: none !important;
}
.only-mobile{
  display: none;
}
.general-rule-bg{
  background: #fff076;
  padding: 15px;
  border-radius: 15px;
  margin-bottom: 30px;
}
.general-rule-bg h6 {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  color: #000;
  margin-bottom: 0;
  text-align: center;
  line-height: 35px;
  font-size: 22px;
}
.general-rule-bg h6 span{
  font-weight: 500;
}
.no-margin{
  margin: 0;
}
.dont-refresh-out {
  display: inline-block;
  width: 100%;
  text-align: center;
  margin-top: 21px;
}
.dont-refresh-inn {
  display: inline-block;
  width: auto;
  background: #dac40d;
  color: #000;
  padding: 10px 20px;
  border-radius: 10px;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
}
.dont-refresh-inn i{
  color: #f41313;
  animation: warning-blink 1s infinite alternate;

}

@keyframes warning-blink {
  from {
    color: #fff;
  }
  to {
    color: #000;
  }
}

.view-results label {
  display: flex;
  font-weight: 400;
}
.view-results .quest-sec {
  font-weight: 400;
}
.view-results-body{
  display: inline-block !important;
}
.view-results-sec {
  padding: 1.25rem;
  margin: 0;
  padding-bottom: 0;
}
.view-results-sec h6 {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500 !important;
  font-size: 24px;
}
.view-results-outer {
  padding: 0;
}
.view-results-body .row {
  width: 100%;
}
.form-group.col-xl-6.view-results {
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;

  display: block;
  margin: 0 -10px;

}

.view-results label {
  display: flex;
  font-weight: 400;
  background: #e2e2e2;
  border-radius: 7px;
  margin: 0 10px;
  display: inline-block;
  margin-bottom: 10px;
  padding: 7px 15px;
}

.view-results .quest-number {
  margin-right: 0;
}
.no-prize{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-size: 15px;
  margin-top: 10px;
  display: inline-block;
  background: #fff;
  color: #000;
  border-radius: 10px;
  padding: 15px 20px;
}

.weekly-prizeout{
  margin-bottom: 20px;
}
.weekly-prizhead {
  background: #ffd579;
  padding: 4px 20px;
  text-align: center;
  border-radius: 5px 5px 0 0;
  font-weight: 400;
}
.weekly-prizbody {
  text-align: center;
  font-weight: 600;
  font-size: 19px;
  border: 1px solid #ffd579;
  padding: 20px 10px;
  border-radius: 0 0 5px 5px;
}
.d-giftname{
  font-weight: 600;
  margin-left: 5px;
}

.bonus-card-upload .form-horizontal {
  display: flex;
}
.bonus-card-upload .form-control.btn {
  background-image: linear-gradient(to bottom, #f5af16, #e09f0e);
  color: #000;
  max-width: 190px;
  margin-left: -2px;
  border: 1px solid #f5af16;
  border-radius: 0 .25rem .25rem 0;
}
.bonus-card-upload #txtBonusUpFile {
  cursor: pointer;
  border-radius: .25rem 0 0 .25rem;
}
.bonus-card-upload #txtBonusUpFile:focus{
  outline: none;
  box-shadow: none;
  border-color: inherit;
}
.bonus-card-input .form-control:focus{
  box-shadow: none;
  outline: none;
  border-color: inherit;
}
.num-bonus-cardupload {
  display: flex;
}
.num-bon-test{
  margin-right: 20px;
}
.num-bonus-cardupload .form-control {
  max-width: 250px;

}
.num-bonus-cardupload .form-control:focus{
  outline: none;
  box-shadow: none;
}
.num-bonus-cardupload #txtBonusUpFile {
  color: #000;
  border-color: #ffca53;
  font-size: 14px;
  background-color: #f5af16;
  background-image: linear-gradient(to bottom, #f5af16, #e09f0e);
}
#txtBonusUpFile{
  cursor: pointer;
}
.bonus-card-upload{
  margin-top: 20px;
}

/*ahs*/
.contest-formx h5{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 800;
  font-size: 18px;
  color:black;
  margin-bottom: 20px;
  margin: 0 auto;
  margin-bottom: 25px;
}
.contest-formx h6{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-size: 15px;
  color:#8f2e7f;
  margin-bottom: 20px;
  margin: 0 auto;

}
.contest-formx p{
  font-weight: 800;
  font-size: 14px;
  color:#8f2e7f;
}

.prizes-headx {
  text-align: center;
}

/*ahs*/

/* 16 01 2025 School Ranking Style Mangal Starts */
.school-ranking-top {
  text-align: center;
  margin-bottom: 40px;
}
.school-ranking-logo {
  width: 250px;
}
.school-ranking-form h5{
  color: #872e7f;
  font-size: 25px;
  font-weight: 600;
}
.school-ranking-selec{
  background: #fff;
  box-shadow: 0 5px 15px 0 rgba( 31, 38, 135, 0.40 );
  text-align: center;
  padding: 25px 30px;
  border-radius: 20px;
}
.school-ranking-banner{
  background: #318cc7;
  padding: 70px 0;
}
.rank-school-name h6{
  font-size: 24px;
  font-weight: 600;
  color: #fff;
}
.school-ranking-form  .select2-container{
  text-align: left;
}
.rank-school-name {
  margin: 0;
}
#rankingArea .ind-prizes-icon,
#rankingAreaAdjust .ind-prizes-icon{
  padding: 10px 0;
  background: #90c126;
}
#rankingArea .ind-prizes-icon h5 ,
#rankingAreaAdjust  .ind-prizes-icon h5{
  margin-bottom: 0;
  font-weight: 500;
  font-size: 20px;
  color: #fff;
}
#rankingArea .ind-prizes-icon h5 svg,
#rankingAreaAdjust  .ind-prizes-icon h5 svg{
  display: none;
}
#rankingArea .ind-prizes-details,
#rankingAreaAdjust .ind-prizes-details{
  background: #fff;
}
#rankingArea .ind-prizes-details p {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-size: 15px;
  color: #333333;
  margin-bottom: 0;
}
#rankingArea .school-ranking-form h5 {
  font-size: 30px;
}
#rankingArea .ind-prizes-details h5 {
  margin-bottom: 12px;
  color: #000;
}
#rankingAreaAdjust .ind-prizes-details h5{
  margin-bottom: 0;
  color: #000;
}
#rankingAreaAdjust .ind-prizes-details{
  min-height: 170px;
}
#rankingAreaAdjust .ind-prizes-details p {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500 !important;
  font-size: 15px;
  color: #000;
}
#rankingAreaAdjust .single-ind-prizes-sec,
#rankingArea .single-ind-prizes-sec{
  margin-bottom: 10px;
}

.spinner {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  padding: 1.1px;
  background: conic-gradient(#0000 10%,#ffffff) content-box;
  -webkit-mask: repeating-conic-gradient(#0000 0deg,#000 1deg 20deg,#0000 21deg 36deg),
       radial-gradient(farthest-side,#0000 calc(100% - 9px),#000 calc(100% - 9px));
  -webkit-mask-composite: destination-in;
  mask-composite: intersect;
  animation: spinner-d55elj 1s infinite steps(10);
  margin: 0 auto;
}

@keyframes spinner-d55elj {
  to {
     transform: rotate(1turn);
  }
}
/* 16 01 2025 School Ranking Style Mangal Ends */



#frmBonusCardUpload {
  width: 100%;
}

.lastday-ans-hea {
  margin-bottom: 15px;
}
.lastday-ans-hea h4{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500 !important;
  font-size: 24px;
}
.bonus-card-label {
  font-size: 12px;
  font-weight: 400;
  margin-bottom: 0;
}
.bonus-card-label .divider {
  color: #919191;
  margin: 0 5px;
}
/* <label class="bonus-card-label">Max Size : 2MB <span class="divider">|</span> Format : JPG, PNG or HEIF Only </label> */

/* Test @ 17 Jan 2025 */

.coming_soon_ulbtn li {
  display: inline-block;
}
.sl-dashbord-purplebtn {
  background: #8F2E7F;
  color: #fff;
  border-radius: 6px;
  font-weight: 400;
  font-size: 15px;
  padding: 7px 25px;
  margin: 0 10px 10px 0;
  display: inline-block;
}
.sl-dashbord-purplebtn:hover{
    background: #661D5A;
  color: #fff;
  text-decoration: none;
}

.bonus-card-resize-inn {
  background: #8f2e7f;
  padding: 8px 20px;
  display: inline-block;
  margin-bottom: 20px;
  border-radius: 6px;
  color: #fff;
  font-size: 15px;
}
.bonus-card-resize-inn a {
  color: #fff;
  font-weight: 500;
 
}



.coming_soon_outer.error_entry .coming_soon_heading h4 {
  font-weight: 400;
  font-size: 18px;
  border: none;
  margin-bottom: 20px;
  font-weight: 600;
}
.coming_soon_outer.error_entry .sl-dashbord-purplebtn {
  margin: 0;
}
.coming_soon_outer.error_entry .coming_soon_heading h4 span {
  display: block;
  font-size: 22px;
  font-weight: 600;
  margin-bottom: 3px;
  color: #6f1660;
}



.school-rank-check {
  position: absolute;
  bottom: 0;
  background: #872e7f;
  left: 0;
  width: 100%;
  text-align: center;
}
.banner-right-form.mano-login-form {
  position: relative;
  overflow: hidden;
  padding-bottom: 80px;
}
.school-rank-check p {
  margin: 15px 0;
  color: #fff;
  font-size: 15px;
}
.school-rank-check p a {
  color: #fff;
  font-weight: 600;
}
.school-rank-check p a:hover{
  text-decoration: none;
  border-bottom: 1px solid #fff;
}






.no-contest-today {
  max-width: 450px;
  margin-left: auto;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 5px 15px 0 rgba( 31, 38, 135, 0.40 );
 
  margin-bottom: 25px;
  display: flex;
  overflow: hidden;
}
.no-contest-text{
  padding: 15px;
  font-weight: 400;
  font-size: 16px;
}
.no-contest-today .icon {
  background: #fc9700;
  padding: 0 8px;
  display: flex;
}
.no-contest-today .icon i{
  -ms-flex-item-align: center !important;
  align-self: center !important;
  color: #fff;
  animation: colorChange 1s infinite; /* 2 seconds duration and infinite loop */
}
 
@keyframes colorChange {
  0% {
    color: #fff;
  }
  50% {
    color: #000;
  }
  100% {
    color: #fff;
  }
}

#loaderTxt p {
  color: #fff;
  font-size: 20px;
  font-weight: 400;
}
#rankingArea .ind-prizes-details {
  min-height: 110px;
}
#rankingArea .ind-prizes-details p{
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500 !important;
  font-size: 15px;
  color: #000;
}
#rankingAreaAdjust .ind-prizes-details,
#rankingArea .ind-prizes-details{
  border-radius:  0 0 15px 15px;
}

.ind-prizes-icon.bg-green{
  background: #2d4c4e !important;
}
.ind-prizes-icon.bg-lavender {
  background: #7d3f8d !important;
}
.ind-prizes-icon.bg-blue{
  background: #1e549f !important;
}
.ind-prizes-icon.bg-cinnamon{
  background: #c77c5c !important;
}

.card-head.score-missing {
  text-align: left;
  margin-bottom: 20px;
}
.card-head.score-missing h6{
  color: #000;
  font-weight: 500;
  font-size: 17px;
  margin-bottom: 0;
  line-height: 20px;
  display: inline-block;
  background: #EAA712;
  padding: 8px 15px;
  border-radius: 7px;
}

.coming_soon_inner p a
{
   color: #661D5A;
}
/* manoramacontests Last Updated on 03 Feb 2025 */

/* eye icon reset pwd */
.toggle-password {
    position: absolute;
    top: 50%;
    right: 22px;
    transform: translateY(-50%);
    cursor: pointer;
    color: #888;
}
/* eye icon reset pwd */

/* Anti Drug Manorama Starts */
.antidrug-cube-inn .card{
  background: transparent;
}
.antidrug-cube-inn .card-body {
  display: inline-block !important;
  width: 100%;
}
.swal-reset-password .swal-success-content .icon {
  position: relative;
  background: #8BBF55;
  left: inherit;
  top: inherit;
  transform: inherit;
  bottom: inherit;
}
.swal-reset-password .congrats-text {
  background: transparent;
  margin-top: 20px;
  margin-bottom: 30px;
}
.swal-reset-password  .congrats-text h3 {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-size: 30px;
  margin-bottom: 0;
}
.swal-reset-password .congrats-text h6 {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-size: 20px;
  color: #333;
}
.swal-reset-password .swal-success-content .icon img {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  width: 45px;
  height: auto;
}
.swal-reset-password .swal-success-content .icon {
  width: 80px;
  height: 80px;
}
.creat-acc-link span {
  margin-left: 10px;
}
.creat-acc-link .forgt-pass {
  margin-top: 12px;
}
.reg-successful-outer .copy-login-code input {
  border-radius: 6px 0 0 6px;
}
.reg-successful-outer .copy-login-code .btn.btn-success {
  border-radius: 0 5px 5px 0;
  padding-left: 35px;
  padding-right: 35px;
  font-weight: 500;
}
.reg-successful-outer .copy-login-code{
  margin-top: 40px;
}
.reg-successful-outer #loginCode{
    max-width: 200px;
    background-color: #f5f5f5;
    color: #000;
    font-weight: 600;
    pointer-events: none;
}
.reg-successful-outer #loginCode:focus{
  outline: none;
  box-shadow: none;
  border-color: #999;
}

.reg-successful-outer .copy-login-code label {
  color: #333;
}
.reg-successful-outer .card.r-login-txt a{
  display: inline-block;
}
.copy-login-code #copyMsg {
  font-size: 14px;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
}
.rotate-buttons .disabled-btn {
  opacity: 0.6;
  cursor: not-allowed;
}
.bonus-choose-date {
  margin-bottom: 0;
  margin-right: 25px;
}
 .bonus-choose-date #ui-datepicker-div {
  left: 0 !important;
}
.num-bonus-cardupload .form-control:focus{
  border-color: #666;
}
.ui-datepicker .ui-datepicker-title select{
  font-size: 14px;
  margin: 0;
  padding: 0;
  line-height: 0 !important;
 
}
/* .bonus-choose-date #searchdate{ 
  caret-color: transparent;
  cursor: pointer;
 
} */
/* Anti Drug Manorama End */