/*
	Theme Name: Deba Onderhoud
	Theme URI: http://debaonderhoud.nl
	Description: Maatwerk Wordpress template
	Version: 1
	Author: 100% STEBA
	Author URI: https://100steba.nl
*/

/* @font-face */
@font-face { font-family: 'allerbold'; src: url('fonts/aller_bd-webfont.woff2') format('woff2'), url('fonts/aller_bd-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'allerregular'; src: url('fonts/aller_rg-webfont.woff2') format('woff2'), url('fonts/aller_rg-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }

/* Reset */
* { box-sizing: border-box; margin: 0; padding: 0; }
body { background-color: #e2e2e2; }
html {line-height: 1.5; font-family: 'arial'; font-size: 14px; font-weight: 400;}
img { height: auto; vertical-align: bottom; }
strong { font-weight: 700; }
svg { height: auto; max-width: 100%; vertical-align: middle; }
table { border-collapse: collapse; font-size: 1rem; margin-bottom: 30px; width: 100%; }
table td { color: #9e9e9e; padding: 5px 15px; }
table th { color: #046531; font-weight: 700; padding: 5px 15px; text-align: left; }
table tr:nth-child(even) td { background-color: #f5f5f5; }
table tr td:first-child { border-right: 1px dashed #bfbfbf; font-weight: 700; width: 150px; }
@media (min-width:900px) {
	table tr td:first-child { width: 300px; }
}

/* Typography */
a { color: #046531; text-decoration: none; }
h1, h2, h3, h4, h5, h6 { color: #000; line-height: 1.1; margin: 0 0 20px 0; }
h1 { font-family: 'allerbold'; font-size: 2em; font-weight: 700; }
h2 { font-family: 'allerbold'; font-size: 1.8em; font-weight: 700; }
h3 { font-family: 'allerbold'; font-size: 1.5em; font-weight: 700; }
h4 { font-family: 'allerbold'; font-size: 1.2em; font-weight: 700; }
h5 { font-family: 'allerbold'; font-size: 1em; font-weight: 700; }
h6 { font-family: 'allerbold'; font-size: 0.875em; font-weight: 700; }
@media (min-width:900px) {
	h1 { font-size: 2em; }
	h2 { font-size: 1.8em; }
	h3 { font-size: 1.5em; }
}
ol, p, ul { color: #000; margin-bottom: 15px; }
ol, ul { padding-left: 20px; }

/* Icons */
.age { background-image: url(img/icon-age.gif); }
.animals { background-image: url(img/icon-paw.gif); }
.area { background-image: url(img/icon-marker.gif); }
.cabin { background-image: url(img/icon-cabin.gif); }
.camper { background-image: url(img/icon-camper.gif); }
.camping { background-image: url(img/icon-tipi.gif); }
.caravan { background-image: url(img/icon-caravan.gif); }
.card { background-image: url(img/icon-card.gif); }
.facilities { background-image: url(img/icon-shower.gif); }
.group { background-image: url(img/icon-group.gif); }
.map { background-image: url(img/icon-map.gif); }
.tent { background-image: url(img/icon-tent.gif); }

/* .button */
.button--primary {  
	cursor: pointer; 
	display: inline-flex; 
	font-family: 'allerregular'; 
	font-size: 1em; 
	font-weight: 700; 
	line-height: 1.5; 
	padding: 10px 15px; 
	text-align: center; 
	text-decoration: none !important; 
	background: #ff7901; 
	border: none; 
	color: #000; 
	border-radius: 10px;
}
.button--primary:hover{background: #ffb878; color: #000;}

/* .container */
.container { max-width: 980px; margin: 0 auto; width: 100%; }

/* .contact */
.contact { padding: 50px 0 20px 0; }
.contact a { text-decoration: underline; }
@media (min-width:900px) {
	.contact .aside { grid-area: left; }
	.contact .main { grid-area: right;}
	.contact .grid { display: grid; grid-template-areas: "left right"; grid-column-gap: 50px; grid-template-columns: 3fr 9fr; }
}

/* .content */
.content { padding: 20px 0 20px 0; font-size: 16px;}
.content a { text-decoration: underline; }
.content .aside ul { list-style-type: none; padding: 0 20px;}
.content .aside ul li {padding-bottom: 10px;}
.content .aside ul li.current-menu-item a, .content .aside ul li a:hover { background-color: #000; color: #ff7901; }
.content .aside ul li a { background-color: #ffb878; color: #2e2e2e; display: block; font-size: 14px; padding: 10px 10px 10px 15px; text-decoration: none; border-radius: 5px;
    font-weight: bold;
    font-size: 16px;}
.content .main{padding: 0px 25px;}
@media (min-width:900px) {
	.content { padding: 50px 0 20px 0; }
	.content .aside { grid-area: left; }
	.content .main { grid-area: right; padding: 0px 50px 0px 0px;}
	.content .grid { display: grid; grid-template-areas: "left right"; grid-column-gap: 50px; grid-template-columns: 3fr 9fr; }
}

.sidebar-contact{padding: 15px 10px 15px 35px;}


/* .footer */
.footer { background-color: #046531; text-align: center; }
.footer a, .footer h3, .footer p { color: #fff; }
.footer .button--primary { background-color: #0fa4e5; background-image: none; }
.footer .button--primary:hover { background-color: #009ee3; background-image: none; }
.footer__primary { padding: 50px 15px 20px 15px; }
.footer__primary .email { background-image: url(img/icon-footer-email.gif); background-position: left center; background-repeat: no-repeat; padding-left: 25px; }
.footer__primary .grid__item { margin-bottom: 30px; }
.footer__primary .phone { background-image: url(img/icon-footer-phone.gif); background-position: left center; background-repeat: no-repeat; padding-left: 25px; }
.footer__secondary { border-top: 1px solid rgba(255, 255, 255, 0.1); padding: 30px 15px; }
.footer__secondary a { display: block; padding: 5px; color: rgba(255, 255, 255, 0.5); }
.footer__secondary li { display: inline-block; }
.footer__secondary ul { font-size: 14px; list-style-type: none; margin-bottom: 0; text-align: center; }
.footer-activities { display: flex; flex-wrap: nowrap; justify-content: center; margin-bottom: 30px; }
.footer-activities__item { display: block; flex: 0 1 auto; }
.footer-activities__item + .footer-activities__item { margin-left: 10px; }
@media (min-width:900px) {
	.footer { text-align: left; }
	.footer .grid { display: grid; grid-column-gap: 30px; grid-template-columns: repeat(3, 1fr); }
	.footer-activities { justify-content: left; }
}

/* .gallery */
.gallery { margin-bottom: 15px; }
.gallery .gallery-item {
    float: left;
    margin-top: 10px;
    text-align: center;
    margin-right: 5px !important;
    width: auto !important;
}

/* .hero */
.hero {background-color: #e2e2e2; display: none; background-position: center center; background-repeat: no-repeat; background-size: cover; display: flex; flex-flow: column; justify-content: flex-end; min-height: 200px; position: relative; }
.hero h1, .hero h2, .hero h3, .hero p, .hero__title .lead { color: #fff; }
.hero__arch { bottom: -34px; display: none; fill: #ff7901; left: 50%; max-width: none; position: absolute; transform: translateX(-50%); width: 980px; }
.hero__icon { display: none; }
.hero__icon .base { fill: #046531; width: 50px }
.hero__icon .icon { left: 50%; position: absolute; transform: translate(-50%, -50%); top: 50%; }
.hero__new { background-color: rgba(155, 195, 0, 0.9); border-radius: 0; padding: 20px; }
.hero__new h3 { margin-bottom: 10px; }
.hero__new p { margin-bottom: 0; }
.hero__title { padding: 30px; text-align: center; }
.hero__title h1 { margin-bottom: 0; }
.hero__title .lead { font-size: 1.25em; }
.hero__reservation { display:none;}
.hero__reservation p { margin-bottom: 15px; }
.hero__reservation .usp{}
.hero__reservation .usp li{float: left; width: 50%; color:#FFF; font-weight: bold; font-size: 16px;}
@media (min-width:900px) {
	.hero { align-items: flex-end; flex-flow: row; height: 350px; justify-content: flex-end; position: relative; z-index: -1; }
	.hero--home { height: 450px; }
	.hero__arch { display: block; }
	.hero__icon { display: block; bottom: -20px; left: 50%; position: absolute; transform: translateX(-50%); left: 80px; transform: none; }
	.hero__icon .base { width: 100px }
	.hero__new { border-radius: 10px; max-width: 300px; position: absolute; right: 30px; top: 30px; }
	.hero__reservation { display: block;  background-color: rgba(0, 0, 0, 0.8); padding: 30px 30px 50px 30px;  border-radius: 10px; margin-right: 30px; max-width: 400px; padding-bottom: 30px; border-bottom-left-radius:0; }
	.hero__title { margin-right: 30px; padding-bottom: 60px; text-align: left; }
}

/* .menu */
.menu__bar { background-color: #000;}
.menu__bar .container { align-items: center; display: flex; justify-content: space-between; flex-direction: row;}
.menu__info { display: none; color: #046531; font-size: 14px; font-weight: 700; text-align: right; }
.menu__navigation {background-color: #f5f5f5; list-style-type: none; left: 0; margin-bottom: 0; padding: 10px 5px; position: absolute; top: 130px; width: 100%; z-index: 1; display: none; }}
.menu__navigation .current_page_parent > a,
.menu__navigation .current_page_item > a { color: #95c11a; }
.menu__navigation a { display: block; color: #3a3a3a; padding: 10px; }
.menu__navigation a:hover { color: #95c11a; }
.menu__navigation li { position: relative; }
.menu__navigation li:hover ul { display: block; }
.menu__navigation li:last-child ul { right: 0; }
.menu__navigation li ul { list-style-type: none; margin-bottom: 0; padding: 0 30px; }
.menu__navigation li ul li { border-bottom: 1px dashed rgba(255, 255, 255, 0.2); }
.menu__navigation li ul li a { background-position: 10px center; background-repeat: no-repeat; display: block; font-size: 14px; padding: 10px 10px 10px 40px; }
.menu__navigation li ul li:last-child { border-bottom: none; }
.menu__logo { display: block; padding: 15px 15px; }
.menu__logo img{width: 200px;}
.menu__emblem{margin-left: auto; margin-right: 0; padding: 15px;}
.menu__toggle { background: transparent; border: none; cursor: pointer; display: block; padding: 10px; }
.menu__toggle svg { width: 1.5em; }
@media (min-width:900px) {
	.menu__info { display: block; }
	.menu__navigation { display: none; }
	.menu__navigation a:hover { color: #95c11a; }
	.menu__navigation li ul { background-color: #f5f5f5; display: none; min-width: 200px; padding: 0; position: absolute; z-index: 1; }
	.menu__navigation li ul li { border-color: #bfbfbf; }
	.menu__info .container { display: flex; justify-content: flex-end; }
	.menu__logo { }
	.menu__toggle { display: none; }
}

/* banner */
#banner{background-image: url(img/banner-important.png); background-repeat: no-repeat; background-color: #ff7901; padding: 15px 15px 15px 60px; color: #FFF; border-radius: 5px; background-size: 50px; background-position: 5px center; }
#banner_tekst_regel_1{font-weight: bold;}
#banner_tekst_regel_2{font-size: 0.8em;}
}

.wifi{text-align: center; padding-top: 10px;}

/* .paper */
.paper { background: #FF7900; overflow: hidden; }
@media (min-width:900px) {
	.paper { box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); margin: 0 auto 0px auto; max-width: 980px; position: relative; width: 100%; z-index: 0 }
}

/* .reservation */
.reservation{
	padding: 50px 15px 20px 15px;
}
.reservation iframe{
	margin-bottom: 30px;
}

/* .table-responsive */
.table-responsive{
	display: block;
	margin-bottom: 30px;
    overflow-x: auto;
    width: 100%;
}


.wpcf7-form{width: 100%;}
.wpcf7-form.sent p{display: none;}
.wpcf7-form label span.label{float: none; width: auto;}
.wpcf7-form br{display: none;}
.wpcf7-form label{clear: both;display: block; padding-bottom: 10px;}
.wpcf7-form label span{}
.wpcf7-form label span.label{display: block; float: none;}
.wpcf7-form label span input{float: none; width: 100%; padding: 5px; font-size: 16px;}
.wpcf7-form label span input.wpcf7-not-valid{}
.wpcf7-form label span input.wpcf7-validates-as-required{}
.wpcf7-form label textarea{width: 100%;}
.wpcf7-submit{padding: 10px; color:#FF7900; background: black; border:0; border-radius: 5px; font-weight: bold;}
.wpcf7-not-valid-tip{color: black; font-size: 12px; padding-top: 5px;}
.wpcf7-response-output{border: 0px !important; padding: 0px !important; font-weight: bold !important; margin: 0px !important;}
@media (min-width:900px) {
	.wpcf7-form{width: 400px;}
	.wpcf7-form label span.label{display: block; float: left; width: 150px;}
	.wpcf7-form label span input{float: left; width: 250px; padding: 3px; font-size: 14px;}
	.wpcf7-form label textarea{width: 400px;}
}