.textdanger, .textdanger1, .textdanger2 {
    color: red !important;
}

.textsuccess {
    color: green !important;
    -moz-animation: cssAnimation 0s ease-in 7s forwards;
    /* Firefox */
    -webkit-animation: cssAnimation 0s ease-in 7s forwards;
    /* Safari and Chrome */
    -o-animation: cssAnimation 0s ease-in 7s forwards;
    /* Opera */
    animation: cssAnimation 0s ease-in 7s forwards;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}

@keyframes cssAnimation {
    to {
        width: 0;
        height: 0;
        overflow: hidden;
    }
}

@-webkit-keyframes cssAnimation {
    to {
        width: 0;
        height: 0;
        visibility: hidden;
    }
}

h5 {
    font-weight: 600;
    font-size: 18px;
    margin-bottom: 1rem
}

hr:not([size]) {
    height: 2px;
}

hr {
    opacity: 0.1;
}


    hr:hover {
        background-color: #c03;
        opacity: 1
    }

.icons {
    color: #c03;
    font-weight: 600;
    font-size: 35px;
    margin-bottom: 1rem;
}

.description {
    color: #2569e6;
    font-size: 16px;
    font-weight: 600
}

.paragraph-text {
    color: #6d6d6d;
    font-size: 16px;
}

.choose-us {
    background-color: #343352;
}

.cards {
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #46416B;
    margin-bottom: 20px;
    border-radius: 10px;
}

.cards {
    overflow: hidden;
    position: relative;
    padding: 43px 30px 43px;
    height: 300px;
    background: #262051;
    color: #aeaacb;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
}

    .cards .big-number {
        position: absolute;
        left: -10px;
        top: 0;
        font-size: 100px;
        font-weight: 800;
        line-height: 72px;
        color: #332d5f;
        transition: all 0.3s linear;
        -webkit-transition: all 0.3s linear;
        -moz-transition: all 0.3s linear;
        -o-transition: all 0.3s linear;
        -ms-transition: all 0.3s linear;
    }

    .cards .icon-main {
        position: absolute;
        bottom: -88px;
        right: -88px;
        width: 188px;
        height: 188px;
        color: #fff;
        background: #332d5f;
        border-radius: 50%;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        transition: all 0.3s linear;
        -webkit-transition: all 0.3s linear;
        -moz-transition: all 0.3s linear;
        -o-transition: all 0.3s linear;
        -ms-transition: all 0.3s linear;
    }

    .cards .content-box {
        position: relative;
        z-index: 1;
        height: inherit;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }



        .cards .content-box h5 {
            font-size: 20px;
            color: white;
        }

        .cards .content-box .btn-details {
            display: inline-block;
            margin-bottom: 90px;
            box-shadow: none;
            text-decoration: none;
        }

        .cards .content-box div {
            line-height: 30px;
            font-size: 14px;
            color: #aeaacb;
        }

.btn-details {
    font-size: 0.9rem;
}

.cards:hover {
    background: white;
}

    .cards:hover .content-box h5 {
        color: black;
    }

    .cards:hover .big-number {
        color: #f4f6f6;
    }

    .cards:hover .icon-main {
        background: #f4f6f6;
    }

    .cards:hover .content-box div {
        color: black;
    }

a:hover {
    text-decoration: none;
}

.site-link {
    color: #0091ff;
    text-decoration: none;
}

    .site-link:hover {
        text-decoration: underline;
    }

.learn-more {
    text-decoration: none;
    color: #fff;
}

    .learn-more:hover {
        color: #2e2e2e;
    }

.special-text {
    color: white;
    font-size: 35px;
    font-weight: bold;
}

.special-text-for-Data-visual {
    font-size: 35px;
    font-weight: bold;
}

.page-heading {
    color: #c03;
    font-size: 28px;
}

.cool-link {
    color: #000;
}

    .cool-link::after {
        content: '';
        display: block;
        width: 0;
        height: 2px;
        background-color: #2569e6;
        transition: width .3s;
    }

    .cool-link:hover::after {
        width: 100%;
        /*transition: width .3s;*/
    }


.p-f-size {
    font-size: 14px;
}

.primary-color {
    color: #c03;
    font-size: 32px;
    position: relative;
    text-align: center;
}

/* .primary-color::after {
        content: '';
        position: absolute;
        height: 3px;
        background: #c03;
        width: 6%;
        top: 100%;
        left: 47%;
    }*/

.sub-heading {
    color: #2e2e2e;
    font-size: 20px;
    font-weight: bold;
}

.font-size-slider {
    font-size: 18px;
}

.border-right {
    border-right: solid 1px #d3e0e6;
    padding: 8px 40px 8px 0;
}

.w-20 {
    width: 20%;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #2b2637;
    min-width: 50vw;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

@media (max-width: 1185px) {
    .dropdown-content {
        display: none;
        position: absolute;
        background-color: #2b2637;
        min-width: 60vw;
        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
        z-index: 1;
    }
}

/*@media (max-width: 768px) {
    .dropdown-content {
        display: none;
        position: absolute;
        background-color: #2b2637;
        min-width: 70vw;
        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
        z-index: 1;
    }
}*/


/* Links inside the dropdown */
.dropdown-content a {
    color: #999999;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

    /* Change color of dropdown links on hover */
    .dropdown-content a:hover {
        color: white;
        background-color: #2b2637;
    }


/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
    display: flex;
}

.font-size {
    font-size: 12px;
    margin-top: 5px;
}


@media all and (min-width: 992px) {
}


/* Contact Us Styling */
input[type=text] {
    /*    border-radius: 8px;
    padding: 18px 30px;
    margin-top: 19px;
    background-color: #f5f6ff;
    border: none;
    outline: none;
    font-size: 12px;*/

    background: #f9f9fa;
    border: 1px solid #e6e6e6;
    margin-bottom: 25px;
    width: 100%;
    height: 48px;
    padding: 0 15px 0 10px;
    text-indent: 5px;
    font-size: 16px;
    border-radius: 0;
    display: block;
    color: #777777;
    opacity: 1;
    outline: none;
}

    input[type=text]:focus, textarea:focus {
        background: #fff !important;
        border-color: #00c752 !important;
        -webkit-box-shadow: 0 0 0 2px #e0f8ea !important;
        box-shadow: 0 0 0 2px #e0f8ea !important;
    }

textarea {
    padding: 10px 15px;
    height: 96px;
    resize: none;
    width: 100%;
    background: #f9f9fa;
    border: 1px solid #e6e6e6;
    overflow-x: hidden;
}

textarea {
    padding: 10px 15px;
    height: 96px;
    resize: none;
    width: 100%;
    background: #f9f9fa;
    border: 1px solid #e6e6e6;
    overflow-x: hidden;
    text-indent: 5px;
    outline: none;
}

    textarea:focus {
        background: #fff;
        border-color: #00c752;
        -webkit-box-shadow: 0 0 0 2px #e0f8ea;
        box-shadow: 0 0 0 2px #e0f8ea;
    }

label, .label {
    font-weight: normal;
    color: #555;
    margin-bottom: 5px;
    display: block;
    text-align: left;
}




.title {
    font-size: 14px;
    margin-top: 12px;
}

.desc {
    font-size: 14px;
    margin-top: -16px;
}

.form-group {
    margin-top: 39px;
}

.about {
    margin-top: 31px;
    font-size: 14px;
}

.top-margin {
    margin-top: 54px;
}

.margin {
    margin-top: 28px;
}

/* Footer Styling started here */
.footer-p-text-size {
    font-size: 16px;
}

@media only screen and (max-width: 1300px) {

    .buttons {
        display: flex;
        justify-content: space-around;
        align-items: center;
        margin-top: 10px;
        padding-bottom: 20px;
    }

    .bg-color {
        /*height: calc(100vh - 3rem);*/
        /*margin-bottom: 20px;*/
        display: flex;
        align-items: center;
    }
}

.foton {
    margin-top: 50px;
}

.main-color {
    color: #fff;
}

.margin_footer {
    margin-top: 50px;
}

.twitter {
    margin-top: 10px;
}

    .twitter:hover {
        background-color: #1DA1F2;
        color: #fff;
    }

.facebook:hover {
    background-color: #3B5998;
    color: #fff;
}

.google:hover {
    background-color: #C20806;
    color: #fff;
}

.linkedin:hover {
    background-color: #0a66c2;
    color: #fff;
}

.social-icon a + a {
    margin: 5px;
}

.footer-ul {
    padding-left: 0px !important;
}

    .footer-ul li {
        list-style: none;
        display: flex;
    }

.footer-ul-service {
    list-style: none;
    line-height: 3;
    margin-top: -10px;
    padding-left: 0px !important;
}

    .footer-ul-service li a {
        text-decoration: none;
        color: #fff;
    }

.special-margin {
    margin-left: 30px !important;
}

.footer-ul li a {
    text-decoration: none;
    color: #fff;
    margin-left: 18px;
    font-size: 14px;
}

.footer-icon i {
    color: #fff;
    font-size: 12px;
}

.footer_contact_info {
    margin-top: 21px;
}


.support_margin {
    margin-top: 107px;
}

.text_margin {
    margin-top: 26px;
}

.custom_btn {
    outline: none;
    border: 2px solid #fff;
    background-color: #343352;
    color: #fff;
    border-radius: 6px;
    font-size: 12px;
    width: 121px;
    padding: 0px 5px;
    margin-right: 16px;
}

.buttons {
    display: flex;
    justify-content: space-around;
    margin-top: 40px;
}

.fa-apple {
    font-size: 20px;
}

.bubble {
    /* height: 150px;
     width:255px ; */
    background-color: #2f2e4a;
    margin-top: 158px;
    border-radius: 12px;
    position: relative;
    font-size: 14px;
}

    .bubble:after {
        content: "";
        position: absolute;
        top: 100%;
        left: 20px;
        border-top: 20px solid #2f2e4a;
        border-top-color: #2f2e4a;
        border-left: 3px solid transparent;
        border-right: 20px solid transparent;
    }

.bubble_text {
    font-size: 13px;
    padding: 17px 21px;
}

.twiter_icon_box {
    display: flex;
    align-items: center;
    margin-top: 20px;
}

    .twiter_icon_box p {
        font-size: 16px;
        margin-left: 20px;
    }

.two_days {
    font-size: 13px;
    margin-left: 66px;
    margin-top: -15px;
}

.font-footer {
    font-size: 14px;
    color: #fff;
}

.circle {
    padding: 15px;
    font-size: 20px;
    text-align: center;
    text-decoration: none;
    border-radius: 50%;
    margin-right: 0.4rem;
    background: white;
    color: #2e2e2e;
    width: 52px;
    cursor: pointer;
}

.fa-facebook-f:hover {
    background: #3B5998;
    color: white;
}

.fa-linkedin-in:hover {
    background: #0a66c2;
    color: white;
}

/*.footer-social {
    padding: 12px 14px;
    background: white;
    border-radius: 50%;
    text-decoration: none;
    color: #2e2e2e;
    margin-right: 0.5rem;
}
.facebook:hover {
    background-color: #3B5998;
    color: #fff;
}
.linkedin:hover {
    background-color: #0a66c2;
    color: #fff;
}*/

/* .font {
    font-size: 40px;
    
} */

.font-contact {
    font-size: 26px;
}

/* .suport-font {
    font-size: 26px;
} */

.main-text {
    font-size: 16px;
}

.small-text {
    font-size: 10px;
}

.slider-text {
    padding: 10% 11%;
    /*background-color:antiquewhite;*/
}

.slider-text {
    animation: 1s ease-out 0s 1 slideInFromLeft;
}

.imgage-holder {
    animation: 1s ease-out 0s 1 slideInFromRight;
}

@keyframes slideInFromLeft {
    0% {
        transform: translateX(-100%);
    }

    100% {
        transform: translateX(0);
    }
}

@keyframes slideInFromRight {
    0% {
        transform: translateX(100%);
    }

    100% {
        transform: translateX(0);
    }
}

/* What we do styling started here */
.bg-color {
    background-image: linear-gradient(90deg, #1c4972, #0086ff);
    /*height: 100vh;*/
    display: grid;
    padding: 100px 0;
    align-items: center;
}

.we-do::after {
    content: '';
    position: absolute;
    height: 3px;
    background: #c03;
    width: 6%;
    top: 100%;
    left: 47%;
}

.margin-bottom-do {
    margin-bottom: 10px;
}

.service-title {
    font-size: 20px;
    font-weight: bold;
}

.service-des {
    font-size: 14px;
    font-weight: 500;
}

.service-read-more a {
    text-decoration: none;
    text-align: center;
}


.service-read-more {
    display: flex;
    justify-content: center;
}

    .service-read-more a {
        font-size: 14px;
        font-weight: bold;
    }

        .service-read-more a i {
            margin-left: 4px;
        }

.right-icon i {
    color: #c03;
    font-size: 14px;
}

/* What we do styling ended here */
/* Our services section styling  of sercives page*/
.box-wrapper {
    padding: 33px 35px;
}

    .box-wrapper:hover {
        background: #fff;
        border-radius: 10px;
        box-shadow: rgb(191 191 191) 0px 0px 12px 0px;
    }

.p-wrapper {
    margin: auto 0px;
}

.stack-list:hover {
    list-style: none;
    border-left: 0px;
}

.image-height {
    width: 90%;
}

.margin-services-top {
    margin-top: 0px !important;
}

.service-our-service {
    padding: 33px 35px;
}

    .service-our-service:hover {
        background: #fff;
        border-radius: 10px;
        box-shadow: rgb(191 191 191) 0px 0px 12px 0px;
    }


.our-services::after {
    content: '';
    position: absolute;
    height: 3px;
    background: #c03;
    width: 6%;
    top: 100%;
    left: 47%;
}

/* Circle with social Icon styling */
.dot {
    height: 90px;
    width: 90px;
    border-radius: 50%;
    display: inline-block;
    box-shadow: rgb(132 183 210) 4.2px 4px 0px 0px;
    background-image: linear-gradient(180deg, #008ad3, #176b93);
}

    .dot i {
        font-size: 40px;
        color: #fff;
        padding: 22px 0;
    }

/* end of services section styling */
/* our client section styling started here */

.our-happy-client {
    background-color: #3790be;
    min-height: 150px;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.calander-icon i {
    font-size: 60px;
    color: #fff;
    /* margin-top: 30px; */
}

.client-title {
    margin-top: 10px;
    font-size: 44px;
    color: black;
    font-weight: bolder;
}

.client-desc {
    color: black;
    font-size: 16px;
    font-weight: 900;
}

.client-section {
    list-style: none;
    padding: 0;
    text-align: center;
    margin: 0;
}

    .client-section span, .client-section-last span {
        color: #2569e6;
    }

.client-section-last {
    list-style: none;
    padding: 0;
    text-align: center;
    margin: 0;
}

.col-padding {
    padding: 20px 0px;
}

/* end of client section styling */

/* Our Services Page Styling  started*/

.padding-services {
    padding: 30px 0px;
}

.container-bg {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
}

.left-side-bg {
    padding-top: 80px;
    padding-bottom: 80px;
    padding-left: 180px;
}

.right-side-bg {
    padding-top: 80px;
}


.decs-para {
    font-size: 19.2px;
    line-height: 1.8;
}

.margin-top-asp {
    margin-top: 100px;
}

.margin-top-img {
    margin: auto 0px;
}

.sercices-list {
    list-style: none;
    border-left: 1px solid black;
    position: relative;
    margin-top: -30px;
}

    .sercices-list li {
        font-size: 24px;
        line-height: 2.5;
    }

        .sercices-list li::before {
            content: "•";
            font-size: 300%;
            position: absolute;
            left: -12px;
            margin-top: 12px;
            line-height: .6;
            color: #c8c8c8;
        }

        .sercices-list li:hover:before {
            content: "•";
            font-size: 300%;
            position: absolute;
            left: -12px;
            line-height: .6;
            color: #c03;
        }

        .sercices-list li:hover {
            color: #2e2e2e;
        }

    .sercices-list li {
        color: #8d8d8d;
    }

.btn-custom {
    line-height: 1;
    font-size: 14px;
    border-radius: 0px;
    border: none;
    outline: none;
    background-color: #c03 !important;
    color: #fff;
    font-weight: bold;
    padding: 15px 83px;
}

.stack-list {
    border-left: 1px solid;
    padding: 0px 11.5px;
}

    .stack-list li {
        font-size: 14px;
    }

.font-weight-bold {
    font-weight: 700;
}

.stack {
    font-size: 20px;
    font-weight: bold;
    margin-top: 15px;
}

.our-services-section {
    margin-top: 120px;
    background-color: #f3f6fb;
}

.f-size-hire-dec {
    font-size: 14px;
    text-align: center;
    padding-bottom: 10px;
}

.hr-margin-top {
    margin-top: 46px;
}

.aspnet-box {
    background: #ebf5ff;
}

.hr-title {
    background-color: #343352;
    font-size: 22px;
    font-weight: bold;
    color: #fff;
    padding: 5px
}

.industries-box {
    border: 1px dashed;
}

    .industries-box:hover {
        background: #ebf5ff;
    }

.box-image {
    width: 150px;
    padding: 20px;
}

.indurtries-margin {
    margin-top: 45px;
}

.expert-wrapper {
    background-color: #343352;
    padding-top: 35px;
    padding-left: 40px;
    padding-bottom: 15px;
    margin-top: 90px;
}

.text-change {
    font-size: 14px;
}

.expert-btn {
    line-height: 1;
    font-size: 14px;
    border-radius: 0px;
    border: none;
    outline: none;
    color: #fff;
    background: #c03;
    padding: 15px 60px;
    color: #fff
}
/* Our Services Page Styling ended here */
/* Data Visualization Page Styling Started Here */

.fixed-margin {
    margin-top: 40px;
}

.sub-menu {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .sub-menu p a {
        text-decoration: none;
        font-size: 20px;
        font-weight: bold;
        color: #2e2e2e;
    }

.sub-menu-item {
    border-top: 1px solid #bcbcbc;
    position: relative;
}

    .sub-menu-item::before {
        content: '';
        position: absolute;
        height: 5px;
        width: 5px;
        background-color: #bcbcbc;
        bottom: 36px;
        left: -12px;
    }

.card-wrapper {
    padding: 30px;
    background-color: #fff;
    box-shadow: rgb(191 191 191) 0px 0px 12px 0px;
}

.paragraph {
    font-size: 14px;
}

.button-wrapper {
    margin-top: 60px;
}

.btn-d-v {
    line-height: 1;
    font-size: 14px;
    border-radius: 0px;
    border: none;
    outline: none;
    background-color: #c03;
    color: #fff;
    font-weight: bold;
    padding: 15px 10px;
}

.li-desc li {
    font-size: 17px;
    list-style: none;
    position: relative;
}

    .li-desc li::before {
        content: '';
        background-color: #c03;
        left: -20px;
        top: 8px;
        height: 8px;
        width: 8px;
        position: absolute;
    }

.dv-p-font {
    font-size: 14px;
}

.use-case-box {
    border: 1px solid #dadfe3;
    height: 100%;
    padding: 25px 20px;
    position: relative;
}

    .use-case-box::before {
        content: '';
        height: 10px;
        width: 100%;
        background-color: #c03;
        position: absolute;
        left: 0%;
        top: 0%;
    }

.performance-list {
    font-size: 14px;
}

.performance-list {
    list-style: none;
}

    .performance-list li::before {
        content: '';
        background-color: #c03;
        height: 8px;
        width: 8px;
        left: 24px;
        margin-top: 6px;
        position: absolute;
    }

.bi-demo-section {
    border: 1px solid #dadfe3;
    padding: 30px 12px;
    box-shadow: rgb(191 191 191) 0px 0px 12px 0px;
}

.vertical-center {
    margin: auto 0px;
}
/* portflio slider styling */
.image-inside-slider {
    width: 100%;
}

.slider-content {
    padding: 31px 32px;
}

.slider-border {
    border: 1px solid #dadfe3;
    margin-top: 28px;
}

.offer-service {
    margin-top: 50px;
}

.slider-para {
    margin-top: 20px;
    font-size: 20px;
}

.h-slider {
    height: auto !important;
}

.carousel-dark .carousel-indicators [data-bs-target] {
    background-color: #c03 !important;
    height: 10px;
    width: 10px;
}

.carousel-indicators {
    bottom: -50px !important;
}

.slider-bg {
    border: 1px solid #dadfe3;
}

.slider-list li {
    list-style: none;
    position: relative;
    font-size: 17px;
}

    .slider-list li::before {
        content: '';
        position: absolute;
        background-color: #c03;
        height: 8px;
        width: 8px;
        left: -15px;
        top: 6px;
    }

.project-detail {
    float: right;
}

.offer-service-wrapper {
    border: 1px solid #dadfe3;
    padding: 30px 25px;
    position: relative;
}

    .offer-service-wrapper::before {
        content: '';
        position: absolute;
        background-color: #c03;
        height: 10px;
        width: 100%;
        top: 0;
        left: 0;
    }

.offer-service-list {
    padding-bottom: 25px;
}

    .offer-service-list li {
        list-style: none;
    }

    .offer-service-list > li::before {
        content: '';
        position: absolute;
        background-color: #c03;
        height: 6px;
        width: 6px;
        left: 30px;
        margin-top: 8px;
    }

.button-offer-service {
    text-align: center;
}

.button-ofer {
    line-height: 1;
    font-size: 14px;
    border-radius: 0px;
    border: none;
    outline: none;
    background-color: #c03 !important;
    color: #fff;
    font-weight: bold;
    padding: 18px 100px;
}

.h-center {
    text-align: center;
}

.priceing-card {
    border: 1px solid #dadfe3;
    padding: 25px;
}

.bg-btn {
    background-color: #c03;
}

#carouselExampleIndicators {
    height: 10vh;
}

.list-wrap {
    margin-top: 55px;
}

.margin-corporate-row {
    margin-top: 0.4rem;
}

.margin-top-fix {
    margin-top: 22px;
}

.content-case-box img {
    width: 70%;
}

.carousel-control-next, .carousel-control-prev {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    color: #fff;
    text-align: center;
    background: 0 0;
    border: 0;
    opacity: .5;
    transition: opacity .15s ease;
    width: auto;
}


/* Carousel  styling ended here */
/* Data Visualization Page Styling ended Here */







/* Why EezahTech Page Styling Started here */

.dna-wrapper {
    padding: 20px 0px;
}

.why-bg {
    background-color: #2b2637;
}

.trust-wrapper {
    padding-top: 106px;
    padding-bottom: 23px;
    width: 57%;
    margin: 0px auto !important;
}

.dna-card {
    padding: 40px 50px;
    background-color: #fff;
    text-align: center;
}

    .dna-card:hover {
        transition: 0.2s all ease-out;
        background-color: #4fd6e5;
        box-shadow: 0 6px 12px 0 rgb(79 214 229 / 20%);
        margin-top: -10px;
        opacity: 1;
    }

    .dna-card .img-2 {
        opacity: 0;
    }

    .dna-card:hover + .img-one {
        opacity: 0;
        display: none;
    }

.mt-8 {
    margin-top: 36px;
}

.counter-wrapper {
    position: relative;
    text-align: center;
    padding-bottom: 70%;
    width: 70%;
    height: 0;
    border-radius: 50%;
    background-color: #4fd6e5;
    position: relative;
    margin: 0 auto;
}

.plus {
    margin-top: 5px;
    font-size: 42px;
    font-weight: bold;
}

.center {
    margin: auto;
    width: 50%;
}


.counter {
    font-weight: bold;
    font-size: 42px;
    padding: 3px;
}

.small-icon-wrapper figure {
    float: left;
}

.sm-decs {
    padding-top: 8px;
}

.counter-list {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 45%;
    transform: translate(-54%, -50%);
}

    .counter-list li {
        list-style: none;
    }

.bs-media-elements::before {
    width: calc(33.33333% - 20px);
    right: 0;
    left: auto;
    top: 0;
}

.client-say-wrapper {
    background-color: #edf2f4;
    padding: 90px 0px;
}

.img-width {
    width: 90px;
}

.image-client-section {
    position: relative;
}

    .image-client-section::before {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        left: 40%;
        top: 50%;
        position: absolute;
    }

    .image-client-section::after {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        right: 40%;
        top: 50%;
        position: absolute;
    }

.width-client {
    width: 60%;
}

.why-form-wrapper {
    background-color: #2b2637;
    padding: 90px;
}

.check-box-wrap {
    padding: 10px 10px;
}

.why-from-btn {
    line-height: 1;
    font-size: 14px;
    border-radius: 0px;
    border: none;
    outline: none;
    background-color: #c03 !important;
    color: #fff;
    font-weight: bold;
    padding: 15px 26px;
}

.heading {
    padding-top: 30px;
}
/* Why EezahTech Page Styling Ended here */

/*Our Team Page Styling Started here*/
.fixed-margin-team {
    margin-top: 56px;
}

.president-text {
    padding-top: 71px;
}

.read-more-team a {
    text-decoration: none;
}

.president-img {
    width: 90%;
}

    .president-img:hover {
        opacity: 0.5;
    }

.modal-dialog {
    max-width: 80%;
    margin: 1.75rem auto;
}

.member-common {
    position: relative;
}

    .member-common::after {
        position: absolute;
        content: '';
        height: 1px;
        width: 100%;
        left: 0;
        bottom: -5%;
        background: rgba(142,153,175,0.5);
    }

    .member-common:hover::after {
        position: absolute;
        content: '';
        height: 1px;
        width: 100%;
        left: 0;
        bottom: -7%;
        background: rgba(142,153,175,0.5);
        transition: all .2s ease-in-out;
    }

.desig-margin {
    margin-top: -14px;
}

.member-images {
    width: 100%;
}

.member-img {
    width: 85%;
}

.member-images:hover {
    opacity: 0.7;
}

.team-wrapper {
    padding-top: 23px;
}

.modal-header {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1rem;
    border-bottom: 0px solid #dee2e6;
    border-top-left-radius: calc(0.3rem - 1px);
    border-top-right-radius: calc(0.3rem - 1px);
}

@media only screen and (max-width: 767.5px) and (min-width: 400px) {
    .column-margin {
        margin-top: 48px;
    }
}

@media only screen and (max-width: 575.5px) and (min-width: 100px) {
    .column-margin-m {
        margin-top: 48px;
    }
}

@media (max-width: 580px) {
    .r-center {
        text-align: center;
    }
}
/*Our Team Page Styling ended here*/

/*Case Studies Page Styling started Here*/
.search-and-filter {
    display: flex;
    justify-content: space-between;
}

.case-study-img {
    width: 100%;
}

.case-common {
    position: relative;
    padding-bottom: 20px;
}

    .case-common::after {
        position: absolute;
        content: '';
        height: 1px;
        width: 100%;
        left: 0;
        bottom: -3%;
        background: rgba(142,153,175,0.5);
    }

    .case-common:hover:after {
        position: absolute;
        content: '';
        height: 1px;
        width: 100%;
        left: 0;
        bottom: -5%;
        background: rgba(142,153,175,0.5);
        transition: all .5s ease-in-out;
    }
/*Case Studies Page Styling ended Here*/
.field-box {
    border: none;
    border-bottom: 1px solid rgba(198,204,215);
    width: 22%;
}

    .field-box:focus {
        outline: none;
    }
/*Contact Us Page Styling started here*/
.business-box {
    background: #f5f6ff;
    border: 1px solid #f2f2f2;
    padding: 25px;
    width: 242px;
}

.font-business {
    font-size: 18px;
}

.map-width {
    height: 300px;
    width: 100%;
}
/*Contact Us Page Styling ended here*/

/*Portfolio Page styling started here*/

.image-grid {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    height: 100%;
    margin: 0 auto;
    padding: 0;
    list-style: none;
}

.image-grid__item {
    display: flex;
    flex-direction: column;
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: 358px;
    align-items: stretch;
    justify-content: center;
    position: relative;
    height: 220px;
    margin-right: 14px;
    margin-bottom: 14px;
    transition: transform 0.14s ease-in, text-shadow 0.1s ease-in;
}

    .image-grid__item:hover:before {
        visibility: visible;
        opacity: 1;
    }

.grid-item {
    display: flex;
    position: relative;
    flex-direction: column;
    flex-grow: 1;
    flex-shrink: 1;
    align-items: stretch;
    text-decoration: none;
    color: #eeeeee;
    overflow: hidden;
}

    .grid-item:hover .grid-item__image {
        transform: scale(1.2);
    }

    .grid-item:hover .grid-item__hover {
        visibility: visible;
        opacity: 1;
    }

    .grid-item:hover .grid-item__name {
        visibility: visible;
        transform: scale(1);
        opacity: 1;
    }

.grid-item__image {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: cover;
    background-position: center center;
    transform: scale(1);
    will-change: transform;
    transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: 0;
}

.grid-item__hover {
    visibility: visible;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.1);
    border-radius: 0;
    transition: visibility 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    opacity: 1;
}

.grid-item__name {
    position: absolute;
    bottom: 0;
    width: 100%;
    text-align: center;
    font-size: 18px;
    color: white;
    font-weight: bold;
    background-color: rgba(0,0,0,0.5);
}


.subpage-image-grid {
    padding: 0;
    list-style: none;
    width: 50%;
    overflow: hidden;
    height: 120px;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    box-shadow: 0px 0px 4px 0px #9f9f9f;
}

.subpage-image-grid__item {
    position: relative;
    width: 100%;
    height: 120px;
    margin-right: 14px;
    margin-bottom: 14px;
    transition: transform 0.14s ease-in, text-shadow 0.1s ease-in;
}

    .subpage-image-grid__item:hover:before {
        visibility: visible;
        opacity: 1;
    }

.subpage-grid-item {
    text-decoration: none;
    color: #eeeeee;
    overflow: hidden;
}

    .subpage-grid-item:hover .subpage-grid-item__image {
        transform: scale(1.2);
    }

    .subpage-grid-item:hover .subpage-grid-item__hover {
        visibility: visible;
        opacity: 1;
    }

    .subpage-grid-item:hover .subpage-grid-item__name {
        visibility: visible;
        transform: scale(1);
        opacity: 1;
    }

.subpage-grid-item__image {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: cover;
    background-position: center center;
    transform: scale(1);
    will-change: transform;
    transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: 0;
}

.subpage-grid-item__hover {
    visibility: visible;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.1);
    border-radius: 0;
    transition: visibility 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    opacity: 1;
}

.subpage-grid-item__name {
    bottom: 0;
    width: 50%;
    font-size: 12px;
    color: #e3e3e3;
    font-weight: bold;
    background-color: #344666;
    height: 120px;
    padding-left: 0;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    box-shadow: 0px 0px 4px 0px #9f9f9f;
}

.list-none {
    list-style: none;
}
/*Portfolio Page styling Ended here*/
/*Career Page Styling started here*/
.form-career {
    padding: 5px 10px;
}

#exampleFormControlTextarea1 {
    height: 15vh;
}

#myFile {
    padding: 20px;
}

.pl {
    padding: 0px;
    list-style: none;
}

.card-image {
    min-height: 100px;
    background-color: #fff;
}

    .card-image img {
        margin-left: 50%;
        transform: translateX(-50%);
        height: 120px;
        border-radius: 5px;
        opacity: .7;
    }

.card-heading {
    display: inline-block;
    position: relative;
    height: 100px;
    line-height: 100px;
    border: none;
    padding: 0 0.5rem;
}

.card-heading {
    height: 40px;
    line-height: 1rem;
    vertical-align: initial;
    padding: 0;
}

.card-heading {
    background: #344666;
    border: none;
    padding: 0 1rem;
    height: 120px;
    line-height: 120px;
    width: 100%;
    position: relative;
    border-radius: 5px;
}

.card-title {
    margin-bottom: 0;
    padding: 0.3rem 0.5rem;
    font-size: 1.2rem;
    color: #e3e3e3;
    vertical-align: middle;
    text-align: center;
    line-height: 2rem;
    width: 100%;
}

.card-flex {
    display: flex;
    align-items: end;
}

.opac {
    opacity: 0.9;
}

.roow-margin {
    margin-top: 10px;
}

/*Detailing page style ended here*/
/* Media Queries For responsive design */
@media only screen and (max-width: 1200px) {
    .client-section {
        list-style: none;
        padding: 0;
        text-align: center;
        margin: 0;
        /* border-right: 0px solid rgba(255, 255, 255, 0.5);
        border-bottom: 2px solid rgba(255, 255, 255, 0.5);*/
    }

    .client-desc {
        padding-bottom: 20px;
    }
}

@media only screen and (max-width: 780px) {
    .mt-7 {
        margin-top: 70px;
    }

    .margin {
        margin-top: 20px;
    }
}


@media only screen and (max-width: 800px) {


    .foter {
        height: auto;
        width: 100%;
        background-color: #343352;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
    }

    .border-service {
        display: none;
    }

    .firstName {
        width: 100%;
    }

    .email {
        width: 100%;
        margin-right: 28px;
    }

    .foton {
        margin-top: 40px;
    }

    .footer-ul li {
        list-style: none;
        margin-left: 0px;
        margin-bottom: 3px;
    }

        .footer-ul li a {
            text-decoration: none;
            color: #fff;
            margin-left: 8px;
            font-size: 14px;
        }

    .bg-color {
        /*height: calc(100vh + 10rem);*/
        /*height: calc(92vh);*/
        margin-bottom: 20px;
        display: flex;
        align-items: center;
    }

    .img-fluid {
        /*height: calc(10vh + 15rem);*/
        width: calc(90vw + 5rem);
        /*margin-top: -50px;*/
    }
}

@media only screen and (max-width: 550px) {
    .social-icon {
        display: flex;
        justify-content: start;
        align-items: center;
    }

    .firstName {
        width: 100%;
    }

    .email {
        width: 100%;
    }

    .bubble {
        margin-top: 120px;
    }

    .support_margin {
        margin-top: 40px;
    }

    .margin_footer {
        margin-top: 30px;
    }

    .bubble {
        margin-top: 20px;
    }

    .firstName {
        width: 100%;
    }

    .email {
        width: 80%;
        margin-left: 0px;
    }

    textarea {
        border: none;
        background-color: #f5f6ff;
        outline: none;
        padding: 1px;
        margin-top: 20px;
        text-align: start;
        height: 20vh;
        width: 100%;
        padding: 8px 25px;
        font-size: 12px;
    }
}

/* For responsivness of  Servies background */
@media only screen and (max-width: 680px) {
    .stack-list {
        border-left: 0px;
    }

        .stack-list li {
            list-style: none;
        }
}

@media only screen and (max-width: 980px) {
    .margin-top-img {
        margin-top: 0px;
    }

    .margin-top-asp {
        margin-top: 76px;
    }

    .bg-asp {
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        position: relative;
        height: calc(100vh + 17rem);
    }
}

@media only screen and (max-width: 1350px) {
    .bg-asp {
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        position: relative;
        /*  height: calc(100vh + 0rem);*/
    }
}

@media only screen and (max-width: 1200px) {
    .bg-asp {
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        position: relative;
        /*   height: calc(100vh + 15rem);*/
    }

    .margin-top-img {
        margin: auto 0px;
    }

    .margin-top-asp {
        margin: 130px 0px;
    }

    .x {
        margin: auto 0px;
    }
}

@media only screen and (max-width: 1200px) {
    .bg-asp {
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        position: relative;
        /* height: calc(100vh + 18rem);*/
    }
}

@media only screen and (max-width: 800px) {
    .bg-asp {
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        position: relative;
        /*        height: calc(100vh + 25rem);*/
    }
}

@media (min-width: 1024px) {
    .bg-asp {
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        position: relative;
        /*height: calc(100vh + 8rem);*/
    }
}

@media (min-width: 800px) {
    .slider-button {
        background-color: red;
        border: 2px solid white;
        border-radius: 10px;
        padding: 20px 70px;
        text-align: center;
        cursor: pointer;
        text-decoration: none;
        color: black;
        font-weight: bold;
        transition: all 0.2s linear;
        -webkit-transition: all 0.2s linear;
        -moz-transition: all 0.2s linear;
        -o-transition: all 0.2s linear;
        -ms-transition: all 0.2s linear;
    }
}



@media only screen and (max-width: 767px) {
    .img-center-main {
        margin-top: 2rem;
        margin: 2rem 5rem;
    }
}

.logo {
    border-radius: 0px;
}

@media only screen and (max-width: 768px) {
    .logo {
        height: 35px;
        width: 135px !important;
    }
}

@media (min-width: 1280px) {
    .bg-asp {
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        position: relative;
        /*  height: calc(100vh - 10rem);*/
    }
}

@media (min-width: 1366px) {
    .bg-asp {
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        position: relative;
        /*  height: calc(100vh - 8rem);*/
    }
}


@media (min-width: 1440px) {
    .bg-asp {
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        position: relative;
        /*        height: calc(100vh - 20rem);
*/
    }
}

@media (min-width: 1680px) {
    .bg-asp {
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        position: relative;
        /*   height: calc(100vh - 20rem);*/
    }
}

@media (min-width: 1920px) {
    .bg-asp {
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        position: relative;
        /*height: calc(100vh - 40rem);*/
    }
}

@media (min-width: 2560px) {
    .bg-asp {
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        position: relative;
        /*      height: calc(30vh + 4rem);*/
    }
}

@media (min-width: 3840px) {
    .bg-asp {
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        position: relative;
        /* height:calc(25vh + 6rem);*/
    }
}

@media (min-width:600px) {
    .left-side-bg {
        padding-top: 80px;
        padding-bottom: 80px;
        padding-left: 60px;
    }
}

@media (min-width:400px) {
    .left-side-bg {
        padding-top: 80px;
        padding-bottom: 80px;
        padding-left: 50px;
    }
}

@media (min-width:300px) {
    .left-side-bg {
        padding-top: 80px;
        padding-bottom: 80px;
        padding-left: 50px;
    }
}

@media (min-width:200px) {
    .left-side-bg {
        padding-top: 80px;
        padding-bottom: 80px;
        padding-left: 50px;
    }
}

@media (min-width:100px) {
    .left-side-bg {
        padding-top: 80px;
        padding-bottom: 80px;
        padding-left: 5px;
    }
}

@media (max-width:200px) {

    .btn-custom {
        padding: 0px 0px;
    }
}

@media (max-width:1000px) {
    .r-text {
        text-align: center;
    }

        .r-text img {
            width: 100%;
        }

    .expert-btn {
        line-height: 1;
        font-size: 14px;
        border-radius: 0px;
        border: none;
        outline: none;
        color: #fff;
        background: #c03;
        padding: 12px 12px;
        color: #fff;
    }

    .dynamics-contact-btn {
        margin-top: 30px;
    }
}

@media (max-width:1000px) {
    .responsive-margin {
        margin-top: 15px;
    }
}

@media (max-width:1200px) {
    .support_margin {
        margin-top: 15px;
    }

    .bubble {
        background-color: #2f2e4a;
        margin-top: 0px;
        border-radius: 12px;
        position: relative;
        font-size: 14px;
    }
}

@media (max-width:1200px) {

    .bubble {
        background-color: #2f2e4a;
        margin-top: 0px;
        border-radius: 12px;
        position: relative;
        font-size: 14px;
    }

    .margin_footer {
        margin-top: 30px;
    }

    .foton {
        margin-top: 30px;
    }
}

@media (max-width:1199px) {

    .counter-wrapper {
        position: relative;
        text-align: center;
        padding-bottom: 50%;
        width: 50%;
        height: 0;
        border-radius: 50%;
        background-color: #4fd6e5;
        margin-top: 10px;
    }
}

@media (max-width:1000px) {

    .counter-wrapper {
        position: relative;
        text-align: center;
        padding-bottom: 50%;
        width: 50%;
        height: 0;
        border-radius: 50%;
        background-color: #4fd6e5;
    }
}

@media (max-width:991px) {
    .counter-wrapper {
        position: relative;
        text-align: center;
        padding-bottom: 50%;
        width: 50%;
        height: 0;
        border-radius: 50%;
        background-color: #4fd6e5;
    }
}

@media (max-width:800px) {

    .counter-wrapper {
        position: relative;
        text-align: center;
        padding-bottom: 50%;
        width: 50%;
        height: 0;
        border-radius: 50%;
        background-color: #4fd6e5;
    }
}

@media (max-width:350px) {

    .counter-wrapper {
        position: relative;
        text-align: center;
        padding-bottom: 60%;
        width: 60%;
        height: 0;
        border-radius: 50%;
        background-color: #4fd6e5;
    }
}

@media (max-width:300px) {

    .counter-wrapper {
        position: relative;
        text-align: center;
        padding-bottom: 70%;
        width: 70%;
        height: 0;
        border-radius: 50%;
        background-color: #4fd6e5;
    }
}

@media (max-width: 100px) {

    .counter-wrapper {
        position: relative;
        text-align: center;
        padding-bottom: 80%;
        width: 80%;
        height: 0;
        border-radius: 50%;
        background-color: #4fd6e5;
    }
}



@media (max-width: 1450px) {
    .image-client-section::before {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        left: 39%;
        top: 50%;
        position: absolute;
    }

    .image-client-section::after {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        right: 39%;
        top: 50%;
        position: absolute;
    }
}

@media (max-width: 1350px) {
    .image-client-section::before {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        left: 38%;
        top: 50%;
        position: absolute;
    }

    .image-client-section::after {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        right: 38%;
        top: 50%;
        position: absolute;
    }
}




@media (max-width: 1350px) {
    .image-client-section::before {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        left: 37%;
        top: 50%;
        position: absolute;
    }

    .image-client-section::after {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        right: 37%;
        top: 50%;
        position: absolute;
    }
}

@media (max-width: 1150px) {
    .image-client-section::before {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        left: 36%;
        top: 50%;
        position: absolute;
    }

    .image-client-section::after {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        right: 36%;
        top: 50%;
        position: absolute;
    }
}

@media (max-width: 1050px) {
    .image-client-section::before {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        left: 34%;
        top: 50%;
        position: absolute;
    }

    .image-client-section::after {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        right: 34%;
        top: 50%;
        position: absolute;
    }
}








@media (max-width:1000px) {
    .image-client-section::before {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        left: 34%;
        top: 50%;
        position: absolute;
    }

    .image-client-section::after {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        right: 34%;
        top: 50%;
        position: absolute;
    }
}

@media (max-width: 900px) {
    .image-client-section::before {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        left: 32%;
        top: 50%;
        position: absolute;
    }

    .image-client-section::after {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        right: 32%;
        top: 50%;
        position: absolute;
    }
}

@media (max-width: 800px) {
    .image-client-section::before {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        left: 30%;
        top: 50%;
        position: absolute;
    }

    .image-client-section::after {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        right: 30%;
        top: 50%;
        position: absolute;
    }
}

@media (max-width: 650px) {
    .image-client-section::before {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        left: 26%;
        top: 50%;
        position: absolute;
    }

    .image-client-section::after {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        right: 26%;
        top: 50%;
        position: absolute;
    }
}

@media (max-width: 550px) {
    .image-client-section::before {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        left: 22%;
        top: 50%;
        position: absolute;
    }

    .image-client-section::after {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        right: 22%;
        top: 50%;
        position: absolute;
    }

    .service-card {
        margin-right: 0px !important;
    }

    .service-slider .prev-arrow {
        left: 10px !important;
    }

    .service-slider .next-arrow {
        right: 0px !important;
    }

    .about-us-home-image {
        width: 200px !important;
    }
}

@media (max-width:1000px) {
    .trust-wrapper {
        padding: 30px 0px;
        width: 100%;
        margin: 0px auto !important;
    }
}

@media (max-width: 500px) {
    .image-client-section::before {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        left: 9%;
        top: 50%;
        position: absolute;
    }

    .image-client-section::after {
        content: "";
        display: block;
        height: 5px;
        background: #8e99af;
        opacity: 0.5;
        width: 100px;
        height: 1px;
        margin: auto;
        right: 9%;
        top: 50%;
        position: absolute;
    }
}

@media (max-width: 390px) {
    .image-client-section::before {
        content: "";
        display: block;
        height: 0px;
        background: #8e99af;
        opacity: 0;
        width: 0;
        position: absolute;
    }

    .image-client-section::after {
        content: "";
        display: block;
        height: 0px;
        background: #8e99af;
        opacity: 0;
        width: 100px;
        height: 1px;
        position: absolute;
    }

    .trust-wrapper {
        padding: 30px 0px;
        width: 100%;
        margin: 0px auto !important;
    }
}

@media (max-width:290px) {
    .trust-wrapper {
        padding: 30px 0px;
        width: 100%;
        margin: 0px auto !important;
    }
}

@media (max-width:1399px) {
    .mt-9 {
        margin-top: 1.5rem;
    }
}

@media (max-width:1200px) {
    .mt-10 {
        margin-top: 1.5rem;
    }
}


@media (max-width:867.5px) {
    main {
        display: inline-block;
        text-align: -webkit-center;
    }

    .mt {
        margin-top: 1.5rem;
    }
}



@media (max-width:767.5px) {
    .mt-11 {
        margin-top: 1.5rem;
    }

    .mt-12 {
        margin-top: 5.5rem;
    }

    .center-img {
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 50%;
    }
}

@media (max-width:467.5px) {
    .search-and-filter {
        display: inline-block;
        text-align: center;
    }

    .field-box {
        margin-top: 10px;
    }
}

.btn-contact {
    width: max-content !important;
}
/*Cookies Page Styling Started Here*/
.cookies-section {
    background: #fff;
    box-shadow: rgb(128 128 128) 0px 0px 12px 0px;
    position: fixed;
    bottom: 3%;
    padding: 2rem;
}

.cookies-button {
    float: right;
}
/*Cookies Page Styling Ended Here*/

hr {
    margin: 5px auto 0px auto;
    background-color: currentColor;
    opacity: .25;
}

.a-size {
    font-size: 16px !important;
    margin-bottom: 1rem;
}


















/*****************************SunBurst********************************/

.no-results {
    font-size: 11px;
}

.bs-searchbox .form-control {
    padding: 2px 4px;
}

.bs-searchbox .form-control {
    height: 30.5px;
    font-size: 11px;
}

.bootstrap-select.show-tick .dropdown-menu li a span {
    white-space: normal;
    text-overflow: unset;
    font-size: 11px;
}

.bs-actionsbox,
.bs-donebutton,
.bs-searchbox {
    padding: 4px;
}

    .bs-searchbox + .bs-actionsbox {
        padding: 0 4px 4px;
    }

.btn-group > .btn-group:not(:last-child) > .btn,
.btn-group > .btn:not(:last-child):not(.dropdown-toggle) {
    font-size: 11px;
}

.btn-group > .btn-group:not(:first-child) > .btn,
.btn-group > .btn:not(:first-child) {
    font-size: 11px;
}

.bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    right: unset;
    left: 180px;
    top: 1px;
}

.filter-option-inner-inner {
    font-size: 11px;
}

.bootstrap-select .dropdown-menu li a {
    padding: 4px 13px;
}

.dropdown-divider {
    margin: 0;
}

.bootstrap-select .dropdown-menu {
    padding: unset;
}

.bs-actionsbox {
    padding: unset;
}


.SumoSelect > .optWrapper > .options li label {
    text-overflow: unset;
    white-space: unset;
}

.SumoSelect .select-all.partial > span i,
.SumoSelect .select-all.selected > span i,
.SumoSelect > .optWrapper.multiple > .options li.opt.selected span i {
    background-color: #186ba7
    /* #73a7a0; */
}

.loaderContainer {
    width: 100px;
    height: 100px;
    background: rgba(0, 0, 0, 0.7);
    text-align: center;
    z-index: 10;
    padding-top: 22%;
    position: absolute;
}

.buttonload {
    background-color: #04AA6D;
    /* Green background */
    border: none;
    /* Remove borders */
    color: white;
    /* White text */
    padding: 12px 24px;
    /* Some padding */
    font-size: 16px;
    /* Set a font-size */
}

.loaderContainer .spinner-border {
    background-color: #04AA6D;
    /* Green background */
    border: none;
    /* Remove borders */
    color: white;
    /* White text */
    padding: 12px 24px;
    /* Some padding */
    font-size: 16px;
    /* Set a font-size */
}

body {
    margin: 0;
}

.slice {
    cursor: pointer;
}

    .slice .main-arc {
        stroke: #fff;
        stroke-width: 1px;
    }

    .slice .hidden-arc {
        fill: none;
    }

    .slice text {
        pointer-events: none;
        dominant-baseline: middle;
        text-anchor: middle;
    }

.radl {
    font-weight: bold;
    font-size: 16px;
}

.droplab {
    width: 230px;
    display: inline-block;
    text-align: left;
    font-weight: bold;
    font-size: 13px;
}

.myLabel {
    font-weight: bold;
    font-size: 10px;
}

.center {
    margin-top: 5px;
    /*width: 100%;*/
    padding: 3px;
}

.tooltip {
    display: none;
    opacity: 0;
    position: absolute;
    color: #000;
    padding: 5px 10px;
    pointer-events: none;
    transform: translate(-50%, -100%);
    margin-top: -14px;
    background: #fff;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.25);
}

    .tooltip::after {
        content: " ";
        display: block;
        position: absolute;
        width: 10px;
        height: 10px;
        background: #fff;
        left: 50%;
        transform: translateX(-50%) rotate(45deg);
        bottom: -5px;
    }

    .tooltip .inner {
        position: absolute;
        background: #ccc;
    }

    .tooltip .date,
    .tooltip .data {
        margin: 10px;
        font-size: 16px;
        font-weight: bold;
    }

        .tooltip .data span {
            color: #000;
            font-weight: normal;
        }

.options {
    text-align: left;
}

.select-all {
    text-align: left;
}

#chartContainer {
    width: 100%;
    height: 490px;
}

.heading {
    font-weight: bold;
    font-size: 13px;
    margin-right: 5px;
}

.msg {
    font-size: 14px;
    font-weight: bold;
}

#slidecontainer {
    width: 540px;
    margin-bottom: 15px;
    margin: 0 auto;
}

#ticksContainer {
    width: 550px;
}

.slider {
    -webkit-appearance: none;
    width: 100%;
    height: 9px;
    border-radius: 5px;
    background: #d3d3d3;
    outline: none;
    opacity: 0.7;
    -webkit-transition: .2s;
    transition: opacity .2s;
    display: inline-block;
    z-index: 30;
}

    .slider:hover {
        opacity: 1;
    }

    .slider::-webkit-slider-thumb {
        -webkit-appearance: none;
        appearance: none;
        width: 15px;
        height: 15px;
        border-radius: 50%;
        background: blue;
        cursor: pointer;
    }

    .slider::-moz-range-thumb {
        width: 15px;
        height: 15px;
        border-radius: 30%;
        background: blue;
        cursor: pointer;
    }

.loader {
    border: 4px solid #f3f3f3;
    border-radius: 50%;
    border-top: 4px solid #3498db;
    width: 30px;
    height: 30px;
    -webkit-animation: spin 2s linear infinite;
    /* Safari */
    animation: spin 2s linear infinite;
    left: 50%;
    top: 40%;
    z-index: 1;
    position: absolute;
}

/* Safari */
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

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

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

#overlay {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 2;
    cursor: pointer;
}

/* css for above radio button*/
.wrapper {
    display: inline-flex;
    background: #fff;
    height: 60px;
    width: 98.5vw;
    align-items: center;
    justify-content: space-evenly;
    border-radius: 5px;
    padding: 12px 1px;
    /* box-shadow: 5px 5px 30px rgba(0, 0, 0, 0.2) */
}

    .wrapper .option {
        /* background: #fff; */
        height: 100%;
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        border: 2px solid lightgrey;
    }

        .wrapper .option .square {
            height: 20px;
            width: 20px;
            background: #d9d9d9;
            border-radius: 15px;
            position: relative;
            margin-right: 5px;
            margin-top: -2px;
        }

            .wrapper .option .square::before {
                position: absolute;
                content: "";
                top: 4px;
                left: 4px;
                width: 12px;
                height: 12px;
                background: #186ba7;
                border-radius: 15px;
                opacity: 0;
                transform: scale(1.5);
            }

input[type="radio"] {
    display: none
}

#radio-button-1:checked:checked ~ .radio-button-1,
#radio-button-2:checked:checked ~ .radio-button-2 {
    border-color: #186ba7;
    background: #186ba7
}

    #radio-button-1:checked:checked ~ .radio-button-1 .square,
    #radio-button-2:checked:checked ~ .radio-button-2 .square {
        background: #fff
    }

        #radio-button-1:checked:checked ~ .radio-button-1 .square::before,
        #radio-button-2:checked:checked ~ .radio-button-2 .square::before {
            opacity: 1;
            transform: scale(1)
        }

.wrapper .option span {
    font-size: 16px;
    color: #808080
}

#radio-button-1:checked:checked ~ .radio-button-1 span,
#radio-button-2:checked:checked ~ .radio-button-2 span {
    color: #fff
}

.btnDownload {
    background-color: white;
    border: 2px solid #186ba7;
    color: #186ba7;
    padding: 4px 12px;
    cursor: pointer;
    font-size: 15px;
    font-weight: bold;
    border-radius: 25px;
}

.reSet {
    background-color: white;
    border: 2px solid #186ba7;
    color: #186ba7;
    padding: 4px 12px;
    cursor: pointer;
    font-size: 15px;
    font-weight: bold;
    border-radius: 25px;
}

.btnBack {
    padding: 4px 14px;
    font-size: 14px;
    cursor: pointer;
}

    .btnBack:hover {
        background-color: #186ba7;
        color: white;
        border: 1px solid white;
    }

@media only screen and (max-width: 520px) {
    .msg {
        font-size: 11px;
        font-weight: bold;
    }

    #slidecontainer {
        width: 420px;
    }

    #ticksContainer {
        width: 430px;
    }

    .btnBack {
        font-size: 11px;
        padding: 3px 9px;
    }

    .btnDownload {
        font-size: 11px;
        padding: 3px 9px;
    }

    .reSet {
        font-size: 11px;
        padding: 3px 9px;
    }

    .droplab {
        width: 200px;
        display: inline-block;
        text-align: left;
        font-weight: bold;
        font-size: 11px;
    }

    .center {
        margin-top: 2px;
        padding: 2px;
    }

    .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
        width: 170px;
    }

    .bootstrap-select .dropdown-menu {
        width: 170px;
    }

    .bootstrap-select .dropdown-toggle .filter-option-inner-inner {
        font-size: 10px;
    }

    .filter-option-inner-inner {
        font-size: 10px;
    }

    .bootstrap-select.show-tick .dropdown-menu li a span.text {
        font-size: 10px;
    }

    .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
        left: 140px;
    }

    .bootstrap-select .dropdown-menu li a {
        padding: 4px;
    }

    .dropdown-divider {
        margin: 0;
    }

    .wrapper .option .square {
        height: 15px;
        width: 15px;
    }

        .wrapper .option .square::before {
            top: 3px;
            left: 3px;
            width: 9px;
            height: 9px;
        }

    .wrapper .option span {
        font-size: 13px;
    }

    /*        .wrapper {
            width: 53vw;
        }*/


    .heading {
        font-weight: bold;
        font-size: 9px;
        margin-right: 5px;
    }

    .tooltipText {
        font-size: 9px;
    }

    .no-results {
        font-size: 9px;
    }

    .bs-searchbox .form-control {
        height: 25.5px;
        font-size: 9px;
    }

    .inner {
        overflow-x: hidden;
    }
}

@media only screen and (max-width: 400px) {
    #slidecontainer {
        width: 340px;
    }

    #ticksContainer {
        width: 350px;
    }

    .msg {
        font-size: 9px;
        font-weight: bold;
    }

    .btnBack {
        font-size: 10px;
        padding: 2px 5px;
    }

    .btnDownload {
        font-size: 10px;
        padding: 2px 5px;
    }

    .reSet {
        font-size: 10px;
        padding: 2px 5px;
    }

    .droplab {
        width: 170px;
        display: inline-block;
        text-align: left;
        font-weight: bold;
        font-size: 9px;
    }

    .center {
        padding: 2px;
    }

    .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
        width: 140px;
    }

    .bootstrap-select .dropdown-menu {
        width: 140px;
    }

    .bootstrap-select .dropdown-toggle .filter-option-inner-inner {
        font-size: 9px;
    }

    .filter-option-inner-inner {
        font-size: 9px;
    }

    .bootstrap-select.show-tick .dropdown-menu li a span.text {
        font-size: 9px;
    }

    .btn-group > .btn-group:not(:last-child) > .btn,
    .btn-group > .btn:not(:last-child):not(.dropdown-toggle) {
        font-size: 8px;
        padding: 4px 0px;
    }

    .btn-group > .btn-group:not(:first-child) > .btn,
    .btn-group > .btn:not(:first-child) {
        font-size: 8px;
        padding: 4px 0px;
    }

    .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
        left: 115px;
    }

    .bootstrap-select .dropdown-menu li a {
        padding: 4px;
    }

    .dropdown-divider {
        margin: 0;
    }

    .inner {
        overflow-x: hidden;
    }

    .wrapper .option span {
        font-size: 9px;
    }

    .wrapper {
        height: 45px;
    }

        .wrapper .option .square {
            height: 12px;
            width: 12px;
        }

            .wrapper .option .square::before {
                top: 3px;
                left: 3px;
                width: 6px;
                height: 6px;
            }
}

@media only screen and (max-width: 320px) {
    #slidecontainer {
        width: 260px;
    }

    #ticksContainer {
        width: 270px;
    }

    .droplab {
        width: 110px;
        display: inline-block;
        text-align: left;
        font-weight: bold;
        font-size: 8px;
    }

    .center {
        padding: 1px;
    }

    .SumoSelect {
        width: 120px;
    }

    .inner {
        overflow-x: hidden;
    }

    .myLabel {
        font-size: 9px;
    }
}

.copyJsonData {
    display: inline;
    position: relative;
    top: 50px;
    right: 20px;
}

    .copyJsonData:hover:after {
        background: #333;
        background: rgba(0, 0, 0, .8);
        border-radius: 5px;
        bottom: 50px;
        color: #fff;
        content: attr(data-title);
        left: -30%;
        padding: 5px 15px;
        position: absolute;
        z-index: 98;
        width: 160px;
    }

    .copyJsonData:hover:before {
        border: solid;
        border-color: #333 transparent;
        border-width: 6px 6px 0 6px;
        bottom: 45px;
        content: "";
        left: 50%;
        position: absolute;
        z-index: 99;
    }

.sunburst-table td, .sunburst-table th {
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 66px;
    overflow: hidden;
    height: 15px;
    border-width: 1px;
}

.d-page-right {
    height: 100vh;
    overflow-y: scroll;
}

.detail-page-right-text {
    height: 120px;
    display: flex;
    text-align: center;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    cursor: pointer;
    text-overflow: ellipsis;
    text-decoration: none;
    /*white-space: nowrap;*/
    /*max-width: 17ch;*/
}
    /*.detai*/ /*l-page-right-text:after {
        text-decoration: none;
    */ /*}*/

    .detail-page-right-text:hover {
        text-decoration: underline;
        color: #2569e6 !important;
    }

.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}

    .tooltip .tooltiptext {
        visibility: hidden;
        width: 120px;
        background-color: #555;
        color: #fff;
        text-align: center;
        border-radius: 6px;
        padding: 5px 0;
        position: absolute;
        z-index: 1;
        bottom: 125%;
        left: 50%;
        margin-left: -60px;
        opacity: 0;
        transition: opacity 0.3s;
    }

        .tooltip .tooltiptext::after {
            content: "";
            position: absolute;
            top: 100%;
            left: 50%;
            margin-left: -5px;
            border-width: 5px;
            border-style: solid;
            border-color: #555 transparent transparent transparent;
        }

    .tooltip:hover .tooltiptext {
        visibility: visible;
        opacity: 1;
    }

.copyJsonData:hover {
    color: black;
}
/******************************DevicesYearlyTrend*************************/
.line {
    fill: none;
    stroke: steelblue;
    stroke-width: 1.5px;
}


.tick {
    /*fill: none;
            stroke: #666;*/
    shape-rendering: crispEdges;
    /*stroke-dasharray: 2,2;*/
}

.axis path,
.axis line {
    fill: none;
    stroke: #D9D9D9;
    stroke-width: 1;
    shape-rendering: crispEdges;
}

.x_tick {
}

.x_highlight {
    fill: transparent;
    transition: all 150ms;
}

.x_label {
    fill: #000;
    transition: all 150ms;
}



.x_tick.active .x_highlight {
    fill: #232728;
}

.x_tick.active .x_label {
    fill: #fff;
}

.v_ruler {
    display: none;
}

.r_dotted {
    stroke: #ccc;
}

.tooltip {
    display: none;
    opacity: 0;
    position: absolute;
    color: #000;
    padding: 5px 10px;
    pointer-events: none;
    transform: translate(-50%, -100%);
    margin-top: -14px;
    background: #fff;
    box-shadow: 0 3px 10px rgba(0,0,0,0.25);
}

    .tooltip::after {
        content: " ";
        display: block;
        position: absolute;
        width: 10px;
        height: 10px;
        background: #fff;
        left: 50%;
        transform: translateX(-50%) rotate(45deg);
        bottom: -5px;
    }

    .tooltip .inner {
        position: absolute;
        background: #ccc;
    }

    .tooltip .date,
    .tooltip .data {
        margin: 10px;
        font-size: 16px;
        font-weight: bold;
    }

        .tooltip .data span {
            color: #000;
            font-weight: normal;
        }

.json-previour {
    height: 70vh;
}
/****************************Animated Sankey Chart************************/
.node rect {
    cursor: move;
    fill-opacity: .4;
    shape-rendering: crispEdges;
}

.node text {
    pointer-events: none;
    text-shadow: 0 1px 0 #fff;
}

.link {
    fill: none;
    stroke: #000;
    stroke-opacity: .02;
}

    .link:hover {
        /* stroke-opacity: .25;*/
    }

.animated-sankey svg {
    position: absolute;
}

.animated-sankey canvas {
    position: absolute;
}

.g-intro-labels {
    margin-bottom: 10px;
}

.g-sankey-intro.sankey-end {
    width: 160px;
    float: right;
    vertical-align: bottom;
    text-align: right;
}

.sankey-start {
    z-index: 1000;
}

.sankey-table td, .sankey-table th {
    max-width: 25%;
    height: 15px;
    border-width: 1px;
}

/*****************************Guage Meter Chart********************************/
.chart-gauge svg {
    font: 10px sans-serif;
}

.chart-gauge .arc {
    stroke: red;
    stroke-dasharray: 1 1 1;
}

/*****************************CODE BY MUKHTAR********************************/

.goToTopBtn {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 30px;
    z-index: 99;
    font-size: 18px;
    border: none;
    outline: none;
    background-color: #2569e6;
    color: white;
    cursor: pointer;
    padding: 15px;
    border-radius: 4px;
    animation: fadeIn; /* referring directly to the animation's @keyframe declaration */
    animation-duration: 1s; /* don't forget to set a duration! */
}

/*  .goToTopBtn:hover {
            background-color: #aa8e0d;
        }*/

.whatWeDoForSmallSize {
    display: none;
}

@media only screen and (max-width: 768px) {
    .whatWeDo {
        display: none;
    }

    .whatWeDoForSmallSize {
        display: block;
    }
}

.cookiesContainer {
    display: none;
    position: fixed;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 98;
    background-color: white;
    padding: 0 20px;
    font-size: 14px;
    align-items: center;
}

    .cookiesContainer .cookiesText {
        color: rgb(51, 51, 51);
    }

    .cookiesContainer p {
        padding-bottom: 0px;
        padding-top: 15px;
    }

.declineBtn, .acceptAllBtn {
    border: none;
    outline: none;
    height: 35px;
    width: 100px;
    color: white;
    background-color: gray;
    border-radius: 5px;
}

.acceptAllBtn {
    background-color: rgb(97, 162, 41);
}

.slider-button {
    background-color: white;
    border: 2px solid white;
    border-radius: 10px;
    padding: 20px 80px;
    text-align: center;
    cursor: pointer;
    text-decoration: none;
    color: black;
    font-weight: bold;
    transition: all 0.2s linear;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
}

    .slider-button:hover {
        background-color: transparent;
        border: 2px solid white;
        color: white;
    }

.industry-slider-cards {
    border-style: solid;
    /*border-width: 1px 1px 1px 1px;
    border-color: #46416B;*/
    border: none;
    border-radius: 5px;
    margin-bottom: 20px;
    margin-right: 5px;
    margin-left: 5px;
    overflow: hidden;
    position: relative;
    text-align: center;
    align-items: center;
    /*padding: 43px 30px 43px;*/
    height: 300px;
    /*background: #262051;*/
    color: #aeaacb;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
}

.bg-img-slider1, .bg-img-slider2, .bg-img-slider3, .bg-img-slider4 {
    background-position: center; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: cover; /* Resize the background image to cover the entire container */
    border-radius: 5px;
    border: 1px solid gray;
}

.industry-slider-box-img {
    position: absolute;
    width: inherit;
    height: inherit;
    /*color: #fff;*/
    /*background: #332d5f;*/
    /*border-width: 1px 1px 1px 1px;*/
    border: 1px solid #46416B;
    border-radius: 5px;
    /*-webkit-border-radius: 50%;
    -moz-border-radius: 50%;*/
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
}
/*
        .industry-slider-box-img img {
            width: 100%;
            height: inherit;
        }*/

.industry-slider-box-title {
    position: relative;
    z-index: 1;
    padding: 10px 0;
    margin-top: 130px;
    display: flex;
    color: white;
    background-color: rgba(0,0,0,.5);
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

    .industry-slider-box-title h4 {
        margin: 0;
        color: white;
    }

.bg-yellow {
    background-color: #d1b013;
}

.aboutUsPageSection1 {
    background: linear-gradient(180deg,rgba(255,255,255,0) 0,#e7f1fc 100%);
}

    .aboutUsPageSection1 .aboutUsPageSection1innerPart1 {
        padding: 0 25%;
        padding-top: 50px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    .aboutUsPageSection1 p {
        color: #555659;
    }

.aboutUs-button {
    background-color: #2569e6;
    border-radius: 10px;
    padding: 20px 80px;
    text-align: center;
    cursor: pointer;
    text-decoration: none;
    color: white;
    font-weight: bold;
    transition: all 0.2s linear;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
}

    .aboutUs-button:hover {
        color: black;
    }

@media (max-width: 1182px) {
    .aboutUsPageSection1 .aboutUsPageSection1innerPart1 {
        padding: 0 20%;
        padding-top: 50px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
    }
}

@media (max-width: 992px) {
    .aboutUsPageSection1 .aboutUsPageSection1innerPart1 {
        padding: 0 10%;
        padding-top: 50px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
    }
}

@media (max-width: 500px) {
    .aboutUs-button {
        background-color: #2569e6;
        border-radius: 10px;
        padding: 20px 40px;
        text-align: center;
        cursor: pointer;
        text-decoration: none;
        color: white;
        font-weight: bold;
        transition: all 0.2s linear;
        -webkit-transition: all 0.2s linear;
        -moz-transition: all 0.2s linear;
        -o-transition: all 0.2s linear;
        -ms-transition: all 0.2s linear;
    }
}

@media (max-width: 320px) {
    .aboutUs-button {
        background-color: #2569e6;
        border-radius: 10px;
        padding: 20px 20px;
        text-align: center;
        cursor: pointer;
        text-decoration: none;
        color: white;
        font-weight: bold;
        transition: all 0.2s linear;
        -webkit-transition: all 0.2s linear;
        -moz-transition: all 0.2s linear;
        -o-transition: all 0.2s linear;
        -ms-transition: all 0.2s linear;
    }
}


.aboutUsPageSection2 .row {
    display: flex;
    justify-content: center;
    align-items: center;
}

.aboutUsPageSection2 img {
    border-radius: unset;
}

.aboutUsPageSection3 .row {
    display: flex;
    justify-content: center;
    align-items: center;
}

.aboutUsPageSection3 img {
    border-radius: unset;
}

.aboutUsPageSection3 {
    padding: 0 150px;
}

.aboutUsPageSection2forSmallScreen {
    display: none;
}

@media (max-width: 1100px) {
    .aboutUsPageSection2 {
        padding: 0 15px;
        text-align: center;
    }

    .aboutUsPageSection3 {
        padding: 0 15px;
        text-align: center;
    }
}

@media (max-width: 768px) {
    .aboutUsPageSection2 {
        display: none;
    }

    .aboutUsPageSection2forSmallScreen {
        display: block;
    }

        .aboutUsPageSection2forSmallScreen .row {
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .aboutUsPageSection2forSmallScreen img {
            border-radius: unset;
        }

    .aboutUsPageSection2forSmallScreen {
        padding: 0 15px;
        text-align: center;
    }
}

/*.aboutUsPageSection3 {*/
/*background: linear-gradient(180deg,rgba(255,255,255,0) 0,#e7f1fc 100%);*/
/*background: #eef4fa;
}*/
.bg-corValues {
    background: #eef4fa;
}

/*    .aboutUsPageSection3 .aboutUsPageSection3innerPart1 {
        padding: 0 10%;
        padding-top: 30px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    .aboutUsPageSection3 p {
        color: #555659;
    }*/

.aboutUsPageSection4 .aboutUsPageSection4innerPart1 {
    padding: 0 10%;
}

.aboutUsPageSection4 p {
    color: #555659;
}

.core-values-title {
    margin-top: 20px;
}

.whatWeDoCards {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    border: 1px solid #e5e8ed;
    border-radius: 5px;
    padding: 30px 0;
    margin-bottom: 20px;
    height: 300px;
}

    /*    .whatWeDoCards img {
        height: 80px;
        width: 120px;
    }*/

    .whatWeDoCards:hover {
        border: 1px solid #2569e6;
        /*cursor: pointer;*/
    }

.ourCorValues {
    display: flex;
    flex-direction: column;
    align-items: center;
    /*justify-content: center;*/
    text-align: center;
    padding: 30px 0;
    margin: 20px 0;
    height: 300px;
}

    .ourCorValues img {
        min-height: 80px;
        min-width: 80px;
    }

.aboutUsCards {
    display: flex;
    flex-direction: column;
    /*align-items: center;*/
    justify-content: space-between;
    text-align: center;
    border-style: solid;
    border: 1px solid #e5e8ed;
    margin-bottom: 20px;
    border-radius: 5px;
    overflow: hidden;
    position: relative;
    padding-top: 70px;
    height: 400px;
    /*background: #262051;*/
    color: #aeaacb;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
}



    .aboutUsCards .content-box {
        position: relative;
        z-index: 1;
        height: inherit;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-around;
    }

        .aboutUsCards .content-box img {
            height: 100px;
            width: 120px;
        }


        .aboutUsCards .content-box p {
            font-size: 20px;
            /*color: white;*/
        }

        .aboutUsCards .content-box .btn-details {
            display: inline-block;
            background: #2569e6;
            margin-bottom: 90px;
            padding: 10px 15px;
            color: white;
            border-radius: 10px;
            box-shadow: none;
            text-decoration: none;
        }

/*        .aboutUsCards .content-box div {
            line-height: 30px;
            font-size: 14px;
            color: #aeaacb;
        }*/

.btn-details {
    font-size: 0.9rem;
    text-decoration: none;
}

.aboutUsCards:hover {
    border: 1px solid #2569e6;
}

    .aboutUsCards:hover .content-box h5 {
        color: black;
    }

    .aboutUsCards:hover .big-number {
        color: #f4f6f6;
    }

    .aboutUsCards:hover .icon-main {
        background: #f4f6f6;
    }

    .aboutUsCards:hover .content-box div {
        color: black;
    }

. /*devider {
    background-color: #2569e6;
    padding: 2px 0;
    width: 10%;
    margin-top: -15px;
    margin-bottom: 20px;
}*/
.technologyColumnContainer {
    display: flex;
    justify-content: center;
    align-items: center;
}


.technologyColumn {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin-bottom: 20px;
}

    .technologyColumn img {
        width: 50px;
        margin-bottom: 10px;
    }

.nav-tabs .nav-link {
    border: none !important;
}

.nav-tabs {
    border: none !important;
}

.keyValueContainer {
    height: 50vh;
    background-color: white;
    border-top-right-radius: 30%;
    overflow: hidden;
    position: relative;
    padding: 43px 30px 43px;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
}

    .keyValueContainer .icon-main {
        position: absolute;
        top: -98px;
        left: -15px;
        width: 440px;
        height: 300px;
        color: #fff;
        /*background: #f5ffff;*/
        background: rgb(2,0,36);
        background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(245,255,255,1) 0%, rgba(171,171,171,1) 100%);
        border-radius: 40%;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        transition: all 0.3s linear;
        -webkit-transition: all 0.3s linear;
        -moz-transition: all 0.3s linear;
        -o-transition: all 0.3s linear;
        -ms-transition: all 0.3s linear;
    }

    .keyValueContainer .content-box {
        position: relative;
        z-index: 1;
        height: inherit;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }



        .keyValueContainer .content-box h5 {
            font-size: 20px;
            color: white;
        }

        .keyValueContainer .content-box .btn-details {
            display: inline-block;
            margin-bottom: 90px;
            box-shadow: none;
            text-decoration: none;
        }

        .keyValueContainer .content-box div {
            line-height: 30px;
            font-size: 14px;
        }

/*******************Data Visualization Start*********************/

.companies__image {
    padding: auto;
}


.text-BG-color {
    background-color: #e5f3ff;
    content: "";
    display: block;
    height: 90px;
    left: -24px;
    position: relative;
    top: -32px;
    width: 90px;
    z-index: -1;
}

.technologies {
    height: 64px;
    margin: 0 1px 1px 0;
    padding: 2px;
    position: relative;
    width: 96px;
}

.technologiesBG {
    background-color: #c1e4fe;
}

.DV-BG {
    background-color: #f5f5f7;
}

.technologies, .tecchnologies {
    position: relative;
    display: inline-block;
    height: 64px;
    margin: 0 1px 1px 0;
    padding: 2px;
    position: relative;
    width: 96px;
    background-color: #e6f2fe;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 200px; /* Adjust the width as needed */
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
    padding: 0px;
}

.technologies:hover .dropdown-content,
.technologies.clicked .dropdown-content {
    display: block;
}

.technologies:hover {
    background-color: #fff;
}

.move-left {
    left: -200px;
}

.dropdown-item {
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    color: #333;
}

    .dropdown-item:hover {
        background-color: #ddd;
    }

.t-popup.active {
    opacity: 1;
    transition: opacity .16s ease-in-out,visibility 0s 0s;
    visibility: visible;
}

.t-popup {
    background-color: #fff;
    left: 50px;
    opacity: 0;
    padding: 15px 12px;
    position: absolute;
    top: 64px;
    transition: opacity .16s ease-in-out,visibility 0s .16s;
    visibility: hidden;
    min-width: 320px;
    z-index: 3;
    border: 1px solid #f0f0f0;
}

.t-popup-column-value {
    background-position: 0;
    background-repeat: no-repeat;
    color: #000;
    font-size: 30px;
    font-weight: 700;
    line-height: 1.15;
    margin: 0;
    /*padding: 0 0 0 44px;*/
}

.t-popup-column {
    margin-bottom: 4px;
}

.t-popup-description p {
    margin-bottom: 0;
}

.t-popup-description, .t-popup-description p {
    color: #000;
    font-size: 14px;
    line-height: normal;
}

.projects-slider ul li {
    text-align: left !important;
    list-style: outside !important;
}

.cls-2:hover {
    fill: #000;
}



#dataVisualTechniques .popup, #projectSlider .popup {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    text-align: center;
    z-index: 100;
}

    #dataVisualTechniques .popup img, #projectSlider .popup img {
        max-width: 90%;
        max-height: 90%;
        margin: auto;
        display: block;
        padding: 20px;
    }

#dataVisualTechniques .close-popup, #projectSlider .close-popup, #fullpage .close-popup {
    position: absolute;
    top: 15px;
    right: 35px;
    font-size: 50px;
    cursor: pointer;
    color: white;
}

#dataVisualTechniques img, #projectSlider img {
    cursor: zoom-in;
}

#fullpage {
    display: none;
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-size: contain;
    background-repeat: no-repeat no-repeat;
    background-position: center center;
    background-color: rgba(0, 0, 0, 0.7);
}

    #fullpage img {
        max-width: 90%;
        max-height: 90%;
        margin: auto;
        display: block;
        padding: 20px;
    }

.carousalStyle {
    width: 80%;
    margin: 0 auto;
    background-color: #f5f5f7;
    border-radius: 20px;
}

@media (max-width: 608px) {
    .t-popup {
        min-width: 200px !important;
    }

    .move-left {
        left: -180px !important;
    }

    #dataVisualTechniques .popup, #projectSlider .popup {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.7);
        text-align: center;
        z-index: 100;
        padding: 50% 0;
    }

    #fullpage img {
        max-width: 90%;
        max-height: 90%;
        margin: auto;
        display: block;
        padding-top: 50%;
    }

    .carousalStyle {
        width: 90%;
        background-color: #f5f5f7;
        border-radius: 20px;
        margin: 15px;
        padding: 15px;
    }
}

.andrew-Testimonial {
    text-align: justify;
}

/*new portfolio sldier css*/

.web-page-portfolio-slider {
    padding: 0 2.5rem;
}

.slider-container {
    position: relative;
    width: 100%;
    height: 560px;
    overflow: hidden;
}

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

.sliderImage {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0;
    transition: opacity 2s ease-in-out; /* Smooth fade in/out */
    z-index: 1;
    border-radius: 15px;
    padding: 0 1.5rem;
}

    .sliderImage.active {
        opacity: 1;
        z-index: 2; /* Ensure active slide is in front */
    }

.paginationProjectCardsSlider {
    text-align: center;
}

.dotAnimtionSlider {
    display: inline-block;
    width: 10px;
    height: 10px;
    background-color: #e57f99;
    margin: 0 5px;
    border-radius: 50%;
    cursor: pointer;
}

    .dotAnimtionSlider.active {
        background-color: #c03 !important;
    }

button.prevAnimtionSlider, button.nextAnimtionSlider {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: rgb(0 0 0 / 0%);
    color: #fff;
    border: none;
    padding: 10px;
    cursor: pointer;
}

button.prevAnimtionSlider {
    left: -15px;
    z-index: 3;
}

button.nextAnimtionSlider {
    right: -15px;
    z-index: 3;
}

.prevAnimtionSlider img {
    width: 30px;
}

.nextAnimtionSlider img {
    width: 30px;
}

/* Slideshow container */
.data-vistualization-autoSlider-container {
    max-width: 100%;
    margin: auto;
}


/* The dots/bullets/indicators */
.data-vis-auto-slider-btn {
    height: 15px;
    width: 15px;
    margin: 0 2px;
    background-color: white;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.6s ease;
}

.data-vis-active {
    background-color: #0830f3e0;
}

/* Fading animation */
.data-vis-auto-slider-fade {
    animation-name: data-vis-auto-slider-fade;
    animation-duration: 1.5s;
}

.data-vis-auto-slider-image {
    width: 100%;
    object-fit: contain;
    border-radius: 5px;
}

@keyframes data-vis-auto-slider-fade {
    from {
        opacity: .4
    }

    to {
        opacity: 1
    }
}

.data-vis-slider {
    background: linear-gradient(to right, #058af5, #0063ce);
}

.data-vis-auto-slider-left-btn {
    position: absolute;
    top: 50%;
    left: -30px;
    font-size: 25px;
    border: none;
    background: none;
}

.data-vis-auto-slider-right-btn {
    position: absolute;
    top: 50%;
    right: -12px;
    font-size: 25px;
    border: none;
    background: none;
}

.main-heading-home-page {
    background: linear-gradient(to right, #058af5, #0063ce);
}

.carousel-prev-btn {
    left: -35px;
}

.carousel-next-btn {
    right: -35px;
}

.sale-system-list {
    display: inline-block;
}
/*.data-vis-auto-slider-right-btn:hover {
    color: white;
}

.data-vis-auto-slider-left-btn:hover {
    color: white;
}*/

.client-loving-ul-list {
    list-style-image: url('../images/arrow-bullets-icon.png') !important;
}

.service-card {
    border-radius: 0.15rem;
    padding: 1rem 0.25rem;
    align-items: center;
    background-color: var(--white-color);
    box-shadow: 1px 1px 7px 0px #003874;
    justify-content: center;
    text-align: center;
    margin-right: 10px;
    color: black;
}

.service-slider .prev-arrow {
    color: var(--black-color);
    top: 35%;
    left: -50px;
}

.service-slider .next-arrow {
    color: var(--black-color);
    top: 35%;
    right: -40px;
}

.about-home-container {
    background-color: var(--blue-color);
}

.about-us-home-image {
    width: auto;
}

.bg-gray {
    background-color: #f5f5f7;
}

.custom-min-hight {
    min-height: 38px;
}

.custom-shadown {
    box-shadow: 0 0 8px 2px #d9d0d0;
    border-radius: 10px;
}

/* Styling by Shakeeb starts */

.icons-image img {
    height: 12vh;
}

.icons-image-unique-solution img {
    height: 10vh
}

.line-horizontal {
    height: 10px;
    background-color: #ccc;
    z-index: -1;
    position: absolute;
    transform: translateY(-50%);
    top: 180px !important;
    left: 10%;
    right: 10%;
}

@media (min-width: 767px) {
    .line-horizontal {
        top: 160px !important;
    }
}

@media (min-width: 990px) {
    .line-horizontal {
        top: 175px !important;
    }
}

@media (min-width: 1200px) {
    .line-horizontal {
        top: 180px !important;
    }
}

@media (min-width: 2200px) {
    .line-horizontal {
        top: 210px !important;
    }
}


.integration-logo {
    width: 150px; 
    height: 150px; 
    display: flex; 
    flex-direction: column; 
    align-items: center; 
    justify-content: center; 
    text-align: center; 
    padding: 10px 3rem; 
    border-radius: 10px; 
}

.integration-logo img {
        max-width: 80%; 
        max-height: 40px; 
        object-fit: contain; 
}

.integration-logo h6 {
        margin-top: 8px; 
        margin-top: 8px; 
        font-size: 0.9rem; 
        line-height: 1.2; 
        white-space: nowrap; 
}

.devops-technology-dive {
    margin-top: 4.5rem !important;
}

.sql-logo {
    padding: 0 12px;
}

.navbar-nav .nav-item a:hover {
    color: #0063ce;
}

.contactDescription {
    margin-top: 0;
    margin-bottom: 10px;
}

#CaptchaInputText {
    margin-bottom: 0;
}

/* Styling by Shakeeb ends */