html,body{
    height:auto;
    width: 100%;
}

body{
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.content-box{
    width: auto;
    flex: 1;
    height: auto;
    align-items: center;
    padding: 0 10% 2.5% 10%;
    background-color: #E6E6E6;
    text-align: center;
}

.content-box a{
    color: #E6E6E6;

}

.resource-box{
    height: auto;
}

.file-listing{
    display:flex;
    justify-content: space-between;
    align-items: center;
}

.download-button{
    border: 2px solid;
    border-radius: 8px;
    border-color:#E6E6E6;
    background-color: #0881A3;
    padding: 8px 8px;
    cursor:pointer;
    text-align: center;
    min-width: max-content;
}

@media screen and (max-device-width:500px) {
    html,body{
        height:auto;
        width: 100%;
    }

    body{
        display: flex;
        flex-direction: column;
        min-height: 100vh;
    }

    .content-box{
        max-width: 100%;
        height: auto;
        align-items: center;
        text-align: center;
        font-size:xx-large;
        padding: 1vh 5% 0 5%;
        line-height: 1.2rem;
        flex: 1 0 0;
    }

    h1{
        padding-bottom: 1%;
    }

    .download-button{
        border: 2px solid;
        border-radius: 8px;
        border-color:#E6E6E6;
        background-color: #0881A3;
        padding: 16px 16px;
        cursor:pointer;
        text-align: center;
        min-width: max-content;
    }
}