/**{position:relative;-webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;transition:all .3s ease-in-out;box-sizing: border-box;}*/
/**{font-size: 0.875rem !important;}*/
*::-webkit-scrollbar {-webkit-appearance: none;}
*::-webkit-scrollbar:vertical {width:6px;}
*::-webkit-scrollbar-button:increment,*::-webkit-scrollbar-button {display: none;} 
*::-webkit-scrollbar:horizontal {height: 10px;}
*::-webkit-scrollbar-thumb {
    background-color: #0088CC;
    border-radius: 80px;
    border: 0px solid #f1f2f3;
}
*::-webkit-scrollbar-track {border-radius: 10px;}

*, :after, :before {
    box-sizing: border-box;
    outline: none;
}

*{position:relative;box-sizing: border-box;}
a, a:hover{text-decoration:none;}
.hide{display:none;}
.clear{clear:both;}
.vertical-medio{display: flex;align-items: center;justify-content: center;}
section{padding:3em 0em;border:0px solid #000;}
.contenido-medio{padding:0em 4em;}
.d-block{display:block !important;}
.abs-center {display: flex;align-items: center;justify-content: center;}

.w10px{width:10px;}
.w20px{width:20px;}
.w30px{width:30px;}
.w40px{width:40px;}
.w50px{width:50px;}
.w60px{width:60px;}
.w70px{width:70px;}
.w80px{width:80px;}
.w90px{width:90px;}
.w100px{width:100px;}
.w110px{width:110px;}
.w120px{width:120px;}
.w130px{width:130px;}
.w140px{width:140px;}
.w150px{width:150px;}
.w160px{width:160px;}
.w170px{width:170px;}
.w180px{width:180px;}
.w190px{width:190px;}
.w200px{width:200px;}

.w10{width:10% !important;}
.w20{width:20% !important;}
.w30{width:30% !important;}
.w40{width:40% !important;}
.w50{width:50% !important;}
.w60{width:60% !important;}
.w70{width:70% !important;}
.w80{width:80% !important;}
.w90{width:90% !important;}
.w100{width:100% !important;}
/*small{font-size:0.6rem;}*/


#LoadingLista{min-height:60vh;}

/*******************************************************************************CONFIGURACON HOJA*/
.papel-margen {
	width:350px;
	display: grid;
	grid-template-columns: 1fr 2fr 1fr;
	grid-template-rows: 1fr 4fr 1fr;
	grid-column-gap: 4px;
	grid-row-gap: 4px;
}

.papel-margen .superior { grid-area: 1 / 2 / 2 / 3; }
.papel-margen .derecha { grid-area: 2 / 3 / 3 / 4; }
.papel-margen .inferior { grid-area: 3 / 2 / 4 / 3; }
.papel-margen .izquierda { grid-area: 2 / 1 / 3 / 2; }
.papel-margen .papel { grid-area: 2 / 2 / 3 / 3; }

@media print {
  @page {
    margin-top: 0;
    margin-bottom: 0;
  }
  body  {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }
}

/************** colores*/
.gris{background:#eee;}

.ptb2{padding:2em 0em;}
.ptb1{padding:1em 0em;}

/* --------------------------------------- */
/* ----- Radio Button */
/* --------------------------------------- */
/* --------------------------------------- */
/* ----- Checkbox */
/* --------------------------------------- */
/* FORMA DE USAR */
/* <div class="radio">
	<input type="radio" name="RdaDomicilioTienda" id="UsuarioTipoDomicilio" ng-model="UsuarioDireccion.DomicilioTienda" value="Domicilio">
	<label for="UsuarioTipoDomicilio"><i class="fas fa-map-marker-alt"></i> Domicilio</label>
	
	<input type="radio" name="RdaDomicilioTienda" id="UsuarioTipoTienda" ng-model="UsuarioDireccion.DomicilioTienda" value="Tienda">
	<label for="UsuarioTipoTienda"><i class="fas fa-store"></i> Tienda</label>
</div>*/
.formulario .radio label, .formulario .checkbox label {
    display: inline-block;
    cursor: pointer;
    color: #FF4136;
    position: relative;
	/*padding: 5px 15px;*/
    padding: 7px 15px 7px 51px;
    font-size: 1em;
    border-radius: 0px;
	border:1px solid #FF4136;
}
.formulario .radio label:hover, .formulario .checkbox label:hover {background: rgba(255, 65, 54, 0.1); }
/*.formulario .radio label:before, .formulario .checkbox label:before {
	content: "";
	display: inline-block;
	width: 17px;
	height: 17px;
	position: absolute;
	left: 15px;
	border-radius: 50%;
	background: none;
	border: 3px solid #FF4136;
}*/
.formulario input[type="radio"]{display: none;}
.formulario input[type="radio"]:checked + label:before{display: none;}
.formulario input[type="radio"]:checked + label {padding: 8px 15px;background: #FF4136;border-radius: 2px;color: #fff;border:1px solid transparent;}
.formulario .checkbox label:before {border-radius: 3px;}
.formulario .checkbox input[type="checkbox"] {display: none;}
.formulario .checkbox input[type="checkbox"]:checked + label:before {display: none;}
.formulario .checkbox input[type="checkbox"]:checked + label {background: #FF4136;color: #fff;padding: 5px 15px;}


.btn-whatsapp{background:#22D366;color:#fff;--bs-btn-active-bg: #4d5154;}
.btn-whatsapp:hover, .btn-whatsapp:focus{background:#38d775;color:#fff;}


.form-floating{color:#000;}

.div-lectura{height:300px; overflow-x:hidden;}

/*bootbox*/
.modal-header{background:#334FBA;color:#fff;}

/*apariencia input number */
/*https://es.stackoverflow.com/questions/20484/c%C3%B3mo-eliminar-los-botones-de-un-input-number*/
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

input[type=number] { -moz-appearance:textfield; }

/* Mailbox - Showing Menu Toggle */
@media only screen and (min-width: 768px) and (max-width: 1365px) {
}
/* Layout Base - Sidebar Right Opened - Has Top Horizontal Menu ( Ipad ) */
@media only screen and (min-width: 768px) and (max-width: 991px) {
	
}
/* Layout Boxed - small than min-width */
@media only screen and (max-width: 1199px) {
	
}
/* Layout Boxed - larger or equal min width */
@media only screen and (min-width: 1200px) {
	
}
@media only screen and (max-width: 991px) {
	
}
/* Layout Boxed - larger or equal min width */
@media only screen and (min-width: 768px) {
	/* -------------------------------------*/
}

@media only screen and (max-width: 767px) {
	/* -------------------------------------*/
}
@media only screen and (max-width: 576px){
	
	/* -------------------------------------*/
}
@media only screen and (max-width: 480px) {
	section{padding:2em 0em;}
}
/* iOS10 Content Width Fix */
@media (min-width: 768px) {
	
}
/* Locked Screen - Responsive Landscape */
@media only screen and (max-width: 767px) and (orientation: landscape) {
}



@media only screen and (max-width: 767px) {
}