@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400;0,700;1,400;1,700&display=swap');

:root{
    --russet: #834826;
    --light-orange: #F7D9B3;
    --cornsilk: #F8EECC;
    --coffee: #7A5341;
    --liver-chestnut: #98774D;
}

* {
    font-family: 'EB Garamond';
}

body {
    background-color: #C2A683 !important;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Article Cards */

.articles {
    color: #664011;
}

.articles a {
    text-decoration: none;
    color: inherit;
}

.articles .card {
    background-color: #F8EECC;
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, 0.2);
    transition: 0.1s ease;
}

.articles .card * { /* Add transition to all elements within cards */
    transition: 0.1s ease;
}

.articles .card-img-top {
    height: 16rem;
    object-fit: cover;
    object-position: top;
}

.articles .card:hover {
    box-shadow: 0 .2rem .5rem rgba(0, 0, 0, 0.3);
    background-color: #f8f4e6;
}

.articles .card-title:hover {
    text-decoration: underline;
}

.articles .card:hover .card-img { /* Article Visual */
    filter: sepia(0.5);
}

.articles .card-byline {
    position: relative; /* For .card-byline > img (feather) positioning */
}

.articles .card-byline > .card-text {
    padding: 0.1rem 1rem 0.1rem 3rem;
}

.articles .card-byline > img { /* Feather Icon */
    position: absolute;
    left: 0.2rem;
    bottom: 0.7rem;
}

.articles .card-date { /* Article Date */
    display: inline-block;
    background-color: #FCE0BC;
}

.articles .card-category { /* Article Category */
    display: inline-block;
    text-transform: uppercase;
    background-color: #C2A683;
    color: #F8EECC;
}

.articles .view-all-link:hover {
    text-decoration: underline;
}


/* Header */
header {
    background-image: url(/images/Header.png);
    background-size: cover;
    background-position: center;
}

/* TLS FTA Star in Header */
header .header-logo {
    width: 84px;
}

/* Header Title */

header h3.header-title-top {
    font-size: 1.5em !important;
    margin-top: -1rem;
    color: var(--light-orange);
}

header h1.header-title-bottom {
    font-size: 3.5em !important;
    color: var(--light-orange);
    text-shadow: 0 .2rem .7rem rgba(0, 0, 0, 0.6);
    margin-top: -0.75rem;
}

header p.header-description {
    color: var(--light-orange) !important;
    font-size: 1.2em !important;
}


/* Header Article */
header .card {
    background: white;
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, 0.4);
    transition: 0.1s ease;
}

header .card * {
    transition: 0.1s ease;
}

header .card:hover {
    box-shadow: 0 .2rem .5rem rgba(0, 0, 0, 0.3);
    background-color: #f8f4e6;
}


header .article-title:hover {
    text-decoration: underline;
}

header div.card-body {
    margin-left: 1.5em;
}

header h5.article-category {
    text-transform: uppercase;
    background-color: var(--coffee);
    color: white;
    box-shadow: 0 .2rem .4rem rgba(0, 0, 0, 0.3);
}

header h4.article-title {
    color: var(--coffee);
    padding-top: 10px;
}

header p.article-author {
    color: var(--liver-chestnut);
    background: var(--light-orange);
    padding-left: 5px;
    padding-right: 5px;
    box-shadow: 0 .2rem .4rem rgba(0, 0, 0, 0.3);
    margin-top: 10px;
}

header p.article-date {
    color: var(--liver-chestnut);
    background: var(--cornsilk);
    padding-left: 5px;
    padding-right: 5px;
    font-style: italic;
    box-shadow: 0 .2rem .4rem rgba(0, 0, 0, 0.3);
    margin-top: 10px;
}

header p.article-excerpt {
    color: white;
    background: var(--liver-chestnut);
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    box-shadow: 0 .2rem .4rem rgba(0, 0, 0, 0.3);
    margin-top: 10px;
}

header .card-img {
    filter: sepia(0.5);
}

header .card:hover .card-img {
    filter: sepia(0);
}

/* Footer */
footer {
    background-color: var(--russet);
    margin-top: 3rem;
}

footer div.row {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

footer div.left {
    justify-content: center;
}

footer figure {
    text-align: center;
}

footer .footer-logo {
    width: 454px;
}

footer .footer-heading {
    color: var(--light-orange);
    font-size: 1.5625em;
    font-weight: 700;
}

footer .footer-description{
    color: var(--cornsilk);
    font-size: 1.25em;
}

footer a {
    color: var(--cornsilk) !important;
    text-decoration: none !important;
    font-size: 1.25em;
    font-weight: 500;
}

footer a:hover {
    color: var(--cornsilk) !important;
    text-decoration: underline !important;
}

footer i {
    color: var(--cornsilk);
}

footer .footer-developers {
    color: var(--cornsilk);
    font-size: 1.25em;
    font-weight: 500;
}

/* Gallery */
.gallery-card {
    background-color: white;
    transition: 0.1s ease;
}

.gallery-card:hover {
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, 0.2);
}

.gallery-card-img {
    height: 16rem;
    object-fit: cover;
    object-position: top;
}

.gallery-card-date {
    color: #664011;
    text-decoration: underline;
}

.gallery-card-caption {
    color: #664011;
}

/* View All */
.subpage-header {
    background-image: url('../images/Header.png');
    background-size: cover;
    background-position: 100% 75%;
    background-repeat: no-repeat;
}

.subpage-header .subpage-title {
    text-shadow: 0 .2rem .4rem rgba(0, 0, 0, 0.5);
}

.subpage-header .homepage-link {
    text-decoration: none;
    color: var(--light-orange);
}

.subpage-header .homepage-link:hover {
    text-decoration: underline;
}