/* 
Theme Name: Olympia Talent Cup
Theme URI: https://www.olympiatalentcup.nl
Author: Buro Wild - Ongetemde Merkjagers
Author URI: https://burowild.nl
Description: Custom Wordpress theme/template
Version: 1.0 
*/

.grid-container {
max-width: 82rem;
}

h1, h2, h3, h4, h5, h5{
	font-family: "aleo", sans-serif;
	font-weight: 800;
}

h1{
	line-height: 45px;
}

h3{
	line-height: 35px;
}

h4{
	line-height: 30px;
}

p, li{
	font-family: "open-sans", sans-serif;
	font-weight: 500;
	line-height: 30px;
}

.label{
	color: #E75013;
	background: white;
	padding: 5px 10px;
	border-radius: 50px;
	margin-bottom: 10px;
	font-weight: 500 !important;

}

a{
	color: #E75013;
}

strong{
	font-weight: 800;
}

.img, iframe{
	border-radius: 20px;
}

iframe{
	width: 100%;
}

.btn{
	border-radius: 50px;
	width: 42px;
	height: 42px;
	position: absolute;
	bottom: 30px;
	right: 30px;
	background: white;
	color: #E75013;
	text-align: center;
	padding-top: 13px;
	transition: 0.5s;
}
.btn i{
	color: #E75013;
	transition: 0.5s;
}

.btn:hover{
	transition: 0.5s;
	background: #27348B;
}

.btn:hover i{
	color: white !important;
	transition: 0.5s;
}

.button, input[type=submit], button{
	text-transform: lowercase;
	font-family: "aleo", sans-serif !important;
	border-radius: 50px;
	font-weight: bold;
	padding: 12px 15px;
	border: none;
	background: #E75013;
	color: white;
	font-weight: 800;
	margin-bottom: 
}

input{
	border-radius: 100px !important;
	font-family: "open-sans", sans-serif !important;
	padding: 15px !important;
}

select{
	border-radius: 100px !important;
	font-family: "open-sans", sans-serif !important;
	padding-left: 15px !important;
}

textarea{
	border-radius: 20px;
	font-family: "open-sans", sans-serif !important;
	padding: 15px !important;
}

.button::after{
	font-family: "Font Awesome 6 Pro";
	font-weight: 900; /* nodig voor solid icons */
	content: "\f330"; /* unicode van het icoon, hier: pijl naar rechts */
	display: inline-block;
	margin-left: 5px; /* beetje ruimte tussen tekst en icoon */
	color: white;
	width: 15px;
	transition: 0.5s !important;
}

.button.white::after{
	color: #E75013;
}

.button.white{
	background: white;
	color: #E75013;
}

.button.white:hover{
	background: #27348B;
	color: white;
}

.button.white:hover::after{
	color: white !important;
	transition: 0.5s !important;
}



.button.blue::after{
	color: white;
}

.button.blue{
	background: #27348B;
	color: white;
}

.button.white:hover{
	background: #27348B;
	color: white;
}

.button:hover{
	background: #27348B;
}

.openmenu{
	top: 30px;
	right: 30px;
	background: white !important;
	width: 50px;
	height: 50px;
	position: fixed !important;
	border-radius: 50px;
	font-size: 20px;
	padding-top: 15px;
	transition: 0.5s;
	z-index: 5;
}

.openmenu:hover, .homebtn:hover{
	background: #E75013 !important;
	color: white !important;
	transition: 0.5s;
}

.homebtn{
	width: 50px;
	height: 50px;
	border-radius: 50px;
	top: 30px !important;
	left: 30px !important;
	background: white;
	color: #E75013;
	position: absolute;
	font-size: 20px;
	padding-top: 15px;
}

#menuoverlay{
	position: fixed;
	height: 100vh;
	width: 100%;
	background: linear-gradient(45deg, rgba(39, 52, 138, 1) 0%, rgba(231, 80, 19, 1) 100%);
	top: 0px;
	padding-top: 100px;
	display: none;
}

#menuoverlay.open{
	display: block !important;
}

#menuoverlay ul li a{
	color: white;
	font-family: "aleo", sans-serif;
	font-weight: 800;
	font-size: 26px;
	line-height: 30px;
}

#menuoverlay ul li a:hover{
	opacity: 0.5;
}

#menuoverlay ul li{
	list-style: none;
	color: white;
}

.menu .active > a{
	background: none !important;
	color: #E75013 !important;
}

#menu{
	position: fixed;
	width: 100%;
	padding-top: 50px;
	z-index: 5;
}

.dropdown.menu > li.is-dropdown-submenu-parent > a::after {
border-color: #E75013 transparent transparent;
}

.top-bar, .top-bar ul{
	background-color: white;
}

.top-bar{
	padding: 0px !important;
}
ul.submenu{
	background: #27348B;
	border-radius: 10px;
	color: white !important;
	border: none;
	padding: 10px !important;
}

ul.submenu li a{
	color: white !important;
}

ul.submenu li a:hover{
	color: #E75013 !important;
}

#menu-mobiele-menu li{
	width: 100% !important;
}

#navbar{
	min-height: 60px;
	background: white;
	border-radius: 100px;
	box-shadow: 0px 10px 15px -3px rgba(0,0,0,0.1);
	padding: 25px 20px 20px 85px;
	font-size: 15px;
	position: relative;
}

#navbar ul{
	margin: 0;
	float: right;
}

#navbar li{
	float: left;
	list-style: none;
	font-family: "aleo", sans-serif;
	margin-right: 0px;
}

#navbar li a{
	color: #27348A;
	font-weight: 800;
	display: table-cell;
}

#navbar li a:hover{
	color: #E75013;
}

.navbal{
	width: 40px;
	position: absolute;
	left: 20px;
	

	  top: 0;
	  bottom: 0;
	  margin: auto 0;
}

#mainlogo{
	margin-bottom: 100px;
}

#date{
	margin-bottom: 100px;
}

#headersmall{
	background-size: cover !important;
	background-position: center center !important;
	min-height: auto;
	padding-top: 200px;
	padding-bottom: 200px;
	color: white;
}

#header{
	position: relative;
	background: #27348A;
	background:  linear-gradient(45deg, rgba(39, 52, 138, 1) 0%, rgba(231, 80, 19, 1) 100%);
	min-height: auto;
	padding-top: 200px;
	padding-bottom: 150px;
	color: white;
	overflow: hidden;
}

#header video{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.headeroverlay{
	background: linear-gradient(90deg, rgba(39, 52, 139, 0.7) 0%, rgba(230, 79, 33, 0.7) 100%);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#deelnemers{

	min-height: 200px;
	background: white;
	position: relative;
}

.item{
	width: 150px;
	height: 150px;
	background: black;
	border-radius: 100px;
	position: relative;
}

.item img{
	position: absolute;
	max-width: 80px !important;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.owl-deelnemers .owl-item:nth-child(odd) .item{
	background: #FCEDE8;
}

.owl-deelnemers .owl-item:nth-child(even) .item{
	background: #E9EBF3;
}


.contentwhite{
	color: #27348B;
	background: white;
	min-height: auto;
	padding-top: 100px;
	padding-bottom: 100px;
}

.contentblue{
	color: #27348B;
	background: #E9EBF3;
	min-height: auto;
	padding-top: 100px;
	padding-bottom: 100px;
}

.contentorange{
	color: #27348B;
	background: #FCEDE9;
	min-height: auto;
	padding-top: 100px;
	padding-bottom: 100px;
}


#intro.contentwhite{
	padding-top: 0px !important;
	padding-bottom: 0px !important;
}


#intro .grid-container{
	background: url("img/BAL_BLAUW_5.svg");
	background-repeat: no-repeat;
	background-position: right;
	background-size: contain;
	padding-top: 100px;
	padding-bottom: 100px;
}

.blokgradient{
	border-radius: 30px;
	background: url('img/BAL_WIT_10.svg'), linear-gradient(45deg, rgba(39, 52, 138, 1) 0%, rgba(231, 80, 19, 1) 100%);
	background-size: 75%, cover;
	background-position: bottom -130px right -100px, center;
	background-repeat: no-repeat;
	color: white;
	padding: 50px !important;
}

.blokgradient .button{
	margin-bottom: 0px;
}

.blokimg{
	padding: 50px !important;
	border-radius: 30px;
	background-size: cover !important;
	background-position: center !important;
	position: relative;
	min-height: 450px;
}

.blokimg.nieuwsitem h4{
	color: white;
	position: absolute;
	bottom: 30px;
	left: 30px;
	margin-bottom: 0px;
}

.owl-theme .owl-nav{
	margin-top: 20px;
	float: left;
	position: absolute;
}

.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot{
	background: #E75013;
	width: 40px;
	height: 40px;
	border-radius: 100px;
	color: white;
}

.blokimg a h3{
	color: white !important;
}

.blokimg a h4{
	color: white !important;
	margin-bottom: 0px;
}

.blokwit{
	border-radius: 30px;
	background: white;
	min-height: 300px;
	color: white;
}

.blokwit img{
	border-radius: 30px;
}

.tekstoverlay{
	position: absolute;
	width: 100%;
	bottom: 0px;
	left: 0px;
	color: white;
	padding-left: 30px;
	padding-bottom: 30px;
	padding-right: 50px;
}

.tekstoverlay p{margin-bottom: 0px;}

.owl-sponsoren .owl-item:nth-child(odd) .item{
	background: white;
}

.owl-sponsoren .owl-item:nth-child(even) .item{
	background: white;
}

.pakket{
	border-radius: 30px;
	background: black;
	min-height: 300px;
	color: white;
	padding: 50px;
}

.pakket p{
	margin-bottom: 0px;
}

.galerij{
	padding-top: 200px;
	min-height:100vh;
}

.contactbg{
	min-height: 100vh !important;
}

.contactbg ul{
	margin-left: 0px;
	list-style: none;
}




#footer{
	padding-top: 50px;
	padding-bottom: 50px;
	color: #27348B; 
	
}

/* Small only */
@media screen and (max-width: 39.9375em) {
	
	h1{
		font-size: 40px;
	}
	
	h2{
		font-size: 30px;
	}
	
	h3{
		line-height: 25px;
	}
	
	#header{
		padding-top: 120px;
		padding-bottom: 50px;
	}
	
	#headersmall{
		padding-top: 100px;
		padding-bottom: 50px;
	}
	
	.headeroverlay{
		background:  url('img/BAL_WIT_10.svg'), linear-gradient(45deg, rgba(105, 116, 173, 1) 0%, rgba(237, 132, 103, 1) 100%);
		background-size: cover;
		background-position: bottom -200px, left;
	}
	
	#mainlogo, #date{
		margin-bottom: 50px;
	}
	
	#header img{
		width: 75%;
	}
	
	.contentwhite, .contentblue{
		padding-top: 50px;
		padding-bottom: 50px;
	}
	
	#intro{
		position: relative;
	}
	
	#intro .grid-container{
		padding-top: 50px;
		padding-bottom: 50px;
	}
	
	.blokgradient{
		padding: 30px !important;
	}
	
	.contenttekst{
		margin-bottom: 50px;
	}
	
	.galerij{
		padding-top: 100px;
	}
	
	.blokimg{
		min-height: 400px;
	}
	
	#contactdetails{
		margin-top: 50px;
	}
	
	
}

/* Medium and up */
@media screen and (min-width: 40em) {}

/* Medium only */
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
	.contentwhite, .contentblue{
		padding-top: 50px;
		padding-bottom: 50px;
	}
	
	#intro .grid-container{
		padding-top: 50px;
		padding-bottom: 50px;
	}
	
	#headersmall{
		padding-top: 150px;
		padding-bottom: 50px;
	}
	
	.galerij{
		padding-top: 150px;
	}
	
	#contactdetails{
		margin-top: 50px;
	}
	
}

/* Large and up */
@media screen and (min-width: 64em) {}

/* Large only */
@media screen and (min-width: 64em) and (max-width: 74.9375em) {}