

html, body {
	margin: 0px;
	padding: 0px;
	font-family: 'Open Sans', sans-serif;
	font-size: 10px;	
	color: #333;
	background: #F2F2F2;
	margin-top: 10px;
	font-weight: 300;
	-webkit-font-smoothing: antialiased;	
}

html, body, table{
	margin: 0px;
	padding: 0px;

	font-family: 'Open Sans', sans-serif;
	font-size: 12px;	
	color: #333;

}

div.logo {
	width: 180px;
	padding-top: 25px;
	margin: auto;
	font-weight: 300;	
	font-size: 20px;
	color: #575757;
	margin-bottom: 37px;
}

div.head_top {
	margin: 0px;
	padding: 0px;
	width: 100%;
	height: 30px;
	background-color: #333;
	
}

.ui-tooltip {
	opacity: 1 !important;
	background: #fff !important;
}

table.page_wrap {
	vertical-align: top;
	border-spacing: 0;
	border-width: 0;
	height: 100%;
	margin: auto;
	width: 96%;
	margin: 0px;
	padding: 0px;
}

td.head_top {
	vertical-align: top;
}

td.navigation {
	padding: 0px;
	margin: 0px;
	width: 200px;
	height: 100%;
	margin: auto;
	font-size: 16px;
	float: left;
	vertical-align: top;
}

div.navigation_left {
	width: 220px;
	background: #DDDDDD;
	height: 100vh;
	
}

td.content {
	vertical-align: top;
	width: 90%;
	height: 100%;
	padding-left: 50px;
	padding-top: 20px;
}

h1 {
	margin-top: 20px;
	font-weight: 300;
	font-size: 28px;
}

h2 {
	margin-top: 0px;
	font-weight: 700;
	font-size: 14px;
}

h2.inline {
	display: inline;
	margin-right: 10px;	
	font-size: 15px;
	font-weight: 400;
}

div.clear {
	clear: both;
}

div.line_big {
	width: 100%;
	height: 1px;
	border-bottom: 2px solid #eaeaea;
	margin-top: 12px;
	margin-bottom: 12px;
}


td.line {
	border-bottom: 1px solid #bebebe;
}

td.head {
	background: #e4e4e4;
}


input.input, td.linie {
	border: 0px;
	border-bottom:1px solid #efefef; 
	height: 20px;
	font-size: 14px;
	font-weight: 300;
	background: #f5f5f5;
}

input.input_table {
	border: 0px;
	height: 20px;
	font-size: 14px;
	font-weight: 300;
	margin: 0px;
}

textarea {
	border:1px solid #efefef;
}

th.table {
	font-weight: 400;
	font-size: 14px;
	text-align: left;
	padding-left: 5px;
	margin-left: 0px;
	background: #bfd25e;
	color: #fff;
}

td.table {
	margin-left: 0px;
	border:1px solid #efefef; 	
}

table.start {
	width: 530px;
	margin: auto;
	border:1px solid #efefef; 	
	background: #fff;
	padding: 20px;
}


table.big td {
	height: 35px;
	padding-left: 5px;
}

input.speichern, div.speichern, div.print {	
	width:95px;
	float: right;
	padding-left: 8px;
	padding-right: 8px;
	font-weight: 700;
	border-width: 1px;
	color: #FFF;
/* 	background-color: #009EE0; */
	border-color: #96C44D #96C44D #678733;
 	border-bottom-left-radius: 2px 2px;
	border-bottom-right-radius: 2px 2px;
 	border-top-left-radius: 2px 2px;
	border-top-right-radius: 2px 2px;
	-moz-border-radius-bottomleft: 2px;
	-moz-border-radius-bottomright: 2px;
	-moz-border-radius-topleft: 2px;
	-moz-border-radius-topright: 2px;	
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9DD348', endColorstr='#7BA538');
	background: -webkit-gradient(linear, left top, left bottom, from(#9DD348), to(#7BA538));
	background: -moz-linear-gradient(top, #9DD348, #7BA538);
	cursor: pointer;
}

input.speichern:hover, div.speichern:hover, div.print:hover {
	cursor: pointer;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7BA538', endColorstr='#678733');
	background: -webkit-gradient(linear, left top, left bottom, from(#7BA538), to(#678733));
	background: -moz-linear-gradient(top, #7BA538, #678733);
}

input.abbrechen, div.abbrechen, input.add_artikel {	
	width:95px;
	padding-left: 8px;
	padding-right: 8px;
	font-weight: 700;
	border-width: 1px;
	color: #FFF;
/* 	background-color: #009EE0; */
	border-color: #a9bac2 #a9bac2 #6b787f;
 	border-bottom-left-radius: 2px 2px;
	border-bottom-right-radius: 2px 2px;
 	border-top-left-radius: 2px 2px;
	border-top-right-radius: 2px 2px;
	-moz-border-radius-bottomleft: 2px;
	-moz-border-radius-bottomright: 2px;
	-moz-border-radius-topleft: 2px;
	-moz-border-radius-topright: 2px;	
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9cadb5', endColorstr='#7e8d95');
	background: -webkit-gradient(linear, left top, left bottom, from(#9cadb5), to(#7e8d95));
	background: -moz-linear-gradient(top, #9cadb5, #7e8d95);
	cursor: pointer;
}

input.abbrechen:hover, div.abbrechen:hover {
	cursor: pointer;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7e8d95', endColorstr='#687880');
	background: -webkit-gradient(linear, left top, left bottom, from(#7e8d95), to(#687880));
	background: -moz-linear-gradient(top, #7e8d95, #687880);
}

input.add_artikel {
	color: #333;
	border-color: #dbdbdb #dbdbdb #e7e7e7;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f5f5f5', endColorstr='#f1f1f1');
	background: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#f1f1f1));
	background: -moz-linear-gradient(top, #f5f5f5, #f1f1f1);
}

input.add_artikel:hover {
	border-color: #bebebe #bebebe #b9b9b9;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f1f1f1', endColorstr='#d4d4d4');
	background: -webkit-gradient(linear, left top, left bottom, from(#f1f1f1), to(#d4d4d4));
	background: -moz-linear-gradient(top, #f1f1f1, #d4d4d4);
}

a.white:link {color: #FFF;font-weight: 400;}
a.white:visited {color: #FFF;font-weight: 400;}
a.white:active {color: #FFF;font-weight: 400;}
a.white:hover {color: #FFF;font-weight: 400;}


a.underline:link {color: #333333;text-decoration: underline;font-weight: 300;}
a.underline:visited {color: #333333;text-decoration: underline;font-weight: 300;}
a.underline:active {color: #333333;text-decoration: underline;font-weight: 300;}
a.underline:hover {color: #333333;text-decoration: underline;font-weight: 300;}


a:link {color: #333333;text-decoration: none;font-weight: 400;}
a:visited {color: #333333;text-decoration: none;font-weight: 400;}
a:active {color: #333333;text-decoration: none;font-weight: 400;}
a:hover {color: #333333;text-decoration: underline;font-weight: 400;}

div.print a:link {color: #FFF;text-decoration: none;font-weight: 600;}
div.print a:visited {color: #FFF;text-decoration: none;font-weight: 600;}
div.print a:active {color: #FFF;text-decoration: none;font-weight: 600;}
div.print a:hover {color: #FFF;text-decoration: none;font-weight: 600;}


div.abbrechen a:link {color: #FFF;text-decoration: none;font-weight: 600;}
div.abbrechen a:visited {color: #FFF;text-decoration: none;font-weight: 600;}
div.abbrechen a:active {color: #FFF;text-decoration: none;font-weight: 600;}
div.abbrechen a:hover {color: #FFF;text-decoration: none;font-weight: 600;}

div.speichern a:link {color: #FFF;text-decoration: none;font-weight: 600;}
div.speichern a:visited {color: #FFF;text-decoration: none;font-weight: 600;}
div.speichern a:active {color: #FFF;text-decoration: none;font-weight: 600;}
div.speichern a:hover {color: #FFF;text-decoration: none;font-weight: 600;}

a.auswahl {
	border: 1px solid #a3a3a3;
	padding: 8px;
	border-radius: 5px;
	text-decoration: none;
	float: left;
	margin-left: 2px;	
}

a.auswahl:hover {
	background: #ffffff;
	border: 1px solid #333;
}


div.error {
	width: 200px;
	height: 800px;
	position: relative;
	color: #f0f3f4;
}

div.errormsg {
	width: 710px;
	padding: 20px;
	background-color: #ffe5e5;
	margin-bottom: 20px;
}

img.icon, img.img_navigation {
	position: relative;
	top:2px;
}

img.img_navigation {
	top:7px;
}

a.menu {
	color: #FFFFFF;
}

div.menu {
	width: 199px;
	float: left;
	height: 20px;
	background: #b8bba9;
	padding: 10px;
	margin-left: 1px;
	font-size: 15px;
	margin-bottom: 1px;
}

td.navigation.mobile div.menu {
	width: 19px;
}

div.menu:hover {
	background: #bfd25e;
	color: #FFF;
}

div.sub_menu, div.sub_menu_1 {
	width: 179px;
	float: left;
	height: 20px;
	background: #b1b1b1;
	padding: 10px;
	margin-left: 1px;
	font-size: 15px;
	margin-bottom: 1px;
	padding-left: 30px;
}

td.navigation.mobile div.sub_menu {
	width: 19px;
	padding-left: 10px;
}

div.sub_menu:hover, div.sub_menu_1:hover {
	background: #bfd25e;
	color: #FFF;
}

div.sub_menu_1 {
	background: #fafafa;
}

table.gesamtpreis {
	width:250px;
	text-align:right;
	float: right;
}

table.gesamtpreis td {
	width: 125px;
}

div.hightlight {
	width: auto;
	height: 150px;
	padding: 10px;
	float: left;
	background-color: #f8f8f8;
	margin-top: 20px;
	margin-bottom: 20px;
	margin-left: 20px;
}

div.status_balken {
	color: #FFF;
	background-image: url('images/status_balken.png');
	height: 18px;
	padding-top: 2px;
	text-align: center;
}

div.msg {
	background-color: #fff;
	border-left: 4px solid #7ad03a;
	-webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
	box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);	
	padding: 12px;
}

th.head_01, td.head_01 {
	padding-left: 10px;
	padding-top: 6px;
	border-right: 1px solid #F2F2F2;
	height: 20px;
	font-size: 15px;
	color: #333333;
	background: #d3d49f;
	font-weight: 100;
	text-align: left;
}

th.head {
	text-align: left;
	padding: 5px;
	background: #d3d49f;
	border-top:1px solid #F2F2F2;
	color: #5e5e5e;
	margin-right: 10px;		
}

td.hightlight1, td.hightlight3, td.hightlight2 {
	padding: 10px;
	background-color: #e9e9e9;
	border-right: 1px solid #F2F2F2;
}

td.hightlight2 { 
	background-color: #f9f9f9;
	
}

td.spacer {
	height: 1px;
}

table.hightlight {
	margin: 0px;
	padding: 0px;
	min-height: 100%;
	border-spacing: 0px;
	width: 640px;	
}

input.text, textarea.text {
	height: 25px;
	font-size: 14px;
	font-weight: 100;
	color: #696969;
}

div.kommentar {
	padding: 10px;
	background-color: #FFF;
	border: 1px solid #dfdfdf;
}

div.grid_view_content {
	width:650px;
}

div.grid_view {
	width: 160px;
	height: 210px;
	float: left;
	margin-left: 20px;
	border: 1px solid #d9d9d9;
	background-color: #fff;
	margin-top: 20px;
	text-align: center;
	padding: 20px;
	-webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
	box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);	
}

div.comment {
	color: #fff;
	background-image: url('images/icons_32x32/comment.png');
	background-size: contain;
	width: 20px;
	height: 20px;
	margin: auto;
}

div.comment_ina {
	color: #fff;
	background-image: url('images/icons_32x32/comment_ina.png');
	background-size: contain;
	width: 20px;
	height: 20px;
	margin: auto;
}


table.artikel_detail {
	width: 100%;
}

table.artikel_detail td {
	text-align: center;
	padding: 3px;
	background-color: #f2f2f2;
}

div.medien_thumbnail_main {
	width: 200px;
	float: left;
	margin-right: 10px;
	margin-top: 0px;
}

div.medien_thumbnail, div.medien_thumbnail_text {
	background: #ffffff;	
	width: 200px;
	height: 200px;
	background-position: center center;
	background-size: contain;
	border: 1px solid #d2d2d2;
	background-repeat: no-repeat;
}

div.medien_thumbnail_text {
	text-align: center;
	padding-top:90px;
	height: 110px;
}

div.medien_thumbnail_desc {	
	width: 180px;
	min-height: 60px;
	border: 1px solid #d2d2d2;
	border-top:0px;
	padding: 10px;
	background: #f9f9f9;
}


/* Auswahl Datei Radio Input */

.datei > input[type=radio]{
  display:none;
}
input[type=radio] + div{
  cursor:pointer;
  border:1px solid transparent;
}
input[type=radio]:checked + div{
  border:1px solid #f00;
}


/* TABS */ 

.tabs input[type=radio] {
      position: absolute;
      top: -9999px;
      left: -9999px;
  }
  .tabs {
	min-width: 756px; 
    float: none;
    list-style: none;
    position: relative;
    padding: 0;
    margin: 0px;
  }
  .tabs li{
    float: left;
  }
  .tabs label.tab {
      display: block;
      padding: 10px 20px;
      border-radius: 2px 2px 0 0;
      color: #08C;
      font-size: 24px;
      font-weight: normal;
      font-family: 'Open Sans', sans-serif;
      background: #d4d4d4;
      cursor: pointer;
      position: relative;
      top: 3px;
      -webkit-transition: all 0.2s ease-in-out;
      -moz-transition: all 0.2s ease-in-out;
      -o-transition: all 0.2s ease-in-out;
      transition: all 0.2s ease-in-out;
  }
  .tabs label.tab:hover {
    background: #b8b8b8;
    top: 0;
  }
   
  [id^=tab]:checked + label.tab {
    background: #FFF;
    color: #333;
    top: 0;
  }
   
  [id^=tab]:checked ~ [id^=tab-content] {
      display: block;
  }
  .tab-content{
    z-index: 2;
    display: none;
    text-align: left;
    width: 100%;
    padding-top: 10px;
    background: #ffffff;
    padding: 15px;
    color: #333;
    position: absolute;
    top: 53px;
    left: 0;
    box-sizing: border-box;
    -webkit-animation-duration: 0.5s;
    -o-animation-duration: 0.5s;
    -moz-animation-duration: 0.5s;
    animation-duration: 0.5s;
  }
  
  /* END TABS */ 
  
  
div.artikel_add {
	width: 100%;
	height: 370px;
	overflow: scroll;
}

table.kalender_artikel td {
	height: 30px;
	padding: 5px;
}

div.menu_title {
	display: inline;
}

div.artikel_rent {
    float: right;
    position: fixed;
    width: 300px;
    top: 198px;
    box-shadow: 0px 0px 2px 0px #848484;
    right: 1px;
    background: #dedede;
    padding: 10px;
}

div.artikel_rent ul li {
	
}


.showSingle:hover {
    cursor: pointer;
}

.targetDiv {
    display: none;
}

.img_box {
    width: 160px;
    height: 100px;
    background-size: cover;	
    background-position: center center;
}

img {
    image-orientation: from-image;
}

#mapid {
    height: 800px;	
}

.bilder {
	display: flex;
	justify-content: space-between;
	max-width: 100%;
	flex-wrap: wrap;
}

.bild {
    background: #333;
    padding: 10px;
    margin: 1.4% 0;
    flex: 3;
    width: 100%;
    height: auto;
    margin: 0 1%;
}

.bild img {
	width:100%;
	height: auto;	
}

.form_table {
	display: table;
    width: 100%;	
}

dl {
    margin-bottom:50px;
    display: table-row;        
}
 
dl dt {    
    color:#fff;
    float:left; 
    font-weight:bold; 
    margin-right:10px; 
    padding:5px;  
    width:100px; 
}
 
dl dd {
    margin:2px 0; 
	padding: 10px 10px;
	display: table-cell;    
	background-color: #e9e9e9;
	border: 1px solid #F2F2F2;
    vertical-align: top;	
}

dl.head dd {
	background: #bfd25e !important;
	color: #fff;
}

dl.dl_none dd {
	background: none;
	width: 100%;
}

#icon_overview {
	margin-right: 10px;
}

.form_table_overview dl.dl_none i.fas.fa-file-excel {
	color: #14981b;
	font-size: 20px;
	margin-top: 30px;			
}

.form_table_overview dl.dl_none i {
	color: #868686;
			
}

.form_table_overview dl, .form_table_overview dl dd {
	width: 14%;	
}

.form_table_overview.heading dl dd {
	width: 100%;
}

.article_description {
	display: none;
	
}

.filter {
	margin-top: 10px;
	display: flex;
}

.filter .button {
    background: #e4e4e4;
    padding: 5px 10px;
    margin-right: 10px;
	font-weight: bold;    
}

.filter .button:hover, .filter .button.active {
	background: #d2d2d2;
	text-decoration: none;
}


	@media only screen and
	(max-width:850px) { 
		div.menu_title, div.logo {
			display: none;
		}
		
		td.navigation, td.content {
			width: auto;
		}
		
		td.content {
			padding-left: 30px;
		}
		
		div.navigation_left {
			width: 40px;
		}
		
		div.menu, div.sub_menu, div.sub_menu_1 {
			width: 19px;
		}
		
		div.sub_menu, div.sub_menu_1 {
			padding-left: 10px;
		}
		
		div.artikel_rent {
			position: relative;
			top: auto;
			left: auto;
			margin-bottom: 40px;
			margin-top: 40px;
			width: auto;
			float: none;				
		}
		
		.form_table dl dd {
			margin: 0px;
		}
		
		.article_description { 
			display: inline;			
		}
		
		.form_table_overview dl.dl_none {
			justify-content: space-between;
		}
		
		.form_table_overview dl {			
			justify-content: space-between;
			width: 100%;
			display: flex;
			flex-wrap: wrap;
			justify-content: end;
			margin-bottom: 10px;			
		}
		
		.form_table_overview dl dd {
			width: auto;
		}
		
		.form_table_overview.heading dl dd {
			width: auto;
		}
		
		.form_table_overview {
			margin-top: 0px !important;
		}
		
		.form_table_overview.heading {
			margin-top: 56px;
		}
		
		.form_table_overview.heading dd {
			padding: 0px;
		}
				
		.form_table_overview dl dd.artikel_bezeichnung {
			width: 100%;
			font-size: 18px;
			background: none;	
			padding-left: 0px;		
		}
		
		dl dd { 
			display: block;
		}
		
		.bild {
		    flex: 2;		
		}
		
		dl.head dd {
			display: none;	
		}
		
		dd.title {
			width: 100%;			
		}
		
		dd.location, dd.tags, dd.tags, dd.location_edit_buttons {
			flex-grow: 1;
		}	
		
		dd.title a {
			font-size: 20px !important;
			display: block;
		}
		
		dd.location_edit_buttons {
			width: 10% !important;
		}
		
		input.text, textarea.text {
			width: 100%;
		}
		
	}

