@font-face {
                font-family: 'main-font';
                font-style: normal;
                src: url('https://www.fahrschule-hopla.de/wp-content/uploads/fonts/OpenSans-Variable.ttf') format('truetype');
                font-weight: Variable;
                font-display: swap;
            }@font-face {
                font-family: 'sub-font';
                font-style: normal;
                src: url('https://www.fahrschule-hopla.de/wp-content/uploads/fonts/Raleway-Variable.ttf') format('truetype');
                font-weight: Variable;
                font-display: swap;
            }:root {--main-color: #ea580c;--sub-color: #eedad0;--bg-color: #f2ece9;--text-color: #222222;
    --color-w: #fff;
    --color-b: #000;
    --maxwidth: 1200px;
    --width: 86%;
    --spacing: 100px;
    --el-spacing: 30px;
    --header-height: 115px;
    --header-spacing: 20px;
    --font-family: main-font;
    --font-size: 18px;
    --line-height: 1.7em;
    --font-weight: 300;
    --font-color: var(--text-color);
}
@media all and (max-width: 980px) {
	:root {
		--spacing: 75px;
        --header-height: 86.25px;
        --header-spacing: 15px;
	}
}
    h1, .style-h1 {
        font-family: 'sub-font';
        font-size: 65px;
        font-weight: 800;
        color: var(--text-color);
        line-height: 1.2em;
        margin:0 0 10px;
    }
    @media (max-width: 768px) {
        h1, .style-h1 {
            font-size: 36px;
        }
    }

    h2, .style-h2 {
        font-family: 'sub-font';
        font-size: 40px;
        font-weight: 800;
        color: var(--text-color);
        line-height: 1.2em;
        margin:0 0 10px;
    }
    @media (max-width: 768px) {
        h2, .style-h2 {
            font-size: 28px;
        }
    }

    h3, .style-h3 {
        font-family: 'sub-font';
        font-size: 24px;
        font-weight: 600;
        color: var(--text-color);
        line-height: 1.3em;
        margin:0 0 10px;
    }
    @media (max-width: 768px) {
        h3, .style-h3 {
            font-size: 20px;
        }
    }

    h4, .style-h4 {
        font-family: 'main-font';
        font-size: 20px;
        font-weight: 600;
        color: var(--text-color);
        line-height: 1.3em;
        margin:0 0 10px;
    }
    @media (max-width: 768px) {
        h4, .style-h4 {
            font-size: 18px;
        }
    }

    h5, .style-h5 {
        font-family: 'main-font';
        font-size: 18px;
        font-weight: 600;
        color: var(--text-color);
        line-height: 1.4em;
        margin:0 0 10px;
    }
    @media (max-width: 768px) {
        h5, .style-h5 {
            font-size: 16px;
        }
    }

.section > .row {
transition: transform 1s ease, opacity 1s ease !important;
opacity: 0 !important;
transform: translateY(15px) !important;
transition-delay: .25s !important;
}

.section > .row.animated {
opacity: 1 !important;
transform: translateY(0px) !important;
}