@charset "utf-8";

/* @override http://fullinteractive-local/css/fullInteractive.css */
/* @override http://fullinteractive.alcaraz.com/css/fullInteractive.css */

/**
 * full-interactive
 * ------------------------------------------
 *
 * autor: 						Josep (josepramon@alcaraz.com)
 * fitxa: 						????
 * data creacio:				05-05-2008
 * ultima modificacio:	
 *
 *
 */


@import url("/css/reset.css");



/* Genèrics
-------------------------------------------------------------------------------------------*/
body{ color: #fff; background-color: #000; font: 78%/140% Arial, Helvetica, sans-serif; }

.h
{
	/*display: none !important;*/
		
	/*
 	* els principals screen readers (JAWS, Window Eyes i IBM Home Page Reader)
 	* no llegeixen els elements amb un display:none o visibility:hidden, encara
 	* que el css estigui destinat a medis visuals (@media: screen), ignorant la
 	* especificació oficial...
 	*/
	height: 0 !important;
	width: 0 !important;
	overflow: hidden !important;
	position: absolute !important;
}

a{ color: #fff; background-color: inherit; text-decoration: none; }
a:hover{ color: #ffa800; background-color: inherit; }

address{ font-style: normal; }

textarea{ overflow: auto; }

.error{ border: solid 1px red !important; }




/* 
-------------------------------------------------------------------------------------------*/
#outterWrapper
{
	width: 930px;
	min-height: 737px;
	margin: 0 auto 1em;;
	
	color: inherit;
	background: #7b7b7b url(/img/ui/bg.jpg) repeat-x;
}

#wrapper
{
	width: 930px;
	min-height: 737px;
	position: relative;
}

#header, #contents, #footer{ clear: both; }



/* Capçalera
-------------------------------------------------------------------------------------------*/
#header{ height: 100px; overflow: visible; }

#header h1
{
	display: block;
	width: auto;
	padding: 2.2em 37px 0 1em;
}

#header h1 a
{
	display: block;
	width: 153px;
	height: 63px;
	
	color: inherit;
	background: #000 url(/img/ui/logo.png) no-repeat;
}

#header h1 a strong, #header h1 em{ height: 0 !important; width: 0 !important; overflow: hidden !important; position: absolute !important; }

#header h1, #siteNav{ float: left; }

#siteNav{ margin-right: -4em; }

#siteNav li{ float: left; padding: 63px 0 0; }

#siteNav a
{
	display: block;
	padding: .2em .7em;
	color: #fff;
	background: #000 url(/img/ui/bgNav.png) repeat;
	border-top: solid 1px #525252;
	border-bottom: solid 1px #525252;
}

#siteNav a:hover{ color: #ffa800; background: #000 url(/img/ui/bgNav.png) repeat-x; }

#siteNav li:first-child a{ border-left: solid 1px #525252; }
#siteNav li:last-child a{ border-right: solid 1px #525252; }

#siteNav strong{ font-weight: normal; text-transform: uppercase; }




/* Continguts
-------------------------------------------------------------------------------------------*/
#contents{ padding: 0 120px 0 202px; min-height: 617px; }

	#contents h1
	{
		font-size: 1.8em;
		line-height: 1.9em;
		font-weight: normal;
		color: #9d9f9f;
		background-color: inherit;
		margin-bottom: .2em;
	}
	
	#contents strong{ text-transform: uppercase; font-weight: normal; }
	
	#contents p{ margin-bottom: 1em; border-collapse: collapse; text-align: justify; }
	
	
	
	
	/* home
	----------------------------------------*/
	body.home #outterWrapper, body.home #wrapper{ min-height: 640px; }
	
	body.home #outterWrapper
	{
		color: inherit;
		background: #707070 url(/img/ui/bg2.jpg) repeat-x;
	}
	
	body.home #contents
	{
		position: relative;
		padding: 2em 0 0;
		font-size: 1.03em;
	}
	
	body.home #contents p{ text-align: left; }
	
	body.home #contents h1,
	body.home #contents h2
	{
		color: #fea700;
		background-color: transparent;
		font-weight: bold;
	}
	
	body.home #contents h1 strong,
	body.home #contents h2 strong{ font-weight: bold; }
	
	body.home #contents h1{ font-size: 1.8em; line-height: 1.2em; }
	body.home #contents h2{ font-size: 1.1em; line-height: 1.4em; }
	
	
	#product-description,
	#product-demo,
	#product-distributors{ float: left; margin-bottom: 2em; }
	#product-examples{ clear: both; }
	
	#product-description{ width: 475px; padding: 0 45px 0 35px; }
	#product-demo{ width: 375px; }
	#product-distributors{ width: 325px; padding: 10px 35px 5px 15px;  }
	
	#product-description h1 em
	{
		color: #fff;
		background-color: transparent;
		font-style: normal;
	}
	
	#product-description h2{ margin-top: 1em; }
	
	#product-demo{ height: 290px; }
	
	#product-demo a
	{
		display: block;
		width: 335px;
		height: 298px;
		text-indent: -1000em;
		color: inherit;
		background: url(/img/ui/demo.png) no-repeat;
	}
	
	#product-distributors{ color: inherit; background: #1d1d1d url(/img/ui/bgProductDistributors.jpg) repeat-x; }
	
	#product-distributors h2{ width: 15em; margin-bottom: .2em; }
	
	#product-distributors a
	{
		color: #fea700;
		background-color: transparent;
		text-decoration: underline;
	}
	
	#product-examples{ position: relative; }
	
	#product-examples h2
	{
		padding: .4em 2em;
		margin-bottom: 1em;
		text-transform: uppercase;
		font-weight: bold;
		color: #fea700 !important;
		background-color: #202020 !important;
	}
	
	#magazinesInner
	{	
		width: 100%;
		height: 180px;
		overflow: auto;
	}
	
	body.jsfied #magazinesInner{ overflow: hidden; }
	
	.magazines-container{ width: auto; }
	
	.magazines-container li
	{
		display: block;
		float: left;
		position: relative;
		height: 180px;
		margin: 0 5px;
	}
	
	#magazinesList_prev,
	#magazinesList_next
	{
		position: absolute;
		top: 6em;
		display: block;
		width: 37px;
		height: 40px;
		cursor: pointer;
	}
	
	#magazinesList_prev
	{
		left: -50px;
		background-image: url(/img/ui/magazinesList_prev.png);
		background-repeat: no-repeat;
	}
	
	#magazinesList_next
	{
		right: -50px;
		background-image: url(/img/ui/magazinesList_next.png);
		background-repeat: no-repeat;
	}
	
	#loadingAnimation
	{
		position: absolute;
		top: 50%;
		left: 50%;
		width: 220px;
		height: 19px;
		margin-top: -9px;
		margin-left: -110px;
	}
	
	
	/* que es
	----------------------------------------*/
	body.queEs #contents h1{ color: #ffa800 !important; background-color: inherit; }
	
	#queEsNav{ clear: both; width: auto; height: 1.4em; margin-right: -8em; padding-bottom: 2em; }
	
	#queEsNav li{ float: left; padding: 0; }
	
	#queEsNav li{ border-right: solid 1px #9b9b9b; }
	#queEsNav li:last-child{ clear: right; border-right: none; }

	#queEsNav a
	{
		display: block;
		padding: .2em .6em;
		color: #fff;
		background: #000 url(/img/ui/bgNav.png) repeat-x;
		border-top: solid 1px #525252;
		border-bottom: solid 1px #525252;
	}
	
	#queEsNav a:hover{ color: #000 !important; background: #fff url(/img/ui/bgNav_over.png) repeat-x; }
	
	
	#queEsNav li:first-child a{ border-left: solid 1px #525252; }
	#queEsNav li:last-child a{ border-right: solid 1px #525252; }
	
	#queEsNav strong{ font-weight: normal; text-transform: uppercase; }
	
	
	
	
		/* que es - soporte
		----------------------------------------*/
		body.soporte #qn1 a{ color: #000 !important; background: #fff url(/img/ui/bgNav_over.png) repeat-x; }
		
		body.soporte #contents ul{ line-height: 1.2em; }
		
		body.soporte #contents strong, body.soporte #contents h3, body.soporte #contents ul{ color: #f29f00; background-color: inherit; }
		
		body.soporte #contents h2{ margin-top: .8em; }
		
		body.soporte #contents h2, body.soporte #contents h3{ font-weight: normal; }
		
		body.soporte #contents h3, body.soporte #contents ul{ padding-bottom: .8em; }
		
		body.soporte #contents em{ font-style: normal; }
		body.soporte #contents em:before{ content: '"';}
		body.soporte #contents em:after{ content: '"'; }
		
		#extendedInfo{ margin-left: -130px; padding-top: 1.5em; }
		
		#extendedInfo strong{ color: #fff !important; background-color: inherit; }
		
		#extendedInfo h3{ font-weight: bold !important; color: #fff !important; background-color: inherit; text-transform: uppercase; margin-bottom: -.8em; }
		
		#extendedInfo h3 + p strong{ color: #f29f00 !important; background-color: inherit; }
		
		#extendedInfo p{ line-height: 1.1em; margin-bottom: .5em; }
		
		#extendedInfo #ejemplo{ float: left; margin-right: 1em; }
		
		#pdf2revistaInteractiva{ margin: 2em 0 2em; clear: both; float: right; }
		
		
		
		
		/* que es - sin costes
		----------------------------------------*/
		body.sinCostes #qn2 a{ color: #000 !important; background: #fff url(/img/ui/bgNav_over.png) repeat-x; }
		
		body.sinCostes #wrapper{ background-image: url(/img/ui/ie6/bgSinCostes.jpg); }
		
		body.sinCostes h2, body.sinCostes h3{ font-weight: normal; }
		
		body.sinCostes h2 strong, #tipoPublicaciones, p#costeCero{ color: #f29f00; background-color: inherit; }
		
		#tipoPublicaciones + ul{ text-transform: uppercase; line-height: 1.1em; margin-bottom: .8em; }
		
		#tipoPublicaciones{ padding: .5em 0; }
		
		p#costeCero
		{
			text-transform: uppercase;
			font-weight: bold;
			text-align: left;
			
			padding-right: 124px;
			padding-top: 50px;
			margin-top: -50px;
			height: 113px;
			background-image: url(/img/ui/0euros.png);
			background-repeat: no-repeat;
			background-position: right;
			width: 50%;
		}
		
		p#costeCero strong{ height: 0 !important; width: 0 !important; overflow: hidden !important; position: absolute !important; }
		
		
		
		
		/* que es - control total
		----------------------------------------*/
		body.controlResultados #qn3 a{ color: #000 !important; background: #fff url(/img/ui/bgNav_over.png) repeat-x; }
		
		body.controlResultados #wrapper{ background-image: url(/img/ui/ie6/bgControl.jpg); }
		
		body.controlResultados #contents h2{ height: 0 !important; width: 0 !important; overflow: hidden !important; position: absolute !important; }
		
		body.controlResultados #contents strong{ color: #f6a200; background-color: inherit; font-weight: normal; }
		
		
		
		
		/* que es - fidelización
		----------------------------------------*/
		body.fidelizacion #qn4 a{ color: #000 !important; background: #fff url(/img/ui/bgNav_over.png) repeat-x; }
		
		body.fidelizacion #wrapper{ background-image: url(/img/ui/ie6/bgFidelizacion.jpg); }
		
		body.fidelizacion #contents h2, body.fidelizacion #contents strong{ font-weight: normal; }
		
		body.fidelizacion #contents h2 em, body.fidelizacion #contents strong{ font-style: normal; color: #ffa800; background-color: inherit; }
		
		
		
		
		/* que es - medio ambiente
		----------------------------------------*/
		body.medioAmbiente #qn5 a{ color: #000 !important; background: #fff url(/img/ui/bgNav_over.png) repeat-x; }
		
		body.medioAmbiente #wrapper{ background-image: url(/img/ui/bgMedioAmbiente.jpg); }
		
		body.medioAmbiente #contents h2{ color: #ffa800; background-color: inherit; font-weight: normal; margin-bottom: 1em; }
		
		body.medioAmbiente #contents ul{ margin-bottom: 1em; }
		
		body.medioAmbiente #contents p strong{ color: #ffa800; background-color: inherit; }
		
		
		
		
	/* quien lo hace 
	----------------------------------------*/
	body.quienLoHace #wrapper{ color: inherit; background: #000 url(/img/ui/bgQuienLoHace.jpg) repeat-x; }
	
	body.quienLoHace #contents em{ color: #f3a100; background-color: inherit; font-style: normal; }
	
	
	
	
	/* ejemplos
	----------------------------------------*/
	body.ejemplos #contents h1{ color: #ffa800 !important; background-color: inherit; }
	
	body.ejemplos #contents{ min-height: 300px; }
	
	#ejemplosNav{ clear: both; width: auto; height: 1.4em; margin-right: -8em; padding-bottom: 2em; }
	
	#ejemplosNav li{ float: left; padding: 0; border-right: solid 1px #9b9b9b; }
	
	#ejemplosNav li:last-child{ clear: right; border-right: none; }

	#ejemplosNav li:last-child{ clear: right; }

	#ejemplosNav a
	{
		display: block;
		padding: .2em 1.3em;
		color: #fff;
		background: #000 url(/img/ui/bgNav.png) repeat-x;
		border-top: solid 1px #525252;
		border-bottom: solid 1px #525252;
	}
	
	#ejemplosNav a:hover{ color: #000 !important; background: #fff url(/img/ui/bgNav_over.png) repeat-x; }
	
	#ejemplosNav li:first-child a{ border-left: solid 1px #525252; }
	#ejemplosNav li:last-child a{ border-right: solid 1px #525252; }
	
	#ejemplosNav strong{ font-weight: normal; text-transform: uppercase; }
	
	body.ejemplos h2{ color: #f3a000; background-color: inherit; font-weight: normal; }
	
	body.ejemplos strong{ font-weight: normal; text-transform: uppercase; }
	
	ul#ejemplos, ul#ejemplos_otros
	{
		margin: 1em 0 2.5em 0;
		padding: 1em 0 0 2em;
		width: 550px;
		clear: both;
		display: block;
		border-left: solid 2px #f2a000;
		height: auto;
	}
	
	ul#ejemplos_otros{ margin-bottom: 4em !important; }
	
	ul#ejemplos li, ul#ejemplos_otros li{ padding: 0 1em 1em 0; float: left; }
	
	h2.ejemplos
	{
		position: relative;
		top: 100px;
		left: -195px;
		width: 180px;
		height: 1px;
		overflow: visible;
		
		text-align: right;
		font-size: 1.7em;
		line-height: 1em;
		text-transform: lowercase;
	}
	
	h2.twoRows{ top: 180px !important; }
	
	h2.otros{ top: 75px !important; }
	
	h2.otrosTwoRows{ top: 110px !important; }
	
	h2.ejemplos span{ height: 0 !important; width: 0 !important; overflow: hidden !important; position: absolute !important; }
	
	li.clearList{ float: none !important; clear: both !important; height: 1px; margin-top: -1em; }
	
	
	
	
	
	
	
	
	
		/* ejemplos - conversionDirecta
		----------------------------------------*/
		body.conversionDirecta #en1 a{ color: #000 !important; background: #fff url(/img/ui/bgNav_over.png) repeat-x; }
		
		body.conversionDirecta h2{ margin-bottom: 1em; }
		
		body.conversionDirecta #contents p:last-child{ margin-top: -1em; }
		
		
		
		
		
		
		/* ejemplos - libroInteractivo
		----------------------------------------*/
		body.libroInteractivo #en2 a{ color: #000 !important; background: #fff url(/img/ui/bgNav_over.png) repeat-x; }
		
		body.libroInteractivo #contents p{ margin-bottom: 0; }
		
		
		
		
		/* ejemplos - revistaDigitalInteractiva
		----------------------------------------*/
		body.revistaDigitalInteractiva #en3 a{ color: #000 !important; background: #fff url(/img/ui/bgNav_over.png) repeat-x; }
		
		body.revistaDigitalInteractiva #contents h2{ margin-bottom: 0; }
		
		h2#maximaExpresion{ margin-top: 1em; }
		
		body.revistaDigitalInteractiva #contents p{ margin-bottom: 0; }
	
	
	
	
	/* contacto
	----------------------------------------*/
	body.contacto #contents{ padding-right: 270px; padding-left: 200px; }
	
	body.contacto #contents em{ font-style: normal; color: #ffa800; background-color: inherit; }
	
	body.contacto #contents h1
	{
		padding-left: .4em;
		color: #9d9f9f;
		background: #000 url(/img/ui/bgNav.png) repeat-x;
		border: solid 1px #525252;
		line-height: 1.2em;
		margin: 1em 0;
	}
	
	#formContacto ol{ list-style: none; padding: 1.5em 0; }
	
	#formContacto ol li{ clear: both; min-height: 3em; }
	
	#formContacto ol li label, #formContacto ol li input, #formContacto ol li textarea{ float: left; }
	
	#formContacto ol li label{ width: 18%; padding-right: 2%; text-align: right; }
	
	#formContacto ol li input, #formContacto ol li textarea
	{
		width: 76%;
		border-top: solid 2px #000;
		border-right: none;
		border-bottom: none;
		border-left: solid 2px #000;
		
		padding: 3px;
		
		color: #fff;
		background-color: #7c7b7b;
		font: .9em Arial, Helvetica, sans-serif;
	}
	
	#formContacto ol li.twoCols{ clear: none; float: left; width: 48%; }
	
	#formContacto ol li.twoCols label{ width: 40%; }
	
	#formContacto ol li.twoCols input{ width: 54%; }
	
	#fURL{ width: 26% !important; }
	
	#formContacto #sbmt label{ height: 0 !important; width: 0 !important; overflow: hidden !important; position: absolute !important; }
	
	#fSubmit
	{
		float: right;
		color: #fff;
		background-color: #f4a200;
		
		text-transform: uppercase;
		font-weight: bold;
		font-size: .85em;
		margin: 1em;
		padding: .2em;
		
		border-top: solid 1px #d5b67c;
		border-right: solid 1px #d5b67c;
		border-bottom: solid 1px #443310;
		border-left: solid 1px #443310;
	}
	
	
	body.contacto #aside
	{
		position: absolute;
		right: 0;
		bottom: 0;
		width: 215px;
		height: 554px;
		padding: 15px;
		background-image: url(/img/ui/bgContacto.png);
	}
	
	body.contacto #aside strong{ font-weight: bold; }
	
	body.contacto #aside #direccionContacto{ color: #f09e00; background-color: inherit; margin-top: 160px; }
	
	body.contacto #aside #direccionContacto h2{ font-weight: normal; }
	
	
	
	
	/* distribuidores
	----------------------------------------*/
	body.distribuidores #wrapper{ color: inherit; background: #000 url(/img/ui/bgDistribuidores.jpg) repeat-x; }
	
		
	
	
	/* error
	----------------------------------------*/
	body.error{ border: none !important; }
	
	body.error #contents ul
	{
		list-style: square;
		padding-left: 2em;
	}
	


/* Peu
-------------------------------------------------------------------------------------------*/
#footer{ font-size: .9em; padding: .2em; min-height: 2em; }

#footer strong{ font-weight: bold; text-transform: uppercase; }
	
#footer strong em{ font-style: normal; color: #ffa800; background-color: inherit; }

#footer, #footer a, #footer a:hover{ color: #fff; background-color: #000; }

#footer a:hover{ text-decoration: underline; }

#footer p{ float: left; padding: 0 .4em; }

#footer p:before{ content: " | "; padding-right: 0.4em; }

#footer p:first-child:before{ content: ""; padding-left: 0; }