/** 
 *  
 * 471.WEB.CS
 * version 1; 2009/09
 * 
 * autor	runroom
 * copyright    2009 by runroom
 * 
 * color	#aabbcc; fondo contenido
 * 
 * 
 */ 


/********************************************* RESET *********************************************/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, center, u, b, i {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: normal;
	font-style: normal;
	font-family: inherit;
	vertical-align: baseline;
}
ol, ul {
	list-style: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
input, textarea {
	margin: 0;
	padding: 0;
}
strong {
	font-weight: normal;
	color: #fff;
}
em {
	font-style: italic;
}
a { text-decoration: none; color: #26ace5; }
	a:hover { text-decoration: underline; }

.left {
	float: left;
}
.right {
	float: right;
}
/********************************************* GENERAL *********************************************/

body {
	font: normal 12px/1.5 Arial, Helvetica, sans-serif;
	color: #666;
	text-align: center;
}


/********************************************* HEADER *********************************************/

.header {
	width: 970px;
	height: 49px;
	overflow: hidden;
	text-align: left;
	margin: 0 auto;
}
.header .logo {
	float: left;
	padding: 18px 0 0 11px;
	background-color: #000;
	height: 49px;
	width: 445px;
}
.header a {
	color: #999;
}
.header a:hover, .header .actual a {
	color: #fff;
}
.header h1 {
	display: none;
}
.header .menu, .header .idiomas {
	float: right;
}
.header .menu {
	overflow: hidden;
}
.header .menu li.first {
	border-left: 1px solid #333;
}
.header .menu li {
	display: block;
	float: left;
	margin-right: 1px;
	border: none;
}
.header .menu li a {
	display: block;
	width: 57px;
	height: 26px;
	padding-left: 5px;
	padding-top: 23px;
	background-color: #000;
}
.header .menu li a:hover {
	text-decoration: none;
	color: #fff;
	filter: alpha(opacity=60);
	-moz-opacity: .6;
	opacity: .6;
}
.header .menu li.actual a {
	text-decoration: none;
	background: url(images/bg-header-actual.gif) repeat-x 0 bottom;
}
.header .menu li.actual a:hover {
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	opacity: 1;
}
.header .idiomas {
	display: block;
	background-color: #000;
	padding: 0 11px 0 60px;
}
.header .idiomas li {
	display: block;
	float: left;
	margin-left: 10px;
	height: 26px;
	padding-top: 23px;
}


/********************************************* WRAPPER *********************************************/

.wrapper {
	width: 970px;
	text-align: left;
	margin: 1px auto 0 auto;
	overflow: hidden;
	background-color: #000;
	padding-top: 40px;
}
.content-container {
	width: 830px;
	margin: 0 0 0 70px;
	/* overflow: hidden; */
	text-align: left;
	margin: 0 auto;
}
.content-ancho {
	width: 885px;
	overflow: hidden;
	text-align: left;
	margin: 0 auto;
	position: relative;
}
.content {
	/* overflow: hidden; */
	margin-bottom: 80px;
}


/********************************************* HOME *********************************************/

.portada {
	overflow: hidden;
	text-align: center;
	margin-bottom: 40px;
	border-bottom: 1px solid #333;
}

.portada a img{
	max-width: 828px; 
	border: 1px solid #000;
}
.portada a:hover img{
	border: 1px solid #25ace6;
}

.portada h2 {
	text-align: left;
}
.portada-content {
	/*background: url(images/bg-descripcion.gif) repeat 0 0;*/
	margin: 0 auto;
	padding: 30px 0;
}
.portada-content img {
	margin: 0 auto 11px auto;
}
.portada-content p {
	width: 672px;
	margin: 0 auto;
}
.portada-content a {
	color: #999;
	text-decoration: underline;
}
h2 {
	font: bold 12px/1.3 Arial, Helvetica, sans-serif;
	margin: 0 0 9px 4px;
	color: #fff;
	letter-spacing: 3px;
}
.proyecto, .detalle-proyecto {
	clear: both;
	/* overflow: hidden; */
}
.proyecto a img, .detalle-proyecto a img {
	max-width: 828px; 
	border: 1px solid #000;
}
.proyecto a:hover img, .detalle-proyecto a:hover img {
	border: 1px solid #25ace6;
}
.proyecto .descripcion {
	padding: 11px;
	border-bottom: 1px solid #333;
	/*background: url(images/bg-descripcion.gif) repeat 0 0;*/
}
h3 {
	font: normal 12px/1.3 Arial, Helvetica, sans-serif;
	color: #fff;
	letter-spacing: 3px;
}
.proyecto .descripcion .detalle a {
	font-size: 11px;
	background: url(images/flecha-detalle.gif) no-repeat 0 50%;
	padding-left: 13px;
}
.proyecto .descripcion .detalle a:hover {
	background: url(images/flecha-detalle-hover.gif) no-repeat 0 50%;
	color: #fff;
}
.proyecto .descripcion .detalle {
	margin-top: 4px;
}


/********************************************* PROYECTOS *********************************************/

.listado-proyectos {
	margin-bottom: 30px;
}

.last {
/*	margin-bottom: 70px !important; */
}
.fila-proyectos {
	overflow: hidden;
	background: url(images/bg-fila-proyectos.jpg) repeat-x 0 0;
	padding: 26px 0 26px 27px;
	margin-bottom: 2px;
}
.fila-proyectos li {
	margin-right: 10px;
}
.fila-proyectos li, .fila-proyectos li img, .fila-proyectos li span {
	display: block;
	float: left;
	width: 110px;
	text-align: center;
}
.fila-proyectos a {
	color: #999;
}
.fila-proyectos a img {
	border: 1px solid #000;
}
.fila-proyectos a:hover span {
	color: #fff;
	text-decoration: underline;
}
.fila-proyectos a:hover img {
	border: 1px solid #25ace6;
}
.proyecto-header {
	overflow: hidden;
	margin-top: 20px;
	border-bottom: 1px solid #333;
}
.proyecto-header h2 {
	font: normal 16px/1.3 Arial, Helvetica, sans-serif;
	float: left;
	margin-left: 0;
}
.proyecto-header p {
	float: right;
}
.proyecto-header p a, .versite a {
	color: #999;
}

	.versite a:link, .versite a:visited { text-decoration: none; }
	.versite a:hover, .versite a:active { text-decoration: underline; }

.proyecto-header .listado a {
	color: #25ace6;
}

p.tags {
	margin-top: 12px;
	padding-bottom: 12px;
	border-bottom: 1px solid #333;
}

.detalle-descripcion {
	padding: 11px 11px 0 11px;
	border-bottom: 1px solid #333;
	/*background: url(images/bg-descripcion.gif) repeat 0 0;*/
	color: #ccc;
}
.detalle-descripcion p {
	margin-bottom: 17px;	
}
.detalle-descripcion a {
	color: #999;
	text-decoration: underline;
}
.detalle-proyecto {
	margin-top: 17px;
}
.detalle-proyecto h3 {
	font: bold 12px/1.3 Arial, Helvetica, sans-serif;
	margin: 0 0 9px 4px;
	color: #fff;
	letter-spacing: 3px;
}
.detalle-proyecto .info {
	padding: 11px;
	border-bottom: 1px solid #333;
	text-align: center;
}
.detalle-proyecto .pdf {
	margin-top: 9px;
}
.detalle-proyecto .pdf a {
	background: url(images/pdf.gif) no-repeat 0 50%;
	padding-left: 13px;
}
.nav {
	overflow: hidden;
	margin-top: 40px;
	padding-bottom: 9px;
	border-bottom: 1px solid #333;
}

.nav a {
	color: #999;
}
.nav .listado a, .listado a {
	color: #25ace6;
}
.nav a:hover {
	color: #fff;
	text-decoration: underline;
}
.nav .ant {
	float: left;
	background: url(images/ant.gif) no-repeat 0 50%;
	padding-left: 26px;
	width: 250px;
}

.listado {
	padding-left: 14px;
}

.nav .listado {
	background: url(images/listado.gif) no-repeat 0 50%;
	text-align: center;
	width: 262px;
	float: left;
	background: none;
}

.nav .sig {
	background: url(images/sig.gif) no-repeat right 50%;
	padding-right: 26px;
}


/********************************************* SERVICIOS *********************************************/

.servicios img {
	max-width: 830px;
	margin-bottom: 30px;
}
.servicios img.last {
	margin-bottom: 0;
}


/********************************************* BIO *********************************************/

.bio {
	margin-top: 40px;
	color: #ccc;
}
.bio p {
	margin-bottom: 17px;
}


/********************************************* PRENSA *********************************************/

.prensa-header {
	position: relative;
	z-index: 100;
}
.prensa-header h2 {
	float: left;
	margin: 2px 34px 15px 4px;
}
.fila-prensa {
	overflow: hidden;
	clear: both;
	margin-bottom: 2px;
	color: #999;
	position: relative;
	z-index: 1;
	background: url(images/bg-fila-proyectos.jpg) repeat-x 0 0;
}
.fila-prensa li {
	padding: 20px 23px 26px 27px;
	z-index: 2;
}
.fila-prensa li, .fila-prensa li img, .fila-prensa li span {
	display: block;
	float: left;
	width: 170px;
	margin-bottom: 4px;
}
.fila-prensa li span.medio {
	color: #fff;
	margin-bottom: -4px;
}
.fila-prensa li .pdf a {
	background: url(images/pdf.gif) no-repeat 0 50%;
	padding-left: 13px;
	clear: both;
}


/********************************************* SELECTS *********************************************/

.prensa-select {
	float: left;
	width: 181px;
	margin-right: 9px;
}
.prensa-select ul li a, .select ul li a:visited {
	display:block;
	text-decoration:none;
	height:20px;
	color:#fff;
	background: url(images/bg-select-header.jpg) no-repeat 0 0;
	font-size:11px;
	overflow:hidden;
	width: 171px;
	padding: 2px 0 0 10px;
}
.prensa-select ul li li a, .select ul li li a:visited {
	float: left;
	width: 171px;
}
.prensa-select ul {
	padding:0;
	margin:0;
	list-style: none;
}
.prensa-select ul li {
	float:left;
	position:relative;
}
.prensa-select ul li ul {
	display: none;
}
.prensa-select ul li:hover a {
	background: url(images/bg-select-header-hover.jpg) no-repeat 0 0;
}
.prensa-select ul li:hover ul {
	display:block;
	position:absolute;
	top: 15px;
	left:0;
	width: 181px;
	padding: 11px 0 15px 0;
}
.prensa-select ul li:hover ul { background: #000 url(images/bg-select.jpg) no-repeat 0 0; }
	.prensa-select ul li ul { -webkit-border-radius: 5px; -moz-border-radius: 5px; }

.prensa-select ul li:hover ul li a.hide {
	background:#6a3;
	color:#fff;
}
.prensa-select ul li:hover ul li:hover a.hide {
	background:#6fc;
	color:#000;
}
.prensa-select ul li:hover ul li ul {
	display: none;
}
.prensa-select ul li:hover ul li a {
	display:block;
	background: none;
	color:#fff;
	width:149px;
	padding-left: 30px;
	margin: 0 1px;
}
.prensa-select ul li:hover ul li a:hover {
	background:#272727;
	color:#26ace5;
}
.prensa-select ul li:hover ul li:hover ul {
	display:block;
	position:absolute;
	left:105px;
	top:0;
}
.prensa-select ul li:hover ul li:hover ul.left {
	left:-105px;
}

#content {
	position: relative;
	z-index: 1;
}


/********************************************* CONTACTO *********************************************/

.contactar {
	padding: 11px 11px 20px 11px;
	border-top: 0;
	border-bottom: 1px solid #333;
	/*background: url(images/bg-descripcion.gif) repeat 0 0;*/
	color: #ccc;
}
.contactar .info {
	clear: both;
	overflow: hidden;
}
.contactar .info p {
	width: 192px;
	float: left;
	padding-right: 10px; 
}

.content img.contactar {
	margin-top: 2px;
	padding: 0 0 1px 0;
	border-bottom: 1px solid #333;
	background: none;
}


/********************************************* FOOTER *********************************************/

.footer {
	clear: both;
	overflow: hidden;
	margin-bottom: 50px;
}
.footer .menu {
	clear: both;
	overflow: hidden;
	padding: 0 0 11px 11px;
	margin-bottom: 23px;
	border-bottom: 1px solid #333;
	height: 1%;
	letter-spacing: 1px;
}
.footer .menu a {
	color: #999;
}
.footer a.runroom {
	color: #999;
	text-decoration: underline;
}
.footer a.actual, .footer .menu a:hover, .footer .info a:hover {
	color:#fff;
}
.footer .menu {
	padding: 0 10px;
}

.footer .menu li {
	display: block;
	float: left;
	width: 149px;
}
/*.footer .menu li:last-child {
	width: 65px;
	text-align: right;
}*/

.footer .menu li#contacto {	
	width: 65px;
	text-align: right;
}

.footer .info {
	clear: both;
	overflow: hidden;
	padding-left: 11px;
}
.footer .info p {
	width: 210px;
	float: left;
}
.footer .info p.runroom {
	float: right; 
	width: 140px;
}

/* MISCELLANEA
--------------------------------------------------------------------------------*/
	.clear { clear: both; }

/* volver arriba */
	#gototop { position: fixed; right: 20px; bottom: 40px; display: none; }
		#gototop a { display: block; padding: 20px 10px 5px 10px; color: #999; /* background: url(images/volver_arriba.png) 50% 0 no-repeat; */ }



/* SCROLLABLE 
--------------------------------------------------------------------------------*/

.thumbs { position: relative; left: -30px; width: 888px; height: 98px; background: url(images/fondo_thumbs.gif) 30px 0 no-repeat; z-index: 100; }

/* div que contiene el ul con scroll */
.scrollable {
	
	top: 9px;
	left: 30px;
	position: relative;
	overflow: hidden;		
	width: 820px;
	height: 78px;	

}

/* elemento (en este caso, un ul) que contiene los items que se mueven */
.scrollable .items {
	width: 20000em;
	position: absolute;
	list-style: none;
}

.scrollable .items {
	list-style: none;
}

/* single scrollable item */
.scrollable .items li {
	float: left;
	padding-left: 9px;
}

/* active item */
.scrollable .items li.active { border: none; }

.items .active {
	border: none;
}

a.prev, a.prevPage, a.next, a.nextPage { display: none; }

/* flechas anterior siguiente */
a.prev, a.prevPage, a.next, a.nextPage { position: absolute; top: 40px; display: block; width: 17px; height: 11px; z-index: 200; cursor: pointer; }
	a.prev, a.prevPage { left: 0; background: url(images/fl-izquierda.gif) 0 0 no-repeat; }
	a.next, a.nextPage { right: 0; background: url(images/fl-derecha.gif) 0 0 no-repeat;  }

/* hovers flechas */
	a.prev:hover, a.prevPage:hover { background: url(images/fl-izquierda.gif) 0 0 no-repeat; }
	a.next:hover, a.nextPage:hover { background: url(images/fl-derecha.gif) 0 0 no-repeat; }


/* puntitos de navegacion */
/*.navi {
	margin: -28px 150px 0 auto;
	width: 200px;
	height: 20px;
}*/
	/* items inside navigator */
	/*.navi a {
		width: 8px;
		height: 9px;
		float: left;
		margin: 3px;
		background: url("css_imgs/navigator.png") 0 0 no-repeat;
		display: block;
		font-size: 1px;
	}	
		.navi a:hover { background-position: 0 -14px; }
		.navi a.active { background-position: 0 -27px; }*/

/* flecha invisible cuando no hay mas */
	a.disabled { 
		visibility: hidden !important;
		/* filter: alpha(opacity=50);
		-moz-opacity: 0.5;
		-khtml-opacity: 0.5;
		opacity: 0.5; */
		/* background: #f1f1f1 !important; */
	}