/*--------------------------------------------------------------
Printer css
--------------------------------------------------------------*/
/*--------------------------------------------------------------
Web fonts (Try not to use web font on global body or p elements)
--------------------------------------------------------------*/
/******** Server hosted web fonts *********/
/*--------------------------------------------------------------
LESS Variables
--------------------------------------------------------------*/
/*--------------------------------------------------------------
LESS helpers
--------------------------------------------------------------*/
.clearfix {
  *zoom: 1;
}
.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
  line-height: 0;
}
.clearfix:after {
  clear: both;
}
@media print {
  #top-header {
    display: none;
  }
}
.print label,
.print label span {
  font-size: 12pt;
}
.print label.text {
  width: auto;
  background: white;
}
.print input[type="text"],
.print input[type="password"],
.print input[type="datetime"],
.print input[type="datetime-local"],
.print input[type="date"],
.print input[type="month"],
.print input[type="time"],
.print input[type="week"],
.print input[type="number"],
.print input[type="email"],
.print input[type="url"],
.print input[type="search"],
.print input[type="tel"],
.print input[type="color"],
.print textarea {
  color: black;
  background: none;
  border: none;
  border-bottom: 1px solid black;
  border-radius: 0;
  box-shadow: none;
  width: 100%;
}
.print select,
.print textarea,
.print input[type="text"],
.print input[type="password"],
.print input[type="datetime"],
.print input[type="datetime-local"],
.print input[type="date"],
.print input[type="month"],
.print input[type="time"],
.print input[type="week"],
.print input[type="number"],
.print input[type="email"],
.print input[type="url"],
.print input[type="search"],
.print input[type="tel"],
.print input[type="color"],
.print .uneditable-input {
  margin-bottom: 0;
  height: 1.6em;
}
.print .radio.inline,
.print .checkbox.inline {
  padding-top: 0;
}
.print .radio-padding,
.print .checkbox-padding,
.print .dropdown-padding {
  padding: 2.5pt 0;
}
.print .disabled,
.print input[disabled],
.print select[disabled],
.print textarea[disabled],
.print input[readonly],
.print select[readonly],
.print textarea[readonly] {
  color: black;
}
.print input[type="radio"][disabled],
.print input[type="checkbox"][disabled],
.print input[type="radio"][readonly],
.print input[type="checkbox"][readonly] {
  background-color: black;
}
.print .field {
  height: 44px;
  height: auto;
  min-height: 44px;
}
.a4 {
  width: 21cm;
  padding: 1cm;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
}
#layoutbuilder-container .a4:after {
  content: "列印排版";
  color: #bbb;
  position: absolute;
  top: 10px;
  left: 10px;
}
#print-control {
  overflow: hidden;
  margin: 0 0 20px;
  padding: 1.2cm 1cm 1cm;
  min-height: 12.4cm;
}
#print-preview {
  overflow: hidden;
  margin: 20px auto 20px;
}
.header-image {
  margin: 0 0 6pt 0;
}
#layoutbuilder-container {
  position: relative;
  min-height: 400px;
  height: auto !important;
  height: 400px;
}
#layoutbuilder-container .btn {
  margin-right: .5em;
}
#layoutbuilder-container form {
  position: relative;
}
#layoutbuilder-toolbox {
  position: absolute;
  top: 0;
  left: 0;
}
#layoutbuilder-toolbox .content ul.fields {
  padding: 8px 0;
  margin: 0;
  overflow: hidden;
}
#layoutbuilder-toolbox .content ul.fields li {
  float: left;
  list-style: none;
  padding: 0;
  margin: 0 0 10px 8px;
}
#layoutbuilder-toolbox .content ul.fields li a {
  text-align: left;
  text-decoration: none;
  width: 73px;
  font-size: 11px;
}
#layoutbuilder-toolbox .content ul.fields li a i {
  margin-right: 5px;
}
#layoutbuilder {
  margin: 0;
  padding: 0;
  /* plugin jQuery sortable - target position placeholder element */
  /* plugin jQuery sortable - dragging element */
}
#layoutbuilder li.field.size1 {
  width: 10%;
}
#layoutbuilder li.field.size2 {
  width: 20%;
}
#layoutbuilder li.field.size3 {
  width: 30%;
}
#layoutbuilder li.field.size4 {
  width: 40%;
}
#layoutbuilder li.field.size5 {
  width: 50%;
}
#layoutbuilder li.field.size6 {
  width: 60%;
}
#layoutbuilder li.field.size7 {
  width: 70%;
}
#layoutbuilder li.field.size8 {
  width: 80%;
}
#layoutbuilder li.field.size9 {
  width: 90%;
}
#layoutbuilder li.field.size10 {
  width: 100%;
}
#layoutbuilder li.field {
  box-sizing: border-box;
  padding: 0;
  margin: 0 0 0;
  list-style: none;
  width: 50%;
  float: left;
  cursor: move;
}
#layoutbuilder li.field label {
  cursor: move;
}
#layoutbuilder li.field.active .field-box .content,
#layoutbuilder li.field.selected .field-box .content {
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
  border-radius: 0;
}
#layoutbuilder li.field.active .field-box .control-buttons,
#layoutbuilder li.field.selected .field-box .control-buttons {
  display: block;
  opacity: 1;
}
#layoutbuilder li.field .field-box {
  position: relative;
  padding: .2em;
  margin-bottom: .2em;
}
#layoutbuilder li.field .field-box .content {
  border: 1px solid #fff;
  border-radius: 4px;
  overflow: hidden;
}
#layoutbuilder li.field .field-box .content .live-preview label {
  width: auto;
  display: inline-block;
  *display: inline;
  /* IE7 inline-block hack */
  *zoom: 1;
}
#layoutbuilder li.field .field-box .content .live-preview .radio,
#layoutbuilder li.field .field-box .content .live-preview .checkbox {
  margin-bottom: 5px;
}
#layoutbuilder li.field .field-box .control-buttons {
  display: none;
  opacity: 0;
  position: absolute;
  top: -22px;
  left: 2px;
}
#layoutbuilder li.field .field-box .control-buttons a {
  margin: 0 5px 10px 8px;
  width: 30px;
  padding: 2px 0;
  text-align: center;
}
#layoutbuilder li.field .field-box .control-buttons a i {
  font-size: 14px;
}
#layoutbuilder .sortable-placeholder {
  padding: 0;
  margin: 0 0 10px;
  list-style: none;
  box-sizing: border-box;
  width: 49%;
  float: left;
  background: #f1f1f1;
  border: 2px dashed #ccc;
  min-height: 50px;
  height: auto !important;
  height: 50px;
}
#layoutbuilder .sortable-dragging {
  opacity: .8;
  border: 2px dashed #ccc;
}
