/*                       Styles for slide shows on big screen - HTML5 and CSS3
                         ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/

/* NB redefined from common53.css - correct this */
@keyframes fade {
      0% { opacity: 1 ; }
    100% { opacity: 0 ; }
}
/* -------------------------------------------- Document-wide -- */
body, body#body { color: #fff ; background: #444 ; }
body, html body main, #ground, body#body, article#ground { width: 100vw ; height: 100vh ; margin: 0 ; padding: 0 ; }

html body main, #ground, article#ground { /* The background (modified by functions in slides53.js) */
    position: absolute ; top: 0 ; left : 0 ;
    background: transparent ;
}

/* -------------------------------------------- Content areas -- */
main h3, article h3 { display: none ; opacity: 0 }

figure {
    float: none; position: absolute ; 
    min-width: 0 ; margin: auto ;
}
/* Note IDs, screen &c, required by slides53.js */
#bigScreen {
    display: flex ; justify-content: center ; 
    position: absolute ; top: 2vh ; left: 2vw ; width: 96vw ; height: calc(94vh - 4ex) ; max-width: 96vw ;
    background: transparent ;
    padding: 0 ; margin: 0 ;
}
  figure img#screen, #bigScreen figure#screen, #bigScreen img {
      align-self: center ;
      width: auto ; max-width: 100% ; height: auto ; max-height: 100% ;
      background: transparent ; border: none ; 
      margin: 0 ; 
      cursor: not-allowed ;
  }
  #bigScreen img#screen[src$='svg'] { width: 100% ; } 
figure video { float: none ; width: 100% ; cursor: default ; }
                                  /* Modified by dissolveNext() in slides53.js */
  #screen { animation: none 0.1s ease-in-out 0 1 ; animation-fill-mode: forwards ; opacity: 1 ; }
    figcaption, #caption {
        position: absolute ; bottom: -5ex ; right: 2vw ;
        background: transparent ;
        width: 100% ; height: 3ex ; min-width: 50ex ; max-width: 90ex ; padding: 0 ;
        text-align: left ; font-size: 90% ;
    }
      figcaption cite, #caption cite {
          color: inherit ; background: transparent ;
          font-size: 95% ; font-weight: bold ;
      }
      #workTitle { float: right ; background: transparent ; margin: 0 0 4ex 10ex ; }
      #blurb, #workBy { clear: left ; float: left ; background: transparent ; }
        #blurb::first-letter { text-transform: uppercase }

nav:not(#menu) { margin: 7ex 0 0 0 ; }
[rel="prev"]:empty, [href*="goBack"]:empty, [onclick*="goBack"]:empty {
    color: #984 ; margin: 0 ; padding: 0 ;
}