/* Background */
.exhibitions {
  background-color: var(--grey);

  background-image: url(../../images/backgrounds/gold-metal-ring.jpg);

  /* Set a specific height */
  min-height: 500px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* Title */
.title {
  color: aliceblue;

  /* background: linear-gradient( to bottom, rgb(220, 223, 228) 50%, #061237);
	background-clip: text;
  -webkit-background-clip: text;
	-webkit-text-fill-color: transparent; */
}

/* Main Photo */
.main-photo {
  border: 1px solid grey;
  background-image: url("../../images/exhibitions/Επίπεδα/main.jpg");
}

/* Description */
.color-text-box {
  background: rgb(255,192,0);
  background: linear-gradient(-120deg, rgba(255,192,0,1) 40%, rgba(205, 153, 0, 0.879) 100%);
  margin-top: 5em;
}

.color-text-box p {
  color: rgb(74, 50, 50);
}

/* Video */
.overlayVideo {
  background-image: url("../../images/exhibitions/Επίπεδα ΙΙ/videoOverlay.png");
}

.video .caption {
  color: white;
}

/* Press */

.press h2 {
  text-align: center;
  justify-content: center;
  margin-left: 0em;
  font-size: large;
  font-weight: 300;
  font-family: -windows, windowsSystemFont, Segoe UI, 'Roboto', Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  color:rgb(49, 51, 223);
}
/* Διαβασε περισσοτερα */
.more-content {
  display: none;
}
.show-more {
  color: gray;
  cursor: pointer;
  font-weight: 400;
}

/* Photos Grid layout */
.custom-grid {
  display: grid;

  justify-content: end;
  align-items: stretch;
  column-gap: 15px;
  row-gap: 15px;

  grid-template-columns: (20% - 15px) 20% (20% - 15px) 20% (20% - 15px);
  grid-template-rows: repeat(8, 300px);
  grid-template-areas:
    "p16 p16 p15 p15"
    "p2 p4 p9 p10"
    "p2 p4 p9 p10"
    "p12 p13 p13 p17"
    "p6 p14 p7 p8"
    "p6 p14 p7 p8"
    "p5 p14 p7 p1"
    "p3 p11 p11 p1";
}

/* Media Queries */
@media only screen and (max-width: 992px) {
  .left .custom-grid,
  .right .custom-grid {
    display: grid;
    justify-content: center;
    grid-template-columns: 100%;
    grid-template-rows: repeat(19, 300px);
    column-gap: 15px;
    row-gap: 15px;
    grid-template-areas: 
      "p1"
      "p2"
      "p3"
      "p4"
      "p5"
      "p6"
      "p7"
      "p8"
      "p9"
      "p10"
      "p11"
      "p12"
      "p13"
      "p14"
      "p15"
      "p16"
      "p17"
      "p18"
      "p19";
  }
}