/* Base ================================================== */
:root {
    --color-primary: #ce1d51;
    --color-secondary: #00820f;
    --color-tertiary: #cfa332;
  
    --base-font-size: 16px;
  }
  
  html { font-size: var(--base-font-size); scroll-behavior: smooth; }
  
  * { outline: none; }
  body { font-family: 'Manrope'; }
  h1,h2,h3,h4, p { }
  h1 { color: var(--color-primary); font-size: 3.75rem; font-weight: 700; margin-bottom: 0; }
  h2 { font-size: 2.25rem; font-weight: 700; }
  h3 { color: var(--color-primary); font-size: 1.5rem; font-weight: 600; }
  h4 { font-weight: 700; }
  h5 { color: var(--color-primary); }
  p {  }
  p a { color: var(--color-primary); }
  img { max-width: 100%; height: auto; object-fit: cover; }
  table { width: 100%; margin-bottom: 25px; }
  table th,
  table td { padding: 10px; }
  table tbody tr:nth-child(even) { background: #FFF5F8; }
  .btn { border-radius: 0; padding: 10px 20px; }
  .btn::after { }

  .btn.focus,
  .btn:focus { box-shadow: 0 0 0 0.2rem rgb(206 29 81 / 30%); }
  
  .btn-primary { background: var(--color-primary); border-color: var(--color-primary); border: 2px solid var(--color-primary); }
  .btn-primary:hover { background: #e5648a; border-color: #e5648a; }
  .btn-primary:not(:disabled):not(.disabled):active { background: #940f36; border-color: #940f36; }
  .btn-primary:focus { background: #940f36; border-color: #940f36; box-shadow: 0 0 0 0.25rem rgb(190 83 93 / 50%); }
  
  .btn-secondary { background: rgb(206 29 81 / 0%); color: var(--color-primary); border: 2px solid var(--color-primary); font-weight: 600; }
  .btn-secondary:hover { background: rgb(206 29 81 / 100%); color: #fff; border: 2px solid var(--color-primary); }
  
  .btn-success { background: var(--color-secondary); border: 2px solid var(--color-secondary); font-weight: 600; }
  .btn-success:hover {  }
  
  .btn-edit::after { content: '\f303'; font-family: 'Font Awesome 5 Pro'; margin-left: 10px; }
  .btn-add::after { content: '\2b'; font-family: 'Font Awesome 5 Pro'; margin-left: 10px; font-weight: 700; }
  
  ::selection { background: var(--color-primary); color: #fff; }
  
  select { padding: 5px; border: 1px solid #B4B4B4; border-radius: 5px; background: #fff; }
  
  textarea { background: none; border: none; border-bottom: 1px solid var(--color-primary); width: 100%; max-width: 600px; }
  
  .form-group { margin-bottom: 0; }
  .form-group .row { margin: 0 -5px; }
  .form-group .row > * { padding-left: 5px; padding-right: 5px; }
  .form-group .form-control { height: auto; padding: 15px 10px; margin-bottom: 10px; border-color: #B4B4B4; }
  
  /* Nav ================================================== */
  .topbar { background: #fff; position: sticky; top: 0; z-index: 3; }
  nav.navbar { padding: 4px 15px; margin: 0 -15px; background: #fff; box-shadow: 0 3px 6px rgb(0 0 0 / 15%); z-index: 1; }
  nav .navbar-collapse { justify-content: flex-end; }
  nav .navbar-nav .nav-item .nav-link { color: #000; }
  nav .navbar-brand { padding: 0; }
  nav .nav-item.active { font-weight: 700; }
  nav .right-menu { display: flex; order: 2; }
  nav .navbar-toggler { margin-right: 10px; }
  
  nav .font-size-select {  }
  nav .font-size-select button { background: none; border: none; color: var(--color-primary); letter-spacing: -3px; }
  nav .font-size-select button:focus { outline-color: var(--color-primary); }
  nav .font-size-select button:active { transform: translateY(2px); }
  nav .font-size-select button:disabled { opacity: 0.4; }
  nav .font-size-select button .fas { width: 10px; }
  nav .font-size-select button.increase-size { font-size: 1.5rem; font-weight: 700; }
  nav .font-size-select button.increase-size .fas { font-size: 0.75rem; transform: translateY(-100%); }
  nav .font-size-select button.decrease-size .fas { font-size: 0.5rem; transform: translateY(-100%); }
  
  .store-message { background: var(--color-primary); color: #fff; }
  .store-message p { font-size: 1.2rem; margin-bottom: 0; }
  .store-message *::selection { background: #fff; color: var(--color-primary); }

  .options-select { background: #fff; box-shadow: 0 3px 6px rgb(0 0 0 / 15%); }
  .options-select .container { display: flex; justify-content: space-between; }
  .options-select .profiles-select { display: flex; align-items: stretch; flex-grow: 1; margin-right: 25px; }
  .options-select .profiles-select .profile { font-weight: 700; position: relative; display: flex; align-items: center; justify-content: center; border-right: 1px solid #ddd; border-top: 0; border-bottom: 0; border-left: 0; color: #8E8E8E; outline: none; background: #fff; flex-grow: 1; max-width: 120px; }
  .options-select .profiles-select .profile:focus { box-shadow: inset 0px 0px 0px 2px var(--color-primary); }
  .options-select .profiles-select .profile:active { box-shadow: inset 0px 0px 0px 4px var(--color-primary); transform: translateY(2px); }
  .options-select .profiles-select .profile:last-child { border-right: none; }
  .options-select .profiles-select .profile i { margin-right: 10px; }
  /* .options-select .profiles-select .profile i.fa-plus { margin-right: 0; font-size: 1.5rem; } */
  .options-select .profiles-select .profile i.fa-check { display: none; }
  .options-select .profiles-select .profile.active { background: #FFF5F8; color: var(--color-primary); }
  .options-select .profiles-select .profile:hover { cursor: pointer; background: #FFF5F8; }
  /* .options-select .profiles-select .profile.complete { background: #FFF5F8; color: rgb(0 0 0 / 20%); } */
  /* .options-select .profiles-select .profile.complete::after { content: '\f00c'; font-family: 'Font Awesome 5 Pro'; position: absolute; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; font-size: 2rem; color: var(--color-primary); font-weight: 700; opacity: 1; } */
  .options-select .profiles-select .profile.complete { color: var(--color-secondary); }
  .options-select .profiles-select .profile.complete i.fa-check { display: block; color: var(--color-secondary); }
  .options-select .profiles-select .profile.complete i.fa-user { display: none; }
  .options-select .week-select { display: flex; align-items: center; flex-grow: 1; margin-left: 25px; justify-content: flex-end; }
  .options-select .week-select .week { padding: 10px 0; font-size: 1rem; display: flex; align-items: center; justify-content: center; border-right: 1px solid #ddd; border-top: 0; border-bottom: 0; border-left: 0; color: #8E8E8E; outline: none; background: #fff; flex-grow: 1; max-width: 100px; position: relative; }
  .options-select .week-select .week:focus { box-shadow: inset 0px 0px 0px 2px var(--color-primary); }
  .options-select .week-select .week:active { box-shadow: inset 0px 0px 0px 4px var(--color-primary); transform: translateY(2px); }
  .options-select .week-select .week:hover { cursor: pointer; background: #FFF5F8; text-decoration: none; }
  .options-select .week-select .week:last-child { border-right: none; }
  .options-select .week-select .week i.fa-check { display: none; }
  /* .options-select .week-select .week.complete { background: #FFF5F8; color: rgb(0 0 0 / 20%); }
  .options-select .week-select .week.complete::after { content: '\f00c'; font-family: 'Font Awesome 5 Pro'; position: absolute; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; font-size: 2rem; color: var(--color-secondary); font-weight: 700; opacity: 1; }
  .options-select .week-select .week.complete strong { opacity: 0.5; } */
  .options-select .week-select .week strong { font-size: 1.25rem; margin-left: 5px; font-weight: 700; color: var(--color-primary); line-height: 1; }
  .options-select .week-select .week.complete { color: var(--color-secondary); }
  .options-select .week-select .week.complete i.fa-check { display: inline-block; color: var(--color-secondary); margin-right: 5px; }
  .options-select .week-select .week.complete strong { color: var(--color-secondary); }
  .options-select .week-select .week.active { background: #FFF5F8; }
  /* .options-select .week-select .week.complete, */
  .options-select .week-select .week.active:hover { background: #f8e4ea; }
  .options-select .week-select .week-mobile-select { display: none; }

  .modal-content .selected-profile { color: var(--color-primary); }
  .modal-content .options-select { box-shadow: none; border-top: 1px solid #dee2e6; }
  .modal-content .options-select .profiles-select { margin-right: 0; justify-content: center; }
  .modal-content .options-select .profiles-select .profile { padding: 25px 5px; }
  .modal-content .btn { border: 2px solid #fff; font-weight: 700; }
  .modal-content .btn::after { content: '\f30b'; font-family: 'Font Awesome 5 Pro'; margin-left: 10px; }
  
  /* Header ================================================== */
  .header { background: #FFF5F8; overflow: hidden; }
  .header .row { align-items: center; }
  .header .container { padding-bottom: 50px; }
  .header .btn { margin-bottom: 10px; }
  .header .btn-primary::after { content: '\f30b'; font-family: 'Font Awesome 5 Pro'; margin-left: 10px; }
  .header .btn-success { display: inline-flex; align-items: center; margin-right: 20px; }
  .header .btn-success::after { content: ''; background: url('../images/checkout-white.svg'); width: 20px; height: 20px; background-size: 20px 20px; display: inline-block; margin-left: 10px; }
  /* .hex-imgs { display: flex; margin: -50px 0; flex-wrap: wrap; }
  .hex-imgs polygon { stroke: #fff; stroke-width: 2px; }
  .hex-imgs svg { width: 50%; display: inline-block; margin: 0 -10px; }
  .hex-imgs svg:nth-child(1) { transform: translateX(50%); }
  .hex-imgs svg:nth-child(2) {  }
  .hex-imgs svg:nth-child(3) {  }
  .hex-imgs svg:nth-child(4) {  } */
  
  /*.hex-imgs { margin: auto; margin-top: -125px; max-width: 1000px; display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 200px; grid-gap: 0; padding-bottom: 0; }
  .hex:first-child { grid-row-start: 1; grid-column: 2 / span 2; }
  .hex:nth-child(2) { grid-row-start: 2; grid-column: 1 / span 2; }
  .hex:nth-child(3) { grid-row-start: 2; grid-column: 3 / span 2; } */
  
  .hex-imgs { display: flex; flex-wrap: wrap; margin-top: -36px; }
  .hex-imgs .hex { display: flex; justify-content: center; align-items: center; position: relative; width: 50%; flex-shrink: 0; clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%); padding-bottom: 60%; background: #fff; }
  .hex-imgs .hex-imgs-row { width: 100%; flex-shrink: 0; display: flex; transform: translate(25%,25%); margin-top: -66px; }
  .hex-imgs img { width: 98%; height: 98%; display: block; object-fit: cover; clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%); position: absolute; top: 1%; left: 1%; }
  
  .steps-3 { background: #fff; border: 1px solid var(--color-primary); border-radius: 5px; transform: translateY(-50%); margin: 0; margin-bottom: -50px; }
  .steps-3 .item { padding: 15px 0 15px 15px; }
  .steps-3 .content { height: 100%; display: flex; align-items: center; padding: 10px 0; border-right: 1px solid var(--color-primary); padding-right: 15px; }
  .steps-3 .item:nth-child(3) .content { border: none; }
  .steps-3 .content .img-wrap { margin-right: 15px; }
  .steps-3 .content .img-wrap img { height: auto; max-width: none; }
  
  /* Content ================================================== */
  .week-btns { margin-bottom: 50px; }
  .week-btns .btn { margin-right: 10px; margin-bottom: 10px; }
  .week-btns .btn:nth-child(4) { margin-right: 0; }
  
  
  .week-view { margin-bottom: 50px; }
  .week-view .row { padding: 40px 0; margin: 0; }
  .week-view .row.total-end { padding: 0; }
  .week-view.week-no-order-view .row:nth-child(odd) { background: #FFF5F8; }
  .week-view .weekday-wrap { display: flex; flex-direction: column; align-items: center; justify-content: center; }
  .week-view .weekday-hex { background: var(--color-primary); clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%); width: 66px; height: 70px; font-size: 1.5rem; color: #fff; font-weight: 700; display: flex; justify-content: center; align-items: center; text-transform: capitalize; }
  .week-view .weekday-hex::selection { background: #fff; color: var(--color-primary); }
  .week-view .weekday-wrap span { font-size: 0.875rem; font-weight: 700; text-align: center; }
  
  .week-view .dish-wrap:nth-of-type(2) { padding-right: 5px; }
  .week-view .dish-wrap:nth-of-type(3) { padding-left: 5px; }
  .week-view .dish-wrap:nth-of-type(4) { padding-right: 5px; order: 2; margin-left: 8.333333%; margin-top: 10px; }
  .week-view .dish-card { display: flex; flex-direction: column; justify-content: space-between; border: 2px solid var(--color-primary); border-radius: 5px; background: #fff; padding: 12px 20px; height: 100%; position: relative; }
  .week-view .dish-card .dish-desc { display: flex; justify-content: space-between; color: var(--color-tertiary); font-weight: 700; margin-bottom: 5px; }
  .week-view .dish-card .dish-desc span i { color: var(--color-primary); margin-right: 10px; display: none; }
  .week-view .dish-card h4 { font-size: 1.125rem; font-weight: 700; margin-bottom: 0; flex-grow: 1; }
  .week-view .dish-card .dish-bottom { flex-grow: 1; display: flex; flex-direction: column; justify-content: flex-end; }
  .week-view .from-price { display: flex; flex-direction: column; justify-content: center; }
  .week-view .from-price h4 { font-size: 1rem; font-weight: 700; margin-bottom: 0; padding-left: 20px; }
  .week-view .from-price h4 strong { display: block; color: var(--color-secondary); font-size: 1.5rem; font-weight: 700; }
  .week-view .order-btn { display: flex; flex-direction: column; justify-content: center; }
  .week-view .btn::after { content: '\f2e7'; font-family: 'Font Awesome 5 Pro'; font-weight: 200; font-size: 120%; margin-left: 10px; }
  
  .week-order-view > .row { border-bottom: 1px solid #B4B4B4; }
  
  .week-order-view label.dish-card { transition: box-shadow 0.3s; user-select: none; }
  .week-order-view label.dish-card input[type="checkbox"] { position: absolute; top: 0; left: 0; height: 0; width: 0; visibility: hidden; }
  .week-order-view label.dish-card.active { box-shadow: inset 0px 0px 0px 3px var(--color-primary); }
  .week-order-view label.dish-card:hover { background: rgb(189 33 48 / 3%); cursor: pointer; }
  .week-order-view label.dish-card.active .dish-desc span i { display: inline-block; }
  .week-order-view label.dish-card select { width: 100%; margin-top: 10px; margin-bottom: 20px; }
  .week-order-view label.dish-card .btn-success { pointer-events: none; }
  .week-order-view label.dish-card .btn-success::after { content: '\f067'; transform: translateY(1px); display: inline-block; }
  .week-order-view label.dish-card .btn-success .remove { display: none; }
  .week-order-view label.dish-card.active .btn-success { background: var(--color-primary); border-color: var(--color-primary); }
  .week-order-view label.dish-card.active .btn-success::after { content: '\f1f8'; }
  .week-order-view label.dish-card.active .btn-success .remove { display: inline; }
  .week-order-view label.dish-card.active .btn-success .add { display: none; }
  
  .order-title { margin-top: 25px; }
  .order-title h3 { color: #000; font-weight: 700; }
  .order-title h3 span.order-for { color: var(--color-primary); }
  
  .voor-erbij {  }
  .voor-erbij h3 { margin-bottom: 15px; }
  .voor-erbij .item { display: flex; align-items: center; margin-bottom: 15px; }
  .voor-erbij .item label { margin: 0; display: flex; align-items: center; margin-right: 15px; }
  .voor-erbij .item input { max-width: 50px; margin-right: 10px; border: 1px solid #B4B4B4; border-radius: 5px; padding: 5px; }
  .voor-erbij .item .price { color: var(--color-secondary); }
  
  .selected-meals-bar { position: sticky; bottom: 0; background: var(--color-primary); color: #fff; z-index: 2; box-shadow: 0 -3px 6px rgb(0 0 0 / 15%); margin-bottom: -75px; font-size: 0.8rem; }
  .selected-meals-bar *::selection { background: #fff; color: var(--color-primary); }
  .selected-meals-bar .container { display: flex; justify-content: space-between; align-items: center; padding: 10px 15px; }
  .selected-meals-bar .meals-text { font-weight: 700; margin-right: 10px; position: relative; }
  .selected-meals-bar .meals-text .price { font-size: 1.4rem; }
  .selected-meals-bar .btn { border: 2px solid #fff; font-weight: 700; }
  .selected-meals-bar .btn::after { content: '\f178'; font-family: 'Font Awesome 5 Pro'; margin-left: 10px; }
  .selected-meals-bar .tooltip-week-total { position: absolute; background: var(--color-secondary); bottom: calc(100% + 10px); padding: 10px 20px; border-radius: 5px; }
  .selected-meals-bar .tooltip-week-total::after { content: ''; position: absolute; width: 0px; height: 0px; border-top: 10px solid var(--color-secondary); border-right: 15px solid transparent; border-bottom: 15px solid transparent; border-left: 15px solid transparent; top: 100%; left: calc(50% - 8px); display: block; }
  .order-next-week-btn { margin-bottom: 50px; display: flex; justify-content: flex-end; }
  .order-next-week-btn .btn::after { content: '\f178'; font-family: 'Font Awesome 5 Pro'; margin-left: 20px; }
  
  .vervolg-header { background: #FFF5F8; padding: 40px 15px; margin-bottom: 25px; }
  .vervolg-header.header-title-btn .container { display: flex; justify-content: space-between; align-items: center; }
  .vervolg-header.header-title-btn .btn::after { content: '\f178'; font-family: 'Font Awesome 5 Pro'; margin-left: 10px; }
  
  .account-menu-wrap { position: sticky; top: 75px; }
  .account-menu { list-style: none; border-left: 2px solid var(--color-primary); padding-left: 20px; margin-top: 20px; }
  .account-menu li { margin-bottom: 5px; }
  .account-menu a { color: #000; }
  .account-menu li.active a { font-weight: 700; }

  .bestelprofielen-voorkeuren { margin-bottom: 50px; }
  
  .title-option { background: #FFF5F8; display: flex; justify-content: space-between; align-items: center; padding: 20px 25px; margin-bottom: 25px; }
  .title-option h4 { margin: 0; }
  .title-option span.subtitle { font-style: italic; display: none; }
  .title-option.disabled span.subtitle { display: inline; }
  .title-option select { min-width: 200px; }
  
  .profiles-table,
  .profiles-table thead,
  .profiles-table tbody { display: block; }
  
  .profiles-table thead { border-bottom: 1px solid #707070; }
  .profiles-table tr { display: flex; align-items: center; }
  .profiles-table th,
  .profiles-table td { flex-grow: 1; width: 33%; }
  .profiles-table .mobile-title { display: none; }
  .profiles-table .delete-btn-wrap { flex-grow: 0; flex-shrink: 1; width: 50px; }
  .profiles-table .delete-btn-wrap button { background: none; border: none; color: var(--color-primary); }
  .profiles-table .delete-btn-wrap button:focus { outline-color: var(--color-primary); }
  .profiles-table .delete-btn-wrap button:active { transform: translateY(2px); }
  
  .edit-options { background: #FFF5F8; padding: 25px 35px; margin-bottom: 30px; }
  .edit-options .radios { display: flex; flex-wrap: wrap; }
  .edit-options .radios > * { margin-right: 25px; }
  .edit-options .radios > *:last-child { margin-right: 0; }
  .edit-options label.radio { position: relative; display: flex; cursor: pointer; align-items: center; margin-bottom: 0; }
  .edit-options label.radio input { visibility: hidden; position: absolute; top: 0; left: 0; width: 0; height: 0; }
  .edit-options label.radio .radio-circle { width: 20px; height: 20px; border-radius: 50%; background: #fff; border: 1px solid var(--color-primary); flex-shrink: 0; margin-right: 10px; display: flex; justify-content: center; align-items: center; font-size: 12px; color: #fff; }
  .edit-options label.radio:hover .radio-circle { background: #ffe9f0; }
  .edit-options label.radio input:checked+.radio-circle { background: var(--color-primary); }
  .edit-options label.radio input:checked+.radio-circle::after { content: '\f00c'; font-family: 'Font Awesome 5 Pro'; font-weight: 700; }
  .edit-options .seperator { border-right: 2px solid var(--color-primary); }
  .edit-options .checkboxes { display: flex; flex-wrap: wrap; margin: 15px -10px; }
  .edit-options .checkboxes .check-wrap { width: 50%; padding: 0 10px; }
  .edit-options label.checkbox { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--color-primary); padding: 15px 0; margin-bottom: 0; height: 100%; }
  .edit-options .checkboxes .check-wrap:nth-child(1) .checkbox,
  .edit-options .checkboxes .check-wrap:nth-child(2) .checkbox { border-top: 1px solid var(--color-primary); }
  .edit-options label.checkbox:hover { background: #ffe9f0; cursor: pointer; }
  .edit-options label.checkbox input { visibility: hidden; position: absolute; top: 0; left: 0; width: 0; height: 0; }
  .edit-options label.checkbox .check-square { width: 24px; height: 24px; margin-left: 10px; background: #fff; border: 1px solid var(--color-primary); flex-shrink: 0; display: flex; justify-content: center; align-items: center; font-size: 12px; color: #fff; }
  .edit-options label.checkbox:hover .check-square { background: #ffe9f0; }
  .edit-options label.checkbox input:checked+.check-square { background: var(--color-primary); }
  .edit-options label.checkbox input:checked+.check-square::after { content: '\f00c'; font-family: 'Font Awesome 5 Pro'; font-weight: 700; }
  
  .action-btns { display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0 -5px; }
  .action-btns .btn { margin: 0 5px 10px 5px; }
  
  .order-wrap { margin-bottom: 50px; }
  .order-wrap .title-wrap { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.5rem; }
  .order-wrap .title-wrap h2 { margin-bottom: 0; display: flex; align-items: center; }
  .order-wrap .title-wrap a { color: var(--color-primary); }
  .order-wrap .title-wrap a i { margin-left: 5px; }
  .order-wrap .title-wrap h2 .delete-customprofile { padding: 5px; font-size: 50%; margin-right: 5px; }
  .order-wrap .title-wrap h2 .delete-customprofile:hover { opacity: 0.7; }
  .order-wrap .title-wrap h2 sub { margin-left: 10px; background-color: #eee; line-height: 1; color: #aaa; padding: 2px 5px; font-size: 50%; bottom: 0; }
  .order-wrap .order { border-top: 2px solid var(--color-primary); border-bottom: 2px solid var(--color-primary); }
  .order-wrap .order.order-empty { border-bottom: 0; padding-top: 10px; }
  .order-wrap .order.order-empty a:hover { color: var(--color-primary); }
  .order-wrap .order.order-empty a i { margin-left: 5px; }
  .order-wrap .order .week-head { display: flex; align-items: center; padding: 5px 0 5px 15px; border-bottom: 1px solid #777; justify-content: space-between; }
  .order-wrap .order .week-head .head-text { display: flex; align-items: center; flex-grow: 1; justify-content: space-between; max-width: 600px; }
  .order-wrap .order .week-head .head-text > * { flex-grow: 1; margin-right: 10px; }
  .order-wrap .order .week-head .head-text .profile.week-link { color: var(--color-primary); flex-shrink: 0; flex-grow: 0; min-width: 15rem; }
  .order-wrap .order .week-head .head-text .profile.week-link i { font-size: 60%; margin-right: 10px; }
  .order-wrap .order h4 { margin-bottom: 0; display: flex; align-items: center; }
  .order-wrap .order .week-head .price { font-weight: 700; font-size: 1.25rem; color: var(--color-secondary); }
  .order-wrap .order .week-head .btn { padding-left: 15px; padding-right: 15px; }
  .order-wrap .order .week-head .btn::after { content: '\f077'; font-family: 'Font Awesome 5 Pro'; margin-left: 10px; display: inline-block; transition: transform 0.3s; }
  .order-wrap .order .week-head .btn.collapsed::after { transform: rotateX(180deg); }
  .order-wrap .order .week-content { padding: 15px; border-bottom: 1px solid #777; }
  .order-wrap .order .week-content .price { color: var(--color-secondary); }
  .order-wrap .order .day { margin-bottom: 25px; }
  .order-wrap .order .main-dish,
  .order-wrap .order .side-dish { display: flex; justify-content: space-between; align-items: center; }
  .order-wrap .order .day > .main-dish:nth-child(2) { margin-top: 10px; }
  .order-wrap .order .day > .main-dish:nth-child(2) .day-name span { display: none; }
  .order-wrap .order .main-dish h5 { color: #777; font-weight: 700; font-size: 1.125rem; margin-bottom: 0; margin-right: 10px; display: flex; }
  .order-wrap .order .main-dish h5 .day-name { width: 7rem; flex-shrink: 0; color: var(--color-primary); }
  .order-wrap .order .main-dish h5.no-main-dish { font-style: italic; }
  .order-wrap .order .main-dish .price { font-weight: 700; font-size: 1.125rem; flex-shrink: 0; }
  .order-wrap .order .side-dish { padding-left: 10px; }
  .order-wrap .order .side-dish .side-dish-name { display: flex; }
  .order-wrap .order .side-dish .side-dish-name .day-filler { width: 7rem; flex-shrink: 0; }
  .order-wrap .order .subtotal-wrap { display: flex; align-items: center; justify-content: space-between; padding: 10px 15px; }
  .order-wrap .order .subtotal-wrap .price { color: var(--color-secondary); font-weight: 700; font-size: 1.5rem; }

  .cartFooter > .cartTable-bottom:last-of-type { border-top: 2px solid #ccc; font-size: 1.5rem; }
  .cartFooter > .cartTable-bottom:last-of-type .value { font-weight: 700; color: var(--color-secondary); }
  .cartFooter .btn-success::after { content: '\f178'; font-family: 'Font Awesome 5 Pro'; margin-left: 15px; }
  
  .cart-summary { position: sticky; top: 75px; }
  .cart-summary .cart-el { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #777; padding: 5px 0; }
  .cart-summary .price { color: var(--color-secondary); font-size: 1.5rem; font-weight: 700; }
  .cart-summary .to-pay-btn-wrap { margin-top: 15px; display: flex; justify-content: flex-end; }
  .cart-summary .to-pay-btn-wrap .btn::after { content: '\f38a'; font-family: 'Font Awesome 5 Pro'; margin-left: 10px; }

  .password-input-wrap { position: relative; }
  .password-input-wrap input.form-control { padding-right: 50px; }
  .password-input-wrap button { position: absolute; right: 10px; height: 2.5rem; width: 40px; top: 0.4rem; background: none; border: none; color: rgb(0 0 0 / 50%); }
  .password-input-wrap button:hover { color: rgb(0 0 0 / 75%); }
  .password-input-wrap button:focus { outline-color: var(--color-primary); }
  .password-input-wrap button:active { transform: translateY(2px); }

  .page-content { padding-top: 50px; }
  .page-content h1 { margin-bottom: 25px; }

  .checkcontainer { user-select: none; color: var(--color-primary-accent); cursor: pointer; }
  .checkcontainer .checkmark { display: inline-flex; width: 10px; height: 10px; border-radius: 1px; border: 1px solid var(--color-primary); margin-right: 10px; position: relative; transition: 0.3s; top: 7px; flex-shrink: 0; justify-content: center; align-items: center; }
  .checkcontainer:hover .checkmark { background: var(--color-primary); opacity: 0.2; }
  .checkcontainer input[type="checkbox"] { position: absolute; height: 0; width: 0; visibility: hidden; }
  .checkcontainer input:checked ~ .checkmark { background: var(--color-primary); }
  .checkcontainer input:checked ~ .checkmark::after { content: '\f00d'; font-family: 'Font Awesome 5 Pro'; line-height: 11px; font-size: 8px; text-align: center; color: #fff; }
  .checkcontainer:hover input:checked ~ .checkmark { background: var(--color-primary); opacity: 0.8; }
  .checkcontainer .stock { color: #B5B5B5; }

  .checkout-form h4 { color: var(--color-primary); border-bottom: 1px solid var(--color-primary); padding-bottom: 10px; }
  .checkout-form .InvoiceCalcBox h4 { border: none; padding-bottom: 0; margin-top: 0; }
  .checkout-form .form-group { margin: 0; }
  .checkout-form .form-control { margin-bottom: 15px; }
  .checkout-form input[type="text"],
  .checkout-form input[type="password"],
  .checkout-form input[type="email"],
  .checkout-form select { height: auto; padding: 15px; }
  .checkout-form .payoption { border: 1px solid #B5B5B5; }
  .checkout-form .payoption input:checked ~ .radiobtn { background: var(--color-primary); }
  .checkout-form .payoption input:checked ~ .radiobtn::after { display: block; }
  .checkout-form .payoption .extraprice { color: var(--color-secondary); font-weight: 700; }
  .checkout-form .payMethodes > .form-group { display: flex; }
  .checkout-form .payMethodes label { margin-right: 5px; }
  .checkout-form .payMethodes label.active { border: 1px solid var(--color-secondary); box-shadow: 0 0 0 2px var(--color-secondary); }
  .checkout-form .payMethodes label span { display: inline-block; max-width: 80px; text-align: center; line-height: 1.2; color: #999; font-weight: 700; font-size: 0.8rem; }
  .btn.addcoupon::after { display: none; }
  .form-group a { color: var(--color-primary-accent); }

  .checkout-form .factuurgegevens input[type="text"],
  .checkout-form .factuurgegevens input[type="password"],
  .checkout-form .factuurgegevens input[type="email"],
  .checkout-form .factuurgegevens select,
  .checkout-form .factuurgegevens .form-control { height: auto; padding: 8px 15px; }

  .faq-list .block.faq { width: 100%; }
  .faq-list .card { border: none; border-radius: 0; background: rgb(237 108 113 / 10%); }
  .faq-list .card:nth-child(even) { background: #fff; }
  .faq-list .card-header { background: none; padding: 0; cursor: pointer; border: none; }
  .faq-list h5 { padding: 20px 25px; display: flex; align-items: center; text-transform: none; }
  .faq-list svg { margin-right: 10px; width: 10px; transition: transform 0.3s; transform: rotate(90deg); flex-shrink: 0; }
  .faq-list .mb-0.collapsed svg { transform: rotate(0deg); }
  .faq-list .mb-0.collapsed:hover svg { transform: rotate(15deg); }
  .faq-list .mb-0:hover svg { transform: rotate(75deg); }
  .faq-list .card-body { padding: 0 45px 15px 45px; }

  /* Betaald */
  .lunchbus-img {  }
  
  /* Footer ================================================== */
  footer { margin-top: 75px; background: #343A40; color: #fff; }
  footer .footer-banner-img { margin: 0 -15px; }
  footer .footer-banner-img img { width: 100%; height: 400px; object-fit: cover; }
  footer .foot { padding: 50px 0; border-bottom: 1px solid #fff; }
  footer .foot h4 { font-size: 1.5rem; font-weight: 700; margin: 0; }
  footer .menu-wrap { display: flex; }
  footer ul { list-style: none; padding: 0; margin: 0; }
  footer ul li { margin-bottom: 5px; }
  footer ul li a { color: #fff; }
  footer ul li a:hover { color: #fff; }
  footer ul:nth-child(1) { margin-right: 75px; }
  
  /* Endpage ================================================== */
  .endpage { padding: 10px 0; }
  .endpage .col-lg-6:nth-child(2) { text-align: right; }
  
  
  @media only screen and (max-width: 1439px) {
    .header .container { padding-bottom: 90px; }
    .hex-imgs { margin-top: -10px; }
  
    .steps-3 .item { padding: 10px 0 10px 15px; }
    .steps-3 .content { padding: 5px 15px 0 0; }
  
    .voor-erbij .item label > div { display: flex; flex-direction: column; }
    .voor-erbij .item .price { font-size: 14px; }

    .order-wrap .order .week-head .head-text .profile.week-link { min-width: 12rem; }
  }
  
  @media only screen and (max-width: 1199px) {
    .header { margin-bottom: 50px; }
    .header .container { padding-bottom: 120px; }
    .hex-imgs { margin-top: 30px; }
  
    .week-view .dish-card h4 { font-size: 1rem; }

    .order-wrap .order .week-head .head-text .profile.week-link { min-width: 10rem; }
  }
  
  @media only screen and (max-width: 991px) {
    nav .right-menu { display: flex; order: unset; }
  
    .header .container { padding-bottom: 0; }
    .header .col-md-7,
    .header .col-md-5 { flex: 0 0 100%; max-width: 100%; }
  
    .hex-imgs { margin-top: 0; margin-bottom: 25px; }
    .hex-imgs > .hex { display: none; }
    .hex-imgs .hex-imgs-row { transform: none; margin: 0; }
    .hex-imgs .hex-imgs-row .hex { clip-path: none; padding: 0; width: 100%; display: block; }
    .hex-imgs .hex-imgs-row .hex img { clip-path: none; width: 100vw; height: 300px; position: relative; top: 0; left: 50%; transform: translateX(-50%); }
  
    .steps-3 { transform: none; margin-bottom: 50px; }
    .steps-3 .item { padding: 10px 15px; }
    .steps-3 .content { padding: 10px 0; border-right: 0; border-bottom: 1px solid var(--color-primary); }
  
    .week-btns { margin-bottom: 25px; }
  
    .week-view .row { padding: 0; margin-bottom: 50px; padding-bottom: 15px; }
    .week-view .weekday-wrap { padding-top: 10px; flex-direction: row; justify-content: flex-start; margin-bottom: 15px; order: 1; }
    .week-view .weekday-wrap span { font-size: 1rem; }
    .week-view .weekday-hex { margin-right: 15px; width: 50px; height: 55px; font-size: 1.25rem; }
    .week-view .from-price { padding-top: 10px; order: 1; margin-bottom: 15px; }
    .week-view .from-price h4 { padding-left: 0; display: flex; align-items: center; justify-content: flex-end; }
    .week-view .from-price h4 strong { margin-left: 10px; }
    .week-view .dish-wrap:nth-of-type(2) { order: 2; }
    .week-view .dish-wrap:nth-of-type(3) { order: 2; }
    .week-view .dish-wrap:nth-of-type(4) { margin-left: 0; }
    .week-view .order-btn { display: none; }
    .week-view .dish-card .mobile-order-btn { z-index: 1; position: absolute; width: 0; height: 0; left: 0; top: 0; display: flex; align-items: center; justify-content: center; background: rgb(0 0 0 / 20%); visibility: hidden; transition: opacity 0.3s; opacity: 0; }
    .week-view .dish-card:hover .mobile-order-btn { visibility: visible; width: 100%; height: 100%; opacity: 1; }
    .week-view .dish-card .btn { z-index: 2; }
    .week-view .dish-card .overlay { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 100; transition: z-index 0.3s; }
    .week-view .dish-card:hover .overlay { z-index: 1; }
  
    .voor-erbij { order: 3; margin-top: 25px; }
    .voor-erbij h3 { font-size: 1.2rem; }
    .voor-erbij .item label > div { display: block; }
  
    .options-select .container { font-size: 0.8rem; }
    .options-select .week-select .week { padding: 5px 0; }
    /* .options-select .profiles-select .profile i.fa-plus { font-size: 1.2rem; } */
    .options-select .week-select .week strong { font-size: 1rem; }
  
    .account-menu-wrap { position: static; }
    .account-menu { margin-bottom: 40px; }
  
    .edit-options .seperator { border-right: none; border-bottom: 2px solid var(--color-primary); width: 100%; margin: 10px 0; }
  
    .order-wrap .order .subtotal-wrap .price { font-size: 1.2rem; }
    .order-wrap .order .week-head .price { font-size: 1.2rem; }
    .cartTable .orders > div:last-child { margin-bottom: 25px; }

    .cartFooter { margin-top: 50px; }
    .cartFooter .btn { margin-top: 15px; }

    .lunchbus-img { margin-top: 25px; }
  }
  
  @media only screen and (max-width: 767px) {
    h1 { font-size: 3rem; }
    h2 { font-size: 1.75rem; }
    h4 { font-size: 1.2rem; }
  
    table th,
    table td { padding: 5px; }
  
    .form-group .form-control { padding: 10px; }
  
    .hex-imgs { margin-bottom: 15px; }
    .hex-imgs .hex-imgs-row .hex img { height: 250px; }
  
    footer { margin-top: 50px; }
    footer .footer-banner-img img { height: 300px; }
  
    .options-select .container { padding: 0; }
    .options-select .profiles-select .profile { flex-direction: column; }
    .options-select .profiles-select .profile i { margin-right: 0; }
    .options-select .profiles-select { margin-right: 10px; }
    .options-select .week-select { margin-left: 10px; }
  
    .selected-meals-bar .meals-text { font-size: 0.9rem; }
    .selected-meals-bar .meals-text .price { font-size: 1.2rem; }
    .selected-meals-bar .btn { font-size: 0.8rem; padding: 8px 15px; }
  
    .account-menu { margin-bottom: 25px; }
  
    .title-option { flex-direction: column; align-items: flex-start; }
    .title-option h4 { margin-bottom: 10px; }
    .title-option select { width: 100%; }
  
    .profiles-table { margin-left: -15px; margin-right: -15px; width: auto; }
    .profiles-table tr { flex-direction: column; align-items: flex-start; padding: 20px 15px; }
    .profiles-table thead { display: none; }
    .profiles-table th,
    .profiles-table td { width: 100%; display: flex; }
    .profiles-table td strong { min-width: 150px; }
    .profiles-table .mobile-title { display: revert; font-weight: 700; }
    .profiles-table .btn { margin-top: 15px; width: 100%; }
    .profiles-table .delete-btn-wrap { width: 100%; justify-content: center; border-top: 1px solid #ccc; margin-top: 5px; padding-top: 5px; }
    .profiles-table .delete-btn-wrap i { margin-right: 10px; }
  
    .edit-options .checkboxes .check-wrap { width: 100%; }
    .edit-options .checkboxes .check-wrap:nth-child(2) .checkbox { border-top: none; }
  
    .order-wrap .order .week-head { padding: 2px 0 2px 7px; }
    .order-wrap .order .week-head .head-text .profile.week-link { min-width: 7rem; }
    .order-wrap .order .subtotal-wrap { padding: 7px; }
    .order-wrap .order .week-content { padding: 7px; }
    .order-wrap .order .main-dish h5 { font-size: 1rem; line-height: 1.3; margin-right: 5px; }
    .order-wrap .order .main-dish .price { font-size: 1rem; }
    .order-wrap .order .side-dish { font-size: 0.875rem; padding-left: 5px; }

    .cartFooter>.cartTable-bottom:last-of-type { font-size: 1.2rem; }
  
    .cart-summary .price { font-size: 1.2rem; }

    .faq-list { margin-top: 25px; }
    .faq-list h5 { padding: 15px 25px; font-size: 16px; }
    .faq-list .card-body { font-size: 14px; }
    .faq-list .block.faq { margin-bottom: 50px; }
  }
  
  @media only screen and (max-width: 575px) {
    h1 { font-size: 2.5rem; }
    h2 { font-size: 1.375rem; }
    h3 { font-size: 1.125rem; }
    h4 { font-size: 1.1rem; }

    .btn { padding: 8px 15px; font-size: 0.8rem; }
  
    .header { margin-bottom: 25px; }
    
    .hex-imgs .hex-imgs-row { width: auto; margin: 0 -15px; }
    .hex-imgs .hex-imgs-row .hex img { height: 200px; }
  
    .week-btns { display: flex; justify-content: center; }
    .week-btns .btn { font-size: 0.875rem; margin-right: 5px; padding: 10px; }
  
    .week-view { margin-bottom: 25px; }
    .week-view .row { margin-left: -15px; margin-right: -15px; margin-bottom: 25px; }
    .week-view .weekday-wrap { padding-right: 5px; }
    .week-view .weekday-hex { font-size: 1rem; width: 40px; height: 45px; }
    .week-view .weekday-wrap span { font-size: 0.875rem; text-align: left; }
    .week-view .dish-card { padding: 10px 15px; }
    .week-view .from-price { padding-left: 5px; }
    .week-view .from-price h4 { font-size: 0.875rem; }
    .week-view .from-price h4 strong { font-size: 1.25rem; }
    .week-view .dish-wrap:nth-of-type(2) { padding-right: 15px; margin-bottom: 15px; }
    .week-view .dish-wrap:nth-of-type(3) { padding-left: 15px; }
    .week-view .dish-wrap:nth-of-type(4) { padding-right: 15px; margin-top: 15px; }


    .week-order-view label.dish-card select { margin-bottom: 10px; }
  
    footer { margin-top: 25px; }
    footer .footer-banner-img img { height: 250px; }
    footer .menu-wrap { justify-content: space-between; }
    footer ul:nth-child(1) { margin-right: 10px; }
  
    /* .options-select .profiles-select .profile i.fa-plus { font-size: 1rem; } */
    .options-select .week-select { flex-grow: 0; }
    .options-select .week-select .week strong { font-size: 1.2rem; }
    .options-select .week-select .week { display: none; }
    .options-select .week-select .week-mobile-select { display: block; margin: 15px 10px 15px 0; font-family: 'FontAwesome', 'Manrope'; font-weight: 400;  }
  
    .edit-options { padding: 20px 25px;}
    
    .order-wrap .order .week-head .head-text .profile.week-link { min-width: 5.5rem; }
    .order-wrap .order .week-head .btn span { display: none; }
    .order-wrap .order .week-head .btn::after { margin-left: 0; }
    .order-wrap .order .subtotal-wrap .price { font-size: 1.1rem; }
    .order-wrap .order .week-head .price { font-size: 1.1rem; }
    .order-wrap .order .week-head .head-text > * { margin-right: 5px; }
    .order-wrap .order .week-head .btn { padding-left: 7px; padding-right: 7px; }
    .order-wrap .order .main-dish h5 { flex-direction: column; }
    .order-wrap .order .side-dish .side-dish-name .day-filler { display: none; }
  }
  
  @media only screen and (max-width: 479px) {
    h1 { font-size: 2rem; }
    h3 { font-size: 1.25rem; }
    h4 { font-size: 1rem; }
  
    .steps-3 .content .img-wrap { margin-right: 10px; }
    .steps-3 .content .img-wrap img { width: 50px; height: auto; }
  
    footer .footer-banner-img img { height: 200px; }
    
    .order-wrap .title-wrap a span { display: none; }
    .order-wrap .order .week-head .price { font-size: 1rem; }

    .faq-list .card-body { padding: 0 25px 15px 25px; }
  }
  
  @media only screen and (min-width: 1440px) {
    .container { max-width: 1400px; }
  }