/* Small Devices (Phones) */











/* Large Devices (Tablets) */
@media screen and (min-width: 577px) and (max-width: 1198px) {
  .mobile-bg {
    display: none;
  }

  .footer-mobile {
    display: none;
  }


}




/* Extra Extra Large Devices (Large Desktops) */
@media (min-width: 1400px) {

  /* Styles for extra-large desktop screens */
  .mobile-bg {
    display: none;
  }

  .intro-home {
    top: 20%;
  }

  .footer-mobile {
    display: none;
  }

  .aboutus-img {
    justify-content: flex-end;
  }

  .aboutus-text p {
    padding-right: 2em;
  }


}

@media (max-width: 1399px) {
  .intro-home {
    top: 10%;
  }
}

@media (max-width: 1200px) {
  /* Styles for desktop screens */

  .intro-home {}

  .aboutus-container {
    gap: 0em;
  }

  .aboutus-img {
    justify-content: flex-end;
  }

  .aboutus-text p {
    font-size: 16px;
    padding-right: 2em;
  }

  .img-about1 {
    width: 30vw;
  }

  .img-about2 {
    width: 30vw;
  }

  .img-about3 {
    width: 30vw;
  }

  .aboutus-text p {
    font-size: 2vw;
    padding-right: 2em;
  }

  .vission-box {
    min-width: 30em;
    max-width: 20em !important;
    height: auto;
  }

  .mission-box {
    min-width: 30em;
    max-width: 20em !important;

  }

  .chooseus-container {

    width: 50em;

  }

  .card {
    min-width: 24em !important;
    max-width: 15em !important;
    height: auto;
  }

  .card h2 {
    font-size: 1em;
  }

  .card-img {
    width: 100px;
  }

  .form-container {
    width: 40em;
  }


  .title-cards {
    font-size: 2.5em;
  }

}

/* Extra Large Devices (Desktops) */
@media (min-width: 1200px) {

  /* Styles for desktop screens */
  .mobile-bg {
    display: none;
  }

  .footer-mobile {
    display: none;
  }

  .intro-home {}

  .aboutus-img {
    justify-content: flex-end;
  }

  .aboutus-text p {
    padding-right: 2em;
  }

  .chooseus-container {
    width: 60em;
  }

  .card {
    min-width: 27em;
    max-width: 25em;
    height: 14em;
  }

  .card h2 {

    font-size: 16px;
  }

  .card-img {
    width: 130px;
  }

  .input-form-contact {
    width: 20em !important;
  }



}



/* Large Devices (Tablets) */
@media (max-width: 992px) {

  .product-container {
    margin-top: 1em;

  }



  .form-container {
    width: 40em;
  }

  .card-flex {
    width: 220;
  }


  .chooseus-container {
    width: 48em;
  }

  .vission-box {
    height: auto;
  }



}




/* Medium Devices (Tablets) */
@media (max-width: 768px) {
  .bg-container {
    min-height: 10rem !important;
    max-height: 25rem !important;
  }

  .intro-home {}


  .icon {
    width: 16px;
    height: 16px;
    transition: all 0.3s ease-in-out;
  }

  .aboutus-container {
    gap: 0em !important;
  }

  .aboutus-text h2 {
    padding: 0;
  }

  .aboutus-text p {
    font-size: 16px;
    padding-right: 2em;
  }

  .aboutus-img {
    justify-content: flex-end;
  }

  .img-about1 {
    width: 30vw;
  }

  .img-about2 {
    width: 30vw;
  }

  .img-about3 {
    width: 30vw;
  }


  .vission-box {
    min-width: 22em ;
    max-width: 22em ;
    min-height: 23em ;
    max-height: 23em ;
  }

  .mission-box {
    min-width: 22em ;
    max-width: 22em ;

  }

  .product-container-flex {
    justify-content: center;
  }


  .product-container {

    font-size: 12px;
  }

  .product-container {

    font-size: 12px;
  }

  .payment-box {
    width: 50%;
  }

  .platform-box {
    width: 50%;

  }

  .our-services-section {
    margin-top: 27em;
  }


  .services-container {

    font-size: 12px;
  }

  .services-container {

    font-size: 12px;
  }

  .itconsultancy-box {
    width: 50%;
  }

  .operation-box {
    width: 50%;

  }

  .operation-box h3 {
    text-align: left;
    font-size: 1em;
  }

  .our-services-box1 {

    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    min-width: 20em;


  }

  .our-services-img1 {
    width: 100px;
  }

  .chooseus-container {
    width: 30em !important;

  }

  .card {
    min-width: 27em !important;
    max-width: 10em !important;
    height: auto;
  }

  .contactus-container {
    padding: 2em;
  }

  .form-container {
    width: 34em;

  }

  .form-h1 {
    font-size: 1.5em;
  }

  .footer-logo {
    width: 10em;
  }


}

@media screen and (max-width: 768px) and (min-width: 736px) {
  .our-services-section {
    margin-top: 10em;
  }


}

@media screen and (min-width: 769px) and (max-width: 991px) {
  .our-services-section {
    margin-top: 25em !important;
  }


}





@media (max-width: 576px) {

  html {}

  .bg-container {
    display: none;
  }

  .mobile-bg {
    max-height: 55rem !important;
    min-height: 50rem !important;
  }

  .intro-home-mobile {

    text-align: center;
    padding: 1em;
    text-transform: uppercase;
    font-weight: 200;
    color: #073767;
    font-size: 2em;
  }

  .intro-home-mobile h2 {
    margin-top: 2em;
    text-shadow: rgb(151, 203, 255) 0 0 10px;

  }



  .aboutus-container {
    gap: 0em !important;
  }

  .aboutus-container {
    flex-wrap: wrap;
    margin-top: -12em;
  }

  html {
    overflow-x: hidden;
  }

  .img-about1 {
    display: none;
  }

  .img-about2 {
    display: none;
  }

  .img-about3 {
    width: 80vw !important;
  }

  .aboutus-img {
    justify-content: center !important;
  }

  .aboutus-container {
    display: flex;
    justify-content: center;
    margin-top: 1em;
    gap: 0;

  }



  .aboutus-text p {
    font-size: 1em !important;
    padding: 1em 0;

  }

  .aboutus-text h2 {
    text-align: center;

  }



  .product-container-flex {
    justify-content: center;
  }

  .mission-box {
    min-width: 22em !important;
    max-width: 22em !important;

  }

  .product-container {
    margin-top: 5em;
    font-size: 12px;
    padding: -1em;
    width: 100%;

  }

  .payment-box {
    min-width: 37em !important;
    max-width: 37em !important;
    padding: 0em 4em;



  }

  .platform-box {
    min-width: 37em !important;
    max-width: 37em !important;
    padding: 0em 4em;

  }

  .aboutus-text {
    padding: 2em;
  }

  .vission-box {
    height: auto !important;
  }

  .services-container-flex {
    justify-content: center;
  }



  .services-container {
    margin-top: 1em;
    font-size: 12px;
    padding: -1em;
    width: 100%;

  }

  .itconsultancy-box {
    min-width: 37em !important;
    max-width: 37em !important;
    padding: 0em 4em;



  }

  .operation-box {
    min-width: 37em !important;
    max-width: 37em !important;
    padding: 0em 4em;

  }


  /* .our-services-box1{

    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    min-width: 22em;
    max-width: 22em;

  }
  .our-services-box1 p {
    padding: 0;
  }

  .our-services-img1{
    width: 200px;
  } */

  .chooseus-container {
    width: 20em !important;

  }

  .chooseus-container h1 {
    text-align: center;
    font-size: 2em;
  }

  .card-flex {}

  .card {
    min-width: 22em !important;
    max-width: 22em !important;
    height: 10em;
  }

  .card h2 {
    font-size: 12px;
  }

  .card p {
    font-size: 12px;
  }

  .card-img {
    width: 100px;
  }

  .contactus-container {
    text-align: center;
  }

  .contactus-container p {
    text-align: center;
  }


  .form-container {
    width: 20em;

  }

  .form-h1 {
    font-size: 1em;
  }

  .contact-form h1 {
    font-size: 14px;
    flex-wrap: wrap;
  }

  .input-container {
    display: block;
    flex-direction: row;
    width: 100%;
  }

  .input-form-contact {
    font-size: 16px !important;


  }

  .title-container {
    font-size: 1.7em;
  }

  .button {
    margin: 1em 0;
  }

  .footer-div1 {
    display: none;
  }

  .footer-div2 {
    width: 35%;
  }


  .footer-div3 {
    width: 50%;

  }

  .footer-mobile {
    text-align: center;
    margin: 1em;
  }

  .line1 {
    color: #2861b7;
    background: #2861b7;
    width: 40%;

  }

  .footer-copyright {
    font-size: 12px;
  }

  .contactus-container h1 {
    font-size: 2em;
  }

  .title-cards {
    padding: 10px;
    font-size: 1.8em;
  }

  .thumb1 {
    width: 19em;
    height: 17em;
  }

  .banner-text {
    padding: 2em;
  }


  .banner-text h1 {
    font-size: 2em;
  }

  .contact-text {
    width: 25em;
    padding: 2em;
  }



  .contact-text h1 {
    font-size: 2.2em;
  }

  .contact-flex {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
  }

  .contact-email {
    width: 20em;
  }

  .contact-address {
    width: 20em;
    border-right: none;
  }

  .maps {
    width: 320px;
    height: 200px;
  }

  .footer-logo {
    width: 10em;
  }

  .product-card {
    width: 22em;
  }

  .banner-icon1 {
    width: 45px;
  }

  .banner-icon2 {
    width: 50px;
  }

  .icon-1 h3 {
    font-size: .7em;
  }

  .contact-flex {
    gap: 2em;
  }

  .jumbutron {
    height: 23em;
  }

  .breadcrum h1{
    font-size: 2.5em;
  }


}

@media (max-width: 425px) {
  .mobile-bg {
    max-height: 50rem !important;
    min-height: 50rem !important;
  }

  .product-container {
    min-width: 25em;
    max-width: 25em;
    font-size: 14px;
    padding: 1em;
  }



  .payment-box {
    min-width: 25em !important;
    max-width: 25em !important;
    padding: 0.5em;


  }

  .platform-box {
    min-width: 25em !important;
    max-width: 25em !important;
    padding: 0.5em;
  }


  .our-services-section {
    margin-top: 27em;
  }



  .chooseus-container {
    width: 22em !important;

  }

  .card {
    height: auto;
  }

  .chooseus-container h1 {
    font-size: 1.5em !important;

  }

  .footer-div1,
  .footer-div3 p {
    font-size: 14px;
  }

  html {}


}


@media (max-width: 375px) {

.intro-home-mobile h2{
  font-size: 1.3em;
}

.product-card{
  width: 22em;
  font-size: 14px;
}

.product-card p{

  font-size: 12px;
}

.footer-div3 a{
  font-size: 14px;
}

.footer-div3 p{
  font-size: 14px;
}
}