@import url('https://fonts.googleapis.com/css?family=Quicksand:300,400,500,700');
*{ margin: 0; padding: 0; border: 0; outline: 0; box-sizing: border-box;}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, hr, big, cite, code, del, dfn, em, font, 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 { margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; }

ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
:focus { outline: 0; }
em { font-style: italic; }
a { text-decoration: none; cursor: pointer; }
a:active,a:focus,a:hover {  outline: 0; text-decoration: none; }
html { height: 100%; }
html[xmlns] .clearfix { display: block; }
input:disabled {cursor:not-allowed;} 
/*END: Reset CSS*/
.menu li span { cursor: pointer;}
body{
	background:#edf1f4;
	background: url(img/page-bg.jpg) top center;
	-webkit-background-size: cover;
	background-size: cover;
	width:100%;
	font-size:16px;
	/* font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif; */
	font-family: 'Quicksand',"Lucida Sans Unicode", "Lucida Grande", sans-serif;
	min-height: 760px;
position: relative;
}

.section_container{
	
	height: 100vh;
	width: 100vw;
	overflow: hidden;
	
}

.vrScreenCont{
    display: flex;
    align-items: center;
       width: 1357px;
    margin:0 auto 0;
 }
.vrScreenCont img {
    display: block;
}

.center-side {
    margin-top: -1vw;
    box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.22), 0px 0 0px 0px rgba(0, 0, 0, 0), 0px 4px 6px 0px rgba(0, 0, 0, 0.21), 0px 0 0px 0px rgba(0, 0, 0, 0);
}
.lessons-big .center-side { margin-top: 0vw;}
.vrCol1 {
    width: 287px;
    position: relative;
}

.vrCol2 {
	width: 780px;
	position: relative; transition: all 0.6s;
}

.vrCol1 > img, .vrCol2 > img {
    width: 100%;
}

.left_sideSec,
.center_sideSec,
.right_sideSec{
	position: absolute;
	height: 100%;
	width: 100%;
	z-index: 1;
	top: 0;
	overflow: hidden;
}
.leftAmin{
    padding-left: 1.8vw;
    padding-top: 2.2vw;
    padding-bottom: 2vw;
    padding-right: 1vw;
    right: -100%;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
	background: url(img/left-side.png) no-repeat top right;
    background-size: cover;
}
.rightAmin{
    padding-left: 1vw;
    padding-top: 2.2vw;
    padding-bottom: 2vw;
    padding-right: 1.8vw;
    left: -100%;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
	    background: url(img/right-side.png) no-repeat top right;
    background-size: cover;
}
.left_sideSec img, .right_sideSec img {
    width: 100%;
}
.leftAmin,
.rightAmin,
.centerVideo,
.pdfView{
	position: absolute;
	height: 100%;
	width: 100%;
	z-index: 1;
	top: 0;
}
.centerAmin{
	position: absolute;
	height: 100%;
	width: 100%;
	z-index: 1;
	top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 3.5vw;
}
.centerVideo, .centerAmin, .pdfView {opacity: 0; z-index: -1;}
.centerVideo video{height: 100%; width: 100%; position: relative; z-index: 0;
    object-fit: cover;}
.lessons-big .vrCol2 { width: 1400px;    height: 540px;    overflow: hidden;     margin-left: -270px;    margin-right: -270px;    z-index: 9999;}
.vrCol2.fullScreen { width: 1400px;    height: 540px;    overflow: hidden;     margin-left: -270px;    margin-right: -270px;    z-index: 9999;}
.leftAmin.open{right: 0%;}
.rightAmin.open{left: 0%;}
.centerAmin.open, .pdfView.open,
.centerVideo.open{opacity: 1; z-index: 1;}
.play-list { padding: 30px 210px; width: 100%; }
.play-list img { width: 100%;}


header {
    position: absolute;
    z-index: 3;
    width: 100%;
    color: #fff;
    align-items: center;
    justify-content: center;
    display: flex;
    margin-top: 2vw;
}

header ul {
    display: flex;
    align-items: center;
	
    justify-content: center;
	    background: #343434;    
    border-radius: 20px;
}

header ul li span {
    position: relative;
    padding: 10px 15px;
    font-size: 13px;
    text-transform: capitalize;
    display: inline-block;
    font-weight: bold;

}
header ul li:first-child span{
    border-radius: 20px 0 0 20px
}
header ul li:last-child span{
    border-radius: 0 20px 20px 0
}
.menu li span:not(.active):after {content: "";background: #00E200;width: 10px;height: 10px;border-radius: 50%;position: absolute;left: 0;right: 0;margin: 0 auto;bottom: 11px;box-shadow: 0px 0px 6px 2px #00E200;
    transform: scale(0);-webkit-transition: all 0.1s;
    -o-transition: all 0.1s;
    transition: all 0.1s;
}
.menu li:hover span:not(.active):after{transform: scale(1);}
header ul li span.active{
	background-color: #fff;
	color: #000;
}
.fullScreenTcon img { max-width: 100%}
.fullScreenTcon{
        position: absolute;
    bottom: 52px;
    right: 26px;
     z-index: 9;
    padding: 8px;
    line-height: 0.8;
    border-radius: 23px;
    color: #343434;
    cursor: pointer;
    width: 100px;
 
}

.fullScreenTcon:after {content: "";background: #00E200;width: 10px;height: 10px;border-radius: 50%;position: absolute;left: 0;right: 0;margin: 0 auto;bottom: 20px;box-shadow: 0px 0px 6px 2px #00E200;
    transform: scale(0);-webkit-transition: all 0.1s;
    -o-transition: all 0.1s;
    transition: all 0.1s;
}

.fullScreenTcon:hover:after{transform: scale(1);}

video::-webkit-media-controls-panel {
    display: flex !important;
    opacity: 1 !important;
}
.welcome-screen .logo  { padding: 30px 0px;}
.welcome-screen .logo img { margin: 0 auto;}
.welcome-screen h3 { font-size: 24px; padding: 10px 0; }
.welcome-screen { position: absolute;
    margin: auto;
    left: 0;
    right: 0;    
    top: 87px;
    height: 440px;
    background: rgba(255,255,255,0.5);     
    text-align: center;
    padding: 30px;
    width: 780px;}


.startBtn {     margin: 20px 0px;
    background: rgba(255,255,255,0.9);
    padding: 10px 15px;
    border-radius: 5px;
    display: inline-block;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 14px; cursor: pointer;}
.visibleShow { visibility: visible !important}
.pdfScroll { padding-top: 20px;
    display: block;
    height: 440px;
    overflow: auto;
}
.pdfView { background: #fff;}
.pdfView.open { background: #fff; z-index: 99 }
.pdfView img { max-width: 100%;}
.resourcesPdf{    display: block;
    height: 90px;
    width: 100%;
    z-index: 999;
    position: relative;    
}
.resourcesPdf:after {content: "";background: #00E200;width: 10px;height: 10px;border-radius: 50%;position: absolute;left: 0;right: 0;margin: 0 auto;bottom: 30px;box-shadow: 0px 0px 6px 2px #00E200;
    transform: scale(0);-webkit-transition: all 0.1s;
    -o-transition: all 0.1s;
    transition: all 0.1s;
}
.resourcesPdf:hover:after{transform: scale(1);}
.resourcesPdf.active:after{transform: scale(1);}
.resWrap{    position: absolute;
    top: 0;
    left: 0;    
    width: 100%;
    height: 100%;
    padding: 90px 0px;}

.vlink{    display: block;
    height: 74px;
    width: 100%;
    z-index: 999;
    position: relative;    
}
#videoFrame { background: #000;}
.vlink:after {content: "";background: #00E200;width: 10px;height: 10px;border-radius: 50%;position: absolute;left: 0;right: 0;margin: 0 auto;bottom: 30px;box-shadow: 0px 0px 6px 2px #00E200;
    transform: scale(0);-webkit-transition: all 0.1s;
    -o-transition: all 0.1s;
    transition: all 0.1s;
}
.vlink:hover:after{transform: scale(1);}
.vlink.active:after{transform: scale(1);}

.playWrap {   position: absolute;
    top: 0;
    left: 0;    
    width: 100%;
    height: 100%;
    padding: 90px 0px;}

.pdfClose { position: absolute;
    top: 15px;
    right: 26px;
    background: #666;
    width: 20px;
    height: 20px;
	font-weight: bold;
    border-radius: 50%;
    text-align: center;
    line-height: 20px;
    color: #fff;
	cursor: pointer;
}
.pdfClose:hover { background: #00E200; box-shadow: 0px 0px 6px 2px #00E200;
    transform: scale(1);-webkit-transition: all 0.1s;
    -o-transition: all 0.1s;
    transition: all 0.1s; font-size:0px;}
.video3d {display:none; position: absolute; top:0px; left:0px;  right:0px; width: 100%; margin: auto; height: 540px; background:rgba(0,0,0,1);}
.vrCol2.fullScreen .video3d { display:block}
.vrCol2.fullScreen .centerVideo { z-index: 99}
.vrCol2.fullScreen .centerVideo video { display: none;}
.vrScreenCont.fullScreen .vrCol1 {}
.pdfScroll::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
}

.pdfScroll::-webkit-scrollbar
{
	width: 10px;
	background-color: #F5F5F5;
}

.pdfScroll::-webkit-scrollbar-thumb
{
	background-color: #000000;
	border: 2px solid #555555;
}
.topLogo { padding:30px 0px 0; text-align:center;}
.topLogo img { margin: -10px 0px 0px; width: 150px;}
.footer { padding:40px 0px 40px; text-align:center; position: absolute; width:100%; left:0px; bottom:0px;}