* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html,body {
  height:100%;
  max-height:100%;
  background-image: url('bg_w_250.png');
  background-repeat: repeat;
}

.outer_shell {
  width: 100%;
  min-height: 80vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 50px 8%;
  flex-direction: column;
  background-image: 'bg_w.png';
  background-repeat: repeat;
}

.header {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-items: center;
}
.header .title {
  font-size: 5em;
  font-family: 'Passion One';
}
.header .subtitle {
  margin-top:-.65em;
  font-size: 3em;
  font-family: 'Shadows Into Light';
  text-shadow: 0px -3px 1px #fff;



  transform: rotate(-5deg);


  /* Legacy vendor prefixes that you probably don't need... */

  /* Safari */
  -webkit-transform: rotate(-5deg);

  /* Firefox */
  -moz-transform: rotate(-5deg);

  /* IE */
  -ms-transform: rotate(-5deg);

  /* Opera */
  -o-transform: rotate(-5deg);

  /* Internet Explorer */
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

}

.img_gallery {
  width: 85%;
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(250px, 1fr));
  grid-gap: 20px;
}
.img_gallery img {
  width: 100%;
  height: 100%; 
  object-fit: cover;
  border: solid 5px transparent;
}
.img_gallery img:hover {
    border-color: black;
    transition: 0..25s;
}

.lightbox {
  position:fixed;
  top:-100%;
  bottom:100%;
  left:0;
  right:0;
  background: rgba(0, 0, 0, 0.85);
  z-index:501;
  opacity:0;
}

.lightbox img {
	position:absolute;
  margin:auto;
  top:0;
  left:0;
  right:0;
  bottom:0;
  max-width:0%;
  max-height:0%;
}


.lightbox:target {
  top:0%;
  bottom:0%;
  opacity:1;
}

.lightbox:target img {
  height: auto; 
  width: auto; 
  max-height: 75%; 
  max-width: 75%; 
}

.overlay {
  position: absolute; 
  /* background: rgba(57, 57, 57, 0.5); */

  /* center overlay text */
  display: flex;
  align-items: center;
  justify-content: center;
}

.overlay_0 {
  inset: 0;
}

.overlay_1 {
  inset: 0;
  color: white;
  text-decoration: none;
}

.overlay_1:visited {
  color: white;
}

.text {
  width: 100%;
  padding-top: 50rem;
  font-family: 'Shadows Into Light';
  font-size: 2em;
  text-shadow: 2px 2px 1px #000;
}