/* Media For All Screen To Responsive Design */
/* For 2xs (xx-small) Screen */
@media (min-width: 320px) and (max-width: 474px) {

  /* Start Hero  */
  .hero .hero-screen-phone {
    width: 15rem !important;
  }

  .hidden-xs-footer {
    display: none !important;

  }

  .hero {
    overflow: hidden;
    padding: 0 0 20rem 0;
  }

  .hero .btns .try-now {
    padding: 0.1rem 1rem !important;
    font-size: .8rem !important;
    background-color: var(--third-color);
  }

  .hero .hero-text-1 h3 {
    font-size: 1rem;
    line-height: 26px;
  }

  .hero .hero-text-1 h2 {
    font-size: 1rem;

  }

  .hero .social-media {
    right: 43% !important;
    top: 60%;
  }

  .content {
    overflow: hidden;
  }

  .content .cont-extrct-t h5 {
    color: var(--secondary-color) !important;
    font-size: 1rem;
  }

  .features .part-one .row-one .col-lg-6,
  .features .part-one .row-tow .col-lg-6 {
    width: 100% !important;
  }

  .features {
    padding: 20px;
  }

  .img-icon-last {
    width: 15rem !important;
  }

  .support {
    padding: 0 !important;
    margin: 0;
  }

  .support .row {
    padding: 25px 0 !important;
  }

  .content .content-one p,
  .content .content-tow p,
  .content .content-three p,
  .content .cont-extrct-t p {
    padding-left: 0 !important;
    color: var(--dark-mode-color) !important;
  }

  .footer-bottom .list-footer {
    display: flex !important;
    text-align: center;
    margin: auto;
  }

  /* End Hero  */
}

/* For Xs (x-small) Screen */
@media (min-width: 475px) and (max-width: 639px) {}

/* For Sm (small) For Tablet Screen */
@media (min-width: 640px) and (max-width: 767px) {}

/* For Md (medium) Screen */
@media (min-width: 768px) and (max-width: 1023px) {}

/* For Lg (large) For Laptop Screen */
@media (min-width: 1024px) and (max-width: 1279px) {

  /* Start-Our-Services */
  .our-services .col-lg-3 {
    width: 32%;
  }

  .our-services .col-lg-6 {
    width: 66%;
  }

  /* End-Our-Services */
}

/* For Xl (x-large) For Desktop Screen */
@media (min-width: 1280px) and (max-width: 1535px) {

  /* Start-Our-Services */
  .our-services .col-lg-3 {
    width: 32%;
  }

  .our-services .col-lg-6 {
    width: 66%;
  }

  /* End-Our-Services */
}

/* For 2xl (xx-large) Screen */
@media (min-width: 1536px) {

  /* Start-Our-Services */
  .our-services .col-lg-3 {
    width: 32%;
  }

  .our-services .col-lg-6 {
    width: 66%;
  }

  /* End-Our-Services */
}