.mosaic-container .text-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  transition: .6s ease;
  padding: 1rem; }

.mosaic-container .title,
.mosaic-container .subtitle {
  color: #89878C;
  text-align: center;
  font-weight: bold; }

.mosaic-container .title {
  font-size: 1.2rem;
  font-family: 'Open Sans', sans-serif;
  margin-top: 1rem !important;
  margin-bottom: 0px !important; }

.mosaic-container .subtitle {
  font-size: .9rem;
  font-family: 'Open Sans', sans-serif; }

.mosaic-container .text {
  font-size: .8rem;
  font-family: 'Open Sans', sans-serif;
  color: #002A40;
  padding-top: 1rem; }

.mosaic-container .mosaic-item-container.mosaic_hover:hover .text-container {
  background-color: #89878C; }

.mosaic-container .mosaic-item-container.mosaic_hover:hover .text {
  color: #FFFFFF; }

.mosaic-container .img-container {
  overflow: hidden;
  min-height: 350px; }

.mosaic-container .img-container img {
  width: auto;
  min-width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%); }

/*------------------------------ vertical bootstrap slider compatibility ----------------------------*/
.carousel-vertical .carousel-item > div:first-of-type {
  height: 100%; }

.carousel-vertical .mosaic-container, .carousel-vertical .mosaic-item-container {
  height: 100%; }

@media (max-width: 1400px) {
  .carousel-vertical .mosaic-item-container .text-container .row p, .carousel-vertical .mosaic-item-container .text-container .row span.text {
    font-size: 0.6rem; } }