body .app-main {
    background-color: #010024;
    color: aliceblue;
    font-family: "Noto Sans Display", "Arial", Tahoma, Verdana, sans-serif;
    font-weight: 200;
    font-size: smaller;
    padding-left:5em;
    padding-right:5em;
}

@media screen and (max-width: 300px) {
    div.app-logo {
        height: auto;
        max-width: 100%;
    }
    h4.app-h4 {
        font-family: "Noto Sans Display", "Arial", Tahoma, Verdana, sans-serif;
        font-weight: 400;
        font-size: 5vw;
        text-align: center;
  }
}

@media screen and (min-width: 300px) and (max-width: 600px) {
    div.app-logo {
        height: auto;
        max-width: 80%;
    }
    h4.app-h4 {
        font-family: "Noto Sans Display", "Arial", Tahoma, Verdana, sans-serif;
        font-weight: 400;
        font-size: 5vw;
        text-align: center;
  }
}

.app-logo {
    height: auto;
    max-width: 30%;
}
.app-h4 {
    font-family: "Noto Sans Display", "Arial", Tahoma, Verdana, sans-serif;
    font-weight: 400;
    font-size:3vw;
    text-align: center;
}
.app-btn {
    min-width: 350px;
    max-width: 450px;
    height: 45px;
    margin-top: 0.3em;
    margin-bottom: 0.3em;
}

.appfooter {
    width: 100%;
    height: 30px;
    background-color: #010024;
    color: red;
    font-family: "Noto Sans Display", "Arial", Tahoma, Verdana, sans-serif;
    font-weight: 200 ;
    font-size: 75%;
}
.noto-sans-javanese-condensed {
    font-family: "Noto Sans Javanese", sans-serif;
    font-optical-sizing: auto;
    font-weight: 100;
    font-style: normal;
}
.app-footer {
    background-color: #010024;
    color: red;
    font-family: "Noto Sans Display", "Arial", Tahoma, Verdana, sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    font-variation-settings:"wdth" 65;
    font-size: 0.8em;
    font-weight: 400;
    padding-bottom: 1em;
}
.app-footer a {
    color: #aaaaaa;
    text-decoration: underline;
}
.app-footer a:hover {
    color: #ff8116;
    text-decoration: underline;
}