/*
Theme Name:  Nature Theme
Theme URI:   https://themes.grizzly.marketing/vertical
Version:     1.0.1
Description: Het Nature theme van Grizzly New Marketing
Author:      vps230265
Author URI:  https://themes.grizzly.marketing/nature
Template:    Divi
*/

/*- YOU CAN INCLUDE THE CUSTOM CODE FOR YOUR CHILD THEME BELOW THIS LINE-*/
/*------------------------------------------------*/
/*-----------------[ Variabelen ]-----------------*/
/*------------------------------------------------*/

/* 

--clr-p-lightgreen: #58A344;
--clr-p-darkgreen: #196D38; 
 
 */

/*------------------------------------------------*/
/*-----------------[BASIC STYLES]-----------------*/
/*------------------------------------------------*/


.products .et_pb_blurb_container {
    min-height: 260px;
}

.products .et_pb_blurb_container h4 {
    position: relative;
    top: 200px; 
}

.products .et_pb_blurb_content::before {
    content: '';
    background-image: linear-gradient(to top, rgba(10,10,10,1) 0%, rgba(10,10,10,0.25) 25%, rgba(10,10,10,0.25) 25%,rgba(10,10,10,0) 100%);
    position: absolute;
    top: 0px;
	right: 0px;
	bottom: 0px;
	left: 0px;    
}

#top-header {
    background: #F1F1F1!important;
	color: #777777!important;
	font-size: 14px;
}

.topheader-all {
	font-size: 16px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.dagen {
    display: flex;
    flex-direction: row;
    gap: 2em;
}

@media screen and (max-width: 980px) {
    .dagen {
        display: none;
    }
    .topheader-all {
        display: flex;
        justify-content: center;
    }
    .adres::before {
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        content: "\f3c5";
		margin-right: .4em;
    }
}

h1, h2, h3, h4, h5, h6 {
	margin-bottom: .5em;
}

.et_pb_button_one:hover {
    background: #196D38!important;
    box-shadow: 0 0 10px 1px #333;
}

.et_pb_button_two:hover {
    background: #58A344!important;
    box-shadow: 0 0 10px 1px #333;
}

#et-info {
    width: 100%;
	padding-bottom: 30px;
}

@media screen and (max-width: 980px) {
	#et-info {
		padding-bottom: initial;
	}
}

#footer-info {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

#top-menu-nav {
	width: 100%;
}
ul#top-menu {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

/*** USPS ***/
.usps-column {
    padding: 0!important;
    display: grid;
    grid-template-columns: repeat(3, auto);
}

.usps {
    display: flex;
    justify-content: space-between;
    padding: 15px 20px;
    margin-bottom: 20px;
}

.usp-section {
	padding: 0;
}

.stack {
	display: flex;
	flex-direction: column!important;
	gap: 1.8em!important;
}

.usp-style {
    font-family: Amatic SC;
    font-size: 34px;
    font-weight: bolder;
    color: #196D38;
    list-style-type: none;
}

.usp-style::before {
    content: '\2713';
    font-family: Amatic SC;
    font-size: 1.4em;
    font-weight: 100;
    margin-right: .2em;
}

.usps-column li {
    font-family: Amatic SC;
    font-size: 28px;
    font-weight: bolder;
    color: #196D38;
    list-style-type: none;
}

.usps-column li::before {
    content: '\2713';
    font-family: Amatic SC;
    font-size: 1.4em;
    font-weight: 100;
    margin-right: .2em;
}

@media (max-width: 980px) {
.usps {
    display: block;
	padding: 0;
}
.usp-style {
    font-family: Amatic SC;
    font-size: 22px;
    font-weight: bold;
    color: #196D38;
    list-style-type: none;
}

.usp-style::before {
    content: '\2713';
    font-family: Amatic SC;
    font-size: 1.4em;
    font-weight: 100;
    margin-right: .2em;
}
}

.footer-contact i {
	margin-right: .75em;
}

.four-images {
    display: flex;
}

.four-images img {
    max-width: 25%;
}

.ontmoet-button {
	padding: .8em 1.6em;
    background: #58A344;
    color: #fff;
    border-radius: 5px;
    margin-top: 1em;
    max-width: fit-content;
	margin-left: -262px;
}

#main-footer a {
    border-bottom: 1px solid #fff;
}

#main-footer a:hover {
    border: none;
}

/** Pseudo elementen**/

#reviews { position: relative }
#reviews::before {
	content: '';
    background: url("/assets/uploads/tekening-ui.png") no-repeat;
    position: absolute;
    width: 500px;
    height: 500px;    
	top: -180px;
    transform: scale(.5);
}
#reviews::after {
	content: '';
    background: url("/assets/uploads/tekening-paprika.png") no-repeat;
    position: absolute;
    width: 500px;
    height: 500px;    
	bottom: -180px;
	right: 0;
    transform: scale(.5);
}
#alle-producten {
    position: relative;
}
#alle-producten::before {
    position: absolute;
    content: '';
    background: url("/assets/uploads/hart-lineiwhite@2x.png") no-repeat;
    background-size: 100%;
    width: 130px;
    height: 130px;
    top: -200%;
	left: 50%;
    transform: translateX(-50%);
}

#tomaat-before { position: relative; }
#tomaat-before::before {
	content: '';
    background: url(/assets/uploads/tomaat.png) no-repeat;
    position: absolute;
    width: 500px;
    height: 500px;
    top: -130px;
    left: -175px;
    transform: scale(.5);
}
#main-footer { position:relative; }
#main-footer::before {
	content: '';
    background: url("assets/uploads/tekening-paprika.png") no-repeat;
    position: absolute;
    width: 500px;
    height: 500px;    
	bottom: -20px;
	left: -228px;
	transform: scale(.5) scaleX(-1);
}

#courgette-broccoli { position: relative; }
#courgette-broccoli::before {
	content: '';
    background: url(/assets/uploads/courgette.png) no-repeat;
    position: absolute;
    width: 500px;
    height: 500px;
    top: -200px;
	left: -100px;
    transform: scale(.5);
}
#courgette-broccoli::after {
	content: '';
    background: url(/assets/uploads/brocollie@2x.png) no-repeat;
    position: absolute;
    width: 1000px;
    height: 1000px;
    top: -320px;
    left: 0px;
    transform: scale(.25);
}
#mango-banaan { position: relative; }
#mango-banaan::before {
	content: '';
    background: url(/assets/uploads/mango.png) no-repeat;
    position: absolute;
    width: 500px;
    height: 500px;
    top: -175px;
    left: -140px;
    transform: scale(.5);
}
#mango-banaan::after {
	content: '';
    background: url(/assets/uploads/banana.png) no-repeat;
    position: absolute;
    width: 1000px;
    height: 1000px;
    top: -240px;
    left: 90px;
    transform: scale(.5);
}

/*------------------------------------------------*/
/*-----------------[Contact form error]-----------------*/
/*------------------------------------------------*/

.validation_error{
	display:none;
}

.gform_wrapper li.gfield.gfield_error, .gform_wrapper li.gfield.gfield_error.gfield_contains_required.gfield_creditcard_warning {
    background-color: transparent!important;
    margin-bottom:0!important;
    border-top: 0!important;
    border-bottom: 0!important;
    padding-bottom: 0!important;
    padding-top: 0!important;
    box-sizing: content-box!important;
}
.gform_wrapper.gf_browser_chrome .gfield_error select,
.gform_wrapper li.gfield_error input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), .gform_wrapper 
li.gfield_error textarea {
    border: 2px solid #790000!important;
	background-color:#fff2f2 !important;
}

.gform_wrapper .gfield_error .gfield_label{
	color:#790000!important;
}

.gform_wrapper .validation_message{
	display:none;
}

/*------------------------------------------------*/
/*-----------------[Cookie notice]-----------------*/
/*------------------------------------------------*/

#cookie-notice {
	min-width:initial !important;
    background-color: #000000de!important;
    z-index: 2!important;
    position: fixed!important;
    bottom: 15px!important;
    left: 15px!important;
    width: 415px!important;
    font-size: 16px!important;
    line-height: 27px!important;
    text-align: left!important;
    box-shadow: 0px 5px 10px #6B676DA6!important;
    border-radius: 5px!important;
    min-width: initial;
}

#cookie-notice .cookie-notice-container {
    display: block;
    padding: 25px !important;
    text-align: left !important;
}

#cookie-notice h3 {
    color: white !important;
    margin: 0 !important;
    line-height: 25px !important;
}

#cookie-notice .cn-button {
    margin-left: 10px!important;
    display: block!important;
    text-align: center!important;
    padding: 9px 10px!important;
    width: 157px!important;
    font-size: 16px!important;
    margin-left: 0!important;
    margin-top: 13px!important;
    font-weight: 600;
}

#onze-producten::after {
	content: '';
    background: url(/assets/uploads/Underline-wit.png) no-repeat;
    position: absolute;
    height: 24px;
    width: 272px;
    right: 50%;
	top: 1em;
    transform: translateX(50%);
}

#ons-motto::after {
	content: '';
    background: url(/assets/uploads/Underline-wit.png) no-repeat;
    position: absolute;
    height: 24px;
    width: 272px;
    right: 50%;
	top: 1em;
    transform: translateX(50%);
}

#kom-langs-voor::after {
	content: '';
    background: url("/assets/uploads/Underline-zwart.png") no-repeat;
    position: absolute;
    height: 24px;
    width: 232px;
    right: 50%;
	top: 1em;
    transform: translateX(50%);
}

#biefit-is::after {
	content: '';
    background: url(/assets/uploads/Underline-wit.png) no-repeat;
    position: absolute;
    height: 24px;
    width: 272px;
    right: 50%;
	top: 3.5em;
    transform: translateX(50%);
}

.hearts {
	height: 300px;
	width: 300px;
}

.centered {
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}


#biefit-is h2 {
	color: #FFFFFF!important;
	font-size: 60px!important;
}

.green-bg img {
    height: 200px;
    width: 200px;
    background: #58A344;
    border-radius: 100%;
    padding: 40px;
}

h1.et_pb_module_header {
    text-shadow: 0 0 10px #333;
}

.et_pb_header_content_wrapper * {
    color: #fff;
}

.footer-widget {
	display: flex;
	flex-direction: column;
}

#maps {
	margin-bottom: -10px!important;
}

#logo {
	background: #fff;
  	clip-path: circle(50%);
  	border: 8px solid #fff;
  	border-radius: 100%;
  	margin-top: -20px;
}

.gform_title {
	font-size: 2em!important;
}

/* Contactpagina */

.contactpage-contact i,
.contactpage-adres i {
	width: 23px;
    margin-right: .5em;
}
.contactpage-contact a {
    border-bottom: 1px solid #333;
}

.contactpage-contact a:hover {
    border-bottom: 1px solid #ccc;
}
.contactpage-adres {
    display: flex;
}
.contactpage-adres i {
    margin-top: 5px;
}
.contact-page-total {
    background: #58A344;
    padding: 2em 0 2em 4em;
	max-width: 550px;
    width: auto;
    margin: auto;
    color: #eee;
    box-shadow: 0 0 5px 1px #555;
}
.contact-page-total a {
    color: #eee;
}
#gform_submit_button_1,
#gform_submit_button_4 {
    font-family: 'Open Sans', sans-serif;
    font-size: 22px;
    padding: .5em 10vmin;
    color: #eee;
    background: #58A344;
    border: none;
    box-shadow: 0 0 5px 1px #555;
}

#gform_submit_button_4 {
	width: 75%;
    padding: 0.5em 0;
	background: rgb(108,183,88)!important;
}

.et_pb_fullwidth_header_container.center h2 {
    text-shadow: 5px 5px 10px #333;
}

@media screen and (max-width: 850px) {
    .fullwidth-img-and-text {
        flex-direction: column;
    }
    .fullwidth-img-and-text * {
        width: 100%;
    }
}

@media only screen and (min-width: 981px) {
	.et_header_style_left #et-top-navigation, .et_header_style_split #et-top-navigation {
		padding: 20px 0 0 0;
		height: 60px;
	}
}

@media only screen and (max-width:450px) {
	#cookie-notice {
		width: 100% !important;
		left: 0 !important;
		bottom: 0 !important;
		border-radius: 0!important;
	}
}
@media only screen and (min-width: 981px) {
	.et_header_style_left #et-top-navigation, .et_header_style_split #et-top-navigation {
		padding: 20px 0 0 0;
	}
}

@media screen and (max-width: 750px) {
    ul.usps {
        grid-template-columns: repeat(2, auto);
    }
}

@media screen and (max-width: 550px) {
    ul.usps {
        grid-template-columns: repeat(1, auto);
    }
}

@media screen and (max-width: 805px) {
    .header-content * {
        text-align: left!important;
    }

    .et_pb_button_one {
        width: 100%;
        font-size: 4vmin!important;
    }

    .et_pb_button_two {
        margin-left: 0!important;
        float: left;
        width: 100%;
        font-size: 4vmin!important;
    }
}

@media screen and (max-width:980px) {
    .select_page {
        display: none!important;
    }
    .mobile_nav {
        width: fit-content;
        background: transparent!important;
    }
    .mobile_menu_bar::before {
        font-size: 64px;
        top: 10px;
    }
    #logo {
        max-height: 120px!important;
		float: left;
    }
	#main-header {
		padding: 0!important;
	}
}

/*** Full-width styling ***/

.fw-section {
    margin: 0!important;
    padding: 0!important;
}

.fw-row {
	display: flex;
    align-items: center;
    margin: 0!important;
    padding: 0!important;
    min-width: 100%;
    overflow: hidden;
}

.fw-text-right {
    text-align: left;
    padding: 3em 6em;
	max-width: 75ch;
}
.fw-text-left {
	text-align: left;
	padding: 3em 3em 3em 16em; 
	max-width: 75ch;
}

.fw-button {
	color: #fff!important;
    border-radius: 5px;
    font-family: 'Open Sans',Helvetica,Arial,Lucida,sans-serif;
    font-weight: 300;
    background-color: #58a344!important;
    margin-left: 0;
    padding: .8em 2em;
    max-width: unset;
}

.fw-button:hover {
	color: #fff!important;
	background: #196D38!important;
    box-shadow: 0 0 10px 1px #333;
}

.fw-img {
    min-width: 50%;
}

@media only screen and (max-width: 600px) {
    .fw-text-right,
    .fw-text-left {
        padding: 2em 1.6em!important;
    }
}

.current-link {
	outline: 5px solid red;
}

/*.products .product-row .et_pb_column {
	transition: transform 300ms ease-in-out;
}
.products .product-row .et_pb_column:hover {
    transform: translateY(-1em);
} */

.footer-widget {
    max-width: 365px;
}

.footer-widget h4,
.footer-widget p,
.center-nieuwsbrief{
    transform: translateX(25%);
}

.center-nieuwsbrief input[type="text"] {
	width: 75%!important;
}

.center-nieuwsbrief .gform_heading {
	display: none;
}

#footer-widgets {
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;

}

#footer-widgets.clearfix::after {
    display: none;
}

.et_mobile_menu {
	border: none;
}

@media only screen and (max-width: 980px) {
	#main-header {
    	height: 70px;
	}
    #footer-widgets {
        flex-direction: column;
		align-items: flex-start;
		margin-left: -50px!important;
    }
    #footer-widgets h4 {
        margin-bottom: 0;
        margin-top: 1em;
        padding: 0;
    }
    #footer-widgets p {
        margin-top: 0;
    }
	.footer-widget {
    	max-width: 60vw;
	}
}

#gform_submit_button_1:hover,
#gform_submit_button_4:hover {
    background: #4F8E3E;
    cursor: pointer;
    transition: all 250ms ease-in-out;
}
#gform_submit_button_4:hover {
	background: rgb(99,162,82)!important;
}
#top-menu li.current-menu-item:not(.centered-inline-logo-wrap) a::before {
    content: '';
    position: absolute;
    top: -22px;
    background: #58A344;
    height: 4%;
    width: 100%;
}

.hover-effect {
    display: inline-block;
    transition: transform 200ms ease-in-out;    
}

.hover-effect:hover {
    transform: scale(1.1) translateY(-0.1em);
}

.reviews-text {
	text-align: center;
	font-style: italic;
	max-width: 65ch;
	margin: 2em auto;
}

.reviews-img img {
    max-width: 70px;
    margin-bottom: -20px;
    padding: 0;
}

.reviews-text {
    position: relative;
}

.reviews-text::before {
    font-family: 'Font Awesome 5 Pro';
    font-weight: 400;
    font-style: normal;
    font-size: 1.4em;
    content: '\f053';
    position: absolute;
    left: -3em;

}

.reviews-text::after {
    font-family: 'Font Awesome 5 Pro';
    font-weight: 400;
    font-style: normal;
    font-size: 1.4em;
    content: '\f054';
    position: absolute;
    right: -3em;
}

.margin-bottom p {
	margin-bottom: 1em;
}

.et_pb_fullwidth_header {
	padding: 100px 0 160px!important;
}

@media only screen and (max-width: 1200px) {
    .fw-section > div {
        display: flex;
        flex-direction: column;
    }
	.fw-text-right,
	.fw-text-left {
		padding: 2em;
		margin: auto;
	}
	.fw-img {
    width: 100vw;
    margin: 0;
    padding: 0;
	}
	#tomaat-before::before,
	#main-footer::before,
	#reviews {
		display: none;
	}
}

@media only screen and (max-width: 1725px) {
	#courgette-broccoli::before,
	#courgette-broccoli::after {
		display: none;
	}
	#mango-banaan::before,
	#mango-banaan::after {
		display: none;
	}
}

.grass-border { position: relative; }
.grass-border::before {
    content: '';
    position: absolute;
    background-image: url("/assets/uploads/grass-border.png");
    height: 48px;
    width: 100%;
    top: -48px;
}

p a,
ul li a {
	font-weight: bold;
}