@media (max-width: 1221px) {
    body {
        background-color: #ccc;
    }
    .hi__title {
        padding: 10px;
        font-size: 18px;
        text-align: center;
    }
    .hi__text h2 {
        padding: 10px;
        text-align: center;
    }
    .hi__menu li {
        margin-top: 15px;
        padding: 10px 100px;
        margin-left: -40px;
        }
    .hi__menu {
        text-align: center;
        margin-top: -50px;
    }
    .main__image {
        min-width: 700px;
        height: 400px;
        position: absolute;
        left: 250px;
        top: 400px;
    }
    .vertical {
        padding: 0 15px;
    }
    .main__info {
        text-align: center;
        padding: 0 15px;
    }
    .education__text {
        text-align: center;
        padding: 0 15px;
    }
    .teachers__text {
        text-align: center;
        padding: 0 15px;
    }
    .price__text {
        text-align: center;
        padding: 0 15px;
    }
    .space1 {
        width: 1221px;
    }
    .space1, .space {
        margin-bottom: 10px;
    }
    .space {
        width: 600px;
    }
    footer {
    }
    }
    @media (max-width: 1024px) {
        body {
            background-color: #ccc;
        }
        .hi__title {
            padding: 10px;
            font-size: 18px;
            text-align: center;
        }
        .hi__text h2 {
            padding: 10px;
            text-align: center;
        }
        .hi__menu li {
            margin-top: 15px;
            padding: 10px 100px;
            margin-left: -40px;
            }
        .hi__menu {
            text-align: center;
            margin-top: -50px;
        }
        .main__image {
            min-width: 900px;
            height: 500px;
            position: absolute;
            left: 70px;
            top: 580px;
        }
        .vertical {
            padding: 0 15px;
        }
        .main__info {
            text-align: center;
            padding: 0 15px;
        }
        .education__text {
            text-align: center;
            padding: 0 15px;
        }
        .teachers__text {
            text-align: center;
            padding: 0 15px;
        }
        .price__text {
            text-align: center;
            padding: 0 15px;
        }
        .space1 {
            width: 1024px;
        }
        .space1, .space {
            margin-bottom: 10px;
        }
        .space {
            width: 510px;
        }
        }
        @media (max-width: 768px) {
            body {
                background-color: #ccc;
            }
            .hi__title {
                padding: 10px;
            }
            .hi__text h2 {
                padding: 10px;
                text-align: center;
            }
            .hi__menu li {
                margin-top: 15px;
                padding: 10px 100px;
                margin-left: -40px;
                }
            .hi__menu {
                text-align: center;
                margin-top: -50px;
            }
            .main__image {
                min-width: 700px;
                height: 400px;
                position: absolute;
                left: 35px;
                top: 520px;
            }
            .map__row {
                margin: -20px 0 -20px 0px;
                padding: 0;
            }
            .main__info {
                text-align: center;
                padding: 0 15px;
            }
            iframe {
                width: 600px;
                height: 300px;
                margin-top: 50px;
            }
            .vertical__row {
                flex: none;
                flex-direction: column;
            }
            .vertical {
                padding: 0 20px;
            }
            .vertical__title {
                font-size: 20px;
            }
            .vertical__column {
                margin-bottom: 10px;
            }
            .education__text {
                text-align: center;
                padding: 0 15px;
            }
            .teachers__text {
                text-align: center;
                padding: 0 15px;
            }
            .price__text {
                text-align: center;
                padding: 0 15px;
            }
            .space1 {
                width: 768px;
            }
            .space1, .space {
                margin-bottom: 10px;
            }
            .space {
                width: 382px;
            }
            @media (max-width: 646px) {
                .hi__title {
                    padding: 10px;
                    font-size: 10px;
                }
                .hi__title h1 {
                    font-size: 20px;
                    padding: 5px;
                }
                .hi__text h2 {
                    padding: 10px;
                    text-align: center;
                }
                .hi__menu li {
                    margin-top: 15px;
                    padding: 10px 100px;
                    margin-left: -40px;
                    }
                .hi__menu {
                    text-align: center;
                    margin-top: -50px;
                }
                iframe {
                    width: 300px;
                    height: 300px;
                    margin-top: 50px;
                }
                footer {
                    padding: 0 0 35px 0;
                }
                .main__info {
                    text-align: center;
                    padding: 0 15px;
                }
                .vertical {
                    padding: 0 20px;
                }
                .vertical__title {
                    font-size: 20px;
                }
                .vertical__column {
                    margin-bottom: 10px;
                }
                .education__text {
                    text-align: center;
                    padding: 0 15px;
                }
                .teachers__text {
                    text-align: center;
                    padding: 0 15px;
                }
                .price__text {
                    text-align: center;
                    padding: 0 15px;
                }
                .space1 {
                    width: 400px;
                }
                .space1, .space {
                    margin-bottom: 10px;
                }
                .main__image {
                    min-width: 300px;
                    height: 200px;
                    position: absolute;
                    left: 20px;
                    top: 750px;
                }
                .map__row {
                    margin: -20px 0 -20px 0px;
                    padding: 0;
                }
                body {
                    background-color: #ccc;
                }
            }