/*COLOR CODES
==============

main blue - #13AFB9
light blue - #E3F4F9
medium blue - #C2E3EA
dark grey blue - #2D2E41 
light grey blue - #3C3C54
services bg - #F8F9F9

burgundy blue - #35606D
blog gray - #E8E8E8

FONTS
font-family: 'Visby CF', sans-serif; 
font-family: 'Poppins', sans-serif;

*/

/*imported nexa*/
@import url('https://fonts.googleapis.com/css2?family=Nexa:wght@200;300;400;500;600;700;800;900&display=swap');

/*imported visby*/
@import url('https://fonts.googleapis.com/css2?family=Visby+CF:wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

/*imported poppins*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');


* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    overflow-x: hidden;
    /* overflow-y: hidden!important; */
}

body {
    background-color: #F8F9F9;
    font-family: 'Poppins', sans-serif;
    
}

body p {
    font-size: 14px;
}

section,
div,
article,
h1,
h2,
h3,
h4,
h5,
h6,
p {
    overflow: hidden !important;
}

.nav-area,
.wrapper,
.nav-links,
.nav-items,
.mobile-item,
.mega-box,
.content,
.row.drop-serv,
.form-outline.b-name.gs,
.form-control.gs.b-name {
    overflow: visible !important;
}

.swiper,
.swiper-wrapper {
    overflow-x: visible !important;
    overflow-y: visible !important;
}


/* navigation aid buttons*/
#scroll-to-top-bottom {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 18px;
    cursor: pointer;
    display: none;
}

.scroll-text {
    display: inline-block;
    margin-left: 5px;
    /* font-size: 22px; */
}

.fa-angles-down,
.fa-angles-up {
    font-size: 36px !important;
    color: #13AFB9;
}

/*navigation aid MEDIA QUERY*/
@media screen and (max-width: 768px) {}

/*anchor tags edit*/
.row-blogs a {
    text-decoration: none;
}

.solo-service a {
    text-decoration: none;
}

.sideblog a {
    text-decoration: none;
}

.news a {
    text-decoration: none;
    color: #fff;
}

button a {
    text-decoration: none;
    color: #fff;
}

button a:hover {
    color: #13AFB9;
}

/*reveal js styles*/
.reveal {
    position: relative;
    transform: translateY(150px);
    opacity: 0;
    transition: all 2s ease;
}

.reveal.active {
    transform: translateY(0px);
    opacity: 1;
}

.icon {
    width: 180px;
    height: 180px;
}

/* =====TRANSPARENT navbar and logo=====*/
.nav-area.home {
    background: transparent;
}

.nav-links.home li a {
    color: #fff;
    transition: all 0.6s ease;
}

#alternativeNavbar {
    display: none;
}


/* ===== ALTERNATIVE navbar and logo=====*/
/*navarea.js*/
.nav-links li a {
    color: #000;
    text-decoration: none;
    font-size: 16px;
    font-weight: 500;
    padding: 9px 30px;
    transition: all 0.6s ease;
}

.nav-links li a:hover {
    color: #13AFB9;
}

.nav-area {
    position: fixed;
    z-index: 99;
    width: 100%;
    left: 0;
    top: 0;
    box-sizing: border-box;
    background: #fff;
    transition: top .6s;

}

.nav-area.animate {
    top: -101px;
    transition: 0.6s ease;
}

.nav-area.sticky {
    top: 0;
    z-index: 99;
    transition: top 0.6s, background-color 0.6s;
}

nav .wrapper {
    position: relative;
    width: 100%;
    height: 100px;
    line-height: 100px;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;

}
 /*logo*/
 .logo {
     display: flex;
     align-items: center;
     justify-content: space-between;
 }

 .logo_img {
     width: 200px;
     height: 70px;
     margin-left: 30px;
     cursor: pointer;
 }

.wrapper .nav-links {
    display: inline-flex;
    margin-top: 20px;
}

.nav-links li {
    list-style: none;
}

.nav-links .mobile-item {
    display: none;
}

.nav-links li:hover .drop-menu,
.nav-links li:hover .mega-box {
    transition: all 0.3s ease;
    top: 70px;
    opacity: 1;
    visibility: visible;
    /* visibility: hidden; */
}

.background-pattern{
    display: none;
}



/* query for screens larger than 1200px */
@media screen and (min-width: 1200px) {
    .mega-box {
        position: absolute;
        left: 0;
        width: 100%;
        /* padding: 0 10px; */
        top: 85px;
        opacity: 0;
        visibility: hidden;
    }

    .mega-box .content {
        background: #13AFB9;
        /* padding: 25px 20px; */
        display: flex;
        /* align-items: center;
        justify-content: space-between; */
        width: 100%;
        /* height: 500px; */
        /* justify-content: space-between;
        box-shadow: 0 6px 10px rgba(0,0,0,0.15); */
    }

    .mega-box .content .row {
        /* width: calc(25% - 30px); */
        line-height: 45px;
    }

    .drop-serv {
        /* border: 1px solid #2D2E41; */
        padding: 20px;
        padding-left: 5px;
        padding-right: 5px;
        /* padding-top: 50px; */
        /* height: 400px; */
        width: 100%;
        /* min-width: 250px;
    max-width: 250px; */
        /* margin: 0 10px; */
        background: #13AFB9;
        color: #fff;
        text-align: center;
        transition: 0.6s;
        font-family: 'Poppins', sans-serif;
        box-sizing: border-box;
    }

    .drop-serv * {
        box-sizing: border-box;
    }
}

/*end of media query*/



/*mega dropdown*/
.mega-box {
    position: absolute;
    left: 0;
    width: 100%;
    /* padding: 0 10px; */
    top: 85px;
    opacity: 0;
    visibility: hidden;
}

.mega-box .content {
    background: #13AFB9;
    /* padding: 25px 20px; */
    display: flex;
    /* align-items: center;
    justify-content: space-between; */
    width: 100%;
    /* height: 500px; */
    /* justify-content: space-between;
    box-shadow: 0 6px 10px rgba(0,0,0,0.15); */
}

.mega-box .content .row {
    /* width: calc(25% - 30px); */
    line-height: 45px;
}

.drop-serv {
    /* border: 1px solid #2D2E41; */
    padding: 20px;
    padding-left: 5px;
    padding-right: 5px;
    /* padding-top: 50px; */
    /* height: 400px; */
    width: 100%;
    /* min-width: 250px;
        max-width: 250px; */
    /* margin: 0 10px; */
    background: #13AFB9;
    color: #fff;
    text-align: center;
    transition: 0.6s;
    font-family: 'Poppins', sans-serif;
    box-sizing: border-box;
}

.drop-serv * {
    box-sizing: border-box;
}

.drop-serv a {
    text-decoration: none;
    color: #fff;
}

.drop-serv:hover {
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(images/landing-perfect.PNG);
    background-size: cover;
    background-position: center;
    color: #fff;
    transition: 0.6s;
    cursor: pointer;
}

.drop-serv.one {
    background-color: #317D88;
    /* background-color: #35606D; */
}

.drop-serv.one:hover {
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(images/woman4.jpeg);
    background-size: cover;
    background-position: center;
    color: #fff;
    transition: 0.6s;
    cursor: pointer;
}

.drop-serv.two {
    background-color: #35606D;
    /* background-color: #317D88; */
}

.drop-serv.two:hover {
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(images/woman3.jpg);
    background-size: cover;
    background-position: center;
    color: #fff;
    transition: 0.6s;
    cursor: pointer;
}

.drop-serv.three {
    background-color: #04A1AA;
}

.drop-serv.three:hover {
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(images/woman2.jpg);
    background-size: cover;
    background-position: center;
    color: #fff;
    transition: 0.6s;
    cursor: pointer;
}

.drop-serv.four {
    background-color: #0DB4BE;
}

.drop-serv.four:hover {
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(images/taxcomp.PNG);
    background-size: cover;
    background-position: center;
    color: #fff;
    transition: 0.6s;
    cursor: pointer;
}

.drop-serv.five {
    background-color: #19C3CC;
}

.drop-serv.five:hover {
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(images/customsupport.PNG);
    background-size: cover;
    background-position: center;
    color: #fff;
    transition: 0.6s;
    cursor: pointer;
}

.drop-serv.six {
    background-color: #0DB4BE;
}

.drop-serv.six:hover {
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(images/image4.jpg);
    background-size: cover;
    background-position: center;
    color: #fff;
    transition: 0.6s;
    cursor: pointer;
}

.drop-serv h3 {
    font-weight: bold;
    margin-bottom: 50px;
    color: #fff;
}

.wrapper .btn {
    color: #000;
    font-size: 20px;
    cursor: pointer;
    display: none;
}

.wrapper .btn.close-btn {
    position: absolute;
    right: 30px;
    top: 10px;
}

.btn.dropmenu-get-started {
    padding: 10px 30px;
    text-decoration: none;
    transition: 0.6s ease;
    background-color: #13AFB9;
    color: #fff;
    border: 1px solid #13AFB9;
    /* margin-bottom: 20px; */
    display: block;
}

.dropmenu-get-started:hover {
    background-color: #E3F4F9;
    color: #13AFB9;
    border: 1px solid #13AFB9;
}

.btn-success {
    background-color: #13AFB9;
    color: #fff;
    border: 1px solid #13AFB9;
}

.btn.nav-get-started {
    margin-right: 50px;
    color: #fff;
    display: block;
    font-size: 16px;
}

.btn-success:hover {
    background-color: #E3F4F9;
    color: #13AFB9;
    border: 1px solid #13AFB9;
}

nav input {
    display: none;
}

/* NAVBAR MEDIA QUERY*/
@media screen and (max-width: 1400px) {
    .drop-serv.six {
        display: none;
    }
}
@media screen and (max-width: 1200px) {
    .nav-links li:hover .drop-menu,
        .nav-links li:hover .mega-box {
            visibility: hidden;
        }
    .drop-serv.six {
        display: none;
    }
}

@media screen and (max-width: 1050px) {
    

    .drop-serv.six,
    .drop-serv.five {
        display: none;
    }
}

@media screen and (max-width: 992px) {
    .btn.nav-get-started {
        display: none;
    }

    .drop-serv.six,
    .drop-serv.five {
        display: none;
    }
}

@media screen and (max-width: 850px) {

    body,
    html,
    section,
    div {
        overflow-x: hidden;
    }

    section,
    div {
        overflow-y: hidden;
    }

    .swiper,
    .swiper-wrapper {
        overflow-x: visible !important;
        overflow-y: visible !important;
    }

    /* Override for the specific elements you want to exclude */
    .mega-box,
    .mega-box * {
        overflow-x: hidden !important;
    }

    .wrapper .btn {
        display: block;
    }
   
        .wrapper .nav-links {
            margin-left: 170px!important;
            position: fixed;
            height: auto;
            width: 400px;
            top: 0;
            /* clear: right !important; */
            /* right: 0; */
            left: 100%;
            background: #2E2E41;
            display: block;
            padding: 50px 10px;
            line-height: 50px;
            overflow-y: auto;
            box-shadow: 0px 15px 15px rgba(0, 0, 0, 0.18);
            transition: all 0.3s ease;
        }
        .wrapper .btn.close-btn {
            position: absolute;
            /* float: left!important; */
            margin-right: 300px!important; 
            /* top: 10px; */
        }

        .background-pattern{
            display: block;
        }

    /* custom scroll bar */
    ::-webkit-scrollbar {
        width: 10px;
    }

    ::-webkit-scrollbar-track {
        background: #13AFB9;
    }

    ::-webkit-scrollbar-thumb {
        background: #3A3B3C;
    }

    #menu-btn:checked~.nav-links {
        left: 0%;
    }

    #menu-btn:checked~.btn.menu-btn {
        display: none;
    }

    #close-btn:checked~.btn.menu-btn {
        display: block;
    }

    .nav-links li {
        margin: 15px 10px;
        /* border: 1px solid #fff; */
    }

    .nav-links li a {
        padding: 0 20px;
        display: block;
        font-size: 20px;
        color: #fff;
    }
     /* .nav-links:hover li a {
        color: #000; 
    } */
    .nav-links.nav-items.active {
        color: #13AFB9!important;
    }
    .nav-links li a:hover {
        color: #13AFB9; 
    }

    .nav-links .drop-menu {
        position: static;
        opacity: 1;
        top: 65px;
        visibility: visible;
        padding-left: 20px;
        width: 100%;
        max-height: 0px;
        overflow: hidden;
        box-shadow: none;
        transition: all 0.3s ease;
    }

    #showDrop:checked~.drop-menu,
    #showMega:checked~.mega-box {
        max-height: 100%;
    }

    .nav-links .desktop-item {
        display: none;
    }

    .nav-links .mobile-item {
        display: block;
        color: #f2f2f2 !important;
        font-size: 20px;
        font-weight: 500;
        /* padding-left: 20px; */
        cursor: pointer;
        border-radius: 5px;
        transition: all 0.3s ease;
    }


    .menu-btn {
        color: #13AFB9 !important;
    }

    .close-btn {
        color: #13AFB9!important;
    }

    .mega-box {
        position: static;
        top: 65px;
        opacity: 1;
        visibility: visible;
        padding: 0 20px;
        max-height: 0px;
        overflow: hidden;
        transition: all 0.3s ease;
    }

    .mega-box .content {
        box-shadow: none;
        flex-direction: column;
        padding: 20px 20px 0 20px;
    }

    .mega-box .content .row {
        width: 100%;
        margin-bottom: 15px;
        border-top: 1px solid rgba(255, 255, 255, 0.08);
    }

    .mega-box .content .row:nth-child(1),
    .mega-box .content .row:nth-child(2) {
        border-top: 0px;
    }

    .btn.nav-get-started {
        display: none;
    }
}

@media screen and (max-width: 500px) {

    /*logo*/
    .logo_img {
        width: 150px;
        height: 50px;
        margin-left: 20px;
        cursor: pointer;
    }

    .btn.nav-get-started {
        display: none;
    }
}


/* ===== landing=====*/
section.landing {
    width: 100%;
    min-height: 800px;
    position: relative;
    color: #fff;
    /* background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(images/placee.png); */
    background-image: linear-gradient(rgba(46, 46, 65, 0.7), rgba(0, 0, 0, 0.5)), url(images/placee.png);
    background-position: center;
    background-size: cover; 
}

/* section.landing video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section.landing .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(46, 46, 65, 0.7);
} */

.landing-left {
    padding: 0px;
    padding-top: 260px;
    padding-left: 130px;
    padding-bottom: 0px;
    overflow-y: hidden;
}

.landing-left h1 {
    font-size: 22px;
    font-weight: normal;
    margin-top: 35px;
    overflow-y: hidden;
}

.landing-left img {
    margin-right: 10px;
    overflow-y: hidden;
}

.about-top {
    overflow-y: hidden;
}

.about-bottom {
    margin-top: 100px;
    padding: 40px;
    padding-bottom: 20px;
    background-color: #2D2E41;
    color: #fff;
    margin-right: 100px;
    overflow-y: hidden;
}

.about-bottom h4 {
    margin-bottom: 20px;
}

.about-bottom p {
    font-size: 14px;
    font-weight: normal;
    color: #eee;
}

.landing-right {
    padding: 50px;
    padding-top: 260px;
    padding-left: 20px;
    padding-right: 20px;
}

.landing-right h1 {
    font-size: 70px;
    font-weight: bolder;
}

.empower {
    width: 100%;
    min-height: 300px;
    padding-right: 10px;
}

.empower.three h1 {
    font-size: 60px;
}

.landing-right h4 {
    font-family: 'Visby CF', sans-serif;
    font-weight: lighter;
    margin-bottom: 30px;
}

.landing-right i {
    font-size: 20px;
}

/*swiper*/
.swiper-button-next.lnd {
    color: #ececec;
}

/*button*/
.button-div {
    float: left;
    padding-top: 20px;
}

.start-now {
    border-radius: 0;
    padding: 7px 15px;
    font-size: 18px;
    font-weight: 500;
}


/*LANDING SECTION media query*/
@media screen and (max-width: 1380px) {
    section.landing {
        min-height: 500px;
    }

    .about-top {
        display: none;
    }

    .about-bottom {
        display: none;
    }

    .landing-right {
        width: 100%;
        /* padding: 70px; */
        padding-top: 100px;
        padding-bottom: 70px;
        padding-left: 50px;
        padding-right: 30px;
    }
}

@media screen and (max-width: 1030px) {
    section.landing {
        min-height: 500px;
    }

    .about-top {
        display: none;
    }

    .about-bottom {
        display: none;
    }

    .landing-right {
        width: 100%;
        /* padding: 70px; */
        padding-top: 100px;
        padding-bottom: 70px;
        padding-left: 50px;
        padding-right: 30px;
    }
}

@media screen and (max-width: 850px) {
    section.landing {
        min-height: 500px;
    }

    .about-top {
        display: none;
    }

    .about-bottom {
        display: none;
    }

    .landing-right {
        /* padding: 70px; */
        padding-top: 100px;
        padding-bottom: 70px;
        padding-left: 50px;
        padding-right: 30px;
    }

    .landing-right h1 {
        font-size: 50px !important;
        font-weight: bolder;
        margin-bottom: 30px;
    }

    .empower.three h1 {
        font-size: 40px;
    }

    .landing-right h4 {
        font-family: 'Visby CF', sans-serif;
        font-weight: 100;
        margin-bottom: 30px;
    }

    .button-div {
        margin-right: 0px;
        margin-top: 50px;
    }
}

@media screen and (max-width: 500px) {
    section.landing {
        min-height: 500px;
    }

    .about-bottom {
        display: none;
    }

    .landing-right {
        padding-top: 0;
        padding-bottom: 70px;
        padding-left: 50px;
        padding-right: 10px;
    }

    .landing-right h1 {
        font-size: 35px !important;
        font-weight: bolder;
        margin-bottom: 30px;
    }

    .empower.one h1 {
        font-size: 35px;
    }

    .empower.three h1 {
        font-size: 35px;
    }

    .landing-right h4 {
        font-family: 'Visby CF', sans-serif;
        font-weight: 100;
        margin-bottom: 30px;
    }

    .row-list {
        display: none;
    }

    .button-div {
        margin-right: 0px;
        margin-top: 50px;
    }

}

/* ===== services=====*/
section.services {
    min-height: 800px;
    padding: 100px;
    padding-left: 50px;
    padding-right: 50px;
    background-color: #F8F9F9;
    /* overflow-y: hidden; */
}

.serv-left {
    padding-left: 50px;
    padding-right: 50px;
    border: 2px solid #F8F9F9;
}

.serv-left h6 {
    font-family: 'Visby CF', sans-serif;
    font-size: 22px;
}

.serv-left h1 {
    font-size: 45px;
    font-weight: bolder;
    color: #000;
}

/*columns*/
.column h2 {
    margin-bottom: 50px;
}

.columns {
    display: flex;
    flex-flow: wrap;
    justify-content: center;
    align-items: center;
}

.column {
    width: 100%;
    border: 1px solid #F8F9F9;
    padding: 20px;
    padding-top: 40px;
    padding-left: 50px;
    background: #F8F9F9;
    transition: 0.3s;
    color: #000;
    margin: 20px;

}
.column{
    height: 420px;
}
.columns a {
    text-decoration: none;
    color: #000;
}

.columns a:hover {
    color: #fff;
}

.column:hover {
    box-shadow: 0 0 20px 0px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    transition: transform 0.5s;
    transform: translateY(-10px);
    background-color: #2E2E41;
    color: #fff;
}

.more {
    margin-left: 20px;
    float: right;
    cursor: pointer;
}

.more a {
    text-decoration: none;
    font-weight: bolder;
    color: #2D2E41;
}

.more h4 {
    font-size: 18px;
}

.more h4:hover {
    color: #13AFB9;
    transform: translateX(10px);
    transition: transform 1s ease;
}

/*SERVICES SECTION media query*/
@media screen and (max-width: 1200px) {
    .column-out {
        width: 100%;
    }
}

/*ipad - 1024*/
@media screen and (max-width: 1030px) {
    .column-out {
        width: 100%;
    }
}

@media screen and (max-width: 500px) {
    section.services {
        padding: 100px;
        padding-left: 10px;
        padding-right: 10px;
    }

    .columns {
        padding: 0px;
        margin: 0 0;
    }

    .column {
        width: 100%;
        height: auto;
        padding: 20px;
        padding-top: 40px;
        padding-left: 20px;
        padding-right: 20px;
        margin: 0;
    }

    .serv-left {
        padding-left: 0px;
        padding-right: 0px;
    }

    .serv-row h1 {
        display: none;
    }

    .serv-row h6 {
        font-size: 30px;
        font-weight: normal;
    }

}

/* ===== sub-services section=====*/
section.sub-services {
    min-height: 500px;
    padding-top: 70px;
    background-color: #fff;
    overflow-y: hidden;
    overflow-x: hidden;
}

.subserv-left {
    background-color: #fff;
    /* padding: 20px;
    padding-right: 50px; */
    color: #000;
    min-height: 500px;
    padding: 100px;
    padding-left: 50px;
    padding-top: 50px;
}

.vp-text {
    height: 450px;
}

.vp-image {
    height: 450px;
}

.services-image {
    width: 100%;
    height: 420px;
}

.box-wrap {
    /* margin-top: 20px; */
    height: 200px;
    color: #fff;
}

.box-wrap p {
    font-size: 42px;
    font-weight: bolder;

}

.box-wrap .box {
    margin-right: 20px;
    padding: 50px;
    background-color: #3C3C54;
    /* width: 100%; */
    height: 200px;
}

.box-wrap .box.two {
    background-color: #13AFB9;
}

/* .box-wrap img{
    width: 50px;
    height: 50px;
} */

.subserv-right {
    min-height: 500px;
    padding: 100px;
    padding-top: 50px;
    padding-right: 50px;
}

.subserv-right h5 {
    font-size: 22px;
}

.subserv-right h1 {
    margin-top: 20px;
    font-size: 60px;
    font-weight: bolder;
    color: #2D2E41;
    margin-bottom: 20px;
}

.subserv-right p {
    font-size: 15px;
    font-weight: 500;
    color: #3C3C54;
    /* margin-bottom: 30px; */
}

.subserv-right .box-wrap.sec {
    /* margin-top: 50px!important; */
    margin-left: 0;
    height: 200px;
    color: #fff;
}

.subserv-right .box-wrap .box {
    margin-right: 20px;
    padding: 50px;
    background-color: #3C3C54;
    /* width: 100%; */
    height: 200px;
}

.subserv-right .box-wrap .box.two {
    background-color: #13AFB9;
}

.subserv-right .box-wrap p {
    font-size: 42px !important;
    font-weight: bolder !important;
    color: #fff !important;

}


/*SUB-SERVICES SECTION media query*/
@media screen and (max-width: 1380px) {
    .sub-services .row {
        flex-direction: column;
    }

    .subserv-left {
        width: 90%;
        padding-left: 100px;
        padding-right: 0;
    }

    .subserv-right {
        width: 90%;
    }
    .vp-text {
        height: auto;
        min-height: 350px;
    }
    .vp-image {
        min-height: 650px;
        margin-bottom: 20px;
    }

    .services-image {
        height: 650px;
    }
}

@media screen and (max-width: 1200px) {
    .sub-services .row {
        flex-direction: column;
    }

    .subserv-left {
        width: 90%;
        padding-left: 100px;
        padding-right: 0;
    }

    .subserv-right {
        width: 90%;
        /* padding-right: 80px; */
    }

    .services-image {
        height: 650px;
    }
}

@media screen and (max-width: 992px) {
    .box-in {
        display: flex;
        flex-flow: wrap;
        justify-content: center;
        align-items: center;
    }

    .box h6 {
        display: flex;
        flex-flow: wrap;
        justify-content: center;
        align-items: center;
    }

    .box-wrap {
        min-width: 100%;
        width: 100%;
        margin-left: 0px;
        height: 200px;
    }

    .box-wrap .box {
        width: 100%;
        padding: 30px;
        padding-right: 0;
        margin: 5px;
        height: auto;
    }

    .subserv-right .box-wrap .box {
        width: 100%;
        padding: 30px;
        padding-right: 0;
        margin: 5px;
        height: auto;
    }
}

@media screen and (max-width: 768px) {
    .sub-services .row {
        flex-direction: column;
    }

    .subserv-left {
        width: 90%;
        padding: 50px;
        padding-left: 50px;
        padding-right: 0;
    }

    .subserv-right {
        width: 90%;
        padding: 50px;
        padding-left: 50px;
        padding-right: 0;
        /* padding-right: 80px; */
    }
    .vp-image {
        min-height: 0;
        margin-bottom: 20px;
    }
    .services-image {
        height: auto;
    }

}
@media screen and (max-width: 650px) {
    .vp-image {
        min-height: 450px;
        margin-bottom: 20px;
    }
    .services-image {
        height: 450px;
    }
}
@media screen and (max-width: 550px) {
    .box-in {
        display: flex;
        flex-flow: wrap;
        justify-content: center;
        align-items: center;
    }

    .box h6 {
        display: flex;
        flex-flow: wrap;
        justify-content: center;
        align-items: center;
    }

    .box-wrap {
        min-width: 100%;
        width: 100%;
        margin-left: 0px;
        height: 200px;
    }

    .box-wrap .box {
        width: 100%;
        padding: 30px;
        padding-right: 0;
        margin: 5px;
        height: auto;
    }

    .subserv-right .box-wrap .box {
        width: 100%;
        padding: 30px;
        padding-right: 0;
        margin: 5px;
        height: auto;
    }
        /* .vp-image {
            height: 400px;
            margin-bottom: 20px;
        }
    
        .services-image {
            height: 400px;
        } */
}

@media screen and (max-width: 500px) {
    section.sub-services {
        padding-top: 50px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .subserv-left {
        width: 100%;
        padding-right: 0;
        padding-left: 0;
        padding: 30px;
    }

    .services-image {
        margin-left: 0;
        width: 100%;
        max-height: 400px;
    }

    .box-wrap {
        min-width: 100%;
        width: 100%;
        margin-left: 0px;
        height: 200px;
    }

    .box-wrap .box {
        width: 100%;
        padding: 30px;
        padding-right: 0;
        margin: 5px;
        height: auto;
    }

    .subserv-right .box-wrap .box {
        width: 100%;
        padding: 30px;
        padding-right: 0;
        margin: 5px;
        height: auto;
    }

    .subserv-right {
        padding: 20px;
        width: 100%;
    }

    .vp-text {
        padding-top: 50px;
        width: 100%;
    }

    .subserv-right h1 {
        margin-top: 20px;
        font-size: 40px;
        margin-bottom: 20px;
    }
        .vp-image {
            min-height: 400px;
            margin-bottom: 0;
        }
    
        .services-image {
            height: 400px;
        }
}

@media screen and (max-width: 460px) {
    .box-wrap .box {
        width: 100%;
        padding: 0;
        padding-top: 20px;
        padding-right: 0;
        margin: 5px;
        height: 170px;
    }

    .subserv-right .box-wrap .box {
        width: 100%;
        padding: 0;
        padding-top: 20px;
        padding-right: 0;
        margin: 5px;
        height: 170px;
    }

    .num { 
        font-size: 32px;
    }
        .vp-image {
            max-height: 350px;
            margin-bottom: 0;
        }
    
        .services-image {
            height: 350px;
        }
}

@media screen and (max-width: 360px) {
    .box-wrap .box {
        width: 100%;
        padding: 10px;
        padding-right: 0;
        margin: 5px;
        height: 150px;
    }

    .subserv-right .box-wrap .box {
        width: 100%;
        padding: 10px;
        padding-right: 0;
        margin: 5px;
        height: 150px;
    }

    .num {
        font-size: 32px;
    }
}

/* ===== services third-section =====*/
section.services-third-section {
    min-height: 300px;
    background-image: linear-gradient(rgba(46, 46, 65, 0.7), rgba(46, 46, 65, 0.7)), url(images/services-third.PNG);
    background-size: cover;
    background-position: center;
    color: #fff;
    padding: 20px;
    padding-left: 100px;
}

.thirdserv-left h1 {
    margin-top: 20px;
    font-size: 50px;
    font-weight: bolder;
}

.thirdserv-left p {
    margin-top: 20px;
    font-size: 18px;
    font-weight: normal;
    margin-bottom: 40px;
    color: #ccc;
}

.btn-success.more-insights {
    background-color: #13AFB9;
    color: #fff;
    border: 1px solid #13AFB9;
}

.more-insights:hover {
    background-color: #E3F4F9;
    color: #13AFB9;
    border: 1px solid #13AFB9;
}

/*THIRD-SECTION SERVICES media query*/
@media screen and (max-width: 1200px) {
    .thirdserv-left {
        width: 100%;
    }
}

/*ipad - 1024*/
@media screen and (max-width: 1030px) {
    .thirdserv-left {
        width: 100%;
    }
}

@media screen and (max-width: 500px) {
    section.services-third-section {
        padding-left: 50px;
    }

    .thirdserv-left h1 {
        font-size: 40px;
    }
}


/* ===== clients section =====*/
section.clients {
    background-color: #F8F9F9;
    /* background-color: #fff; */
    padding-top: 30px;
    padding-bottom: 30px;
}

.clients-left {
    padding: 20px;
    padding-left: 100px;
}

.clients-left h6 {
    font-size: 22px;
}

.clients-left h1 {
    margin-top: 20px;
    font-size: 50px;
    font-weight: bolder;
    color: #2D2E41;
    margin-bottom: 20px;
}


/* .imeg {
    width: 200px;
    height: 100px;
}

.imeg img {
    width: 100%;
    height: 100%;
    object-fit: contain;
} */
@keyframes slide {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-100%);
    }
}

.logos {
    overflow: hidden;
    padding: 0px 0;
    background: #F8F9F9;
    white-space: nowrap;
    position: relative;
}

.logos:before,
.logos:after {
    position: absolute;
    top: 0;
    width: 250px;
    height: 100%;
    content: "";
    z-index: 2;
}

.logos:before {
    left: 0;
    background: linear-gradient(to left, rgba(255, 255, 255, 0), white);
}

.logos:after {
    right: 0;
    background: linear-gradient(to right, rgba(255, 255, 255, 0), white);
}

.logos:hover .logos-slide {
    animation-play-state: paused;
}

.logos-slide {
    display: inline-block;
    animation: 35s slide infinite linear;
}

.logos-slide img {
    height: 200px;
    /* margin: 0 40px; */
}


/*CLIENT-SECTION SERVICES media query*/
@media screen and (max-width: 1200px) {
    /* .clients-left {
        width: 100%;
    } */



}

/*ipad - 1024*/
@media screen and (max-width: 1030px) {
    
}

@media screen and (max-width: 500px) {
    .clients-left {
        padding-left: 50px;
    }

    .clients-left h1 {
        font-size: 40px;
    }

}


/* ===== customer-support section =====*/
section.customer-support {
    min-height: 600px;
    padding: 50px;
    background-image: linear-gradient(rgba(53, 96, 109, 0.4), rgba(53, 96, 109, 0.4)), url("images/customsupport.PNG");
    background-size: cover;
    background-position: center;
}

.testimonial {
    background-color: #13AFB9;
}

article.box {
    padding: 50px;
    margin: 50px;
    width: 650px;
    height: 400px;
    background-color: #13AFB9;
    color: #fff;
}

article.box img {
    width: 80px;
    margin-top: 20px;
    border-radius: 50%;
    margin-bottom: 20px;
}

/* .author img {
    width: 80px;
    margin-top: 20px;
    border-radius: 50%;
    margin-bottom: 20px;
} */

article.box h1 {
    font-size: 18px;
}

article.box p {
    font-size: 14px;
}

.swiper-button-next.customer {
    padding: 0;
    margin: 0;
    color: #fff;
}

.swiper-button-prev.customer {
    padding: 0;
    margin: 0;
    color: #fff;
}

.swiper-pagination.customer {
    color: #fff;
}

/* Style the inactive pagination dots */
.swiper-pagination-bullet {
    background-color: white !important;/* Set the color for inactive dots */
    width: 22px !important; 
    height: 8px !important;
    border-radius: 0!important;
    border-radius: 3px!important;
    /* margin: 5px !important; */
}

/* Style the active pagination dot */
.swiper-pagination-bullet-active {
    background-color: white !important;
    /* Set the color for the active dot */
}

.swiper-pagination {
    color: #fff !important;
    /* background-color: #fff!important; */
}

/*CUSTOMER SUPPORT media query*/
@media screen and (min-width: 1200px) {
    article.box {
        padding: 50px;
        margin: 0px;
        width: 100%;
        height: auto;
    }
}

@media screen and (max-width: 1200px) {
    .custom-right {
        display: none;
    }

    .custom-left {
        width: 100%;
    }

}

/*ipad - 1024*/
@media screen and (max-width: 1030px) {
    .custom-right {
        display: none;
    }

    .custom-left {
        width: 100%;
    }

}

@media screen and (max-width: 500px) {
    section.customer-support {
        min-height: 500px;
        padding-top: 50px;
        padding-bottom: 50px;
        padding-left: 20px;
        padding-right: 20px;

    }

    article.box {
        padding: 50px;
        margin: 0px;
        width: 100%;
        height: auto;
    }
}

/* ===== blog section =====*/
section.blog {
    min-height: 700px;
    padding: 100px;
    padding-right: 0;
    padding-left: 100px;
    background-color: #fff;
}

.blog h6 {
    font-size: 22px;
}

.blog h1 {
    /* margin-top: 20px; */
    font-size: 50px;
    font-weight: bolder;
    color: #2D2E41;
    margin-bottom: 20px;
}

.more-blogs {
    float: right;
    margin-top: 20px;
    margin-right: 40px;
    cursor: pointer;
}

.more-blogs a {
    text-decoration: none;
    font-weight: bolder;
    color: #2D2E41;
}

.more-blogs h4 {
    font-size: 20px;
    font-weight: 600;
}

.more-blogs h4:hover {
    color: #13AFB9;
    transform: translateX(10px);
    transition: transform 1s ease;
}

.row-blogs {
    display: flex;
    flex-flow: wrap;
    justify-content: center;
    align-items: center;
}

/* .blog-col {
    
    width: 500px;
    height: 600px;
} */

.blog-col-out {
    margin: 20px;
    padding: 25px;
    width: 420px;
    height: 600px;
}

.blog-col-out img {
    margin-right: 20px;
    width: 70px;
    height: 70px;
}

.blog-col-out h4 {
    margin-bottom: 150px;
    font-size: 18px;
}

.blog-col-out h5 {
    padding-top: 200px;
    font-weight: normal;
    margin-bottom: 20px;
    font-size: 18px;
}

.blog-col-out h3 {
    font-weight: bolder;
    margin-bottom: 30px;
    height: 150px;
}

.blog-col-out h3:hover {
    color: #fff;
}

.blog-col-out h6 {
    font-weight: normal;
    margin-bottom: 30px;
    font-size: 18px;
}

.blog-col-out a {
    /* color: #35606D; */
    color: #fff;
    text-decoration: none;
}

.blog-col-out a:hover {
    color: #fff;
}

.blog-col-out:hover {
    /* transform: translateY(-10px); */
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(images/blogpic.PNG);
    background-size: cover;
    background-position: center;
    color: #fff;
}

.blog-active {
    background-image: linear-gradient(rgba(53, 96, 109, 0.5), rgba(53, 96, 109, 0.5)), url(images/blogpic.PNG);
    background-size: cover;
    background-position: center;
    color: #fff;
    transition: background-position 1s ease;
}

.blog-active:hover {
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(images/blogpic.PNG);
    background-position: center right;
}

.blog-active a {
    color: #fff;
}

.blog-col-out.two {
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(images/services-third.PNG);
    background-size: cover;
    background-position: center;
    color: #fff;
    transition: background-position 1s ease;
}

.blog-col-out.two:hover {
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(images/services-third.PNG);
    background-position: center right;
    color: #fff;
}

.blog-col-out.three {
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(images/image2.jpg);
    background-size: cover;
    background-position: center;
    color: #fff;
    transition: background-position 1s ease;
}

.blog-col-out.three:hover {
    /* transform: translateY(-10px); */
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(images/image2.jpg);
    background-position: center right;
    color: #fff;
}



/*BLOG SECTION media query*/
@media screen and (max-width: 1499px) {
    .row-blogs {
        display: flex;
        flex-flow: wrap;
        justify-content: center;
        align-items: center;
    }

    /* .blog-col {
        margin: 20px;
        padding: 25px;
        width: 500px;
    } */

    .blog-col-out {
        width: 420px;
    }

    .blog-col-out.three {
        display: none;
    }
}

@media screen and (max-width: 1200px) {
    section.blog {
        min-height: 700px;
        padding: 100px;
        padding-right: 0;
        padding-left: 50px;
        background-color: #fff;
    }
}

@media screen and (max-width: 1165px) {
    section.blog {
        min-height: 700px;
        padding-top: 50px;
        padding-bottom: 50px;
        padding-left: 50px;
        padding-right: 50px;
    }

    /* .blog-col {
        margin: 20px;
        padding: 25px;
        width: 450px;
    } */

    .blog-col-out {
        width: 420px;
    }
}

/*ipad - 1024*/
@media screen and (max-width: 1030px) {
    section.blog {
        min-height: 700px;
        padding-top: 50px;
        padding-bottom: 50px;
        padding-left: 50px;
        padding-right: 50px;
    }

    .row-blogs {
        display: flex;
        flex-flow: wrap;
        justify-content: center;
        align-items: center;
    }
    .blog-col-out {
        width: 405px;
    }

   
    .blog-col-out.three {
        display: none;
    }

}

@media screen and (max-width: 992px) {
    section.blog {
        min-height: 700px;
        padding-top: 50px;
        padding-bottom: 50px;
        padding-left: 100px;
        padding-right: 100px;
    }
    .blog-col-out {
        width: 450px;
    }

    .blog-col-out.two,
    .blog-col-out.three {
        display: none;
    }
}
@media screen and (max-width: 600px) {
    section.blog {
        padding-left: 50px;
        padding-right: 50px;
    }

}

@media screen and (max-width: 500px) {
    section.blog {
        min-height: 400px;
        padding-top: 50px;
        padding-bottom: 50px;
        padding-left: 25px;
        padding-right: 25px;
    }
     .blog-col-out {
        width: 100%;
    }

    .blog-col-out.two,
    .blog-col-out.three {
        display: none;
    }
}

/* ===== calltoaction section =====*/
section.calltoaction {
    min-height: 300px;
    padding-bottom: 10px;
    background-color: #E3F4F9;
}

.cta {
    padding: 100px;
    padding-bottom: 0;
}

.cta h1 {
    text-align: center;
    color: #2D2E41;
    font-size: 50px;
    font-weight: 800;
    margin-bottom: 50px;
}

.form-area {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.bluepattern {
    padding: 0;
    margin: 0;
}

.bluepattern img {
    padding: 0;
    margin: 0;
}

.f-outline {
    margin-left: 30px;
    margin-right: 30px;
    margin-bottom: 20px;
}

.f-input {
    height: 60px;
    min-width: 700px;
    margin-right: 10px;
    border: 1px solid #13AFB9;
}

.cta h6 {
    font-weight: normal;
}

/*CALL TO ACTION SECTION media query*/
@media screen and (min-width: 1200px) {
    .f-outline {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        /* margin:0; */
        margin-left: 20px;
        margin-right: 20px;
        margin-bottom: 20px;
        /* padding: 0; */
    }

    .f-input {
        height: 60px;
        min-width: 0;
        width: 100%;
        /* max-width: 800px; */
        margin-right: 0;
        margin: 20px;
    }
}

@media screen and (max-width: 1200px) {
    .f-outline {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        /* margin:0; */
        margin-left: 20px;
        margin-right: 20px;
        margin-bottom: 20px;
        /* padding: 0; */
    }

    .f-input {
        height: 50px;
        min-width: 0;
        width: 100%;
        max-width: 500px;
        margin-right: 0;
        margin: 20px;
    }
}

@media screen and (max-width: 768px) {
    /* .bluepattern{
        display: none;
    } */

    .f-outline {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        /* margin:0; */
        margin-left: 20px;
        margin-right: 20px;
        margin-bottom: 20px;
        /* padding: 0; */
    }

    .f-input {
        height: 50px;
        min-width: 0;
        width: 100%;
        /* max-width: 300px; */
        margin-right: 0;
        margin: 20px;
    }

    .btn-success.get_started2 {
        /* min-width: 0; */
        /* width: 150px; */

        max-width: 200px;
        /* padding: 10px 10px!important; */
    }

    .rt {
        padding-left: 20px;
        padding-right: 20px;
    }

    .rt h6 {
        font-size: 12px;
    }
}

@media screen and (max-width: 500px) {
    .cta {
        padding-top: 70px;
        padding-bottom: 0px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .cta h1 {
        font-size: 50px;
        font-weight: 800;
        margin-bottom: 30px;
    }

    .bluepattern {
        display: none;
    }

    .form-area {
        display: flex;
        justify-content: center;
        width: 100%;
        /* padding: 0;
            margin: 0; */
    }

    .f-outline {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        /* margin:0; */
        margin-left: 20px;
        margin-right: 20px;
        margin-bottom: 20px;
        /* padding: 0; */
    }

    .f-input {
        height: 50px;
        min-width: 0;
        width: 100%;
        /* max-width: 450px!important; */
        margin-right: 0;
        margin: 20px;
    }

    .btn-success.get_started2 {
        /* min-width: 0; */
        /* width: 150px; */

        max-width: 200px !important;
        /* padding: 10px 10px!important; */
    }

   
}

/*----------- footer -------------------*/
footer {
    background-color: #E3F4F9;
    color: #2D2E41;
    overflow-y: hidden;
    overflow-x: hidden;
}

.foot {
    margin-top: 30px;
    padding: 20px;
    padding-left: 30px;
    /* padding-right: 0; */
    padding-top: 0px;
    text-align: left;
}

.foot.two{
    padding-right: 0!important;
}

.footer_logo {
    width: 180px;
    height: 60px;
    /* margin-left: 30px; */
    cursor: pointer;
}

.foot h6 {
    font-weight: bolder;
}

.foot a {
    text-decoration: none;
}

/*sign-up area*/
.f-input2 {
    max-width: 300px;
    border: 1px solid #13AFB9;
    box-shadow: 0px 5px 5px 0px rgba(85, 85, 85, 0.5);
}

.sign-up {
    margin-left: 10px;
}

.agreement {
    margin-top: 20px;
}

.agreement input {
    border-color: #13AFB9;
}

.agreement label {
    font-weight: 500;
    font-size: 13px;
}


/* FOOTER media query*/
@media screen and (max-width: 1200px) {
    .foot {
        margin-top: 30px;
        padding: 20px;
        padding-left: 0;
        padding-top: 0;
        text-align: left;
    }
}

@media screen and (max-width: 992px) {
    .logoo {
        margin-top: 30px;
        padding: 20px;
        padding-left: 0 !important;
        padding-top: 0;
        text-align: left;
    }

    .foot {
        margin-top: 30px;
        padding: 20px;
        padding-left: 20px;
        padding-top: 0;
        text-align: left;
    }
}

@media screen and (max-width: 500px) {
    .logoo {
        margin-top: 30px;
        padding: 20px;
        padding-left: 30px !important;
        padding-top: 0;
        text-align: left;
    }

    .form-check {
        margin-bottom: 30px;
    }

    .foot {
        margin-top: 30px;
        padding: 20px;
        padding-left: 50px;
        padding-top: 0;
        text-align: left;
    }
}

/*===================================================                ABOUT US PAGE                =================================================*/

/* ===== who we are section =====*/
section.whoweare {
    min-height: 630px;
    background-image: linear-gradient(rgba(46, 46, 65, 0.7), rgba(46, 46, 65, 0.7)), url(images/about-landing.PNG);
    background-size: cover;
    background-position: center;
    color: #fff;
    padding-top: 130px;
}

.wwa-left {
    padding: 100px;
}

.wwa-left h4 {
    font-weight: lighter;
}

.wwa-left h1 {
    font-weight: 750;
    font-size: 70px;
}

.wwa-left h3 {
    font-weight: normal;
    /* font-size: 30px; */
    font-size: 22px;
}

.wwa-right {
    padding: 100px;
    padding-right: 0px;
}

.wwa-right .pattern img {
    float: right;

}

/* ===== about services section =====*/
section.about-services {
    padding: 100px;
    background-color: #F2F2F3;
}

.as-left h4 {
    font-weight: normal;
}

.as-left h1 {
    font-size: 45px;
    font-weight: 800;
}
.as-right {
    padding-left: 30px;
}

.ccbox {
    padding: 0 50px;
    border-left: 2px solid #C3C3C3;
}

.as-right p {
    font-size: 14px;
    color: #555;
    font-weight: normal;
}

.row-cc.top {
    margin-bottom: 100px;
}

.row-cc h2 {
    margin-bottom: 30px;
    font-weight: bold;
    font-size: 32px;
    color: #070909;
}

/* ===== picture-strip section =====*/
section.picture-strip {
    min-height: 600px;
    background-image: linear-gradient(rgba(53, 96, 109, 0.3), rgba(53, 96, 109, 0.3)), url(images/business-lawyer.png);
    background-size: cover;
    background-position: center;
}

/* ===== about clients section =====*/
section.about-clients {
    padding: 100px;
    background-color: #F8F9F9;
}

.about-clients h4 {
    font-weight: normal;
}

.about-clients h1 {
    font-weight: 750;
    font-size: 50px;
}

/* ===== services key section =====*/
section.services-key {
    min-height: 600px;
    background-color: #F8F9F9;
    color: #2E2E41;
}

.key-left {
    background-image: linear-gradient(rgba(53, 96, 109, 0.3), rgba(53, 96, 109, 0.3)), url('images/secretarial.jpeg');
    background-size: cover;
    background-position: center;
}

.key-right {
    padding: 70px;
}

.key-right h4 {
    font-weight: normal;
}
.key-right h1 {
    font-size: 50px;
    font-weight: 750;
}

.key-right .row i{
    width: 170px;
    height: 70px;
    font-size: 40px;
}

.key-right .row p{
    margin-left: -70px;
    width: 100%;
    /* height: 100px; */
}


/*services key section MEDIA QUERY*/
@media screen and (max-width: 1380px) {

    .row-keys {
        flex-direction: column;
    }

    .key-left {
        /* display: none; */
        width: 100%;
    }

    .key-right {
        width: 100%;
    }
}

/*ipad - 1024*/
@media screen and (max-width: 1030px) {
    /*our clients*/
    /* .clab{
        display: none;
    } */

    .key-left {
        display: none;
    }

    .key-right {
        width: 100%;
    }
}

/* ===== blue section =====*/
section.blue {
    min-height: 600px;
    background-color: #13AFB9;
    padding: 100px;
    color: #fff;
}

.bs-left h4 {
    font-weight: normal;
}

.bs-left h1 {
    font-size: 45px;
    font-weight: 800;
    margin-bottom: 30px;
}

.btn-more {
    background-color: #2A7E89;
    color: #fff;
    border: 1px solid #2A7E89;
    margin-bottom: 30px;
}

.btn-more:hover {
    background-color: #E3F4F9;
    color: #2A7E89;
    border: 1px solid #2A7E89;
}

.bs-right {
    padding-left: 30px;
}

.bsbox {
    padding: 0 50px;
    border-left: 2px solid #C3C3C3;
}

.bs-right p {
    font-size: 14px;
    font-weight: normal;
}

.row-bs.top {
    margin-bottom: 100px;
}

.row-bs h2 {
    margin-bottom: 30px;
    font-weight: bold;
    font-size: 32px;
}

/* ===== portfolio section =====*/
section.portfolio {
    min-height: 600px;
    background-color: #F8F9F9;
    padding: 100px;
}

/*swiper*/
.swiper {
    /* width: 100%; */
    padding-top: 50px;
    padding-bottom: 50px;
}

.swiper-slide .work-box {
    padding: 0;
    width: 550px!important;
    min-height: 650px;
    background-size: cover;
    background-position: center;
}

.portfolio h4 {
    font-weight: normal;
}

.portfolio h1 {
    font-weight: bolder;
    font-size: 50px;
    margin-bottom: 30px;
}

.work-box {
    padding: 0;
    width: 550px!important;
    min-height: 650px;
    background-image: linear-gradient(rgba(53, 96, 109, 0.4), rgba(53, 96, 109, 0.4)), url('images/businessman-hands.png');
    background-size: cover;
    background-position: bottom;
    margin: 20px;
}

.top-half {
    min-height: 300px;
    padding: 30px;
}

.top-half h1 {
    font-weight: bolder;
    font-size: 36px;
    margin-bottom: 30px;
    color: #fff;
}

.bottom-half {
    min-height: 350px;
    width: 100%;
    padding: 30px;
    background-color: #13AFB9;
    color: #fff;
}

.btn-start {
    background-color: #2A7E89;
    color: #fff;
    border: 1px solid #2A7E89;
    /* margin-top: 30px; */
    margin-bottom: 30px;
}

.work-box.two {
    padding: 0;
    width: 550px!important;
    height: 650px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('images/business-lawyer.png');
    background-size: cover;
    background-position: bottom;
}

.work-box.three {
    padding: 0;
    width: 550px!important;
    height: 650px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('images/woman4.jpeg');
    background-size: cover;
    background-position: bottom;
}

.work-box.four {
    padding: 0;
    width: 550px!important;
    height: 650px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('images/business-protection.png');
    background-size: cover;
    background-position: bottom;
}

.work-box.five {
    padding: 0;
    width: 550px!important;
    height: 650px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('images/demand-forecasting.jpg');
    background-size: cover;
    background-position: bottom;
}

.work-box.six {
    padding: 0;
    width: 550px!important;
    height: 650px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('images/nairobi2.png');
    background-size: cover;
    background-position: bottom;
}

.bottom-half.two {
    height: 350px;
    width: 100%;
    padding: 30px;
    background-color: #fff;
    color: #000;
}
.bottom-half p{
    height: 190px!important;
}
.btn-start:hover {
    background-color: #E3F4F9;
    color: #2A7E89;
    border: 1px solid #2A7E89;
}

.swiper.mySwiper.case-studies{
    padding-left: 50px;
}

.swiper-button-prev,
.swiper-button-next {
    /* width: 50px;
    height: 50px; */
    background-color: transparent;
    color: #000;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    font-size: 46px;
}

.swiper-button-prev {
    left: 10px;
}

.swiper-button-next {
    right: 10px;
}

.swiper-button-prev:hover,
.swiper-button-next:hover {
    color: #0b808c;
    /* Change color on hover if needed */
}

/* ABOUT QUERY*/
@media screen and (max-width: 1200px) {
    .wwa-right {
        display: none;
    }

    .wwa-left {
        width: 100%;
    }

    .bsbox {
        padding: 0 20px;
        border-left: 2px solid #C3C3C3;
    }
}

/*ipad 1024*/
@media screen and (max-width: 1030px) {

    .bsbox {
        padding: 0 15px;
        border-left: 2px solid #C3C3C3;
    }
}

@media screen and (max-width: 685px) {
    .work-box{
        width: 400px!important;
    }
    .work-box.two{
        width: 400px!important;
    }
        .swiper.mySwiper.case-studies {
            padding-left: 0;
        }
        .swiper-button-prev {
            display: none;
        }
        .swiper-button-next{
            font-size: 30px!important;
            /* color: #35606D; */
        }
        .swiper-button-next::after {
            content: "\203A";
        } 
    
}

@media screen and (max-width: 500px) {
    section.whoweare {
        min-height: 700px;
        padding-top: 130px;
    }

    .wwa-right {
        display: none;
    }

    .wwa-left {
        padding-right: 10px;
        padding-left: 50px !important;
    }

    .wwa-left h1 {
        font-weight: 750;
        font-size: 50px;
    }

    .wwa-left h4 {
        margin-bottom: 30px;
        font-weight: lighter;
    }

    .wwa-left h3 {
        font-weight: lighter;
        font-size: 22px;
    }

    section.about-services {
        padding: 100px 50px;
    }

    .row-cc.top {
        margin-bottom: 0px;
    }

    .ccbox.one {
        margin-top: 50px;
    }

    .ccbox {
        padding: 0 50px;
        margin-bottom: 50px;
    }

    section.picture-strip {
        min-height: 400px;
    }

    section.services-key {
        display: none;
    }

    section.blue {
        padding: 100px 50px;
    }

    .row-bs {
        margin-top: 20px;
    }

    .row-bs.top {
        margin-bottom: 0px;
    }

    .bsbox {
        margin-bottom: 50px;
    }

    section.portfolio {
        padding: 100px 20px;
    }

    .work-box {
        width: 400px;
        /* height: auto; */
        background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url('images/customsupport.PNG');
        background-size: cover;
        background-position: center;
        margin: 0;
        margin-right: 20px
    }

    .work-box.two {
        width: 400px;
    }

    .top-half h1 {
        font-size: 40px;
        margin-bottom: 30px;
    }

}

/*===================================================                SERVICES PAGE                =================================================*/

/* ===== sp-landing section =====*/
section.sp-landing {
    min-height: 550px;
    background-image: linear-gradient(rgba(46, 46, 65, 0.6), rgba(46, 46, 65, 0.6)), url('images/nairobi1.png');
    background-size: cover;
    background-position: center;
    font-family: 'Poppins', sans-serif;
    color: #fff;
    padding-top: 130px;
}

.sp-landing h1 {
    font-size: 70px;
    font-weight: 800;
}

.wwa-left.servicesheader h1 {
    font-size: 68px;
}

/* .sp-landing h3{
    font-size: 22px;
    font-weight: lighter;
} */

/* ===== services-page section =====*/
section.services-page {
    padding: 50px 100px;
    background-color: #eee;
    color: #000;
    min-height: 400px;
    /* font-family: 'Visby CF', sans-serif; */
    font-family: 'Poppins', sans-serif;
}

.services-page .row .services {
    align-items: stretch;
}

/*services*/
.services-page h2 {
    font-weight: bolder;
    font-size: 25px;
    margin-bottom: 10px;
}

.services-page h5 {
    font-weight: 150;
    font-size: 16px;
    margin-bottom: 10px;
}

.services-page p {
    font-size: 12px;
}
 .solo-service{
    height: 400px;
    margin-bottom: 30px;
    /* padding-top: 50px; */
 }

.solo-service p{
    height: 200px;
}

.service-wrapper {
    background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7));
    color: #fff;
    width: 100%;
    height: 200px;
    /* border-radius: 10px; */
    padding: 30px;
}
.registration-services {
    background-image: linear-gradient(rgba(53, 96, 109, 0.2), rgba(53, 96, 109, 0.2)), url('images/woman3.jpg');
    background-size: cover;
    background-position: top;
    width: 100%;
    /* height: auto; */
    /* margin-bottom: 50px; */
    padding: 0;
    padding-top: 150px;
    transition: background-position 1s ease;
    /* Add transition for smooth effect */
}

.registration-services:hover {
    transform: translateY(-10px);
    background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url(images/woman3.jpg);
    background-position: center right;
    /* Move the background image 10px to the right on hover */
}
.secretarial-administration {
    background-image: linear-gradient(rgba(53, 96, 109, 0.2), rgba(53, 96, 109, 0.2)), url('images/woman4.jpeg');
    background-size: cover;
    background-position: top;
    width: 100%;
    /* height: auto; */
    /* margin-bottom: 50px; */
    padding: 0;
    padding-top: 150px;
    transition: background-position 1s ease;
}

.secretarial-administration:hover {
    transform: translateY(-10px);
    background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url(images/woman4.jpeg);
    background-position: center right;
}

.hr-management {
    background-image: linear-gradient(rgba(53, 96, 109, 0.2), rgba(53, 96, 109, 0.2)), url('images/woman2.jpg');
    background-size: cover;
    background-position: top;
    width: 100%;
    /* height: auto; */
    /* margin-bottom: 50px; */
    padding: 0;
    padding-top: 150px;
    transition: background-position 1s ease;
}

.hr-management:hover {
    transform: translateY(-10px);
    background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url(images/woman2.jpg);
    background-position: center right;
}

.tax-compliance {
    background-image: linear-gradient(rgba(53, 96, 109, 0.2), rgba(53, 96, 109, 0.2)), url('images/taxcomp.PNG');
    background-size: cover;
    background-position: top;
    width: 100%;
    /* height: auto; */
    /* margin-bottom: 50px; */
    padding: 0;
    padding-top: 150px;
    transition: background-position 1s ease;
}

.tax-compliance:hover {
    transform: translateY(-10px);
    background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url(images/taxcomp.PNG);
    background-position: center right;
}

.trustee-service {
    background-image: linear-gradient(rgba(53, 96, 109, 0.2), rgba(53, 96, 109, 0.2)), url('images/customsupport.PNG');
    background-size: cover;
    background-position: top;
    width: 100%;
    /* height: auto; */
    /* margin-bottom: 50px; */
    padding: 0;
    padding-top: 150px;
    transition: background-position 1s ease;
}

.trustee-service:hover {
    transform: translateY(-10px);
    background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url(images/customsupport.PNG);
    background-position: center right;
}

.immigration-service {
    background-image: linear-gradient(rgba(53, 96, 109, 0.2), rgba(53, 96, 109, 0.2)), url('images/image4.jpg');
    background-size: cover;
    background-position: top;
    width: 100%;
    /* height: auto; */
    /* margin-bottom: 50px; */
    padding: 0;
    padding-top: 150px;
    transition: background-position 1s ease;
}

.immigration-service:hover {
    transform: translateY(-10px);
    background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url(images/image4.jpg);
    background-position: center right;
}

/* SERVICES media query*/
@media screen and (max-width: 1380px) {

    .solo-service {
        width: 100%;
    }
}

/*ipad 1024*/
@media screen and (max-width: 1030px) {

    .solo-service {
        width: 100%;
    }
}

@media screen and (max-width: 500px) {
    section.sp-landing {
        min-height: 700px;
    }

    .wwa-left.servicesheader h1 {
        font-size: 50px;
    }

    section.services-page {
        padding: 50px 50px;
    }

    .service-wrapper {
        min-height: 250px;
    }

    .registration-services {
        min-height: 450px;
    }

    .secretarial-administration {
        min-height: 450px;
    }

    .hr-management {
        min-height: 450px;
    }

    .tax-compliance {
        min-height: 450px;
    }

    .trustee-service {
        min-height: 450px;
    }

    .immigration-service {
        min-height: 450px;
    }
}

/*===================================================            REGISTRATION SERVICES PAGE                =================================================*/

/* ===== banner section =====*/

section.registration-banner {
    min-height: 500px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(images/woman3.jpg);
    background-size: cover;
    background-position: center;
    color: #fff;
    padding-top: 130px;
}

section.service-blogs {
    /* background-color: #eee; */
    margin-left: 200px;
    margin-right: 200px;
    color: #000;
    padding-top: 50px;
    padding-bottom: 10px;
    font-family: 'Poppins', sans-serif;
}

.service-blogs h1 {
    font-family: 'Visby CF', sans-serif;
    font-size: 60px;
    font-weight: 800;
}

.service-blogs h2 {
    font-family: 'Visby CF', sans-serif;
    font-size: 35px;
    font-weight: 800;
}

.service-blogs p {
    font-size: 16px;
    /* font-size: 18px; 14px;*/
    color: #3C3C54;
    text-align: left;
}

section.secadmin-banner {
    min-height: 500px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(images/woman4.jpeg);
    background-size: cover;
    background-position: center;
    color: #fff;
    padding-top: 130px;
}

section.hrmanagement-banner {
    min-height: 500px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(images/woman2.jpg);
    background-size: cover;
    background-position: center;
    color: #fff;
    padding-top: 130px;
}

section.taxcompliance-banner {
    min-height: 500px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(images/taxcomp.PNG);
    background-size: cover;
    background-position: center;
    color: #fff;
    padding-top: 130px;
}

section.trustee-banner {
    min-height: 500px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(images/customsupport.PNG);
    background-size: cover;
    background-position: center;
    color: #fff;
    padding-top: 130px;
}

section.immigration-banner {
    min-height: 500px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(images/image4.jpg);
    background-size: cover;
    background-position: center;
    color: #fff;
    padding-top: 130px;
}

.key-left.solo {
    background-image: url('images/louvre.png') !important;
    background-size: cover;
    background-position: center;
}

.key-right.solo h1 {
    font-size: 40px !important;
}

/* ZSERVICES media query*/
@media screen and (max-width: 1400px) {
    section.service-blogs {
        margin-left: 50px;
        margin-right: 50px;
    }

    .sidebar {
        display: none;
    }
}

@media screen and (max-width: 1200px) {
    section.service-blogs {
        margin-left: 50px;
        margin-right: 50px;
    }

    .sidebar {
        display: none;
    }

    .ccbox {
        padding-left: 20px;
        padding-right: 0;
    }

}

@media screen and (max-width: 900px) {
    section.service-blogs {
        margin-left: 50px;
        margin-right: 50px;

    }

    .sidebar {
        display: none;
    }
}

@media screen and (max-width: 500px) {
    .side-bar {
        display: none;
    }

    section.registration-banner {
        min-height: 700px;
        padding-top: 230px;
    }

    section.service-blogs {
        margin-left: 20px;
        margin-right: 20px;
        padding-top: 50px;
    }

    .registration-banner h1 {
        font-size: 50px !important;
    }

    .secadmin-banner h1 {
        font-size: 50px !important;
    }

    .hrmanagement-banner h1 {
        font-size: 50px !important;
    }

    .taxcompliance-banner h1 {
        font-size: 50px !important;
    }

    .trustee-banner h1 {
        font-size: 50px !important;
    }

    .immigration-banner h1 {
        font-size: 50px !important;
    }

    .service-blogs h1 {
        font-size: 30px;
        font-weight: 800;
    }

    .service-blogs h2 {
        font-size: 24px;
        font-weight: 800;
    }

    section.zblog-image {
        width: 100%;
    }

    .zblog-image img {
        width: 100%;
        height: auto;
    }

    .wwa-left {
        padding-left: 20px;
    }

}



/*===================================================                RESOURCES (NEWS) PAGE                =================================================*/

/* ===== news subscribe section =====*/

section.news-subscribe {
    min-height: 600px;
    background-image: linear-gradient(rgba(46, 46, 65, 0.6), rgba(46, 46, 65, 0.6)), url('images/nairobi3.png');
    background-size: cover;
    background-position: center;
    color: #fff;
    padding-top: 130px;
}

.news-subscribe h1 {
    margin-bottom: 10px;
    font-size: 70px;
    font-weight: 800;
}

.blogsideimg.immigration {
    background-image: url('images/image4.jpg');
    background-size: cover;
    background-position: center;
    height: 200px;
    transition: background-position 1s ease;
}

.blogsideimg.immigration:hover {
    background-image: linear-gradient(rgba(53, 96, 109, 0.3), rgba(53, 96, 109, 0.3)), url(images/image4.jpg);
    background-position: center right;
}

/* ===== all news section =====*/
section.all-news {
    min-height: 600px;
    /* background-color: #1C353C; */
    background-color: #2E2E41;
    padding-top: 50px;
    padding-bottom: 100px;
    padding-left: 100px;
    padding-right: 100px;
    color: #fff;
}

.categories {
    float: none;
    display: flex;
    justify-content: center;
    align-items: center;
}

.categories li {
    float: left;
    list-style-type: none;
    padding: 0px 30px;
    border-left: 1px solid #fff;
}

.categories li.active {
    border-left: none;
}

.categories li a {

    text-decoration: none;
    color: #eee;
    font-size: 16px;
}

.news-box {
    padding: 0;
    width: 400px;
    min-height: 600px;
    background-image: linear-gradient(rgba(53, 96, 109, 0.4), rgba(53, 96, 109, 0.4)), url('images/blogpic.PNG');
    background-size: cover;
    background-position: center;
    margin: 20px;
    transition: background-position 1s ease;
    border: 0.5px solid #fff;
}

.news-box:hover {
    transform: translateY(-10px);
    background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7));
    background-position: center right;
}

.top-half-news {
    height: 300px;
    padding: 30px;
}

.bottom-half-news {
    min-height: 300px;
    /* width: 100%; */
    padding: 30px;
    background-color: transparent;
    color: #fff;
}

.bottom-half-news:hover {
    background-color: #2E2E41;
    /* background-color: #13AFB9; */
    color: #fff;
}

.bottom-half-news h6 {
    font-weight: normal;
    margin-bottom: 20px;
}

.bottom-half-news p {
    font-size: 22px;
    font-weight: bold;
    height: 150px;
}

.btn-readmore {
    background-color: transparent;
    color: #fff;
    border: 1px solid #fff;
    margin-top: 20px;
    margin-bottom: 30px;
}

.read-more {
    border-radius: 0;
    padding: 7px 15px;
    font-size: 18px;
    font-weight: 500;
}

.btn-readmore a:hover {
    color: #fff;
}

.btn-readmore:hover {
    background-color: #13AFB9;
    color: #fff;
    border: 1px solid #13AFB9;
}

.news-box.two {
    padding: 0;
    width: 400px;
    min-height: 600px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(53, 96, 109, 0.4)), url('images/services-third.PNG');
    background-size: cover;
    background-position: bottom;
    margin: 20px;
    transition: background-position 1s ease;
}

.news-box.two:hover {
    transform: translateY(-10px);
    background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(images/services-third.PNG);
    background-position: center right;
}

.news-box.three {
    padding: 0;
    width: 400px;
    min-height: 600px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(53, 96, 109, 0.4)), url('images/image2.jpg');
    background-size: cover;
    background-position: bottom;
    margin: 20px;
    transition: background-position 1s ease;
}

.news-box.three:hover {
    transform: translateY(-10px);
    background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(images/image2.jpg);
    background-position: center right;
}

.news-box.four {
    padding: 0;
    width: 400px;
    min-height: 600px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(53, 96, 109, 0.4)), url('images/customsupport.PNG');
    background-size: cover;
    background-position: bottom;
    margin: 20px;
    transition: background-position 1s ease;
}

.news-box.four:hover {
    transform: translateY(-10px);
    background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(images/customsupport.PNG);
    background-position: center right;
}

.news-box.five {
    padding: 0;
    width: 400px;
    min-height: 600px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(53, 96, 109, 0.4)), url('images/image3.jpg');
    background-size: cover;
    background-position: bottom;
    margin: 20px;
    transition: background-position 1s ease;
}

.news-box.five:hover {
    transform: translateY(-10px);
    background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(images/image3.jpg);
    background-position: center right;
}

.news-box.six {
    padding: 0;
    width: 400px;
    min-height: 600px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(53, 96, 109, 0.4)), url('images/secretarial.jpeg');
    background-size: cover;
    background-position: bottom;
    margin: 20px;
    transition: background-position 1s ease;
}

.news-box.six:hover {
    transform: translateY(-10px);
    background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(images/secretarial.jpeg);
    background-position: center right;
}

.news-box.seven {
    padding: 0;
    width: 400px;
    min-height: 600px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(53, 96, 109, 0.4)), url('images/nairobi1.png');
    background-size: cover;
    background-position: bottom;
    margin: 20px;
    transition: background-position 1s ease;
}

.news-box.seven:hover {
    transform: translateY(-10px);
    background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(images/nairobi1.png);
    background-position: center right;
}

.news-box.eight {
    padding: 0;
    width: 400px;
    min-height: 600px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(53, 96, 109, 0.4)), url('images/nairobi2.png');
    background-size: cover;
    background-position: bottom;
    margin: 20px;
    transition: background-position 1s ease;
}

.news-box.eight:hover {
    transform: translateY(-10px);
    background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(images/nairobi2.png);
    background-position: center right;
}

.news-box.nine {
    padding: 0;
    width: 400px;
    min-height: 600px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(53, 96, 109, 0.4)), url('images/nairobi3.png');
    background-size: cover;
    background-position: bottom;
    margin: 20px;
    transition: background-position 1s ease;
}

.news-box.nine:hover {
    transform: translateY(-10px);
    background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(images/nairobi3.png);
    background-position: center right;
}

.btn-learnmore {
    background-color: #2A7E89;
    color: #fff;
    border: 1px solid #2A7E89;
    margin-top: 30px;
    /* margin-bottom: 30px; */
}

.learn-more {
    border-radius: 0;
    padding: 7px 15px;
    font-size: 18px;
    font-weight: 500;
}

.btn-learnmore:hover {
    background-color: #E3F4F9;
    color: #2A7E89;
    border: 1px solid #2A7E89;
}

/* RESOURCES media query*/
@media screen and (max-width: 1200px) {
    section.all-news {
        background-color: #2E2E41;
        padding-top: 50px;
        padding-bottom: 100px;
        padding-left: 50px;
        padding-right: 50px;
        color: #fff;
    }

}

@media screen and (max-width: 960px) {
    .categories {
        display: none;
    }
    section.all-news{
        padding-top: 50px;
        padding-left: 20px;
        padding-right: 20px;
    }
    .news-box {
        width: 90%;
        margin: 0!important;
        margin-right: 0!important;
        margin-left: 30px!important;
        margin-bottom: 30px!important;
    }

}

@media screen and (max-width: 560px) {
    .resource-text{
        font-size: 60px!important;
    }

}
@media screen and (max-width: 500px) {
    section.news-subscribe {
        min-height: 700px;
        padding-top: 230px;
    }

    section.all-news{
        /* padding: 30px; */
        padding-top: 50px;
        padding-left: 20px;
        padding-right: 20px;
    }
   
    .news-box {
        padding: 0;
        /* width: 90%!important; */
        min-height: 600px;
        /* margin: 0;
        margin-bottom: 20px; */

    }
}
@media screen and (max-width: 460px) {
    .news-box {
        width: 350px !important;
        margin: 0 !important;
        margin-right: 0 !important;
        margin-left: 20px !important;
        margin-bottom: 20px !important;
    }

}
@media screen and (max-width: 410px) {
    .news-box {
        width: 90% !important;
        margin: 0 !important;
        margin-right: 0 !important;
        margin-left: 20px !important;
        margin-bottom: 20px !important;
    }

}

/*===================================================                CONTACT PAGE                =================================================*/

/* ===== contact section =====*/

section.contact {
    min-height: 550px;
    background-image: linear-gradient(rgba(46, 46, 65, 0.4), rgba(46, 46, 65, 0.4)), url('images/contact-landing.jpg');
    background-size: cover;
    background-position: center;
    color: #fff;
    padding-top: 130px;
}

section.contact h1 {
    margin-bottom: 20px;
    font-size: 70px;
    font-weight: 750;
}


/* ===== contact form section =====*/
section.contact-form {
    min-height: 400px;
    background-color: #fff;
    padding: 100px;
    padding-left: 150px;
}

.contact-form label {
    font-weight: bolder;
}

.form-outline textarea {
    height: 150px;
}

.grey {
    border: 2px solid #999999;
    background-color: #eee;
    font-style: italic;
}

.contact-agreement input {
    border-color: #13AFB9 !important;
}


/* ===== get in touch section =====*/
section.get-in-touch {
    min-height: 300px;
    background-color: #fff;
    padding: 100px;
    padding-top: 0;
    padding-left: 150px;
}

.get-in-touch h1 {
    font-size: 46px;
    font-weight: 750;
    margin-bottom: 50px;
}

.get-in-touch h6 {
    font-size: 17px;
    font-weight: bolder;
}

.get-in-touch p {
    font-size: 14px;
}

/* ===== location map section =====*/
section.location-map {
    height: 600px;
    background-image: url('images/map-placeholder.PNG');
    background-size: cover;
    background-position: center;
}

/* CONTACT media query*/
@media screen and (max-width: 500px) {
    section.contact {
        min-height: 700px;
        padding-top: 230px;
    }

    section.contact-form {
        padding: 100px 50px;
        padding-bottom: 50px;
    }

    section.get-in-touch {
        padding: 50px 50px;
    }

    .working-hours .right {
        margin-left: 100px;
    }
}


/*===================================================                ZBLOGS PAGE                =================================================*/

/* ===== zblog section =====*/


section.zblog-image {
    padding-top: 50px;
    padding-bottom: 50px;
    width: 70%;
}

.zblog-image img {
    width: 100%;
    height: auto;
}

section.individual-blogs {
    margin-left: 200px;
    margin-right: 200px;
    /* color: #000; */
    padding-top: 150px;
    padding-bottom: 10px;
    font-family: 'Poppins', sans-serif;
}

.sidebar {
    float: right;
    clear: right;
    margin-right: 50px;
    margin-left: 50px;
    /* height: 2000px; */
    height: auto;
}

.sideblog {
    background-color: #ececec;
    padding: 0;
    font-size: 105%;
    max-width: 400px;
    margin-top: 0px;
    margin-bottom: 20px;
    margin-right: 0px;
    margin-left: 0px;
    min-height: 400px;
    /* transition: background-position 1s ease; */
}

.sideblog.one {
    margin-top: 50px;
}

.sideblog:hover {
    transform: translateY(-10px);
}

.blogsideimg {
    background-image: url('images/services-third.PNG');
    background-size: cover;
    background-position: center;
    height: 200px;
    transition: background-position 1s ease;
}

.blogsideimg:hover {
    background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url(images/services-third.PNG);
    background-position: center right;
}

.blogsideimg.two {
    background-image: url('images/taxcomp.PNG');
    background-size: cover;
    background-position: center;
    height: 200px;
    transition: background-position 1s ease;
}

.blogsideimg.two:hover {
    background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url(images/taxcomp.PNG);
    background-position: center right;
}

.blogsideimg.three {
    background-image: url('images/services.PNG');
    background-size: cover;
    background-position: center;
    height: 200px;
    transition: background-position 1s ease;
}

.blogsideimg.three:hover {
    background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url(images/services.PNG);
    background-position: center right;
}

.blogsidecontent {
    color: #000;
    padding-top: 20px;
    padding-bottom: 20px;
    padding-right: 50px;
    padding-left: 50px;
}

.blogsidecontent h4 {
    margin-top: 10px;
    margin-bottom: 30px;
    font-size: 18px;
    font-weight: bold;
}

.blogsidecontent h2 {
    font-weight: bolder;
    font-size: 30px;
}

.blogsidecontent h5 {
    font-weight: 300;
    font-size: 18px;
}

.blog-deets {
    margin-bottom: 30px;
}

.individual-blogs h5 {
    font-size: 16px;
    font-weight: 400;
    color: #3C3C54;
}

.individual-blogs h1 {
    font-family: 'Visby CF', sans-serif;
    font-size: 50px;
    font-weight: 800;
}

.individual-blogs h2 {
    font-family: 'Visby CF', sans-serif;
    font-size: 22px;
    font-weight: bold;
}

.date {
    margin-top: 20px;
    margin-bottom: 20px;
}

.sc-icons {
    margin-top: 20px;
    margin-bottom: 50px;
}

.individual-blogs p {
    color: #3C3C54;
    font-size: 14px;
    /* color: #555; */
    text-align: left;
}

.author {
    margin-top: 20px;
    margin-bottom: 20px;
}

.author img {
    height: 70px;
    width: 70px;
}

/* ZBLOGS media query*/
@media screen and (max-width: 900px) {
    section.individual-blogs {
        margin-left: 50px;
        margin-right: 50px;
        /* color: #000; */
        padding-top: 150px;
        padding-bottom: 10px;
        font-family: 'Poppins', sans-serif;
    }

    .sidebar {
        display: none;
    }
}

@media screen and (max-width: 500px) {
    section.individual-blogs {
        margin-left: 20px;
        margin-right: 20px;
        padding-top: 150px;
        padding-bottom: 10px;
    }

    .individual-blogs h1 {
        font-size: 30px;
        font-weight: 800;
    }

    .individual-blogs h2 {
        font-size: 24px;
        font-weight: 800;
    }

    section.zblog-image {
        width: 100%;
    }

    .zblog-image img {
        width: 100%;
        height: auto;
    }

    .sidebar {
        display: none;
    }
}


/*===================================================       COMMAND POINTS PAGES  (PROMPTS)                =================================================*/

/* 02
===================================================              22form.html             ================================================*/
/* ===== welcome section =====*/
section.gs-welcome {
    min-height: 800px;
    background-color: #E3F4F9;
    /* background-color: #eee; */
    padding: 50px;
    padding-top: 150px;
    color: #000;
}

.side-prep h2 {
    font-size: 50px;
    font-weight: 800;
    margin-bottom: 20px;
}

.finalize {
    font-size: 20px;
    margin-bottom: 20px;
    color: #555;
    font-weight: normal;
}

.next-area {
    float: left;
    padding: 0 !important;
    margin: 0 !important;
    margin-top: 30px;
}

.next {
    /* padding: 0!important; */
    margin: 0 !important;
    border-radius: 10px;
    padding: 10px 30px;
    font-size: 22px;
    font-weight: bold;
}

.go-back {
    /* padding: 0!important; */
    margin: 0 !important;
    border-radius: 10px;
    padding: 10px 30px;
    font-size: 22px;
    font-weight: bold;
}

.form-outline.gs label {
    font-weight: bold;
    font-family: 'Poppins', sans-serif;
    margin-bottom: 20px;
    font-size: 20px;

}

.form-control.gs {
    /* width: 300px; */
    min-height: 60px;
    font-family: 'Poppins', sans-serif;
}

.b-name {
    width: 90%;
}

.form-select.gs {
    height: 60px;
    font-family: 'Poppins', sans-serif;
}

@media screen and (max-width: 500px) {
    .side-prep h2 {
        font-size: 30px;
        font-weight: 800;
        margin-bottom: 30px;
        color: #555;
    }

    .form-control.gs {
        width: 100%;
        height: 50px;
        font-family: 'Poppins', sans-serif;
    }

    .b-name {
        width: 100%;
    }

    .form-select.gs {
        height: 50px;
        font-family: 'Poppins', sans-serif;
    }

    .img-fluid {
        display: none;
    }

    .finalize {
        margin-top: 30px;
    }

    .next-area {
        float: left;
        padding: 0 !important;
        margin: 0 !important;
        margin-top: 30px;
    }

    .next {
        /* padding: 0!important; */
        margin: 0 !important;
        border-radius: 10px;
        padding: 10px 10px;
        font-size: 22px;
        font-weight: bold;
    }
    
    .go-back {
        /* padding: 0!important; */
        margin: 0 !important;
        border-radius: 10px;
        padding: 10px 10px;
        font-size: 22px;
        font-weight: bold;
    }
}

