﻿/*
Theme Name: I am Articuado
Theme URI: http://artifacts.co/blog
Description: custom hand-made theme for artifacts tshirts blog, from Bucaramanga-Colombia babe.
Author: piemaker a.k.a. **** ******* **** **
Author URI: http://artifacts.co/blog/author/piemaker/
Version: 2011.07.18
.
*/

/*YUI 2 css reset menos las etiquetas que nunca usaré*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img {
	border:0;
}
address,caption,cite,code,dfn,th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul {
	list-style:none;
}
caption,th {
	text-align:left;
}
h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
q:before,q:after {
	content:'';
}
/**/

/*at font-face babe*/
/*
@font-face {
	font-family: 'PTSansRegular';
	src: url('font/PT_Sans.eot');
	src: local('PT Sans'), local('PTSans-Regular'), url('font/PT_Sans.woff') format('woff'), url('font/PT_Sans.ttf') format('truetype'), url('font/PT_Sans.svg#PTSans-Regular') format('svg');
}
*/
/**/

/*my hooks, de common use*/
.izq {
	float: left;
}

.der {
	float: right;
}

.round{-moz-border-radius:3px;-webkit-border-radius:3px;border-radius: 3px}

input[type=text],input[type=password],select,textarea{border:1px solid #aaa;transition:border linear .2s,box-shadow linear .2s;-moz-transition:border linear .2s,-moz-box-shadow linear .2s;-webkit-transition:border linear .2s,-webkit-box-shadow linear .2s;}input[type=text]:focus,input[type=password]:focus,textarea:focus{outline:none;border-color:rgba(82,168,236,.75)!important;box-shadow:0 0 8px rgba(82,168,236,.5);-moz-box-shadow:0 0 8px rgba(82,168,236,.5);-webkit-box-shadow:0 0 8px rgba(82,168,236,.5);}
input[type=text],input[type=password],select,textarea{border:1px solid #ccc;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius: 3px}

a {
    transition: background-color .2s, color .2s, border-color .2s;
    -moz-transition: background-color .2s, color .2s, border-color .2s;
    -webkit-transition: background-color .2s, color .2s, border-color .2s;
}

.boton {
	border:1px solid #ccc;
	display: inline-block;
	padding: 5px 10px;
	text-shadow: 1px 1px 0 #fff;
	background-color: #eee;
	line-height: 1.2em;
	font-family: arial, serif;
	font-size: 13px;
	font-weight: normal;
	color: #555;
	cursor: pointer;
}

    .boton:hover {
        border-color: rgba(82,168,236,.75);
        color: #333;
        text-decoration: none;
        background-color: #f5f5f5;
        box-shadow: 0 1px 1px #eee;
    }

/**/

body {
	font-family: arial, sans-serif;
    font-size: 10px;
	/*color: #333;*/
	color: #000;
}

	#pagina {
		margin: 0 auto;
	}

	#encabezado {
		height: 60px;
		background-color: #000;
	}

		#encabezado_contenido {
			height: 60px;
			margin: 0 auto;
			background-color: #000;
            width: 972px;
			/*max-width: 118em;
            width: 90%;
            min-width: 960px;*/
		}

            #artifacts_slogan {
                width: 133px;
                height: 60px;
                float: left;
                background: url(img/esprite.png) no-repeat scroll  0 0 transparent;
            }

            #artifacts_tienda_slogan {
                width: 76px;
                height: 60px;
                background: url(img/esprite.png) no-repeat scroll 0 -110px transparent;
            }

			#formulario_buscador {
				float: left;
				background: url(img/esprite.png) no-repeat scroll  0 -848px transparent;
				height: 60px;
				width: 448px;
				margin-left: 10px;
			}

				#s {
					background-color:#EEEEEE;
					border:1px solid #D1D1D1;
					color:#CF2222;
					float:left;
					font-size:2em;
					height:25px;
					margin-left:5px;
					margin-top:15px;
					width:437px;
				}

				#boton_buscar {
					background: url(img/esprite.png) no-repeat scroll  0 -536px transparent;
					width: 54px;
					height: 21px;
					display: block;
					float: left;
					margin-top: 19px;
					margin-left: 2px;
				}

	#categorias {
        border-bottom: 1px solid #b50000;
		height: 40px;
		background-color: #ce0000;
		font-size: 1.4em;
		font-weight: bold;
		overflow: hidden;
		color: #fff;
	}

		#categorias_contenido {
			/*min-width: 960px;
			width: 90%;*/
            width: 972px;
			margin: 0 auto;
		}

		#categorias_contenido {
			max-width: 88em;
		}

			#categorias ul {
				float: left;
				width: 90%;
			}

				#categorias li {
					float: left;
				}

				#categorias a {
					display: block;
					padding: 10px 30px 0px;
					height: 30px;
					color: #fff;
					text-decoration: none;
					float: right;
					text-shadow: 0 1px 0 #870802;
					letter-spacing: -1px;
				}

				#categorias a:hover {
					text-decoration: underline;
				}

				#categorias_mas {
					float: right;
					color: #fff;
					font-size: 10px;
					display: block;
				}

				.mostrar_mas_categorias {
					height: auto !important;
				}
			#contenedor_categorias_mas {
				float: right;
				width: 8%;
			}

    #twitch_promo {
        clear: both;
        /*height: 280px;*/
        /*width: 972px;*/
        margin: 0 auto;
    }

    #self_promo:hover {
        box-shadow: 0 1px 15px #999;
    }

        #self_promo {
            margin: 0 auto;
			/*min-width: 960px;*/
			/*width: 90%;*/
			width: 100%;
			background-color: #fff;
			max-width: 980px;
            /*height: 280px;*/
            display: block;
            /*width: 972px;*/
        }

#fauxbody {
	/*max-width: 118em;
	min-width: 1008px;*/
    width: 972px;
	margin: 0 auto;
}

	#anchura {
		margin: 0 auto;
        width: 972px;
		/*min-width: 1008px;*/
	}

		#intersticio {
			float: left;
			width: 100%;
            clear: both;
            margin: 0 auto 40px;
            border-bottom: 1px solid #eee;
            padding-bottom: 20px;
		}

			#blog_diferential {
				float: left;
				margin-top: 30px;
			}

				#blog_diferential a{
					display: block;
					float: left;
					margin: 10px 10px 10px 0;
				}

				#blog_general, #blog_tienda, #tienda_camisetas {
					font-size: 24px;
                    letter-spacing:-1px;
                    text-decoration: none;
                    color: #ccc;
                    padding-right: 30px;
				}

				#blog_general:hover {
					color: #007CA5;
				}

				#blog_tienda:hover {
					color: #007CA5;
				}

				#tienda_camisetas {
				}

				#tienda_camisetas:hover {
					color: #007CA5;
				}

			#please_seguidnos {
				float: right;
				width: 300px;
				background: url(img/esprite.png) no-repeat scroll 0 -734px transparent;
				height: 66px;
				display: block;
				margin-top: 20px;
			}

				#please_seguidnos a {
					display: inline;
					height: 32px;
					width: 32px;
					float: left;
					margin: 20px 14px 0;
				}

				#follow_twitter {
					background: url(img/esprite.png) no-repeat scroll 0 -1925px transparent;
				}

				#follow_twitter:hover {
					background: url(img/esprite.png) no-repeat scroll 0 -1843px transparent;
				}

				#follow_rss {
					background: url(img/esprite.png) no-repeat scroll 0 -1761px transparent;
				}

				#follow_rss:hover {
					background: url(img/esprite.png) no-repeat scroll 0 -1679px transparent;
				}

				#follow_facebook {
					background: url(img/esprite.png) no-repeat scroll 0 -1433px transparent;
				}

				#follow_facebook:hover {
					background: url(img/esprite.png) no-repeat scroll 0 -1351px transparent;
				}

				#follow_correo {
					background: url(img/esprite.png) no-repeat scroll 0 -1269px transparent;
				}

				#follow_correo:hover {
					background: url(img/esprite.png) no-repeat scroll 0 -1187px transparent;
				}

				#follow_google_plus {
					background: url(img/esprite.png) no-repeat scroll 0 -1597px transparent;
				}

                #follow_google_plus:hover {
					background: url(img/esprite.png) no-repeat scroll 0 -1515px transparent;
				}

		#contenido {
			width: auto;
			padding-right: 330px;
		}

			#izquierda, #izquierda_single {
				width: 100%;
				float: left;
				position: relative;
				overflow: hidden;
                min-width: 320px;
			}

			#izquierda_single {
			    margin-right: -330px;
			    float: right;
			}

				#izquierda h3, #izquierda_single h3 {
					font-size: 66px;
					font-weight: bold;
					letter-spacing: -3px;
					margin: 20px 0 40px;
				}

					.titulo_categoria {
						color: #007CA5;
					}

				#post img, #post object, #post embed, #post iframe {
					max-width: 100%;

				}

					#post_info {
						margin: 10px 0;
						font-size: 1.2em;
						font-family: georgia, serif;
					}

						#post_info a {
							color: #000 !important;
                            text-decoration: none;
						}

					#fecha {
						color: #777;
					}

					#por {
						margin-left: 10px;
						color: #777;
					}

					#post a {
						color: #ef4529;
						text-decoration: none;
					}

					#post a:hover {
						text-decoration: underline;
					}

                    #post h1 {
						font-size: 52px;
                        font-weight: bold;
						letter-spacing: -2px;
						line-height: 1.1em;
						padding: 5px 0 30px;
                        text-transform: capitalize;
					}

                    #post h2 {
                        font-size: 18px;
                        font-weight: bold;
                    }

					#post p {
						font-family: arial, sans serif;
						/*font-family: georgia, times, "times new roman", serif;*/
						/*font-size: 1.35em;*/
						font-size: 16px;
						/*line-height: 1.5em;*/
						line-height: 26px;
						margin: 1em 0;
						color: #333;
					}

				#compartir {
					float: left;
					margin: 20px 0 40px 0;
				}

					#compartir_por {
						font-size: 1.35em;
						font-family: georgia, serif;
						float: left;
					}

					#google_buzz_share {
						background: url(img/esprite.png) no-repeat scroll 0 -957px transparent;
						display: block;
						height: 20px;
						width: 58px;
						float: left;
						margin-right: 10px;
					}

					.share_correo {
						height: 20px;
						background: url(img/esprite.png) no-repeat scroll 0 -212px transparent;
						cursor: pointer;
						font-size: 11px;
						display: block;
						float: left;
						margin-top: 1px;
						color: #888 !important;
						line-height: 18px;
					}

						.share_correo span {
							float: right;
							padding-left: 20px;
						}

                        .share_correo span:hover {
                            color: #333;
                        }

                .azar {
                	margin: 5px 0 40px 0;
                	width: 100% !important;
                }

				#krrusel {
					clear: both;
					overflow: hidden;
					/*max-height: 365px;*/
					margin: 0 0 50px;
					height: auto !important;
					/*height: 365px;*/
					background-color:#eee;
					padding:0 20px 10px;
					width: 100%;
					float:left;
				}

					.preview {
						width: 140px;
						float: left;
						padding: 0 2px 0px;
                        margin-bottom: 10px;
                        height: 200px;
					}

						.preview a {
							font-size: 1.1em;
                            font-weight: bold;
							color: #007CA5;
							text-decoration: none;
                            text-transform: capitalize;
						}

					 a:hover {
							color: #ef4529;
						}

						.contenedor_imagen_preview {
							width: 140px;
							height: 140px;
							overflow: hidden;
                            margin-bottom: 5px;
						}

							.contenedor_imagen_preview img {
								max-width: 140px;
                                max-height: 140px;
							}

				#comentarios {
					border-top: 5px solid #333333;
					padding-top: 40px;
					line-height: 1.6em;
					margin-top: 80px;
					float: left;
					width: 100%;
				}

					.logeado_como {
						font-size: 1.2em;
						margin: 10px 0;
					}

					#comentarios a {
						color: #EF4529;
						text-decoration: none;
					}

					#comentarios a:hover {
						text-decoration: underline;
					}

					#comentarios h2 {
						font-size: 24px;
						font-family: arial, sans-serif;
                        padding: 0;
                        font-weight: bold;
                        line-height: 24px;
                        letter-spacing: -1px;
					}

					#live_preview {
						display: none;
					}

					#cancel-comment-reply {
						font-size: 1.2em;
						margin: 5px 0 0 0;
					}

						.input_nombre_comentario {
							border: 1px solid #ddd;
							width: 98%;
							padding: 5px;
							margin: 10px 0;
							font-family: arial, sans serif;
							font-size: 1.3em;
						}

						.textarea_comentario {
							border: 1px solid #ddd;
							width: 98%;
							padding: 5px;
							font-family: arial, sans serif;
							font-size: 1.3em;
                            height: 60px;
						}

						.submit_comentario {
							float: right;
							margin-top: 5px;
						}

					#lista_comentarios {
						float: left;
						width: 100%;
					}

						#lista_comentarios ul li {
							padding-left: 30px;
						}

						#comentarios span {
							font-size: 1.3em;
							line-height: 18px;
						}

						.persona {
							color: #000;
							font-weight: bold;
						}

						.mensaje_comentario {
							/*padding-left: 10px;*/
						}

							.mensaje_comentario p {
								display: inline;
								clear: none;
							}

						.comentario {
							color: #333;
							border-bottom: 1px dotted #DDDDDD;
							padding: 20px 0;
						}

						.fecha_comentario {
							color: #888;
							font-size: 1em !important;
                            font-weight: bold;
                            display: block;
                            text-transform: uppercase;
						}

						.responder {
							margin-left: 10px;
							font-size: 1.1em !important;
							float: right;
							display: none;
						}

			#derecha, #derecha_single {
				width: 300px;
				margin-right: -1747px;
				float: left;
				position: relative;
				padding: 10px 0 0 30px;
			}

			#derecha_single {
			    float: left;
			    padding: 10px 30px 0 0;
			}

				.rnd {
					background-color: #eee;
					width: 45%;
					float: left;
					text-align: center;
                    border: 1px solid #eee;
				}

				.rnd a {
					font-size: 18px;
                    line-height: 34px;
					text-shadow: 0 1px 0 #FFFFFF;
					color: #888;
					text-decoration: none;
					display: block;
				}

				.rnd a:hover {
					color: #ef4529;
                    text-decoration: none !important;
				}

                .rnd:hover {
                    border: 1px solid #ccc;
                }

				#derecha h3, #derecha_single h3 {
					font-size: 24px;
					float: right;
					letter-spacing: -1px;
					margin: 20px 0;
					display: block;
					font-weight: bold;
				}

				.selfad {
					float: left;
				}

				.artiad {
				    text-align: center;
					margin-top: 20px;
					float: left;
					width: 100%;
				}

				#ultimos, #sortes {
					float: left;
					margin-top: 5px;
					clear: both;
				}

					.ver_todos_contenedor {
						border-bottom: solid 1px #ddd;
						text-align: right;
						float: left;
						width: 100%;
					}

						.ver_todos {
							color: #EF4529;
							text-decoration: none;
						}

						.ver_todos:hover {
							text-decoration: underline;
						}

					.big_preview {
						width: 300px;
						float: left;
						padding: 10px 0;
					}

						.big_preview a {
							font-size: 12px;
							color: #007CA5;
							text-decoration: none;
							/*font-family: georgia, serif;*/
							line-height: 1.25em;
                            text-transform: capitalize;
                            /*font-style: italic;*/
						}

						.big_preview a:hover {
							color: #ef4529;
						}

						.contenedor_imagen_big_preview {
							width: 125px;
							height: 83px;
							overflow: hidden;
							float: left;
						}

							.contenedor_imagen_big_preview img {
								max-width: 150px;
								max-height: 150px;
							}

							.big_preview_anchor {
								float: left;
								width: 140px;
								display: block;
								margin-left: 10px;
							}

				#fanbox {
					margin: 20px 0 0;
					float: left;
					clear: both;
				}

/*home only, lo anterior es mainly single*/

#the_roll {

}

	.headline {
		float: left;
		margin: 15px 0;
		clear: both;
		width: 100%;
	}

	.contenedor_headline_titulo_fecha {
		margin-left: 160px;
	}

	.headline h1 {
		font-size: 1.2em;
		font-family: georgia, serif;
	}

	.headline h2 {
		font-size: 2em;
		font-family: arial, sans serif;
		letter-spacing: -1px;
		margin-left: 160px;
        padding: 0;
        line-height: 24px;
        font-weight: bold;
	}

		.headline a {
			text-decoration: none;
		}

		.headline a:hover {
			text-decoration: underline;
		}

		.titulo_headline {
			color: #000;
			text-decoration: none !important;
            font-weight: bold;
		}

		.titulo_headline:hover {
			color: #ef4529;
		}

	.fecha_headline {
		font-style: italic;
		color: #888;
		display: block;
		margin-left: 220px;
	}

	.contenedor_headline_img {
		width: 200px;
		height: 100px;
		float: left;
		overflow: hidden;
		margin-right: 20px;
	}

		.contenedor_headline_img {
			color: #fff;
			font-style: italic;
		}

		.headline img {
			float: left;
			max-width: 200px;
		}

#paginacion {
	font-variant: small-caps;
	float: left;
	width: 100%;
	border-bottom: 2px solid #ef4529;
	border-top: 1px solid #eee;
	font-size: 1.4em;
	color: #ef4529;
	font-weight: bold;
	font-family: georgia, serif;
	margin-top: 20px;
}

	#paginacion li {
		float: left;
		padding: 8px 0 6px;
	}

	#paginacion a {
		color: #ef4529;
		text-decoration: none;
		padding: 8px 10px 6px;
	}

	.paginacion_on {
		padding: 8px 10px 6px !important;
	}

	#paginacion a:hover,.paginacion_on {
		background-color: #ef4529;
		color: #fff;
	}

/**/

/*footer*/

#footer {
	margin-top: 40px;
	font-size: 1em;
	color: #ccc;
	clear: both;
	float: left;
	padding: 20px 0;
	border-top: 1px solid #eee;
	width: 100%;
}

	#contenido_footer {
		margin: 0 10px;
		text-align: center;
	}

	#paginas_footer {
		margin-bottom: 10px;
	}

	#paginas_footer a {
		font-size: 1.3em;
		color: #ef4529;
		text-decoration: none;
		letter-spacing: -1px;
		padding: 0 5px;
	}

	#paginas_footer a:hover {
		color: #fff;
		background-color: #ef4529;
	}

	#footer_disclaimer a {
		text-decoration: underline;
		color: #ccc;
	}

/**/

/*páginas todos los  - template temas*/
#cloud h2, #archivo h2 {
	font-size: 3em;
	letter-spacing: -1px;
	margin-top: 30px;
	font-weight: bold;
}

	#archivo h2 {
		margin-bottom: 20px;
	}

#cloud a {
	color: #000;
	text-decoration: none;
	line-height: 2em;
	padding-right: 10px;
}

	#archivo a {
		font-size: 1.5em;
		color: #000;
		text-decoration: none;
		line-height: 1.5em;
	}

#cloud a:hover, #archivo a:hover {
	text-decoration: underline;
	color: #ef4529;
}

/**/

clearfix:after {
	clear: both;
	content: " ";
	display: block;
	height:	0;
	line-height: 0;
	visibility: hidden;
}
.clearfix {
	display:inline-block;
}
html[xmlns] .clearfix {
	display:block;
}
* html .clearfix {
	height:1%;
}

/*titulo banner*/
#titulo {
    clear: both;
    margin: 0 auto;
}

    #titulo h1 {
        margin-top: 5px;
        font-size: 48px;
        letter-spacing: -2px;
        font-weight: bold;
    }

    .titulo_categoria_single {
        color: #007CA5;
        text-decoration: none;
        font-size: 14px;
        padding-right: 20px;
        font-weight: bold;
        text-transform: uppercase;
    }
/**/

/*responsive 980px wide viewport*/
@media (max-width: 980px) {
	#boton_buscar, #formulario_buscador, #please_seguidnos {
		display: none;
	}

	#anchura, #fauxbody {
		max-width: 100%;
	}

	#encabezado_contenido, #categorias_contenido {
		width: auto;
	}

  	#izquierda, #izquierda_single {
  		float: left;
  		margin-right: 0;
  	}

  	#derecha, #derecha_single {
    	float: none;
    	width: auto;
    	padding: 0;
    	margin: 0;
  	}

  	#contenido {
  		padding-right: 0;
  		width: 640px;
  		margin: 0 auto;
  	}

  	#titulo, #intersticio {
  		width: 640px;
  	}

  	#intersticio {
  		float: none;
  	}
}

/*responsive 640px wide viewport*/
@media (max-width: 640px) {
	#artifacts_slogan, #compartir, #intersticio {
		display: none;
	}

	#titulo, #contenido, #krrusel, #fauxbody, #anchura, #intersticio {
		width: auto;
	}

	#post p {
		font-size: 14px;
		line-height: 23px;
	}

	#post object, #post embed {
		width: 100%;
	}

	#titulo h1 {
		font-size: 28px;
	}

	#titulo {
		margin-top: 5px;
	}
}
/**/
