/* CSS Document */
html{
	width: 100%;
	height: 100%;
	max-height: 100%;
	overflow-x: hidden;
}

body{
	font-family: 'Ubuntu', sans-serif;
	padding:0px;
	margin:0px;
	width: 100%;
	height: 100%;
	position: relative;
	overflow-x: hidden;
}

h1, h2, h3, h4{
	font-family: 'Ubuntu', sans-serif;
	font-weight: bold;
}





.draai-scherm{
	background: #FFF url("../img/draai-horizontaal-scherm.jpg") no-repeat center center; 
	background-size: contain;
	position: fixed;
	z-index: 999;
	top:0;
	right:0;
	bottom:0;
	left:0;
	display: none;
}

@media screen 
and (orientation: portrait){
	
	.draai-scherm{
		display: block;
	}

}


.tekstkader{
	padding:0.7vw 1.7vw 1.8vw;
	color: #FFF;
	position: absolute;
	z-index: 990;
	font-size: 0.8vw;
	line-height: 1.3vw;
	opacity: 0;
}

.tekstkader h1, .tekstkader h3{
	font-size:1.2vw;
	color: #FFF;
	font-weight: bold;
}

.tekstkader h3{
	display: inline-block;
	margin-right: 1.5vw;
}

.tekstkader.intro{
	background:#d30050;
	top: 58.3%;
	left: 62.7%;
	width: 20vw;
}

.tekstkader.outro{
	background:#d30050;
	padding:0.7vw 1.7vw 1.2vw;
	top: 19.5%;
  	left: 16%;
	width: 22.5vw;
}

.titel-temp{
	position: absolute;
	z-index: 599;
	text-align: center;
	font-size: 1vw;
	background:#FFF;
	border: 0.15vw #cbcbcb solid;
	color: #0a6a9a;
	top: 2.8%;
	left: 36.3%;
	padding: 1vw 0.5vw 1.2vw;
  	width: 32.5vw;
}

.titel-outro{
	position: absolute;
	z-index: 599;
	text-align: center;
	font-size: 1.7vw;
	background:#0a6a9a;
	border-bottom: 0.2vw #00526b solid;
	color: #FFF;
	top: 3.2%;
  	left: 16%;
	padding: 1vw 0.5vw 1.2vw;
  	width: 32.5vw;
}

.tekstkader a{
	background:#0a6a9a;
	border-bottom: 0.2vw #00526b solid;
	font-weight: bold;
	color: #FFF;
	text-decoration: none;
	padding:0.4vw 0.9vw;
	margin-top: 0.2vw;
	display: inline-block;
	margin-right: 0.1vw;
}

.tekstkader a:hover{
	background:#FFF;
	color: #0a6a9a;
}


.tekstkader a .fas{
	margin-left: 0.2vw;
}



.legenda{
	background: #FFF;
	border-top:2px #b2b2b2 solid;
	position: fixed;
	width: 100%;
	bottom:0px;
	left: 0px;
	right: 0px;
	height: 3.5vw;
	z-index: 998;
	display: none;
}

@media screen 
and (-Webkit-min-device-pixel-ratio: 1.5)
and (orientation: landscape){
	.legenda{
		height: 4vw;
	}

}

.legenda-titel{
	background: #b2b2b2;
	color: #FFF;
	width: 5.1vw;
	padding: 0.4vw 0.7vw 0.5vw 1vw;
	font-size: 1.2vw;
	position: absolute;
	top: -2.3vw;
	left:2vw;
}

.legenda table{
	width: 90%;
	margin-top:0.1vw;
	margin-left: 5%;
}

@media screen 
and (-Webkit-min-device-pixel-ratio: 1.5)
and (orientation: landscape){
    .legenda table{
        width: 97%;
        margin-top:0;
        margin-left: 1%;
    }
}

.legenda .double {
    padding: 0;
    border: 0px;
}

.legenda .double table{
	width: 100%;
	margin:0;
    padding:0;
    border:none;
}

.legenda .double table tbody{
    display: table;
    width: 100%;
    margin-left:-4px;
}

.legenda .double table td{
    text-align: left;
}


.legenda-lijn{
	cursor:pointer;
}

.legenda-lijn.oranje{
	padding-left:15px;
}

.legenda-lijn.donkersteblauw,
.legenda-lijn.groen{
	width:2.4vw;
}


.legenda-lijn-blokje{
	width: 2.2vw;
	height: 0.4vw;
}

	.lichtblauw .legenda-lijn-blokje{
		background: #66acd7;
	}

	.bordeaux .legenda-lijn-blokje{
		background: #9d005d;
	}

	.roze .legenda-lijn-blokje{
		background: #ff7bab;
	}

	.donkerblauw .legenda-lijn-blokje{
		background: #0a6a9a;
	}

    .donkersteblauw .legenda-lijn-blokje{
		background: #05455E;
	}

	.groen .legenda-lijn-blokje{
		background: #8bc53f;
	}

	.oranje .legenda-lijn-blokje{
		background: #f6921e;
	}

.legenda-label{
	font-size: 0.8vw;
	cursor: pointer;
}

.legenda-label-grijs{
	font-size: 0.8vw;
	color: #b2b2b2;
}



	.legenda-label.lichtblauw{
		color: #66acd7;
	}

	.legenda-label.bordeaux{
		color: #9d005d;
	}

	.legenda-label.roze{
		color: #ff7bab;
	}

	.legenda-label.donkerblauw{
		color: #0a6a9a;
	}

    .legenda-label.donkersteblauw{
		color: #05455E;
	}


	.legenda-label.groen{
		color: #8bc53f;
	}

	.legenda-label.oranje{
		color: #f6921e;
	}

    .legenda-label.grijs{
		color: #b2b2b2;
	}


.legenda-icon{
    position: relative;
}

.legenda-icon .rondje{
    border: 0.25vw solid #b2b2b2;
    position: relative;
    width: 1.4vw;
    height: 0.7vw;
}

.legenda-icon .rondje.rondje-vierkant{
    margin-top: -22%;
    left: -6%;
}

.legenda-icon .rondje.rondje-vierkant.last{
    top: 0%;
    margin-top:4%;
    left: -24%;
    position: absolute;
}

.legenda-icon .rondje.rondje-vierkant.last#legenda-6{
    margin-top:19%;
}

.legenda-icon .rondje .rondje-checked{
    background: #b2b2b2;
}


.made-by{
	width: 100%;
	text-align: center;
  	padding-top: 20px;
}


.made-by a{
	color:#000;
	text-decoration: none;
}


.navigatie{
	position: fixed;
	top: 78.2%;
	left: 23.5%;
	width: 53vw;
	height: 3.4%;
	z-index: 900;
	display: none;
}

.navigatie-links, .navigatie-rechts{
	position: absolute;
	width: 4.8%;
	height: 120%;
	cursor: pointer;
}

.navigatie-links:hover, .navigatie-rechts:hover{
	opacity: 0.8;
}

.navigatie-links{
	top: 38%;
	left: 1%;
}

.navigatie-rechts{
	top: 38%;
	right: 1%;
}

.navigatie-bullets{
	position: absolute;
	width: 83.2%;
	height: 3.5vw;
	top: -10%;
	left: 10.6%;
}

.navigatie-lijn{
	position: absolute;
	left: 5%;
	top: 3.5vw;
	width: 37.4vw;
	height: 0.3vw;
	background:#0a6a9a;
}

	.navigatie-lijn-stippen{
		position: absolute;
		top: 98.7%;
		left: 90.9%;
		width: 7.1%;
	}

.rondje.rondje-navigatie{
	width: 4%;
	height: 22.9%;
	border: 0.35vw solid #0a6a9a;
	cursor: pointer;
	top: 84%;
}

	.rondje.rondje-navigatie.current, 
	.rondje.rondje-navigatie.hover,
	.rondje.rondje-navigatie:hover{
		border: 0.35vw solid #d30050;
	}

.label.label-navigatie{
    background: #66acd7;
    border-bottom: 0.2vw #4f95b9 solid;
	top: 26%;
	font-size: 0.7vw;
	padding: 0.9vw 0.7vw;
}

	.label.label-navigatie.current, 
	.label.label-navigatie.hover,
	.label.label-navigatie:hover{
		background: #d30050;
		border-bottom: 0.2vw #af0047 solid;
	}

.label.label-navigatie .pijltje-onder{
	background:#66acd7;
	border-bottom: 0.2vw #4f95b9 solid;
	border-right: 0.2vw #4f95b9 solid;
	left:36.5%;
}

	.label.label-navigatie.current .pijltje-onder,
	.label.label-navigatie.hover .pijltje-onder,
	.label.label-navigatie:hover .pijltje-onder{
		background:#d30050;
		border-bottom: 0.2vw #af0047 solid;
		border-right: 0.2vw #af0047 solid;
	}


.navigatielijn-current{
	position: absolute;
	top: 98.4%;
	width: 6%;
	opacity: 0;
}

	.navigatielijn-current.current,
	.navigatielijn-current.hover{
		opacity: 1;
	}

	.navigatielijn-current.last{
		position: absolute;
		top: 98.5%;
		width: 7.1%;
	}



.total-container{
	width: 675%; /* 75% * 7 = 525% */
	min-height: 100%;
	overflow-x: hidden;
	position: relative;
	background:url("../img/bg-grid.jpg") repeat;
	background-size:0.504856%; /* bij 7 slides: 0.6491 > Slide moet 22 complete wiebertjes breed zijn! */
}

.slide-container{
	width: 100%; 
	overflow: hidden;
}

.sloide{ /*TEMP*/
	width: 75%; 
	padding-top: 47.25%; 
	background:url("../img/bg-grid-compleet.jpg") repeat; 
	background-size: contain;
	opacity: 0.5;
	position: absolute;
	display: none;
	z-index: 999;
}

.slide{
	width: 11.11111%; /* 100% / 8 slides >    100%/9 slides*/ 
	padding-top: 6.976%; /* Voorheen bij 7 slides: 9%*/
	opacity: 1;
	float:left;
	position: relative;
	/*background:url("../img/bg-grid-compleet.jpg"); 
    background-size: contain;
	*/
	
}

.slide.even{
	/*background:#f5f5f5;*/
	
}



.illustratie{
	position: absolute;
	z-index: 150;
	opacity: 0;
	margin-top: 5%;
}




.tekst{
	position: absolute;
	top:0px;
	left:0px;
}




.tijdlijn-horizontaal{
	position: absolute;
	width: 800%;
	height: 0.3vw;
	background: #1481c2;
	left: 9.2%;
	top: 74.8%;
	z-index: 100;
	opacity: 0;
}

.tijdlijn-verticaal{
	position: absolute;
	top:0%;
	width: 0.5%;
	height: 74%;
	z-index: 110;
	opacity: 0;
}

.tijdlijn-label{
	position: absolute;
	color: #FFF;
	font-size: 1vw;
	padding: 0.3vw 0.5vw;
	font-weight: bold;
	background:#66acd7;
	z-index: 120;
	top: 73.4%; 
	opacity: 0;
}










.lijn{
	position: absolute;
	opacity: 0;
}


.lijn-opening{
	width: 87.2%;
	top: 12.1%;
	left: 3.9%;
}

.lijn-lichtblauw{
	width: 598.6%;
	top: 14.8%;
	left: 8.6%;
    z-index: 200;
}

.lijn-lichtblauw-2023{
	width: 695%;
	top: 14.8%;
	left: 8.6%;
    z-index: 200;
}

.lijn-lichtblauw-2025{
	width: 750%;
	top: 14.8%;
	left: 8.6%;
    z-index: 200;
}


.lijn-donkerblauw{
	width: 476.9%;
    top: 16.1%;
    left: 31.6%;
    z-index: 400;
}

.lijn-donkerblauw-2023{
	width: 571.2%;
	top: 16%;
    left: 31.6%;
    z-index: 400;
}

.lijn-donkerblauw-2025{
	width: 669.2%;
	top: 16%;
    left: 31.6%;
    z-index: 400;
}

.lijn-roze{
	width: 400.4%;
    top: 14%;
    left: 27.2%;
    z-index: 300;
}

.lijn-roze-2023{
	width: 369.6%;
	top: 18%;
    left: 27.2%;
    z-index: 300;
}


.lijn-groen{
	width: 442.1%;
    top: 12.6%;
    left: 65.3%;
    z-index: 300;
}

.lijn-groen-2023{
	width: 538.5%;
	top: 14.6%;
    left: 65.3%;
    z-index: 300;
}

.lijn-groen-2025{
	width: 621.1%;
	top: 14.9%;
    left: 65.3%;
    z-index: 300;
}

.lijn-bordeaux{
	width: 416.4%;
    top: 26.3%;
    left: 9%;
    z-index: 300;
}

.lijn-bordeaux-2023{
	width: 595.3%;
	top: 9.8%;
    left: 9%;
    z-index: 300;
}

.lijn-bordeaux-2025{
	width: 679.6%;
	top: 10%;
    left: 9%;
    z-index: 300;
}

.lijn-oranje{
	width: 398.6%;
    top: 8%;
    left: 8.6%;
    z-index: 100;
}

.lijn-oranje-2023{
	width: 500.9%;
	top: 5.9%;
    left: 8.6%;
    z-index: 100;
}

.lijn-oranje-2025{
	width: 584.3%;
	top: 5.9%;
    left: 8.6%;
    z-index: 100;
}


.rondje{
	position: absolute;
	border-radius: 50%;
	width: 2.9%;
	height: 2.5%;
	background:#FFF;
    z-index: 500;
	
}

.slide .rondje{
	opacity: 0;
}

.rondje-vierkant{
    border-radius: 0px;
}

.rondje-checked{
	position: absolute;
	width: 76%;
	height: 61%;
	left: 11%;
	top: 20%;
	border-radius: 50%;
}

.rondje-donkerblauw{
	border: 0.45vw solid #0a6a9a;
}

	.rondje-donkerblauw:hover, .rondje-donkerblauw.hover{
		border: 0.45vw solid #00526b;
		cursor: pointer;
	}

.rondje-donkerblauw .rondje-checked{
	background: #0a6a9a;
}

	.rondje-donkerblauw:hover .rondje-checked, .rondje-donkerblauw.hover .rondje-checked{
		background: #00526b;
	}


.rondje-donkerblauw.donkersteblauw{
	border: 0.45vw solid #05455E;
}

.rondje-donkerblauw.donkersteblauw:hover, .rondje-donkerblauw.donkersteblauw.hover{
		border: 0.45vw solid #022935;
		cursor: pointer;
	}

 .rondje-donkerblauw.donkersteblauw .rondje-checked{
	background: #05455E;
}

	.rondje-donkerblauw.donkersteblauw:hover .rondje-checked, .rondje-donkerblauw.donkersteblauw.hover .rondje-checked{
		background: #022935;
	}


.rondje-lichtblauw{
	border: 0.45vw solid #66acd7;
}

	.rondje-lichtblauw:hover, .rondje-lichtblauw.hover{
		border: 0.45vw solid #4f95b9;
		cursor: pointer;
	}

.rondje-lichtblauw .rondje-checked{
	background: #66acd7;
}

	.rondje-lichtblauw:hover .rondje-checked, .rondje-lichtblauw.hover .rondje-checked{
		background: #4f95b9;
	}


.rondje-roze{
	border: 0.45vw solid #FF7BAB;
}

	.rondje-roze:hover, .rondje-roze.hover{
		border: 0.45vw solid #DA568B;
		cursor: pointer;
	}

.rondje-roze .rondje-checked{
	background: #FF7BAB;
}

	.rondje-roze:hover .rondje-checked, .rondje-roze.hover .rondje-checked{
		background: #DA568B;
	}

.rondje-groen{
	border: 0.45vw solid #8BC53F;
}

	.rondje-groen:hover, .rondje-groen.hover{
		border: 0.45vw solid #74A32B;
		cursor: pointer;
	}

.rondje-groen .rondje-checked{
	background: #8BC53F;
}

	.rondje-groen:hover .rondje-checked, .rondje-groen.hover .rondje-checked{
		background: #74A32B;
	}

.rondje-bordeaux{
	border: 0.45vw solid #9D005D;
}

	.rondje-bordeaux:hover, .rondje-bordeaux.hover{
		border: 0.45vw solid #77004D;
		cursor: pointer;
	}

.rondje-bordeaux .rondje-checked{
	background: #9D005D;
}

	.rondje-bordeaux:hover .rondje-checked, .rondje-bordeaux.hover .rondje-checked{
		background: #77004D;
	}

.rondje-oranje{
	border: 0.45vw solid #F6921E;
}

	.rondje-oranje:hover, .rondje-oranje.hover{
		border: 0.45vw solid #D77716;
		cursor: pointer;
	}

.rondje-oranje .rondje-checked{
	background: #F6921E;
}

	.rondje-oranje:hover .rondje-checked, .rondje-oranje.hover .rondje-checked{
		background: #D77716;
	}



.label{
    font-weight: bold;
    color: #FFF;
    font-size: 0.8vw;
    padding: 1vw 0.8vw;
    position: absolute;
    line-height: 0vw;
    cursor: pointer;
    z-index: 600;
}

.slide .label {
	opacity: 0;
}

.label-donkerblauw{
    background: #0a6a9a;
    border-bottom: 0.2vw #00526b solid;
}

.label-donkerblauw.donkersteblauw{
    background: #05455E;
    border-bottom: 0.2vw #05455E solid;
}

.label-lichtblauw{
    background: #66acd7;
    border-bottom: 0.2vw #4f95b9 solid;
}

.label-roze{
    background: #ff7bab;
    border-bottom: 0.2vw #da568b solid;
}

.label-groen{
    background: #8bc53f;
    border-bottom: 0.2vw #74a32b solid;
}

.label-bordeaux{
    background: #9d005d;
    border-bottom: 0.2vw #77004d solid;
}

.label-oranje{
    background: #f6921e;
    border-bottom: 0.2vw #d77716 solid;
}

.label-paars{
    background: #662d90;
    border-bottom: 0.2vw #3e195e solid;
}

.label-grijs{
    background: #B2B2B2;
    border-bottom: 0.2vw #989898 solid;
}


.pijltje{
    position: absolute;
}

.pijltje-onder{
    bottom: -0.6vw;
    width: 0.7vw;
    height: 0.7vw;
    transform: rotate(45deg);
}

    .label-donkerblauw .pijltje-onder{
        background:#0a6a9a;
        border-bottom: 0.2vw #00526b solid;
        border-right: 0.2vw #00526b solid;
    }

    .label-donkerblauw.donkersteblauw .pijltje-onder{
        background:#05455E;
        border-bottom: 0.2vw #02313F solid;
        border-right: 0.2vw #02313F solid;
    }

    .label-lichtblauw .pijltje-onder{
        background:#66acd7;
        border-bottom: 0.2vw #4f95b9 solid;
        border-right: 0.2vw #4f95b9 solid;
    }

	.label-roze .pijltje-onder{
        background:#ff7bab;
        border-bottom: 0.2vw #da568b solid;
        border-right: 0.2vw #da568b solid;
    }

	.label-groen .pijltje-onder{
        background:#8bc53f;
        border-bottom: 0.2vw #74a32b solid;
        border-right: 0.2vw #74a32b solid;
    }

	.label-bordeaux .pijltje-onder{
        background:#9d005d;
        border-bottom: 0.2vw #77004d solid;
        border-right: 0.2vw #77004d solid;
    }

	.label-oranje .pijltje-onder{
        background:#f6921e;
        border-bottom: 0.2vw #d77716 solid;
        border-right: 0.2vw #d77716 solid;
    }

    .label-grijs .pijltje-onder{
        background:#B2B2B2;
        border-bottom: 0.2vw #989898 solid;
        border-right: 0.2vw #989898 solid;
    }

.pijltje-links{
    left: -0.8vw;
    top: 27%;
    width: 1.2vw;
    height: 1.2vw;
}

.pijltje-boven{
    top: -0.3vw;
    width: 0.7vw;
    height: 0.7vw;
    transform: rotate(45deg);
}

    .label-donkerblauw .pijltje-boven{
        background:#0a6a9a;
    }

    .label-donkerblauw.donkersteblauw .pijltje-boven{
        background:#05455E;
    }

    .label-lichtblauw .pijltje-boven{
        background:#66acd7;
    }

	.label-roze .pijltje-boven{
        background:#ff7bab;
    }

	.label-groen .pijltje-boven{
        background:#8bc53f;
    }

	.label-bordeaux .pijltje-boven{
        background:#9d005d;
    }

	.label-oranje .pijltje-boven{
        background:#f6921e;
    }

    .label-grijs .pijltje-boven{
        background:#B2B2B2;
    }

.pijltje-rechts{
    right: -0.8vw;
    top: 27%;
    width: 1.2vw;
    height: 1.2vw;
}



.slide-popover-contents{
	display:none;
}

.popover{
	position: fixed;
	z-index: 999;
	top:0;
	right:0;
	bottom:0;
	left:0;
	display: none;
}

.popover-bg{
	background:#000;
	position: fixed;
	top:0;
	right:0;
	bottom:0;
	left:0;
	opacity: 0.6;
	z-index: 980;
}

.popover-paneel{
	background:#FFF;
	position: absolute;
	width: 44vw;
	left: 50%;
	margin-left: -22vw;
	margin-top:4%;
	z-index: 990;
}


.popover-paneel-inner{
	padding:2.5vw 0 2.5vw 2.5vw;
	line-height: 1.7vw;
	font-size: 0.8vw;
	position: relative;
}


/* IPAD */
@media only screen 
and (min-device-width: 1366px) 
and (max-device-width: 1366px) 
and (orientation: landscape) 
and (-webkit-min-device-pixel-ratio: 2) {

	.popover-paneel-inner{
		line-height: 2.7vw;
    	font-size: 1.4vw;
	}
	
}

@media screen 
and (-Webkit-min-device-pixel-ratio: 1.5)
and (orientation: landscape){
	
    .popover-paneel{
        margin-top:3%;
        width: 54vw;
        margin-left: -27vw;
    }
    
	.popover-paneel-inner{
		line-height: 2.4vw;
		font-size: 1.2vw;
	}
	  
}
	
.popover-paneel-inner a:hover{
	text-decoration: none;
}

.popover-paneel-inner a.close-button{
	font-size: 1.5vw;
	font-weight: bold;
	color:#FFF;
	border:4px solid #FFF;
	background:#d30050;
	font-family: 'Ubuntu', sans-serif;
	text-decoration: none;
	border-radius: 50%;
	height: 2.5vw;
	width: 2.5vw;
	line-height: 2.4vw;
	display: block;
	text-align: center;
	position: absolute;
	top:-16px;
	right:-16px;
	padding: 0;
}

.popover-paneel-inner a.close-button:hover{
	color:#d30050;
	background:#FFF;
	-moz-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
  	-webkit-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
  	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
	text-decoration: none;
}

.popover-paneel-inner h3{
	color:#1481c2;
	margin:0px 0px 0.8vw;
	font-size: 1.5vw;
	font-family: 'Ubuntu', sans-serif;
	font-weight: bold;
}

.popover-paneel-inner h3.lichtblauw{
	color:#1481c2;
}

.popover-paneel-inner h3.bordeaux{
	color:#9d005d;
}

.popover-paneel-inner h3.groen{
	color:#8bc53f;
}

.popover-paneel-inner h3.roze{
	color:#ff7bab;
}

.popover-paneel-inner h3.donkerblauw{
	color:#0a6a9a;
}

.popover-paneel-inner h3.oranje{
	color:#f6921e;
}

.popover-paneel-inner a.btn{
	background:#0a6a9a;
	border-bottom: 0.2vw #00526b solid;
	font-weight: bold;
	color: #FFF;
	text-decoration: none;
	padding:0.4vw 0.9vw;
	margin-top: 0.2vw;
	display: inline-block;
	margin-right: 0.1vw;
	margin-bottom: 0.2vw;
}

.popover-paneel-inner a.btn:hover{
	background:#d30050;
	border-bottom: 0.2vw #af0047 solid;
	color:#FFF;
	text-decoration: none;
}


.popover-paneel-inner a{
	color: #0a6a9a;
	text-decoration: underline;
}

.popover-paneel-inner a:hover{
	color: #d30050;
	text-decoration: underline;
}

.popover-content{
	max-height: 20vw;
	overflow-y:auto; 
    -webkit-overflow-scrolling: auto;
	padding-right: 2.5vw;
    padding-bottom: 20px;
}


.popover-content::-webkit-scrollbar {
    -webkit-appearance: none !important;
}

.popover-content::-webkit-scrollbar:vertical {
    width: 7px !important;
}

.popover-content::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, .5) !important;
    border-radius: 10px !important;
    border: 2px solid #ffffff !important;
}

.popover-content::-webkit-scrollbar-track {
    border-radius: 10px !important;
    background-color: #ffffff !important;
}




/* IPAD */
@media only screen 
and (min-device-width: 1366px) 
and (max-device-width: 1366px) 
and (orientation: landscape) 
and (-webkit-min-device-pixel-ratio: 2) {
	
	.popover-content{
		max-height: 40vw;
	}

}

@media screen 
and (-Webkit-min-device-pixel-ratio: 1.5)
and (orientation: landscape){
	
	.popover-content{
		max-height: 34vw;
	}
	
}