.navbar-buttons--zoom { display: none; } .navbar-page-btn { max-width: 200px; } .gf-timepicker-nav-btn { max-width: 120px; } .navbar-buttons--actions { display: none; } // Media queries // --------------------- @include media-breakpoint-down(xs) { input[type='text'], input[type='number'], textarea { font-size: 16px; } } @include media-breakpoint-up(sm) { .navbar-page-btn { max-width: 250px; } .gf-timepicker-nav-btn { max-width: 200px; } } @include media-breakpoint-up(md) { .navbar-buttons--actions { display: flex; } .navbar-page-btn { max-width: 325px; } .gf-timepicker-nav-btn { max-width: 240px; } } @include media-breakpoint-up(lg) { .navbar-buttons--zoom { display: flex; } .navbar-page-btn { max-width: 450px; } .gf-timepicker-nav-btn { max-width: none; } } @include media-breakpoint-up(xl) { .navbar-page-btn { max-width: 600px; } }