/* Vue replaces jQuery bxSlider. These rules stack the 5 slides and cross-fade them
   (the #content prefix gives enough specificity to win over the bxSlider CSS). */
#content .bxslider{
  position:relative; list-style:none; margin:0; padding:0; width:100%; min-height:610px;
}
#content .bxslider .slide{
  position:absolute; top:0; left:0; right:0;
  opacity:0; transition:opacity .9s ease; pointer-events:none;
  /* Always form a stacking context so each slide's z-index:-1 background
     image stays INSIDE the slide (instead of slipping behind the page when
     the slide is fully opaque). This is what makes the bg images show. */
  isolation:isolate;
}
#content .bxslider .slide.active{
  opacity:1; pointer-events:auto;
}
.navi a.active{ font-weight:bold; }