button *
{
  pointer-events: none !important;
}

.__collapsed
{
  display:none;
}

.datacard-template-container
{
  display:none;
}

div.card-header
{
  padding: 10px;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 11pt;
  background-color: #ff4208;
  color: white;
}

table.data-card
{
  border-collapse:collapse;
}

.data-card
{
  font-family: Arial,Helvetica,sans-serif;
  font-size: 10pt;
}

.data-card input , .data-card textarea , .data-card select { border:1px solid #ff4208; padding: 8px; }

.data-card input[readonly] , .data-card textarea[readonly] { border:1px dashed #ff4208; }

.data-card input[readonly]:focus , .data-card textarea[readonly]:focus
{
  outline: none;
}

.data-card label
{
  color: #ff4208;
  white-space:nowrap;
  padding-right: 2px;
}

button.card-action
{
  cursor: pointer;
  border-radius: 12px;
  background-color: transparent;
  border: 1px solid #ff4208;
  padding: 12px;
  font-size:8pt;
  color: #ff4208;
}

button.card-action *
{
  pointer-events: none !important;
}

button.card-action.inverse
{
  background-color: #ff4208;
  color: white;
}

button.card-action:focus
{
  outline: none;
}

button.card-action:hover
{
  border-style: dashed;
}

button.card-action.inverse:hover
{
  border-style: dashed;
  background-color: transparent;
  color: #ff4208;
}



button.card-action i.fa
{
  vertical-align:middle;
  background-color: transparent;
  font-size:13pt;
}

button.card-refresh
{
  cursor:pointer;
  font-size:14pt;
  background-color: transparent;
  border: 1px solid transparent;
  color: #ff4208;
}

button.card-refresh:hover
{
  border: 1px dashed #ff4208;
}

button.card-refresh:focus
{
  outline:none;
}

.data-card i[data-error]
{
  visibility:hidden;
  font-size: 11pt;
  cursor: pointer;
  float:right;
  color:red;
}

.data-card i[data-error].align-right
{
  float:right;
}

/*.data-card tbody.detail td i.__error*/
.data-card td i.__error
{
  visibility:visible;
}

div[data-error]
{
  display:none;
}
div[data-error].__error
{
  display:block;
}

.data-card ._invalid
{
  border: solid 2px Red;
  color: Red;
}

i.fa.icon
{
  color: #ff4208;
  cursor: default;
}

i.fa.clickable
{
  cursor:pointer;
}

i.fa-spin._progress
{
  color:#ff4208;
  visibility:hidden;
}

.__busy i.fa-spin._progress
{
  visibility:visible;
}


.data-card div.http-service-error
{
  padding: 10px;
  vertical-align:middle;
}

.data-card div.http-service-error i.fa
{
  font-size: 18pt;
  color:red;
}

.data-card div.http-service-error span.http-status-code
{
  padding: 8px 4px 8px 14px;
  font-family: Arial,Helvetica,sans-serif;
}

.data-card div.http-service-error span.http-status-text
{
  font-family: Arial,Helvetica,sans-serif;
  padding:8px;
}

.data-card .tooltip
{
  position: relative;
  display: inline-block;
}

.data-card .tooltiptext
{
  font-family: Arial,Helvetica,sans-serif;
  border: 1px solid silver;
  visibility:hidden;
  background-color: white;
  color: black;
  padding: 8px;
  position: absolute;
  z-index: 1;
  top: -8px;
  left: -10px;
  white-space: nowrap;
  width: auto;
}
.data-card .tooltiptext:before
{
  padding-left: 0px;
  padding-right: 8px;
  color: red;
  font-family: FontAwesome;
  content: "\f071 ";
}

/*
.data-card .tooltiptext:after
{
  padding: 4px;
  color: red;
  font-family: FontAwesome;
  content: "\f12a ";
}
*/
.data-card .tooltiptext .inverse
{
  border: 1px solid black;
  background-color: white;
  color: #ff4208;
}

.data-card .tooltip:hover .tooltiptext
{
  visibility: visible;
}

.data-card button._action
{
  cursor:pointer;
  vertical-align:middle;
  border: none;
  font-size:8pt;
  background-color: #ff4208;
  color: white;
}

.data-card button._action i.fa
{
  font-size:14pt;
}

button.button-small
{
  cursor: pointer;
  background-color: transparent;
  border: 1px solid #ff4208;
  padding: 3px;
  font-size:8pt;
  color: black;
}
button.button-small:hover
{
  border: 1px dashed #ff4208;
  color: #ff4208;
}
button.button-small:focus
{
  outline: none;
}


button.button-link
{
  cursor: pointer;
  background-color: transparent;
  border: 1px solid transparent;
  padding: 8px;
  font-size:8pt;
  color: #ff4208;
}
button.button-link.small
{
  padding: 4px;
  font-size:8pt;
}
button.button-link:hover
{
  border: 1px dashed #ff4208;
  background-color: #ff4208;
  color: white;
}
button.button-link:focus
{
  outline: none;
}
button.button-link:disabled
{
  cursor:default;
  background-color:transparent;
  color: silver;
}

span.link:not(:empty)
{
  cursor: pointer;
  border: 1px solid transparent;
  padding: 2px;
  color: #ff4208;
}
span.link:not(:empty):hover
{
  border: 1px dashed #ff4208;
}
span.link:not(:empty):before
{
  font-family: FontAwesome;
  content: "\f0C1\00a0";
}

span.pound:not(:empty):before
{
  content: "£"
}

span.brackets:not(:empty):before
{
  color:dimgrey;
  content: "("
}
span.brackets:not(:empty):after
{
  color:dimgrey;
  content: ")"
}

span.s_brackets:not(:empty):before
{
  color:dimgrey;
  content: "["
}
span.s_brackets:not(:empty):after
{
  color:dimgrey;
  content: "]"
}

span[data-bit="1"]:before
{
  font-family: FontAwesome;
  content: "\00a0\f00C\00a0";
}

span.feet:not(:empty):after
{
  vertical-align:super;
  font-size:smaller;
  content: "ft"
}

span.inches:not(:empty):after
{
  vertical-align:super;
  font-size:smaller;
  content: "in"
}


/*
span.__placeholder:empty:before
{
  font-family: FontAwesome;
  content: "\00a0\f111\00a0";
}
*/

.data-card i.errortip
{
  visibility: hidden;
  position:relative;
  font-size: 11pt;
  cursor:default;
  color:red;
}

.data-card i.errortip[data-error]
{
  visibility:visible;
}

.data-card i.errortip[data-error]:hover:after
{
  content: "\f071 ";
  color: red;
  background-color: white;
  font-family: FontAwesome;
  z-index: 1;
  padding: 12px 0px 12px 12px;
  position: absolute;
  border: 1px solid black;
  border-right: none;
  left: -28px;
  top: -20px;
}

.data-card i.errortip[data-error]:hover:before
{
  content: attr( data-error );
  font-family: Arial,Helvetica,sans-serif;
  font-size: smaller;
  border: 1px solid black;
  border-left: none;
  background-color: white;
  color: black;
  padding: 13px 13px 13px 8px;
  position: absolute;
  white-space: nowrap;
  z-index: 1;
  width: auto;
  left: 0px;
  top: -20px;
}

div.bounded , table.bounded
{
  border: 1px solid #ff4208 !important;
}

div.section-header
{
  padding: 10px;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 14pt;
  background-color: #ff4208;
  color: white;
}

.__draggable
{
  cursor:move;
}

div.result
{
  padding:8px;
  font-family: Arial,Helvetica,sans-serif;
  font-weight: bold;
  font-size: 10pt;
  white-space:nowrap;
  color: #ff4208;
}