/* ColorBox Core Style The following rules are the styles that are consistant between themes. Avoid changing this area to maintain compatability with future versions of ColorBox. */ #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;} #cboxOverlay{position:fixed; width:100%; height:100%; background:#000;} #cboxMiddleLeft, #cboxBottomLeft{clear:left;} #cboxContent{position:relative; overflow:hidden;} #cboxLoadedContent{overflow:auto;} #cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;} #cboxTitle{margin:0;} #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:40%; left:0; width:100%;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} /* Example user style The following rules are ordered and tabbed in a way that represents the order/nesting of the generated HTML, so that the structure easier to understand. */ #colorbox{} #cboxContent {background:#fff;} #cboxTopLeft {background:url("../img/controls2.png") no-repeat scroll -61px 0; width:8px; height:9px;} #cboxTopRight {background:url("../img/controls2.png") no-repeat scroll -80px 0; width:8px; height:9px;} #cboxTopCenter {background:url("../img/colorbox/border.png") repeat-x scroll 0 0 transparent; height:9px;} #cboxMiddleLeft {background:url("../img/controls2.png") repeat-y scroll left top transparent; width:8px;} #cboxMiddleRight {background:url("../img/controls2.png") repeat-y scroll right top transparent; width:8px;} #cboxBottomLeft { background:url("../img/controls2.png") no-repeat scroll -61px -21px transparent; height:9px; width:8px; } #cboxBottomCenter { background:url("../img/colorbox/border.png") repeat-x scroll 0 -41px transparent; height:9px; } #cboxBottomRight { background:url("../img/colorbox/controls.png") no-repeat scroll -140px -39px transparent; height:9px; width:8px;} #cboxTitle{display:none !important;position:absolute; bottom:3px; left:0; text-align:center; width:100%; color:#949494;} #cboxCurrent{position:absolute; bottom:3px; left:58px; color:#949494;} #cboxSlideshow{position:absolute; bottom:3px; right:30px; color:#0092ef;} #cboxPrevious{position:absolute; bottom:0; left:0px; background:url(../img/colorbox/controls.png) -75px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;} #cboxPrevious.hover{background-position:-75px -25px;} #cboxNext{position:absolute; bottom:0; left:27px; background:url(../img/colorbox/controls.png) -50px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;} #cboxNext.hover{background-position:-50px -25px;} #cboxLoadingOverlay{background:url(../img/colorbox/loading_background.png) center 0 no-repeat;} #cboxLoadingGraphic{background:url(../img/progress.gif) center 5px no-repeat;} .photoHeader{background:#1c1f22; width:100%; padding:0; margin-bottom:10px; height:36px; display:block; float:left;} /* The following fixes png-transparency for IE6. It is also necessary for png-transparency in IE7 & IE8 to avoid 'black halos' with the fade transition Since this method does not support CSS background-positioning, it is incompatible with CSS sprites. Colorbox preloads navigation hover classes to account for this. !! Important Note: AlphaImageLoader src paths are relative to the HTML document, while regular CSS background images are relative to the CSS document. */ .cboxIE #cboxTopLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/img/colorbox/internet_explorer/borderTopLeft.png, sizingMethod='scale');} .cboxIE #cboxTopCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/img/colorbox/internet_explorer/borderTopCenter.png, sizingMethod='scale');} .cboxIE #cboxTopRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/img/colorbox/internet_explorer/borderTopRight.png, sizingMethod='scale');} .cboxIE #cboxBottomLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/img/colorbox/internet_explorer/borderBottomLeft.png, sizingMethod='scale');} .cboxIE #cboxBottomCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/img/colorbox/internet_explorer/borderBottomCenter.png, sizingMethod='scale');} .cboxIE #cboxBottomRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/img/colorbox/internet_explorer/borderBottomRight.png, sizingMethod='scale');} .cboxIE #cboxMiddleLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/img/colorbox/internet_explorer/borderMiddleLeft.png, sizingMethod='scale');} .cboxIE #cboxMiddleRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/img/colorbox/internet_explorer/borderMiddleRight.png, sizingMethod='scale');} /* Photo gallery */ .gallery_th #cboxContent{background:#000 !important;} .gallery_th #cboxClose{position:absolute; bottom:22px; right:10px; top:10px; background:url(../img/lightbox-close.png) no-repeat 0 0; width:66px; height:19px; text-indent:-9999px;} /* carousel */ .jcarousel-container{display:block; position:relative; float:left; width:880px; border-top:solid 1px #333; border-bottom:solid 1px #333; text-align:left; padding:10px; margin-top:5px;} .jcarousel-clip{margin:0; overflow:hidden !important; padding:0; position:relative; z-index:2;} .jcarousel-list {z-index: 1; overflow: hidden; position: relative; top: 0; left: 0; margin: 0; padding: 0;} .jcarousel-list li, .jcarousel-item {float:left; width:73px; height:54px;} /* We set the width/height explicitly. No width/height causes infinite loops. */ .thumbsWrap{clear:left; visibility:hidden;} .thumbsWrap img{width:62px; height:48px; border:solid 3px #404040; -moz-border-radius:4px; -webkit-border-radius:4px;} .thumbsWrap li a{width:62px; height:48px;} .thumbsWrap li a:hover img, .thumbsWrap a.current_img img{border:solid 3px #fff;} .jcarousel-prev-horizontal{width:30px; height:30px; text-indent:-9999px; position:absolute; left:10px; top:20px; background:url(../img/thumbs_next_prev.png) no-repeat 0 0; cursor:pointer;} .jcarousel-prev-horizontal:hover{background-position:0 -50px;} .jcarousel-next-horizontal {width:30px; height:30px; text-indent:-9999px; position:absolute; right:10px; top:20px; background:url(../img/thumbs_next_prev.png) no-repeat -50px 0; cursor:pointer;} .jcarousel-next-horizontal:hover{background-position:-50px -50px;} .jcarousel-clip-horizontal{width:90%; left:42px;} .jcarousel-clip-horizontal il{left:0 !important} /* Photo popup */ .contentWrapGallery{width:900px; margin:0 auto; padding:40px 0 0 0; } /*.photoCaptionBlk{float:left; width:100%; padding:5px 0; height:20px;}*/ .photoCaptionBlk strong{font-size:14px; font-weight:100; display:block; padding:10px 0 10px 25px; text-align: left; color:#fff;} .photoCaptionBlk p{font-size:11px; color:#a7a7a7; padding:0 0 0 10px !important; margin:0; float:left; clear:left; margin-top:5px;} .photoCaptionBlk p a{text-decoration:underline;} .photoCaptionBlk p img{position: relative; top:4px} .pagLight {position:absolute; bottom:0px; left:0; font-size:10px; color:#666;} .pagLight span {display:block; float:left; padding:5px 5px 0 0;} .prevBtnPop {cursor:pointer; display:block; float:left; height:100%; left:0; position:absolute; text-indent:-9999px; top:0; width:49.9%; z-index:999 !important; background:url(../img/perv_bnt_pop.png) no-repeat 0 center; cursor:pointer;} .prevBtnPop:hover { background:url(../img/perv_bnt_pop_hover.png) no-repeat 0 center;} .nextBtnPop {cursor:pointer; display:block; float:left; height:100%; position:absolute; right:0; text-indent:-9999px; top:0; width:49.9%; z-index:999 !important; background:url(../img/next_bnt_pop.png) no-repeat right center;} .nextBtnPop:hover {background:url(../img/next_bnt_pop_hover.png) no-repeat right center;} .thumbPrevNext {position:relative; height:540px;} span.photoNr{color:#b3b3b3; float:right; margin-top:10px;} .prevBtnPopSml {display:block; width:21px; height:22px; text-indent:-9999px; float:left; background:url(../img/controls.png) no-repeat -77px -1px; margin-right:5px; position:relative; left:-70px; top:-22px;} .prevBtnPopSml:hover { background:url(../img/controls.png) no-repeat -77px -26px;} .nextBtnPopSml {display:block; width:21px; height:22px; float:left; text-indent:-9999px; background:url(../img/controls.png) no-repeat -52px -1px; position:relative; left:-70px; top:-22px;} .nextBtnPopSml:hover {background:url(../img/controls.png) no-repeat -52px -26px; } .photo_head{display: none;} .adsWrap{display:block; float:left; width:880px; padding:5px 10px; position:relative; text-align:center; background:url(../img/ads_bg.png) no-repeat 815px 5px;} .adsWrap a.closeAd{position:absolute; display:block; background:url(../img/close_ad.png) no-repeat 0 0; width:14px; height:14px; text-indent:-9999px; top:10px; right:10px;} /*.adsWrap img.ad{float:left;}*/ .upgrade{float:right; width:140px; margin-top:15px;} .upgrade .upgradeNow{float:left; background:url(../img/upgrade_btn.png) no-repeat 0 0; width:118px; height:23px; text-indent:-9999px;} .upgrade h3{float:left; color:#fff; padding-bottom:10px; font-size:16px;} /* Profile page */ /* colorbox in profile page - photo upload */ .titleBlk{background:#c9eaf7; height:48px; } .titleBlk h1{color:#262626; font-size:20px; font-weight:100; padding: 10px 0 0 15px;} #cboxClose {background:url("../img/colorbox_close_btn.gif") no-repeat 0 0; height:20px; right:10px; top:13px; width:20px; position:absolute; text-indent:-9999px;} .photoBlk {float: left; margin-right:10px; padding-top:15px;} .photoBlk img{border:solid 1px #bdbdbd;} .descriptionBlk{padding-top:15px;} .descriptionBlk p{padding-top:5px !important; margin:0; color:#686868;} .descriptionBlk form{float: left;} .profile_pic form{padding-top:20px;} #uploader_thumbs {display: none; padding-top: 10px;} #uploader_thumbs div{width: 64px; height: 64px; padding:1px; margin: 0 4px 4px 0; border:3px solid #E7E7E7; float: left; position: relative; overflow: hidden;} #uploader_thumbs img{width: 64px; height: 64px;} #uploader_thumbs div a{position: absolute; top:1px; right:1px; text-indent: -10000px; background: url('../img/cancel.png') no-repeat; height: 16px; width: 16px; display: none;} #uploader_thumbs div:hover a{display: block;} #uploader_thumbs div:hover{border-color:#666;} #fileInputUploader {float: left; margin-right: 10px;} #finish_uploader .btnRight{clear: none;} .uploadPhotoBtn{text-indent:-9999px; background:url(../img/choose_photo_btn.png) no-repeat 0 0; width:126px; height:26px; display:block; margin-top:20px;} .uploadPhoto{color:#fff !important; background:#000 url(../img/sprite.gif) no-repeat 5px -425px; padding:3px 5px 3px 15px; font-size:11px; opacity:0.85; filter:alpha(opacity=85); position:absolute; bottom:10px; left:20px; -moz-border-radius:10px; -webkit-border-radius:10px;} .reUploadPhoto{color:#fff !important; background:#000; padding:3px 5px; font-size:11px; opacity:0.85; filter:alpha(opacity=85); position:absolute; bottom:10px; left:17px; -moz-border-radius:10px; -webkit-border-radius:10px;} .modalContent {text-align:left; padding: 0 15px 0 15px;} .modalContent p {color:#666; padding: 0 0 0 0; font-size:13px; } .modalContent .selectLocation {float:left; clear:left; font-size:15px; width: 470px;} .buttonsBlock {clear:left; margin-top:15px; float:left;}