input[type=checkbox] {
    -webkit-appearance: checkbox;
}

/*Отключение стрелочек в имптах типа number */

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/*Отключение стрелочек в имптах типа number в бразере FireFox*/

input[type='number'] {
    -moz-appearance: textfield;
}



body {
    background: #ffffff;
    width: 70%;
    min-width: 1000px;
    font-family: arial;
    margin-top: 80px;
    margin-left: 15%;
    overflow-y: scroll;

}

hr{
    border-top:1px solid darkgray;
    border-bottom: 0px;
    color:darkgray;
}

.box-header {
    margin-left: 10px;
    margin-top: 10px;
    background: #ffffff;
    font-weight: bold;


}

.box-body {

    border-top: none;

    background: #ffffff;
}

.box-body-t {
    width: 40%;
    border: 1px solid;
    margin-left: auto;
    margin-right: -24.3em;
}

.box-header-active {
    border: 0px solid;
    margin-top: 10px;
    margin-left: 10px;
    background: none;
    padding: 5px;
    font-weight: bold;

}

.box-body-active {
    border: 0px solid;
    border-top: none;

    background: none;
}

select {
    outline: none;
    padding: 5px;
    margin: 5px;
    border: 1px solid #ccc;
}

input {
    outline: none;
    padding: 5px;
    margin: 5px;
    border: 1px solid;
    border-color: transparent;
    background: none;
    
}

input:focus {
    border: 1px solid #8b8;
}

label {
    display: inline-block;
    width: 130px;
    text-align: right;
}

.formAddDevice label {
    width: 170px;
}

.btn {
    border: 1px solid #aaa;
    background: #428bca;
    cursor: pointer;
    min-width:100px;

    padding: 3px;
    padding-left: 10px;
    padding-right: 10px;
    color: white;
    transition: 0.3s;
    margin: 10px;
    border-radius:3px;
}


.btn:hover {
    background: #4266CA;
}

.btn:active {
    background: #4266CA;
}

.btn-del {
    background: #E31E24;
    color: white;
}

.btn-del:hover {
    background: #7f3300;
    color: white;
}

.btn-del:active {
    background: #7f3300;
    color: white;
}
    
.btn-disabled{
    background: #f5f5f5;
    border-color:gray;
    color: gray;
}

.btn-disabled:hover{
    background: #f5f5f5;
    border-color:gray;
    color: gray;
}

.btn-save {
    background: #5CB85C;
    color: white;
}

.btn-save:hover {

    background: #47A447;
}

.btn-save:active {  

    background: #47A447;
}


.btn-info {
    background: #5BC0DE;
    color: white;
}

.btn-info:hover {
    background: #31B0D5;
}

.btn-info:active {
    background: #31B0D5;
}


.btn-add-dev {
    margin-top: 0px;
    margin-bottom: 10px;
}


.header {
    display: inline-flex;
    background: #222222;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    height: 30px;
    width: 100%;
    min-width: 1000px;
    text-align: center;
    padding: 10px;
    color: #9b9b9b;
    font: 1.1em;
    font-weight: bold;
    overflow-y: scroll;
}

.row {
    border: #eeeeee 1px solid;
    padding-top: 5px;
    margin: 10px;
    box-shadow: 0 0 5px rgba(0,0,0,0.1);
    border-radius: 5px;
}


.hidden {
    display: none;
}

.navbar {
    background-color: #eeeeee;
    margin-bottom: 20px;
    margin-top: -10px;
    padding: 10px;

}

a {
    color: gray;
    cursor: pointer;
    padding-right: 10px;
    padding-left: 10px;
    text-decoration: none;
}

a:hover {
    color: white;
    padding-right: 10px;
    padding-left: 10px;
    text-decoration: none;
    transition: 0.5s;
}



.msg {
    color: red;
    padding-right: 5px;
    padding-left: 5px;
    text-decoration: none;
}
.msg:hover {
    color: red;
    padding-right: 5px;
    padding-left: 5px;
    text-decoration: none;
    transition: none;
}

.good {
    color: green;
    padding-right: 5px;
    padding-left: 5px;
    text-decoration: none;
}
.good:hover {
    color: green;
    padding-right: 5px;
    padding-left: 5px;
    text-decoration: none;
    transition: none;
}





.btn-menu {
    color: gray;
    margin: 0px;
    padding-right: 15px;
    padding-left: 10px;
    text-decoration: none;
}

.btn-menu:hover {
    color: white;
    padding-right: 15px;
    padding-left: 10px;
    text-decoration: none;
    transition: 0.5s;
}

/*
    TABs
*/

#tabs .tab {
    display: inline-block;
    /* выстраиваем вкладки в один ряд */
    padding: 10px 20px;
    margin-top: 10px;
    cursor: pointer;
    background: #eeeeee;
    border: 0px solid #eeeeee;
    color: #808080;
    transition: 0.5s;


    /* наверно таким способом неправильно. Деает чтобы нижняя граница активной вкладки перекрывала рамку нижнего блока. */
    margin-right: -6px;
}

#tabs .tab:hover {
    display: inline-block;
    /* выстраиваем вкладки в один ряд */
    padding: 10px 20px;
    cursor: pointer;
    background: #eeeeee;
    border: 0px solid #eeeeee;
    color: white;


    /* наверно таким способом неправильно. Деает чтобы нижняя граница активной вкладки перекрывала рамку нижнего блока. */
    margin-right: -6px;
}

#tabs .whiteborder {
    background: gray;
    border: 0px solid #A08080;
    border-bottom: 0px solid #eee;
    border-radius: 0px 0px 0 0;
    color: #eeeeee;
}

#tabs .tabContent {
    background: #eee;
    display: inline-block;
    width: 100%;
    border-top: 1px solid #eeeeee;

    top: -1px;
    z-index: 1;
    padding: 0px;
    border-radius: 0 0 3px 3px;

}

#tabs .hide {
    display: none;
}

#tabs .show {
    display: block;
}

#tabs .device-properties {
    width: 280px;
    padding: 0px;
    background: #eee;
    font-size: 14px;
    margin-left: auto;
    border: 1px solid;

}

/*-----------------------------------------------------------------*/

.tableAddrMap {
    width: 100%;
    min-width: 800px;
    text-align: center;
    margin: 0px;
    margin-top: 10px;
    padding: 0;
    margin: 0;
    font-size: 12px;
    background: white;
    border: 1px solid gray;

    
}

.tableAddrMap th {
    font-size: 12px;
    line-height: 1;
}

.tableAddrMap input {
    width: calc(100% - 6px);

    margin-left: 3px;

    min-width: 18px;

    padding: 2px;
}

.tableAddrMap select {

    margin: 5px;
    max-width: 70px;

    background: none;
    padding: 1px;
}




.tableAddrMap td {
    margin: 5px;
    padding: 0px;
    
    border-right: 1px solid gray;
    border-top: 1px solid gray;
}

.tableAddrMap th {

    background: #eeeeee;
}




/*--------------------------------------------------------------------*/

.container {
    overflow: hidden;
    width: 100%;
    background: white;
    border-top: 1px solid #eeeeee;
}

.box {
    white-space: nowrap;

}


.sequenceElementsType {
    margin: 5px;
    width: 160px;
    height: 26px;
    border: 1px solid #ccc;
    border-radius: 5px;
}

.sequenceElementsSQL {
    margin: 5px;
    width: 160px;
    height: 26px;
    border: 1px solid #ccc;
    border-radius: 5px;
}

.sequenceElementsLocal {
    margin: 5px;
    width: 160px;
    height: 26px;
    border: 1px solid #ccc;
    border-radius: 5px;
}

.sequenceElementsDeviceRegType {
    width: 40px;
    border: 1px solid #ccc;
    background: white;
    border-radius: 5px;
}

.sequenceElementsRegNumber {
    width: 105px;
    border: 1px solid #ccc;
    background: white;
    border-radius: 5px;
}

.dropDown {
    margin: 5px;
    border-radius: 3px;
    border: 1px solid #ccc;
}


.sequenceElementsDeviceRegProp {
    display: inline-block;
}

.input-160 {
    width: 160px;
    border: 1px solid #ccc;
    background: white;
    border-radius: 5px;
}



@media all and (min-width: 1400px) {

    .go-top {
        position: fixed;
        bottom: 30px;
        right: 30px;
      

    }
}

@media all and (max-width: 1400px) {

    .go-top {
        position: relative;
        float: right;
       
    }
}



.box-device {
    border: #eeeeee 1px solid;
    margin: 10px;
   
    margin-top: 0px;
    margin-bottom: 15px;
    border-radius: 5px;
    box-shadow: 0 0 5px rgba(0,0,0,0.1);

}
.box-device1 {
    border: #eeeeee 1px solid;
   
    padding: 10px;
    margin-top: 0px;
    margin-bottom: 15px;
    border-radius: 5px;
    box-shadow: 0 0 5px rgba(0,0,0,0.1);

}

.addTagsForm {
    border: #eeeeee 1px solid;
    margin: 10px;
    margin-top: 0px;
     box-shadow: 0 0 5px rgba(0,0,0,0.1);
    border-radius:5px;


}

.addTagsForm label {
    width: 170px;
}


.addrMapType {
    border: none;
}

.addrMapType:focus {
    border: none;
}



.bt-sm-del {
    /*background: #E31E24;*/
    background: none;
    color: black;
    margin-left: 1px;
    margin-right: 1px;
    border: 1px solid #cccccc;
    width: 25px;
    height: 25px;
    font-size: 14pt;
    font-weight: bold;
    border-radius: 5px;
}

.bt-sm-del:hover {
    background: #7f3300;
    color: white;
    border: 0px;
    width: 25px;
    height: 25px;
    font-size: 14pt;
    font-weight: bold;
}

.bt-sm-add {
    /*   background: #5CB85C;*/
    background: none;
    color: black;
    margin-left: 1px;
    margin-right: 1px;
    border: 1px solid #cccccc;
    width: 25px;
    height: 25px;
    font-size: 14pt;
    font-weight: bold;
    border-radius:5px;

}

.bt-sm-add:hover {
    background: #47A447;
    color: white;
    border: 0px;
    width: 25px;
    height: 25px;
    font-size: 14pt;
    font-weight: bold;

}

.bt-opacity {}

.bt-right {
    margin-left: 0px;
}

.bt-left {
    margin-right: 0px;
}

.navbar_l {
    margin-top: auto;
    margin-bottom: auto;
}


.tb_system {
    font-size: 14pt;

}



.tableMonitor {

    width: 100%;
    text-align: center;
    margin: auto;
    border: 1px solid #eeeeee;
}

.tableMonitor th {
    border: 1px solid #eeeeee;
    background: #eeeeee;
    color: gray;
}

.tableMonitor tr:nth-child(odd) {

    background-color: #D6FFF8;
    /* фон нечетных строк */
}

.tableMonitor tr:nth-child(even) {

    background-color: white;
    /* фон четных строк */
}





.tableMonitor td {

    border-right: 1px solid #eeeeee;

}

.tableMonitor td:nth-child(4) {
    color: green;
}

.tableMonitor td:nth-child(1) {
    color: gray;
}


.SysName {
    border: 0px;

}

.SysName:focus {
    border: 0px;
}

.SysType {
    border: 0px;

}

.SysType:focus {
    border: 0px;
}


.d-butts {
    display: inline-flex;
    padding: 3px;
}

.tableAddrMap tr:nth-child(odd) {

    background-color: #D6FFF8;
    /* фон нечетных строк */
}

.tableAddrMap tr:nth-child(even) {

    background-color: white;
    /* фон четных строк */
}

.tableAddrMap th {
    border: 1px solid #eeeeee;
    background: #eeeeee;
    color: black;
    border-right: 0px solid;
}

.labelNotAvail {
    color: #C0C0C0;
}

.invalid {

    background: none;
    border: 1px solid red;
}

.addServer label {
    display: inline-block;
    width: 300px;
}

.addServerForm label {
    display: inline-block;
    width: 330px;
    margin-left: 5px;
}

#serverProperties label {
    display: inline-block;
    width: 330px;
}





/*стилизация поля загрузки файла */

.file_mark {
    background: none;
    border: 1px solid #ccc;
    padding: 5px;
    padding-left: 10px;
    padding-right: 10px;
    font-size: 10pt;
    width: 400px;
    text-align: left;
    margin-right: -5px;

}

.btn-file {
    font-size: 10pt;
    background: #428bca;
    cursor: pointer;
    min-width: 100px;

    padding: 6px;
    padding-left: 5px;
    padding-right: 5px;
    color: white;
    transition: 0.3s;

}

.btn-file:hover {
    font-size: 10pt;
    background: #31B0D5;
    cursor: pointer;
    min-width: 100px;

    padding: 6px;
    padding-left: 10px;
    padding-right: 10px;
    color: white;
    transition: 0.3s;

}

.btn-file1 {
    font-size: 10pt;
    background: #428bca;
    cursor: pointer;
    min-width: 100px;

    padding: 4px;
    padding-left: 10px;
    padding-right: 10px;
    color: white;
    transition: 0.3s;

}

.btn-file1:hover {
    font-size: 10pt;
    background: #31B0D5;
    cursor: pointer;
    min-width: 100px;

    padding: 4px;
    padding-left: 10px;
    padding-right: 10px;
    color: white;
    transition: 0.3s;

}

.btn-file-danger {
    font-size: 10pt;
    background: #E31E24;
    color: white;
    cursor: pointer;
    min-width: 100px;

    padding: 4px;
    padding-left: 10px;
    padding-right: 10px;
    color: white;
    transition: 0.3s;

}

.btn-file-danger:hover {
    font-size: 10pt;
    background: #7f3300;
    color: white;
    cursor: pointer;
    min-width: 100px;

    padding: 4px;
    padding-left: 10px;
    padding-right: 10px;
    color: white;
    transition: 0.3s;

}


.file_upload {}

/*/

/*стилизация поля liccens*/

.input-lic {
    width: 500px;
    border: 1px solid #ccc;
    background: white;
    margin: 10px;
    font-size: 10pt;
    padding: 5px;
    border-radius: 5px;
}


/*------------------------*/

.box-body-dev {
    border: 1px solid #eeeeee;
    margin: 10px;
    box-shadow: 0 0 5px rgba(0,0,0,0.1);
    border-radius: 5px;
    /*  padding-left: 10px;*/
}

.settingsForm .input-160:disabled {
    background-color: whitesmoke;
    border: 1px solid #eeeeee;

}
.input-160:disabled {
    background-color: whitesmoke;
    border: 1px solid #eeeeee;

}
.settingsForm .rowName {
    width: 200px;
}

.settingsForm .rowValue {
    width: 180px;
}


.statusTable{
    margin-left:5px;
    margin-right:5px;
    margin-top:10px;
}

.button{
    padding-left: 15px;
    padding-right: 15px;
}
.button:hover{
    padding-left: 15px;
    padding-right: 15px;
}

.align-top {
    display: inline-block;
    vertical-align: top;
}

.padTopBot10 {
    padding-top: 10px;
    padding-bottom: 10px;
}

.padTopBot10 label {
    width: 170px;
}

.raw-4{
    display:inline-block;
    vertical-align: top;
    
}

.hid{
    color:#eeeeee;
}


/*************PAGINATION******************/

.paginator{
    text-align:center;
    margin-top:20px;
    
}

.btn-paginator{
    color: black;
    font-family: inherit;
    padding: 8px 16px;
    text-decoration: none;
    border-radius: 5px;
}


.btn-paginator:hover{
    color: black;
    transition: 0.5s;
    opacity: 0.8;
    background-color: #ddd;
    padding: 8px 16px;
    text-decoration: none;
    border-radius: 5px;
}


.active{
    padding: 8px 16px;
    background-color: #4CAF50;
    color: white;
    border-radius: 5px;
}


/*************Preloader*******************/
    
#page-preloader {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color:rgba(0,0,0,.3);
    z-index: 10;
}

#page-preloader .spinner {
    font-size: 14pt;
    width: 41px;
    height: 41px;
  
    position: absolute;
    left: calc( 50% - 0px );
    top: calc( 50% - 0px );
    background: url('../static/images/load.svg') no-repeat 50% 50%;
    margin: -16px 0 0 -16px;
}

.newTr{
 /*  background-color: red;
    opacity: 0.1;*/
}


.likeDisable {
    background-color: #F5F5F5;
}

.activeBar {
    color:#404040;             
    text-decoration: underline;
}

#moreInfoBut {
    padding-top: 5px;
    padding-bottom: 5px;
    margin-left: 10px;
    margin-right: 10px;
    text-align: center;
    cursor: pointer;
    color: gray;
    transition: 0.5s;
    border: 1px solid #eeeeee;
    box-shadow: 0 0 5px rgba(0,0,0,0.1);
    border-radius: 5px

}

#moreInfoBut:hover {
    background-color: #eeeeee;
    color: white;
border-radius:3px;
}


.child_elem{
   display:flex;
    padding:5px;
}

.inblck{
    display: grid;
    margin-right: 10px;
    align-items:end;
}

.inblck label{
    text-align: left;
    width: 160px;
    margin-left: 5px;
}

.w-100{
    width: :100%;
}

.new_form{
    box-shadow: 0 0 5px black;
}

.long{
    width: 430px;
     text-align: right;
}
.long label{
    text-align: left;
    width:auto;
}