html {
  scroll-behavior: smooth;
}


/*Fonts*/
@font-face {font-family: KG Blank Space Sketch; src: url('../font/KGBlankSpaceSketch.ttf'); } 
@font-face {font-family: Circular Std Black; src: url('../font/Circular Std Black.ttf'); } 
@font-face {font-family: Circular Std Book; src: url('../font/Circular Std Book.ttf'); } 
@font-face {font-family: Circular Std Bold; src: url('../font/Circular Std Bold.ttf'); } 
@font-face {font-family: Circular Std Medium; src: url('../font/Circular Std Medium.ttf'); } 

.KGBlankSpaceSketch{
	font-family: 'KG Blank Space Sketch';
}
.CircularStdBlack{
	font-family: 'Circular Std Black';
}
.CircularStdBook{
	font-family: 'Circular Std Book';
}
.CircularStdBold{
	font-family: 'Circular Std Bold';
}
.CircularStdMedium{
	font-family: 'Circular Std Medium';
}


.londrina{
	font-family: 'Londrina Solid', cursive;
}



/*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;}



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

 ul{
	padding:0px;
	list-style:none;
	margin:0px;
}
.ls1{letter-spacing:1px;}
.ls2{letter-spacing:2px;}
.ls4{letter-spacing:4px;}
.ls-02{letter-spacing:-0.2px;}
.ls-01{letter-spacing:-0.5px;}
.ls-1{letter-spacing:-1px;}
.ls-2{letter-spacing:-2px;}
.ls-3{letter-spacing:-3px;}
.ls-4{letter-spacing:-4px;}

.padding0 {padding: 0px;}
.padding1 {padding: 0 1%;}
.padding2 {padding: 0 2%;}
.padding3 {padding: 0 3%;}


@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;}

.xsmt0{margin-top:0%;}.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%;}.xsmt30{margin-top:30%;}
.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-5{margin-top:-5%;}


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

  
.swiper-slide .titleBg18 h4{font-size: 6px;}
.swiper-slide.swiper-slide-active .titleBg18 h4{font-size: 12px;}


.bnr-vid {
    width: 75.25%;
    position: static;
    overflow: hidden;
    text-align: left;
    padding-bottom: 42.5%;
    margin: auto;
    margin-top: 6.7%;
}

}


@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;}.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;}.sm34 {font-size: 34px;}.sm35 {font-size: 35px;}.sm37 {font-size: 37px;}.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-10{margin-top:-10%;}
.lmt-11{margin-top:-11%;}
.lmt-13{margin-top:-13%;}
.lmt-20{margin-top:-20%;}
.lmb0{margin-bottom:0%;}
.lmb1{margin-bottom:1%;}
.lmb3{margin-bottom:3%;}
.lmb7{margin-bottom:7%;}
.lmb10{margin-bottom:10%;}
.lmb15{margin-bottom:15%;}
.lmb20{margin-bottom:20%;}

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

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

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




.lappysection {position: relative;bottom: -113px;margin-top: -90px !important;}

.lappysection2{    position: relative;bottom: -480px;margin-top: -566px !important;}

.mycontainer{width:750px;}
.mycontainer1{width:750px;}
.mycontainer2{width:750px;}
.mycontainer3{width:750px;}

.mycontainer-right{width:750px;}
.mycontainer-left{width:750px;}



.swiper-slide .titleBg18 h4{font-size: 10px;}
.swiper-slide.swiper-slide-active .titleBg18 h4{font-size: 18px;}




}

@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;}.md67 {font-size: 67px;}.md60{font-size: 60px;}.md75 {font-size: 75px;}.md70 {font-size: 70px;}.md80 {font-size: 80px;}.md84 {font-size: 84px;}.md90{font-size: 90px;}.md120{font-size: 120px;}.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%;}
.mmt9{margin-top:9%;}
.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:970px;}
.mycontainer1{width:922px;}
.mycontainer2{width:922px;}
.mycontainer3{width:922px;}

.mycontainer-right{width:922px;}
.mycontainer-left{width:922px;}

.swiper-slide .titleBg18 h4{font-size: 10px;}
.swiper-slide.swiper-slide-active .titleBg18 h4{font-size: 18px;}


}

@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: 16px;}.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;}.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;}.lg55 {font-size: 55px;}.lg56 {font-size: 56px;}.lg58 {font-size: 58px;}.lg67 {font-size: 67px;}.lg60{font-size: 60px;}.lg64{font-size: 64px;}.lg71 {font-size: 71px;}.lg70 {font-size: 70px;}.lg80 {font-size: 80px;}.lg84 {font-size: 84px;}.lg100 {font-size: 100px;}.lg150 {font-size: 150px;}.lg210 {font-size: 240px;}

.lappysection {position: relative;bottom: -125px;margin-top: -90px !important;}


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

.lgmb0{margin-bottom:0%;}
.lgmb2{margin-bottom:2%;}
.lgmb4{margin-bottom:4%;}
.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%;}
.lgmt0{margin-top:0%;}
.lgmt4{margin-top:4%;}
.lgmt5{margin-top:5%;}
.lgmt6{margin-top:6%;}
.lgmt10{margin-top: 10%;}
.lgmt13{margin-top:13%;}
.lgmt15{margin-top:15%;}
.lgmt20{margin-top:20%;}
.lgmt26{margin-top:26%;}
.lgmt29{margin-top:29%;}

.bnr-vid {
    width: 73.25%;
    padding-bottom: 41.5%;
}

.swiper-slide .titleBg18 h4{font-size: 16px;}
.swiper-slide.swiper-slide-active .titleBg18 h4{font-size: 22px;}

}

@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: 44px;}.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;}.xl76 {font-size: 76px;}.xl70 {font-size: 70px;}.xl80 {font-size: 80px;}.xl87 {font-size: 87px;}.xl170 {font-size: 170px;}.xl210 {font-size: 240px;}

.xlmt4{margin-top:4%;}

 


}

.purple{color:#443949;}
.gray{color:#545353;}



.video-autoplay {
    overflow: hidden;
}

.responsive-video {
    padding-bottom: 56.21%;
    overflow: hidden;
    position: relative;
    z-index: 3;
}

.section25 .responsive-video{padding-bottom: 48.21%;}

.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;
}



.video-box {
    position: relative;
    display: -webkit-box;
    padding: 0 0% 0 1.5%;
}


.mainvideo-box {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    padding: 0%;
    text-align: center;
}

.video-box-demo{position:relative;text-align: left;padding: 2% 0;}

.video-img {
    position: relative;
}

.mainvideo-section {
    margin: auto;
    width: 76%;
    padding-top: 6%;
}


.autoplayer-subarea-16-by-9 {
    padding-bottom: 56.25% !important;
}
.autoplayer-subarea {
    background-color: #121212 !important;
}

.demo-video {
    padding: 6% 4%;
}


.mycontainer{margin:auto;}
.mycontainer1{margin:auto;}

.mycontainer-right{margin-left:auto;}
.mycontainer-left{margin-right:auto;}

.italic {
    font-style: italic;
}

.upper{text-transform:uppercase}

.underline {text-decoration: underline;}
.underline1{border-bottom:1px solid;}

/*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: 170%;}.lh170 {line-height: 170%;}.lh180 {line-height: 180%;}.lh190 {line-height: 190%;}.lh200 {line-height: 200%;}.lh210 {line-height: 210%;}.lh230 {line-height: 230%;}




.clear {
    clear: both;
}



.mybutton1 a {
    border-radius: 60px;
    background: url(../images/button.png) no-repeat center center;
    background-size: contain;
    color: #000000;
    padding: 3.8% 6.5% 3.6% 8%;
    display: table;
    margin: auto;
    transition: 0.5s;
    position: relative;
    z-index: 2;
    overflow: hidden;
    font-family: 'Circular Std Black';
}
.mybutton1 a:hover {
    box-shadow:none;	
	transform: scale(1.05);	
}

.mybutton2 a {
    border-radius: 60px;
    background: url(../images/button2.png) no-repeat center center;
    background-size: contain;
    color: #000000;
    padding: 3.8% 7.5% 3.6% 8%;
    display: table;
    margin: auto;
    transition: 0.5s;
    position: relative;
    z-index: 2;
    overflow: hidden;
    font-family: 'Circular Std Black';
}
.mybutton2 a:hover {
    box-shadow:none;	
	transform: scale(1.05);	
}

.mybutton3 a {
    background: url(../images/button3.png) no-repeat center center;
    background-size: contain;
    color: #000;
    padding: 7% 6.5% 10.6% 8%;
    display: table;
    margin: auto;
    transition: 0.5s;
    position: relative;
    z-index: 2;
    overflow: hidden;
    font-family: 'Circular Std Black';
    width: 100%;
}
.mybutton3 a:hover {
    box-shadow:none;	
	transform: scale(1.05);	
}


.arrow1{
	-webkit-animation: bounceRight 2s infinite;
    animation: bounceRight 2s infinite;
}

.arrow2, .arrow8{
	-webkit-animation: bounceDown 2s infinite;
    animation: bounceDown 2s infinite;	
}


/* right bounce */
@-webkit-keyframes bounceRight {
  0%,
  20%,
  50%,
  80%,
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  40% {
    -webkit-transform: translateX(-15px);
    transform: translateX(-15px);
  }
  60% {
    -webkit-transform: translateX(-15px);
    transform: translateX(-15px);
  }
}
@-moz-keyframes bounceRight {
  0%,
  20%,
  50%,
  80%,
  100% {
    transform: translateX(0);
  }
  40% {
    transform: translateX(-15px);
  }
  60% {
    transform: translateX(-15px);
  }
}
@keyframes bounceRight {
  0%,
  20%,
  50%,
  80%,
  100% {
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  40% {
    -ms-transform: translateX(-15px);
    transform: translateX(-15px);
  }
  60% {
    -ms-transform: translateX(-15px);
    transform: translateX(-15px);
  }
}
/* /right bounce */

/* Down bounce */
@-webkit-keyframes bounceDown {
  0%,
  20%,
  50%,
  80%,
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }
  60% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}
@-moz-keyframes bounceDown {
  0%,
  20%,
  50%,
  80%,
  100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-15px);
  }
  60% {
    transform: translateY(-15px);
  }
}
@keyframes bounceDown {
  0%,
  20%,
  50%,
  80%,
  100% {
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -ms-transform: translateY(-15px);
    transform: translateY(-15px);
  }
  60% {
    -ms-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}
/* /Down bounce */








.checklist1, .checklist2{margin-top: 14%;}

.checklist1 li {
    background: url(../images/checklist1.png) no-repeat 25px 5px;
    padding-left: 65px;
    list-style: none;
    margin-left: 0px;
    padding-top: 0;
    padding-bottom: 4%;
    margin-top: 4%;
    background-color: #ffffff;
    border-bottom-right-radius: 225px 15px;
    border-bottom-left-radius: 15px 255px;
    border-bottom: solid 3px #ebebec;
}
.checklist1 li:last-child{border-bottom: 0px;}

.checklist2 li {
    background: url(../images/checklist2.png) no-repeat no-repeat 25px 5px;
    padding-left: 65px;
    list-style: none;
    margin-left: 0px;
    padding-top: 0;
    padding-bottom: 4%;
    margin-top: 4%;
    background-color: #ffffff;
    border-bottom-right-radius: 225px 15px;
    border-bottom-left-radius: 15px 255px;
    border-bottom: solid 3px #ebebec;
}
.checklist2 li:last-child{border-bottom: 0px;}

.unchecklist1{
    text-align: center;
}
.unchecklist1 li {
    border-width: 1px;
    border-color: rgb(255, 0, 0);
    border-style: solid;
    border-radius: 6px;
    display: block;
    padding: 11px 31px 12px 21px;
    margin: 0;
    background-color: rgb(255 0 0 / 6%);
    width: 100%;
}
.unchecklist1 li .list {
    background: url(../images/unchecklist1.png) no-repeat 0 8px;
    padding-left: 34px;
    list-style: none;
    margin-left: 0px;
    padding-top: 0;
    padding-bottom: 0;
    padding-right: 0;
    margin-top: 0;
    text-align: left;
    display: inline-block;
}



.without-checklist {
    margin-top: 6%;
}
.without-checklist li {
    background: url(../images/withoutCheck.png) no-repeat left 4px;
    padding-left: 55px;
    list-style: none;
    margin-left: 0px;
    padding-top: 0;
    padding-bottom: 2.8%;
    margin-top: 2.8%;
}

.with-checklist{
    margin-top: 6%;	
}
.with-checklist li {
    background: url(../images/withCheck.png) no-repeat left 4px;
    padding-left: 52px;
    list-style: none;
    margin-left: 0px;
    padding-top: 0;
    padding-bottom: 2.8%;
    margin-top: 2.8%;
}



.pro-box{
	padding: 0px;
    border: 3px solid #ffbbc9;
	border-radius: 23px;
	box-shadow: 0px 2px 87px 0px rgba(168, 134, 106, 0.25)
}

.silver-top {
    background: url(../images/silverBg.png) no-repeat center center;
	background-size:cover;
    padding: 8% 4% 9% 4%;
    z-index: 1;
    background-color: #cfcfcf;
    text-align: center;
    border-radius: 35px;
}
.gold-top {
	background: url(../images/goldBg.png) no-repeat center center;
	background-size:cover;
	padding: 8% 4% 5% 4%;
	z-index: 1;
	background-color: #f7df95;
	text-align:center;
    border-radius: 35px;
}
.bundle-top {
    background: url(../images/bundleBg.png) no-repeat center center;
	background-size:cover;
    padding: 8% 4% 5% 4%;
    z-index: 1;
    background-color: #5a38f9;
    text-align: center;
    position: relative;
}




.pro-center {
    padding: 4% 10%;
    position: relative;
    margin: auto;
    border-bottom: 1px dashed #cccccc;
}

.table-box2 .pro-center, .table-box3 .pro-center {
    border-bottom: 1px dashed #453a77;
}

.table-box-out2 .pro-center{}

ul.price-checklist2 {
    padding-left: 13px;
}
.price-checklist1 li {
    background: url(../images/check1.png) no-repeat 40px 5px;
    padding-left: 80px;
    list-style: none;
    margin-left: 0;
    padding-top: 0px;
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 1px solid rgb(205, 195, 209);
}
.price-checklist2 li.last {
    border-bottom: 0px;
}
.price-unchecklist1 li {
    background: url(../images/uncheck2.png) no-repeat 40px 5px;
    padding-left: 80px;
    list-style: none;
    margin-left: 0;
    padding-top: 0px;
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 1px solid rgb(205, 195, 209);
}
.table-box-out2 .price-checklist1 li:last-child, .price-unchecklist1 li:last-child {
    border-bottom: 0px;
}
.price-unchecklist-bonus {
    padding-left: 8%;
}

.price-checklist-bonus {
    padding-left: 8%;
}


ul.price-checklist3 {
    padding-left: 13px;
}
.price-checklist3 li {
    background: url(../images/check3.png) no-repeat left top;
    padding-left: 39px;
    list-style: none;
    margin-left: 0px;
    padding-top: 0px;
    padding-bottom: 17px;
    margin-bottom: 17px;
    border-bottom:1px solid #f1f1f1;
}

.pro-box li.last, .price-checklist3 li.last {border-bottom:0px;}

.coupon {
    border: 2px dashed rgb(255, 91, 109);
    border-radius: 5px;
    display: inline-block;
    color: rgb(255, 91, 109);
    padding: 2% 4%;
}
.text-bg {
    background: url(../images/textBg.png) no-repeat center center;
    padding: 12px 12px;
    color: #fff;
    display: inline-block;
}

.lite-title {
    background-color: #eff1f3;
    width: 108%;
    margin-left: -4%;
    padding: 4% 0;
    text-align: center;
    margin-bottom: 6%;
}
.pro-title{background-image: linear-gradient(to right, #f87a5c , #ff436f);width: 108%;margin-left: -4%;padding: 4% 0;margin-bottom: 6%;text-align: center;color: #fff;}



.table-box-out1 {
    padding: 0 4% 0 8%;
}
.table-box-out2{
    padding: 0 8% 0 4%;
}

.table-box1 {
    padding: 0;
    padding-bottom: 0;
    margin-top: 0;
}
.table-box2 {
    border-width: 1px;
    border-color: rgb(166, 121, 251);
    border-style: solid;
    border-radius: 40px;
    background-image: -moz-linear-gradient( 90deg, rgb(99,49,239) 0%, rgb(137,80,246) 100%);
    background-image: -webkit-linear-gradient( 90deg, rgb(99,49,239) 0%, rgb(137,80,246) 100%);
    background-image: -ms-linear-gradient( 90deg, rgb(99,49,239) 0%, rgb(137,80,246) 100%);
    box-shadow: 0px 17px 65px 0px rgb(0 0 0 / 27%);
    padding: 0;
    padding-bottom: 8%;
}
.table-box3 {
    padding: 0;
    padding-bottom: 8%;
    border-radius: 40px;
    background-color: #231b48;
    overflow: hidden;
}

.pro-top{
    padding: 0;
}


.pro-title-box{
    padding: 19% 7% 12% 7%;
    position: relative;
    background: url(../images/table1Bg.png) no-repeat center top;
    background-size: cover;
}
.pro-title-box2{
    padding: 19% 7% 12% 7%;
    position: relative;
    background: url(../images/table2Bg.png) no-repeat center top;
    background-size: cover;
}

.pro-list {
    background: url(../images/listBg.png) no-repeat center top;
    background-size: cover;
    background-color: #f9f7f6;
    border-radius: 0;
    padding: 6% 7% 9% 7%;
    position: relative;
}

.title23:before {
    border-color: rgba(57, 54, 225, 0) !important;
    border-top-color: #7b45f3 !important;
    border-width: 15px !important;
    margin-left: -21px;
}
.title23:after {
    border-color: rgba(255, 255, 255, 0) !important;
    border-top-color: #ffffff !important;
    border-width: 14px !important;
    margin-left: -20px;
}
.title23:after, .title23:before {
    top: 100%;
    left: 51%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.tableBottom{width:100%;}

/**/
.title1 {
    border-width: 2px;
    border-color: rgb(255, 255, 255);
    border-style: dashed;
    background-color: rgb(234, 57, 76);
    box-shadow: 0px 7px 13px 0px rgb(0 0 0 / 17%);
    display: inline-block;
    padding: .2% 3.8%;
    position: relative;
    color: #fff;
}



.titleBg1 {
    background: url(../images/titleBg1.png) no-repeat center center;
    background-size: contain;
    color: #fff;
    padding: 4.5% 1% 4.5% 1%;
    display: inline-block;
    text-align: center;
    margin-top: 1%;
    letter-spacing: 1px;
}
.titleBg2 {
    background: url(../images/titleBg2.png) no-repeat center center;
    background-size: contain;
    padding: 2% 0 2.5% 0;
    display: inline-block;
    text-align: center;
}
.titleBg3 {
    background: url(../images/titleBg3.png) no-repeat center center;
    background-size: contain;
    padding: 0;
    display: inline-block;
    text-align: center;
}
.titleBg4 {
    background: url(../images/titleBg4.png) no-repeat center center;
    background-size: contain;
    padding: 0px 7px;
    display: inline-block;
    text-align: center;
    color: #000000;
}
.titleBg5 {
    background: url(../images/titleBg5.png) no-repeat center center;
    background-size: contain;
    padding: 2.5% 0;
    display: inline-block;
    color: #ffffff;
}
.titleBg6 {
    background: url(../images/titleBg6.png) no-repeat center center;
    background-size: contain;
    padding: 1.5% 0 2% 0;
    display: inline-block;
    color: #ffffff;
}
.titleBg7 {
    background: url(../images/titleBg7.png) no-repeat center center;
    background-size: cover;
    padding: 0 20px;
    display: inline-block;
}
.titleBg8 {
    background: url(../images/titleBg8.png) no-repeat center center;
    background-size: contain;
    padding: 1% 7%;
    display: inline-block;
    color: #fff;
}
.titleBg9 {
    background: url(../images/titleBg9.png) no-repeat center center;
    background-size: contain;
    padding: 1% 7%;
    display: inline-block;
    color: #fff;
}

.titleBg10 {
    background: url(../images/titleBg10.png) no-repeat center center;
    background-size: contain;
    padding: 1% 7%;
    display: inline-block;
    color: #fff;
}
.titleBg11 {
    background: url(../images/titleBg11.png) no-repeat center center;
    background-size: contain;
    padding: 1% 7%;
    display: inline-block;
    color: #fff;
}

.titleBg12 {
    background: url(../images/titleBg12.png) no-repeat center center;
    background-size: contain;
    padding: 1% 7%;
    display: inline-block;
    color: #fff;
}
.titleBg13 {
    background: url(../images/titleBg13.png) no-repeat center center;
    background-size: contain;
    padding: 1% 7%;
    display: inline-block;
    color: #fff;
}

.titleBg14 {
    background: url(../images/titleBg14.png) no-repeat center center;
    background-size: contain;
    padding: 1% 7%;
    display: inline-block;
    color: #292929;
}
.titleBg15 {
    background: url(../images/titleBg15.png) no-repeat center center;
    background-size: contain;
    padding: 1% 7%;
    display: inline-block;
    color: #292929;
}
.titleBg16{
	background: url(../images/titleBg16.png) no-repeat center center;
	background-size: contain;
	padding: 1.7% 0 2.2% 0;
	display: inline-block;
	text-align: center;
	color: #fff;
}
.titleBg17{
	background: url(../images/titleBg17.png) no-repeat center center;
	background-size: contain;
	padding: 2.3% 0 3% 0;
	display: inline-block;
	text-align: center;
	color: #fff;
}
.titleBg18 {
    background: url(../images/titleBg18.png) no-repeat center center;
    background-size: contain;
    padding: 2.8% 0 2% 0;
    display: inline-block;
    text-align: center;
    color: #000000;
    margin-top: 4%;
}
.titleBg19 {
    background: url(../images/titleBg19.png) no-repeat center center;
    background-size: contain;
    padding: 2.1% 0 2.4% 0;
    display: inline-block;
    text-align: center;
    color: #000000;
}
.titleBg20 {
    background: url(../images/titleBg20.png) no-repeat center center;
    background-size: contain;
    padding: 0px 12px;
    display: inline-block;
    text-align: center;
    color: #000000;
}
.titleBg21 {
    background: url(../images/titleBg21.png) no-repeat center center;
    background-size: contain;
    padding: 3.2% 0 3.5% 0;
    display: inline-block;
    text-align: center;
    color: #ffffff;
}
.titleBg22 {
    background: url(../images/titleBg22.png) no-repeat center center;
    background-size: contain;
    padding: 2px 0;
    display: inline-block;
    text-align: center;
    color: #1a1325;
}
.titleBg23 {
    background: url(../images/titleBg23.png) no-repeat center center;
    background-size: contain;
    padding: 2.6% 0 3% 0;
    display: inline-block;
    text-align: center;
    color: #fff;
}
.titleBg24 {
    background: url(../images/titleBg24.png) no-repeat center center;
    background-size: contain;
    padding: 0px 10px 0px 10px;
    display: inline-block;
    text-align: center;
    color: #ffffff;
}
.titleBg25 {
    background: url(../images/titleBg25.png) no-repeat center center;
    background-size: contain;
    padding: 0;
    display: inline-block;
    text-align: center;
    color: #1a1325;
    margin-top: 4%;
}
.titleBg26 {
    background: url(../images/titleBg26.png) no-repeat center center;
    background-size: contain;
    padding: 0;
    display: inline-block;
    text-align: center;
    color: #1a1325;
    margin-top: 4%;
}
.titleBg27 {
    background: url(../images/titleBg27.png) no-repeat center center;
    background-size: contain;
    padding: 2.1% 0 2.5% 0;
    display: inline-block;
    text-align: center;
    color: #fff;
}
.titleBg28 {
    background: url(../images/titleBg28.png) no-repeat center center;
    background-size: contain;
    padding: 2.1% 0 2.5% 0;
    display: inline-block;
    text-align: center;
    color: #fff;
}
.titleBg29 {
    background: url(../images/titleBg29.png) no-repeat center center;
    background-size: contain;
    padding: 2.1% 0 2.5% 0;
    display: inline-block;
    text-align: center;
    color: #fff;
}
.titleBg30 {
    background: url(../images/titleBg30.png) no-repeat center center;
    background-size: contain;
    padding: 0 8px;
    display: inline-block;
    text-align: center;
}
.titleBg31 {
    background: url(../images/titleBg31.png) no-repeat center center;
    background-size: contain;
    padding: 2.1% 0 2.5% 0;
    display: inline-block;
    text-align: center;
    color: #fff;
}
.titleBg32 {
    background: url(../images/titleBg32.png) no-repeat center center;
    background-size: contain;
    padding: 2% 0 2.2% 0;
    display: inline-block;
    text-align: center;
    color: #000000;
}
.titleBg33 {
    background: url(../images/titleBg33.png) no-repeat center center;
    background-size: contain;
    padding: 0 10px;
    display: inline-block;
    text-align: center;
    color: #000000;
}
.titleBg34 {
    background: url(../images/titleBg34.png) no-repeat center center;
    background-size: contain;
    padding: 2.4% 0 2.8% 0;
    display: inline-block;
    text-align: center;
    color: #ffffff;
}
.titleBg35 {
    background: url(../images/titleBg35.png) no-repeat center center;
    background-size: contain;
    padding: 5px 0;
    display: inline-block;
    text-align: center;
    color: #000000;
    margin-top: 3%;
}
.titleBg36 {
    background: url(../images/titleBg36.png) no-repeat center center;
    background-size: contain;
    padding: 0px 0;
    display: inline-block;
    text-align: center;
    color: #fff;
    margin-top: 4%;
}
.titleBg37 {
    background: url(../images/titleBg37.png) no-repeat center center;
    background-size: contain;
    padding: 2px 0;
    display: inline-block;
    text-align: center;
    color: #000;
    margin-top: 3%;
}
.titleBg38 {
    background: url(../images/titleBg38.png) no-repeat center center;
    background-size: contain;
    padding: 0px 15px;
    display: inline-block;
    text-align: center;
    color: #000;
    margin-top: 3%;
}
.titleBg39 {
    background: url(../images/titleBg39.png) no-repeat center center;
    background-size: contain;
    padding: 2.5% 0 2.8% 0;
    display: inline-block;
}
.titleBg40 {
    background: url(../images/titleBg40.png) no-repeat center center;
    background-size: contain;
    padding: 2.5% 0 2.8% 0;
    display: inline-block;
    color: #fff;
}
.titleBg41 {
    background: url(../images/titleBg41.png) no-repeat center center;
    background-size: contain;
    padding: 2.1% 0 2.6% 0;
    display: inline-block;
    color: #fff;
}

.gradient-text{
	background: linear-gradient(to right, #ff61d3 , #9d2aff, #00f0ff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;	
}
.gradient-text2{
	background: linear-gradient(to right, #8950f6 , #6331ef);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;	
}

.gradient-border{border: 0px;border-bottom: 2px solid;border-image: linear-gradient(to right, #ff61d3 , #9d2aff, #00f0ff);border-image-slice: 1;color: white;margin: auto;text-decoration: none;}

/*top*/
.clockIcon{
    position: relative;
    margin-top: -8px;	
}

/*banner*/

.arrow6{
    position: absolute;
    left: 16%;
    margin-top: 1%;
}
.arrow7{
    position: absolute;
    left: 11%;
    margin-top: 1%;
}


/*section2*/

.section2-mail-box{
    padding: 0 5%;
}

.section2-box-out{
    padding: 2.8% 3%;
}
.section2-box {
    padding: 22% 8% 9% 8%;
    display: inline-block;
    text-align: center;
    margin: 0;
    height: 100%;
}

.section2-box1{background: url(../images/section2Bg1.png) no-repeat center top;background-size: cover;}
.section2-box2{background: url(../images/section2Bg2.png) no-repeat center top;background-size: cover;}
.section2-box3{background: url(../images/section2Bg3.png) no-repeat center top;background-size: cover;}
.section2-box4{background: url(../images/section2Bg4.png) no-repeat center top;background-size: cover;}
.section2-box5{background: url(../images/section2Bg5.png) no-repeat center top;background-size: cover;}
.section2-box6{background: url(../images/section2Bg6.png) no-repeat center top;background-size: cover;}
.section2-box7{background: url(../images/section2Bg7.png) no-repeat center top;background-size: cover;}
.section2-box8{background: url(../images/section2Bg8.png) no-repeat center top;background-size: cover;}
.section2-box9{background: url(../images/section2Bg9.png) no-repeat center top;background-size: cover;}
.section2-box10{background: url(../images/section2Bg10.png) no-repeat center top;background-size: cover;}
.section2-box11{background: url(../images/section2Bg11.png) no-repeat center top;background-size: cover;}
.section2-box12{background: url(../images/section2Bg12.png) no-repeat center top;background-size: cover;}
.section2-box13{background: url(../images/section2Bg13.png) no-repeat center top;background-size: cover;}
.section2-box14{background: url(../images/section2Bg14.png) no-repeat center top;background-size: cover;}
.section2-box15{background: url(../images/section2Bg15.png) no-repeat center top;background-size: cover;}

.section2-box h4 {margin-top: 8%;}
.section2-box p {margin-top: 3%;}



/*section4*/
.section4-box{margin: 2% 0;}

.testi-box-out{margin: 0% 0;padding: 0 .5%;}

.testi-box{
	padding: 0;
}
.testi-box2{
	background: url(../images/videoTestiBg2.png) no-repeat center center;
    background-size: contain;
	padding: 3% 1%;
}
.testi-video{
	background: url(../images/mobBg.png) no-repeat center center;
	background-size: contain;
    padding: 6% 9% 5% 9%;
}
.testi-video2{
	background: url(../images/mobBg2.png) no-repeat center center;
	background-size: contain;
}
.testi-video .responsive-video {
    padding-bottom: 56.21%;
    border-radius: 0;
    margin-top: 0;
}

.testi-box-text {
    margin-top: 2%;
}
.testi-box-out {
}


/*section5*/
.section5-sec1{
	background: url(../images/section5Sec1.png) no-repeat center center;
	background-size: cover;
	padding: 7% 0 8% 0;
	position: relative;
	z-index: 12;
}
.section5-sec2{
	background: url(../images/section5Sec2.png) no-repeat center center;
	background-size: cover;
	padding: 6% 0 9% 0;
	position: relative;
	z-index: 10;
}
.section5-sec3{
	background: url(../images/section5Sec3.png) no-repeat center center;
	background-size: cover;
	padding: 6% 0 9% 0;
	margin-top: 0%;
	position: relative;
	z-index: 8;
}
.section5-sec4{
	background: url(../images/section5Sec4.png) no-repeat center center;
	background-size: cover;
	padding: 6% 0 9% 0;
	margin-top: 0%;
	position: relative;
	z-index: 6;
}
.section5-sec5{
	background: url(../images/section5Sec5.png) no-repeat center center;
	background-size: cover;
	padding: 6% 0 9% 0;
	margin-top: 0;
	position: relative;
	z-index: 4;
}
.section5-sec6{
	background: url(../images/section5Sec6.png) no-repeat center center;
	background-size: cover;
	padding: 6% 0 9% 0;
	margin-top: 0;
	position: relative;
	z-index: 2;
}

.section5-sec1B{
    z-index: 0;
}

.arrow3-box{
    position: absolute;
    margin-top: 19%;
}

.arrow3{
	-webkit-animation: bounceRight 2s infinite;
    animation: bounceRight 2s infinite;
}

.video-box2{
    position: relative;
    text-align: center;
    padding: 0;	
}
.createBg{
	/* position: absolute; */
	max-width: 100%;
	margin: auto;
	float: none;
}
.create-video{
    padding: 4.8% 0 4% 0;
    width: 100%;
    position: absolute;
}
.create-video .responsive-video{
    padding-bottom: 48.21%;
}





/*section7*/
/*swiper-slider*/
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet::before, .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, [class^=swiper-button-] {
  transition: all 0.3s ease;
}


.swiper-container {
  width: 100%;
  transition: opacity 0.6s ease;
}
.swiper-container.swiper-container-coverflow {
    padding-top: 6%;
    padding-bottom: 4%;
    margin-top: 0;
}

.section17B .swiper-container.swiper-container-coverflow{
    padding-top: 5%;
	}

.swiper-container.loading {
  opacity: 0;
  visibility: hidden;
}
.swiper-container:hover .swiper-button-prev,
.swiper-container:hover .swiper-button-next {
  transform: translateX(0);
  opacity: 1;
  visibility: visible;
}

.swiper-slide {
    padding: 0;
}
.swiper-slide .entity-img {
    width: 100%;
    box-shadow: 0px 21px 57px 0px rgb(6 6 6 / 44%);
    border-radius: 20px 20px 0 0;
    visibility: hidden;
}
.swiper-slide .content {
  position: absolute;
  top: 40%;
  left: 0;
  width: 50%;
  padding-left: 5%;
  color: #fff;
}
.swiper-slide .content .title {
  font-size: 2.6em;
  font-weight: bold;
  margin-bottom: 30px;
}
.swiper-slide .content .caption {
  display: block;
  font-size: 13px;
  line-height: 1.4;
}

[class^=swiper-button-] {
  width: 44px;
  opacity: 0;
  visibility: hidden;
}

.swiper-button-prev {
  transform: translateX(50px);
}

.swiper-button-next {
  transform: translateX(-50px);
}

.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 9px;
  position: relative;
  width: 12px;
  height: 12px;
  background-color: #9c39c2;
  opacity: 0.4;
}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 18px;
  transform: translate(-50%, -50%);
  border: 0px solid #9c39c2;
  border-radius: 50%;
}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet:hover, .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active {
  opacity: 1;
}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active::before {
  border-width: 1px;
}

.swiper-slide.swiper-slide-active .responsive-video {
    transform: scale(1.3);
}

.swiper-slide .titleBg18{margin-top: 5%;margin-bottom: 5%;}

.swiper-slide.swiper-slide-active .titleBg18{margin-top: 12%;}



.swiper-slide .responsive-video {
    border-top-left-radius: 225px 15px;
    border-top-right-radius: 5px 225px;
    border-bottom-right-radius: 225px 0px;
    border-bottom-left-radius: 15px 225px;
    border: solid 6px #fff;
    overflow: hidden;
    box-shadow: 0px 6px 20px 0px rgb(84 84 84 / 45%);
    background-color: #000;
    padding-bottom: 54.21%;
}

.pre{
    left: 0;
    float: left;
    margin-top: -15%;
    position: relative;
    z-index: 20;
}
.next{
    right: 0;
    float: right;
    margin-top: -15%;
    position: relative;
    z-index: 20;
}

@media (max-width: 1180px) {
  .swiper-slide .content .title {
    font-size: 25px;
  }
  .swiper-slide .content .caption {
    font-size: 12px;
  }

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

}

/*section6*/
.section6 .responsive-video{
    padding-bottom: 55.21%;
}

.demo-box{
	padding: 0;
}
.demo-video{
	background: url(../images/demoBg.png) no-repeat center center;
	background-size: contain;
	padding: 5% 5.5% 6% 8%;
	margin-top: 4%;
}


.arrow8{
	position: relative;
    margin-bottom: -2%;
    z-index: 12;
}

/*section8*/
.section8-box {
    border-radius: initial;
    padding: 0 0 0% 0;
    margin-top: 5%;
    background-color: #ffffff;
    border-top-left-radius: 255px 15px;
    border-top-right-radius: 15px 225px;
    border-bottom-right-radius: 225px 15px;
    border-bottom-left-radius:15px 255px;
    border: solid 5px #000000;
    overflow: hidden;
    position: relative;
}

.line1{
    position: absolute;
    left: -4px;
}

.list-text{width: 44%;}
.agency-list{width: 28%;}
.other-list{width: 28%;}


.list-text-top, .other-list-top
 {
	height: 140px;
	width:100%;
	text-align:center;
}



.agency-list-top{height: 140px;padding: 3px 0 0 0;}


.list-text-top .card, .agency-list-top .card, .other-list-top .card {
    background-color: transparent;
    border: 0;
    border-radius: 0;
    text-align: center;
}

.list-text-top .card {
    text-align: left;
    padding-left: 10%;
    color: #1a0e37;
}

.list-text{
	padding: 0 0 0 0;
	border-radius: 0;
	padding-bottom: 25px;
	border-top-left-radius: 225px 15px;
	border-top-right-radius: 5px 225px;
	border-bottom-right-radius: 225px 0px;
	border-bottom-left-radius: 15px 225px;
	border-right: solid 4px #41403E;
	overflow: hidden;
}

.other-list{
	background: url(../images/line2.png) no-repeat center right;
	background-size: contain;
	padding: 0;
	background-color: #fff;
	position: relative;
	text-align: center;
	border-top-right-radius: 15px 225px;
}

.other-list .check-list:nth-child(even){
    background-color: rgb(255 247 211);
}

.agency-list-check{
    padding: 0;
}

.list{
	height: 62px;
	width:100%;
}
.list .card {
    border: 0;
    padding: 0 12%;
    background-color: transparent;
    color: #1a1325;
    border-radius: 0;
}

.list:nth-child(odd) {
    background-color: rgb(255 247 211);
}

.check-list{
	height: 62px;
	width:100%;
}
.agency-list .check-list:nth-child(odd){
    background-color: #fff7d3;
}

.check-list .card {
    border: 0;
    padding: 0 12%;
    background-color: transparent;
    border-radius: 0;
}


.agency-list .check-list .card {
    border-radius: 0;
    border: 0;
}


.agency-list {
    padding: 0;
    overflow: hidden;
    position: relative;
    text-align: center;
    color: #1a1325;
    border-top-left-radius: 225px 15px;
    border-top-right-radius: 5px 225px;
    border-bottom-right-radius: 225px 0px;
    border-bottom-left-radius: 15px 225px;
    border-right: solid 4px #41403E;
}


.list-bottom {
    background-image: -moz-linear-gradient( 90deg, rgb(0,7,47) 0%, rgb(255,0,0) 100%);
    background-image: -webkit-linear-gradient( 
90deg, rgb(0 7 47 / 8%) 0%, rgb(255 0 0 / 10%) 100%);
    background-image: -ms-linear-gradient( 90deg, rgb(0,7,47) 0%, rgb(255,0,0) 100%);
	height: 98px;
}
.main-list-bottom{
	text-align:center;
	height: 112px;
}

.check-list-bottom{
	color:#fff;
	text-align:center;
    background-image: -moz-linear-gradient( 90deg, rgb(0,7,47) 0%, rgb(255,0,0) 100%);
    background-image: -webkit-linear-gradient( 
90deg, rgb(0 7 47 / 8%) 0%, rgb(255 0 0 / 10%) 100%);
    background-image: -ms-linear-gradient( 90deg, rgb(0,7,47) 0%, rgb(255,0,0) 100%);
	height: 98px;
}
.list .card.last, .check-list.last{border-bottom:0;height: 100px;}

/*section9*/
.step1-box-out{padding: 0 2.8%;}
.step1-box {
    background: url(../images/step1Bg.png) no-repeat center top;
    background-size: contain;
    padding: 3% 2% 2% 7%;
}
.step1tag{
	position: relative;
	left: -4%;
	margin-top: -5%;
}

.step2-box-out{padding: 0 2.8%;}
.step2-box {
    background: url(../images/step2Bg.png) no-repeat center top;
    background-size: contain;
    padding: 3% 7% 2% 2%;
}
.step2tag{
	position: relative;
	left: -4%;
	margin-top: -5%;
}

.step3-box-out{padding: 0 2.8%;}
.step3-box {
    background: url(../images/step3Bg.png) no-repeat center top;
    background-size: contain;
    padding: 3% 2% 2% 7%;
}
.step3tag{
	position: relative;
    left: -4%;
}

/*section10*/

.section10-box{
	    overflow: hidden;
    padding: 2% 0;
    margin-top: -2%;
}

.problem-box-out {
    padding: 0 3% 0 2.5%;
    margin-top: 2%;
}
.problem-box{
	background: url(../images/problemBg.png) no-repeat center center;
	background-size: contain;
}

.solution-box-out{
    padding: 0 2.5% 0 3%;
    margin-top: 2%;
}
.solution-box{
	background: url(../images/solutionBg.png) no-repeat center center;
	background-size: contain;
}

/*section11*/

/*section12*/
.deal-box-out {
    padding: 2% 2%;
}
.deal-box {
    background-color: #ffffff;
    border-top-left-radius: 225px 15px;
    border-top-right-radius: 25px 225px;
    border-bottom-right-radius: 225px 15px;
    border-bottom-left-radius: 15px 255px;
    border: solid 5px #ffffff;
    padding: 4.5% 2% 4.5% 6%;
}

/*section13*/

/*section14*/

.choice-box-out {
    text-align: center;
    padding: 1.8% 1.8%;
}
.choice-box {
    background-color: #fff;
    border: 15px solid #333333;
    height: 100%;
    border-radius: 8px;
    box-shadow: 0 0px 15px 0px rgb(118 118 118);
    padding: 0 1% 11% 1%;
}
.choice-box h3{
    margin-top: 6%;
}

.hangIcon{
    position: relative;
    margin-top: -12px;
}

.choice{margin-top: 10%;}
.choice5{margin-top: -3%;}
.choice6{margin-top: 10%;}
.choice7{margin-top: 8%;}
.choice8{margin-top: 10%;}

.choice8-text{margin-top: -5% !important;}
.choice6-text{margin-top: 8% !important;}

/*section15*/
.section15-text{padding: 0 3%;}
.catch {
    position: relative;
    margin-top: -15%;
    margin-bottom: -14%;
    z-index: 1;
}

/*section18*/
.section18-box {
    background: url(../images/section18Bg.png) no-repeat center center;
    background-size: cover;
    padding: 6% 2% 6% 2%;
    margin-top: 5%;
}


/*footer*/
.footer-section{padding: 0 2.3%;}
.accordion .arrow9 {
    float: right;
    margin-top: 0px;
}

.collapsed .arrow9{transform: rotate(180deg);}

.footer .card {
    border: 0px;
    margin: 4% 0;
    background-color: #ffffff;
    color: #000;
    padding: 0;
    border-top-left-radius: 255px 15px;
    border-top-right-radius: 15px 225px;
    border-bottom-right-radius: 225px 15px;
    border-bottom-left-radius: 15px 255px;
    border: solid 5px #41403E;
    overflow: hidden;
}

.footer .card-header{
    padding: 0;
    border: 0;
    box-shadow: none;
}
.footer .card-header button {
    background: url(../images/point.png) no-repeat 26px center;
    padding-left: 65px;
    list-style: none;
    margin-left: 0px;
    padding-top: 3%;
    padding-bottom: 3%;
    width: 100%;
    text-align: left;
    color: #000;
    border: 0 !important;
    box-shadow: none;
    white-space: break-spaces;
    background-color: #fff;
}
.footer .card-body{
    padding: 1% 4% 5% 10%;
}
.btn:focus, .btn:hover {
    text-decoration: none !important;
}


.link, .link a {
    text-decoration: none;
    color: #8a8593;
}
.link a:hover {
    color: #8a8593;
    text-decoration: underline;
}

.link2{
    text-decoration: underline;
    color: #1053fd;
}
.link2:hover {
    color: #073dc3;
    text-decoration: none;
}


/**/
.connection4{
    position: relative;
    margin-top: -6%;
    margin-bottom: -4%;
    z-index: 11;
}
.connection5{
    position: relative;
    margin-top: -5%;
    margin-bottom: -4%;
    z-index: 9;
}
.connection4B{
    position: relative;
    margin-top: -5.5%;
    margin-bottom: -4%;
    z-index: 7;
}
.connection5B{
    position: relative;
    margin-top: -5.8%;
    margin-bottom: -4%;
    z-index: 5;
}
.connection4C{
    position: relative;
    margin-top: -4.9%;
    margin-bottom: -4%;
    z-index: 3;
}
.connection5D{
    position: relative;
    margin-top: -5.8%;
    margin-bottom: -4%;
    z-index: 1;
}

.step1-video, .step2-video, .step3-video{width:90%;}
.profit-video{width:100%;}


/*elements*/
.element1 {
    position: absolute;
    bottom: 80%;
    text-align: right;
}
.ele1 {
    animation: 1s ease-in-out 0s infinite alternate none running mover1;
    position: relative;
}

.element2 {
    position: absolute;
    bottom: 9%;
    text-align: left;
}
.ele2 {
    animation: 2s ease-in-out 0s infinite alternate none running mover1;
    position: relative;
}

.element3 {
    position: absolute;
    bottom: 7%;
    text-align: right;
}
.ele3 {
    position: relative;
}
.ele3A {
    position: relative;
	-webkit-animation-name: rotate;
     -moz-animation-name: rotate;
      -ms-animation-name: rotate;
       -o-animation-name: rotate;
          animation-name: rotate;
  -webkit-animation-duration: 5s;
     -moz-animation-duration: 5s;
      -ms-animation-duration: 5s;
       -o-animation-duration: 5s;
          animation-duration: 5s;
  -webkit-animation-iteration-count: infinite;
     -moz-animation-iteration-count: infinite;
      -ms-animation-iteration-count: infinite;
       -o-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
     -moz-animation-timing-function: linear;
      -ms-animation-timing-function: linear;
       -o-animation-timing-function: linear;
          animation-timing-function: linear;
}
.ele3B {   
    position: relative;
	position: absolute;
    animation: 2s ease-in-out 0s infinite alternate none running mover2;
}


.element4 {
    position: absolute;
    top: 8%;
    text-align: left;
}
.ele4A {
    position: relative;
}
.ele4B {
    animation: 0.5s ease-in-out 0s infinite alternate none running mover3;
    position: relative;
    position: absolute;
}


.element5 {
    position: absolute;
    bottom: 0;
    text-align: left;
}
.ele5 {
    animation: 0.5s ease-in-out 0s infinite alternate none running mover1;
    position: absolute;
    z-index: 1;
}
.ele5B {
    position: relative;
}

.element6 {
    position: absolute;
    bottom: 0%;
    text-align: right;
}
.ele6 {
    position: relative;
}

.element7 {
    position: absolute;
    top: 16%;
    text-align: left;
}
.ele7 {
    position: relative;
	-webkit-animation-name: rotate2;
     -moz-animation-name: rotate2;
      -ms-animation-name: rotate2;
       -o-animation-name: rotate2;
          animation-name: rotate2;
  -webkit-animation-duration: 2s;
     -moz-animation-duration: 2s;
      -ms-animation-duration: 2s;
       -o-animation-duration: 2s;
          animation-duration: 2s;
  -webkit-animation-iteration-count: infinite;
     -moz-animation-iteration-count: infinite;
      -ms-animation-iteration-count: infinite;
       -o-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
     -moz-animation-timing-function: linear;
      -ms-animation-timing-function: linear;
       -o-animation-timing-function: linear;
          animation-timing-function: linear;
}

.element8 {
    position: absolute;
    top: 10%;
    text-align: right;
}
.ele8 {
    animation: 2s ease-in-out 0s infinite alternate none running mover2;
    position: relative;
}

.element9 {
    position: absolute;
    top: 17%;
    text-align: right;
    z-index: 1;
}
.ele9 {
    position: absolute;
    z-index: 1;
    -webkit-animation-name: rotate2;
    -moz-animation-name: rotate2;
    -ms-animation-name: rotate2;
    -o-animation-name: rotate2;
    animation-name: rotate2;
    -webkit-animation-duration: 8s;
    -moz-animation-duration: 8s;
    -ms-animation-duration: 8s;
    -o-animation-duration: 8s;
    animation-duration: 8s;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -ms-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-timing-function: linear;
    -ms-animation-timing-function: linear;
    -o-animation-timing-function: linear;
    animation-timing-function: linear;
}
.ele9B {
    position: relative;
}

.element10 {
    position: absolute;
    top: 44%;
    text-align: left;
}
.ele10 {
    animation: 0.5s ease-in-out 0s infinite alternate none running mover1;
    position: relative;
}

.element11 {
    position: absolute;
    top: 18%;
    text-align: right;
}
.ele11 {
    animation: 2s ease-in-out 0s infinite alternate none running mover1;
    position: relative;
}

.element12 {
    position: absolute;
    top: 16%;
    text-align: left;
}
.ele12 {
    animation: 2s ease-in-out 0s infinite alternate none running mover1;
    position: relative;
}

.element13 {
    position: absolute;
    top: 8%;
    text-align: left;
}
.ele13 {
    animation: 2s ease-in-out 0s infinite alternate none running mover1;
    position: relative;
}

.element14 {
    position: absolute;
    bottom: 10%;
    text-align: right;
}
.ele14 {
    animation: 2s ease-in-out 0s infinite alternate none running mover1;
    position: relative;
}

.element15 {
    position: absolute;
    top: 15%;
    text-align: left;
}
.ele15 {
    animation: 2s ease-in-out 0s infinite alternate none running mover1;
    position: relative;
}

.element16 {
    position: absolute;
    bottom: -3%;
    text-align: left;
    z-index: 11;
}
.ele16 {
    animation: 2s ease-in-out 0s infinite alternate none running mover1;
    position: relative;
    z-index: 1;
}

.element17 {
    position: absolute;
    top: -16%;
    text-align: left;
    z-index: 11;
}
.ele17 {
    animation: 2s ease-in-out 0s infinite alternate none running mover1;
    position: relative;
}

.element18 {
    position: absolute;
    bottom: -8%;
    text-align: left;
    z-index: 2;
}
.ele18 {
    animation: 2s ease-in-out 0s infinite alternate none running mover2;
    position: relative;
}

.element19 {
    position: absolute;
    top: 7%;
    text-align: right;
}
.ele19 {
    position: relative;
    z-index: 1;
    -webkit-animation-name: rotate2;
    -moz-animation-name: rotate2;
    -ms-animation-name: rotate2;
    -o-animation-name: rotate2;
    animation-name: rotate2;
    -webkit-animation-duration: 8s;
    -moz-animation-duration: 8s;
    -ms-animation-duration: 8s;
    -o-animation-duration: 8s;
    animation-duration: 8s;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -ms-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-timing-function: linear;
    -ms-animation-timing-function: linear;
    -o-animation-timing-function: linear;
    animation-timing-function: linear;
}
.ele19B{
	position: absolute;
}


.element20 {
    position: absolute;
    top: 33%;
    text-align: left;
}
.ele20 {
    position: relative;	
    animation: 2s ease-in-out 0s infinite alternate none running mover1;
}

.element22 {
    position: absolute;
    bottom: 32%;
    text-align: left;
}
.ele22 {
    position: relative;
}
.ele22A {
    animation: 0.5s ease-in-out 0s infinite alternate none running mover3;
    position: relative;
    position: absolute;
}

.element23 {
    position: absolute;
    bottom: 0;
    text-align: right;
}
.ele23 {
    position: relative;
	animation: 1.5s ease-in-out 0s infinite alternate none running mover1;
}

.element24 {
    position: absolute;
    top: 45%;
    text-align: left;
    z-index: 2;
}
.ele24 {
    position: relative;
	animation: 1.5s ease-in-out 0s infinite alternate none running mover2;
}

.element25 {
    position: absolute;
    top: 20%;
    text-align: right;
}
.ele25 {
    position: relative;
	animation: 1.5s ease-in-out 0s infinite alternate none running mover1;
}

.element26 {
    position: absolute;
    top: 16%;
    text-align: right;
}
.ele26 {
    position: relative;
}
.ele26A {
    animation: 0.5s ease-in-out 0s infinite alternate none running mover2;
    position: relative;
    position: absolute;
}

.element27 {
    position: absolute;
    top: 14%;
    text-align: right;
}
.ele27 {
    position: relative;
	-webkit-animation-name: rotate2;
     -moz-animation-name: rotate2;
      -ms-animation-name: rotate2;
       -o-animation-name: rotate2;
          animation-name: rotate2;
  -webkit-animation-duration: 8s;
     -moz-animation-duration: 8s;
      -ms-animation-duration: 8s;
       -o-animation-duration: 8s;
          animation-duration: 8s;
  -webkit-animation-iteration-count: infinite;
     -moz-animation-iteration-count: infinite;
      -ms-animation-iteration-count: infinite;
       -o-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
     -moz-animation-timing-function: linear;
      -ms-animation-timing-function: linear;
       -o-animation-timing-function: linear;
          animation-timing-function: linear;
}

.element28 {
    position: absolute;
    top: 21%;
    text-align: right;
}
.ele28 {
    position: relative;
}
.ele28A {
    animation: 1s ease-in-out 0s infinite alternate none running mover2;
    position: relative;
    position: absolute;
}

.element29 {
    position: absolute;
    top: 9%;
    text-align: right;
}
.ele29 {
    position: relative;
}
.ele29A {
    animation: 1s ease-in-out 0s infinite alternate none running mover2;
    position: absolute;
}

.element30 {
    position: absolute;
    bottom: 0;
    text-align: right;
}
.ele30 {
    position: relative;
}
.ele30A {
    animation: 0.5s ease-in-out 0s infinite alternate none running mover2;
    position: absolute;
}

.element31 {
    position: absolute;
    bottom: 0;
    text-align: right;
}
.ele31 {
    position: relative;
    animation: 2s ease-in-out 0s infinite alternate none running mover2;
}

.element32 {
    position: absolute;
    top: 27%;
    text-align: left;
}
.ele32 {
    position: relative;
	-webkit-animation-name: rotate2;
     -moz-animation-name: rotate2;
      -ms-animation-name: rotate2;
       -o-animation-name: rotate2;
          animation-name: rotate2;
  -webkit-animation-duration: 8s;
     -moz-animation-duration: 8s;
      -ms-animation-duration: 8s;
       -o-animation-duration: 8s;
          animation-duration: 8s;
  -webkit-animation-iteration-count: infinite;
     -moz-animation-iteration-count: infinite;
      -ms-animation-iteration-count: infinite;
       -o-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
     -moz-animation-timing-function: linear;
      -ms-animation-timing-function: linear;
       -o-animation-timing-function: linear;
          animation-timing-function: linear;
}

.element33 {
    position: absolute;
    bottom: 38%;
    text-align: left;
}
.ele33 {
    animation: 2s ease-in-out 0s infinite alternate none running mover1;
    position: relative;
}

.element34 {
    position: absolute;
    top: 16%;
    text-align: right;
}
.ele34 {
    position: relative;
}
.ele34A {
    animation: 0.5s ease-in-out 0s infinite alternate none running mover2;
    position: relative;
    position: absolute;
}

.element35 {
    position: absolute;
    top: 39%;
    text-align: left;
}
.ele35 {
    animation: 2s ease-in-out 0s infinite alternate none running mover1;
    position: relative;
}

.element36 {
    position: absolute;
    bottom: 4%;
    text-align: right;
}
.ele36 {
    position: relative;
	animation: 1.5s ease-in-out 0s infinite alternate none running mover2;
}


.icon {
    animation: .3s ease-in-out 0s infinite alternate none running mover4;
    position: relative;
    left: -1.1%;
    margin-top: -2%;
}

.icon3 {
    animation: 2s ease-in-out 0s infinite alternate none running mover1;
    position: absolute;
    margin-left: -27%;
    margin-top: -20.5%;
	-webkit-animation-name: rotate;
     -moz-animation-name: rotate;
      -ms-animation-name: rotate;
       -o-animation-name: rotate;
          animation-name: rotate;
  -webkit-animation-duration: 5s;
     -moz-animation-duration: 5s;
      -ms-animation-duration: 5s;
       -o-animation-duration: 5s;
          animation-duration: 5s;
  -webkit-animation-iteration-count: infinite;
     -moz-animation-iteration-count: infinite;
      -ms-animation-iteration-count: infinite;
       -o-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
     -moz-animation-timing-function: linear;
      -ms-animation-timing-function: linear;
       -o-animation-timing-function: linear;
          animation-timing-function: linear;
}
.icon4 {
    animation: 2s ease-in-out 0s infinite alternate none running mover2;
    position: absolute;
    right: -11%;
    margin-top: -19.5%;
	-webkit-animation-name: rotate2;
     -moz-animation-name: rotate2;
      -ms-animation-name: rotate2;
       -o-animation-name: rotate2;
          animation-name: rotate2;
  -webkit-animation-duration: 8s;
     -moz-animation-duration: 8s;
      -ms-animation-duration: 8s;
       -o-animation-duration: 8s;
          animation-duration: 8s;
  -webkit-animation-iteration-count: infinite;
     -moz-animation-iteration-count: infinite;
      -ms-animation-iteration-count: infinite;
       -o-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
     -moz-animation-timing-function: linear;
      -ms-animation-timing-function: linear;
       -o-animation-timing-function: linear;
          animation-timing-function: linear;
}



@-webkit-keyframes rotate {  	
	0%,100% {
    -ms-transform: rotate(0);
    transform: rotate(0);
  }
  40% {
    -ms-transform: rotate(5deg);
    transform: rotate(5deg);
  }
  70% {
    -ms-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }
	
}

@-webkit-keyframes rotate2 {  	
	0%,100% {
    -ms-transform: rotate(0);
    transform: rotate(0);
  }
  40% {
    -ms-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }
  70% {
    -ms-transform: rotate(5deg);
    transform: rotate(5deg);
  }
	
}
@-webkit-keyframes mover1 {
    0% { transform: translateY(0); }
    100% { transform: translateY(10px); }
}
@keyframes mover1 {
    0% { transform: translateY(0); }
    100% { transform: translateY(10px); }
}

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

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

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


.connection6{
	margin-top: -8%;
    margin-bottom: 3%;
}
.connection7{
	margin-top: -8%;
    margin-bottom: 3%;	
}


.top{background-image: linear-gradient(#e53535, #b50e0e);color: #fff;padding: .7% 0;overflow:hidden;position: relative;text-align:center;} 
.banner{background: url(../images/banner.png) no-repeat center top;background-size: cover;padding: 2.5% 0 6.5% 0;overflow:hidden;position: relative;}
.section2{background: url(../images/section2.png) no-repeat center top;background-size: cover;padding: 9% 0 2% 0;position: relative;overflow:hidden;margin-top: -7%;}
.section3{background: url(../images/section3.png) no-repeat center bottom;background-size: cover;padding: 3% 0 2.5% 0;position: relative;background-color: #f8d325;overflow:hidden;}
.section4{background: url(../images/section4.png) no-repeat center center;background-size: cover;padding: 0 0 3% 0;position: relative;overflow: hidden;}
.section5{background: url(../images/section5.png) no-repeat center top;background-size: cover;padding: 0;position: relative;background-color: #fff;overflow:hidden;}
.section5B{background: url(../images/section5B.png) no-repeat center top;background-size: cover;padding: 10% 0 5% 0;}
.section6{background: url(../images/section6.png) no-repeat center top;background-size: cover;padding: 6% 0 2% 0;position: relative;margin-top: 1%;background-color: #120d1b;}
.section7{background: url(../images/section7.png) no-repeat center top;background-size: cover;padding: 3.5% 0 0 0;position: relative;background-color: white;}
.section8{background: url(../images/section8.png) no-repeat center top;background-size: cover;padding: 4.5% 0 4% 0;position: relative;background-color: white;margin-top: -1.5%;}
.section9{background: url(../images/section9.png) no-repeat center top;background-size: cover;padding: 6% 0 2% 0;position: relative;margin-top: -3%;}
.section10{background: url(../images/section10.png) no-repeat center top;background-size: cover;padding: 5.5% 0 0% 0;position: relative;background-color: #f8d325;}
.section11{background: url(../images/section11.png) no-repeat center bottom;background-size: cover;padding: 4% 0 2% 0;position: relative;z-index: 1;}
.section12{background: url(../images/section12.png) no-repeat center top;background-size: cover;padding: 5.5% 0 3% 0;position: relative;margin-top: 3%;}
.section13{background: url(../images/section13.png) no-repeat center top;background-size: cover;padding: 3% 0 0% 0;position: relative;z-index: 3;}
.section14{background: url(../images/section14.png) no-repeat center top;background-size: cover;padding: 5% 0 1% 0;position: relative;margin-top: -0.5%;z-index: 2;}
.section15{background: url(../images/section15.png) no-repeat center top;background-size: cover;padding: 4% 0 3% 0;position: relative;overflow:hidden;}
.section16{background: url(../images/section16.png) no-repeat center top;background-size: cover;padding: 7% 0 2% 0;position: relative;overflow:hidden;margin-top: -4%;}
.section17{background: url(../images/section17.png) no-repeat center bottom;background-size: cover;padding: 4% 0 10% 0;position: relative;background-color: #120d1b;overflow:hidden;}
.section18{background: url(../images/section18.png) no-repeat center top;background-size: cover;padding: 1% 0 6% 0;position: relative;}
.section19{background: url(../images/section19.png) no-repeat center top;background-size: cover;padding: 6% 0 1% 0;position: relative;overflow:hidden;margin-top: -2%;z-index: 1;}
.section20{background: url(../images/section20.png) no-repeat center top;background-size: cover;padding: 6% 0 5% 0;position: relative;}

.section19B{
    background-color: #eeeeee;
    padding: 3% 0;
}

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

.section3, .section5-sec1, .section5-sec2, .section5-sec3, .section5-sec4, .section5-sec5, .section5-sec6,
.section6, .section8, .section9, .section10, .section11, .section12, .section13, .section14, 
.section15, .section16, .section17, .section18, .section19{background-image:none;}
.section4 {
    background-image:none;
    padding: 6% 0;
}
.section8{background-color: #973aba;}


.section9 {
    text-align:center;
    margin-top: 0;
}

.section11 {
    background-color: #eeeeee;
}

.section12 {
    margin-top: 0;
    background-color: #0f0b17;
}

.section14 {
    margin-top: 0;
    background-color: #e7e7e7;
}
.section15 {
    background-color: #973aba;
}
.section16 {
    margin-top: 0;
}
.section17 {
    background-color: #9c39c2;
}
.section18 {
    padding: 6% 0;
}
.section18-box, .section19 {
    background-color: #eeeeee;
}


.section5-sec1{background-color: #f9eaff;} 
.section5-sec2{background-color: #e8e9e9;} 
.section5-sec3{background-color: #efefef;}
.section5-sec4{background-color: #dbfeff;}
.section5-sec5{background-color: #373737;}
.section5-sec6{background-color: #0065a5;}



/**/
.titleBg1 {
	background-image:none;
    padding: 1% 1% 1% 1%;
    background-color: #9c39c2;
    border: 2px solid #767676;
	max-width: 90%;
}
.titleBg2, .titleBg19, .titleBg32, .titleBg39 {
	background-image:none;
    padding: 1%;
    background-color: #fff;
    border: 2px solid #4c435a;
	max-width: 90%;
}
.titleBg5 , .titleBg6, .titleBg17, .titleBg21, 
.titleBg23, .titleBg27, .titleBg29, .titleBg31,
.titleBg34, .titleBg40, .titleBg41 {
	background-image:none;
    padding: 1%;
    background-color: #9c39c2;
    border: 2px solid #4c435a;
	max-width: 90%;
}
.titleBg16, .titleBg28{
	background-image:none;
    padding: 1%;
    background-color: #9c39c2;
    border: 2px solid #fff;
	max-width: 90%;
}

.titleBg3 {
	background-image:none;
    background-color: #ffc71e;
    max-width: 96%;
}


.section11, .section15{text-align:center;}

.padding0 {
    padding: 0px 15px;
}

.arrow6, .arrow7,
.element1, .element2, .element3, .element4, .element5, .element6, .element7, .element8, .element9, .element10, 
.element11, .element12, .element13, .element14, .element15, .element16, .element17, .element18, .element19, .element20, 
.element21, .element22, .element23, .element24, .element25, .element26, .element27, .element28, .element29, .element30, 
.element31, .element32, .element33, .element34, .element35, .element36, .element37, .element38, .element39, .icon3, .icon4, .connection3,
.connection6, .connection7, .icon
{display:none !important;}




.list-text-top, .other-list-top, .agency-list-top {
    height: 70px;
}

.list-text-top .card, .agency-list-top .card, .other-list-top .card {
    padding: 0;
}

.deal-box {
    padding: 2% 2% 2% 6%;
}

.arrow1{
	max-width: 6%;
    position: relative;
    margin: 5% 0;
}

.catch {
    margin-top: 3%;
    margin-bottom: 6%;
}

.swiper-container.swiper-container-coverflow {
    padding-top: 12%;
    padding-bottom: 6%;
}

.video-box {
    padding: 0;
    margin-top: 3%;
}
.video-img {
    position: relative;
}
.mainvideo-box{
    position: static;
    width: 100%;
    height: 0px;	
}

.seprator, .seprator2{max-width: 60%;}

.step1tag, .step2tag, .step3tag{
	left: 0;
	margin-top: 0;
}

}


@media only screen and (max-width: 993px){
.section2 {
    background-image:none;
    background-color: #9539b8;
	padding: 6% 0 2% 0;
    margin-top: -4%;	
}

.step1-box {
    background-image:none;
    padding: 0% 1% 2% 1%;
    background-color: #f2d4ff;
    border-radius: 10px;
}
.step2-box {
    background-image:none;
    padding: 0% 1% 2% 1%;
    background-color: #cae5fe;
    border-radius: 10px;
}
.step3-box {
    background-image:none;
    padding: 0% 1% 2% 1%;
    background-color: #fddbb2;
    border-radius: 10px;
}

.problem, .solution{max-width: 40%;}

.arrow6{
    max-width: 8%;
    left: 10%;	
}
.arrow7{max-width: 10%;}

.connection1, .connection2{max-width: 20%;}
.connection3{max-width: 30%;}

.arrow2, .arrow8{max-width: 4%;}

.tableLogo{max-width: 70%;}

.checklist1 li {
    background: url(../images/checklist1B.png) no-repeat 25px 3px;
    padding-left: 52px;
}
.checklist2 li {
    background: url(../images/checklist2B.png) no-repeat no-repeat 25px 3px;
    padding-left: 52px;
}

.table-box-out1 {
    padding: 0 2% 0 2%;
}
.table-box-out2{
    padding: 0 2% 0 2%;
}

.price-checklist1 li {
    background: url(../images/check1.png) no-repeat 20px 1px;
    padding-left: 60px;
}
.price-unchecklist1 li {
    background: url(../images/uncheck2.png) no-repeat 20px 0px;
    padding-left: 60px;
}


.section{text-align:center;}

.icon{max-width: 4%;}

.arrow3{max-width: 4%;}

.icon3 {
    max-width: 35%;
}
.icon4 {
    max-width: 35%;
}


.connection6, .connection7{max-width: 25%;}

/**/


/**/


.mycontainer-right{width: 100%;}	
.mycontainer-left{width: 100%;}	

}


@media (min-width: 240px){
	.lappy {
		position: static;
		right: 0;
		bottom: 0px;
	}
	.videosection {
		position: static;
		right: 0;
		bottom: 0px;
	}
	.mainvideo {
		position: static;
		width: 100%;
		height: auto;
	}
	
	.video {
        width: 485px;
        height: 231px;
        top: 23px;
        left: 0px;
        margin-bottom: 8%;
    }

.titleBg1-text{font-size: 22px;}


/**/
.connection4, .connection5, .connection4B, .connection5B, .connection4C, .connection5D{
    max-width:10%;
}

.step1tag, .step2tag, .step3tag{max-width:32%;}
.select, .customize, .render{max-width:36%;}

.problem-box, .solution-box{
	padding: 9% 7% 10% 7%;
}
.checklist1, .checklist2 {
    margin-top: 6%;
}

.crayonVidB, .charcoalVidB, .animatedVidB, .pencilVidB, .chalkboardVidB, .blueprintVidB {
    width: 90%;
}

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


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

}
@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%;
    }
	

.titleBg1-text{font-size: 25px;}





.catch {
    max-width: 90%;
    left: 0;
}

.section15-box{margin-top: 3%;}

/*elements*/
.ele1 {
    max-width: 100%;
}
.element1 {
    right: -1.5%;
}

.ele2 {
    max-width: 100%;
}
.element2 {
    left: 10.5%;
}

.ele3 {
    max-width: 100%;
}
.ele3A {
    max-width: 100%;
    right: -16%;
    margin-top: 51%;
}
.ele3B {
    max-width: 100%;
    right: 1%;
    margin-top: -4%;
}
.element3 {
    right: 2.2%;
}

.ele4A {
    max-width: 100%;
}
.ele4B {
    max-width: 100%;
    right: 24%;
    top: 51%;
}
.element4 {
    left: 3%;
}

.ele5 {
    max-width: 100%;
    right: 29%;
}
.ele5B {
    max-width: 100%;
    left: 0;
}
.element5 {
    left: 3%;
}

.ele6 {
    max-width: 100%;
}
.element6 {
    right: 5.2%;
}

.ele7 {
    max-width: 100%;
}
.element7 {
    left: 22%;
}

.ele8 {
    max-width: 100%;
}
.element8 {
    right: 21.2%;
}

.ele9 {
    max-width: 100%;
    top: 14%;
    left: 54%;
}
.ele9B {
    max-width: 50%;
}
.element9 {
    right: 0%;
}

.ele10 {
    max-width: 100%;
}
.element10 {
    left: 0%;
}


.ele11 {
    max-width: 100%;
}
.element11 {
    right: 0%;
}

.ele12 {
    max-width: 100%;
}
.element12 {
    left: 0%;
}

.ele13 {
    max-width: 100%;
}
.element13 {
    left: 6.5%;
}

.ele14 {
    max-width: 100%;
}
.element14 {
    right: 0%;
}

.ele15 {
    max-width: 30%;
}
.element15 {
    left: 0%;
}

.ele16 {
    max-width: 100%;
}
.element16 {
    left: 0%;
}

.ele17 {
    max-width: 100%;
}
.element17 {
    left: 0%;
}

.ele18 {
    max-width: 100%;
}
.element18 {
    left: 0%;
}

.ele19 {
    max-width: 60%;
}
.ele19B {
    max-width: 40%;
    right: 9%;
    margin-top: 9%;
}
.element19 {
    right: 1%;
}

.ele20 {
    max-width: 80%;
}
.element20 {
    left: 0;
}

.ele22 {
    max-width: 60%;
}
.ele22A {
    max-width: 30%;
    left: 0;
    top: 51%;
}
.element22 {left: 0;}

.ele23 {
    max-width: 60%;
}
.element23 {
    right: 0%;
}

.ele24 {
    max-width: 100%;
}
.element24 {
    left: 0%;
}

.ele25 {
    max-width: 70%;
}
.element25 {
    right: 0;
}

.ele26 {
    max-width: 80%;
}
.ele26A {
    max-width: 100%;
    right: -12%;
    top: 51%;
}
.element26 {right: 0;}

.ele27 {
    max-width: 60%;
}
.element27 {
    right: -2%;
}

.ele28 {
    max-width: 45%;
}
.ele28A {
    max-width: 13%;
    left: 62%;
    top: 13%;
}
.element28 {right: .5%;}

.ele29 {
    max-width: 60%;
}
.ele29A {
    max-width: 30%;
    right: 0;
    top: 23%;
}
.element29 {right: 0;}


.ele30 {
    max-width: 60%;
}
.ele30A {
    max-width: 25%;
    left: 57%;
    top: -19%;
}
.element30 {
    right: -9%;
}

.ele31 {
    max-width: 60%;
}
.element31 {
    right: 0%;
}

.ele32 {
    max-width: 70%;
}
.element32 {
    left: 2%;
}

.ele33 {
    max-width: 64%;
}
.element33 {
    left: -2%;
}

.ele34 {
    max-width: 54%;
}
.ele34A {
    max-width: 24%;
    right: 0;
    bottom: 0;
}
.element34 {right: 0;}

.ele35 {
    max-width: 90%;
}
.element35 {
    left: 0%;
}

.ele36 {
    max-width: 60%;
}
.element36 {
    right: 0%;
}
}

@media only screen and (min-width: 768px) {
	
	.lappy {
		position: relative;
		right: 0;
		bottom: -50px;
	}
	.videosection {
		position: relative;
		right: 0;
		bottom: 0px;
	}
	.mainvideo {
		position: absolute;
		width: 355px;
		top: 19px;
		left: 16px;
	}
	.video {
        width: 315px;
        height: 117px;
        top: 15px;
        left: 7px;
        margin-bottom: 12%;
    }
	
	.bnr-vid{
		position: relative;
	}

.titleBg1-text{font-size: 26px;}





.catch {
    max-width: 120%;
    left: -7%;
}

.section15-box{margin-top: 3%;}

/*elements*/
.ele1 {
    max-width: 51%;
}
.element1 {
    right: -1.5%;
}

.ele2 {
    max-width: 51%;
}
.element2 {
    left: -2%;
}

.ele3 {
    max-width: 31%;
}
.ele3A {
    max-width: 5%;
    right: -7%;
    margin-top: 0;
}
.ele3B {
    max-width: 5%;
    right: 6%;
    margin-top: -4%;
}
.element3 {
    right: -5%;
}

.ele4A {
    max-width: 22%;
}
.ele4B {
    max-width: 13%;
    right: 84%;
    top: 41%;
}
.element4 {
    left: 0;
}

.ele5 {
    max-width: 17%;
    right: 42%;
}
.ele5B {
    max-width: 54%;
    left: 0;
}
.element5 {
    left: -11%;
}

.ele6 {
    max-width: 45%;
}
.element6 {
    right: 0;
}

.ele7 {
    max-width: 30%;
}
.element7 {
    left: 22%;
}

.ele8 {
    max-width: 50%;
}
.element8 {
    right: 21.2%;
}

.ele9 {
    max-width: 24%;
    top: 14%;
    left: 77%;
}
.ele9B {
    max-width: 29%;
}
.element9 {
    right: -3%;
}

.ele10 {
    max-width: 40%;
}
.element10 {
    left: 0%;
}


.ele11 {
    max-width: 30%;
}
.element11 {
    right: 0%;
}

.ele12 {
    max-width: 35%;
}
.element12 {
    left: 0%;
}

.ele13 {
    max-width: 30%;
}
.element13 {
    left: 0;
}

.ele14 {
    max-width: 46%;
}
.element14 {
    right: 0%;
}

.ele15 {
    max-width: 21%;
}
.element15 {
    left: 0%;
}

.ele16 {
    max-width: 28%;
}
.element16 {
    left: 0%;
}

.ele17 {
    max-width: 30%;
}
.element17 {
    left: 0%;
}

.ele18 {
    max-width: 35%;
}
.element18 {
    left: 0%;
}

.ele19 {
    max-width: 25%;
}
.ele19B {
    max-width: 19%;
    right: 6%;
    margin-top: 4%;
}
.element19 {
    right: -4%;
}

.ele20 {
    max-width: 49%;
}
.element20 {
    left: 0;
}

.ele22 {
    max-width: 20%;
}
.ele22A {
    max-width: 10%;
    left: 0;
    top: 51%;
}
.element22 {left: 0;}

.ele23 {
    max-width: 40%;
}
.element23 {
    right: 0%;
}

.ele24 {
    max-width: 100%;
}
.element24 {
    left: 0%;
}

.ele25 {
    max-width: 40%;
}
.element25 {
    right: -3%;
}

.ele26 {
    max-width: 45%;
}
.ele26A {
    max-width: 30%;
    right: -12%;
    top: 51%;
}
.element26 {right: -1%;}

.ele27 {
    max-width: 30%;
}
.element27 {
    right: -2%;
}

.ele28 {
    max-width: 32%;
}
.ele28A {
    max-width: 8%;
    left: 72%;
    top: 13%;
}
.element28 {right: .5%;}

.ele29 {
    max-width: 35%;
}
.ele29A {
    max-width: 17%;
    right: 0;
    top: 23%;
}
.element29 {right: 0;}


.ele30 {
    max-width: 40%;
}
.ele30A {
    max-width: 16%;
    left: 73%;
    top: -19%;
}
.element30 {
    right: -9%;
}

.ele31 {
    max-width: 33%;
}
.element31 {
    right: 0%;
}

.ele32 {
    max-width: 52%;
}
.element32 {
    left: 2%;
}

.ele33 {
    max-width: 48%;
}
.element33 {
    left: -4%;
}

.ele34 {
    max-width: 34%;
}
.ele34A {
    max-width: 7%;
    right: 0;
    bottom: 0;
}
.element34 {right: 0;}

.ele35 {
    max-width: 70%;
}
.element35 {
    left: 0%;
}

.ele36 {
    max-width: 40%;
}
.element36 {
    right: 0%;
}

}

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

}



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

	
	.mycontainer-right{width: 950px;}
	.mycontainer-left{width: 950px;}	
	
.arrow1{max-width:100%;}
	
}


@media only screen and (min-width: 992px) {
	.ex{
		background-color:blue;
	}
	.mainvideo {
		position: absolute;
		width: 457px;
		top: 22px;
		left: 20px;
	}
	.video {
        width: 429px;
        height: 162px;
        top: 21px;
        left: 11px;
        margin-bottom: 10%;
    }

	
	.mycontainer-right{width: 950px;}	
	.mycontainer-left{width: 950px;}	

.titleBg1-text{font-size: 31px;}






.catch {
    max-width: 115%;
    left: -7%;
}

.section15-box{margin-top: 3%;}

/*elements*/
.ele1 {
    max-width: 70%;
}
.element1 {
    right: -1.5%;
}

.ele2 {
    max-width: 50%;
}
.element2 {
    left: 10.5%;
}

.ele3 {
    max-width: 30%;
}
.ele3A {
    max-width: 6%;
    right: -4%;
    margin-top: 0;
}
.ele3B {
    max-width: 7%;
    right: 1%;
    margin-top: -4%;
}
.element3 {
    right: 2.2%;
}

.ele4A {
    max-width: 50%;
}
.ele4B {
    max-width: 25%;
    right: 61%;
    top: 38%;
}
.element4 {
    left: -3%;
}

.ele5 {
    max-width: 20%;
    right: 41%;
}
.ele5B {
    max-width: 50%;
    left: 0;
}
.element5 {
    left: 0;
}

.ele6 {
    max-width: 60%;
}
.element6 {
    right: 5.2%;
}

.ele7 {
    max-width: 60%;
}
.element7 {
    left: 22%;
}

.ele8 {
    max-width: 60%;
}
.element8 {
    right: 21.2%;
}

.ele9 {
    max-width: 26%;
    top: 14%;
    left: 59%;
}
.ele9B {
    max-width: 45%;
}
.element9 {
    right: -8%;
}

.ele10 {
    max-width: 36%;
}
.element10 {
    left: -1%;
}


.ele11 {
    max-width: 60%;
}
.element11 {
    right: 0%;
}

.ele12 {
    max-width: 40%;
}
.element12 {
    left: 0%;
}

.ele13 {
    max-width: 34%;
}
.element13 {
    left: 0;
}

.ele14 {
    max-width: 15%;
}
.element14 {
    right: 0%;
}

.ele15 {
    max-width: 30%;
}
.element15 {
    left: 0%;
}

.ele16 {
    max-width: 40%;
}
.element16 {
    left: 0%;
}

.ele17 {
    max-width: 50%;
}
.element17 {
    left: 0%;
}

.ele18 {
    max-width: 40%;
}
.element18 {
    left: 0%;
}

.ele19 {
    max-width: 34%;
}
.ele19B {
    max-width: 30%;
    right: 5%;
    margin-top: -1%;
}
.element19 {
    right: 0;
}

.ele20 {
    max-width: 50%;
}
.element20 {
    left: 0;
}

.ele22 {
    max-width: 29%;
}
.ele22A {
    max-width: 15%;
    left: 0;
    top: 51%;
}
.element22 {left: 0;}

.ele23 {
    max-width: 30%;
}
.element23 {
    right: 0%;
}

.ele24 {
    max-width: 100%;
}
.element24 {
    left: 0%;
}

.ele25 {
    max-width: 50%;
}
.element25 {
    right: 0;
}

.ele26 {
    max-width: 50%;
}
.ele26A {
    max-width: 28%;
    right: -12%;
    top: 51%;
}
.element26 {right: 0;}

.ele27 {
    max-width: 40%;
}
.element27 {
    right: -2%;
}

.ele28 {
    max-width: 45%;
}
.ele28A {
    max-width: 13%;
    left: 62%;
    top: 13%;
}
.element28 {right: .5%;}

.ele29 {
    max-width: 46%;
}
.ele29A {
    max-width: 20%;
    right: 0;
    top: 23%;
}
.element29 {right: 0;}


.ele30 {
    max-width: 50%;
}
.ele30A {
    max-width: 20%;
    left: 66%;
    top: -19%;
}
.element30 {
    right: -9%;
}

.ele31 {
    max-width: 45%;
}
.element31 {
    right: 0%;
}

.ele32 {
    max-width: 70%;
}
.element32 {
    left: 0;
}

.ele33 {
    max-width: 42%;
}
.element33 {
    left: -2%;
}

.ele34 {
    max-width: 24%;
}
.ele34A {
    max-width: 14%;
    right: 0;
    bottom: 0;
}
.element34 {right: 0;}

.ele35 {
    max-width: 56%;
}
.element35 {
    left: 0%;
}

.ele36 {
    max-width: 25%;
}
.element36 {
    right: 0%;
}

}


@media only screen and (min-width: 1100px) {
	
	
	.mycontainer-right{width: 1027px;}	
	.mycontainer-left{width: 1027px;}

.titleBg1-text{font-size: 33px;}


.arrow1{max-width: 20%;}





.catch {
    max-width: 120%;
    left: -7%;
}

.section15-box{margin-top: 3%;}

/*elements*/
.ele1 {
    max-width: 70%;
}
.element1 {
    right: -3.5%;
}

.ele2 {
    max-width: 50%;
}
.element2 {
    left: 5.5%;
}

.ele3 {
    max-width: 33%;
}
.ele3A {
    max-width: 7%;
    right: -5%;
    margin-top: 0;
}
.ele3B {
    max-width: 8%;
    right: 1%;
    margin-top: -4%;
}
.element3 {
    right: 2.2%;
}

.ele4A {
    max-width: 56%;
}
.ele4B {
    max-width: 20%;
    right: 67%;
    top: 51%;
}
.element4 {
    left: -1%;
}

.ele5 {
    max-width: 23%;
    right: 39%;
}
.ele5B {
    max-width: 60%;
    left: 0;
}
.element5 {
    left: 0;
}

.ele6 {
    max-width: 60%;
}
.element6 {
    right: 5.2%;
}

.ele7 {
    max-width: 100%;
}
.element7 {
    left: 22%;
}

.ele8 {
    max-width: 100%;
}
.element8 {
    right: 21.2%;
}

.ele9 {
    max-width: 30%;
    top: 14%;
    left: 62%;
}
.ele9B {
    max-width: 40%;
}
.element9 {
    right: -2%;
}

.ele10 {
    max-width: 40%;
}
.element10 {
    left: 0%;
}


.ele11 {
    max-width: 60%;
}
.element11 {
    right: 0%;
}

.ele12 {
    max-width: 40%;
}
.element12 {
    left: 0%;
}

.ele13 {
    max-width: 40%;
}
.element13 {
    left: 1.5%;
}

.ele14 {
    max-width: 31%;
}
.element14 {
    right: 0%;
}

.ele15 {
    max-width: 30%;
}
.element15 {
    left: 0%;
}

.ele16 {
    max-width: 40%;
}
.element16 {
    left: 0%;
}

.ele17 {
    max-width: 50%;
}
.element17 {
    left: 0%;
}

.ele18{
    max-width: 40%;
}
.element18 {
    left: 0%;
}		

.ele19 {
    max-width: 45%;
}
.ele19B {
    max-width: 40%;
    right: 6%;
    margin-top: 3%;
}
.element19 {
    right: 1%;
}

.ele20 {
    max-width: 60%;
}
.element20 {
    left: 0;
}

.ele22 {
    max-width: 40%;
}
.ele22A {
    max-width: 28%;
    left: 0;
    top: 51%;
}
.element22 {left: 0;}

.ele23 {
    max-width: 40%;
}
.element23 {
    right: 0%;
}

.ele24 {
    max-width: 100%;
}
.element24 {
    left: 0%;
}

.ele25 {
    max-width: 50%;
}
.element25 {
    right: 0;
}

.ele26 {
    max-width: 60%;
}
.ele26A {
    max-width: 30%;
    right: -12%;
    top: 51%;
}
.element26 {right: 0;}

.ele27 {
    max-width: 50%;
}
.element27 {
    right: -2%;
}

.ele28 {
    max-width: 45%;
}
.ele28A {
    max-width: 13%;
    left: 62%;
    top: 13%;
}
.element28 {right: .5%;}

.ele29 {
    max-width: 44%;
}
.ele29A {
    max-width: 18%;
    right: 0;
    top: 23%;
}
.element29 {right: 0;}


.ele30 {
    max-width: 50%;
}
.ele30A {
    max-width: 21%;
    left: 65%;
    top: -19%;
}
.element30 {
    right: -9%;
}

.ele31 {
    max-width: 52%;
}
.element31 {
    right: 0%;
}

.ele32 {
    max-width: 70%;
}
.element32 {
    left: 2%;
}

.ele33 {
    max-width: 64%;
}
.element33 {
    left: -2%;
}

.ele34 {
    max-width: 43%;
}
.ele34A {
    max-width: 19%;
    right: 0;
    bottom: 0;
}
.element34 {right: 0;}

.ele35 {
    max-width: 80%;
}
.element35 {
    left: 0%;
}

.ele36 {
    max-width: 60%;
}
.element36 {
    right: 0%;
}
}



@media only screen and (min-width: 1200px) {
	.ex{
		background-color:pink;
	}
	.mainvideo {
		position: absolute;
		width: 547px;
		height: 0;
		top: 31px;
		left: 24px;
	}
	.video {
        width: 403px;
        height: 196px;
        top: 1px;
        left: 0px;
        margin-bottom: 0px;
    }

	
	.mycontainer-right{width: 1094px;}	
	.mycontainer-left{width: 1094px;}	

.titleBg1-text{font-size: 30px;}


.arrow1{max-width: 18%;}





.catch {
    max-width: 130%;
    left: -7%;
}

.section15-box{margin-top: 3%;}

/*elements*/
.ele1 {
    max-width: 70%;
}
.element1 {
    right: -1.5%;
}

.ele2 {
    max-width: 50%;
}
.element2 {
    left: 10.5%;
}

.ele3 {
    max-width: 35%;
}
.ele3A {
    max-width: 8%;
    right: -7%;
    margin-top: 0;
}
.ele3B {
    max-width: 8%;
    right: 1%;
    margin-top: -4%;
}
.element3 {
    right: 2.2%;
}

.ele4A {
    max-width: 60%;
}
.ele4B {
    max-width: 20%;
    right: 63%;
    top: 51%;
}
.element4 {
    left: 0;
}

.ele5 {
    max-width: 24%;
    right: 29%;
}
.ele5B {
    max-width: 61%;
    left: 0;
}
.element5 {
    left: -1%;
}

.ele6 {
    max-width: 50%;
}
.element6 {
    right: 5.2%;
}

.ele7 {
    max-width: 100%;
}
.element7 {
    left: 22%;
}

.ele8 {
    max-width: 100%;
}
.element8 {
    right: 21.2%;
}

.ele9 {
    max-width: 60%;
    top: 14%;
    left: 54%;
}
.ele9B {
    max-width: 50%;
}
.element9 {
    right: 0%;
}

.ele10 {
    max-width: 40%;
}
.element10 {
    left: 0%;
}


.ele11 {
    max-width: 60%;
}
.element11 {
    right: 0%;
}

.ele12 {
    max-width: 40%;
}
.element12 {
    left: 0%;
}

.ele13 {
    max-width: 40%;
}
.element13 {
    left: 1.5%;
}

.ele14 {
    max-width: 48%;
}
.element14 {
    right: 0%;
}

.ele15 {
    max-width: 43%;
}
.element15 {
    left: 0%;
}

.ele16 {
    max-width: 40%;
}
.element16 {
    left: 0%;
}

.ele17 {
    max-width: 50%;
}
.element17 {
    left: 0%;
}

.ele18 {
    max-width: 40%;
}
.element18 {
    left: 0%;
}

.ele19 {
    max-width: 50%;
}
.ele19B {
    max-width: 40%;
    right: 9%;
    margin-top: 9%;
}
.element19 {
    right: 1%;
}

.ele20 {
    max-width: 70%;
}
.element20 {
    left: 0;
}

.ele22 {
    max-width: 50%;
}
.ele22A {
    max-width: 30%;
    left: 0;
    top: 51%;
}
.element22 {left: 0;}

.ele23 {
    max-width: 60%;
}
.element23 {
    right: 0%;
}

.ele24 {
    max-width: 100%;
}
.element24 {
    left: 0%;
}

.ele25 {
    max-width: 60%;
}
.element25 {
    right: -1%;
}

.ele26 {
    max-width: 80%;
}
.ele26A {
    max-width: 30%;
    right: -12%;
    top: 51%;
}
.element26 {right: 0;}

.ele27 {
    max-width: 60%;
}
.element27 {
    right: -2%;
}

.ele28 {
    max-width: 45%;
}
.ele28A {
    max-width: 13%;
    left: 61%;
    top: 13%;
}
.element28 {right: .5%;}

.ele29 {
    max-width: 60%;
}
.ele29A {
    max-width: 30%;
    right: 0;
    top: 23%;
}
.element29 {right: 0;}


.ele30 {
    max-width: 60%;
}
.ele30A {
    max-width: 25%;
    left: 57%;
    top: -20%;
}
.element30 {
    right: -9%;
}

.ele31 {
    max-width: 56%;
}
.element31 {
    right: 0%;
}

.ele32 {
    max-width: 70%;
}
.element32 {
    left: 3%;
}

.ele33 {
    max-width: 42%;
}
.element33 {
    left: -1%;
}

.ele34 {
    max-width: 54%;
}
.ele34A {
    max-width: 24%;
    right: 0;
    bottom: 0;
}
.element34 {right: 0;}

.ele35 {
    max-width: 90%;
}
.element35 {
    left: 0%;
}

.ele36 {
    max-width: 60%;
}
.element36 {
    right: 0%;
}

}


@media (min-width:1300px) {
	.mycontainer{width:1219px;}
	.mycontainer1{width:1219px;}
	.mycontainer2{width:1180px;}	
	.mycontainer3{width:1180px;}	
	
	.mycontainer-right{width: 1273px;}	
	.mycontainer-left{width: 1273px;}	
	
	.ex{background-color:blue}
		
	
	.mainvideo {
		position: absolute;
		width: 590px;
		height: 0;
		top: 31px;
		left: 28px;
	}

.titleBg1-text{font-size: 44px;}


.arrow1{max-width: 16%;}



/**/
.connection4, .connection5, .connection4B, .connection5B, .connection4C, .connection5D{
    max-width:100%;
}

.step1tag, .step2tag, .step3tag{max-width:100%;}
.select, .customize, .render{max-width:100%;}
.problem-box, .solution-box{
	padding: 9% 15% 10% 15%;
}
.checklist1, .checklist2 {
    margin-top: 14%;
}



.catch {
    max-width: 120%;
    left: -4%;
}

.section15-box{margin-top: 3%;}

/*elements*/
.ele1 {
    max-width: 70%;
}
.element1 {
    right: -1.5%;
}

.ele2 {
    max-width: 50%;
}
.element2 {
    left: 10.5%;
}

.ele3 {
    max-width: 39%;
}
.ele3A {
    max-width: 6%;
    right: -5%;
    margin-top: 0;
}
.ele3B {
    max-width: 10%;
    right: 1%;
    margin-top: -4%;
}
.element3 {
    right: 2.2%;
}

.ele4A {
    max-width: 58%;
}
.ele4B {
    max-width: 20%;
    right: 62%;
    top: 51%;
}
.element4 {
    left: 0;
}

.ele5 {
    max-width: 23%;
    right: 29%;
}
.ele5B {
    max-width: 65%;
    left: 0;
}
.element5 {
    left: 3%;
}

.ele6 {
    max-width: 60%;
}
.element6 {
    right: 5.2%;
}

.ele7 {
    max-width: 100%;
}
.element7 {
    left: 22%;
}

.ele8 {
    max-width: 100%;
}
.element8 {
    right: 21.2%;
}

.ele9 {
    max-width: 40%;
    top: 14%;
    left: 54%;
}
.ele9B {
    max-width: 50%;
}
.element9 {
    right: 0%;
}

.ele10 {
    max-width: 40%;
}
.element10 {
    left: 0%;
}


.ele11 {
    max-width: 50%;
}
.element11 {
    right: 0%;
}

.ele12 {
    max-width: 48%;
}
.element12 {
    left: 0%;
}

.ele13 {
    max-width: 44%;
}
.element13 {
    left: 2.5%;
}

.ele14 {
    max-width: 24%;
}
.element14 {
    right: 0%;
}

.ele15 {
    max-width: 44%;
}
.element15 {
    left: 0%;
}

.ele16 {
    max-width: 40%;
}
.element16 {
    left: 0%;
}

.ele17 {
    max-width: 50%;
}
.element17 {
    left: 0%;
}

.ele18 {
    max-width: 40%;
}
.element18 {
    left: 0%;
}

.ele19 {
    max-width: 57%;
}
.ele19B {
    max-width: 38%;
    right: 18%;
    margin-top: 10%;
}
.element19 {
    right: 1%;
}

.ele20 {
    max-width: 80%;
}
.element20 {
    left: 0;
}

.ele22 {
    max-width: 60%;
}
.ele22A {
    max-width: 30%;
    left: 0;
    top: 51%;
}
.element22 {left: 0;}

.ele23 {
    max-width: 60%;
}
.element23 {
    right: 0%;
}

.ele24 {
    max-width: 100%;
}
.element24 {
    left: 0%;
}

.ele25 {
    max-width: 60%;
}
.element25 {
    right: 0;
}

.ele26 {
    max-width: 70%;
}
.ele26A {
    max-width: 30%;
    right: -12%;
    top: 51%;
}
.element26 {right: 0;}

.ele27 {
    max-width: 60%;
}
.element27 {
    right: -2%;
}

.ele28 {
    max-width: 45%;
}
.ele28A {
    max-width: 13%;
    left: 62%;
    top: 13%;
}
.element28 {right: .5%;}

.ele29 {
    max-width: 60%;
}
.ele29A {
    max-width: 30%;
    right: 0;
    top: 23%;
}
.element29 {right: 0;}


.ele30 {
    max-width: 60%;
}
.ele30A {
    max-width: 25%;
    left: 57%;
    top: -19%;
}
.element30 {
    right: -9%;
}

.ele31 {
    max-width: 56%;
}
.element31 {
    right: 0%;
}

.ele32 {
    max-width: 70%;
}
.element32 {
    left: 2%;
}

.ele33 {
    max-width: 47%;
}
.element33 {
    left: 0%;
}

.ele34 {
    max-width: 42%;
}
.ele34A {
    max-width: 20%;
    right: 0;
    bottom: 0;
}
.element34 {right: 0;}

.ele35 {
    max-width: 80%;
}
.element35 {
    left: 0%;
}

.ele36 {
    max-width: 60%;
}
.element36 {
    right: 0%;
}

}

@media (min-width:1400px) {
	.mycontainer{width:1370px;}
	.mycontainer1{width:1370px;}
	.mycontainer2{width:1219px;;}
	.mycontainer3{width: 1290px;}
	
	.mycontainer-right{width: 1335px;}
	.mycontainer-left{width: 1335px;}
	
	.ex{background-color:silver}
	
	
	.mainvideo {
		position: absolute;
		width: 635px;
		height: 0;
		top: 33px;
		left: 28px;
	}

.titleBg1-text{font-size: 42px;}


.arrow1{max-width: 18%;}




.catch {
    max-width: 120%;
    left: -7%;
}

.section15-box{margin-top: 3%;}

/*elements*/
.ele1 {
    max-width: 100%;
}
.element1 {
    right: -1.5%;
}

.ele2 {
    max-width: 55%;
}
.element2 {
    left: 10.5%;
}

.ele3 {
    max-width: 43%;
}
.ele3A {
    max-width: 5%;
    right: -5%;
    margin-top: 0;
}
.ele3B {
    max-width: 7%;
    right: 1%;
    margin-top: -4%;
}
.element3 {
    right: 2.2%;
}

.ele4A {
    max-width: 58%;
}
.ele4B {
    max-width: 20%;
    right: 62%;
    top: 51%;
}
.element4 {
    left: 3%;
}

.ele5 {
    max-width: 20%;
    right: 29%;
}
.ele5B {
    max-width: 70%;
    left: 0;
}
.element5 {
    left: 3%;
}

.ele6 {
    max-width: 80%;
}
.element6 {
    right: 5.2%;
}

.ele7 {
    max-width: 100%;
}
.element7 {
    left: 22%;
}

.ele8 {
    max-width: 100%;
}
.element8 {
    right: 21.2%;
}

.ele9 {
    max-width: 50%;
    top: 14%;
    left: 54%;
}
.ele9B {
    max-width: 57%;
}
.element9 {
    right: 0%;
}

.ele10 {
    max-width: 56%;
}
.element10 {
    left: 0%;
}


.ele11 {
    max-width: 65%;
}
.element11 {
    right: 0%;
}

.ele12 {
    max-width: 50%;
}
.element12 {
    left: 0%;
}

.ele13 {
    max-width: 50%;
}
.element13 {
    left: 2.5%;
}

.ele14 {
    max-width: 35%;
}
.element14 {
    right: 0%;
}

.ele15 {
    max-width: 50%;
}
.element15 {
    left: 0%;
}

.ele16 {
    max-width: 100%;
}
.element16 {
    left: 0%;
}

.ele17 {
    max-width: 100%;
}
.element17 {
    left: 0%;
}

.ele18 {
    max-width: 60%;
}
.element18 {
    left: 0%;
}

.ele19 {
    max-width: 60%;
}
.ele19B {
    max-width: 45%;
    right: 17%;
    margin-top: 5%;
}
.element19 {
    right: 1%;
}

.ele20 {
    max-width: 70%;
}
.element20 {
    left: 0;
}

.ele22 {
    max-width: 50%;
}
.ele22A {
    max-width: 30%;
    left: 0;
    top: 51%;
}
.element22 {left: 0;}

.ele23 {
    max-width: 60%;
}
.element23 {
    right: 0%;
}

.ele24 {
    max-width: 100%;
}
.element24 {
    left: 0%;
}

.ele25 {
    max-width: 70%;
}
.element25 {
    right: 0;
}

.ele26 {
    max-width: 80%;
}
.ele26A {
    max-width: 30%;
    right: -9%;
    top: 51%;
}
.element26 {right: 0;}

.ele27 {
    max-width: 60%;
}
.element27 {
    right: -2%;
}

.ele28 {
    max-width: 40%;
}
.ele28A {
    max-width: 20%;
    left: 61%;
    top: 6%;
}
.element28 {right: .5%;}

.ele29 {
    max-width: 60%;
}
.ele29A {
    max-width: 30%;
    right: 0;
    top: 23%;
}
.element29 {right: 0;}


.ele30 {
    max-width: 65%;
}
.ele30A {
    max-width: 26%;
    left: 53%;
    top: -13%;
}
.element30 {
    right: -9%;
}

.ele31 {
    max-width: 48%;
}
.element31 {
    right: 0%;
}

.ele32 {
    max-width: 90%;
}
.element32 {
    left: 1%;
}

.ele33 {
    max-width: 60%;
}
.element33 {
    left: 1%;
}

.ele34 {
    max-width: 50%;
}
.ele34A {
    max-width: 23%;
    right: 0;
    bottom: 0;
}
.element34 {right: 0;}

.ele35 {
    max-width: 90%;
}
.element35 {
    left: 0%;
}

.ele36 {
    max-width: 60%;
}
.element36 {
    right: 0%;
}

}

@media (min-width:1500px) {
	.mycontainer{width: 1520px;}
	.mycontainer1{width: 1380px;}
	.mycontainer2{width:1219px;}
	.mycontainer3{width: 1390px;}
	
	.mycontainer-right{width: 1379px;}
	.mycontainer-left{width: 1379px;}
	
	.ex{background-color:pink}

	
	.mainvideo {
		position: absolute;
		width: 684px;
		height: 0;
		top: 36px;
		left: 30px;
	}

.titleBg1-text{font-size: 51px;}

.arrow1{max-width: 18%;}



.catch {
    max-width: 130%;
    left: -7%;
}

.section15-box{margin-top: 3%;}


.crayonVidB, .charcoalVidB, .animatedVidB, .pencilVidB, .chalkboardVidB, .blueprintVidB {
    width: 87%;
}

/*elements*/
.ele1 {
    max-width: 80%;
}
.element1 {
    right: -0.5%;
}

.ele2 {
    max-width: 70%;
}
.element2 {
    left: 10.5%;
}

.ele3 {
    max-width: 50%;
}
.ele3A {
    max-width: 8%;
    right: -9%;
    margin-top: 0;
}
.ele3B {
    max-width: 10%;
    right: 3%;
    margin-top: -4%;
}
.element3 {
    right: 2.2%;
}

.ele4A {
    max-width: 70%;
}
.ele4B {
    max-width: 40%;
    right: 48%;
    top: 51%;
}
.element4 {
    left: 1%;
}

.ele5 {
    max-width: 23%;
    right: 24%;
}
.ele5B {
    max-width: 68%;
    left: 0;
}
.element5 {
    left: 3%;
}

.ele6 {
    max-width: 60%;
}
.element6 {
    right: 5.2%;
}

.ele7 {
    max-width: 100%;
}
.element7 {
    left: 22%;
}

.ele8 {
    max-width: 100%;
}
.element8 {
    right: 21.2%;
}

.ele9 {
    max-width: 50%;
    top: 14%;
    left: 46%;
}
.ele9B {
    max-width: 64%;
}
.element9 {
    right: 0%;
}

.ele10 {
    max-width: 70%;
}
.element10 {
    left: 0%;
}


.ele11 {
    max-width: 60%;
}
.element11 {
    right: 0%;
}

.ele12 {
    max-width: 60%;
}
.element12 {
    left: 0%;
}

.ele13 {
    max-width: 60%;
}
.element13 {
    left: 1.5%;
}

.ele14 {
    max-width: 50%;
}
.element14 {
    right: 0%;
}

.ele15 {
    max-width: 60%;
}
.element15 {
    left: 0%;
}

.ele16 {
    max-width: 70%;
}
.element16 {
    left: 0%;
}

.ele17 {
    max-width: 70%;
}
.element17 {
    left: 0%;
}

.ele18 {
    max-width: 60%;
}
.element18 {
    left: 0%;
}

.ele19 {
    max-width: 60%;
}
.ele19B {
    max-width: 40%;
    right: 17%;
    margin-top: 11%;
}
.element19 {
    right: 1%;
}

.ele20 {
    max-width: 80%;
}
.element20 {
    left: 0;
}

.ele22 {
    max-width: 60%;
}
.ele22A {
    max-width: 30%;
    left: 0;
    top: 51%;
}
.element22 {left: 0;}

.ele23 {
    max-width: 60%;
}
.element23 {
    right: 0%;
}

.ele24 {
    max-width: 100%;
}
.element24 {
    left: 0%;
}

.ele25 {
    max-width: 70%;
}
.element25 {
    right: 0;
}

.ele26 {
    max-width: 80%;
}
.ele26A {
    max-width: 30%;
    right: -9%;
    top: 51%;
}
.element26 {right: 0;}

.ele27 {
    max-width: 60%;
}
.element27 {
    right: 0;
}

.ele28 {
    max-width: 60%;
}
.ele28A {
    max-width: 18%;
    left: 51%;
    top: 13%;
}
.element28 {right: .5%;}

.ele29 {
    max-width: 70%;
}
.ele29A {
    max-width: 35%;
    right: 0;
    top: 23%;
}
.element29 {right: 0;}


.ele30 {
    max-width: 66%;
}
.ele30A {
    max-width: 25%;
    left: 53%;
    top: -8%;
}
.element30 {
    right: -9%;
}

.ele31 {
    max-width: 60%;
}
.element31 {
    right: 0%;
}

.ele32 {
    max-width: 92%;
}
.element32 {
    left: 2%;
}


.ele33 {
    max-width: 80%;
}
.element33 {
    left: 1%;
}

.ele34 {
    max-width: 58%;
}
.ele34A {
    max-width: 26%;
    right: 0;
    bottom: 0;
}
.element34 {right: 0;}

.ele35 {
    max-width: 90%;
}
.element35 {
    left: 0%;
}

.ele36 {
    max-width: 70%;
}
.element36 {
    right: 0%;
}

}


@media (min-width:1600px){
	
	.mycontainer1{width: 1450px;}
	.mycontainer3{width: 1450px;}
	
	.mycontainer-right{width: 1400px;}
	.mycontainer-left{width: 1400px;}

	
	.mainvideo {
		position: absolute;
		width: 726px;
		height: 0;
		top: 39px;
		left: 32px;
	}
	
.titleBg1-text{font-size: 49px;}

.arrow1{max-width:100%;}



.catch {
    max-width: 130%;
    left: 0%;
}

.section15-box{margin-top: 3%;}

/*elements*/
.ele1 {
    max-width: 100%;
}
.element1 {
    right: -1.5%;
}

.ele2 {
    max-width: 80%;
}
.element2 {
    left: 10.5%;
}

.ele3 {
    max-width: 60%;
}
.ele3A {
    max-width: 10%;
    right: -12%;
    margin-top: 15%;
}
.ele3B {
    max-width: 14%;
    right: 0%;
    margin-top: 1%;
}
.element3 {
    right: 2.2%;
}

.ele4A {
    max-width: 82%;
}
.ele4B {
    max-width: 82%;
    right: 42%;
    top: 48%;
}
.element4 {
    left: 1%;
}

.ele5 {
    max-width: 20%;
    right: 23%;
}
.ele5B {
    max-width: 80%;
    left: 0;
}
.element5 {
    left: 3%;
}

.ele6 {
    max-width: 80%;
}
.element6 {
    right: 5.2%;
}

.ele7 {
    max-width: 100%;
}
.element7 {
    left: 22%;
}

.ele8 {
    max-width: 100%;
}
.element8 {
    right: 21.2%;
}

.ele9 {
    max-width: 60%;
    top: 14%;
    left: 24%;
}
.ele9B {
    max-width: 80%;
}
.element9 {
    right: -2%;
}

.ele10 {
    max-width: 75%;
}
.element10 {
    left: 0%;
}


.ele11 {
    max-width: 80%;
}
.element11 {
    right: 0%;
}

.ele12 {
    max-width: 90%;
}
.element12 {
    left: 0%;
}

.ele13 {
    max-width: 80%;
}
.element13 {
    left: 3.5%;
}

.ele14 {
    max-width: 66%;
}
.element14 {
    right: 0%;
}

.ele15 {
    max-width: 70%;
}
.element15 {
    left: 0%;
}

.ele16 {
    max-width: 80%;
}
.element16 {
    left: 0%;
}

.ele17 {
    max-width: 80%;
}
.element17 {
    left: 0%;
}

.ele18 {
    max-width: 90%;
}
.element18 {
    left: 0%;
}

.ele19 {
    max-width: 65%;
}
.ele19B {
    max-width: 45%;
    right: 18%;
    margin-top: 8%;
}
.element19 {
    right: 1%;
}

.ele20 {
    max-width: 80%;
}
.element20 {
    left: 0;
}

.ele22 {
    max-width: 60%;
}
.ele22A {
    max-width: 30%;
    left: 0;
    top: 51%;
}
.element22 {left: 0;}

.ele23 {
    max-width: 60%;
}
.element23 {
    right: 0%;
}

.ele24 {
    max-width: 100%;
}
.element24 {
    left: 0%;
}

.ele25 {
    max-width: 70%;
}
.element25 {
    right: 0;
}

.ele26 {
    max-width: 80%;
}
.ele26A {
    max-width: 30%;
    right: -8%;
    top: 51%;
}
.element26 {right: 0;}

.ele27 {
    max-width: 70%;
}
.element27 {
    right: 0;
}

.ele28 {
    max-width: 60%;
}
.ele28A {
    max-width: 20%;
    left: 51%;
    top: 13%;
}
.element28 {right: .5%;}

.ele29 {
    max-width: 60%;
}
.ele29A {
    max-width: 30%;
    right: 0;
    top: 23%;
}
.element29 {right: 0;}


.ele30 {
    max-width: 75%;
}
.ele30A {
    max-width: 25%;
    left: 50%;
    top: 0;
}
.element30 {
    right: -9%;
}

.ele31 {
    max-width: 65%;
}
.element31 {
    right: 0%;
}

.ele32 {
    max-width: 80%;
}
.element32 {
    left: 3%;
}

.ele33 {
    max-width: 70%;
}
.element33 {
    left: 3.5%;
}

.ele34 {
    max-width: 63%;
}
.ele34A {
    max-width: 28%;
    right: 0;
    bottom: 0;
}
.element34 {right: 0;}

.ele35 {
    max-width: 80%;
}
.element35 {
    left: 0%;
}

.ele36 {
    max-width: 80%;
}
.element36 {
    right: 0%;
}
	
}
@media (min-width:1800px){
	
	.mycontainer1{width: 1450px;}
	.mycontainer3{width: 1450px;}
	
	.mycontainer-right{width: 1513px;}
	.mycontainer-left{width: 1513px;}
	
	
	.mainvideo {
		position: absolute;
		width: 822px;
		height: 0;
		top: 44px;
		left: 39px;
	}


.titleBg1-text{font-size: 51px;}

.arrow1{max-width:100%;}




.catch {
    max-width: 150%;
    left: -7%;
}

.section15-box{margin-top: 3%;}

/*elements*/
.ele1 {
    max-width: 100%;
}
.element1 {
    right: -1.5%;
}

.ele2 {
    max-width: 80%;
}
.element2 {
    left: 10.5%;
}

.ele3 {
    max-width: 70%;
}
.ele3A {
    max-width: 100%;
    right: -16%;
    margin-top: 22%;
}
.ele3B {
    max-width: 100%;
    right: 1%;
    margin-top: -4%;
}
.element3 {
    right: 2.2%;
}

.ele4A {
    max-width: 92%;
}
.ele4B {
    max-width: 92%;
    right: 29%;
    top: 51%;
}
.element4 {
    left: 3%;
}

.ele5 {
    max-width: 90%;
    right: 0;
}
.ele5B {
    max-width: 95%;
    left: 0;
}
.element5 {
    left: 3%;
}

.ele6 {
    max-width: 90%;
}
.element6 {
    right: 5.2%;
}

.ele7 {
    max-width: 100%;
}
.element7 {
    left: 22%;
}

.ele8 {
    max-width: 100%;
}
.element8 {
    right: 21.2%;
}

.ele9 {
    max-width: 90%;
    top: 14%;
    left: 18%;
}
.ele9B {
    max-width: 90%;
}
.element9 {
    right: 0%;
}

.ele10 {
    max-width: 90%;
}
.element10 {
    left: 0%;
}


.ele11 {
    max-width: 80%;
}
.element11 {
    right: 0%;
}

.ele12 {
    max-width: 90%;
}
.element12 {
    left: 0%;
}

.ele13 {
    max-width: 90%;
}
.element13 {
    left: 6.5%;
}

.ele14 {
    max-width: 100%;
}
.element14 {
    right: 0%;
}

.ele15 {
    max-width: 90%;
}
.element15 {
    left: 0%;
}

.ele16 {
    max-width: 88%;
}
.element16 {
    left: 0%;
}

.ele17 {
    max-width: 90%;
}
.element17 {
    left: 0%;
}

.ele18 {
    max-width: 90%;
}
.element18 {
    left: 0%;
}

.ele19 {
    max-width: 90%;
}
.ele19B {
    max-width: 54%;
    right: 31%;
    margin-top: 20%;
}
.element19 {
    right: 1%;
}

.ele20 {
    max-width: 80%;
}
.element20 {
    left: 0;
}

.ele22 {
    max-width: 80%;
}
.ele22A {
    max-width: 40%;
    left: 0;
    top: 51%;
}
.element22 {left: 0;}

.ele23 {
    max-width: 80%;
}
.element23 {
    right: 0%;
}

.ele24 {
    max-width: 100%;
}
.element24 {
    left: 0%;
}

.ele25 {
    max-width: 80%;
}
.element25 {
    right: 3%;
}

.ele26 {
    max-width: 84%;
}
.ele26A {
    max-width: 33%;
    right: -13%;
    top: 51%;
}
.element26 {right: 3%;}

.ele27 {
    max-width: 80%;
}
.element27 {
    right: 3%;
}

.ele28 {
    max-width: 90%;
}
.ele28A {
    max-width: 20%;
    left: 21%;
    top: 13%;
}
.element28 {right: .5%;}

.ele29 {
    max-width: 90%;
}
.ele29A {
    max-width: 40%;
    right: 0;
    top: 23%;
}
.element29 {right: 0;}


.ele30 {
    max-width: 90%;
}
.ele30A {
    max-width: 34%;
    left: 38%;
    top: -9%;
}
.element30 {
    right: -9%;
}

.ele31 {
    max-width: 95%;
}
.element31 {
    right: 0%;
}

.ele32 {
    max-width: 90%;
}
.element32 {
    left: 8%;
}

.ele33 {
    max-width: 90%;
}
.element33 {
    left: 7.5%;
}

.ele34 {
    max-width: 80%;
}
.ele34A {
    max-width: 36%;
    right: 0;
    bottom: 0;
}
.element34 {right: 0;}

.ele35 {
    max-width: 90%;
}
.element35 {
    left: 0%;
}

.ele36 {
    max-width: 80%;
}
.element36 {
    right: 0%;
}
}
@media (min-width:1900px){
	
	.mycontainer1{width: 1640px;}
	
	.mycontainer2{width:1330px;}
	.mycontainer3{width: 1477px;}
	
	.mycontainer-right{width: 1626px;}
	.mycontainer-left{width: 1626px;}
	
	
	.mainvideo {
		position: absolute;
		width: 880px;
		height: 0;
		top: 46px;
		left: 39px;
	}


.titleBg1-text{font-size: 53px;}

.arrow1{max-width:100%;}



.catch {
    max-width: 150%;
    left: -7%;
}

.section15-box{margin-top:0;}

/*elements*/
.ele1 {
    max-width: 100%;
}
.element1 {
    right: -1.5%;
}

.ele2 {
    max-width: 100%;
}
.element2 {
    left: 10.5%;
}

.ele3 {
    max-width: 100%;
}
.ele3A {
    max-width: 100%;
    right: -16%;
    margin-top: 23%;
}
.ele3B {
    max-width: 100%;
    right: 1%;
    margin-top: 1%;
}
.element3 {
    right: 2.2%;
}

.ele4A {
    max-width: 100%;
}
.ele4B {
    max-width: 100%;
    right: 28%;
    top: 51%;
}
.element4 {
    left: 3%;
}

.ele5 {
    max-width: 100%;
    right: 0;
}
.ele5B {
    max-width: 100%;
    left: 0;
}
.element5 {
    left: 3%;
}

.ele6 {
    max-width: 100%;
}
.element6 {
    right: 5.2%;
}

.ele7 {
    max-width: 100%;
}
.element7 {
    left: 22%;
}

.ele8 {
    max-width: 100%;
}
.element8 {
    right: 21.2%;
}

.ele9 {
    max-width: 100%;
    top: 14%;
    left: 14%;
}
.ele9B {
    max-width: 100%;
}
.element9 {
    right: 0%;
}

.ele10 {
    max-width: 100%;
}
.element10 {
    left: 0%;
}


.ele11 {
    max-width: 100%;
}
.element11 {
    right: 0%;
}

.ele12 {
    max-width: 100%;
}
.element12 {
    left: 0%;
}

.ele13 {
    max-width: 100%;
}
.element13 {
    left: 6.5%;
}

.ele14 {
    max-width: 100%;
}
.element14 {
    right: 0%;
}

.ele15 {
    max-width: 100%;
}
.element15 {
    left: 0%;
}

.ele16 {
    max-width: 100%;
}
.element16 {
    left: 0%;
}

.ele17 {
    max-width: 100%;
}
.element17 {
    left: 0%;
}

.ele18 {
    max-width: 100%;
}
.element18 {
    left: 0%;
}

.ele19 {
    max-width: 100%;
}
.ele19B {
    max-width: 100%;
    right: 31%;
    margin-top: 20%;
}
.element19 {
    right: 1%;
}

.ele20 {
    max-width: 100%;
}
.element20 {
    left: 0;
}

.ele22 {
    max-width: 100%;
}
.ele22A {
    max-width: 100%;
    left: 0;
    top: 51%;
}
.element22 {left: 0;}

.ele23 {
    max-width: 100%;
}
.element23 {
    right: 0%;
}

.ele24 {
    max-width: 100%;
}
.element24 {
    left: 0%;
}

.ele25 {
    max-width: 100%;
}
.element25 {
    right: 3%;
}

.ele26 {
    max-width: 100%;
}
.ele26A {
    max-width: 100%;
    right: -19%;
    top: 51%;
}
.element26 {right: 4%;}

.ele27 {
    max-width: 100%;
}
.element27 {
    right: 3%;
}

.ele28 {
    max-width: 100%;
}
.ele28A {
    max-width: 100%;
    left: 11%;
    top: 13%;
}
.element28 {right: .5%;}

.ele29 {
    max-width: 100%;
}
.ele29A {
    max-width: 100%;
    right: 0;
    top: 23%;
}
.element29 {right: 0;}


.ele30 {
    max-width: 100%;
}
.ele30A {
    max-width: 100%;
    left: 33%;
    top: -2%;
}
.element30 {
    right: -9%;
}

.ele31 {
    max-width: 100%;
}
.element31 {
    right: 0%;
}

.ele32 {
    max-width: 100%;
}
.element32 {
    left: 9%;
}

.ele33 {
    max-width: 100%;
}
.element33 {
    left: 7.5%;
}

.ele34 {
    max-width: 100%;
}
.ele34A {
    max-width: 100%;
    right: 0;
    bottom: 0;
}
.element34 {right: 0;}

.ele35 {
    max-width: 100%;
}
.element35 {
    left: 0%;
}

.ele36 {
    max-width: 100%;
}
.element36 {
    right: 0%;
}

}
@media (min-width:2000px){
.mycontainer2 {
    width: 1800px;
}
	.mycontainer3{width:1900px;}


	.mainvideo {
		position: absolute;
		width: 744px;
		height: 0;
		top: 46px;
		left: 199px;
	}
	


}

	
.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%;}.mtm4{margin-top:-4%;}.mtm6{margin-top:-6%;}.mtm7{margin-top: -7%;}.mtm8{margin-top:-8%;}.mtm9{margin-top:-9%;}.mtm20{margin-top:-20%;}.mtm12{margin-top:-12px;}.mtm40{margin-top:-40px;}
.mtm10{margin-top: -10%;}.mbm22{margin-bottom: -22px;}