/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
    .b {
        color: #CD1619;    
    }
    header {
        background-color: rgb(240, 240, 240);    
    }
    header p {
        font-family: adobe-text-pro, serif;
        font-style: normal;
        font-weight: 400;
        text-align: center;
        color: #424242;
        font-size: 1.5em;
    }
    header nav {
        text-align: center;
        text-decoration: none;
        border-bottom: 0.15em solid #CD1619;
        line-height: 2.2em;
    }
    header nav p {
        font-family: 'Lato', sans-serif;
        font-size: 1em;
        font-weight: 400;
        margin-bottom:0em;
        margin-top:0em;
    }
    header nav a {
        display: block;
        width: 100%;
        text-decoration: none;
        color: #424242;
    }
    header nav a:focus {
        background: #ef1a1e;
        color: white;
    }
    header nav a:hover {
        background: #ef1a1e;
        color: white;
    }
    header nav a:active {
        background: #CD1619;
        color: white;
        font-size: 1.1em
    }
    footer {
        background: #282C32;
        font-family: 'Lato', sans-serif;
        font-weight: 400;
        font-size: 0.8em;
        color: white;
        line-height: 3em; 
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
    }
    footer p {
        float: right;
        margin: 0;
        margin-right: 2em;
        text-align: center;
    }
    footer a {
        text-decoration: underline;
        color: white;    
        margin-left: 2em;
        text-align: center;
    }
    .red {
        color: #CD1619;
    }
    main{
        margin: 1em;
        margin-top: 1.5em;        
        margin-bottom: 8em;
        font-family: 'Lato', sans-serif;
        font-weight: 400;
        font-size: 1em;
        line-height: 1.7
    }
    header,
    footer {
        overflow-x: hidden;
        overflow-y: hidden;
    }
    .nav-on {
        background: #CD1619;
        color: white;
    }
    .noselect {
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
    }
    body {
        color: #424242;
        margin: 0;
    }
    html {
        position: relative;
        min-height: 100%;
    }
    .quelle {
        color: lightgray;
        margin-top: 5em;
    }
    .element{
        text-align: center;
    }
    
    .w3-content{max-width:980px;margin:auto}
    .w3-display-container{position:relative}
    .w3-center{text-align:center!important}
    .w3-container{padding:0.01em 16px}
    .w3-section{margin-top:16px!important;margin-bottom:16px!important}
    .w3-text-white,.w3-hover-text-white:hover{color:#fff!important}
    .w3-display-bottommiddle{position:absolute;left:50%;bottom:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%)}
    .w3-left{float:left!important}.w3-right{float:right!important}
    .w3-left:hover{float:left!important;cursor:pointer}.w3-right:hover{float:right!important;cursor:pointer}
    .w3-badge{background-color:#000;color:#fff;display:inline-block;padding-left:8px;padding-right:8px;text-align:center}.w3-badge{border-radius:50%}
    .w3-large{font-size:2em!important}

} 

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
    .marg{
        margin-bottom:3em;
    }
    .b {
        color: #CD1619;    
    }
    header {
        background-color: rgb(240, 240, 240);    
    }
    header p {
        font-family: adobe-text-pro, serif;
        font-style: normal;
        font-weight: 400;
        text-align: center;
        color: #424242;
        font-size: 2em;
    }
    header nav {
        text-decoration: none;
        border-bottom: 0.15em solid #CD1619;
        line-height: 2.5em;
    }
    header nav p {
        margin-bottom:0em;
        margin-top:0em;
        font-family: 'Lato', sans-serif;
        font-size: 1em;
        font-weight: 400;
    }
    header nav a {
        display: block;
        width: 100%;
        text-decoration: none;
        color: #424242;
    }
    header nav a:focus {
        background: #ef1a1e;
        color: white;
    }
    header nav a:hover {
        background: #ef1a1e;
        color: white;
    }
    header nav a:active {
        background: #CD1619;
        color: white;
    }
    footer {
        background: #282C32;
        font-family: 'Lato', sans-serif;
        font-weight: 400;
        font-size: 0.93em;
        color: white;
        line-height: 3em; 
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
    }
    footer p {
        float: right;
        margin: 0;
        margin-right: 2em;
        text-align: center;
    }
    footer a {
        text-decoration: underline;
        color: white;    
        margin-left: 2em;
        text-align: center;
    }
    .red {
        color: #CD1619;
    }
    .center {
        margin-left: auto;
        margin-right: auto;
    }
    main {
        margin-top: 1em;    
        margin: 1em;
        margin-bottom: 8em;
        font-family: 'Lato', sans-serif;
        font-weight: 400;
        font-size: 1.12em;
        line-height: 1.8;
    }
    header,
    footer {
        overflow-x: hidden;
        overflow-y: hidden;
    }
    .nav-on {
        background: #CD1619;
        color: white;
    }
    .noselect {
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
    }
    body {
        color: #424242;
        line-height: 1.8em;
        margin: 0;
    }
    html {
        position: relative;
        min-height: 100%;
    }
    .quelle {
        color: lightgray;
        margin-top: 5em;
    }
    .mid1 {
        margin-left: 5%;
        margin-right: 5%;
    }
    .element{
        text-align: center;
    }
    
    .w3-content{max-width:980px;margin:auto}
    .w3-display-container{position:relative}
    .w3-center{text-align:center!important}
    .w3-container{padding:0.01em 16px}
    .w3-section{margin-top:16px!important;margin-bottom:16px!important}
    .w3-text-white,.w3-hover-text-white:hover{color:#fff!important}
    .w3-display-bottommiddle{position:absolute;left:50%;bottom:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%)}
    .w3-left{float:left!important}.w3-right{float:right!important}
    .w3-left:hover{float:left!important;cursor:pointer}.w3-right:hover{float:right!important;cursor:pointer}
    .w3-badge{background-color:#000;color:#fff;display:inline-block;padding-left:8px;padding-right:8px;text-align:center}.w3-badge{border-radius:50%}
    .w3-large{font-size:2em!important}
} 

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
    .b {
        color: #CD1619;    
    }
    header {
        background-color: rgb(240, 240, 240);    
    }
    header p {
        font-family: adobe-text-pro, serif;
        font-style: normal;
        font-weight: 400;
        text-align: center;
        color: #424242;
        font-size: 2em;
    }
    header nav {
        text-decoration: none;
        border-bottom: 0.15em solid #CD1619;
        line-height: 2.5em;
    }
    header nav p {
        margin-bottom:0em;
        margin-top:0em;
        font-family: 'Lato', sans-serif;
        font-size: 1em;
        font-weight: 400;
    }
    header nav a {
        display: block;
        width: 100%;
        text-decoration: none;
        color: #424242;
    }
    header nav a:focus {
        background: #ef1a1e;
        color: white;
    }
    header nav a:hover {
        background: #ef1a1e;
        color: white;
    }
    header nav a:active {
        background: #CD1619;
        color: white;
    }
    footer {
        background: #282C32;
        font-family: 'Lato', sans-serif;
        font-weight: 400;
        font-size: 0.93em;
        color: white;
        line-height: 3em; 
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
    }
    footer p {
        float: right;
        margin: 0;
        margin-right: 2em;
        text-align: center;
    }
    footer a {
        text-decoration: underline;
        color: white;    
        margin-left: 2em;
        text-align: center;
    }
    .red {
        color: #CD1619;
    }
    .center {
        margin-left: auto;
        margin-right: auto;
    }
    main {
        margin-top: 1em;    
        margin: 1em;
        margin-bottom: 8em;
        font-family: 'Lato', sans-serif;
        font-weight: 400;
        font-size: 1.12em;
        line-height: 1.8;
    }
    header,
    footer {
        overflow-x: hidden;
        overflow-y: hidden;
    }
    .nav-on {
        background: #CD1619;
        color: white;
    }
    .noselect {
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
    }
    body {
        color: #424242;
        line-height: 1.8em;
        margin: 0;
    }
    html {
        position: relative;
        min-height: 100%;
    }
    .quelle {
        color: lightgray;
        margin-top: 5em;
    }
    .mid1 {
        margin-left: 5%;
        margin-right: 5%;
    }
    .element{
        text-align: center;
    }
    
    .w3-content{max-width:980px;margin:auto}
    .w3-display-container{position:relative}
    .w3-center{text-align:center!important}
    .w3-container{padding:0.01em 16px}
    .w3-section{margin-top:16px!important;margin-bottom:16px!important}
    .w3-text-white,.w3-hover-text-white:hover{color:#fff!important}
    .w3-display-bottommiddle{position:absolute;left:50%;bottom:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%)}
    .w3-left{float:left!important}.w3-right{float:right!important}
    .w3-left:hover{float:left!important;cursor:pointer}.w3-right:hover{float:right!important;cursor:pointer}
    .w3-badge{background-color:#000;color:#fff;display:inline-block;padding-left:8px;padding-right:8px;text-align:center}.w3-badge{border-radius:50%}
    .w3-large{font-size:2em!important}
} 

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
    .b {
        color: #CD1619;    
    }
    header {
        background-color: rgb(240, 240, 240);    
    }
    header p {
        font-family: adobe-text-pro, serif;
        font-style: normal;
        font-weight: 400;
        text-align: center;
        color: #424242;
        font-size: 2em;
    }
    header nav {
        text-decoration: none;
        border-bottom: 0.15em solid #CD1619;
        line-height: 2.5em;
    }
    header nav p {
        margin-bottom:0em;
        margin-top:0em;
        font-family: 'Lato', sans-serif;
        font-size: 1em;
        font-weight: 400;
    }
    header nav a {
        display: block;
        width: 100%;
        text-decoration: none;
        color: #424242;
    }
    header nav a:focus {
        background: #ef1a1e;
        color: white;
    }
    header nav a:hover {
        background: #ef1a1e;
        color: white;
    }
    header nav a:active {
        background: #CD1619;
        color: white;
    }
    footer {
        background: #282C32;
        font-family: 'Lato', sans-serif;
        font-weight: 400;
        font-size: 0.93em;
        color: white;
        line-height: 3em; 
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
    }
    footer p {
        float: right;
        margin: 0;
        margin-right: 2em;
        text-align: center;
    }
    footer a {
        text-decoration: underline;
        color: white;    
        margin-left: 2em;
        text-align: center;
    }
    .red {
        color: #CD1619;
    }
    .center {
        margin-left: auto;
        margin-right: auto;
    }
    main {
        margin-top: 1em;    
        margin: 1em;
        margin-bottom: 8em;
        font-family: 'Lato', sans-serif;
        font-weight: 400;
        font-size: 1.12em;
        line-height: 1.8;
    }
    header,
    footer {
        overflow-x: hidden;
        overflow-y: hidden;
    }
    .nav-on {
        background: #CD1619;
        color: white;
    }
    .noselect {
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
    }
    body {
        color: #424242;
        line-height: 1.8em;
        margin: 0;
    }
    html {
        position: relative;
        min-height: 100%;
    }
    .quelle {
        color: lightgray;
        margin-top: 5em;
    }
    .mid1 {
        margin-left: 10%;
        margin-right: 10%;
    }
    .element{
        text-align: center;
    }
    
    .w3-content{max-width:980px;margin:auto}
    .w3-display-container{position:relative}
    .w3-center{text-align:center!important}
    .w3-container{padding:0.01em 16px}
    .w3-section{margin-top:16px!important;margin-bottom:16px!important}
    .w3-text-white,.w3-hover-text-white:hover{color:#fff!important}
    .w3-display-bottommiddle{position:absolute;left:50%;bottom:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%)}
    .w3-left{float:left!important}.w3-right{float:right!important}
    .w3-left:hover{float:left!important;cursor:pointer}.w3-right:hover{float:right!important;cursor:pointer}
    .w3-badge{background-color:#000;color:#fff;display:inline-block;padding-left:8px;padding-right:8px;text-align:center}.w3-badge{border-radius:50%}
    .w3-large{font-size:2em!important}
} 

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
    .b {
        color: #CD1619;    
    }
    header {
        background-color: rgb(240, 240, 240);    
    }
    header p {
        font-family: adobe-text-pro, serif;
        font-style: normal;
        font-weight: 400;
        text-align: center;
        color: #424242;
        font-size: 2em;
    }
    header nav {
        text-decoration: none;
        border-bottom: 0.15em solid #CD1619;
        line-height: 2.5em;
    }
    header nav p {
        margin-bottom:0em;
        margin-top:0em;
        font-family: 'Lato', sans-serif;
        font-size: 1em;
        font-weight: 400;
    }
    header nav a {
        display: block;
        width: 100%;
        text-decoration: none;
        color: #424242;
    }
    header nav a:focus {
        background: #ef1a1e;
        color: white;
    }
    header nav a:hover {
        background: #ef1a1e;
        color: white;
    }
    header nav a:active {
        background: #CD1619;
        color: white;
    }
    footer {
        background: #282C32;
        font-family: 'Lato', sans-serif;
        font-weight: 400;
        font-size: 0.93em;
        color: white;
        line-height: 3em; 
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
    }
    footer p {
        float: right;
        margin: 0;
        margin-right: 2em;
        text-align: center;
    }
    footer a {
        text-decoration: underline;
        color: white;    
        margin-left: 2em;
        text-align: center;
    }
    .red {
        color: #CD1619;
    }
    .center {
        margin-left: auto;
        margin-right: auto;
    }
    main {
        margin-top: 1em;    
        margin: 1em;
        margin-bottom: 8em;
        font-family: 'Lato', sans-serif;
        font-weight: 400;
        font-size: 1.12em;
        line-height: 1.8;
    }
    header,
    footer {
        overflow-x: hidden;
        overflow-y: hidden;
    }
    .nav-on {
        background: #CD1619;
        color: white;
    }
    .noselect {
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
    }
    body {
        color: #424242;
        line-height: 1.8em;
        margin: 0;
    }
    html {
        position: relative;
        min-height: 100%;
    }
    .quelle {
        color: lightgray;
        margin-top: 5em;
    }
    .mid1 {
        margin-left: 26%;
        margin-right: 26%;
    }
    .element{
        text-align: center;
    }
    
    .w3-content{max-width:980px;margin:auto}
    .w3-display-container{position:relative}
    .w3-center{text-align:center!important}
    .w3-container{padding:0.01em 16px}
    .w3-section{margin-top:16px!important;margin-bottom:16px!important}
    .w3-text-white,.w3-hover-text-white:hover{color:#fff!important}
    .w3-display-bottommiddle{position:absolute;left:50%;bottom:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%)}
    .w3-left{float:left!important}.w3-right{float:right!important}
    .w3-left:hover{float:left!important;cursor:pointer}.w3-right:hover{float:right!important;cursor:pointer}
    .w3-badge{background-color:#000;color:#fff;display:inline-block;padding-left:8px;padding-right:8px;text-align:center}.w3-badge{border-radius:50%}
    .w3-large{font-size:2em!important}
}