:root {
	--blue-coincity: 		#005e8a;
	--blue-active: 		#023b56;
	--blue-light:			#5f8ca3;
	--orange-coincity: 	#ff731f;
	--gray-coincity: 		#f7f7f7;
	--red-coincity: 		#e74c3c;
	--transparent: 		rgba(0,0,0,0);
	--standby:			#2980b9;
	--active:				#27ae60;
	--inactive:			#c0392b;
  }
  
  
  
  .videos iframe{width: 100%;
	  height: 80vh;}
  
  header{	margin-top: 20px;}}
  
  
  html{
  }
  
  html,body{
	  /*background:url("../img/bg.jpg"); background-repeat: no-repeat; background-size: cover;position: relative;height: 100%;min-height: 100%;overflow: auto;*/
	  -moz-background-size: cover;
	  -webkit-background-size: cover;
	  -o-background-size: cover;
	  user-select: none;
  }
  
  .white{
	  background-color: #fff;
  }
  
  .menu-flotante{
	  position: absolute;
	  right: 0px;
	  top: 13%;
	  padding: 4px 4px 4px 4px;
	  width: 70px;
  }
  .menu-flotante .item-flotante{
	  margin-bottom: 4px;
  }
  
  .danger{
	  color: #e74c3c !important;
  }
  
  .warning{
	  color: #f39c12 !important;
  }
  
  
  footer{	background-color: var(--gray-coincity);background-size: 100% 100%;color: #fff;}
  
  footer .mapa{margin-left: 20px;}
  
  footer .footer-body{padding: 20px 20px 20px 20px;color: #fff;}
  
  footer .foot-title{font-size: 16px;font-weight: bold;color: #fd6a10;margin-bottom: 16px;}
  
  footer .foot-link a{font-size: 14px;color: #fff;}
  
  footer .foot-info{font-size: 14px;color: #fff;}
  
  footer .copyright{padding-bottom: 20px;}
  
  .space{width: 1vh;}
  
  .navbar { padding: 0 0 0 0; }
  
  #banner{
	  padding: 0 0 0 0;
  }
  nav img{cursor: pointer;}
  
  nav{background-color: var(--blue-coincity);}
  
  nav .search{
	  width: 30px;
	  height: 30px;
	  background: url("../../../includes/images/menu/icons/productos-b.png") no-repeat left center;
	  cursor: pointer;
  }
  
  nav .search:hover{
	  width: 30px;
	  height: 30px;
	  background: url("../../../includes/images/menu/icons/productos-n.png") no-repeat left center;
	  cursor: pointer;
  }
  
  .link{
	  cursor: pointer;
  }
  
  .menu-icon{
	  padding-left: 0px;
  }
  
  .submenu{
	  background-color: var(--transparent);
	  position: fixed;
  }
  .submenu .options{
	  padding: 0 0 0 0;
	  background-color: #fff;
	  border-left: solid;
	  border-width: 10px;
	  border-color: var(--orange-coincity);
	  background-color: var(--gray-coincity);
  }
  .submenu .options ul{
	  padding-left: 0px;
	  margin-bottom: 0px;
  }
  
  .submenu .options ul li{
	  padding: 4px 4px 4px 16px;
	  list-style: none;
  }
  
  
  .submenu .options ul li a:hover{
	  background-color: var(--orange-coincity);
	  color: #fff;
  }
  
  .submenu .options ul li a{
	  text-decoration: none;
	  color: var(--blue-coincity);
	  margin-right: 0px;
  }
  
  .box{margin-top: 25px;margin-bottom: 25px; }
  .box-thumb{position: relative;margin-bottom: 8px; height: 10rem; }
  .box-thumb-cat{position: relative;margin-bottom: 8px; height: 17rem;}
  .box-thumb-cat img{width: 100%;height:100%; border-style: solid;border-width: 0px; border-color: #000;
  -moz-box-shadow: inset 7px 7px 10px 0px rgba(124,121,116,0.5); border-radius: 5px;}
  .box-thumb img{width: 100%;height:100%; border-style: solid;border-width: 0px; border-color: #000;
  -moz-box-shadow: inset 7px 7px 10px 0px rgba(124,121,116,0.5); border-radius: 5px;}
  
  .box-resumen{}
  
  .box-titulo{font-weight: bold;color: #fff; border-radius: 5px; width:100%; top:40%;padding: 8px 8px 8px 8px;background-color: rgba(124,121,116,0.8);position: absolute; font-size: 12pt;}
  .box-descr{font-weight: bold;color: #fff; border-radius: 5px; width:100%; top:35%;padding: 12px 12px 12px 12px;background-color: rgba(124,121,116,0.8);position: absolute; font-size: 18pt;}
  .box-sku{color: #fff; width:100%; font-size: 8pt; font-style: italic; bottom:0px;margin-top:8px;text-align: right; padding: 8px 12px 2px 2px;position: absolute;}
  .box-modelo{color: #fff;}
  .box-precious{font-weight:bold;color: #fff;}
  .box-preciomx{font-size:18pt;right: 0px; top:0px;border-radius: 5px; padding: 4px 8px 4px 8px;margin:8px 8px 0px 0px;background-color: rgba(124,121,116,0.8);position: absolute;font-weight:bold;color: #fff;}
  .box-edit{font-size:18pt;left: 0px; width: 40px; border-radius: 5px; top:0px;margin:8px 0px 0px 8px;cursor:pointer;background-color: rgba(124,121,116,0.8);position: absolute;font-weight:bold;color: #fff;}
  .box-edit img{padding: 8px 8px 8px 8px;}
  
  .estatus-Borrador{
	  background-color: var(--standby);
	  text-align: center; 
	  border-radius: 4px;
	  margin-bottom: 4px;
  }
  
  .estatus-Activo{
	  background-color: var(--active);
	  text-align: center;
	  border-radius: 4px;
	  margin-bottom: 4px;
  }
  
  .estatus-Inactivo{
	  background-color: var(--inactive);
	  text-align: center;
	  border-radius: 4px;
	  margin-bottom: 4px;
  }
  
  .menu-lateral{
	  background-color: var(--blue-coincity);
	  position: fixed;
	  overflow: hidden; width: 100%; height: 100%;
	  
	  color: #fff;
	  padding: 0 0 0 0;
  
  }
  
  
  .venta{
	  /*background-color: #E7E5E3;*/
	  background-color: #FAF8F3;
	  position: fixed;
	  overflow: hidden; width: 100%; height: 100%;
	  color: #fff;
	  right: 0px;
  }
  .venta-usuario{
	  color: #000;
	  font-weight: bold;
	  margin-top: 4px;
	  margin-bottom: 8px;
  }
  
  .catalogo{
	  -webkit-touch-callout: none;
	  -webkit-user-select: none;
	  -khtml-user-select: none;
	  -moz-user-select: none;
	  -ms-user-select: none;
	  user-select: none;
  }
  .venta-control label{
	  color: #000;
  }
  
  .venta-controles{
	  margin-bottom: 8px;
  }
  .venta-detalle{
	  position: relative;
	  margin-bottom: 8px;
	  bottom: 1%;
  }
  
  .venta-button{
	  margin-top: 8px;
  }
  
  .venta-detalle .venta-imagen img{width: 100%;height: 100%;
  }
  
  
  
  
  .venta-agregar{
	  margin-bottom: 8px;
	  height: 10vh;
  }
  .venta-importe{
	  margin-bottom: 8px;
	  height: 5vh;
  }
  .venta-importe .input-group-text{
	  border-color: #000;
	  color: #fff;
	  background-color: #000 !important;
	  width: 100%;
	  margin-right: -16px;
  }
  
  .venta-importe .input-group-prepend{
	  padding-right: 0px;
  }
  
  
  .venta-total{
	  margin-bottom: 36px;
	  height: 5vh;
  }
  
  .venta-total .input-group-text{
	  border-color: #000;
	  color: #fff;
	  background-color: #000 !important;
	  width: 100%;
  }
  
  .venta-total .input-group-prepend{
	  padding-right: 0px;
  }
  
  .venta-ticket{
	  overflow: hidden;
	  margin-top: 10vh;
	  margin-bottom: 16px;
	  height: 35vh;
	  background-color: #fff;
	  color: #000;
	  margin: 0px -6px 0px -6px;
	  border-radius: 5px;
	  box-shadow: inset 4px 4px 30px 0 rgba(124,121,116,0.5);
  }
  
  table{
	  -webkit-touch-callout: none;
	  -webkit-user-select: none;
	  -khtml-user-select: none;
	  -moz-user-select: none;
	  -ms-user-select: none;
	  user-select: none;
  }
  
  .table th, .table td {
	  border-top: 0px;
  }
  
  
  .menu-lateral .profile-pic img{
	  padding: 26px 26px 0px 26px;
  }
  
  .menu-vertical{
	  background-color: #fff;
  }
  
  .menu-vertical .label{
		  
  }
  
  .menu-vertical .item:hover{
	  background-color: var(--blue-active);
	  color: #fff;
  }
  
  .menu-vertical .active{
	  background-color: #DEDDDE;
  
  }
  
  .menu-vertical .logo{
	  background-color:  var(--blue-coincity)
  }
  
  
  
  .menu-lateral .profile-name{color: #fff;text-align: center;font-weight: bold;font-size: 20px;}
  .menu-lateral .profile-role{color: #fff;text-align: center;font-style: italic;margin-bottom: 16px;}
  
  .menu-lateral .nav-item{color: #fff; padding: 0px 16px 0px 16px;}
  .menu-lateral .nav-item:hover{background-color: var(--orange-coincity);}
  .menu-lateral .nav-item span{margin-right: 12px;}
  .menu-lateral .nav-item span img{width: 7%;}
  .menu-lateral .nav-item a{color: #fff;}
  .menu-lateral .navbar-nav .dropdown-menu { background-color: var(--blue-light);margin: 0 -16px 0 -16px;padding-top: 0px;padding-bottom: 0px;border-style: none;border-radius: 0px;}
  
  .menu-lateral .navbar-nav .dropdown-menu a:hover{
	  background-color: var(--blue-coincity);
  }
  
  .menu-lateral .active{
	  background-color: var(--blue-active);
  }
  
  .menu-lateral a.dropdown-item.active{
	  background-color: var(--blue-coincity);
  }
  .content{
	  left: 25%;
	  overflow: scroll; width: 100%; height: 100%;
	  min-height: 100%;
	  background-color: #fff;
  
  }
  
  
  .input-group-prepend .input-group-text{background-color: #fff;}
  
  .note-editor.note-frame{width: 96.45%;}
  
  .title{
	  text-align: center;
	  font-size: 30px;
	  padding-top: 20px;
	  padding-bottom: 20px;
	  background-color: #FAF8F3;
	  margin-bottom: 16px;
	  -webkit-box-shadow: 0px 3px 8px 0px rgba(124,121,116,0.5);
  }
  
  .subtitle{
	  text-align: center;
	  font-size: 20px;
	  padding-top: 10px;
	  padding-bottom: 10px;
	  background-color: #fff;
	  margin-bottom: 16px;
	  -webkit-box-shadow: 0px 3px 8px 0px rgba(124,121,116,0.2);
  }
  
  .tutorial{
	  font-size: 15px;
	  font-style: italic;
	  padding-top: 10px;
	  padding-bottom: 10px;
	  background-color: #fff;
	  margin-bottom: 16px;
	  -webkit-box-shadow: 0px 3px 8px 0px rgba(124,121,116,0.2);
  }
  
  .inicio-barra{
	  background-color: #d8d8d8;
	  color: #fff;
	  height: 20vh;
	  padding: 40px 0px 40px 0px;
	  box-shadow: 0 4px 16px -2px gray;
  }
  
  .inicio-general{
	  
	  top:15vh;
	  height: 60vh;
	  text-align: center;
	  cursor: pointer;
  }
  .clickable{
	  cursor: pointer;
  }
  .clicked{
	  transition: all .3s ease-in-out;
	  animation: grow;
  }
  
  @keyframes grow {
	from {
	  transform: scale(0);
	}
	to {
	  transform: scale(1.02);
	}
  }
  
  
  .inicio-registrado{
	  bottom:25px;
	  position: fixed;
	  height: 12vh;
	  text-align: center;
	  cursor: pointer;
  }
  .inicio-registrado:hover{
	  transition: all .3s ease-in-out;
	  transform: scale(1.02);
  }
  
  
  .ticket-folio{
	  font-weight: bold;
  }
  
  .separador{
	  font-weight: bold;
	  font-size: 16pt;
	  margin: 8px 0px 8px 0px;
  }
  
  .label{
	  font-weight: bold;
	  color: #4b4b4b;
  }
  .label-lg{
	  font-weight: bold;
	  font-size: 16pt;
	  color: #4b4b4b;
  }
  
  .card{
	  margin: 8px 0px 8px 0px;
  }
  
  .messageModal{
	  text-align: center;
	  font-weight: bold;
  }
  
  #label-title{font-size:16pt;text-transform: capitalize;}
  #label-descripcion{font-size:16pt;text-transform: capitalize;}
  #label-clave{font-size: 8pt;font-style: italic;font-weight: bold;}
  #label-precio{font-size: 14pt;font-weight: bold; background-color: #f1c40f; overflow: hidden;}
  
  .pagando{font-size: 16pt !important; text-align: center;}
  #valid_user_new{font-size: 20pt !important;}
  .fraccion{font-size: 10pt; padding-left: 4px;padding-right: 4px;}
  
  .timer-label{color: #000;}
  
  .aviso{
	  background-color: #000;
	  color: #fff;
	  padding: 8px 8px 8px 8px;
	  font-style: italic;
  }
  
  img{
	  width: 100%;
	  height: 100%;
	  user-drag: none; 
	  user-select: none;
	  -moz-user-select: none;
	  -webkit-user-drag: none;
	  -webkit-user-select: none;
	  -ms-user-select: none;
  }
  
  .label-disabled{
	text-align: center;
	background-color: #c0392b;
	color: #fff;
	padding: 2px 2px 2px 2px;
  }
  
  .label-enabled{
	text-align: center;
	background-color: #27ae60;
	color: #fff;
	padding: 2px 2px 2px 2px;
  }
  
  .hide{
	  display: none;
  }
  
  .quantity{
	  font-size: 17pt;
	  font-weight: bold;
	  text-align: center;
  }
  
  .container-fluid{
	  padding-left: 0;
	  padding-right: 0;
	  margin-left: 0;
	  margin-right: 0;
	  width: 100%;
  }
  
  
  .hide{
	  display: none;
  }
  
  .labelPricesku{
	  position: absolute;
	  top: 20px;
	  right:50px;
	  color: #fff;
	  font-style: italic;
  }
  
  .ticketDiv{
	  -webkit-box-shadow: 0px 0px 14px 3px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 0px 14px 3px rgba(0,0,0,0.75);
  box-shadow: 0px 0px 14px 3px rgba(0,0,0,0.75);
  }
  
  .modal-close-btn{
	  position: absolute;
	  top: -40px;
	  right: -45px;
  }
  
  .label-25{
	  font-weight: bold;
	  font-size: 25pt;
  }
  
  .label-30{
	  font-weight: bold;
	  font-size: 30pt;
  }
  
  .label-45{
	  font-weight: bold;
	  font-size: 45pt;
  }
  
  .label-55{
	  font-weight: bold;
	  font-size: 55pt;
  }
  
  .label-65{
	  font-weight: bold;
	  font-size: 65pt;
  }
  
  .label-75{
	  font-weight: bold;
	  font-size: 75pt;
  }
  
  .privacity-advice{
	  font-weight: bold;
	  font-size: 10pt;
  }
  

  
  .main-btn{
	  background-color: #C0172F;
	  color: #fff;
	  border-radius: 10px;
  }
  
  .hidden{
	  display: none;
  }
  
  .window-process{
	  width: 100vw;
	  height: 100vh;
  }
  
  .text-gray{
	  color: #565551;
  }
  
  
  .btnVariant{
	  border-radius:10px;
	  border-style:solid;
	  border-width:2px;
	  font-size:21pt;
	  font-weight:bold
  }
  
  .btnVariant:hover{
	  background-color: #FF0000;
	  color: #fff;
  }