html, body {

    margin: 0;
    padding: 0;
    height: 100%;
    overflow: hidden;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

.main-content-wrapper {
    height: 100%;
}


.cursor-hover {
    cursor: pointer;
}

a, .btn-link {
    color: #006bb7;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.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;
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

/*Removes blue outline when clicking on grid*/
.e-grid .e-focus, .e-grid .e-cell.e-focused {
    outline: none !important;
    box-shadow: none !important;
}
/*------------------------------------------*/

/*Positions loading spinner in the middle of the page*/
.main-content-wrapper .e-spinner-pane {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 9999;
}


/*----Primary button----*/
.usg-btn-primary {
    background-color: #CE0E2D !important;
    color: #fff;
    border: 1px solid black;
    border-radius: 4px;
    height: 35px;
    width: 150px;
}

.usg-btn-disabled {
    background-color: #c0c0c0 !important;
    color: #fff;   
    height: 35px;
    width: 150px;
}
/*----Primary button----*/

/*----Nav menu and top bar custom css----*/
#nav-menu {
    position: fixed;
    top: 50px; /* Height of toolbar */
    bottom: 0;
    z-index: 1000;
}



#nav-menu-toolbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1001;
}

.main-content {
    position: fixed;
    top: 50px; /* Height of toolbar */
    right: 0;
    bottom: 0;
    overflow-y: auto;
    width: 100%;
}

#nav-menu .e-menu-wrapper .e-menu-icon {
    color: unset !important;
}

#nav-menu.e-dock.e-close .e-menu-container ul .e-menu-item {
    width: 50px;
    font-size: 0;
}


#nav-menu.e-dock.e-close .e-menu-item .e-menu-icon {
    font-size: 20px;
    padding: 0;
}

#nav-menu,
#nav-menu .e-menu-container {
    background-color: #C8102E;
    text-decoration: none;
    overflow: hidden;
}

#nav-menu-toolbar .e-toolbar-item .e-tbar-btn {
    background: transparent;
    box-shadow: none;
    color: white;
    border: none;
}

#nav-menu-toolbar .e-toolbar-items {
    background-color: black;
    border-bottom: solid 3px #C8102E;
}

#nav-menu-toolbar .e-btn .e-btn-icon {
    font-size: 25px;
}

.e-menu-container, .e-menu {
    min-width: auto !important;
}


#nav-menu .e-menu-container ul .e-menu-item:first-child {
    margin-top: 50px;
}


#nav-menu .e-menu-container ul .e-menu-item {
    background-color: #dc3545;
    margin: 20px 10px;
    border-radius: .25rem;
}



    #nav-menu .e-menu-container ul .e-menu-item .e-anchor-wrap {
        color: white;
    }

    #nav-menu .e-menu-container ul .e-menu-item.e-selected .e-menu-icon {
        color: white !important;
    }

/*Logout button*/
/*
    Sets the e-menu container as a flex column which allows us to alter the position
    of each menu item. In this case, we are moving the logout button to the bottom left.
    - tbm
*/
#nav-menu .e-menu-container ul.e-menu {
    height: 100vh !important;
    display: flex !important;
    flex-direction: column !important;
}

/*
    Orients the last menu item in the SfMenu component to be within user view and 
    the 2nd to last menu item to be seperate from the top elements, shifting both items
    down to the bottom of the sidebar container.
    - tbm
*/

#nav-menu .e-menu-item:nth-last-child(2) {
    margin-top: auto !important;
}

#nav-menu .e-menu-item:last-child {
    margin-bottom: 70px !important;
}

/*
    Matches the closed menu item icon to the open menu item's position.
    This cancels out the transform style which is auto implemented by:
    #nav-menu.e-sidebar.e-left.e-open 
    - tbm
*/
#nav-menu .e-menu-item:last-child {
    margin-bottom: 70px !important;
}

#nav-menu .e-menu-item:first-child {
    margin-top: 30px !important;
}

#nav-menu .e-menu-item {
    margin-top: 10px;
    margin-bottom: 0px !important;
}
/*----Nav menu and top bar custom css----*/