.hero-image{
    background-image: url('../../assets/images/referenz/cityhotelfeuerbach/opt-cityhotelfeuerbach-hero.jpg');
    background-position: 37%;
}

.hero-title{
    text-align: center;
}

.projekt-beschreibung-image{
    width: unset;
    height: 200px;
    /* max-height: 200px; */
    margin: 3em 0em;
    background-image: url('../../assets/images/referenz/cityhotelfeuerbach/opt-cityhotel-holzwand.jpg');
    background-size: cover;
    background-position: center;
}

.projekt-beschreibung-inserted-image{
    max-width: 150px;
    /* animation: animateProjectDescriptionImages 10s ease-in-out infinite; */
}

.herausforderungen-text{
    padding: 0em 1.5em 2em 1em;
}

.herausforderungen-image{
    background-image: url('../../assets/images/referenz/cityhotelfeuerbach/opt-cityhotel-fruehstueck.jpg');
}

.loesung-image > img{
    position: absolute;
    max-height: 150px;
    filter: brightness(.8);
}

.loesung-image img:nth-child(1){
    top: 5%;
}

.loesung-image > img:nth-child(2){
    top: 30%;
    right: 0%;
}

.loesung-image > img:nth-child(3){
    top: 50%;
    left: 30%;
}

.loesung-image > img:nth-child(4){
    top: 70%;
    left: 0%;
    transform: scale(100%);
}

.loesung-ergebnis-trenn-image{
    background-image: url('../../assets/images/referenz/cityhotelfeuerbach/opt-cityhotel-raummitsegel.jpg');
}

/* ----- Keyframes ----- */

@keyframes animateProjectDescriptionImages{

    0%{
        transform: scale(100%);
    }

    50%{
        transform: scale(90%);
    }

    100%{
        transform: scale(100%);
    }

}

/* ----- Mediaqueries ----- */

/* Ganz kleine Größen wie z.B. iPhone 4 */
@media (max-width: 320px){

 

}

/* Größer als Standardgröße */

@media (min-width: 380px){

   

}

@media (min-width: 650px){


 
}

@media (min-width: 768px){

    

}

@media (min-width: 992px){

    .herausforderungen-text{
        padding: 0em 2em 3.5em 2em;
    }

}

@media (min-width: 1200px){

    .hero-image{
        background-position: center;
    }

    .ueber-das-projekt{
        padding: 0px 155px;
    }

    .projekt-beschreibung{
        margin-bottom: 1.5em;
    }

    .projekt-beschreibung-block{
        width: 50%;
    }

    .projekt-beschreibung-image{
        height: 600px;
        margin: unset;
    }

    .herausforderungen-text{
       padding: 155px !important;
    }

    .herausforderungen-image{
        display: block;
        background-position: 50% 80%;
    }

    .loesung-text{
        padding-bottom: 0em;
        padding: 155px !important;
    }

    .loesung-ergebnis-trenn-image{
        display: block;
    }

    .ergebnis-text{
        padding: 155px !important;
    }

    .cta-section{
        padding: 0px 155px 200px 155px;
    }
    
}

@media (min-width: 1400px){

  
    
}

@media (min-width: 1700px){

    .ueber-das-projekt{
        margin-bottom: 2.5em;
    }

    .projekt-beschreibung{
        margin-bottom: 0;
    }

    .herausforderungen-image{
        display: none;
    }

    .loesung-text{
        padding-top: 0 !important;
    }

    .loesung-ergebnis-trenn-image{
        display: none;
    }

    .ergebnis-text{
        padding-top: 0 !important;
    }
    
}

@media (min-width: 1920px){



}