/* ===== Iconos SVG (reemplazo de Font Awesome) ===== */

/* Base: el icono ocupa 1em del tamaño de fuente del contenedor y hereda su
   color (currentColor). El margen derecho replica el antiguo `.fa`. */
.rburgos-icon {
	display: inline-block;
	width: 1em;
	height: 1em;
	vertical-align: -0.125em;
	fill: currentColor;
	margin-right: 5px;
}

/* Blog: metadatos (fecha, autor, categoría, etiquetas, comentarios).
   Replica `.metadata ul li i` del tema padre. */
.metadata ul li .rburgos-icon {
	margin-right: 0.35714286em;
	font-size: 14px;
	text-align: center;
	color: #9e9e9e;
}

/* Blog: flecha "leer más" que aparece sobre la miniatura al hacer hover.
   Replica `.ql_thumbnail_hover > span > i` del tema padre. */
.ql_thumbnail_hover > span > .rburgos-icon {
	-webkit-transition: all 200ms ease-in-out;
	-o-transition: all 200ms ease-in-out;
	transition: all 200ms ease-in-out;
	color: #4d4d4d;
	font-size: 3em;
	position: absolute;
	text-align: center;
	top: 50%;
	left: 50%;
	margin-top: -1.5em;
	margin-left: -1.5em;
	margin-right: 0;
	line-height: 3em;
	opacity: 0;
	filter: alpha(opacity=0);
	-webkit-transform: scale(0);
	-ms-transform: scale(0);
	-o-transform: scale(0);
	transform: scale(0);
	display: block;
}

.ql_thumbnail_hover:hover > span > .rburgos-icon {
	opacity: 100;
	filter: alpha(opacity=10000);
	-webkit-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
}

/* Comentarios: iconos dentro de los campos del formulario.
   Replica `#respond .controls-wrap i` del tema padre. */
#respond .controls-wrap .rburgos-icon {
	position: absolute;
	left: 0.71428571em;
	top: 0.71428571em;
	margin-right: 0;
	color: #c4c4c4;
	font-size: 14px;
}