/*
* { outline: 2px dotted red }
* * { outline: 2px dotted green }
* * * { outline: 2px dotted orange }
* * * * { outline: 2px dotted blue }
* * * * * { outline: 1px solid red }
* * * * * * { outline: 1px solid green }
* * * * * * * { outline: 1px solid orange } 
* * * * * * * * { outline: 1px solid blue }
*/


* {	margin:0; padding:0;}
body
{
	margin:0;
	font-family:Arial, Helvetica, sans-serif;
}

.body1
{
	background:url(../imagenes/fondo.jpg) top fixed ;
}

.body2{
	background:url(../imagenes/fondo2.jpg) top center no-repeat;
}

#contenedor
{
	position:absolute;
	left:582px;
	margin-left:-431px;
	width:1000px;
}

#contenido
{
	position:relative;
	margin-top:250px;
	margin-left:280px;
	background:none;
	width:750px;

}		


#contenedorPie
{
	text-align:center;
	width:950px;
	color: #FFFFFF;
}

#contenedorPie a
{
	color: #FFFFFF;
}


#pie
{
	position:relative;
	background:none;
	width:800px;
	height:20px;
	padding-bottom:0;
	margin-bottom:0;
	margin-top:-18px;
	text-align:center;
	font-size:11px;
	top: 100px;

}


.negritas{	font-weight:bold;}
.justificado{ text-align:justify;}
.cursiva{font-style:italic;}
.centrado{ text-align:center}
.fuente10{	font-size:10px;}
.fuente11{	font-size:11px;}
.fuente12{	font-size:12px;}
.fuente14{	font-size:14px;}
.fuente18{	font-size:18px;}
.blanco{ color:#FFFFFF;}
.blanco a{ color:#FFFFFF;}
.negro{ color:#000000;}
.negro a{ color:#000000;}
.azul{color:#152362;}
.azul a{color:#9A0000; text-decoration:none;}
.rojo{color:#9A0000;}
.rojo a{color:#152362; text-decoration:none;}
.interlineado{ line-height:20px;}
.parrafo{ margin-top:14px;}
.ligas{ text-decoration:none; color:#000000;}
.ligas a{ text-decoration:none; color:#000000;}
a { outline:0; }
div.transparencia { 
opacity: 0.6;
filter: "alpha(opacity=60)"; 
filter: alpha(opacity=60);   
zoom: 1;
}

.boxes { 
	border-bottom:1.5px outset #999999; 
	border-right:1.5px outset #999999; 
	border-left:1.5px outset #CCCCCC; 
	border-top:1.5px outset #CCCCCC;
	font-size:11px;
	font-weight:400;
	color: #000000;
	width:200px;
}

/*OPCIONALES*/

/*pone la imagen sustituyendo el bull*/
li
{
	margin:4px 0;
	list-style-image:url(../imagenes/bullet.gif);
}
/* fin pone la imagen sustituyendo el bull*/

#columnaIzq
{
	position:absolute;
	float:left;
	width:190px;
	height:473px;
	margin:5px;
	background:url(../imagenes/azul-izq.jpg) repeat-x;
	top: 225px;
	left: 174px;
}
#origen{
	background-color: #DE6D1D;
	height:60px;
	width:236px;
	}
#columnaDer
{
	position:relative;
	float:left;	
	width:160px;

}
#columna1
{
	position:relative;
	float:left;
	width:130px;
	display:inline;


}#columna2
{
	position:relative;
	width:130px;
	float:right;


}columnaMedio
{
	padding:150px 0px 0px 0px;

}
/*BOTON*/
a#replaced
{
	display:block;
    width:71px;
	height:61px; /* aqui esta el truco */
    text-indent:-9999px;
	background:url(../imagenes/inicio.png);
}

a#replaced:hover
{
	
	background-position:0 -61px;
}
/*BOTON*/

.Fizquierda
{
	float:left;
	padding-left:10px;
}
.Fderecha
{
	float:right;
	padding-right:10px;
}
ul.columnas {
Float: left;
width: 100%; /*Este ancho será el total que ocupen muestras columnas */
List-style-type: none; /*Eliminamos las viñetas */
}

/*Definimos las propiedades para <li> a partir de las otorgadas a <ul>*/

ul.columnas li{
Display:inline; /*Se declara que las propiedades serán otorgadas a cada linea*/
Float: left;
Width:33%;} /*Al definir el ancho definimos también el número de columnas, siendo 25% para 4 columnas, 33% para 3, 50% para 2 y asi para la cantidad de columnas que deseemos */
.imagen
{
	position:absolute;
	width:432px;
	height:616px;
	left: 13px;
	top: 197px;
}

#menu
{
	padding-top:50px;
}

.Estilo2 {
	color: #666666;

	font-size: 12px;
	font-weight: bold;
}
.Estilo3 {
	color: #032D5F;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px; 
	font-weight: bold;
}
.Estilo4 {color: #000000; font-weight: bold;  font-size: 14px; }

.Estilo6 {
	font-size: 14px;
	font-weight: bold;
	color: #000000;
	font-family: Arial, Helvetica, sans-serif;
}
.Estilo7 {
	color: #666666;
	font-weight: bold;
	}


#tabla{
	margin-left:50px;
	}

.espacio{ height:450px;}

#text{
	width:236px;
	height:50px;
	background-color:#DE6D1D;
	padding-top:50px;
	}
#logo {
	position:absolute;
	left: 18px;
	top: -225px;
	}
#somos:hover,#servicios:hover,#productos:hover,#cotizaciones:hover,#certificados:hover,#galeria:hover,#contacto:hover{ background-color:#003300; color:#FFFFFF; cursor:pointer;}

.botones{
	width:92px;
	height:130px;
	background-color:#DE6D1D;
	color:#000000;
	font-family: "Copperplate Gothic Light";
	font-size: 9PX; 
	font-weight: bold;
	margin-top:50px;
	
}


#somos{
	position:absolute;
	left: 316px;
	top: 4px;
	}
#servicios{
	position:absolute;
	left: 414px;
	top: 4px;
	}
#productos{
	position:absolute;
	left: 513px;
	top: 4px;
	}
#cotizaciones{
	position:absolute;
	left: 612px;
	top: 4px;
	}
#certificados{
	position:absolute;
	left: 711px;
	top: 4px;
	}
#galeria{
	position:absolute;
	left: 810px;
	top: 4px;
	}
#contacto{
	position:absolute;
	left: 908px;
	top: 4px;
	}
.titulo{
	color: #FFFFFF;
	font-family: "Copperplate Gothic Light";
	font-size: 22PX; 
	font-weight: bold;
}

.context{
	color:#FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12PX;
	text-align:justify;
}

.oculto{ display: none;	visibility:hidden; }
	
.muestra{
	position: relative;
	float: right;
	width:580px;
	text-align:justify;
	}

.muestra2{
	position: absolute;
	width:450px;
	text-align:justify;
	left: 145px;
	top: 59px;

	}	
#intro{
	width:565px;
	height:330px;
	background-color:#DE6D1D;
	padding-top:20px;
	}