body, p {
	font-size:0.8rem !important;
}
body, p, h4, h5, h6 {
        font-family: 'Montserrat', sans-serif !important;
		font-weight:500 !important;
					
      }
	  
h1,h2,h3 {
	font-family: 'Karla', sans-serif !important;
	font-weight:700 !important;
}
.form-control, .btn, .notifCount
{
	font-size:0.8rem !important;
}
/* style colors for novum - see brand guidelines for details */
.blacktext
{
	color:#000000 !important;
}
.novumdarkblue
{
	color:#0F2A4B !important;
}
.novumblue
{
	color:#243F89 !important;
}
.novumblueborder
{
	border:4px solid #123EA6;
}
.novumlightblue, .novumlightbluebkgrd,.novumlightbluebkgd
{
	background-color:#ebeffa !important;
}
.novumlightbluefgd, .novumlightblueforegd
{
	color:#ebeffa !important;
}
.novummodblue {
	color:#8ea4e2 !important;
}
.novumturquoise
{
	color:#00A79D !important;
}
.novumturquoiseborder
{
	border:4px solid #00A79D;
}
.novumlightturquoise, .novumlightturquoisebkgd, .novumlightturquoisebkd
{
	background-color: #e6fffd !important;
}
.novumdarkturquoise
{
	background-color:#00665f !important;
}
.novumgreen,.whitebkgd a.novumgreen, .whitebkgd a:visited .novumgreen
{
	color:#8BC441 !important;
}
.novumgreenborder
{
	border:4px solid #8BC441;
}
.novumdarkgreen
{
	color:#73A341 !important;
}
.novumlightgreen,.novumlightgreenbkgd, .novumlightgreenbkgrd,.archived
{
	background-color: #f3f9eb !important;
}
.novumpurple,.whitebkgd a.novumpurple, .whitebkgd a:visited .novumpurple
{
	color:#65318E !important;
}
.novumpurpleborder
{
	border:4px solid #65318E;
}
.novumdarkpurple
{
	color:#572B79 !important;
}
.novumlightpurple,.archivedoff
{
	background-color: #f3ecf8 !important;
}

.novumred
{
	color:#A21C49 !important;
}
.novumdarkred
{
	color:#821438 !important;
}
.novumlightred, .novumlightredbkgrd, .novumlightredbkgd {
	background-color:#fbe9ef !important;
}

.novumdarkbluebkgd, .novumdarkbluebkgrd{
	background-color:#0F2A4B !important;
	color:#ffffff !important;
}
.novumdarkredbkgd,.novumdarkredbkgrd
{
	background-color:#821438 !important;
	color:#ffffff !important;
}
.novumredbkgd,.novumredbkgrd, .bg-danger
{
	background-color:#A21C49 !important;
	color:#ffffff !important;
}
.novumbluebkgd,.novumbluebkgrd, .bg-info
{
	background-color:#243F89 !important;
	color:#ffffff !important;
}
.novumgreenbkgd, .novumgreenbkgrd, .bg-success
{
	background-color:#8BC441 !important;
	color:#ffffff !important;
}
.novumturquoisebkgd, .novumturquoisebkgrd, .bg-primary,.alert-primary
{
	background-color:#00A79D !important;
	color:#ffffff !important;
}
.novumpurplebkgd,.novumpurplebkgrd, .bg-secondary
{
	background-color:#65318E !important;
	color:#ffffff !important;
}
.whitetext {
	color:#ffffff !important;
}
.whitebkgd
{
	background-color:#ffffff;
}
.whitebkgd a, .whitebkgd a:visited
{
	color:#243F89 !important;
}
.whitebkgd a.novumturquoise, .whitebkgd a:visited .novumturquoise{
	color:#00A79D !important;
}
.whitebkgd a.novumred, .whitebkgd a:visited .novumred
{
	color:#A21C49 !important;
}
.whitebkgd a:hover
{
	text-decoration: underline !important;
}
.greybkgd, .greybkd,.novumgreybkgd, .novumgreybkd
{
	    background-color: #ccc !important;
			color:#fff !important;
}
.lightgreybkgd, .lightgreybkd,.novumlightgreybkgd, .novumlightgreybkd
{
	    background-color: #f2f2f2 !important;
}
.xlightgreybkgd, .xlightgreybkd
{
    background-color: #f9f9f9 !important;
}
.lightgreyborder
{
	border:1px solid #f2f2f2 !important;
}
.greyborder
{
	border:1px solid #ccc !important;
}
.novumblueborder-left{
	border-left:4px solid #243F89 !important;
}
.novumturquoiseborder-left{
	border-left:4px solid #00A79D !important;
}
.novumpurpleborder-left{
	border-left:4px solid #65318E !important;
}
.novumgreenborder-left{
	border-left:4px solid #8BC441 !important;
}
.novumredborder-left{
	border-left:4px solid #A21C49 !important;
}
ul.us_menu .us_brand {
	border:none !important;
}
a:hover .nounderline, .nounderline a:hover
{
	text-decoration:none;
}
/* classes for sticky div below the header */
.sticky
{
  position: fixed !important;
  top: 0 !important;
  width: 100% !important;
}

.sticky + .content {
  padding-top: 102px;
}

/* fullcalendar overrides */
.fc-h-event, .fc-v-event {
		background-color:#8BC441;
		border:1px solid #73A341;
	color:#ffffff !important;
}
.fc-daygrid-event-dot {
	background-color:#8BC441;
	border-color:#8BC441 !important;
}
.smalltext
{
	  font-size:small;
}
/* override some default colors */
.btn-info,a.btn-info {
	color:white  !important;
    --bs-btn-color: #fff;
    --bs-btn-bg: #243F89;
    --bs-btn-border-color:#243F89;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #0F2A4B;
    --bs-btn-hover-border-color: #0F2A4B;
    --bs-btn-focus-shadow-rgb: 58,176,195;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #0F2A4B;
    --bs-btn-active-border-color: #0F2A4B;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #0F2A4B;
    --bs-btn-disabled-border-color: #0F2A4B
}
.btn-primary,a.btn-primary {
    --bs-btn-color: #00665f !important;
    --bs-btn-bg: #e6fffd !important;
    --bs-btn-border-color:#e6fffd !important;
    --bs-btn-hover-color:  #00665f !important;
    --bs-btn-hover-bg: #e6fffd !important;
    --bs-btn-hover-border-color: #e6fffd !important;
    --bs-btn-focus-shadow-rgb: 58,176,195;
    --bs-btn-active-color: #00665f;
    --bs-btn-active-bg: #e6fffd !important;
    --bs-btn-active-border-color: #e6fffd !important;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #00665f;
    --bs-btn-disabled-bg: #e6fffd !important;
    --bs-btn-disabled-border-color: #e6fffd !important;
}
.btn-secondary, a.btn-secondary {
	   color:white  !important;
    --bs-btn-color: #fff;
    --bs-btn-bg: #65318E;
    --bs-btn-border-color:#65318E;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #572B79;
    --bs-btn-hover-border-color: #572B79;
    --bs-btn-focus-shadow-rgb: 58,176,195;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #572B79;
    --bs-btn-active-border-color: #572B79;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #572B79;
    --bs-btn-disabled-border-color: #572B79
}
.btn-success, a.btn-success {
	color:white  !important;
    --bs-btn-color: #fff;
    --bs-btn-bg: #8BC441;
    --bs-btn-border-color:#8BC441;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #73A341;
    --bs-btn-hover-border-color: #73A341;
    --bs-btn-focus-shadow-rgb: 58,176,195;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #73A341;
    --bs-btn-active-border-color: #73A341;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #73A341;
    --bs-btn-disabled-border-color: #73A341
}

.btn-danger, a.btn-danger {
	color:white  !important;
    --bs-btn-color: #fff;
    --bs-btn-bg: #A21C49;
    --bs-btn-border-color:#A21C49;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #821438;
    --bs-btn-hover-border-color: #821438;
    --bs-btn-focus-shadow-rgb: 58,176,195;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #821438;
    --bs-btn-active-border-color: #821438;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #821438;
    --bs-btn-disabled-border-color: #821438
}
.btn-warning, a.btn-warning {
	color:white  !important;
    --bs-btn-color: #fff;
    --bs-btn-bg: #65318E;
    --bs-btn-border-color:#65318E;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #572B79;
    --bs-btn-hover-border-color: #572B79;
    --bs-btn-focus-shadow-rgb: 58,176,195;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #65318E;
    --bs-btn-active-border-color: #65318E;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #65318E;
    --bs-btn-disabled-border-color: #65318E
}
.alert-success
{
	background-color: #f3f9eb !important;
	color:#000000;
}
.alert-danger
{
	background-color:#fbe9ef !important;
	color:#000000;
}
.alert-info
{
	background-color: #ebeffa !important;
	color:#000000;
}
/* these for formatting lists, links etc */
ul.no-bullets {
list-style-type: none; /* Remove bullets */
padding: 0; /* Remove padding */
margin: 0; /* Remove margins */
}
/* THis for making sure input box is fully in a table cell */
.containingcell
{
	 position: relative;
}
.containedinput
{
	position: absolute;
  display: block;
  top:0;
  left:0;
  margin: 0;
  height: 100%;
  width: 100%;
  border: none;
  padding: 10px;
  box-sizing: border-box;
}

a.tabs-item:hover, .tabs-item.active
{
	background-color:#ebeffa !important;
	border-radius:0px;
}
a:link, a:visited, a:active, a:hover {
	text-decoration: none;
	color:#243F89;
	cursor: pointer;
}
a:hover {
	text-decoration:none;
	color:#243F89;
}
.disabled{
	background-color:lightgrey !important;
	color: grey !important;
}
/* Quill editor classes we have to use */
.ql-size-large {
	font-size: large;
}
.ql-size-huge {
	font-size: 200%;
}
.ql-size-small {
	font-size:small;
}

/* using the mark.js script */
mark {
  background: yellow;
}

mark.current {
  background: orange;
}
/* for vertical ticker - from https://code-boxx.com/html-css-news-ticker-horizontal-vertical/?utm_content=cmp-true*/
/* (A) UNIFORM ROW HEIGHT */
/* make sure enough height space */
.vwrap, .vholder { height: 80px; }
.vwrap { overflow: hidden; }
 
/* (B) CENTER TEXT */
.vholder {
  display: flex;
  text-align: center;
  justify-content: center;
  align-items: center;
}
 
/* (C) MOVE ITEMS FROM TOP TO BOTTOM */
/* bottom 0 = first item, bottom 300% = fourth item */
.vmove { position: relative; bottom: 0; }
@keyframes tickerv {
  0% { bottom: -100%; }
  100% { bottom: 400%; }
}
.vmove { animation: tickerv linear 20s infinite; }
.vmove:hover { animation-play-state: paused; }

/* datepicker styling - https://stackoverflow.com/questions/67265491/bootstrap-datepicker-custom-styles*/
.datepicker td,th{
    text-align: center;
    padding: 8px 12px;
    font-size: 14px;
}
/* this for striped tables */
.tickertable tr:nth-child(odd) {
 background-color: #5d6062;
 color:white;
 }

.tickertable tr:nth-child(even) {
 background-color: #373a3c;
  color:white;
 }
.tickertable tr.novumredrow:nth-child(odd) {
 background-color: #A21C49;
  color:white;
 }
.tickertable tr.novumredrow:nth-child(even) {
 background-color: #821438;
  color:white;
 }
 
 /* main panel new */
 .mainpanel
 {
	border-radius: 25px;
	background-color:white;
	border-top:8px #00A79D solid ;
	width:95% !important;
 }
 
 .openMessageButton
 {
	background:	#f2f2f2 !important;
 }
 .notifCount, .novumgrey,.novumgrey,.whitebkgd a.novumgrey, .whitebkgd a:visited .novumgrey
 {
		color: grey !important;
 }
 .sidebar li.nav-link.active
 {
	  background-color:#e6fffd !important;
		border-radius:25px;
 }
  .sidebar li.nav-link.active a.nav-link, .sidebar li.nav-link.active a.nav-link:hover
	{
		/*color:#ffffff !important;*/
		text-decoration: none
	}
	.post-it {
 	width:100%;
  position:relative;
  background:#ebeffa;
  overflow:hidden;
  border-radius:0 0 0 30px/45px;
  line-height:1.5em;
  font-size:17px;
  -webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC);

  color:#130d6b;
}


.post-it:before {
 	content:"";
  display:block;
  position:absolute;
  width:20px;
  height:25px;
  background:#ebeffa;
  box-shadow:
    3px -2px 10px rgba(0,0,0,0.2),
    inset 15px -15px 15px rgba(0,0,0,0.3);
  left:0;
  bottom:0;
  z-index:2;
  transform:skewX(25deg);
}

.post-it:after {
 	content:"";
  display:block;
  position:absolute;
  width:75%;
  height:20px; 
  border-top:3px solid #130d6b;
  border-radius: 50% ;
  bottom:0px;
  left:10%;
}

.done {
 	text-decoration:line-through; 
}
.date-box{
	font-size:1.3rem;
	text-align: left;
	font-weight:600;
}
.time-box{
	font-weight:600;
	font-size:2.5rem;
		text-align: center;
}
.cursor-pointer{
  cursor: pointer;
}
.sidebarblock{
	background-image: url('../sidebarbkgd.png');
		background-repeat: no-repeat;
	  background-attachment: fixed;
	background-position: left bottom;

}
.accordion-button:not(.collapsed)
{
	background-color: #e6fffd !important;
}
.accordion-body
{
	background-color: #f6fefd !important;
}
/* THis for the popover - see https://codehim.com/bootstrap/bootstrap-5-popover-with-html-content/ */
.hover-content {
  padding: 10px;
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
  background-color: #fff;
  width: 240px;
}
 
[data-hover-wrapper] {
  transition: opacity 0.3s, transform 0.3s;
}

 
.hover-content > p {
  margin: 0;
}
 
.info {
  position: fixed;
  bottom: 0;
  right: 0;
  background-color: #000;
  padding: 10px 20px;
  color: #fff;
  font-size: 13px;
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active 
{
	border:none !important;
	border-bottom:2px #0F2A4B solid !important;
	font-weight:600;
}
.expenseicon {
  background-image: url('../../../../images/other_icons/expenses.png');
  background-size: cover; /* Adjusts the image to cover the element */
  background-repeat: no-repeat; /* Prevents the image from repeating */
  background-position: center; /* Centers the image */
  width: 20px; /* Set the width of the element */
  height: 20px; /* Set the height of the element */
}
.holidayicon {
  background-image: url('../../../../images/other_icons/holiday.png');
  background-size: cover; /* Adjusts the image to cover the element */
  background-repeat: no-repeat; /* Prevents the image from repeating */
  background-position: center; /* Centers the image */
  width: 20px; /* Set the width of the element */
  height: 20px; /* Set the height of the element */
}
.timesheeticon {
  background-image: url('../../../../images/other_icons/timesheet.png');
  background-size: cover; /* Adjusts the image to cover the element */
  background-repeat: no-repeat; /* Prevents the image from repeating */
  background-position: center; /* Centers the image */
  width: 20px; /* Set the width of the element */
  height: 20px; /* Set the height of the element */
}
.brightpayicon {
  background-image: url('../../../../images/other_icons/brightpaylogo.png');
  background-size: cover; /* Adjusts the image to cover the element */
  background-repeat: no-repeat; /* Prevents the image from repeating */
  background-position: center; /* Centers the image */
  width: 20px; /* Set the width of the element */
  height: 20px; /* Set the height of the element */
}
.mondayicon {
  background-image: url('../../../../images/other_icons/mondaylogo.png');
  background-size: cover; /* Adjusts the image to cover the element */
  background-repeat: no-repeat; /* Prevents the image from repeating */
  background-position: center; /* Centers the image */
  width: 40px; /* Set the width of the element */
  height: 20px; /* Set the height of the element */
}
.currenticon {
  background-image: url('../../../../images/other_icons/currentlogo.png');
  background-size: cover; /* Adjusts the image to cover the element */
  background-repeat: no-repeat; /* Prevents the image from repeating */
  background-position: center; /* Centers the image */
  width: 40px; /* Set the width of the element */
  height: 20px; /* Set the height of the element */
}

/* THis for spreadsheet style tables */
.spreadsheet-table {
      border-collapse: collapse;
      table-layout: fixed;
      width: 100%;
    }

    .spreadsheet-table th,
    .spreadsheet-table td {
      border: 1px solid #ccc;
      padding: 0px 3px 0px 3px;
      text-align: center;
      vertical-align: middle;
      background-color: #fff;
      overflow: hidden;
    }
    .spreadsheet-table th {
      background-color: #f3f3f3;
      font-weight: bold;
      position: sticky;
      top: 0;
      z-index: 2;
    }
    .spreadsheet-table td:focus {
      outline: 2px solid #007bff;
      background-color: #eaf3ff;
    }

		/* Column resize handle */
    .resize-handle {
      position: absolute;
      right: 0;
      top: 0;
      width: 5px;
      height: 100%;
      cursor: col-resize;
      user-select: none;
    }
    th {
      position: relative;
    }