@import url(https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700;800&display=swap);
.ant-layout {
  background: white !important; }

.ant-layout-content {
  padding: 0px;
  margin: 0px; }

.ant-layout-header {
  padding-left: 20px !important;
  padding-right: 20px !important; }

.ant-page-header.page-header {
  background-color: inherit;
  border-bottom: solid 2px rgba(179, 179, 179, 0.466);
  margin: auto; }
  .ant-page-header.page-header .ant-page-header-heading-title {
    padding: 0px;
    color: #797979;
    font-weight: 400; }

.form-header {
  text-align: center; }
  .form-header .ant-page-header-heading-title {
    font-size: 2vh !important;
    color: #797979;
    font-weight: 300; }

.logo > img {
  margin: 20px auto;
  display: block; }

.logo .greetings {
  font-size: 1.5vh;
  color: #fff; }

#triggericon {
  position: absolute;
  top: 12px;
  z-index: 99;
  color: #fff; }
  #triggericon.closed {
    left: 10px; }
  #triggericon.opened {
    left: 200px; }

hr {
  border: solid 0.7px #b8b8b8;
  margin-bottom: 20px; }

.text-right {
  text-align: right !important; }

.text-center {
  text-align: center !important; }

col.ant-col {
  height: 100%;
  margin: auto; }

.ant-col.ant-form-item-label {
  text-align: left; }

.ant-row.ant-form-item {
  margin: auto; }

.homePage {
  font-family: 'Open Sans', sans-serif;
  font-weight: 400;
  color: black; }
  .homePage p {
    font-size: 20px; }
  .homePage h1 {
    font-size: 40px; }
  .homePage h2 {
    font-size: 24px;
    font-weight: 600; }
  .homePage h3 {
    font-size: 24px;
    color: #707070;
    margin-top: -10px; }

.page {
  min-height: 85vh;
  margin-left: 10vw;
  margin-right: 10vw;
  margin-bottom: 5vh; }
  .page .note {
    text-align: center;
    background-color: #ffffcc;
    border: 1px solid #c2c2c2; }
    .page .note p {
      margin-top: 10px;
      margin-bottom: 10px; }

.header {
  margin-bottom: 5vh;
  margin-left: 10vw;
  margin-right: 10vw; }
  .header > img {
    margin: 20px auto;
    display: inline-block; }
  .header hr.headDivider {
    width: 100%;
    border: 2px solid #F89B1D; }

.ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-tab-active {
  color: #F89B1D !important; }

.ant-switch-checked {
  background-color: #F89B1D !important; }

.menuSection p {
  font-size: 15px; }

.subsType {
  margin-bottom: 5px; }

.goalName {
  font-weight: 600;
  margin-bottom: 5px; }

.menuCard {
  height: 70vh;
  position: relative; }
  .menuCard .selected {
    position: absolute;
    visibility: hidden;
    max-width: 3vw;
    max-height: 3vw;
    margin-left: 5px;
    margin-top: 5px; }
  .menuCard:hover {
    border: 2px solid #FCB448; }
  .menuCard.active {
    border: 4px solid #FCB448; }
    .menuCard.active .selected {
      visibility: visible; }
  .menuCard .menuImage {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
    max-width: 16vw;
    max-height: 16vw; }
  .menuCard .allergy {
    display: inline-block;
    margin-left: 5px;
    margin-right: 5px; }

.unavailable img {
  filter: grayscale(100%); }

.unavailable:hover {
  border: 1px solid black; }

.menu-confirmation .card {
  height: 55vh;
  max-height: 26vw; }
  .menu-confirmation .card p {
    color: #707070; }
  .menu-confirmation .card h3 {
    font-size: 1vw;
    color: black;
    font-weight: 600; }
  .menu-confirmation .card .cardImage {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
    max-width: 18vw;
    max-height: 18vw;
    border-radius: 10px; }
  .menu-confirmation .card .allergy {
    display: inline-block;
    margin-left: 5px;
    margin-right: 5px; }
  .menu-confirmation .card .skipped {
    filter: grayscale(100%); }

.ant-btn.enterButton {
  background-color: #FCB448;
  width: 496px;
  height: 64px;
  color: white;
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 50px;
  margin-top: 5vh;
  outline: none;
  border: none; }
  .ant-btn.enterButton:hover {
    background-color: #FCB448;
    color: white;
    border: 4px solid #FCB448; }
  .ant-btn.enterButton:active {
    background-color: #CF8400 !important;
    border: 4px solid #CF8400; }
  .ant-btn.enterButton:focus {
    background-color: #FCB448;
    color: white; }

.footer {
  background-color: black;
  min-height: 600px; }
  .footer .footerContent {
    margin-top: 5vh;
    margin-left: 10vw;
    margin-right: 10vw; }
    .footer .footerContent h3 {
      font-size: 18px;
      font-weight: 600;
      color: white; }
    .footer .footerContent a, .footer .footerContent p {
      font-size: 14px;
      color: white; }
    .footer .footerContent .walogo {
      display: inline-block;
      max-width: 18px;
      max-height: auto; }
    .footer .footerContent .socialMediaLogo {
      display: inline-block;
      max-width: 18px;
      margin-right: 20px;
      margin-bottom: 20px;
      max-height: auto; }
    .footer .footerContent .masterCardLogo {
      display: inline-block;
      margin-top: 5px;
      margin-right: 10px;
      max-height: 22px;
      max-width: auto; }
    .footer .footerContent .wanumber {
      display: inline-block;
      margin-left: 5px; }
    .footer .footerContent .boldText {
      font-size: 17px;
      font-weight: 600; }
    .footer .footerContent .moreButton {
      background-color: #FCB448;
      height: 120%;
      width: auto; }

@media only screen and (max-width: 1366px) {
  .homePage p {
    font-size: 1.3vw; }
  .homePage h1 {
    font-size: 2.5vw; }
  .homePage h2 {
    font-size: 1.8vw;
    font-weight: 600; }
  .homePage h3 {
    font-size: 1.8vw;
    color: #707070;
    margin-top: -10px; }
  .header {
    margin-bottom: 50px; }
  .menuCard {
    height: 600px; }
    .menuCard h3 {
      font-size: 1.5vw; }
    .menuCard p {
      font-size: 1.2vw; }
  .footer .footerContent {
    margin-left: 5vw;
    margin-right: 5vw; } }

@media only screen and (max-width: 1024px) {
  .homePage h1 {
    font-size: 2.5vw; }
  .homePage h3 {
    font-size: 2vw; }
  .page {
    min-height: 0;
    margin-bottom: 10vh; }
  .menuCard {
    height: 500px;
    position: relative; }
    .menuCard .selected {
      position: absolute;
      visibility: hidden;
      max-width: 3vw;
      max-height: 3vw;
      margin-left: 5px;
      margin-top: 5px; }
    .menuCard:hover {
      border: 2px solid #FCB448; }
    .menuCard.active {
      border: 4px solid #FCB448; }
      .menuCard.active .selected {
        visibility: visible; }
    .menuCard .menuImage {
      margin-left: auto;
      margin-right: auto;
      margin-bottom: 10px;
      max-width: 21vw;
      max-height: 21vw; }
    .menuCard .allergy {
      display: inline-block;
      margin-left: 5px;
      margin-right: 5px; }
  .footer {
    min-height: 60vh; } }

@media only screen and (max-width: 768px) {
  .homePage {
    margin-top: 2vh; }
    .homePage p {
      font-size: 2vw; }
    .homePage h1 {
      font-size: 4vw; }
    .homePage h3 {
      font-size: 3vw; }
  .header {
    margin: 0vh 0 0vh 0; }
  .container {
    overflow-x: scroll;
    display: flex !important;
    justify-content: flex-start; }
  .item {
    white-space: normal; }
  .menuCard {
    height: 60vh; }
    .menuCard .selected {
      max-width: 5vw;
      max-height: 5vw; }
    .menuCard .menuImage {
      max-width: 40vw;
      max-height: 40vw; }
  .menu-confirmation .card {
    min-height: 0vh; }
    .menu-confirmation .card h3 {
      font-size: 2.5vw; }
    .menu-confirmation .card .allergy {
      display: inline-block;
      margin-left: 2px;
      margin-right: 2px; }
  .page {
    padding: 0;
    margin-left: 5vw;
    margin-right: 5vw;
    min-height: 30vh; }
  .footer {
    min-height: 120vh; } }

@media only screen and (max-width: 576px) {
  .homePage p {
    font-size: 4vw; }
  .homePage h1 {
    font-size: 8vw; }
  .homePage h2 {
    font-size: 6vw; }
  .homePage h3 {
    font-size: 6vw; }
  .ant-btn.enterButton {
    width: 90%;
    height: 15vw;
    font-size: 5vw;
    font-weight: 600;
    margin-bottom: 50px;
    margin-top: 5vh; }
  .menuCard {
    height: 85vh; }
    .menuCard .selected {
      max-width: 10vw;
      max-height: 10vw; }
    .menuCard .menuImage {
      max-width: 50vw;
      max-height: 50vw; }
  .menuSection .subsType {
    font-size: 8vw;
    font-weight: 600; }
  .menu-confirmation .card h3 {
    font-size: 3.5vw; }
  .menu-confirmation .card .allergy {
    height: 6vw;
    width: 6vw; }
  .page {
    min-height: 50vh; }
    .page .userName {
      visibility: hidden; }
  .footer .footerContent {
    margin-left: 5vw;
    margin-right: 5vw;
    margin-bottom: 25vh; }
    .footer .footerContent h3 {
      font-size: 5.5vw; }
    .footer .footerContent .product {
      display: inline-block; }
    .footer .footerContent a, .footer .footerContent p {
      font-size: 3.5vw; }
    .footer .footerContent .boldText {
      font-size: 3.5vw; } }