/* ----------------------------------------------------------------
    ** Responsive CSS
    ** BB-remarkable 2019
    ** www.standing-out.nl/aanhanger
-----------------------------------------------------------------*/


/* Large devices (desktops, 1200px and down) */
@media (max-width: 1199px) {
	.project-slider button.owl-prev {
		left:0!important;
	}
	.project-slider button.owl-next {
	right:0!important;
	}
	h1 {
	    font-size: 60px;
	    line-height: 60px;
	}
    section.header.content.stripe .container:before {
        width: 311px;
    }
    section.header.content.stripe .container:after {
        width: 311px;
    }
    .slider .content {
        margin-left: 309px;
    }

    #navigation .navbar-custom .navbar-nav>li>a {
        margin-left: 44px;
    }
}

/* Medium devices (desktops, 992px and up) */
@media (max-width: 991px) {
	#navigation .navbar-custom .navbar-nav>li>a {
    	margin-left: 10px;
        font-size: 15px;
    }
    .slider .content {
        margin-left: 249px;
    }
	h1 {
	    font-size: 50px;
	    line-height: 50px;
	}
    .header .video-container {
        display: none;
    }

	.header .afspraak-maken {
    	width: 100%;
	}

	.content1 img, .content2 img, .content3 img {
    	width: 100%;
	}
	.slider .image-box {
        height: 300px;
        width: 390px;
	}
	.slider .content {
		padding: 25px 0px;
	}

	.projecten .block {
    	height: 230px;
    }
    section.header.content.stripe .container:before {
        width: 238px;
    }
    section.header.content.stripe .container:after {
        width: 238px;
    }
    section.header.home.stripe.landing,
    section.header.home.stripe.landing .align {
        height: 100vh;
        overflow: hidden;
    }
}

@media (max-width: 767px)
@media (max-width: 767px){
.navbar-default .navbar-collapse, .navbar-default .navbar-form {
    border-color: transparent;
    background-color: #fff;
    width: 100%;
}}

@media (max-width: 767px){

.navbar-default .navbar-nav .open .dropdown-menu>.active>a, .navbar-default .navbar-nav .open .dropdown-menu>.active>a:focus, .navbar-default .navbar-nav .open .dropdown-menu>.active>a:hover {
	color:#fff!important;
}

@media(min-width:767px) and (max-width:992px) {
	.navbar-right{float:left;}
}
@media (min-width: 768px) and (max-width: 991px) {
    .navbar-collapse.collapse {
        display: none !important;
    }
    .navbar-collapse.collapse.in {
        display: block !important;
    }
    .navbar-header .collapse, .navbar-toggle {
        display:block !important;
    }
    .navbar-header {
        float:none;
    }
}
/* Medium devices (desktops, 992px and down) */
@media (max-width: 991px) {
	/*navigation*/
	#navigation .navbar-custom .navbar-nav>li {
    	padding: 20px 0px;
	}

	.uspbox {
    	border: none;
		max-height: unset!important;
    }
	.uspbox .usp1, .uspbox .usp2, .uspbox .usp3 {
    	width: 100%;
    	display: block;
    	border: 1px solid black!important;
    	padding: 17px 25px;
    	margin-top: 25px;
	}

    .header.home.stripe {
        background-image: url('../images/intro.jpg');
        background-size: cover;
        background-position: center;
    }

}

/* Small devices (tablets, 768px and up) */
@media (min-width: 767px) {

	.projecten .count:nth-child(2) .item {
            transition-delay: .1s;
    }
    .projecten .count:nth-child(3) .item {
        transition-delay: .2s;
    }
}

/* Small devices (tablets, 768px and down) */
@media (max-width: 767px) {
	/*navigation*/
	#navigation .navbar-custom .navbar-toggle:focus,
	#navigation .navbar-default .navbar-toggle:hover {
    	background-color: transparent;
	}
	#navigation .navbar-custom .navbar-brand .bold {
    	font-size: 23px;
    	line-height: 15px;
	}
	#navigation .navbar-custom .navbar-brand .small {
    	font-size: 11px;
	}
	#navigation .logo-text {
    	margin-top: 35px;
   	}
	#navigation .navbar-custom .navbar-nav>li {
    	padding: 20px 0px;
	}
	#navigation.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
    	background-color: transparent;
	}
	#navigation .navbar-custom .navbar-toggle {
    	border-color: transparent;
	}
	#navigation .navbar-toggle {
    	margin-top: 30px;
	}
	#navigation .navbar-nav>li {
    	border-top: 1px solid #EEE!important;
	}
	#navigation .navbar-nav>li:first-child {
    	border: none!important;
	}
	#navigation .caret {
		display: none;
	}
	.navbar-default .navbar-toggle .icon-bar {
    	background-color: #fff;
	}
	.navbar-default .navbar-collapse, .navbar-default .navbar-form {
    	border-color: transparent;
    	background-color: #fff;
	}
	#navigation .navbar-custom .navbar-nav>li>a {
    	margin-left: 0px;
    	color: #01051e;
    }
    .navbar-nav {
    	margin: 0px -15px;
	}
	#navigation .navbar-brand {
		height: 70px;
	}
	.navbar-header {
    	height: 80px;
	}
	#navigation .navbar-toggle {
    	margin-top: 23px;
	}
    .slider .content h3 {
        font-size: 20px;
        line-height: 20px;
    }
    section.header.content.stripe .container:before,
    section.header.content.stripe .container:after {
        display: none;
    }
    section.header.stripe.home .container:before {
        display: none;
    }
	h1 {
	    font-size: 35px;
	    line-height: 35px;
	}
    .contact .box {
        margin-top: 0px;
    }
	.header .align {
		min-height: 500px;
		display: block;
		padding-top: 100px;
	}
	.header {
    	min-height: 500px;
	}
	.header .afspraak-maken {
    	width: calc(100% + 15px);
    	margin-right: -50px;
    	overflow: hidden;
	}
	.header .afspraak-maken {
    	padding: 20px 0px;
    }
    .header .afspraak-maken:before {
    	margin-top: -20px;
    }
    .header .afspraak-maken .content {
    	padding-right: 15px;
	}
	.header .afspraak-maken .right {
    	float: left;
    	width: calc(100% - 15px);
	}
	.header .afspraak-maken .button {
   		width: 100%;
   		float: left;
   		margin-right: 0px;
   		text-align: center;
	}
    div#global-nav {
        width: 100%;
    }
    .header.vac .afspraak-maken .content {
        width: 100%;
    }
    .header.vac .content p {
        font-size: 14px;
        line-height: 18px;
    }

	/* -- Content 1 -- */
	.content1 {
    	margin: 50px 0px;
	}
	.slider {
    	margin: 50px 0px;
	}
	.content1 h2, .content2 h2, .content3 h2, h2.main {
    	line-height: 30px!important;
    	font-size: 30px!important;
    }
    .slider .container #slider:after {
    	background-color: transparent;
    }
    .content1 img, .content2 img, .content3 img {
    	width: 100%;
    	max-width: 100%;
    	padding: 50px 0px;
	}
    .slider .content {
    margin-left: 15px;
    max-width: 590px;
    height: unset;
    min-height: 10px;
    background-color: #01051e;
    width: calc( 100% + 30px);
    padding-right: 23px;
	}
	.slider .carousel-indicators li.active {
		background-color: #fff;
	}
	.slider .carousel-indicators li {
    	border: 2px solid #ffffff;
    }
    .slider .carousel-indicators {
    	left: 51px;
    }
    .slider2 .item.row,
    .slider.item.row {
    	width: unset!important;
    	padding-right: 15px!important;
	}
	.slider .image-box {
   		height: 200px;
   		min-width: 290px;
   		width: calc(100% + 15px);
	}
	.projecten {
    	margin: 50px 0px;
	}
	footer#footer {
    	padding: 50px 0px;
    }
    .slider .carousel-indicators {
        left: 64px;
        bottom: -6px;
    }
    section.contact-blok h3 {
        font-size: 28px;
        margin-bottom: 45px;
        line-height: 28px;
    }
    section.contact-blok .content {
        margin: 25px;
    }
    section.contact-blok {
        margin: 50px 0px;
    }
	#footer .navbar-brand {
    	padding: 0px;
    	margin-bottom: 20px;
    }
    section.header.content {
    	min-height: 200px;
    }

    .slider2 .content {
    	height: auto;
    }
    .slider2 .image-box {
    	width: 100%;
    	margin-left:0px;

    }
 	.slider2 {
    	margin: 50px 0px;
	}
    .slider2 h3 {
    	margin-bottom: 30px;
    	font-size: 30px;
    	line-height: 30px;
    }
    .slider2 .control {
    	margin-bottom: 20px;
	}

    .content3 span.imagecontent {
        bottom: 80px;
    }
    #slider span.imagecontent {
        right: 15px;
    }
    .project span.imagecontent {
        bottom: 150px;
    }



}
