/* ==========================================================================
   PICHLER SYSTEMTECHNIK -- Split von style.css, Teil 3/6: Header Legacy
   Quelle: style.css Zeilen 848-1404 (unveraendert, keine Selektoren umbenannt)
   Seitenstruktur (wrapper-card/content/footer, width-max, skip-to-content), Header-Bereich, Hero-Basis, horizontales Nav-Menue, Rootline, Sprachmenue.
   ========================================================================== */

/*
#.height-100>div
#{
#  margin-bottom: var(--base-size);
#}
*/
.height-100>.frame
{
  -moz-box-flex: 100%;
  -webkit-flex: 100%;
  -ms-flex: 100%;
  flex: 100%;
  position: relative;
  min-height: 1px;
  padding-right: var(--gutter);
  padding-left: var(--gutter);
}

.wrapper-card
{
  height: 100%;
  overflow: hidden;
}

.card-text
{
  padding: var(--base-size-half) 0 0 0;
  padding-left: 8px;
  padding-right: 5px;
  padding-bottom: 5px;
}

.card-text p
{
  color: var(--font-color);
  margin: 0;
}

html,body
{
  height: 100%;
  width: 100%;
}

body
{
  background-color: var(--body-bg-color);
  box-sizing: border-box;
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  flex-direction: column;
}

.wrapper-content
{
  flex: 1;
}

.wrapper-footer
{
  flex: 0;
}

.width-max
{
  max-width: 1280px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.skip-to-content
{
  position: absolute;
  top: var(--borderwidth);
  left: var(--gutter);
  transform: translateY(-100%);
  transition: transform .3s;
  z-index: 100;
}

.skip-to-content:focus
{
  transform: translateY(0%);
}

.content-header
{
  background: var(--header-bg-color);
  color: var(--header-color);
}

.content-header .wrapper-header
{
  align-items: center;
}

.content-header .header-service
{
  align-items: center;
  height: var(--nav-header-height);
  -webkit-transition: all var(--transition);
  -moz-transition: all var(--transition);
  -ms-transition: all var(--transition);
  -o-transition: all var(--transition);
  transition: all var(--transition);
}

@media(prefers-reduced-motion: reduce)
{
  .content-header .header-service
  {
    transition: none;
  }
}

.wrapper-logo img
{
  height: var(--header-service-height);
  width: auto;
  -webkit-transition: all var(--transition);
  -moz-transition: all var(--transition);
  -ms-transition: all var(--transition);
  -o-transition: all var(--transition);
  transition: all var(--transition);
}

@media(prefers-reduced-motion: reduce)
{
  .wrapper-logo img
  {
    transition: none;
  }
}

@media(max-width: 768px)
{
  .header-service
  {
    background: var(--menu-bg);
  }

  div.wrapper-logo
  {
    margin: 0 auto;
    text-align: center;
  }

  div.wrapper-logo img
  {
    display: inline-block;
    height: var(--mobile-logo-height);
  }
}

@media(min-width: 769px)
{
  .content-header .header-service
  {
    height: var(--header-service-height);
  }
}

.header-image img
{
  width: 100vw;
}

.content-main
{
  padding-top: var(--base-size);
  padding-bottom: var(--base-size);
}

@media screen and (max-width: 768px)
{
  .content-main
  {
    padding-top: var(--base-size);
  }
}

.header-image .ce-column
{
  padding: 0;
  margin-bottom: 0;
}

.header-image .ce-column img
{
  width: 100vw;
}

.header-image .ce-above .ce-gallery
{
  margin-right: 0;
}

.content-footer
{
  background: var(--footer-bg);
  color: var(--footer-color);
}

.content-footer2
{
  background: var(--footer2-bg);
  color: var(--footer2-color);
}

@media screen and (min-width: 769px)
{
  .header-fixed .content-header
  {
    position: fixed;
    z-index: 1000;
    left: 0;
    right: 0;
  }

  .header-fixed.scroll-fixed .header-service,.header-fixed.scroll-fixed .wrapper-search
  {
    height: var(--header-height-fixed);
  }

  .header-fixed.scroll-fixed .wrapper-logo
  {
    height: var(--header-height-fixed);
  }

  .header-fixed.scroll-fixed .wrapper-logo img
  {
    height: var(--header-height-fixed);
  }

  .header-fixed main
  {
    padding-top: var(--header-height);
  }

  .header-fixed .anker
  {
    position: absolute;
    margin-top: calc(-6*var(--base-size));
  }
}

.frame-type-heroimage
{
  position: relative;
}

.frame-type-heroimage a.btn
{
  text-shadow: none;
}

.frame-type-heroimage .hero-text
{
  padding: var(--base-size-half) var(--gutter-half) var(--base-size) var(--gutter-half);
}

.frame-type-heroimage .hero-text a:not(.btn)
{
  color: var(--hero-text-dark);
}

.frame-type-heroimage .hero-text a:not(.btn):hover,.frame-type-heroimage .hero-text a:not(.btn):focus
{
  color: var(--hero-text-dark);
}

.frame-type-heroimage.frame-layout-0 .hero-text
{
  text-shadow: var(--hero-text-shadow-light);
}

.frame-type-heroimage.frame-layout-0 .hero-text *
{
  color: var(--hero-text-dark);
}

.frame-type-heroimage.frame-layout-400 .hero-text
{
  background: var(--hero-text-bg-light);
}

.frame-type-heroimage.frame-layout-402 .hero-text
{
  background: var(--hero-text-bg-dark);
}

.frame-type-heroimage.frame-layout-402 .hero-text *
{
  color: var(--hero-text-light);
}

.frame-type-heroimage.frame-layout-402 .hero-text a:not(.btn)
{
  color: var(--hero-text-light);
}

.frame-type-heroimage.frame-layout-402 .hero-text a:not(.btn):hover,.frame-type-heroimage.frame-layout-402 .hero-text a:not(.btn):focus
{
  color: var(--hero-text-light);
}

.frame-type-heroimage h1,.frame-type-heroimage h2,.frame-type-heroimage p
{
  margin-bottom: var(--base-size-half);
}

.frame-type-heroimage h1:last-of-type,.frame-type-heroimage h2:last-of-type,.frame-type-heroimage p:last-of-type
{
  margin-bottom: 0;
}

@media screen and (min-width: 481px)
{
  .frame-type-heroimage .hero-text
  {
    position: absolute;
    z-index: 1;
    top: var(--base-size-half);
    left: 0;
    max-width: 100%;
    max-height: calc(100% - (var(--base-size-half)));
    overflow: hidden;
    padding: var(--base-size-eighth) var(--gutter-half) var(--base-size) var(--gutter-half);
  }

  .frame-type-heroimage.frame-layout-401 .hero-text
  {
    text-shadow: var(--hero-text-shadow-dark);
  }

  .frame-type-heroimage.frame-layout-401 .hero-text *
  {
    color: var(--hero-text-light);
  }

  .frame-type-heroimage.frame-layout-401 .hero-text a:not(.btn)
  {
    color: var(--hero-text-light);
  }

  .frame-type-heroimage.frame-layout-401 .hero-text a:not(.btn):hover,.frame-type-heroimage.frame-layout-401 .hero-text a:not(.btn):focus
  {
    color: var(--hero-text-light);
  }

  .frame-type-heroimage.frame-center .hero-text
  {
    left: 50%;
    transform: translate(-50%, 0);
  }

  .frame-type-heroimage.frame-right .hero-text
  {
    right: var(--gutter);
  }
}

@media screen and (min-width: 769px)
{
  .frame-type-heroimage .hero-text
  {
    max-width: 80%;
    width: auto;
    left: var(--gutter);
  }
}

@media screen and (min-width: 1025px)
{
  .frame-type-heroimage .hero-text
  {
    max-height: 80%;
    padding: var(--base-size-half) var(--gutter) var(--base-size) var(--gutter);
    max-width: 66%;
    left: var(--gutter-double);
  }

  .frame-type-heroimage.frame-right .hero-text
  {
    right: var(--gutter-double);
    left: auto;
  }
}

@media screen and (min-width: 1281px)
{
  .frame-type-heroimage .hero-text
  {
    top: 20%;
    max-width: 50%;
  }
}

@keyframes fadeIn
{
  0%
  {
    opacity: 0;
  }

  100%
  {
    opacity: 1;
  }
}

.fadeIn
{
  animation: fadeIn 1.5s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  -moz-animation: fadeIn 1.5s;
  -webkit-animation: fadeIn 1.5s;
  -o-animation: fadeIn 1.5s;
  visibility: visible !important;
}

@media(prefers-reduced-motion: reduce)
{
  .fadeIn
  {
    -webkit-animation: none;
    animation: none;
    opacity: 1;
  }
}

.fade
{
  visibility: hidden;
}

@media(prefers-reduced-motion: reduce)
{
  .fade
  {
    visibility: visible;
  }
}

ul.horizontal
{
  list-style: none;
  margin: 0;
  padding: 0;
  display: inline-block;
}

ul.horizontal li
{
  margin: 0;
  padding: 0;
  display: inline-block;
}

ul.horizontal li a,ul.horizontal li>span
{
  padding: var(--base-size-half) var(--gutter-half);
  display: inline-block;
}

nav ul.horizontal li:after
{
  content: "|";
}

nav ul.horizontal li:first-child:before
{
  content: "|";
}

.rootline
{
  color: var(--font-color-light);
  font-size: var(--font-size-small);
  padding-left: var(--gutter);
}

@media(min-width: 1296px)
{
  .rootline
  {
    padding-left: 0;
  }
}

ul.horizontal.languagemenu .text-muted span
{
  color: var(--font-color-light);
}

ul.horizontal.languagemenu .text-muted,ul.horizontal.languagemenu .active
{
  display: none;
}

@media screen and (min-width: 769px)
{
  ul.horizontal.languagemenu
  {
    margin-right: var(--gutter);
  }

  ul.horizontal.languagemenu .active,ul.horizontal.languagemenu .text-muted
  {
    display: inline-block;
  }
}

@media screen and (min-width: 769px)
{
  .onelevel-mdup ul#main-menu ul,.onelevel-mdup ul#main-menu .sub-arrow
  {
    display: none !important;
    visibility: hidden;
  }
}

html
{
  font-size: var(--base-html-size-small);
}

@media(min-width: 769px)
{
  html
  {
    font-size: var(--base-html-size-medium);
  }
}

@media(min-width: 1281px)
{
  html
  {
    font-size: var(--base-html-size-large);
  }
}

body,input,textarea,select
{
  font-size: var(--body-font-size, 1rem);
  line-height: var(--base-size);
  font-family: var(--font-family-normal);
  color: var(--font-color);
  font-weight: var(--font-weight-normal);
  font-variation-settings: var(--font-variation-settings);
}