
article.card {
  height: 350px;
  border-radius: 3px;
  overflow: hidden;
}

article.card img{
	width: auto;
  height: 100%;
	object-fit: cover;
}

 article.card .infos {
  width: auto;
  height: 350px;
  position: absolute;
  background: var(--color-primary);
  transition: 0.4s 0.15s cubic-bezier(0.17, 0.67, 0.5, 1.03);
	transform: translateY(295px);

}
article.card .infos .title {
	font-family: 'Arial Narrow Bold', sans-serif;
	/* border: 1px solid red; */
  /* position: relative; */
	/* font-size: 20px; */
	padding: 10px 0;
  margin: 5px 0;
		color: var(--color-secondary);
	font-weight:900;
  /* color: #143e65; */
  /* text-transform: uppercase; */
}

article.card .infos .txt {
  color: rgb(255, 255, 255);
  opacity: 0;
  transition: 0.5s 0.25s cubic-bezier(0.17, 0.67, 0.5, 1.03);
}

article.card:hover .infos {
  transform: translateY(0px);
  background: rgba(48, 37, 1, 0.701);

}

article.card:hover .infos .title{
	/* color: red; */
	color: var(--color-primary);
  /* transition: 0.5s 0.25s cubic-bezier(0.17, 0.67, 0.5, 1.03); */

}
article.card:hover .infos .seats, article.card:hover .infos .txt, article.card:hover .infos .details {
  opacity: 1;
}




@media screen and (min-width: 974px) and (max-width: 1200px) {
  article.card .infos .title{
		font-size:small;
	}
}