.featured-shot {
   position: relative;
   display: flex;
   justify-content: flex-start;
   align-content: flex-start;
   align-items: flex-start;
   height: 30vw;
   margin-top: 5em;
   background-color: #1EAAB4;
   overflow: hidden;
}

.featured-shot img {
   align-self: center;
}

.featured-shot::after {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   content: '';
   background-color: rgba(0, 0, 0, .5);
}

article {
   position: relative;
   display: flex;
   justify-content: center;
   margin-top: -7em;
   margin-left: 2em;
   margin-right: 2em;
   padding-bottom: 3em;
   background-color: #fff!important;
   box-shadow: 0em -1em 1em -.6em rgba(0, 0, 0, .3);
}

.article-container h1 {
   position: relative;
   margin-bottom: 1em;
   padding-top: 1em;
   font-size: 3em;
}

.article-container h2 {
   margin-top: 1em;
   margin-bottom: .5em;
   font-size: 1.5em;
   font-weight: 700;
}

.article-container h3 {
   margin-top: 1em;
   margin-bottom: 1em;
   font-size: 1.2em;
}

.article-container p {
   line-height: 1.5;
}

.article-container hr {
   margin-top: 1em;
   margin-bottom: 1em;
}

.article-container p+p {
   margin-top: 1em;
}

.article-container ul {
   margin-left: 4.8em;
   line-height: 1.4;
}

.article-container ul li {
   list-style-type: circle;
   color: #888;
}

.article-container h3 + ul {
   list-style: none;
}

.article-container .event-log li {
    display: flex;
    margin-bottom: .5em;
}

.article-container .event-log li time,
.article-container .event-log li address {
    display: flex;
    align-items: flex-start;
}

.article-container .event-log li time::before,
.article-container .event-log li address::before {
    min-width: 5em;
    justify-content: flex-start;
}

.article-container .event-log li:nth-child(1) time::before {
    content: 'Date:';
}
.article-container .event-log li:nth-child(2) time::before {
    content: 'Time:';    
}
.article-container .event-log li address::before {
    content: 'Venue:';
}

article .article-container {
   align-self: flex-start;
   max-width: 60em;
   padding: 2em;
   background-color: #fff;
   order: 2;
}

.article-container b {
   font-weight: 700;
}

.article-container q {
   font-style: italic;
   color: #888;
}

.article-container a {
   color: #009BFF;
   text-decoration: underline;
}

.article-container a {
   color: #009BFF;
   text-decoration: underline;
}


/** EVENT PHOTO GALLERY
**/

[event-photo-gallery] {
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   align-self: flex-start;
   width: 60%;
}

[feature-event-photo] {
   display: flex;
   justify-content: center;
   align-items: center;
   width: calc(100% - .1em);
   height: 25vw;
   margin-bottom: .05em;
   background-color: #000;
   overflow: hidden;
}

[feature-event-photo] img {
   display: flex;
   align-self: center;
   width: 100%;
   height: auto;
   transform: translateZ(0);
   animation: popin .7s forwards ease!important;
}

@-webkit-keyframes popin {
   0% {
      transform: scale(.9);
      opacity: 0;
   }
   100% {
      transform: scale(1);
      opacity: 1;
   }
}

@keyframes popin {
   0% {
      transform: scale(.9);
      opacity: 0;
   }
   100% {
      transform: scale(1);
      opacity: 1;
   }
}

[event-photo-container] {
   display: flex;
   flex-wrap: wrap;
   justify-content: flex-start;
   align-content: flex-start;
   align-items: flex-start;
   width: 100%;
   margin: 0;
   padding: 0;
}

[event-photo] {
   position: relative;
   display: inline-flex;
   flex-basis: calc(12.5% - .1em);
   align-items: center;
   min-width: calc(12.5% - .2em);
   height: 3.5vw;
   margin: .05em;
   padding: 0;
   list-style: none;
   background-color: #000;
   overflow: hidden;
}

[event-photo] img {
   top: 0;
   left: 0;
   display: flex;
}

@media only screen and (max-width: 1000px) {
   .featured-shot {
      height: 40vw;
   }
   article {
      flex-direction: column;
      margin: .5em;
      margin-top: -2em;
      padding-bottom: 0;
      box-shadow: none;
   }
   article .article-container {
      max-width: 100%;
      margin-right: 0;
      padding-bottom: 0;
      margin-bottom: 5em;
      order: 1;
   }
   article .article-container h1 {
      padding-top: .5em;
   }
   [event-photo-gallery] {
      min-width: 100%;
      box-shadow: none;
      order: 2;   }
   [feature-event-photo] {
      height: 50vw;
   }
   [event-photo] {
      height: 7vw;
   }
}

@media only screen and (max-width: 800px) {
   [event-photo] {
      flex-basis: calc(20% - .1em);
      min-width: calc(20% - .2em);
      height: 10vw;
   }
}


section.buttons-container {
   display: none;
}