body{margin:0;background:#fff;font-family:Arial,"Helvetica Neue",Helvetica,sans-serif}
h1,h2,h3,h4,h5,h6,p{margin:0}
.demo-container{background:transparent;min-height:100%;padding:30px; overflow:hidden}
.demo-container .row{width:100%;margin-bottom:28px; display:flex}
.demo-container .row:after{content:" ";display:block;clear:both}
.demo-container .row .table-row{display:flex; width:100%; height:100%}
.demo-container .col{float:none;box-sizing:border-box;padding:0 0px; display:block; vertical-align:top;}
body.firefox .demo-container .col{height:100%;}
.demo-container .col-xs-12 { width: 100%; padding:0!important}
.demo-container .col-xs-11 { width: 91.66666667%; }
.demo-container .col-xs-10 { width: 83.33333333%; }
.demo-container .col-xs-9 { width: 75%; }
.demo-container .col-xs-8 { width: 66.66666667%; }
.demo-container .col-xs-7 { width: 58.33333333%; }
.demo-container .col-xs-6 { width: 50%; }
.demo-container .col-xs-5 { width: 41.66666667%; }
.demo-container .col-xs-4 { width: 33.33333333%; }
.demo-container .col-xs-3 { width: 25%; }
.demo-container .col-xs-2 { width: 16.66666667%; }
.demo-container .col-xs-1 { width: 8.33333333%; }
.demo-container .col:last-child{padding-left:14px; padding-right:0}
.demo-container .shape{transition:all 200ms linear; min-height: 16px; border: 1px solid transparent;}
/*.demo-container .shape:not(#gallery_wrap_container), .demo-container .shape.loaded{background:#eaf0f6; cursor:pointer; } */
.demo-container .shape:not(#gallery_wrap_container):hover, .demo-container .shape.clickToTry {
    background: #a9c3de;
	position:relative;
	border: 1px solid #0086cf;
}
.demo-container .shape.clickToTry{border: 1px solid red;}
.demo-container .shape.fullheight{height:100% !important}
.demo-container.float_skin #gallery_wrap_container{background:#eaf0f6;}
.demo-container.float_skin #gallery_wrap_container.h2{height:56px}
.demo-container.float_skin #gallery_wrap_container.h3{height:112px}
.demo-container.float_skin #gallery_wrap_container.h7{height:280px}
.demo-container:not(.float_skin) #gallery_wrap_container{height:auto !important; overflow: hidden;}
.demo-container .shape:not(#gallery_wrap_container):hover:before, .demo-container .shape.clickToTry:before {
    content: 'Click to preview gallery here';
    color: #fff;
    text-align: center;
    width: 100%;
    display: inline-block;
    font-style: italic;
	font-size: 16px;
	line-height:1;
    top: 50%;
	top: calc(50% - 8px);
	position:absolute
}
.demo-container .shape.clickToTry:before{color: red;}
.demo-container .h2{height:56px}
.demo-container .h3{height:112px}
.demo-container .h7{height:280px}

.demo-container div.shape-list{margin:0;}
.demo-container div.shape-list div{
	margin:0;
	background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAqCAYAAAByfjF8AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MDkxOUYwM0ZCQTI4MTFFNzhGNTVFRTUxOTEwREM4OTkiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MDkxOUYwNDBCQTI4MTFFNzhGNTVFRTUxOTEwREM4OTkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDowOTE5RjAzREJBMjgxMUU3OEY1NUVFNTE5MTBEQzg5OSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDowOTE5RjAzRUJBMjgxMUU3OEY1NUVFNTE5MTBEQzg5OSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PtNJIEIAAAAcSURBVHjaYnz14dt/JgYgGHiC8f///5SbAhBgAASWBx9nLQpIAAAAAElFTkSuQmCC') repeat; 
	height:100%
} 

@media only screen and (max-width: 768px) {
    .demo-container { padding: 25px; }
}

@media only screen and (max-width: 375px) {
    .demo-container { padding: 25px 10px; }
}

::-webkit-scrollbar { width: 16px; border: 5px solid transparent; background-clip: padding-box; }

::-webkit-scrollbar-track { background: #dedede; border: 5px solid transparent; background-clip: padding-box; border-radius: 10px; }

::-webkit-scrollbar-thumb { background: #959595; border-radius: 10px; border: 5px solid transparent; background-clip: padding-box; }

::-webkit-scrollbar-thumb:window-inactive { background: #b8b8b8; border: 5px solid transparent; background-clip: padding-box; }

.preview-loader {
    border: 4px solid #f3f3f3;
    border-top: 4px solid #3498db;
    border-radius: 50%;
    width: 70px;
    height: 70px;
    animation: spin 1s linear infinite;
    margin: 0 auto;
    margin-top: 102px;
}

.demo-container .h2 .preview-loader{ width: 40px; height: 40px; margin-top: 4px;}
.demo-container .h3 .preview-loader{margin-top: 18px;}
.demo-container .h7 .preview-loader{margin-top: 102px;}

body.show-controls-class div#gallery_wrap_container:not(.hidden-controls) .mediaElementVideoContainer .mejs-controls{
	pointer-events:auto!important;
	opacity:1!important;
	display:block!important;
	visibility:visible!important;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@media (max-width:400px){
::-webkit-scrollbar { width: 0 !important; height: 0 !important;}
}