/**
 * Esta hoja de estilo guarda la definición de los distintos tipos de menú definidos
 * en el Portal Web. En particular, existen los siguientes menús diferenciados.
 *
 * @author Divisa Informática y Telecomunicaciones S.A.
 */

.cmMenuBox:after {
	content: " ";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.menuSocial .cmMenuTitle,
.menuSocial .cmMenuPopupImage,
.menuColectivos .cmMenuPopupImage,
.menuBotones .cmMenuPopupImage,
.menuCabecera .cmMenuPopupImage,
.menuPrincipal .cmMenuPopupImage,
.menuHeadSup .cmMenuPopupImage,
.menuValidacion .cmMenuPopupImage,
.menuSiguenos .cmMenuPopupImage,
.ico-externo-oculto .cmMenuPopupImage,
.menu-texto-oculto > span .cmMenuPopupImage,
.menu-texto-oculto > span .cmMenuTitle,
.menu-texto-oculto > span.cmMenuTitle,
.menu-texto-oculto > a .cmMenuPopupImage,
.menu-texto-oculto > a .cmMenuTitle {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}

/* Menú Social */
.menuSocial {
	float: left;
}

.menuSocial ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.menuSocial ul li {
	list-style: none;
	margin: 0 4px 0 0;
	padding: 0;
	display: block;
	float: left;
}

.menuSocial .redes-sociales a {
	line-height: 20px;
	padding: 0 4px;
	margin-right: 3px;
	display: block;
	text-align: left;
	vertical-align: top;
	color: #ffffff;
	border-radius: 0.4em;
	-moz-border-radius: 0.4em;
	-webkit-border-radius: 0.4em;
	box-shadow: 0.2em 0.2em 0.6em #cccccc;
	-webkit-box-shadow: 0.2em 0.2em 0.6em #cccccc;
	-moz-box-shadow: 0.2em 0.2em 0.6em #cccccc;
	background-color: #00a4ab;
}

.menuSocial .redes-sociales a:hover {
	background-color: #00949b;
	text-decoration: none;
}

.menuSocial .redes-sociales .cmMenuTitle {
	position: relative;
	width: auto;
	height: auto;
	margin: 0;
	clip: auto;
}

.menuSocial .cmMenuImage {
	width: auto;
	height: 20px;
}

/* Menú Superior */
.menuSuperior {
	background-color: #00a4ab;
	color: #fff;
	border-radius: 0.4em;
	-moz-border-radius: 0.4em;
	-webkit-border-radius: 0.4em;
	box-shadow: 0.2em 0.2em 0.6em #cccccc;
	-webkit-box-shadow: 0.2em 0.2em 0.6em #cccccc;
	-moz-box-shadow: 0.2em 0.2em 0.6em #cccccc;
	float: right;
}

.menuSuperior ul {
	list-style: none;
	margin: 0;
	padding: 3px 2px;
	float: right;
}

.menuSuperior ul li {
	list-style: none;
	border-right: 1px solid #fff;
	display: block;
	float: left;
}

.menuSuperior ul li.lastElement {
	border-right: none;
}

.menuSuperior ul li .cmMenuTitle {
	padding: 0 4px;
	line-height: 14px;
	display: block;
}

.menuSuperior a {
	color: #fff;
	display: block;
}

/*Menú Completo */
.menuCompleto {
	float: left;
	margin: 10px 0;
	width: 100%;
	text-align: left;
}

.menuCompleto ul {
	float: left;
}

.menuCompleto ul li {
	font-size: 1.2em;
	font-weight: bold;
	padding: 5px 10px;
}

/* Menú Inferior */
.menuInferior {
	color: #fff;
	margin: 0 -3px;
}

.menuInferior ul {
	list-style: none;
	margin: 0;
	padding: 2px 4px;
	font-size: 11px;
	text-align: center;
}

.menuInferior ul li {
	list-style: none;
	border-right: 1px solid #fff;
	padding: 0 4px 0 1px;
	line-height: 14px;
	display: inline;
}

.menuInferior ul li.lastElement {
	border-right: none;
}

.menuInferior a {
	color: #fff;
}

/* Menú Cabecera */
.menuCabecera {
	position: absolute;
	top: 4px;
	right: 15px;
	color: #fff;
	width: 181px;
}

.menuCabecera ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.menuCabecera ul li {
	list-style: none;
	margin: 2px 0;
	padding: 0;
	display: block;
}

.menuCabecera a {
	color: #fff;
}

.menuCabecera .cmMenuTitle {
	font-size: 14px;
	font-weight: bold;
	display: block;
	padding: 1px 5px 1px 23px;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	background: url(../imagenes/component/nuevo_dis/menu_supli_2.gif) left no-repeat;
}

/* Menú Colectivos */
.menuColectivos {
	margin-top: 15px;
}

.menuBotones {
	margin-bottom: 15px;
}

.menuColectivos ul,
.menuBotones ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.menuColectivos ul {
	padding: 0 0 0 12px;
}

.menuColectivos ul li,
.menuBotones ul li {
	list-style: none;
	padding: 0;
	display: block;
	float: left;
	color: #fff;
	font-size: 11px;
	font-weight: bold;
	background: #00a3aa;
	border: 1px solid #007670;
}

.menuColectivos ul li {
	margin: 4px 2px 0;
	-webkit-border-top-left-radius: 8px;
	-moz-border-radius-topleft: 8px;
	border-top-left-radius: 8px;
	-webkit-border-top-right-radius: 8px;
	-moz-border-radius-topright: 8px;
	border-top-right-radius: 8px;
	border-bottom: none;
}

.menuBotones ul li {
	margin: 4px 4px 0 0;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}

.menuBotones.texto-derecha li,
.menuBotones.texto-centrado li {
	display: inline-block;
	float: none;
	margin-right: 1px;
}

.menuColectivos ul li:hover,
.menuBotones ul li:hover {
	background: #007670;
}

.menuColectivos span,
.menuBotones span {
	display: block;
}

.menuColectivos a,
.menuBotones a {
	color: #fff;
	display: block;
}

.menuColectivos a:hover,
.menuBotones a:hover {
	text-decoration: none;
}

.menuColectivos .cmMenuTitle,
.menuBotones .cmMenuTitle {
	display: block;
}

.menuColectivos .cmMenuTitle {
	padding: 2px 7px;
}

.menuBotones .cmMenuTitle {
	padding: 4px 10px;
}

/* Menú Lateral */
.menuLateral {
	margin-bottom: 15px;
}

.menuLateral h3,
.menuLateral .menu-titulo {
	color: #007771;
	font-size: 14px;
	font-weight: bold;
}

.menuLateral ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.menuLateral ul li {
	list-style: none;
	display: block;
	margin-bottom: 10px;
}

.menuLateral ul li:before,
.menuLateral ul li:after {
	content: " ";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.menuLateral > div > ul,
.menuLateral > ul {
	padding: 0 15px 0 12px;
}

.menuLateral .cmMenuPopupImage img {
	vertical-align: baseline;
}

.menuLateral img {
	max-width: 100%;
}

/* Menú Accesos */
.menuAccesos {
	margin-bottom: 15px;
}

.menuAccesos h3 {
	color: #007771;
	font-size: 14px;
}

.menuAccesos ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.menuAccesos ul li {
	list-style: none;
	display: block;
}

.menuAccesos > div > ul,
.menuAccesos > ul {
	padding: 0 15px 0 12px;
}

.menuAccesos > div > ul > li > span,
.menuAccesos > ul > li > span,
ul > li.menu-acceso > span {
	border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	box-shadow: 0.2em 0.2em 0.5em #bbb;
	-webkit-box-shadow: 0.2em 0.2em 0.5em #bbb;
	-moz-box-shadow: 0.2em 0.2em 0.5em #bbb;
	border: 1px solid #ccc;
	margin: 10px 0 5px 0;
	font-weight: bold;
	padding: 0.25em 0;
	text-align: center;
	display: block;
}

.menu-acceso li,
.menuAccesos li li {
	background: url(../imagenes/component/bullets/flecha_vclaro.gif) no-repeat;
	margin: 0;
	padding: 0 0 0 1em;
}

.menu-acceso a,
.menuAccesos a {
	display: block;
}

.acceso-azul-oscuro > span > a,
.acceso-azul-oscuro > span {
	color: #fff !important;
	background-color: #003781;
}

.acceso-azul-claro > span > a,
.acceso-azul-claro > span {
	color: #fff !important;
	background-color: #00a6ad;
}

.acceso-azul > span > a,
.acceso-azul > span {
	color: #fff !important;
	background-color: #548bc4;
}

.acceso-verde-oscuro > span > a,
.acceso-verde-oscuro > span {
	color: #fff !important;
	background-color: #44a02a;
}

.acceso-verde-claro > span > a,
.acceso-verde-claro > span {
	color: #fff !important;
	background-color: #6aa923;
}

.acceso-verde > span > a,
.acceso-verde > span {
	color: #fff !important;
	background-color: #00762e;
}

.acceso-rojo > span > a,
.acceso-rojo > span {
	color: #fff !important;
	background-color: #C22700;
}

/* Menú Principal */
.menuPrincipal {
	margin-bottom: 5px;
}

.menuPrincipal ul,
.menu-ppal ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.menuPrincipal span {
	display: block;
}

.menu-ppal > ul {
	padding: 0 10px 0 7px;
}

.menuPrincipal ul li , 
.menu-ppal > ul li {
	list-style: none;
	margin: 0 0 10px;
	text-align: center;
}

.menuPrincipal ul li ul{
	margin-left: 1em;
}

.menuPrincipal .cmMenuTitle,
.menu-ppal .cmMenuTitle {
	text-align: left;
	background: url(../imagenes/component/nuevo_dis/cuadr_b2.png) no-repeat 1.2em 0.2em;
	line-height: 1.3em;
	padding: .2em 1em .1em 2.2em;
}

.menuPrincipal .cmMenuImage, 
.menu-ppal .cmMenuImage {
	max-width: 100%;
	height: auto;
}

.menuPrincipal .cmMenuImage + .cmMenuTitle,
.menu-ppal .cmMenuImage + .cmMenuTitle {
	background: none;
	text-align: center;
	padding-left: 1em;
}

.menu-border-top {
	padding-top: 10px;
	border-top: 1px solid #ccc;
	margin-top: 10px;
}

.menu-border-bottom {
	padding-bottom: 10px;
	border-bottom: 1px solid #ccc;
	margin-bottom: 10px;
}

.menuCajas > div > ul > li > ul li.menu-border-top,
.menuCajas > ul > li > ul li.menu-border-top,
.menu-caja-icono > ul li.menu-border-top,
.menu-caja > ul li.menu-border-top {
	padding-top: 8px;
	background-position: left 12px;
}

.menuCajas > div > ul > li > ul li.menu-border-bottom,
.menuCajas > ul > li > ul li.menu-border-bottom,
.menu-caja-icono > ul li.menu-border-bottom,
.menu-caja > ul li.menu-border-bottom {
	padding-bottom: 8px;
}

.submenu-col-2 {
	float: left;
	width: 50%;
}

.submenu-col-3 {
	float: left;
	width: 33.33%;
}

.submenu-col-4 {
	float: left;
	width: 25%;
}

.menu-negrita > span .cmMenuTitle,
.menu-negrita > span.cmMenuTitle,
.menu-negrita > a .cmMenuTitle {
	font-weight: bold;
	padding: 0 0 10px 0;
}

li.menu-texto-oculto {
	background-image: none !important;
	list-style: none !important;
}

li.menu-caja li.menu-texto-oculto {
	padding-left: 0;
}

li.menu-caja li.menu-texto-oculto img {
	padding-left: 0;
	max-width: 100%;
}

.menu-centrado {
	background-image: none;
	list-style: none;
	text-align: center;
}

.menu-centrado > span .cmMenuTitle,
.menu-centrado > a .cmMenuTitle {
	display: inline;
	list-style: none;
	background-image: none;
	background-repeat: none;
	background-position: 0;
}

.menu-centrado > span img.cmMenuImage,
.menu-centrado > a img.cmMenuImage {
	display: block;
	margin-left: auto;
	margin-right: auto;
	max-width: 100%;
	height: auto;
}

.menu-img-dcha > span img.cmMenuImage,
.menu-img-dcha > a img.cmMenuImage {
	display: block;
	float: right;
	margin-left: 5px;
	margin-right: 0;
	max-width: 100%;
	height: auto;
}

.menu-img-izda > span img.cmMenuImage,
.menu-img-izda > a img.cmMenuImage {
	display: block;
	float: left;
	margin-left: 0;
	margin-right: 5px;
	max-width: 100%;
	height: auto;
}

.menu-img-centrado {
	text-align: center;
}

.menu-img-centrado a {
	display: block;
}

.menu-img-centrado a span {
  display: inline-block;
}

.menuCajas > div > ul,
.menuCajas > ul {
	padding: 0 15px 0 12px;
}

.menuCajas ul {
	margin: 0;
	list-style: none;
}

.menuCajas > div > ul > li,
.menuCajas > ul > li,
.menu-caja-icono,
.menu-caja {
	border-radius: 0.4em;
	-moz-border-radius: 0.4em;
	-webkit-border-radius: 0.4em;
	box-shadow: 0.2em 0.2em 0.6em #cccccc;
	-webkit-box-shadow: 0.2em 0.2em 0.6em #cccccc;
	-moz-box-shadow: 0.2em 0.2em 0.6em #cccccc;
	border: 1px solid #d0d0d1;
	margin: 0 0 15px 0;
}

.menuCajas > div > ul > li > span,
.menuCajas > ul > li > span,
.menu-caja-icono > span,
.menu-caja > span {
	padding: 10px 15px 10px 15px;
	margin: 0;
	font-size: 14px;
	font-weight: bold;
	color: #007771;
	display: block;
	line-height: 1.1;
}

.menuCajas > div > ul > li > span,
.menuCajas > ul > li > span,
.menu-caja-icono > span {
	padding-left: 30px;
	background-image: url(../imagenes/component/nuevo_dis/ic_h2.gif);
	background-repeat: no-repeat;
	background-position: 1em center;
}

.menuCajas > div > ul > li > ul,
.menuCajas > ul > li > ul,
.menu-caja > ul,
.menu-caja-icono > ul {
	border-top: 1px solid #ccc;
	padding: 10px 15px;
}

.menuCajas > div > ul > li > ul li,
.menuCajas > ul > li > ul li,
.menu-caja-icono > ul li, 
.menu-caja > ul li {
	padding: 0 0 0 15px;
	margin: 8px 0 0 0;
	background: url(../imagenes/component/nuevo_dis/ic_lista_caja.png) no-repeat left 4px;
}

.menuCajas > div > ul > li > ul > li.firstElement,
.menuCajas > ul > li > ul > li.firstElement,
.menu-caja-icono > ul > li.firstElement, 
.menu-caja > ul > li.firstElement {
	margin-top: 0;
}

.menu-sub-flecha > ul > li {
	background: url(../imagenes/component/bullets/flecha_vclaro.gif) no-repeat;
	margin: 0 0 5px 0;
	padding: 0 0 0 10px;
}