/* CSS */

body{
	background-color: #fff;
	color:#666;
	font-family: Arial, Gotham, Helvetica Neue, Helvetica, " sans-serif";
	margin:20px 40px 40px;
	background-image: url(../images/bishBackFaded.png);
	background-position: right top;
	background-repeat: no-repeat;
}
#wrapper{
	max-width: 600px;
	background-color: rgba(255, 255, 255, 0.6);
}
h1{
	color:#666;
	font-size: 2.2em;
	margin-top:50px;
	 /*color: #207dde;
    font-size: 6em;
    line-height: 0.9em;
    font-weight: bold;
    font-family: fantasy;*/
}
.warningText{
	color:#DF1B1F;
	font-size: 1.2em;
}
#descHolder{
	width:400px;
}
#panelHolder{
	border: thin #999 solid;
	width:400px;
	margin-top:80px;
}
h2{
	padding:10px;
	margin:0px;
}
#ilearnPanel h2{
	background-color:#666;
	color:#fff;
}
#ilearnPanelText{
	background-color: #fff;
	color:#666;
	padding:10px;
}
#vlePanel h2{
	background-color:#007bab;
	color:#fff;
}
#vlePanelText{
	background-color: #fff;
	color:#007bab;
	padding:10px;
}
#startersPanel h2{
	background-color:#005A9C;
	color:#fff;
}
#startersPanelText{
	background-color: #fff;
	color:#005A9C;
	padding:10px;
}
a{
	text-decoration: none;
	color:inherit;
}
a:hover{
	text-decoration: underline;
}
#footer{
	/*position: fixed;
	bottom: 0px;*/
	margin-top:80px;
	font-size: 0.8em;
	width:100%;
}


@media screen and (max-width: 500px){
	body{
		background-image: url(../images/bishBackMoreFaded.png);
	}
	h1{
		font-size: 2em;
	}
	h2{
		font-size: 1.4em;
	}
	#descHolder{
		width:100%;
	}
	#panelHolder{
		width:100%;
		margin-top:60px;
	}
	#footer{
		position: relative;
		bottom: 0px;
		font-size: 0.8em;
		width:100%;
		margin-top:30px;
		font-size: 0.8em;
	}
}