$font-size-print: 7pt;
$font-size-header-print: 8pt;
$font-size-screen: 14px;
$font-size-header-screen: 16px;
$main-bordercolor: #8c8c8c;
$main-headercolor: #e6e6e6;
$font-family:Cordia New;

@mixin setBlock(){
  display: block !important;
  width: 100% !important;
  float: left !important;
}
@mixin setBlockW($w){
  display: block !important;
  width: $w !important;
  float: left !important;
}

#print-block{
  @include setBlock();
  border: 2px solid #000;
  padding-bottom: 20px;
}
.myblock{
  @include setBlock();
}
.header-zone{
  @include setBlock();
  padding-top: 20px !important;
  padding-bottom: 5px !important;
}
.header-print{
  @include setBlockW(75%);
  font-size: 20px !important;
  text-align: center;
}
.sub-header-print{
  @include setBlockW(75%);
  font-size: 16px !important;
  text-align: center;
}
.logo{
  @include setBlockW(15%);
}

.logo img{
  padding-left: 20px !important;
}
.detail-header{
  @include setBlock();
  margin-top: 5px !important;
}
.detail-header .warning-word{
  font-size: 16px !important;
  text-decoration: underline !important;
  font-style: italic !important;
}
.detail-header .date{
  float:rigt !important;
  text-align: right !important;
}
.btn-print{
  visibility: visible !important;
}
.underline{
  @include setBlock();
  border-bottom: 2px solid #000 !important;
}
.underline.padding{
  margin-top: 7px !important;
  margin-bottom: 10px !important;
}
.body-zone{
  @include setBlock();
  // padding: 5px !important;
  padding-top: 20px !important;
  font-size: $font-size-screen !important;
}
.body-header{
  @include setBlockW(80%);
}
.body-photo{
  @include setBlockW(20%);
}

.fullwidth{
  width: 100% !important;
}
.label-block{
  @include setBlock();
  font-size: $font-size-screen !important;
}
.text-center{
  text-align: center !important;
}
.text-right{
  text-align: right !important;
}
.photo-block img{
  @include setBlock();
}

input.no-border{
  border-top: 0px !important;
  border-left: 0px !important;
  border-right: 0px !important;
  border-bottom: 1px inset $main-bordercolor !important;
}
input:disabled{
  background-color: #fff !important
}
input{
  font-size: $font-size-screen !important;
}

table.fulltable {
  width: 100%;
}
table.table-border{
  border: 1px solid $main-bordercolor !important;
}
table.tr-border tr{
  border: 1px solid $main-bordercolor !important;
}
table.td-border td{
  border: 1px solid $main-bordercolor !important;
}
table.th-border th{
  border: 1px solid $main-bordercolor !important;
}

.body-block{
  @include setBlock();
}
.body-block-85{
  @include setBlockW(85%);
}
.body-block-80{
  @include setBlockW(80%);
}
.body-block-75{
  @include setBlockW(75%);
}
.body-block-70{
  @include setBlockW(70%);
}
.body-block-30{
  @include setBlockW(30%);
}
.body-block-25{
  @include setBlockW(25%);
}
.body-block-20{
  @include setBlockW(20%);
}
.body-block-15{
  @include setBlockW(15%);
}
.body-block.padding-top{
  padding-top: 10px !important;
}
.body-block .header-block{
  @include setBlock();
  border-top: 1px solid $main-bordercolor !important;
  border-bottom: 1px solid $main-bordercolor !important;
  font-size: $font-size-header-screen !important;
  background-color: $main-headercolor !important;
}
.body-bg{
  background-color: $main-headercolor !important;
}
.body-block .header-block.margin-bottom{
  margin-bottom: 10px !important;
}

/* start customize Bootstrap*/
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12{
  padding-left: 5px !important;
  padding-right: 5px !important;
}
.row{
  margin-top: 5px !important;
  margin-left: 0px !important;
  margin-right: 0px !important;
}
/* end customize Bootstrap*/
@media print {
  @page {
    size: A4;
  }
  #print-block{
    @include setBlock();
    border: 2px solid #000 !important;
    padding-bottom: 10pt !important;
  }
  .header-zone{
    @include setBlock();
    // padding: 3pt !important;
    padding-top: 10pt !important;
    padding-bottom: 3pt !important;
  }
  .logo{
    @include setBlockW(20%);
  }
  .logo img{
    padding-left: 10pt !important;
    width: 100% !important;
    // height: 60pt !important;
  }
  .header-print{
    @include setBlockW(70%);
    font-size: 14pt !important;
    text-align: center !important;
  }
  .sub-header-print{
    @include setBlockW(70%);
    font-size: 10pt !important;
    text-align: center !important;
  }
  .detail-header{
    @include setBlock();
  }
  .detail-header .warning-word{
    @include setBlockW(60%);
    font-size: 10pt !important;
    text-decoration: underline !important;
    font-style: italic !important;
  }
  .detail-header .date{
    @include setBlockW(40%);
    font-size: $font-size-print !important;
  }
  .btn-print{
    visibility: hidden !important;
  }
  .underline{
    @include setBlock();
    border-bottom: 0.7pt solid #000 !important;
  }
  .underline.padding{
    margin-top: 3pt !important;
    margin-bottom: 5pt !important;
  }
  .body-zone{
    @include setBlock();
    // padding: 3pt !important;
    padding-top: 10pt !important;
    font-size: $font-size-print !important;
  }
  .body-header{
    @include setBlockW(80%);
  }
  .body-photo{
    @include setBlockW(20%);
  }
  .label-block{
    @include setBlock();
    font-size: $font-size-print !important;
  }
  .fullwidth{
    width: 100% !important;
  }
  .text-center{
    text-align: center !important;
  }
  .text-right{
    text-align: right !important;
  }
  .break-header {page-break-before: always;}
  .break-footer {page-break-after: always;}
  .page-border{
    border: 1px solid black;
    bottom: 0px;
    height: 1046px;
  }

  input.no-border{
    border-top: 0px !important;
    border-left: 0px !important;
    border-right: 0px !important;
    border-bottom: 1px inset #8c8c8c !important;
  }
  input:disabled{
    background-color: #fff !important
  }
  input{
    font-size: $font-size-print !important;
  }
  table.fulltable {
    width: 100%;
  }
  table.table-border{
    border: 1px solid $main-bordercolor !important;
  }
  table.tr-border tr{
    border: 1px solid $main-bordercolor !important;
  }
  table.td-border td{
    border: 1px solid $main-bordercolor !important;
  }
  table.th-border th{
    border: 1px solid $main-bordercolor !important;
  }

  .body-block{
    @include setBlock();
  }
  .body-block-85{
    @include setBlockW(85%);
  }
  .body-block-80{
    @include setBlockW(80%);
  }
  .body-block-75{
    @include setBlockW(75%);
  }
  .body-block-70{
    @include setBlockW(70%);
  }
  .body-block-50{
    @include setBlockW(50%);
  }
  .body-block-30{
    @include setBlockW(30%);
  }
  .body-block-25{
    @include setBlockW(25%);
  }
  .body-block-20{
    @include setBlockW(20%);
  }
  .body-block-15{
    @include setBlockW(15%);
  }
  .body-block.padding-top{
    padding-top: 5pt !important;
  }
  .body-block .header-block{
    @include setBlock();
    border-top: 0.7pt solid $main-bordercolor !important;
    border-bottom: 0.7pt solid $main-bordercolor !important;
    font-size: $font-size-header-print !important;
    background-color: $main-headercolor !important;
  }

  .body-block .header-block.margin-bottom{
    margin-bottom: 5pt !important;
  }

  /* start customize Bootstrap*/
  .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12{
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
  .row{
    margin-top: 5px !important;
    margin-left: 0px !important;
    margin-right: 0px !important;
  }
  /* end customize Bootstrap*/
}