/**
 * Estilos para aplicar en el blog
 */



.blog-post{
	padding-bottom: 40px;
	border-bottom: 1px dotted #CCC;
	margin-bottom: 40px;
	float: none;
	clear: both;
}

	/**
	 * 	Encabezado del post
	 */
	.blog-post header{
		min-height: 42px;
		margin-bottom: 20px;
	}
		.blog-post i.blog-post-icon{
			background-repeat: no-repeat;
			background-position: top left;
			display: inline-block;
			width: 42px;
			height: 42px;
			background: #CCC;
			float: left;
			margin-right: 20px;
		}
	
		.blog-post-type-video i.blog-post-icon{
			background-image: url("../assets/img/blog-icon-video.png");
		}
		.blog-post-type-note i.blog-post-icon{
			background-image: url("../assets/img/blog-icon-note.png");
		}
		.blog-post-type-image i.blog-post-icon{
			background-image: url("../assets/img/blog-icon-image.png");
		}
	
	
		.blog-post:hover i.blog-post-icon{
			background-color: #0093BD;
		}
	
	
		.blog-post header .blog-post-title{
			font-size: 20px;
			line-height: 26px;
			margin: 0;
			color: #0093BD;
			text-transform: uppercase;
		}
			.blog-post header .blog-post-title a{
				text-decoration: none;
				color: #0093BD;
			}


		.blog-post header .blog-post-meta{
			font-size: 12px;
			height: 16px;
			line-height: 16px;
			margin: 0;
		}




	/**
	 * 	Parte del contenido del post
	 */
	.blog-post-content{		
	}
		/* Wrapper para la imágen */
		.blog-post-content-image{
			border: 1px solid #CCC;
			position: relative;
		}
			.blog-post-content-image img{
				width: 100%;
				height: auto;
			}
			/* Cuándo hay una imágen, ponemos el extract como texto en la imágen */
			.blog-post-content-image .blog-post-content-extract{
				position: absolute;
				left: 0px;
				bottom: 0px;
				padding: 20px;
				width: 100%;
				color: #FFF;
				background: rgba(0,0,0,.8);
				box-sizing: border-box;
				-moz-box-sizing: border-box;
			}
			

		/* El wrapper en "standlone" */
		.blog-post-content-extract{
			font-size: 120%;
			line-height: 140%;
			font-weight: bold;
		}


		/** Wrapper para hacer responsive los videos **/
		.blog-post-content-video {
			position: relative;
			padding-bottom: 56.25%; /* 16:9 */
			padding-top: 25px;
			height: 0;
		}
			.blog-post-content-video iframe {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
			}