.XS_FieldSet {
    border:1px #cccccc solid;
    margin-top:3px;
    margin-bottom:3px;
    padding-top:0px;
    padding-bottom:5px;
    padding-left:5px;
    padding-right:5px;
    border-radius: 5px;
}

.XS_FieldSet legend{
    font-weight: bold;
}

.XS_FieldSet section{
    display:block;
}

.XS_FieldSet_off {
    border-left:0px;
    border-top:0px;
    border-right:0px;
    border-bottom:0px #cccccc solid;
    margin-top:3px;
    margin-bottom:3px;
    padding-left:5px;
    padding-right:5px;
    padding-top:0;
    padding-bottom:0;
}

.XS_FieldSet_off legend{
    font-weight: bold;
}

.XS_FieldSet_off section{
    display:none;
}


.XS_Field  {
    font-family:verdana,sans-serif;
    font-size:11px;
    background:transparent;
    float:left;
    padding:0px;
    margin-right:10px;
    border:1px transparent solid;
 }


 .XS_Field div.label {
    font-family:verdana,sans-serif;
    font-weight:bold;
    color:#555555;
    padding-top:4px;
    padding-left:5px;
    padding-bottom:3px;
    padding-right:3px;
    min-height: 14px;
 }

.XS_Field div.labelTop {
    font-family:verdana,sans-serif;
    font-weight:bold;
    color:#555555;
    padding-top:4px;
    padding-bottom:0px;
    padding-left:3px;
    text-align:left;
 }

 .XS_Field div.labelTopCenter {
    font-family:verdana,sans-serif;
    font-weight:bold;
    color:#555555;
    padding-top:4px;
    padding-bottom:0px;
    padding-right:3px;
    text-align:center;
 }

 .XS_Field span.info::after {
    font-family:'Courier New', Courier, monospace;
    color:#555555;
    background:#ffffff;
    border:1px #cccccc solid;
    border-radius:50%;
    content:'i';
    cursor:pointer;
    padding-left: 2px;
    padding-right: 2px;
 }


 .XS_Field span.control{
    border-right:0px #cccccc solid;
    border-radius:2px;
 }



 .XS_Field img{
    outline:0px;
    border:0px;
    margin-top:0px;
    margin-left:2px;
    cursor:pointer;
 }

 .XS_Field div.off{
    background:#fffff8;
    border-radius:3px;
    border:1px #cccccc solid;
    padding:3px;
    min-height:13px;
    overflow: auto;
 }



 .XS_Field input {
    font-family:verdana,sans-serif;
    font-size:11px;
    padding:3px;
    border:1px #cccccc solid;
    border-radius:3px;
    background:#ffffff;
    outline: 0px;
/*    height: 3;*/
 }



.XS_Field .input_in {
    font-family:verdana,sans-serif;
    font-size:11px;
    padding:3px;
    border:1px #cccccc solid;
    outline: 0px;
    border-radius:3px;
    background:#FFFFD9;
    box-shadow: -1px -1px 2px rgb(0 0 0 / 20%), 1px 1px 2px rgb(0 0 0 / 20%);
    transition:0.2s easy;
}

.XS_Field .action {
    height:19px;
    width:19px;
    padding:1px !important;
    border:2px transparent solid !important;
    cursor:pointer;
    background-repeat: no-repeat !important;
    background: transparent;
}

.XS_Field .action:focus {
    border:2px #cccccc solid;
    box-shadow: -1px -1px 2px rgb(0 0 0 / 20%), 1px 1px 2px rgb(0 0 0 / 20%);
    transition:0.2s easy;
    background:#FFFFD9;
}

.XS_Field textarea {
    font-family:verdana,sans-serif;
    font-size:11px;
    padding:3px;
    border:1px #cccccc solid;
    border-radius:3px;
    background:#ffffff;
    outline: 0px;
    height: 3;
 }



.XS_Field .textarea_in {
    font-family:verdana,sans-serif;
    font-size:11px;
    padding:3px;
    border:1px #cccccc solid;
    outline: 0px;
    border-radius:3px;
    background:#FFFFD9;
    box-shadow: -1px -1px 2px rgb(0 0 0 / 20%), 1px 1px 2px rgb(0 0 0 / 20%);
    transition:0.2s easy;
}

.XS_Field select {
    font-family:verdana,sans-serif;
    font-size:11px;
    padding:2px;
    outline: 0px;
    border:1px #cccccc solid;
    border-radius:3px;
    background:#ffffff;
 }


 .XS_Field .select_in {
    font-family:verdana,sans-serif;
    font-size:11px;
    padding:2px;
    border:1px #cccccc solid;
    outline: 0px;
    border-radius:3px;
    background:#FFFFD9;
    box-shadow: -1px -1px 2px rgb(0 0 0 / 20%), 1px 1px 2px rgb(0 0 0 / 20%);
    transition:0.2s easy;
}

.XS_Field .box {
    font-family:verdana,sans-serif;
    font-size:11px;
    padding:3px;
    border:1px #cccccc solid;
    border-radius:3px;
    background:#fffff8;
    outline: 0px;
    min-height:13px;
    overflow-Y:auto;
 }

 .XS_Field .check {
    font-family:verdana,sans-serif;
    font-size:11px;
    padding:3px;
    border:1px #cccccc solid;
    border-radius:3px;
    background:#ffffff;
    outline: 0px;
 }

 .XS_Field .check_ul{
    list-style: none;
    padding:3px;
    margin:0px;
 }

 .XS_Field .check_li{
    height:18px;
    white-space: nowrap;
    overflow-x: hidden;
    text-overflow: ellipsis;
 }

 .XS_Field .check_input{
    cursor:pointer;
    margin:0px;
}

.XS_Field .check_label{
    margin-top:-3px;
    margin-left:2px;
    margin-right:10px;
}



.XS_Field div.labelType {
    font-family:verdana,sans-serif;
    font-size:11px;
    font-weight:bold;
    color:#000000;
    padding:0px;
    margin-bottom:3px;
    border-bottom:1px #cccccc solid;
 }

.XS_Field dataList {
    font-family:verdana,sans-serif;
    font-size:11px;
    padding:3px;
    border:1px #cccccc solid;
    border-radius:3px;
    background:#ffffff;
 }


.XS_Field .dataList ul {
    z-index:1000;
    position:absolute;
    margin:0px;
    padding:3px;
    background: #ffffff;
    border-left:1px #cccccc solid;
    border-right:1px #cccccc solid;
    border-bottom:1px #cccccc solid;
    min-width:150px;
    max-height:150px;
    overflow-y:auto;
    width:auto;
    box-shadow: 0.5px 0.5px 0.5px rgba(0, 0, 0, 0.20), 6px 6px 6px rgba(0, 0, 0, 0.19);

}

.XS_Field .dataList ul::-webkit-scrollbar-track{
    width: 10px;
    background-color: #f8f8f8;
}

.XS_Field .dataList ul::-webkit-scrollbar{
    width: 10px;
    background-color: #f8f8f8;
}

.XS_Field .dataList ul::-webkit-scrollbar-thumb{
    width: 10px;
    background-color: #cccccc;
}

.XS_Field .dataList li {
    margin:0px;
    padding:3px;
    list-style: none;
    cursor:pointer;
    text-align: left;
}

.XS_Field .dataList li:hover {
    background:#F0FBFF;
}

.XS_Field .dataList .liOn{
    background:#F0FBFF;
}

.XS_Field .dataList .liOff{
    background:#FFFFFF;
}

.XS_Field .dataList .liOff:hover{
    background:#F0FBFF;
}

.XS_Field .dataList a{
    text-decoration: none;
    color:#555555;
    border: 0px;
}

.XS_Field span.add{
    color:#555555;
    padding:4px;
    display:none;
    float:left;
}

.XS_Field span.select{
    color:#555555;
    background:transparent;
    font-size:12px;
    cursor:pointer;
    float:left;
 }


 .XS_Field span.arrow{
    color:#555555;
    background:transparent;
    font-size:12px;
    cursor:pointer;
    margin-top:6px;
    margin-left:2px;
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10 and IE 11 */
    user-select: none; /* Standard syntax */
    float:right;
 }

.XS_Field span.ext {
    padding:0px;
    float:left;
}

.XS_Field span.clear{
    margin:0px;
}

.XS_Field span.clear::before{
    font-family:verdana,sans-serif;
    color:#A0A0A0;
    background:transparent;
    font-size:12px;
    font-weight:bold;
    content:'\0078';
    cursor:pointer;
    margin:2px;
}

.XS_Field span.menu::before{
    font-family:verdana,sans-serif;
    color:#555555;
    background:transparent;
    font-size:12px;
    margin-top:5px;
    content:'\2261';
    cursor:pointer;
}

.XS_Field span.optClass::before {
    font-family:verdana,sans-serif;
    font-size:12px;
    color:#ffffff;
    content:'\2731';
    display:none;
 }

.XS_Field span.reqClass::before {
    font-family:verdana,sans-serif;
    font-size:12px;
    color:burlywood;
    content:'\2731';
    display:block;
}

.XS_Field span.proClass::before {
    font-family:verdana,sans-serif;
    font-size:12px;
    color:#A0A0A0;
    content:'\2731';
    display:block;
 }

.XS_Field span.errClass::before {
    font-family:verdana,sans-serif;
    font-size:12px;
    color:#94442d;
    content:'\2731';
    display:block;
 }

 .XS_Field span.help::before {
    font-family:verdana,sans-serif;
    color:#A0A0A0;
    background:#ffffff;
    border:1px #cccccc solid;
    border-radius:50%;
    content:'\003F';
    cursor:pointer;

 }

.XS_Field span.msg {
    font-family:verdana,sans-serif;
    font-size:11px;
    padding-left:4px;
    padding-top:4px;
    color:#555555;
 }

 .XS_Field span.error {
    font-family:verdana,sans-serif;
    font-size:11px;
    padding-top:2px;
    color:red;
 }

.XS_Field input.check{
    width:10px;
    display:inline;
}

.XS_Field_time{
    font-family:verdana,sans-serif;
    font-size:11px;
    padding:2px;
    outline: 0px;
    border:1px #cccccc solid;
    border-radius:3px;
    background:#ffffff;
}

.XS_Field_time_in{
    font-family:verdana,sans-serif;
    font-size:11px;
    padding:1px;
    border:1px #cccccc solid;
    outline: 0px;
    background:#FFFFD9 !important;
    border-radius:3px;
    box-shadow: -1px -1px 2px rgb(0 0 0 / 20%), 1px 1px 2px rgb(0 0 0 / 20%);
    transition:0.2s easy;
}

.XS_Field_time_in:-webkit-scrollbar-track    {
    width: 6px;
    background-color: #f8f8f8;
}

.XS_Field_time_in::-webkit-scrollbar{
    width: 6px;
    background-color: #f8f8f8;
}

.XS_Field_time_in::-webkit-scrollbar-thumb{
    width: 6px;
    background-color: #cccccc;
}


.XS_Field_switch{
    height:10px;
    width:20px;
    border-radius:5px;
    cursor:pointer;
    border:1px #cccccc solid;
    padding:0;
    background: #ffffff;
    margin-top:5px;
}

.XS_Field_switch_in {
    height:10px;
    width:20px;
    border-radius:5px;
    cursor:pointer;
    border:1px #cccccc solid;
    padding:0;
    background:#FFFFD9;;
    margin-top:5px;

    outline: 0px;
    box-shadow: -1px -1px 2px rgb(0 0 0 / 20%), 1px 1px 2px rgb(0 0 0 / 20%);
    transition:0.2s easy;
}


.XS_Field_switch_off{
    height:10px;
    width:10px;
    margin-left:0px;
    border-radius:5px;
    background:#cccccc
}

.XS_Field_switch_on{
    height:10px;
    width:10px;
    margin-left:10px;
    border-radius:5px;
    background-image:linear-gradient(rgb(160,160,160), rgb(85, 85, 85),rgb(160,160,160) );
    --background: #555555;
}

.XS_Field .tags {
    font-family:verdana,sans-serif;
    font-size:11px;
    padding:3px;
    border:1px #cccccc solid;
    border-radius:3px;
    outline: 0px;
    background:#ffffff;
    min-height:25px;
 }

 .XS_Field .tags_in {
    font-family:verdana,sans-serif;
    font-size:11px;
    padding:3px;
    border:1px #cccccc solid;
    border-radius:3px;
    outline: 0px;
    background:#FFFFD9;

    outline: 0px;
    box-shadow: -1px -1px 2px rgb(0 0 0 / 20%), 1px 1px 2px rgb(0 0 0 / 20%);
    transition:0.2s easy;
}


 .XS_Field .tags_ul{
    list-style: none;
    padding:3px;
    margin:0px;
    min-height: 20px;
 }

 .XS_Field .tags_li{
    margin:2px;
    padding:0px;
    float:left;
    border:1px #cccccc solid;
    border-radius: 5px;
    background:#ffffff;
    box-shadow: 0px 0px 1px rgb(0 0 0 / 20%), 0px 0px 1px rgb(0 0 0 / 20%);
 }

 .XS_Field .tags_data{
    margin:3px;
    float:left;
    background:#ffffff;
 }

.XS_Field .tags_clear{
    margin-top:1px;
    margin-right:3px;
    font-family:verdana,sans-serif;
    color:transparent;
    font-size:13px;
    cursor:pointer;
}

.XS_Field .tags_clear:hover{
    color:#A0A0A0;
}


.XS_Field .tags_label{
    margin-top:-3px;
    margin-left:2px;
    margin-right:10px;
}

.XS_Field .image{
    width:auto;
    height:auto;
}

.XS_Field_btn{
    margin-top:4px;
    padding-left:3px;
    cursor:pointer;
    user-select: none;
}


.XS_Field_btnMenu{
    width:10px;
    font-size: 14px;
}

.XS_Field_btnMenu::after{
    content:'\205D';
    font-weight:bold;
    cursor:pointer;
}


.XS_Field_attach{
    font-family:verdana,sans-serif;
    font-size:11px;
    height:14px;
    border:1px #cccccc solid;
    border-radius: 3px;
    padding:3px;
    background: #ffffff;
    float:left;
}

.XS_Field_attach:hover{
    cursor:pointer;
    color:blue;
    font-size:11px;
    text-decoration: none;
}

.XS_Field_files{
    font-family:verdana,sans-serif;
    font-size:11px;
    float:left;
}

.XS_Field_files .ul{
    margin:0px;
    padding-top:2px;
    padding-left:3px;
    border-radius:3px;
    border:1px #cccccc solid;
    float: left;
    min-height: 19px;
    background: #ffffff;
}

.XS_Field_files .ul_in {
    background:#FFFFD9;
    box-shadow: -1px -1px 2px rgb(0 0 0 / 20%), 1px 1px 2px rgb(0 0 0 / 20%);
    transition:0.2s easy;
}

.XS_Field_files .li{
    padding-left:3px;
    padding-top:3x;
    margin-left:0px;
    margin-right:0px;
    margin-top:3px;
    margin-bottom:3px;
    list-style: none;
    height:17px;
}


.XS_Field_files .li:nth-child(even) {
    background: #f8f8f8;
}

.XS_Field_files .nf{
    width:calc(100% - 25px);
    float: left;
}

.XS_Field_files .nf:hover{
    cursor:pointer;
    color:blue;
    font-size:11px;
    text-decoration: none;
}

.XS_Field_files .mf{
    display:inline-block;
    width:10px;
    cursor:pointer;
}

.XS_Field_files .mf::after{
    content:'\205D';
    font-weight:bold;
    cursor:pointer;
}


.XS_Field_files .ckf {
    height:8px;
    width:8px;
    margin:0;
    padding:0;
    cursor:pointer;
}

.XS_Field_files .attach{
    --padding-top: 3px;
    padding-left: 3px;
    cursor: pointer;
}


.XS_Image{
    padding:3px;
    border:1px #cccccc solid !important;
    border-radius: 5px;
    background: #ffffff;
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.20), 4px 4px 4px rgba(0, 0, 0, 0.19);
    cursor: default !important;
}

.XS_Link{
    margin-top:3px;
}

.XS_Link a{
    cursor: pointer;
}


/* Tooltip container */
.XS_Tooltip {
    position: relative;
    margin-top:2px;
}

.XS_Tooltip::before {
    font-size:11px;
    font-family:verdana,sans-serif;
    font-weight:bold;
    color:#A0A0A0;
    content:'\003F';
    cursor:pointer;
    padding-left: 2px;

 }


  /* Tooltip text */
.XS_Tooltip .XS_Tooltiptext {
    visibility: hidden;
    width:auto;
    min-width: 160px;
    max-width: 320px;
    background-color: #fffae8;
    color: #555555;
    text-align: center;
    padding: 5px;
    border:1px #cccccc solid;
    border-radius: 6px;
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.20), 4px 4px 4px rgba(0, 0, 0, 0.19);

    /* Position the tooltip text - see examples below! */
    position: absolute;
    z-index: 10100;
    bottom: 0%;
    left: 50%;

}


  /* Show the tooltip text when you mouse over the tooltip container */
.XS_Tooltip:hover .XS_Tooltiptext {
    visibility: visible;
}


.action_font{
    font-family:verdana,sans-serif;
    font-size:12px;
    font-weight:bold;
    color:#555555;
    cursor:pointer;
}