@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

body {
  font-family: 'Open Sans', sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 0.938rem;
}

/* HEADINGS */
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    margin-bottom: 1rem;
    font-weight: 700;
    line-height: 1.2;
	color: #222;
	text-transform: none;
}

.h1, h1 {font-size: 1.5rem;} 	/* 1.625 = 24px */
.h2, h2 {font-size: 1.375rem;} 	/* 1.375 = 22px */
.h3, h3 {font-size: 1.25rem;} 	/* 1.25 = 20px */
.h4, h4 {font-size: 1.125rem;} 	/* 1.125 = 18px */
.h5, h5 {font-size: 1.0rem;} 	/* 1.0 rem = 16px */
.h6, h6 {font-size: 0.875rem;} 	/* 0.875 = 14px */

.article-details .article-header h1 {font-size: 1.625rem;}
.article-details .article-header h2 {font-size: 1.125rem;}
.article-list .article .article-header h1 {font-size: 1.5rem;}
.article-list .article .article-header h2 {font-size: 1.125rem;}
.article-list .article .article-header h1 a, .article-list .article .article-header h2 a {color: #C83C00;}

#sp-main-body {padding: 40px 0;}

/* LINKS */
a {color: #008c36;}
a:hover, a:focus, a:active {color: #4a797e;}
.sp-module ul>li>a {color: #008c36;}
.sp-module ul>li>a:hover {color: #4a797e;}

/* HEADERS */
.sp-column.text-center.text-lg-start {display: flex;}
#sp-top2 .sp-contact-info {display: inline-block; }
#sp-top1 p {margin-bottom: 0rem; font-size: 1rem;}
#sp-logo {display: flex; justify-content: flex-start; align-items: center;}
#sp-header {
	height: 120px;
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}
#sp-header .logo {height: 90px;}
#sp-top1 {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
#sp-top-bar {
    background: #008c36;
    color: #FFFFFF;
	font-size: 0.875rem;
	padding: 0px;
}
#sp-top-bar a {color: #fff;}
.sp-module.voxx {padding-right: 20px;}
.sp-contact-info li {padding: 0px 5px; font-size: 0.938rem;}
.sp-contact-info .fas, .sp-contact-info .far {padding-right: 5px;}
#sp-top2 ul {margin-bottom: 0rem; padding-left: 0rem; list-style-type: none;}
#sp-top-bar .sp-module {margin: 0 0 0 1rem;}
#sp-top2 .item-853 a {
    background: #B1B3B4 !important;
    font-size: 0.938rem !important;
    line-height: 50px !important;
    font-weight: 700 !important;
    color: #FFFFFF !important;
    border: 1px solid #B1B3B4 !important;
    text-transform: uppercase;
    display: inline-block;
    padding: 0 20px !important;
    cursor: pointer;
	letter-spacing: 1px;
}

.bg-primary {
    background-color: #008c36!important;
}

/* FOOTER */
#sp-bottom {
    background-color: #f1f6f9;
    color: #000;
    padding: 50px 0px 20px 0px;
	font-size: 1rem;
}

#sp-footer {
    background: #008c36;
    color: #fff;
}

#sp-bottom .sp-module .sp-module-title {
    text-transform: uppercase;
    font-weight: 600;
    font-size: 1rem;
    color: #000;
	border-bottom: 1px solid #00B945 !important;
    padding-bottom: 10px !important;
	margin: 0 0 20px;
	width: 30%;
}

#sp-bottom .sp-module ul>li {margin-bottom: 2px;}
#sp-footer a {color: #FFF;}
#sp-bottom a {color: #008c36;}

ul.corporate-social li a i {margin-top: 10px;}
ul.corporate-social {border-top: 1px solid #ccc !important;}

/* knoppen */
.article-list .article .readmore {margin-top: 20px;}
.article-list .article .readmore a {
    border: 1px solid #2bb673;
    color: #2bb673;
	padding: 8px 20px 8px 20px;
	border-radius: 6px;
	margin-top: 15px;
}

.article-list .article .readmore a:hover, .article-list .article .readmore a:active, .article-list .article .readmore a:focus {
    color: #FFF;
	background: #2bb673;
}

/* mobiel contact social */
.offcanvas-menu .sp-contact-info li:last-child {border-right: none;}
.offcanvas-menu .sp-contact-info li {border-left: none; margin: 0px; padding: 0px;}

/* MENU */
.sp-megamenu-parent>li:last-child>a {padding: 0px 15px 0px 15px;}
.sp-megamenu-parent>li>a {color: #222;}
.sp-megamenu-parent>li>a, .sp-megamenu-parent>li>span {
	padding: 0 10px;
	font-size: 0.938rem;
	font-weight: 700;
	text-transform: uppercase;
	line-height: 120px;
}
.sp-megamenu-parent>li.active>a, .sp-megamenu-parent>li.active:hover>a {color: #008c36; background: #fff; font-weight: 700;}
.sp-megamenu-parent>li:hover>a {color: #008c36;}
body.ltr .sp-megamenu-parent>li.sp-has-child>a:after, body.ltr .sp-megamenu-parent>li.sp-has-child>span:after {
margin-left: 2px;
}

span.sp-group-title.sp-menu-separator, span.sp-group-title.sp-menu-heading {font-weight: 700;}
span.nav-header, span.menu-separator {font-weight: 700;}

/* kruimelpad naar rechts + titel */
nav.mod-breadcrumbs__wrapper {display: flex; align-items: bottom; justify-content: flex-end; float: right; background: #ccc;}
.sp-page-title .breadcrumb {margin: 0px 0 0 0; font-size: 0.875rem;}
.sp-page-title .sp-page-title-heading {display: none;}
ol.mod-breadcrumbs.breadcrumb.py-2 {padding-top: 0rem !important; padding-bottom: 0rem !important;}

.sp-page-title {
	padding: 140px 0 140px;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
    background-color: #f5f5f5;
}

@media(max-width:991px) {
    .sp-page-title {padding: 80px 0 80px !important;}
}

 @media(max-width:767px) {
	 .sp-page-title {padding: 50px 0 50px !important;}
}

/* modules en content */
#sp-right .sp-module {
    margin-top: 20px;
    border: 1px solid #DDD;
    padding: 20px;
}

.sp-module.menurechts p {margin-bottom: 0rem;}
#sp-left .sp-module .sp-module-title, #sp-right .sp-module .sp-module-title {
    margin: 0px;
    padding-bottom: 20px;
    font-size: 1rem;
    font-weight: 600;
    border-bottom: 1px solid #EEE;
}

.sppb-addon-articles .sppb-addon-article-layout-magazine-content:hover .sppb-article-info-wrap {background: rgba(255, 255, 255, .9);}
.sppb-article-info-wrap h3 {font-size: 1.125rem;}

#sp-right .menu > li.active > a {background-color: #008c36; border-radius: 4px; color: #FFF;}
#sp-right .sp-module ul>li>a {padding: 0px 0px 0px 10px;}
#sp-right .sp-module ul>li {border-bottom: 1px solid #ddd;}
#sp-right ul.menu-child {padding-left: 20px;}
#sp-right ul.menu-child > li.active > a {background-color: #edf5ff; border-radius: 4px;}

h3.sppb-addon-title.sppb-feature-box-title {font-size: 18px;}

.sppb-testimonial-carousel-testi_layout3 .active:nth-child(odd) .sppb-testimonial-carousel-item-content {
    background: #008c36 !important;
}

.sppb-testimonial-carousel-testi_layout3 .active:nth-child(odd) .sppb-testimonial-carousel-item-content .sppb-testimonial-carousel-message {
    color: #fff !important;
    font-style: italic;
	font-size: 14px;
}

div.sppb-carousel-extended-dots {bottom: -40px;}
.sp-page-builder .page-content #section-id-1632324087940 {background-color: #FFF;}

/* DJ CATALOG */
.djc_title .h4, .djc_title h4 {font-size: 1rem; margin-top: 10px;}
.djc_title .h3, .djc_title h3 {font-size: 0.938rem;}
.slick-initialized .slick-slide {
    padding: 10px;
	border: 1px solid #ccc;
	margin: 5px;
}

.slick-slide .djc_item {padding: 5px;}
.slick-dots {bottom: -35px;}

.djc_readon .btn-primary:hover, .djc_readon .sppb-btn-primary:hover {
    border-color: #B1B3B4;
    background-color: #B1B3B4;
}

.btn-primary:hover, .sppb-btn-primary:hover {
    border-color: #B1B3B4;
    background-color: #B1B3B4;
}

.sp-module-content-bottom.clearfix {margin-top: 20px;}

.topmenu .sppb-addon-content ul {margin-bottom: 0rem; padding-left: 0rem; list-style-type: none; display: flex;}
.topmenu .sppb-addon-content ul>li>a {color: #fff; background: #008c36; padding: 10px 20px; border-radius: 8px; font-weight: 600;}
.topmenu .sppb-addon-content ul>li>a:hover {color: #fff; background: #B1B3B4;}
.topmenu .sppb-addon-content ul>li {padding: 10px;}

/* MOBIEL */

.burger-icon>span {height: 4px;}
.offcanvas-menu .offcanvas-inner .afspraak ul.menu>li a {
    background: #008c36;
	padding: 10px 6px 10px 12px;
	color: #fff;
	border-radius: 6px;
}

@media (max-width: 1400px) {
	.sp-megamenu-parent>li>a, .sp-megamenu-parent>li>span {padding: 0 8px;}
}

@media (max-width: 1200px) {
	/*#offcanvas-toggler {display: flex !important;}
	.sp-megamenu-parent{display:none !important;}*/
	#sp-header {height: auto; padding: 10px 0;}
	.sp-megamenu-parent>li>a, .sp-megamenu-parent>li>span {padding: 0 4px; font-size: 0.813rem;}
	#sp-top2 .sp-contact-info {display: none;}
}

@media(max-width:992px) {
	#sp-top-bar {display: none;}
	.logo-image {height: 70px !important;}
}