/*------------------------------------*\
  # GLOBAL STYLING
  # components universal to all pages
\*------------------------------------*/

.global-header,
.global-footer {
   width: 100%;

   grid-column: span 12 / auto;
}

.global-header {
   padding: 1.205em 1.75em;

   display: flex;
   align-items: center;
   justify-content: space-between;

   background-color: $color-globalbg;
   border-bottom: 1px solid $color-globalborder;

   a,
   a:link,
   a:hover,
   a:visited {
      color: $color-bodytext;
   }
}

.global-footer {
   background-color: $color-globalbg;
   border-top: 1px solid $color-globalborder;
   padding: 1.75em;

   font-size: $fontsize-small;
   text-align: center;

   p {
      width: 60%;
      margin-left: auto;
      margin-right: auto;
   }
}

.global-logo {
   padding: 0;
   margin: 0;

   font-size: $fontsize-med;
   font-variant-caps: small-caps;

   a {
      text-decoration: none;
   }
}

.global-favicon {
   max-width: 1em;
   margin-right: 0.25em;
   margin-bottom: -0.16em;
}

.global-search {
   padding-bottom: 2px;
}

.global-searchbar {
   padding: 0.2rem 1rem;
   border: 1px solid transparent;
   border-radius: 8px;
   font-size: $fontsize-small;
   transition: 0.25s;
   appearance: none;
   outline: none;
   line-height: 2rem;
}

.global-searchbar::placeholder {
   text-transform: uppercase;
}

.global-searchbar:hover {
   border: 1px solid $color-launchpadsearch;
   box-shadow: 0 0 6px $color-globalsearchbar;
}

.global-searchbar:focus {
   outline: none;
   border-color: $color-globalsearchbar;
   box-shadow: 0 0 6px $color-globalsearchbar;
   transition: 0.25s;
}

.global-search_submit {
   background: none;
   border: 0;

   font-size: $fontsize-small;
}

.global-nav {
   display: flex;
   align-items: center;
   justify-content: space-between;
}

.global-nav-link {
   display: inline-block;
   padding-top: 0.3rem;

   margin-right: 1.75rem;

   border-bottom: 2px solid #f6bf5d;

   font-size: $fontsize-small;
   text-decoration: none;
   text-transform: uppercase;
   &:hover {
      opacity: 0.75;
   }
}

.global-nav-link:visited {
   color: $color-bodytext;
}