ff-streaming-platform

git clone git://archive.git.mtrnord.blog/MTRNord/ff-streaming-platform.git
Log | Files | Refs | README | LICENSE

lightbox.css (3970B)


      1 /* Preload images */
      2 body:after {
      3   content: url(../images/lightbox/close.png) url(../images/lightbox/loading.gif) url(../images/lightbox/prev.png) url(../images/lightbox/next.png);
      4   display: none;
      5 }
      6 
      7 .lightboxOverlay {
      8   position: absolute;
      9   top: 0;
     10   left: 0;
     11   z-index: 9999;
     12   background-color: black;
     13   filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
     14   opacity: 0.8;
     15   display: none;
     16 }
     17 
     18 .lightbox {
     19   position: absolute;
     20   left: 0;
     21   width: 100%;
     22   z-index: 10000;
     23   text-align: center;
     24   line-height: 0;
     25   font-weight: normal;
     26 }
     27 
     28 .lightbox .lb-image {
     29   display: block;
     30   height: auto;
     31   max-width: inherit;
     32   -webkit-border-radius: 3px;
     33   -moz-border-radius: 3px;
     34   -ms-border-radius: 3px;
     35   -o-border-radius: 3px;
     36   border-radius: 3px;
     37 }
     38 
     39 .lightbox a img {
     40   border: none;
     41 }
     42 
     43 .lb-outerContainer {
     44   position: relative;
     45   background-color: white;
     46   *zoom: 1;
     47   width: 250px;
     48   height: 250px;
     49   margin: 0 auto;
     50   -webkit-border-radius: 4px;
     51   -moz-border-radius: 4px;
     52   -ms-border-radius: 4px;
     53   -o-border-radius: 4px;
     54   border-radius: 4px;
     55 }
     56 
     57 .lb-outerContainer:after {
     58   content: "";
     59   display: table;
     60   clear: both;
     61 }
     62 
     63 .lb-container {
     64   padding: 4px;
     65 }
     66 
     67 .lb-loader {
     68   position: absolute;
     69   top: 43%;
     70   left: 0;
     71   height: 25%;
     72   width: 100%;
     73   text-align: center;
     74   line-height: 0;
     75 }
     76 
     77 .lb-cancel {
     78   display: block;
     79   width: 32px;
     80   height: 32px;
     81   margin: 0 auto;
     82   background: url(../images/lightbox/loading.gif) no-repeat;
     83 }
     84 
     85 .lb-nav {
     86   position: absolute;
     87   top: 0;
     88   left: 0;
     89   height: 100%;
     90   width: 100%;
     91   z-index: 10;
     92 }
     93 
     94 .lb-container > .nav {
     95   left: 0;
     96 }
     97 
     98 .lb-nav a {
     99   outline: none;
    100   background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
    101 }
    102 
    103 .lb-prev, .lb-next {
    104   height: 100%;
    105   cursor: pointer;
    106   display: block;
    107 }
    108 
    109 .lb-nav a.lb-prev {
    110   width: 34%;
    111   left: 0;
    112   float: left;
    113   background: url(../images/lightbox/prev.png) left 48% no-repeat;
    114   filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    115   opacity: 0;
    116   -webkit-transition: opacity 0.6s;
    117   -moz-transition: opacity 0.6s;
    118   -o-transition: opacity 0.6s;
    119   transition: opacity 0.6s;
    120 }
    121 
    122 .lb-nav a.lb-prev:hover {
    123   filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    124   opacity: 1;
    125 }
    126 
    127 .lb-nav a.lb-next {
    128   width: 64%;
    129   right: 0;
    130   float: right;
    131   background: url(../images/lightbox/next.png) right 48% no-repeat;
    132   filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    133   opacity: 0;
    134   -webkit-transition: opacity 0.6s;
    135   -moz-transition: opacity 0.6s;
    136   -o-transition: opacity 0.6s;
    137   transition: opacity 0.6s;
    138 }
    139 
    140 .lb-nav a.lb-next:hover {
    141   filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    142   opacity: 1;
    143 }
    144 
    145 .lb-dataContainer {
    146   margin: 0 auto;
    147   padding-top: 5px;
    148   *zoom: 1;
    149   width: 100%;
    150   -moz-border-radius-bottomleft: 4px;
    151   -webkit-border-bottom-left-radius: 4px;
    152   border-bottom-left-radius: 4px;
    153   -moz-border-radius-bottomright: 4px;
    154   -webkit-border-bottom-right-radius: 4px;
    155   border-bottom-right-radius: 4px;
    156 }
    157 
    158 .lb-dataContainer:after {
    159   content: "";
    160   display: table;
    161   clear: both;
    162 }
    163 
    164 .lb-data {
    165   padding: 0 4px;
    166   color: #ccc;
    167 }
    168 
    169 .lb-data .lb-details {
    170   width: 85%;
    171   float: left;
    172   text-align: left;
    173   line-height: 1.1em;
    174 }
    175 
    176 .lb-data .lb-caption {
    177   font-size: 13px;
    178   font-weight: bold;
    179   line-height: 1em;
    180 }
    181 
    182 .lb-data .lb-number {
    183   display: block;
    184   clear: left;
    185   padding-bottom: 1em;
    186   font-size: 12px;
    187   color: #999999;
    188 }
    189 
    190 .lb-data .lb-close {
    191   display: block;
    192   float: right;
    193   width: 30px;
    194   height: 30px;
    195   background: url(../images/lightbox/close.png) top right no-repeat;
    196   text-align: right;
    197   outline: none;
    198   filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
    199   opacity: 0.7;
    200   -webkit-transition: opacity 0.2s;
    201   -moz-transition: opacity 0.2s;
    202   -o-transition: opacity 0.2s;
    203   transition: opacity 0.2s;
    204 }
    205 
    206 .lb-data .lb-close:hover {
    207   cursor: pointer;
    208   filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    209   opacity: 1;
    210 }