﻿/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */

h1 {
    font-size: 12px;
    font-family: "Roboto Slab",serif;
}

.navbar {
    padding: 8px 0 6px;
}

a.navbar-brand {
    color: #fff;
    margin-right: 18px;
    white-space: normal;
    text-align: center;
    word-break: break-all;
    margin-right: 0;
}

/* Provide sufficient contrast against white background */
a {
    color: #0366d6;
}

.btn .btn-primary, input[type=submit], button.btn.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
    border-radius: 30px;
    font-family: Rubik;
    font-size: 13px;
    padding: 7px 12px 5px 12px;
}

a.btn.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
    border-radius: 30px;
    font-family: Rubik;
    font-size: 13px;
    padding: 7px 12px 5px 12px;
}

.btn .btn-outline-primary, a.btn.btn-outline-primary {
    border-radius: 30px;
    font-family: Rubik;
    font-size: 10px;
    border-width: 2px;
    font-weight: normal;
    padding: 7px 12px 5px 12px;
}

.btn .btn-danger, a.btn.btn-danger {
    border-radius: 30px;
}

.btn .secondary, a.btn.btn-secondary {
    border-radius: 30px;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.black {
    background-color: black;
}

.bg-white {
    background-color: #222 !important; /* easier to change original class bg color than to create new class */
}
/* Sticky footer styles
-------------------------------------------------- */
html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.border-top {
    border-top: 1px solid #e5e5e5;
}

.border-bottom {
    border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
    font-size: 1rem;
    line-height: inherit;
}

.check-yes {
    color: green;
    font-size: 1.4em;
}

.check-no {
    color: red;
    font-size: 1.4em;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
    position: relative;
    min-height: 100%;
}

body {
    /* Margin bottom by footer height */
    margin-bottom: 60px;
    background-color: #ddd;
    font-family: "Rubik", sans-serif;
}

.content-area {
    background-color: #fff;
    margin: 10px 0px;
    padding: 10px 20px 15px 20px;
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    /*white-space: nowrap;*/
    /*line-height: 60px;*/ /* Vertically center the text there */
    color: #fff;
    background-color: #ddd;
}

    .footer div.container {
        padding-right: 50px;
        padding-left: 50px;
        padding-bottom: 10px;
        padding-top: 20px;
        text-align: center;
    }

input {
    max-width: 300px;
}

.mini-textbox {
    width: 30px;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
}

.pad-right-10 {
    padding-right: 10px;
}

.calendar table, .calendar tr, .calendar td, .calendar th {
    border: 1px solid gray;
}

.schedule td {
    min-width: 15px;
}

.hour-header {
    text-align: left;
    padding-left: 5px;
}

.booked {
    background-color: #92a8d1;
    border-right-style: hidden;
}

    .booked:nth-last-of-type(1) {
        border-right-style: solid;
    }

.header-logo {
    height: 23px;
    width: 91px;
    margin-top: -9px;
}

.app-name {
    color: #fccd05;
    font-weight: bold;
    font-style: italic;
    font-size: 1.7rem;
}

thead tr {
    background-color: #006aad;
    color: #ffffff;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 0.8em;
    height: 40px;
}

td {
    border: none;
}

.message {
    border-left: 5px solid #a8f88e;
    background-color: #3e3e3e;
    color: #fff;
}

    .message h5 {
        padding: 3px 0 0 0;
    }

    .message p {
        margin: 0;
        padding: 0 0 5px 0;
    }

.flyout {
    left: 0;
    position: fixed;
    right: auto;
    transform: translateX(-100%);
    transition: transform 0.3s ease;
    z-index: 1050;
    width: 50%;
    background-color: #fff;
}

    .flyout.right {
        left: auto;
        right: 0;
        transform: translateX(100%);
    }

    .flyout.show {
        transform: translateX(0%);
    }

.flyout-backdrop {
    background-color: rgba(0, 0, 0, 0.5);
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 1040;
}

.navbar-flyout {
    background-clip: padding-box;
    background-color: #fff;
    bottom: 0;
    padding: 1rem;
    top: 0;
}

    .navbar-flyout.right {
        border-right: none;
    }

.circular {
    width: 300px;
    height: 300px;
    border-radius: 150px;
    -webkit-border-radius: 150px;
    -moz-border-radius: 150px;
}

.header-image-wrapper {
    position: relative;
    padding-bottom: 10px;
}

.header-image-text-overlay {
    position: absolute;
    bottom: 20px;
    left: 20px;
    background-color: rgba(0,0,0,0.7);
    color: white;
    padding-left: 20px;
    padding-right: 20px;
}

.dropdown-toggle::after {
    border-top: none;
}

.dropdown-menu {
    --bs-dropdown-border-radius: none;
}

.dropdown-item {
    width: auto;
}

    .dropdown-item:hover {
        background-color: inherit;
    }

.dropdown-toggle::after {
    border-top: none;
}

.dropdown-toggle::after {
    display: inline-block;
    position: absolute;
    top: 20px;
    transform: translateY(-50%);
    content: url(/img/dropdown-white.svg);
    width: 16px;
    height: 16px;
    margin-left: 1px;
}

.dropdown-toggle.dropdown-toggle-blue::after {
    content: url(/img/dropdown-blue.svg);
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: 0.5rem 0;
    margin: 0.125rem 0 0;
    font-size: 1rem;
    color: #fff;
    text-align: left;
    list-style: none;
    background-color: #555555;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-top: 1px solid rgba(255,255,255,.2);
    background-color: #555555;
    box-shadow: rgba(0,0,0,0.2) 4px 4px 0 0;
}

    .dropdown-menu .dropdown-item {
        font-size: 14px;
    }

.dropdown-item:not(:last-child) {
    border-bottom: 1px solid #757575;
}

.dropdown-item {
    width: auto;
}

.dropdown-item {
    display: block;
    padding: 0.5rem 0rem 0.3rem 0rem;
    clear: both;
    font-weight: 400;
    color: #fff;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
    margin: 0 1rem;
    /* line-height: 1.13; */
}

.nav-link {
    display: block;
    padding: 0.5rem 1rem;
    color: #fff;
}

a.nav-link:hover, a.dropdown-item:hover {
    color: #57d2ff;
}

plain {
    text-decoration: none;
}

.dropdown-toggle {
    white-space: nowrap;
    margin-right: 30px;
}

@media (min-width: 1200px) {
    .display-6 {
        font-size: 2.5rem;
    }
}

.display-6 {
    font-size: calc(1.375rem + 1.5vw);
    font-weight: 300;
    line-height: 1.2;
}

hr {
    margin-top: 1rem;
    margin-bottom: 1rem;
    border: 0;
    border-top: 1px solid; /*rgba(0, 0, 0, 0.1);*/
    color: #888888;
}

p {
    margin-top: 0;
    margin-bottom: 1rem;
}

h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    font-family: "Roboto Slab", serif;
}

h2, .h2 {
    font-size: 2rem;
    padding: 10px 0;
}

.table thead th {
    vertical-align: bottom;
    border-bottom: 2px solid #dee2e6;
}

.table th, .table td {
    padding: 0.75rem;
    vertical-align: top;
    border-top: 1px solid #dee2e6;
}

.dropdown-menu {
    width: 100%;
}

@media (min-width: 576px) {
    .dropdown-menu {
        width: auto;
    }
}

.pad-top {
    margin: 15px 0 0 0;
}

.pad-bottom {
    margin: 0 0 15px 0;
}

.full-width {
    width: 100%;
}

.sub-nav {
    margin: 15px 0;
    line-height: 2.75rem;
    font-size: 1.2rem;
}

.sub-nav-link {
    margin-right: 40px;
    color: #222;
    text-decoration: none;
    white-space: nowrap;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

    .sub-nav-link:hover {
        color: #0676d8;
    }

.sub-nav-link-active {
    margin-right: 40px;
    padding: 0 0 4px 0;
    color: #0676d8;
    font-weight: bold;
    border-bottom: 3px solid #57d2ff;
    white-space: nowrap
}

    .sub-nav-link-active:hover {
        color: #0676D8;
    }

.success-header {
    color: green;
}

.error-header {
    color: darkred;
}

input[type="checkbox"] {
    accent-color: #0676D8;
    transform: scale(1.37);
}

/*    Universal spinny thing on page load     */
.spinner-overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 1060;
    top: 0px;
    left: 0px;
    background-color: rgba(255,255,255, 0.5);
}

.spinner-icon-position {
    margin-top: 25%;
}

/*    Table sortability     */
table thead th {
    cursor: pointer !important;
}

    table thead th.nosort {
        cursor: initial !important;
    }

.table_sortable thead th:after {
    display: inline-block;
    padding: 0 .25rem;
}

.table_sortable thead th.desc:after {
    content: '↑' !important;
}

.table_sortable thead th.asc:after {
    content: '↓' !important;
}

.green {
    color: #888888;
}

.green-line {
    height: 2px;
    background-color: green;
    border: none;
    margin: 0 50px;
}

.header-row {
    color: #73737d;
    background-color: #e3e3e3;
    text-transform: uppercase;
    font-weight: 500;
    font-style: normal;
    font-size: 13px;
    font-family: 'Rubik', sans-serif;
}

.table-text {
    line-height: 1.5;
    font-size: 13px;
}

    .table-text a {
        font-weight: 500;
        text-decoration: none;
    }

        .table-text a:hover {
            opacity: 0.7;
        }

.blue-background {
    background-color: #cceeff !important;
}

.navbar-uplinks-container {
    text-align: right;
    margin-left: auto;
}

.navbar-toggler-container {
    display: none;
    justify-content: center;
    align-items: center;
}

.navbar-toggler-text {
    /* color: lightgrey; */
    color: #57d2ff;
    font-size: 16px;
    font-weight: 500;
    padding-right: 3px;
    margin-top: 1px;
    font-family: "Rubik", sans-serif;
}

.navbar-toggler {
    border: none;
    display: flex;
    align-items: center;
    padding-right: 0;
}

    .navbar-toggler:focus {
        border: none;
        outline: 0;
        box-shadow: none;
    }

.navbar-uplinks-wrapper {
    display: flex;
    flex-direction: row;
    justify-content: end;
    margin-bottom: 0;
    margin-right: 50px;
}

    .navbar-uplinks-wrapper > li > a {
        font-size: 12px;
        color: #d1d1d1;
        text-transform: uppercase;
        /* font-size: 12px; */
    }

    .navbar-uplinks-wrapper > li:last-child > a {
        margin-right: 6px;
    }

    .navbar-uplinks-wrapper > li > a::after {
        top: 15px;
    }

.navbar-links-container .navbar-nav {
    flex-wrap: wrap;
}

.navbar-links-container {
    padding-left: 30px;
    margin-top: -6px;
    margin-bottom: -6px;
    flex: 0 0 100%;
}

.new-stick {
    display: inline-block;
    padding: 3px 5px;
    border-radius: 3px;
    background-color: #57d2ff;
    color: #222;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    line-height: 1;
    margin-left: 8px;
    height: 15px;
}

.new-stick {
    color: #fff;
    font-weight: 500;
}

.nav-link-with-stick {
    display: flex;
}

.navbar-space {
    flex: 1;
}

.navbar-uplinks-wrapper-mobile {
    display: none;
}

.nav-link:focus, .nav-link:hover {
    color: white;
}

/* .navbar-toggler-icon-blue {
    background-image: url("/img/menu_24dp.svg");
} */

.toggler.collapsed .icon-reg {
    display: block;
    content: url(/img/menu_24dp.svg);
    height: 32px;
}

.toggler .icon-reg {
    display: none;
}

.toggler.collapsed .icon-open {
    display: none;
}

.toggler .icon-open {
    display: block;
    content: url(/img/close_24dp.svg);
    height: 42px;
}

@media only screen and (min-width: 1450px) {
    .navbar-uplinks-wrapper {
        margin-right: 45px;
    }
}

@media only screen and (min-width: 577px) {
    .nav-item.dropdown:hover .dropdown-menu {
        display: block;
    }

    .dropdown-item-selected {
        font-weight: 600;
        color: #57d2ff;
        border-bottom: 4px solid #57d2ff !important;
    }

    .navbar-uplinks-wrapper .nav-link:focus, .nav-link:hover {
        color: #d1d1d1;
    }

    header .navbar .container {
        margin-top: 0px;
    }

    .nav-item .dropdown-menu {
        border-top: 4px solid #57d2ff;
        margin-top: -4px;
    }

        .nav-item .dropdown-menu.dropdown-toggle-grey {
            border-top: 4px solid #555555;
            padding-top: 0;
            top: 40px;
            right: 20px;
            left: unset;
        }

        .nav-item .dropdown-menu::after {
            content: "";
            position: absolute;
            width: 0;
            height: 0;
            border-left: 10px solid transparent;
            border-right: 10px solid transparent;
            border-bottom: 10px solid #57d2ff;
            top: -14px;
            left: 2rem;
            width: 10px;
            height: 10px;
            z-index: -1;
        }

        .nav-item .dropdown-menu.dropdown-toggle-grey::after {
            border-bottom: 10px solid #555555;
            left: unset;
            right: 30px;
        }

    .navbar-main-container.collapse {
        display: block;
    }
}


@media only screen and (max-width: 576px) {
    .navbar-uplinks-wrapper > li > a {
        text-transform: capitalize;
    }

    .nav-item.dropdown .dropdown-menu {
        /* display: block; */
    }

    .nav-item.dropdown > a {
        padding-top: 10px;
        padding-bottom: 16px;
    }

    .navbar-nav .nav-item:first-child {
        /* padding-bottom: 5px; */
    }

    .dropdown-menu {
        background-color: #0476d8;
    }

    .navbar-uplinks-container {
        display: none;
    }

    .navbar-toggler-container {
        display: flex;
    }

    .nav-item .dropdown-item {
        border-bottom: none;
    }

    .navbar-links-container {
        padding-left: 0;
        margin-top: -12px;
        margin-bottom: -6px;
        position: relative;
    }


    .navbar-main-container {
        /*display:none;*/
        position: fixed;
        left: 0;
        right: -0.5px;
        top: 70.5px;
        z-index: 1000;
        bottom: 0;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.4);
    }

        .navbar-main-container:not(.show,.collapsing) {
            display: none;
        }

    li.nav-item {
        border-bottom: 1px solid rgba(255, 255, 255, .2);
    }

    .navbar-uplinks-wrapper {
        margin-right: 0;
    }

    .navbar-nav .dropdown-menu {
        padding-left: 40px;
    }

    .navbar-links-container .navbar-collapse {
        margin-left: 34px;
        margin-right: -10px;
        margin-bottom: -1px;
        bottom: 0;
        height: 100%;
        margin-top: 0px;
        background-color: #006aab;
    }

    .new-stick {
        margin-top: 5px;
    }

    .navbar-links-container .navbar-nav {
        margin-top: 0;
        background-color: #0476d8;
        padding-top: 4px;
        /* padding-bottom: 8px; */
    }

    .navbar-uplinks-wrapper-mobile li {
        border-bottom: 1px solid rgba(255, 255, 255, .2);
    }

        .navbar-uplinks-wrapper-mobile li a {
            font-size: 18px;
            font-weight: 400;
            color: white;
        }

    .nav-link.dropdown-toggle {
        /* text-transform: uppercase; */
        font-size: 18px;
        font-weight: 450;
        letter-spacing: 1px;
        margin-bottom: -6px;
        font-family: "Rubik", sans-serif;
        letter-spacing: 0.5px;
        text-transform: uppercase;
        font-size: 15px;
        font-weight: 500;
        letter-spacing: 1px;
    }

    .nav-item .dropdown-item {
        /* text-transform: uppercase; */
        font-size: 18px;
        font-weight: 450;
        letter-spacing: 1px;
    }

    .dropdown-menu .dropdown-item {
        font-size: 18px;
        font-weight: 400;
        /* letter-spacing: 1px; */
        text-transform: capitalize;
    }

    .nav-item.dropdown > a {
        /* text-transform: uppercase; */
    }

    .navbar-nav .dropdown-menu {
        margin-bottom: 8px;
        box-shadow: none;
        border: 0;
        margin-top: -8px;
        padding-top: 0;
        margin-bottom: 0;
    }

    .nav-item:not(.dropdown) .dropdown-item {
        padding: 0.5rem 0rem 0.5rem 0rem;
    }

    .nav-item .dropdown-toggle::after {
        top: 19px;
        display: none;
    }

    .navbar-links-container .navbar-uplinks-wrapper-mobile {
        margin: 0;
        display: flex;
        flex-direction: column;
        padding: 0;
        background-color: #006aab;
    }

    .navbar-uplinks-wrapper-mobile .dropdown-menu {
        background-color: #006aab;
        /* padding-top: 6px; */
    }
}

.public-header-wrapper {
    display: flex;
    align-items: center;
}

    .public-header-wrapper h2 {
        color: white;
        padding-left: .5em;
    }

.proxy-login-wrapper {
    background-color: #e14545;
    color: white;
    height: 50px;
    text-align: center;
    margin-top: -20px;
    padding-top: 15px;
}

/* End of Navigation styling */
.download-icon {
    content: url(/img/download_24dp.svg);
    margin-bottom: -6px;
}

.bookmark-full-icon {
    content: url(/img/bookmark_24dp.svg);
    margin-bottom: -6px;
}

.bookmark-icon {
    content: url(/img/bookmark_border_24dp.svg);
    margin-bottom: -6px;
}

.text-block > p:last-child {
    margin-bottom: 0;
}
