@import url('https://fonts.googleapis.com/css2?family=Crimson+Text:wght@400;600&family=Domine:wght@400;500;600;700&family=Spectral:wght@400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter&family=Libre+Baskerville:wght@700&family=Montserrat&family=Poppins&family=Signika+Negative&family=Work+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;0,9..40,800;0,9..40,900;0,9..40,1000;1,9..40,700;1,9..40,900;1,9..40,1000&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@500&display=swap');
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
display: block;
}
html {
scroll-behavior: smooth;
}
body {
line-height: 1.15;
/*font-family: 'Chakra Petch', sans-serif;*/
/*font-family: 'Montserrat', sans-serif;*/
/*font-family: 'Poppins', sans-serif;*/
/*font-family: 'Signika Negative', sans-serif;*/
/*font-family: 'Work Sans', sans-serif;*/
font-family: 'DM Sans', sans-serif;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, 
blockquote:after,
q:before, 
q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
button{
outline: none;
box-shadow: none;
-webkit-appearance:none;
}
a{
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-ms-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
text-decoration:none;
outline:none;
}
* {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
a:hover,
a:focus{
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-ms-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
text-decoration:none;
outline:none;
color: inherit;
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
color: #ccc;
}
::-moz-placeholder { /* Firefox 19+ */
color: #ccc;
}
:-ms-input-placeholder { /* IE 10+ */
color: #ccc;
}
:-moz-placeholder { /* Firefox 18- */
color: #ccc;
}
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
-webkit-box-shadow: 0 0 0 50px white inset !important;
}
strong{font-weight: bold;}
.orange-text{
	color: #FF7342 !important;
}
.form-section::-webkit-scrollbar{
display: none;
}
.overlay-black{
width: 100%;
height: 100vh;
position: absolute;
top: 0px;
left: 0px;
background: rgba(0, 0, 0, 0.3);
}
#productbanner .navbar {width: 100%;min-height: 110px; padding: 16px 100px;z-index: 9999; left: inherit; background: rgba(34, 10, 47, 0.8);}
#productbanner .scrolled { position: fixed !important; background: #fff5e8; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s;}
.nav-link {font-size: 18px; line-height: 26px; color: #000; margin-left: 40px; text-transform: capitalize;}

.navbar{
width: 100%;
min-height: 100px;
padding: 20px 100px;
/*position: fixed;*/
z-index: 9999;
left: inherit;
}
.btn-orange,
.btn-orange:hover,
.btn-orange:focus,
:not(.btn-check) + .btn:active{
min-width: auto;
width: auto;
height: 65px;
padding: 10px 35px;
border: 0px;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
border-radius: 500px;
color: #fff;
font-size: 19px;
text-transform: uppercase;
background:#401955;
}
.btn-orange span{
margin-right: 14px;
}
.btn-orange i{
-webkit-transition: all 0.3s ease-in-out 0s;
-moz-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s;     
}
.btn-orange:hover i{
transform: translateX(-10px);
-webkit-transition: all 0.3s ease-in-out 0s;
-moz-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s; 
color: #fff;
}
.btn-orange:hover span{
color: #fff;
}
.btn-white{
min-width: auto;
width: auto;
height: 70px;
padding: 0px 25px;
border: 0px;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
border-radius: 500px;
color: #401955;
font-size: 19px;
text-transform: uppercase;
background:#fff;
}
.btn-white span{
margin-right: 25px;
}
.oclocktext{
font-size: 3rem;
color: #000;
font-weight: 300;
margin-bottom: 26px;
}
.navbar-brand img{
height: 48px;
}
#productbanner .navbar-brand img { filter: invert(1);}
#productbanner .scrolled .navbar-brand img {filter: invert(0);}
.home-outer{
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.homebanner-content{
margin-top: 60px;
}
.homebanner-content p.heading{
font-size: 53px;
line-height: 68px;
font-weight: 700;
color: #250d33;
/*font-family: 'Chakra Petch', sans-serif;*/
text-align: left;
}
.homebanner-content p.heading i{
color: #FF7342;
/*font-style: italic;*/
font-weight: 400;
font-size: 55px;
margin: 0;
}
.homeimage{
float: left;
}
.homeimage img{
height: 540px;
margin-top: 50px;
transform: translatey(0px);
-webkit-animation: float 6s ease-in-out infinite;
animation: float 6s ease-in-out infinite;
}
@keyframes float {
0% {
transform: translatey(0px);
}
50% {
transform: translatey(-10px);
}
100% {
transform: translatey(0px);
}
}
.homebanner-content p{
font-size: 24px;
line-height: 38px;
color: #250d33;
margin: 20px 0px 20px;
}
.homebanner-content p span{
letter-spacing: 3px;
font-size: 34px;
margin-bottom: 20px;
display: inline-block;
}
.navbar-expand-lg .navbar-nav .nav-link:hover span{
color: #FF7342;   
}
.navbar-expand-lg .navbar-collapse{
justify-content: center;
}
.navbar-expand-lg .navbar-nav .nav-link{
padding: 0px;
color: #250d33;
cursor: pointer;
}
.navbar-expand-lg .navbar-nav .nav-item.dropdown ul li .dropdown-item{padding: 15px 20px;}
.navbar-expand-lg .navbar-nav .nav-item.dropdown ul li .dropdown-item:hover,
.navbar-expand-lg .navbar-nav .nav-item.dropdown ul li .dropdown-item:focus{background: #e9ecef !important; padding: 15px 20px;}
.dropdown-toggle::after {color: #FF7342;vertical-align: 0;}

#servicesbanner .navbar-expand-lg .navbar-nav .nav-link,
#solutionsbanner .navbar-expand-lg .navbar-nav .nav-link,
#workbanner .navbar-expand-lg .navbar-nav .nav-link,
#aboutbanner .navbar-expand-lg .navbar-nav .nav-link,
#careerbanner .navbar-expand-lg .navbar-nav .nav-link,
#product-main-banner .navbar-expand-lg .navbar-nav .nav-link,
#hire-developers-banner .navbar-expand-lg .navbar-nav .nav-link{
color: #fff;
}

#servicesbanner .navbar-brand img,
#solutionsbanner .navbar-brand img,
#workbanner .navbar-brand img,
#aboutbanner .navbar-brand img,
#careerbanner .navbar-brand img,
#policybanner .scrolled .navbar-brand img,
#product-main-banner .navbar-brand img,
#hire-developers-banner .navbar-brand img{
filter: invert(1);
}

.scrolled{
position: fixed !important;
background: #fff5e8;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-ms-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}

#productbanner .navbar-expand-lg .navbar-nav .nav-link span{color: #ffffff;}
#productbanner .navbar-expand-lg .navbar-nav .nav-link:hover span, .navbar-expand-lg .navbar-nav .nav-link.active span { color: #FF7342 !important;}
#productbanner .navbar-expand-lg.scrolled .navbar-nav .nav-link span{color: #000000;}
.nav-link:hover .circle, .nav-link.active .circle { width: 22px; transition: all 0.3s linear 0s;}
.circle { width: 7px; height: 7px; background: #FF7342; display: inline-block; border-radius: 100px; margin-left: 3px; transition: all 0.3s linear 0s;}

#servicesbanner .scrolled .navbar-brand img,
#solutionsbanner .scrolled .navbar-brand img,
#workbanner .scrolled .navbar-brand img,
#aboutbanner .scrolled .navbar-brand img,
#careerbanner .scrolled .navbar-brand img.process-img,
#careerbanner .scrolled .navbar-brand img,
#product-main-banner .scrolled .navbar-brand img,
#hire-developers-banner .scrolled .navbar-brand img {
filter: invert(0);
}
#servicesbanner .navbar-expand-lg.scrolled .navbar-nav .nav-link,
#solutionsbanner .navbar-expand-lg.scrolled .navbar-nav .nav-link,
#workbanner .navbar-expand-lg.scrolled .navbar-nav .nav-link,
#aboutbanner .navbar-expand-lg.scrolled .navbar-nav .nav-link,
#careerbanner .navbar-expand-lg.scrolled .navbar-nav .nav-link,
#policybanner .navbar-expand-lg.scrolled .navbar-nav .nav-link,
#product-main-banner .navbar-expand-lg.scrolled .navbar-nav .nav-link,
#hire-developers-banner .navbar-expand-lg.scrolled .navbar-nav .nav-link{
color: #000;
}


.homebanner-content{
/*min-height: 574px;*/
float: left;
}
#homebanner{
float: left;
width: 100%;
position: relative;
height: 100vh;
background: #fff5e8;  /* fallback for old browsers */

}
.homebanner-content p i{
color: #FF7342;
font-size: 7px;
margin-right: 15px;
}
.nav-link:hover .circle{
width: 100px;
line-height: 50px;  
}
/*-------------------------*/
#sec-more-service{float: left; width: 100%; padding-bottom: 100px;}
#sec-service{
float: left;
width: 100%;
position: relative;
padding: 100px 0px 0px 0px !important;
}
.titletext, .titletext .titletext-inner{
font-size: 40px;
line-height: 28px;
font-weight: bold;
color: #FF7342;
text-transform: uppercase;
margin-bottom: 50px;
position: relative;
}
.titletext .titletext-inner{
	position: absolute;
	transform: translate(-50%, -50%);
	left: 50%;
	top: 50%;
	content: '';
	font-size: 120px;
    opacity: 0.08;
	z-index: 0;
} 

#sec-service .quotetext{
max-width: 1100px;
width: 100%;
margin: 0 auto 80px auto;
}
.quotetext{
font-size: 44px;
line-height: 60px;
/*font-family: 'Chakra Petch', sans-serif;*/
color: #250d33;
font-weight: 600;
position: relative;

}
.maintext{
font-size: 3rem;
line-height: 120px;
/*font-family: 'Chakra Petch', sans-serif;*/
color: #250d33;
margin-bottom: 15px;
font-weight: 600;   
}
.whitebox{
width: 100%;
float: left;
background-image: linear-gradient(316deg, #fff 0%, #fff 74%);
background-image: -webkit-linear-gradient(316deg, #fff 0%, #fff 74%);
background-image: -moz-linear-gradient(316deg, #fff 0%, #fff 74%);
min-height: 212px;
height: auto;
padding: 44px 34px;
margin-bottom: 24px;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: flex-start;
box-shadow: 0px 3px 35px #0000000F;
cursor: pointer;
border-radius: 12px;
position: relative;
-webkit-transition: all 0.3s ease-in-out 0s;
-moz-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s;
overflow: hidden;
}
.whitebox:hover{
-webkit-transition: all 0.3s ease-in-out 0s;
-moz-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s;
/*background-color: #cdc1ff;*/
/*background-image: linear-gradient(316deg, #cdc1ff 0%, #e5d9f2 74%);
background-image: -webkit-linear-gradient(316deg, #cdc1ff 0%, #e5d9f2 74%);
background-image: -moz-linear-gradient(316deg, #cdc1ff 0%, #e5d9f2 74%);*/
}
.whitebox i{
display: inline-block;
width: 70px;
height: 70px;
position: absolute;
height: 70px;
border-radius: 100px;
background: #fff5e8;
opacity: 0.5;
top: 30px;
left: 20px;
}
.whitebox:hover i{
width: 70px;
height: 70px;
opacity: 0.8;
transform: scale(15);
-webkit-transition: all 0.3s ease-in-out 0s;
-moz-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s;
}
/*.whitebox:hover img{
transform: scale(1.3);
-webkit-transition: all 0.3s ease-in-out 0s;
-moz-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s;    
}*/
.home-outer{
height: 100vh;
width: 100%;
position: relative;
}
.whitebox img{
/*filter: invert(70%) sepia(20%) saturate(958%) hue-rotate(102deg) brightness(94%) contrast(90%);*/
filter: invert(12%) sepia(27%) saturate(3632%) hue-rotate(255deg) brightness(108%) contrast(100%);
width: 45px;
}
.whitebox p{
font-size: 20px;
line-height: 26px;
color: #250d33;
position: relative;
z-index: 9;
}
.inductrycontent ul li a img{
	width: 53px;
	height: 54px;
filter: invert(12%) sepia(27%) saturate(3632%) hue-rotate(255deg) brightness(108%) contrast(100%);
}
.subquotetext{font-size: 28px;color: #250d33;font-weight: 600; line-height: 40px;}
/*-----------------------------*/
#toptecskills{
float: left;
width: 100%;
background: #401955;
background: -webkit-linear-gradient(to right, #2F1647, #301648, #3F2059, #401955);
background: linear-gradient(to right, #2F1647, #301648, #3F2059, #401955); 
padding: 100px 0px 100px;
scroll-snap-stop: always;
}
#toptecskills .quotetext{
/*    max-width: 850px;*/
color: #fff;
margin-bottom: 80px;
}
.scroll-skills{
float: left;
width: 100%;
position: relative;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
}
.skillhead{
/*width: 20%;*/
width: auto;
float: left;
}
.skillhead li{
display: block;
margin: 23px 0px;
float: left;
width: 100%;
}
.skillhead li a{
font-size: 36px;
color: #fff;
font-weight: 300;
line-height: 40px;
opacity: 0.1;
}
.skillhead li a.active{
opacity: 1;
}
.techicons.carousel-item{
    display: none;
    text-align: center;
}
.techicons.carousel-item.active{
    display: block;
}
.techicons .col{
margin: 32px 0px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.techicons .col span{
color: #fff;
display: block;
margin-top: 15px;
font-size: 1rem;
text-align: center;
}
/*--------------------------------*/
#sec-portfolio{
float: left;
width: 100%;
position: relative;
padding: 100px 0px;
}
#sec-portfolio .quotetext{
max-width: 100%;
margin-bottom: 40px;
}

.portfoliobox{
max-width: 95%;
min-height: 607px;
width: 100%;
height: auto;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
margin-top: 40px;
}
.portfoliobox img{
z-index: 99;
position: relative;
}
.portfoliobox .overlay{
background: url(../images/overlay-bg-sm.png)no-repeat;
height: 100%;
width: 100%;
position: absolute;
top: 0px;
left: 0px;
}
.description{
float: left;
width: 100%;
margin: 20px 0px 20px;
}
.description p{
font-size: 36px;
line-height: 37px;
color: #000;
margin-bottom: 6px;
font-weight: 500;
}
.description span{
font-size: 1rem;
color: #f97040;
font-weight: normal;
text-transform: uppercase;
}
#sec-portfolio .btn-orange{
margin-top: 20px;
}
#sec-portfolio .description.even{
padding-left: 35px;
}
#ourprocess{
float: left;
width: 100%;
position: relative;
background: #F1F1F1;
padding: 140px 0px;
}
#ourprocess .d-content img{
height: 54px;
}
#ourprocess .quotetext{
margin-bottom: 100px;
}
.procescardslist{
float: left;
width: 100%;
}
.scollprocess .quotetext{
max-width: 488px;
width: 100%;
padding-right: 100px;
}
.procescardslist li{
float: left;
max-width: 374px !important;
width: 100%;
box-shadow: 0px 23px 35px #0000000A;
border-radius: 22px;
background: #fff;
min-height: 544px;
margin: 0px 28px;
padding: 42px 24px;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.number{
font-size: 5.813rem;
line-height: 130px;
}
.content{
float: left;
width: 100%;
}
.content h5{
font-size: 1.75rem;
color: #FF7342;
line-height: 42px;
font-weight: bold;
/*font-family: 'Chakra Petch', sans-serif;*/


ax-width: 180px;
margin-bottom: 32px;
}
.content p{
color: #1E1E1E;
font-size: 1rem;
line-height: 26px;
}
.scollprocess{
float: left;
width: 100%;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
padding-left: 12.5%;
margin-top: 100px;
}
.scrollno{
float: right;
font-size: 2.375rem;
font-weight: bold;
}
.colorwhite{
color: #fff;
}
#sec-about{
float: left;
width: 100%;
position: relative;
min-height: 980px;
height: auto;
background: url(../images/Mesadetrabajo1.png) no-repeat;
background-size: cover;
padding: 100px 0px;
z-index: -1;
}
#sec-about .overlay{
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
/*background: transparent linear-gradient(215deg, #FF7342 0%, #FF7342 100%) 0% 0% no-repeat padding-box;*/
opacity: 0.9;
z-index: -1;
background-image: linear-gradient(316deg, #cdc1ff 0%, #e5d9f2 74%);
background-image: -webkit-linear-gradient(316deg, #cdc1ff 0%, #e5d9f2 74%);
background-image: -moz-linear-gradient(316deg, #cdc1ff 0%, #e5d9f2 74%)
}
#sec-about .titletext, #sec-about .titletext-inner{
color: #250d33;
line-height: 60px;
}
.aboutlist{
float: left;
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-evenly;
align-items: center;
flex-wrap: wrap;
}
.boxwhite{
max-width: 22%;
width: 100%;
min-height: 319px;
height: auto;
float: left;
background: #fff;
border-radius: 9px;
margin-bottom: 8px;
padding: 30px;
color:  #000000;
text-transform: uppercase;
}
.boxborder{
max-width: 22%;
width: 100%;
min-height: 319px;
height: auto;
float: left;
background: transparent;
border: 3px solid #fff;
border-radius: 9px; 
margin-bottom: 8px;  
padding: 30px;
color: #fff;    text-transform: uppercase;
}
.boxborder, .boxwhite{
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: flex-start;
}
.boxwhite p, .boxborder p{
font-size: 4.063rem;
line-height: 65px;
margin-bottom: 17px;
color: #250d33;
font-weight: 500;
}
.boxborder p{
color: #250d33;
}
.boxborder span, .boxwhite span{
font-size: 1.125rem;
line-height: 20px;
color: #250d33;
}
.box-big{
max-width: 31%;
}
#sec-about .quotetext{
margin-bottom: 80px;
}
#sec-about .btn-orange{
margin-top: 60px;
}
#getquote{
float: left;
width: 100%;
min-height: 670px;
height: auto;
position: relative;
background: #401955;
background: -webkit-linear-gradient(to right, #2F1647, #301648, #3F2059, #401955);
background: linear-gradient(to right, #2F1647, #301648, #3F2059, #401955); 
}
.overlay-o{
background: url(../images/Union13.png) no-repeat;
width: 613px;
height: 523px;
background-size: cover;
position: absolute;
z-index: 3;
top: 50%;
transform: -webkit-translateY(-50%);
transform: -moz-translateY(-50%);
transform: translateY(-50%);
left: -10%;

}
#getquote .quotetext{
color: #fff;
max-width: 1280px;
width: 100%;
line-height: 85px;
font-size: 60px;
margin: 0 0 60px 0px; 
padding-left: 284px;
}
#getquote .row .col{
min-height: 670px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
}
#getquote .quotetext i{
/*font-style: italic;*/
font-weight: 600;
color: #ff7341;
}
#getquote p{
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
padding-left: 284px;
/*margin-top: 134px;*/
width: 100%;
}
#getquote p  > span{
color: #fff;
font-size: 1.5rem;
line-height: 44px;
padding-right: 140px;
}
#getquote .btn-orange,
.ocs-products .btn-orange{
background: #FF7342;
width: 340px;
}
#getquote .btn-orange > span,
#getquote .btn-orange:hover > span,
#getquote .btn-orange:focus > span,
.ocs-products .btn-orange > span,
.ocs-products .btn-orange:hover > span,
.ocs-products .btn-orange:focus > span,
.ocs-products .btn-orange:focus i{
color: #ffffff;
}
/*#getquote .btn-orange i{
color: #401955;
}*/
#testimonial{
float: left;
width: 100%;
position: relative;
padding: 140px 0px;
}
#testimonial .titletext{
margin-bottom: 47px;

}
#testimonial .quotetext{
margin-bottom: 85px;
}
.testicontent{
float: left;
width: 100%;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
}
.clientimg{
max-width: 446px;
width: 100%;
min-height: 571px;
height: auto;
background: #f1f1f1;
margin-right: 100px;
}
.testicontent .content{
padding-left: 100px;
position: relative;
}
.content blockquote{
line-height: 57px;
font-size: 1.75rem;
margin-bottom: 90px;
}
.author{
float: left;
width: 100%;
}
.author p{
font-size: 1.438rem;
line-height: 35px;
color: #1E1E1E;
font-weight: bold;
}
.author span{
font-size: 1.063rem;
line-height: 32px;
}
.pagination{
float: left;
width: 100%;
display: flex;
flex-direction: row;
justify-content: flex-end;
align-items: center;
}
.pagination li{
width: 48px;
height: 48px;
border-radius: 100px;
background: #fff;
line-height: 48px;
color: #D8D8D8;
font-size: 20px;
text-align: center;
margin: 0px 7px;
cursor: pointer;
}
.pagination li.active{
background: #000000;
color: #fff;
}
#contact{
float: left;
width: 100%;
background: #fff5e8;
padding: 150px 0px;
}
#contact .quotetext{
max-width: 732px;
width: 100%;
margin:0px auto 70px auto;
}
#contact .quotetext span{
display: block;
color: #000;
}
.mailus{
float: left;
width: 100%;
margin-bottom: 75px;
}
.mailus span{
color: #FF7342;
font-size: 1.75rem;
font-weight: 500;
display: block;
}
.mailus a{
float: left;
width: 100%;
text-decoration: underline;
font-size: 28px;
margin: 5px 0px;
color: #000;
}
footer{
float: left;
width: 100%;
/*    background: #fff5e8;*/
background: #fff;
padding: 90px 0px 0px;
}
.footer-menu{
float: left;
width: 100%;
}
.footer-menu li{
float: left;
width: 100%;
margin: 0px 0px 30px;
display: block;
}
.footer-menu li a{
font-size: 30px;
line-height: 36px;
color: #000;
text-transform: capitalize;   
}
.footer-menu li a:hover,
.footer-menu li a:focus{
color: #FF7342;
}
.footer-menu li a.active{
color: #FF7342;   
}
.footer-menu li a:hover i,
.footer-menu li a:focus i{
color: #000;
}
.footer-menu li a.active .circle{
width: 32px;
transition: all 0.3s linear 0s;
}
.loactions, .social-media{
float: left;
width: 100%;
}
.loactions{
margin-bottom: 20px;
}
.locationaddress{
float: left;
width: 33.33%;
position: relative;
padding: 0px 30px;
min-height: 260px;
margin-bottom: 30px;
}
.locationaddress img{
position: absolute;
top: -20px;
left: -2px;
opacity: 0.3;
}
.locationaddress h6{
font-size: 3.375rem;
line-height: 62px;
font-weight: bold;
margin-bottom: 10px;
color: #000;
position: relative;
z-index: 1;
}
.locationaddress address {
font-size: 18px;
color: #000;
line-height: 32px;
}
.footer-menu li a .circle{
color: #FF7342;
width: 12px;
height: 12px;
}
.socialicons li{
margin-right: 15px;
}
.socialicons li a{
border-radius: 50px;
/*border: 3px solid #fff5e8;*/
width: 70px;
display: list-item;
height: 70px;
font-size: 30px;
color: #000;
background: #fff5e8;
text-align: center;
line-height: 70px;
}
.socialicons li a:hover,
.socialicons li a:focus{
background: transparent;
border: 3px solid #000;
}
.social-media{
/*border-top: 1px solid #000;*/
padding-top: 20px;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.socialicons{
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
margin-bottom: 30px;
}
.socialtitle{
font-size: 2.25rem;
line-height: 41px;
color: #FF7342;
margin-right: 104px;
max-width: 205px;

}
footer p{
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
}
footer p a{
font-size: 16px;
line-height: 20px;
color: #000;
margin-right: 64px;
}
footer p a:hover,
footer p a:focus{
color: #FF7342;
}
footer p a.active{
color: #FF7342;   
}
.copyright{
font-size: 14px;
color: #000;
justify-content: center;
}
.footer-menu{
margin-bottom: 0px;
}
/*=========================================*/
#aboutbanner{
float: left;
width: 100%;
position: relative;
/*background: url(../images/about.jpg) no-repeat;*/
background: #41295a;  /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #2F0743, #41295a);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #2F0743, #41295a); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

background-size: cover;
height: 70vh;
background-attachment: fixed;
background-position: center;
}



.bannerinner{
max-width: 1200px;
width: 100%;
margin: 0 auto;
position: relative;
z-index: 999;
text-align: center;
height: 70vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.bannerinner p{
font-size: 24px;
line-height: 36px;
color: #fff;
max-width: 770px;
}
.bannerinner h1{
color: #fff;
margin-bottom: 15px;
}
/*---------------------------*/
#ourmethodology{
float: left;
width: 100%;
position: relative;
padding:140px 0px;
background: #fff;
}
.aboutintro{
float: left;
width: 100%;
font-size: 1.75rem;
line-height: 40px;
}
.aboutintro .quotetext{
margin-bottom: 30px;
}
.methodology-content{
float: left;
width: 100%;
position: relative;
display: flex;
flex-direction: row;
justify-content: flex-start;
margin-top: 40px;
}
.methodology-content .videopart{
float: left;
max-width: 85%;
width: 100%;
min-height: 620px;
background: #efe5d7;
height: auto;
position: relative;
}
.methodology-content .videopart a{
display: block;
width: 97px;
height: 97px;
border-radius: 150px;
position: absolute;
top: 50%;
left: 50%;
transform: -webkit-translate(-50%, -50%);
transform: -moz-translate(-50%, -50%);
transform: translate(-50%, -50%);
text-align: center;
}
.methodology-content .videopart a img{
width: 100%;
object-fit: cover;
}
.threemethod{
float: left;
max-width: 32%;
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
margin-left: -117px;
position: relative;
z-index: 99;
}
.threemethod > span{
font-size: 27px;
line-height: 45px;
color: #000;
text-transform: uppercase;
font-weight: 400;
margin-bottom: 20px;
}
.threemethod > p{
font-size: 68px;
line-height: 120px;
color: #000;
color: #000;
padding-left: 45px;
}
.threemethod > p i{
width: 10px;
height: 10px;
color: #FF7342;
margin-left: 5px;
}
#ourleaders {
float: left;
width: 100%;
background: #FF7342;
padding: 140px 0px;
position: relative;
}
#ourleaders .quotetext{
max-width: 870px;
width: 100%;
color: #fff;
margin-bottom: 100px;
}
#ourleaders .titletext{
color: #fff;
}
.leadersimg{
width: 90%;
margin-bottom: 30px;
}
.leadersimg img{
width: 100%;
}
.nametitle{
font-size: 2.188rem;
line-height: 43px;
color: #fff;
margin: 5px 0px 0px;
text-align: left;
font-weight: bold;
}
.leadersimg > p{
font-size: 1.25rem;
line-height: 26px;
font-weight: 300;
color: #fff;
}
/*=========================*/
#corevalue{
float: left;
width: 100%;
padding: 150px 0px;
}
.watermark{
color: #000;
/*font-family: 'Chakra Petch', sans-serif;*/


font-size: 5.75rem;
line-height: 110px;
color: rgba(0, 0, 0, 0.25);
position: absolute;
top: 0px;
left: 0px;
max-width: 780px;
}
.corevalue-content{
position: relative;
padding-left: 170px;
}
.corevalue-content h3{
float: left;
width: 100%;
font-size: 2rem;
padding-right: 40px;
line-height: 70px;
padding-top: 80px;
padding: 120px 40px 0px 0px;
}
/*=========================*/
#strength{
    float: left;
    width: 100%;
    background: url(../images/people.png) no-repeat;
    min-height: 1332px;
    background-size: cover;
    position: relative;
    /* background-size: 10*/
}
#strength .quotetext{
margin-top: 160px;
margin-bottom: 0px;
color: #fff;
}
.overlay-people{
background: rgba(0, 0, 0, 0.1);
position: absolute;
top: 0px;
width: 100%;
height: 100%;
}
.teamText p{
font-size: 3.75rem;
line-height: 40px;
color: #fff;
text-align: center;
/*max-width: 650px;*/
margin: 100px auto 0;
}
.teamText{
position: relative;
    height: 106vh;
width: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
}
.teamText h2.quotetext{
font-size: 94px;
    font-weight: 300;
    line-height: 100px;
}
.teamText h2 span{
display: block;
font-size: 52px;
line-height: 83px;
text-align: center;
color: orange;
}
#about-join{
float: left;
width: 100%;
position: relative;
height: auto;
background: #fff;
/*background: -webkit-linear-gradient(to right, #2F1647, #301648, #3F2059, #401955);
background: linear-gradient(to right, #2F1647, #301648, #3F2059, #401955);*/
padding: 130px 0px;
}
.joinours{
float: left;
width: 100%;
padding: 60px 0px 50px 12%;
}
.joinours h4{
font-size: 28px;
line-height: 50px;
color: #000;
margin-bottom: 50px;
}
/*=========================*/
#workbanner{
float: left;
width: 100%;
position: relative;
/*background: url(../images/work.jpg) no-repeat;*/
background: #41295a;  /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #2F0743, #41295a);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #2F0743, #41295a); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

background-size: cover;
height: 70vh;
background-attachment: fixed;
background-position: center;
}
.workhero{
max-width: 910px;
width: 100%;
position: relative;
z-index: 99;
margin: 0 auto;
height: 70vh;
display: flex;
flex-direction: column;
text-align: center;
justify-content: center;
}

.workhero h1{
color: #fff;
margin-bottom: 15px;
}
.workhero p{
font-size: 24px;
line-height: 36px;
color: #fff;
width: 100%;
padding: 0px 70px;
}
.projectlisting{
float: left;
width: 100%;
position: relative;
/*min-height: 980px;*/
height: auto;
padding: 120px 0px;
}
.project-description{
float: left;
width: 100%;
position: relative;
}
.project-description h4{
font-size: 45px;
line-height: 50px;
font-weight: 500;
color: #fff;
text-align: left;
margin-bottom: 40px; 
}
.project-description p{
font-size: 20px;
line-height: 30px;
color: #fff;
text-align: justify;
margin-bottom: 40px;
}
.topsearch{
float: left;
width: 100%;
background: #fff5e8;
min-height: 200px;
padding: 65px 0px;
}
.tags{
float: left;
width: 100%;
display: flex;
flex-direction: row;
justify-content: flex-start;
flex-wrap: wrap;
align-items: center;
}
.tags span{
font-size: 14px;
line-height: 36px;
padding: 0px 15px;
border-radius: 100px;
background: rgba(0, 0, 0, 0.5);
color: #fff;
margin-right: 10px;
text-transform: uppercase;
}

/*=============================*/
#careerbanner{
float: left;
width: 100%;
position: relative;
/*background: url(../images/office-820390_1920.png) no-repeat;*/
background: #41295a;  /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #2F0743, #41295a);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #2F0743, #41295a); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

background-size: cover;
height: 70vh;
background-attachment: fixed;
background-position: center;
}
.careerhero{
max-width: 990px;
width: 100%;
position: relative;
z-index: 99;
margin: 0 auto;
height: 70vh;
display: flex;
flex-direction: column;
text-align: center;
justify-content: center;
}

.careerhero h1.quotetext{
font-size: 3rem;
line-height: 70px;
color: #fff;
width: 100%;
margin-bottom: 10px;
}
.careerhero p{
font-size: 24px;
line-height: 36px;
color: #fff;
width: 100%;
padding: 0px 80px	
}
.accordion-button{
width: auto;
}
.accordion-header {
margin-bottom: 0;
display: flex;
flex-direction: row;
justify-content: space-between;
width: 100%;
padding: 15px;
}
#vision-mission{
float: left;
width: 100%;
position: relative;
padding: 140px 0px;
background: #f5f5f5;
}
.ourvision{
float: left;
padding-left: 100px;
width: 100%;
position: relative;
}
#vision-mission h2 {
font-size: 42px;
font-weight: 600;
}
#aboutbg{
float: left;
width: 100%;
padding: 140px 0px 100px;
position: relative;
}
.aboutbgback{
background: url(../images/aboutbg.png) no-repeat;   
position: absolute;
bottom: 0px;
right: 0px;
width: 1200px;
height: 100%;
background-position: bottom -34px right -37px;
background-size: contain;
transform: translatey(0px);
-webkit-animation: float 6s ease-in-out infinite;
animation: float 6s ease-in-out infinite;
}
.aboutoclock{
float: left;
width: 100%;
/* text-align: justify; */
font-size: 20px;
line-height: 32px;
margin-bottom: 18px;
position: relative;
/*    font-family: 'Chakra Petch', sans-serif;*/
}
.aboutintro p{
font-size: 22px;
line-height: 40px;
}
.ourvision .watermark{
position: relative;
font-size: 3.5rem;
line-height: 90px;
top: -50%;
opacity: 0.9;
}
.ourvision p{
font-size: 21px;
line-height: 40px;
color: #000;
width: 100%;
position: relative;
text-align: justify;
}
.ourvision p span{
position: absolute;
top: 25px;
left: -80px;
width: 60px;
height: 2px;
background: #FF7342;
display: block;
}
#leaders{
float: left;
width: 100%;
background: #401955;
background: -webkit-linear-gradient(to right, #2F1647, #301648, #3F2059, #401955);
background: linear-gradient(to right, #2F1647, #301648, #3F2059, #401955);
position: relative;
padding: 120px 0px 0px;
}
#leaders h2{
font-size: 2.063rem;
color: #fff;
line-height: 33px;
text-transform: uppercase;
text-align: center;
/*font-family: 'Chakra Petch', sans-serif;*/


}
.leaderimg, .leaderMsg{
float: left;
width: 100%;
position: relative;
}
.leaderimg img{
width: 100%;
float: left;
margin-bottom: -10px;
}
.leaderMsg{
padding-right: 150px;
}
.leaderMsg p{
font-size: 1.8rem;
line-height: 65px;
color: #fff;
position: relative;
z-index: 99;
}
.quoteMark{
position: absolute;
z-index: 0;
opacity: 0.2;
top: -70px;
left: -70px;
}
#ourMotto{
float: left;
width: 100%;
position: relative;
padding: 140px 0px;
}
.motoInto{
float: left;
width: 1005;
}
.motoInto p{
font-size: 24px;
line-height: 36px;
color: #000;
text-align: left;
margin-bottom: 40px;
}
.mototitle{
float: left;
width: 49.8%;
min-height: 457px;
margin-bottom: 5px;
background-size: cover;
position: relative;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.mototitle h3{
font-size: 68px;
line-height: 76px;
text-align: center;
color: #fff;
text-transform: uppercase;
}
.mototitle h3 span{
display: block;
font-size: 26px;
line-height: 34px;
margin-top: 10px;
}
#career-join{
float: left;
width: 100%;
position: relative;
background: url(../images/OCSTeam.png)no-repeat;
background-size: cover;
min-height: 600px;
height: auto;
background-position: center;
}
#career-join .overlay{
background: rgb(255 245 232 / 90%);
position: absolute;
top: 0px;
left: 0px;
height: 100%;
width: 100%;
z-index: 9;
-webkit-transition: all 0.3s ease-in-out 0s;
-moz-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s;
}

.join-content{
position: relative;
float: left;
width: 100%;
z-index: 99;
min-height: 600px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
-webkit-transition: all 0.3s ease-in-out 0s;
-moz-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s;
}
#career-join:hover .overlay{
	opacity: 0;
	-webkit-transition: all 0.3s ease-in-out 0s;
-moz-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s;
}
#career-join:hover .join-content .jointext{
	opacity: 0;
	-webkit-transition: all 0.3s ease-in-out 0s;
-moz-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s;
}
.join-content h4{
font-size: 48px;
line-height: 60px;
color: #000;
/* font-family: 'Chakra Petch', sans-serif; */
font-weight: bold;
margin-bottom: 20px;
text-align: center;
}
.join-content h4 span{
display: block;
}
.join-content p{
font-size: 28px;
line-height: 42px;
color: #000;
margin-bottom: 40px;
padding-right: 160px;
text-align: center;
}
.join-content .btn-orange{
	margin-top: 60px;
	position: absolute;
	left: 50%;
	bottom: 40px;
	-webkit-transform: translateX(-50%);
	-moz-	transform: translateX(-50%);
	transform: translateX(-50%);
}
#current-openings{
float: left;
width: 100%;
position: relative;
padding: 140px 0px;
}
#current-openings h4{
text-align: center;
font-size: 48px;
color: #000;
line-height: 60px;
text-transform: capitalize;
font-weight: bold;
margin-bottom: 40px;
}
.accordion-button::after{
display: none;
}
.accordion-header{
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.job-description p{
font-size: 20px;
line-height: 26px;
}
.accordion-header h5{
font-size: 1.5rem;
line-height: 40px;
color: #000;
text-transform: uppercase;
font-weight: bold;
width: 35%;
}
.accordion-button img{
width: 40px;
}
.accordion-body{
padding: 40px 60px;
background: #FBFBFB;
margin-bottom: 40px;
}
.accordion-body h6{
font-size: 1.2rem;
text-transform: uppercase;
font-weight: 800;
color: #000;
margin-bottom: 10px;
}
.accordion-body ul{
padding-left: 25px;
margin-bottom: 30px;
}
.accordion-body ul li{
display: list-item;
font-size: 20px;
line-height: 40px;
list-style: disc;
list-style-position: inside;
}
.accordion-body .btn-orange{
min-width: 260px;
width: 260px;
}
#hireus{
float: left;
width: 100%;
position: relative;
background: #f4f4f4;
padding: 140px 0px;
}
.hireus-content{
float: left;
width: 100%;
}
.hireus-content h5{
font-size: 48px;
line-height: 60px;
max-width: 840px;
width: 100%;
color: #000;
font-weight: bold;
/* font-family: 'Chakra Petch', sans-serif; */
margin-bottom: 30px;
}
.hireus-content p{
font-size: 24px;
line-height: 36px;
margin-bottom: 40px;
}
.hireus-content h6{
font-size: 22px;
line-height: 32px;
width: 100%;
color: #fc7241;
text-align: left;
font-weight: 600;
}
.hireus-content ul{
padding-left:70px;
width: 100%;
margin-top: 50px;
position: relative;
}
.hireus-content ul li{
display: list-item;
font-size: 24px;
line-height: 42px;
margin-bottom: 40px;
position: relative;
}
.hireus-content ul li div{
height: 1px;
width: 0;
position: absolute;
left: -60px;
top: 18px;
background: #000000;
transition: all 0.3s ease 0s;
}
.hireus-content ul li a{
color: #401955;
}
.hireus-content ul li:hover a{
color: #FF7342;
}
.hireus-content ul li:hover div{
width: 50px;
transition: all 0.3s ease 0s;
}
.apply{
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
margin-top: 50px;
}
.divide{
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
font-weight: bold;
margin-bottom: 50px;
}
.divide span{
width: 36px;
height: 2px;
display: block;
background: #000000;
margin: 0px 5px;
}
/*===========================================*/
#solutionsbanner{
float: left;
width: 100%;
position: relative;
/*background: url(../images/services.jpg) no-repeat;*/
background: #41295a;  /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #2F0743, #41295a);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #2F0743, #41295a); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

background-size: cover;
height: 70vh;
background-attachment: fixed;
background-position: center;
}
/*#solutionsbanner .banner-part{
left: 0px;
background: url(../images/solutions.jpg) no-repeat;
background-size: 100% 100%;
}*/

.solution-part{
max-width: 1200px;
width: 100%;
margin: 0 auto;
position: relative;
z-index: 999;
text-align: center;
height: 70vh;
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
}
.solution-part h1{
margin-bottom: 15px;
color: #fff;
}
.solution-part p {
font-size: 24px;
line-height: 36px;
color: #fff;
max-width: 770px;
}
#industryweserve{
float: left;
width: 100%;
position: relative;
padding: 140px 0px;
}
.inductrycontent{
float: left;
width: 100%;
}
.inductrycontent h2{
font-size: 3.375rem;
line-height: 85px;
/*font-family: 'Chakra Petch', sans-serif;*/
font-weight: 600;
color: #000;
text-align: center;
text-transform: capitalize;
margin-bottom: 50px;
}
.inductrycontent h2 span{
max-width: 840px;
padding: 0px 30px;
margin: 0 auto;
display: block;
font-size: 22px;
line-height: 34px;
color: #000;
font-weight: normal;
text-transform:none;
/*font-family: 'Chakra Petch', sans-serif;*/
}
.inductrycontent ul{
width: 100%;
max-width: 1080px;
margin: 0 auto;
}
.inductrycontent ul li{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 25%;
float: left;
min-height: 100px;
text-align: center;
margin: 30px 0px;
}
.inductrycontent ul li span{
margin-top: 15px;
display: block;
}

#ethical{
float: left;
width: 100%;
padding: 140px 0px;
background: url(../images/startup-ge3ff0c173_1920.png) no-repeat;
background-size: cover;
position: relative;
}
#ethical .overlay{
position: absolute;
top: 0px;
left: 0px;
background-image: linear-gradient(316deg, #cdc1ff 0%, #e5d9f2 74%);
background-image: -webkit-linear-gradient(316deg, #cdc1ff 0%, #e5d9f2 74%);
width: 100%;
height: 100%;
z-index: 9;
opacity: 0.9;
}
.ethical-content{
position: relative;
z-index: 99;
}
.ethical-content h3{
font-size: 48px;
line-height: 66px;
color: #000;
width: 100%;
padding-right: 150px;
margin-bottom: 80px;	
}
.borderbx{
border: 2px solid #fff;
min-height: 326px;
padding: 34px;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: flex-start;
height: auto;
background: #fff;
border-radius: 12px;
}
.borderbx img{
filter: invert(7%) sepia(80%) saturate(3058%) hue-rotate(271deg) brightness(96%) contrast(91%);
}
.borderbx p{
font-size: 21px;
line-height: 32px;
padding-right: 50px;
color: #000;
font-weight: 500;
}
.ethical-content .btn-orange{
margin-top: 100px;
}
#worktalking{
float: left;
width: 100%;
position: relative;
padding: 140px 0px;
}
#worktalking h4{
font-size: 58px;
line-height: 76px;
margin-bottom: 40px;
color: #000;
/* font-family: 'Chakra Petch', sans-serif; */
font-weight: 600;
color: #000;
letter-spacing: 0;
}
.projectsdeatils, .projectimg{
float: left;
width: 100%;
}
.projectsdeatils{
margin-bottom: 25px;
}
.projectimg{
min-height: 742px;
height: auto;
text-align: center;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.projectinfo{
float: left;
width: 100%;
background: #FBF7E5;
padding: 68px 73px;
}
.projectinfo .projectName{
display: flex;
width: 100%;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin-bottom: 40px;
}
.projectinfo p{
font-size: 20px;
line-height: 34px;
color: #000;

}
.projectinfo .projectName > h5{
line-height: 62px;
font-weight: 500 !important;
color: #000;
font-size: 42px;
width: 60%;
}
.projectName .tags{
justify-content: flex-end;
}
#worktalking .details{
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center ;
margin-top: 68px;
}
.detail-tags{
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center ;	
}
.detail-tags > h5{
font-size: 24px;
font-weight: bold;
line-height: 44px;
margin-right: 100px;
}
.detail-tags > h5 span{
font-size: 16px;
line-height: 25px;
font-weight: 300;
display: block;
text-align: left;
}
/*==============================*/
#servicesbanner,
#product-main-banner,
#hire-developers-banner{
float: left;
width: 100%;
position: relative;
/*background: url(../images/services.jpg) no-repeat;*/
background: #41295a;  /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #2F0743, #41295a);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #2F0743, #41295a); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
background-size: cover;
height: 70vh;
background-attachment: fixed;
background-position: center;
}
.servicecont{
max-width: 1024px;
width: 100%;
position: relative;
z-index: 99;
margin: 0 auto;
height: 70vh;
display: flex;
flex-direction: column;
text-align: center;
justify-content: center;
}
.servicecont h1{
color: #fff;
margin-bottom: 10px;
}
.servicecont p{
font-size: 24px;
line-height: 36px;
color: #fff;
}
.servicelist{
float: left;
width: 100%;
/*min-height: 980px;*/
padding: 90px 0px;
position: relative;
}
.water-text{
position: absolute;
bottom: 0px;
left: 0;
color: rgba(0, 0, 0, 0.05);
font-size: 99px;
color: #000;
/*font-family: 'Chakra Petch', sans-serif;*/
letter-spacing: 1px;
text-transform: uppercase;
line-height: 110px;
width: 100%;
text-align: center;
}
.serviceimg, .service-content, .whatdo, .features, .stack{
float: left;
width: 100%;
}
.serviceimg img{
height: 530px;
}
.techlist{
margin-top: 15px;
}
/*.whatdo, .stack{
margin-bottom: 40px;
}*/
.features{
margin-bottom: 10px;
}
.bg-grey{
background: #EFEFEF;
}
.stack{
float: left;
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
flex-wrap: wrap;
}
.stack li{
margin-right: 20px;
}
.service-content .title{
font-size: 1.4rem;
line-height: 24px;
color: #FF7342;
text-transform: uppercase;
font-weight: 500;
margin-bottom: 16px;
}
.whatdo p{
font-size: 24px;
line-height: 42px;
color: #000;
font-weight: 500;
}
.featuresbox{
background: #FFFFFF 0% 0% no-repeat padding-box;
box-shadow: 0px 3px 26px #0000000d;
width: 350px;
min-height: 120px;
height: auto;
font: 22px/32px GT Walsheim;
letter-spacing: 1.2px;
font-weight: 500;
color: #000;
color: #000000;
padding: 30px;
margin-bottom: 19px;
}
#dedicateddevs{
float: left;
width: 100%;
position: relative;
background: #F1F1F1;
padding: 140px 0px;
}
.dedicated-contents{
float: left;
width: 100%;
margin-bottom: 70px;
}
.dedicated-contents h4{
text-transform: uppercase;
margin-bottom: 16px;
}
.dedicated-contents p{
font-size: 1.5rem;
line-height: 35px;
padding-right: 150px;
}
#dedicateddevs .scollprocess{
margin-bottom: 100px;
}
#dedicateddevs .scollprocess .quotetext{
font-weight: 400 !important;
font-size: 2.75rem;
font-family: 'WEB Regular';
max-width: 530px;
padding-right: 65px;
margin-bottom: 0px;
}
#dedicateddevs .procescardslist li {
min-height: 513px;
margin: 0px 16px;
}
#dedicateddevs .procescardslist li .number{
color: #FF7342;
}
#dedicateddevs .procescardslist li .content h5 {
font-size: 1.75rem;
color: #FF7342;
line-height: 42px;
font-weight: 500;
font-family: 'WEB Regular';
max-width: 100%; 
margin-bottom: 32px;
}
.btn-sec{
float: left;
width: 100%;
display: flex;
justify-content: center;
}
.clientprefer{
float: left;
width: 100%;
position: relative;
padding: 140px 0px;
background: url(../images/preferus.png) no-repeat;
background-size: cover;
}
.client-content{
position: relative;
float: left;
width: 100%;
text-align: center;
z-index: 99;
}
.client-content h5{
color: #fff;
margin-bottom: 45px;
}
.reasons{
float: left;
width: 100%;
display: flex;
flex-direction: row;
justify-content: center;
}
.borderbox{
max-width: 290px;
width: 100%;
min-height: 360px;
height: auto;
border: 2px solid #fff;
padding: 20px;
margin: 0px 5px;
text-align: left;
}
.borderbox h6{
font-size: 1.4rem;
line-height: 32px;
color: #fff;
font-weight: bold;
margin-bottom: 15px;
min-height: 64px;
}
.borderbox p{
font-size: 1.125rem;
line-height: 28px;
color: #fff;
}
#contact .form-floating{
float: left;
width: 100%;
margin-bottom: 40px;
}
.form-control, .form-select{
background-color: transparent;
border: 0px;
border-bottom: 1px solid #707070;
border-radius: 0px;
height: 60px;
padding: 6px 15px;
}
.form-control:focus, .form-select:focus{
background-color: transparent; 
box-shadow: none;
border-color:#ff7342;
}
.form-btn{
display: flex;
flex-direction: column;
justify-content: flex-end;
align-items: flex-end;
}
.form-floating > label{
color: #000;
font-size: 16px;
}
.form-control{
color: #000 !important;
font-size: 24px;
}
#formcareer .form-control{
color: #000;
}
.form-control:focus{
color: #fff;  
box-shadow: none;
}
#formcareer{
float: left;
width: 100%;
min-height: 100vh;
height: auto;
}
.sec-left{
float: left;
height: 100vh;
width: 30%;
background: url(../images/office-820390_1920.png) no-repeat;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.sec-left h1{
color: #fff;
padding: 0px 50px;
}
.form-section{
float: left;
width: 70%;
height: 100vh;
padding: 74px 130px;
overflow-y: scroll;
}

.form-section h2{
margin-bottom: 50px;
}
.form-section .form-floating{
margin-bottom: 50px;
}
.form-section  .form-floating > label{
color: #434343 ;
}
input[type="file"] {
display: none;
}
.custom-file-upload {
border-radius: 100px;
text-align: center;
line-height: 50px;
display: inline-block;
padding: 0px 12px;
cursor: pointer;
color: #fff;
font-weight: 500;
background: #FF7342;
width: 168px;
height: 50px;
}
.upload{
height: 50px;
background: #F5F2F2;
max-width: 550px;
width: 100%;
display: block;
border-radius: 100px;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
padding-right: 25px;
}
.upload span{
font-size: 12px;
}
.thankyosection{
float: left;
width: 70%;
height: 100vh;
padding: 74px 130px;
position: relative;
}
.thankyosection h3{
font-size: 28px;
line-height: 52px;
color: #000;
font-weight: 300;
margin-bottom: 100px;
}
.thankyosection h3 span{
font-weight: bold;
}
.thankyosection h4{
font-size: 28px;
line-height: 52px;
color: #000;
font-weight: 300;
margin-bottom: 60px;
}
.thankyosection p{
margin-bottom: 20px;
}
.thankyosection p span{
color: #FF7342;
font-size: 24px;
line-height: 41px;
display: block;
}
.thankyosection p a{
color: #000;
font-size: 24px;
line-height: 41px;
display: block;
font-weight: bold;
text-decoration: underline;
}
.accordion-button:not(.collapsed){
color: inherit;
background-color: transparent;
box-shadow: none;
}
.inductrycontent ul li a{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
color: #000;
-webkit-transition: all 0.3s ease-in-out 0s;
-moz-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s;       
}
.inductrycontent ul li a i{
display: inline-block;
width: 70px;
height: 70px;
position: absolute;
height: 70px;
border-radius: 100px;
background: #fff5e8;
opacity: 0.2;
top: -15px;
}
.inductrycontent ul li a:hover i{
width: 70px;
height: 70px;
opacity: 0.8;
transform: scale(1.2);
-webkit-transition: all 0.3s ease-in-out 0s;
-moz-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s;
}
.inductrycontent ul li a:hover img{
transform: scale(1.3);
-webkit-transition: all 0.3s ease-in-out 0s;
-moz-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s;    
}
.d-content{
float: left;
width: 100%;
background: #FFFFFF;
min-height: 390px;
height: auto;
padding: 44px 34px;
border-radius: 10px;
margin-bottom: 44px;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: flex-start;
box-shadow: 0px 3px 35px #0000000f;
}
.d-content p{
font-size: 28px;
line-height: 42px;
margin-bottom: 10px;
text-transform: uppercase;  
font-weight: 700;
color: #FF7342;
}
.d-content span{
font-size: 18px;
line-height: 26px;
color: #250d33;
}
.procescardslist{
float: left;
width: 100%;
background: #FFFFFF;
min-height: 280px;
height: auto;
padding: 44px 34px 30px;
border-radius: 10px;
margin-bottom: 44px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
box-shadow: 0px 3px 35px #0000000f;
}
.procescardslist img{
filter: invert(12%) sepia(27%) saturate(3632%) hue-rotate(255deg) brightness(108%) contrast(100%);
width: 78px;
}
.procescardslist p{
font-size: 24px;
line-height: 34px;
text-transform: uppercase;
font-weight: 600;
min-height: 84px;
text-align: center;
margin-top: 40px;
}

.navbar .btn-orange{
min-width: 180px;
font-size: 15px;
height: 50px;
}
.video-container{
position: absolute;
top: 0px;
left: 0px;
width: 100%;
overflow: hidden;
height: 100vh;
}
#my-scrollbar {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
.testimonial-section .quotetext{
margin-bottom: 35px;
position: relative;
z-index: 99;
}
.testimonial-section {
position: relative;
padding-top: 130px;
padding-bottom: 80px;
overflow: hidden;
float: left;
width: 100%;
}
.testimonial-section:before {
position: absolute;
left: -200px;
top: 22%;
/*background-image: url(../images/ring-circle.png);*/
background-repeat: no-repeat;
background-position: center;
width: 701px;
height: 756px;
content: "";
-webkit-animation: fa-spin 25s infinite alternate;
animation: fa-spin 25s infinite alternate;
}
.testimonial-section .testimonial-carousel {
position: relative;
max-width: 1100px;
margin: 0 -50px;
}

.testimonial-block {
position: relative;
padding: 50px;
}
.testimonial-block .inner-box {
padding: 60px 80px;
background-color: #ffffff;
box-shadow: 0 0 50px rgba(226, 222, 232, 0.75);
border-radius: 30px;
}
.testimonial-block .text {
position: relative;
display: block;
font-size: 20px;
line-height: 32px;
color: #282331;
font-weight: 400;
margin-bottom: 50px;
}
.testimonial-block .info-box {
position: relative;
padding-left: 115px;
padding-top: 10px;
}
.testimonial-block .info-box .thumb {
position: absolute;
left: 0;
top: 0;
height: 82px;
width: 82px;
}
.testimonial-block .info-box .thumb img {
border: 6px solid #e5e6fa;
border-radius: 50%;
overflow: hidden;
display: block;
width: 100%;
box-shadow: 0 45px 45px rgba(147, 147, 147, 0.35);
}
.testimonial-block .info-box .name {
position: relative;
display: block;
font-size: 21px;
line-height: 1.2em;
color: #382c4d;
font-weight: 700;
margin-bottom: 10px;
}
.testimonial-block .info-box .designation {
position: relative;
display: block;
font-size: 16px;
line-height: 24px;
color: #8053f7;
font-weight: 400;
}

.testimonial-carousel .owl-nav {
position: absolute;
right: 75px;
bottom: 100px;
display: flex;

}
.testimonial-carousel .owl-next, .testimonial-carousel .owl-prev {
position: relative;
display: flex;
height: 75px;
width: 75px;
line-height: 82px;
text-align: center;
border-radius: 50%;
background-color: #ffffff;
transition: all 300ms ease;
align-items: center;
justify-content: center;
margin: 0px 10px;
}
.testimonial-carousel .owl-next:hover, .testimonial-carousel .owl-prev:hover {
background-color: #FF7342;
box-shadow: 0 24px 24px rgba(187, 187, 187, 0.75);
}

.arrow-right, .arrow-left {
position: relative;
display: inline-block;
height: 19px;
width: 43px;
background-image: url(../images/arrow-left-solid.svg);
background-repeat: no-repeat;
background-position: center;
opacity: 0.2;
}

.arrow-right {
background-image: url(../images/arrow-right-solid.svg);
}
.testimonial-carousel .owl-next:hover .arrow-right, .testimonial-carousel .owl-prev:hover .arrow-left{
opacity: 1;
filter: invert(1);
}
.testimonial-section .thumb-layer {
position: absolute;
right: 30px;
top: 20px;
}
.testimonial-section .thumb-layer .image {
position: relative;
margin-right: 0;
}
.testimonial-section .thumb-layer .image img {
display: inline-block;
max-width: 100%;
height: auto;
}

@media only screen and (max-width: 767px) {
.testimonial-section .sec-title {
margin-bottom: 50px;
}

.testimonial-block {
padding: 0;
}
.testimonial-block .inner-box {
box-shadow: none;
border: 2px solid #f1f1f1;
}

.testimonial-carousel .owl-nav {
position: relative;
left: 0;
bottom: 0;
margin-top: 20px;
text-align: center;
}
.testimonial-carousel .owl-next, .testimonial-carousel .owl-prev {
border: 2px solid #f1f1f1;
}
}
@media only screen and (max-width: 1366px) {
.large-container {
padding-left: 20px;
padding-right: 20px;
}
}
.form-captcha{
float: left;
width: 100%;
}
.form-captcha img{
height: 100px;
}
@media (min-width: 1600px){
.container{
max-width: 1440px;
}
}
#servicelist .titletext{
margin-bottom: 25px;
}

.overlay{
background: rgba(0, 0, 0, 0.2);
/*opacity: 1;
background: #401955;
background: -webkit-linear-gradient(to right, #2F1647, #301648, #3F2059, #401955);
background: linear-gradient(to right, #2F1647, #301648, #3F2059, #401955); */
position: absolute;
top: 0px;
width: 100%;
height: 100%;
}
#servicesbanner .navbar-brand img{
filter: invert(1);
}
.activites{
float: left;
width: 100%;
text-align: left;
padding: 50px 0px;
}
.activites .title{
font-size: 26px;
line-height: 48px;
font-weight: 800;
/*font-family: 'Chakra Petch', sans-serif;*/
}
.activites p{
font-size: 26px;
line-height: 42px;
color: #250d33;
font-weight: 500;
}

.service-content h2{
font-size: 34px;
line-height: 54px;
margin-bottom: 15px;
font-weight: 600;
/*font-family: 'Chakra Petch', sans-serif;*/
}
.service-content{
margin-bottom: 40px;
}
.service-content p{
font-size: 20px;
line-height: 34px;
color: #250d33;
}
.service-content ul{margin-top: 20px;background: #fff5e8; display: inline-block; padding: 20px; border-radius: 10px; margin-bottom: 20px;}
.service-content li{display: flex; align-items: center; font-size: 18px; color: #250d33; margin: 5px 0px; font-weight: bold;}
.service-content li i{margin-right: 8px;}
.box-grey{
float: left;
width: 100%;
background: #f9f9f9;
border-radius: 12px;
padding: 12px 35px;
margin-bottom: 25px;
box-shadow: 0px 3px 15px #51316729;
min-height: 100px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.box-grey img{
width: 34px;
margin:15px;
display: none;
}
.box-grey h4{
font-size: 18px;
line-height: 32px;
font-weight: 600;
text-align: center;
}
.techstack{
background: #f8f8f8;
width: 100%;
float: left;
padding: 30px;
border-radius: 30px;
margin-top: 50px;
}
.techstack h3{
font-size: 22px;
font-weight: 600;
line-height: 32px;
margin-bottom: 20px;
}

.clientprefer .overlay{
opacity: 0.9;
background: #401955;
background: -webkit-linear-gradient(to right, #2F1647, #301648, #3F2059, #401955);
background: linear-gradient(to right, #2F1647, #301648, #3F2059, #401955); 
position: absolute;
top: 0px;
width: 100%;
height: 100%;    
}
.bggrey{
background: #f9f9f9;
}
.bggrey .box-grey{
background: #fff;
}
.bggrey .bg-secondary{
background: #f9f9f9  !important;
}
.dedicatedDev .box-grey img{
display: block;
width: 54px;
}
.dedicatedDev .box-grey span{
display: block;
padding: 0px 20px;
text-align: center;
}
.dedicatedDev .box-grey h4{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.dev-weoffer{
float: left;
width: 100%;
}
.dev-weoffer h5{
font-size: 22px;
text-align: center;
margin-bottom: 30px;
font-weight: 700;
color: #ff662e;
}
.dev-weoffer h4{
float: left;
width: 100%;
font-size: 1.75rem;
font-weight: 600;
margin-bottom: 25px;
}
.techlist .bg-secondary{
background: #fff5e8 !important;
border-radius: 10px;
padding: 15px 15px;
color: #000;
font-size: 16px;
margin:0px 20px 20px 0px;
font-weight: 500;
transition: all 0.3s ease-in-out 0s;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
font-family: 'Chakra Petch', sans-serif;
text-transform: capitalize;
}
.techlist .bg-secondary:hover,
.techlist .bg-secondary:focus{
background: #f7ead9 !important;	
transition: all 0.3s ease-in-out 0s;
}

.borderbox ul li{
font-size: 1.125rem;
line-height: 24px;
margin-bottom: 15px;
color: #fff;
list-style: disc;
/* list-style-position: inside; */
margin-left: 17px;
}




#policybanner{
float: left;
width: 100%;
position: relative;
background: #41295a;
background: -webkit-linear-gradient(to right, #2F0743, #41295a);
background: linear-gradient(to right, #2F0743, #41295a);
height: 40vh;
}
.cont-term-privacy{
height: 20vh;
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.cont-term-privacy .quotetext{
margin-bottom: 0px;
color: #fff;
}
#policybanner .navbar-brand{
filter: invert(1);
}
#policybanner .navbar-expand-lg .navbar-nav .nav-link{
color: #fff;
}
.termsofuse, .privacypolicy{
float: left;
width: 100%;
padding: 50px 0px;
background: #f5f5f6;
}
.policycontent{
float: left;
width: 100%;
margin-bottom: 20px;
}
.policycontent p{
font-size: 19px;
line-height: 26px;
color: #000;
margin-bottom: 20px;
}
h5.title{
font-size: 22px;
line-height: 29px;
color: #000;
font-weight: 800;
margin-bottom: 15px;
/*    font-family: 'Chakra Petch', sans-serif;*/


}
.policycontent p span{
font-weight: 600;
}
.policycontent ul{
padding-left: 40px;
margin-bottom: 25px;
}
.policycontent ul li{
font-size: 18px;
line-height: 28px;
list-style: disc;
color: #000;   
}
.privacypolicy .container, .termsofuse .container{
max-width: 980px;
margin: 0 auto;
}
.lastupdate{
font-size: 19px;
font-weight: 600;
}
.form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-control-plaintext ~ label, .form-floating > .form-select ~ label{
opacity: 1;
transform: scale(0.85) translateY(-1.2rem) translateX(0.15rem);
background: #FFF5E8;
height: auto;
}
.circle{
width: 7px;
height: 7px;
background: #FF7342;
display: inline-block;
border-radius: 100px;
margin-left: 3px;
transition: all 0.3s linear 0s;
}
.nav-link:hover .circle{
width: 22px;  
transition: all 0.3s linear 0s; 
}
.navbar-expand-lg .navbar-nav .nav-link.active span{
color: #FF7342;   
}
.nav-link.active .circle{
width: 22px;  
transition: all 0.3s linear 0s; 
}
.footer-menu li a .circle{
width: 12px;
height: 12px;
background: #FF7342;
display: inline-block;
border-radius: 100px;
margin-left: 5px;
transition: all 0.3s linear 0s;
}
.footer-menu li a:hover .circle{
width: 32px;  
transition: all 0.3s linear 0s;   
}

.techskill-icon{
position: relative;
}
.techskill-icon::before{
content: "";
position: absolute;
height: 140%;
width: 15%;
top: -80px;
left: -13px;
background: rgb(47,21,71);
background: linear-gradient(90deg, rgba(47,21,71,1) 0%, rgba(255,255,255,0) 100%);
z-index: 99;
}
.techskill-icon::after{
content: "";
position: absolute;
height: 140%;
width: 15%;
top: -80px;
right: -13px;
background: rgb(64,25,85);
background: linear-gradient(-90deg, rgba(64,25,85,1) 0%, rgba(255,255,255,0) 100%);
z-index: 99;
}
.skillsrowodd, .skillsroweven{
width: 780px;
display: flex;
gap: 30px;
}
.skillsrowodd .item, .skillsroweven .item{
margin-bottom: 30px;
}
.skillsrowodd .item img, .skillsroweven .item img{
height: 90px;
}
@keyframes scroll{
0% {transform: translateX(0);}
100% {transform: translatex(-780px)}
}
.skillsrowodd, .skillsroweven{
animation: scroll 60s linear infinite;
}
.skillsroweven{
padding-left: 40px;
}
.deskview{
display: block;
}
.mobilview{
display: none;
}
.navbar-toggler{
z-index: 999;
}
.navbar-toggler label{
display:flex;
flex-direction:column;
width:38px;
cursor:pointer;
}

.navbar-toggler label span{
background: #000;
border-radius:10px;
height: 3px;
margin: 2px 0;
transition: .4s  cubic-bezier(0.68, -0.6, 0.32, 1.6);

}


.navbar-toggler span:nth-of-type(1){
width:42%;

}

.navbar-toggler span:nth-of-type(2){
width:78%;
}


.navbar-toggler span:nth-of-type(3){
width:55%;

}


.navbar-toggler input[type="checkbox"]{
display:none;
}


.navbar-toggler input[type="checkbox"]:checked ~ span:nth-of-type(1){
transform-origin: bottom;
transform: rotatez(45deg) translate(2px,0px);
}


.navbar-toggler input[type="checkbox"]:checked ~ span:nth-of-type(2){

transform-origin:top;
transform:rotatez(-45deg)
}


.navbar-toggler input[type="checkbox"]:checked ~ span:nth-of-type(3){

transform-origin: bottom;
width: 37%;
transform: translate(13px,-2px) rotatez(45deg);
}


.slider{
background-color: teal;
max-width: 100%;
color: #fff;
position: relative;
display: grid;

}

.slider .content_container{
padding: 40px;
}

.slider .slides{
overflow-y: hidden;
max-height: 450px;
scrollbar-width: none;
}

.slider .slides::-webkit-scrollbar{
display: none;
}

.slider .slides .slide{
min-height:440px;
display: flex;
}



/*.slider{
background-color: teal;
max-width: 100%;
color: #fff;
position: relative;
display: grid;

}

.slider .content_container{
padding: 40px;
}

.slider .slides{
overflow-y: auto;
max-height: 500px;
scrollbar-width: none;
}

.slider .slides::-webkit-scrollbar{
display: none;
}

.slider .slides .slide{
min-height: calc(100% - 80px);
display: flex;
padding: 40px;
color: #333;
align-items: center;
}
/*.slider .slides .slide:nth-child(even){
background-color: palegreen;
}*/


/** New Carousel :: START **/
@keyframes hide-scroll {
    0% { overflow: hidden; } 
    100% { overflow: auto; }
  }
  
  /* .container {
    width: 80%;
    height: 500px;
  } */
  
  /* .carousel {
    border: 8px solid rgb(212, 212, 212);
    border-radius: 8px;
  } */
  
  .carousel-inner, .carousel, .carousel-item, .carousel-container {
/*    height: 480px;*/
    height: auto;
    background-position: center center;
    background-size: cover;
/*    display: flex;*/
    display: block;
    flex-direction: row;
    justify-content: flex-start;
  }
  .carousel, .carousel-container{
    width: 100%;
  }
  .carousel-inner{
    width: 75%;
    float: right;
    padding-left: 0%;
  }
  .carousel-item{
    width: 100%;
    /* background-color: purple; */
  }
  
  .carousel-item-prev:not(.carousel-item-end), .active.carousel-item-start {
    transform: translate3d(0, -100%, 0);
    -webkit-transform: translate3d(0, -100%, 0);
    -moz-transform: translate3d(0, -100%, 0);
    -ms-transform: translate3d(0, -100%, 0);
    -o-transform: translate3d(0, -100%, 0);
  }
  
  .carousel-item-next:not(.carousel-item-start), .active.carousel-item-end {
    transform: translate3d(0, 100%, 0);
    -webkit-transform: translate3d(0, 100%, 0);
    -ms-transform: translate3d(0, 100%, 0);
    -moz-transform: translate3d(0, 100%, 0);
    -o-transform: translate3d(0, 100%, 0);
  }
  
  .carousel-indicators {
    position: relative;
    top: 0;
    margin: auto;
    height: 450px;
/*    height: auto;*/
    right: auto;
    left: 0px;
    display: flex;
    flex-direction: column;
  }
  
  .carousel-indicators [data-bs-target] {
    background: none;
    /* border: 2px solid white;
    border-radius: 12px;
    width: 12px;
    height: 12px; */
    margin-bottom: 5px;
    color:#FFF;
  }
  a:not([href]):not([class]) {
    color:#FFF;
  }
  .carousel-indicators [data-bs-target]:hover {
    color: #FFF !important;
    opacity: 0.8;
  }
  /* .carousel-indicators li {
    color: red;
  } */
  
  .carousel-indicators div.active {
    background: white;
    color: red;
    font-size: 16px;
  }
  
  .carousel-control-prev-icon {
    top: 5%;
  }
  
  .unclickable {
    pointer-events: none;
  }
  
  .clickable {
    pointer-events: all;
  }
  
  .btn-style {
    border-color: white;
    content: url("./images/GitHub-Mark-Light-120px-plus.png");
    width: calc(1.475rem + 2.7vw);
    position: absolute;
    bottom: 10px;
    right: 10px;
    padding: 4px;
  }
  
  .btn-style:hover {
    background-color: black;
    content: url("./images/GitHub-Mark-Light-120px-plus.png");
    width: calc(1.475rem + 2.7vw);
  }
  
  .img-style {
    width: calc(1.475rem + 2.7vw);
  }
  
  .img-style:hover {
    width: calc(1.475rem + 2.7vw);
  }
  
  .roll-in-blurred-right {
      -webkit-animation: roll-in-blurred-right 1s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
              animation: roll-in-blurred-right 1s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
  }
  /* ----------------------------------------------
   * Generated by Animista on 2022-2-15 0:50:8
   * Licensed under FreeBSD License.
   * See http://animista.net/license for more info. 
   * w: http://animista.net, t: @cssanimista
   * ---------------------------------------------- */
  
  /**
   * ----------------------------------------
   * animation roll-in-blurred-right
   * ----------------------------------------
   */
   @-webkit-keyframes roll-in-blurred-right {
    0% {
      -webkit-transform: translateX(1000px) rotate(720deg);
              transform: translateX(1000px) rotate(720deg);
      -webkit-filter: blur(50px);
              filter: blur(50px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateX(0) rotate(0deg);
              transform: translateX(0) rotate(0deg);
      -webkit-filter: blur(0);
              filter: blur(0);
      opacity: 1;
    }
  }
  @keyframes roll-in-blurred-right {
    0% {
      -webkit-transform: translateX(1000px) rotate(720deg);
              transform: translateX(1000px) rotate(720deg);
      -webkit-filter: blur(50px);
              filter: blur(50px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateX(0) rotate(0deg);
              transform: translateX(0) rotate(0deg);
      -webkit-filter: blur(0);
              filter: blur(0);
      opacity: 1;
    }
  }

  .swal2-confirm {
    background-color: #fff5e8!important;
    border: 1px solid #fff5e8!important;
    color: #000!important;
  }

  .form-control.is-invalid, .form-control.is-invalid:focus {
    box-shadow:none!important;
    background-image:none!important;
  }
  .new-loader {
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 99999;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
/** New Carousel :: END **/


/*13-02-2025 by Priyan*/
#productbanner .container{max-width: 1440px !important; width: 100% !important; margin: 0 auto !important;}
#productbanner .overlay{height: 95vh;}
#productbanner .pageWrap{width:100%;max-width:100%;position: relative; min-height: 95vh; background: url(../images/slider-bg.png) right top no-repeat #220a2f; margin-bottom: 80px;}
#productbanner .sliderOute{width:100%;max-width:100%;position:relative;line-height: 0px;}
#productbanner .slide{visibility:hidden;opacity:0;width:100%;position:absolute;transition:all 0.5s;display:inline-block;width:100%;}
#productbanner .slide.next{left:0%;}
#productbanner .slide.prev{left:0%;}
#productbanner .slide.active{visibility:visible;opacity:1;left:0;position:relative;}

.buttonwrapper{position: absolute; top: 50%; transform: translateY(-50%); width: 100%; font-size: 28px;}
.buttonwrapper .prev{left: 3%; position: absolute; color: #ffffff;}
.buttonwrapper .next{right: 3%; position: absolute; color: #ffffff;}
#productbanner .containerVideobg { background-color: #220a2f; position: absolute; top: 0px; left: 0px; z-index: -2; padding: 0 !important;overflow: hidden;}
#productbanner .videoSliderBackground{ margin: 0px; padding: 0px; width: 100%; height: 100%; min-width: 85vh; min-height: 85vh;}
#productbanner .videoSlider{ margin-left: auto; margin-right: auto; margin-top: 180px; width: 40%; transition: all 0.5s; border: 10px solid var(--primary); background-color: var(--primary); box-shadow: 0px 3px 6px rgba(0,0,0,0.3);}
#productbanner .elVideo{width: 100%; height: inherit;}
#productbanner .active .videoSlider{ margin-top: 0; width: 100%; border: none; box-shadow: none; height: 83vh;margin-top: 6%;}
#productbanner .banner-container{margin-top: 14% !important;}
#productbanner .banner-container h1{font-size: 42px; color: #ffffff; line-height: 55px;}
#productbanner .banner-container h1 span{font-weight: bold; font-size: 50px;}
#productbanner .banner-container p{font-size: 22px; color: #ffffff; line-height: 40px; opacity: 0.6; max-width: 740px; width: 100%;}
#productbanner .banner-container a,
#productbanner .banner-container a:hover,
#productbanner .banner-container a:focus{background: #FF7342; font-size: 24px; font-weight: 500;  padding: 15px 25px; border-radius: 30px; color: #ffffff; margin-top: 25px; display: inline-block;}

/*12-09-2025 by Priyan*/

.payment-solutions-banner h2{font-size: 24px; font-weight: bold; color: #ffffff; margin-top: 20px;}
.payment-solutions-banner ul{max-width: 740px; width: 100%; display: block; margin: 30px 0px; display: flex; flex-wrap: wrap;}
.payment-solutions-banner ul li{width: 21%; padding: 10px 20px; background: #ffffff; border-radius: 12px; margin: 0px 2% 2% 0px; align-items: center; display: flex;}
.payment-solutions-banner ul li img{width: 100%;}

.footer-bottom-outer{background: #f9f9f9; padding: 10px 0px;}


/*.why-asset{padding: 90px 0 0 0;}*/
.why-asset{overflow: hidden;}
.why-asset p{font-size: 20px; line-height: 36px; color: #250d33; margin-bottom: 20px;}
.why-asset img{width: 100%;}
.quotetext { font-size: 48px; line-height: 60px; color: #250d33; font-weight: 600; position: relative; margin-bottom: 20px;}

.ocs-products{padding: 80px 0px; float: left; width: 100%; border-bottom: 1px solid #F2F2F2;}
.ocs-products p{font-size: 20px; line-height: 36px; color: #250d33; margin-bottom: 20px;}
.ocs-products img{width: 100%;}

.benefits-of-asset{padding-top: 60px;}
.benefits-of-asset ul{margin: 0px 0px 0px 0px; padding: 0px; display: flex; flex-wrap: wrap;}
.benefits-of-asset ul li{display: inline-block; margin: 0px;padding: 30px; width: 25%;}
.benefits-of-asset ul li h3{font-size: 26px; line-height: 30px; color: #ffffff; font-weight: 500; margin: 15px 0px;}
.benefits-of-asset ul li p{margin: 0px;font-size: 16px; line-height: 24px; color: #ffffff;}
.color-1{background: #260636;}
.color-2{background: #330B47;}
.color-3{background: #3E1154;}
.color-4{background: #4B1565;}
.benefits-of-asset ul li .rfid-points{margin: 10px 0px 0px 0px;}
.benefits-of-asset ul li .rfid-points li{width: 100%; padding: 0px; display: flex;}
.benefits-of-asset ul li .rfid-points li i{margin-right: 10px; margin-top: 6px}
.benefits-of-asset ul li .rfid-points li p{color: #ffffff; font-weight: 500px;}

.spreedsheet-to-automation{padding: 80px 0px; position: relative;}
.spreedsheet-to-automation p{font-size: 20px; color: #250d33; margin: 15px auto 30px auto; display: block; line-height: 34px; max-width: 800px; width: 100%;}
.spreedsheet-to-automation ul,
.ocs-products ul{text-align: left; padding-left: 100px;}
.spreedsheet-to-automation ul li,
.ocs-products ul li{display: flex; font-size: 26px; color: #260636; margin-bottom: 20px; font-weight: 500;}
.spreedsheet-to-automation ul li i,
.ocs-products ul li i{margin-right: 10px;}
.spreedsheet-to-automation ul li span{font-weight: bold;}
.spreedsheet-to-automation img{max-width: 480px; width: 100%;}
.spreedsheet-to-automation:before{position: absolute; content: ''; left: 0; width: 30%; bottom: 3%; height: 600px; background: #4B1565; z-index: -1;border-radius: 0px 300px 300px 0px;}
.spreedsheet-to-automation:after{position: absolute; content: ''; right: 0; width: 100%; bottom: 16%; height: 360px; background: #FCF5FF; z-index: -2;}

.spreedsheet-to-automation.manual-processes-icafe{padding: 80px 0px 0px 0px;}
.spreedsheet-to-automation.manual-processes-icafe:before,
.spreedsheet-to-automation.manual-processes-icafe:after{display: none;}
.spreedsheet-to-automation.manual-processes-icafe ul{margin-top: 15px; display: flex;}
.spreedsheet-to-automation.manual-processes-icafe ul li{display: inline-block; margin-bottom: 0px; font-size: 22px; background: #f5f5f5; margin-right: 15px; padding: 15px; border-radius: 15px; width: 33%;}
.spreedsheet-to-automation.universal-gateway ul li{width:50%;}
.spreedsheet-to-automation.manual-processes-icafe ul li i{width: 20px; display: block; float: left;}
.spreedsheet-to-automation.manual-processes-icafe ul li p{margin: 5px auto 10px auto; font-size: 16px; line-height: 24px;}

.rfid-tracker{display: flex; margin-top: 80px;}
.rfid-tracker-left,
.icafe-pos-left{background: url(../images/rfid-tracker-bg.jpg) center center no-repeat #260636; background-size: cover; padding: 50px 70px; width: 50%;}
.icafe-pos-left{background: url(../images/icafe-pos-left.png) center center no-repeat #260636;}
.rfid-tracker-right{background: #260636; padding: 50px 70px; width: 50%;}
.rfid-tracker h2{color: #ffffff; font-size: 44px; line-height: 59px; font-weight: bold; margin-bottom: 30px;}
.rfid-tracker p{font-size: 20px; line-height: 30px; color: #ffffff; margin-bottom: 15px;}
.rfid-tracker.icafe-pos span{font-size: 16px; color: #ffffff;}
.rfid-tracker.icafe-pos h3{font-size: 20px; font-weight: bold; color: #ffffff; margin: 15px 0px 10px 0px;}
.rfid-tracker.icafe-pos ul{display: flex; margin-bottom: 20px;}
.rfid-tracker.icafe-pos ul li{background: #351d47;padding: 15px; border-radius: 15px; margin-right: 10px; width: 33%}
.rfid-tracker.icafe-pos ul li h4{font-size: 18px; font-weight: bold; color: #ffffff; margin-bottom: 10px;}
.rfid-tracker.icafe-pos ul li p{font-size: 14px; line-height: normal; margin: 0px 0px 0px 0px; opacity: 0.6;}

.management-solutions{padding: 80px 0px;}
.management-solutions p{max-width: 860px; width: 100%; margin: 20px auto 35px auto;font-size: 18px; color: #250d33; line-height: 30px;}
.management-solutions .card{background: #FFF5E8; border: none; border-radius: 30px; padding: 40px; height: 100%;}
.management-solutions .card .card-body{padding: 0px;}
.management-solutions .card img{width: fit-content;}
.management-solutions .card h4{font-size: 30px; line-height: 36px; color: #260636; font-weight: 500; margin-bottom: 15px; margin-top: 20px;}
.management-solutions .card h5{font-size: 22px; line-height: 30px; color: #262626; font-weight: 500; margin-bottom: 15px;}
.management-solutions .card p{font-size: 16px; line-height: 22px; color: #250d33; margin: 0px;}

.our-proven-process{padding: 80px 0px; background: #FCF5FF;}
.our-proven-process h2{max-width: 960px; width: 100%; margin: 0px auto 0px auto;}
.our-proven-process p{max-width: 960px; width: 100%; margin: 20px auto 50px auto;font-size: 20px; color: #250d33; line-height: 36px;}
.process-img{width: 100%; display: block; padding: 0px 100px;}
.process-img img{width: 100%;}
.process-img .col{position: relative; padding: 140px 0px 180px 0px;}
.process-img .col .content{position: absolute; bottom: 0px; left: 50%; transform: translateX(-50%); width: 430px;}
.process-img .col .content h4{font-size: 22px; font-weight: bold; line-height: 20px;}
.process-img .col .content p{font-size: 16px; font-weight: normal; line-height: 28px; margin-top: 10px;}
.process-img-mobile{display: none;}
.process-img .desktop-process2 .content,
.process-img .desktop-process4 .content{bottom: initial; top: 0px;}
.desktop-process1 h4{color: #C20A4C;}
.desktop-process2 h4{color: #F26100;}
.desktop-process3 h4{color: #16A69D;}
.desktop-process4 h4{color: #0E74F0;}
.desktop-process5 h4{color: #770A9E;}

.process-img .desktop-process3 .content{bottom: -30px;}

.faq{padding: 30px 0px 70px 0px; float: left; width: 100%;}
.faq .container{max-width: 1300px !important;}
.faq img{width: 100%; max-width: 574px;}
.faq .accordion-flush>.accordion-item{border: none;}
.faq .accordion-flush>.accordion-item>.accordion-header .accordion-button,
.faq .accordion-flush>.accordion-item>.accordion-header .accordion-button:focus,
.faq .accordion-flush>.accordion-item>.accordion-header .accordion-button.collapsed{background: #FF7342;font-size: 26px; color: #ffffff; font-weight: 500; border-radius: 16px; box-shadow: none; width: 100%;}
.faq.payment-gateway .accordion-flush>.accordion-item>.accordion-header .accordion-button,
.faq.payment-gateway .accordion-flush>.accordion-item>.accordion-header .accordion-button:focus,
.faq.payment-gateway .accordion-flush>.accordion-item>.accordion-header .accordion-button.collapsed{font-size:20px;}
.faq .accordion-header{margin-bottom: 10px; padding: 0px;}
.faq .accordion-flush>.accordion-item>.accordion-collapse{background: #FFF5E8 !important; border-radius: 20px; margin-bottom: 10px; border: none;}
.faq .accordion-body{font-size: 20px; line-height: 36px; color: #250D33; padding: 15px; background: transparent;margin: 0px;}
.faq.payment-gateway .accordion-body{font-size: 18px;}
.faq .accordion{padding-left: 20px;}
.faq .accordion-button::after{background: url(../images/plus.png) no-repeat; width: 30px; height: 30px; display: block !important;}
.faq .accordion-button:not(.collapsed)::after{background: url(../images/minus.png) no-repeat; width: 30px; height: 30px; display: block !important;}

.box {transform: translateX(-200%);transition: transform 0.8s ease-in;}
/*.box > img {transform: translateX(200%);}*/
.box.show { transform: translateX(0);}
.right-animation{transform: translateX(200%);}
.right-animation p{transform: translateX(0%);}

.ocs-products ul{padding: 0px;}
.ocs-products ul li{font-size: 22px; color: #FF7342;}
.ocs-products ul li i{width: auto;}

.servicecont.hire-developers{height: 55vh;max-width: none;}
#hire-developers-banner, #workbanner, .workhero{height: 62vh;}
.servicecont.hire-developers nav ol li a, .servicecont.hire-developers nav ol li.active{font-size: 14px; color: #ffffff;}
.servicecont.hire-developers nav ol li.active{opacity: 0.5;}
.servicecont.hire-developers h1{text-align: left;font-size: 48px;}
.hire-main-content{background: #FFF5E8; padding: 80px 0px 80px 0px; float: left; width: 100%; position: relative;border-radius: 0px 0px 0px 0px; margin-top: 0px;}
.hire-main-content h2{font-size: 48px;}
.hire-main-content p{font-size: 18px; color: #250d33; line-height: 32px; padding-right: 20px; margin-bottom: 10px;}
.hire-main-content a,
.engage-with-us a,
.engage-with-us a:hover,
.engage-with-us a:focus{display: inline-flex; background: #FF7342; color: #ffffff;}
.hire-main-content .container{position: relative;}
.hire-main-content .badge{position: absolute; width: 237px; height: 327px; top: -250px; right: 0; background: url(../images/badge.png) center center no-repeat; display: block; padding: 40px 20px;}
.hire-main-content .badge ul{display: flex; justify-content: center;}
.hire-main-content .badge ul li{margin: 0px 10px;}
.hire-main-content .badge ul li img{max-width: 90px; width: auto;}
.hire-main-content .badge span{font-size: 28px; line-height: 36px; color: #ffffff; display: block; text-wrap: auto; margin-top: 25px; font-weight: bold; padding: 0px 10px;word-wrap: break-word; white-space: wrap;}
.ocs-counter{display: block;}
.ocs-counter ul{position: relative;}
.ocs-counter ul li{background: #FFFAF3; box-shadow: 0px 0px 40px 0px rgba(255,115,66,0.2); padding: 48px; border-radius: 65px; text-align: center; width: 223px; display: inline-block;}
.ocs-counter ul li:first-child{margin-left: 80px; margin-bottom: 20px; margin-right: 20px; position: absolute;}
.ocs-counter ul li:nth-child(2){margin-top: 80px; margin-left: 330px; margin-bottom: 20px;}
.ocs-counter ul li:nth-child(3){margin-right: 20px; position: absolute; left: 0px; top: 260px;}
.ocs-counter ul li:nth-child(4){margin-left: 250px;}
.ocs-counter ul li span{font-size: 44px; color: #260636; font-weight: bold;}
.ocs-counter ul li p{font-size: 20px; line-height: 25px; margin-top: 15px; padding: 0px;}
.ocs-counter.counter-animation ul{margin: 15px 0px 25px 0px !important;}
.ocs-counter.counter-animation ul li span{position: relative; margin-left: -20px;}
.ocs-counter.counter-animation ul li span::before{position: absolute; right: -20px;  content: '+'; top: 0px; display: block; pointer-events: auto;}
.ocs-counter.theme-2 img{width: 100%; margin-top: 80px;}

.ocs-counter2.counter-animation ul{position: relative; margin: 20px 0px 0px 0px !important; max-width: 700px; width: 100%;text-align: left;}
.ocs-counter2 ul li{background: #351d47; box-shadow: none; padding: 15px 5px; border-radius: 15px; text-align: center; display: inline-block; width: 22%; margin-right: 10px;}
.ocs-counter2 ul li:first-child{margin-left: 0px; margin-bottom: 0px; margin-right: 10px; position: initial;}
.ocs-counter2 ul li:nth-child(2){margin-top: 0px; margin-left: 0px; margin-bottom: 0px;}
.ocs-counter2 ul li:nth-child(3){margin-right: 10px; position: initial; left: 0px; top: 0px;}
.ocs-counter2 ul li:nth-child(4){margin-left: 0px;}
.ocs-counter2 ul li span{font-size: 30px; color: #ffffff; font-weight: bold; position: initial;}
.ocs-counter2 ul li p{font-size: 16px !important; line-height: 25px !important; margin-top: 10px !important; padding: 0px; text-align: center !important;}
.ocs-counter2.counter-animation ul li::nth-child(2) span.percentage::before{position: absolute; right: -20px; content: '%'; top: 4px; display: block; pointer-events: auto;}



.applications{padding: 50px 0px; float: left; width: 100%;}
.applications .card{background: #FCF5FF; box-shadow: 0px 10px 0px 0px rgba(75,21,101,0.1);}
.applications .card img { width: fit-content; margin-left: -17px; margin-bottom: -10px; margin-top: -15px;}
.advantages-of-hiring,
.hiring-steps{float: left; width: 100%; padding-top: 0px;}
.advantages-of-hiring h2,
.hiring-steps h2{max-width: 1000px; margin: 0 auto 40px auto;}
.advantages-of-hiring-outer{display: flex; flex-wrap: wrap;}
.advantages-of-hiring-inner{width: 33.33%; display: inline-block; float: left; padding: 60px 40px; color: #ffffff; position: relative;}
.advantages-of-hiring-inner h4{font-size: 26px; font-weight: bold;}
.advantages-of-hiring-inner p{color: #ffffff; font-size: 18px; margin-bottom: 0px;}
.advantages-of-hiring-inner span{position: absolute; top: 50%; transform: translateY(-50%); right: 30px; font-size: 260px; opacity: 0.07; font-weight: bold;}

.engage-with-us{float: left; width: 100%; background: #FCF5FF; padding: 140px 0px; margin-bottom: 80px;}
.engage-with-us a{margin-top: 0px;}
.engage-with-us p {margin: 0px auto 30px auto;}

.hiring-steps{padding-bottom: 0px;}
.hiring-steps h2{margin: 0 auto 20px auto;}
.hiring-steps .card img{margin: 0 auto;}
.hiring-steps .card{background: transparent; text-align: center; padding: 12px; margin-bottom: 60px;}
.hiring-steps .card h4{font-size: 22px; font-weight: bold; margin-bottom: 5px;}
.steps-bg{position: absolute; top: 150px; left: 50%; transform: translateX(-50%);}
.steps-bg img{width: 100%;}
.hiring-steps .row.animatedParent{position: relative;}

.hire-developers-main .mx-auto{text-align: center;}
.hire-developers.top{text-align: left; margin-top: 80px;}
.hire-developers.top img{max-width: 406px; width: 100%;}
.hire-developers.top p{text-align: left; opacity: 0.6; max-width: 800px; width: 100%; font-size: 20px; line-height: normal; padding: 0px; font-weight: 200;}
.hire-developers.top .btn-orange, .hire-developers.top .btn-orange:hover,
#getquote-popup .btn-orange, #getquote-popup .btn-orange:hover,
.hire-main-content .btn-orange, .hire-main-content .btn-orange:hover{background: #FF7342; width: fit-content; color: #ffffff; margin-top: 25px;}
.hire-main-content.hire-developers-main{margin-top: 0px; border-radius: 0px; padding: 80px 0px;}
.hire-main-content.hire-developers-main .ocs-counter ul{text-align: center; margin-top: 50px;}
.hire-main-content.hire-developers-main .ocs-counter ul li{position: initial; margin: 0 10px 20px 10px;}
.role ul{justify-content: center; border: none; margin-bottom: 30px;}
.role ul li{margin: 0px 10px 10px 10px;}
.role ul li button, .role ul li button.active, .role ul li button:focus{border: none !important; background: #F1F1F1 !important;margin: 0px !important; border-radius: 30px !important; color: #260636;}
.role ul li button.active, .role ul li button:hover{background: #260636 !important; color: #ffffff !important;}
.role .card{padding: 20px; text-align: center;}
.role .card h4{font-size: 26px;}
.role .card span{background: #ffffff; border-radius: 30px; display: inline-block; display: flex; margin: 0 auto; width: 100px; height: 100px; -webkit-box-shadow: 0px 0px 12px 1px rgba(194, 72, 255, 0.14); -moz-box-shadow: 0px 0px 12px 1px rgba(194, 72, 255, 0.14); box-shadow: 0px 0px 12px 1px rgba(194, 72, 255, 0.14); align-items: center;}
.role .card img{max-width: 55px; width: 100%; filter: invert(80%) sepia(20%) saturate(1000%) hue-rotate(246deg) brightness(102%) contrast(143%); margin: 0 auto; height: fit-content;}
.role .card a, .role .card a:hover{background: #907D9A; color: #ffffff; border-radius: 30px; margin-top: 15px; display: inline-block; padding: 0px 16px; line-height: 40px; position: relative; z-index: 999;}

.typewriter-outer{width: min-content !important;}
.typewriter {
  border-right: 1px solid lightblue;
  white-space: nowrap;
  overflow: hidden;
  animation: typingAnimation 3s steps(20, end),  /* The 26 here should equal
                                                            * the amount of characters, spaces included */
             blinkAnimation 1s step-end;
}

@keyframes typingAnimation {
  0% {
    width: 0;
  }
  20%, 100% {
    width: 100%;
  }
}

@keyframes blinkAnimation {
  from, to {
    border-color: transparent;
  }
  50% {
    border-color: lightblue;
  }
}

#getquote-popup{z-index: 9999 !important;}
#getquote-popup .modal-dialog{max-width: 800px; width: 100%; }
#getquote-popup .modal-content{background: #FFFFFF;border: none; border-radius: 20px; padding: 10px 20px;}
#getquote-popup h1{font-weight: bold; color: #401955; font-size: 28px;}
#getquote-popup .modal-header{padding-bottom: 0px;}
#getquote-popup .modal-header,
#getquote-popup .modal-footer{border: none;}
#getquote-popup .modal-footer button, #getquote-popup .modal-footer button:hover, #getquote-popup .modal-footer button:focus{margin-top: 0px;}
#getquote-popup .form-label{width: 100%; font-weight: bold; color: #401955; font-size: 14px;}
#getquote-popup .modal-body input,
#getquote-popup .modal-body select,
#getquote-popup .modal-body textarea{border-radius: 5px; font-size: 14px !important; line-height: 19px; padding: 10px 35px 10px 18px !important; border: 1px solid #d9d9d9 !important; width: 100%; font-weight: 500; height: auto;}
#getquote-popup .modal-body input.is-invalid{border: 1px solid #dc3545 !important;}
.upload-file label{width: 100%; text-align: center; cursor: pointer; padding: 20px; border-width: 1px; border-style: dashed; border-color: rgb(255, 115, 66); border-image: initial; border-radius: 14px;}
.quote-quick-contact{width: 100%; margin: 10px 0px 30px 0px;}
.quote-quick-contact ul{display: block;}
.quote-quick-contact ul li{display: inline; margin: 0px 10px 0px 0px;}
.quote-quick-contact ul li a{color: #401955;background: transparent !important; text-decoration: underline; text-underline-position: under; font-size: 14px;margin: 0px;}
.quote-quick-contact ul li a i{margin-right: 5px;}

.hire-developers.top ol.breadcrumb{margin: 0px 0px 20px 0px;}
.blog-post{float: left; width: 100%;}
.blog-category ul{display: block; text-align: center; margin-top: 50px;}
.blog-category ul li{display: inline;margin: 0px 10px;}
.blog-category ul li a, .blog-category ul li a:hover, .blog-category ul li a:focus{padding: 10px 20px; background: #F1F1F1 !important; margin: 0px; border-radius: 30px; font-size: 18px; color: #401955;}
.blog-category ul li a:hover, .blog-category ul li a:focus{background: #401955 !important; color: #ffffff;}
.blog-post .card{border: none;}
.blog-post h4.card-title{font-weight: bold; font-size: 22px; color: #401955;}
.blog-post h2{}
.blog-post p{color: #250d33;}

.trusted-customers{padding-bottom: 0px;}
.customer-logos ul{display: flex; flex-wrap: wrap; flex-wrap: wrap; justify-content: center;}
.customer-logos ul li{width: 19%; background: #f5f5f5; padding: 15px 10px; border-radius: 15px; margin: 5px; text-align: center;}
.customer-logos ul li h4{font-weight: bold; margin-top: 10px;}
.customer-logos img{width: 100%;}

.faq .accordion-body ul{margin: 10px 0px 10px 0px;padding: 0px;}
.faq .accordion-body ul li{ font-size: 20px;}

.tab-pane a.link-new,
.tab-pane a.link-new:hover,
.tab-pane a.link-new:focus{display: block; background: transparent; padding: 0px; margin: 0px;}
.ocs-products .btn-orange { width: fit-content;}

.hire-main-content .badge .prestashop-icon img{max-width: 55px;width: 100%;}
.footer-bottom, .footer-bottom h6{font-size: 10px; text-align: center; display: inline-block;}
.footer-bottom h6{text-decoration: underline;}

#it-solutions{padding: 80px 0px 80px; border-bottom: 1px solid #DEDEDE; float: left; width: 100%;}
#it-solutions h1, #it-solutions h3{font-size: 40px;  line-height: normal; color: #250d33; font-weight: 600; position: relative; margin-bottom: 20px;}
#it-solutions h3{font-size: 28px;}
#it-solutions p{font-size: 16px; color: #260636; line-height: 26px; max-width: 1100px; margin: 0 auto 15px; auto; width: 100%; background: #f7f7f7; padding: 15px 20px; border-radius: 15px;}
#it-solutions p span{color: #FF7E00; font-weight: bold;}
#it-solutions i img{width: 100%;}
#it-solutions h4{font-size: 22px; font-weight: bold; color: #250d33; margin-bottom: 15px;}
#it-solutions ul{display: block;}
#it-solutions ul li{list-style-type: none; margin-bottom: 15px; font-size: 16px; color: #250d33; line-height: 26px; font-weight: normal;}
#it-solutions ul li span{font-weight: bold; color: #FF7E00;}
.it-solutions-content img{width: 60px !important; display: block; margin-bottom: 8px;}

.affix {top: 20px;}
.nav-stacked{position: sticky; top: 150px; display: block;}
.nav-stacked li{}
.nav-stacked li a,
.nav-stacked li a.nav-link-new.active,
.nav-stacked li a.nav-link-new:hover,
.nav-stacked li a.nav-link-new:not(.active):focus{font-size: 24px; color: #260636; font-weight: 500; padding: 24px 0px; border-bottom: 1px solid #DEDEDE; opacity: 0.5; margin: 0px;border-radius: 0px !important;display: block;}
.nav-stacked li a.nav-link-new.active,
.nav-stacked li a.nav-link-new:hover,
.nav-stacked li a.nav-link-new:focus{opacity: 1; border-bottom: 1px solid #FF7342; background: transparent;color: #260636; border-radius: 0px; font-weight: bold;}
.nav-stacked li.more-services{opacity: 1;border: none;padding: 20px 0px;}
.nav-stacked li.more-services a{color: #FF7342;text-decoration: underline; border: none; opacity: 1;}
#section1, #section2, #section3, #section4, #section5, #section6{position: relative; min-height: 350px; border: 1px solid #FFD6C6; padding: 30px; background: #FFF9F3; background: linear-gradient(90deg,rgba(255, 249, 243, 1) 10%, rgba(255, 255, 255, 1) 100%); border-radius: 30px; margin-bottom: 30px; overflow: hidden;}
.nav-stacked-right{display: block; }
.nav-stacked-right h4{font-size: 28px; font-weight: bold; color: #250D33; margin-bottom: 15px;}
.nav-stacked-right p{font-size: 17px; line-height: 30px; color: #250D33;}
.nav-stacked-right ul{float: left; margin-top: 20px; margin-right: 20px;}
.nav-stacked-right ul li{display: flex; align-items: center; margin-bottom: 15px; color: #250D33;}
.nav-stacked-right ul li i{margin-right: 10px; width: 16px;}
.nav-stacked-right ul li i img{width: 100%;}
.nav-stacked-img{position: absolute; right: 15px; bottom: 10px; width: 200px;}
.nav-stacked-img img{width: 100%;}

.portfolio-new-main .container{max-width: 1220px; width: 100%;}
.portfolio-new ul{justify-content: center; border: none; margin-bottom: 30px;}
.portfolio-new ul li{margin: 0px 5px 10px 5px;}
.portfolio-new ul li button, .portfolio-new ul li button.active, .portfolio-new ul li button:focus{border: none !important; background: #F1F1F1 !important;margin: 0px !important; border-radius: 30px !important; color: #260636; padding: 10px 25px;}
.portfolio-new ul li button.active, .portfolio-new ul li button:hover{background: #260636 !important; color: #ffffff !important;}
.portfolio-new .portfolio-images{position: relative; border-radius: 20px; overflow: hidden;}
.portfolio-new .portfolio-images img{width: 100%;}
.portfolio-new .portfolio-images .portfolio-details{position: absolute; width: 100%; height: 100%; bottom: 0px;background: #ffffff;background: linear-gradient(0deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 30%, rgba(255, 255, 255, 0) 100%); padding: 20px; opacity: 0; text-align: center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s;}
.portfolio-new .portfolio-images:hover .portfolio-details{display: block;opacity: 1; -webkit-transition: all 0.3s ease 0s;-moz-transition: all 0.3s ease 0s;-ms-transition: all 0.3s ease 0s;transition: all 0.3s ease 0s;}
.portfolio-new .portfolio-images .portfolio-details span{font-size: 26px; font-weight: bold; color: #260636; display: block; margin-top: 64%;}
.portfolio-details ul{display: block; text-align: center;margin-top: 10px;}
.portfolio-details ul li{display: inline-block;}
.portfolio-details ul li a{width: 46px; height: 46px; background: #E9E5EA;color: #260636;border-radius: 46px; display: flex;align-items: center; justify-content: center; font-size: 22px;}

.accelerate-your-goals{background: linear-gradient(to right, #2F1647, #301648, #3F2059, #401955); float:left; width:100%; padding:80px 0px;}
.accelerate-your-goals h1{color:#ffffff;}
.accelerate-your-goals p{color:#ffffff; font-size:18px;}
.accelerate-your-goals a{background: #FF7342; color:#ffffff;}

.dream-team{float:left; width:100%;padding:80px 0px;}
.dream-team p{max-width: 860px; width: 100%;margin: 20px auto 0px auto;font-size: 18px;color: #250d33;line-height: 30px;}
.dream-team .feature-card{background: white; border-radius: 16px; padding: 40px 30px; box-shadow: 0 5px 20px rgba(0,0,0,0.08); border: 1px solid #e5e7eb; transition: all 0.3s ease; height: 100%;}
.dream-team .feature-icon { background: #fff5e8;color: #260636; width: 70px;height: 70px; border-radius: 50%; display: flex;align-items: center;justify-content:center;margin-bottom: 24px; font-size: 24px;}
.dream-team .feature-card h4{font-size:26px;color: #260636;}
.stats-section{float:left; width:100%;padding:80px 0px; background:linear-gradient(to right, #2F0743, #41295a)}
.stats-section p{font-size:18px; color: #260636;}
.stat-item{background:rgba(255, 255, 255, 0.1); padding:30px 15px; border-radius:16px;box-shadow:0 5px 20px rgb(0 0 0 / 14%);}
.stat-number{font-size: 36px; font-weight:700; color: #ffffff; margin-bottom:20px;}
.stat-label{font-size: 18px; color: #ffffff !important;opacity:0.6;}
.why-our-developer{background: #ffffff; padding:80px 0px; float:left; width:100%;}
.why-our-developer p{font-size:18px; max-width:800px; width:100%; margin:0px auto; line-height:normal;}
.why-our-developer h5{color:#260636;}
.feature-card { background: white; border-radius: 16px; padding: 40px 30px; box-shadow: 0 5px 20px rgba(0,0,0,0.08); transition: all 0.3s ease; height: 100%;}
.feature-card:hover { transform: translateY(-8px); box-shadow: 0 20px 40px rgba(0,0,0,0.15);}
.feature-icon { background: #fff5e8; color: #260636; width: 70px; height: 70px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-bottom: 24px; font-size: 24px;}

#recentprojects{float:left; width:100%;}

.current-job li span{color: #212529 !important;}
.current-job li span:hover{color: #fc7241 !important;}