@keyframes windowBounce {
    0% { transform: translate(-50%, -50%) scale(0.975); opacity: 1 }
    35% { transform: translate(-50%, -50%) scale(0.875); opacity: .8; }
    50% { transform: translate(-50%, -50%) scale(1.1); opacity: 1 }
    70% { transform: translate(-50%, -50%) scale(1.0125) }
    85% { transform: translate(-50%, -50%) scale(1.0375) }
    100% { transform: translate(-50%, -50%) scale(1) }
}

.msg_background{
    z-index: 100;
    
    position: fixed;
    top: 0px;
    left: 0px;
    
    width: 100%;
    height: 100vh;
    
    background: rgba(0,0,0,0.0);
    
    opacity: 0;
    
    animation: visibleBackround 0.5s;
    animation-fill-mode: forwards;
    
    -webkit-backface-visibility: hidden;
}



.msg_background.invisible{
    animation: invisibleBackround 0.25s;
    animation-fill-mode: forwards;
}

.msg_window{
    z-index: 101;
    position: fixed;
    top: 50%;
    left: 50%;
    
    transform: translate(-50%, -50%);
    
    min-width: 400px;
    height: auto;
    max-height: 90vh;
    
    background: rgba(0,0,0,0.85);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    
    border-radius: 3px;
    
    padding-bottom: 80px;
    
    color: #fff;
    -webkit-backface-visibility: hidden;
    
    transition: all .25s ease-in-out;
    
    user-select: none;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
}

.termsOfUse 								{text-align:left;font-size:11px;line-height:14px;overflow:scroll;}


/* HIDE SCROLLBARS */	
.termsOfUse::-webkit-scrollbar 				{display: none;} /* Chrome, Safari and Opera */
.termsOfUse									{-ms-overflow-style: none;scrollbar-width: none;} /* IE, Edge and Firefox */

.msg_window h1,
.msg_window h2,
.msg_window h3,
.msg_window h4		{color: #FFF;font-weight: bold}
.msg_window p		{color: #FFF}

.msg_window h2		{margin-top: 30px;}
.msg_window h4		{font-size: 1rem;font-weight: bold;margin-bottom:10px;}

.msg_window * > h1:first-child,
.msg_window * > h2:first-child,
.msg_window * > h3:first-child,
.msg_window * > h4:first-child		{margin-top: 0}

.msg_window > .content{
	padding: 25px;overflow: auto;
	max-height: calc(90vh - 120px);
}

.msg_window li{
	border: 2px solid transparent;
}

.msg_window > .content ul.documents > li{
	padding-left: 59px !important;
}
.msg_window > .content ul,.documentHolder li, .documentHolder{
	border: 3px solid transparent;
	box-sizing: border-box;
}
.msg_window > .content ul > li{
	line-height: 56px;
	padding-left: 103px;
	position: relative;
	cursor: pointer;
	overflow: left;
	display: block;
}

.msg_window > .content ul{
	border: 3px solid transparent;
}

.msg_window > .content ul > li > span{
	margin-left: 15px;
	display: block;
}

.msg_window > .content ul.documents > li{
	border-radius: 4px;
}
.msg_window > .content ul.documents > li:nth-child(odd){
	background: rgba(0,0,0,0.1);
}

.msg_window > .content ul.documents > li ul{
	display: none;
}

.msg_window > .content ul.documents > li:before{
	left: 26px !important;
}
.msg_window > .content ul > li:before{
	position: absolute;
	left: 60px;
	top: 10px;
	width: 37px;
	height: 37px;
	border-radius:50%;
	background: #69a3c0;
	color: #fff;
	font-family: 'desinfecta' !important;
	font-size: 15px;
	text-align: center;
	line-height: 37px;
}.msg_window > .content ul > li.folder:before{
	content: '\e827';
	color: #69a3c0;
	background: transparent;
	font-size: 27px;
}.msg_window > .content ul > li.folder.opened:before{
	content: '\e910';
}.msg_window > .content ul > li.folderProtected:before{
	content: '\e911';
	color: #69a3c0;
	background: transparent;
	font-size: 27px;
}.msg_window > .content ul > li.folderProtected.opened:before{
	content: '\e910';
}.msg_window > .content ul > li:before{
	content: '\e820';
}.msg_window > .content ul > li.doc:before{
	content: '\e907';
}.msg_window > .content ul > li.xls:before{
	content: '\e906';
}.msg_window > .content ul > li.ppt:before{
	content: '\e908';
}.msg_window > .content ul > li.pdf:before{
	content: '\e90a';
	color: #000;
}.msg_window > .content ul > li.zip:before{
	content: '\e909';
}.msg_window > .content ul > li.png:before, documentHolder ul > li.jpg:before, documentHolder ul > li.jpeg:before, documentHolder ul > li.gif:before{
	content: '\e813';
}.msg_window > .content ul > li.none:before{
	content: '';
	background: transparent;
}

.msg_window > .content ul > li ul > li{
	padding-left: 50px;
}
.msg_window > .content ul > li ul > li > span{
	margin-left: 0px;
}
.msg_window > .content ul > li ul > li:before{
	left: 0px;	
}

.msg_window > .content ul.documents > li.none{
	color: #B8B8B8;
	background: #fff;
	padding-left: 25px !important;
	cursor: default;
}



.msg_window.bounce{
	animation: windowBounce .5s forwards;
}

.msg_window input:not([type="checkbox"]):not([type="radio"]) {
	-webkit-appearance: none;
	background: #fff;
	width: calc(80% - 14px);
	
	height: 30px;
	padding: 3px 7px 3px 7px;
	border: 1px solid #ccc !important;
	border-radius: 3px;
	margin: 20px 10% ;
	font-size: 1rem;
	color: #fff;
	outline: none;
	transition: 0.25s ease-in-out;
	background: transparent;
}

.msg_window > .font_msgHeader{
	margin-top: 25px;
	margin-left: 20px;
	margin-right: 20px;
	text-align: center;
	font-size: 25px;
}

.msg_window > .font_msgContent{
	margin-top: 20px;
	margin-left: 20px;
	margin-right: 20px;
	text-align: center;
	/*font-size: 15px;*/
	max-height: calc(90vh - 120px);
	overflow-y: scroll;
}


.msg_button{
    position: absolute;
    
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 10px;
    padding-bottom: 10px;
    
    font-size: 15px;
    color: #fff;
    
    border-radius: 3px;
    
    transition: all 0.5s ease-in-out;
}


.msg_window #msbPeriodenauswahl		{width: 620px;max-width: 95%;overflow: hidden}
.msg_window #msbTrendgrafik			{width: 620px;max-width: 95%;overflow: hidden}
.msg_window .mb						{margin-bottom: 20px !important;}
.msg_window label					{display:block;margin-bottom:5px;cursor: pointer}


.msg_button.ok{
    bottom: 20px;
    right: 40px;
}.msg_button.ok:hover{
	color: #69a3c0;	
}

.msg_button.cancel{
    bottom: 20px;
    left: 40px;
}.msg_button.cancel:hover{
	color: #ff0000;	
}

.msg_button.other{
    bottom: 20px;
    left: 40px;
}.msg_button.other:hover{
	color: #69a3c0;	
}

.msg_button:hover{  
    cursor: pointer;
}

@keyframes visibleBackround{
    0% {opacity: 0}
    100% {opacity: 1}
}

@keyframes invisibleBackround{
    0% {opacity: 1}
    100% {opacity: 0}
}

@media (max-height: 968px) { 
    .msg_window{
        transform: translateX(-50%);
        top: 2.5%;
        bottom: 2.5%;        
    }
    .msg_window > .content {overflow-x: hidden;overflow-y: scroll;height:calc(100% - 130px)}
    .msg_window #msbPeriodenauswahl {margin: 0 auto}
}
@media (max-width: 768px) {
	.msg_window{
        transform: translate(0, 0);
        left: 2.5%;
        right: 2.5%;    
        top: 2.5%;
        bottom: 2.5%;     
    }
}


    