section
{
    /* 
    this will vary depending on font size and glyph - it's 
    not a simple X font size = Y height, as actual height 
    of a glyph varies. adjust by sight.
    */
    --arrowbox-height: 4.6rem;
}


/**
START IMAGE SLIDESHOW CODE
**/
#news-left-arrow,
#news-right-arrow
{
    font-size: 3rem; /* IF CHANGED, ADJUST --arrowbox-height AS NEEDED */
    background-color: rgba(0,0,0,0.4);
    width: 3rem; /* SHOULD BE SAME AS font-size (or maybe not?) */
    height: var(--arrowbox-height); /* USE --arrowbox-height TO ADJUST */
    display: inline-block;
    text-decoration: none;
    color: var(--gt-white);
    position: absolute;
    top: calc(50% - ( var(--arrowbox-height) / 2 )); /* USE --arrowbox-height TO ADJUST */
    text-align: center;
    text-shadow: 0px 0px 5px var(--gt-black);
    cursor: pointer;
    transition: all ease-in-out;
}

#news-left-arrow:hover,
#news-right-arrow:hover
{
    background-color: var(--gt-black);
    color: var(--gt-white);
}

#news-right-arrow
{
    right: 0px;
}

#news-slideshow
{
    position: relative;
    aspect-ratio: 16/9;
    background-image: url('/themes/contrib/arta_theme/images/news-images-carousel-bg.png');
    background-size: contain;
}

#news-slideshow,
.news-slide img
{
    border-top-right-radius: 1rem;
    border-bottom-left-radius: 1rem;
}


#news-slideshow:not(:hover) .news-images-full-button
{
    display: none;
}

#news-slideshow:not(:hover) #news-left-arrow,
#news-slideshow:not(:hover) #news-right-arrow
{
    background-color: unset;
}

.news-slide
{
    height: 100%;
    display: none;
}

.news-slide.news-active
{
    display: block;
}

.news-caption,
.news-images-full-button,
.news-images-minimize-button
{
    position: absolute;
    font-size: 0.8rem;
    color: var(--gt-white);
    text-align: center;
}

.news-images-full-button,
.news-images-minimize-button
{
    padding: 0.3rem;
    background-color: rgba(0,0,0,0.4);
}

.news-images-full-button,
.news-images-minimize-button
{
    right: 0;
    width: 1.6rem;
    cursor: pointer;
    border-top-right-radius: 1rem;
}

.news-images-minimize-button
{
    display: none;
}

.news-caption
{
    width: 100%;
    bottom: 0;
    padding: 1rem;
    background-color: rgba(0,0,0,0.7);
    border-bottom-left-radius: 1rem;
}

.news-caption p
{
    color: var(--gt-white);
    margin: unset;
    font-size: 1rem;
}

.news-slide img
{
    width: auto;
    height: 100%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    object-fit: contain;
}

.news-slide iframe
{
    width: 100%;
    height: auto;
    aspect-ratio: 16/9;
    border-radius: var(--arta-border-radius);
}

#news-dots
{
    text-align: center;
    margin: 1rem;
    font-size: 1rem;
}

.news-image-dot
{
    color: gray;
    cursor: pointer;
    font-size: 1rem;
}

.news-image-dot.news-active
{
    color: var(--gt-black);
}

.news-image-dot:hover
{
    color: var(--gt-gold);
    text-shadow: 0px 0px 5px var(--gt-black);
}

.news-image-dot:not(:last-child)
{
    margin-right: 1rem;
}

#news-fullwidth-images-container.show
{
    position: fixed;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    z-index: 100;
    background-color: rgba(0,0,0,0.8);
}

#news-fullwidth-images-container.show #news-slideshow
{
    position: fixed;
    width: 75vw;
    height: 75vh;
    margin: calc(25vh / 2) calc(25vw / 2);
}

#news-fullwidth-images-container.show .news-images-full-button
{
    display: none;
}

#news-fullwidth-images-container.show .news-images-minimize-button
{
    display: block;
}

/**
END IMAGE SLIDESHOW CODE
**/

.page-title:has(#news-title)::before
{
    content: unset;
}

#news-title
{
    font-weight: 300;
    color: var(--gt-navy);
    font-size: 2.5rem;
    text-transform: none;
    margin-bottom: 1.5rem;
    display: block;
}

.dateline
{
    width: 100%;
    text-align: center;
    padding: 0.5rem;
    border-width: 2px 0px;
    border-style: solid;
    border-color: var(--gt-drk-gold);
    margin-bottom: 2rem;
}

.dateline h5
{
    margin-bottom: unset;
    color: var(--gt-black);
    font-weight: normal;
}

.news-container
{
    display: flex;
    flex-direction: row;
}

.news-body-page
{
    width: 100%;
}

.news-body-page .description p
{
    font-size: 1.4rem;
    margin: 1em 0em;
    font-weight: 300;
    line-height: 1.4em;
}

.news-body-page .description h3
{
    font-size: 1.9rem;
    margin-top: 1.5em;
}

.sidebar-right
{
    float: right;
    background-color: #F9F6E5;
}

.card
{
    background-color: transparent !important;
    padding: 0 0 1rem;
    margin: 1rem 0;
    border: 0px solid var(--gt-light-gray);
    border-radius: 0;
}

.news-contact h3
{
  color: var(--gt-navy);
}

.news-contact
{
    background-color: var(--arta-vlight-gold);
    border-radius: var(--arta-border-radius);
    padding: 2rem;
}

@media screen and (max-width: 990px)
{
    .news-images-full-button
    {
    display: none;
    }
}

@media screen and (max-width: 620px)
{
    #news-slideshow
    {
        aspect-ratio: unset;
    }

    .news-caption
    {
        position: relative;
    }

    .news-slide img
    {
        border-bottom-left-radius: unset;
        height: unset;
    }
}