/******** ~~~~~~~~~~~~~~ DEBUG*/
#DEBUG {
	height:250px;
	width:700px;
	position:absolute;
	top:0;
	left:0;
	z-index: 100;
	color: #ff0000;
	border:1px solid #ff0000;
	background-image:url(graphics/pageoverlay.png);
	background-repeat:repeat;
}

/******** ~~~~~~~~~~~~~~ Text styling and spacing overides*/
body, input, textarea {
    font:15px Arial,serif;
}
#blog-title {
    font-family:Arial,sans-serif;
}
/*~~~ main page content container*/
#main {
    clear:both;
    padding:22px 0 10px 0;
	margin:0 180px 224px 180px;
	width:auto;
	min-width:960px;
}
#container {
    width:100%;
    float:left;
	margin-left:-320px;
}
#content {
    width:auto;
	margin-left:410px;
}
/*~~~ branding - container for top page section*/
#branding {
	height:238px; /* this pushes the menu and page down*/
	padding:0 0 0 0;
	width:auto;
	min-width:960px;
	margin:0 180px 0 180px;
	position:relative;
}

/******** ~~~~~~~~~~~~~~ Banner styling */
/*~~~ random background image*/
#bannerimage {
	height:270px;
	width:100%;
	position:absolute;
	top:0;
	left:50%;
	margin: 0 0 0 -50%;
}
/*~~~ opaque logo background graphic*/
#logobackground {
	height:60px;
	width:100%;
	position:absolute;
	top:30px;
	background-image:url(graphics/logobackground.png);
	background-repeat:repeat-x;
}
/*~~~ positions logo graphic*/
#logographic {
	background:url(graphics/logo.png) no-repeat transparent; /* Change This to Your Image */
	height:45px;
	width:550px;
	position:absolute;
	top:40px;
	left:88px;
}
#leftgraphic {
	position:absolute;
	top:15px;
	height:645px;
	width:auto;
	min-width:960px;
	margin:0 180px 0 180px;
    background-image:url(graphics/staff.png);
	background-repeat:no-repeat;
	background-position:left top;
}
/*~~~ article area*/
#article {
	height:60px;
	width:490px;
	position:absolute;
	top:150px;
	right:0;
	background-image:url(graphics/logobackground.png);
	background-repeat:repeat-x;
}
/*~~~ FIX (next two) - to remove the black link text, they need to be on the page but behind, because I am using transparent backgrounds it shows so I pushed it off the page*/
#blog-title {
	position:absolute;
	top:-130px;
	z-index:-100;
}
#blog-description {
	position:absolute;
	top:-165px;
}
/******** ~~~~~~~~~~~~~~ Page area styling*/
/*~~~ random page background image*/
#pageimage {
	height:100%;
	width:100%;
	position:absolute;
	top:0;
}
/*~~~ page overlay graphic*/
#pageoverlay {
	height:100%;
	width:100%;
	position:absolute;
	top:0;
	background-image:url(graphics/pageoverlay.png);
	background-repeat:repeat;
}
/*~~~ page overlay graphic*/
#pagecontainer {
	height: calc(100% - 270px);
	width:100%;
	position:absolute;
	top: 270px;
}
.menu {
	padding:0 0 0 0;
	margin:0 0 0 270px;
}
/*~~~ remove page titles*/
body.page .entry-title {
	display:none;
}
/*~~~ add padding to page templates*/
.page-template-template-page-fullwidth-php #container {
	margin: 0 0 0 -90px;
}

.page-template-template-page-fullwidth-php #content {
	margin: 0 0 0 180px;
	width: calc(100% - 90px);
}

/******** ~~~~~~~~~~~~~~ Menu styles */
/*~~~ bar under menu*/
#access {
    border-bottom:7px dashed #008166;
	font-family:"Arial Black", Arial, serif;
	color: #000;
}
#menu {
    font-family:"Arial Black", Arial, serif;
	color: #000;
}
.sf-menu a {
  	border-color:#008166;
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	background:#fafafa;
    border-bottom-color:#008166;
}
.sf-menu ul {
    border-bottom:1px solid #008166;
}
.sf-menu .current_page_parent a ,
.sf-menu .current-menu-ancestor a,
.sf-menu .current-post-ancestor a,
.sf-menu .current_page_ancestor a,
.sf-menu .current-menu-item a,
.sf-menu .current-menu-parent a,
.sf-menu .current_page_item a{
    border-bottom:5px dashed #fff;
	border-left:3px solid #008166;
	border-top:3px solid #008166;
	border-right:3px solid #008166;
}
/*
.sf-menu li,
.sf-menu li li,
.sf-menu ul {
	border-bottom:1px solid #008166;
    border-left:1px solid #008166;
	border-top:1px solid #008166;
	border-right:1px solid #008166;
}*/

/******** ~~~~~~~~~~~~~~ Widget styles */
/*~~~ Primary aside*/
#primary {
    border:0;
	background-color:#dbf9f3;
	border-radius:6px;
	color: #000;
	 opacity:0.7;
	filter:alpha(opacity=70); /* For IE8 and earlier */
}
/*~~~ Secondary aside*/
#secondary {
    border:0;
	background-color:#dbf9f3;
	border-radius:6px;
	color: #000;
	opacity:0.7;
	filter:alpha(opacity=70); /* For IE8 and earlier */
}

/*~~~ Page top & Bottom aside's*/
#content .aside {
    border:1px solid #008166;
	background-color:#fff;
	color: #000;
}

/******** ~~~~~~~~~~~~~~ Footer styling */
/*~~~ position and style*/
#footer {
	width:100%;
	border-top:2px solid #ccc;
	background-color:#dbf9f3;
	color: #000;
	opacity:0.7;
	filter:alpha(opacity=70); /* For IE8 and earlier */
}

#subsidiary {
	color: #000;
}