/* This is the CSS template for the header for Yountville */

#header-background {
  background-color: #B2CEE7;
  color: #000000;
}

.upper-header-search {
  position: relative;
  top: 50px;
}

div.sfs-header .input-group-addon {
  background-color: #4E87A0;
}

.ipad-menu {
  background-color: #FCF3E3;
}

.ipad-menu ul {
  padding-inline-start: 0px !important;
  padding-left: 0px !important;
}

/* End ALL */

/* ----------- Smartphone Device Styles (XS)  ----------- */

@media (max-width: 767px) {

  #header-nav {
    background: white;
  }

  .navbar-brand {
    background-color: #FFFFFF;
    color: #000000 !important;
    background: url(/img/WCCTC-logo.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    height: 100px !important;
    width: 300px !important;
    padding: 0;
    position: relative;
    left: 10px;
    background-position: 0;
  }

  h1.header-logo {
    display: none;
    /* font-size: 14px;
    text-transform: uppercase;
    line-height: 22px;
    margin: 0px;
    letter-spacing: 1px;
    width: 340px;
    position: relative;
    top: 38px; */
  }

  .form-inline .input-group>.form-control {
    width: 100%;
  }

  .ipad-menu .navbar-nav {
    margin: 0px 0px;
    padding: 10px 0px 0px;
    float: right;
  }

}

/* End XS */

/* ---------------------- Tablet styles (SM)  ---------------------- */
@media (min-width: 768px) {

  .navbar-brand {
    background-color: #FFFFFF;
    color: #000000 !important;
    background: url(/img/WCCTC-logo.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    height: 160px;
    width: 200px;
    padding: 0;
    position: relative;
    background-position: center;
  }

  h1.header-logo {
    display: none;
    /* font-size: 14px;
    text-transform: uppercase;
    line-height: 22px;
    margin: 0px;
    letter-spacing: 1px;
    width: 340px;
    position: relative;
    top: 88px; */
  }

  .form-inline .input-group>.form-control {
    width: 220px;
  }

  form#search-form {
    position: relative;
    top: 0;
  }

  .ipad-menu .navbar-nav {
    margin: 0px 15px;
    padding: 0px 0px 0px;
    float: right;
  }

  .navbar-nav {
    margin: 0px 15px 0px 0px !important;
  }

  #admin-bar .navbar-nav,
  #admin-bar .navbar-collapse.collapse {
    margin-right: 0px !important;
    padding-right: 0px;
  }

}

/* End SM */

/* ----------- Desktops and laptops (MD) ----------- */
@media (min-width: 992px) {

  .ipad-menu {
    height: 0px;
    position: relative;
    right: -25px;
  }


  .ipad-menu .navbar-nav {
    padding: 0px 0px 0px;
  }


}

/* End MD */

/* ----------- Large Desktops (LG) ----------- */
@media (min-width: 1200px) {

  h1.header-logo {
    display: none;
    /* font-size: 15px;
    text-transform: uppercase;
    line-height: 22px;
    margin: 0px;
    letter-spacing: 1px;
    width: 555px;
    position: relative;
    top: 73px; */
  }

  .form-inline .input-group>.form-control {
    width: 300px;
  }

  .ipad-menu {
    top: 10px;
  }

}

/* End LG */