:root {
    --darkGray: #2b2b2b;
    --midGray: #3c3f41;
    --lightGray: #515658;
    --almostWhite: #babaa2;
    --darkOrange: #9a652f;
    --midOrange: #db9d44;
    --lightOrange: #e8bf6a;
}

body {
    background-color: var(--midGray);
    color: var(--almostWhite);
    background: url("../images/lines_pattern.png") repeat;
}

.navbar {
    border: none;
}
.navbar-inverse {
    background-color: var(--darkGray);
}
.navbar-inverse .navbar-brand {
    color: var(--almostWhite);
    font-size: 22px;
}
.navbar-inverse .navbar-brand:hover, .navbar-inverse .navbar-brand:focus {
    color: var(--lightOrange);
}
.navbar-inverse .navbar-nav > li > a {
    color: var(--almostWhite);
}
.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus {
    color: var(--lightOrange);
}
.navbar-inverse .navbar-nav > .active > a,
.navbar-inverse .navbar-nav > .active > a:hover,
.navbar-inverse .navbar-nav > .active > a:focus {
    color: var(--almostWhite);
    background-color: var(--lightGray);
    text-shadow: 1px 1px var(--darkGray);
}
.navbar-inverse .navbar-toggle .icon-bar {
    background-color: var(--almostWhite);
}

.panel {
    border: 1px solid var(--darkGray);
    box-shadow: 0px 4px 10px var(--darkGray);
    background-color: var(--lightGray);
}
.panel > .panel-heading {
    border: none;
}
.panel-default > .panel-heading {
    background-color: var(--midGray);
    color: var(--almostWhite);
    text-shadow: 1px 1px var(--darkGray);
}
.panel-primary {
    border: 1px solid var(--darkOrange);
}
.panel-primary > .panel-heading {
    background-color: var(--midOrange);
    color: var(--darkGray);
}

.table > thead > tr > th {
    background-color: var(--midGray);
    border: none;
}
.table > tfoot > tr > th {
    background-color: var(--midGray);
}
.table > tbody > tr > td, .table > tbody > tr > th,
.table > tfoot > tr > td, .table > tfoot > tr > th,
.table > thead > tr > td, .table > thead > tr > th {
    border-top: 1px solid var(--midGray);
}
.panel > .panel-body + .table, .panel > .panel-body + .table-responsive,
.panel > .table + .panel-body, .panel > .table-responsive + .panel-body {
    border-top: 1px solid var(--midGray);
}

a, a:hover, a:focus {
    color: var(--lightOrange);
    text-shadow: 1px 1px var(--darkGray);
}

.form-control, .form-control[disabled] {
    color: var(--lightOrange);
    background-color: var(--midGray);
    border: 1px solid var(--darkGray);
    margin-bottom: 5px;
}
.form-control:focus {
    border: 1px solid var(--midOrange);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(200, 140, 100, 0.6);
}

.btn {
    color: var(--darkGray);
    box-shadow: 0px 3px var(--darkGray);
    border: 1px solid var(--darkGray);
    margin-bottom: 5px;
}
.btn:hover, .btn:focus {
    color: var(--lightOrange);
}
.btn:active, .btn:target, .btn:active:focus {
    box-shadow: none;
    border: 1px solid var(--darkGray);
    transform: translateY(3px);
    color: var(--darkGray);
}
.btn-default {
    color: var(--almostWhite);
    background-color: var(--midGray);
}
.btn-default:hover, .btn-default:focus {
    background-color: var(--lightGray);
    border: 1px solid var(--darkGray);
}
.btn-default:active .btn-default:target, .btn-default:active:focus {
    background-color: var(--midGray);
    color: var(--almostWhite);
}
.btn-primary {
    background-color: var(--midOrange);
    color: var(--darkGray);
}
.btn-primary:hover, .btn-primary:focus {
    background-color: var(--darkOrange);
    border: 1px solid var(--darkGray);
}
.btn-primary:active, .btn-primary:target, .btn-primary:active:focus {
    background-color: var(--darkOrange);
    color: var(--lightOrange);
}

.pagination>li>a, .pagination>li>span {
    background-color: var(--darkGray);
    border: 1px solid var(--lightOrange);
    color: var(--lightOrange);
}

.pagination>li>a:hover, .pagination>li>span:hover {
    background-color: var(--midOrange);
    border: 1px solid var(--midOrange);
    color: #fff;
}