/*



          /\
         /**\
        /****\   /\
       /      \ /**\
      /  /\    /    \
     /  /  \  /      \
    /  /    \/ /\     \
   /  /      \/  \/\   \
__/__/_______/___/__\___\______________________________

Made with Passion by GIPFELGOLD // www.gipfelgold.com
_______________________________________________________
*/


/* Version 230426
https://xd.adobe.com/view/9c9a3bb7-dbed-40f3-adaa-93d889e1bbc7-c9c9/screen/cfec4eb7-a687-40b3-b1ff-1f7a74321d27/specs/

*/


/*


       /\
      /  \/\
_____/___/__\______________________________________________________________

                                 ROOT
___________________________________________________________________________*/


/* outfit-200 - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Outfit';
    font-style: normal;
    font-weight: 200;
    src: url('fonts/outfit-v10-latin-200.eot');
    /* IE9 Compat Modes */
    src: url('fonts/outfit-v10-latin-200.eot?#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('fonts/outfit-v10-latin-200.woff2') format('woff2'),
        /* Super Modern Browsers */
        url('fonts/outfit-v10-latin-200.woff') format('woff'),
        /* Modern Browsers */
        url('fonts/outfit-v10-latin-200.ttf') format('truetype'),
        /* Safari, Android, iOS */
        url('fonts/outfit-v10-latin-200.svg#Outfit') format('svg');
    /* Legacy iOS */
}

/* outfit-300 - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Outfit';
    font-style: normal;
    font-weight: 300;
    src: url('fonts/outfit-v10-latin-300.eot');
    /* IE9 Compat Modes */
    src: url('fonts/outfit-v10-latin-300.eot?#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('fonts/outfit-v10-latin-300.woff2') format('woff2'),
        /* Super Modern Browsers */
        url('fonts/outfit-v10-latin-300.woff') format('woff'),
        /* Modern Browsers */
        url('fonts/outfit-v10-latin-300.ttf') format('truetype'),
        /* Safari, Android, iOS */
        url('fonts/outfit-v10-latin-300.svg#Outfit') format('svg');
    /* Legacy iOS */
}

/* outfit-regular - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Outfit';
    font-style: normal;
    font-weight: 400;
    src: url('fonts/outfit-v10-latin-regular.eot');
    /* IE9 Compat Modes */
    src: url('fonts/outfit-v10-latin-regular.eot?#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('fonts/outfit-v10-latin-regular.woff2') format('woff2'),
        /* Super Modern Browsers */
        url('fonts/outfit-v10-latin-regular.woff') format('woff'),
        /* Modern Browsers */
        url('fonts/outfit-v10-latin-regular.ttf') format('truetype'),
        /* Safari, Android, iOS */
        url('fonts/outfit-v10-latin-regular.svg#Outfit') format('svg');
    /* Legacy iOS */
}

/* outfit-500 - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Outfit';
    font-style: normal;
    font-weight: 500;
    src: url('fonts/outfit-v10-latin-500.eot');
    /* IE9 Compat Modes */
    src: url('fonts/outfit-v10-latin-500.eot?#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('fonts/outfit-v10-latin-500.woff2') format('woff2'),
        /* Super Modern Browsers */
        url('fonts/outfit-v10-latin-500.woff') format('woff'),
        /* Modern Browsers */
        url('fonts/outfit-v10-latin-500.ttf') format('truetype'),
        /* Safari, Android, iOS */
        url('fonts/outfit-v10-latin-500.svg#Outfit') format('svg');
    /* Legacy iOS */
}


:root {
    --gruen: #99C221;
    /*preheadline*/
    --dunkelgruen: #5B7855;
    /*links*/
    --braun: #6C6864;
    --dunkelbraun: #44423F;
}


/*


       /\
      /  \/\
_____/___/__\______________________________________________________________

                                 FONTS
___________________________________________________________________________*/

.h1 {
    word-break: break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
li,
a,
i {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/*
body,
html {
    font-family: sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    line-height: 1.625em;
}*/


#bbk h1 {
    font-size: clamp(42px, 6vw, 65px);
    font-size: clamp(36px,6vw,45px);
    line-height: 1.02em;
}

#bbk h2:not(.tab-nav-heading) {
    font-size: clamp(27px, 6vw, 46px);
    line-height: 1.17em;
    font-size: clamp(29px,5vw,36px);
}

#bbk h3:not(.tab-nav-heading) {
    font-size: clamp(23px, 4vw, 29px);
    line-height: 1.86em;
}

#bbk h4 {
    font-size: clamp(14px, 2vw, 18px);
    line-height: 1.50em;
}

h5 {}

h6 {}

#bbk .h1 {
    font: normal normal 300 65px/66px 'Outfit';
    letter-spacing: 2.92px !important;
    text-transform: uppercase;
    font-size: clamp(36px,6vw,45px) !important;
    line-height: 1.02em !important;
}

#bbk .h2 {
    font: normal normal 200 46px/54px 'Outfit';
    letter-spacing: 0px !important;
    font-size: clamp(27px, 6vw, 46px) !important;
    line-height: 1.17em !important;
    font-size: clamp(29px,5vw,36px) !important;
}

#bbk .h3 {
    font: normal normal 200 29px/54px 'Outfit';
    letter-spacing: 1.3px !important;
    font-size: clamp(18px, 4vw, 29px) !important;
    line-height: 1.3em !important;
}

#bbk .h4,
.row .nectar-icon-list .nectar-icon-list-item h4 {
    font: normal normal 500 18px/27px 'Outfit';
    letter-spacing: 0.81px !important;
    font-size: clamp(14px, 2vw, 18px) !important;
    line-height: 1.50em !important;
    text-transform: none !important;
}

#bbk .h5 {}

#bbk .h6 {}

#bbk .preheadline,
#bbk .widget h4 {
    font: normal normal 200 14px/27px 'Outfit';
    letter-spacing: 0.81px;
    text-transform: uppercase;
    font-size: clamp(11px, 2vw, 14px) !important;
    line-height: 1.93em !important;
}

#bbk .claim {
    font: normal normal 300 65px/66px 'Outfit';
    letter-spacing: 2.92px;
    text-transform: uppercase;
    font-size: clamp(30px, 4vw, 65px) !important;
    line-height: 1.02em !important;
    font-size: clamp(36px,6vw,45px) !important;
}


#bbk strong,
#bbk b {
    font-weight: 500;
}

#bbk .nobreak {
    white-space: nowrap;
}


/*//////////////////////////////////////////////////////////////// Underline Border size */
.nectar-cta[data-style=underline] .link_wrap .link_text:after {
    border-bottom-width: 1px !important;
}

[data-link-hover="underline"] #footer-widgets ul:not([class*="nectar_blog_posts"]) li>a:not(.tag-cloud-link):not(.nectar-button),
[data-link-hover="underline"] #footer-widgets .textwidget a:not(.nectar-button) {
    background-size: 0 1px;
}

[data-link-hover="underline"] #footer-widgets ul:not([class*="nectar_blog_posts"]) li>a:not(.tag-cloud-link):not(.nectar-button):hover {
    background-size: 100% 1px;
}


/*//////////////////////////////////////////////////////////////// Footer */

#footer-outer #footer-widgets h3 {
    margin-bottom: 22px !important;
    letter-spacing: 1.3px;
    font-size: clamp(14px, 2vw, 18px) !important;
    line-height: 1.50em !important;
}

#footer-outer #footer-widgets h3,
#footer-outer #footer-widgets .widget h4 {
    color: #99C221 !important;
}

.material #footer-outer #footer-widgets .col ul li {
    padding: 0 0 !important;
}

#footer-outer[data-link-hover="underline"] #footer-widgets .textwidget a:not(.nectar-button):hover {
    color: ;
}

/*


       /\
      /  \/\
_____/___/__\______________________________________________________________

                                 ELEMENTS
___________________________________________________________________________*/


/* Overlay 45degree white */

#bbk .hero .row-bg {
    background-color: transparent !important;
    /*background-color: red !important;*/
}

@media (orientation: landscape) and (min-width: 1541px) {

    /* CSS-Regeln, die nur angewendet werden, wenn das Gerät sich im Landscape-Modus befindet */
    #bbk .hero .row-bg {
        background-position: right center !important;
        background-size: calc(56vw + 26vh) auto !important;
    }
}
@media (orientation: landscape) and (max-width: 1540px) and (min-width: 1000px) {

    /* CSS-Regeln, die nur angewendet werden, wenn das Gerät sich im Landscape-Modus befindet */
    #bbk .hero .row-bg {
        background-position: right center !important;
        background-size: calc(66vw + 36vh) auto !important;
    }
}

@media only screen and (max-width: 999px) {
    #bbk .hero .row-bg {
        background-position: right center !important;
    }
}


@media only screen and (max-width: 999px) {
    #bbk .hero .row-bg-overlay {
     background: linear-gradient(45deg, rgba(255,255,255,255) 36%, rgba(255,255,255,255) 36%, rgba(255,255,255,0) 36%) !important;
    }
}

/* Mobile Hero Content */
.mobile-herocontent .claim {
    word-break: break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}
.mobile-herocontent h1 {
  max-width: 75%;
}


/* Left Diagonal Line */
#bbk .bg-left-line .row-bg {
    background-size: auto 20vw !important;
}

@media only screen and (min-width: 1920px) {
    #bbk .bg-left-line .row-bg {
        background-size: auto 430px !important;
    }
}

/* right diagonal line */
#bbk .bg-right-line .row-bg {
    background-size: auto 15vw !important;
    background-position: left 35% !important;
}

@media only screen and (min-width: 1920px) {
    #bbk .bg-right-line .row-bg {
        background-size: auto 235px !important;
    }
}

/* Image Line Overlay */
.overlay-image-line .img-with-aniamtion-wrap .hover-wrap-inner::before {
    content: "";
    display: block;
    width: 234px;
    height: 234px;
    background-image: url("/wp-content/uploads/2023/04/line-overimage.svg");
    background-size: contain;
    position: absolute;
    z-index: 100000;
    bottom: -20px;
    right: -100px;
}


/*//////////////////////////////////////////////////////////////// Icon List Kontakt */

.iconlist-kontakt .nectar-icon-list-item {
    margin-bottom: 1em;
    padding-left: 50px;
}


/*//////////////////////////////////////////////////////////////// Icon List */

#bbk .light .nectar-icon-list-item .content {
    color: rgba(255, 255, 255, 1);
}

#bbk .light .nectar-icon-list[data-icon-color=default] .list-icon-holder svg {
    opacity: 1;
}

#bbk .light .nectar-icon-list[data-icon-color=default] .list-icon-holder .im-icon-wrap path {
    fill: #99C221;
}


.nectar-icon-list-item a {
    color: #ffffff;
}


.nectar-icon-list-item a:hover {
    color: var(--gruen);
}


/*//////////////////////////////////////////////////////////////// Button */

#bbk .bbkbutton {
    font: normal normal 500 14px/27px 'Outfit';
    letter-spacing: 0.63px;
    text-transform: uppercase;
    font-size: clamp(11px, 2vw, 14px);
}

.bbkghostbutton-light {
    border-color: var(--gruen) !important;
}

/* Hover von normalen Farbbuttons */
#bbk a.bbkbutton {
    -webkit-transition: background 200ms ease-in-out;
    -moz-transition: background 200ms ease-in-out;
    -ms-transition: background 200ms ease-in-out;
    -o-transition: background 200ms ease-in-out;
    transition: background 200ms ease-in-out;
}

#bbk a.bbkbutton:hover {
    background-color: var(--gruen) !important;
}


/*


       /\
      /  \/\
_____/___/__\______________________________________________________________

                                 NAVIGATION
___________________________________________________________________________*/


#bbk #header-outer li.head-kundenportal img {
    margin-right: 2px !important;
    margin-left: 2px !important;

}

#bbk #header-outer #top nav>ul>li.head-kundenportal>a {
    padding-left: 0;
    padding-right: 0;
    border-radius: 50px !important;
    border-left-width: 0;
    border-right-width: 0;
    border: 8px solid;
}

#bbk #header-outer li.head-kundenportal>a:before,
#bbk #header-outer li.head-kundenportal>a:after {
    border-radius: 50% !important;
    left: -8px;
    width: calc(100% + 16px);
    height: calc(100% + 16px);
}

/* Mobile */
#slide-out-widget-area.fullscreen .inner .off-canvas-menu-container li a {
  opacity: 1;
}

/*


       /\
      /  \/\
_____/___/__\______________________________________________________________

                                 ICONS
___________________________________________________________________________*/


.list-icon-holder i,
.nectar_icon i {
    background-size: contain;
    background-repeat: no-repeat;
}

.list-icon-holder i:before,
.nectar_icon i:before {
    display: none;
}

.list-icon-holder i.fa-book,
.nectar_icon i.fa-book {
    background-image: url("/wp-content/uploads/2023/04/icon-buchhaltung.svg");
}

/* Buchhaltung */
.list-icon-holder i.fa-address-book-o,
.nectar_icon i.fa-address-book-o {
    background-image: url("/wp-content/uploads/2023/04/icon-lohnverrechnung.svg");
}

/* Lohnverrechnung */
.list-icon-holder i.fa-qrcode,
.nectar_icon i.fa-qrcode {
    background-image: url("/wp-content/uploads/2023/04/icon-digitalisierung.svg");
}

/* Digitalisierung */
.list-icon-holder i.fa-bar-chart,
.nectar_icon i.fa-bar-chart {
    background-image: url("/wp-content/uploads/2023/04/icon-jahrsabschluss.svg");
}

/* Jahresabschluss */
.list-icon-holder i.fa-comment,
.nectar_icon i.fa-comment {
    background-image: url("/wp-content/uploads/2023/04/icon-beratung.svg");
}

/* Steuerliche Beratung */
.list-icon-holder i.fa-compass,
.nectar_icon i.fa-compass {
    background-image: url("/wp-content/uploads/2023/04/icon-betriebswirtschaft.svg");
}

/* Betriebswirtschaftliche Beratung */


/* Phone & Mail Icons */

#bbk .icon-bbk-phone,
#bbk .icon-bbk-mail {
    display: block !important;
    padding-left: 30px;
    background-image: url("/wp-content/uploads/2023/04/icon-phone.svg") !important;
    background-repeat: no-repeat;
    background-position: left center !important;
    background-size: auto !important;
    margin-top: 0.5em;
    color: var(--dunkelgruen);

}

#bbk .icon-bbk-mail {
    background-image: url("/wp-content/uploads/2023/04/icon-mail.svg") !important;
}

#bbk .icon-bbk-phone:hover,
#bbk .icon-bbk-mail:hover {
    text-decoration: underline;
}

#bbk .icon-bbk-phone.team,
#bbk .icon-bbk-mail.team {
    padding-left: 0;
    background: none !important;
  font-size: 14px;

}

/*


       /\
      /  \/\
_____/___/__\______________________________________________________________

                                 KLIENTENINFO
___________________________________________________________________________*/


/* News Overview Layout */
@media screen and (min-width: 45.5em){
#bbk #klienten-info_wrapper .kicss-u-sm-1-4, #bbk #klienten-info_wrapper .kicss-u-sm-6-24 {
    width: 40%;
}
}
@media screen and (min-width: 45.5em) {
#bbk #klienten-info_wrapper .kicss-u-sm-18-24, #bbk #klienten-info_wrapper .kicss-u-sm-3-4 {
    width: 50%;
}
}
#bbk #klienten-info_wrapper .ki-wrapper-overviewbox {
  margin-bottom: 6vh;
}
/* Postimage height */
#bbk #klienten-info_wrapper div.ki-overview-imgbox {
    max-height: 260px;
}
/* Mobile Layout */
@media handheld, only screen and (max-width: 800px), only screen and (max-device-width: 800px) {
#bbk #klienten-info_wrapper div.ki-overview-imgbox {
    height: 160px;
    margin-bottom: 2vh;
}
}

#bbk #klienten-info_wrapper #ki-overview .ki-ausgabe {
  margin-bottom: 0;
  color: var(--braun);
}
#bbk #klienten-info_wrapper .ki-artikeltitle-overview {
  font: normal normal 500 18px/27px 'Outfit' !important;
    letter-spacing: 0.81px !important;
    font-size: clamp(14px, 2vw, 18px) !important;
    line-height: 1.50em !important;
    text-transform: none !important;
}

/* Pagination Button */
#bbk #klienten-info_wrapper .kicss-button-mini:hover {
    color: #fff !important;
}

/* klienteninfo Slider */


#bbk #klienten-info_wrapper li {
    list-style: none;
}

#bbk #klienten-info_wrapper li .ki-ausgabe {
    display: none;
}

#bbk #klienten-info_wrapper #ki-navlinks .ki-artikeltitle-overview {
    font-family: 'Outfit';
    text-align: left;
    letter-spacing: 0 !important;
    font-size: 18px !important;
    line-height: 1.50em !important;
    text-transform: none !important;
    color: #fff;
    font-weight: 200 !important;
}

@media only screen and (max-width: 500px) {
    #bbk #klienten-info_wrapper #ki-navlinks .ki-artikeltitle-overview {
        word-break: break-word;
        -webkit-hyphens: auto;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
        hyphens: auto;
    }
}

#bbk #klienten-info_wrapper #ki-navlinks .ki-artikeltitle-overview:hover {
    text-decoration: underline;
}

#bbk #ki-navlinks .slider-container {
    margin: 0px 88px;
    margin-top: 5vh;
}

#bbk .swiffy-slider .slider-nav {
    visibility: visible;
}

#bbk .slider-nav {
    visibility: visible;
    opacity: 1;
    -webkit-filter: none;
    filter: none;
    transform: scale(var(--swiffy-slider-nav-zoom));
}

#bbk .slider-nav::after {
    content: "";
    -webkit-mask: none;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: transparent;
    background-origin: content-box;
    width: 3rem;
    height: 3rem;
    background-image: url("/wp-content/uploads/2023/05/slider-nav-left.svg");
    background-size: contain;
    background-repeat: no-repeat;
}

#bbk #klienten-info_wrapper #ki-navlinks .ki-artikeltitle-overview:hover {
    text-decoration: underline;
}

/* Singel Klienteninfo */
#bbk #klienten-info_wrapper .ki-pagetitle {
    text-transform: uppercase;
}

#bbk #klienten-info_wrapper h1,
#bbk #klienten-info_wrapper .ki-pagetitle {
    letter-spacing: 0;
}

#bbk #klienten-info_wrapper .kicss-button,
#bbk #klienten-info_wrapper .kicss-button-mini,
#bbk #klienten-info_wrapper .ki-btn,
#bbk #klienten-info_wrapper a.ki-btn,
#bbk #klienten-info_wrapper .ki-btn:hover,
#bbk #klienten-info_wrapper a.ki-btn:hover {
    color: var(--braun) !important;
    background: #f2f2f2;
    padding: 10px 20px !important;
    font-size: clamp(11px,2vw,14px);
}

#bbk #klienten-info_wrapper .kicss-button:hover,
#bbk #klienten-info_wrapper .ki-btn:hover,
#bbk #klienten-info_wrapper a.ki-btn:hover,
#bbk #klienten-info_wrapper .ki-navbar a.ki-current,
#bbk #klienten-info_wrapper a.ki-btn-inverse {
    background: var(--dunkelgruen);
    color: #ffffff !important;
    font-size: clamp(11px,2vw,14px);
}





/* ////////////////////////////////////////// Team */
#bbk .team-member {
    margin-bottom: 0;
}
#bbk .row .team-member[data-style=bio_fullscreen_alt] h5 {
  font-weight: 200;
  margin-bottom: 0;
  font-size: 18px;
  color: #676767;
}
#bbk .team-member[data-style=bio_fullscreen_alt] h3 {
    margin-bottom: 0;
        font-size: clamp(14px, 2vw, 18px);
        text-transform: uppercase;
    font-weight: 400;
}

/* Mitarbeiter */
#bbk .team-member h4 {
  font-weight: 400;
}
#bbk .team-member .social {
    margin-top: 0.5em;
}
#bbk .team-member .social li {
    float: none;
    display: block;
  line-height: 1em
  
}
#bbk .team-member .social li a {
    font-size: 14px;
    margin: 0;
    color: var(--dunkelgruen);
}
#bbk .team-member .social li a:hover {
    text-decoration: underline;
}
#bbk .team-member .social li:after {
    display: none;
}

/* ////////////////////////////////////////// Geordnete Liste */

ol li {
  margin-bottom: 1em;
}
ol ::marker {
  font-weight: 500;
}


/*


       /\
      /  \/\
_____/___/__\______________________________________________________________

                                 STARTSEITE
___________________________________________________________________________*/


#leistungen .content {
  font-size: 80%;
  line-height: 1.35em;
}


/*


       /\
      /  \/\
_____/___/__\______________________________________________________________

                                 LEISTUNGEN
___________________________________________________________________________*/


#bbk .nectar-scrolling-tabs[data-tab-spacing="20%"] .scrolling-tab-content > div {
    padding-top: 0%;
    padding-bottom: 0%;
}

/*


       /\
      /  \/\
_____/___/__\______________________________________________________________

                                 TEAM
___________________________________________________________________________*/



#bbk .icon-bbk-phone.team,
#bbk .icon-bbk-mail.team {
    padding-left: 0;
    background: none !important;
  font-size: 14px;

}
 @media only screen and (max-width: 999px) {
    .nectar-hor-list-item .nectar-list-item-btn {
        position: static !important;
    }
}

/*


       /\
      /  \/\
_____/___/__\______________________________________________________________

                                 KARRIEREBUTTON
___________________________________________________________________________*/


#karrierebutton {
  margin: 0 !important;
  padding: 0 !important;
  position: absolute;
}
#karrierebutton a {
    display: block;
    background: var(--gruen);
    color: #fff;
    padding: 0.75em 2em;
    -moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    position: fixed;
    right: -67px;
    bottom: 131px;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
}

@media only screen and (max-width: 690px)
 {
    #karrierebutton a {
        font-size: 12px;
        padding: 0.5em 1em;
    right: -49px;
    bottom: 100px;
    }

 }

#karriere-form .wpb_column:has(.schraege-rechts),
#karriere-form .wpb_column:has(.schraege-rechts) > .vc_column-inner,
#karriere-form .wpb_column:has(.schraege-rechts) .wpb_wrapper {
  overflow: visible;
}

#karriere-form .img-with-aniamtion-wrap:has(.schraege-rechts) {
  width: calc(100% + ((100vw - 100%) / 2));
  max-width: none !important;
  margin-left: calc((100vw - 100%) / -2);
}

#karriere-form .img-with-aniamtion-wrap:has(.schraege-rechts) .inner,
#karriere-form .img-with-aniamtion-wrap:has(.schraege-rechts) .hover-wrap,
#karriere-form .img-with-aniamtion-wrap:has(.schraege-rechts) .hover-wrap-inner {
  width: 100%;
  overflow: visible;
}

#karriere-form img.schraege-rechts {
  display: block;
  width: 100% !important;
  height: clamp(320px, 42vh, 520px) !important;
  max-width: none !important;
  object-fit: cover;
  object-position: center center;
  clip-path: polygon(0 0, 100% 0, 76% 100%, 0 100%);
}

@media only screen and (max-width: 999px) {
  #karriere-form .img-with-aniamtion-wrap:has(.schraege-rechts) {
    width: 100%;
    margin-left: 0;
  }

  #karriere-form img.schraege-rechts {
    height: clamp(260px, 36vh, 420px) !important;
    clip-path: polygon(0 0, 100% 0, 88% 100%, 0 100%);
  }
}
/*


       /\
      /  \/\
_____/___/__\______________________________________________________________

                                 FOOTER
___________________________________________________________________________*/

#footer-outer .social a[href*="gipfelgold.com"]:after {
  content:"GIPFELGOLD®";
}
#footer-outer .social a[href*="gipfelgold.com"] span,
#footer-outer .social a[href*="gipfelgold.com"] i {
  display: none !important;
}

/*


       /\
      /  \/\
_____/___/__\______________________________________________________________

                                 NINJA FORMS
___________________________________________________________________________*/

.two-col-list .nf-field-element ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 24px;
  padding-left: 0;
}

.two-col-list .nf-field-element li {
  margin: 0;
}

@media only screen and (max-width: 690px) {
  .two-col-list .nf-field-element ul {
    grid-template-columns: 1fr;
  }
}

#karriere-form #nf-form-2-cont {
  --nf-accent: #99c221;
  --nf-panel: #617758;
  --nf-text: #ffffff;
  color: var(--nf-text);
}

#karriere-form #nf-form-2-cont .nf-form-title,
#karriere-form #nf-form-2-cont .nf-form-fields-required,
#karriere-form #nf-form-2-cont .nf-progress-container,
#karriere-form #nf-form-2-cont .ninja-forms-req-symbol {
  display: none !important;
}

#karriere-form #nf-form-2-cont .nf-form-content {
  max-width: none;
  padding: clamp(42px, 5vw, 56px) clamp(34px, 7vw, 80px) clamp(34px, 4vw, 42px);
}

#karriere-form #nf-form-2-cont .nf-breadcrumbs {
  display: block;
  margin: 0 0 30px;
  padding: 0;
}

#karriere-form #nf-form-2-cont .nf-breadcrumbs li {
  display: none;
  margin: 0;
  padding: 0;
}

#karriere-form #nf-form-2-cont .nf-breadcrumbs li.active {
  display: block;
}

#karriere-form #nf-form-2-cont .nf-breadcrumbs li.active a {
  display: inline-block;
  pointer-events: none;
  color: transparent !important;
  font-size: 0;
  line-height: 1;
  text-decoration: none;
}

#karriere-form #nf-form-2-cont .nf-breadcrumbs li.active a:before {
  color: var(--nf-accent);
  font-family: "Outfit", sans-serif;
  font-size: clamp(25px, 2.05vw, 29px);
  font-weight: 200;
  letter-spacing: 0.045em;
  line-height: 1.86;
  text-transform: uppercase;
}

#karriere-form #nf-form-2-cont .nf-breadcrumbs li:nth-child(1).active a:before {
  content: "SCHRITT 1 / 3";
}

#karriere-form #nf-form-2-cont .nf-breadcrumbs li:nth-child(2).active a:before {
  content: "SCHRITT 2 / 3";
}

#karriere-form #nf-form-2-cont .nf-breadcrumbs li:nth-child(3).active a:before {
  content: "SCHRITT 3 / 3";
}

#karriere-form #nf-form-2-cont .nf-row {
  margin-bottom: 0;
}

#karriere-form #nf-form-2-cont .nf-field-container {
  margin-bottom: 30px;
}

#karriere-form #nf-form-2-cont .html-container {
  margin-bottom: 28px;
}

#karriere-form #nf-form-2-cont .firstname-container,
#karriere-form #nf-form-2-cont .lastname-container,
#karriere-form #nf-form-2-cont .city-container,
#karriere-form #nf-form-2-cont .phone-container,
#karriere-form #nf-form-2-cont .email-container {
  margin-bottom: 14px;
}

#karriere-form #nf-form-2-cont .nf-field-label {
  margin-bottom: 18px;
}

#karriere-form #nf-form-2-cont .nf-field-label label,
#karriere-form #nf-form-2-cont .nf-label-span,
#karriere-form #nf-form-2-cont .html-container h2 {
  color: var(--nf-text);
  font-family: "Gotham", "Outfit", sans-serif;
  font-size: clamp(19px, 1.42vw, 20px);
  font-weight: 500;
  letter-spacing: 0.045em;
  line-height: 1.25;
}

#karriere-form #nf-form-2-cont .nf-field-description,
#karriere-form #nf-form-2-cont .nf-field-description p {
  margin: -8px 0 24px;
  color: rgba(255, 255, 255, 0.86);
  font-family: "Outfit", sans-serif;
  font-size: 18px;
  font-weight: 200;
  letter-spacing: 0;
  line-height: 1.5;
}

#karriere-form #nf-form-2-cont .list-radio-wrap ul,
#karriere-form #nf-form-2-cont .list-checkbox-wrap ul {
  margin: 0;
  padding: 0;
}

#karriere-form #nf-form-2-cont .list-radio-wrap li,
#karriere-form #nf-form-2-cont .list-checkbox-wrap li {
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 24px;
  margin: 0;
  color: var(--nf-text);
  line-height: 1.35;
}

#karriere-form #nf-form-2-cont .list-radio-wrap li,
#karriere-form #nf-form-2-cont .nf-field-container:not(.two-col-list) .list-checkbox-wrap li {
  margin-bottom: 20px !important;
}

#karriere-form #nf-form-2-cont .two-col-list .nf-field-element ul {
  gap: 22px clamp(34px, 8vw, 96px);
}

@media only screen and (max-width: 1450px) and (min-width: 1000px) {
  #karriere-form #nf-form-2-cont .two-col-list .nf-field-element ul {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

#karriere-form #nf-form-2-cont .list-radio-wrap input[type="radio"],
#karriere-form #nf-form-2-cont .list-checkbox-wrap input[type="checkbox"] {
  flex: 0 0 20px;
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  border: 1px solid var(--nf-accent) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  appearance: none;
  -webkit-appearance: none;
}

#karriere-form #nf-form-2-cont .list-radio-wrap input[type="radio"]:checked,
#karriere-form #nf-form-2-cont .list-checkbox-wrap input[type="checkbox"]:checked {
  background: var(--nf-accent) !important;
  box-shadow: inset 0 0 0 4px var(--nf-panel) !important;
}

#karriere-form #nf-form-2-cont .list-radio-wrap label,
#karriere-form #nf-form-2-cont .list-checkbox-wrap label {
  margin: 0;
  color: rgba(255, 255, 255, 0.9);
  font-family: "Outfit", sans-serif;
  font-size: clamp(18px, 1.25vw, 18px);
  font-weight: 200;
  letter-spacing: 0;
  line-height: 1.5;
}

#karriere-form #nf-form-2-cont input[type="text"],
#karriere-form #nf-form-2-cont input[type="email"],
#karriere-form #nf-form-2-cont input[type="tel"],
#karriere-form #nf-form-2-cont input[type="url"],
#karriere-form #nf-form-2-cont input[type="number"],
#karriere-form #nf-form-2-cont textarea {
  min-height: 38px;
  border: 1px solid var(--nf-accent) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--nf-text) !important;
  font-family: "Outfit", sans-serif;
  font-size: 18px;
  font-weight: 200;
  letter-spacing: 0;
  line-height: 1.5;
  box-shadow: none !important;
}

#karriere-form #nf-form-2-cont input::placeholder,
#karriere-form #nf-form-2-cont textarea::placeholder {
  color: rgba(255, 255, 255, 0.7);
}

#karriere-form #nf-form-2-cont .nf-next-previous {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 20px;
  margin: 28px 0 0;
  padding: 0;
}

#karriere-form #nf-form-2-cont .nf-next-previous li {
  margin: 0;
}

#karriere-form #nf-form-2-cont .nf-next,
#karriere-form #nf-form-2-cont .nf-previous,
#karriere-form #nf-form-2-cont input[type="submit"] {
  min-width: 174px;
  min-height: 48px;
  padding: 0 24px !important;
  border: 2px solid var(--nf-accent) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--nf-text) !important;
  font-family: "Outfit", sans-serif;
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: 0.045em;
  line-height: 1 !important;
  text-transform: none;
  box-shadow: none !important;
}

#karriere-form #nf-form-2-cont .nf-next {
  min-width: 220px;
}

#karriere-form #nf-form-2-cont input[type="submit"] {
  background: var(--nf-accent) !important;
  color: var(--nf-text) !important;
  text-transform: uppercase;
}

#karriere-form #nf-form-2-cont .nf-previous {
  min-width: 48px;
  width: 48px;
  padding: 0 !important;
  color: transparent !important;
  font-size: 0 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cpath d='M11.5 3 5.5 9l6 6' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E") !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: 18px 18px !important;
}

#karriere-form #nf-form-2-cont .nf-next:hover,
#karriere-form #nf-form-2-cont .nf-next:focus,
#karriere-form #nf-form-2-cont .nf-previous:hover,
#karriere-form #nf-form-2-cont .nf-previous:focus,
#karriere-form #nf-form-2-cont input[type="submit"]:hover,
#karriere-form #nf-form-2-cont input[type="submit"]:focus {
  background-color: var(--nf-accent) !important;
  color: var(--nf-text) !important;
}

#karriere-form #nf-form-2-cont .nf-error-wrap {
  margin-top: 14px;
  padding-left: 0;
}

#karriere-form #nf-form-2-cont .nf-error-wrap .nf-error-msg,
#karriere-form #nf-form-2-cont .nf-form-errors .nf-error-msg {
  position: relative;
  display: block;
  padding-left: 20px;
}

#karriere-form #nf-form-2-cont .nf-error-wrap .nf-error-msg:before,
#karriere-form #nf-form-2-cont .nf-form-errors .nf-error-msg:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.66em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #FF9898;
}

#karriere-form #nf-form-2-cont .nf-error-msg,
#karriere-form #nf-form-2-cont .nf-error-msg p,
#karriere-form #nf-form-2-cont .nf-form-errors,
#karriere-form #nf-form-2-cont .nf-form-errors .nf-error-msg {
  color: rgba(255, 255, 255, 0.9) !important;
  font-family: "Outfit", sans-serif;
  font-size: 18px;
  font-weight: 200;
  letter-spacing: 0;
  line-height: 1.5;
}

#karriere-form #nf-form-2-cont .nf-form-errors {
  margin: 28px 0 0 80px;
  padding: 0;
}

#karriere-form #nf-form-2-cont .nf-form-errors nf-errors {
  display: block;
  margin: 0;
  padding: 0;
}

#karriere-form #nf-form-2-cont .nf-response-msg:not(:empty) {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(420px, 52vw, 760px);
  padding: clamp(34px, 6vw, 80px);
  text-align: center;
}

#karriere-form #nf-form-2-cont .nf-response-msg:not(:empty),
#karriere-form #nf-form-2-cont .nf-response-msg p {
  color: var(--nf-text);
  font-family: "Outfit", sans-serif;
  font-size: clamp(28px, 2.8vw, 42px);
  font-weight: 200;
  letter-spacing: 0;
  line-height: 1.3;
}

@media only screen and (max-width: 690px) {
  #karriere-form #nf-form-2-cont .nf-form-content {
    padding: 34px 24px;
  }

  #karriere-form #nf-form-2-cont .nf-next-previous {
    align-items: flex-start;
    flex-direction: column;
  }
}
