@charset "utf-8";

body,td,th {
	font-family: Arial, Helvetica, sans-serif;
	color: #F09;
}
a:link {
	text-decoration: none;
	color: #FFF;
}
a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: none;
}
a:active {
	text-decoration: none;
}

#mainnav ul {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	list-style-type: none;
}
#mainnav a {
	width: 25%;
	display: block;
	float: left;
	text-align: center;
	background-color: #1f1e1e;
	color: #FFFFFF;
	text-transform: uppercase;
	padding-top: 6px;
	padding-bottom: 6px;
}
#mainnav a:hover, #mainnav a:active, #mainnav a:focus, #mainnav a.thispage {
	background-color: #333333;
	text-decoration: none;
}

body {
	background-image: url(imagenes/fondo.jpg);
	background-repeat: repeat;
}
  .demoIMG { /* el rectángulo contenedor */
    position:relative; /* indicamos esto para poder posicionar su contenido de maera absoluta */
    height:330px; /* le damos una cierta altura */
    margin:0 auto; /* lo centramos */
    width:500px; /* le damos un cierto ancho */
  }
  .demoIMG img { /* el contenido */
    left: 0; /* posición izquierda */
    position:absolute; /* indicamos que su posición es absoluta con respecto al contenedor */
    top: 0; /* posición superior */
  }
  /* y ponemos propiedades en las clases de cada imagen */
  /* la primera no será visible por defecto */
  .demoIMG img.novisible {opacity:0;filter:alpha(opacity=0);}
  /* y se verá cuando pongamos el cursor encima del DIV */
  .demoIMG:hover img.novisible {opacity:1;filter:alpha(opacity=100);}
  /* la segunda se ocultara siempre que pongamos el cursor encima del DIV o de la imagen */
  .demoIMG:hover img.visible {opacity:0;filter:alpha(opacity=0);}
  .demoIMG img.visible:hover {opacity:0;filter:alpha(opacity=0);}  
  #demoIMG img {
  .......
  /* esto, hará que cualquier cambio en las imágenes, se muestren con una animación */
  -moz-transition: all 1s ease-in-out;
  -webkit-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
}