formstone/dist/css/themes/light/lightbox.css

Library of modular front end components.

/*! formstone v1.4.7 [lightbox.css] 2018-05-22 | GPL-3.0 License | formstone.it */
.fs-lightbox.fs-light{z-index:101;background:#fff;border-radius:2px;-webkit-box-shadow:0 0 25px #141a1e;box-shadow:0 0 25px #141a1e;padding:10px}.fs-light.fs-lightbox-inline{padding:30px}.fs-light.fs-lightbox-animating{-webkit-transition:height .25s ease,width .25s ease,opacity .25s linear,top .25s ease;transition:height .25s ease,width .25s ease,opacity .25s linear,top .25s ease}.fs-light.fs-lightbox-animating .fs-lightbox-content,.fs-light.fs-lightbox-animating .fs-lightbox-control,.fs-light.fs-lightbox-animating .fs-lightbox-meta,.fs-light.fs-lightbox-animating .fs-lightbox-thumbnails,.fs-light.fs-lightbox-animating .fs-lightbox-tools{-webkit-transition:opacity .25s linear .25s,visibility .25s linear .25s;transition:opacity .25s linear .25s,visibility .25s linear .25s}.fs-light.fs-lightbox-overlay{z-index:100;background:#141a1e;-webkit-transition:opacity .25s linear;transition:opacity .25s linear}.fs-light.fs-lightbox-overlay.fs-lightbox-open{opacity:.75}.fs-lightbox.fs-light .fs-lightbox-close{width:30px;height:30px;top:-7.5px;right:-7.5px;z-index:105;background:#fff;border-radius:100%;text-indent:200%;white-space:nowrap}.fs-lightbox.fs-light .fs-lightbox-close:before{position:absolute;top:0;right:0;bottom:0;left:0;color:#263238;content:"\00d7";display:block;font-family:Helvetica,Arial,sans-serif;font-size:22px;font-weight:700;line-height:30px;margin:auto;text-align:center;text-indent:0;-webkit-transition:color .15s linear;transition:color .15s linear}.fs-lightbox.fs-light .fs-lightbox-loading_icon{width:50px;height:50px;position:absolute;top:0;right:0;bottom:0;left:0;z-index:105;display:block;margin:auto;opacity:0;-webkit-transition:opacity .25s linear,visibility .25s linear;transition:opacity .25s linear,visibility .25s linear;visibility:hidden}.fs-lightbox.fs-light .fs-lightbox-loading_icon:after,.fs-lightbox.fs-light .fs-lightbox-loading_icon:before{width:100%;height:100%;position:absolute;top:0;right:0;bottom:0;left:0;border-radius:110%;content:'';display:block}.fs-lightbox.fs-light .fs-lightbox-loading_icon:before{border:5px solid rgba(38,50,56,.25)}.fs-lightbox.fs-light .fs-lightbox-loading_icon:after{-webkit-animation:fs-lightbox-loading-spin .75s linear infinite;animation:fs-lightbox-loading-spin .75s linear infinite;border:5px solid transparent;border-top-color:#263238}@-webkit-keyframes fs-lightbox-loading-spin{from{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes fs-lightbox-loading-spin{from{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.fs-lightbox.fs-light .fs-lightbox-container{z-index:103;background:#fff}.fs-lightbox.fs-light .fs-lightbox-content{background:#fff}.fs-lightbox.fs-light .fs-lightbox-meta{padding:10px 10px 0}.fs-lightbox.fs-light .fs-lightbox-control{width:40px;height:40px;z-index:105;background:#fff;border-radius:100%;-webkit-box-shadow:0 0 5px rgba(20,26,30,.25);box-shadow:0 0 5px rgba(20,26,30,.25);opacity:1;overflow:hidden;text-indent:200%;-webkit-transition:opacity .15s linear,visibility .15s linear;transition:opacity .15s linear,visibility .15s linear;visibility:visible}.fs-lightbox.fs-light .fs-lightbox-control:before{width:0;height:0;position:absolute;top:0;right:0;bottom:0;left:0;content:'';margin:auto}.no-touchevents .fs-lightbox.fs-light .fs-lightbox-control:hover{background:#cfd8dc}.fs-lightbox.fs-light .fs-lightbox-control_previous{left:20px}.fs-lightbox.fs-light .fs-lightbox-control_previous:before{border-top:8px solid transparent;border-bottom:8px solid transparent;border-right:10.4px solid #263238;margin-left:14px}.fs-lightbox.fs-light .fs-lightbox-control_next{right:20px}.fs-lightbox.fs-light .fs-lightbox-control_next:before{border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:10.4px solid #263238;margin-right:14px}.no-touchevents .fs-lightbox.fs-light .fs-lightbox-control{opacity:0;visibility:hidden}.no-touchevents .fs-lightbox.fs-light:hover .fs-lightbox-control{opacity:1;visibility:visible}.no-touchevents .fs-lightbox.fs-light .fs-lightbox-control_disabled,.no-touchevents .fs-lightbox.fs-light:hover .fs-lightbox-control_disabled{opacity:0;cursor:default;visibility:hidden}.fs-lightbox.fs-light .fs-lightbox-position{color:#78909c;font-size:12px;margin:5px 0;padding:0}.fs-lightbox.fs-light .fs-lightbox-caption p{color:#546e7a;font-size:14px;line-height:1.6;margin:5px 0;padding:0}.fs-lightbox.fs-light .fs-lightbox-error{width:250px}.fs-lightbox.fs-light .fs-lightbox-error p{color:#900;font-size:14px;margin:0;padding:25px;text-align:center;text-transform:uppercase}.fs-lightbox-thumbnails{height:60px}.fs-lightbox-thumbnail_container{height:80px;padding:0 0 30px}.fs-lightbox.fs-light .fs-lightbox-thumbnail_item{width:50px;height:50px;margin:0 10px 0 0;opacity:.25;-webkit-transition:opacity .25s linear;transition:opacity .25s linear}.fs-lightbox.fs-light .fs-lightbox-thumbnail_item:last-child{margin:0}.fs-lightbox.fs-light .fs-lightbox-thumbnail_item.fs-lightbox-active,.no-touchevents .fs-lightbox.fs-light .fs-lightbox-thumbnail_item:hover{opacity:1}.fs-light.fs-lightbox-loading .fs-lightbox-content,.fs-light.fs-lightbox-loading .fs-lightbox-control,.fs-light.fs-lightbox-loading .fs-lightbox-meta,.fs-light.fs-lightbox-loading .fs-lightbox-thumbnails,.fs-light.fs-lightbox-loading .fs-lightbox-tools{opacity:0;-webkit-transition:opacity .25s linear,visibility .25s linear;transition:opacity .25s linear,visibility .25s linear;visibility:hidden}.fs-light.fs-lightbox-loading .fs-lightbox-loading_icon,.fs-light.fs-lightbox-ready.fs-lightbox-loading .fs-lightbox-thumbnails,.fs-light.fs-lightbox-ready.fs-lightbox-loading .fs-lightbox-tools{opacity:1;visibility:visible}.fs-light.fs-lightbox-mobile{background:#141a1e;border-radius:0;padding:40px 0 0}.fs-light.fs-lightbox-mobile .fs-lightbox-loading_icon{top:0;bottom:0}.fs-light.fs-lightbox-mobile .fs-lightbox-close{height:40px;width:40px;top:0;right:0;background:#141a1e;border-radius:0}.fs-light.fs-lightbox-mobile .fs-lightbox-close:before{color:#78909c;font-size:28px;font-weight:700;line-height:36px}.fs-light.fs-lightbox-mobile .fs-lightbox-loading_icon:before{border-color:rgba(144,164,174,.25)}.fs-light.fs-lightbox-mobile .fs-lightbox-loading_icon:after{border-top-color:#90a4ae}.fs-light.fs-lightbox-mobile .fs-lightbox-container{background:#141a1e}.fs-light.fs-lightbox-mobile .fs-lightbox-content{background-color:#141a1e;padding:0 15px}.fs-light.fs-lightbox-mobile .fs-lightbox-tools{background-color:#263238}.fs-light.fs-lightbox-mobile .fs-lightbox-control{width:50px;height:100%;min-height:50px;background:#263238;border-radius:0;-webkit-box-shadow:none;box-shadow:none}.no-touchevents .fs-light.fs-lightbox-mobile .fs-lightbox-control:hover{background:#263238}.fs-light.fs-lightbox-mobile .fs-lightbox-control_previous{left:0}.fs-light.fs-lightbox-mobile .fs-lightbox-control_previous:before{border-right-color:#90a4ae;margin-left:19px}.fs-light.fs-lightbox-mobile .fs-lightbox-control_next{right:0}.fs-light.fs-lightbox-mobile .fs-lightbox-control_next:before{border-left-color:#90a4ae;margin-right:19px}.no-touchevents .fs-light.fs-lightbox-mobile .fs-lightbox-control,.no-touchevents .fs-light.fs-lightbox-mobile:hover .fs-lightbox-control{opacity:1;visibility:visible}.fs-light.fs-lightbox-mobile .fs-lightbox-control_disabled,.no-touchevents .fs-light.fs-lightbox-mobile .fs-lightbox-control_disabled,.no-touchevents .fs-light.fs-lightbox-mobile:hover .fs-lightbox-control_disabled{cursor:default!important;opacity:0;visibility:hidden}.fs-light.fs-lightbox-mobile .fs-lightbox-meta{padding:15px 65px}.fs-light.fs-lightbox-mobile .fs-lightbox-position{color:#90a4ae;font-size:12px;margin:0 0 5px;padding:0 15px 0 0}.fs-light.fs-lightbox-mobile .fs-lightbox-caption p{color:#cfd8dc;font-size:14px;line-height:1.6;margin:0;padding:0}.fs-light.fs-lightbox-mobile.fs-lightbox-iframe .fs-lightbox-content,.fs-light.fs-lightbox-mobile.fs-lightbox-inline .fs-lightbox-content{height:100%}.fs-light.fs-lightbox-mobile .fs-lightbox-thumbnail_item:first-child{margin-left:15px}.fs-light.fs-lightbox-mobile .fs-lightbox-thumbnail_item:last-child{margin-right:15px}.fs-light.fs-lightbox-mobile.fs-lightbox-touch .fs-lightbox-tools{width:auto;position:static;background:0 0}.fs-light.fs-lightbox-mobile.fs-lightbox-touch .fs-lightbox-controls{width:100%;height:50px;position:fixed;right:0;bottom:0;left:0;z-index:105;background-color:#263238;padding:0 65px}.fs-light.fs-lightbox-mobile.fs-lightbox-touch .fs-lightbox-toggle{background:0 0;color:#90a4ae;display:inline-block;font-size:12px;line-height:50px}.fs-light.fs-lightbox-mobile.fs-lightbox-touch .fs-lightbox-meta{z-index:104;background:#37474f;-webkit-box-shadow:0 0 25px #141a1e;box-shadow:0 0 25px #141a1e;padding:15px 15px 65px;-webkit-transition:opacity .25s linear .25s,visibility .25s linear .25s,-webkit-transform .25s ease;transition:opacity .25s linear .25s,visibility .25s linear .25s,-webkit-transform .25s ease;transition:transform .25s ease,opacity .25s linear .25s,visibility .25s linear .25s;transition:transform .25s ease,opacity .25s linear .25s,visibility .25s linear .25s,-webkit-transform .25s ease}.fs-light.fs-lightbox-touch .fs-lightbox-thumbnails{width:100%;height:130px;z-index:104;background:#37474f;-webkit-box-shadow:0 0 25px #141a1e;box-shadow:0 0 25px #141a1e;padding:15px 0 65px;-webkit-transition:opacity .25s linear .25s,visibility .25s linear .25s,-webkit-transform .25s ease;transition:opacity .25s linear .25s,visibility .25s linear .25s,-webkit-transform .25s ease;transition:transform .25s ease,opacity .25s linear .25s,visibility .25s linear .25s;transition:transform .25s ease,opacity .25s linear .25s,visibility .25s linear .25s,-webkit-transform .25s ease}.fs-light.fs-lightbox-mobile.fs-lightbox-touch .fs-lightbox-thumbnail_container{height:100px}.fs-light.fs-lightbox-touch .fs-lightbox-thumbnail_item:first-child{margin-left:15px}.fs-light.fs-lightbox-touch .fs-lightbox-thumbnail_item:last-child{margin-right:15px}.fs-lightbox.fs-light.fs-lightbox-mobile .fs-lightbox-container,.fs-lightbox.fs-light.fs-lightbox-mobile .fs-lightbox-content{overflow:visible}.fs-lightbox.fs-light.fs-lightbox-mobile .fs-lightbox-content{position:relative}.fs-lightbox.fs-light .fs-viewer,.fs-lightbox.fs-light .fs-viewer .fs-viewer-wrapper{height:auto;width:auto;position:absolute;right:0;left:0;background:#141a1e}.fs-lightbox.fs-light .fs-viewer{top:0;bottom:0}.fs-lightbox.fs-light.fs-lightbox-thumbnailed .fs-viewer{bottom:60px}.fs-lightbox.fs-light.fs-lightbox-touch .fs-viewer,.fs-lightbox.fs-light.fs-lightbox-touch.fs-lightbox-thumbnailed .fs-viewer{bottom:50px}.fs-lightbox.fs-light .fs-viewer .fs-viewer-wrapper{top:0;bottom:0}.fs-lightbox.fs-light .fs-viewer .fs-viewer-loading_icon{display:none!important}.fs-lightbox.fs-light .fs-viewer .fs-viewer-viewport{top:5px;right:15px;bottom:15px;left:15px}.fs-lightbox.fs-light .fs-viewer .fs-viewer-controls{height:40px;width:80px;background:#141a1e;padding:0}.fs-lightbox.fs-light .fs-viewer .fs-viewer-control,.no-touchevents .fs-lightbox.fs-light .fs-viewer .fs-viewer-control:hover{height:40px;width:40px;background:#141a1e;border-radius:0;padding:0}