pro_dropdown_3.css 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186
  1. /* ================================================================
  2. This copyright notice must be kept untouched in the stylesheet at
  3. all times.
  4. The original version of this stylesheet and the associated (x)html
  5. is available at http://www.stunicholls.com/menu/pro_dropdown_3.html
  6. Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
  7. This stylesheet and the associated (x)html may be modified in any
  8. way to fit your requirements.
  9. =================================================================== */
  10. #nav {
  11. padding:7px 0 0 6px;
  12. margin:0;
  13. list-style:none;
  14. height:28px;
  15. background:#353535;
  16. position:relative;
  17. z-index:500;
  18. font-family:Arial, Helvetica, sans-serif;
  19. border-top:1px solid #7e7e7e;
  20. border-bottom:1px solid #242424;
  21. -moz-box-shadow: 0 2px 5px rgba(0,0,0,.35);
  22. -webkit-box-shadow: 0 2px 5px rgba(0,0,0,.35);
  23. box-shadow: 0 2px 5px rgba(0,0,0,.35);
  24. }
  25. #nav li.top {
  26. display:block;
  27. float:left;
  28. margin:0 5px 0 0;
  29. }
  30. #nav li a.top_link {
  31. display:block;
  32. float:left;
  33. height:18px;
  34. color:#ccc;
  35. text-decoration:none;
  36. font-size:11px;
  37. text-transform:uppercase;
  38. font-weight:bold;
  39. padding:4px 0 0 14px;
  40. cursor:pointer;
  41. }
  42. #nav li a.top_link span {
  43. float:left;
  44. display:block;
  45. padding:0 14px 0 0;
  46. }
  47. #nav li a.top_link span.down {
  48. float:left;
  49. display:block;
  50. padding:0 28px 0 0px;
  51. background:url(images/down_arrow.png) no-repeat right 50%;
  52. }
  53. #nav li:hover a.top_link, #nav li.active a.top_link, #nav li.active:hover a.top_link {
  54. color:#fff;
  55. background:#000;
  56. -moz-border-radius: 3px;
  57. -webkit-border-radius: 3px;
  58. border-radius: 3px;
  59. }
  60. #nav li:hover a.top_link span {
  61. }
  62. #nav li:hover a.top_link span.down {
  63. background:url(images/down_arrow.png) no-repeat right 50%;
  64. }
  65. /* Default list styling */
  66. #nav li:hover {
  67. position:relative;
  68. z-index:200;
  69. }
  70. #nav li:hover ul.sub {
  71. left:1px;
  72. top:22px;
  73. background: #202020;
  74. padding:3px;
  75. border:1px solid #161616;
  76. white-space:nowrap;
  77. width:200px;
  78. height:auto;
  79. z-index:300;
  80. -moz-border-radius: 3px;
  81. -webkit-border-radius: 3px;
  82. border-radius: 3px;
  83. }
  84. #nav li:hover ul.sub li {
  85. display:block;
  86. height:22px;
  87. position:relative;
  88. float:left;
  89. width:200px;
  90. font-weight:normal;
  91. }
  92. #nav li:hover ul.sub li a {
  93. display:block;
  94. font-size:12px;
  95. height:20px;
  96. width:198px;
  97. line-height:20px;
  98. text-indent:5px;
  99. color:#fff;
  100. text-decoration:none;
  101. border:1px solid #202020;
  102. -moz-border-radius: 2px;
  103. -webkit-border-radius: 2px;
  104. border-radius: 2px;
  105. }
  106. #nav li ul.sub li a.fly {
  107. background:#202020 url(images/arrow.png) 190px 6px no-repeat;
  108. }
  109. #nav li:hover ul.sub li a:hover {
  110. background:#3d3d3d;
  111. color:#fff;
  112. border-color:#4e4e4e;
  113. }
  114. #nav li:hover ul.sub li a.fly:hover {
  115. background:#3d3d3d url(images/arrow_over.png) 190px 6px no-repeat;
  116. color:#fff;
  117. }
  118. #nav li strong {
  119. display:block;
  120. font-size:12px;
  121. height:20px;
  122. width:198px;
  123. line-height:20px;
  124. margin-bottom:3px;
  125. text-indent:6px;
  126. color:#ff5d1a;
  127. border-bottom:1px solid #414141;
  128. cursor:default;
  129. font-weight:bold;
  130. }
  131. #nav li:hover li:hover ul, #nav li:hover li:hover li:hover ul, #nav li:hover li:hover li:hover li:hover ul, #nav li:hover li:hover li:hover li:hover li:hover ul {
  132. left:200px;
  133. top:-4px;
  134. background: #202020;
  135. padding:3px;
  136. border:1px solid #161616;
  137. white-space:nowrap;
  138. width:200px;
  139. z-index:400;
  140. height:auto;
  141. -moz-border-radius: 3px;
  142. -webkit-border-radius: 3px;
  143. border-radius: 3px;
  144. }
  145. #nav ul, #nav li:hover ul ul, #nav li:hover li:hover ul ul, #nav li:hover li:hover li:hover ul ul, #nav li:hover li:hover li:hover li:hover ul ul {
  146. position:absolute;
  147. left:-9999px;
  148. top:-9999px;
  149. width:0;
  150. height:0;
  151. margin:0;
  152. padding:0;
  153. list-style:none;
  154. }
  155. #nav li:hover li:hover a.fly, #nav li:hover li:hover li:hover a.fly, #nav li:hover li:hover li:hover li:hover a.fly, #nav li:hover li:hover li:hover li:hover li:hover a.fly {
  156. background:#3d3d3d url(images/arrow_over.png) 190px 6px no-repeat;
  157. color:#fff;
  158. border-color:#4e4e4e;
  159. }
  160. #nav li:hover li:hover li:hover a.fly {
  161. background:#3d3d3d url(images/arrow_over.png) 190px 6px no-repeat;
  162. color:#fff;
  163. border-color:#4e4e4e;
  164. }
  165. #nav li:hover li:hover li:hover li:hover li:hover a.fly {
  166. background:#3d3d3d url(images/arrow_over.png) 190px 6px no-repeat;
  167. color:#fff;
  168. border-color:#4e4e4e;
  169. }
  170. #nav li:hover li:hover li a.fly,
  171. #nav li:hover li:hover li:hover li a.fly,
  172. #nav li:hover li:hover li:hover li:hover li a.fly {
  173. background:#202020 url(images/arrow.png) 190px 6px no-repeat;
  174. color:#fff;
  175. border-color:#202020;
  176. }