*,
::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;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: #000;
    font-family: 'Montserrat', 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: #da0c23;
}

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 a { color: #000; }
.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/home-slider/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/home-slider/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/home-slider/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;
}

.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;
}

/* Products page  */

.products-banner {
    background: url(../images/products-milwaukee-tools.jpg);
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: contain;
    height: 120px;
    padding: 0;
}
.products-banner h1 {
    color: #fff;
    font-size: 1.5em;
    margin: 0;
}
.products-banner .red-background { height: 100%; }
.products-banner .float-container {
    background: #000;
    padding: 20px;
    position: absolute;
    top: 45px;
    width: fit-content;
}

.products-content { height: auto; }

.products-section {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 10px 10px;
    height: auto;
}

.product-item:nth-child(6n+2), .product-item:nth-child(6n+3), .product-item:nth-child(8n), .product-item:nth-child(9n), .product-item:nth-child(10n), .product-item:nth-child(11n)  { background: rgba(229, 229, 229, 1); }

.products-section .product-item a {
    align-items: center;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: space-between;
}

.products-section .product-item .product-button {
    align-items: center;
    align-self: flex-end;
    background: #000;
    color: #fff;
    display: flex;
    font-size: 1.2em;
    justify-content: center;
    line-height: 1em;
    margin-bottom: 0;
    min-height: 77px;
    padding: 20px;
    text-align: center;
    width: 100%;   
}

.products-section .product-item a:hover > .product-button {
    text-decoration: none;
    background: rgba(218, 12, 35, 0.9);
}

.products-section .product-item.double-block { grid-column: span 2; }
.products-section .product-item.double-block a { 
    justify-content: center;
    padding: 20px;
}
.products-section .product-item:nth-child(3n+0) { margin-right: 0; }

/* 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; }
}

