body1 {
	 margin: 0;
	 min-height: 10vh;
	 background: #000;
	 font-family: sans-serif;
	 display: flex;
	 justify-content: center;
	 align-items: center;
}

 .container2 {
	 display: flex;
	 justify-content: center;
	 align-items: center;
	 margin: 25vmin;
	 overflow: hidden;
	 transform: skew(5deg);
}
 .container2 .card {
	 flex: 1;
	 transition: all 1s ease-in-out;
	 height: 75vmin;
	 position: relative;
}


 .container2 .card .card__head3 {
	 color: white;
	 background: ;
	 padding: 0.5em;
	 transform: scale (0%);
	 transform-origin: 0% 0%;
	 visibility: hidden;
	 transition: all 0.8s ease-in-out;
	 min-width: 10vmin;
	 text-align: justify;
	 position: absolute;
	 top: calc(50% - 2em);
	 bottom: 30vmin;
	 left: 9%;
	 font-size: 15px;
	 white-space: wrap;
}

 .container2 .card .card__head2 {
	 color: white;
	 background: ;
	 padding: 0.5em;
	 transform: scale (0%);
	 transform-origin: 0% 0%;
	 visibility: hidden;
	 transition: all 0.8s ease-in-out;
	 min-width: 15vmin;
	 text-align: justify;
	 position: absolute;
	 top: calc(50% - 2em);
	 bottom: 12%;
	 left: 5%;
	 font-size: 15px;
	 white-space: wrap;
}


 .container2 .card .card__head {
	 color: white;
	 background: #660000;
	 padding: 0.5em;
	 transform: rotate(-90deg);
	 transform-origin: 0% 0%;
	 transition: all 0.5s ease-in-out;
	 min-width: 100%;
	 text-align: center;
	 position: absolute;
	 bottom: 0;
	 left: 0;
	 font-size: 15px;
	 white-space: nowrap;
}
 .container2 .card:hover {
	 flex-grow: 50;
}
 .container2 .card:hover img {
	 filter: grayscale(0);
}
 .container2 .card:hover .card__head {
	 text-align: justify;
	 top: calc(100% - 2em);
	 color: white;
	 background: rgba(0, 0, 0, 0.5);
	 font-size: 2em;
	 transform: rotate(0deg) skew(-5deg);
}


 .container2 .card:hover .card__head2 {
	 visibility: visible;
	 text-align: left;
	 top: calc(65% - 2em);
	 width: 60vmin;
	 color: white;
	 background: rgba(0, 0, 0, 0.5);
	 font-size: 1.2em;
	 transform: rotate(0deg) skew(-5deg);
}

 .container2 .card:hover .card__head3 {
	 visibility: visible;
	 text-align: left;
	 top: calc(15% - 2em);
	 bottom: 45%;
	 min-width: 40vmin;
	 color: white;
	 background: rgba(0, 0, 0, 0.5);
	 font-size: 1.2em;
	 transform: rotate(0deg) skew(-5deg);
}

 .container2 .card img {
	 width: 100%;
	 height: 100%;
	 object-fit: cover;
	 transition: all 1s ease-in-out;
	 filter: grayscale(80%);
}
 .container2 .card:not(:nth-child(10)) {
	 margin-right: 1em;
	 
}