:root {
	--darkblue: #194978; /* Used in places such as the main header, login page background, h1 tags */
	--mediumblue: #2b9ff0; /* Used to compliment the darker blue such as the line underneath selected tabs */
	--pagebg: #eee;
	--darkgrey: #6C757D;
	--superlightgrey: #f5f5f5;
	
	--efiledarkblue: #12435F;
	--efilemediumblue: #1E9FC4;
	
	--efilelightblue: #70c4db;
	
	--whitetext: #fff;
	--darkgreytext: #444;
	--mediumgreytext: #777;
	--lightgreytext: #aaa;
	--redtext: #ff0000;
	
	--whitebg: #fff;
	
	--borderlight: #ddd;
	
	--foldertreeactive: #f5f5f5;
}

html {
    scroll-behavior: smooth;
}

@media (max-width: 767.98px) {
	body {
			background:#eee !important;
	}
}
@media (min-width: 768px) {
	body {
			background:#eee !important;
	}
}

.w-max {
	max-width:1400px !important;
}

.maxw-350 {
	max-width:350px !important;
}

.maxw-400 {
	max-width:400px !important;
}

.maxw-500 {
	max-width:500px !important;
}

.maxw-700 {
	max-width:700px !important;
}

.vh-70 {
	height:70vh;
}

.vh-60 {
	height:60vh;
}

.vh-100 {
	height:100vh;
}

.vh-50 {
	height:50vh;
}

.maxh-vh-50 {
	max-height:50vh;
}

#loadingScreen {
    display:none;
    background:rgba(255, 255, 255, 0.75);
    width:100vw;
    height:100vh;
    position:fixed;
    z-index:2000;
}

.loader {
		border: 8px solid var(--efilemediumblue);
		border-top: 8px solid rgba(0, 0, 0, 0);
		border-radius: 50%;
		width: 60px;
		height: 60px;
		animation: spin 2s linear infinite;
}

@keyframes spin {
		0% { transform: rotate(0deg); }
		100% { transform: rotate(360deg); }
}

.loading-text {
	background:#f2f2f2;
	border-radius:5px;
	color:#f2f2f2;
}

.download-queue {
	background:#092433;
	color:#fff;
	position:fixed;
	z-index:1000;
	bottom:0;
	left:0;
	right:0;
}

#submenu {
	display:none;
	box-shadow:3px 3px 3px rgba(0, 0, 0, 0.2);
}

.submenu-section {
	height:61px;
}

.foxicon {
	background:var(--whitetext);
	width:50px;
	height:50px;
	border-radius:25px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:20px;
}

.usericon {
	background:var(--mediumblue);
	opacity:1.75;
	width:40px;
	height:40px;
	border-radius:20px;
	text-align:center;
	line-height:40px;
	font-size:1.1em;
	margin-top:10px;
	display:block;
	color:var(--darkblue);
	font-weight:bold;
}

.loginbg {
	background:var(--efiledarkblue) !important;
}

.loginbox {
	/*min-height:70vh;*/
	/*padding-top:50px;*/
}

.loginbox h1 {
	font-size:1.5em;
	color:var(--whitetext);
}

.h-light {
	font-weight:200 !important;
}

.logo {
	font-weight:200 !important;
	font-size:2.8em !important;
}

.loginusername {
	border-bottom-left-radius:0px !important;
	border-bottom-right-radius:0px !important;
	height:60px !important;
	border:none !important;
	font-size:1.1em !important
}

.loginpassword {
	border-top-left-radius:0px !important;
	border-top-right-radius:0px !important;
	height:60px !important;
	border:none !important;
	border-top:thin solid var(--borderlight) !important;
	font-size:1.1em !important;
}

.loginemail {
	height:60px !important;
	border:none !important;
	font-size:1.1em !important
}

.btn-login {
	background:var(--efilemediumblue) !important;
	border:thin solid var(--efilemediumblue) !important;
	height:60px !important;
	font-size:1.1em !important;
}

.btn-mediumblue {
	background:var(--efilemediumblue) !important;
	color:var(--whitetext) !important;
}

.btn-darkblue {
	background:var(--efiledarkblue) !important;
	color:var(--whitetext) !important;
}

.btn-progress-bar-overlay {
	width:97%;
	height:100%;
	background:rgba(255, 255, 255, 0.6);
	position:absolute;
	top:0px;
	right:0px;
}

.btn-content-only {
	background:rgba(255, 255, 255, 0) !important;
	color:#aaa !important;
	padding-left:0px !important;
	padding-right:0px !important;
}

.btn-input-search {
    background:#fff !important;
		border-color:#fff !important;
		color:var(--efilemediumblue) !important;
}

.mw-500 {
	max-width:500px !important;
}

.progressbar {
	background:var(--efilemediumblue);
	height:50px;
}

.portal-progress-bar-container {
	width:150px;
	margin-left:auto;
	margin-right:auto;
	height:6px;
	border-radius:2px;
	background:#ddd;
}

.portal-progress-bar {
	width:6px;
	height:6px;
	border-radius:2px;
	background:var(--mediumblue);
}

.header {
	background:var(--efiledarkblue);
	height:80px;
}

.header-mobile {
	height:80px;
}

.docsbody {
	min-height:calc(100vh - 94px);
}

.footer {
	background:var(--efiledarkblue);
}

.footer-glimpse {
	height:94px;
}

.menuitem {
	width:140px;
	height:80px;
	padding-left:25px;
	padding-right:25px;
	padding-top:15px;
	color: var(--whitetext);
	cursor:pointer;
	transition: 0.2s background ease-in-out;
}

.menuitem:hover {
	/*border-bottom:4px solid var(--pagebg);*/
	background:rgba(0, 0, 0, 0.25);
	transition: 0.2s background ease-in-out;
}

.menuitem-on {
	/*border-bottom:4px solid var(--efilemediumblue);*/
	background: var(--efilemediumblue);
}

.menuitem-mobile {
	width:100px !important;
	height:80px;
	padding-left:15px;
	padding-right:15px;
}

.menuitem-mobile-on {
	background:var(--efilemediumblue);
}

.titlebar {
	background:var(--whitebg);
	border-bottom:thin solid var(--borderlight);
}

.calendar {
	background:var(--whitebg);
	border:thin solid var(--borderlight);
	width:100% !important;
}

.mainpage {
	background:var(--whitebg);
	width:100% !important;
	padding:20px;
}

.mainpage-tabbed {
	border-top:none !important;
}

.fullpage {
	width:100% !important;
}

h1 {
	font-size:1.75em !important;
	color:var(--mediumgreytext);
	font-weight:normal !important;
}

.datepicker {
	width:150px !important;
	display:inline-block;
}
.datepicker:read-only {
	background:var(--whitebg) !important;
}

.text-white {
	color: var(--whitetext);
}

.header a {
	color:inherit !important;
}

/*a:hover {
	text-decoration:none !important;
}*/

.text-light {
	color:var(--lightgreytext) !important;
}

.text-error {
	color:var(--redtext) !important;
}

.text-note-header {
	color:var(--mediumgreytext) !important;
}

.text-darkblue {
	color:var(--efiledarkblue) !important;
}

.text-mediumblue {
	color:var(--efilemediumblue) !important;
}

.text-lightblue {
	color:var(--efilelightblue) !important;
}

.text-mediumgrey {
	color:var(--mediumgreytext);
}

.text-lightgrey {
	color:var(--lightgreytext) !important;
}

.text-padlock {
	color:rgba(0, 0, 0, 0.25) !important;
}

.text-help-link {
	color:var(--efiledarkblue) !important;
	text-decoration:underline !important;
}

.text-help-menu-alert {
	color:#ffb066 !important;
}

.text-xxs {
	font-size:0.7em;
}

.text-xs {
	font-size:0.8em;
}

.text-sm {
	font-size:0.9em;
}

.text {
	font-size:1rem;
}

.text-lg {
	font-size:1.1em;
}

.text-xl {
	font-size:1.2em;
}

.text-xxl {
	font-size:1.3em;
}

.bold {
	font-weight:bold;
}

.font-weight-normal {
	font-weight:400 !important;
}

.font-weight-medium {
	font-weight:500 !important;
}

textarea {
	min-height:150px !important;
}

.table-unstriped  > tbody > tr:nth-child(odd) > td,
.table-unstriped > tbody > tr:nth-child(even) > td {
 background-color: white;
}

.weekrow {
	background:var(--darkgrey) !important;
	color:var(--whitetext);
	padding:5px !important;
	min-height: 0px !important;
}

.table-calendar {
	background:var(--whitebg);
	table-layout: fixed;
}
.table-calendar th {
	text-align: center;
}
.table-calendar td {
	height:90px;
}

.calendar-bubble {
	background:var(--bubblelightgreen);
	border-radius: 0px;
	padding:10px;
	margin-top:10px;
	font-size:0.8em;
}

.calendar-bubble-nocompany {
	background:var(--bubblelightergreen);
}

.calendar-bubble-timesheet {
	background:#eee;
}

.calendar-bubble-allday-company {
	border-radius: 0px;
	background:var(--bubblelightblue);
}

.calendar-bubble-allday {
	border-radius: 0px;
	background:var(--bubblegrey);
}

.calendar-bubble-holiday {
	border-radius: 0px;
	background:var(--bubblepink);
}

.foldercontainer:hover {
	background:#F8F9FA;/*rgba(0, 0, 0, 0.05);*/
	cursor:pointer;
}

.autocomplete-popup {
	display:none;
	height:180px;
	overflow-y:auto;
}

.autocomplete-window {
	margin-top:-1px;
	background:#fff;
	display:none;
	max-height:200px;
	overflow-y:auto;
	border:thin solid #CED4DA;
	box-shadow:3px 3px 3px rgba(0, 0, 0, 0.2);
	position:absolute;
}

.bg-foldertree-active {
	background:#F8F9FA !important;
}

.bg-foldertree-final {
	background:var(--efiledarkblue) !important;
}

.bg-foldertree-selected {
	background:#F8F9FA !important;
}

.bg-striped-row {
	background:#f5f5f5;
}

.bg-body {
	background:#eee;
}

.bg-medium {
	background: var(--efilemediumblue) !important;
}

.bg-mediumgrey {
	background:#999;
}

.bg-mediumblue {
	background:var(--efilemediumblue) !important;
}

.bg-darkgrey {
	background:var(--darkgrey);
}

.bg-darkblue {
	background: var(--efiledarkblue) !important;
}

.bg-pagination-highlight {
	background:#ffd7b3 !important;
}

.bg-tip {
	background:#ffffcc;
}

.bg-faux-document {
	height:60vh;
}

.bg-light-hover:hover {
	background:#F8F9FA !important;
}

.bg-white-opacity-20 {
	background:rgba(255, 255, 255, 0.2);
}

.opacity-75 {
	opacity: 0.75;
}

.opacity-50 {
	opacity: 0.50;
}

.opacity-25 {
	opacity: 0.25;
}

.opacity-5 {
	opacity:0.05;
}

.opacity-0 {
	opacity: 0;
}

.disabled {
	color:#ccc;
}

.hidden {
	display:none !important;
}

.w-45 {
	width:45% !important;
}

.w-300 {
	max-width:300px !important;
}

.w-500 {
	max-width:500px !important;
}

.w-700 {
	max-width:700px !important;
}

.w-900 {
	max-width:900px !important;
}

.cursor-pointer {
	cursor: pointer !important;
}

.border-input {
	border:thin solid #CED4DA !important;
}

.border-input-left {
	border-left:thin solid #CED4DA;
}

.border-input-top {
	border-top:thin solid #CED4DA;
}

.border-input-right {
	border-right:thin solid #CED4DA;
}

.border-input-bottom {
	border-bottom:thin solid #CED4DA;
}

.border-input-left-0 {
	border-left:none !important;
}

.border-input-top-0 {
	border-top:none !important;
}

.border-input-right-0 {
	border-right:none !important;
}

.border-input-bottom-0 {
	border-bottom:none !important;
}

.document-thumbnail {
	margin-left:auto;
	margin-right: auto;
	display:inline-block;
	padding:10px;
	overflow:hidden;
	text-align: center;
	border:thin solid #ddd;
	box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.05);
}

.document-thumbnail:hover {
	background:#F8F9FA;
}

.document-thumbnail-img {
	width:180px;
	height:254px;
}

.document-thumbnail-preview-img {
	width:150px !important;
	height:212px !important;
}

.document-thumbnail-preview-img img {
	max-width:98px !important;
	max-width:148px !important;
}

.thumbnail {
	box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.15);
}

.highlight-in-context {
	background:#ffd7b3;
	padding:0px;
}

.highlight-doc-row {
	background:#ffe5cc !important;
}

.sorting {
	background:#f5f5f5;
}

.highlight-table-row:hover {
	background:#ffe5cc !important;
}

.active-table-row {
	background:#cceeff !important;
}

.checkbox-table-column {
	width:24px !important;
}

.text-overflow-ellipsis {
	white-space:nowrap !important;
	overflow:hidden !important;
	text-overflow:ellipsis !important;
}

.card-columns {
  @include media-breakpoint-only(lg) {
    column-count: 2;
  }
  @include media-breakpoint-only(xl) {
    column-count: 3;
  }
}

.search-cabinet {
	background:#fff;
}

.search-cabinet:hover {
	background:#F8F9FA;
	cursor:pointer;
}

.dropdown-menu {
	background:#fff;
	min-width:300px !important;
	border-radius:0px !important;
	box-shadow:3px 3px 3px rgba(0, 0, 0, 0.2);
	z-index:500;
}

.modal-header {
	background:#F8F9FA !important;
}

.modal-title {
	color:var(--efiledarkblue) !important;
}

input[type=text], input[type=password], input[type=date], select, button {
	border-radius:0px !important;
}

input[type=date] {
	width:170px !important;
}

.tab-item {
	background:#F8F9FA;
	border-top:4px solid #F8F9FA;
	color:var(--efiledarkblue);
}

.tab-item:hover {
	background:#fff;
	border-top:4px solid #ffa34d;
	cursor:pointer;
}

.tab-item-active {
	background:#fff;
	border-top:4px solid var(--efilemediumblue);
	color:var(--efiledarkblue);
	font-weight:500;
}

.btn {
	border-radius:0px !important;
}

.btn-action {
	color:var(--efiledarkblue) !important;
	padding-left:0px !important;
	padding-right:0px !important;
}

.btn-action i {
	color:var(--efilemediumblue) !important;
}

.btn-action:hover {
	text-decoration:underline !important;
}

.submenu-mb {
	margin-bottom:61px !important;
}

.userguide-image {
	max-width:100%;
	margin-left:auto;
	margin-right:auto;
}

.userguide-image-small {
	width:100%;
	max-width:400px;
	margin-left:auto;
	margin-right:auto;
}

.userguide-image-point {
	position:absolute;
	background:rgba(190, 0, 0, 0.8);
	color:white;
	font-size:0.9em;
	font-weight:500;
	padding:2px 7px 2px 7px;
	cursor:pointer;
}

.userguide-image-point:hover {
	background:rgba(190, 0, 0, 1);
	border:2px solid rgba(190, 0, 0, 1);
	margin-top:-2px;
	margin-left:-2px;
}

.userguide-image-point-active {
	background:#444;
	border:4px solid #444;
	margin-top:-4px;
	margin-left:-4px;
}

/* Any breakpoint properties here */

/* Bootstrap xs is default so no properties to add here */
@media (min-width: 1px) {
	.border-top-xs {
		border-top:thin solid #DEE2E6;
	}
	.border-top-xs-0 {
		border-top:none;
	}
}

/* Bootstrap sm */
@media (min-width: 576px) {
	.border-top-sm {
		border-top:thin solid #DEE2E6;
	}
	.border-top-sm-0 {
		border-top:none;
	}
}

/* Bootstrap md */
@media (min-width: 768px) {
	.border-top-md {
		border-top:thin solid #DEE2E6;
	}
	.border-top-md-0 {
		border-top:none;
	}
}

/* Bootstrap lg */
@media (min-width: 992px) {
	.border-top-lg {
		border-top:thin solid #DEE2E6;
	}
	.border-top-lg-0 {
		border-top:none;
	}
	.submenu-mb-lg-0 {
		margin-bottom:0px !important;
	}
}

/* Bootstrap xl */
@media (min-width: 1200px) {
	.border-top-xl {
		border-top:thin solid #DEE2E6;
	}
	.border-top-xl-0 {
		border-top:none;
	}
}

::-webkit-input-placeholder { /* WebKit browsers */
    text-transform: none;
	color:#ccc !important;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    text-transform: none;
	color:#ccc !important;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    text-transform: none;
	color:#ccc !important;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    text-transform: none;
	color:#ccc !important;
}
::placeholder { /* Recent browsers */
    text-transform: none;
}

/* Custom scrollbar for section-menu-items */
    /* Width */
    .document-notes::-webkit-scrollbar {
        width: 6px;
    }
    /* Track */
    .document-notes::-webkit-scrollbar-track {
        background: rgba(0, 0, 0, 0.1);
    }
    /* Handle */
    .document-notes::-webkit-scrollbar-thumb {
        background: var(--efilelightblue);
        border-radius:10px;
    }
    /* Handle on hover */
    .document-notes::-webkit-scrollbar-thumb:hover {
        background: var(--efilemediumblue);
    }