I will keep to the ACP css for now. Here is what i have done Feel free to comment
My red theme
a { color: #ca2e3d; }
a:focus, a:hover { color: #a51624; text-decoration: none; }
body { color: #4a4a4a; background: #f5f5f5; }
.account-username-box .open #profile
{
background-color: #3fae28;
border-color: #288e13;
}
.alert-warning
{
background-color: #d17330;
border-color: #aa5417;
color: #fff;
}
.btn-primary.active{ background-color: #3fae28; border-color: #288e13 }
.btn-info
{
color: #ffffff;
background-color: #3fae28;
border-color: #288e13;
}
.btn-info:hover, .btn-info:focus, .btn-info.focus, .btn-info:active, .btn-info.active, .open>.dropdown-toggle.btn-info
{
color: #ffffff;
background-color: #288e13;
border-color: #288e13;
}
.btn-primary
{
color: #ffffff;
background-color: #ca2e3d;
border-color: #a22531;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary.focus, .btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary
{
color: #ffffff;
background-color: #a22531;
border-color: #a22531;
}
.btn-primary:disabled, .btn-primary.disabled, .btn-primary.disabled:hover, .btn-primary.disabled:focus, .btn-primary.disabled.focus, .btn-primary.focus, .btn-primary.disabled:active, .btn-primary:active, .btn-primary.disabled.active, .btn-primary.active
{
background-color: #1e8375 !important;
border-color: #0e6b5e !important;
}
.btn-warning {
color: #fff;
background-color: #d17330;
border-color: #aa5417;
}
.btn-warning:hover, .btn-warning:focus, .btn-warning.focus, .btn-warning:active, .btn-warning.active, .open>.dropdown-toggle.btn-warning
{
color: #fff;
background-color: #aa5417;
border-color: #aa5417;
}
.forum-logo { padding-right: 10px; }
/*input:focus, select:focus, textarea:focus
{
border-color: #a22531 !important;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(165, 22, 36, 0.6) !important;
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(165, 22, 36, 0.6) !important;
}*/
.mobile-navbar { background: #ca2e3d !important; }
.navbar-default { background-color: #ca2e3d; border-color: #a51624; }
.navbar-default .navbar-nav>li>a, .navbar-nav>li, .navbar-default .navbar-nav>li>a:focus { color: #fff; }
.navbar-default .navbar-nav>li>a:hover
{
background: #a51624;
color: #fff;
}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus
{
background: #a51624;
color: #fff;
}
.navbar-default .btn-link, .navbar-default .btn-link:focus
{
color: #fff;
}
.navbar-default .btn-link:hover
{
background: #a51624;
color: #fff;
}
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:hover, .navbar-default .navbar-nav>.open>a:focus {
background: #a51624;
color: #fff;
}
.navbar-default .navbar-toggle { border-color: #a22531; }
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
background: #a22531;
color: #fff;
}
.navbar-default .navbar-toggle .icon-bar { background: #fff; }
.navbar-default .navbar-brand {
color: #fff;
}
.nav-pills>li.active>a, .nav-pills>li.active>a:hover, .nav-pills>li.active>a:focus
{
background: #b4103a;
color: #fff;
}
.panel-info>.panel-heading
{
color: #ffffff;
background-color: #ca2e3d;
border-color: #a51624;
}
.topic .pagination-block { background-color: #a51624; }
.topic .pagination-block .progress-bar { background-color: #ca2e3d; }
.wrapper { color: #fff; }
#menu .notification-list li a, .header .notification-list li a { color: #4a4a4a; }
#menu .notification-list li.unread, .header .notification-list li.unread { background: #eeeeee; }
#nprogress .bar { background: #fff; }
#nprogress .spinner-icon { border-top-color: #fff; border-left-color: #fff; }
This code is for: https://www.jenkler.se (If you want to see it live)