.wp-block-media-text__media img{
  height: auto;
  max-width: unset;
  vertical-align: middle;
}
/*All pages*/
h2{
    font-size: 1.6669rem; 
    margin-top: 0;
    margin-bottom: .5rem;
    font-weight: 500;
    line-height: 1.2;
}

h3{
    font-size: 1.3331rem;
    line-height: 1.2;
}
h4{
    font-size:1.241rem;
}
h5{
    font-size:1.100rem;
}
h6{
    font-size:1.000rem;
}

/*John Deere Tech colors*/
.jd-callout-styling {
  display: flex;
  padding-left: 1.5rem;
  font-size: 150%;
  font-weight: 700;
  color: #51ba54;
  border-left:
5px solid #FBFE71;
}

section.jd-block-link-icon .bli_link:hover {
  border-color:
#FEE171;
}
section.jd-block-link-icon .bli_link {
  position: relative;
  display: grid;
  place-content:
center;
  border:
3px solid #51ba54;
    
    border-top-color: rgb(81, 186, 84);
    border-right-color: rgb(81, 186, 84);
    border-bottom-color: rgb(81, 186, 84);
    border-left-color: rgb(81, 186, 84);
  margin:
1rem 0;
  padding:
3rem 1rem 2rem;
  text-decoration:
none;
  transition:
border .2s ease-in-out;
}

.jd-links a{
    color:#327534;
}
.jd-links a:hover{
     color:#51ba54;
}
.jd-links-bold a{
    color:#327534;
    font-weight:bold;
}
.jd-links-bold a:hover{
     color:#51ba54;
    font-weight:bold;
}


/*
Page: News page (https://wwwtest.lakelandcollege.edu/news/)
Use: Make news thumbnail show next to title
*/
.news-article-result {
    display: flex;
    column-gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.5rem;

    & .news-result-content {
        flex-basis: 500px;
        flex-grow: 1;

        & p {
            margin: 0;
        }
    }
}

/*
Page: Laker Boxes page (CBI - https://wwwtest.lakelandcollege.edu/cbi-center-for-business-and-industry/)
Use: Make the grid container actually take full page width
*/
body .is-layout-flex:has(.Laker-Boxes) {
    display: block;
}

/*All pages. Add margin bottom between image and text on mobile*/
.wp-block-media-text{
   gap: 1rem;
}

.wp-block-media-text > .wp-block-media-text__content{
    padding:0;
}
/*All pages header image*/
section.upper-hero.inner-page {
  /*height: clamp(20vh,50vw,30vh);*/
  height: clamp(20vh,50vw,42vh);
}

/*
Page: All pages (Image Link Blocks)
Use: Make the height of the image bigger (160px)
*/
section.block-link-image .block-link-image__link {
    grid-template-rows: 160px 1fr;
}
section.block-link-image .block-link-image__title {
    background-color: #FFF;
}

/*
Page: John Deere Dealerships (http://cawebllc1/john-deere-tech/john-deere-dealerships/)
Use: Custom image block links to take out sub title and box shadow to only show images
*/
section.block-link-image.jd-dealerships .block-link-image__container {
    gap: 2rem;
    margin: 1.5rem 0 2.5rem;

    & .block-link-image__link {
        &:not(:hover) {
            box-shadow: rgba(0,0,0,.24) 0 1px 3px;
        }

        & .block-link-image__image {
            -o-object-fit: unset;
            object-fit: unset;
            -o-object-position: unset;
            object-position: unset;
            padding: 1rem;
        }

        & .block-link-image__title {
            display: none;
        }
    }
}

/*
Page: All pages (navigation bar)
Use: Fix cut off dropdown arrows on mobile dropdown
*/
header#wrapper-navbar section.primary-menu #main-menu>li.menu-item-has-children>a::after, header#wrapper-navbar section.primary-menu #main-menu>li.menu-item-has-children>a::before {
    left: -1px;
}
header#wrapper-navbar section.primary-menu #main-menu>li.menu-item-has-children>a {
    padding-left: calc(1em + 2px);
}

/*
Page: All pages (navigation bar)
Use: Apply now button on mobile
*/
.mobile-button-group {
    display: none;
    gap: 0.5rem;
    justify-content: center;
    align-items: center;
    margin: auto;
}

/*
Page: Schedules (http://cawebllc1/schedules/)
Use: Format the schedules photos differently in image links
*/
section.block-link-image.schedules-image-buttons .block-link-image__link {
    background-color: #0000000d;
    grid-template-rows: 220px 1fr;
}
section.block-link-image.schedules-image-buttons .block-link-image__title {
    background-color: #ffffff;
}
section.block-link-image.schedules-image-buttons .block-link-image__image {
    height: 90%;
    width: auto;
    margin: auto;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
}

/*
Page: All pages (navigation bar)
Use: search input for site
*/
.search-input-container {
    display: flex;
    justify-content: flex-end;
}
.search-input-container .nav-search-input {
    width: 0px;
    padding: 0;
    border: 2px solid #000000; 
    border-right: none;

    &:not(.no-transition) {
        transition: width 0.2s ease-in-out;
    }
}
.search-input-container .nav-search-input.footer-input {
    border-color: #ffffff !important;
    background-color: #343434;
    color: white;
    height: 35.8px;
    position: relative;
    top: 1px;
}
.search-input-container .nav-search-input.open {
    width: min(200px, calc(100% - 3rem));
    padding: 0.35rem;
}
.search-input-container .nav-search-input.no-border-left {
    border-left: none;
}

/*
Page: All pages with a header image
Use: Position header image differently than default
*/
section.upper-hero .upper-hero_background-image.align-top {
    background-position: top;
}
section.upper-hero .upper-hero_background-image.align-bottom {
    background-position: bottom;
}


/*
Page: No wrap layout pages
Use: Will not wrap text below side menu 
*/
.no-wrap-content-container {
    display: flex;
    width: 100%;
    align-items: start;
}
.no-wrap-content-container .no-wrap-content {
    width: calc(67% - 4rem);
}

/*
Page: All pages with a sidebar
Use: Fixing styling on mobile menu (replacing dropdown arrow with "MENU" and wrapping menu under breadcrumbs if needed) 
*/
.sidebar-menu-dropdown {
    display: none;
}
/*
Use: Menu link hover effect and active link red as well
*/
#left-sidebar a {
    transition: 0.2s;
}
#left-sidebar a:hover, #left-sidebar li.current_page_item a {
    color: #be2026 !important;
}

/*
Page: All pages
Use: Fixing active menu links background color (other stylesheets have a background for .active) 
*/
.menu-item.active {
    background: unset !important;
}

/*
Use: Secondary menu link has children change to arrow instead of triangle
*/
#page-wrapper #left-sidebar ul .menu-item-has-children>a {
    padding-right: 1.2rem;
}
#page-wrapper #left-sidebar ul .menu-item-has-children>a::after, #page-wrapper #left-sidebar ul .menu-item-has-children>a::before {
    content: "";
    position: absolute;
    right: 0.3rem;
    top: calc(50% - 1px);
    height: 2px;
    width: 10px;
    background: #be2026;
    transform-origin: center;
    transition: transform .4s cubic-bezier(.16, 1, .3, 1);
    transform: rotate(55deg);
    margin-left: auto;
    clip-path: unset;
}
#page-wrapper #left-sidebar ul .menu-item-has-children>a::after {
    transform: translateX(5.7357643635px) rotate(-55deg);
}
#page-wrapper #left-sidebar ul .menu-item-has-children.expanded>a::after {
    transform: translateX(3.5355339059px) rotate(-45deg);
}
#page-wrapper #left-sidebar ul .menu-item-has-children.expanded>a::before {
    transform: translateX(3.5355339059px) rotate(45deg);
}

/*
Page: All pages
Use: Fixing styling on mobile eyebrow menu (black top bar )
*/
.eyebrow-menu .d-xl-block {
    display: block !important;
}
.eyebrow-menu .d-flex {
    column-gap: 0.6rem;
}

/*
Page: All pages
Use: Fixing bottom footer columns so search bar doesn't overlap on smaller screens
*/
footer#site-footer .top-section {
    grid-template-columns: 1fr 1fr auto 1fr;
}

/*
Page: Any page
Class Name: llc-no-cards (add to carousel block)
Use: Takes away gray background and card-like structure from carousel and fixes spacing
*/
section.slick-carousel.llc-no-cards {
    gap: 0;
}
section.slick-carousel.llc-no-cards .carousel-slide-container {
    min-height: 0;
    height: auto;
    box-shadow: none;
    grid-template-rows: auto;
}
section.slick-carousel.llc-no-cards .carousel-slide_image {
    background-size: contain;
    background-repeat: no-repeat;
    height: 5rem;
}
section.slick-carousel.llc-no-cards .carousel-slide_content {
    align-items: center;
    padding: 1.5rem 2rem 0;
}
section.slick-carousel.llc-no-cards .carousel-slide_content p {
    margin-bottom: 0;
    text-align: center;
}

/*
Page: Any page
Class Name: llc-no-background (add to carousel block)
Use: Removes gray background from carousel
*/
section.slick-carousel.llc-no-background::before {
    content: unset;
    position: static;
}

/*
Page: Any page
Class Name: llc-image-only (add to carousel block)
Use: If carousel only has images, this removes the height and padding from the text block
*/
section.slick-carousel.llc-image-only .carousel-slide_content {
    padding: 0;
}

/*
Page: Any page
Class Name: llc-image-contain (add to carousel block)
Use: Set image in carousel block to be contained instead of covering the whole image area
*/
section.slick-carousel.llc-image-full-height .carousel-slide_image {
    background-size: auto 100%;
    background-repeat: no-repeat;
}
section.slick-carousel.llc-image-full-height .carousel-slide:has(.background-image-cover) .carousel-slide_image {
    background-size: cover;
}

/*
Page: Any page
Class Name: llc-image-center (add to carousel block)
Use: Set image in carousel block to be center instead of top
*/
section.slick-carousel.llc-image-center .carousel-slide_image {
    background-position: center;
}

/*
Page: Any page
Class Name: llc-stats (add to carousel block)
Use: Makes images bigger in carousel for LLC stats
*/
section.slick-carousel.llc-stats .carousel-slide_image {
    height: 10rem;
}

/*
Page: Jobs at LLC (http://cawebllc1/human-resources/recruit/)
Class Name: jobs-at-llc-stats (add to carousel block)
Use: Make images bigger in carousel
*/
section.slick-carousel.jobs-at-llc-stats .carousel-slide_image {
    height: 12rem;
}

/*
Page: Student Activity Board (http://cawebllc1/get-involved/student-activity-board/)
Class Name: sab-llc-events (add to carousel block)
Use: Make images bigger in carousel
*/
section.slick-carousel.sab-llc-events .carousel-slide_image {
    height: 12rem;
    background-size:cover;
}


/*
Page: Future Student (https://cawebllc1/future-student)
Element: Three columns at top of page with buttons at the bottom of each
*/
.wp-block-columns.i-am-a-columns {
    flex-wrap: wrap !important;
    justify-content: center;
    margin-bottom: 2.5rem;
    row-gap: 3.5rem;
}
.wp-block-columns.i-am-a-columns .wp-block-column {
    position: relative;
    padding-bottom: 2.5rem;
    flex-basis: min(350px, 100%);
}
.wp-block-columns.i-am-a-columns .wp-block-column .wp-block-buttons {
    position: absolute;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
}
.wp-block-columns.i-am-a-columns .wp-block-column .wp-block-image {
    height: 270px;
}
.wp-block-columns.i-am-a-columns .wp-block-column .wp-block-image img {
    min-height: 100%;
}
/*
****** These three pieces of CSS are also for the llc-image-zoom class where the image zooms on link hover ******
Page: Any page
Use: Apply the "llc-image-zoom" class to an image and it will zoom in on hover (created to be used on images that are also links)
Note: Image must take up 100% of figure or else the figure will grow as well
*/
.wp-block-image.llc-image-zoom, .wp-block-columns.i-am-a-columns .wp-block-column .wp-block-image {
    overflow: hidden;
}
.wp-block-image.llc-image-zoom img, .wp-block-columns.i-am-a-columns .wp-block-column .wp-block-image img {
    margin-bottom: 0;
    transition: 0.5s;
}
.wp-block-image.llc-image-zoom:hover img, .wp-block-columns.i-am-a-columns .wp-block-column .wp-block-image:hover img {
    transform: scale(1.1);
}

/*
Page: Future Student (https://cawebllc1/future-student)
Element: Steps 1-7 rows and columns at the bottom of the page
*/
.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column.i-am-a-steps {
    display: flex;
    flex-direction: column;
    gap: 3.5rem;
    margin: 2rem auto 4rem;
    flex-basis: min(800px, 100%);
    flex-grow: 0;
}
.wp-block-column.i-am-a-steps > .wp-block-columns > .wp-block-column {
    display: flex;
    flex-wrap: wrap;
    row-gap: 1rem;
    align-items: flex-start;
}
.wp-block-column.i-am-a-steps > .wp-block-columns > .wp-block-column > .wp-block-columns:first-child {
    flex-basis: 100%;
    display: flex;
    justify-content: center;
}
.wp-block-column.i-am-a-steps > .wp-block-columns > .wp-block-column > .wp-block-columns:first-child .wp-block-column {
    display: flex;
    justify-content: center;
    position: relative;
}
.wp-block-column.i-am-a-steps > .wp-block-columns > .wp-block-column > .wp-block-columns:first-child .wp-block-column:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 2px;
    border-radius: 50px;
    background-color: #be2026;
    z-index: -1;
}
.wp-block-column.i-am-a-steps .wp-block-column h3 {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin: auto;
    width: 6rem;
    height: 6rem;
    padding: 0;
    color: white;
    background-color: white;
    border: 4px solid white;
    font-weight: bold;
    text-shadow: 
        -0.7px -0.7px 0 #BE2026,  
         0.7px -0.7px 0 #BE2026,
        -0.7px  0.7px 0 #BE2026,
         0.7px  0.7px 0 #BE2026;
    position: relative;
    z-index: 1;
    overflow: hidden;

    &::before {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        background-image: url(/wp-content/uploads/2025/03/Duck-Print-png.webp);
        background-color: white;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat; 
        z-index: -1; 
        opacity: 0.8;
    }
}
.wp-block-column.i-am-a-steps > .wp-block-columns:nth-child(even) h4::before {
    transform: rotate(20deg);
    right: 5px;
}

.wp-block-column.i-am-a-steps .wp-block-column .wp-block-columns {
    flex-basis: min(540px, 100%);
    flex-grow: 1;
}
.wp-block-column.i-am-a-steps .wp-block-column .wp-block-columns p.no-button-after {
    margin-bottom: 0;
}

/*
Page: Parent/Family (http://cawebllc1/parent-family/)
Element: Know Where to Go columns for map and virtual tour
*/
.wp-block-columns.parent-where-to-go-columns > .wp-block-column {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    flex-basis: min(500px, 100%);
    padding-bottom: 2.5rem;
    position: relative;
}
.wp-block-columns.parent-where-to-go-columns > .wp-block-column :is(figure, img) {
    margin-bottom: 0;
}
.wp-block-columns.parent-where-to-go-columns > .wp-block-column figure {
    overflow: hidden;
    height: 230px;
    position: relative;
}
.wp-block-columns.parent-where-to-go-columns > .wp-block-column img {
    width: auto;
    max-width: none !important;
    min-height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
.wp-block-columns.parent-where-to-go-columns > .wp-block-column:last-of-type img {
    top: 60%;
}
.wp-block-columns.parent-where-to-go-columns > .wp-block-column .wp-block-buttons {
    position: absolute;
    bottom: 0px;
    left: 0;
    white-space: nowrap;
}

/*
Page: Can be used on any page
Use: Puts a gray background, full-width, behind the element - similar to the Student Success Stories block on the home page
*/
.llc-gray-background::before {
    content: "";
    position: absolute;
    margin: 0 calc(50% - 50vw);
    inset: 0;
    background: #e8e9eb;
    mix-blend-mode: multiply;
    z-index: -1;
}
.llc-gray-background {
    position: relative;
    padding: 2rem 0 1rem;
    margin-bottom: 0;
}

/*
Page: Can be used on any page
Use: Takes away bottom margin for an image
*/
figure.wp-block-image.llc-image-no-margin-bottom img {
    margin-bottom: 0;
}

/*
Page: Can be used on any page
Class Name: llc-duck-foot-separator (add to a separator/hr element)
Use: Adds a duck foot to the center of the line
*/
hr.wp-block-separator.llc-duck-foot-separator {
    position: relative;
    border: none;
    height: 4rem;
    opacity: 0.4;
}
hr.wp-block-separator.llc-duck-foot-separator::after {
    content: "";
    background-image: url(/wp-content/uploads/2025/03/Duck-Print-png.webp);
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background-color: white;
    background-size: 90% auto;
    background-position: center;
    background-repeat: no-repeat;
    padding: 0 6px;
    width: 5rem;
    height: 5rem;
}
hr.wp-block-separator.llc-duck-foot-separator::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 1.5px;
    background-color: #212529;
}


figure.wp-block-image.llc-about-us-tree {
    clear: none;
    max-width: 85%;
}

/*
Page: Can be used on any page
Class Name: llc-john-deere-separator (add to a separator/hr element)
Use: Adds a green tractor to the center of the line
*/
hr.wp-block-separator.llc-john-deere-separator {
    position: relative;
    border: none;
    height: 4rem;
    opacity: 0.4;
}
hr.wp-block-separator.llc-john-deere-separator::after {
    content: "";
    background-image: url(/wp-content/uploads/2025/05/JD_Tractor-002.webp);
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background-color: white;
    background-size: 90% auto;
    background-position: center;
    background-repeat: no-repeat;
    padding: 0 6px;
    width: 5rem;
    height: 5rem;
}
hr.wp-block-separator.llc-john-deere-separator::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 1.5px;
    background-color: #212529;
}

figure.wp-block-image.llc-about-us-tree {
    clear: none;
    max-width: 85%;
}

/*
Page: Can be used on any page
Class Name: dual-credit-separator (add to a separator/hr element)
Use: Adds a grad cap logo to the center of the line
*/
hr.wp-block-separator.dual-credit-separator {
    position: relative;
    border: none;
    height: 4rem;
    opacity: 0.4;
}
hr.wp-block-separator.dual-credit-separator::after {
    content: "";
    background-image: url(/wp-content/uploads/2025/07/dual_credit_logo.webp);
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background-color: white;
    background-size: 90% auto;
    background-position: center;
    background-repeat: no-repeat;
    padding: 0 6px;
    width: 5rem;
    height: 5rem;
}
hr.wp-block-separator.dual-credit-separator::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 1.5px;
    background-color: #212529;
}


figure.wp-block-image.llc-about-us-tree {
    clear: none;
    max-width: 85%;
}

/*
/*
Page: About Us (http://cawebllc1/about-us/)
Class Name: llc-about-us-boxes
Use: Resizing and reorganizing the button link grid
*/
section.block-link-image.llc-about-us-boxes .block-link-image__container {
    grid-template-columns: repeat(auto-fit, minmax(min(275px, 100%), 1fr));
}
section.block-link-image.llc-about-us-boxes .block-link-image__title {
    font-size: 1rem;
    padding: 0.5rem 1rem;
}
section.block-link-image.llc-about-us-boxes .block-link-image__link {
    grid-template-rows: 150px 1fr;
}

/*
Page: Future Student (https://cawebllc1/future-student)
Element: Three columns at top of page with buttons at the bottom of each
*/
@media (max-width: 1400px) {
    .wp-block-columns.i-am-a-columns .wp-block-column .wp-block-image {
        height: 233px;
    }    
}
@media (max-width: 1200px) {
    .wp-block-columns.i-am-a-columns .wp-block-column {
        flex-grow: 0;
    }

    /*
    Page: All pages (navigation bar)
    Use: Apply now button on mobile
    */
    .apply-now-button {
        display: inline-block !important;
    }
}
/*
Page: All pages
Use: Fixing bottom footer columns so search bar doesn't overlap on smaller screens
*/
@media (max-width: 1199.98px) {
    footer#site-footer .top-section {
        grid-template-columns: 1fr;
    }
    .search-input-container.footer-search-container {
        justify-content: flex-start;
    }
}

@media (max-width: 991.98px) {
    /*
    Page: I am a Future Student (http://cawebllc1/future-student/)
    Use: Top section needs to go full-width sooner than set up
    */
    .wp-block-columns.i-am-a-future-student-top-section:not(.is-not-stacked-on-mobile)>.wp-block-column {
        flex-basis: 100% !important;
    }
    .wp-block-columns.i-am-a-future-student-top-section:not(.is-not-stacked-on-mobile)>.wp-block-column.i-am-a-future-student-video {
        flex-basis: min(500px, 100%) !important;
    }
    .wp-block-columns.i-am-a-future-student-top-section {
        flex-wrap: wrap-reverse !important;
        justify-content: center;
    }

    /*
    Page: No wrap layout pages
    Use: Will not wrap text below side menu 
    */
    .no-wrap-content-container {
        display: contents;
    }
    .no-wrap-content-container .no-wrap-content {
        width: auto;
    }
    
    /*
    Page: I am a Community Member (http://cawebllc1/community-member/)
    Element: Learn, Create, and Grow columns at bottom of page
    Class Name: i-am-a-business-community-columns
    Use: Make format into one column and reverse order to put image before text on smaller screen size
    */
    .wp-block-columns.i-am-a-business-community-columns {
        flex-direction: column-reverse;
        row-gap: 0.3rem;
    }

    /*
    Page: Future Student (https://cawebllc1/future-student)
    Element: Three columns at top of page with buttons at the bottom of each
    */
    .wp-block-columns.i-am-a-columns .wp-block-column .wp-block-image {
        height: auto;
    }    

    /*
    Page: Future Student (https://cawebllc1/future-student)
    Element: Three columns at top of page with buttons at the bottom of each
    */
    .wp-block-columns.i-am-a-columns .wp-block-column {
        flex-basis: 100%;
    }
    .wp-block-columns.i-am-a-columns .wp-block-column {
        padding-bottom: 0;
    }    
    .wp-block-columns.i-am-a-columns .wp-block-column .wp-block-buttons {
        position: static;
        bottom: 0px;
        left: 0;
        transform: translateX(0);
        white-space: normal;
    }
    
    /*
    Page: Future Student (https://cawebllc1/future-student)
    Element: Steps 1-7 rows and columns at the bottom of the page
    */
    .wp-block-column.i-am-a-steps .wp-block-group {
        flex-wrap: wrap;
    }

    /*
    Page: All pages with a sidebar
    Use: Fixing styling on mobile menu (replacing dropdown arrow with "MENU" and wrapping menu under breadcrumbs if needed) 
    */
    #page-wrapper .breadcrumbs {
        display: flex;
        justify-content: end;
        flex-wrap: wrap;
        column-gap: calc(1.5rem + 10px);
        row-gap: 0.7rem;
        align-items: center;
        margin-bottom: 1rem;
        padding: 2rem 0;
    }
    #page-wrapper .breadcrumbs:has(+ .widget-area.active, + .no-wrap-content-container .widget-area.active) .sidebar-menu-label::before {
        transform: translateX(3.5355339059px) rotate(45deg);
    }
    #page-wrapper .breadcrumbs:has(+ .widget-area.active, + .no-wrap-content-container .widget-area.active) .sidebar-menu-label::after {
        transform: translateX(3.5355339059px) rotate(-45deg);
    }
    #page-wrapper #breadcrumbs {
        flex-grow: 1;
        min-width: calc(100% - 89px - 0.7rem);
        padding: 0;
        margin-bottom: 0;
    }
    #page-wrapper #breadcrumbs::after, #page-wrapper #breadcrumbs::before {
        content: "";
        position: static;
        right: unset;
        top: unset;
        height: unset;
        width: unset;
        background: unset;
        transform-origin: unset;
        transition: unset;
        transform: unset;
    }
    .sidebar-menu-dropdown {
        display: flex;
        gap: 0.2rem;
        align-items: center;
        cursor: pointer;
        flex-grow: 1;
        justify-content: center;
    }
    .sidebar-menu-label {
        text-transform: uppercase;
        font-size: 0.9rem;
        color: #be2026;
        pointer-events: none;
        padding-right: 24px;
        position: relative;
    }
    .sidebar-menu-label::before, .sidebar-menu-label::after {
        content: "";
        pointer-events: none;
        position: absolute;
        right: 10px;
        top: calc(50% - 2px);
        height: 2px;
        width: 10px;
        background: #be2026;
        transform-origin: center;
        transition: transform .4s cubic-bezier(.16, 1, .3, 1);
        transform: rotate(55deg);
    }
    .sidebar-menu-label::after {
        transform: translateX(5.7357643635px) rotate(-55deg);
    }
    #page-wrapper .breadcrumbs:has(+ .widget-area.active) {
        margin-bottom: 1rem;
    }
}

@media (max-width: 767px) {
    /*
    Page: All pages (navigation bar)
    Use: Apply now button on mobile
    */
    .navbar-brand {
        margin-right: 0;
        width: 170px;
    }
    .navbar-buttons {
        column-gap: 2rem;
        row-gap: 1rem;
        flex-wrap: nowrap !important;

        &:has(.navbar-toggler[aria-expanded="true"]) .search-input-container {
            display: none;
        }
    }
    
    .mobile-button-group {
        display: flex;
        
        & a {
            color: #fff !important;
            font-weight: 900 !important;
            padding: 0.375rem 0.75rem !important;
        }
    }
    
    .search-input-container .nav-search-input {
        width: min(200px, calc(100% - 3rem));
        padding: 0.35rem;
        border-left: 2px solid #000000 !important; 
    }

    .search-input-container:has(.search-button.primary-search) .nav-search-input {
        width: 0;
        padding: 0;
        transition: none;
        border-left: none !important;
    }

    /*
    Page: All pages
    Use: Fixing styling on mobile eyebrow menu (black top bar )
    */
    header#wrapper-navbar section.eyebrow-menu ul.menu {
        font-size: 0.7rem;
        column-gap: 1rem;
        row-gap: 0.5rem;
        flex-wrap: wrap;
    }
    /* Foundation Link does not need to be shown on mobile */
    .menu-item.foundation-eyebrow-link {
        display: none;
    }

    /*
    Page: About Us (http://cawebllc1/about-us/)
    Class Name: llc-about-us-boxes
    Use: Resizing and reorganizing the button link grid
    */
    section.block-link-image.llc-about-us-boxes .block-link-image__link {
        grid-template-rows: 200px 1fr;
    }    
}

@media (max-width: 600px) {
    .pagination .page-item:is(.active, :has(.prev)) ~ .page-item:not(.active, .first, .last, :has(.next)) {
        display: none;
    }
    .pagination .page-item.first::after, .pagination .page-item.last::before {
        content: "...";
        display: flex;
        align-items: center;
        padding: 0.375rem 0.75rem;
        color: #6c757d;
        background: #fff;
        border: 1px solid #dee2e6;
    }
    .pagination .page-item:is(.first, .last) {
        display: flex;
        align-items: center;
    }
    .pagination .page-item.active + .page-item.last::before {
        content: '';
        display: none;
    }
    .pagination .page-item.last:has(+ .page-item.active)::before {
        content: '';
        display: none;
    }
    .pagination .page-item.active + .page-item.first::after {
        content: '';
        display: none;
    }
    .pagination .page-item.first:has(+ .page-item.active)::after {
        content: '';
        display: none;
    }
}

@media (max-width: 520px) {
    .navbar-buttons {
        flex-wrap: wrap !important;
    }
}

@media (max-width: 452px) {
    .apply-now-button {
        display: none !important;
    }
    
    .mobile-apply-now-button {
        display: block !important;
        white-space: nowrap;
    }
}

@media (max-width: 335px) {
    .navbar-buttons {
        flex-direction: column;
    }

    .menu-buttons-container {
        margin-left: 0 !important;
    }
}