/*--------- slider: narrow banner between the main navigation and the technology buttons ---------*/
#slider {width:100%; position:relative; padding-bottom:10px;}
#slider .slider-block {position:relative; width:960px; height:82px; margin:0 auto; overflow:hidden; background:#0b0d10;}
.slides {position:absolute; top:0; right:0; bottom:0; left:0;}

/* cross-fade: the incoming slide fades in on top, the outgoing one is removed after it */
.slide {position:absolute; top:0; right:0; bottom:0; left:0; z-index:0; opacity:0; transition:opacity 0s linear .5s;}
.slide.on {z-index:1; opacity:1; transition:opacity .5s ease;}
.slide img {display:block; width:100%; height:100%; object-fit:cover; object-position:50% 40%;}

.prev, .next {position:absolute; top:20px; width:23px; height:41px; z-index:3; display:inline-block;}
.prev {left:12px; background:url(../images/prev.gif) 0 0 no-repeat;}
.prev:hover {background-position:0 bottom;}
.next {right:12px; background:url(../images/next.gif) 0 0 no-repeat;}
.next:hover {background-position:0 bottom;}

@media (prefers-reduced-motion: reduce) {
  .slide, .slide.on {transition:none;}
}