		body{
			font-family:Titillium,sans-serif;
		}
		*{
			box-sizing: border-box;
		 	scrollbar-width: thin !important;
		 	scrollbar-color: #b5b4b4 #edebec!important;
		}

		/* Works on Chrome, Edge, and Safari */
		*::-webkit-scrollbar {
		  width:10px !important;
		}	

		*::-webkit-scrollbar-track{
		  background: #edebec !important;
		}

		*::-webkit-scrollbar-thumb{
			background-color: #b5b4b4 !important;
			border-radius: 10px !important;
			border: 3px solid #edebec!important;
		}
		.colTimeIn,.colTimeOut{
			max-width:3em !important;
		}
		.spinner-grow{
			height:1em !important;
			width:1em !important;
		}
		.hrDate{
			margin-top:-1.5em !important;
		}
		.fromDate,.fromDateAttendance,.fromDateAttend{
			cursor:none !important;
			padding:0em !important;
			margin:0em !important;
			border:none !important;
		}
		.fromDate,.fromDateAttendance,.fromDateAttend:active{
			padding:0em !important;
			margin:0em !important;
			border:none !important;
		}
		.fromDate,.fromDateAttendance,.fromDateAttend:visited{
			padding:0em !important;
			margin:0em !important;
			border:none !important;
		}
		.pick-arw{
			background-color:#ccc !important;
		}
		.dataByDateRange{
			z-index:9999 !important;
		}
		#div-datepicker{
			z-index:9999 !important;
		}
		.repByDate{
			z-index:99 !important;
		}
		.m-pesa{
			width:20% !important;
		}
		.top-up{
			margin-top:-0.4em !important;
			cursor:pointer !important;
			border:3px double #ccc !important;
		}
		.repByDate{
			cursor:pointer !important;
			margin-left:30% !important;
			border:3px double #ccc !important;
		}
		.top-serch{
			cursor:pointer !important;
			border:3px double #ccc !important;
		}
		.hr-grey{
			background-color:#ccc !important;
		}
		.eyeShowHide{
			color:grey !important;
		}
		.btn-view-code{
			margin-top:-2.4rem !important;
		}
		.msg-Merger{
			min-width:20rem !important;
		}
		.termsModal{
			cursor:pointer !important;
		}
		.brand-foot{
			cursor:pointer !important;
		}
		.dataSelectOut{
		   -webkit-user-select: none; 
		   -webkit-touch-callout: none;
		   -moz-user-select: none; 
		   -ms-user-select: none; 
		   user-select: none;  
		}
		.label-autoNotes{
			cursor:pointer !important;
			padding-top:0.1rem !important;
		}
		#confimDelContsAll,#confimDelContsAllSelected,#confimDelContsDelAll{
			border:1px solid red !important;
		}
		#confimDelContsAll:checked,#confimDelContsAllSelected:checked,#confimDelContsDelAll:checked{
			background-color:red !important;
		}
		.label-confimDelContsAll,.label-confimDelContsAllSelected,.label-confimDelContsDelAll{
			cursor:pointer !important;
			padding-top:0.5px !important;
		}
		.autoNotesCont,.label-autoNotesCont,.label-autoNotesImp,.label-autoNotesSend,.label-autoNotes{
			cursor:pointer !important;
			padding-top:0.2rem !important;
		}
		.autoNotesSend{
			padding-top:-0.1rem !important;
		}
		#more{
			margin-top:6px !important;
		}
		.btn-drop-queue{
			margin-left:-0.4em !important;
		}
		.footLinks{
			margin-top:-1.8rem !important;
		}
		.foot-logo{
			max-width:2rem !important;
		}
		.top{
			margin-top:-2.5rem !important;
			z-index:99 !important;
		}
		#termsModal,#modalDeleteContact,#contactsModalUpdate,#usersModalUpdate,#deleteUserModal,#modalDeleteAllLogs,#singleSmsModalContacts,#btn-back-to-top{
			z-index:9999 !important;
		}
		.dropdown-menu{
			min-width:13rem !important;
		}
		.customStyle{
			clip-path: polygon(0% 0%, 100% 0%, 100% 75%, 16% 76%, 17% 100%, 9% 76%, 0 75%) !important;
		}
		.bylist{
			margin-left:2rem !important;
			list-style:none !important;
		}
		.date-Group{
			margin-top:-1.2rem !important;
			margin-left:-2.5rem !important;
			padding-bottom:0.72rem !important;
		}
		.time-Cont{
			margin-left:-10rem !important;
		}
		.dt-buttons{
			float:left !important;
			margin-top:0.3em !important;
			text-align:center !important;	
		}
		.msg-con{
			margin-left:-2.2rem !important;
		}
		.form-check-input{
			cursor:pointer !important;
			padding:9px !important;
			border:solid 1px #8b65d1 !important;
		}
		.form-check-input:checked{
			background-color:#8b65d1 !important;
		}

		#purposesCust{
			width: 100% !important;
		}
		.con-foot{
			margin-top:-0.6rem !important;
		}
		.offinput{
			border:none !important;
		}
		.cust-sty{
			border-radius:0.5rem !important;
		}
		.copyright{
			font-family:arial !important;
		}
		.logo{
			max-width:5.5rem !important;
			position:absolute !important;
			margin-top:-4.3rem !important;
			margin-left:-2.5rem !important;
		}
		.logo-span{
			margin-left:2.5rem !important;
		}
		.logo-head{
			max-width:3rem !important;
			position:absolute !important;
			margin-top:-0.5rem !important;
			margin-left:-0.5rem !important;
		}
		#tmpMsg{
			display:none !important;
		}
		.cards{
			height:5rem !important;
			cursor:pointer;
			background-image:url("../files/back.png");
			background-size:cover;
			background-position:center;
			border:solid 1px #ccc !important;
			border-radius:0rem !important;
			padding-bottom:0em;
			box-shadow:4px 10px 3px rgba(0,0,0,0.1) !important;
			/*transition:0.5s;*/
		}
		.close-Cust,.btn-close{
			cursor:pointer !important;
		}
		.cards:hover{
			border:none !important;
			/*transform:scale(1.1);*/
			z-index:2;
			box-shadow:none !important;
			background:transparent !important;
		}
		.sach{
			max-width:21rem !important;
			background-color:transparent !important;
			cursor:pointer;
		}
		.card-phone{
			height:6.5rem !important;
		}
		#features,#example,#privacy{
			max-height:12rem !important;
			overflow-y:scroll;
		}
		.phone-link{
			position: absolute !important;
			margin-top:-0.2rem !important;
		}
		.li{
			list-style:none !important;
		}
		.firsts{
			border-left:solid 1px #cccccc;
		}
		.form-attend{
			margin-left:-8rem !important;
			margin-top:0em !important;
			margin-bottom:0em !important;
			padding-top:0em !important;
			padding-bottom:0em !important;
		}
		.offcanvas-header-attend{
			max-height:1.3rem !important;
		}
		#offcanvasAttendance,#offcanvasPayroll,#offcanvasRecieptBook{
			min-height:100% !important;
			min-width:100% !important;
		}
		.offcanvas{
			min-height:24rem !important;
			max-height:24rem !important;
		}
		.last-bg{
			margin-left:-2rem !important;
		}
		.fott{
			margin-top:-1em !important;
		}
		.main{
			min-width:100% !important;
			max-width:100% !important;
		}
		#dataByDateRange,#attendScheduleMultiTable,#attendGroupMultiTable,#allEntriesEachAttendant,#allEntriesEach,#tableTodayQuery,#tableYestQuery,#tableAllQuery,#tableGroupEntries,#tableContsRepId,#tableContsRepIdLog,#tableMain,#guestProfile,#sentToIndisConts,#table,#tableCust,#tableContacts,#msgsTable,#sentToIndis,#tableSentLogs,#tableSentContacts,#usersTableD{
			width:100% !important;
		}
		.first{
			max-height:35rem !important;
		}
		.modalSettings{
			margin-top:-1em;
		}
		#table{
			margin-top:-1em;
		}

		.g-list{
			overflow-x:auto;
			max-width:100% !important;
			border:none;
		}
		#orgID,.label-orgID{
			display:none;
		}
		.txt-span{
			font-size:1.2rem;
		}
		body{
			background-color:transparent;
			font-family: 'Titillium Web', sans-serif;
		}
		.login-pane{
			margin-top:15%;
			border-radius:0.8rem !important;
			box-shadow:5px 5px 5px rgba(0,0,0,0.2), -3px -3px 4px rgba(0,0,0,0.2) !important;
		}
		.about{
			padding-right:1.2rem !important;
			padding-left:1.2rem !important;

			padding-top:0.7rem !important;
			padding-bottom:0.7rem !important;

			clip-path: polygon(52% 100%, 0 0, 100% 0);
		}
		.alert{
			border:none !important;
		}
		.login-btn{
			margin-top:-1em;
		}
		.login-date{
			margin-top:-3rem;
		}
		a{
			color:#000;
			text-decoration:none;
		}
		a:hover{
			color:#000;
			text-decoration:none;
		}
		.selectorsProfile{
			margin-top:-0.6em;
		}
		.head{
			border:solid 1px #b9b9bb;
		}
		.label-logoUpload{
			border-radius:3rem;
		}
		.dash-toggler-reset-2{
			margin-right:1.5rem !important;
		}
		.h3{
			color:#777 !important;
		}
		.icon-dash{
			color:#000;
			font-size:1.1em;
			float:right;
			margin-top:-2em;
			margin-right:0em;
		}

		.dash-text{
			position: absolute;
			margin-top:-2em;
		}

		#btn-attend,#btn-login,#btn-resetAdmin{
			box-shadow:4px 3px 5px rgba(0,0,0,0.3), -3px -3px 4px rgba(0,0,0,0.3) !important;
		}
		.span-dash{
			font-size:0.7em;
		}
		.time-span{
			font-size:1.1em;
		}
		.time-dl{
			font-size:1.07em;
		}
		.card{
			border:none;
		}
		.card-footer{
			border-radius:50px;
			margin-bottom:3px;
			cursor:pointer;
			transition:0.5s;
		}
		.card-footer:hover,.header-search:hover{
			transform:scale(1.05);
			box-shadow:2px 3px 2px rgba(0,0,0,0.2), -2px -2px 2px rgba(0,0,0,0.2) !important;
			background-color:#ffffff !important;
		}
		.header-search{
			width:24rem;
			transition:0.5s;
			box-shadow:2px 3px 2px rgba(0,0,0,0.1), -2px -2px 2px rgba(0,0,0,0.1) !important;
		}
		.bi-search{
			cursor:pointer;
			margin-left:1rem;
			font-size:1.1rem;
			margin-top:-1.8rem;
		}
		.table-system{
			overflow-x:;
		}
		.logo-settings{
			max-width:35%;
			border: solid 5px #cbc8d0;
			cursor:pointer;
			transition:0.5s;
			box-shadow:4px 3px 5px rgba(0,0,0,0.3), -3px -3px 4px rgba(0,0,0,0.2) !important;
		}
		.logo-settings:hover{
			transform:scale(1.1);
			box-shadow:2px 3px 2px rgba(0,0,0,0.2), -2px -2px 2px rgba(0,0,0,0.2) !important;
			border:none;
		}

		.btn-action {
			border:none !important;
			padding-left:1 !important;
			padding-right:1 !important;
			margin:0 !important;
		}
		tr{
			transition:all .2s ease-in;
			cursor:pointer;
		}
		.rounded-c{
			border-radius:1rem;
		}
		tr:hover{
			border-bottom:;
			background-color:#efefef;	
			transform:scale(1.01);
			box-shadow:2px 2px 2px rgba(0,0,0,0.2), -1px -1px 2px rgba(0,0,0,0.5);
		}
		#table_filter input{
			border:none;
			border:solid 1px silver;
			border-radius:10rem !important;
		}
		.form-check-input{
			border:solid 1px #000;
		}
		.table_wrapper{
			margin-bottom:0;
		}
		.nav-link{
			color:#000;
		}
		.table-responsive{
			border:solid 1px #cbc8d0;
			;
		}
		.clock-dash{
			color:#777 !important;
			margin-top:-2rem !important;
			margin-left:2.4rem !important;
		}
		#switchUser{
			border:solid 1px #888 !important;
		}
		.form-check-label{
			cursor: pointer !important;
		}
		.flexCheckDefaultNotes,.checkD{
			border:solid 1px #888 !important;
			cursor: pointer !important;
		}
		.bag-time{
			font-size:0.6rem !important;
			margin-top:-0.5rem !important;
			margin-left:-3.5rem !important;
		}
		.count{
			margin-top:-0.3rem;
		}
		.modal-content,.table-responsive{
			border-radius:1rem !important;
		}
		.form-select{
			height:3rem !important;
		}
		.form-control,.form-check-input,.form-select{
			border-radius:3rem !important;
			max-height:2.8rem !important;
		}
		.textarea{
			min-height:8rem !important;
			border-radius:2rem !important;
			max-height:13.6rem !important;
		}
		.label{
			margin-top:-0.4rem !important;
		}
		.buttons-excel{
			padding-top:0.1rem !important;
			padding-bottom:0.1rem !important;
			padding-left:0.6rem !important;
			padding-right:0.6rem !important;
			border-radius:10rem !important;
			border:none !important;
			background-color:#13b955 !important;
			color:#fff !important;
		}
		.unlock{
			padding-top:0.2px !important;
		}
		.buttons-pdf{
			padding-top:0.1rem !important;
			padding-bottom:0.1rem !important;
			padding-left:0.6rem !important;
			padding-right:0.6rem !important;
			border-radius:10rem !important;
			border:0 !important;
			background-color:#fc3939 !important;
			color:#fff !important;
		}
		.buttons-print{
			padding-top:0.1rem !important;
			padding-bottom:0.1rem !important;
			padding-left:0.6rem !important;
			padding-right:0.6rem !important;
			border-radius:10rem !important;
			border:0 !important;
			background-color:#009cdc !important;
			color:#fff !important;
		}
		.buttons-copy{
			padding-top:0.1rem !important;
			padding-bottom:0.1rem !important;
			padding-left:0.6rem !important;
			padding-right:0.6rem !important;
			border-radius:10rem !important;
			border:0 !important;
			background-color:#d55810 !important;
			color:#fff !important;
		}
		.buttons-collection,.buttons-colvis{
			padding-top:0.1rem !important;
			padding-bottom:0.1rem !important;
			padding-left:0.6rem !important;
			padding-right:0.6rem !important;
			border-radius:10rem !important;
			border:0 !important;
			background-color:#8b65d1 !important;
			color:#fff !important;
		}
		.dt-button-collection{
			/*margin-left:-3rem !important;*/
			background-color:#ccc !important;
			border:0 !important;
			border-radius:1em !important;
		}
		.buttons-columnVisibility{
			padding-top:0.1rem !important;
			padding-bottom:0.1rem !important;
			padding-left:0.6rem !important;
			padding-right:0.6rem !important;
			border-radius:10rem !important;
			border:0 !important;
			background-color:#8b65d1 !important;
			text-align:left !important;
			color:#000 !important;
		}
		.buttons-columnVisibility:hover{
			background-color:#8b65d1 !important;
			color:#fff !important;
		}
		.dt-down-arrow{
			color:#fff !important;
			font-size:0.5rem !important;
		}
		.select{
			z-index:1;
			height:2rem;
		}
		.dropdown-menu{
			border:solid 1px silver;
		}