/* --------------------- Hoja de estilos para las PÁGINAS INTERIORES de sessl.com -------------------------------------------------------------------- */


#todo {
	background: url(http://www.sessl.com/css/bg-interiores.jpg) no-repeat 90px bottom;
}



/* ******************************* CABECERA ********************************************** */

#cabecera {
	height: 150px;
	background: url(http://www.sessl.com/css/bg-cabecera.jpg) no-repeat left top;
}

#logo {
	float: left;
	margin: 12px 0 10px 42px;
}

.titulo {
	float: left;
	font-size: 180%;
	margin: 50px 0 0 40px;
}

.titulo .a,
.titulo .b {
	padding: 5px 15px;
}

h2 {
	font-size: 190%;
	font-weight: normal;
	letter-spacing: 1px;
}



/* ******************************* NAVEGACIÓN ******************************************** */

#navegacion {
	clear: both;
}


/* ******************************* Página de DESCRIPCIÓN DE LA EMPRESA ******************************************** */

#contenido #descripcion {
	padding: 100px 150px 80px 150px;
}

#contenido #descripcion p {
	text-align: center;
	padding-bottom: 15px;
}



/******************* Página de CATÁLOGO ************************************************************************* */

#contenido #productos {
	float: left;
	width: 750px;
	margin: 40px 0;
}
#contenido #productos ul {
	width: 650px;
	margin-left: auto;
	margin-right: 50px;
	text-align: center;
}

#contenido #productos h2 {
	text-align: center;
	font-size: 190%;
	letter-spacing: 2px;
	padding: 0 0 10px 0;
}

#contenido #productos li {
	width: 140px;
        height: 135px;
	float: left;
	display: block;
	margin: 6px;
}
#contenido #productos li div {
	color: #fff;
	font-size: 13px;
	font-weight: bold;
	text-transform: uppercase;
	border: 1px solid #6b8ee7;
	background: #6b8ee7;
}
#contenido #productos li a {
	color: #fff;
	text-decoration: none;
	border: none;
}

#contenido #productos li img {
	border: none;
	background: #fff;
}

#contenido #productos li .img {
	display: block;
	background: #fff;
}

#contenido #productos li .producto {
	display: block;
	padding: 10px 10px;
}

#contenido #productos li div:hover {
	background: #171795;
	border: 1px solid #aaa;
}

#contenido #productos table {
	margin-left: auto;
	margin-right: 50px;
	text-align: center;
}

#contenido #productos table caption {
	font-size: 190%;
	letter-spacing: 2px;
	padding: 0 0 10px 0;
}

#contenido #productos table td {
	color: #fff;
	font-size: 100%;
	font-weight: bold;
	text-transform: uppercase;
	border: 1px solid #6b8ee7;
	background: #6b8ee7;
}

#contenido #productos table a {
	color: #fff;
	text-decoration: none;
	border: none;
}

#contenido #productos table img {
	border: none;
	background: #fff;
}

#contenido #productos table td .img {
	display: block;
	background: #fff;
}

#contenido #productos table td .producto {
	display: block;
	padding: 10px 10px;
}

#contenido #productos table td:hover {
	background: #171795;
	border: 1px solid #aaa;
}




/* ********************************* Página de CATEGORÍAS ******************************************************************************** */

#contenido #categoria {
	float: left;
	padding: 40px 0 40px 150px;
}

#contenido #categoria .recuadro {
	margin: 10px 0 0 0;
	border: 2px solid #6b8ee7;
        float: left;
}

#contenido #categoria .recuadro ul {
	float: left;
	width: 250px;
	list-style: none;
}

#contenido #categoria li {
	border-bottom: 1px solid #fff;
	background: #c6d8e5;
}

#contenido #categoria li.subcategoria {
	border-bottom: 1px solid #fff;
	background: #6b8ee7;
	color: #fff;
	text-transform: uppercase;
	font-weight: bold;
	text-align: right;
}

#contenido #categoria li a {
	display: block;
	padding: 5px 10px;
	text-decoration: none;
	color: #000;
}

#contenido #categoria li.subcategoria a {
	color: #fff;
	text-transform: uppercase;
	font-weight: bold;
}

#contenido #categoria a:hover {
	color: #fff;
	background: #171795;
}

#contenido #categoria #recuadro img {
	float: right;
}



/* ******************************* Página de DETALLES DE PRODUCTO *********************************************** */

#contenido #detalles {
	float: left;
	padding: 40px 0 40px 150px;
	font-size: 80%;
}

#contenido #detalles h2 {
	margin-left: 100px;
}

#contenido #detalles .recuadro {
	float: left;
	width: 600px;
	margin: 10px 0 0 0;
	border: 2px solid #6b8ee7;
}

#contenido #detalles h3 {
	padding: 10px 20px 10px 0;
	font-size: 160%;
	font-weight: normal;
	text-align: right;
	text-transform: uppercase;
	color: #fff;
	background: url(http://www.sessl.com/css/bg-titulo-detalles.gif) repeat-y left top #6181cf;
	border: 2px solid #fff;
	/* las siguientes tres líneas: para que el borde blanco de 2px tape el borde azul del recuadro exterior */
	position: relative;
	top: -2px;
	left: -2px;
}

#contenido #detalles p,
#contenido #detalles ul,
#contenido #detalles img {
	margin: 10px 15px 20px 25px;
}

#contenido #detalles ul {
	list-style: none;
}

#contenido #detalles #col-1 {
	float: left;
	width: 45%;
}

#contenido #detalles #col-2 {
	float: right;
	width: 55%;
}

#contenido #detalles #col-2 ul {
	margin-top: 60px;
}

#contenido #detalles img {
	float: right;
}

#contenido #detalles .nota {
	clear: both;
	font-style: italic;
	margin-top: 30px;
}




/* ********************************** LISTAS LATERALES ************************************************** */

#contenido .lista {
	float: right;
}

#contenido .lista ul {
	margin: 10px 40px 0 0;
	list-style: none;
}

#contenido .lista li {
	font-size: 80%;
	text-align: right;
}

#contenido .lista a {
	color: #000;
	text-decoration: underline;
}

#catalogo #contenido .lista li {
	font-size: 110%;
	text-align: right;
}

#catalogo #contenido .lista a {
	color: #000;
	text-decoration: none;
}

/* ********************************** PIE ************************************************* */

#pie {
	clear: both;
	margin: 0 40px;
	margin-bottom: 5px;
	padding: 10px 10px;
	border-top: 2px solid #bbb;
}