/*============== 
  TV Screens 
================*/
@media(min-width: 1441px) {
  /*  */
}

/*============== 
  Extra Large 
================*/
@media(max-width: 1440px) {
  /*  */
}

/*============== 
     Large 
================*/
@media(max-width: 1280px) {
  /*  */
}

/*============== 
     Medium 
================*/
@media(max-width: 1025px) {

  /* styling about medica section */
  #about_medica {
    .content {
      flex-direction: column-reverse;
      align-items: start;
      gap: 80px;

      .info {
        .title {
          font-size: 40px;
        }
      }

      .image {
        position: relative;
        align-self: end;

        img {
          width: 400px;
          position: relative;
          top: 50px;
        }
      }
    }
  }

  /* styling our services section */
  #our_services {
    padding-block: 0;

    .content {
      align-items: start;
      flex-direction: column;

      .image {}

      .info {
        .services-list {
          display: flex;
          justify-content: center;
          flex-wrap: wrap;
          margin-top: 20px;
          gap: 20px;

          li {
            margin-inline-start: 0 !important;
            width: fit-content !important;
          }
        }
      }
    }
  }

  /* styling overseas section */
  #overseas {
    .content {
      width: 600px;
    }
  }
}

/*============== 
    Tablet 
================*/
@media(max-width: 768px) {

  /* styling about medica section */
  #about_medica {
    .content {
      flex-direction: column-reverse;
      align-items: start;
      gap: 80px;

      .info {
        text-align: center;

        .title {
          font-size: 40px;
        }
      }

      .image {
        position: relative;
        align-self: end;

        img {
          width: 100%;
          max-width: 400px;
          position: relative;
          top: 50px;
        }
      }
    }
  }

  /* styling our services section */
  #our_services {
    padding-block: 0;

    .content {
      align-items: start;
      flex-direction: column;

      .image {
        &::after {
          top: -40px;
        }
      }

      .info {
        .services-list {
          display: flex;
          justify-content: center;
          flex-wrap: wrap;
          margin-top: 20px;
          gap: 20px;

          li {
            margin-inline-start: 0 !important;
            width: fit-content !important;
          }
        }
      }
    }
  }

  /* styling overseas section */
  #overseas {
    .content {
      width: 100%;
      max-width: 700px;
    }
  }
}

/*============== 
     Mobile 
================*/
@media(max-width: 576px) {

  /* styling about medica section */
  #about_medica {
    padding-top: 30px;

    .content {
      flex-direction: column-reverse;
      align-items: start;
      gap: 80px;

      .info {
        text-align: center;
        .sub-title {
          font-size: 18px;
        }
        .title {
          font-size: 25px;
          line-height: 40px;
        }
        .description {
          font-size: 16px;
          line-height: 25px;
        }
        
      }

      .image {
        align-self: end;

        img {
          width: 100%;
          max-width: 400px;
          top: 50px;
        }
      }
    }
  }

  /* styling our services section */
  #our_services {
    padding-block: 0;

    .content {
      align-items: start;
      flex-direction: column;

      .image {
        &::after {
          height: 80%;
          width: 70%;
          top: -40px;
        }
      }

      .info {
        .services-list {
          display: flex;
          justify-content: center;
          flex-wrap: wrap;
          margin-top: 20px;
          gap: 10px;

          li {
            margin-inline-start: 0 !important;
            width: fit-content !important;
          }
        }
      }
    }
  }

  /* styling overseas section */
  #overseas {
    .content {
      width: 100%;
      max-width: 700px;
      .description {
        font-size: 16px;
      }
    }
  }
}