:root {
    --primary-color-2: #34363c;
}

* {
    /* color: #34363c; */
}

body {
    background: #303030;
    color: #34363c;
    font-family: 'Roboto Slab';
    font-family: Roboto, Arial, sans-serif;
    font-weight: 300;
    font-size: 18px;
    line-height: 25px;
}

.container {
    background: white;
    padding: 30px;
    box-sizing: border-box;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Roboto Slab', Arial, sans-serif;
}

h1 {
    font-weight: 400;
    font-size: 20px;
    margin-top: 5px;
    line-height: 20px;
    font-family: 'Roboto Slab', Arial, sans-serif;
    margin-bottom: 20px;
}
h1 strong {
    font-weight: inherit;
}
@media (min-width: 450px) {
    h1 {
        font-size: 30px;
        line-height: 25px;
    }
}

.bkkvp-datenschutz {
    font-weight: 400;
    font-size: 18px;
    margin-top: 15px;
    margin-bottom: 15px;
    font-family: 'Roboto Slab', Arial, sans-serif;
}

.button.button-color-2 {
    color: white;
}

label,
legend {
    font-size: 16px;
    font-weight: 700;
}

ul {
    font-size: .9em;
}

input,
select {
    border: 1px solid #ccc;
}

button,
.button {
    color: var(--primary-color-2);
    background: white;
    border: 1px solid var(--primary-color-2);
    font-size: 14px;
    font-weight: bold;
}
button:hover,
.button:hover {
    color: white;
}

/* ------------- HEADER ------------- */
.container.header {
    background: white;
    border-bottom: 1px solid #e5e5e5;
    text-align: right;
    padding-top: 10px;
}
.container.header .logo {
    max-width: 100%;
    width: 350px;
}


/* ------------- MAIN ------------- */

.container.main {
    background: white;
}
@media (min-width: 900px) {
    .container.main {
        padding: 45px;
    }
}

.login-form-before p {
    max-width: 625px;

}

.login-form-after {
    font-size: 16px;
    padding-top: 19px;
}
.login-form-after .contact-data {
    margin-top: 35px;
}



.login-form {
    max-width: 400px;
}
.login-form input,
.login-form button {
    box-sizing: border-box;
    width: 100%;
}
.login-form .mb:nth-child(3) {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: .5em;
}
.login-form .mb:nth-child(3) > *:first-child {
    grid-column: span 3;
}



.privacy {
    font-size: 16px;
}

.image-selector {
    margin-top: -30px;
    margin-bottom: -30px;
}

.image-selector-cta {
    font-size: 16px;
}
/* ------------- FOOTER ------------- */

.footer {
    text-align: right;
    padding: 20px 30px;
    margin-bottom: 15px;
}
.footer * {
    color: white;
    font-size: 13px;
}
.footer > .container {
    padding: 0;
    background: none;
}
.footer a {
    color: white;
    font-weight: bold;
    text-decoration: none;
}
.footer a:hover {
    text-decoration: underline;
    color: white;
}