/* For mobile devices with smaller screens */
@media (max-width: 767.98px) {
  .ProductImageCenter {
    width: 100%;
  }
  /* CSS styles for smaller screens go here */
  body {
    background-color: #f5f5f5;
    font-family: Arial, sans-serif;
  }

  .container {
    text-align: center;
    margin-top: 200px;
  }

  h1 {
    font-size: 36px;
    color: #555555;
  }

  p {
    font-size: 18px;
    color: #888888;
    margin-bottom: 30px;
    width: 67%;
  }
  .Main {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .construction-image {
    width: 500px;
    height: auto;
  }
  .ClickHere {
    font-size: 20px;
    font-weight: bold;
    color: #888888;
    margin-bottom: 30px;
    text-decoration: underline;
  }
  .OrderForm {
    background-color: white;
    align-self: center;
    width: 80%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px;
  }
  .ItemSelectors {
    background-color: white;
    align-self: center;
    width: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .Item {
    height: 843px;
    border-bottom: solid 1px #b6b3b3;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: space-evenly;
    width: 100%;
    align-items: center;
  }
  .ProductImage {
    position: none;
    width: 250;
    height: 250px;
    /*! top: 30px; */
    /*! left: 111px; */
  }
  .ItemName {
    /*! position: relative; */
    /*! top: 0; */
    /*! left: 0; */
    width: 100%;
    text-align: center;
    margin-bottom: 5px;
  }
  .ItemLine {
    /*! position: relative; */
    top: -63px;
    left: 99px;
    width: 83%;
    height: 1px;
    background-color: #b6b3b3;
  }
  .QTYSelector {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;

    /*! position: relative; */
    top: -72px;
    left: 203px;
    width: 12%;
  }
  .ItemQty {
    width: 50px;
    height: 50px;
    border-color: #f4f0f0;
    box-shadow: 0 5px 5px 0px #666666;
    font-size: 20px;
    text-align: center;
    color: #b89e6b;
    font-weight: bold;
    margin: 20px;
  }
  .ItemPrice {
    font-size: 24px;
    width: 100%;
    text-align: center;
  }
  h2 {
    margin: 0px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    color: #939393;
    font-weight: lighter;
  }
  input :focus {
    height: 25px;
    font-size: 16px;
    text-decoration: none;
    outline-width: 0;
  }
  input::-webkit-outer-spin-button,
  input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  .ShippingInfoLine input,
  select {
    width: 90%;
    height: 40px;
    font-size: 16px;
    margin: 15px;
    margin-left: 10px;
  }
  input[type="number"] {
    -moz-appearance: textfield;
  }
  .ShippingInfoLine {
    /*! position: relative; */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 30px;
    width: 100%;
    border: #b6b3b3 solid 1px;
    margin-left: 0;
    padding: 0;
    height: 394px;
  }
  .ShippingInfoLine h2 {
    margin-left: 10px;
  }

  .ShippingInfoLine2 input,
  select {
    width: 90%;
    height: 40px;
    font-size: 16px;
    margin: 15px;
    margin-left: 10px;
  }
  .ShippingInfoLine2 {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 30px;
    width: 100%;
    border: #b6b3b3 solid 1px;
    left: 0%;
    top: 0px;
    margin-left: 0%;
    padding: 0px;
  }
  .ShippingInfoLine2 h2 {
    margin-left: 10px;
  }
  .ShippingInfo {
    height: 1146px;
    display: inline;
    flex-direction: row;
    width: 100%;
  }

  .OrderItemName {
    position: absolute;
    left: 254px;
    width: 25%;
    text-align: center;
    margin-right: 40px;
    z-index: 4;
  }

  .SubmitButton {
    width: 327px;
    height: 63px;
    background: #b89e6b;
    border-radius: 5px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
  .SubmitButton h1 {
    color: black !important;
    font-size: 25px;
    font-weight: 400;
  }
  .Total {
    height: 50px;
    width: 45%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 0;
    margin-left: 15px;
  }
  .SubtotalButton {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
    width: 88%;
    margin-top: 80px;
  }
  .TotalValue {
    font-size: 34px;
    font-weight: bold;
    color: #b89e6b;
  }
  .SummaryTable {
    width: 100%;
  }
  table {
    border-collapse: collapse;
    border-bottom: 1px solid #b6b3b3;
    margin-bottom: 30px;
  }
  tr {
    border-bottom: 1px solid #b6b3b3;
    height: 60px;
  }
  td {
    text-align: center;
    font-size: 16px;
    font-family: Arial, Helvetica, sans-serif;
    color: #5a5a5a;
  }
  th {
    text-align: center;
    font-weight: bold;
    font-size: 18px;
  }
  .SummaryTitles {
    border-bottom: solid 1px #b6b3b3;
    border-collapse: collapse;
  }
  .OrderItemQty {
    width: 50px;
    height: 50px;
    border-color: #f4f0f0;
    box-shadow: 0 5px 5px 0px #666666;
    font-size: 20px;
    text-align: center;
    color: #b89e6b;
    font-weight: bold;
  }

  .OGGarlicQty,
  .MamasGarlicQty,
  .DunganskiQty,
  .GermanWhiteQty {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
  .MamasGarlicPrice,
  .DunganskiPrice,
  .GermanWhitePrice,
  .OGGarlicPrice {
    font-size: 24px;
    color: #5a5a5a;
  }
  .LBS {
    font-size: 18px;
    color: #b89e6b;
    text-align: center;
    vertical-align: middle;
    margin-left: 10px;
  }
}

/* For mobile devices and small tablets (max-width: 767.98px) */
@media (min-width: 768px) and (max-width: 991.98px) {
  body {
    background-color: #f5f5f5;
    font-family: Arial, sans-serif;
  }

  .container {
    text-align: center;
    margin-top: 200px;
  }

  h1 {
    font-size: 36px;
    color: #555555;
  }

  p {
    font-size: 18px;
    color: #888888;
    margin-bottom: 30px;
    width: 70%;
    padding-left: 15%;
    padding-right: 100px;
  }
  .Main {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .construction-image {
    width: 500px;
    height: auto;
  }
  .ClickHere {
    font-size: 20px;
    font-weight: bold;
    color: #888888;
    margin-bottom: 30px;
    text-decoration: underline;
  }
  .OrderForm {
    background-color: white;
    align-self: center;
    width: 80%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px;
  }
  .ItemSelectors {
    background-color: white;
    align-self: center;
    width: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .Item {
    height: 741px;
    border-bottom: solid 1px #b6b3b3;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: space-evenly;
    width: 100%;
    align-items: center;
  }
  .ProductImage {
    position: none;
    width: 250;
    height: 250px;
    /*! top: 30px; */
    /*! left: 111px; */
  }
  .ItemName {
    width: 100%;
    text-align: center;
    margin-bottom: 5px;
  }
  .ItemLine {
    /*! position: relative; */
    top: -63px;
    width: 83%;
    height: 1px;
    background-color: #b6b3b3;
  }
  .QTYSelector {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;

    /*! position: relative; */
    top: -72px;
    left: 203px;
    width: 12%;
  }
  .ItemQty {
    width: 50px;
    height: 50px;
    border-color: #f4f0f0;
    box-shadow: 0 5px 5px 0px #666666;
    font-size: 20px;
    text-align: center;
    color: #b89e6b;
    font-weight: bold;
    margin: 20px;
  }
  .ItemPrice {
    font-size: 24px;
    width: 100%;
    text-align: center;
  }
  h2 {
    margin: 0px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    color: #939393;
    font-weight: lighter;
  }
  input :focus {
    height: 25px;
    font-size: 16px;
    text-decoration: none;
    outline-width: 0;
  }
  input::-webkit-outer-spin-button,
  input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  .ShippingInfoLine input,
  select {
    width: 90%;
    height: 40px;
    font-size: 16px;
    margin: 15px;
    margin-left: 10px;
  }
  input[type="number"] {
    -moz-appearance: textfield;
  }
  .ShippingInfoLine {
    /*! position: relative; */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 30px;
    width: 100%;
    border: #b6b3b3 solid 1px;
    margin-left: 0;
    padding: 0;
    height: 394px;
  }
  .ShippingInfoLine h2 {
    margin-left: 10px;
  }

  .ShippingInfoLine2 input,
  select {
    width: 90%;
    height: 40px;
    font-size: 16px;
    margin: 15px;
    margin-left: 10px;
  }
  .ShippingInfoLine2 {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 30px;
    width: 100%;
    border: #b6b3b3 solid 1px;
    left: 0%;
    top: 0px;
    margin-left: 0%;
    padding: 0px;
  }
  .ShippingInfoLine2 h2 {
    margin-left: 10px;
  }
  .ShippingInfo {
    height: 1146px;
    display: inline;
    flex-direction: row;
    width: 100%;
  }

  .OrderItemName {
    position: absolute;
    left: 254px;
    width: 25%;
    text-align: center;
    margin-right: 40px;
    z-index: 4;
  }

  .SubmitButton {
    width: 327px;
    height: 63px;
    background: #b89e6b;
    border-radius: 5px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
  .SubmitButton h1 {
    color: black !important;
    font-size: 32px;
    font-weight: 400;
  }
  .Total {
    height: 50px;
    width: 45%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 0;
    margin-left: 15px;
  }
  .SubtotalButton {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
    width: 100%;
    margin-top: 80px;
  }
  .TotalValue {
    font-size: 34px;
    font-weight: bold;
    color: #b89e6b;
  }
  .SummaryTable {
    width: 100%;
  }
  table {
    border-collapse: collapse;
    border-bottom: 1px solid #b6b3b3;
    margin-bottom: 30px;
  }
  tr {
    border-bottom: 1px solid #b6b3b3;
    height: 60px;
  }
  td {
    text-align: center;
    font-size: 16px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    color: #5a5a5a;
  }
  th {
    text-align: center;
    font-weight: bold;
    font-size: 18px;
  }
  .SummaryTitles {
    border-bottom: solid 1px #b6b3b3;
    border-collapse: collapse;
  }
  .OrderItemQty {
    width: 50px;
    height: 50px;
    border-color: #f4f0f0;
    box-shadow: 0 5px 5px 0px #666666;
    font-size: 20px;
    text-align: center;
    color: #b89e6b;
    font-weight: bold;
  }

  .OGGarlicQty,
  .MamasGarlicQty,
  .DunganskiQty,
  .GermanWhiteQty {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
  .MamasGarlicPrice,
  .DunganskiPrice,
  .GermanWhitePrice,
  .OGGarlicPrice {
    font-size: 24px;
    color: #5a5a5a;
  }
  .LBS {
    font-size: 18px;
    font-weight: bold;
    color: #b89e6b;
    text-align: center;
    vertical-align: middle;
    margin-left: 10px;
  }
}

/* For tablets and small laptops */
@media (min-width: 992px) and (max-width: 1199.98px) {
  /* CSS styles for tablets and small laptops go here */
  body {
    background-color: #f5f5f5;
    font-family: Arial, sans-serif;
  }

  .container {
    text-align: center;
    margin-top: 200px;
  }

  h1 {
    font-size: 36px;
    color: #555555;
  }

  p {
    font-size: 18px;
    color: #888888;
    margin-bottom: 30px;
    padding-left: 15%;
    padding-right: 100px;
  }
  .Main {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .construction-image {
    width: 500px;
    height: auto;
  }
  .ClickHere {
    font-size: 20px;
    font-weight: bold;
    color: #888888;
    margin-bottom: 30px;
    text-decoration: underline;
  }
  .OrderForm {
    background-color: white;
    align-self: center;
    width: 80%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px;
  }
  .ItemSelectors {
    background-color: white;
    align-self: center;
    width: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .Item {
    height: 741px;
    border-bottom: solid 1px #b6b3b3;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: space-evenly;
    width: 100%;
    align-items: center;
  }
  .ProductImage {
    position: none;
    width: 250;
    height: 250px;
    /*! top: 30px; */
    /*! left: 111px; */
  }
  .ItemName {
    /*! position: relative; */
    /*! top: 0; */
    /*! left: 0; */
    width: 100%;
    text-align: center;
    margin-bottom: 5px;
  }
  .ItemLine {
    /*! position: relative; */
    top: -63px;
    left: 99px;
    width: 83%;
    height: 1px;
    background-color: #b6b3b3;
  }
  .QTYSelector {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;

    /*! position: relative; */
    top: -72px;
    left: 203px;
    width: 12%;
  }
  .ItemQty {
    width: 50px;
    height: 50px;
    border-color: #f4f0f0;
    box-shadow: 0 5px 5px 0px #666666;
    font-size: 20px;
    text-align: center;
    color: #b89e6b;
    font-weight: bold;
    margin: 20px;
  }
  .ItemPrice {
    font-size: 24px;
    width: 90%;
    text-align: center;
  }
  h2 {
    margin: 0px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    color: #939393;
    font-weight: lighter;
  }
  input :focus {
    height: 25px;
    font-size: 16px;
    text-decoration: none;
    outline-width: 0;
  }
  input::-webkit-outer-spin-button,
  input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  .ShippingInfoLine input,
  select {
    width: 90%;
    height: 40px;
    font-size: 16px;
    margin: 15px;
    margin-left: 10px;
  }
  input[type="number"] {
    -moz-appearance: textfield;
  }
  .ShippingInfoLine {
    /*! position: relative; */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 30px;
    width: 100%;
    border: #b6b3b3 solid 1px;
    margin-left: 0;
    padding: 0;
    height: 394px;
    margin-right: 31px;
  }
  .ShippingInfoLine h2 {
    margin-left: 10px;
  }

  .ShippingInfoLine2 input,
  select {
    width: 90%;
    height: 40px;
    font-size: 16px;
    margin: 15px;
    margin-left: 10px;
  }
  .ShippingInfoLine2 {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 30px;
    width: 100%;
    border: #b6b3b3 solid 1px;
    left: 0%;
    top: 0px;
    margin-left: 0%;
    padding: 0px;
  }
  .ShippingInfoLine2 h2 {
    margin-left: 10px;
  }
  .ShippingInfo {
    height: 1146px;
    display: inline;
    flex-direction: row;
    width: 100%;
  }

  .OrderItemName {
    position: absolute;
    left: 254px;
    width: 25%;
    text-align: center;
    margin-right: 40px;
    z-index: 4;
  }

  .SubmitButton {
    width: 327px;
    height: 63px;
    background: #b89e6b;
    border-radius: 5px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
  .SubmitButton h1 {
    color: black !important;
    font-size: 32px;
    font-weight: 400;
  }
  .Total {
    height: 50px;
    width: 45%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 0;
    margin-left: 15px;
  }
  .SubtotalButton {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
    width: 100%;
    margin-top: 80px;
  }
  .TotalValue {
    font-size: 34px;
    font-weight: bold;
    color: #b89e6b;
  }
  .SummaryTable {
    width: 100%;
  }
  table {
    border-collapse: collapse;
    border-bottom: 1px solid #b6b3b3;
    margin-bottom: 30px;
  }
  tr {
    border-bottom: 1px solid #b6b3b3;
    height: 60px;
  }
  td {
    text-align: center;
    font-size: 16px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    color: #5a5a5a;
  }
  th {
    text-align: center;
    font-weight: bold;
    font-size: 18px;
  }
  .SummaryTitles {
    border-bottom: solid 1px #b6b3b3;
    border-collapse: collapse;
  }
  .OrderItemQty {
    width: 50px;
    height: 50px;
    border-color: #f4f0f0;
    box-shadow: 0 5px 5px 0px #666666;
    font-size: 20px;
    text-align: center;
    color: #b89e6b;
    font-weight: bold;
  }

  .OGGarlicQty,
  .MamasGarlicQty,
  .DunganskiQty,
  .GermanWhiteQty {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
  .MamasGarlicPrice,
  .DunganskiPrice,
  .GermanWhitePrice,
  .OGGarlicPrice {
    font-size: 24px;
    color: #5a5a5a;
  }
  .LBS {
    font-size: 18px;
    font-weight: bold;
    color: #b89e6b;
    text-align: center;
    vertical-align: middle;
    margin-left: 10px;
  }
}

/* For laptops and larger screens */
@media (min-width: 1200px) and (max-width: 1919.98px) {
  /* CSS styles for tablets and small laptops go here */
  body {
    background-color: #f5f5f5;
    font-family: Arial, sans-serif;
  }

  .container {
    text-align: center;
    margin-top: 200px;
  }

  h1 {
    font-size: 36px;
    color: #555555;
  }

  p {
    font-size: 18px;
    color: #888888;
    margin-bottom: 30px;
    width: 70%;
    padding-left: 15%;
    padding-right: 100px;
  }
  .Main {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .construction-image {
    width: 500px;
    height: auto;
  }
  .ClickHere {
    font-size: 20px;
    font-weight: bold;
    color: #888888;
    margin-bottom: 30px;
    text-decoration: underline;
  }
  .OrderForm {
    background-color: white;
    align-self: center;
    width: 80%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px;
  }
  .ItemSelectors {
    background-color: white;
    align-self: center;
    width: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .Item {
    height: 741px;
    border-bottom: solid 1px #b6b3b3;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: space-evenly;
    width: 100%;
    align-items: center;
  }
  .ProductImage {
    position: none;
    width: 250;
    height: 250px;
    /*! top: 30px; */
    /*! left: 111px; */
  }
  .ItemName {
    /*! position: relative; */
    /*! top: 0; */
    /*! left: 0; */
    width: 100%;
    text-align: center;
    margin-bottom: 5px;
  }
  .ItemLine {
    /*! position: relative; */
    top: -63px;
    left: 99px;
    width: 83%;
    height: 1px;
    background-color: #b6b3b3;
  }
  .QTYSelector {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;

    /*! position: relative; */
    top: -72px;
    left: 203px;
    width: 12%;
  }
  .ItemQty {
    width: 50px;
    height: 50px;
    border-color: #f4f0f0;
    box-shadow: 0 5px 5px 0px #666666;
    font-size: 20px;
    text-align: center;
    color: #b89e6b;
    font-weight: bold;
    margin: 20px;
  }
  .ItemPrice {
    font-size: 24px;
    width: 100%;
    text-align: center;
  }
  h2 {
    margin: 0px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    color: #939393;
    font-weight: lighter;
  }
  input :focus {
    height: 25px;
    font-size: 16px;
    text-decoration: none;
    outline-width: 0;
  }
  input::-webkit-outer-spin-button,
  input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  .ShippingInfoLine input,
  select {
    width: 90%;
    height: 40px;
    font-size: 16px;
    margin: 15px;
    margin-left: 10px;
  }
  input[type="number"] {
    -moz-appearance: textfield;
  }
  .ShippingInfoLine {
    /*! position: relative; */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 30px;
    width: 100%;
    border: #b6b3b3 solid 1px;
    margin-left: 0;
    padding: 0;
    height: 394px;
  }
  .ShippingInfoLine h2 {
    margin-left: 10px;
  }

  .ShippingInfoLine2 input,
  select {
    width: 90%;
    height: 40px;
    font-size: 16px;
    margin: 15px;
    margin-left: 10px;
  }
  .ShippingInfoLine2 {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 30px;
    width: 100%;
    border: #b6b3b3 solid 1px;
    left: 0%;
    top: 0px;
    margin-left: 0%;
    padding: 0px;
  }
  .ShippingInfoLine2 h2 {
    margin-left: 10px;
  }
  .ShippingInfo {
    height: 1146px;
    display: inline;
    flex-direction: row;
    width: 100%;
  }

  .OrderItemName {
    position: absolute;
    left: 254px;
    width: 25%;
    text-align: center;
    margin-right: 40px;
    z-index: 4;
  }

  .SubmitButton {
    width: 327px;
    height: 63px;
    background: #b89e6b;
    border-radius: 5px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
  .SubmitButton h1 {
    color: black !important;
    font-size: 32px;
    font-weight: 400;
  }
  .Total {
    height: 50px;
    width: 45%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 0;
    margin-left: 15px;
  }
  .SubtotalButton {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
    width: 100%;
    margin-top: 80px;
  }
  .TotalValue {
    font-size: 34px;
    font-weight: bold;
    color: #b89e6b;
  }
  .SummaryTable {
    width: 100%;
  }
  table {
    border-collapse: collapse;
    border-bottom: 1px solid #b6b3b3;
    margin-bottom: 30px;
  }
  tr {
    border-bottom: 1px solid #b6b3b3;
    height: 60px;
  }
  td {
    text-align: center;
    font-size: 16px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    color: #5a5a5a;
  }
  th {
    text-align: center;
    font-weight: bold;
    font-size: 18px;
  }
  .SummaryTitles {
    border-bottom: solid 1px #b6b3b3;
    border-collapse: collapse;
  }
  .OrderItemQty {
    width: 50px;
    height: 50px;
    border-color: #f4f0f0;
    box-shadow: 0 5px 5px 0px #666666;
    font-size: 20px;
    text-align: center;
    color: #b89e6b;
    font-weight: bold;
  }

  .OGGarlicQty,
  .MamasGarlicQty,
  .DunganskiQty,
  .GermanWhiteQty {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
  .MamasGarlicPrice,
  .DunganskiPrice,
  .GermanWhitePrice,
  .OGGarlicPrice {
    font-size: 24px;
    color: #5a5a5a;
  }
  .LBS {
    font-size: 18px;
    font-weight: bold;
    color: #b89e6b;
    text-align: center;
    vertical-align: middle;
    margin-left: 10px;
  }
}

/* For larger desktop screens */
@media (min-width: 1920px) {
  body {
    background-color: #f5f5f5;
    font-family: Arial, sans-serif;
  }

  .container {
    text-align: center;
    margin-top: 200px;
  }

  h1 {
    font-size: 36px;
    color: #555555;
  }

  p {
    font-size: 18px;
    color: #888888;
    margin-bottom: 30px;
    position: relative;
    top: -291px;
    left: 285px;
    width: 40%;
  }
  .Main {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .construction-image {
    width: 500px;
    height: auto;
  }
  .ClickHere {
    font-size: 20px;
    font-weight: bold;
    color: #888888;
    margin-bottom: 30px;
    text-decoration: underline;
  }
  .OrderForm {
    background-color: white;
    align-self: center;
    width: 80%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px;
  }
  .ItemSelectors {
    background-color: white;
    align-self: center;
    width: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .Item {
    height: 310px;
    border-bottom: solid 1px #b6b3b3;
  }
  .ProductImage {
    position: relative;
    width: 250px;
    height: 250px;
    top: 30px;
    left: 10px;
  }
  .ItemName {
    position: relative;
    top: -245px;
    left: 282px;
    width: 500px;
  }
  .ItemLine {
    position: relative;
    top: -291px;
    left: 282px;
    width: 60%;
    height: 1px;
    background-color: #b6b3b3;
  }
  .QTYSelector {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;

    position: relative;
    top: -475px;
    left: 1167px;
    width: 12%;
  }
  .ItemQty {
    width: 50px;
    height: 50px;
    border-color: #f4f0f0;
    box-shadow: 0 5px 5px 0px #666666;
    font-size: 20px;
    text-align: center;
    color: #b89e6b;
    font-weight: bold;
  }
  .ItemPrice {
    position: relative;
    font-size: 24px;
    top: -365px;
    left: 1210px;
    width: 141px;
  }
  h2 {
    margin: 0px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    color: #939393;
    font-weight: lighter;
  }
  input :focus {
    height: 25px;
    font-size: 16px;
    text-decoration: none;
    outline-width: 0;
  }
  input::-webkit-outer-spin-button,
  input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  .ShippingInfoLine input,
  select {
    width: 75%;
    height: 40px;
    font-size: 16px;
    margin: 15px;
    margin-left: 10px;
  }
  input[type="number"] {
    -moz-appearance: textfield;
  }
  .ShippingInfoLine {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-evenly;
    margin-top: 30px;
    width: 40%;
    border: #b6b3b3 solid 1px;
    margin-left: 5%;
    padding: 20px;
  }
  .ShippingInfoLine h2 {
    margin-left: 10px;
  }

  .ShippingInfoLine2 input,
  select {
    width: 75%;
    height: 40px;
    font-size: 16px;
    margin: 15px;
    margin-left: 10px;
  }
  .ShippingInfoLine2 {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-evenly;
    margin-top: 30px;
    width: 40%;
    border: #b6b3b3 solid 1px;
    left: 50%;
    top: -463px;
    margin-left: 5%;
    padding: 20px;
  }
  .ShippingInfoLine2 h2 {
    margin-left: 10px;
  }
  .ShippingInfo {
    height: 550px;
  }

  .OrderItemName {
    position: absolute;
    left: 254px;
    width: 25%;
    text-align: center;
    margin-right: 40px;
    z-index: 4;
  }

  .SubmitButton {
    width: 327px;
    height: 63px;
    background: #b89e6b;
    border-radius: 5px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
  .SubmitButton h1 {
    color: black !important;
    font-size: 32px;
    font-weight: 400;
  }
  .Total {
    height: 50px;
    width: 45%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 30px;
  }
  .SubtotalButton {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
    width: 100%;
    margin-top: 80px;
  }
  .TotalValue {
    font-size: 34px;
    font-weight: bold;
    color: #b89e6b;
  }
  .SummaryTable {
    width: 100%;
  }
  table {
    border-collapse: collapse;
    border-bottom: 1px solid #b6b3b3;
    margin-bottom: 30px;
  }
  tr {
    border-bottom: 1px solid #b6b3b3;
    height: 60px;
  }
  td {
    text-align: center;
    font-size: 16px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    color: #5a5a5a;
  }
  th {
    text-align: center;
    font-weight: bold;
    font-size: 18px;
  }
  .SummaryTitles {
    border-bottom: solid 1px #b6b3b3;
    border-collapse: collapse;
  }
  .OrderItemQty {
    width: 50px;
    height: 50px;
    border-color: #f4f0f0;
    box-shadow: 0 5px 5px 0px #666666;
    font-size: 20px;
    text-align: center;
    color: #b89e6b;
    font-weight: bold;
  }

  .OGGarlicQty,
  .MamasGarlicQty,
  .DunganskiQty,
  .GermanWhiteQty {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
  .MamasGarlicPrice,
  .DunganskiPrice,
  .GermanWhitePrice,
  .OGGarlicPrice {
    font-size: 24px;
    color: #5a5a5a;
  }
  .LBS {
    font-size: 18px;
    font-weight: bold;
    color: #b89e6b;
    text-align: center;
    vertical-align: middle;
    margin-left: 10px;
  }
}

/* For extra-large desktop screens */
@media (min-width: 1920px) {
  body {
    background-color: #f5f5f5;
    font-family: Arial, sans-serif;
  }

  .container {
    text-align: center;
    margin-top: 200px;
  }

  h1 {
    font-size: 36px;
    color: #555555;
  }

  p {
    font-size: 18px;
    color: #888888;
    margin-bottom: 30px;
    position: relative;
    top: -291px;
    left: 285px;
    width: 40%;
  }
  .Main {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .construction-image {
    width: 500px;
    height: auto;
  }
  .ClickHere {
    font-size: 20px;
    font-weight: bold;
    color: #888888;
    margin-bottom: 30px;
    text-decoration: underline;
  }
  .OrderForm {
    background-color: white;
    align-self: center;
    width: 80%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px;
  }
  .ItemSelectors {
    background-color: white;
    align-self: center;
    width: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .Item {
    height: 310px;
    border-bottom: solid 1px #b6b3b3;
  }
  .ProductImage {
    position: relative;
    width: 250px;
    height: 250px;
    top: 30px;
    left: 10px;
  }
  .ItemName {
    position: relative;
    top: -245px;
    left: 282px;
    width: 500px;
  }
  .ItemLine {
    position: relative;
    top: -291px;
    left: 282px;
    width: 60%;
    height: 1px;
    background-color: #b6b3b3;
  }
  .QTYSelector {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;

    position: relative;
    top: -475px;
    left: 1280px;
    width: 12%;
  }
  .ItemQty {
    width: 50px;
    height: 50px;
    border-color: #f4f0f0;
    box-shadow: 0 5px 5px 0px #666666;
    font-size: 20px;
    text-align: center;
    color: #b89e6b;
    font-weight: bold;
  }
  .ItemPrice {
    position: relative;
    font-size: 24px;
    top: -365px;
    left: 1329px;
    width: 141px;
  }
  h2 {
    margin: 0px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    color: #939393;
    font-weight: lighter;
  }
  input :focus {
    height: 25px;
    font-size: 16px;
    text-decoration: none;
    outline-width: 0;
  }
  input::-webkit-outer-spin-button,
  input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  .ShippingInfoLine input,
  select {
    width: 75%;
    height: 40px;
    font-size: 16px;
    margin: 15px;
    margin-left: 10px;
  }
  input[type="number"] {
    -moz-appearance: textfield;
  }
  .ShippingInfoLine {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-evenly;
    margin-top: 30px;
    width: 40%;
    border: #b6b3b3 solid 1px;
    margin-left: 5%;
    padding: 20px;
  }
  .ShippingInfoLine h2 {
    margin-left: 10px;
  }

  .ShippingInfoLine2 input,
  select {
    width: 40%;
    height: 40px;
    font-size: 16px;
    margin: 15px;
    margin-left: 10px;
  }
  .ShippingInfoLine2 {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-evenly;
    margin-top: 30px;
    width: 40%;
    border: #b6b3b3 solid 1px;
    left: 50%;
    top: -463px;
    margin-left: 5%;
    padding: 20px;
  }
  .ShippingInfoLine2 h2 {
    margin-left: 10px;
  }
  .ShippingInfo {
    height: 550px;
  }

  .OrderItemName {
    position: absolute;
    left: 254px;
    width: 25%;
    text-align: center;
    margin-right: 40px;
    z-index: 4;
  }

  .SubmitButton {
    width: 327px;
    height: 63px;
    background: #b89e6b;
    border-radius: 5px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
  .SubmitButton h1 {
    color: black !important;
    font-size: 32px;
    font-weight: 400;
  }
  .Total {
    height: 50px;
    width: 45%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 30px;
  }
  .SubtotalButton {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
    width: 100%;
    margin-top: 80px;
  }
  .TotalValue {
    font-size: 34px;
    font-weight: bold;
    color: #b89e6b;
  }
  .SummaryTable {
    width: 100%;
  }
  table {
    border-collapse: collapse;
    border-bottom: 1px solid #b6b3b3;
    margin-bottom: 30px;
  }
  tr {
    border-bottom: 1px solid #b6b3b3;
    height: 60px;
  }
  td {
    text-align: center;
    font-size: 16px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    color: #5a5a5a;
  }
  th {
    text-align: center;
    font-weight: bold;
    font-size: 18px;
  }
  .SummaryTitles {
    border-bottom: solid 1px #b6b3b3;
    border-collapse: collapse;
  }
  .OrderItemQty {
    width: 50px;
    height: 50px;
    border-color: #f4f0f0;
    box-shadow: 0 5px 5px 0px #666666;
    font-size: 20px;
    text-align: center;
    color: #b89e6b;
    font-weight: bold;
  }

  .OGGarlicQty,
  .MamasGarlicQty,
  .DunganskiQty,
  .GermanWhiteQty {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
  .MamasGarlicPrice,
  .DunganskiPrice,
  .GermanWhitePrice,
  .OGGarlicPrice {
    font-size: 24px;
    color: #5a5a5a;
  }
  .LBS {
    font-size: 18px;
    font-weight: bold;
    color: #b89e6b;
    text-align: center;
    vertical-align: middle;
    margin-left: 10px;
  }
  /* CSS styles for extra-large desktop screens go here */
}