/*
Theme Name: Globals - Material and Bootstrap HTML template
Module : Health/Medical
Description: filter custom styles are defined in this class
Author: Jyostna
Author URI: http://themeforest.net/user/jyostna
Version: 1.0 
-------------------------------------------- *//*
TABLE OF CONTENT
-------------------------------------------------
1- FILTER CUSTOM STYLES
---------------------------------------------- */

/*========================== FILTER CUSTOM STYLES =======================*/
.controls{
  padding: 2%;
  background: #00afdf;
  color: #eee;
}

.filter{
  padding-bottom:4px;
  margin-right: 14px;
}
.filter.active, .filter:hover{
  border-bottom:3px solid #fff;
  padding-bottom:7px;
    color:#fff;
    cursor: pointer;
}
.mixitup-nav-span:hover{
    border:none;
}
button + label{
  margin-left: 1em;
}

.filter-content:after{
  content: '';
  display: inline-block;
  width: 100%;
}

.filter-content .mix,
.filter-contentr .gap{
  display: inline-block;
  width: 49%;
}

.filter-content .mix{
  text-align: left;
  display: none;
}
.filter-content .mix:after{
  content: attr(data-myorder);
  color: white;
  font-size: 16px;
  vertical-align: top;
  font-weight: 700;
}

.filter-content .mix:before{
  content: '';
  display: inline-block;
}

@media all and (min-width: 420px){
  .filter-content .mix,
  .filter-content .gap{
    width: 32%;
  }
}

@media all and (min-width: 640px){
  .filter-content .mix,
  .filter-content .gap{
    width: 24.5%;
  }
}

/*========================== FILTER CUSTOM STYLES END =======================*/