@CHARSET "UTF-8";

.text-mobile-normal {
  font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Roboto", "Ubuntu", "Helvetica Neue", sans-serif;
  font-size: small;            /*  xx-small ; x-small ; small ; medium ; large ; x-large ; xx-large  */
  font-weight: normal;
}

.text-mobile-small {
  font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Roboto", "Ubuntu", "Helvetica Neue", sans-serif;
  font-size: x-small;            /*  xx-small ; x-small ; small ; medium ; large ; x-large ; xx-large  */
  font-weight: normal;
}

.text-mobile-light {
  font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Roboto", "Ubuntu", "Helvetica Neue", sans-serif;
  font-size: xx-small;            /*  xx-small ; x-small ; small ; medium ; large ; x-large ; xx-large  */
  font-weight: normal;
}

.text-mobile {
  font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Roboto", "Ubuntu", "Helvetica Neue", sans-serif;
  font-size: xx-small;            /*  xx-small ; x-small ; small ; medium ; large ; x-large ; xx-large  */
  font-weight: bold;
}

.g3chat1 {
  font-size: xx-small;
  border-radius: 5px;
  margin-left: 6px;
  margin-right: 6px;
  padding: 6px;
  max-width: 96%;
  background-color: #e4e4e4;
  box-shadow: #989898 3px 3px 3px;
}

.g3chat2 {
  font-size: xx-small;
  border-radius: 5px;
  margin-left: 6px;
  margin-right: 6px;
  padding: 6px;
  max-width: 96%;
  background-color: #bebebe;
  box-shadow: #989898 3px 3px 3px;
}

.upcase input {
  text-transform: uppercase;
  &::placeholder {  /* Recent browsers */
    text-transform: none;
  }
  &:-moz-placeholder {  /* Mozilla Firefox 4 to 18 */
    text-transform: none;
  }
  &::-moz-placeholder {  /* Mozilla Firefox 19+ */
    text-transform: none;
  }
  &::-webkit-input-placeholder {  /* WebKit browsers */
    text-transform: none;
  }
}

p {
    font-family:Arial, Helvetica, sans-serif;
}

.image-zoom {
  overflow: hidden;
  margin: 0 auto;
}

.image-zoom img {
  width: 100%;
  transition: 0.2s all ease-in-out;
}

.image-zoom:hover img {
  transform: scale(1.5);
}

.zoom {
  transition: transform .2s;
  margin: 0 auto;
}

.zoom:hover {
  transform: scale(1.2);
}

.zoom2 {
  transition: transform .2s;
  margin: 0 auto;
}

.zoom2:hover {
  transform: scale(1.4);
}

.superavatar {
  vertical-align: middle;
  width: 64px;
  height: 64px;
  border-radius: 30%;
  border-width: 2px 2px 2px 2px;
  border-style: solid;
  border-color: #ffffff;
}

img.ca35 {
  opacity:0.35;
  -moz-opacity: 0.35;
  filter: alpha(opacity=35);
}

img.ca50 {
  opacity:0.50;
  -moz-opacity: 0.50;
  filter: alpha(opacity=50);
}

img.ca75 {
  opacity:0.75;
  -moz-opacity: 0.75;
  filter: alpha(opacity=75);
}

.paginate {
  font-size: 14px;
  font-family: Arial, Helvetica, sans-serif;
}

a.paginate {
  border: 1px solid #607D8B;
  border-radius: 6px;
  padding: 2px 6px 2px 6px;
  margin-left: 3px;
  margin-bottom: 3px;
  text-decoration: none;
  color: #607D8B;
}

a.paginate:hover {
  background-color: #607D8B;
  text-decoration: underline;
  color: #FFF;
}

a.current {
  border: 1px solid #607D8B;
  border-radius: 6px;
  padding: 2px 6px 2px 6px;
  margin-left: 3px;
  margin-bottom: 3px;
  text-decoration: none;
  color: #FFF;
  background:#607D8B;
  font-size: 14px;
  font-family: Arial, Helvetica, sans-serif;
  cursor: default;
}

span.inactive {
  border: 1px solid #999;
  border-radius: 6px;
  padding: 2px 6px 2px 6px;
  margin-left: 3px;
  margin-bottom: 3px;
  color: #999;
  font-size: 14px;
  font-family: Arial, Helvetica, sans-serif;
  cursor: default;
}

.whatsapp-float {
  position: fixed;
  width: 32px;
  height: 32px;
  bottom: 20px;
  left: 20px;
  background-image: url('../logos/logo_whatsapp.jpg');
  background-repeat: no-repeat;
  background-size: 32px 32px;
  background-color: #25d366;
  opacity:0.75;
  -moz-opacity: 0.75;
  filter: alpha(opacity=75);
  border-radius: 10px;
  box-shadow: 2px 2px 3px #999;
  z-index: 100;
}

@media print {
   .no-print {
      display: none !important;
      visibility: hidden;
   }
}

#my2BotBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  left: 20px;
  z-index: 99;
  font-family: Verdana;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  border: none;
  outline: none;
  background-color: #555;
  color: white;
  cursor: pointer;
  padding: 7px;
  border-radius: 4px;
  opacity: 0.50;
  filter: alpha(opacity=50);
  -moz-opacity: 0.50;
}

#my2BotBtn:hover {
  background-color: red;
}

#my2TopBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  left: 50px;
  z-index: 99;
  font-family: Verdana;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  border: none;
  outline: none;
  background-color: #555;
  color: white;
  cursor: pointer;
  padding: 7px;
  border-radius: 4px;
  opacity: 0.50;
  filter: alpha(opacity=50);
  -moz-opacity: 0.50;
  -moz-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

#my2TopBtn:hover {
  background-color: red;
}

.barcode {
  overflow: hidden;
  height: 50px;
}

.barcode div {
  display: inline-block;
  height: 100px;
}

.barcode .black {
  border-color: #000;
  border-left-style: solid;
  width: 0px;
}

.barcode .white {
  background: #fff;
}

.barcode .thin.black {
  border-left-width: 1px;
}

.barcode .large.black {
  border-left-width: 3px;
}

.barcode .thin.white {
  width: 1px;
}

.barcode .large.white {
  width: 3px;
}