.title {
    color: #86c232;
    font-size: 30px;
    font-family: 'Roboto', sans-serif;
}
.header {
    background-color: #222629;
}
.header-text {
    color: aliceblue;
    font-size: 22px;
    font-family: 'Roboto', sans-serif;
    transition-duration: 0.3s;
}
.header-text.active {
    font-weight: 700;
    font-family: 'Roboto', sans-serif;
    border-bottom-color: aliceblue;
}
.header-text:hover {
    color: #86c232;
}
.icon-background {
    background-color: #61892f;
}
.footer {
    background-color: #222629;
    margin-top: 16px;
    flex: 0 0 auto;
}
.footer-text {
    color: aliceblue;
    font-size: 22px;
    font-family: 'Roboto', sans-serif;
}
body {
    padding-top: 6em;
    background-color:whitesmoke;
 }
.our-products-text {
    color: #222629;
    text-align: center;
    margin-bottom: 24px;
    margin-top: 2px;
    font-family: 'Roboto', sans-serif;
 }
 .card:hover {
    transition-duration: 0.3s;
    background-color: rgba(0, 0, 0, 0.1);
  }
  .my-toggler {
    color: #86c232;
  }
  .contact-card {
    font-family: 'Roboto', sans-serif;
    max-width: 550px;
    margin-bottom: 25px;
  }
  .map {
    position: relative; 
    overflow: hidden;
    justify-content: left;
    max-width: 550px;
  }
  .contact-icons {
    color:#86c232;
  }
  .contact-margin {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .benefits {
    font-family: 'Roboto', sans-serif;
    font-size: 18px;
  }
  .main-page-products-button {
    color: #222629;
    font-size: 18px;
    text-decoration: none;
    border-radius: 5px;
    background-color: #86c232;
    background-size: auto;
    padding: 0.375rem 0.75rem;
    border: none;
  }
  .main-page-products-button:hover {
    transition-duration: 1s;
    color: #222629;
    background-color: #61892f;
  }
  .main-page-contacts-button {
    color: #222629;
    font-size: 18px;
    text-decoration: none;
    border-radius: 5px;
    background-color: #989c9e;
    background-size: auto;
    padding: 0.375rem 0.75rem;
    border: none;
  }
  .main-page-contacts-button:hover {
    transition-duration: 1s;
    background-color: #6b6e70;
    color: #222629;
  }
  .main-icons {
    color: #86c232;
  }
  .footer-text-logo {
      font-weight: bold;
  }
  .main-text-first {
    font-size: 44px;
    font-family: 'Roboto', sans-serif;
  }
  .main-text-second {
    font-size: 26px;
    font-family: 'Roboto', sans-serif;
  }
  .contact-card-title {
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    font-size: 22px;
 }
  .contact-card-text {
    font-family: 'Roboto', sans-serif;
    font-size: 19px;
 }