/*
 * Author: Jasper Baas
 * Version: 1.0
 * Copyright 2025 Software Select

 * Note: 10px = 1 rem | Example: 5px = 5 / 10 = 0.5rem

===========================================
    
    All include section: 

    01. Google fonts
    02. Basic css
    03. Preloader css
    04. hamberger css
	05. header section css
	06. home section css
	07. why choose section css
	08. company slider section css
	09. image section css
	10. service section css
	11. project section css
	12. testimonial section css
	13. custom section css
	14. mobile app counter section css
	15. team section css
	16. blog section css
	17. project contact section css
	18. newsletter section css
	19. footer section css
	20. stack view card section css
	21.solution section css
	22.comprehensive service section css
	23.custom service section css
	24.why choose service section css
	25. contact section css
	26. contact help section css
	27. location section css
	28. case studies section css
	29. why us section css
	30. How we do section css
	31. managed service section css
	32. benefit managed service section css
	33. managed it service section css
	34. client say section css
	35. it consulting section css
	36. it consulting counter section css
	37. chalange section css
	38. result section css
	39. back to top css

===========================================


*/

/*======================
   01. Google fonts
========================*/
@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:ital,wght@0,100..900;1,100..900&display=swap');

:root {
	--color01: #f5f5f5;
	--color02: #dee0ff;
	--color03: #ffffff;
	--color04: #010ed0;
	--color05: #242627;
	--color06: #0a0d31;
	--color07: #3f444b;

	--font01: 1.6rem;
	--font02: 1.4rem;
	--font03: 2rem;
	--font04: 1.2rem;
	--font05: 3rem;
	--font06: 4.8rem;
	--font07: 1rem;
	--font08: 2.4rem;
	--font09: 6rem;



	--cards-count: 3;
    --card-height: 100vh;
}

/*======================
   02. Basic css
========================*/
html,
body,
div,
span,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
strong,
i,
ol,
ul,
li,
form,
label,
footer,
header,
menu,
nav,
section {
	margin: 0;
	padding: 0;
}

body {
	line-height: 2.4rem;
	font-size: var(--font01);
	font-weight: 400;
	background: var(--color03);
	color: var(--color05);
	font-family: "Inter Tight", serif;
	overflow-x: hidden;
}

ol,
ul {
	list-style: none;
}

a:hover {
	text-decoration: none;
}

button:focus, input:focus, textarea:focus, select:focus {
	outline: 0;
}

html {
    font-size: 62.5%; /*1 rem = 10px*/
}

.custom_btn {
	background: var(--color02);
	color: var(--color04);
	font-size: var(--font02);
	font-weight: 600;
	padding: 0 2.4rem;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	-webkit-transition: 0.4s all ease-in-out;
	-o-transition: 0.4s all ease-in-out;
	transition: 0.4s all ease-in-out;
	height: 4.5rem;
	border-radius: 0.4rem;
}

.custom_btn:hover {
	background: var(--color04);
	color: var(--color03);
}

.custom_btn02 {
    font-size: var(--font04);
    font-weight: 600;
    line-height: 1.4rem;
    color: var(--color04);
    position: relative;
    -webkit-transition: 0.4s all ease-in-out;
    -o-transition: 0.4s all ease-in-out;
    transition: 0.4s all ease-in-out;
    padding-bottom: 0.6rem;
    overflow: hidden;
    display: inline-block;
}

.custom_btn02:hover {
	color: var(--color05);
}

.custom_btn02::before {
	background: var(--color02);
}

.custom_btn02::before,
.custom_btn02::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 0.3rem;
	-webkit-transition: 0.5s all ease-in-out;
	-o-transition: 0.5s all ease-in-out;
	transition: 0.5s all ease-in-out;
}

.custom_btn02::after {
	left: -40%;
}

.custom_btn02.add_btn::after {
	background: var(--color05);
	left: 0 !important;
}

.mt_10 {
	margin-top: 1rem !important;
}

.mt_15 {
	margin-top: 1.5rem !important;
}

.mt_20 {
	margin-top: 2rem !important;
}

.mt_30 {
	margin-top: 3rem !important;
}

.mt_40 {
	margin-top: 4rem !important;
}

.mt_50 {
	margin-top: 5rem !important;
}

.mt_55 {
	margin-top: 5.5rem !important;
}

.section_padd {
	padding: 10rem 0;
}

.head_text {
	font-size: var(--font06);
	font-weight: 700;
}

.head_text02 {
	font-size: var(--font03);
	font-weight: 600;
}

.sub_head {
	background: var(--color01);
	height: 3rem;
	padding: 0 0.9rem;
	border-radius: 0.4rem;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	font-size: var(--font07);
	font-weight: 600;
	color: #5f6567;
	text-transform: uppercase;
}

.head_text03 {
	font-size: var(--font09);
	font-weight: 600;
}

.para01 {
    font-size: var(--font03);
    line-height: 3rem;
}

.color01 {
	color: rgba(0, 0, 0, 0.60);
}

/*======================
   03. Preloader css
========================*/
#preloader {
	position: fixed;
	background: #fff;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 99999;
	height: 100vh;
	width: 100vw;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}

.loader3 {
	width: 5rem;
	height: 5rem;
	display: inline-block;
	padding: 0;
	text-align: left;
}

.loader3 span {
	position: absolute;
	display: inline-block;
	width: 5rem;
	height: 5rem;
	border-radius: 100%;
	background: #f33737;
	-webkit-animation: loader3 1.5s linear infinite;
	        animation: loader3 1.5s linear infinite;
}

.loader3 span:last-child {
	-webkit-animation-delay: -0.9s;
	        animation-delay: -0.9s;
}

@keyframes loader3 {
  	0% {
    	-webkit-transform: scale(0, 0);
    	        transform: scale(0, 0);
    	opacity: 0.8;
  	}
  	100% {
    	-webkit-transform: scale(1, 1);
    	        transform: scale(1, 1);
    	opacity: 0;
  	}
}

@-webkit-keyframes loader3 {
  	0% {
    	-webkit-transform: scale(0, 0);
    	opacity: 0.8;
  	}
  	100% {
    	-webkit-transform: scale(1, 1);
    	opacity: 0;
  	}
}

/*======================
   04. hamberger css
========================*/
.hamburger_menu {
    cursor: pointer;
    position: fixed;
    right: 2rem;
    display: none;
    z-index: 999;
    top: 2rem;
}

.hamburger_menu span {
	background: #000000;
	width: 3rem;
	height: 0.3rem;
	display: block;
	margin: 0.5rem 0;
	-webkit-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.hamburger_menu:hover .line_top {
	-webkit-transform: translateY(-100%);
	    -ms-transform: translateY(-100%);
	        transform: translateY(-100%);
}

.hamburger_menu:hover .line_bottom {
	-webkit-transform: translateY(100%);
	    -ms-transform: translateY(100%);
	        transform: translateY(100%);
}

.hamburger_menu .line_top.current {
	-webkit-transform: translateY(200%) rotate(135deg);
	    -ms-transform: translateY(200%) rotate(135deg);
	        transform: translateY(200%) rotate(135deg);
}

.hamburger_menu .line_center.current {
	opacity: 0;
}

.hamburger_menu .line_bottom.current {
	-webkit-transform: translateY(-325%) rotate(-135deg);
	    -ms-transform: translateY(-325%) rotate(-135deg);
	        transform: translateY(-325%) rotate(-135deg);
}

/*======================
   05. header section css
========================*/
header {
    position: fixed;
    height: 7rem;
    z-index: 1000;
    width: 100%;
    -webkit-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
    top: 0;
    left: 0;
    right: 0;
}

header.sticky {
    background: var(--color04);
}

header .logo img {
	width: 15.2rem;
}

header .logo .logo02 {
	display: none;
}

header nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    padding-left: 10rem;
}

header nav .menu-arrow {
    font-size: 1.3rem;
    margin-left: 0.5rem;
    -webkit-transform: translateY(-0.3rem);
        -ms-transform: translateY(-0.3rem);
            transform: translateY(-0.3rem);
}

header nav li {
    display: inline-block;
    margin: 0 1.5rem;
}

header nav li .nav-link {
    text-transform: capitalize;
    color: var(--color01);
    padding: 2.4rem 0.5rem;
    font-weight: 500;
    -webkit-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
}

header nav li .nav-link:hover {
    color: var(--color02);
}

header.hover-header nav li:hover > .nav-link {
    color: var(--color02);
}

header nav li:hover .mega-menu {
    display: block;
	-webkit-transform: translate3d(0rem, 0rem, 0rem) !important;
	        transform: translate3d(0rem, 0rem, 0rem) !important;
}

header nav .dropdown-menu.show {
	-webkit-transform: translate3d(0rem, 0rem, 0rem) !important;
	        transform: translate3d(0rem, 0rem, 0rem) !important;
}

header nav li:last-child a{
    padding-right: 0;
}

header nav>li>a.active,
header nav>li>a:hover {
    color: var(--color02);
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

header nav .mega_menu {
    position: fixed !important;
    top: 7rem !important;
    left: 0;
    width: 100%;
    border: transparent;
    border-radius: 0;
    margin: 0;
    min-width: 100%;
    padding: 5rem 0;
    display: none;
    -webkit-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
    background-image: -o-linear-gradient(left, var(--color02) 66%, var(--color01) 66%);
    background-image: -webkit-gradient(linear, left top, right top, color-stop(66%, var(--color02)), color-stop(66%, var(--color01)));
    background-image: linear-gradient(90deg, var(--color02) 66%, var(--color01) 66%);
}

header nav .mega-menu .container {
    max-width: 128rem;
}

header nav .custom_btn .para02 {
	display: none;
}

header nav .custom_btn:hover {
	background: var(--color03) !important;
	color: var(--color05) !important;
}

header nav .mega_menu .mega_menu_item h3 {
	color: var(--color06);
	font-size: var(--font03);
	font-weight: 600;
	padding-bottom: 1.5rem;
}

header nav .custom_btn {
	background: var(--color04) !important;
	color: var(--color03) !important;
}

header nav .custom_btn:hover {
	background: var(--color05) !important;
	color: var(--color03) !important;
}

header nav .mega_menu .mega_menu_item ul li {
    margin: 0 !important;
    display: block !important;
}

header nav .mega_menu .mega_menu_item .menu_link {
	color: var(--color05);
	font-size: var(--font02);
	font-weight: 500;
	display: block;
	-webkit-transition: 0.4s all ease-in-out;
	-o-transition: 0.4s all ease-in-out;
	transition: 0.4s all ease-in-out;
}

header nav .mega_menu .mega_menu_item .menu_link:hover {
	color: var(--color04);
}

header nav .mega_menu .mega_menu_item .mega_menu_link01 li .menu_link {
	margin: 0.8rem 0;
}

header nav .mega_menu .mega_menu_item .mega_menu_link02 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
}

header nav .mega_menu .mega_menu_item .mega_menu_link02 .mega_menu_box {
	width: 19.8rem;
	height: 11.1rem;
	text-align: left;
	padding: 2rem;
	background: var(--color03);
	border-radius: 0.6rem;
	border: 0.1rem solid rgba(0, 0, 0, 0.15);
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: end;
	    -ms-flex-align: end;
	        align-items: flex-end;
	-webkit-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
	margin: 1.5rem 1.5rem 0 0;
	-webkit-transition: 0.4s all ease-in-out;
	-o-transition: 0.4s all ease-in-out;
	transition: 0.4s all ease-in-out;
}

header nav .mega_menu .mega_menu_item .mega_menu_link02 .mega_menu_box:hover {
	border: 0.1rem solid var(--color04);
}

header nav .mega_menu .mega_menu_item .mega_menu_link02 .mega_menu_box span {
	-webkit-transition: 0.4s all ease-in-out;
	-o-transition: 0.4s all ease-in-out;
	transition: 0.4s all ease-in-out;
}

header nav .mega_menu .mega_menu_item .mega_menu_link02 .mega_menu_box:hover span {
	color: var(--color04);
}

header nav .mega_menu .mega_menu_item .mega_icon {
    position: absolute;
    width: 11.5rem;
    height: 12.2rem;
    background: var(--color03);
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    border-radius: 50%;
    top: -13%;
    left: -49%;
}

header nav .mega_menu .mega_menu_item .mega_menu_link03 a {
	padding: 1.5rem 0;
	border-bottom: 0.1rem solid rgba(0, 0, 0, 0.15);
	max-width: 23.8rem;
}

.offcavas_menu_wrap {
	display: none !important;
}

/*======================
   06. home section css
========================*/
.home_wrapper {
    width: 100%;
    height: 100vh;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    padding: 7rem 0 10rem 0;
}

.home_wrapper .home_img {
	position: absolute;
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

.home_wrapper .home_content {
	max-width: 73.4rem;
}

.home_wrapper .home_content h1 {
	font-size: 8rem;
	font-weight: 600;
	color: var(--color01);
	text-transform: capitalize;
}

.home_wrapper .home_content p {
	color: var(--color01);
	font-size: var(--font05);
	font-weight: 400;
	line-height: 4.5rem;
}

/*===========================
   07. why choose section css
=============================*/
.why_choose_wrapper .container {
	max-width: 79.5rem !important;
}

/*==============================
   08. company slider section css
================================*/
.company_slider_wrapper .company_slider .owl-stage {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
}

.company_slider_wrapper .company_slider .owl-stage img {
    width: auto !important;
    height: 4rem;
}

/*=====================
   09. image section css
=======================*/
.image_section_wrapper .big_image {
	border-radius: 4rem;
}

.image_section_wrapper .image_item {
    display: inline-block;
    text-align: center;
    position: absolute;
    bottom: -19%;
    right: 5%;
}

.image_section_wrapper .image_item img {
	width: 13.6rem;
}

.image_section_wrapper .image_item p {
	font-size: var(--font04);
	margin-top: 1rem;
}

/*=====================
   10. service section css
=======================*/
.service_wrapper .head_text {
	max-width: 64rem;
	padding-bottom: 3rem;
}

.service_wrapper .service_item {
	max-width: 88%;
}

.service_wrapper .service_item .service_icon {
	width: 7.5rem;
}

.service_wrapper .service_item h3 a {
	color: var(--color05);
	-webkit-transition: 0.4s all ease-in-out;
	-o-transition: 0.4s all ease-in-out;
	transition: 0.4s all ease-in-out;
}

.service_wrapper .service_item h3 a:hover {
	color: var(--color04);
}

.service_wrapper .service_item p {
	color: var(--color07);
	margin-top: 1rem;
}

.service_wrapper .custom_btn02 {
	margin-top: 6rem;
}

/*=====================
   11. project section css
=======================*/
.project_wrapper .project_head_wrap {
    max-width: 67rem;
    margin: 0 auto;
    padding-bottom: 4rem;
}

.project_wrapper .project_item01 {
	background: var(--color02);
}

.project_wrapper .project_item01 .project_sub_itme01 img {
    width: 16.4rem;
}

.project_wrapper .project_item01 .project_sub_itme02 img {
    width: 36rem;
}

.project_wrapper .project_item {
	padding: 3rem;
	border-radius: 4rem;
	position: relative;
	height: 45rem;
}

.project_wrapper .project_item .project_sub_itme02 {
	margin-left: 3rem;
}

.project_wrapper .project_item span {
	font-weight: 600;
	text-transform: capitalize;
	display: inline-block;
	color: #595A66;
}

.project_wrapper .project_item p {
	font-weight: 600;
	font-size: var(--font03);
}

.project_wrapper .project_item a {
    position: absolute;
    bottom: 0;
    left: 0;
    color: var(--color05);
    -webkit-transition: .4s all ease-in-out;
    -o-transition: .4s all ease-in-out;
    transition: .4s all ease-in-out;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    padding: 3rem;
}

.project_wrapper .project_item a span {
	-webkit-transition: .4s all ease-in-out;
    -o-transition: .4s all ease-in-out;
    transition: .4s all ease-in-out;
    font-weight: 400 !important;
}

.project_wrapper .project_item a:hover i,
.project_wrapper .project_item a:hover span {
	color: var(--color04) !important;
}

.project_wrapper .project_item a i {
    -webkit-transform: rotate(225deg);
        -ms-transform: rotate(225deg);
            transform: rotate(225deg);
    font-size: 3.5rem;
    -webkit-transition: .4s all ease-in-out;
    -o-transition: .4s all ease-in-out;
    transition: .4s all ease-in-out;
}

.project_wrapper .project_item02 {
	background: #F8F0E6;
}

.project_wrapper .project_item02 .project_sub_itme01 img {
	width: 13.2rem;
}

.project_wrapper .project_item02 .project_sub_itme02 img {
    width: 47rem;
}

.project_wrapper .project_item03 {
	background: var(--color05);
}

.project_wrapper .project_item03 .project_sub_itme01 img {
	width: 12.9rem;
}

.project_wrapper .project_item03 span,
.project_wrapper .project_item03 .project_sub_itme01 p,
.project_wrapper .project_item03 a {
	color: var(--color03) !important;
}

.project_wrapper .project_item03 a:hover {
	color: var(--color02) !important;
}

.project_wrapper .project_item03 .project_sub_itme02 img {
    width: 49rem;
    margin: 2rem 16rem 0 0;
}

/*===========================
   12. testimonial section css
=============================*/
.testimonial_wrapper .container {
	max-width: 75rem !important;
}

.testimonial_wrapper .testimonial_item h3 {
	font-size: var(--font05);
	color: var(--color06);
	font-weight: 400;
}

.testimonial_wrapper .testimonial_item .testimonial_img {
	width: 5.4rem !important;
	height: 5.4rem;
	border-radius: 50%;
	margin-right: 2rem;
	-o-object-fit: cover;
	   object-fit: cover;
}

.testimonial_wrapper .testimonial_item h4 {
	font-size: var(--font01);
	font-weight: 600;
}

.testimonial_wrapper .testimonial_item p {
	font-size: var(--font02);
	color: rgba(0, 0, 0, 0.60);
}

.testimonial_wrapper .testimonial_item .custom_btn02 {
	margin-top: 7rem;
}

.testimonial_wrapper .testimonial_slider .owl-nav {
    position: absolute;
    bottom: 0;
    left: -1rem;
}

.testimonial_wrapper .testimonial_slider .owl-prev,
.testimonial_wrapper .testimonial_slider .owl-next {
    background: var(--color01);
    width: 4.5rem;
    height: 4.5rem;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    border-radius: 50%;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    margin: 0 1rem;
    -webkit-transition: 0.4s all ease-in-out;
    -o-transition: 0.4s all ease-in-out;
    transition: 0.4s all ease-in-out;
}

.testimonial_wrapper .testimonial_slider .owl-prev:hover,
.testimonial_wrapper .testimonial_slider .owl-next:hover {
	background: var(--color04);
	color: var(--color03);
}

/*======================
   13. custom section css
========================*/
.custom_wrapper .custom_item {
	background: var(--color05);
	padding: 5rem;
	border-radius: 4rem;
	height: 56.2rem;
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.custom_wrapper .custom_item .custom_logo {
	margin-right: 4rem;
}

.custom_wrapper .custom_item .custom_logo img {
	width: 11.6rem;
}

.custom_wrapper .custom_item h2 {
	color: var(--color03) !important;
}

.custom_wrapper .custom_item p {
	color: var(--color02);
	font-size: var(--font04);
	margin-top: 2rem;
}

.custom_wrapper .custom_item .custom_btn,
.custom_wrapper .custom_item .custom_btn02 {
	position: absolute;
	bottom: 5rem;
	left: 5rem;
}

.custom_wrapper .custom_item02 {
	background: var(--color02);
}

.custom_wrapper .custom_item02 h2 {
	color: var(--color06) !important;
}

.custom_wrapper .custom_item .tag_item {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 5rem;
}

.custom_wrapper .custom_item .tag_item a {
	height: 4.3rem;
	padding: 0 2.6rem;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	background: var(--color03);
	border-radius: 2.1rem;
	color: var(--color05);
	margin: 1rem 1rem 0 0;
	-webkit-transition: 0.4s all ease-in-out;
	-o-transition: 0.4s all ease-in-out;
	transition: 0.4s all ease-in-out;
}

.custom_wrapper .custom_item .tag_item a:hover {
	background: var(--color01);
}

.custom_wrapper .custom_item03 {
    background: var(--color01);
    margin-top: 25rem;
}

.custom_wrapper .custom_item03 h2 {
	color: var(--color06) !important;
}

.custom_wrapper .custom_item03 .custom_shape {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 29rem;
	z-index: -1;
}

.custom_wrapper .custom_shape02 {
	position: absolute;
	right: 0;
	bottom: 5rem;
	width: 27.5rem;
	border-radius: 6.3rem 0 0 6.3rem;
}

/*===================================
   14. mobile app counter section css
=====================================*/
.mobile_app_counter_wrapper .mobile_app_counter_head {
	padding-bottom: 5rem;
	border-bottom: 0.1rem solid rgba(0, 0, 0, 0.15);
}

.mobile_app_counter_wrapper .mobile_app_counter_head .head_text {
	max-width: 57.6rem;
}

.counter_item {
	margin-top: 5rem;
}

.counter_item01 h3::before {
	display: none;
}

.counter_item h3 {
	font-size: var(--font03);
	color: var(--color06);
	position: relative;
}

.counter_item h3::before {
	content: "";
	position: absolute;
	top: 0.4rem;
	left: -2rem;
	width: 0.3rem;
	height: 2.7rem;
	background: rgba(0, 0, 0, 0.15);
}

.counter_item h3 span {
	font-size: var(--font05);
	font-weight: 600;
}

.mobile_app_counter_wrapper .counter_wrap .custom_btn {
	margin-top: 5rem;
	background: var(--color04);
	color: var(--color02);
}

.mobile_app_counter_wrapper .counter_wrap .custom_btn:hover {
	background: var(--color05) !important;
}

/*=====================
   15. team section css
=======================*/
.team_wrapper .team_head_wrap {
	max-width: 49.6rem;
}

.hiring_btn {
	height: 5.4rem;
	background: var(--color02);
	font-weight: 600;
	border-radius: 3rem;
	color: var(--color04);
	padding: 0 2.4rem;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	position: relative;
	-webkit-transition: 0.3s all ease-in-out;
	-o-transition: 0.3s all ease-in-out;
	transition: 0.3s all ease-in-out;
}

.hiring_btn::before {
    content: "";
    position: absolute;
    bottom: -1.9rem;
    left: 3rem;
    width: 2rem;
    height: 2rem;
    -webkit-clip-path: polygon(50% 47%, 0% 100%, 100% 100%);
            clip-path: polygon(50% 47%, 0% 100%, 100% 100%);
    background: var(--color02);
    -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
            transform: rotate(180deg);
    -webkit-transition: 0.3s all ease-in-out;
    -o-transition: 0.3s all ease-in-out;
    transition: 0.3s all ease-in-out;
}

.hiring_btn:hover::before {
	background: var(--color05);
}

.hiring_btn:hover {
	background: var(--color05);
	color: var(--color02);
}

.hiring_btn01 {
	display: none !important;
}

.team_wrapper .team_item {
	width: 29.8rem;
	margin-top: 5rem;
}

.team_wrapper .team_item figure {
	width: 100%;
	height: 100%;
	overflow: hidden;
	border-radius: 4rem;
}

.team_wrapper .team_item:hover figure img {
	-webkit-transform: scale(1.10);
	    -ms-transform: scale(1.10);
	        transform: scale(1.10);
}

.team_wrapper .team_item figure img {
	border-radius: 4rem;	
	-webkit-transition: 0.4s all ease-in-out;	
	-o-transition: 0.4s all ease-in-out;	
	transition: 0.4s all ease-in-out;
}

.team_wrapper .team_item h3 {
	font-size: var(--font03);	
	font-weight: 600;
	margin-top: 1rem;
}

.team_wrapper .team_item h3 a {
	color: var(--color05);
	-webkit-transition: 0.4s all ease-in-out;
	-o-transition: 0.4s all ease-in-out;
	transition: 0.4s all ease-in-out;
}

.team_wrapper .team_item h3 a:hover {
	color: var(--color04);
}

.team_wrapper .team_item p {
	color: #777777;
	margin-top: 0.5rem;
}

.team_wrapper .team_slider .owl-nav .owl-next, .team_wrapper .team_slider .owl-nav .owl-prev {
    width: 7rem;
    height: 7rem;
    background: var(--color01);
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    border-radius: 1.8rem;
    font-size: 1.8rem;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
}

.team_wrapper .team_slider .owl-nav .owl-next {
	right: -3%;
}

.team_wrapper .team_slider .owl-nav .owl-prev {
	left: -3%;
}

/*=====================
   16. blog section css
=======================*/
.blog_wrapper {
	background: -o-linear-gradient(top, var(--color03) 0%, #F6F7FF 100%);
	background: -webkit-gradient(linear, left top, left bottom, from(var(--color03)), to(#F6F7FF));
	background: linear-gradient(180deg, var(--color03) 0%, #F6F7FF 100%);
}

.blog_wrapper .blog_head_wrap {
	padding-bottom: 3rem;
}

.blog_wrapper .blog_item {
	background: var(--color03);
	border: 0.1rem solid var(--color01);
	padding: 2.5rem 2.5rem 7rem 2.5rem;
	border-radius: 3rem;
	overflow: hidden;
	-webkit-box-shadow: 0rem 0.3rem 1rem 0 rgba(0, 0, 0, 0.06);
	        box-shadow: 0rem 0.3rem 1rem 0 rgba(0, 0, 0, 0.06);
	position: relative;
	height: 100%;
	-webkit-transition: 0.3s all ease-in-out;
	-o-transition: 0.3s all ease-in-out;
	transition: 0.3s all ease-in-out;
}

.blog_wrapper .blog_item:hover {
	-webkit-transform: translateY(-0.5rem);
	    -ms-transform: translateY(-0.5rem);
	        transform: translateY(-0.5rem);
}

.blog_wrapper .blog_item figure {
	width: 100%;
	height: auto;
	overflow: hidden;
	border-radius: 1rem;
}

.blog_wrapper .blog_item figure img {
	border-radius: 1rem;
	-webkit-transition: 0.4s all ease-in-out;
	-o-transition: 0.4s all ease-in-out;
	transition: 0.4s all ease-in-out;
}

.blog_wrapper .blog_item:hover figure img {
	-webkit-transform: scale(1.10);
	    -ms-transform: scale(1.10);
	        transform: scale(1.10);
}

.blog_wrapper .blog_item .blog_content p {
	color: #adadad;	
	font-size: var(--font07);
	font-weight: 600;
	text-transform: uppercase;
}

.blog_wrapper .blog_item .blog_content h3 {
    font-size: var(--font08);
    font-weight: 600;
    max-width: 29rem;
}

.blog_wrapper .blog_item .blog_content h3 a {
	color: var(--color06);
	-webkit-transition: 0.4s all ease-in-out;
	-o-transition: 0.4s all ease-in-out;
	transition: 0.4s all ease-in-out;
}

.blog_wrapper .blog_item .blog_content h3 a:hover {
	color: var(--color04);
}

.blog_wrapper .blog_item .blog_content .learn_btn {
    font-size: var(--font04);
    font-weight: 600;
    color: var(--color05);
    -webkit-transition: 0.4s all ease-in-out;
    -o-transition: 0.4s all ease-in-out;
    transition: 0.4s all ease-in-out;
    position: absolute;
    bottom: 2.5rem;
    left: 2.5rem;
}

.blog_wrapper .blog_item .blog_content .learn_btn:hover {
	color: var(--color04);
}

/*================================
   17. project contact section css
==================================*/
.project_contact_wrapper {
	background: -o-linear-gradient(top, #F6F7FF 0%, #F4F4FF 100%);
	background: -webkit-gradient(linear, left top, left bottom, from(#F6F7FF), to(#F4F4FF));
	background: linear-gradient(180deg, #F6F7FF 0%, #F4F4FF 100%);
}

.custom_row {
    margin-right: -0.7rem;
    margin-left: -0.7rem;
}

.custom_col {
	padding-right: 0.7rem;
    padding-left: 0.7rem;
}

.project_contact_wrapper .project_contact_wrap {
	padding: 5rem;
	border-radius: 4rem;
	background: var(--color04);
	position: relative;
	overflow: hidden;
}

.project_contact_wrapper .project_contact_wrap .project_contact_shape {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.2;
    width: 46.4rem;
}

.project_contact_wrapper .project_contact_wrap .head_text {
	color: var(--color03);
}

.project_contact_wrapper .project_contact_wrap .project_contact_social a {
	font-size: var(--font03);
	color: var(--color03);
	display: inline-block;
	margin-top: 0.5rem;
    background: -o-linear-gradient(top, var(--color03) 0, var(--color03) 98%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, var(--color03)), color-stop(98%, var(--color03)));
    background: linear-gradient(180deg, var(--color03) 0, var(--color03) 98%);
    background-position: left 100%;
    background-repeat: no-repeat;
    background-size: 0 0.2rem;
    -webkit-transition: 0.3s all ease-in-out;
    -o-transition: 0.3s all ease-in-out;
    transition: 0.3s all ease-in-out;
}

.project_contact_wrapper .project_contact_wrap .project_contact_social a:hover {
	background-size: 100% 0.2rem;
}

.project_contact_wrapper .project_contact_wrap form .input_item {
	width: 100%;
	height: 4.2rem;
	background: var(--color03);
	padding-left: 1.5rem;
	border-radius: 0.4rem;
	border: 0.1rem solid rgba(0, 0, 0, 0.15);
	font-size: var(--font02);
	color: #1f2124;
}

.project_contact_wrapper .project_contact_wrap form .input_item::-webkit-input-placeholder {
	color: #adadad;
}

.project_contact_wrapper .project_contact_wrap form .input_item::-moz-placeholder {
	color: #adadad;
}

.project_contact_wrapper .project_contact_wrap form .input_item:-ms-input-placeholder {
	color: #adadad;
}

.project_contact_wrapper .project_contact_wrap form .input_item::-ms-input-placeholder {
	color: #adadad;
}

.project_contact_wrapper .project_contact_wrap form .input_item::placeholder {
	color: #adadad;
}

.project_contact_wrapper .project_contact_wrap form .select_item {
	background-image: url(../img/select_icon.png);
    background-repeat: no-repeat;
    background-position: calc(100% - 1.2rem) center;
    -webkit-appearance: none;
    color: #adadad;
}

.project_contact_wrapper .project_contact_wrap form .textarea_item {
	padding-top: 1rem;
	height: 10rem;
	resize: none;
}

.project_contact_wrapper .project_contact_wrap form .checkbox label {
	color: var(--color03);
}

.project_contact_wrapper .project_contact_wrap form .checkbox label span {
    margin: 0.2rem 0.5rem 0 0;
    border: 0.2rem solid var(--color03);
}

.project_contact_wrapper .project_contact_wrap form button {
	border: transparent;
	background: var(--color02);
}

.project_contact_wrapper .project_contact_wrap form button:hover {
	background: var(--color03);
	color: var(--color05);
}

/*==========================
   18. newsletter section css
============================*/
.newsletter_wrapper {
	background: -o-linear-gradient(top, #F4F4FF 0%, #F6F6FF 100%);
	background: -webkit-gradient(linear, left top, left bottom, from(#F4F4FF), to(#F6F6FF));
	background: linear-gradient(180deg, #F4F4FF 0%, #F6F6FF 100%);
}

.newsletter_wrapper .newsletter_wrap {
	border-bottom: 0.1rem solid rgba(0, 0, 0, 0.15);
	padding-bottom: 6rem;
}

.newsletter_wrapper .newsletter_wrap h2 {
	padding-bottom: 3rem;
}

.newsletter_wrapper .newsletter_wrap form {
	max-width: 50rem;
	width: 100%;
}

.newsletter_wrapper .newsletter_wrap form .input_info {
	width: 100%;
	height: 5.5rem;
	background: var(--color03);
	padding-left: 2rem;
	color: var(--color05);
	border: transparent;
	border-radius: 1rem;
}

.checkbox label {
	font-size: var(--font02);
	cursor: pointer;
	color: #5f6567;
}

.checkbox input[type=checkbox] {
	display: none;
}

.checkbox label span {
    width: 2rem;
    height: 2rem;
    border: 0.2rem solid #5f6567;
    border-radius: 0.5rem;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin: 0.5rem 0.5rem 0 0;
}

.checkbox label span i {
	display: none;
}

.checkbox input[type=checkbox]:checked + label span i {
	display: block !important;
}

.newsletter_wrapper .newsletter_wrap form button {
	background: var(--color02);
	color: var(--color04);
	height: 4.5rem;
	padding: 0 2.4rem;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	font-size: var(--font02);
	font-weight: 600;
	border: transparent;
	-webkit-transition: 0.4s all ease-in-out;
	-o-transition: 0.4s all ease-in-out;
	transition: 0.4s all ease-in-out;
	border-radius: 0.4rem;
}

.newsletter_wrapper .newsletter_wrap form button:hover {
	background: var(--color03);
}

.newsletter_wrapper .newsletter_wrap form button i {
	margin-left: 1rem;
}

.newsletter_wrapper .contact_detail_wrap .contact_detail_item {
    width: 17rem;
    margin-left: 4rem;
    -ms-flex-negative: 0;
        flex-shrink: 0;
}

.newsletter_wrapper .contact_detail_wrap .contact_detail_item h3 {
	color: var(--color06);
	font-size: var(--font03);
	font-weight: 600;
}

.newsletter_wrapper .contact_detail_wrap .contact_detail_item .link {
	font-size: var(--font02);
	color: var(--color05);
	display: inline-block;
}

.newsletter_wrapper .contact_detail_wrap .contact_detail_item .link:hover {
	color: var(--color04);
}

/*==========================
   19. footer section css
============================*/
footer {
	padding: 0rem 0 2rem 0;
	background: -o-linear-gradient(top, #F4F4FF 0%, #F6F6FF 100%);
	background: -webkit-gradient(linear, left top, left bottom, from(#F4F4FF), to(#F6F6FF));
	background: linear-gradient(180deg, #F4F4FF 0%, #F6F6FF 100%);
}

footer .footer_item h3 {
	font-size: var(--font08);
	font-weight: 600;
	color: var(--color06);
	padding-bottom: 1.5rem;
}

footer .footer_item ul li {
	display: block;
}

footer .footer_item ul li a {
	color: #5f6567;
	font-size: var(--font01);
	font-weight: 500;
	margin-top: 0.5rem;
	display: block;
	-webkit-transition: 0.4s all ease-in-out;
	-o-transition: 0.4s all ease-in-out;
	transition: 0.4s all ease-in-out;
}

footer .footer_item ul li a:hover {
	color: var(--color04);
}

footer .footer_item .mr_40 {
	margin-right: 4rem;
}

footer .footer_wrap {
	padding: 3rem 0;
	border-top: 0.1rem solid rgba(0, 0, 0, 0.15);
	margin-top: 6rem;
}

footer .footer_wrap p {
	margin-right: 1rem;
}

footer .footer_wrap p,
footer .footer_wrap .footer_menu li a {
	font-size: var(--font02);
	color: #5f6567;
	-webkit-transition: 0.3s all ease-in-out;
	-o-transition: 0.3s all ease-in-out;
	transition: 0.3s all ease-in-out;
}

footer .footer_wrap p a:hover,
footer .footer_wrap .footer_menu li a:hover {
	color: var(--color04);
}

footer .footer_wrap p a {
	color: #5f6567;
}

footer .footer_wrap .footer_menu li {
	display: inline-block;
	margin: 0 1rem;
}

footer .footer_wrap .footer_social li {
	display: inline-block;
}

footer .footer_wrap .footer_social li a {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	border-radius: 50%;
	background: var(--color02);
	color: var(--color04);
	width: 4rem;
	height: 4rem;
	margin-left: 1.5rem;
	-webkit-transition: 0.4s all ease-in-out;
	-o-transition: 0.4s all ease-in-out;
	transition: 0.4s all ease-in-out;
}

footer .footer_wrap .footer_social li a:hover {
	background: var(--color04);
	color: var(--color03);
}

/*===============================
   20. stack view card section css
=================================*/
.stack_view_wrapper {
	padding-bottom: 14rem;
}

.stack_view_wrapper .stack_head_wrap {
    max-width: 61rem;
    margin: 0 auto;
}

.stack_view_wrapper .stack_view_btn a {
	background: var(--color01);	
	height: 4.5rem;
	padding: 0 2.4rem;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	border-radius: 10rem;
	color: var(--color05);
	font-size: var(--font02);
	font-weight: 600;
	-webkit-transition: 0.4s all ease-in-out;
	-o-transition: 0.4s all ease-in-out;
	transition: 0.4s all ease-in-out;
	margin: 3rem 1rem 0 1rem;
}

.stack_view_wrapper .stack_view_btn a:hover {
	background: var(--color02);
}

.stack_view_wrapper .cards_wrap {
	width: 100%;
	display: -ms-grid;
	display: grid;
    grid-template-rows: repeat(var(--cards-count), var(--card-height));
}

.stack_view_wrapper .cards_wrap .stack_card_main {
    width: 100% !important;
    position: sticky;
    top: 7rem;
}

.stack_view_wrapper .cards_wrap .stack_card_main01 .stack_card_item {
	background: #F6F6FF;
}

.stack_view_wrapper .cards_wrap .stack_card_main02 .stack_card_item {
	background: #ECEEFF
}

.stack_view_wrapper .cards_wrap .stack_card_main03 .stack_card_item {
	background: var(--color02);
}

.stack_view_wrapper .cards_wrap .stack_card_main .stack_card_item {
    padding: 6.5rem 8rem;
    border-radius: 4rem;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    height: 62rem;
    -webkit-transform-origin: center top;
        -ms-transform-origin: center top;
            transform-origin: center top;
	will-change: transform;
}

.stack_view_wrapper .cards_wrap .stack_card_main .stack_card_item .card_content {
	max-width: 38rem;
}

.stack_view_wrapper .cards_wrap .stack_card_main .stack_card_item .sub_head {
	font-weight: 600 !important;
}

.stack_view_wrapper .cards_wrap .stack_card_main .stack_card_item p {
	font-size: var(--font03);
	color: #0009;
	line-height: 3rem;
}

.stack_view_wrapper .cards_wrap .stack_card_main .stack_card_item .card_content .custom_btn {
	background: var(--color04);
	color: var(--color03);
}

.stack_view_wrapper .cards_wrap .stack_card_main .stack_card_item .card_content .custom_btn:hover {
	background: var(--color02) !important;
	color: var(--color04) !important;
}

.stack_view_wrapper .cards_wrap .stack_card_main .card_image_container {
    max-width: 54rem;
    width: 100%;
}

.stack_view_wrapper .cards_wrap .stack_card_main .stack_card_item img {
	width: 100%;
}

/*========================
   21.solution section css
==========================*/
.header02.sticky {
	background: var(--color03) !important;
}

.header02 .header_wrap::before {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 0.1rem;
	background: rgba(0, 0, 0, 0.15);
}

.header02 nav li .nav-link {
	color: var(--color05) !important;
}

.header02 nav li .nav-link:hover {
	color: var(--color04) !important;
}

.header02 .logo .logo02 {
	display: block !important;
}

.header02 .logo .logo01 {
	display: none !important;
}

.default_wrapper {
    margin-top: 7rem;
    padding: 9.5rem 0 12rem 0;
}

.service_solution_wrapper .service_solution_head {
    max-width: 75rem;
    margin: 0 auto 5rem auto;
}

.solution_img {
    border-radius: 0.4rem;
    height: 36rem;
    -o-object-fit: cover;
       object-fit: cover;
}

.service_solution_wrapper .solution_para_item {
	max-width: 79rem;	
	margin: 8.5rem auto 0 auto;
	text-align: left;
}

/*=====================================
   22.comprehensive service section css
=======================================*/
.comprehensive_service_wrapper {
	padding-bottom: 10.5rem;
}

.comprehensive_service_wrapper .comprehensive_head {
    max-width: 55.6rem;
}

.comprehensive_service_wrapper .para01 {
	max-width: 57.6rem;
	margin-top: 6rem;
}

.comprehensive_service_wrapper .comprehensive_left {
	margin-left: auto;
}

/*==============================
   23.custom service section css
================================*/
.custom_service_wrapper {
	background: -webkit-gradient(linear, left top, left bottom, from(#AFC6E6), to(#E9E6EF));
	background: -o-linear-gradient(top, #AFC6E6 0%, #E9E6EF 100%);
	background: linear-gradient(180deg, #AFC6E6 0%, #E9E6EF 100%);
}

.custom_service_wrapper .custom_service_item {
    height: 29rem;
    background: var(--color03);
    border-radius: 0.4rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    -webkit-transition: 0.3s all ease-in-out;
    -o-transition: 0.3s all ease-in-out;
    transition: 0.3s all ease-in-out;
}

.custom_service_wrapper .custom_service_item:hover {
	-webkit-box-shadow: 0.4rem 0.4rem 1.4rem 0.1rem rgba(0, 0, 0, 0.15);
	        box-shadow: 0.4rem 0.4rem 1.4rem 0.1rem rgba(0, 0, 0, 0.15);
}

.custom_service_wrapper .custom_service_item h2 {
	font-size: var(--font08);
	font-weight: 600;
}

.custom_service_wrapper .custom_service_item .custom_service_content {
    padding: 3rem;
    border-bottom: 0.1rem solid rgba(0, 0, 0, 0.15);
}

.custom_service_wrapper .custom_service_item .custom_service_content h2 a {
	color: var(--color05);
	-webkit-transition: 0.3s all ease-in-out;
	-o-transition: 0.3s all ease-in-out;
	transition: 0.3s all ease-in-out;
}

.custom_service_wrapper .custom_service_item .custom_service_content h2 a:hover {
	color: var(--color04);
}

.custom_service_wrapper .custom_service_item .custom_service_content p {
	font-size: var(--font02);
	color: #3f444b;
}

.custom_service_wrapper .custom_service_item .custom_learn_btn {
	padding: 1.5rem 3rem 1.5rem 3rem;
}

/*==============================
   24.why choose service section css
================================*/
.why_choose_service_wrapper .why_choose_service {
	border-radius: 0.4rem;
	padding-left: 3rem;
}

.why_choose_service_wrapper .why_choose_service_content {
    margin-right: 3rem;
}

.why_choose_service_wrapper .why_choose_service_content .custom_btn {
	background: var(--color04);
	color: var(--color03);
}

.why_choose_service_wrapper .why_choose_service_content .custom_btn:hover {
	background: var(--color05) !important;
}

/*========================
   25. contact section css
==========================*/
.contact_wrapper {
	margin-bottom: 10rem;
}

.contact_wrapper .contact_wrap {
    position: relative;
    border-radius: 0.4rem;
    background-image: -webkit-gradient(linear, left top, right top, from(#E9E6EF), to(#AFC6E6));
    background-image: -o-linear-gradient(left, #E9E6EF 0%, #AFC6E6 100%);
    background-image: linear-gradient(90deg, #E9E6EF 0%, #AFC6E6 100%);
    padding: 2rem 2.5rem 4rem 2.5rem;
    z-index: 1;
    overflow: hidden;
}

.contact_wrapper .contact_wrap::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	background: var(--color05);
	z-index: 1;
	width: 100%;
	height: 33.34rem;
}

.contact_wrapper .contact_wrap .shape {
	height: 3rem;
	padding: 0 0.9rem;
	background: rgba(0, 0, 0, 0.15);
	font-size: var(--font07);
	font-weight: 600;
	color: var(--color02);
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	border-radius: 0.4rem;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	text-transform: uppercase;
}

.contact_wrapper .contact_wrap .head_text {
    color: var(--color02);
    margin-top: 14rem;
}

.contact_wrapper .contact_wrap .row {
	position: relative;
	z-index: 11;
}

.contact_wrapper .contact_wrap .para01 {
    margin-top: 6.5rem;
    max-width: 79%;
}

.contact_wrapper .contact_wrap h3 {
	font-size: var(--font03);
	font-weight: 600;
	color: #0a0d31;
}

.contact_wrapper .contact_wrap h3 a {
	color: #0a0d31;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #0a0d31), color-stop(98%, #0a0d31));
	background: -o-linear-gradient(top, #0a0d31 0, #0a0d31 98%);
	background: linear-gradient(180deg, #0a0d31 0, #0a0d31 98%);
    background-position: left 100%;
    background-repeat: no-repeat;
    background-size: 0 0.4rem;
    -webkit-transition: 0.3s all ease-in-out;
    -o-transition: 0.3s all ease-in-out;
    transition: 0.3s all ease-in-out;
    padding-bottom: 0.5rem;
}

.contact_wrapper .contact_wrap h3 a:hover {
	background-size: 100% 0.4rem;
}

.contact_wrapper .contact_wrap ul {
	margin-left: 4rem;
}

.contact_wrapper .contact_wrap ul li {
	margin-top: 1rem;	
}

.contact_wrapper .contact_wrap .contact_schedule_item {
	position: relative;
	width: 33.3333%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
}

.contact_wrapper .contact_wrap .contact_schedule_item svg {
    position: absolute;
    right: 1.5rem;
    opacity: 0.2;
    height: 5.5rem;
}

.contact_wrapper .contact_wrap .contact_schedule_item span {
	font-size: var(--font08);
	font-weight: 600;
	color: var(--color05);
	display: inline-block;
	margin-right: 2rem;
}

.contact_wrapper .contact_wrap .contact_schedule_item p {
	font-size: var(--font02);
	color: var(--color05);
	line-height: normal;
}

.contact_wrapper .contact_wrap form {
    background: var(--color03);
    border-radius: 0.4rem;
    padding: 3rem 0;
    margin-top: 4rem;
}

.contact_wrapper .contact_wrap form h3 {
    padding: 0 3rem 3rem 3rem;
    border-bottom: 0.1rem solid rgba(0, 0, 0, 0.15);
}

.contact_wrapper .contact_wrap form h3::before {
    content: "";
    position: absolute;
    left: 50%;
    width: 4rem;
    height: 4rem;
    background: var(--color03);
    bottom: -2rem;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
}

.contact_wrapper .contact_wrap form .contact_form_box {
	padding: 0 4rem;
}

.contact_wrapper .contact_wrap form .contact_form_box label {
	font-size: var(--font02);	
	color: var(--color05);
	display: block;
	margin-bottom: 0.3rem;
}

.contact_wrapper .contact_wrap form .contact_form_box input,
.contact_wrapper .contact_wrap form .contact_form_box select,
.contact_wrapper .contact_wrap form .contact_form_box textarea {
	width: 100%;
	height: 4.2rem;
	border: 0.1rem solid rgba(0, 0, 0, 0.15);
	border-radius: 0.4rem;
	padding-left: 1.5rem;
	font-size: var(--font02);
}

.contact_wrapper .contact_wrap form .contact_form_box input:focus,
.contact_wrapper .contact_wrap form .contact_form_box select:focus,
.contact_wrapper .contact_wrap form .contact_form_box textarea:focus {
	border: 0.1rem solid var(--color04);
}

.contact_wrapper .contact_wrap form .contact_form_box select {
	background-image: url(../img/select_icon.png);
    background-repeat: no-repeat;
    background-position: calc(100% - 1.2rem) center;
    -webkit-appearance: none;
    color: #adadad;
}

.contact_wrapper .contact_wrap form .contact_form_box textarea {
	resize: none;
	height: 10rem;
	padding-top: 1rem;
}

.contact_wrapper .contact_wrap form .contact_form_box button {
	border: transparent;
	background: var(--color04);
	color: var(--color03);
}

.contact_wrapper .contact_wrap form .contact_form_box button:hover {
	background: var(--color05) !important;
	color: var(--color03) !important;
}

/*=============================
   26. contact help section css
===============================*/
.contact_help_wrapper .contact_sub_box .contact_sub_item {
    width: 19rem;
    text-align: left;
    margin: 3rem 1.8rem 0 1.8rem;
    -ms-flex-negative: 0;
        flex-shrink: 0;
}

.contact_help_wrapper .contact_sub_box .contact_sub_item h3 {
	font-size: var(--font01);
	font-weight: 500;
}

.contact_help_wrapper .contact_sub_box .contact_sub_item h3 a {
	color: var(--color05);
	-webkit-transition: 0.3s all ease-in-out;
	-o-transition: 0.3s all ease-in-out;
	transition: 0.3s all ease-in-out;
}

.contact_help_wrapper .contact_sub_box .contact_sub_item h3 a:hover {
	color: var(--color04);
}

.contact_help_wrapper .contact_sub_box .contact_sub_item svg {
    position: absolute;
    right: 0%;
    top: 50%;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
    opacity: 0.2;
    height: 6rem;
}

.contact_help_wrapper .custom_btn {
	background: var(--color04);
	color: var(--color03);
}

.contact_help_wrapper .custom_btn:hover {
	background: var(--color05);
	color: var(--color03);
}

/*=========================
   27. location section css
===========================*/
.location_wrapper {
	padding-bottom: 10rem;
}

.location_wrapper .location_shape {
    width: 37.8rem;
    right: 0;
    top: 0;
}

.location_wrapper .location_head_wrap {
    max-width: 48.7rem;
}

.location_wrapper .location_item {
    max-width: 34rem;
    width: 100%;
    position: relative;
    margin-top: 6rem;
    -ms-flex-negative: 0;
        flex-shrink: 0;
}

.location_wrapper .location_item::before {
    background: rgba(0, 0, 0, 0.15);
    position: absolute;
    right: 0;
    top: 0;
    width: 0.1rem;
    height: 26rem;
    content: "";
}

.location_wrapper .location_item h3 {
	font-size: var(--font05);
	font-weight: 600;
}

.location_wrapper .location_item h4 {
	font-size: var(--font03);
	font-weight: 600;
}

.location_wrapper .location_item p a {
	-webkit-transition: 0.3s all ease-in-out;
	-o-transition: 0.3s all ease-in-out;
	transition: 0.3s all ease-in-out;
}

.location_wrapper .location_item p a:hover {
	color: var(--color04);
}

.location_wrapper .location_item02,
.location_wrapper .location_item03 {
	padding-left: 8rem;
}

.location_wrapper .location_item03::before {
	display: none;
}

/*=============================
   28. case studies section css
===============================*/
.case_studies_wrapper .case_studies_wrap {
	padding-bottom: 3rem;
}

.case_studies_wrapper .case_studies_item {
    border: 0.1rem solid rgba(0, 0, 0, 0.1);
    padding: 2.5rem 2.5rem 7rem 2.5rem;
    border-radius: 1rem;
    -webkit-transition: 0.3s all ease-in-out;
    -o-transition: 0.3s all ease-in-out;
    transition: 0.3s all ease-in-out;
    background: var(--color03);
    height: 100%;
    position: relative;
}

.case_studies_wrapper .case_studies_item:hover {
	-webkit-transform: translateY(-0.5rem);
	    -ms-transform: translateY(-0.5rem);
	        transform: translateY(-0.5rem);
}

.case_studies_wrapper .case_studies_item figure {
	width: 100%;
	height: auto;
	overflow: hidden;
	border-radius: 1rem;
}

.case_studies_wrapper .case_studies_item figure img {
	-webkit-transition: 0.3s all ease-in-out;
	-o-transition: 0.3s all ease-in-out;
	transition: 0.3s all ease-in-out;
	border-radius: 1rem;
}

.case_studies_wrapper .case_studies_item:hover figure img {
	-webkit-transform: scale(1.10);
	    -ms-transform: scale(1.10);
	        transform: scale(1.10);
}

.case_studies_wrapper .case_studies_item .case_studies_content {
	padding: 2rem 0 0 0;
}

.case_studies_wrapper .case_studies_item .case_studies_content span {
	color: #adadad;
	font-size: var(--font07);
	font-weight: 600;
	text-transform: uppercase;
}

.case_studies_wrapper .case_studies_item .case_studies_content h3 {
	font-size: var(--font03);
	font-weight: 600;
}

.case_studies_wrapper .case_studies_item .case_studies_content h3 a {
	color: var(--color05);
	-webkit-transition: 0.3s all ease-in-out;
	-o-transition: 0.3s all ease-in-out;
	transition: 0.3s all ease-in-out;
}

.case_studies_wrapper .case_studies_item .case_studies_content h3 a:hover {
	color: var(--color04);
}

.case_studies_wrapper .case_studies_item .case_studies_content .case_studies_btn {
    font-size: var(--font04);
    font-weight: 600;
    color: var(--color05);
    display: inline-block;
    -webkit-transition: 0.3s all ease-in-out;
    -o-transition: 0.3s all ease-in-out;
    transition: 0.3s all ease-in-out;
    position: absolute;
    bottom: 2.5rem;
    left: 2.5rem;
}

.case_studies_wrapper .case_studies_item .case_studies_content .case_studies_btn:hover {
	color: var(--color04);
}

/*=======================
   29. why us section css
=========================*/
.why_us_wrapper .why_us_wrap {
	padding-bottom: 6rem;
	border-bottom: 0.1rem solid rgba(0, 0, 0, 0.15);
}

.why_us_wrapper .why_us_wrap .why_us_item {
    margin-top: 12rem;
    max-width: 33rem;
}

.why_us_wrapper .why_us_wrap .why_us_item h3 {
	font-size: var(--font08);
	font-weight: 600;
}

.why_us_wrapper .why_us_wrap .why_us_item p {
	font-size: var(--font02);
}

/*===========================
   30. How we do section css
============================*/
.how_we_do_wrapper {
	padding-bottom: 10rem;
}

.how_we_do_wrapper .how_we_do_content {
    max-width: 49.2rem;
}

.how_we_do_wrapper .how_we_do_img {
	border-radius: 0.4rem;
}

/*================================
   31. managed service section css
==================================*/
.managed_service_wrapper {
	position: relative;
	padding: 11rem 0 6rem 0;
	margin-top: 7rem;
	z-index: 1;
}

.managed_service_wrapper .managed_service_bg {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}

.managed_service_wrapper .managed_service_content {
    max-width: 70rem;
}

.managed_service_wrapper .managed_service_content .sub_head {
	background: rgba(0, 0, 0, 0.15) !important;
	color: var(--color02) !important;
}

.managed_service_wrapper .managed_service_content .head_text03,
.managed_service_wrapper .managed_service_content p {
	color: var(--color03) !important;
}

.managed_service_wrapper .managed_service_content p {
	font-size: var(--font05);
	line-height: normal;
}

/*========================================
   32. benefit managed service section css
==========================================*/
.benefit_managed_service_wrapper .benefit_managed_service_box {
    margin-right: 6rem;
}

.benefit_managed_service_wrapper .benefit_managed_service_box ul {
    list-style: disc;
    padding-left: 2rem;
}

.benefit_managed_service_wrapper .benefit_managed_service_box .benefit_managed_service_item h3 {
	font-size: var(--font03);
	font-weight: 600;
}

.benefit_managed_service_wrapper .benefit_managed_service_box .benefit_managed_service_item P {
	font-size: var(--font02);
}

.benefit_managed_service_wrapper .benefit_manage_service_img {
	border-radius: 0.4rem;
}

/*===================================
   33. managed it service section css
=====================================*/
.managed_it_service_wrapper {
	padding-bottom: 10rem;
	border-bottom: 0.1rem solid rgba(0, 0, 0, 0.15);
}

.managed_it_service_wrapper .managed_it_service_content {
    padding-left: 6rem;
}

/*===========================
   34. client say section css
=============================*/
.client_say_wrapper .container {
	max-width: 73.7rem !important;
}

.client_say_wrapper .client_say_item {
    max-width: 73.7rem;
    width: 100%;
}

.client_say_wrapper h3 {
	font-size: var(--font05);
	font-weight: 600;
	padding-bottom: 5rem;
}

.client_say_wrapper .client_say_item .client_say {
	width: 5.4rem !important;
}

.client_say_wrapper .client_say_item p {
	font-size: var(--font05);
	line-height: normal;
}

.client_say_wrapper .client_say_item h4 {
	font-size: var(--font01);
	font-weight: 600;
}

.client_say_wrapper .client_say_item .custom_para {
	color: #0009;
	font-size: var(--font02);
}

.client_say_logo {
	margin: 6rem 0 0 6rem;
	display: inline-block;
}

.client_say_logo p {
    font-size: 1.1rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05rem;
    color: #0009;
    margin-top: 0.5rem;
}

.client_say_logo .star_icon i {
    color: #FF3D2E;
    font-size: 1.1rem;
}

.client_say_logo .client_say_logo01 {
	width: 7.7rem !important;
}

.ml_10 {
	margin-left: 1rem !important;
}

.client_say_logo .client_say_logo02 {
	width: 4.2rem !important;
}

.client_say_logo span {
	height: 2rem;
	background: #f5f5f5;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	border-radius: 0.4rem;	
	padding: 0 0.4rem;
	font-weight: 600;
	font-size: 1.1rem;
	color: var(--color05);
}

.client_say_logo .star_icon02 {
	font-size: 1.1rem;
	color: #FBB002;
}

.client_say_wrapper .client_say_slider .owl-prev,
.client_say_wrapper .client_say_slider .owl-next {
	width: 4.6rem;
	height: 4.6rem;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	border-radius: 50%;
	background: #f5f5f5;
	color: var(--color05);
	font-size: 2rem;
	margin: 0 1rem;
	-webkit-transition: 0.3s all ease-in-out;
	-o-transition: 0.3s all ease-in-out;
	transition: 0.3s all ease-in-out;
}

.client_say_wrapper .client_say_slider .owl-prev:hover,
.client_say_wrapper .client_say_slider .owl-next:hover {
	background: var(--color04);
	color: var(--color03);
}

.client_say_wrapper .client_say_slider .owl-nav {
    position: absolute;
    bottom: -32%;
    left: -1rem;
}

/*==============================
   35. it consulting section css
================================*/
.it_consulting_wrapper {
	padding-bottom: 0 !important;
}

.it_consulting_wrapper .it_consulting_wrap {
	border-bottom: 0.1rem solid rgba(0, 0, 0, 0.15);
	padding-bottom: 8rem;
}

.it_consulting_wrapper .it_consulting {
	border-radius: 0.4rem;
	padding-left: 3rem;
}

.it_consulting_wrapper .about_paysafe_text {
    max-width: 78rem;
    margin: 6rem auto 0 auto;
}

/*======================================
   36. it consulting counter section css
========================================*/
.it_consulting_counter_wrapper .client_say_logo {
	margin: 6rem 0 0 0 !important;
}

.it_consulting_counter_wrapper .counter_item {
    max-width: 21.6rem;
    width: 100%;
    margin-top: 6rem !important;
}

/*=========================
   37. chalange section css
===========================*/
.chalange_wrapper .chalange_img {
	border-radius: 0.4rem;
	padding-left: 3rem;
	position: sticky;
	top: 9rem;
}

.chalange_wrapper .chalange_content p span {
	color: #242627;
	font-weight: 700;
}

.chalange_wrapper .chalange_content02 {
    margin-top: 20rem;
}

/*=======================
   38. result section css
=========================*/
.result_wrapper {
	padding-bottom: 10rem;
}

.result_wrapper .resuilt_shape {
	width: 29.1rem;
}

.result_wrapper .result_box::before {
    content: "";
    position: absolute;
    top: 0;
    right: -1.5rem;
    width: 0.1rem;
    height: 100%;
    background: rgba(0, 0, 0, 0.15);
}

.result_wrapper .result_box ul {
    list-style: disc;
    padding-left: 2rem;
}

.result_wrapper .result_box02 {
	padding-left: 7rem;
}

.result_wrapper .result_box02::before {
	display: none;
}

.result_wrapper .result_item {
	padding: 4rem;
	height: 54rem;
	position: relative;
	border-radius: 0.4rem;
}

.result_wrapper .result_item .result_tag {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 0 4rem 4rem 4rem;
}

.result_wrapper .result_item .result_tag a {
	padding: 0 2.6rem;
	height: 4rem;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	font-size: var(--font02);
	color: var(--color05);
	background: var(--color03);
	border-radius: 2.1rem;
	margin: 1rem 1rem 0 0;
	-webkit-transition: 0.3s all ease-in-out;
	-o-transition: 0.3s all ease-in-out;
	transition: 0.3s all ease-in-out;
}

.result_wrapper .result_item .result_tag a:hover {
	opacity: 0.7;
}

.result_wrapper .result_item01 {
	background: #dee0ff;
}

.result_wrapper .result_item02 {
	background: #242627;
}

.result_wrapper .result_item .result_btn_wrap {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 0 4rem 4rem 4rem;
}

.result_wrapper .result_item02 .head_text {
	color: var(--color03) !important;
}

.result_wrapper .result_item02 .result_img {
	width: 27rem;
	position: absolute;
	bottom: 4rem;
	right: 0;
	border-radius: 6.3rem 0 0 6.3rem;
}

.case_studies_wrapper02 {
	padding-bottom: 10rem !important;
}

/*======================
   39. back to top css
========================*/
.back-to-top {
	font-size: var(--font08);
	width: 4.5rem;
	height: 4.5rem;
	line-height: 4.5rem;
	text-align: center;
	display: none;
	position: fixed;
	bottom: 3rem;
	right: 2rem;
	z-index: 999999999999;
	border-radius: 50%;
	background: var(--color04);
}

.back-to-top i {
	color: var(--color03);
}

@media (max-width: 767px) {
  .newsletter_wrapper .contact_detail_wrap {
    display: none !important;
  }
}