/* Banner Top */
.banner-top {
  display: flex;
    justify-content: center;
  /*height: 10rem;*/
}
  .banner-top img {
    width: 100%;
  }

/******* NAVBAR *********/
nav.navbar {
  /*box-shadow: .2rem 0 1rem 0 hsla(0, 0%, 50%, .5);*/
  background-color: hsl(0, 0%, 99%) !important;
  border-top: 1px solid hsl(0, 0%, 90%);
  border-bottom: 1px solid hsl(0, 0%, 90%);
}

.navbar-collapse {
  justify-content: flex-end;
}

/* Logo */
.navbar-brand {
  width: auto;
  height: 4rem;
  overflow: hidden;

  display: flex;
    opacity: 0;
    align-items: center;

  font-weight: 700;
    font-size: 1.4rem;
  transition: .4s;
}
  .navbar-brand img {
    width: auto;
      height: 100%;
    margin-right: .6rem;
  }

  /* items */
  .navbar-light .navbar-nav a.nav-link {
    font-size: .9rem;
      font-weight: 500;
      color: hsl(0, 0%, 40%);
    border-bottom: 2px solid transparent;
      transition: .2s;
  }
    .navbar-light .navbar-nav a.nav-link:hover {
      color: hsl(211, 100%, 50%);
      border-bottom: 2px solid hsl(211, 100%, 50%);
        transition: .2s;
      cursor: pointer;
    }
  /* separación opciones menu */
  .nav-link {
    margin: 0 .4rem;
  }

/* DROPDOWN ANIMATION */
.dropdown {
  position: relative;
  height: 0;
  transition: .4s;
}
  .dropdown.show {
    height: 2.2rem;
    transition: .5s;
  }

/* DROPDOWN SUBMENU */
  .dropdown-submenu {
    position: relative;
  }

    .dropdown-submenu .dropdown-menu {
      top: 0;
      left: 100%;
      margin-top: -1px;
    }


  /* toggler collapse */
  .navbar-toggler {
    border: none;
  }

/******************************************************/
/**** MEDIA QUERIES ****/
/* Large devices (large desktops, 1200px and down) */
@media only screen and (max-width: 1200px) {

  .navbar-brand {
    height: 4rem;
      font-size: 1.2rem;
  }

  .navbar-light .navbar-nav a.nav-link {
    font-size: .8rem;
  }
}


/* Medium devices (desktops, 992px and down) */
@media only screen and (max-width: 992px) {
  .dropdown, .dropdown.show {
    height: auto;
  }

  nav.sticky-top {
    position: fixed !important;
      width: 100%;
  }
  .banner-top {
    display: none;
  }

  .navbar-light .navbar-nav a.nav-link {
    font-size: .9rem;
      text-decoration: none;
    border-bottom: none;

    text-align: center;
  }
    .navbar-light .navbar-nav a.nav-link:hover {
      border-bottom: none;
      cursor: pointer;
    }
}

/* Small devices (tablets, 768px and down) */
@media only screen and (max-width: 768px) {

  /* Logo */
  .navbar-brand {
    height: 3.5rem;
      font-size: 1.1rem;
  }
}

@media only screen and (max-width: 486px) {

  /* Logo */
  .navbar-brand {
    /*height: 4rem;*/
      font-size: 1rem;
  }
}

/* Medium devices (desktops, 992px and down) */
@media only screen and (max-width: 992px) {  }

/* Large devices (large desktops, 1200px and down) */
@media only screen and (max-width: 1200px) {  }