/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */


/* GENERAL */
:root {
  --white: #FFF;
  --gray-stroke: #E5E5E5;
  --gray-background: #F9FAFB;
  --green-primary: #00786F;
  --green-light: #00786F;
  --green-shade: #0E3835;
  --green-primary-light: #CCE4E2;
  --text-gray: #5D6775;
  --text-highlight: #363636;
  --headline: #0F0F0F;

  --h1: 4em;
  --h2: 3em;
  --h3: 1.75em;
  --p: 1em;
  --text: 1em;
  --lead: 1.5em;
  --bento-h: 1.2em;
  --bento-p: .8em;

  --border-radius-icons: 5px;
  --border-radius-elements: 15px;
  --border-radius-badge: 10px;
}




/* FONT SIZE QUERY */
@media(max-width: 1024px) {
 :root {
   --h1: 4.3em;
    
 }
}
@media(max-width: 768px) {
  :root {
    --h1: 3.4em;
    --h2: 2.8em;
	--h3: 2em;
  }
}


body { overflow-x: hidden; background: var(--gray-background);}


h1 {
  color: var(--white);
  font-size: var(--h1);
  line-height: 100%;
  letter-spacing: -1.6px;
  font-family: "nexa", sans-serif !important;
  font-weight: 300 !important;
  font-style: normal;
}
h2 {
  color: var(--headline);
  font-size: var(--h2);
  line-height: 100%;
  letter-spacing: -0.96px;
  font-family: "nexa", sans-serif !important;
  font-weight: 300 !important;
  font-style: normal;
}

h3 {
  color: var(--headline);
  font-size: var(--h3);
  line-height: 100%;
  letter-spacing: -0.96px;
  font-family: "nexa", sans-serif !important;
  font-weight: 600 !important;
  font-style: normal;
}

p,a,li, .e-n-accordion-item-title-text, .elementor-icon-list-text, .menu-item a {
  font-size: var(--p);
  font-family: "Lato", sans-serif !important;
  font-weight: 400;
  font-style: normal;
  line-height: 1.3;
  color: var(--text-highlight);

}
.elementor-13 .elementor-element.elementor-element-f8fd1d9 .elementor-heading-title { font-size: 40px;}

.page-header { display: none;}

.elementor-button-text {
  border-radius: 5px;
  font-family: "Lato", sans-serif !important;
}
.elementor-button.elementor-button-link { border-radius: 5px;}

.elementor-widget-container img { border-radius: 15px;}

/* ICON COLORS */
#bento .elementor-icon,
#bento .elementor-icon-list-icon,
#steps .elementor-icon,
#service_left .elementor-icon-list-icon {
  padding: 10px;
  background: var(--green-primary-light);
}

#bento .elementor-icon svg,
#steps .elementor-icon svg,
#service_right .elementor-icon svg {
  fill: var(--green-light);
  height: .8em;
  width: .8em;
}

.section {
  padding: 3.75em 0;
}
.section-padding-bottom {
  padding-bottom: 3.75em;
}

/* HEADINGS */


/* NAVIGATION*/


/* HERO */
.elementor-slides .swiper-slide-inner .elementor-slide-heading {
    font-size: var(--h1);
    font-weight: 700;
    line-height: 1;
    width: 80%;
}

.elementor-slides .swiper-slide-inner { padding: 50px 90px; }


/* LEISTUNGEN */
#leistungen .leistungen_items h3 {
  color: var(--white);
}
#leistungen .leistungen_teaser { transition: all .5s ease;}
#leistungen .leistungen_teaser:hover {
   filter: grayscale(1) !important;
   transition: all .5s ease;
}

/* SERVICE */
#service_left .elementor-icon-list-icon svg {
  fill: var(--green-light);
  height: 1.2em;
  width: 1.2em;
  margin: 0;
}
#service_left .elementor-icon-list-icon { border-radius: var(--border-radius-icons); }

#service_right .elementor-icon svg { fill: var(--white);}
#service_right .elementor-icon-box-icon {
   background: var(--green-primary);
   padding: 9px 10px 6px;
   border-radius: var(--border-radius-icons);
   display: inline-block;
   margin-bottom: 12px;
   width: max-content;
}

#service_left .elementor-button-text { text-decoration: underline;}

#service_right .elementor-icon-box-title,
#service_right p {
   margin: 0; 
   color: var(--text-highlight);
}
#service_right .service_right_items > div {
   background: var(--green-primary-light);
   border-radius: var(--border-radius-elements);
   border-color: var(--green-primary);
   color: var(--white);
   min-height: 140px;
}
#service_right .elementor-icon-box-title { font-size: var(--p); margin-bottom: 8px;}
#service_right .elementor-icon-box-description {font-size: var(--bento-p); line-height: 1.2;}


/* BENTO */
#bento .div1 { grid-area: 1 / 1 / 3 / 5; }
#bento .div2 { grid-area: 1 / 5 / 2 / 8; }
#bento .div3 { grid-area: 2 / 5 / 3 / 8; }
#bento .div4 { grid-area: 3 / 1 / 4 / 4; }
#bento .div5 { grid-area: 3 / 4 / 4 / 6; }
#bento .div6 { grid-area: 3 / 6 / 4 / 8; }


#bento .elementor-icon-list-icon svg {
  fill: var(--green-light);
  height: 3em;
  width: 3em;
  margin: 0;
}
#bento .elementor-icon-list-icon  { border-radius: 1em;}

#bento .div3 p.elementor-heading-title,
#bento .div5 p.elementor-icon-box-title {
   color: var(--text-highlight);
   font-size: var(--p) !important;
   font-weight: bold;
}

#bento .div2 span {
   background: var(--green-primary);
   padding: 5px 10px;
   color: var(--white);
   display: inline-block;
   border-radius: var(--border-radius-badge);
   margin-bottom: 20px;
}
#bento .div2 p.elementor-heading-title { color: var(--white); margin-bottom: 10px; font-size: var(--bento-h);}
#bento .div2 p { color: var(--white);}

#bento .div3 { padding: 25px;}
#bento .div3 .elementor-icon-list-items { margin-bottom: 20px;}
#bento .div3 .elementor-icon-list-icon { padding: 15px; margin-right: 12px;}
#bento .div3 .elementor-icon-list-icon svg { width: 2em; height: 2em;}
#bento .div3 span { font-size: var(--p);}
#bento .div3 .elementor-icon-list-text span {
  font-weight: bold;
  font-size: var(--bento-h);
  color: var(--text-highlight);;
}
#bento .div3 .elementor-widget-container p { font-size: var(--p); color: var(--text-highlight);} 
#bento .div4 .elementor-icon-list-icon { padding: 15px; margin-right: 12px;}
#bento .div4 .elementor-icon-list-icon svg { width: 2em; height: 2em;}
#bento .div4 .elementor-icon-list-text { font-size: var(--p); color: var(--text-highlight);}
#bento .div4 .elementor-icon-list-text span { 
   font-size: var(--bento-h);
   color: var(--text-highlight);
   font-weight: bold;
}

/*
#bento .div5 .elementor-icon { border-radius: var(--border-radius-elements);}
#bento .div5 .elementor-icon-box-title { margin: 0;}
#bento .div5 .elementor-icon-box-description {
  font-size: var(--bento-p);
  width: 60%;
  margin: 0 auto;
}
*/
#bento .div5 p.elementor-heading-title {
    color: var(--white);
    font-size: var(--bento-h) !important;
    font-weight: bold;
}
#bento .div5  .elementor-widget-container p {
   color: var(--white);
   font-size: var(--bento-p);
}

#bento .div6 .elementor-icon-list-icon svg {
    width: 2em;
    height: 2em;
}
#bento .div6 .elementor-icon-list-text {
    font-size: var(--bento-h) !important;
    color: var(--text-highlight);
    font-weight: bold;
    padding: 18px;
}
#bento .div6 .elementor-widget-container p {
   margin-top: 10px;
   color: var(--text-highlight);
   font-size: var(--p);
}

/* PLAN */
#steps p { color: var(--white);}
#steps .all-steps h2.elementor-heading-title {
  color: var(--green-light);
  opacity: 1;
  font-size: 3.2em;
  margin-right: 15px;
}
#steps .all-steps h3 { 
    margin: 0 0 8px 0;
    font-size: var(--bento-h);
}
#steps .all-steps p { 
    margin: 0;
    color: var(--text-highlight);
}
#steps .all-steps > div:after {
    content: "";
    border-right: 3px solid var(--gray-stroke);
    width: 0;
    height: 20px;
    position: absolute;
    bottom: -20px;
    transform: translateX(-50%);
    right: 50%;
}
#steps .all-steps > div:last-child:after { content: none;}
#steps .elementor-icon { border-radius: 50%;}

#steps .elementor-icon svg {
    height: 0.5em;
    width: 0.5em;
}
#steps .steps_alt:after {
   content: "";
    border-right: 3px solid var(--gray-stroke);
    width: 0;
    height: 22px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%) rotate(-90deg);
    right: -5%;
}
#steps .steps_alt:last-child:after { content: none;}

/* REFERENZEN */

#references_loop { margin-left: 13em;}
.references_item { position: relative;}
.references_image img { border-radius: var(--border-radius-elements);}
.references_caption {
  position: absolute;
  bottom: 25px;
  left: 20px;
}
.references_caption h3.elementor-heading-title {
  color: var(--white);
  font-size: var(--lead);
  margin-bottom: 0;
}
.references_caption div.elementor-widget-container { color: var(--white); font-size: var(--bento-p);}

/* TESTIMONIALS */
#testimonials {
  margin-top: 2em;
}
.testimonials .e-con-inner > .elementor-element {
  padding: 25px !important;
  color: var(--text-highlight);
}

/* ANFAHRT */
#anfahrt .anfahrt_left span.elementor-heading-title { color: var(--white); font-size: var(--p);}
#anfahrt .anfahrt_left .elementor-widget-container { 
   margin: 1em 0 0 1em; 
   height: auto; 
   color: var(--white);
}
#anfahrt .anfahrt_left .elementor-heading-title { font-size: var(--lead); color: var(--white);}

#anfahrt .anfahrt_right {
  border: 1px solid var(--gray-stroke);
  border-radius: var(--border-radius-elements);
}
#anfahrt .anfahrt_right div.elementor-heading-title {
  color: var(--text);
}
#anfahrt .anfahrt_right .anfahrt_right_border { border-bottom: 1px solid var(--gray-stroke); }
#anfahrt .anfahrt_right .anfahrt_right_info { margin-top: 1em;}
#anfahrt .anfahrt_right .anfahrt_right_info p,
#anfahrt .anfahrt_right .anfahrt_right_border p { margin: 0;}
/* FAQS */
#faq { margin: 5em 0;}

#faq .e-n-accordion-item-title {
   background: var(--white);
}
#faq .e-n-accordion .e-n-accordion-item > div  { border-radius: .7em; margin-top: 5px;}

/* KONTAKT */

/* FOOTER */

footer h3, footer p { color: var(--white); }

#wpforms-form-182 { 
    display: flex;
    align-content: center;
    align-items: center;
}
#wpforms-form-182 .wpforms-submit-container { margin: 0;}

#wpforms-form-182 .wpforms-field-large {
   background: rgba(255,255,255,.10);
   border: 1px solid rgba(255,255,255,.20);
   border-radius: var(--border-radius-icons);
   margin-right: 10px;
}
#wpforms-form-182 .wpforms-submit {
   background: var(--green-primary);
   border-radius: var(--border-radius-icons);
   margin-left: 10px;
}

/* POPUPS */
#popup-form {
  margin-bottom: 3em;
}

#popup-form > div {
  border-radius: var(--border-radius-elements);
  padding: 20px;
}
#popup-form .elementor-button {
  width: 60%;
  font-size: 1.2em;
  font-weight: bold;
  border-radius: var(--border-radius-icons);
}
#popup-section p { color: var(--white);}

/* MEDIA QUERIES*/
@media(min-width: 2000px) {
  .elementor-slides .swiper-slide-inner {
    padding: 50px 140px;
  }
}

@media(min-width: 1920px) {
   .elementor-95 .elementor-element.elementor-element-a493d2a img {
     height: 700px !important;
     object-fit: cover;
     object-position: center center;
  }

   .elementor-slides .swiper-slide-inner {
    padding: 50px 120px;
   }
}

@media(max-width: 1024px) {
  .elementor-slides .swiper-slide-inner .elementor-slide-heading {}
  #references_loop { margin-left: 5em;}

  #steps .steps_alt:after {
    right: -13px;
  }

  #steps .steps_alt:nth-child(2):after {
    content: none;
  }
}

@media(max-width: 768px) {
 #references_loop { margin-left: 0em;}

  #steps .steps_alt:after {
    right: -13px;
  }

  #steps .steps_alt:nth-child(2):after {
    content: none;
  }
}

@media(max-width: 592px) {
 #service .e-con-inner { margin: 0 !important;}

 #bento .div1 { grid-area: 1 / 1 / 2 / 7; }
 #bento .div2 { grid-area: 2 / 1 / 3 / 4; }
 #bento .div3 { grid-area: 2 / 4 / 3 / 7; }
 #bento .div4 { grid-area: 3 / 1 / 4 / 7; }
 #bento .div5 { grid-area: 4 / 1 / 6 / 4; }
 #bento .div6 { grid-area: 4 / 4 / 6 / 7; }

#bento .div3 .elementor-icon-list-item { flex-direction: column; margin-top: 1em;}

 #steps .steps_alt:after {content: none;}
}

@media(max-width: 400px) {

 .elementor-slides .swiper-slide-inner .elementor-slide-heading {
   font-size: 2.4em;
   width: 90%;
 }

 #bento .div1 { grid-area: 1 / 1 / 2 / 7; }
 #bento .div2 { grid-area: 2 / 1 / 3 / 7; }
 #bento .div3 { grid-area: 3 / 1 / 4 / 7; }
 #bento .div4 { grid-area: 4 / 1 / 5 / 7; }
 #bento .div5 { grid-area: 5 / 1 / 6 / 4; }
 #bento .div6 { grid-area: 5 / 4 / 6 / 7; }
 
 #bento .div3 .elementor-icon-list-item { flex-direction: column; margin-top: 1em;}

 #steps .steps_alt:after {content: none;}

 .elementor-location-footer .elementor-icon-list-item {flex-direction: row;}
}