@import url("moz.css");

* {
	padding: 0;
	margin: 0;
	border: 0 none;
}

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 62.5%;
	color: #333;
	background-repeat: repeat-x;
	background-position: top;
}
	body.home {
		background-image: url(../images/headers/bg-home.jpg);
	}
	body.energia01 {
		background-image: url(../images/headers/bg-energia01.jpg);
	}
	body.energia02 {
		background-image: url(../images/headers/bg-energia02.jpg);
	}
	body.energia03 {
		background-image: url(../images/headers/bg-energia03.jpg);
	}
	body.energia04 {
		background-image: url(../images/headers/bg-energia04.jpg);
	}
	body.energia05 {
		background-image: url(../images/headers/bg-energia05.jpg);
	}
	body.energia06 {
		background-image: url(../images/headers/bg-energia06.jpg);
	}
	body.energia07 {
		background-image: url(../images/headers/bg-energia07.jpg);
	}
	body.energia08 {
		background-image: url(../images/headers/bg-energia08.jpg);
	}
	body.solucion01 {
		background-image: url(../images/headers/bg-solucion01.jpg);
	}
	body.solucion02 {
		background-image: url(../images/headers/bg-solucion02.jpg);
	}
	body.solucion03 {
		background-image: url(../images/headers/bg-solucion03.jpg);
	}
	body.solucion04 {
		background-image: url(../images/headers/bg-solucion04.jpg);
	}

h1 {
}

h2 {
	font-size: 3.8em;
	line-height: 1em;
	font-weight: normal;
	margin: 20px 0 30px 0;
	color: #FF3C00;
}
	h2.green, h2.green a {
		color: #96C83C;		
	}
	h2.green a {
		text-decoration: none;
	}
		h2.green a:hover {
			color:#333;
		}

h3 {
	font-size: 2em;
	line-height: 1.2em;
	color: #FF8A66;
	font-weight: normal;
	margin-bottom: 10px;
}

h4 {
	font-size: 1.4em;
	margin-bottom: 10px;
}
	h4.naranja {
		background-image: url(../images/bg_categoria-productos.gif);
		width: 613px;
		height: 21px;
		padding: 4px 0 0 8px;
		color: #FFF;
	}

h5 {
	font-size: 1.6em;
}
	h5.epigraph {
		font-size: 1.1em;
		line-height: 1.3em;
		text-transform: uppercase;
		border-bottom: 1px dotted #999;
		margin-bottom: 10px;
		padding-bottom: 10px;
		color: #666;
	}

h6 {
	font-size: 1.3em;
	font-weight: normal;
	margin-bottom: 20px;
}

p, ul {
	margin-bottom: 15px;
}
	p.huge {
		color: #FF3C00;
		font-size: 5.5em !important;
	}

a:link, a:visited, a:hover, a:active {
	color: #FF3C00;
	border: 0 none;
}

.clear {
	clear: both;
}

img.right {
	float: right;
	margin: 0 0 20px 20px;
}
img.left {
	float: left;
	margin: 0 20px 20px 0;
}
	img.left.nomar {
		margin: 0;
	}
img.center {
	margin: auto;
}

/* Buttons */

a.info {
	width: 48px;
	height: 20px;
	padding: 5px 0 0 7px;
	margin: 0 0 10px 0;
	float: right;
	text-decoration: none;
	color: #FFF !important;
	font-size: 0.9em;
	font-weight: bold;
	display: block;
	background-image: url(../images/buttons/info.gif);
	background-position: 0 0;
}
	a.info:hover {
		background-position: 0 25px;
	}

a.mas {
	text-indent: -9999px;
	background-image: url(../images/buttons/mas.gif);
	background-position: 0 0;
	width:25px;
	height: 25px;
	display: block;
	float: right;
	position: relative;
	top:35px;
	right: 15px;
	/*margin: 35px 0 0 160px;*/
}
a.mas:hover {
		background-position: 0 -25px;
	}

a.volver {
	text-indent: -9999px;
	background-image: url(../images/buttons/volver.gif);
	background-position: 0 0;
	width: 75px;
	height: 25px;
	display: block;
	margin-top: 20px;
}
	a.volver:hover {
		background-position: 0 -25px;
	}

/* Menu */

ul#menu {
	display: block;
	position: absolute;
	margin: 125px 0 0 70px;
	/*position: relative;
	top:125px;
	left: 70px;*/
}
	ul#menu li, ul#submenu li {
		list-style: none;
		text-indent: -9999px;
	}
		ul#menu li a {
			display: block;
			width: 258px;
			height: 79px;
			background-position: 0 0;
		}
			ul#menu li a:hover {
				background-position: 0 -79px;
			}
			ul#menu li a.sf {
				background-image: url(../images/menu/soluciones-fotovoltaicas.gif);
			}
			ul#menu li a.est {
				background-image: url(../images/menu/energia-solar-termica.gif);
			}
			
		ul#submenu li a {
			display: block;
			width: 258px;
			height: 38px;
			background-position: 0 0;
		}
			ul#submenu li a:hover {
				background-position: 0 -38px;
			}
			ul#submenu li a.componentes {
				background-image: url(../images/menu/est-componentes.gif);
			}
			ul#submenu li a.productos {
				background-image: url(../images/menu/est-productos.gif);
			}
			ul#submenu li a.anticongelante {
				background-image: url(../images/menu/est-sistema-anticongelante.gif);
			}
			ul#submenu li a.accesorios {
				background-image: url(../images/menu/est-accesorios.gif);
			}
			ul#submenu li a.instalacion {
				background-image: url(../images/menu/est-instalacion.gif);
			}
			ul#submenu li a.revendedores {
				background-image: url(../images/menu/est-revendedores.gif);
			}
			ul#submenu li a.empresa {
				background-image: url(../images/menu/est-la-empresa.gif);
			}
			ul#submenu li a.contacto {
				background-image: url(../images/menu/est-contacto.gif);
			}
			ul#submenu li a.pensar {
				background-image: url(../images/menu/sf-pensar-verde.gif);
			}
			ul#submenu li a.lamparas {
				background-image: url(../images/menu/sf-lamparas.gif);
			}

/* Layout */

#container {
	width: 1024px;
	height: auto;
	margin: auto;
}
		
	#header {
		height: 250px;
		background-repeat: no-repeat;
	}
		#header.home {
			background-image: url(../images/headers/home.jpg);
		}
		#header.energia01 {
			background-image: url(../images/headers/energia01.jpg);
		}
		#header.energia02 {
			background-image: url(../images/headers/energia02.jpg);
		}
		#header.energia03 {
			background-image: url(../images/headers/energia03.jpg);
		}
		#header.energia04 {
			background-image: url(../images/headers/energia04.jpg);
		}
		#header.energia05 {
			background-image: url(../images/headers/energia05.jpg);
		}
		#header.energia06 {
			background-image: url(../images/headers/energia06.jpg);
		}
		#header.energia07 {
			background-image: url(../images/headers/energia07.jpg);
		}
		#header.energia08 {
			background-image: url(../images/headers/energia08.jpg);
		}
		#header.solucion01 {
			background-image: url(../images/headers/solucion01.jpg);
		}
		#header.solucion02 {
			background-image: url(../images/headers/solucion02.jpg);
		}
		#header.solucion03 {
			background-image: url(../images/headers/solucion03.jpg);
		}
		#header.solucion04 {
			background-image: url(../images/headers/solucion04.jpg);
		}
	
		#header.home h1 {
			width: 365px;
			height: 165px;
			position: absolute;
			margin: 170px 0 0 25px;
		}
		#header h1 {
			width: 365px;
			height: 165px;
			position: absolute;
			margin: -19px 0 0 25px;
		}
					
	#content {
		padding:0 0 0 32px;
	}
		#content p, #content ul, #content form {
			font-size: 1.2em;
			line-height: 1.6em;
		}
			#content ul {
				margin-left: 20px;
			}
		#content p.bajada {
			font-size: 2em;
			line-height: 1.2em;
			color: #FF8A66;
		}
			#content p.bajada strong {
				font-size: 1em;
			}
		#content p strong {
			font-size: 1.2em;
		}
	
		#content ul#idiomas {
			list-style: none;
			float: right;
			margin-top: 7px;
			color: #000;
		}
			#content ul#idiomas li {
				float: left;
				letter-spacing: 0.15em;
				padding-left: 6px;
				height: 33px;
				font-size: 0.8em;
			}
				#content ul#idiomas li a{
					text-decoration: none;
					color: #000;
				}
					#content ul#idiomas li a:hover {
						font-weight: bold;
					}
		
		#content .columnuno {
			margin-top: 20px;
			float: left;
		}
					
		#content .columntres {
			width: 744px;
			float: left;
			margin-top: 20px;
		}
			#content .columntres .column, #content .columnuno .column {
				margin-top: 0;
			}
			#content .columntres .column .colcontent {
				height: 170px;
			}
			#content .columnuno .column .colcontent {
				height: 218px;
			}
		
		#content .column {
			width: 216px;
			margin:0 32px 0 0;
			/*padding-bottom: 60px;*/
			float: left;
			border-bottom: 15px solid #96C83C;
		}
			.column h3 {
				font-size: 1.6em;
				color: #333;
				font-weight: bold;
			}
			#content .column p {
				font-size: 1.3em;
				line-height: 1.3em;
			}

		.home #main .contacto {
			margin: 20px 0 0 20px;
		}
		
		body.home #content .contacto {
			background-image: url(../images/bg_informacion-inicio.gif);
			background-repeat: no-repeat;
			background-position: top;
			width: 800px;
			height: 100px;
			padding-left: 160px;
			margin-left: 0;
			top: -50px;
			position: relative;
		}
			body.home #content .contacto .col {
				float: left;
				margin-right: 30px;
				display: block;
			}
			body.home #content .footer {
				position: relative;
				top:150px;
				padding: 0 0 20px 0;
				margin: 0;
			}
				body.home #content .footer .vmgstudio {
					margin-right: 65px;
				}
		
		#content .contacto {
			background-image: url(../images/bg_informacion.gif);
			background-repeat: no-repeat;
			background-position: top;
			width: 238px;
			height: 200px;
			margin-left: -290px;
			margin-top: -200px;
			padding: 20px 0 0 20px;
			color: #000;
			position: absolute;
		}
			#content .contacto p {
				line-height: 1.3em;
			}
			#content .contacto strong {
				font-size: 1.4em;
			}
			#content .contacto a {
				color: #fff;
				text-decoration: none;
				font-size: 1.4em;
			}
				#content .contacto a:hover {
					text-decoration: underline;
				}
		
		#content .footer {
			margin: 50px 0 20px 0;
		}
			#content .footer p {
				color: #666;
				font-size: 1.1em !important;
				margin-bottom: 0;
				line-height: 1.3em;
			}
								
		.home #main {
			margin: 0;
			float: none;
			width: 1024px;
		}
		
		#main {
			width: 664px;
			float: right;
		}
			#main .breadcrum {
				font-size: 1.1em;
				color: #999;
				font-style: italic;
				position: absolute;
			}
				#main .breadcrum a {
					color: #666;
					text-decoration: none;
				}
				#main .breadcrum a:hover {
					color: #F60;
				}
			#main h2 {
				margin-bottom: 10px;
			}
		
		#main .listado, #main .producto {
			margin:0 0 20px -8px;
			clear: both;
		}
		
		#main ul li {
			text-decoration: none;
			margin-left: 10px;
		}
			#main ul li a:hover {
				text-decoration: none;
			}
			
		#main .box {
			width: 201px;
			height: 74px;
			padding: 15px 0 0 15px;
			background-image: url(../images/bg_listado-productos.gif);
			float: left;
			margin-right: -6px;
		}
			#main .box img {
				float: left;
				margin-right: 10px;
				z-index: 1000;
				position: absolute;
			}
			#main .box p {
				line-height: 1.2em;
				float: left;
				position: relative;
				top:20px;
				left: 70px;
			}
			#main .box h5 a {
				text-decoration: none;
				margin-left: 70px;
				position: absolute;
				z-index: 1000;
			}
				#main .box h5 a:hover {
					color: #333;
				}
		
		#main .producto {
			margin-bottom: 20px;
		}
		
			#main .producto #gallery {
				float: left;
				margin-right:15px;
			}		
				#main .producto .thumbs {
					background-image: url(../images/bg_thumbs.jpg);
					width: 292px;
					height: 73px;
					padding: 16px 0 0 18px;
				}
					#main .producto .thumbs img {
						margin-right: 8px;
					}
			#main .producto .descripcion {
				padding-top: 20px;
			}
			#main .producto ul {
				margin-left: 330px;
			}
			#main .producto table.especificaciones {
				margin:10px 0 20px 0;
				text-align: left;
			}
				#main .producto table.especificaciones th {
					text-transform: uppercase;
					font-size: 1.1em;
					font-weight: normal;
				}
				#main .producto table.especificaciones td {
					font-size: 1.3em;
					font-weight: bold;
					padding: 0 0 0 4px;
				}
			
		#main .colLeft {
			width: 413px;
			float: left;
			padding: 0 20px 0 0;
		}
		#main .colRight {
			width: 221px;
			float: right;
		}
			#main .colRight a img {
				margin-bottom: 20px;
			}
					
/* Form */

form {
	margin-bottom: 30px;
	padding-bottom: 30px;
}
	form#login {
		width: 300px;
		margin: 50px auto;
		min-height: 150px;
	}

	form label {
		clear: left;
		display: block;
		height: 30px;
	}
	
	form label.captcha {
		height: auto;
	}	
	
		form label.captcha img {
			margin-top: 10px;
			margin-left: 150px;
		}
	
		form label span {
			float: left;
			display: block;
		}
		form label.high {
			height: auto;
		}
	
	form input#nombre, form input#ciudad, form input#pais, form input#email, form input#telefono, form textarea#comentarios, form input#usuario, form input#clave, form input#captcha {
		display: block;
		float: right;
		width: 500px;
		border: 1px solid #ccc;
		padding: 4px;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 1em;
	}
		form input#usuario.small, form input#clave.small {
			width: 200px;
		}
		
		form input#submit, form input#reset {
			width: auto;
			display: block;
			float: right;
			margin: 10px 0 0 10px;
			background: none;
			padding: 4px 8px;
			color: #FFF;
			border: 1px solid #FF3C00;
			background-color: #FF3C00;
			font-family: Arial, Helvetica, sans-serif;
			font-size: 1em;
			cursor: pointer;
		}
			form input#submit:hover, form input#reset:hover {
				background-color: #FFF;
				color: #FF3C00;
				border: 1px solid #FF3C00;
			}
		
.alert {
	color: #093;
}

.error {
	color: #F00;
}