:root {
    --primary: #d6af36;
    --secondary: #bc9007;
    --btnprimary : #d6af36;
    --border : #D5A34A;
    --white: #ffffff;
    --gray: #777;
    --ligtBackground : #f9f9f9;

}

a {
    color: var(--primary) !important;
}

.spinnerLoader {
    border: 16px solid #f3f3f3;
    border-top: 16px solid var(--primary);
    border-bottom: 16px solid var(--primary);
    border-radius: 50%;
    width: 100px;
    height: 100px;
    animation: spin 2s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.skin-blue .navbar .nav a {
    color: var(--white) !important;

}


.user-menu > .dropdown-menu > li.user-header {
    background: var(--primary) !important;
}

.btn-red {
    background-color:  var(--btnprimary) !important;
}

.small-box > .small-box-footer {
    color: var(--white) !important;

}

.skin-blue .treeview-menu > li > a {
    color: var(--gray) !important;
}

.skin-blue .sidebar a {
    color: var(--gray) !important;
}

.skin-blue .navbar {
    background-color: var(--primary);
}

li.active > a {
    color: var(--primary) !important;
}

.skin-blue .sidebar > .sidebar-menu > li > a:hover, .skin-blue .sidebar > .sidebar-menu > li.active > a {
    color: var(--primary) !important;
}

.user-menu > .dropdown-menu > li.user-header {
    background: var(--primary);
}

.user-panel {
    background-color: var(--primary) !important;
}

.btn-primary {
    color: var(--white) !important;
    background-color: var(--btnprimary) !important;
    border-color: var(--border) !important;
}

.btn-info {
    color: var(--white) !important;
    background-color: var(--secondary) !important;
    border-color: var(--border) !important;
}

.btn.btn-info:hover, .btn.btn-info:active, .btn.btn-info.hover {
    background-color: var(--border) !important;
    border-color: var(--secondary) !important;
}

.btn.btn-success {
    color: var(--white) !important;
}

.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    background-color: var(--secondary) !important;
    border-color: var(--border) !important;
    color: var(--white) !important;

}

.login-body{

    background: linear-gradient(0deg, var(--primary) 10%, var(--white) 50%, var(--white) 50%);
    background-color: var(--ligtBackground) !important;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}


.login-header{
    background: var(--primary) !important;
}

#loginBtn{
    background-color:var(--primary);
    color:var(--white);
}