/*
 
navegacion.css : Definicion de los elementos para navegar dentro del sitio web
Version: 1.0 -  7 de Septiembre de 2009
Sitio web: www.colombiantravel.com
 
Diseno visual
- Leonardo Pineda
- leo(a)pinedaproject(,)com
 
Codificacion css y xhtml
- Carlos Julio Caicedo
- carloscaicedo(a)gmail(,)com
 
Tipo de licenciamiento
Licencia Reconocimiento-Compartir bajo la misma licencia 2.5
http://creativecommons.org/licenses/by-sa/2.5/co/
 
*/
 
 
 
/*
Definicion del menu de navegacion principal
*/

#cabezote h1,
#cabezote h2,
#cabezote ul,
#cabezote p
{
	position: absolute;
}
	#cabezote h1
	{
		left: 0;
		top: 0;
	}
		#cabezote h1 a
		{
			display: block;
			text-indent: -9000px;
			height:100px;
			width:714px;
			background:url('../imgs/logo-colombiantravels.gif') 0 0 no-repeat;
		}

	#cabezote ul
	{
		left: 110px;
		top: 143px;
		list-style-type: none;
		margin: 0;
		padding: 0;
		z-index: 1000;
	}
		#cabezote ul li
		{
			float: left;
			margin-right: 2px;
			z-index: 1500;
		}
			#cabezote ul li span
			{
			}
				#cabezote span a
				{
					display: block;
					/*text-indent: -9000px;*/
					height: 30px;
					background: #FFFFFF;
				}
	#cabezote p#idioma
	{
		left:780px;
		top: 13px;
	}
		#cabezote p#idioma a
		{
			text-indent: -9000px;
			display: block;
			width:80px;
			height:18px;
			background-image: url('../imgs/btns-idiomas.gif');
		}
			#cabezote p.esp a
			{
				background-position:0 0;
			}
				#cabezote p.esp a:hover
				{
					background-position: -80px 0;
				}
			#cabezote p.eng a
			{
				background-position:0 -18px;
			}
				#cabezote p.eng a:hover
				{
					background-position: -80px -18px;
				}


	#cabezote h2
	{
		left: 25px;
		top: 100px;
		font-size: 1.10em;
		color: #C01C2D;
		font-weight: bold;
	}

/*Definicion de la barra de navegacion*/

/*Primero las caracteristicas generales*/

#navegacion 
{
	z-index:1000;
	width: 700px;
	height: 29px;
	margin: 0;
	padding: 0;
}
	#navegacion li
	{
		margin: 0;
		padding: 0;
		float: left;
	}
		#navegacion li a
		{
			width:86px;
			height: 29px;
			display: block;
			text-indent: -9000px;
			outline: none;
		}
			#navegacion li a:hover
			{
				background-position-y: -29px;
			}
/*Ahora la posicion para cada uno de los tabs*/
				#menuHome a
				{
					background-position: 0 0;
				}
					#menuHome a:hover
					{
						background-position: 0 -29px;
					}
					#menuHome a.activo,
					#menuHome a.activo:hover
					{
						background-position: 0 -58px;
					}
				#menuAbout a
				{
					background-position: -86px 0;
				}
					#menuAbout a:hover
					{
						background-position: -86px -29px;
					}
					#menuAbout a.activo,
					#menuAbout a.activo:hover
					{
						background-position: -86px -58px;
					}
				#menuTours a
				{
					background-position: -172px 0;
				}
					#menuTours a:hover
					{
						background-position: -172px -29px;
					}
					#menuTours a.activo,
					#menuTours a.activo:hover
					{
						background-position: -172px -58px;
					}
				#menuTailor a
				{
					background-position: -258px 0;
				}
					#menuTailor a:hover
					{
						background-position: -258px -29px;
					}
					#menuTailor a.activo,
					#menuTailor a.activo:hover
					{
						background-position: -258px -58px;
					}
				#menuBook a
				{
					background-position: -344px 0;
				}
					#menuBook a:hover
					{
						background-position: -344px -29px;
					}
					#menuBook a.activo,
					#menuBook a.activo:hover
					{
						background-position: -344px -58px;
					}
				#menuColombia a
				{
					background-position: -430px 0;
				}
					#menuColombia a:hover
					{
						background-position: -430px -29px;
					}
					#menuColombia a.activo,
					#menuColombia a.activo:hover
					{
						background-position: -430px -58px;
					}
				#menuVolunteering a
				{
					background-position: -516px 0;
				}
					#menuVolunteering a:hover
					{
						background-position: -516px -29px;
					}
					#menuVolunteering a.activo,
					#menuVolunteering a.activo:hover
					{
						background-position: -516px -58px;
					}
/*Aqui esta la magia para que se muestre un menu de acuerdo con el idioma*/

				.eng li a
				{
					background-image: url('../imgs/navegacion-eng.gif');
				}
				.esp li a
				{
					background-image: url('../imgs/navegacion-esp.gif');
				}
/*Menu desplegable*/


	#menuTours ul li
	{
		z-index: 2500;
	}
/*Definicion del alto de cada item*/

#menuTours ul
{
}
#menuTours ul li
{
	margin:5px 0 0 0;
}
	#menuTours ul li a
	{
		height: auto;
		padding-bottom: 10px;
	}
/**/
		#menuTours ul li a
		{
			font-size: 0.9em;
			font-weight: normal;
			text-indent: 0;
			text-decoration: none;
			background-image: none;
			width: 220px;
			float: left;
			clear: both;
			margin: 0 0 2px 0;
			line-height: 1em;
		}
		/*Hack-box*/
		#menuTours ul li a
		{
			padding:3px 0 0 20px;
			voice-family: "\"}\"";
			voice-family: inherit;
			width:180px; /*Para el ie60*/
		}
		html>body ul#menuTours ul li a
		{
			width:180px; /*Para el firefox*/
		}
		/*Fin del Hack-box*/
	#menuTours ul:hover,
	#menuTours ul:sfhover
	{
		left:-8px;
	}




#navegacion
{
	position:relative;
	z-index:10000;
	left:0;
}
/*definicion para los submenu*/
#navegacion li ul
{
	position:absolute;
	left:-9999px;
	height:auto;
	margin:0;
	padding:0;
	top:0;
	width: 220px;
	z-index: 2000;
	padding-bottom: 20px;
	background: #FFFFFF;
}

	#navegacion li li
	{
		padding:6px 0 3px 0;
		background-image:none;
		background: url('../imgs/punteada.gif') top left no-repeat;
		height:auto;
		z-index: 1000;
		line-height: 0.8em;
	}
		#navegacion li li:first-child
		{
			background-image: none;
			padding-top: 4px;
		}
		#navegacion li li a
		{
			font-size: 0.8em;
			font-weight: normal;
			text-indent: 0;
			background-image: none;
			width: 220px;
			float: left;
			clear: both;
			margin: 0 0 2px 0;
			line-height: 0.8em;
		}
		/*Hack-box*/
		#menuTours ul li a
		{
			padding:3px 20px 0px 20px;
			voice-family: "\"}\"";
			voice-family: inherit;
			width:180px; /*Para el ie60*/
		}
		html>body ul#menuTours ul li a
		{
			width:180px; /*Para el firefox*/
		}
		/*Fin del Hack-box*/
		#navegacion li li a:hover
		{
			color:#003366;
		}
/*funciones para el menu*/
#navegacion li:hover ul, #navegacion li li:hover ul, #navegacion li li li:hover ul, #navegacion li.sfhover ul, #navegacion li li.sfhover ul, #navegacion li li li.sfhover ul
{
	left:168px;
	top:28px;
	z-index: 1000;
}
/*fin de las funciones*/
/*fin de los submenu*/









/* Definicion del pie de pagina */

#pie p
{
	margin-top: 85px;
	margin-right: 20px;
	padding: 0;
	color: #FFFFFF;
	font-size: 0.8em;
	float: right;
	clear: both;
	text-align: right;
}
	#pie p a
	{
		font-size: 1.2em;
		color: #FFFFFF;
	}