body {
    color: #eee;

}

#r{
    color:#f13333;
}

#g{
    color:#33f133;
}

#b{
    color:#3333f1;
}

.regular-background {
    background-color: #087457;
}
.regular-font {
    font-family: 'Ilisarniq', sans-serif;
}

.shadowed-text {
    text-shadow: -1px -1px 0 #444, 1px -1px 0 #444, -1px 1px 0 #444, 1px 1px 0 #444;
}


.shadowed-border {
    border: 2px solid #eee;
    border-radius: 10px;
    box-shadow: 0 0  1px 1px #444, inset 0 1px 1px #444;
}
#time {
    margin-top: 0.2em;
    text-align:center;
    max-width: 8em;
    min-width: 8em;
}
#clock-title{
    vertical-align:text-top;
    font-size:0.75em;
}

.mono-font{
    font-family: 'Space Mono', monospace;
}

.name-font {
    font-family: 'Solway', normal;
}

#mode{
    font-size:1em;
    height: 1.8em;
    vertical-align: unset;
    padding-left: 0.5em ;
    padding-right: 0.5em ;
    color:#eee;
    background-color:#eee;
    font-weight:700;
    text-shadow: -1px -1px 0 #333, 1px -1px 0 #333, -1px 1px 0 #333, 1px 1px 0 #333;
    box-shadow: 0 0 1px 1px #444;
}

#mode:hover{
    color:#eee;
    text-shadow: -1px -1px 0 #666, 1px -1px 0 #666, -1px 1px 0 #666, 1px 1px 0 #666;
    box-shadow: 0 0 1px 1px #111;
}
#mode:active{
    text-shadow: -1px -1px 0 #999, 1px -1px 0 #999, -1px 1px 0 #999, 1px 1px 0 #999;
}
.closeButton:hover{
    text-shadow: -1px -1px 0 #111, 1px -1px 0 #111, -1px 1px 0 #111, 1px 1px 0 #111;
}

#mid-text{
    display: inline-block;
}

.with-corner{
    position:relative;
    padding-top:1.5em;
    justify-content: left;
    padding-left:0.5em;
}

#prefix-text{
    text-align:left;
}

.top-corner{
    position: absolute;
    top: 0px;
}
.beside-stacked {
    vertical-align: middle;
}

.fa-stack {
    font-size: 0.5em;
}


a:hover {
    color: #eee;
}

a {
    color: #eee;
    text-decoration: none;
}

.stacked-icon {
    vertical-align: middle;
    justify-content: center;
}

.stacked-icon-inner {
    color: #087457;
}

@media screen and (min-width:769px),
print {
    .is-size-1-tablet {
        font-size: 5rem !important
    }

    .is-size-2-tablet {
        font-size: 2.5rem !important
    }

}

@media screen and (max-width:768px) {

    .is-size-3-mobile {
        font-size: 3rem !important
    }

    .is-size-4-mobile {
        font-size: 1.5rem !important
    }
}