estilos.css

/*@font-face {
    font-family: 'open_sansregular';
    src: url('fuentes/OpenSans-Regular-webfont.eot');
    src: url('fuentes/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fuentes/OpenSans-Regular-webfont.woff') format('woff'),
         url('fuentes/OpenSans-Regular-webfont.ttf') format('truetype'),
         url('fuentes/OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
*/
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700);

@font-face {
	font-family: 'puls4';
	src:url('fuentes/puls4.eot');
	src:url('fuentes/puls4.eot?#iefix') format('embedded-opentype'),
		url('fuentes/puls4.woff') format('woff'),
		url('fuentes/puls4.ttf') format('truetype'),
		url('fuentes/puls4.svg#puls4') format('svg');
	font-weight: normal;
	font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
	font-family: 'puls4';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icon-f-abajo:before {
	content: "\e603";
	color: #DD4F24;
}
.icon-f-arriba:before {
	content: "\e604";
	
}
.icon-estrella:before {
	content: "\e601";
	color: #FFBE2C;
	margin-right: .4em;
	position: relative;
	top: 0.1em;

}
.icon-lapiz:before {
	content: "\e602";
	margin-right: 0.8em;
}


a
{
	color: #22BCE0;
}
body
{
	background: #EEEEEE;
	font-family: "Open Sans";
	font-size: 16px;
}
footer
{
	color: rgba(255,255,255,0.7);
	background: #22BCE0;
	text-align: center;
	padding: 1em;
}
footer p:first-child
{
	margin-bottom: 0;
}
footer p:last-child
{
	margin-top: 0;
}
footer p:last-child:after
{
	content: " -";
}
footer p:last-child:before
{
	content: "- ";
}
header
{
	background: #343B54;
	color: white;
	overflow: hidden;
	padding: 0.5em;
	position: relative;
}
header figure
{
	float: left;
}
header h1
{
	font-size: 1.2em;
	font-weight: normal;
	margin: 0.2em 70px 0 0;
}
header #avatar
{
	margin: 0.5em 0.5em 0 0;
	position: absolute;
	right: 0;
	top: 0;
}
header #avatar img
{
	border-radius: 50%;
	width: 55px;
}
header #logo
{
	/*-webkit-transform:rotate(90deg);*/
	/*-moz-transform:rotate(90deg);
	-o-transform:rotate(90deg);
	-ms-transform:rotate(90deg);*/
	border-right: 1px solid white;
	margin-right: 0.5em;

}

header #logo img
{
	margin-right: 0.5em;
	padding-right: 0.5em;
	width: 52px;
	
}
header #logo img:hover{
	-webkit-transition:.5s;
	-webkit-transform:rotate(360deg);
}
nav
{
	background: #7488CD; /* #80BCA3 */
	box-shadow: rgba(0,0,0,0.5) 0px 0px 10px;
	padding: 0 6em 0 0;
	position: relative;
}
nav ul
{
	list-style: none;
	margin: 0;
	padding: 0;
}
nav ul #publicar_nav
{
	position: absolute;
	top: -0.3em;
	right: 0;
}
nav ul #publicar_nav a
{
	background: #22BCE0;
	border-radius: 5px;
	box-shadow: rgba(0,0,0,0.5) 5px 5px 20px;
	font-style: italic;
	padding: 0.8em 0.5em 0.8em 2.5em;
	text-decoration: none;
	text-shadow: rgba(0,0,0,0.5) 2px 2px 5px;
}
nav ul #publicar_nav a:before{
	position: absolute;
	left:.5em;
	top:.7em;
}
nav ul #publicar_nav a:hover:before{
	font-size: 20px;
	
}

nav ul li a:hover{
	background: #343B54;
}
nav ul li
{
	display: inline-block;
	margin: 0 1em 0 0;
}
nav ul li a
{
	color: white;
	display: block;
	padding: 0.5em;
	-webkit-transition:.3s;
}
aside{
	display: none;
}
#contenido
{
	margin: 1em;
}
#contenido .item
{
	background: white;
	border-bottom: 3px solid #22BCE0;
	margin-bottom: 3em; 
	min-height: 128px;
	position: relative;
}
#contenido .item .autor_item
{
	color: #AAA;
}
#contenido .item .datos_item
{
	margin: 1em 1em 0 0;
	text-align: right;
}
#contenido .item .datos_item .fecha_item
{
	color: #AAA;
}
#contenido .item .datos_item .tag_item
{
	background: #F4502A;
	border-radius: 0.5em;
	color: white;
	float: left;
	display: inline-block;
	padding: 0.2em 0.5em;
	text-decoration: none;
}
#contenido .item .imagen_item
{
	float: left;
	margin: 0 1em 0 0;
}
#contenido .item .imagen_item img
{
	width: 96px;
}
#contenido .item .titulo_item
{
	font-size: 1.2em;
	font-style: italic;
	padding: 1em 1em 0 0;
}
#contenido .item .titulo_item a
{
	color: #444;
	text-decoration: none;
}
#contenido .item .votacion
{
	background: white;
	border-radius: 0 0 0.5em 0.5em;
	left: 1%; 
	margin-top: 3px;
	padding: 0.2em 0.5em;
	position: absolute;
	top: 100%;
	width: 95%;
}
#contenido .item .votacion a
{
	text-decoration: none;
}

#contenido .item .votacion .comentarios_item, 
#contenido .item .votacion .guardar_item
{
	float: right;
}

/*@media print{
	body{
		font-size: 50px;
	}
}*/

@media screen and (min-width:800px){
	#contenido{
		overflow: hidden;
	}
	#contenido .item{
		width: 49%;
		float: left;
	}
	#contenido .item:nth-child(even){
		margin-left: 2%;
	}
}

@media screen and (min-width:1000px){
	aside{
		display: block;
		float: right;
		margin:1em;
		width: 20%;
	}
	aside video{
		width: 100%;
	}
}

/**
 * Formularios
 */
.formulario{
	text-align: right;
	padding: 1em;
	display: none;
}
.formulario input{
	border-radius: 5px;
	padding: 0.2em 0.6em;
}
.formulario input[type="text"],
.formulario input[type="url"]{
	border: 1px solid #888;
}
.formulario input[type="submit"]{
	background: #22BCE0;
	border: 1px solid #22BCE0;
	box-shadow: rgba(0,0,0,0.5) 5px 5px 20px;
	font-style: italic;
	text-shadow: rgba(0,0,0,0.5) 2px 2px 5px;
	color: white;
}