.hpy-rtl {
	direction: rtl;
}
.hpy-rtl .aside i.menu-arrow {
    transform: rotate(90deg);
}
span[data-sub-heder-title] {
	text-transform: capitalize;
}
.hpy-hide {
	display: none !important;
}
.hpy-pointer {
	cursor: pointer !important;
}
input[readonly] {
    background-color: #ebeded !important;
}

.dataTable td {
    padding: 0.5rem !important;
}
.table tr.odd {
    background-color: #eef0f847;
}

.timeline.timeline-1 .timeline-sep {
    left: 106px;
}

.timeline.timeline-1 .timeline-item .timeline-label {
    flex: 0 0 93px;
}

.hpy-ltr .hpy-notification-icon {
	position: absolute;
    right: 0px;
}
.hpy-rtl .hpy-notification-icon {
	position: absolute;
    right: 102px;
}

.hpy-aside-logo {
	max-height: 300px;
	width: 50%;
}

.toast {
    margin-top: 125px !important;
}

.toast-info {
    background-color: #3699FF !important;
}

.hpy-comment-content {
	line-height: 2;
}

.hpy-img-post-size {
	width:40px; 
	height: 40px;
}

.hpy-profile-bg {
	background-size: cover; 
	background-repeat: no-repeat;
	/* background-position: center; */
	background-position-x: right;
	background-position-y: center;
    background-color: #eef0f8;
}

.hpy-img-right-nav-size {
	width: 45px; 
	height: 45px;
}

.hpy-replies-con .hpy-img-post-size {
	width:30px; 
	height: 30px;
}

.hpy-feeds-comments-child-con {
	display: none;
}

.hpy-no-admin-nav #kt_aside, 
.hpy-no-admin-nav #kt_aside_mobile_toggle {
	display: none !important;
}
.hpy-no-admin-nav.aside-enabled .header.header-fixed {
	left: 0 !important;
	right: 0 !important;
	box-shadow: 0px 0px 10px black !important;
}

@media (min-width: 992px) {
	.aside-fixed .aside {
	    display: none !important;
	}
	
	.hpy-no-admin-nav #kt_wrapper,
	.hpy-body-user-page #kt_wrapper {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	.header-fixed.subheader-fixed.subheader-enabled .wrapper {
	    padding-top: 65px !important;
	}
	.hpy-body-user-page.aside-enabled .header.header-fixed {
		left: 0 !important;
		right: 0 !important;
		box-shadow: 0px 0px 10px black !important;
	}
}

#kt_header_mobile {
	background-color: #ffffff !important;
    box-shadow: 0px 0px 10px black !important;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
 -webkit-appearance: none;
  margin: 0; 
}

/* Mozilla */
input[type=number] {
    -moz-appearance:textfield; 
}
/* these 2 lines are used to hide the arrows associated with inputs of type 'number' */

/* loader */
.hpy-mask-con {
	display: none;
	position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    transition: all .3s ease-in-out;
    z-index: 9999;
}
.hpy-mask-con:before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 48px;
    height: 48px;
    content: " ";
    display: block;
    background: 0;
    animation: hpy-mask-con-default .5s ease-in-out infinite;
    border-radius: 50%;
    box-sizing: border-box;
    border: 2px solid #fff;
    border-color: currentColor transparent currentColor transparent;
}
@-moz-keyframes hpy-mask-con-default {
    0% {transform: rotate(0)}
    100% {transform: rotate(360deg)}
}
@-webkit-keyframes hpy-mask-con-default {
    0% {transform: rotate(0)}
    100% {transform: rotate(360deg)}
}
@-o-keyframes hpy-mask-con-default {
    0% {transform: rotate(0)}
    100% {transform: rotate(360deg)}
}
@keyframes hpy-mask-con-default {
    0% {transform: rotate(0)}
    100% {transform: rotate(360deg)}
}

.hpy-user-profile-header {
	position: relative;
    padding-top: 7px;
}
.hpy-ltr .hpy-user-profile-header {
	padding-left: 60px;
}
.hpy-rtl .hpy-user-profile-header {
	padding-right: 60px;
}
.hpy-profile-con {
	position: absolute;
	top: 3px;
	width: 50px;
	height: 50px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	/* border-radius: 50%; */
	background-color: #eef0f8;
}
.hpy-ltr .hpy-profile-con {
	left: 0px;
}
.hpy-rtl .hpy-profile-con {
	right: 0px;
}

/**  Admin Page **/
.image-input-wrapper {
	background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    background-color: white;
}

.hpy-rtl .hpy-input-operator .dropdown {
    border-radius: 0 0.42rem 0.42rem 0 !important;
}
.hpy-ltr .hpy-input-operator .dropdown {
    border-radius: 0.42rem 0 0 0.42rem !important;
}

/**  User Page **/

.hpy-user-nav-menu .list-group-item.active {
	background-color: #EBEDF3
}
.hpy-user-nav-menu .list-group-item.active .item-title {
	color: #5E6278;
}
.hpy-user-nav-menu .list-group-item:hover .menu-icon,
.hpy-user-nav-menu .list-group-item.active .menu-icon {
	color: #3699FF;
}

.hpy-mirror {
	transform: rotateY(180deg);	
}

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

.hpy-feed-post-info {
	position: absolute;
	top: 15px;
	width: calc(100% - 10px);
}
.hpy-feed-post-info div {
	width: 100%;
	white-space: nowrap;
}
.hpy-ltr .hpy-feed-post-info {
	right: 10px;
}
.hpy-ltr .hpy-feed-post-info div {
	text-align: right;
}
.hpy-rtl .hpy-feed-post-info {
	left: 10px;
}
.hpy-rtl .hpy-feed-post-info div {
	text-align: left;
}

.hpy-rtl .hpy-dashboard-totals {
	margin-right: 30px;
}

.hpy-feed-like-comment-con {
	position: absolute;
    bottom: 1px;
    width: calc(100% - 60px);
}
.hpy-ltr .hpy-feed-like-comment-con {
	left: 30px;
}
.hpy-rtl .hpy-feed-like-comment-con {
	right: 30px;
}
.hpy-feeds-assigned-by {
    position: absolute;
    font-size: 90%;
}
.hpy-ltr .hpy-feeds-assigned-by {
	right: 0px;
}
.hpy-rtl .hpy-feeds-assigned-by {
	left: 0px;
}

.hpy-liked {
	color: #FFA800 !important;
}

.hpy-div-editable  {
	min-height:40px;
	background-color: #EAEDED;
	padding-right: 6rem;
	outline: none;
}
.hpy-div-editable:empty:before {
	opacity: 0.5; 
}

.hpy-ltr .hpy-img-cmnt-hint {
	position: absolute;
    bottom: -2px;
    right: -30px;
}

.hpy-rtl .hpy-img-cmnt-hint {
	position: absolute;
    bottom: -2px;
    left: -30px;
}


.hpy-comment-img-btn {
	position: absolute;
	top: 12px;
}
.hpy-ltr .hpy-comment-img-btn {
	right:15px;
}
.hpy-rtl .hpy-comment-img-btn {
	left:15px;
}

.hpy-comment-emoji-btn {
	position: absolute;
	top: 12px;
}
.hpy-ltr .hpy-comment-emoji-btn {
	right:45px;
}
.hpy-rtl .hpy-comment-emoji-btn {
	left:45px;
}

.hpy-ltr .hpy-edit-comment-content-con .hpy-comment-emoji-btn {
    right: 10px;
}

.hpy-rtl .hpy-edit-comment-content-con .hpy-comment-emoji-btn {
    left: 10px;
}

.hpy-comment-parent {
	width: calc(100% - 4rem);
}

.hpy-comment-reply, .hpy-comment-show-replies {
	font-weight: bold;
}
.hpy-comment-reply, .hpy-comment-show-replies, .hpy-comment-date  {
	color: #839192;
	font-size: 80%;
}

.hpy-file-comment-label::after {
	content: '' !important;
}

.hpy-ltr .hpy-reply-margin {
	margin-left: 55px;
}
.hpy-rtl .hpy-reply-margin {
	margin-right: 55px;
}

.hpy-reply-text-action {
	color: #839192;
	font-size: 80%;
}

.hpy-ltr .hpy-reply-text-action {
	margin-left: 57px;	
}

.hpy-rtl .hpy-reply-text-action {
	margin-right: 57px;
}

.hpy-ltr .hpy-back-margin {
	margin-left: 15px;
}

.hpy-rtl .hpy-back-margin {
	margin-right: 15px;
}

.hpy-bold, .page-dashboard .apexcharts-title-text {
	font-weight: bold !important;
}

.hpy-rtl .apexcharts-tooltip {
  width: 200px;
}

.hpy-announcement-bg {
	background-color: #F5B7B1;
	border-style: solid;
  	border-color: #ffa800;
}

.hpy-announcement-link {
	font-size: large;
	color: white;
	font-weight: bold;
}
.hpy-bg-announcement-icon {
	background-color: red;
}

.hpy-rounded-input {
	border-radius: 2rem;
}

.hpy-fab {
    background-position: center;
    background-image: url(../media/img/feeds/hattipy_hat_whitened.png);
    background-size: 25px 16px;
    background-repeat: no-repeat;
    position: fixed;
    right: 15px;
    bottom: 15px;
    height: 50px;
    width: 50px;
}

.hpy-user-card-top {
	padding: 8%
}

.hpy-img-timeline {
    top: -65px;
    left: 15px;
	width: 100px; 
	height: 100px;
}

.hpy-img-timeline-small {
	top: -50px;
    left: 15px;
	width: 75px; 
	height: 75px;
}

.hpy-timeline-fab {
	top: -70px;
    left: 90px;
    border-radius: 50%;
    padding: 6px;
}

.hpy-timeline-fab-small {
	top: -55px;
    left: 70px;
    border-radius: 50%;
    padding: 4px;
}

.hpy-timeline-edit {
	width: 20px;
}
     
.hpy-scrollable-list {
	overflow: auto;
	max-height: 70vh;
}

.hpy-img-comment {
	max-height: 200px;
    max-width: 200px;
}

.hpy-last-comment-time {
	position: absolute;
	bottom: 8px;
}

.hpy-ltr .hpy-last-comment-time {
    right: 8px;
}

.hpy-rtl .hpy-last-comment-time {
    left: 8px;
}

.hpy-img-comment-size {
	max-height: 300px;
	max-width: 75%;
}

.hpy-new-img-comment-size {
	max-height: 300px;
	max-width: 300px;
	width: 100%;
}

.hpy-ltr .hpy-edit-delete-comment-con {
	right: 0px;
    top: 2px;
}

.hpy-rtl .hpy-edit-delete-comment-con {
	left: 0px;
    top: 2px;
}

.hpy-top-employee-profile-con {
	width: 50px;
    height: 50px;
    background-position: left center;
    background-repeat: no-repeat;
    background-size: contain;
    border-radius: 50%;
    background-color: #eef0f8;
}

.hpy-bronze-trophy {
	color: #cd7f32;
}

.hpy-leaderboard-list-width {
	width: 260px;
}

.hpy-leaderboard-list-height {
   height: 425px;
}

.hpy-table-scrollbar {
	height: 41vh;
	overflow: auto;
}

.hpy-ltr .hpy-hide-table-btn {
   left: -7px;
}

.hpy-rtl .hpy-hide-table-btn {
   right: -7px;
}

.hpy-feed-attachment{
	max-height: 300px;
    max-width: 300px;
    width: 100%;
}

.hpy-bg-light-purple {
	background-color: #E8DAEF;
}

.hpy-purple {
	color: #9e368d !important;
}

.hpy-bg-purple {
	background-color: #9e368d !important;
}

.hpy-grey {
	color: #566573 !important;
}

.hpy-light-grey {
	color: #ABB2B9 !important;
}

.hpy-white {
	color: #ffffff !important;
}
.hpy-orange {
	color: #ffa800 !important;
}

.hpy-bg-orange {
	background-color: #ffa800 !important;
}

.hpy-blue {
	color: #4bc1c3 !important;
}

.hpy-bg-blue {
	background-color: #4bc1c3 !important;
}

.hpy-light-blue {
	color: #e2f6f5 !important; 
}

.hpy-bg-light-blue {
	background-color: #e2f6f5 !important; 
}

.hpy-red {
	color: #ff6b6c !important
}

.hpy-bg-red {
	background-color: #ff6b6c !important
}

.hpy-pink {
	color: #FADBD8;
}

.hpy-left-nav-username:hover {
	color: #000000 !important;
	background: transparent;
}

.hpy-right-nav-icon {
	background-color:  #D6EAF8 !important;
}

.hpy-confetti {
	position: absolute;
    top: 85px;
    opacity: 0.3;
}

@media (min-width: 1080px) {
	.hpy-confetti {
		top: 135px;
	}
}

.hpy-ltr .hpy-confetti {
    right: 20px;
}

.hpy-rtl .hpy-confetti {
    left: 20px;
}

.hpy-insights-totals {
	top: 35px;
    right: 10px;
    position: absolute;
}

.hpy-organization-con {
    min-width: 300px;
    min-height: 200px;
    width: 15%;
    display: inline-block;
    margin: 1rem;
}
.hpy-organization-con .card-body {
	padding: 1.25rem;
}
.hpy-organization-con .card-header, .hpy-organization-con .card-footer {
    padding: 1rem 0;
    position: relative;
}
.hpy-organization-con .hpy-org-logo {
	position: absolute;
	top: calc(50% - 22.5px);
	left: 5px;
	width: 45px;
	height: 45px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}
.hpy-organization-con .hpy-expired, .hpy-organization-con .hpy-active {
	position: absolute;
	top: calc(50% - 7px);
	right: 10px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
}
.hpy-organization-con .hpy-expired {
	background-color: red;
}
.hpy-organization-con .hpy-active {
	background-color: green;
}
.hpy-organization-con .hpy-org-title {
	font-weight: bold;
    font-size: 150%;
}
.hpy-organization-con .hpy-label {
	white-space: nowrap;
}
.hpy-organization-con .hpy-value {
	white-space: nowrap;
	padding-left: 10px;
	padding-bottom: 10px;
}
.hpy-organization-con .hpy-value.is_expired {
	color: red;
}

.hpy-installing {
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url(../media/img/loading.gif);
    width: 25px !important;
    height: 25px !important;
    top: calc(50% - 12px) !important;
}
.hpy-continue-install {
    background-image: url(../media/img/install.png);
    width: 24px !important;
    height: 24px !important;
    background-color: transparent !important;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    border-radius: 0 !important;
}

.hpy-no-tenants {
    font-size: 200%;
    font-style: italic;
    font-weight: bold;
    color: gray;
    opacity: 0.5;
    text-shadow: 1px 1px 20px darkred;
    margin-top: 50px;
}

.hpy-organization-action-btns {
    font-size: 120%;
}

.hpy-organization-action-btns .hpy-org-edit,
.hpy-organization-action-btns .hpy-org-del {
    display: none;
}

.hpy-organization-action-btns:hover .hpy-org-edit,
.hpy-organization-action-btns:hover .hpy-org-del {
    display: inline-block !important;
    cursor: pointer;
}

.hpy-organization-action-btns:hover .hpy-org-settings {
    display: none;
}

.hpy-organization-con.hpy-org-deleted:before {
	content: ' ';
	position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    opacity: 0.5;
    z-index: 1;
    background-color: black;
}

.hpy-organization-con .hpy-org-deleted-con {
	position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 2;
	text-align: center;
    padding: calc(50% - 20px) 0;
    color: red;
    font-size: 150%;
    text-shadow: 1px 1px 50px white;
}

.hpy-org-deleted-con span {
    background-color: white;
    padding: 10px;
    margin: 0;
}

.hpy-org-filter-con {
	background-color: white;
	padding: 5px 0 0 20px;
	box-shadow: 0px 0px 20px #afafaf;
	border-radius: 3px;
}

.hpy-org-filter-con label {
	font-size: 120%;
	width: 30%;
}

@media (max-width: 869px) {
	.hpy-org-filter-con label {
		width: 100%;
    }
}

.hpy-org-filter-action {
    display: inline-block;
    padding-top: 8px;
}

.hpy-org-filter-action label {
	width: auto;
	margin-right: 10px;
}

.hpy-org-filter-con .hpy-org-filter-input {
	width: 80%;
	display: inline-block;
}

.hpy-org-filter-expiry-soon {
    display: inline-block;
    width: 60px;
    margin-left: 10px;
}

.hpy-org-action {
	float: right;
	padding: 8px;
}
.hpy-org-allow-edit:HOVER {
	text-decoration: underline;
	cursor: pointer;
	color: #0080c0;
}

.hpy-ltr .hpy-feed-title {
	position: absolute;
	top: 10px;
	left: 15px;
}

.hpy-rtl .hpy-feed-title {
	position: absolute;
	top: 10px;
	right: 15px;
}

.hpy-feed-content {
	margin-top: 40px;
    margin-bottom: 10px;
}

.hpy-feed-image-size {
	max-height: 350px;
	max-width: 600px;
}

.custom-switch .custom-control-label::before {
    width: 3.5rem !important;
    height: 1.3rem !important;
    border-radius: 50px !important;
    background-color: #cda2cc8c !important;
    border-color: #cda2cc !important;
}
.custom-switch .custom-control-label::after {
    top: calc(0.25rem + 0px) !important;
    left: calc(-2.25rem + 0px) !important;
    width: calc(1.5rem - 0px) !important;
    height: calc(1.3rem - 0px) !important;
    border-radius: 50% !important;
    background-color: #9e338d !important;
}

.hpy-ltr .custom-switch .custom-control-input:checked ~ .custom-control-label::after {
    transform: translateX(2rem) !important;
}

.hpy-rtl .custom-switch .custom-control-input:checked ~ .custom-control-label::after {
    transform: translateX(-2rem) !important;
}

@media (max-width: 576px) {
	.checkbox.checkbox-lg>span {
		height: 18px;
    	width: 18px;
	}
}

.hpy-dropmenu-user-options {
	position: absolute;
	transform: translate3d(-216px, 49px, 0px);
	top: 8px !important;
	will-change: transform
}

.hpy-expiration-filter-hint {
    text-align: center;
    color: red;
}
/* ============= USER OPTIONS ================ */
@media (max-width: 900px) and (min-width: 767px) {
	.hpy-rtl .hpy-dropmenu-user-options {
		left: 220px;
	}
	
	.hpy-ltr .hpy-dropmenu-user-options {
		left: -7px
	}
}

@media (max-width: 766px) and (min-width: 379px) {
	.hpy-rtl .hpy-dropmenu-user-options {
		left: 250px;
	}
	
	.hpy-ltr .hpy-dropmenu-user-options {
		left: -70px
	}
}

@media (max-width: 378px) and (min-width: 340px) {
	.hpy-rtl .hpy-dropmenu-user-options {
		left: 220px;
	}
	
	.hpy-ltr .hpy-dropmenu-user-options {
		left: -3px
	}
}

@media (max-width: 339px) and (min-width: 300px) {
	.hpy-rtl .hpy-dropmenu-user-options {
		left: 220px;
	}
	
	.hpy-ltr .hpy-dropmenu-user-options {
		left: 30px
	}
}

@media (max-width: 299px) {
	.hpy-rtl .hpy-dropmenu-user-options {
		left: 210px;
	}
	
	.hpy-ltr .hpy-dropmenu-user-options {
		left: 60px
	}
}

.hpy-deleted-row {
	background-color: #ff000014 !important;
}
.hpy-deleted-row td:not(td:LAST-CHILD) {
    text-decoration: line-through;
}

.checkbox > input:checked ~ span {
    background-color: #4bc1c3 !important;
}

.radio > input:checked ~ span {
    background-color: #4bc1c3 !important;
}

.hpy-charp-right {
	border-top-right-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
}

/* ================== WIZARD BTNS ================== */

.hpy-previous {
	nav-index: 1;
}

.hpy-cancel {
	nav-index: 2;
}

.hpy-next {
	nav-index: 3;
}

.hpy-manually {
	nav-index: 4;
}

.hpy-import {
	nav-index: 5;
}

.hpy-reimport {
	nav-index: 6;
}

.modal-footer .hpy-next:focus, .modal-footer .hpy-previous:focus,
.modal-footer .hpy-cancel:focus, .modal-footer .hpy-finish:focus,
.modal-footer .hpy-manually:focus, .modal-footer .hpy-import:focus,
.modal-footer .hpy-reimport:focus {
	background-color: #004bc1c3 !important;
}

.modal-footer .hpy-next:hover, .modal-footer .hpy-previous:hover,
.modal-footer .hpy-cancel:hover, .modal-footer .hpy-finish:hover,
.modal-footer .hpy-manually:hover, .modal-footer .hpy-import:hover,
.modal-footer .hpy-reimport:hover {
	background-color: #004bc1c3 !important;
}