@charset "utf-8";
/* CSS Document */

/* Basis */
html {
	font-family:brother-1816,sans-serif;
	color:#3e4b4c;
}

body {
	background:url("../art/Main-BG.png") no-repeat;
	background-size:contain;
	background-color:#e1dcdb;
	margin:0;
	padding:0;
}

h1 {
	font-size:1.5em;
	font-weight:900;
	margin-bottom:1.65em;
}

h2 {
	font-size:1.15em;
	font-weight:900;
	margin-bottom:1em;
	color:#e94e1b;
}

p {
	line-height:1.75em;
}

img {
	margin:0;
	padding:0;
	display:block;
}

.content-wrapper {
	width:75%;
	margin:12% auto 0 auto;
}

.content {
	min-height:30em;
	margin:7em auto 0 auto;
	padding:0 10em;
	display:block;
}


/* Splash pagina */

.splash-intro-tekst{
	margin-left:16%;
}

.woordtype {
	margin:auto auto 5em auto;
	width:85%;
	/*background:url("../art/Woordtype-Main.svg") no-repeat;
	background-size:contain;*/
}

.tekstblok-intro {
	width:46%;
	padding:1em 0em 1em 3em;
	margin-left:auto;
	border-left-style:dotted;
	border-color:#9d9e9f;
	font-size:1.15em;
	font-weight:100;
}


/* Specs */

.tekstblok-specs {
	width:27%;
	padding:7em 0 1em 0em;
	margin:2.5% 3% 5% 3%;
	display:inline-block;
	text-align:top;
	vertical-align:top;
}

.tekstblok-specs {
	scale:.8;opacity:0;
	animation:fade-in ease-in 2s forwards;
	animation-timeline:view();
	animation-range:150px 500px;
}

@keyframes fade-in{
	to {scale:1;opacity:1;}
}

.a {
	background:url("../art/Icoon-1-Illustratie.svg") no-repeat;
	background-size:7em;
}

.b {
	background:url("../art/Icoon-2-Promo.svg") no-repeat;
	background-size:7em;
}

.c {
	background:url("../art/Icoon-3-Styling.svg") no-repeat;
	background-size:7em;
}

.d {
	background:url("../art/Icoon-4-Gelegenheid.svg") no-repeat;
	background-size:7em;
}

.e {
	background:url("../art/Icoon-5-Specialist.svg") no-repeat;
	background-size:7em;
}

.f {
	background:url("../art/Icoon-6-Copywriting.svg") no-repeat;
	background-size:7em;
}

.g {
	background:url("../art/Icoon-7-Media.svg") no-repeat;
	background-size:7em;
}

.h {
	background:url("../art/Icoon-8-EHBEP.svg") no-repeat;
	background-size:7em;
}


/* Tekstblokken onder specs */

.tekstblok-onder-wrapper {
	vertical-align:top;
}

.tekstblok-onder {
	width:41%;
	height:100%;
	padding:1.5em 0;
	margin-bottom:0;
	display:inline-block;
	vertical-align:top;
}

.tekstblok-onder a {
	color:#e94e1b;
	text-decoration:none;
}

.onder-rechts {
	margin-left:10%;
	padding: 1em 0 1em 3em;
	border-left-style:dotted;
	border-color:#9d9e9f;
}

.tekstblok-onder {
	scale:.8;opacity:0;
	animation:fade-in ease-in 2s forwards;
	animation-timeline:view();
	animation-range:150px 500px;
}

@keyframes fade-in{
	to {scale:1;opacity:1;}
}


/* Footer*/

.footer {
	min-height:125px;
	background-color:#192121;
	padding-left:20%;
	margin-top:0;
}

.footer-logo {
	min-width:250px;
	min-height:5em;
	background:url("../art/Footer_Logo.svg") no-repeat;
	background-size:contain;
	margin-bottom:3em;
}

.footer-block {
	display:inline-block;
	vertical-align:top;
}

.footer p {
	font-size:0.9em;
	line-height:1.4em;
	text-transform:uppercase;
	text-decoration:none;
	color:#e94e1b;
	display:inline-block;
	margin:0.20em 0 0.75em 3em;
}

.footer a {
	text-decoration:none;
	color:#e94e1b;
}

.socials {
	margin:0.65em 3em 0 3em;
}

.social {
	width:2em;
	height:2em;
	display:inline-block;
	background:contain;
	margin-right:0.5em;
}

.fb {
	background:url("../art/Footer_Socials_FB.svg") no-repeat;
}

.x {
	background:url("../art/Footer_Socials_X.svg") no-repeat;
}

.ig {
	background:url("../art/Footer_Socials_IG.svg") no-repeat;
}

.li {
	background:url("../art/Footer_Socials_LI.svg") no-repeat;
}

.tt {
	background:url("../art/Footer_Socials_TT.svg") no-repeat;
}


/*Kleinere schermen*/

@media screen and (min-width: 1500px) and (max-width: 1920px) {
	h1 {
		font-size:1.35em;
		font-weight:900;
		margin-bottom:1em;
	}
	
	p {
		font-size:1.0em;
		line-height:1.85em;
	}
	
	.content {
		padding:0 5em;
	}
	
	.woordtype {
		width:85%;
		height:15vh;
		/*background:url("../art/Woordtype-Main.svg") no-repeat;
		background-size:contain;*/
	}
	
	.tekstblok-intro {
		width:45%;
		font-size:1.075em;
		margin-bottom:3%;
	}
	
	.splash-intro-tekst{
		margin-left:18%;
	}
	
	.tekstblok-specs {
		width:27%;
		padding:7em 0 1em 0em;
		margin:2.5% 3% 5% 3%;
	}

	.footer {
		padding-left:17%;
	}

	.footer p {
		text-transform:uppercase;
		text-decoration:none;
		color:#e94e1b;
		margin:0em 0 1em 3.9em;
		display:inline-block;
	}

	.socials {
		margin:0.65em 3em 0 3em;
		display:inline-block;
	}
	
}


/* @media screen and (min-width: 920px) and (max-width: 1480px) {
	
	h1 {
		font-size:1.35em;
		font-weight:900;
		margin-bottom:1em;
	}
	
	p {
		font-size:1.25em;
		line-height:2em;
	}

	.content-wrapper {
		width:90%;
		margin-top:40%;
		padding:0;
	}
	
	.content{
		min-height:12em;
		padding:0;
	}
	
	.woordtype {
		width:100%;
		height:200px;
		background:url("../art/Woordtype-Main.svg") no-repeat;
		background-size:contain;
	}
	
	.woordtype video {
		display:none;
	}
	
	.splash-intro-tekst{
		margin-left:15%;
	}
	
	.tekstblok-intro {
		width:80%;
		margin-left:auto;
		padding:0;
		font-size:1.075em;
		border-style:none;
	}
	
	.tekstblok-specs {
		width:42%;
		padding:7em 0 1em 0em;
		margin:2.5% 3% 5% 3%;
	}
	
	.tekstblok-onder{
		margin-bottom:8%;
	}

	.footer {
		padding-left:12%;
		padding-right:20px;
	}

	.footer-logo {
		height:50px;
		margin-bottom:0;
	}
	
	.footer p {
		text-transform:uppercase;
		text-decoration:none;
		color:#e94e1b;
		margin:0em 0 1em 3.9em;
	}

	.socials {
		margin:1.25em 3em 3em 3.9em;
		display:inline-block;
	}
}

@media screen and (min-width: 780px) and (max-width: 920px) {
	
	h1 {
		font-size:1.35em;
		font-weight:900;
		margin-bottom:1em;
	}
	
	p {
		font-size:1.25em;
		line-height:2em;
	}

	.content-wrapper {
		width:90%;
		margin-top:40%;
		padding:0;
	}
	
	.content{
		min-height:12em;
		padding:0;
	}
		
	.woordtype {
		width:100%;
		height:150px;
		background:url("../art/Woordtype-Main.svg") no-repeat;
		background-size:contain;
	}
	
	.woordtype video {
		display:none;
	}
	
	.splash-intro-tekst{
		margin-left:18%;
	}
	
	.tekstblok-intro {
		width:80%;
		margin-left:auto;
		padding:0;
		font-size:1.075em;
		border-style:none;
	}
	
	.tekstblok-specs {
		width:42%;
		padding:7em 0 1em 0em;
		margin:2.5% 3% 5% 3%;
	}
	
	.tekstblok-onder {
		width:100%;
		margin-bottom:3em;
		border-style:none;
	}
	
	.onder-rechts {
		margin-left:0;
		padding-left:0;
	}
	
	.footer {
		padding-left:12%;
		padding-right:20px;
	}
	
	.footer-logo {
		height:50px;
		margin-bottom:0;
	}
	
	.footer-logo {
		height:50px;
		margin-bottom:0;
	}
	
	.footer p {
		text-transform:uppercase;
		text-decoration:none;
		color:#e94e1b;
		margin:0em 0 1em 3.9em;
	}

	.socials {
		margin:1.25em 3em 3em 3.9em;
		display:inline-block;
	}
}


@media screen and (min-width: 540px) and (max-width: 780px) {
	h1 {
		font-size:1.25em;
		font-weight:900;
		margin-bottom:1em;
	}
	
	h2 {
		font-size:1.05em;
		font-weight:900;
		margin-bottom:1em;
		color:#e94e1b;
	}
	
	p {
		font-size:1em;
		line-height:2em;
	}
	
	.content-wrapper {
		width:90%;
		margin-top:45%;
		padding:0;
	}
	
	.content {
		padding:0 3em;
		min-height:15em;
	}
	
	.woordtype {
		width:85%;
		height:125px;
		background:url("../art/Woordtype-Main.svg") no-repeat;
		background-size:contain;
	}
	
	.woordtype video {
		display:none;
	}
	
	.splash-intro-tekst {
		font-size:0.85em;
	}
	
	.tekstblok-intro {
		width:100%;
		margin-left:0;
		padding:0;
		border-left-style:none;
	}
	
	.tekstblok-specs {
		width:100%;
		margin:2em 0;
		padding:8em 0 0 0;
		border-left-style:none;
	}
	
	.tekstblok-onder {
		width:100%;
		margin-bottom:3em;
	}
	
	.onder-rechts {
		margin-left:0;
		padding:0 0 3em 0;
		border-left-style:none;
	}
	
	.footer {
		padding-left:12%;
		padding-right:20px;
	}
	
	.footer-block {
		display:inline-block;
		vertical-align:top;
		margin-bottom:1em;
	}
	
	.footer-logo {
		min-width:250px;
		min-height:5em;
		background:url("../art/Footer_Logo.svg") no-repeat;
		background-size:contain;
		margin-top:2em;
	}

	.footer p {
		text-transform:uppercase;
		text-decoration:none;
		color:#e94e1b;
		margin:0em 0 1em 3.9em;
		display:inline-block;
	}

	.socials {
		margin:0em 3em 3em 3.9em;
	}

}


@media screen and (max-width: 540px) {
	h1 {
		font-size:1.15em;
		font-weight:900;
		margin-bottom:1em;
	}
	
	h2 {
		font-size:1.05em;
		font-weight:900;
		margin-bottom:1em;
		color:#e94e1b;
	}
	
	p {
		font-size:1em;
		line-height:2em;
	}
	
	.content-wrapper {
		width:90%;
		margin-top:50%;
		padding:0;
	}
	
	.content {
		padding:0 3em;
	}
	
	.woordtype {
		width:80%;
		height:100px;
		background:url("../art/Woordtype-Main.svg") no-repeat;
		background-size:contain;
	}
	
	.woordtype video {
		display:none;
	}
	
	.splash-intro-tekst {
		font-size:0.85em;
	}
	
	.tekstblok-intro {
		width:100%;
		margin-left:0;
		padding:0;
		border-left-style:none;
	}
	
	.tekstblok-specs {
		width:100%;
		margin:2em 0;
		padding:8em 0 0 0;
		border-left-style:none;
	}
	
	.tekstblok-onder {
		width:100%;
		margin-bottom:3em;
	}
	
	.onder-rechts {
		margin-left:0;
		padding:0 0 3em 0;
		border-left-style:none;
	}
	
	.footer {
		padding-left:12%;
		padding-right:20px;
	}
	
	.footer-block {
		display:inline-block;
		vertical-align:top;
		margin-bottom:1em;
	}
	
	.footer-logo {
		min-width:250px;
		min-height:5em;
		background:url("../art/Footer_Logo.svg") no-repeat;
		background-size:contain;
		margin-top:2em;
	}

	.footer p {
		text-transform:uppercase;
		text-decoration:none;
		color:#e94e1b;
		margin:0em 0 1em 3.9em;
	}

	.socials {
		margin:0em 3em 3em 3.9em;
	}

} */



@media screen and (min-width: 840px) and (max-width: 1500px) {
	
	h1 {
		font-size:1.5em;
		font-weight:900;
		margin-bottom:1em;
	}
	
	h2 {
		font-size:1.50em;
		font-weight:900;
		margin-bottom:1em;
		color:#e94e1b;
	}
	
	p {
		font-size:1.15em;
		line-height:1.85em;
	}
	
	.content-wrapper {
		width:90%;
		margin-top:40%;
		padding:0;
	}
	
	.content {
		padding:0 3em;
	}
	
	.woordtype {
		width:90%;
		height:11em;
		margin-bottom:10%;
		/*background:url("../art/Woordtype-Main.svg") no-repeat;
		background-size:contain;*/
	}
	
	/*.woordtype video {
		display:none;
	}*/
	
	.splash-intro-tekst {
		font-size:1.35em;
		margin-left:13%;
	}
	
	.tekstblok-intro {
		width:100%;
		margin-top:15%;
		margin-left:0;
		padding:0;
		border-left-style:none;
		font-size:1.2em!important;
		line-height:1.6em!important;
	}
	
	
	.tekstblok-specs {
		width:75%;
		margin:2em 0;
		padding:0 2em 0 9em;
		border-left-style:none;
		font-size:1.15rem;
		line-height:1.85em;
	}
	
	.tekstblok-specs p {
		font-size:1.15em;
		line-height:1.85em;
	}
	
	.tekstblok-onder {
		width:100%;
		margin-bottom:3em;
		font-size:1.35em;
		line-height:1.5em;
	}
	
	.tekstblok-onder p {
		font-size:1.35em;
		line-height:1.50em;
	}
	
	.onder-rechts {
		margin-left:0;
		padding:0 0 3em 0;
		border-left-style:none;
	}
	
	.footer {
		padding-left:12%;
		padding-right:20px;
	}
	
	.footer-block {
		display:inline-block;
		vertical-align:top;
		margin-bottom:1em;
		
	}
	
	.footer-logo {
		min-width:250px;
		min-height:5em;
		background:url("../art/Footer_Logo.svg") no-repeat;
		background-size:contain;
		margin-top:2em;
	}

	.footer p {
		text-transform:uppercase;
		text-decoration:none;
		color:#e94e1b;
		margin:0em 0 1em 3.9em;
		font-size:1.05em;
		line-height:1.25em;
	}

	.socials {
		margin:0em 3em 3em 3.9em;
	}

}



@media screen and (max-width: 840px) {
	
	h1 {
		font-size:1.75em;
		font-weight:900;
		margin-bottom:1em;
	}
	
	h2 {
		font-size:1.5em;
		font-weight:900;
		margin-bottom:1em;
		color:#e94e1b;
	}
	
	p {
		font-size:1.15em;
		line-height:1.85em;
	}
	
	.content-wrapper {
		width:90%;
		margin-top:40%;
		padding:0;
	}
	
	.content {
		padding:0 3em;
	}
	
	.woordtype {
		width:90%;
		height:11em;
		/*background:url("../art/Woordtype-Main.svg") no-repeat;
		background-size:contain;*/
	}
	
	/*.woordtype video {
		display:none;
	}*/
	
	.splash-intro-tekst {
		font-size:1.5em;
		margin-left:13%;
	}
	
	.tekstblok-intro {
		width:100%;
		margin-top:15%;
		margin-left:0;
		padding:0;
		border-left-style:none;
		font-size:1.2em!important;
		line-height:1.6em!important;
	}
	
	.tekstblok-specs {
		width:100%;
		margin:2em 0;
		padding:8em 0 0 0;
		border-left-style:none;
		font-size:1.15em;
		line-height:1.85em;
	}
	
	.tekstblok-specs p {
		font-size:1.15em;
		line-height:1.85em;
	}
	
	.tekstblok-onder {
		width:100%;
		margin-bottom:3em;
		font-size:1.15em;
		line-height:1.85em;
	}
	
	.tekstblok-onder p {
		font-size:1.15em;
		line-height:1.85em;
	}
	
	.onder-rechts {
		margin-left:0;
		padding:0 0 3em 0;
		border-left-style:none;
	}
	
	.footer {
		padding-left:12%;
		padding-right:20px;
	}
	
	.footer-block {
		display:inline-block;
		vertical-align:top;
		margin-bottom:1em;
		
	}
	
	.footer-logo {
		min-width:250px;
		min-height:5em;
		background:url("../art/Footer_Logo.svg") no-repeat;
		background-size:contain;
		margin-top:2em;
	}

	.footer p {
		text-transform:uppercase;
		text-decoration:none;
		color:#e94e1b;
		margin:0em 0 1em 3.9em;
		font-size:1.05em;
		line-height:1.25em;
	}

	.socials {
		margin:0em 3em 3em 3.9em;
	}

}