html,body,input,textarea,select,tr,td{font-family:arial,arial;color:#555555;font-size:15px;}
html,body{padding:0px;margin:0px;background-color:#fff;}


body{
/*  background-image: linear-gradient(to right,#ccc 0%, white 5%, white 80%, white 95%,#ccc 100%);*/
}

.mittig{width:800px;margin:auto auto;}
.breit{width:98%;padding:10px;}

a{color:#00AD43;text-decoration:none;}
a.kw_link{font-size:30px;font-weight:bold;}
hr{clear:both;height:0px;border-top:3px solid #F5AB08;}


/* alignments: */
.clear,.c{clear:both }
.l{float:left;}
.r{float:right;}
.tr{text-align:right;}
.tl{text-align:left;}

#tagesreporting tr:nth-of-type(odd){background-color:#eee;}
#kal tr:nth-of-type(odd){background-color:#eee;}

#left
{
width:100%;
left:0px;
}

.flexi{display:flex;justify-content:space-between;align-items:center;width:100%;}

.grid{
  display:flex;
  flex-flow: row wrap;
  justify-content:space-between;
  align-content:stretch;
}
.grid > div{margin-bottom:20px;min-width:40%;}
.grid5050 > div{width:50%;}
.grid4060 > div:nth-of-type(odd){width:60%;}
.grid4060 > div:nth-of-type(even){width:40%;}

/* Header */
#header{display:table;}
#logo{width:140px;padding:20 0 20 0;}
#navi_balken{background-color:#00AD43;padding:10px;margin-bottom:30px;border-top:5px solid #f68712;}

#navi_inner a,#navi_mobil a{text-transform:uppercase;color:#fff;}
#navi_inner a:hover,#navi_inner .aktiv,#navi_mobil a:hover{color:#F5AB08;}
#header_icons
{
  text-transform:uppercase;font-size:18px;color:#F5AB08;
  display:flex;justify-content:space-between;align-items:center;width:335px;
  flex-flow: row wrap;
}
#header_icons a{font-size:12px;text-align:center;line-height:20px;color:#F5AB08;visibility:hidden;}
#header_icons img{width:40px;}

.header_icons_right{cursor:pointer;}

#vglportal_mobil{display:none;color:#fff;text-transform:uppercase;text-align:center;}

/* mobile Navi */
#menu_button{display:none;font-size:40px;padding-right:10px;cursor:pointer;}
#navi_mobil{display:none;z-index:1002;height:100%;overflow-y:scroll;position:fixed;right:0px;top:0px;background-color:#00AD43;padding:5px;border:1px solid #F5AB08;border-radius:0px 0px 0px 10px;}
#navi_mobil a{display:block;padding:10px;font-size:20px;}
#navi_mobil a:hover{background-color:#B0E9C7;}
#navi_mobil i{width:20px;text-align:center;}
#x_mobil{text-align:right;font-size:30px;padding:10px;cursor:pointer;color:#fff;}

/* Ende Header */

#content{min-height:50%;}
.thumb{height:80px;margin:0 10 10 0;float:left;}
.contentbild{width:50%;min-width:250px;}

/* anbieter ICONS */
.anbieter{height:40px;float:left;margin-right:10px;margin-bottom:10px; opacity: 0.6;}
.anbieter:hover{opacity: 1;}

/* Footer */
#footer{margin-top:30px;background-color:#00AD43;color:#fff;}
#footer,#footer2{padding:10px;}
#footer2{background-color:#353535;color:#fff;padding-bottom:50px;}
#footer2 a{color:white;}

#to_top_link{text-align:center;color:white;}
#to_top_link i{font-size:50px;}

.start_tab td
{
  vertical-align: middle;
  text-align: center;
}

/* Kacheln */
.kachel{
 display:inline-block;
 width:49%;
 text-align: center;
 background-color:#ddd;
 margin-bottom:18px;
}

.kachel:nth-of-type(odd) {
  float:left;
}
.kachel:nth-of-type(even) {
  float:right;
}

.kachel img{
  opacity: 1;
  width:100%;
}
.kachel img:hover{
  opacity: 0.4;
}

.kachel .label{
  position:relative;
  z-index:1000;
  margin-top:-100px;
  border-radius:20px;
  padding:20px;
  display:inline-block;
  width:80%;
  align:center;
  background-color:#F5AB08;
  color:white;
  font-size:20px;
  text-transform:uppercase;
}
/* Kacheln Ende */

#katbild{width:100%;margin-bottom:10px;}

#slider_tablet{margin-left:220px;border:0px solid red;}
#slider_wrapper{
  width:312px;float:right;
  /* NUR Wegen Tablet: */
  position:relative;z-index:1000;margin-top:-475px;
}

#startseite_text{position:relative;margin-top:-500px;width:400px;border:0px solid red;}

#slider_img{width:325px;height:245px;overflow-y:hidden;border:0px solid blue;}
.slider_img{display:none;width:100%;border:0px solid red;}
#slider_navi{display:flex;justify-content:space-around;padding:0px;font-size:20px;}
#slider_navi a{color:#F5AB08;}

FOR_GOOGLE_MATERIAL_span{
display: inline-flex;
align-items: center;
}

/* Tabellen: */
th{text-align:left;background-color:#F5AB08;color:#fff;padding:5px;}
th a{color:white;}
td{padding:5px;}

/* Formulare und Buttons */
input[type=text],input[type=date],input[type=password],select,textarea{width:180px;padding:3px;border:1px solid #00AD43;border-radius:2px;box-shadow: 0px 3px 5px #888888;margin:0 0 5 0;}
textarea{width:300px;}
input[type=text].prio{width:50px;text-align:center;}
select{font-weight:bold;}
input:disabled{background-color:#aaa;}

.button,button,input[type=submit],input[type=button]
{
  border:0px;font-size:15px;cursor:pointer;line-height:20px;color:#fff;background-color:#F5AB08;font-weight:bold;padding:5 10 5 10;box-shadow: 3px 3px 5px #000000;margin:0;
  white-space: nowrap;
}
.button:active,button:active,input[type=submit]:active,input[type=button]:active
{
  box-shadow: 0px 0px 0px #888888;
}

.zahlfeld,.preisfeld{text-align:center;align-items:center;
  width:60px !important;
}


.zeitfeld{width:50px !important;}

div.hinweis,div.fehler{background-color:#B9FFB9;font-weight:bold;display:block;text-align:left;padding:12px;border:2px solid #00ff00;border-radius:7px;margin-bottom:10px;}
div.fehler{background-color:#FEC6C6;border:2px solid #ff0000;}

#verdunklung{display:none;position:fixed;top:0px;left:0px;height:100%;z-index:1001;width:100%;background-color:#000000;opacity:0.5;}

#kontaktformular{width:100%;max-width:340px;padding:10px;border-radius:10px;background-color:#FFE29E;}

#bestellformular{width:93%;max-width:340px;padding:10px;border-radius:10px;background-color:#FFE29E;}
#bestellformular input[type=text]{width:100%;}

/* Malert (Popup) */
#malert_aussen{display:none;position:fixed;top:0px;left:0px;height:100%;z-index:999;width:100%;background-color:#000000;opacity:0.5;}
#malert_innen{left: 50%;transform: translateX(-50%);-webkit-transform: translate(-50%, 0%);display:none;color:#444444;position:fixed;top:20px;width:90%;max-width:500px;z-index:1000;padding:20px;background-color:#FAFAFA;border-radius:5px;box-shadow: 3px 3px 5px #000000;max-height:80%;overflow-y:scroll;}
#malert_x{float:right;cursor:pointer;font-size:30px;margin-left:-30px;}
#malert_inhalt{height:calc(100% - 1px);display:block;overflow:auto;color:#444444;}

#malert_innen {
  -ms-overflow-style: none;  // IE 10+
  overflow: -moz-scrollbars-none;  // Firefox
}
#malert_innen::-webkit-scrollbar {
  display: none;  // Safari and Chrome
  width: 0px;  /* remove scrollbar space */
  background: transparent;  /* optional: just make scrollbar invisible */
}

#kal{cursor: pointer;}
#kal input{border-style:solid;width:110px;-webkit-appearance: none;box-shadow: inset 0px 0px 0px 0px red;}
.kal_tr:hover{opacity: 0.8;}
.kal_tr td{display:table-cell;text-align:center;height:50px;}
.kal_gelb{background-color:#F5AB08;}
.kal_rot{background-color:red;}
.kal_gruen{background-color:green;color:#fff;}
.kal_blau{background-color:blue;color:#fff;}
.kal_lila{background-color:purple;color:#fff;}
.kal_grau{background-color:#ccc;}
.kal_orange{background-color:#e2711d;}

.rot{color:red;}
.gruen{color:green;}

/* Warenkorb */

#warenkorb{cursor:pointer;float:right;color:#00AD43;font-size:20px;white-space:nowrap;}
#warenkorb_inner{display:inline !important;}

/* Ende Warenkorb */

/* im Adminbereich bei Kundendaten */
.block{border:1px solid #F5AB08;padding:5px;margin:0 10 10 0;float:left;}

.anbieterh2{color:#00AD43;}

@media(max-width: 1100px)
{
  /* bei 1000 P schon Tablet mit Arm weg */
  #slider_wrapper{width:100%;margin-top:0px;padding-left:0px;}
  #slider_img{height:auto;width:100%;}
  #slider_tablet{display:none;}
  #startseite_text{position:relative;margin-top:0px;width:100%;}
}

@media(max-width: 850px)
{
  body{background-image: none;}
  .no_mobile{display:none;}
  #header_icons{display:none;}
  .header_icons_right{display:none;}

  #navi_inner{display:none;}
  #menu_button{display:table-cell;}
  .mittig{width:100%;margin:0px;padding:0px;}
  #content{display:table-cell;padding:0 10 0 10;}
  .kachel{
    display:block;
    width:100%;
  }
  #logo{width:20%;padding:10 0 10 10;}

  #kontaktformular{width:95%;float:left;}

  #vglportal_mobil{display:block;}
  #footer2{display:none;}

  .grid5050 div{width:100%;}
  .grid4060 div{width:100%;}

  /*input[type=text]{width:100%;}*/
}