@charset "utf-8";


/***************** Estilos Generales **********************/

* { behavior: url(/css/resources/iepngfix.htc)}

body  {
	font: 12px/15px Georgia, serif;
	background: url(../imagenes/bg_tile.jpg);
	margin: 0; 
	padding: 0;
	text-align: center;
	color: #2B2B29;
}

h1 { font: Georgia, serif; font-size: 24px; margin-bottom:10px  }

p {	margin-bottom:10px}

a { color: #FF0042; font-weight:bold}
a:hover { color:#333333}

#wrapper_bg { background:url(../imagenes/bg.jpg) repeat-x}

#container {
	width: 810px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
} 

.claseColor { color:#FF0042}


/***************** Encabezado **********************/

#header {
	background: url(../imagenes/bg_header.jpg) 0 -17px no-repeat;
	height:150px;
	padding: 0
} 


#logo { float:left; background:url(../imagenes/logo-render.png) no-repeat; width: 114px; height:124px}
#slogan {float:left;padding:0;	width:auto; margin-top:50px}
#frase01 { font: Georgia, serif; text-transform: uppercase; font-size: 12px; letter-spacing:-1.5px}
#frase02 { font: Georgia, serif; text-transform: uppercase; font-size: 16px; letter-spacing:-1.5px}

#nav01 { float:right; background:url(../imagenes/bg-set.png) no-repeat; width:156px; height:40px; z-index:1; margin:0; color:#97988A}
#nav01 ul { margin:0 auto}
#nav01 ul li { float:left; margin-left:10px}
#links { width:140px; margin:5px auto}

a#home , a#sitemap, a#contact {display:block;width:16px; height:10px; overflow:hidden; text-indent:-9999px; margin-top:5px;}
#home {	background: url(../imagenes/icono-home.gif) no-repeat}
#sitemap { background: url(../imagenes/icono-sitemap.gif) no-repeat}
#contact{ background: url(../imagenes/icono-contact.gif) no-repeat}

a#home:hover , a#sitemap:hover, a#contact:hover {background-position: 0 -10px} 

#idiomas { font-family:Arial, Helvetica, sans-serif; text-align: center; font-size:9px; text-transform:uppercase; width:120px; margin:0 auto; padding:5px 0 !important; padding:10px 0}
#idiomas a { text-decoration:none;  color:#97988A}
#idiomas a:hover { color:#FFFFFF}

/***************** Menu Top **********************/
#menu {
	float:right;
	background:url(../imagenes/bg-menu.png) no-repeat;
	width:432px;
	height:27px;
	padding:15px 0px 15px 20px !important;
	padding:15px 10px 15px 14px;
	margin:30px 0 0 0 !important;
	margin:20px 0 0 0;
	z-index:2
}
#menu li { float:left; font-family: Arial, Helvetica, sans-serif; font-style: normal; letter-spacing: normal; font-size:11px; text-transform:uppercase; margin:8px 10px}
#menu li a { text-decoration:none; display:block; color:#FFFFFF}
#menu li a:hover { background:#2B2B29}


/***************** Lateral Izquierdo **********************/
#sidebar1 {
	float: left; 
	width: 190px;
	padding: 0;
}

#sidebar1 h3 {margin-bottom:10px; font: Georgia, serif; font-size: 13px; text-transform:uppercase;}


/***************** Menu de Trabajos **********************/
#nav02 { font-family: Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold; margin-bottom:20px}
#nav02 a { width:150px; display:block; cursor:pointer; text-decoration:none; color:#2B2B29; height:13px; padding:2px 5px }
#nav02 a:hover { background: url(../imagenes/arrow01.gif) right no-repeat #2B2B29; color:#FFFFFF}

/***************** Contenedor Principal **********************/

#mainContent {
	background:url(../imagenes/bg_wrapper.jpg) top center repeat-x;
	margin: 0 0 0 200px;
	padding: 20px 0 0 20px;
}

/***************** Galeria Home **********************/
#galeriaHome {
	margin: 10px auto;
	background:url(../imagenes/bg_wrapper.jpg)repeat-x top
}
#galeriaHome li { float:left; margin: 0 14px 10px 0; border:#000000 1px solid}

/***************** Thumbs Home **********************/

a#thumb01, a#thumb02, a#thumb03, a#thumb04, a#thumb05, a#thumb06, a#thumb07, a#thumb08, a#thumb09, a#thumb10, a#thumb11, a#thumb12 {display:block;width:180px; height:107px; text-indent:-9999px}

a#thumb01 {background: url(../imagenes/thumb-home01.jpg) top left no-repeat}
a#thumb02 {background: url(../imagenes/thumb-home02.jpg) top left no-repeat}
a#thumb03 {background: url(../imagenes/thumb-home13.jpg) top left no-repeat}
a#thumb04 {background: url(../imagenes/thumb-home04.jpg) top left no-repeat}
a#thumb05 {background: url(../imagenes/thumb-home05.jpg) top left no-repeat}
a#thumb06 {background: url(../imagenes/thumb-home06.jpg) top left no-repeat}
a#thumb07 {background: url(../imagenes/thumb-home07.jpg) top left no-repeat}
a#thumb08 {background: url(../imagenes/thumb-home08.jpg) top left no-repeat}
a#thumb09 {background: url(../imagenes/thumb-home09.jpg) top left no-repeat}
a#thumb10 {background: url(../imagenes/thumb-home10.jpg) top left no-repeat}
a#thumb11 {background: url(../imagenes/thumb-home11.jpg) top left no-repeat}
a#thumb12 {background: url(../imagenes/thumb-home12.jpg) top left no-repeat}

a#thumb01:hover, a#thumb02:hover, a#thumb03:hover, a#thumb04:hover, a#thumb05:hover, a#thumb06:hover, a#thumb07:hover, a#thumb08:hover, a#thumb09:hover, a#thumb10:hover, a#thumb11:hover, a#thumb12:hover {
	background-position: 0 -107px/* con esto cambiamos la porcion de imagen que se muestra */}
	
	
/***************** Listado General de Proyectos **********************/
#galeriaProyectos {
	margin: 0 auto;
	background:url(../imagenes/bg_wrapper.jpg)repeat-x top center
}
#galeriaProyectos li {
	float:left;
	margin: 0 13px 10px 0;
	border:#000000 1px solid;
	background-color:#0D0D0B;
	width:181px;
	height:180px;
	color:#FFFFFF
}
#galeriaProyectos li p { padding:5px} 
#galeriaProyectos li span { color:#FF0042}
	
/***************** Proyecto **********************/

#proyecto { background:url(../imagenes/bg_wrapper.jpg) repeat-x top center; padding-top:20px; width:auto; margin-bottom:20px}

#proyecto img { margin-bottom:15px}
#resumenProyecto { width:auto; margin:10px 0}

#up {
	float:right;
	background:url(../imagenes/up.jpg) no-repeat;
	width:38px;
	height:25px;
	text-align: right;
	margin-right:18px !important;
	margin-right:8px;
	cursor:pointer
}

#boton_volver {	float: right;margin-right: 8px !important; margin-right:2px}
#boton_volver a { font-family:Arial, Helvetica, sans-serif; font-size: 9px; display:block;text-decoration:none; background: url(../imagenes/back.jpg) no-repeat;color:#97988A; width:39px;padding: 5px;}
#boton_volver a:hover { color:#FFFFFF}

/***************** Servicios **********************/
#colum01, #colum02 { width:49%; float:left; margin:10px 0 0 0}
#colum01 {float: left}
#colum02 {float: right}

#colum01 ul , #colum02 ul { margin:10px 0}

#colum01 ul li, #colum02 ul li  { color:#FF0042}

/***************** Enlaces **********************/

#enlaces ul { margin-bottom:20px}
#enlaces li  { margin-bottom:10px}
#enlaces p { margin-bottom:20px}

/************************************************* Paginacion ******************************************/


.pager {clear: both;
	height: 1%; /* Fixes double padding in IE */
	background: #2B2B29;
	margin: 10px 15px 10px 0;
	border: 1px solid #313131;
	font-size: 0.8em;
	font-family: Tahoma, Arial, Helvetica, Sans-serif;
}

.pager a, .pager span { display: block;  float: left; padding: 0.3em 0.5em; margin-right: 0.1em; text-decoration: none;background: #3E3E3E;color: #fff}
.pager span {color: #868686}
.pager .current {background: #313131}
.pager a:hover {background: #FF0042}
.pagertop {	border-top: 0 none}
.pagerbottom {border-bottom: 0 none}
.pager ul {margin: 0;padding: 0}
.pager li {margin: 0;padding: 0}


/***************** Pie de Página **********************/

#footer { font-size:11px; 	padding: 0 10px 0 20px; background:url(../imagenes/bg_wrapper.jpg) top right repeat-x }

#footer ul{	width:99%; height:20px; margin:10px auto !important; margin:20px auto; float:right}
#footer ul li { float:right; margin: 0 0 10px 0}
#footer ul li a {color:#000000; text-decoration:none; margin:0 5px}
#footer ul li a:hover { text-decoration:underline}
 
#footer p {
	text-align:right;
	margin: 10px 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}

a.tags { font: Georgia, serif; color:#2B2B29; }
a.tags:hover { color:#333333; text-decoration:underline;}