/* grids */
.grid-nav {
    display: grid; grid-template-columns: 50% 50%; grid-gap: 1em; align-items: center;
}
.grid-footer {
    display: grid; grid-template-columns: 35% 63%; grid-gap: 1em; align-items: center; font-size: .8em;
}
.grid-3 {
    display: grid; grid-template-columns: 33% 34% 33%; grid-gap: 1em;
}
.grid-2e {
    display: grid; grid-template-columns: 45% 45%; grid-gap: 2em;
}
.grid-2l {
    display: grid; grid-template-columns: 33% 64%; grid-gap: 2em;
}
.grid-2s {
    display: grid; grid-template-columns: 15% 80%; grid-gap: 2em;
}

@media only screen and (max-width: 1024px) {
    .grid-3 { grid-template-columns: 47% 47%; }
}
@media only screen and (max-width: 720px) {
    .grid-nav, .grid-footer, .grid-3, .grid-2e { grid-template-columns: 1fr; }
}
.content { width: 95%; max-width:1600px; margin: 0 auto; }
.card-header-title { background-color: var(--title-bar); font-size: 1.2em; font-weight:bold; padding: .75em 1em; }
.card-header-title a { text-decoration:none; color: var(--text); }
.card-content { padding: 0 1em 1.5em 1em; }

/* Utilities */
.pull-right { text-align: right; }
.no-margin { margin: 0; }
.pad-2 { padding: 1em; }
@media only screen and (max-width: 720px) {
    .center-mobile { text-align: center; }
}