@charset "UTF-8";
/* CSS Document */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
    box-sizing: border-box;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1.66;
	outline: 0;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow:hidden;

}

img{ vertical-align:middle;max-width: 100%;}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

* {    -webkit-font-smoothing: antialiased;    -moz-osx-font-smoothing: grayscale;}
img{ max-width:100%;}

.close-btn, .Expandclose{
    position: absolute;
    top: 0px;
    right: 0px;
    z-index: 9999;
	cursor:pointer;
	max-width: 35px;
    pointer-events: auto;
}
.landscape{
    display: block;
}
.portrait{
    display: none;
}
.banner{
    width: 100%;
    height: 20%;
    bottom:0; 
    position: absolute;
    overflow: hidden;
    pointer-events: auto;
}
.BgShape{
    width:100%;
    height: 100%; 
    background-color: #0abf53;
}
.bannerTxt{
    width: 30%;
    position: absolute;
    left: 8%;
    top: 10%;
}
.learnMoreCta{
    width: 9%;
    position: absolute;
    left: 8%;
    top: 62%;  
}
.bnrexpand{
    width: 8%;
    position: absolute;
    left:18%;
    top: 62%; 
}
.businessAdyen{
    width: 25%;
    position: absolute;
    left: 45%;
    bottom: 10%;  
}
.bannerImg{
    height: 100%;
    position: absolute;
    right: 0%;
    top: -15%;
    width: 28%;
}
.Expand{
  width: 100%;
  height: 100%;
  background:#0abf53;
  position: absolute;
}

.leftWrapper {
  height: 100%;
  z-index: 9999;
  background: #0abf53;
  width: 34%;
  z-index: 9999;
  top: 0%;
  left: 0%;
    position: absolute;
}
.rightWrapper {
height: 80%;
    width: 66%;
    z-index: 9999;
    top: 50%;
    left: 34%;
    position: absolute;
    transform: translateY(-50%);
}
.letTxt{
	width: 65%;
    position: relative;
    margin-top: 10%;
    left: 8%;
}
.getcta {
    margin-top: 8%;
    width: 50%;
    left: 8%;
    position: relative;
}
.logo {
  width: 40%;
  bottom: 0%;
  left: 8%;
  margin-top: 35%;
  position: relative;
}

.expand{    
  position: absolute;
  right: 2%;
  bottom: 4%;
  width: 7%; z-index:999999 !important;
}
.video-container ,.video-container1, .wrapVideo , .clickdiv{ 
  width:100%; 
  height:100%;
    position: absolute;
}
.videoplayer {
  width: 100% !important;
  height: 100% !important;
  top: 0 !important;
    position: absolute;
/*  right: 0 !important;
  left: auto !important;   */
}


/* +++++++++++++++++ media css +++++++++++++++++ */
@media only screen and (min-width: 1400px) and (orientation: landscape) {
    
}
/*Mob Port*/
@media only screen and (max-width: 350px) and (orientation: portrait){
    .landscape{
    display: none;
}
.portrait{
    display: block;
}
.rightWrapper {
    height: 50%;
    width: 100%;
    top: 5%;
    left: auto;
    transform: none;
}
  .leftWrapper {
    height: 50%;
    width: 100%;
    top: 50%;
    left: 0%;
}
 .bannerTxt {
    width: 60%;
    position: absolute;
    left: 8%;
    top: 10%;
}
    .businessAdyen {
    width: 45%;
    position: absolute;
    left: 53%;
    bottom: 10%;
}
    .learnMoreCta {
    width: 20%;
    position: absolute;
    left: 8%;
    top: 48%;
}
    .bnrexpand {
    width: 18%;
    position: absolute;
    left: 30%;
    top: 48%;
}
    

.close-btn{
    max-width: 25px;
}
 /*   .video_translate{
  overflow: visible !important;
  transform: translateX(-17%) !important;
  transition: 0.6s ease-in-out;
}
.video_translate_last{
  overflow: visible !important;
  transform: translateX(-9%) !important;
  transition: 0.6s ease-in-out;	
}

.video_translate_end{
  overflow: visible !important;
  transform: translateX(-17%) !important;
  transition: 0.6s ease-in-out;	
}
    */
}

/*Tab Port*/
@media only screen and (min-width: 350px) and (max-width: 500px) and (orientation: portrait){
    .landscape{
    display: none;
}
.portrait{
    display: block;
}
.rightWrapper {
    height: 50%;
    width: 100%;
    top: 5%;
    left: auto;
    transform: none;
}
  .leftWrapper {
    height: 50%;
    width: 100%;
    top: 50%;
    left: 0%;
}
    .letTxt {
    width: 55%;
    }
    .getcta {
    margin-top: 5%;
    width: 35%;
    }
    
    .bannerTxt {
    width: 60%;
    position: absolute;
    left: 8%;
    top: 10%;
}
    .businessAdyen {
    width: 45%;
    position: absolute;
    left: 53%;
    bottom: 10%;
}
    .learnMoreCta {
    width: 20%;
    position: absolute;
    left: 8%;
    top: 48%;
}
    .bnrexpand {
    width: 18%;
    position: absolute;
    left: 30%;
    top: 48%;
}
.close-btn{
    max-width: 25px;
}
   /* .video_translate{
  overflow: visible !important;
  transform: translateX(-17%) !important;
  transition: 0.6s ease-in-out;
}
.video_translate_last{
  overflow: visible !important;
  transform: translateX(-9%) !important;
  transition: 0.6s ease-in-out;	
}

.video_translate_end{
  overflow: visible !important;
  transform: translateX(-17%) !important;
  transition: 0.6s ease-in-out;	
}
    */
}

/*Tab Land*/
@media only screen and (max-width: 600px) and (orientation: landscape) {
   .bannerImg {
    top: 0%;
    width: 38%;
}
  .businessAdyen {
    width: 25%;
    position: absolute;
    left: 35%;
   }
  .rightWrapper {
    left: 25%;
    width: 75%;
   }
    .logo {
    width: 50%;
    bottom: 0%;
    left: 8%;
    margin-top: 110%;
    position: relative;
    /* margin-bottom: 10%; */
}
    .letTxt {
    width: 70%;
}
    .close-btn{
    max-width: 25px;
}
 /*   .video_translate{
  overflow: visible !important;
  transform: translateX(-17%) !important;
  transition: 0.6s ease-in-out;
}
.video_translate_last{
  overflow: visible !important;
  transform: translateX(-9%) !important;
  transition: 0.6s ease-in-out;	
}

.video_translate_end{
  overflow: visible !important;
  transform: translateX(-17%) !important;
  transition: 0.6s ease-in-out;	
}
    */
}

/*Mob land*/
@media only screen and (max-width: 700px) and (max-height:300px) and (orientation: landscape) {
    .rightWrapper {
    width: 66%;
    left: 34%;
   }
    .letTxt {
    width: 80%;
    }
    .logo {
    width: 50%;
    margin-top: 60%;
}
    .close-btn{
    max-width: 25px;
}
/*    .video_translate{
  overflow: visible !important;
  transform: translateX(-17%) !important;
  transition: 0.6s ease-in-out;
}
.video_translate_last{
  overflow: visible !important;
  transform: translateX(-9%) !important;
  transition: 0.6s ease-in-out;	
}

.video_translate_end{
  overflow: visible !important;
  transform: translateX(-17%) !important;
  transition: 0.6s ease-in-out;	
}
    */
}