.banner_bg,
.explore_btn,
.find_btn a:hover {
    background-color: var(--color-steelblue-100)
}

.bba_logo,
.explore_btn {
    align-items: center;
    display: flex
}
.bba_logo:focus-visible{
    outline:0;
}
.banner_bg,
.bba_service,
.navbar-nav li a,
.servicecard_hdr h5 span,
.thumb-overlay {
    position: relative
}

.about-left,
.banner_bg {
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom;
}

.explore_btn:hover,
.find_btn a {
    color: var(--color-steelblue-100)
}

#btn-back-to-top i,
.banner-right,
.bba_logo,
.cardslider-card,
.cta,
.explore_btn,
.footer_dtls {
    display: flex
}

.cardslider,
.contact_map,
.cta,
.cursor,
.wrapper {
    overflow: hidden
}

.bba_logo {
    grid-gap: 10px
}

.bba_logo img {
    width: 50px
}

.nav-link {
    color: #fff;
    font-size: 16px;
    font-weight: 500
}

.bb_name,
.bba_heading,
.explore_btn,
.find_btn a:hover {
    color: var(--color-white)
}

.navbar-nav :not(:last-child) {
    margin-right: 12px
}

.navbar-nav li a.active {
    color: #24315d
}

.navbar-toggler-icon img {
    height: 24px;
}

.bb_name {
    font-size: 22px
}

.banner_bg {
    background-image: url(../images/banner_bg.webp);
    min-height: 100%;
    border-radius: 0 0 0 92px;
    padding: 60px 0;
}

.banner-left,
.staffing_btn,
section.banner_sec {
    padding-top: 50px
}

.bba_heading {
    font-size: 62px;
    width: 100%;
    font-weight: 500;
    text-shadow: 0 4px 24px rgba(0, 0, 0, .25);
    font-family: var(--font-stix-two-text)
}

.bba_description {
    font-size: 19px;
    line-height: 30px;
    color: #fff;
    font-weight: 300;
    text-shadow: 0 4px 4px rgba(0, 0, 0, .25);
    font-family: var(--font-sen)
}

.find_btn a,
.serv_card {
    background-color: var(--color-white)
}

.footer_hdr,
.serv_desc p,
.tech_cap p {
    font-family: var(--font-poppins)
}

.navbar-toggler-icon {
    width: 1em !important;
    height: 1em !important
}

.navbar-toggler:focus {
    box-shadow: 0 0 0 -.75rem !important
}

.navbar-nav li a:hover {
    color: #24315d;
    transition: .8s
}

#slider,
.about_bg img,
.border_sec,
.cta,
.navbar-nav li a:hover::after,
.rec_cardimg,
.slide-item img {
    width: 100%
}

img.bba_bn1,
img.bba_bn2 {
    width: 270px;
    object-fit: contain
}

.about-bg,
.arrow_next,
.arrow_prev,
.banner_img1,
.banner_img2,
.bg_abt1,
.bg_abt2,
.bg_abt3,
.staffing_dotsbg,
.staffing_dotsbg1 {
    position: absolute
}

.navbar-nav li a::after {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 0%;
    content: "";
    color: #24315d;
    background: #24315d;
    height: 1px;
    transition: .5s
}

.find_btn a {
    padding: 10px 20px;
    font-size: 17px;
    font-weight: 500;
    border-radius: 18px;
    box-shadow: 4px 8px 19px -3px rgba(0, 0, 0, .27)
}

.banner_img1 {
    bottom: -117px
}

.banner_img2 {
    bottom: -170px;
    right: 20px
}

img.bba_bn1 {
    height: 530px
}

img.bba_bn2 {
    height: 550px
}

section.about_sec {
    padding-top: 190px
}

.about-bg {
    right: 0;
    bottom: -156%;
    z-index: -111
}

.about-left {
    background-image: url(../images/patterntriangle.svg);
    height: 300px;
    position: relative
}

.about-left img {
    height: 270px;
    object-fit: cover
}

.img_abt1 {
    position: absolute;
    left: -5px;
    top: -47px
}

.img_abt2 {
    position: absolute;
    right: -29px;
    bottom: -100px
}

.about-right p {
    font-size: 30px;
    text-align: start;
    padding: 30px 50px;
    font-weight: 400;
    color: #24315d
}

.cardslider-card.center,
.cardtitle,
.serv_desc p {
    text-align: center
}

.explore_btn {
    border: 1px solid var(--color-steelblue-100);
    padding: 10px 20px;
    font-size: 19px;
    border-radius: 10px
}

.explore_btn i {
    font-size: 30px;
    padding-left: 10px
}

.explore_btn:hover {
    background-color: #fff;
    font-weight: 500
}

.service_sec {
    margin-top: 50px
}

img.slider_img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 20px 20px 0 0
}

.slider-container {
    max-width: 100%;
    width: 100%;
    margin: 0 auto
}

.serv_card {
    border-radius: 20px;
    box-shadow: 4px 0 10px rgba(0, 0, 0, .16), -4px 12px 10px rgba(0, 0, 0, .16);
    height: 340px !important;
    position: relative
}

.card-body {
    display: flex;
    justify-content: center;
    align-items: center;
}

.serv_desc p {
    /*padding: 20px 30px 0;*/
    font-size: 18px;
    font-weight: 500;
    color: #24315d
}

.slick-slide {
    padding: 20px 10px;
    height: auto
}

.slide-wrap {
    margin: 0 10px;
    box-shadow: 0px 4px 6px 0 rgba(0, 0, 0, .16), 2px 0 0px 0 rgba(0, 0, 0, .16);
}

.slide-wrap:hover,
.tech_cnt:hover {
    transition: .5s;
    -webkit-transition: .5s;
    -webkit-transition: .5s;
    box-shadow: -4px 12px 10px 0 rgba(0, 0, 0, .16), 4px 0 10px 0 rgba(0, 0, 0, .16);
    transform: scale(1.1);
}

.serv_hdr h5 {
    font-size: 28px;
    font-weight: 600;
    padding: 30px 0;
    color: #24315d
}

.tech_cap p,
h6.contct_hdr {
    font-weight: 500;
    color: #24315d
}

.arrow_prev {
    top: 50%;
    left: 2%
}

.arrow_next {
    top: 50%;
    right: 2%
}

.tech_cnt {
    box-shadow: -8px 0 24px 0 rgba(0, 0, 0, .12);
    padding: 20px;
    margin: 30px 0;
    height: 240px
}

.contact_form,
.contact_map {
    border-radius: 10px;
    box-shadow: 0 0 10px 0 #d7d2d2;
    width: 100%
}

.tech_cap p {
    font-size: 20px
}

.contact_sec {
    background-color: #d2e2ee;
    padding: 30px 10px;
    margin-top: 50px
}

.contact_form {
    background: #fff;
    margin: 30px 0
}

.cntct_frm {
    padding: 20px 30px
}

h6.contct_hdr {
    font-size: 24px;
    padding: 20px 30px 10px;
    border-bottom: 2px solid #337ab3
}

.contact_form .form-group label {
    font-size: 14px;
    font-weight: 600;
    padding-bottom: 6px;
    color: #24315d
}

.contact_form .form-group input {
    font-size: 14px
}

textarea::placeholder {
    font-size: 14px
}

.contact_map {
    height: 100%
}

.contact_submit {
    background-color: #337ab3;
    padding: 10px;
    border-radius: 5px;
    margin-top: 20px
}

.contact_submit a {
    color: #fff;
    font-size: 14px;
    display: grid;
    place-items: center
}

.counter-box p,
span.counter {
    color: #337ab3;
    font-family: var(--font-sen)
}

span.counter {
    font-size: 48px;
    font-weight: 700
}

.counter-box p {
    font-size: 22px;
    font-weight: 400
}

.footer_aboutus ul li a,
.footer_hdr {
    font-size: 15px
}

.footer_hdr>a {
    padding-bottom: 26px
}

.footer_main {
    padding: 70px 10px 0;
    background-color: #337ab3
}

.footer_add,
.footer_dtls a,
.footer_link {
    font-size: 15px;
    color: #fff
}

.footer_dtls {
    align-items: center;
    grid-gap: 12px;
    padding-top: 20px
}
   .form-control:focus {
        color: #fff !important;
        background-color: #337ab3 !important;
        border-color: #fff !important;
        outline: 0 !important;
        box-shadow: 0 0 0 0.25rem rgba(13,110,253,.25) !important;
    }
.footer_hdr {
    font-weight: 600;
    color: #24315d
}

.bb_footer {
    font-size: 25px;
    color: var(--color-white);
    padding-bottom: 30px
}

.footer_hdr1 {
    font-size: 21px;
    font-weight: 600;
    padding-bottom: 18px;
    color: #fff;
    font-family: var(--font-poppins)
}

.footer-link:focus,
.footer-link:hover,
.footer_btn {
    color: #0a58ca
}

.footer_aboutus ul {
    line-height: 24px
}

.footer_btn {
    background-color: #fff;
    border-radius: 0 10px 10px 0
}
.footer_btn:hover{
    background:#337ab3;
    color:#fff;
    border-color: #fff;
}

.footer_letter input {
    background: 0 0;
    border-radius: 8px 0 0 8px;
    font-size: 13px
}

.footer_letter input::placeholder {
    color: #fff
}

.copy_rights {
    padding-bottom: 8px
}

.copy_rights a {
    color: #fff;
    padding-right: 10px
}

.copy_rights span {
    color: #fff
}

#btn-back-to-top {
    position: fixed;
    background: #337ab3;
    border: 1px solid #fff;
    border-radius: 50px;
    bottom: 20px;
    right: 14px;
    width: 50px;
    height: 50px;
    display: none
}

#btn-back-to-top i {
    justify-content: center;
    align-items: center;
    font-size: 26px;
    color: #fff
}

.bba_header {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 100;
    background-color: #337ab3
}

.navbar-toggler-icon,
.navbar.fixed-top.navbar-scrolled.nav-link {
    color: #000
}

.navbar-scrolled {
    background-color: var(--color-steelblue-100);
    padding-top: 10px;
    padding-bottom: 10px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, .1);
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 101
}

.slick-next:before,
.slick-prev:before {
    font-size: 36px;
    line-height: 1;
    opacity: 1 !important;
    font-weight: 700;
    color: #000;
    -webkit-font-smoothing: antialiased
}

.slick-next:focus,
.slick-next:hover,
.slick-prev:focus,
.slick-prev:hover {
    color: #fff;
    outline: #24315d solid 2px
}

img.serv_slider_img {
    width: 300px
}

.serv_slider {
    margin-top: 15%
}

.service_bg {
    position: absolute;
    bottom: -92px;
    left: 30px
}

.service_bg img {
    -webkit-animation: 4s linear infinite spin;
    -moz-animation: 4s linear infinite spin;
    animation: 4s linear infinite spin;
    width: 200px;
    height: 200px;
    object-fit: contain
}

@-moz-keyframes spin {
    100% {
        -moz-transform: rotate(360deg)
    }
}

@-webkit-keyframes spin {
    100% {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

section.tech_sec {
    margin-top: 120px
}

.slick-next,
.slick-prev {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: var(--color-steelblue-200)
}

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

.center-slider .slick-slide,
.center-slider .slick-slide[aria-hidden=true]:not(.slick-cloned)~.slick-cloned[aria-hidden=true] {
    transform: scale(1, 1);
    transition: .4s ease-in-out
}

.center-slider .slick-center,
.center-slider .slick-slide[aria-hidden=true]:not([tabindex="-1"])+.slick-cloned[aria-hidden=true] {
    transform: scale(1.1)
}

.center-slider .slick-current.slick-active {
    transform: scale(1.1);
    position: relative;
    z-index: 5
}

.center-slider .slick-list {
    padding: 0 !important
}

.cta {
    justify-content: space-evenly;
    border: 1px solid #ededed;
    align-items: center
}

.cta img {
    width: 400px;
    height: 240px;
    object-fit: cover
}

.cta__text-column {
    padding: min(1rem, 5vw) min(2rem, 6vw) min(.5rem, 5vw);
    flex: 1 0 53%
}

.cta__text-column>*+* {
    margin: min(1.5rem, 2.5vw) 0 0
}

.cta__text-column h2 {
    font-family: var(--font-sen);
    color: #24315d;
    font-size: 28px;
    font-weight: 600
}

.cta__text-column p {
    font-size: 18px;
    color: #5e6282;
    font-weight: 500;
    font-family: var(--font-poppins)
}

.cardslider-card {
    padding: 20px;
    color: #000;
    font-size: 4rem;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.cardtitle,
.no-center {
    display: block
}

.cardtitle {
    font-size: 1.4rem;
    position: absolute;
    bottom: 20px;
    width: 100%;
    left: 0
}

.cardslider {
    width: 100%;
    height: 100%;
    position: relative
}

.cardslider__cards,
.cardslider__dots-nav {
    margin: 0;
    padding: 0;
    list-style: none
}

.cardslider__cards {
    width: 90%;
    height: 90%;
    position: absolute;
    border-radius: 0 12px 12px 0;
    left: 53%;
    top: 70%;
    transform: translate(-50%, -50%);
    transform-style: preserve-3d
}

.cardslider__dots-nav {
    position: absolute;
    bottom: 41%;
    left: -24px;
    transform: translate(0, -50%) rotate(-270deg)
}

.cardslider__dot {
    display: inline-block;
    margin-right: 8px
}

.cardslider__dot-btn {
    position: relative;
    border-radius: 50%;
    border: 2px solid #037bcb;
    width: 10px;
    height: 10px;
    display: block;
    appearance: none;
    background: 0 0;
    padding: 0
}

.cardslider__dot-btn::before {
    content: " ";
    position: absolute;
    display: block;
    background: #037bcb;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    left: 50%;
    top: 50%;
    transition: .5s;
    transform: translate(-50%, -50%) scale(0)
}

.about_slider .title,
.slide-item .title {
    background: linear-gradient(69deg, rgba(5, 5, 5, 0) -3.63%, rgba(40, 40, 40, .191667) 9.77%, rgba(120, 115, 115, .303718) 19.67%, rgba(172, 170, 170, .4692) 94.6%);
    color: #fff;
    font-size: 20px
}

.cardslider__dot--active .cardslider__dot-btn::before {
    transform: translate(-50%, -50%) scale(1.1)
}

.cardslider__card {
    background: #d7d7d7;
    display: block;
    border-radius: 10px;
    width: 100%;
    height: 50%;
    position: absolute;
    will-change: transform, opacity, background;
    transition: background .5s ease-out, opacity .5s
}

.cardslider__card--transitions {
    transition: background .5s ease-out, transform .5s ease-out, opacity .5s
}

.cardslider__card--index-0 {
    background: #fff
}

.cardslider__card--index-1 {
    background: #f5f5f5
}

.cardslider__card--index-2 {
    background: #ebebeb
}

.cardslider__card--index-3 {
    background: #e1e1e1
}

.cardslider__card--invisible {
    opacity: 0
}

.cardslider--direction-up .cardslider__card {
    transform: scale(.8) translate3d(0, 17.25%, 0)
}

.cardslider--direction-up .cardslider__card--index-0 {
    transform: translate3d(0, 0, 4px)
}

.cardslider--direction-up .cardslider__card--index-1 {
    transform: scale(.95) translate3d(0, 4.31%, 3px)
}

.cardslider--direction-up .cardslider__card--index-2 {
    transform: scale(.9) translate3d(0, 8.61%, 2px)
}

.cardslider--direction-up .cardslider__card--index-3 {
    transform: scale(.85) translate3d(0, 12.91%, 1px)
}

.cardslider--direction-up .cardslider__card--out {
    transform: translate3d(0, 150%, 4px)
}

.cardslider--sortback-up {
    animation: .67s sortback-up
}

.cardslider--sortfront-up {
    animation: .67s sortfront-up
}

.cardslider--direction-down .cardslider__card {
    transform: scale(.8) translate3d(0, -17.25%, 0)
}

.cardslider--direction-down .cardslider__card--index-0 {
    transform: translate3d(0, 0, 4px)
}

.cardslider--direction-down .cardslider__card--index-1 {
    transform: scale(.95) translate3d(0, -17.31%, 3px)
}

.cardslider--direction-down .cardslider__card--index-2 {
    transform: scale(.9) translate3d(0, -32.61%, 2px)
}

.cardslider--direction-down .cardslider__card--index-3 {
    transform: scale(.85) translate3d(0, -51.91%, 1px)
}

.cardslider--direction-down .cardslider__card--out {
    transform: translate3d(0, 150%, 4px)
}

.cardslider--sortback-down {
    animation: .67s sortback-down
}

.cardslider--sortfront-down {
    animation: .67s sortfront-down
}

.cardslider--direction-right .cardslider__card {
    transform: scale(.8) translate3d(-17.25%, 0, 0)
}

.cardslider--direction-right .cardslider__card--index-0 {
    transform: translate3d(0, 0, 4px)
}

.cardslider--direction-right .cardslider__card--index-1 {
    transform: scale(.95) translate3d(-4.31%, 0, 3px)
}

.cardslider--direction-right .cardslider__card--index-2 {
    transform: scale(.9) translate3d(-8.61%, 0, 2px)
}

.cardslider--direction-right .cardslider__card--index-3 {
    transform: scale(.85) translate3d(-12.91%, 0, 1px)
}

.cardslider--direction-right .cardslider__card--out {
    transform: translate3d(150%, 0, 4px)
}

.cardslider--sortback-right {
    animation: .67s sortback-right
}

.cardslider--sortfront-right {
    animation: .67s sortfront-right
}

.cardslider--direction-left .cardslider__card {
    transform: scale(.8) translate3d(17.25%, 0, 0)
}

.cardslider--direction-left .cardslider__card--index-0 {
    transform: translate3d(0, 0, 4px)
}

.cardslider--direction-left .cardslider__card--index-1 {
    transform: scale(.95) translate3d(4.31%, 0, 3px)
}

.cardslider--direction-left .cardslider__card--index-2 {
    transform: scale(.9) translate3d(8.61%, 0, 2px)
}

.cardslider--direction-left .cardslider__card--index-3 {
    transform: scale(.85) translate3d(12.91%, 0, 1px)
}

.cardslider--direction-left .cardslider__card--out {
    transform: translate3d(150%, 0, 4px)
}

.cardslider--sortback-left {
    animation: .67s sortback-left
}

.cardslider--sortfront-left {
    animation: .67s sortfront-left
}

.se_bgdot,
.staffing_dotsbg {
    animation: 3s linear infinite sliderShape;
    -webkit-animation: 3s linear infinite sliderShape
}

/*.cardslider__direction-nav {*/
/*    position: absolute;*/
/*    right: 20px;*/
/*    bottom: 20px*/
/*}*/

.cardslider__nav-next,
.cardslider__nav-prev,
.slick-dots li:nth-child(n+4) {
    display: none
}

@keyframes sortback-down {
    0% {
        transform: translate3d(0, 0, 4px) scale(1)
    }
    50% {
        transform: translate3d(0, 150%, 4px) scale(1)
    }
    60% {
        transform: translate3d(0, 150%, 0) scale(.8)
    }
    100% {
        transform: translate3d(0, 0, 0) scale(.8)
    }
}

@keyframes sortfront-down {
    0% {
        transform: translate3d(0, 0, 0) scale(.8)
    }
    50% {
        transform: translate3d(0, 150%, 0) scale(.8)
    }
    60% {
        transform: translate3d(0, 150%, 4px) scale(1)
    }
    100% {
        transform: translate3d(0, 0, 4px) scale(1)
    }
}

@keyframes sortback-up {
    0% {
        transform: translate3d(0, 0, 4px) scale(1)
    }
    50% {
        transform: translate3d(0, -150%, 4px) scale(1)
    }
    60% {
        transform: translate3d(0, -150%, 0) scale(.8)
    }
    100% {
        transform: translate3d(0, 0, 0) scale(.8)
    }
}

@keyframes sortfront-up {
    0% {
        transform: translate3d(0, 0, 0) scale(.8)
    }
    50% {
        transform: translate3d(0, -150%, 0) scale(.8)
    }
    60% {
        transform: translate3d(0, -150%, 4px) scale(1)
    }
    100% {
        transform: translate3d(0, 0, 4px) scale(1)
    }
}

@keyframes sortback-left {
    0% {
        transform: translate3d(0, 0, 4px) scale(1)
    }
    50% {
        transform: translate3d(-150%, 0, 4px) scale(1)
    }
    60% {
        transform: translate3d(-150%, 0, 0) scale(.8)
    }
    100% {
        transform: translate3d(0, 0, 0) scale(.8)
    }
}

@keyframes sortfront-left {
    0% {
        transform: translate3d(0, 0, 0) scale(.8)
    }
    50% {
        transform: translate3d(-150%, 0, 0) scale(.8)
    }
    60% {
        transform: translate3d(-150%, 0, 4px) scale(1)
    }
    100% {
        transform: translate3d(0, 0, 4px) scale(1)
    }
}

@keyframes sortback-right {
    0% {
        transform: translate3d(0, 0, 4px) scale(1)
    }
    50% {
        transform: translate3d(150%, 0, 4px) scale(1)
    }
    60% {
        transform: translate3d(150%, 0, 0) scale(.8)
    }
    100% {
        transform: translate3d(0, 0, 0) scale(.8)
    }
}

@keyframes sortfront-right {
    0% {
        transform: translate3d(0, 0, 0) scale(.8)
    }
    50% {
        transform: translate3d(150%, 0, 0) scale(.8)
    }
    60% {
        transform: translate3d(150%, 0, 4px) scale(1)
    }
    100% {
        transform: translate3d(0, 0, 4px) scale(1)
    }
}

.cta {
    display: flex;
    background: #fff;
    justify-content: space-evenly;
    border-radius: .8rem;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, .25), 0 -4px 4px 0 rgba(0, 0, 0, .12);
    align-items: center
}

.slick-dots li button:before {
    font-size: 46px;
    border: 1px solid #037bcb;
    border-radius: 50%;
    content: "";
    width: 15px;
    height: 15px;
    opacity: 1
}

.aboutcard_hdr p::before,
.servicecard_hdr h5 span::after,
.servicecard_hdr p::before {
    height: 27px;
    border-bottom: 2px solid #24315d;
    color: #24315d
}

.slick-dots li.slick-active button:before {
    opacity: .75;
    color: #037bcb;
    background: #037bcb
}

.slick-next {
    right: -35px
}

.slick-prev {
    left: -35px
}

.border_sec {
    height: 20px;
    background: #337ab338;
    margin-top: 50px
}

#slider,
.no-padding {
    padding: 0;
    margin: 0
}

.slide-item img {
    height: 600px;
    object-fit: cover
}

.custom_mrgn {
    margin-left: -13px
}

.slide-item .title {
    position: absolute;
    bottom: 96px;
    right: 0;
    font-weight: 600;
    padding: 16px 28px;
    border-radius: 2px;
    border: 0
}

.servslider_sec {
    padding-top: 60px
}

.servicecard_sec {
    margin: 30px 0
}

.servicecard_hdr {
    position: relative;
    padding: 30px 18px
}

.servicecard_hdr p {
    font-size: 18px;
    font-weight: 400;
    color: #24315d;
    margin-left: 50px;
    padding-bottom: 10px;
    font-family: var(--font-sen)
}

.servicecard_hdr p::before {
    content: "";
    position: absolute;
    width: 40px;
    left: 22px;
    margin-right: 76px;
    top: 11%
}

.servicecard_hdr h5 {
    font-size: 33px;
    font-weight: 600;
    width: 50%;
    text-align: start;
    color: #24315d
}

.servicecard_hdr h5 span::after {
    content: "";
    position: absolute;
    width: 70px;
    left: 260px;
    bottom: 15px
}

.blog_text {
    font-size: 15px;
    font-weight: 400
}

.servcard_bg {
    position: absolute;
    right: 94px;
    top: -229px
}

.servcard_bg img {
    width: 100%;
    height: 800px
}

.se_bgdot {
    position: absolute;
    right: 62%;
    top: 8%;
    z-index: -999
}

.se_bgdot img {
    width: 100%;
    height: 110px
}

@keyframes sliderShape {
    0%,
    100% {
        border-radius: 42% 58% 70% 30%/45% 45% 55% 55%;
        transform: translate3d(0, 0, 0) rotateZ(.01deg)
    }
    34% {
        border-radius: 70% 30% 46% 54%/30% 29% 71% 70%;
        transform: translate3d(0, 5px, 0) rotateZ(.01deg)
    }
    50% {
        transform: translate3d(0, 0, 0) rotateZ(.01deg)
    }
    67% {
        border-radius: 100% 60% 60% 100%/100% 100% 60% 60%;
        transform: translate3d(0, -3px, 0) rotateZ(.01deg)
    }
}

.table>:not(caption)>*>*{
  border-bottom: 1px solid #999;
}
.cntct_banner {
  padding: 170px 0 50px 0px;
  position:relative;
}
.cntct_img{
  width: 350px;
  height: 400px;
  object-fit: cover;
}
.get_in h5{
  font-size: 26px;
  font-weight: 400;
  padding-top:6px;
  color: #000;
}
.get_in p {
  color: #24315D;
  text-shadow: 0px 4px 24px rgba(0, 0, 0, 0.25);
  font-size: 30px;
  font-family: var(--font-stix-two-text);
  font-weight: 500;
  line-height: 74px;
}
.cntct_bnrimg {
  width: 520px;
  border-radius: 8px;
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
}
.cnt_bg1{
  position: absolute;
  right: 51%;
  top: 16%;
  z-index: -9;
}
.cnt_bg2{
  position: absolute;
  right: 51%;
  bottom: 10%;
  z-index: -9;
}
.wrk_hdr h5 {
  font-size: 30px;
  font-weight: 500;
  padding-bottom: 10px;
  color: #24315D;
  text-shadow: 0px 4px 24px rgba(0, 0, 0, 0.25);
  font-family: var(--font-stix-two-text);
}
.wrk_hdr p {
  font-size: 16px;
  font-weight: 400;
  padding-bottom: 10px;
  font-family: var(--font-roboto);
}
.hr_mail{
  text-decoration: underline;
  color: #24315D;
}
.curnt_pos{
  color: #6B6B6B;
  font-family:var(--font-roboto);
  font-size: 20px;
}
.job-title {
  font-size: 18px;
  font-family: var(--font-roboto);
  font-weight: 400;
  color: #333;
}
.job-title span{
  display: block;
  font-size: 13px;
  color: #adadad;
  font-family:var(--font-roboto);
} 
.job_update{
  padding-top:22px;
}
.pdf_down i {
  font-size: 24px;
}
.schedule_btn a {
  background: #337ab3;
  padding: 10px 20px;
  color: #fff;
  border-radius: 8px;
  font-family: var(--font-poppins);
}

.third_img img {
    height: 600px
}

.second_img1 img {
    height: 380px;
    object-fit: cover
}

.second_img2 img {
    height: 220px;
    object-fit: cover
}

.first_img1 img {
    height: 250px;
    object-fit: cover
}

.first_img2 img {
    height: 350px;
    object-fit: cover
}

.about_slider .title {
    position: absolute;
    bottom: 50px;
    left: 10px;
    font-weight: 600;
    padding: 8px 20px;
    border-radius: 5px;
    border: 0;
    backdrop-filter: blur(30px)
}

.aboutcard_hdr p::before {
    content: "";
    position: absolute;
    width: 40px;
    left: 24px;
    margin-right: 76px;
    top: 14%
}

.aboutcard_hdr {
    position: relative;
    padding: 20px 18px
}

.aboutcard_hdr p {
    font-size: 24px;
    font-weight: 600;
    color: #24315d;
    margin-left: 50px;
    padding-bottom: 8px
}

.aboutcard_hdr h5 {
    font-size: 26px;
    font-weight: 600;
    width: 50%;
    text-align: start
}

.abtus_hdr {
    font-size: 40px;
    font-weight: 400;
    padding-bottom: 20px;
    color: #24315d
}

.vision_cnt {
    font-size: 21px;
    text-align: start;
    font-weight: 400;
    padding-bottom: 20px
}

.bg_abt1 {
    z-index: 2;
    right: 0;
    top: -70px
}

.bg_abt2 {
    z-index: -999;
    left: 0;
    bottom: 10%
}

.bg_abt3 {
    z-index: -11;
    right: 20px;
    bottom: -3%
}

.bba_abtus {
    padding-top: 120px
}

.bba_abtus img {
    border-radius: 30px
}

.aboutus_main,
.blog_sec {
    margin: 40px 0
}

.blog-title {
    font-size: 19px;
    font-weight: 600;
    padding-bottom: 10px
}

.featuresGrid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-gap: 0
}

.thumbs {
    grid-row: 1;
    grid-column: 5/13;
    z-index: 1
}

.carousel {
    grid-row: 1;
    grid-column: 1/7;
    z-index: 0
}

.carousel .slick-slide img,
.thumbs .slick-slide img {
    width: 100%;
    height: 504px
}

.thumbs .thumb-overlay::after {
    content: "";
    background-color: rgb(255 255 255 / 29%);
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 1;
    transition: opacity .3s linear
}

.staff_heading {
    font-size: 40px;
    font-weight: 500;
    color: #24315d;
    text-shadow: 0 4px 24px rgba(0, 0, 0, .25);
    font-family: var(--font-stix-two-text)
}

.staff_description {
    font-size: 16px;
    line-height: 26px;
    color: #1f1f1f;
    font-weight: 300;
    text-align: justify
}

.staffingbanner_sec {
    padding: 170px 0
}

.staffing-right img {
    width: 400px;
    height: 450px;
    object-fit: cover
}

.dots_bg img {
    width: 130px;
    height: 150px;
    object-fit: cover
}

.staffing_dotsbg {
    top: 74px;
    right: 40%;
    z-index: -99
}

.staffing_dotsbg1 {
    bottom: 68px;
    right: 70px;
    z-index: -99;
    animation: 3s linear infinite sliderShape;
    -webkit-animation: 3s linear infinite sliderShape
}

.recuiremnt_desc h6 {
    font-size: 30px;
    padding-bottom: 20px
}

.recuiremnt_sec {
    margin-bottom: 50px
}

@media only screen and (max-width:1920px) and (min-width:1650px) {
    .servicecard_hdr h5 span::after {
        left: -310px
    }
    img.bba_bn1 {
        height: 545px;
        width:316px;
    }
    img.bba_bn2{
         width:316px;
    }
    .banner_img2 {
        right: 14%
    }
    .banner_img1 {
        bottom: -117px
    }

    .arrow_prev {
        left: 8%
    }
    .arrow_next {
        right: 8%
    }
    .service_bg {
        left: 11%
    }
    .cntct_bnrimg {
        width:520px;
    }
}

@media only screen and (max-width:1650px) and (min-width:1350px) {
    .servicecard_hdr h5 span::after {
        left: -310px
    }
    .banner_img2 {
        right: 82px;
    }
    .cntct_bnrimg {
        width:590px;
    }
    .cnt_bg2 {
     bottom: -2%;
    }
}

@media (max-width:1080px) {
    .cnt_bg2{
        right: 38%;
         bottom: 8%;
    }
    .cnt_bg1{
        right: 38%;
    }
    .cardslider__cards {
        width: 86%;
     }
    .footer_dtls {
        display: block
    }
    .bba_heading {
        font-size: 44px
    }
    .cntct_banner h5{
        font-size:24px;
    }
}

@media (max-width:991px) {
    .mob_service {
        padding-top: 3px !important;
    }
    .get_in {
        padding-bottom: 30px;
    }
    .cnt_bg1 {
        right: 3%;
        top: 8%;
    }
    .cnt_bg2 {
        bottom: 38%;
        right: 3%;
    }
    .cntct_bnrimg {
       width: 100%;
    }
    .clients {
        justify-content: normal !important;
        grid-gap: 11px !important;
     }
    .cardslider__dots-nav{
        left: -18px;
    }
    .cardslider__direction-nav{
        left:0;
    }
    .cardslider__card{
        left:3%;
    }
    .border_line{
        margin-left:0;
    }
    .navbar-nav{
        text-align:center;
    }
    .schedule_btn a{
      padding: 8px 14px;  
    }
    .border_line{
        margin-top:20px;
    }
    .carousel {
        grid-column: 1/13;
        grid-row: 1
    }
    .thumbs {
        grid-column: 1/13;
        grid-row: 2
    }
    .banner-right,
    .navbar-nav li a:hover::after {
        display: none
    }
    .carousel .slick-slide img,
    .thumbs .slick-slide img {
        height: 100%
    }
    .staff_heading {
        font-size: 36px
    }
    .serv_desc p,
    .vision_cnt {
        font-size: 17px
    }
    .bg_abt2 img {
        height: 300px !important
    }
    .abtus_left {
        padding-top: 0 !important
    }
    .slide-wrap {
        margin: 10px
    }
    .aboutcard_hdr h5 {
        font-size: 22px
    }
    #navbarSupportedContent {
        position: relative;
        background-color: var(--color-steelblue-100);
        z-index: 999;
        padding-top: 10px;
        padding-bottom: 10px
    }
    .footer_dtls {
        display: block
    }
    .about-left {
        height: 220px
    }
    .about-right p {
        font-size: 25px;
        padding: 20px 30px;
        font-family: var(--font-sen)
    }
    .about-left img {
        height: 200px
    }
    img.bba_bn1,
    img.bba_bn2 {
        width: 220px;
        height: 400px
    }
    .banner_img1 {
        bottom: -80px;
        right: 250px
    }
    .banner_img2 {
        bottom: -110px;
        right: 20px
    }
    section.banner_sec {
        padding-top: 30px
    }
    .banner-left {
        padding-top: 30px
    }
    .cta__text-column p{
        font-size:15px;
    }
    .cta__text-column h2{
        font-size:24px;
    }
    .cta img{
        height:254px;
    }
}

@media (max-width:767px) {
    .cnt_bg1{
        width:100px !important;
        height:100px !important;
        right: 5%;
        top: 10%;
    }
    .cnt_bg2{
        display:none;
    }
    .client-hdr h5 span{
        display:inline !important;
    }
    .our_clients{
        padding: 30px 0px !important;
    }
    .client-hdr h5{
        text-align:center !important;
        padding: 10px 0px !important;
    }
    .clients{
        display:block !important;
    }
    .client-1{
        text-align:center !important;
        margin-bottom:20px !important;
    }
    .client-2{
        text-align:center !important;
    }
    .cntct_bnrimg {
            width: 100%;
    }
    .cntct_banner {
        padding: 140px 0 24px 0px;
    }
    .staff_row{
        flex-direction: column-reverse;
    }
    .bg_abt3 {
        display: none;
    }
    .cta img,
    .servicecard_hdr h5,
    .slider {
        width: 100%
    }
    .banner-right,
    .bg_vertical,
    .servicecard_hdr h5 span::after,
    .thumbnail-list {
        display: none
    }
    .carousel .slick-slide img {
        height: 100%
    }
    .servcard_bg {
        right: 6px;
        top: -150px
    }
    .staff_heading {
        font-size: 30px
    }
    .staffing-right {
        margin-top: 24px
    }
    .staffing-right img {
        width: 100%;
        object-fit: contain;
        margin-top: 30px
    }
    .recuiremnt_desc {
        padding-top: 26px
    }
    .footer_main {
        padding: 40px 0 0
    }
    .abtus_hdr,
    .footer_dtls {
        padding-top: 10px
    }
    .bb_footer {
        padding-bottom: 10px
    }
    .slide-wrap {
        margin: 10px
    }
    .se_bgdot {
        right: 43%;
        top: 0
    }
    .bg_abt1 img,
    .bg_abt2 img {
        height: 350px !important
    }
    .about-bg {
        bottom: -82%
    }
    .about-bg img {
        height: 360px !important
    }
    .contact_sec {
        padding: 30px 0
    }
    .cta__text-column p,
    .footer_add,
    .footer_dtls a {
        font-size: 16px
    }
    .bba_heading {
        font-size: 52px
    }
    .cardslider__direction-nav{
        top:99px !important;
        left:0 !important;
    }
    .cardslider__dots-nav {
        left: -16px;
        bottom: 34%;
    }
    .cardslider__card{
        width: 100%;
        left: 0;
    }
    .vetrical_rigticon {
        top: 168px !important;
        right: 10px !important
    }
    .footer_link {
        font-size: 13px
    }
    .abt_blgcard {
        margin-bottom: 10px
    }
    .serv_offheader {
        left: 45% !important
    }
    .abtus_right,
    .bba_abtus {
        padding-top: 10px !important
    }
    .wrapper {
        padding-top: 0
    }
    .cta__text-column h2 {
        font-size: 22px
    }
    .cta img {
        height: 160px
    }
    .cta {
        display: block
    }
    .slick-next,
    .slick-prev {
        top: -20px
    }
    .slick-next {
        right: 22px
    }
    .slick-prev {
        left: 74%
    }
    .thumbnail-item {
        flex: 1 1 50%
    }
    .about-right p,
    .footer_hdr1 {
        font-size: 18px
    }
    .footer_aboutus,
    .footer_address,
    .footer_letter {
        padding-top: 20px
    }
    .footer_dtls {
        display: flex;
        padding-bottom: 8px
    }
    .service_sec {
        margin-top: 50px
    }
    section.about_sec {
        padding-top: 90px
    }
    .about-left {
        height: 180px
    }
    .about-left img {
        height: 170px
    }
    .res_img {
        width: 50% !important
    }
    .banner-left {
        padding-top: 50px
    }
    #btn-back-to-top{
        right:40px;
    }
    
}

@media (max-width:630px) {
    .serv_offheader {
        display: none;
        left: 67% !important;
        top: 56%
    }
    .counter-box p {
        font-size: 20px
    }
    .aboutcard_hdr h5 {
        width: 100%
    }
    .thumbs .slick-slide img {
        height: 100%;
        object-fit: cover
    }
    .footer_main {
        padding: 50px 0 0
    }
    .contact_map iframe {
        height: 300px
    }
    .banner-left {
        padding: 0
    }
    .slick-next,
    .slick-prev {
        display: none !important
    }
    .cardslider__cards {
        left: 54%
    }
}

@media (max-width:580px) {
    .client-1{
        margin-top:10px;
    }
    .banner_bg{
        /*background-image:url(../images/mob_bannerbg.webp);*/
        background-size: cover;
        background-position: center;
    }
    .slide-wrap:hover, .tech_cnt:hover{
        transform: none;
    }
    .cntct_banner{
        padding: 140px 20px 24px 20px;
    }
    .servcard_bg {
        right: 6px;
        top: 0
    }
    .servcard_bg img {
        height: 460px
    }
    .se_bgdot img {
        display:none;
    }
    .se_bgdot {
        right: 20%;
        top: 0
    }
    .staffingbanner_sec {
        padding: 40px 0
    }
    .container {
        padding: 0 30px
    }
    .about-right p {
        font-size: 21px;
        padding: 20px 0
    }
    .banner_bg {
        min-height: 75vh;
        border-radius: 0 0 42px 42px;
    }
    .footer_letter {
        padding-top: 14px
    }
    .footer_aboutus {
        padding-top: 8px
    }
    .footer_address {
        padding-bottom: 8px
    }
    .bb_name {
        font-size: 20px
    }
    .about-right {
        margin-top: 50px
    }
    .img_abt2 {
        right: 10px;
        bottom: 70px
    }
    .img_abt1 {
        left: 0;
        top: 70px
    }
    .about-left {
        background-size: auto;
        background-position-x: center
    }
    .copy_rights span {
        font-size: 14px
    }
}

@media (max-width:560px) {
    .staffing_dotsbg {
        top: 130px;
        right: 14px;
    }
    .dots_bg img {
        width: 100px;
        height: 96px;
    }
    .bba_description {
        font-size: 14px;
        line-height:24px;
    }
    .bba_heading {
        font-size: 30px
    }
    .servicecard_hdr p::before {
        top: 8%
    }
    .icon-display-1{
       display: block !important;
    }
    .icon-display{
        display:none !important;
    }
    .get_in p{
        font-size:24px;
        line-height:50px;
    } 
    .get_in{
         position:absolute;
        bottom:0;
        padding-bottom:0;
    }
    .job_tbl{
        margin-bottom: 30px;
    }
    .wrk_update {
        margin: 30px 0px;
    }
    .job_update {
        padding-bottom:20px;
    }
    .cnt_bg1 {
        right: 5%;
        top: 11%;
    }
}

@media (max-width:460px) {
    .cardslider__cards {
        width: 80%;
        left:60%;
     }
    .slide-wrap {
          margin: 10px 19px !important;
          width:260px !important;
    }
    /*.serv_hdr h5{*/
    /*    padding: 44px 24px !important;*/
    /*}*/
    .arrow_next {
        bottom: -30px;
        right: 25%;
        top:inherit ;
    }
    .arrow_prev {
        bottom: -30px;
        left: 25%;
        top:inherit ;
    }
    .res_img1{
        margin-top: 43px;
        width: 100px;
    }
    .res_img {
        width: 100% !important;
    }
    .tech_cap p {
        font-size: 14px;
    }
    .bg_abt1 img,
    .bg_abt2 img {
        height: 300px !important
    }
    .cta__text-column h2 {
        font-size: 18px
    }
    .cardslider__dots-nav {
        left: -16px
    }
    .serv_offheader {
        left: 75% !important;
        top: 64%
    }
    .vetrical_rigticon {
        display: none !important
    }
    .cta__text-column p {
        font-size: 12px
    }
    .staffing-right,
    .staffing-right img {
        margin-top: 0
    }
    .bg_abt3 img {
        height: 110px !important
    }
    .bg_abt2 img {
        height: 250px !important
    }
    .banner-left {
        padding: 0
    }
    .cardslider__cards {
        height: 100%;
        top: 60%
    }
    .banner_main {
        margin-top: 20%
    }
    .recuiremnt_desc h6 {
        font-size: 25px
    }
    section.banner_sec {
        padding-top: 0
    }
}


.wrapper {
    height: 450px;
    width: 100%;
    display: flex;
    justify-content: center;
    position: relative
}

.bg_vertical {
    position: absolute;
    z-index: -999;
    right: -32px;
    bottom: -16px
}

.bg_vertical img {
    width: 80%;
    height: 200px;
    -webkit-animation: 4s linear infinite spin;
    -moz-animation: 4s linear infinite spin;
    animation: 4s linear infinite spin;
    object-fit: contain
}

.vetrical_rigticon {
    display: block;
    right: 38px;
    position: absolute;
    font-size: 36px;
    top: 60px
}

.carousel,
.carousel__item {
    display: flex;
    position: relative
}

.carousel {
    width: 100%;
    max-width: 100%;
    flex-direction: column
}

.carousel__item {
    align-items: center;
    padding: 12px 0;
    opacity: 0;
    transform: translateY(100%);
    transition: opacity .5s, transform .5s
}

.carousel__item:first-child {
    transition-delay: 0s
}

.carousel__item:nth-child(2) {
    transition-delay: 3s
}

.carousel__item.active {
    opacity: 1;
    transform: translateY(0)
}

.cursor {
    display: block;
    width: 30px;
    height: 30px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%);
    border-radius: 50%;
    background: 0 0;
    pointer-events: none;
    z-index: 111;
    border: 2px solid #0a58ca;
    transition: .2s ease-out;
    animation: .5s infinite alternate moveCursor1
}

.expand {
    background: 0 0;
    animation: .5s forwards moveCursor2;
    border: 1px solid #000
}

.abt_animbg,
.abt_animbg1 {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    transition: background-image .5s
}

@keyframes moveCursor1 {
    from {
        transform: scale(1)
    }
    to {
        transform: scale(.8)
    }
}

@keyframes moveCursor2 {
    0% {
        transform: scale(1)
    }
    50% {
        transform: scale(2)
    }
    100% {
        transform: scale(1);
        opacity: 0
    }
}

.abt_animbg1 {
    -webkit-animation-name: scale-with-background;
    animation-name: scale-with-background;
    -webkit-animation-duration: 20s;
    animation-duration: 20s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    animation-direction: alternate
}

.abt_animbg {
    -webkit-animation-name: moving_position_animatin;
    animation-name: moving_position_animatin;
    -webkit-animation-duration: 4ms;
    animation-duration: 40s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    animation-direction: alternate
}

@-webkit-keyframes scale-with-background {
    from {
        transform: scale(1)
    }
    to {
        transform: scale(1.5)
    }
}

@keyframes scale-with-background {
    from {
        transform: scale(1)
    }
    to {
        transform: scale(1.5)
    }
}

@keyframes moving_position_animatin {
    0%,
    100% {
        transform: translateY(0)
    }
    50% {
        transform: translateY(-50px)
    }
}

.error {
    color: red;
    font-size: 90%
}

input[type=submit] {
    font-size: 18px;
    width: 100%;
    font-weight: 100;
    background: #337ab3;
    box-shadow: 0 3px 0 #337ab3;
    border: 2px solid #337ab3;
    color: #fff;
    margin-top: 10px;
    cursor: pointer;
    font-family: var(--font-sen)
}

input[type=submit]:hover {
    background: #fff;
    color: #337ab3;
    transition: ease-in-out;
    font-weight: 600;
    box-shadow: none;
    border: 2px solid #337ab3
}

.textarea.form-control::placeholder {
    font-size: 22px
}

/*Navbar toggle css*/

/* Remove border from toggler */
.navbar-toggler {
  border: 0 !important;
}

.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler-icon:focus {
  outline: none !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* Lines of the Toggler */
.toggler-icon{
  width: 24px;
  height: 2px;
  background-color: #ffffff;
  display: block;
  transition: all 0.2s;
}

/* Adds Space between the lines */
.middle-bar{
  margin: 5px auto;
}

/* State when navbar is opened (START) */
.navbar-toggler .top-bar {
  transform: rotate(45deg);
  transform-origin: 60% 80%;
}



.navbar-toggler .bottom-bar {
  transform: rotate(-45deg);
  transform-origin: 30% -70%;
}
/* State when navbar is opened (END) */

/* State when navbar is collapsed (START) */
.navbar-toggler.collapsed .top-bar {
  transform: rotate(0);
}

.navbar-toggler.collapsed .middle-bar {
  opacity: 1;
  filter: alpha(opacity=100);
}

.navbar-toggler.collapsed .bottom-bar {
  transform: rotate(0);
}
/* State when navbar is collapsed (END) */

/* Color of Toggler when collapsed */
.navbar-toggler.collapsed .toggler-icon {
  background-color: #fff;
  margin-top: 5px;
}


/*clients css*/
.our_clients{
  background: #F1FCFA;
  padding: 60px 0px;
  margin-top: 20px;
}
.clients{
  display: flex;
  align-items: center;
  justify-content: space-around;
  grid-gap:30px;
}
.client-hdr h5 {
  font-size: 28px;
  font-weight: 600;
  padding: 30px 0px;
  color: #24315D;
}
/*.client-hdr h5 span{*/
/*    display:block;*/
/*}*/
.clients img {
  width: 200px;
  height: 130px;
  object-fit: contain;
}
.client-1,.client-2{
  padding: 12px 70px;
  background: #F1FCFA;
  border-radius: 12px;
}
/*.client-2:hover{*/
/*  background: #fff;*/
/*}*/
/*.client-1:hover{*/
/*  background:#fff;*/
/*}*/
.clients h2{
  font-size: 20px;
  text-align: center;
  color: #24315d;
}
.icon-display{
    display:block;
}
.icon-display-1{
    display:none;
}
.icon-display-1 img{
    width:40px;
}

/*new navigation css*/
      .cardslider__direction-nav {
        position: absolute;
        left: 36px;
        top: 170px;
      }
    .cardslider__nav-next, .cardslider__nav-prev {
      display: block;
      background: none;
      border: none;
      width: 50px;
      height: 50px;
      text-indent: -9999px;
      outline: none;
      transition: all .3s;
      }
      .cardslider__nav-next:active, .cardslider__nav-prev:active {
        transform: scale(0.8);
        }
    .cardslider__nav-next {
      margin-bottom: 10px;
      background-image: url("../images/down_verarrow.png");
      background-size: contain;
      width:36px;
      height:36px;
     }
    .cardslider__nav-prev {
      background-image: url("../images/up_verarrow.png");
      background-size: contain;
      width:36px;
      height:36px;
     }