/* CSS Document for Examples */

body {
	background-color: #FFF;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	margin: 0px;
	overflow-y: scroll;
}
.no-top-pad {
	padding-top: 0px;
	padding-bottom: 0px;
}
.no-side-pad {
	padding-left: 0px;
	padding-right: 0px;
}
.no-side-pad h3 {
	padding: 0px 20px;
}
.prettify-sample-orange {
	background-color: #FF5328;
	border-radius: 0px;
	color: #FFF;
	box-shadow: none;
}
#page-wrapper {
	padding: 10px 20px 0px 20px;
}
h1 {
	line-height: 1.2;
	font-weight: normal;
	color: #CCC;
	background-color: #006666;
	padding: 10px;
	margin: 0px;
	box-shadow: 0px 0px 36px #999;
	border-bottom: 1px solid #FFF;
}
h1 i {
	display: block;
	font-size: 0.3em;
	font-style: normal;
	text-transform: uppercase;
	letter-spacing: 0.35em;
	margin-left: 0.75em;
}
h3 {
	font-weight: normal;
	text-transform: uppercase;
	margin: 0px;
}
.link-list-colored {
	margin: 12px 0px 24px 0px;
	padding: 0px;
}
.link-list-colored li {
	list-style-type: none;
	margin-bottom: 8px;
}
.link-list-colored a {
	display: inline-block;
	padding: 12px;
	color: #000;
	text-decoration: none;
	border: 1px solid #000;
}
.link-list-colored a:hover, .link-list-colored a:focus {
	color: #CCC;
	background-color: #151515;
}
.scalable {display: block; margin: 0px auto;}
#footer {
	font-size: .6em;
	text-transform: uppercase;
	padding: 0px 20px;
}
.small-print {
	color: #666;
}

/*MEDIA QUERIES*/
/*
For media queries to work correctly in 
mobile devices, you must add this viewport meta tag to your page:
<meta name="viewport" content="width=device-width">
(place the query in the head region)
*/

/*SMARTPHONE AND NARROW WINDOWS (LESS THAN 680PX WIDE)*/
@media only screen and (min-width: 0px) and (max-width: 679px) {
body {
	margin: 0px 10px;
}
h1 {
	font-size: 2em;
	margin: 0px;
}
h1 i {
	letter-spacing: normal;
	font-weight: normal;
	margin-top: 0em;
}
h2, h3, h4 {
	margin-top: 12px;
}
.p7QC-Col {
	width: auto !important;
	float: none !important;
	margin: 0px !important;
	margin-bottom: 10px !important;
}
.p7QC-content {
	height: auto !important;
	max-height: 888678px !important;
	padding-top: 0px;
	padding-bottom: 0px;
}
.p7QC:before, .p7QC:after { display: none;}
.p7QC-content {
	border-radius: 0px !important;
}
}
/*Smartphones ONLY*/
@media only screen and (max-device-width: 480px) {
	body {
	margin: 0px 0px !important;
	font-size: .8em;
}
h1 i {font-size: .2em !important; letter-spacing: normal !important;}
#page-wrapper {
	padding: 20px 0px 20px 0px !important;
}
.p7QC-content {
	border: none !important;
}
.prettify-sample-orange {
	padding: 10px 20px !important;
}
}

/*Medium Windows*/
@media only screen and (min-width: 680px) and (max-width: 1200px) {
	.p7QC-Col.med-breakpoint {
	width: auto !important;
	float: none !important;
	margin: 0px !important;
	margin-bottom: 10px !important;
}
.p7QC-Col.med-breakpoint .p7QC-content {
	height: auto !important;
	max-height: 888678px !important;
}
.border-left {
		border-left: none !important;
}
}

/*Tablet ONLY. Use this query to add rules for tablets.
Landscape tablets should get a normal and unaltered display with just a decrease in font-size.*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
	body {font-size: .75em;}
	.p7QC-Col.med-breakpoint {
	width: auto !important;
	float: none !important;
	margin: 0px !important;
	margin-bottom: 10px !important;
}
.p7QC-Col.med-breakpoint .p7QC-content {
	height: auto !important;
	max-height: 888678px !important;
}
	.border-left {
		border-left: none !important;
}
}
/*Portrait Tablet ONLY. Use this query to add rules for tablets in Prtrait orientation.
Landscape tablets should get a normal and unaltered display.*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
	.p7QC-content {padding: 12px;}
		body {font-size: .9em;}
	.p7QC-Col.med-breakpoint {
	width: auto !important;
	float: none !important;
	margin: 0px !important;
	margin-bottom: 10px !important;
}
	.border-left {
		border-left: none !important;
}

.footer {
	background-color: #222;
	box-shadow: inset 0px 16px 2px rgba(255,255,255,.025);
	border-top: 1px solid #000;
	padding: 15px 30px;
	font-size: 0.7em;
	color: #8C8C8C;
	text-align: center;
	letter-spacing: .5em;
}
.footer p.copyright {
	text-transform: uppercase;
	margin: 0px;
}

}