library/fancybox/jquery.fancybox.css

   1 /*! fancyBox v2.1.4 fancyapps.com | fancyapps.com/fancybox/#license */
   2 .fancybox-wrap,
   3 .fancybox-skin,
   4 .fancybox-outer,
   5 .fancybox-inner,
   6 .fancybox-image,
   7 .fancybox-wrap iframe,
   8 .fancybox-wrap object,
   9 .fancybox-nav,
  10 .fancybox-nav span,
  11 .fancybox-tmp
  12 {
  13         padding: 0;
  14         margin: 0;
  15         border: 0;
  16         outline: none;
  17         vertical-align: top;
  18 }
  19
  20 .fancybox-wrap {
  21         position: absolute;
  22         top: 0;
  23         left: 0;
  24         z-index: 8020;
  25 }
  26
  27 .fancybox-skin {
  28         position: relative;
  29         background: #f9f9f9;
  30         color: #444;
  31         text-shadow: none;
  32         -webkit-border-radius: 4px;
  33            -moz-border-radius: 4px;
  34                 border-radius: 4px;
  35 }
  36
  37 .fancybox-opened {
  38         z-index: 8030;
  39 }
  40
  41 .fancybox-opened .fancybox-skin {
  42         -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  43            -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  44                 box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  45 }
  46
  47 .fancybox-outer, .fancybox-inner {
  48         position: relative;
  49 }
  50
  51 .fancybox-inner {
  52         overflow: hidden;
  53 }
  54
  55 .fancybox-type-iframe .fancybox-inner {
  56         -webkit-overflow-scrolling: touch;
  57 }
  58
  59 .fancybox-error {
  60         color: #444;
  61         font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
  62         margin: 0;
  63         padding: 15px;
  64         white-space: nowrap;
  65 }
  66
  67 .fancybox-image, .fancybox-iframe {
  68         display: block;
  69         width: 100%;
  70         height: 100%;
  71 }
  72
  73 .fancybox-image {
  74         max-width: 100%;
  75         max-height: 100%;
  76 }
  77
  78 #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
  79         background-image: url('fancybox_sprite.png');
  80 }
  81
  82 #fancybox-loading {
  83         position: fixed;
  84         top: 50%;
  85         left: 50%;
  86         margin-top: -22px;
  87         margin-left: -22px;
  88         background-position: 0 -108px;
  89         opacity: 0.8;
  90         cursor: pointer;
  91         z-index: 8060;
  92 }
  93
  94 #fancybox-loading div {
  95         width: 44px;
  96         height: 44px;
  97         background: url('fancybox_loading.gif') center center no-repeat;
  98 }
  99
 100 .fancybox-close {
 101         position: absolute;
 102         top: -18px;
 103         right: -18px;
 104         width: 36px;
 105         height: 36px;
 106         cursor: pointer;
 107         z-index: 8040;
 108 }
 109
 110 .fancybox-nav {
 111         position: absolute;
 112         top: 0;
 113         width: 40%;
 114         height: 100%;
 115         cursor: pointer;
 116         text-decoration: none;
 117         background: transparent url('blank.gif'); /* helps IE */
 118         -webkit-tap-highlight-color: rgba(0,0,0,0);
 119         z-index: 8040;
 120 }
 121
 122 .fancybox-prev {
 123         left: 0;
 124 }
 125
 126 .fancybox-next {
 127         right: 0;
 128 }
 129
 130 .fancybox-nav span {
 131         position: absolute;
 132         top: 50%;
 133         width: 36px;
 134         height: 34px;
 135         margin-top: -18px;
 136         cursor: pointer;
 137         z-index: 8040;
 138         visibility: hidden;
 139 }
 140
 141 .fancybox-prev span {
 142         left: 10px;
 143         background-position: 0 -36px;
 144 }
 145
 146 .fancybox-next span {
 147         right: 10px;
 148         background-position: 0 -72px;
 149 }
 150
 151 .fancybox-nav:hover span {
 152         visibility: visible;
 153 }
 154
 155 .fancybox-tmp {
 156         position: absolute;
 157         top: -99999px;
 158         left: -99999px;
 159         visibility: hidden;
 160         max-width: 99999px;
 161         max-height: 99999px;
 162         overflow: visible !important;
 163 }
 164
 165 /* Overlay helper */
 166
 167 .fancybox-lock {
 168         overflow: hidden;
 169 }
 170
 171 .fancybox-overlay {
 172         position: absolute;
 173         top: 0;
 174         left: 0;
 175         overflow: hidden;
 176         display: none;
 177         z-index: 8010;
 178         background: url('fancybox_overlay.png');
 179 }
 180
 181 .fancybox-overlay-fixed {
 182         position: fixed;
 183         bottom: 0;
 184         right: 0;
 185 }
 186
 187 .fancybox-lock .fancybox-overlay {
 188         overflow: auto;
 189         overflow-y: scroll;
 190 }
 191
 192 /* Title helper */
 193
 194 .fancybox-title {
 195         visibility: hidden;
 196         font: normal 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
 197         position: relative;
 198         text-shadow: none;
 199         z-index: 8050;
 200 }
 201
 202 .fancybox-opened .fancybox-title {
 203         visibility: visible;
 204 }
 205
 206 .fancybox-title-float-wrap {
 207         position: absolute;
 208         bottom: 0;
 209         right: 50%;
 210         margin-bottom: -35px;
 211         z-index: 8050;
 212         text-align: center;
 213 }
 214
 215 .fancybox-title-float-wrap .child {
 216         display: inline-block;
 217         margin-right: -100%;
 218         padding: 2px 20px;
 219         background: transparent; /* Fallback for web browsers that doesn't support RGBa */
 220         background: rgba(0, 0, 0, 0.8);
 221         -webkit-border-radius: 15px;
 222            -moz-border-radius: 15px;
 223                 border-radius: 15px;
 224         text-shadow: 0 1px 2px #222;
 225         color: #FFF;
 226         font-weight: bold;
 227         line-height: 24px;
 228         white-space: nowrap;
 229 }
 230
 231 .fancybox-title-outside-wrap {
 232         position: relative;
 233         margin-top: 10px;
 234         color: #fff;
 235 }
 236
 237 .fancybox-title-inside-wrap {
 238         padding-top: 10px;
 239 }
 240
 241 .fancybox-title-over-wrap {
 242         position: absolute;
 243         bottom: 0;
 244         left: 0;
 245         color: #fff;
 246         padding: 10px;
 247         background: #000;
 248         background: rgba(0, 0, 0, .8);
 249 }