* {
	margin: 0px;
	padding: 0px;

}

/* Colores generales */
.container-fluid {
	/* background-color: #f3f3f4 !important; */
	background-color: #FAFAFA  !important;
}

#data-table {
	padding: 20px !important;
	background-color: #ffffff !important;
}

#section-button, #section-form, #section_newProductos {
	padding: 10px 5px 10px 10px !important;
	background-color: #ffffff !important;
}


/*  */

div#container-fluid-visualizador {
	border: 0px solid blue !important;
}

div#num {
	padding-top: 20px;
	border: 1px solid red !important;
}

div#btn {
	border: 1px solid green !important;
	padding-bottom: 40px;
}

div#btnPlus {
	position: absolute !important;
	top: 10px !important;
	right: 10px !important;
}

div#btnerase {
	position: absolute;
	bottom: 130px;
	right: 10px;
	margin: 2px;
	border: 1px solid #dc3545;
	padding: 8px;
	background-color: #dc3545;
	color: white;
	border-radius: 50%;

}

div#btnupdate {
	position: absolute;
	bottom: 180px;
	right: 10px;
	margin: 2px;
	border: 1px solid #28a745;
	padding: 8px;
	background-color: #28a745;
	color: white;
	border-radius: 50%;

}



div#pnuevo {
	position: absolute;
	top: 5px;
	right: 5px;
	margin: 2px;
	border: 1px solid #ffc107;
	padding: 8px;
	background-color: #ffc107;
	color: white;
	border-radius: 50%;
}




div#cardSection {
	width: 100% !important;
	margin-top: 10px;

}

img#cardimage {
	min-height: 180px;
	max-height: 180px;
	max-width: 200px;
	border: 0px solid blue !important;
	border-radius: 5px;
	width: 100%;
}

img#profileimage {
	margin: auto;
	border-radius: 50%;
	border: 1px solid #6c757d33 !important;
}

input#search {
	width: 250px;
	margin-right: 10px;
}

img#carruselimg {
	width: 100%;
	height: 100%;
}



img#imgoutput {
	width: 100px;
	height: 100px;
	display: none;
}


div#infoprofile {
	font-size: 20px;
	padding: 10px;
}

div.card {
	/* height: 300px; */
	overflow: hidden;
	box-shadow: 3px 8px 7px rgba(0, 0, 0, 0.3) !important;
}



div.card .card-content,
div.card h5 {
	font-size: 15px;
}

div.card h5 {
	font-size: 15px;
	height: 40px;
	border: 0px solid red;
	/*	margin-bottom: 0px;
	white-space: nowrap;
    text-overflow: ellipsis;*/
	overflow: hidden;
}


div.card .card-text {
	/*	position: absolute;
	bottom: 10px;
    margin: 0px;
    width: 90%;*/
	padding-top: 10px;
	border-top: 1px solid #fc84a338;
	text-align: center;
}

div#viscard {
	padding: 15px 6px 10px 6px;
	border: 0px solid rgba(252, 132, 163, 0.15) !important;
}


.card .card-content {
	padding: 5px !important;
}

#searchicon {
	position: absolute;
	padding: 10px;
	color: rgba(255, 247, 255, 1) !important;
	background-color: rgba(0, 0, 0, 0.05);
	border-radius: 50%;
	margin: 2px;
	font-size: 35px;
	bottom: 120px;
}

div.contenactions {
	padding: 10px;
	width: 25%;
	float: left;
	text-align: center;
	color: #ffffff;
	border: 0px solid red;
	display: block;
	background-color: #c22d64 !important;

}

img[src*="https://cdn.000webhost.com/000webhost/logo/footer-powered-by-000webhost-white2.png"] {
	display: none;
}


div.actions {
	position: fixed;
	bottom: 0px;
	left: 0px;
	width: 100%;
	height: 40px;
	border-radius: 0;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
	z-index: 10000;
}

#navbarindex {
	/* top: 35px; */
	/* height: 5100px !important; 	 */
	background-color: #c22d64 !important;
	border: 0px solid green;
	/* width: 500px; */


}

nav#navbarindex2 {
	/* top: 53px; */
	text-align: left;
	background-color: #c22d64 !important;
	/* width: 200px; */
	/* height: 500px !important;   */
	border: 0px solid blue;
}

nav#informacion {
	width: 100%;
	height: 35px;
	border: 0px solid red !important;
	padding-top: 10px !important;
	background-color: #fff !important;
}


li.nav-item {
	width: 100%;
}

a.nav-link {
	color: white !important;
	font-weight: bold;
	font-size: 15px;
}

li.nav-item a.nav-link {
	transition: color 0.8s ease-out 0.1s;
}

a.nav-link:hover {
	color: #fc84a3 !important;
}

a.infoli {
	border: 0px solid !important;
	margin-left: 10px !important;
	float: right;
	background-color: #fff !important;
}

ul.navbar-nav,
ul.list-inline {
	width: 100%;
}

ul.dropdown-menu {
	min-width: 130px !important;
	padding: 10px !important;
	margin-left: 15px !important;
}

#btnmodalclose {
	position: absolute;
	top: 5px;
	right: 40px;
}

.alert {
	margin-bottom: 0rem !important;
}

.btn-info {
	color: #fff;
	background-color: #c22d64 !important;
	border-color: #17a2b8;
	border: 1px solid #ffadc2 !important;
}

a {
	color: #c22d64 !important;
	text-decoration: none !important;
	background-color: transparent;
}


div#cardhome {
	width: 200px !important;
	height: 150px;
	padding: 5px;
	margin: auto;
	border: 0px solid red !important;

}

div#card2home {
	border: 1px solid rgba(0, 0, 0, 0.1) !important;
	border: 0px solid green;
	width: 100%;
	height: 150px;
}


div#containerhome {
	/* margin-top: 105px; */
	/*width: 100%;*/


	/*border: 0px solid red !important; */
}

div#vis {
	margin-top: 30px;
	margin-bottom: 30px;
}

div#vis .card-header h5 {
	font-size: 16px !important;
}

div#carruselhome {
	border: 0px solid red !important;
}

/* div#visualizador {
	padding: 0px  !important; 	
	margin: auto;
	border: 0px solid red;
	background-color: white !important; 	
	height: 100%  !important; 	
	width: 100%;
	box-sizing: border-box;
} */

i#navegador {
	color: #fff;
}

h5#nombreuser {
	color: #fff !important;
}

h5#tituloclase {
	color: #fff !important;
	width: 96%;
	text-align: right;
}

h1#titulosearch {}

div#conthijos {
	padding: 0px !important;
}

div#conthijos p {
	color: #c22d64 !important;
}




a#whatsapp {
	margin-right: 7px;
	position: fixed;
	padding: 20px;
	bottom: 100px;
	right: 0;
	z-index: 6;
	border-radius: 50%;
	border: 0px solid red;
	width: 20px;
	height: 20px;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	box-sizing: border-box;
	background-image: url('../image/icon/whatsapp.png');
}


a#instagram {
	margin-right: 7px;
	position: fixed;
	padding: 18px;
	bottom: 150px;
	right: 0;
	z-index: 6;
	border-radius: 50%;
	border: 0px solid red;
	width: 18px;
	height: 18px;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	box-sizing: border-box;
	background-image: url('../image/icon/instagram.png');
}


div#view {
	border: 0px solid red;
}

div#view p {
	width: 100%;
	border: 0px solid red;
	text-overflow: ellipsis;
	margin: 0px;

}

div#imagenotify {
	border: 0px solid red;
	width: 50px;
	display: inline-block;
	margin: auto;

}

div#textnotify {
	border: 0px solid green;
	width: 85%;
	padding-left: 10px;
	display: inline-block;
}

div#imagenotify img {
	border: 0px solid blue;
	border-radius: 50%;
	margin: auto;
	width: 100%;
	height: 50px;
	float: right;
}

h5#notifytitle {
	border: 0px solid blue;
	margin-left: 15px;
}

h4#notifytitle {
	border: 0px solid blue;
	margin-left: 15px;
	margin-bottom: 15px;
}


@font-face {
	font-family: NathanTTF;
	src: url('fonts/NathanTTF.ttf');
}

@font-face {
	font-family: LangitMerah;
	src: url('fonts/LangitMerah.otf');
}

@font-face {
	font-family: Homeday;
	src: url('fonts/Homeday.ttf');
}


@font-face {
	font-family: SuperYeasty;
	src: url('fonts/SuperYeasty.otf');
}

@font-face {
	font-family: AmouraRosbele;
	src: url('fonts/AmouraRosbele.otf');
}



p#cardp {
	width: 100%;
	border: 0px solid red !important;
	font-weight: bold;
	font-size: 13px;
	position: absolute;
	bottom: 0px;
	text-align: right;
	padding-right: 50px;
}

div#cardhome h5 {
	padding: 10px;
}

h2#title {
	margin-top: 20px;
	margin-bottom: 20px;
	border-bottom: 1px solid #fc84a338;
	color: #7c7c7c !important;
}

span {
	text-align: center;
	color: #a7a7a7;
}

p#categ {
	text-align: left;
	border: 0px solid green !important;
}

footer {

	text-align: center;
}

#containerInstagram {
	height: 300px;
	padding-top: 100px;
	font-family: NathanTTF;
	border-bottom: 1px solid #fc84a338;
}

#containerInfo {
	margin: 10px 0px 10px 0px;
	border-top: 1px solid #fc84a338;
	padding: 30px 10px 30px 10px;
}

#extra-footer-bottom {
	padding: 20px;
	text-align: center;
	margin-bottom: 30px;
	margin: 10px 0px 10px 0px;


}

#extra-footer-bottom img {
	height: 80px;
	width: 80px;
	margin: 10px;
	border: 0px solid green !important;
	border-radius: 50%;
}

div#infopage {
	border-top: 1px solid #fc84a338;
	margin-top: 50px;
	font-size: 16px;
	padding: 30px 0px 30px 0px;
}

div#infopage img {
	width: 80px;
	height: 70px;
	padding: 0px 10px 0px 10px;
}

div#infopage h5 {
	padding: 0px 10px 0px 10px;
	font-size: 17px;
}

div#infopage h1,
#titlesearch {
	padding: 0px 10px 0px 10px;
	font-size: 80px;
	font-family: LangitMerah;
}


li.nav-item a {
	color: white;
}

h4#titleRotulo {
	font-family: AmouraRosbele !important;
}

/* ;
	src: url('fonts/Homeday.ttf');
} */


/* @font-face {
	font-family: SuperYeasty; */

div.subir {
	margin-right: 7px;
	position: fixed;
	padding: 20px;
	bottom: 304px;
	right: 0;
	z-index: 6;
	border-radius: 50%;
	border: 0px solid red;
	width: 10px;
	height: 10px;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	box-sizing: border-box;
	background-image: url('../image/icon/subir.jpg');
}

i.fa {
	font-size: 20px;
}

div.accesorios {
	background-image: url('../image/icon/accesorios.jpg');
	background-size: 100% 100%;
}

div.brochas {
	background-image: url('../image/icon/brochas.jpg');
	background-size: 100% 100%;
}

div.cfacial {
	background-image: url('../image/icon/cfacial.jpg');
	background-size: 100% 100%;
}

div.labios {
	background-image: url('../image/icon/labios.jpg');
	background-size: 100% 100%;
}

div.ojos {
	background-image: url('../image/icon/ojos.jpg');
	background-size: 100% 100%;
}

div.rostro {
	background-image: url('../image/icon/rostro.jpg');
	background-size: 100% 100%;
}

div.sombras {
	background-image: url('../image/icon/sombras.jpg');
	background-size: 100% 100%;
}


.loader {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 99999999;
	background: url('../image/pageLoader.gif') 50% 50% no-repeat rgb(255, 255, 255);
	/*opacity: .1;*/
}

.loaderwait {
	height: 200px;
	width: 100%;
	z-index: 99999999;
	background: url('../image/pageLoader.gif') 50% 50% no-repeat rgb(255, 255, 255);

}



div#optuser {
	padding: 20px;
}

#formprodcuto {
	padding-top: 0px !important;
}

#bodyform {
	padding-top: 0px !important;
}

label.error {
	color: #c22d64 !important;
	font-size: 13px;
}

input.error {
	border: 1px solid #c22d64 !important;
}

/* Estilo para la fila seleccionada */
.seleccionada {
	background-color: #c22d64 !important;
	color: #ffffff;
}

#btnPrint {
	position: absolute;
	right: 10px;
	top: 400px;
	border-radius: 50px;
	padding: 20px;

}

.action-confirm {
	position: fixed;
	right: 0; 
	top: 50%; 
	transform: translateY(-50%); 
	padding: 10px;
	margin: 0;
	/* border: 1px solid #c22d64 !important; */
	background: white; 
	z-index: 1000; 
}


  
@media only screen and (min-width: 800px) {
	/* div#carruselhome {
 	border: 0px solid blue !important; 
 	width: 800px;
	margin: auto !important; 
 } */

}

@media only screen and (max-width: 800px) {
	/* 
  nav#navbarindex {
  top: 0px;
    }

  nav#navbarindex2 {
  top: 49px;
    }


  div#vis {
	 margin-top: 0px;
	} */
}



@media only screen and (min-width: 1000px) {
	/* div#carruselhome {
 	border: 0px solid green !important; 
 	width: 900px;
 	height: 550px;
	margin: auto !important; 
 } */
}


#navbarindex2 li.nav-item {
    display: none; 
}
/* 
a.dropdown-item {
    display: none; 
} */

.select-info {
	display: none; /* Esto oculta el mensaje de selección */
}


/* Icono inventario */
/* tamaño y forma del círculo */
.circulo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  padding: 0;
  border: 2px solid rgba(0, 0, 0, 0.06);
  background-clip: padding-box;
  cursor: pointer;
  transition: transform 0.12s ease, box-shadow 0.12s ease;
}

/* Icono blanco y centrado */
.circulo i {
  color: #ffffff;
  font-size: 14px;
  line-height: 1;
  pointer-events: none;
}

/* Efecto hover y focus */
.circulo:hover,
.estado-inventario.circulo:focus {
  transform: scale(1.08);
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
  outline: none;
}
