html {
  scroll-behavior: smooth;
}

/*Fonts*/

@font-face {font-family: Inkfree; src: url('../font/Inkfree.ttf'); }
@font-face {font-family: MandoulBrush; src: url('../font/MandoulBrush.otf'); } 
@font-face {font-family: Autography; src: url('../font/Autography.otf'); }


.Inkfree{
    font-family: 'Inkfree';
}

/*Common*/
body {font-family: 'Poppins', sans-serif;font-size: 14px;line-height: 1.42857143;color: #000;background-color: #fff;}
a{text-decoration:none;}
a:hover{text-decoration:none;}

.sora{
    font-family: 'Sora', sans-serif;
}
.caveat{
    font-family: 'Caveat', cursive;
}
.MandoulBrush{
    font-family: 'MandoulBrush';
}
.Autography{
    font-family: 'Autography', sans-serif;
}


p{
    margin-bottom:0px;
}
 ul{
    padding:0px;
    list-style:none;
    margin:0px;
}
.ls1{letter-spacing:1px;}
.ls2{letter-spacing:2px;}
.ls6{letter-spacing:6px;}
.ls10{letter-spacing:10px;}
.ls20{letter-spacing:20px;}

.padding0 {padding: 0;}


h1, h2, h3, h4, h5, h6{margin-bottom:0;}


@media (min-width:240px) {
.xs8 {font-size: 8px;}.xs9 {font-size: 9px;}.xs10 {font-size: 10px;}.xs11 {font-size: 11px;}.xs12 {font-size: 12px;}.xs13 {font-size: 13px;}.xs14 {font-size: 14px;}.xs15 {font-size: 15px;}.xs16 {font-size: 16px;}.xs17 {font-size: 17px;}.xs18 {font-size: 18px;}.xs19 {font-size: 19px;}.xs20 {font-size: 20px;}.xs21 {font-size: 21px;}.xs22 {font-size: 22px;}.xs23 {font-size: 23px;}.xs24 {font-size: 24px;}.xs25 {font-size: 25px;}.xs27 {font-size: 27px;}.xs28 {font-size: 28px;}.xs29 {font-size: 29px;}.xs30 {font-size: 30px;}.xs31 {font-size: 31px;}.xs33 {font-size: 33px;}.xs35 {font-size: 35px;}.xs37 {font-size: 37px;}.xs39 {font-size: 39px;}.xs40 {font-size: 40px;}.xs41 {font-size: 41px;}.xs43 {font-size: 43px;}.xs45 {font-size: 45px;}.xs47 {font-size: 47px;}.xs49 {font-size: 49px;}.xs51 {font-size: 51px;}.xs56{font-size: 56px;}.xs60 {font-size: 60px;}.xs70 {font-size: 70px;}.xs85 {font-size: 85px;}

.xsmt1{margin-top:1%;}.xsmt2{margin-top:2%;}.xsmt3{margin-top:3%;}.xsmt4{margin-top:4%;}.xsmt5{margin-top:5%;}.xsmt6{margin-top:6%;}.xsmt8{margin-top:8%;}.xsmt13{margin-top:13%;}.xsmt20{margin-top:20%;}
.xsmb1{margin-bottom:1%;}
.xsmb2{margin-bottom:2%;}
.xsmb3{margin-bottom:3%;}
.xsmb4{margin-bottom:4%;}
.xsmb6{margin-bottom:6%;}
.xsmb7{margin-bottom:7%;}
.xsmb8{margin-bottom:8%;}
.xsmb10{margin-bottom:10%;}
.xsmb15{margin-bottom:15%;}
.xsmb0{margin-bottom:0%;}

.xsmt-1{margin-top:-1%;}
.xsmt-3{margin-top:-3%;}
.xsmt-11{margin-top:-11%;}

.mycontainer{width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;}
.mycontainer2{
    width:100%;    
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}


.bnr-vid {
    width: 100%;
    position: relative;
    overflow: hidden;
    text-align: left;
    padding-bottom: 47.5%;
}

}


@media (min-width:768px) {  
.sm8 {font-size: 8px;}.sm9 {font-size: 9px;}.sm10 {font-size: 10px;}.sm11 {font-size: 11px;}.sm12 {font-size: 12px;}.sm13 {font-size: 13px;}.sm14 {font-size: 14px;}.sm15 {font-size: 15px;}.sm16 {font-size: 16px;}.sm17 {font-size: 17px;}.sm18 {font-size: 18px;}.sm19 {font-size: 19px;}.sm20 {font-size: 20px;}.sm21 {font-size: 21px;}.sm22 {font-size: 22px;}.sm23 {font-size: 23px;}.sm24 {font-size: 24px;}.sm25 {font-size: 25px;}.sm27 {font-size: 27px;}.sm28 {font-size: 28px;}.sm29 {font-size: 29px;}.sm30 {font-size: 30px;}.sm31 {font-size: 31px;}.sm32 {font-size: 32px;}.sm33 {font-size: 33px;}.sm35 {font-size: 35px;}.sm37 {font-size: 37px;}.sm38 {font-size: 38px;}.sm39 {font-size: 39px;}.sm40 {font-size: 40px;}.sm41 {font-size: 41px;}.sm43 {font-size: 43px;}.sm44 {font-size: 44px;}.sm45 {font-size: 45px;}.sm46 {font-size: 46px;}.sm47 {font-size: 47px;}.sm49 {font-size: 49px;}.sm51 {font-size: 51px;}.sm55 {font-size: 55px;}.sm60 {font-size: 60px;}.sm70 {font-size: 70px;}.sm80 {font-size: 80px;}.sm100 {font-size: 100px;}.sm130 {font-size: 130px;}

.lmt0{margin-top:0%;}.lmt1{margin-top:1%;}.lmt2{margin-top:2%;}.lmt3{margin-top:3%;}.lmt4{margin-top:4%;}.lmt5{margin-top:5%;}.lmt10{margin-top:10%;}.lmt13{margin-top:13%;}.lmt6{margin-top:6%;}.lmt7{margin-top:7%;}.lmt8{margin-top:8%;}.lmt9{margin-top:9%;}.lmt11{margin-top:11%;}.lmt12{margin-top:12%;}.lmt16{margin-top:16%;}.lmt18{margin-top:18%;}.lmt12{margin-top:12%;}.lmt13{margin-top:13%;}.lmt14{margin-top:14%;}.lmt15{margin-top:15%;}.lmt18{margin-top:18%;}.lmt20{margin-top:20%;}.lmt22{margin-top:22%;}.lmt25{margin-top:25%;}.lmt28{margin-top:28%;}.lmt30{margin-top:30%;}.lmt34{margin-top:34%;}.lmt45{margin-top:45%;}
.lmt-15{margin-top:-14%;}
.lmt-25{margin-top:-25%;}
.lmt-3{margin-top:-3%;}
.lmt-1{margin-top:-1%;}
.lmt-2{margin-top:-2%;}
.lmt-3{margin-top:-3%;}
.lmt-4{margin-top:-4%;}
.lmt-5{margin-top:-5%;}
.lmt-6{margin-top:-6%;}
.lmt-7{margin-top:-7%;}
.lmt-8{margin-top:-8%;}
.lmt-9{margin-top:-9%;}
.lmt-11{margin-top:-11%;}
.lmt-13{margin-top:-13%;}
.lmt-20{margin-top:-20%;}
.lmb0{margin-bottom:0%;}
.lmb1{margin-bottom:1%;}
.lmb2{margin-bottom:2%;}
.lmb7{margin-bottom:7%;}
.lmb10{margin-bottom:10%;}
.lmb15{margin-bottom:15%;}
.lmb30{margin-bottom:30%;}

.lmb-8{margin-bottom:-8%;}
.lmb-4{margin-bottom:-4%;}

.lml-2{margin-left:-2%;}

.pc-right{
    text-align: right;
}

.mobile-center {
    text-align: left;
}


.mycontainer{width: 730px;}
.mycontainer2{width:750px;}



}

@media (min-width: 992px) {
.md8 {font-size: 8px;}.md9 {font-size: 9px;}.md10 {font-size: 10px;}.md11 {font-size: 11px;}.md12 {font-size: 12px;}.md13 {font-size: 13px;}.md14 {font-size: 14px;}.md15 {font-size: 15px;}.md16 {font-size: 16px;}.md17 {font-size: 17px;}.md18 {font-size: 18px;}.md19 {font-size: 19px;}.md20 {font-size: 20px;}.md21 {font-size: 21px;}.md22 {font-size: 22px;}.md23 {font-size: 23px;}.md24 {font-size: 24px;}.md25 {font-size: 25px;}.md26 {font-size: 26px;}.md27 {font-size: 27px;}.md28{font-size: 28px;}.md29 {font-size: 29px;}.md30 {font-size: 30px;}.md31 {font-size: 31px;}.md32 {font-size: 32px;}.md33 {font-size: 33px;}.md34 {font-size: 34px;}.md35 {font-size: 35px;}.md36 {font-size: 36px;}.md37 {font-size: 37px;}.md38 {font-size: 38px;}.md39 {font-size: 39px;}.md40{font-size: 40px;}.md41 {font-size: 41px;}.md42 {font-size: 42px;}.md44 {font-size: 44px;}.md45 {font-size: 45px;}.md46 {font-size: 46px;}.md47 {font-size: 47px;}.md48 {font-size: 48px;}.md49 {font-size: 49px;}.md50 {font-size: 50px;}.md51 {font-size: 51px;}.md52 {font-size: 52px;}.md53 {font-size: 53px;}.md54 {font-size: 54px;}.md55 {font-size: 55px;}.md56 {font-size: 56px;}.md58 {font-size: 58px;}.md66 {font-size: 66px;}.md68 {font-size: 68px;}.md60{font-size: 60px;}.md64{font-size: 64px;}.md74 {font-size: 74px;}.md75 {font-size: 75px;}.md70 {font-size: 70px;}.md80 {font-size: 80px;}.md84 {font-size: 84px;}.md90{font-size: 90px;}.md106{font-size: 106px;}.md170 {font-size: 170px;}.md210 {font-size: 240px;}


.mmb0{margin-bottom:0%;}
.mmb3{margin-bottom:3%;}
.mmb5{margin-bottom:5%;}
.mmb7{margin-bottom:7%;}
.mmb8{margin-bottom:8%;}
.mmb11{margin-bottom:11%;}
.mmb12{margin-bottom:12%;}
.mmb14{margin-bottom:14%;}
.mmb15{margin-bottom:15%;}
.mmb16{margin-bottom:16%;}
.mmb20{margin-bottom:20%;}
.mmb28{margin-bottom:28%;}
.mmb35{margin-bottom:35%;}
.mmt0{margin-top:0%;}
.mmt1{margin-top:1%;}
.mmt2{margin-top:2%;}
.mmt3{margin-top:3%;}
.mmt4{margin-top:4%;}
.mmt5{margin-top:5%;}
.mmt6{margin-top:6%;}
.mmt7{margin-top:7%;}
.mmt8{margin-top:8%;}
.mmt10{margin-top:10%;}
.mmt11{margin-top:11%;}
.mmt12{margin-top:12%;}
.mmt13{margin-top:13%;}
.mmt14{margin-top:14%;}
.mmt15{margin-top:15%;}
.mmt18{margin-top:18%;}
.mmt11a{margin-top:11.6%;}
.mmt20{margin-top:20%;}
.mmt28{margin-top:28%;}
.mmt31{margin-top:31%;}
.mmt36{margin-top:36%;}
.mmt-2{margin-top:-2%;}
.mmt-3{margin-top:-3%;}
.mmt-4{margin-top:-4%;}
.mmt-5{margin-top:-5%;}
.mmt-8{margin-top:-8%;}
.mmt-9{margin-top:-9%;}
.mmt-9a{margin-top:-9.5%;}
.mmt-12{margin-top:-12%;}

.mmb-5{margin-bottom:-5%;}
.mmb-6{margin-bottom:-6%;}

.mml-4{margin-left:-4%;}

.mycontainer{width: 880px;}
.mycontainer2{width:922px;}

}

@media (min-width:1200px){
.lg8 {font-size: 8px;}.lg9 {font-size: 9px;}.lg10 {font-size: 10px;}.lg11 {font-size: 11px;}.lg12 {font-size: 12px;}.lg13 {font-size: 13px;}.lg14 {font-size: 14px;}.lg15 {font-size: 15px;}.lg16 {font-size: 16px;}.lg17 {font-size: 17px;}.lg18 {font-size: 18px;}.lg19 {font-size: 19px;}.lg20 {font-size: 20px;}.lg21 {font-size: 21px;}.lg22 {font-size: 22px;}.lg23 {font-size: 23px;}.lg24 {font-size: 24px;}.lg25 {font-size: 25px;}.lg26 {font-size: 26px;}.lg27 {font-size: 27px;}.lg28 {font-size: 28px;}.lg29 {font-size: 29px;}.lg30 {font-size: 30px;}.lg31 {font-size: 31px;}.lg32 {font-size: 32px;}.lg33 {font-size: 33px;}.lg34 {font-size: 34px;}.lg35 {font-size: 35px;}.lg36 {font-size: 36px;}.lg37 {font-size: 37px;}.lg38 {font-size: 38px;}.lg39 {font-size: 39px;}.lg40{font-size: 40px;}.lg41 {font-size: 41px;}.lg42 {font-size: 42px;}..lg43 {font-size: 43px;}.lg44 {font-size: 44px;}.lg45 {font-size: 45px;}.lg46 {font-size: 46px;}.lg47 {font-size: 47px;}.lg48 {font-size: 48px;}.lg49 {font-size: 49px;}.lg50 {font-size: 50px;}.lg51 {font-size: 51px;}.lg52 {font-size: 52px;}.lg53 {font-size: 53px;}.lg54 {font-size: 54px;}.lg55 {font-size: 55px;}.lg56 {font-size: 56px;}.lg58 {font-size: 58px;}.lg62 {font-size: 62px;}.lg60{font-size: 60px;}.lg63{font-size: 63px;}.lg64{font-size: 64px;}.lg68{font-size: 68px;}.lg70 {font-size: 70px;}.lg71 {font-size: 71px;}.lg72 {font-size: 72px;}.lg76 {font-size: 76px;}.lg80 {font-size: 80px;}.lg91 {font-size: 91px;}.lg94 {font-size: 94px;}.lg85 {font-size: 85px;}.lg100 {font-size: 100px;}.lg113 {font-size: 113px;}.lg115 {font-size: 115px;}.lg180 {font-size: 180px;}.lg210 {font-size: 240px;}




.lmtm-3{margin-top: -3%;}

.lgmb0{margin-bottom:0%;}
.lgmb2{margin-bottom:2%;}
.lgmb3{margin-bottom:3%;}
.lgmb5{margin-bottom:5%;}
.lgmb11{margin-bottom:11%;}
.lgmb12{margin-bottom:12%;}
.lgmb22{margin-bottom:22%;}
.lgmb25{margin-bottom:25%;}

.lgmb-6{margin-bottom:-6%;}


.lgmt5{margin-top:5%;}
.lgmt18{margin-top:18%;}
.lgmt13{margin-top:13%;}
.lgmt15{margin-top:15%;}
.lgmt23{margin-top:23%;}
.lgmt26{margin-top:26%;}
.lgmt29{margin-top:29%;}




}

@media (min-width:1500px){
.xl8 {font-size: 8px;}.xl9 {font-size: 9px;}.xl10 {font-size: 10px;}.xl11 {font-size: 11px;}.xl12 {font-size: 12px;}.xl13 {font-size: 13px;}.xl14 {font-size: 14px;}.xl15 {font-size: 15px;}.xl16 {font-size: 16px;}.xl17 {font-size: 17px;}.xl18 {font-size: 18px;}.xl19 {font-size: 19px;}.xl20 {font-size: 20px;}.xl21 {font-size: 21px;}.xl22 {font-size: 22px;}.xl23 {font-size: 23px;}.xl24 {font-size: 24px;}.xl25 {font-size: 25px;}.xl26 {font-size: 26px;}.xl27 {font-size: 27px;}.xl28 {font-size: 28px;}.xl29 {font-size: 29px;}.xl30 {font-size: 30px;}.xl31 {font-size: 31px;}.xl32 {font-size: 32px;}.xl33 {font-size: 33px;}.xl34 {font-size: 34px;}.xl35 {font-size: 35px;}.xl36 {font-size: 36px;}.xl37 {font-size: 37px;}.xl38 {font-size: 38px;}.xl39 {font-size: 39px;}.xl40{font-size: 40px;}.xl41 {font-size: 41px;}.xl42 {font-size: 42px;}.xl44 {font-size: 43px;}.xl45 {font-size: 45px;}.xl46 {font-size: 46px;}.xl47 {font-size: 47px;}.xl48 {font-size: 48px;}.xl49 {font-size: 49px;}.xl50 {font-size: 50px;}.xl51 {font-size: 51px;}.xl52 {font-size: 52px;}.xl53 {font-size: 53px;}.xl55 {font-size: 55px;}.xl56 {font-size: 56px;}.xl58 {font-size: 58px;}.xl65 {font-size: 65px;}.xl60{font-size: 60px;}.xl75 {font-size: 75px;}.xl70 {font-size: 70px;}.xl80 {font-size: 80px;}.xl87 {font-size: 87px;}.xl170 {font-size: 170px;}.xl210 {font-size: 240px;}



}

.mycontainer-left{}

.responsive-video {
    padding-bottom: 56.21%;
    overflow: hidden;
    position: relative;
    z-index: 3; 
    box-shadow:0px 19px 40px 0px rgba(0, 0, 0, 0.24);   
}

.video-box-main-out {
    padding: 0%;
}
.video-box-main-inn {
    margin: auto;
}
.video-box-main{padding: 0;border-width: 2px;border-color: rgb(254, 253, 255);border-style: solid;border-radius: 20px;background-color: rgb(0, 0, 0);box-shadow: 0px 15px 65px 0px rgba(49, 20, 86, 0.58);}

.video-box-inner{border-radius: 20px;overflow: hidden;}


.videoBg {
    position: absolute;
    top: -2.5%;
    max-width: 123%;
    left: -9.5%;
}

.autoplayer-subarea-16-by-9 {
    padding-bottom: 56.25%!important;
    border-radius: 0;   
}


.demo-video-box{
    padding: 0 2%;
	position:relative;
}
.demo-video {
    border-style: solid;
    border-width: 8px;
    border-color: #a31d6c;
    border-radius: 40px;
    background-color: rgb(0 0 0);
    margin-top: 4%;
    box-shadow: 0px 20px 20px 0px rgb(0 0 0 / 20%);
    overflow: hidden;
    position: relative;
    z-index: 1;
}


.responsive-video iframe, .responsive-video object, .responsive-video embed, .responsive-video1 iframe, .responsive-video1 object, .responsive-video1 embed, .responsive-demo-video embed, .responsive-demo-video object, .responsive-demo-video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.autoplayer-area {
    z-index: 2;
}

.gray{color:#546878;}


.mycontainer{margin:auto;}

.italic {
    font-style: italic;
}

.upper{text-transform:uppercase}

.video-autoplay-overlay-top, .video-autoplay-overlay-bottom{background-color: rgb(90 41 135) !important;}
.video-autoplay-overlay-play{background: url(../images/play.png) 50% 50% no-repeat rgb(90 41 135) !important;}



.video-autoplay-overlay-lottie{background: url(../images/mute.png) 50% 50% no-repeat transparent !important;margin-top: 0 !important;margin-left: 0 !important;margin: 0 auto !important;}

.video-autoplay-overlay-image{
	width: 100% !important;
    left: 0 !important;
    margin-left: 0 !important;
    text-align: center !important;
	height: 100% !important;
    top: 0 !important;
    margin-top: 0 !important;margin: 0 auto !important;
	background-image: linear-gradient(rgb(90 41 135) 10%, transparent 10%, transparent 90%, rgb(90 41 135) 90%) !important;
}


.video-autoplay-progress-line{background-color: rgb(255 255 255) !important;}
.video-autoplay-overlay-bottom-lines .video-autoplay-progress-line:after{display:none !important;}
.video-autoplay-overlay-play-lines{background: url(../images/playVid.png) 50% 50% no-repeat rgb(63, 114, 175) !important;}
.video-autoplay-overlay-bottom-lines .video-autoplay-progress {
    width: 100% !important;
}


/*font-weight*/
.w100{font-weight:100;} .w200{font-weight:200;} .w300{font-weight:300;} .w400{font-weight:400;} .w500{font-weight:500;} .w600{font-weight:600;} .w700{font-weight:700;}
.w800{font-weight:800;} .w900{font-weight:900;}
.lh0 {line-height: 0%;}.lh50 {line-height: 50%;}.lh60 {line-height: 60%;}.lh70 {line-height: 70%;}.lh80 {line-height: 80%;}.lh90 {line-height: 90%;}.lh100 {line-height: 100%;}.lh110 {line-height: 110%;}.lh120 {line-height: 120%;}.lh130 {line-height: 130%;}.lh140 {line-height: 140%;}.lh145 {line-height: 145%;}.lh150 {line-height: 150%;}.lh160 {line-height: 160%;}.lh170 {line-height: 170%;}.lh180 {line-height: 180%;}.lh190 {line-height: 190%;}.lh200 {line-height: 200%;}.lh210 {line-height: 210%;}.lh220 {line-height: 220%;}.lh230 {line-height: 230%;}


.mycontainer-left {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
}
.mycontainer-right {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-left: auto;
}

.clear {
    clear: both;
}

.text-white{color:#fff;}


.videoframe {
    position: relative;
}



/**Styling scrollable elements*/

.js-scroll {
  opacity: 0;
  transition: opacity 500ms;
}

.js-scroll.scrolled {
  opacity: 1;
}

.scrolled.fade-in {
  animation: fade-in 0.5s ease-in-out both;
}

.scrolled.fade-in-bottom {
  animation: fade-in-bottom 0.3s ease-in-out both;
}
.scrolled.fade-in-top {
  animation: fade-in-top 0.3s ease-in-out both;
}

.scrolled.fade-in-left {
  animation: fade-in-left 0.3s ease-in-out both;
}
.scrolled.fade-in-right {
  animation: fade-in-right 0.5s ease-in-out both;
}

.scrolled.slide-left {
  animation: slide-in-left 0.3s ease-in-out both;
}

.scrolled.slide-right {
  animation: slide-in-right 0.3s ease-in-out both;
}

/* ----------------------------------------------
 * Generated by Animista on 2021-2-11 23:32:31
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */


#more {display: none;}
#text{display:none;}




/*------------------------------------------------*/

/*--------Gradients*/


/*.gradient-text1 {
    padding: 0;
    background-image: linear-gradient(to right, #4114f7 0%, #04d3dd 86%);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}*/

.gradient-text1 {
    padding: 0;
    background-image: linear-gradient(to right, #144ff7 0%, #04bfdd 86%);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}

/*--------Gradients*/


a{
  display: block;
  text-align:center;
  margin: 0 auto;
  color: #aaa;
}


.videoWrapper {
  position: relative;
  width: 100%;
  height: 0;
  background-color: #000;
  padding-top: 56%;
}

.videoIframe {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: transparent;
}

.videoPoster {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  cursor: pointer;
  border: 0;
  outline: none;
  background-position: 50% 50%;
  background-size: 100% 100%;
  background-size: cover;
  text-indent: -999em;
  overflow: hidden;
  opacity: 1;
  -webkit-transition: opacity 800ms, height 0s;
  -moz-transition: opacity 800ms, height 0s;
  transition: opacity 800ms, height 0s;
  -webkit-transition-delay: 0s, 0s;
  -moz-transition-delay: 0s, 0s;
  transition-delay: 0s, 0s;
  border-radius: 15px;
}
.videoWrapperActive .videoPoster {
  opacity: 0;
  height: 0;
  -webkit-transition-delay: 0s, 800ms;
  -moz-transition-delay: 0s, 800ms;
  transition-delay: 0s, 800ms;
}
.videoIframe {
    position: absolute;
    top: 0;
    border-radius: 0;
    background: #000;
}

/* *********
  SVG PLAY BUTTON
********** */

.stroke-dotted {
  stroke-dasharray: 4, 5;
  stroke-width: 1px;
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  -webkit-animation: spin 4s infinite linear;
  animation: spin 4s infinite linear;
  -webkit-transition: opacity 1s ease, stroke-width 1s ease;
  transition: opacity 1s ease, stroke-width 1s ease;
}
.stroke-solid {
  stroke-dashoffset: 0;
  stroke-dasharray: 300;
  stroke-width: 4px;
  -webkit-transition: stroke-dashoffset 1s ease, opacity 1s ease;
  transition: stroke-dashoffset 1s ease, opacity 1s ease;
  opacity: 0;
}
.vid-icon {
  -webkit-transition: -webkit-transform 200ms ease-out;
  transition: -webkit-transform 200ms ease-out;
  transition: transform 200ms ease-out;
  transition: transform 200ms ease-out, -webkit-transform 200ms ease-out;
}

.play-vid:hover .icon {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
  opacity: 1;
}
.play-vid {
  cursor: pointer;
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  opacity: 0.85;
  width: 110px;
  height: 60px;
}




/*.........................................................*/

a.navbar-brand {margin-left: 0;}

/*Header*/

.header {
    margin: auto;
    width: 100%;
    position: relative;
    z-index: 1;
}
.menu {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
a.navbar-brand {
    
}
.btnn {
    margin: 0 -50px 0 10px;
}
.Arrowtext {
    position: absolute;
    top: -30%;
    left: 2%;
    z-index: 5;
    overflow: hidden;
}
.revoicertext {
    width: 100%;
    height: 100px;
    -ms-transform: skewY(20deg);
    transform: skewY(351deg);
}
.arrow1 {
    position: absolute;
    top: -9%;
    left: 2%;
}
.navbar-light .navbar-nav .nav-link {
    position: relative;
    padding-left: 24px;
    padding-right: 24px;
    padding-top: 3px;
    padding-bottom: 5px;
    color: #000;
}
.navbar-light .navbar-nav .nav-link:hover {
    color: #7c38dd;
}



/* Effect 17: move up fade out, push border */

.cl-effect-17 a::before {
	color: #e145a2;
	text-shadow: 0 0 1px rgb(0 0 0 / 30%);
	content: attr(data-hover);
	position: absolute;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	pointer-events: none;
}

.cl-effect-17 a::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 72%;
    height: 2px;
    background: #7c38dd;
    opacity: 0;
    -webkit-transform: translateY(5px);
    -moz-transform: translateY(5px);
    transform: translateY(5px);
    -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
    -moz-transition: -moz-transform 0.3s, opacity 0.3s;
    transition: transform 0.3s, opacity 0.3s;
    pointer-events: none;
    margin: auto;
}

.cl-effect-17 a:hover::before,
.cl-effect-17 a:focus::before {
	opacity: 0;
	-webkit-transform: translateY(-2px);
	-moz-transform: translateY(-2px);
	transform: translateY(-2px);
}

.cl-effect-17 a:hover::after,
.cl-effect-17 a:focus::after {
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}



/*section-1*/

.banner {
    background: url(../images/banner.png) no-repeat center top;
    background-size: cover;
    padding: 0% 0% 0% 0%;
    position: relative;
    margin-top: 0;
    overflow: hidden;
    z-index: 1;
}
.hdTx1 {
    margin-top: 4.5%;
}
.bottomline1 {
    background: url(../images/bottomline1.png) no-repeat center bottom;
    background-size: contain;
    padding: 0% 0% 0% 0.3%;
}
.bottomline2 {
    background: url(../images/bottomline2.png) no-repeat center bottom;
    background-size: contain;
    padding: 0% 0% 0% 0.5%;
}

.title1A {
    background: url(../images/title1A.png) no-repeat center bottom;
    background-size: contain;
    padding: 4% 3% 1.5% 5%;
}

.title1A span {background-color: #ededed;}

.title1 {
    background: url(../images/title1.png) no-repeat center right;
    background-size: contain;
    display: inline-block;
    padding: 2.5% 3% 2.0% 0%;
}

.title1 span {
    background: -webkit-linear-gradient(#f5be09, #dba520);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    position: relative;
    left: 3%;
}

.liveBox {
    border-width: 2px;
    border-color: rgb(0, 0, 0);
    border-style: solid;
    border-radius: 15px;
    background-color: rgb(255, 255, 255);
    padding: 6% 3% 3% 3%;
    max-width: 95.5%;
    margin: auto;
}
.liveinnerBox {
    border-radius: 10px;
    background-image: -webkit-linear-gradient( -75deg, rgb(117,48,227) 0%, rgb(171,112,216) 71%, rgb(225,175,204) 100%);
    padding: 12% 3%;
    margin-top: 5%;
}
.title2 {
    border-width: 2px;
    border-color: rgb(0, 0, 0);
    border-style: solid;
    border-radius: 9px;
    background-color: #fff;
    display: inline-block;
    padding: 10.5px 22px;
    margin-top: 12%;
}
.clock {
    margin-right: 5px;
    position: relative;
    top: -3px;
}
 

.text-bg1A-out {
    position: relative;
}
.text-main{
	position:relative;
	z-index:1;
}
.text-bg1A {
    padding: 0px 6px;
    background-image: linear-gradient( to top, #ffffff00, #ffffff00 0%, #c7b9ff 0%, #c7b9ff 60%, #ffffff00 60% );
    position: absolute;
    z-index: 0;
    top: 0;
    height: 65px;
    left: 0;
    animation: right-animate1 1s ease alternate;
    /* -webkit-animation-fill-mode: both; */
    /* animation-fill-mode: both; */
    width: 101%;
}

.text-bg1B-out {
    position: relative;
}
.text-bg1B {
    padding: 0 6px;
    background-image: linear-gradient( to top, #ffffff00, #ffffff00 0%, #ffc700 0%, #ffc700 55%, #ffffff00 55% );
    position: absolute;
    z-index: 0;
    top: 0;
    height: 65px;
    left: -2px;
    animation: right-animate1 1s ease;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    /* -webkit-animation-fill-mode: both; */
    /* animation-fill-mode: both; */
    animation-delay: 1s;
    width: 101%;
}


.video-section{padding: 0 1.8%;}
.video-box {
    padding: 32px;
    position: relative;
    z-index: 1;
    overflow: hidden;
    border-radius: 20px;
    background-image: -webkit-linear-gradient( 0deg, rgb(160 105 255 / 40%) 0%, rgb(208 159 246 / 40%) 49%, rgb(255 213 237 / 40%) 100%);
    box-shadow: 0px 38px 38px 0px rgb(0 0 0 / 26%);
}
.video-section .autoplayer-area, .bnr-vid {
    overflow: hidden;
    border-width: 2px;
    border-color: rgb(255, 255, 255);
    border-style: solid;
    border-radius: 10px;
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 38px 62px 0px rgba(0, 0, 0, 0.28);
}



@keyframes right-animate1 {
    0% {
        width:0;
    }
    100% {
        width:103%;
    }
}


.book1{position:absolute;top: 19%;}
.book2{position:absolute;top: 21%;}

.liveDate {
    position: relative;
    margin-left: -11%;
    z-index: 1;
	animation: tada-wait1 3s linear infinite;
}

.date-section {
    background: url(../images/dateBg.png) no-repeat center top;
    background-size: cover;
    position: relative;
    margin-top: -4%;
}

.date-box{
	box-shadow: 15.556px 15.556px 13px 0px rgba(0, 0, 0, 0.25);
	display: inline-block;
	border-radius: 0 100px 100px 0;
	padding: 9% 15px;
	background-image: linear-gradient(to right,#ffffff00 0%, #f9ce0b 23%);
	width: 145%;
	position: relative;
	margin-left: -22%;
}
.title-text {
    text-align: center;
    justify-content: center;
    position: relative;
    margin-top: -2%;
}

.new_title_content {
    margin-top: 2%;
    margin-bottom: 70px;
}
.new_title_content .prize_img {
    width: auto;
    margin: auto;
}

.ele1{position:absolute;left:100%;bottom: 100%;}
.ele2{position:absolute;left: 102%;bottom: 0;}


/*-----------------------Section-2*/

.section2 {
    padding: 0% 0 6% 0;
    margin-top: 0;
    background-color: #f6f1ff;
    position: relative;
}
.bottomline3 {
    background: url(../images/bottomline3.png) no-repeat center 21px;
    background-size: contain;
    padding: 0% 0% 0% 0.3%;
}
.bonus-list-box {
    padding: 0 1.5%;
}
.bonus-list-out {
    padding: 0 1%;
}
.sctioin2Bg{
    position: relative;
}
.sctioin2Bg-inn {
    position: relative;
    padding: 3% 4%;
    z-index: 2;
    border-radius: 29px;
    background-color: rgb(0 0 0 / 93%);
    box-shadow: 0px 34px 32px 0px rgba(0, 0, 0, 0.54);
}

.promoteMain .winBox {
    border-radius: 15px;
    padding: 6.2% 5%;
    height: 100%;
    color: #fff;
    text-transform: uppercase;
}

.promoteMain:nth-child(1) .winBox{background-image: -webkit-linear-gradient( 0deg, rgba(162,89,255,0.99608) 0%, rgb(181,90,219) 47%, rgb(199,91,183) 100%);}
.promoteMain:nth-child(2) .winBox{background-image: -webkit-linear-gradient( -15deg, rgba(255,136,58,0.99608) 0%, rgb(255,89,56) 100%);}
.promoteMain:nth-child(3) .winBox{background-image: -webkit-linear-gradient( 180deg, rgb(0,137,245) 0%, rgb(0,181,213) 45%, rgb(0,224,181) 100%);}
.promoteMain:nth-child(4) .winBox{background-image: -webkit-linear-gradient( 0deg, rgb(105,117,221) 0%, rgb(110,101,199) 41%, rgb(115,85,176) 100%);}
.promoteMain:nth-child(5) .winBox{background-image: -webkit-linear-gradient( 180deg, rgb(103,23,205) 0%, rgb(72,68,228) 56%, rgb(40,113,250) 100%);}
.promoteMain:nth-child(6) .winBox{background-image: -webkit-linear-gradient( 180deg, rgb(71,80,154) 0%, rgb(103,113,230) 100%);}
.promoteMain:nth-child(7) .winBox{background-image: -webkit-linear-gradient( 0deg, rgba(239,169,47,0.99608) 0%, rgb(226,111,125) 46%, rgb(212,52,203) 99%, rgb(212,52,203) 100%);}
.promoteMain:nth-child(8) .winBox{background-image: -webkit-linear-gradient( 0deg, rgb(186,176,34) 0%, rgb(63,168,123) 100%);}
.promoteMain:nth-child(9) .winBox{background-image: -webkit-linear-gradient( 0deg, rgb(255,120,120) 0%, rgb(200,34,112) 100%);}
.promoteMain:nth-child(10) .winBox{background-image: -webkit-linear-gradient( 0deg, rgb(27,161,211) 0%, rgb(90,66,236) 100%);}
.promoteMain:nth-child(11) .winBox{background-image: -webkit-linear-gradient( 0deg, rgb(196,120,164) 0%, rgb(117,48,227) 100%);}
.promoteMain:nth-child(12) .winBox{background-image: -webkit-linear-gradient( 0deg, rgb(42,165,188) 0%, rgb(131,83,215) 100%);}
.promoteMain:nth-child(13) .winBox{background-image: -webkit-linear-gradient( 0deg, rgb(186,176,34) 0%, rgb(63,168,123) 100%);}
.promoteMain:nth-child(14) .winBox{background-image: -webkit-linear-gradient( 180deg, rgb(71,80,154) 0%, rgb(103,113,230) 100%);}
.promoteMain:nth-child(15) .winBox{background-image: -webkit-linear-gradient( -15deg, rgba(255,136,58,0.99608) 0%, rgb(255,89,56) 100%);}


.promoteMain {
    padding: 1.6% 2%;
}
.promoteMainwin {
}
.section2shap1 {
    position: absolute;
    bottom: 95.5%;
    right: 98.5%;
}
.section2shap2 {
    position: absolute;
    bottom: 87%;
}

/*section-3*/

.section3 {
    background: url(../images/section3.png) no-repeat center top;
    background-size: cover;
    padding: 26% 0% 21% 0%;
    margin-top: -23%;
    overflow: hidden;
    position: relative;
}


.promote-vid {
    width: 100%;
    position: relative;
    right: -14%;
}

.section3-box {
    padding: 0% 14% 0% 18%;
}
.stepBox {
    max-width: 85.8%;
    padding: 0 2%;
    margin-top: 0%;
    background-image: -webkit-linear-gradient( 0deg, rgb(254,253,255) 49%, rgb(164,147,188) 73%, rgb(74,40,120) 92%);
    box-shadow: 0px 35px 46px 0px rgb(0 0 0 / 58%);
    position:relative;
}
.img1 {
    position: absolute;
    left: 100%;
    top: 0;
    height: 100%;
}



.stepBox2 {
    max-width: 85.8%;
    padding: 0 2%;
    margin-left: auto;
    margin-top: 0%;
    background-image: -moz-linear-gradient( 0deg, rgb(71,36,120) 20%, rgb(163,146,188) 32%, rgb(255,255,255) 44%);
    background-image: -webkit-linear-gradient( 0deg, rgb(71,36,120) 15%, rgb(163,146,188) 27%, rgb(255,255,255) 45%);
    background-image: -ms-linear-gradient( 0deg, rgb(71,36,120) 20%, rgb(163,146,188) 32%, rgb(255,255,255) 44%);
    box-shadow: 0px 35px 46px 0px rgba(0, 0, 0, 0.58);
}

.img2 {
    position: absolute;
    right: 100%;
    top: 0;
    height: 100%;
}

/*StepBg*/

.stepBoxinner {

}


.stepBg1 {
    background-color: #8c53ff;
    text-transform: uppercase;
    display: inline-block;
    padding: 1.5% 3% 1.1% 3%;
    border-radius: 0px 12px 12px 12px;
    color: #fff;
}
.stepBg2 {
    background-color: #b021c7;
    text-transform: uppercase;
    display: inline-block;
    padding: 1.5% 3% 1.1% 3%;
    border-radius: 0px 12px 12px 12px;
    color: #fff;
}
.stepBg3 {
    background-color: #ff4489;
    text-transform: uppercase;
    display: inline-block;
    padding: 1.5% 3% 1.1% 3%;
    border-radius: 0px 12px 12px 12px;
    color: #fff;
}
.stepBg4 {
    background-color: #761eef;
    text-transform: uppercase;
    display: inline-block;
    padding: 1.5% 3% 1.1% 3%;
    border-radius: 0px 12px 12px 12px;
    color: #fff;
}

.stepimg {
    margin-top: -21%;
}

/*stepForm*/

.stepForm {
    margin: auto;
    padding: 0;
    margin-top: -4%;
    margin-bottom: -4%;
}
.stepForm2 {
    margin: auto;
    padding: 0;
    margin-top: -4%;
}
.stepForm3 {
    margin: auto;
    margin-top: 6%;
    margin-bottom: -4%;
}
.stepForm4 {
    padding: 0;
    margin: 8% 0 0% 0;
    margin-bottom: -4%;
}
.stepForm5 {
    margin: auto;
    margin-top: -3%;
    margin-bottom: -3%;
}


/*stepForm*/

.form {
    margin-top: 4%;
}



.form-box-main {
	filter: drop-shadow(0 21px 54px #00000042);
	position: relative;
	padding: 0;
}
.form-box-main-inn {
    border-radius: 17px;
    background-color: rgb(0 0 0);
    box-shadow: 0px 21px 54px 0px rgb(0 0 0 / 26%);
    padding: 1px;
    -webkit-clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 15%, 84% 0);
    clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 15%, 84% 0);
    position: relative;
    left: 0;
    z-index: 1;
}
.form-box-main-inn2{background-color: rgb(255, 255, 255);padding: 10% 6.8% 10% 6.8%;-webkit-clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 15%, 84% 0);clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 15%, 84% 0);border-radius: 17px;}


.bgLine1{
    position: absolute;
    bottom: -4%;
    right: -4%;
}



input.form-box {
    width: 100%;
    margin: 0% 0 1.5% 0;
    padding: 5.2% 6%;
    border-width: 1px;
    border-color: rgb(191, 192, 196);
    border-style: solid;
    border-radius: 6px;
    background-color: rgb(255, 255, 255);
    font-size: 15px;
    font-family: 'Sora', sans-serif;
}
input.submitBt {
    cursor: pointer;
    border: none;
    border-radius: 6px;
    background-color: rgb(255, 199, 0);
    color: #000;
    margin: 0 0 0 0;
    padding: 6.4% 15px;
    transition: .2s;
    outline: none;
    margin-top: 11%;
    text-transform: uppercase;
    transition-duration: 0.3s;
    display: inline-block;
    width: 98%;
}
input.submitBt:hover {
    box-shadow: 0px 11px 20px 2px rgb(0 0 0 / 18%);
    transform: scale(1.01);
    transition-duration: 0.3s;
}

/*Form-2*/

.form2 {
    margin-top: 8%;
}
.form-box-main2 {
	filter: drop-shadow(0 21px 54px #00000042);
	position: relative;
	padding: 0;
}
.form-box-main2-inn {
    border-radius: 17px;
    background-color: rgb(0 0 0);
    padding: 1px;
    -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 0%, 15% 0%, 00% 15%);
    clip-path: polygon(0% 100%, 100% 100%, 100% 0%, 15% 0%, 00% 15%);
    position: relative;
    z-index: 1;
}
.form-box-main2-inn2{background-color: rgb(255, 255, 255);padding: 11% 6.8% 11.5% 6.8%;-webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 0%, 15% 0%, 00% 15%);clip-path: polygon(0% 100%, 100% 100%, 100% 0%, 15% 0%, 00% 15%);border-radius: 17px;}

.bgLine2{
    position: absolute;
    bottom: -4%;
    left: -4%;
}



.form2-box-main {
	filter: drop-shadow(0 21px 54px #00000042);
	position: relative;
	padding: 0;
}
.form2-box-main-inn {
    border-radius: 17px;
    background-color: rgb(0 0 0);
    padding: 1px;
    -webkit-clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 32%, 87% 0);
    clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 32%, 87% 0);
    position: relative;
    z-index: 1;
}
.form2-box-main-inn2{background-color: rgb(255, 255, 255);padding: 8.7% 7.8% 8.7% 7.8%;-webkit-clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 32%, 87% 0);clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 32%, 87% 0);border-radius: 17px;}

.bgLine3{
    position: absolute;
    bottom: -9%;
    right: -4%;
}


input.form-box2 {
    width: 100%;
    margin: 0% 0 1.5% 0;
    padding: 5.2% 6%;
    border-width: 1px;
    border-color: rgb(191, 192, 196);
    border-style: solid;
    border-radius: 6px;
    background-color: rgb(255, 255, 255);
    font-size: 15px;
    font-family: 'Sora', sans-serif;
    color: #858585;
    outline: none !important;
}
input.submitBt2 {
    cursor: pointer;
    border: none;
    border-radius: 6px;
    background-color: rgb(255, 199, 0);
    color: #000;
    margin: 0 0 0 0;
    padding: 7.5% 15px;
    transition: .2s;
    outline: none;
    margin-top: 3px;
    text-transform: uppercase;
    transition-duration: 0.3s;
    display: inline-block;
    width: 97%;
}
button.submitBt2 {
    cursor: pointer;
    border: none;
    border-radius: 6px;
    background-color: rgb(129 70 213);
    color: #fff;
    margin: 0 0 0 0;
    padding: 5% 15px;
    transition: .2s;
    outline: none;
    margin-top: 3px;
    text-transform: uppercase;
    transition-duration: 0.3s;
    display: inline-block;
    width: 98.5%;
    background-image: -webkit-linear-gradient( 0deg, rgb(168,82,218) 0%, rgb(93,59,208) 100%);
}
button.submitBt6 {
    cursor: pointer;
    border: none;
    border-radius: 6px;
    background-color: rgb(129 70 213);
    color: #fff;
    margin: 0 0 0 0;
    padding: 2% 5px;
    transition: .2s;
    outline: none;
    margin-top: 0;
    transition-duration: 0.3s;
    display: inline-block;
    width: 31%;
    border: 1px solid #d1d1d1;
    background-image: -webkit-linear-gradient( 0deg, rgb(168,82,218) 0%, rgb(93,59,208) 100%);
}

button.submitBt6:hover {
	box-shadow: 0px 11px 20px 2px rgb(0 0 0 / 18%);
    transform: scale(1.01);
    transition-duration: 0.3s;
}

input.submitBt2:hover, button.submitBt2:hover {
    box-shadow: 0px 11px 20px 2px rgb(0 0 0 / 18%);
    transform: scale(1.01);
    transition-duration: 0.3s;
}

.affiliateText {
    text-align: left;
    border-width: 1px;
    border-color: rgb(191, 192, 196);
    border-style: solid;
    border-radius: 6px;
    background-color: rgb(255, 255, 255);
    font-weight: 600;
    padding: 1.9% 4%;
    line-height: 160%;
    font-style: italic;
    color: #858585;
    width: 100%;
    margin-top: 0;
    margin-bottom: 0;
    white-space: nowrap;
    overflow: hidden;
}

.copy-left{
    width: 100%;
}
.copy-right{
    width: 100%;
    margin-top: 2%;
}






.submitBt2:disabled,
.submitBt2[disabled]{
     cursor: context-menu;
}

.submitBt2:disabled:hover,
.submitBt2[disabled]:hover {
	box-shadow:none;
    transform: scale(1);
}



#myModal2{background-color: rgb(3 0 30 / 82%);}



#myModal2 .modal-content {
    text-align: center;
    border-radius: 19px;
    -webkit-clip-path: polygon(100% 87%, 100% 0%, 100% 0%, 0% 0%, 0% 270%);
    clip-path: polygon(100% 87%, 100% 0%, 100% 0%, 0% 0%, 0% 270%);
    filter: drop-shadow(0 21px 54px #00000042);
    background-color: transparent;
}
#myModal2 .modal-body{padding: 0;background-color: transparent;}
#myModal2 .modal-body-inn{
	-webkit-clip-path: polygon(100% 87%, 100% 0%, 100% 0%, 0% 0%, 0% 270%);
	clip-path: polygon(100% 87%, 100% 0%, 100% 0%, 0% 0%, 0% 270%);
	padding: 0 4px 4px 4px;
	border-radius: 0 0 0 19px;
	background: linear-gradient(#ffffff00 7%, #9f1cb5 0%);
}
#myModal2 .modal-body-inn2{
    padding: 6.5% 4% 4% 4%;
    -webkit-clip-path: polygon(100% 87%, 100% 0%, 100% 0%, 0% 0%, 0% 270%);
    clip-path: polygon(100% 87%, 100% 0%, 100% 0%, 0% 0%, 0% 270%);
    background: url(../images/modelBg.png) no-repeat center top;
    background-size: cover;
    border-radius: 0 0 0 19px;
}





/*3*/

.form3-box-main{
	border-width: 1px;
	border-color: rgb(0, 0, 0);
	border-style: solid;
	border-radius: 20px;
	background-color: rgb(255, 255, 255);
	box-shadow: 0px 15px 65px 0px rgba(49, 20, 86, 0.58);
	padding: 5.7% 6% 7% 6%;
	position: relative;
	z-index: 1;
}

.submitBt3 a {
    cursor: pointer;
    border: none;
    border-radius: 6px;
    background-color: #4edb9b;
    color: #000;
    margin: 0 0 0 0;
    padding: 5.3% 15px;
    transition: .2s;
    outline: none;
    margin-top: 5%;
    text-transform: uppercase;
    transition-duration: 0.3s;
    display: inline-block;
    width: 100%;
}
.submitBt3 a:hover {
    box-shadow: 0px 11px 20px 2px rgb(0 0 0 / 18%);
    transform: scale(1.01);
    transition-duration: 0.3s;
}

/*Bt4*/

.submitBt4 a {
    cursor: pointer;
    border: none;
    border-radius: 6px;
    background-color: rgb(255, 199, 0);
    color: #000;
    margin: 0 0 0 0;
    padding: 4.6% 5px;
    transition: .2s;
    outline: none;
    margin-top: 3%;
    text-transform: uppercase;
    transition-duration: 0.3s;
    display: inline-block;
    width: 85%;
}
.submitBt4 a:hover {
    box-shadow: 0px 11px 20px 2px rgb(0 0 0 / 18%);
    transform: scale(1.01);
    transition-duration: 0.3s;
}

/*StepVideo*/

.stepVideo {
    margin-top: -4%;
    padding: 0;
}

.bgLine4{
    position: absolute;
    bottom: -6%;
    right: -3.5%;
}

.facebookBox {
    border-width: 1px;
    border-color: rgb(0, 0, 0);
    border-style: solid;
    border-radius: 10px;
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 21px 54px 0px rgb(0 0 0 / 26%);
    padding: 7% 5% 9% 5%;
}

.bgLine5{
    position: absolute;
    bottom: -3%;
    right: -3.5%;
}



/*Bt4*/

i.fa.fa-facebook-square {
    font-size: 22px;
    color: #fff;
    margin: 0px 10px 0 0;
    position: relative;
    top: 2px;
}
.submitBt5 button {
    cursor: pointer;
    border: none;
    border-radius: 6px;
    background-color: rgb(0, 118, 251);
    color: #fff;
    padding: 5% 5px;
    transition: .2s;
    outline: none;
    margin-top: -2%;
    text-transform: uppercase;
    transition-duration: 0.3s;
    display: inline-block;
    width: 85%;
}
.submitBt5 button:hover {
    box-shadow: 0px 11px 20px 2px rgb(0 0 0 / 18%);
    transform: scale(1.01);
    transition-duration: 0.3s;
}


.bgLine6 {
    position: absolute;
    bottom: -4%;
    left: -3%;
}


.connection1 {
    margin-top: 2.5%;
    margin-bottom: 2.5%;
}
.connection2{margin-top: 2.5%;margin-bottom: 2.5%;}
.connection3{margin-top: -1%;}

#myModal{background-color: rgb(3 0 30 / 82%);}



#myModal .modal-content {
    text-align: center;
    border-radius: 19px;
    -webkit-clip-path: polygon(100% 87%, 100% 0%, 100% 0%, 0% 0%, 0% 270%);
    clip-path: polygon(100% 87%, 100% 0%, 100% 0%, 0% 0%, 0% 270%);
    filter: drop-shadow(0 21px 54px #00000042);
    background-color: transparent;
}
#myModal .modal-body{padding: 0;background-color: transparent;}
#myModal .modal-body-inn{
	-webkit-clip-path: polygon(100% 87%, 100% 0%, 100% 0%, 0% 0%, 0% 270%);
	clip-path: polygon(100% 87%, 100% 0%, 100% 0%, 0% 0%, 0% 270%);
	padding: 0 4px 4px 4px;
	border-radius: 0 0 0 19px;
	background: linear-gradient(#ffffff00 4%, #9f1cb5 0%);
}
#myModal .modal-body-inn2{
    padding: 8.2% 2% 6% 2%;
    -webkit-clip-path: polygon(100% 87%, 100% 0%, 100% 0%, 0% 0%, 0% 270%);
    clip-path: polygon(100% 87%, 100% 0%, 100% 0%, 0% 0%, 0% 270%);
    background: url(../images/modelBg.png) no-repeat center top;
    background-size: cover;
    border-radius: 0 0 0 19px;
}

#myModal .modal-box{
    width: 16%;
    margin-top: 4%;
    position: relative;
}
.img-box{
    background: linear-gradient(to left, #dca9cd, #7e3ae1);
    width: 76%;
    height: auto;
    padding: 2px;
    margin: auto;
    margin-top: 9%;
    box-shadow: inset 6px 11px 3px 0px rgb(0 0 0 / 55%);
    border-radius: 50%;
    display: inline-block;
    position: relative;
    z-index: 1;
}
.img-box-inn{
	box-shadow: inset 6px 11px 3px 0px rgb(0 0 0 / 55%);
	border-radius: 50%;
	display: inline-block;
	position: relative;
	overflow: hidden;
}
.img-box .adeel-img{
    position: relative;
    z-index: -1;
    border-radius: 50%;
	transition: transform .2s; /* Animation */
}
.social-btn{
    text-transform: uppercase;
    border-radius: 6px;
    background-color: rgb(105, 139, 236);
    box-shadow: 0px 6px 27px 0px rgba(0, 0, 0, 0.19);
    color: #fff;
    padding: 4.6% 14.5%;
    display: inline-block;
    margin-top: 12%;
}
.social-btn:hover{
    color: #fff;
    box-shadow: 0px 11px 20px 2px rgb(0 0 0 / 18%);
    transform: scale(1.05);
    transition-duration: 0.3s;
    background-color: rgb(85 123 231);
}
.adeel-icon {
    position: absolute;
    top: 90%;
    left: 50%;
    transform: translate(-50%, -90%);
}

#myModal .modal-box:hover .adeel-img{transform: scale(1.15);}


#myModal .modal-box:hover .adeel-icon{
	-webkit-animation: mover 0.5s infinite  alternate;
	animation: mover 0.5s infinite  alternate;
	top: 60%;
	left: 32%;
	transform: translate(-40%, -77%);
}

@-webkit-keyframes mover {
    0% { transform: translateY(0); }
    100% { transform: translateY(-5px); }
}
@keyframes mover {
    0% { transform: translateY(0); }
    100% { transform: translateY(-5px); }
}



/*section-4*/

.section4 {
    background: url(../images/section4bg.png) no-repeat center top;
    background-size: cover;
    padding: 21% 0% 0% 0%;
    margin-top: -16%;
    position:relative;
}
.inviteoshap {
    background: url(../images/inviteoshap.png) no-repeat center center;
    background-size: contain;
    padding: 12% 15% 8% 15%;
    position: relative;
}
.invitebox {
    position: absolute;
    left: 2.5%;
    top: 26%;
}

.ecoverPoster-out {
    padding: 0 2%;
    font-variant: slashed-zero;
    position: relative;
    z-index: 1;
}
.ecoverPoster {
    padding: 6% 15px 8% 15px;
    position: relative;
    background-color: #fff;
    box-shadow: 0px 75px 67px 0px rgb(0 0 0 / 19%);
}

.eposterTop{filter: drop-shadow(0px -13px 35px #00000030);}
.eposterBottom{filter: drop-shadow(34px 49px 30px #00000030);margin-top: -2px;}

.eposterTop, .eposterBottom {
    width: 100%;
    position: relative;
    /* z-index: 1; */
}

.section4-title {
    position: relative;
    margin-top: -4%;
}

.introsection h4{display: inline-flex;}

.introimg {margin-top: -1.2%;}

.icon-img {
    position: absolute;
    left: -1%;
    top: -1.5%;
}


/*section-5*/

.section5 {
    background: url(../images/section5bg.png) no-repeat center top;
    background-size: cover;
    padding: 19% 0% 7% 0%;
    margin-top: -11%;
    position: relative;
}
.millionText {
    margin: 0;
    padding: 0 13px 0 29px;
    margin-top: -30px;
}
.mokupimg1 {
    position: absolute;
    top: -8.5%;
    right: 0%;
    z-index: 1;
    animation: 2s ease-in-out 0s infinite alternate none running mover1;
}
.mokupimg2 {
    position: absolute;
    top: -5%;
    left: 0;
    z-index: 1;
    animation: 2s ease-in-out 0s infinite alternate none running mover2;
}
.trackicon1 {
    position: absolute;
    top: 18.5%;
    left: 7%;
}
.trackicon2 {
    position: absolute;
    top: 16%;
    right: 7%;
}
.invitebox1 {
    padding: 0 8% 0 15px;
}
.invitebox2 {
    padding: 0 15px 0 5%;
}

/*section-6*/

.section6 {
    background: url(../images/section6bg.png) no-repeat center top;
    background-size: cover;
    padding: 8% 0% 0% 0%;
    margin-top: -1px;
    margin-bottom: -2%;
    position: relative;
    z-index: 1;
}

.section6B {
    background: url(../images/section6B.png) no-repeat center bottom;
    background-size: cover;
    padding: 4% 0% 6% 0%;
    margin-top: -1px;
    overflow: hidden;
}

.introBox {
    position: relative;
}
.introicon1 {
    top: 17.5%;
    left: 8%;
    position: absolute;
    animation: 2s ease-in-out 0s infinite alternate none running mover1;
}
.introicon2 {
    top: 1.5%;
    right: 8%;
    position: absolute;
    animation: 2s ease-in-out 0s infinite alternate none running mover2;
}
.introBg {
    background-image: -webkit-linear-gradient( 0deg, rgb(231,187,39) 0%, rgb(255,86,153) 100%);
    box-shadow: -20.5px 35.507px 29px 0px rgb(255 255 255 / 19%), inset 0px 6px 3px 1px rgb(255 255 255 / 50%), inset 0px -6px 3px 1px rgb(0 0 0 / 50%);
    font-family: 'Caveat Brush', cursive;
    display: inline-block;
    padding: 1px 2.2% 5px 2.1%;
    border-radius: 35px;
    position: relative;
    z-index: 1;
}
.title3 {
    border-width: 2px;
    border-color: rgb(0, 0, 0);
    border-style: solid;
    border-radius: 50px;
    display: inline-block;
    text-transform: uppercase;
    padding: 0.8% 1.6% 0.7% 1.6%;
    margin-top: -5px;
}
.title4 {
    border-width: 1px;
    border-color: rgb(1, 5, 37);
    border-style: solid;
    border-radius: 8px;
    display: inline-block;
    padding: 0.7% 1.1%;
    margin-top: 1%;
    color: #010525;
}
.title5 {
    border-radius: 18px;
    background-color: rgb(255, 236, 133);
    display: inline-block;
    padding: 3px 1.9%;
    margin-top: 1%;
    color: #010525;
}




.checkBg {
    background-color: #46345f;
    box-shadow: 0px 24px 63.2px 15.8px rgb(0 0 0 / 8%);
    padding: 8% 6% 1% 2%;
    color: #fff;
    position:relative;
}

.checkBg-title{
	position: absolute;
	background-color:#9c6cdf;
	width: 100%;
	padding: 1% 4%;
	top: -4%;
	z-index: 1;
	left: -4%;
}


.shap1{
    position: absolute;
    right: 99.9%;
    top: 0;
    height: 100%;
}
.shap2{
    position: absolute;
    top: 0;
    left: 99.9%;
    height: 100%;
}
.shap3{
    position: absolute;
    width: 100%;
    left: 0;
    top: 99.9%;
}

.rectangleTop{position:absolute;bottom: 99%;width: 100%;left: 0;}
.rectangleBottom{position:absolute;top: 99%;width: 100%;left: 0;}


.checklist1 li {
    background: url(../images/checklist1.png) no-repeat left 2px;
    padding-left: 45px;
    padding-right: 0%;
    list-style: none;
    margin-left: 0%;
    padding-top: 0px;
    padding-bottom: 20px;
    margin-bottom: 10px;
    text-align: left;
}

.adilSideImage {
    position: absolute;
}

/*section-7*/

.section7 {
    background: url(../images/section7bg.png) no-repeat center top;
    background-size: cover;
    padding: 7% 0% 2% 0%;
    margin-top: -5%;
}

.section7-details{
}

.bottomline4 {
    background: url(../images/bottomline4.png) no-repeat center 85%;
    background-size: contain;
    padding: 0% 1.5% 0% 0.6%;
    margin: 0 0 0 0;
}
.bottomline5 {
    background: url(../images/bottomline5.png) no-repeat center bottom;
    background-size: contain;
    padding: 0% 0% 0% 0.5%;
    margin: 0 3px 0 0;
}
.poppingImg {
    position: relative;
    margin-bottom: -10%;
}

/*section-8*/

.section8 {
    background: url(../images/section8bg.png) no-repeat center top;
    background-size: cover;
    padding: 9% 0% 19% 0%;
    margin-top: -5%;
    position: relative;
    overflow: hidden;
}
.arrowtext {
    position: absolute;
    top: 35px;
    right: -7.5%;
    z-index: 5;
    overflow: hidden;
    font-family: 'Caveat', cursive;
}
.watchtext {
    width: 100%;
    height: 100px;
    -ms-transform: skewY(20deg);
    transform: skewY(12deg);
    margin: 4px 10px 0 0;
}
.watcharrow2 {
    position: absolute;
    top: 28%;
    right: 19%;
    z-index: 1;
}

.bottomline6 {
    background: url(../images/bottomline6.png) no-repeat center bottom;
    background-size: contain;
    padding: 0% 9px 0% 6px;
    margin: 0 0px 0px -5px;
}


.ele7 {
    position: absolute;
    bottom: -7.8%;
    right: 86.8%;
    z-index: 0;
}
.ele8 {
    position: absolute;
	animation: 2s ease-in-out 0s infinite alternate none running mover2;
}

@-webkit-keyframes mover1 {
    0% { transform: translateY(0); }
    100% { transform: translateY(10px); }
}
@keyframes mover1 {
    0% { transform: translateY(0); }
    100% { transform: translateY(15px); }
}
@-webkit-keyframes mover2 {
    0% { transform: translateY(10px); }
    100% { transform: translateY(0); }
}
@keyframes mover2 {
    0% { transform: translateY(15px); }
    100% { transform: translateY(0); }
}

.demo-btn {
    position: relative;
    z-index: 2;
    text-align: center;
    margin-top: 2%;
}

a.demo-btn1{
    cursor: pointer;
    border: none;
    border-radius: 6px;
    background-color: #4caf50;
    color: #fff;
    margin: 0 0 0 0;
    padding: 1% 2%;
    transition: .2s;
    outline: none;
    text-transform: uppercase;
    transition-duration: 0.3s;
    display: inline-block;
    font-size: 18px;
    font-weight: 600;
    margin: 1% 0.5%;
}
a.demo-btn1:hover{
	box-shadow: 0px 11px 20px 2px rgb(0 0 0 / 18%);
    transform: scale(1.01);
    transition-duration: 0.3s;
	background-color: #3e9341;
}

a.demo-btn2{
    cursor: pointer;
    border: none;
    border-radius: 6px;
    background-color: rgb(111 89 244);
    color: #fff;
    margin: 0 0 0 0;
    padding: 1% 2%;
    transition: .2s;
    outline: none;
    text-transform: uppercase;
    transition-duration: 0.3s;
    display: inline-block;
    font-size: 18px;
    font-weight: 600;
    margin: 1% 0.5%;
}
a.demo-btn2:hover{
	box-shadow: 0px 11px 20px 2px rgb(0 0 0 / 18%);
    transform: scale(1.01);
    transition-duration: 0.3s;
	background-color: rgb(100 81 218);
}

/*section-9*/
.section9 {
    background: url(../images/section9.png) no-repeat center top;
    background-size: cover;
    padding: 18% 0% 0 0%;
    margin-top: -21%;
    position: relative;
    z-index: 1;
}

.section9-text1 {
    background-image: linear-gradient( to top, #ffffff00, #ffffff00 5%, #c7b9ff 5%, #c7b9ff 55%, #ffffff00 55% );
    padding: 0 7px;
}
.section9-text2{
    background-image: linear-gradient( to top, #ffffff00, #ffffff00 5%, #ffc700 5%, #ffc700 55%, #ffffff00 55% );
    padding: 0 7px;
}

.checklist2-box{padding: 0 1.6%;}
.checklist2 li {
    border-width: 1px;
    border-color: rgb(226, 226, 226);
    border-style: solid;
    border-radius: 6px;
    padding: 5.9% 11%;
    margin: 13% 0;
    transition-duration: 0.3s;
}
.checklist2 li:hover {
    transform: scale(1.05);
    transition-duration: 0.3s;
}
.checklist2 li span{
    background: url(../images/checklist2.png) no-repeat left 4px;
    padding-left: 37px;
    padding-right: 0%;
    list-style: none;
    margin-left: 0%;
    padding-top: 3%;
    padding-bottom: 3%;
    margin-bottom: 10px;
    text-align: left;
    color:#192033;
}

.checklist2B li {
    border-width: 1px;
    border-color: rgb(226, 226, 226);
    border-style: solid;
    border-radius: 6px;
    padding: 2.8% 5.4%;
    margin: 0;
    display: inline-block;
}
.checklist2B li span{
    background: url(../images/checklist2.png) no-repeat left 8px;
    padding-left: 37px;
    padding-right: 0%;
    list-style: none;
    margin-left: 0%;
    padding-top: 4%;
    padding-bottom: 4%;
    margin-bottom: 10px;
    text-align: left;
    color:#192033;
}

.attention {
    position: relative;
}

/*section-10*/
.section10 {
    background: url(../images/section10.png) no-repeat center top;
    background-size: cover;
    padding: 17% 0% 20% 0%;
    margin-top: -1%;
    position: relative;
    z-index: 2;
}

.step1-detail{
    border-left: 2px solid #ffc700;
    border-bottom: 2px solid #ffc700;
    padding: 0% 9.3% 2.5% 2.5%;
    margin-top: 2%;
	position:relative;
}
.step-title {
    border-radius: 6px;
    background-color: rgb(255, 199, 0);
    display: inline-block;
    padding: 1.7% 6.4%;
    margin-top: -7%;
	position: relative;
}
.step1-detail .step-title:before {
	content: "";
	display: block;
	width: 36px;
	height: 2px;
	background: #ffc700;
	right: 100%;
	top: 50%;
	position: absolute;
}
.step-detail h2{
    margin-top: 7%;
}
.step-detail p{
    margin-top: 4%;
}

.stepArrow1 {
    position: absolute;
    top: 97%;
    right: -1%;
}

.step2-detail {
    border-right: 2px solid #ffc700;
    border-bottom: 2px solid #ffc700;
    padding: 0% 2.5% 2.5% 9.3%;
    margin-top: 2%;
    position: relative;
    text-align: right;
}
.step2-detail .step-title:after {
	content: "";
	display: block;
	width: 36px;
	height: 2px;
	background: #ffc700;
	left: 100%;
	top: 50%;
	position: absolute;
}


.stepArrow2 {
    position: absolute;
    top: 97%;
    left: -1%;
}

.step1-vid{width:92%;}
.step3-vid{width:90%;}


/*section-11*/
.section11 {
    background: url(../images/section11.png) no-repeat center top;
    background-size: cover;
    padding: 14% 0% 0% 0%;
    margin-top: -17%;
    position: relative;
    z-index: 1;
}


.bottomline7 {
    background: url(../images/bottomline7.png) no-repeat center 45px;
    background-size: contain;
    padding: 0% 0% 0% 0.3%;
}

.iMac {
    position: absolute;
    top: 1.5%;
    right: 0;
}
.handimg {
    position: absolute;
    left: 0;
    top: 6.5%;
}
.insideimgBox {
    position: relative;
}


.checklist5 li {
    background: url(../images/checklist5.png) no-repeat left 9px;
    padding-left: 34px;
    list-style: none;
    margin-left: 0px;
    padding-top: 0;
    padding-bottom: 0;
    margin-top: 3%;
    padding-right: 0;
    text-align: left;
}


/* left line after text*/
.insideimgBox::before {
    content: '';
    position: absolute;
    border-left: 2px dashed rgb(231, 231, 231);
    width: 1px;
    height: 122%;
    top: 50%;
    right: -11.9%;
}
/*.insideimgBox::before {
    border-left: 1px dashed rgb(0 0 0);
    display: block;
    height: 100%;
    content: " ";
    position: absolute;
    width: 100%;
    left: 111.8%;
    top: 51%;
}*/

.section11-inn {
    background: url(../images/insideBg.png) no-repeat center top;
    background-size: cover;
    padding: 3.5% 0 10.5% 0;
    margin-top: 4%;
}

.section11-box{margin-top: 8%;}

.inside-box1{
    padding: 0 15px 0 3%;
}
.arrowIcon{
    position: absolute;
    left: -12%;
    top: 30%;
    z-index: 1;
}
.inside-box1 h4{
    margin-top: 4%;
}
.inside-box1 p{
    color:#6b6b6b;
    margin-top: 4%;
}

.inside1, .inside3, .inside8, .inside9{border-radius: 18px;width:100%;}


.section11-slide-box {
    background-image: linear-gradient(to right, #afb5ff , #a0d2ff);
    padding: 5%;
    border-radius: 15px;
}

.slider1 {
  position: relative;
  width: 100%;
  top: 0;
  overflow: hidden;
}
.slider1 .slider-row {
  width: 974px;
  height: 178px;
  background-image: url(../images/slider1.gif);
  background-size: 974px 178px;
  animation: slide1 30s linear infinite;
  background-repeat: repeat-x;
}

@keyframes slide1 {
  from {
    background-position-x: 0;
  }
  to {
    background-position-x: -974px;
  }
}	

.slider2 {
    position: relative;
    width: 100%;
    top: 0;
    overflow: hidden;
    margin-top: 2%;
}
.slider2 .slider-row {
  width: 974px;
  height: 178px;
  background-image: url(../images/slider2.gif);
  background-size: 974px 178px;
  animation: slide2 30s linear infinite;
  background-repeat: repeat-x;
}

@keyframes slide2 {
  from {
    background-position-x: -974px;
  }
  to {
    background-position-x: 0;
  }
}	

.slider-img{visibility:hidden;}


/*section-12*/
.section12 {
    background: url(../images/section12.png) no-repeat center top;
    background-size: cover;
    padding: 1.5% 0% 8% 0%;
    margin-top: -7.5%;
    position: relative;
    z-index: 1;
}

.bonus-detail{
    padding: 0 2%;
}
.bonus-title{
    background-image: -moz-linear-gradient( 0deg, rgb(231,187,39) 0%, rgb(243,137,96) 41%, rgb(255,86,153) 100%);
    background-image: -webkit-linear-gradient( 0deg, rgb(231,187,39) 0%, rgb(243,137,96) 41%, rgb(255,86,153) 100%);
    background-image: -ms-linear-gradient( 0deg, rgb(231,187,39) 0%, rgb(243,137,96) 41%, rgb(255,86,153) 100%);
    display: inline-block;
    color: #fff;
    padding: 3.2% 8.9%;
    border-radius: 50px;
    text-transform: uppercase;
}
.bonus-detail h3{
    margin-top: 7%;
}
.bonus-detail p{
    color: #b4b4b4;
    margin-top: 5%;
}

/*section-13*/
.section13 {
    background: url(../images/section13.png) no-repeat center top;
    background-size: cover;
    padding: 14% 0% 6% 0%;
    margin-top: -11.8%;
    position: relative;
    z-index: 1;
}

.section13-title {
    background: url(../images/textBg.png) no-repeat center center;
    background-size: contain;
    padding: 8% 15px;
    color: #fff;
    position: relative;
}
.trophy1 {
    position: absolute;
    left: 17%;
    top: 17%;
}
.launch-detail {
    padding: 0 5% 0 1%;
}

.checkText {
    padding: 0 7% 0 7%;
}


.roktimg1 {
    position: absolute;
    top: 15%;
    left: 90%;
    animation: 2s ease-in-out 0s infinite alternate none running mover1;
    transition-duration: 0.7s;
}

.section13:hover .roktimg1 {
    top: -10%;
    left: 90%;
    transition-duration: 0.5s;
} 

/*Rokit Animation*/

.section13-title:hover > .roktimg1:nth-child(3n) {
  animation-name: shake-1;
}
.section13-title:hover > .roktimg1:nth-child(3n + 1) {
  animation-name: shake-2;
}
.section13-title:hover > .roktimg1:nth-child(3n + 2) {
  animation-name: shake-3;
}

@keyframes shake-1 {
  0% {
    transform: translate(1px, -2px) rotate(-1deg);
  }
  10% {
    transform: translate(-1px, 2px) rotate(-1deg);
  }
  20% {
    transform: translate(1px, 2px) rotate(0deg);
  }
  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(-3px, 0px) rotate(1deg);
  }
  100% {
    transform: translate(1px, 1px) rotate(0deg);
  }
}

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

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



/*section-14*/
.section14 {
    background: url(../images/section14.png) no-repeat center top;
    background-size: cover;
    padding: 0% 0% 5% 0%;
    margin-top: 0%;
    position: relative;
    z-index: 1;
    max-width: 96%;
    margin: auto;
    border-radius: 50px;
    background-color: #210061;	
}
.trophy2 {
    position: absolute;
    top: -2.5%;
    right: 5%;
}
.placeShap1 {
    background: url(../images/placeShap1.png) no-repeat center top;
    background-size: cover;
    padding: 6% 9% 3% 9%;
}
.placeText {
    margin-top: -2%;
    transition-duration: 0.3s;
}
.section14:hover .placeText {
  transform: scale(1.05);
  transition-duration: 0.3s;
}

.bundleText {
    margin-top: 0.8%;
    transform: rotate(-3deg);
}

.placeimg1{margin-top: -3%;}


.bundleBg {
    border-radius: 24px;
    background-color: hsl(265deg 79% 56% / 10%);
    box-shadow: 0px 25px 46.44px 7.56px rgb(4 8 7 / 10%);
    max-width: 79.4%;
    margin: auto;
    padding: 2.2% 9.1% 2.2% 9.1%;
    margin-top: -2.5%;
}
.iPhone13Text {
    color: #efe4ff;
}
.placeBox {
    padding: 0 9.3%;
}
.placeBg2 {
    background: url(../images/placeBg2.png) no-repeat center top;
    background-size: cover;
    padding: 6% 9% 3% 9%;
}
.placeShapover-Box {
    background: url(../images/placeShap2.png) no-repeat center top;
    background-size: cover;
    padding: 3% 0% 0% 6%;
    border-radius: 15px;
    background-color: rgb(71, 42, 147);
}

.placeShap2 {
    padding: 0 2.4%;
}
.placeTextshap2 {
    background: url(../images/placeTextshap.png) no-repeat center top;
    background-size: cover;
    padding: 2.5% 6% 1% 6%;
}
.placeTextshap10 {
    background: url(../images/placeTextshap.png) no-repeat center top;
    background-size: cover;
    padding: 2.5% 3% 3% 4%;
}
.placeTextinner {
    font-size: 64px;
    margin: 0 0 40px -18%;
}
.placeimage {
    margin: 7.3% -15px 0px 0px;
}
.placeimage6 {
    margin-top: 5.5%;
}
.placeimage10 {
    max-width: 122%;
    margin: 13px 0 0 -25px;
}



/*section-15*/
.section15 {
    background: url(../images/section15.png) no-repeat center top;
    background-size: cover;
    padding: 32% 0% 5% 0%;
    margin-top: -26%;
    position: relative;
    z-index: 0;
}
.salesPg {
    padding: 0 2%;
    margin-top: 5%;
}
.otomainBox {
    padding: 0 6.5%;
    margin-top: 5%;
}
.otoBox {
    padding: 0px 1.7%;
    position: relative;
    transition-duration: 0.3s;
}
.otoBoxhidsw1 {
    display: none;
}
.oToText {
    color: #ff5c24;
}
.otorow {
    padding-top: 5%;
}

.otShap {
    background: url(../images/otShap.png) no-repeat center top;
    background-size: contain;
    padding: 0px 22px 0px 8px;
    color:  #381578;
}

.otoBg1 {
    background: url(../images/otoBg1.png) no-repeat center top;
    background-size: cover;
    padding: 10% 10% 20% 10%;
    border-radius: 14px;
}
.otoBg2 {
    background: url(../images/otoBg2.png) no-repeat center top;
    background-size: cover;
    padding: 10% 10% 16% 10%;
    border-radius: 14px;
}
.otoBg3 {
    background: url(../images/otoBg3.png) no-repeat center top;
    background-size: cover;
    padding: 10% 10% 12.8% 10%;
    border-radius: 14px;
}
.otoBg4 {
    background: url(../images/otoBg4.png) no-repeat center top;
    background-size: cover;
    padding: 10% 10% 10.5% 10%;
    border-radius: 14px;
}
.otoBg5 {
    background: url(../images/otoBg5.png) no-repeat center top;
    background-size: cover;
    padding: 10% 10% 16% 10%;
    border-radius: 14px;
}
.otoBg6 {
    background: url(../images/otoBg6.png) no-repeat center top;
    background-size: cover;
    padding: 10% 10% 12.8% 10%;
    border-radius: 14px;
}
.bunddleBox > .text-wrapper {
    margin-bottom: 30px;
}
.dual-badge {
    background: url(../images/dual-badge.png) no-repeat center top;
    background-size: 100% 100%;
    padding: 0px 30px 0px 30px;
    color: #381578;
}
.cover-vid {
    max-width: 100%;
    height: auto;
}
.bunddleBox {
    padding: 30px;
    border: 5px solid rgb(255, 188, 44);
    border-radius: 30px;
}
.oto-box-image {
    width: 280px;
    height: 270px;
    object-fit: contain;
}
@media (max-width: 999px) {
    .otomainBox.bundleOffer.newSection {
        margin-top: 10%;
    }
}
@media(max-width: 767px) {
    .text-wrapper.inner-text {
        margin-top: 50px;
    }
}
@media (max-width: 575px) {
    .otomainBox.bundleOffer.newSection {
        margin-top: 6%;
    }
    .bunddleBox {
        padding: 20px 15px;
    }
}
@media(max-width:1899px){
    .oto-box-image {
        width: 250px;
        height: 240px;
    }
}
@media(max-width:1399px){
    .oto-box-image {
        width: 240px;
        height: 235px;
    }
}
@media(max-width:1299px){
    .oto-box-image {
        width: 220px;
        height: 220px;
    }
}
@media(max-width:1199px){
    .oto-box-image {
        width: 200px;
        height: 200px;
    }
}
@media(max-width:1099px){
    .oto-box-image {
        width: 190px;
        height: 190px;
    }
}
@media(max-width:991px){
    .oto-box-image {
        width: 170px;
        height: 150px;
    }
}
@media(max-width:767px){
    .oto-box-image {
        width: 100%;
        max-height: 490px;
        height: auto;
    }
}
@media(max-width:575.98px){
    .oto-box-image {
        max-height: 300px;
    }
}
@media(max-width:425.98px){
    .oto-box-image {
        max-height: 200px;
    }
}
.otoimg1 {
    margin: 40px 0 -115px 0;
}
.otoimg2 {
    margin: 0px 0 -90px 0;
}
.otoimg3 {
    margin: 10px 0 -88px 0;
}
.otoimg4 {
    margin: 10px 0 -83px 0;
}
.otoimg5 {
    margin: 10px 0 -103px 0;
}
.otoimg6 {
    margin: 10px 0 -91px 0;
}

/*Arrow*/

.otoarrow1 {
    position: absolute;
    top: 10%;
    right: -3%;
    z-index: 1;
}
.otoarrow2 {
    position: absolute;
    top: 10%;
    right: -3%;
    z-index: 1;
}
.otoarrow3 {
    position: absolute;
    bottom: -9%;
    right: 10%;
    z-index: 1;
}
.otoarrow4 {
    position: absolute;
    top: 4%;
    right: -12%;
    z-index: 1;
}
.otoarrow5 {
    position: absolute;
    top: 4%;
    right: -12%;
    z-index: 1;
}


/*section-16*/
.section16 {
    background: url(../images/section16.png) no-repeat center top;
    background-size: cover;
    padding: 15% 0% 8% 0%;
    margin-top: -4%;
    position: relative;
    z-index: 3;
}
.aboutArrow1 {
    position: absolute;
    left: 29%;
    top: 80%;
}
.aboutArrow2 {
    position: absolute;
    right: 29%;
    top: 80%;
}

.sd1 {
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 38px 68px 0px rgb(0 0 0 / 39%);
    border-radius: 12px;
}

/*VIDEO-12*/

.about-video {
    border-radius: 31px;
    background-color: hsl(294deg 100% 76% / 5%);
    padding: 1% 1%;
    margin-top: 3%;
}

.about-video-inn{
    padding: 15px;
}

.about-responsive {
    border-width: 5px;
    border-color: rgb(255, 188, 44);
    border-style: solid;
    border-radius: 20px;
    background-color: rgb(85, 19, 140);
    box-shadow: 0px 38px 49px 0px rgb(0 0 0 / 35%);
}

.proofBg {
    background-color: rgb(226, 40, 40);
    display: inline-block;
    padding: 11.5px 2.4%;
    border-radius: 50px;
}


/*slider */

.swiper2 {padding: 6% 0;}

.swiper2 > .swiper-slide__content {
  position: absolute;
  top: 0;
}

.swiper2 .swiper-slide {
  /* height: 300px; */
  /* display: flex; */
  /* background: #eee; */
  /* align-items: center; */
  justify-content: center;
  transition: all 200ms linear;
  transform: scale(1);
}
.swiper2 .swiper-slide.swiper-slide-active {
  transform: scale(1.25);
  /* background: #fc0; */
  z-index: 1;
}

.swiper2 .swiper-slide__content {

}

.swiper2 .swiper-pagination-bullet {background: #fff;}

.swiper2 .swiper-pagination-bullet-active {background: #e22828;}

.swiper2 .swiper-button-next, .swiper-button-prev {
    top: 44%;
    background-color: #000000a3;
    width: 40px;
    height: 50px;
    background-image: none;
    text-align: center;
    color: #fff;
    font-size: 31px;
    padding: 9px 0;
}



/*slider title*/

.create-title {
    text-align: center;
    color: #e1e1e1;
    margin-top:3%;
    margin-bottom:4%;
}
 .create-title {
    color:#fff; 
    bottom:0;
    position: relative;
}
.create-title {
    color: #ffffff;
}
.create-title {
    color:#fff; 
    bottom:0;
}



/*section-17*/
.section17 {
    background: url(../images/section17.png) no-repeat center top;
    background-size: cover;
    padding: 16% 0% 1% 0%;
    margin-top: -10%;
    position: relative;
}
.dominimg {
    transition-duration: 0.3s;
    position: relative;
    z-index: 1;
}
.dominimg:hover {
    transform: scale(1.03);
    transition-duration: 0.3s;
}
.sinceBg { 
    border-radius: 22px;
    background-color: hsl(0deg 0% 85% / 12%);
    display: inline-block;
    padding: 5px 19px;
    border-radius: 30px;
}
.section17pg {
    color: #d9d9d9;
    padding: 0 9%;
}
.dominBox {
    padding: 0 3%;
    margin: 0;
    position: relative;
    z-index: 2;
}
.domtop {
    padding-top: 2.5%;
    position: relative;
    z-index: 1;
}


.adilSideImage2{
	position:absolute;
	bottom: 4.9%;
}


/*section-18*/
.section18 {
    background: url(../images/section18.png) no-repeat center top;
    background-size: cover;
    padding: 18% 0% 10% 0%;
    margin-top: -11%;
    position: relative;
    z-index: 1;
}
.hundredBg {
    background: url(../images/hundredBg.png) no-repeat center top;
    background-size: cover;
    padding: 5% 6% 6% 6.5%;
}


/*section-19*/
.section19 {
    background: url(../images/section19.png) no-repeat center top;
    background-size: cover;
    padding: 0% 0% 2% 0%;
    margin-top: -8%;
}
.information-Box {
    padding: 0 3.5%;
    position: relative;
    z-index: 99;
}
.information-Box-inner {
    background-image: -webkit-linear-gradient( -90deg, hsl(221deg 90% 96% / 78%) 0%, hsl(259deg 89% 96%) 100%);
    border-left: 9px solid hsl(278deg 36% 81%);
    padding: 4% 6% 1% 6%;
}
.bottomline8 {
    background: url(../images/bottomline8.png) no-repeat center 40px;
    background-size: contain;
    padding: 0% 0% 0% 0.3%;
    margin: 0 8px 0 0;
}
.checklist4 li {
    background: url(../images/checklist4.png) no-repeat left 3px;
    padding-left: 45px;
    padding-right: 0%;
    list-style: none;
    margin-left: 0%;
    padding-top: 0px;
    padding-bottom: 20px;
    margin-bottom: 10px;
    text-align: left;
}


/*section-20*/
.section20 {
    background: url(../images/section20.png) no-repeat center top;
    background-size: cover;
    padding: 3% 0% 10% 0%;;
    position: relative;
    z-index: 0;
}
.queBox {
    padding: 0 3.5%;
    position: relative;
    z-index: 2;
}
.queBox-inner {
    border-left: 9px solid hsl(278deg 36% 81%);
    padding: 0 2%;
}

.queBox p{padding: 0;}


.queimg1 {
    margin-top: -13%;
	position:relative;
}
.adBox2 {
    margin: 6% 0 0 -6.5%;
    padding: 0;
	text-align:right;
}

.queicon1 {
    position: absolute;
    top: 30%;
    left: 4%;
    z-index: 1;
    animation: 2s ease-in-out 0s infinite alternate none running mover1;
}
.queicon2 {
    position: absolute;
    top: 42%;
    left: 22%;
    z-index: 1;
    animation: 2s ease-in-out 0s infinite alternate none running mover2;
}
.queicon3 {
    position: absolute;
    top: 18%;
    right: 35%;
    z-index: 1;
    animation: 2s ease-in-out 0s infinite alternate none running mover1;
}



.queicon4 {
    position: absolute;
    top: 32%;
    right: 5%;
    z-index: 1;
    animation: 2s ease-in-out 0s infinite alternate none running mover2;
}

.need1{background-color: rgb(255, 199, 0);display:inline-block;border-radius: 50px;padding: 0.5% 2.3% 0.5% .5%;position:relative;z-index:1;color: #000;}
.need2{background-color: rgb(43, 95, 191);display:inline-block;border-radius: 50px;padding: 0.5% 4.3% 0.5% .5%;color: #fff;position:relative;z-index:1;}
.skype-bg .need2 {
    background-color: rgb(0 132 255);
}
.need1:hover{
    color: #000;
    background-color: rgb(245 175 2);
}
.need2:hover{
    background-color: rgb(20 100 219);
    color: #fff;
}
.skype-bg .need2:hover {
    background-color: rgb(0 132 255);
}
.need-icon{
    position: relative;
    margin-right: 8px;
}

.need2-icon{margin-left: 4px;}


/*section-21*/
.section21 {
    background: url(../images/section21.png) no-repeat center top;
    background-size: cover;
    padding: 7% 0% 4% 0%;
    margin-top: -6%;
    position: relative;
    z-index: 0;
}
.section21Box {
    padding: 0 14%;
}
.section21Box a {
    display: inline;
    margin: 0 3px;
    color: #aba5b4;
}
.section21Box a:hover {
    color: #fff;
}

iframe.video-frame.slidervdo {
    width: 100%;
    height: 83%;
    margin-top: 0%;
    /* border: 5px solid #fff; */
    background-color: #fff;
    /* overflow: hidden; */
    box-shadow: 0px 38px 68px 0px rgb(0 0 0 / 39%);
    border-radius: 12px;
}

/*marque Slider HOVER STOP*/
.parent .child:hover {
    -webkit-animation-play-state: paused;
    -moz-animation-play-state: paused;
    -o-animation-play-state: paused;
    animation-play-state: paused;
}

.tropy {
    margin: 0;
    position: relative;
    margin-left: -13%;
}

.tropy , .trophy1 , .trophy2 {
  animation: tada-wait2 3.6s linear infinite;
}
@keyframes tada-wait2 {
  0% { transform: scale(1) }
  5.55556% { transform:scale(.9) rotate(-8deg) }
  11.11111% { transform:scale(.9) rotate(-8deg) }
  16.66667% { transform:scale(1.1) rotate(8deg) }
  22.22222% { transform:scale(1.1) rotate(-8deg) }
  27.77778% { transform:scale(1.1) rotate(8deg) }
  33.33333% { transform:scale(1.1) rotate(-8deg) }
  38.88889% { transform:scale(1.1) rotate(8deg) }
  44.44444% { transform:scale(1) rotate(0) }
  100% { transform:scale(1) rotate(0) }
}

@keyframes tada-wait1 {
  0% { transform: scale(1) }
  5.55556% { transform:scale(.95) rotate(-4deg) }
  11.11111% { transform:scale(.95) rotate(-4deg) }
  16.66667% { transform:scale(1.01) rotate(4deg) }
  22.22222% { transform:scale(1.01) rotate(-4deg) }
  27.77778% { transform:scale(1.01) rotate(4deg) }
  33.33333% { transform:scale(1.01) rotate(-4deg) }
  38.88889% { transform:scale(1.01) rotate(4deg) }
  44.44444% { transform:scale(1) rotate(0) }
  100% { transform:scale(1) rotate(0) }
}

.invitebox {
  animation: shake-wait2 3.875s ease infinite;
}
@keyframes shake-wait2 {
  0% { transform:rotate(-12deg) }
  5.16129% { transform:rotate(12deg) }
  6.45161% { transform:rotate(24deg) }
  11.6129% { transform:rotate(-24deg) }
  12.90323% { transform:rotate(-24deg) }
  18.06451% { transform:rotate(24deg) }
  19.35484% { transform:rotate(24deg) }
  24.51613% { transform:rotate(-24deg) }
  25.80645% { transform:rotate(-24deg) }
  30.96774% { transform:rotate(24deg) }
  32.25807% { transform:rotate(24deg) }
  37.41935% { transform:rotate(-24deg) }
  38.70968% { transform:rotate(-24deg) }
  43.87097% { transform:rotate(24deg) }
  48.3871% { transform:rotate(0deg) }
  100% { transform:rotate(0deg) }
}


.arrowIcon {
  animation: bounce-wait2 3.6s ease infinite;
}
@keyframes bounce-wait2 {
  0% { transform:translateY(0) }
  5.55556% { transform:translateY(0) }
  11.11111% { transform:translateY(0) }
  22.22222% { transform:translateY(-15px) }
  27.77778% { transform:translateY(0) }
  33.33333% { transform:translateY(-15px) }
  44.44444% { transform:translateY(0) }
  100% { transform:translateY(0) }
}

@keyframes loading {
  0%   { cy: 10; }
  25%  { cy: 3; }
  50%  { cy: 10; }
}



.confetti {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 1000;
    top: -5%;
}
.confetti-piece {
    position: absolute;
    width: 10px;
    height: 30px;
    background: #ffd300;
    top: 0;
    opacity: 0;
}
.confetti-piece:nth-child(1) {
    left: 7%;
    -webkit-transform: rotate(-40deg);
    -webkit-animation: makeItRain 1000ms infinite ease-out;
    -webkit-animation-delay: 182ms;
    -webkit-animation-duration: 1116ms;
}
.confetti-piece:nth-child(2) {
    left: 14%;
    -webkit-transform: rotate(4deg);
    -webkit-animation: makeItRain 1000ms infinite ease-out;
    -webkit-animation-delay: 161ms;
    -webkit-animation-duration: 1076ms;
}
.confetti-piece:nth-child(3) {
    left: 21%;
    -webkit-transform: rotate(-51deg);
    -webkit-animation: makeItRain 1000ms infinite ease-out;
    -webkit-animation-delay: 481ms;
    -webkit-animation-duration: 1103ms;
}
.confetti-piece:nth-child(4) {
    left: 28%;
    -webkit-transform: rotate(61deg);
    -webkit-animation: makeItRain 1000ms infinite ease-out;
    -webkit-animation-delay: 334ms;
    -webkit-animation-duration: 708ms;
}
.confetti-piece:nth-child(5) {
    left: 35%;
    -webkit-transform: rotate(-52deg);
    -webkit-animation: makeItRain 1000ms infinite ease-out;
    -webkit-animation-delay: 302ms;
    -webkit-animation-duration: 776ms;
}
.confetti-piece:nth-child(6) {
    left: 42%;
    -webkit-transform: rotate(38deg);
    -webkit-animation: makeItRain 1000ms infinite ease-out;
    -webkit-animation-delay: 180ms;
    -webkit-animation-duration: 1168ms;
}
.confetti-piece:nth-child(7) {
    left: 49%;
    -webkit-transform: rotate(11deg);
    -webkit-animation: makeItRain 1000ms infinite ease-out;
    -webkit-animation-delay: 395ms;
    -webkit-animation-duration: 1200ms;
}
.confetti-piece:nth-child(8) {
    left: 56%;
    -webkit-transform: rotate(49deg);
    -webkit-animation: makeItRain 1000ms infinite ease-out;
    -webkit-animation-delay: 14ms;
    -webkit-animation-duration: 887ms;
}
.confetti-piece:nth-child(9) {
    left: 63%;
    -webkit-transform: rotate(-72deg);
    -webkit-animation: makeItRain 1000ms infinite ease-out;
    -webkit-animation-delay: 149ms;
    -webkit-animation-duration: 805ms;
}
.confetti-piece:nth-child(10) {
    left: 70%;
    -webkit-transform: rotate(10deg);
    -webkit-animation: makeItRain 1000ms infinite ease-out;
    -webkit-animation-delay: 351ms;
    -webkit-animation-duration: 1059ms;
}
.confetti-piece:nth-child(11) {
    left: 77%;
    -webkit-transform: rotate(4deg);
    -webkit-animation: makeItRain 1000ms infinite ease-out;
    -webkit-animation-delay: 307ms;
    -webkit-animation-duration: 1132ms;
}
.confetti-piece:nth-child(12) {
    left: 84%;
    -webkit-transform: rotate(42deg);
    -webkit-animation: makeItRain 1000ms infinite ease-out;
    -webkit-animation-delay: 464ms;
    -webkit-animation-duration: 776ms;
}
.confetti-piece:nth-child(13) {
    left: 91%;
    -webkit-transform: rotate(-72deg);
    -webkit-animation: makeItRain 1000ms infinite ease-out;
    -webkit-animation-delay: 429ms;
    -webkit-animation-duration: 818ms;
}
.confetti-piece:nth-child(odd) {
    background: #7431e8;
}
.confetti-piece:nth-child(even) {
    z-index: 1;
}
.confetti-piece:nth-child(4n) {
    width: 5px;
    height: 12px;
    -webkit-animation-duration: 2000ms;
}
.confetti-piece:nth-child(3n) {
    width: 3px;
    height: 10px;
    -webkit-animation-duration: 2500ms;
    -webkit-animation-delay: 1000ms;
}
.confetti-piece:nth-child(4n-7) {
  background: red;
}
@-webkit-keyframes makeItRain {
    from {opacity: 0;}
    50% {opacity: 1;}
    to {-webkit-transform: translateY(350px);}
}


/*-----------------marquee Slidr*/
.swiper3 .swiper-wrapper{
  -webkit-transition-timing-function:linear; 
}
.swiper3 {
  overflow: hidden;
}

/*marquee Slidr*/
.swiper4 .swiper-wrapper{
  -webkit-transition-timing-function:linear; 
}
.swiper4 {
  overflow: hidden;
}


#return-to-top {
    text-align: center;
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: block;
    text-decoration: none;
    padding: 3px 5px;
    font-size: 26px;
    font-weight: bold;
    color: #ffffff;
    z-index: 3;
    text-transform: uppercase;
    transition: all 0.25s ease-in-out;
    border-radius: 2px;
    overflow: hidden;
    line-height: 40px;
    height: 45px;
    width: 45px;
    background-color: #a94481;
    background-image: linear-gradient(to right, hsl(25deg 100% 50% / 12%), rgb(241 0 30 / 12%), rgb(36 73 207 / 12%));
    opacity: 0.6;
}
#return-to-top .fa{
    line-height: inherit;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;	
}
#return-to-top:hover{
    opacity: 1;
}



/*-------------------------------------------------------------------------------------------------Media--*/

    

@media (min-width: 240px){  

	.header {padding: 1.5% 10px;}

   .checkBg-main{
		width: 95%;
		margin-right: 0;
		margin: auto;
	}
	.checkBg-main ul{font-size: 14px;} 
	
	.checkBg-title{font-size: 18px;}
    
	
	
	.title4-img{max-width:80%;}
	
	
    .section2shap1 {max-width: 4%;}
    .section2shap2 {max-width: 7%;left: 100%;}
	
	
	.stepForm {width: 100%;}
	.stepForm2 {width: 100%;}
	.stepForm3 {width:100%;}
	.stepVideo {width:100%;}
	.stepForm5 {width: 100%;}
	
	.stepBoxinner {padding: 0 3% 0 5%;}
	
	input.submitBt {font-size: 14px;}
    input.submitBt2{font-size: 14px;}
	button.submitBt6, .affiliateText{
    font-size: 11px;
}
	button.submitBt4 {font-size: 12px;}
    .submitBt3 a {font-size: 14px;width: 100%;}
    .submitBt4 a {font-size: 14px;}
    .submitBt5 button {font-size: 14px;}
	
	.arrow3{margin-top: 0;}
	
	.date-section {padding: 7% 0 10% 0;}
	.liveDate{max-width: 71%;}
	
	#myModal .modal-dialog{max-width: 100%;}
	#myModal2 .modal-dialog{max-width: 100%;}
	
	.icon-img{max-width:100%;}

	.video-autoplay-overlay-image{padding:11% 0;}
}

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

    .btnn {
    margin: 0 0px 0 10px;
    }
}

/*----------------------------------------------991.98px*/

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

	.section13 {padding: 5% 0% 6% 0%; margin-top: 0;}

	.title1A {padding: 6% 3% 2.1% 7%;}
	.about-video-inn {padding: 10px;}
	.about-responsive {border-radius: 10px;}
	.need1-icon{max-width: 12%;}
	.need2-icon{max-width: 17%;}

    a.navbar-brand {
   
    }

    .otoimg6 {max-width: 74%;}
    .otoimg4 {max-width: 110%;}

    .title2 {
    padding: 10.5px 10px;
    }

    .liveBox {
    max-width: 100%;
    }

   
    .text-bg1B {
    padding: 0 5px;
    height: 45px;
    }

    .text-bg1A {
    padding: 0px 5px;
    height: 45px;
    }

    .section2shap1 {
    top: 10%;
    left: 1.5%;
    max-width: 4%;
    }

    .section2shap2 {
    display: none!important;
    }

    .section3-box {
    padding: 5% 10% 0% 8%;
    }

    .section12 {
    margin-top: -9.5%;
    }

    .stepimg {
    margin-top: -25%;
    max-width: 100%;
    }

    input.submitBt {
    
    }

    .stepForm {
    padding: 0%;
    }

    .stepBoxinner {
    padding: 0 1% 0 3%;
    }

    input.submitBt2, button.submitBt2 {
    
    }

    .submitBt4 {
    padding: 0 3%;
    }

    .submitBt3 a {
  
    }

    .stepForm2 {
    padding: 0%;
    }

    .stepForm3 {
    padding: 0%;
    }

    .stepForm4 {
    padding: 0%;
    }

    .stepForm5 {
    padding: 0%;
    }

    .connection1 {
    max-width: 22%;
    }

    .connection2 {
    max-width: 22%;
    }

    .connection3 {
    max-width: 22%;
    }

    .stepVideo {
    }

    .form-box-main2 {
    padding: 0;
    }

    .submitBt4 a {
    padding: 16px 5%;
    }

    .facebookBox {
    padding: 7% 3% 8% 3%;
    }

    

    i.fa.fa-facebook-square {
    font-size: 16px;
    margin: 0px 5px 0px 0;
    }

    .form2 {
    margin-top: 4%;
    }

    .section3 {
    padding: 25% 0% 22% 0%;
    margin-top: -30%;
    }

    .section4 {
    padding: 23% 0% 0% 0%;
    margin-top: -19%;
    }

    .section5 {
    padding: 22% 0% 7% 0%;
    }

    .mokupimg1 {
    top: -1.5%;
    right: 0%;
    max-width: 21%;
    }

    .trackicon2 {
    top: 16%;
    right: 2%;
    max-width: 12%;
    }

    .trackicon1 {
    top: 14%;
    left: 4%;
    max-width: 8%;
    }

    .attention {
    width: 100%;
    left: 0%;
    }

    .section7 {
    padding: 10% 0% 8% 0%;
    margin-top: -6%;
    }

    .section8 {
    padding: 10% 0% 22% 0%;
    margin-top: -7%;
    }

    .section9 {
    padding: 20% 0% 2% 0%;
    margin-top: -23%;
    }

    .checklist2 li span {
    background: url(../images/checklist3.png) no-repeat left 3px;
    padding-left: 22px;
    }

    .checklist2 li {
    padding: 5.9% 5% 5.9% 5%;
    margin: 10% 0;
    }

    .checklist2B li {
    margin-top: 10%;
    padding: 4% 5% 2% 5%;
    }

    .checkBox {
    padding: 0 5px;
    }

    .checkBox-botm {
    padding: 0 5px;
    margin-top: -10%;
    }

    .title3-title {
    max-width: 60%;
    }

    .title2-img {
    max-width: 55%;
    }

    .eCoverlyLogo2 {
    max-width: 50%;
    }

    .eCoverlyLogo1 {
    max-width: 50%;
    }

	.mokupimg2 {
    top: -1%;
    left: 0;
    max-width: 18%;
	}

    .introLogo {
    max-width: 45%;
    }

    .stepBox {
    max-width: 94%;
    }

    .stepBox2 {
    max-width: 94%;
    }

    .facebookicon {
    max-width: 75%;
    }

    .invitebox {
    left: 0%;
    top: 25%;
    max-width: 15%;
    }

    .roktimg1 {
    top: 50%;
    left: 86%;
    max-width: 11%;
    }
    
    .trophy1 {
    left: 5%;
    top: 6%;
    max-width: 11%;
	}

    .launch-detail {
    padding: 0 1% 0 1%;
    }

    .checkText {
    padding: 0 4% 0 4%;
    }

    .trophy2 {
    top: -2.3%;
    right: 4%;
    max-width: 12%;
    }

    .placeShap1 {
    padding: 5.5% 9% 2% 9%;
    }

    .section10 {
    padding: 17% 0% 24% 0%;
    }

    .section11 {
    margin-top: -16%;
    }

    .bundleBg {
    max-width: 92%;
    padding: 0 3% 5% 3%;
    }

    .placeTextinner {
    font-size: 31px;
    }

    .placeBox {
    padding: 0 3.5%;
    }

    .placeimage6 {
    margin-top: 8%;
    }

    .placeimage {
    margin: 0% -10px 0px 0px;
    }

    .otorow {
    padding-top: 12%;
    }

    .otShapimg {
    top: 0px;
    right: -8px;
    max-width: 19.5%;
    }

    .otoarrow1 {
    max-width: 22%;
    }

    .otoarrow2 {
    max-width: 22%;
    }

    .otoarrow3 {
    max-width: 17%;
    bottom: -14%;
    }

    .otoarrow4 {
    max-width: 22%;
    }

    .otoarrow5 {
    max-width: 22%;
    }

    .otomainBox {
    padding: 0 2%;
    margin-top: 6%;
    }

    .otoBg1 {
    background-image: linear-gradient(#7833e3, #ba81d5e0);
    padding: 10% 10% 16% 10%;
    border: 1px solid #d5d5d5;
    height: 100%;
    }

    .otoBg2 {
    background-image: linear-gradient(#fff, #d2fefd);
    padding: 10% 10% 16% 10%;
    border: 1px solid #d5d5d5;
    height: 100%;
    }

    .otoBg3 {
    background-image: linear-gradient(#fff, #eae1ff);
    padding: 10% 10% 16% 10%;
    border: 1px solid #d5d5d5;
    height: 100%;
    }

    .otoBg4 {
    background-image: linear-gradient(#fff, #edffcf);
    padding: 10% 10% 16% 10%;
    border: 1px solid #d5d5d5;
    height: 100%;
    }

    .otoBg5 {
    background-image: linear-gradient(#fff, #ffe2f6);
    padding: 10% 10% 16% 10%;
    border: 1px solid #d5d5d5;
    height: 100%;
    }

    .otoBg6 {
    background-image: linear-gradient(#fff, #ffe7da);
    padding: 10% 10% 16% 10%;
    border: 1px solid #d5d5d5;
    height: 100%;
    }

    .section11-inn {
    padding: 5% 0px 12% 0px;
    }

    .arrow2 {
    max-width: 45%;
    }

    .video-box-main-inn {
    border-width: 3px;
    }

    .step1-detail .step-title:before {
    width: 20.5px;
    }

    .stepArrow1 {
    top: 96.5%;
    max-width: 3%;
    }

    .step2-detail .step-title:after {
    width: 20.5px;
    }

    .stepArrow2 {
    top: 96.5%;
    max-width: 3%;
    }

    .otorow {
    padding-top: 8%;
    }

    .introicon1 {
    max-width: 16%;
    left: 0;
    }

    .introicon2 {
    max-width: 16%;
    right: 0;
    }

    .arrowtext {
    top: -30px;
    right: -2%;
    }

    .watcharrow2 {
    top: 22%;
    right: 4%;
    max-width: 3%;
    }

    .iMac {
    top: 1%;
    right: 0;
    max-width: 25%;
    }

    .handimg {
    left: 0;
    top: 4%;
    max-width: 12%;
    }    

    .insideimgBox::before {
    right: -4.9%;
    }

    .arrowIcon {
    left: -10%;
    max-width: 12%;
    }

    .icon {

    } 

    .ele7 {
    }

    .section16 {
		padding: 6% 0% 2% 0%;
		background-image: linear-gradient(to bottom right, #7023b1, #160533);
		margin-top: 5%;
	}
	
	.section16 .swiper-container-horizontal>.swiper-pagination-bullets, .section16 .swiper-pagination-custom, .section16 .swiper-pagination-fraction {
		bottom: 25px;
	}
	
	.section17 {
		padding: 7% 0% 1% 0%;
		margin-top: 0;
	}
	.swiper2 {
		padding: 6% 0 10% 0;
	}
	

    .domin3dText {
    max-width: 80%;
    }

    .ls20 {
    letter-spacing: 10px;
    }

    .dominBox {
    /* padding: 0 0%; */
    /* margin: 0 0 -22% 0; */
    }

    .section18 {
    /* padding: 23% 0% 10% 0%; */
    margin-top: -12.5%;
    }

    [style*="--marquee"] ul {
    width: 1000%;
    }

    [style*="--marquee"] {
    height: 30vw;
    }

    .information-Box-inner {
    border-left: 5px solid hsl(278deg 36% 81%);
    }

    .queicon1 {
    left: -2%;
    max-width: 11%;
    /* top: 47%; */
    }

    .queicon2 {
    top: 47%;
    left: 14%;
    max-width: 13%;
    }

    .queicon3 {
    top: 12%;
    right: 34%;
    max-width: 16%;
    }

    .queicon4 {
    top: 27%;
    right: 0%;
    max-width: 18%;
    }

    .queBox-inner {
    border-left: 5px solid hsl(278deg 36% 81%);
    }

    .section21Box {
    padding: 0 3%;
    }

    .confetti {
    width: 65%;
    height: 80%;
    }

    .bottomline8 {
    padding: 4% 0% 0% 0.3%;
    margin: 0 4px 0 0;
    }


	
	.slider1 .slider-row {
	  width: 704px;
	  height: 118px;
	  background-size: 704px 118px;
	}

	@keyframes slide1 {
	  from {
		background-position-x: 0;
	  }
	  to {
		background-position-x: -704px;
	  }
	}	

	
	.slider2 .slider-row {
	  width: 704px;
	  height: 118px;
	  background-size: 704px 118px;
	}

	@keyframes slide2 {
	  from {
		background-position-x: -704px;
	  }
	  to {
		background-position-x: 0;
	  }
	}

	.invitebox1 {
		padding: 0 15px;
	}
	.invitebox2 {
		padding: 0 15px;
	}
	
	.shap1, .shap2, .shap3{display:none !important;}

    .checkBg-title {
      left: 0%;
    }
  
	.checkBg {
		background-color: #46345f;
		box-shadow: 0px 24px 63.2px 15.8px rgb(0 0 0 / 8%);
		padding: 7% 6% 1% 6%;
	}
	
	.section6B {
		padding: 8% 0% 6% 0%;
		margin-top: -4%;
	}
	
	.placeTextinner {margin: 0 0 14px -18%;}
	
	button.submitBt6{
}
	.affiliateText{padding: 2% 4%;}

	.copy-left{
	}
	.copy-right{
	}
	
	.modal-box {width: 30%;}	

	.submitBt5 button{width: 90%;}
	.submitBt4 a{width: 100%;}
	
	.adeel-icon {
		max-width: 40%;
	}
	
}

/*----------------------------------------------991.98px*/


@media only screen and (max-width: 767px){
	.section7 {
        margin-top: 0%;
        background-color: #080125;
    }
	.title1A {
		background-image: none;
		padding: 0% !important;
	}
	.title1A span {
		padding: 2% 3%;
		display: inline-block;
	}

	.text-bg1A-out .text-main{background-image: linear-gradient( to top, #ffffff00, #ffffff00 14%, #c7b9ff 0%, #c7b9ff 50%, #ffffff00 0% );}
	.text-bg1B-out .text-main{background-image: linear-gradient( to top, #ffffff00, #ffffff00 14%, #ffc700 0%, #ffc700 50%, #ffffff00 0% );}


    .ele7, .ele8, .book1, .book2, .text-bg1A, .text-bg1B, .bgLine1, .bgLine2, .bgLine3, .bgLine4, .bgLine5, .bgLine6, .img1, .img2, .ele1, .ele2{display:none !important;}

    .otoarrow1 {
    display: none!important;
    }

    .otoarrow2 {
    display: none!important;
    }

    .otoarrow3 {
    display: none!important;
    }

    .otoarrow4 {
    display: none!important;
    }

    .otoarrow5 {
    display: none!important;
    }

    .otoarrow6 {
    display: none!important;
    }

    .insideimgBox::before {
    right: 0%;
    }

    .section13:hover .roktimg1 {
    top: 15%;
    left: 90%;
    transition-duration: 0.5s;
    }

    .promote {
    max-width: 100%;
    }

    .stepArrow1 {
    right: 0%;
    }

    .step2-detail .step-title:after {
    width: 16px;
    }


	.attention {width: 90%;left: 0;right: 0;margin: auto;}
	
	.queicon1, .queicon2, .queicon3, .queicon4, .adilSideImage, .aboutArrow1, .aboutArrow2 {display:none !important}

	.promote-vid{
		width: 100%;   
		right: 0;
	}

	.adilSideImage2{  max-width: 19%;
    left: 0%;
    bottom: 0;}
	
	.demo-video {border-radius: 20px;}
	
	.placeimg1 {margin-top: 4%;}
	
	.checklist2 li:first-child {margin: 0% 0 3% 0;}
	
	.section11-inn{
		background-image: none;
		background-color: #efebfe;
		border-radius: 20px;
		width: 96%;
		margin: auto;
		margin-top: 5%;
		padding: 2% 0px 12% 0px;
	}
	
	.section13-title p{line-height: 160%;}

	.checkBg{padding-top:0 ;}
  
	.checkBg-title {
		position:relative;
		margin-bottom: 7%;
	}

	button.submitBt6{
    width: 40%;
}
	.affiliateText{}
		
	.modal-box {width: 33%;}	
	
	.adeel-icon {max-width: 38%;}


	.title-text{
		margin-top: 0;
	   display: inline-block !important;	
	}
    .new_title_content {
        margin-top: 0px;
        margin-bottom: 0px;
    }
		.date-section{
		background-color: #7840cf;
		background-image: none;
		margin-top: 5%;
	}
		.date-box{
		max-width: 100%;
		margin-left: 0;
		border-radius: 100px;
		padding: 5% 15px;
		background-color: #f8f64f;
	}
		.liveDate{
		margin-left: 0;
	}	
	
	.video-box {padding: 10px;}
	
	.arrow3{max-width: 8%;}
	
	input.submitBt {margin-top: 4%;}
	
	#myModal .modal-box {
		width: 33%;
	}
	
	
	a.demo-btn1, a.demo-btn2 {
		padding: 3% 6%;
	}
	
	.video-autoplay-overlay-lottie{height:100px !important;}
	.video-autoplay-overlay-image{margin: -53px 0px 0px -100px; !important}
	
	.video-autoplay-overlay-bottom, .video-autoplay-overlay-top{height: 30px !important;font-size: 15px !important;line-height: 32px !important;}
	.video-autoplay-overlay-play{background: url(../images/playMob.png) 50% 50% no-repeat rgb(90 41 135) !important;width: 60px !important;height: 60px !important;margin: -30px 0px 0px -30px !important;}
	
	.video-autoplay-overlay-lottie{background: url(../images/muteMob.png) 50% 50% no-repeat transparent !important;height:50px !important;}
	
	
	.padding0 , .step-detail{padding:0 15px;}
	
	
}


/*----------------------------------------------575.98px*/  

@media (max-width: 575.98px){

    a.navbar-brand {
   
    }

   
   

    .ag-slide-block {
    margin-top: -10%;
    }

    .proofBg {
    padding: 6.5px 4.4%;
    }

    .banner {
    padding: 3% 0% 0% 0%;
    background-image: none;
    background-color: #fff;
    margin-top: 0;
    }

    .hdTx1 {
    padding: 0 0%;
    }

    .text-bg1B {
    padding: 0 5px;
    height: 35px;
    }

    .text-bg1A {
    padding: 0 5px;
    height: 35px;
    }

    .liveBox {
    max-width: 96%;
    margin-top: 6%;
    }

   

    .title2 {
    padding: 8px 10px;
    margin-top: 6%;
    }

    .section2 {
    margin-top: 0%;
    padding: 0% 0 10% 0;
    }

    .sctioin2Bg-inn {
    padding: 8% 8% 5% 8%;
    }

    .winBox {
   
    }

    .section3-box {
    padding: 0% 8% 0% 8%;
    text-align: center;
    }

    .promote {
    max-width: 100%;
    margin-top: 8%;
    display: none!important;
    }

    .section3 {
    padding: 10% 0% 8% 0%;
    background-color: #0b0226;
    background-image: none;
    margin: 0;
    }

    .stepimg {
    max-width: 50%;
    margin: auto!important;
    }

    .stepBox {
    max-width: 100%;
    padding: 6% 5%;
    text-align: center;
    }

    .stepForm {
    margin: 6% 0 0 0;
    }

    .stepForm2 {
    margin: 6% 0 0 0;
    }

    input.submitBt {
    
    }

    .eCoverlyimg {
    max-width: 70%;
    margin: auto;
    }

    .connection {
    display: none!important;
    }

    .connection2 {
    display: none!important;
    }

    .form-box-main, .form-box-main2 {
	}

	.section3Box{
    margin-top: 4%;
}

    .stepBox {
    max-width: 94%;
    padding: 5% 5% 10% 5%;
    text-align: center;
    margin: auto;
    background-color: #fff;
    margin-top: 4% !important;
    background-image: none;
    }

    .stepBox2 {
    max-width: 94%;
    padding: 8% 5% 6% 5%;
    text-align: center;
    margin: auto;
    background-color: #fff;
    margin-top: 4% !important;
    background-image: none;
    }

    .connection1 {
    display: none!important;
    }

    .connection2 {
    display: none!important;
    }

    .connection3 {
    display: none!important;
    }

    .stepForm3 {
    
    }

    .section4 {
    padding: 10% 0% 0% 0%;
    margin-top: 0%;
    background-color: #fff;
    background-image: none;
    }

    .ecoverPoster {
    box-shadow: 0px 8px 30px 0px rgb(0 0 0 / 19%);
    padding: 10% 15px 8% 15px;
    }

    .eposterTop {
    display: none!important;
    }

    .ecoverPoster-out {
    padding: 0 5%;
    margin-top: 3%;
    }

    .mokupimg1 {
    display: none!important;
    }

    .mokupimg2 {
    display: none!important;
    }

    .section5 {
    padding: 10% 0 10% 0;
    background-color: #000;
    background-image: none;
    margin: 0;
    text-align: center;
    }

    .trackimg {
   
    }

    .stepBoxinner {
    padding: 0;
    text-align: center;
    }

    .stepVideo {
    margin: 5% 0;
    }

    .stepForm4 {
    }

    input.submitBt2, button.submitBt2 {

    }

    .submitBt3 a {
    }

    .submitBt4 a {
    padding: 16px 4%;
    }

    .stepForm5 {
    margin: 3% 0 6% 0;
   
    }

   

    i.fa.fa-facebook-square {
    font-size: 18px;
    }

    input.form-box {
    font-size: 14px;
    width: 100%;
	}

    .eCoverlyLogo1 {
    max-width: 60%;
    }

    .introBg {
    padding: 1px 4.1% 4px 4.1%;
    }

    .introsection h4 {
    display: block;
    }

    .introsection {
    text-align: center;
    }

    .inviteoshap {
    padding: 1% 10% 1% 10%;
    }

    .trackicon1 {
    display: none!important;
    }

    .trackicon2 {
    display: none!important;
    }

    .eCoverlyLogo2 {
    max-width: 60%;
    margin-top: 5%!important;
    }

    .checklist1 li {
    background: url(../images/checklist1resp.png) no-repeat left 2px;
    padding-left: 35px;
    }

    .section5 {
    margin: 10% 0 0 0;
    } 

    .millionText {
    margin: 0;
    padding: 0 10px;
    margin-top: 0px;
    } 

    .section7-details {
    padding: 0 15px;
    } 

	.section6 {
    padding: 10% 0% 0% 0%;
    margin-top: 0px;
    background-image: none;
    background-color: #fbf6ff;
	}

    .section6B {
    margin-top: -2px;
    padding: 4% 0% 11% 0%;
    background-image: none;
    background-color: #e8dafa;
	}

    .section7 {
    background-image: none;
    background-color: #080124;
    padding: 10% 0% 0% 0%;
    margin-top: 0%;
    text-align: center;
    }

    .invitebox {
    left: 0%;
    top: 10%;
    max-width: 18%; 
    }

    .title4 {
    margin-bottom: 5%;
    margin-top: 3%;
    }

    .attention {
    margin-bottom: 5%;
    }

    .step-detail h2 {
    margin-top: 4%;
    }

    .poppingImg {
    margin: 0;
    margin-top: 6%;
    }

    .section8 {
    padding: 9% 0% 10% 0%;
    margin-top: -12%;
    background-image: linear-gradient(#fef1ed, #f3e4fa);
    }

    .section9 {
    padding: 10% 0% 10% 0%;
    margin-top: 0%;
    background-image: none;
    background-color: #fff;
    text-align: center;
    }

    .checklist2 li {
    margin: 3% 0;
    text-align: left;
    }

    .checklist2 li span {
    background: url(../images/checklist2.png) no-repeat left 8px;
    padding-left: 34px;
    }

    .checkBox-botm {
    margin-top: 0%;
    padding: 0 5px;
    }

    .checklist2B li {
    margin-top: 0%;
    padding: 6% 39.2% 6% 5%;
    }

    .section10 {
    padding: 10% 0% 10% 0%;
    background-color: #7b38e2;
    background-image: none;
    }

    .step1-detail {
    border: none;
    text-align: center;
    padding: 5% 3%;
    }

    .step2-detail {
    border: none;
    padding: 5% 3%;
    text-align: center;
    }

    .bonus-title {
    padding: 1.5% 8%;
    }

    .step1-detail .step-title:before {
    display: none;
    }

    .step2-detail .step-title:after {
    display: none;
    }

    .stepArrow1 {   
    display: none;
    }

    .stepArrow2 {   
    display: none;
    }

    .inside-box1 {
    padding: 5% 3%;
    text-align: center;
    }

    .arrowIcon {
    display: none;
    }

    .section11 {
    margin-top: 0%;
    padding: 10% 0% 10% 0%;
    }

    .section12 {
    padding: 0% 0% 5% 0%;
    margin-top: 0;
    background-color: #09070a;
    background-image: none;
    }

    .inside {
    margin-top: 3%;
    }

    .arrow2 {
    max-width: 52%;
    }

    .title2-img {
    max-width: 75%;
    }

    .bonus-detail {
    padding: 0 5%;
    text-align: center;
    }

    .bonus1 {
    margin-top: 3%;
    }

    .bonus2 {
    margin-top: 5%;
    }

    .bonus3 {
    margin-top: 5%;
    }

    .section13 {
    padding: 10% 0;
    margin-top: 0%;
    background-image: none;
    background-color: #fff;
    }

    .title3-title {
    max-width: 65%;
    }

    .ls10 {
    letter-spacing: 6px;
    }

    .ls6 {
    letter-spacing: 3px;
    }

    .section13-title {
    padding: 4% 3%;
    background-color: #8647d6;
    background-image: none;
    margin-top: 3%;
    max-width: 95%;
    }

    .roktimg1 {
    display: none!important;
    }

    .trophy1 {
    display: none!important;
    }

    .launch-detail {
    padding: 5% 15px;
    text-align: center;
    }

    .prizesimg1 {
    margin-bottom: 5%;
    }

    .checkText {
    padding: 0 3%;
    text-align: center;
    }

    .trophy2 {
    display: none!important;
    }

    .placeText {
    margin-top: -5%;
    }

    .placeShap1 {
    padding: 1% 5%;
    background-color: #5505dc;
    background-image: none;
    border-radius: 10px;
    }

    .title5 {
    padding: 3px 3.9%;
    }

   .section14 {
    padding: 0% 0% 8% 0%;
    background-image: none;
    background-color: #220262;
    border-radius: 15px;
    }   

    .bundleBg {
    max-width: 100%;
    padding: 0 3% 8% 3%;
    } 

    .placeTextinner {
    margin: 0 0 20px 0%;
    font-size: 24px;
    }

    .placeTextshap2 {
    padding: 1% 5%;
    background-color: #b24fff;
    background-image: none;
    border-radius: 10px;
    }

    .placeTextshap10 {
    padding: 1% 5%;
    background-color: #b24fff;
    background-image: none;
    border-radius: 10px;
    }

    .placeBox {
    padding: 0 3%;
    }

    .placeShap2 {
    padding: 0 2.4%;
    text-align: center;
    }

    .placeShap2-cpy {
    margin: 5% 0 0% 0;
    }

    .placeShapover-Box {
    padding: 8% 6%;
    border-radius: 15px;
    background-color: rgb(71, 42, 147);
    overflow: hidden;
    }

    .placeimage {
		margin: auto;
		margin-top: 5%;
		max-width: 70%;
	}

    

    .placeimage6 {
    margin: 8% -21px -29px 0;
    }

    .placeimage10 {
    max-width: 100%;
    margin: 5% 0 0 0px;
    }

    .section15 {
    background-image: none;
    background-color: #fff;
    padding: 10% 0% 8% 0%;
    margin-top: 0%;
    }

    .salesPg {
    padding: 0 3%;
    margin-top: 5%;
    text-align: center;
    }

    .otoarrow1 {
    display: none!important;
    }

    .otoarrow2 {
    display: none!important;
    }

    .otoarrow3 {
    display: none!important;
    }

    .otoarrow4 {
    display: none!important;
    }

    .otoarrow5 {
    display: none!important;
    }


    .otShapimg2 {
    display: none!important;
    }

    .otoBox {
    padding: 0px 3%;
    margin-bottom: 5%;
    }

    .otoBg1 {
    padding: 10% 8% 0% 8%;
    text-align: center;
    }

    .otoBg2 {
    padding: 10% 8% 0% 8%;
    text-align: center;
    }

    .otoBg3 {
    padding: 10% 8% 0% 8%;
    text-align: center;
    }

    .otoBg4 {
    padding: 10% 8% 0% 8%;
    text-align: center;
    }

    .otoBg5 {
    padding: 10% 8% 0% 8%;
    text-align: center;
    }

    .otoBg6 {
    padding: 10% 8% 0% 8%;
    text-align: center;
    }

    .otoimg1 {
    max-width: 75%;
    margin: auto;
    margin-top: 5%;
    } 

    .otoimg2 {
    max-width: 75%;
    margin: auto;
    margin-top: 5%;
    }

    .otoimg3 {
    max-width: 75%;
    margin: auto;
    margin-top: 5%;
    }

    .otoimg4 {
    max-width: 80%;
    margin: auto;
    margin-top: 5%;
    }

    .otoimg5 {
    max-width: 75%;
    margin: auto;
    margin-top: 5%;
    }

    .otoimg6 {
    max-width: 56%;
    margin: auto;
    margin-top: 5%;
    }

    .otorow {
    padding-top: 0%;
    }

    .introicon1 {
    display: none!important;
    }

    .introicon2 {
    display: none!important;
    }

    .arrowtext {
    top: 10px;
    right: 0%;
    text-align: center;
    position: relative;
    }

    .watchtext {
    transform: none;
    position: relative;
    text-align: center;
    margin: 0 0 0% 0;
    height: auto;
    }

    .watcharrow2 {
    display: none!important;
    }

    .handimg {
    display: none;
    }

    .iMac {
    display: none;
    } 

    .insideimgBox::before {
    display: none;
    }   

    .promoteMainwin {
    margin-top: 0%;
    }

    .section4-title {
    margin-top: -3%;
    }

    .section16 {
    padding: 10% 0% 3% 0%;
    background-color: #6b22aa;
    background-image: none;
    margin: 0;
    }

    .aboutArrow1 {
    left: 27%;
    top: 75%;
    max-width: 2.5%;
    }

    .aboutArrow2 {
    right: 27%;
    top: 75%;
    max-width: 2.5%;
    }

    .section17 {
    background-image: none;
    padding: 10% 0% 8% 0%;
    margin-top: 0%;
    background-color: #0a010e;
    }

    .ls20 {
    letter-spacing: 5px;
    }

    .domin3dText {
    max-width: 95%;
    }

    .section17pg {
    padding: 0;
    }

    .domtop {
    padding-top: 1%;
    }

    .dominimg13 {
    margin-top: 2%;
    }

    .dominBox {
    padding: 0%;
    margin: 0;
    }

    .section18 {
    padding: 10% 0% 5% 0%;
    margin-top: 0%;
    background-color: #fff;
    background-image: none;
    }

    .section19{
    padding: 0% 0% 7% 0%;
}
    .section20{
    padding: 6% 0% 10% 0%;
}

    .hundredTx {
    margin-bottom: 3%;
    }

    .hundredBg {
    background-image: none;
    padding: 2% 5%;
    background-color: #9f5cae;
    border-radius: 5px;
    }

    .slideimg {
    border-radius: 5px;
    box-shadow: 0px 12px 19px 0px rgb(33 20 77 / 12%);
    }

    .importantimgtop {
    display: none!important;
    }

    .importantimgbottom {
    display: none!important;
    }

    .information-Box {
    padding: 0 3%;
    margin-top: 8%;
    }

    .information-Box-inner {
    border-left: 3px solid hsl(278deg 36% 81%);
    padding: 8% 3% 2% 3%;
    }

    .checklist4 li {
    background: url(../images/checklist4resp.png) no-repeat left 1px;
    padding-left: 30px;
    }

    .queimg1 {
    margin-top: 8%;
    }

    .queicon1 {
    left: 0%;
    max-width: 26%;
    top: 10%;
    }

    .queicon2 {
    top: 33%;
    left: 10%;
    max-width: 24%;
    }

    .queicon3 {
    top: 8%;
    right: 8%;
    max-width: 32%;
    }

    .queicon4 {
    top: 27%;
    right: 0%;
    max-width: 32%;
    }

    .adBox2 {
    margin: 8% 0 0 0%;
    padding: 0 3%;
    text-align: center;
    }

    .section21 {
    background-image: none;
    background-color: #06010e;
    padding: 10% 0% 8% 0%;
    margin-top: 0%;
    }

    .section21Box {
    padding: 0 3%;
    }

    .queBox-inner {
    border-left: 3px solid hsl(278deg 36% 81%);
    }

    .otoBoxhidsw1 {
    display: block;
    }

    .otoBoxhidsw2 {
    display: none;
    }

    .checkBox {
    padding: 0 30px;
    }

    .checkBox-botm {
    padding: 0 30px;
    }

    .checklist2B li {
    padding: 6% 5% 6% 5%;
    width: 100%;
    }

    .promoteresp {
    margin-top: 8%;
    display: block!important;
    }

    .section2shap1 {
    display: none!important;
    }

    .promoteMain {
    margin-bottom: 3%;
    }

    .icon-box {
    padding: 0 0 0 10px;
    }

    .confetti {
    width: 75%;
    height: 80%;
    left: 12%;
    }

    iframe.video-frame.slidervdo {
    border: 1px solid #fff;
    }

    .swiper-slide {
    width: 240%;
    }

    .tropy {
    max-width: 13%;
    }

    .swiper2 .swiper-slide.swiper-slide-active {
    transform: scale(0.9);
    }



}
/*----------------------------------------------575.98px*/  

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

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

    .mainvideo {
        position: static;
        width: 100%;
        height: 0px;
        padding-bottom: 280px;  
    }
    .video {
        width: 485px;
        height: 273px;
        top: 23px;
        left: 28px;
        margin-bottom: 8%;
    }
    
	
	
    
}

@media only screen and (min-width: 768px) {
    
    .videosection {
        position: relative;
        right: 0;
        bottom: 0px;
    }
    .mainvideo {
        position: absolute;
        width: 504px;
        height: 271px;
        top: 18px;
        left: 31px;
        padding-bottom: 0;
    }
    .video {
        width: 315px;
        height: 117px;
        top: 15px;
        left: 7px;
        margin-bottom: 12%;
    }   
	
	.ele7 {max-width: 35%;}
	.ele8 {max-width: 19%;top: 62%;right: -2%;}

	.demo-video {border-radius: 24px;}
	
	.book1{max-width: 18%;left: -2%;}
	.book2{max-width: 17%;right: -2%;}

    .section2shap1 {max-width: 4%;}
    .section2shap2 {max-width: 7%;left: 100%;}
	
	.attention {width: 92%;left: 0;}

	.checkBg-out{padding: 0 5%;}
    .adilSideImage {left: 95.5%;bottom: 1%;max-width: 16%;}
	
	.poppingImg{max-width: 97%;}
	
	.queimg1 {
		max-width: 60%;
		right: -12%;
	}
	
	.adilSideImage2{max-width: 24%;left: 0%;}

	.checkBg-main{
		width: 67.7%;
		margin-right: 0%;
	}
	.checkBg-main ul{font-size: 14px;}
	
	.checkBg-title{font-size: 14px;}
	
	.title4-img{max-width:50%;}
	
	button.submitBt6, .affiliateText{font-size: 17px;}


	
	.stepForm {width: 90%;}
	.stepForm2 {width: 90%;}
	.stepForm3 {width: 90%;}
	.stepVideo {width: 91%;}
	.stepForm5 {width: 90%;}
	
	.stepBoxinner {padding: 0 1% 0 1%;}
	
	
	input.submitBt {font-size: 14px;}
    input.submitBt2{font-size: 14px;}
	button.submitBt6, .affiliateText{}
	button.submitBt4 {font-size: 12px;}
    .submitBt3 a {font-size: 14px;width: 100%;}
    .submitBt4 a {font-size: 14px;}
    .submitBt5 button {font-size: 10px;}
	
	.arrow3{margin-top: -15%;}
	
	.date-section {padding: 6% 0 16% 0;}
	.liveDate{max-width: 45%;}
	
	#myModal .modal-dialog{max-width: 90%;}
	#myModal2 .modal-dialog{max-width: 90%;}
	
	.icon-img{max-width:100%;}
	.video-autoplay-overlay-image{padding:7% 0;}
}



@media only screen and (min-width: 800px) {
    
}


@media only screen and (min-width: 860px) {
        
    
}

@media only screen and (min-width: 892px) {
    
}

@media only screen and (min-width: 992px) {
    
    .mainvideo {
        position: absolute;
        width: 543px;
        height: 292px;
        top: 18px;
        left: 33px;
    }
    .video {
        width: 429px;
        height: 162px;
        top: 21px;
        left: 11px;
        margin-bottom: 10%;
    }
	

	
	.book1{max-width: 15%;left: 0%;}
	.book2{max-width: 16%;right: -2%;}


    .section2shap1 {max-width: 4%;}
    .section2shap2 {max-width: 7%;left: 98%;}
	
    .roktimg1 {max-width: 15%;top: 20%;left: 89%;}
    .section13:hover .roktimg1 {top: -10%;left: 85%;transition-duration: 0.5s;}

    .placeTextinner {font-size: 52px;}

    .step1-detail .step-title:before {width: 25px;top: 40%;}
    .step2-detail .step-title:after {width: 25px;top: 40%;}

    .otoBg1 {background-image: linear-gradient(#7833e3, #ba81d5e0);padding: 10% 10% 16% 10%;border: 1px solid #d5d5d5;height: 100%;}
    .otoBg2 {background-image: linear-gradient(#fff, #fff4c5d4);padding: 10% 10% 16% 10%;border: 1px solid #d5d5d5;height: 100%;}
    .otoBg3 {background-image: linear-gradient(#fff, #eae1ff);padding: 10% 10% 16% 10%;border: 1px solid #d5d5d5;height: 100%;}
    .otoBg4 {background-image: linear-gradient(#fff, #edffcf);padding: 10% 10% 16% 10%;border: 1px solid #d5d5d5;height: 100%;}
    .otoBg5 {background-image: linear-gradient(#fff, #ffe3f6);padding: 10% 10% 16% 10%;border: 1px solid #d5d5d5;}
    .otoBg6 {background-image: linear-gradient(#fff, #def8ff);padding: 10% 10% 16% 10%;border: 1px solid #d5d5d5;height: 100%;}

    .trackicon1 {top: 16%;left: 7%;max-width: 7%;}
    .trackicon2 {top: 16%;right: 7%; max-width: 10%;}

    .trophy2 {top: -2.5%;right: 5%; max-width: 10%;}

    .introicon1 {top: 17.5%;left: 3%;max-width: 14%;}
    .introicon2 {top: 1.5%;right: 3%;max-width: 14%;}

    .arrowtext {top: -25px;right: 0%; max-width: 100%;}
    .watcharrow2 {top: 23%;right: 2.5%; max-width: 4%;}

    .iMac {top: 1.5%; right: 0; max-width: 18%;}
    .handimg {left: 0;top: 6.5%; max-width: 8%;}

    .queicon1 {max-width: 12%;top: 36%;left: -3%;}
    .queicon2 {max-width: 10%;top: 48%;left: 16%;}
    .queicon3 {max-width: 12%;top: 20%;right: 37%;}
    .queicon4 {max-width: 14%;top: 32%;right: 5%;}

    input.submitBt {font-size: 18px;}
    input.submitBt2{font-size: 14px;}
	button.submitBt6, .affiliateText{font-size: 16px;}
	.affiliateText, button.submitBt4 {}
    .submitBt3 a {font-size: 14px;width: 100%;}
    .submitBt4 a {font-size: inherit;}
    .submitBt5 button {font-size: 13px;}

    .arrowIcon {left: -13%;top: 30%;}


	.attention {width: 92%;left: 5%;}


	.mokupimg1 {top: -2%;right: 0%;max-width: 21%;}
    .mokupimg2 {top: -2%;left: 0; max-width: 18%;}

	.checkBg-out{padding:0 1%;}
    .adilSideImage {left: 92.5%;bottom: -13%;max-width: 27%;}
	
	.poppingImg{max-width:94%;}
	
	.queimg1{max-width: 60%;right: -4%;}
	
	.adilSideImage2{max-width: 21%;left:0%;}
	
	.checkBg-main{
		width: 51.7%;
		margin-right: 10%;
	}
	.checkBg-main ul{font-size: 15px;}
	
	.checkBg-title{font-size: 15px;}
	
	.title4-img{max-width:100%;}
	
	
	.stepForm {width: 78.5%;}
	.stepForm2 {width: 90%;}
	.stepForm3 {width: 78.5%;}
	.stepVideo {width: 88.4%;}
	.stepForm5 {width: 78.5%;}
	
	.stepBoxinner {padding: 0 3% 0 5%;}
	
	.arrow3{margin-top: -12%;}
	
	.date-section {padding: 6% 0 16% 0;}
	.liveDate{max-width: 100%;}
	
	#myModal .modal-dialog{max-width: 90%;}
	#myModal2 .modal-dialog{max-width: 90%;}
	
	.icon-img{max-width:100%;}
	
	.bnr-vid {
		position: relative;
		z-index: 1;
		overflow: hidden;
	}

	.video-autoplay-overlay-image{padding:12% 0;}
	
	
}

 
@media only screen and (min-width: 1000px) {
    
	
	.ele7 {max-width: 100%;}
	.ele8 {max-width: 15%;top: 67%;right: -2%;}

    .roktimg1 {max-width: 16%;top: 5%;left: 89%;}

    .placeTextinner {font-size: 35px;}

    .otoimg1 {margin: 40px 0 0px 0px;}
    .otoimg2 {margin: 10px 0 0px 0px;}
    .otoimg3 {margin: 15px 0 0px 0px;}
    .otoimg4 {margin: 15px 0 0px 0px; max-width: 110%}
    .otoimg5 {margin: 15px 0 0px 0px;}
    .otoimg6 {margin: 15px 0 0px 0px; max-width: 74%}

    .arrowtext {top: -25px;right: -0.5%; max-width: 100%;}
    .watcharrow2 {top: 24%;right: 3%; max-width: 4%;}

    

    .create-title {font-size: 14px;}

    .arrowIcon {left: -13%;top: 30%;}
	
	.title4-img{max-width:100%;}


}

@media only screen and (min-width: 1100px) {
	
	
	.header {padding: 1.5% 4% 1.5% 4%;}
	
	.mycontainer {width: 940px;}
	.mycontainer2 {width: 1010px;}

    .section2shap1 {max-width: 3%;}
    .section2shap2 {max-width: 5%;left: 100%;}

    .roktimg1 {max-width: 18%;top: 5%;left: 90%;}

    .placeTextinner {font-size: 33px;}

    .mokupimg1 {top: -1.5%;right: 0%;max-width: 20%;}
    .mokupimg2 {top: -3%;left: 0; max-width: 18%;}

    .arrowtext {top: -25px;right: -3.5%; max-width: 100%;}
    .watcharrow2 {top: 24%;right: 6.5%; max-width: 4%;}

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

	.attention {width: 99%;left: -2%;}

	.checkBg-out{padding:0 1%;}
    .adilSideImage {left: 91.5%;bottom: -10%;max-width: 30%;}
	
	.poppingImg{max-width:94%;}
	
	.queimg1{max-width: 60%;right: -4%;}
	
	.adilSideImage2{max-width: 21%;left:0%;}
	
	.checkBg-main{
		width: 46.7%;
		margin-right: 10%;
	}
	.checkBg-main ul{font-size: 16px;}
	
	.checkBg-title{font-size: 16px;}
	
	.title4-img{max-width:100%;}
	
	
	.stepForm {width: 90%;}
	.stepForm2 {width: 90%;}
	.stepForm3 {width: 90%;}
	.stepVideo {width: 90%;}
	.stepForm5 {width: 90%;}
	
	.stepBoxinner {padding: 0 3% 0 5%;}
	
	
	input.submitBt {font-size: 18px;}
    input.submitBt2{font-size: 14px;}
	button.submitBt6, .affiliateText{}
	button.submitBt4 {font-size: 12px;}
    .submitBt3 a {font-size: 14px;width: 100%;}
    .submitBt4 a {font-size: 14px;}
    .submitBt5 button {font-size: 14px;}
	
	.arrow3{margin-top: -14%;}
	
	.date-section {padding: 6% 0 14% 0;}
	.liveDate{max-width: 100%;}
	
	#myModal .modal-dialog{max-width: 84%;}
	#myModal2 .modal-dialog{max-width: 84%;}
	
	.icon-img{max-width:100%;}
	
}

@media only screen and (min-width: 1200px) {
	.mycontainer {width: 1020px;}
    .mycontainer2 {width: 1080px;}

    .mainvideo {
        position: absolute;
        width: 441px;
        top: 20px;
        left: 80px;
    }
    .video {
        width: 403px;
        height: 196px;
        top: 1px;
        left: 0px;
        margin-bottom: 0px;
    }
    .mycontainer-left, .mycontainer-right{max-width:1163px;}
	
	.ele7 {max-width: 100%;}
	.ele8 {max-width: 15%;top: 67%;right: -2%;}
	
	
	.book1{max-width: 15%;left: 0%;}
	.book2{max-width: 16%;right: -2%;}
	
	.book1{max-width: 15%;left: 0%;}
	.book2{max-width: 16%;right: -2%;}

    .section2shap1 {max-width: 3%;}
    .section2shap2 {max-width: 6%;left: 100%;}

    .roktimg1 {max-width: 18%;top: 5%;left: 90%;}

    .placeTextinner {font-size: 40px;}

    .step1-detail .step-title:before {width: 25px;top: 36%;}
    .step2-detail .step-title:after {width: 25px;top: 38%;}

    .otoimg1 {margin: 40px 0 0px 0px;}
    .otoimg2 {margin: 10px 0 0px 0px;}
    .otoimg3 {margin: 15px 0 0px 0px;}
    .otoimg4 {margin: 15px 0 0px 0px; max-width: 110%}
    .otoimg5 {margin: 15px 0 0px 0px;}
    .otoimg6 {margin: 15px 0 0px 10px; max-width: 74%}

    .mokupimg1 {top: -1%;right: 2%;max-width: 20%;}
    .mokupimg2 {top: -4%;left: 0;max-width: 18%;}

    .trackicon1 {top: 16%;left: 7%;max-width: 7%;}
    .trackicon2 {top: 16%;right: 7%; max-width: 10%;}

    .trophy2 {top: -2.5%;right: 5%; max-width: 10%;}

    .arrowtext {top: -40px;right: -1.5%; max-width: 100%;}
    .watcharrow2 {top: 24%;right: 3.5%; max-width: 4%;}

    .queicon1 {max-width: 12%;top: 30%;left: 0%;}
    .queicon2 {max-width: 10%;top: 50%;left: 16%;}
    .queicon3 {max-width: 12%;top: 20%;right: 37%;}
    .queicon4 {max-width: 14%;top: 32%;right: 5%;}

    input.submitBt {font-size: 14px;}
    button.submitBt2{font-size: 14px;}
	button.submitBt6, .affiliateText{font-size: 15px;}
	button.submitBt4 {font-size: 12px;}
    .submitBt3 a {font-size: 14px;width: 100%;}
    .submitBt4 a {font-size: 14px;}
    .submitBt5 button {font-size: 12px;}


	.attention {width: 92%;left: 0;}

	.checkBg-out{padding:0 1%;}
    .adilSideImage {left: 91.8%;bottom: -8%;max-width: 30%;}
	
	.poppingImg{max-width:94%;}
	
	.queimg1{max-width: 60%;right: -4%;}
	
	.adilSideImage2{max-width: 21%;left:0%;}

	.checkBg-main{
		width: 45.7%;
		margin-right: 10%;
	}
	.checkBg-main ul{font-size: 17px;}    
	
	.checkBg-title{font-size: 17px;}
	
	.title4-img{max-width:100%;}
	
	.stepForm {width: 90%;}
	.stepForm2 {width: 90%;}
	.stepForm3 {width: 90%;}
	.stepVideo {width: 90%;}
	.stepForm5 {width: 90%;}
	
	.stepBoxinner {padding: 0 1% 0 2%;}
	
	.arrow3{margin-top: -14%;}
	
	.date-section {padding: 6% 0 12% 0;}
	.liveDate{max-width: 100%;}
	
	#myModal .modal-dialog{max-width: 84%;}
	#myModal2 .modal-dialog{max-width: 64.7%;}
	
	.icon-img{max-width:100%;}

	.video-autoplay-overlay-image{padding:14% 0;}
}


@media (min-width:1300px) {
    .mycontainer{width: 1120px;}
    .mycontainer2{width:1180px;}    
    .ex{background-color:blue}
    
    .mycontainer-left, .mycontainer-right{max-width:1250px;}

    .mainvideo {
        position: absolute;
        width: 441px;
        top: 20px;
        left: 80px;
    }
	
	.ele7 {max-width: 100%;}
	.ele8 {max-width: 16%;top: 63%;right: 0%;}

	
	.book1{max-width: 16%;left: 1%;}
	.book2{max-width: 16%;right: 0%;}


    .section2shap1 {max-width: 3%;}
    .section2shap2 {max-width: 5%;left: 100%;}

    .roktimg1 {max-width: 100%;top: 15%;left: 87%;}

    .placeTextinner {font-size: 43px;}

    .step1-detail .step-title:before {width: 32px;top: 47%;}
    .step2-detail .step-title:after {width: 30px;top: 45%;}

    .mokupimg1 {top: -2%;right: 0%;max-width: 20%;}
    .mokupimg2 {top: -5%;left: 0%;max-width: 17%;}

    .trackicon1 {top: 16%;left: 7%;max-width: 7%;}
    .trackicon2 {top: 16%;right: 7%; max-width: 10%;}

    .introicon1 {top: 17.5%;left: 3%;max-width: 14%;}
    .introicon2 {top: 1.5%;right: 3%;max-width: 14%;}

    .arrowtext {top: -25px;right: -5.5%; max-width: 100%;}
    .watcharrow2 {top: 24%;right: 5%; max-width: 100%;}

    .iMac {top: 1.5%; right: 0; max-width: 18%;}
    .handimg {left: 0;top: 6.5%; max-width: 8%;}

    .queicon1 {max-width: 12%;top: 34%;left: -1%;}
    .queicon2 {max-width: 10%;top: 42%;left: 19%;}
    .queicon3 {max-width: 12%;top: 18%;right: 35%;}
    .queicon4 {max-width: 14%;top: 32%;right: 5%;}

    .create-title {font-size: 18px;}

	.attention {width: 92%;left: 0;}

	.checkBg-out{padding:0 1%;}
    .adilSideImage {left: 93.2%;bottom: 0;max-width: 100%;}
	
	.poppingImg{max-width: 86%;}
	.section7-details {padding: 0 5.4%;}
	
	.queimg1{max-width:100%;right:-4%;}
	
	.adilSideImage2{max-width: 22%;left:0%;}
  
	.checkBg-main{
		width: 46.7%;
		margin-right: 10%;
	}
	.checkBg-main ul{font-size: 17px;}    
	
	.checkBg-title{font-size: 18px;}
	
	.title4-img{max-width:100%;} 

    .otoimg1 {margin: 40px 0 -115px 0px;}
    .otoimg2 {margin: 10px 0 -110px 0px;}
    .otoimg3 {margin: 15px 0 -105px 10px; max-width: 104%}
    .otoimg4 {margin: 15px 0 -99px 0px;}
    .otoimg5 {margin: 15px 0 -117px 0px;}
    .otoimg6 {margin: 15px 0 -108px 0px; max-width: 70%}
	
	.stepForm {width: 78.5%;}
	.stepForm2 {width: 78.5%;}
	.stepForm3 {width: 78.5%;}
	.stepVideo {width: 88.4%;}
	.stepForm5 {width: 78.5%;}
	
	.stepBoxinner {padding: 0 2% 0 2%;}
	
	.arrow3{margin-top: -12%;}
	
	.date-section {padding: 6% 0 12% 0;}
	.liveDate{max-width: 100%;}
	
	#myModal .modal-dialog{max-width: 84%;}
	#myModal2 .modal-dialog{max-width: 64.7%;}
	
	.icon-img{max-width:100%;}

	.video-autoplay-overlay-image{padding:13% 0;}
}

@media (min-width:1400px) {
    .mycontainer{width: 1160px;}
    .mycontainer2{width:1219px;;}
    .ex{background-color:silver}

    .mycontainer-left, .mycontainer-right{max-width:1298px;}
    
    .mainvideo {
        position: absolute;
        width: 441px;
        top: 20px;
        left: 90px;
    }

	
	.ele7 {max-width: 100%;}
	.ele8 {max-width: 18%;top: 60%;right: 0.5%;}
	
	.book1{max-width: 17%;left: 2%;}
	.book2{max-width: 18%;right: 1%;}

    .section2shap1 {max-width: 3%;}
    .section2shap2 {max-width: 7%;left: 100%;}

    .roktimg1 {max-width: 100%;top: 15%;left: 87%;}

    .placeTextinner {font-size: 46px;}

    .otoimg1 {margin: 40px 0 -115px 0px;}
    .otoimg2 {margin: 10px 0 -110px 0px;}
    .otoimg3 {margin: 15px 0 -105px 0px;}
    .otoimg4 {margin: 15px 0 -99px 0px;}
    .otoimg5 {margin: 15px 0 -117px 0px;}
    .otoimg6 {margin: 15px 0 -108px 0px;}

    .mokupimg1 {top: -2.5%;right: 0%;max-width: 19%;}
    .mokupimg2 {top: -5%;left: 2%;max-width: 17%;}

    .trackicon1 {top: 16%;left: 7%;max-width: 7%;}
    .trackicon2 {top: 16%;right: 7%; max-width: 10%;}

    .trophy2 {top: -2.5%;right: 5%; max-width: 10%;}

    .arrowtext {top: -25px;right: -5.5%; max-width: 100%;}
    .watcharrow2 {top: 24%;right: 8.5%; max-width: 100%;}

    .iMac {top: 1.5%; right: 0; max-width: 100%;}
    .handimg {left: 0;top: 6.5%; max-width: 100%;}

    /*btn*/

    input.submitBt {font-size: 16px;}
    button.submitBt2 {font-size: 16px;}
	button.submitBt6, .affiliateText{font-size: 16px;}
	button.submitBt4 {font-size: 12px;}
    .submitBt3 a {font-size: 16px;}
    .submitBt4 a {font-size: 16px;}
    .submitBt5 button {font-size: 13px;}

    .arrowIcon {left: -13%;top: 30%;}

	.attention {width: 92%;left: 0;}

	.checkBg-out{padding:0 1%;}
    .adilSideImage {left: 93.4%;bottom: 0;}
	
	.poppingImg{max-width: 82%;}
	
	.queimg1{max-width:100%;right: -4%;}
	
	.adilSideImage2{max-width: 22%;left:0%;}

	.checkBg-main{
		width: 46.7%;
		margin-right: 10%;
	}
	.checkBg-main ul{font-size: 17px;}  
	
	.checkBg-title{font-size: 20px;}
	
	.title4-img{max-width:100%;} 
	
	.stepForm {width: 78.5%;}
	.stepForm2 {width: 78.5%;}
	.stepForm3 {width: 78.5%;}
	.stepVideo {width: 88.4%;}
	.stepForm5 {width: 78.5%;}
	
	.stepBoxinner {padding: 0 3% 0 5%;}
	
	.arrow3{margin-top: -12%;}
	
	.date-section {padding: 6% 0 11% 0;}
	.liveDate{max-width: 100%;}
	
	#myModal .modal-dialog{max-width: 74.7%;}
	#myModal2 .modal-dialog{max-width: 64.7%;}
	
	.icon-img{max-width:100%;}
	
	.bnr-vid {
		width: 100%;
		padding-bottom: 55.5%;
	}

	.video-autoplay-overlay-image{padding:16% 0;}
	
	
}

@media (min-width:1500px) {
    .mycontainer{width: 1310px;}
    .mycontainer2{width:1219px;}
    .ex{background-color:pink}

    .mycontainer-left, .mycontainer-right{max-width:1363px;}
	
	.ele7 {max-width: 100%;}
	.ele8 {max-width: 17%;top: 60%;right: 4.5%;}
	
	.book1{max-width: 19%;left: 3%;}
	.book2{max-width: 19%;right: 1%;}

    .section2shap1 {max-width: 100%;}
    .section2shap2 {max-width: 9%;left: 100%;}

    .placeTextinner {font-size: 50px;}

    .step1-detail .step-title:before {width: 32px;top: 47%;}
    .step2-detail .step-title:after {width: 30px;top: 48%;}

    .otoimg1 {margin: 40px 0 -115px 0px;}
    .otoimg2 {margin: 10px 0 -110px 0px;}
    .otoimg3 {margin: 15px 0 -105px 0px;}
    .otoimg4 {margin: 15px 0 -99px 0px;}
    .otoimg5 {margin: 15px 0 -117px 0px;}
    .otoimg6 {margin: 15px 0 -108px 10px;}

    .mokupimg1 {top: -2.5%;right: 1%;max-width: 19%;}
    .mokupimg2 {top: -5%;left: 4%;max-width: 17%;}

    .trackicon1 {top: 16%;left: 7%;max-width: 7%;}
    .trackicon2 {top: 16%;right: 7%; max-width: 10%;}

    .arrowtext {top: -25px;right: -5.5%; max-width: 100%;}
    .watcharrow2 {top: 24%;right: 11.5%; max-width: 100%;}

    .queicon1 {max-width: 12%;top: 30%;left: 3%;}
    .queicon2 {max-width: 10%;top: 42%;left: 19%;}
    .queicon3 {max-width: 12%;top: 18%;right: 35%;}
    .queicon4 {max-width: 14%;top: 32%;right: 5%;}

	.attention {width: 92%;left: 0;}

	.checkBg-out{padding:0 1%;}
    .adilSideImage {left: 93.4%;bottom: 0;}
	
	.poppingImg{max-width: 90%;}
	
	.queimg1{max-width:100%;right: -4%;}
	
	.adilSideImage2{max-width: 20%;left:0%;}

	.checkBg-main{
		width: 45.7%;
		margin-right: 10%;
	}
	.checkBg-main ul{font-size: 19px;}   
	
	.checkBg-title{font-size: 21px;}
	
	.title4-img{max-width:100%;}
	
	.stepForm {width: 78.5%;}
	.stepForm2 {width: 78.5%;}
	.stepForm3 {width: 78.5%;}
	.stepVideo {width: 88.4%;}
	.stepForm5 {width: 78.5%;}
	
	.stepBoxinner {padding: 0 3% 0 5%;}
	
	.arrow3{margin-top: -12%;}
	
	.date-section {padding: 6% 0 11% 0;}
	.liveDate{max-width: 100%;}
	
	#myModal .modal-dialog{max-width: 74.7%;}
	#myModal2 .modal-dialog{max-width: 64.7%;}
	
	.icon-img{max-width:100%;}

	.video-autoplay-overlay-image{padding:16% 0;}
}   


@media (min-width:1600px){
    .mycontainer{width: 1310px;}


	
	.ele7 {max-width: 100%;}
	.ele8 {max-width: 17%;top: 58%;right: 6%;}
	
	.book1{max-width: 19%;left: 3%;}
	.book2{max-width: 19%;right: 1%;}

    .section2shap1 {max-width: 100%;}
    .section2shap2 {max-width: 100%;left: 100%;}

    .placeTextinner {font-size: 54px;}

    .step1-detail .step-title:before {width: 32px;top: 47%;}
    .step2-detail .step-title:after {width: 30px;top: 48%;}

    .otoimg1 {margin: 40px 0 -115px 0px;}
    .otoimg2 {margin: 10px 0 -110px 0px;}
    .otoimg3 {margin: 15px 0 -105px 0px;}
    .otoimg4 {margin: 15px 0 -99px 0px; max-width: 110%}
    .otoimg5 {margin: 15px 0 -117px 0px;}
    .otoimg6 {margin: 15px 0 -108px 10px; max-width: 74%}

    .mokupimg1 {top: -2.5%;right: 2%;max-width: 20%;}
    .mokupimg2 {top: -5%;left: 6%;max-width: 17%;}

    .trophy2 {top: -2.5%;right: 5%; max-width: 100%;}

    .arrowtext {top: -25px;right: -5.5%; max-width: 100%;}
    .watcharrow2 {top: 24%;right: 13.5%; max-width: 100%;}

    /*btn*/

    input.submitBt {font-size: 18px;}
    button.submitBt2{font-size: 16px;}
	button.submitBt6, .affiliateText{font-size: 20px;}
	button.submitBt4 {font-size: 12px;}
    .submitBt3 a {font-size: 16px;}
    .submitBt4 a {font-size: 16px;}
    .submitBt5 button {font-size: 14px;}

	.attention {width: 92%;left: 0;}

	.checkBg-out{padding:0 1%;}
    .adilSideImage {left: 93.4%;bottom: 0;}
	
	.poppingImg{max-width:94%;}
	
	.queimg1{max-width:100%;right: -4%;}
	
	.adilSideImage2{max-width: 22%;left:0%;}

	.checkBg-main{
		width: 45.7%;
		margin-right: 10%;
	}
	.checkBg-main ul{font-size: 19px;}   
	
	.checkBg-title{font-size: 21px;}
	
	.title4-img{max-width:100%;}
	
	.stepForm {width: 78.5%;}
	.stepForm2 {width: 78.5%;}
	.stepForm3 {width: 78.5%;}
	.stepVideo {width: 88.4%;}
	.stepForm5 {width: 78.5%;}
	
	.stepBoxinner {padding: 0 3% 0 5%;}
	
	.arrow3{margin-top: -12%;}
	
	.date-section {padding: 6% 0 11% 0;}
	.liveDate{max-width: 100%;}
	
	#myModal .modal-dialog{max-width: 74.7%;}
	
	.icon-img{max-width:100%;}
}

@media (min-width:1700px){
    .mycontainer{width: 1380px;}
	
	.ele7 {max-width: 100%;}
	.ele8 {max-width: 17%;top: 56%;right: 8%;}
	
	.book1{max-width: 20%;left: 3%;}
	.book2{max-width: 19%;right: 3%;}

    .section2shap1 {max-width: 100%;}
    .section2shap2 {max-width: 100%;left: 100%;}

    .placeTextinner {font-size: 56px;}
    .step1-detail .step-title:before {width: 32px;top: 47%;}
    .step2-detail .step-title:after {width: 30px;top: 48%;}

    .otoimg1 {margin: 40px 0 -115px 0px;}
    .otoimg2 {margin: 10px 0 -110px 0px;}
    .otoimg3 {margin: 15px 0 -105px 0px;}
    .otoimg4 {margin: 15px 0 -99px 0px; max-width: 110%}
    .otoimg5 {margin: 15px 0 -117px 0px;}
    .otoimg6 {margin: 15px 0 -108px 10px;max-width: 72%}

    .mokupimg1 {top: -3.5%;right: 3%;max-width: 21%;}
    .mokupimg2 {top: -5%;left: 6%;max-width: 17%;}

    .trackicon1 {top: 18.5%;left: 7%; max-width: 100%;}
    .trackicon2 {top: 16%;right: 7%; max-width: 100%;}

    .arrowtext {top: -25px;right: -5.5%; max-width: 100%;}
    .watcharrow2 {top: 24%;right: 16%; max-width: 100%;}

    .create-title {font-size: 24px;}

	.attention {width: 92%;left: 0;}


	.checkBg-out{padding:0 1%;}
    .adilSideImage {left: 93.4%;bottom: 0;}
	
	.poppingImg{max-width:94%;}
	
	.queimg1{max-width:100%;right: -4%;}
	
	.adilSideImage2{max-width: 22%;left:0%;}


	.checkBg-main{
		width: 44.7%;
		margin-right: 10%;
	}
	.checkBg-main ul{font-size: 20px;}   
	
	.checkBg-title{font-size: 24px;}
	
	.arrow3{margin-top: -12%;}
	
	.date-section {padding: 7% 0 10% 0;}
	.liveDate{max-width: 100%;}
	
	#myModal .modal-dialog{max-width: 68.7%;}
	
	.icon-img{max-width:100%;}
	
}   

@media (min-width:1800px){
    .mycontainer{width: 1470px;}
	
	.ele7 {max-width: 100%;}
	.ele8 {max-width: 17%;top: 56%;right: 9.5%;}
	
	.book1{max-width: 20%;left: 3%;}
	.book2{max-width: 20%;right: 2%;}

    .section2shap1 {max-width: 100%;}
    .section2shap2 {max-width: 100%;left: 100%;}

    .placeTextinner {font-size: 60px;}
    .step1-detail .step-title:before {width: 32px;top: 47%;}
    .step2-detail .step-title:after {width: 30px;top: 48%;}

    .otoimg1 {margin: 40px 0 -115px -0px;}
    .otoimg2 {margin: 10px 0 -110px 0px;}
    .otoimg3 {margin: 15px 0 -105px 0px; max-width: 104%}
    .otoimg4 {margin: 10px 0 -91px -22px; max-width: 120%}
    .otoimg5 {margin: 15px 0 -117px 0px;}
    .otoimg6 {margin: 10px 0 -91px 20px;max-width: 72%;}

    .otoBg1 {background-image: linear-gradient(#7833e3, #ba81d5e0);padding: 10% 10% 16% 10%;border: 1px solid #d5d5d5;height: 100%;}
    .otoBg2 {background-image: linear-gradient(#fff, #fff4c5d4);padding: 10% 10% 16% 10%;border: 1px solid #d5d5d5;height: 100%;}
    .otoBg3 {background-image: linear-gradient(#fff, #eae1ff);padding: 10% 10% 16% 10%;border: 1px solid #d5d5d5;height: 100%;}
    .otoBg4 {background-image: linear-gradient(#fff, #edffcf);padding: 10% 10% 16% 10%;border: 1px solid #d5d5d5;height: 100%;}
    .otoBg5 {background-image: linear-gradient(#fff, #ffe3f6);padding: 10% 10% 16% 10%;border: 1px solid #d5d5d5;}
    .otoBg6 {background-image: linear-gradient(#fff, #def8ff);padding: 10% 10% 16% 10%;border: 1px solid #d5d5d5;height: 100%;}

    .mokupimg1 {top: -3.5%;right: 6%;max-width: 19.5%;}
    .mokupimg2 {top: -5%;left: 6%;max-width: 17%;}

    .trackicon1 {top: 18.5%;left: 7%; max-width: 100%;}
    .trackicon2 {top: 16%;right: 7%; max-width: 100%;}

    .arrowtext {top: -25px;right: -5.5%; max-width: 100%;}
    .watcharrow2 {top: 24%;right: 17.5%; max-width: 100%;}

    .arrowIcon {left: -13%;top: 30%;}

	.attention {width: 92%;left: 0;}

	.checkBg-out{padding: 0 1%;}
    .adilSideImage {left: 93.5%;bottom: 0;}
	
	.poppingImg{max-width:94%;}
	
	.queimg1{max-width:100%;right: -4%;}
	
	.adilSideImage2{max-width: 21%;left:0%;}


	.checkBg-main{
		width: 44.7%;
		margin-right: 10%;
	}
	.checkBg-main ul{font-size:22px;}   
	
	.checkBg-title{font-size: 24px;}

	
	.arrow3{margin-top: -12%;}
	
	.date-section {padding: 7% 0 10% 0;}
	.liveDate{max-width: 100%;}
}

@media (min-width:1900px){
    .mycontainer-left, .mycontainer-right{max-width:1363px;}
    .mycontainer{width: 1187px;}
    .mycontainer2{width: 1370px;}


    .mainvideo {
        position: absolute;
        width: 441px; 
        top: 20px;
        left: 104px;
    }	
	
	.book1 {max-width: 21%;left: 3%;}
	.book2 {max-width: 20%;}

	
	.ele7 {max-width: 100%;}
	.ele8 {max-width: 100%;top: 54%;right: 11%;}

    .section2shap1 {max-width: 100%;}
    .section2shap2 {max-width: 100%;left: 100%;}

    .roktimg1 {max-width: 100%;top: 15%;left: 87%;}
    .section13:hover .roktimg1 {top: -12%;left: 88%;transition-duration: 0.5s;}

    .placeTextinner {font-size: 64px;}
    .step1-detail .step-title:before {width: 36px;top: 50%;}
    .step2-detail .step-title:after {width: 36px;top: 50%;}

    .otoimg1 {margin: 40px 0 -115px 0px;}
    .otoimg2 {margin: 0px 0 -90px 0px;}
    .otoimg3 {margin: 10px 0 -153px 0px;max-width: 104%}
    .otoimg4 {margin: 10px 0 -91px -12px; max-width: 118%}
    .otoimg5 {margin: 10px 0 -114px 0px;}
    .otoimg6 {margin: 10px 0 -91px 20px;max-width: 75%;}

    .otShap {background: url(../images/otShap.png) no-repeat center top;background-size: contain;padding: 0px 22px 0px 8px;}
    .otoBg1 {background: url(../images/otoBg1.png) no-repeat center top;background-size: cover;padding: 10% 10% 20% 10%;border-radius: 14px;border: none;}
    .otoBg2 {background: url(../images/otoBg2.png) no-repeat center top;background-size: cover;padding: 10% 10% 16% 10%;border-radius: 14px;border: none;}
    .otoBg3 {background: url(../images/otoBg3.png) no-repeat center top;background-size: cover;padding: 10% 10% 12.8% 10%;border-radius: 14px;border: none;}
    .otoBg4 {background: url(../images/otoBg4.png) no-repeat center top;background-size: cover;padding: 10% 10% 10.5% 10%;border-radius: 14px;border: none;}
    .otoBg5 {background: url(../images/otoBg5.png) no-repeat center top;background-size: cover;padding: 10% 10% 16% 10%;border-radius: 14px;border: none;}
    .otoBg6 {background: url(../images/otoBg6.png) no-repeat center top;background-size: cover;padding: 10% 10% 12.8% 10%;border-radius: 14px;border: none;}

    .mokupimg1 {top: -5.5%;right: 4%;max-width: 22%;}
    .mokupimg2 {top: -5%;left: 6%;max-width: 17%;}

    .trackicon1 {top: 18.5%;left: 7%; max-width: 100%;}
    .trackicon2 {top: 18%;right: 7%; max-width: 100%;}

    .trophy2 {top: -2.5%;right: 5%; max-width: 100%;}

    .introicon1 {top: 17.5%;left: 8%;max-width: 100%;}
    .introicon2 {top: 1.5%;right: 8%;max-width: 100%;}

    .arrowtext {top: -25px;right: -5.5%; max-width: 100%;}
    .watcharrow2 {top: 24%;right: 19.5%; max-width: 100%;}

    .iMac {top: 1.5%; right: 0; max-width: 100%;}
    .handimg {left: 0;top: 6.5%; max-width: 100%;}

    .queicon1 {max-width: 100%;top: 30%;left: 4%;}
    .queicon2 {max-width: 100%;top: 42%;left: 22%;}
    .queicon3 {max-width: 100%;top: 18%;right: 35%;}
    .queicon4 {max-width: 100%;top: 32%;right: 5%;}

    /*btn*/

    input.submitBt {font-size: 18px;}
    button.submitBt2 {font-size: 18px;}
	button.submitBt6 {font-size: 12px;}
	button.submitBt6, .affiliateText{font-size: 22px;}
    .submitBt3 a {font-size: 18px;}
    .submitBt4 a {font-size: 18px;}
    .submitBt5 button {font-size: 17px;}

    .create-title {font-size: 24px;}

    .arrowIcon {left: -12%;top: 30%;}

	.attention {width: 105%;left: -12%;}

	.checkBg-out{padding: 0 3.6%;}
    .adilSideImage {left: 93.5%;bottom: 0;}
	
	.poppingImg{max-width:94%;}
	
	.queimg1{max-width:100%;right:0%;}
	
	.adilSideImage2{max-width:100%;left:0%;}

	.checkBg-main{
		width: 44.7%;
		margin-right: 10%;
	}
	.checkBg-main ul{font-size:22px;}   
	
	.checkBg-title{font-size: 24px;}
	
	.arrow3{margin-top: -12%;}
	
	.date-section {padding: 7% 0 10% 0;}
	.liveDate{max-width: 100%;}
    
}

@media (min-width:2000px){
}

    
.mt0{margin-top:0%;}.mt1{margin-top:1%;}.mt2{margin-top:2%;}.mt3{margin-top:3%;}.mt4{margin-top:4%;}.mt5{margin-top:5%;}.mt6{margin-top:6%;}.mt7{margin-top:7%;}
.mt8{margin-top:8%;}.mt9{margin-top:9%;}.mt10{margin-top:10%;}.mt11{margin-top:11%;}.mt12{margin-top:12%;}.mt13{margin-top:13%;}.mt14{margin-top:14%;}.mt15{margin-top:15%;}.mt17{margin-top:17%;}.mt20{margin-top:20%;}.mt22{margin-top:22%;}.mt26{margin-top:26%;}.mt28{margin-top:28%;}.mtm14{margin-top:-14%;}.mtm4{margin-top:-4%;}.mtm1{margin-top:-1%;}.mtm2{margin-top:-2%;}.mtm3{margin-top:-3%;}.mtm6{margin-top:-6%;}.mtm8{margin-top:-8%;}.mtm9{margin-top:-9%;}.mtm20{margin-top:-20%;}.mtm12{margin-top:-12px;}.mtm40{margin-top:-40px;}


/* *** *** */
.largeShap {
    background-size: 100% 100%;
}

/* **** Affiliate Link Toasts **** */
.toast-container {
    bottom: 10px;
    right: 10px;
    max-width: 260px;
    width: fit-content;
    z-index: 100;
    background: white;
    border-radius: 10px;
    opacity: 1;
}
.successToast {
    box-shadow: 0 0 20px rgb(40 167 69 / 80%), inset 0 0 10px rgb(40 167 69 / 50%);
}
.failedToast {
    box-shadow: 0 0 20px rgb(220 53 69 / 80%), inset 0 0 10px rgb(220 53 69 / 50%);
}
.toast-container .toast-header {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    position: relative;
}
.toast-container .btn-close {
    border: 0;
    background-color: #28a745;
    border-radius: 4px;
    position: absolute;
    right: -5px;
    top: -5px;
    outline: none;
}
.successToast .btn-close {
    background-color: #28a745;
}
.failedToast .btn-close {
    background-color: #dc3545;
}
.responsive-video .video-autoplay-paused .video-autoplay-overlay-lines, .bnr-vid .video-autoplay-overlay {
    background-color: rgba(0,0,0,0.0) !important;
}
/* **** Page Loader **** */
.page-loader {
    position: fixed;
    z-index: 9999999;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background-color: Black;
    filter: alpha(opacity=60);
    opacity: 0.6;
    -moz-opacity: 0.8;
}
.page-loader-center {
    z-index: 9999999;
    margin: 300px auto;
    padding: 50px 0 0 134px;
    width: 375px;
    height: 200px;
    background-color: White;
    border-radius: 10px;
    filter: alpha(opacity=100);
    opacity: 1;
    -moz-opacity: 1;
}
.page-loader-center img {
    height: 100px;
    width: 100px;
}
@media (max-width: 425px) {
    .page-loader-center {
        padding: 50px 0 0 75px;
        width: 250px;
    }
}
/* ***** Modal Goto Button ***** */
.gotoBtn {
    width: 100%;
}
.gotoBtn .generator {
    font-size: 20px;
    cursor: pointer;
    border: none;
    border-radius: 6px;
    background-color: rgb(255, 199, 0);
    color: #000;
    margin: 20px 0 0 0;
    transition: .2s;
    outline: none;
    text-transform: uppercase;
    transition-duration: 0.3s;
    display: inline-block;
    width: 31%;
    padding: 2% 5px;
}
.gotoBtn .generator:hover {
    transform: scale(1.01);
    transition-duration: 0.3s;
}
@media (max-width: 1599px) {
    .gotoBtn .generator {
        font-size: 16px;
    }
}
@media (max-width: 1399px) {
    .gotoBtn .generator {
        font-size: 15px;
    }
}
@media(max-width: 1299px) {
    .col-lmd-12 {
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }
}
@media (max-width: 1199px) {
    .gotoBtn .generator {
        font-size: 16px;
    }
}
@media (max-width: 991px) {
    .gotoBtn .generator {
        font-size: 15px;
    }
}
@media (max-width: 767px) {
    .gotoBtn .generator {
        width: 40%;
        margin: 10px 0 0 0;
    }
    #myModal2 {
        padding: 0px 15px !important;
    }
}
@media (max-width: 550px) {
    .gotoBtn .generator {
        font-size: 11px;
    }
}
/* **** Locked Menu **** */
.nav-item .nav-link.locked {
    cursor: not-allowed;
/*    pointer-events: none;*/
}
.nav-item .nav-link.locked:hover .tooltip {
    opacity: 1;
    visibility: visible;
}
.nav-item .nav-link .tooltip {
    font-size: 16px;
    font-weight: 700;
    min-width: 205px;
    bottom: -60px;
    background: #c7b9ff;
    top: auto;
    border-radius: 8px;
    border: 4px solid #b83b7b;
    visibility: hidden;
    text-align: center;
    transition: all 0.5s ease-in-out;
    right: 10px;
    color: #b83b7b;
}

.nav-item .nav-link .tooltip-direction {
    position: relative;
    padding: 8px 15px;
    display: block;
}
.nav-item .nav-link .tooltip-direction:after {
    content: '';
    position: absolute;
    left: unset;
    transform: rotate(45deg);
    top: -10px;
    margin-left: 0px;
    border-width: 7px;
    border-style: solid;
    border-color: #b83b7b transparent transparent #b83b7b !important;
}
@media (max-width: 1035px){
    .navbar-light .navbar-nav .nav-link {
        padding-left: 15px;
        padding-right: 15px;
    }
}
@media(max-width: 991px) {
    .nav-item .nav-link .tooltip {
        left: 0px;
        right: 90px;
        max-width: fit-content;
        margin: auto;
    }
}

@media (max-width: 767px){
    .stepForm2, .stepVideo, .stepForm5, .stepForm {
        margin-top: 25px;
    }
    .arrowtext {
        width: 98px;
        right: -10%;
    }
    .checklist2 li {
        padding: 20px;
        margin: 15px 0px !important;
        display: block;
    }
    .checklist2 li:hover {
        transform: scale(1.01);
    }
    .checklist2 li span {
        background: url(../images/checklist3.png) no-repeat left center;
        padding-left: 22px;
    }
    .checklist2B li span {
        padding-top: 3%;
        padding-bottom: 3%;
    }
    .checkBox-botm {
        padding: 0 5px;
        margin-top: -10px;
    }
    .queimg1 {
        margin-top: 0%;
    }
}
@media (min-width: 575px) and (max-width: 767px) {
    .section10 .mycontainer {
        margin-top: 50px;
    }
}
@media(max-width: 675px){
    .arrowtext {
        right: -3%;
        top: -55px;
    }
}
@media(max-width: 590px){
    .arrowtext {
        right: 0%;
        width: auto;
        position: unset;
    }
    .arrowtext .watchtext {
        transform: skewY(0deg);
        line-height: 100%;
        height: auto;
    }
}