/* General CSS */
/* font-family: 'Overpass', sans-serif;
font-family: 'Poppins', sans-serif; */
* {font-family: 'Poppins', sans-serif; color: #222D39;}
html { -webkit-tap-highlight-color: transparent; -webkit-font-smoothing: antialiased }
a, abbr, acronym, address, b, bdo, big, blockquote, body, br, button, cite, code, dd, del, dfn, div, dl, dt, em, fieldset, form, h1, h2, h3, h4, h5, h6, hr, html, i, iframe, img, ins, kbd, legend, li, map, object, ol, p, pre, q, samp, small, span, strong, sub, sup, table, tbody, td, tfoot, th, thead, tr, tt, ul, var { margin: 0; padding: 0; border: none }
a, input, select, textarea { outline: 0; margin: 0; padding: 0 }
.btn,a{-webkit-transition:all .5s ease 0s;-moz-transition:all .5s ease 0s;-o-transition:all .5s ease 0s;transition:all .5s ease 0s;}
.btn.focus,.btn:focus,.btn:hover,a:focus,a:hover,button:focus,input:focus{text-decoration:none;outline:0;color:#FFF;text-decoration:none!important;transition:all .3s ease 0s;}
body{font-family: 'Raleway', sans-serif;overflow-x: hidden;}
a {text-decoration: none;}
/* Colors CSS */


/* Typography CSS */
h1 {font-size: 60px;line-height: 79px;color: #222D39; font-weight: 700;}
h2 {font-size: 38px;line-height: 57px;color: #222D39;font-weight: 700;margin-bottom: 18px;}
p {color: #677294;font-size: 16px; line-height: 26px;}

/* Button CSS */
.btn-primary {background-color: #FCD404; border-color: #FCD404; border-radius: 54px;font-size: 16px;line-height: 20px; font-weight: 500;color: #222D39;padding: 14px 30px;}
.btn-primary:focus, .btn-primary:hover{background: #222D39; border-color: #222D39;box-shadow:none !important; color: #fff;}
.btn-secondary {background-color: #00BED6; border-color: #00BED6; border-radius: 54px;font-size: 16px;line-height: 20px; font-weight: 500;color: #ffffff;padding: 14px 30px;}
.btn-secondary:focus, .btn-secondary:hover{background: #222D39; border-color: #222D39;box-shadow:none !important; color: #fff;}


/* Global CSS */
.px-20 {padding-left: 20px !important;padding-right: 20px !important;}
.section {padding: 100px 0;}

/* Header CSS */
header {padding: 40px 0;position: fixed;width: 100%;top: 0; z-index: 1; transition: 0.3s all;}
header.fixed {padding: 10px 0;background: #fff;box-shadow: 0 0px 5px rgba(0, 0, 0,0.1); z-index: 9;}
.navbar-brand {width: 145px;margin: 0 125px 0 0;height: 60px;}
.navbar-brand img {width: 115%;height: 100%;object-fit: cover;}
.navbar-light .navbar-nav .nav-link {color: #000;font-size: 16px;font-weight: 500;}
.navbar-light .navbar-nav .nav-item {margin-right: 45px;}
.dropdown-toggle::after {content: "\f078";font-family: "Font Awesome 5 free";font-weight: 900;border: none;font-size: 10px;margin-left: 3px;position: relative;top: 1px;}
.navbar-nav .dropdown-menu {border-color: #f0f0f0;box-shadow: 0 0px 9px rgba(0, 0, 0,0.05);padding: 0;border-radius: 10px;overflow: hidden;}
.navbar-nav .dropdown-menu a.dropdown-item {padding: 10px 20px;}
.navbar-toggler {float: right;border: none;padding-right: 0;margin-top: 15px;padding-left: 0;}
.navbar-toggler-icon {width: 24px;height: 17px;background-image: none !important;position: relative;border-bottom: 1px solid #000;transition: all 300ms linear;margin-top: -8px;}
.navbar-toggler-icon:after, .navbar-toggler-icon:before{width: 24px;position: absolute;height: 1px;background-color: #000;top: 0;left: 0;content: '';z-index: 2;transition: all 300ms linear;}
.navbar-toggler-icon:after{top: 8px;}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:after {transform: rotate(45deg);}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:before {transform: translateY(8px) rotate(-45deg);}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {border-color: transparent;}
.navbar-light .navbar-toggler:focus {border: none;box-shadow: none;}
.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link.active {color: rgb(42 220 231) !important;}

.home-hero-section, .inner-hero-section {padding: 200px 0;background-size: cover;background-repeat: no-repeat;background-position: center;}
.home-hero-section .container, .inner-hero-section .container {position: relative;}
.hero-content p {max-width: 532px;margin: 30px 0 35px;}
.home-hero-section .btm-icon {position: absolute;bottom: -200px;width: 141px;left: -100px;}
.service-section-top {margin-top: 50px;}
.service-wrap h3 {margin: 45px 0 20px;font-size: 26px;line-height: 32px;font-weight: 600;}
.service-wrap p {max-width: 300px;margin: 0 auto 15px;}
.about-inner-info {box-shadow: 3px 4px 27px rgba(0, 0, 0, 0.11);padding: 100px 40px 150px 50px;background: #fff;max-width: 610px;}
.section-title h2 {margin: 50px 0;}
.section-title h5 {color: #00BED6;font-size: 16px;font-weight: 700;text-transform: uppercase;}
.about-inner-info a {text-decoration: none;font-size: 16px;color: #222D39;font-weight: 600;}
.about-inner-info a:hover {color: #00BED6;}
.about-info-wrap {margin-top: -85px;background-size: contain;padding-bottom: 230px;background-repeat: repeat-x;background-position: center;}
.about-inner-info h2 {
    font-weight: 500;
}
.about-info-wrap p {font-size: 16px;line-height: 28px;letter-spacing: 0.03em;margin-bottom: 40px;}
.about-info-wrap p:last-child {margin-bottom: 0;}
.about-info-wrap p:first-child {margin-top: 50px;}
.development-process .service-wrap .img-wrap {min-height: 85px;}
.development-process h2 {margin-bottom: 100px;}
.service-section .container {max-width: 1900px;margin: 0 auto;padding: 0;}
.service-section .container .row {margin: 0 !important;padding: 0;}
.serviceSwiper {padding: 40px 0;}
.service-wrapper {background: #FFFFFF;box-shadow: 3px 4px 27px rgba(0, 0, 0, 0.11);padding: 50px 50px;text-align: center;display: block; height: 623px;}
.serviceSwiper .swiper-slide:first-child {padding-left: 30px;}
.serviceSwiper .swiper-slide:last-child {padding-right: 30px;}
.service-wrapper .img-wrap {height: 280px;display: flex;align-items: center;justify-content: center;}
.service-wrapper .img-wrap img {width: 100%;height: 100%;object-fit: contain;}
.service-wrapper h3 {color: #222D39;font-size: 26px;line-height: 34px;font-weight: 600;margin-bottom: 30px;margin-top: 15px;}
.service-wrapper p {font-size: 15px;}
.expertise-section .nav-tabs .nav-item .nav-link {font-size: 16px;font-weight: 600;color: #222D39;border: none;position: relative;padding: 10px 35px;}
.expertise-section .nav-tabs {border-bottom: none;justify-content: space-between;}
.expertise-section .nav-tabs .nav-item .nav-link:after {content: "";width: 100%;height: 4px;background: #FCD404;position: absolute;left: 0;bottom: 0;opacity: 0;}
.expertise-section .nav-tabs .nav-item .nav-link.active:after {opacity: 1;}
.expertise-section .nav-tabs .nav-item .nav-link.active {color: #FCD404;}
/* .expertise-section .tab-content {
    margin-top: 70px;
} */
ul.expertise-list {display: flex;justify-content: center;flex-wrap: wrap;max-width: 1000px;margin: 0 auto;}
ul.expertise-list li {list-style: none;text-align: center;margin: 70px 50px 0;}
ul.expertise-list li .expertise-img {margin-bottom: 10px;}
.work-wrp .img-wrap {height: 500px;margin-bottom: 25px;}
.work-wrp .img-wrap img {width: 100%;height: 100%;object-fit: cover;}
.work-wrp h3 {font-size: 24px;font-weight: 700;margin-bottom: 8px;}
.work-wrp {margin-top: 60px;}
.latest-work-section h2 {margin-bottom: 20px;}
.news-wrap {background: #FFFFFF;box-shadow: 3px 4px 27px rgba(0, 0, 0, 0.11);margin-top: 30px;}
.news-wrap .img-wrap {height: 320px;}
.news-wrap .img-wrap img {height: 100%;object-fit: cover;width: 100%;}
.news-wrap .news-info {padding: 30px;}
.news-wrap .news-info .date {font-size: 15px;font-weight: 500;display: flex;align-items: center;}
.news-wrap .news-info .date img {margin-right: 7px;}
.news-wrap .news-info h3 {font-size: 26px;font-weight: 600;margin: 30px 0;}
.news-wrap .news-info .news-btm {display: flex;align-items: center;justify-content: space-between;}
.news-wrap .news-info .news-btm a {text-decoration: none;display: flex;align-items: center;font-size: 15px;font-weight: 500;}
.news-wrap .news-info .news-btm a:first-child img {margin-left: 12px;}
.news-wrap .news-info .news-btm a:first-child, .news-wrap .news-info .news-btm a:last-child:hover {color: #222D39;}
.news-wrap .news-info .news-btm a:last-child, .news-wrap .news-info .news-btm a:first-child:hover {color: #00BED6;}
.news-wrap .news-info .news-btm a:last-child img {margin-right: 12px;position: relative;top: -2px;}
.blog-article-section {background-size: contain;background-position: center;padding-bottom: 180px;background-repeat: repeat-x;/* background-color: rgba(250, 252, 254, 0.84); */}
.want-work-section .btn-grp {margin-top: 60px;}
.want-work-section .btn-grp a {margin: 0 10px;}
footer {background-color: rgba(250, 252, 254, 0.84);background-position: center;background-size: cover;background-blend-mode: color;position: relative;}
footer.section .top-footer, footer.section .bottom-footer {position: relative;z-index: 1;}
footer.section .top-footer{padding-bottom: 350px;}
.footer-wrap h4 {font-weight: 700;font-size: 25px;margin-bottom: 60px;}
.footer-wrap li {list-style: none;}
.footer-wrap p {font-weight: 700;color: #222D39;max-width: 440px;margin-bottom: 40px;}
ul.social-icons {display: flex;align-items: center;}
ul.social-icons li i {width: 40px;height: 40px;display: flex;align-items: center;justify-content: center;background: #000;border-radius: 50%;color: #fff;margin: 0 8px;font-size: 19px;transition: 0.3s all;}
ul.social-icons li a {text-decoration: none;transition: 0.3s all;}
ul.social-icons li:first-child i {margin-left: 0;}
ul.social-icons li a:hover i {background: #fcd404;color: #000;}
.footer-links {display: flex;justify-content: space-between;margin-left: 100px;}
.footer-wrap ul.ft-links li a {font-weight: 700;color: #222D39;text-decoration: none;font-size: 16px;line-height: 38px;}
.footer-wrap ul.ft-links.contact-info li a {position: relative;display: flex; align-items: start;margin-bottom: 20px;}
.footer-wrap ul.ft-links.contact-info li a span{padding-left: 45px;line-height: 26px; transition: 0.3s all;}
.footer-wrap ul.ft-links.contact-info li a img {width: 30px;height: 30px;background: #000;border-radius: 50%;padding: 6.5px;margin-right: 10px;position: absolute;left: 0;}
ul.ft-links.contact-info {max-width: 300px;}
.footer-wrap ul.ft-links li a:hover, .footer-wrap ul.ft-links li a:hover span {color: #00BED6;}
.bottom-footer p {color: #677294;font-weight: 700;padding-bottom: 30px;}
 #canvas{position: absolute;background-color: transparent;width: 100%;height: 100%;z-index: 0;top: 0;overflow: hidden;} 
.animatedplane {position: absolute;}
.plane01 { right: -50%; top:50%; width: 360px;}
.plane02 { right: 100%; top:20%; width: 210px;}
.plane01 img, .plane02 img {width: 100%; opacity: 0.45;}
.blog-article-section .container, .testimonial-section .container, .development-process .container, .service-section .container, .about-info-wrap .container {position: relative;}
.blog-article-section .top-icon, .blog-article-section .bottom-icon, .testimonial-section .top-icon, .testimonial-section .bottom-icon, .development-process .top-icon, .development-process .bottom-icon, .service-section .bottom-icon, .about-info-wrap .top-icon {position: absolute;}
.blog-article-section .top-icon, .testimonial-section .top-icon, .development-process .top-icon {top: -150px;left: -60px;}
.blog-article-section .bottom-icon, .testimonial-section .bottom-icon, .development-process .bottom-icon{right: -80px;bottom: -200px;}
.testimonial-section .top-icon {top: -170px;}
.development-process .bottom-icon {bottom: -150px;}
.service-section .bottom-icon {right: 90px;bottom: -160px;}
.about-info-wrap .top-icon {right: -80px;top: 0;}
.testimonialSlider {/* padding-left: 300px; */margin-top: 50px;}
.testimonialSlider .swiper-pagination {display: flex;flex-direction: column;height: 100%;justify-content: center;width: 60px;left: 80px;}
.testimonialSlider .swiper-pagination span.swiper-pagination-bullet {font-size: 17px;background: transparent;line-height: 40px;height: auto;font-weight: 600;text-decoration: underline;color: #222D39;transition: 0.3s all;width: auto;text-align: center;opacity: 1;}
.testimonialSlider .swiper-pagination span.swiper-pagination-bullet.swiper-pagination-bullet-active{font-size: 26px;color: #00BED6;}
.testimonialSlider .swiper-slide {display: flex;align-items: center;justify-content: center;}
.testimonialSlider .swiper-slide .testimonial-img {min-width: 365px;position: relative;margin-right: 60px;max-width: 365px;margin-left: 170px;}
.testimonialSlider .swiper-slide .testimonial-img img {width: 100%;}
.testimonialSlider .swiper-slide .testimonial-descp h4 {font-size: 26px;font-weight: 600;margin: 20px 0 10px;}
.testimonialSlider .swiper-slide .testimonial-descp h5 {color: #677294;font-size: 15px;margin-bottom: 15px;}
.testimonialSlider .swiper-slide .testimonial-descp p {margin-top: 10px;max-width: 455px;}
.testimonialSlider .swiper-slide .testimonial-img:before {content: "";background-image: url(../images/testimonial-top-flow.svg);position: absolute;top: 140px;width: 100px;height: 10px;left: -50px;}
.testimonialSlider .swiper-slide .testimonial-img:after {content: "";background-image: url(../images/testimonial-bottom-flow.svg);position: absolute;top: 165px;width: 100px;height: 10px;left: -50px;z-index: -1;}

.inner-hero-section .hero-content h1 {line-height: 70px;}
.service-hero .hero-content h1 {max-width: 400px;}
.service-inner-section .service-wrapper {margin-top: 50px;height: calc(100% - 50px);}
.service-inner-section .service-wrapper h3 {transition: 0.3s all;}
.service-inner-section .service-wrapper:hover h3 {color: #46e1ea;}
.inner-hero-section.work-hero .hero-image {max-width: 320px;margin-left: auto;margin-right: 70px;}
.inner-hero-section.work-hero .hero-content h1 {max-width: 500px;}
.inner-hero-section.work-hero .hero-content p {max-width: 400px;}
.inner-hero-section.blog-hero .hero-image {max-width: 400px;margin-left: auto;}
.inner-hero-section.blog-hero .hero-content p {max-width: 450px;}
.blog-inner-section .news-wrap {margin-top: 50px;height: calc(100% - 50px);}
.blog-inner-section h2 {margin-bottom: 30px;}
.inner-hero-section.careers-hero .hero-image {max-width: 430px;margin-left: auto;}
.inner-hero-section .hero-content a, .help-list a {color: #222D39;display: inline-flex;align-items: center;}
.inner-hero-section .hero-content a span, .help-list a span {width: 36px;height: 36px;background: #00BED6;display: flex;align-items: center;justify-content: center;border-radius: 50%;margin-left: 15px;}
.career-wrap h4 {font-size: 20px;font-weight: 700;margin-bottom: 20px;}
.career-wrap a {color: #677294;margin-top: 15px;display: inline-block;}
.career-wrap a svg {margin-left: 7px;}
.career-wrap {margin-top: 60px;}
.career-wrap a:hover{color: #4ae1eb;}
.career-wrap a:hover svg path {fill: #4ae1eb;}
.our-culture-section .news-wrap .news-info h3 {margin-top: 0;}
.our-culture-section .news-wrap .news-info p {max-width: 295px;margin: 0 auto;}
.our-culture-section .news-wrap .news-info {padding: 40px 30px;}
.inner-hero-section.contact-hero {background-position: center bottom;padding-bottom: 400px;}
.inner-hero-section.contact-hero .hero-content {margin-top: 100px;}
.contact-form-wrap {background: #FFFFFF;box-shadow: 3px 4px 27px rgba(0, 0, 0, 0.11);border-radius: 10px;padding: 40px;max-width: 430px;margin-left: auto;}
.contact-form-wrap .form-control {background-color: #FFFFFF;box-shadow: 0px -1px 18px rgba(0, 0, 0, 0.04), 0px 4px 10px rgba(0, 0, 0, 0.08);border-radius: 10px;height: 56px;border-color: transparent;padding: 0 15px;}
.contact-form-wrap h3 {font-size: 24px;font-weight: 700;margin-bottom: 25px;}
.contact-form-wrap textarea.form-control {height: 105px;resize: none;padding-top: 10px;}
.location-box {max-width: 350px;padding: 20px;background: #FFFFFF;box-shadow: 3px 4px 27px rgba(0, 0, 0, 0.11);border-radius: 10px;position: relative;margin-top: 100px;}
.location-box p {margin: 0;text-align: center;}
.location-box svg {position: absolute;bottom: -13px;left: 58px;}
.location-circle {position: relative;height: 140px;width: 140px;margin-top: 20px;margin-left: 47px;top: 30px;}
.dot {width: 40px;height: 40px;border: 5px solid #00BED6;border-radius: 600px;background-color: #00BED6;z-index: 10;position: absolute;}  
.base-pulse{background: transparent;border-radius: 600px;height: 80px;width: 80px;position: absolute;top: -20px;left: -20px;z-index: 1;opacity: 0;border: 10px solid rgba(0, 190, 214, 0.26);;}  
.pulse1 {animation: pulse1 2s ease-out infinite;}  
.pulse3 {animation: pulse1 2s ease-out infinite;animation-delay: 1000ms;}
@-webkit-keyframes pulse1 {0%   {transform: scale(0.1, 0.1); opacity: 0.0;}50%  {opacity: 1.0;}100% {transform: scale(1.2, 1.2); opacity: 0.0;}}
.inner-hero-section.services-hero .hero-content a:hover {color: #fff;}
.help-list {margin-top: 80px;}
.help-list h4 {font-size: 20px;font-weight: 600;line-height: 30px;margin-bottom: 20px;}
.help-list p {font-weight: 500;}
.help-list a {display: flex;align-items: center;justify-content: space-between;margin-top: 30px;color: #222D39;font-weight: 600;font-size: 16px;}
.help-list a span img {position: relative;transform: rotate(-90deg);}
.help-list a:hover {color: #00BED6;}
.help-list a:hover span {background-color: #000;}
.can-help-section h2 {margin: 0;}
.inner-hero-section.services-hero .hero-content h1 {max-width: 568px;}
.inner-hero-section.services-hero .hero-image {height: 530px;}
.inner-hero-section.services-hero .hero-image img {height: 100%;object-fit: contain;}
.ui-ux-works {background-size: contain;background-repeat: repeat-x;}
.ui-ux-works .img-wrap {max-width: 440px;margin: 0 auto;}
.ui-ux-works p {margin-bottom: 15px;max-width: 530px;}
.design-approach .service-wrap {margin-top: 50px;}
.workshop-section {margin-top: -80px;}
.workshop-wrap {background: #FFFFFF;box-shadow: 3px 4px 27px rgba(0, 0, 0, 0.11);border-radius: 10px;padding: 40px;height: calc(100% - 30px);margin-top: 30px;}
.workshop-wrap h3 {font-size: 26px;font-weight: 600;margin-bottom: 20px;}
.workshop-wrap p {max-width: 300px;}
.workshop-section .container {max-width: 1200px;}


.inner-hero-section.about-hero .hero-image {
    max-width: 396px;
    margin-left: auto;
}
.inner-hero-section .hero-content .btn-links {
    display: flex;
    align-items: center;
}
.inner-hero-section .hero-content .btn-links a:first-child {
    margin-right: 30px;
}
.inner-hero-section .hero-content a:hover {
    color: #00bed6;
}
.inner-hero-section .hero-content a:hover span {transition: 0.3s all;}
.inner-hero-section .hero-content a:hover span {
    background: #000;
}
#you-trust-us h2 {
    margin-bottom: 10px;
}
#you-trust-us .help-list a {
    display: inline-flex;
    margin-top: 0;
}
#you-trust-us .help-list p {
    margin-bottom: 22px;
}
#you-trust-us .help-list a:hover {color: #fff;}
.team-wrap {
    margin-top: 60px;
}
.team-wrap .img-wrap {
    overflow: hidden;
    border-radius: 50%;
    margin-bottom: 30px;
}
.team-wrap h4 {
    font-size: 22px;
    font-weight: 600;
    margin: 0 0 5px;
}
.team-wrap span {
    font-size: 18px;
    color: #677294;
}
#you-love-us h2 {
    margin-bottom: 100px;
    margin-top: 10px;
}
.ui-ux-works.hire-us-section {
    background-color: #fafcfd;
}
.hire-us-section.ui-ux-works .img-wrap { max-width: 100%;}
.testimonial-section.about-testimonial .bottom-icon {
    left: -50px;
    right: auto;
    bottom: -160px;
}

.testimonial-section.about-testimonial .top-icon {
    left: auto;
    right: 0;top: -140px;
}