/*  
Theme Name: Yeipis
Theme URI: http://yeipis.com/
Description: Tema para el blog de Juan Pablo Sueiro
Version: 1.0
Author: Leo
Author URI: http://socialsnack.com/
*/

@import url("fonts/stylesheet.css");


/* GENERALES */
*, body { margin: 0; padding: 0; }
body { font: 14px/1.6em  'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Arial, sans-serif; background: #ddd url(img/bg.jpg) fixed top repeat-x; color: #777; text-align: center; }

p.clear { margin: 0; padding: 0; clear: both; }
ul { list-style: none; }
hr { border: none; margin-bottom: 20px; background: #ccc; }

img { border: 0; }
img.alignright { float: right; margin: 5px 0 15px 25px; }
img.alignleft { float: left; margin: 5px 25px 15px 0; }
img.aligncenter { display: block; margin: 0 auto; }

a { font-weight: bold; text-decoration: none; outline: none; color: #00AFF0; }
a:hover { text-decoration: underline; }

.boton { display: inline-block; cursor: pointer; text-decoration: none !important; text-align: center; line-height: 1em; padding: 8px 10px; font-weight: bold !important; color: #777; background: #eee url(img/grad.png) bottom repeat-x; border: 1px #999 solid; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; text-decoration: none; text-shadow: 1px 1px 0 #fff; }
.boton:hover { background-color: #fff; color: #333; }
input.boton { width: auto !important; display: block; margin: 0 auto; }

/* CONTENEDOR */
.wrap { width: 920px; text-align: left; margin: 0 auto; }

/* HEADER */

#header { text-align: left; width: 920px; height: 100px; margin: 20px auto 50px auto; font-family: BreeRegular, Helvetica, Arial, sans-serif; }
	#header h2 { width: 110px; height: 100px; float: left; background: url(img/logos/logo.png) no-repeat; text-indent: -9999px; }
		#header h2 a { display: block; width: 100px; height: 100px; }
	#header h1 { float: right; width: 790px; padding: 0 10px; background: #eee url(img/grad.png) bottom repeat-x; padding: 0 10px; height: 50px;  font-size: 20px; font-weight: normal; color: #999; line-height: 50px; text-transform: uppercase; letter-spacing: 1px; -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; text-shadow: 1px 1px 0 #fff; }
		#header h1 a { font-size: 22px; float: left; margin: 0 10px 0 0; }
	#header .extras { float: right; width: 790px; padding: 0 10px; margin: 0 0 10px 0; height: 40px; font-size: 12px; background: #666 url(img/grad.png) bottom repeat-x; position: relative; overflow: hidden; -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; }
		#header .extras ul { }
			#header .extras li { display: inline; text-transform: uppercase; color: #dce5e9; }
				#header .extras li a { display: inline-block; padding: 0 10px; height: 40px; line-height: 40px; color: #bbb; font-weight: normal; text-decoration: none; border-right: 1px #777 dotted; }
				#header .extras li a:hover { color: #fff; }
		
/* CONTENIDO */
#contenido { width: 560px; float: left; }

	#contenido h3, #contenido h4 { font-family: BreeRegular, Helvetica, Arial, sans-serif; text-transform: uppercase; font-size: 20px; margin: 0 0 20px 0; border-bottom: 1px #ccc solid; }

	.post { margin: 0 0 50px 0; position: relative; }
		/* Bocadillo */
		.post .comentarios { position: absolute; z-index: 666; top: 0; right: -10px; background: #fff; color: #00AFF0; padding: 5px 10px; font-family: BreeRegular, Helvetica, Arial, sans-serif; font-size: 25px; line-height: 25px; border: 5px #00AFF0 solid; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; text-decoration: none; }
			.post .comentarios strong { background: none; padding: 0; display: block; position: absolute; text-indent: -9999px; bottom: -13px; left: 50%; margin-left: -10px; font-size: 0px; line-height: 0%; width: 0px; border-left: 10px transparent solid; border-right: 10px transparent solid; border-top: 10px solid #00AFF0; }
			.post .comentarios small { display: none; }
		.post .comentarios:hover { border-color: #333; color: #333; }
			.post .comentarios:hover strong { border-top-color: #333; }
		.post .comentarios:hover small { display: block; position: absolute; text-align: center; width: 80px; top: -25px; left: 50%; margin: 0 0 0 -40px; font-family: BreeRegular, Helvetica, Arial, sans-serif; font-weight: bold; font-size: 11px; text-transform: uppercase; }
		/* Leer más */
		.post .boton { display: block !important; margin: 0 auto; width: 80px; }
		.post h2 { padding: 0 80px 0 0; font-family: BreeRegular, Helvetica, Arial, sans-serif; font-size: 32px; line-height: 32px; text-shadow: 1px 1px 0 #fff; }
		.post .like { padding: 5px; background: #fff; border: 1px #bbb solid; margin: 0 0 20px 0; }
		.post .texto { margin: 15px 0 0 0; }
			.post .texto .wp-post-image { display: block; margin: 0 0 20px 0; }
			.post .texto p { margin: 0 0 20px 0; }
			.post .texto ul, .post .texto ol { margin: 0 30px 20px 30px; }
			.post .texto ul { list-style: circle; }
				.post .texto li { padding: 3px 0; }
			.post .texto img, .post .texto object { padding: 5px; background: #fff url(img/grad-big-i.png) bottom repeat-x; border: 1px #aaa solid; -moz-box-shadow: 0 0 10px rgba(0,0,0,0.5); -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5); -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }
			.post .texto .wp-smiley { padding: 0; background: none; border: none; -moz-box-shadow: none; -webkit-box-shadow: none; }
			.post .texto object { display: block; margin: 0 auto; }
		/* Info */
		.post .info { margin: 30px 0 0 0; padding: 0 0 5px 0; border-bottom: 1px #bbb dotted; text-align: center; font-family: BreeRegular, sans-serif; font-size: 10px; line-height: 12px; letter-spacing: 2px; color: #999; text-transform: uppercase; text-shadow: 1px 1px 0 #fff; }
			.post .info a { color: #666; font-weight: normal; }
			.post .info .compartir { color: #666; margin: 0 0 10px 0; }
				.post .info .compartir a { color: #00AFF0; }
	/* Galerias */
	#contenido .wp-caption { width: auto !important; margin: 0 0 15px 0; padding: 0 0 15px 0; border-bottom: 1px #ccc dotted; font-size: 12px; letter-spacing: 1px; }
		#contenido .wp-caption img { vertical-align: text-top; margin: 0 20px 0 0; }
		#contenido .wp-caption p { display: inline; }

	.navegacion { height: 15px; }
		.navegacion div { height: 15px; line-height: 15px; width: 49%; }
		.navegacion .left { float: left; }
		.navegacion .right { float: right; }
		
	/* Comentarios */
	#comments, #respond h3 { color: #666; background: #eee url(img/grad.png) bottom repeat-x; padding: 5px 10px; border: 1px #bbb solid !important; }
	
	.commentlist { list-style: none; margin: 0 0 50px 0; }
		.commentlist li { position: relative; padding: 10px; margin: 0 0 20px 60px; background: #fff; border: 5px #00AFF0 solid; -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; }
			.commentlist li .avatar { position: absolute; left: -60px; top: 0; padding: 2px; background: #fff; border: 1px #bbb solid; }
			.commentlist li cite { font-size: 18px; line-height: 18px; font-weight: bold; font-style: normal; }
			.commentlist li .says { background: none; padding: 0; display: block; position: absolute; text-indent: -9999px; left: -15px; top: 15px; font-size: 0px; line-height: 0%; width: 0px; border-top: 5px transparent solid; border-right: 10px #00AFF0 solid; border-bottom: 5px transparent solid; }
			.commentlist li .commentmetadata { font-size: 10px; line-height: 10px; text-transform: uppercase; margin: 0 0 10px 0; }
				.commentlist li .commentmetadata a { font-weight: normal; color: #666; }
			.commentlist li p { margin: 0 0 10px 0; }
				.commentlist li .reply { text-align: right; }
					.commentlist li .reply a { font-size: 11px; padding: 3px 6px; background: #eee url(img/grad.png) bottom repeat-x;  color: #666; border: 1px #999 solid; }
				/* Anidados */
				.commentlist li li { background: #fafafa !important; color: #666 !important; border-color: #aaa !important; margin: 20px 0 0 -40px; }
					.commentlist li li .avatar { width: 25px; height: 25px; left: -50px; }
					.commentlist li li .says { top: 10px; border-right-color: #aaa;  }
			/* Trackbacks */
			.commentlist .pingback { margin: 0 0 20px 0; border: 2px #aaa solid; font-size: 11px; line-height: 11px; }
				.commentlist .pingback cite { font-size: 14px; line-height: 14px; }
				.commentlist .pingback .says, .commentlist .pingback .reply, .commentlist .pingback .commentmetadata { display: none; }
	
	#commentform {}
		#commentform p { margin: 0 0 10px 0; }
		#commentform label { font-weight: bold; color: #888; }
		#commentform input, #commentform textarea { padding: 5px; font: 14px Arial, sans-serif; color: #888; border: 1px #aaa solid; }
		#commentform input:focus, #commentform textarea:focus { color: #555; border-color: #666; background: #fff; }
		#commentform input { width: 300px; }
		#commentform textarea { width: 540px; }
		li #commentform textarea { width: 400px; }
		#commentform .boton { padding: 8px 10px;}
	
	.aclaracion { margin: 20px 0 0 0; font-size: 11px; line-height: 12px; color: #999; }
		
/* SIDEBAR */
#side { width: 300px; float: right; font-size: 12px; line-height: 1.5em; color: #999; }
	#side a { color: #333; }
	#side a:hover { color: #00AFF0; }
	#side div { margin: 0 0 30px 0; }
		#side div div { margin: 0; }
	#side .left { width: 135px; float: left; }
	#side .right { width: 135px; float: right; }
	#side h2 { font-family: BreeRegular, Helvetica, Arial, sans-serif; font-size: 25px; line-height: 20px; color: #999; text-shadow: 1px 1px #fff; text-transform: uppercase; margin: 0 0 15px 0; }
		#side h2 small { display: block; font-size: 16px; line-height: 16px; color: #666; letter-spacing: 0; }
	#side h3 { position: relative; z-index: 666; color: #fff; font-size: 11px; line-height: 11px; text-transform: uppercase; letter-spacing: 1px; padding: 10px 15px; background: #999 url(img/grad.png) bottom repeat-x; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; }
	
	#side .border { background: #fff; padding: 15px; border: 1px #ccc solid;  -moz-box-shadow: 0 0 10px rgba(0,0,0,0.5); -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5); }
	
	#side .acerca { background: #fefefe; }
		#side .acerca p { font-size: 13px; text-shadow: 0 0 1px #fff; }
		#side .acerca .avatar { position: relative; z-index: 999; float: right; margin: 0 0 15px 15px; }
		#side .acerca ul { text-align: center; margin: 15px 0; padding: 5px 0; font-size: 11px; font-weight: bold; border: #ccc dashed; border-width: 1px 0; }
			#side .acerca ul li { display: inline; padding: 0 10px; }
				#side .acerca li a { text-decoration: none; }
					#side .acerca li a img { vertical-align: -4px; margin: 0 3px 0 0; }
		#side .acerca form { background: #eee; padding: 4px; height: 28px; -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; border: 1px #ccc solid; }
		#side .acerca form:hover { background: #fff; }
			#side .acerca input { font: bold 14px Arial, sans-serif; color: #888; vertical-align: middle; outline-width: 0; }
			#side .acerca .texto { margin: 6px 0 0 10px; border: none; background: transparent; width: 150px; float: left; }
			#side .acerca .boton { padding: 4px 6px; float: right; }

	#side .flickr {}
		#side .flickr li { display: inline; }
			#side .flickr li a { display: inline-block; width: 100px; height: 100px; }
				#side .flickr li a img { width: 100px; height: 100px; }

	#side .doodles {}
		#side .doodles img { width: 90px !important; height: 90px !important; margin: 5px; }

	#side .act {}
		#side .act ul { border: none; background: none; padding: 0; margin: 0; list-style: none; }
			#side .act ul li { position: relative; padding: 0 0 0 65px; margin: 15px 0 0 0; border: none; }
				#side .act ul li img { position: absolute; top: 5px; left: 0; border: 1px #aaa solid; background: #fff url(img/grad.png) bottom repeat-x; padding: 4px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }
				#side .act ul li .bocadillo { display: block; text-decoration: none; background: #fff; padding: 10px; -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; color: #777; font-weight: normal; border: 5px #bbb solid; overflow: hidden; }
				#side .act ul li .bocadillo:hover { color: #444; border-color: #00AFF0; }
					#side .act ul li .bocadillo .flechita { background: none; padding: 0; display: block; position: absolute; text-indent: -9999px; top: 25px; left: 55px; font-size: 0px; line-height: 0%; width: 0px; border-bottom: 5px transparent solid; border-right: 10px #bbb solid; border-top: 5px transparent solid; }
					#side .act ul li .bocadillo:hover .flechita { border-right-color: #00AFF0; }
			#side .comentarios ul li { min-height: 55px; }
			#side .lifestream ul li { min-height: 31px; padding: 0 0 0 41px; }
				#side .lifestream ul li .bocadillo  .flechita { top: 13px; left: 31px; }
				#side .lifestream ul li small { font-size: 10px; color: #999; }

/* FOOTER */
#footer { position: relative; margin: 50px 0 0 0; font-size: 11px; line-height: 11px; background: #fff url(img/grad-big-i.png) bottom repeat-x; border-top: 5px #888 solid; padding: 40px 0; }
	#footer .col { width: 258px; float: left; margin: 0 40px 0 0;  background: #eee; border: 1px #ccc solid; padding: 10px; }
	#footer a { color: #999; }
	#footer a:hover { color: #00AFF0; }
	#footer h3 { font-family: BreeRegular, Helvetica, Arial, sans-serif; font-size: 20px; line-height: 20px; position: absolute; top: -25px; color: #ccc; text-transform: uppercase; background: #444; padding: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; }
		#footer h3 span { background: none; padding: 0; display: block; position: absolute; text-indent: -9999px; bottom: -10px; left: 50%; margin-left: -10px; font-size: 0px; line-height: 0%; width: 0px; border-left: 10px transparent solid; border-right: 10px transparent solid; border-top: 10px solid #444; }
	#footer h4 { font-size: 11px; text-transform: uppercase; letter-spacing: 3px; margin: 0 0 15px 0; text-shadow: 0 0 1px #fff;  }

	#footer .tagcloud {}
		#footer .tagcloud p { text-align: center; }
			#footer .tagcloud p a { padding: 0 3px; white-space: nowrap; }
	#footer .last { margin: 0; }
		#footer  ul {}
			#footer ul li { border-bottom: 1px #ccc dotted; }
			#footer ul li:last-child { border: none; }
				#footer li a { display: block; padding: 8px 0; text-decoration: none; font-size: 12px; letter-spacing: 1px;}
				#footer li img { vertical-align: -4px; margin: 0 10px 0 0; }
	#footer .copy { margin: 50px 0 0 0; text-align: center; font-size: 10px; letter-spacing: 2px; }