@font-face {
    font-family: charter;
    src: url('charter_regular.woff2');
}
@font-face {
    font-family: charterBold;
    src: url('charter_bold.woff2');
}

* { font-weight: 400 !important; } /* charter has only 2 weights */

h1, b, em { font-family: 'charterBold', serif; color:#222; }


html, body { font-family: 'charter'; height:100%; margin:0; padding:0; }
html {
 overflow:auto; 
}
body {
    background-color:#FFFCEB;
}

.tile {  height:12vw; width:12vw; max-height:100px; max-width:100px; }

.vertStrip { width:12vw; max-width:100px; height:auto; }
.horzStrip { height:12vw;  max-height:100px; }

img { height:100%; display:block;}

button {color:#222;}
button[disabled=false]:hover, button[disabled=false]:active {
    transform: translateY(1px);
}

.animated {
    position:relative;
    transition-property: margin-top;
    transition-duration: 1s;
    overflow:hidden;
}

.open { margin-top:0px; }

.txtShadow{ text-shadow: 1px 1px 0px #990000; }

a, a.visited { color:#0000aa;}