html {
    font-size: 125%;
}
#main {
    max-width: 60.0em;
    min-height: 90vh;
}
li {
    line-height: 2.0em;
}
.col1 {
    text-align: center;
    background-color: #6e6ec6;
    padding: 0.5em;
}
.col2 {
    width:25%;
    background-color: #eeeeee;
    padding:0px;
}
.htxt1 {
    font-weight: bold;
}
.htxt1, .htxt2 {
    color: #ffffc8;
}
@media screen and (max-width: 60.0em) {
    .htxt1 {
        font-size: 2.0em;
    }
    .htxt2 {
        font-size: 1.0em;
    }
}
@media screen and (min-width: 60.01em) {
    .htxt1 {
        font-size: 3.6em;
    }
    .htxt2 {
        font-size: 1.8em;
    }
}

.link-block {
    border: solid 2px #ccc;
    overflow: hidden;
    padding: 0.3em;
    margin-top: 0.2em;
}
a.main-link {
    float: left;
    display: block;
    width: 6.0em;
    height: 8.0em;
    margin: 0.3em;
    padding: 0.6em;
    padding-top: 0.7em;
    border: solid 4px #aaa;
    text-align: center;
    font-size: 1.0em;
    color: #666;
    text-decoration: none;
}
a.main-link:hover {
    background-color: #ff6;
}