.circle-font-big{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  font-size: 3.4rem;
}

.circle-font-medium{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 75px;
  height: 75px;
  border-radius: 50%;
  font-size: 2rem;
    margin-right: 1rem;
}
.circle-font-medium {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 75px;
  height: 75px;
  border-radius: 50%;
  font-size: 2em;
  margin-right: 1rem;
}


@media (max-width: 576px) {
  .circle-font-medium {
    font-size: 1.5em; /* Ajusta el tamaño de fuente */
    width: 55px; /* Ajusta el tamaño del círculo */
    height: 55px;
    margin-right: 0.2rem;
  }
}


 .p-focus {
        font-family: 'Roboto', sans-serif;
        font-size: 1rem;
    }


.box-border-main{
    border: 3px solid #000;
    border-radius: 5px;
    padding: 0.5rem;
    margin: 1rem;
 }


.video-container {
  position: relative;
  width: 100%;
  padding-bottom: 100%; /* Esto asegura que el contenedor tenga un aspecto cuadrado */
  overflow: hidden;
  margin: 0 auto; /* Centra el contenedor en la pantalla */
}

#qr-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}



.circle_font{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  font-size: 3.4rem;
}


 .p_focus {
        font-family: 'Roboto', sans-serif;
        font-size: 1rem;
    }