body {
    font-family: Arial;
    background: #f8f8fe;
    margin: 0px;
}
a:link    { color:black; text-decoration:none;      }
a:visited { color:black; text-decoration:none;      }
a:hover   { color:black; text-decoration:underline; }

header { display:flex; flex-direction:row; height:30px; padding:4px 10px; color:black; font-size:16px; line-height:30px; }

h1 {
    margin: 0;
    font-size: 20px;
    font-weight: bold;
    line-height: 32px;
    color: black;
}
header h1 {     flex:60%; text-align:center; padding:0px; }
.header-left  { flex:20%; text-align:left;  text-decoration:underline;}
.header-right { flex:20%; text-align:right; padding-top:2px; }

.header-share-button { width:24px; height:24px; object-fit:contain; visibility:hidden; }

.main {
    background-color: #f8f8fe;
}

footer {
    min-height: 24px;
    line-height: 20px;
    margin-top: 8px;
    padding: 8px;
    color: white;
    background-color: #103090;
    font-size: 12px; 
}
footer a:link    { color:white; text-decoration:none;      }
footer a:visited { color:white; text-decoration:none;      }
footer a:hover   { color:white; text-decoration:underline; }

.mtz-sources { font-size:10px; color:#444444; margin-left:8px; text-align:left; line-height:11px; }
.mtz-sources a:link, .mtz-sources a:visited { color:#0056a7; }
.mtz-sources a:hover { color:#0056a7; text-decoration:underline; }

h2 {
    font-size: 16px;
    line-height: 20px;
    margin-top: 16px;
    margin-bottom: 10px;
    padding: 0;
}

.footer-menu {  display:flex; flex-direction:row; margin:16px; }
.footer-group { display:flex; flex:50%; flex-direction:row; }
.footer-item {
    flex:25%;
    text-align: center;
    background:lightskyblue; font-size:20px; font-weight:normal; margin:4px; padding:4px; line-height:30px;
    border-bottom: 1px solid #0056a7;
    border-radius: 18px;
}
.footer-menu > a:link    { color:#0056a7; }
.footer-menu > a:visited { color:#0056a7; }

@media screen and (max-width: 764px) {
    .footer-menu {
        flex-direction: column;
    }
    .footer-group {
        flex:100%;
    }
    .footer-item {
        flex:50%;
    }
}
