@media only screen and (min-width: 1361px) and (max-width: 1920px) {
     #top-scroll {
          top: 523px;
     }


     .main-area .heading {
          width: 30%;
          text-align: center;
          margin-top: 7px;
     }

     .main-area .select-area {
          margin-top: 11px;
          width: 50%;
          text-align: center;
     }

     .main-area .content .links {
          margin: 13px 0;
          width: 20%;
          text-align: center;
     }

     .about-area .img-area img {
          right: 60px;
     }

     #blog-area .border-1 {
          left: 38%;
     }
     
     #blog-area .border-2 {
          left: 39.50%;
     }

     #blog-area .border-3 {
          left: 59%;
     }

     #blog-area .border-4 {
          left: 59%;
     }

     .card-area .card {
          flex-basis: 23%;
     }

     #team-area .img-area:first-child {
          flex-basis: 25%;
     }

     #team-area .img-area {
          flex-basis: 25%;
     }

     #team-area .img-area:last-child {
          flex-basis: 25%;
     }

     #partner-area .child-partner {
          padding: 0px 88px;
     }

}

@media only screen and (min-width: 360px) and (max-width: 428px) {
     #header-area {
          display: flex;
          flex-direction: column;
          height: 100%;
     }

     #header-area .contact-area {
          display: flex;
          flex-direction: column;
          margin-top: -71px;
          margin-bottom: 15px;
          padding-left: 12px;
          animation-name: position-c;
          animation-duration: 2s;
     }

     @keyframes position-c {
          0%{
               transform: translate(0px, 25px);   
          }
     }

     #header-area .logo-area {
          text-align: right;
     }

     #header-area .logo-area img {
          width: 180px;
          margin-left: 0px;
          animation-name: img-position;
          animation-duration: 2s;
     }

     @keyframes img-position {
          0%{
               transform: translate(25px, 0px);
          }
     }

     /* #header-area .fa-location-dot {
          padding: 6px 8px;
     } */

     #header-area .fa-solid {
          top: 1px;
          left: -4px;
          padding: 7px 8px;
          font-size: 1rem;
     }

     #header-area .fa-regular {
          padding: 7px 7px;
          font-size: 1rem;
     }

     #header-area .contact-area .child-contact p {
          font-size: .85rem;
          padding-left: 18px;
     }

     #header-area .contact-area .child-contact {
          margin-bottom: 10px;
     }

     #top-scroll {
          bottom: 0px;
          right: 0px;
     }

     #top-scroll {
          top: 737px;
     }

     #main-menu {
          width: 91%;
          display: flex;
          flex-direction: column;
          top: -19px;
          left: 17px;
          padding-left: 8px;
     }

     #main-menu ul li a {
          display: inline-block;
          color: #fff;
          margin-right: 9px;
          font-size: .97rem;
          transition: 0.5s;
          padding-bottom: 10px;
          
     }

     #main-menu .search-area {
          text-align: left;
     }

     #main-menu .fa-magnifying-glass {
          margin-right: 0;
     }

     #main-menu .fa-envelope {
          margin-right: 0px;
     }

     #main-menu .search-area input {
          margin-left: 5px;
     }

     .hero-area {
          height: 650px;
          animation-name: background-ani;
          animation-duration: 5s;
          animation-delay: 2s;
     }

     @keyframes background-ani {
          0% {
               height: 0px;
          }

          100% {
               height: 650px;
          }
     }


     .hero-area .heading h1 {
          font-size: 1.6rem;
          margin-top: 10px;
     }

     .hero-area .heading p {
          font-size: 0.7rem;
     }

     .main-area {
          width: 100%;
          /* margin: auto; */
          position: relative;
          background: red;
     }

     .main-area .content {
          width: 100%;
          display: flex;
          flex-direction: column;
          position: static;
          margin: 0px 0;

     }

     .main-area .select-area select {
          width: 94%;
          padding: 13px;
          margin-left: 10px;
          margin-bottom: 15px;
          display: block;
     }

     .main-area .content .links {
          margin: 13px 12px;
     }
     
     button {
        width: 100%;
     }

     .about-area {
          padding-top: 30px;
          background: #f4f4d0;
          width: 100%;
     }

     .about-area .heading {
          padding-bottom: 30px;
          padding-left: 10px;
     }

     .about-area > .heading > h1 {
          font-size: 1.5rem;
          margin-bottom: 5px;
     }

     .about-area .heading h3 {
          margin-bottom: 10px;
          font-size: .93rem;
          padding-right: 32px;
     }

     .about-area .heading p {
          padding-right: 10px;
     }

     .about-area .content {
          width: 70%;
          padding-left: 0px;
     }

     .about-area .content {
          width: 100%;
          padding-left: 0px;
     }

     .about-area .provide-area {
          width: 100%;
          display: block;
     }

     .about-area .img-area img {
          width: 490px;
          height: 415px;
          position: static;
          padding: 2px;
     }

     .about-area:hover .img-area img {
          width: none;
     }

     .about-area .img-area {
          padding: 10px;
     }

     .child-service .heading {
          margin-bottom: 30px;
          flex-basis: 0px;
          margin-left: 0px;
     }

     .child-service .heading p {
          padding: 5px;
     }

     #service-area .child-service {
          flex-direction: column;
     }

     .child-service .heading h1 {
          font-size: 1.5rem;
     } 

     .child-service .connect-area {
          flex-basis: 0px;
          margin-right: 0px;
          margin-bottom: 30px;
     }

     #img-area .img {
          margin-top: 40px;
          margin-bottom: 50px;
          width: 100%;
          float: none;
          text-align: center;
          border: 1px solid #c6c6c6;
          margin: 0;
          margin: 10px 0;
          overflow: hidden;
     }

     #img-area .img img {
          width: 95%;
          height: 320px;
          transition: 5s;
          padding-top: 10px;
          padding-bottom: 5px;
          animation-name: img-ani;
          animation-duration: 2s;
          animation-timing-function: linear;
     }

     #more-service-body .Heading h1 {
          width: 75%;
          margin-top: 25px;
          padding: 8px;
          margin-bottom: 35px;
     }

     #service-area .more-service-area {
          width: 95%;
          margin: auto;
          padding-bottom: 50px;
          display: grid;
          grid-template-columns: auto;
          row-gap: 30px;
          column-gap: 30px;
     }

     #blog-area {
          height: 2015px;
     }

     .card-area {
          flex-direction: column;
          width: 100%;
          overflow: hidden;
     }

     .card-area .card {
          flex-basis: 28%;
          background: #fff;
          margin: 10px 10px;
     }

     .footer-blog h1 {
          visibility: hidden;
     }

     #team-area {
          padding-top: 50px;
          background: #fff;
          height: 1690px;
     }

     #team-area .heading h2 {
          font-size: 1.3rem;
     }

     #team-area .heading h1 {
          font-size: 1.5rem;
          width: 100%;
          margin-top: 25px;
     }

     #team-area .container {
          flex-direction: column;
     }

     #team-area .img-area:first-child {
          top: -214px;
     }

     #team-area .img-area {
          top: -103px;
     }

     #team-area .img-area:last-child {
          top: 19px;
     }

     #team-area .card-area-2 {
          background: none;
          height: 400px; 
     }

     #team-area .card-area-2::before {
          content: '';
          display: inline-block;
          position: absolute;
          width: 100%;
          height: 400px;
          background: #00173c;
          opacity: 0.7;
          visibility: hidden;
     }

     #team-area .team-child .card-child h1 {
          display: inline-block;
          color: black;
          margin-top: 5px;
     }

     #team-area .img-area:first-child {
          position: relative;
          top: -212px;
          left: 0;
          display: inline-block;
     }

     #team-area .team-child {
          width: 100%;
          display: flex;
          flex-direction: column;
     }

     #team-area .team-child .card-child:first-child {
          top: -985px;
     }

     #team-area .team-child .card-child:nth-child(2) {
          top: -557px;
     }

     #team-area .team-child .card-child:last-child {
          top: -130px;
     }

     #partner-area {
          padding: 14px 10px;
     }

     #partner-area .child-partner {
          padding: 0px 0px;
     }

     #partner-area .child-partner h1 {
          font-size: 4rem;
     }

     #partner-area .child-partner h2 {
          font-size: 2.1rem;
          margin-bottom: 50px;
     }

     #partner-area .img-area {
          margin-bottom: 20px;
     }

     #specialization-area .child-spe-area {
          padding-top: 0px;
          padding-left: 0px;
          height: 100%;
     }

     #specialization-area {
          height: 1250px;
     }

     #specialization-area::before {
          height: 1250px;
     }

     #specialization-area .content-area-1 {
          flex-direction: column;
     }

     #specialization-area .child-spe-area .heading-1 h1 {
          font-size: 3rem;
          padding: 20px 10px;
     }

     #specialization-area .child-spe-area .heading-1 h2 {
          font-size: 1.5rem;
          top: 45px;
          padding-left: 10px;
     }

     #specialization-area .description {
          flex-basis: 100%;
          padding: 40px 10px;
     }

     #specialization-area .achieve-area {
          justify-content: space-between;
     }

     #specialization-area .img-area {
          margin-top: 5px;
     }

     #specialization-area .img-area .content {
          display: block;
          width: 95%;
          transition: 0.5s;
          margin: auto;
          margin-bottom: 15px;
     }

     #footer-area .footer-heading {
          width: 100%;
          padding: 20px 9px;
          margin-bottom: 30px;
          flex-direction: column;
          margin: auto;
          margin-top: -10px;
     }


     #footer-area {
          padding: 10px 0;
     }

     #footer-area .footer-heading .left-side p {
          margin-bottom: 21px;
     }

     #footer-area .footer-heading .right-side input {
          padding-right: 182px;
     }

     #footer-area .child-footer {
          flex-direction: column;
          padding-left: 10px;
     }

}