/******************************************************************
Stylesheet: page-gallery.php template
******************************************************************/
/******************************************************************
Site Name:
Author:

Stylesheet: Variables

Here is where we declare all our variables like colors, fonts,
base values, and defaults. We want to make sure this file ONLY
contains variables that way our files don't get all messy.
No one likes a mess.

******************************************************************/
/******************************************************************
Site Name:
Author:

Stylesheet: Typography

******************************************************************/
@import url("https://fonts.googleapis.com/css?family=Oswald:300,400,500,700&display=swap");
@import url("https://fonts.googleapis.com/css?family=EB+Garamond:400,400i,500,500i,600,700,700i&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,300;0,400;0,900;1,400&display=swap");
/******************************************************************
NOTE: Global Gallery Styles
******************************************************************/
#gallery {
  width: 90%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  max-width: 1400px;
  margin: 0 auto; }
  #gallery .gallery_dropdown {
    width: 100%;
    max-width: 400px;
    margin: 0 1em 1em 1em;
    padding: 0.2em 0.5em;
    border: none;
    font-family: "Oswald", sans-serif;
    font-size: 1.8em;
    background-color: #f7f7f2;
    color: #64666B; }
    #gallery .gallery_dropdown .gallery_item {
      font-weight: 400;
      font-size: 0.5em;
      padding: 0.5em;
      font-family: "Lato", sans-serif; }
      #gallery .gallery_dropdown .gallery_item:focus, #gallery .gallery_dropdown .gallery_item:hover {
        cursor: pointer;
        outline: none;
        background-color: #79643f; }
    #gallery .gallery_dropdown:focus {
      outline: none; }

.padding {
  margin-bottom: 1em; }

body {
  overflow: hidden; }

#loading._loaded {
  -webkit-animation: fadeOut 1s ease-out;
  animation: fadeOut 1s ease-out;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards; }

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1; }
  100% {
    opacity: 0;
    visibility: hidden; } }

@keyframes fadeOut {
  0% {
    opacity: 1; }
  100% {
    opacity: 0;
    visibility: hidden; } }
