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

article#contact {
    min-height: 100vh;
    /*padding: 5vw 20px 20px;*/
    padding-bottom: 20px;
    background-color: rgba(0, 0, 0, 0.75);
    color: white;
}

article#contact section#info-auswahl {
    display: grid;
    grid-template-rows: min-content;
    grid-auto-rows: min-content;
    grid-template-areas:
            "facebook"
            "copyright";
}
article#contact section#info-texte {
    display: grid;
    grid-template-rows: min-content;
    grid-auto-rows: min-content;
    grid-template-areas:
            "kontakt"
            "copyright"
            /*"header"*/
            /*"texte"*/;
}

article#contact section#info-auswahl .facebook {
    grid-area: facebook;
    text-align: left;
    margin: 10px;
}
article#contact section#info-texte p.copyright {
    grid-area: copyright;
    margin: 10px;
}
/*
article#kontakt-abschnitt section#info-texte {
    flex-direction: column;
}
*/
article#contact section#info-texte p.kontakt {
    grid-area: kontakt;
    text-align: left;
    margin: 10px;
}

nav#info-leiste {
    grid-area: header;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: baseline;
    margin: 0;
    padding: 0;
}

ul#info-liste {
    display: flex;
    list-style: none;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: baseline;
    /*text-align: right;*/
    margin: 0;
    padding: 0;
}
/*
li.info-eintrag{
    display: inline;
}
*/
li.info-eintrag  a.info-text-titel{
    /*display: block;*/
    color: rgba(255, 255, 255, 0.7);
    padding: 13px 2mm 13px;
    margin: 0;
    text-decoration: none;
    font-size: 18px;
}
li.info-eintrag  a.info-text-titel:hover{
    color: white;

}
/*
div.info-text {
    grid-area: texte;
    display: none;
    max-width: 100%;
    height: 200px;
    padding: 10px;
    margin: 20px 0;
    font-size: .75em;
    font-family: "Times New Roman", sans-serif;
    color: black;
    background-color: white;
    border: 1px solid #fff;
    overflow-y: scroll;
    overflow-x: hidden;
}

div.info-text p {
    margin: 0;
}
*/

div.info-text {
    font-size: .75em;
    font-family: "Times New Roman", sans-serif;
}
div.info-text p {
    margin: 0;
}

div.info-text p a{
    text-decoration: underline;
}
div.info-text p a:link{
    color: #0000EE;
}
div.info-text p a:visited{
    color: #551A8B;
}

/* M (Laptops und kleine Desktops) */
@media (min-width: 50.01em) {

    article#contact section#info-auswahl {
        grid-template-columns: 1fr 1fr;
        grid-auto-rows: max-content;
        grid-template-areas:
                "facebook copyright";
    }
    article#contact section#info-texte {
        grid-template-columns: 1fr 1fr;
        grid-auto-rows: max-content;
        grid-template-areas:
                "kontakt copyright"
                /*"kontakt header"*/
                /*"texte texte"*/;
    }
    article#contact section#info-texte p.copyright {
        text-align: right;
    }
    nav#info-leiste {
        justify-content: flex-end;
    }
    /*
    div.info-text {
        padding: 20px;
        margin: 20px;
    }
    */
}


form { max-width:420px; margin:50px auto; }

.feedback-input {
    color:white;
    font-family: Helvetica, Arial, sans-serif;
    font-weight:500;
    font-size: 18px;
    border-radius: 5px;
    line-height: 22px;
    background-color: transparent;
    /*border:2px solid #CC6666;*/
    border:2px solid #9b9b9b;
    transition: all 0.3s;
    padding: 13px;
    margin-bottom: 15px;
    width:100%;
    box-sizing: border-box;
    outline:0;
}

.feedback-input:focus {
    /*border:2px solid #CC4949;*/
    border:2px solid #696969;
}

textarea {
    height: 150px;
    line-height: 150%;
    resize:vertical;
}

[type="submit"] {
    font-family: 'Montserrat', Arial, Helvetica, sans-serif;
    width: 100%;
    /*background:#CC6666;*/
    background: #9b9b9b;
    border-radius:5px;
    border:0;
    cursor:pointer;
    color:white;
    font-size:24px;
    padding-top:10px;
    padding-bottom:10px;
    transition: all 0.3s;
    margin-top:-4px;
    font-weight:700;
}
[type="submit"]:hover {
    /*background:#CC4949;*/
    background: #696969;
}