@media all and(max-width: 1200px) { nav { min-width: auto; } html, body { font-size: 1.2rem; } .bg-shader { height: 100%; min-height: 100vh; } .product-values-block { padding: 1em; } #homepage { .main-section { padding: 2rem; } .btn { display: block; width: 100%; font-size: 1.25em; } } #caisse-now { .product-box { width: 100%; } .product-button { min-width: calc(100% - 56px) } .listing-products { .btn, button { font-size: 1rem; padding: 0.2em; border-radius: 0.3em; } } } } @media all and(max-width: 1200px) { #bodyland { .container { min-height: 100vh; width: 80vw; } } #menu-dashboard { font-size: 1rem; width: 19vw; min-width: 200px; .nav { min-width: 200px; } } form { margin-top: 3em; select { width: 100%; margin: 1em 0; } + ul { margin-top: 1em; list-style-type: none; a { display: block; .fa { margin-right: 1em; } } } } } @media all and(max-width: 600px) { html, body { font-size: 1rem; } #menu-dashboard .nav .logo-home.btn-default { height: auto; font-size: 2em; } #menu-dashboard { width: 100vw; visibility: hidden; &.shown { visibility: visible; } .nav { min-width: 200px; height: 100vh; overflow: auto; a { font-size: 2rem; } } } .main-section > div { padding-top: 0; } .product-values{ padding: 0; } .bigger-text, #homepage, .hint, .product-values-block { font-size: 1.25rem; line-height: 2rem; } .category-listing { width: calc(100vw - 4rem); height: 25vh; min-height: auto; float: left; clear: both; overflow: auto; } .sellings, .client-now { input { width: 100%; font-size: 1.5rem; padding: 0.5rem; } } .big-footer { font-size: 1rem; } #caisse-now .product-box { margin-bottom: 0.25rem; } #caisse-now .listing-products button { padding: 0.5rem 1rem; .express-button { padding: 0.5rem 1rem; } } }