/*   
Theme Name: Dark Ages
Theme URI: http://shelaghlewins.com/
Description: A search engine optimized website framework for WordPress.
Author: Shelagh Lewins
Author URI: http://shelaghlewins.com/
Version: 0.0.1
Tags: threaded-comments, microformats
.
The Dark Ages theme for Wordpress is based on the Shape theme by Ian Stewart.

The Shape Theme for WordPress is copyright ThemeShapes http://themeshapes.com/
Like WordPress, this work is released under GNU General Public License, version 2 (GPL).
http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
.
*/


/* Import a basic layout */
@import url('styles/2c-l.css');

/* Reset default browser styles */
@import url('styles/reset.css');

/* Rebuild default browser styles */
@import url('styles/rebuild.css');

/* Basic WordPress Styles */
@import url('styles/wp.css');

/* Styles for plugins */
@import url('plugins.css');

/* Main Area Styles */
/* Later, put these under the individual divs? */
body {
	margin: 0 7%;
	background-color:#004400;
	color:#402000;
}

/* Basic text styles */
#wrapper {
	background-color:#FFFFCC;
}

#container a:link,
#container a:visited{
	color:#402000;
}

#container a:active, #container a:focus, #container a:hover {
	background-color:#FFFF33;
}

#footer {
	background-color:#FFFF99;
}

/* =Header
-------------------------------------------------------------- */
#masthead {
	width:688px;
	margin:0 auto 5px auto;
	background-color:#FFFF99;
	border: 1px solid #402000;
}

#branding {
	margin: 0 0 0 0;
	height:106px;
	width:688px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	text-align:center;
}

/* contains the title image, pulled over the title text so that the image is seen. Only if images are unavailable, is the text seen. */
#branding span.titlegraphic {
	background:url('images/banner.jpg') no-repeat scroll 0 0 transparent;
	height:100%;
	width:100%;
	left:0;
	top:0;
	position:absolute;
}

/* shield graphics are randomly one of 6 styles */
#branding span.shield_left1,
#branding span.shield_left2,
#branding span.shield_left3,
#branding span.shield_left4,
#branding span.shield_left5,
#branding span.shield_left6,
#branding span.shield_right1,
#branding span.shield_right2,
#branding span.shield_right3,
#branding span.shield_right4,
#branding span.shield_right5,
 #branding span.shield_right6 {
	height:106px;
	width:108px;
	position:absolute;
}

#branding span.shield_left1,
#branding span.shield_left2,
#branding span.shield_left3,
#branding span.shield_left4,
#branding span.shield_left5,
#branding span.shield_left6 {
	background:url('images/shield_left.jpg') no-repeat scroll 0 0 transparent;
	left:0;
	top:0;
}

#branding span.shield_right1,
#branding span.shield_right2,
#branding span.shield_right3,
#branding span.shield_right4,
#branding span.shield_right5,
#branding span.shield_right6 {
	background:url('images/shield_right.jpg') no-repeat scroll 0 0 transparent;
	right:0;
	top:0;
}

#branding span.shield_left2,
#branding span.shield_right2 {
	background-position:0 -106px;
}

#branding span.shield_left3,
#branding span.shield_right3 {
	background-position:0 -212px;
}

#branding span.shield_left4,
#branding span.shield_right4 {
	background-position:0 -318px;
}

#branding span.shield_left5,
#branding span.shield_right5, {
	background-position:0 -424px;
}

#branding span.shield_left6,
#branding span.shield_right6 {
	background-position:0 -530px;
}

#branding #blog-title {
	font-size:300%;
}

/* =Menu
-------------------------------------------------------------- */

/* the original style is margin not padding. This causes an odd uncoloured section. Would probably bear further investigation. */

#access {
	padding: 0 0 0 0;
	overflow:hidden;
	width:100%;
/*	min-height:4.4em; */ /* enable this line if sub-menus are expected - provides consistent area for submenu */
	background-color:#BFBF40;
}
.skip-link a {
	border: 1px solid #402000;
	position: absolute;
	left:-400px;
	top:3em;
	background-color: #FFFFCC;
	color: #402000;
	padding:0.2em;
}

.skip-link a:focus {
	left:0;
}

/* horizontal menu */

/* based on tutorial at http://www.savio.no/artikler/a/333/horizontal-and-tabbed-css-menu-with-sub-menu */

#access .menu {
	font-family: Arial, sans-serif;
	border-top: 1px solid #402000;
/*	border-bottom: 1px solid #402000;*/ /* enable this if submenus are expected - goes with providing a consistent submenu area */
	font-size: 150%;
	text-align: center; /* We are using text-align: left on ul to left align our menu to the page. If you want the menu aligned centered or right just change text-align to either center or right */
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	line-height:160%;
	background-color:#FFFF99;
}

#access .menu li {
	margin: 0 3px 0 0;
	display: inline; /* Menu links are horizontally aligned using display: inline */
}

#access .menu li a {
	margin: 0 -3px 0 0;
	padding: 0.25em 12px 0.25em 12px; /* Display: block won't work in this example, instead we are using padding */
	color: #402000;
	text-decoration: none;
	background: transparent;
	font-weight: bold;
}

#access .menu li.current-menu-ancestor a,
#access .menu li.current-menu-item a {
	color:white;
	background-color:#402000;
}

#access .menu li a:hover,
#access .menu li a:active,
#access .menu li a:focus {
	background-color:white;
	color:#402000;
}

#access .menu .sub-menu {
	float: left;
	text-align: center; /* If both menus are going to be left-aligned we really don't need to use text-align: left on the sub menu, since this menu will inherit the alignment from .menu */
	width: 100%;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	background-color:#BFBF40;
	border-top: 1px solid #402000;
	font-size:80%;
	overflow:hidden; /* nasty but fixes a glitch */
	line-height:160%;
}

* html #access .menu .sub-menu {
	margin: 0 0 0 0; /* IE hack */
}

#access .menu .sub-menu li {
	margin:0;
	padding:0;
}

#access .menu .sub-menu li a {
	background-color:#BFBF40;
	color:#402000;
	margin: 3px -3px 0 0;
	padding: 0.3em 12px 0.3em 12px; /* Display: block won't work in this example, instead we are using padding */
}

#access .menu .sub-menu li.current-menu-item a {
	background-color:#004400;
	color:white;
}

#access .menu .sub-menu li a:hover,
#access .menu .sub-menu li a:active,
#access .menu .sub-menu li a:focus {
	background-color:#FFFF33;
	color:#402000;
}

/* Specific to Wordpress. Hides the unselected sub-menus */
#access .sub-menu {
	display:none;
}

#access .current-menu-item .sub-menu,
#access .current-menu-ancestor .sub-menu {
	display:inline;
}

/* =Content
-------------------------------------------------------------- */

.post {
	margin: 0 0 3em 0;	
}
.entry-content, .entry-summary {
	margin: 1.5em 0 0 0;
}

#content {
	padding-right: 0.5em;
}

#content h1 {
	font-weight:bold;
	font-size:150%;
	clear:none;
}

#content h2 {
	font-weight:bold;
	font-size:130%;
	clear:none;
}

#content h3 {
	font-weight:bold;
	font-size:110%;
	clear:none;
}

/* =Navigation
-------------------------------------------------------------- */

.navigation {
	margin: 0 0 1.5em 0;
	overflow: auto;	
}

/* =Main area
----------------------------------------------------- */

#main {
	margin-top: 1em;
}

#container {
	margin-left: -17em;
}

/* =Widget Areas
-------------------------------------------------------------- */

#primary, #secondary {
	width: 16em;
}

.widget-area ul {
	list-style: none;
	margin: 0 0 0.8em 0;
}
.widget-area ul ul {
	list-style: disc;
	margin-left: 1.1em;
}
.widget-area ul ul ul {
	margin-left: 2.5em;
}
.widget-container {
	margin: 0 0 0.8em 0.8em;
	background-color: #BFBF40;
	border: 1px solid #402000;
}

.widget-container label {
	font-weight:bold;
}

.widget-container input {
	margin-bottom:0.3em;
}

.widget-container form {
	margin: 0.1em 0.1em 0.1em 0.4em;
}

.widget-container h3 {
	font-weight:bold;
	padding: 0.1em 0 0.1em 0.4em;
}

/* custom menu in widget area */
.widget_nav_menu h3 {
	background-color:#BFBF40;
}
	
.widget_nav_menu ul.menu {
	list-style: none;
	color:#402000;
	margin:0;
	line-height:2.2em;
}

.widget_nav_menu {
	float:left;
	width:15em;
	background-color:#FFFF99;
}

.widget_nav_menu .menu li a {
	text-decoration:none;
	font-size:120%;
	padding: 0 0.2em 0 0.5em;
	float:left;
	width:11.8em;
	font-weight:bold;
}

.widget_nav_menu .menu li a:link,
.widget_nav_menu .menu li a:visited {
	color:#402000;
}

.widget_nav_menu .menu li.current-menu-item a {
	background-color:#402000;
	color:white;
}

.widget_nav_menu .menu li a:hover, 
.widget_nav_menu .menu li a:active,
.widget_nav_menu .menu li a:focus,
.widget_nav_menu .menu li.current-menu-item a:hover,
.widget_nav_menu .menu li.current-menu-item a:active,
.widget_nav_menu .menu li.current-menu-item a:focus {
	background-color:white;
	color:#402000;
}


/*
.widget_nav_menu .menu li.current-menu-ancestor a {
	background-color:#5A5A1E;
	color:white;
}*/

/* Submenu */
.widget_nav_menu ul.sub-menu {
	list-style: none outside none;
	margin:0;
}

.widget_nav_menu .sub-menu li a {
	margin-left:1em;
	width:11.2em;
	font-size:110%;
}

.widget_nav_menu .sub-menu li a:link,
.widget_nav_menu .sub-menu li a:visited {
	color:#402000;
	background-color:#FFFF99;
}

.widget_nav_menu .sub-menu li a:hover, 
.widget_nav_menu .sub-menu li a:active,
.widget_nav_menu .sub-menu li a:focus {
	background-color:white;
	color:#402000;
}

.widget_nav_menu .sub-menu li.current-menu-item a {
	background-color:#402000;
	color:white;
}
/*
.widget_nav_menu .sub-menu li.current-menu-ancestor a {
	background-color:#5A5A1E;
	color:white;
}*/

/* Specific to Wordpress. Hides the unselected sub-menus */
.widget_nav_menu .sub-menu {
	display:none;
}

.widget_nav_menu .current-menu-item .sub-menu,
.widget_nav_menu .current-menu-ancestor .sub-menu {
	display:inline;
}

/* Sub-submenu */
.widget_nav_menu .sub-menu ul.sub-menu {
	list-style: none outside none;
	margin:0;
}

.widget_nav_menu .sub-menu .sub-menu li a {
	margin-left:1.5em;
	width:11.2em;
	font-size:100%;
}

.widget_nav_menu .sub-menu .sub-menu li a:link,
.widget_nav_menu .sub-menu .sub-menu li a:visited {
	color:#402000;
	background-color:#FFFF99;
}

.widget_nav_menu .sub-menu .sub-menu li.current-menu-item a {
	background-color:#402000;
	color:white;
}

.widget_nav_menu .sub-menu .sub-menu li a:hover, 
.widget_nav_menu .sub-menu .sub-menu li a:active,
.widget_nav_menu .sub-menu .sub-menu li a:focus,
.widget_nav_menu .sub-menu .sub-menu li.current-menu-item a:hover,
.widget_nav_menu .sub-menu .sub-menu li.current-menu-item a:active,
.widget_nav_menu .sub-menu .sub-menu li.current-menu-item a:focus {
	background-color:white;
	color:#402000;
}



/* Specific to Wordpress. Hides the unselected sub-menus */
.widget_nav_menu .sub-menu .sub-menu,
.widget_nav_menu .current-menu-item .sub-menu .sub-menu {
	display:none;
}

/* and show the selected sub-menus */
.widget_nav_menu .current-menu-item .sub-menu,
.widget_nav_menu .current-menu-ancestor .current-menu-parent .sub-menu {
	display:inline;
}



/* Specific Widget Styling
--------------------------------------------------------
*/

.login {
	padding:0;
}

.login p {
	margin-bottom:0.1em;
}


/* =Temporary styles until the
		directory can read @import
		
.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.alignleft {
	float: left;
}

.alignright {
	float: right;
}
		
-------------------------------------------------------------- */
/* Styles within content */

#content image .floatleft {
	float:left;
	margin:5px 5px 5px 0;
}

#content image .floatright {
	float:right;
	margin:5px 0 5px 5px;
}

#content .clear {
	clear:both;
}

#content td {
	padding:5px;
}

#content td img {
	vertical-align:top;
}

/* ------------------------------ */