/* CSS Document */

/*************************
 * Site Navigation
 ************************/
a#nav-open-btn,
section#nav a.close-nav {
  display: none;
}

.primary-nav {
  background-color: #c10435;
  width: 100%;
  margin: 0;
  overflow: hidden;
}

ul.main-nav {
  margin: 0;
  padding: 0;
  list-style: none;
}

ul.main-nav li {
  float: left;
}

ul.main-nav li a {
  padding: 10px;
  color: #ddd;
  display: block;
  text-decoration: none;
  font-size: 0.9em;
}

ul.main-nav li a:hover {
  color: #fff;
  background-color: rgba(0, 0, 0, 0.45);
}

ul.main-nav li a.apply_now {
  color: #fff;
  font-weight: bold;
  background: rgba(0, 0, 0, 0.25);
}

ul.main-nav li a:hover.apply_now {
  background: rgba(0, 0, 0, 0.5);
}

ul.main-nav a.covid19_link {
  background-color: #efaa23;
  color: #222;
  font-weight: bold;
}

ul.main-nav a.covid19_link:hover {
  background-color: #eac479;
  color: inherit;
}

/*************************
 * Secondary Navigation
 ************************/
.secondary-nav {
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.secondary-nav {
  max-width: 1200px;
  overflow: visible;
}

ul.subnav {
  margin: 0;
  padding: 0;
  list-style: none;
}

.secondary-nav,
.secondary-nav > ul ul {
  overflow: hidden;
  background-color: #333;
  margin: 0;
  padding: 0;
}

.secondary-nav li,
.secondary-nav > ul > li {
  display: block;
}

.secondary-nav a {
  text-decoration: none;
}

.secondary-nav li a {
  margin: 0;
  color: #fff;
  display: block;
  padding: 10px;
  border-bottom: 1px solid #808080;
  position: relative;
  text-decoration: none;
  font-size: 0.8em;
}

.secondary-nav > ul {
  border-radius: 4px;
}

.secondary-nav > ul > li > a {
  border-right: 1px solid #666;
  border-bottom: none;
}

.secondary-nav ul > li a:hover {
  background-color: rgba(0, 0, 0, 0.25);
}

.subnav li i.fa-caret-down {
  display: inline-block;
}

.secondary-nav {
  margin: 20px auto 0;
  max-height: 55em;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

.secondary-nav ul {
  padding: 0px;
  margin: 0px;
  list-style: none;
  position: relative;
}

.secondary-nav ul {
  list-style: none;
  background: #333;
  color: #fff;
}

.secondary-nav ul {
  list-style: none;
  margin: 0;
}

.secondary-nav ul li a {
  display: block;
  padding: 10px;
  color: #fff;
  text-decoration: none;
}

.secondary-nav ul:after {
  content: "";
  clear: both;
  display: block;
}

.secondary-nav ul li {
  padding: 0px;
}

.secondary-nav > ul > li {
  float: left;
}

nav#submenu {
  border-radius: 4px;
}

.secondary-nav > ul.subnav > li.navbar-social-links {
  float: right;
  position: absolute;
  right: 0;
  display: inline;
}

.secondary-nav > ul.subnav > li.navbar-social-links a {
  display: inline-block;
  border: none;
}

/**** These styles were in the media query, but break in IE 8 and below **/
.secondary-nav {
  max-width: 1200px;
  overflow: visible;
}

.secondary-nav,
.secondary-nav > ul ul {
  max-height: 55em;
}

.secondary-nav ul ul {
  display: none;
  position: absolute;
  top: 100%;
  min-width: 160px;
  background-color: #f4f4f4;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

.secondary-nav ul li:hover > ul {
  display: block;
  z-index: 10;
}

.secondary-nav ul ul > li {
  position: relative;
}

.secondary-nav ul ul > li a {
  min-width: 170px;
  font-size: 0.75em;
  /* height: auto; */
  background-color: #fff;
  color: #333;
  display: block;
  z-index: 100;
  position: relative;
  border-top: 1px solid #ddd;
  border-bottom: none;
  -webkit-transition: background-color 0.2s ease-out;
  -moz-transition: background-color 0.2s ease-out;
  -ms-transition: background-color 0.2s ease-out;
  -o-transition: background-color 0.2s ease-out;
  transition: background-color 0.2s ease-out;
}

.secondary-nav ul ul > li a.first-item {
  border-top: none;
}

.secondary-nav ul ul > li a:hover {
  background-color: #333;
  color: #fff;
}

/**********************************
 * JS styles for off canvas
 *********************************/
#outer-wrap {
  position: relative;
  overflow: hidden;
  width: 100%;
}

#inner-wrap {
  position: relative;
  width: 100%;
}

@media screen and (min-width: 881px) {
  /* Navigation Menu */
  section#nav ul li {
    border-bottom: none;
  }

  section#nav:target {
    left: 0;
    top: 0;
  }
}

@media screen and (max-width: 1250px) {
  .secondary-nav > ul.subnav > li.navbar-social-links a.social-low-priority {
    display: none;
  }
}

@media screen and (max-width: 1090px) {
  .secondary-nav > ul.subnav > li.navbar-social-links {
    display: none;
  }
}

@media screen and (max-width: 1020px) {
  .secondary-nav li.priority-low {
    display: none;
  }
}

@media screen and (max-width: 880px) {
  /* Remove that darn border radius around sub nav */
  nav#submenu,
  .secondary-nav > ul {
    border-radius: 0;
  }

  .secondary-nav > ul > li > a {
    border-right: none;
  }

  .secondary-nav > ul ul {
    overflow: hidden;
    max-height: 0;
    background-color: #333;
    margin: 0;
    padding: 0;
  }

  .secondary-nav > li > ul.sub-menu {
    padding: 0;
    margin: 0;
    border: none;
  }

  .secondary-nav.active,
  .secondary-nav > ul ul.active {
    max-height: 55em;
  }

  .secondary-nav li,
  .secondary-nav > ul > li {
    display: block;
  }

  .secondary-nav ul li:hover > ul {
    display: none;
  }

  .subnav li i.fa-caret-down {
    display: none;
  }

  a.close-nav img {
    width: 30px;
  }

  section#nav {
    padding-top: 1em;
  }

  a#nav-open-btn {
    display: inline-block;
    width: 30px;
    height: 30px;
    background-image: url("../img/menu-btn.png");
    background-size: 30px;
    background-color: transparent;
    background-repeat: no-repeat;
    text-decoration: none;
    text-indent: -100%;
  }

  section#nav a.close-nav {
    text-decoration: none;
    color: #fff;
    display: block;
    padding: 5px;
    margin: 0 0 1em 0;
  }

  /* left out */
  section#nav {
    z-index: 100;
    top: 0;
    background: #c10435;
    background: #333;
    height: 100%;
    /* min-width: 70%; */
    width: 270px;
    position: absolute;
    /* left: -100%; */
    left: -270px;
    -webkit-transition: left 0.3s ease-in-out;
    -moz-transition: left 0.3s ease-in-out;
    -ms-transition: left 0.3s ease-in-out;
    -o-transition: left 0.3s ease-in-out;
    transition: left 0.3s ease-in-out;

    /*
		-webkit-box-shadow: inset -1.5em 0 1.5em -0.75em rgba(0, 0, 0, 0.25);
		-moz-box-shadow: inset -1.5em 0 1.5em -0.75em rgba(0, 0, 0, 0.25);
		box-shadow: inset -1.5em 0 1.5em -0.75em rgba(0, 0, 0, 0.25);
		*/
  }

  section#nav:target {
    left: 0;
    top: 0;
  }

  section#nav ul li {
    display: block;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    float: none;
  }

  section#nav ul li a {
    display: block;
    padding: 10px;
    color: #fff;
    text-decoration: none;
  }

  section#nav ul li.navbar-social-links a {
    display: inline-block;
  }

  section#nav ul li a:hover {
    background: rgba(0, 0, 0, 0.25);
  }

  .primary-nav {
    background: transparent;
  }

  /**** Secondary Navigation ******/

  .secondary-nav {
    background: transparent;
  }

  section#nav .secondary-nav ul li a:hover {
    background: rgba(0, 0, 0, 0.75);
  }

  .secondary-nav ul li {
    margin-right: 0;
    float: none;
  }

  .secondary-nav {
    margin: 0;
  }

  section#nav ul.subnav li.navbar-social-links {
    float: none;
    position: static;
    display: inline-block;
    border: none;
  }

  .secondary-nav > ul.subnav > li.navbar-social-links a {
    display: block;
    border: none;
  }

  /**********************************
	 * JS styles for off canvas
	 *********************************/
  .js-ready #nav {
    z-index: 100;
    top: 0;
    background: #c10435;
    background: #333;
    height: 100%;
    width: 70%;
    width: 270px;
    position: absolute;
    left: -100%;
    left: -270px;

    /*
		-webkit-box-shadow: inset -1.5em 0 1.5em -0.75em rgba(0, 0, 0, 0.25);
		-moz-box-shadow: inset -1.5em 0 1.5em -0.75em rgba(0, 0, 0, 0.25);
		box-shadow: inset -1.5em 0 1.5em -0.75em rgba(0, 0, 0, 0.25);
		*/
  }

  .js-ready #nav .close-nav {
    display: block;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
    opacity: 0.7;
  }
  .js-ready #nav .close-nav:focus,
  .js-ready #nav .close-nav:hover {
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    opacity: 1;
  }

  .js-ready #nav {
    left: -70%;
    left: -270px;
  }

  .js-ready #inner-wrap {
    left: 0;
  }

  .js-nav #inner-wrap {
    left: 70%;
    left: 270px;
  }

  /* Transitions for the JS version */
  .csstransforms3d.csstransitions.js-ready #nav {
    left: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    -moz-transform: translate3d(-100%, 0, 0);
    -ms-transform: translate3d(-100%, 0, 0);
    -o-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
  }
  .csstransforms3d.csstransitions.js-ready #inner-wrap {
    left: 0 !important;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: -webkit-transform 500ms ease;
    -moz-transition: -moz-transform 500ms ease;
    -o-transition: -o-transform 500ms ease;
    transition: transform 500ms ease;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
  }

  .csstransforms3d.csstransitions.js-nav #inner-wrap {
    -webkit-transform: translate3d(270px, 0, 0) scale3d(1, 1, 1);
    -moz-transform: translate3d(270px, 0, 0) scale3d(1, 1, 1);
    -ms-transform: translate3d(270px, 0, 0) scale3d(1, 1, 1);
    -o-transform: translate3d(270px, 0, 0) scale3d(1, 1, 1);
    transform: translate3d(270px, 0, 0) scale3d(1, 1, 1);
  }

  .csstransforms3d.csstransitions.js-ready #nav .block {
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
    opacity: 0.7;
    -webkit-transition: opacity 300ms 100ms, -webkit-transform 500ms ease;
    -webkit-transition-delay: ease, 0s;
    -moz-transition: opacity 300ms 100ms ease, -moz-transform 500ms ease;
    -o-transition: opacity 300ms 100ms ease, -o-transform 500ms ease;
    transition: opacity 300ms 100ms ease, transform 500ms ease;
    -webkit-transform: translate3d(270px, 0, 0) scale3d(0.9, 0.9, 0.9);
    -moz-transform: translate3d(270px, 0, 0) scale3d(0.9, 0.9, 0.9);
    -ms-transform: translate3d(270px, 0, 0) scale3d(0.9, 0.9, 0.9);
    -o-transform: translate3d(270px, 0, 0) scale3d(0.9, 0.9, 0.9);
    transform: translate3d(270px, 0, 0) scale3d(0.9, 0.9, 0.9);
    -webkit-transform-origin: 50% 0%;
    -moz-transform-origin: 50% 0%;
    -ms-transform-origin: 50% 0%;
    -o-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
  }

  .csstransforms3d.csstransitions.js-nav #nav .block {
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}