/**
  * [Table of contents]
  *
  * 1. Body | html, body global tags
  * 2. Container | .container
  * 3. Brand | Logo
  * 4. Sidebar | .sidebar
  * 5. Navigation | .nav .navbar
  * 6. Info | .footer .info .error
  * 7. Button | .btn
  * 8. img Objects
  * 9. Responsive
  *   A. Max Width: 1366px
  *   B. Max Width: 1023px and Max Height: 839px
  *   C. Max Width: 479px and Max Height: 350px
  * 10. Icons
  * 11. Login
  *
  * Hauptfarben:
  * darkorange  #fd8a01 #f90 hsl(32,99%,49%) rgb(253,138,1)
  * kga-orange  #fd8e0a #f91 hsl(32,98%,51%) rgb(253,142,10)
  * olivedrab   #62be1e #6c2 hsl(94,72%,43%) rgb(98,190,30)
  * kga-green   #62bf1e #6c2 hsl(94,72%,43%) rgb(98,191,30)
  *
  * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

  html                { font-size: 16px;font-size: 1rem;font-family: z-IconPro-Light, Roboto, sans-serif, Arial; text-size-adjust: 100%; }
  head                { display: none; }
  comment             { display: none !important; }

 /* (1) Body
  * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

  body                { font-family:z-IconPro-Light;font-size:110%;font-size:1.1rem;font-weight:300;line-height:1.4; }
  body.admin          { font-family:z-IconPro-Light;/*padding-top:70px;*/padding-bottom:20px;margin-bottom:20px; }

  header              { justify-content: flex-start !important;background-color:#62bf1e !important; }
  header div          { grid-template-columns: 1fr 2fr !important; }
  #section_logo       { max-height:100px !important; }
  .section_logo       { display:block !important;top:0;left:0;overflow:hidden;pointer-events:none; }
  .section-height-default { 100%; }

  .button-label       { text-transform:uppercase;color:#f91;text-decoration:none; }
  .mh-100             { min-height:100% }

  @media (max-width: 767px) {
    .column-services  { margin-bottom:2em }
  }
  .btn-light          { color: #62bf1e }
  .hover-orange       { --bs-btn-hover-bg: #fd8e0a !important; --bs-btn-hover-border-color: #fd8e0a !important; }
  .hover-orange:hover { color: #fff !important }

  article-header      { background-color:#fff; margin-bottom:2em; }

  .visually-hidden    { clip: rect(0 0 0 0);clip-path: inset(50%);height: 1px;position: absolute;white-space: nowrap;overflow: hidden;width: 1px; }

  .h0                 { font-size: 3rem; }

  .fs                 { font-size: 1.1rem !important; }
  .fs-7               { font-size: .75rem !important; }
  .fs-8               { font-size: .5rem !important; }

  .br-0               { border-radius:0; }

  .custom-tooltip     { background-image: var(--bs-gradient); }

  a:hover, h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover { color: #62bf1e !important; }
  a, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: inherit; }

  .btn, button, input[type='button'], input[type='reset'], input[type='submit'] {
    letter-spacing: 0;color: #fff;
  }
  /*
  .btn {
    background-color: #62bf1e;
    border-color: #62bf1e;
  }
  .btn:hover, button:hover, button--primary:hover { background-color: #fd8e0a; border-color: #fd8e0a; color: #fff !important; }*/
  .comments-button    { background-color: #a1a2a4; border-color: #a1a2a4; }

  .column.col-50,.column[data-col="50"] { min-width:50%; }
  .column:first-child { /* Selektor angepasst an deinen Code */
  position: relative; /* Notwendig für die Positionierung des Pseudo-Elements */
  padding: 1em; /* Fügt einen Innenabstand für den eigentlichen Inhalt hinzu */
  }
  .column-services:first-child::before {
    content: '';position: absolute;top: 0;left: 1em;right: 1em;bottom: 0;
    background-image: url('https://schau.ins.land/static/theme/SchauInsLand/uploads/home-1.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    z-index: -1; /* Sorgt dafür, dass das Hintergrundbild hinter dem Inhalt liegt */
  }
  .column-services    {
    background-size: cover; /* Optional: Passt das Bild an die Größe des Containers an */
    background-repeat: no-repeat; /* Optional: Verhindert die Wiederholung des Bildes */
    background-position: center; /* Zentriert das verkleinerte Bild */
    /*z-index: -1; / * Sorgt dafür, dass das Hintergrundbild hinter dem Inhalt liegt */
  }
  .column-services h2 { padding: 1em; }
  .column-services p  { margin-bottom: 2em;padding: 0 0 0 2em; }
  .column-services a  { margin-left: 2em; }
  .column-services.col-50:first-child {
    flex-direction: column; /* Ordnet die Elemente untereinander an */
  }
  .column-services.col-50:first-child h2,
  .column-services.col-50:first-child p {
    width: 55%; /* Begrenzt die Breite auf 50% */
  }

  .slider-title       { text-align: center;font-family: "z-IconPro-Light", Sans-serif;font-size: 5rem;font-weight: 500;line-height: 1.2em;
                        padding: 0px 0px 1px 0px;margin: 0px 0px 0px 0px;color: #fff; }
  .slider-desc        { align-self: center;text-align: center;font-family: "z-IconPro-Light", Sans-serif;font-size: 1.5rem;font-weight: 500;
                        text-transform: uppercase;line-height: 1.2em;margin: 0px 0px 8px 0px;color: #fff; }
  .slider-button      {}
  .btn-primary, .slider-button { background-color: #62bf1e; }
  .btn-primary:hover, .slider-button:hover { background-color: #fd8e0a; color:#fff;}
  .button-label       { text-transform: uppercase;color:#fd8e0a;text-decoration:none; }
  .btn-light          { color: #62bf1e; }
  .hover-orange       { --bs-btn-hover-bg: #fd8e0a !important; --bs-btn-hover-border-color: #fd8e0a !important; }
  .hover-orange:hover { color: #fff !important; }
  .toggle-button      { background-color: transparent !important; }

  .wbi { height:72px !important;width:72px !important; display:flex;align-items:center;justify-content:center; }

  .text-blue { color:darkblue;}
  .text-deco { text-decoration:none; }

 /* (2) Container
  * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

  .icon               { min-width:1rem; min-height:1rem;white-space: nowrap;border:0 none; }
  .social-icon        { float: left; }
  .social-icon:after  { content: "\00a0 \00a0"; }
  .social-icon:last-child:after { content: ""; }

  .post-thumbnail     { width: 100%; max-height: 430px; -o-object-fit: cover; object-fit: cover; }


 /* (3) Brand
  * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
  
  #logo               { position:relative;z-index:1;margin:2rem 0 -1.5rem -1.5rem !important; font-family:z-IconPro-Light; font-weight:700; transform:rotate(-6deg); }
  #logo:hover         { border-color: #62bf1e !important; }
  #logo a             { padding:5px; color: #ccc; text-decoration:none; border:3pt solid; border-radius:.25em; }
  #logo a:hover       { color:#62bf1e !important; border:3pt solid #62bf1e !important; }

  .copyleft           {transform: rotateX(180deg);display: inline-block;transform: scaleX(-1);filter: FlipH;-ms-filter: "FlipH"; }


 /* (4) Sidebar
  * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

  .sidebar            { margin-top:0; min-width:25% !important;border-radius:0 !important;}
  .sidebar .card      { border-radius:0 !important;}
  .sidebar p,
  .sidebar ul         { line-height:175%;text-decoration:none;}
  .sidebar a          { text-decoration:none !important;}


 /* (5) Navigation
  * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */



 /* (6) Info
  * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */



 /* Error Message
  * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */



 /* (7) Objects
  * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

  .fineliner  { background:url(../../../assets/images/svg/fineliner.svg) no-repeat;
                background-size:cover;width:10px;height:178px;position:absolute;top:50%;left:50%;margin:-190px 0 0 -234px;transform:rotate(34deg);filter:drop-shadow(3px 6px 0 rgba(0,0,0,.1)); }
  .pencil     { background:url(../../../assets/images/svg/pencil.svg) no-repeat;
                background-size:cover;width:9px;height:156px;position:absolute;top:50%;left:50%;margin:-150px 0 0 -230px;transform:rotate(36deg);filter:drop-shadow(3px 6px 0 rgba(0,0,0,.1)); }
  .coffee     { background:url(../../../assets/images/svg/whiteCoffee.svg) no-repeat;
                background-size:cover;width:159px;height:159px;position:absolute;top:50%;left:50%;margin-top:10px;margin-left:140px;filter:drop-shadow(0 5px 0 rgba(0,0,0,.1)); }


 /* (7) Button
  * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */



  .erbtn    { bottom:0;position:absolute;left:50%;margin-left:-96px;margin-bottom:25px;
              font-family:'z-IconPro-Light',sans-serif;text-transform:uppercase;
              border:none;transition:all .2s;
              animation-name:blinker;animation-duration:1.5s;animation-timing-function:linear;animation-iteration-count:infinite;
  }

  @keyframes blinker {
    0%    { opacity:1 }
    50%   { opacity:.3 }
    100%  { opacity:1 }
  }
  .erbtn-link { color:#b2b2b2; }
  .erbtn-link:hover,.erbtn-link:focus { color:#b2b2b2; }


 /* (9) Responsive
  * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* A */
@media (max-width: 1366px) {
  .fineliner { width:10px;height:178px;top:50%;left:50%;margin:-190px 0 0 -234px; }
  .pencil    { width:9px;height:156px;top:50%;left:50%;margin:-150px 0 0 -230px; }
  .coffee    { width:159px;height:159px;top:50%;left:50%;margin-top:10px;margin-left:140px; }
}
/* B */
@media (max-width: 1023px),(max-height: 839px) {
  .fineliner { width:6px;height:116px;top:50%;left:50%;margin:-125px 0 0 -180px;filter:drop-shadow(3px 4px 0px rgba(0,0,0,.1)); }
  .pencil    { width:6px;height:105px;top:50%;left:50%;margin:-105px 0 0 -175px;filter:drop-shadow(3px 4px 0px rgba(0,0,0,.1)); }
  .coffee    { width:105px;height:105px;top:50%;left:50%;margin-top:10px;margin-left:120px;filter:drop-shadow(0px 4px 0px rgba(0,0,0,.1)); }
}
/* C */
@media (max-width: 479px),(max-height: 350px) {
  .erbtn     { margin-bottom:15px; }
 
  .fineliner { width:4px;height:80px;top:50%;left:50%;margin:-116px 0 0 -117px;filter:drop-shadow(2px 3px 0px rgba(0,0,0,.1)); }
  .pencil    { width:4px;height:80px;top:50%;left:50%;margin:-104px 0 0 -113px;filter:drop-shadow(2px 3px 0px rgba(0,0,0,.1)); }
  .coffee    { width:80px;height:80px;top:50%;left:50%;margin-top:-22px;margin-left:60px;filter:drop-shadow(0px 4px 0px rgba(0,0,0,.1)); }
}
@media (max-width: 767px) {
  .column-services  { margin-bottom:2em; }
}

 /* (10) Icons
  * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/*  @import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"); */

  @font-face  { 
    font-family: "z-IconPro-Light";
    src: url("../fonts/z-Icon/z-IconPro-Light.woff2?v=1.2.0") format("woff2"),
    url("../fonts/z-Icon/z-IconPro-Light.woff?v=1.2.0") format("woff"),
    url("../fonts/z-Icon/z-IconPro-Light.ttf?v=1.2.0") format("truetype"),
    url("../fonts/z-Icon/z-IconPro-Light.svg?v=1.2.0#z-icons") format("svg");
    font-weight: normal; font-style: normal;
  }

  .icon               { min-width:1rem; min-height:1rem;white-space: nowrap;border:0 none;}
  .social-icon        { float: left; }
  .social-icon:after  { content: "\00a0 \00a0"; }
  .social-icon:last-child:after { content: ""; }


 /* (11) Login
  * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */