@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100..900&display=swap');

:root {
    --body-font-family: 'Montserrat', sans-serif;
    --bs-font-sans-serif: 'Montserrat', sans-serif;
    --bs-body-font-family: 'Montserrat', sans-serif;
    --heading-font-family: 'Montserrat', sans-serif;
}


a[href*="#site-navigation"],
a[href*="#site-main"],
a[href*="#site-footer"],
.section.sec-sponsors h2.visually-hidden { color:var(--bs-white)!important }
.section.sec-affiliates h2.visually-hidden { color:var(--bs-dark)!important } 


.sec-parallax .component-parallax .overlay::before { background-color: rgba(var(--bs-primary-rgb), .4) }

.section.sec-recent-videos .video-parallax .overlay.bg-secondary { --bs-bg-opacity:unset!important }

.sec-social-stream .social-widgets { margin-top:0; margin-bottom:0; padding-top:2rem}

.sec-social-stream .social-widgets .instagram-media  { min-width:100%!important }

.section.sec-recent-videos { min-height:600px; height:50vh; position:relative }
.section.sec-recent-videos .container-fluid {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        clip: rect(0, auto, auto, 0);
    }

.section.sec-recent-videos .video-parallax{
        position: fixed!important;
        bottom: 0;
        right: 0;
        top:0;
        height: auto;
        width: auto;
        min-height: 100%;
        min-width: 100%;
        /* z-index: -9999; */
    }



html body  { background-color:var(--bs-secondary); background-image:url(/assets/Texture_-Long_Beach_City_College-.png)!important; background-attachment:fixed; background-repeat:repeat; background-size:100% auto }

.title-bar,
.sec-top-stories,
.sec-top-stories-desktop,
.sec-schedule-tabs,
.sec-banner,
.sec-standings, html:not(.landing.site-home) main.site-main { background-color:transparent!important; background-image:none!important }


.sec-featured-athletes .component-aotw.layout-align .slick-slider button.slick-pp:hover,
.sec-featured-athletes .component-aotw.layout-align .slick-slider button.slick-arrow:hover,
.component-banner.layout-slider .slick-arrow-controls .slick-arrow:hover { background:var(--bs-white)}



.next-event-wrapper .details .sport { display:block; margin-left:0.75rem }


.site-footer { background:var(--bs-primary)!important }
.site-footer .copyright-privacy-links-section,
.site-footer .copyright-privacy-links-section a,
.site-footer .copyright-privacy-links-section span { color:var(--bs-primary)!important }

.site-footer .footer-details .fs-2.title { font-size:1.5rem!important }
.site-footer .footer-details-wrapper .component-banner.layout-flex { display:none!important }

.section.sec-sponsors { background:var(--bs-primary)}


    .sec-social-stream .item .social-widgets-wrap .social-embed-icon,
    .sec-featured-athletes .component-aotw.layout-align .player .headshot,
    .sec-featured-athletes .slick-slider .slick-list,
    .sec-featured-athletes,
    .sec-featured-athletes .component-aotw.layout-align .player:after,
    .sec-featured-athletes .component-aotw.layout-align .player .player-details:after,
    .sec-featured-athletes .component-aotw.layout-align .player .player-details:before { border-color:var(--bs-secondary)!important }

    .sec-featured-athletes .component-aotw.layout-align .player .player-details:before {  background-image:url(/assets/Secondary_Logo_-_1x.png); background-position:50% 50%; background-size:75% auto; transform:scale(1); background-color: transparent }
    .section.sec-recent-news { display:none!important }

.site-header .navbar-secondary .navbar-secondary-thumbnail { display:none!important }
.site-header .macro-secondary-navigation .component-navbar-secondary.layout-standard .navbar-nav > .nav-item:hover > .nav-link, 
.site-header .macro-secondary-navigation .component-navbar-secondary.layout-standard .navbar .navbar-nav .nav-link.active { background:var(--bs-primary)}

.sec-schedule-tabs .component-scoreboard.layout-small .slick-list,
.sec-schedule-tabs .component-scoreboard.layout-small .card,
.sec-schedule-tabs .component-scoreboard.layout-small .card .middle-inner,
.sec-schedule-tabs .component-tabs .page-details { border-color:var(--bs-secondary)!important }
.sec-schedule-tabs .component-tabs .page-details { background:transparent }
.sec-schedule-tabs .component-tabs .nav-pills .nav-link.active { background-color:var(--bs-secondary)}

.section.sec-affiliates { background:var(--bs-white)}

.site-footer a:hover,
.site-footer a:focus { color:var(--bs-secondary)!important }

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

    .sec-featured-athletes .component-aotw.layout-align .player { border-bottom:6px solid var(--bs-secondary)!important }
    .site-header { border:none }
    .site-header .macro-primary-navigation .component-navbar-split.layout-standard .navbar .megamenu .megamenu-inner ul[data-mega="true"] > .nav-item > .dropdown-toggle, 
    .site-header .macro-primary-navigation .component-navbar-split.layout-standard .navbar .nav-item.parent > .nav-link, 
    .site-header .macro-primary-navigation .component-navbar-split.layout-standard .navbar .nav-item.parent > .nav-link > span > a.nav-link { font-size:1rem; font-weight:500}
    .site-header .macro-primary-navigation .component-navbar-split.layout-standard .navbar .nav-item.parent > .nav-link, 
    .site-header .macro-primary-navigation .component-navbar-split.layout-standard .navbar .nav-item.parent > .nav-link > span > a.nav-link { padding-left:0.75rem; padding-right:0.75rem}
    .component-navbar-split.layout-standard ul.navbar-nav.top-level:last-of-type .nav-item:last-of-type .dropdown-menu { right:0!important; left:auto!important }
    
    .site-header:not(.is-pinned) .macro-primary-navigation .component-navbar-split.layout-standard .navbar .navbar-brand-centered img { max-height:6rem; top:-1.8rem }
    .site-header.is-pinned .macro-primary-navigation .component-navbar-split.layout-standard .navbar .navbar-brand-centered img {  top:0 }
    .site-header .macro-primary-navigation .component-navbar-split.layout-standard .navbar .navbar-brand-centered { min-width:5rem }
    .title-bar .site-title { font-size:2rem; font-weight:600!important; padding-top:0.5rem; padding-bottom:1.45rem }
    .component-navbar-split.layout-standard .navbar .megamenu { padding:2rem }


    .sec-top-stories-desktop .component-headlines.layout-stacked-carousel .carousel-caption { background: var(--bs-secondary-rgb); background: linear-gradient(180deg, rgba(var(--bs-primary-rgb),0) 30%, rgba(var(--bs-primary-rgb),0.40) 50%, rgba(var(--bs-primary-rgb),0.95) 80%,rgba(var(--bs-primary-rgb),1) 95% ,rgba(var(--bs-primary-rgb),1) 100%) }
    
    .sec-top-stories-desktop .component-headlines.layout-stacked-carousel  { background:var(--bs-primary) }
    .sec-top-stories-desktop .component-headlines.layout-stacked-carousel .right-col .aside-carousel { background-color:var(--bs-primary)}
    .sec-top-stories-desktop .component-headlines.layout-stacked-carousel .aside-carousel .carousel-indicators .item:not(.active) .card:before{  background-color:rgba(var(--bs-primary-rgb),.6)  }
    .sec-top-stories-desktop .component-headlines.layout-stacked-carousel .aside-carousel .carousel-indicators .item.active { border-color:var(--bs-secondary)!important}


    .site-header .macro-primary-navigation .component-navbar-split.layout-standard .headers-icon-links .search { margin:0!important }

    .site-header .macro-primary-navigation .component-navbar-split.layout-standard .dropdown-menu a, 
    .site-header .macro-primary-navigation .component-navbar-split.layout-standard .navbar .nav-item.parent:hover > .nav-link, 
    .site-header .macro-primary-navigation .component-navbar-split.layout-standard .navbar .nav-item.parent:hover > .nav-link > span > a.nav-link { color:#fff }
    .site-header .macro-primary-navigation .component-navbar-split.layout-standard .navbar .megamenu .dropdown-menu-inner ul[data-flex=true] > li.nav-item:not(.brand-icon) > a:after { border-color:#fff }
    .site-header .macro-primary-navigation .component-navbar-split.layout-standard .dropdown-menu, .site-header .macro-primary-navigation .component-navbar-split.layout-standard .dropdown-menu ul { background:var(--bs-primary)!important}
    .component-navbar-split.layout-standard .navbar .megamenu .megamenu-inner ul[data-column="true"] > li > .dropdown-menu { justify-content:flex-start }
    .component-navbar-split.layout-standard .navbar .megamenu .megamenu-inner ul[data-mega="true"] > .nav-item > .dropdown-old-toggle { border-color:var(--bs-secondary) }
    .site-header .macro-primary-navigation .component-navbar-split.layout-standard .navbar .nav-item.parent:hover > .nav-link { background-color:var(--bs-secondary) }
    .site-header .macro-primary-navigation .component-navbar-split.layout-standard .dropdown-menu a:hover { text-decoration:underline!important } 

    .component-navbar-split.layout-standard ul.navbar-nav.top-level:first-of-type >li:nth-child(2) .dropdown-menu,
    .component-navbar-split.layout-standard ul.navbar-nav.top-level:first-of-type >li:nth-child(3) .dropdown-menu { column-count:2 }


     .sec-featured-athletes .component-aotw.layout-align .player .player-details:before { width:200px; left:0 }
    .site-header .macro-secondary-navigation .navbar-brand { font-size:1.5rem }

    /*
    .component-navbar-secondary div[data-module="theme-module/navbar-secondary"] { max-width:45%; }
*/
    
}

.sec-schedule-tabs .component-scoreboard.layout-small .card { color:var(--bs-primary)}    
    .sec-featured-athletes .component-title { border-color:var(--bs-secondary)}



@media only screen and (min-width:1200px) {
 
    .sec-featured-athletes .component-aotw.layout-align .player .player-details:before { width:250px; left:0 }


}
@media only screen and (min-width:1400px) {
 
    .sec-featured-athletes .component-aotw.layout-align .player .player-details:before { width:300px }


}

@media (max-width: 991px) {

    html.landing body { background-repeat:repeat }

.site-header .macro-primary-navigation { background:var(--bs-primary)!important }
.site-header .mobile-menu .navbar-offcanvas-template .offcanvas-header { background:var(--bs-secondary)}
.site-header .mobile-menu .navbar-offcanvas-template .offcanvas-body { background:var(--bs-primary)}
.navbar-offcanvas-template .accordion-button::after, .navbar-offcanvas-template .accordion-button:after,
.site-header .mobile-menu .navbar-offcanvas-template .accordion-flush .accordion-item .nav-link { color:var(--bs-white) }
.navbar-offcanvas-template .accordion-item { border-color:var(--bs-white)}

.slick-dots li button:before, .component-video.layout-slider .slick-dots button, .carousel-indicators [data-bs-target] { background-color:var(--bs-secondary)!important }
.slick-dots li.slick-active button:before, .component-video.layout-slider li.slick-active button, .carousel-indicators .active { background-color:var(--bs-white)!important }


}