/* =========================================================
   BANNER ROTATIVO
========================================================= */

.banner-wrap{
  width:100%;
  position:relative;
  overflow:hidden;
  background:#fff;
}

.banner-link{
  display:block;
  width:100%;
  text-decoration:none;
}

/* =========================================================
   DESKTOP
========================================================= */

.banner-desktop{
  display:block;
  width:100%;
}

.banner-desktop img{
  width:100%;
  height:auto;
  display:block;
  opacity:1;
  transition:opacity 1s ease-in-out;
  will-change:opacity;
}

/* =========================================================
   MOBILE
========================================================= */

.banner-mobile{
  display:none;
  width:100%;
}

.banner-mobile img{ 
 width:100%;
 height:auto;
 display:block;
 opacity:1; 
 transition:opacity 1s ease-in-out;
 will-change:opacity; 
}

/* =========================================================
   RESPONSIVO
========================================================= */

@media (max-width:840px){

  .banner-desktop{
    display:none;
  }

  .banner-mobile{
    display:block;
  }
}