Why is media not working in bootstrap?

Question

css

The media query stops working after 768px, I don't understand what the problem is, maybe I missed something or made a mistake somewhere. Here is the site skillbets.ru

@media (min-width: 768px) and (max-width: 991px) {
  body{
    font-size: 16px;
  }
  /* Header */
  .header{
    &-menu{
      display: block;
      text-align: center;
      &-social{
        margin: 2em 0;
      }
    }
    &-content{
      &-line{
        img{
          display: none;
        }
        p{
          margin: 0;
        }
      }
      &-btn{
        img{
          left: 53%;
        }
        p{
          left: 60%;
        }
      }
    }
  }
}
@media (min-width: 576px) and (max-width: 767px){
  body{
    font-size: 15px;
  }
  /* Header */
  .header{
    &-menu{
      display: block;
      text-align: center;
      &-social{
        margin: 2em 0;
      }
    }
    &-content{
      &-btn{
        img{
          display: none;
        }
        p{
          display: none;
        }
      }
    }
  }
}

>
Working with Less

Answer 1

Delete(min-width: 768px)