/* TITLE */
@media screen and (max-width: 1250px) {
  .title {
    font-size: 30px !important;
    top: 30% !important;
    margin-top: 50px !important;
    margin-right: 10px !important;
  }
}
@media screen and (max-width: 768px) {
  .title {
    font-size: 18px !important;
    top: 30% !important;
    margin-top: 50px !important;
    margin-right: 10px !important;
  }
}
@media screen and (max-width: 480px) {
  .title {
    font-size: 18px !important;
    top: 30% !important;
    margin-top: 50px !important;
    margin-right: 10px !important;
  }
}


/* TITLE-DESCRIPTION */
@media screen and (max-width: 1250px) {
  .bannertext {
    font-size: 20px !important;
    left: 40% !important;
    text-align: center !important;
    margin-right: -30% !important;
    transform: translate(-40%, -50%) !important;
    margin-top: 20px !important;
    word-wrap: break-word !important;
  }
@media screen and (max-width: 768px) {
  .bannertext {
    font-size: 10px !important;
    left: 50% !important;
    text-align: center !important;
    margin-right: -30% !important;
    transform: translate(-40%, -50%) !important;
    margin-top: 20px !important;
    word-wrap: break-word !important;
  }

  .typing-line {
    white-space: normal;
  }
}

@media screen and (max-width: 480px) {
  .bannertext {
    font-size: 10px !important;
    left: 40% !important;
    text-align: center !important;
    margin-right: -30% !important;
    transform: translate(-40%, -50%) !important;
    margin-top: 20px !important;
    word-wrap: break-word !important;
  }

  .typing-line {
    white-space: normal;
  }
}


  .typing-line {
    white-space: normal;
  }
}

/* 6buttons */
@media (max-width: 1250px) {
  .container {
    grid-template-columns: 1fr 1fr 1fr 1fr !important;
    margin: 0px !important;
    margin-top: -300px !important;
    margin-bottom: 300px !important;
    margin-left: 2% !important;
    margin-right: 2% !important;
  }


}
@media screen and (max-width: 768px) {
  .container {
    margin: 0px !important;
  }
}


@media (max-width: 480px) {
  .container {
    grid-template-columns: 1fr !important;
    margin: 0px !important;
    margin-top: -300px !important;
    margin-bottom: 300px !important;
    margin-left: 10% !important;
    margin-right: 10% !important;
  }
}
  @media (max-width: 768px) {
    .container {
      grid-template-columns: 1fr !important;
      margin: 0px !important;
      margin-top: -300px !important;
      margin-bottom: 300px !important;
      margin-left: 10% !important;
      margin-right: 10% !important;
    }
  

  .item1,
  .item2,
  .item3,
  .item4,
  .item5 {
    grid-area: auto !important; /* Reset the grid area to its default */
    max-height: 150px !important;
    min-height: 150px !important;
  }
}

@media (max-width: 768px) {
  .container {
    grid-template-columns: 1fr !important;
    margin: 0px !important;
    margin-top: -300px !important;
    margin-bottom: 300px !important;
    margin-left: 10% !important;
    margin-right: 10% !important;
  }


  .item1,
  .item2,
  .item3,
  .item4,
  .item5 {
    grid-area: auto !important; /* Reset the grid area to its default */
    max-height: 150px !important;
    min-height: 150px !important;
  }
}





@media screen and (max-width: 768px) {
  .container2 {
    margin: 0px !important;
  }
}
@media screen and (max-width: 480px) {
  .container2 {
    margin: 0px !important;
  }
}
/* 6buttons sizing */
@media screen and (max-width: 768px) {
  .image-container {
    margin: 0px !important;

  }
}
@media screen and (max-width: 480px) {
  .image-container {
    margin: 0px !important;

  }
}
/* 6buttons sizing part 2*/
@media screen and (max-width: 768px) {
  .image-container2 {
    margin: 0px !important;
    width: 100px !important;
    height: 70px !important;
  }
}
@media screen and (max-width: 480px) {
  .image-container2 {
    margin: 0px !important;
    width: 100px !important;
    height: 70px !important;
  }
}
/* 6buttons spacing */
@media screen and (max-width: 768px) {
  .box {
    margin-left: 5px !important;
    margin-right: 5px !important;
    margin-bottom: 50px !important;
  }
}

@media screen and (max-width: 480px) {
  .banner-container {
    margin-top: 230px !important;
  }
}
/* 6buttons spacing */
@media screen and (max-width: 768px) {
  .banner-container {
    margin-top: 230px !important;
  }
}

@media screen and (max-width: 480px) {
  .box {
    margin-left: 5px !important;
    margin-right: 5px !important;
    margin-bottom: 50px !important;
    margin-top: -30px !important;
  }
}
@media screen and (max-width: 76px) {
  .box {
    margin-left: 5px !important;
    margin-right: 5px !important;
    margin-bottom: 50px !important;
    margin-top: -30px !important;
  }
}
/* 6buttons text */
@media screen and (max-width: 768px) {
  .box2 {
    font-size: 20px !important;
    transform: translate(-50%,-90%) !important;
  }
}
@media screen and (max-width: 480px) {
  .box2 {
    font-size: 20px !important;
    transform: translate(-50%,-90%) !important;
  }
}

/* andrewkelso-text */
@media screen and (max-width: 768px) {
  .banner-container2 {
    font-size: 15px !important;
  }
}
@media screen and (max-width: 480px) {
  .banner-container2 {
    font-size: 15px !important;
  }
}
@media screen and (max-width: 1250px) {
  .contact-button {
    font-size: 30px !important;
    margin-top: 350px;
  }
}

@media screen and (max-width: 768px) {
  .contact-button {
    font-size: 15px !important;
    margin-top: 200px;
  }
}
@media screen and (max-width: 480px) {
  .contact-button {
    font-size: 15px !important;
    margin-top: 200px;
  }
}

/* contact nav bar */
@media screen and (max-width: 1250px) {
  .contact-container {
    font-size: 15px !important;
    padding: 0px !important;
  }
}
@media screen and (max-width: 768px) {
  .contact-container {
    font-size: 15px !important;
    padding: 0px !important;
  }
}
@media screen and (max-width: 480px) {
  .contact-container {
    font-size: 15px !important;
    padding: px !important;
  }
}
/* contact nav bar text */
@media screen and (max-width: 768px) {
  .contact-text {
    font-size: 12px !important;
  }
}
@media screen and (max-width: 480px) {
  .contact-text {
    font-size: 12px !important;
  }
}
@media screen and (max-width: 1250px) {
  .contact-text {
    font-size: 12px !important;
  }
}
/* contact nav bar icon */
@media screen and (max-width: 768px) {
  .contact-item i {
    font-size: 15px !important;
  }
}
@media screen and (max-width: 480px) {
  .contact-item i {
    font-size: 15px !important;
  }
}
@media screen and (max-width: 1250px) {
  .contact-item i {
    font-size: 15px !important;
  }
}
/* contact nav bar nav bar positioning */
@media screen and (max-width: 1250px) {
  .navbar {
    padding-top: 30px !important;
  }
}
@media screen and (max-width: 768px) {
  .navbar {
    padding-top: 30px !important;
  }
}
@media screen and (max-width: 480px) {
  .navbar {
    padding-top: 30px !important;
  }
}

/* navbar button resizing */
@media screen and (max-width: 1250px) {
  .navbar li a {
    font-size: 25px !important;
    padding: 10px 13px !important;
  }
}
@media screen and (max-width: 768px) {
  .navbar li a {
    font-size: 15px !important;
  }
}
@media screen and (max-width: 480px) {
  .navbar li a {
    font-size: 15px !important;
    padding: 10px 13px !important;
  }
}

/* services navbar button resizing */
@media screen and (max-width: 1250px) {
  .services-navbar li a {
    font-size: 25px !important;
    padding: 10px 13px !important;
  }
}
@media screen and (max-width: 768px) {
  .services-navbar li a {
    font-size: 15px !important;
  }
}
@media screen and (max-width: 480px) {
  .services-navbar li a {
    font-size: 15px !important;
    padding: 10px 13px !important;
  }
}

/* contact nav bar nav bar positioning */
@media screen and (max-width: 1250px) {
  .services-navbar {
    padding-top: 30px !important;
  }
}

@media screen and (max-width: 768px) {
  .services-navbar {
    padding-top: 30px !important;
  }
}
@media screen and (max-width: 480px) {
  .services-navbar {
    padding-top: 30px !important;
  }
}
@media screen and (max-width: 1250px) {
  .aboutus-subtext {
    font-size: 15px !important;
    padding-right: 0px !important;
  }
}
@media screen and (max-width: 768px) {
  .aboutus-subtext {
    font-size: 15px !important;
    padding-right: 0px !important;
  }
}
@media screen and (max-width: 480px) {
  .aboutus-subtext {
    font-size: 15px !important;
    padding-right: 0px !important;
  }
}


@media screen and (max-width: 1250px) {
  .aboutus {
    margin-left: -100px !important;
    display: inline-block;
    grid-template-columns: 20% 20%;
    grid-row-gap: 40px;
    padding-top: 50px !important;
    grid-column-gap: 0px !important;
    margin-top: 150px;
    padding-left: 20px;
    padding-right: 20px;

  }
  .aboutus-img {
    text-align: center;
    margin-left: 70px;
  }
}
@media screen and (max-width: 768px) {
  .aboutus {
    margin-left: -100px !important;
    display: inline-block;
    grid-template-columns: 1fr;
    grid-row-gap: 40px;
    margin-top: 150px;
    padding-top: 270px !important;
    padding-left: 20px;
    grid-column-gap: 0px !important;
    padding-right: 20px;
  }
  .aboutus-img {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .aboutus {
    margin-left: -100px !important;
    display: inline-block;
    grid-template-columns: 1fr;
    grid-row-gap: 40px;
    padding-top: 150px !important;
    grid-column-gap: 0px !important;
    margin-top: 150px;
    padding-left: 20px;
    padding-right: 20px;
  }
  .aboutus-img {
    display: none;
  }
}

@media screen and (max-width: 768px) {
  .aboutus-subtext_large {
    font-size: 20px !important;
  }
  .aboutus-subtext_large2 {
      font-size: 20px !important;
  }
}
@media screen and (max-width: 480px) {
  .aboutus-subtext_large {
    font-size: 20px !important;
  }
  .aboutus-subtext_large2 {
    font-size: 20px !important;
  }
}

@media screen and (max-width: 1250px) {
  .criteria-container {
    padding-left: 0px !important;
    padding-right: 0px !important;
    grid-template-rows: 1fr 0.2fr !important;
  }
  .checkmark-txt {
    font-size: 16px !important;
  }
  .checkmark-img {
    scale: 0.4 !important;

  }
@media screen and (max-width: 768px) {
  .criteria-container {
    display: none !important;
  }
  .socialmedia-container {
      display: none !important;
  }
}
@media screen and (max-width: 480px) {
  .criteria-container {
    display: none !important;
  }
  .socialmedia-container {
    display: none !important;
}

}


  .socialmedia-container {
    display: none !important;
}

}
@media screen and (max-width: 1250px) {
  .read-more {
    padding: 8px 8px !important;
    font-size: 15px !important;
    width: 75% !important;
  }
}
@media screen and (max-width: 768px) {
  .read-more {
    padding: 8px 8px !important;
    font-size: 15px !important;
    width: 75% !important;
  }
}
@media screen and (max-width: 480px) {
  .read-more {
    padding: 8px 8px !important;
    font-size: 15px !important;
    width: 75% !important;
  }
}

@media screen and (max-width: 1250px) {
  .services-left-side{
    font-size: 30px !important;
  }
}
@media screen and (max-width: 768px) {
  .services-left-side{
    font-size: 30px !important;
  }
}
@media screen and (max-width: 480px) {
  .services-left-side{
    font-size: 30px !important;
  }
}
@media screen and (max-width: 1250px) {
  .services-container{
    height: 300px;
  }
}
@media screen and (max-width: 768px) {
  .services-container{
    height: 600px;
  }
}
@media screen and (max-width: 768px) {
  .services-container{
    flex-direction: column !important;
  }
}
@media screen and (max-width: 480px) {
  .services-container{
    flex-direction: column !important;
  }
}
@media screen and (max-width: 1250px) {
  .services-left-side h1{
    line-height: 70px !important;
  }
}
@media screen and (max-width: 768px) {
  .services-left-side h1{
    line-height: 70px !important;
  }
}
@media screen and (max-width: 480px) {
  .services-left-side h1{
    line-height: 70px !important;
  }
}
@media screen and (max-width: 1250px) {
  .section-title{
    font-size: 60px !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    overflow: auto !important;
  }
}
@media screen and (max-width: 768px) {
  .section-title{
    font-size: 40px !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    overflow: auto !important;
  }
}
@media screen and (max-width: 480px) {
  .section-title{
    font-size: 40px !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    overflow: auto !important;
  }
}

@media screen and (max-width: 768px) {
  .services-section{
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    overflow: auto !important;
  }
}
@media screen and (max-width: 480px) {
  .services-section{
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    overflow: auto !important;
  }
}
@media screen and (max-width: 1250px) {
  .card{
    width: 40%!important;
    overflow: auto !important;
    max-height: 500px !important;
    min-height: 300px !important;
  }
}
@media screen and (max-width: 768px) {
  .card{
    width: 100%!important;
    overflow: auto !important;
    max-height: 500px !important;
  }
}
@media screen and (max-width: 480px) {
  .card{
    width: 100%!important;
    overflow: auto !important;
    max-height: 500px !important;
  }
}
@media screen and (max-width: 1250px) {
  .section-description{
    padding-left: 0% !important;
    padding-right: 0% !important;
  }
}
@media screen and (max-width: 768px) {
  .section-description{
    padding-left: 0% !important;
    padding-right: 0% !important;
  }
}
@media screen and (max-width: 480px) {
  .section-description{
    padding-left: 0% !important;
    padding-right: 0% !important;
  }
}