#body input.select.ui-autocomplete-loading, #body input.select.fixed.ui-autocomplete-loading {
  background-image: url(../images/autocomplete-loading.gif);
}

/* validation */

#address-validation-results {
  display: none;
}

#address-validation-ok-area {
  display: none;
}

#address-validation-candidates-area {
  display: none;
}

#address-validation-map-button {
  display: none;
}

#address-validation-results {
  /*padding-top: 40px;*/
  margin-top: 20px;
  margin-bottom: 40px;
}

#address-validation-alerts {
  padding-top: 20px;
  display: none;
}

#address-validation-alerts .alert strong {
  font-size: 17px;
  padding: 0 0 10px 0;
}

/*
.table thead th {
  background-color: #eeeeee;
  text-align: center;
}

.table thead th:first-child {
  background-color: transparent;
}

.table tbody td:first-child {
  font-weight: bold;
  background-color: #eeeeee;
}
*/

#address-validation-candidates-table thead th {
  font-weight: bold;
  background-color: #f5f5f5;
  font-size: 13px;
  color: #337ab7;
  text-align: center;
}
/*
#address-validation-candidates-table tbody td:first-child {
  font-weight: normal;
  background-color: transparent;
}
*/
#address-validation-candidates-table thead th:last-child {
  width: 1%;
}

#form-report-error {
  padding: 0 20px;
}

#form-report-error .form-group {
  margin-bottom: 5px;
}

.margin-r {
  margin-right: 10px;
  vertical-align: top;
  line-height: 18px;
}

#right_panels .panel:not(:last-child) {
  margin-bottom: 3px;
}

#right_panels .panel-body {
  padding-top: 5px;
  padding-bottom: 0px;
  padding-left: 2px;
  padding-right: 2px;
}

#right_panels .panel-body > label {
  color: #337ab7;
  font-weight: 400;
  padding-left: 5px;
  padding-right: 5px;
  cursor: pointer;
}

#right_panels .panel-body > label:hover {
  color: #23527c;
}

#right_panels label {
  margin-bottom: 0px;
}

#left_panels .panel-body {
  padding: 0px;
}

/*
#smart-div:before {
  display: block;
  width: 26px;
  height: 26px;
  content: "\e003";
  font-family: 'Glyphicons Halflings';
  font-size: 18px;
  position: absolute;
  top:10px;
  left:21px;
  z-index: 1000;
  color: #999;
  opacity: 0.7;
}
*/
#smart-div {
  position: relative;
}

#button-search {
  position: absolute;
  color: #ccc;
  opacity: 0.7;
  top: 1px;
  bottom: 1px;
  right: 0px;
  font-size: 22px;
  cursor: pointer;
  padding: 11px 7px;
}

#button-search:hover {
  color: #66afe9;
}

.button-clear {
  position: absolute;
  color: #ccc;
  opacity: 0.7;
  top: 1px;
  bottom: 1px;
  right: 1px;
  font-size: 12px;
  cursor: pointer;
  padding: 10px 4px;
}

.button-clear:hover {
  color: #66afe9;
}

#inputs-container .button_show_code {
  display: none;
}

#inputs-container.view-code.suggest-enabled .button_show_code {
  display: block;
  position: absolute;
  color: #ccc;
  opacity: 0.7;
  top: 1px;
  bottom: 1px;
  right: 21px;
  font-size: 12px;
  cursor: pointer;
  padding: 5px 1px;
  background-image: url(../images/js_code.png);
  background-repeat: no-repeat;
  background-size: 22px;
  background-position: center;
  width: 24px;
}

#inputs-container.view-code.suggest-enabled .button_show_code.selected {
  background-image: url(../images/js_code_selected.png);
}

#inputs-container.view-code.suggest-enabled .button_show_code:not(.selected):hover {
  /*background-color: #66afe9;*/
  background-image: url(../images/js_code_selected.png);
}

#smart-autocomplete {
  padding-left: 15px;
  padding-right: 60px;
}

#smart-autocomplete.ui-autocomplete-loading {
  background-position: right 35px center !important;
}
/*
#form-autocomplete input.ui-autocomplete-input {
  padding-right: 24px;
}

#form-autocomplete #inputs-container.suggest-enabled input.ui-autocomplete-input {
  padding-right: 35px;
  background-position: right 20px center !important;
}
*/
#form-autocomplete #inputs-container.suggest-enabled span.button-clear:not(.collapse) ~ input.ui-autocomplete-input {
  background-position: right 20px center !important;
  padding-right: 42px;
}
#form-autocomplete #inputs-container.suggest-enabled span.button-clear.collapse ~ input.ui-autocomplete-input {
  background-position: right center !important;
  padding-right: 24px;
}
/*
#form-autocomplete #inputs-container.view-code.suggest-enabled input.ui-autocomplete-input {
  padding-right: 48px;
}
*/
.double-input {
  width: 100%;
}

.double-input .has-float-label:first-child {
  width: 30%;
}
.double-input .has-float-label:first-child input {
  border-right-width: 0px;
}
.double-input .has-float-label:nth-child(2) {
  width: 70%;
}

.double-input .has-float-label:first-child input:focus {
  border-right-width: 1px;
}

hr.hr-3 {
  border-top-width: 3px;
}

.hidable-group {
  display: none;
}

.no-underline {
  text-decoration: none !important;
}

#div_collapse_sample {
  padding: 7px 15px;
}

#div_collapse_sample .collapsible-panel:after {
  font-family: 'Glyphicons Halflings';
  content: "\e114";
  float: right;
  /*color: #408080;*/
}

#div_collapse_sample .collapsible-panel.collapsed:after {
  content: "\e080";
}

#container_sample {
  border-top: 1px solid #efefef;
}

#container_sample_filter {
  padding: 5px 7px 0px 7px;
}

#container_sample_example {
  padding-top: 6px;
  padding-bottom: 6px;
  position: relative;
  height: 216px;
}
.container_test {
  width: 100%;
  /*max-height: 150px;*/
  height: 100%;
  /*min-height: 50px;*/
  overflow-y: auto;
  
  max-height: 420px;
}

.div_country {
  padding-left: 6px;
  padding-top: 2px;
  padding-bottom: 2px;
  padding-right: 10px;
  /*margin-right: 16px;*/
  cursor: pointer;
  /*width: 100%;*/
  height: 24px;
  
  display: -webkit-flex; /* Safari */
  display: flex;
}

.div_country:hover {
  background-color: #66afe9;
  font-weight: 700;
}

.div_flag {
  /*min-width: 30px;
  width: 10%;*/
  width: 20px;
  height: 20px;
  float: left;
  margin-right: 5px;
}

.div_flag img {
  width: 100%;
  vertical-align: baseline;
}

.div_flag span {
  font-size: 20px;
}

.div_description {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 13px;
  line-height: 20px;
  height: 20px;
  
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-flex: 1;  /* Safari 6.1+ */
      -ms-flex: 1;  /* IE 10 */    
          flex: 1;
}

#row_validation_address{
  display: flex;
  align-items: baseline;
}

input.ui-autocomplete-input[data-id]:not([data-id=""]) {
  color:red;
  background-color: #e5e5e5;
}

#filters {
  background-color: #fff;
  position: sticky;
  position: -webkit-sticky;
  top: 0px;
  padding-top: 10px;
  padding-bottom: 20px;
  z-index: 10;
}

#filters label {
  margin: 0px;
  position: absolute;
  right: 5px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 10px;
  z-index: 9;
}

.btn-filter {
  padding-left: 5px;
  padding-right: 35px;
}

#output-divs-container > div {
  margin-top: 20px;
}

.no-padding {
  padding: 0px;
}

table.no-margin-botton {
  margin-bottom: 0px;
}

table.no-margin-botton > *:last-child > tr:last-child td:last-child {
  border-bottom-right-radius: 3px;
}

table.no-margin-botton > *:last-child > tr:last-child td:first-child {
  border-bottom-left-radius: 3px;
}

#output-single table tbody tr td {
  text-align: center;
  padding: 15px;
}
#output-single table tbody tr td:first-child {
  display: none;
}

div.checkable table td:last-child, #output-custom table td:last-child {
  width: 40px;
  position: relative;
}

div.checkable table td:last-child label.el-switch, #output-custom table td:last-child label.el-switch {
  margin: 0px;
  position: absolute;
  right: 5px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 8px;
}

#output-custom table tr td:last-child button {
  opacity: 0;
  border: 0px;
  outline-width: 0px;
  color: #dd0000;
  padding: 0px;
  text-decoration: none;
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
}

#output-custom table tr:hover td:last-child button {
  opacity: 1;
}



#filter-top {
  background-color: #fff;
  position: sticky;
  position: -webkit-sticky;
  top: 0px;
  padding-top: 10px;
  padding-bottom: 20px;
  z-index: 10;
  display: flex;
}

.btn-show-filter-detail > div {
  color: #222;
  cursor: pointer;
  /*padding: 4px 8px 4px 8px;*/
  padding-top: 4px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.list-filters {
  margin-left: auto;
  margin-right: auto;
}
/*
.list-filters > div {
  display: inline-flex;
  padding: 4px 10px 4px 10px;
}
*/
.list-filters .div-filter {
  position: relative;
  /*color: #9d9d9d;*/
  display: inline-flex;
  padding: 4px 30px 4px 8px;
}

.list-filters .div-filter > div {
  color: #222;
  cursor: pointer;
  /*padding: 4px 8px 4px 8px;*/
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.list-filters .div-filter > div:hover {
  color: #ccc;
}

.list-filters .div-filter > label {
  margin: 0px;
  position: absolute;
  top: 50%;
  right: 3px;
  transform: translateY(-50%);
  font-size: 8px;
  z-index: 9;
}

.list-filters .div-filter.disabled > div {
  cursor: auto;
  color: #444;
  opacity: 0.6;
}

#leftSidenav .div-filter {
  position: relative;
  color: #9d9d9d;
  font-size: 22px;
}

#toggle-all {
  color: #9d9d9d;
  font-size: 22px;
}

#toggle-all > div {
  padding: 8px 0px;
  text-align: center;
  cursor: pointer;
}

#leftSidenav #div-filter-container {
  flex-grow: 1;
  overflow-y: auto;
}

#leftSidenav .div-filter:hover, #toggle-all:hover {
  color: #fff;
}

#leftSidenav .div-filter > div {
  padding: 8px 45px 8px 32px;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

#leftSidenav .div-filter.disabled > div {
  cursor: auto;
  color: #444;
  opacity: 0.6;
}

#leftSidenav .div-filter > label {
  margin: 0px;
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 10px;
  z-index: 9;
}

#leftSidenav {
  /*height: 100%;*/
  width: 0;
  position: fixed;
  z-index: 1000;
  top: 0px;
  bottom: 0px;
  left: 0px;
  background-color: #111;
  overflow-x: hidden;
  padding-top: 60px;
  display: flex;
  flex-direction: column;
}
#leftSidenav.open {
  width: 250px;
}

#leftSidenav a.closebtn {
  /*padding: 8px 8px 8px 32px;*/
  text-decoration: none;
  font-size: 25px;
  color: #818181;
  display: block;
  transition: 0.3s;
  
  position: absolute;
  top: 5px;
  right: 10px;
  font-size: 36px;
  
  line-height: 1;
}

#leftSidenav a.closebtn:hover {
  color: #f1f1f1;
}

@media (max-height: 550px) {
  #leftSidenav {
    padding-top: 30px;
  }
  
  #leftSidenav a.closebtn {
    font-size: 25px;
  }
  
  #leftSidenav .div-filter {
    font-size: 18px;
  }
  
  #toggle-all {
    font-size: 18px;
  }
  
  #toggle-all > div {
    padding: 3px 0px;
  }
  
  #leftSidenav .div-filter > div {
    padding-top: 6px;
    padding-bottom: 6px;
  }
}

.panel .panel-heading {
  color: #367db9;
  background-color: #f5f5f5;
  font-weight: bold;
  /*border-bottom-width: 0px;*/
  padding-top: 5px;
  padding-bottom: 5px;
}

#output-divs-container table tbody td:first-child {
  font-weight: bold;
  background-color: #f5f5f5;
  width: 25%;
  font-size: 11px;
  color: #337ab7;
}

#output-divs-container table tr td:nth-child(2) {
  padding-left: 10px;
  position: relative;
}

#output-divs-container .panel-body table tr:first-child td {
  border-top-width: 0px;
}

#output-divs-container table tr td.over {
  background-color: #ffff99;
}

#output-analyze table {
  table-layout: fixed;
}

#output-analyze table tr td:nth-child(3) {
  padding-left: 10px;
}

#output-analyze table tr td:not(:last-child), #output-analyze table tr th:not(:last-child) {
  border-right: 1px solid #ddd;
}

#output-analyze table thead th:first-child {
  width: 15%;
}

#output-analyze table thead th:not(:first-child) {
  text-align: center;
}

span.puntuaction {
  color: blue;
}

span.string.value {
  color: forestgreen;
}

span.string.key {
  color: red;
}

span.jsonRow.over {
  background-color: #ffff99;
}

div.jsonable .panel .panel-heading {
  position: relative
}

.openJson {
  width: 55px;
  height: 20px;
  position: absolute;
  /*right: 70px;*/
  right: 5px;
  cursor: pointer;
  background-image: url(../images/json.png);
  background-repeat: no-repeat;
  background-size: contain;
}

.openJson:hover {
  background-image: url(../images/json_over.png);
}

.openXml {
  width: 55px;
  height: 20px;
  position: absolute;
  right: 5px;
  cursor: pointer;
  background-image: url(../images/xml.png);
  background-repeat: no-repeat;
  background-size: contain;
}

.openXml:hover {
  background-image: url(../images/xml_over.png);
}

div.jsonable pre {
  position: relative;
}

div.jsonable pre .closeJson {
  position: absolute;
  top: 3px;
  right: 3px;
  padding: 2px;
  display: none;
  cursor: pointer
}

div.jsonable pre:hover .closeJson {
  display: block;
}

div.jsonable pre .closeJson:hover {
  color: #66afe9;
}

div.jsonable pre .copyJson {
  position: absolute;
  top: 3px;
  right: 25px;
  padding: 2px;
  display: none;
  cursor: pointer
}

div.jsonable pre:hover .copyJson {
  display: block;
}

div.jsonable pre .copyJson:hover {
  color: #66afe9;
}

#form_code .panel-body {
  padding: 0px;
  margin-bottom: 0px;
}

#form_code .panel.panel-default.with-nav-tabs {
  border-top-width: 0px;
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
}

#form_code .nav-tabs > li.active > a {
  border-bottom-color: #ddd;
}

#form_code pre {
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
}

#container_validation_example,
#container_suggest_example {
  padding-top: 6px;
  padding-bottom: 2px;
  position: relative;
  /*max-height: 816px;*/
  margin-bottom: 0px;
  border: 0px;
}

#validation_example > div,
#suggest_example > div {
  padding-bottom: 10px;
}
/*
#input-example pre {
  margin: 0px;
}
*/
#container_validation_example .closeJson,
#container_suggest_example .closeJson {
  position: absolute;
  top: 3px;
  right: 3px;
  padding: 2px;
  display: none;
  cursor: pointer
}

#container_validation_example:hover .closeJson,
#container_suggest_example:hover .closeJson {
  display: block;
}

#container_validation_example .closeJson:hover,
#container_suggest_example .closeJson:hover {
  color: #66afe9;
}

#container_validation_example .copyJson,
#container_suggest_example .copyJson {
  position: absolute;
  top: 3px;
  right: 25px;
  padding: 2px;
  display: none;
  cursor: pointer
}

#container_validation_example:hover .copyJson,
#container_suggest_example:hover .copyJson {
  display: block;
}

#container_validation_example .copyJson:hover,
#container_suggest_example .copyJson:hover {
  color: #66afe9;
}

td[data-check]:before {
  font-family: 'Glyphicons Halflings';
  position: absolute;
  left: -20px;
  display: none;
}

[data-check].check_valid:before {
  content: "\e013";
  display: block;
  color: forestgreen;
}

[data-check].check_warning:before {
  /*content: "\e107";*/
  content: "!";
  display: block;
  /*color: #f09000;*/
  /*color: #d9534f;*/
  color: crimson;
  
  font-weight: 900;
  font-size: 20px;
  line-height: 24px;
  top: 0px;
  text-indent: 5px;
}

#output-single td[data-check]:before {
  left: 5px;
}
#output-single td[data-check].check_warning:before {
  top: 10px;
}

#output-single table tr td:nth-child(2) {
  padding-left: 25px;
}

#p_credits > span {
  min-width: 4em;
  display: inline-block;
}

.navbar-brand {
  padding: 0.5rem;
  margin-left: 5px !important;
}

.navbar-brand > img {
  max-width: 100px;
}

.tokenize>.tokens-container {
  max-height: 138px;
  overflow-y: auto;
}
.tokenize>.tokens-container>.token {
/*.tokens-container li.token {*/
  border-width: 0px;
  border-radius: 50px;
  background-color: whitesmoke;
  color: #4a4a4a;
  display: inline-flex;
  flex-direction: row-reverse;
  height: 2em;
  align-items: center;
  font-size: 1rem;
  /*margin: 0.1rem;*/
  padding-right: 0.75rem;
  padding-left: 0.75rem;
  white-space: nowrap;
}

.tokenize>.tokens-container>.token.pending-delete {
  background-color: #2196f3;
}

.tokenize>.tokens-container>.token>.dismiss {
/*.tokens-container li.token > a.dismiss {*/
  height: 16px;
  max-height: 16px;
  max-width: 16px;
  min-height: 16px;
  min-width: 16px;
  width: 16px;
  margin-left: 0.55rem;
  margin-right: -0.575rem;
  background-color: rgba(10, 10, 10, 0.2);
  border: none;
  border-radius: 290486px;
  cursor: pointer;
  pointer-events: auto;
  display: inline-block;
  flex-grow: 0;
  flex-shrink: 0;
  font-size: 0;
  outline: none;
  position: relative;
  vertical-align: top;
}

.tokenize>.tokens-container>.token>.dismiss:after,
.tokenize>.tokens-container>.token>.dismiss:before {
  height: 50%;
  width: 2px;
  background-color: white;
  content: "7";
  display: block;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translateX(-50%) translateY(-50%) rotate(45deg);
  transform-origin: center center;
}

.tokenize>.tokens-container>.token>.dismiss:after {
  width: 50%;
  height: 2px;
}
.tokenize>.tokens-container>.token>.dismiss:before {
  height: 50%;
  width: 2px;
}

.tokenize:not(.focus) li.placeholder_visible {
  display: inline-block !important;
}
