/**
 *  3manager kogrid
 *  @author info@74dpi.com
 *  @version 1.0.0 
 *  @todo   
 */
/**
 * Bootstrap custom variables
 */
/**
 * Theme variables     
 */
/**
 *  Local mixins
 */
/**
 *  Functions
 */
/**
 *  Fonts
 */
@font-face {
  font-family: 'OpenSansLight';
  src: url("../fonts/opensanslight.eot");
  src: url("../fonts/opensanslight.eot?#iefix") format("eot"), url("../fonts/opensanslight.woff") format("woff"), url("../fonts/opensanslight.ttf") format("truetype"), url("../fonts/opensanslight.svg#open_sanslight") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'OpenSansRegular';
  src: url("../fonts/opensansregular.eot");
  src: url("../fonts/opensansregular.eot?#iefix") format("eot"), url("../fonts/opensansregular.woff") format("woff"), url("../fonts/opensansregular.ttf") format("truetype"), url("../fonts/opensansregular.svg#open_sansregular") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'OpenSansRegular';
  src: url("../fonts/opensansbold.eot");
  src: url("../fonts/opensansbold.eot?#iefix") format("eot"), url("../fonts/opensansbold.woff") format("woff"), url("../fonts/opensansbold.ttf") format("truetype"), url("../fonts/opensansbold.svg#open_sansbold") format("svg");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: 'OpenSansExtraBold';
  src: url("../fonts/opensansextrabold.eot");
  src: url("../fonts/opensansextrabold.eot?#iefix") format("eot"), url("../fonts/opensansextrabold.woff") format("woff"), url("../fonts/opensansextrabold.ttf") format("truetype"), url("../fonts/opensansextrabold.svg#open_sansextrabold") format("svg");
  font-weight: bold;
  font-style: normal;
}
/**
 *  Keyframes    
 */
@-webkit-keyframes loader {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes loader {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.koGrid {
  margin-top: 30px;
  border: 1px solid #deded8;
}
.koGrid .kgLabel {
  display: block;
  float: left;
  padding-right: 5px;
}
.koGrid .kgGroupPanel {
  background-color: #eaeaea;
  overflow: hidden;
  border-bottom: 1px solid #deded8;
}
.koGrid .kgGroupPanelDescription {
  margin-top: 5px;
  margin-left: 5px;
}
.koGrid .kgGroupList {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.koGrid .kgGroupItem {
  float: left;
}
.koGrid .kgGroupItem:first-child {
  margin-left: 2px;
}
.koGrid .kgGroupElement {
  float: left;
  height: 100%;
  width: 100%;
}
.koGrid .kgGroupName {
  background-color: #f7f7f7;
  border: 1px solid #deded8;
  padding: 3px 10px;
  float: left;
  margin-left: 0;
  margin-top: 2px;
  border-radius: 3px;
  font-weight: bold;
}
.koGrid .kgRemoveGroup {
  width: 5px;
  float: right;
  opacity: 0.4;
  margin-top: -1px;
  margin-left: 5px;
}
.koGrid .kgRemoveGroup:hover {
  color: black;
  text-decoration: none;
  cursor: pointer;
  opacity: 0.7;
}
.koGrid .kgGroupArrow {
  width: 0;
  height: 0;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 6px solid  black;
  margin-top: 10px;
  margin-left: 5px;
  margin-right: 5px;
  float: right;
}
.koGrid .kgTopPanel {
  position: relative;
  background: #f4f4f1;
  border-bottom: 1px solid #deded8;
  z-index: 5;
}
.koGrid .kgHeaderContainer {
  position: relative;
  overflow: hidden;
  font-weight: bold;
}
.koGrid .kgHeaderScroller {
  position: absolute;
}
.koGrid .kgHeaderSortColumn {
  position: absolute;
  overflow: hidden;
  cursor: pointer;
}
.koGrid .kgHeaderCell {
  border-left: 1px solid #deded8;
  position: absolute;
  cursor: pointer;
}
.koGrid .kgHeaderCell:first-child {
  border-left: 0;
}
.koGrid .kgHeaderCell:last-child {
  border-right: 1px solid #deded8;
}
.koGrid .kgSortButtonUp {
  position: absolute;
  top: 12px;
  right: 5px;
  border-color: gray transparent;
  border-style: solid;
  border-width: 0 5px 5px 5px;
  height: 0;
  width: 0;
}
.koGrid .kgSortButtonDown {
  position: absolute;
  top: 12px;
  right: 5px;
  border-color: gray transparent;
  border-style: solid;
  border-width: 5px 5px 0 5px;
  height: 0;
  width: 0;
}
.koGrid .kgHeaderGrip {
  cursor: col-resize;
  width: 10px;
  right: -5px;
  top: 0;
  height: 100%;
  position: absolute;
  z-index: 5;
}
.koGrid .kgHeaderText {
  padding: 6px 10px;
  box-sizing: border-box;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  color: #4c4c4c;
  font-size: 12px;
}
.koGrid .kgViewport {
  overflow: auto;
  min-height: 400px;
}
.koGrid .kgCanvas {
  position: relative;
}
.koGrid .kgRow {
  position: absolute;
  border-bottom: 1px solid #deded8;
  cursor: pointer;
}
.koGrid .kgRow.even {
  background-color: #f4f4f1;
}
.koGrid .kgRow.odd {
  background-color: white;
}
.koGrid .kgRow.selected {
  background-color: #bdd0cb;
}
.koGrid .kgRow.canSelect {
  cursor: pointer;
}
.koGrid .kgCell {
  overflow: hidden;
  position: absolute;
  border-left: 1px solid #deded8;
}
.koGrid .kgCell:first-child {
  border-left: 0;
}
.koGrid .kgCell:last-child {
  border-right: 1px solid #deded8;
}
.koGrid .kgCellText {
  padding: 5px;
  box-sizing: border-box;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.koGrid .kgSelectionHeader {
  position: absolute;
  top: 11px;
  left: 6px;
}
.koGrid .kgSelectionCell {
  margin-top: 9px;
  margin-left: 6px;
}
.koGrid .kgNoSort {
  cursor: default;
}
.koGrid .kgFooterPanel {
  padding: 0;
  height: 39px !important;
  border-top: 1px solid #deded8;
  position: relative;
}
.koGrid .kgTotalSelectContainer {
  float: left;
  margin: 7px 0 7px 10px;
  line-height: 22px;
}
.koGrid .kgFooterSelectedItems {
  padding: 2px;
}
.koGrid .kgFooterTotalItems {
  padding: 2px;
}
.koGrid .kgFooterTotalItems.kgnoMultiSelect {
  padding: 0 !important;
}
.koGrid .kgAggHeader {
  position: absolute;
  border: none;
}
.koGrid .kgAggregate {
  position: absolute;
  background-color: #b3bfbc;
  border-bottom: 1px solid  beige;
  overflow: hidden;
  top: 0;
  bottom: 0;
  right: -1px;
  left: 0;
}
.koGrid .kgAggregateText {
  position: absolute;
  left: 27px;
  top: 5px;
  line-height: 20px;
  white-space: nowrap;
}
.koGrid .kgAggArrowExpanded {
  position: absolute;
  left: 8px;
  bottom: 10px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 9px 9px;
  border-color: transparent transparent #000000 transparent;
}
.koGrid .kgAggArrowCollapsed {
  position: absolute;
  left: 8px;
  bottom: 10px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 5px 0 5px 8.7px;
  border-color: transparent transparent transparent #000000;
}
.koGrid .kgHeaderButton {
  position: absolute;
  right: 2px;
  top: 8px;
  border-radius: 50%;
  width: 14px;
  height: 14px;
  z-index: 5;
  background-color: #b3bfbc;
  cursor: pointer;
}
.koGrid .kgHeaderButtonArrow {
  position: absolute;
  top: 4px;
  left: 3px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6.5px 4.5px 0 4.5px;
  border-color: #000 transparent transparent transparent;
}
.koGrid .kgColMenu {
  right: 2px;
  padding: 5px;
  top: 25px;
  border-radius: 3px;
  background-color: #BDD0CB;
  position: absolute;
  border: 2px solid #deded8;
  z-index: 5;
}
.koGrid .kgMenuText {
  position: relative;
  top: 2px;
  left: 2px;
}
.koGrid .kgColList {
  list-style-type: none;
}
.koGrid .kgColListItem {
  position: relative;
  right: 17px;
  top: 2px;
  white-space: nowrap;
}
.koGrid .kgColListCheckbox {
  position: relative;
  right: 3px;
  top: 4px;
}
.koGrid .kgPagerContainer {
  margin: 7px 10px 7px 0 !important;
}
.koGrid .kgPagerButton {
  color: #56606e;
  background-color: #f4f4f1;
  border-color: #d6d6d6;
  padding: 5px 7px;
  font-size: 12px;
  line-height: 1;
  border-radius: 2px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: inline-block;
  margin-bottom: 0;
  text-align: center;
  vertical-align: middle;
  height: 23px;
  cursor: pointer;
  background-image: none;
  border-width: 1px;
  border-style: solid;
  white-space: nowrap;
}
.koGrid .kgPagerButton:hover, .koGrid .kgPagerButton:focus, .koGrid .kgPagerButton:active, .koGrid .kgPagerButton.active, .open > .koGrid .kgPagerButton.dropdown-toggle {
  color: #56606e;
  background-color: #deded4;
  border-color: #b7b7b7;
}
.koGrid .kgPagerButton:active, .koGrid .kgPagerButton.active, .open > .koGrid .kgPagerButton.dropdown-toggle {
  background-image: none;
}
.koGrid .kgPagerButton.disabled, .koGrid .kgPagerButton.disabled:hover, .koGrid .kgPagerButton.disabled:focus, .koGrid .kgPagerButton.disabled:active, .koGrid .kgPagerButton.disabled.active, .koGrid .kgPagerButton[disabled], .koGrid .kgPagerButton[disabled]:hover, .koGrid .kgPagerButton[disabled]:focus, .koGrid .kgPagerButton[disabled]:active, .koGrid .kgPagerButton[disabled].active, fieldset[disabled] .koGrid .kgPagerButton, fieldset[disabled] .koGrid .kgPagerButton:hover, fieldset[disabled] .koGrid .kgPagerButton:focus, fieldset[disabled] .koGrid .kgPagerButton:active, fieldset[disabled] .koGrid .kgPagerButton.active {
  background-color: #f4f4f1;
  border-color: #d6d6d6;
}
.koGrid .kgPagerButton .badge {
  color: #f4f4f1;
  background-color: #56606e;
}
.koGrid .kgPagerControl {
  line-height: 1 !important;
  margin-right: 0 !important;
}
.koGrid .kgPagerCurrent {
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  padding: 3px 5px !important;
  margin-top: 0 !important;
  font-size: 12px;
  line-height: 1;
  height: 23px !important;
  color: #6e6e6e;
  background-color: white;
  background-image: none;
  border: 1px solid #d6d6d6;
  border-radius: 2px;
}
.koGrid .kgPagerFirstTriangle {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 4px 7px 4px 0;
  border-color: transparent #56606e transparent transparent;
  margin-left: 2px;
}
.koGrid .kgPagerFirstBar {
  width: 10px;
  border-left: 2px solid  #56606e;
  margin-top: -5px;
  height: 9px;
  margin-left: -3px;
}
.koGrid .kgPagerLastTriangle {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 4px 0 4px 7px;
  border-color: transparent transparent transparent #56606e;
  margin-left: -1px;
}
.koGrid .kgPagerLastBar {
  width: 10px;
  border-left: 2px solid  #56606e;
  margin-top: -5px;
  height: 9px;
  margin-left: 1px;
}
.koGrid .kgGroupIcon {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAANCAYAAACZ3F9/AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjEwMPRyoQAAAEFJREFUKFNjoAhISkr+h2J5JDZODNXGwGBsbPwfhIGAA8bGh6HaGBiAGhxAGJmND4M1gQCSM0adCsVQbcPcqQwMALWDGyDvWPefAAAAAElFTkSuQmCC);
  background-repeat: no-repeat;
  height: 15px;
  width: 15px;
  position: absolute;
  right: -2px;
  top: 2px;
}
.koGrid .kgGroupedByIcon {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAANCAYAAACZ3F9/AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjEwMPRyoQAAAElJREFUKFNjoAhISkr+R8LyaHwMDNXGwGBsbPwfhoGAA5mPDUO1oWpE52PDYE0gALTFAYbR+dgwWBMIoPlh1I9ADNU2NPzIwAAAFQYI9E4OLvEAAAAASUVORK5CYII=);
  background-repeat: no-repeat;
  height: 15px;
  width: 15px;
  position: absolute;
  right: -2px;
  top: 2px;
}
.koGrid .kgGroupingNumber {
  position: absolute;
  right: -10px;
  top: -2px;
}
.koGrid .kgRowCountPicker {
  line-height: 25px;
}
.koGrid .kgRowCountPicker .kgLabel {
  margin-top: 0 !important;
}
.koGrid .kgRowCountPicker select {
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  padding: 3px 5px;
  font-size: 12px;
  line-height: 1;
  height: 23px !important;
  width: 50px !important;
  color: #6e6e6e;
  background-color: white;
  background-image: none;
  border: 1px solid #d6d6d6;
  border-radius: 2px;
}
.koGridPrimary .kgTopPanel {
  background: #5f5f5f;
}
.koGridPrimary .kgHeaderCell {
  border-left: 0;
}
.koGridPrimary .kgHeaderText {
  color: white;
  font-weight: normal;
  background: #5f5f5f;
}
.koGridPrimary .kgRow {
  position: absolute;
  border-bottom: 1px solid #deded8;
  cursor: pointer;
}
.koGridPrimary .kgRow.even {
  background-color: white;
}
.koGridPrimary .kgRow:hover {
  background-color: #f3f3f3;
}
.koGridPrimary .kgCell {
  border-color: #f1f1f1;
}
.koGridPrimary .kgCell:last-child {
  border-color: #f1f1f1;
}
.koGrid .center {
    text-align: center;
}