
@font-face
{
 font-family:FrutigerLight;
 font-weight:400;
 font-style:normal;
 src:url(fonts/frutiger-light.woff2) format("woff2"),
 url(fonts/frutiger-light.woff) format("woff")
}

@font-face
{
 font-family:FrutigerBold;
 font-weight:400;
 font-style:normal;
 src:url(fonts/frutiger-bold.woff2) format("woff2"),
 url(fonts/frutiger-bold.woff) format("woff")
}

*
{
  margin: 0;
  padding:0;
}

html, body
{
  margin:0 auto 0 auto;
  font-family: FrutigerLight,Verdana,Tahoma,sans-serif;
  -webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
  -webkit-text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
  font-size:12pt;
  color:#404040;
  line-height:1.75em;
  background-color:#ffffff;
  position:relative;
}

body
{
  position:relative;
/*  min-width:600px; */
  max-width:1600px;
  min-height:100vh; /* ! iOS & Zoom ! */
}

a
{
  color:rgb(55, 66, 74);
}

a:hover
{
  color:rgb(152, 30, 50);
}

tr.summary:hover
{
  background-color:transparent !important;
}

span.summary
{
  display:inline-block;
  font-size:1em;
  padding-top:1em;
  font-style:italic;
}

::placeholder
{
  font-style:italic;
  color:#C0C0C0;
  opacity: 1;
}

:-ms-input-placeholder
{
  font-style:italic;
  color:#C0C0C0;
}

::-ms-input-placeholder
{
  font-style:italic;
  color:#C0C0C0;
}

.mobile
{
  display:none;
}

.desktop
{
  /*display:inherit;*/
}

.wait
{
  background:url(../img/wait.gif) 50% 50% no-repeat;
  color:transparent !important;
}

busy
{
  display:none;
  position:fixed;
  height:48px;
  width:48px;
  left:50vw;
  top:50vh;
  margin:-24px 0 0 -24px;
  background:url(../img/loading.gif) 50% 50% no-repeat;
}

.template
{
  display:none;
}

.content-zone
{
  display:block;
  position:relative;
  box-sizing:border-box;
  width:100%;
  padding:0 5% 0 5%;
}

.content-zone.header
{
  position:relative;
  height:auto;
  min-height:2em;
  line-height:2em;
  text-align:right;
  vertical-align:middle;
  color:#fff;
  background-color:#076538;
  font-size:1em;
}

.content-zone.header > header
{
  position:relative;
  display:block;
}

.content-zone.header.logo
{
  background:#076538 url(../img/logo_header.svg) 10px 45% no-repeat;
  background-size:auto 32px;
  padding-left:78px;
  padding-right:1em;
}

.content-zone.header.logo.admin
{
  background-color:rgb(211, 0, 56);
}

.content-zone.header .menu
{
  display:inline-block;
  list-style-type:none;
  color:#fff;
  min-height:30px;
  float:left;
}

.content-zone.header .menu>span
{
  display:none;
}

.content-zone.header .menu ul
{
  background-color:#076538;
}

.content-zone.header .menu li
{
  position:relative;
  min-width:100px;
  display:inline-block;
  text-align:center;
  font-weight:bold;
  white-space:nowrap;
  cursor:pointer;
}

.content-zone.header .menu li>ul
{
  display:none;
  clear:both;
  position:absolute;
  top:2.4em;
  left:0;
  width:auto;
  height:auto;
  z-index:1000000;
}

.content-zone.header .menu li>ul li
{
  display:block;
}

.content-zone.header .menu li:hover
{
}

.content-zone.header .menu li>ul:hover,
.content-zone.header .menu li:hover>ul
{
  display:block;
}

.content-zone.header .menu a
{
  display:block;
  color:#fff;
  padding:0.2em 0.5em 0.2em 0.5em;
  text-decoration:none;
}

.content-zone.header .menu a:hover
{
  background-color:#0B9552;
}

.content-zone.header .menu a:hover,
.content-zone.header .menu a:visited
{
  color:#fff;
}

footer
{
  display:block;
  width:100%;
  height:70px;
}

.burger-menu
{
  position:absolute;
  display:inline-block;
  height:0;
  overflow:hidden;
  list-style-type:none;
  padding-top:1.5em;
  -webkit-user-select:none;
/*  background:url(../img/burger_menu_white.svg) right top no-repeat; */
/*  background-size:1.1em 1.1em; */
}

.burger-menu .glyph
{
  position:absolute;
  top:0;
  left:0;
  cursor:pointer;
}

.burger-menu .glyph.right-align
{
  top:0.15em;
  right:0.3em;
}

.burger-menu:hover, .burger-menu.expanded
{
  height:auto;
  overflow:visible;
  z-index:10000;
}

.burger-menu li
{
  border:1px solid #c0c0c0;
  background-color:#fff;
  padding:0.3em 0.6em 0.3em 0.6em;
  line-height:1.5rem;
  font-size:1rem;
  font-family: FrutigerLight,Verdana,Tahoma,sans-serif;
  cursor:pointer;
}

.burger-menu li:hover
{
  background-color:#e0e0e0;
}

.burger-menu li.disabled
{
  pointer-events:none !important;
  color:#c0c0c0;
}

.burger-menu li:first-child,
.burger-menu li:nth-child(2)
{
  border-bottom:none !important;
}

.burger-menu li:last-child
{
  border-top:none;
}

.herde button.herde
{
  box-sizing: border-box;
  -webkit-box-sizing:border-box;
  -moz-box-sizing: border-box;
  font-size:1rem !important;
  font-family: inherit !important;
  font-weight:normal;
  padding:0.2rem 1rem 0.2rem 1rem;
  border:1px solid #96765A;
  border-radius:0.2em;
  cursor:pointer;
  -webkit-appearance:none !important;
  -moz-appearance:none !important;
  appearance:none !important;
}

button.herde.save
{
  padding:0.2rem 1rem 0.2rem 32px;
  background:url(../img/save-regular.svg) 0.2rem 55% no-repeat;
  background-size:18px 18px;
}

button.herde.cancel
{
  padding:0.2rem 1rem 0.2rem 32px;
  background:url(../img/cancel-solid.svg) 0.3rem 55% no-repeat;
  background-size:16px 16px;
}

button.herde.reload
{
  padding:0.2rem 1rem 0.2rem 32px;
  background:url(../img/sync-solid.svg) 0.4rem 50% no-repeat;
  background-size:16px 16px;
}

button.herde.passvisible
{
  padding:0.2rem 1rem 0.2rem 32px;
  background:url(../img/eye-regular.svg) 0.4rem 50% no-repeat;
  background-size:16px 16px;
}

button.herde.passvisible.not
{
  background-image:url(../img/eye-slash-solid.svg);
}

button.herde.changepass
{
  padding:0.2rem 1rem 0.2rem 32px;
  background:url(../img/key-regular.svg) 0.4rem 50% no-repeat;
  background-size:16px 16px;
}

button.herde.admin
{
  padding:0.2rem 1rem 0.2rem 32px;
  background:url(../img/admin.png) 0.4rem 50% no-repeat;
  background-size:16px 16px;
}

button.herde.small
{
  padding:0.2rem 0.7rem 0.2rem 0.7rem;
  background-position:50% 50%;
}

button.herde.small:before
{
  content:"\00a0 ";
}

.herde button.herde:hover, .herde button.herde.checked
{
  background-color:#E5DBD3;
}

.herde button.herde:focus, .herde button.herde:active
{
  background-color:transparent !important;
}

.herde button.herde::selection
{
  background-color:transparent !important;
}

.herde button.herde:disabled
{
  cursor:default;
  opacity: 0.5;
}

.herde button.herde:disabled:hover
{
  background-color:transparent;
}

dialog, .modal
{
  position:fixed;
  display:block;
  box-sizing:border-box;
  text-align:center;
  left:0px;
  top:0px;
  height:100%;
  width:100%;
  min-width:fit-content;
  min-height:fit-content;
  border:none;
  background-color: rgba(100, 100, 100, 0.5);
  z-index:100000;
}

dialog>div
{
  display:inline-block;
  position:relative;
  margin:4em auto 0 auto;
  text-align:left;
  padding:0.5em 1em 0.5em 1em;
  background-color: rgba(255, 255, 255, 1);
}

dialog h1
{
  font-size:1.5em;
}

#login
{
  color:#fff;
}

teaser
{
  display:block;
  position:relative;
  font-size:3.2vw;
  font-weight:bold;
  text-align:center;
  line-height:1em;
  padding-top:10%;
}

teaser .wartung
{
  font-size:1.8rem;
  color:#D5006A;
  line-height:1.8rem;
  margin-bottom:2em;
  font-weight:bold;
}

teaser img
{
  display:inline;
  width:60%;
  height:auto;
  margin-bottom:2em;
  max-width:640px;
}

teaser.wartung > img, teaser.wartung > span
{
	opacity:0.1;
}

#wartungsmeldung
{
	font-weight:bold;
	text-align:center;
	color:#ff0000;
}

@media print
{
  .toolbar, .header
  {
    display:none;
  }
}

@media only screen and (min-width:1600px)
{
  teaser
  {
    font-size:3.2em;
  }
}

@media only screen and (max-width:1024px)
{
  teaser
  {
  }
}

@media only screen and (max-width:750px)
{
  teaser
  {
    font-size:1.5em;
  }
}

@media only screen and (max-width:750px) and (orientation:landscape)
{
}

@media only screen and (max-width:530px)
{
  .content-zone.header.logo
  {
    background-position:45px 45%;
    padding-right:0;
  }

  .content-zone.header ul.menu
  {
    margin-left:-78px;
    /*background:url(img/burger.svg) 0 0 no-repeat;
    background-size: 20px 20px;*/
  }

 .content-zone.header ul.menu>span
  {
    display:block !important;
    position:absolute;
    font-size:1.5em;
    text-align:left;
    left:10px;
    top:-1.2em;
    height:2em;
    width:78px;
    margin-bottom:1.5em;
    z-index:1000010;
  }

  .content-zone.header ul.menu
  {
    position:absolute;
    left:0;
    margin-top:2.3em;
    background-color:#076538;
    z-index:1000000;
  }

  .content-zone.header ul.menu li
  {
    display:none;
    float:left;
    clear:both;
  }

  .content-zone.header ul.menu:hover,
  .content-zone.header ul.menu:hover>li,
  .content-zone.header ul.menu>span:hover
  {
    display:block;
  }

  .content-zone.header ul.menu:hover>li.sub
  {
    display:inline-block !important;
  }

  .content-zone.header ul.menu li
  {
    min-width:150px;
    z-index:100100;
  }

  .content-zone.header ul.menu li.sub>*
  {
    display:inline-block;
  }

  .content-zone.header ul.menu li.sub:hover
  {
    background-color:#0B9552;
  }

  .content-zone.header ul.menu li>ul li
  {
    display:none;
  }

  .content-zone.header ul.menu li>ul
  {
    display:none;
    position:absolute;
    top:auto;
    left:auto;
    width:auto;
    height:auto;
    margin-left:33px;
  }

  .content-zone.header .menu li.sub:hover>ul,
  .content-zone.header .menu li.sub:hover>ul li
  {
    display:inline-block;
  }

  dialog>div
	{
		width:90%;
		min-width:fit-content;
	}

  dialog table
	{
		width:100%;
	}
}

@media only screen and (max-width:320px)
{

  body
  {
    min-width:320px;
  }

  teaser
  {
    font-size:1.5em;
  }

}