#COMMS {
	margin:0;
	width:auto;
	height:auto;
	min-width:220px;
	min-height:40px;
	max-height:50%;
	overflow:hidden;
	position:fixed;
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
	left: 50%;
	transform: translateX(-50%);
	background-color:#94C949;
	z-index:999998;
	bottom:0;
	border:3px solid #101527;
	border-bottom:0;
	padding:4px;
	transition:height 1s, width 1s;
}


#COMMS:not(.open) {
	overflow:visible;
	border-top-left-radius:50px;
	border-top-right-radius:50px;	
}





#COMMS:not(.open) .adminMessageNav {
	background-color:transparent
}



#COMMS.open {
	width:800px;
	padding:8px;
	overflow-Y:auto;
	padding-bottom:10%	
}

#COMMS.open .closeCOMMS {
	cursor:pointer;
	position:sticky;
	left:100%;
	top:3px;
	background-color:black;
	color:white;
	border-radius:5px;
	width:25px;
	height:25px;
	display:block;
	z-index:100;
	text-align:center;
	line-height:22px;
	font-weight:bold
}

#COMMS.open .closeCOMMS::before {
	content:"\002015";
}




  #COMMS::-webkit-scrollbar {
    width: 16px;
  }

  #COMMS::-webkit-scrollbar-track {
    background: #ffffff;
  }

  #COMMS::-webkit-scrollbar-thumb {
    background-color: #101527;
    border-radius: 10px;
    border: 3px solid #f0f0f0;
  }















.adminMessageNav {
	position:sticky;
	top:-8px;
	width:100%;
	height:35px;
	display:flex;
	justify-content:center;
	align-items:center;
	z-index:99;
	background-color:#94C949;
}

.adminMessageNav span{
	margin-top:2px;
	height:35px;
	width:35px;
}

.adminMessages {
	width:100%;
	display:flex;
	height:auto
}

#COMMS.open .adminMessages {
	padding-top:10px
}


.readMessages {
	width:100%;
	height:calc(100% - 35px);
}

/*
nav ul li a.showDash:not([data-messages=''])::after {
	content:attr(data-messages);
	position:absolute;
	right:0;
	bottom:0;
	width:20px;
	height:20px;
	border-radius:50%;
	background-color:#c97e49;
	color:#101527;
	display:flex;
	justify-content:center;
	align-items:center;
	font-size:12px;
	font-family:verdana;
	letter-spacing:normal
}
*/

nav ul li a.showDash.active::after {
	color:white
}


.messages:empty {
	display:none
}


.messages {
	width:100%;
	height:100%;
	min-height:350px;
}



.message {
	width:100%;
	font-weight:bold;
	display:flex;
	justify-content:space-between;
	align-items:center;
	height:30px;
	z-index:1;
	user-select:none
}


.message.taskNotComplete {
	background-color:yellow !important
}


.message[data-unreadcount='0'] {
	font-weight:normal !important
}

.adminMessages .message[data-archived="1"]::after {
	position:absolute;
	right:200px;
	top:5px;
	content:"[archived]";
	color:red;
	display:inline-block;
	height:23px;
	line-height:20px;
	padding:0 5px;
	border-radius:5px;
	background-color:white;

}



/*
.message:not(.head) .subject:not([data-unreadcount='0'])::after{
	width:100%;
	content: "(" attr(data-unreadcount) " unread)";
	text-align:right;
}
*/


.messages .message:not(.head):hover,.threads .thread:hover {
	cursor:pointer;
	box-shadow: -1px 0px 6px 1px rgba(0,0,0,0.64);
}


.messages .threads .message:not(.head) {
	color:rgba(1,1,1,.7);
	font-weight:bold !important;
	background-color:#A5AAB7;
}



.messages .threads .message:not(.head):hover {
	cursor:default;
	box-shadow:none;
}




.message.head {
	background-color:gray;
	color:white;
	margin-bottom:5px;
	height:35px;
	position:sticky;
	top:26px;
	z-index:99999;
}

.message > div:first-child {
	padding-left:5px
}

.message > div:last-child {
	padding-right:10px
}

.message > div {
	height:30px;
	display:flex;
	justify-content:flex-start;
	align-items:center;
}

.message .logo,.thread .logo {
	margin-left:10px;
	width:20px;
	height:20px;
	border-radius:50%;
	background-color:#7e49c9;
	background-position:center;
	background-size:80%;
	background-repeat:no-repeat
}


.message .logo.bp,.thread .logo.bp {
	background-image: url(/images/BP.jpg);
}


.message .logo:not(.bp)::before,.thread .logo:not(.bp)::before {
	content: attr(data-logoletter);
	position:absolute;
	left:0;right:0;top:0;bottom:0;
	width:20px;
	height:20px;
	font-weight:bold;
	color:white;
	display:block;
	text-align:center;
	line-height:20px;
	font-size:14px
}





.message .type {
	width:20px;
	height:20px;
	font-size:18px !important;
	margin:0 !important;
	background-color:transparent !important
}

.message .type:hover {
	background-color:transparent !important
}

.threads .message .type::before {
	filter: brightness(0) invert(1) !important;
}



.message .logo {
	margin:0 !important
}


.thread .logo {
	position:absolute;
	left:26px;
	top:3px
}

.message .from {
	width:30%;
	padding-right:10px;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis
}

.message:not(.head) .from::after {
	padding-left:5px;
	padding-top:3px;
	content:attr(data-tcount);
	font-size:12px;
	font-weight:bold;
}

.message .subject {
	width:45%;
	padding-right:10px;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis
}

.message .date {
	width:15%;
	justify-content:flex-end !important;
}

.message.head div {
	cursor:pointer;
	height:30px;
	padding:5px;
	overflow:hidden;
	white-space:nowrap;
	font-size:16px !important
}

.message.head div:active, .message.head div:not(.subject):focus {
	cursor:text;
	background-color:rgba(255,255,255,.5);
	color:black
}

.message.head div:not(.subject):empty:before {
    content: "";
    position: absolute;
    width: 50px;
    height: 35px;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAUCAYAAACXtf2DAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAARJJREFUeNpiZCASsLCzGwApBSi+AMQP/vz8+YCBUgA0OAGI7wPxfyx4PxA7kGuwABCvx2LoeyxiCeRYMB+fS7H4LIEUwwOQNM4n4MvzSD4TINYCmKb9RKhVQAq2BnR5JmyuAlIGUO5EQhZAU9IGKNeeGNc7wIKHnCAl6AMywQdcEkz4FIPCl0gLYEH6gKAFwDC9gGQJsUkvH0pfIDUPvIcWEfjUFiAlaQdScvF7JEsccKhrQDL8PDY1jAQKN1A+gGWeA0B8EMrmB+IAaMGHDBKBQbyAlBxtgKegg+H1aOVTAlE+QC93gJQ/km9gEboR6OIDWHxLmk9I8C2GTxipbQm6TxioDdB9wshAA4DkEwaAAAMAZ/Z2hsdgxhQAAAAASUVORK5CYII=);
    background-repeat: no-repeat;
    background-position: right 5px center;
    transition: opacity 1s;
	filter: invert(55%) sepia(0%) saturate(0%) hue-rotate(154deg) brightness(91%) contrast(95%);
}


.message.head div:empty:after {
    content: "Enter Search";
	color:gray;
    letter-spacing: normal !important;
    width: 100%;
    position: absolute;
    height: 35px;
    top: 5px;
    left: 5px;
    right: 0;
    bottom: 0;
    transition: opacity 1s;
}



.message.head div:not(.subject):not(:focus):empty:before {
    content: "";
    position: absolute;
    width: 150px;
    height: 35px;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    right: 0;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAUCAYAAACXtf2DAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAARJJREFUeNpiZCASsLCzGwApBSi+AMQP/vz8+YCBUgA0OAGI7wPxfyx4PxA7kGuwABCvx2LoeyxiCeRYMB+fS7H4LIEUwwOQNM4n4MvzSD4TINYCmKb9RKhVQAq2BnR5JmyuAlIGUO5EQhZAU9IGKNeeGNc7wIKHnCAl6AMywQdcEkz4FIPCl0gLYEH6gKAFwDC9gGQJsUkvH0pfIDUPvIcWEfjUFiAlaQdScvF7JEsccKhrQDL8PDY1jAQKN1A+gGWeA0B8EMrmB+IAaMGHDBKBQbyAlBxtgKegg+H1aOVTAlE+QC93gJQ/km9gEboR6OIDWHxLmk9I8C2GTxipbQm6TxioDdB9wshAA4DkEwaAAAMAZ/Z2hsdgxhQAAAAASUVORK5CYII=);
    background-repeat: no-repeat;
    background-position: 1px center;
    transition: opacity 1s;
	filter: invert(100%) sepia(4%) saturate(0%) hue-rotate(154deg) brightness(109%) contrast(100%);
	opacity:.5
}


.message.head div:not(:focus):empty:after {
	color:white;
	opacity:.5;
    content: attr(title);
    letter-spacing: normal !important;
    width: 100%;
    position: absolute;
    height: 35px;
    top: 5px;
    left: 30px;
    right: 0;
    bottom: 0;
    transition: opacity 1s;
}



.threads {
	padding-top:30px;
	background-color:white;
	z-index:2;
	position:relative;
	width:100%;
	height:auto;
}

.threads[data-notesfor]:not([data-notesfor=''])::before {
	font-weight:bold;
	content:"NOTE MODE. Entering Notes for: " attr(data-notesfor);
}


.threads .threadStats {
	width:calc(100% - 200px);
	position:absolute;
	top:2px;
	right:0;
	height:25px;
	display:flex;
	justify-content:flex-end;
	align-items:center;
	z-index:9999999
}

.threadStats span {
	cursor:pointer;
	display:block;
	width:25px;
	height:25px;
	background-color:white;
	margin:0 30px;
	border:1px solid #c0c0c0;
	border-radius:50%
}

.threadStats span:last-child {
	margin-right:3px
}


.threadStats span:hover::before {
	color:white;
	background-color:black;
}

.threadStats span::before {
	width:23px;
	height:23px;
	position:absolute;
	top:0;left:0;right:0;bottom:0;
	font-size:20px;
	font-weight:bold;
	border-radius:50%;
	color:gray;
}

.threadStats span::after {
	content:attr(data-num);
	position:absolute;
	top:1px;
	left:27px
}


.threadStats .totalThreads:hover::before {
	background-image:url(/images/dualWhite.png)
}


.threadStats .totalThreads::before {
	content: "";
	background-image: url(/images/dual.png);
	background-size:65%;
	background-position:4px 4px;
	background-repeat:no-repeat;
}

.threadStats .sentThreads::before {
	content: "\01F86D";
	line-height: 100%;
    padding-left: 1px;
}

.threadStats .receivedThreads::before {
	content: "\01F86F";
	line-height: 100%;
    padding-left: 1px;
}

.threadStats .receivedThreads {
	background-color:#e3f1d0 !important
}

.threadStats .myUnreadThreads {
	background-color:#e3f1d0 !important
}

.threadStats .myUnreadThreads:hover::before {
	background-color:red
}

.threadStats .myUnreadThreads::before {
	content: "\01F86F";
	line-height: 100%;
    padding-left: 1px;
	color:red
}

.threadStats .theirUnreadThreads:hover::before {
	background-color:red
}

.threadStats .theirUnreadThreads::before {
	content: "\01F86D";
	line-height: 100%;
    padding-left: 1px;
	color:red
}


.threads::before {
	contents: attr(data-unreadbyme) " unread by me";
	right:250px
}

.threads::after {
	contents: attr(data-unreadbythem) " unread by recipient";
	right:5px
}




.newMessage {
	padding:1%;
	padding-top:35px;
	background-color:white;
	z-index:9;
	position:absolute;
	top:0;left:0;right:0;bottom:0;
	width:100%;
	height:6000px;
	overflow:hidden;
}

.newMessage::before {
	position:absolute;
	top:2%;
	left:1%;
	width:95%;
	height:25px;
	content:"YOUR NEW MESSAGE WAS SENT TO: '" attr(data-to) "'"
}


.newMessage input{
	width:100%;
	height:30px;
	display:block;
}

.newMessage .newMess {
	margin-top:25px;
	width:100%;
	height:calc(100% - 35px);
}

.closeNewMessage {
	cursor:pointer;
	width:25px;
	height:25px;
	position:absolute;
	right:3px;
	top:3px;
	background-color:black;
	color:white;
	line-height:22px;
	text-align:center;
	border-radius:5px;
}

.closeNewMessage::before {
	content:"x"
}



.closeThreads {
	cursor:pointer;
	width:25px;
	height:25px;
	position:absolute;
	left:10px;
	top:0;
	display:flex;
	justify-content:center;
	align-items:center;
	border-radius:50%;
	border:1px solid transparent;
	color:#A5AAB7;
}

.closeThreads:hover {
	border:1px solid black;
	color:black
}

.closeThreads::after {
	content:attr(title);
	position:absolute;
	left:25px;
	top:5px;
	width:100px;
	font-size:11px;
	font-weight:bold;
	text-transform:uppercase
}


.closeThreads::before {
	font-size:20px;
	font-weight:bold;
	content:"\0025C4";
	position:absolute;
	width:25px;
	height:25px;
	left:-1px;
	top:-1px
}

.thread {
	cursor:pointer;
	width:100%;
	border-top:1px solid black;
	border-bottom:1px solid black;
	height:50px;
	padding:3px 15px;
	padding-left:20px;
	font-size:14px;
	margin:5px 0;
	user-select:none
}

.thread::before {
	position:absolute;
	left:11px;
	top:16px;
	font-weight:bold;
	font-size:18px;
	opacity:.4
}

.thread.to {
	background-color:#e3f1d0
}

.thread.fr::before {
	content:"\01F86D"
}


.thread.notes:not(.open) .threadNote:empty::before {
	content:"+NEW NOTE";
	display:inline-block;
	padding:0px 6px;
	background-color:green;
	color:white;
	border-radius:5px
}


.thread.notes:hover .mess::after {
	position:absolute;
	width:135px;
	display:block;
	height:20px;
	line-height:18px;
	text-align:center;
	font-weight:bold;
	opacity:.6;
	text-align:right
}

.thread.notes:not(.open):hover .mess::after {
	content:"Click to open";
	top:0;
	right:0;
}

.thread.notes.open:hover .mess .threadNote:not(.noSelectPointers)::after {
	position:absolute;
	content:"Enter your note";
	top:5px;
	right:5px;
}



.thread.fr:hover .mess::after {
	position:absolute;
	top:0;
	right:0;
	content:"Sent FROM you";
	width:135px;
	display:block;
	height:20px;
	line-height:18px;
	text-align:center;
	font-weight:bold;
	opacity:.6
}


.thread.to::before {
	content:"\01F86F"
}

.thread.to:hover .mess::after {
	position:absolute;
	top:0;
	right:0;
	content:"Sent TO you";
	width:135px;
	display:block;
	height:20px;
	line-height:18px;
	text-align:center;
	font-weight:bold;
	opacity:.6
}






.thread.open {
	height:100%;
	overflow:hidden;
	overflow-Y:auto
}


.thread[data-read='0'] {
	font-weight:bold;
	background-color:#eed8c8;
}

.thread[data-read='0']::before {
	color:red
}

.thread[data-readbyto='0'][data-readbyfrom='0']::before {
	color:red
}



.thread:not([data-read='0']):not([data-read='']) {
	font-weight:normal
}



.thread.open:not([data-read='0']):not([data-read=''])::after {
	content:"This was read on " attr(data-read);
	position:absolute;
	bottom:5px;
	left:5px;
	height:30px;
	width:100%;
}



.thread.open[data-read=''])::after {
	content:"This thread has not been read by who it was sent to.";
}





.thread .whoDate {
	width:100%;
	height:20px;
	margin-bottom:5px;
	padding-left:30px
}

.thread .whoDate span:first-child{
	display:inline-block;
	position:absolute;
	left:53px;
	top:0;
}

.thread .whoDate span:last-child{
	display:inline-block;
	position:absolute;
	right:0;
	top:0;
}

.thread .threadActions {
	display:none;
}

.thread .mess {
	width:100%;
	padding-left:54px;
	padding-right:120px;
	white-space:nowrap;
	height:20px;
	text-overflow:ellipsis;
	overflow:hidden;
}

.thread .mess a, .thread .mess .completeTask{
	display:inline-block;
	margin:0 10px;
	padding:3px 6px;
	background-color:black;
	color:white;
	text-decoration:none;
	font-weight:bold
}

.thread .mess a, .thread .mess .completeTask:hover{
	background-color:gray;
	color:black
}


.thread .mess .completeTask::before{
	content:"Complete Task"
}

.thread .mess .completeTask.completed {
	opacity:.6;
	pointer-events:none
}

.thread .mess .completeTask.completed::before{
	content:"Task Completed"
}


.thread.open {
	box-shadow: -1px 0px 6px 1px rgba(0,0,0,0.64);
	padding-bottom:50px;	
}

.thread.open .threadActions {
	display:flex;
	width:100%;
	padding:2px;
	justify-content:center;
	align-items:center
}


.threadActions dd{
	font-size:12px;
	margin:0 5px;
	padding:5px 10px;
	display:inline-block;
	background-color:black;
	color:white;
	border-radius:5px;
	border:1px solid black
}

.threadActions p:hover,.threadActions.active{
	background-color:white;
	color:black
}

.mess p:first-child {
	margin-top:0;
}

.mess p {
	margin:15px 0;
	padding:0
}


.thread.open .mess {
	white-space:normal;
	height:auto;
	max-height:200px;
	text-overflow:unset;
	overflow:auto;
}

.threads .form {
	padding:2%;
	background-color:#f0f0f0;
	height:350px;
	width:100%;
	z-index:99999
}

.sendReply,.sendNewMessage {
	cursor:pointer;
	background-color:green !important;
	display:inline-block;
	margin:10px;
	left: 50%;
	transform: translateX(-50%);
	color:white;
	padding:5px 10px;
	transition:background-color .3s, color .3s
}

.sendReply:hover,.sendNewMessage:hover {
	background-color:black !important;
}

.sendReply:active,.sendNewMessage:active {
	background-color:gray !important;
	color:black
}


.sendReply::before {
	content:"Send Reply"
}

.sendNewMessage::before {
	content: "Send New Message";
}

.replyFormCloser {
	border-radius:5px;
	position:absolute;
	top:3px;
	right:3px;
	background-color:black;
	color:white;
	width:25px;
	height:25px;
	line-height:23px;
	text-align:center
}

.replyFormCloser::before {
	content:"x"
}

.adminMessageNav .labelsDD {
	display:flex;
	align-items:center;
	background-color:transparent;
	width:auto;
	height:35px;
	z-index:999999;
	text-align:right;
}







.addNewMessage {
	cursor: pointer;
    display: flex;
    font-weight: bold;
    font-size: 23px;
    justify-content: center;
    align-items: center;
    background-color: white;
    border-radius: 50%;
    margin: 0 7px;
    color: black;
	min-width:35px;
	max-width:35px;
	width:35px;
	min-height:35px;
	max-height:35px;
	height:35px;
}


.addNewMessage:hover {
	background-color:#101527;
}

.addNewMessage:hover::before {
	filter: brightness(0) invert(1) !important;
}


.addNewMessage::before {
	content: "\002795";
	font-weight:bold;
	color:black;
	background: linear-gradient(90deg, black, black);
	-webkit-background-clip: text;
	-webkit-box-decoration-break: clone;
	-webkit-text-fill-color: transparent;
	box-decoration-break: clone;
	padding-bottom:2px;
	padding-left:1px;
	font-size:130%
}


.adminMessageNav .labelsDD select:hover,.adminMessageNav .labelsDD select:focus {
	background-color:white
}

#COMMS:not(.open) .adminMessageNav .labelsDD select {
	display:none
}

#COMMS:not(.open) .adminMessageNav .addNewMessage {
	display:none
}



.adminMessageNav .labelsDD select {
	width:100%;
	max-width:400px;
	height:35px;
	appearance:auto !important;
	-webkit-appearance: auto !important;
	background-color:white !important;
	background-image:none !important;
	border:0;
	font-size:16px;
	padding:2px;
	font-weight:bold;
	outline:0;
	margin-left:10px
}


label[for='FORM'] {
	font-weight:bold;
	text-align:left;
	padding:3px
}


.archiveMessage {
	background-image: url(/images/archive.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size:120%;
	border:1px solid transparent !important;
	opacity:.5;
	transition:opacity .1s, transform .1s
}



.archiveMessage:hover {
	opacity:.75
}


.archiveMessage:active {
	opacity:1;
	transform: scale(1.2);
}

.unArchiveMessage::before {
	content: "";
	background-image: url(/images/archive.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size:120%;
	border:1px solid transparent !important;
	transition:opacity .1s, transform .1s;
	opacity:.3
}

.unArchiveMessage::after {
	content: "\0020E0" !important;
	color:red !important;
	position:absolute;
	top:-7px !important; left:12px !important; right:0 !important; bottom:0 !important;
	width:25px;
	height:25px;
	z-index:9999;
	font-weight:bold !important;
	font-size:28px !important
}


.messIcons {
	cursor:pointer;
	width:100%;
	height:100%;
	display:flex;
	font-weight:bold;
	font-size:23px;
	justify-content:center;
	align-items:center;
	border-radius:50%;
	margin:0 4px;
	color:black;
}

.messIcons.email {
	margin-left:0
}

.messIcons.note {
	display:none
}


.messIcons.active,.messIcons:hover {
	background-color:black !important
}


.adminMessageNav .messIcons.active::before,.adminMessageNav .messIcons:hover::before {
	filter: brightness(0) invert(1) !important;
}

.messIcons.email {
	background-color:#678c33;
}

.adminMessageNav .messIcons.email:not([data-messages='0']):not([data-messages=''])::after {
	position:absolute;
	font-weight:bold;
	font-family:verdana;
	top:8px;
	left:50%;
	transform: translate(-50%, 0);
	display:block;
	content:attr(data-messages);
	background-color:#c0c0c0;
	color:black;
	width:18px;
	height:18px;
	font-size:14px;
	text-align:center;
	line-height:18px;
	border-radius:50%;
	overflow:hidden;
	white-space:nowrap;
}

.messIcons.email.black::before {
	filter: invert(0%) sepia(0%) saturate(7500%) hue-rotate(221deg) brightness(85%) contrast(105%) !important;
	font-size:120%;
	padding-bottom:2px
}


.messIcons.email::before {
	content:"\01F4AC \FE0E";
	font-size:125%;
	display:inline-block;
	padding-bottom:1px;
	filter: brightness(0) invert(1) !important;
}


.adminMessageNav .messIcons.notification:not([data-notifications='0']):not([data-notifications=''])::after {
	position:absolute;
	font-weight:bold;
	top:8px;
	left:50%;
	transform: translate(-50%, 0);
	display:block;
	content:attr(data-notifications);
	background-color:#c0c0c0;
	color:black;
	width:18px;
	height:18px;
	font-size:12px;
	text-align:center;
	line-height:18px;
	border-radius:50%
}


.messIcons.notification.black::before {
	filter: invert(0%) sepia(0%) saturate(7500%) hue-rotate(221deg) brightness(85%) contrast(105%) !important;
	font-size:120%;
	padding-bottom:2px
}



.messIcons.notification {
	background-color:#c97e49;
}


.messIcons.notification::before {
	content:"\01F514 \FE0E";
	display:inline-block;
	padding-bottom:6px;
	font-size:120%;
	filter: brightness(0) invert(1) !important;
}





.adminMessageNav .messIcons.task:not([data-tasks='0']):not([data-tasks=''])::after {
	position:absolute;
	font-weight:bold;
	top:8px;
	left:-10px;
	display:block;
	content:attr(data-tasks);
	background-color:maroon;
	color:white;
	width:18px;
	height:18px;
	font-size:9px;
	text-align:center;
	line-height:18px;
	border-radius:50%
}


.messIcons.task {
	display:none;
	background-color:#4994c9
}

.messIcons.task.black::before {
	filter: invert(0%) sepia(100%) saturate(21%) hue-rotate(326deg) brightness(97%) contrast(105%) !important;
	font-size:120%;
}

.messIcons.task.notCompleted.black::before {
	filter: invert(13%) sepia(58%) saturate(7499%) hue-rotate(357deg) brightness(105%) contrast(117%) !important
}


.messIcons.task::before {
	content:"\01F552 \FE0E";
	font-size:120%;
	filter: brightness(0) invert(1) !important;
	padding-bottom:5px;
}


.messIcons.note.black::before {
	filter: invert(0%) sepia(0%) saturate(7500%) hue-rotate(221deg) brightness(85%) contrast(105%) !important;
	font-size:100%;
	padding-bottom:2px
}


.messIcons.note {
	background-color:#7e49c9;
}

.messIcons.note::before {
	content:"\01F4CB \FE0E";
	filter: brightness(0) invert(1) !important;
	font-size:95%;
	padding-bottom:5px;
	padding-left:1px
}

.thread.notes:not(.open) .threadNote:empty {
	background-color: transparent;
}

.thread.notes.open .threadNote {
	width:100%;
	height:150px;
	padding:10px;
	background-color:#c0c0c0
}

.saveNote {
    margin: 10px auto;
    padding: 5px 10px;
    display: block;
	width:125px;
    background-color: green;
    color: white;
    border-radius: 5px;
    border: 1px solid black;
	text-align:center;
	font-size:14px
}

.saveNote::before {
	content: "SAVE NOTE"
}

.show_the_notes {
	cursor:pointer;
	display:block;
	width:45px;
	height:45px;
	margin:0 auto
}

.show_the_notes:hover,.show_the_notes.active {
	background-color:#A5AAB7;
	border-radius:50%;
}

.show_the_notes.active::before {
	opacity:1 !important
}


.show_the_notes::before {
	display:block;
	content:"\01F4CB \FE0E";
	background: linear-gradient(90deg, #7e49c9, #7e49c9);
	-webkit-background-clip: text;
	-webkit-box-decoration-break: clone;
	-webkit-text-fill-color: transparent;
	box-decoration-break: clone;
	font-size:230%;
	position:absolute;
	top: 45%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.show_the_notes[data-numnotes='0']::before {
	opacity:.4;
	transition:opacity .4s
}

.show_the_notes[data-numnotes='0']:hover::before {
	opacity:1
}


.show_the_notes:not([data-numnotes='0'])::after {
	font-size:.6vw;
	font-weight:bold;
	width:auto;
	height:auto;
	display:inline-block;
	color:white;
	content:attr(data-numnotes);
	position:absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index:2
}

.cke_toolgroup .cke_button__sourcedialog {
	display:none
}


.dateDets {
	display:block;
	width:100%;
	font-size:11px;
	font-weight:bold;
	line-height:11px
}

.dateDets::before {
	content:"DONE: " attr(data-date) "\A" attr(data-dur);
	white-space: pre;
}

.dateDets.assigned::before {
	color:red;
	content:"ASSIGNED: " attr(data-date) "\A" attr(data-dur);
	white-space: pre;
}