You are here

Home » API reference » The Better Mega Menu 7

blue.css in The Better Mega Menu 7

Same filename and directory in other branches
  1. 8 css/styles/blue.css
  2. 2.x css/styles/blue.css
.tb-megamenu.style-blue  {
  background-color: #00aeee;
}

.tb-megamenu.style-blue  .nav > li > a {
  border-right: 1px solid #4dc6f3;
}

.tb-megamenu.style-blue  .nav li.dropdown > .dropdown-toggle .caret {
  border-bottom-color: #fff;
  border-top-color: #fff;
}

.tb-megamenu.style-blue  .dropdown-menu {
  border-bottom-color: #00aeee;
}

.tb-megamenu.style-blue  .nav li.dropdown.active > .dropdown-toggle,
.tb-megamenu.style-blue  .nav li.dropdown.open.active > .dropdown-toggle {
  background-color: #009bd4;
  border-right-color: #4dc6f3;
  color: #fff;
}

.tb-megamenu.style-blue  .nav > li.dropdown.open.active > a:hover,
.tb-megamenu.style-blue  .nav > li.dropdown.open.active > a:focus {
  background-color: #fff;
  border-right-color: #4dc6f3;
  color: #00aeee;
}

.tb-megamenu.style-blue  .nav > li > a:focus,
.tb-megamenu.style-blue  .nav > li > a:hover {
  color: #00aeee;
}

.tb-megamenu.style-blue  .nav li.dropdown.open > .dropdown-toggle {
  color: #00aeee;
}

.tb-megamenu.style-blue  .dropdown-menu li > a:hover,
.tb-megamenu.style-blue  .dropdown-menu li > a:focus,
.tb-megamenu.style-blue  .dropdown-submenu:hover > a {
  color: #00aeee;
}

.tb-megamenu.style-blue  .nav > .active > a,
.tb-megamenu.style-blue  .nav > .active > a:hover,
.tb-megamenu.style-blue  .nav > .active > a:focus {
  color: #fff;
  text-shadow: none;
  background-color: #009bd4;
  background-image: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  outline: none;
}

.tb-megamenu.style-blue  .block-view-demo .views-field-field-image img {
  border: 1px solid #eee;
}

.tb-megamenu.style-blue  .block-view-demo .item-list ul li {
  border-bottom: 1px solid #eee;
}

@media (max-width: 979px) {
  .tb-megamenu.style-blue  {
  background-color: inherit;
}
.tb-megamenu.style-blue  .nav-collapse .nav > li > a:hover,
.tb-megamenu.style-blue  .nav-collapse .nav > li > a:focus {
	color: #00aeee;
  }
.tb-megamenu.style-blue  .nav-collapse .nav > li.active > a:hover,
.tb-megamenu.style-blue  .nav-collapse .nav > li.active > a:focus {
  background-color: #00aeee;
  color: #fff;
}
}

File

css/styles/blue.css
View source 
  1. .tb-megamenu.style-blue  {

  2.   background-color: #00aeee;

  3. }

  4. 

  5. .tb-megamenu.style-blue  .nav > li > a {

  6.   border-right: 1px solid #4dc6f3;

  7. }

  8. 

  9. .tb-megamenu.style-blue  .nav li.dropdown > .dropdown-toggle .caret {

  10.   border-bottom-color: #fff;

  11.   border-top-color: #fff;

  12. }

  13. 

  14. .tb-megamenu.style-blue  .dropdown-menu {

  15.   border-bottom-color: #00aeee;

  16. }

  17. 

  18. .tb-megamenu.style-blue  .nav li.dropdown.active > .dropdown-toggle,

  19. .tb-megamenu.style-blue  .nav li.dropdown.open.active > .dropdown-toggle {

  20.   background-color: #009bd4;

  21.   border-right-color: #4dc6f3;

  22.   color: #fff;

  23. }

  24. 

  25. .tb-megamenu.style-blue  .nav > li.dropdown.open.active > a:hover,

  26. .tb-megamenu.style-blue  .nav > li.dropdown.open.active > a:focus {

  27.   background-color: #fff;

  28.   border-right-color: #4dc6f3;

  29.   color: #00aeee;

  30. }

  31. 

  32. .tb-megamenu.style-blue  .nav > li > a:focus,

  33. .tb-megamenu.style-blue  .nav > li > a:hover {

  34.   color: #00aeee;

  35. }

  36. 

  37. .tb-megamenu.style-blue  .nav li.dropdown.open > .dropdown-toggle {

  38.   color: #00aeee;

  39. }

  40. 

  41. .tb-megamenu.style-blue  .dropdown-menu li > a:hover,

  42. .tb-megamenu.style-blue  .dropdown-menu li > a:focus,

  43. .tb-megamenu.style-blue  .dropdown-submenu:hover > a {

  44.   color: #00aeee;

  45. }

  46. 

  47. .tb-megamenu.style-blue  .nav > .active > a,

  48. .tb-megamenu.style-blue  .nav > .active > a:hover,

  49. .tb-megamenu.style-blue  .nav > .active > a:focus {

  50.   color: #fff;

  51.   text-shadow: none;

  52.   background-color: #009bd4;

  53.   background-image: none;

  54.   -webkit-box-shadow: none;

  55.   -moz-box-shadow: none;

  56.   box-shadow: none;

  57.   outline: none;

  58. }

  59. 

  60. .tb-megamenu.style-blue  .block-view-demo .views-field-field-image img {

  61.   border: 1px solid #eee;

  62. }

  63. 

  64. .tb-megamenu.style-blue  .block-view-demo .item-list ul li {

  65.   border-bottom: 1px solid #eee;

  66. }

  67. 

  68. @media (max-width: 979px) {

  69.   .tb-megamenu.style-blue  {

  70.   background-color: inherit;

  71. }

  72. .tb-megamenu.style-blue  .nav-collapse .nav > li > a:hover,

  73. .tb-megamenu.style-blue  .nav-collapse .nav > li > a:focus {

  74. 	color: #00aeee;

  75.   }

  76. .tb-megamenu.style-blue  .nav-collapse .nav > li.active > a:hover,

  77. .tb-megamenu.style-blue  .nav-collapse .nav > li.active > a:focus {

  78.   background-color: #00aeee;

  79.   color: #fff;

  80. }

  81. }