.DeviceHistoryListContainer  .textEllipsis                              { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.DeviceHistoryListContainer                                             { float: left; width: 100%; height: 100%; font-size: 10px; }
.DeviceHistoryListContainer .dx-widget                                  { color: #333; font-weight: normal; font-size: 12px; font-family: 'Helvetica Neue', 'Segoe UI', Helvetica, Verdana, sans-serif;}

.DeviceHistoryListContainer .DeviceHistoryListGridHeader                { float: left;  width: 100%; height: 50px; }
.DeviceHistoryListGridHeader_SwitchButton                               { float: left;  width:36px; margin-right: 4px;  }
.DeviceHistoryListGridHeader_HistoryItemCount                           { float: right; width:calc(100% - 40px); width: -moz-calc(100% - 40px); width: -webkit-calc(100% - 40px); color:rgb(211, 52, 52); font-size: 16px; font-weight: bold; line-height: 36px; text-align:right;}
.DeviceHistoryListGridHeader_HistoryItemCount[reduce]                   { width:calc(100% - 120px); width: -moz-calc(100% - 120px); width: -webkit-calc(100% - 120px);}
.DeviceHistoryListGridHeader_ColumChooserButton                         { float: right; width:36px; margin-left : 4px;  }
.DeviceHistoryListGridHeader_SaveColumsButton                           { float: right; width:36px; margin-left : 4px;  }

.DeviceHistoryListContainer .DeviceHistoryListGridContainer             { float: left; width: 100%; height:calc(100% - 50px); height: -moz-calc(100% - 50px); height: -webkit-calc(100% - 50px); }
.DeviceHistoryListGridContainer .dx-datagrid-header-panel               { border-top: 1px solid #ddd; }
.DeviceHistoryListGridContainer .dx-datagrid-headers                    { border-top: 1px solid #ddd; }

.DeviceHistoryListRow > tr > td                                         { width: 100%;  height:88px;}
.DeviceHistoryListRow[selected=false]                                   { background-color: #F9F9F9;}
.DeviceHistoryListRow[selected=false][shade]                            { background-color: #EFF1F2;}
.DeviceHistoryListRow[selected=true]                                    { background-color: #CCCCCC;}
.DeviceHistoryListRow .dx-freespace-row                                 { background-color: #FFFFFF;}

.DeviceHistoryListRow   .DeviceHistoryRowTop                            { float: left; width:100%; height:26px; padding-top:10px;}
.DeviceHistoryRowTop    .DeviceHistoryItemKey                           { float: left; width: 36px; height:100%; text-align: center; font-weight: bold;}
.DeviceHistoryRowTop    .DeviceHistoryItemAddress                       { float: left; width:calc(70% - 36px); width: -moz-calc(70% - 36px); width: -webkit-calc(70% - 36px);}
.DeviceHistoryRowTop    .DeviceHistoryItemDate                          { float:right; width:25%; text-align:right; padding-right: 10px;}

.DeviceHistoryListRow   .DeviceHistoryRowMiddle                         { float: left;  width:100%;     height: 36px; padding-top:10px; padding-bottom:10px; }

.DeviceHistoryRowMiddle .DeviceHistoryItemIconEvent                     { float: left;  width:36px;     height: 20px; background-position-x: center; background-position-y: center;  background-repeat:no-repeat; background-size: 20px 20px;}
.DeviceHistoryRowMiddle .DeviceHistoryItemIconState                     { float: left;  width:36px;     height: 14px; background-position-x: center; background-position-y: center;  background-repeat:no-repeat; background-size: 14px 14px;}
.dx-datagrid-content    .DeviceHistoryItemIconEvent                     { float: left;  width:36px;     height: 20px; background-position-x: center; background-position-y: center;  background-repeat:no-repeat; background-size: 20px 20px;}
.dx-datagrid-content    .DeviceHistoryItemIconState                     { float: left;  width:36px;     height: 14px; background-position-x: center; background-position-y: center;  background-repeat:no-repeat; background-size: 14px 14px;}

.DeviceHistoryRowMiddle .DeviceHistoryItemPositionIcon                  { float: left;  width: 25px;    height:100%; background-repeat:no-repeat; background-image: url(latlon.png);}
.DeviceHistoryRowMiddle .DeviceHistoryItemPosition                      { float: left;  cursor:pointer; width:calc(63% - 111px); width: -moz-calc(63% - 111px); width: -webkit-calc(63% - 111px);}
.DeviceHistoryRowMiddle .DeviceHistoryItemAltitudeIcon                  { float: left;  width: 25px;    height:100%; background-repeat:no-repeat; background-image: url(altitude.png);}
.DeviceHistoryRowMiddle .DeviceHistoryItemAltitude                      { float: left;  width: 7%;      font-weight:bold;}
.DeviceHistoryRowMiddle .DeviceHistoryItemAltitudeUnit                  { float: left;  width: 5%;      height:100%;}
.DeviceHistoryRowMiddle .DeviceHistoryItemTemperatureIcon               { float: left;  width: 25px;    height:100%; background-repeat:no-repeat; background-image: url(temperature.png);}
.DeviceHistoryRowMiddle .DeviceHistoryItemTemperature                   { float: left;  width: 6%;      font-weight:bold;}
.DeviceHistoryRowMiddle .DeviceHistoryItemTemperatureUnit               { float: left;  width: 5%;      height:100%;}
.DeviceHistoryRowMiddle .DeviceHistoryItemSource                        { float: right;  width:14%;      text-align:right; padding-right: 10px; }

.DeviceHistoryListRow   .DeviceHistoryRowBottom                         { float:left;   width:100%; height:26px; padding-bottom:10px;}
.DeviceHistoryRowBottom .DeviceHistoryItemDistanceIcon                  { float:left;   width:35px; height:100%; padding-left:60px; background-position-x: right; background-repeat:no-repeat; background-image: url(distance.png);}
.DeviceHistoryRowBottom .DeviceHistoryItemDistance                      { float:left;   margin-left: 4px; font-weight:bold; width:13%;} 
.DeviceHistoryRowBottom .DeviceHistoryItemDistanceUnit                  { float:left;   width:8%; }
.DeviceHistoryRowBottom .DeviceHistoryItemSpeedIcon                     { float:left;   width:25px; height:100%; background-repeat:no-repeat; background-image: url(speed.png);}
.DeviceHistoryRowBottom .DeviceHistoryItemSpeed                         { float:left;   font-weight:bold; width:13%;}
.DeviceHistoryRowBottom .DeviceHistoryItemSpeedUnit                     { float:left;   width:8%; }
.DeviceHistoryRowBottom .DeviceHistoryItemFuelIcon                      { float:left;   width:25px; height:100%; background-repeat:no-repeat; background-image: url(fuel.png);}
.DeviceHistoryRowBottom .DeviceHistoryItemFuelVolume                    { float:left;   font-weight:bold; width:13%;}
.DeviceHistoryRowBottom .DeviceHistoryItemFuelVolumeUnit                { float:left;   width:8%;}
.DeviceHistoryRowBottom .DeviceHistoryItemFuelPercentage                { float:left;   width:calc(37% - 149px); width: -moz-calc(37% - 149px); width: -webkit-calc(37% - 149x);}

.DeviceHistoryListContextMenuItem                                       { float:left;  margin:5px;  width:100%;}
.DeviceHistoryListContextMenuItem .dx-icon-check                        { float: left; line-height: 20px;   }
.DeviceHistoryListContextMenuItem .ContextMenuItemContent               { float: left; margin-left: 40px;   }
.DeviceHistoryListContextMenuItem .ContextMenuItemContent[selected]     { margin-left: 16px; }
.DeviceHistoryListContextMenuItem .ContextMenuItemContent[main]         { margin-left: 0px; }

.DeviceHistoryListContextMenuSortingStyler .dx-submenu                  {overflow-y: scroll; max-height: 620px; height:calc(100vh - 175px); height: -moz-calc(100vh - 175px); height: -height-calc(100vh - 175px); }