#home-boton .headline-regular{font-family:var(--headline-regular);}
#home-boton .headline-bold{font-family:var(--headline-bold);}
#home-boton .huincha-soap{
	position: fixed;
	bottom: 0%;
	padding: 0px;
	width: 100%;
	z-index:3;
}
#home-boton .huincha-small{
	border-top: 4px solid #FFFFFF;
	border-top-left-radius:8px;
	border-top-right-radius:8px;
	box-shadow:
		0px -10px 16px 0 rgba(0, 0, 0, 0.15);
	position: absolute;
	bottom: 0;
}
#home-boton .huincha-container{
	border-top: 4px solid #FFFFFF;
	position: absolute;
	bottom: 0;
	border-top-left-radius:8px;
	border-top-right-radius:8px;
	box-shadow:
		0px -10px 16px 0 rgba(0, 0, 0, 0.15);
}
#home-boton .img-container{
	/*margin-top: 0.4%;*/
	width: 43%;
	position: relative;
}
.img-soap{
	object-fit: cover;
	object-position: right;
	height: 100%;
}
.img-icon{
	position:absolute;
	right: -20px;
	top: 50%;
	transform: translateY(calc(-50% + 4px));
}

#home-boton .btn{
	margin-top:5px;
	/*min-width:115px;*/
}
#home-boton .btn.btn-secondary:hover:not(.disabled) {
	background-color: #ec0000;
	border-color: #fff;

}
#home-boton .animate__fadeOutDown {
  animation: fadeOutDown 1s forwards;
}
#home-boton .animate__bounceInUp {
  animation: bounceInUp 2s forwards;
}

#home-boton .animate__fadeOutLeft {
  animation: fadeOutLeft 1s forwards;
}
#home-boton .animate__bounceInLeft{
  animation: bounceInLeft 2s forwards;
}

@keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    transform: translate3d(0, 3000px, 0) scaleY(5);
  }

  60% {
    opacity: 1;
    transform: translate3d(0, -20px, 0) scaleY(0.9);
  }

  75% {
    transform: translate3d(0, 10px, 0) scaleY(0.95);
  }

  90% {
    transform: translate3d(0, -5px, 0) scaleY(0.985);
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes bounceInLeft {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
 
  0% {
    opacity: 0;
    transform: translate3d(-3000px, 0, 0) scaleX(3);
  }
 
  60% {
    opacity: 1;
    transform: translate3d(25px, 0, 0) scaleX(1);
  }
 
  75% {
    transform: translate3d(-10px, 0, 0) scaleX(0.98);
  }
 
  90% {
    transform: translate3d(5px, 0, 0) scaleX(0.995);
  }
 
  to {
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeOutLeft {
  from {
    opacity: 1;
  }
 
  to {
    opacity: 0;
    transform: translate3d(-100%, 0, 0);
  }
}

@media (max-width: 768px){
	#home-boton .btn{
		min-width:115px;
	}
	.close-button{
		position: absolute;
		right: 12px;
		top: 12px;
	}
	#home-boton .huincha-container{
		width: 340px;
		bottom: 200px;
		border-top-left-radius: 0px;
		border-top-right-radius: 8px;
		border-bottom-right-radius: 8px;
		border-top: none;
	}
	#home-boton .img-container{
		margin-top: 1.6%;
		width: 55%;
	}
	#home-boton .img-soap{
		object-position: left;
	}
	#home-boton .huincha-small{
		width: 170px;
		bottom: 200px;
		border-top: none;
		border-top-left-radius: 0px;
		border-top-right-radius: 8px;
		border-bottom-right-radius: 8px;
	}
	#home-boton .huincha-small .btn, #home-boton .huincha-container .btn{
		padding: 13.25px 16px!important;
	}
}

