
/*########################
* ■ Bootstrap button select:
* http://bootsnipp.com/snippets/GXagX
* ######################*/
.btn-select {
  position: relative;
  padding: 0;
  min-width: 120px;
  width: 100%;
  border-radius: 0;
  min-height: 28px;
  background-color: #fff;
  cursor: pointer;
}
.btn-select .btn-select-value {
  padding: 6px 12px;
  display: block;
  position: absolute;
  left: 0;
  right: 34px;
  text-align: left;
  text-overflow: ellipsis;
  overflow: hidden;
  border-top: none !important;
  border-bottom: none !important;
  border-left: none !important;
}
.btn-select .btn-select-arrow {
  float: right;
  line-height: 24px;
  padding: 6px 10px;
  top: 0;
}
.btn-select ul {
  display: none;
  background-color: #E4E4E4;
  color: black;
  clear: both;
  list-style: none;
  padding: 0;
  margin: 0;
  border-top: none !important;
  position: absolute;
  left: -1px;
  right: -1px;
  top: 37px;
  z-index: 9999;
}
.btn-select ul li {
  padding: 3px 6px;
  text-align: left;
}
.btn-select ul li:hover {
  background-color: #f4f4f4;
}
.btn-select ul li.selected {
  color: #E4E4E4;
}

/*########################
* ■ Button select default coloring
* ######################*/
.btn-select,
.btn-select:hover, 
.btn-select:active, 
.btn-select.active {
  border-color: black;
}
.btn-select .btn-select-value {
  border-color: black;
  color: #2C2B2B;
}
.btn-select .btn-select-value:hover {
}
.btn-select .btn-select-arrow {
  border-left: black 1px solid;  
  color: #2C2B2B;
}
.btn-select .btn-select-arrow:hover,
.btn-select .btn-select-arrow:focus,
.btn-select .btn-select-arrow:active,
.btn-select .btn-select-arrow.active {
}
.btn-select ul {
  border: 1px solid #222222;  
  background-color: #fff;
  color: #2C2B2B;
}
.btn-select ul li:hover {
  background-color: #E4E4E4;
  color: #2C2B2B;
}
.btn-select ul li.selected {
  background-color: #E4E4E4;
  color: #2C2B2B;
}

/*########################
* ■ .sel-red
* Button select color red
* ######################*/
.btn-select.sel-red,
.btn-select.sel-red:hover, 
.btn-select.sel-red:active, 
.btn-select.sel-red.active,
.btn-select.sel-red .btn-select-value,
.btn-select.sel-red .btn-select-arrow,
.btn-select.sel-red ul {
  border-color: #C81616;
}
.btn-select.sel-red .btn-select-arrow:hover,
.btn-select.sel-red:active .btn-select-arrow,
.btn-select.sel-red.active .btn-select-arrow {
  color: #C81616;
}

/*########################
* ■ .sel-drk-red
* Button select color dark red
* ######################*/
.btn-select.sel-drk-red,
.btn-select.sel-drk-red:hover, 
.btn-select.sel-drk-red:active, 
.btn-select.sel-drk-red.active,
.btn-select.sel-drk-red .btn-select-value,
.btn-select.sel-drk-red .btn-select-arrow,
.btn-select.sel-drk-red ul {
  border-color: #6D0C0C;
}

/*########################
* ■ .sel-blue
* Button select color blue
* ######################*/
.btn-select.sel-blue,
.btn-select.sel-blue:hover, 
.btn-select.sel-blue:active, 
.btn-select.sel-blue.active,
.btn-select.sel-blue .btn-select-value,
.btn-select.sel-blue .btn-select-arrow,
.btn-select.sel-blue ul {
  border-color: #16B5C8;
}
.btn-select.sel-blue .btn-select-arrow:hover,
.btn-select.sel-blue:active .btn-select-arrow,
.btn-select.sel-blue.active .btn-select-arrow {
  color: #16B5C8;
}

/*########################
* ■ .sel-drk-blue
* Button select color dark blue
* ######################*/
.btn-select.sel-drk-blue,
.btn-select.sel-drk-blue:hover, 
.btn-select.sel-drk-blue:active, 
.btn-select.sel-drk-blue.active,
.btn-select.sel-drk-blue .btn-select-value,
.btn-select.sel-drk-blue .btn-select-arrow, 
.btn-select.sel-drk-blue ul {
  border-color: #0C636D;
}

/*########################
* ■ .sel-green
* Button select color green
* ######################*/
.btn-select.sel-green,
.btn-select.sel-green:hover, 
.btn-select.sel-green:active, 
.btn-select.sel-green.active,
.btn-select.sel-green .btn-select-value,
.btn-select.sel-green .btn-select-arrow,
.btn-select.sel-green ul {
  border-color: #3AC816;
}
.btn-select.sel-green .btn-select-arrow:hover,
.btn-select.sel-green:active .btn-select-arrow,
.btn-select.sel-green.active .btn-select-arrow {
  color: #3AC816;
}

/*########################
* ■ .sel-drk-green
* Button select color dark green
* ######################*/
.btn-select.sel-drk-green,
.btn-select.sel-drk-green:hover, 
.btn-select.sel-drk-green:active, 
.btn-select.sel-drk-green.active,
.btn-select.sel-drk-green .btn-select-value,
.btn-select.sel-drk-green .btn-select-arrow, 
.btn-select.sel-drk-green ul {
  border-color: #206D0C;
}

/*########################
* ■ .sel-yellow
* Button select color yellow
* ######################*/
.btn-select.sel-yellow,
.btn-select.sel-yellow:hover, 
.btn-select.sel-yellow:active, 
.btn-select.sel-yellow.active,
.btn-select.sel-yellow .btn-select-value,
.btn-select.sel-yellow .btn-select-arrow,
.btn-select.sel-yellow ul {
  border-color: #C8BF16;
}
.btn-select.sel-yellow .btn-select-arrow:hover,
.btn-select.sel-yellow:active .btn-select-arrow,
.btn-select.sel-yellow.active .btn-select-arrow {
  color: #C8BF16;
}

/*########################
* ■ .sel-drk-yellow
* Button select color dark yellow
* ######################*/
.btn-select.sel-drk-yellow,
.btn-select.sel-drk-yellow:hover, 
.btn-select.sel-drk-yellow:active, 
.btn-select.sel-drk-yellow.active,
.btn-select.sel-drk-yellow .btn-select-value,
.btn-select.sel-drk-yellow .btn-select-arrow, 
.btn-select.sel-drk-yellow ul {
  border-color: #6D680C;
}

/*########################
* ■ Dekcheck checkbox css
* ######################*/
.dekcheckbox ul {
  list-style-type: none;
  padding: 0px;
  text-align: left;
  float: left !important;
}
.dekcheckbox ul li i,
.dekcheckbox ul li span {
  cursor: pointer;
}
.dekcheckbox ul li i {
  width: 18px;
}
.dekcheckbox ul li:hover i {
}

.container.inline {
  text-align: center;
}
.dekcheckbox.inline {
  display: inline-block;
  text-align: left;
}
.dekcheckbox.inline ul li {
  padding: 10px;
  padding-bottom: 0px;
  display: inline;
  position: relative;
  float: left;
  margin: 0 auto;
}

/*########################
* ■ Checkbox color variants
* ######################*/
.dekcheckbox.check-red ul li:hover i        { color: #C81616; }
.dekcheckbox.check-drk-red ul li:hover i    { color: #6D0C0C; }
.dekcheckbox.check-blue ul li:hover i,
.dekcheckbox.check-blue ul li.checked i     { color: #16B5C8; }

.dekcheckbox.check-drk-blue ul li:hover i   { color: #0C636D; }
.dekcheckbox.check-green ul li:hover i      { color: #3AC816; }
.dekcheckbox.check-drk-green ul li:hover i  { color: #206D0C; }
.dekcheckbox.check-yellow ul li:hover i     { color: #C8BF16; }
.dekcheckbox.check-drk-yellow ul li:hover i { color: #6D680C; }
