/*!
Theme Name: appelstroop Child
Theme URI: https://creatiemaaktalles.com
Author:       Henk Schipper
Author URI:   https://creatiemaaktalles.com
Template:    appelstroop
Description: 
Version: 1.0.1
Requires at least: 5.0
Tested up to: 6.2
Requires PHP: 7.2
License: GPL version 2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0
Tags: custom-background, custom-colors, featured-images, flexible-header, microformats, post-formats, rtl-language-support, theme-options, translation-ready, accessibility-ready
Text Domain: appelstroop
*/
/* General settings ============================ */
html, body {overflow-x: hidden !important;width: 100vw !important;}

body { font-family: Anago; font-size: 14pt; line-height: 21pt; font-weight: 400; color: white;  }
body { background-image: url('/wp-content/themes/appelstroop-child/assets/images//Houtpatroon.jpg'); background-attachment: fixed;   }

@media only screen and (max-width: 768px) { .nondisplaymobile { display: none; visibility: hidden; } }
.nondisplay { display: none; visibility: hidden; }
.fixed-top { top: 30px!important; }
#theedoek-links { position: absolute; top: 650px;    margin-left: -450px; }
/* #theedoek-rechts { position: absolute; top: 2000px; margin-right: -450px;  right: calc( ( 100% - 50% ) - 600px ); } */
#theedoek-rechts { position: absolute; margin-top: -400px; right: calc( ( 100% - 50% ) - 700px - 400px ); }

.order9 { order: 9; }
.alleitemsbutton { display: inline-block; margin: 20px 0!important; background-color: #80a82c; padding: 3px 20px 1px 20px;  color: #ffffff;  font-family: Sirenia;  text-decoration: none!important;  border-radius: 10px;}
.whitebutton { display: inline-block; margin: 20px 0!important; background-color: #ffffff; padding: 3px 20px 1px 20px;  color: #400f17;  font-family: Sirenia;  text-decoration: none!important;  border-radius: 10px;}
.whitebutton:hover { background-color: #fff;  color: #400f17; }

/* wpbakery & modifications ======================= */
.icons { display: inline-flex; margin-left: auto;}
.icons a { transition: all 0.2s ease-in-out; padding: 0.2rem 0.4rem; color: #ccc !important; text-decoration: none;}
.icons a:hover { color: white; text-shadow: 0 0 30px white;}
.socialicons { display:inline-block; width: auto; float: left; }
.socialicons i { margin-right: 10px; }
.recepten-3-kolommen img{border:5px; border-color:#fff; border-radius:20px;}
.recepten-3-kolommen .vc_gitem-zone{background-color:none!important;}
.vc_custom_1419240516480{background-color:none!important;}



/* wrapper ============================ */
#wrapper { overflow: hidden; position: relative; }
#topbar { background-color: #400f17; height: 30px; width: 100%; position: fixed!important; display: block;     z-index: 9;}
#main .content { margin-top: 50px; }



/* Slider settings ============================ */
#slider {    padding-top: 115px;  max-width:1800px; margin-left: auto;margin-right: auto;text-align: center; }
#slider .n2_clear {display: contents;}
#slider > div > ss3-force-full-width { max-width:100%; margin-left: auto;margin-right: auto;text-align: center; }
#slider .n2-section-smartslider { margin-left: auto;margin-right: auto;text-align: center; }
#slider .n2-ss-slide-background-image img {  -webkit-filter: drop-shadow(5px 10px 15px rgba(0,0,0,0.5)  );  filter: drop-shadow(5px 10px 15px rgba(0,0,0,0.5)  ); width: 94% !important;height: 94% !important;object-fit: cover;left: 3%;  }
#slider * { overflow: visible; }



.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto { position: relative; }
.bx-wrapper .bx-pager { margin-top: 20px; }

/* Header settings ============================ */
#header .navbar-brand { height: 100%; position: relative; }
#header { height: 100px; transition: height 300ms; padding-top: 0px; padding-bottom: 0px;}
#header .container,
.navbar-brand img { height: 100%!important;  transition: height 300ms;}
@media only screen and (min-width: 992px) { 
    #header.scrolled  { height: 60px; transition: height 300ms; }
    #header.scrolled .container,
    #header.scrolled .navbar-brand img { height: 50px!important; transition: height 300ms;}
}
@media only screen and (max-width: 1440px) { 
   #slider .n2-ss-slide-background-image img { width: 100%!important;  height: auto!important;     left: 0%!important;}
   div#n2-ss-1 .n2-ss-layer  { padding-left: 20px!important; }
   .n2-ss-slider .n2-ss-layer  { padding-left: 20px!important; }
}
@media only screen and (max-width: 991px) { 
   #header { height: 60px; }
   #slider { padding-top: 90px; }
   #header #navbar { background-color: white;  padding: 30px; margin-top: 0!important; }
}
@media only screen and (max-width: 768px) { 
    #main .content { margin-top: 0px; }
   div#n2-ss-1 .n2-ss-layer  { padding-left: 20px!important;  }
   div#n2-ss-1 .n2-ss-layer h1.n2-ss-item-content { font-size: 200%; margin-top: 20px; }
   div#n2-ss-1 .n2-ss-layer div.n2-ss-item-content { font-size: 80%; width: 90%; }
   .n2-ss-layer  { padding-left: 20px!important;  }
   .n2-ss-layer h1.n2-ss-item-content { font-size: 200%!important; margin-top: 20px; }
   .n2-ss-layer div.n2-ss-item-content { font-size: 80%!important; width: 90%;    max-height: 120px; overflow: hidden!important; }
   #header .container,
   #header .navbar-brand { height: 60px!important;  }
   #slider { padding-top: 90px; }
}
@media only screen and (max-width: 500px) { 
   div#n2-ss-1 .n2-ss-layer  { padding-left: 10px!important; }
   div#n2-ss-1 .n2-ss-layer div.n2-ss-item-content * { padding-top: 0px; }
   .n2-ss-layer  { padding-left: 10px!important; }
   .n2-ss-layer div.n2-ss-item-content * { padding-top: 0px; }
    #header .container,
    #header .navbar-brand { height: 60px!important;  }
    #slider {    padding-top: 90px; }
}



/* Menu settings ============================ */
#menu-hoofdmenu * { font-family: Anago; font-weight: bold; color: #400f17; }
#menu-hoofdmenu {    margin-left: auto;  margin-right: 0px!important;}
.navbar-expand-lg .navbar-nav .nav-link { background-color: transparent;line-height: 15pt; margin-left: 3px; margin-right: 3px; margin-top: 4px; padding-left: 15px; padding-right: 15px; }
.navbar-expand-lg .navbar-nav .nav-link:hover,
.navbar-expand-lg .navbar-nav .current-menu-parent .nav-link,
.navbar-expand-lg .navbar-nav .current-menu-item .nav-link { background-color: transparent; border: 3px solid #992e4d; /*#400f17 */ border-radius: 50px;  margin-left: 0px; margin-right: 0px; margin-top: 0px;  }
#header #navbar {    margin-top: 20px;}    
#header.scrolled #navbar {    margin-top: auto;}    
.dropdown-menu.droppeddown > .current_page_item > .active { background-color: #992e4d!important; color: white!important; }


.previous-post.btn { display: inline-block; margin: 20px 0!important; background-color: white; padding: 3px 20px 1px 20px;  color: #400f17;  font-family: Sirenia;  text-decoration: none!important;  border-radius: 10px; }
.next-post.btn { display: inline-block; margin: 20px 0!important; background-color: white; padding: 3px 20px 1px 20px;  color: #400f17;  font-family: Sirenia;  text-decoration: none!important;  border-radius: 10px; }

/* General text settings  ===================== */
h1, h2, h3, h4, h5 { font-family: Sirenia; color: rgba(237, 26, 52);letter-spacing: 1px; }
h1 { font-size: 60px; line-height: 60px; color: white; letter-spacing: 1px;}
h2 { font-size: 40px; line-height: 40px; color: white; letter-spacing: 1px;}
h3 { font-size: 32px; line-height: 32px; color: white; letter-spacing: 1px; }
h4 { font-size: 25px; line-height: 25px; color: white; letter-spacing: 1px;}
h5 { font-size: 20px; line-height: 20px; color: white; letter-spacing: 1px;}

.introtekst,.introtekst * { font-size: 18px; line-height: 1.1; font-weight: bold; padding-top: 2px; padding-bottom: 4px; }
#main a { text-decoration: underline; }



.borderimage img {
    margin-left: auto;
    margin-right: auto;
    border-radius: 20px;
    border: 5px solid white;
    max-width: 100%;
    max-height: fit-content;
    display: block;
}
.leesmeerbutton > a { 
	display: inline-block!important; 
	margin: 20px 0!important; 
	background-color: white!important; 
	padding: 3px 20px 1px 20px!important;  
	line-height: 28px!important;
	height: 32px!important;
	color: #400f17!important;  
	text-decoration: none!important;
	font-family: Sirenia!important;  
	text-decoration: none!important;  
	border-radius: 10px!important;     
	font-size: 14pt!important;
}




/* -- search ======*/ 
#header .fa-brands { display: inline-block; width: 40px; height: 40px; color: #400f17!important; font-weight: 400; border-radius: 10px; text-align: center; padding-top: 2px;}
#header .fab {color: #400f17!important;font-family: 'Font Awesome 5 Brands';}
#header .fab:before { font-family: 'Font Awesome 5 Brands';  }

.searchicon { cursor: pointer;  margin-left: 0px;  }
.searchicon i { font-size: 20px; margin-top: 10px; }
.searchcontainer {  z-index: 9999;  background-color: white;   border-radius: 10px; }
.searchcontainer input[type=image] { margin-left:15px;   height: 25px;    top: auto;    margin-bottom: -5px;}
.search-form input[type=text],
.searchcontainer input[type=text] { border-radius: 25px 0 0 25px!important; padding-left: 20px; }
.searchcontainer button[type=submit] { border-radius: 0 25px 25px 0!important; max-width: 100px!important; }
@media only screen and (min-width: 1200px) { 
    .searchcontainer {  right: calc( ( 100% / 2 ) - 700px );  }
}
@media only screen and (max-width: 1199px) { 
    .searchcontainer { right: 0px; }
}
@media only screen and (min-width: 992px) { 
    .searchcontainer { display: none;  position: absolute;  margin-top: 100px!important; padding: 10px 30px!important;   }    
}
@media only screen and (max-width: 991px) { 
    .searchicon { display: none; visibility: hidden; }
   .searchcontainer { display: block!important; position: relative!important; margin-top: 0px!important; padding: 0!important;}
}


/* Buttons  ========================= */
.leesmeerbutton{
	z-index:5!important;
}

/* aanbieding elmenten  ======================== */




/* pagina elmenten  ======================== */
.wistjedat {    text-align: left;
    font-style: italic;
    font-weight: 100;
    padding: 10px 20px;
    font-size: 110%;
    margin-left: 30px;
    margin-right: 30px;
    border: 1px solid white;
    border-radius: 20px;}


button[type=submit],
  input, 
  select, 
  textarea  {width: 250px; color: rgba(204,155,160,1)!important; 
    padding: 5px 20px;font-family: Sirenia!important; font-size: 12pt; text-align: left;
    border-radius: 30px; border: 1px solid rgba(153,46,77, 1);
    -webkit-box-shadow: inset 1px 3px 10px 0px rgba(0,0,0,0.50);
    -moz-box-shadow: inset 1px 3px 10px 0px rgba(0,0,0,0.50);
    box-shadow: inset 3px 1px 10px 0px rgba(0,0,0,0.50);
    margin: 10px 0;}
  
  
  
  button[type=submit],
  input[type=submit] { background-color: rgba(153,46,77, 1); color: rgba(204,155,160,1)!important;  }

.contactformgroen button[type=submit],
.contactformgroen input[type=submit] { background-color: rgba(128,168,44, 1); color: rgba(255,255,255,1)!important; border: 0px rgba(128,168,44, 1); 
    -webkit-box-shadow: unset;
    -moz-box-shadow: unset;
    box-shadow: unset;
}
.contactformgroenrecept button[type=submit],
.contactformgroenrecept input[type=submit] { background-color: rgba(128,168,44, 1); color: rgba(255,255,255,1)!important; border: 0px rgba(128,168,44, 1); 
    -webkit-box-shadow: unset;
    -moz-box-shadow: unset;
    box-shadow: unset;
}
.contactformgroenrecept input, 
  .contactformgroenrecept select, 
.contactformgroenrecept textarea  {width: 450px!important;}

 
  
:-ms-input-placeholder {
  color: rgba(204,155,160,0.8)!important;
  opacity: 0.8;
}
::-ms-input-placeholder {
  color: rgba(204,155,160,0.8)!important;
  opacity: 0.5;
}

::placeholder {
  color: rgba(204,155,160,0.8)!important;
  opacity: 0.8;
}

.vc_separator.hr_apple_left {display: block;}
.vc_separator.hr_apple_left .vc_sep_holder .vc_sep_line { border-top: 1px dashed white; padding-top: 50px; margin-top: 50px; }
.vc_separator.hr_apple_left .vc_sep_holder .vc_sep_line {}
.vc_separator.hr_apple_left .hr_image { z-index:1;   background-image: url(./assets/images/appel.png); position: absolute; margin-top: -180px; width: 230px; height: 230px; background-size: contain; left: 0px; }

.vc_separator.hr_peer_right {display: block;}
.vc_separator.hr_peer_right .vc_sep_holder .vc_sep_line { border-top: 1px dashed white; padding-top: 50px; margin-top: 50px; }
.vc_separator.hr_peer_right .vc_sep_holder .vc_sep_line {}
.vc_separator.hr_peer_right .hr_image { z-index:1;   background-image: url(./assets/images/pear.png); position: absolute; margin-top: -200px; width: 250px; height: 250px; background-size: contain; right: -100px; }

.vc_separator.hr_druif_left {display: block;}
.vc_separator.hr_druif_left .vc_sep_holder .vc_sep_line { border-top: 1px dashed white; padding-top: 50px; margin-top: 50px; }
.vc_separator.hr_druif_left .vc_sep_holder .vc_sep_line {}
.vc_separator.hr_druif_left .hr_image { z-index:1; background-image: url(./assets/images/druif.png);  position: absolute; margin-top: -200px; width: 250px; height: 250px; background-size: contain; left: -175px; }

@media only screen and (max-width: 1200px) { 
    .post_title_grid > h3 { 
		font-size: 20px!important;     
		line-height: 28px!important; }
	
	.category-recept h2 { font-size: 30px!important; line-height: 34px!important;}
	
}
	
@media only screen and (max-width: 991px) { 
    .vc_separator.hr_apple_left .hr_image,
    .vc_separator.hr_peer_right .hr_image,
    .vc_separator.hr_druif_left .hr_image { width: 150px; height: 150px; margin-top: -140px; }
    .vc_separator.hr_peer_right .hr_image {  right: -50px; }
    .vc_separator.hr_druif_left .hr_image {  left: -75px;  }
}
@media only screen and (max-width: 500px) { 
    .vc_separator.hr_peer_right .vc_sep_holder .vc_sep_line { width: 90%; }
    .vc_separator.hr_peer_right .hr_image {  right: 0px; }
    .vc_separator.hr_druif_left .vc_sep_holder .vc_sep_line { width: 80%; left: 20%; }
    .vc_separator.hr_druif_left .hr_image {  left: 0px;  }
}
/* Footer settings ============================ */
#footer {  max-width: 100%; overflow: hidden;  padding-top: 40px; min-height: 300px; /* background-color: #400f17!important; */ background-color: rgba(81,21,28,1)!important; z-index: 9; -webkit-filter: drop-shadow(0px -5px 10px rgba(0,0,0,0.5) ); filter: drop-shadow(0px -5px 10px rgba(0,0,0,0.5) ); }
#footer .fa-brands {     display: inline-block;  width: 25px; height: 25px; color: white; font-weight: 400; background-color: #992e4d; border-radius: 15px; text-align: center; padding-top: 4px;}


#footer #menu-footer-menu {list-style: none; margin-left: 50px;}
#footer #menu-footer-menu li {  margin: 0px 0 10px 0;}
#footer #menu-footer-menu a { color: white; }
#footer #menu-footer-menu .current-menu-item a,
#footer #menu-footer-menu a:hover  { color: rgba(204,155,160,1)!important; }

#footer {     padding-bottom: 30px; }
@media only screen and (max-width: 767px) { 
    #footer #menu-footer-menu { margin-left: auto!important; margin-right: auto; width: 100%; text-align: left; margin-top:30px; margin-bottom: 30px;     padding-left: 0;}
    #footer #menu-footer-menu li { width: auto; display: inline-block; margin: 5px 20px!important;}
    #footer { padding-bottom: 40px; }
}



.bottomrow {     position: relative; margin-bottom: 50px; height: 100px; margin-top: -50px; }
.bottomrow img.appels { margin-left: -150px; width: 250px; }
.bottomrow img.dadels { margin-right: -200px; width: 600px; float: right; }

@media only screen and (max-width: 525px) { 
    .bottomrow img.dadels { position: absolute; }
    .bottomrow {     position: relative;
    margin-bottom: 0;
    height: auto;
    margin-top: auto;
    width: 100%;
    overflow: hidden;}
}

/* -- RESPONSIVE SETTINGS -- =================================================================================================== */
@media only screen and (min-width: 1200px) { 

}

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

}

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

}

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

}

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

}

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

}

@media only screen and (min-width: 768px) { 
}

@media only screen and (max-width: 767px) { 
	.notmobile { display:none!important; visibility: hidden!important; }
}

@media only screen and (min-width: 576px) { 

}

@media only screen and (max-width: 575px) { 
	.dropdown-menu { display: block; }
	.dropdown-menu > li > a {  white-space: normal; font-size: 13px;}
	
	 #navbar.show { height: 85vh!important; max-height: fit-content; overflow: auto;}
	
}







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

}

/* -- KEY FRAMES -- */
@keyframes fadeIn {  0% {opacity:0;}  100% {opacity:1;}}
@-moz-keyframes fadeIn {  0% {opacity:0;}  100% {opacity:1;}}
@-webkit-keyframes fadeIn {  0% {opacity:0;}  100% {opacity:1;}}
@-o-keyframes fadeIn {  0% {opacity:0;}  100% {opacity:1;}}
@-ms-keyframes fadeIn { 0% {opacity:0;}  100% {opacity:1;}}
@keyframes fadeOut {  0% {opacity:1;}  100% {opacity:0;}}
@-moz-keyframes fadeOut {  0% {opacity:1;}  100% {opacity:0;}}
@-webkit-keyframes fadeOut {  0% {opacity:1;}  100% {opacity:0;}}
@-o-keyframes fadeOut {  0% {opacity:1;}  100% {opacity:0;}}
@-ms-keyframes fadeOut { 0% {opacity:1;}  100% {opacity:0;}}
@-webkit-keyframes buttonredgreen { 0%     {background-color:rgba(237, 26, 52);}  100.0%  {background-color:#3db900;}}
@keyframes buttonredgreen { 0%     {background-color:rgba(237, 26, 52);} 100.0%  {background-color:#3db900;}}
@-webkit-keyframes buttonredred1 { 0.0%  {background-color:#3db900;}  100.0%  {background-color:rgba(237, 26, 52, 1);} }
@keyframes buttonredred1 { 0.0%  {background-color:#3db900;}  100.0%  {background-color:rgba(237, 26, 52, 1);} }
@-webkit-keyframes buttonredred2 { 0.0%  {background-color:#000000;}  100.0%  {background-color:rgba(237, 26, 52, 1);} }
@keyframes buttonredred2 { 0.0%  {background-color:#000000;}  100.0%  {background-color:rgba(237, 26, 52, 1);} }