#SandBox  ul{
margin: 0 0 10px 0px;
}
.wf{
-webkit-transform: translate3d(0,0,0);
-webkit-backface-visibility: hidden;
-webkit-font-smoothing: antialiased;
}
.ns{
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.break{
width: 100%;
height: 0;
margin: 0;
} .anim150{
-webkit-transition: all 150ms ease-in-out;
-moz-transition: all 150ms ease-in-out;
-ms-transition: all 150ms ease-in-out;
-o-transition: all 150ms ease-in-out;	
transition: all 150ms ease-in-out;
}
.ease150{
-webkit-transition: all 200ms ease-in-out;
-webkit-transition: all 200ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
-moz-transition: all 200ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
-ms-transition: all 200ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
-o-transition: all 200ms cubic-bezier(0.175, 0.885, 0.320, 1.275);	
transition: all 200ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
}
.anim300{
-webkit-transition: all 350ms ease-in-out;
-moz-transition: all 350ms ease-in-out;
-ms-transition: all 350ms ease-in-out;
-o-transition: all 350ms ease-in-out;	
transition: all 350ms ease-in-out;
}
.anim500{
-webkit-transition: all 500ms ease-in-out;
-moz-transition: all 500ms ease-in-out;
-ms-transition: all 500ms ease-in-out;
-o-transition: all 500ms ease-in-out;	
transition: all 500ms ease-in-out;
} @-webkit-keyframes spin {
from {
-webkit-transform:rotate(0deg);
}
to {
-webkit-transform:rotate(360deg);
}
}
@-moz-keyframes spin {
from {
-moz-transform:rotate(0deg);
}
to {
-moz-transform:rotate(360deg);
}
}
@-o-keyframes spin {
from {
-o-transform:rotate(0deg);
}
to {
-o-transform:rotate(360deg);
}
}
@keyframes spin {
from {
transform:rotate(0deg);
}
to {
transform:rotate(360deg);
}
}
@-webkit-keyframes nod{
0% { -webkit-transform: translate(0, 0px); }
50% { -webkit-transform: translate(0, 5px); }
100% { -webkit-transform: translate(0, 0px); }
}
@-moz-keyframes nod{
0% { -moz-transform: translate(0, 0px); }
50% { -moz-transform: translate(0, 5px); }
100% { -moz-transform: translate(0, 0px); }
}
@-o-keyframes nod{
0% { -o-transform: translate(0, 0px); }
50% { -o-transform: translate(0, 5px); }
100% { -o-transform: translate(0, 0px); }
}
@keyframes nod{
0% { transform: translate(0, 0px); }
50% { transform: translate(0, 5px); }
100% { transform: translate(0, 0px); }
}
@-webkit-keyframes cssSpinnerRight{
0% {-webkit-transform:rotate(0deg)}
20% {-webkit-transform:rotate(90deg)}
25% {-webkit-transform:rotate(180deg)}
50% {-webkit-transform:rotate(180deg)}
70% {-webkit-transform:rotate(270deg)}
75% {-webkit-transform:rotate(360deg)}
100% {-webkit-transform:rotate(360deg)}
}
@-webkit-keyframes cssSpinnerLeft{
0% {-webkit-transform:rotate(0deg)}
25% {-webkit-transform:rotate(0deg)}
35% {-webkit-transform:rotate(90deg)}
50% {-webkit-transform:rotate(180deg)}
75% {-webkit-transform:rotate(180deg)}
80% {-webkit-transform:rotate(270deg)}
100% {-webkit-transform:rotate(360deg)}
}
@-moz-keyframes cssSpinnerRight{
0% {-moz-transform:rotate(0deg)}
20% {-moz-transform:rotate(90deg)}
25% {-moz-transform:rotate(180deg)}
50% {-moz-transform:rotate(180deg)}
70% {-moz-transform:rotate(270deg)}
75% {-moz-transform:rotate(360deg)}
100% {-moz-transform:rotate(360deg)}
}
@-moz-keyframes cssSpinnerLeft{
0% {-moz-transform:rotate(0deg)}
25% {-moz-transform:rotate(0deg)}
35% {-moz-transform:rotate(90deg)}
50% {-moz-transform:rotate(180deg)}
75% {-moz-transform:rotate(180deg)}
80% {-moz-transform:rotate(270deg)}
100% {-moz-transform:rotate(360deg)}
}
@-o-keyframes cssSpinnerRight{
0% {-o-transform:rotate(0deg)}
20% {-o-transform:rotate(90deg)}
25% {-o-transform:rotate(180deg)}
50% {-o-transform:rotate(180deg)}
70% {-o-transform:rotate(270deg)}
75% {-o-transform:rotate(360deg)}
100% {-o-transform:rotate(360deg)}
}
@-o-keyframes cssSpinnerLeft{
0% {-o-transform:rotate(0deg)}
25% {-o-transform:rotate(0deg)}
35% {-o-transform:rotate(90deg)}
50% {-o-transform:rotate(180deg)}
75% {-o-transform:rotate(180deg)}
80% {-o-transform:rotate(270deg)}
100% {-o-transform:rotate(360deg)}
}
@keyframes cssSpinnerRight{
0% {transform:rotate(0deg)}
20% {transform:rotate(90deg)}
25% {transform:rotate(180deg)}
50% {transform:rotate(180deg)}
70% {transform:rotate(270deg)}
75% {transform:rotate(360deg)}
100% {transform:rotate(360deg)}
}
@keyframes cssSpinnerLeft{
0% {transform:rotate(0deg)}
25% {transform:rotate(0deg)}
35% {transform:rotate(90deg)}
50% {transform:rotate(180deg)}
75% {transform:rotate(180deg)}
80% {transform:rotate(270deg)}
100% {transform:rotate(360deg)}
} ul.navigation_filter{
display:block;
float:left;
padding-top:18px;
padding-bottom:18px;
width:100%;
margin-bottom:20px;
text-align:center;
}
ul.navigation_filter li{
display:inline-block;
margin-left:15px;
margin-right:15px;
}
ul.navigation_filter li span{
display: block;
font-size: 14px;
font-weight: 400;
line-height: 20px;
padding-left: 0;
padding-right: 18px;
position: relative;
text-transform: none;
transition: none 0s ease 0s;	cursor:pointer;
color:#242424;
text-transform:uppercase;
display:block;
line-height:40px;
padding-left:20px;
padding-right:20px;
background:none;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
-o-border-radius: 20px;
border-radius: 20px;
}
ul.navigation_filter li.all span{
background:#eaeaea !important;
color:#242424 !important;
}
ul.navigation_filter li.recent span{
background:#00aff0;
color:#fff;
}
ul.navigation_filter li.active span,
ul.navigation_filter li span:hover{
background:#00aff0;
color:#fff;
} #SandBox nav{
text-align: justify;
width:100%;
height:auto;
min-height:100px;
}
#SandBox .button.active:not(.slider){
background: #161616;
color: #aedf16;
-webkit-box-shadow: 0 0 8px rgba(255,255,255,.1);
-moz-box-shadow: 0 0 8px rgba(255,255,255,.1);
-ms-box-shadow: 0 0 8px rgba(255,255,255,.1);
-o-box-shadow: 0 0 8px rgba(255,255,255,.1);
box-shadow: 0 0 8px rgba(255,255,255,.1);
}
#SandBox .slide{
position: relative;
background: #000;
height: 4px;
top: -3px;
width: 56%;
margin-left: 7%;
border-bottom: 1px solid #222;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
-ms-border-radius: 2px;
-o-border-radius: 2px;
border-radius: 2px;	
}
@media screen and (max-width: 900px){
#SandBox .slide{
width: 80%;
margin: 0;
}
#SandBox .slider span{
display: none;
}
}
#SandBox .arrow span{
position: relative;
} #SandBox{
padding: 10px 0 20px 0;
overflow: visible;
height:auto;
clear:both;
}
#SandBox ul{
list-style-type: none;
font-size: 0.1px;
line-height: 0;
}
#SandBox .mix, #SandBox .gap{
width: 33.333%;
height:auto;
-webkit-transition: max-width 500ms ease-in-out, height 500ms ease-in-out;
-moz-transition: max-width 500ms ease-in-out, height 500ms ease-in-out;
-ms-transition: max-width 500ms ease-in-out, height 500ms ease-in-out;
-o-transition: max-width 500ms ease-in-out, height 500ms ease-in-out;
transition: max-width 500ms ease-in-out, height 500ms ease-in-out;
} #SandBox .gap{
display: inline-block;
margin-bottom: 0;
}
#SandBox .mix .content{
position: relative;
padding-top: 0%;
height:auto;
overflow: hidden;
background: #1e1e1e;
box-shadow: 0 0 8px rgba(0,0,0,0.3);
-moz-box-shadow: 0 0 8px rgba(0,0,0,0.3);
-webkit-box-shadow: 0 0 8px rgba(0,0,0,0.3);
-o-box-shadow: 0 0 8px rgba(0,0,0,0.3);
} #SandBox .mix .img_wrapper{
height:auto;
width: 100%;
opacity: 1;
background-color: rgba(0,0,0,.3);
background-repeat: no-repeat;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;
-webkit-background-size: auto 100%;
-moz-background-size: auto 100% !important;
-ms-background-size: auto 100%;
-o-background-size: auto 100%;
background-size: auto 100%;
}
#SandBox .mix .img_wrapper.loaded{
opacity: 1;
}
#SandBox .mix .img_wrapper a{
height: auto;
width: 100%;
cursor: pointer;
display:block;
}
#SandBox .mix img{
height: auto;
width: 100%;
}
#SandBox .mix img:hover{
opacity:0.5;
} #fixgallery li{	float:left;	width:33.33333%;	padding-left:15px;	padding-right:15px;	box-sizing: border-box;
margin-bottom: 25px;}
#fixgallery li .content{
position:relative;
}
#fixgallery li .content .hover-portfolio{
display:none;
width:100%;
height:100%;
background:rgba(255,255,255,0.9);
position:absolute;
left:0;
top:0;
padding-top: 10%;
}
.link-porfolio{
display:block;
width:100%;
height:100%;
}
#fixgallery li .content:hover .hover-portfolio{
display:block;
}
#fixgallery li .content .hover-portfolio img{
width:50px;
height:50px;
margin-left:auto;
margin-right:auto;
}
#fixgallery li .content .hover-portfolio h5{
text-align:center;
font-size:14px;
color:#686868;
line-height:26px;
text-transform:uppercase;
}
#fixgallery li .content .hover-portfolio h2{
text-align:center;
font-size:24px;
font-weight:bold;
color:#242424;
line-height:36px;
text-transform:uppercase;
}
@media screen and (max-width: 991px){
#SandBox .mix, #SandBox .gap{
width:50%;
}
ul.navigation_filter li{
margin-left:2px;
margin-right:2px;
}
ul.navigation_filter li span{
padding-left:10px;
padding-right:10px;
}
}
@media screen and (max-width: 767px){
ul.navigation_filter li{
margin-left:10px;
margin-right:10px;
margin-bottom:15px;
}
ul.navigation_filter li span{
padding-left:15px;
padding-right:15px;
}
}
@media screen and (max-width: 640px){
#SandBox .mix, #SandBox .gap{
width:90%;
margin-left:5%;
}
}
@media screen and (max-width: 479px){
#SandBox .mix, #SandBox .gap{
width:100%;
margin-left:0;
}
}