@import url(../fonts/fonts.css);
/* ==========================
   RESET + BASE STYLES
   ========================== */
a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
command,
datalist,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
font,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
keygen,
label,
legend,
li,
meter,
nav,
object,
ol,
output,
p,
pre,
progress,
q,
s,
samp,
section,
small,
source,
span,
strike,
strong,
tbody,
td,
video,
tfoot,
th,
thead,
tt,
u,
ul,
var {
  background: transparent;
  border: 0;
  font-size: 100%;
  margin: 0;
  padding: 0;
  outline: 0;
  vertical-align: top;
  font-style: normal;
}

ol,
ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

img,
embed {
  vertical-align: top;
}

article,
aside,
audio,
canvas,
command,
datalist,
details,
embed,
figcaption,
figure,
footer,
header,
hgroup,
keygen,
meter,
nav,
output,
progress,
section,
source,
video {
  display: block;
}

mark,
rp,
rt,
ruby,
summary,
time {
  display: inline;
}

input,
textarea,
select {
  border: 0;
  padding: 0;
  margin: 0;
  outline: 0;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
}

iframe {
  border: 0;
  margin: 0;
  padding: 0;
}

fieldset,
img {
  border: 0;
}

address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
  font-style: normal;
  font-weight: 400;
}

caption,
th {
  text-align: left;
}

q:after,
q:before {
  content: "";
}

abbr,
acronym {
  border: 0;
  font-variant: normal;
}

sub {
  vertical-align: bottom;
}

legend {
  color: #000;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
li {
  margin: 0;
  padding: 0;
}

a {
  outline: 0;
  text-decoration: underline;
  -moz-outline: none;
}

a:hover {
  text-decoration: none;
  cursor: pointer;
}

a.nounderline,
a:active.nounderline,
a:link.nounderline,
a:visited.nounderline {
  text-decoration: none;
}

a:hover.nounderline {
  text-decoration: underline;
}

a img,
img {
  border: none;
  text-decoration: none;
}

button,
label {
  cursor: pointer;
  font-family: Mulish, sans-serif, Verdana;
}

input:focus,
select:focus,
textarea:focus {
  outline: 0;
}

select::-moz-focus-inner,
option::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner {
  border: 0;
  outline: 0;
}

input[type="button"]:focus,
input[type="submit"]:focus {
  outline: 0;
}

fieldset {
  border: none;
}

* {
  box-sizing: border-box;
}

img:not([src]):not([srcset]) {
  visibility: hidden;
}

img {
  width: 100%;
  max-width: 100%;
  height: auto;
  vertical-align: top;
}

:focus {
  outline: 0;
}

html,
body {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  background: #000000;
}
body {
  font-family: FormaDJRMicro-Regular, Tahoma, Helvetica, sans-serif;
  font-size: 14px;
  color: #000;
  scroll-behavior: smooth;
  font-weight: 400;
  background: #fff;
  overflow-x: hidden;
}
img {
  width: 100%;
}
.wrapper {
  width: 100%;
}
.containerFluid {
  width: 100%;
  position: relative;
}
.containerBox {
  width: 1280px;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0px auto;
}
.containerInr {
  padding: 0px 40px;
}

.posRel {
  position: relative;
}

.heading {
  font-family: FormaDJRMicro-Regular, Tahoma, Helvetica, sans-serif;
  font-size: 42px;
  color: #000;
  margin-bottom: 18px;
}
.headingmd {
  font-family: FormaDJRMicro-Regular, Tahoma, Helvetica, sans-serif;
  font-size: 32px;
  color: #000;
  letter-spacing: 0.9px;
  margin-bottom: 18px;
}
.headingsm {
  font-family: FormaDJRMicro-Regular, Tahoma, Helvetica, sans-serif;
  font-size: 38px;
  color: #000;
  letter-spacing: 0.9px;
  margin-bottom: 18px;
}
.fontWght700 {
  font-weight: 700;
}
.fontWght600 {
  font-weight: 600;
}
.fontWght500 {
  font-weight: 500;
}
.fontWght400 {
  font-weight: 400;
}
.colorwhite {
  color: #fff;
}
.colorgraydark {
  background: #212020;
}
.colorbluebg {
  background: #024ad8;
}

.colorblue {
  color: #024ad8;
}

.textcenter {
  text-align: center;
}
.textLeft {
  text-align: left;
}
.textRight {
  text-align: right;
}

/* form css start */
.form-wrap {
  width: 100%;
  border-radius: 12px;
  padding: 24px;
}

.field {
  margin-bottom: 16px;
}

label {
  display: block;
  margin-bottom: 6px;
}

input[type="text"],
input[type="email"],
textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 12px;
  border: 1px solid #666666;
  background: #fff;
  font-size: 14px;
  outline: none;
  box-shadow: 5px 5px 0px 0px #666666;
  resize: vertical;
  min-height: 40px;
}

textarea {
  min-height: 70px;
  padding-top: 10px;
  resize: none;
}

/* focus state */
input[type="text"]:focus,
input[type="email"]:focus,
.actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 6px;
}

button {
  padding: 10px 16px;
  background: transparent;
  cursor: pointer;
  font-weight: 600;
}
.error-field input[type="text"],
.error-field input[type="email"],
.error-field textarea {
  border-color: #ff0000 !important;
  box-shadow: #ff0000 !important;
}
.error-message {
  color: #ff0000 !important;
  margin-top: 10px;
  display:inline-block;
}

/* form css end */

.btnwrp {
  display: inline-block;
}
.btn {
  font-size: 16px;
  padding: 10px 14px;
  text-align: center;
  text-decoration: none;
  transition: linear 0.2s all 0s;
  display: inline-block;
}
.btn.bluebtn {
  background: #024ad8;
  color: #fff;
  box-shadow: 5px 5px 0px 0px #2f2f2f;
  border: solid 1px #2f2f2f;
}
.btn.whitebtn {
  background: #fff;
  color: #000;
  box-shadow: 5px 5px 0px 0px #024ad8;
  border: solid 1px #024ad8;
}
.btn.blackbtn {
  background: #fff;
  color: #000;
  box-shadow: 5px 5px 0px 0px #2f2f2f;
  border: solid 1px #2f2f2f;
}

.gridbg {
  background: url("../images/gridbg.png") no-repeat 0 -12px;
  background-size: cover;
  padding-bottom: 40px;
  background-color: #fff;
}
.gridbgdark {
  background: url("../images/draklines.svg") no-repeat 0 -12px;
  background-size: cover;
  padding-bottom: 40px;
  background-color: #212020;
}
.gridbgblue {
  background: url("../images/gridBlue.svg") no-repeat 0 -12px;
  background-size: cover;
  padding-bottom: 40px;
  background-color: #024ad8;
}

.topmargegrid {
  position: absolute;
  left: 0;
  top: -40px;
  width: 100%;
  height: 100%;
  background-position: 0 -110px;
  z-index: 2;
  background-color: transparent;
}
.wave.topimg .topmargegrid {
  top: 0;
  background-position: 0;
}

.tabtextbg {
  background: #024ad8;
  padding: 0px 6px;
  color: #fff;
  position: relative;
  display: inline-block;
  margin: 0 16px;
  vertical-align: top;
  height: auto;
}
.tabtextbg::before {
  content: "";
  background: url(../images/tagbg.svg) repeat 0 0;
  padding: 0;
  color: #fff;
  width: 14px;
  height: 100%;
  display: inline-block;
  position: absolute;
  left: -14px;
  background-size: cover;
  top: 0px;
  height: 54px;
}
.tabtextbg::after {
  content: "";
  background: url(../images/tagbg.svg) no-repeat right top;
  padding: 0;
  color: #fff;
  width: 14px;
  height: 100%;
  display: inline-block;
  position: absolute;
  right: -14px;
  background-size: cover;
  top: -4px;
  height: 63px;
}

.tabtextbg.tabtextblack {
  background: #212020;
  padding: 0px 6px;
  color: #fff;
  position: relative;
  display: inline-block;
  margin: 0 16px;
  vertical-align: top;
  height: auto;
}
.tabtextbg.tabtextblack::before {
  content: "";
  background: url(../images/tagbgBlack.svg) repeat 0 0;
  background-size: cover;
  height: 52px;
}
.tabtextbg.tabtextblack::after {
  content: "";
  background: url(../images/tagbgBlack.svg) no-repeat right top;
  background-size: cover;
  height: 53px;
  top: -2px;
}

.labeltag {
  position: absolute;
  min-width: 100px;
}
/* header css start */

.headerSec {background: #fff;}

#topbannerMobile {display: none;}

.headerSec .labeltag {
  right: 5vw;
  bottom: -100px;
  width: 200px;
  z-index: 1;
}

.headerInr {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 682px;
  max-width: 80%;
  text-align: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  z-index: 6;
  top: 2%;
  /* opacity: 0; */
  transition: all 1.8s cubic-bezier(0.25, 1, 0.3, 1);
}
.headerInr .subtxt {
  display: inline-block;
  vertical-align: top;
  font-size: 16px;
  letter-spacing: 0.54px;
}
.headerInr .btnwrp {
  margin-top: 28px;
}
.logo {
  width: 300px;
  max-width: 100%;
  margin: 0 auto 20px auto;
}
/* header css end */

/* shineSec css start */
/* .shineSec .gridbg {
  padding-top: 30px;
} */
.shineSec .headerBanner {
      width: 650px;
    margin: 0 auto;
    max-width: 100%;
    position: relative;
    margin-top: 66px;
    display: flex
;
    flex-wrap: wrap;
}
.shineSec  .bannerimg {
    width: 100%;
    margin-bottom: 20px;
}
.shineSec .content {
      position: relative;
    width: 100%;
    font-size: 18px;
    padding-top: 30px;
    padding-left: 40px;
    padding-right: 40px;
    bottom: 0;
}
.shineSec .content p {
  margin-bottom: 20px;
  line-height: 28px;
}
.shineSec .wave.btimg {
  margin-bottom: -30px;
}

.emailbg{
  background:url(../images/email-bg.png) no-repeat center bottom;
  background-repeat: repeat-y;
      background-size: 100%;
}

/* shineSec css end */

/* grad css start */

.gradSec .labeltag.lt-labeltag {
  bottom: 120px;
  left: 8vw;
  z-index: 2;
  width: 250px;
  /* animation: floatUpDown 3s ease-in-out infinite; */
}

.gradSec .labeltag.rt-labeltag {
      bottom: 0px;
    right: 14vw;
    z-index: 2;
    width: 160px;
    /* animation: floatUpDownReverse 3s ease-in-out infinite; */
}
/* Animation keyframes */
@keyframes floatUpDown {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-20px); /* 30px upar */
  }
  100% {
    transform: translateY(0); /* wapas neeche */
  }
}
@keyframes floatUpDownReverse {
  0% {
    transform: translateY(-20px);
  }
  50% {
    transform: translateY(0); /* 30px upar */
  }
  100% {
    transform: translateY(-20px); /* wapas neeche */
  }
}

/* .gradSec {
  padding-bottom: 56px;
} */

.gradSecInr {
  position: relative;
  z-index: 3;
  width: 100%;
  padding: 50px 0;
}
.gradSecInr .content {
  font-size: 18px;
  color: #fff;
  margin-bottom: 40px;
  margin-top: 30px;
}
.stargridrow {
  display: flex;
  justify-content: center;
  gap: 28px;

  margin-top: 30px;
  margin-bottom: 42px;
}
.staritem:nth-child(even) {
  transform: rotate(8deg);
  opacity: 1;
}

.staritem:nth-child(odd) {
  transform: rotate(-8deg);
  opacity: 1;
}


.stargridrow a {
  width: 94px;
  height: 91px;
  background: url(../images/Star-white.svg) no-repeat 0 0;
  background-size: contain;
  text-align: center;
  font-weight: 700;
  font-size: 46px;
  color: #444444;
  text-decoration: none;
  /* display: flex;
  justify-content: center;
  align-items: center; */
  transition: all 0.3s ease-in-out;
      line-height: 104px;
    display: inline-block;
    vertical-align: top;
}
.stargridrow a:hover {
  background: url("../images/Star-blue.svg") no-repeat 0 0;
  color: #fff;
  background-size: contain;
}

/* grad css end */

/* graps css start */
.grabsitmwrp {
  width:100%;
  /* display: flex;
  flex-wrap: wrap;
  justify-content: center; */
}
.grapsSecInr {
  position: relative;
  z-index: 3;
  width: 100%;
  padding-top: 142px;
  padding-bottom: 70px;
}
.grabsitmwrp {
  /* display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 60px;
  align-items: start; */
  margin-top: 36px;
}
.grabsitm {
  margin: 0 auto;
  width: 212px;
  /* max-width: 30%; */
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  text-align: center;
}

.grabsitm .imgbg {
  width: 100%;
  padding: 10px 20px;
  height: 224px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}
.grabsitm p {
  font-size: 16px;
}
.grabslickslider {
    padding-bottom: 20px;
}
/* graps css end */

/* workSec css start */
.workSec .labeltag {
  top: -92px;
  right: 13vw;
  z-index: 2;
  width: 180px;
}
.workSecInr {
  position: relative;
  z-index: 3;
  width: 100%;
  padding-top: 40px;
  padding-bottom: 80px;
}
.workSec .wave.topimg {
  top: -5.2em;
}
.workitmwrp {
  width: 680px;
  margin: 0 auto;
  max-width: 90%;
  margin-bottom: 20px;
  margin-top: -60px;
}
/* workSec css end */

/* participatSec css start */
.participatSec {
  margin-top: -100px;
}
.participatSec .wave.topimg {
  top: -8.5em;
}
.participatSecInr {
  padding-top: 90px;
  padding-bottom: 40px;
}

.participatSecInr .content {
  font-size: 18px;
  margin-bottom: 30px;
  margin-top: 30px;
}
.liveicon {
  padding-right: 32px;
}
.liveicon em {
  content: "";
  background: #ff5050;
  width: 20px;
  height: 20px;
  display: inline-block;
  border-radius: 50%;
  position: absolute;
  right: 3px;
  top: 0;
  bottom: 0;
  margin: auto 0;
  border: solid 1px #fff;
}

.tikerwrp {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  padding: 20px 0;
  margin-top: 24px;
  margin-bottom: 24px;
}
.tikerroted {
  transform: rotate(1deg);
  padding-top: 31px;
}
.tikerbg {
  background: url(../images/tikerbg.svg) repeat left bottom;
  background-size: cover;
  height: 150px;
}

.tiker {
  /* display: inline-block; */
  white-space: nowrap;
}

.tiker p {
  display: inline-block;
  margin: 0 18px;
  color: #fff;
  font-size: 23px;
  position: relative;
}
.tiker p::before {
  content: "";
  background: #ff5050;
  width: 10px;
  height: 10px;
  display: inline-block;
  border-radius: 50%;
  position: absolute;
  left: -24px;
  top: 0;
  bottom: 0;
  margin: auto 0;
}
/* .thumbsliderwrp .swiper-slide:hover {
  overflow: visible;
}
.thumbsliderwrp .swiper-wrapper {
  padding-top: 12px;
  padding-bottom: 12px;
}
.thumbsliderwrp .swiper-slide {
  transform: scale(0.9);
  transition: all 0.3s ease-in-out;
}
.thumbsliderwrp .swiper-slide img {
  transition: all 0.3s ease-in-out;
}
.thumbsliderwrp .swiper-slide:hover img {
  transform: scale(1.1);
  border: 3px solid #024ad8;
  border-radius: 16px;
} */

.thumbsliderwrp .slick-slide {
  padding: 40px 32px;
}

.thumbsliderwrp .slick-slide img {
  background: #fff;
  border: 3px solid #c9c9c9;
  border-radius: 16px;
  text-align: center;
  overflow: hidden;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease-in-out;
}
.thumbsliderwrp .slick-slide:hover img,
.thumbsliderwrp .slick-slide.slick-current img {
  transform: scale(1.1);
  border: 3px solid #024ad8;
  border-radius: 16px;
}
.slick-dots li button:before {
  font-size: 16px;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
  opacity: 1;
  color: #024ad8;
}
.slick-dots li.slick-active button:before {
  opacity: 1;
  color: #024ad8;
  font-size: 20px;
}

/* participatSec css end */

/* homeworkSec css start */
.homeworkSec .labeltag {
  top: -105px;
  left: 10vw;
  z-index: 2;
  width: 190px;
}
.homeworkSecInr {
  position: relative;
  z-index: 3;
  width: 100%;
  padding-top: 52px;
  padding-bottom: 0;
}
.homeworkSec .wave.topimg {
  top: -5.2em;
}
.homeworkSec .content {
  font-size: 18px;
  color: #fff;
  margin-bottom: 30px;
  margin-top: 30px;
}
/* .homeworkitmwrp {
  width: 620px;
  margin: 0 auto;
  max-width: 90%;
} */

.homeworkitmwrp {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 80px;
  align-items: start;
  margin-top: 20px;
  margin-bottom: 60px;
}
.homeworkitm {
  width: 140px;
  max-width: 25%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  text-align: center;
}
.homeworkitm .imgbg {
  width: 100%;
  padding: 10px 20px;
  height: 150px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}
.homeworkitm p {
  font-size: 16px;
  color: #fff;
  padding: 0 5px;
}
/* workSec css end */

/* buddy css start */

.buddySec .labeltag {
  top: 76px;
  right: 0;
  z-index: 2;
  width: 214px;
}
.buddyitmwrp {
  width:100%;
  /* display: flex;
  flex-wrap: wrap;
  justify-content: center; */
}
.buddySecInr {
  position: relative;
  z-index: 3;
  width: 100%;
  padding-top: 174px;
  padding-bottom: 0;
  /* padding-bottom: 48px; */
}
.buddySecInr .content {
  font-size: 16px;
}
.buddyitmwrp {
  width: 100%;
  /* display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 60px;
  align-items: start; */
  margin-top: 36px;
  margin-bottom: 48px;
}
.buddyitm {
  width: 212px;
  /* max-width:100%; */
  margin: 0 auto;
  margin-bottom:12px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  text-align: center;
  border: solid 1px #d0d0d0;
  border-radius: 6px;
  background: #fff;

}
.buddyitm a {
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  text-align: center;
}
.buddyitm .imgbg {
  width: 100%;
  padding: 10px;
  height: 136px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}


.buddyitm:hover img {
  transform: scale(1.5);
}

.buddyitm .tptitle {
  margin-top: 42px;
  font-size: 16px;
  padding: 0 10px;
  transition: all 0.3s ease-in-out;
}

@media only screen and (min-width: 1199px) {
  .imgbg img {transition: all 0.3s ease-in-out;}
  .buddyitm:hover .tptitle {transform: scale(1.2);}
}

.buddyitm p {
  font-size: 16px;
}
.btmlink {
  width: 100%;
  overflow: hidden;
  border-radius: 0 0 6px 6px;
}
.btmlink a,
.btmlink {
  background: #212020;
  width: 100%;
  display: flex;
  vertical-align: top;
  color: #fff;
  text-decoration: none;
  height: 58px;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  font-size: 22px;
}
.buddyitm:hover .btmlink a,
.buddyitm:hover .btmlink {
  background: #024ad8;
  transition: all 0.3s ease-in-out;
}
/* buddy css end */

/* questionSec css start */

.questionSec .labeltag.rt-labeltag {
  top: -59px;
  right: 16vw;
  z-index: 2;
  width: 160px;
}

.questionSec .labeltag.rtbt-labeltag {
  bottom: -75px;
  right: 8vw;
  z-index: 2;
  width: 200px;
}
.questionSec .labeltag.lt-labeltag {
  bottom: 30px;
  left: 17vw;
  z-index: 2;
  width: 210px;
}

.questionSec {
  margin-bottom: -100px;
  padding-bottom: 100px;
}
.questionSecInr {
  position: relative;
  z-index: 3;
  width: 100%;
  padding: 50px 20px;
  padding-bottom: 0;
}
.questionform {
  width: 900px;
  margin: 0 auto;
  max-width: 90%;
  margin-bottom: 74px;
}
.questionform .two-col-field {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}
.questionform .field label {
  color: #fff;
  font-size: 16px;
}
.questionform .field {
  margin-bottom: 32px;
}
.questionform .two-col-field .field {
  flex: 1;
}
.questionform .actions {
  text-align: center;
  justify-content: center;
  margin-top: 42px;
  margin-bottom: 18px;
}
.questionform .actions button {
  min-width: 180px;
}
/* questionSec css end */

/* term css start */
.termCont {
  position: relative;
  z-index: 2;
}
.termbannerwrp {
  position: relative;
  width: 100%;
}
.termbanner {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  position: relative;
}
/* .termlogobanner {
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  width: max-content;
  height: auto;
} */
.wave.topimg {
  position: absolute;
  left: 0px;
  /* top: -3em; */
  top: -70px;
  width: 100%;
  z-index: 1;
}
.wave.btimg {
  position: absolute;
  left: 0px;
  bottom: 0;
  width: 100%;
  z-index: 1;
  height: 60px;
  background: #fff;
  padding-bottom: 20px;
}
.wave.btimg img {width: auto;}
.two-col {
  display: flex;
  justify-content: space-evenly;
  text-align: center;
  color: #fff;
  gap: 60px;
  width: 54%;
  margin: 0 auto;
  max-width: 100%;
}
.two-col .col {
  text-align: left;
  position: relative;
}
.two-col .col.right-col:before {
  background: #c0c0c0;
  content: "";
  width: 1px;
  height: 100%;
  position: absolute;
  left: -30px;
}

/* term css end */

/* registerform-popup css start */
.popup-overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: rgba(255, 255, 255, 1);
    background: #fff;
    z-index: 10000;
}
.registerform-popup {
  position: fixed;
  width: 700px;
  z-index: 999999999;
  background: #fff;
  margin: auto;
  left: 0px;
  right: 0;
  top: 0;
  bottom: 0;
  /* height: auto; */
  height: max-content;
  max-height: 98vh;
  border: solid 5px #024ad8;
  box-shadow: 6px 6px 0px 0px #024ad8;
  padding: 40px;
}
.formcontainerBox {
  overflow-x: hidden;
  overflow-y: auto;
  max-height: 76vh;
  padding-bottom: 10px;
}
.registerform-popup .closebtn {
  width: 70px;
  height: 70px;
  border: solid 5px #024ad8;
  padding: 15px;
  position: absolute;
  right: -36px;
  top: -30px;
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
}
.registerform .form-wrap {
  border-radius: 0;
  padding: 12px 0;
}
.registerform .field {
  margin-bottom: 32px;
}
.registerform .field input[type="text"],
.registerform .field input[type="email"],
.registerform .field textarea {
  border: 1px solid #111111;
  box-shadow: 5px 5px 0px 0px #111111;
 /* margin-bottom:5px;*/
}
.registerform .center-field {
  width: 270px;
  margin: 0 auto;
  text-align: center;
}
.registerform .two-col-field {
  display: flex;
  flex-wrap: wrap;
  gap: 18%;
}
.registerform .two-col-field .field {
  flex: 1;
}

.checkbox-label {
  position: relative;
  padding-left: 48px;
  color: #373737;
}
.checkbox-label input {
  position: absolute;
  opacity: 0;
  /* cursor: pointer; */
  height: 0;
  width: 0;
  left: 0;
  top: 0;
}
.checkbox-label .checkmark {
  position: absolute;
  left: 0px;
  top: 0px;
  border: solid 2px #111111;
  width: 30px;
  height: 30px;
  padding: 16px;
  background: none;
}
.checkbox-label p {
  margin-top: 4px;
}
.checkbox-label input:checked + .checkmark {
  background: url("../images/checkicon.png") no-repeat center center;
  background-size: 22px;
}

.registerform .actions {
  justify-self: center;
  margin-top: 40px;
}
.registerform .actions button {
  min-width: 180px;
}
.registerform .btn.bluebtn {
  box-shadow: 5px 5px 0px 0px #111111;
  border: solid 1px #111111;
}
/* registerform-popup css end */

/* hpstoreform css start */
.hpstoreformSecInr {
  display: inline-block;
  width: 100%;
  padding-top: 0;
  padding-bottom: 48px;
}
.hpstoreform-wrp {
  width: 700px;
  margin: 0 auto;
  max-width: 90%;
  /* margin-top: 42px; */
  margin-top: 0;
  margin-bottom: 0;
}

.hpstoreform .form-wrap {
  border-radius: 0;
  padding: 12px 0;
}
.hpstoreform .field {
  margin-bottom: 32px;
}
.hpstoreform .field input[type="text"],
.hpstoreform .field input[type="email"],
.hpstoreform .field textarea {
  border: 1px solid #111111;
  box-shadow: 5px 5px 0px 0px #111111;
}

.hpstoreform .two-col-field {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}
.hpstoreform .two-col-field .field {
  flex: 1;
}

.hpstoreform .consent-field {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}
.hpstoreform .checkbox-label {
  font-size: 15px;
  padding-top: 8px;
}
.hpstoreform .actions {
  justify-self: center;
  margin-top: 40px;
}
.hpstoreform .actions button {
  min-width: 180px;
}
.hpstoreform .btn.bluebtn {
  box-shadow: 5px 5px 0px 0px #111111;
  border: solid 1px #111111;
}
.privacy-legend {
  margin-top: 30px;
  color: #373737;
}
.privacy-legend a {
  color: #024ad8;
  text-decoration: none;
}
.privacy-legend a:hover {
  text-decoration: underline;
}
/* hpstoreform css end */






/* 71025 */
.containerSc { width: 100%; margin: 0 auto;}
.headerBanner {
  width: 100%;
  height: 100vh;
  position: absolute;
  left: 0;
  top: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.headerBanner img {
  width: 100%;
  /* object-fit: cover; */
}
.bannerElemts {width: 100%; left: 0; top: 0; height: 100%; padding-top: 10%; display: flex; flex-wrap: wrap; text-align: center;}
.leftTopElemts {width: 15%; position: absolute; left: 8%; top: 0; z-index: 5;}
.leftElemts {width: 35%; height: 90%; position: relative; z-index: 5;}
.middleElemts {width: 30%;  z-index: 100; position: relative; top:22%}
.middleElemts .remote {
    width: 24%;
    right: 3%;
    top: 35%;
    position: absolute;
    transition: all 1.8s cubic-bezier(0.25, 1, 0.3, 1);
}
.rightElemts {width: 35%; height: 90%;  position: relative; }

/* Elements */

/* Left Items */
.el {position: absolute; transition: all 1.8s cubic-bezier(0.25, 1, 0.3, 1);}
/* .el.active {opacity: 1;} */
.el1 {width: 22%; right: -5%; top: 35%;}
.el1.active {right: -12%; top: 25%; transform: rotate(-26deg);}

.el2 {width: 10%; right: 19%; top: 27%;}

.el2.active {right: 3%; top: 23%;}

.el3 {width: 18%; right: 37%; top: 3%;}
.el3.active {
    width: 20%;
    right: 24%;
    top: 48%;
    transform: rotate(-64deg);
}

.el4 {width: 18%; right: 67%; top: 0%;}
.el4.active {right: 26%; top: 25%;}

.el5 {width: 14%; right: 84%; top: 13%;}
.el5.active {right: 48%; top: 35%;}

.el6 {
    width: 18%;
    right: -5%;
    top: 57%;
}
.el6.active {
    width: 22%;
    right: -8%;
    top: 47%;
}

.el7 {
    width: 34%;
    right: 5%;
    top: 30%;
}
.el7.active {
  width: 28%;
    right: 0%;
    top: 28%;
    transform: rotate(-14deg);
}

.el8 {
    width: 18%;
    right: 37%;
    top: 25%;
}
.el8.active {
    width: 22%;
    right: -4%;
    top: 71%;
}
.el9 {width: 12%; right: 52%; top: 15%;}
.el9.active {width: 10%; right: 13%; top: 25%;}
.el10 {
      width: 12%;
    right: 65%;
    top: 25%;
	z-index: 2;
}
.el10.active {
    width: 9%;
    right: 26%;
    top: 41%;
    z-index: 10;
}
.el11 {
   width: 15%;
    right: 12%;
    top: 63%;
}
.el11.active {
    width: 18%;
    right: 43%;
    top: 46%;
}
.el12 {
    width: 24%;
    right: 14%;
    top: 44%;
    z-index: 10;
}
.el12.active {
    width: 23%;
    right: 6%;
    top: 40%;
}
.el13 {width: 16%; right: 33%; top: 43%;}
.el13.active {width: 16%; right: 35%; top: 40%;}

.el14 {width: 22%; right: 53%; top: 36%;}
.el14.active {width: 17%; right: 21%; top: 36%;}

.el15 {
  width: 14%;
    right: 78%;
    top: 32%;
}
.el15.active {
    width: 17%;
    right: 35%;
    top: 72%;
}
.el16 {
  width: 36%;
    right: 3%;
    top: 77%;
}
.el16.active {
    width: 40%;
    right: 14%;
    top: 66%;
    transform: rotate(-13deg);
}

.el17 {
  width: 29%;
    right: 31%;
    top: 61%;
}
.el17.active {
    width: 29%;
    right: -20%;
    top: 70%;
}
.el18 {
  width: 29%;
    right: 64%;
    top: 61%;
}
.el18.active {
    width: 37%;
    right: 8%;
    top: 67%;
}
.el19 {
      width: 16%;
    right: 37%;
    top: 54%;
}
.el19.active {
    width: 20%;
    right: -5%;
    top: 43%;
}
.el20 {
      width: 14%;
    right: 74%;
    top: 45%;
}
.el20.active {
    width: 18%;
    right: 41%;
    top: 57%;
    transform: rotate(-81deg);
}

/* Right items */
.elR1 {
  width: 34%;
  left: -12%;
  top: 16%;
}
.elR1.active {
    width: 36%;
    left: -16%;
    top: 16%;
}
.elR2 {
  width: 13%;
    left: 18%;
    top: 35%;
}
.elR2.active {
    width: 13%;
    left: -7%;
    top: 35%;
}
.elR3 {
  width: 15%;
    left: 27%;
    top: 23%;
}
.elR3.active {
    width: 16%;
    left: -6%;
    top: 19%;
    transform: rotate(-46deg);
}
.elR4 {
  width: 15%;
    left: 38%;
    top: 14%;
}
.elR4.active {
    width: 15%;
    left: 5%;
    top: 33%;
}
.elR5 {
    width: 12%;
    left: 51%;
    top: 6%;
}
.elR5.active {
    width: 12%;
    left: 29%;
    top: 24%;
}
.elR6 {
  width: 22%;
    left: 67%;
    top: 11%;
} 
.elR6.active {
    width: 22%;
    left: 28%;
    top: 31%;
}
.elR7 {
  width: 28%;
    left: 2%;
    top: 45%;
    z-index: 10;
}
.elR7.active {
    width: 32%;
    left: -4%;
    top: 48%;
}
.elR8 {
  width: 12%;
    left: 27%;
    top: 43%;
}
.elR8.active {
    width: 13%;
    left: 7%;
    top: 42%;
}
.elR9 {
    width: 15%;
    left: 41%;
    top: 29%;
}
.elR9.active {
    width: 17%;
    left: 13%;
    top: 26%;
}
.elR10 {
      width: 16%;
    left: 57%;
    top: 26%;
}
.elR10.active {
    width: 18%;
    left: 32%;
    top: 52%;
}
.elR11 {
  width: 15%;
    left: 71%;
    top: 36%;
}
.elR11.active {
    width: 15%;
    left: 41%;
    top: 42%;
    transform: rotate(54deg);
}
.elR12 {
  width: 6%;
    left: 63%;
    top: 44%;
}
.elR12.active {
    width: 5%;
    left: 33%;
    top: 63%;
    transform: rotate(-21deg);
}
.elR13 {
    width: 17%;
    left: 45%;
    top: 44%;
}
.elR13.active {
    width: 18%;
    left: 19%;
    top: 45%;
}
.elR14 {
    width: 11%;
    left: 53%;
    top: 53%;
}
.elR14.active {
    transform: rotate(-23deg);
    width: 9%;
    left: 20%;
    top: 57%;
}
.elR15 {
          width: 29%;
    left: 27%;
    top: 56%;
}
.elR15.active {
    width: 35%;
    left: 3%;
    top: 58%;
    transform: rotate(-21deg);
}
.elR16 {
         width: 16%;
    left: 20%;
    top: 65%;
}
.elR16.active {
    width: 17%;
    left: 3%;
    top: 71%;
}
.elR17 {
      width: 24%;
    left: -8%;
    top: 69%;

}
.elR17.active {
    width: 24%;
    left: -17%;
    top: 69%;
}
.elR18 {
      width: 13%;
    left: 70%;
    top: 54%;
}
.elR18.active {
    width: 13%;
    left: 35%;
    top: 67%;
    transform: rotate(41deg);
}

/* .elR19.active {
    width: 13%;
    left: 35%;
    top: 67%;
    transform: rotate(41deg);
} */


.animateZomOut img {
  transform: scale(1.1);
  /* opacity: 0; */
  transition: transform 1.8s cubic-bezier(0.25, 1, 0.3, 1), 
              opacity 1.2s ease-out;
  will-change: transform, opacity;
}

/* Window load hone ke baad ye class add hogi */
.animateZomOut img.zoomOut {
  transform: scale(1);
  opacity: 1;
}
/* Initial hidden position (bottom se thoda neeche) */
.bottomToTop {
  opacity: 0;
  transform: translate(-50%, -10%); /* original se thoda neeche */
  transition: all 1.8s cubic-bezier(0.25, 1, 0.3, 1);
  will-change: transform, opacity;
}

/* Window load hone ke baad yeh class add hogi */
.bottomToTop.active {
  opacity: 1;
  transform: translate(-50%, -30%); /* apni original position pe smoothly */
}
/* .headerInr.active {top:4%; opacity: 1;} */



.envSectionMn .heading {margin-bottom: 100px;}
.envBannerimg {width: 650px; margin: 0 auto; position: relative;}
.envOpenimg {width: 100%; position: absolute; left: 0; top: -43px; opacity: 0; transition: all 1.8s cubic-bezier(0.25, 1, 0.3, 1);}
.envOpenFront {width: 100%; position: absolute; left: 0; bottom: 0;}
.envSectionMn .gridbg {
    min-height: 590px;
    transition: all 1.8s cubic-bezier(0.25, 1, 0.3, 1);
}
.envSectionMn .envzzFirstimg {
    /* margin-bottom: -250px; */
    position: absolute;
    left: 0;
    bottom: -820px;
    transition: all 1.8s cubic-bezier(0.25, 1, 0.3, 1);
}
.envSectionMn.inView .envzzFirstimg{bottom: -620px;}
/* .envSectionMn.envOpen .gridbg {min-height: 630px;} */
.envSectionMn.envOpen .envOpenimg {opacity: 1;}
.envSectionMn.envOpen .envzzFirstimg {opacity: 0;}

/* .envContentIn {background: #efefef; padding: 30px 50px 100px 50px; margin: 0 15px; position: absolute; left: 0; bottom: calc(-100% + -30px);  transition: all 1.8s cubic-bezier(0.25, 1, 0.3, 1) 0.5s;} */

.envContentIn {
  background: #efefef;
  padding: 30px 50px 100px 50px;
  margin: 0 15px;
  position: absolute;
  left: 0;
  bottom: 0;
  transform: translateY(100%); /* start hidden below */
  will-change: transform;
}

.envContentIn p {
    font-size: 18px;
    line-height: 28px;
    padding-bottom: 18px;
    color: #333;
}
/* .envSectionMn.envContent .envContentIn {bottom: 0;} */
.TopAnimation .animationSC{opacity:0; transition: linear 0.5s all 0s; position: relative; top: 50px;}
.TopAnimation.active .animationSC {opacity: 1; top: 0;}


.leftAnimation .animationLeftSC{opacity:0; transition: linear 0.5s all 0s; transform: translateX(-50px);}
.leftAnimation.LeftActive .animationLeftSC {opacity: 1; transform: translateX(0px);}

.rightAnimation .animationRightSC{opacity:0; transition: linear 0.5s all 0s; transform: translateX(50px);}
.rightAnimation.rightActive .animationRightSC {opacity: 1; transform: translateX(0px);}



/* MagicScroll */

.parallaxParent {
  height: 100vh;
  overflow: hidden;
}
.parallaxParent > * {
  height: 200%;
  position: relative;
  top: -100%;
}

#parallaxText .layer2 {position: absolute;}


.reveal1 {
  opacity: 0;
  -webkit-transform: scale(0.9);
      -moz-transform: scale(0.9);
      -ms-transform: scale(0.9);
        -o-transform: scale(0.9);
          transform: scale(0.9);
  -webkit-transition: all 1s ease-in-out;
      -moz-transition: all 1s ease-in-out;
      -ms-transition: all 1s ease-in-out;
        -o-transition: all 1s ease-in-out;
          transition: all 1s ease-in-out;
}
.reveal1.visible {
  opacity: 1;
  -webkit-transform: none;
      -moz-transform: none;
      -ms-transform: none;
        -o-transform: none;
          transform: none;
}
.reveal2 {
  opacity: 0;
  -webkit-transform: translateY(100px);
      -moz-transform: translateY(100px);
      -ms-transform: translateY(100px);
        -o-transform: translateY(100px);
          transform: translateY(100px);
  -webkit-transition: all 1s ease-in-out;
      -moz-transition: all 1s ease-in-out;
      -ms-transition: all 1s ease-in-out;
        -o-transition: all 1s ease-in-out;
          transition: all 1s ease-in-out;
}
.reveal2.visible {
  opacity: 1;
  -webkit-transform: none;
      -moz-transform: none;
      -ms-transform: none;
        -o-transform: none;
          transform: none;
}
/* */
.digit {
  width: 94px;
  height: 94px;
  display: inline-block;
  margin: 0 10px;
  opacity: 0;
  transform: translateX(-40px); /* initial translateX */
  transition: all 0.6s ease-out;
}

/* odd/even rotate */
.digit:nth-child(even) {
  transform: translateX(-40px) rotate(8deg);
}

.digit:nth-child(odd) {
  transform: translateX(-40px) rotate(-8deg);
}

/* visible: remove translateX but keep rotate */
.digit.visible:nth-child(even) {
  transform: rotate(8deg);
  opacity: 1;
}

.digit.visible:nth-child(odd) {
  transform: rotate(-8deg);
  opacity: 1;
}


.leftEl {width: 250px; height: 100%; position: absolute; top: 0; left: 8vw; z-index: 10;}
.rightEl {width: 150px; height: calc(100% - 100px); position: absolute; top: 200px; right: 8vw; z-index: 10;}
.box1 {
    max-width: 250px;
    height: 50px;
    margin: 25px auto 25px auto;
}
.box2 {
    max-width: 150px;
    height: 50px;
    margin: 25px auto 25px auto;
}

.box1, .box2, .box3 {
    display: inline-block;
    position: relative;
    border-radius: 8px;
    border: 0px solid white;
    text-align: center;
    vertical-align: middle;
    padding: 0 5px;
    height: auto;
}

.rightTrophy {width: 150px; height: 100%; position: absolute; top: -117px; right: 8vw; z-index: 10;}
.boxTrophy {
    max-width: 150px;
    height: 50px;
    margin: 25px auto 25px auto;
}
.leftBook {width: 200px; height: 100%; position: absolute; top: -100px; left: 50px; z-index: 10;}
.boxBook {
    max-width: 200px;
    height: 50px;
    margin: 25px auto 25px auto;
}

.rightPencil {width: 200px; height: 100%; position: absolute; top: -50px; right: 0; z-index: 10;}
.boxPencil {
    max-width: 200px;
    height: 50px;
    margin: 25px auto 25px auto;
}



.holioffer-bg {
    background: #ffbcff
}

.holiwrper-offer {
    width: 100%
}

.holibanner {
    width: 100%;
}

    .holibanner img {
        width: 100%;
        height: auto
    }

.items {
    position: relative;
}

.holioffer-wrp {
    width: 100%;
    background: #ffbcff
}

.head-rowpd {
    padding: 10px 20px;
    display: flex;
    justify-content: space-between;
}

.head-rowtp p {
    font-size: 50px;
    font-family: FormaDJRMicro-Regular, Tahoma, Helvetica, sans-serif;
}

.head-rowtp span {
    display: inline-block;
    padding-top: 5px;
}

.head-rowbtm {
    width: 100%;
    background: #ffbcff
}

    .head-rowbtm p {
        font-size: 32px;
        font-weight: normal;
        text-decoration: none;
        color: #030102;
        font-family: FormaDJRMicro-Regular, Tahoma, Helvetica, sans-serif;
    }

.head-rowtp {
    background: #ff88fe;
}

.holioffer-row {
    width: 100%;
    padding: 15px 0;
    text-align: center;
    font-size: 16px;
    font-weight: normal;
    text-decoration: none
}

.holioffer-row2 {
    display: flex;
    justify-content: space-between;
    text-align: center;
    padding: 15px 0
}

.holioffer-clm {
    width: 30%;
    display: flex;
    justify-content: center;
    align-items: center
}

.holiclm-bor {
    border-left: solid 1px #000;
    border-right: solid 1px #000
}

.holioffer-clm p {
    font-size: 14px;
    font-weight: normal;
    text-decoration: none;
    color: #000;
    padding: 0 0 0 15px;
    line-height: 20px;
    text-align: left
}

.hr-bor {
    border-top: solid 1px #000;
    border-bottom: solid 1px #000
}

.claim-frmbg {
    background: #ffe5ff
}

.claim-frm-row {
    padding: 25px 60px 120px 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.claim-frm {
    width: 27%;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center
}

.bts-tag {
    width: 95%;
    margin-bottom: 20px
}

    .bts-tag img {
        width: 100%
    }

.claim-fild {
    width: 100%;
    padding-bottom: 15px
}

.claim-poster {
    width: 62%
}

    .claim-poster img {
        width: 100%
    }


.head-rowtp {
    background: #fff
}

.head-rowpd {
    padding: 10px 20px;
    display: flex;
    justify-content: space-between
}

.head-rowtp p {
    font-size: 50px
}

.head-rowtp span {
    display: inline-block;
    padding-top: 5px
}

.head-rowbtm {
    width: 100%;
    background: #fff;
}

    .head-rowbtm p {
        font-size: 32px;
        font-weight: normal;
        text-decoration: none;
        color: #030102
    }


.claim-frm .btn {
    width: 100%;
}

.loginpage-otps input[type="number"] {
    -moz-appearance: textfield
}

.loginpage-otps input::-webkit-outer-spin-button,
.loginpage-otps input::-webkit-inner-spin-button {
    -webkit-appearance: none
}

.claim-frm .inputbrdr {
    border: solid 2px #000 !important
}

.agreeText {
    width: 100%;
    padding-top: 0;
    font-size: 14px;
    line-height: 20px;
    color: #fff;
}

    .agreeText a {
        color: #fff;
        text-decoration: underline;
    }

.lgn-fild-row {
    width: 100%
}




.chkbox {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 14px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    color: #fff
}

    /* Hide the browser's default checkbox */
    .chkbox input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

    /* Create a custom checkbox */
    .chkbox .checkmark {
        position: absolute;
        top: 0;
        left: 0;
        height: 20px;
        width: 20px;
        border: #fff 1.5px solid;
    }

    /* On mouse-over, add a grey background color */
    .chkbox:hover input ~ .checkmark {
        background-color: #ccc;
    }

    /* When the checkbox is checked, add a blue background */
    .chkbox input:checked ~ .checkmark {
        background-color: none;
    }


    .chkbox .checkmark:after {
        content: "";
        position: absolute;
        display: none;
    }


    .chkbox input:checked ~ .checkmark:after {
        display: block;
    }


    .chkbox .checkmark:after {
        left: 6px;
        top: 1px;
        width: 5px;
        height: 10px;
        border: solid white;
        border-width: 0 2px 2px 0;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
    }



  /* 141025 */
  .noScroll {position: fixed;}
  .btn {position: relative; overflow: hidden;}
  .btn:before {
    content: "";
    position: absolute;
    top: -15px;
    left: -50px;
    width: 40px;
    height: calc(100% + 30px);
    border-radius: 6px;
    box-sizing: border-box;
    transition: all 0.3s ease-in-out;
    transform: skew(-20deg);
    /* background: rgba(2, 74, 216, 0.20); */
  }
@media only screen and (min-width: 1199px) {
    .btn:hover {
        transform: scale(1.1,1.1);
        letter-spacing: 1px;
    }
}
  .btn:hover:before {left: calc(100% + 50px);}

.btn.bluebtn:hover {
  background: #fff;
  color: #024ad8;
  box-shadow: 5px 5px 0px 0px #2f2f2f;
}
.btn.whitebtn:hover {
  background: #024ad8;
  color: #fff;
  box-shadow: 5px 5px 0px 0px #024ad8;
}
.btn.blackbtn:hover {
  background: #000;
  color: #fff;
  box-shadow: 5px 5px 0px 0px #2f2f2f;
  border: solid 1px #2f2f2f;
}
#NextBtn {
    padding-bottom: 20px;
}

    #NextBtn .bluebtn {
        width: 100%;
        box-sizing: border-box;
    }
    #NextBtn .bluebtn:hover {background: #fff !important;}
  .envSectionMn .labeltag {
    right: 5vw;
    top: -120px;
    width: 200px;
    z-index: 1;
  }
  .shineSec .heading br {display: none;}

.videoSecInr {
    position: relative;
    z-index: 3;
    width: 100%;
    padding-top: 30px;
    padding-bottom: 30px;
}

.videoSec .gridbg {
    background: url("../images/gridbg-video.png") no-repeat 0 -12px;
    background-size: cover;
    background-color: #e0e0e0;
}

.videoCont {
    width: 100%;
    padding-top: 35px;
}

.videoSlider {
    width: 100%;
}
/*
.videoThum {
    border-radius: 10px;
    overflow: hidden;
    margin: 20px;
    transition: all 300ms ease;
}

    .videoThum img {
        width: 100%;
    }*/

.videoSlider .slick-center .videoThum {
    transform: scale(1.09);
    border: #0d99ff 2px solid;
    margin: 20px;
}

.overlayBox {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: rgba(0, 0, 0, 0.8);
    z-index: 9999999;
    left: 0px;
    top: 0px;
    display: none;
}

.overlayInr {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.closePopup {
    width: 24px;
    height: 24px;
    display: block;
    position: absolute;
    right: 0px;
    top: -30px;
    background: url("../images/popup-close.png") no-repeat center center;
    background-size: 100%;
    cursor: pointer;
}

.videoBox {
    width: 90%;
    background: #000;
    position: relative;
    height: 78vh;
    max-height: 78vh;
    margin: 0px auto;
    border: #000 1px solid;
}

    .videoBox video {
        height: 100%;
        max-height: 100%;
        width: 100%;
        -o-object-fit: cover;
        object-fit: cover;
    }

.videoThum {
    width: 500px;
    margin: 0px auto;
    border: #000 5px solid;
    position: relative;
    box-sizing: border-box;
}

    .videoThum img {
        width: 100%;
    }

.videoThemeImg1 {
    width: 120px;
    position: absolute;
    left: -118px;
    top: -69px;
}

.videoThemeImg2 {
    width: 180px;
    position: absolute;
    left: -251px;
    bottom: -110px;
}

.videoThemeImg3 {
    width: 150px;
    position: absolute;
    right: -231px;
    top: 35px;
}

.smartTankCont {
    width: 100%;
}

.printerImgBox {
    width: 100%;
    position: relative;
    bottom: -420px;
}

.printerImg {
    width: 350px;
    margin: 0px auto;
}

.smartTankSection .heading {
    margin-bottom: 0px !important;
    color: #024AD8 !important;
}

.smartTankSection.shineSec .content {
    padding-top: 10px !important;
}

.printScreen {
    width: 100%;
    height: 0px;
    background: url("../images/print-screen-bg.svg") no-repeat center 0px;
    background-size: 100%;
    position: relative;
}

.printScreenText {
    width: 560px;
    margin: 0px auto;
    opacity: 0;
}

    .printScreenText h3 {
        margin: 0px auto;
        padding-top: 70px;
        font-size: 25px;
        color: #fff;
        text-align: center;
        padding-bottom: 10px;
        font-family: FormaDJRMicro-Regular, Tahoma, Helvetica, sans-serif;
    }

    .printScreenText p {
        font-size: 16px;
        line-height: 23px;
        color: #fff;
        padding-bottom: 10px;
        text-align: center;
    }


  /* .gradesSc p span {font-family: 'FormaDJRVariableWeb'; font-weight: 600;} */
@media only screen and (min-width: 1024px) {
    .btn.whitebtn {
        transition: all 0.4s ease-in;
    }

        .btn.whitebtn:hover {
            background: #024ad8;
            color: #fff;
            box-shadow: 5px 5px 0px 0px #fff;
            border: solid 1px #024ad8;
            transform: scale(1.1, 1.1);
        }

    .btn.bluebtn {
        transition: all 0.4s ease-in;
    }

        .btn.bluebtn:hover {
            background: #2f2f2f;
            color: #fff;
            box-shadow: 5px 5px 0px 0px #024ad8;
            border: solid 1px #2f2f2f;
            transform: scale(1.1, 1.1);
        }

   
}