/* roboto-100 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100;
  src: url('../fonts/roboto/roboto-v32-latin-100.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-100italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 100;
  src: url('../fonts/roboto/roboto-v32-latin-100italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/roboto/roboto-v32-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-300italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 300;
  src: url('../fonts/roboto/roboto-v32-latin-300italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/roboto/roboto-v32-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/roboto/roboto-v32-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/roboto/roboto-v32-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-500italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 500;
  src: url('../fonts/roboto/roboto-v32-latin-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/roboto/roboto-v32-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 700;
  src: url('../fonts/roboto/roboto-v32-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/roboto/roboto-v32-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-900italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 900;
  src: url('../fonts/roboto/roboto-v32-latin-900italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


body,html{
    font-family: 'Roboto';
}

.first {
                width: 20px;
                text-align: center;
            }
            
            .spinner {
                border: 8px solid #ccc;
                border-radius: 50%;
                border-top: 8px solid #a9a8a7;
                border-bottom: 8px solid #a9a8a7;
                width: 50px;
                height: 50px;
                -webkit-animation: spin 2s linear infinite;
                /* Safari */
                animation: spin 2s linear infinite;
            }
            /* Safari */
            
            @-webkit-keyframes spin {
                0% {
                    -webkit-transform: rotate(0deg);
                }
                100% {
                    -webkit-transform: rotate(360deg);
                }
            }
            
            @keyframes spin {
                0% {
                    transform: rotate(0deg);
                }
                100% {
                    transform: rotate(360deg);
                }
            }
            
            #overlay {
                position: fixed;
                /* Sit on top of the page content */
                width: 100%;
                /* Full width (cover the whole page) */
                height: 100%;
                /* Full height (cover the whole page) */
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                background-color: rgba(0, 0, 0, 0.8);
                /* Black background with opacity */
                z-index: 99999;
                /* Specify a stack order in case you're using a different order for other elements */
                cursor: pointer;
                /* Add a pointer on hover */
                display: flex;
                align-items: center;
                justify-content: center;
            }
            
            .col-2,
            .col-4 {
                margin-bottom: 15px;
            }

.short-info{
	padding: 8px 10px;
	display: block;
	border-radius: 4px;
}
.favorit{
	transition:all ease-in-out 0.2s
}
.favorit:hover{
	background-color:#ffdf80;
}
.bewertung .fa-frown-o{
	color:#F00 !important;
}
.bewertung .fa-meh-o{
	color:#ffaa00 !important;
}
.bewertung .fa-smile-o{
	color: #0C6 !important;
}

.jobs-system .fa-frown-o{
	color:#F00 !important;
}
.jobs-system .fa-meh-o{
	color:#ffaa00 !important;
}
.jobs-system .fa-smile-o{
	color: #0C6 !important;
}
#result{
	margin:auto; 
	margin-top:-5px;
	margin-bottom:5px;
	background:#CCC;
}
#register .short{
	background:#F00;
	height:10px;
	width:25%;
}
#register .weak{
	background:#F90;
	height:10px;
	width:50%;
}
#register .good{
	background:#09F;
	height:10px;
	width:75%;
}
#register .strong{
	background:#0C0;
	height:10px;
	width:100%;
}
#filter_bw > .fa-stack,#kataster_filter > .fa-stack, #cc_filter > .fa-stack{
	margin-top:-4px;
}
.badge, .bw_badge, .job_badge {
	position: absolute;
	top: 0px;
	right: -10px;
	font-size: 10px;
	font-weight: 400;
	display: inline-block;
	min-width: 8px;
	padding: 3px 7px;
	line-height: 1;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	border-radius: 10px;
}
.bw_badge{
	opacity:0;
	top:-8px;
	right: -8px;
	transition:all ease-in-out 2s;
}
.job_badge {
  opacity: 0;
  top: 1px;
  right: -10px;
  transition: all ease-in-out 2s;
}

.bw_badge_2{
	opacity:0;
	top:-8px;
	right: -14px;
	transition:all ease-in-out 2s;
}
.bw_badge_aktiv{
	opacity:1;
}
	
h1, h2, h3, h4, h5, h6{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
h1{
	font-size:20px;
	font-weight:600;
	padding:6px 0px;	
}
h2{
	font-size:18px;
	font-weight:600;
	padding:6px 0px;
}
h3{
	font-size:16px;
	font-weight:600;
	padding:6px 0px;
}
.lesstopborder{
	margin-top:10px;
}
.user_infos{
	position: absolute;
	top: -160px;
	background-color: #4682B4;
	z-index: 820;
	padding: 6px;
	left: 0;
	right: 0;
	color: rgba(255,255,255,0.84);
    box-shadow: 0 1px 6px 0 rgba(0,0,0,0.12),0 1px 6px 0 rgba(0,0,0,0.12);
	transition: all 1s linear;
	justify-content: space-between;
	display: flex !important;
	box-sizing: border-box;
}
@keyframes slide-bounce {
    0%{top: -60px;}
    25% {top: 62px;}
    50% {top: 58px;}
	75% {top: 61px;}
	90% {top: 59px;}
	100% {top: 60px;}
} 
.user_infos_aktiv{
	-webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-name: slide-bounce;
    animation-name: slide-bounce;
	animation-fill-mode: forwards;
}
.bull_orange {
    color: #F38129;
    font-weight: bolder;
}
input[disabled], input[disabled]:hover { background-color:#eee; }

select{
	padding: 4px 6px;
	border: none;
	background-color: #ffdf80;
	border-bottom: 1px solid black;
	margin-top: 6px;
}
.select100{
	width: 100%;
}
 
.ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  white-space: nowrap;
  max-width:500px;
}
.ellipsisSmall {
  overflow: hidden;
  text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  white-space: nowrap;
  max-width:200px;
}
#main_content{

}
#sub_content{
	display:none;
}
#modal_content{
	display:none;
	position:fixed;
	top:0;
	bottom:0;
	left:0;
	right:0;
	z-index:40;
	overflow:scroll;
	padding-top:100px;
}
#modal_box{
	display:none;
	position:fixed;
	top:0;
	bottom:0;
	left:0;
	right:0;
	z-index:40;
	overflow:scroll;
	padding-top:100px;
	background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}
#modal_box_content{
	margin: auto;
	max-width: 50%;
}

#modal_box_content table td {
  border: 0px solid #999 !important;
}
.blur{
	filter: blur(8px);
	-webkit-filter: blur(8px);
	overflow:hidden;
}

.ver_content{
	display:none;
}
.rqs-details > .fa, .rqs-details > a{
	font-size: 18px !important;
	padding: 0px 2px;
	text-decoration:none;
}
.logo{
	font-size:36px;
	color:#FFF;
	font-family:Verdana;
	font-weight:bold;
	text-align:center;
}
.content{
	position:relative;
	margin-left: 230px;
	margin-top:60px;
	display: block;
	padding:15px;
	transition: all linear 0.2s;
}
.content_small{
	margin-left: 45px;
}
.content_temp{
	position:relative;
	max-width:1000px;
	margin:auto;
	margin-top:60px;
	display: block;
	padding:15px;
}
.main-header {
    position: fixed;
    max-height: 100px;
    z-index: 1030;
    background-color: #0073b7;
    color: rgba(255,255,255,0.84);
    box-shadow: 0 1px 6px 0 rgba(0,0,0,0.12),0 1px 6px 0 rgba(0,0,0,0.12);
    -webkit-transition: margin-left .3s ease-in-out;
    -o-transition: margin-left .3s ease-in-out;
    transition: margin-left .3s ease-in-out;
    margin-bottom: 0;
    border: none;
    min-height: 60px;
    border-radius: 0;
	top:0;
	left:0;
	right:0;
	
}

.info-box{
    box-shadow: 0 1px 6px 0 rgba(0,0,0,0.12),0 1px 6px 0 rgba(0,0,0,0.12);
    border-radius: 2px;
    border: 0;
    margin-bottom: 20px;
    background: #fff;
	display:block;
}
.info-box-head{
	padding:10px;	
	background-color: #0073b7;
	color:#FFF;
	font-weight:400;
	-ms-flex-pack: justify !important;
	justify-content: space-between !important;
	display: -ms-flexbox !important;
	display: flex !important;
	box-sizing: border-box;
	word-wrap: break-word;
}
.info-box-content{
	padding:10px;	
	background-color: #fff;
}
.helper{
    box-shadow: 0 1px 6px 0 rgba(0,0,0,0.12),0 1px 6px 0 rgba(0,0,0,0.12);
    border-radius: 2px;
    border: 0;
    margin-bottom: 20px;
    background: #fff;
	display:none;
}
.helper-head{
	padding:10px;	
	background-color: #0091e6;
	color:#FFF;
	font-weight:400;
	-ms-flex-pack: justify !important;
	justify-content: space-between !important;
	display: -ms-flexbox !important;
	display: flex !important;
	box-sizing: border-box;
	word-wrap: break-word;
}
.helper-content{
	padding:10px;	
	background-color: #fff;
}

.upload-helper{
	border: 1px solid #ccc;
}
.upload-helper-head{
	border-bottom: 1px solid #ccc;
	padding:10px;	
	background-color: #fff;
	color:rgb(34, 47, 62);
	font-weight:400;
	-ms-flex-pack: justify !important;
	justify-content: space-between !important;
	display: -ms-flexbox !important;
	display: flex !important;
	box-sizing: border-box;
	word-wrap: break-word;
}
.upload-helper-content{
	padding:10px;	
	background-color: #fff;
}
.unterbereich{
	border:1px solid #f3f3f5;
	background: #ffffff;
	margin-bottom: 8px;
	padding:10px;
	box-shadow: 0 0px 5px rgba(0, 0, 0, 0.3);
}
.unterbereich-head{
	color:#000;
	font-weight:600;
	-ms-flex-pack: justify !important;
	justify-content: space-between !important;
	display: -ms-flexbox !important;
	display: flex !important;
	box-sizing: border-box;
	word-wrap: break-word;
	transition:all ease-in-out 0.4s;
}

.unterbereich:hover{
	background-color: rgba(0,0,0,0.1);
}
.rotate_90{
	-moz-transform:rotate(90deg);
    -webkit-transform:rotate(90deg);
    transform:rotate(90deg);
}
.unterbereich_content{
	/*display:none;*/
	padding:8px;
	background-color: white;
	border: 1px dotted #666;
}

.artikel{
	margin-bottom:10px;
	position:relative;
}
.option_artikel{
	display: none;
	position: absolute;
	top: 0;
	right: 10px;
	border-radius: 8px;
	background-color: #ccc;
	padding: 4px 10px;
}
.artikel:hover .option_artikel {
    display:block;
}
.text-shadow{
	/*font-size:25px;*/
	text-shadow: 0px 0px 8px rgba(0, 0, 0, 1);
}


.clear{
	clear:both;
}
.border-radius-top{
	-webkit-border-top-left-radius: 2px;
	-webkit-border-top-right-radius: 2px;
	-moz-border-radius-topleft: 2px;
	-moz-border-radius-topright: 2px;
	border-top-left-radius: 2px;
	border-top-right-radius: 2px;
}
[class*="col-"] {
    float: left;
	margin-right:15px;
}
.col-0 {width: calc(20% - 15px);}
.col-1 {width: calc(25% - 15px);}
.col-2 {width: calc(50% - 15px);}
.col-3 {width: calc(75% - 15px);}
.col-4 {width: calc(100% - 15px);}
.col-3_1, .col-3_1a {width: calc(33% - 15px); text-align:center}
.flex-between{
	display: flex; justify-content: space-between
}
.text-left{
	text-align:left !important;
}
.margin-auto{
	margin:auto;
}
.login {
	width:25%;
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
.modal_screen {
	margin:auto;
	margin-left:240px;
	max-width:calc( 100% - 250px );
}
	.modal_screen_small {
		margin: auto;
		max-width: calc( 80% - 250px );
	}
.no-float{
	float:none !important;
}
.border-green{
	border:3px solid #0C6;
}

.border-green  .bw_badge{
  display:none !important;
}
.border-orange{
	border:3px solid #ffc40d;
}
.border-red{
	border:3px solid #F30;
}

.border-grey{
	border:3px solid #CCC;
}

.bg-white{
	padding:4px 8px;
	background:#FFF;
}

.gradient-45deg-light-blue-cyan {
    background: #0288d1;
    background: -webkit-linear-gradient(45deg, #0288d1 0%, #26c6da 100%);
    background: linear-gradient(45deg, #0288d1 0%, #26c6da 100%);
}
.text_cyan{
	color:#26c6da;
}
.gradient-45deg-green-teal {
    background: #43A047;
    background: -webkit-linear-gradient(45deg, #43A047 0%, #1de9b6 100%);
    background: linear-gradient(45deg, #43A047 0%, #1de9b6 100%);
}
.text_teal{
	color:#1de9b6;
}
.gradient-45deg-amber-amber {
    background: #ff6f00;
    background: -webkit-linear-gradient(45deg, #ff6f00 0%, #ffca28 100%);
    background: linear-gradient(45deg, #ff6f00 0%, #ffca28 100%);
}
.text_amber{
	color:#ffca28;
}
.gradient-45deg-deep-orange-orange {
    background: #bf360c;
    background: -webkit-linear-gradient(45deg, #bf360c 0%, #f57c00 100%);
    background: linear-gradient(45deg, #bf360c 0%, #f57c00 100%);
}
.text_orange{
	color:#f57c00;
}
.bewertung{
	margin-bottom:5px;
	transition: all .3s linear;
}
.bewertung:hover, .bewertung_aktiv{
	box-shadow: 0 1px 6px 0 rgba(0,0,0,0.8),0 1px 6px 0 rgba(0,0,0,0.62);
}
.bewertung > .head{
		padding:0px 0px 3px 0px;
		
}
.bw_content{

}
.headline{
	width: 100% !important;
	-ms-flex-pack: justify !important;
	justify-content: space-between !important;
	display: -ms-flexbox !important;
	display: flex !important;
	box-sizing: border-box;
	word-wrap: break-word;
	cursor:pointer;
	padding:8px;
}
.line_space_between{
	width: 100% !important;
	-ms-flex-pack: justify !important;
	justify-content: space-between !important;
	display: -ms-flexbox !important;
	display: flex !important;
}
.line_space_between:hover{
	background:#FFFBF0;
}
.text{
	font-size: 12px;

	text-overflow: ellipsis;
	overflow: hidden;
	width: 100%;
	white-space: nowrap;
	
}
/* Style the tab */
.tab {
    overflow: hidden;
    border: 1px solid #ccc;
    background-color: #f1f1f1;
}

/* Style the buttons inside the tab */
.tab button {
    background-color: inherit;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 8px 12px;
    transition: 0.3s;
    font-size: 16px;
	position:relative;
	border-right: 1px solid #ccc;
}

/* Change background color of buttons on hover */
.tab button:hover {
    background-color: #ddd;
}

/* Create an active/current tablink class */
.tab button.active {
    background-color: #ccc;
}


/* Style the tab content */
.tabcontent {
    display: none;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-top: none;
}
.dot {
  height: 12px;
  width: 12px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
}
.red{
	background-color:#F00;
}
.label2 {
	margin-left: 10px;
	font-size: 12px;
	padding: 4px 7px;
	border-radius: 6px;
	color:#000;
	cursor:pointer;
	position:relative;
}
.font-white{
	color:#FFF !important;
}

.actionbtn{
cursor:pointer;
}

.bewertung > input[type=text] {
  width: 100%;
  margin-bottom: 20px;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 3px;
}

.bewertung > label {
  margin-bottom: 10px;
  display: block;
}
input, textarea {
    font-family: 'Roboto', sans-serif;
}
.bw_input{
	padding:6px 8px;
	width: calc(100% - 16px);
	background-color:#ffdf80;
	border:0px;
	border-bottom:1px solid #000;
	font-size: 13px;
	transition:all 0.4s;
	margin-bottom:5px;
}
.bw_input_phs:is(:placeholder-shown){
	background-color:#ccc !important;
}
.bw_input_disable{
	background-color:#cfe0e6 !important;
}

.bw_input_half_screen{
	padding:6px 8px;
	width: calc(100%);
	background-color:#ffdf80;
	border:0px;
	border-bottom:1px solid #000;
	font-size: 13px;
	transition:all 0.4s;
	margin-bottom:5px;
}

select {
  font-family: 'FontAwesome',  'Roboto', sans-serif;
}
.bw_input:hover, .bw_input:focus{
	background-color:#ffdf80;
}
.bw_input:disabled{
	background-color:#cfe0e6 !important;
}
.bw_input.disabled{
	background-color:#cfe0e6 !important;
}
.btn{
	display:inline-block;
	border-radius: 6px;
    padding: 8px 8px;
    font-size: 13px;
    border: none;
    cursor: pointer;
	transition: all .3s linear;
	margin-top:5px;
	text-decoration:none !important;
}
.btn_small{
	display:inline-block;
	border-radius: 6px;
    padding: 3px 8px;
    font-size: 12px;
    border: none;
    cursor: pointer;
	transition: all .3s linear;
	margin:5px;
}
.send_btn{
	background-color: #0073b7;
	color: white;
}
.send_btn:hover{
	background-color: #00DF55;
	color: #0073b7;
}
.cancel_btn{
	background-color: #0073b7;
	color: white;
}
.cancel_btn:hover{
	background-color: #FF0000;
	color: #0073b7;
}
.delete_btn{
	background-color: #FF0000;
	color: white;
}
.delete_btn:hover{
	background-color: #FF0000;
	color: grey;
}
.updatebtn{
	border-radius: 12px;
    background-color: #bbb;
    color: black;
    padding: 8px 16px;
    font-size: 16px;
    border: none;
    cursor: pointer;
	transition: all .3s linear;
}
.updatebtn:hover{
    background-color: #0073b7;
}
.dropbtn {
    background-color: #bbb;
    color: black;
    padding: 8px 16px;
    font-size: 16px;
    border: none;
    cursor: pointer;
	transition: all .3s linear;
}

.dropdown {
    position: relative;
    display: inline-block;
}
.auswahlfeld{
	padding: 8px 16px;
	font-size: 16px;
	border: none;
	cursor: pointer; background:#fff;
	display: inline-block;
}

.dropdown-content {
	position: absolute;
	background-color: #f9f9f9;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	z-index: 10;
	margin: 0;
	padding: 0;
	transition: opacity 1s ease-out;
	opacity: 0;
	height: 0;
	overflow: hidden;
}
.dropdown-content.show{
	opacity: 1;
	height: auto;
}
.zwei_spalten{
	-webkit-column-count: 2;
	-webkit-column-gap: 10px; 
	-webkit-column-rule: 1px solid #ccc;
	-moz-column-count: 2;
	-moz-column-gap: 10px;  
	-moz-column-rule: 1px solid #ccc;
	column-count: 2;
	column-gap: 10px; 
	column-rule: 1px solid #ccc;
	width:800px;
}
.b400{
	width:400px;
}

.dropdown-content li {
	cursor: pointer;
	color: black;
	padding: 6px 16px;
	text-decoration: none;
	display: block;
	margin: 0;
	/*border-bottom: 1px solid #ccc;*/
}
.hilfe{
	-ms-flex-pack: justify !important;
	justify-content: space-between !important;
	display: -ms-flexbox !important;
	display: flex !important;
	box-sizing: border-box;
	word-wrap: break-word;
	transition:all ease-in-out 0.4s;
}

.dropdown-content li:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
    /*opacity: 1;
    display: block;*/
	opacity: 1;
    height: auto;
}

.dropdown.disable{
	opacity: 0.5;
}

.dropdown:hover .dropbtn {
    background-color: #0073b7;
}
.fa{
	transition: all .3s linear;
}

.dropdown:hover .fa-angle-left{
	-moz-transform:rotate(-90deg);
    -webkit-transform:rotate(-90deg);
    transform:rotate(-90deg);
}
.user_status{
	/*width:230px;*/
	-ms-flex-pack: justify !important;
	justify-content: space-between !important;
	cursor:pointer;
}
.user_status > div{
	float:left;
	overflow: auto;
	display:inline-block;
	line-height:15px;
	font-size:14px;
	font-weight:lighter;
	margin-right:4px;
	overflow:hidden;
}
.user_data{
	padding-bottom:10px;
}
.font-red{
    color:#F30 !important;
}
.font-yellow{
    color: #ffaa00 !important;
}
.font-green{
    color:#0C6 !important;
}
.font-green2{
    color:#096 !important;
}
.font-black{
    color:#000 !important;
}
.font-grey{
    color:#A0A0A4 !important;
}
.font-white{
    color:#fff !important;
}
.font-blue{
	color:#06F !important;
}

.font-light-green{
  color: #65FF4C !important
}
.font-light-blue{
  color:#45C4DF !important;
}
.whitebordered {
      background: #eee;
      border: 4px solid white;
      box-shadow: 0 0 1px rgba(0,0,0, .4);
	  padding:6px;
	  margin:10px 0 10px 0;
    }
@media only screen and (max-width: 768px) {
.zwei_spalten{
	width:600px;
}
	.content{
		margin-left: 0px;
		padding:2px;
	}
	.info-box{
		margin:auto;
		margin-bottom:10px;
		width:calc(100% - 20px);
	}
	.tabcontent{
		padding:3px 4px;
	}
	.info-box-content{
		padding:0px;	
	}
	.tab button {
		padding: 4px 6px;
		font-size: 12px;
	}
	
	[class*="col-"] {
		width: 100%;
	}
	.col-3_1 {
	width: calc(33% - 15px); text-align:center}
	.col-3_1a {
	width: 100%}
	.login {
		width:80%;
		position: absolute;
		left: 50%;
		top: 50%;
	 	-webkit-transform: translate(-50%, -50%);
	 	transform: translate(-50%, -50%);
	}
	.modal_screen {
		margin:auto;
		margin-left:auto;
		max-width:100%;
	}
	.modal_screen_small {
		margin: auto;
		margin-left:auto;
		max-width: 100%;
	}
	.updatebtn{
		font-size: 14px;
	}
	.dropbtn {
		font-size: 14px;
	}
	.dropdown-content li {
	padding:4px;
	}
}
@media only screen and (max-width: 599px) {
.zwei_spalten{
	-webkit-column-count: 1;
	-webkit-column-gap: 10px; 
	-webkit-column-rule: 1px solid #ccc;
	-moz-column-count: 1;
	-moz-column-gap: 10px;  
	-moz-column-rule: 1px solid #ccc;
	column-count: 1;
	column-gap: 10px; 
	column-rule: 1px solid #ccc;
	width:150%;
}
}

.bounce{
  animation: animateBounce linear 0.8s;
  animation-iteration-count: 1;
  transform-origin: 50% 50%;
  -webkit-animation: animateBounce linear 0.8s;
  -webkit-animation-iteration-count: 1;
  -webkit-transform-origin: 50% 50%;
  -moz-animation: animateBounce linear 0.8s;
  -moz-animation-iteration-count: 1;
  -moz-transform-origin: 50% 50%;
  -o-animation: animateBounce linear 0.8s;
  -o-animation-iteration-count: 1;
  -o-transform-origin: 50% 50%;
  -ms-animation: animateBounce linear 0.8s;
  -ms-animation-iteration-count: 1;
  -ms-transform-origin: 50% 50%;
}

@keyframes animateBounce{
  0% {
    transform:  translate(0px,0px)  ;
  }
  15% {
    transform:  translate(0px,-25px)  ;
  }
  30% {
    transform:  translate(0px,0px)  ;
  }
  45% {
    transform:  translate(0px,-15px)  ;
  }
  60% {
    transform:  translate(0px,0px)  ;
  }
  75% {
    transform:  translate(0px,-5px)  ;
  }
  100% {
    transform:  translate(0px,0px)  ;
  }
}

@-moz-keyframes animateBounce{
  0% {
    -moz-transform:  translate(0px,0px)  ;
  }
  15% {
    -moz-transform:  translate(0px,-25px)  ;
  }
  30% {
    -moz-transform:  translate(0px,0px)  ;
  }
  45% {
    -moz-transform:  translate(0px,-15px)  ;
  }
  60% {
    -moz-transform:  translate(0px,0px)  ;
  }
  75% {
    -moz-transform:  translate(0px,-5px)  ;
  }
  100% {
    -moz-transform:  translate(0px,0px)  ;
  }
}

@-webkit-keyframes animateBounce {
  0% {
    -webkit-transform:  translate(0px,0px)  ;
  }
  15% {
    -webkit-transform:  translate(0px,-25px)  ;
  }
  30% {
    -webkit-transform:  translate(0px,0px)  ;
  }
  45% {
    -webkit-transform:  translate(0px,-15px)  ;
  }
  60% {
    -webkit-transform:  translate(0px,0px)  ;
  }
  75% {
    -webkit-transform:  translate(0px,-5px)  ;
  }
  100% {
    -webkit-transform:  translate(0px,0px)  ;
  }
}

@-o-keyframes animateBounce {
  0% {
    -o-transform:  translate(0px,0px)  ;
  }
  15% {
    -o-transform:  translate(0px,-25px)  ;
  }
  30% {
    -o-transform:  translate(0px,0px)  ;
  }
  45% {
    -o-transform:  translate(0px,-15px)  ;
  }
  60% {
    -o-transform:  translate(0px,0px)  ;
  }
  75% {
    -o-transform:  translate(0px,-5px)  ;
  }
  100% {
    -o-transform:  translate(0px,0px)  ;
  }
}

@-ms-keyframes animateBounce {
  0% {
    -ms-transform:  translate(0px,0px)  ;
  }
  15% {
    -ms-transform:  translate(0px,-25px)  ;
  }
  30% {
    -ms-transform:  translate(0px,0px)  ;
  }
  45% {
    -ms-transform:  translate(0px,-15px)  ;
  }
  60% {
    -ms-transform:  translate(0px,0px)  ;
  }
  75% {
    -ms-transform:  translate(0px,-5px)  ;
  }
  100% {
    -ms-transform:  translate(0px,0px)  ;
  }
}
.bewBu {
  cursor: pointer;
  color: black;
  text-decoration: none;
  padding: 8px 8px;
  font-size: 13px;
  transition: all ease-in-out 0.2s;
  border-radius: 6px;
  opacity:1;
  margin-right: 5px;
  box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px,
    rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -4px 0px inset;
  min-width: 110px;
  display: inline-block;
  text-align: center;
}
.bewBu.activ,
.bewBu:hover {
  box-shadow: none;
  /*opacity:1;*/
}
.bewBu .fa {
  color: #000 !important;
}
/*
.bewBu {
  cursor: pointer;
  color: black;
  text-decoration: none;
  padding: 8px 8px;
  font-size: 13px;
  border: 1px solid white;
  border-radius: 6px;
  transition: all ease-in-out 0.2s;
}
.bewBu.activ,
.bewBu:hover {
  box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px,
    rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset;
  border: 1px solid #333;
}
*/

 [data-tooltip] {
    position: relative;
    text-decoration: none;
  }
  [data-tooltip]:after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: 100%;
    left: 20%;
    background: #ddd;
    padding: 5px 15px;
    color: black;
    -webkit-border-radius: 10px;
    -moz-border-radius   : 10px;
    border-radius        : 10px;
    white-space: nowrap;
    opacity: 0;
     /* At time of this creation, only Fx4 doing pseduo transitions */
    -webkit-transition: all 0.3s ease;
    -moz-transition   : all 0.3s ease;
  }
  [data-tooltip]:before {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-top: 20px solid #ddd;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    /* At time of this creation, only Fx4 doing pseduo transitions */
    -webkit-transition: all 0.2s ease;
    -moz-transition   : all 0.2s ease;
    opacity: 0;
    left: 30%;
    bottom: 100%;
  }
  [data-tooltip]:hover:after {
    bottom: 100%;
    -webkit-transition: all 0.1s ease;
    -moz-transition   : all 0.1s ease;
  }
  [data-tooltip]:hover:before {
    bottom: 70%;
  }
 [data-tooltip]:hover:after,[data-tooltip]:hover:before {
    opacity: 1;
  }


.fa-arrow-circle-o-left{
	font-size: 20px !important;
	cursor: pointer;
}

.info-box .info-box-head-2{
	background-color: #0073b7;
	color:#FFF;
	font-weight:400;
		-ms-flex-pack: justify !important;
	justify-content: space-between !important;
	display: -ms-flexbox !important;
	display: flex !important;
	box-sizing: border-box;
	word-wrap: break-word;
	align-items: center;
	padding-right: 10px;
}
.info-box .info-box-head-2 .backIcon{
	display: inline-block;
	padding: 10px; 
	border-right: 2px solid white;
	color:white;
	background: #0073b7;
	transition: all linear 0.2s;
}
.info-box .info-box-head-2 .backIcon:hover{
	color:#0073b7;
	background: white;
}
.info-box .info-box-head-2 .info-headline{
	display: inline-block;
	padding: 10px; 	
}
.info-box .info-box-head-2 .info-filter{
	display: inline-block;
	padding: 5px; 
	margin-right: 5px;
}
           .info-box  .fa-stack {
                width: 1.2em;
                height: 1em;
                line-height: 1em;
            }


			.infoblock{
				position: absolute;
				top: 10px;
				right: 20px;
				display: flex;
				justify-content: center;
				align-items: center;
				gap: 1rem;
			}
			.circle-button{
				position: relative;
				width: 30px;
				height: 30px;
				background-color: white;
				border: none;
				border-radius: 50%;
				display: flex;
				align-items: center;
				justify-content: center;
				cursor: pointer;
				transition: transform 0.2s ease;
			}
			.circle-button:hover {
			  transform: scale(1.05);
			}	
			.circle-button i {
			  font-size: 14px;
			  color: #333;
			}
			.circle-button .badge {
			  position: absolute;
			  top: -3px;
			  right: -3px;
			  background-color: red;
			  color: white;
			  font-size: 6px;
			  padding: 2px 4px;
			  border-radius: 50%;
			  font-weight: bold;
			  line-height: 1;
			}
	.user_msgs{
		position: fixed;
		top: 0;
		bottom: 0;
		opacity: 0;
		right: -500px;
		  transition: all 1s linear;
		  background: white;
		  border: 10px solid #2e87e3;
			border-right-width: 10px;
			border-right-style: solid;
			border-right-color: rgb(46, 135, 227);
			border-bottom-width: 10px;
			border-bottom-style: solid;
			border-bottom-color: rgb(46, 135, 227);
		  border-top-left-radius: 10px;
		  border-right: 0;
		  border-bottom: 0;
		z-index: 99999;
	}
	.user_msgs.show{
		right: 0;
		opacity: 1;
	}