* {
	scrollbar-width: thin;
	scrollbar-color: #aeaeae transparent;
}

.react-datepicker-popper[data-placement^='bottom'] .react-datepicker__triangle,
.react-datepicker-popper[data-placement^='top'] .react-datepicker__triangle,
.react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow {
	margin-left: -8px;
	position: absolute;
}

.react-datepicker-popper[data-placement^='bottom'] .react-datepicker__triangle,
.react-datepicker-popper[data-placement^='top'] .react-datepicker__triangle,
.react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow,
.react-datepicker-popper[data-placement^='bottom'] .react-datepicker__triangle::before,
.react-datepicker-popper[data-placement^='top'] .react-datepicker__triangle::before,
.react-datepicker__year-read-view--down-arrow::before,
.react-datepicker__month-read-view--down-arrow::before,
.react-datepicker__month-year-read-view--down-arrow::before {
	box-sizing: content-box;
	position: absolute;
	border: 8px solid transparent;
	height: 0;
	width: 1px;
}

.react-datepicker-popper[data-placement^='bottom'] .react-datepicker__triangle::before,
.react-datepicker-popper[data-placement^='top'] .react-datepicker__triangle::before,
.react-datepicker__year-read-view--down-arrow::before,
.react-datepicker__month-read-view--down-arrow::before,
.react-datepicker__month-year-read-view--down-arrow::before {
	content: '';
	z-index: -1;
	border-width: 8px;
	left: -8px;
	border-bottom-color: #aeaeae;
}

.react-datepicker-popper[data-placement^='bottom'] .react-datepicker__triangle {
	top: 0;
	margin-top: -8px;
}

.react-datepicker-popper[data-placement^='bottom'] .react-datepicker__triangle,
.react-datepicker-popper[data-placement^='bottom'] .react-datepicker__triangle::before {
	border-top: none;
	border-bottom-color: #f0f0f0;
}

.react-datepicker-popper[data-placement^='bottom'] .react-datepicker__triangle::before {
	top: -1px;
	border-bottom-color: #aeaeae;
}

.react-datepicker-popper[data-placement^='top'] .react-datepicker__triangle,
.react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow {
	bottom: 0;
	margin-bottom: -8px;
}

.react-datepicker-popper[data-placement^='top'] .react-datepicker__triangle,
.react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow,
.react-datepicker-popper[data-placement^='top'] .react-datepicker__triangle::before,
.react-datepicker__year-read-view--down-arrow::before,
.react-datepicker__month-read-view--down-arrow::before,
.react-datepicker__month-year-read-view--down-arrow::before {
	border-bottom: none;
	border-top-color: #fff;
}

.react-datepicker-popper[data-placement^='top'] .react-datepicker__triangle::before,
.react-datepicker__year-read-view--down-arrow::before,
.react-datepicker__month-read-view--down-arrow::before,
.react-datepicker__month-year-read-view--down-arrow::before {
	bottom: -1px;
	border-top-color: #aeaeae;
}

.react-datepicker-wrapper {
	display: inline-block;
	padding: 0;
	border: 0;
}

.react-datepicker {
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size: 0.8rem;
	background-color: #fff;
	color: #000;
	border: 1px solid #aeaeae;
	border-radius: 0.3rem;
	display: inline-block;
	position: relative;
}

.react-datepicker--time-only .react-datepicker__triangle {
	left: 35px;
}

.react-datepicker--time-only .react-datepicker__time-container {
	border-left: 0;
}

.react-datepicker--time-only .react-datepicker__time,
.react-datepicker--time-only .react-datepicker__time-box {
	border-bottom-left-radius: 0.3rem;
	border-bottom-right-radius: 0.3rem;
}

.react-datepicker__triangle {
	position: absolute;
	left: 50px;
}

.react-datepicker-popper {
	z-index: 1;
}

.react-datepicker-popper[data-placement^='bottom'] {
	margin-top: 10px;
}

.react-datepicker-popper[data-placement='bottom-end'] .react-datepicker__triangle,
.react-datepicker-popper[data-placement='top-end'] .react-datepicker__triangle {
	left: auto;
	right: 50px;
}

.react-datepicker-popper[data-placement^='top'] {
	margin-bottom: 10px;
}

.react-datepicker-popper[data-placement^='right'] {
	margin-left: 8px;
}

.react-datepicker-popper[data-placement^='right'] .react-datepicker__triangle {
	left: auto;
	right: 42px;
}

.react-datepicker-popper[data-placement^='left'] {
	margin-right: 8px;
}

.react-datepicker-popper[data-placement^='left'] .react-datepicker__triangle {
	left: 42px;
	right: auto;
}

.react-datepicker__header {
	text-align: center;
	background-color: #f0f0f0;
	border-bottom: 1px solid #aeaeae;
	border-top-left-radius: 0.3rem;
	padding-top: 8px;
	position: relative;
}

.react-datepicker__header--time {
	padding-bottom: 8px;
	padding-left: 5px;
	padding-right: 5px;
}

.react-datepicker__header--time:not(.react-datepicker__header--time--only) {
	border-top-left-radius: 0;
}

.react-datepicker__header:not(.react-datepicker__header--has-time-select) {
	border-top-right-radius: 0.3rem;
}

.react-datepicker__year-dropdown-container--select,
.react-datepicker__month-dropdown-container--select,
.react-datepicker__month-year-dropdown-container--select,
.react-datepicker__year-dropdown-container--scroll,
.react-datepicker__month-dropdown-container--scroll,
.react-datepicker__month-year-dropdown-container--scroll {
	display: inline-block;
	margin: 0 2px;
}

.react-datepicker__current-month,
.react-datepicker-time__header,
.react-datepicker-year-header {
	margin-top: 0;
	color: #000;
	font-weight: bold;
	font-size: 0.944rem;
}

.react-datepicker-time__header {
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

.react-datepicker__navigation {
	background: none;
	line-height: 1.7rem;
	text-align: center;
	cursor: pointer;
	position: absolute;
	top: 10px;
	width: 0;
	padding: 0;
	border: 0.45rem solid transparent;
	z-index: 1;
	height: 10px;
	width: 10px;
	text-indent: -999em;
	overflow: hidden;
}

.react-datepicker__navigation--previous {
	left: 10px;
	border-right-color: #ccc;
}

.react-datepicker__navigation--previous:hover {
	border-right-color: #b3b3b3;
}

.react-datepicker__navigation--previous--disabled,
.react-datepicker__navigation--previous--disabled:hover {
	border-right-color: #e6e6e6;
	cursor: default;
}

.react-datepicker__navigation--next {
	right: 10px;
	border-left-color: #ccc;
}

.react-datepicker__navigation--next--with-time:not(
		.react-datepicker__navigation--next--with-today-button
	) {
	right: 95px;
}

.react-datepicker__navigation--next:hover {
	border-left-color: #b3b3b3;
}

.react-datepicker__navigation--next--disabled,
.react-datepicker__navigation--next--disabled:hover {
	border-left-color: #e6e6e6;
	cursor: default;
}

.react-datepicker__navigation--years {
	position: relative;
	top: 0;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.react-datepicker__navigation--years-previous {
	top: 4px;
	border-top-color: #ccc;
}

.react-datepicker__navigation--years-previous:hover {
	border-top-color: #b3b3b3;
}

.react-datepicker__navigation--years-upcoming {
	top: -4px;
	border-bottom-color: #ccc;
}

.react-datepicker__navigation--years-upcoming:hover {
	border-bottom-color: #b3b3b3;
}

.react-datepicker__month-container {
	float: left;
}

.react-datepicker__year {
	margin: 0.4rem;
	text-align: center;
}

.react-datepicker__year-wrapper {
	display: flex;
	flex-wrap: wrap;
	max-width: 180px;
}

.react-datepicker__year .react-datepicker__year-text {
	display: inline-block;
	width: 4rem;
	margin: 2px;
}

.react-datepicker__month {
	margin: 0.4rem;
	text-align: center;
}

.react-datepicker__month .react-datepicker__month-text,
.react-datepicker__month .react-datepicker__quarter-text {
	display: inline-block;
	width: 4rem;
	margin: 2px;
}

.react-datepicker__input-time-container {
	clear: both;
	width: 100%;
	float: left;
	margin: 5px 0 10px 15px;
	text-align: left;
}

.react-datepicker__input-time-container .react-datepicker-time__caption {
	display: inline-block;
}

.react-datepicker__input-time-container .react-datepicker-time__input-container {
	display: inline-block;
}

.react-datepicker__input-time-container
	.react-datepicker-time__input-container
	.react-datepicker-time__input {
	display: inline-block;
	margin-left: 10px;
}

.react-datepicker__input-time-container
	.react-datepicker-time__input-container
	.react-datepicker-time__input
	input {
	width: auto;
}

.react-datepicker__input-time-container
	.react-datepicker-time__input-container
	.react-datepicker-time__input
	input[type='time']::-webkit-inner-spin-button,
.react-datepicker__input-time-container
	.react-datepicker-time__input-container
	.react-datepicker-time__input
	input[type='time']::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.react-datepicker__input-time-container
	.react-datepicker-time__input-container
	.react-datepicker-time__input
	input[type='time'] {
	-moz-appearance: textfield;
}

.react-datepicker__input-time-container
	.react-datepicker-time__input-container
	.react-datepicker-time__delimiter {
	margin-left: 5px;
	display: inline-block;
}

.react-datepicker__time-container {
	float: right;
	border-left: 1px solid #aeaeae;
	width: 85px;
}

.react-datepicker__time-container--with-today-button {
	display: inline;
	border: 1px solid #aeaeae;
	border-radius: 0.3rem;
	position: absolute;
	right: -72px;
	top: 0;
}

.react-datepicker__time-container .react-datepicker__time {
	position: relative;
	background: white;
	border-bottom-right-radius: 0.3rem;
}

.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box {
	width: 85px;
	overflow-x: hidden;
	margin: 0 auto;
	text-align: center;
	border-bottom-right-radius: 0.3rem;
}

.react-datepicker__time-container
	.react-datepicker__time
	.react-datepicker__time-box
	ul.react-datepicker__time-list {
	list-style: none;
	margin: 0;
	height: calc(195px + (1.7rem / 2));
	overflow-y: scroll;
	padding-right: 0px;
	padding-left: 0px;
	width: 100%;
	box-sizing: content-box;
}

.react-datepicker__time-container
	.react-datepicker__time
	.react-datepicker__time-box
	ul.react-datepicker__time-list
	li.react-datepicker__time-list-item {
	height: 30px;
	padding: 5px 10px;
	white-space: nowrap;
}

.react-datepicker__time-container
	.react-datepicker__time
	.react-datepicker__time-box
	ul.react-datepicker__time-list
	li.react-datepicker__time-list-item:hover {
	cursor: pointer;
	background-color: #f0f0f0;
}

.react-datepicker__time-container
	.react-datepicker__time
	.react-datepicker__time-box
	ul.react-datepicker__time-list
	li.react-datepicker__time-list-item--selected {
	background-color: #216ba5;
	color: white;
	font-weight: bold;
}

.react-datepicker__time-container
	.react-datepicker__time
	.react-datepicker__time-box
	ul.react-datepicker__time-list
	li.react-datepicker__time-list-item--selected:hover {
	background-color: #216ba5;
}

.react-datepicker__time-container
	.react-datepicker__time
	.react-datepicker__time-box
	ul.react-datepicker__time-list
	li.react-datepicker__time-list-item--disabled {
	color: #ccc;
}

.react-datepicker__time-container
	.react-datepicker__time
	.react-datepicker__time-box
	ul.react-datepicker__time-list
	li.react-datepicker__time-list-item--disabled:hover {
	cursor: default;
	background-color: transparent;
}

.react-datepicker__week-number {
	color: #ccc;
	display: inline-block;
	width: 1.7rem;
	line-height: 1.7rem;
	text-align: center;
	margin: 0.166rem;
}

.react-datepicker__week-number.react-datepicker__week-number--clickable {
	cursor: pointer;
}

.react-datepicker__week-number.react-datepicker__week-number--clickable:hover {
	border-radius: 0.3rem;
	background-color: #f0f0f0;
}

.react-datepicker__day-names,
.react-datepicker__week {
	white-space: nowrap;
}

.react-datepicker__day-name,
.react-datepicker__day,
.react-datepicker__time-name {
	color: #000;
	display: inline-block;
	width: 1.7rem;
	line-height: 1.7rem;
	text-align: center;
	margin: 0.166rem;
}

.react-datepicker__month--selected,
.react-datepicker__month--in-selecting-range,
.react-datepicker__month--in-range,
.react-datepicker__quarter--selected,
.react-datepicker__quarter--in-selecting-range,
.react-datepicker__quarter--in-range {
	border-radius: 0.3rem;
	background-color: #216ba5;
	color: #fff;
}

.react-datepicker__month--selected:hover,
.react-datepicker__month--in-selecting-range:hover,
.react-datepicker__month--in-range:hover,
.react-datepicker__quarter--selected:hover,
.react-datepicker__quarter--in-selecting-range:hover,
.react-datepicker__quarter--in-range:hover {
	background-color: #1d5d90;
}

.react-datepicker__month--disabled,
.react-datepicker__quarter--disabled {
	color: #ccc;
	pointer-events: none;
}

.react-datepicker__month--disabled:hover,
.react-datepicker__quarter--disabled:hover {
	cursor: default;
	background-color: transparent;
}

.react-datepicker__day,
.react-datepicker__month-text,
.react-datepicker__quarter-text,
.react-datepicker__year-text {
	cursor: pointer;
}

.react-datepicker__day:hover,
.react-datepicker__month-text:hover,
.react-datepicker__quarter-text:hover,
.react-datepicker__year-text:hover {
	border-radius: 0.3rem;
	background-color: #f0f0f0;
}

.react-datepicker__day--today,
.react-datepicker__month-text--today,
.react-datepicker__quarter-text--today,
.react-datepicker__year-text--today {
	font-weight: bold;
}

.react-datepicker__day--highlighted,
.react-datepicker__month-text--highlighted,
.react-datepicker__quarter-text--highlighted,
.react-datepicker__year-text--highlighted {
	border-radius: 0.3rem;
	background-color: #3dcc4a;
	color: #fff;
}

.react-datepicker__day--highlighted:hover,
.react-datepicker__month-text--highlighted:hover,
.react-datepicker__quarter-text--highlighted:hover,
.react-datepicker__year-text--highlighted:hover {
	background-color: #32be3f;
}

.react-datepicker__day--highlighted-custom-1,
.react-datepicker__month-text--highlighted-custom-1,
.react-datepicker__quarter-text--highlighted-custom-1,
.react-datepicker__year-text--highlighted-custom-1 {
	color: magenta;
}

.react-datepicker__day--highlighted-custom-2,
.react-datepicker__month-text--highlighted-custom-2,
.react-datepicker__quarter-text--highlighted-custom-2,
.react-datepicker__year-text--highlighted-custom-2 {
	color: green;
}

.react-datepicker__day--selected,
.react-datepicker__day--in-selecting-range,
.react-datepicker__day--in-range,
.react-datepicker__month-text--selected,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__month-text--in-range,
.react-datepicker__quarter-text--selected,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__quarter-text--in-range,
.react-datepicker__year-text--selected,
.react-datepicker__year-text--in-selecting-range,
.react-datepicker__year-text--in-range {
	border-radius: 0.3rem;
	background-color: #216ba5;
	color: #fff;
}

.react-datepicker__day--selected:hover,
.react-datepicker__day--in-selecting-range:hover,
.react-datepicker__day--in-range:hover,
.react-datepicker__month-text--selected:hover,
.react-datepicker__month-text--in-selecting-range:hover,
.react-datepicker__month-text--in-range:hover,
.react-datepicker__quarter-text--selected:hover,
.react-datepicker__quarter-text--in-selecting-range:hover,
.react-datepicker__quarter-text--in-range:hover,
.react-datepicker__year-text--selected:hover,
.react-datepicker__year-text--in-selecting-range:hover,
.react-datepicker__year-text--in-range:hover {
	background-color: #1d5d90;
}

.react-datepicker__day--keyboard-selected,
.react-datepicker__month-text--keyboard-selected,
.react-datepicker__quarter-text--keyboard-selected,
.react-datepicker__year-text--keyboard-selected {
	border-radius: 0.3rem;
	background-color: #2a87d0;
	color: #fff;
}

.react-datepicker__day--keyboard-selected:hover,
.react-datepicker__month-text--keyboard-selected:hover,
.react-datepicker__quarter-text--keyboard-selected:hover,
.react-datepicker__year-text--keyboard-selected:hover {
	background-color: #1d5d90;
}

.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range {
	background-color: rgba(33, 107, 165, 0.5);
}

.react-datepicker__month--selecting-range .react-datepicker__day--in-range,
.react-datepicker__month--selecting-range .react-datepicker__month-text--in-range,
.react-datepicker__month--selecting-range .react-datepicker__quarter-text--in-range,
.react-datepicker__month--selecting-range .react-datepicker__year-text--in-range {
	background-color: #f0f0f0;
	color: #000;
}

.react-datepicker__day--disabled,
.react-datepicker__month-text--disabled,
.react-datepicker__quarter-text--disabled,
.react-datepicker__year-text--disabled {
	cursor: default;
	color: #ccc;
}

.react-datepicker__day--disabled:hover,
.react-datepicker__month-text--disabled:hover,
.react-datepicker__quarter-text--disabled:hover,
.react-datepicker__year-text--disabled:hover {
	background-color: transparent;
}

.react-datepicker__month-text.react-datepicker__month--selected:hover,
.react-datepicker__month-text.react-datepicker__month--in-range:hover,
.react-datepicker__month-text.react-datepicker__quarter--selected:hover,
.react-datepicker__month-text.react-datepicker__quarter--in-range:hover,
.react-datepicker__quarter-text.react-datepicker__month--selected:hover,
.react-datepicker__quarter-text.react-datepicker__month--in-range:hover,
.react-datepicker__quarter-text.react-datepicker__quarter--selected:hover,
.react-datepicker__quarter-text.react-datepicker__quarter--in-range:hover {
	background-color: #216ba5;
}

.react-datepicker__month-text:hover,
.react-datepicker__quarter-text:hover {
	background-color: #f0f0f0;
}

.react-datepicker__input-container {
	position: relative;
	display: inline-block;
	width: 100%;
}

.react-datepicker__year-read-view,
.react-datepicker__month-read-view,
.react-datepicker__month-year-read-view {
	border: 1px solid transparent;
	border-radius: 0.3rem;
}

.react-datepicker__year-read-view:hover,
.react-datepicker__month-read-view:hover,
.react-datepicker__month-year-read-view:hover {
	cursor: pointer;
}

.react-datepicker__year-read-view:hover .react-datepicker__year-read-view--down-arrow,
.react-datepicker__year-read-view:hover .react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-read-view:hover .react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view:hover .react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view:hover .react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-year-read-view:hover .react-datepicker__month-read-view--down-arrow {
	border-top-color: #b3b3b3;
}

.react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow {
	border-top-color: #ccc;
	float: right;
	margin-left: 20px;
	top: 8px;
	position: relative;
	border-width: 0.45rem;
}

.react-datepicker__year-dropdown,
.react-datepicker__month-dropdown,
.react-datepicker__month-year-dropdown {
	background-color: #f0f0f0;
	position: absolute;
	width: 50%;
	left: 25%;
	top: 30px;
	z-index: 1;
	text-align: center;
	border-radius: 0.3rem;
	border: 1px solid #aeaeae;
}

.react-datepicker__year-dropdown:hover,
.react-datepicker__month-dropdown:hover,
.react-datepicker__month-year-dropdown:hover {
	cursor: pointer;
}

.react-datepicker__year-dropdown--scrollable,
.react-datepicker__month-dropdown--scrollable,
.react-datepicker__month-year-dropdown--scrollable {
	height: 150px;
	overflow-y: scroll;
}

.react-datepicker__year-option,
.react-datepicker__month-option,
.react-datepicker__month-year-option {
	line-height: 20px;
	width: 100%;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.react-datepicker__year-option:first-of-type,
.react-datepicker__month-option:first-of-type,
.react-datepicker__month-year-option:first-of-type {
	border-top-left-radius: 0.3rem;
	border-top-right-radius: 0.3rem;
}

.react-datepicker__year-option:last-of-type,
.react-datepicker__month-option:last-of-type,
.react-datepicker__month-year-option:last-of-type {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border-bottom-left-radius: 0.3rem;
	border-bottom-right-radius: 0.3rem;
}

.react-datepicker__year-option:hover,
.react-datepicker__month-option:hover,
.react-datepicker__month-year-option:hover {
	background-color: #ccc;
}

.react-datepicker__year-option:hover .react-datepicker__navigation--years-upcoming,
.react-datepicker__month-option:hover .react-datepicker__navigation--years-upcoming,
.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-upcoming {
	border-bottom-color: #b3b3b3;
}

.react-datepicker__year-option:hover .react-datepicker__navigation--years-previous,
.react-datepicker__month-option:hover .react-datepicker__navigation--years-previous,
.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-previous {
	border-top-color: #b3b3b3;
}

.react-datepicker__year-option--selected,
.react-datepicker__month-option--selected,
.react-datepicker__month-year-option--selected {
	position: absolute;
	left: 15px;
}

.react-datepicker__close-icon {
	cursor: pointer;
	background-color: transparent;
	border: 0;
	outline: 0;
	padding: 0px 6px 0px 0px;
	position: absolute;
	top: 0;
	right: 0;
	height: 100%;
	display: table-cell;
	vertical-align: middle;
}

.react-datepicker__close-icon::after {
	cursor: pointer;
	background-color: #216ba5;
	color: #fff;
	border-radius: 50%;
	height: 16px;
	width: 16px;
	padding: 2px;
	font-size: 12px;
	line-height: 1;
	text-align: center;
	display: table-cell;
	vertical-align: middle;
	content: '\00d7';
}

.react-datepicker__today-button {
	background: #f0f0f0;
	border-top: 1px solid #aeaeae;
	cursor: pointer;
	text-align: center;
	font-weight: bold;
	padding: 5px 0;
	clear: left;
}

.react-datepicker__portal {
	position: fixed;
	width: 100vw;
	height: 100vh;
	background-color: rgba(0, 0, 0, 0.8);
	left: 0;
	top: 0;
	justify-content: center;
	align-items: center;
	display: flex;
	z-index: 2147483647;
}

.react-datepicker__portal .react-datepicker__day-name,
.react-datepicker__portal .react-datepicker__day,
.react-datepicker__portal .react-datepicker__time-name {
	width: 3rem;
	line-height: 3rem;
}

@media (max-width: 400px), (max-height: 550px) {
	.react-datepicker__portal .react-datepicker__day-name,
	.react-datepicker__portal .react-datepicker__day,
	.react-datepicker__portal .react-datepicker__time-name {
		width: 2rem;
		line-height: 2rem;
	}
}

.react-datepicker__portal .react-datepicker__current-month,
.react-datepicker__portal .react-datepicker-time__header {
	font-size: 1.44rem;
}

.react-datepicker__portal .react-datepicker__navigation {
	border: 0.81rem solid transparent;
}

.react-datepicker__portal .react-datepicker__navigation--previous {
	border-right-color: #ccc;
}

.react-datepicker__portal .react-datepicker__navigation--previous:hover {
	border-right-color: #b3b3b3;
}

.react-datepicker__portal .react-datepicker__navigation--previous--disabled,
.react-datepicker__portal .react-datepicker__navigation--previous--disabled:hover {
	border-right-color: #e6e6e6;
	cursor: default;
}

.react-datepicker__portal .react-datepicker__navigation--next {
	border-left-color: #ccc;
}

.react-datepicker__portal .react-datepicker__navigation--next:hover {
	border-left-color: #b3b3b3;
}

.react-datepicker__portal .react-datepicker__navigation--next--disabled,
.react-datepicker__portal .react-datepicker__navigation--next--disabled:hover {
	border-left-color: #e6e6e6;
	cursor: default;
}

.react-datepicker-wrapper {
	width: 100%;
	z-index: 9999 !important;
}

.react-datepicker-popper {
	z-index: 9999 !important;
}

.pin-field {
	background-color: rgb(248, 249, 250);
	border: 1px solid rgb(204, 204, 204);
	border-radius: 0.3rem;
	font-size: 2rem;
	margin: 0.25rem;
	height: 3.5rem;
	outline: none;
	text-align: center;
	transition-duration: 250ms;
	transition-property: background, color, border, box-shadow, transform;
	width: 3rem;
}

.pin-field:focus {
	border-color: rgb(0, 123, 255);
	outline: none;
	transform: scale(1.05);
}

.pin-field:invalid {
	animation: shake 3 linear 75ms;
	border-color: rgb(220, 53, 69);
	box-shadow: 0 0 0.25rem rgba(220, 53, 69, 0.5);
}

swd-pin-field[completed] .pin-field {
	border-color: rgb(40, 167, 69);
	background-color: rgba(40, 167, 69, 0.25);
}

@keyframes shake {
	from {
		transform: scale(1.05) translateY(-5%);
	}

	to {
		transform: scale(1.05) translateY(5%);
	}
}

.sk-chase {
	width: 60px;
	height: 60px;
	position: relative;
	animation: sk-chase 2.5s infinite linear both;
	margin: 18% auto;
}

.sk-chase-dot {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	animation: sk-chase-dot 2s infinite ease-in-out both;
}

.sk-chase-dot:before {
	content: '';
	display: block;
	width: 25%;
	height: 25%;
	background-color: #8336f3;
	border-radius: 100%;
	animation: sk-chase-dot-before 2s infinite ease-in-out both;
}

.sk-chase-dot:nth-child(1) {
	animation-delay: -1.1s;
}

.sk-chase-dot:nth-child(2) {
	animation-delay: -1s;
}

.sk-chase-dot:nth-child(3) {
	animation-delay: -0.9s;
}

.sk-chase-dot:nth-child(4) {
	animation-delay: -0.8s;
}

.sk-chase-dot:nth-child(5) {
	animation-delay: -0.7s;
}

.sk-chase-dot:nth-child(6) {
	animation-delay: -0.6s;
}

.sk-chase-dot:nth-child(1):before {
	animation-delay: -1.1s;
}

.sk-chase-dot:nth-child(2):before {
	animation-delay: -1s;
}

.sk-chase-dot:nth-child(3):before {
	animation-delay: -0.9s;
}

.sk-chase-dot:nth-child(4):before {
	animation-delay: -0.8s;
}

.sk-chase-dot:nth-child(5):before {
	animation-delay: -0.7s;
}

.sk-chase-dot:nth-child(6):before {
	animation-delay: -0.6s;
}

@keyframes sk-chase {
	100% {
		transform: rotate(360deg);
	}
}

@keyframes sk-chase-dot {
	80%,
	100% {
		transform: rotate(360deg);
	}
}

@keyframes sk-chase-dot-before {
	50% {
		transform: scale(0.4);
	}

	100%,
	0% {
		transform: scale(1);
	}
}

.text-editor {
	width: 1086px;
	margin: 0 auto;
}

.ql-editor {
	min-height: 100px;
	border: none;
	font-family: 'Rubik', sans-serif;
}

.ql-snow {
	border-radius: 0.375rem;
	border-color: 1px solid #d2ddec;
}

#sidebar.navbar-vertical h6.navbar-heading {
	margin-bottom: 0;
	padding-bottom: 0.25rem;
}

#sidebar.navbar-vertical .navbar-nav .nav-link {
	font-size: 0.9rem;
}

#sidebar.navbar-vertical .navbar-nav .nav-link {
	padding-top: 0.4rem;
	padding-bottom: 0.4rem;
}

.dropzone {
	margin-bottom: 0 !important;
}

#tagging react-tagsinput {
	background-color: #fff;
	border: 1px solid #d2ddec;
	border-radius: 0.375rem;
	overflow: hidden;
	padding-left: 5px;
	padding-top: 3px;
}

.contract-overflow {
	overflow-x: hidden;
	/* Hide horizontal scrollbar */
	overflow-y: scroll;
}

.contract-flower {
	text-align: justify;
}

#tagging .react-tagsinput::placeholder {
	/* Chrome, Firefox, Opera, Safari 10.1+ */
	color: red;
	opacity: 1;
	/* Firefox */
}

#tagging :-ms-input-placeholder {
	/* Internet Explorer 10-11 */
	color: red;
}

#tagging ::-ms-input-placeholder {
	/* Microsoft Edge */
	color: red;
}

#tagging .react-tagsinput {
	border-radius: 0.375rem;
	overflow: hidden;
}

#tagging .react-tagsinput--focused {
	border-color: #2c7ce5;
}

#tagging .react-tagsinput-tag {
	background-color: #2c7ce5;
	border-radius: 0.5rem;
	border: 1px solid white;
	color: white;
	display: inline-block;
	font-size: 13px;
	font-weight: 400;
	padding-inline: 0.5rem;
	margin: 0 !important;
}

#tagging .react-tagsinput-remove {
	cursor: pointer;
	font-weight: bold;
}

#tagging .react-tagsinput-tag a::before {
	content: '×';
	margin-left: 0.35rem;
	font-weight: 400;
	color: #fff;
}

#tagging .react-tagsinput-tag a::before:hover {
	color: #e63757 !important;
}

#tagging .react-tagsinput-input {
	background: transparent;
	border: 0;
	color: black;
	font-size: 13px;
	font-weight: 400;
	margin-bottom: 6px;
	margin-top: 1px;
	outline: none;
	padding: 5px;
	padding-right: 12px;
	width: 100px;
}

.mainButton {
	background-color: #7647ea;
	outline: none;
	border: none;
	color: white;
}

.mainButton:active,
.mainButton:hover {
	background-color: #5319e6;
	color: white;
}

.sigContainer {
	width: 80%;
	height: 80%;
	margin: 0 auto;
	background-color: #fff;
}

.sigPad {
	width: 100%;
	height: 50vh;
}

.bubbles {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 0;
	overflow: hidden;
	top: 0;
	left: 0;
}

.bubble {
	position: absolute;
	bottom: -100px;
	width: 40px;
	height: 40px;
	background: #f1f1f1;
	border-radius: 50%;
	opacity: 0.5;
	animation: rise 10s infinite ease-in;
}

.bubble:nth-child(1) {
	width: 40px;
	height: 40px;
	left: 10%;
	animation-duration: 8s;
}

.bubble:nth-child(2) {
	width: 20px;
	height: 20px;
	left: 20%;
	animation-duration: 5s;
	animation-delay: 1s;
}

.bubble:nth-child(3) {
	width: 50px;
	height: 50px;
	left: 35%;
	animation-duration: 7s;
	animation-delay: 2s;
}

.bubble:nth-child(4) {
	width: 80px;
	height: 80px;
	left: 50%;
	animation-duration: 11s;
	animation-delay: 0s;
}

.bubble:nth-child(5) {
	width: 35px;
	height: 35px;
	left: 55%;
	animation-duration: 6s;
	animation-delay: 1s;
}

.bubble:nth-child(6) {
	width: 45px;
	height: 45px;
	left: 65%;
	animation-duration: 8s;
	animation-delay: 3s;
}

.bubble:nth-child(7) {
	width: 90px;
	height: 90px;
	left: 70%;
	animation-duration: 12s;
	animation-delay: 2s;
}

.bubble:nth-child(8) {
	width: 25px;
	height: 25px;
	left: 80%;
	animation-duration: 6s;
	animation-delay: 2s;
}

.bubble:nth-child(9) {
	width: 15px;
	height: 15px;
	left: 70%;
	animation-duration: 5s;
	animation-delay: 1s;
}

.bubble:nth-child(10) {
	width: 90px;
	height: 90px;
	left: 25%;
	animation-duration: 10s;
	animation-delay: 4s;
}

@keyframes rise {
	0% {
		bottom: -100px;
		transform: translateX(0);
	}

	50% {
		transform: translate(100px);
	}

	100% {
		bottom: 1080px;
		transform: translateX(-200px);
	}
}

.myClass a {
	background-color: white;
	font-weight: 500;

	color: #6e84a3;
}

.myClass a:hover {
	color: black;
}

/* Active tab */
.myClass ul > li.active > a,
.myClass ul > li.active > a:hover,
.myClass ul > li.active > a:focus {
	background-color: red;
	color: white;
}

/* Disabled tab */
.myClass ul > li.disabled > a {
	background-color: lightgray;
	color: darkgray;
}

.searchresult {
	margin-left: 8px;
}

.searchresult h2 {
	font-size: 19px;
	line-height: 18px;
	font-weight: normal;
	color: rgb(29, 1, 189);
	margin-bottom: 0px;
	margin-top: 25px;
}

.hreflink {
	color: green;
	font-size: 14px;
	line-height: 14px;
	margin-bottom: 0px;
}

.searchresult button {
	font-size: 10px;
	line-height: 14px;
	color: green;
	margin-bottom: 0px;
	padding: 0px;
	border-width: 0px;
	background-color: white;
}

.searchresult p {
	width: 625px;
	font-size: 13px;
	margin-top: 0px;
	color: rgb(82, 82, 82);
}

.metafields-fb-description {
	margin-left: 10px;
}

.metafields-fb-desc-url {
	color: #7b8ea1;
}

#header-set-group,
#footer-set-group {
	display: flex;
}

#header-set-group > .form-check,
#footer-set-group > .form-check {
	margin: 0 0.5rem 0;
}

.sms-textarea {
	position: relative;
}

#charCount {
	position: absolute;
	bottom: 5px;
	right: 10px;
}

.sms-normal {
	color: grey;
}

.sms-warning {
	color: black;
}

.hidden.sms-number-list {
	position: absolute;
	visibility: hidden;
	opacity: 0;
}

input[type='checkbox'].sms-number-list:checked + label {
	/* color: #f00; */
	font-style: normal;
}

.sms-number-x-mark-container {
	margin: -1px 0 0 0;
}

.sms-number-x-mark-container i {
	margin: 0 0 0 5px;
}

.sms-send-container {
	height: 300px;
	max-height: 300px;
}

.sms-number-container {
	height: 500px;
}

.sms-send-container .card {
	max-height: 360px;
}

.sms-numbers-card-container {
	height: 500px;
}

.sms-numbers-card-container-history {
	height: 200px;
}

.sms-numbers-container {
	font-family: monospace;
	display: flex;
}

.sms-ticket-container > div {
	white-space: nowrap;
}

.sms-add-number {
	background-color: white;
	color: black;
	border: 2px solid #2c7be5;
	padding: 12px 18px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 16px;
	/* margin: 4px 2px; */
	transition-duration: 0.4s;
	border-radius: 50%;
}

.sms-add-number:hover {
	cursor: pointer;
	background-color: #2c7be5;
	color: white;
}

input.new-number::-webkit-outer-spin-button,
input.new-number::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* Firefox */
input[type='number'].new-number {
	-moz-appearance: textfield;
	width: 140px;
	height: 25px;
	/* border-radius: 0.25rem; */
}

.sms-numbers-options-container.row {
	align-items: center;
}

.sms-numbers-options-container button {
	width: 110px;
}

/* .sms-numbers-options-container button.add-number {
  width: auto;
} */

.sms-numbers-options-container input {
	width: 80px;
	height: 25px;
	margin: 0 auto;
	border: none;
	/* <-- This thing here */
	border: solid 1px #ccc;
	border-radius: 0.25rem;
}

.sms-payment-type-container {
	text-align: center;
}

.sms-payment-type-container button {
	padding: 4px 5px;
	/* background-color: #7647ea; */
}

.sms-payment-type-container button h5 {
	/* text-decoration: underline;
  text-underline-offset: 0.3rem; */
	margin: unset;
}

.sms-payment-type-container span {
	margin-top: -5px;
	font-size: 13px;
}

.btn-logo-blue {
	background-color: #7647ea;
	border-color: unset;
}

.btn-logo-pink {
	background-color: #e846b7;
	border-color: unset;
}

.btn-logo-orange {
	background-color: #fed838;
	border-color: unset;
}

.btn-logo-ocean {
	background-color: #22d3ee;
	border-color: unset;
}

.btn-logo-green {
	background-color: #4ade80;
	border-color: unset;
}

.sms-button-payment-text-container {
	margin-top: 5px;
	width: 100%;
}

.flex-shrink-unset > * {
	flex-shrink: unset !important;
}

.sms-history-container {
	min-height: 220px;
}

.sms-history-row {
	cursor: pointer;
}

.myClass .sms-tab.nav-link.active {
	border-bottom: 2px solid #7647ea;
	border-radius: unset;
	background-color: unset;
	color: #6e84a3;
}

.sms-history-row:hover {
	background-color: #f9fbfd;
}

.excel-date-picker > .react-datepicker-wrapper > .react-datepicker__input-container > input {
	height: 29px;
	width: 105px;
}

.badge.bg-danger.new-component {
	color: #fff !important;
}

.popup-text-container {
	width: 300;
	display: -webkit-box;
	-webkit-line-clamp: 6;
	-webkit-box-orient: vertical;
	overflow-y: scroll;
	overflow-x: hidden;
	font-size: 15;
	line-height: 1.35rem;
}

.sms-payment-container {
	display: flex;
	flex-direction: row;
	width: 100%;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	padding-inline: 1rem;
	padding-block: 1rem;
	column-gap: 0.75rem;
}

.message-container {
	display: grid;
	grid-template-columns: repeat(1, minmax(0, 1fr));

	row-gap: 1rem;
}

.max-w-full {
	max-width: 100% !important;
}

.message-input-card {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	column-gap: 0.75rem;
	row-gap: 0.5rem;
	padding: 1.5rem 1rem;
}

.message-number-input {
	width: 100%;
	height: calc(1.5em + 1rem + 2px);
	padding: 0.5rem 0.75rem;
	font-size: 0.9375rem;
	font-weight: 400;
	line-height: 1.5;
	color: #12263f;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #d2ddec;
	border-radius: 0.375rem;
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.row-start-2 {
	grid-row-start: 2;
}

.row-start-5 {
	grid-row-start: 5;
}

.flex {
	display: flex;
}

.color-picker-form {
	display: flex;
	position: relative;
}

.color-picker-text {
	padding-right: 2.5rem;
}

.color-picker-icon {
	width: 40px;
	height: 100%;
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	right: 0px;
	top: 0px;
	color: #95aac9;
	border: 1px solid #d2ddec;
	border-top-right-radius: 0.375rem;
	border-bottom-right-radius: 0.375rem;
}

.color-picker {
	z-index: 20;
	opacity: 0;
	width: 40px;
	height: 40px;
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	right: 0px;
	top: 0px;
}

.marquee {
	width: 100%;
	display: inline-flex;
	flex-wrap: nowrap;
	overflow: hidden;
	border-top-right-radius: 0.375rem;
	border-top-left-radius: 0.375rem;
}

.marquee > p {
	font-size: 12px;
	z-index: 0;
	width: 100%;
	display: inline-block;
	padding-block: 5px;
	margin: 0;
	animation: marquee 10s linear infinite;
}

@keyframes marquee {
	0% {
		transform: translate(100%, 0);
	}

	100% {
		transform: translate(-100%, 0);
	}
}

.strip-container {
	display: grid;
	grid-template-columns: repeat(1, minmax(0, 1fr));
	grid-row: 2;
	row-gap: 20px;
}

.strip-wrapper {
	height: min-content;
	grid-row-start: 1;
	border-radius: 0.375rem;
}

.strip-image > img {
	border-bottom-right-radius: 0.375rem;
	border-bottom-left-radius: 0.375rem;
	width: 100%;
}

.card-item {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.tag {
	width: min-content;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 1rem;
	padding: 4px 8px;
	margin-bottom: 0 !important;
	text-transform: capitalize;
}

.tag-primary {
	color: #1d5f45;
	background-color: #cbf4e3;
	border: 1px solid #1d5f45;
}

.tag-secondary {
	color: #244293;
	background-color: #e3e8fc;
	border: 1px solid #244293;
}

.tag-warning {
	color: #e42722;
	background-color: #ffe8e8;
	border: 1px solid #e42722;
}

.tag-mobile {
	color: #0169a8;
	background-color: #e1f3fd;
	border: 1px solid #0169a8;
}

.invalid {
	margin-top: 0.25rem;
	font-size: 0.8125rem;
	color: #e63757;
}

li {
	list-style: none;
}

.expander {
	flex-basis: 0;
	flex-grow: 1;
	max-width: 100%;
	width: 100%;
}

@keyframes show {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(360deg);
	}
}

.nav-item {
	cursor: pointer;
	border: 1px solid transparent;
}

.navbar-sub {
	padding-left: 1.65rem;
	margin-bottom: 0;
	transition: transform 150ms linear;
}

.navbar-subitem {
	border-left: 1px solid #eaeaea;
	cursor: pointer;
}

.navbar-sub-show {
	display: block;
	transform: translateY(0%);
}

.navbar-sub-hide {
	display: none;
	transform: translateY(-100%);
}

.dropdown-arrow {
	padding: 0;
	min-width: 0 !important;
	transition: all 150ms linear;
}

.rotate-90 {
	transform: rotate(90deg);
}

.tiers-grid {
	display: grid;
	grid-template-columns: repeat(1, minmax(0, 1fr));
	column-gap: 1rem;
	row-gap: 0.4rem;
}

.tier-header {
	display: flex;
	flex-direction: column;
	row-gap: 0.6rem;
	margin-bottom: 1.6rem;
}

.tier-title {
	font-size: 18px;
	font-weight: 500;
	line-height: 1.5rem;
	margin-bottom: 0;
}

.tier-price {
	font-size: 16px;
	color: #6e6e6e;
	margin-bottom: 0;
}

.tier-price > span {
	font-size: 24px;
	letter-spacing: -0.02em;
	color: #000;
	font-weight: 500;
}

.tier-description {
	height: 60px;
	font-size: 14px;
	line-height: 1.5rem;
	color: #6e6e6e;
	margin-bottom: 0.6rem;
}

.deeplink-img {
	width: 4rem;
	height: 4rem;
	aspect-ratio: 1/1;
	border-radius: 0.375rem;
	object-fit: cover;
	object-position: center;
}

.deeplink-wrapper {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1rem;
}

.tier-button {
	width: 100%;
	background-color: #5116e2;
	color: #fff;
	font-size: 12px;
	text-transform: uppercase;
	border: 0;
	text-wrap: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	border-radius: 0.5rem;
	padding: 0.5rem 2rem;
	transition: all 200ms linear;
}

.tier-button:hover {
	opacity: 0.8;
}

.foreign-tier-button {
	background-color: #5116e2;
	color: #fff;
	font-size: 13px;
	text-transform: uppercase;
	border: 0;
	border-radius: 0.5rem;
	padding: 0.75rem 2.2rem;
	transition: all 200ms linear;
}

.foreign-tier-button:hover {
	opacity: 0.8;
}

.tier-label {
	font-size: 13px;
	line-height: 1.5rem;
	letter-spacing: 1px;
	color: #6e6e6e;
	text-transform: uppercase;
}

.tier-feature > hr {
	margin-block: 0.8rem;
}

.feature-wrapper {
	display: flex;
	position: relative;
	align-items: center;
	justify-content: space-between;
}

.feature-wrapper > .info-icon {
	color: 0.6rem;
	color: #6e6e6e;
}

.feature-text {
	display: flex;
	align-items: center;
	column-gap: 10px;
}

.feature-text > p {
	font-size: 14px;
	margin: 0;
}

.feature-text > .fe {
	color: #00d97e;
}

.tier-popular {
	border: 3px solid #5116e2;
}

.tier-wrapper {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.tier-tag {
	display: flex;
	justify-content: center;
	align-items: center;
	color: #5116e2;
	background-color: #e3e8fc;
	border: 1px solid #5116e2;
	border-radius: 1rem;
	padding: 4px 8px;
	font-size: 12px;
	margin: 0;
}

.text-black {
	color: #000 !important;
}

.pricing-container {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.timeline {
	display: flex;
	align-items: center;
	background-color: #ececf1;
	width: 100%;
	height: 6px;
	margin: 3rem 0;
	border-radius: 1rem;
}

.timeline-progress {
	background-color: #5116e2;
	width: 32%;
	height: 100%;
	border-radius: 1rem;
}

.timeline-item {
	position: relative;
	width: 20px;
	height: 20px;
	background-color: #5116e2;
	border: 3px solid #fff;
	box-shadow: 0 0.75rem 1.5rem rgba(18, 38, 63, 0.03);
	border-radius: 50%;
	margin-left: -5px;
}

.timeline-contain {
	position: absolute;
	top: -45px;
	left: 41%;
	transform: translateX(-50%);
	background-color: #020447;
	color: #fff;
	font-size: 13px;
	width: 150px;
	border-radius: 0.5rem;
	padding: 5px 10px;
	text-align: center;
	box-shadow: 0 0.75rem 1.5rem rgba(18, 38, 63, 0.03);
}

.timeline-contain::before {
	content: '';
	position: absolute;
	display: block;
	width: 10px;
	height: 10px;
	top: 70%;
	left: 50%;
	background-color: #020447;
	transform: rotate(-45deg) translateX(-50%);
	box-shadow: 0 0.75rem 1.5rem rgba(18, 38, 63, 0.03);
}

.comparison-table {
	width: 100%;
	display: block;
	overflow-x: auto;
	padding: 1.5rem;
}

.comparisin-table div {
	white-space: nowrap;
}

.comparison-row-container {
	display: grid;
	grid-template-columns: repeat(13, minmax(0, 1fr));
	padding: 1rem 0;
}

.comparison-row {
	border-bottom: 1px solid #eee;
	padding: 1rem 0;
}

.row-cell {
	display: flex;
	align-items: center;
	justify-content: center;
	grid-column: span 2 / span 2;
}

.row-feature-cell {
	display: flex;
	align-items: center;
	justify-content: start;
	grid-column: span 3 / span 3;
}

.comparison-tier-header {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	row-gap: 1rem;
}

.comparison-tier-title {
	font-size: 16px;
	line-height: 1.5rem;
	margin-bottom: 0;
}

.comparison-tier-price {
	font-size: 14px;
	color: #6e6e6e;
	margin-bottom: 0;
}

.comparison-tier-price > p {
	letter-spacing: -0.02em;
	color: #000;
	font-weight: 600;
}

.comparison-section-title {
	font-size: 15px;
	font-weight: 500;
	line-height: 1.5rem;
	margin-bottom: 0;
}

.comparison-feature-title {
	color: #6e6e6e;
	font-size: 15px;
	line-height: 1.5rem;
	margin-bottom: 0;
}

.comparison-tier-button {
	width: 100%;
	background-color: #5116e2;
	color: #fff;
	font-size: 11px;
	font-weight: 500;
	text-transform: uppercase;
	border: none;
	border-radius: 0.5rem;
	padding: 0.75rem 2rem;
	transition: all 200ms linear;
}

.comparison-tier-button:hover {
	opacity: 0.8;
}

.plan-info-button {
	display: flex;
	align-items: center;
	width: 100%;
	background-color: #e33fab;
	color: #fff;
	font-size: 11px;
	text-transform: uppercase;
	border: none;
	border-radius: 0.5rem;
	padding: 0.5rem;
	transition: all 200ms linear;
}

.plan-info-button:hover {
	opacity: 0.8;
}

.comparison-recommended {
	background-color: #5116e2;
	color: #fff;
	border: none;
}

.row-cell > .fe {
	font-size: 18px;
	color: #00d97e;
}

.row-cell > span {
	font-size: 13px;
	line-height: 1.5rem;
	letter-spacing: 1px;
	color: #6e6e6e;
}

.card-body > :last-child {
	border: none;
}

.sidebar-img {
	height: 25px;
	width: auto;
	border-radius: 0.25rem;
	margin-right: 0.5rem;
}

.right-slide {
	z-index: 1000;
	height: 100vh;
	width: 80%;
	position: fixed;
	display: flex;
	flex-direction: column;
	top: 0;
	right: 0;
	background-color: #fff;
	border-top-left-radius: 0.5rem;
	border-top-right-radius: 0.5rem;
	transition: all 200ms ease-in-out;
	box-shadow: 0 0.75rem 1.5rem rgba(18, 38, 63, 0.03);
	padding: 0 1.5rem;
}

.show-right-slide {
	transform: translateX(0px);
}

.hide-right-slide {
	transform: translateX(100%);
}

.right-slide-header {
	display: flex;
	align-items: center;
	justify-content: start;
	padding: 0.8rem 0;
	border-bottom: 1px solid #eee;
}

.master-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	column-gap: 0.5rem;
}

.right-slide-body {
	display: flex;
	flex-direction: column;
	row-gap: 0.5rem;
	padding-block: 1.5rem;
	overflow-y: auto;
}

.master-select-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.master-item-name {
	width: 100%;
	display: flex;
	margin-bottom: 0.2rem;
}

.master-item-title {
	margin-left: 0.6rem;
}

.checked-master-list {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-inline: 1rem;
}

.row-start-5 {
	grid-row-start: 5;
}

.btn-primary-color {
	background-color: rgb(121, 35, 247);
}

.text-primary-color {
	color: rgb(121, 35, 247);
}

.flex-center {
	display: flex;
	justify-content: center;
	align-items: center;
}

.category-form-body {
	display: grid;
	justify-content: center;
	align-content: center;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-template-rows: repeat(1, minmax(0, 30px));
	gap: 0.8rem;
}

.row-start-5 {
	grid-row-start: 5;
}

.table-head {
	background-color: #eee;
}

.table-cell-wrap {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 75ch;
}

.prev-btn {
	display: flex;
	align-items: center;
	column-gap: 0.25rem;
	color: rgb(121, 35, 247);
	padding: 0 !important;
	margin-bottom: 0.75rem;
}

.side-login {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	width: 100%;
}

.home-stats {
	padding-top: calc((60px - 1em * 1.5) / 2) !important;
	padding-bottom: calc((60px - 1em * 1.5) / 2) !important;
}

.pichart-img {
	width: 100%;
	height: 10rem;
}

.module-detail-container {
	display: flex;
	flex-direction: column;
}

.module-text {
	font-size: clamp(0.875rem, 0.6518rem + 0.7143vw, 1.5rem);
}

.module-slide {
	display: flex;
	align-items: center;
	justify-items: center;
	width: 100%;
	border-radius: 15px;
	object-fit: fill;
	margin-left: auto;
	margin-right: auto;
}

.module-detail-img {
	width: 100%;
	max-height: 28rem;
	height: 100%;
	object-fit: contain;
	border-radius: 0.375rem;
	margin-right: auto;
	margin-left: auto;
}

.denied-modal {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.denied-modal-button {
	background-color: #5116e2;
	color: #fff;
	/* font-size: 1px; */
	border: none;
	border-radius: 0.5rem;
	padding: 0.5rem 2rem;
}

.deinied-modal-button:hover {
	opacity: 0.9;
}

.close-btn {
	font-size: 1.75rem;
}

.close-btn-right {
	font-size: 1.5rem;
	position: absolute;
	top: 0.5rem;
	right: 0.5rem;
}

.intro-modal-footer {
	display: grid;
	border: none;
	grid-template-columns: repeat(1, minmax(0, 1fr));
	grid-template-rows: repeat(1, minmax(0, 1fr));
	column-gap: 0rem;
	row-gap: 0.75rem;
	padding: 1rem 1.5rem;
}

.intro-modal-footer button:first-child {
	background-color: #7949e7 !important;
	border: none !important;
}

.intro-modal-footer button:nth-child(2) {
	background-color: #e33fab !important;
	border: none !important;
}

.intro-modal-footer button:hover {
	opacity: 0.95;
}

.white-image-filter {
	filter: brightness(0) invert(1) !important;
}

.w3w-icon {
	width: 1.5rem;
	height: 1.5rem;
}

.banner-swiper-image {
	object-fit: cover;
	object-position: left;
	max-height: calc(100vh -1rem);
	width: 100%;
	height: calc(100vh - 24px);
}

.contact-link {
	z-index: 9999;
	position: absolute;
	bottom: 80px;
	left: 50px;
	background-color: #7923f7;
	border: none;
	color: #fff;
	font-size: 0.9rem;
	line-height: 1.5;
	border-radius: 0.5rem;
	padding: 0.7rem 1.5rem;
	cursor: pointer;
}

.contact-link:hover {
	color: #fff;
	opacity: 0.95;
}

.rounded-xl {
	border-radius: 0.75rem !important;
}

.auth-container {
	position: relative;
	height: 100%;
}

.auth-container .form-group {
	margin-bottom: 0.75rem !important;
}

.auth-form-wrapper {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	height: 100%;
	max-width: 24rem;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

.cursor-pointer-link {
	cursor: pointer !important;
}
.cursor-pointer-link:hover {
	text-decoration: underline !important;
	text-underline-offset: 3px;
}

.hr-text {
	width: 80%;
	text-align: center;
	border-bottom: 1px solid rgb(121, 35, 247);
	line-height: 0.1em;
	margin: 10px 0 20px;
}

.hr-text span {
	background: #fff;
	padding: 0 10px;
}

.auth-logo {
	z-index: 9999;
	position: absolute;
	top: 25px;
	left: 40px;
}
.auth-logo > img {
	width: 7.5rem;
}

.auth-swiper-container .swiper-pagination-bullets {
	bottom: 30px !important;
	left: 50px !important;
	width: auto !important;
}

.auth-swiper-container .swiper-pagination-bullet {
	width: 0.9rem !important;
	height: 0.9rem !important;
	background-color: transparent !important;
	opacity: 1 !important;
	border: 2px solid #fff;
}

.auth-swiper-container .swiper-pagination-bullet-active {
	background-color: #eee !important;
}

.auth-form-wrapper input:focus {
	border-color: rgb(121, 35, 247) !important;
}

.password-input {
	position: relative;
	width: 100%;
}

.password-input > input {
	padding-right: 2rem !important;
}

.password-input-icon {
	z-index: 9999;
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	right: 0px;
	top: 0px;
	width: 2rem;
	height: calc(1.5em + 1rem + 2px);
	cursor: pointer;
}

.password-input-icon > i:hover {
	color: rgb(121, 35, 247);
}

.contact-btn:hover {
	opacity: 0.8;
}

.auth-social-link {
	color: #646464;
	font-size: 1rem;
	text-align: center;
	font-weight: 400;
	line-height: 1;
	cursor: pointer;
}

.auth-social-link:hover {
	color: #000;
}

.auth-social-link > img {
	width: 1.1rem;
	height: 1.1rem;
}

.otp-cooldown-time {
	display: inline-block;
	width: 1rem !important;
	margin-inline: 0.25rem;
}

.auth-alert {
	position: relative;
	display: flex;
	align-items: center;
}

.auth-alert-close {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	z-index: 2;
	padding: 0 1.25rem;
}

.supersale-icon {
	height: 2rem;
	width: auto;
}

.zochil-icon {
	height: 1.25rem;
	width: auto;
}

.table-filter {
	display: grid;
	grid-template-columns: repeat(10, minmax(0, 1fr));
	gap: 0.75rem;
}

.object-contain {
	object-fit: contain;
}

/*
.order-row {
	position: relative;
}

.order-row::before {
	width: 2px;
	height: 100%;
	z-index: 1;
	content: '';
	transition: 200ms ease-in-out;
	position: absolute;
	left: 0px;
	top: 0px;
}

.kool-row::before {
	background-color: #00d97e;
}

.zochil-row::before {
	background-color: #7923f7;
} */

.table-container {
	width: 100%;
}

.z-99 {
	z-index: 9999;
}

.header-table {
	position: sticky;
	top: 0;
	width: 100%;
	background-color: #f9fbfd;
	z-index: 900;
}

.body-container {
	max-height: 500px;
	overflow-y: auto;
	width: 100%;
}

.body-table {
	width: 100%;
	table-layout: fixed;
}

.table-wrapper {
	max-height: calc(100vh - 18rem);
	height: calc(100vh - 18rem);
	overflow-y: auto;
	width: 100%;
}

.card-wrapper {
	max-height: calc(100vh - 14rem);
	height: calc(100vh - 14rem);
	overflow-y: auto;
	width: 100%;
}

.table-wrapper table {
	width: 100%;
}

.order-status-card {
	margin-top: 0.5rem !important;
}

.qpay-img {
	width: 2rem;
	height: 2rem;
	margin-right: 0.3rem;
}

.plan-button-outline {
	color: #5116e2 !important;
	border-color: #5116e2 !important;
}

.plan-button-outline:hover {
	color: #fff !important;
	background-color: #5116e2;
	border-color: #5116e2;
}

.plan-button-outline.focus,
.plan-button-outline:focus {
	box-shadow: 0 0 0 0.15rem rgba(44, 123, 229, 0.5);
}

.plan-button-outline.disabled,
.plan-button-outline:disabled {
	color: #5116e2;
	background-color: transparent;
}

.plan-button-outline:not(:disabled):not(.disabled).active,
.plan-button-outline:not(:disabled):not(.disabled):active,
.show > .plan-button-outline.dropdown-toggle {
	color: #fff;
	background-color: #5116e2;
	border-color: #5116e2;
}

.plan-modal-header {
	padding-bottom: 0 !important;
	border-color: transparent !important;
}

.close-button-shop {
	position: absolute;
	top: 1rem;
	right: 1rem;
	width: 2rem;
	height: 2rem;
	background-color: #fff;
	border-radius: 50%;
	border: none;
	color: #000;
}

.delivery-icon {
	width: 4rem;
	height: 4rem;
}

.support-row {
	display: grid;
	grid-template-columns: repeat(1, minmax(0, 1fr));
	grid-template-rows: repeat(4, minmax(0, 1fr));
	column-gap: 1.75rem;
}

.support-icon-card {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	border: 1px solid #eee;
	border-radius: 0.5rem;
}
.support-icon-card > i {
	color: #7923f7 !important;
}

.support-text {
	text-decoration: underline;
	text-underline-offset: 3px;
	color: #000;
	font-size: 0.8rem;
}
.support-text:hover {
	text-decoration: underline;
	color: #7923f7;
}

.table-href {
	position: absolute;
	inset: 0px;
}

.payment-method-item {
	display: flex;
	border: 1.5px solid #eee;
	border-radius: 0.375rem;
	cursor: pointer;
	padding: 0 1.5rem !important;
	margin-bottom: 0.4rem;
	cursor: pointer;
}

.payment-method-item:hover {
	border-color: #7647e8;
	color: #7647e8;
}

.payment-method-item-border {
	border-color: #7647e8;
	color: #7647e8;
}
.payment-method-item-border:focus {
	border-color: transparent;
	outline: none;
}

.payment-method-item label {
	width: 100%;
	flex: 0 0 100%;
}
.payment-method-item > label .payment-title {
	font-weight: 600;
	font-size: 1rem;
}
.payment-method-item > label .payment-text {
	font-size: 0.7rem;
	color: #666;
}

.popup-header-title {
	font-size: 1rem;
	letter-spacing: -0.025em;
	font-weight: 500;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
}

.popup-header-close {
	font-size: 1.25rem;
}

.icon-list {
	width: 100%;
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	gap: 0.5rem;
	max-height: 240px;
	overflow-y: scroll;
}

.connect-fb-wrapper {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	margin-bottom: 2rem;
}

.min-h-chatbot-card {
	min-height: 30rem;
}

.fb-pages-container {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	min-height: 30rem;
}

.fb-pages-info {
	display: flex;
	flex-direction: column;
	align-items: start;
	gap: 1.5em;
}

.fb-page-item {
	padding: 0.75rem 1rem;
	cursor: pointer;
	transition: background-color 0.2s;
	border-bottom: 1px solid #eee;
}

.fb-page-item:hover {
	background-color: #f8f9fa;
}

.fb-page-content {
	display: flex;
	align-items: center;
}

.fb-page-radio-group {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.fb-page-image {
	width: 42px;
	height: 42px;
	border-radius: 8px;
	object-fit: cover;
}

.fb-page-name {
	margin-left: 1rem;
}

.fb-page-name h3 {
	margin: 0;
	font-size: 1rem;
	font-weight: 600;
}

.radio-wrapper {
	display: flex;
	align-items: center;
}

.text-success {
	color: #42ba96;
}

.fb-pages-footer {
	margin-top: 1.5rem;
}

.btn-block {
	width: 100%;
}

.node-hover:hover {
	border: '1px solid #7042FD';
}

.my-dropdown-toggle::before {
	display: none !important;
	content: none !important;
}

.my-dropdown-toggle::after {
	display: none !important;
	content: none !important;
}

.chatbot-dropdown-menu {
	display: flex !important;
	flex-direction: column;
	width: 20rem !important;
	border-radius: 0.75rem;
	padding: 1.5rem;
	margin-right: 0.25rem !important;
	gap: 1.25rem;
}

.chatbot-dropdown-item {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 0.5rem;
	border: 1px dashed #999;
	border-radius: 0.75rem;
	font-size: 16px !important;
	color: #000;
	cursor: grab;
}
.chatbot-dropdown-item:hover {
	background-color: #efefef;
}

.carousel-prev-btn {
	position: absolute;
	left: 10px;
	top: 40%;
}
.carousel-next-btn {
	position: absolute;
	right: 10px;
	top: 40%;
}

.add-button-edit {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0.5rem;
	border: 1px dashed #999;
	border-radius: 0.5rem;
	height: 2rem;
	font-size: 14px !important;
	color: #000;
	background-color: transparent;
}

.add-button-edit:hover {
	background-color: #efefef;
}

.phone-container {
	position: relative;
	margin: 0 auto;
	border: 14px solid #374151;
	background-color: #374151;
	border-radius: 2.5rem;
	height: 600px;
	width: 300px;
	box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

.phone-notch {
	width: 148px;
	height: 18px;
	background-color: #374151;
	top: 0;
	border-bottom-left-radius: 0.8rem;
	border-bottom-right-radius: 0.8rem;
	left: 50%;
	transform: translateX(-50%);
	position: absolute;
}

.phone-screen {
	border-radius: 2rem;
	overflow: hidden;
	width: 272px;
	height: 572px;
	background-color: #fff;
	display: flex;
	flex-direction: column;
	padding: 0.5rem;
}

.phone-content {
	flex-grow: 1;
	padding: 1rem;
}

.phone-input {
	position: relative;
	display: flex;
	align-items: center;
	background-color: #f3f4f6;
	border-radius: 9999px;
	padding: 0.5rem 1rem;
}

.phone-input input {
	flex-grow: 1;
	border: none;
	outline: none;
	background-color: transparent;
	font-size: 0.75rem;
	color: #374151;
}

.phone-input button {
	position: absolute;
	top: 0;
	height: 100%;
	right: 0;
	background-color: #6366f1;
	color: white;
	border: none;
	outline: none;
	border-radius: 9999px;
	padding: 0.5rem 1rem;
	font-size: 0.75rem;
	cursor: pointer;
}

.conversation-bubble {
	border: 1px solid #eee;
	border-radius: 999px;
	padding: 0.25rem 1rem;
	margin-top: 0.5rem;
	font-size: 12px;
	box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
}

.button-edge__label {
	position: absolute;
	pointer-events: all;
	transform-origin: center;
}

.button-edge__button {
	width: 40px;
	height: 40px;
	border: 5px solid #f7f9fb;
	background-color: #f3f3f4;
	cursor: pointer;
	border-radius: 50%;
	font-size: 12px;
	padding-top: 0px;
}

.button-edge__button:hover {
	background-color: #e63757;
	color: #ffffff;
}

.file-card-title {
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
}

.player-overlay {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

.react-flow__node {
	z-index: -10 !important;
}

.card-player:hover > .player-overlay {
	display: flex !important;
}
.player-overlay > i {
	color: #fff;
	font-size: 1.8rem;
}

.player-overlay > i:hover {
	color: #fff;
	font-size: 1.8rem;
}

.player-close-button {
	position: absolute;
	top: -3rem;
	right: -0;
	width: 40px;
	height: 40px;
	font-size: 20px;
	display: grid;
	place-items: center;
	color: white;
	background-color: rgba(23, 23, 23, 0.5);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 50%;
	cursor: pointer;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	z-index: 1000;
}

.table-list-image {
	height: 3rem;
	object-fit: cover;
	aspect-ratio: 16/9;
	border-radius: 0.125rem;
}

.course-module-list {
	width: 100%;
	display: flex;
	flex-direction: column;
	border: 1px solid #e2ebf6;
	border-radius: 0.5rem;
	/* max-height: calc(100vh - 18rem);
	height: calc(100vh - 18rem); */
	overflow-y: auto;
	width: 100%;
}

.course-module-header {
	/* position: sticky;
	top: 0; */
	background-color: #fbfbfb;
	padding: 0.75rem 1rem;
	border-top-left-radius: 0.5rem;
	border-top-right-radius: 0.5rem;
	border-bottom: 1px solid #e2ebf6;
	color: #383838;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	z-index: 10;
}
.course-module-header h1 {
	font-size: 1rem !important;
	line-height: 1.25rem !important;
	font-weight: 500;
}
.course-module-title > button {
	background-color: transparent;
	border: none;
	border-radius: 0.5rem;
	cursor: grab !important;
}
.course-module-title > button > svg {
	width: 1rem;
	height: 1rem;
	color: #383838;
}
.course-module-title > button:hover {
	opacity: 0.6;
}
.course-module-body {
	border-end-end-radius: 0.5rem !important;
	border-end-start-radius: 0.5rem !important;
	background-color: #fff;
}
.module-lesson {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 0.75rem 1rem;
	padding-left: 1.5rem;
	border-bottom: 1px solid #e2ebf6;
	color: #383838;
}

.module-lesson > h2 {
	font-size: 0.9rem !important;
	line-height: 1.25rem !important;
	font-weight: 500;
}

.module-lesson > p {
	font-size: 0.8rem !important;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
}

.training-category-list {
	display: flex;
	gap: 1rem;
	flex-wrap: wrap;
}

.add-leson-btn {
	display: flex;
	width: fit-content;
	align-items: center;
	gap: 0.25rem;
	background-color: transparent;
	border: none;
	padding: 0.5rem 0.75rem;
	border: 1px solid #e2ebf6;
	border-radius: 0.5rem;
	transition: all 100ms ease-in-out;
}
.add-leson-btn:hover {
	background-color: #eeeeee;
}

.training-category-item {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding: 0.5rem 1rem;
	border: 1px solid #e2ebf6;
	border-radius: 0.5rem;
	box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
}

.video-select-wrapper {
	display: grid;
	place-items: center;
	border: 1px dashed #95aac9;
	border-radius: 0.5rem;
	padding: 2.5rem 1rem;
	color: #95aac9;
}

.video-select-wrapper:hover {
	color: #000;
}

.video-preview {
	border: 1px solid #dee2e6;
	border-top-left-radius: 0.25rem;
	border-top-right-radius: 0.25rem;
	overflow: hidden;
}
.video-thumbnail {
	position: relative;
	aspect-ratio: 16/9;
	background-color: #f8f9fa;
}
.video-thumbnail img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.placeholder-thumbnail {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 2rem;
	color: #6c757d;
}
.video-info {
	background-color: #fff;
	border-top: 1px solid #dee2e6;
}

.course-module-list-p {
	width: 100%;
	display: flex;
	flex-direction: column;
	row-gap: 1.5rem;
	/* max-height: calc(100vh - 18rem);
	height: calc(100vh - 18rem); */
	overflow-y: auto;
	width: 100%;
}

.course-module {
	border-radius: 0.5rem;
	border: 1px solid #e2ebf6;
}
.course-module-p {
	display: flex;
	border-radius: 0.5rem;
	border: 1px solid #e2ebf6;
}
.course-module-header-p {
	/* position: sticky;
	top: 0; */
	background-color: #fbfbfb;
	padding: 0.75rem 1rem;
	border-top-right-radius: 0.5rem;
	border-bottom: 1px solid #e2ebf6;
	color: #383838;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	z-index: 10;
}
.course-module-header-p h1 {
	font-size: 1rem !important;
	line-height: 1.25rem !important;
	font-weight: 500;
}
.course-module-title-p > button {
	background-color: transparent;
	border: none;
	border-radius: 0.5rem;
	cursor: grab !important;
}
.course-module-title-p > button > svg {
	width: 1rem;
	height: 1rem;
	color: #383838;
}
.course-module-title-p > button:hover {
	opacity: 0.6;
}
.course-module-body-p {
	border-end-end-radius: 0.5rem !important;
	background-color: #fff;
}
.module-lesson-p {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.75rem 1rem;
	padding-left: 1.5rem;
	border-bottom: 1px solid #e2ebf6;
	color: #383838;
}
.module-lesson-p:last-child {
	border-bottom: 0 !important;
	border-end-end-radius: 0.5rem !important;
	border-end-start-radius: 0.5rem !important;
}
.lesson-info {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex: 1 1 0%;
}

.lesson-info > h2 {
	font-size: 0.9rem !important;
	line-height: 1.25rem !important;
	font-weight: 500;
}

.lesson-info > p {
	font-size: 0.8rem !important;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
}
.module-drag-button {
	border: none;
	background-color: transparent;
	height: 100%;
	padding: 1rem 0.25rem;
}

.module-drag-button:hover {
	opacity: 0.6;
}

.module-drag-button > svg {
	width: 1rem;
	height: 1rem;
	flex-shrink: 0;
}

.cursor-grabbing {
	cursor: grabbing !important;
}
.cursor-grab {
	cursor: grab !important;
}

@media (min-width: 768px) {
	.navbar-sub {
		padding-left: 1.5rem;
	}

	.order-status-card {
		margin-top: 5rem !important;
	}

	.navbar-subitem {
		padding-left: 0.5rem;
	}

	.tiers-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-template-rows: repeat(2, minmax(0, 1fr));
		column-gap: 1rem;
		column-gap: 0.5rem;
	}

	.tier-price > span {
		font-size: 26px;
	}

	.right-slide {
		width: 45%;
	}

	.support-row {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-template-rows: repeat(2, minmax(0, 1fr));
	}
	.fb-pages-container {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 3.6rem;
		min-height: 30rem;
	}
}

@media (min-width: 1024px) {
	.dropdown-button > :first-child {
		width: 100% !important;
	}

	.dropdown-button > :first-child {
		width: 105px !important;
	}

	.message-container {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: 1rem;
	}

	.strip-container {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		grid-template-rows: repeat(1, minmax(0, 1fr));
		column-gap: 10px;
	}

	.strip-container > form {
		grid-column: span 2 / span 2;
	}

	.strip-wrapper {
		grid-column-start: 3;
		order: 9999;
	}

	.tiers-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		column-gap: 1rem;
	}

	.right-slide {
		width: 35%;
	}
	.support-row {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		grid-template-rows: repeat(1, minmax(0, 1fr));
	}
	.icon-list {
		grid-template-columns: repeat(8, minmax(0, 1fr));
	}
}

@media (min-width: 1280px) {
	.tiers-grid {
		grid-template-columns: repeat(5, minmax(0, 1fr));
		column-gap: 1rem;
	}

	.category-form-body {
		grid-template-columns: repeat(4, minmax(100px, 1fr));
		grid-template-rows: repeat(1, minmax(0, 30px));
		column-gap: 0.5rem;
		row-gap: 0.5rem;
	}

	.module-detail-text {
		height: 250px;
		flex-grow: 1;
	}
}