@import url('https://fonts.googleapis.com/css?family=PT+Sans');
/* CONTENTS:

DESKTOP: 752	- min-width: 1152px 		|| NEW 01-18: min 1200px
TABLET: 2298 	- min-width : 768px / 		|| NEW 01-18: 800px - 
				- max-width : 1152px  					   1199px
MOBILE:	3402  	- max-width : 767px 		|| NEW 01-18: max 799px

PRINT - 5173
*/

/*START OF GENERAL STYLES 
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd,  fieldset, form, label, legend,  caption,    select {margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline;}
/* removed ol, ul, li,  to allow bullet points to display properly in tables */

caption  {text-align: left; font-weight: normal;}
blockquote:before, blockquote:after, q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
a img {border: none;}
:focus {outline: 0;}

/* 
   General 
------------------------------------------------------------------- */

html {
	height: 100%;
	padding-bottom: 1px; /* force scrollbars */
}

body {
	background: #fff;
	margin-top: 0px;
	padding: 0px;
	font-family: Helvetica, Arial, "Lucida Grande", sans-serif;
	font-size: 0.8em;
	line-height: 180%;
	font-weight: normal;
	color: #444;
}

#framebody {
	background: #fff;
	color: #444;
	font: normal 75% sans-serif;
	line-height: 1.5; 
}
/* 
   Typography 
------------------------------------------------------------------- */

.refhead
{
color: #FD6513;
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
}
.notehead
{
color: #3D5289;
color: #D2E5FA;

font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
margin: 30px 0px 7px 0px;
}

/* Links */


a {
	/*color: #08306D;*/
	color: #222;
	text-decoration: none;
	font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;

}

a:hover {
text-decoration: underline;	
color: #0D469E;
}


.linkHead {
font-family: Helvetica;
font-weight: bold;
font-size: 1.6em;
text-decoration: none;
color:	#184386;
}


.blueLink {
color: #08306D;
text-decoration: underline;	
}

.blueLink:hover {
color: red;
text-decoration: underline;	
}

.blueLink:visited {
color: #08306D;
text-decoration: underline;
}

a.inline:link
{
font-size: inherit;
font-family: inherit;
}

.greenheadlink
{
	/* top of mycourse.php*/
	color: #555555;
	font-family: Helvetica, Arial, "Lucida Grande", sans-serif;
	font-size: 1.5em;
	font-weight: bold;
	text-decoration: none;
	margin-top: 3px;
	margin-bottom: 3px;	
}
.greenheadlink:visited
{
	color: #555555;
	text-decoration: none;		
}
.greenheadlink:hover
{
	color: red;
	text-decoration: none;
}
/*
.linkTitle:hover {
	text-decoration: none;
}
*/

.NavBoxGrey {
float: left; 
padding: 3px; 
background-color: #fff; 
margin: 5px 5px 0px 0px; 
border-radius: 3px; 
border: 1px solid #999; 
}

.NavBoxBlue {
float: left; 
padding: 3px; 
background-color: #fff; 
margin: 5px 5px 0px 0px; 
border-radius: 3px; 
border: 1px solid #999;
}

.BlueSelect {
background-color: #333; 
border: 1px solid #333;
}



#login 
{
	font-size: 1.2em;
	text-decoration: none;
	float: right;	
	margin-top: 15px;
	border: 0px dashed red;	
}

/* COLOURS */
.black {color: #000; }
.blue {color: blue; }
.blueEarth { color: #2E4276; }
.eltblue {color:#212F53; }
.eltlink {color: #08306D;}
.green {color: green; }
.grey1  { color: #444; }
.grey2  { color: #222; }
.olive {color: #628E16;}
.orange {color: #E3420A; }
.orangeELT { color: #de780a; }
.purple {color: #7506D4; }
.red {color: red; }
.redearth { color: #CC4814;}
.rubyred {color: #C00F1C;}
.turq {color: #058177; }
.white {color: #ffffff; }
.white:hover {color: #ffffff; }
.white:visited {color: #ffffff; }

/* TEXT STYLES */

p {margin-bottom: 1em;}
.small {font-size: 0.9em;}
.smaller {font-size: 0.8em;}
.smallest {font-size: 0.7em;}

.large {font-size: 1.15em;}
.larger {font-size: 1.2em;}
.largest {font-size: 1.35em;}

.hidden {display: none;}

.quiet, .quiet a {color: #999;}
.loud, .loud a {color: #000;}
.highlight, .highlight a {background:#ff0;}

.text-left {text-align: left;}
.text-right {text-align: right;}
.text-center {text-align: center;}
.text-separator {padding: 0 5px;}


.indexText
{
font-family: Helvetica,  Arial, "Lucida Grande", sans-serif;
font-size: 1.3em;
line-height: 150%;	
color: #333;
margin: 0px 0px 8px 0px;
}

.longRead {
padding: 0px;
font-family:  "Lucida Grande", "DejaVu Sans", "Bitstream Vera Sans", Verdana, sans-serif;
font-size: 1.25em;
line-height: 180%;
font-weight: normal;
}


/* Forms  */

textarea {overflow: auto;}
input.text, textarea, select {
	background: #FCFCFC;
	border: 1px inset #AAA;
	margin: 0.5em 0;
	padding: 4px 5px;
}
input.text:focus, textarea:focus, select:focus {background: #FFFFF5;}
input.button {
	background: #DDD;
	border: 1px outset #AAA;
	padding: 4px 5px;
}
input.button:active {border-style: inset;}

/* tables  */
table.vocab, th, td {
   border: 1px solid #888;
   border-collapse: collapse;
   vertical-align: middle;
   text-align: center;
   background-color: #fff;
}

/* tables  */
table, th, td {
   border: 0px solid #888;
   border-collapse: collapse;
   vertical-align: middle;
   text-align: left;
   background-color: #fff;
}
/* Images */

img.bordered,img.alignleft,img.alignright,img.aligncenter {
	background-color: #FFF;
	border: 1px solid #DDD;
	padding: 0px;
}
img.alignleft, img.left {margin: 0 1.5em 1em 0;}
img.alignright, img.right {margin: 0 0 1em 1.5em;}

.bookcover {
height: 50px;
border: 0px red solid;
}


.rightPic {
margin: 2% 0%;
border: 1px solid #DDD;
width: 100%;
float: left;
}



/* Floats */   

.left,.alignleft {float: left;}
.right,.alignright {float: right;}

.clear,.clearer {clear: both;}
.clearer {
	display: block;
	font-size: 0;
	line-height: 0;
	height: 0;
}




/*lists */

ul.lessonText {
list-style-position:outside;
font-size: inherit;	
font-family: inherit;
margin: 20px;	
padding: 0;
}





/* 
   SEPARATORS
------------------------------------------------------------------- */

.content-separator, .archive-separator, .book-separator{
	background: #E5E5E5;
	clear: both;
	color: #FFE;
	display: block;
	font-size: 0;
	line-height: 0;
	height: 1px;	
}
.content-separator {margin: 20px 0;}
.archive-separator {margin-bottom: 20px;}
.book-separator {margin: 0px;}

.sidebar-separator, .archive-separator {
	background: #999;
	clear: both;
	color: #999;
	display: block;
	font-size: 0;
	line-height: 0;
	height: 1px;	
}
.sidebar-separator {margin: 3px 0;}

.refsep {
	background: #FD6513;
	clear: both;
	color: #FFE;
	display: block;
	font-size: 0;
	line-height: 0;
	height: 2px;	
	margin-bottom: 20px;
}

.notesep {
	background: #3D5289;
	clear: both;
	color: #FFE;
	display: block;
	font-size: 0;
	line-height: 0;
	height: 3px;	
	margin-bottom: 20px;
}


.dotline
{
	width: 100%;
	color: black; 
	font-family: Helvetica, Arial, "Lucida Grande", sans-serif;
	font-size: 0.1em;
	text-decoration: none;
	border-top: dashed 1px #aaa;
}

.leftbox
{
	width: 85%;
	margin: 10px 10px 10px 0px;
	border: 1px solid #333;
	border-radius: 15px;
	padding: 10px 5px 10px 15px;
	background-color: #fff;	
}

.SectionBar {
padding: 0px; 
width: 98%; 
float: left; 
margin: 0px; 
border-top: 0px solid #666; 
background-color: #fff;
}


/*Index page worksheet / quiz boxes */
.indQuiz {
border: 1px dashed #888; 
padding: 3px; 
border-radius: 5px; 
margin: 0px 0px 8px 0px; 
background-color: #ECF4FD;
}

.indWorksheet {
border: 1px dashed #888; 
padding: 3px; 
border-radius: 5px; 
margin: 0px 0px 8px 0px; 
background-color: #FDFCF6;
}

.refWorksheet {
border: 1px dashed #888; 
padding: 5px; 
border-radius: 5px; 
margin: 0px 0px 8px 0px; 
background-color: #f8f8f8;
height: 75px;
overflow: hidden;
}




/* SOULOUT Worksheet boxes */
.worksheet {
border: 1px dashed #888;
border-radius: 15px;
padding: 8px;
background-color: #FDFCF6;
margin: 4px 0px 4px 0px;
vertical-align: middle;
}

/* Remote files linked by url... */
.worksheetx {
border: 2px dashed red;
border-radius: 15px;
padding: 8px;
background-color: #FCF1B7;
margin: 4px 0px 4px 0px;
vertical-align: middle;
}

/*Right column styled elements*/

.colHead1 {
	border: 0px #aaa solid; border-radius: 3px;  background-color: #333; padding: 8px; margin: 15px 0px 0px 0px;
}
.colBox1 {
background-color: #f4f4f4; padding: 8px; border: 0px; margin: 0px 0px 10px 0px; 	
}




/* buttons */
.download {
color: #fff; 
background-color: #2E4276;
font-size: 1.0em;
text-decoration: none;
line-height: 110%;	
border-radius: 10px; 
padding: 4px; 
}
.download:hover {
color: #fff; 
}
.download:visited {
color: #fff; 
}



/*General page layout ELTBase */


.mobileSpacer {
display: none;
}


 .frame {
        -ms-zoom: 0.83;
        -moz-transform: scale(0.83);
        -moz-transform-origin: 0 0;
        -o-transform: scale(0.83);
        -o-transform-origin: 0 0;
        -webkit-transform: scale(0.83);
        -webkit-transform-origin: 0 0;
		overflow: hidden;
		padding:0px;
		margin: 0px;
		border: 0px dashed orange;
    }



/* article page divs */


#lowerContainer {
border: 2px red dashed;  
padding: 0px; 
margin-left: 9px;
}


.articleExtra {
width: 70%;
border: 1px solid green;
float: right;
margin: 25px 0px 0px 20px;
padding: 0px;
}



.dictLink {
width: 450px; 
float: left; 
padding: 0px 5px 0px 5px; 
border: 0px blue solid; 
background-color: #fff; 
border-radius: 15px 15px 15px 15px; 
margin-bottom: 10px; 
font-size: 1.0em; 
height: 30px;
display: none;
}


/*Dictionary links*/
.dictHead1 {
width: 100%; 
background-color: #eee; 
height: 25px; 
padding: 9px 0px 3px 10px; 
border-radius: 10px;
}

.dictFrame1 {
width: 100%; 
float: left; 
border: 0px dashed blue; 
margin-top: 10px;
}

.dictHead2 {
width: 100%; 
float: left;
background-color: #f1f1f1; 
height: 25px; 
padding: 5px;
margin-top: 15px;
font-size: 0.9em;
}

.dictFrame2 {
width: 100%; 
float: left;
border: 1px solid #ddd; 
background-color: #fff;
border-radius: 5px;
margin-top: 5px;
font-size: 0.9em;
padding: 5px;
}

/*  Vocabulary display desktop*/
.vocab {
font-size: 1.15em; 
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal; 
color: #222;
}
.headword {
border-radius: 5px;
padding: 5px;
background-color: #f1f1f1;	
border: 0px;
width: 25%;
float: left;
height: 20px;
margin: 0px 5px 5px 0px;
display: block;
}

.headword2 {
border-radius: 5px;
padding: 5px;
background-color: #d9e8f8;	
border: 0px;
width: 25%;
float: left;
height: 20px;
margin: 0px 5px 5px 0px;
display: block;
}


.pos {
border-radius: 10px;
padding: 5px;
background-color: #fff;	
border: 0px;
width: 14%;
float: left;
height: 20px;
margin-bottom: 5px;
text-align: center;
font-size: 0.8em;
}

.mac {
border-radius: 5px;
padding: 5px;
background-color: #aaa;	
border: 0px;
width: 18%;
float: left;
height: 20px;
margin: 0px 5px 5px 0px;
text-align: center;
vertical-align: middle;
font-size: 0.9em;
}

.cam {
border-radius: 5px;
padding: 5px;
background-color: #ddd;	
border: 0px;
width: 18%;
float: left;
height: 20px;
margin: 0px 5px 5px 0px;
text-align: center;
vertical-align: middle;
font-size: 0.9em;
}

.blank {
background-color: #fff;	
width: 18%;
padding: 5px;
margin: 0px 5px 5px 0px;
height: 20px;
float: left;
}



/*WHERE DOES THIS GO? SOUL?*/
.vocabDisplay 
{
border: 0px solid orange; 
border-radius: 15px; 
float: right; 
padding: 0px 0px 0px 0px;  
width: 300px; 
vertical-align: top; 
text-align:left;
display: none;
}


.vocset {
border-radius: 5px;
padding: 5px;
background-color: #e8e8e8;	
border: 0px;
width: 40%;
float: left;
/*height: 20px;*/
margin: 0px 5px 5px 0px;
display: block;	
	
}

#resourceBar {
font-size: 1.2em;  
font-family:  Helvetica,  Arial, "Lucida Grande", sans-serif;
margin: 0px 0px 0px 0px; 
border: 0px #061E5C solid; 
border-radius: 3px; 
padding: 2px 7px 7px 0px;
background: #fff;
}

.refSection  {
margin-top: 25px; 
border-radius: 3px ; 
padding: 4px 8px 4px 8px;  
float: left; 
background-color: #2E4276;
font-size: 1.2em;
}

.refSectionBar {
padding: 0px; 
width: 98%; 
margin: 0px;  
border-top: 2px solid #fff;
background-color: #fff;
}

.BreadCrumbBlue {
float: left;  
margin: 0px 10px 0px 0px; 
border: 0px red solid; 
border-radius: 5px; 
background-color: #2E4276; 
padding: 0px 5px 0px 5px;
}

.BreadCrumbOrange {
float: left;  
margin: 0px 0px 0px 0px; 
border: 0px red solid; 
border-radius: 5px; 
background-color: #de780a; 
padding: 0px 5px 0px 5px;
}

.noteBlock {
border: 0px red dashed;
}


.picTag {
border: 1px solid #888;
border-radius: 3px;
background-color: #ddd;
padding: 2px;
font-family: arial;
margin: 10px 10px 0px 0px;
float: left;		
}

/* ALERT BOXES */

.warnbox  {
width: 98%;
font-size: 1.4em;
margin-top: 50px;
margin-bottom: 50px;
padding: 15px;
border: 5px solid red;
border-radius: 15px;
}

.confirmbox  {
width: 98%;
font-size: 1.4em;
margin-top: 50px;
margin-bottom: 50px;
padding: 15px;
border: 5px solid #71FA02;
border-radius: 15px;
}


.quizFrame {
border: 0px;
overflow:hidden;
}

/* END OF GENERAL STYLES */












/* DESKTOP STYLES START - size changed 1200px 01 JAN 2018*/
@media screen and (min-width: 1200px) {
	
.NoMobileDisplay {
display: block;	
}	
	

.addthis_inline_share_toolbox_2mga {
margin: 20px 0px 50px 0px;
float:right;

}


/* Headings */

h1 {font-size: 2.7em;  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal; margin: 0px 0px 20px 0px; color: #222; line-height: 110%;}
h2 {font-size: 1.9em; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal;margin: 0px 0px 20px 0px; color: #222; line-height: 110%;}
h3 {font-size: 1.5em; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal; color: #222;}
h4 {font-size: 1.4em; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal; color: #222;}
h5 {font-size: 1.3em; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal; color: #222;}
h6 {font-size: 1.2em; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal; color: #222;}
h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {margin: 0;}




.miniHead {
	font-size: 1.3em; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal; color: #222;
}



/* MAIN LAYOUT */
/* !FIXED PAGE WIDTHS! The following elements need to be the same width:
#site-wrapper
#innerHeader
#lowerHeader
#lowerNav
#pageTop
*/

#site-wrapper {
	margin:  auto;
	width: 1152px;
	background-color: #fff;
	padding: 0px;
	border: 0px red solid;	
}


/* Wrapper for framed pages*/
#frame-wrapper {
	margin: 0px;
	width: 100%;
	background-color: #ffffff;
	padding: 0px;
}

/* HEADER STYLES */

/* Header i.e. full-width blue block */
#upperHeader {
margin: 0px;
width: 100%;
height: 60px;
background-color: #212F53;
border: 0px yellow dashed;
padding: 3px;
}

/* div within blue block to centre nav elements inline with site wrapper */
#innerHeader {
width: 1152px;
margin: auto; 
border: 0px orange dashed;
padding: 0px;
}


#lowerHeader {
margin: auto;
padding: 0px;
width: 1152px;
height: 30px;
background-color: #f4f4f4;
border: 0px green dashed;
}



/* Logo */

#logoImg {
	height: 40px; 
	margin: 10px 0px 5px 0px;	
	border: 0px red dashed;
	float: left;
}

#logoImgM {
	display: none;
}


#blueBar {
display: none;
}


/* Special lists */

ul.plain-list li, ul.nice-list li, ul.tabbed li {list-style: none;}

ul.tabbed {
	display: inline;
	margin: 0;
	font-size: 1.1em;
}
ul.tabbed li {float: left;}






/* DESKTOP-SPECIFIC NAVIGATION */





/* COURSE BOOK GROUP */

.contentsHead {
padding: 2px; 
border: 0px #888 solid; 
background-color: #dedede; 
border-radius: 3px; 
margin: 0px 0px 10px 0px;
}



#tog1 {
display: none;
}


#topNav 
/* use right margin to center this element */
{
font-family: Helvetica, Arial, "Lucida Grande", sans-serif;
display: block;
float: left;
margin: 22px 0px 0px 40px; 
border: 0px red dashed;
}

#topNav a {
	color: #fff;
	padding: 3px 20px 3px 20px;
	font-weight: bold;	
}

.endtab  {
color: #fff;
	padding: 3px 20px 3px 20px;
	font-weight: bold;
	border-right: 0px solid #aaa;	
}

#topNav li.current-tab a {
	text-decoration: underline;
	color: #fff;
	font-weight: bold;
}

#topNav a:hover {
color: #fff;
font-weight: bold;
text-decoration: underline;
}

#lowerNav {
background: #f4f4f4;
padding: 2px 0px 0px 0px; 
height: 27px;
margin: auto;
font-family: Helvetica,  Arial, "Lucida Grande", sans-serif;
font-weight: 600;
font-size:  1.0em;
border: 0px purple dashed;
width: 1152px;

}

#lowerNav a {
text-decoration: none; color: #333;
}
#lowerNav li {margin: 0 1.2em;}
#lowerNav li.current-tab a 
{
text-decoration: underline;
}

#lowerNav a:hover {
text-decoration: underline;
}
#lowerNav a:visited {
	text-decoration: none;
}


/* Other top-of-page elements */

.gcse-search {
width: 450px;
height: 200px;
float: right; 
border: 1px red dashed; 
margin: 20px;
padding: 10px;
}

#gcse-search {
width: 450px;
float: right; 
border: 0px red dashed; 

margin: 0px 0px 0px 0px;
padding: 0px;
text-align: right;
}




#pageTop {
width: 1152px;
margin: auto; 
border: 0px dashed blue; 
padding: 0px;
}


/*
#search {
font-family: arial, helvetica; 
font-size: 12pt; 
font-weight: bold; 
height: 24px; 
padding: 2px; 
width: 230px;  
border: 1px #cccccc solid; 
background-color: #ffffff;  
vertical-align: bottom;
margin: 15px 0px 20px 0px; 
float: right;
}
*/
#submit {
background-color: #2E4276;
color: white; 
font-family:arial; 
font-weight: bold; 
padding: 3px; 
border: 0px white solid; 
width: 60px; 
height: 30px;
margin: 15px 0px 20px 0px; 
float: right;
}





/* STANDARD LAYOUT DIVS */
.topPanel {
width: 65%;  
margin: 0px 0px 0px 20px; 
border: 0px green dashed; 
float: left;
	
}
.fullWidthPage
{
width: 100%;
border: 0px green dashed;	
}

.mainLeft {
width: 66%;  
margin: 0px 0px 0px 0px; 
border: 0px green dashed; 
float: left;
}

.mainCenter {
width: 65%;  
margin: auto; 
border: 0px green dashed; 
}
.articleMain  {
width: 64%;  
margin: 0px 0px 0px 0px; 
border: 0px orange dashed; 
float: left;
}
.articleMainx  {
width: 100%;  
margin: 0px 0px 0px 0px; 
border: 0px orange dashed; 
float: left;
}


.rightCol {
width: 30%;
margin: 5px 0px 0px 19px; 
border: 0px orange dashed; 
float: right;
}

.rightColQuiz {
width: 30%;
margin: 5px 0px 0px 19px; 
border: 0px orange dashed; 
float: right;
}

.rightBox {
padding: 20px;
background-color: #e8e8e8;
font-size: 0.9em;
border: 0px purple dashed; 
margin: 10px 0px 20px 0px;
}

.featureBox {
width: 100%; 
margin-top: 10px;		
}

/*vtr_item.php styles */

.previewBoxTop {
margin-top: 20px; 
border: 0px green dashed; 
padding: 0px; 
float: left; 
width: 12%;	
}

.previewBoxBottom {
display: none;
}

.worksheetInstructions {
width: 90%; 
border: 1px solid #888; 
border-radius: 3px; 
padding: 5px 15px 7px 15px; 
margin: 20px 0px 20px 0px; 
background: #f8f8f8;
}





/* PAGE TOPS */

.artTop {
padding: 20px; 
background-color: #F3F8FD; 
border: 1px solid #afc6fa; 
border-radius: 5px; 
margin: 5px 0px 40px 0px;
}


/*orange and white */
.artTop2 {
padding: 20px; 
background-color: #E6F1FC;
background-color: #E6F1FC;
border-left: 4px #212F53 solid;
border-radius: 3px; 
margin: 5px 0px 30px 0px;
font-size: 1.0em;
}

.artTop3 {
padding: 0px 0px 0px 0px; 
background-color: #fff; 
border-bottom: 0px solid #bbb;
border-radius: 0px; 
margin: 5px 0px 30px 0px;
font-size: 1.0em;
}



/* LANDING PAGE LIST STYLES*/


.listColStd {
width: 29%; 
float: left; 
border: 0px dashed green; 
margin-right: 40px;	
}

.listColRt  {
width: 29%; 
float: left; 
border: 0px dashed green; 
margin-right: 0px;	
}


.headbox {
border: 0px solid #ccc; 
margin: 20px 0px 10px 0px;
border-radius: 0px 0px 5px 5px;
background-color: #f4f4f4;
padding: 0px;
}

.headboxWk {
border: 0px solid #ccc; 
margin: 10px 0px 10px 0px;
border-radius: 0px 0px 5px 5px;
background-color: #fff;
padding: 0px;
}

.headPoint {
background-color: #ccc; 
border-radius: 3px 3px 3px 3px;
border-top: 0px solid #ccc; 
margin-bottom: 0.5em;
padding: 5px 7px 5px 7px;
font-size: 1.1em;
font-weight: 600;
}

.subPoint {
padding: 1px 1px 1px 7px; 
border-radius: 5px; 
margin-bottom: 0.3em;

font-size: 1.0em;
font-weight: 500;
}

.listPoint {
background-color: #eee;
padding: 3px 3px 3px 7px; 
border-radius: 5px; 
margin-bottom: 0.5em;
border: 0px solid #445fa5;
line-height: 150%;
font-weight: bold;
font-size: 1.0em;
}


.listNum {
	float: right; 
	margin-right: 30%; 
	width: 30px; 
	border-radius: 10px; 
	padding: 7px; 
	text-align: center; 
	background-color: #FAFAD6;
}




/* QUIZ LANDING PAGE STYLES */

#quizLeft {
float: left; 
border: 0px solid #888; 
padding-top: 15px; 
width: 46%; 
margin: 15px 0px 15px 0px; 
background-color: #fff;
}

.quizRight {
float: right; 
border: 0px solid #888; 
padding-top: 15px; 
width: 46%; 
margin: 15px 0px 15px 0px; 
background-color: #fff;
}

/* NOTES PAGES STYLES

/* Landing  page list (selector.php) */



.noteListL {
width: 45%; 
float: left; 
border: 0px dashed purple; 
margin-right: 40px;
}

.noteListR {
width: 45%; 
float: right; 
border: 0px dashed purple; 
margin-right: 20px;
}

.noteSpace {
height: 8px;
}

/* INDEX PAGE STYLES */

.featureContentL  {
height: 80px; 
float: left; 
width: 320px; 
background-color: #f4f4f4; 
padding: 5px 0px 0px 10px; 
margin: 0px 55px 0px 0px; 
line-height: 130%;
}
.featureContentR  {
height: 80px; 
float: left; 
width: 320px; 
background-color: #f4f4f4; 
padding: 5px 0px 0px 10px; 
margin: 0px 30px 0px 0px; 
line-height: 130%;
}

/*index page date+current resource numbers bar */
#dateInd {
	width: 15%; padding: 1px 0px 1px 5px; background-color: #eee; border-radius: 0px; font-size: 1.0em; border: 1px solid #888; float: left;
}
#quizInd {
	width: 12%; padding: 1px 0px 1px 5px; background-color: #fff; border-radius: 0px; font-size: 1.0em; border: 1px solid #888; float: left;
}
#quizNo {
	width: 6%; padding: 1px 0px 1px 5px; background-color: #333; border-radius: 0px; font-size: 1.0em; border: 1px solid #333; float: left; color: white;
}
#matInd  {
	width: 17%; padding: 1px 0px 1px 5px; background-color: #fff; border-radius: 0px; font-size: 1.0em; border: 1px solid #888; float: left;
}
#matNo  {
	width: 6%; padding: 1px 0px 1px 5px; background-color: #444; border-radius: 0px; font-size: 1.0em; border: 1px solid #444; float: left; color: white;
}

#indLeftBox {
width: 49%; 
border: 0px #888 solid; 
border-radius: 0px; 
padding: 0px; 
float: left; 
margin-right: 0px;
}

#indRightBox {
width: 49%; 
border: 0px #888 solid; 
border-radius: 0px; 
padding: 0px; 
float: right; 
margin-right: 0px;
}




/* VTR REFS STYLES*/
/*vtr refs TOC*/
#TOC {
width: 40%; 
border: 2px solid #bbb; 
border-radius: 3px; 
float: left; 
background-color: #fff; 
padding: 12px;
margin: 10px 20px 0px 0px;
}

#seeAlso {
width: 40%;
float: left;
background-color: #fff; 
border: 1px solid #bbb; 
border-radius: 3px; 
background-color: #fff; 
padding: 12px;
margin: 10px 0px 0px 0px;
}



.pagination {
border: 0px red solid;
float: right;	
}


/*Worksheet display divs*/
.matIcon {
	border: 0px dashed red; padding: 5px; width: 3%; vertical-align: top; float: left;
}
.matNote {
	border: 0px dashed blue; padding: 0% 1% 1% 1%; width: 77%; float: left;
}

.matDownload {
	border: 0px dashed green; padding: 0px; width: 15%; text-align: right; float: left;
}

/* External display (vtr_refs) */

.extLogo {
border: 0px dashed red; 
padding: 5px; 
width: 5%; 
float: left;
}
.extDescr {
border: 0px dashed blue; padding: 5px; width: 68%; vertical-align: top; float: left;	
}
.extProv {
border: 0px dashed green; padding: 5px;  width: 20%; text-align: right; float: left;	
}

.clearMob {
display: none;
}

.bookNav {
/*background: linear-gradient(#2E4276, #333);*/
background: #fff;
font-size: 1.0em;
font-weight: bold;
color: #333;
padding: 5px; 
width: 135px; 
height:60px;
float: left; 
margin: 0px 10px 30px 0px; 
border: 1px solid #2E4276; 
border-radius: 5px;
text-align: center;
line-height: 150%;
}


/* GRAMMAR NOTES

/*grammar notes TOC*/
#TOCnotes {
width: 53%; 
border: 2px solid #bbb; 
border-radius: 3px; 
float: left; 
background-color: #fff; 
padding: 12px;
margin: 10px 0px 0px 0px;
}

#seeAlsoNt{
width: 35%; 
border: 1px solid #bbb; 
border-radius: 3px; 
float: right; 
background-color: #fff; 
padding: 12px;
margin: 10px 25px 0px 0px;
}

#tlResource{
 
border: 0px solid #bbb; 
border-radius: 3px; 
float: right; 
background-color: #2E4276; 
padding: 2px 10px 2px 10px;
 
margin: 0px 10px 0px 10px; 
border: 0px;
}

.webNoteHead {
background-color: #2A4792; 
border: 1pt solid #2A4792;
border-radius: 3px;
font-family: "Myriad Pro", "PT Sans", sans-serif; 
color: #fff; 
font-size: 15pt; 
margin: 0px 0px 2px 0px; 
vertical-align: middle; 
padding: 10px 5px 5px 5px;
}

.noteHead1 {
background-color: #C8E7D3; 
border: 1pt solid #555;
font-family: 'PT Sans'; 
color: #000; 
font-size: 15pt; 
margin: 0mm 0mm 2mm 0mm; 
vertical-align: middle; 
padding: 1mm 1mm 0mm 1mm;	
}

.noteHead2 
{
background-color: #eee; 
border: 0;
font-family: 'PT Sans'; 
color: #000; 
font-size: 12pt; 
margin: 4mm 0mm 1mm 0mm; 
vertical-align: middle; 
padding: 2mm 1mm 1mm 1mm;	
}

.noteLeft {
width: 65%; 
float: left;	
}
.noteImgCont {
width: 30%; 
float: left;
margin-left: 5mm;	
}

.noteSpace {
height: 8px;
}

.notetable {
height: 45px;
padding: 2px;
font-size: 1.0em;
background-color: #f4f4f4;
margin: 0px 3px 4px 0px;
float: left;	
line-height: 1.2em;
}






/*LESSON PLAN PAGES STYLES*/

/* lesson plan text  box */
.masonryHeadL {
border: 1px solid #888; 
padding: 8px;  
border-radius: 5px; 
width: 42%; 
margin: 0px 75px 20px 0px; 
background-color: #fff;  
color: #444; 
float: left;
}

.masonryHeadR {
border: 1px solid #888; 
padding: 8px;  
border-radius: 5px; 
width: 42%; 
margin: 0px 5px 20px 0px; 
background-color: #fff;  
color: #444; 
float: left;
}



/*landing page masonry styles */
.masonry {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 5px;
	position: relative;
	width: 213px;
	overflow: hidden; /* Fix for firefox and IE 10-11  */
	box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.8);
	background: #f8f8f8;
	margin: 10px 75px 40px 0px;
	/* max-height: 320px; */
}

.masonry .thumb img {
	border-radius: 5px 5px 0px 0px;
	width: 213px;
}
.masonry.hentry {
	margin: 5px 0 30px 0px;
}
/* excerpt text in masonry box */
.masonry-text {
	padding: 0 20px;
	/* two lines below added - Alex 241216 */
	font-size: 12px;
	font-weight: bold;
	/* line-height: 120%;  - not working ?? - styled inline from excerpt text area on post edit page */
	margin: 17px 0 0 0;
	word-break: break-all;
}
.masonry-text .masonry-header {
	margin-bottom: 20px;
}
.masonry-header .masonry-title {
	font-size: 18px; /*not working??*/
	line-height: 120%; 
	margin: 17px 0 0 0;
	word-break: break-all;
}
.masonry-text .masonry-header .masonry-title a {
	color: #282724;
	word-break: break-all;
}

#masonryClearerD {
clear: both;	
}
#masonryClearerT {
display: none;	
}

/*LESSON PLANS - SINGLE LESSON */

.artsetTitle {
background-color: #212F53; 
margin-top: 30px; 
padding: 7px 7px 7px 75px; 
vertical-align: middle; 
border: 0px; 
border-radius: 5px 5px 0px 0px;		
}


.artsetContents {
border: 1px #ccc solid;  
padding: 35px 75px 15px 75px; 
margin-top: 0px; 
background-color: #f4f4f4;
}
.artsetConText {
padding: 0px; 
background: #f4f4f4; 
float: left; 
width: 75%; 
border: 0px green dashed;
}

/* LPAGE STYLES*/

.artsetNav1 {
border: 0px solid yellow; 
border-radius: 3px; 
padding: 10px 0px 10px 5px; 
margin: 0px 0px 10px 0px; 
font-size: 1.2em; 
background: #f1f1f1;	
}
.artsetNav2 {
display: none;
}


.readerHead
{font-family: Helvetica, Arial,  "Lucida Grande", sans-serif;
font-weight: 600; color: #000;}


.LessonLeft {
	border: 0px dashed purple; 
	width: 42%; 
	float: left;
	
}
.LessonRight {
	border: 0px dashed green; 
	width: 50%; 
	float: right; 
	margin: 50px 0px 0px 0px;	
}

.LessonIntro {
border: 0px dashed green; 
float: left; 
margin: 0px 0px 50px 0px;	
}

.LessonExtraBlock {
border: 0px dashed red; 
float: left; 
margin-bottom: 40px; 
width: 100%;	
}


/*ARTICLE PAGE STYLES*/

.artprintSwitch {
background-color:#C6081E; 
padding: 2px; 
width: 60px; 
border-radius: 3px; 
text-align: center;
margin: 0px 10px 10px 0px;
float: left;
}


#articleData1 {
border: 0px solid #bbb;
border-radius: 5px;
font-size: 0.9em;
margin: 27px 0px 0px 20px;
float: left;
padding: 0px;
}

#articleData2 {
display: none;
}

.artHead {
font-size: 2.8em; 
margin-top: 20px; 
float: left;
}

#titleSeparator {
display: none;
}

.Articlen {
border: 0px red dashed;
float: left;
padding: 0px;
font-family:  Tahoma;
font-size: 1.4em;
line-height: 160%;
background-color: #fff;
font-weight: 300;
color: #222;
margin: 0px 0px 20px 0px;
width: 100%;
-moz-column-count: 2;
-webkit-column-count: 2;
column-count: 2;
-webkit-column-gap: 40px; /* Chrome, Safari, Opera */
-moz-column-gap: 40px; /* Firefox */
column-gap: 40px;
}

.Article {
border: 0px red dashed;
float: left;
padding: 0px;
font-family:  Tahoma;
font-size: 1.4em;
line-height: 160%;
font-weight: 300;
color: #333;
margin: 0px 0px 20px 0px;
width: 100%;
}

.ArticleMob {
display: none;
}


.preRead {
border: 0px solid blue; 
border-radius: 3px; 
padding: 0px; 
float: left;
width: 47%;
margin: 10px 0px 0px 16px;
}

/* artprint exercise text style */
.ExText {
border: 1px blue dashed;
padding: 10px;
font-family: Georgia;
font-size: 12pt;
line-height: 160%;
font-weight: 500;
color: #222;
margin: 0px 0px 20px 0px;
width: 95%;
text-align: left;
/*page-break-inside: avoid;*/
}


.underArtLeftCol {
width: 49%; 
float: left;
border: 0px dashed purple; 
}
.underArtRightCol {
width: 49%; 
float: right;  
padding: 0px; 
border: 0px dashed green;
}

.underArtVocabBox {
border: 1px solid #c4c4c4;
border-radius: 3px; 
padding: 0px; 
float: left; 
width: 100%;  
margin: 0px 5px 60px 0px; 
background-color: #fefefe;
}

.underArtQuizBox {
border: 0px dashed green; 
float: left; 
margin-bottom: 10px; 
background-color: #fff; 
width: 100%; 
padding: 0px;
}


.artPictureMob
{ 
display: none;
}
.artPicture 
{ 
background-color: #fff;
border: 0px solid red; 
padding: 0px;
width: 550px; 
width: 570px; 
margin-left: auto;
margin-right: auto;
margin-bottom: 30px;
float: left;
}

.artMainPic
{
border: 1px solid #e4e4e4;
margin-bottom: 0px;
float: left;
width: 570px; 
}

.artSubPicFull {
width: 465px; 
margin: 15px 0px 0px 0px;
}
.artSubTextLeft {
width: 365px; 
margin: 5px 0px 0px 0px;
float: right;
}
.artSubPicLeft {
width: 170px; 
margin: 15px 0px 0px 0px;
float: left;
}
.artSubTextRight {
width: 368px; 
margin: 5px 0px 0px 0px;
float: left;
}
.artSubPicRight {
width: 140px; 
margin: 15px 0px 0px 0px;
float: right;
}
.artSubPicCenter {
display: block;
    margin-left: auto;
    margin-right: auto;
	margin-top: 0px;
	margin-bottom: 10px;
	border: 0px green dashed;
	line-height: 100%;
	}


.picCap {
font-family: helvetica;
font-size: 0.9em;
margin: 1px 0px 0px 5px;
float: left;
border: 0px solid green;


}

.picAtt {
font-family: helvetica;
font-size: 0.9em;
margin: 1px 5px 0px 0px;
float: right;
border: 0px solid blue;
}

.picCapBar{
margin: 0px;
background-color: #eee;
padding: 0px;
}


.artMainPicMob
{
display: none; 
}

#boxRelated1{
border: 0px solid orange;
float: right;
margin: 0px 0px 20px 0px;
width: 26.5%;
border-radius: 3px;
}

#boxRelated2{
display: none;
}

/*ARCHIVE PAGE STYLES */
.archiveWrap {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 3px;
	position: relative;
	width: 150px;
	overflow: hidden; /* Fix for firefox and IE 10-11  */
	box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.8);
	background: #f8f8f8;
	margin: 30px 35px 10px 0px; 
	float: left; 
}

.archivePic {
width: 150px; 
margin-bottom: 0px; 
border: 0px #dedede solid;	
border-radius: 3px 3px 0px 0px;
}
.archiveText {
padding: 5px; 
line-height: 140%;	
}





#sidebar .section-title {margin-bottom: 8px;}






/* Sections */
.section {margin-bottom: 24px;}
.section-title {
	background-color: #f8f8f8;
	border-top: 1px solid #777;
	color: #333333;
	border-bottom: 1px solid #777;
	font: bold 1.2em sans-serif;
	margin-bottom: 16px;
	padding: 7px 2px 6px;
}

.section-titlex {
	background-color: #F9F9F9;
	border-top: 2px solid #CCC;
	color: #555555;
	font: bold 1.2em sans-serif;
	margin-bottom: 16px;
	padding: 7px 2px 6px;
}

/* Footer */

#footer {
	border-top: 1px solid #DDD;
	color: #777;
	padding: 16px 0 4px;
}
#footer-left {width: 459px;}
#footer-right {
	width: 459px;
	text-align: right;
}
#footer p {margin-bottom: 0.4em;}
#footer .text-separator {
	padding: 0 3px;
	color: #BBB;
}
#footer a:hover {color: #000;}

/* 
   IE Fixes (zzz)
------------------------------------------------------------------- */

* html .navigation, * html #footer, * html #splash, * html .comment ul {height: 0.01%;}
* html #footer-left {width: 500px;}
.navigation, #splash, .comment ul {min-height: 0.01%;}

/* mycourse and myclass layout styles (remnants of arcsin template) */
.main {
margin: 0px 0;
border: 0px blue solid; 
}
.main#main-two-columns {background: url('img/main-two-columns.gif') repeat-y right top;}
.main#main-two-columns-left {background: url('img/main-two-columns-left.gif') repeat-y left top;}
.main#main-two-columns #main-content, .main#main-two-columns-left #main-content {width: 460px;}
#main-content-frame {width: 67%;}
#sidebar {width: 220px; background-color: #ffffff;}
#sidebar-frame {width:28%; background-color: #ffffff;}
.mainx#main-two-columns #main-content, .mainx#main-two-columns-left #main-content {width: 550px; margin-left: 10px; }

#courseHead {
background-color: #C4D4FA;
border: 1px solid #C4D4FA;
border-radius: 15px;
font-family: arial;
font-size: 1.1em;
font-weight: bold;
color: #000;
height: 35px;
padding: 10px;
margin-bottom: 30px;
}
#classHead {
background-color: #C7E7CB;
border: 1px solid #C7E7CB;
border-radius: 15px;
font-family: arial;
font-size: 1.1em;
font-weight: bold;
color: #000;
height: 35px;
padding: 10px;
}

/* 
   Imported from old classpage stylesheet
------------------------------------------------------------------- */
.tinygray
{
	color: #888888; 
	font-size: 0.80em	
}

.helphead
{
	padding-left: 5px;	
	padding-right: 5px;
	padding-top: 5px;
	padding-bottom:5px;
	border-top: solid 1px #000000;
	border-color: #02669A;
	background-color: #F3F8FD;
}



/* ALERT BOXES */

.confirmbox  {
width: 450px;
font-size: 1.4em;
margin-top: 50px;
margin-bottom: 50px;
padding: 15px;
border: 5px solid #71FA02;
border-radius: 15px;
}

.warnbox  {
width: 90%;
font-size: 1.4em;
margin-top: 50px;
margin-bottom: 50px;
padding: 15px;
border: 5px solid red;
border-radius: 15px;
}

.alert 
{
	font-family: courier new, courier, monotype;
	font-size: 1.0em;
	font-weight: bold;
	color: red;
	background-color: yellow;
	padding: 3px;
	margin-top: 5px;
	margin-bottom: 5px;
}

/* HP styles */


div.Titles{
  margin: 0px 0px 10px 0px;
	padding-top: 2.0em;
	text-align: left;
	color: #ffffff;
	width: 95%;
}

.ExerciseTitle{
	
	font-weight: bold;
	color: #000000;
	background-color: #ffffff;
	text-align: left;
	margin: 0px;
	width: 95%;
}

.ExerciseSubtitle{
	
	color: #000000;
	background-color: #ffffff;
	text-align: left;
	margin: 10px 0px 40px 0px;
}

div.StdDiv{
	margin-top: 5px;
	text-align: left;
	line-height: 160%;
	font-size: 120%;
	color: #000;
	padding: 5px 20px 20px 20px;
	padding: 2%;
	border: 1px solid #c4c4c4;
	border-radius: 3px;
	background-color: #fefefe;
	width: 90%;
	font-weight: 500;
}

#InstructionsDiv {
	font-size: 120%;
	color: #000;
	font-weight: 700;
	border: 0px #bbb solid;
	border-radius: 3px;
	padding: 0px;
	background-color: #fff;
	width: 90%;
	margin-top: 20px;
}

#MainDiv {
	width: 91%;
	border: 1px #ddd solid;
	margin-left: 0px;
}


input, textarea{
	font-family: Geneva,Arial,sans-serif;
	font-size: 120%;
}

select{
	font-size: 100%;
}
 
div.Feedback {
	background-color: #fff;
	left: 30%;
	top: 33%;
	width: 30%;
	z-index: 4;
	border: 4px solid #0D5CBA;
	border-radius: 5px;
	padding: 20px;
	text-align: center;
	position: absolute;
	font-size: 1.2em;	
	font-weight: 600;
	display: none;
}


div.ExerciseDiv{
	color: #000000;
	border: 0px blue dashed;
	
}

/* JQuiz styles */

div.QuestionNavigation{
	text-align: center;
	border: 0px blue dashed;
	width: 100%;
}

.QNum{
	margin: 0em 1em 0.5em 1em;
	font-weight: bold;
	vertical-align: middle;
}

textarea{
	font-family: Geneva,Arial,sans-serif;
}

.QuestionText{
	text-align: left;
	margin: 0px;
	font-size: 0.9em;
	font-weight: 700;
	border: 0px dashed red;
	width: 90%;
}

.Answer{
	font-size: 120%;
	letter-spacing: 0.1em;
	
}

.PartialAnswer{
	font-size: 120%;
	letter-spacing: 0.1em;	
	color: #000000;
}

.Highlight{
	color: #000000;
	background-color: #ffff00;
	font-weight: bold;
	font-size: 120%;
}

ol.QuizQuestions{
	text-align: left;
	list-style-type: none;
	border: 0px red solid;
	width: 100%;
	margin: 0px 0px 0px 15px;
	padding: 0px;
}

li.QuizQuestion{
	padding: 1em;
	border: 0px purple solid;
	
}

ol.MCAnswers{
	text-align: left;
	list-style-type: upper-alpha;
	padding: 1em;
	font-size: 0.9em;
	font-weight: 500;
	border: 0px dashed blue;
	width: 95%;
	margin-left: 0px;
	
	
}

ol.MCAnswers li{
	margin-bottom: 1em;
}

ol.MSelAnswers{
	text-align: left;
	list-style-type: lower-alpha;
	padding: 1em;
}

div.ShortAnswer{
	padding: 1em;
}



.FuncButton {
	text-align: center;
	border: 1px solid #888;
	border-radius: 3px;
	color: #000;
	background-color: #fff;
	padding: 3px 6px 3px 6px;
	
}


.FuncButtonUp {
	text-align: center;
	padding: 3px 6px 3px 6px;
	border: 1px solid #888;
	border-radius: 3px;
	color: #fff;
	background-color: #555;
	
}

.FuncButtonDown {
	text-align: center;
	padding: 3px 6px 3px 6px;
	border: 1px solid #888;
	border-radius: 3px;
	color: #fff;
	background-color: #555;
}



.sixtyEight {
 width: 100%; 
border: 0px red solid;
}

.resourcePanel {
float: right; 
width: 30%; 
border: 2px green solid; 
padding-top: 40px;
display:none;
}



/* JCloze styles */

.ClozeWordList{
	text-align: center;
	font-weight: bold;
}

div.ClozeBody{
	text-align: left;
	margin-top: 2em;
	margin-bottom: 2em;
	line-height: 2.5
}

span.GapSpan{
	font-weight: bold;
	
	
}

/* JCross styles */

table.CrosswordGrid{
	margin: auto auto 1em auto;
	border-collapse: collapse;
	padding: 0px;
	background-color: #000000;
}

table.CrosswordGrid tbody tr td{
	width: 1.5em;
	height: 1.5em;
	text-align: center;
	vertical-align: middle;
	font-size: 140%;
	padding: 1px;
	margin: 0px;
	border-style: solid;
	border-width: 1px;
	border-color: #000000;
	color: #000000;
}

table.CrosswordGrid span{
	color: #000000;
}

table.CrosswordGrid td.BlankCell{
	background-color: #000000;
	color: #000000;
}

table.CrosswordGrid td.LetterOnlyCell{
	text-align: center;
	vertical-align: middle;
	background-color: #ffffff;
	color: #000000;
	font-weight: bold;
}

table.CrosswordGrid td.NumLetterCell{
	text-align: left;
	vertical-align: top;
	background-color: #ffffff;
	color: #000000;
	padding: 1px;
	font-weight: bold;
}

.NumLetterCellText{
	cursor: pointer;
	color: #000000;
}

.GridNum{
	vertical-align: super;
	font-size: 66%;
	font-weight: bold;
	text-decoration: none;
	color: #000000;
}

.GridNum:hover, .GridNum:visited{
	color: #000000;
}

table#Clues{
	margin: auto;
	vertical-align: top;
}

table#Clues td{
	vertical-align: top;
}

table.ClueList{
  margin: auto;
}

td.ClueNum{
	text-align: right;
	font-weight: bold;
	vertical-align: top;
}

td.Clue{
	text-align: left;
}

div#ClueEntry{
	text-align: left;
	margin-bottom: 1em;
}


/* JMatch flashcard styles */
div.CardStyle {
	position: absolute;
	font-family: Geneva,Arial,sans-serif;
	font-size: 90%;
	padding: 5px;
	border-style: solid;
	border-width: 1px;
	border-radius: 5px;
	color: #000000;
	background-color: #EEF7FC;
	left: -50px;
	top: -50px;
	overflow: visible;
	width: 200px;
}


table.FlashcardTable{
	background-color: transparent;
	color: #000000;
	border-color: #000000;
	margin-left: 5%;
	margin-right: 5%;
	margin-top: 2em;
	margin-bottom: 2em;
	width: 90%;
	position: relative;
	text-align: center;
	padding: 0px;
	
}

table.FlashcardTable tr{
	border-style: none;
	margin: 0px;
	padding: 0px;
	background-color: #FFFFFF;
}

table.FlashcardTable td.Showing{
	font-size: 140%;
	text-align: center;
	width: 50%;
	display: table-cell;
	padding: 2em;
	margin: 0px;
	border-style: solid;
	border-width: 1px;
	color: #000000;
	background-color: #FFFFFF;
}

table.FlashcardTable td.Hidden{
	display: none;
}


/* JMix styles */
div#SegmentDiv{
	margin-top: 2em;
	margin-bottom: 2em;
	text-align: center;
	
}

a.ExSegment{
	font-size: 120%;
	font-weight: bold;
	text-decoration: none;
	color: #000000;
	
}

span.RemainingWordList{
	font-style: italic;
}

div.DropLine {
	position: absolute;
	text-align: center;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #000000;
	width: 70%;
	margin-left: 5%;
	margin-right: 5%;
	margin-bottom: 50px;
}




.quizFooter{
width: 96%; 
margin: auto;	
}

/*ADAPEX DIVS */
.Adapex-desktop {
display: block;
}
.Adapex-left {
float: left; 
}
.Adapex-right {
float: right; 
}
.Adapex-mob {
display: none;
}
}
/*  END OF DESKTOP STYLES */









/*  TABLET STYLES START */
/* OLD: changed 12-17 - @media all and (min-width : 900px) and (max-width : 1200px) { */
@media screen and (min-width : 800px) and (max-width : 1199px) {	

.NoMobileDisplay {
display: block;	
}


.addthis_inline_share_toolbox_2mga {
width: 50%; 
margin: 20px 0px 0px 0px;
float: right;
}	
	
	
	
/* Headings */

h1 {font-size: 2.4em;  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal; margin: 0px 0px 20px 0px; color: #222; line-height: 110%;}
h2 {font-size: 1.9em; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal;margin: 0px 0px 20px 0px; color: #222; line-height: 110%;}
h3 {font-size: 1.5em; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal; color: #222;}
h4 {font-size: 1.4em; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal; color: #222;}
h5 {font-size: 1.3em; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal; color: #222;}
h6 {font-size: 1.2em; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal; color: #222;}	
	
	
	
#site-wrapper {
margin:  auto;
width: 94%;
background-color: #ffffff;
padding: 20px;
border: 0px red solid;	
}
	


#upperHeader {
margin: 0px;
padding: 0px;
width: 100%;
background-color: #212F53;
border: 0px yellow dashed;
}

#innerHeader {
width: 96%;
margin: auto; 
border: 0px green dashed;
padding: 0px;

}


#lowerHeader {
margin: 0px 0px 0px 0px;
padding: 0px;
width: 100%;
height: 30px;
background-color: #f4f4f4;
border: 0px green dashed;
}


#logoImg {
	height: 40px; 
	margin: 10px 10px 10px 10px;	
	border: 0px red dashed;
	float: left;
}
#logoImgM {
	display: none
}

#blueBar {
display: none;
}

ul.plain-list li, ul.nice-list li, ul.tabbed li {list-style: none;}

ul.tabbed {
	display: inline;
	margin: 0;
	font-size: 1.1em;
}
ul.tabbed li {float: left;}

#tog1 {
display: none;
}


#topNav 

{
font-family:  "Lucida Grande", "DejaVu Sans", "Bitstream Vera Sans", Verdana, sans-serif;
display: block;
float: left;
margin: 22px 0px 0px 20px; 
border: 0px red dashed;
}

#topNav a {
	color: #fff;
	padding: 3px 10px 3px 10px;
	font-weight: bold;
	border-right: 1px solid #bbb;	
}

.endtab  {
color: #fff;
	padding: 3px 20px 3px 20px;
	font-weight: bold;
	border-right: 0px solid #aaa;	
}

#topNav li.current-tab a {
	text-decoration: underline;
	color: #fff;
	font-weight: bold;
}

#topNav a:hover {
color: #fff;
font-weight: bold;
text-decoration: underline;
}



#lowerNav {
background: #f4f4f4;
padding: 2px 0px 0px 0px; 
height: 27px;
margin: 0px 0px 0px 20px;
font-family:  "Lucida Grande", "DejaVu Sans", "Bitstream Vera Sans", Verdana, sans-serif;
font-weight: 600;
font-size:  1.0em;
border: 0px blue dashed;

}

#lowerNav a {
text-decoration: none; color: #333;
}
#lowerNav li {margin: 0 0.8em;}
#lowerNav li.current-tab a 
{
text-decoration: underline;
}

#lowerNav a:hover {
text-decoration: underline;
}
#lowerNav a:visited {
	text-decoration: none;
}

#gcse-search {
margin: auto;
float: right;
width: 60%;
}

#pageTop {
width: 94%;
margin: auto; 
border: 0px dashed blue; 
padding: 0px;
}


/* STANDARD LAYOUT DIVS */
.topPanel {
width: 65%;  
margin: 0px 0px 0px 20px; 
border: 0px green dashed; 
float: left;
	
}
.fullWidthPage
{
width: 100%;
border: 0px green dashed;	
}

.mainLeft {
width: 67%;  
margin: 0px 0px 0px 0px; 
border: 0px green dashed; 
float: left;
}

.mainCenter {
width: 65%;  
margin: auto; 
border: 0px green dashed; 

}

.rightCol {
width: 30%;
margin: 5px 0px 0px 19px; 
border: 0px orange dashed; 
float: right;
}

.rightColQuiz {
width: 30%;
margin: 5px 0px 0px 19px; 
border: 0px orange dashed; 
float: right;
}


.rightBox {
padding: 15px;
background-color: #e8e8e8;
font-size: 0.9em;
border: 0px purple dashed; 
}

.featureBox {
width: 100%; 
margin-top: 10px		
}


/*Below used for vtr_item.php previews only and causes the preview icon to appear top left for desktop and tablet, and bottom right for mobile*/
.previewBoxTop {
margin-top: 20px; 
border: 0px green dashed; 
padding: 0px 8px 8px 8px; 
float: left; 
width: 15%;	
}

.previewBoxBottom {
display: none;
}

.worksheetInstructions {
width: 70%; 
border: 1px solid #888; 
border-radius: 3px; 
padding: 5px 15px 7px 15px; 
margin: 20px 0px 20px 0px; 
background: #f8f8f8;
}




/* PAGE TOPS */

.artTop {
padding: 20px; 
background-color: #F3F8FD; 
border: 1px solid #afc6fa; 
border-radius: 5px; 
margin: 5px 0px 40px 0px;
}


/*orange and white */
.artTop2 {
padding: 20px; 
background-color: #E6F1FC;
background-color: #E6F1FC;
border-left: 4px #212F53 solid;
border-radius: 3px; 
margin: 5px 0px 30px 0px;
font-size: 1.0em;
}

.artTop3 {
padding: 0px 0px 0px 0px; 
background-color: #fff; 
border-bottom: 0px solid #bbb;
border-radius: 0px; 
margin: 5px 0px 30px 0px;
font-size: 1.0em;
}









/* LANDING PAGE LIST STYLES*/

.listColStd {
width: 31%; 
float: left; 
border: 0px dashed green; 
margin-right: 3%;	
}

.listColRt  {
width: 31%; 
float: left; 
border: 0px dashed blue; 
margin-right: 0px;	
}


.headbox {
border: 0px solid #ccc; 
margin: 20px 0px 10px 0px;
border-radius: 0px 0px 5px 5px;
background-color: #f4f4f4;
padding: 0px;
}

.headboxWk {
border: 0px solid #ccc; 
margin: 10px 0px 10px 0px;
border-radius: 0px 0px 5px 5px;
background-color: #fff;
padding: 0px;
}

.headPoint {
background-color: #ccc; 
border-radius: 0px 0px 3px 3px; 
border-top: 1px solid #aaa; 
margin-bottom: 0.5em;
padding: 5px 7px 5px 7px;
font-size: 1.1em;
font-weight: 600;
}

.subPoint {
padding: 1px 1px 1px 7px; 
border-radius: 5px; 
margin-bottom: 0.3em;

font-size: 1.0em;
font-weight: 500;
}

.listPoint {
background-color: #eee;
padding: 3px 3px 3px 7px; 
border-radius: 5px; 
margin-bottom: 0.5em;
border: 0px solid #445fa5;
line-height: 150%;
font-weight: bold;
font-size: 1.0em;
}


.listNum {
float: right; 
margin-right: 30%; 
width: 30px; 
border-radius: 10px; 
padding: 7px; 
text-align: center; 
background-color: #FAFAD6;
}

/*  GRAMMAR NOTES STYLES */

/* Landing  page list (selector.php) */

.noteListL {
width: 43%; 
float: left; 
border: 0px dashed purple; 
margin-right: 40px;
}

.noteListR {
width: 43%; 
float: right; 
border: 0px dashed purple; 
margin-right: 10px;
}

.noteLeft {
width: 65%; 
float: left;	
}
.noteImgCont {
width: 30%; 
float: left;
margin-left: 5mm;	
}


.noteSpace {
height: 8px;
}

.webNoteHead {
background-color: #2A4792; 
border: 1pt solid #2A4792;
border-radius: 3px;
font-family: "PT Sans", sans-serif; 
color: #fff; 
font-size: 15pt; 
margin: 0px 0px 2px 0px; 
vertical-align: middle; 
padding: 10px 5px 5px 5px;
}



.noteHead1 {
background-color: #C8E7D3; 
border: 1pt solid #555;
font-family: 'PT Sans'; 
color: #000; 
font-size: 15pt; 
margin: 0mm 0mm 2mm 0mm; 
vertical-align: middle; 
padding: 1mm 1mm 0mm 1mm;	
/*display: inline-block;*/
}
.noteHead2 
{
background-color: #eee; 
border: 0;
font-family: 'PT Sans'; 
color: #000; 
font-size: 12pt; 
margin: 4mm 0mm 1mm 0mm; 
vertical-align: middle; 
padding: 2mm 1mm 1mm 1mm;	
/*display: inline-block;*/
}








/*grammar notes TOC*/
#TOCnotes {
width: 50%; 
border: 2px solid #bbb; 
border-radius: 3px; 
float: left; 
background-color: #fff; 
padding: 12px;
margin: 10px 0px 0px 0px;
}

#seeAlsoNt{
width: 33%; 
border: 1px solid #bbb; 
border-radius: 3px; 
float: right; 
background-color: #fff; 
padding: 12px;
margin: 10px 5px 0px 0px;
}

#tlResource{
 
border: 0px solid #bbb; 
border-radius: 3px; 
float: right; 
background-color: #2E4276; 
padding: 2px 10px 2px 10px;
 
margin: 0px 10px 0px 10px; 
border: 0px;
}



/* INDEX PAGE STYLES */
.featureContentL  {
height: 80px; 
float: left; 
width: 42%; 
background-color: #f4f4f4; 
padding: 5px 0px 0px 10px; 
margin: 0px; 
line-height: 130%;
}
.featureContentR  {
height: 80px; 
float: left; 
width: 42%; 
background-color: #f4f4f4; 
padding: 5px 0px 0px 10px; 
margin: 0px 0px 0px 40px; 
line-height: 130%;
}

/* VTR REFS STYLES */
#TOC {
width: 40%; 
border: 2px solid #bbb; 
border-radius: 3px; 
float: left; 
background-color: #fff; 
padding: 12px;
margin: 10px 20px 0px 0px;
}

#seeAlso {
float: left;
background-color: #fff; 
border: 1px solid #bbb; 
border-radius: 3px; 
background-color: #fff; 
padding: 12px;
margin: 10px 0px 0px 0px;
}

/* External display (vtr_refs) */

.extLogo {
border: 0px dashed red; 
padding: 5px; 
width: 5%; 
float: left;
}
.extDescr {
border: 0px dashed blue; padding: 5px; width: 68%; vertical-align: top; float: left;	
}
.extProv {
border: 0px dashed green; padding: 5px;  width: 20%; text-align: right; float: left;	
}

.clearMob {
display: none;
}

.bookNav {
/*background: linear-gradient(#2E4276, #333);*/
background: #fff;
font-size: 1.0em;
font-weight: bold;
color: #333;
padding: 5px; 
width: 135px; 
height:60px;
float: left; 
margin: 0px 10px 30px 0px; 
border: 1px solid #2E4276; 
border-radius: 5px;
text-align: center;
line-height: 150%;
}




/* LESSON PLANS STYLES */

/* landing page text  box */


.masonryHeadL {
border: 1px solid #888; 
padding: 8px;  
border-radius: 5px; 
width: 42%; 
margin: 0px 75px 20px 0px; 
background-color: #fff;  
color: #444; 
float: left;
}

.masonryHeadR {
border: 1px solid #888; 
padding: 8px;  
border-radius: 5px; 
width: 42%; 
margin: 0px 5px 20px 0px; 
background-color: #fff;  
color: #444; 
float: left;
}



/*landing page masonry styles */
.masonry {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 5px;
	position: relative;
	width: 213px;
	overflow: hidden; /* Fix for firefox and IE 10-11  */
	box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.8);
	background: #f8f8f8;
	margin: 10px 75px 40px 0px;
}

.masonry .thumb img {
	border-radius: 5px 5px 0px 0px;
	width: 213px;
}
.masonry.hentry {
	margin: 5px 0 30px 0px;
}
/* excerpt text in masonry box */
.masonry-text {
	padding: 0 20px;
	/* two lines below added - Alex 241216 */
	font-size: 12px;
	font-weight: bold;
	/* line-height: 120%;  - not working ?? - styled inline from excerpt text area on post edit page */
	margin: 17px 0 0 0;
	word-break: break-all;
}
.masonry-text .masonry-header {
	margin-bottom: 20px;
}
.masonry-header .masonry-title {
	font-size: 18px; /*not working??*/
	line-height: 120%; 
	margin: 17px 0 0 0;
	word-break: break-all;
}
.masonry-text .masonry-header .masonry-title a {
	color: #282724;
	word-break: break-all;
}

#masonryClearerD {
display: none;	
}
#masonryClearerT {
clear: both;
}

/* LESSON PAGE STYLES */

/*LESSON PLANS - SINGLE LESSON */

.artsetTitle {
background-color: #212F53; 
margin-top: 30px; 
padding: 7px 7px 7px 75px; 
vertical-align: middle; 
border: 0px; 
border-radius: 5px 5px 0px 0px;		
}

.artsetContents {
border: 1px #ccc solid;  
padding: 35px 75px 15px 75px; 
margin-top: 0px; 
background-color: #f4f4f4;
}
.artsetConText {
padding: 0px; 
background: #f4f4f4; 
float: left; 
width: 75%; 
border: 0px green dashed;
}

/* LPAGE STYLES*/


.artsetNav1 {
border: 0px solid yellow; 
border-radius: 3px; 
padding: 10px 0px 10px 5px; 
margin: 0px 0px 10px 0px; 
font-size: 1.2em; 
background: #f1f1f1;	
}
.artsetNav2 {
display: none;
}


.LessonLeft {
	border: 0px dashed purple; 
	width: 90%; 
	padding: 0px;
}
.LessonRight {
	border: 0px dashed green; 
	width: 90%; 
	padding: 0px
}
.LessonIntro {
border: 0px dashed green; 
width: 70%;
margin: 0px 0px 50px 0px;	
}

.LessonExtraBlock {
border: 0px dashed red; 
margin-bottom: 40px; 
width: 70%;	
}


/*ARTICLE PAGE STYLES */

#articleData2 {
border: 0px solid red;
border-radius: 5px;
font-size: 0.9em;
margin: 0px 0px 10px 0px;
text-align: center;
}

#articleData1 {
display: none;
}

.artHead {
font-size: 2.8em; 
margin-top: 20px; 
float: left;
}

#titleSeparator {
display: none;
}

.Articlen {
border: 0px red dashed;
float: left;
padding: 0px;
font-family:  Tahoma;
font-size: 1.4em;
line-height: 160%;
background-color: #fff;
font-weight: 300;
color: #222;
margin: 0px 0px 20px 0px;
width: 100%;
-moz-column-count: 2;
-webkit-column-count: 2;
column-count: 2;
-webkit-column-gap: 40px; /* Chrome, Safari, Opera */
-moz-column-gap: 40px; /* Firefox */
column-gap: 40px;
}

.Article {
border: 0px green dashed;
float: left;
padding: 0px;
font-family:  Tahoma;
font-size: 1.4em;
line-height: 160%;
font-weight: 300;
color: #333;
margin: 0px 0px 20px 0px;
width: 100%;
}
.ArticleMob {
display: none;
}

.preRead {
border: 0px solid red; 
border-radius: 3px; 
padding: 0px; 
float: left;  
width: 47%; 
margin: 0% 0.5% 0% 2.5%;
}

.vocabBox {
border: 1px solid #ddd; 
border-radius: 3px; 
padding: 0px; 
float: left; 
width: 95%;  
margin: 0px 5px 30px 0px; 
background-color: #fefefe;
}


.underArtLeftCol {
width: 100%; 
margin: 0px;
border: 0px dashed purple; 
}
.underArtRightCol {
width: 100%; 
margin: 0px;
padding: 0px; 
border: 0px dashed green;
}

.underArtVocabBox {
border: 1px solid #c4c4c4;
border-radius: 3px; 
padding: 0px; 
float: left; 
width: 100%;  
margin: 0px 5px 60px 0px; 
background-color: #fefefe;
}

.underArtQuizBox {
border: 0px dashed green; 
float: left; 
margin-bottom: 10px; 
background-color: #fff; 
width: 100%; 
padding: 0px;
}



.artPictureMob { 
background-color: #fff;
border: 0px solid red; 
padding: 0px;
width: 100%; 
margin-left: auto;
margin-right: auto;
margin-bottom: 30px;
display: none;
}

.artMainPicMob
{ 
display: none;
}


.artPicture 
{ 
background-color: #fff;
border: 0px solid red; 
padding: 0px;
width: 49%; 
margin-left: auto;
margin-right: auto;
margin-bottom: 30px;
float: left;
}

.artMainPic
{
border: 1px solid #e4e4e4;
margin-bottom: 0px;
float: left;
width: 100%; 
}

.artSubPicFull {
width: 100%;  
margin: 15px 0px 0px 0px;
}


.artSubTextLeft {
width: 100%; 
margin: 5px 0px 0px 0px;
float: right;

}
.artSubPicLeft {
width: 100%;  
margin: 15px 0px 0px 0px;
float: left;
}

.artSubTextRight {
width: 100%; 
margin: 5px 0px 0px 0px;
float: left;
}
.artSubPicRight {
width: 100%; 
margin: 15px 0px 0px 0px;
float: right;
}
.artSubPicCenter {
display: block;
    margin-left: auto;
    margin-right: auto;
	margin-top: 0px;
	margin-bottom: 10px;
	border: 0px green dashed;
	line-height: 100%;
	}


.picCap {
font-family: "Lucida Grande", "DejaVu Sans", "Bitstream Vera Sans", Verdana, sans-serif;
font-size: 1.0em;
margin: 1px 0px 3px 0px;
float: left;

}

.picAtt {
font-family: "Lucida Grande", "DejaVu Sans", "Bitstream Vera Sans", Verdana, sans-serif;
font-size: 1.0em;
margin: 1px 0px 3px 0px;
float: right;
}


#boxRelated1{
border: 0px solid orange;
float: right;
margin: 0px 0px 20px 0px;
width: 25.5%;
}

#boxRelated2{
display: none;
}

/*ARCHIVE PAGE STYLES */
.archiveWrap {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 3px;
	position: relative;
	width: 150px;
	overflow: hidden; /* Fix for firefox and IE 10-11  */
	box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.8);
	background: #f8f8f8;
	margin: 30px 35px 10px 0px; 
	float: left; 
}

.archivePic {
width: 150px; 
margin-bottom: 0px; 
border: 0px #dedede solid;	
border-radius: 3px 3px 0px 0px;
}
.archiveText {
padding: 5px; 
line-height: 140%;	
}



/* HP styles */

div.Titles{
  margin: 0px 0px 10px 0px;
	padding-top: 2.0em;
	text-align: left;
	color: #ffffff;
	width: 95%;
}

.ExerciseTitle{
	
	font-weight: bold;
	color: #000000;
	background-color: #ffffff;
	text-align: left;
	margin: 0px;
	width: 95%;
}

.ExerciseSubtitle{
	
	color: #000000;
	background-color: #ffffff;
	text-align: left;
	margin: 10px 0px 40px 0px;
}

div.StdDiv{
	margin-top: 5px;
	text-align: left;
	line-height: 160%;
	font-size: 120%;
	color: #000;
	padding: 5px 20px 20px 20px;
	padding: 2%;
	border: 1px solid #c4c4c4;
	border-radius: 3px;
	background-color: #fefefe;
	width: 90%;
	font-weight: 500;
}

#InstructionsDiv {
	font-size: 120%;
	color: #000;
	font-weight: 700;
	border: 0px #bbb solid;
	border-radius: 3px;
	padding: 0px;
	background-color: #fff;
	width: 90%;
	margin-top: 20px;
}

#MainDiv {
	width: 91%;
	border: 1px #ddd solid;
	margin-left: 0px;
}
/*
div.StdDivSm{
	background-color: #ffffff;
	margin: auto;
	text-align: left;
	line-height: 110%;
	font-size: 80%;
	color: #000000;
	padding: 3px;
	border-style: solid;
	border-width: 1px 1px 1px 1px;
	border-color: #000000; 
	margin-bottom: 1px;
}

div.StdDivSmx{
	background-color: #f8f8f8;
	margin: auto;
	text-align: left;
	line-height: 110%;
	font-size: 70%;
	color: #000000;
	padding: 5px;
	border-style: solid;
	border-width: 1px 1px 1px 1px;
	border-color: #000000; 
	margin-bottom: 1px;
}
*/


input, textarea{
	font-family: Geneva,Arial,sans-serif;
	font-size: 120%;
}

select{
	font-size: 100%;
}
 
div.Feedback {
	background-color: #fff;
	left: 30%;
	top: 33%;
	width: 30%;
	z-index: 4;
	border: 4px solid #0D5CBA;
	border-radius: 5px;
	padding: 20px;
	text-align: center;
	position: absolute;
	font-size: 1.2em;	
	font-weight: 600;
	display: none;
}


div.ExerciseDiv{
	color: #000000;
	border: 0px blue dashed;
	
}

/* JQuiz styles */

div.QuestionNavigation{
	text-align: center;
	border: 0px blue dashed;
	width: 100%;
}

.QNum{
	margin: 0em 1em 0.5em 1em;
	font-weight: bold;
	vertical-align: middle;
}

textarea{
	font-family: Geneva,Arial,sans-serif;
}

.QuestionText{
	text-align: left;
	margin: 0px;
	font-size: 0.9em;
	font-weight: 700;
	border: 0px dashed red;
	width: 90%;
}

.Answer{
	font-size: 120%;
	letter-spacing: 0.1em;
	
}

.PartialAnswer{
	font-size: 120%;
	letter-spacing: 0.1em;	
	color: #000000;
}

.Highlight{
	color: #000000;
	background-color: #ffff00;
	font-weight: bold;
	font-size: 120%;
}

ol.QuizQuestions{
	text-align: left;
	list-style-type: none;
	border: 0px red solid;
	width: 100%;
	margin: 0px 0px 0px 15px;
	padding: 0px;
}

li.QuizQuestion{
	padding: 1em;
	border: 0px purple solid;
	
}

ol.MCAnswers{
	text-align: left;
	list-style-type: upper-alpha;
	padding: 1em;
	font-size: 0.9em;
	font-weight: 500;
	border: 0px dashed blue;
	width: 95%;
	margin-left: 0px;
	
	
}

ol.MCAnswers li{
	margin-bottom: 1em;
}

ol.MSelAnswers{
	text-align: left;
	list-style-type: lower-alpha;
	padding: 1em;
}

div.ShortAnswer{
	padding: 1em;
}



.FuncButton {
	text-align: center;
	border: 1px solid #888;
	border-radius: 3px;
	color: #000;
	background-color: #fff;
	padding: 3px 6px 3px 6px;
	
}

/*
.FuncButtonx {
	text-align: center;
	 border: 0px solid #5176D6;
	border-radius: 5px;
	cursor: pointer;
	padding: 3px 6px 3px 6px;
	border-radius: 3px;
	color: #fff;
	background-color: #555;	
}

*/

.FuncButtonUp {
	text-align: center;
	padding: 3px 6px 3px 6px;
	border: 1px solid #888;
	border-radius: 3px;
	color: #fff;
	background-color: #555;
	
}

.FuncButtonDown {
	text-align: center;
	padding: 3px 6px 3px 6px;
	border: 1px solid #888;
	border-radius: 3px;
	color: #fff;
	background-color: #555;
}



.sixtyEight {
 width: 100%; 
border: 0px red solid;
}

.resourcePanel {
float: right; 
width: 30%; 
border: 2px green solid; 
padding-top: 40px;
display:none;
}



/* JCloze styles */

.ClozeWordList{
	text-align: center;
	font-weight: bold;
}

div.ClozeBody{
	text-align: left;
	margin-top: 2em;
	margin-bottom: 2em;
	line-height: 2.5
}

span.GapSpan{
	font-weight: bold;
	
	
}

/* JCross styles */

table.CrosswordGrid{
	margin: auto auto 1em auto;
	border-collapse: collapse;
	padding: 0px;
	background-color: #000000;
}

table.CrosswordGrid tbody tr td{
	width: 1.5em;
	height: 1.5em;
	text-align: center;
	vertical-align: middle;
	font-size: 140%;
	padding: 1px;
	margin: 0px;
	border-style: solid;
	border-width: 1px;
	border-color: #000000;
	color: #000000;
}

table.CrosswordGrid span{
	color: #000000;
}

table.CrosswordGrid td.BlankCell{
	background-color: #000000;
	color: #000000;
}

table.CrosswordGrid td.LetterOnlyCell{
	text-align: center;
	vertical-align: middle;
	background-color: #ffffff;
	color: #000000;
	font-weight: bold;
}

table.CrosswordGrid td.NumLetterCell{
	text-align: left;
	vertical-align: top;
	background-color: #ffffff;
	color: #000000;
	padding: 1px;
	font-weight: bold;
}

.NumLetterCellText{
	cursor: pointer;
	color: #000000;
}

.GridNum{
	vertical-align: super;
	font-size: 66%;
	font-weight: bold;
	text-decoration: none;
	color: #000000;
}

.GridNum:hover, .GridNum:visited{
	color: #000000;
}

table#Clues{
	margin: auto;
	vertical-align: top;
}

table#Clues td{
	vertical-align: top;
}

table.ClueList{
  margin: auto;
}

td.ClueNum{
	text-align: right;
	font-weight: bold;
	vertical-align: top;
}

td.Clue{
	text-align: left;
}

div#ClueEntry{
	text-align: left;
	margin-bottom: 1em;
}


/* JMatch flashcard styles */
div.CardStyle {
	position: absolute;
	font-family: Geneva,Arial,sans-serif;
	font-size: 90%;
	padding: 5px;
	border-style: solid;
	border-width: 1px;
	border-radius: 5px;
	color: #000000;
	background-color: #EEF7FC;
	left: -50px;
	top: -50px;
	overflow: visible;
	width: 200px;
}


table.FlashcardTable{
	background-color: transparent;
	color: #000000;
	border-color: #000000;
	margin-left: 5%;
	margin-right: 5%;
	margin-top: 2em;
	margin-bottom: 2em;
	width: 90%;
	position: relative;
	text-align: center;
	padding: 0px;
	
}

table.FlashcardTable tr{
	border-style: none;
	margin: 0px;
	padding: 0px;
	background-color: #FFFFFF;
}

table.FlashcardTable td.Showing{
	font-size: 140%;
	text-align: center;
	width: 50%;
	display: table-cell;
	padding: 2em;
	margin: 0px;
	border-style: solid;
	border-width: 1px;
	color: #000000;
	background-color: #FFFFFF;
}

table.FlashcardTable td.Hidden{
	display: none;
}


/* JMix styles */
div#SegmentDiv{
	margin-top: 2em;
	margin-bottom: 2em;
	text-align: center;
	
}

a.ExSegment{
	font-size: 120%;
	font-weight: bold;
	text-decoration: none;
	color: #000000;
	
}

span.RemainingWordList{
	font-style: italic;
}

div.DropLine {
	position: absolute;
	text-align: center;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #000000;
	width: 70%;
	margin-left: 5%;
	margin-right: 5%;
	margin-bottom: 50px;
}

.quizFooter{
width: 96%; 
margin: auto;	
}
/*ADAPEX DIVS */

/*ADAPEX DIVS */
.Adapex-desktop {
display: block;
}
.Adapex-left {
float: left; 
}
.Adapex-right {
float: right; 
}
.Adapex-mob {
display: none;
}


}

/*END OF TABLET STYLES*/










/* MOBILE STYLES START - New definition, 14 May 2017*/ 
@media screen and (max-width : 799px) {
.addthis_inline_share_toolbox_2mga {
display: none;
} 
.NoMobileDisplay {
display: none;	
}




/* Headings */

h1 {font-size: 1.8em;  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal; margin: 0px 0px 20px 0px; color: #333; line-height: 110%;}
h2 {font-size: 1.6em; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal;margin: 0px 0px 20px 0px; color: #222; line-height: 110%;}
h3 {font-size: 1.4em; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal; color: #222;}
h4 {font-size: 1.3em; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal; color: #222;}
h5 {font-size: 1.2em; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal; color: #333;}
h6 {font-size: 1.1em; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal; color: #222;}

h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {margin: 0;}

.miniHead {
	font-size: 1.2em; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
font-weight: normal; color: #222;
}


#site-wrapper {
	margin: 0px;
	width: 100%;
	background-color: #ffffff;
	padding: 0%;
}

/* Header */
#upperheader {
display: none;
}

#innerHeader {
display: none;
}

#lowerHeader {
display: none;
}



/* Logo */
#logo {	
border-right: 0px solid #DDD;
padding: 0px 20px 0px 0px;
margin-right: 20px;
}

#logoImgM {
	height:40px; 
	margin: 0px 0px 0px 5px;	
}

#logoImg {
	display: none
}



#slogan {
display: none;
}
#topNav {
display: none;
}
#login {
display: none;
}
#lowerNav {
display: none;
}
#blueBar {
height: 40px;
background: #212F53;
padding: 5px 10px 5px 5px;
}
/* Mobile navigation */



/* Other top-of-page elements */

#pageTop {
width: 96%; 
margin: auto; 
border: 0px dashed blue; 
padding: 2%;
}

#gcse-search {
margin: auto;
float: left;
width: 100%;
}


#submit {
background-color: #2E4276;
color: white; 
font-family:arial; 
font-weight: bold; 
padding: 3px; 
border: 0px white solid; 
border-radius: 10px;
width: 20%; 
height: 30px;
margin: 15px 0px 20px 0px; 
float: right;
}

#shareThis {
display: none;
}

.main {
margin: 0px 0;
border: 0px blue solid; 
}

/* Standard containers (mobile) */


.mainLeft {
width: 96%;  
margin-left: 0px; 
border: 0px red dashed; 
margin: auto;
}

.rightCol {
width: 96%;  
margin-right: 0px; 
border: 0px green dashed; 
margin:auto;
}
.rightColQuiz {
width: 96%;  
margin-right: 0px; 
border: 0px green dashed; 
margin:auto;
}

.featureBox {
display: none;	
}

/*Below used for vtr_item.php previews only and causes the preview icon to appear top left for desktop and tablet, and bottom right for mobile*/
.previewBoxBottom {
/*
margin: 0px 0px 0px 10px; 
border: 0px green dashed; 
padding: 0px; 
float: right; 
width: 15%;
*/	
display: none;
}

.previewBoxTop {
display: none;
}


.worksheetInstructions {
width: 100%; 
border: 1px solid #888; 
border-radius: 3px; 
padding: 5px 15px 7px 15px; 
margin: 20px 0px 20px 0px; 
background: #f8f8f8;
}



/* PAGE TOPS */

.artTop {
padding: 20px; 
background-color: #F3F8FD; 
border: 1px solid #afc6fa; 
border-radius: 5px; 
margin: 5px 0px 40px 0px;
}


/*orange and white */
.artTop2 {
padding: 20px; 
background-color: #E6F1FC;
background-color: #E6F1FC;
border-left: 4px #212F53 solid;
border-radius: 3px; 
margin: 5px 0px 30px 0px;
font-size: 1.0em;
}

.artTop3 {
padding: 0px 0px 0px 0px; 
background-color: #fff; 
border-bottom: 0px solid #bbb;
border-radius: 0px; 
margin: 5px 0px 30px 0px;
font-size: 1.0em;
}


/* LANDING PAGE LIST STYLES*/

.listColStd {

width: 96%;
float: left; 
border: 0px dashed green; 
margin-right: 0%;	
}

.listColRt  {
 
width: 96%;
float: left; 
border: 0px dashed blue; 
margin-right: 0px;	
margin-right: 0%;	
}


.headbox {
border: 0px solid #ccc; 
margin: 20px 0px 10px 0px;
border-radius: 0px 0px 5px 5px;
background-color: #f4f4f4;
padding: 0px;
}

.headboxWk {
border: 0px solid #ccc; 
margin: 10px 0px 10px 0px;
border-radius: 0px 0px 5px 5px;
background-color: #fff;
padding: 0px;
width: 96%;
}

.headPoint {
background-color: #ccc; 
border-radius: 0px 0px 3px 3px; 
border-top: 1px solid #aaa; 
margin-bottom: 0.5em;
padding: 5px 7px 5px 7px;
font-size: 1.1em;
font-weight: 600;
width: 96%;
}

.subPoint {
padding: 1px 1px 1px 7px; 
border-radius: 5px; 
margin-bottom: 0.3em;

font-size: 1.0em;
font-weight: 500;
}

.listPoint {
background-color: #eee;
padding: 3px 3px 3px 7px; 
border-radius: 5px; 
margin-bottom: 0.5em;
border: 0px solid #445fa5;
line-height: 150%;
font-weight: bold;
font-size: 1.0em;
}


.listNum {
	float: right; 
	margin-right: 30%; 
	width: 30px; 
	border-radius: 10px; 
	padding: 7px; 
	text-align: center; 
	background-color: #FAFAD6;
}


/* NOTES PAGES STYLES

/* Landing  page list (selector.php) */

.noteListL {
width: 96%;  
border: 0px dashed purple; 
margin: 0px;
}

.noteListR {
width: 96%;  
border: 0px dashed purple; 
margin-top: 20px;
}

.webNoteHead {
background-color: #2A4792; 
border: 1pt solid #2A4792;
border-radius: 3px;
font-family: "PT Sans", sans-serif; 
color: #fff; 
font-size: 15pt; 
margin: 0px 0px 2px 0px; 
vertical-align: middle; 
padding: 10px 5px 5px 5px;
}


.noteHead1 {
background-color: #C8E7D3; 
border: 1pt solid #555;
font-family: 'PT Sans'; 
color: #000; 
font-size: 15pt; 
margin: 0px; 
vertical-align: middle; 
padding: 1px;	
/*display: inline-block;*/
}
.noteHead2 
{
background-color: #eee; 
border: 0;
font-family: 'PT Sans'; 
color: #000; 
font-size: 12pt; 
margin: 4px 0px 1px 0px; 
vertical-align: middle; 
padding: 2px;	
/*display: inline-block;*/
}
.noteLeft {
width: 65%; 
float: left;	
}

.noteSpace {
height: 8px;
}


/* INDEX PAGE STYLES */
/*current resources bar */
#dateInd {
	width: 22%; padding: 1px 0px 1px 5px; background-color: #eee; border-radius: 0px; font-size: 1.0em; border: 1px solid #888; float: left;
}
#quizInd {
	width: 18%; padding: 1px 0px 1px 5px; background-color: #fff; border-radius: 0px; font-size: 1.0em; border: 1px solid #888; float: left;
}
#quizNo {
	width: 8%; padding: 1px 0px 1px 5px; background-color: #333; border-radius: 0px; font-size: 1.0em; border: 1px solid #333; float: left; color: white;
}
#matInd  {
	width: 25%; padding: 1px 0px 1px 5px; background-color: #fff; border-radius: 0px; font-size: 1.0em; border: 1px solid #888; float: left;
}
#matNo  {
	width: 8%; padding: 1px 0px 1px 5px; background-color: #444; border-radius: 0px; font-size: 1.0em; border: 1px solid #444; float: left; color: white;
}




#indMainLeft {
margin: 0px 2% 0px 2%;
	width: 96%;
	background-color: #ffffff;
	padding: 0%;
}

#indRightCol {
	margin: 0px 2% 0px 2%;
	width: 96%;
	background-color: #ffffff;
	padding: 0%;
	
}


#indLeftBox {
	margin: 0px 0px 20px 0px;
	width: 96%;
	background-color: #ffffff;
	padding: 4% 2% 4% 2%;
	border: 0px solid #888;
	border-radius: 15px;
	}

#indRightBox {
	margin: 0px;
	width: 96%;
	background-color: #ffffff;
	padding: 4% 2% 4% 2%;
	border: 0px solid #888;
	border-radius: 15px;
}

.featureContentL  {
height: 80px; 
width: 96%; 
background-color: #f4f4f4; 
padding: 5px 0px 0px 10px; 
margin: 0px; 
line-height: 130%;
}
.featureContentR  {
height: 80px; 
width: 96%; 
background-color: #f4f4f4; 
padding: 5px 0px 0px 10px; 
margin: 20px 0px 0px 0px; 
line-height: 130%;
}



#refsMain {
width: 96%;  
margin: 2%;
border: 0px red dashed;
}

#TOC {
width: 96%; 
border: 0px solid #aaa; 
border-radius: 10px; 
background-color: #f8f8f8; 
padding: 8px; 
margin-bottom: 10px;
}

#TOCnotes {
width: 96%; 
border: 0px solid #aaa; 
border-radius: 10px; 
background-color: #fff; 
padding: 8px;
}

#seeAlso {
width: 96%; 
border: 0px dashed #aaa; 
border-radius: 10px; 
background-color: #fff; 
padding: 8px;
}

#seeAlsoNt {
width: 96%; 
border: 1px solid #aaa; 
border-radius: 10px; 
background-color: #fff; 
padding: 8px;
margin-top: 5px;
}

.matIcon {
	border: 0px dashed red; padding: 5px; width: 3%; vertical-align: top; float: left;
}
.matNote {
	border: 0px dashed blue; margin-left: 5%; padding: 0%; width: 90%; float: left;
}

.matDownload {
	border: 0px dashed green; padding: 0px; width: 20%; margin:2% 0% 10% 8%;  
}
/* ext layout styles - vtr_refs */
.extLogo {
border: 0px dashed red; 
padding: 5px; 
margin-right: 10px;
width: 3%; 
float: left;

}

.extDescr {
border: 0px dashed blue; padding: 5px;  width: 85%; vertical-align: top; float: left;	
}

.extProv {
border: 0px dashed green; padding-left: 15px;  width: 96%; 	margin: 0% 0% 3% 6%;
}






.clearMob {
clear: both;
display: block;
font-size: 0;
line-height: 0;
height: 0;
}

.dotline
{
	display: none;
}





#displayMain {
width: 96%;  
margin: 2%; 
border: 0px red dashed; 
}

.adRightCol {
width: 96%;  
margin: 2%; 
border: 0px green dashed; 
}



#quizMain {
width: 100%;  
margin: 0px;
border: 0px blue dashed; 
background-color: #fff;
}

#quizNavUp {
background-color:  #2E4276; 
border: 1px solid #2E4276; 
border-radius: 15px 15px 0px 0px; 
margin: 10px 0px 0px 0px; 
padding: 2%;
width: 96%;
}

#quizNavDn {
background-color:  #fff; 
border: 1px solid #888; 
border-radius: 0px 0px 15px 15px; 
margin: 0px 0px 15px 0px; 
padding: 2%;
width: 96%;
}


#quizLeft {
border: 1px solid #888; 
border-radius: 15px; 
padding: 4%; 
width: 92%; 
margin:10px  0px ;
background-color: #fff;
}

.quizRight {
border: 1px solid #888; 
border-radius: 15px; 
padding: 4%; 
width: 92%; 
margin: 10px 0px ;
background-color: #fff;
}

/* LESSON PLANS STYLES */

/* landing page text box */
.masonryHeadL {
border: 1px solid #888; 
padding: 8px;  
border-radius: 5px; 
width: 96%;
margin: 0px 0px 15px 0px; 
background-color: #fff;  
color: #444; 

}

.masonryHeadR {
border: 1px solid #888; 
padding: 8px;  
border-radius: 5px; 
width: 96%; 
margin: 0px; 
background-color: #fff;  
color: #444; 
}

/*landing page masonry styles */
.masonry {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 5px;
	position: relative;
	width: 100%;
	overflow: hidden; /* Fix for firefox and IE 10-11  */
	box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.8);
	background: #f8f8f8;
	margin: 10px 75px 40px 0px;
}

.masonry .thumb img {
	border-radius: 5px 5px 0px 0px;
	width: 100%;
}
.masonry.hentry {
	margin: 5px 0 30px 0px;
}
/* excerpt text in masonry box */
.masonry-text {
	padding: 0 10px;
	/* two lines below added - Alex 241216 */
	font-size: 12px;
	font-weight: bold;
	/* line-height: 120%;  - not working ?? - styled inline from excerpt text area on post edit page */
	margin: 17px 0 0 0;
	word-break: break-all;
}
.masonry-text .masonry-header {
	margin-bottom: 20px;
}
.masonry-header .masonry-title {
	font-size: 18px; /*not working??*/
	line-height: 120%; 
	margin: 17px 0 0 0;
	word-break: break-all;
}
.masonry-text .masonry-header .masonry-title a {
	color: #282724;
	word-break: break-all;
}
#masonryClearerD {
display: none;	
}
#masonryClearerT {
display: none;	
}




/*LESSON PLANS - SINGLE LESSON */

.artsetTitle {
background-color: #212F53; 
margin-top: 30px; 
padding: 7px; 
vertical-align: middle; 
border: 0px; 
border-radius: 5px 5px 0px 0px;		
}


.artsetContents {
border: 1px #ccc solid;  
padding: 15px 8px 15px 8px; 
margin-top: 0px; 
background-color: #f4f4f4;
}

.artsetConText {
padding: 0px; 
background: #f4f4f4; 
float: left; 
width: 60%; 
border: 0px green dashed;
}

/* LPAGE STYLES*/


.artsetNav1 {
display: none;
}
.artsetNav2 {
border: 0px solid yellow; 
border-radius: 3px; 
padding: 10px 0px 10px 5px; 
margin: 0px 0px 10px 0px; 
font-size: 1.2em; 
background: #f1f1f1;	
width: 100%;
}




.LessonLeft {
	border: 0px dashed purple; 
	width: 100%; 
}
.LessonRight {
	border: 0px dashed green; 
	width: 100%; 
	margin: 30px 0px 0px 0px;


}
.LessonIntro {
border: 0px dashed green; 
width: 100%;
margin: 0px 0px 50px 0px;	
}

.LessonExtraBlock {
border: 0px dashed red; 
margin: 30px 0px 30px 0px;
width: 100%;	
}

/* Footer */

#footer {
	border-top: 1px solid #DDD;
	color: #777;
	padding: 16px 0 4px;
}
#footer-left {width: 96%;}
#footer-right {width: 96%;}

#footer p {margin-bottom: 0.4em;}
#footer .text-separator {
	padding: 0 3px;
	color: #BBB;
}
#footer a:hover {color: #000;
}

/*ARTICLE PAGE STYLES - MOBILE */

.artHead {
font-size: 2.8em; 
margin-top: 20px; 
float: left;
}

#titleSeparator {
display: none;
}

.Article {
display: none;
}

.ArticleMob {
border: 0px red dashed;
float: left;
padding: 0px;
font-family:  Tahoma;
font-size: 1.4em;
line-height: 170%;
font-weight: 300;
color: #222;
margin: 0px 0px 20px 0px;
width: 95%;

}

.Articlen {
border: 0px red dashed;
float: left;
padding: 1%;
font-family:  Tahoma;
font-size: 1.4em;
line-height: 160%;
font-weight: 400;
color: #222;
margin: 0px 0px 20px 0px;
width: 98%;
text-align: left;
text-justify: inter-word;
}


.preRead {
border: 0px solid red; 
padding: 0px;  
width: 98%;  
margin: 0px;
}



.vocabBox {
border: 1px solid #ddd; 
border-radius: 3px; 
padding: 0px; 
float: left; 
width: 95%;  
margin: 0px 5px 30px 0px; 
background-color: #fefefe;
}


.underArtLeftCol {
width: 100%; 
margin-left: 0px;
border: 0px dashed purple; 
}
.underArtRightCol {
width: 100%; 
margin-left: 0px;
padding: 0px; 
border: 0px dashed green;
}

.underArtVocabBox {
border: 1px solid #c4c4c4;
border-radius: 3px; 
padding: 0px 10px 0px 0px; 
float: left; 
width: 98%;  
margin: 0px 5px 60px 0px; 
background-color: #fefefe;
}

.underArtQuizBox {
border: 0px dashed green; 
float: left; 
margin-bottom: 10px; 
background-color: #fff; 
width: 100%; 
padding: 0px;
}




.artPictureMob { 
background-color: #fff;
border: 0px solid red; 
padding: 0px;
width: 100%; 
margin-left: auto;
margin-right: auto;
margin-bottom: 30px;
}




#articleData2 {
border: 0px solid red;
border-radius: 5px;
font-size: 0.9em;
margin: 5px 0px 10px 0px;
text-align: center;
}
#articleData1 {
display: none;
}


.artPicture { 
display: none;
}
.artMainPic {
display: none;
}

.artMainPicMob {
width: 100%; 
border: 1px solid #ddd;
margin-top: 10px;
}

.artSubPicFull {
width: 100%; 
margin: 15px 0px 0px 0px;
}


.artSubTextLeft {
width: 100%;  
margin: 5px 0px 0px 0px;
float: right;

}
.artSubPicLeft {
width: 100%; 
margin: 15px 0px 0px 0px;
float: left;
}

.artSubTextRight {
width: 100%; 
margin: 5px 0px 0px 0px;
float: left;
}
.artSubPicRight {
width: 100%; 
margin: 15px 0px 0px 0px;
float: right;
}
.artSubPicCenter {
display: block;
    margin-left: auto;
    margin-right: auto;
	margin-top: 0px;
	margin-bottom: 10px;
	border: 0px green dashed;
	line-height: 100%;
	}


.picCap {
font-family: "Lucida Grande", "DejaVu Sans", "Bitstream Vera Sans", Verdana, sans-serif;
font-size: 1.0em;
margin: 1px 0px 3px 0px;
float: left;

}

.picAtt {
font-family: "Lucida Grande", "DejaVu Sans", "Bitstream Vera Sans", Verdana, sans-serif;
font-size: 1.0em;
margin: 1px 0px 3px 0px;
float: right;
}



#boxRelated1{
display: none;
}

#boxRelated2{
border: 0px solid orange;
float: right;
margin: 0px 0px 20px 0px;
width: 100%;
border-radius: 3px;
}


/*ARCHIVE PAGE STYLES */
.archiveWrap {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 0px;
	position: relative;
	width: 95%;
	overflow: hidden; /* Fix for firefox and IE 10-11  */
	box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.8);
	background: #f8f8f8;
	margin: 30px 35px 10px 0px; 
	float: left; 
}

.archivePic {
width: 45%; 
margin-bottom: 0px; 
border: 0px #dedede solid;	
border-radius: 0px;
float: left;
}

.archiveText {
width: 48%;
padding: 5px 5px 5px 10px; 
line-height: 140%;
float: left;	
}








/* HP styles */


div.Titles{
  margin: 0px 0px 10px 0px;
	padding-top: 2.0em;
	text-align: left;
	color: #ffffff;
	width: 95%;
}

.ExerciseTitle{
	
	font-weight: bold;
	color: #000000;
	background-color: #ffffff;
	text-align: left;
	margin: 0px;
	width: 95%;
}

.ExerciseSubtitle{
	
	color: #000000;
	background-color: #ffffff;
	text-align: left;
	margin: 10px 0px 40px 0px;
}

div.StdDiv{
	margin-top: 5px;
	text-align: left;
	line-height: 160%;
	font-size: 120%;
	color: #000;
	padding: 5px 20px 20px 20px;
	padding: 2%;
	border: 1px solid #c4c4c4;
	border-radius: 3px;
	background-color: #fefefe;
	width: 90%;
	font-weight: 500;

}

#InstructionsDiv {
	font-size: 120%;
	color: #000;
	font-weight: 700;
	border: 0px #bbb solid;
	border-radius: 3px;
	padding: 0px;
	background-color: #fff;
	width: 90%;
	margin-top: 20px;
}

#MainDiv {
	width: 91%;
	border: 1px #ddd solid;
	margin-left: 0px;
	min-height: 380px;
}
/*
div.StdDivSm{
	background-color: #ffffff;
	margin: auto;
	text-align: left;
	line-height: 110%;
	font-size: 80%;
	color: #000000;
	padding: 3px;
	border-style: solid;
	border-width: 1px 1px 1px 1px;
	border-color: #000000; 
	margin-bottom: 1px;
}

div.StdDivSmx{
	background-color: #f8f8f8;
	margin: auto;
	text-align: left;
	line-height: 110%;
	font-size: 70%;
	color: #000000;
	padding: 5px;
	border-style: solid;
	border-width: 1px 1px 1px 1px;
	border-color: #000000; 
	margin-bottom: 1px;
}
*/


input, textarea{
	font-family: Geneva,Arial,sans-serif;
	font-size: 120%;
}

select{
	font-size: 100%;
}
 
div.Feedback {
	background-color: #fff;
	left: 10%;
	top: 33%;
	width: 70%;
	z-index: 4;
	border: 4px solid #0D5CBA;
	border-radius: 5px;
	padding: 20px;
	text-align: center;
	position: absolute;
	font-size: 1.2em;	
	font-weight: 600;
	display: none;
}


div.ExerciseDiv{
	color: #000000;
	border: 0px blue dashed;
	
}

/* JQuiz styles */

div.QuestionNavigation{
	text-align: center;
	border: 0px blue dashed;
	width: 100%;
}

.QNum{
	margin: 0em 1em 0.5em 1em;
	font-weight: bold;
	vertical-align: middle;
}

textarea{
	font-family: Geneva,Arial,sans-serif;
}

.QuestionText{
	text-align: left;
	margin: 0px;
	font-size: 0.9em;
	font-weight: 700;
	border: 0px dashed red;
	width: 100%;
}

.Answer{
	font-size: 120%;
	letter-spacing: 0.1em;
	
}

.PartialAnswer{
	font-size: 120%;
	letter-spacing: 0.1em;	
	color: #000000;
}

.Highlight{
	color: #000000;
	background-color: #ffff00;
	font-weight: bold;
	font-size: 120%;
}

ol.QuizQuestions{
	text-align: left;
	list-style-type: none;
	border:0px red solid;
	width: 100%;
	margin-left: 2%;
	padding: 0px;
}

li.QuizQuestion{
	padding: 1em;
	border: 0px purple solid;
	
}

ol.MCAnswers{
	text-align: left;
	list-style-type: upper-alpha;
	padding: 1em;
	font-size: 0.9em;
	font-weight: 500;
	border: 0px dashed blue;
	width: 95%;
	margin-left: 0px;
	
	
}

ol.MCAnswers li{
	margin-bottom: 1em;
	
}

ol.MSelAnswers{
	text-align: left;
	list-style-type: lower-alpha;
	padding: 1em;
}

div.ShortAnswer{
	padding: 1em;
}



.FuncButton {
	text-align: center;
	border: 1px solid #888;
	border-radius: 3px;
	color: #000;
	background-color: #fff;
	padding: 3px 6px 3px 6px;

	
}

/*
.FuncButtonx {
	text-align: center;
	 border: 0px solid #5176D6;
	border-radius: 5px;
	cursor: pointer;
	padding: 3px 6px 3px 6px;
	border-radius: 3px;
	color: #fff;
	background-color: #555;	
}

*/

.FuncButtonUp {
	text-align: center;
	padding: 3px 6px 3px 6px;
	border: 1px solid #888;
	border-radius: 3px;
	color: #fff;
	background-color: #555;
	
}

.FuncButtonDown {
	text-align: center;
	padding: 3px 6px 3px 6px;
	border: 1px solid #888;
	border-radius: 3px;
	color: #fff;
	background-color: #555;
}




.sixtyEight {
 width: 100%; 
border: 0px red solid;
}

.resourcePanel {
float: right; 
width: 30%; 
border: 2px green solid; 
padding-top: 40px;
display:none;
}



/* JCloze styles */

.ClozeWordList{
	text-align: center;
	font-weight: bold;
}

div.ClozeBody{
	text-align: left;
	margin-top: 2em;
	margin-bottom: 2em;
	line-height: 2.5
}

span.GapSpan{
	font-weight: bold;
	
	
}

/* JCross styles */

table.CrosswordGrid{
	margin: auto auto 1em auto;
	border-collapse: collapse;
	padding: 0px;
	background-color: #000000;
}

table.CrosswordGrid tbody tr td{
	width: 1.5em;
	height: 1.5em;
	text-align: center;
	vertical-align: middle;
	font-size: 140%;
	padding: 1px;
	margin: 0px;
	border-style: solid;
	border-width: 1px;
	border-color: #000000;
	color: #000000;
}

table.CrosswordGrid span{
	color: #000000;
}

table.CrosswordGrid td.BlankCell{
	background-color: #000000;
	color: #000000;
}

table.CrosswordGrid td.LetterOnlyCell{
	text-align: center;
	vertical-align: middle;
	background-color: #ffffff;
	color: #000000;
	font-weight: bold;
}

table.CrosswordGrid td.NumLetterCell{
	text-align: left;
	vertical-align: top;
	background-color: #ffffff;
	color: #000000;
	padding: 1px;
	font-weight: bold;
}

.NumLetterCellText{
	cursor: pointer;
	color: #000000;
}

.GridNum{
	vertical-align: super;
	font-size: 66%;
	font-weight: bold;
	text-decoration: none;
	color: #000000;
}

.GridNum:hover, .GridNum:visited{
	color: #000000;
}

table#Clues{
	margin: auto;
	vertical-align: top;
}

table#Clues td{
	vertical-align: top;
}

table.ClueList{
  margin: auto;
}

td.ClueNum{
	text-align: right;
	font-weight: bold;
	vertical-align: top;
}

td.Clue{
	text-align: left;
}

div#ClueEntry{
	text-align: left;
	margin-bottom: 1em;
}


/* JMatch flashcard styles */
div.CardStyle {
	position: absolute;
	font-family: Geneva,Arial,sans-serif;
	font-size: 90%;
	padding: 5px;
	border-style: solid;
	border-width: 1px;
	border-radius: 5px;
	color: #000000;
	background-color: #EEF7FC;
	left: -50px;
	top: -50px;
	overflow: visible;
	width: 200px;
}


table.FlashcardTable{
	background-color: transparent;
	color: #000000;
	border-color: #000000;
	margin-left: 5%;
	margin-right: 5%;
	margin-top: 2em;
	margin-bottom: 2em;
	width: 90%;
	position: relative;
	text-align: center;
	padding: 0px;
	
}

table.FlashcardTable tr{
	border-style: none;
	margin: 0px;
	padding: 0px;
	background-color: #FFFFFF;
}

table.FlashcardTable td.Showing{
	font-size: 140%;
	text-align: center;
	width: 50%;
	display: table-cell;
	padding: 2em;
	margin: 0px;
	border-style: solid;
	border-width: 1px;
	color: #000000;
	background-color: #FFFFFF;
}

table.FlashcardTable td.Hidden{
	display: none;
}


/* JMix styles */
div#SegmentDiv{
	margin-top: 2em;
	margin-bottom: 2em;
	text-align: center;
	
}

a.ExSegment{
	font-size: 120%;
	font-weight: bold;
	text-decoration: none;
	color: #000000;
	
}

span.RemainingWordList{
	font-style: italic;
}

div.DropLine {
	position: absolute;
	text-align: center;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #000000;
	width: 70%;
	margin-left: 5%;
	margin-right: 5%;
	margin-bottom: 50px;
}




.quizFooter{
width: 96%; 
margin: auto;	
}

/*ADAPEX DIVS */
.Adapex-desktop {
display: none;	
}
.Adapex-left {
display: none;
}
.Adapex-right {
display: none;
}

.Adapex-mob {
width: 336px;
height: 280px;
}


}
/* END OF MOBILE STYLES */















/* PRINT STYLES START*/
@media print {	
	
@page {
margin: 1.5cm;
}
/* BLOCKED */
#articleData1, #articleData2, #boxRelated1, #boxRelated2, #resourceBar,#seeAlsoNt, #TOCnotes, #pageTop,#lowerHeader,#innerHeader, #upperHeader, #sub-navx, #sub-nav, #navigation,#gcse-search, #logoImg,#toggleText1,#tog1,#login,#footer-right .BreadCrumbOrange, .BreadCrumbBlue, .leftbox, .rightCol, .linkHead, .artsetNav1, .artsetNav2, .bookNav, .bookcover, .download, .dotline, .artprintSwitch {
display: none;
}

 


#site-wrapper {
width: 100%;	
}	

.noteBlock {
page-break-inside: avoid;
}
 
 
h1 {
font-size: 12pt;
}

h2 {
font-size: 1.6em;	
}

p {margin-bottom: 0.5em;}
.indexText {
font-size: 0.95em;
}


.refhead {
color: #000;
}
.refsep {
color: #000;
}


.artMainPic  {
border: 1px solid #e4e4e4;
margin-bottom: 0px;
width: 100%; 
}
.artMainPicMob {
display: none;	
}

.artPicture { 
background-color: #fff;
border: 0px solid red; 
padding: 0px;
width: 97%; 
margin-left: auto;
margin-right: auto;
margin-bottom: 30px;
float: left;
/*transform: rotate(-0.5deg);*/
box-shadow: 10px 10px 10px #555;
}
.artPictureMob {
display: none;	
}

.picCap {
font-family: helvetica;
font-size: 7pt;
margin: 1px 0px 0px 5px;
float: left;
border: 0px solid green;
width: 49%;
text-align: left;
}
.picAtt {
font-family: helvetica;
font-size: 7pt;
margin: 1px 5px 0px 0px;
float: right;
border: 0px solid blue;	
width: 48%;
text-align: right;
}


.preRead {
width: 100%;
float: left;
font-size: 8pt;
background-color: #fff;	

}


.artHead {
font-size: 20pt; 
margin: 0px; 
line-height: 130%;
}

#titleSeparator {
height: 1px;
background-color: #888;
margin: 15px 0px 10px 0px;	
}


.Articlen {
border: 0px red dashed;
float: right;
padding: 10px;
font-family:  Georgia;
font-size: 10pt;
line-height: 160%;
background-color: #E1DBEA;
/*border: 0.01mm solid #AFA0C5;*/
font-weight: 500;
color: #333;
margin: 0px 0px 20px 0px;
width: 95%;
text-align: left;
/*page-break-inside: avoid;*/
}


.ExText {
border: 0px blue dashed;
padding: 10px;
font-family: Georgia;
font-size: 10pt;
line-height: 160%;
font-weight: 500;
color: #222;
margin: 0px 0px 20px 0px;
width: 95%;
text-align: left;
/*page-break-inside: avoid;*/
}

}
/*END OF PRINT STYLES */