/* Propiedades necesarias para el funcionamiento del Grid */

*, *:after, *:before { 
	box-sizing: border-box; 
}

[class*='col-'] {float: left;}

article, aside, figure, footer, header, nav, section {
	&:after {content: ""; display: table; clear: both;}
}

img, audio, video {
	max-width: 100%;
}


/* Columnas */

.col-1 {width: 100%;}
.col-3-4 {width: 75%;}
.col-2-3 {width: 66.66%;}
.col-1-2 {width: 50%;}
.col-1-3 {width: 33.33%;}
.col-1-4 {width: 25%;}
.col-1-5 {width: 20%;}
.col-1-6 {width: 16.66%;}
.col-1-8 {width: 12.5%;}
.col-1-10 {width: 10%;}


/* Wrapper en caso de que sea necesario, podemos modificar su ancho */

.wrapper {
    max-width: 1000px;
    margin: 0 auto;
}


/* Clases necesarias para vídeos de Youtube */

.video-wrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
}


.video-wrapper iframe {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    width: 100%; height: 100%;
}


/* Propiedades para el muro de Facebook */

#fbcomments, 
.fb-comments, 
.fb-comments iframe[style], 
.fb-comments span {
	width: 100% !important;
}