/*   
	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 {

	--oranje:#F77B1D;
	--blue:#293180;
	--groen:#78C199;
	--wit:#ffffff;
	--zwart:#000000;
	--grijs:#f6f6f6;
}

/* Font */
@font-face {
  font-family: 'Poppins';
  src: url('assets/fonts/poppins-400.woff2') format('woff2');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'Poppins';
  src: url('assets/fonts/poppins-500.woff2') format('woff2');
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: 'Poppins';
  src: url('assets/fonts/poppins-600.woff2') format('woff2');
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: 'Poppins';
  src: url('assets/fonts/poppins-700.woff2') format('woff2');
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

/* Algemeen */
html,
body {
	padding: 0;
	margin: 0;
	font-family: 'Poppins', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

h1,
.h1 {

	@media (min-width: 1025px) {
		font-size: 60px;
		line-height: 75px;
	}
	@media (max-width: 1024px) {
		font-size: 40px;
		line-height: 58px;
	}
	@media (max-width: 767px) {
		word-break: break-word;
	}
}

h2,
.h2 {

	font-weight: 600;
	color: var(--blue);
	@media (min-width: 1025px) {
		font-size: 40px;
		line-height: 58px;
	}
	@media (max-width: 1024px) {
		font-size: 30px;
		line-height: 46px;
	}
	@media (max-width: 767px) {
		word-break: break-word;
	}
}

h3,
.h3 {

	color: var(--blue);
	@media (min-width: 1025px) {
		font-size: 30px;
		line-height: 46px;
	}
	@media (max-width: 1024px) {
		font-size: 24px;
		line-height: 38px;
	}
}

p {

	margin-top:0;
}

.sc-relative {
	position: relative;
}

.sc-intro {

	@media (min-width: 1025px) {
		font-size: 24px;
		line-height: 34px;
	}
	@media(max-width: 1024px) {
		font-size: 20px;
		line-height: 30px;
	}
}

.sc-intro2 {

	@media (min-width: 1025px) {
		font-size: 22px;
		line-height: 32px;
	}
	@media (max-width: 1024px) {
		font-size:18px;
		line-height: 28px;
	}
}

.sc-scheef {

	overflow: hidden !important;

	* {
		z-index:1;
	}

	&:after {

		content:'';
		max-width: 1000px;
		width:100%;
		height:100%;
		background:var(--grijs);
		position:absolute;
		top:0;
		display: block;
		z-index: 0;
		border-bottom-left-radius: 50px;

		@media (max-width: 1299px) {
			left:40px;
		}
		@media (min-width: 1300px) {
			right:calc((100% - 1100px) / 2);
		}
		@media (max-width: 767px) {
			transform: skewX(3deg);
			left:15px;
		}
		@media (min-width: 768px) {
			transform: skewX(15deg);
		}
	}
}

.sc-scheef-text {

	@media (min-width: 1300px) {
		width:1000px;
	}
	@media (min-width: 768px) and (max-width: 1299px) {
		width:95%;
	}

	a {

		background-color: var(--oranje);
		border: 1px solid var(--oranje);;
		border-radius: 50px;
		color:var(--wit);
		padding:6px 16px;
		font-size: 16px;
		margin-top: 10px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		transition: all 0.3s ease;

		&:hover {
			background-color: var(--wit);
			color: var(--oranje);
		}

		&:before {

			content:'';
			background-image: url(assets/img/chevron-right.svg);
			width:15px;
			height: 15px;
			border: 1px solid var(--oranje);
			border-radius: 15px;
			display: block;
			margin-right: 8px;
		}

		&:hover:before {
			background-color: var(--oranje);
			border-radius: 15px;
		}
	}
}

.sc-scheef-heading {

	@media (min-width: 1300px) {
		width:1000px;
	}
	@media (min-width: 768px) and (max-width: 1299px) {
		width:95%;
	}
}

.sc-slider-diensten {

	@media (min-width: 1300px) {
		width:calc(50vw + 660px) !important;
		margin-right: 0 !important;
	}

	.swiper-slide {
		height: calc(100% - 40px);
		margin-top: 40px;
		transition: all 0.3s ease;

		&:hover {
			height: 100%;
			margin-top: 0;
		}

		> .elementor-element {

			width: calc(100% - 40px);
		}
	}

	/* 
	.swiper-slide {
		text-align: center;
		font-size: 18px;
		background: #444;
		display: flex;
		justify-content: center;
		align-items: center;
		height: 200px;
		color:white;
    }
	*/
}

.sc-slider-logos {

	@media (min-width: 1300px) {
		width:calc(50vw + 660px) !important;
		margin-right: 0 !important;
	}
}

/* 
.sc-logos-slider {

	@media (min-width: 1025px) {
		padding: 60px 0 60px 120px;
	}
	@media (max-width:1024px) {
		padding: 40px 0 40px 80px;
	}
	@media (max-width:640px) {
		padding: 40px 0 40px 40px;
	}

	.swiper-wrapper {

		align-items: center;
	}

	@media (min-width: 1300px) {
		width:calc(50vw + 660px) !important;
		margin-right: 0 !important;
	}

	.swiper-slide {

		text-align: center;

		img {
			width: auto;
			max-height: 40px;
			max-width: 90%;
			object-fit: contain;
		}
	}
} */

.sc-logos-bg-grijs {

	background-image: url('assets/img/grijs.svg'), linear-gradient(to right, white 50%, var(--grijs) 50%);
	background-repeat: no-repeat;
	background-position: top left;

	@media (min-width: 1300px) {
		background-size: contain;
	}
	@media (max-width:1299px) {
		background-size: cover;
	}
}

@media (min-width: 1025px) {

	.sc-mansory-gallery .elementor-gallery__container  > div:nth-of-type(2n-1) {

		margin-top:-30px;
	}

	.sc-mansory-gallery-left .elementor-gallery__container  > div:nth-of-type(2n),
	.sc-sector-mansory-gallery .elementor-gallery__container  > div:nth-of-type(2n) {

		margin-top:-30px;
	}
}

/**
* Home
*/

.sc-home-zo-werken-wij {

	@media (min-width: 768px) {

		&:after {

			content:'';
			background:var(--grijs);
			position:absolute;
			top:-80px;
			height: 600px;
			width: 180%;
			left: 0;
			z-index: 0;
		}
	}
}

/**
* Menu
*/
.sc-menu-item-vacatures {

	background-color: var(--groen);
	border: 1px solid var(--groen);
	border-radius: 50px;
	color: var(--wit);
	font-size: 16px;
	margin-top: 10px;
	transition: all 0.3s ease;
	align-items: center;
	display: flex !important;
	justify-content: center;

	@media (min-width:1025px) {

		padding: 8px 16px !important;
	}
	@media (max-width:1024px) {

		padding: 1px 16px !important;
		margin-top: 20px !important;
	}

	&:before {

		content:'';
		background-image: url(assets/img/chevron-right.svg);
		width:15px;
		height: 15px;
		border: 1px solid var(--groen);
		border-radius: 15px;
	}

	&:hover:before {
		background-color: var(--groen);
		border-radius: 15px;
	}

	&:hover {
		background-color: var(--wit);
	}

	a {
		margin-inline: 8px !important;
	}

	a:hover {
		color: var(--groen) !important;
	}
}

.sc-menu-item-offerte {

	background-color: var(--oranje);
	border: 1px solid var(--oranje);
	border-radius: 50px;
	color: var(--wit);
	font-size: 16px;
	transition: all 0.3s ease;
	align-items: center;
	display: flex !important;
	justify-content: center;

	@media (min-width:1025px) {

		padding: 8px 16px !important;
	}
	@media (max-width:1024px) {

		padding: 1px 16px !important;
		margin-top: 20px !important;
	}
	@media (min-width: 768px) {
		margin-left: 20px !important;
	}

	&:before {

		content:'';
		background-image: url(assets/img/chevron-right.svg);
		width:15px;
		height: 15px;
		border: 1px solid var(--oranje);
		border-radius: 15px;
	}

	&:hover:before {
		background-color: var(--oranje);
		border-radius: 15px;
	}

	&:hover {
		background-color: var(--wit);
	}

	a {
		margin-inline: 8px !important;
	}

	a:hover {
		color: var(--oranje) !important;
	}
}

/**
* Footer
*/
@media (max-width: 479px) {
	footer .elementor-image-gallery .gallery.gallery-columns-3 .gallery-item {
		width: 33.3333% !important;
	}
}

input[type="file"] {

	background-color: transparent !important;
	border-radius: 0 !important;
} 