/*
 Theme Name:   Donovan-Doorbraak
 Theme URI:    http://example.com/donovan-doorbraak/
 Description:  Donovan Child Theme for Doorbraak.eu
 Author:       Geert L.
 Author URI:   http://example.com
 Template:     donovan
 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:  donovan-doorbraak
*/

/*
 * Overriding CSS variables here:
 */

/********************************************************
 *
 *	site colors:
 *
 *******************************************************/

/*
 * overriding donovan css vars for doorbraak house style
 */
:root {
  --button-color:#3e9393;
  --button-hover-color: #4db8b8;
  --submenu-color: #3e9393;
  --submenu-hover-text-color: rgba(0,0,0,1);

}

/*
 * overriding the background color with the boxes to make it more readable
 */
.boxed-theme-layout .site {
	margin: 0 auto;
	max-width: 1440px;
	background: #b2e0e0;
}

/*
 * override the header background color
 */
.site-header {
	background: #b2e0e0;
}

/*
 * override for the divider between posts in the mobile/view:
 */
.site-main > article,
.post-wrapper > article,
.type-post,
.type-page,
.type-attachment{
	border-bottom: 10px solid #b2e0e0;
}


/*
 * since we use the more-link as comment button we can hide it in the overview:
 */
.

/********************************************************
 *
 *	Posts and excerpts, how they are displayed on the site
 *
 *******************************************************/

/*
 * sticky post border, make it green instead of a sad grey
 */
.site-main .sticky {
	border: 10px solid #3e9393;
}

/*
 * change post thumbnail size, try to get text next to it
 */
/*.attachment-post-thumbnail.size-post-thumbnail.wp-post-image img{
	max-width: 30%;
	height: auto;
	float:left;
	margin-right:17px;
}

/*
 *  try to get the post title next to the post thumbnail
 */
.entry-header h2{
	clear:none;
}

/*
 *  color of titles on front page:red? 
 */
/*.entry-header h2.entry-title  a{
	color:red;
}
*/

/*
 * override, make posting date float right
 */
.entry-meta{
	/* float:right; */
}

/*
 * make the excerpt text start flush with the top of the thumbnail
 */
.entry-content.entry-excerpt.clearfix p{
	margin-top: 0em;
}

/*
 * post overview thumbnails, adjusting size, margin, location.
 */

.attachment-post-thumbnail.size-post-thumbnail.wp-post-image{
	margin: unset;
	margin-right: 17px;
	max-width: 40%;
	height: auto;
	float:left;
}

/*
 * override tag/category/reactions links at bottom of post overviews for better readability
 * basically, change color to black.
 */
.entry-meta a:link,
.entry-meta a:visited,
.entry-footer a:link,
.entry-footer a:visited {
        color: rgba(0, 0, 0, 1);
}

/*
 * we use a more-link type of button for comments. so we remove this one:
 */
.entry-footer.post-details div.entry-comments{
	display:none;
}

/*
 * override for more-link buttons (and comment-button at the same time)
 */
.more-link{
	margin-right: 10px;
	padding-top: 3.75px;
	padding-bottom: 3.75px;
	
}

/*
 * to keep it balanced with the size of the more-link buttons:
 */
button,
input[type="button"],
input[type="reset"],
input[type="submit"]{
	padding-top: 3.75px;
	padding-bottom: 3.75px;
}


/*
 * remove the whole meta-author bit from the site:
 */
.meta-author{
	display:none;
}

/*--------------------------------------------------------------
## - Greater than 1120px

	override for site titles, make em bold. 

	override for tables, make em 40% size when not on mobile/tablet:
--------------------------------------------------------------*/
@media only screen and (min-width: 600px) {

        /* Blog Layout Title */
       /* .blog-list-layout */ .content-archive /*.post-wrapper*/ .type-post .entry-title,
       /* .blog-grid-layout */ .content-archive /*.post-wrapper*/ .type-post .entry-title {
		font-weight:bold;
        }
	
	/* Tables for infokaders */
	
	.post-content .entry-content.clearfix table{
		width:100%;
	}


	/* only for tables with the 'wide' class. for the rare cases there is one on the left side
	   and it would look ugly otherwise*/
/*	.post-content .entry-content.clearfix table.leftside{
		float:left;
		margin-right:10px;
	}
*/
	.post-content .entry-content.clearfix table.wide{
		width:100%;
	}

}


/*----------------------------------------------------------------
** - greater than 

/*
table{
	width:unset;
}
*/

/********************************************************
 *
 *	Widget specifics
 *
 *******************************************************/

/*
 * override for the style of the linked lists in the widgets
 */
.widget ul li,
.widget ol li {
        padding: 0.2em 0;
	border-top:solid 1px #b8b8b8
}

/*
  greater than 640px
  override, make em bold.
*/
@media only screen and (min-width: 40em){
	.widget-title,
	.archive-title,
	.comments-title,
	.comment-reply-title {
		font-weight:bold;	
	}

}


/*********************************************************
 *
 *	logo size and position
 *
 *********************************************************/


.site-branding .custom-logo {
    width:500px
}

/** header naar het midden. wissen voor links. */
/*.header-main{
	display: block;
	text-align: center;
}
*/
