.home .search {
	margin-top: 4rem; padding: 2rem 4rem;
	border-radius: 3rem; border: 2px solid #0F8D45; background-color: #fafafa;
}

/* Menu */
.home .search .menu {display: flex; justify-content: space-around; margin-bottom: 2rem;}
.home .search .menu-item {
	display: flex; flex-direction: row; width: 100%; height: 190px;
	align-items: center; justify-content: space-between;
}
.home .search .menu-item i {
	display: block; cursor: pointer; width: 150px; height: 150px;
	line-height: 150px; text-align: center; font-size: 3.5rem;
	border: 3px solid transparent; border-radius: 50%;
	background:
		linear-gradient(white, white) padding-box,
		linear-gradient(to left, var(--blue-lighter), var(--green-main)) border-box;
}
.home .search .menu-item.active i {
	color: white;
	background:
		linear-gradient(to top, var(--blue-lighter), var(--green-main)) padding-box,
		linear-gradient(to top, var(--blue-lighter), var(--green-main)) border-box;
}
.home .search .menu-item.active i,
.home .search .menu-item:not(.active) i:hover {width: 160px; height: 160px; line-height: 160px; margin-top: -5px;}
.home .search .menu-item span {line-height: 1; font-size: 1.5rem; font-weight: bold; cursor: default;}

/* Type & Col */
.home .search .type {display: none; justify-content: space-between;}
.home .search .type.active {display: flex; flex-direction: column;}
.home .search .col {display: flex; flex-direction: column;}

/* Col Part */
.home .search .part {position: relative;}
.home .search .part + .part {display: none;}
.home .search .part + .part.active,
.home .search .part + .part.selected {display: block; margin-top: 2.5rem;}

.home .search .part .title {
	text-align: center; line-height: 4rem; font-size: 1.6rem; font-weight: bold;
	border-radius: 20px; background-color: var(--blue-lightest); cursor: default;
}

.home .search .part .value {
	text-align: center; line-height: 4rem; font-size: 1.7rem; color: white;
	border-radius: 20px; background-color: var(--blue-main); cursor: pointer;
}
.home .search .part .value span {}
.home .search .part .value i {display: none; line-height: 4rem;}
.home .search .part .value:hover {padding: 0 1rem; text-align: right;}
.home .search .part .value:hover i {display: block; float: left;}

.home .search .part > div {display: none;}
.home .search .part.active .items-wrap,
.home .search .part.active .datepicker,
.home .search .part.selected .value {display: block;}

/* Part Items */
.home .search .col + .col {margin-top: 2rem;}
.home .search .col .items-wrap {
	position: absolute; top: 5rem; right: 0; z-index: 1;
	width: 100%; max-height: 420px; border-radius: 20px; overflow: hidden;
}
.home .search .col .items {
	max-height: 420px; margin: 0; overflow: auto;
	border-radius: 20px; background-color: var(--blue-lightest);
}
.home .search .col .items::-webkit-scrollbar {width: 10px;}
.home .search .col .items::-webkit-scrollbar-thumb {background-color: var(--blue-main);}
.home .search .col .items::-webkit-scrollbar-track {background: var(--blue-light);}

/* Part Item */
.home .search .col .item {
	padding: 0 1rem; cursor: pointer;
	line-height: 42px; font-size: 1.5rem;
}
.home .search .col .item:hover {background-color: var(--blue-light);}
.home .search .col .item.active {background-color: var(--blue-main); color: white;}
.home .search .col .item.empty {
	background-color: #ffe8e8; color: #900; cursor: default;
	text-align: center; line-height: 4rem; font-size: 1.7rem;
}
.home .search .col .item i {/* ToDo: eye */}

/* Elements */
.home .search .col.date .part.day .ui-datepicker {width: 110%; margin-right: -5%;}

/* Order */
.home .search-order {
	display: none; align-items: center; gap: 3rem; margin-top: 1rem; padding: 2rem 4rem;
	border-radius: 3rem; border: 2px solid #0F8D45; background-color: #fafafa;
}
.home .search-order.shown {display: flex; flex-direction: column;}

.home .search-order div:not([class]) {
	display: flex; flex-direction: column;
	justify-content: center; align-self: flex-start;
}
.home .search-order div:not([class]) span {font-size: 1rem;}
.home .search-order div:not([class]) b {margin-top: 1rem; line-height: 1.2; font-size: 1.4rem;}

.home .search-order div.price {margin: 1rem auto 0;}
.home .search-order div.price b {font-size: 2.5rem; color: var(--green-main);}
.home .search-order div.price span {font-size: 2rem; color: #777; padding-right: .5rem;}

.home .search-order div.submit .button {
	width: 120px; height: 60px; line-height: 60px !important; margin: 0; font-size: 1.5rem;
}

@media screen and (min-width: 40em) {
	.home .search .menu-item {width: 160px; flex-direction: column;}

	.home .search .type {height: 350px;}
	.home .search .type.active {flex-direction: row;}

	.home .search .col + .col {margin-top: unset;}
	.home .search .col {width: 22%;}

	.home .search-order {gap: 5rem;}
	.home .search-order.shown {flex-direction: row;}
}