/********************************************************************
* Material Design Bootstarp4 Override Styles.
*/

/* Base colors */
/*
primary   #e79c37
secondary #3783e7
success   #83e737
danger    #e74337
warning   #dbe737
info      #37e79b
*/

/********************************************************************
* Grid System
*/

.wos .col-xs-1-5,
.wos .col-sm-1-5,
.wos .col-md-1-5,
.wos .col-lg-1-5,
.wos .col-xs-2-5,
.wos .col-sm-2-5,
.wos .col-md-2-5,
.wos .col-lg-2-5,
.wos .col-xs-3-5,
.wos .col-sm-3-5,
.wos .col-md-3-5,
.wos .col-lg-3-5,
.wos .col-xs-4-5,
.wos .col-sm-4-5,
.wos .col-md-4-5,
.wos .col-lg-4-5 {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}
.wos .col-xs-1-5 {
  max-width: 20%;
  float: left;
}
.wos .col-xs-2-5 {
  max-width: 40%;
  float: left;
}

.wos .col-xs-3-5 {
  max-width: 60%;
  float: left;
}

.wos .col-xs-4-5 {
  max-width: 80%;
  float: left;
}
@media (min-width: 768px) {
  .wos .col-sm-1-5 {
    max-width: 20%;
    float: left;
  }
  .wos .col-sm-2-5 {
    max-width: 50%;
    float: left;
  }
  .wos .col-sm-3-5 {
    max-width: 60%;
    float: left;
  }
  .wos .col-sm-4-5 {
    max-width: 80%;
    float: left;
  }
}
@media (min-width: 992px) {
  .wos .col-md-1-5 {
    max-width: 20%;
    float: left;
  }
  .wos .col-md-2-5 {
    max-width: 40%;
    float: left;
  }
  .wos .col-md-3-5 {
    max-width: 60%;
    float: left;
  }
  .wos .col-md-4-5 {
    max-width: 80%;
    float: left;
  }
  .wos .modal-lg.wide {
    max-width: 864px;
  }
}
@media (min-width: 1200px) {
  .wos .col-lg-1-5 {
    max-width: 20%;
    float: left;
  }
  .wos .col-lg-2-5 {
    max-width: 40%;
    float: left;
  }
  .wos .col-lg-3-5 {
    max-width: 60%;
    float: left;
  }
  .wos .col-lg-4-5 {
    max-width: 80%;
    float: left;
  }
}

/********************************************************************
* Text
*/

.wos .text-primary {
  color: #e79c37 !important;
}
.wos .text-secondary {
  color: #3783e7 !important;
}
.wos .text-success {
  color: #83e737 !important;
}
.wos .text-danger {
  color: #e74337 !important;
}
.wos .text-warning {
  color: #dbe737 !important;
}
.wos .text-info {
  color: #37e79b !important;
}

/********************************************************************
* A tag
*/
.wos a {
  /* color: #e79c37; */
}

/********************************************************************
* Background
*/

/* colors */
.wos .bg-primary {
  background-color: #e79c37 !important;
}
.wos .bg-secondary {
  background-color: #3783e7 !important;
}
.wos .bg-success {
  background-color: #83e737 !important;
}
.wos .bg-danger {
  background-color: #e74337 !important;
}
.wos .bg-warning {
  background-color: #dbe737 !important;
}
.wos .bg-info {
  background-color: #37e79b !important;
}

/********************************************************************
* Border
*/

/* widths */
.wos .border-1 {
  border-width: 1px !important;
}
.wos .border-2 {
  border-width: 2px !important;
}
.wos .border-3 {
  border-width: 3px !important;
}
.wos .border-4 {
  border-width: 4px !important;
}
.wos .border-5 {
  border-width: 5px !important;
}

/* colors */
.wos .border-primary {
  border-color: #e79c37 !important;
}
.wos .border-secondary {
  border-color: #3783e7 !important;
}
.wos .border-success {
  border-color: #83e737 !important;
}
.wos .border-danger {
  border-color: #e74337 !important;
}
.wos .border-warning {
  border-color: #dbe737 !important;
}
.wos .border-info {
  border-color: #37e79b !important;
}

/********************************************************************
* Table
*/

.wos .table th,
.wos .table td {
  font-size: 0.8rem;
  line-height: 0.8rem;
  min-height: 0.8rem;
}
.wos .table td {
  padding: 0.3rem 1em;
}

.wos .table .thead-light th,
.wos .table .tfoot-light td {
  color: #757575; /* .text-gray */
  background-color: #f5f5f5; /* .bg-lightwhite */
  border-color: #f5f5f5; /* .border-lightwhite */
}

/********************************************************************
* Modal
*/

.wos .modal-content .modal-header {
  padding: 1rem;
}

/* Table
*/
.wos nav ol.breadcrumb {
  font-size: 0.8rem;
}

.wos .btn-group-sm .header-icon {
  width: 2rem;
  min-width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}