@font-face {
    font-family: 'Segoe UI Regular';
    font-style: normal;
    font-weight: normal;
    src: local('Segoe UI Regular'), url('/fonts/segoe-ui/Segoe UI.woff') format('woff');
}


@font-face {
    font-family: 'Segoe UI Italic';
    font-style: normal;
    font-weight: normal;
    src: local('Segoe UI Italic'), url('/fonts/segoe-ui/Segoe UI Italic.woff') format('woff');
}


@font-face {
    font-family: 'Segoe UI Bold';
    font-style: normal;
    font-weight: normal;
    src: local('Segoe UI Bold'), url('/fonts/segoe-ui/Segoe UI Bold.woff') format('woff');
}


@font-face {
    font-family: 'Segoe UI Bold Italic';
    font-style: normal;
    font-weight: normal;
    src: local('Segoe UI Bold Italic'), url('/fonts/segoe-ui/Segoe UI Bold Italic.woff') format('woff');
}

html {
    font-family: 'Segoe UI Regular', system-ui !important;
}

:root {
    --primary: #0ba1a2;
    --secondary: #e65d0d;
    --dark-primary: #086869;
    --success: #1d9e74;
    --danger: #ef3b4f;
    --warning: #e65d0d;
}

.text-primary, .primary-text{
    color: var(--primary);
}

.text-danger, .danger-text{
    color: var(--danger);
}

.text-warning, .warning-text{
    color: var(--warning);
}

.text-success, .success-text{
    color: var(--success);
}

.text-secondary, .secondary-text{
    color: var(--secondary) !important;
}

.bg-primary{
    background-color: var(--primary) !important;
}

.bg-secondary{
    background-color: var(--secondary)!important;
}

.bg-success{
    background-color: var(--success)!important;
}

.bg-danger{
    background-color: var(--danger)!important;
}

.bg-warning{
    background-color: var(--warning)!important;
}

nav#w-top-nav{
    background-color: #ffffff;
}

nav#w-top-nav a{
    color: #333333;
    white-space: nowrap;
}

.dropdown-content li > a, .dropdown-content li > span {
    color: #333333;
}

nav#breadcrumbs{
    background-color: var(--primary);
}

nav#breadcrumbs .breadcrumb{
    /*color: var(--primary);*/
}

.toast.success{
    background-color: var(--success);
}

.toast.error {
    background-color: var(--danger);
}

.toast.warning{
    background-color: var(--warning);
}

.primary-text {
    color: var(--primary);
}

.primary {
    background-color: var(--primary);
}

.secondary-text {
    color: var(--secondary);
}

.secondary {
    background-color: var(--secondary) !important;
}

.btn, .btn-large, .btn-small{
    background-color: var(--primary);
    color: #fff;
    border: none;
    box-shadow: 0 5px 0 var(--dark-primary);
    transition: all .3s;
}

.btn:hover, .btn-large:hover, .btn-small:hover{
    background-color: var(--primary);
    transform: translateY(-4px);
    box-shadow: 0 5px 0 var(--dark-primary);
    /*border-bottom-width: 2px;*/
    /*box-shadow: none;*/
}

.btn:active, .btn-large:active, .btn-small:active{
    background-color: var(--primary);
    transform: translateY(2px);
    /*box-shadow: 0 5px 0 var(--dark-primary);*/
    border-bottom-width: 2px;
    box-shadow: none;
}

.btn-round{
    border-radius: 1.25em;
}

.pagination li.active{
    background-color: var(--primary);
}

.hover-ltr{
    background-size: 200% 100%;
    background-image: linear-gradient(to right, #fff 50%, rgba(0, 86, 171, 0.2) 50%);
    transition: background-position .5s;
}
.hover-ltr:hover{
    background-position: -100% 0;
}

.sidenav li.active {
    background-color: var(--primary);
}
.sidenav li.active * {
    color: #fff;
}

th.gridjs-th {
    background: var(--primary);
    color: #fff;
}

th.gridjs-th:hover, th.gridjs-th-sort:focus, th.gridjs-th-sort:hover {
    background: var(--dark-primary);
    color: #fff;
}

.home-section-full-screen{
    /*min-height: calc(100vh - 64px);*/
    min-height: 100vh;
}
/*#home{
    !*background-image: url('../img/home-backround.jpg');*!
    !*background-position: center;*!
    !*background-size: cover;*!
    display: flex;
    align-items: center;
    height: 100vh;
    !* Add the blur effect *!
    filter: blur(4px);
    -webkit-filter: blur(4px);
    background: #72cccd;  !* fallback for old browsers *!
    background: -webkit-linear-gradient(#72cccd, #e5834a);  !* Chrome 10-25, Safari 5.1-6 *!
    background: linear-gradient(#72cccd, #e5834a); !* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ *!
}*/

.top-nav-fixed{
    position: fixed;
    z-index: 1;
    box-shadow: none;
    background: transparent!important;
}

.tabs .tab a, .tabs .tab a:hover, .tabs .tab a.active {
    color: var(--primary);
}

.tabs .indicator {
    height: 3px;
    background-color: var(--primary);
}