@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@100;200;300;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap');
body {
    font-family: 'Roboto', sans-serif;
    background: #eceff1;
    padding: 0px !important;
    margin: 0px !important;
}

.bannerimgbox {
    display: flex;
    align-items: center;
    margin-top: 3vh;
    position: absolute;
    z-index: 2;
    top: 8%;
    left: 38%;
    width: 40%;
}

.bannerimgbox .image {
    width: 150px !important;
    float: left;
}

.bannerimgbox .image img {
    width: 100% !important;
}

.bannerimgbox .text {
    font-size: 18px !important;
    padding-left: 10px;
    float: left;
    font-weight: 600;
    padding-top: 0%;
    color: #fff;
}


/* Navbar */

.dropBtn2 .icon,
.dropBtn3 .icon,
.dropBtn4 .icon,
.dropBtn5 .icon,
.dropBtn6 .icon {
    display: none !important;
}

.navbar {
    height: 13vh;
    width: 100%;
    padding: 15px 80px 10px 80px !important;
    background-color: #fff;
    position: relative;
    z-index: 5;
    border-bottom: solid 1px #ddd;
}

.navbar .nav-header {
    display: inline;
}

.navbar .nav-header .nav-logo {
    display: inline-block;
    margin-top: -7px;
    padding: 10px !important;
}

.nav-logo a img {
    width: 260px !important;
    height: 100px !important;
    position: absolute;
    top: 0px;
    left: 5%;
}

.navbar .nav-links {
    display: inline;
    float: right;
    font-size: 16px;
    margin-top: 3vh !important;
    margin-left: 1vh;
}

.navbar .nav-links a {
    padding: 10px 20px;
    text-decoration: none;
    font-weight: 500;
    font-size: 18px;
    color: #222;
}


/* Hover effects */

.navbar .nav-links a:hover {
    background-color: transparent;
    color: #30BFC6;
}


/* responsive navbar toggle button */

.navbar #nav-check,
.navbar .nav-btn {
    display: none;
}

.knowbtn {
    background: #0C969E !important;
    color: #fff !important;
    border: solid 1px #0C969E;
    border-radius: 5px;
    line-height: 25px;
    margin-left: 2vh;
}

.knowbtn:hover {
    background: #097177 !important;
}

.knowbtn .iconname {
    font-size: 30px;
    vertical-align: middle;
}

@media (min-width: 1025px) and (max-width: 1310px) {
    .navbar {
        height: auto;
        width: 100%;
        padding: 10px 20px 0px 20px !important;
        background-color: #fff !important;
        position: relative;
        z-index: 2;
        border-bottom: solid 1px #ddd;
    }
    .navbar .nav-links {
        display: inline;
        float: right;
        font-size: 15px;
        margin-top: 4vh !important;
        margin-left: 0.5vh;
    }
    .navbar .nav-links a {
        padding: 10px 10px;
        text-decoration: none;
        font-weight: 600;
        font-size: 15px;
        color: #000;
    }
    .logobox {
        display: block;
    }
    .drop-content,
    .drop-content2,
    .drop-content3,
    .drop-content4,
    .drop-content6 {
        display: none;
        position: absolute;
        background-color: #f5f5f5;
        color: #000;
        min-width: 120px;
        max-width: auto;
        font-size: 16px;
        top: 32px;
        z-index: 2;
    }
    .drop-content5 {
        display: none;
        position: absolute;
        background-color: #f5f5f5;
        color: #000;
        min-width: 220px;
        max-width: auto;
        font-size: 16px;
        top: 34px;
        z-index: 2;
    }
}

@media (max-width:1041px) {
    .dropBtn2 .icon,
    .dropBtn3 .icon,
    .dropBtn4 .icon,
    .dropBtn5 .icon,
    .dropBtn6 .icon {
        display: inline-block !important;
        float: center !important;
        text-align: center !important;
    }
    .logobox {
        display: none;
    }
    .eventscontrol {
        display: none;
    }
    .navbar .nav-btn {
        display: inline-block;
        position: absolute;
        top: 25px;
        right: 15px;
        border: solid 1px #000;
        border-radius: 5px;
    }
    .navbar .nav-btn label {
        display: inline-block;
        width: 55px;
        height: 40px;
        padding: 10px 10px 0px 15px;
    }
    .navbar .nav-btn label span {
        display: block;
        height: 10px;
        width: 25px;
        border-top: 3px solid #000;
    }
    .navbar .nav-btn label:active,
    .navbar #nav-check:checked~.nav-btn label {
        background-color: #fff;
        z-index: 3 !important;
    }
    .navbar .nav-links {
        position: absolute;
        z-index: 3 !important;
        display: block;
        text-align: center;
        width: 70% !important;
        background-color: #0C9E7B;
        transition: all 0.01s ease-in;
        overflow-y: hidden;
        top: 70px;
        right: 0px;
    }
    .navbar .nav-links a {
        display: block;
        z-index: 5 !important;
    }
    /* when nav toggle button not checked */
    .navbar #nav-check:not(:checked)~.nav-links {
        height: 0px;
    }
    /* when nav toggle button is checked */
    .navbar #nav-check:checked~.nav-links {
        height: calc(100vh - 70px);
        overflow-y: auto;
    }
    /* Responsive dropdown code */
    .navbar .nav-links .dropdown,
    .navbar .nav-links .dropdown2 {
        float: none;
        width: 100%;
    }
    .navbar .nav-links .drop-content,
    .navbar .nav-links .drop-content2 {
        position: relative !important;
        background-color: transparent;
        top: 0px;
        left: 0px;
        z-index: 3 !important;
    }
    /* Text color */
    .navbar .nav-links .drop-content a {
        color: #fff;
    }
    .drop-content,
    .drop-content2,
    .drop-content3,
    .drop-content4,
    .drop-content5,
    .drop-content6 {
        display: block;
        position: relative !important;
        background-color: #0C9E7B;
        color: #fff;
        min-width: 100% !important;
        max-width: 100% !important;
        font-size: 16px;
        top: 0px;
        z-index: 3 !important;
    }
    .dropdown2 .drop-content2,
    .dropdown3 .drop-content3,
    .dropdown4 .drop-content4,
    .dropdown5 .drop-content5,
    .dropdown6 .drop-content6 {
        position: relative;
        left: 0px !important;
        z-index: 1 !important;
        top: 0px !important;
        width: 100% !important;
        text-align: center !important;
    }
}


/* Dropdown menu CSS code */

.dropdown {
    position: relative;
    display: inline-block;
    z-index: 2;
}

.drop-content,
.drop-content2,
.drop-content3,
.drop-content4,
.drop-content6 {
    display: none;
    position: absolute;
    background-color: #fff;
    color: #0C969E;
    min-width: 320px;
    max-width: auto;
    font-size: 16px;
    font-weight: 400;
    top: 35px;
    padding: 20px 10px !important;
    border-radius: 10px;
    z-index: 2;
}

.drop-content5 {
    display: none;
    position: absolute;
    background-color: #0C9E7B;
    color: #fff;
    min-width: 220px;
    max-width: auto;
    font-size: 16px;
    font-weight: 400;
    top: 34px;
    z-index: 2;
}


/* on hover show dropdown */

.dropdown:hover .drop-content,
.dropdown2:hover .drop-content2,
.dropdown3:hover .drop-content3,
.dropdown4:hover .drop-content4,
.dropdown5:hover .drop-content5,
.dropdown6:hover .drop-content6 {
    display: block;
    color: #fff;
    z-index: 2;
}


/* drondown links */

.drop-content a {
    padding: 12px 10px;
    border-bottom: none !important;
    display: block;
    color: #fff;
    font-weight: 400;
    font-size: 16px !important;
}

.dropBtn .drop-content a:hover {
    background-color: transparent;
}

.dropdown:hover .dropBtn,
.dropdown2:hover .dropBtn2,
.dropdown3:hover .dropBtn3,
.dropdown4:hover .dropBtn4,
.dropdown5:hover .dropBtn5,
.dropdown6:hover .dropBtn6 {
    background-color: transparent;
    z-index: 2;
}

.dropBtn .icon {
    vertical-align: middle;
}

.dropdown2 .drop-content2 {
    position: absolute;
    left: 120px;
    top: 45px;
    width: 250px;
    z-index: 2;
    text-align: left;
}

.dropdown3 .drop-content3 {
    position: absolute;
    left: 250px;
    top: 45px;
    width: 150px;
    text-align: left;
    z-index: 2;
}

.dropdown4 .drop-content4 {
    position: absolute;
    left: 120px;
    z-index: 2;
    top: 0px;
    width: 380px;
    text-align: left;
}

.dropdown5 .drop-content5 {
    position: absolute;
    left: 250px;
    top: 0px;
    width: 150px;
    text-align: left;
    z-index: 2;
}

.dropdown6 .drop-content6 {
    position: absolute;
    left: 250px;
    top: 90px;
    width: 250px;
    text-align: left;
    z-index: 2;
}


/* Slider */

.bannerbase {
    margin: 0px !important;
    padding: 0px 0px !important;
}


/* Footer */

.footerbox {
    background: #293534;
    padding: 20px 80px 1px 80px !important;
}

.footerboxmain {
    padding: 5px !important;
}

.footerboxmain img {
    width: 50% !important;
}

.footerboxmain p {
    color: #fff;
    font-size: 15px;
    line-height: 25px;
    margin-bottom: 0px !important;
}

.footerboxmain .copyright {
    color: #fff;
    font-size: 15px;
    line-height: 25px;
}

.footerboxmain h2 {
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    line-height: 25px;
}

.footerboxmain ul li {
    margin-top: 1vh;
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    line-height: 25px;
}

.footerboxmain ul li a {
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    line-height: 25px;
}


/* Banner box */

.bannerbox {
    background-image: url('../assets/banner.png');
    background-size: cover;
    background-position: 50% 50%;
    padding: 140px 80px !important;
    position: relative;
}

.bannerinnerbox {
    width: 100%;
    height: 100% !important;
    position: absolute;
    top: 0px;
    padding: 50px 80px !important;
    left: 0px;
    background: rgba(12, 158, 123, 0.4);
}

.bannerbox h1 {
    color: #fff;
    font-size: 44px;
    font-weight: 600;
    line-height: 45px;
    margin-bottom: 3vh;
}

.bannerbox a {
    color: #fff;
    font-size: 18px;
    line-height: 25px;
    font-weight: 400;
}

.bannerbox .bar {
    color: #fff;
    font-size: 18px;
    line-height: 25px;
    font-weight: 400;
}

.bannerbox a:hover {
    text-decoration: underline;
}


/* Basebox */

.basebox {
    background: #fff;
    padding: 50px 80px !important;
}

.basebox .inbox {
    padding: 0px 20px !important;
}

.inbox ul {
    padding: 10px 20px !important;
}

.inbox ul li {
    list-style-type: disc;
    margin-top: 1vh;
}

.inbox a {
    color: #0C9E7B;
    font-weight: 500;
}

.inbox a:hover {
    text-decoration: underline;
}

.basebox .inbox h1 {
    color: #293534;
    font-size: 32px;
    letter-spacing: 0px;
    font-weight: 700;
    margin-top: 2vh;
    margin-bottom: 4vh;
    text-transform: capitalize;
}

.basebox .inbox h2 {
    color: #000;
    font-size: 24px;
    letter-spacing: 0px;
    font-weight: 700;
    margin-top: 2vh;
    margin-bottom: 2vh;
}

.basebox .inbox p {
    color: #293534;
    line-height: 25px;
    font-weight: 400;
    font-size: 18px !important;
    line-height: 25px;
    text-align: justify !important;
}

.basebox p {
    color: #293534;
    line-height: 25px;
    font-weight: 400;
    font-size: 18px !important;
    line-height: 25px;
    text-align: center !important;
}

.inbox .ctabtn {
    background: #0C969E;
    width: auto !important;
    height: auto;
    float: left;
    text-align: center;
    margin-top: 3vh;
    padding: 10px 40px !important;
    border-radius: 5px;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
}

.inbox .ctabtn:hover {
    background: #0b888e;
    text-decoration: none;
}

.inbox img {
    margin-top: 3vh;
    border-radius: 5px;
}

.basebox h2 {
    color: #000;
    font-size: 22px;
    letter-spacing: 0px;
    font-weight: 700;
    margin-top: 2vh;
    margin-bottom: 2vh;
}

.basebox .title {
    color: #000;
    font-size: 28px;
    letter-spacing: 0px;
    font-weight: 700;
    margin-top: 2vh;
    margin-bottom: 5vh;
}

.basebox .linkbox {
    margin-top: 5vh;
    padding: 0px !important;
}

.basebox .link .iconname {
    vertical-align: middle !important;
    margin-top: -0.5vh;
    font-size: 24px;
}

.basebox .link {
    margin-top: 2vh;
    font-size: 18px;
    font-weight: 600;
    line-height: 25px;
    color: #0C969E;
}

.basebox .link:hover {
    color: #0C9E7B;
}

.basebox .box {
    margin-top: 2vh;
}

.basebox .box .boxinner {
    padding: 30px 30px !important;
    background: #e7fdf8;
    border-radius: 10px;
}

.boxinner h2 {
    color: #000;
    font-size: 18px;
    font-weight: 600;
    margin-top: 1vh;
    line-height: 25px;
    margin-bottom: 3vh;
}

.boxinner p {
    color: #000;
    line-height: 25px;
    font-weight: 400;
    font-size: 16px;
    text-align: justify !important;
}

.boxinner .ctabtn {
    background: #0C969E;
    width: 100% !important;
    height: auto;
    float: left;
    text-align: center;
    margin-top: 1vh;
    padding: 10px 20px !important;
    border-radius: 5px;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
}

.boxinner .ctabtn:hover {
    background: #0b888e;
}


/* Article box */

.basebox .articlebox {
    margin-top: 2vh;
}

.basebox .articlebox .articleboxinner {
    padding: 0px 0px 20px 0px !important;
    background: #e7fcfd;
    border-radius: 10px;
    box-shadow: 0px 0px 5px #f5f5f5;
}

.articlebase {
    padding: 0px 20px 20px 20px !important;
    position: relative;
}

.articleboxinner img {
    border-radius: 10px 10px 0px 0px;
}

.profilephoto {
    border-radius: 0px !important;
}

.profilebase {
    padding: 0px !important;
    position: relative
}

.profilebase .mtitle {
    color: #293534;
    font-size: 18px;
    font-weight: 700;
    margin-top: 1vh;
    line-height: 25px;
    margin-bottom: -0vh;
}

.profilebase .mtext {
    color: #415654;
    line-height: 25px;
    font-weight: 400;
    font-size: 15px;
    margin-top: 0px;
}

.profilebase a img {
    position: absolute;
    right: 0;
    margin-right: 1vh;
    top: 8px;
}

.articlebase .datebox {
    background: #e7fdf8;
    color: #0C9E7B;
    position: absolute;
    top: -4vh;
    left: 10px;
    bottom: -8vh !important;
    height: 5vh;
    font-size: 14px;
    font-weight: 500;
    border-radius: 5px;
    width: 60% !important;
    line-height: 25px;
    padding: 5px 20px !important;
}

.articleboxinner h2 {
    color: #000;
    font-size: 18px;
    font-weight: 700;
    margin-top: 3vh;
    line-height: 25px;
    margin-bottom: 3vh;
}

.articleboxinner p {
    color: #000;
    line-height: 25px;
    font-weight: 400;
    font-size: 15px;
    text-align: justify !important;
}

.articleboxinner .ctabtn {
    background: #0C969E;
    width: 100% !important;
    height: auto;
    float: left;
    text-align: center;
    margin-top: 1vh;
    padding: 10px 20px !important;
    border-radius: 5px;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
}

.articleboxinner .ctabtn:hover {
    background: #0b888e;
}


/* Contactbase */

.contactbase {
    padding: 0px !important;
    margin-top: 4vh;
}

.contactbase p {
    color: #293534;
    font-size: 18px;
    font-weight: 500;
    text-align: justify !important;
    line-height: 15px;
    width: 100% !important;
    height: auto;
    display: inline;
    vertical-align: middle;
}

.contactbase img {
    width: 90%;
    margin-top: -1.5vh;
    vertical-align: middle;
    float: left;
    margin-left: 1vh;
}


/* Login Box */

.contactctabtn {
    background: #0C969E;
    width: 100% !important;
    height: auto;
    text-align: center;
    margin-top: 0vh;
    padding: 15px 40px !important;
    border-radius: 5px;
    color: #fff;
    border: none;
    font-size: 18px;
    font-weight: 500;
}

.contactctabtn:hover {
    background: #0b888e;
    text-decoration: none;
}

.loginbox {
    width: 100%;
    margin-top: 2vh;
}

.loginbase {
    margin-top: 1vh;
    padding: 0px !important;
}

.loginbox .fieldbox .fieldtitle {
    color: #293534;
    font-weight: 700;
    font-size: 16px !important;
    text-transform: capitalize;
}

.loginbox .fieldbox {
    margin-top: 0vh;
    padding: 10px 20px !important;
    text-transform: capitalize;
}

.loginbox .required {
    color: red;
    font-size: 14px;
    font-weight: 500;
}

.loginbox p {
    color: #415654;
    font-size: 14px;
    font-weight: 500;
    margin-top: -1vh;
    text-align: justify !important;
    text-transform: none;
}

.loginbox .ctabtn {
    background: #415654;
    width: auto !important;
    height: auto;
    float: left;
    text-align: center;
    margin-top: 1vh;
    padding: 10px 40px !important;
    border-radius: 5px;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    border: none;
    cursor: pointer;
}

.loginbox .ctabtn:hover {
    background: #293534;
    text-decoration: none;
}

.loginbox .input-field {
    margin-top: 1vh;
    background: #e6e6e6;
    border: solid 1px #e6e6e6;
    border-radius: 5px;
    height: 50px;
    font-weight: 700;
    text-transform: capitalize;
}

.loginbox .textareabox {
    margin-top: 1vh;
    background: #e6e6e6;
    border: solid 1px #e6e6e6;
    border-radius: 5px;
    height: 50px;
    font-weight: 700;
    text-transform: capitalize;
    min-width: 100%;
    max-width: 100%;
    max-height: 40vh;
    min-height: 40vh;
    resize: none;
}


/* Corebox */

.corebox {
    margin-top: 5vh;
}

.coreboxinner {
    position: relative;
    padding: 0px !important;
    border-radius: 10px;
    height: 40vh;
    width: 100% !important;
    background-position: 50% 50% !important;
    background-size: cover;
    border-radius: 10px;
    overflow: hidden !important;
}

.coreboxinnerbox {
    position: absolute;
    background: rgba(0, 0, 0, 0.4);
    top: 0px;
    left: 0px;
    height: 40vh;
    z-index: 2;
    width: 100% !important;
    border-radius: 10px;
    cursor: pointer;
    overflow: hidden !important;
}


/* [2] Transition property for smooth transformation of images */

.coreboxinner img {
    transition: transform .5s ease;
}


/* [3] Finally, transforming the image when container gets hovered */

.coreboxinner:hover img {
    transform: scale(1.5);
    background: rgba(0, 0, 0, 0.7);
}

.coreboxinner:hover {
    background: rgba(0, 0, 0, 0.7);
}

.coreboxinner img {
    border-radius: 10px;
}

.centered {
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 24px;
    color: #ffffff;
    font-weight: 500;
    text-align: center;
}


/* Statbox */

.statbox {
    padding: 10px 20px 10px 30px !important;
    border-left: solid 1px #fff;
}

.statbox h2 {
    font-size: 50px !important;
    font-weight: 700;
    color: #ffff;
    margin-top: 3vh;
    margin-bottom: 0.5vh;
}

.statbox p {
    font-size: 20px;
    font-weight: 400;
    color: #ffff;
    margin-top: 0vh;
}


/* Banner slide */

.bannerslide {
    margin-top: 0vh;
}

.bannerslide .bannerslideinner {
    position: relative;
    padding: 0px !important;
    border-radius: 0px;
    height: 100vh;
    width: 100% !important;
    background-position: 50% 50% !important;
    background-size: cover;
}

.bannerinnerbox {
    position: absolute;
    background: rgba(12, 157, 126, 0.5);
    top: 0px;
    left: 0px;
    padding: 20px !important;
    height: 100vh;
    z-index: 2;
    width: 100% !important;
}

.bannerslideinner img {
    border-radius: 0px;
}

.bannerinnerbox .centered {
    position: absolute;
    top: 35%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 50px;
    color: #ffffff;
    font-weight: 700;
    text-align: center;
}

.bannerinnerbox .ctabox {
    position: absolute;
    top: 58%;
    left: 0%;
    width: 100%;
}

.bannerinnerbox .ctabtn {
    background: #293534;
    width: auto !important;
    height: auto;
    text-align: center;
    margin-top: 5vh;
    padding: 15px 40px !important;
    border-radius: 5px;
    color: #fff;
    font-size: 20px;
    font-weight: 500;
}

.bannerinnerbox .ctabtn:hover {
    background: #000;
    text-decoration: none;
}

.bannerinnerbox .explorebtn {
    background: #293534;
    width: auto !important;
    height: auto;
    text-align: center;
    margin-top: 5vh;
    margin-left: 2vh;
    padding: 15px 40px !important;
    border-radius: 5px;
    color: #fff;
    font-size: 20px;
    font-weight: 500;
}

.bannerinnerbox .explorebtn:hover {
    background: #000;
    text-decoration: none;
}


/* Formbox */

.formbox .title {
    color: #000;
    font-size: 25px;
    letter-spacing: 0px;
    font-weight: 700;
    margin-top: 2vh;
    margin-bottom: 0vh;
}

.formbox p {
    color: #999;
    font-size: 16px;
    font-weight: 500;
    margin-top: 1vh;
}


/* About page */

.basebox .maintitle {
    color: #000;
    font-size: 28px;
    letter-spacing: 0px;
    font-weight: 700;
    margin-top: 2vh;
    margin-bottom: 1vh;
}

.basebox .para {
    font-size: 16px;
    font-weight: 500;
    margin-top: 1vh;
    color: #293534;
}


/* Tabs box */

.tabsbox {
    background: #fff;
    padding: 0px 80px !important;
}

.tabsbox .tabs {
    background: #fff;
    padding: 0px 10px !important;
}

.tabsbox .tabs .tab a {
    color: #0C969E;
    font-size: 16px;
    font-weight: 500;
}

.tabsbox .tabs .tab .active {
    background: #0C969E !important;
    color: #fff !important;
}

.tabsbox .tabs .tab .active h2 {
    color: #fff !important;
}

.tabsbox .indicator {
    display: none;
}

.tabs .icon {
    width: 70px !important;
    background: #fff;
    border: solid 5px #fff;
    padding: 0px !important;
    border-radius: 50px;
}

.tabs h2 {
    margin-top: -1vh !important;
    font-size: 17px;
    font-weight: 500;
}


/*----------- For Mobile Devices ---------------- */

@media only screen and (max-width: 600px) {
    /* Basebox */
    .basebox {
        background: #fff;
        padding: 30px 10px !important;
    }
    /* Banner box */
    .bannerbox {
        background-image: url('../assets/banner.png');
        background-size: cover;
        background-position: 50% 50%;
        padding: 100px 20px !important;
        position: relative;
    }
    .bannerinnerbox {
        width: 100%;
        height: 100% !important;
        position: absolute;
        top: 0px;
        padding: 20px 40px !important;
        left: 0px;
        background: rgba(12, 158, 123, 0.4);
    }
    .bannerbox h1 {
        color: #fff;
        font-size: 22px !important;
        font-weight: 600;
        line-height: 35px;
        margin-bottom: 1vh;
        margin-left: 3vh !important;
    }
    .bannerbox a {
        color: #fff;
        font-size: 18px;
        line-height: 25px;
        font-weight: 400;
        margin-left: 3vh;
    }
    .bannerbox .bar {
        color: #fff;
        font-size: 18px;
        line-height: 25px;
        font-weight: 400;
    }
    .bannerbox a:hover {
        text-decoration: underline;
    }
    .basebox .inbox h1 {
        color: #293534;
        font-size: 22px;
        letter-spacing: 0px;
        font-weight: 700;
        line-height: 28px;
        margin-top: 2vh;
        margin-bottom: 4vh;
        text-transform: capitalize;
    }
    .basebox .inbox h2 {
        color: #000;
        font-size: 22px;
        letter-spacing: 0px;
        line-height: 28px;
        font-weight: 700;
        margin-top: 2vh;
        margin-bottom: 2vh;
    }
    .basebox .inbox p {
        color: #293534;
        line-height: 25px;
        font-weight: 400;
        font-size: 18px !important;
        line-height: 25px;
        text-align: justify !important;
    }
    .basebox p {
        color: #293534;
        line-height: 25px;
        font-weight: 400;
        font-size: 18px !important;
        line-height: 25px;
        text-align: center !important;
    }
    .basebox .title {
        color: #000;
        font-size: 22px;
        letter-spacing: 0px;
        font-weight: 700;
        margin-top: 2vh;
        margin-bottom: 5vh;
    }
    .basebox .box .boxinner {
        padding: 30px 30px !important;
        background: #e7fdf8;
        border-radius: 10px;
    }
    .boxinner h2 {
        color: #000;
        font-size: 18px;
        font-weight: 600;
        margin-top: 1vh;
        line-height: 25px;
        margin-bottom: 3vh;
    }
    .boxinner p {
        color: #000;
        line-height: 25px;
        font-weight: 400;
        font-size: 16px;
        text-align: left !important;
    }
    /* Footer */
    .footerbox {
        background: #293534;
        padding: 20px 20px 1px 20px !important;
    }
    /* Statbox */
    .statbox {
        padding: 10px 20px 10px 20px !important;
        border-left: none !important;
    }
    .statbox h2 {
        font-size: 24px !important;
        font-weight: 700;
        color: #ffff;
        margin-top: 3vh;
        float: left;
        width: 100% !important;
        margin-bottom: 0.5vh;
    }
    .statbox p {
        font-size: 16px !important;
        font-weight: 400;
        color: #ffff;
        float: left;
        line-height: 24px;
        margin-top: 0vh;
    }
    /* Banner slide */
    .bannerslide {
        margin-top: 0vh;
    }
    .bannerslide .bannerslideinner {
        position: relative;
        padding: 0px !important;
        border-radius: 0px;
        height: auto;
        width: 100% !important;
        background-position: 50% 50% !important;
        background-size: cover;
    }
    .bannerinnerbox {
        position: absolute;
        background: rgba(12, 157, 126, 0.5);
        top: 0px;
        left: 0px;
        height: auto;
        z-index: 2;
        width: 100% !important;
        padding: 0px !important;
    }
    .bannerslideinner img {
        border-radius: 0px;
    }
    .bannerinnerbox .centered {
        position: absolute;
        top: 20%;
        width: 100% !important;
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 16px !important;
        color: #ffffff;
        font-weight: 700;
        line-height: 26px;
        text-align: center;
    }
    .bannerinnerbox .ctabox {
        position: absolute;
        top: 60%;
        left: 0%;
        width: 100%;
    }
    .bannerinnerbox .ctabtn {
        background: #293534;
        width: auto !important;
        height: auto;
        text-align: center;
        margin-top: 8vh;
        padding: 15px 20px !important;
        border-radius: 5px;
        color: #fff;
        font-size: 16px;
        font-weight: 500;
    }
    .bannerinnerbox .ctabtn:hover {
        background: #000;
        text-decoration: none;
    }
    .bannerinnerbox .explorebtn {
        background: #293534;
        width: auto !important;
        height: auto;
        text-align: center;
        margin-top: 8vh;
        margin-left: 2vh;
        padding: 15px 20px !important;
        border-radius: 5px;
        color: #fff;
        font-size: 16px;
        font-weight: 500;
    }
    .bannerinnerbox .explorebtn:hover {
        background: #000;
        text-decoration: none;
    }
    /* Tabs box */
    .tabsbox {
        background: #fff;
        padding: 0px 10px !important;
    }
    .tabsbox .tabs {
        background: #fff;
        padding: 0px 20px !important;
        text-align: center;
        margin-left: 1vh !important;
    }
    .tabsbox .tabs .tab a {
        color: #0C969E;
        font-size: 16px;
        text-align: center;
        font-weight: 500;
    }
    .tabsbox .tabs .tab .active {
        background: #0C969E !important;
        color: #fff !important;
    }
    .tabsbox .tabs .tab .active h2 {
        color: #fff !important;
    }
    .tabsbox .indicator {
        display: none;
    }
    .tabs .icon {
        width: 70px !important;
        background: #fff;
        border: solid 5px #fff;
        padding: 0px !important;
        border-radius: 50px;
    }
    .tabs h2 {
        margin-top: -1vh !important;
        font-size: 17px;
        font-weight: 500;
    }
    /* Article box */
    .basebox .articlebox {
        margin-top: 2vh;
    }
    .basebox .articlebox .articleboxinner {
        padding: 0px 0px 20px 0px !important;
        background: #e7fcfd;
        border-radius: 10px;
        box-shadow: 0px 0px 5px #f5f5f5;
    }
    .articlebase {
        padding: 0px 20px 20px 20px !important;
        position: relative;
    }
    .articleboxinner img {
        border-radius: 10px 10px 0px 0px;
    }
    .profilephoto {
        border-radius: 0px !important;
    }
    .profilebase {
        padding: 0px !important;
        position: relative
    }
    .profilebase .mtitle {
        color: #293534;
        font-size: 16px;
        font-weight: 700;
        margin-top: 1vh;
        line-height: 25px;
        margin-bottom: -0vh;
    }
    .profilebase .mtext {
        color: #415654;
        line-height: 23px;
        font-weight: 400;
        float: left;
        text-align: left !important;
        font-size: 14px !important;
        margin-top: 0px;
    }
    .profilebase a img {
        position: absolute;
        right: 0;
        margin-right: 1vh;
        top: 8px;
    }
    .articlebase .datebox {
        background: #e7fdf8;
        color: #0C9E7B;
        position: absolute;
        top: -4vh;
        left: 10px;
        bottom: -8vh !important;
        height: 5vh;
        font-size: 14px;
        font-weight: 500;
        border-radius: 5px;
        width: 60% !important;
        line-height: 25px;
        padding: 5px 20px !important;
    }
    .articleboxinner h2 {
        color: #000;
        font-size: 18px;
        font-weight: 700;
        margin-top: 3vh;
        line-height: 25px;
        margin-bottom: 3vh;
    }
    .articleboxinner p {
        color: #000;
        line-height: 25px;
        font-weight: 400;
        font-size: 15px;
        text-align: justify !important;
    }
    .articleboxinner .ctabtn {
        background: #0C969E;
        width: 100% !important;
        height: auto;
        float: left;
        text-align: center;
        margin-top: 1vh;
        padding: 10px 20px !important;
        border-radius: 5px;
        color: #fff;
        font-size: 16px;
        font-weight: 600;
    }
    .articleboxinner .ctabtn:hover {
        background: #0b888e;
    }
    .imgbox {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 3vh;
    }
    .imgbox .image {
        width: 100px !important;
        float: left;
    }
    .imgbox .image img {
        width: 100% !important;
    }
    .imgbox .text {
        font-size: 12px !important;
        padding-left: 2px;
        padding-top: 0%;
        float: left;
        color: #fff;
    }
    .bannerimgbox {
        display: flex;
        align-items: center;
        margin-top: 3vh;
        position: absolute;
        z-index: 2;
        top: -1vh;
        left: 0%;
        width: 100%;
    }
    .bannerimgbox .image {
        width: 90px !important;
        align-items: center !important;
        margin-left: 8vh !important;
        float: left;
    }
    .bannerimgbox .image img {
        width: 100% !important;
    }
    .bannerimgbox .text {
        font-size: 12px !important;
        padding-left: 10px;
        float: left;
        font-weight: 600;
        padding-top: 0%;
        color: #fff;
    }
}


/*----------- For Mobile Devices Ends ---------------- */


/* Seller sliders controls */

.historycontrol .owl-prev,
.eventscontrol .owl-prev,
.bookingsnav .owl-prev,
.previousnav .owl-prev,
.cancellednav .owl-prev,
.activenav .owl-prev,
.inactivenav .owl-prev,
.reviewscontrols .owl-prev {
    background: transparent;
    border: none;
    position: absolute;
    left: 20px;
    top: 50%;
    z-index: 2;
}

.historycontrol .owl-next,
.eventscontrol .owl-next,
.bookingsnav .owl-next,
.previousnav .owl-next,
.cancellednav .owl-next,
.activenav .owl-next,
.inactivenav .owl-next,
.reviewscontrols .owl-next {
    background: transparent;
    border: none;
    position: absolute;
    z-index: 2;
    right: 2vh;
    top: 50%;
}

.historycontrol .previous,
.reviewscontrols .previous,
.eventscontrol .previous,
.bookingsnav .previous,
.previousnav .previous,
.cancellednav .previous,
.activenav .previous,
.inactivenav .previous {
    position: absolute;
    left: 2vh;
    top: 50%;
    background-color: rgba(255, 255, 255, 0.9);
    width: 50px;
    height: 50px;
    color: #0b888e;
    cursor: pointer;
    z-index: 2;
    border-radius: 50px;
    box-shadow: 0px 0px 2px #ccc;
    font-size: 16px;
    padding: 5px !important;
}

.historycontrol .next,
.eventscontrol .next,
.reviewscontrols .next,
.bookingsnav .next,
.previousnav .next,
.cancellednav .next,
.activenav .next,
.inactivenav .next {
    position: absolute;
    right: 2vh;
    top: 50%;
    cursor: pointer;
    background-color: rgba(255, 255, 255, 0.9);
    width: 50px;
    height: 50px;
    color: #0b888e;
    width: 50px;
    height: 50px;
    z-index: 2;
    border-radius: 50px;
    box-shadow: 0px 0px 2px #ccc;
    font-size: 16px;
    padding: 5px !important;
}

.imgbox {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 3vh;
}

.imgbox .image {
    width: 150px !important;
    float: left;
}

.imgbox .image img {
    width: 100% !important;
}

.imgbox .text {
    font-size: 16px;
    padding-left: 20px;
    padding-top: 0%;
    float: left;
    color: #fff;
}