/* ---- Estilo para una noche  de invierno ---- */ 
/* ---- Colores base: 273f52 -> 142029 ---- */

/* Generales */
* { margin: 0; padding: 0; }
html, body { margin: 0; padding: 0; border: 0; height: 100%; }

body { background: #142029 url(img/bg-noche.png); color: #c4c7c9; text-align: center; font: 19px/1.7em sans-serif; letter-spacing: 1px; }
img { border: none; }
p.clear { clear: both; margin: 0; padding: 0; }

/* Navegación */
#nav { position: fixed; z-index: 9999; top: 10px; right: 0; width: 320px; text-align: right; height: 25px; line-height: 25px; font: bold 9px/25px sans-serif; letter-spacing: 0; text-transform: uppercase; color: #4f585f; background: url(img/bg-nav.png) left no-repeat;  }
  #nav li { display: inline; padding: 0 10px;  border-right: 1px #4f585f dotted;}
  #nav li.ultimo { border: none; }
    #nav li a { text-decoration: none; color: #8a9095; }
    #nav li a:hover { color: #e8e9ea; }

/* Info del estado actual */
#info { position: absolute; width: 100%; z-index: 2; text-align: center; padding: 10px 0; bottom: 10px; left: 0; right: 0; font: 9px/9px sans-serif; letter-spacing: 3px; text-transform: uppercase; background: url(img/pixel.png); color: #e8e9ea; }
  #info strong { padding: 3px; background: #0f181f;; color: #e8e9ea; }

/* Logo */
#contenedor { position: absolute; top: 0; left: 0; text-align: center; width: 100%; height: 100%; background: url(img/logo.png) center no-repeat; }
  #contenedor h1 { text-indent: -9999px;}

/* Contenido */
#resto { position: absolute; width: 100%; top: 100%; right: 0; bottom: 0; bottom: 0; text-align: left; padding-bottom: 100px; }
  #resto div { width: 600px; margin: 30px auto 150px auto; padding: 15px; background: #374149; color: #c4c7c9; border: #111b23 solid; border-width: 0 1px 1px 0; }
  #resto div div { width: auto; margin: 0; padding: 0; background: none; border: none; }
    #resto div h2 { position: relative; width: 250px; margin: -35px 0 20px -25px; padding: 5px; font: 30px/30px sans-serif; letter-spacing: -1px; text-transform: uppercase; color: #8a9095; background: #111b23 ; border: #0f181f solid; border-width: 0 2px 2px 0;  }
    #resto div h2 a { color: #8a9095; background: #111b23; text-decoration: none; }
    #resto div strong { color: #e8e9ea; }
    #resto div p a { font-weight: bold; text-decoration: none; border-bottom: 1px #e8e9ea dotted; color: #e8e9ea; }
    #resto div p a:hover { color: #c4c7c9; background: #142029;}

/* Proyectos */
  #resto .wrap { height: 550px; }
	#resto #destacado { }
		#resto #destacado img { background: #000 url(img/loading.gif) center center no-repeat; width: 580px; height: 400px; padding: 2px; border: 8px #8a9095 solid; }
		#resto #destacado #cargando { background: #000 url(img/loading.gif) center center no-repeat; width: 580px; height: 400px; padding: 2px; text-indent: -9999px; border: 8px #8a9095 solid; }
		#resto #destacado .descripcion { position: relative; height: 70px; margin: -110px 10px 10px 10px; background: url(img/pixel.png); padding: 15px; color: #c4c7c9; }
			#resto #destacado .descripcion h3 { font: bold 27px/27px sans-serif; letter-spacing: -1px; color: #fff; }
			#resto #destacado .descripcion p { font: bold 17px/17px sans-serif; letter-spacing: 0; }
		#resto #destacado .detalles { background: #8a9095; font: 11px/11px sans-serif; color: #000000; }
			#resto #destacado .detalles small { font: bold 11px/11px sans-serif; letter-spacing: 0; }
		#resto #destacado .left { width:299px; float: left; border-right: 1px #374149 dotted; }
		#resto #destacado .right { width: 300px; float: right; }
			#resto #destacado .detalles a { color: #000000; text-decoration: none; border-bottom: 1px #374149 solid; }
			#resto #destacado .detalles a:hover { background: #4f585f; color: #ffffff; }
			#resto #destacado .detalles dt, #resto #destacado .detalles dd { padding: 10px; border-top: 1px #374149 solid; } 
			#resto #destacado .detalles dt { width: 50px; float: left; font-weight: bold; }
			#resto #destacado .detalles dd { margin-left: 70px; }

	#resto #anteriores { text-align: center; }
	  #resto #anteriores a { color: #000; }
		  #resto #anteriores a img { width: 170px; height: 117px; background: #000 url(img/loading.gif) center center no-repeat; margin: 5px; padding: 2px; border: 5px #8a9095 solid; }		
		  #resto #anteriores a:hover img { border-color: #e8e9ea; }
		
/* Footer */
	#resto #foot { background: none; border: none; font: 10px sans-serif; margin: 30px auto 0 auto; text-align: center; }
		#resto #foot a { text-decoration: none; color: #0f181f; }
		#resto #foot a:hover { text-decoration: none; color: #c4c7c9; }