erp/Web/js/plugins/jqx.base.css

/*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 rounded corners*/
.jqx-rc-reset
{
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
}

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

.jqx-position-reset {
    position: static !important; 
}
/*Disable browser selection*/
.jqx-disableselect
{
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
    -ms-user-select:none;
    -webkit-touch-callout:none;
}
.jqx-hideborder
{
    border: none !important;
}
.jqx-hidescrollbars
{
    overflow: hidden !important;
}
/*jqxButton, jqxToggleButton, jqxRepeatButton Style*/
.jqx-button{outline: none; border: 1px solid transparent; padding: 3px; text-align: center; vertical-align: central; margin: 0 0 0 0; cursor: default; }
.jqx-buttongroup{}
/*applied to the link button's anchor element.*/
.jqx-link
{
    text-decoration: none;
    color: #111111;
}

/*shows elements.*/
.jqx-visible
{
    display: block;
}
/*hides elements.*/
.jqx-hidden
{
    display: none;
}
.jqx-widget, .jqx-widget-content, .jqx-widget-header, .jqx-fill-state-normal {
    line-height: 1.231;
}
/*jqxGauge Style*/
.jqx-gauge-label, .jqx-gauge-caption
{
    fill: #333333;
    color: #333333;
    font-size: 11px;
    font-family: Verdana;
}
/*jqxChart Style*/
.jqx-chart-axis-text,
.jqx-chart-label-text, 
.jqx-chart-tooltip-text, 
.jqx-chart-legend-text
{
    fill: #333333;
    color: #333333;
    font-size: 11px;
    font-family: Verdana;
}
.jqx-chart-axis-description
{
    fill: #555555;
    color: #555555;
    font-size: 11px;
    font-family: Verdana;
}
.jqx-chart-title-text
{
    fill: #111111;
    color: #111111;
    font-size: 14px;
    font-weight: bold;
    font-family: Verdana;
}
.jqx-chart-title-description
{
    fill: #111111;
    color: #111111;
    font-size: 12px;
    font-weight: normal;
    font-family: Verdana;
}
/*applied to the Grid's element.*/
.jqx-grid
{
    overflow: hidden;
    border-style: solid;
    border-width: 1px;
}
/*applied to the Pager.*/
.jqx-grid-pager
{
    border: none;
    border-top: 1px solid transparent;
}
/*applied to the Grid's bottom-right area between the horizontal and vertical scrollbars.*/
.jqx-grid-bottomright
{
   
}
/*applied to the Grid's header area.*/
.jqx-grid-header 
{
    border-style: solid;
    border-width: 0px 0px 1px 0px;
    overflow: hidden;
    border-color: transparent;
    margin: 0px;
    padding: 0px;
 }
 /*applied to the columns.*/
.jqx-grid-column-header, .jqx-grid-columngroup-header {
    border-style: solid;
    border-width: 0px 1px 0px 0px;
    border-color: transparent;
    white-space: nowrap;
    border-style: solid;
    font-weight: normal;  
    overflow: hidden;
    text-align: left;
    padding: 0px;
    margin: 0px;
 }
.jqx-grid-column-header-rtl, .jqx-grid-columngroup-header-rtl {
    border-width: 0px 0px 0px 1px;
}
.jqx-grid-columngroup-header {
    border-bottom-width: 1px;
    border-left-width: 1px;
}
 /*applied to the column's button.*/
 .jqx-grid-column-menubutton {
    border-style: solid;
    border-width: 0px 0px 0px 1px;
    border-color: transparent;
    background-image: url('../resources/menubutton.png');
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
 }
.jqx-grid-column-menubutton-rtl {
    border-width: 0px 1px 0px 0px;
}
 /*applied to the column's sort button when the sort order is ascending.*/
 .jqx-grid-column-sortascbutton {
    border: none;
    background-image: url('../resources/sortascbutton.png');
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
 }
 /*applied to the column's sort button when the sort order is descending.*/
  .jqx-grid-column-sortdescbutton {
    border: none;
    background-image: url('../resources/sortdescbutton.png');
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
 }
  /*applied to the column's filter button.*/
  .jqx-grid-column-filterbutton
 {
    border: none;
    background-image: url('../resources/filter_dark.png');
    background-repeat: no-repeat;
    background-position: center;
 }
  /*applied to the column's resize line.*/
 .jqx-grid-column-resizeline {
   border-right: 1px dotted #555; 
 }
 /*applied to the validation popup during cell editing.*/
 .jqx-grid-validation
 {
    background: #df2227;
    color: #fff;
    padding: 4px 8px;
 }
  .jqx-grid-validation-arrow-up
 {
    background-image: url('../resources/red_arrow_up.png');
    background-repeat: no-repeat;
    background-position: center center;
 }
  .jqx-grid-validation-arrow-down
 {
    background-image: url('../resources/red_arrow_down.png');
    background-repeat: no-repeat;
    background-position: center center;
 }
  /*applied to the column's resize start line.*/
  .jqx-grid-column-resizestartline {
   border-right: 1px solid #444; 
 }
  /*applied to the sort ascending menu item in the Grid's Context Menu*/
 .jqx-grid-sortasc-icon
 {
    background-image: url('../resources/sortasc.png');
    background-repeat: no-repeat;
    background-position: left center;
    width: 16px;
    height: 16px;
    float: left;
    margin-left: -4px;
    margin-right: 4px;
 }
  /*applied to the sort ascending menu item in the Grid's Context Menu*/
 .jqx-grid-sortdesc-icon
 {
    background-image: url('../resources/sortdesc.png');
    background-repeat: no-repeat;
    background-position: left center;
    width: 16px;
    height: 16px;
    float: left;
    margin-left: -4px;
    margin-right: 4px;
 }
  /*applied to the grid menu's sort remove item/*/
 .jqx-grid-sortremove-icon
 {
    background-image: url('../resources/sortremove.png');
    background-repeat: no-repeat;
    background-position: left center;
    width: 16px;
    height: 16px;
    float: left;
    margin-left: -4px;
    margin-right: 4px;
 }
   /*applied to the grouping column's drag and drop item when the drop operation is allowed.*/
 .jqx-grid-drag-icon
 {
    background-image: url('../resources/drag.png');
    background-repeat: no-repeat;
    background-position: left center;
    width: 16px;
    height: 16px;
 }
   /*applied to the grouping column's drag and drop item when the drop operation is not allowed.*/
 .jqx-grid-dragcancel-icon
 {
    background-image: url('../resources/dragcancel.png');
    background-repeat: no-repeat;
    background-position: left center;
    width: 16px;
    height: 16px;
 }
 /*applied to the 'group by' menu item.*/
 .jqx-grid-groupby-icon
 {
    background-repeat: no-repeat;
    background-position: left center;
    width: 16px;
    height: 16px;
    float: left;
    margin-left: -4px;
    margin-right: 4px;
 }
/*applied to the column anchor tags.*/
 .jqx-grid-column-header a:link{
    display: block;
    margin: 4px;
    height: 18px;
    line-height: 18px !important;
    color: inherit;
    outline: 0 none;
    text-decoration: none;
    cursor: pointer;
}
 .jqx-grid-column-header a:visited{
    display: block;
    margin: 4px;
    height: 18px;
    line-height: 18px !important;
    color: inherit;
    outline: 0 none;
    text-decoration: none;
    cursor: pointer;
}
/*applied to the groups header area.*/
 .jqx-grid-groups-header, .jqx-grid-toolbar {
    border-style: solid;
    border-width: 0px 0px 1px 0px;
    border-color: #aaa;
    white-space: nowrap;
    overflow: hidden;
    text-align: left;
    padding: 0px;
    margin: 0px;
 }
/*applied to a grouping row.*/
 .jqx-grid-groups-row {
    font-weight:bold;
    white-space: nowrap;
    text-align: left;
    padding: 0px;
    top: 50%;
    margin-top: -8px;
 }
 /*applied to the row details.*/
 .jqx-grid-groups-row-details {
    font-weight: normal;
 }
 /*applied to a grouping column.*/
 .jqx-grid-group-column 
 {
    border: 1px solid transparent;
    white-space: nowrap;
    border-style: solid;
    font-weight: normal;  
    overflow: hidden;
    text-align: left;
    padding: 0px;
    margin: 0px;
 }
 /*applied to the lines between the group columns.*/
  .jqx-grid-group-column-line
 {
    background: #aaa;
 }
 /*applied to the drop line indicators displayed in the grouping header.*/
  .jqx-grid-group-drag-line
 {
    background: #80be09;
 }
 /*applied to the anchor tags inside a grouping column.*/
 .jqx-grid-group-column  a:link{
    display: block;
    margin: 4px;
    height: 18px;
    line-height: 18px !important;
    outline: 0 none;
    text-decoration: none;
    cursor: pointer;
    color: inherit;
    *color: expression(this.parentNode.currentStyle['color']);     
}
 .jqx-grid-group-column  a:visited{
    color: inherit;
    display: block;
    margin: 4px;
    height: 18px;
    line-height: 18px !important;
    outline: 0 none;
    text-decoration: none;
    cursor: pointer;
     *color: expression(this.parentNode.currentStyle['color']);    
}
/*applied to a grid cell*/
.jqx-grid-cell {
    border-style: solid;
    border-width: 0px 1px 1px 0px;
    margin-right: 1px;
    margin-bottom: 1px;
    border-color: transparent;  
    background: #fff;
    white-space: nowrap;
    font-weight: normal; 
    font-size: inherit;
    overflow: hidden; 
    position: absolute !important; 
    height: 100%; 
 }
/*applied to a grid cell that is part of a rows group.*/
 .jqx-grid-group-cell{ 
    overflow: hidden; 
    position: absolute !important; 
    height: 100%; 
    background: #fff;
 }
/*applied to the grid cells in the sort column*/
 .jqx-grid-cell-sort {
    background-color: #f0f0f0;
 }

 /*applied to the grid cells in the filter column*/
 .jqx-grid-cell-filter {
    background-color: #e6e6e6;
 }
 /*applied to the grid cells area.*/
.jqx-grid-content {
    border-style: solid;
    border-width: 0px 0px 0px 0px;
    border-color: transparent;
    white-space: nowrap;
    overflow: hidden;
 }
 /*applied to a grid cell that is part of a rows group.*/
.jqx-grid-group-cell, .jqx-grid-empty-cell {
    border-style: solid;
    border-width: 0px 0px 1px 0px;
    white-space: nowrap;
    font-weight: normal;   
 }
.jqx-widget .jqx-grid-cleared-cell, .jqx-grid-cleared-cell {
    border: transparent !important;
}
.jqx-grid-cell-wrap {white-space: normal;}
 /*applied to a grid cell that is part of a details row and grouping is enabled.*/
.jqx-grid-group-details-cell {

 }
 /*applied to a grid cell that is part of a details row.*/
.jqx-grid-details-cell {
    border-width: 0px 1px 0px 0px;
 }
  /*applied to a grid cell. Represents the alternating cell background.*/
.jqx-grid-cell-alt {
    background: #f9f9f9;  
 }
/*applied to a sorted and alternating grid cell*/
.jqx-grid-cell-sort-alt {
    background-color: #e5e5e5;
 }/*applied to a sorted and alternating grid cell*/
.jqx-grid-cell-filter-alt {
    background-color: #f0f0f0;
 }
  /*applied to a pinned grid cell.*/
.jqx-grid-cell-pinned {
    background-color: #e5e5e5;
 }
 /*applied to a pinned grid cell. Represents the alternating cell background.*/
.jqx-grid-cell-pinned-alt {
    background-color: #e5e5e5;
 }
 /*applied to a selected grid cell.*/
 .jqx-grid-cell-selected {
    border-left: 0px solid transparent;
 }
 .jqx-grid-cell-rtl {
    border-width: 0px 0px 1px 1px;
 }

  /*applied to the selection area.*/
 .jqx-grid-selectionarea {
    border: 1px solid transparent;
    opacity: 0.5;
    filter: alpha(opacity=50);
 }
 /*applied to a hovered grid cell.*/
 .jqx-grid-cell-hover {
    border-color: transparent;
 }
  /*applied to a grid cell when the grid is empty.*/
 .jqx-grid-empty-cell{ overflow: visible; border-bottom: none;}

 /*applied to the Grid when its loading the data.*/
 .jqx-grid-load
{
    padding-right: 0px;
    background-image: url(../resources/loader.gif);
    background-position: 50% 50%;
    background-repeat: no-repeat;  
    z-index: 9999;
}
/*applied to a group's collapse button.*/
.jqx-grid-group-collapse
{
    padding-right: 0px;
    background-image: url(images/icon-right.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    cursor: pointer;
}
.jqx-grid-group-collapse-rtl
{
    padding-right: 0px;
    background-image: url(images/icon-left.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    cursor: pointer;
}
/*applied to a group's expand button.*/
.jqx-grid-group-expand, .jqx-grid-group-expand-rtl
{
    padding-right: 0px;
    background-image: url(images/icon-down.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    cursor: pointer;
}
/*jqxProgresBar Style*/
.jqx-progressbar
{
    overflow: hidden;
    outline: none;
    border: 1px solid transparent;
    height: 2em;
}
/*applied to the progressbar's value element*/
.jqx-progressbar-value
{
    outline: none;
    border: 0px solid transparent;
    height: 100%;
}
/*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 transparent;
    height: 100%;
    background: transparent;
}
/*applied to the progressbar's text element*/
.jqx-progressbar-text
{
    font-size: 10px;
    border: none;
}
/*applied to the progress bar when the widget is in disabled state*/
.jqx-progressbar-disabled
{
    outline: none;
    border: 1px solid transparent; 
    height: 2em;
}

/*jqxMenu Style*/
.jqx-menu
{
    border: 1px solid transparent;
    float: none;
    margin: 0px;
    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
{
    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
{
    text-align: left;
}
/*applied to the sub menu. Sets the sub menu's background*/
.jqx-menu-dropdown
{
    left: 100%;
    margin: 0px;
    padding: 0px;
    right: 0;
    overflow: hidden;
    display: none;
    float: none;
    width: 150px;
    border-style: solid;
    border-width: 1px;
    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 menu's li elements.*/
.jqx-menu li, .jqx-menu-dropdown li
{
    line-height: 1.3 !important;
}
/*applied to the top level menu items.*/
.jqx-menu-item-top
{
    border: 1px solid transparent;
    text-indent: 0;
    list-style: none;
    padding: 4px 8px 4px 8px;
    left: 100%;
    overflow: hidden;
    color: inherit;
    right: 0;
    margin: 0px 1px 0px 1px;
    cursor: pointer;
}
/*applied to the sub menu items.*/
.jqx-menu-item
{
    text-indent: 0;
    list-style: none;
    padding: 4px 8px 4px 8px;
    margin: 1px 1px 1px 1px;
    float: none;
    overflow: hidden;
    left: 100%;
    color: inherit;
    right: 0;
    text-align: left;
    cursor: pointer;
    *color: expression(this.parentNode.currentStyle['color']);     
}
/*applied to a sub menu item when the mouse is over the item.*/
.jqx-menu-item-hover
{
    color: inherit;
    right: 0;
    list-style: none;
    margin: 1px 1px 1px 1px;
    left: 100%;
    padding: 4px 8px 4px 8px;
    text-align: left;
    cursor: pointer;
    *color: expression(this.parentNode.currentStyle['color']);     
}
/*applied to a top-level menu item when the mouse is over it.*/
.jqx-menu-item-top-hover
{
    color: inherit;
    right: 0;
    list-style: none;
    margin: 0px 1px 0px 1px;
    left: 100%;
    padding: 4px 8px 4px 8px;
    top: 50%;
    cursor: pointer;
    *color: expression(this.parentNode.currentStyle['color']);     
}
/*applied to a sub menu item when its sub menu is opened.*/
.jqx-menu-item-selected
{
    right: 0;
    list-style: none;
    margin: 1px 1px 1px 1px;
    left: 100%;
    padding: 4px 8px 4px 8px;
    text-align: left;
    cursor: pointer;
    *color: expression(this.parentNode.currentStyle['color']);     
}
/*applied to a disabled sub menu item.*/
.jqx-menu-item-disabled
{

}
/*applied to a top-level menu item when its sub menu is opened.*/
.jqx-menu-item-top-selected
{
    right: 0;
    list-style: none;
    margin: 0px 1px 0px 1px;
    left: 100%;
    padding: 4px 8px 4px 8px;
    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;
    line-height:0 !important;
    padding: 0px;
    margin: 1px 2px 1px 2px;
    float: none;
    overflow: hidden;
    left: 100%;
    color: inherit;
    right: 0;
    font-size: 1px;
}
/*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: 15px;
    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: 15px;
    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: 15px;
    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: 15px;
    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: 15px;
    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: 15px;
    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: 15px;
    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: 15px;
    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: 15px;
    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: 15px;
    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, .jqx-menu-item a:visited
{
    border: none;
    background-color: transparent;
    outline: none;
    color: inherit;
    text-decoration: none;
    *color: expression(this.parentNode.currentStyle['color']);     
}
/*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;
    *color: expression(this.parentNode.currentStyle['color']);     
}

/*applied to the anchor elements of a top-level menu item.*/
.jqx-menu-item-top a:link
{
    border: none;
    background-color: transparent;
    outline: none;
    color: inherit;
    text-decoration: none;
    *color: expression(this.parentNode.currentStyle['color']);     
}
/*applied to the anchor elements of a top-level menu item.*/
.jqx-menu-item-top a:visited
{
    border: none;
    background-color: transparent;
    outline: none;
    color: inherit;
    text-decoration: none;
    *color: expression(this.parentNode.currentStyle['color']);     
}
/*applied to the anchor elements of a top-level menu item.*/
.jqx-menu-item-top a:hover
{
    text-decoration: none;
    color: inherit;
    outline: none;
    background-color: transparent;
    border: none;
    *color: expression(this.parentNode.currentStyle['color']);     
}
/*applied to the menu widget when it is disabled.*/
.jqx-menu-disabled
{
    cursor: default;
}
/*applied to the anchor elements of all disabled menu items.*/
.jqx-menu-disabled a:link
{
    cursor: default;
    text-decoration: none;
}
.jqx-menu-disabled a:visited
{
    cursor: default;
    text-decoration: none;
}
.jqx-menu-disabled a:hover
{
    cursor: default;
}
.jqx-menu-dropdown
{
    right: -1px;
}

/*jqxtree Style*/
.jqx-tree
{
    left: 100%;
    right: 0;
    float: none;
    margin: 0px;
    border-style: solid;
    border-width: 1px;
    padding: 0px;
    overflow: hidden;
    text-align: left;
    outline: none;
    white-space: nowrap;
    line-height: 14px !important;
}
/*applied to the jqxTree root UL element.*/
.jqx-tree-dropdown-root
{
    left: 100%;
    padding: 0px 5px 0px 5px;
    right: 0;
    display: block;
    float: none;
    background-color: transparent;
    border-style: solid;
    border-width: 0px;
    border-color: #fff;
    text-align: left;
    outline: none;
    white-space: nowrap;
    margin: 0px;
}
.jqx-tree-dropdown-root-rtl {
    padding: 0px 5px 0px 0px;
    text-align: right;
    float: right;
    margin: 0px;
}

/*applied to the jqxTree UL elements.*/
.jqx-tree-dropdown
{
    left: 100%;
    margin: 0px;
    padding: 0px 0px 0px 10px;
    right: 0;
     display: block;
    float: none;
    background-color: transparent;
    border-style: solid;
    border-width: 0px;
    border-color: transparent;
    text-align: left;
    outline: none;
}
.jqx-tree-dropdown-rtl {
   padding: 0px 0px 0px 0px;
   text-align: right;
}

/*applied to a tree item.*/
.jqx-tree-item
{
    text-indent: 0;
    list-style: none;
    padding: 3px;
    margin: 0px;
    float: none;
    overflow: hidden;
    left: 100%;
    right: 0;
    text-align: left;
    cursor: default;
    text-decoration: none;
}
/*applied to the jqxTree LI elements.*/
.jqx-tree-item-li
{
    text-indent: 0;
    background-color: transparent;
    border: 0px solid transparent;
    list-style: none;
    left: 100%; 
    right: 0;
    text-align: left;
    outline: none;
    margin: 0px;
    margin-top: 1px;
    padding: 0px;
}
/*applied to the last LI elements in an UL element.*/
.jqx-tree-item-u-last
{
    margin: 0px 0px 0px 0px;
}
/*applied to a tree item when the mouse is over the item.*/
.jqx-tree-item-hover
{
    color: inherit;
    right: 0;
    padding: 3px;
    margin: 0px;
    list-style: none;
    left: 100%;
    cursor: pointer;
    text-decoration: none;
}
/*applied to a tree item when the item is selected.*/
.jqx-tree-item-selected
{
    color: inherit;
    right: 0;
    padding: 3px;
    margin: 0px;
    list-style: none;
    left: 100%;
    cursor: pointer;
    text-decoration: none;
}
.jqx-tree-item-rtl {
    text-align: right;
}
.jqx-tree-item-li-rtl {
    text-align: right;
}
/*applied to the anchor element of a tree item.*/
.jqx-tree-item a:link, .jqx-tree-item a:visited
{
    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;
    text-align: left;
    cursor: pointer;
    text-decoration: none;
    outline: none;
}
.jqx-tree-item-selected, .jqx-tree-item-hover a:hover
{
    color: inherit;
}
.jqx-tree-item-selected, .jqx-tree-item-hover a:visited
{
    color: inherit;
}

/*applied to a tree item when the item is disabled.*/
.jqx-tree-item-disabled
{

}
/*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, .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;
}
.jqx-tree-item-arrow-collapse-rtl, .jqx-tree-item-arrow-collapse-hover-rtl {
    background-image: url(images/icon-left.png);
}

/*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, .jqx-tree-item-arrow-expand-hover
{
    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 the tree when it is disabled.*/
.jqx-tree-disabled
{
    cursor: default;
}
/*applied to the anchor elements in a tree when it is disabled.*/
.jqx-tree-disabled a:link
{
    cursor: default;
    text-decoration: none;
}
.jqx-tree-disabled a:visited
{
    cursor: default;
    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 transparent;
}
/*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;
    position: relative;
    left: 5px;
}
/*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
{
    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;
    overflow: hidden;
    z-index: 1;
    padding-left: 13px;
    padding-right: 13px;
    padding-bottom: 5px;
    padding-top: 5px;
    background: transparent;
    height: auto;
    position: relative; 
}
.jqx-tabs-title-bottom
{
}
.jqx-tabs-title a:link
{
    color: inherit;
    *color: expression(this.parentNode.currentStyle['color']);    
    text-decoration: none;
}
.jqx-tabs-title a:hover
{
    color: inherit;
    *color: expression(this.parentNode.currentStyle['color']);
    text-decoration: none;
}
.jqx-tabs-title a:active
{
    color: inherit;
    *color: expression(this.parentNode.currentStyle['color']);
    text-decoration: none;
}
.jqx-tabs-title a:visited
{
    color: inherit;
    *color: expression(this.parentNode.currentStyle['color']);
    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: 99;
    outline: none;
    border-top: 1px solid transparent;
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
    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 transparent;
    border-right: 1px solid transparent;
    border-bottom: 1px solid transparent;
    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: 1px solid transparent;    
    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: 1px solid transparent;
    padding-top: 5px;
}
/*applied to the tab's title when the tab is disabled.*/
.jqx-tabs-title-disable
{
 
}
/*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: 0px 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: 0px 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: 0px solid transparent;
}
.jqx-tabs-collapsed-bottom
{
    border: 0px 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: 0px;
}
/*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 transparent;
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
    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-left: 1px solid transparent;
    border-right: 1px solid transparent;
    border-bottom: 1px solid transparent;
    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;
    border-bottom: 0px solid transparent;
    border-left: 0px solid transparent;
    border-right: 0px solid transparent;
    border-top: 0px solid transparent;
    text-align: left;
    clear: both;
}
.jqx-tabs-content-element
{
    height: 100%;
    overflow: auto;
}

/*jqxCheckBox*/
.jqx-checkbox
{
    text-align: left;
    border: none;
    outline: none;
    margin: 0 0 0 0;
    white-space: nowrap;
    text-overflow: ellipsis;
}
/*applied to the check box.*/
.jqx-checkbox-default
{
    text-align: left;
    float: left;
    padding: 0px;
    border: 1px solid transparent;
    outline: none;
    margin: 0px 3px 0px 3px;
}
/*applied to the check box when the mouse cursor is over it.*/
.jqx-checkbox-hover
{
    cursor: pointer;
    float: left;
    padding: 0px;
    border: 1px solid transparent;
    outline: none;
    margin: 0px 3px 0px 3px;
}
/*applied to the widget when it is disabled.*/
.jqx-checkbox-disabled
{
    cursor: default;
    background: transparent;
    padding: 0px;
    border: none;
    outline: none;
    margin: 0px 0px 0px 0px;
}
/*applied to the check box when the widget is disabled.*/
.jqx-checkbox-disabled-box
{
    float: left;
    padding: 0px;
    border: 1px solid transparent;
    outline: none;
    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) center center no-repeat;
    padding: 0px;
    border: none;
    outline: none;
    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) center center no-repeat;
    padding: 0px;
    border: none;
    outline: none;
    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) center center no-repeat;
    padding: 0px;
    border: none;
    outline: none;
    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) center center no-repeat;
    padding: 0px;
    border: none;
    outline: none;
    margin: 0 0 0 0;
}
/*applied to the check box when its in rtl mode.*/
.jqx-checkbox-rtl {
    float: right;
}
/*jqxRadioButton*/
.jqx-radiobutton
{
    text-overflow: ellipsis;
    border: none;
    outline: none;
    margin: 0 0 0 0;
    white-space: nowrap;
}
/*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: 1px solid transparent;
    outline: none;
    margin: 1px 3px 0px 3px;
    -moz-border-radius: 100%;
    -webkit-border-radius: 100%;
    border-radius: 100%;
}
/*applied to the radio button when the mouse is over it.*/
.jqx-radiobutton-hover
{
    cursor: pointer;
    float: left;
    background: transparent;
    padding: 0px;
    border: 1px solid transparent;
    outline: none;
    margin: 1px 3px 0px 3px;
    -moz-border-radius: 100%;
    -webkit-border-radius: 100%;
    border-radius: 100%;
}
/*applied to the radio button when it is disabled.*/
.jqx-radiobutton-disabled
{
    cursor: default;
}
/*applied to the radio button's radio icon when it is disabled.*/
.jqx-radiobutton-disabled-box
{
}
/*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: 1px solid transparent;
    outline: none;
    margin: 0 0 0 0;
    -moz-border-radius: 100%;
    -webkit-border-radius: 100%;
    border-radius: 100%;
    width: 7px; 
    height: 7px;
    margin-left: 2px;
    margin-top: 2px;
}
/*applied to the radio button when it is checked and disabled.*/
.jqx-radiobutton-check-disabled
{
}
/*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;
    margin: 0 0 0 0;
    -moz-border-radius: 100%;
    -webkit-border-radius: 100%;
    border-radius: 100%; 
    width: 6px; 
    height: 6px;
    margin-left: 2px;
    margin-top: 2px;  
}
/*applied to the radio button when it is in indeterminate state and disabled.*/
.jqx-radiobutton-check-indeterminate-disabled
{
}
/*applied to the radio button when its in rtl mode.*/
.jqx-radiobutton-rtl {
    float: right;
}

/*jqxRating*/
.jqx-rating
{
    margin: 0px;
    padding: 0px;
    outline: none;
    overflow: hidden;
}
.jqx-rating-image
{
    border-width: 0px;
}
.jqx-rating-image-default
{
    margin: 0px;
    padding: 0px;
    outline: none;    
    background-color: transparent;
    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;
}
/*jqxCalendar Style*/
.jqx-calendar
{
    border: 1px solid transparent;
    -webkit-appearance: none;
    overflow: hidden;
    outline: none;
    padding: 0px;
    margin: 0 0 0 0;
    cursor: default;
    border-collapse: separate;
}
.jqx-calendar td {
    padding-top: 0px;
    padding-bottom: 0px;
    border-collapse: separate;
    border-spacing: 1px;
}
.jqx-calendar table {
    margin: 0px;
    padding: 0px;
    border-collapse: separate;
    border-spacing: 1px;
}
/*applied to the calendar's row header. This header displays the week numbers.*/
.jqx-calendar-row-header
{
    outline: none;
    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;
    padding: 3;
    border-top: none;
    border-bottom: 1px solid transparent;
    border-left: none;
    border-right: none;
    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;
    border: 0px solid #f2f2f2;
    margin: 0 0 0 0;
    cursor: default;
}
/*applied to the calendar's navigation buttons.*/
.jqx-calendar-title-navigation
{
    cursor: pointer;
    background-color: transparent; 
    margin: 0; 
    padding: 0; 
    border: none; 
    width: 25px;
    height: 25px;
}
/*applied to the month table*/
.jqx-calendar-month
{
    margin: 0; padding: 0;
    border: none;
    width: 100%; 
}
/*applied to the calendar's title content.*/
.jqx-calendar-title-content
{
    cursor: pointer;
}
/*applied to the calendar's navigation title.*/
.jqx-calendar-title-header
{
    border-left: none;
    border-top: none;
    border-right: none;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    margin: 0 0 0 0;
}
.jqx-calendar-title-header td {
    padding-left: 0px;
    padding-right: 0px;
}
/*applied to the calendar's navigation title when the calendar is disabled.*/
.jqx-calendar-title-header-disabled
{   
    border-bottom-width: 1px;
    border-bottom-style:solid; 
    margin: 0 0 0 0;    
    border-left: 0px solid transparent;
    border-right: 0px solid transparent;
    border-top: 0px solid transparent;    
    
}
/*applied to a calendar cell.*/
.jqx-calendar-cell
{
    border: 1px solid transparent;
    margin: 0px;
    outline: none;
    text-align: center;
    padding: 1px;
    cursor: pointer;
    background-color: transparent;
}
.jqx-calendar-cell td
{
    padding: 0;
    margin: 0;
}
/*applied to a calendar cell in decade and year views.*/
.jqx-calendar-cell-decade, .jqx-calendar-cell-year {
   text-align: center;
 }

.jqx-calendar .jqx-fill-state-normal
{
    background: transparent;
    border: 1px solid transparent;
}

/*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;
    visibility: hidden;
    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 !important;
    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
{
    margin: 0 0 0 0;
    cursor: pointer;
}
/*applied to a calendar cell when the cell is selected.*/
.jqx-calendar-cell-selected
{
    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
{
    color: #ccc;
}
/*applied to a calendar cell when the cell is from the row header that displays the week numbers.*/
.jqx-calendar-row-cell
{
    outline: none;
    text-align: center;
    border: 1px solid transparent;
    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
{

}
.jqx-calendar-footer
{
    margin: 5px;
    color: inherit;
    font-size: 13px;
}

.jqx-calendar-title-container
{
    overflow: hidden;
}
/*applied to a calendar cell when the cell is from the column header that displays the day names.*/
.jqx-calendar-column-cell
{
    overflow: hidden;
    text-align: center;
    outline: none;
    font-weight: normal;
    padding: 1px;
    border: 1px solid transparent;
    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
{

}
/*applied to the calendar's cell area element.*/
.jqx-calendar-view
{
    -webkit-appearance: none;
    outline: none;
    padding: 0px;
    border: 0px solid #FFFFFF;
    margin: 0 0 0 0;
    cursor: default;
}

/*jqxExpander and jqxNavigationBar Style*/
.jqx-expander
{
}
/*applied to the Expander's header and content*/
.jqx-expander-header, .jqx-expander-content
{
    border-left-width: 1px;
    border-right-width: 1px;
    border-left-style: solid;
    border-right-style: solid;
    padding-top: 5px;
    padding-bottom: 5px;
    outline: 0;
}
/*applid to the content of the expander header.*/
.jqx-expander-header-content
{
    padding-left: 3px;
}
/*applid to the content of the expander header.*/
.jqx-expander-header-content-rtl
{
    padding-right: 3px;
}
 .jqx-expander-content{padding-top: 0px;padding-bottom:0px; overflow: auto; outline: 0;}
/*applied to the Expander's header and its content when it is on the top of the header*/
.jqx-expander-header, .jqx-expander-content-top
{
    border-top-width: 1px;
    border-top-style: solid;
}
/*applied to the Expander's header and its content when it is on the bottom of the header*/
.jqx-expander-header, .jqx-expander-content-bottom
{
    border-bottom-width: 1px;
    border-bottom-style: solid;
}
/*applied to the Expander's header*/
.jqx-expander-header
{
    cursor: pointer;
    overflow: hidden;
}
/*applied to the Expander's header when the expander is disabled or the toggleMode is "none"*/
.jqx-expander-header-disabled
{
    cursor: default;
}
/*applied to the Expander's arrow*/
.jqx-expander-arrow
{
    width: 17px;
    height: 17px;
    position: relative;
}
/*applied to the Expander's content if it is empty*/
.jqx-expander-content-empty
{
    border-width: 0px;
    padding: 0px;
}

/*applied to jqxNavigationBar. The NavigationBar internally uses jqxExpander's classes and inherits all header and content style settings from the Expander.*/
.jqx-navigationbar
{
    border: none;
    margin: 0px;
    -webkit-appearance: none;
    outline: none;
}
/*jqxPanel Style*/
.jqx-panel
{
    border: 1px solid transparent;
    -webkit-appearance: none;
    outline: none;
    padding: 0px;
    margin: 0px;
    cursor: default;
    overflow: hidden;
}
/*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
{
  
}
/*applied to the DropDownButton's Popup.*/
.jqx-dropdownbutton-popup {
   -webkit-appearance: none;
    outline: none;
    border: 1px solid transparent;
 }

.jqx-listbox
{
    -webkit-appearance: none;
    outline: none;
    border: 1px solid transparent;
    padding: 0px;
    margin: 0px;
    cursor: default;
    overflow: hidden;
}
/*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
{

}
/*applied to the ListBox's groups.*/
.jqx-listitem-state-group
{
    white-space: nowrap;
    padding: 4px 2px 4px 2px;
    background: transparent;
    font-weight: bold;
    text-align: left;
    outline: none;
    overflow: hidden;
    vertical-align: middle;
}
/*applied to a list item in default state.*/
.jqx-listitem-state-normal
{
    white-space: nowrap;
    padding: 3px;
    margin: 1px;
    border: 1px solid transparent;
    outline: none;
    visibility: inherit;
    display: inherit;
    text-align: left;
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 0;
}
/*applied to a list item in hovered state.*/
.jqx-listitem-state-hover
{
    white-space: nowrap;
    background: transparent;
    padding: 3px 3px 2px 3px;
    margin: 1px;
    border: 1px solid transparent;
}
/*applied to a list item when the item is selected.*/
.jqx-listitem-state-selected
{
    white-space: nowrap;
    padding: 3px 3px 2px 3px;
    margin: 1px;
    border: 1px solid transparent;
}
.jqx-listbox-feedback
{
    height: 1px;
    border-top: 1px dashed #000;
}
.jqx-listitem-element
{
  -ms-touch-action: none;
  border: none; 
  width:100%; 
  height: 100%; 
  align:left; 
  valign:top; 
  position: absolute;
}

/*jqxComboBox Style*/
/*applied to the jqxComboBox's content which displays the text.*/
.jqx-combobox-content
{
    padding: 0px;
    overflow: hidden;
    padding-left: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-right: 0px;
    margin: 0px;
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
    -webkit-appearance: none;
    outline: none;
    border: none;
    -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;
    border-right: 1px solid transparent; 
    -moz-background-clip: padding; background-clip: padding-box; -webkit-background-clip: padding-box;    
}
.jqx-combobox-content-rtl {
    border: none;
    -moz-border-radius-topleft: 0px;
    -webkit-border-top-left-radius: 0px;
    border-top-left-radius: 0px;
    -moz-border-radius-bottomleft: 0px;
    -webkit-border-bottom-left-radius: 0px;
    border-bottom-left-radius: 0px;
     -moz-border-radius-topleft: 3px;
    -webkit-border-top-left-radius: 0px;
    border-top-right-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    -webkit-border-bottom-right-radius: 0px;
    border-bottom-right-radius: 3px;
    border-right: none;
    border-left: 1px solid transparent; 
    -moz-background-clip: padding; background-clip: padding-box; -webkit-background-clip: padding-box;  
}
/*applied to the ComboBox's input field.*/
.jqx-combobox-input
{
    -webkit-appearance: none;
    -webkit-border-radius: 0px;
    padding: 0 0 0 0;
    outline: none;
    border: 0px solid #aaaaaa;
    -moz-background-clip: padding; background-clip: padding-box; -webkit-background-clip: padding-box;
}
.jqx-combobox-input::-ms-clear {
    display: none;
}
/*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;
    overflow: hidden;
    margin: 0 0 0 0;
    border: none;
    cursor: pointer;
}
/*applied to the ComboBox's arrow button when the mouse is over the button.*/
.jqx-combobox-arrow-hover
{
    -webkit-appearance: none;
    outline: none;
    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;
    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 transparent;
    overflow: hidden;
    margin: 0 0 0 0;
}
/*applied to the ComboBox when the mouse is over the widget.*/
.jqx-combobox-state-hover
{
    overflow: hidden;
    border: 1px solid transparent;
    margin: 0 0 0 0;
}
/*applied to the ComboBox when the popup ListBox is shown.*/
.jqx-combobox-state-selected
{
    overflow: hidden;
    border: 1px solid transparent;
    margin: 0 0 0 0;
}
/*applied to the ComboBox when the widget is focused.*/
.jqx-combobox-state-focus
{
    border: 1px solid transparent;
}
.jqx-combobox-multi-item {
    padding: 1px 3px;
    margin: 2px;
    white-space: nowrap;
    border-style: solid;
    font-weight: normal;  
    overflow: hidden;
    text-align: left;

}
.jqx-combobox-multi-item a:link, .jqx-combobox-multi-item a:visited  {
    color: inherit;
    display: block;
    outline: 0 none;
    text-decoration: none;
    cursor: pointer;
    *color: expression(this.parentNode.currentStyle['color']);    
}
/*applied to the ComboBox when the widget is disabled.*/
.jqx-combobox-state-disabled
{
    white-space: nowrap;
    margin: 0px;
    color: #AAA;
}

/*jqxDropDownList Style*/
/*applied to the dropdownlist's content element which displays the selected item's text or html.*/
.jqx-dropdownlist-content
{
    padding: 0px;
    overflow: hidden;
    padding-left: 3px;
    padding-top: 0px;
    padding-bottom: 0px;
    margin: 0px;
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
    -webkit-appearance: none;
    outline: 0 none;
    border: none;
}
.jqx-dropdownlist-content-rtl {
    padding-left: 0px;
    padding-right: 3px;
}

/*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
{
}
/*applied to the dropdownlist in default state.*/
.jqx-dropdownlist-state-normal
{
    -webkit-appearance: none;
    outline: none;
    border: 1px solid transparent;
    overflow: hidden;
    margin: 0 0 0 0;
}
/*applied to the dropdownlist in hovered state.*/
.jqx-dropdownlist-state-hover
{
    overflow: hidden;
    border: 1px solid transparent;
    margin: 0 0 0 0;
    cursor: pointer;
}
/*applied to the dropdownlist in selected state.*/
.jqx-dropdownlist-state-selected
{ 
    overflow: hidden;
    background-color: transparent;
    border: 1px solid transparent;
    margin: 0 0 0 0;
    cursor: pointer;
}
/*applied to the dropdownlist in focused state.*/
.jqx-dropdownlist-state-focus
{
    border: 1px solid #909090;
}
/*applied to the dropdownlist in disabled state.*/
.jqx-dropdownlist-state-disabled
{

}
/*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 transparent;
}
/*applied to the scrollbar buttons in default state.*/
.jqx-scrollbar-button-state-normal
{
    margin: 0px;
    padding: 0px;
    border: 1px solid transparent; 
}
/*applied to the scrollbar buttons in hovered state.*/
.jqx-scrollbar-button-state-hover
{
    margin: 0px;
    padding: 0px;
    border: 1px solid transparent;
}
/*applied to the scrollbar buttons in pressed state.*/
.jqx-scrollbar-button-state-pressed
{
    margin: 0px;
    padding: 0px;
    border: 1px solid transparent;
}
/*applied to the horizontal scrollbar thumb in default state.*/
.jqx-scrollbar-thumb-state-normal-horizontal
{
    margin: 0px;
    padding: 0px;
    background: transparent;
    border: 1px solid transparent;
}
/*applied to the horizontal scrollbar thumb in hovered state.*/
.jqx-scrollbar-thumb-state-hover-horizontal
{
    margin: 0px;
    padding: 0px;   
    border: 1px solid transparent;
}
/*applied to the horizontal scrollbar thumb in default state.*/
.jqx-scrollbar-thumb-state-pressed-horizontal
{
    margin: 0px;
    padding: 0px;
    border: 1px solid transparent;
}
/*applied to the vertical scrollbar thumb in default state.*/
.jqx-scrollbar-thumb-state-normal
{
    margin: 0px;
    padding: 0px;
    border: 1px solid transparent;
}
/*applied to the vertical scrollbar thumb in default state.*/
.jqx-scrollbar-thumb-state-hover
{
    margin: 0px;
    padding: 0px;
    background: transparent;
    border: 1px solid transparent;
}
/*applied to the vertical scrollbar thumb in default state.*/
.jqx-scrollbar-thumb-state-pressed
{
    margin: 0px;
    padding: 0px;
    background: #d1d1d1;
    border: 1px solid #909090;
}

/* jqxWindow */
.jqx-window
{
    position: absolute;
    overflow: hidden;
    border: 1px solid transparent;
}
/*applied to the jqxWindow when it’s disabled*/
.jqx-window-disabled
{
}
/*applied to the window’s header*/
.jqx-window-header
{
    outline: none;
    border-width: 0px;
    border-bottom: 1px solid transparent; 
    overflow: hidden;
    padding: 5px;
    height: auto;
    white-space: nowrap;
    overflow: hidden;  
}
/*applied to the window’s header when the window is disabled*/
.jqx-window-header-disabled
{

}
/*applied to the window’s content*/
.jqx-window-content
{
    outline: none;
    overflow: auto;
    text-align: left;
    background-color: transparent;
    padding: 5px;
    -webkit-background-clip: padding-box; background-clip: padding-box;
}
/*applied to the window’s content when the window is disabled*/
.jqx-window-content-disabled
{
    outline: none;
    overflow: auto;
    text-align: left;
    padding: 5px;
}
/*applied to the window’s close button*/
.jqx-window-close-button
{
    cursor: pointer;
    background-image: url(images/close.png);
    background-repeat: no-repeat;    
}
/*applied to the window's collapse button*/
.jqx-window-collapse-button
{
    background-image: url(images/icon-up.png);
    cursor: pointer;
}
/*applied to the window's collapse button when the window is collapsed*/
.jqx-window-collapse-button-collapsed
{
    cursor: pointer;
    background-image: url(images/icon-down.png);
}
/*setting styles of the modal window’s background*/
.jqx-window-modal
{
   background-color: Black;
}
.jqx-window-close-button-hover
{
}
.jqx-docking
{
    overflow: hidden;
}
.jqx-docking-panel
{
    margin: 0px;
    padding: 0px;
    min-height: 100px;
}
.jqx-docking-drop-indicator
{
    border-style: dashed;
    border-width: 1px;
    margin: 0px;
}
.jqx-docking-window
{
    margin: 0px;
}

/* jxSlider */
/* applied to jqxSlider widget */
.jqx-slider
{
    outline: none;
    clear: both;
}
/*applied to the ticks which can be in the top/bottom/both sides of the jqxSlider*/
.jqx-slider-tick
{
    border-left: 1px solid transparent;
    z-index: 9; 
}
/*applied to the ticks when the slider is in horizontal mode*/
.jqx-slider-tick-horizontal
{
    width: 1px;
    border-left: none;
    margin-top: 1px;
}
/*applied to the ticks when the slider is in vertical mode*/
.jqx-slider-tick-vertical
{
    height: 1px;
    border-top: none;
}
/*applied to the ticks container*/
.jqx-slider-tickscontainer
{
    z-index: 10;
    position: relative;
    margin-top: 0px;
    margin-bottom: 0px;
    z-index: 9;
}
/*applied to the jqxSlider thumb used for changing/indicating current value*/
.jqx-slider-slider
{
    cursor: pointer;
    width: 16px;
    height: 16px;
    z-index: 15;
    position: absolute;
    left: 0px;
    top: 0px;
}
.jqx-slider-button
{
    -moz-border-radius: 9px;
    -webkit-border-radius: 9px;
    border-radius: 9px;    
}
/*applied to the slider's thumb when the slider is in horizontal mode*/
.jqx-slider-slider-horizontal
{   
    background-image: url(images/slider_horizontal_classic.png);
    background-repeat: no-repeat;
    margin-top: -5px;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px;    
    border: 1px solid transparent;
}
/*applied to the slider's thumb when the slider is in vertical mode*/
.jqx-slider-slider-vertical
{
    margin-left: -5px;
    background-image: url(images/slider_vertical_classic.png);
    background-repeat: no-repeat;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px;
    border: 1px solid transparent;
 }
/*applied to the track where is located the thumb*/
.jqx-slider-track
{
    height: 8px;
    float:left;
    position: relative;
    z-index: 20;
}
/*used in horizontal slider*/
.jqx-slider-track-horizontal
{
    height: 8px;
    margin-top: 2px;
}
/*used in vertical slider*/
.jqx-slider-track-vertical
{
    width: 8px;
}
/*applied to the div which is between the thumbs in a range slider or from beginning of the track to the current thumb position in the default slider*/
.jqx-slider-rangebar
{
 
}

/* jqxSplitter */
.jqx-splitter
{
    overflow: hidden;
    border: 1px solid transparent;
    position: relative;
}
/* Split bar's class when the jqxSplitter is with horizontal orientation */
.jqx-splitter-splitbar-vertical
{
    border: 1px solid transparent;
    border-top-width: 0px;
    border-bottom-width: 0px;
    cursor: e-resize;
    cursor: col-resize;
    position: absolute;
}
/* Split bar's mouse over state */
.jqx-splitter-splitbar-hover
{
    background-color: transparent;
}
/* Split bar's class when the jqxSplitter is with horizontal orientation. */
.jqx-splitter-splitbar-horizontal
{
    position: absolute;
    border: 1px solid transparent;
    border-left-width: 0px;
    border-right-width: 0px;   
    cursor: n-resize;
    cursor: row-resize;
}
/* This class is applied to the splitter when it's dragged to it's max left/right boundary */
.jqx-splitter-splitbar-invalid
{
   background: #FF0000 !important;
}
/* This class is added to split bar's collapse button when the splitter is with vectical orientation. */
.jqx-splitter-collapse-button-horizontal
{
    cursor: pointer;
    width: 45px;
    height: 5px;
}
/* This class is added to split bar's collapse button when the splitter is with horizontal orientation. */
.jqx-splitter-collapse-button-vertical
{
    cursor: pointer;
    width: 5px;
    height: 45px;
}
/* This class is added when the user disable the splitter. */
.jqx-splitter-splitbar-collapsed
{
    cursor: default;
}
/* Applied to the jqxSplitter panels. */
.jqx-splitter-panel
{
    border: none;
    outline: none;   
    position: absolute;
    overflow: hidden;
}
/* This class is added to a nested splitter.*/
.jqx-splitter-nested, .jqx-splitter-panel-nested
{
    border: none;
    overflow: hidden;
}
.jqx-draggable
{
    
}
.jqx-draggable-dragging
{
    border: 0px solid black;
}
.jqx-draggable-disabled
{
    cursor: default;
}
.jqx-validator-hint
{
    height: 18px;
    width: auto;
    display: inline-block;
    cursor: pointer;
    padding-left: 5px;
    padding-right: 5px;
    font-family: Verdana;
    font-size: 13px;
    border: 1px solid #6E0000;
    background-color: #942724;
    color: #fff;
    z-index: 99999;
    white-space: nowrap;
}
.jqx-validator-hint-arrow
{
    z-index: 99999;
    height: 9px;
    width: 9px;
    padding: 0px;
    margin: 0px;
    background-color: transparent;
    background-image: url(images/multi-arrow.gif);
}
.jqx-validator-error-label {
   color: #dd4b39;
   vertical-align:top;
   text-align: left;
   display: block;
   cursor: default;
   line-height: 17px;
 }
.jqx-validator-error-element {
   border-color: #dd4b39 !important;
}

.jqx-switchbutton
{
    overflow: hidden;
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    border-radius: 5px;
    border: 1px solid #ccc;
}
.jqx-switchbutton-thumb
{
    display: inline-block;
    cursor: pointer;
    border: 1px solid #ccc;
}
.jqx-switchbutton-label
{
    font-size: 15px;
    font-family: Sans-Serif;
    text-align: center;
    text-transform: uppercase;
    font-weight: bold;
}
.jqx-switchbutton-wrapper
{
}
.jqx-switchbutton-label-on
{
    
}
.jqx-switchbutton-label-off
{
    
}

/*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;
}

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

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

.jqx-icon-arrow-up-selected
{
    background-image: url('images/icon-up.png');
    background-repeat: no-repeat;
    background-position: center;
}
.jqx-icon-arrow-down-selected
{
    background-image: url('images/icon-down.png');
    background-repeat: no-repeat;
    background-position: center;
}
.jqx-icon-arrow-left-selected
{
    background-image: url('images/icon-left.png');
    background-repeat: no-repeat;
    background-position: center;
}
.jqx-icon-arrow-right-selected
{
    background-image: url('images/icon-right.png');
    background-repeat: no-repeat;
    background-position: center;
}
.jqx-icon-close
{
    cursor: pointer;
    background-image: url(images/close.png);
    background-repeat: no-repeat;
    background-position: center;
}
.jqx-icon-close-hover
{
    cursor: pointer;
    background-image: url(images/close.png);
    background-repeat: no-repeat;
    background-position: center;
}
/* jqxScrollView */
.jqx-scrollview-button
{
    width: 10px;
    height: 10px;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    display: inline-block;
    margin: 2px;
    cursor: pointer;
    background-color: #aaaeaf;
}
.jqx-scrollview
{
    background-color: #000;
}
/*applied to Inputs*/
.jqx-input{-webkit-user-modify:inherit; -moz-user-modify: inherit;  overflow: hidden; background-color: inherit; border-color: #c7c7c7;}
.jqx-input-group {overflow: hidden;}
.jqx-input-group-addon {border: 1px solid transparent; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 2px 8px !important; float: left; white-space: nowrap; vertical-align: middle; }
.jqx-input-group-addon:first-child {
  border-right-width: 0px;
  border-bottom-right-radius: 0 !important;
  border-top-right-radius: 0 !important;
}
.jqx-input-group-addon:last-child {
  border-left-width: 0px;
  border-bottom-left-radius: 0 !important;
  border-top-left-radius: 0 !important;
}
.jqx-input-group-addon:not(:last-child):not(:first-child) {
  border-bottom-left-radius: 0 !important;
  border-top-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border-left-width: 0px;
}
.jqx-input-group .jqx-input {
    padding: 2px 1px !important;
    border-left-width: 1px !important;
    border-right-width: 1px !important;
}
/*applied to all widgets*/
.jqx-widget{-ms-touch-action: none; zoom: 1; color: #000000; -moz-background-clip: padding; background-clip: padding-box; -webkit-text-size-adjust: none; -ms-text-size-adjust: none; -webkit-appearance: none; -webkit-background-clip: padding-box; direction: ltr; -webkit-tap-highlight-color: rgba(0,0,0,0); font-family: Verdana,Arial,sans-serif; font-style: normal; font-size: 13px;}

.jqx-item{-ms-touch-action: none; color: inherit; border: 1px solid transparent; background: transparent; -webkit-text-size-adjust: none;}

/*applied to containers to set a background and border color. Tabs, NavigationBar, Calendar content.*/
.jqx-widget-content {-ms-touch-action: none; -moz-background-clip: padding; -webkit-text-size-adjust: none; background-clip: padding-box; -webkit-background-clip: padding-box; -webkit-tap-highlight-color: rgba(0,0,0,0); font-family: Verdana,Arial,sans-serif; font-style: normal; font-size: 13px; border-color: #c7c7c7; background: #fff; }
/*applied to header areas. Tabs, Menu, Window, Calendar.*/
.jqx-widget-header {-ms-touch-action: none;-moz-background-clip: padding; -webkit-text-size-adjust: none; background-clip: padding-box; -webkit-background-clip: padding-box; -webkit-tap-highlight-color: rgba(0,0,0,0); border-color: #c5c5c5; background: #e8e8e8; }

.jqx-fill-state-normal{-ms-touch-action: none;font-family: Verdana,Arial,sans-serif; font-style: normal; font-size: 13px; border-color:#aaa; background: #efefef; }
.jqx-fill-state-hover {border-color:#999;  background: #e8e8e8;}
.jqx-fill-state-pressed{border-color:#999; background: #d1d1d1;}
.jqx-fill-state-focus {border-color: #555; }
.jqx-fill-state-disabled {cursor: default; color: #000; opacity: .55; filter:Alpha(Opacity=45);}

.jqx-widget .jqx-grid-cell, .jqx-widget .jqx-grid-column-header, .jqx-widget .jqx-grid-group-cell {border-color: #aaa;}
.jqx-widget .jqx-grid-column-menubutton, .jqx-widget .jqx-grid-column-sortascbutton, .jqx-widget .jqx-grid-column-sortdescbutton, .jqx-widget .jqx-grid-column-filterbutton
{
   background-color: transparent;
   border-color: #aaa;
}
.jqx-grid-column-header a:link, .jqx-grid-column-header a:visited
{
   *color: expression(this.parentNode.currentStyle['color']);    
}
.jqx-grid-bottomright, .jqx-panel-bottomright, .jqx-listbox-bottomright
{
   background-color: #e5e5e5;
}

.jqx-tabs-title-selected-top
{
    border-color: #aaa;
    border-bottom: 1px solid #fff;
    background-color: #fff;
}
/*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
{
    border-color: #aaa;
    border-top: 1px solid #fff;
    background-color: #fff;
}
/*applied to the tab's selection tracker when the jqxTab's position property is set to 'top'.*/
.jqx-tabs-selection-tracker-top
{
   border-color: #aaa;
   border-bottom: 1px solid #fff;
}
/*applied to the tab's selection tracker when the jqxTab's position property is set to 'bottom'.*/
.jqx-tabs-selection-tracker-bottom
{
   border-color: #aaa;
   border-top: 1px solid #fff;
}
/*jqxMaskedInput and jqxNumberInput Styles*/
.jqx-input
{
    -webkit-appearance: none;
    padding: 0 0 0 0;
    outline: none;
    border-width: 1px;
    border-style: solid; 
    -moz-background-clip: padding; background-clip: padding-box; -webkit-background-clip: padding-box;
}
input[type=text].jqx-input, input[type=password].jqx-input {
    min-height: 16px;
    min-width: 16px;
    margin: 0px;
    border-width: 1px;
    border-style: solid;
    font-size: 13px;
    padding: 0px;
}
.jqx-input::-ms-reveal {
    display: none;
}
.jqx-input::-ms-clear {
    display: none;
}
.jqx-input-content::-ms-clear {
    display: none;
}
.jqx-input::-ms-value {
    margin: 0px;
    padding: 0px;
    min-height: 13px;
    line-height: 13px;
}

/*applied to the input when the validation fails.*/
.jqx-input-invalid
{
    border-color: #dd4b39 !important;
}
/*applied to the input's content.*/
.jqx-input-content
{
    -webkit-appearance: none;
    padding: 1px;
    resize: none;
    outline: none;
    outline-width: 0px;
    -webkit-user-modify:inherit; -moz-user-modify:inherit;
    -moz-background-clip: padding; background-clip: padding-box; -webkit-background-clip: padding-box;
}
/*applied to the input when it is disabled.*/
.jqx-input-disabled
{
    -webkit-appearance: none;
    resize: none;
    outline: none;
    outline-width: 0px;
}

/*applied to the jqxDateTimeInput's button header.*/
.jqx-input-button-header
{
    cursor: pointer;
    -webkit-appearance: none;
    height: 3px;
    padding: 0px;
    outline: none;
    border-width: 1px;
    border-style: solid;
}
/*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;
    border: 0px solid #fff;
}
/*applied to the jqxDateTimeInput's button content.*/
.jqx-input-button-content
{
    font-style: normal;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    -webkit-appearance: none;
    padding: 0px;
    outline: none;
    border-width: 1px;
    border-style: solid;
    border-top-width: 0px;    
    font-size: 10px;
}
.jqx-menu-popup {
   
}
.jqx-menu-vertical
{
    background-color: #efefef;
}
.jqx-color-picker
{
 
}
.jqx-color-picker-panel
{
}
.jqx-color-picker-map
{
    border: 1px solid #A0A0A0;
    background-color: transparent;
    background-image: url('images/map-saturation.png');
    background-repeat: no-repeat;
    background-position: left top;
    overflow: hidden;
}
.jqx-color-picker-map-hue
{
    border: 1px solid #A0A0A0;
    background-color: transparent;
    background-image: url('images/map-hue.png');
    background-repeat: no-repeat;
    background-position: left top;
    overflow: hidden;
}
.jqx-color-picker-map-overlay
{ 
    background-color: transparent;
    background-image: url('images/map-saturation-overlay.png');
    background-repeat: no-repeat;
    background-position: left top;
}
.jqx-color-picker-bar
{
    border: 1px solid #A0A0A0;
    background-color: transparent;
    background-image: url('images/bar-saturation.png');
    background-repeat: no-repeat;
    background-position: left top;
}
.jqx-color-picker-bar-hue
{
    border: 1px solid #A0A0A0;
    background-color: transparent;
    background-image: url('images/bar-hue.png');
    background-repeat: no-repeat;
    background-position: left top;
}
.jqx-color-picker-preview
{
    border: 1px solid #A0A0A0;
}
.jqx-color-picker-pointer
{
    background-image: url('images/crosshair.png');
    background-repeat: no-repeat;
    height: 16px;
    width: 16px;
}
.jqx-color-picker-pointer-alt
{
    background-image: url('images/crosshair-white.png');
    background-repeat: no-repeat;
    height: 16px;
    width: 16px;
}
.jqx-color-picker-bar-pointer
{
    background-image: url('images/pointer.png');
    background-repeat: no-repeat;
    height: 15px;
    margin-left: 6px;
    background-position: right top;
}
.jqx-icon
{
    width: 16px;
    height: 16px;
    margin: 0 auto;
    position: relative;
    top: 50%; 
    margin-top: -8px;
}
.jqx-input-icon
{
    width: 13px;
    height: 13px;
    margin: 0 auto;
}
.jqx-scrollbar-thumb-state-normal-touch
{
    border-color:#c3c3c3;  background: #c3c3c3;
}
.jqx-touch, .jqx-touch .jqx-fill-state-normal, .jqx-touch .jqx-widget-content, .jqx-touch .jqx-widget-header, .jqx-touch a:link{}
.jqx-scrollbar .jqx-icon-arrow-up{width: 100%; height: 100%;}
.jqx-scrollbar .jqx-icon-arrow-down{width: 100%; height: 100%;}
.jqx-scrollbar .jqx-icon-arrow-left{width: 100%; height: 100%;}
.jqx-scrollbar .jqx-icon-arrow-right{width: 100%; height: 100%;}
/*jqx-listmenu*/
.jqx-listmenu-widget
{
    border-width: 1px;
    border-style: solid;
}
ol.jqx-listmenu, ul.jqx-listmenu
{
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    line-height: 1;
     counter-reset: section;
}
.jqx-listmenu li 
{
   margin-left: 0px;
   list-style: none;
   line-height: 1;
}
.jqx-listmenu
{
    width: 100%;
}
.jqx-listmenu-header
{
    padding: 15px;
}
.jqx-listmenu-item 
{
    cursor: pointer;
    padding: 15px;
    float: none;
    overflow: hidden;
    text-align: left;
    position: relative;
}

.jqx-listmenu-separator
{
    padding: 10px;
    counter-reset: section;
}
.jqx-listmenu-header-label
{
    margin-left: 30px;
}
.jqx-listmenu-arrow-right
{
    width: 16px;
    height: 16px;
    position: absolute;
    top: 50%;
    margin-top: -7px;
    right: 7px;
}
.jqx-listmenu-arrow-rtl {
    right: 0px;
    left: 7px;
}
.jqx-listmenu-arrow-right-pressed
{
    width: 16px;
    height: 16px;
}
.jqx-listmenu-header .jqx-button
{
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
    padding: 6px 10px;
}
.jqx-listmenu-filter-input
{
    -moz-border-radius: 14px;
    -webkit-border-radius: 14px;
    border-radius: 14px;
    border: 1px solid;
    outline: none;    
    width: 97%;   
    padding: 3px; 
    padding-left: 10px;
    padding-right: 10px;
    border-color: #c7c7c7;
    background-color: #fff;
    font-size: 20px;
}
.jqx-listmenu-filter
{
    text-align: center;
    padding: 4px;
}
ol li .jqx-listmenu-item-label:before
{
  content: counter(section) ". ";
  counter-increment: section;
}
.jqx-listmenu div
{
   clear: both; 
}
.jqx-listmenu-auto-separator
{
}
.jqx-listmenu-item-readonly
{   
    cursor: default;
}
.jqx-tooltip
{
    position: absolute;
    width: auto;
    height: auto;
}
.jqx-tooltip-main
{
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    filter: inherit;
    border-style: solid;
    border-width: 1px;
}
.jqx-tooltip-text
{
    padding: 5px 8px;
    overflow: hidden;
    filter: inherit;
}
.jqx-tooltip, .jqx-tooltip-text, .jqx-tooltip-main {
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -moz-background-clip: padding; background-clip: padding-box; -webkit-background-clip: padding-box;   
}
.jqx-tooltip-arrow
{
    position: absolute;
    width: 0px;
    height: 0px;
    display: block;
    border-style: solid;
    margin: -6px 0 0 -7px;
    background: transparent !important;
    filter: inherit;
}
.jqx-tooltip-arrow-t-b
{
    border-left-color: transparent !important;
    border-right-color: transparent !important;
}
.jqx-tooltip-arrow-l-r
{
    border-top-color: transparent !important;
    border-bottom-color: transparent !important;
}
/*Sets the text-alignment to right.*/
.jqx-rtl{text-align: right !important;}
.jqx-shadow{
    -webkit-box-shadow: 0 2px 3px rgba(0,0,0,.15)!important;
    -moz-box-shadow   : 0 2px 3px rgba(0,0,0,.15)!important;
    -o-box-shadow     : 0 2px 3px rgba(0,0,0,.15)!important;
    box-shadow        : 0 2px 3px rgba(0,0,0,.15)!important;
}
.jqx-noshadow {
    -webkit-box-shadow: none !important;
    -moz-box-shadow   : none !important;
    -o-box-shadow     : none !important;
    box-shadow        : none !important;
}
.jqx-passwordinput-password-icon, .jqx-passwordinput-password-icon-rtl
{
    background-image: url(images/icon-showpassword.png) !important;
    background-repeat: no-repeat !important;
    width: 12px;
    height: 9px;
}
.jqx-passwordinput-password-icon-ltr
{
    background-position: right !important;
}
.jqx-passwordinput-password-icon-rtl
{
    background-position: left !important;
}
.jqx-passwordinput-password-strength-inicator
{
    width: 20%;
    height: 5px;
    margin-top: 5px;
}
/*top rounded Corners*/
.jqx-rc-t-expanded
{
    -moz-border-radius-topleft: 0px !important;
    -webkit-border-top-left-radius: 0px !important;
    border-top-left-radius: 0px !important;
    -moz-border-radius-topright: 0px !important;
    -webkit-border-top-right-radius: 0px !important;
    border-top-right-radius: 0px !important;
}
/*bottom rounded Corners*/
.jqx-rc-b-expanded
{
    -moz-border-radius-bottomleft: 0px !important;
    -webkit-border-bottom-left-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
    -moz-border-radius-bottomright: 0px !important;
    -webkit-border-bottom-right-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
}
.jqx-treemap-rectangle {
    font-size: 13px;
    font-weight: normal;
    border: 1px solid #555;
    color: #222;
    text-shadow: 0px 0px 0px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.jqx-treemap-label {
    text-overflow: ellipsis;
    overflow: hidden;
}
.jqx-treemap-rectangle-parent {
    color: #222;
    font-size: 15px;
    font-family: Verdana;
    font-weight: bold;
}
.jqx-treemap-legend-label {
    color: #fff;
}
.jqx-treemap-legend {
    width: 350px;
    background-color: rgba(0, 0, 0, 0.1);
    z-index: 41;
    overflow: hidden;
}
.jqx-treemap-legend-table {
    table-layout: fixed;
    width: 100%;
}
.jqx-treemap-legend-color {
    height: 3px;
}
.jqx-treemap-legend-values {
    height: 12px;
    width: 100%;
}
.jqx-treemap-legend-value {
    font-size: 9px;
    position: absolute;
    color: #fff;
}
.jqx-treemap-rectangle-hover {
    -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
    -moz-box-shadow:    0px 0px 5px rgba(0, 0, 0, 0.5);
    box-shadow:         0px 0px 5px rgba(0, 0, 0, 0.5);
    z-index: 40;
}
/*jqxRangeSelector*/
.jqx-rangeselector
{
    margin: 50px;
}
.jqx-rangeselector-content
{
    position: absolute;
}
.jqx-rangeselector-ticks-container, .jqx-rangeselector-slider
{
    width: 100%;
    height: 100%;
}
.jqx-rangeselector-ticks-container
{
    background-color: transparent;
    position: relative;
}
.jqx-rangeselector-slider
{
    opacity: 0.3;
    background-color: Aqua;
    border-left: 1px solid Black;
    border-right: 1px solid Black;
}
.jqx-rangeselector-ticks
{
    background-color: Black;
    height: 100%;
    width: 1px;
    position: absolute;
}
.jqx-rangeselector-labels
{
    width: auto;
    height: auto;
    position: absolute;
}
.jqx-rangeselector-markers
{
    width: auto;
    height: 20px;
    background-color: Gray;
    position: absolute;
    padding: 5px;
}
.jqx-rangeselector-marker-arrow
{
    position: absolute;
    width: 0px;
    height: 0px;
    display: block;
    border-style: solid;
    margin: -6px 0 0 -7px;
    background-color: transparent !important;
    filter: inherit;
    border-top-width: 5px;
    border-bottom-width: 5px;
    border-right-color: transparent !important;
    border-bottom-color: transparent !important;
    border-left-color: transparent !important;
    border-top-color: Gray;
    background-clip: border-box;
    background-repeat: repeat;
}
.jqx-rangeselector-markers-alert
{
    background-color: Red;
    border-color: Red;
    color: White;
}
.jqx-rangeselector-marker-left-arrow
{
    border-right-width: 0px;
    border-left-width: 5px;
}
.jqx-rangeselector-marker-right-arrow
{
    border-right-width: 5px;
    border-left-width: 0px;
}
.jqx-rangeselector-markers-value
{
    width: 100%;
    height: 100%;
}