html

p, a {font-family: 'Nunito Sans', sans-serif; font-weight: 500; font-size: 18px}
h1, h2, h3, h4 {font-family: 'Poppins', sans-serif;}
h1 {font-weight: 800 !important;}
h2 {font-weight: 700 !important; font-size: 40px !important;}
h3 {font-weight: 800 !important; margin-bottom: 15px !important;}
h4 {font-weight: 700 !important; font-size: 18px;}

/* body -------------------------------- */
body {
    background-color: white;
    color: black;
}

.cookiehead {
    background-color: rgb(33,37,41);
    color: white;
}

/* Navigation -------------------------- */
.navbar {
    border-bottom: 1px solid green;
    padding: 16px;
}
/* Ganzer Titel farblich und fett */
.navbar-brand {
    color: white;
    font-weight: 700;
}

/* Titel getrennt: "Lööööpt" farbliche Änderung */
.loeppt {
    color: limegreen;
}
/* Ausdruck und farbliche Markierung der Navigation beim rüberfliegen */
/*.nav-link:active,
.nav-link:hover {
    color: rgb(251, 107, 24);
} funkt nicht mehr, wohl weil bootstrap css höher gestellt */
#franz:active,
#franz:hover {
    color: rgb(251, 107, 24);
}

.icon-link:active,
.icon-link:hover i,
.icon-link:hover img {
    color: rgb(251, 107, 24);
}
/* SVW Logo in Navbar */
.icons {
    width: 20px;
    height: 25px;
    align-items: baseline;
}

/* Bildergalerie mit Einheitsformation und farblicher Abschlusslinie */
.slider-image {
    width: 100vw;
    height: 70vh;
    background-position: center;
    background-size: cover;
    border-bottom: 1px solid green;
}
/* Video containern */
.embed-responsive {
	position: relative;
	padding-bottom: 56%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}

.embed-responsive iframe  {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* Über mich - Danksagung */
#about-image {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background-position: center;
    background-size: cover;

}

.footer, .footer a, .footer p {
    text-align: center;
    font-size: 16px;
    margin-bottom: 0px;
}

.footer {
    border-top: 1px solid limegreen;
    padding-top: 20px;
    background-color: rgb(240, 240, 240);
    padding-bottom: 20px;
}

.footer p {
    color: black;
}

#hauptteil, 
#about,
.thanksto {
    padding-top: 20px;
}

.container {
    margin-top: 5px;
}

#ausgabe {
    text-align: left;
    border: 2px solid;
    border-color: limegreen;
    padding: 20px;
}

.box,
.box:active {
    border-color: limegreen !important;
    border: 2px solid;
    padding: 5px;
}

.input:focus {
    border: none !important;
}

input[type='radio']:checked {
    background: limegreen !important;
}

.submitbox {
    margin-top: 25px;
    background-color: limegreen;
    border: none;
    padding: 7.5px 30px;
    color: white;
    font-weight: 600;
    background-color: limegreen;
    background-image: linear-gradient(white, white);
    background-repeat: no-repeat;
    background-size: 0% 100%;
    background-position-x: right;
    transition: background-size 500ms;
    border: 3px solid;
    border-color: limegreen;
}
.submitbox:hover {
    color: limegreen;
    background-size: 100% 100%;
    background-position-x: left;
}

.bottom-link {
    text-decoration: none;
    color: limegreen;
}

.bottom-link:hover {
    color: rgb(251, 107, 24);
}