/* Site-wide standard for the name/title block and the top nav.
   Name: Oswald 600, all caps, tight tracking (same as every project title).
   Title line and nav links: Barlow Semi Condensed 600, all caps.
   Nav links turn orange on hover (mouse devices only). */

.navigation-bar .logo.logo-type {
  font-family: "Oswald", "Arial Narrow", sans-serif; font-weight: 600; font-size: 28px; line-height: 1.05;
  letter-spacing: .3px; text-transform: uppercase; color: #fff;
}
.navigation-bar .logo.freelancer-text {
  margin-top: 4px; padding-top: 0; font-family: "Barlow Semi Condensed", "Arial Narrow", sans-serif; font-weight: 600;
  font-size: 13px; line-height: 1.2; letter-spacing: 1.5px; text-transform: uppercase; color: rgba(255, 255, 255, .62);
}

.navigation-bar .link-wrapper a,
.navigation-bar .link-wrapper .logo,
.navigation-bar .link-wrapper .link-2,
.navigation-bar .link-wrapper .text-block {
  font-family: "Barlow Semi Condensed", "Arial Narrow", sans-serif !important; font-weight: 600 !important; font-size: 15px !important;
  letter-spacing: 1.5px !important; text-transform: uppercase !important; text-decoration: none; transition: color .2s;
}
.navigation-bar .link-wrapper .text-block { color: #ff8200; }
.navigation-bar .link-wrapper .dot { transition: background-color .2s; }

@media (hover: hover) {
  .navigation-bar .link-wrapper a:hover,
  .navigation-bar .link-wrapper a:focus-visible { color: #ff8200 !important; outline: none; }
  /* Contact Me is already orange, so it flips to white */
  .navigation-bar .link-wrapper .linkboxbutton:hover .text-block,
  .navigation-bar .link-wrapper .linkboxbutton:focus-visible .text-block { color: #fff !important; }
  .navigation-bar .link-wrapper .linkboxbutton:hover .dot { background-color: #fff; }
}

@media screen and (max-width: 767px) {
  .navigation-bar .link-wrapper a,
  .navigation-bar .link-wrapper .logo,
  .navigation-bar .link-wrapper .link-2,
  .navigation-bar .link-wrapper .text-block { font-size: 13px !important; letter-spacing: 1px !important; }
}