.mix-filter{list-style:none;margin:0 0 20px;padding:0;}

.mix-filter li{color:#000;cursor:pointer;padding:6px 15px;margin-right:2px;margin-bottom:5px;background:none;display:block}

.mix-filter li.active,.mix-filter li:hover{color:#e6c172;background:#161b21;border-radius:0px!important;-moz-border-radius:0px!important;-webkit-border-radius:0px!important;-o-border-radius:0px!important}
.mix-grid .mix{opacity:0;display:none;position:relative;overflow:hidden;margin-bottom:15px}
.mix-grid .mix .mix-inner{position:relative;width:100%}
.mix-grid .mix .mix-details{color:#fff;width:100%;height:100%;bottom:-100%;text-align:center;position:absolute;background:rgba(22,27,33,.7);transition:all .5s ease;-o-transition:all .5s ease;-ms-transition:all .5s ease;-moz-transition:all .5s ease;-webkit-transition:all .5s ease}
.mix-grid .mix:hover .mix-details{bottom:0;transition:all .5s ease;-o-transition:all .5s ease;-ms-transition:all .5s ease;-moz-transition:all .5s ease;-webkit-transition:all .5s ease}
.mix-grid .mix .mix-details h4{color:#fff;margin-top:50px;padding:0 10px}
.mix-grid .mix .mix-details p{padding:0 30px}
.mix-grid .mix .mix-details i{color:#fff;font-size:14px}
.mix-grid .mix a.mix-link,
.mix-grid .mix a.mix-preview{color:#555;display:inline-block;cursor:pointer;margin-top:10px;padding:10px 15px;background:#e6c172}
.mix-grid .mix a.mix-link{right:50%;margin-right:5px}
.mix-grid .mix a.mix-link:hover,
.mix-grid .mix a.mix-preview:hover{color:#fff;padding:9px 14px;text-decoration:none;border:1px solid #eee}
/*@media (min-width:992px){.mix-grid .mix.col-md-6.col-sm-6 .mix-details{height:100%}}*/
@media (min-width:768px) and (max-width:991px){.mix-grid .mix a.mix-link,.mix-grid .mix a.mix-preview{margin-top:5px}}