@font-face {
  font-family: "Roboto";
  src: url("/css/fonts/Roboto/roboto-bold-webfont.woff2") format("woff2"),
    url("/css/fonts/Roboto/roboto-bold-webfont.woff") format("woff");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "Roboto";
  src: url("/css/fonts/Roboto/roboto-medium-webfont.woff2") format("woff2"),
    url("/css/fonts/Roboto/roboto-medium-webfont.woff") format("woff");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "Roboto";
  src: url("/css/fonts/Roboto/roboto-regular-webfont.woff2") format("woff2"),
    url("/css/fonts/Roboto/roboto-regular-webfont.woff") format("woff");
  font-weight: 400;
  font-style: normal;
}

body {
  font-family: "Roboto", Arial, Helvetica Neue, Helvetica, sans-serif;
  font-weight: 400;
  color: #2e313b;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Roboto", Arial, Helvetica Neue, Helvetica, sans-serif;
  font-weight: 500;
}

#topBarMiniNav {
  background-color: #2d303a;
}
#topBarMiniNav a {
  color: white;
}
#topBarMiniNav a.standout {
  color: #f8cc37;
}
#topBarBanner .banner--phone a {
  line-height: 75px;
  font-size: 2em;
  text-decoration: none;
  color: #2d303a;
  padding-right: 15px;
}
#topBarBanner .banner--image img {
  max-width: 100%;
  width: 330px;
}

@media (max-width: 575px) {
  #sideload-middle > div.row > div.col-12 {
    padding-left: 8px;
    padding-right: 8px;
  }
  .card-body {
    padding: 8px;
  }
  .formio-component .radio,
  .formio-component .checkbox {
    font-size: 13px;
  }
  #topMain {
    margin-top: -50px !important;
  }
}

@media (max-width: 325px) {
  #sideload-middle > div.row > div.col-12 {
    padding-left: 10px;
    padding-right: 10px;
  }
  .card-body {
    padding: 5px;
  }
  .call-link {
    font-size: 14px;
  }
  #topBar .logo img {
    height: 60%;
    max-width: 100%;
  }
}

/*menu nav tweaks*/
@media (min-width: 992px) {
  .mobileNav {
    display: none !important;
  }
}

.mobileNav_menuWrap {
  background-color: #3c3f48;
  text-transform: uppercase;
  cursor: pointer;
  color: #fff;
  line-height: 50px;
  font-size: 1.25rem;
  font-weight: 700;
  white-space: nowrap;
}
.mobileNav_callWrap {
  background-color: #f8cc37;
  text-transform: uppercase;
  cursor: pointer;
  color: #fff;
  line-height: 50px;
  font-size: 1.25rem;
  font-weight: 700;
}
.call-link {
  float: right;
  color: #3c3f48;
  white-space: nowrap;
}
@media (min-width: 992px) {
  .navbar-nav .nav-item {
    padding: 0px 20px;
    font-weight: bold;
  }
}
@media (min-width: 1202px) {
  .navbar-nav .nav-item {
    padding: 0px 30px;
    font-weight: bold;
  }
}
.navbar-nav .nav-item:first-child {
  padding-left: 0px;
}
.navbar-nav .nav-item:last-child {
  padding-right: 0px;
}

@media (max-width: 992px) {
  .navbar-light {
    /*background-color: #f8cc37!important;*/
    background-image: url(/images/bg-mobile-menu.jpg);
    background-repeat: no-repeat;
    background-position-x: 24.5%;
    background-position-y: -4px;
  }
  /* change the brand and text color */
  .navbar-light .navbar-brand,
  .navbar-light .navbar-text {
    color: #3c3f48 !important;
  }
  /* change the link color */
  .navbar-light .navbar-nav .nav-link {
    color: #3c3f48 !important;
  }
  /* change the color of active or hovered links */
  .navbar-light .nav-item.active .nav-link,
  .navbar-light .nav-item:hover .nav-link {
    color: #5c616e !important;
  }
  .navbar-toggler.button {
    background-color: #3c3f48 !important;
    color: #9a9da0;
  }
  .navbar-light .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.5%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
  }
}
