/*
Theme Name: The Authority
Author: Peter Laudermilch Design, Inc.
Author URI: https://peterlaudermilch.com/
Description: A custom, responsive theme for the Pennsylvania Auto Theft Prevention Authority.
Version: 1.0
License: Private
License URI: ---
Text Domain: watchyourcar
*/

body {
	background-color: #000;
}

.underline {
	text-decoration: underline;
}

.homepage-title {
	margin-top: 75px;
	color:#0072dd;
}

h1, h2 {
	text-align: center;
}

h3, h4, h5, h6, p.subheading {
	color: #666;
	margin-bottom: .75em;
	margin-top: .75em;
}

p.subheading {
    font-size: 1.4375rem;
	line-height: 1.2;
}

h5, h6 {
	color: #333;
}

.blue {
	color:#0072dd;
}

#media-container dl {
	background: url(images/border_bg.png) left bottom repeat-x;
}

#media-container dt {
	float: left;
	clear: left;
	padding-top: 0.75rem;
	background: url(images/border_bg.png) left top repeat-x;
}

#media-container dd {
	margin: 0 0 0 80px !important;
	padding: 0.75rem 0 0.75rem 0;
	font-size: 1.5rem;
	line-height: 1.3em;
	background: url(images/border_bg.png) left top repeat-x;
}

#media-container dd:before {
	content: url(images/right_arrow_blue.svg);
	float: right;
	margin-left: 2rem;
}

#media-container dd a:link {
	color: #666;
}

#media-container dd a:active, dd a:hover {
	color: #0072dd;
}

#article-container dl:first-child {
	background: url(images/border_bg.png) left top repeat-x;
    margin-bottom: 0;
}

#article-container dt {
	float: left;
	clear: left;
	padding-top: 0.6rem;
    font-weight: bold;
}

#article-container dd {
    margin: 0;
	padding: 0.6rem 0 0.6rem 7rem;
	background: url(images/border_bg.png) left bottom repeat-x;
}

#article-container dt.description-title {
	width: 100%;
}

#article-container dd.description-content {
	padding: 0.6rem 0 0.6rem 0;
}

#article-container dd p {
  margin-bottom: 10px;
}

#article-container dd p:last-child {
    margin-top: 0.5em; 
}

#article-container img {
    border: 1px solid #CCC;
    width: 100%;
    max-width: 300px;
}
  
ul.square li {
	line-height: 1.4rem;
	padding: 0rem 0rem .75rem .5rem;
}

.atpa-container {
	padding-top: 50px;
	padding-bottom: 70px;
	background-color: #FFF;
}

.atpa-container h1, .atpa-container h2 {
	padding-bottom: 1rem;
}

.blue-slide h2, .blue-slide h3 {
	color: #FFF;
}

.blue-slide p, .blue-slide li, .blue-slide a:link, .blue-slide a:visited {
	color: #59c9ef;
}

.blue-slide a:hover, .blue-slide a:active {
	color: #FFF;
}

.blue-slide {
	background: -webkit-linear-gradient(#0053af, #0072dd); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(#0053af, #0072dd); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(#0053af, #0072dd); /* For Firefox 3.6 to 15 */
	background: linear-gradient(#0053af, #0072dd); /* Standard syntax */
	background-color: #0053af;
}

.down-arrow {
	margin: 20px 0 100px 0;
	text-align: center;
}

.interior-between {
	background-color: #FFF;
}

.interior-between .columns {
	border-top: 1px solid #CCC;
}

#interior-title-container h1, #interior-title-container p {
	color: white;
}

#interior-title-container p {
    font-size: 1.6875rem;
    line-height: 1.2em;
}

#interior-title-container {
	background:url(images/title-slide-pattern.png) left top fixed;
	padding: 75px 0 75px 0; 
	color: #FFF;
}

#interior-container-rule {
    padding-top: 20px;
    background-color: #FFF;
}

#interior-container-rule hr {
    margin-bottom: 0;
}

.printButton {
	float: right;
}

.printButton img {
	border: none !important;
	width: 14px !important;
	height: 14px;
	margin-right: 5px;
}


@media only screen and (max-width: 500px) { 

	.circle-icons li img { float: left; height: 95px; width: 95px; }
	.circle-icons li p, .circle-icons h3 { margin-left: 120px; margin-top: 0px; }
	.circle-icons > li { padding: 20px 0px 0px 0px; margin-bottom: 20px; border-top: 1px solid #40b2e6; }

    #interior-title-container p {
        font-size: 1.375rem;
        line-height: 1.2em;
    }  
	
}

@media only screen and (max-width: 700px) { 

	#article-container img {
		margin-top: 2em;
	}    
	
}




/* ------------------------------------------------------------------*/
/* Header */
/* ------------------------------------------------------------------*/

#header-top-bar {
	background-color: #333;
	color: #999;
	height: 2.5em; /* 40px */
	padding: 0 1rem 0 1rem;
	font-family: "TradeGothicLTPro"
}

#header-top-left {
	float: left;
	margin-top: 8px;
	font-size: 0.9375rem;
	color: #999;
}

h1#header-top-left {
	margin-top: 10px;
}

#header-top-right {
	float: right;
	margin-top: 10px;
	font-size: 0.8125rem;
}

#header-top-bar a:link, #header-top-bar a:active, #header-top-bar a:hover, #header-top-bar a:visited {
	color: #FFF;
}

.top-bar, .tab-bar {
	line-height: 2.9375rem;
}

.top-bar .title-area, .tab-bar .tab-bar-section {
	text-align: left;
	padding-left: 1rem;
}

.top-bar-section ul li {
	background-color: #0072DD;
}

#top-bar-search-2 {
	display: none;
	height: 40px;
}

#top-bar-search-2 form {
	margin: 0 10px 0 0;
}

#top-bar-search-2 form input {
	width: 200px;
}

.top-bar .button, .top-bar button {
	padding-top:0.375rem;
	line-height:1rem;
	background-color: #0053af;
}

.off-canvas-list form {
	margin: 1rem 1rem 0px 1rem;
}

@media only screen and (max-width: 768px) { 

#header-top-left { display: none; }

}

@media only screen and (max-width: 849px) { 

.top-bar { display: none; }

}

@media only screen and (min-width: 850px) { 

.tab-bar { display: none; }

}



/* ------------------------------------------------------------------*/
/* Homepage - Title Slide */
/* ------------------------------------------------------------------*/

#title-container {
	/*background-image: url(images/title-slide-bg.jpg);
	background-attachment: fixed;
	background-repeat: no-repeat; 
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;*/
	height: 660px;
}

#title-inner {
	display:table;
	background:url(images/title-slide-pattern.png) left top fixed; 
	position: relative;
	height: 100%;
	width: 100%;
}

#title-content {
	display:table-cell;
	vertical-align: bottom;
	width: 960px;
	text-align:center;
	padding: 0 45px 0px 45px;
}

#title-logo {
	max-width: 960px;
	display: none;
}

#title-text {
	margin-top: 50px;
	margin-bottom: 50px;
}

#title-text p {
	color:#FFF;
	font-size: 2.75rem;
	line-height: 1.1;
	margin: 0px;
}

@media only screen and (max-width: 1024px) { 

#title-container {
	background-attachment: scroll;
}

}

@media only screen and (max-width: 900px) { 

/*#title-container, #title-inner { height: 640px; }*/

}

@media only screen and (max-width: 700px) { 

/*#title-content { padding-bottom: 60px; }
#title-container, #title-inner { height: 520px; }*/

}

@media only screen and (max-width: 400px) { 

#title-content { padding: 0 15px 0px 15px }
#title-container, #title-inner { height: 390px; }
#title-logo-container { display: none; }
#title-text p { font-size: 2.125rem; }

}

/* ------------------------------------------------------------------*/
/* Homepage - Promotion Slide */
/* ------------------------------------------------------------------*/

#promotion-container {
	text-align: left;
	padding-bottom: 70px;
	background-color:#FFFFFF;
}

#promotion-content {
	margin-top: 50px;
}

#promotion-content h2 {
	text-align: left;
	color: #999999;
}

#promotion-content a.button {
	display: block;
}

@media only screen and (max-width: 900px) {
	
#promotion-container {
	text-align: center;
}

#promotion-content {
	margin-top: 40px;
}

#promotion-content h2 {
	text-align: center;
	margin-top: 35px;
}

#promotion-content a.button {
	margin-right: 40px;
	margin-left: 40px;
}

	
}



/* ------------------------------------------------------------------*/
/* Homepage - Why You Should Care Slide */
/* ------------------------------------------------------------------*/

#care-content {
	padding: 0 7.5% 0 7.5%;
}

#care-columns {
	margin-top: 80px;
	text-align:left;
}

#care-columns p {
	font-size: 0.9375rem;
	letter-spacing: .025rem;
	line-height: 1.2rem;
	margin-top: 15px;
}

#care-columns p b {
	color: #FFF;
	font-style: normal;
}

@media only screen and (max-width: 500px) { 


}

@media only screen and (max-width: 500px) { 

#grantees-content {
	padding: 0 7.5% 0 7.5%;
}
#grantees-content ul li ul { margin-left: 138px; }


}



/* ------------------------------------------------------------------*/
/* Homepage - Top 10 Cars Slide */
/* ------------------------------------------------------------------*/

.puffer {
	color: white;
	max-width: 740px;
	margin-left: auto;
	margin-right: auto;
	padding: 50px 20px;
	font-size: 24px;
	font-family: "TradeGothicLTPro";
}

@media (max-width: 468px) {
	.puffer {
		font-size: 20px;
		padding: 50px 10px;
	}
}

.puffer .mt30 {
	line-height: 1.3;
	margin-top: 30px;
}

.puffer--logo {
	float: left;
	width: 120px;
	margin-right: 40px;
}

@media (max-width: 600px) {
	.puffer--logo {
		float: none;
		text-align: center;
		width: auto;
		margin-bottom: 30px;
	}

	.puffer--logo img {
		width: 110px;}
}

.puffer--def {
	overflow: hidden;
}

.clearfix:after {
	content: "";
	display: table;
	clear: both;
}

.facebook-svg {
	height: 22px;
	width: auto;
}
.facebook-svg path {
	fill: white;
}

.white {
	color: white!important;
}

#top10-between {
	/*background-image: url(images/title-slide-bg.jpg);
	background-attachment: fixed;
	background-repeat: no-repeat; 
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;*/
	/*height: 200px;*/
}

#top10-between .row {
	background:url(images/title-slide-pattern.png) left top fixed; 
	/*height: 200px;*/
	width: 100%;
	max-width: 100%;

}

#top10-container {
	text-align: center;
	background-color:#FFFFFF;
}

#top10-message span {
	font-size: 50%;
	vertical-align: super;
}

#top10-message p {
	line-height: 1.4;
	color: #999999;
	text-align: left;
}

#top10-cars {
	margin-bottom: 50px;
}

#top10-cars li {
	position: relative;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	border-right: 2px solid #FFF;
	border-bottom: 2px solid #FFF;
	padding: 0;
}

.top10-carnames {
	position: absolute;
	bottom: 0;
	left: 0;
	background: url(images/transparentBG-K65.png);
	width: 100%;
	text-align:left;
	padding: 10px;
}

.top10-carnames p {
	margin: 0px;
	font-size: .875rem;
	line-height: 1.2;
}

.top10-carnames p.carmake {
	color: #FFF;
}

.top10-carnames p.caryear {
	color: #999;
}

.top10-carnames p.carnumber {
	color: #FFF;
	float: right;
	font-size: 1.75rem;
}

@media only screen and (max-width: 1024px) { 

#top10-between {
	background-attachment: scroll;
}

}

@media only screen and (max-width: 900px) and (min-width: 701px) {

#top10-container {
	padding-left: 15%; padding-right: 15%; 
}

}



/* ------------------------------------------------------------------*/
/* Homepage - About ATPA Slide */
/* ------------------------------------------------------------------*/

.orbit-container {
	height: 100%;
	overflow: hidden;
	background-color:#FFFFFF;
}

#about-orbit {
	background-color: #000;
}

#about-orbit, #about-orbit li {
	height: 100% !important;
	overflow: hidden;
}

.orbit-image-fitHeight {
	height: 100% !important;
	max-width: none !important;
	width: auto;
}

.orbit-image-fitWidth {
	max-width: none !important;
	width: 100%;
}

#about-orbit h2 {
	color: #FFF;
	text-align: center;
}

#about-orbit .orbit-caption {
	bottom: 10%;
}

.orbit-timer, .orbit-slide-number {
	display: none;
}

.orbit-bullets-container {
	position: absolute;
	bottom: 12%;
	z-index: 98;
	width:200px;
    margin-left:-100px;
    left:50%;
}

.touch .orbit-container .orbit-prevATPA, .touch .orbit-container .orbit-nextATPA {
    display: inherit;
}

.orbit-container .orbit-nextATPA {
	background: url(images/arrow-right-whiteTrans.png) no-repeat;
	background-position: center;
    right: 15px;
}

.orbit-container .orbit-nextATPA:hover {
	background: url(images/arrow-right-white.png) no-repeat;
	background-position: center;
}

.orbit-container .orbit-prevATPA {
	background: url(images/arrow-left-whiteTrans.png) no-repeat;
	background-position: center;
    left: 15px;
}

.orbit-container .orbit-prevATPA:hover {
	background: url(images/arrow-left-white.png) no-repeat;
	background-position: center;
}

.orbit-container .orbit-prevATPA, .orbit-container .orbit-nextATPA {
	position: absolute;
	bottom: 50%;
	width: 30px;
	height: 50px;
	z-index: 10;
}

@media only screen and (max-width: 500px) {

#about-orbit .orbit-caption {
	bottom: 0;
	padding-bottom: 40px;
}

#about-orbit .orbit-caption .row .columns {
	padding-right: 1.5rem;
    padding-left: 1.5rem;
}

#about-orbit .orbit-caption p {
	font-size: 0.875rem;
	line-height: 1.4;
}

.orbit-bullets-container {
	bottom: 0px;
}

.touch .orbit-bullets {
    display: block;
}

.touch .orbit-container .orbit-prev, .touch .orbit-container .orbit-next {
    display: block;
}

.orbit-container .orbit-nextATPA {
	background-position: center;
	background-size: 40%;
    right: 0px;
}

.orbit-container .orbit-nextATPA:hover {
	background-position: center;
	background-size: 40%;
}

.orbit-container .orbit-prevATPA {
	background-position: center;
	background-size: 40%;
    left: 0px;
}

.orbit-container .orbit-prevATPA:hover {
	background-position: center;
	background-size: 40%;
}

.orbit-container .orbit-prevATPA, .orbit-container .orbit-nextATPA {
    position: absolute;
	bottom: 120px;
    width: 30px;
    height: 50px;
    z-index: 10;
}

}



/* ------------------------------------------------------------------*/
/* Homepage - What to Do Slide */
/* ------------------------------------------------------------------*/

#what-to-do-container {
	text-align: center;
	min-height: 650px;
	padding-bottom: 70px;
	background-color:#FFFFFF;
}

#what-to-do-content {
	margin-top: 50px;
}

#what-to-do-content ol {
	text-align: left !important;
	margin-left: 0px;
}

#what-to-do-content ol li.first {
	background: url(images/what-to-do-number1.svg) no-repeat;
}

#what-to-do-content ol li.first.no-svg {
	background: url(images/what-to-do-number1.png) no-repeat;
}

#what-to-do-content ol li.second {
	background: url(images/what-to-do-number2.svg) no-repeat;
}

#what-to-do-content ol li.second.no-svg {
	background: url(images/what-to-do-number2.png) no-repeat;
}

#what-to-do-content ol li.third {
	background: url(images/what-to-do-number3.svg) no-repeat;
}

#what-to-do-content ol li.third.no-svg {
	background: url(images/what-to-do-number3.png) no-repeat;
}

#what-to-do-content ol li {
	list-style-type: none;
	padding-left: 40px;
	padding-bottom: 15px;
	padding-top: 2px;
}

.what-to-do-video {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; 
    height: 0; 
    overflow: hidden;
	margin-bottom: 30px;
}
.what-to-do-video iframe,
.what-to-do-video object,
.what-to-do-video embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#what-to-do-content a.button {
	display: block;
	max-width: 900px;
	margin-left: 40px;
	margin-right: 40px;
}


/* ------------------------------------------------------------------*/
/* Home Page - Banner Image (Great Gasoline Giveaway)
/* ------------------------------------------------------------------*/
.banner-img {
	width: 100%;
}

/* ------------------------------------------------------------------*/
/* About Page - About The Authority */
/* ------------------------------------------------------------------*/

#about-container h3 {
	margin-top: 0px;
}

#about-intro-content {
	padding-right: 5%;
	padding-bottom: 50px;
}

#graphic-7dollarReturn {
	padding-left: 5%;
	border-left: 1px solid #CCC;
}

#graphic-7dollarReturn p {
	color:#0072dd;
}

#about-staff-member {
	margin-top: 1.875em;
}

@media only screen and (max-width: 700px) { 

#about-intro-content {
	padding-bottom: 0;
}

#graphic-7dollarReturn {
	padding-left: 0.9375rem;
}

#graphic-7dollarReturn p {
	border-top: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	padding-top: 1.25rem;
	padding-bottom: 1.5rem;
	margin-bottom: 2.5rem;
}

}

/* ------------------------------------------------------------------*/
/* About Page - Board of Directors */
/* ------------------------------------------------------------------*/

#board-container p, #pact-container p {
	line-height: 1.4;
}

@media only screen and (min-width: 901px) { 

.board-member-5 {
	 margin-left: 12.4999999965%; !important
}

}

@media only screen and (max-width: 500px) { 

#board-content ul li {
	padding-bottom: 0px;
	width: 100%;
}

#board-content {
	text-align: center;
}

}

/* ------------------------------------------------------------------*/
/* About Page - ATPA Grantees */
/* ------------------------------------------------------------------*/


/* ------------------------------------------------------------------*/
/* About Page - Employment */
/* ------------------------------------------------------------------*/


/* ------------------------------------------------------------------*/
/* About Page - Contact */
/* ------------------------------------------------------------------*/

#contact-container {
	padding-bottom: 70px;
}

#contact-container p {
	font-size: 1.6875rem;
	margin-bottom: .75em;
	margin-top: .75em;
	line-height: 1.2em;
}

@media only screen and (max-width: 500px) { 

#contact-container p {
	font-size: 1.375rem;
}

}

/* ------------------------------------------------------------------*/
/* Media Page - Annual Reports */
/* ------------------------------------------------------------------*/

/*#annual-title {
	background: url(images/border_bg.png) left bottom repeat-x;
}*/

#annual-content img {
	width: 100%;
	height: auto;
	border: 1px solid #CCC;
}

#annual-content ul li p {
	margin-top: 0.625rem;
	margin-bottom: 0rem;
	text-align: center;
}

#annual-content div.report-highlight {
	margin-bottom: 3rem;
	padding-top: 1rem;
	padding-bottom: 1rem;
	background: url(images/border_bg.png) left bottom repeat-x;
}

#annual-content div.report-highlight h3 {
	margin-top: 0;
}

#annual-content div.report-highlight img {
	margin-bottom: 1rem;	
}

.annual-report-image, #annual-post-content img {
	border: 1px solid #CCC;
}

@media only screen and (max-width: 500px) { 

#annual-content ul li {
	width: 100%;
}

}


/* ------------------------------------------------------------------*/
/* Media Page - Press Releases, Media Mentions, Annual Reports */
/* ------------------------------------------------------------------*/

#press-post-content h2 {
	text-align: left;
}

#annual-post-content h2 {
	text-align: left;
	padding-bottom: 1rem;
}

#annual-post-content img {
	margin-bottom: 1rem;
}

/* ------------------------------------------------------------------*/
/* Additional Pages */
/* ------------------------------------------------------------------*/

#article-container h1 {
    text-align: left;
    font-size: 2.75em;
}

#article-container h1.leftalign {
}

.search-results-container h2 {
	text-align: left;
}

.search-results-container h4 {
	margin-bottom: .25rem;
	margin-top: 0;
}

.search-results-container .entry-container p  {
	margin-bottom: 0;
}

.search-results-container .entry-container {
	padding: .75rem 0;
	background: url(images/border_bg.png) left top repeat-x;
}

ul#resources-content li {
	background: url(images/border_bg.png) left bottom repeat-x;
	padding-bottom: 0.75rem;
	padding-top: 0.75rem;
	list-style-type: none;
}

ul#resources-content {
	padding: 0 0 0 0;
	margin-left: 0;
	font-size: 1.5rem;
	line-height: 1.3em;
	background: url(images/border_bg.png) left top repeat-x;
}

ul#resources-content li:before {
	content: url(images/right_arrow_blue.svg);
	float: right;
	margin-left: 2rem;
}

#pact-container ul {
    margin-left: 0;
}

#pact-container li {
    padding-bottom: 0;
    border-top: 1px solid #EEE;
}

#pact-container hr {
    margin-top: 2.5em;
    margin-bottom: 2em;
}

#media-kit-container {
    padding-top: 50px;
    padding-bottom: 0px;
    background-color: #FFF;
}

.media-kit-h2 {
    font-size: 2.25em;
}

.media-kit-video {
	  margin-bottom: 0px !important;
}


#contact-container p.media-kit-p {
    font-size: 1.375em;
}

@media only screen and (max-width: 500px) { 

#article-container h1 {
    font-size: 2.125em;
}

}


/* ------------------------------------------------------------------*/
/* Footer */
/* ------------------------------------------------------------------*/

/*.off-canvas-wrap, .inner-wrap, .main-section {
	height: 100%;
}*/

#footer {
	background: #333333 url(images/title-slide-pattern.png);
	color: #999;
}

#footer .row {
	padding-top: 40px;
	padding-bottom: 40px;
}

#footer p {
	font-size: 0.875rem;
}

#footer p.authority {
	font-size: 1.1875rem;
}

#footer p.footnote {
	color: #666;
}

#footer a {
	color: #FFF;
}

#footerShim {
	background-color: #FFF;
}




/* ------------------------------------------------------------------*/
/* Printing */
/* ------------------------------------------------------------------*/

@media print {
      @for $i from 1 through $total-columns {
    .medium-#{$i} {
      width: grid-Calc($i, $total-columns);
    }
  }
    html, body {
        font-size: 12px;
    }
    @page {
        margin: 0.75in;
    }
    .atpa-container {
        padding-top: 0px;
        padding-bottom: 0px;
    }
    #footer {
        margin-top: 0 !important;
    }
    #footer .row {
        padding-top: 0.25in;
        padding-bottom: 0px;
    }
    #footer p {
        margin: 0;
    }
    img {
        width: 200px !important;
    }
    div > a:after {
        display: none;
    }
    h1 a:after {
        display: none;
    }
	.printButton {
        display: none;
	}
}