/* content and posts */

#posts {
  height: auto;
  padding-bottom: 0em;
  padding-top: 5em;
  padding-left: 0em;
  padding-right: 0em;

}

#posts #announcement1 {
  margin-left: 1vw;
  margin-right: 1vw;
  background-color: #f2f2e9;
}

#posts h1 {
  margin-top: 2em;
  margin-bottom: 2em;
  text-align: center;
}

#posts h2 {
  margin-top: 2em;
  margin-bottom: 1em;
  text-align: center;
}

#posts p.simple-paragraph {
  text-align: justify;
  padding: 5vw;
  padding-top: 0em;
  padding-bottom: 0em;
}

#posts #otherannouncement {
  padding: 0em;
}

#posts #otherannouncement h3 {
  color: #6c4131;
}

#posts #otherannouncement .card-group .card {
  border: 0;
}

.jumbotron p {
  text-align: justify;
  padding: 10vw;
  padding-top: 1em;
  padding-bottom: 1em;
}

.card-group {
  padding: 1em;
  margin-top: 0em;
  color: #d8b66e;
  text-shadow: 1px 1px #6c4131, -1px -1px #6c4131, 1px -1px #6c4131, -1px 1px #6c4131;
}

.card-title {
  text-align: left;
  padding: .5em;
  /* background-color: hsla(360, 0%, 0%, 0.5); */
}

.card-title img {
  max-width: 24px;
  max-height: 24px;
  opacity: 0.3;
  filter:invert();
}

.card-img-overlay {
  padding: 0!important;
}

.card img {
  height: 15em;
}


.img-popover {
  width: 100%;
  height: 100%;
  /* background-color: hsla(360, 0%, 0%, 0.2); */
  opacity: 0;
  transition: 0.5s ease-in-out;
  background-size: cover;
}

.img-popover h5 {
  margin: 0;
  text-align: center;
  padding: .5em;
}

.img-popover p {
  margin: 0;
}

.img-popover:hover {
  opacity: 1;
}

#img-popover1 {
  background-image: url("../images/amazing-waterfall-flowing-through-rocky-cliffs-on-overcast-623177-blur.jpg");
}

#img-popover2 {
  background-image: url("../images/architecture-boulder-building-canyon-355919-blur.jpg");
}

#img-popover3 {
  background-image: url("../images/people-in-boat-near-water-dam-1259924-blur.jpg");
}


.card .past-announcement {
  height: 25vh;
}

.card #past-announcement1 {
  background: url('../images/amazing-waterfall-flowing-through-rocky-cliffs-on-overcast-623177.jpg');
  background-size: cover;
}

.card #past-announcement2 {
  background: url('../images/architecture-boulder-building-canyon-355919.jpg');
  background-size: cover;
}

.card #past-announcement3 {
  background: url('../images/people-in-boat-near-water-dam-1259924.jpg');
  background-size: cover;
}

/* mobile */

@media only screen and (max-width: 767.9px) {
  #posts {
    padding: 1vw!important;
  }

  #posts p.simple-paragraph {
    padding-left: 1vw!important;
    padding-right: 1vw!important;
  }

  .jumbotron {
    margin: 1vw!important;
  }

  .jumbotron p {
    text-align: justify;
    padding: 5vw!important;
  }

  #posts #otherannouncement h3 {
    margin-top: 1em;
  }
}