html {
    height: 100%;
    font-size: 1rem;
}
body {
    font-size: 1rem;
    font-family: 'Dosis', sans-serif;
    height: 100%;
    margin: 0px;
    text-align: center;
    
    /*background-image: url("img/CST_wartungsarbeit.jpeg");*/
    background-size: cover;
    background-position: 0%;
}

.logo-container {                           /*Hier wird das Logo eingetragen*/
    padding-top: 40px;
    margin-left: auto;
    margin-right: auto;
    width: 15.5rem;

    
}

.logo {
    width: 100%;
}

.logo-container::after {
    content: "";
    display: block;
    width: 100%;
    height: 8px;
    background-color: #5ec0d2;
    margin-top: 4px;
}

.main-content {                             /* Hier ist der h1 Text sowie den Untertext*/
    text-align: center;
    /*margin-top: 50px;*/
    font-size: 1rem;
}

.main-content h1 {                          /*Hier wird den Unteren bereich vom h1 angepasst*/
    margin-bottom: 0px;
    margin-top: 35px;
}

.main-content p {                       /* Hier wird der untere Text angepasst von der höhe*/
    margin-top: 7px;
}

.button {                               /* Hier wird der Button Programmiert*/
    display: inline-block;
    margin-top: 6px;
    text-decoration: none;                  /*kein Unterstrich*/
    color: #ffffff;                         /*Die Farbe*/
    background-color: #5ec0d2;              /*Hintergrundbild*/
    padding: 0.5rem 4.5rem;                       /*Abstände zwichen oben unten und rechts links*/
    font-weight: bold;                          /*Dicke SChrift*/
    border-radius: 20px;                        /*Radius*/
    margin-bottom: 6px;
}

.button:hover {                                 /*Was passiert wenn man mit der Maus rüber geht*/
    text-decoration: underline;
}

.main-content h3 {                          /*Design & Konzeption Text*/
    margin-top: 20px;
    text-transform: uppercase;
    font-size: 1rem;
    margin-bottom: 3px;
}

.address {                                  /*Persöhnliche Adresse*/
    font-size: 17px;
    font-style: normal;
}

.countdown {                                    
    display: inline-block;
    color: #ffffff;
    text-align: justify;
    text-align-last: justify;
}

.countdown .date {                              /*Das Datum*/
    display: block;
    font-size: 4.5rem;
    margin-bottom: -10px;
    margin-top: 10px;
}

.countdown .date-description {                     /*Datum beschriftung unten*/
    font-size: 1.2rem;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}

@media (min-width: 750px) {
    body {
        background: none;
    }

    .logo-container {
        margin-left: autopx;
        margin-right: autopx;
        width: 15rem;
    }

    .logo-container::after {
        background-color: transparent;
        background: linear-gradient(to right, #5ec0d2, #5ec0d2);
        height: 5px;
    }
    .main-content {
        width: 100%;
        float: center;
        text-align: center;
        
    }

    .countdown-container {
        width: 100%;
        height: 100%;
        float: center;

    }

    .countdown {
        padding: 6rem;
    }
}