.html {
    background-color:  var(--bg-head);  
}

.html-index {
    background: rgb(var(--rgb5));
    background: linear-gradient(53deg, rgba(var(--rgb5),1) 0%, rgba(var(--rgb6),1) 100%);
}

.login {
    background-color: var(--bg2);
    background: linear-gradient(53deg, rgba(var(--rgb-bg-grad1),1) 0%, rgba(var(--rgb-bg-grad2),1) 100%);
    color: var(--text-n-border3);
    border: 1px var(--login-border1) solid;
}

.regborder {
    border-top: 1px var(--text-n-border3) solid;
}

.logo, .head-logo {
    background-color: var(--logo-bg);
}

.page-title-left_plus h3 {
    border-bottom: 4px var(--bg-n-text1) solid;
}

.page-title-left_plus_small h3 {
    border-bottom: 1px var(--bg-n-text1) solid;
}

#head {
    background-color:  var(--bg-head);  
    color: var(--bg-n-text1); 
}

.head-text-a a {
    color: var(--bg-n-text1);
}

.head-text-b a {
    color: var(--bg-n-text1);
}

.progress-container {
    background-color:  var(--bg-head);
}

.progress-bar {
    background-color:  var(--bg-n-text1);
}

.left-menu-ul li {
    background-color: var(--bg-n-text1);
}

.left-menu-ul a {
    color: var(--bg1);
}

.left-menu-ul li:hover {
    background: rgb(var(--rgb1));
    background: linear-gradient(148deg, rgba(var(--rgb1),1) 0%, rgba(var(--rgb2),1) 100%);
    color: var(--bg-n-text1);
}

.left-menu-ul .active {
    background-color: var(--bg4);
    color: var(--bg-n-text1);
}

.content {
    color: var(--text-n-border1);
    background: rgb(var(--rgb5));
    background: linear-gradient(53deg, rgba(var(--rgb5),1) 0%, rgba(var(--rgb6),1) 100%);
}

.content2 {
    border-top: 1px var(--text-n-border1) solid;
    border-left: 1px var(--text-n-border1) solid;
}

.content_box_right0 {
    color: var(--text-n-border1);
    background: rgb(var(--rgb5));
    /*
    border: 1px var(--text-n-border1) solid; 
    */
}

.footer {
    border-top: 1px var(--text-n-border3) solid;
    color: var(--bg-n-text1); 
}

.footer-info {
    border-bottom: 1px var(--bg-n-text1) solid;
}

.footer-document {
    border-top: 2px var(--bg-n-text1) solid;
}

.fl1 {
    color: var(--bg3) !important;
}

.fl2 {
    color: var(--text-n-border3) !important;
}

.menu ul li {
    border-bottom: 2px var(--text-n-border1) solid;
}

.menu ul li a {
    color: var(--bg1);
    background-color: var(--bg-n-text1);
}

.menu ul li a:hover {
    background: rgb(var(--rgb1));
    background: linear-gradient(148deg, rgba(var(--rgb1),1) 0%, rgba(var(--rgb2),1) 100%);
    color: var(--bg-n-text1);
}

.menu .active {
    background-color: var(--text-n-border1);
    color: var(--bg-n-text1);
}

.msg-success, .msg-success2 {
    /*
    color: rgb(50,156,47);
    */
    color: var(--green1);
}

.msg-error, .msg-error2 {
    color: var(--red1);
}

.msg-success3 {
    background-color: var(--green1);
    color: var(--bg-n-text1);
}

.msg-error3 {
    background-color: var(--red1);
    color: var(--bg-n-text1);
}

.has-error {
    border: 1px var(--red1) solid !important;
}

/*
.has-error::placeholder {
    color: var(--bg-n-text1);
}
*/

.copyright-ul {
    border-top: 1px var(--text-n-border3) solid;
    border-bottom: 1px var(--text-n-border3) solid;
}

.input01b {
    border: 1px var(--text-n-border1) solid;
    background-color: var(--input-bg1);
}

.input01b:focus {
    background-color: var(--input-high1);
}

.input01 {
    background-color: var(--input-bg1);
    color: var(--black);
}

.input01:focus {
    background-color: var(--input-high1);
}

.input01select {
    border: 1px var(--text-n-border1) solid;
    background-color: var(--input-bg1);
}

.input01bselect {
    border: 1px var(--text-n-border1) solid;
    background-color: var(--input-bg1);
}

.input02 {
    background-color: var(--text-n-border1);
    color: var(--bg-n-text2);
    background: rgb(30,55,63);
    background: linear-gradient(0deg, rgba(var(--rgb3),1) 0%, rgba(var(--rgb4),1) 100%);
}

.input02:hover {
    background: rgb(var(--rgb1));
    background: linear-gradient(148deg, rgba(var(--rgb1),1) 0%, rgba(var(--rgb2),1) 100%);
    color: var(--bg-n-text1);
}

.input02w-d {
    background-color: var(--bg7);
    color: var(--gray);
}

.input02w {
    background-color: var(--bg-n-text1);
    color: var(--bg1);
}

.input02w:hover {
    background: rgb(var(--rgb1));
    background: linear-gradient(148deg, rgba(var(--rgb1),1) 0%, rgba(var(--rgb2),1) 100%);
    color: var(--bg-n-text1);
}

.input03, .input03b {
    color: var(--text-n-border2);
}

.input03:hover, .input03b:hover {
    background: var(--green1) !important;
    color: var(--bg-n-text1);
}

.red:hover {
    background: var(--red1) !important;
    color: var(--bg-n-text1);
}

.yellow {
    background: var(--yellow1) !important;
    color: var(--text-n-border1);
}

.yellow:hover {
    background: var(--red1) !important;
    color: var(--bg-n-text1);
}

.yellow2 {
    background: var(--yellow1) !important;
    color: var(--text-n-border1);
}

.yellow2:hover {
    background: var(--green1) !important;
    color: var(--bg-n-text1);
}

.green {
    background: var(--green1) !important;
    color: var(--bg-n-text1);
}

.green:hover {
    background: var(--bg-n-text1) !important;
    color: var(--green1) !important;
}

.blue {
    background: var(--blue) !important;
    color: var(--bg-n-text1);
}

.blue:hover {
    background: var(--bg-n-text1) !important;
    color: var(--blue) !important;
}

.red2 {
    background: var(--red1) !important;
    color: var(--bg-n-text1);
}

.input05 {
    background-color: var(--input-bg1);
    color: var(--text-n-border2);
}

.input06a {
    border-left: 1px var(--bg4) solid; /* --text-n-border1 */
    border-top: 1px var(--bg4) solid;
    border-bottom: 1px var(--bg4) solid;
    background-color: var(--input-bg1);
}

.input01:focus, .input06a:focus {
    background-color: var(--input-high1);
}

.input06b {
    background-color: var(--bg4);
    color: var(--bg-n-text1);
}

.input06b:hover, .input07:hover{
    background: rgb(var(--rgb1));
    background: linear-gradient(148deg, rgba(var(--rgb1),1) 0%, rgba(var(--rgb2),1) 100%);
    color: var(--bg-n-text1);
}

.input07 {
    background-color: var(--bg4);
    color: var(--bg-n-text1);
}

.input07b {
    background-color: var(--bg2);
    color: var(--text-n-border3);
}

.custom-file-upload {
    border: 1px var(--text-n-border1) solid; 
    color: var(--text-n-border2);
    background: linear-gradient(90deg, rgba(var(--rgb-7-customupload1),1) 0%, rgba(var(--rgb-7-customupload2),1) 100%);
}

.file_upload_preview, .file_upload_preview_s {
    background-color: var(--bg3);
}

.file_upload_pb_box1 {
    background-color: var(--bg2);
}

.input-search {
    background-color: var(--bg6);
}

.input_count {
    color: var(--text-n-border1);
}

.shp_off a:link, .shp_off a:active, .shp_off a:visited {
    color: var(--text-n-border2)
}

.link01, .link01 a {
    color: var(--link-color2);
}

.link01:hover, .link01 a:hover {
    color: var(--link-color3);
}

.link02, .link02 a {
    color: var(--link-color1);
}

.link02:hover, .link02 a:hover {
    color: var(--link-color1);
}

.textc-green {
     color: var(--green1);
}

.textc-red {
    color: rgb(var(--rgb1));
}

.textc-blue {
    color: rgb(var(--rgb1));
}

.text04 {
    color: var(--text-n-border1);
}

.textc-inv {
    color: var(--bg3);
    background-color: var(--bg1);
}

.text-count-err {
    color: var(--red1);
}

.data_box_content_b {
    border-right: 1px var(--text-n-border1) solid;
}

.input_box_title {
    border-top: 1px var(--text-n-border1) solid; 
}

.input_box_sep {
    border-top: 1px var(--text-n-border1) solid; 
    border-bottom: 1px var(--text-n-border1) solid; 
}

.main-menu-box1, .main-menu-box2 {
    border: 1% var(--bg-n-text1) solid;
    color: var(--text-n-border1);
}

.main-menu-box1p:hover, .main-menu-box2p:hover {
    background: rgb(var(--rgb1));
    background: linear-gradient(148deg, rgba(var(--rgb1),1) 0%, rgba(var(--rgb2),1) 100%);
    color: var(--bg-n-text1);
}

.main-menu-box-title {
    color: var(--bg-n-text2);
}

.main-menu-box-title1 {
    background-color: var(--bg5);
}

.main-menu-box-title2 {
    border-top: 1px var(--text-n-border1) solid;
}

.filter_box {
    background-color: var(--bg3);
    color: var(--text-n-border2);
}

.responsive-table {
    color: var(--bg1);
    border-spacing: 2px;
    border-collapse: separate;
}

.responsive-table th {
    background-color: var(--table-th);
    color: var(--bg-n-text1);
}

.responsive-table th a {
    color: var(--bg-n-text1);
}

.table-row:nth-child(even) td { /* efefef   */
    background-color: var(--bg3);
}

.table-row:nth-child(odd) td {
    background-color: var(--bg-n-text1);
}

.table-row:hover td { /* , .table-row:hover a   ,,, afbccb  */
    background-color: var(--table-row-high);
}

.table-row:hover td .input03 {
    background-color: rgb(var(--rgb1));
    color: var(--bg-n-text1);
}

.td1 {
    color: var(--text-n-border1);
}

.pagination_button a {
    background-color: var(--bg3);
    color: var(--text-n-border2);
}

.pagination_button a:hover {
    /*
    background: var(--link-color1);
    */
    background: rgb(var(--rgb1));
    background: linear-gradient(148deg, rgba(var(--rgb1),1) 0%, rgba(var(--rgb2),1) 100%);
    color: var(--bg-n-text1);
}

.pagination_button_active {
    background-color: var(--text-n-border1);
    color: var(--bg-n-text1);
}

.pagination_button_text {
    color: var(--text-n-border1);
}

.tag {
    background-color: var(--bg-n-text1);
    color: var(--text-n-border1); 
}

.tag::before {
    color: var(--bg-n-text1); 
    background-color: var(--text-n-border1);
}

.tag_box_item{
    background-color: var(--bg-n-text1);
    color: var(--text-n-border2); 
}

.tag_box_item2{
    background-color: var(--bg-n-text1);
    color: var(--text-n-border1); 
}

.tag_box_item3{
    background-color: var(--blue);
    color: var(--bg-n-text1); 
}

.tag_box_item_note {
    background-color: var(--bg-n-text1);
    color: var(--text-n-border2); 
}

.note::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 0 rgba(var(--rgb-scroll),0.9); 
}

.note::-webkit-scrollbar-thumb {
    -webkit-box-shadow: inset 20px 20px 6px rgba(var(--rgb-scroll),1); 
}

/**/

.slider {
  background-color: var(--slider-bg);
}

.slider:before {
  background-color: var(--bg-n-text1);
}

input:checked + .slider {
    background-color: var(--slider-bg-high);
}

/**/

.slider2 {
  background-color: var(--slider-bg);
}

.slider2:before {
  background-color: var(--bg-n-text1);
}

input:checked + .slider2 {
    background-color: var(--slider-bg-high);
}

/**/

.slider3 {
  background-color: var(--slider-bg);
}

.slider3:before {
  background-color: var(--bg-n-text1);
}

input:checked + .slider3 {
    background-color: var(--slider-bg-high);
}

/**/

.ui-dialog {
    background: var(--bg3) !important;
}

.ui-widget-overlay {
    background-color: var(--table-border) !important;
}

.ui-widget-content {
    
}

.ui-state-highlight {
    background-color: var(--text-n-border1) !important;
    color: var(--bg-n-text1) !important;
}

.general-box {
    background: var(--bg3) !important;
    color: var(--text-n-border2) !important;
}

.good_box_col {
    background-color: var(--bg-n-text1);
    color: var(--text-n-border2); 
}

.alert_box {
    background-color: var(--red1);
    color: var(--bg-n-text2); 
}

.tag_spam {
    background-color: var(--red1);
    color: var(--bg-n-text1); 
}

@media only screen and (max-width: 700px) {

    .responsive-table td {
        border-bottom: 1px var(--table-border) solid;
    }
    
}