@media (max-width: 1400px){
    .my-channels-content{ column-gap: normal; }
    .about-me{ column-gap: 50px; }
    .works-content > a{ top: 10%; }
    .services > h2{ margin-left: 0; font-size: 200px;}
}

@media (max-width: 900px){
    .about-me > h3{ font-size: 30px; line-height: normal; }
    .circle{width: 150px; height: 150px; filter: blur(40px); }
    .works-content > a{ top: 15%; }
    .works-content > a > h6{ font-size: 20px; }
    .works-content{ row-gap: 30px; }
    .footer-information {padding-top: 100px;}
}

@media (max-width: 600px){
    .adapative{ display: inline-block; }
    .navbar{ display: none; }
    .home-page{margin-top: 100px;}
    .home-page > img{ z-index: 0; top: 5%;}
    .home-page > h1{ font-size: 150px; margin: 150px 0; }
    .home-page > .container, .information > ul{ justify-content: center; column-gap: 22px; margin-top: 50px;}
    .home-page > .container > .information > ul > li, .home-page > .container > .information > ul > p{ font-size: 8px; }
    .about-me{ margin-top: 150px; flex-wrap: wrap; }
    .circle{width: 125px; height: 125px; filter: blur(35px); }
    .works{ margin-top: 100px; }
    .works-experience > h2{ font-size: 200px; }
    .works-experience > h2::after{ font-size: 10px; border: 2px solid white; padding: 3px 4px; }
    .works-experience > p{ font-size: 8px; }
    .works-content > a{ top: 15%; }
    .works-content > a > h6{ font-size: 14px;}
    .services { margin-bottom: 50px; }
    .services > h2{ font-size: 60px;}
    .ui-jedi, .telegram, .youtube{ width: 300px; height: 300px; }
    .my-channels > h3{  font-size: 30px; }
    .footer > .start-project > h3{ font-size: 60px; line-height: normal; }
    .footer { padding-top: 200px; }
    .footer-information{ flex-direction: column; }
    .form__container{max-height: 390px;}
    .form__input > input, .form__input > .select-wrapper > select{width: 250px;}
}

@media (max-height: 900px){
    .form-menu > h4{ margin: 25px 0; }
}

@media (max-height: 600px){
    .form-menu > h4{ margin: 25px 0; }
}

@media (min-width: 600px) {
    .nav-menu.active{display: none;}
}

@media (max-width: 300px)
{
    .works-content > a{ top: 20%; }
    .home-page > h1{ font-size: 150px; margin: 75px 0; }
    .works-content > a > h6{ font-size: 10px;}
    .form-menu > h4{ font-size: 45px; }
    .form__input > input, .form__input > .select-wrapper > select{width: 200px;}
}