.bottom-row {
    background: url(https://www.sterlingsafetywear.co.uk/static/version1722439604/frontend/ISH/sterling/en_GB/images/shopsection-bg.png);
    background-size: cover;
    background-position: bottom;
    min-height: 196px;
    margin: .25rem 0 0;
    padding: 2rem;
    display: flex;
    align-items: flex-start;
    flex-direction:column;
}

.yellow-button {
    text-decoration: none;
    background-image: none;
    background: #ffeb00;
    border: 1px solid #ffeb00;
    color: #2b2c2c;
    cursor: pointer;
    display: inline-block;
    font-family: 'NeusaNextStd-Condensed', 'NeusaNextStd', 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-weight: 700;
    font-size: 1.5rem;
    box-sizing: border-box;
    vertical-align: middle;
    text-transform: uppercase;
    text-align: center;
    width: 170px;
    padding: 3px 0 0;
}
p.big-text {
    font-family: 'NeusaNextStd-Compact', 'NeusaNextStd', 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 3.5rem;
    font-weight: 700;
    color: #fff;
}
.left-brand {
    color: #fff;
    background: url(https://www.sterlingsafetywear.co.uk/static/version1722439604/frontend/ISH/sterling/en_GB/images/bg-herobrand-left.png);
    background-size: cover;
    background-position: top left;
    margin-bottom: 0.25rem;
    height: 28rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 49.5%;
    margin: 0 auto;
}
.right-brand {
    color: #fff;
    background: url(https://www.sterlingsafetywear.co.uk/static/version1722439604/frontend/ISH/sterling/en_GB/images/bg-herobrand-right.png);
    background-size: cover;
    background-position: top left;
    margin-bottom: 0.25rem;
    height: 28rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width:49.5%;
    margin: 0 auto;
}
.brand-content{
    padding:4rem;

}
.brands-wrapper {
    display: flex;
    flex-direction: row;
    background-color: rgba(var(--bs-dark-rgb), var(--bs-bg-opacity)) !important;
    color: white;
    justify-content: space-around;
}
.content-container {
    background: url(https://www.sterlingsafetywear.co.uk/static/version1722439604/frontend/ISH/sterling/en_GB/images/content-bg.png);
    padding: 2.5rem 0 0;
    font-size: 1.8rem;
    font-weight: 500;
}
.column.main {
    padding-bottom: 2rem;
}
.columns {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    box-sizing: border-box;
}
.content-container h1 {
    font-size: 1.4rem;
    font-weight: 800;
    line-height: 2rem;
    text-transform: uppercase;
    margin: 2rem 0 1rem 0;
    font-family: 'NeusaNextStd-Compact', 'NeusaNextStd', 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
.content-container p {
    font-size: 1rem;
    font-weight: 600;
    font-family: 'NeusaNextStd-Compact', 'NeusaNextStd', 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
@media (min-width: 769px), print {
    .columns {
        display: block;
    }
}
@media (max-width: 768px) {
    .left-brand, .right-brand {
        width: 100%;
        margin-bottom: 0.25rem;
    }

    .displaynone {
        display: none !important;
    }

    .navbar-dark .navbar-nav .nav-link {
        position: relative;
        color: yellow;
        font-size: 1.6rem;
    }

    nav a:hover {
        color: !important;
       
    }

    nav a::before {
        content: '';
        display: block;
        height: 5px;
        background-color: white;
        position: absolute;
        top: 0;
        width: 0%;
        transition: all ease-in-out 250ms;
    }

    nav a:hover::before {
        width: 100%;
    }


    html {
        font-size: 62.5%;
    }

    body {
        font-family: 'Open Sans', sans-serif;
        font-size: 1.6rem;
        font-weight: 400;
    }

    h1 {
        margin-bottom: 0.5em;
        font-size: 3.6rem;
    }

    p {
        margin-bottom: 0.5em;
        font-size: 1.6rem;
        line-height: 1.6;
    }

    .button {
        display: inline-block;
        margin-top: 20px;
        padding: 8px 25px;
        border-radius: 4px;
    }

    .button-primary {
        position: relative;
        background-color: #c0ca33;
        color: #fff;
        font-size: 1.8rem;
        font-weight: 700;
        transition: color 0.3s ease-in;
        z-index: 1;
    }

        .button-primary:hover {
            color: #c0ca33;
            text-decoration: none;
        }

        .button-primary::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            top: 0;
            background-color: #fff;
            border-radius: 4px;
            opacity: 0;
            -webkit-transform: scaleX(0.8);
            -ms-transform: scaleX(0.8);
            transform: scaleX(0.8);
            transition: all 0.3s ease-in;
            z-index: -1;
        }

        .button-primary:hover::after {
            opacity: 1;
            -webkit-transform: scaleX(1);
            -ms-transform: scaleX(1);
            transform: scaleX(1);
        }

    .overlay::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        top: 0;
        background-color: rgba(0, 0, 0, .3);
    }

    .header-area {
        position: relative;
        height: 100vh;
        background: #5bc0de;
        background-attachment: fixed;
        background-position: center center;
        background-repeat: no-repear;
        background-size: cover;
    }

    .banner {
        display: flex;
        align-items: center;
        position: relative;
        height: 100%;
        color: #fff;
        text-align: center;
        z-index: 1;
    }

        .banner h1 {
            font-weight: 800;
        }

        .banner p {
            font-weight: 700;
        }

    .navbar {
        position: absolute;
        left: 0;
        top: 0;
        padding: 0;
        width: 100%;
        transition: background 0.6s ease-in;
        z-index: 99999;
    }

        .navbar .navbar-brand {
            font-family: 'Lobster', cursive;
            font-size: 2.5rem;
        }

        .navbar .navbar-toggler {
            position: relative;
            height: 50px;
            width: 50px;
            border: none;
            cursor: pointer;
            outline: none;
        }

            .navbar .navbar-toggler .menu-icon-bar {
                position: absolute;
                left: 15px;
                right: 15px;
                height: 2px;
                background-color: yellow;
                opacity: 0;
                -webkit-transform: translateY(-1px);
                -ms-transform: translateY(-1px);
                transform: translateY(-1px);
                transition: all 0.3s ease-in;
            }

                .navbar .navbar-toggler .menu-icon-bar:first-child {
                    opacity: 1;
                    -webkit-transform: translateY(-1px) rotate(45deg);
                    -ms-sform: translateY(-1px) rotate(45deg);
                    transform: translateY(-1px) rotate(45deg);
                }

                .navbar .navbar-toggler .menu-icon-bar:last-child {
                    opacity: 1;
                    -webkit-transform: translateY(-1px) rotate(135deg);
                    -ms-sform: translateY(-1px) rotate(135deg);
                    transform: translateY(-1px) rotate(135deg);
                }

            .navbar .navbar-toggler.collapsed .menu-icon-bar {
                opacity: 1;
            }

                .navbar .navbar-toggler.collapsed .menu-icon-bar:first-child {
                    -webkit-transform: translateY(-7px) rotate(0);
                    -ms-sform: translateY(-7px) rotate(0);
                    transform: translateY(-7px) rotate(0);
                }

                .navbar .navbar-toggler.collapsed .menu-icon-bar:last-child {
                    -webkit-transform: translateY(5px) rotate(0);
                    -ms-sform: translateY(5px) rotate(0);
                    transform: translateY(5px) rotate(0);
                }

    .navbar-dark .navbar-nav .nav-link {
        position: relative;
        color: #fff;
        font-size: 1.6rem;
    }

        .navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
            color: #fff;
        }

    .navbar .dropdown-menu {
        padding: 0;
        background-color: rgba(0, 0, 0, .9);
    }

        .navbar .dropdown-menu .dropdown-item {
            position: relative;
            padding: 10px 20px;
            color: #fff;
            font-size: 1.4rem;
            border-bottom: 1px solid rgba(255, 255, 255, .1);
            transition: color 0.2s ease-in;
        }

            .navbar .dropdown-menu .dropdown-item:last-child {
                border-bottom: none;
            }

            .navbar .dropdown-menu .dropdown-item:hover {
                background: transparent;
                color: #c0ca33;
            }

            .navbar .dropdown-menu .dropdown-item::before {
                content: '';
                position: absolute;
                bottom: 0;
                left: 0;
                top: 0;
                width: 5px;
                background-color: #c0ca33;
                opacity: 0;
                transition: opacity 0.2s ease-in;
            }

            .navbar .dropdown-menu .dropdown-item:hover::before {
                opacity: 1;
            }

    .navbar.fixed-top {
        position: fixed;
        -webkit-animation: navbar-animation 0.6s;
        animation: navbar-animation 0.6s;
        background-color: rgba(0, 0, 0, .9);
    }

        .navbar.fixed-top.navbar-dark .navbar-nav .nav-link.active {
            color: #c0ca33;
        }

        .navbar.fixed-top.navbar-dark .navbar-nav .nav-link::after {
            background-color: #c0ca33;
        }

    .content {
        padding: 120px 0;
    }

    @media screen and (max-width: 768px) {
        .navbar-brand {
            margin-left: 20px;
        }

        .navbar-nav {
            padding: 0 20px;
            background-color: rgba(0, 0, 0, .9);
        }

        .navbar.fixed-top .navbar-nav {
            background: transparent;
        }
    }

    @media screen and (min-width: 767px) {
        .banner {
            padding: 0 150px;
        }

            .banner h1 {
                font-size: 5rem;
            }

            .banner p {
                font-size: 2rem;
            }

        .navbar-dark .navbar-nav .nav-link {
            padding: 23px 15px;
        }

            .navbar-dark .navbar-nav .nav-link::after {
                content: '';
                position: absolute;
                bottom: 15px;
                left: 30%;
                right: 30%;
                height: 1px;
                background-color: #fff;
                -webkit-transform: scaleX(0);
                -ms-transform: scaleX(0);
                transform: scaleX(0);
                transition: transform 0.1s ease-in;
            }

            .navbar-dark .navbar-nav .nav-link:hover::after {
                -webkit-transform: scaleX(1);
                -ms-transform: scaleX(1);
                transform: scaleX(1);
            }

        .dropdown-menu {
            min-width: 200px;
            -webkit-animation: dropdown-animation 0.3s;
            animation: dropdown-animation 0.3s;
            -webkit-transform-origin: top;
            -ms-transform-origin: top;
            transform-origin: top;
        }
    }

    @-webkit-keyframes navbar-animation {
        0% {
            opacity: 0;
            -webkit-transform: translateY(-100%);
            -ms-transform: translateY(-100%);
            transform: translateY(-100%);
        }

        100% {
            opacity: 1;
            -webkit-transform: translateY(0);
            -ms-transform: translateY(0);
            transform: translateY(0);
        }
    }

    @keyframes navbar-animation {
        0% {
            opacity: 0;
            -webkit-transform: translateY(-100%);
            -ms-transform: translateY(-100%);
            transform: translateY(-100%);
        }

        100% {
            opacity: 1;
            -webkit-transform: translateY(0);
            -ms-transform: translateY(0);
            transform: translateY(0);
        }
    }

    @-webkit-keyframes dropdown-animation {
        0% {
            -webkit-transform: scaleY(0);
            -ms-transform: scaleY(0);
            transform: scaleY(0);
        }

        75% {
            -webkit-transform: scaleY(1.1);
            -ms-transform: scaleY(1.1);
            transform: scaleY(1.1);
        }

        100% {
            -webkit-transform: scaleY(1);
            -ms-transform: scaleY(1);
            transform: scaleY(1);
        }
    }

    @keyframes dropdown-animation {
        0% {
            -webkit-transform: scaleY(0);
            -ms-transform: scaleY(0);
            transform: scaleY(0);
        }

        75% {
            -webkit-transform: scaleY(1.1);
            -ms-transform: scaleY(1.1);
            transform: scaleY(1.1);
        }

        100% {
            -webkit-transform: scaleY(1);
            -ms-transform: scaleY(1);
            transform: scaleY(1);
        }
    }


    @import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700,800');
    @import url('https://fonts.googleapis.com/css?family=Lobster');

    html {
        font-size: 62.5%;
    }

    body {
        font-family: 'Open Sans', sans-serif;
        font-size: 1.6rem;
        font-weight: 400;
    }

    h1 {
        margin-bottom: 0.5em;
        font-size: 3.6rem;
    }

    p {
        margin-bottom: 0.5em;
        font-size: 1.6rem;
        line-height: 1.6;
    }

    .button {
        display: inline-block;
        margin-top: 20px;
        padding: 8px 25px;
        border-radius: 4px;
    }

    .button-primary {
        position: relative;
        background-color: #c0ca33;
        color: #fff;
        font-size: 1.8rem;
        font-weight: 700;
        transition: color 0.3s ease-in;
        z-index: 1;
    }

        .button-primary:hover {
            color: #c0ca33;
            text-decoration: none;
        }

        .button-primary::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            top: 0;
            background-color: #fff;
            border-radius: 4px;
            opacity: 0;
            -webkit-transform: scaleX(0.8);
            -ms-transform: scaleX(0.8);
            transform: scaleX(0.8);
            transition: all 0.3s ease-in;
            z-index: -1;
        }

        .button-primary:hover::after {
            opacity: 1;
            -webkit-transform: scaleX(1);
            -ms-transform: scaleX(1);
            transform: scaleX(1);
        }

    .overlay::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        top: 0;
        background-color: rgba(0, 0, 0, .3);
    }

    .header-area {
        position: relative;
        height: 100vh;
        background: #5bc0de;
        background-attachment: fixed;
        background-position: center center;
        background-repeat: no-repear;
        background-size: cover;
    }

    .banner {
        display: flex;
        align-items: center;
        position: relative;
        height: 100%;
        color: #fff;
        text-align: center;
        z-index: 1;
    }

        .banner h1 {
            font-weight: 800;
        }

        .banner p {
            font-weight: 700;
        }

    .navbar {
        position: absolute;
        left: 0;
        top: 0;
        padding: 0;
        width: 100%;
        transition: background 0.6s ease-in;
        z-index: 99999;
    }

        .navbar .navbar-brand {
            font-family: 'Lobster', cursive;
            font-size: 2.5rem;
        }

        .navbar .navbar-toggler {
            position: relative;
            height: 50px;
            width: 50px;
            border: none;
            cursor: pointer;
            outline: none;
        }

            .navbar .navbar-toggler .menu-icon-bar {
                position: absolute;
                left: 15px;
                right: 15px;
                height: 2px;
                background-color: #fff;
                opacity: 0;
                -webkit-transform: translateY(-1px);
                -ms-transform: translateY(-1px);
                transform: translateY(-1px);
                transition: all 0.3s ease-in;
            }

                .navbar .navbar-toggler .menu-icon-bar:first-child {
                    opacity: 1;
                    -webkit-transform: translateY(-1px) rotate(45deg);
                    -ms-sform: translateY(-1px) rotate(45deg);
                    transform: translateY(-1px) rotate(45deg);
                }

                .navbar .navbar-toggler .menu-icon-bar:last-child {
                    opacity: 1;
                    -webkit-transform: translateY(-1px) rotate(135deg);
                    -ms-sform: translateY(-1px) rotate(135deg);
                    transform: translateY(-1px) rotate(135deg);
                }

            .navbar .navbar-toggler.collapsed .menu-icon-bar {
                opacity: 1;
            }

                .navbar .navbar-toggler.collapsed .menu-icon-bar:first-child {
                    -webkit-transform: translateY(-7px) rotate(0);
                    -ms-sform: translateY(-7px) rotate(0);
                    transform: translateY(-7px) rotate(0);
                }

                .navbar .navbar-toggler.collapsed .menu-icon-bar:last-child {
                    -webkit-transform: translateY(5px) rotate(0);
                    -ms-sform: translateY(5px) rotate(0);
                    transform: translateY(5px) rotate(0);
                }

    .navbar-dark .navbar-nav .nav-link {
        position: relative;
        color: #fff;
        font-size: 1.6rem;
    }

        .navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
            color: #fff;
        }

    .navbar .dropdown-menu {
        padding: 0;
        background-color: rgba(0, 0, 0, .9);
    }

        .navbar .dropdown-menu .dropdown-item {
            position: relative;
            padding: 10px 20px;
            color: #fff;
            font-size: 1.4rem;
            border-bottom: 1px solid rgba(255, 255, 255, .1);
            transition: color 0.2s ease-in;
        }

            .navbar .dropdown-menu .dropdown-item:last-child {
                border-bottom: none;
            }

            .navbar .dropdown-menu .dropdown-item:hover {
                background: transparent;
                color: #c0ca33;
            }

            .navbar .dropdown-menu .dropdown-item::before {
                content: '';
                position: absolute;
                bottom: 0;
                left: 0;
                top: 0;
                width: 5px;
                background-color: #c0ca33;
                opacity: 0;
                transition: opacity 0.2s ease-in;
            }

            .navbar .dropdown-menu .dropdown-item:hover::before {
                opacity: 1;
            }

    .navbar.fixed-top {
        position: fixed;
        -webkit-animation: navbar-animation 0.6s;
        animation: navbar-animation 0.6s;
        background-color: rgba(0, 0, 0, .9);
    }

        .navbar.fixed-top.navbar-dark .navbar-nav .nav-link.active {
            color: #c0ca33;
        }

        .navbar.fixed-top.navbar-dark .navbar-nav .nav-link::after {
            background-color: #c0ca33;
        }

    .content {
        padding: 120px 0;
    }

    @media screen and (max-width: 768px) {
        .navbar-brand {
            margin-left: 20px;
        }

        .navbar-nav {
            padding: 0 20px;
            background-color: rgba(0, 0, 0, .9);
        }

        .navbar.fixed-top .navbar-nav {
            background: transparent;
        }
    }

    @media screen and (min-width: 767px) {
        .banner {
            padding: 0 150px;
        }

            .banner h1 {
                font-size: 5rem;
            }

            .banner p {
                font-size: 2rem;
            }

        .navbar-dark .navbar-nav .nav-link {
            padding: 23px 15px;
        }

            .navbar-dark .navbar-nav .nav-link::after {
                content: '';
                position: absolute;
                bottom: 15px;
                left: 30%;
                right: 30%;
                height: 1px;
                background-color: #fff;
                -webkit-transform: scaleX(0);
                -ms-transform: scaleX(0);
                transform: scaleX(0);
                transition: transform 0.1s ease-in;
            }

            .navbar-dark .navbar-nav .nav-link:hover::after {
                -webkit-transform: scaleX(1);
                -ms-transform: scaleX(1);
                transform: scaleX(1);
            }

        .dropdown-menu {
            min-width: 200px;
            -webkit-animation: dropdown-animation 0.3s;
            animation: dropdown-animation 0.3s;
            -webkit-transform-origin: top;
            -ms-transform-origin: top;
            transform-origin: top;
        }
    }

    @-webkit-keyframes navbar-animation {
        0% {
            opacity: 0;
            -webkit-transform: translateY(-100%);
            -ms-transform: translateY(-100%);
            transform: translateY(-100%);
        }

        100% {
            opacity: 1;
            -webkit-transform: translateY(0);
            -ms-transform: translateY(0);
            transform: translateY(0);
        }
    }

    @keyframes navbar-animation {
        0% {
            opacity: 0;
            -webkit-transform: translateY(-100%);
            -ms-transform: translateY(-100%);
            transform: translateY(-100%);
        }

        100% {
            opacity: 1;
            -webkit-transform: translateY(0);
            -ms-transform: translateY(0);
            transform: translateY(0);
        }
    }

    @-webkit-keyframes dropdown-animation {
        0% {
            -webkit-transform: scaleY(0);
            -ms-transform: scaleY(0);
            transform: scaleY(0);
        }

        75% {
            -webkit-transform: scaleY(1.1);
            -ms-transform: scaleY(1.1);
            transform: scaleY(1.1);
        }

        100% {
            -webkit-transform: scaleY(1);
            -ms-transform: scaleY(1);
            transform: scaleY(1);
        }
    }

    @keyframes dropdown-animation {
        0% {
            -webkit-transform: scaleY(0);
            -ms-transform: scaleY(0);
            transform: scaleY(0);
        }

        75% {
            -webkit-transform: scaleY(1.1);
            -ms-transform: scaleY(1.1);
            transform: scaleY(1.1);
        }

        100% {
            -webkit-transform: scaleY(1);
            -ms-transform: scaleY(1);
            transform: scaleY(1);
        }
    }



}