/* 
  -----------------------------------------------------
  Portions Copyright (c) 2011 Project Seven Development
  10: 2 Col Fixed Sidebar Right, Top Menu
  Modified August 2011 by Pinsonnault Creative
  http://www.pinscreative.com
  -----------------------------------------------------
*/

body {
	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
	color: #000;
	background-color: #FFFFFF;
	margin: 20px 0;
	padding: 0px;
}
/*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: #222;
	margin: 0 auto;
	-webkit-box-shadow: 0 0 20px #999;
	box-shadow: 0 0 20px #999;
	width: 840px;
	padding: 1px;
}
/*Masthead, includes Logo and Banner.*/
.masthead {
	text-align: left;
	position: relative;
	z-index: 9999999;
	height: 140px;
	background-image: url(../images/banner.jpg);
	background-repeat: no-repeat;
	background-position: bottom;
}
.masthead #topbar {
	background-color: #484848;
	height: 20px;
}
.masthead #heading {
	padding-left: 30px;
	padding-top: 38px;
}
.masthead #heading .level1 {
	font-size: 38px;
	font-weight: bold;
	color: rgb(224,224,224);
}
.masthead #heading .level2 {
	font-size: 14px;
	text-transform: uppercase;
	color: rgb(224,224,224);
	letter-spacing: 0.12em;
}
/*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: #FFF;
}
/*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 46px 30px 46px;
	font-size: 14px;
	line-height: 1.6em;
}
.main-content_1col .content {
	padding: 30px 70px 30px 70px;
	font-size: 14px;
	line-height: 1.6em;
}

/*Heading styles*/
h1, h2, h3, h4 {
	margin: 30px 0 0 0;
	line-height: normal;
}
h1 {
	font-size: 22px;
	color: rgb(85,85,85);
}
h2 {
	font-size: 18px;
	color: #333399;
}
h3 {
	font-size: 18px;
	color: #333399;
	margin-top: 20px;
}
h4 {
	font-size: 13px;
	margin-top: 0px;
	text-transform: uppercase;
	letter-spacing: .12em;
}
p {
	margin-top: 6px;
	margin-bottom: 16px;
}

/*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; }

/*Misc. Typographic Styles*/
.content em {
	font-style: italic;
	font-size: 110%;
}
.content em.big {
	font-size: 125%;
}

/*Sidebar*/
.sidebar {
	width: 220px;
	float: right;
	background-color: #EFEFEF;
	border-left: 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: 30px;
	line-height: 1.3em;
	font-size: 14px;
}
.quote {
	font-size: 16px;
	font-style: italic;
	line-height: 1.8em;
}
/*Main Content - margin left allows space for the floated sidebar.*/
.main-content {
	margin-right: 220px;
}
.main-content_1col {
}
.main-content_1col .content #leftcol {
	width: 330px;
	padding-right: 20px;
	float: left;
}
.main-content_1col .content #rightcol {
	width: 330px;
	padding-left: 20px;
	float: left;
}
.main-content_1col .content #leftcol ul {
	margin-top: 6px;
	margin-bottom: 12px;
}
.main-content_1col .content #rightcol ul {
	margin-top: 6px;
	margin-bottom: 12px;
}
.main-content_1col .content #leftcol li {
	margin-left: 0px;
	line-height: 1.3em;
	margin-bottom: 6px;
}
.main-content_1col .content #rightcol li {
	margin-left: 0px;
	line-height: 1.3em;
	margin-bottom: 6px;
}


.main-content .content #leftcol {
	width: 254px;
	padding-right: 10px;
	float: left;
}
.main-content .content #rightcol {
	width: 254px;
	padding-left: 10px;
	float: left;
}
.main-content .content #leftcol ul {
	margin-top: 0px;
	margin-bottom: 12px;
}
.main-content .content #rightcol ul {
	margin-top: 0px;
	margin-bottom: 12px;
}
.clearboth {
	margin: 0px;
	clear: both;
}
/*Footer*/
.footer {
	padding: 10px 30px;
	font-size: 11px;
	color: #CCC;
	background-color: rgb(85,85,85);
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
}
.footer p.copyright {
	text-transform: uppercase;
	margin: 0px;
}

/*Ordinary Link Styles*/
.content a {
	color: #333399;
	font-weight: bold;
}
.content a:hover, .content a:focus {
	color: #3333FF;
}
.footer a {
	color: #CCCCCC;
}
.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;
}
.sidebar li, .sidebar2 li { 
	margin-bottom: 4px; 
}

/*The DIV that contains the horizontal menu bar at the top of your page.*/
.menutop-wrapper {
	padding: 10px 20px;
	background-color: #484848;
	border-top: 1px solid #000;
	border-bottom: 1px solid #FFF;
	-webkit-box-shadow: 0px 0px 30px #999;
	box-shadow: 0px 0px 30px #999;
	position: relative;
	z-index: 999999;
}
/*The Top Menu Bar UL. Font-Size 0 eliminates horizontal whitespace between menu items. DO NOT EDIT any property EXCEPT for text-align, which can be changed to center or right to easily re-position the menu. */
.menutop {
	margin: 0;
	padding: 0;
	font-size: 0px;
	text-align: left;
}
/*The menu list items. DO NOT EDIT the first 2 properties. Margin-right provises some separation between each item and may be edited.*/
.menutop li {
	list-style-type: none;
	display: inline-block;
	margin-right: 6px;
}
/*The menu links. MUST BE DISPLAY BLOCK. Padding provides white space within the link box. The first padding value controls the height of the box. The second value controls width.*/
.menutop a {
	display: block;
	color: rgb(224,224,224);
	text-decoration: none;
	padding: 4px 7px;
	font-size: 13px;
	border: 1px solid rgb(153,153,153);
	border-radius: 4px;
	background-color: #484848;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
}
/*The menu links hover and focus states. A box shadow effect changes for this state. */
.menutop a:hover, .menutop a:focus {
	color: #FFF;
	border-color: #FFFFFF;
	outline: 0;
	background-color: #333366;
}
#subfoot  {
	text-transform: uppercase;
	color: #999999;
	width: 820px;
	margin-right: auto;
	margin-left: auto;
	font-size: 9px;
	text-align: right;
	padding-top: 3px;
	font-family: "Lucida Console", Monaco, monospace;
}
#subfoot a {
	color: #999999;
	text-decoration:none;
}
#subfoot a hover {
	color: #999999;
	text-decoration:none;
}

/*MOBILE*/
body.p7mobile { 
	-webkit-text-size-adjust:100%; 
	min-width: 0;
	margin: 1em;
}
.p7mobile .menutop a, .p7mobile .footer { font-size: large; }
.p7mobile .menutop li { margin-bottom: 5px; }
.p7mobile .content-wrapper {
	width: auto;
}
.p7mobile .content { font-size: 16px; }
.p7mobile .sidebar {
	width: auto;
	float: none;
	margin-left: 0;
	border: none;
	background: transparent;
}
.p7mobile .sidebar .content {
	padding: 30px;
	width: auto;
}
.p7mobile .main-content { margin-right: 0; }
.p7mobile .columns-wrapper {
	background-image: none;
	border-left: none;
}