.bandContainer{
	position: 		relative;
	border: 		1px solid;
	margin: 		20px;
	border-radius: 	10px;
	overflow: 		hidden;
	width: 			calc( 100% / 6 - 42px);
}
.bandContainer:hover .bandName{
	height: 			calc(2em - 1px);
	backdrop-filter: 	blur(5px);
}
.band{
	position: 				relative;
	height: 				400px;
	width: 					100%;
	background-position: 	center;
	background-size: 		cover;
}
.bandName{
	background: 		rgba(0, 0, 0, 0.6);
	font-size: 			1.5em;
	text-align: 		center;
	position: 			absolute;
	bottom: 			0px;
	width: 				calc(100% - 10px);
	padding: 			5px;
	height: 			calc(25% - 1px);
	backdrop-filter: 	blur(10px);
	border-top: 		1px solid #fff;
	box-shadow: 		0px -5px 5px rgba(0, 0, 0, 0.6);
	justify-content: 	center;
	align-items: 		center;
	transition: 		all 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}
/* Extra large screens (1200px and up) */
@media (min-width: 1200px) {
	.bandContainer{
		width: calc( 100% / 5 - 42px);
	}
}

/* Large screens (992px - 1199px) */
@media (max-width: 1200px) {
	.bandContainer{
		width: calc( 100% / 4 - 42px);
	}
}

/* Medium screens (768px - 991px) */
@media (max-width: 992px) {
	.bandContainer{
		width: calc( 100% / 3 - 42px);
	}
	.meniItem {
		font-size: 16px;
		padding: none;
	}
	#logoContainer img{
		width: 550px;
	}
}

/* Small screens (576px - 767px) */
@media (max-width: 768px) {
	.bandContainer{
		width: calc( 100% / 2 - 42px);
	}
	#menuContainer{
		display: none;
	}
}

/* Extra small screens (up to 575px) */
@media (max-width: 575px) {
}

/* Mobile devices (up to 480px) */
@media (max-width: 480px) {
}

/* Very small mobile devices (up to 320px) */
@media (max-width: 320px) {
}

