/*   
	Theme Name:        Studio Campo Theme
	Theme URI:         https://studiocampo.nl
	Description:       Studio Campo theme.
	Author:            Studio Campo
	Author URI:        https://studiocampo.nl
	License:           GNU General Public License v3 or later.
	License URI:       https://www.gnu.org/licenses/gpl-3.0.html
	Text Domain:       sc-theme
*/

:root {

	--felgroen:#00B9B5;
	--lichtgroen:#00777F;
	--groen:#005A60;
	--donkergroen:#003840;
	--wit:#ffffff;
	--zwart:#000000;
	--lichtgrijs:#F5F5F5;
}

/* Font */
@font-face {
	font-family: 'Montserrat';
	src: url('assets/fonts/Montserrat-Regular.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Montserrat';
	src: url('assets/fonts/Montserrat-SemiBold.woff2') format('woff2');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Montserrat';
	src: url('assets/fonts/Montserrat-Bold.woff2') format('woff2');
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}

/* Algemeen */
html,
body {

	padding: 0;
	margin: 0;
	font-family: 'Montserrat', sans-serif;
	line-height: 1.7;
	font-size: 16px;
	color:var(--zwart);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

h1,
h2,
h3 {

	margin-top: 0;
	color:var(--groen);

	&.elementor-heading-title {

		line-height: initial;
	}
}

h1,
.h1,
h2,
.h2 {

	font-weight: bold;
}

h1,
.h1 {

	@media (min-width:641px) {
		font-size: 35px;
		line-height: 45px;
	}
	@media (max-width:640px) {
		font-size: 30px;
		line-height: 44px;
	}
}
h2,
.h2 {

	font-size: 30px;
	line-height: 40px;
	@media (min-width:641px) {
		font-size: 30px;
		line-height: 40px;
	}
	@media (max-width:640px) {
		font-size: 25px;
		line-height: 37px;
	}
}

h3,
.h3 {

	font-weight: 600;
	font-size: 20px;
	line-height: 28px;
}

.sc-h3-light {

	h2 {

		color:var(--wit) !important;
		font-size: 22px;
		line-height: 30px;
	}	
	
	h3 {

		color:var(--felgroen) !important;
		margin-bottom: 0;
	}

	p {

		margin-top: 0;
	}

	strong {

		font-size: 18px;
	}
}

h4 {

	color:var(--groen);
	margin:0;
}

.sc-intro,
.sc-intro .elementor-heading-title {

	line-height: 28px;

	@media (min-width:768px) {

		font-size: 20px;
	}

	@media (max-width:767px) {

		font-size: 18px;
	}
}

.sc-small {

	font-size: 14px;
}

.sc-menu .elementor-nav-menu--dropdown.elementor-nav-menu__container .elementor-sub-item {

    margin-left: 20px;
	font-size: 20px !important;
}

.sc-menu .elementor-nav-menu .sub-arrow .e-font-icon-svg {

	width: 14px;
	height: 14px;
}

main a {

	color:var(--felgroen);
	text-decoration: underline;
	text-underline-offset: 3px;

	&:hover {

		color:var(--zwart);
	}
}

body {

	&:before {

		content: '';
		height: 100vh;
		width: 2px;
		position: fixed;
		left:50%;
		top:0;
		background-color: var(--felgroen);
		transform: translateX(-2px);
	}
}

.scDarkHeader {

	.sc-header {

		background-color: var(--donkergroen) !important;
	}

	.sc-header .scDarkNone {

		height: 0;
		overflow: hidden;
		transition: all 0.2s;
	}

	.sc-header .scDarkElement a {

		color: var(--wit) !important;
		fill: var(--wit) !important;
	}
}

footer {

	position: relative;
	font-size: 14px;
	
	a {

		color:var(--zwart);
		text-underline-offset: 3px;
		font-size: 14px;

		&:hover {

			color:var(--felgroen);
			text-decoration: underline;
		}
	}

	p {

		margin-top:0;
	}

	.sc-no-mob-bg {

		@media (max-width:767px) {

			background-color: var(--wit);
		}
	}
}

.sc-line-before {

	position: relative;

	&:after {

		content: '';
		height: 100%;
		width: 2px;
		position: absolute;
		left:50%;
		top:0;
		background-color: var(--felgroen);
		transform: translateX(-2px);
	}
}

.sc-slider.elementor-element {

	img {

		position: relative;
		z-index: 1;
	}

	.swiper .elementor-swiper-button-prev {

		right:120px;
		bottom:20px;
		left:auto;
		top:auto;
		transform: none;
	}

	.swiper .elementor-swiper-button-next {

		right:40px;
		bottom:20px;
		left:auto;
		top:auto;
		transform: none;
	}

	&:after {

		content: '';
		position: absolute;
		width: 200px;
		height: calc(100% - 80px);
		top:-10px;
		right: 0;
		z-index: 0;
		background-color: var(--donkergroen);
	}
}

.sc-carousel.elementor-element {

	/* img {

		position: relative;
		z-index: 1;
	} */

	.swiper .elementor-swiper-button-prev {

		bottom:-60px;
		left:10px;
		top:auto;
		transform: none;
	}

	.swiper .elementor-swiper-button-next {

		right:auto;
		bottom:-60px;
		left:80px;
		top:auto;
		transform: none;
	}

	&:after {

		content: '';
		position: absolute;
		width: 200px;
		height: 180px;
		top:-10px;
		right: 0;
		z-index: 0;
		background-color: var(--donkergroen);
	}

	&:before {

		content: '';
		position: absolute;
		width: 200px;
		height: calc(100% - 80px);
		bottom:0;
		left: 0;
		z-index: 0;
		background-color: var(--donkergroen);
	}

}

.sc-prijzen {

	position: relative;

	.elementor-element {

		z-index: 1;
	}

	@media (min-width:768px) {

		&:after,
		&:before {

			content: '' !important;
			display: block !important;
			position: absolute;
			width: 200px !important;
			height: calc(100% - 80px) !important;
			z-index: 0;
		}

		&:after {

			top:0;
			right: 0;
			background-color: var(--donkergroen);
		}

		&:before {

			bottom:0;
			top:auto !important;
			background-color: var(--groen);
		}
	}

	@media (max-width:767px) {

		&:after,
		&:before {

			content: '' !important;
			display: block !important;
			position: absolute;
			width: 200px !important;
			height: 25% !important;
			z-index: 0;
		}

		&:after {

			bottom:-10px;
			right: -10px;
			background-color: var(--donkergroen);
		}

		&:before {

			top:-10px !important;
			left:-10px !important;
			background-color: var(--groen);
		}
	}

}

.elementor-widget-video {

	padding:10px;
}

.sc-after-before {

	&:before,
	&:after {

		content: '';
		position: absolute;
		width: 30%;
		z-index: -1;
		background-color: var(--donkergroen);
	}
}

.sc-after-before {

	&:before {

		height: 30%;
		top:-10px;
		right: -10px;
	}
}

.sc-after-before {

	&:after {

		height: calc(100% - 10px);
		bottom:-10px;
		left: -10px;
	}
}

.sc-e-con-inner {

	position: relative;
}

.sc-inshrijving.e-con {

	@media (min-width:641px) {

		position: absolute;
		bottom: -40px;
		max-width: 70%;
		left: -10px;
	}

	@media (min-width:1400px) {

		left: -80px;
	}
}

.sc-winnars-table,
.sc-regio-table {

	text-align: left;

	@media(max-width:461px) {

		font-size: 14px;
	}

	td {

		vertical-align: top;
	}
}

.sc-regio-table tr {

	@media(max-width:767px) {

		display: flex;
		flex-wrap: wrap;
		padding: 4px 0;

		td:last-child {

			font-size: 13px;
			width: 100%;
		}
	}
}

.sc-bestuur-list {

	strong {

		font-weight: 600;
		font-size: 16px;
	}

	p {

		font-size: 14px;
	}
}

.sc-relative {

	position: relative;
}

.sc-logo-opacity {

	opacity:0.2;
}

.mc4wp-input {

    border-style: solid;
    border-width: 1px;
    border-color: var(--e-global-color-accent);
    border-radius: 0px 0px 0px 0px;
    padding: 10px 12px;
	width: 90%;
}

.mc4wp-button {

    background-color: var(--e-global-color-accent);
    fill: var(--e-global-color-8251510);
    color: var(--e-global-color-8251510);
    border-style: solid;
    border-width: 2px;
    border-color: var(--e-global-color-accent);
    border-radius: 0px 0px 0px 0px;
    padding: 10px 012px;
}

/**
* Genomineerden
*/
.type-genomineerden {

	position: relative;
}

.categorie-genomineerden-genomineerden-mkb {

	background-color: var(--groen);
}

.categorie-genomineerden-genomineerden-plaquette {

	background-color: var(--lichtgroen);
}

.tag-genomineerde-finalist-grootbedrijf {

	background-color: var(--donkergroen);
}

.tag-genomineerde-finalist-plaquette {

	background-color: var(--lichtgroen);
}

.tag-genomineerde-finalist-mkb {

	background-color: var(--groen);
}

/**
* Accessibility icon
*/
.ea11y-widget-open-button--icon .ea11y-widget-open-button__icon-border svg path {

	fill: var(--wit);
}
.ea11y-widget-open-button--icon .ea11y-widget-open-button__icon-border {

	border-color: var(--wit);
}