Template:Judd UK/Stylesheets/BSS

.bss-slides{

 position: relative;
 display: block; 
 line-height: 0;/*removes the gap if you put a border on the slideshow div*/   

} figcaption {

 line-height: 1.5; /* restores line-height to the child element*/

} .bss-slides:focus{

outline: 0;

} .bss-slides figure{

 position: absolute;
 top: 0;
 width: 100%;

} .bss-slides figure:first-child{

 position: relative;

} .bss-slides figure img{

 opacity: 0;
 -webkit-transition: opacity 1.2s;
 transition: opacity 1.2s;
 -webkit-backface-visibility: hidden;
 backface-visibility: hidden;

} .bss-slides .bss-show{

 z-index: 2;

} .bss-slides .bss-show img{

 opacity: 1;
 -webkit-backface-visibility: hidden;
 backface-visibility: hidden;
 position: relative; 

}

.bss-slides figcaption{

 position: absolute;
 font-family: sans-serif;
 font-size: .8em;
 bottom: .75em;
 right: .35em;
 padding: .25em;
 color: #fff;
 background: #000;
 background: rgba(0,0,0, .25);
 border-radius: 2px;
 opacity: 0;
 -webkit-transition: opacity 1.2s;
 transition: opacity 1.2s;

} .bss-slides .bss-show figcaption{

 z-index: 3;
 opacity: 1;

} .bss-slides figcaption a{

 color: #fff;    

} .bss-next, .bss-prev{

 color: #fff;
 position: absolute;
 background: #000;
 background: rgba(0,0,0, .6);
 top: 50%;
 z-index: 4;
 font-size: 2em;
 margin-top: -1.2em;
 opacity: .3;
 -webkit-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;

} .bss-next:hover, .bss-prev:hover{

 cursor: pointer;
 opacity: 1;

} .bss-next{

 right: -1px;
 padding: 10px 5px 15px 10px;
 border-top-left-radius: 3px;
 border-bottom-left-radius: 3px;

} .bss-prev{

 left: 0;
 padding: 10px 10px 15px 5px;
 border-top-right-radius: 3px;
 border-bottom-right-radius: 3px;

} .bss-fullscreen{

 display: block;
 width: 32px;
 height: 32px;    
 background: rgba(0,0,0,.4) url(../img/arrows-alt_ffffff_64.png); 
 -webkit-background-size: contain; 
 background-size: contain;
 position: absolute;
 top: 5px;
 left: 5px;   
 cursor: pointer;    
 opacity: .3;

} .bss-fullscreen:hover{

 opacity: .8;   

}

-webkit-full-screen .bss-fullscreen{
   background: rgba(0,0,0,.4) url(../img/compress_ffffff_64.png);
   -webkit-background-size: contain;
   background-size: contain;

}

-moz-full-screen .bss-fullscreen{
   background: rgba(0,0,0,.4) url(../img/compress_ffffff_64.png);
   background-size: contain;

}

-ms-fullscreen .bss-fullscreen{
   background: rgba(0,0,0,.4) url(../img/compress_ffffff_64.png);
   background-size: contain;

}

full-screen .bss-fullscreen{
   background: rgba(0,0,0,.4) url(../img/compress_ffffff_64.png);
   -webkit-background-size: contain;
   background-size: contain;

}

-webkit-full-screen .bss-fullscreen{
   background: rgba(0,0,0,.4) url(../img/compress_ffffff_64.png);
   -webkit-background-size: contain;
   background-size: contain;

}

-moz-full-screen .bss-fullscreen{
   background: rgba(0,0,0,.4) url(../img/compress_ffffff_64.png);
   background-size: contain;

}

-ms-fullscreen .bss-fullscreen{
   background: rgba(0,0,0,.4) url(../img/compress_ffffff_64.png);
   background-size: contain;

}

fullscreen .bss-fullscreen{
   background: rgba(0,0,0,.4) url(../img/compress_ffffff_64.png);
   -webkit-background-size: contain;
   background-size: contain;

}