Gallery slideshow control arrows

 

The arrow controls above is generated with the code below.

/* GALLERY SLIDESHOW CONTROLS
- - - - - - - - - - - - - - */

// SLIDESHOW CONTROLS
.sqs-gallery-controls .previous, 
.sqs-gallery-controls .next {
  color: #FFF !important;
  background-color: @decor;
  opacity: .75;
  transition: @transition-fast;
}

.sqs-gallery-controls .previous:hover, 
.sqs-gallery-controls .next:hover {
  background-color: @decor;
  opacity: @opacity;
}

  // SLIDESHOW CONTROLS @480
@media @480 {
.sqs-gallery-controls .previous, 
.sqs-gallery-controls .next {
  font-style: bold;
  color: #FFF !important;
  background-color: transparent!important;
  }
}

@media @480 {
.sqs-gallery-controls .previous:hover, 
.sqs-gallery-controls .next:hover {
  color: #FFF !important;
  background-color: @decor!important;
  opacity: @opacity-low;
 }
}