/*
dojo.css
Baseline CSS file for general usage.
This file is intended to be a "quick and dirty" stylesheet you can use to give
a straight-up web page some basic styling without having to do the dirty work
yourself. It includes a modified version of YUI's reset.css (we pulled some
of the list reset definitions, among other things), and then provides some very
basic style rules to be applied to general HTML elements.
This stylesheet is NOT intended to serve as the foundation for more complex things--
including the use of a TABLE for layout purposes. The table definitions in this
file make the assumption that you will be using tables for thier declared purpose:
displaying tabular data.
If you are looking for a baseline stylesheet using tables for grid layout, you will
need to supply your own layout rules to override the ones in this stylesheet.
Applications using Dojo will function correctly without including this
file, but it should provide sane defaults for many common things that page
authors often need to set up manually.
The Dojo Core uses this stylesheet to quickly style HTML-based tests and demos. Feel
free to use it as you will.
*/
/*****************************************************************************************/
/*
The below are borrowed from YUI's reset style sheets for pages and fonts.
We've verified w/ the YUI development team that these are entirely
copyright Yahoo, written entirely by Nate Koechley and Matt Sweeney without
external contributions.
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.2.1
*/
body, div, dl, dt, dd, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
margin: 0;
padding: 0;
}
fieldset, img {
border: 0 none;
}
address, caption, cite, code, dfn, th, var {
font-style: normal;
font-weight: normal;
}
caption, th {
text-align: left;
}
q:before, q:after {
content:"";
}
abbr, acronym {
border:0;
}
/* End YUI imported code. */
/*****************************************************************************************/
/*
Begin Dojo additions.
Style definitions, based loosely on the Dijit Tundra theme.
Relative unit calculations based on "Compose to a Vertical Rhythm",
by Richard Rutter (http://24ways.org/2006/compose-to-a-vertical-rhythm)
If changing the font size, make sure you do it in both
percent and px (% for IE, px for everything else).
% value based on default size of 16px (in most browsers).
So if you want the default size to be 14px, set the
% to 87% (14 / 16 = 0.875).
Typical values:
10px: 62.5%
11px: 69% (68.75)
12px: 75%
13px: 81.25%
14px: 87.5%
16px: 100%
Default: 13px, specified by the YUI imports.
*/
body {
font: 13px Myriad,Arial,Helvetica,clean,sans-serif;
*font-size: small;
*font: x-small;
}
/* Headings */
h1 {
font-size: 1.5em;
font-weight: normal;
line-height: 1em;
margin-top: 1em;
margin-bottom:0;
}
h2 {
font-size: 1.1667em;
font-weight: bold;
line-height: 1.286em;
margin-top: 1.929em;
margin-bottom:0.643em;
}
h3, h4, h5, h6 {
font-size: 1em;
font-weight: bold;
line-height: 1.5em;
margin-top: 1.5em;
margin-bottom: 0;
}
/* paragraphs, quotes and lists */
p {
font-size: 1em;
margin-top: 1.5em;
margin-bottom: 1.5em;
line-height: 1.5em;
}
blockquote {
font-size: 0.916em;
margin-top: 3.272em;
margin-bottom: 3.272em;
line-height: 1.636em;
padding: 1.636em;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}
ol li, ul li {
font-size: 1em;
line-height: 1.5em;
margin: 0;
}
/* pre and code */
pre, code {
font-size:115%;
*font-size:100%;
font-family: Courier, "Courier New";
background-color: #efefef;
border: 1px solid #ccc;
}
pre {
border-width: 1px 0;
padding: 1.5em;
}
/*
Tables
Note that these table definitions make the assumption that you are using tables
to display tabular data, and NOT using tables as layout mechanisms. If you are
using tables for layout, you will probably want to override these rules with
more specific ones.
These definitions make tabular data look presentable, particularly when presented
inline with paragraphs.
*/
table { font-size:100%; }
table.dojoTabular {
border-collapse: collapse;
border-spacing: 0;
border: 1px solid #ccc;
margin: 0 1.5em;
}
.dojoTabular th {
text-align: center;
font-weight: bold;
}
table.dojoTabular thead, table.dojoTabular tfoot {
background-color: #efefef;
border: 1px solid #ccc;
border-width: 1px 0;
}
table.dojoTabular thead tr th,
table.dojoTabular thead tr td,
table.dojoTabular tbody tr td,
table.dojoTabular tfoot tr td {
padding: 0.25em 0.5em;
}
/*
Essential styles that themes can inherit.
In other words, works but doesn't look great.
*/
/****
GENERIC PIECES
****/
.dijitReset {
/* Use this style to null out padding, margin, border in your template elements
so that page specific styles don't break them.
- Use in all TABLE, TR and TD tags.
- If there is more than one class on the tag, place this first so other classes override.
*/
margin:0px;
border:0px;
padding:0px;
line-height:normal;
}
.dijitInline {
/* To inline block elements.
Similar to InlineBox below, but this has fewer side-effects in Moz.
Also, apparently works on a DIV as well as a FIELDSET.
*/
display:-moz-inline-box; /* FF2 */
display:inline-block; /* webkit and FF3 */
border:0px;
padding:0px;
vertical-align:middle;
}
.dj_ie .dijitInline {
zoom: 1; /* set hasLayout:true to mimic inline-block */
#display:inline;
}
.dijitInlineTable {
/* To inline tables with a given width set (otherwise, use dijitInline above)
* Must also put style="-moz-inline-stack" on the node itself to workaround FF2 bugs
*/
display: -moz-inline-stack; /* FF2 */
display:inline-table;
display:inline-block; /* webkit and FF3 */
#display:inline; /* MSIE (TODO: is this needed???) */
border:0px;
padding:0px;
vertical-align:middle;
position:relative; /* #5034 */
}
.dijitTeeny {
font-size:1px;
line-height:1px;
}
/*
* Popup items have a wrapper div (dijitPopup)
* with the real popup inside, and maybe an iframe too
*/
.dijitPopup {
position: absolute;
background-color: transparent;
margin: 0;
border: 0;
padding: 0;
}
.dijit_a11y .dijitPopup,
.dijit_ally .dijitPopup div,
.dijit_a11y .dijitPopup table,
.dijit_a11y .dijitTooltipContainer {
opacity: 1 !important;
background-color: white !important;
}
.dj_ie .dijit_a11y .dijitPopup * {
filter: none;
}
.dijitInputField {
font-family:inherit;
font-size:inherit;
font-weight:inherit;
}
.dijitPositionOnly {
/* Null out all position-related properties */
padding: 0px !important;
border: 0px !important;
background-color: transparent !important;
background-image: none !important;
height: auto !important;
width: auto !important;
}
.dijitNonPositionOnly {
/* Null position-related properties */
float: none !important;
position: static !important;
margin: 0px 0px 0px 0px !important;
vertical-align: middle !important;
}
.dijitBackgroundIframe {
/*
* iframe used for FF2 in high-contrast mode to prevent menu
* being transparent
*/
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: -1;
border: 0;
padding: 0;
margin: 0;
}
.dijitClickableRegion {
/* a region we expect the user to click on */
cursor : pointer;
}
.dijitDisplayNone {
/* hide something. Use this as a class rather than element.style so another class can override */
display:none !important;
}
.dijitContainer {
/* for all layout containers */
overflow: hidden; /* need on IE so something can be reduced in size, and so scrollbars aren't temporarily displayed when resizing */
}
/****
A11Y
****/
.dijit_a11y * {
background-image:none !important;
background-color:transparent !important;
}
.dijit_a11y .dijitCalendarIncrementControl .dijitA11ySideArrow {
padding-left:.2em;
visibility:visible !important;
}
.dijitToolbar .dijitDropDownButton .dijitA11yDownArrow{
/*make the arrow smaller in toolbar*/
padding:0;
margin:0;
}
.dj_ie6 .dijitToolbar .dijitDropDownButton .dijitA11yDownArrow{
/*vertical-align: middle does not place the arrow in the middle of the toolbar in IE*/
vertical-align: bottom;
}
.dijitA11ySideArrow {
vertical-align:top;
margin-right:0em;
margin-left:.2em;
line-height:2em;
text-align:center;
}
.dj_ie .dijitA11yDownArrow,
.dj_ie .dijitA11yUpArrow {
font-size:.8em;
vertical-align:middle;
margin-right:.5em;
}
.dijit_a11y .dijitButton .dijitButtonNode,
.dijit_a11y .dijitDropDownButton .dijitButtonNode,
.dijit_a11y .dijitComboButton .dijitButtonNode,
.dijit_a11y .dijitComboBox .dijitInputField,
.dijit_a11y .dijitComboBox .dijitButtonNode {
border:1px solid black !important;
background:white !important;
color:black !important;
}
.dijit_a11y .dijitButtonDisabled .dijitButtonNode,
.dijit_a11y .dijitDropDownButtonDisabled .dijitButtonNode,
.dijit_a11y .dijitComboButtonDisabled .dijitButtonNode,
.dijit_a11y .dijitComboBoxDisabled .dijitInputField,
.dijit_a11y .dijitComboBoxDisabled .dijitButtonNode,
.dijit_a11y .dijitSpinnerDisabled .dijitButtonNode,
.dijit_a11y .dijitSpinnerDisabled .dijitInputField {
border:1px dotted #999999 !important;
color:#999999 !important;
}
.dijit_a11y .dijitComboButton .dijitDownArrowButton,
.dijit_a11y .dijitComboBox .dijitDownArrowButton {
border-left:0px !important;
}
/* In high contrast mode, display the check symbol */
.dijit_a11y .dijitToggleButtonChecked .dijitToggleButtonIconChar {
display: inline !important;
}
/****
3-element borders: ( dijitLeft + dijitStretch + dijitRight )
****/
.dijitLeft {
/* Left part of a 3-element border */
background-position:left top;
background-repeat:no-repeat;
}
.dijitStretch {
/* Middle (stretchy) part of a 3-element border */
white-space:nowrap; /* MOW: move somewhere else */
background-repeat:repeat-x;
}
.dijitRight {
/* Right part of a 3-element border */
#display:inline; /* IE7 sizes to outer size w/o this */
background-position:right top;
background-repeat:no-repeat;
}
/****
Right-to-left rules
****/
.dijitRTL .dijitRightArrow {
/* it becomes a left arrow for LTR locales */
/* MOW: TODO... */
margin-left:-2.1em;
}
/****
dijit.form.Button
dijit.form.DropDownButton
dijit.form.ComboButton
dijit.form.ComboBox (partial)
****/
.dijitButton,
.dijitDropDownButton,
.dijitComboButton,
.dijitComboBox {
/* outside of button */
margin: 0.2em;
/* normalize line-heights inside the button */
line-height: 1.3em;
}
.dj_safari .dijitToolbar .dijitDropDownButton {
padding-left: 0.3em;
}
.dijitButtonNode {
/* Node that is acting as a button -- may or may not be a BUTTON element */
border:1px solid gray;
margin:0px;
padding:.2em .2em .1em .2em;
overflow:visible;
line-height:normal;
font-family:inherit;
font-size:inherit;
color: inherit;
cursor:pointer;
vertical-align:middle;
text-align:center;
white-space: nowrap;
}
.dijitDownArrowButton,
.dijitUpArrowButton {
/* Node that is acting as a arrow button -- drop down (spinner has its own treatment). Also gets dijitButtonNode */
/* place AFTER dijitButtonNode so it overrides */
padding:0em .4em;
margin:0px;
font-size: 0.7em;
}
.dijitButtonContents {
color:inherit;
}
.dijitDropDownButton .dijitA11yDownArrow {
margin-left:.8em;
}
.dijitComboButton TABLE {
/* each cell in a combo-table should have its own separate border */
border-collapse: separate;
border:0px;
padding:0px;
margin:0px;
}
.dijitComboButton .dijitButtonContents {
border-right-width:0px !important;
}
table .dijitButton .dijitButtonNode,
table .dijitComboButton .dijitButtonNode {
#overflow:hidden; /* visible messes up if the button is inside a table on IE */
}
.dijitButtonNode IMG {
/* make text and images line up cleanly */
vertical-align:middle;
margin-bottom:.2em;
}
/******
TextBox related.
Everything that has an
*******/
.dijitTextBox,
.dijitComboBox,
.dijitSpinner {
border: solid black 1px;
width: 15em; /* need to set default size on outer node since inner nodes say and
. user can override */
}
/* rules for safari to deal with fuzzy blue focus border */
.dijitTextBox input:focus,
.dijitComboBox input:focus,
.dijitSpinner input:focus {
outline: none; /* blue fuzzy line looks wrong on combobox or something w/validation icon showing */
}
.dijitTextBoxFocused,
.dijitComboBoxFocused,
.dijitSpinnerFocused {
/* should we display focus like we do on other browsers, or use the safari standard focus indicator?? */
outline: auto 5px -webkit-focus-ring-color;
}
.dijitTextBox INPUT,
.dijitComboBox INPUT,
.dijitSpinner INPUT {
padding:0px;
border-left: solid black 1px; /* TODO: for RTL mode should be border-right */
display:inline;
position:static !important;
border:0px !important;
margin:0px !important;
vertical-align:0em !important;
visibility:visible !important;
background-color:transparent !important;
background-image:none !important;
width:100% !important;
}
/* #4711: prevent IE from over-expanding 100% width input boxes */
.dj_ie .dijitTextBox .dijitInputField,
.dj_ie .dijitComboBox .dijitInputField,
.dj_ie .dijitSpinner .dijitInputField {
position:relative;
}
.dj_ie .dijitTextBox .dijitInputField INPUT,
.dj_ie .dijitComboBox .dijitInputField INPUT,
.dj_ie .dijitSpinner .dijitInputField INPUT {
position:absolute !important;
top:auto !important;
left:auto !important;
right:auto !important;
bottom:auto !important;
font-size:100%;
}
.dj_ie INPUT.dijitTextBox {
font-size:100%;
}
/* Display an "X" for invalid input. Themes will override these rules to display an icon instead.
*/
.dijitValidationIcon { display: none; background-position-y:center; }
.dijitValidationIconText { visibility: hidden; }
.dijit_a11y .dijitValidationIcon { display: none !important; }
.dijit_a11y .dijitValidationIconText { display: block !important; }
.dijitTextBoxError .dijitValidationIconText,
.dijitComboBoxError .dijitValidationIconText,
.dijitSpinnerError .dijitValidationIconText {
visibility: visible;
}
.dijitSpinner .dijitDownArrowButton,
.dijitSpinner .dijitUpArrowButton {
padding: 0 .4em;
border: 1px solid;
line-height: .769em;
/* TODO: as we use border-collapse, is this necessary? */
border-left-style: none;
}
.dj_ie .dijitSpinner .dijitDownArrowButton,
.dj_ie .dijitSpinner .dijitUpArrowButton {
padding: 0 .2em!important;
text-align: center;
}
.dijitSpinner .dijitDownArrowButton div,
.dijitSpinner .dijitUpArrowButton div {
text-align: center;
font-size: .769em;
line-height: 1em;
vertical-align: baseline;
margin: 0 auto;
}
.dijitTextBox .dijitDownArrowButton {
/* this is for a combo box with no arrow displayed; we set baseClass=TextBox */
display:none;
}
/****
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;
}
.dijitCheckBox INPUT,
.dijitRadio INPUT {
margin: 0;
padding: 0;
display: block;
}
.dijitCheckBoxInput {
/* place the actual input on top, but all-but-invisible */
opacity: 0.01;
overflow:hidden;
}
.dj_ie .dijitCheckBoxInput {
filter: alpha(opacity=0);
}
.dijit_a11y .dijitCheckBox,
.dijit_a11y .dijitRadio {
width: auto;
height: auto;
}
.dijit_a11y .dijitCheckBoxInput {
opacity: 1;
filter: none;
width: auto;
height: auto;
}
/****
dijit.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%;
height:100%;
}
.dijitProgressBarTile{
/* inner container for finished portion */
position:absolute;
overflow:hidden;
top:0px;
left:0px;
bottom:0px;
right:0px;
margin:0px;
padding:0px;
width:auto;
height:auto;
background-color:#aaa;
background-attachment: fixed;
}
.dijit_a11y .dijitProgressBarTile{
/* a11y: The border provides visibility in high-contrast mode */
border-width:4px;
border-style:solid;
background-color:transparent !important;
}
.dj_iequirks .dijitProgressBarTile{
width:100%;
height:100%;
}
.dj_ie6 .dijitProgressBarTile{
/* width:auto works in IE6 with position:static but not position:absolute */
position:static;
/* height:auto does not work in IE6 */
height:100%;
}
.dijitProgressBarIndeterminate .dijitProgressBarLabel{
visibility:hidden;
}
.dijitProgressBarIndeterminate .dijitProgressBarTile{
/* animated gif for 'indeterminate' mode */
}
.dijitProgressBarIndeterminateHighContrastImage{
display:none;
}
.dijit_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;
}
/* progress bar in vertical mode - TODO: remove? no longer supported? */
.dijitProgressBarVertical .dijitProgressBarFull{
bottom:0px; /* start at the bottom */
}
.dj_ie6 .dijitProgressBarVertical .dijitProgressBarTile{
position:absolute;
/* can't use position:static here -- need absolute positioning to place
the bar at the bottom of a vertical progressbar */
width:100%;
}
/****
dijit.Tooltip
****/
.dijitTooltip {
position: absolute;
z-index: 2000;
display: block;
/* make visible but off screen */
left: 50%;
top: -10000px;
overflow: visible;
}
/*
See http://trac.dojotoolkit.org/ticket/5006
.dijitTooltipDialog {
position: relative;
}
*/
.dijitTooltipContainer {
border: solid black 2px;
background: #b8b5b5;
color: black;
font-size: small;
}
.dijitTooltipFocusNode {
padding: 2px 2px 2px 2px;
}
.dijitTooltipConnector {
position: absolute;
}
/* MOW: using actual images at this time
/* draw an arrow with CSS only * /
.dijitTooltipConnector {
/* the border on the triangle * /
font-size: 0px; line-height: 0%; width: 0px;
border-top: none;
border-bottom: 14px solid black;
border-left: 7px solid transparent;
border-right: 7px solid transparent;
top: -14px;
left: 3px;
z-index: 2;
}
.dijitTooltipConnector div {
/* the background of the triangle * /
font-size: 0px; line-height: 0%; width: 0px;
position: absolute;
border-bottom: 10px solid #b8b5b5;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
top: 6px;
left: -5px;
z-index: 3;
}
*/
/* 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;
}
body .dijitAlignTop,
body .dijitAlignBottom,
body .dijitAlignLeft,
body .dijitAlignRight {
position: absolute;
overflow: hidden;
}
body .dijitAlignClient { position: absolute; }
/* SplitContainer
'V' == container that splits vertically (up/down)
'H' = horizontal (left/right)
*/
.dijitSplitContainer{
position: relative;
overflow: hidden;
display: block;
}
.dijitSplitPane{
position: absolute;
}
.dijitSplitContainerSizerH,
.dijitSplitContainerSizerV {
position:absolute;
font-size: 1px;
cursor: move;
cursor: w-resize;
background-color: ThreeDFace;
border: 1px solid;
border-color: ThreeDHighlight ThreeDShadow ThreeDShadow ThreeDHighlight;
margin: 0;
}
.dijitSplitContainerSizerV {
cursor: n-resize;
}
.dijitSplitContainerSizerH .thumb {
position:absolute;
top:49%;
}
.dijitSplitContainerSizerV .thumb {
position:absolute;
left:49%;
}
.dijitSplitContainerVirtualSizerH,
.dijitSplitContainerVirtualSizerV {
font-size: 1px;
cursor: move;
cursor: w-resize;
background-color: ThreeDShadow;
-moz-opacity: 0.5;
opacity: 0.5;
filter: Alpha(Opacity=50);
margin: 0;
}
.dijitSplitContainerVirtualSizerV {
cursor: n-resize;
}
/* ContentPane */
.dijitContentPane {
display: block;
overflow: auto; /* if we don't have this (or overflow:hidden), then Widget.resizeTo() doesn't make sense for ContentPane */
}
/* TitlePane */
.dijitTitlePane {
display: block;
overflow: hidden;
}
/* Color Palette */
.dijitColorPalette {
border:1px solid #999;
background:#fff;
-moz-border-radius:3pt;
}
img.dijitColorPaletteUnder {
border-style:none;
position:absolute;
left:0;
top:0;
}
.dijitColorPaletteInner {
position: relative;
overflow:hidden;
outline:0;
}
.dijitPaletteImg {
width: 16px; /*This is the width of one color in the provided palettes. */
height: 14px; /* Height of one color in the provided palettes. */
position: absolute;
overflow: hidden;
cursor: default;
z-index: 10;
border:1px solid #999;
/* -moz-border-radius:2pt; */
}
.dijitPaletteImgHighlight {
width: 14px; /*This is the width of one color in the provided palettes. */
height: 12px; /* Height of one color in the provided palettes. */
position: absolute;
overflow: hidden;
cursor: default;
z-index: 10;
}
/* .dijitPaletteImg:hover, */
.dijitPaletteImg:focus,
.dijitPaletteImgHighlight {
width: 14px; /*This is the width of one color in the provided palettes. */
height: 12px; /* Height of one color in the provided palettes. */
border:2px solid #000;
outline:2px solid #dedede;
/* -moz-border-radius:0; */
}
.dijitColorPaletteCell {
width:16px;
height:14px;
border: 1px solid;
}
.dijitColorPaletteCell:hover {
border-style: solid;
outline:0;
}
/* Accordion */
.dijitAccordionPane {
overflow: hidden !important; /* prevent spurious scrollbars */
}
.dijitAccordionPane .dijitAccordionBody {
overflow: auto;
}
.dijitAccordionContainer {
border:1px solid #b7b7b7;
border-top:0 !important;
}
.dijitAccordionPane .dijitAccordionTitle:hover {
cursor: pointer;
}
.dijitAccordionPane .dijitAccordionTitle .dijitAccordionArrow {
float: right;
}
/* images off, high-contrast mode styles */
.dijitAccordionPane .dijitAccordionTitle .arrowTextUp,
.dijitAccordionPane .dijitAccordionTitle .arrowTextDown {
display: none;
float: right;
font-size: 0.65em;
font-weight: normal !important;
}
.dijit_a11y .dijitAccordionPane .dijitAccordionTitle .arrowTextUp {
display: inline;
}
.dijit_a11y .dijitAccordionPane-selected .dijitAccordionTitle .arrowTextDown {
display: inline;
}
.dijit_a11y .dijitAccordionPane-selected .dijitAccordionTitle .arrowTextUp {
display: none;
}
/* Calendar */
.dijitCalendarContainer thead tr th, .dijitCalendarContainer thead tr td, .dijitCalendarContainer tbody tr td, .dijitCalendarContainer tfoot tr td {
padding: 0;
}
.dijitCalendarNextYear {
margin:0 0 0 0.55em;
}
.dijitCalendarPreviousYear {
margin:0 0.55em 0 0;
}
.dijitCalendarIncrementControl {
cursor:pointer;
cursor:hand;
width:1em;
}
.dijitCalendarDisabledDate {
color:gray !important;
}
.dijitCalendarBodyContainer tbody tr td {
cursor:pointer;
cursor:hand;
}
.dijitCalendarPreviousMonthDisabled {
cursor:default !important
}
.dijitCalendarCurrentMonthDisabled {
cursor:default !important
}
.dijitCalendarNextMonthDisabled {
cursor:default !important;
}
.dijitCalendarDateTemplate {
cursor:pointer;
}
.dijitCalendarSelectedYear {
cursor:pointer;
}
.dijitCalendarNextYear,
.dijitCalendarPreviousYear {
cursor:pointer;
}
.dijitCalendarMonthLabelSpacer {
/* don't display it, but make it affect the width */
position: relative;
height: 1px;
overflow: hidden;
visibility: hidden;
}
/* Menu */
.dijitMenu {
border:1px solid black;
background-color:white;
}
.dijitMenuTable {
margin:1px 0px;
border-collapse:collapse;
border-width:0px;
background-color:white;
}
.dijitMenuItem{
white-space: nowrap;
padding:.1em .2em;
}
.dijitMenuItemHover {
cursor:pointer;
cursor:hand;
background-color:black;
color:white;
}
.dijitMenuItemIcon {
position: relative;
background-position: center center;
background-repeat: no-repeat;
}
.dijitMenuItemDisabled * {
/* for a disabled menu item, just set it to mostly transparent */
opacity:0.3;
cursor:default;
}
.dj_ie .dijit_a11y .dijitMenuItemDisabled td,
.dj_ie .dijitMenuItemDisabled *,
.dj_ie .dijitMenuItemDisabled td {
color:gray !important;
filter: alpha(opacity=35);
}
.dijitMenuItemLabel {
position: relative;
vertical-align: middle;
}
.dijit_a11y .dijitMenuItemHover .dijitMenuItemLabel {
border-width: 1px;
border-style: solid;
}
.dijit_a11y .dijitMenuItemHover {
border: 1px #fff dotted !important;
}
.dijit_a11y .dijitMenuExpandInner {
display:block !important;
}
/* separator can be two pixels -- set border of either one to 0px to have only one */
.dijitMenuSeparatorTop {
height: 50%;
margin: 0px;
margin-top:3px;
font-size: 1px;
}
.dijitMenuSeparatorBottom {
height: 50%;
margin: 0px;
margin-bottom:3px;
font-size: 1px;
}
/* Tab */
.dijitTabContainer .dijitAlignTop {
/* position the tab labels row down by 1 px, and on top of the dijitTabPaneWrapper
so the buttons can overlay the tab pane properly */
top:1px !important;
z-index:10;
}
.dijitTabContainer .dijitAlignBottom {
/* position the tab labels row up by 1 px so they overlap */
margin-top:-1px !important;
z-index:10;
}
.dijitTabContainer .dijitAlignLeft {
/* position the tab labels left by 1 px so they overlap */
margin-right:-1px !important;
z-index:10;
}
.dijitTabContainer .dijitAlignRight {
/* position the tab labels row up by 1 px, and on top of the dijitTabPaneWrapper
so the buttons can overlay the tab pane properly */
margin-left:-1px !important;
z-index:10;
}
.dijitTabPaneWrapper {
z-index:0;
overflow: hidden;
}
.dijitTab {
position:relative;
float:left;
cursor:pointer;
white-space:nowrap;
z-index:3;
}
.dijitTabContainer .dijitAlignLeft .dijitTab,
.dijitTabContainer .dijitAlignRight .dijitTab {
float:none;
}
.dijitTabInnerDiv {
position:relative;
}
.dijitTab .close {
display: inline-block;
cursor: default;
font-size: small;
}
/* images off, high-contrast mode styles */
.dijitTab .closeText {
display:none;
padding: 0px 2px;
margin: 0px 2px;
}
.dijit_a11y .dijitTab .closeImage {
padding: 0px !important;
margin: 0px !important;
top: 0px !important;
bottom: 0px !important;
}
.dijit_a11y .closeText {
display:inline;
margin-left:6px;
}
.dijit_a11y .closeText:hover {
border:thin solid;
}
.dijit_a11y .dijitTabChecked {
border-style:dashed !important;
}
.dijit_a11y .dijitTabInnerDiv {
border-left:none !important;
}
.dijitInlineEditor {
/* span around an inline-editable value when in edit mode */
position:relative;
vertical-align:bottom;
}
.dj_ie .dijitInlineEditor {
vertical-align:middle;
}
.dijitInlineValue {
/* span around an inline-editable value when NOT in edit mode */
}
.dijitInlineEditor .dijitButtonContainer {
/* div around the buttons -- makes them float below the field */
position:absolute;
right:0px;
overflow:visible;
}
.dijitInlineEditor .saveButton,
.dijitInlineEditor .cancelButton {
}
/* Tree */
.dijitTreeExpando {
float: left;
display: inline;
clear:both;
}
.dijitTreeExpand {
float: left;
display: inline;
}
.dijitTreeContent {
cursor: default;
/* can't make inline - multiline bugs */
}
.dijitExpandoText {
display: none;
}
.dijit_a11y .dijitExpandoText {
float: left;
display: inline;
padding-left: 10px;
padding-right: 10px;
font-family: monospace;
border-style: solid;
border-width: thin;
}
/* Dialog */
.dijitDialog {
position: absolute;
z-index: 999;
padding: 1px;
}
.dijitDialogUnderlayWrapper {
position: absolute;
left: 0px;
top: 0px;
z-index: 998;
display: none;
background: transparent;
}
.dijitDialogUnderlay {
background: #eeeeee;
opacity: 0.5;
}
.dj_ie .dijitDialogUnderlay {
filter: alpha(opacity=50);
}
/* images off, high-contrast mode styles */
.dijit_a11y .dijitDialog {
opacity: 1 !important;
background-color: white !important;
}
.dijitDialog .closeText {
display:none;
position:absolute;
}
.dijit_a11y .dijitDialog .closeText {
display:inline;
}
.dijitSliderMoveable {
z-index:99;
position:absolute !important;
display:block;
vertical-align:middle;
}
.dijitHorizontalSliderMoveable {
right:0px;
}
.dijit_a11y div.dijitSliderImageHandle,
.dijitSliderImageHandle {
margin:0px;
padding:0px;
position:absolute !important;
border:8px solid gray;
width:0px;
height:0px;
}
.dijit_a11y .dijitSliderFocused .dijitSliderImageHandle {
border:4px solid #000;
height:8px;
width:8px;
}
.dijitVerticalSliderImageHandle {
top:-8px;
left:-6px;
}
.dijitHorizontalSliderImageHandle {
left:-8px;
top:-5px;
vertical-align:top;
}
.dijitSliderBar {
border-style:solid;
border-color:black;
}
.dijitHorizontalSliderBar {
height:4px;
border-width:1px 0px;
}
.dijitVerticalSliderBar {
width:4px;
border-width:0px 1px;
}
.dijitSliderProgressBar {
background-color:red;
#z-index:0;
}
.dijitVerticalSliderProgressBar {
position:static !important;
height:0%;
vertical-align:top;
text-align:left;
}
.dijitHorizontalSliderProgressBar {
position:absolute !important;
width:0%;
vertical-align:middle;
overflow:visible;
}
.dijitSliderRemainingBar {
overflow:hidden;
background-color:transparent;
#z-index:-1;
}
.dijitVerticalSliderRemainingBar {
height:100%;
text-align:left;
}
.dijitHorizontalSliderRemainingBar {
width:100% !important;
}
/* the slider bumper is the space consumed by the slider handle when it hangs over an edge */
.dijitSliderBumper {
overflow:hidden;
#z-index:-1
}
.dijitVerticalSliderBumper {
width:4px;
height:8px;
border-width:0px 1px;
}
.dijitHorizontalSliderBumper {
width:8px;
height:4px;
border-width:1px 0px;
}
.dijitVerticalSliderBottomBumper,
.dijitHorizontalSliderLeftBumper {
background-color:red;
}
.dijitVerticalSliderTopBumper,
.dijitHorizontalSliderRightBumper {
background-color:transparent;
}
.dijitHorizontalSliderDecoration {
text-align:center;
}
.dijitSlider .dijitSliderButton {
font-family:monospace;
margin:0px;
padding:0px;
display:block;
}
.dijit_a11y .dijitSliderButtonInner {
visibility:visible !important;
}
.dijitSlider .dijitVerticalSliderTopButton {
vertical-align:bottom;
}
.dijitSlider .dijitVerticalSliderBottomButton {
vertical-align:top;
}
.dijitSliderButtonContainer {
text-align:center;
height:0px;
}
.dijitSlider .dijitButtonNode {
padding:0px;
display:block;
}
.dj_ie .RuleContainer {
z-index: -1; /* #4809 */
}
.RuleContainer {
position:relative;
overflow:visible;
}
.VerticalRuleContainer {
height:100%;
line-height:0px;
float:left;
text-align:left;
}
.dj_opera .VerticalRuleContainer {
line-height:2%;
}
.dj_ie .VerticalRuleContainer {
line-height:normal;
}
.dj_gecko .VerticalRuleContainer {
margin:0px 0px 1px 0px; /* mozilla bug workaround for float:left,height:100% block elements */
}
.RuleMark {
position:absolute;
border:1px solid black;
line-height:0px;
height:100%;
}
.HorizontalRuleMark {
width:0px;
border-top-width:0px !important;
border-bottom-width:0px !important;
border-left-width:0px !important;
}
.RuleLabelContainer {
position:absolute;
}
.HorizontalRuleLabelContainer {
text-align:center;
display:inline-block;
}
.HorizontalRuleLabel {
position:relative;
left:-50%;
}
.VerticalRuleMark {
height:0px;
border-right-width:0px !important;
border-bottom-width:0px !important;
border-left-width:0px !important;
width:100%;
left:0px;
}
.dj_ie .VerticalRuleLabelContainer {
margin-top:-.55em;
}
/* Toolbar A11y */
.dijit_a11y .dijitButtonContents .dijitButtonText {
display: inline !important;
}
.dijitTextArea {
width:100%;
}
.dj_ie .dijitTextArea p {
margin-top:0px;
margin-bottom:0px;
}
/* Editor */
.IEFixedToolbar {
position:absolute;
/* top:0; */
top: expression(eval((document.documentElement||document.body).scrollTop));
}
/* TimePicker */
.dijitTimePickerItemInner {
text-align:center;
border:0;
padding:2px 8px 2px 8px;
}
.dijitTimePickerTick {
/* opacity:0.1 !important; */
color:#dedede;
border-bottom:1px solid #dedede;
border-top:1px solid #dedede;
position:relative;
}
.dijitTimePickerTick .dijitTimePickerItemInner {
font-size:0.25em;
}
.dijitTimePickerMarker {
background-color:#ededed;
border-top:1px solid #999;
border-bottom:1px solid #999;
}
.dijitTimePickerItemHover {
opacity:1 !important;
background-color:#808080;
color:#fff;
border-top:1px solid #333;
border-bottom:1px solid #333;
cursor:pointer;
}
.dijitTimePickerMarker.dijitTimePickerItemHover {
font-size:1.3em;
}
.dijitTimePickerItemHover .dijitTimePickerItemInner {
display:block;
overflow:visible;
background-color:#808080;
font-size:1em;
}
.dijitTimePickerItemSelected {
font-weight:bold;
color:#333;
background-color:#b7cdee !important;
}
.dijit_a11y .dijitTimePickerItem {
border-bottom:1px solid #333;
}
/* Disable the high contrast character */
.dijitToggleButtonIconChar {
display:none !important;
}
.dijit_a11y .dijitToggleButtonIconChar {
display:inline !important;
}
.dijit_a11y .dijitToggleButtonIconChar {
visibility:hidden;
}
.dijit_a11y .dijitToggleButtonChecked .dijitToggleButtonIconChar {
visibility:visible !important;
}
/*
Adds cosmetic styling to Dijit. Users may swap with a custom theme CSS file.
*/
@import url("../dijit.css");
.dj_safari .tundra .dijitPopup {
/* -webkit-border-radius: 5px; */
-webkit-box-shadow: 0px 5px 10px #adadad;
}
/*
* Control opacity of popups
*/
.tundra .dijitPopup div,
.tundra .dijitPopup table {
opacity: 0.95;
}
/*****
dijit.form.Button
dijit.form.DropDownButton
dijit.form.ComboButton
dijit.form.ComboBox (partial)
*****/
.tundra .dijitButtonNode {
/* enabled state - inner */
/* border:1px outset #a0a0a0; */
border:1px solid #9b9b9b;
vertical-align: middle;
padding: 0.2em 0.2em;
background:#e9e9e9 url("images/buttonEnabled.png") repeat-x top;
}
.dj_ie .tundra .dijitButtonNode {
zoom: 1;
padding-bottom: 0.1em;
}
/* button inner contents - labels, icons etc. */
.tundra .dijitButtonNode * {
display: -moz-inline-box;
display: inline-block;
vertical-align: middle;
}
.dj_ie .tundra .dijitButtonNode * {
zoom: 1;
display:inline;
}
.tundra .dijitButtonText {
padding: 0 0.3em;
}
.tundra .dijitComboBox .dijitButtonNode,
.tundra .dijitSpinner .dijitButtonNode {
border: 0px;
padding: 1px .4em; /* the inner node will be vertically centered automatically because it's in a
*/
}
.tundra .dijitA11yDownArrow,
.tundra .dijitDownArrowButton,
.tundra .dijitUpArrowButton {
font-size: 0.75em;
color: #848484;
}
.tundra .dijitButtonDisabled .dijitButtonNode,
.tundra .dijitToggleButtonDisabled .dijitButtonNode,
.tundra .dijitDropDownButtonDisabled .dijitButtonNode,
.tundra .dijitComboButtonDisabled .dijitButtonNode,
.tundra .dijitComboBoxDisabled,
.tundra .dijitSpinnerDisabled,
.tundra .dijitSpinnerDisabled .dijitButtonNode {
/* disabled state - inner */
border: 1px solid #d5d5d5;
/*color:#b4b4b4;*/
background:#e4e4e4 url("images/buttonDisabled.png") top repeat-x;
opacity: 0.60; /* Safari, Opera and Mozilla */
}
.tundra .dijitButtonDisabled .dijitButtonNode *,
.tundra .dijitToggleButtonDisabled .dijitButtonNode *,
.tundra .dijitDropDownButtonDisabled .dijitButtonNode *,
.tundra .dijitComboButtonDisabled .dijitButtonNode *,
.tundra .dijitSpinnerDisabled .dijitButtonNode * {
filter: gray() alpha(opacity=50); /* IE */
}
.tundra .dijitButtonHover .dijitButtonNode,
.tundra .dijitToggleButtonHover .dijitButtonNode,
.tundra .dijitDropDownButtonHover .dijitButtonNode,
.tundra .dijitComboButtonHover .dijitButtonContents,
.tundra .dijitComboButtonDownArrowHover .dijitDownArrowButton,
.tundra .dijitComboBoxHover .dijitDownArrowButton,
.tundra .dijitSpinnerUpArrowHover .dijitUpArrowButton,
.tundra .dijitSpinnerDownArrowHover .dijitDownArrowButton {
/* hover state - inner */
/* TODO: change from Hover to Selected so that button is still highlighted while drop down is being used */
border-color:#366dba;
color:#366dba;
background:#f1f6fc url("images/buttonHover.png") repeat-x bottom;
}
.tundra .dijitButtonActive .dijitButtonNode,
.tundra .dijitToggleButtonActive .dijitButtonNode,
.tundra .dijitDropDownButtonActive .dijitButtonNode,
.tundra .dijitComboButtonActive .dijitButtonContents,
.tundra .dijitDownArrowActive .dijitDownArrowButton,
.tundra .dijitComboBoxActive .dijitDownArrowButton {
/* active state - inner (for when you are pressing a normal button, or
* when a toggle button is in a depressed state
*/
border-color:#366dba;
background: #ededed url("images/buttonActive.png") bottom repeat-x;
}
.tundra .dijitToolbar {
border: 1px solid #9b9b9b;
background:#e9e9e9 url("images/buttonEnabled.png") repeat-x top;
}
.tundra .dijitToolbar * {
padding: 0px;
margin: 0px;
/* #margin-top: -1px; */
/*IE*/
}
.dj_ie .tundra .dijitToolbar {
padding-bottom: 1px;
}
.tundra .dijitToolbar .dijitButtonNode {
padding: 0px;
margin: 0px;
border: 1px solid transparent;
background: none;
_margin: 1px;
_padding: 0px 1px 0px 1px;
_border: 0px;
}
.tundra .dijitToolbar .dijitToggleButtonChecked .dijitButtonNode {
background-color:#C1D2EE;
border:1px solid #316AC5;
}
.tundra .dijitToolbar .dijitToggleButtonCheckedHover .dijitButtonContents {
border-color: #366dba;
background-color:transparent;
}
.dj_ie6 .tundra .dijitToolbar .dijitButtonNode {
/* workaround no transparent border support in IE6*/
border-color: #e9e9e9;
}
.tundra .dijitToolbar .dijitButtonHover .dijitButtonNode,
.tundra .dijitToolbar .dijitToggleButtonHover .dijitButtonNode,
.tundra .dijitToolbar .dijitDropDownButtonHover .dijitButtonNode {
/* TODO: change this from Hover to Selected so that button is still highlighted while drop down is being used */
border-color: #366dba;
/* IE hackery */
_border: 1px solid #366dba;
_margin: -1px 0px 0px 0px;
_padding: 0px;
}
.dijitToolbarSeparator {
background: url('images/editor.gif');
height: 18px;
width: 5px;
padding: 0px 1px 0px 1px;
margin: 0px;
}
.tundra .dijitToolbar .dijitToolbarSeparator {
background: url('images/editor.gif');
}
/* ComboBox-icon-specific */
.tundra .dijitComboBox .dijitDownArrowButtonChar {
/* visibility:hidden; */
display:none;
}
.dijit_a11y .dijitComboBox .dijitDownArrowButtonChar {
display:inline;
}
.tundra .dijitComboBox .dijitDownArrowButtonInner {
width:16px;
height:16px;
background:url("images/arrowDown.png") no-repeat center center;
}
.dj_ie6 .tundra .dijitComboBox .dijitDownArrowButtonInner {
background-image:url("images/arrowDown.gif");
}
.tundra .dijitComboBoxHover .dijitDownArrowButtonInner {
/* TODO: url("images/arrowDownHover.png") but in IE6 it flickers some? */
}
/*****
dijit.form.NumberSpinner
override for the shorter stacked buttons
*****/
.tundra .dijitSpinner .dijitButtonNode {
padding: 0 .4em 0 .4em;
}
/****
dijit.form.TextBox
dijit.form.ValidationTextBox
dijit.form.SerializableTextBox
dijit.form.RangeBoundTextBox
dijit.form.NumberTextBox
dijit.form.CurrencyTextBox
dijit.form.NumberSpinner
dijit.form.ComboBox (partial)
****/
.tundra .dijitInputField INPUT,
.tundra .dijitTextBox,
.tundra .dijitComboBox,
.tundra .dijitSpinner {
margin: 0em 0.1em 0.0em 0.1em;
}
.tundra .dijitTextBox,
.tundra .dijitComboBox,
.tundra .dijitSpinner,
.tundra .dijitInlineEditor input,
.tundra .dijitTextArea {
/* For all except dijit.form.NumberSpinner: the actual input element.
For TextBox, ComboBox, Spinner: the table that contains the input.
Otherwise the actual input element.
*/
background:#fff url("images/validationInputBg.png") repeat-x top left;
#background:#fff url('images/validationInputBg.gif') repeat-x top left;
border:1px solid #9b9b9b;
line-height: normal;
}
.dj_safari .tundra INPUT.dijitTextBox {
padding:0.15em 0em; /* make it roughly the same size as a validation input box */
}
.dj_ie .tundra INPUT.dijitTextBox,
.dj_ie .tundra TD.dijitInputField,
.dj_ie .tundra .dijitInputField INPUT {
height: 1.2em; /* needed since the INPUT is position:absolute */
}
.tundra .dijitComboBox .dijitButtonNode,
.tundra .dijitSpinner .dijitButtonNode {
/* line between the input area and the drop down button */
border-left:1px solid #9b9b9b;
}
.tundra .dijitSpinner .dijitDownArrowButton {
border-top:1px solid #9b9b9b; /* line between top and bottom arrow */
}
.tundra .dijitTextBoxFocused,
.tundra .dijitComboBoxFocused,
.tundra .dijitSpinnerFocused {
/* input field when focused (ie: typing affects it) */
border-color:#366dba;
}
.tundra .dijitComboBoxFocused .dijitButtonNode, .tundra .dijitSpinnerFocused .dijitButtonNode {
border-left:1px solid #366dba;
}
.tundra .dijitSpinnerFocused .dijitDownArrowButton {
border-top:1px solid #366dba;
}
.tundra .dijitTextBoxError,
.tundra .dijitComboBoxError,
.tundra .dijitSpinnerError {
border:1px solid #f3d118;
background-color:#f9f7ba;
background-image:none;
}
.dj_ie6 .tundra .dijitTextBoxError input,
.dj_ie6 .tundra .dijitComboBoxError input,
.dj_ie6 .tundra .dijitSpinnerError input {
/* background-color: transparent on an doesn't work on IE6 */
background-color:#f9f7ba !important;
}
.tundra .dijitTextBoxErrorFocused,
.tundra .dijitComboBoxErrorFocused,
.tundra .dijitSpinnerErrorFocused {
background-color:#ff6;
background-image:none;
}
.dj_ie6 .tundra .dijitTextBoxErrorFocused input,
.dj_ie6 .tundra .dijitComboBoxErrorFocused input,
.dj_ie6 .tundra .dijitSpinnerErrorFocused input {
/* background-color: transparent on an doesn't work on IE6 */
background-color:#ff6 !important;
}
/* Validation errors */
.tundra .dijitValidationIcon {
/* prevent height change when widget goes from valid to invalid state, and
* workaround browser (FF and safari) sizing bugs when last table column is empty or display:null
*/
display: block;
width: 16px;
height: 16px;
background-repeat: no-repeat;
background-image: url('images/warning.png');
visibility: hidden;
}
.tundra .dijitValidationIconText {
display: none;
}
.tundra .dijitTextBoxError .dijitValidationIcon,
.tundra .dijitComboBoxError .dijitValidationIcon,
.tundra .dijitSpinnerError .dijitValidationIcon {
visibility: visible;
}
/*
* CheckBox and Radio Widgets,
* and the CSS to embed a checkbox or radio icon inside a ToggleButton.
*
* Order of images in the default sprite (from L to R, checkbox and radio in same image):
* checkbox normal - checked
* - unchecked
* disabled - checked
* - unchecked
* hover - checked
* - unchecked
*
* radio normal - checked
* - unchecked
* disabled - checked
* - unchecked
* hover - checked
* - unchecked
*/
.tundra .dijitToggleButton .dijitCheckBox,
.tundra .dijitToggleButton .dijitRadio,
.tundra .dijitToggleButton .dijitCheckBoxIcon,
.tundra .dijitToggleButton .dijitRadioIcon {
background-image: url('images/checkmarkNoBorder.gif');
}
.tundra .dijitCheckBox,
.tundra .dijitRadio,
.tundra .dijitCheckBoxIcon, /* inside a toggle button */
.tundra .dijitRadioIcon { /* inside a toggle button */
background-image: url('images/checkmark.gif'); /* checkbox sprite image */
background-repeat: no-repeat;
width: 16px;
height: 16px;
overflow: visible;
margin: 0;
padding: 0;
}
.tundra .dijitCheckBox,
.tundra .dijitToggleButton .dijitCheckBoxIcon {
/* unchecked */
background-position: -16px;
}
.tundra .dijitCheckBoxChecked,
.tundra .dijitToggleButtonChecked .dijitCheckBoxIcon {
/* checked */
background-position: 0px;
}
.tundra .dijitCheckBoxDisabled {
/* disabled */
background-position: -48px;
}
.tundra .dijitCheckBoxCheckedDisabled {
/* disabled but checked */
background-position: -32px;
}
.tundra .dijitCheckBoxHover,
.tundra .dijitCheckBoxFocused {
/* hovering over an unchecked enabled checkbox */
background-position: -80px;
}
.tundra .dijitCheckBoxCheckedHover,
.tundra .dijitCheckBoxCheckedFocused {
/* hovering over a checked enabled checkbox */
background-position: -64px;
}
.tundra .dijitRadio,
.tundra .dijitToggleButton .dijitRadioIcon {
/* unselected */
background-position: -112px;
}
.tundra .dijitRadioChecked,
.tundra .dijitToggleButtonChecked .dijitRadioIcon {
/* selected */
background-position: -96px;
}
.tundra .dijitRadioCheckedDisabled {
/* selected but disabled */
background-position: -128px;
}
.tundra .dijitRadioDisabled {
/* unselected and disabled */
background-position: -144px;
}
.tundra .dijitRadioHover,
.tundra .dijitRadioFocused {
/* hovering over an unselected enabled radio button */
background-position: -176px;
}
.tundra .dijitRadioCheckedHover,
.tundra .dijitRadioCheckedFocused {
/* hovering over a selected enabled radio button */
background-position: -160px;
}
/* Menu */
.tundra .dijitMenu {
border: 1px solid #9b9b9b;
margin: 0px;
padding: 0px;
}
.tundra .dijitMenuItem {
background-color: #f7f7f7;
font: menu;
margin: 0;
}
.tundra .dijitMenuPreviousButton, .tundra .dijitMenuNextButton {
font-style: italic;
}
.tundra .dijitMenuItem TD {
padding:2px;
}
.tundra .dijitMenuItemHover {
background-color: #808080; /* #95a0b0; #555555; #aaaaaa; #646464; #60a1ea; #848484; */
color:#fff;
}
.tundra .dijitMenuItemIcon {
width: 16px;
height: 16px;
/* padding-right: 3px; */
}
.tundra .dijitMenuExpand {
display:none;
}
.tundra .dijitMenuExpandEnabled {
/* margin-top:4px; */
width:16px;
height:16px;
background:url('images/arrowRight.png') no-repeat center center;
display:block;
}
.dj_ie6 .tundra .dijitMenuExpandEnabled {
background-image:url('images/arrowRight.gif');
}
.tundra .dijitMenuExpandInner {
display:none;
}
.tundra .dijitMenuSeparator {
background-color: #f7f7f7;
}
/* separator can be two pixels -- set border of either one to 0px to have only one */
.tundra .dijitMenuSeparatorTop {
border-bottom: 1px solid #9b9b9b; /*97adcb; */
}
.tundra .dijitMenuSeparatorBottom {
border-top: 1px solid #e8e8e8;
}
/* TitlePane */
.tundra .dijitTitlePane .dijitTitlePaneTitle {
background: #cccccc;
background:#fafafa url("images/titleBarBg.gif") repeat-x bottom left;
border:1px solid #bfbfbf;
padding:4px 4px 2px 4px;
cursor: pointer;
}
.dj_ie7 .dijitTitlePaneTextNode {
display:inline;
}
/* TODO: merge these, and all other icons to a series of background-image:() and background-position: -16*n px styles */
.tundra .dijitTitlePane .dijitArrowNode {
width:16px;
height:16px;
float:right;
}
.tundra .dijitTitlePane .dijitClosed .dijitArrowNode {
background:url('images/arrowRight.png') no-repeat center center;
}
.tundra .dijitTitlePaneFocused .dijitTitlePaneTextNode {
text-decoration:underline;
}
.dj_ie6 .tundra .dijitTitlePane .dijitClosed .dijitArrowNode {
background-image:url('images/arrowRight.gif');
}
.tundra .dijitTitlePane .dijitOpen .dijitArrowNode {
background:url('images/arrowDown.png') no-repeat center center;
}
.dj_ie6 .tundra .dijitTitlePane .dijitOpen .dijitArrowNode {
background-image:url('images/arrowDown.gif');
}
.tundra .dijitTitlePane .dijitArrowNodeInner {
visibility:hidden;
}
.dijit_a11y .dijitTitlePane .dijitArrowNodeInner {
visibility:visible;
}
.tundra .dijitTitlePaneTitle .dijitOpenCloseArrowOuter {
margin-right:5px;
}
.tundra .dijitOpen .dijitTitlePaneTitle .dijitOpenCloseArrowOuter {
position:relative;
top:2px;
}
.tundra .dijitTitlePaneContentOuter {
background: #ffffff;
border:1px solid #bfbfbf;
border-top: 1px solid #cddde9; /* w/out this, an
on the top line causes a gap between the .content and .label */
}
.tundra .dijitTitlePaneContentInner {
padding:10px;
}
/* force hasLayout to ensure borders etc, show up */
.dj_ie6 .tundra .dijitTitlePaneContentOuter,
.dj_ie6 .tundra .dijitTitlePane .dijitTitlePaneTitle {
zoom: 1;
}
.tundra .dijitClickableRegion {
background-color : #ffc !important;
}
/* Tabs */
.tundra .dijitTabPaneWrapper {
/*
overflow: hidden;
*/
background:#fff;
border:1px solid #ccc;
}
.tundra .dijitTab {
line-height:normal;
margin-right:5px; /* space between one tab and the next in top/bottom mode */
padding:0px;
border:1px solid #ccc;
background:#e2e2e2 url("images/tabEnabled.png") repeat-x;
}
.tundra .dijitAlignLeft .dijitTab,
.tundra .dijitAlignRight .dijitTab {
margin-right:0px;
margin-bottom:5px; /* space between one tab and the next in left/right mode */
}
.tundra .dijitTabInnerDiv {
padding:6px 10px 4px 10px;
border-left:1px solid #fff;
border-bottom:1px solid #fff;
}
.tundra .dijitTabHover,
.tundra .dijitTabCloseButtonHover {
color: #243C5F;
border-top-color:#92a0b3;
border-left-color:#92a0b3;
border-right-color:#92a0b3;
background:#e2e2e2 url("images/tabHover.png") repeat-x bottom;
}
.dj_ie6 .tundra .dijitTabHover,
.dj_ie6 .tundra .dijitTabCloseButtonHover {
background-image: url("images/tabHover.gif");
}
.tundra .dijitTabChecked,
.tundra .dijitTabCloseButtonChecked
{
/* the selected tab (with or without hover) */
background-color:#fff;
border-color: #ccc;
background-image:none;
}
/* make the active tab white on the side next to the content pane */
.tundra .dijitAlignTop .dijitTabChecked,
.tundra .dijitAlignTop .dijitTabCloseButtonChecked
{
border-bottom-color:white;
vertical-align:bottom;
}
.tundra .dijitAlignBottom .dijitTabChecked,
.tundra .dijitAlignBottom .dijitTabCloseButtonChecked
{
border-top-color:white;
-moz-border-radius:2px 2px 0px 0px; /* eliminate some border detritrus on moz */
}
.tundra .dijitAlignLeft .dijitTabChecked,
.tundra .dijitAlignLeft .dijitTabCloseButtonChecked
{
border-right-color:white;
}
.tundra .dijitAlignRight .dijitTabChecked,
.tundra .dijitAlignRight .dijitTabCloseButtonChecked
{
border-left-color:white;
}
/* make space for a positioned close button */
.tundra .dijitTab .dijitClosable {
position: relative;
padding:6px 20px 4px 10px;
}
.tundra .dijitTab .dijitClosable .closeImage {
position:absolute;
top: 7px;
right: 3px;
height: 12px;
width: 12px;
padding: 0;
margin: 0;
background: url("images/tabClose.png") no-repeat right top;
}
.dj_ie6 .dijitTab .dijitClosable .closeImage {
background-image:url("images/tabClose.gif");
}
.tundra .dijitTabCloseButton .dijitClosable .closeImage {
background-image : url("images/tabClose.png");
}
.dj_ie6 .tundra .dijitTabCloseButton .dijitClosable .closeImage {
background-image : url("images/tabClose.gif");
}
.tundra .dijitTabCloseButtonHover .dijitClosable .closeImage {
background-image : url("images/tabCloseHover.png");
}
.dj_ie6 .tundra .dijitTabCloseButtonHover .dijitClosable .closeImage {
background-image : url("images/tabCloseHover.gif");
}
.tundra .dijitAlignLeft .dijitTab .dijitClosable {
padding:6px 10px 4px 20px;
}
/* correct for IE6.
We cant force hasLayout as that blows out the shrink wrapped tabs
..so we shim in the closeImage position properties instead
*/
.dj_ie6 .tundra .dijitAlignLeft .dijitTab .dijitClosable .closeImage {
left:-20px;
}
.tundra .dijitAlignBottom .dijitTab .dijitClosable .closeImage {
top: auto;
bottom: 7px;
right: 3px;
}
.tundra .dijitAlignLeft .dijitTab .dijitClosable .closeImage {
top: 7px;
left: 3px;
}
/* SplitContainer */
.tundra .dijitSplitContainerSizerH {
background:url("images/splitContainerSizerH.png") repeat-y #fff;
border:0;
border-left:1px solid #bfbfbf;
border-right:1px solid #bfbfbf;
width:7px;
}
.tundra .dijitSplitContainerSizerH .thumb {
background:url("images/splitContainerSizerH-thumb.png") no-repeat #ccc;
left:1px;
width:3px;
height:19px;
}
.tundra .dijitSplitContainerSizerV {
background:url("images/splitContainerSizerV.png") repeat-x #fff;
border:0;
border-top:1px solid #bfbfbf;
border-bottom:1px solid #bfbfbf;
height:7px;
}
.tundra .dijitSplitContainerSizerV .thumb {
background:url("images/splitContainerSizerV-thumb.png") no-repeat #ccc;
top:1px;
width:19px;
height:3px;
}
/* Dialog */
.tundra .dijitDialog {
background: #eee;
border: 1px solid #999;
-webkit-box-shadow: 0px 5px 10px #adadad;
}
.tundra .dijitDialog .dijitDialogTitle {
border-top: none;
border-left: none;
border-right: none;
}
.tundra .dijitDialog .dijitDialogPaneContent {
background: #ffffff;
border:none;
border-top: 1px solid #ccc; /* #cddde9; /* w/out this, an