.controls {
display: inline-block;
width:100%;
margin: 0 0 30px;
vertical-align: top;
text-align:center;
}
.controls li {
margin-left: 20px;
cursor: pointer;
list-style-type: square;
display:inline-block;
}
hr { margin: 0 0 30px;
height: 0;
border: 0 none;
border-top: 1px solid #eee;
}
#Grid { margin:0;}
#Grid:after {
content: '';
display: inline-block;
width: 100%;
}
#Grid .mix {background:url("../images/camera-icon.png") 50% 0 no-repeat #ffa200; width:24.7%; float:left; margin:0 5px 5px 0; height:250px; overflow:hidden; vertical-align:top; box-sizing:border-box; position:relative; -webkit-transition:all 0.6s ease-in-out; -moz-transition:all 0.6s ease-in-out; -ms-transition:all 0.6s ease-in-out; -o-transition:all 0.6s ease-in-out; transition:all 0.6s ease-in-out;  list-style:none;}
#Grid .mix:hover { background-position:50% 55%}
#Grid .mix img { width:100%; height:auto; min-height:250px;}
#Grid .mix:hover img{ opacity:0.2;}
#Grid .mix a{ display:block;}
#Grid .mix {display: none;}
#Grid .mix strong{ position:absolute; width:100%; text-align:center; top:40%; color:#fff; opacity:1; display:none;}
#Grid .mix:hover strong{ display:block; z-index:9999;}
.controls li.active, .controls li:hover{ color:#ffa200;}
