/*bannerVideo-wrapper*/
	.bannerVideo-wrapper{position: relative; max-height: 760px;overflow: hidden; background-size: contain;}
	.bannerVideo-wrapper .content-mask{background-color: rgba(0,0,0,0.55);width: 100%; height: 100%;position: absolute;z-index: 20;top:0;left:0;}
	.bannerVideo-wrapper .video-wrapper{z-index: 10}
	.bannerVideo-wrapper .content-wrapper{width: 100%; position: absolute;z-index: 30;top:50%; left: 50%; -ms-transform: translate(-50%, -50%);-webkit-transform: translate(-50%, -50%);transform: translate(-50%, -50%);}
	.video-wrapper{position: relative;height: 0;overflow: hidden;padding-bottom: 56.25%;}
	.video-wrapper>iframe{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}	
	.content-wrapper img{margin: 0 auto;}
	.content-wrapper .videoText-md,.content-wrapper p.message{text-align: center;color: #fff;display: inline}
	.videoText-md.title{ display: block; }
	.content-wrapper p.message,
	.content-wrapper .videoText-md{ 
		font-size: calc( 14.4px + 3vw );
		margin-top: calc( 8px + 0.625vw );
		margin-bottom: calc( 8px + 0.625vw );
		line-height: 1.2;
	}

	.image{width: 100%;text-align: center;}

	/*when video cant play on the mobile device*/
	.video-bgi{background-image: url(../../images/bg.jpg);background-repeat: no-repeat;background-size: cover;background-position: 50% 50%;}
	.video-bgi>iframe{display: none}
	.bannerVideo-wrapper .content-mask-bright{background-color: transparent;}

	.btn-play{
		width: calc( 46px + 5vw );
	}

	/*image*/
	.rl-banner {
	    background-image: url(../../images/default/main.jpg);
	    background-repeat: no-repeat;
	    height: auto;
	    background-size: cover;
	    -moz-background-size: cover;
	    -o-background-size: cover;
	    -webkit-background-size: cover;
	    background-position: 40% 40%;
	    position: relative;
    	padding-bottom: 36.8%;
	}
		.rl-banner .content-wrapper{
			position: absolute;
		    width: 100%;
		    height: 100%;
		}


/*----- Solution -----*/
	.box1,
	.box2,
	.col-3 > .iframeWrapper{
		float: left;
	}
	.box1{ width: 42.1%; margin-right: 15px; }		
	.box2{ width: calc( 100% - 42.1% - 15px ); }
		.col-1{ width: 100%; margin-bottom: 15px; }
		.col-2{ width: 100%; margin-bottom: 15px; }
			.iframeWrapper{
				position: relative;
				/*padding-bottom: 66%;*/
			}
				.iframeWrapper>iframe{
					position: absolute;
					width: 100%;
					height: 100%;
				}
		.col-3 > .iframeWrapper{ width: calc( (100% - 15px) / 2 ); /*padding-bottom: calc( (50% - 15px) / 2 )*/}
		.col-3 .iframeWrapper:nth-of-type(1){
			margin-right: 15px;
		}

		.overlay{ display: none; }
		.img-overlay:hover{
			/*opacity: 0.5;
			box-shadow: 0 -205px 171.14px 14px rgba(0,0,0,.6) inset;
			background-color: #000;*/
		}
		.animated + .img-overlay2,
		.animated + .img-overlay3,
		.animated + .img-overlay4{
			position: absolute;
			transition: box-shadow 0.2s ease-in;
	    	-webkit-transition: box-shadow 0.2s ease-in;
	    	cursor: pointer;
	    	pointer-events: none;
		}

		.img-overlay{
			position: relative;
		}
		
		.img-overlay:hover .animated + .img-overlay2{
			
		    width: 100%;
		    height: 100%;
		    top: 0;
		    left: 0;
		    box-shadow: 0 -55px 171.14px 14px rgba(0,0,0,.7) inset;
		}

		.img-overlay:hover .animated + .img-overlay3{
			
		    width: 100%;
		    height: 100%;
		    top: 0;
		    left: 0;
		    box-shadow: 0 -25px 171.14px 44px rgba(0,0,0,.8) inset;
		}

		.img-overlay:hover .animated + .img-overlay4{
			
		    width: 100%;
		    height: 100%;
		    top: 0;
		    left: 0;
		    box-shadow: 0 -25px 171.14px 20px rgba(0,0,0,.8) inset;
		}

		.img-overlay .imgTitle{
			position: absolute;
		    bottom: calc( -8px + 0.9375vw );
		    left: calc( 7px + 0.9375vw);
		    color: white;
		    font-size: calc( 18.4px + 0.5vw);
		    display: block;
		    font-weight: 300;
		    pointer-events: none;
		    width: 100%;
		}


/*----- bg img、bg color、text color style -----*/
	.style1{
		/*background: #fff no-repeat;
		color: #4d4d4d;*/
	}

	.style2{
		background: url(../../images/default/fakeVRBG.jpg) #fff no-repeat;
	}
		.style2 .title,
		.style2 .description{
			color: #fff;
		}
		.style2 .subtitle,
		.style2 .subdescription{
			color: #666;
			padding-top: 0;
		}

		.style2 .subtitle2{
			color: #4d4d4d;
			padding-top: 0;
		}

	.style3{
		background: #535353 no-repeat;
		color: #fff;
	}
		.style3 .line{
			border: 1px solid #666;
		}
		.style3 .subtitle{
			color: #82be0f;
		}
		
		.style3 .bundleWrapper{
			background-color: #242424;
		    padding: 0;
		    margin-top: 0;
		    margin-bottom: calc( 23px + 2.1875vw );
		    border-radius: 5px;
		}

		.style3 .bundleTitle{
			font-weight: 700;
		    text-align: center;
		    background: #242424;
		    padding: 40px 15px 20px;
		    border-radius: 5px 5px 0 0;
		    color: #82be0f;
		    width: 100%;
		}

		.style3 .bundle-img-wrapper{
			background: #242424;
		}

		.style3 .bundleLink{
			background-color: #76be3d;
		    border-radius: 0 0 5px 5px;
		    color: #3f3f3f;
		    font-size: calc( 26.4px + 0.5vw );
		    text-align: center;
		    cursor: pointer;
		    width: 100%;
		}

	.style4{}
		.style4 .title{
			
		}
		.style4 .description{

		}
			.style4 .subtitle{
				color: #82be0f;
			}
				.style4 .thirdTitle{
					
				}

	.style5{
		background: #C4C4C4;
	}


/*----- ul li -----*/
.ulWrapper{
	padding-bottom: 0;
	max-width: 900px;
    padding-left: 0;
}
	.ulWrapper li{
		float: left;
	    list-style-position: inside;
	    text-indent: -18px;
	    padding-left: 18px;
	    padding-right: 40px;
	    /*margin-right: calc( 23px + 2.1875vw );*/
	    width: calc( 100% / 2 );
	}
		.ulWrapper li:nth-of-type(2n){
			 /*margin-right: 0;*/
		}
		.ulWrapper li a{
			color: #fff;
		}		
			.ulWrapper li a:hover,
			.ulWrapper li a:focus,
			.ulWrapper li a:active,
			.ulWrapper li a:focus:active{
				text-decoration: underline;
			}

/*---- hidden objec under 500px -----*/
.hidden-mobile{
	display: none;
}
	

/*----- play video icon ------*/
	.rl-rel{ position: relative; display: block;}
		.rl-play-wrapper{
			position:absolute; 
			top:50%; 
			left:50%; 
			width:calc( 42px + 2.5vw ); 
			height: calc( 42px + 2.5vw ); 
			border-radius: 50%; 
			margin: calc( (( 42px + 2.5vw) / 2) * (-1) ) 0 0 calc( (( 42px + 2.5vw) / 2) * (-1) );
			/*transform: translate(-50%,-50%);*/
			background: rgba(255,255,255,0.3);
			-webkit-transition: 
			           background 0.3s cubic-bezier(0.165, 0.84, 0.44, 1),
			           transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
			-o-transition: 
				       background 0.3s cubic-bezier(0.165, 0.84, 0.44, 1),
			           transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
			transition: 
					   background 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), 
			           transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
		}
			.rl-rel:hover .rl-play-wrapper{
				background: rgba(255,255,255,0.5);
				-webkit-transform: scale(1.05, 1.05);
				-moz-transform: scale(1.05, 1.05);
				-ms-transform: scale(1.05, 1.05);
				-o-transform: scale(1.05, 1.05);
				transform: scale(1.05, 1.05);
				
			}
			.rl-play{
				/*color: rgba(255,255,255,1); 
				font-size: calc( 20px + 1.5625vw );*/
				width: 0;
				height: 0;
				border-style: solid;
				border-width: calc( 8px + 0.625vw ) 0 calc( 8px + 0.625vw ) calc( 12px + 0.9375vw );
				border-color: transparent transparent transparent rgba(255,255,255,1);
				margin-left: calc( 2.8px + 0.375vw );
			}


/*----- testnomial -----*/
	.style-testnomial{
		background-color: #82BE10;
		color: #242424;
	}
		.style-testnomial .title,
		.style-testnomial .subtitle,
		.style-testnomial .description,
		.style-testnomial .subdescription{
			/*color: #242424;*/
		}
		.rl-testmonial-wrapper .icon-quotes{
			width: 16%;
			position: relative;
		}
			.icon-quotes img{
				position: absolute;
			    max-width: 205px;
			    max-height: 205px;
			}
		.icon-quotes-before{
			/*margin-right: 15px;*/
		}
			.icon-quotes-before img{
				top: -4vw;
			}
		.icon-quotes-after{
			margin-left: 15px;
		}
			.icon-quotes-after img{
				bottom: 0;
			}
		.rl-testmonial-wrapper .owl-testmonial{
			width: calc( 100% - ( 16% * 2 ) - ( 15px ) );
		}
			.img-author{max-width: 205px;}
			.userInfo{ text-align: right; }

		/*---- dots ----*/
		.owl-testmonial.owl-theme .owl-dots .owl-dot span{
			width: 12px;
    		height: 12px;
        	background: rgba(255,255,255,0.5);
		}

		.owl-testmonial.owl-theme .owl-dots .owl-dot.active span, 
		.owl-testmonial.owl-theme .owl-dots .owl-dot:hover span{
			background: rgba(255,255,255,1);
		}

@media screen and (max-width: 991px) {
	/*----- Solution -----*/
	.box1,
	.box2{
		float: none;
		width: 100%; 
		margin-right: 0;
	}

	.col-1 {
	    width: calc( (100% - 15px) / 2);
	    margin-bottom: 15px;
	    float: left;
	    margin-right: 15px;
	}
		.box1 .col-1:last-of-type{
			margin-right: 0;
		}

	.col-3 > .iframeWrapper{
		margin-bottom: 15px;
	}

	/*----- ul li -----*/
	.ulWrapper{
		max-width: 100%;
	}
	.ulWrapper li:nth-of-type(2n){
		/*margin-right: calc( 23px + 2.1875vw );*/
	}

	/*----- rl-fourblock -----*/
	.rl-fourblock img{
		width: 100% !important;
		float: none;
	}

}

@media screen and (max-width: 767px) {
	/*----- Solution -----*/
	.box1,
	.box2,
	.col-1,
	.col-3 .iframeWrapper:nth-of-type(1),
	.col-3 .iframeWrapper
	{
		float: none;
		width: 100%; 
		margin-right: 0;
	}

	/*----- ul li -----*/
		.ulWrapper li{
			float: none;
		    padding-right: 0;
		    width: 100%;
		}

	/*----- testnomial -----*/
		.rl-testmonial-wrapper .icon-quotes{
			width: 10%;
			position: relative;
		}
		.rl-testmonial-wrapper .owl-testmonial{
			width: calc( 100% - ( 10% * 2 ) - ( 15px ) );
		}

}

@media screen and (max-width: 500px) {

	/*----- testnomial -----*/
		.rl-testmonial-wrapper .icon-quotes{
			display: none;
		}
		.rl-testmonial-wrapper .owl-testmonial{
			width: 100%;
			padding-left: 15px;
			padding-right: 15px;
		}

	/*---- hidden objec under 500px -----*/
	.hidden-mobile{
		display: block;
	}

}