Subversion Repositories Applications.papyrus

/*
    This is the master CSS file for the dojox.image project, and provides all
    needed definitions for:
    
    dojox.image.Lightbox
    dojox.image.Gallery [which is a combination of:]
    dojox.image.SlideShow
    dojox.image.ThumbNailPicker

*/


/* dojox.image.Lightbox:base */
/* FIXME: should be be doing this? I want a black underlay, but this sets ALL dialogs to black,
    but because it's decendant of body, i can't set this color any other way ... */
.dijitDialogUnderlay {
        background-color:#000; 
}

.dojoxLightbox {
        position:absolute;
        z-index:999;
        overflow:hidden;
        width:100px;
        height:100px; 
        border:11px solid #fff;
        background:#fff url('images/loading.gif') no-repeat center center;

        /* special safari + FF specific rounding + shadows */
        -webkit-box-shadow: 0px 6px 10px #636363; /* #adadad; */
        -webkit-border-radius: 3px;
        -moz-border-radius:4px;
}

.dojoxLightboxContainer {
        position:absolute;
        top:0; left:0; 
}

.dojoxLightboxFooter {
        height:50px; 
        position:relative;
        bottom:0;
        left:0;
        margin-top:8px;
        color:#333;
        z-index:1000;
        font-size:10pt;
}

.dojoxLightboxGroupText {
        color:#666; 
        font-size:8pt;
}

.LightboxNext,
.LightboxPrev,
.LightboxClose {
        float:right;
        width:16px;
        height:16px;
        cursor:pointer;
}

/* dojox.image.Lightbox:tundra */
.tundra .LightboxClose {
        background:url('../../../dijit/themes/tundra/images/tabClose.png') no-repeat center center;
}
.tundra .LightboxNext {
        background:url('../../../dijit/themes/tundra/images/arrowRight.png') no-repeat center center;
}
.tundra .LightboxPrev {
        background:url('../../../dijit/themes/tundra/images/arrowLeft.png') no-repeat center center;
}

/* dojox.image.Lightbox:soria */
.soria .LightboxNext,
.soria .LightboxPrev,
.soria .LightboxClose {
        background:url('../../../dijit/themes/soria/images/arrows.png') no-repeat center center;
        background-position:-65px 0;
}
.soria .LightboxNext {
        background-position:-48px 0;
}
.soria .LightboxPrev {
        background-position:-16px 0;
}

/* dojox.image.SlideShow */

.slideShowWrapper { 
        position:relative; 
        background:#fff;
        padding:8px; 
        border:1px solid #333;  
        padding-bottom:20px;
        overflow:hidden;
        text-align: center;
        -moz-border-radius:3pt;
        -webkit-border-radius:4pt;
        -webkit-drop-shadow:#ccc 4pt; 
}
.slideShowNav { 
        position:absolute;
        bottom:-18px;   
        left:0px;
        padding:0px 3px 2px 0px;
        background-color:#fff; 
        width:100%;
}
.slideShowNavWrapper { float:right;  }
.slideShowTitle {
        float:left;
        color:#333;
        font-size:10pt;
}
.slideShowTitle .slideShowCounterText {
        font-size:6pt; color:#666; 
}
.slideShowHidden {
        position:absolute;
        display: none;
        height: 1px;
        width: 1px;
}
.slideShowImageWrapper {
        position:relative;
        text-align: center;
        margin-top: -42px;
        float: left;
        width: 100%;
}
.slideShowImageWrapper img {
        border: 0px none;
}
.slideShowNotifier {
        background-color: red;
        width: 100px;
        height: 5px;
        font-size: 1%;/*IE hack to get around the Empty-Div bug*/
}
.slideShowSlideShow {
        position:absolute;
        top:30px; 
        padding: 0 5px;
        border: 0px;
        text-decoration: none; 
        color: #2e6ab1;
}
.slideShowLoading { background-color: #fad66a; }
.slideShowLoaded { background-color: transparent; }
/*
.sprite-arrowbottom { background-position: 0 -30px; } 
.sprite-arrowtop { background-position: 0 -430px; } 
*/
.slideShowCtrlPrev {
        background-position: -96px 0px; 
        float: left;
}
.slideShowCtrlNext {
        background-position: -144px 0px;
        float: right;
}
.slideShowCtrlPlay {
        background-position: -190px 0px;
        position: absolute;
}
.slideShowPaused .slideShowCtrlPlay {
        background-position: -236px 0px;
        position: absolute;
}
.slideShowCtrl span.slideShowCtrlHide {
        background-image: url("images/1pixel.gif");
        cursor: auto;
}

.slideShowCtrl {
        height: 50px;
        width: 100%;
        position: relative;
        z-index:999;
        float: left;
}
.slideShowCtrl span {
        width: 50px;
        height: 100%;
        background-image: url("images/buttons.png");
        cursor: pointer;
}
.dj_ie6 .slideShowCtrl span {
        background-image: url("images/buttons.gif");
}

.dj_ie6 .slideShowPager li.currentpage,
.dj_ie6 .pagination li.disablepage{
    /*IE 6 and below. Adjust non linked LIs slightly to account for bugs*/
    margin-right: 5px;
    padding-right: 0;
}

/* dojox.image.ThumbnailPicker */

.thumbWrapper .thumbNav {
        background-repeat: no-repeat;   
        background-position: center;
        padding-top: 1px;
        width: 30px;
        height: 100%;
}

.thumbOuter {
        padding-bottom: 2px;
}

.thumbOuter.thumbHoriz {
        width: 500px;
        height: 85px;
}

.thumbOuter.thumbVert {
        width: 100px;
        height: 400px;
}

.thumbOuter .enabled {
        background: transparent url("images/buttons.png") no-repeat center center;
}
.dj_ie6 .thumbOuter .enabled { background-image: url("images/buttons.gif"); }

.thumbOuter .thumbNav img {
        width: 48px;
        height: 75px;
}
.thumbOuter .thumbClickable div {
        cursor: pointer;
}
.thumbOuter .prevHoriz {
        background-position: -96px 12px;
        position: relative;
        float: left;
        height: 100%;
}

.thumbOuter .nextHoriz {
        background-position: -144px 12px;
        position: relative;
        float: right;
        height: 100%;
/*      margin-top: -85px;*/
}
.thumbOuter .prevVert {
        background-position: 0px 0px;
        height: 48px;
        width:48px;
        margin-left:24px;
}

.thumbOuter .nextVert {
        background-position: -48px 0px;
        height: 48px;
        width:48px;
        margin-left:24px;
}

.thumbWrapper img {
        height: 75px;
        max-width: 100px;
        width: expression(this.width > 100 ? 100: true);/*IE Hack*/
}

.thumbWrapper .thumbNav .imageGalleryThumb {
        height: 50px;
}

.thumbWrapper .thumbNotifier {
        background-color: red;
        width: 0px;
        margin-left: 2px;
        height: 5px;
        font-size: 1%;/*IE hack to get around the Empty-Div bug*/
}

.thumbWrapper .thumbLoaded {
        background-color: transparent;  
}

.thumbScroller {
        overflow-x: hidden;
        overflow-y: hidden;
        white-space: nowrap;
        text-align: center;
}

.thumbHoriz .thumbScroller {
        width: 500px;
        height: 85px;
        float: left;
}

.thumbVert .thumbScroller {
        height: 500px;
        width: 100px;   
}

.thumbWrapper {
        float: left;
}

.thumbVert .thumbWrapper {
        width: 100px;
        height: 10px;
}
.thumbHoriz .thumbWapper {
        height:85px;
        width: 10px;
}

.thumbWrapper.thumbHoriz div {
        float: left;
        padding-right: 2px;
}

.thumbWrapper.thumbVert {
        width: 100px;
}

.thumbWrapper.thumbVert div {
        padding-bottom: 2px;
}

/* dojox.image.Gallery */

.imageGalleryWrapper {
        padding-bottom: 20px;
        text-align: center;
}