/* 
Theme Name: Alcoba
Theme URI: https://www.alcoba.nl
Author: Buro Wild - Ongetemde Merkjagers
Author URI: https://burowild.nl
Description: Custom Wordpress theme/template
Version: 1.0 
*/

.grid-container{
	max-width: 85rem;
}

.first{
	padding-top: 250px !important;
}

h1, h2, h3, h4, h5, h6{
	font-family: "oxanium", sans-serif;
	font-weight: 700;
	font-style: normal;
}

h1{
	font-size: 50px;
	line-height: 50px;
}

h2{
	line-height: 40px;
}

h6{
	font-size: 18px;
	line-height: 18px;
}

.drilldown a{
	background: none;
	padding-left: 0px !important;
}

.submenu.is-drilldown-submenu{
	background: none !important;
	margin-left: 0px !important;
}

.menu .active > a{
	background: #EC6607;
	border-radius: 5px;
}

.menu .active > a:hover{
	color: #004168;
}

p, table{
	font-family: "avenir-lt-pro", sans-serif;
	font-weight: 300;
	font-style: normal;
	font-size: 16px;
}

hr{
	max-width: 100% !important;
	width: 100% !important;
}

.button, input[type=submit]{
	font-family: "oxanium", sans-serif;
	font-weight: 700;
	font-style: normal;
	background: #EC6608;
	border-radius: 10px;
	padding: 20px 30px;
	color: white;
	border: none;
}

.button:hover{
	background: #003E66;
}

.button.dark{
	background: #003E66 !important;
	color: white !important;
}

.button.dark:hover{
	background: white !important;
	color: #003E66 !important;
}

#menu{
	padding-top: 20px;
	padding-bottom: 20px;
	position: fixed;
	width: 100%;
	z-index: 10;
	background: rgba(0, 62, 102, 0.9);
}


.top-bar, .top-bar ul{
	background-color: transparent;
	color: white !important;
}

.top-bar a{
	color: white;
	font-family: "oxanium", sans-serif;
	font-weight: 700;
	font-style: normal;
}

.top-bar a:hover{
	color: #EC6607;
}

.is-dropdown-submenu{
	background-color: #EC6607 !important;
	border: none;
	list-style: none;
}

.submenu{
	background: #EC6607 !important; 
	border-radius: 10px;
	padding: 15px;
}

.submenu a:hover{
	color: #003E66 !important;
}

.dropdown.menu > li.is-dropdown-submenu-parent > a::after{
	border-color: #EC6607 transparent transparent;
}

.title-bar{
	background: #004168;
}


#header{
	min-height: 200px;
	background: url('img/dots.png'), linear-gradient(90deg,rgba(0, 62, 102, 0.8) 0%, rgba(0, 62, 102, 0.8) 100%), url('img/Unknown.jpeg');
	background-size: contain, cover, cover !important;
	background-repeat: no-repeat !important;
	background-position: left, center, center !important;
	padding-top: 200px;	
	color: white;
	position: relative;
	overflow: hidden;
}



#headersmall{
	min-height: auto;
	background: url('img/dots.png'), linear-gradient(90deg,rgba(0, 62, 102, 0.8) 0%, rgba(0, 62, 102, 0.8) 100%), url('img/Krapteberoep_Lasser-scaled.jpg');
	background-size: contain, cover, cover !important;
	background-repeat: no-repeat !important;
	background-position: left, center, center !important;
	padding-top: 200px;	
	padding-bottom: 100px;
	color: white;
	position: relative;
	overflow: hidden;
}

.alcobaheader{
	position: absolute;
	right: 0px;
	top: 0px;
	height: 100%;
}

.headerimg{
	height: 600px;
	
}

#steps{
	position: relative;
	padding-bottom: 100px;
}

#steps .grid-container{
	margin-top: -100px;
}

#step{
	min-height: 200px;
	border-radius: 25px;
	background: #E1E8F0;
	padding: 30px;
	color: #003E66;
}

.laststep{
	padding-top: 100px !important;
	background: #EC6608 !important;
	color: white !important;
	transition: 0.5s;
}

.laststep:hover{
	transition: 0.5s;
	background: #003E66 !important;
}

#contentsectie1, #contentsectie2{
	min-height: 500px;
	background: white;
	padding-top: 100px;
	padding-bottom: 100px;
	color: #003E66;
}
#contentsectie1 li, #contentsectie2 li{
	font-family: "avenir-lt-pro", sans-serif;
	font-weight: 300;
	font-style: normal;
	
}

.imgsquare{
	background: black;
	height: 500px;
	border-top-right-radius: 30px;
	border-top-left-radius: 30px;
	border-bottom-left-radius: 30px;
	position: relative;
	overflow: hidden;
}

.imgsquare img{
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	object-fit: cover;
}

#klanten{
	min-height: 500px;
	background: #E1E8F0;
	padding-top: 150px;
	padding-bottom: 150px;
	color: #003E66;
}

.klant{
	min-height: auto;
	border-radius: 30px;
	background: white;
	padding: 30px;
}

.klantimg{
	min-height: 300px;
	border-radius: 30px;
	background-size: cover !important;
	background-position: center !important;
}

.pf{
	min-height: 400px;
	border-radius: 30px;
	background-size: cover !important;
	background-position: center !important;
}

.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev{
	width: 40px;
	height: 40px;
	background: #EC6607;
	color: white;
}

.owl-carousel .owl-nav button.owl-next:hover, .owl-carousel .owl-nav button.owl-prev:hover{
	background: #003E66 !important;
}

.owl-nav{
	margin-top: 50px !important;
}

#socialmedia{
	min-height: 500px;
	background: linear-gradient(180deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 60%, rgba(225, 232, 240, 1) 60%, rgba(225, 232, 240, 1) 100%);
	padding-top: 100px;
	padding-bottom: 100px;
}

.bloklarge{
	padding: 100px;
	min-height: auto;
	background: url('img/dots.png'),  #003E66;
	background-size: cover !important;
	color: white;
	border-radius: 30px;
	width: 100%;
}

.bloklarge.orange{
	background: url('img/dots.png'),  #EC6608;
}

.bloklarge.orange a{
	color: #003E66;
}

.bloklarge a{
	color: #EC6608;
}

.bloklarge a:hover{
	color: white;
}

.blokimg{
	min-height: 300px;
	background-position: center !important;
	background-size: cover !important;
	border-radius: 30px;
	margin-bottom: 30px;
}

#products{
	min-height: 500px;
	background: #E1E8F0;
	padding-top: 150px;
	padding-bottom: 150px;
	color: #003E66;
}

#product{
	min-height: 400px;
	border-radius: 30px;
	background: white;
	padding: 30px;
	position: relative;
}
.productimg{
	min-height: 350px;
	margin-bottom: 20px;
	border-radius: 30px;
	background-size: contain !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
}

.producttekst{
	width: 75%;
}

.btn{
	height: 50px;
	width: 50px;
	background: #EC6607;
	color: white;
	padding-top: 12px;
	position: absolute;
	right: 30px;
	bottom: 30px;
	border-radius: 50px;
}

.btn:hover{
	background: #003E66;
}

#productsingle{
	min-height: 500px;
	background: white;
	padding-top: 250px;
	padding-bottom: 150px;
	color: #003E66;
}

#productsingle img{
	border-radius: 40px;	
}

#galerij{
	padding-top: 50px;
	padding-bottom: 50px;
}

.galeryimg{
	min-height: 450px;
	border-radius: 30px;
	position: relative;
	overflow: hidden;
}

.galeryimg img{
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	object-fit: cover;
}

#cta{
	min-height: auto;
	background: #E1E8F0;
	padding-top: 100px;
	padding-bottom: 150px;
	color: #003E66;
}

#contactproduct{
	margin-top: 100px;
}


#categories{
	min-height: auto;
	background: #E1E8F0;
	padding-top: 50px;
	padding-bottom: 50px;
	color: #003E66;
}

#evenvoorstellen{
	background: linear-gradient(-90deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 30%, rgba(225, 232, 240, 1) 30%, rgba(225, 232, 240, 1) 100%);
	padding-top: 150px;
	padding-bottom: 150px;
	color: #003E66;
}

.wpml-ls-statics-footer{
	display: none !important;
}

.accordion-title{
	font-family: "oxanium", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 18px;
	background: #003E66;
	color: white;
}

.accordion-content{
	font-family: "avenir-lt-pro", sans-serif;
	font-weight: 300;
	font-style: normal;
	font-size: 16px;
}

#footer{
	background: linear-gradient(180deg,rgba(0, 62, 102, 0.8) 0%, rgba(0, 62, 102, 0.8) 100%), url('img/alcoba_img1.jpg');
	background-size: cover !important;
	background-position: center;
	min-height: 300px;
	position: relative;
}

#footerimg{
	position: relative;
	min-height: 200px;
}

#footerimg img{
	position: absolute;
	width: 250px;
	bottom: 0px;
}

#footercontact{
	padding-top: 100px;
	padding-bottom: 100px;
	color: white;
}

#footer a{
	color: white;
}

#footer a:hover{
	color: #EC6607;
}

#footer table{
	font-family: "avenir-lt-pro", sans-serif;
	font-weight: 300;
	font-style: normal;
	font-size: 16px;
	background: none !important;
}

#footer ul{
	margin-left: 0px;
	font-family: "avenir-lt-pro", sans-serif;
	list-style: none;
}

#menu-footer-menu li a{
	padding-left: 0px;
	padding-bottom: 5px;
	padding-top: 5px;
	width: 100%;
}

#menu-footer-menu li{
	width: 100%;
}

tr, tbody{
	background: none !important;
	border: none;
}

td{
	padding-left: 0px !important;
	padding-top: 2px !important;
	padding-bottom: 2px !important;
}

.square{
	height: 50px;
	width: 50px;
	position: absolute;
	right: 0px;
	bottom: 0px;
	background: #EC6607;
}

#socket{
	background: #003E66;
	color: white;
	padding-top: 15px;
}

#socket a{color: white;}
#socket a:hover{color:#EC6607; }

/* Small only */
@media screen and (max-width: 39.9375em) {
	
	h1{
		font-size: 45px;
		line-height: 50px;
	}
	
	h2{
		font-size: 40px;
		line-height: 40px;
	}

	.first{
		padding-top: 150px !important;
	}
	
	#headersmall{
		padding-top: 150px;
		padding-bottom: 50px;
	}
	
	.top-bar li{
		width: 100%;
	}
	
	.mobilelogo{
		position: absolute;
		top: 18px;
		right: 20px;
		width: 200px;
	}
	
	#menu{
		background: #004168;
	}
	
	.headerimg{
		height: 300px;
	}
	
	#contentsectie1, #contentsectie2, #klanten, #products{
		padding-bottom: 100px;
		padding-top: 100px;
	}

	.imgsquare{
		height: 400px;
		margin-top: 25px;
	}
	
	.bloklarge{
		margin-bottom: 25px;
	}
	
	#socialmedia{
		padding-top: 50px;
	}
	
	.klant{
		margin-bottom: 30px;
	}
	
	

	#footercontact{
		padding-bottom: 30px;
		padding-top: 30px;
	}
	
	#cta{
		padding-top: 30px;
		padding-bottom: 100px;
	}	
	
	
	

}

/* Medium and up */
@media screen and (min-width: 40em) {
	
	.bloklarge{
		margin-bottom: 25px;
	}
}

/* Medium only */
@media screen and (min-width: 40em) and (max-width: 63.9375em) {}

/* Large and up */
@media screen and (min-width: 64em) {}

/* Large only */
@media screen and (min-width: 64em) and (max-width: 74.9375em) {}