/*
Theme Name: Avada Child
Description: Child theme for Avada theme
Author: ThemeFusion
Author URI: https://theme-fusion.com
Template: Avada
Version: 1.0.0
Text Domain:  Avada
*/

/* VARIABLES REUTILIZABLES  */

:root {
  --color-principal: #183153;
  --color-secundario: #cfba90;
  --color-atenuado: #cfba90;

  --font-titulo: 'Helvetica Neue LT Pro Bold';
  --font-subtitulo: 'Helvetica Neue LT Pro Bold';
  --font-contenido: 'Helvetica Neue LT Pro';
}

.hidden-media {
  display: inline-block !important;
  visibility: visible !important;
}
.hidden-media-reverse {
  display: none !important;
  visibility: hidden !important;
}

.vc_row-has-fill + .vc_row-full-width + .vc_row > .vc_column_container > .vc_column-inner {
  padding-top: 0 !important;
}

.spu-content > p {
	margin: 0px !important;
}

.inverso h1,
.inverso h2,
.inverso h3,
.inverso h4,
.inverso h5,
.inverso p {
  color: white !important;
}

.boton a,
.gform_button {
  display: inline-flex !important;
  align-items: center !important;
  position: relative !important;
  background: var(--color-secundario) !important;
  color: white !important;
  text-transform: uppercase !important;
  font-family: var(--font-contenido) !important;
  font-weight: 600 !important;
  line-height: normal !important;
  padding: 8px 15px !important;
  border-radius: 9999px !important;
  border: none !important;
  font-size: 16px !important;
  box-shadow: none !important;
  min-width: 100px !important;
}

/* ----- BLOQUE MÁRGENES ----- */
@media (min-width: 1400px) {
  .bloque-intro {
    display: grid !important;
    grid-template-columns: 0.45fr 0.55fr !important;
    gap: 35px !important;
  }
  .bloque-intro > div:first-child {
    padding-left: 0px !important;
  }
  .bloque-intro > div:last-child {
    padding-right: 20% !important;
  }
  .bloque-intro figure,
  .bloque-intro .vc_single_image-wrapper {
    width: 100% !important;
  }
  .bloque-intro:not(.inverso) > div:first-child img {
    object-fit: cover !important;
    width: 100% !important;
    object-position: top center !important;
  }
  .bloque-intro::after,
  .bloque-intro::before {
    display: none !important;
  }
  .bloque-intro > div {
    width: 100% !important;
  }

  .bloque-intro.inverso {
    grid-template-columns: 0.55fr 0.45fr !important;
  }
  .bloque-intro.inverso > div:first-child {
    padding-left: 20% !important;
  }
  .bloque-intro.inverso > div:last-child {
    padding-right: 0px !important;
  }
  .bloque-intro.inverso > div:first-child img {
    object-fit: cover !important;
    width: 100% !important;
    object-position: top center !important;
  }
}

/* HEADER */

.home header {
  background-color: transparent !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  transition: all 0.3s !important;
}

.fusion-header {
  background-color: transparent !important;
  padding-right: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
header {
  position: sticky !important;
  top: 0 !important;
  left: 0 !important;
}
header.scrolled {
  background-color: white !important;
  box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px !important;
}
.fusion-header > div {
  max-width: 100% !important;
}
.fusion-logo {
  margin: 0 !important;
}
.fusion-logo img {
  height: 40px !important;
}
.fusion-header .fusion-row {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
}
.fusion-header .fusion-row::after,
.fusion-header .fusion-row::before,
.fusion-header .fusion-clearfix {
  display: none !important;
  visibility: hidden !important;
}
.adhoc-menu {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}
.top-menu,
.bottom-menu {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: right !important;
  text-transform: uppercase !important;
  /*font-family: var(--font-subtitulo) !important;*/
}
.menu-social {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  margin-right: 10px !important;
}
.menu-social i {
  color: var(--color-principal) !important;
}
.bottom-menu > a {
  color: black !important;
  background-color: white !important;
  padding: 0 20px !important;
  font-size: 16px !important;
  height: 55px !important;
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
  border-right: 1px solid rgba(0, 0, 0, 0.05) !important;
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 10px !important;
}
.bottom-menu .header-button-reserva {
  background: var(--color-secundario) !important;
  color: white !important;
}
.bottom-menu .header-button-guia {
  background: white !important;
  color: black !important;
}
.bottom-menu .header-button-reserva:hover {
  color: white !important;
}
.bottom-menu .header-button-guia:hover {
  color: black !important;
}
.bottom-menu > a:hover {
  color: inherit !important;
}
.menu-dropdown {
  position: relative !important;
  display: inline-block !important;
  width: auto !important;
}
.dropdown-button {
  display: inline-flex !important;
  background-color: white !important;
  color: black !important;
  padding: 0 10px !important;
  text-align: center !important;
  cursor: pointer !important;
  border: none !important;
  height: 55px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  font-size: 16px !important;
  border-right: 1px solid rgba(0, 0, 0, 0.05) !important;
}
.dropdown-content {
  display: none !important;
  position: absolute !important;
  background-color: white !important;
  border: 1px solid #ccc !important;
  width: 100% !important;
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.05) !important;
  z-index: 1 !important;
}
.dropdown-content a {
  display: block !important;
  padding: 10px !important;
  text-decoration: none !important;
  color: #333 !important;
}
.dropdown-content a:hover {
  background-color: #f1f1f1 !important;
}
.menu-dropdown:hover .dropdown-content {
  display: block !important;
}
.burger,
.close-burger {
  font-family: var(--font-contenido) !important;
  cursor: pointer !important;
  gap: 10px !important;
  background: var(--color-principal) !important;
  height: 55px !important;
  color: white !important;
  font-size: 16px !important;
  border: none !important;
  padding: 0 20px !important;
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 10px !important;
  text-transform: uppercase !important;
}
.menu-lateral {
  opacity: 0 !important;
  width: 100% !important;
  background-color: white !important;
  left: 100% !important;
  position: fixed !important;
  top: 0 !important;
  z-index: 10 !important;
  height: 100vh !important;
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px !important;
  transition: all 0.3s !important;
}
.menu-lateral.activo {
  left: 0px !important;
  opacity: 1 !important;
}
.menu-header {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: end !important;
}
.menu-body {
  position: relative !important;
  display: flex !important;
  flex-direction: row !important;
  justify-content: start !important;
  gap: 5rem !important;
  margin-top: 40px !important;
  height: 100% !important;
}
.menu-img {
  width: 600px !important;
  height: 425px !important;
  position: absolute !important;
  margin-left: 25px !important;
}
.menu-img > .menu-img-item {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  opacity: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-size: cover !important;
  background-position: center !important;
  transition: all 0.3s !important;
}
.menu-img > .menu-img-item > div {
  position: absolute !important;
  background: white !important;
  width: calc(100% - 100px) !important;
  padding: 20px !important;
  top: calc(100% - 50px) !important;
  left: 50px !important;
  box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px !important;
}
.menu-img > .menu-img-item > div h4 {
  font-family: var(--font-subtitulo) !important;
  color: var(--color-principal) !important;
  margin: 0 !important;
  margin-bottom: 10px !important;
  font-weight: 600 !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
  padding-bottom: 10px !important;
}
.menu-img > .menu-img-item > div p {
  margin: 0 !important;
  font-family: var(--font-contenido) !important;
}
.menu-img > .menu-img-item.hover {
  opacity: 1 !important;
  animation: slide 0.3s ease-in-out forwards !important;
}
.menu,
.menu .sub-menu {
  font-family: var(--font-subtitulo) !important;
  color: var(--color-principal) !important;
  font-weight: 600 !important;
  list-style: none !important;
  padding-left: 0px !important;
  font-size: 30px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  line-height: 1.1 !important;
  position: absolute !important;
}
.menu .sub-menu {
  display: none !important;
  list-style: none;
  width: 250px;
  text-align: left;
  font-size: 18px !important;
  font-weight: 400 !important;
  gap: 14px !important;
}
.menu {
  right: 300px !important;
  width: 350px !important;
  text-align: right !important;
  border-right: 1px solid rgba(0, 0, 0, 0.15) !important;
  padding-right: 25px !important;
}
.menu .sub-menu.hover {
  display: flex !important;
  right: -275px !important;
}
.menu-lateral .menu > .menu-item > a {
  text-transform: uppercase !important;
  font-size: 26px !important;
}
.menu-lateral .menu > .menu-item.hover > a {
  color: var(--color-principal) !important;
}
.menu-lateral .menu > .menu-item {
  opacity: 0;
}
.menu-lateral .menu > .menu-item.open {
  animation: aparecer 0.3s ease-in-out forwards;
}
.menu-lateral .menu .sub-menu > .menu-item {
  opacity: 0;
}
.menu-lateral .menu .sub-menu.hover > .menu-item {
  animation: aparecer 0.3s ease-in-out forwards;
}
.menu-big {
  display: block !important;
}
.menu-small {
  display: none !important;
  width: 100% !important;
  font-family: var(--font-subtitulo) !important;
  overflow: auto !important;
  position: relative !important;
}
.small-menu {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.small-menu > li {
  border-bottom: 1px solid #e0e0e0 !important;
  position: relative !important;
}
.small-menu > li > a {
  display: flex !important;
  color: var(--color-principal) !important;
  justify-content: space-between !important;
  align-items: center !important;
  font-weight: bold !important;
  padding: 1rem !important;
  text-decoration: none !important;
  cursor: pointer !important;
}
.small-menu li a:hover {
  background-color: #f9f9f9 !important;
}
.small-menu .sub-menu {
  max-height: 0 !important;
  overflow: hidden !important;
  transition: max-height 0.4s ease !important;
  background-color: #f5f5f5 !important;
  list-style: none !important;
}
.small-menu .sub-menu li a {
  padding: 0.75rem 0rem !important;
  display: block !important;
  color: #1e2a44 !important;
  font-weight: normal !important;
  text-decoration: none !important;
  font-size: 0.95rem !important;
}
.small-menu .menu-item.open > .sub-menu {
  max-height: 1000px !important;
  transition: max-height 0.6s ease !important;
}
.small-menu i {
  position: absolute !important;
  rotate: -90deg !important;
  top: 6px !important;
  right: 1rem !important;
  cursor: pointer !important;
  padding: 1rem !important;
  transition: rotate 0.3s !important;
  color: var(--color-principal) !important;
}
.small-menu .menu-item.open i {
  rotate: 0deg !important;
}
.bg-menu-logo {
  position: absolute !important;
  top: -10vh !important;
  right: -189px !important;
  width: auto !important;
  height: 90vh !important;
  /*filter: brightness(2.2) !important;*/
  opacity: 0.1 !important;
  pointer-events: none !important;
}
.bg-menu-logo-small {
  position: absolute !important;
  width: auto !important;
  right: 0 !important;
  bottom: 100px !important;
  filter: brightness(2.2) !important;
  opacity: 0.2 !important;
  pointer-events: none !important;
}
.menu-search {
  height: 55px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 10px !important;
  background: white !important;
  z-index: 1 !important;
}
.menu-search input {
  width: 100% !important;
  height: 100% !important;
  border: none !important;
  background: transparent !important;
  color: var(--color-principal) !important;
  font-size: 16px !important;
  font-family: var(--font-subtitulo) !important;
}
.menu-search button {
  background: transparent !important;
  border: none !important;
  cursor: pointer !important;
  padding: 20px !important;
}
.search-results {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2rem !important;
}
.search-results > li {
  display: flex !important;
  flex-direction: column !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2) !important;
  padding-bottom: 2rem !important;
}
.search-results > li:last-child {
  border-bottom: none !important;
  padding-bottom: 0px !important;
}
.search-results > li > a {
  color: var(--color-principal) !important;
  font-size: 1.2rem !important;
  font-weight: 600 !important;
  font-family: var(--font-subtitulo) !important;
}
.search-results > li > code {
  font-size: 0.8rem !important;
  margin-bottom: 20px !important;
}
.search-results > li strong {
  color: var(--color-principal) !important;
}

.icon-wrapper {
  display: inline-block !important;
  position: relative !important;
  width: 1em !important;
  height: 100% !important;
  overflow: hidden !important;
  vertical-align: middle !important;
}

.close-burger .icon-wrapper {
  margin-right: 0 !important;
}

.icon-wrapper i {
  position: absolute !important;
  left: 0 !important;
  width: 100% !important;
  transition: all 0.3s ease !important;
}

.icon-top {
  top: 50% !important;
  transform: translateY(-50%) !important;
}

.icon-bottom {
  top: 100% !important;
  transform: translateY(50%) !important;
}

.header-button-guia:hover .icon-top,
.header-button-reserva:hover .icon-top,
.dropdown-button:hover .icon-top,
.burger:hover .icon-top,
.close-burger:hover .icon-top {
  top: 0 !important;
  transform: translateY(-150%) !important;
}

.header-button-guia:hover .icon-bottom,
.header-button-reserva:hover .icon-bottom,
.dropdown-button:hover .icon-bottom,
.burger:hover .icon-bottom,
.close-burger:hover .icon-bottom {
  top: 50% !important;
  transform: translateY(-50%) !important;
}

/* BODY */

/* ----- ACORDEON ----- */
.acordeon [data-vc-accordion] {
  background: var(--color-principal) !important;
  color: white !important;
  transition: all 0.3s !important;
  text-transform: uppercase !important;
  font-family: var(--font-subtitulo);
  font-size: 20px !important;
  font-weight: 300 !important;
}
.acordeon [data-vc-accordion]:hover {
  background: var(--color-atenuado) !important;
}
.acordeon .vc_tta-panel-body {
  background: white !important;
  overflow-x: auto !important;
}
.acordeon .vc_tta-controls-icon::before {
  border-color: white !important;
}
.acordeon .vc_tta-panel {
  border: 2px solid white !important;
}

/* ----- GRID EMPLEADOS ----- */

.empleados-grid {
    display: grid;
	align-items: flex-start;
    justify-content: center;
    grid-template-columns: repeat(auto-fit, minmax(300px, 2fr))!important;
    gap: 35px;
}

.empleados-grid.empleados-grid-3col {
	grid-template-columns: repeat(auto-fit, minmax(350px, 2fr))!important;
}

.empleado-block {
	display: flex;
    flex-direction: column;
    align-items: center;
	padding: 20px 30px;
    border-radius: 10px;
    transition: all 0.3s;
}

.empleado-block.empleado-conpopup {
	cursor: pointer;
}

.empleado-block:hover {
	box-shadow: rgba(255, 154, 20, 0.5) 0px 0px 0px 1px !important;
}

.empleado-block > img {
    object-fit: cover;
    object-position: top center;
    width: 150px;
    height: 150px;
    position: relative;
    border-radius: 300px;
}

.texto h4.empleado-nombre {
	color: var(--color-principal) !important;
	margin-top: 14px !important;
	margin-bottom: 0px !important;
    line-height: 24px !important;
	text-align: center;
}

.empleado-posicion {
    margin-bottom: 0px !important;
    font-weight: 300 !important;
    font-size: 15px !important;
	text-align: center;
}

.empleado-popup {
	display: none;
	position: fixed;
    z-index: 999999999;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100vh;
}

.empleado-popup-overlay {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
    height: 100vh;
    background-color: rgba(255, 255, 255, 0.5);
}

.empleado-popupbox {
	background-color: white;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
	border: 3px solid;
    border-color: var(--color-principal);
    padding: 50px;
	max-width: 750px;
	width: 95%;
}

.empleado-popup-cerrar {
    position: absolute;
	font-size: 40px;
	line-height: 30px;
    top: 5px;
    right: 8px;
	cursor: pointer;
}

/* ----- FORMULARIOS ----- */

.gform-theme--foundation .gform_fields {
	row-gap: 16px !important;
}

.gform-datepicker {
	width: 100% !important;
}

.fila-inversa .gform-body fieldset.gfield--type-checkbox legend,
.fila-inversa .gform-body fieldset.gfield--type-checkbox label.gform-field-label { color: white; }

/* ----- NEWSLETTERS ----- */

.newsletter-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 2fr))!important;
    gap: 35px;
}

.title-newsletter {
	font-size: 20px !important;
	line-height: 24px !important;
	margin-top: 35px !important;
	text-align: center;
}

.pagination-newsletter {
	margin-top: 64px;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
	justify-content: center !important;
    gap: 10px !important;
}

.pagination-newsletter a {
    background-color: var(--color-principal) !important;
    color: #fff !important;
    padding: 10px !important;
    padding-left: 25px !important;
    font-size: 16px !important;
    padding-right: 25px !important;
}

@media (max-width: 400px) {
	.newsletter-grid {
		grid-template-columns: repeat(auto-fit, minmax(100%, 2fr))!important;
	}
}

/* ----- ADMISIONES ----- */

.seccion-timeline {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
  gap: 35px !important;
}
.seccion-timeline:before,
.seccion-timeline:after {
	display: none !important;
}
.seccion-timeline .timeline-item {
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}
.seccion-timeline .timeline-item h3 {
  position: relative !important;
  font-size: 80px !important;
  color: white !important;
  font-family: var(--font-titulo) !important;
  font-weight: 300 !important;
  background: var(--color-principal) !important;
  transition: all 0.3s !important;
  text-align: center !important;
  font-weight: 400 !important;
  padding: 20px !important;
  clip-path: polygon(0 0, calc(100% - 60px) 0, 100% 50%, calc(100% - 60px) 100%, 0 100%, 60px 50%) !important;
}
.seccion-timeline .timeline-item.timeline-first h3 {
  clip-path: polygon(0 0, calc(100% - 60px) 0, 100% 50%, calc(100% - 60px) 100%, 0 100%, 0 50%) !important;
}
.seccion-timeline .timeline-item h3:hover {
  background: var(--color-atenuado) !important;
}
.seccion-timeline .timeline-item > .vc_column-inner > .wpb_wrapper {
	height: 100%;
    display: flex;
    flex-direction: column;
}
.seccion-timeline .timeline-item .timeline-borde {
  padding: 20px !important;
  border: 3px solid var(--color-atenuado) !important;
  flex: 1;
}
.seccion-timeline .timeline-item .timeline-borde h5 {
  color: black !important;
  text-align: center !important;
  font-family: var(--font-subtitulo) !important;
  font-weight: 300 !important;
  text-transform: uppercase !important;
  margin: 0 !important;
  margin-bottom: 20px !important;
  font-size: 20px !important;
}
.seccion-timeline .timeline-item .timeline-borde p {
  font-family: var(--font-contenido) !important;
  line-height: 1.3 !important;
  margin: 0 !important;
}

.acordeon-faq [data-vc-accordion] {
  display: grid !important;
  grid-template-columns: auto auto !important;
  justify-content: flex-start !important;
  gap: 1rem !important;
  background: transparent !important;
  text-transform: uppercase !important;
  font-family: var(--font-subtitulo);
  color: black !important;
  font-size: 20px !important;
  font-weight: 300 !important;
  transition: all 0.3s !important;
}
.acordeon-faq [data-vc-accordion] .vc_tta-controls-icon {
  position: relative !important;
  top: 0 !important;
  transform: translateY(25%) !important;
  right: 0 !important;
}
.acordeon-faq [data-vc-accordion] .vc_tta-controls-icon::before {
  border-color: var(--color-atenuado) !important;
}
.acordeon-faq [data-vc-accordion]:hover .vc_tta-controls-icon::before,
.acordeon-faq .vc_active .vc_tta-controls-icon::before {
  border-color: var(--color-principal) !important;
}
.acordeon-faq [data-vc-accordion]:hover,
.acordeon-faq .vc_active [data-vc-accordion] {
  color: var(--color-atenuado) !important;
}
.acordeon-faq .vc_tta-panel-heading,
.acordeon-faq .vc_tta-panel-body {
  border: none !important;
  border-top: 1px solid var(--color-principal) !important;
  border-bottom: 1px solid var(--color-principal) !important;
  background: transparent !important;
}

/* ----- BLOG ----- */

.contenedor-blog .vc_btn3-container > a {
	align-items: center !important;
	position: relative !important;
	background: var(--color-principal) !important;
	color: white !important;
	text-transform: uppercase !important;
	font-family: var(--font-contenido) !important;
	font-weight: 600 !important;
	line-height: normal !important;
	padding: 8px 15px !important;
	border-radius: 9999px !important;
	border: none !important;
	font-size: 16px !important;
	box-shadow: none !important;
	min-width: 150px !important;
}

/* FOOTER */

.footer-adhoc .fa-solid {
  color: white !important;
  margin-right: 14px !important;
}
.footer-adhoc {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
}
.footer-adhoc p {
  margin: 0 !important;
}
.footer-adhoc strong {
  font-weight: 600 !important;
  color: white !important;
}
.footer-adhoc > div {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
}
.footer-adhoc .grid-info {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 0 3rem !important;
}
.footer-adhoc .grid-info > div {
  display: flex !important;
  flex-direction: row !important;
  gap: 10px !important;
}
.footer-adhoc .logos {
  display: flex !important;
  flex-direction: row !important;
  gap: 1rem !important;
}
.footer-adhoc .logos img {
  height: 50px !important;
  width: auto !important;
  object-fit: cover !important;
}
.footer-adhoc .links {
  display: flex !important;
  flex-direction: row !important;
  gap: 20px !important;
}
.footer-adhoc > div:last-child {
  align-items: end !important;
  gap: 22px !important;
}
.footer-adhoc a:hover {
  color: white !important;
}

.footer-subvencion {
	background-color: #fff;
	text-align: center;
	padding: 20px 15px;
}

.footer-subvencion img {
	max-width: 1400px;
}

@media (max-width: 1400px) {
	.footer-subvencion img {
		max-width: 100%;
	}
}

/* ----- ANIMACIONES ----- */
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(-5px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes aparecer {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes slide {
  from {
    transform: translateX(-30px);
  }
  to {
    transform: translateX(0px);
  }
}
@keyframes jelly {
  from {
    transform: scale(1, 1);
  }
  30% {
    transform: scale(1.25, 0.75);
  }
  40% {
    transform: scale(0.75, 1.25);
  }
  50% {
    transform: scale(1.15, 0.85);
  }
  65% {
    transform: scale(0.95, 1.05);
  }
  75% {
    transform: scale(1.05, 0.95);
  }
  to {
    transform: scale(1, 1);
  }
}