sticky-dark-top-nav-with-dropdown.css 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189
  1. .navigation-clean-button {
  2. background: #222222;
  3. padding-top: 10px;
  4. padding-bottom: 10px;
  5. color: #f2f5f8;
  6. border-radius: 0;
  7. box-shadow: none;
  8. border: none;
  9. margin-bottom: 0;
  10. }
  11. @media (max-width:767px) {
  12. .navigation-clean-button {
  13. padding-top: 0;
  14. padding-bottom: 0;
  15. }
  16. }
  17. @media (max-width:767px) {
  18. .navigation-clean-button .navbar-header {
  19. padding-top: 10px;
  20. padding-bottom: 10px;
  21. }
  22. }
  23. @media (max-width:767px) {
  24. .navigation-clean-button .navbar-right {
  25. margin-bottom: 20px;
  26. }
  27. }
  28. .navigation-clean-button .navbar-brand {
  29. font-weight: bold;
  30. color: inherit;
  31. }
  32. .navigation-clean-button .navbar-brand:hover {
  33. color: #1485ee;
  34. }
  35. .navigation-clean-button .navbar-brand img {
  36. height: 100%;
  37. display: inline-block;
  38. margin-right: 10px;
  39. width: auto;
  40. }
  41. .navigation-clean-button .navbar-toggle {
  42. border-color: #ddd;
  43. }
  44. .navigation-clean-button .navbar-toggle:hover, .navigation-clean-button .navbar-toggle:focus {
  45. background: none;
  46. }
  47. .navigation-clean-button .navbar-toggle .icon-bar {
  48. background-color: #888;
  49. }
  50. .navigation-clean-button .navbar-collapse, .navigation-clean-button .navbar-form {
  51. border-top-color: #ddd;
  52. }
  53. .navigation-clean-button .navbar-nav > .active > a, .navigation-clean-button .navbar-nav > .open > a {
  54. background: none;
  55. box-shadow: none;
  56. }
  57. .navigation-clean-button.navbar-default .navbar-nav > .active > a, .navigation-clean-button.navbar-default .navbar-nav > .active > a:focus, .navigation-clean-button.navbar-default .navbar-nav > .active > a:hover {
  58. color: #e04c40;
  59. border-top: 1px solid #e04c40;
  60. box-shadow: none;
  61. transition: background-color 0.25s;
  62. background: none;
  63. pointer-events: none;
  64. }
  65. .navigation-clean-button.navbar .navbar-nav > li > a {
  66. padding-left: 18px;
  67. padding-right: 18px;
  68. }
  69. .navigation-clean-button.navbar-default .navbar-nav > li > a {
  70. color: #dfe8ee;
  71. font-weight: 400;
  72. text-transform: uppercase;
  73. font-family: 'Work Sans';
  74. }
  75. .navigation-clean-button.navbar-default .navbar-nav > li > a:focus, .navigation-clean-button.navbar-default .navbar-nav > li > a:hover {
  76. color: #e04c40 !important;
  77. border-top: solid 1px #e04c40;
  78. background-color: transparent;
  79. transition: background 0.2s ease, padding 0.8s linear;
  80. transition: background-color 0.25s;
  81. }
  82. .navigation-clean-button .navbar-nav > li > .dropdown-menu {
  83. margin-top: -5px;
  84. box-shadow: 0 4px 8px rgba(0,0,0,.1);
  85. background-color: #222222;
  86. border-radius: 2px;
  87. }
  88. .navigation-clean-button .dropdown-menu > li > a:focus, .navigation-clean-button .dropdown-menu > li > a {
  89. line-height: 2;
  90. font-size: 14px;
  91. font-weight: 300;
  92. font-family: 'Roboto';
  93. color: #df4c40;
  94. }
  95. .navigation-clean-button .dropdown-menu > li > a:focus, .navigation-clean-button .dropdown-menu > li > a:hover {
  96. background: #df4c40;
  97. color: inherit;
  98. transition: background-color 0.25s;
  99. transition-timing-function: ease;
  100. transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
  101. }
  102. .navigation-clean-button .actions {
  103. margin-top: 7px;
  104. margin-bottom: 0;
  105. }
  106. .navigation-clean-button .actions .login {
  107. margin-right: 7px;
  108. text-decoration: none;
  109. color: #ffffff;
  110. }
  111. .navigation-clean-button .action-button, .navigation-clean-button .action-button:active {
  112. background: transparent;
  113. border-radius: 0;
  114. color: #e04c40;
  115. box-shadow: none;
  116. border: 1px solid #e04c40;
  117. text-shadow: none;
  118. padding: 10px 22px;
  119. transition: background-color 0.25s;
  120. }
  121. .navigation-clean-button .action-button:hover {
  122. background: #e04c40;
  123. color: #fff;
  124. font-weight: 400;
  125. border: 1px solid #df4c40;
  126. }
  127. .navbar {
  128. margin-bottom: 0;
  129. }
  130. .btn {
  131. border-radius: 0;
  132. }
  133. a.navbar-brand.navbar-link {
  134. font-weight: 400;
  135. }
  136. p.navbar-text.navbar-right.actions {
  137. font-family: 'Roboto Slab';
  138. text-transform: uppercase;
  139. font-weight: 400;
  140. }
  141. a.navbar-link.login:hover {
  142. color: #e04c40;
  143. }
  144. .btn.focus, .btn:focus, .btn:hover {
  145. color: #ffffff;
  146. text-decoration: none;
  147. background-color: #1485ee;
  148. border: none;
  149. }
  150. .btn-default {
  151. color: #ffffff;
  152. background-color: #df4c40;
  153. border: none;
  154. }
  155. .btn {
  156. font-family: 'Roboto';
  157. font-weight: 400;
  158. }