/*Inicia cambio de estilo de scroll bar*/
::-webkit-scrollbar{
    background: #d4d4d4;
    width:  20px;
  height: 20px;
}
::-webkit-scrollbar-track {
  background: #e1e1e1;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #b3b3b3;
  box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.2);
}
::-webkit-scrollbar-thumb:active {
  background-color: #45e5eb;
}
::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 4px;
}
/*Finaliza cambio de estilo scroll bar*/
/*CAROUSEL al contenedor padre se le deja el tamaño del 100%*/
#carousel{
  width:100%;
  height: 100%;
  margin-top: 5%;
margin-bottom: 5%;

 }
/*en la clase del carousel se realiza independiente para que ahi pueda agregar el escroll X*/
.carousel{
 
}
/*el texto ya esta centrado ya que se le dio el ancho del 100% al contenedor padre*/
#carousel p{  
  color: #134A73; 
  font-family:sans-serif;
  font-size:20px;
  text-align:center;   
  margin-top: 3%;
  margin-bottom: 40px;  
}
/* se le da el tamaño que se desea para la visulizacion de las imagenes ya que en el contenedor de la clase de carousel es donde estara creado el scroll*/
#carousel .gallery {
  display: flex;
  flex-direction: column;
  width:1000px;
  height: 300vh;
  
}

#carousel .item {
  flex: 0.9;
  height: 100%;
  background-position: center;
  background-size: cover;
  background-repeat: none;
  transition: flex 0.8s ease;
  }

#carousel .item:hover{
    flex: 15%;
  }

/*fotos*/

#carousel .item-1 { 
  background-image: url('../images/sani1.jpg');
}
#carousel .item-2 { 
  background-image:  url('../images/sani2.jpg');
}
#carousel .item-3 { 
  background-image: url('../images/sani3.jpg');
}
#carousel .item-4 { 
  background-image: url('../images/sani4.jpg');
}
#carousel .item-5 { 
  background-image: url('../images/sani5.jpg');
}
#carousel .item-6 { 
  background-image: url('https://i.ibb.co/Qdr9HW4/11c.jpg');
}
#carousel .item-7 { 
  background-image: url('https://i.ibb.co/hg7mHLs/19c.jpg');
}
#carousel .item-8 { 
  background-image: url('https://i.ibb.co/Zxj8srB/111c.jpg');
}

#carousel .item-9 { 
  background-image: url('https://i.ibb.co/Yt7HhvX/10c.jpg');
}
#carousel .item-10 { 
  background-image: url('https://i.ibb.co/h7ZHQTc/333c.jpg');
}
#carousel .item-11 { 
  background-image: url('https://i.ibb.co/dJZ5JW4/18c.jpg');
}
#carousel .item-12 { 
  background-image: url('https://i.ibb.co/1LM3t5n/5c.jpg');
}
/*se agrego el cursos para que sepa que esta en cada imagen*/
.gallery .item:hover{
  cursor:pointer;
}


.btn-whatsapp {
  display:block;
  width:120px;
  height:120px;
  color:lavender;
  position: fixed;
  right:20px;
  bottom:20px;
  border-radius:50%;
  line-height:80px;
  text-align:center;
  z-index:999;
}
