/* CSS for the K12 Website - March 2017*/


/* General settings for the "Content" section */

#content_met {
	font-size: .9em;
	color: #2c3135;
	}

#content_met a {

	}

#content_met p {
	font-size: 1em;
	}

#content_met div {
	color: #2c3135;
	}

#content_met blockquote {
	font-size: 1em;
	color: #2c3135;
	}


/* header */

.above_content h2 {
	font-size: 145%;
	line-height: 1.3em;
	font-weight: 400;
	color: #2c3135;
	}

.above_content h3 {
	font-size: 1.2em;
	line-height: 1.5em;
	font-weight: 700;
	color: #2c3135;
	padding-top: 10px;
	clear: left;
	}


/* 2 equal columns side by side - Display */
#content_met div.half {
	padding-right: 1%;
	width: 48%;
	float: left;
	color: #2c3135;
	margin-bottom:10px;
	}
	@media screen and (max-width: 780px) {
		#content_met div.half {
			padding-right: 1%;
			width: 98%;
			float: left;
			clear: left;
			font-size: inherit;
			color: #2c3135;
		}
	}


/* Image Right (Image does not diplay on a phone) */	
#content_met img.image_right {
	float: right;
	padding: 0 0 15px 15px;
	}
	@media screen and (max-width: 480px) {
		#content_met img.image_right {
			display: none;
		}
	}


/* Image Left (Images does not diplay on a phone) */
#content_met img.image_left {
	float: left;
	padding: 5px 15px 15px 0px;
	}
	@media screen and (max-width: 480px) {
		#content_met img.image_left {
			display: none;
		}
	}
	/* Image Left - Use if you don't want the text to wrap under the image */
	#content_met div.text_right, p.text_right {
		overflow: hidden;
		}


/* line - Use the line from the previous template */
#content_met hr {
	border: none;
	width: 100%;
	height: auto;
	background: url(../_resources2/images/section-footer-wide.png) no-repeat;
	background-size: 100% 100%;
	margin-top: 20px;
	padding: 4px;
	clear: both;
	}


/* Short line - To use for line beside table of content */
#content_met hr.small {
	border: none;
	width: 65%;
	height: auto;
	background: url(../_resources2/images/section-footer-wide.png) no-repeat;
	background-size: 100% 100%;
	margin-top: 20px;
	padding: 4px;
	float: left;
	clear: none;
	}

/* General bullets and lists */
#content_met ul li, #content_met ol li
{
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 6px;
}

/* Standout Text*/
.raspberrytext {
	font-weight: normal;
	text-decoration: none;
	color: #CC3366;
	}
	.raspberrytext a:link {color: #CC3366;	text-decoration: underline;}
	.raspberrytext a:visited {color: #CC3366;	text-decoration: underline;}
	.raspberrytext a:hover {color: #CC3366;	text-decoration: none;}
	.raspberrytext a:active {color: #CC3366;	text-decoration: none;}

.raspberrytextbold {
	font-weight: bold;
	text-decoration: none;
	color: #CC3366;
	}
	.raspberrytextbold a:link {color: #CC3366;	text-decoration: underline;}
	.raspberrytextbold a:visited {color: #CC3366;	text-decoration: underline;}
	.raspberrytextbold a:hover {color: #CC3366;	text-decoration: none;}
	.raspberrytextbold a:active {color: #CC3366;	text-decoration: none;}


/* If smalltext is needed */
#content_met .smalltext {
	font-weight: normal;
	font-size: .75em;
	text-decoration: none;
	line-height: 1.1m;
	}


/* Bullets and Numbered List - Adjust the padding and margin for the lists (see different list definitions below) */


/* Bullets or Numbered List with paragraph space between each */
#content_met .p-ul {
	margin-top: 0px;
	margin-right: 5px;
	margin-bottom: 0px;
	}

#content_met .p-ul li {
	margin-top: 0px;
	margin-right: 5px;
	margin-bottom: 8px;
	}

#content_met .p-ul li ul {
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 8px;
	}


/* Use of different classes for the Bullets or Numbered Lists */

/* Use the class-"no-p" if you don't want space between Bullets or Numbered List in your secon level */
#content_met .p-ul li ul.no-p li {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 2px;
	}
 
#content_met .p-ul li ol.no-p li {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 2px;
	}

/* Use the class-"ul-nobullets" if you want a list without bullets */
ul.ul-nobullets {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 15px !important;
	list-style-type: none;
	list-style-image: none;
	}

ul.ul-nobullets li {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	list-style-type: none;
	list-style-image: none;
	}

/* Use the class-"p-ulnobullets" if you want a paragraph space list without bullets */
#content_met ul.p-ulnobullets {
	margin: 0px 0px 7px 10px;
	padding: 0px 0px 0px 0px;
	list-style-position: outside;
	list-style-type: none;
	list-style-image: none;
	}
	#content_met ul.p-ulnobullets  li {
		margin: 0px 0px 7px 10px;
		padding: 0px 0px 0px 0px;
		list-style-position: outside;
		list-style-type: none;
		list-style-image: none;
	}

/* List with a "dash" instead of a disk, a circle, or a square */

.trait-ul {
	list-style-position: outside;
	list-style-type: none;
	list-style-image: url(../images/trait.gif);
	font-size: 100%;
	margin: 5px 0px 0px 15px;
	}
	.trait-ul li {
		margin: 0px 10px 5px 15px;
		}

/* List with a "checkmark" instead of a disk, a circle, or a square */

.checkmark-ul {
	list-style-position: outside;
	list-style-type: none;
	list-style-image: url("../images/checkmark.gif");
	font-size: 100%;
	margin: 5px 0px 0px 15px;
	}
	.checkmark-ul li {
		margin: 0px 10px 5px 15px;
		}


/* Use if you want less space between the text and the list */	
#content_met ul.ul-tight {
	margin-top:-10px !important;
	}
	
/* Reduce margin and padding when the Bullets or Numbered List are in a table */
.p-ul.table {
	margin-top: 10px;
	margin-right: 5px;
	margin-bottom: 0px;
	margin-left: 10px;
	padding-left: 10px;
	}

/* Reduce margin and padding for a list without bullets inside a table */
ul.p-ulnobullets tr td ul li {
	margin: 3px 0px 0px 10px;
	padding: 3px 0px 0px 0px;
	list-style-position: outside;
	list-style-type: none;
	list-style-image: none;
	}


/* Functions */

.information {
	font-size: .9em;
	padding-bottom: 20px;
	}

div.information a {
	text-decoration:underline;
	text-decoration-style: solid;
	}
	
.nobr {
		white-space: nowrap;
	}

.align_absmiddle {
	vertical-align: bottom;
	}
	
.align_right {
	float: right;
	}
	
span.superscript {
	vertical-align: 33%;
	line-height: normal;
	font-size: 75%;
	}

.indent {
	padding-left: 20px;
	}

.isbn {
	color: #4E4E4E;
	font-size: 85%;
	font-style: normal;
	}

.citation {
	color: #333;
	font-size: 85%;
	line-height: 120%;
	font-style: normal;
	}

#content_met hr.footnote {
	clear: left;
	float: left;
	width: 30%;
	border: none;
	background: url(../images/trait.jpg) repeat-x;
	margin: 10px 0px 3px 0px;
	padding: 2px 2px 2px 2px;
	}

#content_met .footnote_number {
	float: left;
	clear: left;
	width: 3%;
	font-size: 85%;
	margin: 2px 0px 7px 0px;
	line-height: 1.1em;
	}

#content_met .footnote {
	float: left;
	width: 97%;
	font-size: 85%;
	margin: 2px 0px 10px 0px;
	line-height: 1.1em;
	}

/* Padding around the Share button */
 
.addthis_inline_share_toolbox_vw1a {
	padding-top: 40px;
	}

/* Colored boxes */

.yellowbox {
	background: #fbfbf1;
	border: solid thin #efefc5;
	padding: 7px;
	margin-bottom: 10px;
	}

.box_purple {
	background: #f3f0fd;
	padding: 6px;
	border: solid thin #dad3f4;
	}

.box_orange {
	background: #fde2c5;
	padding: 9px;
	border: solid thin #f79e3a;
	}

.box_teal {
	background: #AEFFFF;
	padding: 9px;
	border: solid thin #0FC;
	}

.yellow_bg {
	border: 1px solid #CCC1AA;
	background-color: #efefc5;
	padding: 3px;
	}

.yellow_highlight {
	background-color: #FF3;
	}

.taupe_border {
	border: 1px solid #CCC1AA;
	padding: 5px;/*background: #F8F7F3;*/
	}

.feedback {
	clear: both;
	background: #fbfbf1;
	border: solid thin #efefc5;
	padding: 6px;
}

.box_grey {
	border:#999 solid 1px; 
	padding:6px; 
	background-color:#F5F5F5;
	margin-bottom:10px;
}

.grey_border {
	border: 1px solid #999;
	padding: 5px;
	}

/* Table - Basic table with black lines */

table {
	padding: 0;
	border-collapse: collapse;
	}
th {
	border: 1px solid #333;
	background-color: #FFF;
	padding: 6px !important;
	text-align: left;
	}
tr {
	border: 1px solid #333;
	padding: 6px;
	vertical-align: text-top;
	}
td {
	border: 1px solid #333;
	padding: 6px;
	}
caption {
	border-left: none;
	border-right: none;
	border-top: none;
	padding: 5px;
	font-weight: bold;
	font-size: 120%;
	}


/* Table common - Common table used throughout the website */

table.common {
	padding: 0;
	margin-bottom:15px;
	border-collapse: collapse;
	background-color:#FFF;
	}
table.common th {
	border: 1px solid #a8a8ab; /* was #CCC1AA */
	background-color: #efeff0; /* was #E6E1D5 */
	padding: 3px;
	text-align: center;
	}

table.common tr.alt th, table.common tr.alt td {
	background-color: #FFFFFF;
	text-align:left;
	}

table.common tr.alt_row th, table.common tr.alt_row td {
	background-color: #F5F5F5;
	text-align:left;
	}

table.common tr {
	border: 1px solid #a8a8ab; /* was #CCC1AA */
	padding: 6px !important;
	vertical-align: text-top;
	line-height: 1.2em;
	background-color:#FFF;
	}
table.common td {
	border: 1px solid #a8a8ab; /* was #CCC1AA */
	padding: 6px !important;
	}
table.common caption {
	border-left: 1px solid #a8a8ab; /* was #CCC1AA */
	border-right: 1px solid #a8a8ab; /* was #CCC1AA */
	border-top: 1px solid #a8a8ab; /* was #CCC1AA */
	background-color:#FFF;
	padding: 5px;
	font-weight: bold;
	font-size: 120%;
	}
table.common tr td ul {
	margin: 0px 0px 3px -5px !important;
	padding: 0px;
	line-height: 1.2em;
	}
table.common tr td ul li {
	list-style-position: outside;
	list-style-type: none;
	list-style-image: url(../images/trait.gif);
	margin-left: -10px;
	padding: 0px;
	}
table.common tr td ul.p-ulnobullets {
	margin: 3px 0px 0px -20px;
	padding: 3px 0px 0px 0px;
	list-style-position: outside;
	list-style-type: none;
	list-style-image: none;
	}
table.common tr td ul.p-ulnobullets li {
	margin: 3px 0px 7px -30px;
	padding: 3px 0px 0px 0px;
	list-style-position: outside;
	list-style-type: none;
	list-style-image: none;
	}
table.common tr td ol {
	margin: -3px 0 0 17px;
	padding: 0px;
	}
table.common tr td ol li {
	margin: 0 0 10px 0px;
	padding: 0px;
	}
table.common tr td ol li ol {
	margin: 3px 0 0 20px;
	padding: 0px;
	}
table.common tr td ol li ol li {
	margin: 0 0 3px 0px;
	padding: 0px;
	}
.rowBkg {
	background-color: #F5F5F5;
	}

/* Table of Contents */

.toc {
	float: right;
	margin: 50px 0px 20px 20px;
	padding: 15px 6px 6px 6px;
	border: 1px solid #999;
	border-radius: 10px 10px 10px 10px;
	width: 200px;
	height: auto;
	text-align: left;
	font-size: 80%;
	line-height:1em;
	background: #FFF;
	}
	 @media screen and (max-width: 480px) {
	.toc {
		float: left;
		width: 90%;
	}
	}
	
	.toc ul {
		line-height: 1.2em;
		margin: 0px 6px 6px 15px;
		padding: 20px 0px 0px 10px !important;
		}
		.toc ul li {
			padding: 0px 0px 7px 0px;
			list-style-type: none;
			list-style-position: outside;
			font-size: 90%;
			}
		/* Use with a second level bullets to reduce the space between the text and the list */
		.toc ul.ul-tight {
			padding-top:2px !important;
			}
		.toc ul.ul-tight li {
			padding-bottom:2px;
			}

/* Table of Contents Title - If use with a paragraph tag - it will align the text on the top line of the box */
	.toc .title {
		color: #4E4E4E;
		font-size: 110%;
		font-style: italic;
		font-weight: bold;
		text-decoration: none;
		line-height: 100%;
		background-color: #FFF;
		padding: 0px 10px 0px 7px;
		margin: -25px 0px 0px 7px;
		width:auto;
		}

/* Center the image placed inside the Table of Contents */
.toc img.center {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}
	 @media screen and (max-width: 480px) {
		.toc img.center {
			display: none;
		}
		}


.toc p {
	clear: left;
}


/* About link under the header image */
		
.about {
	padding: 0px 0px 10px 5px;
	font-size: 80%;
	}
	.about a:link {color: #000000; text-decoration: underline;}
	.about a:visited {color: #000000;	text-decoration: underline;}
	.about a:hover {color: #000000;	text-decoration: none;}
	.about a:active {color: #000043;	text-decoration: none;}


/* Navigation for the "Information for..." box on K12 page */

#infoFor {
	border: 1px solid #999;
	border-radius: 10px 10px 10px 10px;
	font-size: 95%;
	width: 430px;
	height: 45px;
	margin-top: 15px;
	padding-top: 14px;
	text-align: center;
	margin-left: 22px; }
	#infoFor a:link, infoFor a:visited {text-decoration: underline;}
	#infoFor a:hover, infoFor a:visited:hover {color: #000033; text-decoration: none;}

	#infoFor .title {
		color: #4E4E4E;
		display: table;
		font-size: 120% !important;
		font-style: italic;
		font-weight: normal;
		text-decoration: none;
		text-align: left;
		line-height: 100%;
		background-color: #FFF;
		padding: 0px 10px 8px 15px;
		margin: -27px 0px 0px 15px;
		}

.information {
                font-size: .9em;
                padding-bottom:20px;
                }

div.information a {
                text-decoration:underline;
                text-decoration-style: solid;
                }

/* Expandable answer for FAQ */

#faq-list h4 h5 {
	margin: 0 0 10px 0px;
	padding: 0 0 10px 0px;
}
.answer {
	/**/display: none;
	background-color: #F7F7F7;
	margin: 0 0 7px 40px;
	padding: 5px 5px 7px 5px;
	overflow:auto;
}

.answer p {
	margin: 0 0 4px 0px;
	padding: 0 0 4px 0px;
}
.answer h4 h5 {
	margin: 0 0 4px 0px;
	padding: 0 0 4px 0px;
}
.answer ul {
	margin: 0 0 7px 15px;
	padding: 0 0 7px 15px;
}
.question {
	clear: left;
	line-height: 1.2em;
	font-weight: normal;
	color: #333;
	padding: 0px 0px 0px 24px;
	cursor: pointer;
	background-image: url(../images/close.png);
	background-position: top left;
	background-repeat: no-repeat;
	margin: 0px 0px 15px 0px;
}
.question:hover {
	color: #999;
}
.close {
	background-image: url(../images/open.png);
}
 @media print {
.answer {
	display: block !important;
	margin: 0 0 7px 25px;
	padding: 0 0 7px 0px;
}
}

#faqs dt, #faqs dd { padding: 0 0 0 50px; }
#faqs dt { font-size:1.5em; color: #9d9d9d; cursor: pointer; height: 37px; line-height: 37px; margin: 0 0 15px 25px;}
#faqs dd { font-size: 1em; margin: 0 0 20px 25px;}
#faqs dt { background: url(http://www.designonslaught.com/files/2012/06/expand-icon.png) no-repeat left}
#faqs .expanded { background: url(http://www.designonslaught.com/files/2012/06/expanded-icon.png) no-repeat left}