/* 404 page css */
.page-404-main .page-404-wrap {
    position: relative;
    text-align: center;
    min-height: calc(100vh - 110px);
    min-height: calc(100dvh - 110px);
    padding: 100px 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.page-404-main h2 {
    text-align: center;
    font-weight: 700;
    margin: 60px 0 30px;
}

.page-404-main .page-404-animate {
    max-width: 50%;
    width: 100%;
    margin: 0 auto;
}

.page-404-main .line {
    fill: rgba(67, 49, 133, 10%);
    stroke: #433185;
    stroke-width: 12;
    stroke-dasharray: 200 100;
}

.page-404-main .anim {
    -webkit-animation: swirls 2.3s linear infinite;
    -moz-animation: swirls 2.3s linear infinite;
    -o-animation: swirls 2.3s linear infinite;
    animation: swirls 2.3s linear infinite;
}

@keyframes swirls {
    from {
        stroke-dashoffset: 0;
    }

    to {
        stroke-dashoffset: 300;
    }
}

/* Media query */
@media (min-width: 1600px) {}

@media (max-width: 1599px) {}

@media (max-width: 1499px) {}

@media (max-width: 1399px) {}

@media (max-width: 1199px) {}

@media (max-width: 991px) {
    .page-404-main .page-404-wrap {
        min-height: calc(100vh - 80px);
        min-height: calc(100dvh - 80px);

    }
}

@media (max-width: 767px) {
    .page-404-main .page-404-animate {
        max-width: 70%;
    }
}

@media (max-width: 575px) {
    .page-404-main h2 {
        margin: 40px 0 20px;
    }

    .page-404-main .page-404-animate {
        max-width: 84%;
    }
}