Customize your colors below

IMPORTANT: Please note, this customizer is provided without any express written guarantee or support. You may still need to modify some of your CSS to get it working exactly as you want. Support requests for the customizer will go unanswered.

*Note: Starred color settings are not previewable, and may override some settngs in preview mode. Copy and paste it in your customized.css file to see the changes.

Main

Logo / Caret

Links

Responsive

Customized CSS

Click in the window below to copy your customized CSS, press CTRL + C (PC) / ⌘ + C (MAC) and paste it into your customized.css file.

.navbar-custom .dropdown-menu { border-color: #bd362f; }

.navbar-custom .dropdown-menu li.nav-title { color: #bd362f; }

.navbar-custom .dropdown-menu li.nav-title span.nav-title-description { color: #999999; }

.navbar-custom { background-color: #d9534f; border-color: #bd362f }

.navbar-custom .navbar-brand { color: #777777; }

.navbar-custom .nav > li > a { color: #bd362f; }

.navbar-custom .nav > li > a:focus, .navbar-custom .nav > li > a:hover, .navbar-default .navbar-brand:hover { color: #ffffff; }

.navbar-custom .nav li.dropdown.open > .dropdown-toggle,
.navbar-custom .nav li.dropdown.active > .dropdown-toggle,
.navbar-custom .nav li.dropdown.open.active > .dropdown-toggle { background: #bd362f; color: #ffffff; }

.navbar-custom .nav li.dropdown:hover > .dropdown-toggle .caret { border-top-color: #ffffff; }

.navbar-custom .nav li.dropdown > .dropdown-toggle .caret,
.navbar-custom .nav li.dropdown.open a:hover .caret,
.navbar-custom .nav li.dropdown.open > .dropdown-toggle .caret,
.navbar-custom .nav li.dropdown.active > .dropdown-toggle .caret,
.navbar-custom .nav li.dropdown.open.active > .dropdown-toggle .caret { border-top-color: #ffffff; }

.navbar-custom .nav li.dropdown.open a:hover .caret, .navbar-custom .nav li.dropdown.open > .dropdown-toggle .caret, .navbar-custom .nav li.dropdown.open.active > .dropdown-toggle .caret { border-top-color: #ffffff; } .navbar-custom .dropdown-menu li a { color: #555555; text-shadow: none; }

.navbar-custom .dropdown-menu li a.btn,
.navbar-custom .dropdown-menu li a.btn:hover { color: inherit; }

.navbar-custom .dropdown-menu li a.btn:hover { color: white; padding-left: 0; }

.navbar-custom .dropdown-menu li a.btn-default:hover { color: gray; }

.navbar-custom .dropdown-menu .active > a,
.navbar-custom .dropdown-menu li > a,
.navbar-custom .dropdown-submenu > a { padding: 3px 0; }

.navbar-custom .dropdown-menu li > a:hover,
.navbar-custom .dropdown-menu li > a:focus,
.navbar-custom .dropdown-submenu:hover > a { color: #0066cc; padding-left: 5px; }

.navbar-custom .navbar-toggle .icon-bar { background-color: #802420; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }

.navbar-custom .navbar-toggle { background: #da4f49; border: 1px solid #bd362f; }

.navbar-custom .navbar-toggle:hover, .navbar-custom .navbar-toggle:focus { background: #dddddd; }

@media (max-width: 979px) {

.navbar-custom p, .dropdown-menu li.nav-title span.nav-title-description { color: #999999; }

.navbar-custom .nav-collapse .btn { color: #bd362f; }

.navbar-custom .nav > li > a:hover { background: none; }

.navbar-custom .nav a { color: #ffffff; }

.navbar-custom .dropdown-menu li > a:hover,
.navbar-custom .dropdown-menu li > a:focus,
.navbar-custom .dropdown-submenu:hover > a { color: #541614; background: none; padding-left: 3px; }

.navbar-custom .navbar-collapse .nav-title { color: #ffffff; border-bottom: 1px solid #bd362f; }

}