.filters {
	
}

.filters .filterContainer {
    width: 100px;
    text-align: center;
    margin-right: 4px;
    display: inline-block;
    cursor: pointer;
    padding-left: 20px;
}


.filters .filterContainer {    
    background-color: black;
}

.filters .filterContainer.active.blue {    
    background-color: #19a5de;
}



.filters .filterContainer.blue {    
    /*background-color: #76c2e1;*/
    background-color: #80a6b6;
}

.filters .filterContainer.active.red {    
    background-color: #db485b;
}

.filters .filterContainer.red {    
    background-color: #d8949f;
}

.filters .filterContainer.active.green {    
    background-color: #65cc0d;
}

.filters .filterContainer.green {    
    background-color: #9cd678;
}

.filters .filterContainer.active.purple {    
    background-color: #b400c3;
}

.filters .filterContainer.purple {    
    background-color: #c470d3;
}

.filters .filterContainer.active .filter {
	background-color: white;
	color: #666666;
}

.filters .filterContainer .filter {
	background-color: white;
	color: #9da3a5;
	font-size: 14px;
	-webkit-user-select: none; /* Chrome/Safari */        
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+ */

	/* Rules below not implemented in browsers yet */
	-o-user-select: none;
	user-select: none;
}

.filters .filterContainer.active .filter {
	background-color: white;
}

 


.filters ul.bg-radio-button {
  list-style: none;
  margin: 0;
  padding: 0;
    overflow: auto;
}

.filters ul.bg-radio-button li{
  color: #9da3a5 !important;
  display: inline-block;
  position: relative;
}

.filters ul.bg-radio-button li input[type=radio]{
  position: absolute;
  visibility: hidden;
}

.filters ul.bg-radio-button li label{
  display: block;
  position: relative;
  padding: 0 25px 0 50px;
  margin: 10px auto;
  height: 30px;
  z-index: 9;
  cursor: pointer;
  font-size: 16px;
    margin-top: 7px;
    font-weight: 300;
  -webkit-transition: all 0.25s linear;
}

.filters ul.bg-radio-button li:hover label{
    color: #19a5de;
}

.filters ul.bg-radio-button li .check{
  display: block;
  position: absolute;
  border: 2px solid #9da3a5;
  height: 25px;
  width: 25px;
    top: 5px;
  left: 20px;
    z-index: 5;
    transition: border .25s linear;
    -webkit-transition: border .25s linear;
}

.filters ul.bg-radio-button li:hover .check {
  border: 2px solid #19a5de;
}

.filters ul.bg-radio-button li .check::before {
  display: block;
  position: absolute;
    content: '';
  height: 15px;
  width: 15px;
  top: 3px;
    left: 3px;
  margin: auto;
    transition: background 0.25s linear;
    -webkit-transition: background 0.25s linear;
}

.filters .bg-radio-button input[type=radio]:checked ~ .check {
  border: 2px solid #19a5de;
}

.filters .bg-radio-button input[type=radio]:checked ~ .check::before{
  background: #19a5de;
}

.filters .bg-radio-button input[type=radio]:checked ~ label{
  color: #19a5de;
}
