/*!
 * Start Bootstrap - New Age v5.0.0 (https://startbootstrap.com/template-overviews/new-age)
 * Copyright 2013-2018 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-new-age/blob/master/LICENSE)
 */


#mainNav {
  border-color: rgba(34, 34, 34, 0.05);
  background-color: white;
  -webkit-transition: all .35s;
  transition: all .35s;
  font-family: 'IBM Plex Sans Thai Looped', sans-serif;
  font-weight: 200;
  letter-spacing: 1px;
}

#mainNav .navbar-brand {
  filter: invert(0);


}

#mainNav .navbar-brand:hover {
  filter: invert(0);
}

#mainNav .navbar-toggler {
  font-size: 12px;
  padding: 8px 10px;
  color: #222222;
}

#mainNav .navbar-nav > li > a {
  font-size: 12px;
  font-family: 'IBM Plex Sans Thai Looped', sans-serif;
  font-weight: 200;
  text-transform: uppercase;
}

#mainNav .navbar-nav > li > a.active {
  color: #A09B91 !important;
  background-color: transparent;
}

#mainNav .navbar-nav > li > a.active:hover {
  background-color: transparent;
}

#mainNav .navbar-nav > li > a,
#mainNav .navbar-nav > li > a:focus {
  color: #222222;
}

#mainNav .navbar-nav > li > a:hover,
#mainNav .navbar-nav > li > a:focus:hover {
  color: #A09B91;
}

@media (min-width: 1440px) {
  #mainNav {
    border-color: transparent;
    background-color: transparent;
  }
  #mainNav .navbar-brand {
    filter: invert(1);
  }
  #mainNav .navbar-brand:hover, #mainNav .navbar-brand:focus {
    color: white;
  }
  #mainNav .navbar-nav > li > a,
  #mainNav .navbar-nav > li > a:focus {
    color: rgba(255, 255, 255, 0.7);
  }
  #mainNav .navbar-nav > li > a:hover,
  #mainNav .navbar-nav > li > a:focus:hover {
    color: black;
  }
  #mainNav.navbar-shrink {
    border-color: rgba(34, 34, 34, 0.1);
    background-color: white;
  }
  #mainNav.navbar-shrink .navbar-brand {
    filter: invert(0);
  }
  #mainNav.navbar-shrink .navbar-brand:hover {
    filter: invert(46%) sepia(14%) saturate(270%) hue-rotate(166deg) brightness(95%) contrast(91%);
  }
  #mainNav.navbar-shrink .navbar-nav > li > a,
  #mainNav.navbar-shrink .navbar-nav > li > a:focus {
    color: #222222;
  }
  #mainNav.navbar-shrink .navbar-nav > li > a:hover,
  #mainNav.navbar-shrink .navbar-nav > li > a:focus:hover {
    color: #A09B91;
  }
}