@charset "utf-8";
/****************************************
 *   Styling Turbinen   *
 ***************************************/

article#turbines{
    /*padding: 100px 30px 30px;*/
    padding-left: 30px;
    padding-right: 30px;
    max-width: 1400px;
    margin: auto;
}
div.turbine{
    padding: 50px 0;
    display: grid;
    grid-gap: 15px;
    grid-template-areas:
            "logo"
            "bild"
            "daten1"
            "daten2"
            "daten3"
            "daten4"
            "daten5"
            "daten6"
            "text";
    grid-template-rows: min-content;
    grid-auto-rows: min-content;
}

img.turbine-logo{
    grid-area: logo;
}
#turbine-enomad img.turbine-logo{
    background-color: #1e96d3;
}
#turbine-waterlily img.turbine-logo{
    background-color: #6ca339;
}
img.turbine-bild{
    grid-area: bild;
}
div.turbine .daten1{
    grid-area: daten1;
}
div.turbine .daten2{
    grid-area: daten2;
}
div.turbine .daten3{
    grid-area: daten3;
}
div.turbine .daten4{
    grid-area: daten4;
}
div.turbinen-liste{
    display: block;
    margin: 0;
    text-align: center;
}
h4.turbine-daten{
    margin: 0;
}
ul.turbine-daten{
    list-style-type: none;
    padding: 0;
    font-size: 15px;
}
div.turbine-text{
    grid-area: text;
    background-color: whitesmoke;
    font-size: 15px;
    padding: 20px 30px;
    width: 100%;
    text-align: center;
}
div.turbine-text a{
    color: cadetblue;
    font-style: italic;
    font-weight: bold;
}

/* S (Tablet Quer, Netbooks, kleine Laptops) */
@media (min-width: 30.06em) {
    div.turbine#turbine-enomad {
        grid-template-columns: 1fr 1fr;
        grid-template-areas:
                "logo logo"
                "bild daten1"
                "bild daten2"
                "daten3 daten4"
                "daten5 daten6"
                "text text";
    }
    div.turbine#turbine-waterlily {
        grid-template-columns: 1fr 1fr;
        grid-template-areas:
                "logo logo"
                "bild daten1"
                "bild daten2"
                "daten3 daten5"
                "daten4 daten6"
                "text text";
    }
    img.turbine-logo {
        padding: 0 30%;
    }
    div.turbine-text {
        font-size: 20px;
    }
}
/*M (Tablet Quer, Netbooks, kleine Laptops):*/
@media (min-width: 50.01em) {
    div.turbine#turbine-enomad {
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-areas:
                "bild logo logo"
                "bild daten1 daten3"
                "bild daten2 daten4"
                "text text text";
    }
    div.turbine#turbine-waterlily {
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-areas:
                "bild logo logo"
                "bild daten1 daten2"
                "bild daten3 daten5"
                "bild daten4 daten6"
                "text text text";
    }
    img.turbine-logo {
        padding: 0 35%;
    }
    div.turbine-text {
        padding: 20px 20%;
    }
}