/*Rounded Corners*/
/*top-left rounded Corners*/
.jqx-rc-tl
{
    -moz-border-radius-topleft: 3px;
    -webkit-border-top-left-radius: 3px;
    border-top-left-radius: 3px;
}
/*top-right rounded Corners*/
.jqx-rc-tr
{
    -moz-border-radius-topright: 3px;
    -webkit-border-top-right-radius: 3px;
    border-top-right-radius: 3px;
}
/*bottom-left rounded Corners*/
.jqx-rc-bl
{
    -moz-border-radius-bottomleft: 3px;
    -webkit-border-bottom-left-radius: 3px;
    border-bottom-left-radius: 3px;
}
/*bottom-right rounded Corners*/
.jqx-rc-br
{
    -moz-border-radius-bottomright: 3px;
    -webkit-border-bottom-right-radius: 3px;
    border-bottom-right-radius: 3px;
}
/*top rounded Corners*/
.jqx-rc-t
{
    -moz-border-radius-topleft: 3px;
    -webkit-border-top-left-radius: 3px;
    border-top-left-radius: 3px;
    -moz-border-radius-topright: 3px;
    -webkit-border-top-right-radius: 3px;
    border-top-right-radius: 3px;
}
/*bottom rounded Corners*/
.jqx-rc-b
{
    -moz-border-radius-bottomleft: 3px;
    -webkit-border-bottom-left-radius: 3px;
    border-bottom-left-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    -webkit-border-bottom-right-radius: 3px;
    border-bottom-right-radius: 3px;
}
/*right rounded Corners*/
.jqx-rc-r
{
    -moz-border-radius-topright: 3px;
    -webkit-border-top-right-radius: 3px;
    border-top-right-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    -webkit-border-bottom-right-radius: 3px;
    border-bottom-right-radius: 3px;
}
/*left rounded Corners*/
.jqx-rc-l
{
    -moz-border-radius-topleft: 3px;
    -webkit-border-top-left-radius: 3px;
    border-top-left-radius: 3px;
    -moz-border-radius-bottomleft: 3px;
    -webkit-border-bottom-left-radius: 3px;
    border-bottom-left-radius: 3px;
}
/*all rounded Corners*/
.jqx-rc-all
{
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

/*Reset Style*/
.jqx-reset
{
    padding: 0;
    margin: 0;
    border: none;
    background: transparent;
}

/*Disable browser selection*/
.jqx-disableselect
{
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
}

/*jqxProgresBar Style*/
.jqx-progressbar
{
    outline: none;
    border: 1px solid #aaaaaa;
    background: #FFFFFF;
    height: 2em;
    font-size: 1.1em;
}
/*applied to the progressbar's value element*/
.jqx-progressbar-value
{
    outline: none;
    border: 0px solid #AAAAAA;
    height: 100%;
    background: #bbbfc4;
    font-size: 1.1em;
}
/*applied to the progress bar's vertical value element- when the widget's orientation is 'vertical'*/
.jqx-progressbar-value-vertical
{
    outline: none;
    border: 0px solid #AAAAAA;
    height: 100%;
    background: #bbbfc4;
    font-size: 1.1em;
}

/*applied to the progress bar when the widget is in disabled state*/
.jqx-progressbar-disabled
{
    outline: none;
    border: 1px solid #ccc;
    background: #ccc;
    height: 2em;
    font-size: 1.1em;
}

/*jqxMenu Style*/
.jqx-menu
{
    font-family: Verdana,Arial,sans-serif;
    font-style: normal;
    font-size: 14px;
    left: 100%;
    color: #000;
    right: 0;
    float: none;
    margin: 0px;
    visibility: hidden;
    border-style: solid;
    border-width: 1px;
    border-color: #828282;
    height: 100%;
    padding: 0px;
    overflow: hidden;
    text-align: left;
}
.jqx-menu-dropdown-column
{
    float: left;
}
/*applied to the menu when it is horizontal. Sets the menu's background*/
.jqx-menu-horizontal
{
    background-color: #e8e8e8;
    margin: 0px;
    padding: 0px;
    overflow: hidden;
    text-align: center;
}
/*applied to the menu when it is vertical. Sets the menu's background*/
.jqx-menu-vertical
{
    background: #e8e8e8;
    text-align: left;
}
/*applied to the sub menu. Sets the sub menu's background*/
.jqx-menu-dropdown
{
    font-family: Verdana,Arial,sans-serif;
    font-style: normal;
    font-size: 14px;
    left: 100%;
    margin: 0px;
    padding: 0px;
    right: 0;
    overflow: hidden;
    display: none;
    float: none;
    width: 150px;
    background-color: #ffffff;
    border-style: solid;
    border-width: 1px;
    border-color: #828282;
    text-align: left;
    padding: 2px;
}
/*applied to the sub menu's ul elements.*/
.jqx-menu-dropdown ul
{
    left: 100%;
    margin: 0px;
    padding: 0px;
    right: 0;
    overflow: hidden;
    border: none;
}
/*applied to the menu's ul elements.*/
.jqx-menu ul
{
    left: 100%;
    margin: 0px;
    padding: 2px;
    right: 0;
    overflow: hidden;
    background-color: transparent;
    border: none;
}
/*applied to the top level menu items.*/
.jqx-menu-item-top
{
    text-indent: 0;
    list-style: none;
    padding: 4px 8px 4px 8px;
    left: 100%;
    overflow: hidden;
    border: 1px solid transparent;
    color: inherit;
    right: 0;
    margin: 0px 1px 0px 1px;
    font-family: Verdana,Arial,sans-serif;
    cursor: pointer;
    background-color: transparent;
}
/*applied to the sub menu items.*/
.jqx-menu-item
{
    text-indent: 0;
    background-color: #ffffff;
    border: 1px solid #ffffff;
    list-style: none;
    padding: 4px 8px 4px 8px;
    margin: 1px 1px 1px 1px;
    float: none;
    overflow: hidden;
    left: 100%;
    color: inherit;
    right: 0;
    font-size: 14px;
    font-family: Verdana,Arial,sans-serif;
    text-align: left;
    cursor: pointer;
}
/*applied to the menu separator items.*/
.jqx-menu-item-separator
{
    text-indent: 0;
    background-color: #ddd;
    border: none;
    list-style: none;
    height: 1px;
    max-height: 1px;
    padding: 0px;
    margin: 1px 2px 1px 2px;
    float: none;
    overflow: hidden;
    left: 100%;
    color: inherit;
    right: 0;
    font-size: 1px;
    font-family: Verdana,Arial,sans-serif;
}
/*applied to a sub menu item when the mouse is over the item.*/
.jqx-menu-item-hover
{
    background-color: #e8e8e8;
    border: 1px solid #aaaaaa;
    color: inherit;
    right: 0;
    list-style: none;
    margin: 1px 1px 1px 1px;
    left: 100%;
    padding: 4px 8px 4px 8px;
    text-align: left;
    cursor: pointer;
}
/*applied to a top-level menu item when the mouse is over it.*/
.jqx-menu-item-top-hover
{
    background-color: #e8e8e8;
    border: 1px solid #aaaaaa;
    color: inherit;
    right: 0;
    list-style: none;
    margin: 0px 1px 0px 1px;
    left: 100%;
    padding: 4px 8px 4px 8px;
    top: 50%;
    cursor: pointer;
}
/*applied to a sub menu item when its sub menu is opened.*/
.jqx-menu-item-selected
{
    background-color: #d1d1d1;
    border: 1px solid #909090;
    color: #000;
    right: 0;
    list-style: none;
    margin: 1px 1px 1px 1px;
    left: 100%;
    padding: 4px 8px 4px 8px;
    text-align: left;
    cursor: pointer;
}
/*applied to a disabled sub menu item.*/
.jqx-menu-item-disabled
{
    color: #ccc;
    right: 0;
    list-style: none;
    margin: 1px 1px 1px 1px;
    left: 100%;
    padding: 4px 8px 4px 8px;
}
/*applied to a top-level menu item when its sub menu is opened.*/
.jqx-menu-item-top-selected
{
    background-color: #ffffff;
    border: 1px solid #909090;
    color: #000;
    right: 0;
    list-style: none;
    margin: 0px 1px 0px 1px;
    left: 100%;
    padding: 4px 8px 4px 8px;
    cursor: pointer;
}
/*applied to a sub menu item when it has sub menu items. Displays right arrow icon.*/
.jqx-menu-item-arrow-right
{
    padding-right: 0px;
    margin-right: -8px;
    width: 17px;
    height: 17px;
    background-image: url(images/icon-right.png);
    background-position: 100% 50%;
    background-repeat: no-repeat;
}
/*applied to a sub menu item when it has sub menu items. Displays down arrow icon.*/
.jqx-menu-item-arrow-down
{
    padding-right: 0px;
    margin-right: -8px;
    width: 17px;
    height: 17px;
    background-image: url(images/icon-down.png);
    background-position: 100% 50%;
    background-repeat: no-repeat;
}
/*applied to a sub menu item when it has sub menu items. Displays up arrow icon.*/
.jqx-menu-item-arrow-up
{
    padding-right: 0px;
    margin-right: -8px;
    width: 17px;
    height: 17px;
    background-image: url(images/icon-up.png);
    background-position: 100% 50%;
    background-repeat: no-repeat;
}
/*applied to a sub menu item when it has sub menu items. Displays left arrow icon.*/
.jqx-menu-item-arrow-left
{
    padding-right: 0px;
    padding-left: 5px;
    width: 17px;
    height: 17px;
    background-image: url(images/icon-left.png);
    background-position: 0 50%;
    background-repeat: no-repeat;
}
/*applied to a sub menu item when it has sub menu items and its sub menu is opened. Displays right arrow icon.*/
.jqx-menu-item-arrow-right-selected
{
    padding-right: 0px;
    margin-right: -8px;
    width: 17px;
    height: 17px;
    background-image: url(images/icon-right.png);
    background-position: 100% 50%;
    background-repeat: no-repeat;
}
/*applied to a sub menu item when it has sub menu items and its sub menu is opened. Displays down arrow icon.*/
.jqx-menu-item-arrow-down-selected
{
    padding-right: 0px;
    margin-right: -8px;
    width: 17px;
    height: 17px;
    background-image: url(images/icon-down.png);
    background-position: 100% 50%;
    background-repeat: no-repeat;
}
/*applied to a sub menu item when it has sub menu items and its sub menu is opened. Displays up arrow icon.*/
.jqx-menu-item-arrow-up-selected
{
    padding-right: 0px;
    margin-right: -8px;
    width: 17px;
    height: 17px;
    background-image: url(images/icon-up.png);
    background-position: 100% 50%;
    background-repeat: no-repeat;
}
/*applied to a sub menu item when it has sub menu items and its sub menu is opened. Displays left arrow icon.*/
.jqx-menu-item-arrow-left-selected
{
    padding-right: 0px;
    padding-left: 5px;
    width: 17px;
    height: 17px;
    background-image: url(images/icon-left.png);
    background-position: 0 50%;
    background-repeat: no-repeat;
}
/*applied to a top-level menu item when it has sub menu items. Displays right arrow icon.*/
.jqx-menu-item-arrow-top-right
{
    padding-right: 0px;
    margin-right: -8px;
    width: 17px;
    height: 17px;
    background-image: url(images/icon-right.png);
    background-position: 100% 50%;
    background-repeat: no-repeat;
}
/*applied to a top-level menu item when it has sub menu items. Displays left arrow icon.*/
.jqx-menu-item-arrow-top-left
{
    padding-right: 0px;
    padding-left: 5px;
    width: 17px;
    height: 17px;
    background-image: url(images/icon-left.png);
    background-position: 0 50%;
    background-repeat: no-repeat;
}
/*applied to the anchor elements of a sub menu item.*/
.jqx-menu-item a:link, a:visited
{
    border: none;
    background-color: transparent;
    outline: none;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    color: #000;
    text-decoration: none;
}
/*applied to the anchor elements of a sub menu item.*/
.jqx-menu-item a:hover
{
    text-decoration: none;
    color: inherit;
    outline: none;
    background-color: transparent;
}

/*applied to the anchor elements of a top-level menu item.*/
.jqx-menu-item-top a:link
{
    border: none;
    background-color: transparent;
    outline: none;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    color: #000;
    text-decoration: none;
}
/*applied to the anchor elements of a top-level menu item.*/
.jqx-menu-item-top a:visited
{
    border: none;
    background-color: transparent;
    outline: none;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    color: #000;
    text-decoration: none;
}
/*applied to the anchor elements of a top-level menu item.*/
.jqx-menu-item-top a:hover
{
    text-decoration: none;
    color: #000;
    outline: none;
    background-color: transparent;
    border: none;
}
/*applied to the menu widget when it is disabled.*/
.jqx-menu-disabled
{
    color: #aaa;
    cursor: default;
}
/*applied to the anchor elements of all disabled menu items.*/
.jqx-menu-disabled a:link
{
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    cursor: default;
    color: #aaa;
    text-decoration: none;
}
.jqx-menu-disabled a:visited
{
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    cursor: default;
    color: #aaa;
    text-decoration: none;
}
.jqx-menu-disabled a:hover
{
    cursor: default;
}

/*jqxtree Style*/
.jqx-tree
{
    font-family: Verdana,Arial,sans-serif;
    font-style: normal;
    font-size: 14px;
    left: 100%;
    color: #000;
    right: 0;
    float: none;
    margin: 0px;
    border-style: solid;
    border-width: 1px;
    border-color: #e8e8e8;
    padding: 0px;
    background: #ffffff;
    overflow: hidden;
    text-align: left;
    outline: none;
    white-space: nowrap;
}
/*applied to the jqxTree root UL element.*/
.jqx-tree-dropdown-root
{
    font-family: Verdana,Arial,sans-serif;
    font-style: normal;
    left: 100%;
    margin: 5px 0px 5px 0px;
    padding: 0px 0px 0px 10px;
    right: 0;
    overflow: hidden;
    display: block;
    float: none;
    width: 100%;
    background-color: transparent;
    border-style: solid;
    border-width: 0px;
    border-color: #fff;
    text-align: left;
    outline: none;
}
/*applied to the jqxTree UL elements.*/
.jqx-tree-dropdown
{
    font-family: Verdana,Arial,sans-serif;
    font-style: normal;
    left: 100%;
    margin: 5px 0px -5px 0px;
    padding: 0px 0px 0px 10px;
    right: 0;
    overflow: hidden;
    display: block;
    float: none;
    width: 100%;
    background-color: transparent;
    border-style: solid;
    border-width: 0px;
    border-color: #fff;
    text-align: left;
    outline: none;
}
/*applied to the jqxTree LI elements.*/
.jqx-tree-item-li
{
    text-indent: 0;
    background-color: transparent;
    border: 1px solid transparent;
    list-style: none;
    left: 100%;
    color: #000;
    right: 0;
    font-family: Verdana,Arial,sans-serif;
    text-align: left;
    outline: none;
    margin: 0px;
    padding: 4px;
}
/*applied to the last LI elements in an UL element.*/
.jqx-tree-item-u-last
{
    margin: 5px 0px 5px 0px;
}
/*applied to a tree item.*/
.jqx-tree-item
{
    text-indent: 0;
    background-color: transparent;
    border: 1px solid transparent;
    list-style: none;
    padding: 3px;
    margin: 0px;
    float: none;
    overflow: hidden;
    left: 100%;
    color: #000;
    right: 0;
    font-size: 14px;
    font-family: Verdana,Arial,sans-serif;
    text-align: left;
    cursor: default;
    text-decoration: none;
}
/*applied to the anchor element of a tree item.*/
.jqx-tree-item a:link
{
    text-indent: 0;
    background-color: transparent;
    border: 0px solid transparent;
    list-style: none;
    padding: 0px;
    margin: 0px;
    float: none;
    overflow: hidden;
    left: 100%;
    color: inherit;
    right: 0;
    font-size: 14px;
    font-family: Verdana,Arial,sans-serif;
    text-align: left;
    cursor: pointer;
    text-decoration: none;
    outline: none;
}
.jqx-tree-item a:visited
{
    background-color: transparent;
}

.jqx-tree-item a:hover
{
    background-color: transparent;
}
/*applied to a tree item when the mouse is over the item.*/
.jqx-tree-item-hover
{
    background-color: #e8e8e8;
    border: 1px solid #aaaaaa;
    color: inherit;
    right: 0;
    padding: 3px;
    margin: 0px;
    list-style: none;
    left: 100%;
    text-align: left;
    cursor: pointer;
    text-decoration: none;
}
/*applied to a tree item when the item is selected.*/
.jqx-tree-item-selected
{
    background-color: #d1d1d1;
    border: 1px solid #909090;
    color: inherit;
    right: 0;
    padding: 3px;
    margin: 0px;
    list-style: none;
    left: 100%;
    text-align: left;
    cursor: pointer;
    text-decoration: none;
}
/*applied to a tree item when the item is disabled.*/
.jqx-tree-item-disabled
{
    color: #ccc;
    right: 0;
    list-style: none;
    margin: 0px;
    left: 100%;
    padding: 3px;
    cursor: default;
}
/*applied to a tree item when it has sub items and is collapsed. Displays an arrow icon next to the item.*/
.jqx-tree-item-arrow-collapse
{
    padding-right: 0px;
    width: 17px;
    height: 17px;
    background-image: url(images/icon-right.png);
    background-position: 100% 50%;
    background-repeat: no-repeat;
    cursor: pointer;
}
/*applied to a tree item when it has sub items and is expanded. Displays an arrow icon next to the item.*/
.jqx-tree-item-arrow-expand
{
    padding-right: 0px;
    width: 17px;
    height: 17px;
    background-image: url(images/icon-down.png);
    background-position: 100% 50%;
    background-repeat: no-repeat;
    cursor: pointer;
}
/*applied to a tree item when it has sub items and is expanded and the mouse is over the arrow icon.*/
.jqx-tree-item-arrow-expand-hover
{
    padding-right: 0px;
    margin-right: 0px;
    width: 17px;
    height: 17px;
    background-image: url(images/icon-down.png);
    background-position: 100% 50%;
    background-repeat: no-repeat;
    cursor: pointer;
}
/*applied to a tree item when it has sub items and is collapsed and the mouse is over the arrow icon.*/
.jqx-tree-item-arrow-collapse-hover
{
    padding-right: 0px;
    width: 17px;
    height: 17px;
    background-image: url(images/icon-right.png);
    background-position: 100% 50%;
    background-repeat: no-repeat;
    cursor: pointer;
}
/*applied to the tree when it is disabled.*/
.jqx-tree-disabled
{
    color: #aaa;
    cursor: default;
}
/*applied to the anchor elements in a tree when it is disabled.*/
.jqx-tree-disabled a:link
{
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    cursor: default;
    color: #aaa;
    text-decoration: none;
}
.jqx-tree-disabled a:visited
{
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    cursor: default;
    color: #aaa;
    text-decoration: none;
}
.jqx-tree-disabled a:hover
{
    cursor: default;
}


/*jqxTabs*/
.jqx-tabs
{
    outline: none;
    margin: 0 0 0 0;
    padding: 0px;
    overflow: hidden;
    background: transparent;
    border: 1px solid #aaaaaa;
}
/*applied to the tab close button.*/
.jqx-tabs-close-button
{
    outline: none;
    background-image: url(images/close.png);
    cursor: pointer;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}
/*applied to the tab close button when the tab is selected.*/
.jqx-tabs-close-button-selected
{
    outline: none;
    background-image: url(images/close.png);
    cursor: pointer;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}
/*applied to the tab close button when the mouse is over the tab.*/
.jqx-tabs-close-button-hover
{
    outline: none;
    background-image: url(images/close.png);
    cursor: pointer;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}
/*applied to the tab's left scroll arrow.*/
.jqx-tabs-arrow-left
{
    outline: none;
    position: relative;
    z-index: 15;
    float: left;
    cursor: pointer;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    background-image: url('images/icon-left.png');
    background-repeat: no-repeat;
    background-position: center;
}
/*applied to the tab's right scroll arrow.*/
.jqx-tabs-arrow-right
{
    outline: none;
    position: relative;
    z-index: 15;
    background-image: url('images/icon-right.png');
    background-repeat: no-repeat;
    background-position: center;
    float: left;
    cursor: pointer;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}
.jqx-tabs-arrow-background
{
    background: #eeeeee;
}
/*applied to the tab's title.*/
.jqx-tabs-title
{
    color: #000;
    outline: none;
    display: block;
    cursor: pointer;
    white-space: nowrap;
    left: 100%;
    right: 0;
    text-indent: 0px;
    list-style: none;
    border: 1px solid transparent;
    margin: 0px 2px 0px 0px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    font-size: 13px;
    overflow: hidden;
    z-index: 1;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 5px;
    padding-top: 5px;
    background: transparent;
    height: auto;
    position: relative;
}
.jqx-tabs-title-bottom
{
}
.jqx-tabs-title a:link
{
    color: inherit;
    text-decoration: none;
}
.jqx-tabs-title a:hover
{
    color: inherit;
    text-decoration: none;
}
.jqx-tabs-title a:active
{
    color: inherit;
    text-decoration: none;
}
.jqx-tabs-title a:visited
{
    color: inherit;
    text-decoration: none;
}
/*applied to the tab's title when the tab is selected and the jqxTab's position property is set to 'top' .*/
.jqx-tabs-title-selected-top
{
    z-index: 999999;
    outline: none;
    border-top: 1px solid #aaa;
    border-left: 1px solid #aaa;
    border-right: 1px solid #aaa;
    border-bottom: 1px solid #fff;
    background-color: #fff;
    padding-bottom: 7px;
}
/*applied to the tab's title when the tab is selected and the jqxTab's position property is set to 'bottom' .*/
.jqx-tabs-title-selected-bottom
{
    outline: none;
    border-top: 1px solid #fff;
    border-left: 1px solid #aaa;
    border-right: 1px solid #aaa;
    border-bottom: 1px solid #aaa;
    padding-top: 7px;
    padding-bottom: 5px;
    margin-top: -2px;
    background-color: #fff;
}
/*applied to the tab's title when the tab is hovered and the jqxTab's position property is set to 'top' .*/
.jqx-tabs-title-hover-top
{
    outline: none;
    border-top: 1px solid #aaa;
    border-left: 1px solid #aaa;
    border-right: 1px solid #aaa;
    border-bottom: 1px solid #aaa;
    background-color: #e8e8e8;
    padding-bottom: 5px;
}
/*applied to the tab's title when the tab is hovered and the jqxTab's position property is set to 'bottom' .*/
.jqx-tabs-title-hover-bottom
{
    outline: none;
    border-top: 1px solid #aaa;
    border-left: 1px solid #aaa;
    border-right: 1px solid #aaa;
    border-bottom: 1px solid #aaa;
    background-color: #e8e8e8;
    padding-top: 5px;
}
/*applied to the tab's title when the tab is disabled.*/
.jqx-tabs-title-disable
{
    outline: none;
    color: #999;
}
/*applied to the tab's header.*/
.jqx-tabs-header
{
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 3px;
    padding-bottom: 1px;
    margin: 0px;
    border-top: 1px solid transparent;
    border-left: 0px solid transparent;
    border-right: 0px solid transparent;
    border-bottom: 1px solid #aaa;
    background: #eeeeee;
}
/*applied to the tab's header when the position is bottom.*/
.jqx-tabs-header-bottom
{
    padding-top: 1px;
    padding-bottom: 3px;
    border-top: 1px solid #aaa;
    border-left: 0px solid transparent;
    border-right: 0px solid transparent;
    border-bottom: 1px solid transparent;
}
/*applied to the tab's header when the tab is collapsed.*/
.jqx-tabs-header-collapsed
{
    border: 1px solid #aaa;
}
/*applied to the tab's header when the position is bottom and tab is collapsed.*/
.jqx-tabs-header-collapsed-bottom
{
    border: 1px solid #aaa;
}
.jqx-tabs-collapsed
{
    border: 1px solid transparent;
}
.jqx-tabs-collapsed-bottom
{
    border: 1px solid transparent;
}
/*applied to the tab's selection tracker container element.*/
.jqx-tabs-selection-tracker-container
{
    outline: none;
    position: relative;
    text-indent: 0px;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    width: 100%;
    background: transparent;
    height: 2px;
}
/*applied to the tab's selection tracker when the jqxTab's position property is set to 'top'.*/
.jqx-tabs-selection-tracker-top
{
    border-top: 1px solid #aaa;
    border-left: 1px solid #aaa;
    border-right: 1px solid #aaa;
    border-bottom: 1px solid #fff;
    padding-bottom: 2px;
    background-color: #fff;
    outline: none;
    position: absolute;
    z-index: 10;
}
/*applied to the tab's selection tracker when the jqxTab's position property is set to 'bottom'.*/
.jqx-tabs-selection-tracker-bottom
{
    border-top: 1px solid #fff;
    border-left: 1px solid #aaa;
    border-right: 1px solid #aaa;
    border-bottom: 1px solid #aaa;
    background-color: #fff;
    outline: none;
    position: absolute;
    z-index: 10;
    margin-top: -1px;
    padding-bottom: 2px;
}
/*applied to the tab's content element which represents a DIV element.*/
.jqx-tabs-content
{
    outline: none;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    border-bottom: 1px solid transparent;
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
    border-top: 1px solid transparent;
    font-size: 13px;
    z-index: 0;
    text-align: left;
    background-color: #fff;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}

/*jqxCheckBox*/
.jqx-checkbox
{
    text-align: left;
    border: none;
    outline: none;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    margin: 0 0 0 0;
}
/*applied to the check box.*/
.jqx-checkbox-default
{
    text-align: left;
    cursor: pointer;
    float: left;
    background-color: #e8e8e8;
    padding: 0px;
    border: 1px solid #c9c9c9;
    outline: none;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    padding: 0px;
    margin: 0px 3px 0px 3px;
}
/*applied to the check box when the mouse cursor is over it.*/
.jqx-checkbox-hover
{
    cursor: pointer;
    float: left;
    background-color: #e8e8e8;
    padding: 0px;
    border: 1px solid #000;
    outline: none;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    margin: 0px 3px 0px 3px;
}
/*applied to the widget when it is disabled.*/
.jqx-checkbox-disabled
{
    cursor: default;
    color: #aaa;
    background: transparent;
    padding: 0px;
    border: none;
    outline: none;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    margin: 0px 0px 0px 0px;
}
/*applied to the check box when the widget is disabled.*/
.jqx-checkbox-disabled-box
{
    float: left;
    background-color: #e8e8e8;
    padding: 0px;
    border: 1px solid #aaa;
    outline: none;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    margin: 0px 3px 0px 3px;
}
/*applied to the check box when it is checked. Displays a check icon.*/
.jqx-checkbox-check-checked
{
    float: left;
    background: transparent url(images/check_black.png) left top no-repeat;
    padding: 0px;
    border: none;
    outline: none;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    margin: 0 0 0 0;
}
/*applied to the check box when the widget is disabled. Displays a disabled check icon.*/
.jqx-checkbox-check-disabled
{
    float: left;
    background: transparent url(images/check_disabled.png) left top no-repeat;
    padding: 0px;
    border: none;
    outline: none;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    margin: 0 0 0 0;
}
/*applied to the check box when its state is indeterminate.*/
.jqx-checkbox-check-indeterminate
{
    float: left;
    background: transparent url(images/check_indeterminate_black.png) left top no-repeat;
    padding: 0px;
    border: none;
    outline: none;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    margin: 0 0 0 0;
}
/*applied to the check box when its state is indeterminate and it is disabled.*/
.jqx-checkbox-check-indeterminate-disabled
{
    float: left;
    background: transparent url(images/check_indeterminate_disabled.png) left top no-repeat;
    padding: 0px;
    border: none;
    outline: none;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    margin: 0 0 0 0;
}

/*jqxRadioButton*/
.jqx-radiobutton
{
    border: none;
    outline: none;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    margin: 0 0 0 0;
}
/*applied to the radio button.*/
.jqx-radiobutton-default
{
    cursor: pointer;
    float: left;
    background: transparent url(images/roundbg_classic_normal.png) left center scroll repeat-x;
    padding: 0px;
    border: 0px solid #c9c9c9;
    outline: none;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    padding: 0px;
    margin: 1px 3px 0px 3px;
}
/*applied to the radio button when the mouse is over it.*/
.jqx-radiobutton-hover
{
    cursor: pointer;
    float: left;
    background: transparent url(images/roundbg_classic_hover.png) left center scroll repeat-x;
    padding: 0px;
    border: 0px solid #000;
    outline: none;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    margin: 1px 3px 0px 3px;
}
/*applied to the radio button when it is disabled.*/
.jqx-radiobutton-disabled
{
    cursor: default;
    color: #aaa;
    background: transparent;
    padding: 0px;
    border: none;
    outline: none;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    margin: 1px 0px 0px 0px;
}
/*applied to the radio button's radio icon when it is disabled.*/
.jqx-radiobutton-disabled-box
{
    float: left;
    background: transparent url(images/roundbg_disabled.png) left top scroll no-repeat;
    padding: 0px;
    border: 0px solid #aaa;
    outline: none;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    margin: 0px 3px 0px 3px;
}
/*applied to the radio button when it is checked.*/
.jqx-radiobutton-check-checked
{
    float: left;
    background: transparent url(images/roundbg_check_black.png) left top no-repeat;
    padding: 0px;
    border: none;
    outline: none;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    margin: 0 0 0 0;
}
/*applied to the radio button when it is checked and disabled.*/
.jqx-radiobutton-check-disabled
{
    float: left;
    background: transparent url(images/roundbg_check_disabled.png) left top no-repeat;
    padding: 0px;
    border: none;
    outline: none;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    margin: 0 0 0 0;
}
/*applied to the radio button when it is in indeterminate state.*/
.jqx-radiobutton-check-indeterminate
{
    float: left;
    background: transparent url(images/roundbg_check_indeterminate.png) left top no-repeat;
    padding: 0px;
    border: none;
    outline: none;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    margin: 0 0 0 0;
}
/*applied to the radio button when it is in indeterminate state and disabled.*/
.jqx-radiobutton-check-indeterminate-disabled
{
    float: left;
    background: transparent url(images/roundbg_check_disabled.png) left top no-repeat;
    padding: 0px;
    border: none;
    outline: none;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    margin: 0 0 0 0;
}

/*jqxRating*/
.jqx-rating
{
    margin: 0px;
    padding: 0px;
    outline: none;
    overflow: hidden;
}
.jqx-rating-image
{
    border-width: 0px;
}
.jqx-rating-image-default
{
    background-color: transparent;
    padding: 0px;
    background-repeat: no-repeat;
    cursor: pointer;
    background-image: url(images/star.png);
    overflow: hidden;
}
/*applied to the rating when it is hovered.*/
.jqx-rating-image-hover
{
    background-color: transparent;
    padding: 0px;
    background-repeat: no-repeat;
    cursor: pointer;
    background-image: url(images/star_hover.png);
    overflow: hidden;
}
/*applied to the rating when it is disabled.*/
.jqx-rating-image-backward
{
    background-color: transparent;
    padding: 0px;
    background-repeat: no-repeat;
    cursor: pointer;
    background-image: url(images/star_disabled.png);
    overflow: hidden;
}

/*jqxMaskedInput and jqxNumberInput Styles*/
.jqx-input
{
    -webkit-appearance: none;
    padding: 0 0 0 0;
    outline: none;
    background: #FFFFFF;
    border: 1px solid #aaaaaa;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    font-size: 13px;
}
/*applied to the input when the validation fails.*/
.jqx-input-invalid
{
    outline: none;
    background: transparent;
    border: 1px solid #FF0000;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    font-size: 13px;
}
/*applied to the input's content.*/
.jqx-input-content
{
    -webkit-appearance: none;
    padding: 1 1 1 1;
    resize: none;
    outline: none;
    outline-width: 0px;
    background: transparent;
    border: none;
    font-size: 13px;
}
/*applied to the input when it is disabled.*/
.jqx-input-disabled
{
    -webkit-appearance: none;
    padding: 1 1 1 1;
    resize: none;
    outline: none;
    outline-width: 0px;
    color: #aaa;
    border: none;
    font-size: 13px;
}
/*applied to the jqxDateTimeInput's button header.*/
.jqx-input-button-header
{
    cursor: pointer;
    -webkit-appearance: none;
    height: 3px;
    padding: 0px;
    outline: none;
    background: #808080;
    border: 1px solid #aaaaaa;
}
/*applied to the element which is in the middle of the jqxDateTimeInput's button header.*/
.jqx-input-button-innerHeader
{
    cursor: pointer;
    -webkit-appearance: none;
    height: 3px;
    width: 3px;
    padding: 0px;
    outline: none;
    background: #fff;
    border: 0px solid #fff;
}
/*applied to the jqxDateTimeInput's button content.*/
.jqx-input-button-content
{
    text-align: center;
    color: #000;
    vertical-align: middle;
    cursor: pointer;
    font-size: 8px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    -webkit-appearance: none;
    padding: 0px;
    outline: none;
    border-top: 0px solid #404040;
    border-left: 1px solid #aaaaaa;
    border-bottom: 1px solid #aaaaaa;
    border-right: 1px solid #aaaaaa;
    background: #FFFFFF;
}

/*jqxTooltip Style*/
.jqx-tooltip-content
{
    font-family: Verdana,Arial,sans-serif;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    margin: 0px;
    border-radius: 0px;
    padding: 3px 6px 3px 6px;
    border: 0px solid #aaaaaa;
    border-collapse: collapse;
    text-align: center;
    font-weight: normal;
    color: #000000;
    background: #f2f2f2;
    font-size: 13px;
    border-spacing: 0px;
}
/*applied to the tooltip's header.*/
.jqx-tooltip-header
{
    font-family: Verdana,Arial,sans-serif;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
    padding: 3px 6px 3px 6px;
    border: 0px solid #aaaaaa;
    border-collapse: collapse;
    background: #e8e8e8;
    color: #000000;
    font-weight: bold;
    font-size: 13px;
    border-spacing: 0px;
}
/*applied to the tooltip's content when the validation fails. For example: jqxNumberInput's value validation.*/
.jqx-tooltip-content-invalid
{
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
    padding: 3px 6px 3px 6px;
    border: 0px solid #aaaaaa;
    border-collapse: collapse;
    text-align: center;
    font-weight: normal;
    color: #FFFFFF;
    background-color: #FF0000;
    font-size: 13px;  
    border-spacing: 0px;
}
/*applied to the tooltip's header when the validation fails. For example: jqxNumberInput's value validation.*/
.jqx-tooltip-header-invalid
{
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
    padding: 3px 6px 3px 6px;
    border: 0px solid #aaaaaa;
    border-collapse: collapse;
    background-color: #FF0000;
    color: #FFFFFF;
    font-weight: bold;
    font-size: 13px;
    border-spacing: 0px;
}
/*applied to the tooltip's table. The tooltip contains a table with 2 rows - header and content. This class is applied to the table element.*/
.jqx-tooltip-table
{
    padding: 0px;
    margin: 0px;
    background: #f2f2f2;
    border: 1px solid #aaaaaa;
    border-spacing: 0px;
}

/*jqxCalendar Style*/
.jqx-calendar
{
    -webkit-appearance: none;
    color: #000;
    overflow: hidden;
    outline: none;
    background: #ffffff;
    border: 1px solid #aaaaaa;
    padding: 0px;
    margin: 0 0 0 0;
    cursor: default;
}
/*applied to the calendar's row header. This header displays the week numbers.*/
.jqx-calendar-row-header
{
    outline: none;
    background-color: #f2f2f2;
    border: 0px solid #f2f2f2;
    padding: 0;
    margin: 0 0 0 0;
    cursor: default;
}
/*applied to the calendar's column. This header displays the day names.*/
.jqx-calendar-column-header
{
    outline: none;
    text-align: right;
    background-color: #FFFFFF;
    padding: 3;
    border-top: 1px solid #FFFFFF;
    border-bottom: 1px solid #e9e9e9;
    margin: 0 0 0 0;
    cursor: default;
}
/*applied to the calendar's top-left header. This header is displayed before the day names and above the week numbers.*/
.jqx-calendar-top-left-header
{
    outline: none;
    background: #f2f2f2;
    border: 0px solid #f2f2f2;
    margin: 0 0 0 0;
    cursor: default;
}
/*applied to the calendar's navigation buttons.*/
.jqx-calendar-title-navigation
{
    color: #000;
    margin: 0 0 0 0;
    cursor: pointer;
}
/*applied to the calendar's navigation title.*/
.jqx-calendar-title-header
{
    color: #000;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    border-bottom: 1px solid #c9c9c9;
    margin: 0 0 0 0;
    background-color: #e8e8e8;
}
/*applied to the calendar's navigation title when the calendar is disabled.*/
.jqx-calendar-title-header-disabled
{
    color: #ccc;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    border-bottom: 1px solid #c9c9c9;
    margin: 0 0 0 0;
    background-color: #ccc;
}
/*applied to a calendar cell.*/
.jqx-calendar-cell
{
    color: #000;
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    background: transparent;
    margin: 0px;
    outline: none;
    text-align: center;
    padding: 1px;
    border: 1px solid #FFFFFF;
    cursor: pointer;
}
/*applied to a calendar cell when the cell is hidden. A cell can be hidden when the showOtherMonthDays property is false and the calendar hides the cells with dates from the other months*/
.jqx-calendar-cell-hidden
{
    margin: 0 0 0 0;
    display: none;
    cursor: default;
}
/*applied to a calendar cell when the cell's date is a weekend date.*/
.jqx-calendar-cell-weekend
{
    color: #898989;
    margin: 0 0 0 0;
    cursor: pointer;
}
/*applied to a calendar cell when the cell's date is a special date(holiday, vacation, birthay. See the SpecialDates demo).*/
.jqx-calendar-cell-specialDate
{
    color: #FF0000;
    background-color: transparent;
    border: 1px solid #FFFFFF;
    margin: 0 0 0 0;
    cursor: pointer;
}
/*applied to a calendar cell when the cell's date is the today date.*/
.jqx-calendar-cell-today
{
    color: #898989;
    background-color: #ffffdb;
    border: 1px solid #fdc066;
    margin: 0 0 0 0;
    cursor: pointer;
}
/*applied to a calendar cell when the cell is hovered.*/
.jqx-calendar-cell-hover
{
    color: #000000;
    background-color: #e8e8e8;
    border: 1px solid #aaaaaa;
    margin: 0 0 0 0;
    cursor: pointer;
}
/*applied to a calendar cell when the cell is selected.*/
.jqx-calendar-cell-selected
{
    color: #000000;
    background-color: #d1d1d1;
    border: 1px solid #909090;
    margin: 0 0 0 0;
    cursor: pointer;
}
/*applied to a calendar cell when the cell's date represents a date from the previous or next month.*/
.jqx-calendar-cell-othermonth
{
    color: #898989;
    margin: 0 0 0 0;
    cursor: pointer;
}
/*applied to a calendar cell when the calendar is disabled.*/
.jqx-calendar-cell-disabled
{
    overflow: hidden;
    outline: none;
    color: #ccc;
    cursor: default;
}
/*applied to a calendar cell when the cell is from the row header that displays the week numbers.*/
.jqx-calendar-row-cell
{
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    outline: none;
    text-align: center;
    color: #777777;
    border: 1px solid #f2f2f2;
    margin: 0 0 0 0;
    cursor: default;
}
/*applied to a calendar cell when the cell is from the row header that displays the week numbers and the calendar is disabled.*/
.jqx-calendar-row-cell-disabled
{
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    outline: none;
    text-align: center;
    color: #ccc;
    border: 1px solid #f2f2f2;
    margin: 0 0 0 0;
    cursor: default;
}
/*applied to a calendar cell when the cell is from the column header that displays the day names.*/
.jqx-calendar-column-cell
{
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    overflow: hidden;
    text-align: center;
    outline: none;
    font-weight: normal;
    padding: 1px;
    color: #000000;
    border: 1px solid #FFFFFF;
    margin: 0 0 0 0;
    cursor: default;
}
/*applied to a calendar cell when the cell is from the column header that displays the day names and the calendar is disabled.*/
.jqx-calendar-column-cell-disabled
{
    font-size: 13px;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    overflow: hidden;
    text-align: center;
    outline: none;
    font-weight: normal;
    padding: 1px;
    color: #ccc;
    border: 1px solid #FFFFFF;
    margin: 0 0 0 0;
    cursor: default;
}
/*applied to the calendar's cell area element.*/
.jqx-calendar-view
{
    -webkit-appearance: none;
    outline: none;
    background: #FFFFFF;
    padding: 0px;
    border: 0px solid #FFFFFF;
    margin: 0 0 0 0;
    cursor: default;
}

/*jqxExpander and jqxNavigationBar Style*/
.jqx-expander
{
    overflow: hidden;
}
/*applied to the expander's header.*/
.jqx-expander-header
{
    color: #000;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    font-size: 13px;
    overflow: hidden;
    z-index: 1;
    padding: 5px;
    cursor: pointer;
    margin: 0 0 0 0;
    background-color: #e8e8e8;
    height: auto;
}
/*applied to the expander's header when the toggle mode is none.*/
.jqx-expander-header-toggle-none
{
    cursor: default;
}
/*applied to the expander's content area which is below the header.*/
.jqx-expander-content
{
    margin: 0;
    padding: 0;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    border-left: 1px solid #aaaaaa;
    border-right: 1px solid #aaaaaa;
    font-size: 13px;
    z-index: 0;
    overflow: hidden;
    text-align: left;
    color: #000;
    background-color: #fdfdfd;
    vertical-align: middle;
}
/*applied to the content of the expander's header area.*/
.jqx-expander-header-content
{
    color: #000;
    background-color: transparent;
    text-align: left;
    float: left;
    vertical-align: middle;
}
/*applied to the expander's header when the header is disabled.*/
.jqx-expander-header-disabled
{
    margin: 0 0 0 0;
    background-color: #cccccc;
}
/*applied to the expander's content when the expander is disabled.*/
.jqx-expander-content-disabled
{
    background-color: #f1f1f1;
}
/*applied to the expander when it is disabled.*/
.jqx-expander-disabled
{
    border: 0px solid #aaaaaa;
}
/*applied to the expander's header when the header is positioned at the bottom.*/
.jqx-expander-header-bottom
{
    border: 1px solid #aaaaaa;
}
/*applied to the expander's content when it is positioned below the header. This is the position by default.*/
.jqx-expander-content-top
{
    border-top: 1px solid #aaaaaa;
    border-bottom: 0px solid #aaaaaa;
}
/*applied to the expander's header when it is positioned above the content. This is the position by default.*/
.jqx-expander-header-top
{
    border: 1px solid #aaaaaa;
}
/*applied to the expander's content when it is positioned above the header.*/
.jqx-expander-content-bottom
{
    border-bottom: 1px solid #aaaaaa;
    border-top: 0px;
}
/*applied to the expander's expand/collapse button.*/
.jqx-expander-arrow
{
    margin: 0px;
    padding: 0px;
    border: none;
    background-color: transparent;
    outline: none;
    background-repeat: no-repeat;
    background-position: center;
    vertical-align: middle;
}
/*applied to the expander's expand/collapse button depending on the arrow position property.*/
.jqx-expander-arrow-align-left
{
    float: left;
    padding-left: 5px;
}
/*applied to the expander's expand/collapse button depending on the arrow position property. This is the setting by default. The arrow is positioned at right.*/
.jqx-expander-arrow-align-right
{
    float: right;
    padding-right: 5px;
}
/*applied to the expander's expand/collapse button and displays arrow icon.*/
.jqx-expander-arrow-top
{
    background-image: url(images/icon-down.png);
}
/*applied to the expander's expand/collapse button and displays arrow icon.*/
.jqx-expander-arrow-bottom
{
    background-image: url(images/icon-up.png);
}
/*applied to the expander's header when the expander is expanded.*/
.jqx-expander-header-expanded
{
    background-color: #d1d1d1;
    cursor: pointer;
    border: 1px solid #909090;
}
/*applied to the expander's content when the expander is expanded.*/
.jqx-expander-content-expanded
{
}
/*applied to the expander's header when the mouse is over the header.*/
.jqx-expander-header-hover
{
    background-color: #e8e8e8;
    border-color: #909090;
}
/*applied to the jqxNavigationBar. The NavigationBar uses internally the Expander and so it inherits all header and content style settings from the Expander.*/
.jqx-navigationbar
{
    border-top: 1px solid #aaaaaa;
    margin: 0px;
    padding-bottom: 1px;
    font-size: 13px;
    font-family: Verdana;
    -webkit-appearance: none;
    outline: none;
    overflow: hidden;
}

/*jqxPopup Style*/
.jqx-popup-table
{
    padding: 0px;
    border: 1px solid #88888C;
    background: #FFFFFF;
    border-spacing: 0px;
}
.jqx-popup-content
{
    border: 1px solid #88888C;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    background-color: #FFFFFF;
    border-radius: 3px;
    padding: 3px 6px 3px 6px;
    border-collapse: collapse;
    text-align: center;
    font-weight: normal;
    color: #000000;
    font-size: 1em;
    border-spacing: 0px;
    background: #FFC5C5C5; /* for non-css3 browsers */
    filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFC5C5C5')"; /* for IE */
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFFFFFFF, endColorstr=#FFC5C5C5)";
    background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#C5C)); /* for webkit browsers */
    background: -moz-linear-gradient(top,  #FFFFFF,  #C5C5C5); /* for firefox 3.6+ */
}

/*jqxPanel Style*/
.jqx-panel
{
    -webkit-appearance: none;
    outline: none;
    background-color: #ffffff;
    border: 1px solid #aaaaaa;
    padding: 0px;
    margin: 0px;
    cursor: default;
}
/*applied to the Panel's element displayed when the horizontal and vertical scrollbars are visible and the element is positioned below the vertical scrollbar and on the right
of the horizontal scrollbar.*/
.jqx-panel-bottomright
{
    background: #e8e8e8;
}

/*jqxListBox Style*/
.jqx-listbox
{
    -webkit-appearance: none;
    outline: none;
    background-color: #ffffff;
    border: 1px solid #aaaaaa;
    padding: 0px;
    margin: 0px;
    cursor: default;
}
/*applied to the ListBox's element displayed when the horizontal and vertical scrollbars are visible and the element is positioned below the vertical scrollbar and on the right
of the horizontal scrollbar.*/
.jqx-listbox-bottomright
{
    background: #e8e8e8;
}
/*applied to the ListBox's groups.*/
.jqx-listitem-state-group
{
    white-space: nowrap;
    padding: 2px;
    margin: 1px;
    border: 1px solid #ffffff;
    background: #ffffff;
    font-family: Verdana,Arial,sans-serif;
    font-weight: bold;
    font-size: 15px;
    text-align: left;
    outline: none;
}
/*applied to a list item in default state.*/
.jqx-listitem-state-normal
{
    white-space: nowrap;
    padding: 3px;
    margin: 1px;
    border: 1px solid #ffffff;
    background: #ffffff;
    font-family: Verdana,Arial,sans-serif;
    font-style: normal;
    font-size: 13px;
    outline: none;
    visibility: inherit;
    display: inherit;
    text-align: left;
    overflow: hidden;
    position: absolute;
    left: 0;
    color: #000;
    top: 0;
}
/*applied to a list item in hovered state.*/
.jqx-listitem-state-hover
{
    white-space: nowrap;
    background: #e8e8e8;
    padding: 3px 3px 2px 3px;
    margin: 1px;
    border: 1px solid #aaaaaa;
}
/*applied to a list item when the item is selected.*/
.jqx-listitem-state-selected
{
    white-space: nowrap;
    background: #d1d1d1;
    padding: 3px 3px 2px 3px;
    margin: 1px;
    border: 1px solid #909090;
}
/*applied to a list item when the item is disabled or the ListBox is disabled.*/
.jqx-listitem-state-disabled
{
    white-space: nowrap;
    padding: 3px;
    margin: 1px;
    border: 1px solid #fff;
    background: #fff;
    color: #AAA;
}

/*jqxComboBox Style*/
/*applied to the jqxComboBox's content which displays the text.*/
.jqx-combobox-content
{
    color: #000000;
    padding: 0px;
    overflow: hidden;
    padding-left: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-right: 0px;
    margin: 0px;
    text-align: left;
    vertical-align: middle;
    font-family: Verdana,Arial,sans-serif;
    font-style: normal;
    font-size: 13px;
    white-space: nowrap;
    -webkit-appearance: none;
    outline: none;
    border: none;
    background: #fff;
    -moz-border-radius-topleft: 3px;
    -webkit-border-top-left-radius: 3px;
    border-top-left-radius: 3px;
    -moz-border-radius-bottomleft: 3px;
    -webkit-border-bottom-left-radius: 3px;
    border-bottom-left-radius: 3px;
}
/*applied to the ComboBox's input field.*/
.jqx-combobox-input
{
    -webkit-appearance: none;
    -webkit-border-radius: 0px;
    padding: 0 0 0 0;
    outline: none;
    background: #FFFFFF;
    border: 0px solid #aaaaaa;
    font-family: Verdana,Arial,sans-serif /*{ffDefault}*/;
    font-size: 13px;
}
/*applied to the ComboBox's content when the widget is disabled.*/
.jqx-combobox-content-disabled
{
    color: #AAA;
}
/*applied to the ComboBox's arrow button.*/
.jqx-combobox-arrow-normal
{
    -webkit-appearance: none;
    outline: none;
    border-left: 1px solid #aaaaaa;
    overflow: hidden;
    margin: 0 0 0 0;
}
/*applied to the ComboBox's arrow button when the mouse is over the button.*/
.jqx-combobox-arrow-hover
{
    -webkit-appearance: none;
    outline: none;
    border-left: 1px solid #909090;
    overflow: hidden;
    margin: 0 0 0 0;
}
/*applied to the ComboBox's arrow button when the ComboBox's popup is opened.*/
.jqx-combobox-arrow-selected
{
    -webkit-appearance: none;
    outline: none;
    border-left: 1px solid #909090;
    overflow: hidden;
    margin: 0 0 0 0;
}
/*applied to the ComboBox in normal state.*/
.jqx-combobox-state-normal
{
    -webkit-appearance: none;
    outline: none;
    border: 1px solid #aaaaaa;
    overflow: hidden;
    margin: 0 0 0 0;
    background-color: #e8e8e8;
}
/*applied to the ComboBox when the mouse is over the widget.*/
.jqx-combobox-state-hover
{
    color: #000000;
    overflow: hidden;
    background-color: #e8e8e8;
    border: 1px solid #909090;
    margin: 0 0 0 0;
    cursor: pointer;
}
/*applied to the ComboBox when the popup ListBox is shown.*/
.jqx-combobox-state-selected
{
    color: #000000;
    overflow: hidden;
    background-color: #d1d1d1;
    border: 1px solid #909090;
    margin: 0 0 0 0;
    cursor: pointer;
}
/*applied to the ComboBox when the widget is disabled.*/
.jqx-combobox-state-disabled
{
    white-space: nowrap;
    margin: 0px;
    background: #ccc;
    color: #AAA;
}


/*jqxDropDownList Style*/
/*applied to the dropdownlist's content element which displays the selected item's text or html.*/
.jqx-dropdownlist-content
{
    color: #000000;
    padding: 0px;
    overflow: hidden;
    padding-left: 3px;
    padding-top: 0px;
    padding-bottom: 0px;
    margin: 0px;
    text-align: left;
    vertical-align: middle;
    font-family: Verdana,Arial,sans-serif;
    font-style: normal;
    font-size: 13px;
    white-space: nowrap;
    -webkit-appearance: none;
    outline: none;
    border: none;
}
/*applied to the dropdownlist's content element which displays the selected item's text or html and the widget is disabled. */
.jqx-dropdownlist-content-disabled
{
    color: #AAA;
}
/*applied to the dropdownlist in default state.*/
.jqx-dropdownlist-state-normal
{
    -webkit-appearance: none;
    outline: none;
    border: 1px solid #aaaaaa;
    overflow: hidden;
    margin: 0 0 0 0;
    background-color: #e8e8e8;
}
/*applied to the dropdownlist in hovered state.*/
.jqx-dropdownlist-state-hover
{
    color: #000000;
    overflow: hidden;
    background-color: #e8e8e8;
    border: 1px solid #909090;
    margin: 0 0 0 0;
    cursor: pointer;
}
/*applied to the dropdownlist in selected state.*/
.jqx-dropdownlist-state-selected
{
    color: #000000;
    overflow: hidden;
    background-color: #d1d1d1;
    border: 1px solid #909090;
    margin: 0 0 0 0;
    cursor: pointer;
}
/*applied to the dropdownlist in disabled state.*/
.jqx-dropdownlist-state-disabled
{
    white-space: nowrap;
    padding: 2px 3px 2px 3px;
    margin: 1px;
    background: #ccc;
    color: #AAA;
}

/*jqxScrollBar Style*/
.jqx-scrollbar
{
    background: transparent;
    margin: 0;
    padding: 0;
    border: none;
}
/*applied to the scrollbar in default state.*/
.jqx-scrollbar-state-normal
{
    background: #efefef;
    margin: 0px;
    padding: 0px;
    border: 1px solid #efefef;
}
/*applied to the scrollbar buttons in default state.*/
.jqx-scrollbar-button-state-normal
{
    margin: 0px;
    padding: 0px;
    border: 1px solid #ececed;
    background: #ececed;
}
/*applied to the scrollbar buttons in hovered state.*/
.jqx-scrollbar-button-state-hover
{
    margin: 0px;
    padding: 0px;
    background: #e8e8e8;
    border: 1px solid #aaaaaa;
}
/*applied to the scrollbar buttons in pressed state.*/
.jqx-scrollbar-button-state-pressed
{
    margin: 0px;
    padding: 0px;
    background: #d1d1d1;
    border: 1px solid #909090;
}
/*applied to the horizontal scrollbar thumb in default state.*/
.jqx-scrollbar-thumb-state-normal-horizontal
{
    margin: 0px;
    padding: 0px;
    background: transparent;
    border: 1px solid #959695;
}
/*applied to the horizontal scrollbar thumb in hovered state.*/
.jqx-scrollbar-thumb-state-hover-horizontal
{
    margin: 0px;
    padding: 0px;
    background: #e8e8e8;
    border: 1px solid #aaaaaa;
}
/*applied to the horizontal scrollbar thumb in default state.*/
.jqx-scrollbar-thumb-state-pressed-horizontal
{
    margin: 0px;
    padding: 0px;
    background: #d1d1d1;
    border: 1px solid #909090;
}
/*applied to the vertical scrollbar thumb in default state.*/
.jqx-scrollbar-thumb-state-normal
{
    margin: 0px;
    padding: 0px;
    background: transparent;
    border: 1px solid #959695;
}
/*applied to the vertical scrollbar thumb in default state.*/
.jqx-scrollbar-thumb-state-hover
{
    margin: 0px;
    padding: 0px;
    background: #e8e8e8;
    border: 1px solid #aaaaaa;
}
/*applied to the vertical scrollbar thumb in default state.*/
.jqx-scrollbar-thumb-state-pressed
{
    margin: 0px;
    padding: 0px;
    background: #d1d1d1;
    border: 1px solid #909090;
}

/*jqxButton, jqxToggleButton, jqxRepeatButton Style*/
.jqx-button
{
    border: 1px solid rgb(198,202,205);
    padding: 3px;
    color: #000;
    margin: 0 0 0 0;
    cursor: default;
    background-color: #e8e8e8;
}
/*applied to the link button's anchor element.*/
.jqx-link
{
    text-decoration: none;
    color: #111111;
}
/*applied to buttons background in normal, hovered, pressed and disabled states.*/
.jqx-fill-state-normal
{
    background: #efefef;
}
.jqx-fill-state-hover
{
    background: #e8e8e8;
}
.jqx-fill-state-pressed
{
    background: #d1d1d1;
}
.jqx-fill-state-pressedhover
{
    background: #d1d1d1;
}
.jqx-fill-state-disabled
{
    background: #ccc;
}
/*shows elements.*/
.jqx-visible
{
    display: block;
}
/*hides elements.*/
.jqx-hidden
{
    display: none;
}
/*left, right, up and down arrow icons.*/
.jqx-left-arrow
{
    background: transparent;
    background-image: url('left.png');
    cursor: pointer;
}
.jqx-right-arrow
{
    background: transparent;
    background-image: url('right.png');
    cursor: pointer;
}

.icon-arrow-up
{
    background-image: url('images/icon-up.png');
    background-repeat: no-repeat;
    background-position: center;
}
.icon-arrow-down
{
    background-image: url('images/icon-down.png');
    background-repeat: no-repeat;
    background-position: center;
}
.icon-arrow-left
{
    background-image: url('images/icon-left.png');
    background-repeat: no-repeat;
    background-position: center;
}
.icon-arrow-right
{
    background-image: url('images/icon-right.png');
    background-repeat: no-repeat;
    background-position: center;
}

.icon-arrow-up-hover
{
    background-image: url('images/icon-up.png');
    background-repeat: no-repeat;
    background-position: center;
}
.icon-arrow-down-hover
{
    background-image: url('images/icon-down.png');
    background-repeat: no-repeat;
    background-position: center;
}
.icon-arrow-left-hover
{
    background-image: url('images/icon-left.png');
    background-repeat: no-repeat;
    background-position: center;
}
.icon-arrow-right-hover
{
    background-image: url('images/icon-right.png');
    background-repeat: no-repeat;
    background-position: center;
}

.icon-arrow-up-selected
{
    background-image: url('images/icon-up.png');
    background-repeat: no-repeat;
    background-position: center;
}
.icon-arrow-down-selected
{
    background-image: url('images/icon-down.png');
    background-repeat: no-repeat;
    background-position: center;
}
.icon-arrow-left-selected
{
    background-image: url('images/icon-left.png');
    background-repeat: no-repeat;
    background-position: center;
}
.icon-arrow-right-selected
{
    background-image: url('images/icon-right.png');
    background-repeat: no-repeat;
    background-position: center;
}