@charset "utf-8";
/************************************
 *   Styling des Mission-Abschnitts *
 ***********************************/

article#mission {
    padding-top: 5em;
    max-width: 1520px;
    margin: 0 auto;
    min-height: auto;
}

article#mission {
    display: grid;
    grid-template-areas:
      "img1"
      "text"
        "img2";
    grid-template-rows: min-content;
    grid-auto-rows: min-content;
}
#mission img{
    padding: 100px;
    align-self: center;
}
#mission #icon_1{
    color: #9b9b9b;
    grid-area: img1;
    margin: auto;
}
#mission #icon_2{
    color: #9b9b9b;
    grid-area: img2;
    margin: auto;
}

article#mission p {
    grid-area: text;
    text-align: center;
    font-size: 15px;
    padding: 40px;
    font-style: italic;
}
#hoehenprofil {
    margin: 100px 20px;
}
#hoehenprofil p {
    padding-right: 20px;
    margin: 0;
    text-align: right;
    font-style: italic;
    color: #9b9b9b;
    font-size: 15px;
}

article#mission h2 {
    grid-column: 1 / -1;
}

/* S (Tablet Quer, Netbooks, kleine Laptops) */
@media (min-width: 30.06em) {
    article#mission p {
        font-size: 20px;
        margin: 1em;
    }
    #hoehenprofil p{
        font-size: 20px;
    }
}
/*M (Tablet Quer, Netbooks, kleine Laptops):*/
@media (min-width: 50.01em) and (max-width: 63.98em) {
    article#mission p {
        padding: 1em 5em;
    }
}

/*L (Laptops und kleine Desktops):*/
@media (min-width: 64em){
    article#mission {
        grid-template-columns: 1fr 2fr 1fr;
        grid-template-areas:
            "img1 text img2";
    }
    article#mission p {
        align-self: center;
    }
    #hoehenprofil {
        margin-top: 0;
    }
}