html,
body {
	height: 100%;
}

body {
	/* display: flex; */
	/* padding-top: 40px; */
	/* padding-bottom: 40px; */
	/*background-color: #f5f5f5;*/
}
a {
	color: #333;
	text-decoration: none;
}

.left_box {
	float: left;
	text-align: left;
}
.left_box2 {
	float: left;
	text-align: left;
	margin-left: 3px;
}
.right_box {
	float: right;
	text-align: right;
}
.box_w {
	width: 70%;
}

.form-signin {
	align-items: center;
	width: 100%;
	max-width: 330px;
	padding: 15px;
	margin: auto;
}

.form-signin .checkbox {
	font-weight: 400;
}

.form-signin .form-floating:focus-within {
	z-index: 2;
}

.form_line {
	border: 1px;
	border-bottom-style: solid;
	border-top-style: none;
	border-left-style: none;
	border-right-style: none;
}
.text_box {
	padding: 13px 0;
}
.btn-primary {
	color: #fff;
	background-color: #41a6f9;
	border-color: #41a6f9;
}

.main-navigation {
	width: 100%;
	background: #ececec;
	text-align: center;
	position: fixed;
	bottom: 0;
}

.main-navigation div.row {
	width: 90%;
	margin: 0 auto;
}

.main-navigation img {
	width: 40%;
	opacity: 0.6;
}

.main-navigation div.bold {
	font-size: 0.8rem;
	color: #aaaaaa;
}

.main-navigation div.active img {
	opacity: 1;
}

.main-navigation div.active div.bold {
	color: #212529;
}

.class_list_box {
	padding-bottom: 6px;
}
.class_list_text {
	font-size: 1.5rem;
	padding: 0 5px;
	line-height: 5.6rem;
	margin-left: -5px;
	margin-right: 5px;
}
.class_list_text2 {
	float: left;
	font-size: 1.5rem;
	padding: 0 5px;
	line-height: 6rem;
	margin-left: -20px;
}
.class_box {
	background-color: #eee;
	border-color: #333;
	border-style: solid;
	border-width: 1px;
}
.class_box2 {
	width: 33%;
	display: inline-block;
	background-color: #eee;
	border-color: #333;
	border-style: solid;
	border-width: 1px;
	height: 5.7rem;
}
.class_box_light {
	float: right;
	width: 18%;
}
.class_list_box2 {
	padding-bottom: 6px;
	white-space: nowrap;
	overflow-y: auto;
	webkit-overflow-scrolling: touch;
	-ms-overflow-style: -ms-autohiding-scrollbar;
}
.class_box_light img {
	width: 85%;
	padding: 2px 0;
}
.taxi_name {
	display: inline-block;
	margin-bottom: 3px;
	color: #fff;
	width: 100%;
	font-size: 1.6rem;
	font-weight: 900;
	min-height: 65px;
}
.taxi_name2 {
	display: table;
	margin: 3px;
	color: #fff;
	width: 92%;
	font-size: 1.6rem;
	font-weight: 900;
}
.taxi_user.no_location {
	line-height: 65px;
	font-size: 1.6rem;
}
.taxi_user2.no_location {
	line-height: 63px;
	font-size: 1.6rem;
}
.taxi_station {
	font-size: 1.3rem;
}
.taxi_updated {
	font-size: 14px;
	margin-left: 3px;
	color: #4169e0;
	font-weight: bold;
}
.taxi_empty_color {
	background-color: #c99071;
}
.taxi_class_color {
	background-color: #64846b;
}
.taxi_null_color {
	background-color: #aaaaaa;
}
.driving_name {
	display: inline-block;
	color: #333;
	width: 100%;
	font-size: 1.8rem;
	font-weight: 900;
	margin-top: -10px;
	min-height: 65px;
}

.taxi_on {
	display: inline-block;
}
.taxi_on img {
	width: 90%;
	margin-top: -10px;
}
.class_light {
	color: #c0cf92;
}
.class_light.normal {
	color: #64846b;
}
.class_light.empty {
	color: #c99071;
}
.class_light.driving {
	color: #f7b852;
}
.class_light.offline {
	color: #cccccc;
}
.class_number_bg {
	color: #fff;
	width: 20px;
	height: 20px;
	line-height: 20px;
	text-align: center;
	border-radius: 50%;
	font-size: 0.8rem;
	background-color: #61b7d9;
	display: inline-block;
}
.list_but {
	padding-bottom: 10px;
}
.list_but img {
	width: 60%;
}
.list_but div.bold {
	margin-top: -5px;
}

.form-info {
	width: 100%;
	max-width: 330px;
	padding: 15px;
	padding-bottom: 90px;
	margin: 0 auto;
	overflow-x: hidden;
}

.form-info {
	-ms-overflow-style: none; /* for Internet Explorer, Edge */
	scrollbar-width: none; /* for Firefox */
	overflow-y: scroll;
}

.form-info::-webkit-scrollbar {
	display: none; /* for Chrome, Safari, and Opera */
}

.list-taxi li {
	padding: 6px 0;
}
.list-taxi li span {
	font-weight: 900;
	padding-left: 10px;
}
.title_user img {
	float: left;
	margin-right: 10px;
	/* padding: 0 10px 10px 0; */
}

.title_user img.in_car {
	border: 4px solid #30a24c;
	border-radius: 100px;
	box-shadow: 0px 1px 7px rgb(48 162 76 / 70%);
	cursor: pointer;
}

.title_user img.not_in_car {
	border: 4px solid #e3e3e3;
	border-radius: 100px;
	box-shadow: 0px 1px 7px rgb(0 0 0 / 70%);
	cursor: pointer;
}

.drive_area_bg {
	padding: 3px;
	color: #fff;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-color: #333;
}

nav ul {
	list-style: none;
	padding: 0;
	color: #333;
	margin: 0;
}

nav li {
	display: inline-block;
	width: calc(100vw / 3.4);
	padding: 5px 0;
}

nav li a {
	color: #333;
}
nav li a img {
	width: 40%;
}
nav p {
	font-size: 0.9em;
}

nav li:hover {
	transform: scale(1.2);
	transition: 1s;
}

/*bootstrap*/
.form-control {
	border-radius: 0rem;
	color: #999;
}

.row > * {
	max-width: 100%;
	padding-right: calc(var(--bs-gutter-x) / 8);
	padding-left: calc(var(--bs-gutter-x) / 8);
}

.hide {
	display: none !important;
}

.info-user-icon {
	width: 55px;
	height: 55px;
}

.info-user-name {
	line-height: 55px;
}

.bold {
	font-weight: bold !important;
}

.btn-function > img {
	opacity: 1;
}

.btn-function > div {
	color: #212529;
}
.btn-function.disabled > img {
	opacity: 0.6;
}

.btn-function.disabled > div {
	color: #aaaaaa;
}

.location_item {
	padding: 0px;
}

.taxi_location {
	display: inline-block;
	color: #212529;
	width: 100%;
	font-size: 1.5rem;
	font-weight: 900;
	min-height: 45px;
	line-height: 45px;
}

.taxi_location.active {
	color: #494949;
	background-color: #f7b852;
}

.input-driving-money {
	font-size: 1.2rem;
	margin-top: 10px;
	padding: 1rem;
}

.control_item {
	padding: 5px 30px;
	font-size: 1.5rem;
	text-align: center;
}

.control_item.active {
	color: #494949;
	background-color: #f7b852;
}

.apply_item {
	font-size: 1.5rem;
	margin-top: 10px;
	padding: 0.5rem;
	text-align: center;
	font-weight: bold;
}

.apply_item.active {
	color: #494949;
	background-color: #f7b852;
}

.now_assign_div {
	background: #ececec;
	padding: 5px;
}

.list-setting > li > input[type='checkbox'] {
	height: 0;
	width: 0;
	visibility: hidden;
}

.list-setting > li > label {
	cursor: pointer;
	width: 50px;
	height: 25px;
	background: #6c757d;
	display: block;
	border-radius: 100px;
	/* position: relative; */
	position: absolute;
	right: 30px;
}

.list-setting > li > label:after {
	content: '';
	position: absolute;
	top: 2px;
	left: 2px;
	width: 21px;
	height: 21px;
	background: #fff;
	border-radius: 90px;
	transition: 0.3s;
}

.list-setting > li > .switch-txt::before,
.list-setting > li > .switch-txt::after {
	display: block;
	color: #fff;
	font-weight: bold;
	box-sizing: border-box;
}

.list-setting > li > input:checked + label {
	background: #41a6f8;
}

.list-setting > li > label:active:after {
	width: 21px;
}

.list-setting > li > input:checked + label:after {
	left: calc(100% - 2px);
	transform: translateX(-100%);
}