/**
 *  Demo Styles from the Slick Slider
 *  website
 */
html {
  scroll-behavior: smooth;
}

 body {
    background-color: #ffffff;
    overflow-x: hidden;
    font-family: 'Muli', sans-serif;
  }

  .menu{
    width: 100%;
    justify-content: flex-end;
  }
  .nav-item{
    border: transparent 1px solid;
    border-radius: 5px;
    transition: .2s;
    margin-right: .3rem;
    text-align: center;
  }
  .nav-item:nth-last-child(1){
    margin-right: 0;
  }
  .nav-item:hover{
    border: #385D8A 1px solid;
    border-radius: 5px;
  }
  .nav-link{
    font-size: 1.2rem;
    font-weight: bold;
    color: #385D8A !important;
  }
  .titulo{
    font-weight: bold;
    color: #385D8A !important;
  }
  .aleriant{
    background-color: #385D8A !important;
  }
  .banner-img{
    width: 100% !important;
  }

  header{
    border-bottom: 1px solid rgba(0,0,0,.1);
  }

  nav{
        height: 109px;
  }
  #banner{
    background-image: url(../img/banner2.png) !important;
    background-repeat: no-repeat;
    background-size: cover;
    height: 80vh;
  }

  #angle-down{
    animation: angledown 1s infinite alternate ease-in-out;
    color:white;
    font-size: 3rem;
    display: block;
    text-align: center;
    width: 100%;
  }

  @keyframes angledown {
    from {
      transform:translateY(0px);
    }
    to {
    transform:translateY(15px);
    }
  }

  @media screen and (max-width: 1024px){
    #banner{
      /* background-position-x: -150px; */
      background-position: center;
    }
  }
  @media screen and (max-width: 768px){
    .logo{
      width: 70%;
    text-align: right;
    }
  }
  @media screen and (max-width: 480px){
    .logo{
      width: 70%;
    text-align: right;
    }
    #banner{
      /* background-position-x: -150px; */
      background-position-x: -223px;
    }
  }
  @media screen and (max-width: 320px){
    .logo{
      width: 75%;
    text-align: right;
    }
  }
  
  /* Customized slider */
  .content-slider {
    margin: auto;
    padding: 20px;
    width: 100%;
  }
  
  .slider {
    margin: 30px auto 50px;
  }
  
  .image {
    padding: 10px;
  }
  
  .img-slider {
    border: 5px solid #fff;
    display: block;
    width: 100%;
    
  }
  .slick-next:before, .slick-prev:before{
    color: grey !important;
  }