body { 
	background-color: aliceblue;
}

.wrap {
	position: relative;
	max-width: 430px;
	margin: auto;
	background-color: white;
	height: 100%;
	min-height: 100vh;
}

/* Ensure the sidebar pops out from the left-side of the content, not the left side of the window. */
.modal.modalLeft {
	position: absolute;
}

.box-card-project.item1 .box-icon {
	background-color: rgba(255, 255, 255, 1);
}

.box-card-project.item1 .box-icon img {
	width: 70%;
	height: 70%;
}

.page-tab {
	display: none;
	margin-bottom: 8em;
}

.page-tab.active {
	display: block;
}

.menubar-footer {
	background: linear-gradient(to right, #183460, #436395);
}

.box-card-project.bg-1 {
	background: linear-gradient(249.26deg, rgb(24 52 96) 0%, rgb(90 133 130) 100%);
	min-height: 206px;
}

.box-card-project.bg-2 {
	background: linear-gradient(249.26deg, rgb(90 133 130) 0%, rgb(24 52 96) 100%);
}

.box-card-project.bg-3 {
	background: linear-gradient(249.26deg, rgb(90 133 130) 0%, rgb(24 52 96) 100%);
}

.box-task.style-2 { 
	min-height: 84px;
}

.menubar-footer {
	position: fixed;
	bottom: 0;
	width: 100%;
	max-width: 430px;
}

.autoComplete_wrapper {
	--ac-bg: var(--white);
	--ac-border-width: var(--border-width);
	--ac-border-color: var(--border-color-translucent);
	--ac-border-radius: var(--border-radius);
	--ac-box-shadow: var(--box-shadow-lg);
	--ac-scrollable-max-height: 17rem;
	--ac-min-width: 13.75rem;
	--ac-spacer: 0.125rem;
	--ac-padding-y: 0.625rem;
	--ac-item-padding-y: calc(var(--spacer) * 0.4);
	--ac-item-padding-x: var(--spacer);
	--ac-item-color: var(--body-color);
	--ac-item-hover-color: var(--body-color);
	--ac-item-hover-bg: var(--gray-200);
	--ac-item-active-color: var(--gray-900);
	--ac-item-active-bg: var(--gray-300)
}

.autoComplete_wrapper[data-color-theme=dark],[data-color-theme=dark] .autoComplete_wrapper:not([data-color-theme]),
html[data-color-theme=dark] .autoComplete_wrapper {
	color-scheme: dark;
	--ac-bg: #32333a;
	--ac-border-color: rgba(var(--black-rgb), 0.25)
}

.autoComplete_wrapper {
	position: relative
}

.autoComplete_wrapper>ul {
	position: absolute;
	max-height: var(--ac-scrollable-max-height);
	overflow-y: auto;
	left: 0;
	right: 0;
	margin-top: var(--ac-spacer);
	min-width: var(--ac-min-width);
	padding: var(--ac-padding-y) 0;
	z-index: 1;
	list-style: none;
	background-color: var(--ac-bg);
	border: var(--ac-border-width) solid var(--ac-border-color);
	outline: 0;
	border-radius: var(--ac-border-radius);
	box-shadow: var(--ac-box-shadow);
	transition: color ease-in-out var(--transition-base-timer), background-color ease-in-out var(--transition-base-timer)
}

@media (prefers-reduced-motion:reduce) {
	.autoComplete_wrapper>ul {
		transition: none
	}
}

.autoComplete_wrapper>ul:empty,
.autoComplete_wrapper>ul[hidden] {
	display: block;
	opacity: 0;
	-webkit-transform: scale(0);
	transform: scale(0)
}

.autoComplete_wrapper>ul>li {
	padding: var(--ac-item-padding-y) var(--ac-item-padding-x);
	white-space: nowrap;
	cursor: default;
	color: var(--ac-item-color);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	transition: color ease-in-out var(--transition-base-timer), background-color ease-in-out var(--transition-base-timer)
}

@media (prefers-reduced-motion:reduce) {
	.autoComplete_wrapper>ul>li {
		transition: none
	}
}

.autoComplete_wrapper>ul>li:hover {
	color: var(--ac-item-hover-color);
	background-color: var(--ac-item-hover-bg)
}

.autoComplete_wrapper>ul>li:active,
.autoComplete_wrapper>ul>li[aria-selected=true] {
	color: var(--ac-item-active-color);
	background-color: var(--ac-item-active-bg)
}

.autoComplete_wrapper > ul > li mark {
	background-color: transparent;
	/* color: #ff7a7a; */
	font-weight: 700;
}
.autoComplete_wrapper > ul > li mark::selection {
	color: rgba(#fff, 0);
	background-color: rgba(#fff, 0);
}

.fixed-top {
	position: relative;
	max-width: 430px;
	/* margin-top: 25px; */
}

.offcanvas.offcanvas-bottom {
	right: initial;
	left: initial;
	width: 100%;
	max-width: 430px;
}

.footer-fixed {
	left: initial;
	width: 100%;
	max-width: 430px;
}

.app-content {
	padding: 15px 0px 96px;
}

.box-boarding-fixed {
	position: fixed;
	bottom: 0;
	width: 100%;
	max-width: 430px;
}

.task-status.type-1 {
	background-color: #797979;
}

.task-status.type-2 {
	background-color: #87d4ce;
}

.task-status.type-3 {
	background-color: #183460;
}

.task-status.type-4 {
	background-color: #603a3b;
}

.task-status.type-5 {
	background-color: #4a8b42;
}

.alert.alert-info.light {
	background: rgb(0 109 225 / 10%);
	color: #0243a7;
}

.avatar img {
	width: 104%;
	height: 104%;
}

.banner-boarding-style-3 { 
	margin-top: 0;
}

.box-boarding-fixed {
	left: 0;
	right: 0;
}

.task-status {
	text-wrap: nowrap;
}

.content-boarding-sw p {
    max-width: 290px;
}

.content-boarding-sw h1 {
    max-width: 300px;
	font-size: 22px;
}

.preload-container .logo-img {
    width: 150px;
    height: auto;
}

@media (min-width: 475px) {

	.wrap {
		margin-top: 25px !important;
		box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
	}
}

.footer-icons {
	visibility: hidden;
}

ul.bullet-points,
.training-guides ul {
	list-style: inherit;
	margin-left: 2em;
}
.training-guides a {
	color: var(--blue);
}

.icon {
	/* Fix issues where custom icons are not aligned properly. */
	vertical-align: top;
}

.redacted {
	background: #9e9e9e85;
	height: 20px;
	display: inline-block;
}

/* Update the input fields to have a slight border */
select,
.select2-with-icon,
textarea,
input[type=text],
input[type=password],
input[type=datetime],
input[type=datetime-local],
input[type=date],
input[type=month],
input[type=time],
input[type=week],
input[type=number],
input[type=email],
input[type=url],
input[type=search],
input[type=tel],
input[type=color] {
	border: 1px solid #ededed;
}