/*------------------------------------*\
        # FONTS
        \*------------------------------------*/
        @import url(../../css2_fa134b2597bf8da1.css);

        /*------------------------------------*\
        # VARIABLEN
        \*------------------------------------*/
        :root {
            /* COLORS */
            /* --primaryColor: #ce1b18; */
            /* --secondaryColor: #343434; */
            /* festgelegte Farben f�r die gesamte Anzeige, damit man immer nur eine Sache anpassen muss */

            /* VALUES */
            --spacingLeftRight: 5%;
            --spacingTopBottom: 20px;
        }

        /*------------------------------------*\
        # HTML-ELEMENTS
        \*------------------------------------*/
        * {
            padding: 0;
            margin: 0;

            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;

            -webkit-font-variant-ligatures: no-common-ligatures;
            font-variant-ligatures: no-common-ligatures;
        }

        body {
            padding-top: 25px;
            font-family: "Georgia", Arial, Helvetica, sans-serif;
            font-size: 14px;
            line-height: 1.4em;
            background-color: #fff;

            /* BACKGROUND IMAGE ANFANG */
            background-image: url(background.png);
            background-repeat: no-repeat;
            background-position: top;
            background-size: contain;
            min-height: 1080px;
            position: relative;
            z-index: 0;
            /* BACKGROUND IMAGE ENDE */
        }

        #gradient_backgroundimage {
          background: linear-gradient(
            rgba(239, 239, 239, 0.3) 0%,
            rgb(255 255 255) 90%);
            background-repeat: no-repeat;
            background-position: top;
            background-size: contain;
            line-height: 1.5em;
            position: absolute;
            top: 0px;
            width: 100%;
          }

        a {
            color: black;
            transition: 0.3s;
        }

        a:hover {
          text-decoration: underline;
          font-weight: normal;
          color: #48663c;
        }

        h1 {
            font-size: 25px;
            line-height: 1.2;
            font-weight: bold;
            margin-bottom: 0px;
        }

        h3 {
            font-size: 1.4em;
            margin-bottom: 0px;
        }

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

        ul ul {
          padding-left: 30px;
        }

        li {
            padding-left: 16px;
            line-height: 1.6em;
        }

        li:before {
            content: "�"; /* Insert content used as bullet point*/
            padding-right: 8px;
            margin-left: -14px;
            font-size: 1.2em;
        }

        img {
            display: block;
            border: none;
            max-width: 100%;
            height: auto;
        }

        main {
            margin: 25px auto;
            margin-bottom: 50px;
            margin-top: 0px;
            width: 740px;
            background: #fff;
            box-sizing: content-box;
            box-shadow: 0px 2px 46px -10px rgba(0, 0, 0, 0.3);
            overflow: auto;
            z-index: 99999;
            position: relative;
        }

        /*------------------------------------*\
        # HEADER
        \*------------------------------------*/
        #top_bar {
            width: 100%;
            padding: 0 10px;

            /* display: grid;
            grid-template-columns: 50% 50%; */
            /* wenn man 2 boxen im header oben hat mit Logo und text */
        }

        #top_bar_logo{
          text-align: left;
          position: absolute;
          z-index: 1;
        }

        #top_bar_logo img{
          width: 100px;
          display: inline-block;
        }

        #top_bar_text{
          margin: auto;
          /* auskommentieren, wenn man ein textteil im header oben noch hat, damit es mittig angezeigt wird */
        }

        header {}

        #header_image {}

        #header_video {}

        #hiring_organization {
            padding: var(--spacingTopBottom) var(--spacingLeftRight);
        }

        #description_introduction {}

          #description {
            display: flex;
            flex-flow: column;
            position: relative;
            padding: var(--spacingTopBottom) var(--spacingLeftRight);
            margin: 0 5%;
            color: #48663c;
            transition: 0.3s;
            padding: 25px 0;
            border-top: 4px dotted #48663c;
            border-bottom: 4px dotted #48663c;
            text-align: center;
          }

        #description_location {
          padding-top: 20px;
        }

        #description_location i {
          margin-right: 5px;
        }

        #description_titel {
        }

        #content_box_untertitel{
          margin: 0 5%;
          padding: 30px 0;
          border-bottom: 4px dotted #48663c;
        }

        /*------------------------------------*\
        # SLIDER
        \*------------------------------------*/

        .slider-wrap {
          width: 100%;
          height: auto;
          position: relative;
        }

        .slider-wrap img {
          display: block;
        }

        .slideshow {
          position: absolute;
          width: 100%;
          top: 0px;
          left: 0px;
          z-index: 0;
        }

        .slideshow li span {
          width: 100%;
          position: absolute;
          top: 0px;
          left: 0px;
          color: transparent;
          opacity: 0;
          z-index: 0;
          backface-visibility: hidden;
          animation: image 18s linear infinite;
        }

        #sliderSizeImage {
          opacity: 0;
          width: 100%;
        }

        .sliderImage {
          width: 100%;
        }

        /* bei 2 Bildern einkommentieren */
        /* @keyframes image {
          0% {
            opacity: 0;
            animation-timing-function: ease-in;
          }

          30% {
            opacity: 1;
            animation-timing-function: ease-in;
          }

          60% {
            opacity: 0;
            animation-timing-function: ease-in;
          }

          100% {
            opacity: 0;
            animation-timing-function: ease-in;
          }
        } */

        /* bei 3 Bildern einkommentieren */
        @keyframes image {
          0% {
            opacity: 0;
            animation-timing-function: ease-in;
          }
          8% {
            opacity: 1;
            animation-timing-function: ease-out;
          }
          25% {
            opacity: 1;
          }
          40% {
            opacity: 0;
          }
          100% {
            opacity: 0;
          }
        }

        .slideshow li {
          margin: 0;
          padding: 0;
          list-style: none;
        }

        .slideshow li:nth-child(1) span {
        }

        .slideshow li:nth-child(2) span {
          animation-delay: 6s;
        }

        .slideshow li:nth-child(3) span {
          animation-delay: 12s;
        }

        ul.slideshow {
          margin: 0;
        }

        /*------------------------------------*\
        # CONTENT
        \*------------------------------------*/
        #content {}

        .content_box {
            padding: var(--spacingTopBottom) var(--spacingLeftRight);
        }

        .content_box:hover .content_box_header h3 {
            color: #48663c;
        }

        .content_box_header {
            padding-bottom: 15px;
            display: flex;
            color: #aab946;
        }

        .content_box_header i {
            color: black;
            font-size: 2.2em;
            margin-right: 3%;
        }

        .content_box_header h3 {
            transition: 0.3s;
            margin-top: auto;
            margin-bottom: auto;
        }

        .content_box_text {
          padding-bottom: 30px;
          border-bottom: 4px dotted #48663c;
        }

        #responsibilities {
          padding-top: 40px;
        }

        #qualifications {
        }

        #incentives {}

        #contact .content_box_text{
          border: none !important;
        }

        /*------------------------------------*\
        # CONTACT PERSON
        \*------------------------------------*/
        .ap_box {
            padding: 10px;
            padding-bottom: 20px;
            width: 70%;
            margin: 0 15%;
            text-align: center;
            height: auto;
            overflow: auto;
        }

        .ap {
            background-color: white;
            display: inline-block;
            text-align: left;
            padding: 20px;
            transition: 0.3s;
            box-shadow: 0px 10px 30px -19px rgb(0 0 0 / 75%);
            border-radius: 9999px;
            display: grid;
            grid-template-columns: 35% 65%;
        }

        .ap:hover > #ap_image {
          transform: scale(1.03);
        }

        #ap_image {
            width: 130px;
            height: 130px;
            border-radius: 999999px;
            box-shadow: 0px 11px 41px -14px rgb(0 0 0 / 75%);
            transition: 0.3s;
            padding: 20px;
        }

        #ap_info {
          margin: auto 0;
        }

        .ap i {
          padding-right: 8px;
        }

        .ap a{
          transition: 0.3s;
        }

        .ap a:hover{
          font-weight: bold;
          text-decoration: underline;
        }

        /*------------------------------------*\
        # BUTTON
        \*------------------------------------*/
        .button_box {
            text-align: center;
            margin-bottom: 10px;
        }

        #button {
            display: inline-block;
            background-color: #ffda00;
            color: #e5162a;
            padding: 10px 40px;
            border-radius: 999999px;
            font-size: 1.1em;
            font-weight: 600;
            transition: 0.3s;
        }

        #button:hover {
            display: inline-block;
            background-color: #e5162a;
            color: #ffda00;
            box-shadow: 0px 10px 32px -15px rgba(0, 0, 0, 1);
            transform: translateY(-3px);
        }

        .button_link {
          color: white;
        }

        .button_link:hover {
          color: grey;
        }

        /*------------------------------------*\
        # FOOTER
        \*------------------------------------*/
        .footer {
            display: block;
            overflow: auto;
            padding: var(--spacingTopBottom) var(--spacingLeftRight);
            background-color: #aab946;
            color: white;
        }

        .footer a {
          color: white;
          transition: 0.3s;
        }

        .footer a:hover{
          font-weight: normal;
          text-decoration: underline;
          color: #48663c;
        }

        .footer_left {
          float: left;
        }

        .footer_right {
          float: right;
        }

        .footer i {
          margin-right: 10px;
    	    color: #fff;
    	    height: 13px;
    	    width: 13px;
        }

        /*------------------------------------*\
        # VIDEO-YouTube
        \*------------------------------------*/

        .box-youtube {
          border: solid 1px rgba(220, 223, 226, 0.8);
          border-radius: 3px;
          margin-bottom: 10px;
        }

        .box-content-youtube {
          background-color: white;
          padding: 24px;
        }


        #YouTubeVideoPlayer {
          display: block;
          width: 100%;
        }

        .noPadding-youtube {
          padding: unset;
        }

        /*------------------------------------*\
        # SOCIAL NETWORKS
        \*------------------------------------*/

        #social_networks {
            background-color: black;
            text-align: center;
            padding: 0px 5% 10px 5%;
            text-decoration: none;
        }

        .social_network_link,
        #social_network_kununuLink {
            color: white;
            text-decoration: none;
        }

        .social_network_link:hover,
        #social_network_kununuLink:hover {
            color: rgb(109, 109, 109);
            text-decoration: none;
        }

        .social_network_icon {
            padding: 10px 5px 0px 5px;
            font-size: 1.4em;
        }

        #social_network_kununuLink {
          font-weight: bold !important;
        }

        #social_network_kununuLink p {
            font-family: "Barlow", sans-serif !important;
        }

        /*------------------------------------*\
        # UTILITIES
        \*------------------------------------*/

        div.breaker {
            clear: both;
            overflow: hidden;
        }

        .ci-ignore {
            visibility: hidden;
            display: none;
            margin: 0;
            padding: 0;
        }

        /*------------------------------------*\
        # RESPONSIVE
        \*------------------------------------*/

        @media only screen and (max-width: 740px) {
            * {
                padding: 0;
                margin: 0;
                -moz-box-sizing: border-box;
                -webkit-box-sizing: border-box;
                box-sizing: border-box;
            }

            body {
                padding-top: 0px;
                -webkit-hyphens: auto;
                -moz-hyphens: auto;
                -ms-hyphens: auto;
                hyphens: auto;
            }

            main {
                margin: 0em;
                width: 100%;
            }

            #top_bar{
              display: block;
              text-align: center;
              margin-bottom: 10px;
            }

            #top_bar_logo{
              position: relative;
              margin-bottom: 20px;
              text-align: center;
            }



            .ap_box{
              width: 100%;
              margin: 0;
            }

            .ap {
                display: block;
                border-radius: 10px;
                text-align: center;
            }

            #ap_image {
                display: inline-block;
                float: unset !important;
                margin-right: 0px !important;
                margin-right: unset;
                margin-bottom: 20px;
            }

            #ap_info {
                float: unset !important;
            }

            .footer {
                text-align: center;
            }

            .footer_left {
                float: none;
                margin: 0 0 15px 0;
            }

            .footer_right {
                float: none;
                margin: 0;
            }
        }