body,html,*{
    
    font-size: 16px;font-family: 'Poppins';font-weight: 400;color: #fff;
    
    @font-face {
    font-family: 'Poppins';
    src: url('Poppins-Regular.woff2') format('woff2'),
        url('Poppins-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-Bold.woff2') format('woff2'),
        url('Poppins-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-Light.woff2') format('woff2'),
        url('Poppins-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-Medium.woff2') format('woff2'),
        url('Poppins-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
}
body{margin: 0;}
body #startseite{background: url('Bilder/background_halberstadt.jpg');position:relative;height:100vh;background-size:cover;background-position:center;}
body #startseite::before{background-color: rgba(0, 0, 0, 0.4);position: absolute;left: 0;bottom: 0;top: 0;right: 0;content: ''}

#startseite .container{max-width: 1000px;display: flex;justify-content: center;}

#startseite .kontakt{width: 250px;position: relative;margin-top: 210px;height: 435px;}
#startseite .kontakt p{text-align: center; position: relative;margin-top: -50px;}

footer a{position: relative;z-index: 2000;}
footer{justify-content: flex-end;display: flex;padding-right: 50px;position: fixed;bottom: 50px;left: 0;right: 0;}

h1{font-weight: bold; text-transform: uppercase;font-size: xx-large;position: relative;}

h2{font-weight: 500;font-size: x-large;}

p{font-weight: 300;}

span{font-weight: 300;}

a{font-weight: 300;text-decoration: none;}
a:hover{color: #464d9b;transition: all .3s ease;}

.container{max-width: 1200px;display: block;margin: 0 auto;}

.flx_hintergrund img{max-height: 100vh;width: 100%;}
.flx_hintergrund{max-height: 20vh;}

.flx_inhalt{z-index: 1000;position: relative;width: 600px;margin-left: 100px;margin-top: 270px;}

.flx_logo{position: relative;z-index: 1000;}
.flx_logo img{width: 100%;}

.flx_impressum{color: #333!important;margin-left: 40px;}
.flx_impressum p{color: #333!important;text-align: left!important;}
.flx_impressum a{color: #333!important;text-align: left!important;}
.flx_impressum h1{color: #333!important;text-align: left!important;}
.flx_impressum h2{color: #333!important;text-align: left!important;}
.flx_impressum span{color: #333!important;text-align: left!important;}

.flx_datenschutz{color: #333!important;margin-left: 40px;}
.flx_datenschutz p{color: #333!important;text-align: left!important;}
.flx_datenschutz a{color: #333!important;text-align: left!important;}
.flx_datenschutz h1{color: #333!important;text-align: left!important;}
.flx_datenschutz h2{color: #333!important;text-align: left!important;}

.btn{position: fixed;bottom: 50px;right: 70px;background: #464d9b;color: #fff;padding: 5px 15px;transition: all .3s ease;}
.btn:hover{background: #444;color: #fff;transition: all .3s ease;}


/*-------------------------------------------------------------------------------------------*/
@media (max-width:1780px){
    
.container{max-width: 1000px;display: block;margin: 0 auto;}
    
}


/*-------------------------------------------------------------------------------------------*/
@media (max-width:1480px){
 
#startseite .container{max-width: 900px;}
.container{max-width: 800px;display: block;margin: 0 auto;}
    .flx_inhalt{margin-left: 40px;} 
    
}


/*-------------------------------------------------------------------------------------------*/
@media (max-width:1199px){
    
#startseite .container{max-width: 750px;}
#startseite .kontakt{width: 440px;}
.container{max-width: 600px;display: block;margin: 0 auto;}
.flx_impressum{margin-left: 0px;}
.flx_datenschutz{margin-left: 0px;}
    
}


/*-------------------------------------------------------------------------------------------*/
@media (max-width:991px){

#startseite .container{max-width: 650px;}
    #startseite .kontakt{width: 420px;}
h1{font-weight: bold;font-size: x-large;}
h2{font-weight: 500;font-size: large;}
p{font-weight: 300;font-size: 14px;}
span{font-weight: 300;font-size: 14px;}
a{font-weight: 300;font-size: 14px;}
    
}


/*-------------------------------------------------------------------------------------------*/
@media (max-width:767px){
    
#startseite .container{max-width: 500px;}
#startseite .kontakt{margin-top: 300px;}
.container{max-width: 500px;}
.btn{bottom: 30px;right: 50px;}
    
}


/*-------------------------------------------------------------------------------------------*/
@media (max-width:600px){
    
#startseite .container{max-width: 375px;}
#startseite .kontakt{margin-top: 250px;width: 480px;}
#startseite .kontakt p{margin-top: -20px;}
footer{bottom: 30px;padding-right: 30px;}
.container{max-width: 350px;}
.flx_inhalt{margin-top: 171px;}
    
}


/*-------------------------------------------------------------------------------------------*/
@media (max-width:420px){
    
#startseite .container{max-width: 300px;}
#startseite .kontakt{margin-top: 225px;width: 580px;}
.container{max-width: 300px;}
.btn{bottom: 20px;right: 30px;}
h1{font-size: large;}
h2{font-size: medium;}
p{font-size: 12px;}
span{font-size: 12px;}
a{font-size: 12px;}
    
}
