/* =======================================

CUSTOM STYLES GO HERE

=================================== */
.resource-bar-inside{padding-left:40px;background-position: 13px 13px;background-repeat: no-repeat;font-size:.9rem}
.resource-bar {line-height:40px;color:#ffffff;
background: #474747; /* Old browsers */
background: -moz-linear-gradient(top,  #474747 49%, #303030 50%, #303030 50%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(49%,#474747), color-stop(50%,#303030), color-stop(50%,#303030)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #474747 49%,#303030 50%,#303030 50%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #474747 49%,#303030 50%,#303030 50%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #474747 49%,#303030 50%,#303030 50%); /* IE10+ */
background: linear-gradient(to bottom,  #474747 49%,#303030 50%,#303030 50%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#474747', endColorstr='#303030',GradientType=0 ); /* IE6-9 */
}


.faq-title-on { background:url(/National_Library/20160526010038oe_/https://www.stopthinkconnect.org/base/images/faq-minus.png) right no-repeat ; }
.faq-title-off {background:url(/National_Library/20160526010038oe_/https://www.stopthinkconnect.org/base/images/faq-plus.png) right no-repeat ; }
.faq-title {color:#588ecc;cursor:pointer;margin-top:.5rem;padding:1.5rem 3rem 1.5rem 0rem;font-weight: 300;text-transform: uppercase;font-size: 1.3rem;line-height:1.3}

.faq-body {display: none;font-size:1.1rem;line-height:1.7rem;padding:0rem 2rem 3rem 0rem;}


.togglebox {height:48px;width:48px;cursor:pointer}
.togglebox-up {background:url(/National_Library/20160526010038oe_/https://www.stopthinkconnect.org/base/images/toggle_plus.png) no-repeat}
.togglebox-down {background:url(/National_Library/20160526010038oe_/https://www.stopthinkconnect.org/base/images/toggle_minus.png) no-repeat}

.icon-blue-web{color:#4f91cd;padding-left:45px;background: url(/National_Library/20160526010038oe_/https://www.stopthinkconnect.org/base/images/icon-blue-web.png) top left no-repeat}
.icon-blue-web a:link,.icon-blue-web a:visited{ color:#4f91cd}


.campaignboxoutside {background:#f6f6f6;}
.campaignbox{padding:1.5rem;min-height:200px;}
a .campaignbox b{color:#333333;display: block;font-size:1.5rem;line-height: 1.8rem;margin-bottom:1rem;}
a .campaignbox i{color:#999999;font-style: normal;display: block}
.campaignlink {padding:.7rem 1.5rem;}
a .campaignlink {color:#ffffff;}
.campaignlink span {display:inline-block;background: url(/National_Library/20160526010038oe_/https://www.stopthinkconnect.org/base/images/arrow-right-white.png) right no-repeat;padding-right:20px}


.resourceiconinside{height:200px}
.resourceitems .info {background: #f6f6f6;padding:1rem;min-height:300px}
.resourceitems .info b{display:block;font-size:1.1rem}
.resourceitems .info i{display:block;font-style: normal;color:#999999;padding-bottom:1rem}
.resourceitems a{font-size:.9rem;display:inline-block; background: url(/National_Library/20160526010038oe_/https://www.stopthinkconnect.org/base/images/arrow-right-blue.png) right no-repeat;padding-right:20px}
.v-video {}
.v-image {display:none}
.i-video {display:none}
.i-image {}
a.d-video {display:none}


#section1 {background:#4f91cd;padding:3rem 0}
#section1 .title{font-size:2rem;color:#ffffff;padding-bottom:2rem}


.dyk-box{background: #000000;color:#ffffff;cursor:pointer;min-height: 380px;}
.dyk-image {height:100px}
.dyk-title{padding:1.5rem 2rem 1rem 2rem;font-size:1.2rem;line-height: 1.4rem}
.dyk-link {padding:0 2rem 2rem 2rem;font-weight:bold}

.tips {margin:0;padding:0;}
.tips li { color:#333333;cursor:pointer;}
.tips span{padding:0 1rem 0 1rem;margin-right:1rem;display: block;background: url(/National_Library/20160526010038oe_/https://www.stopthinkconnect.org/base/images/arrow-right-grey.png) right no-repeat #ffffff;}
.tips table {width: 100%;padding:0;margin:0}
.tips td {height:80px;font-size: 1.2rem;line-height: 1.4rem;padding:0;margin:0}




#section2 {padding:4rem 0;background: #f1f1f1}


#section3 {padding:3rem 0;}
#section3 .title{font-size:2rem;padding-bottom:2rem}
.hpc {margin:0 0 1rem 0;}
#section3 .columns{padding:0 .5rem;margin:0}
.hpc a{padding:2rem;color:#333333;display:block;font-size:1.1rem}
.hpc-resources {border:1px solid #c6c6c6}
.hpc-campaigns {border:1px solid #73c500}
.hpc-get-involved {border:1px solid #4f91cd}

#section4 {padding:3rem 0;border-top:#f6f6f6 solid 1px}
#section4 .title {font-size:2rem;padding-bottom:2rem}

/* =======================================

BODY STYLE

=================================== */

body {	
	font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
}

a {
	color: #4f91cd;
	text-decoration: none;
}
a:hover, a:focus {
	color: #4f91cd;
	text-decoration: none;
}













/* =======================================

HEADER STYLES

=================================== */

.header-right {padding-top:25px;text-align: right}
.header-right a {color:#464646;font-weight:500}
.header-right ul {padding:0;margin:0;}
.header-right li {list-style: none;display: inline-block;padding:0 1rem;margin:0;border-right:1px solid #cccccc;font-size:.85rem}
.header-right ul li:last-child {border:none;padding-right:0}
.header-right {float:right}
.header-right div {padding-top:10px;color:#4f91cd;font-size:1.1rem;font-weight: 300}

.header-wrapper{position:fixed;width:100%;z-index:99999}


@media only screen {
	.header-spacer{height:100px;}
}

@media only screen and (min-width: 40.063em) {
	.header-spacer{height:160px;}
}


.page-header {
	background: #ffffff;
}
.header-logo {
	line-height: 100px;
	padding-left: 1rem;
}
.hmi {
	float: right;
	background: url(/National_Library/20160526010038oe_/https://www.stopthinkconnect.org/base/images/menu-icon.png)  left no-repeat;
	width: 50px;
}
.hmi span {
	display: block;
	height: 100px;
	width: 50px;
}













/* =======================================

HOMEPAGE BANNER STYLES

=================================== */

.medium-banner-wrapper {
	background-color: #333333;
	height: 400px;
	background-position: center top;
	background-repeat: no-repeat;
}
.small-banner-wrapper {
	background-color: #666666;
	height: 400px;
	background-position: center top;
	background-repeat: no-repeat;
}

.banner-wrapper {
	background-color: #333333;

}
#hpbanner {
}
#hpbanner .text-inside {
	color: #ffffff;
	margin: 280px auto 0 auto;
	max-width: 1000px;
}


@media only screen {
	#hpbanner .text-inside {margin: 100px auto 0 auto;}
}

@media only screen and (min-width: 40.063em) {
	#hpbanner .text-inside {margin: 200px auto 0 auto;}
}

@media only screen and (min-width: 64.063em) {
	#hpbanner .text-inside {margin: 280px auto 0 auto;}
}

#hpbanner li {
	height: 500px;
	background-position: top center;
	background-repeat: no-repeat
}
#hpbanner .banner-button {
	background: #4f91cd;
	color: #ffffff;
	margin: 1rem 0 0 1rem;
	display: inline-block;
	padding:1rem 2rem;
	cursor: pointer

}
#hpbanner .title {
	font-size: 40px;
	font-weight: 500;
	padding: 0 1rem;
	line-height: 45px
}
#hpbanner .subtitle {
	font-size: 18px;
	font-weight: 400;
	padding:.8rem 0 0 1rem ;
}












/* =======================================

NORMAL PAGE STYLES

=================================== */

#page-subnav {


	background: #e5e5e5; /* Old browsers */
	background: -moz-linear-gradient(top,  #e5e5e5 93%, #f1f1f1 93%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(93%,#e5e5e5), color-stop(93%,#f1f1f1)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #e5e5e5 93%,#f1f1f1 93%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #e5e5e5 93%,#f1f1f1 93%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #e5e5e5 93%,#f1f1f1 93%); /* IE10+ */
	background: linear-gradient(to bottom,  #e5e5e5 93%,#f1f1f1 93%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5e5e5', endColorstr='#f1f1f1',GradientType=0 ); /* IE6-9 */



}
#page-subnav .row {
	padding: 0
}
#page-subnav ul {
	padding: 0;
	margin: 0;
}
#page-subnav li {
	font-size: 1rem;
	list-style: none;
	line-height: 50px;;
	float: left;
	margin-right: 1rem;
	padding: 0 1rem
}
#page-subnav a:link, 
#page-subnav a:hover,
#page-subnav a:visited {
	color: #333333;
}
#page-subnav .on a:link, 
#page-subnav .on a:hover, 
#page-subnav .on a:visited {
	color:#ffffff;
}

#page-subnav .on {
	background: #4f91cd; /* Old browsers */
	background: -moz-linear-gradient(top,  #4f91cd 93%, #95bbdd 93%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(93%,#4f91cd), color-stop(93%,#95bbdd)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #4f91cd 93%,#95bbdd 93%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #4f91cd 93%,#95bbdd 93%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #4f91cd 93%,#95bbdd 93%); /* IE10+ */
	background: linear-gradient(to bottom,  #4f91cd 93%,#95bbdd 93%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4f91cd', endColorstr='#95bbdd',GradientType=0 ); /* IE6-9 */
	
}




/* ======================================= */

.page-banner {
	height: 125px;
	
}

.page {
	padding: 2.5rem 0 5rem 0;
}

.page-content {
	display: table;
	width: 100%;
}

.page-content-center {
	display: table-cell;
	line-height: 22px;
}

.page-content-center article {
	padding-top: 2rem;
	color: #525252
}

@media only screen {
	.page-content-left {
		display: table-row;
		width: auto;
	}
	.page-content-left ul {
		padding: 0 0 2.5rem 0;
		margin: 0;
	}
	.page-content-left ul li {
		list-style: none;
		padding: 0;
		margin: 0;
		line-height: 2.5rem;
		border-bottom: 1px solid #dddddd
	}
	.page-content-left ul li:first-child {
		border-top: 1px solid #dddddd
	}
}

@media only screen and (min-width: 40.063em) {/* Non-Mobile Style  */
	.page-content-left {
		display: table-cell;
		width: 250px;
	}
	.page-content-left ul {
		padding: 0 40px 0 0;
		margin: 0;
	}
	.page-content-left ul li {
		list-style: none;
		padding: 0;
		margin: 0;
		line-height: 3rem;
		border-bottom: 1px solid #dddddd
	}
	.page-content-left ul li:first-child {
		border-top: 1px solid #dddddd
	}
}

@media only screen {
	.page-content-right {
		display: table-row;
		width: auto;
	}
	.page-content-right-inside {
		padding: 5rem 0 0 0;
	}

}

@media only screen and (min-width: 40.063em) {/* Non-Mobile Style  */
	.page-content-right {
		display: table-cell;
		width: 300px;
	}
	.page-content-right-inside {
		padding: 0 0 0 50px;
	}

}



/* ======================================= */

article .title {
	color: #333333;
	font-size: 2rem;
	line-height: 2.2rem;
	display: block;
	padding-bottom: 10px;
	font-weight: 400
}
article .subtitle {
	color: #000000;
	font-size: 1.7rem;
	line-height: 1.9rem;
	display: block;
	padding-bottom: 10px;
	font-weight: bold;
}
article .paragraph-header {
	font-size: 1.3rem;
	line-height: 1.4rem;
	display: block;
	padding-top: 4px;
	padding-bottom: 10px;
	font-weight: 500
}

    
    










/* =======================================

HEADER STYLES

=================================== */


h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
	font-style: normal;
	text-rendering: optimizeLegibility;
	line-height: 1.2;
}


h1 {
	color: #474747;
	font-size: 3.5rem;
	line-height: 3.9rem;
	font-weight: 500
}

h2 {
	font-size: 1.8rem;
	line-height: 2rem;
	color: #999999;
	padding-top: .5rem
}

h3 {
	font-size: 1.375rem;
	padding-bottom: 2rem;
	color: #000000
}

hr {
	border: solid #dddddd;
	border-width: 1px 0 0;
	clear: both;
	margin: 1.25rem 0 1.1875rem;
	height: 0;
}














/* =======================================

FOOTER STYLES

=================================== */

footer { 
	background: #4f91cd;
	padding:4rem 0;
	color: #95bbdd;
	font-size: .85rem;
	line-height: 1.3rem
}
footer a {
	color:#95bbdd
}

footer .smi {padding-bottom:2rem}
footer .smi a {padding:0 1rem}

.footerlinks li a{display:block;border-bottom:2px solid #7eadd8;margin-right:1rem;padding:.8rem 0 .8rem .8rem}

.footerlinks a {
	color:#ffffff
}

footer .title {color:#ffffff;font-weight:500;font-size:2rem;padding-bottom:4rem;}






/* =======================================

BLOG STYLES

=================================== */

.blog-list-container {
	border-bottom: 1px solid #cccccc;
	padding: 2rem 0 1.5rem 0;
}
.blog-list-container:first-child {
	padding-top: 0
}
.blog-list-container:last-child {
	border: none
}
.blog-list-title {
	font-size: 1.4rem;
}
.blog-list-date {
	font-weight: bold;
	line-height: 2rem
}
.blog-list-body {
}

.blog-list-authors {
	padding: 0;
	margin: 0;
	line-height: 1.5rem
}
.blog-list-authors li {
	list-style: none;
	padding: 0 1em 0 0;
	font-size: small;
	display: inline-block
}
.blog-list-authors li a:after {
	content: ",";
}
.blog-list-authors li:last-child a:after {
	content: "";
}

.blog-list-tags {
	padding: 0;
	margin: 0;
	line-height: 1.5rem
}
.blog-list-tags li {
	list-style: none;
	padding: 0 1em 0 0;
	font-size: small;
	display: inline-block
}
.blog-list-tags li a:after {
	content: ",";
}
.blog-list-tags li:last-child a:after {
	content: "";
}

.blog-right-recent {
	padding: 0;
	margin: 0;
}
.blog-right-recent li {
	list-style: none;;
	padding-bottom: .8rem;
	line-height: 1.3rem
}
.blog-right-tags {
	padding: 0;
	margin: 0;
	line-height: 1.5rem
}
.blog-right-tags li {
	list-style: none;;
	padding-bottom: .8rem;
	line-height: 1.3rem
}

.blog-detail-date {
	font-weight: bold;
	line-height: 2rems
}

.blog-detail-tags {
	padding: 2rem 0;
	margin: 0;
	line-height: 1.5rem
}
.blog-detail-tags li {
	list-style: none;
	padding: 0 1em 0 0;
	font-size: small;
	display: inline-block
}
.blog-detail-tags li a:after {
	content: ",";
}
.blog-detail-tags li:last-child a:after {
	content: "";
}

.blog-detail-authors {
	padding: 0;
	margin: 0;
	line-height: 1.5rem
}
.blog-detail-authors li {
	list-style: none;
	padding: 0 1em 0 0;
	font-size: small;
	display: inline-block
}
.blog-detail-authors li a:after {
	content: ",";
}
.blog-detail-authors li:last-child a:after {
	content: "";
}

.blog-detail-image {
	margin: 2rem 0
}
.blog-detail-video {
	margin: 2rem 0
}
.blog-detail-video iframe {
	width: 100%;
	max-width: 600px;
}
.blog-detail-body {
}












/* =======================================

MENU STYLES

=================================== */

nav {
	background: #599fde; /* Old browsers */
	background: -moz-linear-gradient(top,  #599fde 49%, #4f91cd 50%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(49%,#599fde), color-stop(50%,#4f91cd)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #599fde 49%,#4f91cd 50%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #599fde 49%,#4f91cd 50%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #599fde 49%,#4f91cd 50%); /* IE10+ */
	background: linear-gradient(to bottom,  #599fde 49%,#4f91cd 50%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#599fde', endColorstr='#4f91cd',GradientType=0 ); /* IE6-9 */
	
	
}

#navigation {
	padding: 0;
	margin: 0;
	


}

ul#navigation li {
	display: inline;
	font-size: 1rem;
	font-weight: 500;
	margin: 0;
	padding: 0;
	float: left;
	position: relative;
}
ul#navigation li:last-child {
}

ul#navigation li a {
	padding: 0px 20px 0px 20px;
	line-height: 60px;
	color: #ffffff;
	text-decoration: none;
	display: inline-block;
	border-right:1px #5b9ad3 solid
}
ul#navigation li a:hover {
	color: #ffffff;
}

ul#navigation li:hover > a {
}


/* on */

ul#navigation li.on {
}
ul#navigation li.on a {
	color: #fffff;
}
ul#navigation li.on a:hover {
}
ul#navigation li.on:hover > a {
}

/* subpages icon */

ul#navigation li a.subpages,ul#navigation li a.subpages:hover {
	background-image: url(/National_Library/20160526010038oe_/https://www.stopthinkconnect.org/base/images/subpages.png) ;
	background-position: right ;
	background-repeat: no-repeat;
}



/* Drop-Down Navigation */
ul#navigation li:hover > ul {
	visibility: visible;
	opacity: 1;
	margin-top: 0px;
	margin-left: -1px;
}

ul#navigation ul, ul#navigation ul li ul {
	list-style: none;
	margin: 0;
	padding: 0;
	visibility: hidden;
	position: absolute;
	z-index: 99999;
	width: 200px;
	background: #efefef;
	opacity: 0;
	-webkit-transition: opacity 0.2s linear, visibility 0.2s linear;
	-moz-transition: opacity 0.2s linear, visibility 0.2s linear;
	-o-transition: opacity 0.2s linear, visibility 0.2s linear;
	transition: opacity 0.2s linear, visibility 0.2s linear;
}

ul#navigation ul {
	top: 40px;
	left: 1px;
}

ul#navigation ul li ul {
	top: 0;
	left: 201px;
}

ul#navigation ul li {
	font-weight: normal;
	font-size: 14px;
	clear: both;
	width: 100%;
	border: 0 none;
	border-bottom: 1px solid #c9c9c9;
}

ul#navigation ul li a:link,ul#navigation ul li a:visited {
	background-color: none;
	padding: 7px 15px;
	color: #333333;
	text-decoration: none;
	display: inline-block;
	border: 0 none;
	float: left;
	clear: both;
	width: 170px;
	line-height: 18px;
	background: #efefef;
}

ul#navigation ul li a:hover,ul#navigation li.on ul li a:hover {
	background-color: none;
	padding: 7px 15px;
	color: #ffffff;
	text-decoration: none;
	display: inline-block;
	border: 0 none;
	float: left;
	clear: both;
	width: 170px;
	line-height: 18px;
	background: #666666;
}
ul#navigation li a.first {
	border-left: 0 none;
}

ul#navigation li a.last {
	border-right: 0 none;
}