@charset "UTF-8";
/*
 Theme Name:   Cesur Bricks Child Theme
 Theme URI:    https://lider.cesurformacion.com/
 Description:  Child theme para las landings de Cesur Formación.
 Author:       Luis Colomé y Carlos Van Eyk
 Author URI:   https://luiscolome.com/
 Template:     bricks
 Version:      1.1.5.5
 Text Domain:  cesurformacion
*/
:root {
  --clr-azul-cesur: #002858;
  --clr-amarillo-cesur: #ffc836;
  --clr-gris: #d4d4d4;
  --clr-gris-claro: #efefef;
  --clr-informatica: #e70267;
  --clr-audiovisual: #ff9100;
  --clr-aeronautica: #003044;
  --text-xs: clamp(0.875rem, 0.8269rem + 0.1923vw, 1rem);
  --text-s: clamp(1rem, 1rem + 0vw, 1rem);
  --text-m: clamp(0.9375rem, 0.8173rem + 0.4808vw, 1.25rem);
  --text-l: clamp(1.13rem, 0.13vw + 1.1rem, 1.2rem);
  --text-xl: clamp(1.35rem, 0.16vw + 1.31rem, 1.44rem);
  --text-lineheight: clamp(1.523rem, 0.177vw + 1.484rem, 1.625rem);
  --h1: clamp(1.875rem, 1.5144rem + 1.4423vw, 2.8125rem);
  --h2: clamp(1.25rem, 0.8894rem + 1.4423vw, 2.1875rem);
  --h3: clamp(1.25rem, 1.0096rem + 0.9615vw, 1.875rem);
  --h4: clamp(1.25rem, 0.652vw + 1.103rem, 1.625rem);
  --h5: clamp(1.13rem, 0.13vw + 1.1rem, 1.2rem);
  --h6: clamp(0.94rem, 0.11vw + 0.91rem, 1rem);
  --animation: all 0.5s cubic-bezier(0.5, 0.5, 0, 1);
  --gubr: 6px;
  --generica: url(https://recursos.cesurformacion.com/uploads/grid-unico/card-oferta-350x172-generica.webp);
  --administracion: url(https://recursos.cesurformacion.com/uploads/grid-unico/card-oferta-340x140-fam-administracion.webp);
  --comercio: url(https://recursos.cesurformacion.com/uploads/grid-unico/card-oferta-340x140-fam-comercio.webp);
  --deporte: url(https://recursos.cesurformacion.com/uploads/grid-unico/card-oferta-340x140-fam-deporte.webp);
  --edificacion: url(https://recursos.cesurformacion.com/uploads/grid-unico/card-oferta-340x140-fam-edificacion.webp);
  --electricidad: url(https://recursos.cesurformacion.com/uploads/grid-unico/card-oferta-340x140-fam-electricidad.webp);
  --hosteleria: url(https://recursos.cesurformacion.com/uploads/grid-unico/card-oferta-340x140-fam-hosteleria.webp);
  --imagen-per: url(https://recursos.cesurformacion.com/uploads/grid-unico/card-oferta-340x140-fam-imagen-personal.webp);
  --imagen-son: url(https://recursos.cesurformacion.com/uploads/grid-unico/card-oferta-340x140-fam-imagen.webp);
  --informatica: url(https://recursos.cesurformacion.com/uploads/grid-unico/card-oferta-340x140-fam-informatica.webp);
  --instalacion: url(https://recursos.cesurformacion.com/uploads/grid-unico/card-oferta-340x140-fam-instalacion.webp);
  --mantenimiento: url(https://recursos.cesurformacion.com/uploads/grid-unico/card-oferta-340x140-fam-aeronautica.webp);
  --sanidad: url(https://recursos.cesurformacion.com/uploads/grid-unico/card-oferta-340x140-fam-sanidad.webp);
  --seguridad: url(https://recursos.cesurformacion.com/uploads/grid-unico/card-oferta-340x140-fam-seguridad.webp);
  --sociocultural: url(https://recursos.cesurformacion.com/uploads/grid-unico/card-oferta-340x140-fam-sociocultural.webp);
  --g-generica: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-420x190-generica.webp);
  --gs-administracion: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-admin-superior.webp);
  --gm-administracion: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-admin-medio.webp);
  --gs-comercio: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-comercio-superior.webp);
  --gm-comercio: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-comercio-medio.webp);
  --gs-deporte: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-deporte-superior.webp);
  --gm-deporte: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-deporte-medio.webp);
  --gs-edificacion: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-edificacion-superior.webp);
  --gm-edificacion: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-edificacion-medio.webp);
  --gs-electricidad: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-electricidad-superior.webp);
  --gm-electricidad: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-electricidad-medio.webp);
  --gs-hosteleria: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-hosteleria-superior.webp);
  --gm-hosteleria: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-hosteleria-medio.webp);
  --gs-imagen-per: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-imagenpers-superior.webp);
  --gm-imagen-per: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-imagenpers-medio.webp);
  --gs-imagen-son: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-imagenson-superior.webp);
  --gm-imagen-son: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-imagenson-medio.webp);
  --gs-informatica: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-informatica-superior.webp);
  --gm-informatica: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-informatica-medio.webp);
  --gs-instalacion: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-mecatronica-superior.webp);
  --gm-instalacion: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-mecatronica-medio.webp);
  --gs-mantenimiento: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-automocion-superior.webp);
  --gm-mantenimiento: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-automocion-medio.webp);
  --gs-aeronautica: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-aeronautica-superior.webp);
  --gm-aeronautica: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-aeronautica-medio.webp);
  --gs-sanidad: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-sanidad-superior.webp);
  --gm-sanidad: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-sanidad-medio.webp);
  --gs-seguridad: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-seguridad-superior.webp);
  --gm-seguridad: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-seguridad-medio.webp);
  --gs-sociocultural: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-sociocultural-superior.webp);
  --gm-sociocultural: url(https://recursos.cesurformacion.com/uploads/grid-grados/grid-grados-415x185-sociocultural-medio.webp);
}

body {
  font-size: var(--text-m);
  line-height: var(--text-lineheight);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  line-height: 1.25;
}

h1 {
  font-size: var(--h1);
}

h2 {
  font-size: var(--h2);
}

h3 {
  font-size: var(--h3);
}

h4 {
  font-size: var(--h4);
}

h5,
h6 {
  font-size: var(--h5);
}

.heading-1 {
  font-size: var(--h1);
}

.heading-2 {
  font-size: var(--h2);
}

.heading-3 {
  font-size: var(--h3);
}

.heading-4 {
  font-size: var(--h4);
}

.heading-5,
.heading-6 {
  font-size: var(--h5);
}

.text-xs {
  font-size: var(--text-xs);
}

.text-s {
  font-size: var(--text-s);
}

.text-m {
  font-size: var(--text-m);
}

.text-l {
  font-size: var(--text-l);
}

.text-xl {
  font-size: var(--text-xl);
}

/* 
 * Se ha de añadir a las pestañas de Bricks en Style > CSS > CSS classes
 * la clase cesur-faq-tabs para que los estilos se apliquen. 
 * Existen clases extras tanto para informática como para Audiovisual.
 */
.brxe-tabs-nested.cesur-faq-tabs .tab-title,
.brxe-tabs-nested.cesur-faq-tabs .tab-title h3 {
  position: relative;
}
@media (min-width: 479px) {
  .brxe-tabs-nested.cesur-faq-tabs .tab-title::before {
    content: "";
    width: 100%;
    height: 4px;
    background-color: #002858;
    position: absolute;
    bottom: 0;
    left: 0;
    opacity: 0;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: left;
    transform-origin: left;
    -webkit-transition: opacity 0.3s 0.3s ease-out,
      -webkit-transform 0.3s ease-in-out;
    transition: opacity 0.3s 0.3s ease-out, -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, opacity 0.3s 0.3s ease-out;
    transition: transform 0.3s ease-in-out, opacity 0.3s 0.3s ease-out,
      -webkit-transform 0.3s ease-in-out;
  }
  .brxe-tabs-nested.cesur-faq-tabs .tab-title:hover::before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    opacity: 1;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  }
  .brxe-tabs-nested.cesur-faq-tabs .tab-title.brx-open::before {
    opacity: 1;
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }
}
@media (max-width: 478px) {
  .brxe-tabs-nested.cesur-faq-tabs .tab-title h3::before {
    content: "";
    width: 100%;
    height: 3px;
    background-color: #002858;
    position: absolute;
    bottom: -4px;
    left: 0;
    opacity: 0;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: left;
    transform-origin: left;
    -webkit-transition: opacity 0.3s 0.3s ease-out,
      -webkit-transform 0.3s ease-in-out;
    transition: opacity 0.3s 0.3s ease-out, -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, opacity 0.3s 0.3s ease-out;
    transition: transform 0.3s ease-in-out, opacity 0.3s 0.3s ease-out,
      -webkit-transform 0.3s ease-in-out;
  }
  .brxe-tabs-nested.cesur-faq-tabs .tab-title h3:hover::before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    opacity: 1;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  }
  .brxe-tabs-nested.cesur-faq-tabs .tab-title.brx-open h3::before {
    opacity: 1;
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }
}
@media (min-width: 479px) {
  .brxe-tabs-nested.cesur-faq-tabs.informatica .tab-title::before {
    background-color: #e70267;
  }
}
@media (max-width: 478px) {
  .brxe-tabs-nested.cesur-faq-tabs.informatica .tab-title h3::before {
    background-color: #e70267;
  }
}
@media (min-width: 479px) {
  .brxe-tabs-nested.cesur-faq-tabs.audiovisual .tab-title::before {
    background-color: #ff9100;
  }
}
@media (max-width: 478px) {
  .brxe-tabs-nested.cesur-faq-tabs.audiovisual .tab-title h3::before {
    background-color: #ff9100;
  }
}

/* Fluent Forms
----------------------------------------------------- */
/*.checknuevo{display:none;}*/
.checknormal {
  display: none;
}

/* Pasos formulario */
.oculto {
  display: none !important;
}

.ff-step-header {
  display: none;
}

/*Estilos formulario*/
.frm-fluent-form {
  padding: 17px;
  max-width: 100%;
}

.fluentform .ff-el-form-control {
  padding: 0px 15px !important;
  line-height: 2.4 !important;
  font-size: 14px !important;
  background-color: #fff;
}

.fluentform .ff-step-t-container {
  -webkit-box-align: normal !important;
  -ms-flex-align: normal !important;
  align-items: normal !important;
}

.fluentform label {
  font-family: "montserrat";
  color: #002858 !important;
}

.ff-btn-next:hover {
  background-color: #0000ff !important;
}

.fluentform .ff-el-input--label label {
  font-size: 14px !important;
}

.ff-el-group {
  margin-bottom: 7px !important;
}

.ff-btn-prev,
.ff-btn-submit,
.ff-btn-next {
  font-family: "Montserrat", Sans-serif;
  font-size: 14px;
  background-color: #0000ff !important;
  color: #fff !important;
  -webkit-box-shadow: 0px 0px 0px 0px #fff !important;
  box-shadow: 0px 0px 0px 0px #fff !important;
  border-color: #0000ff !important;
  text-transform: initial !important;
  font-weight: 500 !important;
  text-align: center;
  height: 42px;
  border-radius: 30px;
  padding: 0 15px;
}

.ff-btn-next {
  margin-top: 6%;
  width: 100%;
}

.ff-btn-next:hover,
.ff-btn-submit:hover,
.ff-btn-prev:hover {
  background-color: #0000ff !important;
  color: #fff !important;
}

.checknormal,
.checknuevo,
.ff-el-form-check {
  line-height: 1rem;
}

.families {
  position: relative;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1rem 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem 1rem;
}
@media (min-width: 768px) {
  .families {
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1.5rem;
  }
}
.families * {
  -webkit-box-ordinal-group: 11;
  -ms-flex-order: 10;
  order: 10;
}

.family .family-content {
  cursor: pointer;
  background-image: var(--generica);
  background-size: cover;
  background-position: bottom center;
  border-radius: 6px;
  overflow: hidden;
}
.family .family-content .family-img {
  width: 100%;
  padding-bottom: 40%;
  padding-bottom: 140px;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.family .family-content .family-label {
  display: block;
  padding: 0.15rem 0.75rem;
  font-size: 1rem;
  line-height: 24px;
  font-weight: 500;
  background-color: #002858;
  color: #fff;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
  position: relative;
  -webkit-transition: var(--animation);
  transition: var(--animation);
  will-change: transform, color, background-color;
}
@media (max-width: 768px) {
  .family .family-content .family-label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0.15rem 2.15rem 0.15rem 0.75rem;
    font-size: 13px;
    line-height: 16px;
    height: 40px;
  }
}
.family .family-content .family-label::before {
  content: "";
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  inset: auto 50% 0 auto;
  -webkit-transform: translateX(-50%) translateY(16px);
  transform: translateX(-50%) translateY(16px);
  opacity: 0;
  z-index: 99;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid hsla(213, 100%, 17%, 0.7);
  pointer-events: none;
  -webkit-transition: opacity 0.1s cubic-bezier(0.5, 0.5, 0, 1);
  transition: opacity 0.1s cubic-bezier(0.5, 0.5, 0, 1);
  will-change: opacity;
}
.family .family-content .family-label::after {
  content: "+";
  width: 16px;
  height: 16px;
  font-size: 20px;
  line-height: 1;
  border-radius: 10px;
  font-family: monospace;
  color: #002858;
  position: absolute;
  top: 50%;
  right: 0.75rem;
  -webkit-transform: translateY(-51%) rotate(0);
  transform: translateY(-51%) rotate(0);
  background-color: #ffc836;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-transition: var(--animation);
  transition: var(--animation);
  will-change: transform, color, background-color;
}
.family.active .family-label {
  background-color: #d4d4d4;
  color: #002858;
}
.family.active .family-label::before {
  opacity: 1;
  -webkit-transition: opacity 0.25s 0.5s cubic-bezier(0.5, 0.5, 0, 1);
  transition: opacity 0.25s 0.5s cubic-bezier(0.5, 0.5, 0, 1);
}
.family.active .family-label::after {
  background-color: #002858;
  color: #d4d4d4;
  -webkit-transform: translateY(-51%) rotate(135deg);
  transform: translateY(-51%) rotate(135deg);
}
.family:hover .family-label {
  background-color: #d4d4d4;
  color: #002858;
}

.grados .family.informatica .family-content .family-label {
  background-color: var(--clr-informatica);
  color: var(--clr-gris-claro);
}
.grados .family.informatica.active .family-label,
.grados .family.informatica:hover .family-label {
  background-color: var(--clr-gris-claro);
  color: var(--clr-informatica);
}
.grados .family.informatica .degree-list {
  background-color: hsla(334, 98%, 46%, 0.5);
}
.grados .family.imagen-y-sonido .family-content .family-label {
  background-color: var(--clr-audiovisual);
  color: var(--clr-gris-claro);
}
.grados .family.imagen-y-sonido.active .family-label,
.grados .family.imagen-y-sonido:hover .family-label {
  background-color: var(--clr-gris-claro);
  color: var(--clr-audiovisual);
}
.grados .family.imagen-y-sonido .degree-list {
  background-color: hsla(34, 100%, 50%, 0.5);
}
.fp-aeronautica
  .grados
  .family.mantenimiento-vehiculos
  .family-content
  .family-label {
  background-color: var(--clr-aeronautica);
  color: white;
}
.fp-aeronautica .grados .family.mantenimiento-vehiculos.active .family-label,
.fp-aeronautica .grados .family.mantenimiento-vehiculos:hover .family-label {
  background-color: white;
  color: var(--clr-aeronautica);
}
.fp-aeronautica .grados .family.mantenimiento-vehiculos .degree-list {
  background-color: hsla(198, 100%, 13%, 0.5);
}

.family.administracion-y-gestion {
  -webkit-box-ordinal-group: 5;
  -ms-flex-order: 4;
  order: 4;
}
.family.administracion-y-gestion .family-content .family-img {
  background-image: var(--administracion);
}
.family.comercio-y-marketing {
  -webkit-box-ordinal-group: 6;
  -ms-flex-order: 5;
  order: 5;
}
.family.comercio-y-marketing .family-content .family-img {
  background-image: var(--comercio);
}
.family.deporte {
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2;
}
.family.deporte .family-content .family-img {
  background-image: var(--deporte);
}
.family.edificacion-y-obra-civil .family-content .family-img {
  background-image: var(--edificacion);
}
.family.electricidad-y-electronica .family-content .family-img {
  background-image: var(--electricidad);
}
.family.hosteleria-y-turismo {
  -webkit-box-ordinal-group: 8;
  -ms-flex-order: 7;
  order: 7;
}
.family.hosteleria-y-turismo .family-content .family-img {
  background-image: var(--hosteleria);
}
.family.imagen-personal .family-content .family-img {
  background-image: var(--imagen-per);
}
.family.imagen-y-sonido {
  -webkit-box-ordinal-group: 7;
  -ms-flex-order: 6;
  order: 6;
}
.family.imagen-y-sonido .family-content .family-img {
  background-image: var(--imagen-son);
}
.family.informatica {
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 1;
}
.family.informatica .family-content .family-img {
  background-image: var(--informatica);
}
.family.instalacion-y-mantenimiento .family-content .family-img {
  background-image: var(--instalacion);
}
.family.mantenimiento-vehiculos .family-content .family-img {
  background-image: var(--mantenimiento);
}
.family.sanidad {
  -webkit-box-ordinal-group: 1;
  -ms-flex-order: 0;
  order: 0;
}
.family.sanidad .family-content .family-img {
  background-image: var(--sanidad);
}
.family.seguridad-y-medio-ambiente .family-content .family-img {
  background-image: var(--seguridad);
}
.family.sociocultural {
  -webkit-box-ordinal-group: 4;
  -ms-flex-order: 3;
  order: 3;
}
.family.sociocultural .family-content .family-img {
  background-image: var(--sociocultural);
}

.family .degree-list {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  -webkit-transform: translateY(0) scale(0.8) rotate(0.001deg);
  transform: translateY(0) scale(0.8) rotate(0.001deg);
  -webkit-transition: var(--animation);
  transition: var(--animation);
  position: absolute;
  inset: auto 0 auto 0;
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1rem 1.5rem;
  width: 100%;
  padding: 1rem 8px;
  border-radius: 6px;
  background-color: hsla(213, 100%, 17%, 0.7);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  -webkit-box-shadow: 0 0 3.15px 0px rgba(0, 19, 77, 0.0156862745),
    -5.86px 5.66px 6.52px 0px rgba(0, 19, 77, 0.0274509804),
    -1px 4px 13px 0px rgba(0, 19, 77, 0.0352941176),
    -10px 11px 25.48px 0px rgba(0, 19, 77, 0.0431372549),
    -7px 7px 46.85px 0px rgba(0, 19, 77, 0.0549019608),
    -7px 8px 80px 0px rgba(0, 19, 77, 0.0705882353);
  box-shadow: 0 0 3.15px 0px rgba(0, 19, 77, 0.0156862745),
    -5.86px 5.66px 6.52px 0px rgba(0, 19, 77, 0.0274509804),
    -1px 4px 13px 0px rgba(0, 19, 77, 0.0352941176),
    -10px 11px 25.48px 0px rgba(0, 19, 77, 0.0431372549),
    -7px 7px 46.85px 0px rgba(0, 19, 77, 0.0549019608),
    -7px 8px 80px 0px rgba(0, 19, 77, 0.0705882353);
  z-index: 110;
  will-change: visibility, opacity, transform;
}
.family .degree-list .degree {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-flow: column nowrap;
  flex-flow: column nowrap;
  gap: 0.25rem;
  background-color: #fff;
  border-radius: 6px;
  padding: 8px;
  cursor: pointer;
  will-change: color, background-color;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.2;
}
@media (max-width: 768px) {
  .family .degree-list .degree {
    font-size: 13px;
  }
}
.family .degree-list .degree:hover {
  background-color: #002858;
  color: #ffffff;
}
.family .degree-list .degree:hover .degree-plus {
  background-color: #ffc836;
  color: #002858;
}
.family .degree-list .degree-level {
  font-size: 14px;
  color: #aaaaaa;
  font-weight: 600;
}
@media (max-width: 768px) {
  .family .degree-list .degree-level {
    font-size: 12px;
  }
}
.family .degree-list .degree-plus {
  position: absolute;
  inset: 4px 0 auto auto;
  -webkit-transform: translateY(4px) translateX(-8px);
  transform: translateY(4px) translateX(-8px);
  width: 16px;
  height: 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: #002858;
  border: none;
  border-radius: 24px;
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #fff;
  line-height: 1;
}
.family.active .degree-list {
  visibility: visible;
  opacity: 1;
  pointer-events: all;
  -webkit-transform: translateY(16px) scale(1) rotate(0.001deg);
  transform: translateY(16px) scale(1) rotate(0.001deg);
}

.modal-form__overlay {
  position: fixed;
  inset: 0;
  background-color: hsla(213, 100%, 17%, 0.8);
  z-index: 201;
  -webkit-transition: var(--animation);
  transition: var(--animation);
  visibility: hidden;
  opacity: 0;
  will-change: visibility, opacity;
}
.modal-form__overlay.active {
  -webkit-transition: var(--animation);
  transition: var(--animation);
  visibility: visible;
  opacity: 1;
}
.modal-form__wrapper {
  width: 100%;
  max-width: 370px;
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-46%) rotate(0.001deg);
  transform: translateX(-50%) translateY(-46%) rotate(0.001deg);
  z-index: 221;
  -webkit-transition: var(--animation);
  transition: var(--animation);
  visibility: hidden;
  opacity: 0;
  will-change: visibility, opacity, transform;
}
.modal-form__wrapper.active {
  visibility: visible;
  opacity: 1;
  -webkit-transform: translateX(-50%) translateY(-50%) rotate(0.001deg);
  transform: translateX(-50%) translateY(-50%) rotate(0.001deg);
}
.modal-form__message {
  background-color: #002858;
  color: #efefef;
  border-top-right-radius: 2rem;
  padding-block: 10px 40px;
  padding-inline: 1rem;
  -webkit-margin-after: -30px;
  margin-block-end: -30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-flow: row nowrap;
  flex-flow: row nowrap;
  gap: 1rem;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.modal-form__close {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 1.5rem;
  height: 1.5rem;
  background-color: transparent;
  position: relative;
  border: none;
}
.modal-form__close__bar {
  position: absolute;
  width: 1.45rem;
  height: 2px;
  border-radius: 2px;
  background-color: white;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.modal-form__close__bar:last-child {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.modal-form__form {
  background-color: #efefef;
  border-top-right-radius: 2rem;
  padding: 0.8rem 1rem;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.35);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.35);
}

.grados {
  position: relative;
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.5rem 1rem;
  max-width: 850px;
  margin-inline: auto;
}
@media (min-width: 768px) {
  .grados {
    gap: 1.5rem;
  }
}
.grados .grado {
  width: 100%;
  max-width: 415px;
  margin-inline: auto;
}
.fp-aeronautica .grados {
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  max-width: 420px;
  gap: 64px;
  -webkit-margin-start: 0;
  margin-inline-start: 0;
}

.family.grado .family-content .family-img {
  padding-bottom: 45%;
}
.family.grado .family-content .family-label {
  padding: 0.75rem;
  line-height: 16px;
}
@media (max-width: 768px) {
  .family.grado .family-content .family-label {
    font-size: 15px;
  }
}

.family.grado.administracion-y-gestion .family-content .family-img {
  background-image: var(--gs-administracion);
}
.family.grado.administracion-y-gestion.grado-medio .family-content .family-img {
  background-image: var(--gm-administracion);
}
.family.grado.comercio-y-marketing .family-content .family-img {
  background-image: var(--gs-comercio);
}
.family.grado.comercio-y-marketing.grado-medio .family-content .family-img {
  background-image: var(--gm-comercio);
}
.family.grado.deporte .family-content .family-img {
  background-image: var(--gs-deporte);
}
.family.grado.deporte.grado-medio .family-content .family-img {
  background-image: var(--gm-deporte);
}
.family.grado.edificacion-y-obra-civil .family-content .family-img {
  background-image: var(--gs-edificacion);
}
.family.grado.edificacion-y-obra-civil.grado-medio .family-content .family-img {
  background-image: var(--gm-edificacion);
}
.family.grado.electricidad-y-electronica .family-content .family-img {
  background-image: var(--gs-electricidad);
}
.family.grado.electricidad-y-electronica.grado-medio
  .family-content
  .family-img {
  background-image: var(--gm-electricidad);
}
.family.grado.hosteleria-y-turismo .family-content .family-img {
  background-image: var(--gs-hosteleria);
}
.family.grado.hosteleria-y-turismo.grado-medio .family-content .family-img {
  background-image: var(--gm-hosteleria);
}
.family.grado.imagen-personal .family-content .family-img {
  background-image: var(--gs-imagen-per);
}
.family.grado.imagen-personal.grado-medio .family-content .family-img {
  background-image: var(--gm-imagen-per);
}
.family.grado.imagen-y-sonido .family-content .family-img {
  background-image: var(--gs-imagen-son);
}
.family.grado.imagen-y-sonido.grado-medio .family-content .family-img {
  background-image: var(--gm-imagen-son);
}
.family.grado.informatica .family-content .family-img {
  background-image: var(--gs-informatica);
}
.family.grado.informatica.grado-medio .family-content .family-img {
  background-image: var(--gm-informatica);
}
.family.grado.instalacion-y-mantenimiento .family-content .family-img {
  background-image: var(--gs-instalacion);
}
.family.grado.instalacion-y-mantenimiento.grado-medio
  .family-content
  .family-img {
  background-image: var(--gm-instalacion);
}
.family.grado.mantenimiento-vehiculos .family-content .family-img {
  background-image: var(--gs-mantenimiento);
}
.family.grado.mantenimiento-vehiculos.grado-medio .family-content .family-img {
  background-image: var(--gm-mantenimiento);
}
.fp-aeronautica
  .family.grado.mantenimiento-vehiculos
  .family-content
  .family-img {
  background-image: var(--gs-aeronautica);
}
.fp-aeronautica
  .family.grado.mantenimiento-vehiculos.grado-medio
  .family-content
  .family-img {
  background-image: var(--gm-aeronautica);
}
.family.grado.sanidad .family-content .family-img {
  background-image: var(--gs-sanidad);
}
.family.grado.sanidad.grado-medio .family-content .family-img {
  background-image: var(--gm-sanidad);
}
.family.grado.seguridad-y-medio-ambiente .family-content .family-img {
  background-image: var(--gs-seguridad);
}
.family.grado.seguridad-y-medio-ambiente.grado-medio
  .family-content
  .family-img {
  background-image: var(--gm-seguridad);
}
.family.grado.sociocultural .family-content .family-img {
  background-image: var(--gs-sociocultural);
}
.family.grado.sociocultural.grado-medio .family-content .family-img {
  background-image: var(--gm-sociocultural);
}
/*# sourceMappingURL=style.css.map */