Viewing File: /home/ubuntu/bytecollar-landing-ui/assets/css/default.css
@import url('https://fonts.googleapis.com/css2?family=Karla:wght@200;300;400;500;600;700;800&display=swap');
@-webkit-viewport {
width: device-width;
}
@-moz-viewport {
width: device-width;
}
@-ms-viewport {
width: device-width;
}
@-o-viewport {
width: device-width;
}
@viewport {
width: device-width;
}
:root {
--primary-color: #858685;
--secondary-color: #ffffff;
--tertiary-color: #161512;
--quaternary-color: #020E1A;
--quinary-color: #858685;
--senary-color: #ffce53;
--btn-color: linear-gradient(96deg, #F129CA 8.68%, #ED764F 92.63%);
}
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-transition: 0.25s ease;
transition: 0.25s ease;
overflow-x: hidden;
position: relative;
font-family: 'Karla', sans-serif!important;
color: var(--tertiary-color);
background-color: var(--secondary-color);
font-size: 16px!important;
letter-spacing: 0.8px;
scroll-behavior: smooth;
}
img {
width: auto;
display: block;
max-width: 100%;
height: auto;
}
a {
text-decoration: none !important;
}
.spacing-4 {
padding: 4em 0;
}
.spacing-left-3 {
padding-left: 3em;
}
.spacing-left-4 {
padding-left: 4em;
}
.spacing-left-5 {
padding-left: 5em;
}
.spacing-right-3 {
padding-right: 3em;
}
.spacing-right-4 {
padding-right: 4em;
}
.spacing-right-5 {
padding-right: 5em;
}
.mb-space-1 {
margin-bottom: 1em;
}
.mb-space-1-5 {
margin-bottom: 1.5em;
}
.mb-space-2 {
margin-bottom: 2em;
}
.mb-space-4 {
margin-bottom: 4em;
}
.title-card h2 {
font-size: 2em;
font-weight: 700;
color: var(--tertiary-color);
margin-bottom: 0.5em
}
.title-card h3 {
font-size: 1.5em;
font-weight: 600;
color: var(--tertiary-color);
margin-bottom: 0.5em
}
.title-card h4 {
font-size: 1.2em;
font-weight: 600;
color: var(--tertiary-color);
margin-bottom: 0.5em
}
.title-card h4 {
font-size: 1em;
font-weight: 600;
color: var(--tertiary-color);
margin-bottom: 0.5em
}
.title-card p {
font-size: 0.95em;
font-weight: 400;
color: var(--primary-color);
line-height: 1.8;
max-width: 900px;
margin: 0 auto;
}
.list-unstyled {
margin-bottom: 0em !important;
}
.hidden {
display: none !important;
transition: all 3s ease;
}
.arrow-up {
position: fixed;
right: 4%;
z-index: 99;
bottom: 10%;
background: var(--btn-color);
border: none;
width: 3.5em;
height: 3.5em;
border-radius: 50%;
display: inline-block;
}
/* Pages CSS */
/* button */
.default-btn {
display: inline-block;
background: var(--btn-color) !important;
color: var(--secondary-color);
position: relative;
text-decoration: none;
padding: 1em 2em;
font-size: 1em;
font-weight: 600;
text-align: center;
border: none !important;
box-shadow: 3px 3px var(--secondary-color);
border-radius: 12px;
transition: all 1.5s ease;
display: inline-flex;
align-items: center;
gap: 0.5em;
}
.btn-default-sec {
margin-top: 1.5em;
}
.default-outline-btn {
background-color: transparent!important;
border: 1px solid var(--quaternary-color)!important;
position: relative;
padding: 1em 2em;
font-size: 1em;
font-weight: 600;
text-align: center;
box-shadow: 3px 3px var(--secondary-color);
border-radius: 12px;
transition: all 1.5s ease;
display: inline-flex;
justify-content: center;
align-items: center;
gap: 0.5em;
color: var(--quaternary-color)!important;
text-decoration: none!important;
text-align: center;
margin-left: 0.5em;
}
.default-outline-btn:active, .default-outline-btn:focus, .default-outline-btn:hover {
background-color: transparent!important;
color: var(--quaternary-color)!important;
text-decoration: none!important;
}
/* .default-btn svg {
opacity: 0;
transition: all .42s cubic-bezier(0.25, 0.8, 0.68, 1.1);
} */
.default-btn:hover svg {
opacity: 1;
transform: translate(4px);
animation: arrowani 1s infinite;
}
.default-btn:hover {
border-radius: 0px;
color: var(--secondary-color);
}
@keyframes arrowani {
0% {
transform: translate(0px);
}
50% {
transform: translate(4px);
}
100% {
transform: translate(0px);
}
}
/* header */
.moblie-nav {
display: none;
}
.header-nav-center .navbar {
padding-top: 1rem !important;
backdrop-filter: blur(10px);
padding-bottom: 1rem !important;
}
.header-fixed {
position: fixed !important;
top: 0;
right: 0;
left: 0;
z-index: 1030;
background: #000000; /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #434343, #000000); /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #434343, #000000); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.header-nav-center {
padding: 0em 0;
background-color: transparent;
/* box-shadow: 0px 3px 7px rgba(7, 10, 24, 0.06); */
position: relative;
}
.header-nav-center .navbar .nav-item .nav-link {
font-size: 1em;
font-weight: 700;
text-transform: capitalize;
color: var(--secondary-color);
opacity: 0.8;
letter-spacing: 0.5px;
padding: 0.5em 0.5em;
position: relative;
transition: transform 0.5s;
}
.header-nav-center .navbar .nav-item .nav-link.active{
opacity: 1;
}
.header-nav-center .navbar .nav-item .nav-link:hover{
opacity: 1;
}
.header-nav-center .navbar .navbar-nav {
gap: 2em;
align-items: center;
width: 100%;
justify-content: flex-end;
}
.header-nav-center .navbar-collapse {
/* flex-grow: 0!important; */
}
.logo-head {
width: 7em;
height: auto;
object-fit: contain;
}
/* .header-nav-center .navbar-brand,
.header-nav-center .collapse {
background-color: #33333387;
border-radius: 50px;
padding: 1em 2em;
} */
.hero-wrapped {
width: 100%;
position: relative;
height: 100vh;
background-image: url("../images/banner/banner-main.png");
background-repeat: no-repeat;
background-position: bottom;
background-size: cover;
}
.my-teams-wrapped .header-nav-center {
/* background: #ff00cc;
background: -webkit-linear-gradient(to right, #333399, #ff00cc);
background: linear-gradient(to right, #333399, #ff00cc); */
}
.banner-wrapped {
min-height: calc(100vh - 100px);
display: flex;
align-items: center;
justify-content: center;
}
.banner-content{
padding-top: 2em;
}
.banner-content h1{
font-size: 2.8em;
margin: 0;
line-height: 1.2;
font-weight: 700;
color: var(--secondary-color);
}
.banner-content p{
font-size: 1em;
line-height: 1.8;
font-weight: 400;
margin: 1em 0;
/* color: var(--primary-color); */
color: var(--secondary-color);
opacity: .7;
}
.banner-img-sec{
text-align: center;
}
.banner-img{
max-width: 25em;
margin: auto;
width: 100%;
}
.banner-info-area .banner-note {
font-size: 1em;
font-weight: 500;
color: var(--secondary-color);
line-height: 1.8;
margin-bottom: 0em;
}
.banner-info-area .banner-description {
font-size: 1.1em;
font-weight: 500;
color: var(--secondary-color);
line-height: 1.8;
margin-bottom: 1em;
}
/* Mobile-Nav */
.menu-moblie {
width: 2em;
height: 2em;
object-fit: contain;
}
.moblie-nav .navbar-toggler:focus {
box-shadow: unset !important;
}
.moblie-nav .offcanvas {
background: linear-gradient(325deg, #430EEF 16.25%, #6505B0 71.23%);
}
.moblie-nav .nav-link {
font-size: 1em;
font-weight: 700;
}
.moblie-nav .fixed-top {
/* backdrop-filter: blur(10px); */
}
.moblie-nav {
background: #ff00cc;
background: -webkit-linear-gradient(to right, #333399, #ff00cc);
background: linear-gradient(to right, #333399, #ff00cc);
}
/* Client section */
.client-img {
width: 9em;
height: 9em;
object-fit: contain;
}
.client-sec {
position: relative;
}
.client-sec #customize-controls .prev,
.client-sec #customize-controls .next {
width: 3em;
height: 3em;
background: #fff;
border: 1px solid #efefef;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
z-index: 999;
}
.client-item {
text-align: center;
}
.client-sec #customize-controls .next {
right: 0%;
bottom: 35%;
}
.client-sec #customize-controls .prev {
left: 0%;
bottom: 35%;
}
/* Tech Section */
.tech-main-sec{
display: none;
}
.tech-area-wrapped {
width: 100%;
height: 100%;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
}
.tech-area-uiux-bg {
background-image: url("../images/tech-field/background/uiux-bg.png");
}
.tech-area-web-bg {
background-image: url("../images/tech-field/background/web-bg.png");
}
.tech-area-app-bg {
background-image: url("../images/tech-field/background/app-bg.png");
}
.tech-area-marketing-bg {
background-image: url("../images/tech-field/background/marketing-bg.png");
}
.tech-title {
padding-bottom: 4em;
}
.tech-title h3 {
background-color: var(--secondary-color);
margin-bottom: 0em;
font-size: 1.4em;
font-weight: 700;
padding: 1em 2em;
border-radius: 50px;
display: inline-block;
}
.uiux-color {
color: #79B883;
}
.web-color {
color: #63AEB7;
}
.app-color {
color: #020E1A;
}
.tech-info-sec ul li {
margin-bottom: 2em;
}
.tech-info-sec ul li:last-child {
margin-bottom: 0em;
}
.tech-full-wrap {
display: grid;
grid-template-columns: 60px auto;
align-items: start;
}
.tech-full-info-sec h4 {
font-size: 1.2em;
font-weight: 700;
margin-bottom: 0.3em;
color: var(--quaternary-color);
}
.tech-full-info-sec p {
font-size: 0.9em;
font-weight: 400;
margin-bottom: 0em;
color: var(--quinary-color);
line-height: 1.8;
}
.tech-image {
width: 22em;
/* margin: 0 auto; */
height: 100%;
object-fit: contain;
}
.served-card-wrapped {
display: flex;
align-items: center;
gap: 1em;
padding-bottom: 1em;
}
.served-main-section {
padding-top: 2em;
}
.served-main-section .served-card-wrapped:last-child {
padding-bottom: 0em;
}
.served-sec-img{
/* width: 3em; */
height: 5em;
object-fit: contain;
}
.served-card-info-wrapped {
width: 100%;
height: 100%;
border: 1px solid #efefef;
border-radius: 12px;
overflow: hidden;
background-color: var(--secondary-color);
display: flex;
align-items: flex-start;
flex-direction: column;
padding: 2em;
/* justify-content:center; */
overflow: hidden;
position: relative;
transition: all 0.5s ease;
}
.served-card-info-wrapped:hover {
box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}
/* .served-card-info-wrapped:hover {
flex: 2 1;
} */
.served-card-info h3 {
color: var(--tertiary-color);
font-size: 1.2em;
font-weight: 700;
margin-bottom: 0.5em;
margin-top: 1em;
}
.served-card-info p {
color: var(--quinary-color);
font-size: 0.9em;
font-weight: 400;
margin-bottom: 0em;
line-height: 1.8;
}
/* We Offer Best start */
.offer-best-main-wrapped {
/* background: linear-gradient(90deg, #3B13A0 1.98%, #190131 99.9%); */
background-image: url("../images/object/industry-served-bg.png");
background-position: left center;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-size: cover;
}
.offer-image {
width: 22em;
height: 100%;
object-fit: contain;
}
.offer-best-info-sec h3 {
font-size: 1.4em;
font-weight: 700;
color: #fff;
line-height: 1.5;
}
.offer-best-info-sec p {
color: rgba(255, 255, 255, 0.60);
font-size: 1em;
font-weight: 500;
line-height: 1.8;
margin-bottom: 0em;
}
.our-offer-wraped-area {
position: relative;
}
.byte-offer {
margin: 0;
position: absolute;
top: 50%;
left: 50%;
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%) !important;
width: 5em;
height: 5em;
object-fit: contain;
transition: all 1s ease;
}
/* our working start */
.our-working-wrapped {
background-image: url("../images/object/linear-back-imgae.png");
background-position: center center;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-size: cover;
}
.our-offer-img-sec {
position: relative;
}
#offer-bar {
position: absolute;
z-index: 99;
top: -100px;
animation: BarAnimation 3s infinite ease;
}
.our-offer-card {
background-color: var(--secondary-color);
background-position: 0 0, 0 0;
border-radius: 12px;
padding: 2em;
width: 100%;
height: 100%;
transition: all 0.5s ease-in-out;
transform-style: preserve-3d;
}
/* .our-offer-card:hover{
transform: rotate3d(0.5, 1, 0, 30deg);
background-position: -100px 100px, -100px 100px;
} */
.our-offer-card-info{
transform: translate3d(0px, 0px, 30px);
transition: all 0.5s ease-in-out;
}
/*
.our-offer-card .our-offer-card-info:hover{
transform: translate3d(0px, 0px, 60px);
}
.our-offer-card .our-offer-card-icon:hover{
transform: translate3d(0px, 0px, 60px);
} */
.our-offer-card-icon {
text-align: center;
background-color: #fff;
width: 5em;
height: 5em;
display: flex;
justify-content: center;
align-items: center;
border-radius: 50%;
padding:10px;
transition: all 0.5s ease-in-out;
transform: translate3d(0px, 0px, 20px);
transform-style: preserve-3d;
/* box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; */
}
.our-offer-card-icon img {
width: 100%;
height: 100%;
}
.our-offer-card-info h3 {
font-size: 1.2em;
font-weight: 700;
color: var(--tertiary-color);
margin-bottom: 0.5em;
margin-top: 1em;
transform: translate3d(0px, 0px, 50px);
}
.our-offer-card-info p {
margin-bottom: 0em;
color: var(--quinary-color);
font-size: 0.95em;
font-weight: 400;
line-height: 1.7;
}
.our-offer-card:hover .our-offer-card-icon {
box-shadow: rgba(17, 17, 26, 0.05) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px;
}
.our-offer-info-card {
display: grid;
grid-template-columns: repeat(2, 1fr);
align-items: center;
gap: 1.5em;
}
.our-work-image {
width: 28em;
height: 100%;
object-fit: contain;
}
/* Technology start */
.tech-info-content-one {
margin-bottom: 1em;
}
.tech-info-content-one h3 {
font-size: 1.4em;
font-weight: 700;
color: var(--quaternary-color);
margin-bottom: 0.3em;
}
.tech-info-content-one p {
font-size: 1em;
font-weight: 400;
color: var(--quinary-color);
margin-bottom: 0em;
line-height: 1.8;
}
.tech-info-content-two h4 {
font-size: 1.2em;
font-weight: 600;
color: var(--quaternary-color);
margin-bottom: 0.3em;
}
.tech-list ul {
margin-top: 1em;
}
.tech-list ul li {
padding-bottom: 0.5em;
}
.tech-info-content-two .tech-list ul li {
padding-bottom: 0.5em;
display: flex;
align-items: center;
gap: 0.5em;
}
.tech-list ul li span ,.tech-content-two-info{
font-size: 0.95em;
font-weight: 400;
color: var(--quinary-color);
margin-bottom: 0em;
line-height: 1.8;
}
.tech-ful-img {
object-fit: contain;
margin-left: auto;
}
.tech-we-work-wrapped {
background-image: url("../images/tech/tech-bg.png");
width: 100%;
height: 100%;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
}
.tech-we-work-wrapped .carousel-control-next-icon,
.tech-we-work-wrapped .carousel-control-prev-icon {
background-image: none;
margin-top: 4px;
margin-left: 1px;
}
.tech-we-work-wrapped .carousel-control-next {
right: unset !important;
}
.tech-we-work-wrapped .carousel-control-next {
top: unset !important;
bottom: 0;
left: 54px !important;
width: 3em !important;
background: transparent;
height: 3em !important;
border-radius: 50%;
border: 1px solid #8B8B8B;
}
.tech-we-work-wrapped .carousel-control-prev {
top: unset !important;
bottom: 0;
left: 0px !important;
width: 3em !important;
background: transparent;
height: 3em !important;
border-radius: 50%;
border: 1px solid #8B8B8B;
}
.tech-list{
margin-bottom: 0;
}
.pointer-icon{
width: 1.3em;
height: 1.3em;
transform: rotate(45deg)!important;
}
/* Technology end */
/* Testimonial start */
.testimonial-wrapped {
position: relative;
}
.user-image-sec {
width: 7em;
height: 7em;
/* overflow: hidden; */
border-radius: 50%;
position: relative;
z-index: 1;
/* padding: 2em; */
}
.user-image-sec img {
width: 100%;
border-radius: 50%;
}
.user-image-sec::after {
position: absolute;
content: ' ';
z-index: -1;
/* inset: 0; */
display: inline-block;
background-image: url("../images/object/plant.svg");
background-size: cover;
background-repeat: no-repeat;
bottom: 10%;
top: 0;
left: 0;
right: 0;
width: 100%;
transform: translate(-40px, 52px);
height: 100%;
}
.tesi-card-image-sec {
margin-top: 3em;
margin-bottom: 2em;
}
.testi-wrap-card {
background-color: #fff;
border-radius: 12px;
overflow: hidden;
/* box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; */
/* padding: 2em; */
text-align: center;
background-image: url("../images/testimonial/testi-back.png");
background-size: contain;
background-repeat: no-repeat;
background-position: top center;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 1em;
border: 1px solid #efefef;
}
.tesi-card-info-sec {
padding: 2em;
}
.tesi-card-info-sec p {
font-size: 0.95em;
font-weight: 400;
color: var(--quinary-color);
line-height: 1.6;
}
.tesi-card-info-sec h3 {
font-size: 1.4em;
font-weight: 600;
margin-bottom: 0;
color: var(--quaternary-color);
}
.testimonial-wrapped #testi-customize-controls .prev,
.testimonial-wrapped #testi-customize-controls .next {
width: 3em;
height: 3em;
background: #fff;
border: 1px solid #efefef;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
}
.testimonial-wrapped #testi-customize-controls .next {
/* left: 0; */
right: 2%;
bottom: 35%;
}
.testimonial-wrapped #testi-customize-controls .prev {
left: 2%;
/* right: 2%; */
bottom: 35%;
}
/* Faq Section */
.faq-area-sec .accordion-button:not(.collapsed) {
color: #683BD7;
background-color: var(--secondary-color) !important;
box-shadow: unset !important;
}
.faq-area-sec .accordion-button:not(.collapsed)::after {
background-image: url("../images/object/collapse.svg") !important;
transform: scale(1) !important;
margin-top: 10px;
}
.faq-area-sec .accordion-button::after {
width: 1em !important;
height: 1em !important;
background-size: contain !important;
}
.faq-area-sec .accordion-button::after {
background-image: url("../images/object/not-collapse.svg") !important;
}
.faq-area-sec .accordion-button:focus {
border-color: unset !important;
box-shadow: unset !important;
}
.faq-area-sec .accordion-button {
font-weight: 700;
padding: 1.5rem 0rem !important;
font-size: 1rem!important;
}
.faq-area-sec .accordion-item {
border: none !important;
border-bottom: 1px solid #E8E8E8 !important;
}
.faq-area-sec .accordion-body {
padding: 0em 0em 1.5em;
}
.faq-area-sec .accordion-body p {
margin-bottom: 0;
color: var(--quinary-color);
font-size: 0.9em;
font-weight: 400;
line-height: 1.8;
}
.faq-contact-sec-wrapped {
padding-left: 8em;
}
.fag-wrap-img {
width: 12em;
height: auto;
object-fit: contain;
margin: 0 auto;
padding-bottom: 1em;
}
.faq-contact-info-sec h3 {
font-size: 1.4em;
font-weight: 700;
color: var(--quaternary-color);
}
.faq-contact-info-sec p {
line-height: 1.8;
font-size: 0.95em;
font-weight: 400;
color: var(--quinary-color);
}
/* Who-we are Section start */
.who-we-are-sec-card {
border: 1px solid #efefef;
border-radius: 12px;
padding: 2em 2em;
box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
}
.who-we-are-count-wrap {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 2em;
}
.who-we-are-card {
display: grid;
grid-template-columns: 80px auto;
align-items: center;
justify-content: center;
position: relative;
}
.who-we-are-card::after {
position: absolute;
content: '';
background-color: var(--quinary-color);
width: 2px;
height: 50%;
right: -12px;
display: block;
}
.who-we-are-count-wrap .who-we-are-card:last-child::after {
display: none;
}
.who-we-are-info-sec h3 {
font-weight: 600;
color: var(--quaternary-color);
margin-bottom: 0;
font-size: 1.8em;
font-weight: 600;
}
.who-we-are-info-sec p {
line-height: 1.8;
font-size: 0.95em;
font-weight: 400;
color: var(--quinary-color);
margin-bottom: 0;
}
.count-img {
width: 4em;
height: 4em;
object-fit: contain;
}
/* byte-contact-form start */
.byte-contact-form {
padding: 2em;
border-radius: 16px;
background-color: var(--secondary-color);
box-shadow: rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px;
}
.byte-contact-form h3 {
font-size: 1.6em;
font-weight: 700;
color: var(--quaternary-color);
margin-bottom: 1em;
}
.byte-contact-form .form-label {
font-size: 0.85em;
font-weight: 400;
color: rgba(0, 0, 0, 0.85);
}
.byte-contact-form .form-control {
border: 1px solid #E8E8E8 !important;
border-radius: 12px !important;
height: 50px;
}
.byte-contact-form textarea.form-control{
height: auto;
}
.byte-contact-form .form-control:focus {
border-color: #E8E8E8;
box-shadow: unset !important;
}
.quick-response-sec {
/* background-image: url("../images/object/contact-back-ground.png");
background-size: cover;
background-repeat: no-repeat;
background-position:100%;
width: 100%; */
background-color: #F129CA;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1600 800'%3E%3Cg %3E%3Cpath fill='%23f031a2' d='M486 705.8c-109.3-21.8-223.4-32.2-335.3-19.4C99.5 692.1 49 703 0 719.8V800h843.8c-115.9-33.2-230.8-68.1-347.6-92.2C492.8 707.1 489.4 706.5 486 705.8z'/%3E%3Cpath fill='%23ef387f' d='M1600 0H0v719.8c49-16.8 99.5-27.8 150.7-33.5c111.9-12.7 226-2.4 335.3 19.4c3.4 0.7 6.8 1.4 10.2 2c116.8 24 231.7 59 347.6 92.2H1600V0z'/%3E%3Cpath fill='%23ee405e' d='M478.4 581c3.2 0.8 6.4 1.7 9.5 2.5c196.2 52.5 388.7 133.5 593.5 176.6c174.2 36.6 349.5 29.2 518.6-10.2V0H0v574.9c52.3-17.6 106.5-27.7 161.1-30.9C268.4 537.4 375.7 554.2 478.4 581z'/%3E%3Cpath fill='%23ee4e48' d='M0 0v429.4c55.6-18.4 113.5-27.3 171.4-27.7c102.8-0.8 203.2 22.7 299.3 54.5c3 1 5.9 2 8.9 3c183.6 62 365.7 146.1 562.4 192.1c186.7 43.7 376.3 34.4 557.9-12.6V0H0z'/%3E%3Cpath fill='%23ED764F' d='M181.8 259.4c98.2 6 191.9 35.2 281.3 72.1c2.8 1.1 5.5 2.3 8.3 3.4c171 71.6 342.7 158.5 531.3 207.7c198.8 51.8 403.4 40.8 597.3-14.8V0H0v283.2C59 263.6 120.6 255.7 181.8 259.4z'/%3E%3Cpath fill='%23f19172' d='M1600 0H0v136.3c62.3-20.9 127.7-27.5 192.2-19.2c93.6 12.1 180.5 47.7 263.3 89.6c2.6 1.3 5.1 2.6 7.7 3.9c158.4 81.1 319.7 170.9 500.3 223.2c210.5 61 430.8 49 636.6-16.6V0z'/%3E%3Cpath fill='%23f4ad95' d='M454.9 86.3C600.7 177 751.6 269.3 924.1 325c208.6 67.4 431.3 60.8 637.9-5.3c12.8-4.1 25.4-8.4 38.1-12.9V0H288.1c56 21.3 108.7 50.6 159.7 82C450.2 83.4 452.5 84.9 454.9 86.3z'/%3E%3Cpath fill='%23f8c8b9' d='M1600 0H498c118.1 85.8 243.5 164.5 386.8 216.2c191.8 69.2 400 74.7 595 21.1c40.8-11.2 81.1-25.2 120.3-41.7V0z'/%3E%3Cpath fill='%23fbe4dc' d='M1397.5 154.8c47.2-10.6 93.6-25.3 138.6-43.8c21.7-8.9 43-18.8 63.9-29.5V0H643.4c62.9 41.7 129.7 78.2 202.1 107.4C1020.4 178.1 1214.2 196.1 1397.5 154.8z'/%3E%3Cpath fill='%23FFFFFF' d='M1315.3 72.4c75.3-12.6 148.9-37.1 216.8-72.4h-723C966.8 71 1144.7 101 1315.3 72.4z'/%3E%3C/g%3E%3C/svg%3E");
background-attachment: fixed;
background-repeat: no-repeat;
background-position:100%;
background-size: cover;
padding: 2em;
border-radius: 16px;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
}
.contact-img {
width: 3em;
height: 3em;
object-fit: contain;
}
.contact-card-info-details h4 {
color: var(--secondary-color);
font-size: 1.1em;
margin-bottom: 0.3em;
font-weight: 500;
}
.contact-info-full {
margin-top: 2em;
}
.quick-response-sec h3 {
font-size: 1.4em;
color: var(--secondary-color);
font-weight: 700;
}
.quick-response-sec p {
font-size: 0.95em;
color: #fefefe;
font-weight: 400;
line-height: 1.8;
margin-bottom: 0;
}
.contact-card-info-details p {
color: #fefefe;
font-size: 0.9em;
margin-bottom: 0;
font-weight: 400;
line-height: 1.8;
}
.contact-card-info-details p a{
color: #fefefe;
}
.contact-card-info {
display: grid;
grid-template-columns: 65px auto;
align-items: center;
padding-bottom: 1.5em;
}
/* footer start */
.footer-wrapped-sec {
padding: 4em 0 1em 0;
}
.footer-logo {
width: 9em;
height: auto;
object-fit: contain;
}
.footer-wrapped {
border-radius: 12px;
background: rgba(104, 59, 215, 0.05);
padding: 2em;
}
.footer-wrapped h3 {
font-size: 1.4em;
font-weight: 700;
color: var(--quaternary-color);
}
.media-linked li a {
width: 4em;
height: 4em;
display: inline-block;
/* background: #fff; */
padding: 0.6em;
border-radius: 50%;
}
.media-linked li a img {
width: 100%;
height: 100%;
}
.media-linked {
display: flex;
justify-content: center;
align-items: center;
gap: 1em;
padding-top: 2em;
}
.footer-quick-link {
display: flex;
align-items: center;
justify-content: center;
gap: 3em;
padding-top: 2em;
}
.footer-quick-link li a {
color: var(--quaternary-color);
font-size: 1em;
font-weight: 400;
margin-bottom: 0;
position: relative;
}
.footer-quick-link li {
position: relative;
}
.footer-quick-link li::after {
content: '|';
position: absolute;
right: -18px;
top: 0;
width: 1px;
height: 100%;
display: inline-block;
}
.footer-quick-link li:last-child::after {
display: none;
}
.pre-footer-wrap {
border-radius: 12px;
background: linear-gradient(96deg, rgba(241, 41, 202, 0.10) 8.68%, rgba(237, 118, 79, 0.10) 92.63%);
padding: 1em 2em;
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 1em;
}
.pre-footer-wrap p {
margin-bottom: 0;
font-size: 0.9em;
font-weight: 400;
color: var(--quinary-color);
}
/* cta-banner-one */
.btn-banner-content {
display: flex;
flex-direction: column;
gap: 1.5em;
}
.cta-banner-one {
background: linear-gradient(45deg, #6b28cf, #ee646a);
}
.cta-banner-one h3 {
font-size: 4em;
font-weight: 600;
font-family: monospace;
}
.cta-banner-one h3 span {
-webkit-text-stroke: 1px #eee;
text-stroke: 1px #fff;
-webkit-text-fill-color: transparent;
color: transparent;
}
/* Industry section */
.different-industry-wrap {
display: grid;
grid-template-columns: 70px auto;
align-items: center;
border-radius: 12px;
-webkit-transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1);
transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1);
border: 1px solid #f0f3ff;
padding: 2em 3em;
width: 100%;
/* height: 100%; */
margin-top: 1em;
position: relative;
cursor: pointer;
}
.different-industry-wrap:hover {
/* box-shadow: 0 30px 40px 0 rgb(16 18 19 / 5%); */
box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}
.diff-industry {
width: 3.5em;
height: 3.5em;
object-fit: contain;
}
.different-industry-info h3 {
font-size: 1.2em;
font-weight: 700;
margin-bottom: 0;
color: var(--quaternary-color);
}
/* cta banner */
.cta-banner-info-wrap {
background-image: url("../images/object/cta-banner.png");
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
width: 100%;
height: 100%;
border: 1px solid #efefef;
border-radius: 12px;
padding: 4em 0 0 0;
}
.cta-banner-info-sec{
margin-top: -4em;
}
.cta-banner-info-sec h3 {
font-size: 2em;
font-weight: 700;
margin-bottom: 0.5em;
color: var(--quaternary-color);
}
.cta-banner-info-sec p {
font-size: 0.9em;
font-weight: 400;
color: var(--quinary-color);
margin-bottom: 0em;
line-height: 1.8;
}
.cta-img-size{
width: 18em;
height: auto;
object-fit: contain;
}
.cta-banner-one-two{
margin-left: auto;
}
/* AnimaTION section */
@keyframes BarAnimation {
0% {
transform: translateY(15px);
}
50% {
transform: translateY(0px);
}
100% {
transform: translateY(15px);
}
}
.find-us-card-img{
max-height: 240px;
margin: auto;
margin-bottom: 2em;
}
.client-slider-container{
margin-top: 3em;
}
.tech-img-wrapped{
text-align: right;
}
.my-teams-vertical-center{
display: flex;
flex-direction: column;
justify-content: center;
position: relative;
height: 60vh;
width: 100%;
left: 0%;
}
.my-thank-you-vertical-center{
display: flex;
flex-direction: column;
justify-content: center;
position: relative;
height: 80vh;
width: 100%;
left: 0%;
}
.page-title-sec h2{
color: var(--tertiary-color);
font-size: 2.5em;
font-weight: 600;
}
.page-title-sec p{
font-size: 1em;
color: var(--quinary-color);
line-height: 1.8;
font-weight: 400;
}
.my-team-member-img{
width: 100%;
height: 22em;
object-fit: cover;
object-position: top;
}
.my-team-member-card {
margin-bottom: 2em;
}
.my-team-member-card .my-team-member-img-sec {
border-radius: 12px;
overflow: hidden;
position: relative;
}
.my-team-member-card .my-team-member-img-sec:before {
position: absolute;
width: 200%;
height: 0%;
left: 50%;
top: 50%;
background-color: rgba(255, 255, 255, 0.3);
-webkit-transform: translate(-50%, -50%) rotate(-45deg);
transform: translate(-50%, -50%) rotate(-45deg);
content: "";
z-index: 1;
}
.my-team-member-card:hover .my-team-member-img-sec:before {
height: 250%;
-webkit-transition: all 900ms linear;
transition: all 900ms linear;
background-color: transparent;
}
.my-team-member-card:hover .my-team-member-img-sec .my-team-member-img {
-webkit-transform: scale(1.1);
transform: scale(1.1);
-webkit-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
}
.my-team-member-card .my-team-member-img-sec .my-team-member-img {
width: 100%;
height: 100%;
-webkit-transform: scale(1);
transform: scale(1);
-webkit-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
}
.my-team-member-info h4 {
font-size: 1.1em;
font-weight: 800;
margin: 0px 0px 8px;
letter-spacing: 0.5px;
line-height: 1.3;
color: var(--secondary-color);
}
.my-team-member-info h6 {
font-size: 0.9em;
font-weight: 400;
margin-bottom: 0;
letter-spacing: 0.5px;
line-height: 1.6;
color: var(--secondary-color);
}
.my-team-member-desc-sec p{
font-size: 0.9em;
font-weight: 400;
margin-bottom: 0em;
color: var(--quinary-color);
line-height: 1.8;
}
.my-team-member-desc-sec{
padding-top: 1em;
}
.my-team-member-info {
content: "";
opacity: 0;
bottom: 0;
left: 0;
right: 0;
padding: 1em;
position: absolute;
width: 100%;
background: rgba(0, 123, 252, 0);
background: -moz-linear-gradient(top, rgba(0, 123, 252, 0) 0%, #F129CA 100%);
background: -webkit-linear-gradient(top, rgba(0, 123, 252, 0) 0%, #F129CA 100%);
background: -o-linear-gradient(top, rgba(0, 123, 252, 0) 0%, #F129CA 100%);
background: -ms-linear-gradient(top, rgba(0, 123, 252, 0) 0%, #F129CA 100%);
background: linear-gradient(to bottom, rgba(0, 123, 252, 0) 0%, #F129CA 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#007BFC', endColorstr='#007BFC', GradientType=0);
-webkit-transition: all 0.3s ease-out 0s;
-moz-transition: all 0.3s ease-out 0s;
-ms-transition: all 0.3s ease-out 0s;
-o-transition: all 0.3s ease-out 0s;
transition: all 0.3s ease-out 0s;
}
.my-team-member-card:hover .my-team-member-info{
opacity: 1;
visibility: visible;
}
.who-we-are-you-img-sec .who-we-are-you-img-bg {
position: absolute;
left: -50px;
top: 0;
z-index: -1;
-webkit-animation: rotation 14s linear infinite;
animation: rotation 14s linear infinite;
}
.who-we-are-you-img-sec {
position: relative;
}
.who-we-are-you-img-sec .who-we-are-you-img-bg-linear {
position: absolute;
bottom: -70px;
left: 0;
}
@keyframes rotation {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.who-we-are-you-info h5{
font-size: 1.2em;
font-weight: 600;
color: var(--primary-color);
}
.who-we-are-you-info p {
font-size: 1em;
color: var(--quinary-color);
line-height: 1.8;
font-weight: 400;
margin-bottom: 0.5em;
}
.who-we-are-you-info p+p+p{
margin-bottom: 0;
}
.who-we-are-you-info h2{
color: var(--tertiary-color);
font-size: 2.5em;
font-weight: 600;
}
.margin-top-xl{
margin-top: 4em;
}
.about-why-choose-feature-info h4{
font-size: 1.2em;
font-weight: 700;
margin-bottom: 0.3em;
color: var(--quaternary-color);
}
.about-why-choose-feature-info p{
font-size: 0.9em;
font-weight: 400;
margin-bottom: 0em;
color: var(--quinary-color);
line-height: 1.8;
}
.about-why-choose-feature-card .sn {
position: absolute;
top: 30px;
left: 30px;
font-size: 50px;
font-weight: 700;
color: rgba(31,34,48,.1);
-webkit-text-fill-color: #fff;
-webkit-text-stroke-width: 1px;
-webkit-text-stroke-color: rgba(31,34,48,.1);
line-height: 1;
transition: all .42s ease;
}
.about-why-choose-feature-card:hover .sn {
-webkit-text-stroke-color: #1f2230;
}
.about-why-choose-feature-card:hover {
box-shadow: 5px 2px 30px rgba(0,0,0,.06);
border: 1px solid transparent;
}
.about-why-choose-feature-card {
border: 1px solid #eee;
border-radius: 12px;
background: #fff;
padding: 2em;
text-align: center;
position: relative;
transition: all .42s ease;
display: flex;
flex-direction: column;
justify-content: center;
height: 100%;
}
.hover-border1 {
background: #fff;
position: relative;
z-index: 1;
}
.about-why-choose-feature-icon svg {
fill: #696969;
transition: all .42s ease;
}
.about-why-choose-feature-icon{
margin-bottom: 1em;
}
.hover-border1::before {
content: "";
width: 0%;
height: 2px;
position: absolute;
border-radius: 12px;
bottom: 0%;
left: 0%;
background: -moz-linear-gradient(96deg, #F129CA 8.68%, #ED764F 92.63%);
background: -webkit-linear-gradient(96deg, #F129CA 8.68%, #ED764F 92.63%);
background: linear-gradient(96deg, #F129CA 8.68%, #ED764F 92.63%);
-moz-background-origin: border;
background-origin: border-box;
transition: all .52s;
z-index: -1;
}
.hover-border1:hover::before {
width: 100%;
}
.about-why-choose-feature-card:hover {
box-shadow: 5px 2px 30px rgba(0,0,0,.06);
border: 1px solid transparent;
border-radius: 0;
}
.about-why-choose-feature-card:hover .about-why-choose-feature-icon svg{
fill: #F129CA;
}
.about-counter-icon{
height: 4.5em;
object-fit: contain;
}
.about-counter-card{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 1em;
flex-wrap: wrap;
box-shadow: 5px 2px 30px rgba(0,0,0,.06);
padding: 1em;
text-align: center;
border-radius: 12px;
transition: all .42s ease;
height: 100%;
}
.about-counter-card:hover{
border-radius: 0;
}
.about-counter-info h3{
font-size: 1.4em;
font-weight: 700;
margin-bottom: 0.2em;
color: var(--quaternary-color);
}
.about-counter-info p{
font-size: 0.9em;
font-weight: 400;
margin-bottom: 0em;
color: var(--quinary-color);
}
.thank-you-img{
max-width: 25em;
margin: auto;
}
.about-why-do-we-do-icon{
height: 4.5em;
object-fit: contain;
}
.about-why-do-we-do-card:hover .about-why-do-we-do-icon{
-webkit-animation: bounce 1s;
animation: bounce 1s;
}
.about-why-do-we-do-info h4{
font-size: 1.4em;
font-weight: 700;
margin-bottom: 0.2em;
color: var(--quaternary-color);
}
.about-why-do-we-do-info p{
font-size: 0.9em;
font-weight: 400;
margin-bottom: 0em;
color: var(--quinary-color);
}
.about-why-do-we-do-card{
box-shadow: 5px 2px 30px rgba(0,0,0,.06);
border: 1px solid transparent;
padding: 2em;
border-radius: 12px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
gap: 1em;
flex-wrap: wrap;
}
@keyframes bounce {
0%, 20%, 53%, 80%, 100% {
-webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
animation-timing-function: cubic-bezier(.215,.61,.355,1);
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
40%, 43% {
-webkit-transform: translate3d(0,-30px,0);
transform: translate3d(0,-30px,0);
}
40%, 43%, 70% {
-webkit-animation-timing-function: cubic-bezier(.755,.05,.855,.06);
animation-timing-function: cubic-bezier(.755,.05,.855,.06);
}
70% {
-webkit-transform: translate3d(0,-15px,0);
transform: translate3d(0,-15px,0);
}
90% {
-webkit-transform: translate3d(0,-4px,0);
transform: translate3d(0,-4px,0);
}
}
.tns-nav button {
border-radius: 3px;
background: rgb(72 181 225 / 50%) !important;
-webkit-transition: all 0.5s ease;
transition: all 0.5s ease;
border: none;
margin: 0 5px;
padding: 5px;
}
.tns-nav button.tns-nav-active {
background: var(--primary-color) !important;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.tns-nav {
position: absolute;
bottom: -30px;
left: 50%;
}
.tns-nav {
text-align: center;
margin-top: 10px;
}
.client-slider-container{
position: relative;
}
.initial-start{
font-size: 1em!important;
font-weight: 600!important;
margin-bottom: 0.5em!important;
}
.terms-conditions-area p{
font-size: 0.9em;
font-weight: 400;
margin-bottom: 0em;
color: var(--quinary-color);
}
.terms-conditions-area h3{
color: var(--tertiary-color);
font-size: 1.2em;
font-weight: 700;
margin-bottom: 0.5em;
margin-top: 1em;
}
.terms-conditions-area ul li{
display: grid;
grid-template-columns: 34px auto;
align-items: start;
margin-bottom: 1em;
}
.thn{
display: flex;
gap: 0.5em;
align-items: center;
justify-content: center;
font-size: 1.2em!important;
font-weight: 600!important;
}
/* Hire Developer CSS */
.our-hiring-card{
box-shadow: 0px 5px 36px rgba(0,0,0,.06);
background-color: var(--secondary-color);
padding: 1.5em;
border-radius: 12px;
}
.our-hiring-icon-sec{
color: #33B89F;
background-color: #e7f6f3;
border-color: #c2eae2;
width: 3em;
height: 3em;
border-radius: 12px;
font-size: 1.6666666667rem;
display: inline-flex;
align-items: center;
justify-content: center;
}
.client-detail{
display: flex;
align-items: center;
gap: 1em;
justify-content: center;
background-color: var(--secondary-color);
padding: 0.6em 2em !important;
text-align: center;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
position: relative;
overflow: hidden;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-o-border-radius: 5px;
-ms-border-radius: 5px;
border-radius: 5px;
color: var(--tertiary-color)!important;
border: 1px solid var(--secondary-color);
box-shadow: 5px 2px 30px rgba(0, 0, 0, .06);
}
.client-detail h3{
margin: 0;
font-size: 1em;
color: #7c60d5;
font-weight: 600;
}
.client-detail h5 {
margin: 0;
font-size: 0.9em;
text-transform: uppercase;
font-weight: 600;
}
.client-detail h5 span{
color: #666666;
text-transform: capitalize;
font-weight: 400;
}
Back to Directory
File Manager