.component-headlines { }

.component-headlines .carousel-control-pp {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 15%;
    height: 15%;
    padding: 0;
    color: #fff;
    text-align: center;
    background: 0 0;
    border: 0;
    opacity: .5;
    transition: opacity .15s ease;
    text-decoration: none;
}
.component-headlines .carousel-control-pp:focus,
.component-headlines .carousel-control-pp:hover{
    color: #fff;
    text-decoration: none;
    outline: 0;
    opacity: .9;
}
/*====================================
layout-basic
====================================*/
/*=====================================================
layout-featured-slider
======================================================*/
.component-headlines.layout-basic { overflow:hidden; }
.component-headlines.layout-basic .slick-list { display:flex !important; }
.component-headlines.layout-basic .slick-track { display:flex; align-items:stretch; justify-content:center;   }
.component-headlines.layout-basic .slick-track .slick-slide { float:none; box-sizing: border-box; }
.component-headlines.layout-basic .slick-arrow-controls {  }
.component-headlines.layout-basic .slick-arrow-controls .slick-arrow{ position: absolute; left: -2rem; top: 50%; margin-top:-1.5rem; bottom:auto; z-index: 1; width: 2rem; height: 3rem; padding: 0; border: none; font-size: 1rem; line-height: 3rem; cursor: pointer;text-decoration: none;text-align: center;overflow: hidden;transition:all .2s linear; }
.component-headlines.layout-basic .slick-arrow-controls .prev { }
.component-headlines.layout-basic .slick-arrow-controls .next { left: auto; right: -2rem; }
.component-headlines.layout-basic:focus .slick-arrow.prev,
.component-headlines.layout-basic:focus-within .slick-arrow.prev,
.component-headlines.layout-basic:active .slick-arrow.prev,
.component-headlines.layout-basic:hover .slick-arrow.prev{ left:0.25rem; }
.component-headlines.layout-basic:focus .slick-arrow.next,
.component-headlines.layout-basic:focus-within .slick-arrow.next,
.component-headlines.layout-basic:active .slick-arrow.next,
.component-headlines.layout-basic:hover .slick-arrow.next{ right:0.25rem; }

.component-headlines.layout-basicOLD .carousel-caption {
    width: 100%;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    padding: 2rem 10% 3rem;
    background: linear-gradient(180deg, rgba(0,0,0,0) 33%, rgba(0,0,0,0.85) 100%);
    text-shadow: 1px 1px 1px rgb(0 0 0 / 50%);
    position:relative;
}

/*====================================
layout-carousel
====================================*/
.component-headlines.layout-carousel .carousel-caption{
    width:100%;
    left:0;
    right:0;
    bottom:0;
    top:0;
    padding:2rem 10% 3rem;
    background: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,1) 100%);
    text-shadow:1px 1px 1px rgba(0,0,0,0.5);
}


/*=====================================================
layout-featured-slider
======================================================*/
.component-headlines.layout-featured-slider { overflow:hidden; }
.component-headlines.layout-featured-slider .slick-list { display:flex !important; }
.component-headlines.layout-featured-slider .slick-track { display:flex; align-items:stretch; justify-content:center;   }
.component-headlines.layout-featured-slider .slick-track .slick-slide { float:none; box-sizing: border-box; }
.component-headlines.layout-featured-slider .slick-arrow-controls {  }
.component-headlines.layout-featured-slider .slick-arrow-controls .slick-arrow{ position: absolute; left: -2rem; top: 50%; margin-top:-1.5rem; bottom:auto; z-index: 1; width: 2rem; height: 3rem; padding: 0; border: none; font-size: 1rem; line-height: 3rem; cursor: pointer;text-decoration: none;text-align: center;overflow: hidden;transition:all .2s linear; }
.component-headlines.layout-featured-slider .slick-arrow-controls .prev { }
.component-headlines.layout-featured-slider .slick-arrow-controls .next { left: auto; right: -2rem; }
.component-headlines.layout-featured-slider:focus .slick-arrow.prev,
.component-headlines.layout-featured-slider:focus-within .slick-arrow.prev,
.component-headlines.layout-featured-slider:active .slick-arrow.prev,
.component-headlines.layout-featured-slider:hover .slick-arrow.prev{ left:0.25rem; }
.component-headlines.layout-featured-slider:focus .slick-arrow.next,
.component-headlines.layout-featured-slider:focus-within .slick-arrow.next,
.component-headlines.layout-featured-slider:active .slick-arrow.next,
.component-headlines.layout-featured-slider:hover .slick-arrow.next{ right:0.25rem; }

/*=====================================================
layout-stacked-carousel
======================================================*/
.component-headlines.layout-stacked-carousel { overflow:hidden; }
@media only screen and (min-width:768px) {
    .component-headlines.layout-stacked-carousel .my-md-n1{
        margin:-0.25rem 0 !important;
    }
}
.component-headlines.layout-stacked-carousel .aside-carousel .carousel-indicators [data-bs-target] {
    height:auto;
    box-sizing: border-box;
    text-indent:initial;
    background:transparent;
    opacity:1;
    cursor:default;
}
.component-headlines.layout-stacked-carousel .aside-carousel .carousel-indicators .item{

}
.component-headlines.layout-stacked-carousel .aside-carousel .carousel-indicators .item.active{
    background:var(--bs-primary);
    color:#fff;
}
.component-headlines.layout-stacked-carousel .aside-carousel .carousel-indicators .item.active .card-body > *:not(.card-title) {
    opacity:0.75;
}
.component-headlines.layout-stacked-carousel .aside-carousel .carousel-indicators .item.active .card-body a{
    color:#fff;
}
.component-headlines.layout-stacked-carousel .aside-carousel .carousel-indicators .item.active a:hover,
.component-headlines.layout-stacked-carousel .aside-carousel .carousel-indicators .item.active a:focus{
   opacity:0.75;
}
.component-headlines.layout-stacked-carousel .aside-carousel .carousel-indicators .item .card .row > .col-12.my-md-n1 {
    margin-left:-1px !important;
}
.component-headlines.layout-stacked-carousel .date{
    font-size: .875em;
    opacity:0.75;
}
.component-headlines.layout-stacked-carousel .carousel-caption {
    width: 100%;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    padding: 2rem 10% 3rem;
    background: linear-gradient(180deg, rgba(0,0,0,0) 33%, rgba(0,0,0,0.85) 100%);
    text-shadow: 1px 1px 1px rgb(0 0 0 / 50%);
}
.component-headlines.layout-stacked-carousel .archive-link { margin-top:0; }



/*=====================================================
layout-card-slider
======================================================*/
.component-headlines.layout-card-slider { overflow:hidden; }
.component-headlines.layout-card-slider .slick-list { display:flex !important; margin:0 -calc(1rem + 1px); }
.component-headlines.layout-card-slider .slick-track { display:flex; align-items:stretch; justify-content:center; gap: 1rem; }
.component-headlines.layout-card-slider .slick-track .slick-slide { float:none; box-sizing: border-box; }
.component-headlines.layout-card-slider .slick-arrow-controls {  }
.component-headlines.layout-card-slider .slick-arrow-controls .slick-arrow{ position: absolute; left: -2rem; top: 50%; margin-top:-1.5rem; bottom:auto; z-index: 1; width: 2rem; height: 3rem; padding: 0; border: none; font-size: 1rem; line-height: 3rem; cursor: pointer;text-decoration: none;text-align: center;overflow: hidden;transition:all .2s linear; }
.component-headlines.layout-card-slider .slick-arrow-controls .prev { }
.component-headlines.layout-card-slider .slick-arrow-controls .next { left: auto; right: -2rem; }
.component-headlines.layout-card-slider:focus .slick-arrow.prev,
.component-headlines.layout-card-slider-slider:focus-within .slick-arrow.prev,
.component-headlines.layout-card-slider:active .slick-arrow.prev,
.component-headlines.layout-card-slider:hover .slick-arrow.prev{ left:0.25rem; }
.component-headlines.layout-card-slider-slider:focus .slick-arrow.next,
.component-headlines.layout-card-slider:focus-within .slick-arrow.next,
.component-headlines.layout-card-slider:active .slick-arrow.next,
.component-headlines.layout-card-slider:hover .slick-arrow.next{ right:0.25rem; }

/*=====================================================
layout-card-grid
======================================================*/
.component-headlines.layout-grid .grid { row-gap:1.5rem }
.component-headlines.layout-grid .item { display:flex; align-items:center; flex:0 0 100% }
.component-headlines.layout-grid .item .thumbnail { width:50% }
.component-headlines.layout-grid .item .details { width:50%; padding-left:1rem }

.component-headlines.layout-grid .grid.md { column-gap:4% }
.component-headlines.layout-grid .grid.md .item { flex-basis:48% }

.component-headlines.layout-grid .grid.xl  { column-gap:2% }
.component-headlines.layout-grid .grid.xl .item { flex-basis:32% }

/*=====================================================
RESPONSIVE
======================================================*/
@media only screen and (min-width:992px) {

}
@media (max-width: 991px) {

}
@media only screen and (min-width:992px) {

}


@media only screen and (min-width:768px) {

}
@media only screen and (min-width:992px) {

}
@media only screen and (min-width:1200px) {

}

/*=====================================================
LAYOUT FLOW
======================================================*/
@keyframes slide-up-fade-in {
  0% {
    opacity: 0;
    transform: translateY(50px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.component-headlines.layout-flow { overflow:hidden }
.component-headlines.layout-flow .slick-slider { margin:0; overflow:hidden }
.component-headlines.layout-flow .slick-list { max-width:var(--ps-site-width); padding:0 !important; margin:0 auto; overflow:visible }
.component-headlines.layout-flow .slick-track { display:flex; align-items:stretch }
.component-headlines.layout-flow .slick-slider .slick-dots { display:flex; align-items:center; position:static }
.component-headlines.layout-flow .slick-arrow { opacity:20%; top:auto; bottom:0; transform:none; transition:all .4s linear; border-radius:0; --bs-btn-color:#fff; --bs-btn-bg:var(--bs-primary); --bs-btn-hover-bg:var(--bs-primary); --bs-btn-hover-color:#fff }
.component-headlines.layout-flow:hover .slick-arrow,
.component-headlines.layout-flow:focus .slick-arrow,
.component-headlines.layout-flow:active .slick-arrow{
    opacity:1;
}
.component-headlines.layout-flow .slick-arrow-controls { display:none; max-width:var(--ps-site-width); margin:0 auto; position:absolute; left:0; right:0; top:0; bottom:50%; z-index:3 }
.component-headlines.layout-flow .slick-pp { right:1.25rem !important; top:1rem !important; bottom:auto !important; display:block; font-size: 0.85rem;
    padding: 0.25rem !important;
    line-height: 1; font-weight:normal; }

.component-headlines.layout-flow .slick-arrow.prev { left:0.25rem; }
.component-headlines.layout-flow .slick-arrow.next { left:auto; right:0.25rem; }
.component-headlines.layout-flow .slick-slide > div { padding:0 0.25rem;}
.component-headlines.layout-flow .slick-slide:not(.slick-active) > div {  }
.component-headlines.layout-flow .slick-slide:not(.slick-active) .card-thumbnail {  }
.component-headlines.layout-flow .slick-slide:not(.slick-active) .card-thumbnail .img-placeholder { transform: scale(1.1); filter:blur(2px) }
.component-headlines.layout-flow .slick-slide:not(.slick-active) .card-thumbnail > .ratio > .img-placeholder:before {
    content: ""; display:block; width:100%; height:100%; background-color:rgba(var(--bs-primary-rgb),.65);
}
.component-headlines.layout-flow .slick-slide:not(.slick-active) .card-thumbnail > .ratio > .img-placeholder:after{
    content: ""; display:block; width:100%; height:100%; position:absolute; bottom:0;
    background: -moz-linear-gradient(90deg, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0) 20%, rgba(0,0,0,0) 80%, rgba(0,0,0,0.2) 100%);
    background: -webkit-linear-gradient(90deg, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0) 20%, rgba(0,0,0,0) 80%, rgba(0,0,0,0.2) 100%);
    background: linear-gradient(90deg, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0) 20%, rgba(0,0,0,0) 80%, rgba(0,0,0,0.2) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
}
.component-headlines.layout-flow .slick-slide > div { }
.component-headlines.layout-flow .slick-slide > div .item { overflow: hidden; vertical-align:top; overflow:hidden }
.component-headlines.layout-flow .slick-slide .view-more { display:none !important }

.component-headlines.layout-flow .boxscores { display:none } 
.component-headlines.layout-flow .boxscores .nav { display:flex; flex-wrap:nowrap; margin:0 !important }
.component-headlines.layout-flow .boxscores .nav-pills .nav-link { padding:3px 1rem; border-radius:2px 2px 0 0; background:rgba(100,100,100,0.85); color:#ccc }
.component-headlines.layout-flow .boxscores .nav-pills .nav-link.active,
.component-headlines.layout-flow .boxscores .nav-pills .show > .nav-link { background:var(--bs-primary); color:#fff }

.component-headlines.layout-flow .card-thumbnail .img-container { background-position:center top !important } 
.component-headlines.layout-flow .card-title .stretched-link::after { content:none }
.component-headlines.layout-flow .date-category { display:flex; align-items:center; opacity:0.6; font-size:0.9rem }
.component-headlines.layout-flow .category::before { content:'-'; margin:0 1rem; }
.component-headlines.layout-flow .related-links { white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.component-headlines.layout-flow .boxscores .team-logo-inline img { display:inline }

@media only screen and (min-width:1024px) {
    .component-headlines.layout-flow .slick-slide .card-body { display:flex; flex-direction:column; position:absolute; left:0; right:0; bottom:0; padding:0; opacity:0; transform: translateY(300px) }
    .component-headlines.layout-flow .slick-active .card-body { opacity:1; visibility:visible; animation: slide-up-fade-in 0.5s ease-out 0.8s forwards; }
    .component-headlines.layout-flow .slick-slide .card-details { display:flex; justify-content:space-between; align-items:center; gap:2rem; min-height:120px; padding:20px; color:#fff; background:rgba(0,0,0,0.7) }
    .component-headlines.layout-flow .slick-slide a:not(.btn) { color:#fff; opacity:0.8; transition:opacity .2s }
    .component-headlines.layout-flow .slick-slide a:not(.btn):hover { opacity:1 } 
    .component-headlines.layout-flow .slick-slide .view-more { display:block !important }

    .component-headlines.layout-flow .boxscores { display:block; position: absolute; margin:1rem; align-self:flex-end; font-size:0.8rem; z-index:2; opacity:0 }
    .component-headlines.layout-flow .boxscores .content { padding:10px; background:rgba(0,0,0,0.75) }
    .component-headlines.layout-flow .slick-active .boxscores { bottom:150px; opacity:1; visibility:visible; animation: slide-up-fade-in 0.5s ease-out 0.8s forwards; }
    .component-headlines.layout-flow .boxscores .gamebox,
    .component-headlines.layout-flow .boxscores .game-label { display:none }
    .component-headlines.layout-flow .linescore { margin:0 !important } 
    .component-headlines.layout-flow .table { margin:0 !important; background:transparent !important }
    .component-headlines.layout-flow .table tr { border:none }
    .component-headlines.layout-flow .table th,
    .component-headlines.layout-flow .table td { border:none; color:#ccc; background:transparent !important; box-shadow:none }
    .component-headlines.layout-flow .text-muted { color:#999 !important }
    .component-headlines.layout-flow .table a { color:#ccc }

    .component-headlines.layout-flow .slick-arrow-controls { display:block }
}

@media only screen and (min-width:1200px) {
    .component-headlines.layout-flow .slick-slide > div { transition:transform .2s ease-in }
    .component-headlines.layout-flow .slick-slide.slick-active > div { transition:transform 1s .2s ease-out }
    .component-headlines.layout-flow .slick-slide:not(.slick-active) > div { transform-origin:right; scale:0.9; }
    .component-headlines.layout-flow .slick-slide.slick-active + .slick-slide > div { transform-origin:left }
    .component-headlines.layout-flow .slick-slide.slick-active .item { transform:none; transition:none }
    .component-headlines.layout-flow .slick-slider .slick-dots { display:none !important }
    .component-headlines.layout-flow .slick-track {  }
    .component-headlines.layout-flow .slick-arrow.slick-pp { top:1rem;}
    .component-headlines.layout-flow .slick-arrow.prev { }
    .component-headlines.layout-flow .slick-arrow.next { left:auto; }
}

/*=====================================================
LAYOUT DYNASTY
======================================================*/
.component-headlines.layout-dynasty .carousel-item:after { content: ''; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 33%, rgba(0,0,0,0.85) 100%) }
.component-headlines.layout-dynasty .carousel-caption { position:absolute; left:0; right:0; bottom:80px; z-index:3; text-align:left; text-transform:uppercase; padding:0; line-height:1.1 }
.component-headlines.layout-dynasty .carousel-caption .carousel-caption-container { /* max-width:var(--ps-site-width) !important */ }
.component-headlines.layout-dynasty .carousel-controls { display:none; max-width:var(--ps-site-width); padding:0; position:absolute; bottom:1rem; left:0; right:0; margin:0 auto; color:#fff }
.component-headlines.layout-dynasty .carousel-controls .control { position:relative; flex:1; width:auto; height:auto; margin:0; border:none; background:transparent; text-indent:0; line-height:1  }
.component-headlines.layout-dynasty .carousel-controls .control .container { padding:1rem; display:flex; flex-direction:column; justify-content:center; gap:0.5rem }
.component-headlines.layout-dynasty .carousel-controls .control .container:before { content:''; position:absolute; left:1rem; bottom:0; width:1px; height:2px; background:var(--bs-tertiary) !important; opacity:0; transition:all .6s ease-out }
.component-headlines.layout-dynasty .carousel-controls .control.active .container:before { opacity:1; width:calc(100% - 2rem) }
.component-headlines.layout-dynasty .carousel-caption-title { font-size:1.25rem !important; font-weight:700; text-transform:uppercase } 
.component-headlines.layout-dynasty .control-caption-title { font-weight:700; text-transform:uppercase }
.component-headlines.layout-dynasty .carousel-caption-title .stretched-link:after { content:none }

@media only screen and (min-width:992px) {
    .component-headlines.layout-dynasty .carousel-caption-title { font-size:2rem !important; max-width:90% }
    .component-headlines.layout-dynasty .carousel-controls { display:flex; gap:3rem }
    .component-headlines.layout-dynasty .carousel-item.active .carousel-caption { top:50%; opacity:1; }
    .component-headlines.layout-dynasty .carousel-item.active .carousel-caption .carousel-caption-container { opacity:1; }
    .component-headlines.layout-dynasty .carousel-item.active .carousel-caption .category  { margin-left:0; }
    .component-headlines.layout-dynasty .carousel-caption { bottom:auto; top:75%; transform:translateY(-50%); opacity:0; transition: all .3s ease; }
    .component-headlines.layout-dynasty .carousel-caption .carousel-caption-container { opacity:0; transition: opacity .5s ease-in-out; }
    .component-headlines.layout-dynasty .carousel-caption .category { margin-left:-100vw; transition: all .5s ease;}
}

@media only screen and (min-width:1200px) {
    .component-headlines.layout-dynasty .carousel-controls { bottom:2rem }
    .component-headlines.layout-dynasty .carousel-caption-title { font-size:3.5rem !important }     
}

/*=====================================================
LAYOUT FLEX
======================================================*/
.component-headlines.layout-flex .grid { row-gap:1.5rem }
.component-headlines.layout-flex .item { display:flex; align-items:center; flex:0 0 100% }
.component-headlines.layout-flex .item .details { position:absolute; top:100%; right:0; left:0; height:100%; padding:1rem; color:#fff; background-color:rgba(var(--bs-primary-rgb),.65); transition:top .2s }
.component-headlines.layout-flex .item:hover .details,
.component-headlines.layout-flex .item:focus .details { top:0 }
.component-headlines.layout-flex .item .details > div:first-of-type { font-size:.875rem; padding-bottom:.5rem; margin-bottom:.5rem; border-bottom:1px solid #fff }
.component-headlines.layout-flex .item .details .card-title a { color:#fff }
.component-headlines.layout-flex .item .related-links a:hover { text-decoration:underline }
.component-headlines.layout-flex .grid.md { column-gap:4% }
.component-headlines.layout-flex .grid.md .item { flex-basis:48% }
.component-headlines.layout-flex .grid.lg  { column-gap:2% }
.component-headlines.layout-flex .grid.lg .item { flex-basis:32% }

/*=====================================================
LAYOUT FILPSTRIP
======================================================*/
.component-headlines.layout-filmstrip .carousel-item:after { content: ''; position: absolute; left: -1px; right: -1px; top: 0; bottom: -1px; background: linear-gradient(0deg, rgba(var(--bs-primary-rgb), 1) 17%, rgba(var(--bs-primary-rgb), 0) 100%); pointer-events: none }
.component-headlines.layout-filmstrip .carousel-controls .control.active { border-color: var(--bs-secondary) !important }
.component-headlines.layout-filmstrip .container.carousel-indicators .control { max-width: 318px }
.component-headlines.layout-filmstrip .carousel-control-next, 
.component-headlines.layout-filmstrip .carousel-control-prev, 
.component-headlines.layout-filmstrip .carousel-control-pp { position: relative !important; left: unset !important; right: unset !important; color: #fff; opacity: 1 !important; width: 1.75rem; height: 1.75rem; border: 1px solid; border-radius: 50px !important; font-size: .75rem }
.component-headlines.layout-filmstrip .carousel-filmstrip-controls { bottom:1.5rem }
.component-headlines.layout-filmstrip .archive-link a { font-size: 1.25rem }
.component-headlines.layout-filmstrip .carousel-control-pp { order: 1 }
.component-headlines.layout-filmstrip .carousel-control-next { order:3 }
.component-headlines.layout-filmstrip .carousel-item .carousel-caption { bottom: 3rem; opacity: 0; transition: .5s ease }
.component-headlines.layout-filmstrip .carousel-item.active .carousel-caption { opacity: 1 }

@media only screen and (min-width:992px) {
    .component-headlines.layout-filmstrip .carousel-item .carousel-caption,
    .component-headlines.layout-filmstrip .carousel-filmstrip-controls { bottom:12.5rem }
    .component-headlines.layout-filmstrip .carousel-filmstrip-controls > .d-flex { position: relative; bottom: 1.125rem }
    .component-headlines.layout-filmstrip .carousel-item .carousel-caption .carousel-caption-container { opacity:1 }
    .component-headlines.layout-filmstrip .carousel-caption .carousel-caption-container { opacity:0; transition: opacity .5s ease-in-out; }
    .component-headlines.layout-filmstrip .carousel-indicators { max-width: 900px }
    .component-headlines.layout-filmstrip .carousel-control-pp, 
    .component-headlines.layout-filmstrip .carousel-control-next { order: unset }
    .component-headlines.layout-filmstrip .carousel-caption .carousel-caption-container .carousel-caption-title { width: 90% }    
    .component-headlines.layout-filmstrip .btn.carousel-control-prev { order: 2 }
}

@media only screen and (min-width:1400px) { 
    .component-headlines.layout-filmstrip .carousel-indicators { max-width: 1180px }
}

/*=====================================================
LAYOUT SNAPVIEW
======================================================*/
.component-headlines.layout-snapview .layout-wrapper { overflow: hidden }
.component-headlines.layout-snapview .slick-slider .date-category { font-size: .75rem; gap: 0 !important; color: #fff }
.component-headlines.layout-snapview .slick-slider .date:before { content: "|"; padding-inline: .5rem }
.component-headlines.layout-snapview .slick-slider .category { font-weight: 700 }
.component-headlines.layout-snapview .slick-slider.slider-content .item { height: 745px; background-color: #000 }
.component-headlines.layout-snapview .slick-slider.slider-content .item .img-placeholder { position: relative; overflow: hidden; display: inline-block; height: 100% }
.component-headlines.layout-snapview .slick-slider.slider-content .item .img-placeholder:after { content: ""; position: absolute; right: 0; top: 0; width: 75%; height: 100%; background: linear-gradient(270deg, #000 0%, rgba(0, 0, 0, 0) 100%) }
.component-headlines.layout-snapview .slick-slider.slider-content .item .img-placeholder img { aspect-ratio: 16 / 9; object-fit: cover; object-position: center; height: 100%; max-width: 100% }
.component-headlines.layout-snapview .slick-slider.slider-content .article-details { position: absolute; bottom: 11rem; left: 0; right: 0; padding-inline: 1rem; display: flex; flex-direction: column; align-items: center; color: #fff }
.component-headlines.layout-snapview .slick-slider.slider-content .article-details .date-category { flex-direction: row-reverse !important; width: auto !important; text-shadow: var(--bs-dark) 0 0 .25rem, var(--bs-dark) 0 0 .5rem }
.component-headlines.layout-snapview .slick-slider.slider-content .article-details .card-title { font-family: var(--heading-font-family); text-align: center; text-transform: uppercase; text-shadow: var(--bs-dark) 0 0 .25rem, var(--bs-dark) 0 0 .5rem }
.component-headlines.layout-snapview .slick-slider.slider-content .article-details .card-title a { display: block; line-height: 1.25; color: #fff }
.component-headlines.layout-snapview .slick-slider.slider-content .article-details .card-title a:after { display: none }
.component-headlines.layout-snapview .slick-slider.slider-content .boxscores .brief-stats .linescore,
.component-headlines.layout-snapview .slick-slider.slider-content .boxscores .brief-stats .gamebox .scorebox-teams { margin: 0 !important }
.component-headlines.layout-snapview .slick-slider.slider-content .boxscores .brief-stats .gamebox .scorebox { border-color: #fff !important; border-radius: .25rem; background-color: rgba(0,0,0,0.65) }
.component-headlines.layout-snapview .slick-slider.slider-content .boxscores .brief-stats .gamebox .logo img { width: 2rem !important }
.component-headlines.layout-snapview .slick-slider.slider-content .boxscores .brief-stats .gamebox .team .team-name,
.component-headlines.layout-snapview .slick-slider.slider-content .boxscores .brief-stats .gamebox .team .team-record { font-size: .75rem !important; white-space: nowrap; color: #fff !important }
.component-headlines.layout-snapview .slick-slider.slider-content .boxscores .brief-stats .gamebox .score { font-size: 1rem !important; background-color: transparent !important }
.component-headlines.layout-snapview .slick-slider.slider-content .boxscores .brief-stats .linebox { display: none }
.component-headlines.layout-snapview .slick-slider.slider-content .boxscores .brief-stats .game-label { display: none }
.component-headlines.layout-snapview .slick-slider.slider-content .boxscores .nav { display:flex; flex-wrap:nowrap; justify-content: center; margin:0 !important }
.component-headlines.layout-snapview .slick-slider.slider-content .boxscores .nav-pills .nav-link { flex: 1; padding: .25rem 1rem; font-size: .75rem; color: #fff; background:rgba(0,0,0,0.65); border-radius: 0 }
.component-headlines.layout-snapview .slick-slider.slider-content .boxscores .nav-pills .nav-item:first-child .nav-link { border-radius: 0.25rem 0 0 0 }
.component-headlines.layout-snapview .slick-slider.slider-content .boxscores .nav-pills .nav-item:last-child .nav-link { border-radius: 0 0.25rem 0 0 }
.component-headlines.layout-snapview .slick-slider.slider-content .boxscores .nav-pills .nav-link.active,
.component-headlines.layout-snapview .slick-slider.slider-content .boxscores .nav-pills .show > .nav-link { background: #fff; color: var(--bs-primary) }
.component-headlines.layout-snapview .slick-slider.slider-content .related-links { margin-top: 0 !important; display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: center; font-size: .75rem; font-weight: 700 }
.component-headlines.layout-snapview .slick-slider.slider-content .related-links a { margin: 0 !important; padding: .75rem 1rem; align-content: center; white-space: nowrap; text-decoration: none; color: #fff; background-color: var(--bs-primary); border-radius: .25rem; transition: all .2s }
.component-headlines.layout-snapview .slick-slider.slider-content .related-links a:hover,
.component-headlines.layout-snapview .slick-slider.slider-content .related-links a:focus-visible { filter: brightness(85%) }
.component-headlines.layout-snapview .slick-slider.slider-nav { position: absolute !important; left: 2rem; bottom: 1rem; width: 960px }
.component-headlines.layout-snapview .slick-slider.slider-nav .slick-slide { margin-inline: .5rem; width: 250px }
.component-headlines.layout-snapview .slick-slider.slider-nav .item { border-radius: .25rem; overflow: hidden; cursor: pointer }
.component-headlines.layout-snapview .slick-slider.slider-nav .item:before { content: ""; position: absolute; z-index: 1; left: 0; top: 0; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000 100%) }
.component-headlines.layout-snapview .slick-slider.slider-nav .date-category { position: absolute; z-index: 1; left: 0; bottom: 0; padding: 1rem; flex-direction: row-reverse !important }
.component-headlines.layout-snapview .slick-arrow-controls { position: absolute; left: 50%; top: 0; transform: translateX(-50%); display: flex; z-index: 2 }
.component-headlines.layout-snapview .slick-arrow-controls .slick-arrow { position: static; display: flex; align-items: center; justify-content: center; width: 3rem; height: 3rem !important; transform: none; padding: 0; margin: 0; font-size: .875rem; text-decoration: none; color: #fff; background-color: rgba(0,0,0,0.25); border: 1px solid rgba(255,255,255,0.25); border-radius: 0 }
.component-headlines.layout-snapview .slick-arrow-controls .slick-arrow.slick-prev { border-width: 1px 0 1px 1px; border-radius: .25rem 0 0 .25rem }
.component-headlines.layout-snapview .slick-arrow-controls .slick-arrow.slick-next { order: 1; border-width: 1px 1px 1px 0; border-radius: 0 .25rem .25rem 0 }
.component-headlines.layout-snapview .slick-arrow-controls .slick-arrow.slick-pp { border-width: 1px 0 }
.component-headlines.layout-snapview .slick-arrow-controls .slick-arrow:hover,
.component-headlines.layout-snapview .slick-arrow-controls .slick-arrow:focus-visible { background-color: var(--bs-primary) }

@media only screen and (min-width:992px) {
    .component-headlines.layout-snapview .slick-slider.slider-content .article-details { left: auto; right: 0; max-width: 800px; padding: 0 3rem 0 0; align-items: flex-end }
    .component-headlines.layout-snapview .slick-slider.slider-content .article-details .date-category { width: 100% !important }
    .component-headlines.layout-snapview .slick-slider.slider-content .article-details .card-title { text-align: right }
    .component-headlines.layout-snapview .slick-slider.slider-content .boxscores .brief-stats .gamebox .score { border-right: 1px solid #fff }
    .component-headlines.layout-snapview .slick-slider.slider-content .boxscores .brief-stats .gamebox .scorebox div ~ div .score { border-left: 1px solid #fff; border-right: 0 }
    .component-headlines.layout-snapview .slick-slider.slider-content .boxscores .brief-stats .gamebox .vh-icon-container { position: static; transform: none !important; display: flex !important; align-items: center }
    .component-headlines.layout-snapview .slick-slider.slider-content .boxscores .nav { justify-content: flex-end }
    .component-headlines.layout-snapview .slick-slider.slider-content .related-links { flex-wrap: nowrap }
    .component-headlines.layout-snapview .slick-arrow-controls { left: 2rem; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; z-index: 2 }
    .component-headlines.layout-snapview .slick-arrow-controls .slick-arrow.slick-prev { border-width: 1px 1px 0; border-radius: .25rem .25rem 0 0 }
    .component-headlines.layout-snapview .slick-arrow-controls .slick-arrow.slick-next { order: 1; border-width: 0 1px 1px; border-radius: 0 0 .25rem .25rem }
    .component-headlines.layout-snapview .slick-arrow-controls .slick-arrow.slick-pp { border-width: 0 1px }
}

@media only screen and (min-width:1200px) {
    .component-headlines.layout-snapview .slick-slider.slider-content .article-details { bottom: 16rem; max-width: 960px }
    .component-headlines.layout-snapview .slick-slider.slider-nav { bottom: 2rem; left: auto; right: 0 }
    .component-headlines.layout-snapview .slick-slider.slider-nav .slick-slide { width: 336px }
}