@import url('style_browser_reset.css');
/*================================================================
Typography and links
==================================================================*/

a {color: #a67071; text-decoration: none} /* global links */

/* text styles */
p {padding: 0px 0 20px}
strong {font-weight: 700}
em {font-style: italic}
blockquote {margin: 0 20px 20px; padding: 15px 15px 0; border: 1px dotted #9f8b7b; font-style: italic}
/* end text styles */

/* General headings */
h1, h2 {font-size: 1.5em; text-transform: uppercase; text-shadow: 0 1px 0 #fbf9f8; font-weight: bold; letter-spacing: .05em}
h3, h4 {font-size: 1.2em; text-transform: uppercase; text-shadow: 0 1px 0 #fbf9f8; font-weight: bold; letter-spacing: .05em}
#main_content_right h3 {color: #99afbd; padding: 5px 0; font-weight: bold;}
#main_content_right h4 {color: #99afbd; padding: 5px 0; font-weight: bold;}
/* end general headings */

/* general lists */
#main_content_left ul, #main_content_left ol {margin-bottom: 20px; margin-left: 30px}
#main_content_left ul li { list-style: square inside}
#main_content_left ol li { list-style: upper-roman inside}
/* end lists */

.continue_reading {float: right}



/*================================================================
Site Structure
==================================================================*/	

body {
	font-size:100%;
	line-height:1.4em;
	background: #edf1f3 url(../images/body.jpg);
	color: #77675a;
}

#page_wrapper {	
    width: 960px;
	margin: 0px auto;
	position: relative;
}

#header {
	height: 137px;
	background: url(../images/header.jpg) repeat-x;
}

#header_contents {
	height: 235px;
	width: 960px;
	margin: auto;
	position: relative;
}

#container {	
    width: 960px;
	margin: 25px auto;
	font-size:0.875em;
}

#main_content_left {
	width: 600px;
	float: left;
}

#main_content_right {
	width: 343px;
	float: right;
}

#footer {
	padding: 20px;
	margin: auto;
	clear: both;
	text-align: center;
	font-size: 0.8em;
}

/*================================================================
The posts
==================================================================*/

.post_header {
	background-image: url(../images/PostHeaderPage.jpg);
	height: 36px;
	width: 467px;
	padding: 25px 65px;
	text-align: center;
}

.post_body {
	background-image: url(../images/PostBodyPage.jpg);
	background-repeat: repeat-y;
	width: 547px;
	padding: 0px 25px;
	overflow: auto;
}

.post_body a {
	color:#0033CC;
}

.post_footer {
	clear: both;
	background: url(../images/PostFooterPage.jpg) bottom;
	height: 40px;
	width: 497px;
	margin-bottom: 20px;
	padding: 15px 50px 0;
	font-style: italic;
}


.next_prev {
	height: 31px;
	clear: both;
	margin-bottom: 20px;
	background-image: url(../images/next_prev_posts.jpg);
	width: 577px;
	padding-top: 8px;
	padding-right: 10px;
	padding-left: 10px;
}

/*================================================================
The sidebars
==================================================================*/

.sidebar_header {
	background-image: url(../images/sidebar_header.jpg);
	height: 84px;
	width: 340px;
}

.sidebar_body {
	display: block;
	margin:0 0 0 0;
	width: 290px;
	padding: 25px;
	background: url(../images/sidebar_body.jpg) repeat-y;
}

.sidebar_bottom {
	background-image: url(../images/sidebar_footer.jpg);
	height: 56px;
	width: 340px;
	clear: both;
	margin-bottom: 20px;
}

/*---------- Sidebar Navigation ----------*/

.sidebar_nav ul {}
.sidebar_nav li { padding: 6px }

.sidebar_nav ul li {
	display: block;
	background: url(../images/sidebar_seperator.png) bottom repeat-x;
}

.sidebar_nav ul ul li { margin-left: 10px; background:none; font-size: 1em; }
.sidebar_nav ul ul ul li { margin-left: 10px; background: none }

.sidebar_nav { margin-bottom: 20px; }

.sidebar_nav ul {}

.sidebar_nav a { display: block; }

.sidebar_nav a:hover {
	color: #000;
}

#search_form {margin: 15px 0;}

#search_form input { width: 100%}


/*================================================================
Top navigation
==================================================================*/

#header_info_box { /* the e-mail icon */
	position: absolute;
	right: 0;
	width: 98px;
	height: 64px;
}

#top_nav_menu {
	position: absolute;
	top: 93px;
	left: -15px;
	width: 950px;
	z-index:20;
}

/***** drop menu *****/

#dropmenu, #dropmenu ul {
	list-style-position:outside;
	position:relative;
	line-height:1.5em;
	width:100%;
	z-index:30;
	margin: 0px 0px 0px 0px;
}

#dropmenu a {
	display:block;
	padding: 5px 15px;
	text-decoration:none;
	color: #000;
	text-shadow: 0 1px 0 #e0e3ef;
	letter-spacing: .08em;
	font-weight: bold;
	font-size: 1em;
}

#dropmenu a:hover {
	color:#222c53;
}

#dropmenu li {
	float:left;
	position:relative;
	height: 50px;
}

#dropmenu ul {
	position: absolute;
	display: none;
	width: 18em;
	top: 19px;
	left: 0px;
}

#dropmenu ul a {
	background: url(../images/dropmenu_bg.png);
}

#dropmenu ul a:hover {
	
}

#dropmenu li ul {
	width:14.1em;
	margin-top: 20px;
}

#dropmenu li ul li {
	height: 30px;
}

#dropmenu li ul a {
	width: 250px;	
	height: auto;
	float: left;
}


#dropmenu ul ul {
	top:auto;
}

#dropmenu li ul ul {
	left: 265px;
	margin:0px 0 0 10px;
}

#dropmenu li:hover ul ul, #dropmenu li:hover ul ul ul, #dropmenu li:hover ul ul ul ul {
	display:none;
}
#dropmenu li:hover ul, #dropmenu li li:hover ul, #dropmenu li li li:hover ul, #dropmenu li li li li:hover ul {
	display:block;
}

/*================================================================
Image floats for posts
==================================================================*/

img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

img.alignright {
	padding: 2px;
	margin: 0 0 2px 7px;
	display: inline;
	border: 1px solid gray
	}

img.alignleft {
	padding: 2px;
	margin: 0 7px 2px 0;
	display: inline;
	border: 1px solid gray
	}

.alignright {
	float: right;
	}

.alignleft, .post_thumb, .featured_thumb {
	float: left
	}

.post_body img.image {
	float:none;
	margin: 8px 0 2px 0px;
	padding: 2px;
	border: 1px solid gray;
	max-width:528px;
	height:auto;
}

.post_body img.left {
	float:left;
	margin: 8px 12px 2px 0px;
	padding: 2px;
	border: 1px solid gray;
	max-width:300px;
	height:auto;
}
	
.post_body img.right {
	float:right;
	margin: 8px 0 2px 12px;
	padding: 2px;
	border: 1px solid gray;
	max-width:300px;
	height:auto;
}
	
.post_thumb {margin: 8px 12px 2px 0px; padding: 2px; border: 1px solid gray}

.featured_thumb {margin: 0px 15px 4px 0px; padding: 2px; border: 1px solid gray}


/*================================================================
General tables and forms
==================================================================*/

table {border-collapse: collapse; width: 100%; margin-bottom: 15px}

th, tr, td {border: 1px dotted #9f8b7b; padding: 5px}

legend {font-weight: 700; padding: 5px}

fieldset {border: 1px solid #9f8b7b; padding: 15px 30px}

/**************************** Gallery *****************************/


.center {margin: auto;}

#no_gallery_found {width: 798; padding: 50px; margin: auto; background: red; border: 10px solid white}









/**********/
/* MOBILE */
/**********/







@media screen and (max-width: 680px) {


a {color: #a67071; text-decoration: none} /* global links */

/* text styles */
p {padding: 0px 0 20px}
strong {font-weight: 700}
em {font-style: italic}
blockquote {margin: 0 20px 20px; padding: 15px 15px 0; border: 1px dotted #9f8b7b; font-style: italic}
/* end text styles */

/* General headings */
h1 {font-size: 1.4em; text-transform: uppercase; text-shadow: 0 1px 0 #fbf9f8; font-weight: bold; letter-spacing: .05em}
h2 {font-size: 1.3em; text-transform: uppercase; text-shadow: 0 1px 0 #fbf9f8; font-weight: bold; letter-spacing: .05em}
h3, h4 {font-size: 1.2em; text-transform: uppercase; text-shadow: 0 1px 0 #fbf9f8; font-weight: bold; letter-spacing: .05em}
#main_content_right h3 {color: #99afbd; padding: 5px 0;}
#main_content_right h4 {color: #99afbd; padding: 5px 0;}
/* end general headings */

/* general lists */
#main_content_left ul, #main_content_left ol {margin-bottom: 20px; margin-left: 30px}
#main_content_left ul li { list-style: square inside}
#main_content_left ol li { list-style: upper-roman inside}
/* end lists */

.continue_reading {float: right}



/*================================================================
Site Structure
==================================================================*/	

body {
	font-size:100%;
	line-height:1.4em;
	background: #edf1f3 url(../images/body.jpg);
	color: #77675a;
}

#page_wrapper {	
    width: 100%;
	margin: 0px auto;
	position: relative;
}

#header {
	height: 137px;
	background: url(../images/header.jpg) repeat-x;
}

#header_contents {
	height: 235px;
	width: 100%;
	margin: auto;
	position: relative;
}

#header_contents img {
	width:100%;
	max-width: 471px;
	height:auto;
}

#container {	
    width: 100%;
	margin: 25px auto;
	font-size:0.875em;
}

#main_content_left {
	width: 100%;
	float: none;
}

#main_content_right {
	width: 100%;
	float: none;
}

#footer {
	padding: 10px;
	margin: auto;
	clear: both;
	text-align: center;
	font-size: 0.8em;
}

/*================================================================
The posts
==================================================================*/

.post_header {
	background-image: url(../images/PostHeaderPage.jpg);
	height: 36px;
	width: calc(100% - 34px);
	padding: 25px 12px 8px 12px;
	text-align: center;
	margin-left:10px;
}

.post_body {
	background-image: url(../images/PostBodyPage.jpg);
	background-repeat: repeat-y;
	width: calc(100% - 34px);
	padding: 25px 12px;
	margin-left:10px;
	overflow: auto;
}

.post_footer {
	clear: both;
	background: url(../images/PostFooterPage.jpg) bottom left;
	height: 5px;
	width: calc(100% - 34px);
	padding: 0px 12px;
	margin-left:10px;
	font-style: normal;
}


.next_prev {
	height: 31px;
	clear: both;
	margin-bottom: 20px;
	background-image: url(../images/next_prev_posts.jpg);
	width: 577px;
	padding-top: 8px;
	padding-right: 10px;
	padding-left: 10px;
}

/*================================================================
The sidebars
==================================================================*/

.sidebar_header {
	background-image: url(../images/sidebar_header.jpg);
	height: 84px;
	width:100%;
	max-width: 340px;
	margin: 0 auto;
}

.sidebar_body {
	display: block;
	margin: 0 auto;
	width:calc(100% - 50px);
	max-width: 290px;
	padding: 8px 25px;
	background: url(../images/sidebar_body.jpg) repeat-y;
}

.sidebar_bottom {
	background-image: url(../images/sidebar_footer.jpg);
	height: 56px;
	width:100%;
	max-width: 340px;
	clear: both;
	margin: 0 auto 20px auto;
}

/*---------- Sidebar Navigation ----------*/

.sidebar_nav ul {}
.sidebar_nav li { padding: 6px }

.sidebar_nav ul li {
	display: block;
	background: url(../images/sidebar_seperator.png) bottom repeat-x;
}

.sidebar_nav ul ul li { margin-left: 10px; background:none; font-size: 1em; }
.sidebar_nav ul ul ul li { margin-left: 10px; background: none }

.sidebar_nav { margin-bottom: 20px; }

.sidebar_nav ul {}

.sidebar_nav a { display: block; padding: 12px 0 0 0; }

.sidebar_nav a:hover {
	color: #000;
}

#search_form {margin: 15px 0;}

#search_form input { width: 100%}


/*================================================================
Top navigation
==================================================================*/

#header_info_box { /* the e-mail icon */
	position: absolute;
	right: 0;
	width: 98px;
	height: 64px;
}

#top_nav_menu {
	position: absolute;
	top: 93px;
	left: 5px;
	width: calc(100% - 5px);
	z-index:20;
}

/***** drop menu *****/

#dropmenu, #dropmenu ul {
	list-style-position:outside;
	position:relative;
	line-height:1.5em;
	width:100%;
	z-index:30;
	margin: 0px 0px 0px 0px;
}

#dropmenu a {
	display:block;
	padding: 5px 10px;
	text-decoration:none;
	color: #000;
	text-shadow: 0 1px 0 #e0e3ef;
	letter-spacing: .08em;
	font-weight: bold;
	font-size: 0.8em;
}

#dropmenu a:hover {
	color:#222c53;
}

#dropmenu li {
	float:left;
	position:relative;
	height: 50px;
}

#dropmenu ul {
	position: absolute;
	display: none;
	width: 100%;
	top: 19px;
	left: 0px;
	z-index:20;
}

#dropmenu ul a {
	background: url(../images/dropmenu_bg.png);
}

#dropmenu ul a:hover {
	
}

#dropmenu li ul {
	width:100%;
	margin-top: 20px;
}

#dropmenu li ul li {
	height: 30px;
	width:100%;
}

#dropmenu li ul a {
	width: 100%;	
	height: auto;
	float: none;
}


#dropmenu ul ul {
	top:auto;
}

#dropmenu li ul ul {
	margin-top: 20px;
}

#dropmenu li:hover ul ul, #dropmenu li:hover ul ul ul, #dropmenu li:hover ul ul ul ul {
	display:none;
}
#dropmenu li:hover ul, #dropmenu li li:hover ul, #dropmenu li li li:hover ul, #dropmenu li li li li:hover ul {
	display:block;
}

/*================================================================
Image floats for posts
==================================================================*/

img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

img.alignright {
	padding: 2px;
	margin: 0 0 2px 7px;
	display: inline;
	border: 1px solid gray
	}

img.alignleft {
	padding: 2px;
	margin: 0 7px 2px 0;
	display: inline;
	border: 1px solid gray
	}

.alignright {
	float: right;
	}

.alignleft, .post_thumb, .featured_thumb {
	float: left
	}

.post_body img.image {
	float:none;
	margin: 8px 0 2px 3%;
	padding: 2px;
	border: 1px solid gray;
	max-width: inherit;
	width:90%;
	height:auto;
}

.post_body img.left {
	float:none;
	margin: 8px 0 2px 3%;
	padding: 2px;
	border: 1px solid gray;
	max-width: inherit;
	width:90%;
	height:auto;
}
	
.post_body img.right {
	float:none;
	margin: 8px 0 2px 3%;
	padding: 2px;
	border: 1px solid gray;
	max-width: inherit;
	width:90%;
	height:auto;
}

.post_thumb {margin: 8px 12px 2px 0px; padding: 2px; border: 1px solid gray}

.featured_thumb {margin: 0px 15px 4px 0px; padding: 2px; border: 1px solid gray}


/*================================================================
General tables and forms
==================================================================*/

table {border-collapse: collapse; width: 100%; margin-bottom: 15px}

th, tr, td {border: 1px dotted #9f8b7b; padding: 5px}

legend {font-weight: 700; padding: 5px}

fieldset {border: 1px solid #9f8b7b; padding: 15px 30px}

/**************************** Gallery *****************************/


.center {margin: auto;}

#no_gallery_found {width: 798; padding: 50px; margin: auto; background: red; border: 10px solid white}



}