*
{
    box-sizing: border-box;
}

:root
{
    --headers-color: rgb(241, 253, 253);
    --description-color: #d7f7f5; 
    --primary-color: #005A82;
    --secondary-color: #0AC8B9;
    --primary-design-color: #e4af3c;
    --background-color: #010913;
    --footer-color: #071320;
    --headers-font: "Beaufort for LOL Bold";
    --description-font: "SpiegelSans Trial Light";
    --footer-credits-color: #eed191;
}
body
{
    margin: 0;
    background-color: var(--background-color);
}

header
{
    background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));
    display: inline-block;
    width: 100%;
}

#title
{
    padding-top: 3rem;
    padding-bottom: 0;
    margin-bottom: -1rem;
    text-align: center;
    font-family: "Beaufort for LOL Bold";
    color: var(--headers-color);
    font-weight: 900;
    letter-spacing: 0.03em;
    font-size: 55px;
}
#title-desc
{
    text-align: center;
    padding-bottom: 2rem;
    font-family: "SpiegelSans Trial Light";
    color: var(--description-color);
}

#img-div img
{
    width: 100%;
    margin: 0 auto;
    max-height: 700px;
    border: 1px solid #C89B3C;
}

#image
{
    display: block;
    height: auto;
    max-width: 100%;
    width: 100%;
}


#img-caption
{
    padding: 3px;
    margin-top: 0.5em;
    padding-bottom: 0.5em;
    border-bottom: 1px solid #C89B3C;
    font-family: var(--description-font);
    font-weight: 500;
    color: var(--description-color);
    text-align: center;
}

#img-caption a
{
    color: cyan;
    font-weight: 600;
}

section
{
    margin: auto 40px;
}

#tribute-info h2
{
    color: var(--primary-design-color);
    font-family: var(--headers-font);
}
#tribute-info ul
{
    list-style: none;
}
#tribute-info p
{
    color: var(--description-color);
    font-family: var(--description-font);
    font-weight: 500;
}

#tribute-info li
{
    color: var(--description-color);
    font-family: var(--description-font);
}

#tribute-images
{
    display: flex;
    flex-direction: row;
    margin-bottom: 2em;
    gap: 3em;
}

#section-header h2
{
    text-align: center;
    color: var(--primary-design-color);
    font-family: var(--headers-font);
}

#tribute-images img
{
    width: 100%;
    max-width: 350px;
    max-height: 350px;
    object-fit: cover;
    border: 1px solid #C89B3C;
}

#subimg-caption
{
    padding-top: 0.5em;
    color:var(--description-color);
}

footer
{
    background-color: var(--footer-color);
    padding: 30px;
}

footer a
{
    display: block;
    margin: 0.5em auto;
    color:var(--footer-credits-color);
    text-decoration: none;
    font-weight: 600;
}
