@charset "UTF-8";
:root {
  --size: 500px;
  --radio: 190px;
  --icon: 80px;
  --bg: none;
}

.circle {
  position: relative;
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--bg);
  margin: 0 auto;
}

.center {
  width: 280px;
  min-height: 160px;
  text-align: center;
  border-radius: 50%;
  padding: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: url(../images/iconos-ser-ulpgc/estrella_ulpgc.svg) no-repeat center center;
  background-size: contain;
}
.center.is-active {
  background: none;
}
.center h3 {
  font-size: 1.4rem;
  font-weight: normal;
  line-height: 1.4;
  text-align: center;
}

.icon {
  position: absolute;
  width: var(--icon);
  height: var(--icon);
  border-radius: 50%;
  display: grid;
  place-items: center;
  cursor: pointer;
  border: 0;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.icon img {
  width: 100%;
  height: 100%;
}
.icon:hover, .icon.active {
  transform: scale(1.1);
  box-shadow: 0 0 15px var(--c, #ccc);
  box-shadow: none;
  filter: drop-shadow(6px 0 10px var(--c, #ccc));
}
.icon {
  /* &::after {
     content: "";
     position: absolute;
     width: 0;
     height: 0;
     border-left: 8px solid transparent;
     border-right: 8px solid transparent;
     border-bottom: 16px solid var(--c, #ccc);
     top: 50%;
     left: 50%;
     transform: translate(var(--tx, -50%), var(--ty, -50%)) rotate(var(--angle,0deg));
     opacity: 0;
   }

   &.active::after {
     opacity: 1;
   }*/
}

.icon.transporte {
  --c: #9a7700;
}

.icon.correo {
  --c: #5e2ca5;
}

.icon.admin {
  --c: #a6230d;
}

.icon.mentor {
  --c: #176320;
}

.icon.biblioteca {
  --c: #30363d;
}

.icon.deporte {
  --c: #005a94;
}

.icon.tarjeta {
  --c: #0a348f;
}

.icon.rrss {
  --c: #176320;
}

.icon.agenda {
  --c: #004a8f;
}

.icon.podcast {
  --c: #a64800;
}

.icon.mas {
  --c: #78004d;
}

.center-vertical {
  height: 100%;
  align-items: center;
  display: flex;
}
#portada .titulos-home h1, #portada #block-ulpgc-theme-widgetserulpgc h2 {
  font-size: 2.5rem;
  line-height: 3rem;
}
#portada .titulos-home .subtitle-l, #portada #block-ulpgc-theme-widgetserulpgc .subtitle-l {
  font-size: 2rem;
  line-height: 2.5rem;
}
@media only screen and (max-width: 1200px) {
  #block-ulpgc-theme-widgetserulpgc .col-6 .circle {
    width: 400px;
  }
  #block-ulpgc-theme-widgetserulpgc .col-6 .icon {
    width: 60px;
  }
}
@media only screen and (max-width: 959px) {
  #block-ulpgc-theme-widgetserulpgc .col-6 {
    width: 100%;
    flex-basis: 100%;
  }
  #block-ulpgc-theme-widgetserulpgc .col-6 + .col-6 {
    height: 500px;
  }
}
@media only screen and (max-width: 720px) {
  #block-ulpgc-theme-widgetserulpgc .col-6 .circle {
    width: 300px;
    top: -80px;
  }
  #block-ulpgc-theme-widgetserulpgc .col-6 .center {
    padding: 50px;
  }
  #block-ulpgc-theme-widgetserulpgc .col-6 + .col-6 {
    height: 340px;
    overflow: visible;
  }
  #block-ulpgc-theme-widgetserulpgc .col-6 .icon {
    width: 48px;
  }
  #block-ulpgc-theme-widgetserulpgc .col-6 h3 {
    font-size: 1rem;
    line-height: 1;
  }
}

@keyframes pulse-shadow {
  0%, 100% {
    box-shadow: 0 0 0px var(--c, #ccc);
  }
  50% {
    box-shadow: 0 0 15px var(--c, #ccc);
  }
}
/* Estado animado antes de la interacción */
.circle.autoplay .icon {
  animation: pulse-shadow 2s ease-in-out infinite;
}

/* Cuando el usuario pasa el ratón (interacción detectada) */
.circle.user-interacted .icon {
  animation: none;
}

/*# sourceMappingURL=block-widget-serulpgc.css.map */
