#footer { position: fixed; bottom: 0; width: 100%; height: 60px; background-color: #f5f5f5; line-height: 60px; z-index: 1000; } #otonomic-media-modal { } #otonomic-media-modal .media-wrapper { position: relative; margin-top: 20px; border: 3px solid transparent; overflow: hidden; } #otonomic-media-modal .image-wrapper { height:200px; position: relative; -webkit-box-shadow: inset 0 0 15px rgba( 0, 0, 0, 0.1 ), inset 0 0 0 1px rgba( 0, 0, 0, 0.05 ); box-shadow: inset 0 0 15px rgba( 0, 0, 0, 0.1 ), inset 0 0 0 1px rgba( 0, 0, 0, 0.05 ); background: #eee; cursor: pointer; } #otonomic-media-modal .image-wrapper .centered { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -webkit-transform: translate( 50%, 50% ); -ms-transform: translate(50%,50%); transform: translate( 50%, 50% ); } #otonomic-media-modal .image-wrapper img{ position: absolute; top: 0; left: 0; -webkit-transform: translate( -50%, -50% ); -ms-transform: translate(-50%,-50%); transform: translate( -50%, -50% ); } #otonomic-media-modal .media-wrapper .image-title { position: absolute; bottom: 0; left: 0; right: 0; color: #fff; background: rgba(0,0,0,0.5); padding: 5px; } #otonomic-media-modal .media-wrapper.selected { border-color:#1e8cbe; } #otonomic-media-modal #tab-footer { padding: 10px 0; } .media-resource{ max-height: 500px; overflow-y: auto; }