.ilightbox-overlay.metro-black { background: #000; } .ilightbox-loader.metro-black { -webkit-box-shadow: rgba(0,0,0,1) 0px 0px 55px, rgba(0,0,0,.3) 0px 0px 55px; box-shadow: rgba(0,0,0,1) 0px 0px 55px, rgba(0,0,0,.3) 0px 0px 55px; } .ilightbox-loader.metro-black div { background: #000 url('preloader.gif') no-repeat center; } .ilightbox-holder.metro-black { padding: 3px; background: #000; -webkit-box-shadow: 0 0 45px rgba(0,0,0,.8); box-shadow: 0 0 45px rgba(0,0,0,.8); } .ilightbox-holder.metro-black .ilightbox-container .ilightbox-caption { background: url('caption-bg.png') repeat-x bottom; background-size: 100% 100%; left: 0; right: 0; color: #FFF; text-shadow: 0 0 3px rgba(0, 0, 0, .75); padding-top: 15px; } .ilightbox-holder.metro-black .ilightbox-container .ilightbox-social { background: url('social-bg.png'); -webkit-border-radius: 2px; border-radius: 2px; } .ilightbox-holder.metro-black .ilightbox-alert { background: url('alert.png') no-repeat center top; color: #555; } /* Style toolbar */ .ilightbox-toolbar.metro-black { top: 2px; right: 2px; height: 25px; } .ilightbox-toolbar a { float:right; } .ilightbox-toolbar.metro-black a { width: 27px; height: 25px; background: #000 url('buttons.png') no-repeat 7px 6px; } .ilightbox-toolbar.metro-black a:hover { background-color: #51b7ff; } .ilightbox-toolbar.metro-black a.ilightbox-close:hover { background-color: #d94947; } .ilightbox-toolbar.metro-black a.disabled { opacity: 0.2; filter: alpha(opacity=20); cursor: default; background-color: #000; -webkit-box-shadow: 0 0 25px rgba(0,0,0,.8); box-shadow: 0 0 25px rgba(0,0,0,.8); } .ilightbox-toolbar.metro-black a.ilightbox-fullscreen { background-position: 6px -31px; } .ilightbox-toolbar.metro-black a.ilightbox-play { background-position: 8px -55px; } .ilightbox-toolbar.metro-black a.ilightbox-pause { background-position: 8px -81px; } .isMobile .ilightbox-toolbar.metro-black { background: #000; top: auto; bottom: 0; left: 0; width: 100%; height: 40px; text-align: center; } .isMobile .ilightbox-toolbar.metro-black a { display: inline-block; float: none; width: 50px; height: 40px; background-size: 50%; background-position: 50%; } .isMobile .ilightbox-toolbar.metro-black a.ilightbox-fullscreen { background-image: url('fullscreen-icon-64.png'); background-image/*\**/: url('fullscreen-icon-ie.png')\9; /* IE7-8 */ } .isMobile .ilightbox-toolbar.metro-black a.ilightbox-close { background-image: url('x-mark-icon-64.png'); background-image/*\**/: url('x-mark-icon-ie.png')\9; /* IE7-8 */ } .isMobile .ilightbox-toolbar.metro-black a.ilightbox-next-button { background-image: url('arrow-next-icon-64.png'); background-image/*\**/: url('arrow-next-icon-ie.png')\9; /* IE7-8 */ background-position: 52% 50%; } .isMobile .ilightbox-toolbar.metro-black a.ilightbox-prev-button { background-image: url('arrow-prev-icon-64.png'); background-image/*\**/: url('arrow-prev-icon-ie.png')\9; /* IE7-8 */ background-position: 48% 50%; } .isMobile .ilightbox-toolbar.metro-black a.ilightbox-play { background-image: url('play-icon-64.png'); background-image/*\**/: url('play-icon-ie.png')\9; /* IE7-8 */ } .isMobile .ilightbox-toolbar.metro-black a.ilightbox-pause { background-image: url('pause-icon-64.png'); background-image/*\**/: url('pause-icon-ie.png')\9; /* IE7-8 */ } .ilightbox-holder.metro-black .ilightbox-inner-toolbar .ilightbox-title { font-size: 18px; padding: 10px 12px; padding-right: 60px; color: #acacad; } .ilightbox-holder.metro-black .ilightbox-inner-toolbar .ilightbox-toolbar { left: auto; top: 5px; right: 5px; } .ilightbox-holder.metro-black .ilightbox-inner-toolbar .ilightbox-toolbar a { float: right; } /* Style thumbnails */ .ilightbox-thumbnails.metro-black.ilightbox-horizontal { height: 104px; } .ilightbox-thumbnails.metro-black.ilightbox-horizontal .ilightbox-thumbnails-container { height: 104px; } .ilightbox-thumbnails.metro-black.ilightbox-vertical { width: 144px; } .ilightbox-thumbnails.metro-black.ilightbox-vertical .ilightbox-thumbnails-container { width: 144px; } .ilightbox-thumbnails.metro-black .ilightbox-thumbnails-grid .ilightbox-thumbnail img { border: 2px solid #000; -webkit-box-shadow: 0 0 10px rgba(0,0,0,.8); box-shadow: 0 0 10px rgba(0,0,0,.8); -webkit-border-radius: 0; border-radius: 0; } .ilightbox-thumbnails.metro-black .ilightbox-thumbnails-grid .ilightbox-thumbnail .ilightbox-thumbnail-video { background: url('thumb-overlay-play.png') no-repeat center; } /* Configure arrow buttons */ .ilightbox-button.metro-black.disabled { opacity: 0.1; filter: alpha(opacity=10); cursor: default; } .ilightbox-button.metro-black span { display: block; width: 100%; height: 100%; } .ilightbox-button.ilightbox-next-button.metro-black, .ilightbox-button.ilightbox-prev-button.metro-black { bottom: 0; right: 0; left: 0; left/*\**/: 35%\9; /* IE7-8 */ right/*\**/: auto\9; /* IE7-8 */ width: 30%; height: 100px; margin: auto; background: url('arrows_vertical.png') no-repeat 50% -100px; background-color: #000; background-color: rgba(0,0,0,0.5); } .ilightbox-button.ilightbox-prev-button.metro-black { top: 0; bottom: auto; background-position: 50% 0; } .ilightbox-button.ilightbox-next-button.metro-black.horizontal, .ilightbox-button.ilightbox-prev-button.metro-black.horizontal { right: 0; left: auto; top: 0; bottom: 0; top/*\**/: 36%\9; /* IE7-8 */ bottom/*\**/: auto\9; /* IE7-8 */ width: 100px; height: 30%; background-image: url('arrows_horizontal.png'); background-position: -93px 50%; } .ilightbox-button.ilightbox-prev-button.metro-black.horizontal { right: auto; left: 0; background-position: -7px 50%; }