.ddsmoothmenu {
Bold 12px Verdana;
background: # 414141; / * Fondo de la barra de menú (estado por defecto) * /
width: 100%;
display: none;
color:#fff;
}

.ddsmoothmenu ul {
z-index: 100;
margin: 0;
padding: 0;
list-style-type: none;
}

/ * Elementos de la lista de nivel superior * /
.ddsmoothmenu ul li {
position: relative;
display: inline;
flotador izquierdo;
}

/ * Nivel superior menú de vínculos elementos de estilo * /
.ddsmoothmenu ul li a {
bloqueo de pantalla;
background: # 414141; / * Fondo de los elementos del menú (estado por defecto) * /
color blanco;
padding: 10px 8 píxeles;
border-right: 1px solid # 778;
color: # 2d2b2b;
text-decoration: none;
}

* Html .ddsmoothmenu ul li a {/ * IE6 truco para conseguir enlaces de submenú que se comporten correctamente * /
display: inline-block;
}

.ddsmoothmenu ul li a: link, .ddsmoothmenu ul li a: visited {
color blanco;
}

.ddsmoothmenu ul li a.selected {/ * clase CSS que se agrega de forma dinámica a los elementos de menú LI actualmente activas "Un elemento * /
fondo: negro! important; 
color blanco;
}

.ddsmoothmenu ul li a: hover {
fondo: negro; / * Fondo de los elementos del menú durante onmouseover (estado estacionario) * /
color blanco;
}
	
/ * * Submenús /
.ddsmoothmenu ul li {ul
position: absolute;
izquierda: -3000px;
display: none; / * Contraer todos los submenús, para empezar * /
visibility: hidden;
}

/ * Lista de menú de nivel Sub artículos (estilo altera a partir de Top Level Artículos) * /
.ddsmoothmenu ul li li ul {
display: list-item;
float: none;
}

/ * Todos los subsiguientes niveles del submenú distancia al eje vertical después de submenú 1er nivel * /
.ddsmoothmenu ul li ul li {ul
top: 0;
}

/ * Sub nivel de menú enlaces de estilo * /
.ddsmoothmenu ul li ul li a {
fuente: Verdana normal de 13px;
Anchura: 160px; / * Ancho de submenús * /
padding: 5px;
margin: 0;
border-top-width: 0;
border-bottom: 1px sólido de color gris;
}

/ * Acebo Hack para IE \ * /
* Html .ddsmoothmenu {height: 1%;} / * acebo Hack para IE7 y abajo * /


/ * ######### Clases CSS aplicados a las imágenes abajo y flecha derecha / ######### *

.downarrowclass {
position: absolute;
top: 12px;
derecha: 7px;
}

.rightarrowclass {
position: absolute;
arriba: 6px;
derecha: 5px;
}

.leftarrowclass {
margin-right: 5px;
}

/ * ######### CSS para sombra añadido a submenús ######### * /

.ddshadow { 
position: absolute;
izquierda: 0;
top: 0;
anchura: 0;
altura: 0;
background-color: #ccc; / * En general, debería ser sólo un poco más ligero que el color de la caja-sombra para los navegadores capaces de CSS3 * /
}

.toplevelshadow {
margen: 5px 0 0 5px; / * NO en CSS3 navegadores capaces proporciona el desplazamiento de la sombra * /
Opacidad: 0,8; / * Opacidad sombra sobre todo para NO navegadores capaces de CSS3. No funciona en IE * /
}

.ddcss3support .ddshadow.toplevelshadow {
margin: 0; / * En CSS3 navegadores capaces altera temporalmente desplazadas de NO CSS3 navegadores capaces, permitiendo que los valores de caja de sombra en la siguiente selector de gobernar que * /
/ * Opacidad: 1; * / / * Opcionalmente elimine esta opción para eliminar la opacidad parcial para navegadores que soporten una propiedad box-shadow que tiene su propio ligera opacidad del gradiente * /
}

.ddcss3support .ddshadow {
background-color: transparente;
box-shadow: 5px 5px 5px #aaa; / * Color de la caja-sombra en general, debe ser un poco más oscuro que el del NO CSS3 navegadores capaces background-color * /
-moz-box-shadow: 5px 5px 5px #aaa;
webkit-box-shadow: 5px 5px 5px #aaa;
}

/ * ######### Móvil contenedor menú CSS ######### * /

div.ddsmoothmobile {/ * menú principal del contenedor móvil * /
background: # 414141;
color blanco;
position: fixed;
top: 0;
izquierda: 0;
Anchura: 200px; / * Ancho del menú móvil * /
altura: 300px;
sobrecarga oculta;
visibility: hidden;
la frontera de radio: 0 0 0 10px;
box-shadow: 0 0 10px gris;
}

div.ddsmoothmobile a {
color blanco;
text-decoration: none;
}

div.topulsdiv div.ddsmoothmobile {/ * DIV individual que rodea a todos los ULs de nivel superior antes de ser aplanado, o los ULs en el "Inicio" del menú * /
position: relative;
background: # 414141;
desbordamiento-y: auto;
width: 100%;
altura: 100%;
}


div.ddsmoothmobile ul {/ * estilo para todos los ULs en general menú móvil en el interior * /
list-style: none;
width: 100%;
top: 0;
izquierda: 0;
background: # 414141;
margin: 0;
padding: 0;
}

div.ddsmoothmobile div.topulsdiv ul.submenu {/ * estilo ULs nivel superior * /
}


div.ddsmoothmobile ul.submenu {/ * sub nivel de estilo UL * /
position: absolute;
altura: 100%;
desbordamiento-y: auto;
}

div.ddsmoothmobile ul li {
border-bottom: 1px sólido de color gris;
position: relative;
font-weight: bold;
}

div.ddsmoothmobile ul li.breadcrumb {/ * LI ruta de navegación que se agrega a la parte superior de cada nivel sub UL * /
cursor: puntero;
padding: 10px;
fondo: negro;
}

div.ddsmoothmobile ul li a {
bloqueo de pantalla;
padding: 6px;
}

div.ddsmoothmobile ul li a: hover {
fondo: negro;
}

/ * ############# Animada icono del cajón (menú toggler móvil) CSS ############# * /

.animateddrawer {
	font-size: 10px; / * Tamaño de la fuente base. Ajuste este valor para modificar el tamaño del icono de control * /
  anchura: 3em; 
  altura: 2.8em; 
  esbozar: ninguno;
	position: fixed; / * Hacen por defecto que toggler fija en la pantalla * /
	display: none;
	top: 10px; / * Posición en la esquina superior derecha * /
	derecha: 10px;
	Fondo: blanco;
	z-index: 1000;
}

.animateddrawer: antes, .animateddrawer: tras {
  position: absolute;
  contenido: '';
  bloqueo de pantalla;
  width: 100%;
  altura: 0.6em; / * Altura de la parte superior y la línea cajón inferior * /
  fondo: negro;
  la frontera de radio: 2px;
  top: 0;
  izquierda: 0;
  opacidad: 1;
  -webkit-transición: toda facilidad 0.3s-en; / * Tipo de transición conjunto y el tiempo * /
  transición: toda facilidad 0.3s-en; 
}

.animateddrawer: tras {
  arriba: auto;
  parte inferior: 0;
}

.animateddrawer Gen {
  width: 100%;
  altura: 0.6em; / * La altura de la línea media del cajón * /
  fondo: negro;
  position: absolute;
  superior: 50%;
  margin-top: -0.3em; / * Ponga esto en - la mitad de la altura de la línea media del cajón * /
  la frontera de radio: 2px;
  -ms, transformación y origen: 50% al 50%;
  -webkit-transform-origen: 50% al 50%;
  transformar origen: 50% 50%;
  -webkit-transición: todos 0.3s facilidad en 0,3 s; / * Tipo de transición conjunto y el tiempo * /
  transición: todos 0.3s facilidad en 0,3 s;
}

.animateddrawer lapso :: tras {
  contenido: '';
  bloqueo de pantalla;
  width: 100%;
  altura: 0.6em; / * La altura de la línea media del cajón * /
  fondo: negro;
  la frontera de radio: 2px;
  position: absolute;
  -ms, transformación y origen: 50% al 50%;
  -webkit-transform-origen: 50% al 50%;
  transformar origen: 50% 50%;
  -webkit-transición: todos 0.3s facilidad en 0,3 s; / * Tipo de transición conjunto y el tiempo * /
  transición: todos 0.3s facilidad en 0,3 s;
}

.animateddrawer.open {
}

.animateddrawer.open: antes de {/ * estilo cuando se añade a la clase .open botón * /
  superior: 50%;
  margin-top: -0.3em; / * Ponga esto en - la mitad de la altura de la línea cajón superior * /
  Opacidad: 0;
}

.animateddrawer.open: tras {/ * estilo cuando se añade a la clase .open botón * /
  parte inferior: 50%;
  Opacidad: 0;
}

lapso .animateddrawer.open {/ * estilo cuando se añade a la clase .open botón * /
  -ms-transform: gira (-45deg);
  -webkit-transform: rotate (-45deg);
  transform: rotar (-45deg);
}

lapso .animateddrawer.open: tras {/ * estilo cuando se añade a la clase .open botón * /
  -ms-transform: gira (-90deg);
  -webkit-transform: rotate (-90deg);
  transform: rotar (-90deg);
}/* CSS Document */