| Current Path : /home/g/i/t/giteleslfp/www/plugins/system/mediabox_ck/assets/ |
| Current File : /home/g/i/t/giteleslfp/www/plugins/system/mediabox_ck/assets/mediaboxck.css |
/* mediaboxAdvanced Black theme */
/* version 2.1 - August 2010 */
/* for mediaboxAdvanced v.1.3.1 */
/* Overlay background styling */
#mbOverlay {
position: fixed;
z-index: 9998;
top: 0;
left: 0;
width: 100%;
height: 100%;
/*background-color: #000;*/
cursor: pointer;
}
/* Legacy fix for older browsers */
#mbOverlay.mbOverlayFF {
background: transparent url(/images/80.png) repeat;
}
#mbOverlay.mbOverlayIE {
position: absolute;
}
/* Overlay panel styling */
#mbCenter {
position: absolute;
z-index: 9999;
left: 50%;
overflow: hidden;
max-height: 100vh; /* for fullwidth responsive */
/*background-color: #1a1a1a;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 0px 5px 20px rgba(0,0,0,0.50);
-khtml-box-shadow: 0px 5px 20px rgba(0,0,0,0.50);
-moz-box-shadow: 0px 5px 20px rgba(0,0,0,0.50);
box-shadow: 0px 5px 20px rgba(0,0,0,0.50);
/* For IE 8 */
/*-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=180, Color='#000000')";
/* For IE 5.5 - 7 */
/*filter: progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=180, Color='#000000');
behavior: url(plugins/system/mediabox_CK/PIE.htc);*/
}
#mbCenter.mbLoading {
background: url(images/loading.gif) no-repeat center;
/* This style is applied only during animation. */
/* For example, the next lines turn off shadows */
/* improving browser performance on slow systems. */
/* To leave shadows on, just remove the following: */
-webkit-box-shadow: none;
-khtml-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
#mbImage, #mbMedia {
position: relative;
left: 0;
top: 0;
box-sizing : content-box;
/*height: 100%;*/
/* Inline content styling */
font-family: Myriad, Verdana, Arial, Helvetica, sans-serif;
line-height: 20px;
font-size: 12px;
color: #fff;
text-align: left;
background-position: center center;
background-repeat: no-repeat;
padding: 10px;
}
/* for iframe and object to be responsive */
#mbMedia > iframe, #mbMedia > object, #mbMedia > img, #mbMedia > video, #mbMedia > audio {
max-width: 100%;
max-height: 100%;
position: relative;
}
/* Title, Caption and Button styling */
#mbBottom {
min-height: 20px;
font-family: Myriad, Verdana, Arial, Helvetica, sans-serif;
line-height: 20px;
font-size: 12px;
/*color: #999;*/
text-align: left;
padding: 0 10px 10px;
z-index: 1;
position: relative;
}
#mbBottom.mbBottomBig {
min-height: 30px;
font-size: 15px;
}
#mbTitle, #mbPrevLink, #mbNextLink, #mbCloseLink, #mbPlayLink, #mbPauseLink, #mbZoomMinus, #mbZoomPlus {
display: inline;
/*color: #fff;*/
font-weight: bold;
line-height: 20px;
font-size: 12px;
}
#mbNumber {
display: inline;
/*color: #999;*/
line-height: 14px;
font-size: 10px;
margin: auto 10px;
}
#mbCaption {
display: block;
/*color: #999;*/
line-height: 14px;
font-size: 10px;
}
#mbPrevLink, #mbNextLink, #mbCloseLink, #mbPlayLink, #mbPauseLink, #mbZoomBar {
float: right;
outline: none;
margin: 0 0 0 10px;
font-weight: normal;
}
#mbPrevLink b, #mbNextLink b, #mbCloseLink b, #mbPlayLink b, #mbPauseLink b, #mbZoomMinus b, #mbZoomPlus b {
/*color: #eee;*/
font-weight: bold;
text-decoration: underline;
}
#mbPrevLink big, #mbNextLink big, #mbCloseLink big, #mbPlayLink big, #mbPauseLink big, #mbZoomMinus big, #mbZoomPlus big {
font-size: 16px;
line-height: 14px;
font-weight: bold;
}
#mbBottom.mbBottomBig #mbPrevLink big,
#mbBottom.mbBottomBig #mbNextLink big,
#mbBottom.mbBottomBig #mbCloseLink big,
#mbBottom.mbBottomBig #mbPlayLink big,
#mbBottom.mbBottomBig #mbPauseLink big,
#mbBottom.mbBottomBig #mbZoomMinus big,
#mbBottom.mbBottomBig #mbZoomPlus big {
font-size: 24px;
line-height: 25px;
}
#mbBottom a, #mbBottom a:link, #mbBottom a:visited { /* Thanks to Danny Jung for feedback and corrections */
text-decoration: none;
/*color: #ddd;*/
}
#mbBottom a:hover, #mbBottom a:active {
text-decoration: underline;
/*color: #fff;*/
}
/* Error message styling */
#mbError {
position: relative;
font-family: Myriad, Verdana, Arial, Helvetica, sans-serif;
line-height: 20px;
font-size: 12px;
color: #fff;
text-align: center;
border: 10px solid #700;
padding: 10px 10px 10px;
margin: 20px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
#mbError a, #mbError a:link, #mbError a:visited, #mbError a:hover, #mbError a:active {
color: #d00;
font-weight: bold;
text-decoration: underline;
}
/**
* Mobile behavior for touch device
*/
#mbCenter.mediaboxckmobile {
width: auto !important;
height: 100% !important;
bottom: 0 !important;
height: auto !important;
left: 0 !important;
margin-left: 0 !important;
margin-top: 0 !important;
padding: 0 !important;
position: fixed !important;
right: 0 !important;
top: 0 !important;
border-radius: 0 !important;
}
#mbCenter.mediaboxckmobile iframe {
height: 100% !important;
position: absolute;
width: 100% !important;
left: 0;
top: 0;
}
#mbCenter.mediaboxckmobile #mbContainer {
height: calc(100% - 51px) !important;
}
#mbCenter.mediaboxckmobile #mbMedia {
width: 100% !important;
height: 100% !important;
padding: 0 !important;
text-align: left; /* important for mobile touch behavior */
/*position: fixed !important;*/
-webkit-overflow-scrolling: touch;
overflow-y: auto;
}
#mbCenter.mediaboxckmobile #mbMedia > img {
/*position: fixed !important;*/
}
#mbCenter.mediaboxckmobile #mbMedia > img {
/*position: fixed !important;*/
}
#mbCenter #mbMedia img.zoomingck {
max-width: none !important;
max-height: none !important;
}
#mbCenter.mediaboxckmobile #mbBottom {
background: rgba(0,0,0, 0.8);
box-shadow: #000 0 0 10px;
border-top: 1px solid #666;
bottom: 0 !important;
min-height: 50px !important;
left: 0 !important;
position: absolute !important;
right: 0 !important;
width: auto !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
}
#mbCenter.mediaboxckmobile #mbBottom:after {
content: "";
display: block;
clear: both;
}
#mbCenter.mediaboxckmobile #mbCloseLink, #mbCenter.mediaboxckmobile #mbNextLink, #mbCenter.mediaboxckmobile #mbPrevLink, #mbCenter.mediaboxckmobile #mbPlayLink, #mbCenter.mediaboxckmobile #mbPauseLink {
text-align: center;
height: 50px;
width: 50px;
}
#mbCenter.mediaboxckmobile #mbPrevLink big, #mbCenter.mediaboxckmobile #mbNextLink big, #mbCenter.mediaboxckmobile #mbCloseLink big, #mbCenter.mediaboxckmobile #mbPlayLink big, #mbCenter.mediaboxckmobile #mbPauseLink big,
#mbCenter.mediaboxckmobil #mbZoomMinus big, #mbCenter.mediaboxckmobil #mbZoomPlus big {
font-size: 2.5em;
line-height: 1.5em;
}
#mbCenter.mediaboxckmobile #mbTitle {
}
#mbCenter.mediaboxckmobile #mbNumber {
display: block;
}
#mbCenter.mediaboxckmobile #mbCaption {
display: none;
}
/** gallery effect **/
a.mediaboxck_link figure.mediaboxck {
display: block;
margin: 0;
padding: 0;
overflow: hidden;
height: 100%;
}
a.mediaboxck_link {
position: relative;
overflow: hidden;
display: inline-block;
vertical-align: bottom;
min-width: 120px;
}
.mediaboxck img {
object-fit: cover;
width:100%;
min-height:100%;
}
figure.mediaboxck {
margin: 0;
}
a.mediaboxck_link figure.mediaboxck:not(.imageeffectck):after {
position: absolute;
display: block;
width: 100%;
height: 100%;
box-sizing: border-box;
content: "";
transition: all ease 0.4s;
background: rgba(0,0,0, 0.7) center center no-repeat;
opacity: 0;
margin-left: 0;
top: 0;
left: 0;
}
a.mediaboxck_link figure.mediaboxck:not(.imageeffectck):hover:after {
opacity: 1;
margin-left: 0;
background: rgba(0,0,0, 0.7) url(images/icon_zoom.png) center center no-repeat;
}
/** Toolbar styles **/
#mbToolbar {
height: 20px;
width: 150px;
position: absolute;
z-index: 9999;
margin: 5px 0 0 -85px;
padding: 5px 10px 10px 10px;
font-size: 20px;
}
#mbToolbar a {
display: inline-block;
margin: 0;
width: 25%;
height: 30px;
text-align: center;
font-size: 1em;
}
#mbToolbar big {
font-size: 1em;
line-height: 1em;
}
#mbToolbar.mediaboxckmobile {
font-size: 30px;
height: 35px;
width: 250px;
margin-left: -135px;
position: fixed;
top: 0 !important;
}
#mbPieLoader {
background: transparent;
bottom: 2px;
left: 5%;
height: 5px;
position: absolute;
width: 90%;
}
#mbPieLoaderBar {
background: rgba(0,0,0,0.5);
height: 100%;
left: 0;
position: absolute;
width: 0%;
box-shadow: rgba(255,255,255,0.3) 0 0 10px inset;
}
/* IE compatibility for the gallery */
.mediaboxckie {
background-repeat: no-repeat;
background-size: cover;
}
.mediaboxckie > div {
background-size: cover;
background-position: center;
height: 100%;
}
#mbZoomBar {
background: rgba(0,0,0, 0.8);
border-radius: 2px;
display: none;
}
#mbZoomMinus big, #mbZoomPlus big {
display: inline-block;
padding: 0 10px;
height: 20px;
background: rgba(255,255,255, 0.1);
box-sizing: border-box;
border-right: 1px solid rgba(255,255,255,0.1);
margin: 1px;
line-height: 18px;
}
#mbBottom.mbBottomBig #mbZoomMinus big, #mbBottom.mbBottomBig #mbZoomPlus big {
height: 30px;
line-height: 25px;
}
#mbZoomPlus big {
border-right: none;
border-left: 1px solid rgba(255,255,255,0.1);
}
#mbZoomMinus big:hover, #mbZoomPlus big:hover {
background: rgba(255,255,255, 0.15);
}
#mbZoomValue {
padding: 0 5px;
width: 50px;
display: inline-block;
text-align: center;
}
#mbMedia.mbZooming {
overflow: auto;
}
.mediaboxckmobile #mbZoomBar {
display: none !important;
}
/**
* Fullwith behavior
*/
#mbCenter.mediaboxckfullwidth {
left: 30px !important;
top: 30px !important;
right: 30px !important;
bottom: 30px !important;
width: auto !important;
height: auto !important;
margin-left: 0 !important;
margin-top: 0 !important;
padding: 0 !important;
position: fixed !important;
display: flex;
flex-direction: column;
}
#mbCenter.mediaboxckfullwidth iframe {
height: 100% !important;
/* position: absolute; */
width: 100% !important;
/* left: 0; */
/* top: 0; */
}
#mbCenter.mediaboxckfullwidth #mbContainer {
display: flex;
flex-direction: column;
flex: 1 1 auto;
}
#mbCenter.mediaboxckfullwidth #mbMedia {
/* width: 100% !important; */
/* height: 100% !important; */
-webkit-overflow-scrolling: touch;
overflow-y: auto;
flex: 1 1 auto;
width: auto !important;
}
#mbCenter.mediaboxckfullwidth #mbBottom {
/*background: rgba(0,0,0, 0.8);
box-shadow: #000 0 0 10px;
border-top: 1px solid #666;
bottom: 0 !important;
min-height: 50px !important;
left: 0 !important;
position: absolute !important;
right: 0 !important;
width: auto !important;
padding-top: 0 !important;
padding-bottom: 0 !important;*/
width: auto !important;
}
#mbCenter.mediaboxckfullwidth #mbBottom:after {
/*content: "";
display: block;
clear: both;*/
}
#mbCenter.mediaboxckfullwidth #mbCloseLink, #mbCenter.mediaboxckfullwidth #mbNextLink, #mbCenter.mediaboxckfullwidth #mbPrevLink, #mbCenter.mediaboxckfullwidth #mbPlayLink, #mbCenter.mediaboxckfullwidth #mbPauseLink {
/*text-align: center;
height: 50px;
width: 50px;*/
}
#mbCenter.mediaboxckfullwidth #mbPrevLink big, #mbCenter.mediaboxckfullwidth #mbNextLink big, #mbCenter.mediaboxckfullwidth #mbCloseLink big, #mbCenter.mediaboxckfullwidth #mbPlayLink big, #mbCenter.mediaboxckfullwidth #mbPauseLink big,
#mbCenter.mediaboxckmobil #mbZoomMinus big, #mbCenter.mediaboxckmobil #mbZoomPlus big {
/*font-size: 2.5em;
line-height: 1.5em;*/
}
#mbCenter.mediaboxckfullwidth #mbTitle {
}
#mbCenter.mediaboxckfullwidth #mbNumber {
/*display: block;*/
}
#mbCenter.mediaboxckfullwidth #mbCaption {
/*display: none;*/
}
.mediaboxck_cont[data-align="center"] {
text-align: center;
}
#mbBottom a[data-state="0"] {
opacity: 0.3;
pointer-events: none;
}