@charset "UTF-8";

/*
Theme Name: goebelgroener
Theme URI: https://wordpress.org/themes/goebelgroener/
Author: RLehmann
Author URI: https://wordpress.org/
Description: Goebel+Groener theme
Requires at least: 5.3
Tested up to: 5.6
Requires PHP: 5.6
Version: 1.0
*/

/*


/* Variables */
:root {
    
    /*colors*/
    
    --white: #fff;
    --black: #000;
    --green: #4dbc0a;
    --lightgrey: #f0f0f0;
    --grey: #616766;
    --darkgrey: #313131;
    --pink: #FF00A7;



	/* Font Size */
	--global--font-size-base: 1.25rem;
	--global--font-size-xs: 1rem;
	--global--font-size-sm: 1.125rem;
	--global--font-size-md: 1.25rem;
	--global--font-size-lg: 1.5rem;

	/* Line Height */
	--global--line-height-body: 1.7;
	--global--line-height-heading: 1.3;
	--global--line-height-page-title: 1.1;


	/* Admin-bar height */
	--global--admin-bar--height: 0;
}

.grecaptcha-badge { visibility: hidden; }

#wpadminbar {
    display: none!important;
}

@font-face {
 font-family: "DINPro";
 src: url("fonts/DINPro-Regular.woff") format("woff"),
     url("fonts/DINPro-Regular.woff2") format("woff2");
    font-weight: normal;
}

@font-face {
 font-family: "DINPro";
     src: url("fonts/DINPro-Bold.woff") format("woff"),
        url("fonts/DINPro-Bold.woff2") format("woff2");
        font-weight: bold;
}

/*BASE*/

body {
    font-family: "DINPro", sans-serif;
    margin: 0;
}

html, body {
  
    margin-top: 0!important;
} 

header {
    background-color: var(--white);
}

main {
        padding-top: 58px;
    }


footer {
    color: var(--grey);
    font-size: 1rem;
    text-align: left;
}



h1 {
    text-align: center;
    color: var(--white);
    font-size: 2.8rem;
    margin-top: 100px;
    margin-bottom: 0.4em;
}



h2 {
    color: var(--green);
    font-size: 2rem;
    text-align: center;
    margin: 1em 0 0.25em 0;
}

h3 {
    color: var(--grey);
    font-size: 1.25rem;
    text-align: center;
    margin: 0.25em 0;

}

h4 {
    color: var(--green);
    font-size: 1.65rem;
    text-align: center;
}


h5 {
    font-size: var(--global--font-size-base);
    color: var(--darkgrey);
    font-weight: 700;
    margin: 10px 0;
}

h6 {
    color: var(--grey);
    font-size: 1rem;
    text-align: left;
    margin-bottom: 15px;
}

h7 {
    color: var(--darkgrey);
    font-size: 2rem;
    text-align: center;
    margin: 1em 0 0.25em 0;
    font-weight: 700;
}



p {
    text-align: center;
    font-size: var(--global--font-size-base);
    color: var(--darkgrey);
    hyphens: auto;
     word-break: break-word;
    word-wrap: break-word;
  overflow-wrap: break-word;

 -webkit-hyphens: auto;

 -moz-hyphens: auto;

 -ms-hyphens: auto;

 -o-hyphens: auto;

}


p span {
    color: var(--green);
}



ul {
    list-style-type: none;
    padding: 0;
}

a {
    text-decoration: none;
    color: inherit;
}


p a {
    color: var(--green);
}

figure {
    margin: 0;
}

sup { 
    vertical-align: top;
    position: relative;
    top: -0.1em;
}

input, textarea, select {
    padding: 10px 15px;
    margin-top: 15px;
    border-color: var(--lightgrey);
    border-style: solid;
    border-width: 2px;
    width: 100%;
    font-size: 1rem;
}

input::placeholder {
    font-size: 1rem;
}

input[type="checkbox"] {
    width: auto;
    margin: 0 15px 0 0;

}

textarea {
    font-family: sans-serif;
}

textarea:focus {
    border-color: var(--green);
}

button p {
    color: var(--green);
    cursor: pointer;
}

@media (max-width: 992px) {
    h1 {
        margin-top: 60px;
    }
}

@media (max-width: 768px) {
    h1 {
        font-size: 2.2rem;
    }
    
    h2 {
        font-size: 1.8rem;
    }
    
    h3, p, .list li {
        font-size: 1.1rem;
    }
    
    h5 {
        font-size: 1.1rem;
    }
}




@media (max-width: 992px) {
    img, video {
        border-radius: 10px;
    }
}

@media (min-width: 992px) {
    img, video {
        border-radius: 20px;
    }
}


/*layout*/
.logo-divers {
    width: 175px;
    margin: 0 auto;
}

.text-left {
    text-align: left!important;
}

.text-right {
    text-align: right!important;
}

.relative {
    position: relative;
}

.lightgrey {
    background-color: var(--lightgrey);
}

.gradient-lightgrey {
    background-image: linear-gradient(var(--white), var(--lightgrey));
}

.padding-top {
    padding-top: 10vh!important;
}

.padding-bottom {
    padding-bottom: 10vh!important;
}

@media (max-width: 768px) {
    .padding-top {
    padding-top: 15vh!important;
}

.padding-bottom {
    padding-bottom: 15vh!important;
}
}


.little-padding-bottom {
    padding-bottom: 5vh!important;
}

.little-padding-top {
    padding-top: 5vh!important;
}

.little-margin-bottom {
    margin-bottom: 5vh!important;
}

.little-margin-top {
    margin-top: 5vh!important;
}

.little-font-size {
    font-size: 1rem!important;
    text-align: left!important;
    padding: 0 15px;
    hyphens: none;
}


.margin-top {
    margin-top: 10vh!important;
}

.margin-bottom {
    margin-bottom: 10vh!important;
}

.color-green {
    color: var(--green)!important;
}

.color-white {
    color: var(--white)!important;
}

.color-darkgrey {
    color: var(--darkgrey)!important;
}

.color-grey {
    color: var(--grey)!important;
}

.gutter {
    padding: 0 15px!important;
}

.list {
    list-style-type: disc;
    text-align: left;
    font-size: var(--global--font-size-base);
    color: var(--darkgrey);
    padding-left: 55px!important;
}

/*MODULE*/

.wrapper {
    overflow-x: hidden;
    position: relative;
}

.wp-block-group, .wp-block-column {
    z-index: 10;
}

.blocks-gallery-grid {
    width: 100%;
}

.wp-block-gallery.is-cropped .blocks-gallery-item img {
    padding: 0;
    margin: 15px;
    height: auto!important;
}

    .wp-block-gallery {
    margin: auto!important;
}

@media (max-width: 992px) {
    
.wp-block-gallery.is-cropped .blocks-gallery-item img {
    max-width: 200px!important;
    padding: 0;
}
    
.blocks-gallery-item {
    width: 50% !important;
    margin: 0 !important;
    padding: 0 15px;
    flex-grow: 0!important;
}

.blocks-gallery-item figure {
    display: flex!important;
    justify-content: center!important;
}

}



@media (max-width: 992px) {
    .wp-block-cover, .wp-block-cover-image {
        min-height: 350px!important;
    }
}


@media (max-width: 768px) {
    .wp-block-columns {
        flex-direction: column;
        flex-wrap: nowrap!important;
    }
    
    .wp-block-cover, .wp-block-cover-image {
        min-height: 275px!important;
    }
    
    .wp-block-gallery.is-cropped .blocks-gallery-item img {
    padding: 0;
}
}

.wp-block-cover__image-background, .wp-block-cover__video-background {
    border-radius: 0;
}

.wp-block-columns {
    margin-bottom: 0!important;
}


.wp-block-column:not(:first-child) {
    margin-left: 0!important;
}


.wp-block-column:nth-child(2n) {
    margin-left: 0!important;
}
    
.wp-block-column .wp-block-goebelgroener-media, .wp-block-video {
    padding: 30px 15px 0 15px;
    margin: 0;
}

figure img {
        flex: 1;
    object-fit: cover;
}

.pinkline {
    width: 58px;
    height: 3px;
    background-color: var(--pink);
    margin: 0 auto;
}

.contentheight {
    min-height: 1200px;
}

.wp-block-buttons {
    text-align: center;
    margin-top: 30px;
    justify-content: center;
}

.button-green {
    background-color: var(--green)!important;
    color: var(--white)!important;
}

.is-style-fill .wp-block-button__link {
    background-color: var(--green)!important;
    color: var(--white)!important;
}

.is-style-fill:hover .wp-block-button__link {
    background-color: var(--white)!important;
    color: var(--darkgrey)!important;
    border: solid 2px var(--green)!important;
    transition: all 0.2s ease;
}

.is-style-outline:hover .wp-block-button__link {
    background-color: var(--green)!important;
    color: var(--white)!important;
    transition: all 0.2s ease;
}

.colorpink {
    color: var(--pink);
}


.wp-block-button__link {
    color: #fff!important;
    text-transform: uppercase!important;
    border: solid 2px var(--green)!important;
    border-radius: 1.55em!important;
    box-shadow: none!important;
    cursor: pointer!important;
    display: inline-block!important;
    font-size: 1rem!important;
    padding: 0.667em 1.333em!important;
    text-align: center!important;
    text-decoration: none!important;
    overflow-wrap: break-word!important;
    color: var(--darkgrey)!important;
    letter-spacing: 0.04rem;
    
}






/*WHITE FORMs*/

.plus {
    position: absolute;
    top: 0;
    right: 0;
}

.arobase {
    position: absolute;
    right: 0;
    bottom: 0;
}

.trema-top {
    position: absolute;
    top: 0;
    right: 30px;
}

.trema-bottom {
    position: absolute;
    bottom: 0;
    left: 30px;
}

.position {
    position: absolute;
    bottom: 0;
    right: 30px;
}



/*HEADER*/

.logo img {
    width: 250px;
}

@media (max-width: 992px) {
    .logo img {
    width: 200px;
}
}

@media (max-width: 768px) {
    .logo img {
    width: 250px;
}
}

li.current_page_item a {
    color: var(--green)!important;
}

.mainheader {
    position: fixed;
    left:0;
    top:0;
    right:0;
    background-color: var(--white);
    z-index: 12;
    transition: all 0.4s ease;
}

.header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.mainnav {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.mainnav-ul {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.mainnav-ul li {
    margin: 0 15px;
}

.mainnav-ul li a {
    color: var(--darkgrey);
    font-size: 1.1rem;
}



.mainnav-ul li:hover a {
    color: var(--green);
    transition: all 0.2s ease;
}

@media (max-width: 1008px) {
    .mainnav {
        display: none;
    }
}

@media (min-width: 1008px) {
    .mainnav-mobile {
        display: none;
    }
}

/*burger menu*/



.b-nav {
  position: absolute;
  z-index: 11;
  top: 50vh;
transform: translateY(-50%);
}

.b-nav:not(.open) {
  display: none;;
}

.b-nav li {
  list-style-type: none;
  padding: 20px 50px 20px 0;
  text-align: left;
    border-bottom: 2px solid var(--lightgrey);
  -webkit-transform: translateX(-60vw);
          transform: translateX(-60vw);
}

.b-nav li a {
  color: var(--darkgrey);
    font-size: 1.5rem;

}

.b-nav li:not(.open) {
  -webkit-animation-duration: 0.4s;
          animation-duration: 0.4s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-name: slideOutLeft;
          animation-name: slideOutLeft;
}

.b-nav li:first-child {

}

.b-nav.open {
  display: inline;
}

.b-nav.open li {
  -webkit-animation-duration: 0.4s;
          animation-duration: 0.4s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-name: slideInLeft;
          animation-name: slideInLeft;
}

.mainnav-mobile .b-nav .b-link a {
  color: var(--darkgrey);
    font-size: 1.8rem;
  text-decoration: none;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
  width: auto;
}


.b-menu {
  cursor: pointer;
  display: inline-block;
  position: relative;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  z-index: 12;
}


.b-bun {
  background: var(--grey);
  position: relative;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.b-bun--top {
  height: 2px;
  top: 0;
  width: 25px;
}
.b-bun--mid {
  height: 2px;
  top: 8px;
  width: 25px;
}
.b-bun--bottom {
  height: 2px;
  top: 16px;
  width: 25px;
}

.b-container {
    height: 100%;
    display: flex;
    align-items: center;
    background-color: var(--white);
}


.b-container.open .b-main {
  border: var(--darkgrey) solid 2px;
}

.b-container.open .b-bun--top {
  background: var(--darkgrey);
  top: 9px;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

.b-container.open .b-bun--mid {
  opacity: 0;
}

.b-container.open .b-bun--bottom {
  background: var(--darkgrey);
  top: 5px;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.b-container.open {
  color: var(--darkgrey);
}

body:after {
  background: var(--white);
  content: "";
  left: 0;
  opacity: 0;
  overflow: auto;
  padding: 0;
  position: absolute;
  top: 0;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
  width: 100%;
}
body.open .wrapper {
  overflow: hidden;
}

body.open .wrapper main, body.open .wrapper footer {
  display: none;
}


body.open:after {
  opacity: 1;
  visibility: visible;
    height: 100%;
}






/*NEWS*/

.news-ul {
    display: flex;
    justify-content: center;
}

.news-ul li a {
    color: var(--grey);
    margin: 30px;
    font-weight: 600;
}

.post {
    padding: 60px 0;
}

.container-news {
    align-items: center;
}

.text-news p, .text-news h2 {
    text-align: left;
}

.img-news {
    max-height: 600px;
}

.img-news img {
    border-radius: 20px;
    height: 100%;
}

.news-ul-front-page li img {
    border-radius: 20px;
}

/*news front-page*/


.news-ul-front-page li p {
    text-align: left;
}

.news-ul-front-page li img {
    height: initial;
    margin-bottom: 15px;
}

.container-news-front-page div .wp-block-buttons {
    text-align: left;
}

.news-ul-front-page li a{
    color: var(--green);
}

.weiterlesen {
    font-weight: 500;
    margin-bottom: 30px;
}

@media (max-width: 768px) {
    .news-ul-front-page {
  margin-top: 60px;
}
    .news-complet-front-page {
        margin-top: 0;
    }
}

/*PORTFOLIO*/

.container-portfolio {
    padding-bottom: 15vh;
}



.container-portfolio div p,
.container-portfolio div p a,
.container-portfolio div h4 {
    text-align: left;
}

.container-portfolio div h4 {
    margin-top: 0;
    margin-bottom: 60px;
}

.container-portfolio div p {
    margin: 15px 0 10px 0;
}

@media (min-width: 768px) {
    .container-portfolio .col-md-6:nth-child(even) {
  margin-top: 200px;
}
    .container-portfolio .col-md-6:nth-child(1) {
  margin-top: 45px;
}
}





.card {
    display: flex;
    min-height: 400px;
    justify-content: center;
    align-items: center;
    border-radius: 20px;
    position: relative;
    
}

.black-background {
    display: none;
    height: 100%;
    width: 100%;
    background-color:rgba(77, 188, 10, 0.7);
    border-radius: 20px;
    position: absolute;
    transition: all 0.2s ease;
}

.card:hover .black-background {
    display: block;
    transition: all 0.2s ease;
}

.card svg {
    display: none;
    z-index: 3;
    transition: all 0.4s ease;
}


.card:hover svg {
    display: block;
    transition: all 0.2s ease;
}

.post-portfolio {
    text-align: center;
}

.post-portfolio h2 {
    margin: 15px 0;
}

.post-portfolio h3 a, 
.post__meta-category a {
    cursor: default;
    pointer-events: none;
    color: var(--grey);
}




/*single nav portfolio*/

.single-nav-portfolio {
    margin: 15vh 0;
    text-align: center;
}

.container-nav-portfolio {
    margin-top: 60px;
}

.container-nav-portfolio div p,
.container-nav-portfolio div p a,
.container-nav-portfolio div h4 {
    text-align: left;
}

.container-nav-portfolio div h4 {
    margin-top: 0;
    margin-bottom: 60px;
}

.container-nav-portfolio div p {
    margin: 15px 0 10px 0;
}


/*REFERENZEN*/

figure.wp-block-gallery.has-nested-images {
    align-items: center!important;
}

/*.wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image) img {
	padding: 20px!important
}*/

.container {
	gap: 0!important;
    row-gap: 0px!important;
    column-gap: 0px!important;
}

@media (max-width: 768px) {
    .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) {
    width: calc(30% - var(--wp--style--unstable-gallery-gap, 16px)/2)!important;
    margin: 0;
}
}

/*FOOTER*/

.footer-container {
    background-color: var(--lightgrey);
     padding: 30px 0;
}

@media (max-width: 1200px) {
    .footer-lg-line {
        display: none;
    }
}


@media (min-width: 1200px) {
    .footer-sm-line {
        display: none;
    }
}

.footer-logo {
    width: 222px;
    margin-top: 30px;
}

.footer-logo:hover g #Pfad_21 {
    fill: var(--green);
    transition: all 0.2s ease;
}

#menu-footer li a {
    color: var(--grey);
    font-size: 0.8rem;
}

#menu-footer li:hover a {
    color: var(--green);
    transition: all 0.2s ease;
}

.footer-link {
    margin: 0;
}

.footer-link a {
    color: var(--grey);
}

.footer-link:hover a {
    color: var(--green);
    transition: all 0.2s ease;
}

.textwidget p {
    color: var(--grey);
    font-size: 1rem;
    text-align: left;
}

.footer-social-icon {
    margin-right: 30px;
}

.footer-social-icon svg:hover path {
    fill: var(--green);
    transition: all 0.2s ease;
}

.copyright {
    color: var(--grey);
    font-size: 1rem;
}




/*KONTAKT*/

.adress-contact, 
.infos-contact {
    margin-top: 60px;
}

.link-contact {
    color: var(--grey);
}

.link-contact:hover {
    color: var(--green);
    transition: all 0.2s ease;
}


.adress-contact p, 
.adress-contact h3,
.infos-contact p,
.infos-contact h3 {
    text-align: left;
    color: var(--grey);
}

.contact-form p {
    margin-right: 15px;
    text-align: left;
    color: var(--grey);
}

.wp-block-buttons input, button {
    color: #fff;
  font-family: "DINPro", sans-serif;
    text-transform: uppercase;
  border: solid 2px var(--green);
  border-radius: 1.55em;
  box-shadow: none;
  cursor: pointer;
  display: inline-block;
  font-size: 1rem!important;
  padding: 0.667em 1.333em;
  text-align: center;
  text-decoration: none;
  overflow-wrap: break-word;
    color: var(--darkgrey);
    background-color: var(--white);
}

.wp-block-buttons input:hover, button:hover {
    background-color: var(--green)!important;
    color: var(--white)!important;
    transition: all 0.2s ease;
}

.social-contact {
    flex-direction: row;
}

.wpgmza-centered {
    padding-bottom: 10vh;
}

.social-contact .wp-block-column {   
    margin: 15px 30px;
}

.social-contact .wp-block-column svg:hover g path {
    fill: var(--green);
    transition: all 0.2s ease;
}

.screen-reader-response {
    display: none;
}

.wpcf7-response-output {
    color: var(--pink);
    text-align: center;
    padding: 2em 0;
    font-weight: bold;
}

/*OTHER*/



@media (max-width: 730px) {
    .line-karriere {
        width: 180%;
        transform: scaleX(-1);
}
}

#third:target {
    padding-top: 230px; 
    margin-top: -230px; 
}

#second:target {
    padding-top: 230px; 
    margin-top: -230px; 
}

.error-404 img {
    border-radius: inherit!important;
}


/*PLUGIN*/

.wpgmza-gdpr-compliance img {
	height: 200px;
}

/*
#acym_wrapper .button {
    background-color: white!important;
    color: var(--darkgrey)!important;
    text-transform: uppercase!important;
    border: solid 2px var(--green)!important;
    border-radius: 1.55em!important;
    padding: 10px 20px!important;
}

#acym_wrapper .button:hover {
    background-color: var(--green)!important;
    color: white!important;
}
*/

.acym__wysid__media__inserted {
	width: 100%!important;
}

@media (max-width: 1198.89px) {
    .wp-block-goebelgroener-first-basic-txt-block {
        padding: 15px!important;
}
}