/* ==========================================================================
   PICHLER SYSTEMTECHNIK -- Split von style.css, Teil 5/6: Komponenten
   Quelle: style.css Zeilen 2182-3278 (unveraendert, keine Selektoren umbenannt)
   Formulare, Buttons, Suchwidget, Accordion/Collapse, Modal, Pagination/Glossar — im Vault nicht als eigene Kategorie benannt, daher ehrlich als eigener Block statt falsch einsortiert.
   ========================================================================== */


@media(min-width: 769px)
{
  .ce-column,.ce-uploads-img-link
  {
    padding-right: var(--gutter);
  }

  .ce-intext [data-ce-columns="1"] .ce-column
  {
    padding-right: 0;
  }

  .ce-column
  {
    margin-bottom: var(--base-size);
  }

  .ce-intext .ce-gallery
  {
    width: 50%;
  }

  .ce-intext.ce-nowrap>.ce-bodytext
  {
    width: 50%;
  }

  .ce-intext.ce-left .ce-gallery
  {
    margin-right: var(--gutter-half);
  }

  .ce-intext.ce-left .ce-column
  {
    padding-right: var(--gutter-half);
  }

  .ce-left.ce-nowrap .ce-gallery
  {
    margin-right: calc(-1*var(--gutter-half));
    margin-left: 0;
  }

  .ce-left.ce-nowrap .ce-bodytext
  {
    padding-left: var(--gutter);
  }

  .ce-right.ce-nowrap.ce-intext .ce-gallery
  {
    margin-left: calc(-1*var(--gutter-half));
    margin-right: 0;
  }

  .ce-right.ce-nowrap .ce-bodytext
  {
    padding-right: var(--gutter);
  }

  .ce-intext.ce-right .ce-gallery
  {
    margin-left: var(--gutter-half);
  }

  .ce-intext.ce-right .ce-column
  {
    padding-left: var(--gutter-half);
  }

  .ce-above .ce-gallery,.ce-below .ce-gallery
  {
    margin-right: calc(-1*var(--gutter));
  }

  .ce-right.ce-above,.ce-right.ce-below
  {
    margin-left: calc(-1*var(--gutter));
    margin-right: 0;
  }
}

@media(max-width: 1024px)
{
  [data-ce-columns="2"] .ce-column:nth-child(odd)
  {
    clear: left;
  }
}

.ce-gallery.imagesize25
{
  width: 25%;
}

.ce-nowrap .ce-gallery.imagesize25+.ce-bodytext
{
  width: calc(75% - var(--gutter));
}

.ce-center.ce-above .ce-gallery.imagesize25,.ce-center.ce-below .ce-gallery.imagesize25
{
  margin-left: auto;
  margin-right: auto;
}

.ce-gallery.imagesize33
{
  width: 33.33333%;
}

.ce-nowrap .ce-gallery.imagesize33+.ce-bodytext
{
  width: calc(66.6666% - var(--gutter));
}

.ce-center.ce-above .ce-gallery.imagesize33,.ce-center.ce-below .ce-gallery.imagesize33
{
  margin-left: auto;
  margin-right: auto;
}

figure,.wrapper-tooltip
{
  min-height: var(--base-size);
  position: relative;
}

figure .tooltip,.wrapper-tooltip .tooltip
{
  position: absolute;
  left: 2px;
  top: 2px;
  right: 0;
}

figure .tooltip span,.wrapper-tooltip .tooltip span
{
  border-radius: 50%;
  display: block;
  line-height: 1rem;
  width: 1rem;
  height: 1rem;
  font-size: 1rem;
  text-align: center;
  background: var(--black, #000);
  color: var(--white, #fff);
  transition: .25s;
  cursor: pointer;
}

figure .tooltip span::after,.wrapper-tooltip .tooltip span::after
{
  font-size: var(--font-size-small);
  line-height: var(--line-height-small);
  text-align: left;
  position: absolute;
  text-shadow: none;
  color: var(--font-color);
  left: var(--gutter);
  top: calc(-1*var(--base-size));
  max-width: 80%;
  display: block;
  content: attr(data-tooltip);
  opacity: 0;
  -webkit-transition: all var(--transition);
  -moz-transition: all var(--transition);
  -ms-transition: all var(--transition);
  -o-transition: all var(--transition);
  transition: all var(--transition);
  z-index: 100;
  background: var(--white-opacity, rgba(255, 255, 255, 0.8980392157));
  padding: var(--gutter-quarter);
}

@media(prefers-reduced-motion: reduce)
{
  figure .tooltip span::after,.wrapper-tooltip .tooltip span::after
  {
    transition: none;
  }
}

figure .tooltip span:focus::after,figure .tooltip span:hover::after,.wrapper-tooltip .tooltip span:focus::after,.wrapper-tooltip .tooltip span:hover::after
{
  opacity: 1;
  top: -2px;
}

.rte-icon
{
  position: relative;
  margin-left: calc(var(--gutter)*1.5);
  display: block;
}

.rte-icon::before
{
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  text-align: center;
  display: inline-block;
  width: calc(var(--gutter)*1.5);
  font-size: inherit;
  line-height: inherit;
  position: absolute;
  left: calc(var(--gutter)*-1.5);
}

.ce-row .inclmeta
{
  display: inline-block;
}

fieldset
{
  padding: 0;
  margin: 0;
  border: 0;
}

.form-group
{
  margin-bottom: var(--base-size);
}

label
{
  display: inline-block;
}

legend
{
  display: block;
  width: 100%;
  font-weight: bold;
}

fieldset>div
{
  margin-bottom: var(--base-size);
}

input,textarea,select[multiple],label
{
  width: 100%;
}

input,textarea,select[multiple]
{
  background-color: #fff;
  border: var(--border-width, 1px) solid var(--border-color);
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
  -webkit-transition: box-shadow ease-in-out .15s;
  transition: box-shadow ease-in-out .15s;
  padding-top: calc(var(--base-size-half) - var(--border-width));
  padding-bottom: calc(var(--base-size-half) - var(--border-width));
  padding-left: var(--gutter-half);
  padding-right: var(--gutter-half);
  display: inline-block;
}

input[type=search]
{
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

input[type=file]
{
  display: block;
}

textarea
{
  min-height: calc(var(--base-size)*8);
}

.content-main [type=submit]
{
  padding-left: var(--gutter);
  padding-right: var(--gutter);
  margin-top: var(--base-size);
  margin-bottom: var(--base-size);
  min-width: 50%;
}

.content-main .input-group-btn [type=submit]
{
  margin: 0;
}

input[type=checkbox],input[type=radio]
{
  border: 0;
  height: auto;
  display: inline-block;
  width: auto;
  vertical-align: baseline;
  margin: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  padding: 0;
}

input[type=tel]
{
  width: 50%;
  min-width: 240px;
}

.radio span,.checkbox span
{
  padding-left: var(--gutter-half);
}

input[type=radio]+label
{
  display: inline;
  padding-left: var(--gutter-half);
}

.input-group
{
  position: relative;
  display: table;
  border-collapse: separate;
  width: 100%;
}

.content-main .input-group
{
  margin-bottom: var(--base-size);
}

.input-group-btn,.input-group input
{
  display: table-cell;
  vertical-align: middle;
}

.input-group-btn
{
  width: 1%;
}

.input-group-btn,.input-group-btn input
{
  position: relative;
  white-space: nowrap;
}

.input-group input:first-child
{
  margin-right: var(--gutter);
}

select[multiple],select[size]
{
  height: auto;
}

select optgroup
{
  font-family: inherit;
  font-size: inherit;
  font-style: inherit;
}

select::-ms-expand
{
  display: none;
}

select
{
  width: 100%;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  border: var(--border-width, 1px) solid var(--border-color);
  padding-top: calc(var(--base-size-half) - var(--border-width));
  padding-bottom: calc(var(--base-size-half) - var(--border-width));
  padding-left: var(--gutter-half);
  padding-right: var(--gutter-double);
  border-radius: 0;
  background-color: #fff;
  background-image: linear-gradient var(--white, #fff),var(--white, #fff) 0%,linear-gradient(-135deg, transparent 50%, var(--white, #fff) 50%),linear-gradient(-225deg, transparent 50%, var(--white, #fff) 50%),linear-gradient(var(--white, #fff) 42%, var(--body-link-color) 42%);
  background-repeat: no-repeat;
  background-size: 1px 100%,2.25rem 2.25rem,2.25rem 2.25rem,2.25rem 100%;
  background-position: right center,right bottom,right bottom,right bottom;
  -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)
{
  select
  {
    transition: none;
  }
}

select:hover,select:active
{
  background-image: linear-gradient var(--body-link-color),var(--body-link-color),linear-gradient(-135deg, transparent 50%, var(--body-link-color) 50%),linear-gradient(-225deg, transparent 50%, var(--body-link-color) 50%),linear-gradient(var(--body-link-color) 42%, var(--white, #fff) 42%);
}

select[multiple]
{
  background-image: none;
}

button,.btn
{
  display: inline-block;
  font-weight: normal;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  width: auto;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -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)
{
  button,.btn
  {
    transition: none;
  }
}

.btn[class*=btn-]
{
  padding-top: calc(var(--base-size-half) - var(--border-width));
  padding-bottom: calc(var(--base-size-half) - var(--border-width));
  padding-left: var(--gutter-half);
  padding-right: var(--gutter-half);
}

.btn-primary
{
  background: var(--button-bg);
  color: var(--button-color);
  border: var(--border-width, 1px) solid var(--button-border);
}

.btn-primary:hover,.btn-primary:focus
{
  background: var(--button-hover-bg);
  color: var(--button-hover-color);
  border-color: var(--button-hover-border);
}

.btn-secondary
{
  color: var(--button2-color);
  background: var(--button2-bg);
  border: var(--border-width) solid var(--button2-border);
}

.btn-secondary:hover,.btn-secondary:focus
{
  background: var(--button2-hover-bg);
  color: var(--button2-hover-color);
  border-color: var(--button2-hover-border);
}

.btn-thirdary
{
  border: var(--border-width, 1px) solid var(--border-color);
  color: var(--font-color-light);
}

.btn-thirdary:hover,.btn-thirdary:focus
{
  border-color: var(--button-hover-border);
}

table
{
  border-collapse: collapse;
  border-spacing: 0;
  max-width: 100%;
  width: 100%;
  margin: 0 0 var(--base-size) 0;
  border: var(--border-width) solid var(--table-border-color);
  border-bottom-width: 0;
}

th,td
{
  padding: calc(var(--base-size-half) - var(--border-width)) var(--gutter-quarter) var(--base-size-half) var(--gutter-quarter);
  border-bottom: var(--border-width) solid var(--table-border-color);
  text-align: left;
  vertical-align: top;
  -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)
{
  th,td
  {
    transition: none;
  }
}

th
{
  padding-top: var(--base-size-half);
  font-family: var(--font-family-bold);
  font-weight: var(--font-weight-bold);
  font-variation-settings: var(--font-variation-settings-bold);
}

tr:hover td,tr:focus td
{
  background: var(--table-hover-bg);
  color: var(--table-hover-color);
}

.table-responsive,.frame-type-table
{
  margin-bottom: var(--base-size);
  overflow-x: auto;
  overflow-y: hidden;
}

th
{
  background: var(--table-header-bg);
  color: var(--table-header-color);
}

table caption
{
  padding: var(--base-size-quarter);
}

.wrapper-search
{
  max-width: 100%;
  background: var(--menu-bg);
  height: var(--mobile-header-height);
  z-index: 200;
  position: absolute;
  top: calc(var(--header-height)*-1);
  left: 0;
  right: var(--base-size-triple);
  -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-search
  {
    transition: none;
  }
}

.wrapper-search .input-group input
{
  display: inline-block;
  width: 100%;
}

.wrapper-search button
{
  width: var(--base-size-double);
  height: var(--base-size-double);
}

.wrapper-search.visible
{
  top: 0;
}

.wrapper-search.visible>div
{
  padding: 0 0 0 var(--gutter);
}

.wrapper-search fieldset>div
{
  padding-bottom: .5rem;
  margin: 0;
}

@media screen and (min-width: 769px)
{
  .wrapper-search
  {
    background: var(--header-bg-overlay);
    align-items: center;
    height: var(--header-service-height);
  }

  .wrapper-search button
  {
    background: var(--header-button-bg);
    color: var(--header-button-color);
    border-color: var(--header-button-border);
  }

  .wrapper-search button:hover,.wrapper-search button:focus
  {
    background: var(--header-button-hover-bg);
    color: var(--header-button-hover-color);
    border-color: var(--header-button-hover-border);
  }

  .wrapper-search.visible>div
  {
    width: calc(15*var(--gutter));
    padding: 0 0 0 var(--gutter);
  }
}

.search-hide-btn
{
  padding: var(--base-size-quarter) 0;
  width: var(--base-size-double);
  display: inline-block;
  cursor: pointer;
  color: var(--header-link-color);
  -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)
{
  .search-hide-btn
  {
    transition: none;
  }
}

.search-hide-btn.active .fa-search:before
{
  content: "";
}

.search-hide-btn:hover,.search-hide-btn:focus
{
  color: var(--header-link-hover-color);
}

.page-searchresult .search-hide-btn
{
  display: none;
}

.tx-indexedsearch-info>dt
{
  float: left;
  clear: left;
  width: 25%;
  overflow: hidden;
  -ms-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tx-indexedsearch-info>dd
{
  margin-left: 25%;
}

.tx-indexedsearch-res span
{
  display: inline-block;
}

.tx-indexedsearch-res
{
  border-bottom: var(--border-width, 1px) solid var(--border-color);
  margin-bottom: var(--base-size);
}

.frame-collapsemobile button
{
  cursor: text;
}

.accordion>header,.frame-collapse>header
{
  cursor: pointer;
  position: relative;
  background: var(--toggle-bg);
  padding: var(--base-size-half) var(--gutter-triple) var(--base-size-half) var(--gutter);
  min-height: var(--base-size-double);
  margin-bottom: var(--base-size);
}

.accordion>header>*,.frame-collapse>header>*
{
  margin: 0;
}

.accordion>header:hover,.accordion>header:focus,.frame-collapse>header:hover,.frame-collapse>header:focus
{
  color: var(--body-link-color);
}

.accordion>header button,.frame-collapse>header button
{
  border-style: none;
  display: block;
  width: 100%;
  text-align: left;
}

.accordion>header button::-moz-focus-inner,.frame-collapse>header button::-moz-focus-inner
{
  border: 0;
}

.accordion>header button[aria-expanded=false]::before,.frame-collapse>header button[aria-expanded=false]::before
{
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";
  transform: rotate(180deg);
}

.accordion.container,.width-max>.frame-collapse
{
  padding-bottom: 0;
}

.accordion>header button:before,.frame-collapse>header button:before
{
  content: "";
  display: inline-block;
  font-family: "Font Awesome 5 Free";
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  vertical-align: 0;
  overflow: hidden;
  position: absolute;
  right: var(--gutter);
  top: var(--base-size-half);
  margin: 0;
  font-weight: 900;
  font-size: var(--font-size2);
  -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)
{
  .accordion>header button:before,.frame-collapse>header button:before
  {
    transition: none;
  }
}

@media(max-width: 768px)
{
  .frame-collapsemobile>header *,.frame-collapse>header *
  {
    margin: 0;
  }
}

@media(max-width: 1024px)
{
  .width-max>.frame-collapsemobile
  {
    padding-bottom: 0;
  }

  .frame-collapsemobile>header
  {
    cursor: pointer;
    position: relative;
    background: var(--toggle-bg);
    padding: var(--base-size-half) var(--gutter-triple) var(--base-size-half) var(--gutter);
    min-height: var(--base-size-double);
    margin-bottom: var(--base-size);
  }

  .frame-collapsemobile>header>*
  {
    margin: 0;
  }

  .frame-collapsemobile>header:hover,.frame-collapsemobile>header:focus
  {
    color: var(--body-link-color);
  }

  .frame-collapsemobile>header button
  {
    border-style: none;
    display: block;
    width: 100%;
    text-align: left;
  }

  .frame-collapsemobile>header button::-moz-focus-inner
  {
    border: 0;
  }

  .frame-collapsemobile>header button[aria-expanded=false]::before
  {
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";
    transform: rotate(180deg);
  }

  .frame-collapsemobile>header button::before
  {
    content: "";
    display: inline-block;
    font-family: "Font Awesome 5 Free";
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    vertical-align: 0;
    overflow: hidden;
    position: absolute;
    right: var(--gutter);
    top: var(--base-size-half);
    margin: 0;
    font-weight: 900;
    font-size: var(--font-size2);
    -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(max-width: 1024px)and (prefers-reduced-motion: reduce)
{
  .frame-collapsemobile>header button::before
  {
    transition: none;
  }
}

@media(max-width: 1024px)
{
  .frame-collapsemobile button
  {
    cursor: pointer;
  }
}

.modal
{
  display: none;
  position: fixed;
  z-index: 1000;
  padding: 0;
  left: 0;
  top: 0;
  width: 100%;
  max-width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0,0,0,.4);
}

.modal-content
{
  position: relative;
  background-color: var(--white, #fff);
  margin: auto;
  padding: var(--base-size) var(--gutter) 0 var(--gutter);
  border: var(--border-width, 1px) solid var(--border-color);
  width: 100%;
  max-width: 1280px;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,.2),0 6px 20px 0 rgba(0,0,0,.2);
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: .4s;
  animation-name: animatetop;
  animation-duration: .4s;
}

@media(min-width: 769px)
{
  .modal
  {
    padding: var(--base-size-half) var(--gutter);
  }

  .modal-content
  {
    width: 80%;
    padding: var(--base-size) var(--gutter-double);
  }
}

@-webkit-keyframes animatetop
{
  from
  {
    top: -300px;
    opacity: 0;
  }

  to
  {
    top: 0;
    opacity: 1;
  }
}

@keyframes animatetop
{
  from
  {
    top: -300px;
    opacity: 0;
  }

  to
  {
    top: 0;
    opacity: 1;
  }
}

.modal-close
{
  color: var(--body-link-color);
  float: right;
  position: absolute;
  right: var(--gutter-half);
  top: var(--base-size-half);
}

.modal-close:hover,.modal-close:focus
{
  color: var(--body-link-hover-color);
  text-decoration: none;
  cursor: pointer;
}

.alert
{
  text-align: center;
  background: var(--gray5, #eee);
  border: var(--border-width) solid var(--font-color);
  padding: var(--base-size) var(--gutter);
  margin-bottom: var(--base-size);
  color: var(--black, #000);
}

.bg-error,.alert.alert-error
{
  background: var(--error-light, #fff2f2);
  border: var(--border-width) solid var(--error, #ba0202);
}

.bg-valid,.alert.alert-valid
{
  background: var(--valid-light, #e8f6e7);
  border: var(--border-width) solid var(--valid, #5abc55);
}

.bg-warning,.alert.alert-warning
{
  background: var(--warning-light, #fffae8);
  border: var(--border-width) solid var(--warning, #ffc800);
}

.bg-information,.alert.alert-information
{
  background: var(--information-light, #ecf5fe);
  border: var(--border-width) solid var(--information, #0080ff);
}

.f3-widget-paginator,.glossary-alphabet
{
  display: block;
  margin: 0;
  padding: 0;
  list-style: none;
}

.f3-widget-paginator>li,.glossary-alphabet>li
{
  display: inline-block;
  margin-bottom: 0;
  padding-bottom: 0;
  text-align: center;
}

.f3-widget-paginator>li>a,.f3-widget-paginator>li>span,.glossary-alphabet>li>a,.glossary-alphabet>li>span
{
  position: relative;
  padding: 0 var(--gutter-quarter);
  min-width: var(--gutter-double);
  text-decoration: none;
  margin: 0 2px var(--base-size-half) 0;
  line-height: var(--base-size-double);
  border: var(--border-width, 1px) solid var(--border-color);
  border-radius: var(--border-radius);
  background-color: var(--white, #fff);
  display: inline-block;
}

.f3-widget-paginator>li>a,.glossary-alphabet>li>a
{
  font-family: var(--font-family-bold);
}

.f3-widget-paginator>li.active span,.f3-widget-paginator>li.current a,.f3-widget-paginator>li>a:hover,.f3-widget-paginator>li>a:focus,.glossary-alphabet>li.active span,.glossary-alphabet>li.current a,.glossary-alphabet>li>a:hover,.glossary-alphabet>li>a:focus
{
  background-color: var(--body-link-hover-color);
  color: #fff;
}

.glossary-alphabet
{
  margin-bottom: var(--base-size);
}

.glossary-alphabet a.disabled
{
  color: var(--font-color-light);
  cursor: auto;
}

.glossary-alphabet a.disabled:hover,.glossary-alphabet a.disabled:focus
{
  background-color: var(--white, #fff);
  color: var(--font-color-light);
}

.tx-indexedsearch-browsebox ul
{
  display: inline-block;
  margin: 0 0 var(--base-size) 0;
  padding-left: 0;
  font-size: 80%;
}

.tx-indexedsearch-browsebox li
{
  display: inline-block;
  margin-bottom: 0;
  padding-bottom: 0;
}

.tx-indexedsearch-browsebox li a
{
  position: relative;
  float: left;
  padding: 3px 6px;
  margin-left: -1px;
  text-decoration: none;
  border: var(border-width, 1px) solid var(--border-color);
  background-color: #fff;
}

.tx-indexedsearch-browsebox li.current,.tx-indexedsearch-browsebox li>a:hover,.tx-indexedsearch-browsebox li>a:focus
{
  background-color: var(--body-link-hover-color);
  color: #fff;
}

.tx-indexedsearch-browsebox li:first-child>a,.tx-indexedsearch-browsebox li.current:first-child
{
  margin-left: 0;
}
