@charset "utf-8";
/*  
Theme Name: Tutor Via Computer
Theme URI: http://www.TutorViaComputer.com
Description: Custom theme for the Tutor Via Computer website.
Version: 1.0 
Author: Denise Etheridge
Author URI: http://www.TutorViaComputer.com
Copyright: Copyright(c)2015 Baycon Group, Inc. All Rights Reserved
*/







/* This sets all padding and margins to 0. Where neccessary, they are manually changed.*/

*{
padding:0;
margin:0;
}
/* This portion of the document is from PXtoEM.com. It resolves inconsistencies between browsers. Some of the styles have been removed. A complete list can be found in explained-normalized.css */
/* CSS Document */
/*! normalize.css modified for PXtoEM.com at 16px
    normalize.css 2012-03-11T12:53 UTC - http://github.com/necolas/normalize.css */

/* =============================================================================
   HTML5 display definitions
   ========================================================================== */

/*
 * Corrects block display not defined in IE6/7/8/9 & FF3
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section,
summary
{
    display: block;
}

[hidden]
{
    display: none;
}
/*
 * Addresses font-family inconsistency between 'textarea' and other form elements.
 */

html,
button,
input,
select,
textarea
{
font-family: Arial, Helvetica, Georgia, Sans-serif;
}

/*
 * Addresses outline displayed oddly in Chrome
 */

a:focus
{
outline: thin dotted;
}

/*
 * Improves readability when focused and also mouse hovered in all browsers
 * people.opera.com/patrickl/experiments/keyboard/test
 */

a:hover,
a:active
{
outline: 0;
}


/* =============================================================================
   Typography
   ========================================================================== */

/*
 * Addresses font sizes and margins set differently in IE6/7
 * Addresses font sizes within 'section' and 'article' in FF4+, Chrome, S5
 */


/*
 * Addresses styling not present in IE7/8/9, S5, Chrome
 */

abbr[title]
{
border-bottom: 1px dotted;
}

/*
 * Addresses style set to 'bolder' in FF3+, S4/5, Chrome
*/

b,
strong
{
font-weight: bold;
}
blockquote
{
margin: 1em 40px;
}

/*
 * Addresses styling not present in S5, Chrome
 */

dfn
{
font-style: italic;
}

/*
 * Addresses styling not present in IE6/7/8/9
 */

mark
{
background: #ff0;
color: #000;
}
/*
 * Addresses margins set differently in IE6/7
 */
pre
{
margin: 1em 0;
}

/*
 * Corrects font family set oddly in IE6, S4/5, Chrome
 * en.wikipedia.org/wiki/User:Davidgothberg/Test59
 */
kbd,
samp
{
font-family: 'courier new', monospace;
font-size: 1em;
}

/*
 * Improves readability of pre-formatted text in all browsers
 */

pre
{
    white-space: pre;
    word-wrap: break-word;
}

/*
 * 1. Addresses CSS quotes not supported in IE6/7
 * 2. Addresses quote property not supported in S4
 */

/* 1 */

q
{

    quotes: none;
}

/* 2 */

q:before,
q:after
{
    content: '';
    content: none;
}

small
{
    font-size: 75%;
}

/*
 * Prevents sub and sup affecting line-height in all browsers
 * gist.github.com/413930
 */

sub,
sup
{
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup
{
    top: -0.5em;
}

sub
{
    bottom: -0.25em;
}


/* =============================================================================
   Lists
   ========================================================================== */

/*
 * Addresses margins set differently in IE6/7
 */

dl,
menu,
ol,
ul
{
margin: 0 0 .875em 0;
}
dd
{
margin: 0 0 0 40px;
}

/*
 * Addresses paddings set differently in IE6/7
 */
menu,
ol,
ul
{
padding: 0 0 0 40px;
}

/*
 * Corrects list images handled incorrectly in IE7
 */
nav ul,
nav ol
{
list-style: none;
list-style-image: none;
}
/* =============================================================================
   Embedded content
   ========================================================================== */

/*
 * 1. Removes border when inside 'a' element in IE6/7/8/9, FF3
 * 2. Improves image quality when scaled in IE7
 *    code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing
 */

img
{
    border: 0;
 /* 1 */
    -ms-interpolation-mode: bicubic;
 /* 2 */;
}

/*
 * Corrects overflow displayed oddly in IE9
 */
svg:not(:root)
{
    overflow: hidden;
}
/* =============================================================================
   Figures
   ========================================================================== */

/*
 * Addresses margin not present in IE6/7/8/9, S5, O11
 */

figure
{
    margin: 0;
}


/* =============================================================================
   Forms
   ========================================================================== */

/*
 * Corrects margin displayed oddly in IE6/7
 */
/*
form
{
    margin: 0;
}
*/

/*
 * Define consistent border, margin, and padding
 */

fieldset
{
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}

/*
 * 1. Corrects color not being inherited in IE6/7/8/9
 * 2. Corrects text not wrapping in FF3
 * 3. Corrects alignment displayed oddly in IE6/7
 */

legend
{
    border: 0;
 /* 1 */
    padding: 0;
    white-space: normal;
 /* 2 */
   
 /* 3 */;
}

/*
 * 1. Corrects font size not being inherited in all browsers
 * 2. Addresses margins set differently in IE6/7, FF3+, S5, Chrome
 * 3. Improves appearance and consistency in all browsers
 */

button,
input,
select,
textarea
{
    font-size: 100%;
 /* 1 */
    margin: 0;
 /* 2 */
    vertical-align: baseline;
 /* 3 */
   
 /* 3 */;
}

/*
 * Addresses FF3/4 setting line-height on 'input' using !important in the UA stylesheet
 */

button,
input
{
    line-height: normal;
 /* 1 */;
}

/*
 * 1. Improves usability and consistency of cursor style between image-type 'input' and others
 * 2. Corrects inability to style clickable 'input' types in iOS
 * 3. Removes inner spacing in IE7 without affecting normal text inputs
 *    Known issue: inner spacing remains in IE6
 */
button,
input[type="button"],
input[type="reset"],
input[type="submit"]
{
    cursor: pointer;
 /* 1 */
    -webkit-appearance: button;
 /* 2 */
    overflow: visible;
  /* 3 */;
}

/*
 * Re-set default cursor for disabled elements
 */

button[disabled],
input[disabled]
{
cursor: default;
}

/*
 * 1. Addresses box sizing set to content-box in IE8/9
 * 2. Removes excess padding in IE8/9
 * 3. Removes excess padding in IE7
      Known issue: excess padding remains in IE6
 */

input[type="checkbox"],
input[type="radio"]
{
box-sizing: border-box;
 /* 1 */
padding: 0;
 /* 2 */
 /*   height: 13px; */
 /* 3 */
 /*   *width: 13px; */
 /* 3 */;
}

/*
 * 1. Addresses appearance set to searchfield in S5, Chrome
 * 2. Addresses box-sizing set to border-box in S5, Chrome (include -moz to future-proof)
 */
input[type="search"]
{
    -webkit-appearance: textfield;
 /* 1 */
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
 /* 2 */
    box-sizing: content-box;
}

/*
 * Removes inner padding and search cancel button in S5, Chrome on OS X
 */

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button
{
    -webkit-appearance: none;
}
/*
 * Removes inner padding and border in FF3+
 * www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons
 */

button::-moz-focus-inner,
input::-moz-focus-inner
{
    border: 0;
    padding: 0;
}

/*
 * 1. Removes default vertical scrollbar in IE6/7/8/9
 * 2. Improves readability and alignment in all browsers
 */

textarea
{
    overflow: auto;
 /* 1 */
    vertical-align: top;
 /* 2 */;
}


/* =============================================================================
   Tables
   ========================================================================== */

/*
 * Remove most spacing between table cells
 */

table
{
    border-collapse: collapse;
    border-spacing: 0;
}
/*This portion is custom to the Tutor Via Computer page */

/* This starts the portion of the document specific to tutorviacomputer.com */
/* General Styles */
body{
background-color:#fcfcfc;
color:#000;
font: 1em Arial, helvetica, Georgia, Sans-serif; /* 1em eguals 16px. .875 equals 14px Use converter a http://pxtoem.com */
line-height:1.75em;
width:100%
}
#container{
width:980px;
margin:0 auto;
padding-left:0px;
padding-right:0px;


}
/* Removes the border around link in IE. */
a {
border:none;
border-style:none;
}
/* not sure about this. Check for deletion 
img {text-decoration: none; border: 0px}
*/
p{
margin-top:0px;
margin-bottom:.875em;
}
.pMarginTop{
margin-top:.875em;
}
h1{
font-size: 2.00em;
line-height:1.14em;
margin-bottom: .57em;
margin-top:0;
}
h2{
font-size: 1.625em;
line-height:1.07em;
margin-bottom: .535em;
margin-top:0;
}
h3{
font-size: 1em;
line-height:1.16em;
margin-bottom: .58em;
margin-top:0;
}
h4{
font-size: 1.375em;
line-height:1.27em;
margin-bottom: .635em;
margin-top:0;
}
h5{
font-size: 1.250em;
line-height:1.40em;
margin-bottom: .70em;
margin-top:0;
}
h6{
font-size: 1.125em;
line-height:1.55em;
margin-bottom: .775em;
margin-top:0;
}
h1 a,
h2 a{
text-decoration:none;
color:#226699;
}

/* Header styles */
header{
width:100%;
margin:0 auto;
}
#headerTopBar{
width:100%;
height:30px;
background-color:#bed1de; /*pale blue*/
}
#headerMiddleBar{
width:100%;
}
#headerBottomBar{
text-align:left;
width:100%;
height:30px;
background-color:#b5c3aa; /*pale green */
margin-bottom:20px;
}


/* Article styles */
.sharebutton{
margin-bottom:.875em;
}
.sharebuttonTop{
margin-top:-7px;
}
.topMargin15{
margin-top:15px;
}
#lessonLeaderbordAd{
margin-bottom: 20px;
margin-top: 15px;
}
/* Possible Deletion
#maheaderBottomBarinContent{
width:100%;
text-align:left;
}
#searchBoxLeftSide{
display:none;
}

article{
text-align:left;
float:left;
margin-top:30px;
width:50%;
}

h1 a{
text-decoration:none;
color:#226699;
}
*/
/* =WordPress Core
-------------------------------------------------------------- */
.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

.alignright {
    float:right;
    margin: 5px 0 20px 20px;
}

.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

a img.alignnone {
    margin: 5px 20px 20px 0;
}

a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.wp-caption {
    background: #fff;
    border: 1px solid #f0f0f0;
    max-width: 96%; /* Image does not overflow the content area */
    padding: 5px 3px 10px;
    text-align: center;
}

.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
    margin: 5px 0 20px 20px;
}

.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

.wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0 4px 5px;
}

/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
	background-color: #eee;
	clip: auto !important;
	clip-path: none;
	color: #444;
	display: block;
	font-size: 1em;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
	/* Above WP toolbar. */
}

/* End Core */

.byline {
font-style: italic;
font-size: .75em; /* 12px */
line-height: 1.165em; /* 14px */
margin-bottom:1.745em;
margin-top:2.33em;
}
.inlineLink a{
color:#226699; /* blue */
}
/*
.inlineLink a{
color:#226699; 
}

.tocHead{
font-weight:bold;
}


*/
a 
{color: #226699}
p a {
color: #226699; 
text-decoration:none;
}

ul{
list-style-position:outside;
padding-left:30px;
}
ul li a, ol li a{
color:#226699; /* blue */
text-decoration:none;
}

.linkColor{
color: #226699; 
}

.postmetadata{
	font-size:11px; 
	margin-top:10px; 
	padding-bottom: 10px;
	color:#999999; 
	line-height:15px; 
	display:block;
}
/* use byline?
.author{
	color: #666666;
	font-weight: bold;
}
*/
.metaDate{
	padding-left:20px; 
	margin-left:5px; 
	background:url('images/date.png') no-repeat top left; 
}

.metaComment { 
	padding-left:20px; 
	margin-left:5px; 
	background:url('images/comment_icon.jpg') no-repeat top left; 
}

.metaTag{
	padding-left:20px; 
	margin: 10px 0 0 5px;
	background:url('images/tag.png') no-repeat top left; 
}
.adPositionF {
	float: right; 
	width: 381px;
	height: 310px;
	padding: 15px 30px 20px 15px;
}
.adPositionG{
margin-top:20px;
margin-bottom:30px;
}

.alignCenter,
img.alignCenter {
	clear: both;
	margin-top: 4px;
	margin-bottom: 4px;
	margin-left: auto;
	margin-right: auto;
	display:block;
}
img.alignRight {
	display: inline;
	float: right;
	margin-left: 24px;
	margin-top: 4px;
	margin-bottom: 4px;
}
.alignLeft,
img.alignLeft {
	display: inline;
	float: left;
	margin-right: 24px;
	margin-top: 4px;
	margin-bottom: 4px;
	
}

#articleAd {
	float: left; /* since this element is floated, a width must be given */
	width: 300px;
	height: 250px;
	padding-top: 0px;
	padding-right: 30px;
	padding-bottom: 10px;	
}
#search{
float:right;

}
/* posible deletion 
#lessonSearch{
width:170px;
}
*/
/* posible deletion 
#container .pageChange p {
	font-size: 1em;
}
*/
/* Menu CSS*/
/* Miscelaneous styles */
.clearFloat{
clear:both;
}
.widget-title{
display:none;
}
#menu{
display:none;
}
.menuTitleText{color:#fcfcfc;font-weight:bold;text-align:center;display:block;padding:10px 0;background-color:#006593; margin-top:20px;}
.menuTitleTextHome{display:none;}
.menuCloseButton{color:#fcfcfc;font-weight:bold;text-align:center;cursor:pointer;display:block;background-color:#006593;}
.menuHeadings {
cursor:pointer; 
background-color: #F7F7F7;
border-bottom: 1px solid #000;
display: block;
padding: 3px 0px 3px 20px;	
}
.menuHeadings:hover {
background-color:#fff;
}
.menuList {
display:none;	
}
.menuList a{
color: #000;
text-decoration: none;	
}
.menuSubList {
text-decoration: none;
background-color: #F7F7F7;
display: block;
border-width: 0 1px 1px 1px;
border-style: none none solid none;
border-color: #000 #39C;
padding: 3px 0 3px 40px;
text-align: left;
}
.menuSubList:hover {
background-color:#fff;
}
#menuBar{
}
#menuBar ul{
	font-size:13px;
	list-style:none;
	padding-left:0;
	font-weight:bold;
	margin:0;	
}
#menuBar li{
	float:left;
}
#menuBar a{
	color:#033;
	line-height:30px;
	padding: 0 30px;
	display:block;	
}
#menuBar li:hover > a
{
	background-color:#dce3d7;
	color:#033;
}
#menuBar li:active > a{
background-color:#003300;
color:#f7f7f7;
}
#menuBar a:focus{
background-color:#003300;
color:#f7f7f7;
}

lightbox CSS
*/
#lightboxBackground{
	cursor:pointer;
	display:none;
	position:fixed;
	top:  0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color:#000;
	filter:alpha(opacity=80);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
	opacity:0.8;
	-moz-opacity:0.8;
	-khtml-opacity: 0.8;
	
	
		
}            
#lightboxForeground{
	display:none;
	position:fixed;
	left: 50%;
	margin-left:-495px;
	top: 100px;
	background-color:#808080;
	width: 980px;
	height: 585px;
	border: 1px solid #000;
}           
.videoCloseButton{
	float:right;
	margin-right:20px;
	margin-top: 10px;
}            
.theVideo{
	display:none;
	margin-top: 35px;
	margin-left: 20px;
}            
.videoImageButton{
	float:left;
	margin-top: 20px;
	margin-bottom: 20px;
	margin-right: 20px;
}                      
.clickImage{
	width:190px;
	float:left;
}
.picSizeFull{
	max-width:100%;
	height:auto;	
}
/*toolTips*/
/*===========*/
 #toolTipBox{
	position: fixed;
	width: 250px;
	height: 200px;
	top: 50%;
	left: 50%;
	margin-top: -100px;
	margin-left: -125px;
	border: 1px thin #000;
	background-color: #fff;
	display:none;
		
				
}
.boxCloseButton{
	float:right;
	margin-right:5px;
	margin-top: 10px;
}
.theTip{
	display:none;
	height:160px;
	margin-top: 35px;
	margin-left: 20px;
	margin-right: 20px;
	margin-bottom: 20px;
	overflow-y: auto;
}

/* Page Navigation */
#barBlog{
height:30px;
width:100%;
background-color:#f7f7f7;
margin:0 0 35px 0;
}
.pageNavigationClass{
background-color:#f7f7f7;
border:0;
width:100%;
margin-left:auto;
margin-right:auto;
padding-left:0px;
margin-bottom:35px;
}
.navigationTOC,
.navigationPrevious,
.navigationNext{
display:inline-block;
text-decoration:none;
}
.navigationPrevious{
width:22%;
float:left;
padding-left:3%;
}
.navigationTOC{
width:49%;
text-align:center;
}
.navigationNext{
width:22%;
padding-right:3%;
text-align:right;
}
.navigation{
background-color:#f7f7f7;
border:0;
width:100%;
margin-left:auto;
margin-right:auto;
padding-left:0px;
margin-bottom:35px;
text-align:center;
color:#000000;
}
.navigation a {
color:#000000;
}
article#toc{
text-align:left;
float:left;
width:50%;
margin-top:20px;
}
article#tangle{
text-align:left;
float:left;
width:70%;
margin-top:20px;
}
/*
article{
width:100%;
padding-bottom: 20px;
}
*/
#articleAd{
width:300px;
height:250px;
}
.boldItalic {
	font-style: italic;
	font-weight: bolder;
}
.bold{
font-weight:bold;
}
.italicFont {
	font-style: italic;
}
.fontColorBlack{
color:#000000;
}
/* Sidebar styles */
#rightSidebar{
float: right;
width: 35%;
padding-left:35px;
margin-top:20px;
}
#rightTangleSidebar{
float: right;
width: 25%;
padding-left:35px;
margin-top:70px;
}
#search-3{
margin-bottom: 30px;
}

#tutorialList{
margin-bottom: 30px;
}
.titleText {
color: #ffac29;
font-weight: bold;
text-decoration: none;
text-align: center;
display: block;
padding: 10px 0;
background-color: #3c5463;
margin-top: 30px;
}
.featuredImage{
float:left;
margin:0px 20px 20px 0px;
}
/*
.itemHeadings {
cursor:pointer; 
background-color: #F7F7F7;
border-bottom: 1px solid #000;
display: block;
padding: 3px 0px 3px 20px;	
}
.itemHeadings:hover {
background-color:#fff;
}
.itemList {
display:none;	
}
.itemList a{
color: #000;
text-decoration: none;	
}
.itemSubList {
text-decoration: none;
background-color: #F7F7F7;
display: block;
border-width: 0 1px 1px 1px;
border-style: none none solid none;
border-color: #000 #39C;
padding: 3px 0 3px 40px;
text-align: left;
}
.itemSubList:hover {
background-color:#fff;
}
*/
#tocAdsenseSecond{
margin-bottom: 30px;
}
#subject{
width:250px;
}
/* Links */
.navigationTOC a:link,
.navigationTOC a:active,
.navigationTOC a:visited,
.navigationNext a:link,
.navigationNext a:active,
.navigationNext a:visited,
.navigationPrevious a:link,
.navigationPrevious a:active,
.navigationPrevious a:visited{
	color: #000;
	text-decoration: none;
}
.navigationTOC a:hover,
.navigationNext a:hover, .navigationPrevious a:hover{
	color: #000;
	text-decoration: underline;
}
container #lesson p a {
	color: #000;
}
/*table */
#container #lesson table tr td a {
	color: #000;
}
table, th, td {
   border: 1px solid black;
}
td, th {
 padding: 10px; 
}
table{
margin:0 auto .875em auto;
}
thead{
font-weight:bold;
}
.tableNoBorder{
border:none;
}
.tdAlignTop{
vertical-align:top;
}
.center{
margin-right: auto;
margin-left: auto;
}
.centerItems {
	display: block;
	margin-right: auto;
	margin-left: auto;
}
/*img.centerItems{
margin-bottom:28px;
}*/
.centerText{
text-align:center;
}
.justifyText{
text-align:justify;
text-justify: inter-word;
}
.rightText{
text-align:right;
}

/* Indent */
.indentParagraph{
text-indent:30px;
}
.indentHanging {
  padding-left:30px;
  text-indent:-30px;
}
code, pre {
  background-color: #EAEAD9;
  border-color: #DAD9BC;
  border-style: solid;
  border-width: 1px;
  color: #333;
  font-family: Consolas, "Liberation Mono", Courier, monospace;
  font-weight: normal;
  padding: 0.125rem 0.3125rem 0.0625rem;
}
/* Tips */
.toolTip{
color:#226699;
border:none;
background-color:transparent;
cursor:help;
border-bottom:inset;
}
a.tip {
       text-decoration: none
}
a.tip:hover {
    cursor: help; 
}
a.tip span {
    display: none;
}
a.tip:hover span {
    border: #c0c0c0 1px dotted;
    padding: 5px 20px 5px 5px;
	background-color:#f0f0f0;
    display: block;
    z-index: 100;
    margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
    width: 200px;
    position: absolute;    
    text-decoration: none;
}
/*Comments

-----------------------------------------------------*/
.comments-template{
background-color:#0099FF;
background: transparent url(images/dots.jpg) repeat-x top left;
margin-top: 5px;
margin-bottom: 20px;
}
/*#commentsMade{
background-color:#00FF00;
}*/
.commentlist{
	list-style: none;
}
ul .children li{
	list-style: none;
}
.comment-body{
border-top: 1px solid #ccc;
margin-top:0px;
}
.comment-author{
font-size:small;
margin-top:0;
margin-right:5px;
float:left;
}
.spacer{
height: 75px;
}
#commentAuthorField,
#commentEmailField{
width: 280px;
height: 1.50em;
padding: 2px;
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */   
}
img.avatar{
 vertical-align: text-top;
}
.comment-metadata{
font-size:small;
}
#comment{
width: 600px;
height:150px;
padding: 5px;
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */      
}
#commentResponseForm{
width:610px;
float:left;

}
#commentAuthorDivision{
float:left;
line-height:1em;
margin-right: 36px;
}
#commentEmailDivision{
line-height:1em;
}
.says{
display:none;
}
#commentUrlDivision{
clear:both;
display:none;
}
/****School Ad **/

#adSchoolBox{
background-color:#f7f7f7;
padding: 10px 0 20px 5px;
margin-bottom: 30px;

}
.titleTextSide{
color: #ffac29;
font-weight: bold;
text-decoration: none;
text-align: center;
display: block;
padding: 10px 0;
background-color: #3c5463;
margin-top: 30px;
}
.titleText {
color: #fcfcfc;
font-weight: bold;
text-decoration: none;
text-align: center;
display: block;
padding: 10px 0;
background-color: #006593;
}
#subject{
width:250px;
}
#qStreet{
width:320px;
margin-bottom: 20px;
float:right;
}
#adLessonBottom{
margin-top: 20px;
margin-bottom:20px; 

}
/* Paging */
a:-webkit-any-link {
text-decoration: none;
}

.paging a span{
	margin: 2px;
	padding: 2px 6px;
	text-decoration: none;
	color:  #FFF;
	background-color:#003300;
	border:thin solid #003300;
}

.paging a:hover span,
.paging a:focus span,
.paging a:active span
 {
	text-decoration: none;
	background-color: #325b32;
	border:thin solid #325b32;
	
}

.paging span{
	padding: 2px 6px;
	margin: 2px;
	border:thin solid #666;
	background-color: #FFF;
	text-decoration: none;
	color: #666;
}
.paging{
	margin-bottom: 1.625em;
}
/* footer styles */
footer{
margin:20px auto 0 auto;
width:100%;

}
#footerAd{

background-color:#fff;
margin: 0 0 30px 0;
}
#footerLegal{
background-color:#585858; /*gray*/
color:#fff;
padding: 20px 0 5px 0;
text-align:center;
width:100%;
}
#footerLegal a{
color:#fff;
text-decoration:none;
}
#footerCopyright{
background-color:#585858; /*gray*/
color:#fff;
padding: 20px 0 5px 0;
text-align:center;
width:100%;
}
/*Contact form*/
#contactForm{
	width:460px;
	margin:0 auto;
}

.formLabel {
	display:block;
	margin-top:20px;
	letter-spacing:2px;
}
.formInput,
.formTextArea {
	background:#f7f7f7;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border:1px solid #dedede;
	padding:10px;
	margin-top:3px;
	font-size:0.9em;
	color:#3a3a3a;
}
.formFieldSizeA{
width:439px;
height:27px;
}
#contactFormMessage{
margin-top:30px;
}
#contactForm input:focus,
#contactForm textarea:focus {
		border:1px solid #97d6eb;
}
.formTextArea {
	height:213px;
}

#submit {
	border:none;
	margin-top:20px;
	cursor:pointer;
	color:#FFFFFF;
	background-color:#006593;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
}

.submitSmall{
width:127px;
height:38px;
}
.submitMedium{
width:160px;
height:38px;
}
#submit:hover {
	opacity:0.9;
}
.aquaButton{
	border:none;
	margin-bottom:5px;
	cursor:pointer;
	color:#ffffff;
	background-color:#006593;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	padding: 5px 5px 5px 5px;
	text-align:center;
	display: block;
}
.aquaButton a{
color:#ffffff;
}
.form_error{
	color:red;
	font-size:12px;
	line-height:16px;
	margin-top:5px;
}
.human{
	display:none;
}
iframe{
  max-width: 100% !important;
}
.greyButton {
	border: none;
	height: 22px;
	width: 175px;
	font-size: 12px;
	margin-bottom: 14px;
	cursor: pointer;
	color: #FFFFFF;
	background-color: #353739;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
}
button:focus {
    outline: none;
}
button.greyButton:hover {
cursor: pointer;
background-color: #006593;
}
@media screen and (max-width: 1040px) {
   #container{
	width:90%;		
	}	
	#qStreet{
	clear:both;
	float:none;
	margin: 0 auto;
	}
	#comment{
	width:100%;
	}
	#commentResponseForm{
	width:100%;
	}
	#commentSubmit{
	text-align:center;
	}
	
}
@media screen and (max-width: 910px) {
#search{
display:none;
}

}

@media screen and (max-width: 890px) {
	#container{
	width:80%;	
	}
	/* possible deletion
	#searchBoxLeftSide{
	margin-top: 10px;
	display:block;
	}
	*/
	article#lesson,
	article#toc{
	width:100%;
	margin-top:20px;
	}
	.navigationPrevious,
	.navigationTOC,
	.navigationNext{
	display:block;
	width:100%;
	text-align:center;
	padding:0;
	margin:0;
	float:none;
	}
	/*
	#searchBox{
	width: 75%;
	height:16px;
	float:left;
	margin-right:10px;
	}
	#searchButton{
	float: left;
	}
	*/
	article#tangle{
	width:100%;
	}
	#rightSidebar, #rightTangleSidebar{
	width:100%;
	}
	
	#search-3{	
	display:none;
	}
	#footerLegal{
	width:100%;
	}
	#footerCopyright{
	width:100%;
	}
	.adPositionF {
	float: right; 
	width: 280px;
	height: 265px;
	padding: 0px 30px 5px 15px;
	}
}
@media screen and (max-width: 800px) {
#commentAuthorDivision,
#commentEmailDivision{
clear:both;
float:none;
width: 100%;
margin: 0 auto 20px auto;
}
#commentAuthorField,
#commentEmailField{
width:100%;
margin: 0 auto;
}
#comment,
#commentFieldDivision{
width:100%;
margin: 0 auto;
}

#sample{
width:90%;
}
.picSize{
	max-width:100%;
	height:auto;	
	}
.workSize{
max-width:100%;
}
}
@media screen and (max-width: 625px) {

table[width]{
	width:100%;
	height:100%;
	font-size:.875em;
}

#articleAd{
	display:none;
	}
.adPositionF {
	float:none; 
	width: 100%;
	height: auto;
	padding: 0px 0px 5px 0px;
	margin-left:auto;
	margin-right:auto;
	}
	#contactForm,
	.formInput,
	.formTextArea{
	width:90%;
	margin-left:auto;
	margin-right:auto;
	}
	
}

@media screen and (max-width: 500px) {
	#articleAd{
	display:none;
	}
	
	
	h1{
	font-size:1.25em;
	}
	h2{
	font-size:1.25em;
	}	
	
	#searchBoxLeftSide{
	margin-bottom: 100px;	
	}
	
	#menuBar li{
	width:50%;
}

.scrollTable{
width:100%;
display:block;
border:none;
}

.scrollTbody{
  overflow-x:scroll;
  overflow-y:visible;
  width:70%;
  float:right;
  display:block; 
  margin-bottom: 16px;
}
.scrollTbody th {
  position:absolute;
  left:0; 
  width:20%;
  text-align:left;
  margin-left:10%;
  border-left:none;
  border-right:none;
  border-bottom:none;
  vertical-align:top;
}
.scrollTbody td{
 border-left:none;
 border-right:none;
 border-bottom:none;
 vertical-align:top;
}

.scroll{
   	overflow-x:scroll;
  	overflow-y:visible;
  	width:100%; 
	
}
.scroll td, .scroll th{
 vertical-align: top;
  text-align:left;
}
.innertable td{
border-right:thin solid #000000;

}
}	

@media screen and (max-width: 450px) {
	#subject{
	width: 175px;
	}
	.searchBox{
	width: 50%;
	height:18px;
	float:left;
	padding:4px;
	}
	.searchButton{
	float: right;
	}
	#qStreet{
	display:none !important;
	}
	#adSchoolBox{
	padding-left:0px;
	
	}
    #tvcLogo{
	width:80%;
	height:auto;
	}
	.smallScreenDisplayNone{
	display:none !important;
	}
	.videoDemo { 
   	width:90%;
   	max-width:400px;
   	height:auto;
	}
.featuredImage{
display:block;	
float:none;	
margin: 0 auto 5px auto;
}
.clear{
clear:both;
}
/* Change the the default size-full to the same as picSize */
.size-full{
	max-width:100%;
	height:auto;	
}

/* Gallery Styles */
.gallery {
	margin-bottom: 20px;
}

.gallery-item {
	float: left;
	margin: 0 4px 30px 0;
	position: relative;
}

.gallery-columns-1 .gallery-item {
	max-width: 100%;
}

.gallery-columns-2 .gallery-item {
	max-width: 48%;
	max-width: -webkit-calc(50% - 4px);
	max-width:         calc(50% - 4px);
}

.gallery-columns-3 .gallery-item {
	max-width: 32%;
	max-width: -webkit-calc(33.3% - 4px);
	max-width:         calc(33.3% - 4px);
	
}

.gallery-columns-4 .gallery-item {
	max-width: 23%;
	max-width: -webkit-calc(25% - 4px);
	max-width:         calc(25% - 4px);
}

.gallery-columns-5 .gallery-item {
	max-width: 19%;
	max-width: -webkit-calc(20% - 4px);
	max-width:         calc(20% - 4px);
}

.gallery-columns-6 .gallery-item {
	max-width: 15%;
	max-width: -webkit-calc(16.7% - 4px);
	max-width:         calc(16.7% - 4px);
}

.gallery-columns-7 .gallery-item {
	max-width: 13%;
	max-width: -webkit-calc(14.28% - 4px);
	max-width:         calc(14.28% - 4px);
}

.gallery-columns-8 .gallery-item {
	max-width: 11%;
	max-width: -webkit-calc(12.5% - 4px);
	max-width:         calc(12.5% - 4px);
}

.gallery-columns-9 .gallery-item {
	max-width: 9%;
	max-width: -webkit-calc(11.1% - 4px);
	max-width:         calc(11.1% - 4px);
}

.gallery-columns-1 .gallery-item:nth-of-type(1n),
.gallery-columns-2 .gallery-item:nth-of-type(2n),
.gallery-columns-3 .gallery-item:nth-of-type(3n),
.gallery-columns-4 .gallery-item:nth-of-type(4n),
.gallery-columns-5 .gallery-item:nth-of-type(5n),
.gallery-columns-6 .gallery-item:nth-of-type(6n),
.gallery-columns-7 .gallery-item:nth-of-type(7n),
.gallery-columns-8 .gallery-item:nth-of-type(8n),
.gallery-columns-9 .gallery-item:nth-of-type(9n) {
	margin-right: 0;
}

.gallery-columns-1.gallery-size-medium figure.gallery-item:nth-of-type(1n+1),
.gallery-columns-1.gallery-size-thumbnail figure.gallery-item:nth-of-type(1n+1),
.gallery-columns-2.gallery-size-thumbnail figure.gallery-item:nth-of-type(2n+1),
.gallery-columns-3.gallery-size-thumbnail figure.gallery-item:nth-of-type(3n+1) {
	clear: both;
}

.gallery-caption {
	background-color: rgba(0, 0, 0, 0.7);
	-webkit-box-sizing: border-box;
	-moz-box-sizing:    border-box;
	box-sizing:         border-box;
	color: #fff;
	font-size: 12px;
	line-height: 1.5;
	margin: 0;
	max-height: 50%;
	opacity: 0;
	padding: 6px 8px;
	position: absolute;
	bottom: 0;
	left: 0;
	text-align: left;
	width: 100%;
}

.gallery-caption:before {
	content: "";
	height: 100%;
	min-height: 49px;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}

.gallery-item:hover .gallery-caption {
	opacity: 1;
}

.gallery-columns-7 .gallery-caption,
.gallery-columns-8 .gallery-caption,
.gallery-columns-9 .gallery-caption {
	display: none;
}

.gallery-columns-3 .gallery-item{
margin-right:15%;
}

.gallery-columns-3 .gallery-item:nth-of-type(1n){
margin-left:5%;
}

/* End Gallery Styles */
