﻿.image {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

    .image img {
        position: absolute;
        top: 16%;
        left: 19%;
        height: 180px;
        width: 180px;
    }

    .image label {
        position: absolute;
        color: white;
        top: 70%;
        left: 34%;
    }

.spin {
    position: relative;
    display: inline-block;
    width: 280px;
    height: 280px;
    border: 2px solid;
    border-radius: 100%;
    animation: spin 0.75s infinite linear;
}

    .spin::before,
    .spin::after {
        left: -2px;
        top: -2px;
        display: none;
        position: absolute;
        content: '';
        width: inherit;
        height: inherit;
        border: inherit;
        border-radius: inherit;
    }

@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.spinner,
.spinner::before,
.spinner::after {
    display: inline-block;
    border-color: transparent;
    border-top-color: white;
    animation-duration: 1.5s;
}

    .spinner::before {
        transform: rotate(120deg);
    }

    .spinner::after {
        transform: rotate(240deg);
    }

/*@media (max-width:480px) {
    .spin {
        width: 270px;
        height: 270px;
    }

    .image img {
        position: absolute;
        top: 19%;
        left: 21%;
    }
}
*/
