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

.altura { height:570px !important}

.alerta { display:none} /* Solo aparece cuando se detecta el IE6 */


/* @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 { overflow:auto; height:100%}
.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; margin-top:20px }
.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}
.contacto .email { background:url(../images/email.gif) no-repeat; width:129px; height:14px; display:block; margin-bottom:10px }

/******* 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;}
.contacto .ie6seleccion div { overflow:auto; height:100%; width:50%; float:left}
.contacto .ie6seleccion label {  width:30px;  float:left; font-size:1.5em;}
.contacto .ie6seleccion input { float:left}
/******* /FORM *******/

/* 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 }
#mainNav li#actual a { top:10px; color:#333; font-weight:bold}




/* -- 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; overflow:auto; height:100%}

#cuerpo.noclear { overflow: hidden;}



 /* -- 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;}


	/* - PORTFOLIO - */
.tabs { position:absolute; right:0; top:15px;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:625px; width:220px; position:relative}

.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}

#twitter-box {position:absolute; bottom:30px; right:20px; width:200px; height:220px}
.twitterTime a { color:#999; font-weight:normal}
#tweet {  background:url(../images/bg-twt.gif) no-repeat; padding:25px 10px 5px 25px; height:195px; color:#585858}
#tweet li { margin:5px 0; font-size:1.1em; line-height:1.3em}
#twitter-link { padding-left:45px; font-size:1.2em; background:none}

.destacado { position:absolute; left:15px; top:250px; 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:70px; padding:62px 0px 0px;}
.destacado p {-webkit-transform: rotate(15deg); -moz-transform: rotate(15deg);}


 /* -- footer -- ===============================================================================================================  */
#footer { margin:auto; width:955px; 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}



.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 }

.ip { font-size:0.9em; color: #999;}
.ip strong { color:#666}



	/* 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;}