.main-container {
    display: flex;
    justify-content: center;
    align-items: center;
}

#page-1 {
    background: url('../images/main-bg.gif') no-repeat center fixed;
    background-size: cover;
    transform: scale(1);
    filter: blur(0) grayscale(0%);
    
    min-height: 100dvh;
}

#page-1 .container {
    width: 100%;
}

#page-1 .wrapper {
    text-align: center;
    color: var(--second-color);
    padding: min(500px, 15%) min(300px, 10%);
    width: 100%;
    height: 100%;
}

#page-1 .logo__plus__heading__about {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 2rem;
}

#page-1 .logo__plus__heading__about img {
    margin-bottom: 1.2rem;
    height: auto;
    width: 84px;
}

#page-1 .logo__plus__heading__about h2 {
    font-size: 3.2rem !important;
    font-style: italic;
}

@media (max-width: 768px) {
    #page-1 .logo__plus__heading__about h2 {
        margin-top: 0.75rem;
        font-size: 1.75rem !important;
    }

    #page-1 .logo__plus__heading__about img {
        width: 64px;
    }
}

#page-1 .slogan {
    margin-top: 1rem;
    color: #c0c0c0;
    font-size: 2.6rem;
}

#page-1 .join-btn {
    margin-top: 2rem;
    width: 120px;
}

@media (max-width: 768px) {
    #page-1 h2 {
        margin-top: 0.75rem;
        font-size: 1.75rem !important;
    }

    #page-1 .logo__plus__heading__about h2 {
        font-size: 2.5rem !important;
    }
}

@media (max-width: 500px) {
    #page-1 .logo__plus__heading__about h2 {
        font-size: 1.8rem !important;
    }

    #page-1 .slogan {
        margin-top: .75rem;
        font-size: 2.2rem;
    }
}

@media (max-width: 360px) {
    #page-1 .logo__plus__heading__about h2 {
        font-size: 1.4rem !important;
    }

    #page-1 .slogan {
        margin-top: .5rem;
        font-size: 1.6rem;
    }
}