/*:root {
  
  --main-primary-color: #fc8900;
  --main-secundary-color: #ffab00;
  --main-terciary-color: #cdcdcd;
  --main-ptext-color: #353535;
  --main-light-color: #ffffff;
  --alpha: 0.9;
  --main-terciary-color-rgb:205,205,205;
}*/




:root {  
	--main-primary-color: #061D3F;
	--main-secundary-color: #082A54;
	--main-terciary-color: #cdcdcd;
	--main-ptext-color: #353535;
	--main-light-color: #ffffff;
	--alpha: 0.9;
	--main-terciary-color-rgb:205,205,205;
  }
 * { 
  -webkit-tap-highlight-color: rgba(0,0,0,0); 
}
.just-center{
	justify-content: center;
    align-items: center;
    display: flex
}
.just-space-b{
	justify-content: space-between;
    align-items: center;
    display: flex
}
.just-space-a{
	justify-content: space-around;
    align-items: center;
    display: flex
}
.just-space-e{
	justify-content: space-evenly;
    align-items: center;
    display: flex
}
.labelLogin{
	position:relative;
    padding: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 1em;
}

[class*="iconViewPass"]{
display: flex;
position: absolute;
right: 10px;
color: var(--main-ptext-color);
cursor: pointer;
transition-duration: 0.2s;
}

.iconViewPass-active::before{
	content: "\f06e";
}

.iconViewPass-inactive::before{
	content: "\f070";
	
}

[class*="iconViewPass"]:hover{
	color: var(--main-secundary-color);
	transform: scale(1.1);
}

.labelLogin input{
	width: 100%;
	margin-bottom: unset!important;
}

.iconpRint{
color: var(--main-terciary-color);
padding: 0 1em;
}
body{
	font-family: Montserrat, arial, sans-serif;
	margin: 0;
	background-color: var(--main-light-color);
	color: var(--main-ptext-color);
	min-width: 100%;
}

.selectPrint{
	display: flex;
	position: fixed;
	bottom: 10px;
	right: 10px;
}
input:focus {
	outline-color: var(--main-ptext-color);	
}

a{
	text-decoration:none;
	color:var(--main-secundary-color);
}
.contcamara{
	background-color: var(--main-terciary-color);
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;

}
.caja{
	background-image: url("../img/fondo-mosaic.jpg");
	background-repeat: repeat;
	min-height: 200px;
	display: flex;
	align-items: center;
	margin: auto;
	text-align: center;
	padding: 1em;
	flex-direction: column;
	border-radius: 10px;
	margin: auto;
	min-width: 300px;
	max-width: 85%;
}
.caja>form{
	align-content: center;
	text-align: center;
	justify-content: center;
	flex-direction: column;
	display: flex;
	font-weight: bolder;
}

form input{
	margin-bottom: 1em;
	background-color: var(--main-light-color);
	border-style:solid;
	border-width: .001em;
	border-color: var(--main-terciary-color);
	border-radius: 3em;
	padding: 0.5em;
	border-color: var(--main-secundary-color)
}
.control-label{
	text-transform: uppercase;
}
.inputLarge{
	min-width: 300px;
}


.btnok{
	margin: auto;
	width: 200px;
	border-style:solid;
	border-width: .001em;
	border-color: var(--main-terciary-color);
	border-radius: 3em;
	padding: 0.5em;
	background-color: var(--main-secundary-color);
	color: var(--main-light-color);
	cursor: pointer;
	transition-duration: 0.25s;


}

.nomostrado{
	display: none;
	width: 100%;	
	height: auto;
	justify-content: center;
	align-items: center;
}


.btnok:hover{

	transform: scale(1.05);
	background-color: var(--main-primary-color);
	color: var(--main-light-color);
	box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, .1);

}
.marcocam{
	width: 75vw;

}
#preview{
	width: 100%;
	border-radius: 10px;
	background-color: var(--main-light-color);
}

#frontal{
	cursor: pointer;
	color: green;
}
#atras{
	cursor: pointer;
	color: blue;
}

.nofunciona{
	display: none;

}
.espejo{
transform: scaleX(-1);
}
.cont_basic{
	width: 100%;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background-color: var(--main-primary-color);


}
.cont_basic h1{
	color: var(--main-light-color);
}

.cont_intern{
	display: inline;
	align-items: center;
	margin: auto;
	
	text-align: center;
}
.boton_general{
	width: 200px;
	height: 200px;
	border-radius: 10px;
	background-color: var(--main-light-color);
	display: inline-flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	margin: 30px;
	transition-duration:0.5s;
	cursor: pointer;
	animation-name: subir;
	animation-duration: .5s;
	border-color: #D8D8D8;
}
.d1{animation-timing-function: ease;}
.d2{animation-timing-function: ease-out;}

.icon{
	line-height:2em;
}


.boton_general:hover{

	transform: scale(1.05);
	background-color: var(--main-secundary-color);
	color: var(--main-light-color);
	box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .2);

	

}

button.boton_general{
	border-style: none;
	background-color: var(--main-terciary-color);
}
button.boton_general:focus{
	outline-color: var(--main-ptext-color);
	border-style: none;
	background-color: var(--main-secundary-color);
	color: var(--main-light-color);
}



.menu{
	text-align: center;
	position: absolute;
	width: 100%;
	right: 0;
	color: var(--main-light-color);
	background-color: var(--main-primary-color);
	display: flex;
	flex-direction: row;
	justify-content: flex-end;

}

.menBtn{
	padding: 0 1em;
}




.menBtn{
	min-width: 100px;
	margin-right: 20px;
	color: var(--main-light-color);
}

.menBtn:hover{
	color: var(--main-primary-color);
	background-color: var(--main-light-color);
	box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, .1);
}

.menuMov{
	display: none;
}

.red{
	color: #ff3b3b
}

hr{

	width: 50%;
	height: 1px;
	border-color: var(--main-terciary-color);
	background-color: var(--main-terciary-color);
	border-style: none;
}
.mailPlantilla{
	background-image: url("../img/bgcarnet.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	width: 8in;
	height: 14.22in;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	font-size: 3em;
	text-align:center;
	position: relative;
	margin: auto;
}

.qrimage{
	width: 50%;
	position: relative;
	border-style: solid;
	border-width: 0.5em;
}


.bg-success{
  	background-color: #7bc64b;
  }
.bg-warning{
  	background-color: #ff3b3d;
  }
  .border-warning{
  	border-color: #ff3b3d;
  }

  .border-success{
  	border-color: #7bc64b;
  }




.caja img{
	margin-bottom: 1em;
}

.datos{

	color: var(--main-primary-color);
}

.logo_Expo{
	width: 50%;
}

.flotante{
	background-color: rgb(0,0,0,0.5);
	width: 100%;
	position: absolute;
	height: 100vh;
	top: 0;
	margin:auto;
	position: fixed;
}


.mostrar{
	display: flex;
}
.mostrarDos{
	display: flex;
	flex-direction: column;
	text-align: center;
	max-width: 70%;
    margin: auto;
}

.may{
	text-anchor: uppercase;
}

.xl-font{
	font-size: x-large;
}

.l-font{
	font-size: large;
}
.row{
	display: flex;
}

.j-left{
	width: 90%;
	text-align: left;
	justify-content: flex-start;
}

.mensaje{
	max-width: 500px;
	margin:auto;
}

.p-block{
	display: flex;
	flex-direction: column;
}

.noselect{
	user-select:none;
}
/* 

Animaciones

*/

@keyframes subir {
  0%{
  	transform: translateY(50px) scale(1.02); 
  	  opacity: 0; 
	box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .2);
  	 
  }

  50% {
  	transform: translateY(0px) scale(1.02);
  	box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .2);
	
  }

  75% {
  	transform: translateY(0px) scale(1.02);
  	box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .2);
  }

  100%{
  	transform: scale(1);


  }


}

.dis{
	display: none;
}


.mb-4 {
    margin-bottom: 1.5rem!important;
}

.col-md-6 {
    flex: 0 0 auto;
    width: 50%;
}
.form-group{
	display: block;
}
.error{
	color: #ff3b3d;
}

.popupUno{
	position: fixed;
	width: 100%;
	height: 100vh;
	margin-bottom: 3em;
	background-color: rgba(var(--main-terciary-color-rgb), var(--alpha));
	justify-content: center;
	align-items: center;
	flex-direction: column;
	top: 0;
	color: var(--main-light-color);
}
.clientConsult{

	max-width: 75vw!important;
	min-height: 200px;
	border-radius: 1em;
	background-color: var(--main-light-color);
	color: var(--main-ptext-color);
	padding: 2em;
	overflow: hidden;
	position: relative;
	margin-bottom: 2em;
	
}
.cobrarBox{

	width: 400px;
    min-height: 200px;
    border-radius: 1em;
    background-color: var(--main-light-color);
    color: var(--main-ptext-color);
    padding: 2em;
    max-width: 70vw;
	
}

.infoConsult{
	width: 100%;
	min-height: 300px;
	height: auto;
	display: flex;
	justify-content: center;
	color: var(--main-light-color);
}

.formVenta{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.formVenta input{
	min-width: 150px;
}

.ocultar{
	display: none;
}

input:disabled {
	background-color: var(--main-terciary-color);
	border-style: none;
}
.idForm{
	min-width:100px;
	text-align: right;
	padding-right: 1em;
}
.formVenta section{
	display: flex;
}
.config{
	color: var(--main-light-color);
}
.admin_items{
	display: contents;
    max-width: 100%;
    padding: 1em;
    padding-top: 100px;
    width: 100%;
}
.contAdmin{
	display: flex;
	width: 100%;
	height: 100vh;
}
.menuAdmin{
	max-height: 100vh;
	padding-top: 48px;
	justify-content: left;
	max-width: 300px;
	background: var(--main-primary-color);
}

.menuAdmin section{
	min-height: 40px;
	color: var(--main-light-color);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: left;
	padding: 1em 0;

}
.menuAdmin section:hover{
	background-color: var(--main-secundary-color);
	cursor: pointer;
	color: var(--main-light-color);
	box-shadow: inset 0 -2px 0 0 #08B;
	 
}

.menuAdmin section.menuAdminSelec{
	background-color: var(--main-light-color);
	cursor: pointer;
	color: var(--main-primary-color);
	box-shadow: inset 0 -2px 0 0 #08B;

	
}

.tableRegular{
	font-size: 0.7em;
	width: 100%;
	margin: auto;
	border-collapse: collapse;
	  border-spacing:  0px;


}
.tableRegular th, td {
   text-align: center;
   vertical-align: center;
   border: 0.5px solid #000;
   padding-left: 0.5em;
   padding-right: 0.5em

}
.nameMenuL-inactive{
	width: 0;
	overflow: hidden;
}

.nameMenuL{
	padding-right: 1em;
}

[class*="fa-"]{
	padding: 1em;
}


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

	input, a, button, select{
		min-height: 40px;
		min-width: 50px;
	}
	input{
		min-width: 200px;
	}

.menu{
	display: none;
}

.menuMov{
	display: flex;
	z-index: 1000;
	position: fixed;
  top: 0;
  width: 100%
}

.barras{
    z-index: 1000;
    position: absolute;
    top: 5px;
    right: 5px;
    color: var(--main-light-color);
	background-color: var(--main-secundary-color);
	border-radius: 0.7em;
}

.mbmov{
	height: 100vh;
	width: 100%;
	display: flex;
	position: absolute;
	align-items: center;
	justify-content: flex-start;
	flex-direction: column;
	z-index:500;
	background-color:  var(--main-secundary-color);
	padding-top: 10vh;
}

.menBtnMov{
	display: flex;
	justify-content: center;
	align-items: center;
	height: 15vh;
	width: 95%;
	color: var(--main-light-color);
	font-size: 2em;
}

.menBtnMov:hover{
	
	background-color: var(--main-light-color);
}

.equis{
	color: var(--main-light-color);
	background-color: var(--main-primary-color);

}


.usuario{
	display: flex;
	justify-content: space-around;
	align-items: center;
	height: 10vh;
	width: 95%;
	color: var(--main-secundary-color);
	font-size: 1em;
	background-color: var(--main-light-color);
	color: var(--main-primary-color);

margin-bottom: 20px;
margin-top: 5px;

}


.usuario .config{
	color: var(--main-primary-color);
	padding: 1em;
	display: flex;
	justify-content: center;
	align-items: center;

}
.nameMenuL{
	display: none;
}

.btnok{
	min-height: 40px!important;
}


}