
:root{
    --ipc-panel: #ffffff;
    --ipc-enca: #596771;
    --ipc-danger: #dc3545;
}

/*-PÁGINA ERROR*/

.c-inscripcion{
    width: 100%;
    height: calc(100vh - 100px);
    display: flex;
    justify-content: center;
    .marg{
        width: 100%;
        padding: 20px 0px;
        .contenido{
            width: 100%;
            min-height: 40vh;
            background-color: var(--ipc-panel);
            border-radius: 20px;
            .titulo{
                border-top-left-radius: 20px;
                border-top-right-radius: 20px;
                min-height: 50px;
                background-color: var(--ipc-enca);
                font-size: 2em;
                color: var(--ipc-panel);
                display: flex;
                align-items: center;
                padding: 0 15px;
            }
            .etapa{
                width: 100%;
                padding: 10px 15px;
                font-size: 1.1em;
                display: none;
                &.active{
                    display: block;
                    animation: transicionPanel;
                    animation-duration: 0.6s;
                }
                &.info{
                    padding: 10px 50px;
                    .table{
                        text-align: justify;
                    }
                    @media (max-width: 768px) {
                        padding: 10px 10px;
                    }
                }
                .table{
                    width: 100%!important;
                }
                .reproductor{
                    width: 100%;
                    height: fit-content;
                    audio{
                        width: 100%;
                    }
                }
                .boton-inicio{
                    height: 70px;
                    width: fit-content;
                    padding: 10px 20px;
                    font-size: 2em;
                    font-weight: bold;
                    background-color: var(--ipc-enca);
                    color: var(--ipc-panel);
                    border: none;
                    border-radius: 15px;
                    margin-bottom: 50px;
                    transition: all 0.15s ease-out;
                    &:hover{
                        transform: scale(1.1);
                    }
                }
                .grp-botones{
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                }
                .boton-etapa{
                    height: 50px;
                    width: fit-content;
                    padding: 10px 20px;
                    font-size: 1.5em;
                    font-weight: bold;
                    background-color: var(--ipc-enca);
                    color: var(--ipc-panel);
                    border: none;
                    border-radius: 15px;
                    transition: all 0.15s ease-out;
                    &.danger{
                        background-color: var(--ipc-danger);
                    }
                    &:hover{
                        transform: scale(1.1);
                    }
                    &:disabled{
                        cursor: not-allowed;
                    }
                    &.cambio{
                        display: none;
                        &.active{
                            display: block;
                            animation: transicionPanel;
                            animation-duration: 0.6s;
                        }
                    }
                }
                .txt-auto{
                    padding: 10px 20px;
                    font-size: 2em;
                    text-align: justify;
                }
                .error{
                    border: 2px solid var(--ipc-danger);
                }
            }
        }
    }
}

@keyframes transicionPanel {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
/*-PÁGINA ERROR*/
