/* XX-Large devices (larger desktops, 1400px and up)*/
@media (max-width: 1399px) { 
}

/* X-Large devices (large desktops, 1200px and up)*/
@media (max-width: 1199px) { 
	.controls a {display:inline-block;margin-bottom:6px;}
}




/* Large devices (desktops, 992px and up)*/
@media (max-width: 991px) {

	.menuportal li {text-align:center}
	.menuportal li div {height:80px}
	.menuportal li i {display:block;margin-right:0;margin-bottom:2px;text-align:center;}
	.menuportal li a {font-size:1em}
	
	.menuportal li.locked div {font-size:1em;}
	.menuportal li.locked div i {display:block}	
	.menuportal li.locked div span{display:inline-block;font-size:1em}	
	.controls {text-align:left;height:auto}	

	.controls button {font-size:14px}

	
}


/* Medium devices (tablets, 768px and up)*/
@media (max-width: 767px) { 


	table.info {display:block;width:100%}
	table.info > tbody {display:block;width:100%}
	table.info > tbody > tr {display:block;width:100%}
	table.info > tbody >tr > th {display:block;width:100%;border:none;padding-bottom:0;padding-top:0;}
	table.info > tbody > tr > td {display:block;width:100%;padding-bottom:20px;padding-top:0;}

	table.info th, table.info td {
	  height: auto;

	}
	

	.controls [data-task] {margin-right: 10px;}

	.pane {margin-bottom:50px}	

	.pane div.innerpane img {max-width:50%;height:auto;max-height:initial}	
	table.info td.pull-right {text-align:left}
	#zulabe1-image {margin:10px 0}
	
	
 }

/* Small devices (landscape phones, 576px and up) */
@media (max-width: 575px) { 

	#header.pt-5 {padding-top:7vw!important}
	#header.mb-5 {margin-bottom:5vw!important}

	.footer {position:static;margin:50px 0 0 0;padding-bottom:25px}
	.container-main {padding-bottom:0px;}
	.menuportal li div {height:60px}
	.menuportal li a {font-size:.9em}
	.menuportal li.logout div {justify-content:center}
	.controls a {/*width:100%;display:block*/}
	.controls button {/*width:100%;display:block*/}
	
	h2 .kennzeichen { transform: scale(.5) translate(-20%,-50%)!important; margin-bottom:-50px;}
	
	
}

@media (max-width: 420px) { 
	#header .img-fluid {width:200px;}
	#header div:nth-child(2) {text-align: right;}
	
	
	h1 .kennzeichen { transform: scale(.5) translate(-50%,-50%); display:inline-block;margin-bottom:-30px;}

	
	
}