/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Mar 2, 2016, 8:38:17 AM
    Author     : alberto
*/
@media only screen and (max-width: 800px) {
	/* show related posts */
	#related-posts-box {
		display: block!important;
		clear: both!important;
	}

	#related-posts-box .box-header { margin-bottom: 8px; }

	#related-posts-box a:hover h4 { text-decoration: none!important; color: #2AABE4!important; }
	#related-posts-box a:visited h4 { text-decoration: none!important; }

	#related-posts-box h4 { font-size: 13px; overflow: hidden; white-space: wrap; text-overflow: ellipsis; margin-top: 10px; padding-bottom: 0px!important; }
	
	.thumb-related-posts { 
		height: 100px;
		overflow: hidden;
		-webkit-transition: height 1s;
		-moz-transition: height 1s;
		transition: height 1s;
	}

	/*  SECTIONS  */
	.section {
		clear: both;
		padding: 0px;
		margin: 0px;
	}

	/*  COLUMN SETUP  */
	.col {
		display: block;
		float:left;
		margin: 1% 0 1% 1.6%;
	}
	.col:first-child { margin-left: 0; }

	/*  GROUPING  */
	.group:before,
	.group:after { content:""; display:table; }
	.group:after { clear:both;}
	.group { zoom:1; /* For IE 6/7 */ }
	/*  GRID OF THREE  */
	.span_3_of_3 { width: 100%; }
	.span_2_of_3 { width: 66.13%; }
	.span_1_of_3 { width: 32.26%; }
}

@media only screen and (max-width: 560px) {
	.thumb-related-posts { 
		height: 80px;
	}		
}

@media only screen and (max-width: 460px) {
	.thumb-related-posts { 
		height: 60px;
	}		
	#related-posts-box h4 { font-size: 11px; }
}

@media only screen and (max-width: 360px) {
	.thumb-related-posts { 
		height: 40px;
	}		
}