:root{
    --bg: #fafafa;
    --pr: #ffffff;
    --ac: #1e73be;
    --ac2: #dfdfdf;
    --txt: #5c6066;
	--bl: #000000;

    --shadow: 0 8px 16px rgba(0,0,0,.08);
    --radius: 18px;
    --site-padding: 0 1em;
    --section-padding: 3em 1em;
    --card-padding: 1em;
}


@font-face {
    font-family: 'main';
    src: url(../fonts/main.ttf);
}

@font-face {
    font-family: 'heading';
    src: url(../fonts/Anton-Regular.ttf);
}


*{
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: "main", sans-serif;
	text-decoration: none;
}
html,
body {
    margin: 0;
    padding: 0;
	scroll-behavior: smooth;
	scroll-padding-top: 120px;
}
body{
    background-color: var(--bg);
}
main{
	position: relative;
	min-width: 100%;
	height: max-content;
	background-color: var(--bg);
	z-index: 3;
}



h1,
h2,
h3{
    font-size: 3rem;
    font-family: "heading", sans-serif;
    letter-spacing: .5px;
    color: var(--ac);
    position: relative;
    margin: 20px 0;
    width: max-content;
}
h2::after{
    content: "";
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    aspect-ratio: 469/41;
    background-image: url(../img/underline.svg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
h3{
    width: 100%;
    text-align: start;
    font-size: 2.5rem;
}
h4{
    font-size: 1.5rem;
    color: var(--ac);
}
p{
    font-size: 1.1rem;
    color: var(--txt);
    line-height: 2;
}

@media(max-width: 700px){
    h2,
    h3{
        font-size: 2rem;
    }
}
@media(max-width: 500px){
    h3{
        font-size: 1.7rem;
    }
}

.btn{
    height: max-content;
    width: max-content;
    border: solid 2px var(--ac);
    background-color: var(--ac);
    padding: 15px 25px;
    border-radius: 50vh;
    transition: all .3s;
    color: var(--pr);
    cursor: pointer;
    font-weight: 600;
    font-size: .85rem;
	letter-spacing: 1px;
}
.btn:hover{
    background: transparent;
    transform: translateY(-2px);
    box-shadow: var(--shadow);
    color: var(--ac);
}


.mw{
    width: 100%;
    max-width: 1200px;
}
section{
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: max-content;
    position: relative;
}
.holder{
    width: 100%;
    display: flex;
    justify-content: center;
}

@media(max-width: 500px){
    p{
        line-height: 1.7;
    }
}



.reveal{
    opacity: 0;
    transform: translateY(50px);
    transition: all .6s ease;
}

.reveal.revealed{
    opacity: 1 !important;
    transform: translateY(0) scale(1) !important;
}

.dienstleistung.reveal{
    transform: translateY(50px) scale(0);
}
.widget.reveal,
.neuigkeit.reveal,
.left.reveal,
.right.reveal{
    opacity: 0;
    transform: translateY(0) scale(.8);
}

.impressum-wrapper{
	display: flex;
	justify-content: center;
	margin-top: 80px;
    padding: 50px 20px;
}

.Impressum{
    display: flex;
    flex-direction: column;
    align-items: center;
}

.Impressum h1 {
    font-family: Arial, Helvetica, sans-serif;
}





@media screen and (max-width: 175px) {
    .Impressum {
        margin-left: 0 !important;

    }

}

.datenschutzerklaerung-wrapper .txt-holder p{
    font-size: 1.3rem;
    line-height: 1.7;
    color: var(--txt-l);
}

.datenschutzerklaerung-wrapper .txt-holder-d p{
    color: var(--txt-d);
}
.datenschutzerklaerung-wrapper .txt-holder span{
    font-size: 2rem;
    font-weight: 700;
    color: var(--txt-l);
}

.datenschutzerklaerung-wrapper {
    margin-top: 80px;
    padding: 50px 20px;
    min-height: 100vh;
    box-sizing: border-box;
	overflow-x: hidden;
	display: flex !important;
	justify-content: center;
}

.datenschutzerklaerung-wrapper h2, .Impressum h2 {
	margin-bottom: 4rem;
	align-self: center;
}

.datenschutz-txt {
	display: flex;
	flex-direction: column;
}

@media screen and (max-width: 800px) {
	.datenschutzerklaerung-wrapper, .impressum-wrapper {
		margin-top: 50px;
	}

}