@charset "UTF-8";
/* CSS Document */


.masonary
{
    max-width: 60em; /* 960 px */
    margin: 0px 0px 50px 0px;
}


		
		
.list
{
    width: 100%;
    overflow: hidden;
    margin-bottom: -1.875em; /* 30px */	
}
    
	
	.item img {
		width:100%;
		/*max-width:300px;*/
	}
	.item p {
		margin: 5px;
	}
 
 
 
 .col-3-wrap {
 	width:100%;
	margin:20px 0px 10px 0px;
 }
 
 .col-3-1 {
	 width:30%;
	 float:left;
	 margin-right:1%;
 }
 .col-3-2 {	 
	 width:30%;
	 float:left;
	 margin-right:1%;
 }
 .col-3-3 {
	 width:30%;
	 float:left;
	 margin-right:1%;
 }
 
 .item {
 	width:100%;
	clear:left;
	border:1px solid #999;
	margin:5px 0px 5px 0px;
 }
 
 @media only screen and ( max-width: 40em ){ /* 640px */
	 .list
{
    width: 100%;
    overflow: hidden;
    margin-bottom: -1.875em; /* 30px */	
}
    
	
	.item img {
		width:100%;
		/*max-width:300px;*/
	}
	.item p {
		margin: 5px;
	}
 
 
 
 .col-3-wrap {
 	width:100%;
	margin:20px 0px 10px 0px;
 }
 
 .col-3-1 {
	  width:100%;
	 clear:left;
 }
 .col-3-2 {	 
	  width:100%;
	 clear:left;
 }
 .col-3-3 {
	 width:100%;
	 clear:left;
 }
 
 .item {
 	width:100%;
	clear:left;
	border:1px solid #999;
	margin:5px 0px 5px 0px;
 }
 }