div {
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;

    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

    -webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-tap-highlight-color: transparent;
}

.vm-root {
	position:absolute; top:5px; left:5px; right:5px; bottom:5px; overflow:hidden;
}
.vm-top-header {
	position:absolute; top:0px; left:0px; right:0px; height:100px; background-color:#203555
}

.vm-main-title {
	position:absolute; top:40px; left:450px; color:white; font-size:32px
}

.vm-main-panel {
	position:absolute; top:125px; left:420px; right:20px; bottom:10px; background:white;
}

.vm-cookie-confirm {
	position:absolute; width:400px; height:150px; right:20px; bottom:45px; border:2px solid grey; border-radius:7px; background:white; font-size:16px; text-align:center; overflow:hidden; padding:25px;
}

.vm-menu {
	position:absolute; top:125px; left:20px; width:400px; bottom:0px; background-color:transparent; background-image:url('images/logo_bright.png'); background-repeat:no-repeat; background-position:center center; background-size:150px
}

.vm-menu-on {
	display:none;
}

.vm-menu-on-expanded {
	top:60px; left:0px; bottom:0px; right:0px; border-radius:0px; width:100%; height:100%; background:white;
}

.vm-info-graphic {
	position:absolute; top:0px; left:0px;
}

.vm-info-graphic-text-1 {
	color:#5ec1d3; font-size:16px; margin:15px; width:390px; text-align:right
}

.vm-info-graphic-text-2 {
	color:grey; font-size:16px; margin:15px; width:390px; text-align:right
}

.vm-info-graphic-text-3 {
	position:absolute; font-size:16px; top:330px; left:330px; width:500px
}

.vm-legend-button {
	
}

.vm-menu-hidden {

}

.vm-menu-visible {
	
}

.vm-menu-on-hidden {
	
}

.vm-content-panel {
	position:absolute; top:0px; width:100%; left:0px; height:100%; padding:20px;	
}

.vm-panel-title {
	position:absolute; top:5px; left:5px; right:5px; height:50px; overflow:hidden; line-height:50px; font-size:18px; padding-left:20px; background:#D0DBE6; color:#707E85;
	word-wrap:normal; white-space:nowrap; 
}
.vm-text-3-title {
	color:#5ec1d3; left:300px; top:300px; margin:5px;
}
.vm-text-3-text {
	color:grey; margin:5px;
}

.vm-toggle-fullscreen {
	position:absolute; top:30px; right:200px; width:100px; text-align:left; color:white; font-size:32px; background:transparent;
}

.directions-layout {
	position:absolute; top:0px; left:0px; right:0px; bottom:0px; 	
}

.direction {
	position:absolute; width:50%; left:0%; height:100%; overflow:auto; background:white;
}

.direction-hidden {
	position:absolute; width:50%; left:50%; height:100%; overflow:auto; background:white;
}

.directions-info-header {
	position:absolute; top:0px; left:0px; right:0px; bottom:0px; background:transparent; display:flex; justify-content:space-between
}
.direction-info-switching {
	display:none; 
}

.direction-name {
	background-color:rgba(255,255,255,1); 
}

.direction-disabled {
	background-color:rgba(255,255,255,0.5);
}

@media only screen and (max-width: 700px) {
	.vm-root {
		position:absolute; top:0px; left:0px; right:0px; bottom:0px; overflow:hidden;
	}
	.vm-top-header {
		position:absolute; top:0px; left:0px; width:100%; height:100px; background-color:#203555
	}
	.vm-top-header-hidden {
		top:-100px;
	}
	.vm-main-title {
		position:absolute; top:27px; width:250px; left:150px; color:white; font-size:20px; text-align:center;
		display:none;
	}
	.vm-main-panel {
		top:100px; left:0px; right:0px; width:100%; margin:0px; padding:0px;
	}
	.vm-main-panel-upper {
		top:0px;
	}
	.vm-cookie-confirm {
		display:none;
	}
	.vm-menu {
		left:-100%; width:100%; top:67px;
	}
	.vm-menu-hidden {
		display:none;
	}
	.vm-menu-on {
		display:block; position:absolute; top:80px; right:25px; width:40px; height:40px; 
		background:#0d808c; border-radius:25px; color:white; line-height:40px; text-align:center; cursor:hand;
		opacity:1; border:0px solid white; border-width:0px;
		border-width:5px;
		background-clip:padding-box;
	}
	.vm-menu-on-animated {
	    -webkit-animation-name: vm-menu-anim; /* Chrome, Safari, Opera */
	    -webkit-animation-duration: 1.5s; /* Chrome, Safari, Opera */
	    animation-name: vm-menu-anim;
	    animation-duration: 1.5s;
	    -webkit-animation-fill-mode: forwards; /* Chrome, Safari, Opera */
	    animation-fill-mode: forwards;
	}
	.vm-legend-button {
		display:none;
	}
	.vm-menu-visible {
		left:0px;
	}
	.vm-menu-on-back-home {
		top:30px; right:25px;
		
	    -webkit-animation-name: vm-menu-anim-home; /* Chrome, Safari, Opera */
	    -webkit-animation-duration: 1.5s; /* Chrome, Safari, Opera */
	    animation-name: vm-menu-anim-home;
	    animation-duration: 1.5s;
	    -webkit-animation-fill-mode: forwards; /* Chrome, Safari, Opera */
	    animation-fill-mode: forwards;
	}
	.vm-menu-on-back-menu {
		top:30px; right:25px;
		
	    -webkit-animation-name: vm-menu-anim-menu; /* Chrome, Safari, Opera */
	    -webkit-animation-duration: 1.5s; /* Chrome, Safari, Opera */
	    animation-name: vm-menu-anim-menu;
	    animation-duration: 1.5s;
	    -webkit-animation-fill-mode: forwards; /* Chrome, Safari, Opera */
	    animation-fill-mode: forwards;
	}
	.vm-menu-on-hidden {
		display:none;
	}
	.vm-info-graphic-text-1 {
		position:absolute; top:0px; left:0px; text-align:left; color:#0d808c;
	}
	.vm-info-graphic-text-2 {
		position:absolute; top:30px; left:0px; text-align:left; color:#95a6b1;
	}
	.vm-info-graphic-text-3 {
		position:absolute; font-size:16px; top:140px; left:0px; width:90%; color:#95a6b1; padding:10px;
	}
	.vm-info-graphic {
		width:100%; top:120px; margin:0px; display:none;
	}
	.vm-content-panel {
		position:absolute; top:0px; width:100%; left:0px; height:100%; padding:0px; overflow-y:auto;	
	}
	.vm-content-panel:after {		
		position:absolute; top:0px; bottom:0px; left:0px; right:0px; height:100%; width:100%;
		background-image:url('../../images/infografika.svg');
		background-position:center bottom;  background-size:contain; background-repeat:no-repeat;
		opacity:0.2;
	}
	.vm-panel-title {
		background:#abd8cd; color:#263d54; margin:0px; top:0px; left:0px; right:0px; padding-right:80px; box-sizing:border-box; overflow:hidden;
	}
	.vm-text-3-title {
		color:#0d808c; left:0px; top:300px; margin:5px;
	}
	.vm-text-3-text {
		color:#95a6b1; margin:5px;
	}
	.vm-toggle-fullscreen {
		display:none;
	}
	div#time-div {
		display:none;
	}
	div#toggle_fullscreen {
		display:none;
	}
	.accordion-item-title {
		background:#0d808c;
	}
	.direction {
		position:absolute; width:100%; left:0%; height:100%; overflow:auto; background:white;
	}
	.direction-hidden {
		position:absolute; width:0%; left:-100%; height:100%; overflow:auto; background:white; display:none;
	}
	.directions-info-header {
		display:none;
	}
	.direction-info-switching {
		display:block;
	}
	@keyframes vm-menu-anim {
    	0%   {right:25px; top:25px;}
    	50%  {right:25px; top:120px; background:#b7d26c; color:#0d808c; }    
    	100% {right:25px; top:25px;}
	}
	@keyframes vm-menu-anim-home {
    	0%   {right:25px; top:25px;}    
    	50%  {right:25px; top:120px; background:#b7d26c; color:#0d808c; }
    	100% {right:25px; top:25px;}
	}
	@keyframes vm-menu-anim-menu {
    	0%   {right:25px; top:25px;}    
    	50%  {right:25px; top:120px; background:#b7d26c; color:#0d808c; '}
    	100% {right:25px; top:25px;}
	}
}