@media (max-width: 1600px) {

  .about-top-section h1 {font-size: 140px; line-height: 150px;}

}

@media (max-width:1460px) {
  .home-section .logo-title{font-size: 180px; line-height: 180px; height: 180px}
  .home-section p{font-size: 40px}
  .home-section .logo-title{letter-spacing: -32px;}
  .home-section .tag-main{bottom: 40px; right: 40px}
  .new-about-section .rightside {padding: 0 100px}
  .menu-area .menu-content .menu-left-side{display: flex; align-content: center; align-items: center; height: 400px}
  .menu-area .menu-content .menu-right-side .menu-contact-area{min-height: 400px}
  .menu-area .menu-content .menu-left-side .social-link-area{margin-top: 50px}
  .menu-area .menu-content .menu-left-side ul.nav-link-area li a{font-size: 60px; line-height: 60px}
  .menu-area .menu-content .menu-right-side .menu-contact-area ul li a{margin: 0 0 70px 0}
  .menu-area .menu-content .menu-right-side .menu-contact-area ul li:last-child a{margin: 0px}

  /* .about-top-section {height: 750px} */
  .about-top-section h1{font-size: 100px; line-height: 120px}
  .about-section h2{font-size: 80px; line-height: 80px}
  .contact-info-section h2, .contact-form-section h2, .process-section h2, .team-section h2, .vacancies-section h2, .career-info-area h2{font-size: 80px; line-height: 80px}

  .blog-detail-page h1{font-size: 80px; line-height: 80px}
  .contact-info-section .info .info-text{font-size: 40px; line-height: 40px}
}

@media (max-width:1366px) {

.menu-area .menu-content {padding: 20px}
.menu-area .menu-content .menu-left-side ul.nav-link-area li a.is-inview {transition-duration:.6s !important;}
.menu-area .menu-content .menu-left-side ul.nav-link-area li a.not-inview {transition-duration:.6s !important;}

.new-about-section {height: auto;}
.new-about-section .rightside {padding: 0 100px}
.about-top-section h1 {font-size: 100px;line-height: 120px;}
.home-section .logo-title{letter-spacing: -32px;}

.new-footer-section ul.footer-social li {margin-right: 30px; }

/* .new-about-section h2 {font-size: 60px} */

/* .o-title.is-inview .o-title_line {  transform: translateY(0%) rotateX(0deg); opacity: 1; transition-delay: .1s;} */
.new-about-section{height:auto; padding: 50px 0 0px 0px;}
.new-about-section h2{font-size: 60px; line-height: 60px; margin: 0;}
.new-about-section p{margin: 10px 0px 0px 50px;}
}

@media (min-width: 768px) and (max-width: 1024px){

  .lines{position: fixed;}
  .o-scroll{overflow: scroll;}
  .logo{left: 0px; top: 0px;}
  .logo img {width:80px;}
  .menu-btn{top: 0px; right: 0px}
  .sticky-header-box{height: 78px}
  .menu-area .menu-content .menu-left-side{width: 100%; display: block; border-right: none; height: auto;}
  .menu-area .menu-content .menu-left-side .social-link-area{display: none}
  .menu-area .menu-content .menu-right-side{display: none;}


  .home-section{overflow: hidden; height: 650px}
  .home-section .logo-title{font-size: 80px; line-height: 60px; height: 65px; letter-spacing: -12px;margin-bottom: 15px}
  .home-section .logo-title span:nth-of-type(6n+2),
  .home-section .logo-title span:nth-of-type(6n+6) {top: 5px}
  .home-section .logo-title .rotate {margin-left: -12px;}
  .home-section p{font-size: 24px; line-height: 30px; white-space: normal}
  .home-section .tag-main{right: 50%; margin-right: -75px;}

  .about-section{padding: 50px 0}
  .about-section .about-photo1, .about-section .about-photo2, .about-section .about-photo3{display: none}
  .about-section h2{font-size: 60px; line-height: 70px}
  .about-section p{font-size: 16px; line-height: 24px; padding-left: 30px}

  .new-about-section{padding: 50px 0; display: block;}
  .new-about-section .leftside{display: block; width: 100%}
  .new-about-section .rightside{display: block; width: 100%; padding: 80px 80px 0 80px}
  .new-about-section h2{font-size: 60px; line-height: 70px}
  .new-about-section p{font-size: 16px; line-height: 24px; }
  .service-section ul.service-list{margin: 80px 0px 0px 0px}
  .service-section ul.service-list li{width: calc(50% - 20px)}
  .service-section ul.service-list li:nth-of-type(2n+1){margin-top: -100px !important;}
  .service-section ul.service-list li:nth-of-type(2n+2){margin-top: 0px !important;}
  .service-section ul.service-list li .hover-content ul.technology-list li:nth-of-type(2n+1){margin: 0px !important}


  .service-section{padding: 50px 0}
  .service-section h2{font-size: 60px; line-height: 70px; margin: 0 0 30px 0;}
  .service-section ul.service-tabs {margin: 0 0 40px 0;}
  .service-section ul.service-tabs li {width: 33.33%; margin-bottom: 10px;}
  .service-section ul.service-tabs li a {font-size: 18px; line-height: 24px; padding: .5rem 0rem;}
  .service-section .plus-btn {width: 40px;height: 40px;}
  .service-section .plus-btn::before {height: 40px;}
  .service-section .plus-btn::after {width: 40px;}
  .service-section p {font-size: 16px; line-height: 24px; }

  .our-features-section{padding: 50px 0}
  .our-features-section h2{font-size: 60px; line-height: 70px; margin: 0 0 30px 0;}
  .our-features-section ul.features-list li{width: 50%;}

  .work-section{padding: 50px 0 10px 0}
  .work-section h2{font-size: 60px; line-height: 70px; margin: 0 0 30px 0;}
  .work-section p{font-size: 16px; line-height: 24px; padding-left: 30px}
  .work-section ul.project-list{margin: 20px 0px 0px 0px}
  .work-section ul.project-list li{margin-bottom: 40px}
  .work-section ul.project-list li .project-box .project-detail h3{font-size: 36px; line-height: 40px; margin-bottom: 10px}
  .work-section ul.project-list li .project-box .project-detail .detail{font-size: 18px}

  .client-section{padding: 50px 0}
  .client-section h2{font-size: 60px; line-height: 70px; margin: 0 0 30px 0;}
  .client-section p{font-size: 16px; line-height: 24px; padding-left: 30px}
  .client-section ul.client-list{display: none}
  .client-section ul.client-list li{width: 50%; border: #e1e1e1 1px solid}
  .client-slider{display: block;}

  .new-footer-section {padding: 100px 50px 0px 50px;}
  .new-footer-section .clutch-box {margin: 0 0 50px 0 }
  .new-footer-section h2 {font-size: 40px}
  .new-footer-section h2::before {font-size: 60px}
  .new-footer-section ul.footer-social {text-align: center;}
  .new-footer-section ul.footer-contact li {font-size: 22px; margin-bottom: 15px;}
  .new-footer-section ul.footer-social li {margin-right: 15px}
  .new-footer-section ul.footer-social li a {font-size: 18px; padding-left: 50px}
  /* .footer-section .tag-footer{margin: 0 auto 40px auto}
  .footer-section h2{font-size: 40px; line-height: 50px; margin: 0 0 30px 0;}
  .footer-section ul.footer-contact li{font-size: 14px; padding: 0px; margin-bottom: 15px;}
  .footer-section ul.footer-contact li span{margin-right: 15px}
  .footer-section ul.footer-social li{padding-right: 30px}
  .footer-section ul.footer-social li a{font-size: 16px}
  .footer-section ul.footer-social li::after {top: 10px; right: 11px; font-size: 14px;}
  .footer-section h3{font-size: 36px; line-height: 46px; margin: 10px 0 10px 0}
  .footer-section p{font-size: 16px; line-height: 24px;} */

  .footer-section .copyright-line{margin-top: 30px;padding: 20px 0; font-size: 14px;}

  .contact-info-section h2, .contact-form-section h2, .process-section h2, .team-section h2, .vacancies-section h2, .career-info-area h2{font-size: 60px; line-height: 70px; margin: 0 0 30px 0}
  .about-top-section {height: 50vh; display: flex; align-items: center; padding: 100px;}
  .about-top-section h1 {font-size: 60px; line-height: 70px;}
  .about-photo-section {padding: 0;}
  #logo-icon {width: 360px; height: 436px;}

  .team-section{padding: 50px 0}
  .team-section ul.team-list li:nth-of-type(3n+2) {margin-top: 380px;}
  .team-section ul.team-list li {width: 50%;}
  .team-section ul.team-list li .team-box img{filter: grayscale(0%);}
  .team-section ul.team-list li .team-box .member-name{position: relative; left: 0px; bottom: 0px; opacity: 1; color:#05153d; margin-top: 10px}
  .team-section ul.team-list li .team-box::before{content: none}
  .team-section ul.team-list li .team-box .tag-main{top: auto;bottom: 0px; right: -50px; opacity: 1; width: 140px; height: 140px; padding: 10px}
  .team-section ul.team-list li .team-box .tag-main .tag-icon{width: 120px; height: 120px}
  .team-section ul.team-list li .team-box .tag-main .face-box {width: 100px; height: 100px; top: 20px; left: 20px;}
  .team-section ul.team-list li:hover .team-box .tag-main{top: auto;bottom: 0px; right: -50px;}

  .process-section{padding: 50px 0}
  .process-section p {font-size: 20px; line-height: 30px; padding-left: 10%;}
  .process-section ul.process-list li{margin-bottom: 40px}
  .process-section ul.process-list li::before, .process-section ul.process-list li:nth-of-type(2n+2)::before{content: ''; width: 1px; border: #05153d 1px dashed; height: 100%; position: absolute; top: 80px; left: 30px; border-radius: 80px; transform: rotate(0deg);}
  .process-section ul.process-list li:nth-of-type(2n+2) {margin-left: 0;}
  .process-section ul.process-list li .step-box{padding: 0px 0px 0px 50px;}
  .process-section ul.process-list li .step-box .tag-main{position: relative; top: 0px; left:-70px; width: 100px; height: 100px; margin-bottom: 20px}
  .process-section ul.process-list li .step-box .tag-main .number-box{line-height: 100px; width: 100px; height: 100px; font-size: 54px}
  .process-section ul.process-list li .step-box .process-title{font-size: 35px; line-height: 35px}
  .process-section ul.process-list li .step-box .process-detail{font-size: 16px; line-height: 24px;}

  .infrastructure-section{padding: 50px 0 50px 50px}
  .infrastructure-section h2{font-size: 60px;line-height: 70px;}
  .infrastructure-section .swiper-slide .project-image{height: 360px;}

  .career-section{padding: 50px 0}
  .career-section p{font-size: 16px; line-height: 24px; padding-left: 30px}
  .career-section h2{font-size: 60px;line-height: 70px;}

  .vacancies-section{padding: 50px 0}
  .vacancies-section h2{margin: 0 0 30px 0}
  .vacancies-section p {font-size: 20px; line-height: 30px; padding-left: 10%;}
  .vacancies-section ul.vacancies-list li .vacancie .view-btn{bottom: -70px}

  .career-top-page h1{font-size: 60px; line-height: 70px;}
  .career-top-page .info{margin-bottom: 40px}
  .career-top-page .career-banner .banner-content-area{top: 50px; left: 25px;}
  .career-top-page .career-banner .banner-content-area .icon {width: 60px; margin-bottom: 10px;}
  .career-top-page .career-banner .banner-content-area .title{font-size: 18px; line-height: 26px}
  .career-top-page .career-banner .banner-content-area .title span{font-size: 30px; line-height: 30px}

  .career-info-area{padding: 50px 0 0 0}
  .career-info-area .content-area {padding-left: 50px;}

  .contact-form-section{padding: 50px 0}
  .contact-form-section p{font-size: 16px; line-height: 24px; padding-left: 50px}
  .career-info-area .content-area ul.info li{width: 32.3%}
  .blog-pagination ul{margin: 0px auto 0px -16px}

  .contact-info-section{padding: 50px 0}
  .contact-info-section .info{margin-left: 126px}
  .contact-info-section .info .info-text {font-size: 34px; line-height: 34px;}
  .contact-info-section ul.location-list{margin: 100px 0px 0px 0px}
  .contact-info-section ul.location-list li{margin-bottom: 50px}
  .contact-info-section ul.location-list li .location-box .location-detail{position: relative; z-index: 1}
  .contact-info-section ul.location-list li .location-box .location-photo{height: 400px}
  .contact-info-section ul.social-list{width: 685px; margin: 250px auto 0px auto;}
  .contact-info-section ul.social-list li {width: 140px;height: 140px;}
  .contact-info-section ul.social-list li a{line-height: 134px; font-size: 50px;}
  .contact-info-section ul.social-list li:nth-child(2n) {margin-top: -137px;}

  .project-page{padding: 0px 0 50px 0}
  .project-page .project-box .project-detail{width: 80%; margin-left: 15%; padding: 40px; margin-top: -100px;}
  .project-page .project-box .project-detail h3{font-size: 40px; line-height: 40px;}
  .project-page .project-box .project-detail p{font-size: 16px; line-height: 26px; }
  .project-page .project-box .project-detail .view-btn{width: 130px; height: 130px;}
  .project-page .project-box .project-detail .view-btn .tag-main{width: 130px; height: 130px;}
  .project-page .project-box .project-detail .view-btn .tag-main .tag-icon{width: 110px; height: 110px;}
  .project-page .project-box .project-detail .view-btn .tag-main .face-box {width: 60px; height: 60px;}

  .gallery{display: block; margin: 0px; padding: 100px 0px 0px 0px; }
  .gallery__item{display: block; width:540px; margin: 0px auto 100px auto; transform: translateY(0%) rotate(3deg) !important; position: relative; padding-top: 60px}
  .gallery__item-img{width: 500px; height: 654px; margin: 0px auto 0 auto;}
  .gallery__item-imginner {background-size: cover; background-position: 50% 0; width: 100%; height: 100%;}
  .gallery__item-caption{position: absolute; top: 0px; width: 100%; height: 100%}
  .gallery__item-caption .tag-main{position: absolute; bottom: 0px; left: 0px; z-index: 2; border-radius: 50%; transition: all 0.25s ease-out; }
  .gallery__item-caption .tag-main .tag-icon{animation-name: spin; animation-duration: 10000ms; animation-iteration-count: infinite; animation-timing-function: linear; width: 120px; height: 120px;}
  .gallery__item-caption .tag-main .face-box{ width: 100px; height: 100px; text-align: center; position: absolute; top: 10px; left: 10px}
  .gallery__item-caption .tag-main .face-box img{width: 100%}

  .case_studies_area .gallery__item-caption .tag-main{background: #28b1ff; padding: 10px}
  .case_studies_area .gallery__item-caption .tag-main .tag-icon{width: 100px; height: 100px}
  .gallery__item-caption .tag-main .face-box{width: 70px; height: 70px;  top: 25px; left: 25px;}
  .gallery__item-link {position: absolute; bottom: -60px; width: 120px; height: 120px; left: -20px;}
  .gallery__item-number {position: absolute; left: -20px; color: #28b1ff; top: 0px; font-size: 40px; font-family: 'impactregular';line-height: 50px; width: 40px; text-align: center;}
  .gallery__item-title {font-size: 40px; font-family: 'impactregular'; position: absolute; top: 0px; line-height: 50px; left: 30px;}
  .gallery__item-tags {position: absolute; bottom: -30px; font-size: 14px; right: 20px; text-transform: uppercase;}
  .gallery__text{font-family: 'impactregular'; font-size: 100px; line-height: 100px; text-align: center; margin-bottom: 60px}
  .gallery__text span{margin: 0 8px}
  .arrow {width: 50px; height: 50px; display: inline-block; position: fixed; background: #fff; right: 20px; top: 14px; z-index: 111}
  .arrow::after {content: ""; display: block; top: 50%;left: 50%;border-style: solid;border-color: #05153d; position: absolute; transform-origin: 50% 50%; width: 40px; height: 0; border-width: 2px 0 0 0; transform: translate(-14px, -1px);}
  .arrow::before {content: ""; display: block; width: 30px; height: 30px; top: 50%; left: 50%; border-style: solid; border-color: #05153d; border-width: 2px 2px 0 0; position: absolute; transform-origin: 50% 50%; transform: rotate(-135deg); margin: -15px 0 0 -10px;}

  .gallery__item:nth-of-type(2n+2){transform: translateY(0%) rotate(-3deg) !important;}


  .employee-title-area{padding: 300px 50px 100px 50px}
  .employee-title-area h1{font-size: 100px; line-height: 100px}
  .employee-title-area .position{font-size: 30px; margin-top: 10px}
  .employee-detail-page{padding: 50px 0}
  .employee-detail-page .information-area{display: block;}
  .employee-detail-page .information-area .employee-photo{display: block; width:70%}
  .employee-detail-page .information-area .info-content{  display: block; width: 80%; background: #05153d; margin-left: 20%; padding: 30px; margin-top: -200px; position: relative; z-index: 1;}
  .employee-detail-page .information-area .info-content .detail-info span{font-size: 20px; line-height: 20px; color: #28b1ff;}
  .employee-detail-page .information-area .info-content .detail-info{font-size: 22px; line-height: 28px; color: #fff;}
  .employee-detail-page .information-area .info-content .btn-black{padding: 13px 40px !important; font-size: 16px !important; border:#fff 1px solid !important; background: #05153d !important; color: #fff !important; margin-top: 10px !important}
  .employee-detail-page .information-area .info-content .btn-black:hover{background: #fff !important; color: #05153d !important}

  .employee-detail-page .profile-info{padding: 50px 0 100px 0}
  .employee-detail-page .profile-info h2{font-size: 60px; line-height: 60px;}
  .employee-detail-page .profile-info p{font-size: 16px; line-height: 24px; padding-left: 100px}

  .employee-detail-page .experience-area h2{font-size: 60px; line-height: 60px;}
  .employee-detail-page .experience-area ul.experience-list{margin: 30px 0px 0px 0px; padding: 0 0 0 100px}
  .employee-detail-page .experience-area ul.experience-list li{width: 100%; margin-left: 0px}
  .employee-detail-page .experience-area ul.experience-list li::after {top: 0px}
  .employee-detail-page .experience-area{padding: 0 0 50px 0}
  .employee-detail-page .experience-area ul.experience-list li .experience-box .work-position{font-size: 30px; line-height: 30px;}
  .employee-detail-page .experience-area ul.experience-list li .experience-box .work-position span{font-size: 14px}
  .employee-detail-page .experience-area ul.experience-list li .experience-box .company-name{font-size: 24px; line-height: 24px}
  .employee-detail-page .experience-area ul.experience-list li .experience-box .detail{font-size: 16px; line-height: 24px}

  .employee-detail-page .education-area{padding: 0 0 50px 0}
  .employee-detail-page .education-area h2{font-size: 60px; line-height: 60px;}
  .employee-detail-page .education-area ul.education-list{margin: 30px 0px 0px 0px; padding: 0 0 0 100px}
  .employee-detail-page .education-area ul.education-list li{width: 100%; margin-left: 0px}
  .employee-detail-page .education-area ul.education-list li .education-box .degree{font-size: 30px; line-height: 30px;}
  .employee-detail-page .education-area ul.education-list li .education-box .degree span{font-size: 14px}
  .employee-detail-page .education-area ul.education-list li .education-box .university-name{font-size: 24px; line-height: 24px}
  .employee-detail-page .education-area ul.education-list li::after {top: 0px}

  .employee-detail-page .skill-portfolio-area{display: block; padding: 0 0 50px 0}
  .employee-detail-page .skill-portfolio-area .skill-area{width: 100%; display: block; margin-bottom: 100px}
  .employee-detail-page .skill-portfolio-area h2{font-size: 60px; line-height: 60px; }
  .employee-detail-page .skill-portfolio-area ul.skills-list{padding: 0 0 0 100px}
  .employee-detail-page .skill-portfolio-area .portfolio-area{width: 100%; display: block;}


  .case-area{padding: 100px 0 100px 0; height: auto; overflow: hidden; position: relative;}
  .case-area .yellow-svg{width: 800px; height: 800px; margin-left: -400px; left: 50%; top: -400px; margin-top: 0px;}
  .case-area .content-area{display: block; margin: 0px; width: 100%}
  .case-area .case-icon{margin-right: 0}
  .case-area .case-icon .icon{width: 400px; height: 400px; margin: 0 auto 40px auto;}
  .case-area h1{font-size: 60px; line-height: 60px; text-align: center; }
  .case-area p {font-size: 20px; line-height: 26px; text-align: center;}
  .case-area #particles-js{display: none}

  .information-technologies-area{padding: 0px 0px 100px 0px}

  .screen-mobile-area{margin-bottom: 100px}
  .screen-mobile-area .img-block .about-img-item:nth-child(1){width: 220px; left: 0px}
  .screen-mobile-area .img-block .about-img-item:nth-child(3){width: 220px; right: 0px}
  .screen-mobile-area .img-block .about-img-item:nth-child(4){width: 220px; left: 0px; top: 550px;}
  .screen-mobile-area .img-block .about-img-item:nth-child(5){width: 220px; right: 0px; top: 550px;}
  .screen-mobile-area .img-block .about-img-item:nth-child(2) {width: 320px; left: 50%; top: 50%; margin-left: -160px; margin-top: -325px;}

  .information-technologies-area h2{font-size: 60px; line-height: 60px; }
  .information-technologies-area .content-area{padding-left: 100px}
  .information-technologies-area .content-area p{font-size: 16px; line-height: 26px; }

  .mobile-mockup-photo{width: 100%; margin-bottom: 100px}

  .photo-mobile-area .img-block{height: auto;}
  .photo-mobile-area .img-block .about-img-item{position: relative;}
  .photo-mobile-area .img-block .about-img-item:nth-child(1){width: 80%}
  .photo-mobile-area .img-block .about-img-item:nth-child(2){width: 80%; left: 20%}

  .typography-area{padding: 100px 0}
  .typography-area h2{font-size: 60px; line-height: 60px; }
  .typography-area .content-area{padding-left: 100px}

  .typography-area ul.color-list li .color-box{width: 150px; height: 150px}
  .typography-area ul.color-list li .color-title {font-size: 20px; line-height: 24px;}
  .typography-area ul.color-list li .color-title span {font-size: 22px;}

  .webphoto-2{width: 100%; margin-bottom: 100px}
  .webphoto-2 .webphoto{width: 100%; height: auto;}

  .desktop-area .img-block{height: 420px;}
  .desktop-area .img-block .about-img-item:nth-child(1){left: 0px; width: 276px;}
  .desktop-area .img-block .about-img-item:nth-child(2){width: 415px; right: 0;}

  .tablet-mobile-area{padding: 0 0 100px 0}
  .tablet-mobile-area .img-block{height: 910px}
  .tablet-mobile-area .img-block .about-img-item:nth-child(1){left: 0; width: 220px; top: 460px;}
  .tablet-mobile-area .img-block .about-img-item:nth-child(2) {width: 500px; left: 50%; margin-left: -250px;}
  .tablet-mobile-area .img-block .about-img-item:nth-child(3) {width: 220px; top: 460px; right: 0;}

  .logo-photo-area ul.logo-list-area li{margin-bottom: 50px}

  .blog-section{padding: 0 0 50px 0}
  .blog-section ul.blog-list li .blog-box{display: block;}
  .blog-section ul.blog-list li .blog-box .blog-photo{display: block; width: 80%}
  .blog-section ul.blog-list li .blog-box .blog-detail{display: block; width: 80%; margin: -200px 0 0 20%; padding: 120px 40px 40px 40px}
  .blog-section ul.blog-list li .blog-box .blog-detail .tag-main{position: absolute;right: auto; left: -50px; top: -50px; transform: rotate(-35deg);}
  .blog-section ul.blog-list li:nth-child(2n) .blog-detail{text-align: left;}
  .blog-section ul.blog-list li:nth-child(2n) .blog-detail .user-name i{float: none; margin-left: 0px; margin-right: 10px}
  .blog-section ul.blog-list li:nth-child(2n) .blog-detail .btn-read {padding-right: 0; padding-left: 45px; }
  .blog-section ul.blog-list li:nth-child(2n) .blog-detail .btn-read::before {left: 0px; right: auto;}

  .service-area{height: auto; padding: 150px 15px 100px 15px; width: 100%}
  .service-area .icon{position: relative; top: 0px; margin-bottom: 20px; width: 150px; height: 150px; padding: 20px;}
  .service-area h1{font-size: 40px; line-height: 50px; padding-left: 170px}
  .service-area p{font-size: 16px; line-height: 24px; padding-left: 170px}

  .service-page-section{padding:0 0 100px 0}
  .service-page-section h2{font-size: 60px; line-height: 70px; margin: 0 0 20px 0}
  .service-page-section p{font-size: 16px; line-height: 24px; padding-left:   30px}

  .service-photo-area{padding: 0 0 100px 0}
  .service-photo-area .img-block{height: auto;}
  .service-photo-area .img-block .about-img-item{position: relative; width: 80% !important}
  .service-photo-area .img-block .about-img-item:nth-child(2){width: auto; left: 20%}

  .photo-mobile-area{padding: 0 0 100px 0}
  .service-page-section ul.technology-list li {width: 50%; padding: 0 10px 0 80px; margin-bottom: 10px;}

  .technologie-area{height: auto; padding: 150px 15px 100px 15px; width: 100%}
  .technologie-area .icon{position: relative; top: 0px; margin-bottom: 20px; width: 150px; height: 150px; padding: 20px;}
  .technologie-area h1{font-size: 40px; line-height: 50px; padding-left: 170px}
  .technologie-area h2{font-size: 16px; line-height: 24px; padding-left: 170px}
  .technologie-area p{font-size: 16px; line-height: 24px; padding-left: 170px}

    
  .why_choose_section{padding: 0 0 50px 0}
  .why_choose_section h2{font-size: 60px; line-height: 60px;}

  .technologie_service_section{padding: 50px 0}
  .technologie_service_section h2{font-size: 60px; line-height: 60px;}

  .advantage-section{padding: 50px 0}
  .advantage-section h2{font-size: 60px; line-height: 60px;}
  .advantage-section ul.advantage-list li{padding-bottom: 20px;}
  .advantage-section ul.advantage-list li .advantage-box .subtitle{font-size: 30px; line-height: 30px;}
  .advantage-section ul.advantage-list li .advantage-box .list{font-size: 16px; line-height: 24px;}
  .advantage-section ul.advantage-list li::after {top: 2px;}

  .quick-features-section .main-area{height: auto; display: block;}
  .quick-features-section .leftside{position: relative; width: 80%;}
  .quick-features-section .rightside{position: relative; width: 80%; margin-left: 20%;}
  .quick-features-section ul.list li{width: 100%;}
  
}

@media (max-width: 767px) {
  .lines{position: fixed;}
  .o-scroll{overflow: scroll;}
  .logo{left: 0px; top: 0px; padding: 10px 7px}
  .logo img {width: 52px;}
  .menu-btn{top: 0px; right: 0px}
  .sticky-header-box{height: 78px}
  .cursor{display: none}
  .menu-area .menu-content .menu-left-side{width: 100%; display: block; border-right: none; height: auto;}
  .menu-area .menu-content .menu-left-side .social-link-area{display: none}
  .menu-area .menu-content .menu-right-side{display: none;}
  .menu-area .menu-content .menu-left-side ul.nav-link-area li a{font-size: 40px; line-height: 40px}
  .btn-connect {top: 50%; right: -59px; height: 32px; line-height: 32px; padding: 0 25px; font-size: 14px; border-radius: 18px 18px 0px 0px; transform: rotate(-90deg); }
  .btn-connect:hover{padding: 0 25px}
  .btn-connect .icon{display: none}

  .popup-project.active {display: block; transition: all 0.5s ease-out; top: 0; transform: scale(1); overflow-y: scroll; height: 100%;}
  .popup-project .form-area{padding: 30px; width: 100%; border-radius: 0px}
  .popup-project .wpcf7-spinner {bottom: 10px; right: 0px; position: absolute;}
  .popup-project .close-btn{width: 40px;height: 40px; position: absolute; top: 0; right: 0; line-height: 40px; font-size: 20px;}
  .home-section{overflow: hidden; height: 620px;}
  .home-section .logo-title{font-size: 60px; line-height: 60px; height: 60px; margin-bottom: 10px; letter-spacing: -11px;}
  .home-section .logo-title span:nth-of-type(6n+2){top:5px}
  .home-section .logo-title span:nth-of-type(6n+6){top:5px}
  .home-section .logo-title .rotate{margin-left:-3px;}
  .home-section p{font-size: 24px; line-height: 30px; white-space: normal}
  .home-section .tag-main{right: 50%; margin-right: -75px;}

  .about-section{padding: 50px 0}
  .about-section .about-photo1, .about-section .about-photo2, .about-section .about-photo3{display: none}
  .about-section h2{font-size: 38px; line-height: 42px}
  .about-section p{font-size: 16px; line-height: 24px; padding-left: 30px}

  .new-about-section{padding: 50px 0; display: block; height:auto;}
  .new-about-section .leftside {display: block; width: 100%;}
  .new-about-section h2{font-size: 38px; line-height: 42px; margin-bottom: 20px}
  .new-about-section p{font-size: 16px; line-height: 24px; padding-left: 30px; margin: 0px}
  .new-about-section .rightside{width: 100%; display: block; padding: 30px 30px 0 30px}
  .new-about-section .btn-black{display: none}

  .service-section{padding: 50px 0}
  .service-section h2{font-size: 40px; line-height: 50px; margin: 0 0 30px 0;}
  .service-section ul.service-tabs {margin: 0 0 40px 0;}
  .service-section ul.service-tabs li {width: 50%; margin-bottom: 10px;}
  .service-section ul.service-tabs li a {font-size: 18px; line-height: 24px; padding: .5rem 0rem;}
  .service-section .plus-btn {width: 40px;height: 40px;}
  .service-section .plus-btn::before {height: 40px;}
  .service-section .plus-btn::after {width: 40px;}
  .service-section ul.service-list{margin: 30px 0px 0px 0px}
  .service-section ul.service-list li{width: calc(100% - 0px)}
  .service-section ul.service-list li:nth-of-type(3n+1){margin-top: 0px}
  .service-section ul.service-list li:nth-of-type(3n+3){margin-top: 0px}
  .service-section ul.service-list li .service-box h3{font-size: 30px; line-height: 30px; width: auto;}
  .service-section ul.service-list li .service-box{padding: 140px 20px 30px 20px}
  .service-section ul.service-list li .service-box p{text-align: left;}
  .service-section ul.service-list li .hover-content{padding: 15px}
  .service-section ul.service-list li .hover-content h3{margin: 0px}
  .service-section ul.service-list li .hover-content ul.technology-list{margin: 10px 0px 0px 0px}
  .service-section ul.service-list li .hover-content .btn-read{bottom: 10px}


  .service-section .service-main{display: block; padding: 0 20px}
  .service-section .service-main .left-icon-area {width: 50%; margin: 0 auto;}
  .service-section .service-main .right-area {width: 100%; padding: 20px 0 0 0;}
  .service-section p {font-size: 16px; line-height: 24px; text-align: center;}

  .our-features-section h2{font-size: 40px; line-height: 50px; margin: 0 0 30px 0;}
  .our-features-section ul.features-list{margin: 0px auto;}
  .our-features-section ul.features-list li{padding: 10px 0px; width: 100%;}
  .our-features-section ul.features-list li:nth-of-type(4n+3),
  .our-features-section ul.features-list li:nth-of-type(4n+1){margin-top: 0px;}

  .work-section{padding: 50px 0 10px 0}
  .work-section h2{font-size: 40px; line-height: 50px; margin: 0 0 30px 0;}
  .work-section p{font-size: 16px; line-height: 24px; padding-left: 30px}
  .work-section ul.project-list{margin: 20px 0px 0px 0px}
  .work-section ul.project-list li{margin-bottom: 40px}
  .work-section ul.project-list li .project-box{display: block;}
  .work-section ul.project-list li .project-box .project-photo{width: 100%}
  .work-section ul.project-list li .project-box .project-detail{width: 100%; padding: 20px 0 0 0;display: block; text-align: center; margin: 0px}
  .work-section ul.project-list li .project-box .project-detail h3{font-size: 36px; line-height: 40px; margin-bottom: 10px}
  .work-section ul.project-list li .project-box .project-detail .detail{font-size: 18px}
  .work-section ul.project-list li:nth-of-type(2n+2) .project-detail{margin-right: auto; text-align: center;}

  .client-section{padding: 50px 0}
  .client-section h2{font-size: 40px; line-height: 50px; margin: 0 0 30px 0;}
  .client-section p{font-size: 16px; line-height: 24px; padding-left: 30px}
  .client-section ul.client-list{display: none}
  .client-section ul.client-list li{width: 50%; border: #e1e1e1 1px solid}
  .client-slider{display: block;}

  /* .footer-section .tag-footer{margin: 0 auto 40px auto}
  .footer-section h2{font-size: 40px; line-height: 50px; margin: 0 0 30px 0;}
  .footer-section ul.footer-contact li{font-size: 14px; padding: 0px; margin-bottom: 15px;}
  .footer-section ul.footer-contact li span{margin-right: 15px}
  .footer-section ul.footer-social{position: relative;}
  .footer-section ul.footer-social li{padding-right: 24px}
  .footer-section ul.footer-social li a{font-size: 16px; line-height: 16px}
  .footer-section ul.footer-social li::after {top: 10px; right:8px; font-size: 14px;}
  .footer-section ul.location-list{justify-content: flex-start; margin-top: 25px;}
  .footer-section ul.location-list li{margin-left: 0px; margin-right: 10px}
  .footer-section ul.location-list li a{width: 60px; height: 60px}
  .footer-section h3{font-size: 36px; line-height: 46px; margin: 15px 0 10px 0}
  .footer-section p{font-size: 16px; line-height: 24px; min-height: 72px}
  .footer-section .text-right{text-align: left !important;}
  .footer-section .copyright-line{margin-top: 30px;padding: 20px 0; font-size: 14px;} */

  .new-footer-section{padding: 100px 15px 0px 15px;}
  .new-footer-section ul.footer-contact{display: flex;flex-wrap: wrap;}
  .new-footer-section ul.footer-contact li{width: 33.33%;display: grid;text-align: left;;}
  .new-footer-section ul.footer-contact li img{margin-bottom: 10px;margin: 0 0 10px;}
  .new-footer-section ul.footer-contact li:first-child{width: 100%;}
  .new-footer-section ul.footer-contact li a{font-size: 15px}
  .new-footer-section ul.footer-social li{margin-bottom: 15px}
  .new-footer-section h2.locate-text{margin-top: 50px}
  .new-footer-section h2::before{font-size: 55px}
  .new-footer-section .copyright-line{font-size: 16px}

.about-top-section {height: auto; display: flex; align-items: center; padding: 50px 20px 80px 20px;}
.about-top-section h1 {font-size: 40px; line-height: 50px; margin-top: 80px;}

.about-photo-section {padding: 0; overflow: hidden;}
.about-photo-section img { width: 200%; max-width: 200%; margin-left: -50%;}
.team-section{padding: 50px 0}
.team-section h2{font-size: 40px; line-height: 50px; margin: 0 0 30px 0;}
.team-section .btn-black{padding: 12px 20px !important; font-size: 16px !important; margin-top: 0px}
.team-section .new-team-box1 .tag-main {top: -50px; width: 100px; height: 100px; margin-left: -45px;}
.team-section .new-team-box1 .tag-main .face-box {width: 100px; height: 100px; top: 0; left: 0;}
.team-section .new-team-box1 .content-area{margin-top: -100px;}
.team-section .new-team-box1 .content-area .name{padding: 80px 0px 5px 0px}
.team-section .new-team-box1 .content-area .position{padding: 0px 10px 10px 10px}
.team-section .new-team-box1 .content-area p{font-size: 12px; line-height: 20px; padding: 0 20px 20px 20px; min-height: auto;}
.boss-photo{width: 100%; margin-left: 0;}
.boss-photo::before{content: none}
.boss-photo .member-name{position: relative; bottom: 0px; left: 0px; padding: 0 0 10px 0; text-align: center;}
.boss-photo .tag-main{top: 10px; left: 10px; opacity: 1; background: #05153d; width: 140px; height: 140px; padding: 10px}
.boss-photo .tag-main .tag-icon{width: 120px; height: 120px}
.boss-photo .tag-main .face-box {width: 100px; height: 100px; top: 20px; left: 20px;}
.boss-photo img {filter: grayscale(0%);}

.team-section ul.team-list li{width: 100%; padding: 0px 20px; margin-bottom: 30px}
.team-section ul.team-list li:nth-of-type(3n+2){margin-top: 0px}
.team-section ul.team-list li .team-box img{filter: grayscale(0%);}
.team-section ul.team-list li .team-box .member-name{position: relative; left: 0px; bottom: 0px; opacity: 1; color:#05153d; margin-top: 10px}
.team-section ul.team-list li .team-box::before{content: none}
.team-section ul.team-list li .team-box .tag-main{top: auto;bottom: 50px; right: -20px; opacity: 1; background: #05153d; width: 140px; height: 140px; padding: 10px}
.team-section ul.team-list li .team-box .tag-main .tag-icon{width: 120px; height: 120px}
.team-section ul.team-list li .team-box .tag-main .face-box {width: 100px; height: 100px; top: 20px; left: 20px;}
.team-section ul.team-list li:hover .team-box .tag-main{top: auto;bottom: 50px; right: -20px;}
.btn-black {font-size: 15px; padding: 14px 26px; margin-top: 20px; width: 100%;}

.process-section{padding: 50px 0}
.process-section h2{font-size: 40px; line-height: 50px; margin: 0 0 30px 0;}
.process-section p{font-size: 16px; line-height: 24px; padding-left: 30px}
.process-section ul.process-list li{margin-bottom: 40px}
.process-section ul.process-list li::before, .process-section ul.process-list li:nth-of-type(2n+2)::before{content: ''; width: 1px; border: #05153d 1px dashed; height: 100%; position: absolute; top: 80px; left: 30px; border-radius: 80px; transform: rotate(0deg);}
.process-section ul.process-list li:nth-of-type(2n+2) {margin-left: 0;}
.process-section ul.process-list li .step-box{padding: 0px 0px 0px 50px;}
.process-section ul.process-list li .step-box .tag-main{position: relative; top: 0px; left:-50px; width: 100px; height: 100px; margin-bottom: 20px}
.process-section ul.process-list li .step-box .tag-main .number-box{line-height: 100px; width: 100px; height: 100px; font-size: 54px}
.process-section ul.process-list li .step-box .process-title{font-size: 35px; line-height: 35px}
.process-section ul.process-list li .step-box .process-detail{font-size: 16px; line-height: 24px;}

.infrastructure-section{padding: 50px 0}
.infrastructure-section h2{font-size: 40px; line-height: 50px; margin: 0 0 30px 0;}
.infrastructure-section .swiper-slide{width: 80% !important;}
.infrastructure-section .swiper-slide .project-image{height: auto;}

.project-page{padding: 0px}
.project-page .project-box .project-photo {width: 90%;}
.project-page .project-box .project-detail{width: 90%; margin-left: 10%; padding: 20px 20px 60px 20px; margin-top: -40px;}
.project-page .project-box .project-detail h3{font-size: 30px; line-height: 30px; margin-bottom: 10px}
.project-page .project-box .project-detail p{font-size: 14px; line-height: 22px;}
.project-page .project-box .project-detail ul.point li{width: 50%;font-size: 12px; padding-bottom: 0px; padding-left: 16px;}
.project-page .project-box .project-detail ul.point li::after {top: 5px; width: 10px; height: 10px;}
.project-page .project-box .project-detail .view-btn .tag-main{width: 100px; height: 100px; padding: 5px}
.project-page .project-box .project-detail .view-btn .tag-main .tag-icon{width: 90px; height: 90px}
.project-page .project-box .project-detail .view-btn .tag-main .face-box{width: 60px; height: 60px; top: 20px; left: 20px;}
.project-page .project-box .project-detail .view-btn{position: absolute; width: 100px; height: 100px; right: 10px; bottom: -50px;}

.blog-section{padding: 0px;}
.blog-section ul.blog-list li .blog-box{display: block;}
.blog-section ul.blog-list li .blog-box .blog-photo{width: 100%; display: block;}
.blog-section ul.blog-list li .blog-box .blog-detail{width: 90%; padding: 20px; margin-left: 5%; margin-top: -120px;}
.blog-section ul.blog-list li .blog-box .blog-detail .blog-title{font-size: 30px; line-height: 30px; margin-bottom: 10px}
.blog-section ul.blog-list li .blog-box .blog-detail  p{font-size: 14px; line-height: 22px; margin-bottom: 10px}
.blog-section ul.blog-list li .blog-box .blog-detail .user-name{margin-bottom: 10px}
.blog-section ul.blog-list li .blog-box .blog-detail .btn-read{font-size: 18px}
.blog-section ul.blog-list li .blog-box .blog-detail .btn-read::before {top: 11px}
.blog-section ul.blog-list li:nth-child(2n) .blog-detail{text-align: left;}
.blog-section ul.blog-list li .blog-box .blog-detail .tag-main{right: 50%; width: 120px; height: 120px; margin-right: -60px; top: -130px; border-radius: 0; transform: rotate(45deg);}
.blog-section ul.blog-list li:nth-child(2n) .blog-detail .tag-main{left: 50%; margin-left: -60px}
.blog-section ul.blog-list li:nth-child(2n) .blog-detail .user-name i{margin-right: 10px; margin-left: 0px; float: none}
.blog-section ul.blog-list li .blog-box .blog-detail .tag-main .tag-icon{width: 100px; height: 100px}
.blog-section ul.blog-list li .blog-box .blog-detail .tag-main .date-box{font-size: 16px; line-height: 16px; width: 52px; margin: -26px 0 0 -26px;}
.blog-section ul.blog-list li .blog-box .blog-detail .tag-main .date-box strong {font-size: 40px; line-height: 40px;}
.blog-section ul.blog-list li:nth-child(even) .blog-detail .btn-read{ padding-left: 45px; padding-right: 0}
.blog-section ul.blog-list li:nth-child(even) .blog-detail .btn-read::before{ top: 11px; left: 0px; right: auto;}
.blog-section ul.blog-list li:nth-child(even) .blog-detail .btn-read:hover{ padding-left: 65px; padding-right: 0px}

.contact-info-section{padding: 50px 0 0 0}
.contact-info-section h2{font-size: 40px; line-height: 50px; margin: 0 0 30px 0;}


.contact-info-section .info{margin-left: 0px}
.contact-info-section .info .icon{width: 80px; height: 80px; left: 0px}
.contact-info-section .info .title{font-size: 26px; line-height: 26px}
.contact-info-section .info .title span{font-size: 18px; line-height: 32px; margin-top: 0px}
.contact-info-section .info .info-text{font-size: 18px; line-height: 20px;}

.contact-info-section ul.social-list{margin: 50px auto 0px auto; width: 195px}
.contact-info-section ul.social-list li{width: 100px; height: 100px}
.contact-info-section ul.social-list li:nth-child(2n) {margin-top: 100px;}
.contact-info-section ul.social-list li a{line-height: 100px;font-size: 50px;}

.contact-info-section ul.location-list{margin: 80px 0px 0px 0px}
.contact-info-section ul.location-list li .location-box{display: block;}
.contact-info-section ul.location-list li .location-box .location-photo{width: 100%; height: 300px;}
.contact-info-section ul.location-list li .location-box .location-detail{width: 100%; padding: 20px; margin-left: 0px}
.contact-info-section ul.location-list li:nth-of-type(2n+2) .location-detail{margin: 0px; text-align: left;}
.contact-info-section ul.location-list li .location-box .location-detail h3{font-size: 30px; line-height: 30px; margin-bottom: 10px}
.contact-info-section ul.location-list li .location-box .location-detail p{font-size: 16px; line-height: 24px;}

.contact-form-section{padding: 0 0 80px 0}
.contact-form-section h2{font-size: 40px; line-height: 50px; margin: 0 0 30px 0;}
.contact-form-section p{font-size: 16px; line-height: 24px; padding-left: 30px}
.contact-form-section .contact-form{padding: 70px 30px 30px 30px; margin-top: 80px;}
.contact-form-section .contact-form .btn-black{margin-top: 0px}
.contact-form-section .contact-form .tag-main{left: 50%; margin-left: -60px; top: -60px;}
.contact-form-section .contact-form .tag-main .tag-icon{width: 120px; height: 120px;}
.contact-form-section .contact-form .tag-main .face-box {width: 100px; height: 100px;}


/* ravi */

.employee-title-area {padding: 250px 0 0 0;}
.employee-title-area .employee-photo {width: 120px;height: 120px; left: 61%}
.employee-title-area h1 {font-size: 60px; line-height: 60px}
.employee-title-area .position {font-size: 24px;line-height: 30px;}

.employee-detail-page{padding: 50px 0 50px 0}
.employee-detail-page .information-area {display: block;}
.employee-detail-page .information-area .employee-photo {display: block; width: 100%;}
.employee-detail-page .information-area .info-content {display: block; width: 100%; padding-left: 0% }
.employee-detail-page .information-area .info-content .detail-info span{font-size: 24px; line-height: 18px;}
.employee-detail-page .information-area .info-content .detail-info {font-size: 18px; line-height: 32px; margin-bottom: 15px;}
.employee-detail-page .information-area .info-content .btn-black {text-align: center;}

.employee-detail-page .profile-info {padding: 50px 0;}
.employee-detail-page .profile-info h2 {font-size: 38px;line-height: 40px; margin: 0 0 30px 0;}
.employee-detail-page .profile-info p {  font-size: 14px; line-height: 24px; padding-left: 0;}

.employee-detail-page .experience-area h2 {  font-size: 38px; line-height: 42px; margin: 0 0 30px 0;}
.employee-detail-page .experience-area ul.experience-list {margin: 40px 0px 0px 0px}
.employee-detail-page .experience-area ul.experience-list li {margin-left: 0%; width: 100%; padding-bottom: 30px}
.employee-detail-page .experience-area {padding: 0 0 60px 0;}
.employee-detail-page .experience-area ul.experience-list li .experience-box {padding: 0px 0px 0px 40px;}
.employee-detail-page .experience-area ul.experience-list li .experience-box .detail{font-size: 14px ; line-height: 24px;}
.employee-detail-page .experience-area ul.experience-list li .experience-box .work-position {font-size: 32px;}
.employee-detail-page .experience-area ul.experience-list li .experience-box .work-position span {font-size: 18px; float: none; display: block; line-height: 18px; margin-top: 5px}
.employee-detail-page .experience-area ul.experience-list li .experience-box .company-name {font-size: 24px;}
.employee-detail-page .experience-area {padding: 0 0 30px 0;}

.employee-detail-page .education-area ul.education-list {margin: 40px 0px 0px 0px;}
.employee-detail-page .education-area h2 {font-size: 38px; line-height: 42px; margin: 0 0 30px 0;}
.employee-detail-page .education-area ul.education-list li {margin-left: 0%; width: 100%; padding-bottom: 30px}
.employee-detail-page .education-area ul.education-list li .education-box {padding: 0px 0px 0px 40px;}
.employee-detail-page .education-area ul.education-list li .education-box .degree {font-size: 32px;}
.employee-detail-page .education-area ul.education-list li .education-box .degree span {font-size: 18px; float: none; display: block; line-height: 18px; margin-top: 5px}
.employee-detail-page .education-area ul.education-list li .education-box .university-name  {font-size: 24px;}
.employee-detail-page .education-area {padding: 0 0 30px 0;}

.employee-detail-page .skill-portfolio-area .portfolio-area{width: 100%; display:none;}
.employee-detail-page .skill-portfolio-area {padding: 0 0 50px 0; display:block;}
.employee-detail-page .skill-portfolio-area .skill-area {display: block; width: 100%;}
.employee-detail-page .skill-portfolio-area h2 {font-size: 38px; line-height: 42px;}
.employee-detail-page .skill-portfolio-area ul.skills-list li {line-height: 24px;font-size: 14px;}
.employee-detail-page .skill-portfolio-area .swiper {width: 290px;}

.gallery{display: block; margin: 0px; padding: 100px 0px 0px 0px; }
.gallery__item{display: block; width:300px; margin: 0px auto 100px auto; transform: translateY(0%) rotate(3deg) !important; position: relative; padding-top: 60px}
.gallery__item-img{width: 260px; height: 340px; margin: 0px auto 0 auto;}
.gallery__item-imginner {background-size: cover; background-position: 50% 0; width: 100%; height: 100%;}
.gallery__item-caption{position: absolute; top: 0px; width: 100%; height: 100%}
.gallery__item-caption .tag-main{position: absolute; bottom: 0px; left: 0px; z-index: 2; border-radius: 50%; transition: all 0.25s ease-out; }
.gallery__item-caption .tag-main .tag-icon{animation-name: spin; animation-duration: 10000ms; animation-iteration-count: infinite; animation-timing-function: linear; width: 120px; height: 120px;}
.gallery__item-caption .tag-main .face-box{ width: 100px; height: 100px; text-align: center; position: absolute; top: 10px; left: 10px}
.gallery__item-caption .tag-main .face-box img{width: 100%}

.case_studies_area .gallery__item-caption .tag-main{background: #28b1ff; padding: 10px}
.case_studies_area .gallery__item-caption .tag-main .tag-icon{width: 100px; height: 100px}
.gallery__item-caption .tag-main .face-box{width: 70px; height: 70px;  top: 25px; left: 25px;}
.gallery__item-link {position: absolute; bottom: -60px; width: 120px; height: 120px; left: -20px;}
.gallery__item-number {position: absolute; left: -20px; color: #28b1ff; top: 0px; font-size: 40px; font-family: 'impactregular';line-height: 50px; width: 40px; text-align: center;}
.gallery__item-title {font-size: 40px; font-family: 'impactregular'; position: absolute; top: 0px; line-height: 50px; left: 30px;}
.gallery__item-tags {position: absolute; bottom: -30px; font-size: 14px; right: 20px; text-transform: uppercase;}
.gallery__text{font-family: 'impactregular'; font-size: 70px; line-height: 70px; text-align: center; margin-bottom: 60px}
.gallery__text span{display: block;}
.arrow {width: 50px; height: 50px; display: inline-block; position: fixed; background: #fff; right: 20px; top: 14px; z-index: 111}
.arrow::after {content: ""; display: block; top: 50%;left: 50%;border-style: solid;border-color: #05153d; position: absolute; transform-origin: 50% 50%; width: 40px; height: 0; border-width: 2px 0 0 0; transform: translate(-14px, -1px);}
.arrow::before {content: ""; display: block; width: 30px; height: 30px; top: 50%; left: 50%; border-style: solid; border-color: #05153d; border-width: 2px 2px 0 0; position: absolute; transform-origin: 50% 50%; transform: rotate(-135deg); margin: -15px 0 0 -10px;}

.gallery__item:nth-of-type(2n+2){transform: translateY(0%) rotate(-3deg) !important;}

.blog-pagination{margin: 0px; padding: 20px 0}
.blog-pagination ul{width: 204px}
.blog-pagination .back,
.blog-pagination .next{width: 80px;}
.blog-pagination .next a, .blog-pagination .back a{font-size: 24px}
.blog-pagination .back::before, .blog-pagination .back::after{content: none}
.blog-pagination .next::before, .blog-pagination .next::after{content: none}

.career-section{padding: 50px 0}
.career-section h2{font-size: 38px; line-height: 42px}
.career-section p{font-size: 16px; line-height: 24px; padding-left: 30px}

.vacancies-section{padding: 50px 0 60px 0}
.vacancies-section h2{font-size: 40px; line-height: 50px; margin: 0 0 30px 0}
.vacancies-section p{font-size: 16px; line-height: 24px; padding-left: 30px}
.vacancies-section ul.vacancies-list{display: block; margin-top: 30px}
.vacancies-section ul.vacancies-list li{width: 100%; padding: 0px; margin-bottom:80px}
.vacancies-section ul.vacancies-list li:nth-of-type(2n+2){padding: 0px; margin-top: 0px;}
.vacancies-section ul.vacancies-list li .vacancie{text-align: center; padding: 30px 15px 70px 15px}
.vacancies-section ul.vacancies-list li .vacancie .icon-box{margin: 0 auto;}
.vacancies-section ul.vacancies-list li .vacancie .jobtitle{font-size: 24px; line-height: 30px; margin: 10px 0}
.vacancies-section ul.vacancies-list li .vacancie .view-btn {position: absolute; width: 120px; height: 120px; right: 50%; bottom: -60px; margin-right: -60px;}
.vacancies-section ul.vacancies-list li .vacancie .view-btn .tag-main{width: 120px; height: 120px;}
.vacancies-section ul.vacancies-list li .vacancie .view-btn .tag-main .tag-icon{width: 100px; height: 100px;}
.vacancies-section ul.vacancies-list li .vacancie .view-btn .tag-main .face-box{width: 60px; height: 60px; left: 30px; top: 30px}

.career-top-page{padding-top: 120px}
.career-top-page h1{font-size: 40px; line-height: 50px; margin: 0 0 20px 0; display: none}
.career-top-page .info {text-align: center; margin-bottom: 20px; font-size: 16px; display: none}
.career-top-page .career-banner{background: #28b1ff}
.career-top-page .career-banner .banner-job{display: none;}
.career-top-page .career-banner .banner-content-area{position: relative; top: 0px; left: 0px; padding: 30px; text-align: center;}
.career-top-page .career-banner .banner-content-area .icon{margin: 0 auto 20px auto;}
.career-top-page .career-banner .banner-content-area .title{font-size: 20px; line-height: 26px}
.career-top-page .career-banner .banner-content-area .title span{font-size: 30px; line-height: 32px}

.career-info-area{padding: 50px 0 0 0}
.career-info-area h2{font-size: 40px; line-height: 50px; margin: 0 0 20px 0}
.career-info-area .content-area{padding: 0px}
.career-info-area .content-area p{font-size: 16px; line-height: 24px; padding-left: 30px}
.career-info-area .content-area ul.info{display: block; padding-left: 30px}
.career-info-area .content-area ul.info li{display: block; width: 100%; border-right: none; border-bottom: #434343 1px solid; padding: 15px 0}
.career-info-area .content-area ul.info li:last-child{border-bottom: none}
.contact-form-section p a{word-wrap: anywhere;}
.career-info-area .content-area ul.technologies li{padding-right: 0px}
.contact-form-section .blog-pagination {margin-top: 50px;}

.case-area{padding: 100px 0 100px 0; height: auto; overflow: hidden; position: relative;}
.case-area .yellow-svg{width: 420px; height: 420px; margin-left: -210px; left: 50%; top: -135px; margin-top: 0px;}
.case-area .content-area{display: block; margin: 0px; width: 100%}
.case-area .case-icon{margin-right: 0}
.case-area .case-icon .icon{width: 200px; height: 200px; margin: 0 auto 20px auto;}
.case-area h1{font-size: 60px; line-height: 60px; text-align: center; }
.case-area p {font-size: 20px; line-height: 26px; text-align: center;}
.case-area #particles-js{display: none}
.screen-mobile-area .img-block{height: auto;}
.screen-mobile-area .img-block .about-img-item{position: relative; width: 70% !important; }
.screen-mobile-area .img-block .about-img-item:nth-child(1){left: 0; top: 0px;}
.screen-mobile-area .img-block .about-img-item:nth-child(2){left: 30%; top: 0px; margin-left: 0px; margin-top: -50px}
.screen-mobile-area .img-block .about-img-item:nth-child(3){right: 0px; margin-top: -50px}
.screen-mobile-area .img-block .about-img-item:nth-child(4){top: auto; left: 30%; margin-top: -50px}
.screen-mobile-area .img-block .about-img-item:nth-child(5){right: 0px; top: 0px; margin-top: -50px}

.information-technologies-area{padding: 50px 0}
.information-technologies-area h2{font-size: 40px; line-height: 50px; margin: 0 0 30px 0;}
.information-technologies-area h2 span {line-height: 24px}
.information-technologies-area .content-area{padding: 0px}
.information-technologies-area .content-area p{font-size: 16px; line-height: 24px; padding-left: 30px}

.mobile-mockup-photo{width: 100%}
.information-technologies-area .content-area ul.technologies{margin: 30px 0px 0px 0px; padding-left: 30px}
.information-technologies-area .content-area ul.technologies li{width: 100%; padding-right: 0px; padding-bottom: 10px}

.photo-mobile-area .img-block{height: auto;}
.photo-mobile-area .img-block .about-img-item{position: relative;}
.photo-mobile-area .img-block .about-img-item:nth-child(1){width: 80%}
.photo-mobile-area .img-block .about-img-item:nth-child(2){width: 80%; left: 20%}

.typography-area{padding: 50px 0}
.typography-area h2{font-size: 40px; line-height: 50px; margin: 0 0 30px 0;}
.typography-area .content-area{padding-left: 0px}
.typography-area ul.color-list{margin: 20px 0px 0px 0px}
.typography-area ul.color-list li{width:50%; margin-top: 20px}
.typography-area ul.color-list li .color-box{width: 120px; height: 120px}
.typography-area ul.color-list li .color-title {font-size: 16px; line-height: 20px;}
.typography-area ul.color-list li .color-title span {font-size: 18px;}

.laptop-screen{margin: 0 auto 50px auto}
.webphoto-2{width: 100%;}
.webphoto-2 .webphoto {width: 100%; height: auto;}
.desktop-area .img-block{height: auto;}
.desktop-area .img-block .about-img-item{position: relative;}
.desktop-area .img-block .about-img-item:nth-child(1){left: 20%; width: 80%; z-index: 1; top: 0;}
.desktop-area .img-block .about-img-item:nth-child(2){left: 0px; right: auto; width: 80%}

.tablet-mobile-area{padding: 0 0 50px 0}
.tablet-mobile-area .img-block{height: auto;}
.tablet-mobile-area .img-block .about-img-item{position: relative;}
.tablet-mobile-area .img-block .about-img-item:nth-child(1){left: 5%; width: 50%; z-index: 1; top: 0;}
.tablet-mobile-area .img-block .about-img-item:nth-child(2) {width: 100%; left: 0%; margin-top: -100PX}
.tablet-mobile-area .img-block .about-img-item:nth-child(3){left: 45%; width: 50%; z-index: 1; top: 0; margin-top: -100PX}

.logo-photo-area ul.logo-list-area li{width: 90%; margin-bottom: 20px}
.logo-photo-area ul.logo-list-area li:nth-of-type(2n+2){margin-left: 10%}

.service-area{height: auto; padding: 110px 15px 50px 15px; width: 100%}
.service-area .icon{position: relative; top: 0px; margin-bottom: 20px; width: 120px; height: 120px; padding: 20px;}
.service-area h1{font-size: 40px; line-height: 50px; padding-left: 0px}
.service-area p{font-size: 16px; line-height: 24px; padding-left:   0px}

.service-page-section{padding: 50px 0}
.service-page-section h2{font-size: 40px; line-height: 50px; margin: 0 0 20px 0}
.service-page-section p{font-size: 16px; line-height: 24px; padding-left:   30px}

.service-photo-area .img-block{height: auto;}
.service-photo-area .img-block .about-img-item{position: relative; width: 90% !important}
.service-photo-area .img-block .about-img-item:nth-child(2){width: auto; left: 10%}
.service-photo-area .img-block .about-img-item:nth-child(1){top:0px}
.service-page-section ul.technology-list li {width: 100%; padding: 0 0px 0 80px; margin-bottom: 10px;}

.blog-detail-page{padding: 100px 0}
.blog-detail-page h1{font-size:40px; line-height: 50px;}
.blog-detail-page .info{font-size: 16px; margin-bottom: 20px}
.blog-detail-page .info span{display: block; font-size: 0px;}
.blog-detail-page .blog-content{padding: 20px 0 0 0}

.technologie-area{height: auto; padding: 110px 15px 50px 15px; width: 100%}
.technologie-area .icon{position: relative; top: 0px; margin-bottom: 20px; width: 120px; height: 120px; padding: 20px;}
.technologie-area h1{font-size: 40px; line-height: 50px; padding-left: 0px}
.technologie-area h2{font-size: 16px; line-height: 24px; padding-left:   0px}
.technologie-area p{font-size: 16px; line-height: 24px; padding-left:   0px}

.why_choose_section{padding: 50px 0;}
.why_choose_section h2{font-size: 40px; line-height: 50px; margin: 0 0 20px 0}
.why_choose_section ul{margin: 0px;}
.why_choose_section ul li{font-size: 16px; line-height: 22px; padding-left:   30px}
.why_choose_section ul li::after {width: 18px; height: 18px; top:3px}

.technologie_service_section{padding: 50px 0;}
.technologie_service_section h2{font-size: 40px; line-height: 50px; margin: 0 0 20px 0}
.technologie_service_section ul{margin: 0px;}
.technologie_service_section ul li{font-size: 16px; line-height: 22px; padding-left:   30px}
.technologie_service_section ul li::after {width: 18px; height: 18px; top:3px}

.advantage-section{padding: 50px 0;}
.advantage-section h2{font-size: 40px; line-height: 50px; margin: 0 0 20px 0}
.advantage-section ul.advantage-list li{margin-left: 0px; width: 100%; padding-bottom: 30px;}
.advantage-section ul.advantage-list li .advantage-box{padding: 0px 0px 0px 50px;}
.advantage-section ul.advantage-list li .advantage-box .subtitle{font-size: 28px;}
.advantage-section ul.advantage-list li .advantage-box .list {line-height: 20px; font-size: 14px; margin-bottom: 0;}

.quick-features-section .main-area{display: block; height: auto; position: relative;}
.quick-features-section h2{font-size: 30px; line-height: 30px;}
.quick-features-section .leftside{position:relative; width: 100%;}
.quick-features-section .rightside{position:relative; width: 100%;}
.quick-features-section ul.list li{line-height: 24px; font-size: 14px; padding-left: 18px;}
.quick-features-section ul.list li::after {top: 7px; border-top: 6px solid transparent; border-left: 7px solid #fff; border-bottom: 6px solid transparent;}

.why-hire-section{padding: 50px 0;}
.why-hire-section h2{font-size: 40px; line-height: 50px; margin: 0 0 20px 0}
.why-hire-section ul.service-tabs li{width: 100%; margin-bottom: 10px;}
.why-hire-section ul.service-tabs li a{padding: 0px 0px 0px 30px; font-size: 16px; line-height: 20px; position: relative;}
.why-hire-section .plus-btn{width: 20px; height: 20px; position: absolute; top: 0px; left: 0px;}
.why-hire-section .plus-btn::before {height: 20px;}
.why-hire-section .plus-btn::after {width: 20px;}
.why-hire-section .service-main{display: block;}
.why-hire-section .service-main .left-icon-area{width: 80px;}
.why-hire-section .service-main .right-area {width: 100%; padding-left: 0; padding-top: 15px;}
.why-hire-section p {font-size: 16px; line-height: 24px;}

.hire-advantages-section{padding: 50px 0;}
.hire-advantages-section h2{font-size: 40px; line-height: 50px; margin: 0 0 20px 0}
.hire-advantages-section ul{margin: 40px 0px 0px 0px;}
.hire-advantages-section ul li .link{padding: 20px 0;}
.hire-advantages-section ul li .link span{font-size: 24px; line-height: 30px; margin-bottom: 5px; opacity: 1;}
.hire-advantages-section ul li .link p {font-size: 16px; line-height: 24px;}
.hire-advantages-section ul li .link .icon {position: relative; opacity: 1; top: 0; left: 0px; transition: all .5s ease; width: 80px; height: 80px; margin-top: 0; margin-bottom: 10px;}
.hire-advantages-section ul li:hover .link{padding: 20px 0;}
.btn-black{padding: 20px; font-size: 16px !important;}

.faq-section{padding: 20px 0 50px 0;}
.faq-section h2{font-size: 40px; line-height: 50px; margin: 0 0 20px 0}
.faq-section .card .card-header .btn-link{font-size: 16px; padding: 16px 40px 16px 0px;}
.wpcf7-spinner{margin: 0px;}


.our-feature-area .features-block-main{display: block; margin-bottom: 50px;}
.our-feature-area .features-block-main .photo-block{width: 100%; height: auto;}
.our-feature-area .features-block-main .photo-block img{position: relative;}
.our-feature-area .features-block-main .features-content-block{width: 100%; margin: 0px; padding: 20px;}
.our-feature-area .features-block-main .features-content-block h2{font-size: 26px; line-height: 36px;}
.our-feature-area .features-block-main .features-content-block ul.features-list-area li{width: 50%;}
.our-feature-area .features-block-main .features-content-block ul.features-list-area li .icon{width: 30px; height: 30px; padding: 5px; margin-right: 6px;}
.our-feature-area .features-block-main .features-content-block ul.features-list-area li a{font-size: 12px; letter-spacing: 0px;}

.google-review-section{padding: 0px;}
.google-review-section h2{font-size: 40px; line-height: 50px; margin: 0 0 20px 0}
.wp-gr .wp-google-left{display: block !important;}
.wp-gr .grw-slider .grw-slider-header-inner, .wp-gr .grw-slider .grw-slider-review-inner{padding: 20px !important; margin: 0px !important; text-align: center !important;}
.google-review-section .wp-gr.wpac .grw-slider-header .wp-google-left img{margin-right: 0px !important;}
.wp-gr .grw-slider .grw-slider-reviews{margin: 0px !important;}
.wp-gr .wp-google-left img{float: none !important; margin: 0 0 20px 0 !important;}

.school-area .school-block{padding: 30px; border-radius: 60px 60px 30px 30px; text-align: center;}
.school-area .school-block .photo-block {position: relative; width: 100%; left: 0; top: 0px; margin-top: -90px;}
.school-area .school-block h2{font-size: 24px; line-height: 30px; margin-bottom: 10px; margin-top: 10px;}
.school-area .school-block .btn-black{text-align: center;}

.blog-detail-page .blog-content h3{font-size: 20px;}
.blog-detail-page .blog-content ul.hightlight-point{margin: 0px;}
.blog-detail-page .blog-content ul.hightlight-point li{margin: 0 0 10px 0; width: 100%;}

}