annotate e2gallerypro/design/e2gallerypro/design.css @ 3:3f6b44aa6b35 judyates

[svn r4] added ability to buy stuff, from a Prints page, but it doesn't work well with the css, and it also has not been fitted into the perl make system.
author rlm
date Mon, 22 Feb 2010 08:02:39 -0500
parents
children
rev   line source
rlm@3 1 body{
rlm@3 2 background:#000;
rlm@3 3 }
rlm@3 4 #gallery #galleries #controls {
rlm@3 5 height: 17px;
rlm@3 6 padding: 3px;
rlm@3 7 margin:0 auto;
rlm@3 8 width:754px;
rlm@3 9 border-bottom:1px solid #333;
rlm@3 10 text-align:left;
rlm@3 11 background-image: url(controls_bg.png);
rlm@3 12 background-repeat: repeat-x;
rlm@3 13 color:#333;
rlm@3 14 }
rlm@3 15 #gallery #thumbnails {
rlm@3 16 height: 55px;
rlm@3 17 text-align: center;
rlm@3 18 width: 672px;
rlm@3 19 margin: 0 auto 0;
rlm@3 20 overflow: hidden;
rlm@3 21 position: relative;
rlm@3 22 }
rlm@3 23 #gallery {
rlm@3 24 font: 78% Arial, Helvetica, sans-serif;
rlm@3 25 width: 800px;
rlm@3 26 margin: 0 auto;
rlm@3 27 height: 600px;
rlm@3 28 position: relative;
rlm@3 29 overflow: hidden;
rlm@3 30 z-index: 1;
rlm@3 31 }
rlm@3 32 #gallery #galleries {
rlm@3 33 background: #333 url(images_bg.png) repeat-x;
rlm@3 34 position: absolute;
rlm@3 35 left:19px;
rlm@3 36 bottom: -575px;
rlm@3 37 height: 598px;
rlm@3 38 width: 760px;
rlm@3 39 text-align: center;
rlm@3 40 z-index: 50;
rlm@3 41 cursor: pointer;
rlm@3 42 border:1px solid #333;
rlm@3 43 }
rlm@3 44 #images {
rlm@3 45 height: 508px;
rlm@3 46 text-align: center;
rlm@3 47 position: relative;
rlm@3 48 width:760px;
rlm@3 49 overflow: hidden;
rlm@3 50 margin:0 auto 0;
rlm@3 51 background: #333 url(images_bg.png) repeat-x;
rlm@3 52 border-left: 1px solid #333;
rlm@3 53 border-right: 1px solid #333;
rlm@3 54 border-top: solid #333 1px;
rlm@3 55 }
rlm@3 56
rlm@3 57 #imagewrap {
rlm@3 58 position:absolute;
rlm@3 59 margin:0 auto;
rlm@3 60 width: 0px;
rlm@3 61 height: 0px;
rlm@3 62 top: 200px;
rlm@3 63 left: 380px;
rlm@3 64 }
rlm@3 65 #imgsrc{
rlm@3 66 cursor: pointer;
rlm@3 67 }
rlm@3 68 #thumbnailwrap {
rlm@3 69 left: 0px;
rlm@3 70 position: absolute;
rlm@3 71 }
rlm@3 72 .thumbnail {
rlm@3 73 background: #333;
rlm@3 74 margin: 7px 6px;
rlm@3 75 float: left;
rlm@3 76 height: 42px;
rlm@3 77 width: 42px;
rlm@3 78 border: solid #333 1px;
rlm@3 79 cursor: pointer;
rlm@3 80 overflow:hidden;
rlm@3 81 }
rlm@3 82 #gallery #thumbbox {
rlm@3 83 width: 760px;
rlm@3 84 margin:0 auto;
rlm@3 85 position:relative;
rlm@3 86 border:1px solid #333;
rlm@3 87 background: url(thumbwrap.png) no-repeat;
rlm@3 88 padding: 8px 0 0 0;
rlm@3 89 overflow: hidden;
rlm@3 90 height: 57px;
rlm@3 91 }
rlm@3 92 #loading {
rlm@3 93 height: 87px;
rlm@3 94 width: 150px;
rlm@3 95 position: absolute;
rlm@3 96 background-image: url(loading.png);
rlm@3 97 background-repeat: no-repeat;
rlm@3 98 background-position: center center;
rlm@3 99 z-index: 8888;
rlm@3 100 left: 311px;
rlm@3 101 top: 189px;
rlm@3 102 }
rlm@3 103 .gallery {
rlm@3 104 float: left;
rlm@3 105 height: 200px;
rlm@3 106 width: 250px;
rlm@3 107 background-image: url(gallery_bg.png);
rlm@3 108 background-repeat: no-repeat;
rlm@3 109 background-position: center center;
rlm@3 110 position: relative;
rlm@3 111 }
rlm@3 112 #gallery #next {
rlm@3 113 height: 510px;
rlm@3 114 width: 19px;
rlm@3 115 background-image: url(next.png);
rlm@3 116 background-repeat: no-repeat;
rlm@3 117 background-position: right center;
rlm@3 118 position: absolute;
rlm@3 119 right: 0px;
rlm@3 120 cursor: pointer;
rlm@3 121 z-index: 5;
rlm@3 122 }
rlm@3 123 #gallery #previous {
rlm@3 124 height: 510px;
rlm@3 125 width: 19px;
rlm@3 126 background-image: url(prev.png);
rlm@3 127 background-repeat: no-repeat;
rlm@3 128 background-position: left center;
rlm@3 129 position: absolute;
rlm@3 130 left: 0px;
rlm@3 131 cursor: pointer;
rlm@3 132 z-index: 5;
rlm@3 133 }
rlm@3 134 #loading #loadingbar {
rlm@3 135 position: relative;
rlm@3 136 width: 100%;
rlm@3 137 height: 87px;
rlm@3 138 }
rlm@3 139 #loading #loadingbar #bar {
rlm@3 140 position: absolute;
rlm@3 141 bottom: 19px;
rlm@3 142 left: 44px;
rlm@3 143 width: 50px;
rlm@3 144 height: 50px;
rlm@3 145 }
rlm@3 146 #largeimage {
rlm@3 147 height: 0px;
rlm@3 148 width: 0px;
rlm@3 149 position: absolute;
rlm@3 150 z-index: 99;
rlm@3 151 overflow: visible;
rlm@3 152 }
rlm@3 153 #backdrop {
rlm@3 154 background-color: #000;
rlm@3 155 height: 0px;
rlm@3 156 width: 0px;
rlm@3 157 position: absolute;
rlm@3 158 z-index: 98;
rlm@3 159 left: 50%;
rlm@3 160 top: 0px;
rlm@3 161 cursor:pointer;
rlm@3 162 }
rlm@3 163 #largeimage #closebtn {
rlm@3 164 background-image: url(closebtn.png);
rlm@3 165 background-repeat: no-repeat;
rlm@3 166 background-position: center center;
rlm@3 167 height: 28px;
rlm@3 168 width: 28px;
rlm@3 169 z-index: 100;
rlm@3 170 position: absolute;
rlm@3 171 left: -8px;
rlm@3 172 top: -8px;
rlm@3 173 cursor:pointer;
rlm@3 174 }
rlm@3 175 #galleryset .gallery h3 {
rlm@3 176 font-size: 1.5em;
rlm@3 177 font-weight: bold;
rlm@3 178 color: #666666;
rlm@3 179 margin: 10px 15px;
rlm@3 180 padding: 0px;
rlm@3 181 }
rlm@3 182 .tooltips{
rlm@3 183 z-index: 9999999;
rlm@3 184 }
rlm@3 185 .tip {
rlm@3 186 font:Arial, Helvetica, sans-serif;
rlm@3 187 color: #CCC;
rlm@3 188 width: 220px;
rlm@3 189 }
rlm@3 190 .tip-top {
rlm@3 191 margin: 0;
rlm@3 192 color: #CCCCCC;
rlm@3 193 padding: 37px 30px 0px 30px;
rlm@3 194 background: url(tip-top.png) top left;
rlm@3 195 }
rlm@3 196 .tip-title{
rlm@3 197 font-weight:bold;
rlm@3 198 font-size: 1.3em;
rlm@3 199 margin: 0;
rlm@3 200 color: #FFF;
rlm@3 201 padding: 0px 30px 3px 30px;
rlm@3 202 background: url(tip-middle.png) bottom right;
rlm@3 203 }
rlm@3 204 .tip-text {
rlm@3 205 font-size: 1em;
rlm@3 206 padding: 5px 30px 0px 30px;
rlm@3 207 background: url(tip-middle.png) bottom right;
rlm@3 208 }
rlm@3 209 .tip-bottom {
rlm@3 210 padding: 0px 25px 42px;
rlm@3 211 background: url(tip-bottom.png) bottom right;
rlm@3 212 }
rlm@3 213 .minitooltips{
rlm@3 214 z-index: 9999999;
rlm@3 215 }
rlm@3 216 .minitooltips .tip {
rlm@3 217 color: #FFF;
rlm@3 218 width: 130px;
rlm@3 219 }
rlm@3 220 .minitooltips .tip-top {
rlm@3 221 margin: 0;
rlm@3 222 color: #CCCCCC;
rlm@3 223 padding: 9px 12px 0px 12px;
rlm@3 224 background: url(minitop.png) top left;
rlm@3 225 }
rlm@3 226 .minitooltips .tip-title{
rlm@3 227 font:Georgia, "Times New Roman", Times, serif;
rlm@3 228 text-align:center;
rlm@3 229 font-weight:normal;
rlm@3 230 font-size: .8em;
rlm@3 231 margin: 0;
rlm@3 232 color: #FFF;
rlm@3 233 padding: 0px 12px 3px 12px;
rlm@3 234 background: url(minimiddle.png) bottom right;
rlm@3 235 }
rlm@3 236 .minitooltips .tip-text {
rlm@3 237 text-align:center;
rlm@3 238 font-size: .9em;
rlm@3 239 padding: 8px 12px 0px 12px;
rlm@3 240 background: url(minimiddle.png) bottom right;
rlm@3 241 }
rlm@3 242 .minitooltips .tip-bottom {
rlm@3 243 padding: 0px 12px 8px;
rlm@3 244 background: url(minibottom.png) bottom right;
rlm@3 245 }
rlm@3 246 .gallery .galleryimg {
rlm@3 247 position: absolute;
rlm@3 248 left: 23px;
rlm@3 249 top: 37px;
rlm@3 250 }
rlm@3 251 #gallery #thumbbox #thumbleft {
rlm@3 252 width: 40px;
rlm@3 253 height: 65px;
rlm@3 254 left: 0px;
rlm@3 255 position: absolute;
rlm@3 256 background: url(left_arrow.png) no-repeat center center;
rlm@3 257 visibility: hidden;
rlm@3 258 cursor: pointer;
rlm@3 259 }
rlm@3 260 #gallery #thumbbox #thumbright {
rlm@3 261 height: 65px;
rlm@3 262 width: 40px;
rlm@3 263 position: absolute;
rlm@3 264 background: url(right_arrow.png) no-repeat center center;
rlm@3 265 right: 0px;
rlm@3 266 visibility: hidden;
rlm@3 267 cursor: pointer;
rlm@3 268 }
rlm@3 269 #gallery #images #smallmessage {
rlm@3 270 background-image: url(message-popup.png);
rlm@3 271 background-repeat: no-repeat;
rlm@3 272 background-position: center top;
rlm@3 273 position: absolute;
rlm@3 274 bottom: -85px;
rlm@3 275 height: 76px;
rlm@3 276 width: 205px;
rlm@3 277 text-align: center;
rlm@3 278 padding: 8px 5px 0px;
rlm@3 279 color: #CCC;
rlm@3 280 font-size: 0.8em;
rlm@3 281 }
rlm@3 282 #gallery #images #imageinfo {
rlm@3 283 position: absolute;
rlm@3 284 bottom: -300px;
rlm@3 285 height: 250px;
rlm@3 286 width: 90%;
rlm@3 287 text-align: center;
rlm@3 288 padding: 5px 5px 0px;
rlm@3 289 color: #333;
rlm@3 290 font-size: 0.8em;
rlm@3 291
rlm@3 292 }
rlm@3 293 #largeimage #lrgloader {
rlm@3 294 overflow: hidden;
rlm@3 295
rlm@3 296
rlm@3 297 }
rlm@3 298 #largeimage #lrgwrap {
rlm@3 299 overflow: hidden;
rlm@3 300 border: 1px solid #333;
rlm@3 301 background:#000;
rlm@3 302 }
rlm@3 303 #imageinfo #infoloader {
rlm@3 304 font-size: 1.2em;
rlm@3 305 color: #E1E1E1;
rlm@3 306 text-align: left;
rlm@3 307 margin: 0px;
rlm@3 308 position: releative;
rlm@3 309 }
rlm@3 310 #infoloader h2 {
rlm@3 311 font-size: 1.4em;
rlm@3 312 font-weight: bold;
rlm@3 313 color: #333;
rlm@3 314 margin: 0px;
rlm@3 315 padding: 0px;
rlm@3 316 text-shadow:#000;
rlm@3 317 }
rlm@3 318 #infoloader .copyright {
rlm@3 319 font-size: .8em;
rlm@3 320 }
rlm@3 321 #infoloader .author {
rlm@3 322 font-size: .8em;
rlm@3 323 }
rlm@3 324 .right {
rlm@3 325 float: right;
rlm@3 326 }
rlm@3 327 #fsbox {
rlm@3 328 width: 379px;
rlm@3 329 margin: 0 auto;
rlm@3 330 overflow:hidden;
rlm@3 331 height:300px;
rlm@3 332 z-index: 51;
rlm@3 333 position: absolute;
rlm@3 334 bottom: -350px;
rlm@3 335 left: 200px;
rlm@3 336 color: #FFF;
rlm@3 337 }
rlm@3 338 #fsbox #fsbutton {
rlm@3 339 color: #000;
rlm@3 340 background: url(buybutton.png) no-repeat center bottom;
rlm@3 341 height: 15px;
rlm@3 342 text-align: center;
rlm@3 343 padding: 2px 0 0 0;
rlm@3 344 margin:2px 0 6px;
rlm@3 345 font-size: 0.8em;
rlm@3 346 position: relative;
rlm@3 347 cursor:pointer;
rlm@3 348 }
rlm@3 349 #fsbox #fstop {
rlm@3 350 background: url(buynow_top.png) no-repeat center top;
rlm@3 351 height: 19px;
rlm@3 352 text-align: center;
rlm@3 353 padding: 0;
rlm@3 354 margin:0;
rlm@3 355 }
rlm@3 356 #fsbox #forsale {
rlm@3 357 background-image: url(buynow_middle.png);
rlm@3 358 background-repeat: repeat-y;
rlm@3 359 margin: 0px;
rlm@3 360 padding: 0 15px 20px;
rlm@3 361 position:relative;
rlm@3 362 }
rlm@3 363 #fsbox #forsale img{
rlm@3 364 padding: 0 10px 10px;
rlm@3 365
rlm@3 366 }
rlm@3 367 #fsbox hr {
rlm@3 368 clear:both;
rlm@3 369 visibility:hidden;
rlm@3 370 }
rlm@3 371 #fsbox #fsclose{
rlm@3 372 background-image: url(closebtn.png);
rlm@3 373 background-repeat: no-repeat;
rlm@3 374 background-position: center center;
rlm@3 375 height: 28px;
rlm@3 376 width: 28px;
rlm@3 377 z-index: 220000;
rlm@3 378 cursor:pointer;
rlm@3 379 position: absolute;
rlm@3 380 left: 0px;
rlm@3 381 top: 15px;
rlm@3 382 }
rlm@3 383 #purchasebtn{
rlm@3 384 font-weight:bold;
rlm@3 385 text-align:center;
rlm@3 386 margin:10px;
rlm@3 387 padding:11px 0 0 5px;
rlm@3 388 position:absolute;
rlm@3 389 right:15px;
rlm@3 390 top:0px;
rlm@3 391 }
rlm@3 392 #gallery #galleries #galleryset {
rlm@3 393 text-align: left;
rlm@3 394 width: 760px;
rlm@3 395 margin: 0 auto;
rlm@3 396 }
rlm@3 397 #thumbnailPopUp{
rlm@3 398 z-index:1;
rlm@3 399 visibility:hidden;
rlm@3 400 background:url(pop_arrow.png) no-repeat center bottom;
rlm@3 401 padding-bottom:8px;
rlm@3 402 position:absolute;
rlm@3 403 top:0;
rlm@3 404 left:-10000px;
rlm@3 405 }
rlm@3 406 #thumbnailPopUp img{
rlm@3 407 margin:0;
rlm@3 408 padding:0;
rlm@3 409 background:#333;
rlm@3 410 border:#FFF solid 3px;
rlm@3 411 }
rlm@3 412 .clear{clear:both;}