@import url('https://fonts.googleapis.com/css?family=Abel');
body {
    margin: 0;
}

canvas {
    width: 100%;
    height: 100%;
}

#overlay {
    margin: 4vh 4vw 4vh 4vw;
    padding: 0;
    position: absolute;
    width: 92dvw;
    height: 92dvh;
    z-index: 2;
}

#overlay h1 {
    color: #ffffff;
    font-family: 'Abel', sans-serif;
    font-size: 2.0em;
    line-height: 0.2em;
    font-weight: normal;
    vertical-align: 1em;
}

#homelink {
    vertical-align: text-top;
    line-height: 1em;
}

#descDiv {
    position: absolute;
    bottom: 0;
}

#overlay h2 {
    color: #ffffff;
    font-family: 'Abel', sans-serif;
    /*font-family: sans-serif;*/
    font-size: 1.4em;
    line-height: 0em;
    font-weight: normal;
}

#overlay p {
    color: #ffffff;
    /*font-family: 'Abel', sans-serif;*/
    font-family: sans-serif;
    font-size: 0.8em;
    font-weight: lighter;
    line-height: 2.0em;
}

#overlay p a {
    color: #ffffff;
}

#overlay p a:visited {
    color: #ffffff;
}

@media only screen and (min-width: 46em) {
    #overlay h1 {
        font-size: 2.4em;
        font-weight: normal;
        /*line-height: 2em;*/
    }
    #overlay h2 {
        font-size: 1.6em;
        font-weight: normal;
        /*line-height: 1.6em;*/
    }
    #overlay p {
        font-size: 1.0em;
        font-weight: lighter;
        line-height: 2.0em;
    }
}

@media only screen and (min-width: 64em) {
    #overlay h1 {
        font-size: 2.4em;
        font-weight: normal;
        /*line-height: 2em;*/
    }
    #overlay h2 {
        font-size: 1.6em;
        font-weight: normal;
/*        line-height: 1.6em;
*/    }
    #overlay p {
        font-size: 1.0em;
        font-weight: lighter;
        /*line-height: 2.0em;*/
    }
}
