/*
Theme name: DVCC
Description: Custom Theme
*/

/******* DVCC WordPress CSS *******/

/* Common elements styling */
.post .entry h1 { font-size: 20px; line-height: 24px}
.post .entry h2 { font-weight: bold; font-size: 18px; line-height: 24px; } /* line-height of 34px removed 25-Nov-2014 by PET due to problem with mobile rendering */
.post .entry h3 { font-weight: bold; font-size: 16px; line-height: 20px; } /* line-height of 64px removed 25-Nov-2014 by PET due to problem with mobile rendering */
.post .entry h4 { font-size: 14px; line-height: 21px}
.post .entry h5 { font-size: 12px; line-height: 18px}
.post .entry h6 { font-size: 10px; line-height: 15px}

.post .entry ul { margin-left: 25px; }
.post .entry ol { margin-left: 25px; }
.post .entry a img { border: 0 }

p img { padding: 0;	max-width: 100%; }
img.centered { display: block; margin-left: auto; margin-right: auto; }
img.alignright { margin: 2px 0 2px 7px; display: inline; }
img.alignleft { margin: 2px 7px 2px 0; display: inline; }
.alignright { float: right; display: inline; }
.alignleft { float: left; display: inline; }
.aligncenter, div.aligncenter { display: block; margin-left: auto; margin-right: auto; }

/* Calendar widget */
#wp-calendar { empty-cells: show; margin: 10px auto 0; }
#wp-calendar #next a { padding-right: 10px; text-align: right; }
#wp-calendar #prev a { padding-left: 10px; text-align: left; }
#wp-calendar a { display: block; }
#wp-calendar caption { text-align: center; width: 100%; }
#wp-calendar td { padding: 3px 0; text-align: center; }
.wp-caption { border: 1px solid #ddd; text-align: center; padding-top: 4px; margin: 10px; }
.wp-caption img { margin: 0; padding: 0; border: 0 none; }
.wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; padding: 0 4px 5px; margin: 0;}

/* Big images in rich text editor should not break page layout */
.post .entry { overflow: hidden; } 

/******* /DVCC WordPress CSS *******/

/* =========================================================================
	#Reset
========================================================================= */
* { margin: 0; padding: 0; outline: 0; }

/* =========================================================================
	#Base
========================================================================= */
html,
body { height: 100%; }

body { min-width: 1030px; background: #d1d2d6; font-family: Arial, serif; font-size: 14px; line-height: 1.65; color: #3d3d3d; }

img { border: 0; vertical-align: middle; }

a { cursor: pointer; text-decoration: none; color: #1b1c6e; }
a:hover { text-decoration: underline; }
a:hover,
a:focus { color: #3d3d3d; outline: 0; }
a:focus { text-decoration: none; }

h1,
h2,
h3,
h4,
h5,
h6 { font-weight: 400; line-height: 1.2; }

h2,
h2 a,
h2 a:hover { color: #1b1c6e; }

h1 { font-size: 26px; line-height: 2.5;}
h2 { font-size: 24px; } /* line-height of 0.5 removed 25-Nov-2014 by PET due to problem with mobile rendering */
h3 { font-size: 20px; }
h4 { font-size: 18px; }
h5 { font-size: 15px; }
h6 { font-size: 13px; }

hr { border-top: 1px solid #ccc; }

/* =========================================================================
	#Helpers
========================================================================= */
.alignleft { float: left; }
.alignright { float: right; }

.clearfix:before,
.clearfix:after { display: table; content: " "; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

/* =========================================================================
	#Wrapper
========================================================================= */
.wrapper { position: relative; top: 0; left: 0; overflow: hidden; min-height: 100%; }
.shell { width: 1000px; margin: 0 auto; background: #1b1c6e; }

/* =========================================================================
	#Nav Top
========================================================================= */
.nav-top { padding: 19px 0 16px; text-align: right; }
.nav-top ul { overflow: hidden; display: inline-block; *display: inline; *zoom: 1; margin-bottom: 0; list-style: none outside none; }
.nav-top li { float: left; text-align: center; }
.nav-top li + li { padding-left: 20px; background: url(/AppResources/images/nav-top2.png) no-repeat 7px 50%; }
.nav-top a { display: block; padding: 0 20px; color: #d1d2d6; }
.nav-top a:hover,
.nav-top .current-menu-item a { color: #fff; text-decoration: none; }

.nav-top a.active 
{
	color: #fff;	
}

/* =========================================================================
	#Header
========================================================================= */
.header { position: relative; top: 0; left: 0; }

/* =========================================================================
	#Logo
========================================================================= */
.logo {display:none}{ position: absolute; top: 14px; left: 17px; overflow: hidden; display: block; width: 340px; height: 70px; background: url(images/logo.png) no-repeat 0 0; white-space: nowrap; text-indent: 110%; }

/* =========================================================================
	#Slider
========================================================================= */
.slider,
.slide { position: relative; top: 0; left: 0; }
.slider-clip { *position: relative; overflow: hidden; }
.slides { overflow: hidden; margin-bottom: 0; list-style: none outside none; }
.slide { float: left; width: 100%; height: auto; }
.slide img { max-width: 100%; height: auto; }

/* =========================================================================
	#Nav
========================================================================= */
.nav { padding: 19px 0 16px; }
.nav ul { overflow: hidden; margin-bottom: 0; list-style: none outside none; }
.nav li { float: left; text-align: center; }
.nav li + li { padding-left: 20px; background: url(/AppResources/images/nav.png) no-repeat 1px center; }
.nav a { display: block; padding: 0 24px; color: #d1d2d6;}
.nav a:hover,
.nav .current-menu-item a { color: #fff; text-decoration: none; }
.nav a.active { color: #fff; text-decoration: none; }

.nav .mobile-menu { position: absolute; top: 10px; right: 20px; display: none; width: 24px; height: 15px; border-top: 9px double #fff; border-bottom: 3px solid #fff; }
.nav-top .mobile-menu-top { position: absolute; top: 10px; right: 20px; display: none; width: 24px; height: 15px; border-top: 9px double #fff; border-bottom: 3px solid #fff; }

/* =========================================================================
	#Main
========================================================================= */
.main { background: #eceaea; padding: 0 30px; }
.main .pagetitle { text-align: left; font-size: 30px; margin-left: 0; margin-bottom: -10px;  margin: 8px 0 16px 0; } /* padding-top of 30px removed 25-Nov-2014 by PET - too much empty space at top of page */

/* =========================================================================
	#List Intro
========================================================================= */
.list-intro { padding: 29px 1px 0; margin-bottom: 0; list-style: none outside none; }
.list-intro li { padding-bottom: 10px; }
.list-intro li + li { padding-top: 29px; background: url(/AppResources/images/divider.png) no-repeat center 0; }
.intro-thumb { padding-top: 5px;  }
.intro-thumb img { width: 141px; }
.intro-thumb:hover { opacity: .8; filter: alpha(opacity=80); }
.intro-content h2 { padding-bottom: 1px; margin-top: 0; }
.intro-content .more a { color: #1b1c6e; text-decoration: underline; }
.intro-content .more a:hover { text-decoration: none; }

/* =========================================================================
	#Entry
========================================================================= */
.post { padding: 15px; }
.entry ul,
.entry ol { margin: 0 0 10px 25px; }
.entry img.alignleft { margin: 0 20px 10px 0; }
.entry img.alignright { margin: 0 0 10px 20px; }
.nav-single { overflow: hidden; padding-bottom: 10px; }

/* =========================================================================
	#Footer
========================================================================= */
.footer { padding: 21px 0 14px; background: url(images/footer-divider.png) no-repeat center 25px; line-height: 2; color: #d1d2d6; }
.footer .col-md-4 .footer-col { padding-left: 42px; }
.footer .col-md-4 ~ .col-md-4 .footer-col { padding-left: 28px; }
.footer a { color: #d1d2d6; }

/* ==========================================================================
	#pagination
========================================================================== */
.paging { text-align: center; padding: 10px 0;  }
.paging a,
.paging span { font-size: 16px; display: inline-block; margin: 0 5px; }
.paging a { color: #44461c; } 
.paging a:hover { text-decoration: none; }
.paging span { color: #7b7c57; }

/* ==========================================================================
	#Blog
========================================================================== */
.postmetadata a { color: #44461c; font-weight: bold; }
.entry-image {float: left; margin-right: 20px; }
.entry-image img { height: auto; padding-bottom: 20px; }

.error404 .entry a { color: #44461c; font-weight: bold;  }
/* ==========================================================================
	#Comments
========================================================================== */
.comments { padding: 15px; }
.comments input,
.comments textarea { overflow: hidden; border: 1px solid #c9d2d9; padding: 2px 5px;   }
.comments input,
.comments textarea { width: 75%; }
.comments label { display:block; }
.comments a { color: #44461c; }
.comments #submit { text-align: center; padding: 10px 7px 8px; }
.comments #submit:hover { cursor: pointer; background: #c9d2d9; }
.comments { display:block; clear: both; padding-top: 8px;  }
.comments > h3 { padding-bottom: 10px; }
.comments .comment-respond .comment-reply-title { padding-top: 10px; }
.commentlist { list-style: none outside none; }
.commentlist li ~ li { border-top: 1px solid  #ccc; padding-top: 10px; }

.commentlist li .children { padding-left: 30px; list-style: none outside none; padding-top: 10px;  }

.commentlist .comment-author img { float:left; margin-right: 5px; }
.commentlist .comment-author { font-weight: bold; }
.commentlist .comment-meta { font-weight: bold; }
.commentlist .comment-text { display:block; clear: both; padding-top: 4px; }
.commentlist .comment-reply a { font-weight: bold; font-size: 14px;  }

/* =========================================================================
	#Media Queries
========================================================================= */
@media only screen and (max-width: 1030px) {
	/* Base */
	body { min-width: 320px; }
}

@media only screen and (max-width: 1000px) {
	/* Shell */
	.shell { width: auto; }

	/* Nav */
	.nav { text-align: center; }
	.nav ul { display: inline-block; *display: inline; *zoom: 1; }
	.nav a { min-width: 0; padding: 0 20px; }

	.nav-top { text-align: center; }
	.nav-top ul { display: inline-block; *display: inline; *zoom: 1; }
	.nav-top a { min-width: 0; padding: 0 20px; }

	/* List intro */
	.list-intro li + li { background-size: 94% 13px; }

	/* Footer */
	.footer { background-size: 37% 83px; }
}

@media only screen and (max-width: 992px) {
	.intro-thumb { text-align: center; }
}

@media only screen and (max-width: 850px) {
	/* Nav */
	.nav { text-align: center; }
	.nav ul { display: inline-block; *display: inline; *zoom: 1; }
	.nav a { min-width: 0; padding: 0 10px; }

	.nav-top { text-align: center; }
	.nav-top ul { display: inline-block; *display: inline; *zoom: 1; }
	.nav-top a { min-width: 0; padding: 0 10px; }

}

@media only screen and (max-width: 767px) {
	/* Nav Top */
	.nav-top a { min-width: 0; padding: 0 20px; }

	/* Nav */
	.nav { position: relative; top: 0; left: 0; text-align: right; }
	.nav ul { overflow: visible; display: none; }
	.nav li { float: none; }
	.nav li + li { padding-left: 0; background: transparent; }
	.nav a { padding: 0; white-space: nowrap; }

	.nav .mobile-menu { display: block; }

	.nav-top { position: relative; top: 0; left: 0; text-align: right; }
	.nav-top ul { overflow: visible; display: none; }
	.nav-top li { float: none; }
	.nav-top li + li { padding-left: 0; background: transparent; }
	.nav-top a { padding: 0; white-space: nowrap; }

	.nav-top .mobile-menu-top { display: block; }
	
	.comments input,
	.comments textarea { width: 100%; }

	/* List Intro */
	.intro-thumb { padding-bottom: 10px; text-align: left; }

	/* Footer */
	.footer { background: transparent; padding-right: 10px; padding-left: 10px; }
	.footer .col-md-4 .footer-col,
	.footer .col-md-4 ~ .col-md-4 .footer-col { padding-left: 0; }
}

@media only screen and (max-width: 990px) {

	/* Nav */
	.nav { position: relative; top: 0; left: 0; text-align: right; }
	.nav ul { overflow: visible; display: none; }
	.nav li { float: none; }
	.nav li + li { padding-left: 0; background: transparent; }
	.nav a { padding: 0; white-space: nowrap; }

	.nav .mobile-menu { display: block; }

	.nav-top { position: relative; top: 0; left: 0; text-align: right; }
	.nav-top ul { overflow: visible; display: none; }
	.nav-top li { float: none; }
	.nav-top li + li { padding-left: 0; background: transparent; }
	.nav-top a { padding: 0; white-space: nowrap; }
	
	.nav-top .mobile-menu-top { display: block; }
	
}



@media only screen and (max-width: 440px) {
	/* Nav Top */
	.nav-top a { padding: 0 4px; }
}


.login-form 
{
	width: 300px;	
}

.login-form label, .login-form input[type=text]
{
	width: 100%;	
}

.login-form input[type=submit]
{
	margin: 8px 0;
	padding: 4px 8px;
}

@media only screen and (max-width: 440px) {
	.login-form 
	{
		width: 90%;
	}
}


.banner 
{
	background: url('/AppResources/images/philadelphia-skyline-banner.jpg') no-repeat center top;
	height: 476px;
	width: 1000px;
	padding: 4px;
	font-size: 11px;
}

@media only screen and (max-width: 990px) {
	.banner 
	{
		background: url('/AppResources/images/philadelphia-skyline-banner.jpg') no-repeat center top;
		height: auto;
		min-height: 476px;
		width: 100%;
		font-size: 8px;
	}
}

@media only screen and (max-width: 440px) {
	.banner 
	{
		background: url('/AppResources/images/philadelphia-skyline-banner-mobile.jpg') no-repeat center top;
		height: auto;
		min-height: 200px;
		width: 100%;
		font-size: 6px;
	}
}