/*
 Theme Name:   Mediakanjers
 Theme URI:    http://www.mediakanjers.nl
 Description:  MKTheme Child Theme
 Author:       Mediakanjers
 Author URI:   http://www.mediakanjers.nl
 Template:     MKTheme
 Version:      1.7.0
 Text Domain:  MKTheme-child
*/

.video-container {
	position:relative;
	padding-bottom:56.25%;
	padding-top: 5px;
	height:0;
	overflow:hidden;
}

.video-container iframe, .video-container object, .video-container embed {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

.mk_mobile_menu ul li { float: left; margin: 0 5%; }
.mk_mobile_menu ul > li > ul.sub-menu { padding-bottom: 20px; }
.mk_mobile_menu ul > li > ul.sub-menu > li > a { font-size: 18px; padding: 6px 15px 6px 15px; } 
.mk_mobile_menu ul > li > ul.sub-menu > li > a:hover { background-color: #9bbd8b; }
.mk_mobile_menu::after { opacity: 0.2; z-index: -11; }

/* menu */
.blur { position: fixed; height: 100vw; width: 100vw; background: rgba(32, 32, 32, 0.8); left: 0px; top: 280px; z-index: 999; display: none; transition: 0.3s; }
.blur.active { transition: 0.3s; display: block; }

.mk_menu ul > li a.active { color: #252E5E; }
.mk_menu ul > li > a.active::before { bottom: 100%; transition: 0.3s; background-color: #252E5E; animation: widthanimation 2s infinite ease-in-out; }

.mk_menu ul > li > ul.sub-menu {padding: 0px; border-radius: 0px!important; box-shadow: 0px 6px 10px 0px #252E5E; position: fixed; z-index: 99; width: 100%; height: fit-content; text-align: left; left: 50%; top: 170px; transform: translate(-50%, 0%)!important; background-color: white; display: none;}
.mk_menu ul > li > ul.sub-menu.active {opacity: 1; visibility: visible; display: flex; flex-direction: column; justify-content: center; }
.mk_menu ul > li > ul.sub-menu > li > a { display: block; padding: 10px 10px; background-color: #fff; pointer-events:visible; margin: 10px;}
.mk_menu ul > li > ul.sub-menu > li > a:hover { background-color: #eee; }

.mk_menu ul > li > ul.sub-menu .inner { width: 1200px; max-width: 80%; margin: 0px auto; display: flex; justify-content: end; position: relative; padding: 30px; overflow: hidden; }
.mk_menu ul > li > ul.sub-menu .kolom { display: inline-block; width: 25%; vertical-align: top;}
.mk_menu ul > li > ul.sub-menu .kolom li { padding: 10px 15px; width: fit-content;}
.mk_menu ul > li > ul.sub-menu .kolom li a { color: black; transition: 0.3s; padding: 10px 15px; border-radius: 30px; }
.mk_menu ul > li > ul.sub-menu .kolom li a:hover { color: white; background-color: #9BBD8B; }

.zwanger-worden { transition: 1s; }
.zwanger-worden::before { content: url('images/ik-wil-zwanger-worden.svg'); width: 500px; max-width: 80%; position: absolute; left: 0%; bottom: -10px; transition: 1s; animation: easein 1s ease-in-out; }
.ben-zwanger { transition: 1s; }
.ben-zwanger::before { content: url('images/ik-ben-zwanger.svg'); width: 500px; max-width: 80%; position: absolute; left: 0%; bottom: -10px; transform: translate(-0%,-0%); transition: 1s; animation: easein 1s ease-in-out; }
.ga-bevallen { transition: 1s; }
.ga-bevallen::before { content: url('images/ik-ga-bevallen.svg'); width: 500px; max-width: 80%; position: absolute; left: 0%; bottom: -10px; transform: translate(-0%,-0%); transition: 1s; animation: easein 1s ease-in-out; }
.ben-bevallen { transition: 1s; }
.ben-bevallen::before { content: url('images/ik-ben-kraamvrouw.svg'); width: 500px; max-width: 80%; position: absolute; left: 0%; bottom: -10px; transform: translate(-0%,-0%); transition: 1s; animation: easein 1s ease-in-out; }
.voeding-baby { transition: 1s; }
.voeding-baby::before { content: url('images/borst-flesvoeding.svg'); width: 500px; max-width: 80%; position: absolute; left: 0%; bottom: -10px; transform: translate(-0%,-0%); transition: 1s; animation: easein 1s ease-in-out; }
.links-info { transition: 1s; }
.links-info::before { content: url('images/Links-informatiebronnen.svg'); width: 500px; max-width: 80%; position: absolute; left: 0%; bottom: -10px; transform: translate(-0%,-0%); transition: 1s; animation: easein 1s ease-in-out; }
.voorlichting { transition: 1s; }
.voorlichting::before { content: url('images/Voorlichting.svg'); width: 500px; max-width: 80%; position: absolute; left: 0%; bottom: -10px; transform: translate(-0%,-0%); transition: 1s; animation: easein 1s ease-in-out; }

/* darkmode menu */
.darkmode .mk_menu ul > li > ul.sub-menu { background-color: #0c0c0c; }
.darkmode .mk_menu ul > li > ul.sub-menu .kolom li a:hover { color: white!important; }


@keyframes easein { 0% { opacity: 0; } 100% { opacity: 1; }}

.mk_menu ul > li > ul.sub-menu.active {
    display: flex;
    flex-direction: column;
    justify-content: center;
}


/* SKB RONDLEIDING PAGINA */
.skb-rondleiding .mk_rij .mk_kolom.mk_kolom_1.mk_kolom_1_1 {
	position: relative;
	overflow: hidden;
	width: 100%;
	padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}

.skb-rondleiding .mk_rij .mk_kolom.mk_kolom_1.mk_kolom_1_1 iframe {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	width: 100%;
	height: 100%;
}