/********** Template CSS **********/
:root {
    --primary: #0c8899;
    --bs-secondary: #eee;
    --bs-success: #43ac6a;
    --bs-light: #eee;
    --bs-dark: #333;
    --bs-blue: #0c8899;
    --bs-indigo: #6610f2;
    --bs-purple: #6f42c1;
    --bs-pink: #e83e8c;
    --bs-red: #f04124;
    --bs-orange: #fd7e14;
    --bs-yellow: #e99002;
    --bs-green: #43ac6a;
    --bs-teal: #20c997;
    --bs-cyan: #5bc0de;
    --bs-black: #000;
    --bs-white: #fff;
    --bs-gray: #888;
    --bs-gray-dark: #333;
    --bs-gray-100: #f8f9fa;
    --bs-gray-200: #eee;
    --bs-gray-300: #dee2e6;
    --bs-gray-400: #ccc;
    --bs-gray-500: #adb5bd;
    --bs-gray-600: #888;
    --bs-gray-700: #495057;
    --bs-gray-800: #333;
    --bs-gray-900: #222;
    --bs-primary: #0c8899;
    --bs-secondary: #eee;
    --bs-success: #43ac6a;
    --bs-info: #5bc0de;
    --bs-warning: #e99002;
    --bs-danger: #f04124;
    --bs-light: #eee;
    --bs-dark: #333;
    --bs-primary-rgb: 120,140,18;
    --bs-secondary-rgb: 238,238,238;
    --bs-success-rgb: 67,172,106;
    --bs-info-rgb: 91,192,222;
    --bs-warning-rgb: 233,144,2;
    --bs-danger-rgb: 240,65,36;
   /* --bs-danger-rgb: 12, 136, 153;*/
    --bs-light-rgb: 238,238,238;
    --bs-dark-rgb: 51,51,51;
    --bs-primary-text-emphasis: #00384a;
    --bs-secondary-text-emphasis: #5f5f5f;
    --bs-success-text-emphasis: #1b452a;
    --bs-info-text-emphasis: #244d59;
    --bs-warning-text-emphasis: #5d3a01;
    --bs-danger-text-emphasis: #601a0e;
    --bs-light-text-emphasis: #495057;
    --bs-dark-text-emphasis: #495057;
    --bs-primary-bg-subtle: #cce8f1;
    --bs-secondary-bg-subtle: #fcfcfc;
    --bs-success-bg-subtle: #d9eee1;
    --bs-info-bg-subtle: #def2f8;
    --bs-warning-bg-subtle: #fbe9cc;
    --bs-danger-bg-subtle: #fcd9d3;
    --bs-light-bg-subtle: #fcfcfd;
    --bs-dark-bg-subtle: #ccc;
    --bs-primary-border-subtle: #99d1e3;
    --bs-secondary-border-subtle: #f8f8f8;
    --bs-success-border-subtle: #b4dec3;
    --bs-info-border-subtle: #bde6f2;
    --bs-warning-border-subtle: #f6d39a;
    --bs-danger-border-subtle: #f9b3a7;
    --bs-light-border-subtle: #eee;
    --bs-dark-border-subtle: #adb5bd;
    --bs-white-rgb: 255,255,255;
    --bs-black-rgb: 0,0,0;
    --bs-font-sans-serif: "Open Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
    --bs-font-monospace: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
    --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
    --bs-body-font-family: var(--bs-font-sans-serif);
    --bs-body-font-size: 1rem;
    --bs-body-font-weight: 400;
    --bs-body-line-height: 1.5;
    --bs-body-color: #222;
    --bs-body-color-rgb: 34,34,34;
    --bs-body-bg: #fff;
    --bs-body-bg-rgb: 255,255,255;
    --bs-emphasis-color: #000;
    --bs-emphasis-color-rgb: 0,0,0;
    --bs-secondary-color: rgba(34, 34, 34, 0.75);
    --bs-secondary-color-rgb: 34,34,34;
    --bs-secondary-bg: #eee;
    --bs-secondary-bg-rgb: 238,238,238;
    --bs-tertiary-color: rgba(34, 34, 34, 0.5);
    --bs-tertiary-color-rgb: 34,34,34;
    --bs-tertiary-bg: #f8f9fa;
    --bs-tertiary-bg-rgb: 248,249,250;
    --bs-heading-color: inherit;
    --bs-link-color: #0c8899;
    --bs-link-color-rgb: 0,140,186;
    --bs-link-decoration: underline;
    --bs-link-hover-color: #007095;
    --bs-link-hover-color-rgb: 0,112,149;
    --bs-code-color: #e83e8c;
    --bs-highlight-color: #222;
    --bs-highlight-bg: #fbe9cc;
    --bs-border-width: 1px;
    --bs-border-style: solid;
    --bs-border-color: #dee2e6;
    --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
    --bs-border-radius: 0;
    --bs-border-radius-sm: 0;
    --bs-border-radius-lg: 0;
    --bs-border-radius-xl: 1rem;
    --bs-border-radius-xxl: 2rem;
    --bs-border-radius-2xl: var(--bs-border-radius-xxl);
    --bs-border-radius-pill: 50rem;
    --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
    --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
    --bs-focus-ring-width: 0.25rem;
    --bs-focus-ring-opacity: 0.25;
    --bs-focus-ring-color: rgba(0, 140, 186, 0.25);
    --bs-form-valid-color: #43ac6a;
    --bs-form-valid-border-color: #43ac6a;
    --bs-form-invalid-color: #f04124;
    --bs-form-invalid-border-color: #f04124;
    --bs-breadcrumb-padding-x: 0.75rem;
    --bs-breadcrumb-padding-y: 0.375rem;
    --bs-breadcrumb-margin-bottom: 1rem;
    --bs-breadcrumb-bg:;
    --bs-breadcrumb-border-radius: 3px;
    --bs-breadcrumb-divider-color: var(--bs-secondary-color);
    --bs-breadcrumb-item-padding-x: 0.5rem;
    --bs-breadcrumb-item-active-color: var(--bs-secondary-color);
}

.breadcrumb {
   
    display: flex;
    flex-wrap: wrap;
    padding: var(--bs-breadcrumb-padding-y) var(--bs-breadcrumb-padding-x);
    margin-bottom: var(--bs-breadcrumb-margin-bottom);
    font-size: var(--bs-breadcrumb-font-size);
    list-style: none;
    background-color: var(--bs-breadcrumb-bg);
    border-radius: var(--bs-breadcrumb-border-radius);
}


#login-form {
    overflow: hidden;
    position: relative;
    /*     padding: 40px;
*/ padding-right: 20px;
    padding-left: 20px;
    /*background: #f4f4f4;*/
}

.form-box {
    background: #fff;
    margin:  auto;
    max-width: 500px;
    box-shadow: 0 3px 6px 0px rgba(0,0,0,0.16), 0 3px 6px 0px rgba(0,0,0,0.23);
}


/*#mainContent {
    min-width: 300px;*/ /* Set the minimum width as required */
/*}*/

.back-to-top {
    position: fixed;
    display: none;
    right: 30px;
    bottom: 30px;
    z-index: 99;
}

.fw-medium {
    font-weight: 500;
}


/*** Spinner ***/
#spinner {
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s ease-out, visibility 0s linear .5s;
    z-index: 99999;
}

    #spinner.show {
        transition: opacity .5s ease-out, visibility 0s linear 0s;
        visibility: visible;
        opacity: 1;
    }



.pagination {
    --bs-pagination-padding-x: 0.75rem;
    --bs-pagination-padding-y: 0.375rem;
    --bs-pagination-font-size: 1rem;
    --bs-pagination-color: #888;
    --bs-pagination-bg: var(--bs-body-bg);
    --bs-pagination-border-width: var(--bs-border-width);
    --bs-pagination-border-color: var(--bs-border-color);
    --bs-pagination-border-radius: var(--bs-border-radius);
    --bs-pagination-hover-color: var(--bs-link-hover-color);
    --bs-pagination-hover-bg: var(--bs-tertiary-bg);
    --bs-pagination-hover-border-color: var(--bs-border-color);
    --bs-pagination-focus-color: var(--bs-link-hover-color);
    --bs-pagination-focus-bg: var(--bs-secondary-bg);
    --bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(0, 140, 186, 0.25);
    --bs-pagination-active-color: #fff;
    --bs-pagination-active-bg: #0c8899;
    --bs-pagination-active-border-color: #0079a1;
    --bs-pagination-disabled-color: #ccc;
    --bs-pagination-disabled-bg: transparent;
    --bs-pagination-disabled-border-color: var(--bs-border-color);
    display: flex;
    padding-left: 0;
    list-style: none;
}

.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #0c8899;
    --bs-btn-border-color: #0c8899;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #14c3db;
    --bs-btn-hover-border-color: #007095;
    --bs-btn-focus-shadow-rgb: 38, 157, 196;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #007095;
    --bs-btn-active-border-color: #00698c;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #0c8899;
    --bs-btn-disabled-border-color: #0c8899;
}

.btn-secondary {
    --bs-btn-color: #000;
    --bs-btn-bg: #eee;
    --bs-btn-border-color: #eee;
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: #f1f1f1;
    --bs-btn-hover-border-color: #f0f0f0;
    --bs-btn-focus-shadow-rgb: 202, 202, 202;
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: #f1f1f1;
    --bs-btn-active-border-color: #f0f0f0;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #000;
    --bs-btn-disabled-bg: #eee;
    --bs-btn-disabled-border-color: #eee;
}

.btn-success {
    --bs-btn-color: #fff;
    --bs-btn-bg: #43ac6a;
    --bs-btn-border-color: #43ac6a;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #39925a;
    --bs-btn-hover-border-color: #368a55;
    --bs-btn-focus-shadow-rgb: 95, 184, 128;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #368a55;
    --bs-btn-active-border-color: #328150;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #43ac6a;
    --bs-btn-disabled-border-color: #43ac6a;
}

.btn-info {
    --bs-btn-color: #fff;
    --bs-btn-bg: #5bc0de;
    --bs-btn-border-color: #5bc0de;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #4da3bd;
    --bs-btn-hover-border-color: #499ab2;
    --bs-btn-focus-shadow-rgb: 116, 201, 227;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #499ab2;
    --bs-btn-active-border-color: #4490a7;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #5bc0de;
    --bs-btn-disabled-border-color: #5bc0de;
}

.btn-warning {
    --bs-btn-color: #fff;
    --bs-btn-bg: #e99002;
    --bs-btn-border-color: #e99002;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #c67a02;
    --bs-btn-hover-border-color: #ba7302;
    --bs-btn-focus-shadow-rgb: 236, 161, 40;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #ba7302;
    --bs-btn-active-border-color: #af6c02;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #e99002;
    --bs-btn-disabled-border-color: #e99002;
}

.btn-danger {
    --bs-btn-color: #fff;
    --bs-btn-bg: #f04124;
    --bs-btn-border-color: #f04124;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #cc371f;
    --bs-btn-hover-border-color: #c0341d;
    --bs-btn-focus-shadow-rgb: 242, 94, 69;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #c0341d;
    --bs-btn-active-border-color: #b4311b;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #f04124;
    --bs-btn-disabled-border-color: #f04124;
}

.btn-light {
    --bs-btn-color: #000;
    --bs-btn-bg: #eee;
    --bs-btn-border-color: #eee;
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: #cacaca;
    --bs-btn-hover-border-color: #bebebe;
    --bs-btn-focus-shadow-rgb: 202, 202, 202;
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: #bebebe;
    --bs-btn-active-border-color: #b3b3b3;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #000;
    --bs-btn-disabled-bg: #eee;
    --bs-btn-disabled-border-color: #eee;
}

.btn-dark {
    --bs-btn-color: #fff;
    --bs-btn-bg: #333;
    --bs-btn-border-color: #333;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #525252;
    --bs-btn-hover-border-color: #474747;
    --bs-btn-focus-shadow-rgb: 82, 82, 82;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #5c5c5c;
    --bs-btn-active-border-color: #474747;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #333;
    --bs-btn-disabled-border-color: #333;
}

.btn-outline-primary {
    --bs-btn-color: #0c8899;
    --bs-btn-border-color: #0c8899;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #0c8899;
    --bs-btn-hover-border-color: #0c8899;
    --bs-btn-focus-shadow-rgb: 0, 140, 186;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #0c8899;
    --bs-btn-active-border-color: #0c8899;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #0c8899;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #0c8899;
    --bs-gradient: none;
}

.btn-outline-secondary {
    --bs-btn-color: #eee;
    --bs-btn-border-color: #eee;
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: #eee;
    --bs-btn-hover-border-color: #eee;
    --bs-btn-focus-shadow-rgb: 238, 238, 238;
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: #eee;
    --bs-btn-active-border-color: #eee;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #eee;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #eee;
    --bs-gradient: none;
}

.btn-outline-success {
    --bs-btn-color: #43ac6a;
    --bs-btn-border-color: #43ac6a;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #43ac6a;
    --bs-btn-hover-border-color: #43ac6a;
    --bs-btn-focus-shadow-rgb: 67, 172, 106;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #43ac6a;
    --bs-btn-active-border-color: #43ac6a;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #43ac6a;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #43ac6a;
    --bs-gradient: none;
}

.btn-outline-info {
    --bs-btn-color: #5bc0de;
    --bs-btn-border-color: #5bc0de;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #5bc0de;
    --bs-btn-hover-border-color: #5bc0de;
    --bs-btn-focus-shadow-rgb: 91, 192, 222;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #5bc0de;
    --bs-btn-active-border-color: #5bc0de;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #5bc0de;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #5bc0de;
    --bs-gradient: none;
}

.btn-outline-warning {
    --bs-btn-color: #e99002;
    --bs-btn-border-color: #e99002;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #e99002;
    --bs-btn-hover-border-color: #e99002;
    --bs-btn-focus-shadow-rgb: 233, 144, 2;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #e99002;
    --bs-btn-active-border-color: #e99002;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #e99002;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #e99002;
    --bs-gradient: none;
}

.btn-outline-danger {
    --bs-btn-color: #f04124;
    --bs-btn-border-color: #f04124;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #f04124;
    --bs-btn-hover-border-color: #f04124;
    --bs-btn-focus-shadow-rgb: 240, 65, 36;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #f04124;
    --bs-btn-active-border-color: #f04124;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #f04124;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #f04124;
    --bs-gradient: none;
}

.btn-outline-light {
    --bs-btn-color: #eee;
    --bs-btn-border-color: #eee;
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: #eee;
    --bs-btn-hover-border-color: #eee;
    --bs-btn-focus-shadow-rgb: 238, 238, 238;
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: #eee;
    --bs-btn-active-border-color: #eee;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #eee;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #eee;
    --bs-gradient: none;
}

.btn-outline-dark {
    --bs-btn-color: #333;
    --bs-btn-border-color: #333;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #333;
    --bs-btn-hover-border-color: #333;
    --bs-btn-focus-shadow-rgb: 51, 51, 51;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #333;
    --bs-btn-active-border-color: #333;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #333;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #333;
    --bs-gradient: none;
}

.btn-link {
    --bs-btn-font-weight: 400;
    --bs-btn-color: var(--bs-link-color);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: transparent;
    --bs-btn-hover-color: var(--bs-link-hover-color);
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-color: var(--bs-link-hover-color);
    --bs-btn-active-border-color: transparent;
    --bs-btn-disabled-color: #888;
    --bs-btn-disabled-border-color: transparent;
    --bs-btn-box-shadow: 0 0 0 #000;
    --bs-btn-focus-shadow-rgb: 38, 157, 196;
    text-decoration: underline;
}

    .btn-link:focus-visible {
        color: var(--bs-btn-color);
    }

    .btn-link:hover {
        color: var(--bs-btn-hover-color);
    }

.btn-lg, .btn-group-lg > .btn {
    --bs-btn-padding-y: 0.5rem;
    --bs-btn-padding-x: 1rem;
    --bs-btn-font-size: 1.25rem;
    --bs-btn-border-radius: var(--bs-border-radius-lg);
}

.btn-sm, .btn-group-sm > .btn {
    --bs-btn-padding-y: 0.25rem;
    --bs-btn-padding-x: 0.5rem;
    --bs-btn-font-size: 0.875rem;
    --bs-btn-border-radius: var(--bs-border-radius-sm);
}


.alert-primary {
    --bs-alert-color: var(--bs-primary-text-emphasis);
    --bs-alert-bg: var(--bs-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-primary-border-subtle);
    --bs-alert-link-color: var(--bs-primary-text-emphasis);
}

.alert-secondary {
    --bs-alert-color: var(--bs-secondary-text-emphasis);
    --bs-alert-bg: var(--bs-secondary-bg-subtle);
    --bs-alert-border-color: var(--bs-secondary-border-subtle);
    --bs-alert-link-color: var(--bs-secondary-text-emphasis);
}

.alert-success {
    --bs-alert-color: var(--bs-success-text-emphasis);
    --bs-alert-bg: var(--bs-success-bg-subtle);
    --bs-alert-border-color: var(--bs-success-border-subtle);
    --bs-alert-link-color: var(--bs-success-text-emphasis);
}

.alert-info {
    --bs-alert-color: var(--bs-info-text-emphasis);
    --bs-alert-bg: var(--bs-info-bg-subtle);
    --bs-alert-border-color: var(--bs-info-border-subtle);
    --bs-alert-link-color: var(--bs-info-text-emphasis);
}

.alert-warning {
    --bs-alert-color: var(--bs-warning-text-emphasis);
    --bs-alert-bg: var(--bs-warning-bg-subtle);
    --bs-alert-border-color: var(--bs-warning-border-subtle);
    --bs-alert-link-color: var(--bs-warning-text-emphasis);
}

.alert-danger {
    --bs-alert-color: var(--bs-danger-text-emphasis);
    --bs-alert-bg: var(--bs-danger-bg-subtle);
    --bs-alert-border-color: var(--bs-danger-border-subtle);
    --bs-alert-link-color: var(--bs-danger-text-emphasis);
}

.alert-light {
    --bs-alert-color: var(--bs-light-text-emphasis);
    --bs-alert-bg: var(--bs-light-bg-subtle);
    --bs-alert-border-color: var(--bs-light-border-subtle);
    --bs-alert-link-color: var(--bs-light-text-emphasis);
}

.alert-dark {
    --bs-alert-color: var(--bs-dark-text-emphasis);
    --bs-alert-bg: var(--bs-dark-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-border-subtle);
    --bs-alert-link-color: var(--bs-dark-text-emphasis);
}



.text-bg-primary {
    color: #fff !important;
    background-color: RGBA(var(--bs-primary-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-secondary {
    color: #000 !important;
    background-color: RGBA(var(--bs-secondary-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-success {
    color: #fff !important;
    background-color: RGBA(var(--bs-success-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-info {
    color: #fff !important;
    background-color: RGBA(var(--bs-info-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-warning {
    color: #fff !important;
    background-color: RGBA(var(--bs-warning-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-danger {
    color: #fff !important;
    background-color: RGBA(var(--bs-danger-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-light {
    color: #000 !important;
    background-color: RGBA(var(--bs-light-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-dark {
    color: #fff !important;
    background-color: RGBA(var(--bs-dark-rgb), var(--bs-bg-opacity, 1)) !important;
}

.link-primary {
    color: RGBA(var(--bs-primary-rgb), var(--bs-link-opacity, 1)) !important;
    -webkit-text-decoration-color: RGBA(var(--bs-primary-rgb), var(--bs-link-underline-opacity, 1)) !important;
    text-decoration-color: RGBA(var(--bs-primary-rgb), var(--bs-link-underline-opacity, 1)) !important;
}

    .link-primary:hover, .link-primary:focus {
        color: RGBA(0, 112, 149, var(--bs-link-opacity, 1)) !important;
        -webkit-text-decoration-color: RGBA(0, 112, 149, var(--bs-link-underline-opacity, 1)) !important;
        text-decoration-color: RGBA(0, 112, 149, var(--bs-link-underline-opacity, 1)) !important;
    }

.link-secondary {
    color: RGBA(var(--bs-secondary-rgb), var(--bs-link-opacity, 1)) !important;
    -webkit-text-decoration-color: RGBA(var(--bs-secondary-rgb), var(--bs-link-underline-opacity, 1)) !important;
    text-decoration-color: RGBA(var(--bs-secondary-rgb), var(--bs-link-underline-opacity, 1)) !important;
}

    .link-secondary:hover, .link-secondary:focus {
        color: RGBA(241, 241, 241, var(--bs-link-opacity, 1)) !important;
        -webkit-text-decoration-color: RGBA(241, 241, 241, var(--bs-link-underline-opacity, 1)) !important;
        text-decoration-color: RGBA(241, 241, 241, var(--bs-link-underline-opacity, 1)) !important;
    }

.link-success {
    color: RGBA(var(--bs-success-rgb), var(--bs-link-opacity, 1)) !important;
    -webkit-text-decoration-color: RGBA(var(--bs-success-rgb), var(--bs-link-underline-opacity, 1)) !important;
    text-decoration-color: RGBA(var(--bs-success-rgb), var(--bs-link-underline-opacity, 1)) !important;
}

    .link-success:hover, .link-success:focus {
        color: RGBA(54, 138, 85, var(--bs-link-opacity, 1)) !important;
        -webkit-text-decoration-color: RGBA(54, 138, 85, var(--bs-link-underline-opacity, 1)) !important;
        text-decoration-color: RGBA(54, 138, 85, var(--bs-link-underline-opacity, 1)) !important;
    }

.link-info {
    color: RGBA(var(--bs-info-rgb), var(--bs-link-opacity, 1)) !important;
    -webkit-text-decoration-color: RGBA(var(--bs-info-rgb), var(--bs-link-underline-opacity, 1)) !important;
    text-decoration-color: RGBA(var(--bs-info-rgb), var(--bs-link-underline-opacity, 1)) !important;
}

    .link-info:hover, .link-info:focus {
        color: RGBA(73, 154, 178, var(--bs-link-opacity, 1)) !important;
        -webkit-text-decoration-color: RGBA(73, 154, 178, var(--bs-link-underline-opacity, 1)) !important;
        text-decoration-color: RGBA(73, 154, 178, var(--bs-link-underline-opacity, 1)) !important;
    }

.link-warning {
    color: RGBA(var(--bs-warning-rgb), var(--bs-link-opacity, 1)) !important;
    -webkit-text-decoration-color: RGBA(var(--bs-warning-rgb), var(--bs-link-underline-opacity, 1)) !important;
    text-decoration-color: RGBA(var(--bs-warning-rgb), var(--bs-link-underline-opacity, 1)) !important;
}

    .link-warning:hover, .link-warning:focus {
        color: RGBA(186, 115, 2, var(--bs-link-opacity, 1)) !important;
        -webkit-text-decoration-color: RGBA(186, 115, 2, var(--bs-link-underline-opacity, 1)) !important;
        text-decoration-color: RGBA(186, 115, 2, var(--bs-link-underline-opacity, 1)) !important;
    }

.link-danger {
    color: RGBA(var(--bs-danger-rgb), var(--bs-link-opacity, 1)) !important;
    -webkit-text-decoration-color: RGBA(var(--bs-danger-rgb), var(--bs-link-underline-opacity, 1)) !important;
    text-decoration-color: RGBA(var(--bs-danger-rgb), var(--bs-link-underline-opacity, 1)) !important;
}

    .link-danger:hover, .link-danger:focus {
        color: RGBA(192, 52, 29, var(--bs-link-opacity, 1)) !important;
        -webkit-text-decoration-color: RGBA(192, 52, 29, var(--bs-link-underline-opacity, 1)) !important;
        text-decoration-color: RGBA(192, 52, 29, var(--bs-link-underline-opacity, 1)) !important;
    }

.link-light {
    color: RGBA(var(--bs-light-rgb), var(--bs-link-opacity, 1)) !important;
    -webkit-text-decoration-color: RGBA(var(--bs-light-rgb), var(--bs-link-underline-opacity, 1)) !important;
    text-decoration-color: RGBA(var(--bs-light-rgb), var(--bs-link-underline-opacity, 1)) !important;
}

    .link-light:hover, .link-light:focus {
        color: RGBA(241, 241, 241, var(--bs-link-opacity, 1)) !important;
        -webkit-text-decoration-color: RGBA(241, 241, 241, var(--bs-link-underline-opacity, 1)) !important;
        text-decoration-color: RGBA(241, 241, 241, var(--bs-link-underline-opacity, 1)) !important;
    }

.link-dark {
    color: RGBA(var(--bs-dark-rgb), var(--bs-link-opacity, 1)) !important;
    -webkit-text-decoration-color: RGBA(var(--bs-dark-rgb), var(--bs-link-underline-opacity, 1)) !important;
    text-decoration-color: RGBA(var(--bs-dark-rgb), var(--bs-link-underline-opacity, 1)) !important;
}

    .link-dark:hover, .link-dark:focus {
        color: RGBA(41, 41, 41, var(--bs-link-opacity, 1)) !important;
        -webkit-text-decoration-color: RGBA(41, 41, 41, var(--bs-link-underline-opacity, 1)) !important;
        text-decoration-color: RGBA(41, 41, 41, var(--bs-link-underline-opacity, 1)) !important;
    }

.link-body-emphasis {
    color: RGBA(var(--bs-emphasis-color-rgb), var(--bs-link-opacity, 1)) !important;
    -webkit-text-decoration-color: RGBA(var(--bs-emphasis-color-rgb), var(--bs-link-underline-opacity, 1)) !important;
    text-decoration-color: RGBA(var(--bs-emphasis-color-rgb), var(--bs-link-underline-opacity, 1)) !important;
}

    .link-body-emphasis:hover, .link-body-emphasis:focus {
        color: RGBA(var(--bs-emphasis-color-rgb), var(--bs-link-opacity, 0.75)) !important;
        -webkit-text-decoration-color: RGBA(var(--bs-emphasis-color-rgb), var(--bs-link-underline-opacity, 0.75)) !important;
        text-decoration-color: RGBA(var(--bs-emphasis-color-rgb), var(--bs-link-underline-opacity, 0.75)) !important;
    }


.bg-primary {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-primary-rgb), var(--bs-bg-opacity)) !important;
}

.bg-secondary {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-secondary-rgb), var(--bs-bg-opacity)) !important;
}

.bg-success {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-success-rgb), var(--bs-bg-opacity)) !important;
}

.bg-info {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-info-rgb), var(--bs-bg-opacity)) !important;
}

.bg-warning {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-warning-rgb), var(--bs-bg-opacity)) !important;
}

.bg-danger {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-danger-rgb), var(--bs-bg-opacity)) !important;
}

.bg-light {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
}

.bg-dark {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-dark-rgb), var(--bs-bg-opacity)) !important;
}

.bg-black {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-black-rgb), var(--bs-bg-opacity)) !important;
}

.bg-white {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-white-rgb), var(--bs-bg-opacity)) !important;
}

.bg-body {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-body-bg-rgb), var(--bs-bg-opacity)) !important;
}

.bg-transparent {
    --bs-bg-opacity: 1;
    background-color: transparent !important;
}

.bg-body-secondary {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-secondary-bg-rgb), var(--bs-bg-opacity)) !important;
}

.bg-body-tertiary {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-tertiary-bg-rgb), var(--bs-bg-opacity)) !important;
}



.bg-primary-subtle {
    background-color: var(--bs-primary-bg-subtle) !important;
}

.bg-secondary-subtle {
    background-color: var(--bs-secondary-bg-subtle) !important;
}

.bg-success-subtle {
    background-color: var(--bs-success-bg-subtle) !important;
}

.bg-info-subtle {
    background-color: var(--bs-info-bg-subtle) !important;
}

.bg-warning-subtle {
    background-color: var(--bs-warning-bg-subtle) !important;
}

.bg-danger-subtle {
    background-color: var(--bs-danger-bg-subtle) !important;
}

.bg-light-subtle {
    background-color: var(--bs-light-bg-subtle) !important;
}

.bg-dark-subtle {
    background-color: var(--bs-dark-bg-subtle) !important;
}

.bg-gradient {
    background-image: var(--bs-gradient) !important;
}


.table {
    --bs-table-color-type: initial;
    --bs-table-bg-type: initial;
    --bs-table-color-state: initial;
    --bs-table-bg-state: initial;
    --bs-table-color: var(--bs-emphasis-color);
    --bs-table-bg: var(--bs-body-bg);
    --bs-table-border-color: var(--bs-border-color);
    --bs-table-accent-bg: transparent;
    --bs-table-striped-color: var(--bs-emphasis-color);
    --bs-table-striped-bg: rgba(var(--bs-emphasis-color-rgb), 0.05);
    --bs-table-active-color: var(--bs-emphasis-color);
    --bs-table-active-bg: rgba(var(--bs-emphasis-color-rgb), 0.1);
    --bs-table-hover-color: var(--bs-emphasis-color);
    --bs-table-hover-bg: rgba(var(--bs-emphasis-color-rgb), 0.075);
    width: 100%;
    margin-bottom: 1rem;
    vertical-align: top;
    border-color: var(--bs-table-border-color);
}

    .table > :not(caption) > * > * {
        padding: 0.5rem 0.5rem;
        color: var(--bs-table-color-state, var(--bs-table-color-type, var(--bs-table-color)));
        background-color: var(--bs-table-bg);
        border-bottom-width: var(--bs-border-width);
        box-shadow: inset 0 0 0 9999px var(--bs-table-bg-state, var(--bs-table-bg-type, var(--bs-table-accent-bg)));
    }

    .table > tbody {
        vertical-align: inherit;
    }

    .table > thead {
        vertical-align: bottom;
    }

.table-group-divider {
    border-top: calc(var(--bs-border-width) * 2) solid currentcolor;
}

.caption-top {
    caption-side: top;
}

.table-sm > :not(caption) > * > * {
    padding: 0.25rem 0.25rem;
}

.table-bordered > :not(caption) > * {
    border-width: var(--bs-border-width) 0;
}

    .table-bordered > :not(caption) > * > * {
        border-width: 0 var(--bs-border-width);
    }

.table-borderless > :not(caption) > * > * {
    border-bottom-width: 0;
}

.table-borderless > :not(:first-child) {
    border-top-width: 0;
}

.table-striped > tbody > tr:nth-of-type(odd) > * {
    --bs-table-color-type: var(--bs-table-striped-color);
    --bs-table-bg-type: var(--bs-table-striped-bg);
}

.table-striped-columns > :not(caption) > tr > :nth-child(even) {
    --bs-table-color-type: var(--bs-table-striped-color);
    --bs-table-bg-type: var(--bs-table-striped-bg);
}

.table-active {
    --bs-table-color-state: var(--bs-table-active-color);
    --bs-table-bg-state: var(--bs-table-active-bg);
}

.table-hover > tbody > tr:hover > * {
    --bs-table-color-state: var(--bs-table-hover-color);
    --bs-table-bg-state: var(--bs-table-hover-bg);
}


.table-primary {
    --bs-table-color: #fff;
    --bs-table-bg: #0c8899;
    --bs-table-border-color: #33a3c8;
    --bs-table-striped-bg: #0d92bd;
    --bs-table-striped-color: #fff;
    --bs-table-active-bg: #1a98c1;
    --bs-table-active-color: #fff;
    --bs-table-hover-bg: #1395bf;
    --bs-table-hover-color: #fff;
    color: var(--bs-table-color);
    border-color: var(--bs-table-border-color);
}

.table-secondary {
    --bs-table-color: #000;
    --bs-table-bg: #eeeeee;
    --bs-table-border-color: #bebebe;
    --bs-table-striped-bg: #e2e2e2;
    --bs-table-striped-color: #000;
    --bs-table-active-bg: #d6d6d6;
    --bs-table-active-color: #000;
    --bs-table-hover-bg: gainsboro;
    --bs-table-hover-color: #000;
    color: var(--bs-table-color);
    border-color: var(--bs-table-border-color);
}

.table-success {
    --bs-table-color: #fff;
    --bs-table-bg: #43ac6a;
    --bs-table-border-color: #69bd88;
    --bs-table-striped-bg: #4cb071;
    --bs-table-striped-color: #fff;
    --bs-table-active-bg: #56b479;
    --bs-table-active-color: #fff;
    --bs-table-hover-bg: #51b275;
    --bs-table-hover-color: #fff;
    color: var(--bs-table-color);
    border-color: var(--bs-table-border-color);
}

.table-info {
    --bs-table-color: #fff;
    --bs-table-bg: #5bc0de;
    --bs-table-border-color: #7ccde5;
    --bs-table-striped-bg: #63c3e0;
    --bs-table-striped-color: #fff;
    --bs-table-active-bg: #6bc6e1;
    --bs-table-active-color: #fff;
    --bs-table-hover-bg: #67c5e0;
    --bs-table-hover-color: #fff;
    color: var(--bs-table-color);
    border-color: var(--bs-table-border-color);
}

.table-warning {
    --bs-table-color: #fff;
    --bs-table-bg: #e99002;
    --bs-table-border-color: #eda635;
    --bs-table-striped-bg: #ea960f;
    --bs-table-striped-color: #fff;
    --bs-table-active-bg: #eb9b1b;
    --bs-table-active-color: #fff;
    --bs-table-hover-bg: #eb9815;
    --bs-table-hover-color: #fff;
    color: var(--bs-table-color);
    border-color: var(--bs-table-border-color);
}

.table-danger {
    --bs-table-color: #fff;
    --bs-table-bg: #f04124;
    --bs-table-border-color: #f36750;
    --bs-table-striped-bg: #f14b2f;
    --bs-table-striped-color: #fff;
    --bs-table-active-bg: #f2543a;
    --bs-table-active-color: #fff;
    --bs-table-hover-bg: #f14f34;
    --bs-table-hover-color: #fff;
    color: var(--bs-table-color);
    border-color: var(--bs-table-border-color);
}

.table-light {
    --bs-table-color: #000;
    --bs-table-bg: #eee;
    --bs-table-border-color: #bebebe;
    --bs-table-striped-bg: #e2e2e2;
    --bs-table-striped-color: #000;
    --bs-table-active-bg: #d6d6d6;
    --bs-table-active-color: #000;
    --bs-table-hover-bg: gainsboro;
    --bs-table-hover-color: #000;
    color: var(--bs-table-color);
    border-color: var(--bs-table-border-color);
}

.table-dark {
    --bs-table-color: #fff;
    --bs-table-bg: #333;
    --bs-table-border-color: #5c5c5c;
    --bs-table-striped-bg: #3d3d3d;
    --bs-table-striped-color: #fff;
    --bs-table-active-bg: #474747;
    --bs-table-active-color: #fff;
    --bs-table-hover-bg: #424242;
    --bs-table-hover-color: #fff;
    color: var(--bs-table-color);
    border-color: var(--bs-table-border-color);
}

.table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}



/*** Button ***/
/*.btn {
    transition: .5s;
    font-weight: 500;
}

.btn-primary,
.btn-outline-primary:hover {
    color: var(--light);
}

.btn-secondary,
.btn-outline-secondary:hover {
    color: var(--dark);
}*/


/*** Navbar ***/
.sticky-top {
    top: -100px;
    transition: .5s;
}



@media (max-width: 991.98px) {
    .navbar .navbar-nav .nav-link {
        margin-right: 0;
        padding: 10px 0;
      
    }

    .navbar .navbar-nav {
        margin-top: 15px;
        border-top: 1px solid #EEEEEE;
    }
}

@media (min-width: 992px) {
    .navbar .nav-item .dropdown-menu {
        display: block;
        border: none;
        margin-top: 0;
        top: 150%;
        opacity: 0;
        visibility: hidden;
        transition: .5s;
    }

    .navbar .nav-item:hover .dropdown-menu {
        top: 100%;
        visibility: visible;
        transition: .5s;
        opacity: 1;
    }
}

/* Carousel base class */
.carousel {
    margin-bottom: 1rem;
}
/* Since positioning the image, we need to help out the caption */
/*.carousel-caption {
    bottom: 3rem;
    z-index: 10;
}*/


/* Declare heights because of positioning of img element */
.carousel-item {
    height: 30rem;
}

.carousel-item > img {
        position: absolute;
        top: 0;
        left: 0;
        min-width: 100%;
        height: 30rem;
}


/*** Header ***/
.carousel-caption {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    background: rgba(0, 0, 0, .1);
    z-index: 1;
 /*   bottom: 3rem;
    z-index: 10;*/
}




.carousel-control-prev,
.carousel-control-next {
    width: 15%;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 3.5rem;
    background-color: var(--primary);
    border: 15px solid var(--primary);
}

@media (max-width: 768px) 
{
    #header-carousel .carousel-item {
        position: relative;
        min-height: 450px;
    }
     #header-carousel .carousel-item img
     {
      position: absolute;
      width: 100%;
      height: 100%;
       object-fit: cover;
      }
}




/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 40em) {
    /* Bump up size of carousel content */
    .carousel-caption p {
        margin-bottom: 1.25rem;
        font-size: 1.25rem;
        line-height: 1.4;
    }

    .featurette-heading {
        font-size: 50px;
    }
}

@media (min-width: 62em) {
    .featurette-heading {
        margin-top: 7rem;
    }
}



/*.page-header {
    background: linear-gradient(rgba(0, 0, 0, .1), rgba(0, 0, 0, .1)), url(../img/carousel-1.jpg) center center no-repeat;
    background-size: cover;
}

    .page-header .breadcrumb-item + .breadcrumb-item::before {
        color: var(--light);
    }

    .page-header .breadcrumb-item,
    .page-header .breadcrumb-item a {*/
        /* font-size: 18px;*/
        /*color: var(--light);
    }*/


/*** Features ***/
.feature-row {
    box-shadow: 0 0 45px rgba(0, 0, 0, .08);
}

.feature-item {
    border-color: rgba(0, 0, 0, .03) !important;
}


/*** About ***/
.about {
    background: linear-gradient(rgba(0, 0, 0, .1), rgba(0, 0, 0, .1)), url(../img/about.jpg) left center no-repeat;
    background-size: cover;
}

.btn-play {
    position: relative;
    display: block;
    box-sizing: content-box;
    width: 36px;
    height: 46px;
    border-radius: 100%;
    border: none;
    outline: none !important;
    padding: 18px 20px 20px 28px;
    background: var(--primary);
}

    .btn-play:before {
        content: "";
        position: absolute;
        z-index: 0;
        left: 50%;
        top: 50%;
        transform: translateX(-50%) translateY(-50%);
        display: block;
        width: 90px;
        height: 90px;
        background: var(--primary);
        border-radius: 100%;
        animation: pulse-border 1500ms ease-out infinite;
    }

    .btn-play:after {
        content: "";
        position: absolute;
        z-index: 1;
        left: 50%;
        top: 50%;
        transform: translateX(-50%) translateY(-50%);
        display: block;
        width: 90px;
        height: 90px;
        background: var(--primary);
        border-radius: 100%;
        transition: all 200ms;
    }

    .btn-play span {
        display: block;
        position: relative;
        z-index: 3;
        width: 0;
        height: 0;
        left: 3px;
        border-left: 30px solid #FFFFFF;
        border-top: 18px solid transparent;
        border-bottom: 18px solid transparent;
    }

@keyframes pulse-border {
    0% {
        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
        opacity: 1;
    }

    100% {
        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(2);
        opacity: 0;
    }
}

.modal-video .modal-dialog {
    position: relative;
    max-width: 800px;
    margin: 60px auto 0 auto;
}

.modal-video .modal-body {
    position: relative;
    padding: 0px;
}

.modal-video .close {
    position: absolute;
    width: 30px;
    height: 30px;
    right: 0px;
    top: -30px;
    z-index: 999;
    /* font-size: 30px;*/
    font-weight: normal;
    color: #FFFFFF;
    background: #000000;
    opacity: 1;
}


/*** Service ***/
.service-item .service-text {
    position: relative;
    width: 100%;
    top: 0;
    left: 0;
    text-align: center;
    background: #FFFFFF;
    box-shadow: 0 0 45px rgba(0, 0, 0, .06);
    transition: .5s;
    z-index: 2;
}

.service-item:hover .service-text {
    top: -1.5rem;
}

.service-item .service-text h5 {
    transition: .5s;
}

.service-item:hover .service-text h5 {
    color: var(--primary);
}

.service-item .service-btn {
    position: absolute;
    width: 80%;
    height: 3rem;
    left: 10%;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #FFFFFF;
    box-shadow: 0 0 45px rgba(0, 0, 0, .07);
    transition: .5s;
    z-index: 1;
}

.service-item:hover .service-btn {
    bottom: -1.5rem;
}


/*** Project ***/
.project-item {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 0 45px rgba(0, 0, 0, .07);
}

    .project-item .project-overlay {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(0, 0, 0, .5);
        opacity: 0;
        padding-top: 60px;
        transition: .5s;
    }

    .project-item:hover .project-overlay {
        opacity: 1;
        padding-top: 0;
    }

.project-carousel .owl-nav {
    position: absolute;
    top: -100px;
    right: 0;
    display: flex;
}

    .project-carousel .owl-nav .owl-prev,
    .project-carousel .owl-nav .owl-next {
        margin-left: 15px;
        width: 55px;
        height: 55px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--secondary);
        border-radius: 55px;
        box-shadow: 0 0 45px rgba(0, 0, 0, .15);
        /* font-size: 25px;*/
        transition: .5s;
    }

        .project-carousel .owl-nav .owl-prev:hover,
        .project-carousel .owl-nav .owl-next:hover {
            background: var(--primary);
            color: #FFFFFF;
        }

@media (max-width: 768px) {
    .project-carousel .owl-nav {
        top: -70px;
        right: auto;
        left: 50%;
        transform: translateX(-50%);
    }

        .project-carousel .owl-nav .owl-prev,
        .project-carousel .owl-nav .owl-next {
            margin: 0 7px;
            width: 45px;
            height: 45px;
            /*  font-size: 20px;*/
        }
}


/*** Team ***/
.team-item {
    position: relative;
    text-align: center;
    box-shadow: 0 0 45px rgba(0, 0, 0, .07);
}

    .team-item .team-social {
        position: absolute;
        padding: 0;
        top: 15px;
        left: 0;
        overflow: hidden;
    }

        .team-item .team-social li {
            list-style-type: none;
            margin-bottom: 10px;
            margin-left: -50px;
            opacity: 0;
            transition: .5s;
        }

    .team-item:hover .team-social li {
        margin-left: 15px;
        opacity: 1;
    }

    .team-item .team-social li .btn {
        background: #FFFFFF;
        color: var(--primary);
        border-radius: 40px;
        transition: .5s;
    }

        .team-item .team-social li .btn:hover {
            color: #FFFFFF;
            background: var(--primary);
        }

    .team-item .team-social li:nth-child(1) {
        transition-delay: .1s;
    }

    .team-item .team-social li:nth-child(2) {
        transition-delay: .2s;
    }

    .team-item .team-social li:nth-child(3) {
        transition-delay: .3s;
    }

    .team-item .team-social li:nth-child(4) {
        transition-delay: .4s;
    }

    .team-item .team-social li:nth-child(5) {
        transition-delay: .5s;
    }


/*** Testimonial ***/
.testimonial-item {
    box-shadow: 0 0 45px rgba(0, 0, 0, .07);
    transition: .5s;
}

    .owl-item .testimonial-item,
    .testimonial-item * {
        transition: .5s;
    }

    .owl-item.center .testimonial-item,
    .testimonial-item:hover {
        background: var(--primary);
    }

        .owl-item.center .testimonial-item *,
        .testimonial-item:hover * {
            color: #FFFFFF !important;
        }

    .testimonial-item img {
        width: 100px !important;
        height: 100px !important;
        border-radius: 100px;
    }

.testimonial-carousel .owl-nav {
    position: absolute;
    top: -100px;
    right: 0;
    display: flex;
}

    .testimonial-carousel .owl-nav .owl-prev,
    .testimonial-carousel .owl-nav .owl-next {
        margin-left: 15px;
        width: 55px;
        height: 55px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--secondary);
        border-radius: 55px;
        box-shadow: 0 0 45px rgba(0, 0, 0, .15);
        /* font-size: 25px;*/
        transition: .5s;
    }

        .testimonial-carousel .owl-nav .owl-prev:hover,
        .testimonial-carousel .owl-nav .owl-next:hover {
            background: var(--primary);
            color: #FFFFFF;
        }

@media (max-width: 768px) {
    .testimonial-carousel .owl-nav {
        top: -70px;
        right: auto;
        left: 50%;
        transform: translateX(-50%);
    }

        .testimonial-carousel .owl-nav .owl-prev,
        .testimonial-carousel .owl-nav .owl-next {
            margin: 0 7px;
            width: 45px;
            height: 45px;
            /*font-size: 20px;*/
        }
}


/*** Footer ***/
.footer {
    color: #B0B9AE;
}

    .footer .btn.btn-link {
        display: block;
        margin-bottom: 5px;
        padding: 0;
        text-align: left;
        color: #B0B9AE;
        font-weight: normal;
        text-transform: capitalize;
        transition: .3s;
    }

        .footer .btn.btn-link::before {
            position: relative;
            content: "\f105";
            font-family: "Font Awesome 5 Free";
            font-weight: 900;
            margin-right: 10px;
        }

        .footer .btn.btn-link:hover {
            color: var(--light);
            letter-spacing: 1px;
            box-shadow: none;
        }

.copyright {
    color: #B0B9AE;
}

.copyright {
    background: #111111;
}

    .copyright a:hover {
        color: var(--primary) !important;
    }


html {
    font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 14px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

/* ============ desktop view ============ 
*/@media all and (min-width: 992px) {
    .dropdown-menu li {
        position: relative;
    }

    .nav-item .submenu {
        display: none;
        position: absolute;
        left: 100%;
        top: -7px;
    }

    .nav-item .submenu-left {
        right: 100%;
        left: auto;
    }

    .dropdown-menu > li:hover {
        background-color: #f1f1f1
    }

        .dropdown-menu > li:hover > .submenu {
            display: block;
        }
}
/* ============ desktop view .end// ============ 
*/


/* ============ small devices ============ 
*/@media (max-width: 991px) {
    .dropdown-menu .dropdown-menu {
        margin-left: 0.7rem;
        margin-right: 0.7rem;
        margin-bottom: .5rem;
    }
}
/* ============ small devices .end// ============ */