.react-grid-Container {
    clear: both;
    margin-top: 5%;
    padding: 0;
    color: black;
}

.react-grid-Main {
  background-color: #fbf3e4 !important;
  box-shadow: 1px 1px 20px rgba(36, 19, 8, 0.5);
  border: none !important;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  outline: none !important;
}

.react-grid-Grid {
  /*main rows */
  background-color: #fbf3e4 !important;
  border: none !important;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}

.react-grid-Row {
  cursor: pointer;
}

.react-grid-Row.row-selected, .react-grid-Row .row-selected {
  background-color: #f4e6be !important;
  -webkit-transition: background-color 500ms ease, color 500ms ease;
  -ms-transition: background-color 500ms ease, color 500ms ease;
  -moz-transition: background-color 500ms ease, color 500ms ease;
  transition: background-color 500ms ease, color 500ms ease;
}

.react-grid-Header {
  background: rgba(36, 19, 8, 0.5) !important
}

.react-grid-Toolbar {
  /*toolbar with buttons */
    background-color: rgba(36, 19, 8, 0.5) !important;
    box-shadow: 1px 1px 20px rgba(36, 19, 8, 0.5);
    border-color: transparent !important;
    border-image: repeat;
    border-style: solid solid none;
    border-width: 1px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    margin-bottom: 0;
    padding: 14px 15px 7px;
    height: 48px;
    margin-top:5px;
}

.react-grid-Toolbar .btn {
  background-color: rgb(240, 223, 171) !important;
  margin-right: 5px;
  border: none !important;
}

.react-grid-Toolbar span {
  color: white;
  font-size: 11px;
  font-weight: 700;
}

.react-grid-HeaderCell {
  background-color: rgba(36, 19, 8, 0.5) !important;
  border-right: 1px solid #000000 !important;
  border-bottom: 1px solid #000000 !important;
  height: auto;
}

.react-grid-HeaderCell .form-group input, .react-grid-HeaderCell .Select-control,
.react-grid-HeaderCell .Select-menu-outer {
  background-color: #e9f1da;
}

.react-grid-HeaderCell .is-open>.Select-control {
  background-color: #e9f1da;
}

.react-grid-HeaderCell .Select-option {
  background-color: #f6e1bc;
  color: black;
}

.react-grid-HeaderCell-sortable {
  font-size: 11px;
  color: white;
  white-space: normal;
}

.react-grid-Cell {
  border-right: 1px solid #c1b1a4 !important;
  border-bottom: 1px solid #c1b1a4 !important;
  background-color: #fbf3e4 !important;
  color: black;
  word-wrap: normal;
  font-size: 10px;
}

.reactGrid {
    padding-right: 10px;
    text-align: center;

    -moz-animation-name: showEffect;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: ease-in;
    -moz-animation-duration: 0.3s;

    -webkit-animation-name: showEffect;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: ease-in;
    -webkit-animation-duration: 0.3s;

    animation-name: showEffect;
    animation-iteration-count: 1;
    animation-timing-function: ease-in;
    animation-duration: 0.3s;

}

.react-grid-Canvas {
  background-color: #fbf3e4 !important;
}

.widget-HeaderCell__value{
    width: auto;
    white-space: normal;
    word-wrap: normal;
    color: white;
    height: auto;
    font-size: 11px;
    padding: 1px;
}

@-moz-keyframes showEffect {
    from  {  opacity: 0; }
    to {  opacity: 1; }

}
@-webkit-keyframes showEffect {
    from  {  opacity: 0; }
    to {  opacity: 1; }
}
@keyframes showEffect {
    from  {  opacity: 0; }
    to {  opacity: 1; }
}

.btn_exportCsv {
  float: right;
  margin-top: 0.5%;
  margin-right: 1.5%;
  width:44px;
  height:44px;
  background-color: transparent;
  background-image: url("../img/icon_export.svg");
  border: none
}

.switch-grid-btn {
    margin-left: 7px;
    margin-top: 9px;
    float: left;
    background-color: rgba(1, 1, 1, 0.3);
    height: 59px;
    padding-top: 2px;
    border-radius: 4px;
    cursor: pointer;
    border: none;
}

.react-contextmenu {
  padding: 10px;
  background-color: rgba(36, 19, 8, 0.8);
  box-shadow: 1px 1px 5px rgba(36, 19, 8, 0.8);
  border-radius: 5px;
}

.react-contextmenu-item {
  padding: 10px;
  color: white;
  cursor: pointer;
  font-size: 1em;
  font-weight: bold;
}

.pull-right {
  display: contents;
}
