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

@media screen and (min-width: 1400px) {
	.bg:before{
	top:42px;
	height:100%;
	width:20%;
	left:0;
	content:"";
	position:absolute;
	z-index:-1;
	background: -moz-linear-gradient(left,  rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* IE10+ */
background: linear-gradient(to right,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */
	}
.bg:after{
	right:0;
	top:42px;
	height:100%;
	width:20%;
	content:"";
	position:absolute;
	z-index:-1;
	background: -moz-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* IE10+ */
background: linear-gradient(to right,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */
	}			
	}
@media screen and (min-width: 980px) {
	body{
		overflow:hidden;
	}
	}	
@media screen and (min-width: 971px) {
	article{
	background-image: url(../graphics/top-article-bg.png);
	background-repeat: no-repeat;
	background-position: center 20px;
	background-color:transparent;
		}

	}
@media screen and (max-width: 938px) {
	.orange-col1 h2, .orange-col2 h2, .orange-col3 h2, .orange-col4 h2{
	font-size:22px;}
	.sitemap li{
	padding: 2% 3%;
	}


}
@media screen and (max-width: 900px) {
	.orange-col1 h2, .orange-col2 h2, .orange-col3 h2, .orange-col4 h2{
	font-size:20px;}
	.right-col{
	margin-top:8%;
	}
	}	
@media screen and (max-width: 812px) {
	.orange-col1 h2, .orange-col2 h2, .orange-col3 h2, .orange-col4 h2{
	font-size:24px;}
	.sitemap li{
	padding: 2% 2%;
	}
	}
@media screen and (max-width: 800px) {
	.logo-width{
		margin-top:-10px;
		width:350px;
		margin-left:-12px;
	}

	header{
	height:58px;
	position:relative;
	z-index:100;
	background-position: center 15px;
	}
	.headphone{
	background-size: 100%;
	max-width:352px;
	}
	.nav li a{
		padding-top:17px;
		padding-bottom:17px;
		}
	.title{
	width:95%;}	
	

	.left-col{
	margin-top:100px;
	width:50.33333333333333%;

	}
	.right-col{
	width:46.66666666666667%;
	margin-top:4%;
	margin-right:3%;
	}	
	.slider{
	margin-top: 0px;
	}
	
}
		
@media screen and (max-width: 760px) {
	.orange-col1 h2, .orange-col2 h2, .orange-col3 h2, .orange-col4 h2{
	font-size:22px;}
	}
@media screen and (max-width: 700px) {
	.left-col{
		position:relative;
		z-index:200;
	width:auto;
	float:none;
	}
	.right-col{
	width:auto;
	float:none;
	
	}
	
	.headphone{
	max-width:352px;
	width:59%;
	margin-top: 0;
	margin-left:2%;
	float:left;
	clear:none;
	}
	.slider{
	margin-top: -30px;
	}
	.title{
		width:60%;
		}
	.heading{
		font-size:24px;
		padding-top:80px;}		
	
	.learn-language{
	float:right;
	width:36%;
	clear:none;
	margin-top:40px;
	}
	.learn-french, .learn-eng, .learn-german, .learn-hindi, .learn-sanskrit{
	float:none;
	width:80%;
	}	
	.learn-language h2{
	font-size:16px;
	}
	.topBg{
		top:0;
	width: 100%;
	height: 300px;
	background-attachment: fixed;
	background-image: url(../graphics/pattern.jpg);
	background-repeat: repeat;
	position:absolute;
	z-index:1;
     animation: animate-bg 20s infinite linear;
  	-webkit-animation: animate-bg 20s infinite linear;
	-moz-animation: animate-bg 20s infinite linear;

	}
.bg{
	background-image:none;
	animation: none;
  	-webkit-animation: none;
	-moz-animation: none;
	}
	
		.topBg:before{
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	z-index:10;
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUyJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9Ijk0JSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,0) 52%, rgba(255,255,255,1) 94%, rgba(255,255,255,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(52%,rgba(255,255,255,0)), color-stop(94%,rgba(255,255,255,1)), color-stop(100%,rgba(255,255,255,1)));
background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 52%,rgba(255,255,255,1) 94%,rgba(255,255,255,1) 100%);
background: -o-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 52%,rgba(255,255,255,1) 94%,rgba(255,255,255,1) 100%);
background: -ms-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 52%,rgba(255,255,255,1) 94%,rgba(255,255,255,1) 100%);
background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 52%,rgba(255,255,255,1) 94%,rgba(255,255,255,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 );

	
	}
		}
	
@media screen and (max-width: 660px) {
	.orange-col1 h2, .orange-col2 h2, .orange-col3 h2, .orange-col4 h2{
	font-size:19px;}
header:before{
	
	display:none;
	
	}
	.navWrap{
		position:relative;
		padding:5px;
		margin-right:0;
		overflow:hidden;}	
	.nav{
	margin-right:-5%;
	margin-top:5%;
	z-index: 1000;
	padding: 2% 3.5%;
	border-radius: 100%;
	background-color: rgba(0,0,0,.5);
	background-attachment: fixed;
	background-image: url(../graphics/noise.png);
	background-repeat: repeat;
	box-shadow: 0px 0px 0px 5px #FC6602;
}
.nav:hover{
	margin-top:5%;
	margin-right:3%;
	box-shadow: 0px 0px 0px 5px rgba(0,0,0,.5);
	background-color: rgba(252,102,2,1);
	padding: 3% 4.5%;
	}
.nav:hover a{
	padding:7px;
	-ms-transition:all ease-in-out .3s;
	-webkit-transition:all ease-in-out .3s;
	-moz-transition:all ease-in-out .3s;
	-o-transition:all ease-in-out .3s;
	}
.nav:hover ul{
		box-shadow: 0px 0px 5px 0px rgba(0,0,0,.5);
	
	}		
	.nav li{
	float:right;
	clear:both;
	width:100%;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #000;
	border-bottom-color: #000;
	-ms-transition:all ease-in-out 1s;
	-webkit-transition:all ease-in-out 1s;
	-moz-transition:all ease-in-out 1s;
	-o-transition:all ease-in-out 1s;
	}
	.nav li:hover{
	-ms-transition:all ease-in-out .3s;
	-webkit-transition:all ease-in-out .3s;
	-moz-transition:all ease-in-out .3s;
	-o-transition:all ease-in-out .3s;}
	.nav li:first-child, .nav li:last-child{
		border-style: none;
		}
	.nav ul{
		float:right;
		box-shadow:0px 0px 20px 0px rgba(0,0,0,0.5);}	
	.nav li a{
	box-shadow: inset 0px 0px 21px 15px rgba(255,255,255,.8),inset 0px 0px 10px 0px rgba(255,255,255,.5);
	padding-top: 10px;
	padding-bottom: 10px;
	z-index: 100;
	position: relative;
	text-shadow: 1px 1px rgba(255,255,255,.5);
	background-attachment: fixed;
	background-image: url(../graphics/pattern.jpg);
	background-repeat: repeat;
	animation: animate-bg 20s infinite linear;
  	-webkit-animation: animate-bg 20s infinite linear;
	-moz-animation: animate-bg 20s infinite linear;
	color: #000000;
	-ms-transition:all ease-in-out .3s;
	-webkit-transition:all ease-in-out .3s;
	-moz-transition:all ease-in-out .3s;
	-o-transition:all ease-in-out .3s;
		}
	.nav li a:hover{
	box-shadow:inset 0px 0px 50px 50px rgba(164,10,255,0.5);
	text-shadow: -1px -1px rgba(0,0,0,.5);
		}	
	
			
	header{

	width: 100%;
	background-color: transparent;

}

}
@media screen and (max-width: 617px) {
	.orange-col1 h2, .orange-col2 h2, .orange-col3 h2, .orange-col4 h2{
	font-size:24px;}
	.separator2{
	display:block;}
	.sitemap li{
	padding-top: 2%;
	padding-right: 4%;
	padding-bottom: 1.5%;
	padding-left: 4%;
	}	

	}
	
@media screen and (max-width: 525px) {
.logo-width{
		width:100%;
		max-width:300px;
		margin-left:-12px;
	}	
header{
	height:58px;
	width: 100%;
	background-color: rgba(0,0,0,.74);
	background-color: rgba(0,0,0);
	display: block;
	position:relative;
	
}	
header:before{
	display:block;
	background-image: url(../graphics/header-bg.png);
	background-repeat: no-repeat;
	background-position: center -1px;
	-webkit-animation: headerbg 5s infinite; /* Chrome, Safari, Opera */
	animation: headerbg 5s infinite;
	background-size: auto 100% !important;
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	right: 0px;
	z-index:10;
	
	}	

.title{
		width:70%;
		}
	.headphone{
	width:300px;
	position:relative;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: -20px;
	margin-left: auto;
	float:none;
	clear:both;
	}
.heading{
	padding-top:30px;
	padding-left:10px;
	padding-right:10px;
	padding-bottom:40px;
	}
	
.learn-french, .learn-eng, .learn-german, .learn-hindi, .learn-sanskrit{
	float:left;
	width:20%;
	}
	
.learn-language{
	width:100%;
	float:left;
	clear:both;
	margin-top:5px;
	margin-bottom:10px;
	}
.learn-language h2{
	font-size:23px;
	margin-top:10px;
	text-align:center;
	}
.triggerWrap{
	position:relative;
	overflow:hidden;}	
.menu-trigger{
	display:block;
	position: relative;
	margin-right: -2%;
	float:right;
	margin-top: 20%;
	z-index: 1000;
	padding: 4.5% 3%;
	border-radius: 100%;
	background-color: rgba(0,0,0,.5);
	background-attachment: fixed;
	background-image: url(../graphics/noise.png);
	background-repeat: repeat;
	border: 4px solid #FC6602;
	cursor: pointer;
	color:#FFFFFF;
		}
	
.menu-clicked:before{
	right: 100%;
	top: 50%;
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	border-color:transparent;
	border-right-color: #333;
	border-width: 15px;
	margin-top: -15px;
	z-index:100;
	
}		
.menu-trigger:hover{
	margin-right: 2%;
	background-color: #FC6602;
	background-attachment: fixed;
	background-image: url(../graphics/noise.png);
	background-repeat: repeat;
	border: 4px solid #666666;

	}		
.menu-clicked{
	display:block;
	position: relative;
	margin-right: 2%;
	float:right;
	margin-top: 16%;
	margin-bottom:1%;
	z-index: 1000;
	padding: 4.5% 3%;
	border-radius: 100%;
	background-attachment: fixed;
	background-image: url(../graphics/noise.png);
	background-repeat: repeat;
	border: 4px solid #333;
	color: #FFF;
	background-color: #FC6602;
	cursor: pointer;
	 -webkit-transform: rotate(-90deg);
	 -moz-transform:rotate(-90deg);
		}
	
.navWrap{
	display:none;
	float:left;
	position:relative;
	background-color:#333;
	width:100%;
	padding:0;
	margin-top:0;
	margin-bottom:2%;
	box-shadow: 0 0 5px 0 #FFF;
		}		
	.nav {
	position: relative;
	z-index: 200;
	float:none;
	background-image: none;
	background-color:transparent;
	-webkit-animation: none; /* Chrome, Safari, Opera */
	border-radius:0;
	box-shadow:none;
	padding:0;
	margin:5px;
	
}
.nav:hover{
	right:0px;
	box-shadow: none;
	background-color: transparent;
	padding:0;
	margin:5px;
	}
	.nav-expanded {
		display: block;
	}
	.nav ul{
		float:none;
		clear:none;
		position:relative;
		text-align:center;
		padding:0;
		margin:0;}
	.nav ul li{
		display: inline-block;
		float:none;
		position:relative;
		clear:none;
		margin:1px;
		width: auto;
		border:none;}	
	.nav li a{
		box-shadow:inset 0px 0px 10px 0px rgba(0,0,0,.2);
		font-size:16px;
		background-color:#FFFFFF;
		background-image:none;
		padding:7px;}
	.nav li a:hover{
		
		font-size:16px;
	}			
					
.slider-wheel, .slider-wheel2{
	margin-left:10px;
	margin-right:10px;
	}
}
	
	

@media screen and (max-width: 480px) {
	.headphone{
		width:100%;
		max-width:320px;
		margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
		
	}
	.title{
		margin-top:10px;
		width:100%;
		}
		
	.left-col{
	margin-top:25%;
	text-align:left;}	
	
	.slider{
	width:100%;
	margin:0 auto;}	
.slider-bottom-text{
	width: 345px;
	height: 114px;
	background-size:100%;
	margin-top:-57px;
	}
.slider-bottom-text p{
	position:absolute;
	top:50%;
	left:1px;
	right:1px;
	text-align:center;
	}	
.slider-top-text{
	width: 345px;
	height: 114px;
	margin-bottom:-57px;
	background-size:100%;
	}
.slider-top-text p{
	-moz-transform: scaleY(-1);
    -o-transform: scaleY(-1);
    -webkit-transform: scaleY(-1);
    transform: scaleY(-1);
    filter: FlipV;
    -ms-filter: "FlipV";
	position:absolute;
	bottom:-10%;
	left:1px;
	right:1px;
	text-align:center;
	}			
.slider-img-top{
	width: 345px;
	z-index:200;
	position:relative;
	}
	.slider-img-top img{
	width: 100%;
	}
.slider-wheel img, .slider-wheel2 img{
	width:35px;
	height:35px;
	}
.slider-wheel img{
	margin-left:2px;}
.slider-wheel{
	margin-left:-2px;}	
.slider-wheel, .slider-wheel2{
	top:-44px;
	margin-left:7px;
	margin-right:7px;
	}
		
	
.wheel-holder{
	background-size:100%;
	width:20px;
	height:48px;
	margin-bottom:-30px;
	margin-left:11px;
	}	
	.learn-language {
	margin-top: 0;
	margin-right: 5%;
	margin-bottom: 0;
	margin-left: 5%;
	width:90%;
	}
	.learn-language h2{
	margin-top:0px;
	}
	.learn-german, .learn-sanskrit{
	clear:left;
	}
	.learn-french, .learn-eng, .learn-german, .learn-hindi, .learn-sanskrit{
	width:50%;
	}
	.learn-german{
	width:100%;	
		}
	.heading{
	margin-bottom:-10px;}	

	.orange-col1 h2, .orange-col2 h2, .orange-col3 h2, .orange-col4 h2{
	font-size:20px;}	
	}
@media screen and (max-width: 420px) {
	.orange-col1 h2, .orange-col2 h2, .orange-col3 h2, .orange-col4 h2{
	font-size:20px;}	
	.menu-trigger{
	padding: 5% 3%;
	margin-top: 22%;	}

	}
@media screen and (max-width: 418px) {
	.orange-col1 h2, .orange-col2 h2, .orange-col3 h2, .orange-col4 h2{
	font-size:24px;}
	.separator2{
	display:none;}

	}	
@media screen and (max-width: 395px) {
	.heading{
		padding-bottom:10px;}
	}	
@media screen and (max-width: 345px) {
	.separator3{
	display:block;}
	.title{
		padding-bottom:2px;
		}	
		.menu-trigger{
	margin-top: 26%;
	margin-right:-3%;
	border-radius: 10px;
	border: 3px solid #FC6602;
	padding-top: 2%;
	padding-right: 5%;
	padding-bottom: 2%;
	padding-left: 3%;
}
		.menu-clicked{
	margin-right:3%;
	padding-top: 2%;
	padding-right: 3%;
	padding-bottom: 2%;
	padding-left: 3%;
}	
	
	.menu-trigger{
			margin-top:30%;
				}
	.nav ul li{
		clear:both;
		display:block;
		margin:1px 10%;}	
				
	
	}	
	
@media screen and (max-width: 300px) {
	.sitemap li{
	display:block;}
	.separator1, .separator2, .separator3{
	display:none;}
	.orange-col1 h2, .orange-col2 h2, .orange-col3 h2, .orange-col4 h2{
	font-size:18px;}
	.menu-trigger{
			margin-top:30%;
				}
	.nav ul li{
		clear:both;
		display:block;
		margin:1px 10%;}					
	}					


@media screen and (min-width: 660px) {
.video-container {
    position: relative;
padding-bottom: 38.55%;
padding-top: 30px;
height: 0;
margin:10px;
overflow: hidden;
}

}