/* Tag Selectors */

@font-face {
  font-family: 'thryo-webfont';
  src: url('../fonts/thryo-webfont.eot');
  src: local('☺'),
         url('../fonts/thryo-webfont.woff') format('woff'), url('../fonts/thryo-webfont.ttf') format('truetype'), url('../fonts/thryo-webfont.svg') format('svg');
		}

body {
	background-color: rgba(255,255,255,1);
	font: normal 100.01% Cambria, Georgia, serif;
	margin: 0px;
	padding: 0px;
	-webkit-tap-highlight-color: rgb(255,255,158);
	webkit-text-size-adjust: 100%;
}
/* Selection colours (easy to forget) */

::selection 	 	{background: rgb(255,255,158);}
::-moz-selection 	{background: rgb(255,255,158);}
img::selection 		{background: transparent;}
img::-moz-selection	{background: transparent;}
	
h1 {
	font-family: 'thryo-webfont';
	font-size: 1.4em;
	margin: 5px 0px 10px;
}
h2 {
	font-family: 'thryo-webfont';
	font-size: 1.3em;
	color: #660000;
}
h3 {
	font-size: 1.1em;
	margin-left: 5px;
}
ul li {
	list-style-type: none;
	margin-left: -2em;
	color: #000000;
}
table {
	border: 1px solid #660000;
	width: 98%;

	margin-right:2%
	vertical-align: top;
	border-collapse: collapse;
	margin-bottom: 10px;
}
thead {
	font-weight: bold;
	text-align: center;
}
thead tr {
	background: #ADC5CE;
}
th {
	background: #EFC573;
	text-align: center;
	border: thin solid #660000;
}
td {
	margin: 5px;
	border: 1px solid #660000;
}
tr:nth-of-type(even) {
	background-color: #ADC5CE;
}

/* End of Type Selectors */


/* ID Selectors and contextual selectors*/
#wrapper {
	width: 100%;
	min-width: 800px;
	text-align:left;
	position: relative;
	overflow-x: hidden;
}
#header {
	background-color: rgba(173,197,206,1);
	height: 45px;
	margin-bottom: 2px;
	-webkit-box-shadow: rgba(0,0,0,.7) 2px 2px 5px;
	-moz-box-shadow: 2px 2px 5px rgba(0,0,0,.7);
	box-shadow: 2px 2px 5px rgba(0,0,0,.7);
}
#navbar, #navbar2{
	height: 22px;
	background-color: #EFC573;
	font-size: 0.9em;
	padding-top: 2px;
	border-bottom: 2px double #660000;
	-webkit-box-shadow: rgba(0,0,0,.7) 5px 5px 10px;
	-moz-box-shadow: 5px 5px 10px rgba(0,0,0,.7);
	box-shadow: 5px 5px 10px rgba(0,0,0,.7);
}
#navbar ul, #navbar2 ul{ margin: 0px 0px 0px -32px; }
#navbar ul li, #navbar2 ul li {
	text-decoration: none;
	float: left;
	list-style-type: none;
	margin: 0px;
}

#navbar ul li a, #navbar2 ul li a {
	text-decoration: none;
	display: block;
	padding: 2px 8px;
	border-left:1px solid #600;
	border-right:1px solid #600;
	border-top:1px solid #600;
	-moz-border-radius:10px 10px 0px 0px;
	-webkit-border-top-right-radius: 10px;
	-webkit-border-top-left-radius: 10px;
	-khtml-border-top-right-radius: 10px;
	-khtml-border-top-left-radius: 10px;
	-webkit-box-shadow: rgba(0,0,0,.7) 1px -1px 5px;
	-moz-box-shadow: 1px -1px 5px rgba(0,0,0,.7);
	box-shadow: 1px -1px 5px rgba(0,0,0,.7);
}
#navbar ul li a:link, #navbar2 ul li a:link {
	background-color: #EFC573;
	color: #600;
}

#navbar ul li a:visited, #navbar2 ul li a:visited {
	background-color: #EFC573);
	color:#900;
}
#navbar ul li a:hover, #navbar2 ul li a:hover {
	background-color: #600;
	color: #EFC573;
}
#navbar ul li a:active, #navbar2 ul li a:active{
	background-color: #900;
	color: #EFC573;
	-webkit-box-shadow: rgba(0,0,0,.7) 2px -2px 5px;
	-moz-box-shadow: 2px -2px 5px rgba(0,0,0,.7);
	box-shadow: 2px -2px 5px rgba(0,0,0,.7);
	margin-bottom: 2px;
}

#navbar2{display:none;}

#mainColumn {
	font-size: 0.9em;
	padding-bottom: 8px;
	line-height: 1.5em;
	margin-top: 15px;
	margin-right: 10px;
	margin-bottom: 15px;
	margin-left: 200px;
	min-width: 770px;
}
#mainColumn #infoBox {
	background: rgba(173,197,206,.4);
	border: thin solid #600;
	width: 350px;
	margin-left: 10px;
	color: #600;
	padding: 1%;
	-moz-border-radius:12px;
	-webkit-border-radius:12px;
	border-radius:12px;
	-webkit-box-shadow: rgba(0,0,0,.7) 5px 5px 10px;
	-moz-box-shadow: 5px 5px 10px rgba(0,0,0,.7);
	box-shadow: 5px 5px 10px rgba(0,0,0,.7);
	margin-bottom: 10px;
	margin-right: 10px;
	/*transform:rotate(2deg);
	-moz-transform: rotate(2deg);
  	-webkit-transform: rotate(2deg);*/
}
#mainColumn #infoBox img {
	float: right;
	margin-left: 5px;
	-moz-border-radius:12px;
	-webkit-border-radius:12px;
	border-radius:12px;
	}
#mainColumn td {
	padding: 3px;
	}
	
#sideColumn {
	width: 175px;
	position: fixed;
	left: 0px;
	top: 80px;
	background: rgba(255,255,255,.8);
	font-size: 0.9em;
	padding-top: 7px;
	padding-right: 5px;
	margin-left: 5px;
	margin-top: 5px;
	margin-bottom: 5px;
	float: left;
	border: thin solid #662C41;
	-moz-border-radius:12px;
	-webkit-border-radius:12px;
	border-radius:12px;
	-webkit-box-shadow: rgba(0,0,0,.7) 5px 5px 10px;
	-moz-box-shadow: 5px 5px 10px rgba(0,0,0,.7);
	box-shadow: 5px 5px 10px rgba(0,0,0,.7);

}
#sideColumn ul {
	margin-top: 8px;
	margin-bottom: 8px;
}
#sideColumn li {
	margin-left: -35px;
}
#sideColumn h2 {
	margin-left:10px;
	border-bottom-width: thin;
	border-bottom-style: solid;
	border-bottom-color: #600;
	margin-bottom: 0px;
	margin-top: 2px;
}
#sideColumn a {
	text-decoration: none;
	display: block;
	padding: 2px 5px;
	border-bottom: 1px solid #ADC5CE;
	color: #660000;

}
#sideColumn a:link { color: #660000; 
}
#sideColumn a:visited { color: #990066; 
}
#sideColumn a:hover {
	color: #660000;
	background-color: #ADC5CE;
}
#sideColumn a:active {
	color: #990000;
	background-color: #CCC;
}
#sideColumn #news a {
	display: inline;
	color: #00F;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}

#assignmentSideColumn {
	width: 175px;
	position: fixed;
	left: 0px;
	top: 80px;
	background: rgba(255,255,255,.8);
	font-size: 0.9em;
	padding-top: 5px;
	padding-right: 5px;
	margin-left: 5px;
	margin-top: 5px;
	margin-bottom: 5px;
	float: left;
	border: thin solid #662C41;
	-moz-border-radius:12px;
	-webkit-border-radius:12px;
	border-radius:12px;
	-webkit-box-shadow: rgba(0,0,0,.7) 5px 5px 10px;
	-moz-box-shadow: 5px 5px 10px rgba(0,0,0,.7);
	box-shadow: 5px 5px 10px rgba(0,0,0,.7);

}
#assignmentSideColumn li {
	margin-left: -35px;
}
#assignmentSideColumn li:first-child {
	border-top: 1px solid #ADC5CE;
}
#assignmentSideColumn h2 {
	margin-left:10px;
	border-bottom-width: thin;
	border-bottom-style: solid;
	border-bottom-color: #600;
	margin-bottom: 0px;
	margin-top: 2px;
}
#assignmentSideColumn a {
	text-decoration: none;
	display: block;
	padding: 2px 5px;
	border-bottom: 1px solid #ADC5CE;
}
#assignmentSideColumn a:link { color: #660000; }
#assignmentSideColumn a:visited { color: #990066; }
#assignmentSideColumn a:hover {
	color: #660000;
	background: #ADC5CE;
}
#assignmentSideColumn a:active {
	color: #990000;
	background: #ADC5CE;
}

#footer {
	background-color: #EFC573;
	color: #600;
	font-size: 0.85em;
	position: fixed;
	width:100%;
	left: 0px;
	bottom: 0px;
	border-top: 2px double #660000;
	text-align: center;
	height: 20px;
	-webkit-box-shadow: rgba(0,0,0,.7) 5px 5px 10px;
	-moz-box-shadow: 5px 5px 10px rgba(0,0,0,.7);
	box-shadow: 5px 5px 10px rgba(0,0,0,.7);
}
#news {
	position: absolute;
	width: 155px;
	left: 5px;
	top: 352px;
	font-size: 14px;
	color: #600;
	background-color: #ADC5CE;
	border: thin solid #600;
	padding-top: 2px;
	padding-right: 2px;
	padding-bottom: 2px;
	padding-left: 5px;
}
/* End of ID Selectors and contextual selectors*/


/* classes*/
.clr {
	clear: both;
}
.superscript {
	vertical-align: super;
	font-size: x-small;
	text-decoration: overline;
}
.studentNames {
	border: 1px solid #660000;
	vertical-align: top;
	height: 400px;
	overflow: scroll;
}
.emphasis {
	font-weight: bold;
	color: #660000;
}
.fltRight {
	float: right;
	margin-left: 5px;
}	
.fltLeft {
	float: left;
}
.onlineadmin {
	color: #EFC573;
	position: absolute;
	top: 0px;
	right: 0px;
}
.css3RoundedBorders
{
	border: 1px solid #618A37;
	-moz-border-radius:12px;
	-webkit-border-radius:12px;
	border-radius:12px;
	-webkit-box-shadow: rgba(0,0,0,.7) 5px 5px 10px;
	-moz-box-shadow: 5px 5px 10px rgba(0,0,0,.7);
	box-shadow: 5px 5px 10px rgba(0,0,0,.7);
}
.centerText {
	text-align: center;
}

ol li ol li ol li { list-style: lower-roman; }

ol li ol li { list-style: lower-alpha; }

@media only screen and (min-width: 768px) and (max-width: 991px) {
	#wrapper {
		min-width: 768px;
		max-width: 991px;
		}
	#navbar, #navbar2{
		font-size: 0.8em;
		height: 20px;
		}		
	#navbar ul li a, #navbar2 ul li a {
		padding: 2px 6px;
	}
	#mainColumn {
		font-size: 0.85em;
		}
		#TabbedPanels1 {
			width: 95%;
			min-width: 580px;
		}
}

@media only screen and (max-width: 767px) {
	#header {display:none;}
	#index_tabs {display: none;}
	#sideColumn, #assignmentSideColumn {display: none;}
	#mainColumn #infoBox #img{display: none;}
	#footer {display:none;}
	#navbar2 {display:block;}
	
	#wrapper {
		min-width: 240px;
		max-width: 767px;
		}
	#navbar, #navbar2{
		font-size: 0.6em;
		height: 12px;
		}
		
	#navbar2{
		clear:both;
		height: 16px;
		}
	#navbar ul li a, #navbar2 ul li a  {
		padding: 1px 3px;
		}
	#mainColumn {
		font-size: 0.75em;
		padding-bottom: 8px;
		line-height: 1.3em;
		margin: 3px;
		min-width: 240px;
		max-width: 767px;
		clear:both;
		}
		#TabbedPanels1 {
			width: 95%;
			min-width: 240px;
		}
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
	#header {display:none;}
	#index_tabs {display: none;}
	#sideColumn, #assignmentSideColumn {display: none;}
	#mainColumn #infoBox #img {display: none;}
	#footer {display:none;}
	#navbar2 {display:block;}
	
	#wrapper {
		min-width: 480px;
		max-width: 767px;
		}		
	#navbar, #navbar2{
		height: 15px;
		font-size: 0.7em;
		}
	#navbar2{
		height: 22px;
		clear:both;
		}
	#navbar ul li a {
		padding: 1px 3px;
		}
	#navbar2 ul li a {
		padding: 6px;
		}
	#mainColumn {
		font-size: 0.8em;
		padding-bottom: 8px;
		line-height: 1.3em;
		margin: 3px;
		min-width: 480px;
		max-width: 767px;
		clear:both;
		}
		#TabbedPanels1 {
			width: 95%;
			min-width: 480px;
		}
	#footer {
		font-size: 0.75em;
		position:absolute;
		width:100%;
		}
}

@media only print{
	#header, #navbar, #navbar2, #sideColumn, #assignmentSideColumn, #footer, .TabbedPanelsTabGroup {display:none;}
	#mainColumn{margin-left:0px;}
	.TabbedPanels {
	float:none;
	margin-bottom: 0px;
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	box-shadow:none;
}
	
	.TabbedPanelsContentVisible {
	width:100%;
	color: #000000;
	border:none;
	height:auto;
	max-height:8000px;
	overflow:visible;
	page-break-after:auto;
	}
}