/* Redefinición de etiquetas */

body {

	border:none;
	overflow:auto;	
	margin:0px;
	padding:0px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: #DFDFDF;
	background-color: #A3B4C8;
	background-image:url(../img/backgroundBottomTut.gif);
	background-position:bottom;
	background-repeat:repeat-x;

}
 
html {
	border:none;
	overflow:auto;
	/* Eliminar scroll horizontal innecesario en IE */
	overflow-x:hidden;
	margin:0px;
	padding:0px;	
}

a:link {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#B1BDE6;
	text-decoration:none;	
}
a:visited {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#B1BDE6;	
	text-decoration:none;
}
a:hover {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	/*color:#DEE5FA;	*/
	color:#9FE9F9;
	text-decoration:underline;
}

img {
	border:none;
	margin:0px;
	padding:0px;
}

h1 {
	font-family:  Arial, Verdana, Helvetica, sans-serif;
	font-size:15px;
	color:#FFFFFF;
	margin:0px;
	padding:0px;
	font-weight:700;
	letter-spacing:0.5px;	
	
}
h2 {
	font-family:  "Trebuchet MS", Arial, Verdana, Helvetica, sans-serif;
	font-size:14px;
	color:#FFFFFF;
	margin:0px;
	padding:0px;
	font-weight:semi-bold;
	letter-spacing:1px;
	
}
h3 {
	font-size:14px;	
	margin:15px 0 9px 0;
	padding:0px;	
	letter-spacing:0.5px;	
	text-align:left;
}

em {
	color:#FFFFFF;		
}

strong {
	color:#E0EDFF;
}

li {
	margin:6px 0px 6px 5px;
	padding:0 0 0 5px;
}
ul {
	list-style-image:url(http://eserrano.com/logos/img/bullet.gif);	
	margin:0px 0px 0px 30px;
	padding:0;
	list-style-position:inside;
	text-indent:0;
}
ul ul {
	list-style-image:none;
	list-style-type:square;
}


.sectionHeader h2{
	margin:0 0 16px 0px;
	padding:2px 0px 6px 50px; 
	text-align:left;
	color:#EEEEEE;
	text-decoration:none;
	background-color:#292a32;
	border-bottom: 1px #505050 solid;
	border-top: 5px #36373D solid;
	clear: both;
}


/* Host Gator */
.hostG {
	margin: 0 10px 0 0;
	text-align: right;
	clear: none;	
}


/* Contenedor del fondo */

.backgroundContainer{
	margin:0px;
	padding:0px;
	width:100%;
	height:100%;	
	clear:none;
	position:absolute;
	top:0px;
	left:0px;
	z-index:-1;	

}

.backgroundTop{
	background-image:url(../img/backgroundTopTut.gif);
	background-repeat:repeat-x;
	margin:0px;
	padding:0px;
	width:100%;
	height:149px;
	position:relative;
	z-index:-1;	
}

.backWaves{
	background-image:url(../img/tileWaveTut.gif);
	background-repeat:repeat-x;
	margin-top:auto;
	margin-bottom:auto;
	margin-left:0px;
	margin-right:0px;
	padding:0px;
	padding-top:100px;
	width:100%;	
	height:372px;
	background-position:center;	
	position:relative;
	z-index:-1;	
}

.backgroundBottom{
	background-image:url(../img/backgroundBottomTut.gif);
	background-position:bottom;
	background-repeat:repeat-x;
	width:100%;	
	height:169px;
	padding:0px;
	margin:0px;
	position:relative;
	bottom:0px;	
	z-index:-1;	
}

/* Contenedor Principal */

.mainContentContainer{
	margin:0px auto 0px auto;
	padding:0px;
	text-align:center;
	width:100%;
	/* Relativo: para que lo tenga en cuenta el body al calcular su altura
	 y muestre bien la imagen del degradado del pie en FF*/
	position:relative;
	z-index:2;
	top:0px;
	left:0px;
	height:auto;	
}

.mainContent{
	width:903px;
	/* TODO height:800px; */
	height:auto;
	background-color:#38393F;
	border-left: 1px solid #999999;
	border-right: 1px solid #888888;
	clear:none;
	margin-top:0px;
	margin-bottom:0px;
	margin-left:auto;
	margin-right:auto;
	padding:0px;
}


/* Secciones del contenedor principal */
/* Cabecera */
.header {
	width:903px;
	height:67px;
	margin:-2px 0px;
	padding:0px;
	background-image:url(http://eserrano.com/logos/img/headerBack.gif);
	background-color:#313236;
	background-position:bottom;
	background-repeat:repeat-x;	
	vertical-align:super;
	text-align:left;
}
.headerMetalTop {
	width:903px;
	height:9px;
	margin:0px;
	padding:0px;
	background-image:url(http://eserrano.com/logos/img/headerMetalTop.gif);
	background-repeat:no-repeat;
	background-position:bottom;	
	
}
.eserranoLogo{
	width:903px;
	height:58px;
	position:relative;
	margin:0px;
	padding:0px;	
	top:0px;
	left:0px;
	background-image:url(http://eserrano.com/logos/img/eserranoLogo.jpg);
	background-position:left;
	background-repeat:no-repeat;
	vertical-align:bottom;
	text-align:right;
}

.eserranoLogo h1{
	padding:15px 20px 0px;
}
/* Barra de botones */
.menuBar {
	width:100%;
	height:24px;
	margin:0px;
	padding:0px;
	background-color:#2C2E33;
	vertical-align:bottom;	
	display:block;
	clear:both;
}
.menuButtonOn {
	margin:2px 1px 1px 2px;
	padding:0px;
	width:122px;
	height:22px;
	float:left;
	text-align:center;
	vertical-align:bottom;
	background-image:url(http://eserrano.com/logos/img/menuButtonOn.jpg);
	background-position:top;
	background-repeat:no-repeat;
}
.menuButtonOff {
	margin:2px 1px 1px 2px;
	padding:0px;
	width:122px;
	height:22px;
	float:left;
	text-align:center;
	vertical-align:bottom;
	background-image:url(http://eserrano.com/logos/img/menuButtonOff.jpg);
	background-position:top;
	background-repeat:no-repeat;
}
.menuButtonOff:hover{
	margin:2px 1px 1px 2px;
	padding:0px;
	width:122px;
	height:22px;
	float:left;
	text-align:center;
	vertical-align:bottom;
	background-image:url(http://eserrano.com/logos/img/menuButtonOffH.jpg);
	background-position:top;
	background-repeat:no-repeat;
}

.menuButtonOff a {
	margin:0px;
	display:block;
	padding:3px 0px;
}
.menuButtonOn a {
	margin:0px;
	display:block;
	padding:3px 0px;
	font-weight:bold;
}

.menuButtonOff a:link {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#FFFFFF;
	text-decoration:none;	
}
.menuButtonOff a:visited {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#FFFFFF;	
	text-decoration:none;
}
.menuButtonOff a:hover {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	/*color:#DEE5FA;	*/
	color:#FFC211;
	text-decoration:none;
}

.menuButtonOn a:link {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#FFFFFF;
	text-decoration:none;	
}
.menuButtonOn a:visited {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#FFFFFF;	
	text-decoration:none;
}
.menuButtonOn a:hover {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	/*color:#DEE5FA;	*/
	color:#FFC211;
	text-decoration:none;
}

.languageEs{	
	margin:0px;
	padding:0px;
	width:20px;
	height:20px;	
	display:inline;
}

/* Efectos de "olas" superior e inferior */
.topWaveDecoration{
	width:100%;
	height:58px;
	padding:0px;
	margin:0px;
	display:block;
	text-align:left;
	background-repeat:repeat-x;
	background-position:bottom;
	background-image:url(http://eserrano.com/logos/img/linesBack.gif);
}
.bottomWaveDecoration{
	width:903px;
	height:59px;
	padding:0px;
	margin:0px auto 0px auto;
	text-align:left;	
	background-repeat:repeat-x;
	background-position:bottom;
	background-image:url(http://eserrano.com/logos/img/linesBack2.gif);
}
.leftWave{
	background-image:url(http://eserrano.com/logos/img/leftWave.jpg);
	height:58px;
	width:644px;
	padding:0px;
	margin:0px;
	background-repeat:no-repeat;
	background-position:bottom;	
	vertical-align:bottom;
}
.copyrightArea{
	width:259px;
	height:20px;
	margin:0px;
	padding:38px 0px 0px 2px;
	text-align:left;
	vertical-align:bottom;	
	float:left;
}
.rightWave{
	background-image:url(http://eserrano.com/logos/img/rightWave.jpg);
	height:59px;
	width:642px;
	padding:0px;
	margin:0px;
	background-repeat:no-repeat;
	background-position:bottom;	
	float:left;
}

/* Bloques de anuncios */
.adBlockTop {
	margin:0 auto 12px auto;
}
.adBlockMid {
	margin:20px auto 15px auto;
	padding:18px 0 5px 0;
	clear:both;
}
.adBlockBot {
	margin:17px auto 15px auto;
}

/* Ruta de navegación */
.navigationLinks{
	text-align:center;	
	margin:15px auto 10px auto;
	padding:1px;
	font-size:11px;
	color:#B5B8BD;
}
.navigationLinks a:link{
	color:#B5B8BD;
	font-size:11px;	
	border-bottom:#181B28 1px solid;
	border-right:#181B28 1px solid;
	border-left:#5C5D5C 1px solid;
	border-top:#5C5D5C 1px solid;
	padding:5px;
	background-image: url('http://eserrano.com/tutorial/img/nav-button-back-off.gif');
	background-position:top left;
	background-repeat:repeat-x;
}
.navigationLinks a:visited{	
	color:#B5B8BD;
	font-size:11px;	
	border-bottom:#181B28 1px solid;
	border-right:#181B28 1px solid;
	border-left:#5C5D5C 1px solid;
	border-top:#5C5D5C 1px solid;
	padding:5px;
	background-image: url('http://eserrano.com/tutorial/img/nav-button-back-off.gif');
	background-position:top left;
	background-repeat:repeat-x;
}
.navigationLinks a:hover{
	color:#FFFFFF;
	text-decoration:underline;
	font-size:11px;
	background-color:#2F3035;	
	border-bottom:#181B28 1px solid;
	border-right:#181B28 1px solid;
	border-left:#5C5D5C 1px solid;
	border-top:#5C5D5C 1px solid;
	padding:5px;
	background-image: url('http://eserrano.com/tutorial/img/nav-button-back.gif');
	background-position:top left;
	background-repeat:repeat-x;
}

.globalNavigationLinks{
	text-align:center;	
	margin:15px auto 10px auto;	
	font-size:11px;
	color:#95989D;
}
.globalNavigationLinks a:link{
	color:#95989D;
	font-size:11px;		
}
.globalNavigationLinks a:visited{	
	color:#95989D;
	font-size:11px;		
}
.globalNavigationLinks a:hover{
	color:#FFFFFF;
	text-decoration:underline;
	font-size:11px;	
}

.nextNavigationLinks{
	text-align:center;	
	margin:15px auto 5px auto;
	padding:1px;
	font-size:12px;
	color:#CEE2F2;	
}
.nextNavigationLinks a:link{
	color:#CEE2F2;
	font-size:12px;
	background-color:#2F3035;
	padding:10px;
	border-bottom:#292A2E 1px solid;
	border-right:#292A2E 1px solid;
	border-left:#393A40 1px solid;
	border-top:#393A40 1px solid;
	background-image:url('http://eserrano.com/tutorial/img/next-button-back.gif');
	background-position:top right;
	background-repeat:repeat-x;
}
.nextNavigationLinks a:visited{	
	color:#CEE2F2;
	font-size:12px;
	background-color:#2F3035;
	padding:10px;
	border-bottom:#292A2E 1px solid;
	border-right:#292A2E 1px solid;
	border-left:#393A40 1px solid;
	border-top:#393A40 1px solid;
	background-image:url('http://eserrano.com/tutorial/img/next-button-back.gif');
	background-position:top right;
	background-repeat:repeat-x;
}
.nextNavigationLinks a:hover{
	color:#FFFFFF;
	text-decoration:underline;
	font-size:12px;
	background-color:#33343E;
	padding:10px;
	border-bottom:#292A2E 1px solid;
	border-right:#292A2E 1px solid;
	border-left:#393A40 1px solid;
	border-top:#393A40 1px solid;
	background-image:url('http://eserrano.com/tutorial/img/next-button-back-on.gif');
	background-position:top right;
	background-repeat:repeat-x;
}

/* Imagen enmarcada en grande */
.imageDetails {
	text-align:center;
	margin:0px auto 0px auto;
	padding:0px;
	border:#313538 8px solid;
	
}
/* Explicación de la imagen*/
.explanationRow {
	display:block;
	margin:0px;
	padding:5px 0px 5px 0px;
	width:100%;
	text-align:left;
}
/* Fila alternante de explicacion (fondo oscuro) */
.explanationRow2 {
	display:block;
	margin:10px 0px 10px 0px;
	padding:5px 0px 3px 0px;
	width:100%;
	text-align:left;
	background-color:#33343A;
	border-top:#505050 1px solid;
	border-bottom:#303030 1px solid;
}

.imageExplanation {
	text-align:left;
	width:820px;
	margin:5px 0px 5px 50px;
}
.imageExplanation p{
	margin:2px 0px 7px 0px;
}
.imageExplanation h3{
	font-family: "Tahoma", Arial, Helvetica, sans-serif;
	letter-spacing:2px;
	font-size:13px;
	font-weight:normal;
	color:#DDE4EE;
	padding:0px;
	margin:3px 0px 10px 0px;
}
.imageExplanation h4{
	letter-spacing:1px;
	font-size:11px;
	font-weight:normal;
	color:#EEEEEE;
	padding:15px 0px 0px 0px;
	margin:5px 0px 15px 0px;	
}
.variantBlock {	
	margin: 10px 0px 10px 0px;
	padding:0px;
}
.variantImage{
	width:350px;
	height:216px;
	position:relative;
	text-align:left;
	display:inline;
	float:left;
	margin:15px 65px 9px 50px;
	padding:0px 0px 0px 20px;

}
.variantImage img{
	border-bottom:#212528 5px solid;	
	border-right:#212528 4px solid;	
	border-top:none;
	border-left:none;	
}
.variantText{
	height:245px;	
	margin:0px 90px 0px 0px;	
}
.variantText p{
	margin:3px 0px 12px 0px;	
}





/* Imagen separadora de bloques del cuerpo principal */
.horizontalSeparator{
	width:100%;
	background-image:url(http://eserrano.com/logos/img/horizontalSeparator.gif);
	height:23px;
	background-position:center;
	background-repeat:no-repeat;
	margin-left:auto;
	margin-right:auto;
	margin-top:10px;
	margin-bottom:10px;
	display:block;
	clear:both;	
}

/* Texto del cuerpo principal */
.mainText {
	width:100%;
	height:auto;
	margin:0px;
	padding:0px;
	/*background-color:#2C2E33;*/
	vertical-align:bottom;	
	display:block;
	clear:both;
}

/* Bloque de texto acotado del contenedor principal */
.mainTextBlock {
	width:600px;
	margin:5px auto 10px auto;
	text-align:justify;
	text-indent:10px;	
}
/* Columnas dentro del bloque de texto principal ampliado */
.mainTextBlockWide {
	width:800px;
	margin:5px auto 10px auto;
	text-align:justify;
	text-indent:10px;	
}
.mainTextBlockWide .leftColumn {
	width:400px;
	margin:0 0 15px 40px;
	padding: 0 5px 0 5px;
	float:left;
}
.mainTextBlockWide .leftColumn ul {
	list-style-position: outside;
	margin-left:5px;
	margin-right:0;
}
.mainTextBlockWide .rightColumn {
	width:290px;
	margin:0 0 5px 40px;
	padding:0;
	float:left;
	clear:right;
	text-align:center;
	vertical-align:middle;
}
.mainTextBlockWide .rightColumn img {
	margin:5px auto 10px auto;
}

.rightColumn p {
	font-size: 10px;
	text-align: left;
	width: 250px;
	text-indent:0;
	margin:10px auto 10px 50px;
}
.rightColumn h4 {
	text-align: left;
	margin: 45px auto 15px 30px;
	
}

/* Contenedor de la descripción con cabecera y miniatura grande*/
.mainDescriptionContainer {
	width:834px;
	height:200px;
	margin-left:auto;
	margin-right:auto;
	margin-top:3px;
	margin-bottom:20px;
	padding:0px;
	text-align:left;
	vertical-align:top;
	display:block;
	clear:both;
}
/* Contenedor de la miniatura grande como imagen*/
.descriptionImage {
	width:309px;
	height:203px;
	text-align:right;
	margin:0px;
	padding:0px;
	vertical-align:top;
	display:inline;	
	float:left;
}
/* Imagen de cabecera principal */
.mainImage img{
	border-top:1px solid #777777;
	border-left:1px solid #777777;
	border-right:2px solid #333333;
	border-bottom:2px solid #333333;
	margin:5px auto 5px auto;
}

/* Cabecera de la descripción con fondo satinado */
.descriptionHeader {
	width:525px;
	height:59px;
	background-image:url(http://eserrano.com/logos/img/descriptionTitle.gif);
	background-position:top;
	background-repeat:repeat-x;
	margin:0px;
	padding:0px;
	text-align:right;	
	display:inline;
	float:right;
	clear:right;

}
.descriptionHeader img {
	text-align:right;
	display:inline;
	margin:0px;
	padding:0px;
	text-align:right;	
	display:inline;
	
}
.descriptionHeader h2 {
	text-align:right;
	vertical-align:middle;
	display:inline;
	margin:0px;
	padding:24px 0px 0px 200px;
	text-align:right;	
	display:inline;
	float:left;	
}

.descriptionText {
	width:490px;
	margin:0px;
	padding:10px;
	text-align:left;	
	display:inline;
	float:left;
}




/* =============================
  Cápsula con el resumen del logo
   ============================= */
 
 .logoRow {
 	/* Puede que haya que meter la tira del fondo*/
 	width:900px;	
	height:310px;
	text-align:center;
	margin:20px 0px 0px 0px;
	padding:0px 0px 0px 0px;
	display:block;
	clear:both;
	float:none;
	vertical-align:top;
	background-image:url(http://eserrano.com/logos/img/summaryBack.gif);
	background-position:bottom;
	background-repeat:repeat-x;
	
 }  

.logoSimple {	
	width:196px;
	height:310px;
	margin:0px;
	padding:0px 13px 0px 13px;
	display:inline;
	float:left;
	clear:none;	
}

/* Enlace de detalles (ver logo en grande) */
.detailsLink {
	color:#B3BAC3;
	margin:5px 0px 3px 0px;
}
.detailsLink a:link{
	color:#B3BAC3;
	margin:7px 0px 0px 0px;
}
.detailsLink a:visited{
	color:#B3BAC3;
	margin:5px 0px 3px 0px;	
}
.detailsLink a:hover{
	color:#9FE9F9;
	margin:5px 0px 3px 0px;
	text-decoration:underline;
}




.logoTop{
	float:left;
	clear:left;
	display:inline;
	width:138px;
	height:15px;
	margin:0px;
	padding:0px;
	background-image:url(http://eserrano.com/logos/img/logoTop.gif);
	background-position:top;
	background-repeat:no-repeat;
}
.logoLeft{
	float:left;
	clear:left;
	display:inline;
	width:15px;
	height:90px;
	margin:0px;
	padding:0px;
	background-image:url(http://eserrano.com/logos/img/logoLeft.gif);
	background-position:left;
	background-repeat:no-repeat;
}
/* Zona en que se inserta la miniatura del logo */
.logoThumb{
	float:left;
	clear:none;
	display:inline;
	width:123px;
	height:90px;
	margin:0px;
	padding:0px;	
}

.logoCorner {
	float:right;
	clear:right;
	display:inline;
	width:58px;
	height:105px;
	margin:0px;
	padding:0px;
	background-image:url(http://eserrano.com/logos/img/logoCorner.gif);
	background-position:right;
	background-repeat:no-repeat;
}

.logoTitle {
	float:none;
	clear:both;
	display:block;
	width:181px;
	height:32px;
	margin:-1px 0px 0px 0px;
	padding:0px 0px 0px 15px;
	vertical-align:middle;
	text-align:center;
	background-image:url(http://eserrano.com/logos/img/logoTitleBack.jpg);
	background-repeat:no-repeat;
	background-position:top right;	
}
.titleLink {
	padding:10px 0px 0px 0px;		
}
.titleLink a:link{
	font-size:12px;
	color:#CCD6DC;
}
.titleLink a:visited{
	font-size:12px;
	color:#CCD6DC;
}
.titleLink a:hover{
	font-size:12px;
	color:#9FE9F9;
	text-decoration:underline;
}


.logoSummary {
	display:block;	
	width:180px;
	height:110px;
	padding:0px 0px 0px 0px;
	margin:0px 0px 0px 16px;
	text-align:left;	
	background-color:#28292F;	
	background-image:url(http://eserrano.com/logos/img/summaryRight.gif);
	background-repeat:repeat-y;
	background-position:right;	
}
.summaryText{
	float:none;
	clear:both;
	display:block;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	padding:8px 12px 2px 10px;
	margin:0px;
	color:#8E959B;	
	width:auto;
	height:auto;
}

.logoBottom {	
	display:block;
	width:196px;
	height:40px;
	margin:0px;
	padding:0px;
	background-image:url(http://eserrano.com/logos/img/logoBottom2.gif);
	background-position:bottom;
	background-repeat:no-repeat;
}







/* Pie (justo lo anterior al reflejo) */
.footer {
	width:903px;
	height:50px;
	margin-left:auto;
	margin-right:auto;
	margin-top:0px;
	margin-bottom:0px;
	padding:0px;
	background-image:url(http://eserrano.com/logos/img/chromeFooter.jpg);
	background-repeat:no-repeat;
	background-position:bottom;
	
}

/* Reflejo */
.reflection {
	margin-left:auto;
	margin-right:auto;
	margin-top:0px;
	margin-bottom:0px;
	padding:0px;
	clear:both;
	display:block;
	width:903px;
	height:97px;
	background-image:url(http://eserrano.com/logos/img/reflection.jpg);
	background-position:top;	
}

/* Copyright */
.copyright{
	background-image:url(http://eserrano.com/logos/img/copyright.gif);
	background-repeat:no-repeat;
	background-position:center;	
	background-position:bottom;
	vertical-align:bottom;
}

/* Volver a la parte superior de la página */
.backToTop{

	float:none;
	/*left:auto;*/
	text-align:center;
	padding: 1px;
	margin:10px auto 0px auto;
}