/*
* Skeleton V1.1
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 8/17/2011
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */

#headerNav ul {
	list-style-type: none;
}

#headerNav li {
	float:  left;
	margin-right:  18px;
	padding-right: 18px;
	border-right: solid 1px #E5E5E5;
	padding-bottom: 6px;
	padding-top: 6px;
	white-space: nowrap;
}

#headerNav li:last-child {
		border-right: solid 0px #E5E5E5;
}


#headerNav a {
	color: black;
	font-size: 12px;
	text-decoration: none;
	text-transform: lowercase;

	}
	
#headerNav a.nav-selected{
	color: #DB3039;
	border-top: solid 5px #DB3039;
	}
	
#headerNav a:hover{
	color: #DB3039;
 
}
	
#headerNav >div{
	padding-left: 160px;
	padding-top:1px;
	margin-top:78px;
	margin-bottom: 28px;
	height: 37px;

	}
	

#logo {
	padding:  0;
	margin:  0;
}

#logo a {
	display:  block;
	padding-top:  93px;  /*change to height of logo image*/
	height:  0;  
	width:  257px; /*change to width of logo image*/
	overflow:  hidden;
	background-image:  url('images/logo.png');
	background-repeat: no-repeat;
	margin-top: 32px;
}
#header-wrapper{
	background-image: url(images/header_back.png);
	background-position: top center;
	background-repeat: no-repeat;

	
	}


body{
	background-color: #F4F4F4;
	background-image: url(images/top_back.png);
	background-repeat: repeat-x;
	}


#banner {
	margin-top: 12px;
	height: 225px;
	background-image: url(images/banner_image3.jpg);
	}
	
.bannerheader {
	height: 54px;
	width: 619px;
	background-image: url(images/banner_back.png);
	border-right: solid 20px black;
	margin-top: 171px;
	}
.bannerheader p{
	color: white;
	font-size: 15px;
	padding-left: 20px;
	padding-top: 18px;
	}	

.ball {
	width: 30px;
	height:30px;
	background-image: url(images/ball.png);
	background-repeat: no-repeat;
	margin-left: 528px;
	margin-top: -15px;
	}
#body > div{
	margin-top: 25px;
	min-height: 400px;
	border-top: solid 1px #D3D3D3;
	border-left: solid 1px #D3D3D3;
	border-right: solid 1px #D3D3D3;
	border-bottom: solid 2px black;
	padding: 20px;
	background-color: white;
	}
	
#body h1{
	font-size: 24px;
	color: black;
	border-left: solid 5px #DB3039;
	padding-left: 10px;
	margin-bottom: 30px;
	padding-top: 0;
	margin-top:0;
	}
	
#body h2{
	font-size: 15px;
	color: black;
	}
	
#body p {

	font-size: 13px;
	color: #7C7C7C;
	}

#body a{
	color:#DB3039;
	font-size: 13px;
	 }

#body img[float="right"] {
 	margin-left:  20px;
 	margin-bottom:  20px; 
}

#sidebar {
	margin-top: 25px;
}

.sidebarheader h2{
	color:white;
	font-size: 16px;
	padding-top: 15px;
	margin:  0;
	margin-left: 20px;
	
	}
	
.sidebarcontent h3{
	font-size: 15px;
	color: black;
	}
	
	
.sidebarcontent p {

	font-size: 13px;
	color: #7C7C7C;
	}
.sidebarcontent a, .sidebarcontent a:visited{
	color: #DB3039;
	font-size: 13px;
	 }

.sidebarheader{
	height: 54px;
	background-image: url(images/side_back.png);
	}
	
.sidebarcontent {
	min-height: 346px;
	border: solid 1px #D3D3D3;
	padding: 20px;
	background-color: white;
}

.person_shot {
	min-height: 200px !important;
}

.person{
	
	border-bottom: solid 1px #C4C4C4;
	margin-bottom: 20px;
	padding-bottom:  10px;
	}
.person .name{
	padding: 0;
	margin:0;}
	
.person .name a{
	color: black !important;
	text-decoration: none;
	font-size: 15px !important;
	}

	
.person h2.position{
	padding: 0;
	margin:0;
	color:#DB3039 !important;
	font-size: 15px;
	 }
.person .description {
	margin-top: 20px;
	width: 720px;
	}
	
.person_list .photo {
	float: right;
	padding: 0;
	margin:0;
	}
	
.person .readmore {
	margin-top: 20px;
	margin-right: 200px;
	text-align: right;
	}

.person .photo{
	float: right;
	}
	
	
	
.news h2.name {
	margin:0;
	padding:0;
	}
	
.news .name a{
	color: black;
	text-decoration: none;
	font-size:13px;
	line-height:  20px !important;
	margin-top:0;
	padding-top:0;
	display:  block;
	}

.news .name a{
	color: black;
	text-decoration: none;
	font-size:13px;
	line-height:  20px !important;
	margin-top:0;
	padding-top:0;
	display:  block;
	}

.news h2.date{
	color: #CD2333;
	text-decoration: none;
	font-size:13px;
	margin:0;
	padding:0;
	}

.news .readmore a{
	color: black;
	
	}
	
.readmore {
	text-align: right;
}	

#footer-wrapper {
	min-height: 100px;
	background-color: #514F50;
	}

#footer-wrapper p{
	color: white;
	margin-top: 35px;
	font-size: 12px;
	}






/* #Page Styles
================================================== */



/* #Hidden element styles
================================================== */

/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }


/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
	
		#header-wrapper {
				background-image:  none !important;
		}
		
		#headerNav li {
			border:  solid 0 #000 !important;
			width:  100% !important;
			background-color: #333;
			text-align: center;
			padding-right: 0;
			border-bottom:  solid 1px #FFF !important;
		}
		
		#headerNav li a {
			color:  #fff;
			width:  100% !important;
			display:  block;
		}
		
		#headerNav > div {
			padding-left:  0;
			padding-top:  20px;
			margin-top:  0;
			
		}
		
		#headerNav .nav-selected {
			background-color: #C51D2A;
		}
		
		#headerNav .nav-selected a {
			color:  #FFF;
			border:  solid 0 #FFF;
		}
		
		#headerNav .nav {
			padding:  0;
		}
		
		#banner {
			display:  none;
		}
		
		.sidebarcontent {
			min-height: 100px !important;
		}
		
		.person .description {
			width:  auto !important;
		}	
		
		.person .readmore {
			margin-right:  0;
		}
		
		.photo img {
			max-width:  100% !important;
			margin-left:  10px;
		}
		
		#body img {
		
			clear:  both;
			float:  none !important;
			margin:  0 !important;
			display:  block;
			margin-bottom:  10px !important;
		}
		
		.ball {
			display:  none;
		}
	
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {}


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/