/*
 File: wordpress/pages/commencement-stream/style.css
 URL:  wnmu.edu/pages/commencement-stream/style.css
*/

.main-body-content { padding-top: 0; }
.page-header-fg img { max-height: 70%; }
.main-heading { margin-bottom: 60px; }
.main-heading header { margin-bottom: 22px; ;font-size: 27px; font-weight: bold; }

.resources { margin: 80px 0 120px; }
.resources-content { display: grid; grid-template-columns: repeat(3, 1fr); grid-column-gap: 36px; }

@media (max-width: 700px) {
  .resources-content { grid-template-columns: repeat(1, 1fr);  grid-gap: 68px 0; }
}

.resources-content > * { text-decoration: none; background: hsl(0 0% 93%); border-radius: 20px; }

.resources-content .icon-container {
  display: flex; justify-content: center; align-items: center;
  padding: 36px 0;
  text-align: center;
  border-radius: 20px 20px 0 0;
  transition: all 0.5s ease-out;
}

.resources-content a:hover { filter: brightness(0.7); }
.resources-content svg { width: 132px; height: 132px; stroke: hsl(0 0% 100%); opacity: 0.6; }
.resources-content > *:nth-child(1) .icon-container { background: #F26522; }
.resources-content > *:nth-child(2) .icon-container { background: #12A79D; }
.resources-content > *:nth-child(3) .icon-container { background: #6F489D; }
.resource-descript { padding: 9px 25px 26px; color: hsl(0 0% 0%); }
.resource-descript header { margin-top: 12px; margin-bottom: 6px; font-weight: bold; }
.resource-descript p { font-size: 16px; line-height: 23px; }

.stream {
  margin-top: 40px;
}

.iframe-container {
  position: relative;
  width: 100%; height: 0;
  padding-bottom: 56.25%;
}

.iframe-container iframe {
  position: absolute; top: 0; left: 0;
  width: 100%; height: 100%;
  border: none; overflow: hidden; margin-top: 0;
}

@media only screen and (max-width: 500px) {
  .iframe-container iframe { margin-top:0; }
}