body {
    font-family: Arial;
    background-color: whitesmoke;
    font-size: 14px;
    height: 100%;
}

#body_all {
    font-size: calc(15px + (40 - 15) * ((100vw - 300px) / (1600 - 300)));
}
#body_count {
    font-size: calc(60px + (200 - 60) * ((100vw - 300px) / (1600 - 300)));
    color: red;
}
#message {
    font-size: calc(20px + (50 - 20) * ((100vw - 300px) / (1600 - 300)));
}
#message_text {
    margin-top: calc(10px + (100 - 10) * ((100vh - 300px) / (1600 - 300)));
    text-align: center;
    margin-bottom: calc(10px + (400 - 10) * ((100vh - 300px) / (1600 - 300)));;
}
#disclaimer {
    margin-top: 0;
    font-size: 10px;
}
#donate {
    font-size: calc(10px + (25 - 10) * ((100vw - 300px) / (1600 - 300)));
    margin-bottom: 0;
}
#coffee {
    font-size: calc(10px + (25 - 10) * ((100vw - 300px) / (1600 - 300)));
}
#links {
    text-align: center
}
#citation {
    margin-bottom: calc(10px + (400 - 10) * ((100vh - 300px) / (1600 - 300)));
    font-style: italic;
}
#all {
    height: 100%;
}

@media only screen
and (min-device-width: 200px)
and (max-device-width: 812px) {
        #body_all {
            font-size: calc(30px + (50 - 30) * ((100vw - 300px) / (1600 - 300)));
        }
        #body_count {
            font-size: calc(40px + (400 - 40) * ((100vw - 300px) / (1600 - 300)));
            color: red;
        }
        #message {
            font-size: calc(20px + (125 - 20) * ((100vw - 300px) / (1600 - 300)));
        }
        #message_text {
            margin-top: calc(10px + (100 - 10) * ((100vh - 300px) / (1600 - 300)));
            text-align: center;
            margin-bottom: calc(10px + (300 - 10) * ((100vh - 300px) / (1600 - 300)));;
        }
        #disclaimer {
            margin-top: 0;
            font-size: 25px;
        }
        #donate {
            font-size: calc(10px + (75 - 10) * ((100vw - 300px) / (1600 - 300)));
            margin-bottom: 0;
        }
        #coffee {
            font-size: calc(10px + (75 - 10) * ((100vw - 300px) / (1600 - 300)));
        }
        #links {
            text-align: center
        }
        #citation {
            margin-bottom: calc(10px + (300 - 10) * ((100vh - 300px) / (1600 - 300)));
            font-style: italic;
            font-size: calc(30px + (40 - 30) * ((100vw - 300px) / (1600 - 300)));
        }
        #all {
            height: 100%;
        }
}