* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: RobotoSlab-SemiBold;
}

a,
p,
li,
.form-control,
label,
span {
    font-family: Poppins-Medium;
}

.heading h2 {
    font-size: 35px;
    color: #414141;
    position: relative;
}

ul {
    padding: 0;
    margin: 0;
}

.heading p {
    font-size: 24px;
    font-family: Poppins-Light;
    margin-top: 20px;
}

.text-blue {
    color: #3866FA;
    font-family: RobotoSlab-SemiBold;
}

.margin_top {
    margin-top: 60px;
}

.padding_top_bottom {
    padding: 60px 0px;
}



/* fonts start */

/* poppins  */
@font-face {
    font-family: Poppins-Medium;
    src: url(../fonts/Poppins-Medium.woff);
}

@font-face {
    font-family: Poppins-SemiBold;
    src: url(../fonts/Poppins-SemiBold.woff);
}

@font-face {
    font-family: Poppins-Light;
    src: url(../fonts/Poppins-Light.woff);
}


/* Robotoslab  */

@font-face {
    font-family: RobotoSlab-Bold;
    src: url(../fonts/RobotoSlab-Bold.woff);
}

@font-face {
    font-family: RobotoSlab-Light;
    src: url(../fonts/RobotoSlab-Light.woff);
}

@font-face {
    font-family: RobotoSlab-SemiBold;
    src: url(../fonts/RobotoSlab-SemiBold.woff);
}

@font-face {
    font-family: RobotoSlab-Regular;
    src: url(../fonts/RobotoSlab-Regular.woff);
}


/* fonts end */
a {
    text-decoration: none;
}

html {
    scroll-behavior: smooth;
}

li {
    list-style: none;
}


.sub_heading h3 {
    font-size: 26px;
    font-weight: bold;
    color: #ffffff;
}

body {
    font-family: 'Lato', sans-serif;
}

.banner {
    background: url(../img/headerBG.webp) no-repeat center top;
    color: #ffffff;
    padding-bottom: 0em;
    background-size: cover;
    padding-top: 30px;
}

.headerInner {
    padding: 15px;
    border-radius: 6px;
    background: #ffffff;
}

.cirlce {
    width: 40px;
    height: 40px;
    background: #0c5adb;
    border-radius: 73px;
    margin: 0 auto;

}

.logo {
    float: left;
}

.logo-border {
    border-right: 2px solid #ccc;
    padding: 8px 16px 8px 7px;
}

.wraper-left li {
    font-size: 18px;
    list-style: none;
    color: #000;
}

.wraper-left a:hover {
    text-decoration: none;
}

.wraper-left ul {
    margin-top: 11px;
    margin-left: -35px;
}

.wraper-right {
    float: right;
    text-align: right;
    font-size: 17px;
    margin-top: 18px;
}

.wraper-right i {
    color: #ffffff;
    padding: 11px 13px 10px 11px;
    margin: 0 auto;
}

.wraper-right a:hover {
    text-decoration: none;
}

.icon {
    border-left: 2px solid #ccc;
    padding: 8px 5px 8px 7px;
}

.banner-info {
    margin-top: 60px
}

.banner-info h1 {
    font-size: 85px;
    line-height: 100px;
}

.banner-title {
    font-size: 24px;
}

.blinker {
    animation: changecolor 5s infinite;
    -moz-animation: changecolor 5s infinite;
    -webkit-animation: changecolor 5s infinite;
    -ms-animation: changecolor 5s infinite;
    -o-animation: changecolor 5s infinite;
    text-transform: uppercase;
    font-weight: bold;
    letter-spacing: -0.5px;
    font-size: 22px;
}

@keyframes changecolor {
    0% {
        color: red;
    }

    25% {
        color: #cc49d4;
    }

    50% {
        color: #ce2522;
    }

    100% {
        color: orange;
    }
}

/* Mozilla Browser */
@-moz-keyframes changecolor {
    0% {
        color: red;
    }

    25% {
        color: #cc49d4;
    }

    50% {
        color: #ce2522;
    }

    100% {
        color: orange;
    }
}

/* WebKit browser Safari and Chrome */
@-webkit-keyframes changecolor {
    0% {
        color: red;
    }

    25% {
        color: #cc49d4;
    }

    50% {
        color: #ce2522;
    }

    100% {
        color: orange;
    }
}

/* IE 9,10*/
@-ms-keyframes changecolor {
    0% {
        color: red;
    }

    25% {
        color: #cc49d4;
    }

    50% {
        color: #ce2522;
    }

    100% {
        color: orange;
    }
}

/* Opera Browser*/
@-o-keyframes changecolor {
    0% {
        color: red;
    }

    25% {
        color: #cc49d4;
    }

    50% {
        color: #ce2522;
    }

    100% {
        color: orange;
    }
}


/* header css start  */
header {
    padding: 20px 30px;
    width: 100%;
    box-shadow: rgba(0, 0, 0, 0.45) 0px 15px 20px -20px;
    z-index: 9;
    background-color: #fff;
    border-radius: 10px;
    margin-bottom: 40px;
}

header .number a {
    color: #000;
    transition: .5s;
}

header .number a:hover {
    color: #3866FA;
}

header .call_flex {
    display: flex;
    justify-content: end;
    align-items: center;
}

header .logo img {
    width: 180px;
}

header .get-started_btn {
    margin-right: 30px;
    display: block;
}

.whatspp_icon img {
    width: 30px;
    margin-right: 0px;
    display: none;
}

header .get-started_btn a {
    border: 2px solid #000;
    border-radius: 50px;
    padding: 10px 10px;
    color: #000;
}

header .get-started_btn a:hover i {
    transform: rotate(360deg);
}

header .get-started_btn a img {
    width: 35px;
    margin-left: 8px;
}

header .get-started_btn a i {
    margin-left: 8px;
    margin-right: 8px;
    transform: rotate(321deg);
    transition: .5s;
}

header .icon_call i {
    margin-right: 18px;
    font-size: 20px;
}

header .icon_call {
    display: flex;
    align-items: center;
}

/* header css start  */


section.banner .form_heading img {
    width: 100%;
}

.banner_left_content {
    margin-right: 150px;
}

section.banner .di_form {
    background-color: #5500a4;
    padding: 35px 20px;
    box-shadow: 2px 4px 20px 1px #352c2c;
}

section.banner .form_heading.sub_heading {
    text-align: center;
}

.form_heading.sub_heading h4 {
    color: #ffffff;
    text-align: center;
}

section.banner .form_heading.sub_heading p {
    color: #ffffff;
}

section.banner .form-group img {
    position: absolute;
    left: 12px;
    width: 14px;
    top: 13px;
}

section.banner .form-group {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 100%;
    margin: 0px auto;
    margin-top: 10px;
}

section.banner .form-group .form-control {
    padding: 10px 35px;
    border-radius: 3px;
    font-size: 14px;
}

section.banner .form-group .btn_form {
    text-align: center;
    background-color: #fcf315;
    padding: 10px 40px;
    margin-top: 10px;
    border-radius: 5px;
    font-family: RobotoSlab-SemiBold;
    color: #000000;
}

.flex_radio [type=radio] {
    font-size: inherit;
    width: 0.75em;
    height: 0.75em;
    accent-color: #000000;
}

.flex_radio {
    display: flex;
    justify-content: space-between;
    width: 100%;

}

.flex_radio p {
    margin-bottom: 0;
    color: #ffffff;
}

.radio {
    display: flex;
    align-items: center;
}

.radio label {
    color: #ffffff;
}

.custom-control.custom-radio {
    margin-left: 10px;
}

.selected {
    display: none;
}

/* UI UX service section css start  */

section.service .service_wrp {
    text-align: center;
    position: relative;
    padding: 40px 20px;
    margin-top: 30px;
    height: 400px;
    transition: 0.3s all ease-in-out;
}

section.service .service_wrp:hover {
    transform: scale(1.02);
}

section.service .service_wrp::after {
    position: absolute;
    width: 100%;
    height: 100%;
    content: "";
    background-color: #f0f0f0;
    top: 0;
    left: 0;
    transform: skew(-6deg, 0deg);
    border: 3px solid #f0f0f0;
    transition: 0.3s all ease-in-out;
}

section.service .service_wrp:hover::after {
    background-color: #ffffff;
    border: 3px solid #3866fa;
}

section.service .service_wrp:hover .service_arrow a {
    color: #3866fa;
}

section.service .service_wrp:hover .service_heading h4 {
    color: #3866fa;
}

section.service .service_wrp .serivice_img {
    position: relative;
}

section.service .service_wrp .serivice_img img {
    width: 60px;
    position: relative;
    z-index: 1;
    margin: 0px auto;
}

section.service .service_wrp .service_heading {
    margin-top: 30px;
    position: relative;
    z-index: 1;
}

section.service .service_wrp .black_icon {
    display: block;
}

section.service .service_wrp .blue_icon {
    display: none;
}

section.service .service_wrp:hover .blue_icon {
    display: block;

}

section.service .service_wrp:hover .black_icon {
    display: none;
}

section.service .service_wrp .service_heading h4 {
    font-size: 22px;
    transition: 0.3s all ease-in-out;
}

section.service .service_wrp .service_heading p {
    margin-top: 20px;
}

section.service .service_wrp .service_arrow {
    margin-top: 30px;
}

section.service .service_wrp .service_arrow a {
    font-size: 30px;
    position: relative;
    z-index: 1;
    color: #000000;
    transition: 0.3s all ease-in-out;
}

/* roceket section css start  */

section.rocket {
    position: relative;
}

section.rocket .rocket_img img {
    width: 100%;
}

section.rocket .rocket_box {
    text-align: center;
    /* border: 1px solid #dbdbdb; */
    border-radius: 4px;
    padding: 10px;
    height: 80px;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    transition: .3s;
}

section.rocket .rocket_text p {
    font-size: 10px;
    line-height: 12px;
}

section.rocket .rocket_box img {
    width: 35px;
}

section.rocket .icon {
    margin-bottom: 10px;
    margin-top: 10px;
}

section.rocket .rocket_wrp {
    position: relative;
}

section.rocket .rocket_img {
    width: 100%;
}

section.rocket .rocket_top {
    margin-top: 20px;
}

section.rocket .rocket_text h6 {
    font-family: Poppins-Medium;
    margin-bottom: 0px;
    font-size: 14px;
    transition: .3s;
}

section.rocket .rocket_box:hover {
    background-color: #3866fa;
}

section.rocket .rocket_box:hover .rocket_text {
    color: #ffffff;
}

section.rocket .heading_rocket {
    background-color: #3866fa;
    padding: 15px;
    color: #ffffff;
    text-align: center;
    margin-bottom: 20px;
    border-radius: 5px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

section.rocket .ux_bg .rocket_box:hover {
    background-color: rgb(0, 0, 0)
}

section.rocket .heading_dark {
    background-color: rgb(0, 0, 0)
}

section.rocket .heading_rocket h3 {
    font-size: 26px;
}

/* roceket section css end  */
/* UI UX service section css end  */

/* why choose section css start  */

section.why_choose {
    /* background-color: #f0f0f0; */
    /* background: -webkit-radial-gradient(top left, circle, #4a42ec 0%, #521d91 100%);
    background: radial-gradient(circle at top left, #4a42ec 0%, #521d91 100%);
    background-color: #521d91;
    box-shadow: 0 48px 48px -32px rgba(23,16,159,.2), 0 96px 96px -64px rgba(23,16,159,.4); */
    position: relative;
}

section.why_choose::before {
    content: "";
    background-color: #f0f0f0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* section.why_choose::after{
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    width: 440px;
    height: 440px;
    border-radius: 2000px;
    background: #ffad00;
    right: -33px;
    bottom: -121px;
} */
section.why_choose .flex_ui {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    width: 95%;
    margin: 0px auto;
    margin-top: 40px;
}

section.why_choose .choose_text {
    margin-top: 20px;
    position: relative;
}

section.why_choose .choose_text h6 {
    font-size: 16px;
    color: #000000;
    position: relative;
    padding: 0px 20px;
}

section.why_choose .why_wrp {
    width: 16%;
    text-align: center;
    position: relative;
}

section.why_choose .why_wrp:hover .choose_img img {
    transform: scale(0.9) rotateY(360deg);
}

section.why_choose .choose_img img {
    width: 90px;
    transition: all 500ms linear 0.1s;
    transform: scale(1) rotateY(0deg);
}

section.why_choose .choose_img {
    background-color: #ffffff;
    border-radius: 20px;
    padding: 30px 0px;
    margin: 0px 10px;
    border: 1px solid #c8c8c8;
    position: relative;
}

/* why choose section css end  */

/* UX Design section css start  */

section.ux-design .ux_wrp {
    text-align: center;
}

section.ux-design .ux_design_slider .slider_text p {
    font-size: 23px;
    margin-top: 20px;
    margin-bottom: 0px;
}

section.ux-design .ux_design_slider {
    width: 90%;
    margin: 0px auto;
    margin-top: 40px;
}

section.ux-design .ux_design_slider .owl-dots {
    display: none !important
}

section.ux-design .ux_design_slider .owl-nav {
    display: block !important;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}

section.ux-design .ux_design_slider .owl-nav .owl-prev span img {
    width: 50px;
    position: absolute;
    top: 275px;
    left: -80px;
    color: #ffffff;
    padding: 10px;
    transition: .5s;
}


section.ux-design .ux_design_slider .owl-nav .owl-next span img {
    width: 50px;
    position: absolute;
    top: 275px;
    right: -80px;
    color: #ffffff;
    padding: 10px;
    transition: .5s;
}



/* UX Design section css end  */

/* brands section css start  */

section.brands .brands_flex {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

section.brands .brands_wrp {
    width: 18%;
    margin: 0px 10px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
    margin-top: 20px;
    border-radius: 10px;
    padding: 20px;

}

section.brands .brands_wrp:hover img {
    transform: scale(1.05);
}

section.brands .brands_wrp img {
    width: 100%;
    transition: 0.3s all ease-in-out;
}

/* brands section css end  */


/* footer css start  */

footer {
    background-color: #f0f0f0;
    padding-bottom: 0px !important;
}

footer .container .row .footer_form:nth-child(1) {
    padding-right: 0;
}

footer .container .row .footer_form:nth-child(2) {
    padding-left: 0;
}


footer .left_content_wrp {
    background-color: #000000;
    color: #b8b8b8;
    padding: 40px 60px;
    border-right: 2px solid #ffffff;
    height: 650px;
}

footer .left_content_wrp .heading h2 {
    color: #b8b8b8;
}

footer .fill_details {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

footer .fill_wrp p {
    font-size: 24px;
    font-family: Poppins-Light;
    margin-top: 10px;
    margin-bottom: 0;
}

footer .arrow_img img {
    width: 60px;
}

footer .mobile_details {
    margin-top: 30px;
}

footer .mobile_details ul li a {
    color: #b8b8b8;
}

footer .mobile_details ul li span {
    padding-right: 5px;
}

footer .right_content_wrp {
    background-color: #3866fa;
    padding: 30px 60px;
    height: 650px;
}


footer .right_content_wrp .form-group {
    margin-top: 20px;
}

footer .right_content_wrp .form-group .form-control {
    background-color: #ffffff;
    padding: 16px;
    font-size: 14px;
}

footer .right_content_wrp .form-group .form-control::placeholder {
    opacity: 0.6;
}

footer .right_content_wrp .form-group .btn_form {
    text-align: center;
    background-color: #fcf315;
    padding: 10px 40px;
    /*margin-top: 10px;*/
    border-radius: 5px;
    font-family: RobotoSlab-SemiBold;
    border: none;
    font-size: 18px;
    color: #000000;
}

footer .copy_right p {
    color: #707070;
    margin-top: 20px;
}

footer .copy_right p a {
    color: #707070;
}

/* footer css end  */


/* ui ux related problems section css start  */
section.thanku {
    background-color: #F5F5F5;
    padding: 50px 0px;
}

section.thanku .container {
    background: #ffffff;
    height: 80vh;
    margin-top: 60px;
    margin-bottom: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

section.problems_related .problems_box {
    background-color: #ffffff;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    height: 95px;
    margin-top: 10px;
    transition: 0.3s all ease-in-out;
    border: 1px solid #3866fa;
}

section.problems_related .sub_heading {
    border: 1px solid #3866fa;
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
    background-color: #3866fa;
}

section.problems_related .heading {
    margin-bottom: 25px;
}

section.problems_related .related_margin .sub_heading {
    background-color: #000000;
    border: 1px solid #000000;
}

section.problems_related .related_margin .problems_box {
    border: 1px solid #000000;
}

section.problems_related .related_margin .problems_box:hover {
    background-color: #000000;
}

section.problems_related .container .col-lg-3 {
    padding: 0px 5px;
}

section.problems_related .container {
    background-color: #f0f0f0;
    padding: 40px;
}

section.problems_related .related_margin {
    margin-top: 10px;
}

section.problems_related .problems_box:hover {
    background-color: #3866FA;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    transform: scale(1.03);
}

section.problems_related .problems_box:hover p {
    color: #ffffff;
}

section.problems_related .problems_box p {
    margin-bottom: 0px;
    transition: 0.3s all ease-in-out;
}

section.problems_related .sub_heading h3 {
    margin-bottom: 0px;
}

/* ui ux related problems section css end */


/* thanku page css start  */

section.thanku .container {
    background: #ffffff;
    height: 80vh;
    margin-top: 60px;
    margin-bottom: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

section.thanku .heading h2 span {
    color: #3866FA;
    /* font-size: 60px; */
}

.visit_btn {
    margin-top: 30px;
}

.visit_btn a {
    background: #FDC82B;
    padding: 8px 30px;
    color: #000;
}

.visit_btn a i {
    transform: rotate(322deg);
    margin-left: 5px;
    transition: .5s;
}

.visit_btn a:hover i {
    transform: rotate(360deg);
}



/* gulshan css start 21-02-2024  */

/* capture section start  */

section.capture .our_expertise_wrp {
    text-align: center;
    margin-top: 30px;
}


section.capture .expertise_text {
    margin-top: 10px;
}

section.capture .expertise_text h4 {
    font-size: 16px;
    font-weight: 500;
}

section.capture .expertise_img img {
    width: 100%;
}

section.capture .sub_heading_two {
    margin-top: 30px;
}

section.capture .sub_heading_two h3 {
    font-family: 'Poppins-medium';
}

/* capture section end  */
section.content_convention {
    margin-top: 70px;
}

section.content_convention .heading h2 {
    font-size: 34px;
}

section.content_convention .content_wrp {
    text-align: center;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
    padding: 40px 30px;
    border-radius: 10px;
    margin-top: 20px;
    background-color: #ffffff;
    transition: .3s;
}

section.content_convention .content_wrp:hover {
    background-color: #FCF315;
}

section.content_convention .content_icon img {
    width: 70px;
}

section.content_convention .content_heading_text h6 {
    margin-top: 15px;
    font-size: 18px;
    margin-bottom: 0px;
    letter-spacing: -1px;
}

/* gulshan css start 21-02-2024  */





.section-job-guarnatee {
    background: linear-gradient(179deg, #2c055c 50%, #3e0576);
    background-position: 0 0;
    background-size: auto;
    padding: 50px 0px;
    position: relative;
}

.job-gurantee-right {
    text-align: right;
}

.section-job-guarnatee .container-small {
    width: 100%;
    max-width: 70rem;
    margin-left: auto;
    margin-right: auto;
}

.section-job-guarnatee .job-guarantee-component {
    grid-row-gap: 0;
    flex-direction: column;
    display: flex;
}

.section-job-guarnatee #w-node-_133a0263-0577-2a4e-53df-3f8f4c49570f-2421e44d {
    grid-area: span 1/span 1/span 1/span 1;

}

.section-job-guarnatee .job-guarantee-timeline {
    position: relative;
}

.section-job-guarnatee .how-it-works-container {
    z-index: 3;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    display: flex;
    position: relative;
}

.section-job-guarnatee .job-gurantee-item { 
    width: 50%;
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    margin: 0px 40px;
    /* flex-direction: column; */
    display: flex;
    position: relative;
    border: 1px solid #444d9c;
    padding: 30px 30px;
    border-radius: 20px;
    color: #fff;
    align-items: center;
    height: 180px;
  
}
.section-job-guarnatee .job-gurantee-item p {
    line-height: 30px;
    font-size: 20px;
}

.section-job-guarnatee .job-gurantee-heading {
    color: #ffffff;
    font-weight: 600;
    font-size: 25px;
    text-transform: uppercase;
}


.section-job-guarnatee .image-283 {
    width: 17rem;
    max-width: none;
}

.section-job-guarnatee .div-block-186.how-it-works.evergreen {
    width: 20px;
    height: 100%;
    top: 0px;
}

.section-job-guarnatee .div-block-186.how-it-works {
    z-index: 0;
    height: 93%;
    margin-top: 0;
}

.section-job-guarnatee .div-block-186 {
    z-index: 1;
    width: 4px;
    height: 90%;
    margin-top: 100px;
    position: absolute;
    top: 0%;
    bottom: auto;
    left: 50%;
    right: auto;
    transform: translate(-50%);
}

.section-job-guarnatee .d2c-inactive-line.ever {
    width: 2px;
    border-radius: 20px;
}

.section-job-guarnatee .d2c-inactive-line {
    width: 50%;
    height: 100%;
    background-color: #444d9c;
    position: absolute;
    left: 50%;
    transform: translate(-50%);
}

.section-job-guarnatee .d2c-active-line.cyber.ever {
    width: 3px;
    background-color: #b1b7ed;
    top: auto;
    left: 9px;
}

.section-job-guarnatee .d2c-active-line.cyber {
    background-color: #40cb95;
}

.section-job-guarnatee .d2c-active-line {
    width: 100%;
    height: 0%;
    background-color: #d8614a;
    position: absolute;
    top: 0%;
    bottom: auto;
    left: 0%;
    right: auto;
}

.section-job-guarnatee .image-261 {
    width: 60px;
    max-width: none;
    margin-bottom: -31px;
    margin-left: -29px;
    position: absolute;
    top: auto;
    bottom: 0%;
    left: 0%;
    right: 0%;
}

.flex {
    display: flex;
    align-items: center;
    justify-content: center;
}
.vertical_slide_img img {
    width: 80px;
}
.text_blue{
    color: #abe7ff;
}
.text_purple{
    color: #fdbddb;
}
.section-job-guarnatee .job-gurantee-item:nth-child(1){
    border: 3px solid #abe7ff;
}
.section-job-guarnatee .job-gurantee-item:nth-child(2){
    border: 3px solid #fdbddb;
}
.flex .job-gurantee-item{
    height: auto;
    justify-content: center;
}
/* heading section css end  */

.privacy_btn {
    text-align: end;
}
.privacy_btn a {
    padding: 8px 30px;
    color: #000000;
    border-radius: 0px;
    border: 1px solid #6e6e6e;
    font-size: 14px;
}

