@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro);.slides-example2
{width:900px;height:300px;margin-left: auto; margin-right:auto;position:relative;overflow:hidden;font-size:10px}
.slides-example2 li{list-style:none;border:2px solid #e8e8e8;height:296px;width:108.5px;position:absolute;left:0;z-index:2;
    -webkit-transition-property:width,left;-moz-transition-property:width,left;-o-transition-property:width,left;
    transition-property:width,left;-webkit-transition-duration:1s;-moz-transition-duration:1s;-o-transition-duration:
        1s;transition-duration:1s;overflow:hide}.slides-example2 li:hover{width:200px;z-index:3}
.slides-example2 li:hover h4{-webkit-transform:rotate(0deg);background:transparent;-moz-transform:rotate(0deg);
    -ms-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);bottom:10px;right:10px}
.slides-example2 li:hover img{clip:auto;margin:0;height:100%;width:300px}
.slides-example2 li h4{position:absolute;bottom:0;right:10px;display:block;
    white-space:nowrap;margin:0;padding:0;font-family:'Bubbler One', sans-serif;color:
        #fefefe;font-size:20px;-webkit-transform-origin:top right;-moz-transform-origin:top right;
    -ms-transform-origin:top right;-o-transform-origin:top right;transform-origin:top right;
    -webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);
    -o-transform:rotate(90deg);transform:rotate(90deg);-webkit-transition-property:-webkit-transform,right,bottom;
    -moz-transition-property:-moz-transform,right,bottom;-o-transition-property:-o-transform,right,bottom;
    transition-property:transform,right,bottom;-webkit-transition-duration:1s;-moz-transition-duration:1s;
    -o-transition-duration:1s;transition-duration:1s}.slides-example2 li img{max-width:none !important;border:0;
 position:absolute;margin-left:-100px;margin-top:-100px;clip:rect(100px, 208.5px, 396px, 100px)}.slides-example2
  .slide-2{left:112.5px}.slides-example2 .slide-2:hover{left:66.75px}.slides-example2 .slide-3{left:225px}.slides-example2 .slide-3:hover{left:179.25px}.slides-example2 .slide-4{left:337.5px}.slides-example2
.slide-4:hover{left:291.75px}.slides-example2 .slide-5{left:450px}.slides-example2 .slide-5:hover{left:404.25px}.slides-example2 .slide-6{left:562.5px}.slides-example2 .slide-6:hover{left:516.75px}.slides-example2 .slide-7{left:675px}.slides-example2
.slide-7:hover{left:629.25px}.slides-example2 .slide-8{left:787.5px}.slides-example2 .slide-8:hover{left:741.75px;left:696px}



                         @media (max-width:900px) {
                             .slides-example2 {
                                 visibility: hidden;
                             }

                         }