
: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;
}

.text-brown{
	color: #3A1D1E;
}

.rounded{
	border-radius: 30px !important;
}

.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%;
	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: 20pt;
	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;
}

.privacity-advice{
	font-weight: bold;
	font-size: 10pt;
}

.hidden{
	display: none;
}

.vending-title{
	font-weight: bolder;
	font-size: 8pt;
}

.vending-subtitle{
	font-style: italic;
	font-size: 8pt;
}

.vending-label{
	font-weight: bold;
	font-size: 8pt;
}

.vendingBox{
	height: 220px;
	border-width: .5px;
	border-style: solid;
	border-color: #ecf0f1;
	border-radius: 5px;
}

.quizText{
	font-size: 10pt;
	text-align: center;
	font-weight: bold;
	font-size: 14pt;
}

.glowBorder{
	-webkit-box-shadow:  0 0 50px #fff;
    -moz-box-shadow:  0 0 50px #fff;
    box-shadow:  0 0 50px #fff;

}