figure.zoom {
  background-position: 50% 50%;
  position: relative;

  overflow: hidden;
  cursor: zoom-in;
}
figure.zoom img:hover {
  opacity: 0;
}
figure.zoom img {
  transition: opacity 0.5s;
  display: block;
 
}

#Inicio
{
  background-image: url("../assets/img/fondo.jpg");
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
}

.my-float {
  padding-top:15px;
  font-size: 30px;
  z-index: 9999;
}

.float {
  position: fixed;
  width: 60px;
  height: 60px;
  bottom: 100px;
  right: 25px;
  background-color: #0C9;
  color: #FFF;
  border-radius: 50px;
  text-align: center;
  box-shadow: 2px 2px 3px #000;
  z-index: 9999;
}


.my-float2 {
  padding-top:15px;
  font-size: 30px;
  z-index: 9999;
}

.float:hover{
  color: #FFF;
  animation: pulse 1.5s infinite;
}

.float2 {
  position: fixed;
  width: 60px;
  height: 60px;
  bottom: 20px;
  right: 25px;
  background-color: #00cc10;
  color: #FFF;
  border-radius: 50px;
  text-align: center;
  box-shadow: 2px 2px 3px #000;
  z-index: 9999;
  transition: ease 2s;
}

.float2:hover
{
  
  color:#FFF;
  animation: buzz-out-on-hover 0.7s infinite;
}


@keyframes pulse {
	0% {
		box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.5);
	}
	80% {
		box-shadow: 0 0 0 14px rgba(37, 211, 102, 0);
	}
}



@keyframes buzz-out-on-hover {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  90% {
    -webkit-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }
  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}


.svgbutton
{
   
}

@media only screen and (max-width: 600px)
{
    .svgbutton
    {
         width:72px;  margin-left:20px; margin-right: 15px;
    }
}