body {
  background-image: url('/assets/triangle.jpg');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;}
    h1 {
   text-shadow: 0px 0px 10px white}
   h2 {
   text-shadow: 0px 0px 10px white}
   h3 {
   text-shadow: 0px 0px 10px white}
   
   img {
  filter: drop-shadow(0px 0px 10px white);
}

h1, h2 { font-family: Frutiger, Helvetica, sans-serif; }

.container {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.title {
  font-size: 13px;
  letter-spacing: 2px;
  margin-bottom: 30px;
  color: #6a6a6a;
  text-transform: lowercase;
}

/* old #f4f4f2 18px  #bfbfbf 1px*/
.frame {
  background: #454545;
  padding: 9px;
  border: 2px solid #1c1c1c;
  box-shadow:
    inset 0 0 30px rgba(0,0,0,0.05),
    0 20px 40px rgba(0,0,0,0.15);
}

.frame img {
  max-width: 80vw;
  max-height: 70vh;
  display: block;
  filter:
    contrast(0.95)
    brightness(1.05)
    saturate(0.9);
}

.caption {
  margin-top: 16px;
  font-size: 12px;
  color: #777;
  text-align: center;
  letter-spacing: 1px;
}

.footer {
  margin-top: 60px;
  font-size: 11px;
  color: #8a8a8a;
  letter-spacing: 1px;
}

@keyframes flicker {
  0% { opacity: 1; }
  50% { opacity: 0.97; }
  100% { opacity: 1; }
}

.flicker {
  animation: flicker 6s infinite ease-in-out;
}