/******************** sorting ******************/

 @media only screen  and (min-width: 1200px) {
.box,
.box-team{width:270px !important}
.box-1{width:570px !important}	 
	 
	 }




#options {
float:right;

}


.box-work{margin-left:30px}
#work_container{margin-left:-30px;
margin-bottom:12px}

.works li {margin:0 0 30px 30px }
.works li figure {margin:0}
.works  ul{margin:0}




#options .filter-open
{
background:url(../images/img-filter.png) no-repeat 0 0 #a63343;
height:50px;
width:50px;
display:block;
z-index:10
}


#options .filter-open:hover,
#options .filter-open:focus{
background-color:#000}

.filter{overflow:hidden;
z-index:5}
#options .filter-close
{
background:url(../images/img-filter.png) no-repeat 0 0 #000;
height:50px;
width:50px;
display:block;
}
#options .filter-close:hover,
#options .filter-close:focus
{background-color:#a63343}



#filters,
#portfolio-filter { 
	overflow:hidden;	
	margin:5px 0 0
}

#portfolio-filter{margin-bottom:18px}
#filters li,
#portfolio-filter li {
	float: left; 
	list-style:none;margin:5px 0 0 5px
}
#portfolio-filter li{margin: 0 5px 5px 0}


#filters li a,
#portfolio-filter li a{
font-size:13px;
line-height:18px;
color: #1b1b1b;
display:block;
padding:7px 22px;
text-decoration:none;
background:#f0f0f0;
  -webkit-border-radius:4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,0.15);
-moz-box-shadow: inset 0 0 4px rgba(0,0,0,0.15);
box-shadow: inset 0 0 4px rgba(0,0,0,0.15);
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

#filters li a.selected,#filters li a:hover,
#filters li.activeFilter a,
#portfolio-filter li.activeFilter a ,
#portfolio-filter li a:hover

{
	color: #fff;
	background:#1f97ff;
	text-decoration:none;
	-webkit-box-shadow: inset 0 0 4px rgba(0,0,0,0.5);
-moz-box-shadow: inset 0 0 4px rgba(0,0,0,0.5);
box-shadow: inset 0 0 4px rgba(0,0,0,0.5);
}




 @media only screen and (min-width: 980px) and (max-width: 1199px){
	.box{width:290px !important}
    .box-1{width:613px !important} 
	 
	 
	 }


 @media only screen and (min-width: 768px) and (max-width: 979px){
	.box{width:224px !important}
    .box-1{width:473px !important} 
	 #work_container{margin-left:-20px;
    }

 .works li {margin:0 0 20px 20px }
	 
	 }


 @media only screen  and (max-width: 979px) {
#work_container{margin-left:-20px}	
 
	#work_container .box-work {
    margin:0 0 20px 20px;
} 
	 
	 }
	 
 @media only screen  and (max-width: 768px) {
#options{float:none}
#filters{margin-bottom:20px}	 
#filters li{margin:5px 5px 0 0}	 
.works li {
    margin: 0 5px 10px;
}
#work_container.works{width:480px;margin:0 auto }
	.box{width:228px }
    .box-1{width:228px } 	 
	 }
	 
@media only screen  and (max-width: 490px) {		
	#work_container.works{width:280px; }
	.box,
	 .box-1{width:100% } 
	#work_container.works li {
    margin: 0 0 10px;
}		  
}