/* 
  ------------------------------------------------
  PVII CSS Page Builder Magic
  Copyright (c) 2011 Project Seven Development
  www.projectseven.com
  07: 2 Col Fixed Sidebar Left
  ------------------------------------------------
*/

body {
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	color: #000;
	background-color: #313131;
	margin: 20px 0;
	padding: 0px;
	background-image:url(../images/contentphotos/background.jpg);
    background-repeat:repeat;
}
/*Masthead, includes Logo and Banner. It carries a bottom shadow that creates a bevel effect between the masthead and your page content. All modern browsers except Safari 5.x support box-shadow. As of this writing, Safari still requires the proprietary webkit prefix. Once Safari 6 is released, you can remove the webkit property.*/
.masthead {
	border-bottom: 1px solid #111111;
	padding: 0px;
	text-align: left;
	position: relative;
	-webkit-box-shadow: 0 0 20px #333;
	box-shadow: 0 0 20px #333;
}
/*The masthead logo DIV rule can be used to assign padding or colors to your masthead area that contains your logo. The default logo we provide is simply a level 1 heading, which may be replaced with an image of your logo. If you choose to keep your image logo inside the H1 tag, then edit the masthead h1 rule to remove all properties except for margin: 0. */
.masthead .logo { }
.masthead h1 {
	margin: 0;
	color: #FF3;
	background-color: #000;
	padding: 10px 30px;
	font-size: 16px;
	text-transform: uppercase;
	letter-spacing: 0.3em;
	font-weight: normal;
}
/*We set height and overflow hidden to allow you place an image in the banner that would normally be too large. You can edit or remove this rule if you design your banner image to fit your layout.*/
.masthead .banner {
	/*height: 120px;*/
	overflow: hidden;
}
.masthead .phonebanner {
	/*height: 120px;*/
	overflow: hidden;
}
.masthead .banner img {}
/*Main Layout Container. The entire page is inside this element. Border-radius creates curved corners. Background color provides the background for all child elements not having a specific background set, such as the masthead and the footer. The padding effectively creates a 1px border around the container. We also assign a box-shadow effect.*/
.content-wrapper {
	border-radius: 5px;
	background-color: #424242;
	margin: 0 auto;
	-webkit-box-shadow: 0 0 20px #333;
	box-shadow: 0 0 20px #333;
	width: 980px;
	padding: 1px;
}
/*The containing element for the the main content. We simply set the content area to have a white background.*/
.columns-wrapper {
	overflow: hidden;
	background-color: #424242;
}
/*This container is inside the columns wrapper and serves as a container for the content inside, allowing you to adjust whitespace (padding) without altering the CSS box model. This is the rule to use to set text attributes for your main content.*/
.main-content .content {
	padding: 30px;
	font-size: 14px;
	line-height: 1.5em;
}
/*Main Content 2 Column Layout*/
.main-content {
	color: #CCC;
}
/*A utility rule assigned to the first heading to remove all margins. This class can be used on any element for which you would like to remove margin.*/
.page-topper { margin: 0px; }

/*Heading styles*/
h1, h2, h3, h4 { 
	margin: 30px 0 0 0;
	line-height: normal; 
}
h1 { font-size: 24px; }
h2 { font-size: 20px; }
h3 { font-size: 18px; }
h4 { font-size: 16px; }
h6 { 
    font-size: 18px;
	color:#F90;
}

/*Misc. Typographic Styles*/
.content em {
	font-style: normal;
	text-transform: uppercase;
	font-size: 110%;
}
.content em.big {
	font-size: 125%;
}
/*Sidebar*/
.sidebar {
	width: 220px;
	float: left;
	background-color: #929292;
	border-right: 1px dotted #000;
}
/*DO NOT EDIT*/
.p7desktop .sidebar {
	padding-bottom: 32767px;
	margin-bottom: -32767px;
}
/*The Sidebar content. Edit padding and font attributes to suit*/
.sidebar .content {
	padding: 10px;
	font-size: 16px;
	line-height: 1.5em;
}
.sidebar img{
 padding-left: 6px;
}
/*Main Content*/
.main-content { margin-left: 220px; }

/*Ordinary Link Styles*/
.content a { color: #0066CC; }
.content a:hover, .content a:focus { color: #C30; }
.footer a { color: #689BF0; }
.footer a:hover, .footer a:focus { color: #FFF; }

/*Lists: We reduce normal indentation and remove bullets for ordered and unordered lists  when placed in a sidebar*/
.sidebar ul, .sidebar ol, .sidebar2 ul, .sidebar2 ol {
	margin: 0 0 0 .5em;
	padding: 0 0 0 .5em;
	line-height: normal;
}

/*The Sidebar Menu UL.*/
ul.menuside {
	margin: 0;
	padding: 0;
}

.footer {
	padding: 10px 30px;
	font-size: 11px;
	color: #FFF;
	background-color: #000;
}
.footer p.copyright {
	text-transform: uppercase;
	margin: 0px;
}

/*P7MOBILE Styles. These styles will be used only by mobile devices (phones and tablets) and will be ignored by desktop and laptop browsers.*/
body.p7mobile { 
	-webkit-text-size-adjust:100%; 
	min-width: 0;
	margin: 1em;
}
.p7mobile .main-content { margin-left: 0; }
.p7mobile .content-wrapper { width: auto; }
.p7mobile .content {
	padding: 1.5em;
	font-size: large;
	line-height: 1.35em;
}
.p7mobile .sidebar {
	width: auto;
	float: none;
	/*background-color: transparent;*/
	background-color: #929292;
	border-right: none;
}
.p7mobile .menuside {
	margin: 0;
	padding: 0;
}
.p7mobile .menuside li {
	list-style-type: none;
	margin-bottom: 5px;
	display: inline-block;
	margin-right: 5px;
}
.p7mobile .menuside a, .p7mobile .footer { font-size: large; }
.p7mobile .sidebarimages{
	position:absolute;
	left: -9000px;
}

/* 2 Column Content Links - We add .content to the selector name to 
make it more specific and to eliminate conflicts with the main navigation bar
*/
.content a:link {
	color:#FF6;
	text-decoration: none;
}
.content a:visited {
	color: #FF6;
	text-decoration: none;
}
.content a:hover, #c1 .content a:focus, #c1 .content a:active {
	color: #FFFFFF;
	text-decoration: underline;
}
/*Footer Links*/
.footer a:link {
	color: #FF6;
	text-decoration: none;
}
.footer a:visited {
	color: #FF6;
	text-decoration: none;
}
.footer a:hover, #footer a:focus, #footer a:active {
	color: #FFFFFF;
	text-decoration: underline;
}

/*** RJA - This is for Pen and Ink Pages ***/
.brightertext {
	color:#FFFF66;
	font-size:14px;
}
.penandink img{
	padding: 3px; /* This creates a border around the image */
	background-color: #272727; /* Background color of the border created by the padding */
	border: 1px solid #cecece; /* A 1 pixel greyish border is applied to the white border created by the padding */
	color: #CCCCCC;	
}