.card { width: 240px; } .card_container { display: flex; flex-direction: row; flex-wrap:wrap; gap: 20px; width: 1200px; margin: auto; justify-content: center; margin-bottom: 100px; } @media only screen and (max-width: 1250px) { .card_container { width: 98vw; padding: 0px; } } .h1 { margin-left: auto; margin-right: auto; width: max-content; margin-top: 50px; margin-bottom: 20px; display: flex; flex-direction: column; gap: 10px; text-align: center; } .buttons { display: flex; gap: 18px; align-items: center; } .more_info { flex-grow: 1; text-align: right; } .info_container { display: flex; flex-direction: row; } .card_actions { padding: 8px; position: absolute; bottom: 0; left: 0; display: flex; flex-direction: column; gap: 5px; } .spacer { width: 500px; border-bottom: 1px solid lightgray; margin-left: auto; margin-right: auto; } @media only screen and (max-width: 600px) { .spacer { width: 80vw; } .h1 { max-width: 80vw; /*word-break: break-all;*/ } } .confirm_button { width: 300px; } @media only screen and (max-width: 320px) { .confirm_button { width: 80vw; } } .menu_icon { position: fixed !important; top: 20px; left: 100vw; transform: translateX(calc(-100% - 40px)); font-size: 48px; border-radius: 100px !important; z-index: 2; } .link_menu { position: fixed; left: 100vw; transform: translateY(-50px) translateX(-100%); width: 400px; height: 100vh; background-color: white; filter: drop-shadow(0px 0px 15px gray); z-index: 1; display: flex; flex-direction: column; gap: 16px; font-size: 22px; padding: 32px; } .link_menu div:last-of-type { margin-top: 22px; } @media only screen and (max-width: 600px) { .link_menu { position: fixed; left: 0; transform: translateY(-50px); width: 100vw; height: max-content; min-height: 300px; background-color: white; z-index: 1; display: flex; flex-direction: column; gap: 16px; font-size: 22px; padding: 32px; padding-top: 74px !important; } .menu_icon { position: fixed !important; top: 20px; left: 120px; font-size: 48px; border-radius: 100px !important; z-index: 2; } } .footer { width: 100vw; height: 50px; } .login { text-align: center; } .login_container { width: 100vw; height: 100vh; display: flex; align-items: center; justify-content: center; } .reciept_div { display: flex; flex-direction: row; gap: 5px; width: max-content; }