/******
	General
*******/

.btn-pointer{
	cursor:pointer;
}


/*******
	Interacciones
*******/

.word-interaction{
  background-color: yellow;
  
}

.row-transparent{
	background-color:transparent !important;
	cursor:pointer;
}

/*****
Form
***/

.form-off{
	display:none;
}

.form-on{
	display:inline;
}


/**************
	forms validators 
**********/
#loginForm .form-group label.error, #registrationForm .form-row .col-12 label.error, #registrationForm .form-row .form-group .form-check label.error{
  color:red !important;
}

#updateForm .form-group label.error{
	color:red !important;
}

#formRecovery .form-group label.error{
	color:red !important;
}

#suggestionForm .form-group label.error{
	color:red !important;
}

/*************
	Autocomplete
*************/
 
 .ui-autocomplete {
  max-height: 480px;
  overflow-y: auto;
  overflow-x: hidden;
  width:500px;
  background-color:#fff;
  list-style-type: none;
  cursor:pointer;
  color: #b3b3b3;
 }
 
.ui-autocomplete li:hover{
  background-color: #f2f2f2;
}
 
* html .ui-autocomplete {
  height: 100px;
}
 

 
.ui-autocomplete-category {
  font-weight: bold;
  padding: 0.5rem 0 0.5rem 0;
  margin: 0;
  line-height: 1.5;
  color:#0052a1;
  border-bottom: 1px solid #90CAF9;
}

html body ul#ui-id-1.ui-menu.ui-widget.ui-widget-content.ui-autocomplete.ui-front{
  background-color: #fff;
  border: 1px solid #c3c3c3;
  border-radius: 7px;
  box-shadow: 3px 3px 5px #42A5F5;
  padding: 0 1.5rem;
}

html body ul#ui-id-1.ui-menu.ui-widget.ui-widget-content.ui-autocomplete.ui-front li.Medicamentos.ui-menu-item, li.Sustancias.ui-menu-item, li.CIE-10.ui-menu-item, li.ATC.ui-menu-item, li.Laboratorios.ui-menu-item{
  border-bottom: 1px solid #BBDEFB;
  padding: 0.5rem 1rem;
}

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-state-active.ui-button:hover 
{
   background-color: #f2f2f2;
}
 
 
/* == == == BOTÓN SALIR == == == */

html body header.encabezado div.container a.btn-salir{
  text-decoration: none;
  color: #0052A1;
  padding: 0 1.2rem;
  font-size: 1rem;
}

li a.boton-menuMovil-salir{
  background-color: #eee;
  color: #0052A1;
  border-radius: 7px;
  margin: 0.5rem;
  padding: 0.5rem 1rem;
  width: 55px;
  line-height: 18px;
  -webkit-transition: all 0.5s ease;
  transition: all 0.3s ease;
}
li a.boton-menuMovil-salir:hover{
  background-color: #007bff;
  color: #fff;
}

html body header.encabezado div.wrap-menu-contenidos nav#menu-contenidos.d-md-block.collapse ul li.border-bottom-cinco.btn-inicio-secion-movil a.boton-inicio-sesion{
  width: 100%;
}


/* ===  ===  ===  ===  ===  ===  ===  ===  === 
                    RESPONSIVE
===  ===  ===  ===  ===  ===  ===  ===  === */

@media (max-width: 767px) and (min-width: 300px){

  .ui-autocomplete {
    width: 290px;
    padding: 0.5rem 1rem;
   }

   html body ul#ui-id-2.ui-menu.ui-widget.ui-widget-content.ui-autocomplete.ui-front{
     background-color: #fff;
     border: 1px solid #c3c3c3;
     border-radius: 7px;
     box-shadow: 3px 3px 5px #42A5F5;
     padding: 0 1.5rem;
   }

   html body ul#ui-id-2.ui-menu.ui-widget.ui-widget-content.ui-autocomplete.ui-front li.Medicamentos.ui-menu-item, li.Sustancias.ui-menu-item, li.CIE-10.ui-menu-item, li.ATC.ui-menu-item, li.Laboratorios.ui-menu-item{
     border-bottom: 1px solid #BBDEFB;
     padding: 0.5rem 1rem;
   }

  html body header.encabezado div.container a.btn-salir{
    text-decoration: none;
    color: transparent;
    padding: 0 1.2rem;
    font-size: 1rem;
  }
  
  #carrusel-flotante .carousel-inner{
		    margin-left: 0px !important;
	}
  #carrusel-flotante button#ocultar {
           margin-right: 10px !important;
  }
}


@media (max-width: 992px) and (min-width: 768px){
  html body header.encabezado div.container div.iniciar-sesion a.boton-inicio-sesion{
    padding: 0 0.8rem;
  }
  
  html body header.encabezado div.container a.btn-salir{
    text-decoration: none;
    color: #0052A1;
    padding: 0 0.8rem;
    font-size: 1rem;
  }

  html body header.encabezado div.container a.logo-encabezado img{
    height: 1.7rem;
  }
}


@media (max-width: 1200px) and (min-width: 993px){
  html body header.encabezado div.container div.iniciar-sesion a.boton-inicio-sesion{
    padding: 0 1rem;
  }
  
  html body header.encabezado div.container a.btn-salir{
    text-decoration: none;
    color: #0052A1;
    padding: 0 1rem;
    font-size: 1rem;
  }

  html body header.encabezado div.container a.logo-encabezado img{
    height: 1.8rem;
  }
}


/*carrucel flotante  */
	
	#carrusel-flotante {
		position: fixed;
		    bottom: 0;
		    width: 100%;
		    left: 0;
		    z-index:6666;
		    transition: all .5s ease;
		}
	#carrusel-flotante .carousel-inner{
		    margin-left: 15px;
	}
	
	 #carrusel-flotante button#ocultar {
	  color: red !important;
	  bottom: -35px !important;
	   position: relative !important;
	   margin: 1px !important; 
	 }
	 
/* descargar app*/
 
.btn-flotante {
	font-size: 14px; 
	/*text-transform: uppercase; */
	font-weight: bold; 
	color: #ffffff;
	border-radius: 5px; 
	letter-spacing: 2px; 
	 background-image: linear-gradient(#26a3e4, #0a549e);
	/*background-color: #20a2e4; */
	padding: 10px 15px; 
	position: fixed;
	bottom: 20px;
	width:98%;
	margin-left:1%;
	transition: all 300ms ease 0ms;
	box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
	z-index: 99;
}
.btn-flotante:hover {
	/*
	background-color: #2c2fa5; 
	box-shadow: 0px 15px 20px rgba(0, 0, 0, 0.3);
	transform: translateY(-7px);*/
}
@media only screen and (max-width: 600px) {
	
	.btn-flotante {
		font-size: 14px;
		padding: 4px 8px;
		bottom: 10px;
	}
 	
}