/********** Documento CSS obejodesign.com * NAVEGACIÓN **********/

ul#navegacion {
	position: relative;
	top: 10px;
	width: 153px;
	height: 60px;
	margin: 0px 10px 0px auto;
	padding: 0px;
}

ul#navegacion li {
	margin: 0px;
	padding: 0px;
	list-style: none;
	float: left;
}

ul#navegacion li a#home, ul#navegacion li a#portfolio, ul#navegacion li a#bio, ul#navegacion li a#blog, ul#navegacion li a#contacto {
	display: block;
	height: 60px;
	margin: 0px;
	padding: 0px;
	background-image: url(imagenes/navegacion.jpg);
	background-repeat: no-repeat;
}

ul#navegacion li a#home span, ul#navegacion li a#portfolio span, ul#navegacion li a#bio span, ul#navegacion li a#blog span, ul#navegacion li a#contacto span {
	display: none;
}

ul#navegacion li a#home {
	width: 70px;
	background-position: 0px 0px;
}

ul#navegacion li a#home:hover {
	background-position: 0px -60px;
}

ul#navegacion li a#portfolio {
	width: 90px;
	background-position: -70px 0px;
}

ul#navegacion li a#portfolio:hover {
	background-position: -70px -60px;
}

ul#navegacion li a#bio {
	width: 55px;
	background-position: -160px 0px;
}

ul#navegacion li a#bio:hover {
	background-position: -160px -60px;
}

ul#navegacion li a#blog {
	width: 64px;
	background-position: -215px 0px;
}

ul#navegacion li a#blog:hover {
	background-position: -215px -60px;
}

ul#navegacion li a#contacto {
	width: 89px;
	background-position: -279px 0px;
}

ul#navegacion li a#contacto:hover {
	background-position: -279px -60px;
}

body#home-activo ul#navegacion li a#home:link,
body#home-activo ul#navegacion li a#home:visited,
body#home-activo ul#navegacion li a#home:hover,
body#home-activo ul#navegacion li a#home:active,
body#portfolio-activo ul#navegacion li a#portfolio:link,
body#portfolio-activo ul#navegacion li a#portfolio:visited,
body#portfolio-activo ul#navegacion li a#portfolio:hover,
body#portfolio-activo ul#navegacion li a#portfolio:active,
body#corporativa-activo ul#navegacion li a#portfolio:link,
body#corporativa-activo ul#navegacion li a#portfolio:visited,
body#corporativa-activo ul#navegacion li a#portfolio:hover,
body#corporativa-activo ul#navegacion li a#portfolio:active,
body#cds-activo ul#navegacion li a#portfolio:link,
body#cds-activo ul#navegacion li a#portfolio:visited,
body#cds-activo ul#navegacion li a#portfolio:hover,
body#cds-activo ul#navegacion li a#portfolio:active,
body#carteles-activo ul#navegacion li a#portfolio:link,
body#carteles-activo ul#navegacion li a#portfolio:visited,
body#carteles-activo ul#navegacion li a#portfolio:hover,
body#carteles-activo ul#navegacion li a#portfolio:active,
body#impresos-activo ul#navegacion li a#portfolio:link,
body#impresos-activo ul#navegacion li a#portfolio:visited,
body#impresos-activo ul#navegacion li a#portfolio:hover,
body#impresos-activo ul#navegacion li a#portfolio:active,
body#editorial-activo ul#navegacion li a#portfolio:link,
body#editorial-activo ul#navegacion li a#portfolio:visited,
body#editorial-activo ul#navegacion li a#portfolio:hover,
body#editorial-activo ul#navegacion li a#portfolio:active,
body#fotografia-activo ul#navegacion li a#portfolio:link,
body#fotografia-activo ul#navegacion li a#portfolio:visited,
body#fotografia-activo ul#navegacion li a#portfolio:hover,
body#fotografia-activo ul#navegacion li a#portfolio:active,
body#mixcelanea-activo ul#navegacion li a#portfolio:link,
body#mixcelanea-activo ul#navegacion li a#portfolio:visited,
body#mixcelanea-activo ul#navegacion li a#portfolio:hover,
body#mixcelanea-activo ul#navegacion li a#portfolio:active,
body#bio-activo ul#navegacion li a#bio:link,
body#bio-activo ul#navegacion li a#bio:visited,
body#bio-activo ul#navegacion li a#bio:hover,
body#bio-activo ul#navegacion li a#bio:active,
body#blog-activo ul#navegacion li a#blog:link,
body#blog-activo ul#navegacion li a#blog:visited,
body#blog-activo ul#navegacion li a#blog:hover,
body#blog-activo ul#navegacion li a#blog:active,
body#contacto-activo ul#navegacion li a#contacto:link,
body#contacto-activo ul#navegacion li a#contacto:visited,
body#contacto-activo ul#navegacion li a#contacto:hover,
body#contacto-activo ul#navegacion li a#contacto:active {
	display: block;
	height: 60px;
	margin: 0px;
	padding: 0px;
	background-image: url(imagenes/navegacion-activa.jpg);
	background-repeat: no-repeat;
}

body#home-activo ul#navegacion li a#home:link,
body#home-activo ul#navegacion li a#home:visited,
body#home-activo ul#navegacion li a#home:hover,
body#home-activo ul#navegacion li a#home:active {
	width: 70px;
	background-position: 0px 0px;
}

body#portfolio-activo ul#navegacion li a#portfolio:link,
body#portfolio-activo ul#navegacion li a#portfolio:visited,
body#portfolio-activo ul#navegacion li a#portfolio:hover,
body#portfolio-activo ul#navegacion li a#portfolio:active,
body#corporativa-activo ul#navegacion li a#portfolio:link,
body#corporativa-activo ul#navegacion li a#portfolio:visited,
body#corporativa-activo ul#navegacion li a#portfolio:hover,
body#corporativa-activo ul#navegacion li a#portfolio:active,
body#cds-activo ul#navegacion li a#portfolio:link,
body#cds-activo ul#navegacion li a#portfolio:visited,
body#cds-activo ul#navegacion li a#portfolio:hover,
body#cds-activo ul#navegacion li a#portfolio:active,
body#carteles-activo ul#navegacion li a#portfolio:link,
body#carteles-activo ul#navegacion li a#portfolio:visited,
body#carteles-activo ul#navegacion li a#portfolio:hover,
body#carteles-activo ul#navegacion li a#portfolio:active,
body#impresos-activo ul#navegacion li a#portfolio:link,
body#impresos-activo ul#navegacion li a#portfolio:visited,
body#impresos-activo ul#navegacion li a#portfolio:hover,
body#impresos-activo ul#navegacion li a#portfolio:active,
body#editorial-activo ul#navegacion li a#portfolio:link,
body#editorial-activo ul#navegacion li a#portfolio:visited,
body#editorial-activo ul#navegacion li a#portfolio:hover,
body#editorial-activo ul#navegacion li a#portfolio:active,
body#fotografia-activo ul#navegacion li a#portfolio:link,
body#fotografia-activo ul#navegacion li a#portfolio:visited,
body#fotografia-activo ul#navegacion li a#portfolio:hover,
body#fotografia-activo ul#navegacion li a#portfolio:active,
body#mixcelanea-activo ul#navegacion li a#portfolio:link,
body#mixcelanea-activo ul#navegacion li a#portfolio:visited,
body#mixcelanea-activo ul#navegacion li a#portfolio:hover,
body#mixcelanea-activo ul#navegacion li a#portfolio:active {
	width: 90px;
	background-position: -70px 0px;
}

body#bio-activo ul#navegacion li a#bio:link,
body#bio-activo ul#navegacion li a#bio:visited,
body#bio-activo ul#navegacion li a#bio:hover,
body#bio-activo ul#navegacion li a#bio:active {
	width: 55px;
	background-position: -160px 0px;
}

body#blog-activo ul#navegacion li a#blog:link,
body#blog-activo ul#navegacion li a#blog:visited,
body#blog-activo ul#navegacion li a#blog:hover,
body#blog-activo ul#navegacion li a#blog:active {
	width: 64px;
	background-position: -215px 0px;
}

body#contacto-activo ul#navegacion li a#contacto:link,
body#contacto-activo ul#navegacion li a#contacto:visited,
body#contacto-activo ul#navegacion li a#contacto:hover,
body#contacto-activo ul#navegacion li a#contacto:active {
	width: 89px;
	background-position: -279px 0px;
}

/********** SUB-NAVEGACIÓN Portfolio **********/

ul.sub-navegacion, li.categories ul {
	width: 170px;
	/* height: 145px; */
	margin: 30px 0px 0px 0px;
	padding: 0px;
}

ul.sub-navegacion li, li.categories ul li {
	margin: 0px;
	padding: 0px;
	list-style: none;
}

ul.sub-navegacion li a, li.categories ul li {
	display: block;
	width: 170px;
}

ul.sub-navegacion li a, li.categories ul li, li.categories ul li a {
	height: 29px;
	margin: 0px;
	padding: 0px 0px 0px 15px;
	font: normal 12px/24px "Lucida Grande", Helvetica, Arial, sans-serif;
	letter-spacing: 0em;
	text-decoration: none;
	color: black;
}

ul.sub-navegacion li a:hover, li.categories ul li:hover {
	display: block;
	background-image: url(imagenes/portfolio-sobre.jpg);
	background-repeat: no-repeat;
	letter-spacing: 0em;
	text-decoration: underline;
	color: #ff9600;
}

li.categories ul li:hover {
	text-decoration: none;
	color: #404040;
}

li.categories ul li a:hover {
	text-decoration: underline;
	color: #ff9600;
}

body#corporativa-activo ul.sub-navegacion li a#corporativa:link,
body#corporativa-activo ul.sub-navegacion li a#corporativa:visited,
body#corporativa-activo ul.sub-navegacion li a#corporativa:hover,
body#corporativa-activo ul.sub-navegacion li a#corporativa:active,
body#cds-activo ul.sub-navegacion li a#cds:link,
body#cds-activo ul.sub-navegacion li a#cds:visited,
body#cds-activo ul.sub-navegacion li a#cds:hover,
body#cds-activo ul.sub-navegacion li a#cds:active,
body#carteles-activo ul.sub-navegacion li a#carteles:link,
body#carteles-activo ul.sub-navegacion li a#carteles:visited,
body#carteles-activo ul.sub-navegacion li a#carteles:hover,
body#carteles-activo ul.sub-navegacion li a#carteles:active,
body#impresos-activo ul.sub-navegacion li a#impresos:link,
body#impresos-activo ul.sub-navegacion li a#impresos:visited,
body#impresos-activo ul.sub-navegacion li a#impresos:hover,
body#impresos-activo ul.sub-navegacion li a#impresos:active,
body#editorial-activo ul.sub-navegacion li a#editorial:link,
body#editorial-activo ul.sub-navegacion li a#editorial:visited,
body#editorial-activo ul.sub-navegacion li a#editorial:hover,
body#editorial-activo ul.sub-navegacion li a#editorial:active,
body#fotografia-activo ul.sub-navegacion li a#fotografia:link,
body#fotografia-activo ul.sub-navegacion li a#fotografia:visited,
body#fotografia-activo ul.sub-navegacion li a#fotografia:hover,
body#fotografia-activo ul.sub-navegacion li a#fotografia:active,
body#mixcelanea-activo ul.sub-navegacion li a#mixcelanea:link,
body#mixcelanea-activo ul.sub-navegacion li a#mixcelanea:visited,
body#mixcelanea-activo ul.sub-navegacion li a#mixcelanea:hover,
body#mixcelanea-activo ul.sub-navegacion li a#mixcelanea:active {
	display: block;
	width: 170px;
	height: 29px;
	margin: 0px;
	padding: 0px;
	background-image: url(imagenes/portfolio-activo.jpg);
	background-repeat: no-repeat;
	padding: 0px 0px 0px 15px;
	font: normal 12px/24px "Lucida Grande", Helvetica, Arial, sans-serif;
	letter-spacing: 0em;
	text-decoration: none;
	color: white;
}
