/** globale Definitionen **/
:root {
    --fontFamily: "Roboto", Arial, Verdana, Helvetica, sans-serif;

    --colorRed: #c9152e;
    --colorWhite: #fff;

    --textColor: #000;
    --borderColor: #cecece;

    --bulletColor: var(--textColor);

    --aColor: var(--colorRed);

    --btnBackColor: var(--colorRed);
    --btnBackHoverColor: #00f;
    --btnTextColor: #fff;
    --btnTextHoverColor: #fff;

    --fontSize: 16px;
    --lineHeight: 24px;

    --h1Size: 34px;
	--h1LineHeight: 41.5px;
    --h1Color: var(--textColor);
    --h1BackColor: transparent;

    --h2Size: 24px;
	--h2LineHeight: 30px;
    --h2Color: var(--textColor);
    --h2BackColor: transparent;

    --h3Size: 16px;
	--h3LineHeight: 40px;
    --h3Color: var(--textColor);
    --h3BackColor: transparent;
}

/** Schriften **/
@font-face {
	font-family: "Roboto";
	src: url("../fonts/roboto-v18-latin-ext-300.woff2") format("woff2");
	font-weight: 300;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: "Roboto";
	src: url("../fonts/roboto-v18-latin-ext-500.woff2") format("woff2");
	font-weight: 500;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: "Roboto";
	src: url("../fonts/roboto-v18-latin-ext-500.woff2") format("woff2");
	font-weight: 700;
	font-style: bold;
	font-display: swap
}

@font-face {
	font-family: "RobotoReg";
	src: url("../fonts/roboto-v18-latin-ext-regular.woff2") format("woff2");
	font-weight: 300;
	font-style: bold;
	font-display: swap
}

@font-face {
	font-family: "RobotoCondensed";
	src: url("../fonts/roboto-condensed-v16-latin-ext-regular.woff2") format("woff2");
	font-weight: 300;
	font-style: bold;
	font-display: swap
}

@font-face {
	font-family: "Nolisicon";
	src: url("../fonts/nolisicon.woff2") format("woff2");
	font-weight: 300;
	font-style: bold;
	font-display: swap
}

/** Reset **/
* {
    margin: 0;
    padding: 0;
    position: relative;
    box-sizing: border-box;
}

html,
body {
    background-color: #fff;
}

p {
    padding: 5px 0;
}

ul,
ol {
    padding: 5px 0 5px 25px;
}

/** Standards **/
h2:empty,
h3.empty,
h4.empty,
h5.empty,
h6.empty,
div:empty,
p:empty,
ul.empty,
ol.empty,
section:empty {
    display: none;
}

a[href^="tel:"] {
    white-space: nowrap;
}
a {
    color: var(--aColor);
    text-decoration: none;
}
a:hover {
    color: var(--aHoverColor);
}

ul li::marker {
    color: var(--bulletColor);
}

body {
    color: var(--textColor);
}

h1 {
    color: var(--h1Color);
    background-color: var(--h1BackColor);
    font-size: var(--h1Size);
	line-height: var(--h1LineHeight);
    padding-top: 35px;
    padding-bottom: 18px;
}
h2 {
    color: var(--h2Color);
    background-color: var(--h2BackColor);
    font-size: var(--h2Size);
	line-height: var(--h2LineHeight);
    padding-top: 35px;
    padding-bottom: 18px;
}
h3 {
    color: var(--h3Color);
    background-color: var(--h3BackColor);
    font-size: var(--h3Size);
	line-height: var(--h3LineHeight);
}

.btn {
    background-color: var(--colorRed);
    color: var(--colorWhite);
    padding: 12px;
}

.btn:hover,
.btn:focus {
    color: var(--colorWhite);
    text-decoration: none;
    background-image: linear-gradient(transparent, rgba(0, 0, 0, .5) 40%, rgba(0, 0, 0, .1));
}

.noWrap {
    white-space: nowrap;
}

.noMg {
    margin-bottom: 0;
    padding-bottom: 0;
}

strong {
    font-weight: 500;
}

#wrapper {
    margin: auto;
    max-width: 900px;
    font-family: var(--fontFamily);
    line-height: var(--lineHeight);
    font-weight: 300;
    border: 1px solid var(--borderColor);
    /*background-image: url(../img/Stadt_Langenhagen-RGB-900px_Stand.png);*/
}
/*
header #logos {
    position: relative;
    min-height: 150px;
    float: right;
    padding: 60px;
    padding-bottom: 40px;
}
*/
header #logos {
    min-height: 200px;
    padding: 60px;
    padding-top: 80px;
}
header img {
    max-width: 100%;
}

header #logos img {
    position: relative;
    float: right;
    margin-top: -20px;
    width: 357.5px;
}

header #imgHeader {
    width: 100%;
}

main {
    padding: 5%;
    padding: 60px;
}

section {
    padding-bottom: 14px;
}

section div p:first-child {
    padding-top: 0;
    margin-top: -7px;
}

ul ul {
    list-style-type: disc;
}

#title {
    padding-bottom: 0;
}

#appSection {
    width: 100%;
    height: 80px;
}

#application .btn {
    display: block;
    position: absolute;
    right: 0;
    width: 146px;
    text-align: center;
    margin-top: 24px;
    margin-bottom: 24px;
}

@media screen and (max-width: 600px) {
    header #logos {
        min-height: 100px;
        padding: 60px;
        padding-bottom: 70px;
        padding-right: 30px;
    }

    header #logos img {
        width: 250px;
    }

    main {
        padding: 25px;
    }
}

@media screen and (max-width: 400px) {
    header #logos {
        padding: 40px;
        padding-top: 50px;
        padding-bottom: 50px;
        padding-right: 25px;
    }

    header #logos img {
        width: 200px;
    }
}