/* CSS Document */
body{
	overflow-x:hidden;
}

.topLang{
	position:relative;
	display:grid;
	grid-template:10vh/auto;
	grid-auto-columns:10vw;
	grid-auto-flow:column;
	justify-content:center;
	width:100vw;
	height:30px;
	margin-left:-0.7%;
	margin-top:-0.2%;
	background-color:#804000;
	text-align:center;
	line-height:1.3;
	color:#FFFFFF;
	font-size:140%;
	font-family:Arial, Helvetica, sans-serif;
}
.topLang a{
	text-decoration:none;
	color:#FFF;
}
.logInfo{
	margin-left:-60vw !important;
}
.schoolName, .mainLink, #homeAnimation, #homeAnimationSection{
	z-index:15;
}
.schoolName{
	position:relative;
	display:grid;
	width:100%;
	height:70px;
	background-color:#FFF;
	text-align:center;
	font-size:34px;
	font-weight:normal;
	letter-spacing:2px;
	word-spacing:4px;
	font-family:Georgia, "Times New Roman", Times, serif;
	color:#804000;
	padding-top:30px;
}
.schoolName h1{
	font-size:34px;
	font-weight:normal;
	letter-spacing:3.2px;
	word-spacing:6px;
	font-family:Georgia, "Times New Roman", Times, serif;
	color:#804000;
	margin-top:0px;
}
.mobileMenu{
	display:none;
}
.mobileMenu a{
	display:none;
}

.mainLink{
	position:relative;
	display:grid;
	grid-template:10vh/auto;
	grid-auto-flow:column;
	justify-content:start;
	width:100vw;
	height:35px;
	top:0px;
	left:-1vw;
	background-color:#804000;
	box-sizing:border-box;
	padding:0;
	margin:0;
}
.mainLink a{
	color:#FFF;
	text-decoration:none;
	font-family:Arial, Helvetica, sans-serif;
	font-size:22px;
	margin-left:0px;
	width:13vw;
	margin-right:0px;
	height:35px;
	border-right:#CCC solid thin;
	alignment-adjust:central;
	text-align:center;
	padding-right:0px;
	line-height:1.5;
}
	.mainLink a:nth-child(1){
		width:9vw;
	}
	.mainLink a:nth-child(2){
		font-size:20px;
		text-align:center;
		width:15vw;
		margin-left:0vw;
		border-right:#CCC solid thin !important;
		alignment-adjust:central;
		font-family:Arial, Helvetica, sans-serif;
		white-space:nowrap;
	}
	.mainLink a:nth-child(7){
		width:8vw;
	}
	.mainLink a:nth-child(8){
		width:15vw;
	}
	.mainLink a:hover{
		background-color:#A5AFFF;
	}

#homeAnimation{
	position:relative;
	display:grid;
	width:101.5%;
	height:400px;
	margin-left:-0.7%;
	margin-top:0px;
	background-repeat:no-repeat;
	background-size:100% 400px;
}
#homeAnimation:after{
	position:absolute;
	display:block;
	content:"";
	top:0;
	left:0;
	background-image:url(images/elcc_main_classroom_4.jpg);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
			src='images/elcc_main_classroom_4.jpg', sizingMethod='scale');
	background-size:100%;
	width:100%;
	height:100%;
	opacity:1;
	background-repeat:no-repeat;
	z-index:-1;
}

#homeAnimationSection{
	position:absolute;
	width:100%;
	height:400px;
	background-size:100% 400px;
	background-repeat:no-repeat;
	overflow:hidden;
}

#homeAnimationSection img{
	position:absolute;
	width:65%;
	height:400px;
	margin-top:70px;
	transform:scale(0, 0);
    -webkit-animation-name:alertLandingTopAnim;
   	-webkit-animation-duration:360s;
	-webkit-animation-iteration-count:infinite;
	animation-name:alertLandingTopAnim;
	animation-duration:360s;
	animation-iteration-count:infinite;
	border-radius:20vw;
	box-shadow:1px 1px 10px 1px  #FFF;
}

	#homeAnimationSection img.landFirst{
		animation-delay:0s;
		-webkit-animation-delay:0s;
		width:200px;
		height:200px;
		margin-left:50px;
		z-index:1;
		opacity:1;
		}
	#homeAnimationSection img.landSecond{
		animation-delay:1s; 
		-webkit-animation-delay:2s;
		width:200px;
		height:200px;
		margin-left:350px;
		z-index:2;
		opacity:1;
	}
	#homeAnimationSection img.landThird{
		  animation-delay:4s; 
		  -webkit-animation-delay:4s;
		  width:200px;
		  height:200px;
		  margin-left:700px;
		  z-index:3;
		  opacity:1;
		}
	#homeAnimationSection img.landFour{
		  animation-delay:6s; 
		  -webkit-animation-delay:6s;
		  width:200px;
		  height:200px;
		  margin-left:1050px;
		  z-index:4;
		  opacity:1;
		}
	#homeAnimationSection img.landFive{
		  animation-delay:9s; 
		  -webkit-animation-delay:9s;
		  width:1100px;
		  height:90px;
		  padding-top:20px;
		  margin-left:120px;
		  margin-top:280px;
		  z-index:5;
		}		
	
@-webkit-keyframes alertLandingTopAnim{
	0%{transform:scale(0, 0); }
	1%{transform:scale(1, 1); }
	1.3%{transform:scale(1, 1); }
	1.6%{transform:scale(1, 1); }
	30%{transform:scale(1, 1);}	
	36%{transform:scale(1, 1);}
	65%{transform:scale(1, 1);}
	99.8%{opacity:1;}
	100%{transform:scale(1,1); opacity:0;}
}

@keyframes alertLandingTopAnim{
	0%{transform:scale(0, 0); }
	0.51%{transform:scale(1, 1); }
	1.3%{transform:scale(1, 1); }
	1.6%{transform:scale(1, 1); }
	30%{transform:scale(1, 1);}	
	36%{transform:scale(1, 1);}
	65%{transform:scale(1, 1);}
	99.8%{opacity:1;}
	100%{transform:scale(1,1); opacity:0;}
}

.firstContact{
	position:relative;
	display:grid;
	grid-template:10vh/10vw 20vw 5vw 20vw 10vw 20vw;
	grid-auto-flow:column;
	justify-content:start;
	white-space:nowrap;
	margin-top:2px;
	margin-left:-0.7%;
	width:101.5%;
	height:70px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:17px;
	font-weight:bold;
	background-color:#804000;
	text-indent:160px;
	line-height:4;
	color:#CCC;
	z-index:10;
}

.firstContact a{
	font-family:Arial, Helvetica, sans-serif;
	font-size:15px;
	font-weight:normal;
	margin-left:-40px;
	line-height:4.5;
	color:#FFF;
}

 .footerContact{
	position:relative;
	box-sizing:border-box;
	padding:0;
	margin-top:20px;
	margin-left:-0.7%;
	width:101.5%;
	height:60px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:17px;
	font-weight:bold;
	background-color:#430304;
	text-indent:160px;
	line-height:4;
	color:#FFF;
	z-index:10;
}

.footerContact a{
	font-family:Arial, Helvetica, sans-serif;
	font-size:15px;
	font-weight:normal;
	margin-right:100px;
	color:#FFF;
}

#homeFirstSection{
	position:relative;
	display:grid;
	width:101.5%;
	height:613px;
	margin-left:-0.5%;
	background-color:#FFF;
	padding-top:200px;
	padding-left:350px;
	padding-right:200px;
	color:#804000;
	text-align:justify;
	z-index:4;
}
#homeFirstSection p{
	position:fixed;
	top:150px;
	width:50%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:25px;
	font-weight:800;
	z-index:4;
	opacity:0;
}

#tranPic{
	position:relative;
	width:101.7%;
	height:150px;
	margin-left:-0.5%;
	margin-top:0px;
	opacity:0.5;
}

#tranPic img{
	width:100%;
	height:150px;
	opacity:0.5;
}

#homeSecondSection{
	position:relative;
	display:grid;
	width:101.5%;
	height:873px;
	margin-left:-0.5%;
	background-color:#fef06c;
	padding-top:200px;
	padding-left:350px;
	padding-right:200px;
	color:#804000;
	text-align:justify;
	z-index:2;
}

#homeSecondSection p{
	position:fixed;
	top:250px;
	width:50%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:25px;
	font-weight:800;
	z-index:2;
	opacity:0;
}

#homeThirdSection{
	position:relative;
	width:101.5%;
	height:613px;
	margin-left:-0.5%;
	padding-top:400px;
	padding-left:40px;
	background-color:#FFF;
	text-transform:uppercase;
	font-family:Arial, Helvetica, sans-serif;
	font-size:35px;
	z-index:20;

}

#homeFourthSection{
	position:relative;
	display:grid;
	width:101.5%;
	height:873px;
	margin-left:-0.5%;
	background-color:#804000;
	padding-top:200px;
	padding-left:350px;
	padding-right:200px;
	color:#804000;
	text-align:center;
	z-index:5;
}

#homeFourthSection p{
	position:fixed;
	background-image:url(images/newtotalenglish-covers.jpg);
	background-repeat:no-repeat;
	background-position:100px 10px;
	top:10px;
	width:50%;
	height:873px;
	padding-top:320px;
	color:#FFF;
	font-family:Arial, Helvetica, sans-serif;
	font-size:25px;
	font-weight:800;
	z-index:5;
	opacity:0;
}

#homeFivethSection{
	position:relative;
	display:grid;
	width:101.5%;
	height:873px;
	margin-left:-0.5%;
	background-color:#000;
	padding-top:200px;
	padding-left:350px;
	padding-right:200px;
	text-align:center;
	z-index:5;
}
#homeFivethSection p{
	position:fixed;
	top:10px;
	width:50%;
	height:873px;
	padding-top:220px;
	color:#FFF;
	font-family:"Comic Sans MS", cursive;
	font-size:30px;
	font-weight:800;
	z-index:5;
	opacity:0;
}

#homeSixthSection{
	position:relative;
	display:grid;
	width:101.5%;
	height:973px;
	margin-left:-0.5%;
	background-color:#CCC;
	padding-top:10px;

	text-align:center;
	z-index:1;
}
#homeSixthSection p{
	position:fixed;
	top:10px;
	width:50%;
	height:873px;
	padding-top:1px;
	padding-left:350px;
	padding-right:200px;
	color:#000;
	font-family:Arial, Helvetica, sans-serif;
	font-size:30px;
	font-weight:800;
	opacity:0;
	z-index:1;
}
#homeSixthSection p i{
	font-style:normal;
	font-size:20px;
}
#homeSixthSection p input{
	font-size:20px;
	width:500px;
	height:35px;
	text-align:center;
	font-family:Arial, Helvetica, sans-serif;
	opacity:0;
}
#printBtn{
	display:block;
}

#homeSevenSection{
	position:relative;
	display:grid;
	width:101.5%;
	height:873px;
	margin-left:-0.5%;
	background-color:#fef06c;
	padding-top:10px;
	text-align:center;
	z-index:1;
}
#homeSevenSection p{
	position:fixed;
	top:10px;
	width:50%;
	height:873px;
	padding-top:1px;
	padding-left:350px;
	padding-right:200px;
	color:#FFF;
	font-family:Arial, Helvetica, sans-serif;
	font-size:30px;
	font-weight:800;
	z-index:1;
	opacity:0;
}
#homeSevenSection p i{
	font-style:normal;
	font-size:20px;
}
#homeSevenSection p input{
	font-size:20px;
	width:500px;
	height:35px;
	text-align:center;
	font-family:Arial, Helvetica, sans-serif;
	opacity:0;
}
#homeSevenSection p textarea{
	font-size:20px;
	text-align:justify;
	width:500px;
	height:120px;
	font-family:Arial, Helvetica, sans-serif;
	opacity:0;
}
#homeSevenSection a{
	text-decoration:none;
	color:#FFF;
}

#homeEightSection{
	position:relative;
	width:101.5%;
	height:873px;
	margin-left:-0.5%;
	background-color:rgba(51,204,0,0.31);
	padding-top:10px;
	text-align:center;
	z-index:1;
}
#homeEightSection p{
	position:fixed;
	top:10px;
	width:60%;
	height:873px;
	padding-top:1px;
	padding-left:250px;
	padding-right:200px;
	color:#000;
	opacity:0;
	font-family:"Comic Sans MS", cursive;
	font-size:20px;
	font-weight:800;
	z-index:1;
	opacity:0;
}

#homeEightSection p iframe{
	width:100%;
	height:300px;
}

#printArea{
	position:fixed;
	display:none;
	top:10px;
	left:40px;
	width:95%;
	height:90%;
	background-color:#FFF;
	z-index:100;
}
#printRegistration{
	position:relative;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
}
#printRegistration h1{	
	font-size:36px;
	text-align:center;
}
#printRegistration h3{	
	font-size:30px;
	text-align:center;
}
#printRegistration h4{	
	font-size:30px;
	text-indent:20px;
}
.classPages{
	position:relative;
	display:grid;
	width:101.5%;
	height:400px;
	margin-left:-0.7%;
	margin-top:0px;
	background-repeat:no-repeat;
	background-size:100% 400px;
}

.classPages img{
	position:absolute;
	width:65%;
	height:400px;
	margin-top:70px;
	transform: translateX(1200px);
    -webkit-animation-name:alertClassTopAnim;
   	-webkit-animation-duration:30s;
	-webkit-animation-iteration-count:infinite;
	animation-name:alertClassTopAnim;
	animation-duration:30s;
	animation-iteration-count:infinite;
}

	.classPages img.landFirst{
		animation-delay:0s;
		-webkit-animation-delay:0s; 
		width:400px;
		height:200px;
		margin-left:50px;
		margin-top:30px;
		z-index:1;
		}
	.classPages img.landSecond{
		animation-delay:0.4s; 
		-webkit-animation-delay:5s;
		width:350px;
		height:200px;
		margin-left:200px;
		margin-top:250px;
		z-index:2;
	}	
	.classPages img.landThird{
		animation-delay:0.4s; 
		-webkit-animation-delay:4s;
		width:350px;
		height:200px;
		margin-left:550px;
		margin-top:30px;
		z-index:3;
		}
	.classPages img.landFour{
		animation-delay:2s; 
		-webkit-animation-delay:6s;
		width:300px;
		height:200px;
		margin-left:550px;
		margin-top:250px;
		z-index:4;
		}
	.classPages img.landFive{
		animation-delay:2.1s; 
		-webkit-animation-delay:9s;
		width:300px;
		height:420px;
		margin-left:950px;
		margin-top:30px;
		z-index:5;
		}		
	
@-webkit-keyframes alertClassTopAnim{
	0%{ transform: translateX(1200px);}
	10%{transform: rotate(0deg); }
	100%{transform:rotate(0deg); }
}

@keyframes alertClassTopAnim{
	0%{ transform: translateX(1200px); opacity:1;}
	10%{transform: rotate(0deg); }
	77%{opacity:1;}
	82{opacity:0;}
	100%{transform:rotate(0deg); opacity:0;}
}

.pageTitle{
	position:relative;
	display:grid;
	width:101.5%;
	height:50px;
	font-size:34px;
	font-family:Georgia, "Times New Roman", Times, serif;
	text-transform:uppercase;
	margin-top:70px;
	text-indent:40%;
	letter-spacing:2px;
	word-spacing:5px;
	color:#804000;
}

.insideTabPage{
	position:relative;
	display:grid;
	grid-template:40vh/50vw 50vw;
	grid-auto-flow:column;
	width:101.5%;
	height:50px;
	margin-left:-0.5%;
	margin-top:10px;
	background-color:#B9B9FF;
	white-space:nowrap;
}

.insideTabPage a{
	position:relative;
	display:grid;
	font-family:"Comic Sans MS", cursive;
	font-size:18px;
	width:50vw;
	height:50px;
	margin-right:-0.1%;
	color:#FFFFFF;
	text-decoration:none;
	text-align:center;
	line-height:3;
}
.insideTabPage a[href="#thisPage"]{
	background-color:#006699;
}
.insideTabPage a[href="#thisBlog"]{
	background-color:#BAB3FD;
}

.pageSection{
	position:relative;
	display:grid;
}

.pageFirst, .pageThird, .pageFiveth{
	position:relative;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:25px;
	width:70%;
	margin-left:13%;
	margin-top:30px;
	text-align:center;	
}
.pageSecond, .pageFourth, .pageSixth{
	position:relative;
	font-family:"Comic Sans MS", cursive;
	font-size:18px;
	width:101.5%;
	height:60x;
	margin-left:-0.5%;
	margin-top:40px;
	border-top:#000 thin solid;
	border-bottom:#000 thin solid;
	text-align:center;
	line-height:3;
}

.pageSecond img{
	display:block;
	width:100%;
	height:120px;
}

.blogSection{
	position:relative;
	display:none;
	grid-template:auto/30vw 65vw;
	width:101vw;
	margin-left:-0.5%;
	background-color:#FFF;
}

#topicTitlesList{
	position:relative;
	display:grid;
	width:30vw;
	height:700px;
	overflow-y:auto;
	box-shadow:#36F 1px 10px 10px 1px;
	font-family:Georgia, "Times New Roman", Times, serif;
}
#topicTitlesList a{
	color:#8080FF;
	text-decoration:none;
	text-indent:20px;
	font-family:Georgia, "Times New Roman", Times, serif;
	border-bottom:#8080FF 1em solid;
	border-radius:2em;
}
#topicTitlesList a:hover{
	text-decoration:underline;
	border-bottom:#804000 1em solid;
}
#topicTitlesList h2{
	text-align:center;
	font-size:22px;
	text-transform:uppercase;
	font-family:Georgia, "Times New Roman", Times, serif;
	
}

.blogTopic{
	position:relative;
	display:grid;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:25px;
	width:65vw;
	margin-left:2vw;
}
.blogTopic h3{
	text-align:center;
}
.blogTopic h4{
	font-size:12px;
	font-weight:normal;
	margin-left:20vw;
}
.blogTopic img{
	display:block;
	width:30vw;
	height:20vh;
	margin-left:10vw;
}

