/*-----------------------------------------------------------------------------------*/ /* Top Menu - Hornav */ /*-----------------------------------------------------------------------------------*/ #hornav { position: relative; padding-top: 0px; padding-right:0px; > ul { border-radius: 0 5px 0 5px; padding: 0 10px 0 12px; > li { margin:0px 5px; padding: 12px 0; > a, > span { color:#333333; display:block; font-family: 'Lato', sans-serif; font-size:14px; letter-spacing:1px; line-height: 1.4em; padding: 8px 18px; text-decoration: none; margin: 1px; z-index: 1; -webkit-transition-duration: 0.4s; -moz-transition-duration: 0.4s; -o-transition-duration: 0.4s; -ms-transition-duration: 0.4s; transition-duration: 0.4s; -webkit-transition-property: background-color; -moz-transition-property: background-color; -o-transition-property: background-color; -ms-transition-property: background-color; transition-property: background-color;; border-radius: 5px; &:hover, &:active, &.current { background-color: rgba(0, 0, 0, 0.043); border: 1px solid rgba(0, 0, 0, 0.15); border-radius: 4px 4px 4px 4px; margin:0; box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.05) inset; } } } } } /* Dropdown Menu */ #hornav ul ul { background: #f4f1ea; border-radius: 5px; border: 1px solid #dddddd; position:relative; -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2); -ms-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2); -o-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2); box-shadow: 0 0 4px rgba(0, 0, 0, 0.2); display: block; list-style: none; margin: 0px; padding: 5px 0 !important; min-width: 200px; z-index: 20; li { min-height: 22px; float: none; position: relative; a, span { background-color: transparent; box-shadow: none; display: block; padding: 6px 15px; color: #555555 !important; text-transform: none; border-top: 1px solid rgba(0, 0, 0, 0.05); } } &:before { background: transparent url('../img/menu_arrow.png') no-repeat 0 0; content: ""; display: block; height: 10px; left: 26px; position: absolute; top: -10px; width: 14px; } } #hornav ul ul li:first-child a { border: none; } #hornav ul ul li a:active, #hornav ul ul li a:focus, #hornav ul ul li a:hover { text-decoration: none; background-color: rgba(0, 0, 0, 0.05); } #hornav ul ul li:hover a { text-decoration: none; } #hornav ul ul ul:before { display: none; } #hornav li ul, #hornav li ul li ul { position: absolute; height: auto; min-width: 200px; opacity: 0; visibility: hidden; transition: all 300ms linear; -o-transition: all 300ms linear; -ms-transition: all 300ms linear; -moz-transition: all 300ms linear; -webkit-transition: all 300ms linear; top: 70px; z-index: 1000; } #hornav li:hover > ul, #hornav li ul li:hover > ul { display: block; opacity: 1; visibility: visible; top: 60px; } #hornav li ul li ul { left: 220px; top: 0; } #hornav li ul li:hover > ul { top: 0px; left: 200px; } #hornav ul ul .parent:after { top: 10px; right: 15px; color: #777; font-size: 14px; content: "\f105"; position: absolute; font-weight: normal; display: inline-block; font-family: FontAwesome; }