/*
	Theme Name: HTML5 Blank
	Template: html5blank-stable
	Theme URI: http://html5blank.com
	Description: HTML5 Blank WordPress Theme
	Version: 1.4.3
	Author: Todd Motto (@toddmotto)
	Author URI: http://toddmotto.com
	Tags: Blank, HTML5, CSS3

	License: MIT
	License URI: http://opensource.org/licenses/mit-license.php
*/

/*------------------------------------*\
	TYPOGRAPHY
\*------------------------------------*/
@font-face {
	font-family:'Font-Name';
	src:url('fonts/font-name.eot');
	src:url('fonts/font-name.eot?#iefix') format('embedded-opentype'),
		url('fonts/font-name.woff') format('woff'),
		url('fonts/font-name.ttf') format('truetype'),
		url('fonts/font-name.svg#font-name') format('svg');
    font-weight:normal;
    font-style:normal;
}
/*------------------------------------*\
    BODY CSS
\*------------------------------------*/
body{
	font-family: 'Fakt Pro', sans-serif;
	font-size:16px;
	font-weight:400;
	color:#333333;
}
/*------------------------------------*\
    HEADINGS CSS
\*------------------------------------*/
h1, h2, h3, h4, h5, h6{
	color: #333333;
}
/*------------------------------------*\
    LINKS CSS
\*------------------------------------*/
a {
	color:#189dd9;
}
a.read-more:hover:after,
a:hover {
	color:#189dd9;
}
/*------------------------------------*\
    LIST CSS
\*------------------------------------*/
li:before {
    color: #189dd9;
}

/*------------------------------------*\
    BUTTONS CSS
\*------------------------------------*/
a.button,
.button,
span.button,
a.button-white,
.button-white,
span.button-white,
a.button-dark,
.button-dark,
span.button-dark,
a.button-outline,
.button-outline,
span.button-outline,
a.button-outline-dark,
.button-outline-dark,
span.button-outline-dark  
{
	background:#189dd9;
	color: #fff !important;
	border: 2px solid #189dd9;
	font-size:20px !important;
}
a.button:hover,
.button:hover,
span.button:hover {
	background:#fff;
	color: #189dd9 !important;
	border: 2px solid #189dd9;	
}
a.button-white,
.button-white,
span.button-white {
	background:#fff;
	color: #189dd9 !important;
	border: 2px solid #fff;		
}
a.button-white:hover,
.button-white:hover,
span.button-white:hover {
	background:#189dd9;
	color: #fff !important;
	border: 2px solid #189dd9;		
}
a.button-dark,
.button-dark,
span.button-dark {
	background:#333;
	color: #fff !important;
	border: 2px solid #333;		
}
a.button-dark:hover,
.button-dark:hover,
span.button-dark:hover {
	background:#fff;
	color: #333 !important;
	border: 2px solid #333;		
}
a.button-outline,
.button-outline,
span.button-outline {
	background:#fff;
	color: <strong>#189dd9</strong> !important;
	border: 2px solid #189dd9;	
}
a.button-outline:hover,
.button-outline:hover,
span.button-outline:hover {
	background:#189dd9;
	color: #fff !important;
	border: 2px solid #189dd9;	
}
a.button-outline-dark,
.button-outline-dark,
span.button-outline-dark {
	background:#fff;
	color: #333 !important;
	border: 2px solid #333;	
}
a.button-outline-dark:hover,
.button-outline-dark:hover,
span.button-outline-dark:hover {
	background:#333;
	color: #fff !important;
	border: 2px solid #333;	
}
/*------------------------------------*\
    START FORMS CSS
\*------------------------------------*/
select, 
input[type="text"], 
input[type="email"], 
input[type="password"], 
input[type="date"], 
input[type="tel"],
textarea {
    border: 1px solid #ccc;
	background-color: #fff;
	color: #333;
}
.home select, 
.home input[type="text"], 
.home input[type="email"], 
.home input[type="password"], 
.home input[type="date"], 
.home input[type="tel"],
.home textarea {
    border: 1px solid #f8f8f8;
	color: #c8c8c8;	
}
::-webkit-input-placeholder {
	color: #c8c8c8;
}
::-moz-placeholder { 
	color: #c8c8c8;
}
:-ms-input-placeholder {
	color: #c8c8c8;
}
:-moz-placeholder { 
	color: #c8c8c8;
}
div.wpcf7-mail-sent-ok {
    border: 2px solid #189dd9;
}
/*------------------------------------*\
    END FORMS CSS
\*------------------------------------*/
/*------------------------------------*\
    START TOPHEADER CSS
\*------------------------------------*/
.topheader {
	background: #e8e8e8;
}
/*------------------------------------*\
    END TOPHEADER CSS
\*------------------------------------*/

/*------------------------------------*\
    START MIDDLEHEADER CSS
\*------------------------------------*/
ul.list-items-middelheader li,
ul.list-items-middelheader li a {
	color: #189dd9;	
}
ul.list-items-middelheader li a:hover {
	color: #333;	
}
/*------------------------------------*\
    END MIDDLEHEADER CSS
\*------------------------------------*/


/*------------------------------------*\
    START MENU CSS
\*------------------------------------*/
.nav ul li a:link, 
.nav ul li a:visited, 
.nav ul li a:active {
    color: #333;
}
.nav ul li.current_page_item a:link,
.nav ul li.current_page_item a:visited,
.nav ul li.current_page_item a:active {
	color: #189dd9;
	border-top: 4px solid #189dd9;	
}
.nav ul li a:hover
{
	color: #189dd9;
}
.nav ul ul li a:link,
.nav ul ul li a:visited,
.nav ul ul li a:active
{
    color: #fff;
}
.nav ul ul li a:hover
{
	background-color: #189dd9;
	color: #fff;
}
.nav ul ul li.current_page_item a:link, 
.nav ul ul li.current_page_item a:visited, 
.nav ul ul li.current_page_item a:active {
    color: #fff;
}
/*------------------------------------*\
    END MENU CSS
\*------------------------------------*/

/*------------------------------------*\
    START SOCIAL MEDIA IN MENU CSS
\*------------------------------------*/

.social-icons a {
    color: #c8c8c8;
    background-color: #fff;
    border: 2px #c8c8c8 solid;
}
.social-icons a:hover {
    color: #189dd9;
}
/*------------------------------------*\
    END SOCIAL MEDIA IN MENU CSS
\*------------------------------------*/

/*------------------------------------*\
   START SLIDER CSS
\*------------------------------------*/
.slider-content h3 {
	color:#fff;
}
.slider-content h2 {
	color:#fff;
	text-shadow: 5px 5px 20px rgba(0,0,0,0.8);	
}
/*------------------------------------*\
    END SLIDER CSS
\*------------------------------------*/
/*------------------------------------*\
    START FOOTER CSS
\*------------------------------------*/
.top-footer {
    background-image: url(img/bg-footer.jpg);	
}
.top-footer h3 {
	color: #fff;
}
.top-footer a {
	color: #fff;
}
.top-footer a:hover {
	color: #189dd9;
}
.top-footer ul.arrow li:before {
	color: #fff;
}
.cd-top {
    background: #189dd9;
    color: #fff;	
}
/*------------------------------------*\
    END FOOTER CSS
\*------------------------------------*/
/*------------------------------------*\
    START BODY HOMEPAGE CSS
\*------------------------------------*/
p.subtitel {
	color: #189dd9;
}
.home h2 {

}
h4.subtitel {
	color: #189dd9;
}
.post-date-fp {
	color: #189dd9;
}
.section-row-4-fp h2,
.section-row-4-fp p.subtitel {
	color: #fff;
}
.recensie-slider blockquote {
	color: #fff;
}
.recensie-slider h3 {
	color: #fff;
}
.recensie-slider h5 {
	color: #fff;
}
/*------------------------------------*\
    END BODY HOMEPAGE CSS
\*------------------------------------*/

/*------------------------------------*\
    START ANIMATIONS CSS
\*------------------------------------*/

a.button[data-aos="button-bg-change"] {
  background: #fff !important;
  color: #189dd9 !important;
  transition-property: background;
}
a.button.aos-animate[data-aos="button-bg-change"]{
    background: #189dd9 !important;
	color: #fff !important;
}
/*------------------------------------*\
    END ANIMATIONS CSS
\*------------------------------------*/


/*------------------------------------*\
	START LANDINGSPAGINA SIDEBAR CSS
\*------------------------------------*/

.sidebar .widget_text {

}
.sidebar .widget-first.widget_text {
    background-color: #189dd9;
    color: #fff;
}
.sidebar .widget_text h3,
.sidebar .widget_text a,
.sidebar .widget_text li:before {
	color: #333;
}
.sidebar .widget-first.widget_text h3,
.sidebar .widget-first.widget_text a,
.sidebar .widget-first.widget_text li:before {
	color: #fff;
}
.sidebar .widget_text a:hover {
	color: #189dd9;
}
.sidebar .widget-first.widget_text a:hover {
	color: #333;
}

/*------------------------------------*\
    END LANDINGSPAGINA SIDEBAR CSS
\*------------------------------------*/

/*------------------------------------*\
    RESPONSIVE
\*------------------------------------*/

@media only screen and (max-width:1300px) {
	a.button {
	        font-size: 16px !important;
	    }
}



@media only screen and (max-width:1200px) {
	a.button {
	        font-size: 14px !important;
	    }
}


@media only screen and (max-width:1024px) {
/*------------------------------------*\
    START RESPONSIVE MENU CSS
\*------------------------------------*/	
	.mobile-menu-container {
		background-color: #fff;
		box-shadow: 0px 0px 20px rgba(0,0,0,0.1);		
	}
	#menu-mobielmenu .menu-item-has-children.active, 
	#menu-mobielmenu .haschild.active {
		background-color: #fff;		
	}
	#menu-mobielmenu .menu-item-has-children.active .mobile-close, 
	#menu-mobielmenu .first-child .mobile-exit, 
	#menu-mobielmenu .haschild.active .mobile-close {
		background: #333;
		color: #fff !important;		
	}
	#menu-mobielmenu li {
		border-bottom: 1px solid rgba(229,229,229,0.7);
	}	
	#menu-mobielmenu li .sub-menu a, 
	#menu-mobielmenu li a {
		color: #189dd9;
	}
	#menu-mobielmenu .menu-item-has-children.active > a, 
	#menu-mobielmenu .haschild.active > a {
		color: #189dd9;
		border-bottom: 1px solid rgba(229,229,229,0.7);		
	}
	.contact-mobile-menu h3 {
		color: #189dd9;
	}	

	.info-middleheader ul li{
		font-size: 14px;
	}
/*------------------------------------*\
    END RESPONSIVE MENU CSS
\*------------------------------------*/	
}


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

	a.button {
	        font-size: 14px !important;
	    }

    }

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

    .slider-content{
	margin-top:  140px;
	}

	.row-1-fp-titel h1{
		font-size: 35px;
	}
}