body {
  font-family: 'LatoWeb';
  background: #e5e6e6;
}

.fa-btn {
  margin-right: 6px;
}

/* https://paulund.co.uk/creating-different-css3-box-shadows-effects */
.letter {
  position: relative;
  margin-bottom: 24px;
  padding: 10px;
  background-color: #ffffff;
  color: #313534;
  border-radius: 2px;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.33);
}
.letter:before, .letter:after
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  box-shadow: 0 15px 10px #777;
  transform: rotate(-3deg);
}
.letter:after
{
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}

.print-size {
  font-size: 11px;
  padding: 0.6cm;
}

table.extra-condensed tr td {
  padding: 0;
}

.A4.portrait {
  width: 21cm;
  height: 29.7cm;
}

.A4.landscape {
  width: 29.7cm;
  height: 21cm;
}

.A5.landscape {
  width: 21cm;
  height: 14.85cm;
}

.A5.portrait {
  width: 14.85cm;
  height: 21cm;
}

table.table-print-head td, table.table-print-head th  {
  padding: 2px 4px;
}

table.sign {
  position: absolute;
  bottom: 0;
  left: 0;
  margin: 0 0 6mm 0;
}

table.sign thead th {
  padding-bottom: 9mm;
  border: none;
  font-weight: normal;
}

table.sign tbody td {
  padding: 0;
  border: none;
}
table.sign tbody td div {
  padding: 5px;
  margin: 0 auto;
  width: 4cm;
  border-top: 1px solid #000;
}

@media print {
  .no-print, .no-print * {
    display: none;
  }
  body {
    margin: 0;
    padding: 0;
  }
  .print-size {
    margin: 0;
  }
  .container, .row {
    width: 100%;
  }
}
@page {
  size: A4 portrait;
}

.input-group-addon.lang-code {
  font-family: Consolas, monospace;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.padding-sm {
  padding: 2px;
  border: 0;
  height: auto;
  min-width: 80px;
}

/* Ribbons */
.rb {
  width: 85px;
  height: 88px;
  overflow: hidden;
  position: absolute;
  top: -3px;
}
.rb-left { left: -3px; right: auto; }
.rb-right { left: auto; right: -3px; }

.rb > div {
  font: bold 15px Sans-Serif;
  text-align: center;
  position: relative;
  padding: 7px 0;
  width: 120px;
  top: 15px;
  -webkit-box-shadow: 0 0 3px rgba(0,0,0,0.3);
  -moz-box-shadow:    0 0 3px rgba(0,0,0,0.3);
  box-shadow:         0 0 3px rgba(0,0,0,0.3);
}
.rb-left > div {
  left: -30px;
  -webkit-transform: rotate(-45deg);
  -moz-transform:    rotate(-45deg);
  -ms-transform:     rotate(-45deg);
  -o-transform:      rotate(-45deg);
  transform:      rotate(-45deg);
}
.rb-right > div {
  left: -5px;
  -webkit-transform: rotate(45deg);
  -moz-transform:    rotate(45deg);
  -ms-transform:     rotate(45deg);
  -o-transform:      rotate(45deg);
  transform:      rotate(45deg);
}
.rb > div:before, .rb > div:after {
  content: "";
}
.rb > div:before, .rb > div:after {
  border-top:   3px solid #6e8900;
  border-left:  3px solid transparent;
  border-right: 3px solid transparent;
  position:absolute;
  bottom: -3px;
}
.rb > div:before { left: 0; }
.rb > div:after { right: 0; }
.rb-green > div {
  background-color: #bfdc7a;
  background-image: linear-gradient(#bfdc7a, #8ebf45);
  color: #6a6340;
  text-shadow: rgba(255,255,255,0.5) 0px 1px 0px;
}
.rb-green > div:before, .rb-green > div:after {
  border-top:   3px solid #6e8900;
}
.rb-blue > div {
  background-color: #bf7adc;
  background-image: linear-gradient(#bf7adc, #8e45bf);
  color: #f0f0f0;
  text-shadow: rgba(0,0,0,0.5) 0px 1px 0px;
}
.rb-blue > div:before, .rb-blue > div:after {
  border-top:   3px solid #6e0089;
}
.rb-red > div {
  background-color: #e43;
  background-image: linear-gradient(#e43, #e86);
  color: #f0f0f0;
  text-shadow: rgba(0,0,0,0.5) 0px 1px 0px;
}
.rb-red > div:before, .rb-red > div:after {
  border-top: 3px solid #995e00;
}

@media print {
  .rb, .rb * { display: none; }
}

/* Colors */

.cr-white     { background-color: #f0f0f0; color: #444; }
.cr-black     { background-color: #333; }
.cr-grey      { background-color: #999; }
.cr-blue      { background-color: #39d; }
.cr-green     { background-color: #2c7; }
.cr-turquoise { background-color: #1b9; }
.cr-purple    { background-color: #95b; }
.cr-red       { background-color: #e43; }
.cr-orange    { background-color: #e82; }
.cr-yellow    { background-color: #ec0; }


/*
Datatables
*/
table.dataTable thead {
  border: none;
}
table.dataTable thead th {
  border: none;
  border-right: 1px solid rgba(0,0,0,0.1);
}
table.dataTable tbody td {
  border: none;
  border-top: 1px solid rgba(0,0,0,0.05);;
  border-right: 1px solid rgba(0,0,0,0.05);
}
table.dataTable thead th:last-child {
  border-right: none;
  width: max-content;
}
table.dataTable thead .sorting:before, table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:before, table.dataTable thead .sorting_desc_disabled:after {
  bottom: 0.4em;
}
.dataTables_wrapper .search {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}
.dataTables_wrapper .search input {
  background: #f0f0f0;
  width: 250px !important;
}
.dataTables_wrapper .search .dt-buttons button {
  border: 1px solid transparent;
  border-bottom: none;
  background: transparent;
  z-index: 1000;
  margin: 0 1px;
  font-size: 17px;
  color: #777777;
}
.dataTables_wrapper .search .dt-buttons button:hover{
  color: #000000;
}
.dataTables_wrapper .letter .dataTables_paginate {
  text-align: center;
}
.dataTables_wrapper .letter .page-info {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #777777;
}