@media (max-width: 575.98px) {

  .nav-icon,
  .nav-icon:focus {
    /* background: #fff !important; */
  }

  .content-heading,
  .responsive-heading {
    display: inline-block;
  }

  .battery-price-lg,
  .contact-address,
  .contact-us,
  .footer-info,
  .modal-main-wrapper,
  .page-heading,
  .rc-content,
  .warranty-section,
  .why-choose-us {
    text-align: center;
  }

  .modal-main,
  .top-bar-content-container a:last-child {
    margin-left: 0;
  }

  .top-bar-content-container {
    padding: 5px 20px;
    height: auto;
    width: 100%;
    text-align: center;
  }

  .top-bar-content-container a {
    font-size: 20px;
    /* color: #ff0 !important; */
    font-weight: 700;
    width: 100%;
  }

  .header-btn {
    margin-bottom: 10px;
  }

  .small-logo {
    width: 50px;
  }

  .navigation {
    height: auto;
  }

  .nav-icon {
    color: #fff;
  }

  .menu-items {
    padding: 15px 0;
  }

  .accordion-heading,
  .menu-items li a {
    font-size: 14px;
  }

  .footer-logo {
    height: 100%;
    border: none;
    justify-content: center;
  }

  .footer-content,
  .section {
    padding: 40px 0;
  }

  .footer-info {
    margin-top: 50px;
    width: 100%;
  }

  .content-heading.light {
    font-size: 16px;
    padding-bottom: 15px;
  }

  .footer-content ul li {
    margin-bottom: 14px;
    font-size: 14px;
  }

  .copyright {
    line-height: 32px;
    font-size: 10px;
  }

  .content-heading.light:after {
    width: 65px;
  }

  .footer-content ul {
    margin-top: 10px;
  }

  .footer-info-wrapping {
    flex-wrap: wrap;
  }

  .res-bg {
    background-image: url("../images/welcome_bg.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position-y: bottom;
  }

  #select-make {
    padding-top: 150px;
  }

  #mobile-text,
  #welcome-text {
    padding-bottom: 0;
  }

  .page-heading {
    margin-top: 108px;
    height: 139px;
  }

  .page-heading h1 {
    font-size: 20px;
  }

  .small-battery {
    width: 200px;
  }

  .responsive-heading {
    font-size: 18px;
    padding-bottom: 22px;
  }

  .battery-description {
    margin-bottom: 25px;
    font-size: 14px;
  }

  .battery-price-lg {
    font-size: 18px;
  }

  .contact-us h3,
  .cr,
  .mi-table-top h1 {
    font-size: 24px;
  }

  .btn-success.btn-theme {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
  }

  .why-choose-us {
    padding-bottom: 190px;
    margin-top: 70px;
  }

  #other-warranty-cells,
  .faq-section {
    margin-top: 40px;
  }

  .why-choose-us .paper {
    padding: 85px 30px;
    min-height: 0;
  }

  .section-heading {
    font-size: 20px;
    display: inline-block;
  }

  .section-heading:after {
    height: 3px;
    width: 82px;
  }

  .why-hover-left {
    left: 30px;
    top: -42px;
    width: 120px;
  }

  .why-hover-right {
    right: -20px;
    width: 168px;
  }

  .faq-section {
    background: url(../images/faq-bg.png) center bottom no-repeat;
    padding-bottom: 210px;
  }

  .paper {
    padding: 58px 15px;
  }

  .f-14 {
    font-size: 14px;
    line-height: 22px;
  }

  .faq-hover-right {
    position: absolute;
    right: -6px;
    top: -37px;
    width: 80px;
  }

  .faq-hover-left {
    position: absolute;
    left: -26px;
    bottom: -55px;
    width: 100px;
  }

  .contact-address {
    background-color: var(--primary-color);
    padding: 75px 20px;
  }

  .contact-us h3 {
    display: inline-block;
  }

  .address-details {
    padding-top: 40px;
  }

  .form-container {
    padding: 40px 0 0;
  }

  .contact-us {
    padding: 66px 20px !important;
  }

  .form-button {
    display: flex;
    justify-content: center;
  }

  .contact-btn {
    min-width: 104px !important;
  }

  .warranty-section {
    padding-left: 30px;
    padding-right: 30px;
  }

  .warranty-img {
    width: 170px;
  }

  .other-warranties-imgs {
    width: 65px;
    height: 100%;
  }

  #other-warranty-text {
    font-size: 12px;
  }

  .recond-heading {
    font-size: 16px !important;
  }

  .reconditioning {
    background-size: contain;
    display: flex;
    justify-content: center;
  }

  .reconditioning .paper {
    padding: 60px 35px;
    margin-top: 35px;
  }

  .cogs-wrapper {
    margin-top: 270px;
    margin-bottom: -34px;
  }

  .section-heading.medium {
    font-size: 18px;
    padding-bottom: 22px;
    font-weight: 700;
    line-height: 26px;
    display: inline-block;
  }

  .modal-main-wrapper {
    flex-wrap: wrap;
    justify-content: center;
    padding-left: 20px;
    padding-right: 20px;
    margin-top: -56px;
  }

  .modal-main {
    margin-top: 40px;
  }

  .modal-close {
    position: absolute;
    top: 8px;
    left: 13px;
    background: 0 0;
  }

  .free-text {
    color: var(--primary-color);
    font-size: 20px;
  }

  .modal-text h1 {
    display: inline-block;
    font-size: 20px;
    text-align: left;
  }

  .modal-main h1::after {
    width: 80px;
  }

  .modal-main-wrapper img {
    width: 60%;
  }

  .modal-text h1::after {
    width: 89px;
  }

  .mi-modal {
    min-height: auto;
  }

  .product-rate-table table td,
  .product-rate-table table th {
    padding-left: 20px;
  }

  .vehicle-grid {
    max-width: 90% !important;

  }


}

@media (min-width: 576px) and (max-width: 767.98px) {

  .nav-icon,
  .nav-icon:focus {
    /* background: #fff !important; */
  }

  .content-heading,
  .responsive-heading {
    display: inline-block;
  }

  .battery-price-lg,
  .contact-address,
  .contact-us,
  .footer-info,
  .page-heading,
  .rc-content,
  .warranty-section,
  .why-choose-us {
    text-align: center;
  }

  .small-logo {
    width: 60px;
  }

  .navigation {
    height: auto;
  }

  .nav-icon {
    color: #fff;
  }

  .menu-items {
    padding: 15px 0;
  }

  .accordion-heading,
  .menu-items li a {
    font-size: 14px;
  }

  .footer-logo {
    height: 100%;
    border: none;
    justify-content: center;
  }

  .footer-content,
  .section {
    padding: 40px 0;
  }

  .footer-info {
    margin-top: 50px;
    width: 100%;
  }

  .content-heading.light {
    font-size: 16px;
    padding-bottom: 15px;
  }

  .footer-content ul li {
    margin-bottom: 14px;
    font-size: 14px;
  }

  .copyright {
    line-height: 32px;
    font-size: 10px;
  }

  .content-heading.light:after {
    width: 65px;
  }

  .footer-content ul {
    margin-top: 10px;
  }

  .footer-info-wrapping {
    flex-wrap: wrap;
  }

  .res-bg {
    background-image: url("../images/welcome_bg.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position-y: bottom;
  }

  .page-heading {
    margin-top: 118px;
    height: 139px;
  }

  .page-heading h1 {
    font-size: 20px;
  }

  .small-battery {
    width: 250px;
  }

  .responsive-heading {
    font-size: 18px;
    padding-bottom: 22px;
  }

  .battery-description {
    margin-bottom: 25px;
    font-size: 14px;
  }

  .battery-price-lg {
    font-size: 18px;
  }

  .contact-us h3,
  .cr,
  .mi-table-top h1 {
    font-size: 24px;
  }

  .btn-success.btn-theme {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
  }

  .why-choose-us {
    padding-bottom: 190px;
    margin-top: 70px;
  }

  #other-warranty-cells,
  .faq-section {
    margin-top: 40px;
  }

  .why-choose-us .paper {
    padding: 85px 30px;
    min-height: 0;
  }

  .section-heading {
    font-size: 20px;
    display: inline-block;
  }

  .section-heading:after {
    height: 3px;
    width: 82px;
  }

  .why-hover-left {
    left: 30px;
    top: -42px;
    width: 120px;
  }

  .why-hover-right {
    right: -20px;
    width: 168px;
  }

  .faq-section {
    background: url(../images/faq-bg.png) center bottom no-repeat;
    padding-bottom: 210px;
  }

  .paper {
    padding: 75px 15px;
  }

  .f-14 {
    font-size: 14px;
    line-height: 22px;
  }

  .faq-hover-right {
    position: absolute;
    right: -6px;
    top: -37px;
    width: 100px;
  }

  .faq-hover-left {
    position: absolute;
    left: -26px;
    bottom: -55px;
    width: 120px;
  }

  .contact-address {
    background-color: var(--primary-color);
    padding: 75px 20px;
  }

  .contact-us h3 {
    display: inline-block;
  }

  .address-details {
    padding-top: 40px;
  }

  .form-container {
    padding: 40px 0 0;
  }

  .contact-us {
    padding: 66px 30px;
  }

  .form-button {
    display: flex;
    justify-content: center;
  }

  .contact-btn {
    min-width: 104px !important;
  }

  .warranty-section {
    padding-left: 30px;
    padding-right: 30px;
  }

  .warranty-img {
    width: 170px;
  }

  .other-warranties-imgs {
    width: 65px;
    height: 100%;
  }

  #other-warranty-text {
    font-size: 12px;
  }

  .recond-heading {
    font-size: 16px !important;
  }

  .reconditioning {
    background-size: contain;
    display: flex;
    justify-content: center;
  }

  .reconditioning .paper {
    padding: 60px 35px;
    margin-top: 35px;
  }

  .cogs-wrapper {
    margin-top: 270px;
    margin-bottom: -34px;
  }

  .section-heading.medium {
    font-size: 18px;
    padding-bottom: 22px;
    font-weight: 700;
    line-height: 26px;
    display: inline-block;
  }

  .modal-main-wrapper {
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
    margin-top: -89px;
  }

  .modal-main {
    margin-left: 0;
    margin-top: 40px;
  }

  .modal-close {
    position: absolute;
    top: 8px;
    left: 13px;
    background: 0 0;
  }

  .free-text {
    color: var(--primary-color);
    font-size: 20px;
  }

  .modal-text h1 {
    display: inline-block;
    font-size: 20px;
    text-align: left;
  }

  .modal-main h1::after {
    width: 80px;
  }

  .modal-main-wrapper img {
    width: 60%;
  }

  .modal-text h1::after {
    width: 89px;
  }

  .mi-modal {
    min-height: auto;
  }

  .header-btn {
    margin-bottom: 10px;
  }
}

@media (min-width: 768px) {
  .servicing-info {
    padding: 6px 0;
  }
}

@media (min-width: 768px) and (max-width: 991.98px) {

  .nav-icon,
  .nav-icon:focus {
    /* background: #fff !important; */
  }

  .content-heading,
  .responsive-heading {
    display: inline-block;
  }

  .contact-address,
  .contact-us,
  .footer-info,
  .page-heading,
  .rc-content,
  .warranty-section {
    text-align: center;
  }

  .content-heading.light:after,
  .small-logo {
    width: 65px;
  }

  .navigation {
    height: auto;
  }

  .nav-icon {
    color: #fff;
  }

  .menu-items {
    padding: 15px 0;
  }

  .accordion-heading,
  .menu-items li a {
    font-size: 14px;
  }

  .footer-logo {
    height: 100%;
    border: none;
    justify-content: center;
  }

  .footer-content,
  .section {
    padding: 40px 0;
  }

  .footer-info {
    margin-top: 50px;
    width: 100%;
  }

  .content-heading.light {
    font-size: 16px;
    padding-bottom: 15px;
  }

  .footer-content ul li {
    margin-bottom: 14px;
    font-size: 14px;
  }

  .copyright {
    line-height: 32px;
    font-size: 10px;
  }

  .contact-us h3,
  .cr,
  .mi-table-top h1,
  .page-heading h1 {
    font-size: 24px;
  }

  .footer-content ul {
    margin-top: 10px;
  }

  #welcome-bg {
    bottom: 18px;
    left: -73px;
    max-width: 100%;
  }

  .page-heading {
    margin-top: 123px;
    height: 139px;
  }

  .small-battery {
    width: 400px;
  }

  .responsive-heading {
    font-size: 18px;
    padding-bottom: 22px;
  }

  .battery-description {
    margin-bottom: 25px;
    font-size: 14px;
  }

  #other-warranty-text,
  .battery-price-lg {
    font-size: 18px;
  }

  .btn-success.btn-theme {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
  }

  .why-choose-us {
    padding-bottom: 190px;
    margin-top: 70px;
  }

  #other-warranty-cells,
  .faq-section {
    margin-top: 40px;
  }

  .why-choose-us .paper {
    padding: 60px 80px 88px;
    min-height: 0;
  }

  .section-heading {
    font-size: 20px;
    display: inline-block;
  }

  .form-button,
  .reconditioning {
    display: flex;
    justify-content: center;
  }

  .section-heading:after {
    height: 3px;
    width: 82px;
  }

  .why-hover-left {
    left: 30px;
    top: -42px;
    width: 135px;
  }

  .why-hover-right {
    right: -100px;
    width: 230px;
  }

  .faq-section {
    background: url(../images/faq-bg.png) center bottom no-repeat;
    padding-bottom: 210px;
  }

  .paper {
    padding: 75px 32px;
  }

  .f-14 {
    font-size: 14px;
    line-height: 22px;
  }

  .faq-hover-right {
    position: absolute;
    right: -6px;
    top: -37px;
    width: 100px;
  }

  .faq-hover-left {
    position: absolute;
    left: -26px;
    bottom: -55px;
    width: 120px;
  }

  .contact-address {
    background-color: var(--primary-color);
    padding: 75px 20px;
  }

  .contact-us h3 {
    display: inline-block;
  }

  .address-details {
    padding-top: 40px;
  }

  .form-container {
    padding: 40px 0 0;
  }

  .contact-us {
    padding: 66px 50px;
  }

  .contact-btn {
    min-width: 104px !important;
  }

  .warranty-section {
    padding-left: 30px;
    padding-right: 30px;
  }

  .warranty-img {
    width: 200px;
  }

  .other-warranties-imgs {
    width: 130px;
    height: 100%;
  }

  .recond-heading {
    font-size: 16px !important;
  }

  .reconditioning {
    background-size: contain;
  }

  .reconditioning .paper {
    padding: 60px 35px;
    margin-top: 35px;
  }

  .cogs-wrapper {
    margin-top: 270px;
    margin-bottom: -34px;
  }

  .section-heading.medium {
    font-size: 18px;
    padding-bottom: 22px;
    font-weight: 700;
    line-height: 26px;
    display: inline-block;
  }

  .modal-main-wrapper {
    justify-content: center;
    padding-left: 20px;
    padding-right: 20px;
    margin-top: -79px;
    align-items: center;
  }

  .modal-main {
    margin-left: 0;
    margin-top: 40px;
  }

  .modal-close {
    position: absolute;
    top: 1px;
    right: 10px;
    background: 0 0;
  }

  .free-text {
    color: var(--primary-color);
    font-size: 20px;
  }

  .modal-text h1 {
    display: inline-block;
    font-size: 20px;
    text-align: left;
  }

  .modal-main h1::after {
    width: 80px;
  }

  .modal-main-wrapper img {
    width: 93%;
  }

  .modal-text h1::after {
    width: 89px;
  }

  .mi-modal {
    min-height: auto;
  }

  .header-btn {
    margin-bottom: 10px;
  }
}

@media (min-width: 992px) and (max-width: 1199.98px) {

  .nav-icon,
  .nav-icon:focus {
    /* background: #fff !important; */
  }

  .page-heading,
  .rc-content {
    text-align: center;
  }

  .contact-us h3,
  .content-heading,
  .modal-text h1,
  .responsive-heading,
  .section-heading {
    display: inline-block;
  }

  .content-heading.light:after,
  .small-logo {
    width: 65px;
  }

  .navigation {
    height: auto;
  }

  .nav-icon {
    color: #fff;
  }

  .menu-items {
    padding: 15px 0;
  }

  .accordion-heading,
  .menu-items li a {
    font-size: 14px;
  }

  .footer-logo {
    height: 100%;
  }

  .footer-content,
  .section {
    padding: 40px 0;
  }

  .footer-info {
    width: 100%;
  }

  .content-heading.light {
    font-size: 16px;
    padding-bottom: 15px;
  }

  .footer-content ul li {
    margin-bottom: 14px;
    font-size: 14px;
  }

  .copyright {
    line-height: 32px;
    font-size: 12px;
  }

  .footer-content ul {
    margin-top: 10px;
  }

  #welcome-bg {
    bottom: 18px;
    left: -73px;
    max-width: 100%;
  }

  .page-heading {
    margin-top: 123px;
    height: 139px;
  }

  .page-heading h1 {
    font-size: 26px;
  }

  .small-battery {
    width: 500px;
  }

  .responsive-heading {
    font-size: 18px;
    padding-bottom: 22px;
  }

  .battery-description {
    margin-bottom: 25px;
    font-size: 14px;
  }

  .battery-price-lg {
    font-size: 18px;
  }

  .cr,
  .mi-table-top h1 {
    font-size: 24px;
  }

  .why-choose-us {
    padding-bottom: 190px;
    margin-top: 70px;
  }

  #other-warranty-cells,
  .faq-section {
    margin-top: 40px;
  }

  .why-choose-us .paper {
    padding: 60px 80px 88px;
    min-height: 0;
  }

  .section-heading {
    font-size: 20px;
  }

  .section-heading:after {
    height: 3px;
    width: 82px;
  }

  .why-hover-left {
    left: 30px;
    top: -42px;
    width: 135px;
  }

  .why-hover-right {
    right: -100px;
    width: 230px;
  }

  .faq-section {
    background: url(../images/faq-bg.png) center bottom no-repeat;
    padding-bottom: 210px;
  }

  .f-14 {
    font-size: 14px;
    line-height: 22px;
  }

  .contact-us h3 {
    font-size: 26px;
  }

  .other-warranties-imgs {
    width: 150px;
    height: 100%;
  }

  #other-warranty-text {
    font-size: 22px;
  }

  .recond-heading {
    font-size: 16px !important;
  }

  .reconditioning {
    background-size: auto;
    display: flex;
    justify-content: center;
  }

  .reconditioning .paper {
    padding: 60px 35px;
    margin-top: 35px;
  }

  .cogs-wrapper {
    margin-top: 270px;
    margin-bottom: -34px;
  }

  .section-heading.medium {
    font-size: 18px;
    padding-bottom: 22px;
    font-weight: 700;
    line-height: 26px;
    display: inline-block;
  }

  .modal-main-wrapper {
    justify-content: center;
    padding-left: 20px;
    padding-right: 20px;
    margin-top: -79px;
    align-items: center;
  }

  .modal-main {
    margin-left: 0;
    margin-top: 40px;
  }

  .modal-close {
    position: absolute;
    top: 3px;
    right: 10px;
    background: 0 0;
  }

  .free-text {
    color: var(--primary-color);
    font-size: 20px;
  }

  .modal-text h1 {
    font-size: 20px;
    text-align: left;
  }

  .modal-main h1::after {
    width: 80px;
  }

  .modal-main-wrapper img {
    width: 93%;
  }

  .modal-text h1::after {
    width: 89px;
  }

  .mi-modal {
    min-height: auto;
  }
}

@media (min-width: 1300px) and (max-width: 1700px) {

  .nav-icon,
  .nav-icon:focus {
    /* background: #fff !important; */
  }

  .content-heading,
  .modal-text h1,
  .responsive-heading,
  .section-heading {
    display: inline-block;
  }

  .modal-text h1,
  .page-heading h1 {
    font-size: 28px;
  }

  .small-logo {
    width: 70px;
  }

  .navigation {
    height: auto;
  }

  .nav-icon {
    color: #fff;
  }

  .menu-items {
    /* padding: 15px 0; */
  }

  .accordion-heading,
  .menu-items li a {
    font-size: 14px;
  }

  .footer-logo {
    height: 100%;
  }

  .footer-content,
  .section {
    padding: 40px 0;
  }

  .footer-info {
    width: 100%;
  }

  .content-heading.light {
    font-size: 16px;
    padding-bottom: 15px;
  }

  .footer-content ul li {
    margin-bottom: 14px;
    font-size: 14px;
  }

  .copyright {
    line-height: 32px;
    font-size: 12px;
  }

  .content-heading.light:after {
    width: 65px;
  }

  .footer-content ul {
    margin-top: 10px;
  }

  #welcome-bg {
    bottom: -109px;
  }

  .page-heading {
    margin-top: 123px;
    height: 139px;
    text-align: center;
  }

  .responsive-heading {
    font-size: 24px;
    padding-bottom: 22px;
  }

  .battery-description {
    margin-bottom: 25px;
    font-size: 16px;
  }

  #other-warranty-text,
  .battery-price-lg {
    font-size: 22px;
  }

  .cr {
    font-size: 26px;
  }

  .why-choose-us {
    padding-bottom: 190px;
    margin-top: 70px;
  }

  #other-warranty-cells,
  .faq-section,
  .modal-main {
    margin-top: 40px;
  }

  .why-choose-us .paper {
    padding: 60px 80px 88px;
    min-height: 0;
  }

  .section-heading {
    font-size: 20px;
  }

  .section-heading:after {
    height: 3px;
    width: 82px;
  }

  .why-hover-left {
    left: 30px;
    top: -42px;
    width: 145px;
  }

  .why-hover-right {
    right: -100px;
    width: 250px;
  }

  .faq-section {
    background: url(../images/faq-bg.png) center bottom no-repeat;
    padding-bottom: 210px;
  }

  .f-14 {
    font-size: 14px;
    line-height: 22px;
  }

  .other-warranties-imgs {
    width: 150px;
    height: 100%;
  }

  .modal-main {
    margin-left: 0;
  }

  .free-text {
    color: var(--primary-color);
    font-size: 22px;
  }

  .modal-text h1 {
    text-align: left;
  }

  .modal-main h1::after {
    width: 90px;
  }

  .modal-main-wrapper img {
    width: 93%;
  }

  .modal-text h1::after {
    width: 89px;
  }

  .mi-modal {
    min-height: auto;
  }

  .mi-table-top h1 {
    font-size: 24px;
  }
}

@media (max-width: 992px) {
  .nav-item.btn-group {
    display: block;
  }
}

@media (max-width: 1300px) {
  .hybrid-section-heading::after {
    margin-left: 0;
  }

  .hybrid-section-heading {
    display: flex;
    align-items: flex-end;
  }
}

@media (max-width: 575.98px) {
  #welcome_video iframe {
    height: auto !important;
  }
}


@media (min-width: 992px) {
  header.fixed-top {
    /* display: none; */
  }

}