*,
::before,
::after {
    box-sizing: border-box;
    margin: 0px;
    padding: 0px;
}

html,
body {
    color: #000;
    line-height: 1.5;
    font-size: 14px !important;
    font-family: 'Roboto', sans-serif;
}

@font-face {
    font-family: Helvetica Neue LT W01_83 Hv Ex;
    font-display: swap;
    src: url(../fonts/helvetica-milwaukee.woff2) format("woff2")
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: #000;
    font-family: Helvetica Neue LT W01_83 Hv Ex,Helvetica Neue,Helvetica,Arial,sans-serif;
}

h1 {
    font-size: 2em;
}

.fw200 {
    font-weight: 200;
}

.fw300 {
    font-weight: 300;
}

.fw400 {
    font-weight: 400;
}

.fw500 {
    font-weight: 500;
}

.fw600 {
    font-weight: 600;
}

.fw700 {
    font-weight: 700;
}

.fw800 {
    font-weight: 800;
}

.fw900 {
    font-weight: 900;
}

.has-font-1 {
    font-size: 2em;
}

.has-font-2 {
    font-size: 1.8em;
}

.has-font-3 {
    font-size: 1.6em;
}

.has-font-4 {
    font-size: 1.4em;
}

.has-font-5 {
    font-size: 1.2em;
}

.text-center {
    text-align: center;
}

.text-left {
    text-align: left;
}

.text-capitalize {
    text-transform: capitalize;
}

strong,
input,
select {
    font-family: 'Roboto', sans-serif;
}

.form-group .form-control::-webkit-input-placeholder {
    font-family: 'Roboto', Arial, Helvetica, sans-serif;
}

.form-group .form-control:-ms-input-placeholder {
    font-family: 'Roboto', Arial, Helvetica, sans-serif;
}

.form-group .form-control:-moz-placeholder {
    font-family: 'Roboto', Arial, Helvetica, sans-serif;
}

.form-group .form-control::-moz-placeholder {
    font-family: 'Roboto', Arial, Helvetica, sans-serif;
}

a {
    color: #da0c23;
}

a:hover {
    color: inherit;
}

img {
    max-width: 100%;
}

.footer {
    color: white;
}

.full-wide {
    width: 100%;
}

section,
footer {
    padding-top: 1.875rem;
    padding-bottom: 1.875rem;
    box-sizing: border-box;
}

/* General overwrite */

.form-control {
    border-radius: 0px;
    background-clip: initial;
}

/* helpers */


/* Opacity */
.op-05 {
    opacity: 0.5;
}

.op-07 {
    opacity: 0.7;
}

/* Visibility */

.hide {
    visibility: hidden;
}

.no-overflow {
    overflow-x: hidden;
}

/* Display */

.is-flex {
    display: flex;
    display: -webkit-box;
    /* Safari 3.1 - 6, Chrome < 21 (2009 Spec), UCBrowser Android */
    display: -moz-box;
    /* Firefox 2 - 27 (2009 Spec), UCMini Android */
    display: -ms-flexbox;
    /* IE10 (2012 Syntax) */
    display: -webkit-flex;
    /* Safari 6.1 - 8, Android < 4.4, BB < 10, Chrome 21 - 28 */
    flex-wrap: wrap;
    justify-content: center;
}

.height-auto {
    height: auto;
}

.equal {
    flex-wrap: wrap;
    height: auto;
}

/* Background Colors */

.bg-black {
    background-color: #000;
}

.bg-light-grey {
    background-color: #f5f5f5;
}

.bg-red {
    color: white;
    background-color: #da0c23;
}

.bg-white {
    background-color: white !important;
}

/* Text Colors */
.red {
    color: #da0c23;
}

.white {
    color: white;
}

/* Margins */

.margin-none {
    margin: 0px;
}

.margin-all-xs {
    margin: 10px;
}

.margin-all-s {
    margin: 20px;
}

.margin-all-md {
    margin: 30px;
}

.margin-all-lg {
    margin: 40px;
}

.margin-top-none {
    margin-top: 0px;
}

.margin-right-none {
    margin-right: 0px;
}

.margin-bottom-none {
    margin-bottom: 0px;
}

.margin-left-none {
    margin-left: 0px;
}

.margin-top-xs {
    margin-top: 10px;
}

.margin-right-xs {
    margin-right: 10px;
}

.margin-bottom-xs {
    margin-bottom: 10px;
}

.margin-left-xs {
    margin-left: 10px;
}


.margin-top-sm {
    margin-top: 15px;
}

.margin-right-sm {
    margin-right: 15px;
}

.margin-bottom-sm {
    margin-bottom: 15px;
}

.margin-left-sm {
    margin-left: 15px;
}


.margin-top-s {
    margin-top: 20px;
}

.margin-right-s {
    margin-right: 20px;
}

.margin-bottom-s {
    margin-bottom: 20px;
}

.margin-left-s {
    margin-left: 20px;
}


.margin-top-md {
    margin-top: 30px;
}

.margin-right-md {
    margin-right: 30px;
}

.margin-bottom-md {
    margin-bottom: 30px;
}

.margin-left-md {
    margin-left: 30px;
}


.margin-top-lg {
    margin-top: 40px;
}

.margin-right-lg {
    margin-right: 40px;
}

.margin-bottom-lg {
    margin-bottom: 40px;
}

.margin-left-lg {
    margin-left: 40px;
}


/* Padding */

.is-paddingless {
    padding: 0rem;
}

.padding-all-xs {
    padding: 10px;
}

.padding-all-s {
    padding: 20px;
}

.padding-all-md {
    padding: 30px;
}

.padding-all-lg {
    padding: 40px;
}


.padding-top-none {
    padding-top: 0px;
}

.padding-right-none {
    padding-right: 0px;
}

.padding-bottom-none {
    padding-bottom: 0px;
}

.padding-left-none {
    padding-left: 0px;
}

.padding-top-xs {
    padding-top: 10px;
}

.padding-right-xs {
    padding-right: 10px;
}

.padding-bottom-xs {
    padding-bottom: 10px;
}

.padding-left-xs {
    padding-left: 10px;
}


.padding-top-s {
    padding-top: 20px;
}

.padding-right-s {
    padding-right: 20px;
}

.padding-bottom-s {
    padding-bottom: 20px;
}

.padding-left-s {
    padding-left: 20px;
}


.padding-top-md {
    padding-top: 30px;
}

.padding-right-md {
    padding-right: 30px;
}

.padding-bottom-md {
    padding-bottom: 30px;
}

.padding-left-md {
    padding-left: 30px;
}


.padding-top-lg {
    padding-top: 40px;
}

.padding-right-lg {
    padding-right: 40px;
}

.padding-bottom-lg {
    padding-bottom: 40px;
}

.padding-left-lg {
    padding-left: 40px;
}

/* Show or hide on laptop */

.is-desktop {
    display: block;
}

.is-mobile {
    display: none;
}

/* Z-Index */
.has-z-index-2 {
    z-index: 2;
}

/* Buttons */

.button {
    border-radius: 0;
    color: white;
    padding: 10px;
    text-align: center;
}

.button-primary {
    background-color: #da0c23;
    color: white;
}

.button-primary:hover,
.button-primary:focus {
    color: white;
    background-color: #be0f22;
    text-decoration: none;
}

.button-secondary {
    background-color: rgba(255, 255, 255, 1);
    color: #da0c23;
    cursor: pointer;
}

.button-secondary:focus,
.button-secondary:hover {
    background-color: rgba(255, 255, 255, 0.9);
    color: #da0c23;
    text-decoration: none;
}

/* Header */

.header {
    position: initial;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1;
    background: #da0c23;
    transition: all 0.5s ease-in-out;
}

.header.microsite .top-bar {
    z-index: 2;
}

/* Navigation */

.header .navigation-top {
    background-color: #fff;
    color: #888;
    display: block;
    font-size: 14px;
}

.header .navigation-top .navigation-top-container {
    display: flex;
    justify-content: space-around;
    align-items: flex-start;

}

.header .navigation-top .navigation-top-item {
    margin: 0px 10px;
}

.header .navigation-top,
.header .navigation-bottom {
    text-transform: uppercase;
    font-weight: initial;
}

.header .navigation-bottom .navbrand-logo {
    display: inline-block;
}

.header .navbar {
    background-color: #da0c23;
    margin-bottom: 0px;
}

.header .navbar-default {
    border-radius: 0px;
    border: 0px;
}

.header .navigation-bottom.navbar-default.sticky .nav-item>.nav-link {
    height: 85px;
    padding: 20px 10px;
}

.header .navigation-bottom.navbar-default.sticky .navbrand-logo {
    margin-top: 0px !important;
}

.header .navigation-bottom.navbar-default.sticky .navbrand-logo-right {
    height: 65px !important;
}

.header .navigation-bottom.navbar-default .navbar-toggle,
.header .navigation-bottom.navbar-default .navbar-toggle:hover {
    background-color: transparent;
    border: 0px;
}

.header .navigation-bottom.navbar-default .navbar-toggle:focus {
    background-color: rgba(218, 12, 35, 0.9);
}

.header .navigation-bottom.navbar-default .navbar-toggle .icon-bar {
    background-color: #ffffff;
}

.header .navigation-bottom .navbar-brand {
    height: auto
}

.header .navbar-default .navbar-collapse,
.navbar-default .navbar-form {
    border-color: transparent;
}



.header .navbar.sticky {
    position: fixed;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 100;
    border-top: 0;
}



.nav {
    color: #888;
}

.nav>.nav-list {
    padding: 0px;
    margin: 0px;
    display: bock;
}

.nav-item {
    display: block;
}

.nav-item>.nav-link {
    display: flex;
    height: 100px;
    justify-content: center;
    align-items: center;
    padding: 20px 10px;
    text-align: center;
    text-decoration: none;
    transition: all 0.25s ease-out;
    border-bottom: 3px solid transparent;
    color: white;
}

.nav-item>.nav-link--active,
.nav-item>.nav-link:hover,
.nav-item>.nav-link:focus {
    color: white;
    text-decoration: none;
    border-bottom: 3px solid white;
    background: transparent;
}


/* Hero Banner */

.hero {
    position: relative;
    background-color: #212121;
    color: #fff;
    padding-top: 0rem;
    padding-bottom: 0rem;
    height: auto;
}

.hero-empty {
    display: block;
    width: 100%;
    height: 250px;
}

.hero-img-ratio {
    position: relative;
    display: block;
}

.hero-img-ratio {
    content: '';
    display: block;
    width: 100%;
    padding-bottom: 55%;
    /* 16:9 aspect ratio on percentage 56.25%*/
    background-color: #000000;
}

.hero-img-ratio-container {
    background: url('../images/hero-images/remodeling-milwaukee.jpg') no-repeat;
    background-size: cover;
    background-position: bottom center;
}

.hero-electrical {
    background: url('../images/hero-images/electrical-milwaukee.jpg') no-repeat;
    background-size: cover;
    background-position: bottom center;
}

.hero-mechanical {
    background: url('../images/hero-images/mechanical-milwaukee.jpg') no-repeat;
    background-size: cover;
    background-position: bottom center;
}

.hero-new {
    background: url('../images/hero-images/mx-fuel-hero-milwaukee.jpg') no-repeat;
    background-size: cover;
    background-position: bottom center;
}

.hero-plumbing {
    background: url('../images/hero-images/plumbing-milwaukee.jpg') no-repeat;
    background-size: cover;
    background-position: bottom center;
}

.hero-power {
    background: url('../images/hero-images/power-utility-milwaukee.jpg') no-repeat;
    background-size: cover;
    background-position: bottom center;
}

.hero-desc {
    background-color: #000;
    display: flex;
    padding: 60px;
}

.hero-content ul {
    list-style: none;
    font-weight: 700;
}

.hero-title {
    font-size: 1.875rem;
    font-weight: 700;
}

.hero-container img {
    width: 100%;
}

.hero-inner .hero-title {
    font-size: 1.875rem;
    font-weight: 700;
}

/* Cards */

.in-page-cards-section::after {
    content: "";
    display: block;
    width: 30%;
    height: 100%;
    background: linear-gradient(90deg, rgba(2, 0, 36, 0) 0%, rgba(245, 245, 245, 1) 100%);
    position: absolute;
    right: 0;
    top: 0;
    z-index: 2;
}

.in-page-cards-section .thumbnail {
    position: relative;
    border-radius: 0px;
    border: 0px solid transparent;
    margin: 0 20px;
    width: 250px;
    padding: 0px;
}

.in-page-cards-section .card-img {
    width: 250px;
}

.in-page-cards-section .card:focus {
    outline: -webkit-focus-ring-color auto 0px;
}

.in-page-cards-section .card-caption {
    position: absolute;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    left: 0;
    right: 0;
    height: 100px;
    background-color: rgb(0 0 0 / 90%);
}


.in-page-cards-section .slick-arrow.slick-prev {
    left: 20px;
    z-index: 2;
}


.in-page-cards-section .slick-arrow.slick-next {
    right: 35px;
    z-index: 20;
}

.in-page-cards-section .slick-arrow.slick-next::before {
    content: "";
    width: 15px;
    height: 15px;
    display: block;
    background: transparent;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-left: 10px solid black;
}

.in-page-cards-section .slick-arrow.slick-prev::before {
    content: "";
    width: 15px;
    height: 15px;
    display: block;
    background: transparent;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-right: 10px solid black;
}


/* Sections */

.section {
    padding-top: 6.25rem;
    padding-bottom: 6.25rem;
}

.section-title {
    font-weight: 900;
    text-transform: uppercase;
}

.section-story {
    padding: 0rem;
}

.section-story-left {
    position: relative;
}

.section-story-left .img-responsive {
    height: 100%;
    top: 0;
    bottom: 0;
}

.section-story-right {
    padding-bottom: 100px;
    padding-top: 100px;
    padding-right: 100px;
    padding-left: 100px;
}


/* Section Locations*/


.section-locations .card {
    background-color: #f5f5f5;
    box-sizing: content-box;
    border-color: #f5f5f5;
    border-radius: 0;
    margin: 20px;
}

.section-locations .card-title h3 {
    color: #000000;
    font-size: 1.2rem;
    margin-top: 0px;
    margin-right: 25px;
}

/* Section Location
-- Cards styles and animations --
*/

.section-locations .card-summary {
    transition: all 0.2s ease-in-out;
    overflow: hidden;
    background-color: #f5f5f5;
}

.section-locations .card-summary::not([open]) .card-summary-info {
    opacity: 0;
}

.section-locations .card-summary[open] .card-summary-info {
    opacity: 1s;
    padding: 20px;
}

.section-locations .card-summary-title {
    cursor: pointer;
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 2;
    width: 30px;
    height: 30px;
    border: 1px solid #da0c23;
    box-sizing: border-box;
    color: #da0c23;
    display: flex;
    justify-content: center;
    font-size: 1.5rem;
}

.section-locations .card-summary[open] .card-summary-title {
    border: 1px solid #da0c23;
    background-color: #da0c23;
    color: white;
}


.card-summary .card-summary-title::after {
    content: attr(data-open);
    opacity: 0;
}

.card-summary[open] .card-summary-title::after {
    content: attr(data-open);
    opacity: 1;
}

.card-summary[open] .card-summary-title::before {
    content: attr(data-open);
    display: none;
}


.card-summary:not([open]) .card-summary-title::before {
    content: attr(data-close);
    opacity: 1;
}

.card-summary:not([open]) .card-summary-title::after {
    display: none;
}

.card-summary .card-summary-title::after,
.card-summary .card-summary-title::before {
    display: inline-block;
    transition: all .4s ease-in-out;
}

.section-locations .card-summary-title:focus {
    outline: -webkit-focus-ring-color auto 0px;
}

.section-locations .card-summary>.card-summary-title::-webkit-details-marker {
    display: none;
}


.section-locations .card a {
    color: #be0f22;
}

.section-locations .card a:hover {
    color: #da0c23;
}

.section-locations .card-summary-info .info-list {
    list-style: none;
}


/* Section Contact Us*/
.section-contactus {
    padding: 0rem;
    position: relative;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.9) 50%, rgba(0, 0, 0, 0) 50%);
    overflow: hidden;
}

.section-contactus .contactus-img {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -1;
    background-image: url(../images/hand-tools-main-hero-milwaukee.jpg);
    background-size: cover;
    background-position: right;
}

.section-contactus-left {
    display: flex;
    box-sizing: border-box;
    padding: 5% 50px 5% 0px;
    justify-content: center;
    align-items: center;
}

/* Contact us page */

.contact-us {
    padding: 40px;
}

.contact-us h1 {
    margin-bottom: 40px;
}

/* Contact us Form */
.contact-us .contact-us-form .form-group {
    margin-bottom: 0;
}

.contact-us .contact-us-form .form-group input,
.contact-us .contact-us-form .form-group textarea,
.contact-us .contact-us-form .form-group select {
    background: #e5e5e5;
    border: none;
    color: #757575;
    font-size: 16px;
    font-family: 'Roboto', Helvetica, sans-serif;
    padding: 20px 10px;
}

.contact-us .contact-us-form .form-group select {
    padding: 0 5px;
}

.contact-us .contact-us-form .form-group .help-block.with-errors {
    margin: 20px 0;
}

.contact-us .contact-us-form .form-group input::placeholder,
.contact-us .contact-us-form .form-group textarea::placeholder,
.contact-us .contact-us-form .form-group select::placeholder {
    font-size: 16px;
    font-family: 'Roboto', Helvetica, sans-serif;
}

.contact-us .contact-us-form .form-group #accept_terms_yes {
    margin-bottom: 30px;
}

.contact-us .contact-us-form .button-primary {
    margin-top: 40px;
}

.contact-us .contact-us-list {
    border-left: 1px #757575 solid;
}

.contact-us .list-item {
    border-bottom: 1px #ccc solid;
    margin-bottom: 20px;
}

.contact-us .list-item .additional-content {
    padding-bottom: 15px;
    padding-top: 0;
}

.contact-us .list-item .additional-content .content {
    background-color: white;
    list-style: none;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
}

.contact-us .list-item .additional-content .open-button {
    background: none;
    border: 0;
    color: #DA0C23;
    float: right;
    font-weight: 600;
    margin-bottom: 11px;
}

.contact-us .list-item .additional-content .open-button:focus {
    border: none;
    outline: none;
}



/* Footer */

.footer {
    padding-top: 1.875rem;
    padding-bottom: 1.875rem;
    background-color: #212121;
}

.footer-inner {
    padding-top: 9.375rem;
    padding-bottom: 9.375rem;
}

.footer .social {
    padding-top: 0px;
    padding-bottom: 0px;
}

.footer .social-item {
    align-content: center;
    background-color: #da0c23;
    color: white;
    display: flex;
    height: 1.875rem;
    list-style: none;
    margin-right: 4px;
    text-align: center;
    text-decoration: none;
    justify-content: center;
    align-items: center;
    width: 1.875rem;
    transition: all 0.25s ease-out;
}

.footer .social-item span {
    align-self: center;
}

.footer .social-item:hover {
    background-color: #be0f22;
    color: white;
    text-decoration: none;
}

.footer-logo-desc {
    text-align: center;
    margin-bottom: none;
}

.footer-list-item {
    list-style: none;
}

/* Microsite Styles */

/* Slider Styles */

.home-slider {
    height: 500px;
    padding: 0;
}

.home-slider.slick-dotted.slick-slider {
    margin-bottom: 0;
}

.home-slider .slide {
    align-items: center;
    padding: 0;
    height: 100%;
}

.home-slider .slide .container {
    align-items: center;
}

.home-slider .slide .container.content-right {
    justify-content: flex-end;
}

.home-slider .slide .container .black-block {
    background: rgba(0, 0, 0, 0.8);
    padding: 40px 30px;
}

.home-slider .slick-arrow {
    z-index: 1;
}

.home-slider .slick-prev {
    left: 25px;
}

.home-slider .slick-prev::before {
    background-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='angle-left' class='svg-inline--fa fa-angle-left fa-w-8' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 512'%3E%3Cpath fill='%23ffffff' d='M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: cover;
    content: '';
    padding: 10px;
}

.home-slider .slick-next {
    right: 25px;
}

.home-slider .slick-next::before {
    background-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='angle-right' class='svg-inline--fa fa-angle-right fa-w-8' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 512'%3E%3Cpath fill='%23ffffff' d='M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: cover;
    content: '';
    padding: 10px;
}

.home-slider .slick-dots {
    background: #000;
    bottom: 0;
    display: flex;
    height: 15px;
}

.home-slider .slick-dots li {
    height: 15px;
    width: 33.3%;
}

.home-slider .slick-dots li:hover {
    background: #333334;
}

.home-slider .slick-dots li.slick-active {
    background: #DA0C23;
}

.home-slider .slick-dots li.slick-active button:before {
    content: '';
}

.home-slider .slide.mx-fuel {
    background: url(../images/banners/mx-fuel-slide/equipment-redefined-trade-focused-system-wide-milwaukee-tools-bg.jpg);
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
    color: #fff;
}

.home-slider .slide.m18-fuel {
    background: url(../images/banners/m18-fuel-slide/m-18-fuel-milwaukee-tools.jpg);
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
    color: #fff;
}

.home-slider .slide.packout {
    background: url(../images/banners/packout-slide/packout-modular-storage-system-milwaukee-tools.jpg);
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
    color: #fff;
}

.home-slider .slick-list {
    height: 100%;
}

.home-slider .slick-track {
    height: 100%;
}

.home-slider .slide.is-flex {
    font-size: 1.2em;
}

.home-slider .slide.is-flex.slick-slide {
    height: 100%;
}

.home-slider .slide.is-flex img {
    max-width: 100%;
}

.slick-current.slick-active .fade-top {
    -webkit-animation: fade-top .5s ease-out forwards;
    -moz-animation: fade-top .5s ease-out forwards;
    -ms-animation: fade-top .5s ease-out forwards;
    animation: fade-top .5s ease-out forwards;
    opacity: 0;

    -webkit-animation-delay: 1s;
    -moz-animation-delay: 1s;
    -ms-animation-delay: 1s;
    animation-delay: 1s;
}

@-webkit-keyframes fade-top {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }

    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}

@-moz-keyframes fade-top {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }

    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}

@keyframes fade-top {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }

    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}

/* Covid Section Styles */

.covid {
    align-items: center;
    justify-content: center;
    padding: 30px;
    margin-bottom: 50px;
}

/* Products Home Section Styles */

.products-container {
    background: #000;
    color: #fff;
    flex-wrap: wrap;
    padding-bottom: 60px;
}

.products-container .products-grid {
    display: grid;
    grid-template-columns: 60% 1fr;
    grid-template-rows: 45% 45% 10%;
    grid-auto-flow: dense;
    grid-gap: 20px 20px;
    height: 500px;
    padding: 20px;
}

.products-container .products-grid .main-product {
    background: url(../images/power-tools-milwaukee-tools.jpg);
    background-position: center center;
    background-size: cover;
    grid-column: 1 / span 1;
    grid-row: 1 / span 3;
}

.products-container .products-grid .sub-product-one {
    background: url(../images/bateries-and-charges-milwaukee-tools.jpg);
    background-position: center center;
    background-size: cover;
    grid-column: 2 / span 1;
    grid-row: 1 / span 1;
}

.products-container .products-grid .sub-product-two {
    background: url(../images/hand-tools-milwaukee-tools.jpg);
    background-position: center center;
    background-size: cover;
    grid-column: 2 / span 1;
    grid-row: 2 / span 1;
}

.products-container .products-grid .sub-product-button {
    grid-column: 2 / span 1;
    grid-row: 3 / span 1;
    background: black;
    border: none;
    padding: 0;
}

.products-container .products-grid .product-item {
    align-items: flex-end;
    display: flex;
}

.products-container .products-grid .product-item .product-description {
    background: rgba(0, 0, 0, 0.8);
    padding: 10px 20px;
    text-align: left;
    width: 100%;
}

.products-container .products-grid .product-item .product-description p {
    font-weight: 300;
}

/* About Milwaukee tools Section */

.about-us {
    background: url(../images/about-milwaukee-tools-bg.jpg);
    background-attachment: fixed;
    background-position-x: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 0;
}

.red-background {
    background: rgba(218, 12, 35, 0.9);
    justify-content: center;
}

.black-background {
    background: rgba(0, 0, 0, 1);
}

.gray-background {
    background: rgba(229, 229, 229, 1);
}

/* Testimonials Section */
.testimonials .testimonials-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.testimonials .testimonials-container .left-section,
.testimonials .testimonials-container .right-section {
    width: 50%;
}


.testimonials .testimonials-container .testimonial-item {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    width: 50%;
}

.testimonials .testimonials-container .testimonial-item .testimonial-image {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 250px;
    width: 50%;
}

.testimonials .testimonials-container .testimonial-item:nth-child(4n+3) .testimonial-image {
    background: url(../images/testimonial2.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.testimonials .testimonials-container .testimonial-item:nth-child(4n+4) .testimonial-image {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.testimonials .testimonials-container .testimonial-item .testimonial-image-1 {
    background: url(../images/testimonial.jpg);
}

.testimonials .testimonials-container .testimonial-item .testimonial-image-2 {
    background: url(../images/testimonial2.jpg);
}

.testimonials .testimonials-container .testimonial-item .testimonial-image-3 {
    background: url(../images/testimonial3.jpg);
}

.testimonials .testimonials-container .testimonial-item .testimonial-image-4 {
    background: url(../images/testimonial4.jpg);
}

.testimonials .testimonials-container .testimonial-item .testimonial-description {
    border-left: 0;
    font-size: 1em;
    font-weight: 200;
    padding: 0 20px 0 0;
    width: 50%;
}

.testimonials .testimonials-container .testimonial-item .testimonial-description .description-body {
    border-bottom: 2px solid #DA0C23;
    border-right: 2px solid #DA0C23;
    border-top: 2px solid #DA0C23;
    padding: 20px 20px 20px 40px;
}

.testimonials .testimonials-container .testimonial-item .testimonial-description h5 {
    padding: 0 0 0 40px;
}

.testimonials .testimonials-container .testimonial-item:nth-child(3) .testimonial-description h5,
.testimonials .testimonials-container .testimonial-item:nth-child(4) .testimonial-description h5 {
    padding: 0;
}

.testimonials .testimonials-container .testimonial-item:nth-child(3) .testimonial-description,
.testimonials .testimonials-container .testimonial-item:nth-child(4) .testimonial-description {
    padding: 0 0 0 20px;
}

.testimonials .testimonials-container .testimonial-item:nth-child(3) .testimonial-description .description-body,
.testimonials .testimonials-container .testimonial-item:nth-child(4) .testimonial-description .description-body {
    border-bottom: 2px solid #DA0C23;
    border-left: 2px solid #DA0C23;
    border-right: 0;
    border-top: 2px solid #DA0C23;
    padding: 20px 40px 20px 20px;
}

/* Header Microsite */

.header.microsite .nav-list {
    text-transform: uppercase;
}

/* Footer Microsite */

.footer .footer-nav {
    color: #fff;
    line-height: 1.7em;
    list-style: none;
    padding-left: 50px;
}

.footer a {
    color: #fff;
    font-weight: 400;
    opacity: .8;

    -webkit-transition: opacity .2s ease-out;
    -moz-transition: opacity .2s ease-out;
    -ms-transition: opacity .2s ease-out;
    transition: opacity .2s ease-out;
}

.footer a:hover {
    color: #fff;
    text-decoration: none;
    opacity: 1;

    -webkit-transition: opacity .2s ease-out;
    -moz-transition: opacity .2s ease-out;
    -ms-transition: opacity .2s ease-out;
    transition: opacity .2s ease-out;
}

.footer .footer-contact-info {
    color: #fff;
    line-height: 1.7em;
    list-style: none;
}

.footer .footer-contact-info .footer-icon:before {
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    content: '';
    margin-right: 5px;
    padding: 5px;
}

.footer .footer-contact-info .footer-icon.i-location:before {
    background-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' focausable='false' data-prefix='fas' data-icon='map-marker-alt' class='svg-inline--fa fa-map-marker-alt fa-w-12' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath fill='%23DA0C23' d='M172.268 501.67C26.97 291.031 0 269.413 0 192 0 85.961 85.961 0 192 0s192 85.961 192 192c0 77.413-26.97 99.031-172.268 309.67-9.535 13.774-29.93 13.773-39.464 0zM192 272c44.183 0 80-35.817 80-80s-35.817-80-80-80-80 35.817-80 80 35.817 80 80 80z'%3E%3C/path%3E%3C/svg%3E");
}

.footer .footer-contact-info .footer-icon.i-phone:before {
    background-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='phone-alt' class='svg-inline--fa fa-phone-alt fa-w-16' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23DA0C23' d='M497.39 361.8l-112-48a24 24 0 0 0-28 6.9l-49.6 60.6A370.66 370.66 0 0 1 130.6 204.11l60.6-49.6a23.94 23.94 0 0 0 6.9-28l-48-112A24.16 24.16 0 0 0 122.6.61l-104 24A24 24 0 0 0 0 48c0 256.5 207.9 464 464 464a24 24 0 0 0 23.4-18.6l24-104a24.29 24.29 0 0 0-14.01-27.6z'%3E%3C/path%3E%3C/svg%3E");
}

.footer .footer-contact-info .footer-icon.i-site:before {
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='language_24px'%3E%3Cpath id='icon/action/language_24px' fill-rule='evenodd' clip-rule='evenodd' d='M3.3335 20C3.3335 10.8 10.7835 3.33337 19.9835 3.33337C29.2002 3.33337 36.6668 10.8 36.6668 20C36.6668 29.2 29.2002 36.6667 19.9835 36.6667C10.7835 36.6667 3.3335 29.2 3.3335 20ZM26.6167 13.3333H31.5334C29.9334 10.5833 27.3834 8.45 24.3167 7.4C25.3167 9.25 26.0834 11.25 26.6167 13.3333ZM20.0001 6.7334C21.3834 8.7334 22.4667 10.9501 23.1834 13.3334H16.8167C17.5334 10.9501 18.6167 8.7334 20.0001 6.7334ZM6.66683 20C6.66683 21.15 6.8335 22.2667 7.10016 23.3334H12.7335C12.6002 22.2334 12.5002 21.1334 12.5002 20C12.5002 18.8667 12.6002 17.7667 12.7335 16.6667H7.10016C6.8335 17.7334 6.66683 18.85 6.66683 20ZM8.46686 26.6667H13.3835C13.9169 28.75 14.6835 30.75 15.6835 32.6C12.6169 31.55 10.0669 29.4334 8.46686 26.6667ZM8.46686 13.3333H13.3835C13.9169 11.25 14.6835 9.25 15.6835 7.4C12.6169 8.45 10.0669 10.5667 8.46686 13.3333ZM20.0001 33.2667C18.6167 31.2667 17.5334 29.05 16.8167 26.6667H23.1834C22.4667 29.05 21.3834 31.2667 20.0001 33.2667ZM16.1002 23.3334H23.9002C24.0502 22.2334 24.1668 21.1334 24.1668 20C24.1668 18.8667 24.0502 17.75 23.9002 16.6667H16.1002C15.9502 17.75 15.8335 18.8667 15.8335 20C15.8335 21.1334 15.9502 22.2334 16.1002 23.3334ZM24.3167 32.6C25.3167 30.75 26.0834 28.75 26.6167 26.6667H31.5334C29.9334 29.4167 27.3834 31.55 24.3167 32.6ZM27.5001 20C27.5001 21.1334 27.4001 22.2334 27.2667 23.3334H32.9001C33.1667 22.2667 33.3334 21.15 33.3334 20C33.3334 18.85 33.1667 17.7334 32.9001 16.6667H27.2667C27.4001 17.7667 27.5001 18.8667 27.5001 20Z' fill='%23DA0C23'/%3E%3C/g%3E%3C/svg%3E%0A");
    padding-right: 7px;
}

.footer .icon {
    padding: 7px 15px;
    background-color: #DA0C23;
}

.footer .icon.i-facebook {
    background-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fab' data-icon='facebook-f' class='svg-inline--fa fa-facebook-f fa-w-10' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%23ffffff' d='M279.14 288l14.22-92.66h-88.91v-60.13c0-25.35 12.42-50.06 52.24-50.06h40.42V6.26S260.43 0 225.36 0c-73.22 0-121.08 44.38-121.08 124.72v70.62H22.89V288h81.39v224h100.17V288z'%3E%3C/path%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 10px;
}

.footer .icon.i-twitter {
    background-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fab' data-icon='twitter' class='svg-inline--fa fa-twitter fa-w-16' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23ffffff' d='M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z'%3E%3C/path%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 15px;
}

.footer .icon.i-youtube {
    background-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fab' data-icon='youtube' class='svg-inline--fa fa-youtube fa-w-18' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath fill='%23ffffff' d='M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821 11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305zm-317.51 213.508V175.185l142.739 81.205-142.739 81.201z'%3E%3C/path%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 20px;
}

.footer .icon.i-gmb {
    background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 2500 2185' style='enable-background:new 0 0 2500 2185;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFFFFF;%7D .st1%7Bfill:%23EFEFEF;%7D .st2%7Bfill:%23CCCCCC;%7D .st3%7Bfill:%237BABF7;%7D .st4%7Bfill-rule:evenodd;clip-rule:evenodd;fill:%23D1D1D1;%7D .st5%7Bfill-rule:evenodd;clip-rule:evenodd;fill:%23AFAFAF;%7D .st6%7Bfill:%23DA0C23;%7D%0A%3C/style%3E%3Cg%3E%3Cg%3E%3Cpath class='st0' d='M212.2,547.9h2014.2c47.9,0,86.7,38.8,86.7,86.7v1462.4c0,47.9-38.8,86.7-86.7,86.7H212.2 c-47.9,0-86.7-38.8-86.7-86.7V634.5C125.6,586.7,164.4,547.9,212.2,547.9z'/%3E%3Cpath class='st1' d='M2201.2,535.6h-1966c-60.9,0-108.3,471.3-108.3,532.2l1076.7,1115.7h997.7c61.1-0.2,110.6-49.6,110.7-110.7 V646.3C2311.7,585.2,2262.2,535.7,2201.2,535.6z'/%3E%3Cpath class='st2' d='M625.1,821.8h625V1.5H718.7L625.1,821.8z'/%3E%3Cpath class='st1' d='M1875.1,821.8h-625V1.5h531.4L1875.1,821.8z M2313.1,157l0.8,2.8C2313.7,158.8,2313.3,157.9,2313.1,157z'/%3E%3Cpath class='st2' d='M2313.9,159.8l-0.8-2.8C2293.3,66.2,2213,1.5,2120.1,1.5h-338.6l93.5,820.3h625L2313.9,159.8z'/%3E%3Cpath class='st3' d='M187.1,157l-0.8,2.8C186.5,158.8,186.8,157.9,187.1,157z'/%3E%3Cpath class='st1' d='M186.3,159.8l0.8-2.8C206.8,66.2,287.2,1.5,380,1.5h338.6L625,821.8H0L186.3,159.8z'/%3E%3C/g%3E%3Cpath class='st4' d='M626.1,821.6c0,172.5-139.8,312.3-312.3,312.3S1.5,994.1,1.5,821.6H626.1z'/%3E%3Cpath class='st5' d='M1250.8,821.6c0,172.5-139.8,312.3-312.3,312.3S626.1,994.1,626.1,821.6H1250.8z'/%3E%3Cpath class='st4' d='M1875.4,821.6c0,172.5-139.8,312.3-312.3,312.3s-312.3-139.8-312.3-312.3H1875.4z'/%3E%3Cpath class='st5' d='M2500,821.6c0,172.5-139.8,312.3-312.3,312.3c-172.5,0-312.3-139.8-312.3-312.3H2500z'/%3E%3Cpath class='st6' d='M2187.7,1667.7c-1.1-14.9-2.9-28.5-5.5-45.8h-340.7c0,47.7,0,99.6-0.2,147.3h197.4 c-8.5,44.9-34.5,84.5-72.3,110.2c0,0,0-0.8-0.1-0.8c-24.2,15.9-51.4,26.5-79.9,31.2c-28.6,5.2-57.9,5.1-86.4-0.4 c-29-6-56.4-17.9-80.6-34.9c-35.7-25.3-63.3-60.5-79.3-101.3c-1.2-3.2-2.3-6.4-3.5-9.6v-0.4l0.3-0.2c-15.5-45.6-15.6-95-0.1-140.6 c10.9-32,28.8-61.1,52.4-85.3c55.4-57.3,138.2-78.9,214.6-55.9c29.3,9,56,24.7,78.1,46l66.6-66.6c11.7-11.9,23.9-23.4,35.2-35.6 c-33.8-31.5-73.4-56-116.6-72.2c-78.7-28.5-164.8-29.3-244-2.1c-2.8,0.9-5.5,1.9-8.2,2.9c-85.4,32.1-155.7,95.1-196.9,176.5 c-14.6,28.8-25.2,59.5-31.5,91.1c-37.7,187.4,76.7,371.9,261.3,421.5c60.4,16.2,124.5,15.8,185.4,2c55.3-12.5,106.4-39,148.4-77.1 c43.8-40.3,75.2-94,91.6-151C2186.7,1768.2,2191.7,1717.8,2187.7,1667.7L2187.7,1667.7z'/%3E%3C/g%3E%3C/svg%3E%0A");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 20px;
}

.footer .icon.i-instagram {
    background-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fab' data-icon='instagram' class='svg-inline--fa fa-instagram fa-w-14' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23ffffff' d='M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z'%3E%3C/path%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 18px;
}


/* Heavy Duty Section */

.heavy-duty {
    background: url(../images/heavy-duty-milwaukee-tools.jpg);
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 0;
}

.heavy-duty .black-opacity-background {
    align-items: center;
    background: rgba(0, 0, 0, 0.8);
    display: flex;
    height: 300px;
    justify-content: center;
    padding: 20px;
}

.heavy-duty .black-opacity-background h1 {
    text-transform: inherit;
}

.heavy-duty .black-opacity-background h1 span {
    font-size: 1.5em;
}

/* Products Modal */
.modal-open .modal {
    background: #ffffffc2;
    padding-bottom: 60px;
}

.modal-open .modal .modal-header {
    border-bottom: 0;
}

.modal-open .modal .modal-dialog {
    top: 15%;
    width: 400px;
}

.modal-open .modal .modal-header .close {
    margin-top: -22px;
}

.modal-open .modal .modal-header .close span {
    font-size: 1.5em;
}

.modal-open .modal .modal-body {
    padding: 0 20px 20px 20px;
}

.modal-open .modal .modal-body ul {
    padding-left: 40px;
}


/* Media Queries */

/* min-width 576px
   max-width 576px
   min-width 577px  and  max-width 980px
   min-width 981px
   max-width 991px */

@media (min-width: 576px) {

    /* Media Queries - Navigation */
    .nav>.nav-item {
        display: inline-flex;
    }

    .hero {
        overflow: hidden;
    }
}

@media (max-width: 576px) {

    /* Media Queries - Navigation */
    .nav-item>.nav-link {
        height: auto;
    }

    .section-story-left .img-responsive {
        max-width: 100%;
    }
}


@media (min-width: 577px) and (max-width: 780px) {


    /* Media Queries - Contact Us */
    .section-contactus {
        background: linear-gradient(90deg, rgba(0, 0, 0, 0.9) 50%, rgba(0, 0, 0, 0.9) 50%);
    }

}

@media (min-width: 781px) {

    /* Contente Here */
}

@media (max-width: 780px) {

    .is-flex {
        display: block;
    }

    /* Navigation Top */
    .header .navigation-top .navigation-top-container {
        display: block;
        font-size: 12px;
    }

    .navbrand-logo {
        float: left;
        position: relative;
        width: 100px;
        z-index: 2;
    }

    .section-locations-cards .card {
        padding-top: 10px;
    }

    /* Media Queries -  Section Story */
    .section-story-left {
        display: flex;
        justify-content: center;
    }

    .section-story-right {
        padding-left: 0px;
        padding-right: 0px;
    }

    /* Media Queries - Section Contact Us */
    .section-contactus {
        background: linear-gradient(90deg, rgba(0, 0, 0, 0.9) 50%, rgba(0, 0, 0, 0.9) 50%);
    }

    .section-contactus-left {
        padding: 20px 0%;
    }

}

@media (min-width: 781px) and (max-width:980px) {

    .section-contactus {
        background: linear-gradient(90deg, rgba(0, 0, 0, 0.9) 65%, rgba(0, 0, 0, 0.1) 50%);
    }
}

@media (min-width: 981px) {

    .hero {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
    }

    .section-locations .card-summary-title {
        cursor: pointer;
        position: absolute;
        right: 10px;
        top: 10px;
        z-index: 2;
        width: 30px;
        height: 30px;
        border: 1px solid #da0c23;
        box-sizing: border-box;
        color: #da0c23;
        display: flex;
        display: -webkit-box;
        /* Safari 3.1 - 6, Chrome < 21 (2009 Spec), UCBrowser Android */
        display: -moz-box;
        /* Firefox 2 - 27 (2009 Spec), UCMini Android */
        display: -ms-flexbox;
        /* IE10 (2012 Syntax) */
        display: -webkit-flex;
        /* Safari 6.1 - 8, Android < 4.4, BB < 10, Chrome 21 - 28 */
        justify-content: center;
        font-size: 1.5rem;
    }

    .section-locations .card-summary[open] .card-summary-title {
        z-index: 2;
    }

    .section-locations .card-summary-title:hover {
        color: #ffffff;
        border: 1px solid #da0c23;
        background-color: #da0c23;
    }

    .section-locations .card-summary-info {
        position: absolute;
        bottom: -20px;
        left: 0;
        right: 0;
        background-color: #f5f5f5;
        box-sizing: content-box;
        border-color: #f5f5f5;
        border-radius: 0;
        z-index: 3;
    }

    .section-locations .card-summary:not([open]) {
        min-height: 0px;
    }

    .section-locations .card-summary[open] {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        height: 350px;
    }
}

@media (min-width: 780px) and (max-width: 1280px) {
    .hero-inner .hero-desc {
        display: initial;
    }
}

@media only screen and (max-width: 991px) {
    .is-desktop {
        display: none;
    }

    .is-mobile {
        display: block;
    }

    .container {
        height: auto;
    }

    .container .row {
        padding: 0;
        margin: 0;
    }

    .contact-us .list-item {
        padding-bottom: 30px;
    }

    .contact-us .contact-us-form {
        padding: 0;
    }

    .contact-us .contact-us-form .form-group {
        padding: 0;
    }

    .contact-us .contact-us-form .row {
        padding: 0;
    }

    .contact-us .contact-us-list {
        border-left: none;
        margin: 70px auto;
        padding-left: initial;
    }

    .equal {
        display: block;
    }

    .contact-us .list-item .additional-content .open-button {
        margin-top: 10px;
    }

    /* Slider Responsive */
    .home-slider {
        background-color: #000;
        height: auto;
    }

    .home-slider .mx-fuel .container.is-flex .black-block {
        margin-top: 314px;
    }

    .home-slider .slide.is-flex {
        background-size: contain;
        background-position: top;
    }

    .home-slider .container.is-flex {
        align-items: flex-end;
        background-size: 100%;
        height: auto;
        margin: 0;
        padding: 0;
        width: 100%;
    }

    .home-slider .container.is-flex .black-block {
        background: rgba(0, 0, 0, 1);
        margin-top: 200px;
    }

    /* Products Section Responsive Styles */
    .products-container .products-grid {
        display: block;
        height: auto;
    }

    .products-container .products-grid .main-product,
    .products-container .products-grid .sub-product-one,
    .products-container .products-grid .sub-product-two {
        height: 300px;
        margin-bottom: 20px;
    }

    /* Testimonials */
    .testimonials .testimonials-container .left-section,
    .testimonials .testimonials-container .right-section {
        width: 100%;
    }

    /* Footer Microsite */
    .footer .footer-nav {
        padding-left: 10px;
    }

    /* Products Section Microsite */
    .products-section {
        grid-template-columns: 1fr 1fr;
    }

    /* Hero for Landing Pages */
    .hero-img-ratio-container,
    .hero-electrical,
    .hero-mechanical,
    .hero-new,
    .hero-plumbing,
    .hero-power {
        background-position: center;
        height: 380px;
    }
}

@media only screen and (max-width: 780px) {
    .testimonials .testimonials-container .testimonial-item {
        width: 100%;
    }

    .testimonials .testimonials-container .testimonial-item .testimonial-image,
    .testimonials .testimonials-container .testimonial-item .testimonial-description {
        text-align: center;
        width: 100%;
    }

    .testimonials .testimonials-container .testimonial-item:nth-child(3),
    .testimonials .testimonials-container .testimonial-item:nth-child(4) {
        flex-direction: column-reverse;
    }

    .testimonials .testimonials-container .testimonial-item .testimonial-image,
    .testimonials .testimonials-container .testimonial-item .testimonial-description {
        width: 100%;
    }

    .testimonials .testimonials-container .testimonial-item .testimonial-description .description-body,
    .testimonials .testimonials-container .testimonial-item:nth-child(3) .testimonial-description .description-body,
    .testimonials .testimonials-container .testimonial-item:nth-child(4) .testimonial-description .description-body {
        border: 0;
        padding: 0px 20px 20px 40px;
    }

    .testimonials .testimonials-container .testimonial-item:nth-child(3) .testimonial-description h5,
    .testimonials .testimonials-container .testimonial-item:nth-child(4) .testimonial-description h5 {
        padding-left: 0px;
    }

    /* Modal Products section microsite */
    .modal-open .modal {
        padding-bottom: 20px;
    }

    .modal-open .modal .modal-dialog {
        top: 5%;
        width: 100%;
    }
}

@media only screen and (max-width: 630px) {
    .home-slider .mx-fuel .container.is-flex .black-block {
        margin-top: 170px;
    }
}

@media only screen and (max-width: 500px) {
    .products-container .products-grid {
        padding: 0 40px;
    }

    .about-us .red-background {
        padding: 40px 20px;
    }
}

@media only screen and (max-width: 425px) {
    .home-slider .container.is-flex .black-block {
        margin-top: 100px;
    }
}

.flex-wrap {
    display: flex;
    flex-wrap: wrap;
}

/* new products */

.products-section .product-item {
    background: #fff !important;
}


.products-section {
    margin: 20px auto;
    padding: 0 15px;
    text-align: center;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.product-image {
    max-height: 400px;
    width: auto;
}

.product-item {
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 5px;
    margin: 0;
    padding: 15px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.product-item img {
    max-width: 100%;
    height: auto;
    border-radius: 5px;
    display: block;
    margin: 0 auto;
}

.product-item h3 {
    color: #000;
    margin-bottom: 0;
    text-transform: none;
    font-size: 18px;
    font-weight: 700;
    margin-top: 1em;
    line-height: 1.3;
}

.load-more {
    display: block;
    margin: 20px auto;
    padding: 10px 20px;
    background-color: transparent;
    color: #000;
    border: 2px solid #000;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    transition: background-color 0.3s, color 0.3s;
}

.load-more:hover {
    background-color: red;
    color: #fff;
}

@media (max-width: 768px) {
    .products-section {
        grid-template-columns: repeat(1, 1fr);
    }
}


/*Products Page*/
.tr-product-page {
    padding-bottom: 60px;
}

.tr-product-page .flex-wrap {
    justify-content: flex-start;
}

.tr-product-item {
    flex-basis: 33.333333%;
}

.tr-product-inner {
    margin: 10px;
    position: relative;
}

.tr-product-image {
    width: 100%;
}

.tr-product-info {
    position: absolute;
    width: 100%;
    text-align: center;
    background-color: rgba(125, 31, 40, .7);
    background-color: rgba(0, 0, 0, 0.7);
    left: 0;
    bottom: 0;
    padding: 30px 15px;
    color: white;
}

.tr-product-info h3 {
    color: #fff;
    margin: .25em 0 1em 0;
    font-size: 23px;
    font-weight: 700;
    text-transform: none;
}

.tr-product-info-cta {
    display: inline-block;
    border: 1px solid white;
    padding: 10px 25px;
    color: white;
    text-decoration: none;
    font-size: 16px;
    /*font-weight: 500;*/
}

.tr-product-info-cta:hover {
    background: #DB061B;
    border: 1px solid #DB061B;
    text-decoration: none;
    color: #fff;
}


@media screen and (max-width: 768px) {
    .tr-product-item {
        flex-basis: 50%;
    }
}

@media screen and (max-width: 540px) {
    .tr-product-item {
        flex-basis: 100%;
    }
}


.tr-product-page-category {
    padding-bottom: 60px;
}

.tr-product-page-category .flex-wrap {
    align-items: stretch;
}

.tr-category-item {
    flex-basis: 25%;
    margin-bottom: 50px;
}

.tr-category-item-image-wrap {
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tr-category-item img {
    max-width: 100%;
    max-height: 200px;
}

.tr-category-item-inner {
    margin: 10px;
    text-align: center;
    padding-bottom: 60px;
    position: relative;
    height: 100%;
}

.tr-category-item-cta {
    color: black;
    display: block;
    width: 100%;
    border: 2px solid black;
    text-decoration: none;
    font-size: 16px;
    line-height: 16px;
    padding: 12px 25px;
    position: absolute;
    left: 0;
    bottom: 0;
}

.tr-category-item-cta:hover {
    background: #DB061B;
    border: 1px solid #DB061B;
    text-decoration: none;
    color: #fff;
}

.tr-category-item-inner h3 {
    margin-bottom: 0;
    text-transform: none;
    font-size: 18px;
    font-weight: 700;
    margin-top: 1em;
    line-height: 1.3;
}

@media screen and (max-width: 768px) {
    .tr-category-item {
        flex-basis: 50%;
    }
}

@media screen and (max-width: 540px) {
    .tr-category-item {
        flex-basis: 100%;
    }
}

.tr-container {
    /*max-width: 1280px;*/
    margin: 0 auto;
    padding-left: 15px;
    padding-right: 15px;
}

@media (min-width: 768px) {
    .tr-container {
        width: 750px;
    }
}

@media (min-width: 992px) {
    .tr-container {
        width: 970px;
    }
}

@media (min-width: 1200px) {
    .tr-container {
        width: 1170px;
    }
}

.tr-breadcrumbs {
    margin: 0;
    padding: 0;
    padding: 0;
}

.tr-breadcrumbs li {
    display: inline-block;
    list-style-type: none;
    padding: 15px 0;
    color: #db011c;
}

.tr-breadcrumbs li a {
    color: black;
    text-decoration: none;
    padding: 0 10px 0 5px;
}

@media screen and (max-width: 768px) {
    .tr-breadcrumbs {
        padding: 0;
    }
}

.d-flex {
    display: flex;
}

.input-container {
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.input-container input {
    height: 35px;
    width: 250px;
    border: 2px solid #000;
    padding: 5px 10px;
    border-radius: 4px;
    font-family: 'Montserrat', sans-serif;

    &.product-search-input {
        width: 500px;

        @media (max-width:767px) {
            width: 100%;
        }
    }
}

.input-container input::placeholder {
    font-family: 'Montserrat', sans-serif;
    font-size: 12px;
}

/* Style for the suggestions container */
#product-suggestions {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    max-height: 200px;
    /* Limit height for scrolling */
    overflow-y: auto;
    border: 1px solid #ccc;
    border-radius: 4px;
    background-color: #fff;
    z-index: 1000;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    padding: 0;
    margin: 0;
    list-style-type: none;
    width: 500px;

    @media (max-width:767px) {
        width: 100%;
    }
}

/* Style for each suggestion item */
#product-suggestions li {
    padding: 10px;
    cursor: pointer;
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    color: #000;
}

/* Hover state for suggestion items */
#product-suggestions li:hover {
    background-color: #f0f0f0;
}

/* Link style for suggestion items */
#product-suggestions li a {
    text-decoration: none;
    color: inherit;
    display: block;
}

#search-button {
    border: 2px solid #000;
    height: 35px;
    padding: 5px 10px;
    border-radius: 4px;
    font-family: 'Montserrat', sans-serif;
    transition: background 0.3s ease-in-out;

    &:hover {
        background: #db021d;
        color: white;
    }
}

/* Hidden state for the suggestions container */
.hidden {
    display: none;
}

.load-more-container {
    text-align: center;
}

.load-more {
    background: #000;
    color: #fff;
    width: 200px;
    cursor: pointer;
    text-align: center;
    margin: 0 auto 90px;
    border: 0;
    font-size: 1rem;
    font-weight: 700;
    transition: background 0.3s ease-in-out;
}

.load-more:hover {
    background: #DB061B;
    transition: background 0.3s ease-in-out;
}

@media (max-width:767px) {
    .input-container input {
        margin: 20px 0 40px 0;
        width: 100%;
    }

    .product-search-container input {
        margin: 0;
        width: 100%;
    }
}

.product-search-container {
    display: flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    align-items: center;

    @media (max-width:767px) {
        margin: 20px 0 0 0;
    }
}

.tr-headline {
    margin-bottom: 20px;

    @media (max-width:767px) {
        padding: 0 10px;
    }
}

.tr-headline h2 {
    font-size: 27px;
    line-height: 27px;
    text-transform: uppercase;
    margin-top: 20px;
    margin-bottom: .7em;
    font-weight: 700;
}

.tr-headline hr {
    max-width: 150px;
    border-top: 3px solid #db011c;
    border-bottom: 0px solid white;
    display: block;
    margin: 0;
}


/* Skeleton loader styles */
.skeleton-loader .skeleton-image {
    width: 100%;
    height: 200px;
    background-color: #e0e0e0;
    animation: skeleton-loading 1.5s infinite;
}

.skeleton-loader .skeleton-text {
    width: 100%;
    height: 20px;
    margin: 10px auto;
    background-color: #e0e0e0;
    animation: skeleton-loading 1.5s infinite;
}

.skeleton-loader .skeleton-button {
    display: block;
    width: 100%;
    height: 40px;
    margin: 20px auto;
    background-color: #e0e0e0;
    animation: skeleton-loading 1.5s infinite;
    border: unset !important;
}

@keyframes skeleton-loading {
    0% {
        background-color: #e0e0e0;
    }

    50% {
        background-color: #f0f0f0;
    }

    100% {
        background-color: #e0e0e0;
    }
}

.tr-flex-5 {
    flex-basis: 41.666666%;
}


/*Product Detail Page & Carousel*/

.details-oem-wrap {
    border-bottom: 1px solid black;
    position: relative;

    &.skeleton {
        border: none;
    }
}

.details-oem-wrap p {
    font-weight: 700;
    margin: 0;
    position: relative;
    bottom: -1px;
    display: inline-block;
    border-top: 4px solid #BD0118;
    border-left: 1px solid black;
    border-right: 1px solid black;
    padding: 10px 20px;
    background-color: white;
}

.details-description h2 {
    margin: 30px 0;
    font-size: 24px;
    text-transform: none;
}

.details-features ol {
    margin: 0 0 0 20px;
    padding: 0;
}

.details-features ol li {
    padding-bottom: 15px;
}

.details-features ol li.hidden {
    display: none;
}

.details-features ol li.hidden.active {
    display: list-item;
}

.features-view-more-click {
    all: unset;
    display: inline-block;
    color: #DE3F56;
    font-weight: 700;
    font-size: 18px;
    line-height: 18px;
    font-family: 'Roboto', sans-serif;
    cursor: pointer;
}

.details-cta {
    margin-top: 30px;
}

.product-spec {
    border-top: 1px solid #cacaca;
    background-color: #EBEBEB;
}

.product-spec-col {

    align-items: flex-start;
    align-self: flex-start;
}

.product-spec-col-1 .col-inner {
    margin-right: 40px;
    border-bottom: 1px solid #cacaca;
}

.product-spec-col-2 .col-inner {
    border-bottom: 1px solid #cacaca;
}

.product-spec-col p {
    padding: 0 20px;
    margin: 1em 0;
}

.details-product-specs {
    padding: 0 20px;
}

.product-spec-value {
    border-top: 1px solid #cacaca;
}

.tr-product-detail {
    margin: 40px 0 60px 0;
}

.tr-product-detail-details {
    padding: 0 40px;
}

.details-product-specs {
    margin: 50px 0;
}

@media screen and (max-width: 768px) {
    .product-spec-col-1 .col-inner {
        margin-right: 0;
        border-bottom: 0px solid white;
    }

    .product-spec-col-2 {
        border-bottom: 1px solid #cacaca;
    }

    .product-spec-col.tr-flex-6 {
        flex-basis: 100%;
    }

    .product-spec-col-2 .col-inner {
        border-bottom: 0px solid #cacaca;
    }
}

.tr-flex-6 {
    flex-basis: 50%;
}

.tr-flex-7 {
    flex-basis: 58.333333%;
}

/* Gallery Container */
.tr-product-detail-carousel {
    position: relative;
    margin: 0 auto;
    max-width: 100%;
    height: max-content;
    margin-bottom: 40px;

    @media (min-width: 991px) {
        max-width: 50%;
    }
}


/* Main Gallery Container */

.container-slider {
    display: flex;
    flex-direction: row;

    @media (max-width: 991px) {
        flex-direction: column;
    }
}

.main-gallery {
    max-width: 600px;
    /* Set a maximum width */
    margin: 0 auto;
    /* Center the gallery */
    overflow: hidden;
    /* Prevent overflow */
    padding: 0 40px;
}

/* Main Gallery Images */
.main-gallery img {
    width: 100%;
    /* Ensure images take the width of their container */
    height: auto;
    /* Maintain aspect ratio */
    display: block;
    /* Prevent inline image spacing issues */
    max-width: 400px;
    height: 400px;
    object-fit: contain;
    margin: 0 auto;

    @media (max-width: 991px) {
        height: 300px;
    }
}

/* Thumbnail Gallery */
.thumbnail-gallery {
    margin-top: 15px;
    display: flex;
    justify-content: center;
    gap: 10px;
    padding: 0 40px;
}

.thumbnail-gallery img {
    height: auto;
    cursor: pointer;
    border: 2px solid transparent;
    border-radius: 4px;
    transition: border-color 0.3s ease, opacity 0.3s ease;
    height: 85px;
    object-fit: cover;
    margin: 0 auto;
}

.thumbnail-gallery .slick-slide.slick-current img {
    border-color: #b3001b;
    opacity: 1;
}

.thumbnail-gallery img:hover {
    opacity: 0.8;
}

/* Arrows */
.gallery-arrow {
    position: absolute;
    top: 44%;
    transform: translateY(-50%);
    background-color: #b3001b;
    color: white;
    border: none;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
}

.gallery-prev {
    left: 0px;
}

.gallery-next {
    right: 0px;
}

.custom-dots {
    display: flex;
    justify-content: center;
    margin-top: 10px;
}

.custom-dot {
    background: none;
    border: none;
    font-size: 20px;
    cursor: pointer;
    margin: 0 5px;
    color: #ccc;
}

.custom-dot.active {
    color: #000;
}

.buy-btn {
    background: #DB011C;
    color: #fff;
    border: 1px solid #DB011C;
    font-size: 18px;
    text-align: center;
    padding: 13px 35px;
    display: inline-block;
    text-decoration: none;
}

.but-btn:hover {
    background: transparent;
    color: #DB011C;
    border: 1px solid #DB011C;
}

.loading-products {
    margin: 0 auto;
    padding-bottom: 50vw;
}




/*Header*/
#header-top {
    background: #DB061B;
    height: auto;
}

#header-top .flex-container {
    justify-content: space-between;
}

#header-top .ht-logo a {
    height: 43px;
    display: flex;
    align-items: center;
}

#header-top .ht-logo img {
    max-height: 36px;
    /*margin-top: 3px;*/
}

#header-top .ht-address,
#header-top .ht-phone {
    font-size: 14px;
    font-family: 'Roboto', serif;
    color: #fff;
    text-transform: uppercase;
    display: flex;
    align-items: center;
}

#header-top a {
    color: #fff;
    text-decoration: none;
}

#header-top a:hover {
    text-decoration: underline;
}


.red-bottom {
    border-bottom: 5px solid #DB011C;
}

.navbar-toggle {
    width: 62px;
    padding: 15px;
    display: none;
}

.tr-header-contact {
    align-self: flex-end;
    padding: 10px 0;
}

.tr-header-logos img {
    max-width: 150px;
    max-height: 50px;
    /*border: 1px solid black;*/
}

.tr-left-logo,
.tr-right-logo {
    margin: 10px;
}

.tr-left-logo {
    border-right: 1px solid #C4C4C4;
    margin-right: 0;
    padding-right: 20px;
    max-height: 50px;
}

.tr-right-logo {
    padding-left: 20px;
    margin-left: 0;
}

.tr-right-logo p {
    text-transform: uppercase;
    font-size: 14px;
}

header {
    height: 100px;
    border-bottom: 3px solid #db071b;
}

header .flex-wrap {
    align-items: center;
    flex-wrap: nowrap;
    height: 100%;
    position: relative;
}

header p {
    margin: 0;
    font-size: 14px;
    color: black;
}

header h3 {
    margin: 10px 0;
    color: #DB011C;
    font-size: 24px;
    font-family: 'Roboto', sans-serif;
}

.tr-nav ul {
    margin: 0;
    padding: 0;
}

.tr-nav ul li {
    list-style-type: none;
    display: inline-block;
    border-bottom: 3px solid transparent;
}

.tr-nav ul li:hover {
    border-bottom: 3px solid #DB011C;
}

.tr-nav ul li a {
    color: black;
    text-decoration: none;
    display: block;
    padding: 15px;
    text-transform: uppercase;
    font-size: 14px;
    display: flex;
    align-items: center;
    height: 100px;
    &:hover {
        color: #DB011C;
    }
}

.tr-nav-dropdown svg {
    position: relative;
    right: -5px;
}

ul.tr-nav-dropdown-menu {
    display: none;
    position: absolute;
    background: rgb(0 0 0 / 82%);
    z-index: 1;
    margin-top: -20px;
    padding: 10px 0;
}

.tr-nav ul li ul.tr-nav-dropdown-menu li {
    display: block;
    border-bottom: 1px solid rgb(255 255 255 / 19%);
    border-bottom: 2px solid transparent;
}

.tr-nav ul li ul.tr-nav-dropdown-menu li:hover {
    border-bottom: 2px solid #db011c;
}

.tr-nav ul li ul.tr-nav-dropdown-menu li a {
    color: #fff;
    padding: 4px 20px;
    height: auto;
    font-size: 14.5px;
    font-weight: 300;
    text-transform: none;
}

@media screen and (min-width: 992px) {
    .tr-nav {
        margin-left: -12px;
    }
}

@media screen and (max-width: 1057px) {
    header h3 {
        font-size: 17px;
    }
}

@media screen and (max-width: 768px) {
    .navbar-toggle {
        display: block;
    }

    .tr-header-contact {
        display: none;
    }

    ul.tr-nav-dropdown-menu {
        display: none !important;
    }

    .tr-nav {
        display: none;
        position: absolute;
        left: 0;
        right: 0;
        top: 80px;
        width: 100%;
    }

    header.opened .tr-nav {
        display: block;
    }

    header h3 {
        font-size: 17px;
    }

    .tr-nav ul li {
        display: block;
    }

    .tr-nav ul li a {
        height: auto;
    }

    .navbar-menu {
        position: absolute;
        background: #fff;
        z-index: 1;
        width: 100%;
    }

    .tr-nav-dropdown svg {
        display: none;
    }

    .tr-header-logos {
        margin-left: 2.5%;
    }

    .tr-left-logo {
        border-right: 0;
        padding-right: 0;
    }
}

@media screen and (max-width: 767px) {
    #header-top .ht-address {
        display: none;
    }

    header {
        height: 80px;
    }
}

.flex-container {
    display: flex;
}

/*HOMEPAGE*/
/*Homepage - Hero*/
.hero {
    background: url(../images/hero-m-18-fuel-milwaukee-tools.jpg);
    background-size: cover;
    background-position: bottom;
    background-repeat: no-repeat;
    height: 420px;
}

.hero .tr-container {
    justify-content: flex-end;
    height: 100%;
}

.hero .black-block {
    background: rgba(0, 0, 0, 0.8);
    padding: 30px;
    text-align: center;
    align-self: center;
    height: 100%;
}

.hero .black-block p {
    color: #fff;
    text-align: left;
    margin-bottom: 25px;
    line-height: 23px;
    font-size: 16px;
}

.hero .black-block img {
    margin: 0 auto 20px auto;
    display: block;
    max-width: 150px;
}

.dh-md-5 {
    position: relative;
    min-height: 1px;
}

@media (min-width: 992px) {
    .dh-md-5 {
        width: 41.66666667%;
    }
}

@media (min-width: 992px) {
    .dh-md-5 {
        float: left;
    }
}

.tr-cta {
    display: block;
    padding: 13px 40px;
    color: white;
    background-color: #da0c23;
    font-size: 16px;
    /* margin-top: 30px; */
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    display: inline-block;
    font-weight: 800;
}

.border-b{
    border-bottom: solid 0.5px #ccc;
    padding-bottom: 1.875rem;
}

.form-container {
    display: flex;
}

.tr-breadcrumbs p {
    color: black;
    text-decoration: none;
    padding: 0 10px 0 5px;
}


.tr-about-sidebar {
    background-color: rgba(0,0,0,.75);
    padding: 30px;
    color: white;
    align-self: flex-start;
    margin-top: 35px;
    &:first-of-type {
        margin-top: 0;
    }
}
.tr-about-sidebar h2 {
    font-size: 24px;
    color: #fff;
    text-transform: none;
    margin-top: 0;
    margin-bottom: .83em;
}
.tr-about-sidebar p {
    margin-top: 1em;
}
.tr-sidebar-icon {
    display: inline-block;
    width: 16px;
    margin-right: 2px;
}
.tr-sidebar-phone a {
    color: white;
}
.tr-about-sidebar a.tr-cta {
    padding: 15px;
    margin-top: 15px;
    display: block;
}

.tr-header-logos img {
    max-width: 150px;
    max-height: 50px;
}
.tr-left-logo, .tr-right-logo {
    margin-right: 22px;
    margin-bottom: 11px;
}

.tr-right-logo {
    padding-left: 0;
    margin-right: 30px;
}


.product-modal {
    display: none; /* Hidden by default */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 9999;
}

.product-modal.active {
    display: block; /* Show modal when active */
}

.modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
}

.modal-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 8px;
    padding: 20px;
    max-width: 600px;
    max-height: 80%;
    overflow-y: auto;
    width: 90%;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
}

.modal-close {
    position: absolute;
    top: 10px;
    right: 10px;
    background: none;
    border: none;
    font-size: 40px;
    cursor: pointer;
}

.contact-us-form {
    margin: 20px 0;
}
