@media only screen and (max-width: 1024px) {
	
	#wrapper
	{
		max-width:950px;
	}
	
	
	#contentholder
	{
		max-width:800px;
	}
	
	.resimg
	{
		width:100%;
		height:auto;
	}

}

@media only screen and (max-width: 768px) {
	
	#wrapper
	{
		width:98%;
	}
	
	
	#banner #brandplan,#banner #motivational{
		left:0;
	}
	
	#banner-2 #corporate, #banner-2 #onsitebranding{
		left:0;
		top:0;
	}
	
	#contentholder
	{
		width:98%;
/*		margin-left:25%;*/
		padding:0;
	}
	
	#leftbar, #rightbar
	{
		clear:both;
		display:block;
		float:none;
		width:100%;
	}
	
	
	.work-text
	{
		position: relative;top:0;left:0;
	}
	
	#nav
	{
	width:20%;
	display:none;
	
	}
	
	#mobilenav
	{
		display:block;
	}
	
	#nav #logo
	{
		width:100%;

		padding:0;
	}
	
	#nav #logo img
	{
		width:100%;
		height:auto;
	}
	
	#nav #navigation a
	{
		padding:0;
	}
	
	.resimg
	{
		width:100%;
		height:auto;
	}
	
	.item img
{
	width:100%;
	height:auto;

}

    .item .overlay
	{
		display:block;
	}
	


               .item .text {
        font-size: 0.95em;
        padding: 10px;
        display:block;
			   }
			   
			   
#cleint{
width:100%;
display:block;
overflow:hidden;
clear:both;
padding-top:160px;
}
			   
			   			   
#cleint #cleintleft{
float:left;
padding-left:15px;
position:relative;
overflow:hidden;
display:block;
}

 #cleint #cleintright{
float:right;
width:30%;
line-height:2;
position:relative;
overflow:hidden;
display:block;
}
}


@media only screen and (max-width: 480px) {
	
	#wrapper
	{
		width:98%;
	}
	
	
	#contentholder
	{
		width:100%;
		margin:0;
		padding:0;
	}
	
	#nav
	{
		display:none;
	}
	
	.social
	{
		display:none;
	}
	
	
	#mobilenav
	{
		display:block;
	}
	
	.resimg
	{
		width:100%;
		height:auto;
	}
	
	.item .overlay
	{
		display:none;
		background-color:#fff;
	
	}
	
    		

.i2{width:100% !important; }

   .item .overlay {
        display: block;
		position:static;
   }

.item::after { 
    content: " ";
	clear:both;
}


.item .myoverlay ,   .item .myoverlay .text {
	   display:block;
   }




cleint #cleintleft{
float:left;
padding-left:15px;
position:relative;
overflow:hidden;
display:block;
}

#cleint #cleintright{
float:right;
width:30%;
line-height:2;
position:relative;
overflow:hidden;
display:block;
}

#cleint{
width:100%;
display:block;
overflow:hidden;
clear:both;
padding-top:160px;
}
}

@media only screen and (max-width: 320px) {

    .item .overlay {
        display: block;
		position:static;
    }


        .item.w2 {
            width: 100%;
            height: auto;
            margin: 0 0 2% 0;
        }

        .item.w3 {
            width: 100%;
            height: auto;
            margin: 0 0 2% 0;
        }

        .item img {
            width: 100%;
            height: auto;
        }


}