/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

 .greenlomake {
    background: #E6E6E6;
    border-radius: 1rem;
    padding: 40px 140px;
    overflow:hidden;
    position:relative;
    }

    .greenlomake__display-error {
        display:none;
        border: 5px solid #185c33;
        padding: 10px 20px;
        margin-bottom: 20px;
        font-weight: 600;
    }

    .greenlomake__thankyou {
        display:none;
    }

    .greenlomake__wrapper {
        position:relative;
        z-index:1;
    }

    .greenlomake:before {
        content: url('../images/leaf.svg');
        display:block;
        position:absolute;
        top:0;
        width:75%;
        height:auto;
    }

    .greenlomake__lisateksti {
        text-align:center;
    }

        .greenlomake__lisateksti p {
            line-height:1.5;
            font-size: 1.6rem;
        }

    .greenlomake__otsikko {
        font-size:2.8rem;
        color:#185c33;
        font-weight: 600;
        margin-bottom:20px;
    }

    .greenlomake__label {
       color:#000; 
       font-size: 1.8rem;
    }

    .greenlomake__alaotsikko {
        font-size:2.2rem;
        font-weight: 600;
        text-transform:uppercase;
        margin-bottom:20px;
    }

    .greenlomake__fieldgroup {
        margin-bottom:40px;
    }

    .greenlomake__fields--2col {
        display:flex;
        flex-wrap:wrap;
        justify-content:space-between;
    }

    .greenlomake__fields--2col .greenlomake__field {
        width:48%;
        margin-bottom:10px;
    }

    .greenlomake .greenlomake__input {
        border:inherit;
        height:50px;
        border-radius: 5px;
    }

    .greenlomake__fields--tuotteet .greenlomake__field {
        display: flex;
        flex-direction: row;
        margin-bottom: 40px;
        justify-content: space-between;
    }

    .greenlomake__field--label {
        width: 70%;
    }

    .greenlomake__field--maara {
        width: 25%;
    }

    .greenlomake__field--maara-top {
        display:flex;
        column-gap:20px;
    }

    .greenlomake__field--maara-nro {
        font-size:1.6rem;
        font-weight: 600;
        line-height:1.2;
    }

    .greenlomake__field--maara-kategoria {
        text-transform:uppercase;
        font-size:1.8rem;
        font-weight: 600;
        line-height:1.2;
    }

    .greenlomake__field--maara-bottom {
        font-size: 2.2rem;
        font-weight: 600;
        line-height:1.2;
    }

    .greenlomake__field--maara {
        position:relative;
        display:block;
        max-height:50px;
    }

    .greenlomake .greenlomake__input--maara {
        padding-right:80px;
    }

    .greenlomake__field--maara:after {
        content: 'm²';
        display:block;
        position:absolute;
        color:#666;
        font-size:2.2rem;
        right:25px;
        top:50%;
        margin-top:-20px;
    }

    .greenlomake__fields--submit {
        margin-bottom:40px;
        display:flex;
        justify-content:center;
    }

    .greenlomake__submit {
        background: #235C2E;
        color:#fff;
        border-radius: 40px;
        border:2px solid #235C2E;
        font-size: 1.6rem;
        font-weight: 600;
        text-transform:uppercase;
        padding: 14px 40px;
        margin-top:40px;
    }

    .greenlomake__submit:hover,
    .greenlomake__submit:focus {
        background: inherit;
        border:2px solid #235C2E;
        color:#235C2E;
    }

    .greenlomake__thankyou {
        text-align:center;
        /* margin-bottom:40px; */
    }

    .greenlomake__thankyou p {
        font-size: 1.8rem;
        font-weight: 600;
        line-height:1.2;
    }

    .greenlomake__thankyou a {
        color:#185c33;
        font-size: 1.8rem;
        font-weight: 600;
        line-height:1.2;
        text-decoration:underline;
    }

    .greenlomake__thankyou a:hover,
    .greenlomake__thankyou a:focus {
        text-decoration: none;
    }

    .greenlomake__alaotsikko--tuotetiedot {
        margin-bottom:0px;
    }

    .greenlomake__tuotetiedot_lisatieto {
        font-size: 1.2rem;
        color: #919191;
        font-weight: 600;
        line-height:1.2;
        margin-bottom:0px;
    }

    .greenlomake__fields--tuoteotsikko .greenlomake__field {
        margin-bottom: 0;
    }

    .greenlomake__fields--tuoteotsikko .greenlomake__field--maara {
        margin-bottom:20px;
        font-size:2.2rem;
        font-weight: 600;
    }

    .greenlomake__fields--tuoteotsikko .greenlomake__field--maara::after {
        display: none;
    }