@media screen and (max-width: 1000px) and (min-width: 900px) {
    .img-back {
        background-repeat: round;
        background-origin: border-box;
        width: 600px;
        height: 100vh;
        background-size: cover;

    }

    .paragraf {
        width: 50%;
    }

    ul li {
        width: 360px;
    }

    .line {
        width: 40%;
    }

}
@media screen and (max-width: 900px) and (min-width: 850px) {
    .img-back {
        background-repeat: round;
        background-origin: border-box;
        width: 600px;
        height: 100vh;
        background-size: cover;

    }

    .paragraf {
        width: 40%;
    }

    ul li {
        width: 360px;
    }

    .line {
        width: 40%;
    }

}
@media screen and (max-width: 820px) and (min-width: 670px) {
    .img-back {
        background-repeat: round;
        background-origin: border-box;
        width: 600px;
        height: 100vh;
        background-size: cover;

    }

       .paragraf {
            width: 50%;
        }

    ul li {
        width: 360px;
    }

    .line {
        width: 40%;
    }

}

@media screen and (max-width: 600px) and (min-width: 400px) {
    body {
        background-image: none;
    }

    .img-back {
        background-repeat: round;
        background-origin: border-box;
        width: 600px;
        height: 100vh;
        background-size: cover;

    }

     .paragraf {
            width: 80%;

        }

}
@media screen and (max-width: 669px) and (min-width: 601px) {
    body {
        background-image: none;
    }

    .img-back {
        background-repeat: round;
        background-origin: border-box;
        width: 600px;
        height: 100vh;
        background-size: cover;

    }

    .paragraf {
        width: 60%;

    }

}

@media screen and (max-width: 450px) and (min-width: 412px) {
    body {
        background-image: none;
    }

    .img-back {
        background-repeat: round;
        background-origin: border-box;
        width: 600px;
        height: 100vh;
        background-size: cover;

    }

    .paragraf {
        width: 70%;
    }

}

@media screen and (max-width: 400px) and (min-width: 375px) {
    body {
        background-image: none;
    }

    .img-back {
        background-repeat: round;
        background-origin: border-box;
        width: 600px;
        height: 100vh;
        background-size: cover;

    }

    .paragraf {
        width: 90%;
    }

}

@media screen and (max-width: 370px) and (min-width: 270px) {
    body {
        background-image: none;
    }

    .img-back {
        background-repeat: round;
        background-origin: border-box;
        width: 600px;
        height: 100vh;
        background-size: cover;

    }

    .paragraf {
        width: 80%;

    }
    ul li {
        width: 260px;
    }

    .line {
        width: 36%;
    }

}

@media screen and (max-width: 300px) and (min-width: 200px) {
    body {
        background-image: none;
    }

    .img-back {
        background-repeat: round;
        background-origin: border-box;
        width: 600px;
        height: 100vh;
        background-size: cover;

    }

       .paragraf {
            width: 80%;
        }

    ul li {
        width: 260px;
    }

    .line {
        width: 36%;
    }

}

@media screen and (max-width: 280px) and (min-width: 200px) {
    body {
        background-image: none;
    }

    .img-back {
        background-repeat: round;
        background-origin: border-box;
        width: 600px;
        height: 100vh;
        background-size: cover;

    }

       .paragraf {
            width: 100%;

        }

    ul li {
        width: 260px;
    }

    .line {
        width: 36%;
    }

}