
.nottablet{display:none;}
.tabletonly{display:inline;}
.mobileandtablet{display:inline;}
.mobileonly{display:none;}
html{		overflow-y:scroll;}
body {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	color: 005151;
	margin : 0px;
	padding: 0px;
	border: 0px;
	/*background-color: #FFF;
	color: #333;*/
}
/* overall design */
#container{
	position: relative;
	width: 100%;
	padding: 0px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	margin-bottom: 0px;
	/*overflow: visible;
	min-height: 400px;*/
	z-index : 5;
	min-width: 300px;
}
#top {
	position: relative;
	z-index : 2;
	width: 100%;
	/*background-color:#FFF;*/
	border-top:#47c7c7 2px solid;
	border-bottom:#47c7c7 2px solid;
	overflow:hidden;
}
#topbar {
	position: relative;
	z-index : 2;
	padding: 0px 0px 0px 0px;
	text-align: left;
	width: 100%;
	/*overflow:hidden;*/
	
	font-family: "Arial Rounded MT Bold", '616', Arial;
	overflow:hidden; min-width: 300px;
}
#learntopbar {width: 100%;}
#teachtopbar {width: 100%;}
#admintopbar {width: 100%;}
#subtopbar {width: 100%;}
#mytopbar {width: 100%;}
#warningsubtop {width: 100%;}
#warningtopbar {width: 96%;}

#logo {padding: 8px 0px 6px 8px;}
.logo{height:62px;}
#mobilelogo {
	width:140px;
	position: relative;
	padding: 14px 0px 0px 8px;
	z-index : 3;
	display:inherit;
}
#menutop { text-align:right;
	position: absolute;
	z-index : 4;
	padding: 0px 5px 0px 0px;
	height:68px;
	color:#FFF; top: 0px; right: 0px;/*min-width: 300px;*/
}

/*#signup a{
	color:#FFF;
	padding: 20px 10px 10px 10px;font-weight: normal;
		
}
#signup a:hover {
	color : #CCC;
}*/
#login a{
	color:#FFF;
	padding: 20px 10px 10px 9px;font-weight: normal;
		
}
#login a:hover {
	color : #CCC; 
}
#menu {left:0px;
width:100%;
}
a#nav9{
padding-left:26px;
	padding-right:26px;
}
#accessouter {position: relative;
	width: 100%;
	overflow:hidden;
	border-bottom:#47c7c7 2px solid; }
#accessibility {position: relative;
	width: calc( 100% - 20px);
margin-left: auto;
	margin-right: auto;
	padding: 10px;
	border: 0px;
	overflow:hidden;text-align:right;
	}
#access1 {
	float:right;padding: 10px 10px 0px 10px;}
#access2 {
	float:right; padding: 10px 10px 0px 10px;}
#access3 {
	float:right; padding: 10px 10px 0px 10px;}
#access4 {
	float:right; padding: 0px 10px 0px 10px;}
#access5 {
	float:left; padding: 10px 10px 15px 10px;}
#access6 {
	float:left; padding: 10px 10px 10px 10px;}
#bottomgreen {
	position: relative;
	z-index : 2;
	width: 100%;
	background-color:#009999;
	border-bottom:#009999 2px solid;
}
#testimonialsinner{width: 96%; margin:auto;padding: 10px 0px 10px 0px;}
#bottomgreeninner {
	position: relative;
	z-index : 2;
	padding: 15px 0px 0px 0px;
	font-size: 100%;
	text-align: left;
	width: 96%;
margin:auto;
	overflow:hidden;
	color:#FFF;
	background-image: none;
	background-repeat:no-repeat;
	background-position:bottom right;
}
#bottomgreeninner h3{
	color:#FFF;
	font-size: 140%;
		padding: 0px 0px 0px 0px;
}
#bottomgreeninner a{
	color:#FFF; font-weight:normal;
}
#bottomgreeninner a:hover{
	color:#CCC;
}
#bottomgreeninner hr{width: 100%;
	height: 2px;
	color: #FFF;
	background-color:#FFF;
	border-color:#000000;
	border:0px;}

#bgreen1 {
	width: 40%; float:left;visibility : visible;padding: 0px 0px 0px 0px;}
#bgreen2 {
	width: 40%; float:right; padding: 0px 15px 0px 0px;}
#bgreen3 {position: relative;
	width: 100%;
	padding: 0px 0px 0px 0px;
	margin: 0px;
	border: 0px;
	float: left;
	z-index: 4;
	}
#footer {
	position: relative;
	z-index : 1;
	width: 100%;
}
#footerinner {
	position: relative;
	z-index : 2;
	padding: 10px 0px 20px 0px;
	text-align: left;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	margin-bottom: 0px;
	overflow:hidden;

	font-size: 90%;
}	
#footer1 {
	 float:left;visibility : visible;padding: 10px 0px 0px 10px;}
#footer2 {
	 float:left;padding: 10px 0px 0px 0px;}
#footer3 {
	padding: 4px 10px 0px 15px;
	margin: 0px;
	border: 0px;
	z-index: 4;}	
#footer a{ font-weight:normal;}
#footer a:hover {
	font-weight:normal;
}
#studentmode-inner {width:96%;}
/* home page and 2nd level pages */
#hcolumn1, #whatcolumn1, #wlcolumn1 {position: relative;
	width: 100%;
	padding: 0px 0px 10px 0px;
	margin: 0px;
	border: 0px;
	z-index: 5;
	min-height:400px; overflow:visible;}
#hcolumn2, #wlcolumn2 {position: relative;
	width: 100%;
	padding: 0px 0px 0px 0px;
	margin: 0px;
	border: 0px;
	z-index: 4;
	min-height:40px;}
#hcolumn2 h3{color:#47c7c7;font-size:130%;}
#contentmain {position: relative;
	width: 96%;
	margin: auto;
	left: 0px;
	top: 0px;
	padding : 20px 0px 10px 0px;
	border: 0px;
	visibility : visible; min-height:400px;}
#coursemain {width: calc(100% - 30px);}
#coursecolumn2 {
	padding: 16px 10px 0px 0px;} 
#homecontent1 {
	position: relative;
	padding: 30px 20px 20px 15px;
	/*background-image: url(../images/home/learn_letters.jpg);*/
	background-repeat:no-repeat;
	background-position:top right;
}
#homecontent1 h1{	color:#666;}
#homeside1 {position: relative;
	padding: 0px 10px 10px 15px; float:left; width:44%;}
#homeside1 h2{color:#47c7c7;font-size:140%;}
#homeside1 a{color:#666; }
#homeside1 a:hover{
	color:#999;
}
#greenside { float:right; width:44%;
	position: relative;
	padding: 15px 15px 15px 15px;
	background-color:#029A9B;
	overflow: hidden;
	color:#FFF;
	background-image: url(../jpg/corner_curve.jpg);
	background-repeat:no-repeat;
	background-position:top right;
}
#greenside a{
	color:#FFF; font-weight:normal;
}
#greenside a:hover{
	color:#CCC;
}
#greenside h3{ color:#FFF;font-size:140%;}	
#greencontent {
	position: relative;
	padding: 20px 0px 0px 20px;
	background-color:#FFFFFF;
	overflow: hidden;
	font-weight:bold;
	background-image: url(../jpg/spelling_block.jpg);
	background-repeat:no-repeat;
	background-position:top left;
}
#greencontent1 {position: relative;
	width: 310px; float:left;visibility : visible; padding: 0px 20px 0px 0px;}
#greencontent2 {position: relative;
	width: 320px; float:left;}
#greencontent1 h2{ color:#FFF;font-size:140%;}	
#greencontent1 a{color:#FFF; font-size:120%;}#greencontent a:hover{
	color:#CCC;font-size:120%;
}
#greencontent2 h2{
	color:#CA5F4A;
	font-size:140%;
	padding: 0px 0px 10px 0px;
}
#homecontent2 {position: relative;
	padding: 30px 40px 20px 15px;}
#homecontent2 h3{color:#47c7c7;font-size:140%;}
#homecontent2 hr{
	width: 100%;
	height: 1px;
	color: #999;
	background-color:#999;
	border: 0px;
	margin: 10px 0px 10px 0px;
}
#homecontent2 a{color:#666; }#homecontent2 a:hover{
	color:#333;
}

#homedate {position: relative;float: right; color:#47c7c7;}
#mainside1 {position: relative;
	padding: 30px 10px 20px 25px; text-align:right;}
	
#topschools{width:calc(100% - 15px);float:left; padding:0 5px 0 10px;}
#topclasses{width:calc(50% - 15px);float:left; padding:0 5px 0 10px;}
#topusers{width:calc(50% - 15px);float:left; padding:0 0px 0 10px;}

/* home page and 2nd level pages */
#cfcolumn1 {width: 96%;}
#cfcolumn2 {width: 96%;min-height:0px;}
#cfcolumn2 h3{color:#47c7c7;font-size:130%;}
#signupcolumn1 {width: 96%;}
#signupcolumn2 {width: 96%;min-height:0px;}
/*inner pages*/
#column1 {position: relative;
	width: 96%;
	padding: 0px 0px 10px 0px;
	margin: 0px;
	border: 0px;

	clear:both;
	}
#column2 {
	position: relative;
	width: 96%;
	padding: 30px 15px 30px 10px;
	margin: 0px;
	border: 0px;
	clear:both;

	text-align:right;
	/*background-color: #E7F8F8;*/
}
#content {position: relative;
	width: 100%;
	left: 0px;
	top: 0px;
	padding : 20px 10px 10px 15px;
	padding: 0px;
	border: 0px;
	z-index: 3;
	visibility : visible;}

#columnheader {position: relative;
	width: 100%;
	padding: 9px 15px 0px 14px;
	margin: 0px;
	border: 0px;
	float: left;
	z-index: 4;
	background-color: #FFFFFF;color: #005151;}
#headerlogo	{float:left; width:540px;color:#07878D;}
#headertext	{float:right; text-align:right;width:200px;}

#header2 {position: relative;
	width: 186px;
	padding: 6px 10px 0px 4px;
	margin: 0px;
	border: 0px;
	float: right;
	z-index: 4;
	text-align:right;font-size:13px;}
#log_in {position: relative;
	width: 190px;
	padding: 1px 10px 0px 0px;
	margin: 0px;
	border: 0px;
	float: right;
	z-index: 4;
	text-align:right; }
#log_in img{padding: 0px 0px 0px 10px;vertical-align:middle;}

.rightitemtop {position: relative;
	width: 190px;
	padding: 5px 10px 6px 0px;
	margin: 0px;
	border: 0px;
	z-index: 4;
	text-align:right;
	border-bottom:#009999 2px solid;
	line-height:160%;}

.rightlists {position: relative;
	width: 186px;
	padding: 5px 10px 7px 4px;
	margin: 0px;
	border: 0px;
	z-index: 4;
	background-color:#FFFFFF;
	text-align:right;
	border-bottom:#009999 2px solid;
	line-height:150%;}
.colleft{width:370px; float:left;}
.colright{width:375px; float:right;}
.colleftshade{width:370px; float:left;padding: 4px 4px 4px 4px; min-height:210px;}
.colrightshade{width:355px; float:right;padding: 4px 4px 4px 4px;min-height:210px;}
.homegametitle{width:742px; padding: 4px 4px 6px 4px; background-color:#009999;font-weight: bold;font-size: 120%;color:#FFFFFF;margin:0px 0px 6px 0px;}
.homegametitle i{color:#FFCC33;}
.homebox{width:181px;border:#009999 1px solid;float:left;margin:6px 6px 10px 0px;}
.homebox4{width:181px;border:#009999 1px solid;float:left;margin:6px 0px 6px 0px;}
.homeboxtitle{width:179px; padding: 1px 0px 3px 3px; background-color:#009999;font-weight: bold;font-size: 100%;color:#FFFFFF;}
.homeboxcontent{width:100%; padding: 4px 4px 6px 4px;}

.multibox50{
	width:50%;}

#columncontent {position: relative;
	width: 100%;
	padding: 15px 15px 5px 15px;
	margin: 0px;
	border: 0px;
	float: left;
	z-index: 4;
	min-height:550px;
	line-height:140%;background-color: #FFFFFF;}
#rightcontent {position: relative;
	width: 270px;
	padding: 5px 5px 10px 10px;
	margin: 0px;
	border: 0px;
	z-index: 4;
float:right; background-color: #E2F3F3;}
#rightsmall {position: relative;
	width: 200px;
	padding: 5px 5px 10px 10px;
	margin: 0px;
	border: 0px;
	z-index: 4;
float:right; background-color: #E2F3F3; min-height:200px;}
#leftcontent {position: relative;
	width: 440px;
	padding: 5px 0px 0px 0px;
	margin: 0px;
	border: 0px;
	z-index: 4;
}
#left600 {position: relative;
	width: 580px;
	padding: 5px 0px 0px 0px;
	margin: 0px;
	border: 0px;
	z-index: 4;
}
#righttop {position: relative;
	width: 300px;
	padding: 15px 15px 5px 15px;
	margin: 0px;
	border: 0px;
	z-index: 4;
	min-height:520px;
float:right;}
#fullwidth{width:100%;}
#halfcolumn{width:400px; padding:0px 10px 0px 0px; float:left;}
#sharecontent {position: relative;
	width: 100%;
	padding: 0px 15px 5px 15px;
	margin: 0px;
	border: 0px;
	float: left;
	z-index: 4;
	line-height:140%;background-color: #FFFFFF;text-align:right;}
#sharecontent a{ 
	padding: 2px 0px 0px 5px;
	float:right;}
#share { width: 400px; float: right; text-align:right;padding: 0px 0px 0px 0px;}
#share a{ 
	padding: 2px 0px 0px 5px;
	float:right;}
#shareleft { float: right; text-align:right;padding: 5px 0px 0px 5px;}
#shareleft a{ 
	padding: 2px 0px 0px 5px;
	float:right;}
#copyright{position:relative;
height: 30px;
margin: 5px 0px 30px 0px;
z-index : 6;
font-size : 70%;
color : #FFFFCC;
clear:both;
text-align:center;
}
hr{width: 100%;
	height: 2px;
	color: #009999;
	background-color:#009999;
	border-color:#000000;
	border:0px;}
table{	margin : 0px;
	padding: 0px;
		border: 0px;}

a#nav12{border-right:#FFF 0px solid;color:#24B0B1;padding: 0px 0px 0px 7px;}


a#navfoot1, a#navfoot2{
	display:inline;
}

.quizinput::-ms-clear {
            display: none;
    }
#bottom_advert{padding:10px 0px 10px 0px; visibility: visible; overflow:hidden; width:100%;}
#side_advert{padding:10px 0px 10px 0px; display:none;}
#mobile_advert{padding:10px 0px 10px 0px; display:none;}
#progress-bar{float:right; width:100%; text-align:right;}

.close{box-shadow: 3px 3px 6px #000;}
.close:link, .close:visited, .close:hover, .close:focus, .close:active {right: 15px;top: 14px;}

#orientationwarning{display:none;}
.PopupDialog {
	position: absolute;
	width: 100%;
	height:1600px;
	top:-130px;
}
.PopupDialog > div {
	width: 97%; height:100%;
	position: relative;
	margin: auto;
	padding: 40px 10px 10px 10px;
	border-radius: 0px;
background: #fff;
}
#Cover1, #Cover2, #Cover3{
	position: fixed;
	width: 100%;
	height:150%; 
	top:0px;
	z-index : 99;
}
.Popup{} 
/*.LSCWCPopup, .GamePopup, .ListPopup{
	width: 100%; height:100%;
	position: relative;
	margin: auto;
	padding: 0px 0px 0px 0px;
	border-radius: 0px;
background: #fff;
}*/



/*@media screen and (max-width: 680px) {
#Cover1, #Cover2, #Cover3{
	top:0; bottom:0; left: 0; right: 0;
	position: fixed;
	width: 100%;
	height:150%; 
	margin:0;
	z-index : 99;
}
.Popup, .LSCWCPopup, .GamePopup, .ListPopup{
	width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px 0px 0px 0px;
	border-radius: 0px;
	background-color: #FFF;
}
.GameMultiAdd{height:100%;}
#gameholder{width: 100% height:100%;}	
}*/
.GamePopupLarge{position: fixed; top:0px; left:0px; margin: 0px;padding: 0px 0px 0px 0px;width: 100%; height:100%; overflow:auto; border-radius: 0px;}

@media screen (min-height: 421px) and (max-height: 500px) and (orientation:landscape){
.Popup, .LSCWCPopup, .GamePopup, .ListPopup{
	margin: 0px;
	padding: 0px 0px 0px 0px;width: 100%; height:100%;
}
}

@media (pointer: coarse) and (min-width: 800px) {
.Popup, .LSCWCPopup, .GamePopup, .ListPopup{
	width: 100%; height:100%;
	padding: 0;
	margin: 0;
	border-radius: 0px;
	transform: scale(1.1);
	transform-origin: 0 0;
	}	
.close:link, .close:visited{right: 15px;top: 14px;}
}
.gameadvert{display:none;}
/* games */
#gameholder{width: 97%; height:100%;}

/* home page styling */
#topimage{width: 100%;  margin: 0px;height:624px;
	padding: 0px; left:0px; top: 0px;
position: relative;overflow:hidden;}
/*#topmainimage{height:624px;position: absolute;overflow:hidden; z-index:2;}*/
#homesinglecolumn{position: relative;
	width: 96%; padding: 0px 10px 0px 10px;}
#homemaintext{width:calc(100% - 10px); padding: 0 0px 10px 10px;}


#homestats{right:10px;}
#homeslider{position: relative; width: 96%; margin: 0px 0px 0px 0px;float:left; padding:0 0 0 10px; }
#homevideo{width: 560px;  float:left; }
.homevideoframe{width: 560px; height: 360px;}
#hometrial{width: 100%;}
#hometrialbox{width: 330px; padding: 10px 0px 10px 140px; margin: 0px 0px 35px 90px;}
#homeblog{float:left; width:100%;}
.homeblogdate {display:none;}
#homecasestudy{margin: 0px 25px 25px 0px;}
#homewhat1{ margin: 0px 0px 25px 0px;}
#homewhat2{ margin: 0px 0px 25px 0px; float: right;}
#homewhat3{ margin: 0px 0px 15px 0px;}
#homegreen {width: 100%;
	padding: 0px 0px 0px 0px;
}
#homegreeninner {
	width: 96%;
	padding:0px 0px 0px 0px;
	margin: 0 10px 0 10px;
}
#homegreencolumn1{width:94%;}
#homegreencolumn2{width:94%;}
.iframe{width:500px; height:375px;}
.listmenu {width:calc( 15% - 8px); margin : 0px 9px 15px 0px;}
.listmenuselect {width:calc( 15% - 8px); margin : 0px 9px 15px 0px;}
.translation-dropdown{float:right;}
.free-trial-boxes{max-width:100%; margin: 20px auto;}
.free-trial-box{float:left;padding:0 6px 10px 0; width:30%; max-width:260px;text-align: center;}
.free-trial-image{width:80%; height:auto;}