@import url("reset.css");

html {background-color:#000; }
h1 {font: bold 18px Verdana, Arial, Helvetica, sans-serif; margin-bottom: 15px;}
p {position: relative; font:bold 12px Verdana, Arial, Helvetica, sans-serif; line-height:18px; text-align:justify; }
a { font:bold 12px Verdana, Arial, Helvetica, sans-serif; line-height:18px; color:#C30; text-decoration: none;}
a:hover { color:#333; }
/* Listas */
ul {list-style:none; margin:20px 5px; }
	ul li a {display:block; height:30px; line-height:30px; color:#333;
		margin:3px 0; padding-left:35px; background:url(../img/bull28x60.gif) no-repeat left bottom;}
	ul li a:hover, ul li a.sel {background-position:left top; color:#C30;}
/* Forma curva del texto */
.lW { float: left; clear: left; height: 15px; background: #f00; }
.rW { float: right; clear: right; height: 15px; }

/* Capa contenedor de la portada */
#index, #menu, #main { position: absolute; left:50%; border:1px solid #666; overflow:hidden; }
	#index {height:674px; width:960px; margin-left:-480px;}
	#menu {height:586px; width:872px; margin-left:-436px;}
	#main {height:688px; width:971px; margin-left:-505px;
		background:url(../img/bg/bg_main.jpg) no-repeat scroll right top; padding:20px;}

/* Botón volver */
#volver_presen {position:absolute; top:75%; right:250px;}
#boton_volver {position:absolute; bottom:25px; right:25px;}

/*// MENU //*/
.menu {position:absolute; display:block;
	background:url(../img/menu/all.jpg) no-repeat center center;}

	#m_otros { width:180px; height:44px;
	top:274px; left:201px; z-index:1; background-position:left top;}
		#m_otros:hover{background-position:left -44px; z-index:10} 
	#m_camisetas { width:178px; height:46px;
	top:299px; left:148px; z-index:3; background-position:left -89px;}
		#m_camisetas:hover{background-position:left -135px; z-index:10}
	#m_tattooing { width:187px; height:60px;
	top:320px; left:79px; z-index:5; background-position:left -182px;}
		#m_tattooing:hover{background-position:left -242px; z-index:10}
	#m_presentacion { width:187px; height:71px;
	top:348px; left:0; z-index:7; background-position:left -303px;}
		#m_presentacion:hover{background-position:left bottom; z-index:10}				

	#m_graffitti { width:180px; height:28px;
	top:274px; right:106px; z-index:2; background-position:right top;}
		#m_graffitti:hover{background-position:right -30px; z-index:10}
	#m_enlaces { width:178px; height:32px;
	top:296px; right:81px; z-index:4; background-position:right -60px;}
		#m_enlaces:hover{background-position:right -92px; z-index:10}
	#m_estamos { width:181px; height:50px;
	top:319px; right:33px; z-index:6; background-position:right -125px;}
		#m_estamos:hover{background-position:right -175px; z-index:10}
	#m_extra { width:159px; height:63px;
	top:352px; right:0px; z-index:8; background-position:right -319px;}
		#m_extra:hover{background-position:right bottom; z-index:10}			
	
/* CONTENIDOS */
#donde_estamos { width: 600px; margin: 50px auto 0; }
	#donde_estamos p { margin-bottom: 30px; }
.gmap { margin: 20px 20px 0 0; border:1px solid #000; } /*google map*/

#trabajos, #thumbs {
	float: left; margin: 10px 0; overflow:auto; }
#trabajos { height:620px; width: 830px;}
#thumbs { height: 620px; width: 500px; }
	#trabajos img, #thumbs img { padding:5px; background: #fff; border:1px solid #000; float:left; margin:3px; }
	#thumbs img { width:100px; height: 150px; cursor:pointer;}
#imagen_zoom { position: absolute; top: 210px; left: 530px; border:5px solid #000; display:none; }

img.presen {cursor:pointer; margin:10px;}

/*// GALERIA //*/
.galeria {position:absolute; left:200px; top:150px; display:block; width:620px; height:475px;}
	#imgcentral {
		display:block; width:620px; height:380px; line-height:380px; text-align:center;}
		#img {max-width:620px; max-height:380px; vertical-align:middle; margin:0 auto;
			 border:3px solid #000; cursor:pointer;}
	.boton {
		position:absolute; bottom:0; z-index:3; display:block; cursor:pointer;
		height:84px; width:60px; background:no-repeat left center;}
		.boton:hover {background-position:right center;}
		.iz{left:0px; background-image:url(../img/gal_iz.gif);}
		.dr{right:0px;background-image:url(../img/gal_dr.gif); z-index:2;} 
	.marco {
		position:absolute; bottom:0; left:60px;
		width:500px; height:84px; overflow:hidden;}
	#tira {position:absolute; top:0px; left:0px; z-index:1;
		white-space:nowrap; text-align:left; line-height:84px;}
		#tira img {
			max-height:80px; border:2px solid #000; margin:0 1px; vertical-align:middle;
			cursor:pointer; display:inline}
		#tira div {float:left;}
			#tira div a.mas {display:block; float:left; height:20px; width:20px;
				background:url(../img/mas.gif) no-repeat}
#cover {height:555px;}
	#cover .boton {bottom:40px;}
	#cover .marco {height:170px;}
	#cover #tira div {text-align:center;}
			
/*//  CAMISETAS  //*/

#camisetas { position:absolute; top:100px; left:100px;}
	#camisetas img {display:block;}
	#camisetas ul {margin:0 0 0 40%;}
		#camisetas ul li a {font-size:20px;}
		
ul#camis {width:250px; padding-top:105px;
	background:url(../img/camisetas-bendita-21.gif) no-repeat center top;}

#sumCar {width:250px; font:bold 12px verdana; line-height:21px;}
	#sumCar img {vertical-align:middle}

#tallas {position:absolute; top:100px; left:300px; width:485px; display:block;}
	#tallas img {float:left; border:3px solid #000; margin-right:5px; cursor:pointer;}
	#tallas input {width:20px;}
	a.btnt {
	display:block; float:left; margin:5px;
	background:#F1F1EF url(../img/vergris.gif) repeat-x left 12px;
	border:1px solid #daa;
	font:bold 12px Arial, Helvetica; text-decoration: none;
	color:#e00; text-shadow:#755 1px 1px 2px;
	padding:4px 8px; -webkit-border-radius:6px; -moz-border-radius:6px;}
		a.btnt:hover {
		background-position:center bottom; border-color:#d6d6d6;
		color:#333; text-shadow:#f00 1px 1px 2px;}
		
#carrito {position:absolute; top:125px; left:300px; width:485px; display:block;}
	table#pedi {width:100%; border:3px solid #000; font:bold 12px Verdana, Arial, Helvetica, sans-serif;}
		table#pedi th {background-color:#333; padding:3px; color:#ddd}
		table#pedi tr {border-bottom:1px solid #bbb;}
		.impar {background-color:#ddd;}
		.par {background-color:#fff;}
		table#pedi td {border-right:1px solid #bbb; padding:3px; text-align:center; vertical-align:middle;}
		table#pedi td img {vertical-align:middle}

#pedido {width:760px;}
	#pedido label {width:100px; text-align:right; font:bold 12px verdana;}
	#pedido label, #pedido input {display:block; float:left; height:20px; line-height:20px; margin:5px;}
	#pedido br {clear:left;}