.fade-in-out{
	opacity: 0;
	transition: opacity 0.5s ease;
}
.visible{
	opacity: 1;
}
.bg-light.border.rounded{
	background-color: #DDDDDD !important;
}
.cart-container {
	height: fit-content;
	position: fixed;
	right: 3rem;
	top: 6rem;
	padding: 1rem;
	background-color: #DDDDDD;
	border: 1px solid #3f2a14;
}
.product-image{
	width: 95%;
	border: 8px #3f2a14 solid;
	z-index: 999;
}
.order-title{
	padding: 2vh 0 2vh 2vw !important;
}
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
div.mobile-container{
	display: none !important;
}
@media (min-width: 500px) {
	#dropdownButton{
		display: none;
	}
}
@media (max-width: 991px) {
	.product-quantity{
		margin-top:0.5rem;
	}
	.product-select{
		margin-bottom:0.5rem;
	}
	.product-name{
		margin-top: 0rem;
	}
	.product-image{
		width:100%;
	}
	.order-title{
		text-align: center;
		padding: 0;
	}
	.order-content{
		width: 100vw;
		height: auto;
		position: relative;
	}
	.products{
		position: absolute;
		top: 0;
	}
	.extra-padding{
		padding-bottom: 200px;
	}
	.cart-container{
		position: relative;
		top: 0;
		right: 0;
		padding: 0.2rem 0.2rem 0.2rem 0.2rem;
		margin-bottom: 0.1rem;
		width: 100%;
		max-height: 200px;
		border: none;
		background-color: white;
	}
	.cart-container-wrapper{
		position: fixed;
		bottom: 0;
		width: 100%;
		background-color: white;
		padding: 0 0 1rem 0;
		border: 1px solid #3f2a14;
		transform: translateY(100%); /* starts below screen */
    	transition: transform 0.4s ease;
	}
	.on-screen{
		transform: translateY(0);
	}
	.btn-container{
		display: none;
	}
	div.mobile-container{
		display: flex!important;
	}
	#cart-list {
		margin-bottom: 0.2rem !important;
		max-height: 100px;
		overflow-y: scroll;
	}
}