.DivCarga{
	left: 0px;
	height: 100%;
	position: fixed;
	top: 0px;
	width: 100%;
	z-index: 1030;
    background-color: rgba(0,0,0,0.8);
}
.centered{
	position: fixed;
	z-index: 1030;

	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
}

.clock-loader {
    --clock-color: var(--color-principal);
    --clock-width: 4rem;
    --clock-radius: calc(var(--clock-width) / 2);
    --clock-minute-length: calc(var(--clock-width) * 0.4);
    --clock-hour-length: calc(var(--clock-width) * 0.2);
    --clock-thickness: 0.2rem;

    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: var(--clock-width);
    height: var(--clock-width);
    border: 3px solid var(--clock-color);
    border-radius: 50%;
}

.clock-loader:before {
    position: absolute;
    content: "";
    top: calc(var(--clock-radius) * 0.25);
    width: var(--clock-thickness);
    background: var(--clock-color);
    border-radius: 10px;
    transform-origin: center calc(100% - calc(var(--clock-thickness) / 2));
    animation: spin infinite linear;

    height: var(--clock-minute-length);
    animation-duration: 2s;
}

.clock-loader:after {
    position: absolute;
    content: "";
    top: calc(var(--clock-radius) * 0.25);
    width: var(--clock-thickness);
    background: var(--clock-color);
    border-radius: 10px;
    transform-origin: center calc(100% - calc(var(--clock-thickness) / 2));
    animation: spin infinite linear;

    top: calc(var(--clock-radius) * 0.25 + var(--clock-hour-length));
    height: var(--clock-hour-length);
    animation-duration: 15s;
}

@keyframes spin {
    to {
        transform: rotate(1turn);
    }
}