/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Adapted 4 curiopia Ammerland
 Author:       Tom Usborne / Stefan Niemeyer
 Author URI:   https://curiopia.de
 Template:     generatepress
 Version:      2.0
*/
/* AMMERLAND AMMERGRUEN CURIOPIA
-------------------------------------------------------------- */
/*  FONTS
-------------------------------------------------------------- */

@font-face{
  font-family:"Manchego";
  src:url("Fonts/manchego.woff2") format("woff2")
}

@font-face {
font-family:"Heading";
src:url("Fonts/HeadingNow.woff2") format("woff2")
}
@font-face {
  font-family:"Mark regular";
  src:url("Fonts/mark-regular.woff2") format("woff2")
  }


    /* Ammergrün Font-Icons
-------------------------------------------------------------- */
@font-face {
  font-family: 'ammergruen';
  src:  url('Fonts/ammergruen.eot?5r7nyd');
  src:  url('Fonts/ammergruen.eot?5r7nyd#iefix') format('embedded-opentype'),
    url('Fonts/ammergruen.ttf?5r7nyd') format('truetype'),
    url('Fonts/ammergruen.woff?5r7nyd') format('woff'),
    url('Fonts/ammergruen.svg?5r7nyd#ammergruen') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'ammergruen' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-flower-2-black:before {
  content: "\e90e";
}
.icon-flower-3-black:before {
  content: "\e90f";
}
.icon-flower-black:before {
  content: "\e910";
}
.icon-circle-dot-solid:before {
  content: "\e911";
}
.icon-circle-solid:before {
  content: "\e912";
}
.icon-phone:before {
  content: "\e900";
}
.icon-neutral:before {
  content: "\e901";
}
.icon-richtig:before {
  content: "\e902";
}
.icon-glocke:before {
  content: "\e903";
}
.icon-abreise:before {
  content: "\e904";
}
.icon-anreise:before {
  content: "\e905";
}
.icon-calendar-uhrzeit:before {
  content: "\e906";
}
.icon-calendar:before {
  content: "\e907";
}
.icon-check:before {
  content: "\e908";
}
.icon-info:before {
  content: "\e909";
}
.icon-mail:before {
  content: "\e90a";
}
.icon-location:before {
  content: "\e90b";
}
.icon-koffer:before {
  content: "\e90c";
}
.icon-user:before {
  content: "\e90d";
}



/* NUR ZUR PRE_SEITE
-------------------------------------------------------------- */





/* Inline-Headlines mit Background
-------------------------------------------------------------- */
.gb-headline-white-bg {
  display: inline;
  background-color: var(--ammer-white);
  padding: .3em .3em .1em .3em;
      -webkit-box-decoration-break: clone;
      box-decoration-break: clone;
      border-radius: 0 6px 6px 0px;
  }
  
  .gb-headline-black-bg {
    display: inline;
    background-color: var(--ammer-black);
    color: var(--ammer-white);
    padding: .3em .3em .1em .3em;
        -webkit-box-decoration-break: clone;
        box-decoration-break: clone;
    }

    .gb-headline-darkred-bg {
      display: inline;
      background-color: var(--ammer-darkred);
      color: var(--ammer-white);
      padding: .3em .3em .1em .3em;
          -webkit-box-decoration-break: clone;
          box-decoration-break: clone;
      }
      .gb-headline-green-bg {
        display: inline;
        background-color: var(--ammer-green);
        color: var(--ammer-white);
        padding: .3em .3em .1em .3em;
            -webkit-box-decoration-break: clone;
            box-decoration-break: clone;
            border-radius: 0 6px 6px 0px;
        }




/* Header beim Scrollen
----------------------------------------------------------
      .header-wrap {
        z-index: 10000;
    }
---- */
/* Listings
-------------------------------------------------------------- */

.entry-content ul li {
  list-style-type:none;
  margin-bottom:.4rem;
}
.entry-content ul li:before {    
font-family: 'ammergruen';
content: "\e908";
margin:0 10px 0 -28px;
color: var(--ammer-green)
}

.entry-content .flower li:before {    
  font-family: 'ammergruen';
  content: "\e910";
  margin:0 10px 0 -28px;
  color: var(--ammer-black)
  }

  .entry-content ol li::marker {
    color: var(--ammer-black);
  }

  /* Header-Logo ammer
-------------------------------------------------------------- */



  /* Startseite Header ausblenden
-------------------------------------------------------------- */


.sticky-enabled .main-navigation:not(.is_stuck) {
  opacity: 0;
  pointer-events: none;}



  /* Grüner Menübutton
-------------------------------------------------------------- */
.greenmenu {
  background-color: var(--ammer-green);
}


/* Mobile Ansicht und Border Galerien
-------------------------------------------------------------- */

.wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) {
  width: calc(100% - var(--wp--style--unstable-gallery-gap, 16px)/2);
  }
  
  figure.wp-block-gallery.has-nested-images {
  border: 15px solid #fff;
  }
  
  .whiteborder img {
  border: 4px solid var(--juist-white)
  }
  


/* Unterstrich bei Links
-------------------------------------------------------------- */
.entry-content p a, .entry-content p a:visited {
  border-bottom: 1px solid var(--ammer-black);
  padding-bottom: 1px;
}
.entry-content p a:focus, .entry-content p a:hover {
  border-bottom: 1px solid var(--ammer-darkred);
}

/* Space bei Wilderness
-------------------------------------------------------------- */
.gb-headline-wilderness {
  margin-bottom: 0.2em;
}
/* Space bei Container im Text (Bilder etc)
------------------------------------------------------------
.gb-container {
  margin-bottom: 30px;
}-- */
/* Space im Primary Submenu
-------------------------------------------------------------- */
.main-navigation ul ul {
  padding: 10px 0 10px 0;
}

.toggled .icon-menu-bars svg:nth-child(1) {
  display: inherit !important;
  color: var(--ammer-black)
}


/* Zitate
-------------------------------------------------------------- */

cite, dfn, em, i, blockquote {
  font-style: normal;
}

blockquote {
  border-left: 0px;
  padding: 30px 0 0 20px;
  margin: 2em 1em;
  position: relative;
  max-width: 500px;
}

blockquote:before {
  font-family: 'trawo';
  content: "\e904";
  font-size: 1em;
}

blockquote p {
  margin-bottom: 0.1em;
  margin-top: 0.4em;
}





/* Formidable Forms
-------------------------------------------------------------- */

      .fieldicon {
        position: relative;
        top: 1px;
        display: inline-block;
        font-family: 'trawo';
        font-style: normal;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        color: var(--juist-gold);
        -moz-osx-font-smoothing: grayscale;
        margin: 0 6px;
      }
      
      .icon-mail:before {
        content: "\e90a";
      }
      
      .icon-user:before {
        content: "\e90d";
      }

      .icon-phone:before {
        content: "\e900";
      }
  
      .with_frm_style .frm_inline_box {
        border-right: 1px solid var(--ammer-white)!important;
        }

        .with_frm_style .frm_radio input[type=radio], .with_frm_style .frm_checkbox input[type=checkbox] {
          border: 2px solid currentColor !important;
      }
      .with_frm_style .vertical_radio .frm_checkbox label, .with_frm_style .vertical_radio .frm_radio label {
        padding-left: 26px !important;
        text-indent: -27px !important;
    }



    /* Scroll down animation Page Hero
-------------------------------------------------------------- */

.mousewheel #wheel {
	animation: scrollwheel ease 1.5s infinite;
}

@keyframes scrollwheel {
	0% {
		transform: translateY(0);
	}
	30% {
		transform: translateY(100px);
	}
}


  /* Scroll Progress Bar
-------------------------------------------------------------------- */

.header {
  position: fixed;
  bottom: 0;
  z-index: 100;
  width: 100%;
  background-color: var(--ammer-white)
}

.progress-container {
  width: 100%;
  height: 8px;
  background: var(--ammer-white)
}

.progress-bar {
  height: 8px;
  background: var(--ammer-darkred);
  width: 0%;
}

/* Fix scrollling background images on high-res touch devices
-------------------------------------------------------------- */

@media (pointer:coarse) {
  .gb-container:before {
      background-attachment: initial !important
  }}




/* FACET LISTINGS
-------------------------------------------------------------- */

/* Facet WP Anpassung der Columns bei der Blog-Ansicht
-------------------------------------------------------------- */

  .generate-columns-container:not(.masonry-container) {
    display: block !important;
    margin-left: 0;
}
@media(min-width: 769px) {
    .generate-columns-container:not(.masonry-container) .facetwp-template {
        display: flex;
        flex-wrap: wrap;
        align-items: stretch;
    }
    
    .generate-columns-container .facetwp-template {
        margin-left: -40px;
    }
}

.post-type-archive-ammerland .facetwp-template, .tax-ammercat .facetwp-template {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: center;
}

.post-type-archive-ammerland .grid-container, .tax-ammercat .grid-container {
  max-width: 1150px;
}

/* Facet WP Ansichten und Anordnung des Auswahlmenues/Sidebar
-------------------------------------------------------------- */

@media (min-width: 780px) {
  .facetwp-flyout-open {
      display: none;
  }
}
@media (max-width: 780px) {
  #facet-desk {
      display: none;
  }
}
@media(max-width: 768px) {
  .left-sidebar .site-content {
      display: flex;
      flex-direction: column-reverse;
  }
}

.facetwp-flyout-open {
  background-color: var(--ammer-black);
  color: var(--ammer-white);
}

/* Horizontale Darstellung der Listen
-------------------------------------------------------------- */
#facet-desk .facetwp-facet {
  display: flex;
  flex-wrap: wrap;
}

.blog .grid-container, .home .grid-container {
  max-width: 1250px;
  padding: 10px;
}



/* Horizontale Optik der Radio-Buttons
-------------------------------------------------------------- */
.facetwp-radio {
  background-size: 0px!important;
  padding-left: 8px!important;
  padding-right: 8px!important;
  cursor: pointer;
  background-color: var(--ammer-white)!important;
  color: var(--ammer-green);
  border: 2px solid var(--ammer-green);
  border-radius: 4px;
  margin: 5px
}

.facetwp-radio.checked, .facetwp-radio:hover {
  background-size: 0px;
  background-color: var(--ammer-green)!important;
  padding-left: 8px!important;
  padding-right: 8px!important;
  color: var(--ammer-white);
  border: 2px solid var(--ammer-green);

}


[data-value="y-baumschulen"] {
  background-color: var(--ammer-brown)!important;
  color: var(--ammer-white)!important;
  border: 1px solid var(--ammer-brown);
}

.category-y-baumschulen .baumschulen {
  display: none;
}
.category-y-baumschulen .titel {
    background-color: var(--ammer-brown);
    color: var(--ammer-white);
}

/* Live-Erleben
-------------------------------------------------------------- */
[data-value="z-live-erleben"] {
  background-color: var(--ammer-greencontrast)!important;
  color: var(--ammer-white)!important;
  border: 2px solid var(--ammer-greencontrast);
}

.category-z-live-erleben .baumschulen {
  display: none;
}
.category-z-live-erleben .titel {
    background-color: var(--ammer-greencontrast);
    color: var(--ammer-white);
}

[data-value="z-live-erleben"]::before {
  margin-right: 10px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--ammer-red);
  cursor: pointer;
  animation: pulse 2s infinite;
  font-family: 'ammergruen';
  content: "\e911";
  font-size: 0.8em;
}


@-webkit-keyframes pulse {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(210,45,160, 0.7);
  }
  70% {
      -webkit-box-shadow: 0 0 0 10px rgba(204,169,44, 0);
  }
  100% {
      -webkit-box-shadow: 0 0 0 0 rgba(204,169,44, 0);
  }
}
@keyframes pulse {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(210,45,160, 0.7);
    box-shadow: 0 0 0 0 rgba(210,45,160, 0.7);
  }
  70% {
      -moz-box-shadow: 0 0 0 10px rgba(204,169,44, 0);
      box-shadow: 0 0 0 10px rgba(204,169,44, 0);
  }
  100% {
      -moz-box-shadow: 0 0 0 0 rgba(204,169,44, 0);
      box-shadow: 0 0 0 0 rgba(204,169,44, 0);
  }
}


/* ENDE FACET LISTINGS
-------------------------------------------------------------- */


/* ammer Zwischenstopp
-------------------------------------------------------------- */


.mapp-layout {
  border: 4px solid var(--ammer-white);
  background-color: #282827!important;
}
.mapp-sidebar {
  background-color: #282827;
}
.mapp-list .mapp-template .mapp-title {
  color: var(--ammer-white);
  padding-left: 5px;
}
.mapp-template .mapp-title {
  color: var(--ammer-black);
  font-size: 1.5em;
}
.mapp-title, .mapp-list  {
  color: var(--ammer-white);
  padding-left: 5px;
}
.mapp-list .mapp-item:hover {
	background-color: var(--ammer-darkred);
}
.mapp-list .mapp-item.mapp-selected {
  background-color: var(--ammer-white);
}
.mapp-item.mapp-selected .mapp-title {
  color: var(--ammer-black);
}

.mapp-list-count {
  text-align: left;
  color: var(--ammer-white);
}
.mapp-iw a, .mapp-iw a:link, .mapp-iw a:active, .mapp-iw a:visited, .mapp-iw a:hover {
  color: var(--ammer-black) !important;
}
.mapp-iw .mapp-dir {
  color: var(--ammer-darkred);
}

.mapp-ammer-button {
  background-color: var(--ammer-white);
  border: 2px solid var(--ammer-black);
  padding: 10px;
  width: 130px;
  text-align: center;
}
.mapp-ib-wrapper {
  max-width: 90%;
}
.single-post .mapp-footer, .single-post .mapp-sidebar {
  display: none;
}

/* Startseite Verantwortung Animation
-------------------------------------------------------------- */

.typing {
  width: 8ch;
  animation: typing 4s steps(32), blink .7s step-end infinite alternate;
  white-space: nowrap;
  overflow: hidden;
  border-right: 6px solid var(--ammer-halfblue);
  font-family: trave;
  line-height: 0.9;
  padding-top: 20px;
}

@keyframes typing {
  from {
    width: 0
  }
}
    
@keyframes blink {
  50% {
    border-color: transparent
  }
}

    /* Slogan Startseite
-------------------------------------------------------------- */

@keyframes logo-appear {
  from {
    zoom: 0%;
    opacity: 0;
  }
  to {
    zoom: 100%;
    opacity: 1;
  }
}

.logo-appear {
  opacity: 0;
  animation-name: logo-appear;
  animation-timing-function: ease-in-out;
  animation-iteration-count: 1;
  animation-duration: 7s;
  animation-direction: alternate;
  animation-delay: 3s;
  animation-fill-mode: forwards;
}

.rotate {
  transform-origin: center;
  animation: rock 4s ease-in-out infinite;
}

@keyframes rock {
  0% {
    transform: rotateZ(1deg);
  }
  50% {
    transform: rotateZ(-1deg);
  }
  100% {
    transform: rotateZ(1deg);
  }
}

.handsleft {
  position: relative;
  animation: hand-left 4s linear infinite;
}
  
@keyframes hand-left {
  0% {
    transform: translateX(-20%);
  }
  50% {
    transform: translateX(20%);
  }
  100% {
    transform: translateX(-20%);
  }
}

.handsright {
  position: relative;
  animation: hand-right 4s linear infinite;
}
  
@keyframes hand-right {
  0% {
    transform: translateX(20%);
  }
  50% {
    transform: translateX(-20%);
  }
  100% {
    transform: translateX(20%);
  }
}



.color1 {
  color: var(--ammer-halfred);
  animation: color-change 5s infinite;
}

@keyframes color-change {
  0% {
    color: var(--ammer-halfblue);
  }
  50% {
    color: var(--ammer-halfred)
  }
  100% {
    color: var(--ammer-halfblue)
  }
}

.color2 {
  color: var(--ammer-halfred);
  animation: color-change2 5s infinite;
}

@keyframes color-change2 {
  0% {
    color: var(--ammer-halfred);
  }
  50% {
    color: var(--ammer-halfblue)
  }
  100% {
    color: var(--ammer-halfred)
  }
}



/* SPRECHBLASE 
-------------------------------------------------------------- */



.bubble {
     border: 4px solid var(--ammer-halfblue);
     background-color: var(--ammer-halfblue);
       border-radius: 10px;
     text-align: left;
     color: #000000;
     position: relative;
   }
   
   .bubbletop:before {
     content: "";
     width: 0px;
     height: 0px;
     position: absolute;
     border-left: 20px solid var(--ammer-halfblue);
     border-right: 20px solid transparent;
     border-top: 20px solid transparent;
     border-bottom: 20px solid var(--ammer-halfblue);
     right: 150px;
     top: -33px;
   }
   

   /* =======================================
  4. Navigation
  ======================================= */
  
  /* ==== 4.1 Mobile MenüHintergrundfarbe */
  
  .mobile-menu-control-wrapper .menu-toggle, .mobile-menu-control-wrapper .menu-toggle:hover, .mobile-menu-control-wrapper .menu-toggle:focus, .has-inline-mobile-toggle #site-navigation.toggled {
    background-color: var(--ammer-white)
  }
  
  /* ==== 4.2 Haupt Navigation und Sub Menu */
  
  .main-navigation.sub-menu-left ul ul {
    border-radius: 7px;
    border: 2px solid #000!important;
    box-shadow: 4px 4px 0 0 var(--ammer-black)!important;
  }
  
  @media (max-width: 768px) {
    #menu-main {
      border: 2px solid #000!important;
      box-shadow: 4px 4px 0 0 var(--ammer-black)!important;
      border-radius: 10px;
    }}
  
    @media (max-width: 768px) {
      .main-navigation.sub-menu-left ul ul {
        border: none!important;
        box-shadow: none!important;
      }}
  
      .main-navigation.has-sticky-branding:not(.grid-container) .inside-navigation:not(.grid-container) .navigation-branding {
        margin-left: 40px;
    }
  
    .separate-containers .paging-navigation {
      padding-top: 20px;
      padding-bottom: 20px;
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
  }
  .nav-links {
    
      background-color: var(--ammer-white);
      padding: 20px;
      border: 2px solid var(--ammer-greencontrast);
      border-radius: 5px;
  
  }