.about-card-text p,
.about-text,
.accordions-text,
.banner-data p,
.contact-detail,
.contect-formdetail,
.expertise-text,
.industry-main,
.industry-title,
.listing-text,
.our-process .process-data,
.service-icon img,
.service-teaser-content,
.service-teaser-detail,
.service-text,
.slick-slider,
.solution-text,
.tab-title p {
    text-align: center
}

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box
}

body,
html {
    overflow-x: hidden;
    width: 100%
}

@font-face {
    font-family: Raleway;
    src: url('../font/Raleway.eot');
    src: url('../font/Raleway.eot?#iefix') format('embedded-opentype'), url('../font/Raleway.woff2') format('woff2'), url('../font/Raleway.woff') format('woff'), url('../font/Raleway.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'Playfair Display';
    src: url('../font/PlayfairDisplay-BlackItalic.eot');
    src: url('../font/PlayfairDisplay-BlackItalic.eot?#iefix') format('embedded-opentype'), url('../font/PlayfairDisplay-BlackItalic.woff2') format('woff2'), url('../font/PlayfairDisplay-BlackItalic.woff') format('woff'), url('../font/PlayfairDisplay-BlackItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: 'Playfair Display';
    src: url('../font/PlayfairDisplay-Bold.eot');
    src: url('../font/PlayfairDisplay-Bold.eot?#iefix') format('embedded-opentype'), url('../font/PlayfairDisplay-Bold.woff2') format('woff2'), url('../font/PlayfairDisplay-Bold.woff') format('woff'), url('../font/PlayfairDisplay-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'Playfair Display';
    src: url('../font/PlayfairDisplay-Black.eot');
    src: url('../font/PlayfairDisplay-Black.eot?#iefix') format('embedded-opentype'), url('../font/PlayfairDisplay-Black.woff2') format('woff2'), url('../font/PlayfairDisplay-Black.woff') format('woff'), url('../font/PlayfairDisplay-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'Playfair Display';
    src: url('../font/PlayfairDisplay-BoldItalic.eot');
    src: url('../font/PlayfairDisplay-BoldItalic.eot?#iefix') format('embedded-opentype'), url('../font/PlayfairDisplay-BoldItalic.woff2') format('woff2'), url('../font/PlayfairDisplay-BoldItalic.woff') format('woff'), url('../font/PlayfairDisplay-BoldItalic.ttf') format('truetype');
    font-weight: 700;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: 'Playfair Display';
    src: url('../font/PlayfairDisplay-Regular.eot');
    src: url('../font/PlayfairDisplay-Regular.eot?#iefix') format('embedded-opentype'), url('../font/PlayfairDisplay-Regular.woff2') format('woff2'), url('../font/PlayfairDisplay-Regular.woff') format('woff'), url('../font/PlayfairDisplay-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'Playfair Display';
    src: url('../font/PlayfairDisplay-Italic.eot');
    src: url('../font/PlayfairDisplay-Italic.eot?#iefix') format('embedded-opentype'), url('../font/PlayfairDisplay-Italic.woff2') format('woff2'), url('../font/PlayfairDisplay-Italic.woff') format('woff'), url('../font/PlayfairDisplay-Italic.ttf') format('truetype');
    font-weight: 400;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: Inter;
    src: url('../font/Inter-BoldItalic.eot');
    src: url('../font/Inter-BoldItalic.eot?#iefix') format('embedded-opentype'), url('../font/Inter-BoldItalic.woff2') format('woff2'), url('../font/Inter-BoldItalic.woff') format('woff'), url('../font/Inter-BoldItalic.ttf') format('truetype');
    font-weight: 700;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: Inter;
    src: url('../font/Inter-BlackItalic.eot');
    src: url('../font/Inter-BlackItalic.eot?#iefix') format('embedded-opentype'), url('../font/Inter-BlackItalic.woff2') format('woff2'), url('../font/Inter-BlackItalic.woff') format('woff'), url('../font/Inter-BlackItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: Inter;
    src: url('../font/Inter-Black.eot');
    src: url('../font/Inter-Black.eot?#iefix') format('embedded-opentype'), url('../font/Inter-Black.woff2') format('woff2'), url('../font/Inter-Black.woff') format('woff'), url('../font/Inter-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Inter;
    src: url('../font/Inter-Bold.eot');
    src: url('../font/Inter-Bold.eot?#iefix') format('embedded-opentype'), url('../font/Inter-Bold.woff2') format('woff2'), url('../font/Inter-Bold.woff') format('woff'), url('../font/Inter-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Inter;
    src: url('../font/Inter-ExtraBoldItalic.eot');
    src: url('../font/Inter-ExtraBoldItalic.eot?#iefix') format('embedded-opentype'), url('../font/Inter-ExtraBoldItalic.woff2') format('woff2'), url('../font/Inter-ExtraBoldItalic.woff') format('woff'), url('../font/Inter-ExtraBoldItalic.ttf') format('truetype');
    font-weight: 700;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: Inter;
    src: url('../font/Inter-ExtraBold.eot');
    src: url('../font/Inter-ExtraBold.eot?#iefix') format('embedded-opentype'), url('../font/Inter-ExtraBold.woff2') format('woff2'), url('../font/Inter-ExtraBold.woff') format('woff'), url('../font/Inter-ExtraBold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Inter;
    src: url('../font/Inter-LightItalicBETA.eot');
    src: url('../font/Inter-LightItalicBETA.eot?#iefix') format('embedded-opentype'), url('../font/Inter-LightItalicBETA.woff2') format('woff2'), url('../font/Inter-LightItalicBETA.woff') format('woff'), url('../font/Inter-LightItalicBETA.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: Inter;
    src: url('../font/Inter-ExtraLightBETA.eot');
    src: url('../font/Inter-ExtraLightBETA.eot?#iefix') format('embedded-opentype'), url('../font/Inter-ExtraLightBETA.woff2') format('woff2'), url('../font/Inter-ExtraLightBETA.woff') format('woff'), url('../font/Inter-ExtraLightBETA.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Inter;
    src: url('../font/Inter-ExtraLightItalicBETA.eot');
    src: url('../font/Inter-ExtraLightItalicBETA.eot?#iefix') format('embedded-opentype'), url('../font/Inter-ExtraLightItalicBETA.woff2') format('woff2'), url('../font/Inter-ExtraLightItalicBETA.woff') format('woff'), url('../font/Inter-ExtraLightItalicBETA.ttf') format('truetype');
    font-weight: 200;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: Inter;
    src: url('../font/Inter-Medium.eot');
    src: url('../font/Inter-Medium.eot?#iefix') format('embedded-opentype'), url('../font/Inter-Medium.woff2') format('woff2'), url('../font/Inter-Medium.woff') format('woff'), url('../font/Inter-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Inter;
    src: url('../font/Inter-Italic.eot');
    src: url('../font/Inter-Italic.eot?#iefix') format('embedded-opentype'), url('../font/Inter-Italic.woff2') format('woff2'), url('../font/Inter-Italic.woff') format('woff'), url('../font/Inter-Italic.ttf') format('truetype');
    font-weight: 400;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: Inter;
    src: url('../font/Inter-LightBETA.eot');
    src: url('../font/Inter-LightBETA.eot?#iefix') format('embedded-opentype'), url('../font/Inter-LightBETA.woff2') format('woff2'), url('../font/Inter-LightBETA.woff') format('woff'), url('../font/Inter-LightBETA.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Inter;
    src: url('../font/Inter-SemiBold.eot');
    src: url('../font/Inter-SemiBold.eot?#iefix') format('embedded-opentype'), url('../font/Inter-SemiBold.woff2') format('woff2'), url('../font/Inter-SemiBold.woff') format('woff'), url('../font/Inter-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Inter;
    src: url('../font/Inter-Regular.eot');
    src: url('../font/Inter-Regular.eot?#iefix') format('embedded-opentype'), url('../font/Inter-Regular.woff2') format('woff2'), url('../font/Inter-Regular.woff') format('woff'), url('../font/Inter-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Inter;
    src: url('../font/Inter-MediumItalic.eot');
    src: url('../font/Inter-MediumItalic.eot?#iefix') format('embedded-opentype'), url('../font/Inter-MediumItalic.woff2') format('woff2'), url('../font/Inter-MediumItalic.woff') format('woff'), url('../font/Inter-MediumItalic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: Inter;
    src: url('../font/Inter-ThinBETA.eot');
    src: url('../font/Inter-ThinBETA.eot?#iefix') format('embedded-opentype'), url('../font/Inter-ThinBETA.woff2') format('woff2'), url('../font/Inter-ThinBETA.woff') format('woff'), url('../font/Inter-ThinBETA.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Inter;
    src: url('../font/Inter-ThinItalicBETA.eot');
    src: url('../font/Inter-ThinItalicBETA.eot?#iefix') format('embedded-opentype'), url('../font/Inter-ThinItalicBETA.woff2') format('woff2'), url('../font/Inter-ThinItalicBETA.woff') format('woff'), url('../font/Inter-ThinItalicBETA.ttf') format('truetype');
    font-weight: 100;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: Inter;
    src: url('../font/Inter-SemiBoldItalic.eot');
    src: url('../font/Inter-SemiBoldItalic.eot?#iefix') format('embedded-opentype'), url('../font/Inter-SemiBoldItalic.woff2') format('woff2'), url('../font/Inter-SemiBoldItalic.woff') format('woff'), url('../font/Inter-SemiBoldItalic.ttf') format('truetype');
    font-weight: 600;
    font-style: italic;
    font-display: swap
}

body {
    font-family: Inter
}

a,
h1,
h2,
h3,
h4,
h5,
h6,
li,
ol,
p,
span,
ul {
    margin: 0;
    padding: 0;
    line-height: normal;
    font-family: Inter;
    text-decoration: none;
    list-style-type: none
}

.header-banner {
    padding: 20px 0;
    background: url(../img/page-img/itservice-banner\ \(1\).jpg) left/cover no-repeat;
    color: #fff;
    position: relative
}

.header-banner .container {
    position: relative;
    z-index: 1
}

.planning .process-icon::after,
.process-icon::after {
    top: 45%;
    position: absolute;
    right: -73px
}

.banner-title {
    max-width: 600px;
    width: 100%;
    margin: 120px 0 200px
}

.service-text,
.tab-title {
    margin-bottom: 40px
}

.banner-title h1 {
    font-weight: 700;
    font-size: 40px;
    color: #fff;
    margin-bottom: 20px;
    line-height: 60px
}

.banner-title p {
    font-weight: 500;
    font-size: 18px;
    line-height: 28px;
    color: #fff;
    margin-bottom: 35px
}

.btn-blue {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    width: 265px;
    height: 65px;
    background: #08161c;
    border: none;
    font-weight: 400;
    font-size: 20px;
    line-height: 36px;
    border-radius: 50px
}

.btn-blue:hover {
    background-color: #e1e1e1;
    color: #000e19;
    transition: .4s ease-in-out
}

.banner-img,
.current-img,
.reserch-img {
    width: 100%;
    height: 100%
}

.banner-img img {
    width: 100%;
    object-fit: cover
}

.banner-data {
    padding: 58px 0 100px
}

.banner-data p {
    font-weight: 400;
    font-size: 21px;
    line-height: 40px;
    color: #545454
}

.our-service {
    padding: 70px 0 50px
}

.service-text h3 {
    font-weight: 700;
    font-size: 30px;
    line-height: normal;
    color: #000e19;
    margin-bottom: 13px
}

.service-text p {
    color: #57647c;
    font-size: 16px
}

.service-card:hover {
    border-bottom: 3px solid #0081e5
}

.service-info h4 {
    color: #000e19;
    font-weight: 500;
    font-size: 20px;
    line-height: normal;
    margin-bottom: 10px
}

.service-data p,
.service-info p {
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #545454
}

.tab-data {
    padding: 70px 0;
    background: #f2f6f9
}

.tab-title p {
    font-weight: 700;
    font-size: 30px;
    line-height: normal;
    color: #000e19
}

.contect-icon ul,
.tabs-info ul {
    display: flex;
    align-items: center;
    justify-content: center
}

.tabs-info ul li {
    padding: 0 15px;
    border-bottom: 2px solid #d1d2d3 !important
}

.tabs-info ul li:first-child {
    padding-left: 0
}

.tabs-info ul li:last-child {
    padding-right: 0
}

.contect-form,
.nav-link {
    padding: 0
}

.tabs-info ul li a {
    color: #000;
    font-weight: 400;
    font-size: 20px;
    line-height: 36px
}

.nav-tabs .nav-link {
    border: 0 !important
}

div#nav-tabContent {
    padding: 40px 0 0
}

.nav-tabs .nav-link.active {
    border: none;
    border-bottom: 2px solid #0081e5;
    color: #0c4b8a;
    background-color: transparent
}

.planning .process-icon::after,
.planning .process-icon::before {
    content: '';
    width: 10px;
    border-radius: 50px;
    background: #44ddfd;
    height: 10px
}

.nav-tabs {
    border-bottom: none
}

h2.tab-list {
    font-weight: 300;
    font-size: 18px;
    line-height: 36px;
    color: #000e19
}

li.data-slide {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: #fff;
    margin-left: 15px;
    box-shadow: 1px 1px 21px -13px rgba(0, 0, 0, .5)
}

.frontend-img img {
    width: 78px;
    height: 52px;
    object-fit: contain;
    margin-bottom: 10px
}

.our-process {
    padding: 70px 0 50px;
    background: #f2f6f9
}

.about-banner,
.form-img {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center
}

.our-process .process-data {
    margin-bottom: 75px
}

.process-data h4 {
    font-weight: 700;
    font-size: 30px;
    line-height: normal;
    color: #000e19;
    margin-bottom: 10px
}

.process-data p {
    font-weight: 400;
    font-size: 16px;
    line-height: normal;
    color: #57647c
}

.process-info {
    max-width: 950px;
    margin: 0 auto
}

.process-info ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%
}

.process-info ul .design,
.process-info ul .devlopment,
.process-info ul .discover,
.process-info ul .planning {
    width: 279px;
    height: 210px;
    margin-bottom: 50px
}

.process-number {
    margin-right: 25px
}

.discover h3 {
    width: 60px;
    height: 60px;
    background: #144e5c;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    margin: 0 auto;
    color: #fff;
    font-weight: 600
}

.process-info span i {
    color: #0081e5;
    font-size: 35px
}

.process-detail {
    display: flex;
    flex-wrap: nowrap;
    padding: 25px 0
}

.process-icon::after {
    content: '';
    width: 10px;
    height: 10px;
    border-radius: 50px;
    background-color: #8d66ff
}

.process-text h5 {
    color: #000e19;
    font-weight: 600;
    font-size: 22px;
    line-height: 25.83px;
    margin-bottom: 10px
}

.design h3,
.devlopment h3,
.planning h3 {
    height: 60px;
    border-radius: 20px;
    margin: 0 auto;
    width: 60px;
    display: flex;
    position: relative
}

.process-text p {
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #545454
}

.planning h3 {
    background: #172a41;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-weight: 600
}

.planning .process-icon::before {
    top: 45%;
    left: -73px;
    position: absolute
}

.design .process-icon::after,
.design .process-icon::before {
    background: #ec98e3;
    width: 10px;
    border-radius: 50px;
    top: 45%;
    position: absolute;
    content: ''
}

.design h3 {
    background: #2c67f2;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-weight: 600
}

.design .process-icon::after {
    height: 10px;
    right: -73px
}

.design .process-icon::before {
    height: 10p x;
    left: -73px
}

.devlopment h3 {
    background: #62cff4;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-weight: 600
}

.devlopment .process-icon::after {
    display: none
}

.devlopment .process-icon::before {
    content: '';
    width: 10px;
    height: 10px;
    border-radius: 50px;
    background: #84e571;
    top: 45%;
    left: -73px;
    position: absolute
}

.about-area,
.about-us,
.accordions,
.featured-section,
.service-section,
.solution,
.technology {
    padding: 70px 0
}

.listing-text,
.solution-text {
    margin-bottom: 50px
}

.about-text p,
.solution-text p {
    color: #000e19;
    font-weight: 600;
    font-size: 35px;
    line-height: 41.09px
}

.solution-card ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

.solution-card ul li {
    width: calc(20% - 8px);
    height: 140px;
    background: #fcfcfd;
    box-shadow: 0 5px 24px #e0e0e0;
    margin-bottom: 16px;
    border-radius: 3px;
    display: flex;
    align-items: center;
    padding-left: 15px
}

.solution-card ul li:nth-child(2n+2) {
    border-top: 4px solid #62cff4
}

.solution-card ul li:nth-child(odd) {
    border-top: 4px solid #2c67f2
}

.solution-img {
    padding-right: 5px
}

.solution-img img {
    width: 60px;
    object-fit: cover
}

.solution-data h6 {
    font-weight: 500;
    font-size: 16px;
    line-height: 23px;
    color: #3c3c3c;
    max-width: 150px
}

.goal-section {
    overflow: hidden;
    padding-bottom: 20px
}

.about-text {
    margin-bottom: 60px
}

.about-text h5 {
    color: #0081e5;
    font-weight: 400;
    font-size: 18px;
    line-height: 21.13px;
    margin-bottom: 8px
}

.about-card {
    gap: 16px;
    border-radius: 32px;
    border-width: 2px;
    padding: 40px 10px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    box-shadow: 0 0 60px 5px #c9c8c8
}

.about-card-img img {
    width: 130px;
    height: 130px;
    border-radius: 100px;
    object-fit: cover;
    object-position: top
}

.about-card-title h5 {
    font-family: 'Playfair Display';
    font-weight: 700;
    font-size: 24px;
    line-height: 36px
}

.about-card-star {
    display: flex;
    justify-content: space-between
}

.about-card-star i {
    color: #0081e5;
    padding: 0 4px;
    font-size: 23px
}

.about-card-text p {
    color: #585858;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px
}

.accordion-item {
    border: none;
    margin-bottom: 16px;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 6px rgba(0, 0, 0, .1);
    transition: .3s
}

.accordion-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 12px rgba(0, 0, 0, .15)
}

.accordion-button {
    padding: 20px 25px;
    font-weight: 600;
    color: #333;
    background-color: #fff;
    transition: .3s
}

.accordion-button:not(.collapsed) {
    color: #fff;
    background-color: #0a4e73
}

.accordion-button:focus {
    box-shadow: none;
    border-color: rgba(0, 0, 0, .125)
}

.accordion-button::after {
    background-size: 20px;
    transition: .3s
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e")
}

.accordion-body {
    padding: 25px;
    background-color: #fff;
    font-weight: 400
}

.accordions-text,
.accordions-text h2 {
    font-size: 35px;
    font-weight: 600
}

.accordions-text {
    margin-bottom: 36px
}

.form-text h3,
.form-text p {
    font-weight: 500;
    color: #fcfcfd
}

input.form-control::placeholder {
    color: #010101 !important;
    font-weight: 600;
    opacity: .5
}

textarea.form-control::placeholder {
    color: #020202 !important;
    font-weight: 600;
    opacity: .5
}

.featured-section img,
.img-form {
    width: 100%;
    height: auto
}

.form-img {
    background-image: url(../img/form-background.jpg);
    padding: 60px 0;
    position: relative
}

.form-img .form-overly {
    position: absolute;
    background: #000000d4;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    opacity: .9;
    z-index: 1
}

.form-data {
    position: relative;
    z-index: 2
}

.form-text h3 {
    font-size: 18px;
    line-height: 21.13px;
    margin-bottom: 8px
}

.form-text h4 {
    font-weight: 600;
    font-size: 40px;
    line-height: 46.96px;
    color: #fcfcfd;
    margin-bottom: 40px;
    text-transform: uppercase;
    position: relative;
    letter-spacing: 2px
}

.form-text h4::after {
    content: '';
    border-bottom: 3px solid #fff;
    left: 0;
    width: 64px;
    position: absolute;
    bottom: -15px
}

.form-data .form-control:focus {
    border-color: #000;
    outline: 0;
    box-shadow: none;
    background-color: unset;
    color: #000
}

.form-text p {
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 15px;
    max-width: 320px
}

.form-text h5,
.form-text h5 span {
    margin-bottom: 8px;
    font-weight: 500;
    line-height: 20px;
    font-size: 14px
}

.form-text h5 {
    color: #fcfcfd
}

.form-text h5 span {
    color: #0081e5
}

.form-text h6 {
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: #fcfcfd
}

.form-user {
    padding: 27px 0
}

.form-control {
    display: block;
    width: 100%;
    font-weight: 400;
    line-height: 1.5;
    border: none;
    border-bottom: 2px solid #000;
    color: #000;
    background-color: transparent;
    appearance: none;
    margin-bottom: 25px;
    border-radius: 0;
    padding-left: 0;
    font-size: 14px
}

@media (min-width:992px) {
    .banner-title {
        margin: 80px 0 170px
    }

    .form-control {
        margin-bottom: 60px
    }
}

.footer-address .headline h2 {
    font-weight: 700;
    padding-bottom: 35px
}

.footer-light-bg .stay-connected {
    padding: 35px 32px
}

.footer-light-bg .stay-connected .sm-title {
    font-size: 14px;
    line-height: 20px;
    color: #021139;
    letter-spacing: .28px;
    display: block;
    padding-bottom: 18px
}

.footer-light-bg .stay-connected svg {
    fill: #296bbb
}

.footer-address {
    background-color: #081f58;
    color: #fff;
    padding-top: 30px;
    padding-bottom: 30px;
    margin-bottom: 25px
}

.footer-address h4,
.footer-menu h4 {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 20px
}

.footer-address a {
    font-weight: 500;
    color: #fff
}

.footer-address__contact {
    font-size: 14px;
    text-decoration: underline
}

.footer-menu ul li {
    padding-bottom: 12px
}

.about-banner {
    padding: 20px 0;
    background-image: url(../img/img_single.webp);
    height: 400px;
    position: relative
}

.about-overly,
img.about-section {
    position: absolute;
    right: 0;
    bottom: 0
}

.about-overly {
    top: 0;
    left: 0;
    background-color: #000000d8;
    opacity: .5
}

.about-title,
.blog-text,
.contact-title,
.industry-text,
.services-text {
    position: relative;
    justify-content: center;
    align-items: center;
    display: flex;
    width: 100%;
    height: calc(400px - 40px)
}

.about-title h4,
.blog-text h1,
.contact-title h4,
.service-title h4,
.services-text h1 {
    color: #fff;
    font-weight: 600;
    font-size: 35px;
    line-height: 53px;
    letter-spacing: 2px;
    margin-bottom: 10px
}

.about-data {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    padding: 0 30px
}

.about-data h4 {
    color: #000;
    font-size: 40px;
    font-weight: 700;
    line-height: 28px;
    text-transform: capitalize;
    margin-bottom: 30px
}

.about-data p,
.technology-text p {
    color: #545454;
    font-weight: 500;
    font-size: 18px;
    line-height: 28px;
    text-transform: capitalize
}

.about-img {
    position: relative;
    padding-bottom: 100px
}

.about-img img,
.contact-img img {
    height: auto;
    max-width: 100%;
    border: none;
    border-radius: 0;
    box-shadow: none
}

img.about-section {
    border-radius: 0 10px 0 0
}

.content-section {
    margin: 50px 0
}

.content-teaser {
    margin: 0 auto;
    width: 100%;
    padding: 0 20px
}

.content-teaser h1 {
    font-weight: 700;
    padding-bottom: 18px;
    font-size: 40px;
    text-transform: uppercase;
    background: -webkit-linear-gradient(#12a4ff, #00123e);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.content-teaser span {
    font-weight: 600
}

.compney-service {
    padding: 0 0 100px
}

.compney-main {
    padding: 20px 50px;
    width: 100%
}

.right-content .about-background {
    background-color: #091f2f
}

.right-content .about-background p {
    color: #fff
}

.about-background {
    background-color: #f2f6f9;
    box-shadow: rgba(100, 100, 111, .1)
}

.compney-main h4 {
    font-size: 26px;
    line-height: 43px;
    margin-bottom: 10px;
    color: #0081e5;
    font-weight: 700
}

.compney-main p {
    color: #57647c;
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    text-transform: capitalize
}

.compney-main h3 {
    font-weight: 600;
    font-size: 18px;
    line-height: 30px;
    text-transform: uppercase
}

.current-img img {
    width: 100%;
    height: 400px;
    object-fit: cover
}

.about-list {
    padding-bottom: 100px
}

.aboutmain-list ul {
    column-count: 2
}

.aboutmain-list ul li {
    display: flex;
    margin-bottom: 40px;
    align-items: center
}

.list-icon {
    width: 180px;
    height: 140px;
    background: #b2deff;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100%
}

.list-icon img {
    width: 71px;
    height: 73px;
    object-fit: cover
}

.list-text {
    width: 100%;
    padding-left: 25px
}

.industry,
.industry-automative {
    padding: 20px 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 400px;
    position: relative
}

.list-text h5 {
    color: #000e19;
    font-weight: 600;
    font-size: 30px;
    line-height: 60px
}

.list-text p {
    color: #545454;
    font-weight: 500;
    font-size: 16px;
    line-height: 26px
}

.industry {
    background-image: url(../img/premium_photo-1682144748274-add3d8ed04ea.jpg)
}

.industry-automative {
    background-image: url(../img/pexels-life-of-pix-2391.jpg)
}

.industry-overly {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #000;
    opacity: .7
}

.industry-text h1 {
    color: #fff;
    font-weight: 800;
    font-size: 42px;
    line-height: 55px;
    margin-bottom: 16px
}

.industry-title h3,
.industry-title h3 span {
    font-size: 35px;
    line-height: 84px;
    font-weight: 600
}

.industry-card {
    padding: 50px 0
}

.industry-title {
    margin-bottom: 40px
}

.industry-title h3 {
    color: #000
}

.industry-title h3 span {
    background-color: #072135;
    color: #fff
}

.industry-info {
    position: relative;
    width: 100%;
    overflow: hidden;
    margin-bottom: 24px
}

.industry-img {
    position: relative;
    cursor: pointer
}

.industry-img img {
    width: 100%;
    display: block;
    transition: opacity .5s ease-in-out;
    height: 200px;
    object-fit: cover
}

.industry-info:hover .industry-img img {
    opacity: .8
}

.industry-main {
    position: absolute;
    top: 100%;
    left: 0;
    height: 100%;
    background: #000e19;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    transition: .5s;
    padding: 0 20px;
    opacity: .8
}

.industry-info:hover .industry-main {
    top: 0
}

.industry-main h3 {
    font-size: 20px;
    margin-bottom: 10px;
    font-weight: 600
}

.industry-main p {
    font-size: 16px;
    font-weight: 500
}

.expertise-section {
    padding: 60px 0
}

.expertise-text {
    margin-bottom: 70px
}

.expertise-text h4 {
    color: #000e19;
    font-weight: 600;
    font-size: 32px;
    line-height: 32px
}

.expertise-text h4 span {
    color: #0081e5;
    font-weight: 600;
    font-size: 32px;
    line-height: 32px
}

.experince-card ul li {
    display: flex;
    margin-bottom: 50px;
    flex-wrap: wrap
}

.experince-icon,
.inovation-icon,
.scaleble-icon,
.secure-icon,
.solution-icon,
.svings-icon {
    justify-content: center
}

.experince-img,
.secure-img {
    width: 105px;
    height: 105px;
    border-radius: 50%;
    background: #8d66ff;
    display: flex;
    align-items: center;
    justify-content: center
}

.end-img img,
.experince-img img,
.inovation-img img,
.scaleble-img img,
.secure-img img,
.svings-img img {
    width: 80px
}

.end-text h5,
.experince-text h5,
.inovation-text h5,
.scaleble-text h5,
.secure-text h5,
.svings-text h5 {
    color: #000e19;
    font-weight: 600;
    font-size: 24px;
    line-height: 36px;
    padding: 10px 0
}

.end-text h5 span,
.experince-text h5 span,
.scaleble-text h5 span,
.secure-text h5 span,
.svings-text h5 span {
    color: #0081e5;
    font-weight: 600;
    font-size: 24px;
    line-height: 36px
}

.end-text p,
.experince-text p,
.inovation-text p,
.scaleble-text p,
.secure-text p,
.svings-text p {
    color: #545454;
    font-weight: 500;
    font-size: 16px;
    line-height: 28px;
    margin: auto;
    text-transform: capitalize
}

li.inovative {
    display: flex;
    justify-content: end;
    flex-wrap: wrap
}

.end-img,
.inovation-img {
    width: 105px;
    height: 105px;
    border-radius: 50%;
    display: flex;
    align-items: center
}

.inovation-img {
    background: #44ddfd;
    justify-content: center
}

.end-img {
    background: #ec98e3;
    justify-content: center
}

.scaleble-img,
.svings-img {
    width: 105px;
    height: 105px;
    border-radius: 50%;
    align-items: center;
    display: flex
}

.scaleble-img {
    background: #84e571;
    justify-content: center
}

.svings-img {
    background: #b2deff;
    justify-content: center
}

.service-banner,
.services-banner {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center
}

.technology-text {
    position: relative;
    transform: translateY(-50%);
    top: 50%
}

.technology-text h6 {
    color: #000e19;
    font-weight: 600;
    font-size: 35px;
    line-height: 50px;
    margin-bottom: 10px
}

.technology-text p span {
    color: #545454;
    font-weight: 600;
    font-size: 18px;
    line-height: 28px
}

.technology-img {
    width: 100%;
    height: 100%;
    transform: rotateY(180deg)
}

.technology-img img {
    width: 100%;
    height: 389px;
    object-fit: cover
}

.industrey-listing {
    padding: 30px 0 130px
}

.listing-text h5 {
    color: #000;
    font-weight: 600;
    font-size: 35px
}

.listing-text p {
    color: #545454;
    font-weight: 400;
    font-size: 22px;
    line-height: 50px
}

.slick-slider {
    display: flex;
    align-items: center
}

.slider-text {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 10px;
    position: relative
}

.slider-text img {
    width: 100%;
    height: 300px;
    object-fit: cover
}

.listing-overly {
    position: absolute;
    top: 0;
    content: '';
    bottom: 0;
    right: 0;
    left: 0;
    opacity: .6;
    background-color: #000
}

.slick-next,
.slick-prev {
    top: -46px;
    width: 38px;
    height: 38px;
    display: flex;
    background-color: #000
}

.slick-initialized .slick-slide {
    display: flex
}

.slider-text p {
    width: 100%;
    padding: 0 45px;
    color: #fff;
    font-size: 18px;
    font-weight: 500;
    line-height: 30px;
    opacity: 2;
    position: absolute
}

.slick-next:before,
.slick-prev:before {
    font-family: slick;
    font-size: 23px;
    line-height: 1;
    opacity: 1;
    color: #fff;
    font-weight: 900;
    padding: 0
}

.slick-prev {
    right: 75px;
    left: auto;
    align-items: center;
    justify-content: center
}

.slick-next:focus,
.slick-next:hover,
.slick-prev:focus,
.slick-prev:hover {
    color: #fff;
    outline: 0;
    background-color: #000;
    width: 38px;
    height: 38px
}

.slick-next {
    right: 31px;
    align-items: center;
    justify-content: center
}

.services-banner {
    padding: 20px 0;
    background-image: url(../img/software-company.jpg);
    height: 400px;
    position: relative
}

.blog-overly,
.contact-overly,
.service-overly,
.services-overly {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #000;
    opacity: .5
}

.content-teaser h2,
.custom-teaser h2,
.featured-section .headline h2,
.reserch-data .headline h2,
.service-section .headline h2,
.use-section .headline h2 {
    font-weight: 700;
    padding-bottom: 18px;
    font-size: 32px;
    text-transform: uppercase;
    background: -webkit-linear-gradient(#12a4ff, #00123e);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.featured-section .headline,
.reserch-data .headline,
.service-section .headline,
.use-section .headline {
    margin: 0 auto;
    width: 100%;
    padding: 0 20px;
    text-align: center
}

.service-teaser-detail {
    padding: 18px 12px
}

.service-teaser-content img,
.service-teaser-detail img {
    width: 90px;
    height: 90px
}

.service-teaser-detail h3 {
    font-size: 22px;
    padding: 10px 0;
    font-weight: 600
}

.service-teaser-content p,
.service-teaser-detail p {
    font-size: 15px
}

.service-teaser-content {
    padding: 18px 25px;
    box-shadow: 0 5px 27px 0 #cacaca;
    margin-bottom: 30px;
    min-height: calc(100% - 18px)
}

.service-teaser-content h3 {
    font-size: 22px;
    padding: 10px 0;
    font-weight: 500
}

.feature-teaser ul li {
    list-style-type: square;
    padding-bottom: 20px
}

.feature-teaser ul li h4 {
    font-size: 19px;
    font-weight: 600;
    padding-bottom: 10px
}

.feature-teaser ul li p {
    text-align: justify
}

.reserch-data {
    padding: 40px 0
}

.reserch-data .accordion-button {
    padding: 15px;
    font-size: 16px
}

.reserch-data .accordion-body {
    font-size: 12px
}

.reserch-text h4 {
    margin-bottom: 15px;
    font-size: 30px;
    font-weight: 700;
    color: #0081e5;
    font-family: Inter
}

.reserch-text p {
    font-size: 14px;
    margin-bottom: 15px;
    line-height: 24px;
    font-weight: 400;
    font-family: Inter
}

.reserch-img img {
    height: auto;
    max-width: 100%;
    object-fit: cover
}

.reserch-info {
    margin-top: 50px
}

#faq__accordian-main-wrapper {
    max-width: 1140px;
    margin: 0 auto;
    padding: 20px 0;
    font-family: Inter
}

.faq__accordion-content p {
    margin: 0
}

.faq__accordian-heading {
    background-color: #fff;
    padding: 10px 30px 10px 45px;
    display: block;
    margin-bottom: 15px;
    position: relative;
    font-weight: 500;
    box-shadow: 0 2px 1px rgba(0, 0, 0, .16), 0 0 0 rgba(0, 0, 0, .23);
    color: #000
}

.faq__accordian-heading::before {
    content: "\f067";
    color: #0081e5;
    font-family: fontawesome;
    position: absolute;
    left: 20px;
    top: 50%;
    -webkit-transition: .3s linear;
    -moz-transition: .3s linear;
    -ms-transition: .3s linear;
    -o-transition: .3s linear;
    transition: .3s linear;
    -webkit-transform: translateY(-50%) rotate(0);
    -moz-transform: translateY(-50%) rotate(0);
    -ms-transform: translateY(-50%) rotate(0);
    -o-transform: translateY(-50%) rotate(0);
    transform: translateY(-50%) rotate(0)
}

.faq__accordian-heading.active {
    background-color: #0081e5;
    color: #fff
}

.faq__accordian-heading.active::before {
    content: "\f068";
    -webkit-transition: .3s linear;
    -moz-transition: .3s linear;
    -ms-transition: .3s linear;
    -o-transition: .3s linear;
    transition: .3s linear;
    -webkit-transform: translateY(-50%) rotate(360deg);
    -moz-transform: translateY(-50%) rotate(360deg);
    -ms-transform: translateY(-50%) rotate(360deg);
    -o-transform: translateY(-50%) rotate(360deg);
    transform: translateY(-50%) rotate(360deg);
    color: #fff
}

.faq__accordion-content {
    display: none;
    padding: 10px 20px
}

.faq__accordion-wrapper {
    box-shadow: rgba(0, 0, 0, .24) 0 3px 8px;
    margin-bottom: 15px
}

.use-teaser .use-teaser__detail {
    border: 1px solid #000;
    border-left-color: #00123e;
    border-left-width: 5px;
    margin-bottom: 25px;
    margin-top: 20px;
    padding: 20px 25px;
    min-height: calc(100% - 20px)
}

.use-teaser .use-teaser__detail h3 {
    font-size: 20px;
    font-weight: 500;
    padding-bottom: 20px
}

.use-teaser .use-teaser__detail p {
    padding-bottom: 0;
    margin-bottom: 0
}

@media (min-width:768px) {
    .header-banner {
        background-position: center
    }

    .content-teaser,
    .featured-section .headline,
    .reserch-data .headline,
    .service-section .headline,
    .use-section .headline {
        margin: 0 auto;
        max-width: 800px;
        padding: 0
    }
}

.form-detail #exampleFormControlTextarea1,
.form-detail .form-control {
    font-size: 16px;
    padding: 15px;
    box-shadow: 0 5px 28.5px 1.5px rgba(149, 152, 200, .2)
}

.service-banner {
    padding: 20px 0;
    background-image: url(../img/contact-banner\ \(1\).jpg);
    height: 285px;
    position: relative
}

.service-title {
    position: relative;
    justify-content: center;
    align-items: center;
    display: flex;
    width: 100%;
    height: calc(300px - 52px)
}

.service-main {
    background: #f2f6f9;
    padding: 100px 0 70px
}

.blog-banner,
.contact-banner {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative
}

.service-card {
    background-color: #fff;
    border-radius: 0;
    min-height: 274px;
    position: relative;
    margin-bottom: 30px;
    padding: 30px;
    box-shadow: 4px 2px 20px 5px #ccc
}

@media (max-width:573px) {
    .service-card {
        margin: 25px !important
    }
}

.service-icon img {
    width: 40px;
    margin: auto;
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%)
}

.blog-img,
.blog-info {
    width: 100%
}

.service-card .service-icon {
    position: relative;
    width: 70px;
    height: 70px;
    background-color: #d0eaff;
    border-radius: 3px;
    top: 0;
    z-index: 2;
    left: 0;
    margin-bottom: 20px
}

.service-data a {
    color: #000e19;
    font-weight: 700;
    font-size: 20px;
    line-height: normal;
    margin-bottom: 10px
}

.blog-title h3,
.blog-title p {
    margin-bottom: 15px;
    color: #000e19
}

.blog-banner {
    padding: 20px 0;
    background-image: url(../img/page-title-bg2-1-1-1.jpg);
    height: 400px
}

.blog-card,
.contact-main {
    padding: 100px 0
}

.blog-info {
    height: 100%;
    margin-bottom: 24px
}

.blog-img img {
    height: 300px;
    width: 100%;
    object-fit: cover
}

.blog-title {
    background-color: #f7f7f7;
    padding: 40px 30px
}

.blog-title h3 {
    font-size: 21px;
    font-weight: 700
}

.blog-title p {
    font-size: 14px
}

.cool-link {
    display: inline-block;
    color: #0081e5;
    text-decoration: none;
    font-size: 20px
}

.cool-link i {
    font-size: 18px;
    margin-left: 10px
}

.contact-detail,
.contact-detail p {
    margin-left: auto;
    margin-right: auto
}

.cool-link::after {
    content: '';
    display: block;
    width: 0;
    height: 2px;
    background: #0081e5;
    transition: width .3s
}

.cool-link:hover::after {
    width: 100%;
    transition: width .3s;
    color: #0081e5
}

.contact-banner {
    padding: 20px 0;
    background-image: url(../img/contact-banner.jpg);
    height: 400px
}

.contact-detail {
    max-width: 670px;
    margin-bottom: 60px
}

.contact-detail h4 {
    text-transform: uppercase;
    margin-bottom: 5px;
    font-weight: 600;
    font-size: 18px;
    color: #0081e5
}

.contact-detail h5 {
    margin-bottom: 10px;
    font-size: 40px;
    font-weight: 700;
    color: #333
}

.contact-detail p {
    max-width: 520px;
    margin-bottom: 10px;
    color: #545454;
    font-size: 15px;
    font-weight: 500;
    line-height: 24px
}

.contact-img {
    height: 100%;
    width: 100%
}

.form-detail {
    padding-left: 30px
}

.form-detail .form-control {
    display: block;
    width: 100%;
    font-weight: 400;
    line-height: 1.5;
    border: none;
    height: 50px;
    color: #000;
    background-color: #fff;
    appearance: none;
    margin-bottom: 20px;
    border-radius: 0
}

.form-detail #exampleFormControlTextarea1 {
    resize: none;
    margin: 0 0 30px;
    font-weight: 500;
    border-radius: 0;
    height: 120px
}

.form-control:focus {
    box-shadow: 0 5px 28.5px 1.5px rgba(149, 152, 200, .2)
}

textarea#exampleFormControlTextarea1 {
    resize: none;
    margin: 20px 0 30px;
    font-weight: 500;
    border-radius: 0;
    padding-left: 0;
    font-size: 14px
}

textarea#exampleFormControlTextarea1::placeholder {
    color: #000
}

textarea.form-control {
    height: 0
}

.form-data button {
    width: 196px;
    border: 1px solid #000;
    height: 47px;
    background-color: transparent;
    font-size: 14px;
    color: #000;
    font-weight: 500
}

.form-check {
    text-align: left;
    font-size: 13px;
    min-height: 0;
    margin-bottom: 20px
}

.form-check-input {
    width: 13px
}

.form-check span {
    color: #0081e5;
    font-size: 13px;
    min-height: 0
}

.form-check-input:focus {
    border-color: unset;
    outline: 0;
    box-shadow: 0 5px 28.5px 1.5px rgba(149, 152, 200, .2)
}

.form-detail button {
    height: 50px;
    width: 170px;
    border-radius: 50px;
    border: none;
    background-color: #007bff;
    color: #fff;
    font-size: 16px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 10px auto 0;
    letter-spacing: 1px;
    font-weight: 600
}

.form-detail button:hover {
    color: #0081e5;
    background-color: #fff;
    transition: 1s;
    border: 1px solid #0081e5
}

.contect-info {
    text-align: center;
    margin-top: 60px
}

.contect-info p {
    margin-bottom: 15px;
    font-size: 23px;
    font-weight: 700;
    color: #333
}

.contect-info h5 a {
    font-size: 40px;
    font-weight: 700;
    color: #0081e5;
    font-family: Inter;
    margin-bottom: 10px
}

.contect-info h5 a:hover {
    transition: 2s;
    color: #000
}

.contect-info span {
    font-size: 18px;
    color: #57647c;
    font-weight: 500
}

.contect-info h4 a {
    font-size: 40px;
    font-weight: 700;
    color: #000;
    margin-top: 10px;
    font-family: Inter
}

.contect-info h4 a:hover {
    transition: 2s;
    color: #0081e5
}

.contect-icon {
    margin-top: 20px
}

.contect-icon ul li {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 15px;
    height: 30px;
    width: 30px;
    border-radius: 50px;
    border: 1px solid #000
}

.contect-icon ul li a i {
    color: #0081e5;
    font-size: 14px
}