.ms-showcase2-template {padding-bottom: 155px;} .ms-showcase2-template .ms-view{background: transparent;} .ms-showcase2-template .ms-bar {background: black !important;} .ms-showcase2-template .ms-tabs-vertical-template {margin: 0 auto;} .ms-showcase2-template.ms-dir-v { padding-right: 140px; padding-bottom:0 !important; } .ms-showcase2-template .ms-thumb-list.ms-dir-h { bottom: -145px; width: 100%; height: 137px; } .ms-showcase2-template .ms-thumb-list.ms-dir-v { height: 100%; width: 130px; right: -140px; top: 0; } .ms-showcase2-template .ms-thumb-list .ms-thumb-frame { width: 127px; height: 137px; opacity: 0.5; -webkit-transition: opacity 300ms; -moz-transition: opacity 300ms; -ms-transition: opacity 300ms; -o-transition: opacity 300ms; transition: opacity 300ms; } .ms-showcase2-template .ms-thumb-frame { cursor: pointer; } .ms-showcase2-template .ms-thumb-list.ms-dir-h .ms-thumb-frame{ margin-right:10px; } .ms-showcase2-template .ms-thumb-list.ms-dir-v .ms-thumb-frame{ margin-bottom:10px;} .ms-showcase2-template .ms-thumb-list .ms-thumb-frame-selected{ opacity: 1; } @media (max-width: 400px) { .ms-showcase2-template .ms-thumb-list.ms-dir-v { width: 64px; right: -70px; } .ms-showcase2-template .ms-thumb-list .ms-thumb-frame { width: 64px; height: 69px; } .ms-showcase2-template {padding-bottom: 75px;} .ms-showcase2-template.ms-dir-v {padding-right: 70px;} } @media (max-width: 200px) { .ms-showcase2-template .ms-thumb-list{display: none; } .ms-showcase2-template {padding-bottom: 0px;} .ms-showcase2-template.ms-dir-v {padding-right: 0px;} }