.missatge-sense-ofertes {
  padding: 18px;
  margin: 12px 0;
  background: #f5f5f5;
  border-radius: 10px;
}


.curs-docent-modalitat-hores {
  font-size: 26px !important;
  color: black;
}

.curs-docent-modalitat-hores .modalitat:before,
.curs-docent-modalitat-hores .modalitat:after {
  content: " · ";
}

@media (max-width: 980px) {
  .curs-docent-modalitat-hores {
    gap: 9px !important;
    display: flex !important;
    flex-direction: column;
  }

  .curs-docent-modalitat-hores .separador {
    display: none;
  }
  .curs-docent-modalitat-hores .modalitat:before,
  .curs-docent-modalitat-hores .modalitat:after {
    content: "";
  }
}

@media (min-width: 980px) {
  .curs-docent-modalitat-hores {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
  }
}

.curs-docent-modalitat-hores .docent {
  font-weight: 600;
  color: #043ea7;
}

.curs-docent-modalitat-hores .docent:before {
  content: "Amb ";
  color: black;
  font-weight: 400;
}

.curs-docent-modalitat-hores .hores:after {
  content: " hores";
  color: black;
}

/* ------------------------------------- */

/* SECCIO PREUS CURSOS MODALITATS */

.seccio-preus,
.descomptes-cursos,
.tarifa-preus-decomptes {
  font-family: "Suisse Int'l";
}
.seccio-preus .preu {
  font-size: 50px;
  /*     font-weight: 500; */
  margin-bottom: 8px;
}

.seccio-preus #nosoci .preu {
  font-size: 60px;
}

.tarifa-preus-decomptes h2 {
  font-size: 40px;
  color: #000000 !important;
  line-height: 1.2em;
  font-family: "Suisse Int'l";

  margin-bottom: 10px;
}

.seccio-preus h2 {
  font-size: 35px;
  line-height: 1.3em;
  margin-bottom: 0;
  color: white !important;
  padding: 0 !important;
}

.seccio-preus .preu,
.tipo-soci,
.tipo-soci .titular-pricebox,
.associat-cecot .titular-pricebox,
.associat-cecot .text-titular,
.associat-cecot .text-titular,
.cta-pricebox-card {
  color: white;
}

#nosoci {
  border-radius: 20px;
  padding: 25px;
}

#associat {
  border-radius: 20px;
}

#associat h2 {
  padding: 25px 25px 0px 25px !important;
}
.associat-cecot {
  border-radius: 0px 0px 20px 20px;
  padding: 15px 25px;
  width: 100%;
}

.modalitats-socis {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  padding: 0px 25px;
  gap: 40px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.modalitats-socis .titular-pricebox {
  font-size: 25px;
  margin-bottom: 5px;
}
.modalitats-socis .preu {
  font-size: 43px;
  margin-bottom: 8px;
}

.associat-cecot h3 {
  font-size: 17px;
  line-height: 1.3em;
}

.tipo-nosoci {
  background: #f5f5f5;
}

.text-titular {
  font-size: 17px;
  font-weight: 400;
}
.boto-inscripcio {
  background: white;
  color: #039;
  padding: 8px 20px;
  border-radius: 50px;
  font-size: 17px;
  margin-top: 10px;
}

.boto-inscripcio:hover {
  background: #dcdcdc;
}

.tipo-nosoci .text-titular,
.associat-cecot .preu,
.tipo-nosoci .preu {
  color: #333;
}

.tipo-soci {
  background: #039;
}

.titular-pricebox {
  font-size: 28px;
  font-weight: 400 !important;
  padding-bottom: 0px;
}

.associat-cecot {
  background: #00b9e9;
}

.seccio-preus .preu {
  line-height: 1em;

  padding: 0;
  margin-bottom: 0 !important;
}

@media (min-width: 1080px) {
  .grid-preus {
    display: grid;
    grid-template-columns: 4fr 8fr;
    /* 	grid-template-rows: repeat(2, 1fr); */
    column-gap: 30px;
    row-gap: 30px;
  }

  .descomptes-cursos .row-preus-cursos {
    display: grid;
    grid-template-columns: 1fr 2fr;
    column-gap: 30px;
    row-gap: 30px;
  }

  .pricebox-card #persona-desocupada,
  .pricebox-card #nosoci {
    display: flex;
    align-items: baseline;
    gap: 5px 20px;
    flex-wrap: wrap;
  }

  .img-empreses {
    display: flex;
    gap: 20px;
    flex-direction: row;
    margin-bottom: 20px;
  }
}

@media (max-width: 1080px) {
  .grid-preus {
    display: flex;
    flex-direction: column;
    column-gap: 30px;
    row-gap: 30px;
  }

  .img-empreses {
    display: none;
  }

  .descomptes-empreses {
    margin-top: 35px;
  }
}

.row-preu-cursos #bonificacio-curs {
  display: flex;
  justify-content: center;
  /*     background: #FBC158; */
  border-radius: 20px;
  padding: 25px;

  margin: 30px 0;
  border: 1px solid #039;
}

.row-preu-cursos #bonificacio-curs h3 {
  text-align: center;
  padding-bottom: 0;
  font-weight: 400;
  font-size: 22px;
  color: #039;
}

.url-gestionar {
  font-family: "Suisse Int'l", sans-serif !important;
  font-size: 18px;
}

.row-preu-cursos #bonificacio-curs h3 a {
  text-decoration: underline;
}

.iva-inclos {
  font-size: 18px;
  font-family: "Suisse Int'l";
}

.preu-bonificacio-curs {
  font-weight: 500;
  font-family: "Suisse Int'l";
}

.cta-pricebox-card,
.cta-descomptes-empreses {
  font-size: 18px;
  text-decoration: underline;
}

.associat-cecot .text-titular {
  margin-bottom: 15px;
  font-size: 20px;
  line-height: 1.3em;
  margin-top: 8px;
}

.descomptes-persones,
.descomptes-empreses {
  border: 1px solid #039;
  border-radius: 20px;
  padding: 25px;
}

.preu-descompte,
.preu-descompte .dte {
  color: #2a2a2a;
  font-family: "Suisse Int'l";
  font-weight: 500;
  line-height: normal;
}

.preu-descompte {
  font-size: 45px;
}

.preu-descompte .dte {
  font-size: 25px;
}

.text-descompte {
  color: #039;
  font-size: 24px;
  font-weight: 400;
  line-height: 1.3em;
}

.comentari-descompte {
  color: #515151;
  font-size: 17px;
  font-weight: 400;
}

.img-empreses img {
  max-width: 200px;
}
/* 
#open {
	    grid-area: 1 / 1 / 2 / 2;
} */

/* #individual-basic {
	grid-area:  1 / 2 / 2 / 3;
} */

/* #plus-avancat-premium {
	grid-area: 1 / 3 / 2 / 4;
	background: #FBC158;
	
} */

/* #plus-avancat-premium .titular-pricebox {
	color: #000;
} */

/* #associat {
	    grid-area: 2 / 1 / 3 / 3;
}

#desocupat-nosoci-wrap {
	    grid-area: 2 / 3 / 3 / 4;
} */

#desocupat-nosoci-wrap .titular-pricebox {
  font-size: 22px;
}

.cta-descomptes-empreses {
  margin-top: 20px;
}

.pricebox-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.carrusel-pista .et_pb_column {
  margin-top: 0 !important;
}

/* FINAL SECCIO PREUS CURSOS MODALITATS */

/* -------- pàgina cursos --------- */

/* ------- filtres ------------ */

.row-filtres {
  grid-area: sidebar;
  margin: 0 !important;
  border-right: 1px solid #666666;

  /*  estils sticky	 */

  position: -webkit-sticky;
  position: sticky;
  top: 154px;
  padding: 0px 0px 0px 0px !important;
  /*     box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
    border: 1px solid #d5d5d5; */
  /* background: #d5d5d5; */
  /*     border-radius: 10px; */
  height: 100vh;
}

/*ESTILS DATA MENÚ LATERAL*/

.data-menu {
  appearance: none;
  color: #1d1d1d;
  font-family: "Suisse Int'l", sans-serif !important;
  font-size: 14px;
  border: 1px solid #ecf0f1;
  background: #f5f5f5;
  padding: 4px;
  display: inline-block;
  visibility: visible;
  width: 140px;
  border-radius: 5px;
}

.row-cursos {
  grid-area: content;
  margin: 0 !important;

  margin-top: 20px !important;
}

.et_pb_row.row-filtres,
.et_pb_row.row-cursos {
  width: 100% !important;
}

.row-filtres .et_pb_column {
  overflow-y: auto;
  max-height: calc(100vh - 154px) !important;
  scrollbar-width: thin;
}

.tags-cursos {
  display: flex;
  gap: 20px;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  align-content: center;

  margin: 40px 0;
}

/*  ------------------------   */

/*  ------ sidebar -------  */

.filtres-generals {
  font-size: 16px;
  font-family: "Suisse Int'l", sans-serif !important;
  font-weight: normal;
  font-style: normal;
  color: #000000;

  display: flex;
  flex-direction: column;
  /*     gap: 15px; */
  align-items: flex-start;
  padding-right: 20px;
  margin-bottom: 20px;
  padding-top: 20px;
  margin-left: 35px;
}

.filtres-generals label {
  font-size: 16px;
  font-family: "Suisse Int'l", sans-serif !important;
  font-weight: normal;
  font-style: normal;
  color: #000000;
}

.filtres-generals label.valor-checkbox {
  color: #666666;
  align-self: end;
}

.checkbox-cursos {
  gap: 7px;
  display: flex;
  align-items: baseline;
  font-size: 16px;
  color: #000000;

  flex-wrap: wrap;
  column-gap: 7px;
  row-gap: 0;
}

.checkbox-cursos input {
  margin: 0 !important;
}

.grup-checkbox {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;

  margin-top: 20px;
}

.filtrar-categoria {
  width: 100%;
}
.buscador-cursos {
  /* 	    display: flex;
    flex-direction: row;
    align-content: center;
    justify-content: space-between; */

  margin-top: 12px;
}

.buscador-search {
  width: 100%;
  display: flex;
}

.buscador-form {
  display: flex;
  flex-direction: row;
}

.buscador-input {
  width: 80%;
  border-top: 1px solid #043ea7;
  border-bottom: 1px solid #043ea7;
  border-left: 1px solid #043ea7;
  border-right: 0;
  padding: 8px 20px;
  border-radius: 10px 0px 0px 10px;
  flex: 1;

  font-size: 16px;
  font-family: "Suisse Int'l", sans-serif !important;
  font-weight: normal;
  font-style: normal;
  color: #000000;
}

.buscador-button {
  border-top: 1px solid #043ea7;
  border-bottom: 1px solid #043ea7;
  border-left: 1px solid #043ea7;
  border-right: 1px solid #043ea7;
  padding: 8px 13px;
  border-radius: 0px 10px 10px 0px;
  background: #043ea7;
}

.buscador-button:hover {
  border-top: 1px solid #001438;
  border-bottom: 1px solid #001438;
  border-left: 1px solid #001438;
  border-right: 1px solid #001438;
  padding: 8px 13px;
  border-radius: 0px 10px 10px 0px;
  background: #001438;
}

.tag-curs {
  padding: 8px 20px;
  border: 1px solid #043ea7;
  border-radius: 10px;
  background: #f8f8ff;
  font-size: 16px;

  display: flex;
  align-content: center;
  align-items: center;
  flex-direction: row;
  gap: 9px;
}

.tag-curs:hover {
  background: #dbe7ff;
}

/* .tag-subrallat {

	text-decoration: underline;
	font-size: 16px; 
	 font-family: 'Suisse Int\'l', sans-serif !important;
  font-weight: normal;
  font-style: normal;
	color: #043ea7;
} */

.select-borsa-cursos select {
  border: none;
  font-size: 18px;
  color: #666666;
  background: transparent;
  width: 200px;
  option {
    border: none;
    font-size: 18px;
    color: #666666;
    background: transparent;
    font-family: "Suisse Int'l", sans-serif !important;
    font-weight: normal;
    font-style: normal;
  }
}

.select-borsa-cursos option {
  background: transparent;
}

.grid-cursos-page {
  display: grid;
  gap: 40px;
  grid-template-areas:
    "sidebar"
    "content";
  max-width: 95%;
  margin: 0 auto;
  /*     width: 1520px; */
}

@media (max-width: 800px) {
  .grid-cursos-page {
    max-width: 85%;
  }
}

/* responsive */

@media (max-width: 1024px) {
  /* amaga els filtres		 */
  .filtres-generals {
    display: none;
  }

  .filtres-cursos,
  .filtres-borsa {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    /* align-content: center; */
    align-items: baseline;
    margin-top: 15px;
  }
  .select-borsa-cursos {
    font-size: 18px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;

    display: none;
  }

  .num-resultats,
  .num-resultats-general,
  .select-borsa-cursos .titulars-cursos,
  .num-resultats-borsa {
    color: #858585;
    font-style: normal;
    font-size: 14px;
    line-height: 1.3em;

    /*         margin-bottom: 15px; */

    font-family: "Suisse Int'l", sans-serif !important;
    font-weight: normal;
    font-style: normal;
    gap: 3px !important;
  }

  .tags-cursos {
    margin: 20px 0px 40px 0;
    display: none;
  }

  .tag-curs {
    padding: 4px 10px;
    font-size: 14px;
  }

  .button-mobil-curs {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    background: #043ea7;
    font-size: 18px;
    border-radius: 10px;

    color: white;
  }

  .button-mobil-curs:hover {
    box-shadow:
      rgba(50, 50, 93, 0.25) 0px 13px 27px -5px,
      rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
  }
}

/* --------------------------- */

/* escriptori */

@media (min-width: 1023px) {
  .grid-cursos-page {
    grid-template-columns: 4fr 8fr;
    grid-template-areas: "sidebar content ";
    align-items: start;
  }

  .filtres-mobil {
    display: none;
  }

  .filtres-cursos,
  .filtres-borsa {
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap;
    margin-bottom: 20px;
  }
  .select-borsa-cursos {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
  }

  .tag-curs {
    padding: 3px 12px;
    border-radius: 50px;
    font-size: 14px;
  }
}

@media (min-width: 1440px) {
  .grid-cursos-page {
    grid-template-columns: 1fr 3fr;
    grid-template-areas: "sidebar content ";
    align-items: start;
  }
}

.resizeing-curs {
  min-height: 115px;
}

/* --------------------------- */

/* pagina de test .page-id-2109, canviar per la definitiva */

/* Hace que el título y la flecha vayan en la misma línea */
/* .filtrar-tematica .titulars-cursos,
.filtrar-tematica .tag-subrallat {
  display: inline-block;
  vertical-align: middle;
} */

/* Un pequeño espacio entre el texto y la flecha */
.filtrar-tematica .titulars-cursos {
  margin-right: 0.25rem;
}

/* La flecha como icono */
.filtrar-tematica .tag-subrallat::before {
  content: url(https://ifep.cat/wp-content/uploads/2025/12/feltxa-amunt-cursos.svg); /* flecha hacia abajo */
}

/* Cuando JS pone data-expanded="true", cambiamos la flecha */
.filtrar-tematica .tag-subrallat[data-expanded="true"]::before {
  content: url(https://ifep.cat/wp-content/uploads/2025/12/feltxa-avall-cursos.svg); /* flecha hacia arriba */
}

/* pagina de test .page-id-2109, canviar per la definitiva */

/* La flecha como icono */
.filtrar-tematica .tag-subrallat::after {
  content: url(https://ifep.cat/wp-content/uploads/2025/12/feltxa-amunt-cursos.svg);
  margin-left: auto; /* flecha hacia abajo */
}

.filtrar-tematica .tag-subrallat::before {
  content: none; /* flecha hacia abajo */
}

/* Cuando JS pone data-expanded="true", cambiamos la flecha */
.filtrar-tematica .tag-subrallat[data-expanded="true"]::after {
  content: url(https://ifep.cat/wp-content/uploads/2025/12/feltxa-avall-cursos.svg);
  margin-left: auto; /* flecha hacia arriba */
}

.filtrar-tematica .tag-subrallat[data-expanded="true"]::before {
  content: none; /* flecha hacia arriba */
}

@media (max-width: 1024px) {
  .cercador-curs {
    display: none;
  }

  .grid-cursos-page {
    gap: 10px;
  }

  /* 	.botons-cursos, .et_pb_row.row-cursos {
		    padding: 2px;
	} */
  .et_pb_row.row-cursos {
    padding: 35px;
    min-height: 80vh;
  }

  .filtres-generals {
    display: inherit;
    padding-right: 0 !important;
    padding-top: 26px !important;
    padding-bottom: 0 !important;
    margin-left: 26px;
  }


.grid-cursos-page {
  max-width: 100%;
}

.buscador-escriptori-filtres {
  display: none;
}

.header-filtres .titulars-cursos,
.content-filtres .titulars-cursos {
  color: #000;
  text-align: center;

  font-size: 22px;
  font-style: normal;
  font-weight: 400;
  line-height: 100%; /* 22px */
}

.titulars-cursos {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  gap: 10px;
  align-items: baseline;
}

.grup-checkbox {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  align-self: stretch;
}

.filtres-generals label {
  font-size: 18px;
  max-width: 65%;
  line-height: 125%;
}

.valor-checkbox {
  display: none;
}

.checkbox-cursos {
  flex-direction: row-reverse;
  color: #3f3f3f;
  font-family: "Suisse Int'l";
  font-size: 18px;

  line-height: 125%;
  justify-content: space-between;
  width: 100%;

  flex-wrap: nowrap;
}

.checkbox-cursos input {
  width: 20px;
  height: 20px;
}

.filtrar-tematica {
  display: flex;
  flex-direction: column;

  border-bottom: 1px solid #d4d4d4;
  padding: 20px;
}

/* 	.checkbox-cursos[style="display: none;"] { 
		.grup-checkbox {
			display: none;
		}
		
	} */

.row-filtres {
  top: 0;
  position: relative;
  border-right: 0;
  height: inherit;
}

.aplicar-filtres {
  display: flex;
  justify-content: center;
  padding: 20px;
  background: #043ea7;
  color: white;
  text-align: center;
}

.select-borsa-cursos.escriptori {
  display: block;
  width: 100%;
  border-right: none;
  padding: 0;
}

.row-filtres .et_pb_column {
  overflow-y: inherit;
  max-height: inherit;
}

.footer-filtres {
  position: fixed;
  /* top: 100vh; */
  bottom: 0;
  width: 100%;
}

.header-filtres {
  position: sticky;
  top: 0px;
}
.buscador-cursos {
  margin-top: 0;
}

.botons-cursos {
  display: grid;
  grid-template-columns: 3fr 1fr;
  gap: 15px 30px;
  align-content: center;
  align-items: stretch;
  margin-top: 15px;
}

.botons-cursos .filtres-mobile {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #fbc158;
  border: none;
  border-radius: 10px;
  font-family: "Suisse Int'l";
  font-size: 16px;
}

.content-filtres {
  width: 100%;
  display: flex;
  flex-direction: column;
  /* align-content: space-between; */
  align-items: stretch;
  margin-top: 20px;
  margin-bottom: 63.8px;
}

}

@media (max-width: 380px) {
  .botons-cursos {
    align-items: stretch;
    display: flex !important;
    flex-direction: column;
    gap: 15px 30px !important;
  }

  .botons-cursos .filtres-mobile {
    padding: 10px;
  }
}

.contador-filtres-actius {
  color: #515151;
  text-align: right;
  font-family: "Suisse Int'l";
  font-style: normal;
  font-weight: 400;
  line-height: 150%; /* 21px */
}

/* Header mobil filtres */

.reset-cursos {
  color: #515151;
  text-align: right;
  font-family: "Suisse Int'l";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%; /* 21px */
}

.header-filtres {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-content: center;
  align-items: baseline;
  border-radius: 13px 13px 0 0;
  border-bottom: 1px solid #d4d4d4;
  background: #fff;

  padding: 20px;

  width: 100%;
}

.tancar-filtres,
.tancar-filtres:focus-visible,
.reset-cursos,
.reset-cursos:focus-visible {
  background: none;
  border: none;
}

/* end Header mobil filtres */

/* .filtrar-tematica {
	padding: 1px;
    margin-top: 42px;
    width: 100%;
    box-sizing: border-box;
	margin-left: 18px;
}
 */

.descomptes-cursos {
  margin-top: 35px;
}

@media (min-width: 1024px) {
  .header-filtres,
  .aplicar-filtres,
  .botons-cursos {
    display: none;
  }

  .cercador-curs .titulars-cursos {
    display: flex;
    justify-content: flex-start;
    gap: 8px;
  }

  .grup-checkbox {
    margin-top: 8px;
  }

  .filtrar-tematica {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }
}

/* Evitar scroll del body cuando el popup está abierto */
body.popup-obert {
  overflow: hidden;
}

/* Popup como overlay de pantalla completa */
#popup {
  display: none; /* lo controla jQuery (fadeIn / fadeOut) */
  position: fixed;
  inset: 0; /* top:0; right:0; bottom:0; left:0; */
  z-index: 9999;
}

/* Capa oscura de fondo */
#overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
}

/* Contenido del popup de filtros */
#popupContent {
  position: absolute;
  /*     top: 80px;                     /* altura del header */
  left: 0;
  right: 0;
  /*     width: 100vw; */
  height: calc(100vh - 155px); /* todo el espacio por debajo del header */
  /*     max-width: none; */
  background: #ffffff;
  box-shadow: none;
  overflow-y: auto;
  bottom: 0;
}

/* Aseguramos que los filtros se vean dentro del popup en móvil */
@media (max-width: 1024px) {
  #popup .filtres-generals {
    display: flex !important;
    flex-direction: column;
    padding-right: 0;
    /*     margin-top: 25px; */
    margin: 0;
    gap: 0 !important;
    margin-top: 58px !important;
  }
}

/* ------- final end pàgina borsa */
/* Mobile fix buscador (gana a .buscador-cursos { margin-top:0; }) */
/* Buscador aún más pequeño y centrado en móvil */
@media (max-width: 767px) {
  .filtres-generals .buscador-cursos {
    width: min(240px, 86vw);
    margin: 8px auto 0 !important;
  }

  .filtres-generals .buscador-cursos .buscador-input {
    height: 32px;
    padding: 0 8px;
    border-radius: 9px 0 0 9px;
  }

  .filtres-generals .buscador-cursos .buscador-button {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    border-radius: 0 9px 9px 0;
  }

  .filtres-generals .buscador-cursos .buscador-button svg {
    width: 14px;
    height: 14px;
  }
}



/*place holder borsatreball*/
/* No se vea el texto lorem */
.grid-borsa .card-borsa.is-skeleton * {
  color: transparent !important;
}

/* Caja gris */
.grid-borsa .card-borsa.is-skeleton {
  background: #f2f2f2;
  border-radius: 12px;
  min-height: 420px;
  position: relative;
  overflow: hidden;
}

/* Brillo animado */
.grid-borsa .card-borsa.is-skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-60%);
  background: linear-gradient(
    90deg,
    rgba(242, 242, 242, 0) 0%,
    rgba(255, 255, 255, 0.7) 50%,
    rgba(242, 242, 242, 0) 100%
  );
  animation: skel 1.1s infinite;
}

@keyframes skel {
  100% {
    transform: translateX(60%);
  }
}