/*
 Theme Name:   Doula-Li
 Theme URI:    http://doula-li.nl
 Description:  Twenty Eleven Child Theme
 Template:     twentyeleven
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  twentyeleven
*/

@import url("../twentyeleven/style.css");

/* Structure */ 
#access div { margin: 0 3%;}
#primary {float: left;margin: 0 -35% 0 0;width: 100%;}
#content {margin: 0 33% 0 3%;width: 58%;}
#secondary {float: right;margin-right: 0%;width: 35%;}
/* Singular */
.singular.page .hentry,
.singular .hentry  { padding: 0 0 30px;}
.singular .entry-header, .singular .entry-content, .singular footer.entry-meta, .singular #comments-title {width: 80%;}
.singular #content, .left-sidebar.singular #content {margin: 0 3%;}
.singular .entry-meta .edit-link a {bottom: inherit;left: inherit;position: relative;right: inherit;top: inherit;}
#page { border: 1px solid #007DBE;}
#branding { border-top: none;}
#main {padding: 20px 0 0;}
.entry-content, .entry-summary { padding: 0; }
input[type='text'],
input[type='email'] {max-width: 100%;}
/* Typo */
body, input, textarea {
    color: #808285;
    font: 15px "Helvetica Neu", Helvetica, Arial, sans-serif;
    font-weight: 100;
    line-height: 1.625;

}
.entry-title {font-weight: 100!important;}
.entry-title, 
.entry-title a,
.singular .entry-title  {color: #C400BC;}
.entry-content h1, .entry-content h2, .comment-content h1, .comment-content h2 {font-weight: normal;color: #666;}
.widget-title,
.page-title,
.entry-header .entry-format { color: #67C7CA;}
.widget-title {
    border-bottom: 1px solid #007DBE;
    margin-bottom: 16px;
}
.widget ul {
    margin: 10px 0 0 15px;
    padding: 0;
    padding-left: 5px;
}
.post h1.entry-title,
.post h2.entry-title {
    background: url("entry-title_bg.jpg") no-repeat right bottom;
    padding-bottom: 40px;
}
.post.feature-image.large h1.entry-title,
.post.feature-image.large  h2.entry-title {
    background: none;
    padding-bottom: 0;
}
.archive .entry-header .entry-meta,
.archive .entry-header .entry-format {
    position: relative;
    line-height: inherit;
    margin-top: -24px;
}
/* Homepage */
article.intro {
    border-bottom: 1px solid #ddd;
    margin: -1.6em -3% 1.6em;
    padding: 0 3%;
}
article.intro .entry-content {
    color: #333;
    font-size: 16px;
}
/* Featured Slider */
.featured-posts {
    margin: 1em -3% 1.6em;
}
.featured-posts .showcase-heading,
section.featured-post {
    padding-left: 3%;
}
.page-template-showcase-php #main .widget-area {
    margin: 0px -25% 0 0;
    width: 25%;
}
@media (max-width: 800px) {
	.page-template-showcase-php #main .widget-area {
	    margin: 0;
	    width: auto;
	}
}
article.feature-image.small {
    width: 55%;
}
article.feature-image.small .entry-summary p a {
    left: -16%;
}
section.recent-posts .other-recent-posts a[rel="bookmark"] {
    color: inherit;
    font-size: 20px;
}
.comments-link { 
	display: none;
}
.page-template-showcase-php #content, .left-sidebar.page-template-showcase-php #content {
    margin: 0 3%;
}
article.feature-image.small .entry-summary p a {
    background: #67C7CA;
}
/* Footer */
#site-generator {
    background: #67C7CA;
    border-top: none;
    color: #fff;
    line-height: 2.5em; 
    padding: 0 10px;
    text-align: left;
}

/* Menu */
#access {
    background: #67C7CA;
    margin: 0 auto;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
#access ul li > a {
	line-height: 1.4em;
	padding: 10px 1.2125em!important;
	margin: 0;
	-webkit-transition: background .4s;
	transition: background .4s;
}
#access ul {}
#access ul ul a{
	padding: 0 1.2125em;
	line-height: 1.4em;
}
#access li:hover > a,
#access a:focus {
	background: #f9f9f9; 
	color: #373737;
	-webkit-transition: none;transition: none;
}
#access a {
	color: #FFF;
}
#access ul ul {
	top: 2.9em;
    padding: 0;
}
#access ul li > a.sf-with-ul {
    padding-right: 2.4em!important;
}


/* Alignment */
.alignleft {
	display: inline;
	float: left;
	margin-right: 1em;
}
.alignright {
	display: inline;
	float: right;
	margin-left: 1em;
}
img.alignleft, img.alignright, img.aligncenter {
    margin-bottom: 0.5em;
}


@media (max-width: 800px) {
	#main #content {
		margin: 0 3%;
	}
	#access a {
    	padding: 3px 1.2125em;
	}
	#access div { margin: 0; padding: 0;}
	#access ul { margin: 0; padding: 0;}
	.singular .entry-header, .singular .entry-content, .singular footer.entry-meta, .singular #comments-title {width: 100%;}

}