* { margin: 0; padding: 0; }

body { font-family: Arial, Helvetica, sans-serif; margin: 0; padding: 0; }
#prueba { width: 293px; }
img { border: 0; }
#contenedor { width: 98%; border: 1px solid #DFDFDF; padding: 1px; }

/*  Cabecera  */

#header { width: 100%; position: relative; }
#header .modulo .cab{ background: #40b3ba; width:100%; height: 34px; overflow: hidden; }
#header .modulo .cab h2{ color: #fff; background: #000; float: left; font-size: 18px; text-transform: uppercase; padding: 7px 10px 6px 10px; font-weight:normal; }
#header .modulo .cab .triangulo{ float:left; }
#header #botonera { width: 100%; height: 60px; list-style-type: none; }
#header #botonera li { width: 32.3%; height: 19px; float: left; font-size: 11px; padding: 1.5% 0 0 0%; margin: 2px 0px; text-align: center; background: -moz-linear-gradient(top, #FFF , #E9E8E7);
    background: -webkit-gradient(linear, 0 0, 0 100%, from(#FFF),  to(#E9E8E7)); background-color: #f5f4f4; cursor: pointer; }
#header #botonera li.tabla-puntos,#header #botonera li.tabla-geopolitico { margin: 2px 1.5%; }

@media screen and (-webkit-min-device-pixel-ratio:0) {
	#header #botonera li.tabla-puntos,#header #botonera li.tabla-geopolitico { margin: 2px 2%; }
}

#header #botonera li:hover, #header #botonera li.activo { background: none; background-color: #40b3ba; font-weight: bold; }

/* Cabecera-Ayuda */

#header > img { width: 21px; height: 21px; position: absolute; top: 6px; right: 3%; }
#ayuda > div { width: 99.6%; background-color: #fff; display: none; position: absolute; top: 34px; font-size: 12px; border-bottom: 5px solid #000; }
#ayuda > div img { position: absolute; right: 3%; top: -6px; }
#ayuda > div p { margin: 5px; color: #999; }
#ayuda > div p.negrita { font-weight: bold; color: #666; }

/* Tablas */

#tablas .tabla-puntos, #tablas .tabla-geopolitico, #tablas .tabla-pib, #tablas .tabla-poblacion, #tablas .tabla-idioma { display: none; }

#geopolitico, #clasico, #puntos, #pib, #poblacion, #idioma { width: 100%; height: 400px; overflow: hidden; clear: both; }

#tablas .cabecera { width: 100%; height: 30px; font-size: 11px; margin: 3px 0 1px 0; }
#tablas .cabecera > div { float: left; overflow: hidden; }
#tablas .cabecera .nombre { width: 59.5%; height: 23px; padding-top: 7px; }
#tablas .cabecera .nombre p { margin-left: 5px; }
#tablas .cabecera .oro, #tablas .cabecera .plata, #tablas .cabecera .bronce { width: 12%; border-left: 1px dotted #DFDFDF; text-align: center; }
#tablas .cabecera .bronce { border-right: 1px dotted #DFDFDF; }

#tablas .linea { width: 100%; height: 21px; color: #333; font-size: 12px; }
#tablas .linea:hover { font-weight: bold; }
#tablas .linea > div { float: left; overflow: hidden; background: -moz-linear-gradient(top, #FFF , #E9E8E7);
    background: -webkit-gradient(linear, 0 0, 0 100%, from(#FFF),  to(#E9E8E7)); background-color: #F5F4F4; border-bottom: 1px solid #DFDFDF; }
#tablas .linea > div p { height: 18px; padding-top: 3px;}
#tablas .linea .nombre { width: 59.5%; height: 21px; }
#tablas .linea .nombre img { position: relative; top: 3px; margin-left: 5px; }

#tablas .linea .oro, #tablas .linea .plata, #tablas .linea .bronce { width: 12%; height: 21px; border-left: 1px dotted #DFDFDF; text-align: center; } 
span { height: 21px; padding-top: 3px; }
#tablas .linea .bronce { border-right: 1px dotted #DFDFDF; }

/* Puntos */

#tablas .tabla-puntos .cabecera .nombre { width: 48%; }
#tablas .tabla-puntos .cabecera .puntos { width: 11.5%; height: 23px; text-align: center; padding-top: 7px; }

#tablas #puntos .linea .nombre { width: 48%; height: 21px; }
#tablas #puntos .linea .puntos { width: 11.5%; height: 21px; text-align: center; }

/* PIB, Poblacion */

#tablas .tabla-pib .cabecera .nombre, #tablas .tabla-poblacion .cabecera .nombre  { width: 45%; }
#tablas .tabla-pib .cabecera .pib, #tablas .tabla-poblacion .cabecera .poblacion { width: 14.5%; height: 23px; text-align: center; padding-top: 7px; }

#tablas #pib .linea .nombre , #tablas #poblacion .linea .nombre{ width: 45%; height: 21px; }
#tablas #pib .linea .pib, #tablas #poblacion .linea .poblacion { width: 14.5%; height: 21px; text-align: center; }
#tablas .tabla-geopolitico .linea .nombre p, #tablas .tabla-idioma .linea .nombre p { margin-left: 5px; }

/* Grupo de nombres para grupos geopoliticos e idiomas */

#tablas .tabla-geopolitico .nombres { width: 100%; max-height: 60px; position: absolute; bottom: 0; left: 0; display: none; }
#tablas .tabla-idioma .nombres { width: 100%; max-height: 60px; position: absolute; bottom: 0; left: 0; display: none; }

/* Scroll */

body #clasico, body #puntos, body #pib, body #geopolitico, body #idioma, body #poblacion {background-color: transparent; }

/* Error */

.error { width: 90%; height: 200px; margin: 0 auto; }


/* Pie */

#pie { height: 40px; position: relative; }
#pie > p { margin: 1.5% 0 0 3%; }
#pie .botones { width: 95%; height: 26px; margin: 0 auto; position: relative; bottom: -5px; }
#pie #llevatelo { width: 57%; height: 26px; background: url('../../../../deportes/juegos-olimpicos-2012/img/fnd-btn.gif') repeat-x 0 0 transparent; border: 1px solid #DDDDDD; float: left; cursor: pointer; }
#pie #especial { width: 40%; height: 26px; background: url('../../../../deportes/juegos-olimpicos-2012/img/fnd-btn.gif') repeat-x 0 0 transparent; border: 1px solid #DDDDDD; float: right; cursor: pointer; }
#pie p, #pie a { font-size: 11px; font-weight: bold; color: #000; text-decoration: none; }
#pie #llevatelo img { position: absolute; top: 5px; left: 2%; }
#pie #llevatelo p { margin: 3.8% 0 0 27%; }
#pie #especial p { margin: 5.2% 0 0 8%; }

#pie .capa { width: 95%; position: absolute; bottom: 35px; padding: 10px 0 0 2.7%; display: none; background-color: #fff; /*border-top: 5px solid #000;*/ }
#pie .capa p { margin: 10px 0; font-weight: normal; }
#pie #codigo textarea{ width: 99%; min-height: 100px; border: 1px solid #dddddd; color: #999999; font-size: 11px; }
/*#pie #codigo p { margin: 10px; color: #999999; }*/

#pie .logo a { margin-left: 2.5%; }