html {
  height: 100%;
  box-sizing: border-box;
}

body {
  background-color: #eee;
  font-family: "Roboto",Arial,Helvetica,sans-serif;
  position: relative;
  margin: 0;
  padding-bottom: 6rem;
  min-height: 100%;
}

h3 {
  background-color: #333;
  padding: 15px 10px;
  color: #fff;
}

thead {
  background-color: #eee;
}

.table>thead>tr>th {
  background-color: #eee;
}

.progress {
  margin-top: 10px;
}

.gallery
{
    margin-top: 20px;
}

.close-icon {
  border-radius: 50%;
  position: absolute;
  right: 5px;
  top: -10px;
  padding: 3px 5px;
  font-size: 10px;
}

.gallery-image {
  position: relative;
}

.gallery-image .fas {
  font-size: 48px;
}

.form-image-upload{
  background: #e8e8e8 none repeat scroll 0 0;
  padding: 15px;
}

.search-production-table thead tr th {
  /*padding: 30px 10px;*/
}

th.stone-header {
  margin: 0;
  padding: 0 !important;
  border-bottom: 0 !important;
}

.stone-header h3 {
  margin-bottom: 0;
}

th.rotate {
  height:70px;
  width: 30px;
  white-space: nowrap;
  position:relative;
}

th.rotate > div {
  transform: rotate(-90deg);
  position:absolute;
  left:0;
  right:0;
  top: 35px;
  text-align: center;
  margin:auto;
}

@media (min-width: 768px) {
  .navbar {
    padding: 20px;
  }
}

.row-bottom-buffer {
  margin-bottom: 25px;
}
.navbar-brand {
  padding: 0px;
}
.navbar-brand>img {
  height: 100%;
  padding: 7px 15px;
  width: auto;
}


.form-signin, .form-signup {
  max-width: 330px;
  padding: 15px;
  margin: 0 auto;
}
.form-signin .form-signin-heading, .form-signup .form-signup-heading,
.form-signin .checkbox, .form-signup .checkbox {
  margin-bottom: 10px;
}
.form-signin .checkbox, .form-signup .checkbox{
  font-weight: normal;
}
.form-signin .form-control, .form-signup .form-control {
  position: relative;
  font-size: 16px;
  height: auto;
  padding: 10px;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
.form-signin .form-control:focus, .form-signup .form-control:focus {
  z-index: 2;
}
.form-signin input[type="text"], .form-signup input[type="text"] {
  margin-bottom: -1px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.form-signin input[type="password"], .form-signup input[type="password"] {
  margin-bottom: 10px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.form-signin .btn, .form-signup .btn  {
  margin-bottom: 10px;
}

.btn-submit {
  margin-left: 5px;
}

.input-number {
  text-align: center;
  min-width: 45px;
}

.readynumber {
  font-size: 16px;
  margin-right: 10px;
}

.remainingnumber {
  text-align: center;
  font-size: 15px;
}

.remainingamount {
  font-size: 12px;
}


.color-picker-wrap li {
  list-style: none;
}

.color-picker-wrap ul {
  width: 100%;
  padding: 0;
  display: inline-block;
  margin-bottom: 0;
}

.color-picker-wrap li {
  border: 1px dotted #333333;
  position: relative;
  float: left;
  width: 32px;
  height: 32px;
  margin: 2px 1px 0 0;
  background: #000;
  cursor: pointer;
  filter: alpha(opacity=70);
  opacity: .5;
  -webkit-transition: opacity .2s;
  -moz-transition: opacity .2s;
  -ms-transition: opacity .2s;
  -o-transition: opacity .2s;
  transition: opacity .2s;
}

.color-picker-wrap li:hover {
  filter: alpha(opacity=100);
  opacity: 1
}

.color-picker-wrap li.active {
  height: 36px;
  margin-top: 0;
  filter: alpha(opacity=100);
  opacity: 1;
  border-style: solid;
}

.color-picker-wrap li.add_new {
  background: #fff;
  border: 1px dotted #333333;
  text-align: center;
  line-height: 32px;
  font-size: 24px;
}

.color-picker-wrap.cp-sm li {
  width: 24px;
  height: 24px;
}

.color-picker-wrap.cp-sm li.active {
  height: 28px;
}

.color-picker-wrap.cp-sm li.add_new {
  line-height: 24px;
  font-size: 16px;
}

.color-picker-wrap.cp-lg li {
  width: 48px;
  height: 48px;
}

.color-picker-wrap.cp-lg li.active {
  height: 52px;
}

.color-picker-wrap.cp-lg li.add_new {
  line-height: 48px;
  font-size: 40px;
}

.color-picker-wrap .color-picker {
  display: none;
}



footer {
  font-size: .9em;
  margin-top: 25px;
  text-align: center;
  padding: 15px;
  color: #eee;
  background-color: #222222;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
}


.gi-2x{font-size: 2em;}
.gi-3x{font-size: 3em;}
.gi-4x{font-size: 4em;}
.gi-5x{font-size: 5em;}

.stripe {
  background-color: #f9f9f9;
}


@media only print {

  @page {
    /*size: 330mm 427mm;
    margin: 14mm;*/

  }
  .container {
    /*width: 1170px;*/
  }
  .date-block {
    background-color: #ccc;
    border-style: solid;
    border-width: 5px 5px 0px 5px;
    border-color: #000000;
  }
  .new-date {
    border-top: 5px solid #000000;
  }
}