/*
Theme Name: Tolhek
Author: Vincent Zwart
Author URI: http://vincentwart.nl
*/
@charset "UTF-8";

body {
	margin: 0px;
	padding: 0px;
	background-color: #a0c559;
	font-family: asap;
	text-align: center;
	color: #3c5061;
	font-size:17px;
	background-attachment: fixed;
	background-image: url(bos.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	background-size:cover;
}
#header {
	background-color: #3c5061;
	color: rgba(255,255,255,1);
	float: left;
	height: 100px;
	width: 100%;
	margin: 0px;
	padding: 0px;
	position: absolute;
	z-index:100;
}
h1, #header p {
	font-family: "Autour One";
	font-size: 24px;
	font-weight: lighter;
	margin-top: 0px;
	margin-bottom: 26px;
	line-height: normal;
}
#header p {
font-size:30px;	
text-align:left;
text-indent:100px;
padding:0;
margin:0;
margin-top:20px;
font-family:Autour One;
}
h1,h2,h3 {
text-align:center;}
h2 {
font-size: 20px;
line-height:normal;
}
i {
font-size:15px;
}
#container {
	width: 100%;
	min-width: 320px;
	max-width: 1024px;
	height:auto;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	background-color:#fff;
	position:relative;
}
.menu {
	background-color:#c5d853;
	height: 45px;
	line-height:40px;
	width:100%;
	position:absolute;
    z-index:101;
	top:80px;
	font-weight:700;
}
.menu a {
	color:#3c5061;
	text-transform:uppercase;
	text-decoration:none;
}
.menu a:active, .current-menu-item a, a.active {
	text-decoration:underline;
}
.menu a:hover {
	color:#000;
}
.menu ul {
	position:relative;
	top:45px;
	left:0px;
	padding:0px;
	margin:0px;
	width:100%;
	height:0;
	transition:height 0.2s ease-in-out;
	overflow:hidden;
	list-style: none;
}
.menu ul li {
    display: inline-block;
    white-space: nowrap;
	font-size:18px;
	width: 100%;
	display: inline-block;
	text-align: center;
	background-color:#C5DA47;
}
.menu ul li a {
	line-height:45px;
	letter-spacing: 0.5pt;
	display:block;
	border-bottom: 1px solid white;	
}
.menu ul li:nth-child(1) a{
	border-top: 1px solid white;	
}
.toonmenu .menu ul{
	height:max-content;
	text-indent: 0px;
}
#pagina  {
	background-color: white;
position: relative;
width: 100%;
height: auto;
margin-right: auto;
margin-left: auto;
max-width: 1024px;
min-height:500px;
}
#pagina #content {
	width: 90%;
    padding-top: 150px;
    margin-right: auto;
    padding-bottom: 35px;
    margin-left: auto;
    color: rgba(60,80,97,1);
    text-align: left;
    line-height: 24px;
    position: relative;
}
.desktop {
	display:block;
	max-height:500px;
}
.mobiel {
	display:none;
}
#slider  {
	background-color: rgba(0,255,0,1);
	position: relative;
	width: 100%;
	margin: 0px;
}
.metaslider {
    top: 125px;
}
.metaslider.ms-theme-simply-dark.has-dots-nav {
    margin-bottom: 0!important;
}

.deco {
	background-image: url(deco.png);
	background-repeat: repeat-x;
	margin: 0px;
	padding: 0px;
	height: 18px;
	width: 100%;
	bottom: 0;
position: absolute;
}
.toonmenu #overlay{
	opacity:0.7;
	transition:opacity 0.2s ease-in-out;
	pointer-events:all;
}
#toggle {
	width:100%;
	height:45px;
	position:absolute;
	display:block;
	background-image: url(dark.gif);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 45px 45px;
	background-color:#C5DA47;
}
.toonmenu #toggle{
	background-image: url(cross.png);background-size: 30px 25px;background-position: center center;
}
#overlay {
	opacity:0;
	position:fixed;
	width:100%;
	height:100%;
	background-color:#fff;
	left:0;
	top:100px;
	pointer-events:none;
}
#logo {
	width: 110px;
	height: 110px;
	position: absolute;
	z-index: 102;
	background-repeat: no-repeat;
	background-position: center center;
	left: -14px;
	top: -10px;
	overflow: hidden;
	background-image: url(boomhut-icon.png);
	background-size:cover;
}
#myBtn {
	display: none;
	position: fixed;
	bottom: 10px;
	right: 10px;
	z-index: 99;
	border: 2px solid orange;
	outline: none;
	background-color: rgba(255,255,255,0.25);
	color: black;
	cursor: pointer;
	padding: 10px;
	border-radius: 10px;
	font-size: 18px;
}
#myBtn:hover {background-color:#C5DA47;color:#fff}
#content .RoomRaccoon-BookingEngine, form {
	background-color: rgba(197,216,83,0.5);
	padding: 10px;
	width:100%;
	width:-moz-available;
	width:-webkit-fill-available;
	text-align:center;
	border-radius: 5px;
	margin-bottom: 25px;
	
}
input, select {
padding: 7px;
border: 1px solid #3c5061;
margin-bottom: 1px;
    min-width: 132px;
    font-size: 16px;
    font-family: asap;
    color: #3c5061;
    width: 110px;
}
.RoomRaccoon-BookingEngine #startDate-nl, .RoomRaccoon-BookingEngine #endDate-nl {
    background: url(calendar.png) top 7px left 8px no-repeat #fff;
    background-size: auto auto;
    background-size: 17px;
	padding-left:32px;
}
.RoomRaccoonButton1 {
position:absolute; font-size:20px; font-weight:700; line-height:36px; padding:7px 16px; border:none; border-radius:5px; background:rgb(220, 41, 30);; color:#fff; cursor:pointer; text-decoration:none; right:15px; top:15px; text-transform:uppercase;	
}
.RoomRaccoonButton2, .knop, .wpcf7-submit {
position:relative; display:inline-block; font-size:18px; text-transform:uppercase; font-weight:700; line-height:30px; padding:0px 8px; border:none; border-radius:5px; background:rgb(220, 41, 30)!important; color:#fff; margin-left:8px; text-decoration:none;
}

.RoomRaccoonButton1:hover, .RoomRaccoonButton2:hover, .knop:hover, .knop.bigButton:hover{
	background:#ff6600!important;}
.wrap {
	white-space:nowrap;
}


.metaslider .flexslider {
    margin: 0px!important;
}

blockquote {
	font-size: 26px;
	font-weight: 600;
	color: rgb(220, 41, 30);
	margin-right: 15px;
	margin-left: 15px;
	text-align:center;
}
blockquote i {
	font-style: normal;
	font-size: 17px;
	font-weight: 400;
	margin-top: 10px;
	color:rgba(60,80,97,1)!important;
}
#zoover {
	float: right;
	height: fit-content;
	margin-left: 40px;
	margin-right: 0px;
	margin-bottom: 15px;
}
footer {
	text-align: center;
	padding-top: 25px;
	padding-bottom: 25px;
	width: 100%;
	max-width: 1024px;
	min-height: 50px;
	font-weight: 700;
	margin-left: auto;
	margin-right: auto;
	color: white;
	text-shadow: 1px 1px 2px black;
	font-size: 20px;
	vertical-align: middle;
}
footer .knop {
	display: block;
	width:auto;
    width: min-content;
	width: -moz-min-content;
    margin-left: auto;
    margin-right: auto;
    margin-top: 15px;
	text-shadow:none;
	box-shadow:1px 1px 2px black;
}
footer a {
	color: orange;
}
img {
	height: auto !important;
	/* display: block; */
}
#fb {min-width:120px;margin-left:auto;margin-right:auto;text-align: center;margin-top:25px;}
#maps {
	vertical-align: middle;
	margin-right: 10px;
	width:48px;
	height:48px;
	display:inline;
}
a, h2 a {
    color: #5c6b00;
    text-decoration: none;
    padding-bottom: 1px;
    margin: 0px;
    font-weight: bold;
}
.responsive {
	width:100%;
	height:auto;
	max-width:920px;
}
.metaslider.ms-theme-simply-dark .flexslider ol.flex-control-nav:not(.flex-control-thumbs), .metaslider.ms-theme-simply-dark ul.rslides_tabs, .metaslider.ms-theme-simply-dark div.slider-wrapper .nivo-controlNav:not(.nivo-thumbs-enabled), .metaslider.ms-theme-simply-dark .coin-slider .cs-buttons {
    justify-content: center!important;
    top: auto!important;
    bottom: 4px!important;
}

.flex-viewport {
    max-height: 500px!important;
}

.voordelen {
    font-size: 20px;
    font-style: italic;
    font-weight: bold;
	width: max-content;
	max-width:370px;
	margin-left:auto;
	margin-right:auto;
}
.voordelen ul {
    text-align: left;
    list-style-type: none;
    list-style-position: inside;
	padding:0;
}
.voordelen ul li {
    margin: 0px;
    line-height: 40px;
    background-image: url(go.svg);
    background-repeat: no-repeat;
    background-position: 0px center;
	background-size:30px;
}
.voordelen ul li::before {
    content: '';
    padding: 0 0 0 45px;
}
.voordelen ul li.red {
    background-image: url(red.svg);
}
.grecaptcha-badge {display:none;}
.page-id-22 .grecaptcha-badge {display:block!important;}

.bigButton {
    background-color: #F6931D /*rgba(255,102,0,0.75)*/;
    padding: 10px;
    width: 100%;
    width: -moz-available;
    width: -webkit-fill-available;
    text-align: center;
    border-radius: 5px;
	display:inline-block;
	margin:0;
}
.bigButton::before {
    content: '';
    background-image: url(gal.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 28px;
    padding: 3px 0 0 60px;
	opacity:0.65;
}
.wp-block-image {
margin:0;	
}

@media (min-width: 700px) {


#toggle {
	display:none;
}
.menu {
	background-image: none;
}
.menu ul {
	top:0;
	height:45px;
}
.menu ul li{
	display:inline;
	width: auto;
}
.menu ul li a{
	background:none;
	display:inline;
	border-bottom: none;
	padding-right: 2%;
}
.menu ul li:nth-child(1) a{
	border-top: none;	
}
.menu ul li:last-child a {
	padding-right: 0;	
}
.menu a:active, .current-menu-item a, a.active {
	color:black;
}
}

@media (max-width: 600px) {

.desktop {
	display:none;
}
.mobiel {
	display:block;	
}
body {
	background-image: none!important;
}

#header p {
    font-size: 26px;
    margin-top: 24px;
}
.RoomRaccoonButton2 {
	margin-top:10px!important;
	margin-left: 0;
}
#zoover {
	display:none;
}
.voordelen ul li {	
    line-height: 35px;
    background-size: 25px;
}
.voordelen ul li::before {
    padding: 0 0 0 35px;
}
.voordelen {
    font-size: 18px;
    font-style: normal;
}

}

@media (max-width: 420px) {
.RoomRaccoonButton1 {
	top:50px;	
}
.RoomRaccoon-BookingEngine .wrap:first-child {
    margin-left:5px;
}
.RoomRaccoon-BookingEngine #startDate-nl {
    margin-bottom: 8px;
}
#header p {
font-size: 20px!important;
text-indent: 0;
margin-left: 90px;
margin-top:15px;
}
#logo {
width:100px;
height:100px;
z-index:115!important;
}
#header {
	z-index:105!important;
	height:80px	
}
#content .RoomRaccoon-BookingEngine {
    padding: 0px;
	padding-top:10px;
	padding-bottom:10px;
}
h1 {
	text-align:center;
}
#maps {
	display:block;;
	margin-right:auto;
	margin-left:auto;
	margin-bottom:15px;
	width:64px;
	height:64px;
}
footer {
	text-shadow: none;
	background-color:#C5DA47;
	color:#3c5061;
}
footer .knop {
	box-shadow:none;
}
footer a {
	color: black;
	text-decoration: underline;
}
.lang,
.metaslider.ms-theme-simply-dark .flexslider ol.flex-control-nav:not(.flex-control-thumbs), .metaslider.ms-theme-simply-dark ul.rslides_tabs, .metaslider.ms-theme-simply-dark div.slider-wrapper .nivo-controlNav:not(.nivo-thumbs-enabled), .metaslider.ms-theme-simply-dark .coin-slider .cs-buttons, ol.flex-control-nav.flex-control-paging
 {
	display:none!important;	
}
}
@media (max-width: 320px) {
.RoomRaccoonButton1 {
	top:65px;
}
#header h1 {
margin-top:10px;
}
blockquote {
	margin: 0;
}
}
