@import url("reset.css");

/****************************************HACKS para IE6: */
*html .img-producto{
	margin:6px 10px 10px 3px;
	padding:0;
	float:left;
}

*html .caja-texto-producto-largo{
width:240px;
}
/****************************************HACKS para IE7: */
*:first-child+html {}



/* General */

body {
	color: #888;
	font: 62.5%/50% Verdana, Arial, Helvetica, sans-serif; 
	background:#fff;
	line-height: 1.5em;
	margin:0;
}

/* Cajas */

#contenedor{
width:770px;
margin:0 auto;
}

#izquierda{
width:144px;
float:left;
background:#b1da0f url(../images/bg-menu-top.gif) top no-repeat;
padding:10px 0 0 0;
    word-wrap: break-word; /* hack IE */
    overflow: hidden;     /* hack IE */
}

#contenido{
width:606px; 
float:left;
margin:0 10px;
    word-wrap: break-word; /* hack IE */
    overflow: hidden;     /* hack IE */
}

#cabecera{
margin:0 0 20px 0;
}

/* Enlaces */

a:link, a:visited, a:hover, a:active {
	color: #36410b;
}

a:hover { text-decoration: none;}


/****************************************************************************** Izquierda */

/* Logo */

h1 a{
width:124px;
height:70px;
text-indent:-9000px;
display:block;
background: url(../images/logo-pensiones.gif) no-repeat;
margin: 10px 0 20px 10px;
}

/* Menu */

.txt-menu {
background: url(../images/ico-cuadrito.gif) 2px no-repeat;
padding: 0 0 2px 18px;
margin:0 2px 4px 2px;
font-weight:bold;
color:#441d1f;
border-bottom:1px dotted #441d1f;
}

#menu{}

#menu ul{
list-style-type: none
}

#menu ul li{
margin-left: 1em;
margin:0;
padding:0;
}

#menu ul li a{color:#3c470f;}

#menu ul li a:hover{color:#ff4e00;}

#menu ul li.menu-flecha{
background: url(../images/fondo-menu-cuadro.gif) no-repeat;
padding:2px;
margin:0 2px;
border-bottom:1px dotted #fff;
}

#menu ul li.menu-flecha a{
padding: 0 0 0 8px;
font-weight:bold;
color:#441D1F;
}

#menu ul li.menu-destacado a{
font-weight:bold;
}

#menu ul li.menu-cuadro{
background: url(../images/fondo-menu-cuadro.gif) no-repeat;
margin:0 2px;
border-bottom:1px dotted #fff;
padding: 2px 2px 2px 10px;
font-weight:bold;
color:#441D1F;
}

#menu ul li ul li{
background: url(../images/fondo-menu-flecha2.gif) 0 -3px no-repeat;
margin: 0 0 0 -10px;
padding:0 0 0 10px;
}

#bg-bottom-menu{ height:10px; background:#f2f2f2 url(../images/bg-menu-bottom.gif) no-repeat; clear:both;}

/* Banner */

#banner{
margin:20px 0 0 0;
}

#banner-arriba{
height:68px;
background: url(../images/fondo-banner-arriba.gif) no-repeat;
}

#banner-contenido{
padding:0 0 0 10px;
background:#FFF;
}

#banner-abajo{
height:68px;
background: url(../images/fondo-banner-abajo.gif) no-repeat;
}


/***************************************************************************** Contenido */

/* Cabecera */

#logo{float:left;}
#logo a{ width:300px; height:51px; text-indent:-9000px; display:block; background: url(../images/logo-plan-pensiones.gif) no-repeat;}

#cabecera ul{ margin: 18px 10px 0 0; list-style-type: none; float:right;}
#cabecera ul li{float:right;margin:0;}
#cabecera ul li a{ color:#888; padding:2px;}
#cabecera ul li .actual, #cabecera ul li a:hover { text-decoration:underline;}

h2.principal {
	background: url(../images/cabecera-grande-01.gif) bottom no-repeat;
	height:32px;
	color:#163d5b;
	font-weight:bold;
	font-size:1.1em;
	padding: 0 0 0 35px;
	margin:0 0 10px 0;
}

/* contenido principal */

#contenido-principal h1.cabecera-grande-01{
	background: url(../images/cabecera-grande-01.gif) no-repeat;
	height:18px;
	text-transform: uppercase;
	color:#441d1f;
	font-weight:bold;
	font-size:1.1em;
	padding: 0 0 0 30px;
	margin:0 0 10px 0;
}

#contenido-principal .intro{
padding: 0 10px 0 0px;
margin:0 0 20px 0;
}


/****************************************************************
*****************************************************************
*****************************************************************

                        CAJA PRODUCTOS
          En todas las secciones se usa la misma caja

*****************************************************************
*****************************************************************
*****************************************************************/


/* Margenes para las secciones */
.caja-producto-home{
float:left;
width:293px;
margin:0 10px 0 0;
}


/* Caja producto */

.caja-producto-txt{ height:120px;background:#fcfff0; margin:10px 0; padding:0; border:1px solid #b1da0f;}

.caja-producto h3, .caja-producto-largo h3, .caja-producto h2{
	background: url(../images/fondo-h3.gif) 0 2px no-repeat;
	padding:2px;
	margin: 0 0 10px 0;
	}

.caja-producto h3 a, .caja-producto-largo h3 a, .caja-producto h2{
color:#441d1f;
font-size:1.1em;
font-weight:bold;
padding:0 0 0 6px;
}

.caja-producto h3 a:visited, .caja-producto-largo h3 a:visited{color:#441d1f;}

.img-producto{
	margin:6px 10px 10px 6px;
	padding:0;
	float:left;
}

.img-producto a img{
	width:80px;
	height:80px;
	border:1px solid #c2c2c2;
}

.caja-texto-producto{
	float:left;
	width:192px;
	margin:5px 0 0 0;
	padding:0 0 0 0;
}

.texto-producto{ 
	margin:0 0 10px 0; 
	height:70px; 
}

.texto-producto a{
color: #778597;
display:block;
}

.texto-producto a:hover, .texto-producto a:visited{
color: #778597;
}

.caja-producto .enlace-producto{
	margin:10px 0;
}

.caja-producto .enlace-producto a, .caja-producto-largo .enlace-producto a, .ficha-mas-info .enlace-producto a{
text-indent:-9000px;
background: url(../images/boton-solicita-home.gif) bottom no-repeat;
display:block;
width:184px;
height:24px;
}

.caja-producto-largo .enlace-producto, .caja-producto-largo .enlace-producto-pos a{ float:right; margin:10px 0;}

.caja-producto .enlace-producto-pos a, .caja-producto-largo .enlace-producto-pos a{
text-indent:-9000px;
background: url(../images/mas-informacion.gif) bottom no-repeat;
display:block;
width:184px;
height:24px;
}

.caja-producto .enlace-producto a:hover, .caja-producto-largo .enlace-producto a:hover, .caja-producto .enlace-producto-pos a:hover, .caja-producto-largo .enlace-producto-pos a:hover, .ficha-mas-info .enlace-producto a:hover{
background: url(../images/boton-solicita-home.gif) top no-repeat;
}

.caja-producto ul{
	list-style-type: none;
}

.caja-producto ul li{
	background: url(../images/fondo-menu-flecha2.gif) 0 -3px no-repeat;
	padding:0 0 0 10px;
}


/* productos largos */

.caja-producto-largo{
	width:580px;
	margin:10px auto;
	background-color: #eff8cf;
	padding: 0 0 10px 0;
}

.cabecera-producto{background:#fff; padding:0 0 1px 0;}

.nombre-producto-largo{font-size:1.1em; width:340px; height:20px; float:left;}
.afondo-producto-largo{font-size:1.1em; width:210px; text-indent:6px; float:right; height:20px; font-weight:bold;}


.caja-producto-largo .caja-producto{ width:350px}

.caja-producto-txt-largo{
	padding:0;
	width: 350px;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0;
	float: left;
}
.caja-texto-producto-largo{
	float:left;
	width:250px;
	margin:5px 0 0 0;
}

.caja-texto-producto-largo .texto-producto{ height:auto;}

.texto-relevante{
	width:200px;
	float:right;
	margin:0 5px 10px 0;
	padding: 5px;
}

.texto-relevante h4{
	font-weight:bold;
	color:#441d1f;
	background: url(../images/cuadro_morado.gif) 0 6px no-repeat;
	text-indent:8px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.1em;
	margin:0 0 10px 0;
	border-bottom:1px solid #321;
}

.texto-producto ul{
	margin:0;
	padding:0;
}

.texto-producto ul li{
	margin:0 0 0 10px;
}

/* producto final */

.caja-producto-final h2{
background: url(../images/fondo-h3.gif) no-repeat;
margin: 0 0 10px 0;
color:#441d1f;
font-size:1.1em;
font-weight:bold;
padding:0 0 2px 10px;
}

.caja-texto-producto-final img{float:left; width:80px; height:80px; border:1px solid #c2c2c2; margin:0 10px 0 0;}

/* ficha grande */

.ficha-grande{}

.caja-producto h2{
background: url(../images/fondo-h3.gif) no-repeat;
margin: 0 0 10px 0;
color:#441d1f;
font-size:1.1em;
font-weight:bold;
padding:0 0 2px 10px;
}

.img-producto-final{
text-align:center;
margin:0 0 10px 0;
}

.img-producto-final img{
width:150px;
margin:0 0 10px 100px;
float:left;
}

.enlace-info-grande a{
text-indent:-9000px;
background: url(../images/boton-arriba.gif) no-repeat;
display:block;
width:154px;
height:95px;
margin:0 100px;
float:right;
}

.caja-texto-producto-final .enlace-producto a, .ficha-mas-info .enlace-producto a{margin:30px auto;}

.ficha-mas-info h2{
background: url(../images/fondo-h3.gif) no-repeat;
margin: 20px 0 10px 0;
color:#441d1f;
font-size:1.1em;
font-weight:bold;
padding:0 0 2px 10px;
}


/************************************************************************* Noticias */

#noticias{
background: #FFF url(../images/fondo-noticias.gif) repeat-y;
border-bottom:1px solid #d4d4d4;
margin:20px 0 0 0;
}

#noticias h2{
background: url(../images/fondo-cabecera-noticias.gif) no-repeat;
height:63px;
padding: 10px 0 0 90px;
text-transform: uppercase;
font-weight:bold;
color:#441d1f;
}

.noticia {
padding: 0 10px 10px;
}

.noticia-titulo{
background: url(../images/ico-flecha-01.gif) 0 5px no-repeat;
padding:0 0 0 8px;
margin:0 0 10px 0;
font-weight:bold;
color:#441d1f;
font-size:1.1em;
}

.noticia-titulo a{
color:#441d1f;
}

.noticia-pie{
margin:10px 0;
border-bottom:1px dotted #ffb301;
height:24px;
}

.noticia-fecha{
float:left;
}

.noticia-ver-mas a{
background: url(../images/ico-flecha-02.gif) 64px 2px no-repeat;
display:block;
float:right;
font-weight:bold;
padding: 0 16px 10px 10px ;
}

.noticia-ver-mas a:hover{ color:#ffb301;}

/* Paginacion */

.paginado{
 	text-align: center;
	margin:0 0 10px 0;
}


/* contenido izquierda */

#contenido-izquierda{
border-right:4px dotted #d4d4d4;
width:275px;
float:left;
margin:0 10px 0 0;
padding:0 10px 0 0;
}

/* contenido derecha */

#contenido-derecha{
width:300px;
float:right;
}

h2.cabecera-peq-01{
	background: url(../images/cabecera-peq-01.gif) no-repeat;
	height:18px;
	text-transform: uppercase;
	color:#441d1f;
	font-weight:bold;
	font-size:1.1em;
	padding: 0 0 0 30px;
	margin:10px 0 20px 0;
}

/* producto izquierda */

#producto-izquierda{
width:365px;
float:left;
margin:0 10px 0 0;
padding:0 10px 0 0;
}

#producto-izquierda .caja-texto-producto{
width:260px;
}

/* producto derecha */

#producto-derecha{
width:220px;
float:right;
}

/* Caja de google adsense */
.caja_google_bajo{float:left;margin-left:5px}

/****************************************************************************************** Sitemap */

#sitemap ul li a{
color: #464b4f;
}

#sitemap ul li ul li a, #sitemap-noticia ul li a{
color: #ff4e00;
}


/*************************************** form calculadora */

#caja-calculadora-cuotas{
padding: 0 0 10px 0;
background: url(../images/fondo-calculadora.gif) no-repeat;
margin:0 0 20px 0;
}

#caja-calculadora-cuotas h3{
font-weight:bold;
color:#441d1f;
background: url(../images/ico-flecha-01.gif) 3px 8px no-repeat;
padding:4px 0 0 10px;
font-size:1.1em;
margin: 20px 0 10px 0;
}

#caja-calculadora-cuotas h4{
background: #b1da0f url(../images/ico-flecha-03.gif) 4px 6px no-repeat;
padding:2px 2px 2px 10px;
color:#000;
font-weight:bold;
margin: 0 0 10px 0;
}

#caja-calculadora-izq{
float:left;
width:295px;
margin:0 10px 0 0;
}

#caja-calculadora-der{
float:left;
width:295px;
}

#caja-detalle{
margin:10px 0;
}

#columna-detalle-01{
margin:10px 10px 10px 0;
width:295px;
float:left;
}

#columna-detalle-02{
margin:10px 10px 10px 0;
width:295px;
float:left;
}


/********************************************************************************************* Forms */

#txt-contacto{
margin:0 0 20px 0;
}

input.enviar{
width:50px;
background:#441d1f;
border:#fff 1px solid;
font-weight:bold;
color:#fff;
margin:10px 0 0 190px;
}

/* form contacto */

.form-color-02{
width:250px;
margin: 0 auto;
}

.form-color-02 label.form-label {
	width: 80px;
	float: left;
	text-align: right;
	padding:0 0 5px 0; 
	margin:0 5px 0 0;
	font-weight:bold;
}

.form-color-02 input.form-input, .form-color-02 textarea.form-input {

	padding:2px;
	margin:0;
	border:1px solid #441d1f;
	color:#441d1f;
	width:150px;	
}
.form-color-02 br{clear:left;}

.form-color-02 .calcular{
border: 1px solid #36410b;
padding:2px;
background:#b1da0f;
margin:10px 0 0 150px;
width:60px;
font-weight:bold;
display:block;
cursor:pointer;
}

.form-color-02 .calcular:hover{background:#36410b;color:#fff;}

/**********************************************************************************************pie */ 

#pie{margin:20px 0 0 0;}

#caja-destacados-pie{
margin:20px 0 0 0;
background: #efefef;
}

#caja-destacados-pie a{color:#888;padding:2px;}

#caja-destacados-pie a:hover {color:#36410b;background:#b1da0f;}

#caja-destacados-pie ul{
padding:10px 0 ;
list-style-type: none;
text-align:center;
}

#caja-destacados-pie ul li{
display: inline;
margin:0;
padding:0;
}

#caja-menu-pie{
margin:20px 0 0 0;
}

#caja-menu-pie ul{
list-style-type: none;
text-align:center;
margin:0 0 10px 0;
}

#caja-menu-pie ul li{
display: inline;
margin:0;
padding:0;
}

#caja-menu-pie ul li a{
color:#888;
padding:2px;
}

#caja-menu-pie ul li a:hover{
color:#36410b; background-color:#b1da0f;
}

#copy{
text-align:center;
margin:0 0 10px 0;
}

#copy a{
color:#778597;
}


/*** clases  ***/

.clear {
	clear: both;
}

.punteado-color-01 {   /* naranja */
height:1px;
border-top:1px dotted #ff4e00;
padding:2px;
margin:2px;
}

.color-01{color:#441d1f;}  /* marron */

.color-02{color:#ffb301;}  /* amarillo */

.center {text-align:center;}

.boton-ver-mas{
	float:right;
	margin:10px 10px 10px 0;
}

.boton-ver-mas a{
background: url(../images/boton-ver-mas.gif) bottom no-repeat;
display:block;
width:76px;
height:23px;
text-indent:-9000px;
}

.boton-ver-mas a:hover{
background: url(../images/boton-ver-mas.gif) top no-repeat;
}

.boton-volver{
	float:right;
	background: url(../images/ico-flecha-04.gif) 0 2px no-repeat;
	margin:10px 0;
}

.boton-volver a{
	padding:0 0 0 20px;
	text-transform: uppercase;
	font-weight:bold;
}
