DIV.thumbBrowserOutside {
  position: relative;
  overflow: auto;
  width: 100%;
  height: auto;
  background-color: #DDDDDD;
}
TABLE.thumbBrowserPages {
  /*border-collapse: collapse;*/
  border-spacing: 0;
}
TR.thumbTableRow > TD {
    padding: 0;
}

TD.fl {
  padding-right: 0px !important;
}
.ds + TD.fr, .showBlankFaces.hasDs TD.fr {
  padding-left: 0px !important;
}

TR.thumbPageNumber TD {
  font-family: helvetica, arial, sans-serif;
  font-size: 7px;
  text-align: center;
  padding: 0px 4px;
}

TR.thumbImage TD {
  padding: 0px 3px;
  cursor: pointer;
}

DIV.faceImageContainer  {
    position: relative;
    width: 100%;
    height: 100%;
    white-space: nowrap;
}

DIV.faceBlankContainer {
    display: none;
}
.showBlankFaces.hasDs .ss + .fr DIV.ssbl {
    display: inline-block;
    vertical-align: top;
    background-color: white;
    border: 1px solid #ccc;
    border-right: none;
}
.showBlankFaces.hasDs .ss + TD.fr {
    padding-left: 3px !important;
}
.showBlankFaces.hasDs TR.thumbImage .fr IMG, .showBlankFaces.hasDs TR.thumbImage .fr DIV.thumbSlipSheet, TR.thumbImage .showBlankFaces.hasDs .fr DIV.thumbTabBody {
    border-left: 1px solid #DDDDDD;
}


TR.thumbImage TD DIV.faceErrorContainer {
    position: absolute;
    left: 5px;
    top: 5px;
    opacity: .6;
    filter: alpha(opacity = 60);
    background-color: white;
    font-weight: bolder;
    width: 19px;
    margin: 0;
    border: 1pt solid crimson;
}

DIV.faceError {
    margin: 0;
    width: auto;
    padding: 0;
    color: crimson;
    font-size: 20pt;
    font-weight: bolder;
    font-family: sans-serif;
    opacity: 1;
    filter: alpha(opacity = 100);
    z-index: 150;
    text-align: center;
    vertical-align: top;
}

DIV.faceZoomButton {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 16px;
    height: 16px;
    background-image:url(/images/vcf-d2hic1/thumbInterface/magnifyingGlass.png);
    background-repeat: no-repeat;
    display: none;
}

.errorPopup {
    left: -999px; /* hide it but with layout */
    position: absolute;
    width: 200px;
    border: 3pt solid crimson;
    background-color: lightyellow;
    z-index: 2220;
    margin: 0;
    padding: 5px;
}

.errorPopup UL {

}

.errorPopup UL LI {

}

.errorPointer {
    position: absolute;
    left: -999px;
    width: 3px;
    height: 15px;
    border: none;
    background-color: crimson;
    padding: 0;
    z-index: 2220;
    margin: 0;
}

TR.thumbImage TD.hover {
  background-color: #BBBBFF !important;
}
TR.thumbImage TD.selected {
  background-color: #8888FF !important;
}
TR.thumbImage TD.rfSelected {
  background-color: #CCCCFF;
}
TR.thumbImage IMG {
  border: 1px solid #ccc;
  vertical-align: top;
}
TR.thumbImage TD.fl IMG {
  border-right: none;
}
TR.thumbImage .ds + .fr IMG, TR.thumbImage .ds + .fr DIV.thumbSlipSheet, TR.thumbImage .ds + .fr DIV.thumbTabBody,
.showBlankFaces.hasDs TR.thumbImage .fr IMG, .showBlankFaces.hasDs TR.thumbImage .fr DIV.thumbSlipSheet, TR.thumbImage .showBlankFaces.hasDs .fr DIV.thumbTabBody {
  border-left: 1px solid #DDDDDD;
}
TR.thumbImage DIV.thumbSlipSheet, TR.thumbImage DIV.thumbTabBody {
  position: relative;
  width: 39px;
  height: 51px;
  background-color: white;
  border: 1px solid black;
}
.size-MEDIUM TR.thumbImage DIV.thumbSlipSheet, .size-MEDIUM TR.thumbImage DIV.thumbTabBody, .size-MEDIUM DIV.faceBlankContainer {
    width: 54px;
    height: 75px;
}
TR.thumbImage DIV.thumbTabBody {
  margin-right: 2px;
  background-color: #FFEEAA;
}
TR.thumbImage DIV.thumbTabTab {
  position: absolute;
  width: 2px;
  height: 23px;
  margin-top: -49px;
  margin-left: 40px;
  background-color: #FFEEAA;
  border: 1px solid black;
  border-left: none;
}
.size-MEDIUM  TR.thumbImage DIV.thumbTabTab {
    width: 3px;
    height: 27px;
    margin-top: -71px;
    margin-left: 55px;
}

TR.thumbImage IMG.moveLeft {
  position: absolute;
  border: none !important;
  padding: 4px;
  margin-top: -36px;
  margin-left: -16px;
  display: none;
  z-index: 100;
}
.size-MEDIUM TR.thumbImage IMG.moveLeft {
    margin-top: -50px;
}
TR.thumbImage TD.selected.hover IMG.moveLeft {
  display: block;
}
TR.thumbImage TD.ff IMG.moveLeft {
  display: none;
}

TR.thumbImage IMG.moveRight {
  position: absolute;
  border: none !important;
  padding: 4px;
  margin-top: -36px;
  margin-left: 36px;
  display: none;
  z-index: 100;
}
.size-MEDIUM TR.thumbImage IMG.moveRight {
    margin-top: -50px;
    margin-left: 54px;
}
TR.thumbImage TD.selected.hover IMG.moveRight {
  display: block;
}
TR.thumbImage TD.lf IMG.moveRight {
  display: none;
}

TR.thumbSidedness TD {
  padding: 0px;
}
TR.thumbSidedness TD.hover {
  background-color: #BBBBFF !important;
}
TR.thumbSidedness TD.selected {
  background-color: #8888FF !important;
}
TR.thumbSidedness TD.rfSelected {
  background-color: #CCCCFF;
}
TR.thumbSidedness DIV {
  position: relative;
  font-size: 1px;
  width: 8px;
  height: 1px;
  visibility: hidden;
}
TR.thumbSidedness DIV.ts {
  margin-top: 1px;
  border-top: 1px solid #BBBBBB;
}
TR.thumbSidedness DIV.bs {
  margin-bottom: 1px;
  border-bottom: 1px solid #BBBBBB;
}
TR.thumbSidedness TD.dsf DIV {
  margin-left: auto;
  border-left: 1px solid #BBBBBB;
  visibility: visible;
}
TR.thumbSidedness TD.dsb DIV {
  border-right: 1px solid #BBBBBB;
  visibility: visible;
}
TR.thumbSidedness TD.selected DIV, TR.thumbSidedness TD.rfSelected DIV {
  visibility: hidden;
}

TR.thumbSettings TD {
  text-align: center;
  font-size: 12px;
  height: 12px;
}
TR.thumbSettings TD IMG {
  width: 10px;
  height: 10px;
    margin: 0 auto;
}

TR.thumbSections TD {
    padding: 8px;
    border-bottom: 1px solid #999;
}
TR.thumbSections TD.section {
    background-color: #888;
    border-top: 1px solid #ddd;
    cursor: pointer;
}
TR.thumbSections TD.section.bleedTab {
    background-color: #800;
}
TR.thumbSections TD.last {
    border-right: 1px solid #ddd;
}
TR.thumbSections TD.first {
    border-left: 1px solid #ddd;
}
TR.thumbSections TD.sectionHover {
    background-color: #bbb;
}
TR.thumbSections TD.sectionHover.bleedTab {
    background-color: #d66;
}
TR.thumbSections TD.sectionSelected {
    border-color: #999;
    border-bottom: none;
    background-color: #eee !important;
}
TR.thumbSections TD.sectionSelected.bleedTab {
    border-color: #800;
}

TR.thumbMacScrollbar {
    height: 20px;
    background-color: #eee;
    display: none;
}
.mac TR.thumbMacScrollbar {
    display: table-row;
}





DIV.thumbBrowser {
  position: relative;
  background-color: #EEEEEE;
  border: 1px solid gray;
}

DIV.thumbBrowser * {
  line-height: normal;
}

DIV.thumbBrowser IMG {
    display: inline-block;
}

TABLE.thumbBrowserControlStrip *, DIV.thumbBrowserOutside * {
    -moz-user-select: none;
}

TABLE.thumbBrowserControlStrip {
  background-color: #EEEEEE;
  border-collapse: collapse;
  width: 100%;
  border-bottom: 1px solid #999999;
}

TABLE.thumbBrowserChoices {
  border-collapse: collapse;
}

TABLE.thumbBrowserChoices TD {
  text-align: left;
}

TABLE.thumbBrowserOptions {
  border-collapse: collapse;
  margin: 2px;
}

TABLE.thumbBrowserOptions TD.active {
    background-color: #8888FF
}

TD.thumbBrowserOption {
  border: 1px solid gray;
  width: 35px;
  height: 50px;
  padding: 0px;
  font-size: 10px;
  background-color: white;
  cursor: pointer;
  text-align: center !important;
}

TD.thumbBrowserTextOption {
  width: 31px;
  height: 31px;
  padding: 2px;
}

DIV.thumbBrowserControlStatus {
  display: none;
  position: absolute;
  background-color: #EEEEEE;
  margin-top: -1px;
  padding: 0px 13px 3px 10px;
  z-index: 100;
  border: 1px solid #999999;
  border-top: none;
}

DIV.thumbBrowserForm {
  padding-bottom: 5px;
  display: none;
  width: 100%;
}

TABLE.thumbBrowserChooser,
DIV.thumbBrowserChooser {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2500;
  background-color: #FFFFFF;
  border: 1px solid gray;
  margin-top: -3px;
  display: none;
  padding: 5px 0 5px 5px;
  border-collapse: collapse;
}
DIV.swatch {
    float:left;
  width: 25px;
  height: 25px;
  cursor: pointer;
    border:1px solid white;
}
TABLE#thumbBrowserTintColourChooser TD {
  cursor: pointer;
  vertical-align: top;
  padding: 0;
}
TABLE#thumbBrowserTintColourChooser DIV {
    width: 24px;
    height: 24px;
    margin: 0 5px 5px 0;
    float: left;
}

.unavailableTint {
  cursor: default;  
}

#thumbBrowserTintColourChooser DIV.tintContainer {
  position: relative;
  vertical-align: top;
}

#thumbBrowserTintColourChooser DIV.tintContainer DIV.disabledTintOverlay {
  position: absolute;
  top: 1px;
  left: 1px;
  background-image: url(/images/vcf-d2hic1/thumbInterface/redcross.png);
  background-repeat: no-repeat;
  background-color: white;
  opacity: .6;
  filter: alpha(opacity = 60);
  width: 16px;
  height: 16px;
    
  display: none;
}

DIV.tintColourNone {
  text-align: center;
  font-size: 8px;
    line-height: 14pt;
    border: 1px solid gray;
    cursor: pointer;
    width:23px;
    height:23px;
    margin: 1px;
}

DIV#thumbBrowserTintName {
  text-align: center;
  font-size: 10px;
    line-height: 14pt;
}
.thumbBrowserTintColourOption {
  border-right: none;
}
#thumbBrowserTintColour {
    width: 20px;
}
.noTintColour {
    background: none;
    background-image: url(/images/vcf-d2hic1/thumbInterface/tint.png);
    background-position:top center;
}
#thumbBrowserTintErrorRow {
    clear:left;
}

.tintErrorMessageIcon {
    float: left;
    width: 16px;
    height: 16px;
    background-image: url(/images/vcf-d2hic1/thumbInterface/redcross.png);
    background-repeat: no-repeat;
}

#thumbBrowserInsertChooser {
  position: absolute;
  z-index: 200;
  border-collapse: collapse;
  margin-top: -3px;
  margin-left: 2px;
  display: none;
}

#thumbBrowserErrorPanel {
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
    display: none;
    border-bottom: 1px solid #999999;    
}

.thumbBrowserRightOptions {
    position:relative;
}
#thumbBrowserInfoPanel {
    font-size: 10px;
    text-align: right;
    margin-right: 5px;
    width:150px;
    height:47px;
    overflow:hidden;
    position: absolute;
    top: 5px;
    right: 0;
    background-color: white;
    border: 1px solid black;
    padding: 2px 5px;
    display:none;
}
#thumbBrowserInfoPanel * {
    line-height: 11px;
}


/*
 * Zoom dialog
 */

#faceZoomDialog {
    position: absolute;
    left: 10px;
    top: 10px;
    z-index: 5300;
    width: 200px;
    height: 300px;
    padding: 0;
    margin: 0;
    overflow: hidden;
    border: 1pt solid black;
    background: white;
}

#faceZoomDialogTitleBar,  #faceZoomInfo {
    background-color: lightgreen;
}

#faceZoomDialogTitleBar {
    cursor: move;
}

#faceZoomInfo {
    position: absolute;
    bottom: 0;
    left: 0;
    /* right: 0; - both left and right not honoured by IE6, hence: */
    width: 9999px; /* dialog has hidden overflow */
    padding: 5px;

}

#faceZoomDialogTitle {
    padding: 5px;
}

#faceZoomImage {
    border: 1pt solid black;
    margin: 10px;
    opacity: 1;
}


#faceZoomContentBox {
    width: 100%;
    height: 100%;
    /*
    Important so that when the resizer tries to shrink the box,
    it won't semi-fail (as IE6 does) because the image in the content box
    means that the dialog div can't be shrunk (interestingly, IE6 seems to manage to
    shrink the width on some of the child elements, but not the top element? odd.
    */
    overflow: hidden;
}

#faceZoomImageBox {
    text-align: center;
    width: 100%;    
}

#faceZoomDialogCloser
{
    float: right;
    font-family: sans-serif;
    cursor: pointer;
    width: 12px;
    height: 12px;
    background-image: url(/images/vcf-d2hic1/thumbInterface/closeZoom.png);
    background-repeat: no-repeat;
    margin: 2px;
    margin-right: 4px; /* to avoid the resize handle */

}

/*
 * Resize-handles for the face zoom dialog, constructed by dragresize library
 */

/* applied to each handle */
.faceZoomDialogDr {
 position: absolute;
 width: 5px;
 height: 5px;
 font-size: 1px;
 background: #EEE;
 border: 1px solid #333;
}

/*
 Individual corner classes - required for resize support.
 These are based on the object name plus the handle ID.
*/
.faceZoomDialogDr-tl {
 top: 0;
 left: 0;
 cursor: nw-resize;
}
.faceZoomDialogDr-tm {
 top: 0;
 left: 50%;
 margin-left: -4px;
 cursor: n-resize;
}
.faceZoomDialogDr-tr {
 top: 0;
 right: 0;
 cursor: ne-resize;
}

.faceZoomDialogDr-ml {
 top: 50%;
 margin-top: -4px;
 left: 0;
 cursor: w-resize;
}
.faceZoomDialogDr-mr {
 top: 50%;
 margin-top: -4px;
 right: 0;
 cursor: e-resize;
}

.faceZoomDialogDr-bl {
 bottom: 0;
 left: 0;
 cursor: sw-resize;
}
.faceZoomDialogDr-bm {
 bottom: 0;
 left: 50%;
 margin-left: -4px;
 cursor: s-resize;
}
.faceZoomDialogDr-br {
 bottom: 0;
 right: 0;
 cursor: se-resize;
}

/*# sourceMappingURL=/Volumes/Scratch/build/neon/releaseCustomTables/production/neon/WEB-INF/classes/com/pirionsystems/ne/sites/standard/skin/staticContent/style/thumbInterface.css.map */