Advertisement
Guest User

Untitled

a guest
Mar 7th, 2013
248
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 3.36 KB | None | 0 0
  1. /* Superfish menu */
  2. .main-navigation {
  3. position:relative;
  4. font-size:16px;
  5. }
  6.  
  7. /*** ESSENTIAL STYLES ***/
  8. .sf-menu, .sf-menu * {
  9. margin: 0;
  10. padding: 0;
  11. list-style: none;
  12. }
  13. .sf-menu {
  14. line-height: 1.0;
  15. }
  16. .sf-menu ul {
  17. position: absolute;
  18. top: -999em;
  19. width: 10em; /* left offset of submenus need to match (see below) */
  20. }
  21. .sf-menu ul li {
  22. width: 100%;
  23. }
  24. .sf-menu li:hover {
  25. visibility: inherit; /* fixes IE7 'sticky bug' */
  26. }
  27. .sf-menu li li:hover,
  28. .sf-menu li li.current-menu-item,
  29. .sf-menu li li.current-menu-ancestor {
  30. border-bottom: none;
  31.  
  32. }
  33. .sf-menu li {
  34. display: inline-block;
  35. position: relative;
  36. }
  37. .sf-menu a {
  38. display: block;
  39. position: relative;
  40. }
  41. .sf-menu li:hover ul,
  42. .sf-menu li.sfHover ul {
  43. left: 0;
  44. top: 2.2em; /* match top ul list item height */
  45. z-index: 99;
  46. }
  47. ul.sf-menu li:hover li ul,
  48. ul.sf-menu li.sfHover li ul {
  49. top: -999em;
  50. }
  51. ul.sf-menu li li:hover ul,
  52. ul.sf-menu li li.sfHover ul {
  53. left: 10em; /* match ul width */
  54. top: 0;
  55. }
  56. ul.sf-menu li li:hover li ul,
  57. ul.sf-menu li li.sfHover li ul {
  58. top: -999em;
  59. }
  60. ul.sf-menu li li li:hover ul,
  61. ul.sf-menu li li li.sfHover ul {
  62. left: 10em; /* match ul width */
  63. top: 0;
  64. }
  65.  
  66. /*** DEMO SKIN ***/
  67. .sf-menu {
  68. float:right;
  69. }
  70. .sf-menu a {
  71. padding: .60em 0.5em;
  72. text-decoration:none;
  73. }
  74. .sf-menu li {
  75. background: none;
  76. }
  77. .sf-menu li li {
  78. background: #3d3242;
  79. border-bottom: none;
  80. }
  81.  
  82. .sf-menu li li li {
  83. background: #3d3242;
  84. }
  85. .sf-menu li:hover, .sf-menu li.sfHover,
  86. .sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
  87. outline: 0;
  88. }
  89.  
  90. /*** arrows **/
  91. .sf-menu a.sf-with-ul {
  92. padding-right: 1.75em;
  93. min-width: 1px; /* trigger IE7 hasLayout so spans position accurately */
  94. }
  95. .sf-sub-indicator {
  96. position: absolute;
  97. display: block;
  98. right: .75em;
  99. top: 1.05em; /* IE6 only */
  100. width: 10px;
  101. height: 10px;
  102. text-indent: -999em;
  103. overflow: hidden;
  104. background: url('./images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
  105. }
  106. a > .sf-sub-indicator { /* give all except IE6 the correct values */
  107. top: .7em;
  108. background-position: 0 -100px; /* use translucent arrow for modern browsers*/
  109. }
  110. /* apply hovers to modern browsers */
  111. a:focus > .sf-sub-indicator,
  112. a:hover > .sf-sub-indicator,
  113. a:active > .sf-sub-indicator,
  114. li:hover > a > .sf-sub-indicator,
  115. li.sfHover > a > .sf-sub-indicator {
  116. background-position: -10px -100px; /* arrow hovers for modern browsers*/
  117. }
  118.  
  119. /* point right for anchors in subs */
  120. .sf-menu ul .sf-sub-indicator { background-position: -10px 0; }
  121. .sf-menu ul a > .sf-sub-indicator { background-position: 0 0; }
  122. /* apply hovers to modern browsers */
  123. .sf-menu ul a:focus > .sf-sub-indicator,
  124. .sf-menu ul a:hover > .sf-sub-indicator,
  125. .sf-menu ul a:active > .sf-sub-indicator,
  126. .sf-menu ul li:hover > a > .sf-sub-indicator,
  127. .sf-menu ul li.sfHover > a > .sf-sub-indicator {
  128. background-position: -10px 0; /* arrow hovers for modern browsers*/
  129. }
  130.  
  131. /*** shadows for all but IE6 ***/
  132. .sf-shadow ul {
  133. background: url('./images/shadow.png') no-repeat bottom right;
  134. padding: 0 8px 9px 0;
  135. -moz-border-radius-bottomleft: 17px;
  136. -moz-border-radius-topright: 17px;
  137. -webkit-border-top-right-radius: 17px;
  138. -webkit-border-bottom-left-radius: 17px;
  139. }
  140. .sf-shadow ul.sf-shadow-off {
  141. background: transparent;
  142. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement