html, body {
    width: 100vw;
    height: 100vh;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.step {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 50px;
    max-width: 800px;
}

h1 {
    margin-bottom: 24px;
}

.btn-check {

    + .btn {
        border-color: var(--primary-darken);
        color: var(--primary-darken);
    }

    &:checked + .btn {
        border-color: var(--primary-darken);
        background: var(--bg-gradient-primary);
    }
}

.d-cond-rendered {
    display: none;
    opacity: 0;
}

    .d-cond-rendered.d-rendered {
        animation: fadeIn 1.5s;
        display: block;
        opacity: 1;
    }

.text-justify {
    text-align: justify;
}

#new-project-contact {
}

    #new-project-contact #photos-list {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        max-width: 600px;
        margin: 20px auto;
    }

        #new-project-contact #photos-list .photo-item {
            position: relative;
            width: 100px;
            height: 100px;
            border: 1px solid #ccc;
            border-radius: 5px;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
        }

            #new-project-contact #photos-list .photo-item .photo-preview {
                width: 100%;
                height: 100%;
                background-size: cover;
                background-position: center;
                background-repeat: no-repeat;
            }

            #new-project-contact #photos-list .photo-item button {
                position: absolute;
                top: -5px;
                right: -5px;
                z-index: +1;
                background: var(--primary-darken);
                border: none;
                color: white;
                border-radius: 50%;
                cursor: pointer;
                text-align: center;
            }

    #new-project-contact #files-list {
        margin-top: 20px;
        max-width: 600px;
        margin: 20px auto;
    }

        #new-project-contact #files-list .file-item {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 10px;
            border: 1px solid #ccc;
            border-radius: 5px;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
            margin-bottom: 10px;
        }

            #new-project-contact #files-list .file-item button {
                background: var(--primary-darken);
                border: none;
                color: white;
                border-radius: 5px;
                cursor: pointer;
                text-align: center;
                padding: 5px 10px;
            }