@charset "UTF-8"; /* Azul : #06a6b8 */

/* Inicializadores */

* { margin: 0; padding: 0; border: 0; outline: 0; text-decoration: none; list-style: none;}
html, body { width: 100%; height: 100%; font: 12px 'HelveticaBold', Arial, sans-serif; color: #000; background: #FFF;}
::selection { background: #FF0; color: #000;}
::-moz-selection { background: #FF0; color: #000;}
::-webkit-selection { background: #FF0; color: #000;}

h1, h2, h3, h4 { font-family: 'GaramondItalic', serif; font-weight: normal; color: #06a6b8;}
p { font: 12px 'HelveticaBold', Arial, sans-serif; color: #000;}
strong { font-weight: bold;}
em { font-style: italic;}
a, a:link, a:active { color: #07a5b8; -webkit-transition: all 0.2s ease-in; -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in;}
a:hover { color: #000;}
img { border: none;}
a img, a img:link { -webkit-transition: all 0.2s ease-in; -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -moz-opacity: 1; opacity: 1; filter: alpha(opacity=100);}
a img:hover { -moz-opacity: 0.7; opacity: 0.7; filter: alpha(opacity=70);}

/* General */

#general { width: 815px; height: 452px; padding: 0 0 20px 0; position: absolute; background: url(../img/puntosNegros.gif) repeat-x bottom left;}

#izquierda { width: 225px; height: 452px; float: left; position: relative;}
	#menu { position: absolute; bottom: 0px; font: 12px 'HelveticaBold', Arial, sans-serif;}
		#menu a, #menu a:link { color: #808080;}
		#menu a:hover { color: #000;}
		#menu ul { line-height: 18px;}
			#menu ul ul { font-size: 10px; line-height: 14px; padding: 0 0 5px 10px;}
		#menu li.destacado { color: #000;}
		#menu li.destacado a { color: #000;}

#derecha { width: 585px; height: 390px; padding: 72px 2px 0 0; float: right;}

/* Home */

.texto { padding: 40px 0 0 0;}
.es { font: 16px/17px 'HelveticaBold', Arial, sans-serif; padding: 0 0 10px 0; color: #06a6b8;}
.en { font: 16px/17px 'HelveticaBold', Arial, sans-serif; font-style: italic; color: #83d2db; }

/* nosotros */

.nosotros h2 { font-size: 22px; padding: 30px 0 0 0;}
.nosotros h4 { font-size: 12px; color: #000; padding: 0 0 50px 0;}

/* espacios */

.espacios { color: #FFF; background: #000;}
.espacios #general { background: url(../img/puntosblancos.gif) repeat-x bottom left;}
.espacios #derecha { height: 330px; padding: 102px 2px 0 0;}
.espacios #menu { font: 12px 'HelveticaBold', Arial, sans-serif;}
.espacios #menu li.destacado { color: #FFF;}
.espacios #menu a:hover { color: #FFF;}
.espacios p { font: 12px 'HelveticaBold', Arial, sans-serif; color: #FFF; padding: 30px 0 10px 0;}
.espacios #derecha p a.holz { font-size: 16px; color: #FFF;}
.espacios #derecha p a.holz:hover { font-size: 16px; color: #06a6b8;}

/* productos */

.productos { position: relative; overflow: hidden;} /* w: 585px */
.bloqueGrupos { width: 621px; height: 360px; position: absolute; top: 72px; left: 0px;} /* Ancho la suma de los Grupos */

.flechas { width: 585px; height: 20px; position: absolute; top: 437px; left: 0px;}
	.flechas .i { float: left;}
	.flechas .d { float: right;}

.grupo { float: left; width: 621px; height: 360px;}
.producto { width: 173px; height: 180px; float: left; padding: 0 34px 0 0;}
.producto .imagen { width: 171px; border: 1px #000 dotted; text-align: center;}
.producto .imagen img { height: 113px;}
.producto h5 { font: 12px/14px 'HelveticaBold', Arial, sans-serif; color: #808080; padding: 3px 0 2px 0;}
.producto .descripcion { display: block; width: 195px; font: 9px/10px 'HelveticaRoman', Arial, sans-serif; padding: 0 0 2px 0;}
.producto a { font: 10px/12px 'HelveticaRoman', Arial, sans-serif;}
.fotosAmpliables { display: none;}
.new { color: #06a6b8;}

/* galeria */

.exposiciones { position: relative; overflow: hidden;}
.exposicion img { float: left; padding: 0 0 0 20px;}
.exposicion .datosTexto { float: left; width: 400px; height: 360px; padding: 0 0 0 7px; position: relative; font: 10px 'HelveticaRoman', Arial, sans-serif;}
.exposicion .datosTexto p { font: 9px/10px 'HelveticaBold', Arial, sans-serif; padding: 0 0 10px 0;}
	.exposicion .datosTexto h5 { font: 12px 'HelveticaBold', Arial, sans-serif; color: #808080; width: 100%;}
	.exposicion .datosTexto .nombre { float: left; width: 100%;}
	.exposicion .datosTexto .fecha { float: left; width: 100%; padding: 0 0 13px 0;}
	.exposicion .datosTexto .about { font: 10px/11px 'GaramondItalic', Arial, sans-serif;}
	.exposicion .datosTexto .masInfo { position: absolute; bottom: 3px;}

/* mas */

.mas h2 { font-family: 'GaramondSBdIt', serif; font-size: 24px; padding: 30px 0 0 0; color: #808080;}

/* contacto */

.contacto { position: relative;}
.contacto .facebook { position: absolute; top: 427px; right: 32px; z-index: 20;}
.contacto .twitter { position: absolute; top: 427px; right: 7px; z-index: 20;}
/*
<div id="derecha" class="contacto">
		<a class="facebook" href="http://www.facebook.com/pages/espacioBRUT/208234302524629"><img src="img/f.jpg" alt="facebook" border="0" /></a>
		<a class="twitter" href="http://twitter.com/#!/espacioBRUT"><img src="img/t.jpg" alt="twitter" border="0" /></a>
		<a href="mailto:info@espaciobrut.com"><img src="img/contacto.jpg" alt="contacto" border="0" /></a>
	</div>

*/