/* Comun con todo el sitio ===============================================================================================================  */
body {background:url(../images/bg-body.jpg) repeat-x fixed; background-color:#d3d3d3}

.altura { height:570px !important}



/* @Predeterminado ===============================================================================================================  */

#contenedor { width:955px; margin:auto; background-color:#FFF;  }

#header { height:60px; position:relative}

h1 {  position:absolute; top:15px; }
h1 a {    display: block;    width: 100%;    height: 100%;  }
br { line-height:1.1em}

h2 { font-size:1.7em; line-height:2.2em; color:#821122}
h2:before {content:"# "}

strong { font-weight:bold; color:#821122}
sup { font-weight:bold; font-size:1.2em; color:#821122}
abbr {cursor:help}
em { color:#333; font-weight:bold}

a { color:#821122; text-decoration:none}
a:hover { text-decoration:underline} 
a:visited {color:#821122 }
a[onclick^='window'] {background:url(../images/vinculo-externo.gif) no-repeat right top; padding-right:15px}

/* ultimos trabajos */
#trabajos {     
  padding: 5px;      
  border:  5px solid #821122;  
  width:  710px;   
  height: 290px;    
  padding: 0;     
  margin:  0; 
  position:relative  } 
 
#trabajos img {    

  position:absolute;
	top:0px;
	left:0px;
 } 
/* The slices in the Slider */
.nivo-slice {
	display:block;
	position:absolute;
	z-index:50;
	height:100%;
}
/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav a {
	position:absolute;
	top:45%;
	z-index:99;
	cursor:pointer;
}
.nivo-prevNav {
	left:0px;
}
.nivo-nextNav {
	right:0px;
}
/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav a {
	position:relative;
	z-index:99;
	cursor:pointer;
}
.nivo-controlNav a.active {
	font-weight:bold;
}
 

	/* Tablas */
table caption { background-color:#821122;border-bottom:3px solid #821122;color:#FFFFFF;font-size:1.2em;font-weight:normal;margin-top:20px;padding:3px;text-align:center;  }
table thead th { font-weight:bold; padding:10px 0 15px; text-align:center; color:#000;border-bottom:solid 1px #821122; background-color:#EEEEEE;border:solid 2px #fff}
table thead th:first-child { border-bottom:none}
table tbody th { vertical-align:top; padding:5px; color:#821122;width:10%; border-right:solid 1px #821122;background-color:#EEEEEE;border:solid 2px #fff}
table thead th.first { border-top:solid 1px #821122; border-left:solid 1px #821122}
table thead th.last { border-top:solid 1px #821122; border-right:solid 1px #821122}
table tbody td.first { border-bottom:solid 1px #821122; border-left:solid 1px #821122}
table tbody td.last { border-bottom:solid 1px #821122; border-right:solid 1px #821122}

table td { padding:5px; background-color: #F6F6F6; border:solid 2px #fff}
table.columnas3 td { width:28%;}
.columnas2 div { width:50%; text-align:center; float:left; height:200px; margin:20px 0}
.columnas2 div  p { height:50px}
.columnas2 div img { border:solid 7px #821122}
.columnas2 div  strong { font-size:1.5em}
.columnas2 div em { font-weight:normal; color:#999}
table {border-collapse:collapse}

	/* Solicitar Presupuesto (contacto) */
.contacto label em { color: #821122; font-weight:normal}
.contacto fieldset { border:solid 1px #821122; padding:10px; }
.contacto legend { padding:0 10px; margin:10px 0}
.contacto span { display:block; margin-bottom:5px}
.contacto label { display:block; padding-bottom:3px}
.contacto input, 
.contacto textarea { width:380px; border: ridge 2px #ccc; background-color:#F6F6F6;padding:4px; color:#777; line-height:1.5em; font-family: Arial, Helvetica, sans-serif; font-size:1.1em}
.contacto textarea { height:40px; overflow-x:scroll}
.contacto input:focus, 
.contacto textarea:focus {border:inset 2px #ccc; background-color:#D3FCAB;  }
.contacto .btnsubmit,
.contacto input[type="submit"] { border:solid 1px #777; cursor:pointer; background-color:#821122; color:#fff; font-weight:bold; display:block; margin:10px 0 20px; width:415px}
.contacto input[type="submit"]:hover { color:#CCC}
.contacto .radio input { width:20px; border:none; background:none; padding:0;}
.contacto .focus {border:solid 1px #FF0 !important;  background-color: #FFC !important;}
.contacto .correcto {border:solid 1px #ccc; background-color:#D3FCAB; }
.contacto .error { background-color:#F4B9B9; border:solid #F00 1px}
.contacto fieldset span { color: #F00; background:url(../images/ico-atencion.gif) no-repeat left; padding-left:25px; line-height:2em}


/* menu principal =============================================================================================================== */
#mainNav { position:absolute; right:10px; top:0; }
#mainNav li {float:left; background-color:#821122 }
#mainNav li a {display:block;  height:20px; position:relative; color:#821122; text-transform:uppercase; text-decoration:none; padding:20px 10px 0; background-color:#FFF; margin-top:5px; text-align:center }




/* -- cuerpo -- ===============================================================================================================  */
 
#cuerpo { /*-moz-box-shadow:#656565 0 5px 6px;-webkit-box-shadow:#656565 0 5px 6px; box-shadow:#656565 0 5px 6px;*/ border-bottom:solid 5px #821122; position:relative; min-height:400px}



 /* -- principal -- ===============================================================================================================  */
#principal {font-size:1.2em; line-height:1.4em; float:left; padding-right:5px; width:730px }
.contacto #principal { width:420px}
#principal p { padding-bottom:0.5em; }
#principal h3 { margin-bottom:10px; margin-top:20px }
.portfolio #principal h3 { margin-bottom:0}
#principal h3 a { color:#fff; text-decoration:none }
#principal h3 a:hover { color:#FC0}
.portfolio h2 {margin-bottom:15px;}

.seccion.usarcss  {}


	/* - PORTFOLIO - */


.tabs { position:absolute; right:0; top:10px;margin-right:10px;}
.tabs li { float:left; font-size:1.1em}
.tabs li a { color:#333;padding:10px 5px 5px;background-color:#e1e1e1; height:20px}
.tabs a:active {outline:none;}
ul.tabs li a:hover {padding:10px 5px 5px; font-size:1.1em; background-color:#821122; text-decoration:none; color:#fff}
ul.tabs li.current a:hover, ul.tabs li.current a {color:#fff;	font-weight:bold;	text-decoration:none;	font-size:1.4em; background-color:#821122;padding:8px 5px 8px;}

 



/* -- sidebar -- ===============================================================================================================  */
#sidebar { background:url(../images/pagecurl.jpg) no-repeat; float:left; min-height:400px; width:220px; position:relative}
.inicio #sidebar { min-height:570px; }
.inicio #sidebar img { position:absolute; bottom:10px; right:20px}


.sidebarxtra { float:right; width:260px; padding-top:15px; font-size:1.1em; background:url(../images/bg-divisor.jpg) no-repeat left center; height:400px; padding-left:35px} /* para la columna de contacto */
.sidebarxtra h3 { line-height:2em; font-weight:bold} 
.sidebarxtra p { line-height:2.2em}


 /* -- footer -- ===============================================================================================================  */
#footer { margin:auto; width:980px; text-align:center; padding:15px 0; background:url(../images/bg-footer1.png) repeat-x; line-height:1.3em}



/* Clases ===============================================================================================================  */

.columnas { clear:both; }
.columnas li {float:left; margin:0 5px 10px; position:relative; padding:0 0 30px 0;}
.columnas li:first-child {margin-left:0}
.columnas li:last-child {margin-right:0}

.columnas.col3 li { width:235px; } /* 3 columnas */
.columnas.col3 li ul li { width:222px}
.columnas.col4 li { width:172px; } /* 4 columnas */
.columnas.col4 li ul li {width:159px !important}
.usarcss h3,
.columnas h3 { background-color:#821122; color:#FFF; padding:3px 5px 3px; -moz-border-radius:5px; font-size:1.2em; margin:5px 0 5px; -webkit-border-radius: 5px; border-radius: 5px;  }

.lista { margin:10px 0}
.lista li { background:url(../images/bullet.gif) no-repeat left 6px; padding-left:13px; line-height:1.8em; margin:0 !important }

.pagecurl { position:absolute; background:url(../images/pagecurl.jpg) no-repeat; width:200px; height:395px; z-index:1; left:0; top:0}

.destacado { position:absolute; left:10px; top:235px; z-index:50; color:#821122; text-decoration:none;  font-size:1.2em; line-height:1.6em; text-align:center; background:url(../images/destacado.gif) no-repeat; width:200px; height:165px; padding:98px 0px 0px;-webkit-transform: rotate(15deg); -moz-transform: rotate(15deg);}

.twitter { background:url(../images/img-twitter.jpg) no-repeat !important; width:30px;  height:30px; display:block}

.nota { font-size:0.9em; background:#f1f1f1; padding:5px; clear:both}

.lista.servicios li { padding:0 0 0 13px; margin-left:5px   }
.lista.servicios li:first-child { margin-left:5px}

.destacartxt { font-size:1.5em; line-height:1.7em; background-color:#FFC; display:block; padding:5px; text-align:center; margin:10px 0; clear:both }


	/* botones grales 
	===================  */
a.btn {  position:absolute; right:5px; bottom:5px;  border:0;   cursor:pointer;   font-weight:bold;   padding:0 10px 0 0;   text-align:center; text-decoration:none;   background:url(../images/bg-btn-right.gif) right no-repeat;   font-size:1em; font-family:Tahoma; _width:75px  }
a.btn span {   position:relative;   display:block;   white-space:nowrap;   padding:0 0 0 10px;  height:20px;   line-height:20px;  background:url(../images/bg-btn-left.gif) left no-repeat;  color:#821122; }
a.btn:hover {	background:url(../images/bg-btn-right-hover.gif) right no-repeat; }
a.btn:hover span {	background:url(../images/bg-btn-left-hover.gif) left no-repeat; color:#333 }


	
	/* ClearFix */
.clearfix {	display: inline-table;/* Hides from IE-mac \*/	height: 1%;	display: block;/* End hide from IE-mac */}
html>body .clearfix {	height: auto;}
.clearfix:after {	content: "."; 	display: block; 	height: 0; 	clear: both; 	visibility: hidden;}





/******* FORM *******/

#solicitarPresupuesto input.error{
	background: #f8dbdb;
	border-color: #e77776;
}

#solicitarPresupuesto textarea.error{
	background: #f8dbdb;
	border-color: #e77776;
}

#solicitarPresupuesto div span.error{
	color: #e46c6e;
}
#error{
	margin-bottom: 20px;
	border: 1px solid #efefef;
}
#error ul{
	list-style: square;
	padding: 5px;
	font-size: 11px;
}
#error ul li{
	list-style-position: inside;
	line-height: 1.6em;
}
#error ul li strong{
	color: #e46c6d;
}
#error.valid ul li strong{
	color: #93d72e;
}
/******* /FORM *******/