.bss-slides{
    /* PN change*/
    background:;
    position: relative;
    display: block;    
  }
  .bss-slides:focus{
   outline: 0;
  }
  .bss-slides figure{
    position: absolute;
    top: 0;
    /* Pn was 100%.  By removing this the pics aren't pushed to the right*/
 width: 100%;
/*Pn. Needs these margings cos the figure element has default 40px left-margin and 40px right margin.  Other defaults of 'figure' element are display:block, margin-top:1em, margin-right:1em*/
margin-left:0;
margin-right:0;
   
background:;
  }
  .bss-slides figure:first-child{
    position: relative;
  }
  .bss-slides figure img{
    opacity: 0;
    -webkit-transition: opacity 1.2s;
    transition: opacity 1.2s;
    position: relative;
  /*-webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    */
  }
  .bss-slides .bss-show {
    z-index: 3;
  }
  .bss-slides .bss-show img{
    opacity: 1;
   /* -webkit-backface-visibility: hidden;
    backface-visibility: hidden;*/
  }
  
  
  .bss-slides figcaption{
    position: absolute;
    font-family: sans-serif;
    font-size: .8em;
    bottom: 0.75em;
    right: 0.5em;
    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: 2;
    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: .5;
    -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: 0;
    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: 24px;
    height: 24px;    
    background: rgba(0,0,0,.3) url(https://leemark.github.io/better-simple-slideshow/img/arrows-alt_ffffff_64.png); 
    -webkit-background-size: contain; 
    background-size: contain;
    position: absolute;
/*PN. was 5px*/
    top: 25px;
    left: 5px;   
    cursor: pointer;    
    opacity: .3;

/*pn*/
z-index: 3;
  } 
  .bss-fullscreen:hover{
    opacity: .8;   


  }
  :-webkit-full-screen .bss-fullscreen{
      background: rgba(0,0,0,.4) url(https://leemark.github.io/better-simple-slideshow/img/compress_ffffff_64.png);
      -webkit-background-size: contain;
      background-size: contain;
  }
  :-moz-full-screen .bss-fullscreen{
      background: rgba(0,0,0,.4) url(https://leemark.github.io/better-simple-slideshow/img/compress_ffffff_64.png);
      background-size: contain;
  }
  :-ms-fullscreen .bss-fullscreen{
      background: rgba(0,0,0,.4) url(https://leemark.github.io/better-simple-slideshow/img/compress_ffffff_64.png);
      background-size: contain;
  }
  :full-screen .bss-fullscreen{
      background: rgba(0,0,0,.4) url(https://leemark.github.io/better-simple-slideshow/img/compress_ffffff_64.png);
      -webkit-background-size: contain;
      background-size: contain;
  }
  :-webkit-full-screen .bss-fullscreen{
      background: rgba(0,0,0,.4) url(https://leemark.github.io/better-simple-slideshow/img/compress_ffffff_64.png);
      -webkit-background-size: contain;
      background-size: contain;
  }
  :-moz-full-screen .bss-fullscreen{
      background: rgba(0,0,0,.4) url(https://leemark.github.io/better-simple-slideshow/img/compress_ffffff_64.png);
      background-size: contain;
  }
  :-ms-fullscreen .bss-fullscreen{
      background: rgba(0,0,0,.4) url(https://leemark.github.io/better-simple-slideshow/img/compress_ffffff_64.png);
      background-size: contain;
  }
  :fullscreen .bss-fullscreen{
      background: rgba(0,0,0,.4) url(https://leemark.github.io/better-simple-slideshow/img/compress_ffffff_64.png);
      -webkit-background-size: contain;
      background-size: contain;
  }