with a size and border */
border:0 !important;
background-color:transparent !important;
width:100% !important;
/* IE dislikes horizontal tweaking combined with width:100% so punish everyone for consistency */
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
.dj_a11y .dijitTextBox input {
margin: 0 !important;
}
.dijitValidationTextBoxError input.dijitValidationInner,
.dijitSelect input,
.dijitTextBox input.dijitArrowButtonInner {
/* used to display arrow icon/validation icon, or in arrow character in high contrast mode.
* The css below is a trick to hide the character in non-high-contrast mode
*/
text-indent: -2em !important;
direction: ltr !important;
text-align: left !important;
height: auto !important;
#text-indent: 0 !important;
#letter-spacing: -5em !important;
#text-align: right !important;
}
.dj_ie .dijitSelect input,
.dj_ie .dijitTextBox input,
.dj_ie input.dijitTextBox {
overflow-y: visible; /* inputs need help expanding when padding is added or line-height is adjusted */
line-height: normal; /* strict mode */
}
.dijitSelect .dijitSelectLabel span {
line-height: 100%;
}
.dj_ie .dijitSelect .dijitSelectLabel {
line-height: normal;
}
.dj_ie6 .dijitSelect .dijitSelectLabel,
.dj_ie7 .dijitSelect .dijitSelectLabel,
.dj_ie8 .dijitSelect .dijitSelectLabel,
.dj_iequirks .dijitSelect .dijitSelectLabel,
.dijitSelect td,
.dj_ie6 .dijitSelect input,
.dj_iequirks .dijitSelect input,
.dj_ie6 .dijitSelect .dijitValidationContainer,
.dj_ie6 .dijitTextBox input,
.dj_ie6 input.dijitTextBox,
.dj_iequirks .dijitTextBox input.dijitValidationInner,
.dj_iequirks .dijitTextBox input.dijitArrowButtonInner,
.dj_iequirks .dijitTextBox input.dijitSpinnerButtonInner,
.dj_iequirks .dijitTextBox input.dijitInputInner,
.dj_iequirks input.dijitTextBox {
line-height: 100%; /* IE7 problem where the icon is vertically way too low w/o this */
}
.dj_a11y input.dijitValidationInner,
.dj_a11y input.dijitArrowButtonInner {
/* (in high contrast mode) revert rules from above so character displays */
text-indent: 0 !important;
width: 1em !important;
#text-align: left !important;
color: black !important;
}
.dijitValidationTextBoxError .dijitValidationContainer {
display: inline;
cursor: default;
}
/* ComboBox & Spinner */
.dijitSpinner .dijitSpinnerButtonContainer,
.dijitComboBox .dijitArrowButtonContainer {
/* dividing line between input area and up/down button(s) for ComboBox and Spinner */
border-width: 0 0 0 1px !important; /* !important needed due to wayward ".theme .dijitButtonNode" rules */
}
.dj_a11y .dijitSelect .dijitArrowButtonContainer,
.dijitToolbar .dijitComboBox .dijitArrowButtonContainer {
/* overrides above rule plus mirror-image rule in dijit_rtl.css to have no divider when ComboBox in Toolbar */
border-width: 0 !important;
}
.dijitComboBoxMenu {
/* Drop down menu is implemented as
- ... but we don't want circles before each item */
list-style-type: none;
}
.dijitSpinner .dijitSpinnerButtonContainer .dijitButtonNode {
/* dividing line between input area and up/down button(s) for ComboBox and Spinner */
border-width: 0;
}
.dj_ie .dj_a11y .dijitSpinner .dijitSpinnerButtonContainer .dijitButtonNode {
clear: both; /* IE workaround */
}
.dj_ie .dijitToolbar .dijitComboBox {
/* make combobox buttons align properly with other buttons in a toolbar */
vertical-align: middle;
}
/* Spinner */
.dijitTextBox .dijitSpinnerButtonContainer {
width: 1em;
position: relative !important;
overflow: hidden;
}
.dijitSpinner .dijitSpinnerButtonInner {
width:1em;
visibility:hidden !important; /* just a sizing element */
overflow-x:hidden;
}
.dijitComboBox .dijitButtonNode,
.dijitSpinnerButtonContainer .dijitButtonNode {
border-width: 0;
}
.dj_a11y .dijitSpinnerButtonContainer .dijitButtonNode {
border-width: 0px !important;
border-style: solid !important;
}
.dj_a11y .dijitTextBox .dijitSpinnerButtonContainer,
.dj_a11y .dijitSpinner .dijitArrowButtonInner,
.dj_a11y .dijitSpinnerButtonContainer input {
width: 1em !important;
}
.dj_a11y .dijitSpinner .dijitArrowButtonInner {
margin: 0 auto !important; /* should auto-center */
}
.dj_ie .dj_a11y .dijitSpinner .dijitArrowButtonInner .dijitInputField {
padding-left: 0.3em !important;
padding-right: 0.3em !important;
margin-left: 0.3em !important;
margin-right: 0.3em !important;
width: 1.4em !important;
}
.dj_ie7 .dj_a11y .dijitSpinner .dijitArrowButtonInner .dijitInputField {
padding-left: 0 !important; /* manually center INPUT: character is .5em and total width = 1em */
padding-right: 0 !important;
width: 1em !important;
}
.dj_ie6 .dj_a11y .dijitSpinner .dijitArrowButtonInner .dijitInputField {
margin-left: 0.1em !important;
margin-right: 0.1em !important;
width: 1em !important;
}
.dj_iequirks .dj_a11y .dijitSpinner .dijitArrowButtonInner .dijitInputField {
margin-left: 0 !important;
margin-right: 0 !important;
width: 2em !important;
}
.dijitSpinner .dijitSpinnerButtonContainer .dijitArrowButton {
/* note: .dijitInputLayoutContainer makes this rule override .dijitArrowButton settings
* for dijit.form.Button
*/
padding: 0;
position: absolute !important;
right: 0;
float: none;
height: 50%;
width: 100%;
bottom: auto;
left: 0;
right: auto;
}
.dj_iequirks .dijitSpinner .dijitSpinnerButtonContainer .dijitArrowButton {
width: auto;
}
.dj_a11y .dijitSpinnerButtonContainer .dijitArrowButton {
overflow: visible !important;
}
.dijitSpinner .dijitSpinnerButtonContainer .dijitDownArrowButton {
top: 50%;
border-top-width: 1px !important;
}
.dijitSpinner .dijitSpinnerButtonContainer .dijitUpArrowButton {
#bottom: 50%; /* otherwise (on some machines) top arrow icon too close to splitter border (IE6/7) */
top: 0;
}
.dijitSpinner .dijitArrowButtonInner {
margin: auto;
overflow-x: hidden;
height: 100% !important;
}
.dj_iequirks .dijitSpinner .dijitArrowButtonInner {
height: auto !important;
}
.dijitSpinner .dijitArrowButtonInner .dijitInputField {
-moz-transform: scale(0.5);
-moz-transform-origin: center top;
-webkit-transform: scale(0.5);
-webkit-transform-origin: center top;
-o-transform: scale(0.5);
-o-transform-origin: center top;
transform: scale(0.5);
transform-origin: left top;
padding-top: 0;
padding-bottom: 0;
padding-left: 0 !important;
padding-right: 0 !important;
width: 100%;
visibility: hidden;
}
.dj_ie .dijitSpinner .dijitArrowButtonInner .dijitInputField {
zoom: 50%; /* emulate transform: scale(0.5) */
}
.dijitSpinner .dijitSpinnerButtonContainer .dijitArrowButtonInner {
overflow: hidden;
}
.dj_a11y .dijitSpinner .dijitSpinnerButtonContainer .dijitArrowButton {
width: 100%;
}
.dj_iequirks .dj_a11y .dijitSpinner .dijitSpinnerButtonContainer .dijitArrowButton {
width: 1em; /* matches .dj_a11y .dijitTextBox .dijitSpinnerButtonContainer rule - 100% is the whole screen width in quirks */
}
.dj_a11y .dijitSpinner .dijitArrowButtonInner .dijitInputField {
vertical-align:top;
visibility: visible;
}
.dj_a11y .dijitSpinnerButtonContainer {
width: 1em;
}
/****
dijit.form.CheckBox
&
dijit.form.RadioButton
****/
.dijitCheckBox,
.dijitRadio,
.dijitCheckBoxInput {
padding: 0;
border: 0;
width: 16px;
height: 16px;
background-position:center center;
background-repeat:no-repeat;
overflow: hidden;
}
.dijitCheckBox input,
.dijitRadio input {
margin: 0;
padding: 0;
display: block;
}
.dijitCheckBoxInput {
/* place the actual input on top, but invisible */
opacity: 0;
}
.dj_ie .dijitCheckBoxInput {
filter: alpha(opacity=0);
}
.dj_a11y .dijitCheckBox,
.dj_a11y .dijitRadio {
/* in a11y mode we display the native checkbox (not the icon), so don't restrict the size */
width: auto !important;
height: auto !important;
}
.dj_a11y .dijitCheckBoxInput {
opacity: 1;
filter: none;
width: auto;
height: auto;
}
.dj_a11y .dijitFocusedLabel {
/* for checkboxes or radio buttons in high contrast mode, use border rather than outline to indicate focus (outline does not work in FF)*/
border: 1px dotted;
outline: 0px !important;
}
/****
dijit.ProgressBar
****/
.dijitProgressBar {
z-index: 0; /* so z-index settings below have no effect outside of the ProgressBar */
}
.dijitProgressBarEmpty {
/* outer container and background of the bar that's not finished yet*/
position:relative;overflow:hidden;
border:1px solid black; /* a11y: border necessary for high-contrast mode */
z-index:0; /* establish a stacking context for this progress bar */
}
.dijitProgressBarFull {
/* outer container for background of bar that is finished */
position:absolute;
overflow:hidden;
z-index:-1;
top:0;
width:100%;
}
.dj_ie6 .dijitProgressBarFull {
height:1.6em;
}
.dijitProgressBarTile {
/* inner container for finished portion */
position:absolute;
overflow:hidden;
top:0;
left:0;
bottom:0;
right:0;
margin:0;
padding:0;
width: 100%; /* needed for IE/quirks */
height:auto;
background-color:#aaa;
background-attachment: fixed;
}
.dj_a11y .dijitProgressBarTile {
/* a11y: The border provides visibility in high-contrast mode */
border-width:2px;
border-style:solid;
background-color:transparent !important;
}
.dj_ie6 .dijitProgressBarTile {
/* width:auto works in IE6 with position:static but not position:absolute */
position:static;
/* height:auto or 100% does not work in IE6 */
height:1.6em;
}
.dijitProgressBarIndeterminate .dijitProgressBarTile {
/* animated gif for 'indeterminate' mode */
}
.dijitProgressBarIndeterminateHighContrastImage {
display:none;
}
.dj_a11y .dijitProgressBarIndeterminate .dijitProgressBarIndeterminateHighContrastImage {
display:block;
position:absolute;
top:0;
bottom:0;
margin:0;
padding:0;
width:100%;
height:auto;
}
.dijitProgressBarLabel {
display:block;
position:static;
width:100%;
text-align:center;
background-color:transparent !important;
}
/****
dijit.Tooltip
****/
.dijitTooltip {
position: absolute;
z-index: 2000;
display: block;
/* make visible but off screen */
left: 0;
top: -10000px;
overflow: visible;
}
.dijitTooltipContainer {
border: solid black 2px;
background: #b8b5b5;
color: black;
font-size: small;
}
.dijitTooltipFocusNode {
padding: 2px 2px 2px 2px;
}
.dijitTooltipConnector {
position: absolute;
}
.dj_a11y .dijitTooltipConnector {
display: none; /* won't show b/c it's background-image; hide to avoid border gap */
}
.dijitTooltipData {
display:none;
}
/* Layout widgets. This is essential CSS to make layout work (it isn't "styling" CSS)
make sure that the position:absolute in dijitAlign* overrides other classes */
.dijitLayoutContainer {
position: relative;
display: block;
overflow: hidden;
}
.dijitAlignTop,
.dijitAlignBottom,
.dijitAlignLeft,
.dijitAlignRight {
position: absolute;
overflow: hidden;
}
body .dijitAlignClient { position: absolute; }
/*
* BorderContainer
*
* .dijitBorderContainer is a stylized layout where panes have border and margin.
*/
.dijitBorderContainer {
position:relative;
overflow: hidden;
z-index: 0; /* so z-index settings below have no effect outside of the BorderContainer */
}
.dijitBorderContainerPane {
position: absolute !important; /* !important to override position:relative in dijitTabContainer etc. */
z-index: 2; /* above the splitters so that off-by-one browser errors don't cover up border of pane */
}
.dijitBorderContainer > .dijitTextArea {
/* On Safari, for SimpleTextArea inside a BorderContainer,
don't want to display the grip to resize */
resize: none;
}
.dijitGutter {
/* gutter is just a place holder for empty space between panes in BorderContainer */
position: absolute;
font-size: 1px; /* needed by IE6 even though div is empty, otherwise goes to 15px */
}
/* SplitContainer
'V' == container that splits vertically (up/down)
'H' = horizontal (left/right)
*/
.dijitSplitter {
position: absolute;
overflow: hidden;
z-index: 10; /* above the panes so that splitter focus is visible on FF, see #7583*/
background-color: #fff;
border-color: gray;
border-style: solid;
border-width: 0;
}
.dj_ie .dijitSplitter {
z-index: 1; /* behind the panes so that pane borders aren't obscured see test_Gui.html/[14392] */
}
.dijitSplitterActive {
z-index: 11 !important;
}
.dijitSplitterCover {
position:absolute;
z-index:-1;
top:0;
left:0;
width:100%;
height:100%;
}
.dijitSplitterCoverActive {
z-index:3 !important;
}
/* #6945: stop mouse events */
.dj_ie .dijitSplitterCover {
background: white;
opacity: 0;
}
.dj_ie6 .dijitSplitterCover,
.dj_ie7 .dijitSplitterCover,
.dj_ie8 .dijitSplitterCover {
filter: alpha(opacity=0);
}
.dijitSplitterH {
height: 7px;
border-top:1px;
border-bottom:1px;
cursor: row-resize;
-webkit-tap-highlight-color: transparent;
}
.dijitSplitterV {
width: 7px;
border-left:1px;
border-right:1px;
cursor: col-resize;
-webkit-tap-highlight-color: transparent;
}
.dijitSplitContainer {
position: relative;
overflow: hidden;
display: block;
}
.dijitSplitPane {
position: absolute;
}
.dijitSplitContainerSizerH,
.dijitSplitContainerSizerV {
position:absolute;
font-size: 1px;
background-color: ThreeDFace;
border: 1px solid;
border-color: ThreeDHighlight ThreeDShadow ThreeDShadow ThreeDHighlight;
margin: 0;
}
.dijitSplitContainerSizerH .thumb, .dijitSplitterV .dijitSplitterThumb {
overflow:hidden;
position:absolute;
top:49%;
}
.dijitSplitContainerSizerV .thumb, .dijitSplitterH .dijitSplitterThumb {
position:absolute;
left:49%;
}
.dijitSplitterShadow,
.dijitSplitContainerVirtualSizerH,
.dijitSplitContainerVirtualSizerV {
font-size: 1px;
background-color: ThreeDShadow;
-moz-opacity: 0.5;
opacity: 0.5;
filter: Alpha(Opacity=50);
margin: 0;
}
.dijitSplitContainerSizerH, .dijitSplitContainerVirtualSizerH {
cursor: col-resize;
}
.dijitSplitContainerSizerV, .dijitSplitContainerVirtualSizerV {
cursor: row-resize;
}
.dj_a11y .dijitSplitterH {
border-top:1px solid #d3d3d3 !important;
border-bottom:1px solid #d3d3d3 !important;
}
.dj_a11y .dijitSplitterV {
border-left:1px solid #d3d3d3 !important;
border-right:1px solid #d3d3d3 !important;
}
/* ContentPane */
.dijitContentPane {
display: block;
overflow: auto; /* if we don't have this (or overflow:hidden), then Widget.resizeTo() doesn't make sense for ContentPane */
-webkit-overflow-scrolling: touch;
}
.dijitContentPaneSingleChild {
/*
* if the ContentPane holds a single layout widget child which is being sized to match the content pane,
* then the ContentPane should never get a scrollbar (but it does due to browser bugs, see #9449
*/
overflow: hidden;
}
.dijitContentPaneLoading .dijitIconLoading,
.dijitContentPaneError .dijitIconError {
margin-right: 9px;
}
/* TitlePane and Fieldset */
.dijitTitlePane {
display: block;
overflow: hidden;
}
.dijitFieldset {
border: 1px solid gray;
}
.dijitTitlePaneTitle, .dijitFieldsetTitle {
cursor: pointer;
-webkit-tap-highlight-color: transparent;
}
.dijitTitlePaneTitleFixedOpen, .dijitTitlePaneTitleFixedClosed,
.dijitFieldsetTitleFixedOpen, .dijitFieldsetTitleFixedClosed {
/* TitlePane or Fieldset that cannot be toggled */
cursor: default;
}
.dijitTitlePaneTitle * {
vertical-align: middle;
}
.dijitTitlePane .dijitArrowNodeInner, .dijitFieldset .dijitArrowNodeInner {
/* normally, hide arrow text in favor of icon */
display: none;
}
.dj_a11y .dijitTitlePane .dijitArrowNodeInner, .dj_a11y .dijitFieldset .dijitArrowNodeInner {
/* ... except in a11y mode, then show text arrow */
display: inline;
font-family: monospace; /* because - and + are different widths */
}
.dj_a11y .dijitTitlePane .dijitArrowNode, .dj_a11y .dijitFieldset .dijitArrowNode {
/* ... and hide icon (TODO: just point dijitIcon class on the icon, and it hides automatically) */
display: none;
}
.dijitTitlePaneTitleFixedOpen .dijitArrowNode, .dijitTitlePaneTitleFixedOpen .dijitArrowNodeInner,
.dijitTitlePaneTitleFixedClosed .dijitArrowNode, .dijitTitlePaneTitleFixedClosed .dijitArrowNodeInner,
.dijitFieldsetTitleFixedOpen .dijitArrowNode, .dijitFieldsetTitleFixedOpen .dijitArrowNodeInner,
.dijitFieldsetTitleFixedClosed .dijitArrowNode, .dijitFieldsetTitleFixedClosed .dijitArrowNodeInner {
/* don't show the open close icon or text arrow; it makes the user think the pane is closable */
display: none !important; /* !important to override above a11y rules to show text arrow */
}
.dj_ie6 .dijitTitlePaneContentOuter,
.dj_ie6 .dijitTitlePane .dijitTitlePaneTitle {
/* force hasLayout to ensure borders etc, show up */
zoom: 1;
}
/* Color Palette
* Sizes designed so that table cell positions match icons in underlying image,
* which appear at 20x20 intervals.
*/
.dijitColorPalette {
border: 1px solid #999;
background: #fff;
position: relative;
}
.dijitColorPalette .dijitPaletteTable {
/* Table that holds the palette cells, and overlays image file with color swatches.
* padding/margin to align table with image.
*/
padding: 2px 3px 3px 3px;
position: relative;
overflow: hidden;
outline: 0;
border-collapse: separate;
}
.dj_ie6 .dijitColorPalette .dijitPaletteTable,
.dj_ie7 .dijitColorPalette .dijitPaletteTable,
.dj_iequirks .dijitColorPalette .dijitPaletteTable {
/* using padding above so that focus border isn't cutoff on moz/webkit,
* but using margin on IE because padding doesn't seem to work
*/
padding: 0;
margin: 2px 3px 3px 3px;
}
.dijitColorPalette .dijitPaletteCell {
/*