@charset "utf-8";
@import url(iconize.css);
@import url(cuadroImagen.css);
@import url(formulario.css);
@import url(links.css);

body{
	margin:0;
	padding:0;
	background-image:url(images/bg2.png.png);
	background-repeat:repeat-x;
}
#main{
	margin:0px auto;
	width:700px;
	height:500px;
	text-align:left;
	background-color:#FFFF99;
}
#bgHead{
	margin: 7px auto 0px auto;
	width: 700px;
	height: 15px;
	background-image: url(images/bghead.png);
	background-repeat: no-repeat;
}
.cuadrofoot{
width: 700px;
height: 15px;
color:#996633;
background-color:#FFFF99;
text-align:center;
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
margin: 0px auto 0px auto;
}

#bgFoot{
	text-align:center;
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
	font-weight:bold;
	margin: 0px auto 0px auto;
	width: 700px;
	height: 15px;
	color:#666666;
	background-image: url(images/bgfoot.png);
	background-repeat: no-repeat;
}
#bgMiddle{
	text-align:center;
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
	color:#996633;
	font-weight:bold;
	margin: 0px auto 0px auto;
	width: 700px;
	height: 15px;
	background-image: url(images/bgmiddle.gif);
	background-repeat: no-repeat;
}
#headSite{
	padding: 0px;
	margin: 0 auto;
	width: 700px;
	height: 100px;
	background-image: url(../images/headPlano.png);
}
#foot{
	width: 700px;
	height: 15px;
	background-image: url(images/bgfoot.gif);
	background-repeat: no-repeat;
	padding:0px;
	margin:0 auto;
}
#bWrap{
	padding:0px;
	margin:0 auto;
	width:700px;
	text-align:center;
}
#content{
	padding:0px;
	margin:0 auto;
	width:700px;
	height:800px;
	text-align:center;
}
#left{
	margin:0px auto;
	float:left;
	width:118px;
}
#right{
	margin:0px auto;
	float:right;
	width:580px;
	height:490px;
	overflow:auto;
    word-wrap: break-word;
	overflow-x: hidden;
}
.rightContent{
  	font-family:Arial, Helvetica, sans-serif;
	color:#993300;
	/*color:#FF6600;*/
	font-size:12px;
	margin-top:0px;
	margin-left:5px;
	margin-right:5px;
	text-align:justify;
}
img{
	margin:0px;
	padding:0px;
}
#button{
	text-align:center;
	float:left;
	list-style:none;
	margin:0;
	padding:0;
}

a{
outline: 0;
}
a:hover{
color:#FF9900;
}


/*botones*/
#button li{
	float:left;
	list-style:none;
	/*border-bottom:1px solid #000;*/
	/*border-left:1px solid #FFF;*/
}
#button li a{
	display:block;
	width:117px;
	height:20px;
	outline: 0;
}
.noticias, .espanol, .ingles, .frances, .principal, .servicios, .tarifas, .links, .ubicacion, .noticias, .links, .galeria , .contacto{
	margin:0;
	padding:0;
	width:117px;
	height:20px;
}

.espanol{
	background-image: url(images/es.png);
	background-position: top;
}.ingles{
	background-image: url(images/en.png);
	background-position: top;
}.frances{
	background-image: url(images/fr.png);
	background-position: top;
}
.espanol:hover{
	background-position: bottom;
}
.ingles:hover{
	background-position: bottom;
}
.frances:hover{
	background-position: bottom;
}
.noticias{
background-image:url(images/noticias.png);
background-position:top;
}
.noticias:hover{
background-position:bottom;
}
.principal{
	background-image: url(images/home.png);
	background-position: top;
}
.principal:hover{
	background-position: bottom;
}
.servicios{
	background-position: top;
	background-image:url(images/servicios.png);
}
.servicios:hover{
	background-position: bottom;
}
.ubicacion{
	background-position: top;
	background-image:url(images/ubicacion.png);
}
.ubicacion:hover{
	background-position: bottom;
}
.tarifa{
	background-position: top;
	background-image:url(images/tarifa.png);
}
.tarifa:hover{
	background-position: bottom;
}
.galeria{
	background-position: top;
	background-image:url(images/galeria.png);
}
.galeria:hover{
	background-position: bottom;
}
.news{
	background-position: top;
	background-image:url(images/news.gif);
}
.news:hover{
	background-position: bottom;
}
.links{
	background-position: top;
	background-image:url(images/link.png);
}
.links:hover{
	background-position: bottom;
}
.contacto{
	background-position: top;
	background-image:url(images/contacto.png);
}
.contacto:hover{
	background-position: bottom;
}
.funcionarios:hover{
	background-position: bottom;
}
.toe{
	margin:0;
	padding:0;
	cursor:default;
	width:117px;
	height:15px;
	background-image: url(images/toe.png);
}
.toeFlag{
    margin:0;
	padding:0;
	cursor:default;
	width:117px;
	height:15px;
	background-image: url(images/toeFlag.png);

}
.headMFlag{
    margin:0;
	padding:0;
	cursor:default;
	width:117px;
	height:15px;
	background-image: url(images/headMFlag.png);
}
.headM{
	margin:0;
	padding:0;
	cursor:default;
	width:117px;
	height:15px;
	background-image: url(images/headM.png);
}
.p{
margin:0px;
}
.titulo{
margin-top:5px;
margin-bottom:10px;
color:#666666;
font-size:16px;
text-align:center;
font-weight:bolder;
text-decoration:underline;
}

#sombra {
float:left;
padding:0 5px 5px 0; /*Esta es la profundidad de nuestra sombra, sí haces más grandes estos valores, el efecto de sombra es mayor también */
background: url(images/css-efecto-sombra.gif) no-repeat bottom right; /*Aquí es donde ponemos la imagen como fondo colocando su ubicación*/
} 

#sombra img {
display:block;
position:relative;
top: -3px; /* Desfasamos la imagen hacia arriba */
left:-3px; /*Desfasamos la imagen hacia la izquierda */
padding:5px;
background:#FFFFFF; /*Definimos un color de fondo */
border:1px solid;
border-color: #CCCCCC #666666 #666666 #CCCCCC /*Creamos un marco para acentuar el efecto */
}
#sombra img:hover{
border-color:#3300FF #3333FF #3333FF #3300FF;
}