html, body {

   font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;

}



section.content {

    background: #EEF1F9 !important;

    padding: 25px;

}

nav.navbar.navbar-static-top {

    background: #FFFFFF !important;

    box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important;

}

.nav-tabs-custom {

    border-radius: 6px !important;

    box-shadow: 0px 0px !important;

}

.nav-tabs-custom > .nav-tabs > li.active {

    background: white;

    border: 0px;

    padding: 9px 0px 0px;

    border-radius: 5px;

}

button.custom-gray-button {

    /*border: 0px;

    background: transparent;

    color: #8BC34A;

    position: relative;

    top: 3px;

    float: right;*/
    border: 1px solid #5e5e5e;
    background: #8BC34A;
    color: white;
    position: relative;
    top: 3px;
    float: none;
    font-size: 16px;
    padding: 3px 12px;
    border-radius: 16px;

}

li.pull-left.active.header {

    padding: 0px;

    width: 100%;

}

li.pull-left.header {

    padding: 0px;

    color: #444 !important;

}

li.pull-left.header a {

/*    padding: 0px;*/

    color: #444 !important;

}



aside.left-side.sidebar-offcanvas {

    background: #83c340;

    position: fixed;

    min-height: 100%;

    height: 100%;

}

nav.navbar.navbar-static-top {

    height: 65px !important;

}

div#right-menu {

    padding: 0px !important;

}

.text-dark, .text-dark p, .text-dark a {

    color: gray !important;

}

.text-menu-info {

    margin-bottom: 4px !important;

    font-size: 11px !important;

    line-height: 14px;

}

.text-success {

    color: #8BC34A !important;

}

.bg-black body {

    background: #eef1f9 !important;

}

.skin-black .logo, .skin-black .logo:hover {

    background: white;

    color: #787878;

    height: 65px !important;

    font-size: 24px !important;

    line-height: 63px !important;

    position: fixed;

    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;

}

a.text-dark.navbar-btn.sidebar-toggle {

    margin-left: 20px;

}

.search-button {

    float: left;

    padding: 9px 5px;

    margin-top: 8px;

    margin-right: 0;

    margin-bottom: 8px;

    margin-left: 5px;

    background-color: transparent;

    background-image: none;

    border: 1px solid transparent;

    -webkit-border-radius: 0 !important;

    -moz-border-radius: 0 !important;

    border-radius: 0 !important;

}

.sidebar-form {

    display: none;

}

.user-panel > .info > p {

    margin-bottom: 3px;

}

.skin-black .sidebar > .sidebar-menu > li {

    border: 0px;

}



.skin-black .sidebar > .sidebar-menu > li a{

    font-size: 15px;

    color: white !important;

    display: flex;

}

.skin-black .sidebar > .sidebar-menu > li > a:hover, .skin-black .sidebar > .sidebar-menu > li.active > a {

    background: #ffffff15;

    margin: 0px 6px;

    padding: 12px 0px 12px 9px;

    border-radius: 5px;

}



.skin-black .sidebar > .sidebar-menu > li.active > a {

    background: #ffffff33 !important;

    

}

.skin-black .sidebar > .sidebar-menu > li > a  {

    display: flex !important;

}



.skin-black .sidebar {

    border: 0px solid !important;

}

.skin-black .sidebar > .sidebar-menu > li:first-of-type {

    border: 0px solid !important;

}

.left-side {

    position: absolute;

    width: 250px;

}

body > .header .logo {

    width: 250px;

}

body > .header .navbar, .right-side {

    margin-left: 250px;

}

ul.nav.nav-tabs.pull-right {

/*    border-radius: 5px !important;*/

    overflow: hidden;

    border-bottom-color: #eaeaea;

}

ul.sidebar-menu {

    padding-top: 10px !important;

}

.skin-black .sidebar > .sidebar-menu > li > .treeview-menu {

    background: #8BC34A;

}

.sidebar .sidebar-menu .treeview-menu > li {

    padding: 0px 0px 14px;

}

.sidebar .sidebar-menu .treeview-menu > li:first-child {

    padding-top: 10px;

}

.treeview-menu svg {

    position: relative;

    top: 6px;

    left: 0px;

    width: 10px !important;

}



/* Content  */

.nav-tabs-custom > .tab-content {

    padding: 0px;

}

li.pull-left.active.header {

    border-radius: 5px !important;

    overflow: hidden;

}

table#main-records {

    border: 0px;

    margin: 0px !important;

    padding: 0px !important;

}

input.filter.form-control {

    /*display: none;

    padding: 7px;

    height: 28px;

    border-radius: 3px !important;

    border: 1px solid #fafafa !important;

    margin-top: 8px;*/

    display: block;
    padding: 7px;
    height: 28px;
    border-radius: 3px !important;
    border: 1px solid #585858 !important;
    margin-top: 8px;

}
.input-searching {
    background: #caf597 !important;
}
tr th {

    border: 0px !important;

    padding: 15px 15px !important;

    background: none !important;

    border-bottom: 1px solid #e4e4e4 !important;

    font-size: 12px;

}

tr td {

    background: transparent !important;

    border: 0px !important;

    padding: 10px 13px !important;

    font-size: 12px;

    color: gray !important;

    border-bottom: 1px solid #e4e4e4 !important;

}

tr td i.fa {

    color: #8BC34A !important;

    font-size: 1.6rem !important;

}





i.fa.pull-right.fa-angle-left,

i.fa.pull-right.fa-angle-down {

    width: 40px !important;

    height: 24px !important;

    text-align: center;

    line-height: 22px;

}



/* 
.modal-dialog.modal-lg
{

    right: 0px !important;

    position: absolute;

    top: 0px !important;

    margin: 0px !important;

    height: 100%;

    width: 40%;

}

.modal-content {

    border-radius: 0px !important;

    height: 100%;

}

.modal-body .panel.panel-primary {

    border: 0px;

}

.modal-body .panel.panel-primary .panel-heading {

    background: transparent;

    color: black !important;

    border: 0px !important;

}*/

.btn.btn-primary, .btn.btn-primary:hover, .btn.btn-primary:active {

    background-color: #8BC34A !important;

    border-color: #8BC34A !important;

}

.treeview svg {

    width: 20px;

    top: 0px !important;

    margin-right: 12px;

}

.skin-black .sidebar > .sidebar-menu > li a span {

    width: 74%;

}

div.modal.in div.modal-dialog {

/*    transform: translate(-1%, 0%);*/

}

.alert > .fa, .alert > .glyphicon {

    top: 6px;

}

.panel.panel-primary {

    border: 0px !important;

    padding: 12px 13px 0px;

    margin: 50px 0px 0px;

}

.panel-heading {

    border: 0px !important;

    background: white !important;

    color: black !important;

    padding: 0px !important;

}

h3.panel-title {

    font-size: 27px !important;

    font-family: bankgothic_md_btmedium, cursive;

    text-align: center;

    padding: 10px 0px;

    border-bottom: 1px solid #e5e5e5;

    padding-top: 0px !important;

    text-transform: uppercase;

}

a.back-btn {

    display: none !important;

}

.form-control, .chzn-single {

    /*    border: 1px solid #ededed !important;*/
    border: 1px solid #909090 !important;

    border-radius: 4px !important;

}

.panel-body .col-md-1,

.panel-body .col-md-2,

.panel-body .col-md-3,

.panel-body .col-md-4,

.panel-body .col-md-5,

.panel-body .col-md-6,

.panel-body .col-md-7,

.panel-body .col-md-8,

.panel-body .col-md-9,

.panel-body .col-md-10,

.panel-body .col-md-11,

.panel-body .col-md-12

 {

    padding: 0px 5px;

}

.form-group label {

    margin: 0px;

    font-weight: normal;

    font-size: 13px;

    color: #4e4e4e;

}

span.input-group-addon {

    background: #ffffff !important;

    color: #8BC34A !important;

    border: 1px solid #8BC34A !important;

    border-radius: 3px !important;

}

.form-control:focus {

    border-color: #8BC34A !important;

    box-shadow: none;

}

.left-side.collapse-left {

    left: -250px !important;

}

.tab-pane form {

    background: #eef1f9;

}

form > .panel.panel-primary:first-of-type,

.tab-pane .panel.panel-primary:first-of-type {

    margin-top:0px !important;

}

.btn.btn-info, .btn.btn-info:hover,

.btn.btn-info:active, .btn.btn-info:focus {

    background-color: #03A9F4;

    border-color: #03A9F4;

}

.btn.btn-success, .btn.btn-success:hover,

.btn.btn-success:active, .btn.btn-success:focus {

    background-color: #8BC34A;

    border-color: #8BC34A;

}

.menu-container-panel {

    width: 100%;

    text-align: center;

    margin-bottom: 30px;

}

.btn.btn-danger, .btn.btn-danger:hover,

.btn.btn-danger:active, .btn.btn-danger:focus {

    background-color: #ff5548;

    border-color: #ff5548;

}

.btn.btn-warning, .btn.btn-warning:hover,

.btn.btn-warning:active, .btn.btn-warning:focus {

    background-color: #FFC107;

    border-color: #FFC107;

}

.btn {

    font-size: 13px;

    padding: 8px 18px;

    margin: 0px 3px;

    border-radius: 5px;

}

.chzn-container-multi .chzn-choices .search-choice {

    border-color: #dadada !important;

    border-radius: 42px;

    padding: 4px 19px 0px 10px;

}

.alert.alert-warning {

    background: #FF9800;

    border-color: #ffffff;

    color: white !important;

}

.alert.alert-success {

    color: #ffffff;

    background-color: #8BC34A;

    border-color: #ffffff;

}

.alert.alert-danger {

    color: #ffffff;

    background-color: #d81305;

    border-color: #ffffff;

}

.alert.alert-info {

    color: white;

    background-color: #03A9F4;

    border-color: #ffffff;

}

.widget-right-container {

    background: white;

    padding: 81px 13px 0px 0px !important;

    clear: both;

    display: block;

    position: fixed;

    top: 0px;

    height: 100%;

}

a.small-box-footer {

    padding: 13px 0px !important;

    background: #666666 !important;

    border-radius: 0px 0px 3px 3px;

}

.small-box {

    min-height: 135px !important;

    border-radius: 7px;

    overflow: hidden;

    background: #8BC34A !important;

}

.widget#widget-controller_top li {

    padding-right: 0px !important;

}

a#back-to-top {

    display: none;

}

form#form-delete .btn-link {

    background: #fbfbfb;

    border-radius: 5px;

    padding: 8px 27px !important;

    margin: 13px 0px 0px;

    float: right;

    border: 1px solid #a30000;

}

.btn.btn-sm.btn-danger i.fa{

    color: white !important;

}

i.text-danger.fa {

    color: #F44336 !important;

}i.text-success.fa {

    color: #8BC34A !important;

}

.tab-content>.active {

    display: block;

    background: #eef1f9;

}

button.no-btn {

    border: 0px;

    background: none;

}

td.btn-container a, td.btn-container button {

    margin: 0px 3px;

    width: auto !important;

    display: inline-block;

}

a.btn.custom-tags {

    padding: 3px 6px;

    margin: 2px 0px;

}

.tags-container-main {

    clear: both;

    margin-bottom: 12px;

}

ul#widget-controller_top {

    position: static;

    margin: 0px !important;

    padding: 12px 0px 0px !important;

    padding-right: 13px !important;

}

li.custom-header-tabs {

    border-radius: 7px !important;

    overflow: hidden;

    margin-top: 3px;

}

.custom-header-tabs a {

    background: gray !important;

    color: white;

    padding: 6px 25px !important;

}

li.custom-header-tabs.active {

    background: #7CB342 !important;

    padding-top: 0px !important;

    margin-top: 6px;

}

li.custom-header-tabs.active>a, li.custom-header-tabs.active>a:hover, li.custom-header-tabs.active>a:focus {

    background: #7CB342 !important;

    color: white !important;

}

a:hover, a:active, a:focus {

    color: black;

}

body.bg-black.login-screen {

    background-image: url("https://sos.solvinapp.com/2151468815.jpg") !important;

    background-size: 100% !important;

}

h1.logo {

    float: left;

    font-size: 39px;

    line-height: 50px;

    text-align: center;

    padding: 0 10px;

    font-family: bankgothic_md_btmedium, cursive;

    font-weight: 500;

    display: block;

    width: 100%;

    margin-bottom: 30px;

}



.body.bg-gray.login {

    border-radius: 5px;

    background: white !important;

}

#login-box {

    width: 360px;

    margin: 122px auto 0 auto;

}
@media screen and (max-width: 1200px) {
    body {
/*        display: none !important;*/
    }
}
#filter {
    top: 81px !important;
    box-shadow: 0px 0px !important;
    border: 1px solid #66ac14;
    border-right: 0px solid !important;
    background: #fff !important;
/*    color: white !important;*/
}
#filter2 {
 box-shadow: 0px 0px !important;
    border: 1px solid #66ac14;
    border-right: 0px solid !important;
    background: #fff !important;   
}
label.btn.btn-danger.btn-xs.active.toggle-off {
    background: gray;
    border-color: gray !important;
}
.toggle.btn.btn-xs.btn-danger.off {
    background: gray;
    border-color: gray;
}


.user-panel button.btn.btn-sm.btn-github.dropdown-toggle {
    background: white;
    color: gray;
    border: 0px !important;
    box-shadow: 0px 0px !important;
    padding: 10px 4px;
}
.user-panel ul.dropdown-menu.btn-github {
    background: white;
    border: 0px;
    padding: 12px 12px;
}
.user-panel .dropdown-menu>li>a, btn-github, .user-panel .dropdown-menu>li>a:hover {
    color: gray;
    font-size: 15px;
    background: white !important;
}
.user-panel .dropdown-menu>li>a>i {
    color:#8BC34A !important;
}
.box {
    background: #eef1f9 !important;
    box-shadow: 0px 0px !important;
}
#accordion .box-primary,
#accordion .box-success, 
#accordion .box-default,
#accordion .box-danger {
    border: 0px;
    margin-bottom: 15px;
    background: white !important;
    overflow: auto;
}

/* Mobile version */
@media screen and (max-width: 786px){

    body > .header .navbar, .right-side {
        width: 100%;
        margin: 0px;
    }

    body > .header .logo {
        width: 100% !important;
        height: : 0px !important;
        display: none !important;
    }

    .wrapper.row-offcanvas.row-offcanvas-left.active.relative aside.left-side.sidebar-offcanvas {
        left: 0px;
        top: 60px;
    }
    .row-offcanvas-left.active {
        left: 255px;
    }
    aside.left-side.sidebar-offcanvas {
        left: -400px;
    }
    section.content {
        padding: 3px 0px 0px !important;
    }
    .dataTables_wrapper > .row > .col-xs-6 {
        position: relative;
        right: 0px;
        margin-top: 4px;
        width: 100%;
        display: flex !important;
        justify-content: space-evenly !important;
    }
    table tr th {
        background: #c4c4c4 !important;
        padding: 4px !important;
        border: 1px solid #757575 !important;
    }
    table tbody tr td {
        padding: 4px 2px !important;
        color: #3c3c3c !important;
        border: 1px solid #e4e4e4 !important;
    }
    .pull-right.menu-container-panel a, .pull-right.menu-container-panel button {
        margin: 0px 0px 10px;
    }
    .modal-dialog.modal-lg {
        width: 100% !important;
    }
    body.bg-black.login-screen {
        background-size: cover !important;
    }
    ul#widget-controller_right {
        display: none;
    }
    .pull-left.info.text-dark.right-menu-info
    {
        display: none;
    }
    .translator-dropdown {
        width: 166px;
        overflow: hidden;
    }
    div#filter {
        margin-top: 100px;
    }
}

/* TABLETS */
@media screen and (max-width: 1280px) and (min-width: 788px) {
    .row-offcanvas-left .sidebar-offcanvas {
        left: 0px !important;
    }
    ul#widget-controller_right {
        display: none;
    }
    aside.right-side .col-md-10 {
        width: 100%;
    }
    .modal-dialog {
        width: 70% !important;
    }
    .row-offcanvas-left.active {
        left: 0px !important;
    }
    .row-offcanvas-left.active .right-side {
        margin-left: 0 !important;
    }
    .row-offcanvas-left.active .sidebar-offcanvas {
        left: -300px !important;
    }
}
div#main-records_wrapper {
    background: white;
    padding-top: 10px;
}
.dt-buttons {
    padding: 0px 12px !important;
}
div.dataTables_filter label {
    padding-right: 13px !important;
}
button.dt-button, button.dt-button:hover, div.dt-button, a.dt-button, input.dt-button {
    background: gray !important;
    color: white  !important;
    border: 1px solid black  !important;
    padding: 3px 10px  !important;
}

@media screen and (min-width: 786px)
{
    .xdsoft_datepicker {
        width: auto !important;
    }
}