/** 
 * main.css
 * 
 * 1. General HTML tags
 * 2. Masthead area
 * 3. Main content and sidebar
 * 4. Footer
 * 5. Media queries for responsive layout
 * 6. Accessibility helpers
 * 
 */

/*********************************************************************
 * 1. General HTML tags
 *
 */

* {
	box-sizing: border-box; 
}

body {
	padding-top: 1%;
	padding-right: 5%;
	padding-left: 5%;
	padding-bottom: 5%;

/*	max-width: 1400px; */
	max-width: 72em;
	margin: 0 auto; 
	background-color:white;
}

body #content{
	width: 76%;
}

/* body,select, option, td, button[type=submit], input[type=text], input[type=tel], input[type=number], input[type=submit], textarea { */
body, option, td, textarea {
	font-family: 'Quattrocento', serif;
/*	font-size: 105%; */
	line-height: 1.5; 
	font-size:115%;
	color:#000;
	font-size:116%;
}

p {
}

body table
{
/*	border:0;
	width:100%; 
	border-spacing:0; */
/*	width: auto; */

	border-collapse: separate;
	border-spacing: 0;
	border-width: 1px 0 0 1px;
	margin: 0 0 1.75em;
	table-layout: fixed;
	/* Prevents HTML tables from becoming too wide */
	width: 100%;

}
body td {
	font-size: 100%; 
/*	color:red; */
	border:1px solid #eee;
	margin:0;
	padding:0;
	width:auto;
}



textarea{
	color:#333;
	font-size:100%;
	font-family: 'Quattrocento', serif;
	line-height: 1.8em;
	outline:none;
}

select {
	appearance: none;
}

button{
	font-family: 'Quattrocento', serif;
	font-size:100%;
	cursor: pointer; /* Change the cursor to a hand icon */
	color:black;
}

input[type=text]{
	font-family: 'Quattrocento', serif;
	border:1px solid silver;
	font-size:100%;
	padding:0.2em;
	outline:none;

}
input[type=submit],button[type=submit], select{
	font-family: 'Quattrocento', serif; 
	background-color:#ddd;
	border:1px solid silver;
/*	font-size:100%; */
	margin-right: 0.3em;
	margin-bottom: 0.3em;
	padding:0.3em;
	color:black;
	font-weight: normal;
}

button[type="submit"]:hover {
	cursor: pointer; /* Change the cursor to a hand icon */
}

img {
	max-width: 100%; 
	margin:0;
	padding:0;
}

p img {
	border:0px solid yellow;
	margin:0;
	padding:0;
}


h1 {
	line-height: 1.3em; 
	display: block;
	font-size: 2em;
	margin-top: 0.67em;
	margin-bottom: 0.67em;
	margin-left: 0;
	margin-right: 0;
	font-weight: bold;

}

#content.post h1 {
	margin-bottom:0;
	padding:0;
	color: red;
}

h1 {
	color:black;

}


h2 {
	font-weight: normal;
	line-height: 130%;
}

h3 {
/*	border-top: 1px solid #eee; */
	padding-top: 1em;
	color: #777; 
	display: block;
	font-size: 1.17em;
	margin-top: 1em;
	margin-bottom: 1em;
	margin-left: 0;
	margin-right: 0;
	font-weight: bold;

}

a {
	color: #333;
	text-decoration: none;
	border-bottom: 1px solid #ccc; 
}
	a:hover,
	.nav a:hover {
		color: #000;
		border-color: #aaa; 
	}

blockquote {
	margin-left: 0;
	padding-left: 1.5em;
	padding-right: 2em; 
	border-left: 4px solid #ddd; 
	font-style: italic; 
	color: #777; 
}

pre {
	border:1px solid #ccc;
	overflow-x: auto;
/*	position:absolute; */

}

/*
pre {
	font-size: 14px; 
	border-left: 4px solid #ddd; 
	line-height: 1.4em;
	padding: 1em;
}
*/

code {
/*	background: #eee; */
/*	border: 1px solid #ddd; */
/*	border: 1px solid blue; */
/*	white-space: pre;
    	 overflow-x: auto; */
}



/*********************************************************************
 * 2. Masthead area
 *
 */

.topnav, .topnav li {
	list-style: none; 
	padding: 0;
	margin: 0;
}
	.topnav li {
		float: left; 
		margin-right: 1em;
		margin-bottom: 1em;
		overflow: auto;
	}
	.topnav a {
		padding: 0.25em 0.5em;
		text-decoration: none; 
		display: block;
		background: #ec4; /*#fad33d;*/ /*#fce99e; #adbcff;*/ /* #eee */
		color: #333; 
		border: 1px solid #eee; 
	}
	.topnav a:hover {
		background: #ddd;
		border-color: #ddd; 
	}
	.topnav li.current a {
		background: #ddd; 
		border-color: #ddd; 
	}
	.topnav li.edit a {
		background: none; 
	}


.sitetop {
	
}	
.sitename {
	display: inline-block;
	font-size:120%;
	margin-bottom:0.7em;
	font-weight: bold;
	width:10%;
}
.languages {
	list-style: none; 
	display: inline-block;
	margin: 0;
	padding: 0; 
	float: right;
	width:25%; 
	font-size: 80%; 
}

	.languages li {
		list-style: none; 
		display: inline-block;
		margin: 0;
		padding: 0;
	}

	.languages a {
		padding: 0 0.5em;
		border: none; 
		display: inline;
		border-left: 1px solid #ccc; 
	}
		.languages li.current a {
			font-weight: bold; 
		}
		.languages li:first-child a {
			border: none; 
			padding-left: 0;
		}



form.search {
	float: right; 
	margin: 0;
	width: 25%; 
/*	padding-bottom: 1em;*/
}
	form.search input {
		margin: 0;
		padding: 0.5em 0.5em;
		border: 1px solid #ccc; 
		width: 100%; 
	}

.breadcrumbs {
	font-size: 80%; 
	width: 70%; 
	float: left;
	clear: both; 
	padding-top: 0em; 
	margin-bottom:1em;
}
	.breadcrumbs span:after {
		content: ">";
		color: #999; 
		padding-left: 0.5em;
		padding-right: 0.25em; 
	}

/*********************************************************************
 * 3. Main content and sidebar
 *
 */

#main {
	border-top: 1px solid #eee; 
	padding-top: 0em; 
	margin-top: 1em; 
	clear: both; 
}

body #content {
	width:68%; 
/*	max-width:100%;*/
	/*border:1px solid red;*/
}

#content, #sidebar {
	padding-bottom: 2em; 
}

body.has-sidebar #content {
	width: 68%; 
	float: left;
}

body.has-sidebar #sidebar {
	width: 32%;
	padding-left: 5%; 
	float: left; 
}

.nav {
	margin-left: 0;
	padding-left: 0;
	list-style: none; 
}
	.nav .nav {
		padding-left: 1.5em;
		list-style: disc;
	}
	.nav li {
		margin: 1em 0;
	}

	.nav-tree li {
		margin-top: 0;
		margin-bottom: 0;
	}

	.nav a {
		font-weight: bold;
	}

	.nav-tree li a {
		color: #777; 
	}

	.nav .current > a {
		color: #333; 
	}

#sidebar img + blockquote {
	margin-top: 0; 
}

.align_left {
	/* for images placed in rich text editor */ 
	float: left;
	margin: 0 1em 0.5em 0; 
	position: relative;
	top: 0.5em;
	max-width: 100%; 
}

.align_right {
	/* for images placed in rich text editor */ 
	float: right;
	margin: 0 0 0.5em 1em;
	max-width: 100%; 
}

.align_center {
	/* for images placed in rich text editor */ 
	display: block;
	margin: auto; 
	position: relative;
	padding:0;
}

a img{
	border:none;
}

figure{
	display:table;
}

figure.align_center {
	display:table;
	width:100%;
}

figure.align_center img{
	width:100%;
	height:auto;
}

figure a {
	border:0;
}


figure figcaption {
	display:table-caption;
	caption-side: bottom ;
	font-size:smaller;
	width:auto;
}

/*********************************************************************
 * 4. Footer
 *
 */

#footer {
	clear: both; 
	border-top: 1px solid #eee; 
	font-size: 80%; 
}

/*********************************************************************
 * 5. Media queries for responsive layout
 *
 */
/* 767 */
@media only screen and (max-width: 767px) {
	/* mobile layout */ 

	.sitetop{
	}
	.languages {
		width: 50%; 
		margin:0;
		float:right;
		text-align:right;
	/*	margin-bottom: 1em; */
	}
	.topnav {
		display:inline-block;
		float: none;
		clear: both; 
/*		width: auto; */
		text-align: justify;
	}
	.breadcrumbs {
		margin-bottom: 1em;
		margin-top: 0;
	}

/*	body, td, textarea {
		font-size: 100%; 
	}

*/	

/*	h1 {
		font-size:180%;
	}	
*/
	body.has-sidebar #content, 
	body.has-sidebar #sidebar {
		float: none;
		width: 100%; 
		padding: 0; 
	}
	form.search {
		float:none;
		display:inline-block;
	/*	padding-bottom: 0;*/
		overflow:hidden;
		width:100%;
/*		height: 2.3em;*/

		border:1px solid #ccc;
	}
	form.search input {
		margin: 0;
		padding: 0.25em 0.5em;
		border: 1px solid #ccc; 
	/*	width: 100%; */
/*		overflow:hidden;*/
		border:0;
		font-size:1em;
	}


	#content {
		width: 100%; 
	}
	body #content{
		width: 100%;
	}

	#sidebar {
		border-top: 1px solid #eee;
		padding-top: 1em; 
	}

	.align_left, .align_right, .align_center {
		display: block;
		float: none; 
		margin: 1em auto;
		max-width: 100%; 
	}

	figure .align_left, .align_right, .align_center {
		display:table;
	/*	width:100%; */
		order:1px solid red;
	}

/*
	figure .align_left, .align_right, .align_center img{
		width:100%;
		height:auto;
		padding:0;
		margin:0;
	}

*/

}



@media only screen and (max-width: 38em) {

	.post-featured-image{
		float:none;
		display:block;
		margin:0px;
		margin-bottom:1em;
	width:100%;
		height:100%;
	}

}

.tags {
	padding:0;
	margin:0;
}

@media only screen and (min-width: 1200px) {
	/* extra-wide desktop layout */ 
	
/*	body, td, textarea {
		font-size: 115%; 
	}*/
}

/*********************************************************************
 * 6. Accessibility helpers
 *
 */

/* Hide visually, but remain approachable for screenreader */

.visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	white-space: nowrap;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	border: 0;
}

/* Show bypass link on hover */

.element-focusable:focus {
	clip: auto;
	overflow: visible;
	height: auto;
}

/* Sample styling for bypass link */

.bypass-to-main:focus {
	top: 0;
	left: 0;
	width: 100%;
	height: 40px;
	line-height: 40px;
	text-align: center;
	background: #333;
	color: #fff;
}

/* Comments */

.CommentForm {
	overflow: hidden;
}


.CommentText{
/*	color:#666; */
/*	font-size:smaller;*/
	padding-top:0;
	margin-top:0;

}

.CommentText p{
	padding-top:0;
	margin-bottom:2em;
}

#CommentForm_text {
	border-top:2px solid #000;
	border-bottom:2px solid #000;
	border:1px solid #999;


	width:100%;
	min-width:100%;
	max-width:100%;
	color:black;
	background-color: #eee;
}

#CommentForm_email {
	background-color: #eee;
}

#CommentForm_cite {
	background-color: #eee;
}

#CommentForm_website{
	background-color: #eee;

}

.CommentFormText {
	width:100%;
	display:block;
}

/* Blog */

.post-featured-image{

	float:left;
	display:inline-block;
	top:0;
/*	margin-left:1em; */
	margin-right:1em;
}

.singlepost-small {
	clear:both;
	border-top:1px solid #ccc;
	margin-top:1em;
	margin-bottom:1em;
	overflow:hidden;
}

p.post-small
{
	padding:0;
	margin:0;
	clear:both;
}

.post-body{
	display:table;
}


h4.post-headline {
	padding-top: 0.5em;
	color: #777; 
	display: block;
	font-size: 1.17em;
/*	margin-top: 1em; 
	margin-bottom: 0.0em;
	margin-left: 0;
	margin-right: 0; */
	font-weight: bold;

}


h4.post-headline a {
	border:0;
}

h4.post-headline a:hover {
	border-bottom: 1px solid #ccc; 

}

.singlepost-small h2 {
/*	border:1px solid black; */
	margin-bottom:0em;
	padding-bottom:0;
}

.singlepost h1{
	margin-bottom:0;
}
.singlepost h1 a{
/*	border:1px solid black; */
	margin-bottom:0em;
	padding-bottom:0;
	border:none;
}

hr {
	border:0;
	border-bottom:1px solid #ddd;
}

.post-byline {
	font-size:smaller; /* 80%;*/
	margin:0;
	padding:0;
}

.post-head {
	position:relative;
	margin:0;
/*	margin-bottom:1em; */
	border:0px solid red;
	padding:0;
	margin-bottom:1em;
}


h2.post-headline {
	display: block;
	color:black;
	margin-bottom:0;

/*	margin:0;
	padding:0;*/
	font-weight: bold;	
	line-height:100%;
/*	font-size: 2em;
	margin-top: 0.67em;
	margin-bottom: 0.67em;
	margin-left: 0;
	margin-right: 0;
*/
}

h2.post-headline a {
	border:0;
	color:black;
	line-height:normal;
}



img.post-featured-image{
	float:left;
	display:inline;
}
p.post-small {
	display:inline;

}

.more {
	margin-left:0.0em;
}
/*.more{

	display: inline-block;
	border:1px solid red;
	padding:0;
}*/

.post{
	width:100%;
}


.posts-small .post-headline {
	margin:0;
	padding:0;
}

.posts-small .post-body{
	border-bottom: 2px solid #eee; 
	display:table;
	margin-bottom:1em;
	padding-bottom:1em;
}

.post-foot {
	padding:0;
	margin:0;
	clear:both;
}

.post-body{
}

.post-body-frame{
	display:block;
}
.post-body{
	display:block;
	width:100%;
/*	border: 2px solid yellow; */
/*	background-color: #ccc; */
}



/*
h4.posts-small .post-headline {
	color:green;
}
*/

li.CommentListItem {
	list-style:none;
	margin:0;
}

ul.CommentList{
	padding:0;
}

img.gravatar {
	vertical-align: middle;
	width:40px;
}

p.comment-head {
	margin-bottom:0;
	padding:0;
}

div.comment-date{
	margin:0;
	font-size:80%;
	padding:0;
}


.CommentForm {
/*	border:5px solid red; */
}


.CommentFormNormal {
	border:0px solid #eee;
	margin:0;
	padding:0;
}



#CommentForm {
/*	border-top:2px solid #eee; */
	margin-top:0;
	padding-top:0;
}


#CommentForm h4{
	padding:0;
	margin-bottom:0;
	
}



#comments{
}

#comments h4{
	border-top:2px solid #eee; 
/*	border-top: 1px solid red; */
	margin-top: 1em;
	padding-top:1em;
}

p.CommentFormCite label
{
	display: block;
}
p.CommentFormEmail label
{
	display: block;
}
p.CommentFormWebsite label
{
	display: block;
}




ul.MarkupPagerNav{
	border:0;
	list-style:none;
	margin-bottom:1em;
	padding:0;
}

ul.MarkupPagerNav li{
	width:1em;
	border:1px solid #eee;
	display:inline;
	padding: 0.3em;
	line-height:2.5em;
	margin-bottom:0.4em;
}
ul.MarkupPagerNav a{
	text-decoration:none;
	border:0;
}

ul.MarkupPagerNav li.MarkupPagerNavOn {
/*	border:1px solid red; */
	background-color:#eee;
}



.blog_body_col1 {
	display:inline-block; 
	vertical-align:top;
}


.blog_body_col2 {
	vertical-align:top;
	display:inline-block;
}

@media only screen and (max-width: 767px) {
	/* mobile layout */ 

.blog_body_col1 {
	vertical-align:top;
	min-width:100%;
}


.blog_body_col2 {
	vertical-align:top;
	min-width:100%;
}



}