/*
Theme Name: Bedrukkingsexpert
Template: Total
Author: Klaas-Wytze
Version: 1.0
*/

/*------------------------------------------------------------------------
## algemeen
------------------------------------------------------------------------*/

/*
 https://min-max-calculator.9elements.com/
 https://nekocalc.com/px-to-rem-converter
 */

/* == config == */
:root {
	--wpex-bg-color: #000;

	--wpex-accent: #FFF;
	--accent-1: #f2f2f2;
	--accent-2: #FFF;
	--base: #FFF;
	--black: #000;

	font-size: 100%;
	  
	--wpex-body-font-family: "Outfit", sans-serif;
	--wpex-body-font-size: 1rem;
	--wpex-body-font-weight: 400;
	--wpex-body-font-weight-strong: 700;
	--wpex-body-line-height: 160%;

	--wpex-text-2: var(--base);
	--wpex-link-color: var(--base);
	--wpex-link-text-decoration: underline;
	--wpex-hover-link-text-decoration: none;

	--wpex-heading-font-family: "Kitami", sans-serif;
	--wpex-heading-color: var(--accent-1);
	--wpex-heading-font-weight: 400;
	--wpex-heading-line-height: 102%;
	--wpex-el-margin-bottom: 15px;

	--wpex-btn-font-family: "Kitami", sans-serif;
	--wpex-btn-font-style: normal;
	--wpex-btn-text-transform: none;
	--wpex-btn-letter-spacing: 0px;
	--wpex-btn-line-height: normal;
	--wpex-btn-font-weight: 400;
	--wpex-btn-font-size: 1.2rem;
	--wpex-btn-color: var(--black);
	--wpex-btn-padding: 14px 30px;
	--wpex-btn-bg: var(--base);
	--wpex-btn-border-radius: 10px;

	--wpex-hover-btn-bg: var(--base);
	--wpex-hover-btn-color: var(--black);
}

/* == fonts == */

/*-- fonts --*/
@font-face {
	font-family: "Kitami";
	src: url('assets/fonts/Kitami-Regular.woff2') format('woff2'),
		url('assets/fonts/Kitami-Regular.woff') format('woff');
	font-weight: 400;
	font-style: normal;
}

body {
	font-size: 100%;
	font-family: var(--wpex-body-font-family);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

p,
ul li,
ol li {
	font-weight: var(--wpex-body-font-weight);
}

b,
strong {
	font-weight: var(--wpex-body-font-weight-strong);
}

.wpex-heading,
.vcex-heading {
	font-family: var(--wpex-body-font-family);
	font-weight: var(--wpex-body-font-weight-strong);
	line-height: 1.5;
}

h1,
h1.vcex-heading,
h1.page-header-title {
	font-family: var(--wpex-heading-font-family);
	font-weight: var(--wpex-heading-font-weight);
	font-size: min(max(2.5rem, 2.159rem + 1.7vw), 3.438rem));
	font-size: clamp(2.5rem, 2.159rem + 1.7vw, 3.438rem);
	line-height: 1.2;
	margin: 0 0 15px;
}

h2,
h2.wpex-heading,
h2.vcex-heading {
	font-family: var(--wpex-heading-font-family);
	font-weight: var(--wpex-heading-font-weight);
	font-size: min(max(1.5rem, 1.25rem + 1.25vw), 2.188rem));
	font-size: clamp(1.5rem, 1.25rem + 1.25vw, 2.188rem);
	margin: 0 0 20px;
}

h3,
h3.wpex-heading,
h3.vcex-heading {
	font-family: var(--wpex-heading-font-family);
	font-weight: var(--wpex-heading-font-weight);
	font-size: min(max(1.188rem, 0.938rem + 1.25vw), 1.5rem));
	font-size: clamp(1.188rem, 0.938rem + 1.25vw, 1.5rem)
	/* margin: 0 0 20px; */
}

h4,
h4.vcex-heading {
	font-family: var(--wpex-heading-font-family);
	font-weight: var(--wpex-heading-font-weight);
	font-size: min(max(1.063rem, 1.997rem + 0.33vw), 1.25rem));
	font-size: clamp(1.063rem, 0.994rem + 0.34vw, 1.25rem);
	margin: 0 0 15px;
}

h5,
h6 {
	font-family: var(--wpex-heading-font-family);
	font-weight: var(--wpex-heading-font-weight);
}

/* == vc == */
.wpb_row {
	padding: 70px 0px 0px;
}

/* == buttons == */
a.theme-button {
	margin-top: 30px;
}
a.theme-button:hover {
	opacity: 0.8;
}

.typography-white a.theme-button {
	color: var(--wpex-btn-color);
}

.typography-white a.theme-button:hover {
	color: var(--wpex-hover-btn-color);
}

a.theme-button.outline {
	color: var(--accent-1);
	font-weight: var(--wpex-btn-font-weight);
	border-color: var(--wpex-accent);
}
a.theme-button.outline:hover {
	color: var(--black);
}

a.vcex-button.theme-txt-link {
	text-decoration: none;
	font-size: var(--wpex-btn-font-size);
	font-weight: var(--wpex-btn-font-weight);
	color: var(--black);
}

a.theme-button.minimal-border {
	color: var(--accent-1);
	font-weight: var(--wpex-btn-font-weight);
	border-width: 0 0 1px;
	padding: 6px 0;
}
a.theme-button.minimal-border:hover {
	color: var(--black);
	padding: 6px 8px;
}

a.vcex-button.theme-txt-link:hover {
	color: var(--wpex-accent)
}

.vcex-multi-buttons {
	margin-top: 30px;
}

.vcex-multi-buttons a.theme-button {
	margin-top: 0;
}

/* == formulieren algemeen == */

.gform_body {
	--gf-form-gap-y: 20px !important;
}

.gform_wrapper {
	--gf-ctrl-accent-color: var(--wpex-accent);
	--gf-ctrl-choice-check-color: var(--wpex-accent);
	--gf-ctrl-btn-bg-color-primary: var(--wpex-accent);
	--gf-local-color: var(--base);
	
	background-color: var(--base);
	padding: 40px;
	border-radius: 20px;
}

.gform_wrapper p {
	color: var(--black);
}
.gform_wrapper a {
	color: var(--black);
	text-decoration: underline;
}

.gform_wrapper .gfield_label,
.gform_wrapper .gfield_consent_label {
	color: var(--black) !important;
}

.gfield.gfield--type-html {
	font-size: .9rem;
}
.gform_wrapper .gform_fields input[type=text],
.gform_wrapper .gform_fields input[type=email],
.gform_wrapper .gform_fields input[type=tel],
.gform_wrapper .gform_fields textarea {
	font-size: 1rem;
	padding: 12px 8px;
	color: var(--black);
}

.gform_wrapper .gform_footer.top_label {
	text-align: right;
}

.gform_wrapper .gform_footer input[type=submit].gform_button {
	padding: var(--wpex-btn-padding) !important;
	background-color: var(--black) !important;
	border-radius: var(--wpex-btn-border-radius) !important;
	border: 2px solid var(--black) !important;
	color: var(--base);
	font-size: var(--wpex-btn-font-size) !important;
	font-family: var(--wpex-btn-font-family) !important;
	font-style: var(--wpex-btn-font-style) !important;
	text-transform: var(--wpex-btn-text-transform) !important;
	letter-spacing: var(--wpex-btn-letter-spacing) !important;
	line-height: var(--wpex-btn-line-height) !important;
	font-weight: var(--wpex-btn-font-weight) !important;
}

.gform_wrapper .gform_footer input[type=submit].gform_button:hover {
	background-color: var(--black) !important;
	color: var(--base) !important;
	opacity: 70% !important;
}

/* == scroll top == */
#site-scroll-top {
	background-color: var(--base);
	color: var(--black);
	border-radius: 7px;
}

#site-scroll-top:hover {
	background-color: var(--wpex-accent);
	color: var(--black);
	opacity: 70%;
}

/* == icons replace == */
body .ticon-check:before {
	content: url(assets/img/check.svg);
}

/*------------------------------------------------------------------------
## header
------------------------------------------------------------------------*/

#site-header {
	--wpex-main-nav-height: 45px;
	--wpex-main-nav-link-color: var(--black);
	--wpex-hover-main-nav-link-color: var(--accent-2);
	--wpex-active-main-nav-link-color: var(--accent-1);
	--wpex-surface-1: var(--black);
	
	z-index: 2;
}

#site-header.header-fixed-height .not-sticky #site-logo .logo-img {
	max-height: inherit;
}

#site-header-inner {
	padding: 20px 0;
}

/* == navigation == */
.main-navigation {
	--wpex-main-nav-link-padding-y: 1em;
	--wpex-main-nav-link-padding-x: 0;
	--wpex-main-nav-gutter: 2rem;
}

.main-navigation-ul>.menu-item:not(:last-child) {
	margin-inline-end: 0;
}

.main-navigation-ul>.menu-item {
	font-family: var(--wpex-heading-font-family);
	font-weight: var(--wpex-heading-font-weight);
	font-size: 1.17rem;
	margin: 0 2rem;
}
.main-navigation-ul>.menu-item>a {
	line-height: 100% !important;
	color: var(--base);
}
.main-navigation-ul>.menu-item>a>.link-inner {
	padding: 0;
	line-height: 100%;
}
.main-navigation-ul>.current-menu-item>a,
.main-navigation-ul>.current-menu-ancestor>a {
	color: var(--base);
}

/* == mobile == */

nav.mobile-toggle-nav {
	--wpex-surface-1: var(--black);
}

.mobile-menu-toggle {
	background: var(--black);
	border-radius: 3px;
	color: var(--base);
	padding: 8px 10px;
}
.mobile-menu-toggle:hover {
	color: var(--black);
}

.mobile-toggle-nav .mobile-toggle-nav-ul .menu-item {
	font-family: var(--wpex-heading-font-family);
	font-weight: var(--wpex-heading-font-weight);
	font-size: min(max(1rem, 1.955rem + 0.23vw), 1.25rem));
	font-size: clamp(1rem, 0.955rem + 0.23vw, 1.125rem);
}

.mobile-toggle-nav .mobile-toggle-nav-ul .menu-item a {
	border: 0;
	color: var(--base);
}

.mobile-toggle-nav .mobile-toggle-nav-ul .menu-item.current-menu-item a span {
	border-bottom: 3px solid var(--accent-1);
}

/*------------------------------------------------------------------------
## callout
------------------------------------------------------------------------*/

#footer-callout-wrap {
	background-color: transparent;
	border: 0;
	position: relative;
	z-index: 999;
}

#footer-callout {
	--wpex-heading-color: var(--base);
	color: var(--base);
	padding: 30px 0;
	flex-flow: column;
}

.footer-callout-content,
.footer-callout-button {
	width: auto;
}

.footer-callout-button a.theme-button {
	margin-top: 10px;
}

/*------------------------------------------------------------------------
## footer
------------------------------------------------------------------------*/

.site-footer {
	background-color: var(--black);
}

/* ==  footer widgets == */
 
#footer-inner {
	background-color: var(--black);
}
 
#footer-widgets .widget-title {
	color: var(--black);
	font-size: min(max(125rem, 1.08rem + 0.23vw), 1.25rem));
	font-size: clamp(1.125rem, 1.08rem + 0.23vw, 1.25rem);
	font-weight: 700;
	margin-bottom: 10px;
}

#footer-widgets p,
#footer-widgets ul li,
#footer-widgets ul li a {
	font-size: 0.95rem;
	font-weight: 400;
	color: var(--black);
}

#footer-widgets a:hover,
#footer-widgets ul li a:hover {
	color: var(--accent-2);
}

#footer-widgets p a {
	color: var(--black);
	text-decoration: underline;
}

#footer-widgets p a:hover {
	text-decoration: none;
}

/* == footer bottom == */
#footer-bottom {
	background-color: var(--black);
}

/*------------------------------------------------------------------------
## Hero's
------------------------------------------------------------------------*/

/* == page title  == */
.page-header {
	background: #1a1a1a;
	padding-top: 120px;
	padding-bottom: 50px;
	border: 0;
	align-items: end;
}

body .page-header.background-image-page-header {
	background-position: center;
	background-size: cover;
	min-height: 600px;
	max-height: 50vh;
}

body .page-header.background-image-page-header::before {
	content: '';
	background: #1a1a1a;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	opacity: 60%;
	pointer-events: none;
}

.page-header-inner {
	justify-content: center;
}

body.has-composer .page-header {
	margin: 0 auto;
}

/* == hero home == */
.hero--home.wpex-vc-full-width-row {
	padding-top: 0;
	min-height: 670px;
}
.hero--home.wpex-vc-full-width-row::after {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background: #000;
	visibility: visible;
	left: 0;
	top: 0;
	opacity: 70%;
	pointer-events: none;
}

/*------------------------------------------------------------------------
## Archive
------------------------------------------------------------------------*/

/* ==  single post == */

.single-post .single-blog-article {
	max-width: 800px;
	margin: 0 auto;
}

/*------------------------------------------------------------------------
## Elements
------------------------------------------------------------------------*/

/* == list with icons == */
.vcex-module.vcex-bullets {
	background-color: var(--base);
	padding: 35px;
	line-height: 200%;
}
.vcex-module.vcex-bullets .vcex-bullets-icon::before {
	color: var(--wpex-accent);
}

/* == carousel == */

@media screen and (min-width : 959px) {
	.wpex-carousel.arrwpos-top-right::before {
		display: none;
	}
	
	.wpex-carousel.arrwpos-top-right .wpex-carousel__nav:not(.disabled) {
		justify-content: space-between !important;
		transform: translateY(calc(-100% - 20px));
	}
}

/* == service card */
.wpex-post-cards-entry.type-diensten .wpex-card > a {
	border: 1px solid var(--wpex-accent);
	border-width: 1px 0;
	transition: all ease-in-out .3s;
}
.wpex-post-cards-entry.type-diensten .wpex-card > a:hover {
	background-color: rgba(255 255 255 / 20%);
}
.wpex-post-cards-entry.type-diensten {
	margin-bottom: -1px;
}

/*------------------------------------------------------------------------
## mobile
------------------------------------------------------------------------*/

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

	/* == header == */

	/* == hero == */

	/* == sections == */
}

@media screen and (max-width : 767px) {
	
	.wpb_row {
		--wpex-vc-column-inner-margin-bottom: 40px;
		
		padding: 40px 0px 0px;
	}

	/* == footer == */
	#footer-widgets .col {
		width: 100% !important;
	}
	#footer-bottom {
		margin-top: 0;
	}

	/* == row reverse == */
	.mobile-column-reverse {
		flex-flow: column-reverse;
	}

	/* == page header == */
	.page-header {
		padding-top: 80px;
		padding-bottom: 40px;
	}
	
	/* == elements == */
	.header-eight-aside {
		display: none;
	}
	
	/* hero home */
	.hero--home.wpex-vc-full-width-row {
		padding: 40px 0;
		display: flex;
		flex-flow: column;
	}
	.hero--home .hero__content {
		margin-top: 40px;
	}
	
	/* carousel */
	.carousel--reviews.vcex-testimonials-fullslider.has-arrows {
		padding-left: 0;
		--vcex-testimonials-fullslider-arrow-offset: 10px;
	}

}

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