/* убрать спиннеры с инпута */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0;
    /* <-- Apparently some margin are still there even though it's hidden */
}

/* for card_block */
.custom-card-group {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.custom-card {
    width: 18rem;
    border-radius: 20px;
    margin: 15px;
}

/* for textblock */
.just-text-block {
    text-align: center;
    margin: 20px;
}

.form-photo {
    align-self: center;
    margin: 10px;
}

.header-photo{
    position: relative;
    background: var(--main-bg-img) no-repeat center /cover;
    background-size: cover;
    min-height: 350px;
    max-height: 350px;
    border-bottom-left-radius: 35px;
    border-bottom-right-radius: 35px;
    width: 1300px;
}

.custom-nav {
    background-color: white;
    border-radius: 20px;
    width: max-content;
}
.custom-nav-item {
    display: flex;
    justify-content: center;
    align-items: center;
}

@media screen and (max-width: 1048px) {
    .header-photo{
            position: relative;
            background: var(--main-bg-img) no-repeat center /cover;
            background-size: cover;
            min-height: 350px;
            max-height: 350px;
            border-bottom-left-radius: 35px;
            border-bottom-right-radius: 35px;
            width: 1300px;
                }
    .custom-nav {
        background-color: white;
        border-radius: 10px;
        width: max-content;
    }
        };

@media screen and (max-width: 600px) {
    .header-photo{
            position: relative;
            background: var(--main-bg-img) no-repeat center /cover;
            background-size: contain;
            min-height: 250px;
            max-height: 250px;
            border-bottom-left-radius: 20px;
            border-bottom-right-radius: 20px;
            width: 1300px;
                }
    .custom-nav {
        background-color: white;
        border-radius: 10px;
        width: max-content;
    }
}

@media only screen and (max-device-width: 1024px){
    .form-photo {
        align-self: center;
    }
}