
/* Footer */
body.home #footer
{
  background-image: none;
  margin-bottom:120px !important;
}
body.home .footer 
{ 
	clear: both;
	z-index: 2;
	width: 1063px;
	border-top: 1px #E3E3E3 solid;
	height: 23px;
	line-height: 23px;
	position:absolute;
	bottom: 0px;
	background-color: 5694ff !important;
	
}
body.home #footer .meta 
{
	display: inline;
	margin-left: 80px;
	top: 0px !important;
	line-height: 21px;
	font-size: 11px;
}
body.home #footer .copyright
{
	display: inline;
	position: absolute;
	left: 245px;
	bottom: 0px;
	top: 0px !important;
	line-height: 21px;
	font-size: 11px;
}

body.home .infoFlyoutImage  /* pone a cierta altura el texto del flyout*/

{
    background-image:url(/images_gf/loading.gif);  
	    background-position:center;
    background-repeat:no-repeat;
    width: 551px;
    height: 180px;
    padding:0;
}


body.home .infoFlyoutImage2
{
    background-image:url(/images_gf/loading.gif);
    background-position:center;
    background-repeat:no-repeat;
    width: 551px;
    height: 180px;
    padding:0;
}




body.home div.introImage /* hace que salga en orden toda la imagen principal*/
{
  top: 0px;
  left: 0px;
  width: auto;
  height: auto;
  margin: 0px;
  background-color: #000000;
}

body.home div.content
{
  width: auto; /* hace que el footer se quede abajo*/
  padding-left: 263px;
  height: 795px !important; /* Changed 4 sharebar from 755px */
  min-height: 795px;
}




.homeNavigation, .homeNavigationLangSelect
{
  padding-top: 79px;  /* La altura del menu principal */
  top: 8px;
  left: 0px;
  width: 170px;
  height: 360px; /*312px;*/
  /*background-image:url(/images_gf/jdpower/200803/navi_bg_aktiv.gif);
  background-repeat:no-repeat;
  background-position: 0px 80px;*/
}


/*****************/
/* shadow, homenavigation */
/*
#homeShadow 
{
    display:none;
}
*/
#homemenue /* home navigation */
{
  z-index: 1;
  position: absolute;
  
  top: 0px;
  left: 1px;
  height: 600px;
  width:170px;
  background-image: none !important;
  background-color: transparent !important;  
}


body.usaPool #navshade1 
{
  top: 0px;
  height: 600px;
  width: 170px;
  background-image: none !important;
  opacity: none !important;  
  background-color: transparent !important;
}


#navshade3  /* flyout shadow */
{
  display: none !important;
}

body .info  /* flyout */
{
  left: 487px;
  width: 551px;
  height:483px; /* la medida de la altura de la parte baja del flyout */
  top:10;
  padding: 0;
}

body .info_peque0  /* flyout */
{
  left: 487px;
  width: 551px;
  height:315px; /* la medida de la altura de la parte baja del flyout */
  top:10;
  padding: 0;
}

body .info_peque1  /* flyout */
{
  left: 487px;
  width: 551px;
  height:405px; /* la medida de la altura de la parte baja del flyout */
  top:10;
  padding: 0;
}

body .info_peque2  /* flyout */
{
  left: 487px;
  width: 551px;
  height:430px; /* la medida de la altura de la parte baja del flyout */
  top:10;
  padding: 0;
}

body .info_peque3  /* flyout */
{
  left: 487px;
  width: 551px;
  height:450px; /* la medida de la altura de la parte baja del flyout */
  top:10;
  padding: 0;
}

body .info_peque4  /* flyout */
{
  left: 487px;
  width: 551px;
  height:470px; /* la medida de la altura de la parte baja del flyout */
  top:10;
  padding: 0;
}





/*****************/
/* submenu items */
body.usaPool div.subnav 
{
	font-size: 11px !important;
}


body div.subnav, body div.subnav.final  /* flyout */
{
  width: 170px;
  height: 23px;
  padding: 0px;
  line-height: 24px;
  text-indent: 24px;
  vertical-align: middle;
  border-bottom: 1px solid #CCCCCC;
  border-right: 0px solid #666666;
  background-image: url(/images_gf/hp-navi.png);
  background-position: 0 0;
}

body.usaPool div.subnav.final
{
    background-position: 0 -200px;
}

/*placeholder */
.toppos30 { top: -8px; height: 15px !important }
.subnav .innerdummy
{
    position: absolute;
    width: 20px;
    height: inherit;
    right: 0;
    background: #fff;    
}
.toppos1 { top:  8px; }
.toppos2 { top: 32px; }
.toppos3 { top: 56px; }
.toppos4 { top: 80px; }
.toppos5 { top: 104px; }
.toppos6 { top: 128px; }
.toppos7 { top: 152px; }
.toppos8 { top: 176px; }
.toppos9 { top: 200px; }
.toppos10 { top: 224px; }
.toppos11 { top: 248px; }
.toppos12 { top: 272px; }
.toppos13 { top: 296px; }
.toppos14 { top: 320px; }
.toppos15 { top: 344px; }
.toppos16 { top: 368px; }
.toppos17 { top: 392px; }
.toppos18 { top: 416px; }
.toppos19 { top: 440px; }
.toppos20 { top: 464px; }
.toppos21 { top: 488px; }
.toppos22 { top: 512px; }
.toppos23 { top: 536px; }


/********************/
/* main menue items */
div.topnav
{
  text-transform: none;
  
}
#topnav1, .topnav1, 
#topnav2, .topnav2, 
#topnav3, .topnav3, 
#topnav4, .topnav4, 
#topnav5, .topnav5, 
#topnav6, .topnav6, 
#topnav7, .topnav7, 
#topnav8, .topnav8, 
#topnav9, .topnav9, 
#topnav10, .topnav10, 
#topnav11, .topnav11, 
#topnav12, .topnav12, 
#topnav13, .topnav13, 
#topnav14, .topnav14, 
#topnav15, .topnav15
{
  overflow: visible;
  position: relative;
  top: 0px;
  width: 210px; /*el ancho de los botones, uno de ellos al menos, parece que es el ancho de la imagen detras, pero no el ancho del boton propiamente*/
  border: 0px #CCCCCC solid;
  border-top: 1px #000 solid; /*  el color del borde superior de los botcccccc */
  padding: 0px;
  margin: 0px;
  vertical-align: top;
  font-size: 11px;
  color: #000000;
  z-index: 100000;
  background-position: 0px 0px;
  background-repeat: no-repeat;
}
#topnav1, .topnav1 /* id of menu item, CSS class of shadow */
{
  top: 0px;
}

#topnav1, .topnav1,
#topnav2, .topnav2,
#topnav3, .topnav3,
#topnav4, .topnav4,
#topnav5, .topnav5,
#topnav6, .topnav6
{
  height: 47px;
  background-position: 0 -500px; 
  background-color: #eeeeee;
  
  background-repeat: repeat;

  
}

#topnav2, .topnav2{

  left:170px; top: -48px; border-left:1px solid #CCCCCC; 
}

#topnav3, .topnav3{

  left:340px; top: -96px; border-left:1px solid #CCCCCC; 
}

#topnav4, .topnav4{

  left:510px; top: -144px; border-left:1px solid #CCCCCC; 
}

#topnav5, .topnav5{

  left:680px; top: -192px; border-left:1px solid #CCCCCC; 
}


#topnav6, .topnav6{

  left:850px; top: -240px; border-left:1px solid #CCCCCC; 
}



#topnav7, .topnav7
{
  height: 18px;/* + 5 padding top = 23 */
}
#topnav8, .topnav8
{
  height: 18px;/* + 5 padding top = 23 */
}
#topnav9, .topnav9
{
  height: 18px; /* + 5 padding top = 23 */
}
#topnav10, .topnav10, #topnav11, .topnav11, #topnav12, .topnav12, #topnav13, .topnav13, #topnav14, .topnav14, #topnav15, .topnav15
{
  height: 18px; /* + 5 padding top = 23 */
}
#topnav1 a
{
  background-image: url(/images_gf/modelrange2.png);
  background-position: 0px 0px;
  background-repeat: no-repeat;
}
#topnav2 a
{
  background-image: url(/images_gf/modelrange2.png);
  background-position: 0px -100px;
  background-repeat: no-repeat;
}
#topnav3 a
{
  background-image: url(/images_gf/modelrange2.png);
  background-position: 0px -200px;
  background-repeat: no-repeat;
}
#topnav4 a
{
  background-image: url(/images_gf/modelrange2.png);
  background-position: 0px -300px;
  background-repeat: no-repeat;
}
#topnav5 a
{
  background-image: url(/images_gf/modelrange2.png);
  background-position: 0px -400px;
  background-repeat: no-repeat;
}

#topnav6 a
{
  background-image: url(/images_gf/modelrange2.png);
  background-position: 0px -500px;
  background-repeat: no-repeat;
}

#topnav7, #topnav8, #topnav9, #topnav10, #topnav11, #topnav12, #topnav13, #topnav14, #topnav15
{
  background-color: #F9F9F9;
  height: 23px;
}

a.topnavlink /* 223 breit, 48 hoch : 1.-aqui parece que se debe cambiar el ancho del menu también*/
{
  padding: 0px;
  margin: 0px;
  position: absolute;
  width: 170px;  /* Si pongo este en 210 en ie7 y 8 cuando se hace hover sobre el menu principal el evento se sale del botón tuve que crear el topnavlink_x
  para que el 170 no afectará al último botón*/
  height: 47px;
  color: #000000;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: 0px 0px;
  text-decoration: none;
}

a.topnavlink_x /* 223 breit, 48 hoch : 1.-aqui parece que se debe cambiar el ancho del menu también*/
{
  padding: 0px;
  margin: 0px;
  position: absolute;
  width: 210px;  /* Cuando puse este en 210 (antes estaba en 170) el sexto botón comenzó a mostrar correctamente su bg image al hacer el mouse out*/
  height: 47px;
  color: #000000;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: 0px 0px;
  text-decoration: none;
}

#topnav7 a.topnavlink, #topnav8 a.topnavlink, #topnav9 a.topnavlink, #topnav10 a.topnavlink, #topnav11 a.topnavlink, #topnav12 a.topnavlink, #topnav13 a.topnavlink, #topnav14 a.topnavlink, #topnav15 a.topnavlink /* 223 breit, 23 hoch */
{
  font-size: 10px;
  padding-top: 5px;
  height: 18px;
  text-indent: 24px;
  background-color: #F9F9F9;
  /* background-image: url(/images_gf/arrow-black.gif);
  background-position: 210px 8px;*/
  background-image: url(/images_gf/hp-navi.png);
  background-position: 0 0;
}
#topnav7 a.final, #topnav8 a.final, #topnav9 a.final, #topnav10 a.final, #topnav11 a.final, #topnav12 a.final, #topnav13 a.final, #topnav14 a.final, #topnav15 a.final /* 223 breit, 23 hoch */
{
  background-image: none !important;
}
body.usaPool #topnav7 a.topnavlink, body.usaPool #topnav8 a.topnavlink, body.usaPool #topnav9 a.topnavlink, body.usaPool #topnav10 a.topnavlink, body.usaPool #topnav11 a.topnavlink, body.usaPool #topnav12 a.topnavlink, body.usaPool #topnav13 a.topnavlink, body.usaPool #topnav14 a.topnavlink, body.usaPool #topnav15 a.topnavlink /* 223 breit, 23 hoch */
{
	font-size: 11px !important;
}
/***************/



/***************/
/* Flyout Layer*/

body.usaPool .modelPrice
{
	right:17px;
	top:261px;
	color: #666666;
}
body.usaPool .bottomFlyout .headline
{
	position: relative;
	
	height: 100px; /* la altura en donde comienza la lista del lado izquierdo que esta dentro del flyout*/
	background: url(/images_gf/mr/flyout_headlines.png) no-repeat 0 0;
	 background-position: 0 50px;
}


body.usaPool .bottomFlyout .headline.explore
{    
    background-position: 0 -50px; /* hace que se vea correctamente el segundo headline*/
}


body.usaPool .bottomFlyout .headline_kitsytermo

{
	position: relative;
	
	height: 100px;/* la altura en donde comienza la lista del lado izquierdo que esta dentro del flyout*/
	background: url(/images_gf/mr/kitsytermo_headers.png) no-repeat 0 0;
	 background-position: 0 50px;
}

body.usaPool .bottomFlyout .headline_kitsytermo.explore
{    
    background-position: 0 -50px; /* hace que se vea correctamente el segundo headline de kits y termos*/
}

body.usaPool .bottomFlyout .headline_almacenaje

{
	position: relative;
	
	height: 100px; /* la altura en donde comienza la lista del lado izquierdo que esta dentro del flyout*/
	background: url(/images_gf/mr/almacenaje_headers.png) no-repeat 0 0;
	 background-position: 0 50px;
}

body.usaPool .bottomFlyout .headline_almacenaje.explore
{    
    background-position: 0 -50px; /* hace que se vea correctamente el segundo headline de kits y termos*/
}

body.usaPool .bottomFlyout .headline_reciclado

{
	position: relative;
	
	height: 100px; /* la altura en donde comienza la lista del lado izquierdo que esta dentro del flyout*/
	background: url(/images_gf/mr/reciclado_headers.png) no-repeat 0 0;
	 background-position: 0 50px;
}

body.usaPool .bottomFlyout .headline_reciclado.explore
{    
    background-position: 0 -50px; /* hace que se vea correctamente el segundo headline de kits y termos*/
}

body.usaPool .bottomFlyout .headline_equipo

{
	position: relative;
	
	height: 100px; /* la altura en donde comienza la lista del lado izquierdo que esta dentro del flyout*/
	background: url(/images_gf/mr/equipo_headers.png) no-repeat 0 0;
	 background-position: 0 50px;
}

body.usaPool .bottomFlyout .headline_equipo.explore
{    
    background-position: 0 -50px; /* hace que se vea correctamente el segundo headline de kits y termos*/
}

body.usaPool .bottomFlyout .headline_outsourcing

{
	position: relative;
	
	height: 100px;/* la altura en donde comienza la lista del lado izquierdo que esta dentro del flyout*/
	background: url(/images_gf/mr/outsourcing_headers.png) no-repeat 0 0;
	 background-position: 0 50px;
}

body.usaPool .bottomFlyout .headline_outsourcing.explore
{    
    background-position: 0 -50px; /* hace que se vea correctamente el segundo headline de kits y termos*/
}

body.usaPool .bottomFlyout .headline_materiales

{
	position: relative;
	
	height: 100px; /* la altura en donde comienza la lista del lado izquierdo que esta dentro del flyout*/
	background: url(/images_gf/mr/materiales_headers.png) no-repeat 0 0;
	 background-position: 0 50px;
}

body.usaPool .bottomFlyout .headline_materiales.explore
{    
    background-position: 0 -50px; /* hace que se vea correctamente el segundo headline de materiales*/
}




body.usaPool .bottomFlyout .headline_filosofia

{
	position: relative;
	
	height: 100px; /* la altura en donde comienza la lista del lado izquierdo que esta dentro del flyout*/
	background: url(/images_gf/mr/filosofia_headers.png) no-repeat 0 0;
	 background-position: 0 50px;
}


body.usaPool .bottomFlyout .headline_calidad

{
	position: relative;
	
	height: 100px; /* la altura en donde comienza la lista del lado izquierdo que esta dentro del flyout*/
	background: url(/images_gf/mr/calidad_headers.png) no-repeat 0 0;
	 background-position: 0 50px;
}

body.usaPool .bottomFlyout .headline_instalaciones

{
	position: relative;
	
	height: 100px; /* la altura en donde comienza la lista del lado izquierdo que esta dentro del flyout*/
	background: url(/images_gf/mr/instalaciones_headers.png) no-repeat 0 0;
	 background-position: 0 50px;
}

body.usaPool .bottomRightFlyout .subclaim
{
    line-height: 21px;  /* la distancia entre las lineas del texto principal*/
    font-size: 16px !important;
	text-align:left; 
	color:#FFF /*  El color de la typografía del lado derecho arriba del flyout*/
   
}


.subclaim_servicios
{
    line-height: 16px;  /* la distancia entre las lineas del texto principal*/
    font-size: 15px !important;
	text-align:left; 
	color:#FFF /*  El color de la typografía del lado derecho arriba del flyout*/
   
}

.subclaim2
{
    line-height: 19px;  /* la distancia entre las lineas del texto principal*/
    font-size: 18px !important;
	text-align:left; 
	color:#FFF /*  El color de la typografía del lado derecho arriba del flyout*/
   
}


.subclaim_extended
{
    line-height: 15px;  /* la distancia entre las lineas del texto principal*/
    font-size: 14px !important;
	text-align:left; 
	color:#FFF /*  El color de la typografía del lado derecho arriba del flyout*/
   
}

.subclaim_notsobig
{
    line-height: 15px;  /* la distancia entre las lineas del texto principal*/
    font-size: 14px !important;
	text-align:left; 
	color:#FFF /*  El color de la typografía del lado derecho arriba del flyout*/
   
}



body.usaPool .infoLinkFlyout a:hover
{
	color: #77b6f5; /*  El color de la typografía del lado izquierdo del flyout osea de las listas*/
	background-position: 0px 0px;
}




.infoFlyoutImage 
{
    width: auto;
    height: auto;
}
.infoFlyoutImage img 
{
    width: 551px;
    height: 255px;
}



.infoLinkFlyout 
{
    width: 189px;
    background-color: transparent;
	}
.infoLinkFlyout_extended
{
    width: 189px;
    background-color: transparent;	
	
	
}
.infoLinkHeading
{
    /* margin: 0px 0px 0px -1px; */
    margin: 0;
    padding: 0px 0px 13px 0px;
}
.infoLinkFlyout a 
{
    width: 185px; /* 135 Breite + Padding 4 + Padding 13 = 152  Esta es la anchura o el largo que mide la linea de la lista el elemento "a"*/
    margin-top: -2px;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 10px; /* distancia hacia la flecha de la lista */
    background-position: 0px -447px;
    border-bottom: medium none;
	color: #96c7f7;
}
.infoLinkFlyout a.first
{
    border:medium none;
    margin-top: -1px;
}
.bottomLeftFlyout, .bottomMiddleFlyout
{
    border-top: none;
    height:auto;
    margin-top: 0px;   
    overflow:hidden;
    position:relative;
}
.bottomMiddleFlyout
{

   margin-top: -90px;  /* la altura en donde comienza la segunda lista del lado izquierdo del flyout*/
    
}

.bottomLeftFlyout
{
    top: 0px;
}

.bottomRightFlyout
{    
    height: 230px;
    left: 232px;
    right: auto;
    top: 90px;   /* la altura en donde comienza la primer lista debajo de la imagen del lado derecho, osea el texto principal*/
    width: 303px;
} 

.bottomRightFlyout_extended
{    
    height: 230px;
    left: 142px;
    right: auto;
    padding-top: 90px !important;   /* la altura en donde comienza el texto debajo de la imagen, osea el texto principal*/
    width: 503px;
} 



.bottomRightFlyout22
{    
    height: 192px;
    left: 232px;
    right: auto;
    top: 11px;
    width: 303px;
}



.bottomMiddleFlyout
{
    top: 10px;
}

/*lower part sticks to the bottom of the right container*/
.bottomRightFlyout .lower
{
    position: absolute;
    bottom: 0px;
}


.bottomRightFlyout .lower2
{
    position: relative;
    bottom: 0px;
}


/* Flyout */
.info, .info_peque1, .info_peque2, .info_peque3, .info_peque4, .info_peque0, .infoFlyout , .bottomFlyout 
{
    overflow: visible;
    width: 551px;

}

.bottomFlyout
{
    padding-left: 15px;  /* distancia hacia la orilla izquierda donde comimenza la lista  */
    height: 192px;
    background: url(/images_gf/mr/flyout_bg.jpg) no-repeat 0 0;
}


