@import url('https://fonts.googleapis.com/css2?family=Lato&display=swap');

body, html{
    height: 100%;
    margin: 0;
    font-family: "Lato", sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.8em;
    color: #0D0D0D;
}

.pimg1, .pimg2, .pimg3, .pimg4{
    position: relative;
    opacity: 1.0;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    /*
        fixed = parallax
        scroll = normal
     */
    background-attachment: fixed;
}

.pimg1{
    background-image: url("../img/lineDance.jpg");
    min-height: 100%;
}

.pimg2{
    background-image: url("../img/stadt.jpg");
    min-height: 400px;
}

.pimg3{
    background-image: url("../img/oszi.jpg");
    min-height: 400px;
}

.pimg4{
    background-image: url("../img/quitschi.jpg");
    min-height: 100%;
}

.section{
    text-align: center; /* Text Ausrichtung center center/left/right */
    padding: 10px 80px; /* Block Section 10px top+bottom 80px right+left padding-bottom: 10px, padding-top: 10px*/
}

.section-light{
    background-color:#ddd;
    color: #0D0D0D;
}

.section-dark{
    background-color: #0D0D0D;
    color: #ddd;
}

.ptext{
    position: absolute; /* Ausrichtung am body Container, da kein relative vorhanden */
    top: 50%;
    width: 100%;
    text-align: center;
    font-size:  27px;
    letter-spacing: 8px;
    text-transform: uppercase;
}

.ptext .border a {
    background-color: #0D0D0D;  /* Same as .ptext .border */
    color: #ddd;             /* Same as .ptext .border */
    padding: 20px;           /* Same as .ptext .border */
    text-decoration: none;   /* To remove the default underline of links */
    display: inline-block;   /* To allow padding to affect the anchor */
}


.ptext .border{
    background-color:#0D0D0D;
    color: #ddd;
    padding: 20px; /* Innenabstand,  space between content and boarder */
    /* margin: 1000px; /* Aussenabstand,  space between boarder and next neighboard, in diesem Bsp nicht notwendig*/
    /* border: 10px solid aqua; /* Rahmen  durchgängig Farbe aqua*/
}

.ptext .border.trans{
    background-color: transparent; /* gilt nur wenn class="border trans" */
}

/* under 568px then */
@media(max-width: 568px){
    .pimg1, .pimg2, .pimg3, .pimg4{
        background-attachment: scroll;
    }
}