/*!****************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./TasteOfPersia/Components/AboutAndContactUs.razor.scss ***!
  \****************************************************************************************************************************************************************************/
.about-and-contact-us-web {
  display: flex;
  flex-direction: column;
}
.about-and-contact-us-web .about-and-contact-us-web-row-container {
  display: flex;
  flex-direction: row;
}
.about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container {
  display: flex;
  width: 50%;
  flex-direction: column;
  padding: 150px;
}
@media (max-width: 2000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container {
    padding: 150px;
  }
}
@media (max-width: 1800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container {
    padding: 130px;
  }
}
@media (max-width: 1600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container {
    padding: 110px;
  }
}
@media (max-width: 1400px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container {
    padding: 90px;
  }
}
@media (max-width: 1200px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container {
    padding: 70px;
  }
}
@media (max-width: 1000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container {
    padding: 50px;
  }
}
@media (max-width: 800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container {
    padding: 30px;
  }
}
@media (max-width: 600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container {
    padding: 15px;
  }
}
.about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-pattern {
  width: 485px;
  height: 370px;
  margin: -150px;
  align-self: end;
  position: absolute;
}
@media (max-width: 2000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-pattern {
    margin: -150px;
  }
}
@media (max-width: 1800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-pattern {
    margin: -130px;
  }
}
@media (max-width: 1600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-pattern {
    margin: -110px;
  }
}
@media (max-width: 1500px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-pattern {
    width: 364px;
    height: 278px;
    margin: -90px;
  }
}
@media (max-width: 1400px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-pattern {
    margin: -90px;
  }
}
@media (max-width: 1200px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-pattern {
    margin: -70px;
  }
}
@media (max-width: 1000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-pattern {
    width: 243px;
    height: 185px;
    margin: -50px;
  }
}
@media (max-width: 800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-pattern {
    margin: -30px;
  }
}
@media (max-width: 600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-pattern {
    margin: -15px;
  }
}
.about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
  font-family: "Lora", serif !important;
  font-weight: 400;
  font-size: 80px;
  color: #FFFFFF;
}
@media (max-width: 2000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 80px;
  }
}
@media (max-width: 1800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 70px;
  }
}
@media (max-width: 1600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 60px;
  }
}
@media (max-width: 1400px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 50px;
  }
}
@media (max-width: 1200px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 40px;
  }
}
@media (max-width: 1000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 30px;
  }
}
@media (max-width: 800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 25px;
  }
}
@media (max-width: 600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 20px;
  }
}
@media (max-width: 500px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 15px;
  }
}
@media (max-width: 400px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 10px;
  }
}
@media (max-width: 300px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 8px;
  }
}
@media (max-width: 200px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 6px;
  }
}
.about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
  width: 70%;
  font-weight: 400;
  font-size: 18px;
  margin-top: 10px;
  color: #FFFFFF;
  text-align: left;
}
@media (max-width: 2000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 18px;
  }
}
@media (max-width: 1800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 17px;
  }
}
@media (max-width: 1600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 16px;
  }
}
@media (max-width: 1400px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 15px;
  }
}
@media (max-width: 1200px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 14px;
  }
}
@media (max-width: 1000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 12px;
  }
}
@media (max-width: 800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 11px;
  }
}
@media (max-width: 600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 10px;
  }
}
@media (max-width: 500px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 9px;
    margin-top: 5px;
  }
}
@media (max-width: 400px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 8px;
  }
}
@media (max-width: 300px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 8px;
  }
}
@media (max-width: 200px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 7px;
  }
}
.about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
  border-radius: 25px;
  height: 50px;
  width: 150px;
  background-color: #FFFFFF;
  font-size: 14px;
  font-weight: 500;
  margin-top: 30px;
}
@media (max-width: 2000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 14px !important;
  }
}
@media (max-width: 1800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 13px !important;
    height: 50px;
    width: 140px;
  }
}
@media (max-width: 1600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 12px !important;
  }
}
@media (max-width: 1400px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 11px !important;
    height: 45px;
    width: 120px;
  }
}
@media (max-width: 1200px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 10px !important;
  }
}
@media (max-width: 1000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 9px !important;
    height: 40px;
    width: 110px;
  }
}
@media (max-width: 800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 8px !important;
    height: 35px;
    width: 90px;
  }
}
@media (max-width: 600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 7px !important;
  }
}
@media (max-width: 500px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 10px !important;
    margin-top: 6px;
    height: 30px;
    width: 80px;
  }
}
@media (max-width: 400px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 5px !important;
  }
}
@media (max-width: 300px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 4px !important;
  }
}
@media (max-width: 200px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 4px !important;
  }
}
.about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
  width: 24px !important;
  height: 24px !important;
  margin-left: 10px !important;
}
@media (max-width: 2000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 24px !important;
    height: 24px !important;
  }
}
@media (max-width: 1800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 23px !important;
    height: 23px !important;
  }
}
@media (max-width: 1600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 22px !important;
    height: 22px !important;
  }
}
@media (max-width: 1400px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 20px !important;
    height: 20px !important;
  }
}
@media (max-width: 1200px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 20px !important;
    height: 20px !important;
  }
}
@media (max-width: 1000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 19px !important;
    height: 19px !important;
  }
}
@media (max-width: 800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 18px !important;
    height: 18px !important;
  }
}
@media (max-width: 600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 16px !important;
    height: 16px !important;
  }
}
@media (max-width: 500px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 14px !important;
    height: 14px !important;
  }
}
@media (max-width: 400px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 12px !important;
    height: 12px !important;
  }
}
@media (max-width: 300px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 10px !important;
    height: 10px !important;
  }
}
@media (max-width: 200px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 8px !important;
    height: 8px !important;
  }
}
.about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us {
  position: relative;
  width: 50%;
}
.about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 150px;
}
@media (max-width: 2000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container {
    padding: 150px;
  }
}
@media (max-width: 1800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container {
    padding: 130px;
  }
}
@media (max-width: 1600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container {
    padding: 110px;
  }
}
@media (max-width: 1400px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container {
    padding: 90px;
  }
}
@media (max-width: 1200px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container {
    padding: 70px;
  }
}
@media (max-width: 1000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container {
    padding: 50px;
  }
}
@media (max-width: 800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container {
    padding: 30px;
  }
}
@media (max-width: 600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container {
    padding: 15px;
  }
}
.about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
  font-family: "Lora", serif !important;
  font-weight: 400;
  font-size: 80px;
  color: #FFFFFF;
}
@media (max-width: 2000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 80px;
  }
}
@media (max-width: 1800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 70px;
  }
}
@media (max-width: 1600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 60px;
  }
}
@media (max-width: 1400px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 50px;
  }
}
@media (max-width: 1200px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 40px;
  }
}
@media (max-width: 1000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 30px;
  }
}
@media (max-width: 800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 25px;
  }
}
@media (max-width: 600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 20px;
  }
}
@media (max-width: 500px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 15px;
  }
}
@media (max-width: 400px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 10px;
  }
}
@media (max-width: 300px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 8px;
  }
}
@media (max-width: 200px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-title {
    font-size: 6px;
  }
}
.about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
  width: 70%;
  font-weight: 400;
  font-size: 18px;
  margin-top: 10px;
  color: #FFFFFF;
  text-align: left;
}
@media (max-width: 2000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 18px;
  }
}
@media (max-width: 1800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 17px;
  }
}
@media (max-width: 1600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 16px;
  }
}
@media (max-width: 1400px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 15px;
  }
}
@media (max-width: 1200px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 14px;
  }
}
@media (max-width: 1000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 12px;
  }
}
@media (max-width: 800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 11px;
  }
}
@media (max-width: 600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 10px;
  }
}
@media (max-width: 500px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 9px;
    margin-top: 5px;
  }
}
@media (max-width: 400px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 8px;
  }
}
@media (max-width: 300px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 8px;
  }
}
@media (max-width: 200px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-description {
    font-size: 7px;
  }
}
.about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
  border-radius: 25px;
  height: 50px;
  width: 150px;
  background-color: #FFFFFF;
  font-size: 14px;
  font-weight: 500;
  margin-top: 30px;
}
@media (max-width: 2000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 14px !important;
  }
}
@media (max-width: 1800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 13px !important;
    height: 50px;
    width: 140px;
  }
}
@media (max-width: 1600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 12px !important;
  }
}
@media (max-width: 1400px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 11px !important;
    height: 45px;
    width: 120px;
  }
}
@media (max-width: 1200px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 10px !important;
  }
}
@media (max-width: 1000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 9px !important;
    height: 40px;
    width: 110px;
  }
}
@media (max-width: 800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 8px !important;
    height: 35px;
    width: 90px;
  }
}
@media (max-width: 600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 7px !important;
  }
}
@media (max-width: 500px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 10px !important;
    margin-top: 6px;
    height: 30px;
    width: 80px;
  }
}
@media (max-width: 400px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 5px !important;
  }
}
@media (max-width: 300px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 4px !important;
  }
}
@media (max-width: 200px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn {
    font-size: 4px !important;
  }
}
.about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
  width: 24px !important;
  height: 24px !important;
  margin-left: 10px !important;
}
@media (max-width: 2000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 24px !important;
    height: 24px !important;
  }
}
@media (max-width: 1800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 23px !important;
    height: 23px !important;
  }
}
@media (max-width: 1600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 22px !important;
    height: 22px !important;
  }
}
@media (max-width: 1400px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 20px !important;
    height: 20px !important;
  }
}
@media (max-width: 1200px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 20px !important;
    height: 20px !important;
  }
}
@media (max-width: 1000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 19px !important;
    height: 19px !important;
  }
}
@media (max-width: 800px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 18px !important;
    height: 18px !important;
  }
}
@media (max-width: 600px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 16px !important;
    height: 16px !important;
  }
}
@media (max-width: 500px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 14px !important;
    height: 14px !important;
  }
}
@media (max-width: 400px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 12px !important;
    height: 12px !important;
  }
}
@media (max-width: 300px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 10px !important;
    height: 10px !important;
  }
}
@media (max-width: 200px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-text-container .about-and-contact-us-web-item-btn .about-and-contact-us-web-item-btn-img {
    width: 8px !important;
    height: 8px !important;
  }
}
.about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-pattern {
  width: 581px;
  height: 346px;
  position: absolute;
  bottom: 0;
  right: 0;
}
@media (max-width: 1500px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-pattern {
    width: 436px;
    height: 260px;
  }
}
@media (max-width: 1000px) {
  .about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-text-container-contact-us .about-and-contact-us-web-pattern {
    width: 291px;
    height: 173px;
  }
}
.about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-img-container {
  width: 50%;
}
.about-and-contact-us-web .about-and-contact-us-web-row-container .about-and-contact-us-web-img-container .about-and-contact-us-web-img {
  width: 100%;
  height: 100%;
}

.about-and-contact-us-mobile {
  display: flex;
  flex-direction: column;
}
.about-and-contact-us-mobile .about-and-contact-us-mobile-text-container {
  display: flex;
  width: 100%;
  flex-direction: column;
  padding: 56px 16px;
}
.about-and-contact-us-mobile .about-and-contact-us-mobile-text-container .about-and-contact-us-mobile-pattern {
  width: 231px;
  height: 196px;
  position: absolute;
  right: 0;
  margin: -56px -16px;
}
.about-and-contact-us-mobile .about-and-contact-us-mobile-text-container .about-and-contact-us-mobile-item-title {
  width: 100%;
  font-family: "Lora", serif !important;
  font-weight: 400;
  font-size: 22px;
  color: #FFFFFF;
}
.about-and-contact-us-mobile .about-and-contact-us-mobile-text-container .about-and-contact-us-mobile-item-description {
  width: 100%;
  font-weight: 400;
  font-size: 16px;
  margin-top: 16px;
  color: #FFFFFF;
  text-align: left;
}
@media (max-width: 500px) {
  .about-and-contact-us-mobile .about-and-contact-us-mobile-text-container .about-and-contact-us-mobile-item-description {
    font-size: 16px;
  }
}
@media (max-width: 400px) {
  .about-and-contact-us-mobile .about-and-contact-us-mobile-text-container .about-and-contact-us-mobile-item-description {
    font-size: 16px;
  }
}
@media (max-width: 300px) {
  .about-and-contact-us-mobile .about-and-contact-us-mobile-text-container .about-and-contact-us-mobile-item-description {
    font-size: 15px;
  }
}
@media (max-width: 200px) {
  .about-and-contact-us-mobile .about-and-contact-us-mobile-text-container .about-and-contact-us-mobile-item-description {
    font-size: 14px;
  }
}
.about-and-contact-us-mobile .about-and-contact-us-mobile-text-container .about-and-contact-us-mobile-item-btn {
  border-radius: 33px;
  height: 48px;
  width: 142px;
  background-color: #FFFFFF;
  font-size: 14px;
  font-weight: 500;
  margin-top: 24px;
}
.about-and-contact-us-mobile .about-and-contact-us-mobile-text-container .about-and-contact-us-mobile-item-btn .about-and-contact-us-mobile-item-btn-img {
  width: 24px !important;
  height: 24px !important;
  margin-left: 8px !important;
}
.about-and-contact-us-mobile .about-and-contact-us-mobile-text-container-contact-us {
  position: relative;
  width: 100%;
}
.about-and-contact-us-mobile .about-and-contact-us-mobile-text-container-contact-us .about-and-contact-us-mobile-text-container {
  display: flex;
  width: 100%;
  flex-direction: column;
  padding: 56px 16px;
}
.about-and-contact-us-mobile .about-and-contact-us-mobile-text-container-contact-us .about-and-contact-us-mobile-text-container .about-and-contact-us-mobile-item-title {
  width: 100%;
  font-family: "Lora", serif !important;
  font-weight: 400;
  font-size: 22px;
  color: #FFFFFF;
}
.about-and-contact-us-mobile .about-and-contact-us-mobile-text-container-contact-us .about-and-contact-us-mobile-text-container .about-and-contact-us-mobile-item-description {
  width: 100%;
  font-weight: 400;
  font-size: 16px;
  margin-top: 16px;
  color: #FFFFFF;
  text-align: left;
}
@media (max-width: 500px) {
  .about-and-contact-us-mobile .about-and-contact-us-mobile-text-container-contact-us .about-and-contact-us-mobile-text-container .about-and-contact-us-mobile-item-description {
    font-size: 16px;
  }
}
@media (max-width: 400px) {
  .about-and-contact-us-mobile .about-and-contact-us-mobile-text-container-contact-us .about-and-contact-us-mobile-text-container .about-and-contact-us-mobile-item-description {
    font-size: 16px;
  }
}
@media (max-width: 300px) {
  .about-and-contact-us-mobile .about-and-contact-us-mobile-text-container-contact-us .about-and-contact-us-mobile-text-container .about-and-contact-us-mobile-item-description {
    font-size: 15px;
  }
}
@media (max-width: 200px) {
  .about-and-contact-us-mobile .about-and-contact-us-mobile-text-container-contact-us .about-and-contact-us-mobile-text-container .about-and-contact-us-mobile-item-description {
    font-size: 14px;
  }
}
.about-and-contact-us-mobile .about-and-contact-us-mobile-text-container-contact-us .about-and-contact-us-mobile-text-container .about-and-contact-us-mobile-item-btn {
  border-radius: 33px;
  height: 48px;
  width: 142px;
  background-color: #FFFFFF;
  font-size: 14px;
  font-weight: 500;
  margin-top: 24px;
}
.about-and-contact-us-mobile .about-and-contact-us-mobile-text-container-contact-us .about-and-contact-us-mobile-text-container .about-and-contact-us-mobile-item-btn .about-and-contact-us-mobile-item-btn-img {
  width: 24px !important;
  height: 24px !important;
  margin-left: 8px !important;
}
.about-and-contact-us-mobile .about-and-contact-us-mobile-text-container-contact-us .about-and-contact-us-mobile-pattern {
  width: 231px;
  height: 196px;
  position: absolute;
  right: 0;
  bottom: 0;
}
.about-and-contact-us-mobile .about-and-contact-us-mobile-img-container {
  width: 100%;
  height: 250px;
}
.about-and-contact-us-mobile .about-and-contact-us-mobile-img-container .about-and-contact-us-mobile-img {
  width: 100%;
  height: 250px;
}

.about-background {
  background-color: #00655A;
}

.about-color {
  color: #00655A;
}

.contact-background {
  background-color: #BEA976;
}

.contact-color {
  color: #BEA976;
}
/*!*************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./TasteOfPersia/Components/DownloadMobile.razor.scss ***!
  \*************************************************************************************************************************************************************************/
.download-mobile {
  display: flex;
  justify-content: space-between;
  padding: 110px 0 110px 0;
}
.download-mobile .download-mobile-text-container {
  flex: 1 0 calc(50% - 16px);
  margin: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
  align-self: center;
}
.download-mobile .download-mobile-text-container .coming-soon {
  width: fit-content;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0;
  color: #026AA2;
  padding: 8px 12px 8px 12px;
  border-radius: 16px;
  background: #E9EEEB;
  margin-bottom: 24px;
}
@media (max-width: 2000px) {
  .download-mobile .download-mobile-text-container .coming-soon {
    font-size: 16px;
  }
}
@media (max-width: 1800px) {
  .download-mobile .download-mobile-text-container .coming-soon {
    font-size: 15px;
  }
}
@media (max-width: 1600px) {
  .download-mobile .download-mobile-text-container .coming-soon {
    font-size: 12px;
    margin-bottom: 18px;
  }
}
@media (max-width: 1400px) {
  .download-mobile .download-mobile-text-container .coming-soon {
    font-size: 10px;
  }
}
@media (max-width: 1200px) {
  .download-mobile .download-mobile-text-container .coming-soon {
    font-size: 9px;
  }
}
@media (max-width: 1000px) {
  .download-mobile .download-mobile-text-container .coming-soon {
    font-size: 8px;
    margin-bottom: 12px;
    padding: 4px 6px 4px 6px;
  }
}
@media (max-width: 800px) {
  .download-mobile .download-mobile-text-container .coming-soon {
    font-size: 8px;
  }
}
@media (max-width: 600px) {
  .download-mobile .download-mobile-text-container .coming-soon {
    font-size: 7px;
  }
}
@media (max-width: 500px) {
  .download-mobile .download-mobile-text-container .coming-soon {
    font-size: 6px;
    margin-bottom: 6px;
  }
}
@media (max-width: 400px) {
  .download-mobile .download-mobile-text-container .coming-soon {
    font-size: 5px;
  }
}
@media (max-width: 300px) {
  .download-mobile .download-mobile-text-container .coming-soon {
    font-size: 5px;
  }
}
@media (max-width: 200px) {
  .download-mobile .download-mobile-text-container .coming-soon {
    font-size: 4px;
  }
}
.download-mobile .download-mobile-text-container .download-title {
  display: flex;
  flex-direction: column;
  font-family: "Lora", serif !important;
  font-weight: 400;
  font-size: 36px;
  color: #000000;
}
.download-mobile .download-mobile-text-container .download-title .download-title-bold {
  font-weight: 600;
}
@media (max-width: 2000px) {
  .download-mobile .download-mobile-text-container .download-title {
    font-size: 36px;
  }
}
@media (max-width: 1800px) {
  .download-mobile .download-mobile-text-container .download-title {
    font-size: 33px;
  }
}
@media (max-width: 1600px) {
  .download-mobile .download-mobile-text-container .download-title {
    font-size: 29px;
  }
}
@media (max-width: 1400px) {
  .download-mobile .download-mobile-text-container .download-title {
    font-size: 26px;
  }
}
@media (max-width: 1200px) {
  .download-mobile .download-mobile-text-container .download-title {
    font-size: 22px;
  }
}
@media (max-width: 1000px) {
  .download-mobile .download-mobile-text-container .download-title {
    font-size: 18px;
  }
}
@media (max-width: 800px) {
  .download-mobile .download-mobile-text-container .download-title {
    font-size: 16px;
  }
}
@media (max-width: 600px) {
  .download-mobile .download-mobile-text-container .download-title {
    font-size: 14px;
  }
}
@media (max-width: 500px) {
  .download-mobile .download-mobile-text-container .download-title {
    font-size: 12px;
  }
}
@media (max-width: 400px) {
  .download-mobile .download-mobile-text-container .download-title {
    font-size: 10px;
  }
}
@media (max-width: 300px) {
  .download-mobile .download-mobile-text-container .download-title {
    font-size: 8px;
  }
}
@media (max-width: 200px) {
  .download-mobile .download-mobile-text-container .download-title {
    font-size: 7px;
  }
}
.download-mobile .download-mobile-text-container .download-description {
  font-weight: 400;
  width: 557px;
  font-size: 18px;
  color: #0c121c;
  padding: 15px 0;
}
@media (max-width: 2000px) {
  .download-mobile .download-mobile-text-container .download-description {
    font-size: 16px;
    width: 557px;
    padding: 15px 0;
  }
}
@media (max-width: 1800px) {
  .download-mobile .download-mobile-text-container .download-description {
    font-size: 15px;
    width: 530px;
  }
}
@media (max-width: 1600px) {
  .download-mobile .download-mobile-text-container .download-description {
    font-size: 14px;
    width: 430px;
  }
}
@media (max-width: 1400px) {
  .download-mobile .download-mobile-text-container .download-description {
    font-size: 13px;
    width: 360px;
  }
}
@media (max-width: 1200px) {
  .download-mobile .download-mobile-text-container .download-description {
    font-size: 12px;
    width: 300px;
  }
}
@media (max-width: 1000px) {
  .download-mobile .download-mobile-text-container .download-description {
    font-size: 11px;
    width: 227px;
  }
}
@media (max-width: 800px) {
  .download-mobile .download-mobile-text-container .download-description {
    font-size: 10px;
    width: 180px;
    padding: 10px 0;
  }
}
@media (max-width: 600px) {
  .download-mobile .download-mobile-text-container .download-description {
    font-size: 9px;
    width: 150px;
  }
}
@media (max-width: 500px) {
  .download-mobile .download-mobile-text-container .download-description {
    font-size: 8px;
    width: 130px;
  }
}
@media (max-width: 400px) {
  .download-mobile .download-mobile-text-container .download-description {
    font-size: 6px;
    width: 100px;
  }
}
@media (max-width: 300px) {
  .download-mobile .download-mobile-text-container .download-description {
    font-size: 5px;
    width: 80px;
  }
}
@media (max-width: 200px) {
  .download-mobile .download-mobile-text-container .download-description {
    font-size: 4px;
    width: 80px;
  }
}
.download-mobile .download-mobile-image-container {
  flex: 1 0 calc(50% - 16px);
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
}
@media (max-width: 2000px) {
  .download-mobile .download-mobile-image-container .mobile-img {
    height: 500px;
  }
}
@media (max-width: 1800px) {
  .download-mobile .download-mobile-image-container .mobile-img {
    height: 480px;
  }
}
@media (max-width: 1600px) {
  .download-mobile .download-mobile-image-container .mobile-img {
    height: 460px;
  }
}
@media (max-width: 1400px) {
  .download-mobile .download-mobile-image-container .mobile-img {
    height: 440px;
  }
}
@media (max-width: 1200px) {
  .download-mobile .download-mobile-image-container .mobile-img {
    height: 400px;
  }
}
@media (max-width: 1000px) {
  .download-mobile .download-mobile-image-container .mobile-img {
    height: 360px;
  }
}
@media (max-width: 800px) {
  .download-mobile .download-mobile-image-container .mobile-img {
    height: 300px;
  }
}
@media (max-width: 600px) {
  .download-mobile .download-mobile-image-container .mobile-img {
    height: 240px;
  }
}
@media (max-width: 500px) {
  .download-mobile .download-mobile-image-container .mobile-img {
    height: 180px;
  }
}
@media (max-width: 400px) {
  .download-mobile .download-mobile-image-container .mobile-img {
    height: 150px;
  }
}
@media (max-width: 300px) {
  .download-mobile .download-mobile-image-container .mobile-img {
    height: 120px;
  }
}

.download-mobile__mobile {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 80px 0 80px 0;
}
.download-mobile__mobile .download-mobile__mobile-image-container {
  flex: 1 0 calc(50% - 16px);
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
}
@media (max-width: 500px) {
  .download-mobile__mobile .download-mobile__mobile-image-container .mobile-img {
    height: 350px;
  }
}
@media (max-width: 400px) {
  .download-mobile__mobile .download-mobile__mobile-image-container .mobile-img {
    height: 340px;
  }
}
@media (max-width: 300px) {
  .download-mobile__mobile .download-mobile__mobile-image-container .mobile-img {
    height: 330px;
  }
}
.download-mobile__mobile .download-mobile__mobile-text-container {
  flex: 1 0 calc(50% - 16px);
  margin: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
  align-self: center;
  padding: 16px;
}
.download-mobile__mobile .download-mobile__mobile-text-container .coming-soon {
  width: fit-content;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0;
  color: #026AA2;
  padding: 8px 12px 8px 12px;
  border-radius: 16px;
  background: #E9EEEB;
  margin-bottom: 10px;
}
@media (max-width: 500px) {
  .download-mobile__mobile .download-mobile__mobile-text-container .coming-soon {
    font-size: 12px;
  }
}
@media (max-width: 400px) {
  .download-mobile__mobile .download-mobile__mobile-text-container .coming-soon {
    font-size: 12px;
  }
}
@media (max-width: 300px) {
  .download-mobile__mobile .download-mobile__mobile-text-container .coming-soon {
    font-size: 11px;
  }
}
@media (max-width: 200px) {
  .download-mobile__mobile .download-mobile__mobile-text-container .coming-soon {
    font-size: 10px;
  }
}
.download-mobile__mobile .download-mobile__mobile-text-container .download-title {
  display: flex;
  flex-direction: column;
  font-family: "Lora", serif !important;
  font-weight: 400;
  font-size: 36px;
  color: #000000;
}
.download-mobile__mobile .download-mobile__mobile-text-container .download-title .download-title-bold {
  font-weight: 600;
}
@media (max-width: 500px) {
  .download-mobile__mobile .download-mobile__mobile-text-container .download-title {
    font-size: 22px;
  }
}
@media (max-width: 400px) {
  .download-mobile__mobile .download-mobile__mobile-text-container .download-title {
    font-size: 21px;
  }
}
@media (max-width: 300px) {
  .download-mobile__mobile .download-mobile__mobile-text-container .download-title {
    font-size: 20px;
  }
}
@media (max-width: 200px) {
  .download-mobile__mobile .download-mobile__mobile-text-container .download-title {
    font-size: 19px;
  }
}
.download-mobile__mobile .download-mobile__mobile-text-container .download-description {
  font-weight: 400;
  width: 100%;
  font-size: 16px;
  color: #0c121c;
  padding: 15px 0;
}
@media (max-width: 500px) {
  .download-mobile__mobile .download-mobile__mobile-text-container .download-description {
    font-size: 16px;
  }
}
@media (max-width: 400px) {
  .download-mobile__mobile .download-mobile__mobile-text-container .download-description {
    font-size: 15px;
  }
}
@media (max-width: 300px) {
  .download-mobile__mobile .download-mobile__mobile-text-container .download-description {
    font-size: 14px;
  }
}
@media (max-width: 200px) {
  .download-mobile__mobile .download-mobile__mobile-text-container .download-description {
    font-size: 13px;
  }
}
/*!*******************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./TasteOfPersia/Components/FoodList.razor.scss ***!
  \*******************************************************************************************************************************************************************/
.menu-card {
  display: flex;
  width: 100%;
  height: auto;
  padding: 16px;
  border-radius: 8px;
  background-color: #FFFFFF;
}

@media (max-width: 600px) {
  .menu-card {
    height: 116px;
  }
}
.food-item-text__container {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  max-height: 84px;
}

.food-list__icon-container {
  width: 84px;
  height: 84px;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  background: #F8F4EB;
  border-radius: 8px;
}

.food-title {
  font-size: 14px;
  font-weight: 500;
  line-height: 17px;
  letter-spacing: 0;
  text-align: left;
  color: #0c121c;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.food-description {
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  text-align: left;
  color: #7d8096;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.food-price {
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  letter-spacing: 0;
  text-align: left;
  color: #0c121c;
}
/*!*****************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./TasteOfPersia/Components/Footer.razor.scss ***!
  \*****************************************************************************************************************************************************************/
.footer {
  background-color: #000000;
  padding-top: 10px;
}
.footer .footer-web {
  padding: 16px 100px;
  display: flex;
  flex-direction: row;
}
@media (max-width: 2000px) {
  .footer .footer-web {
    padding: 16px 100px;
  }
}
@media (max-width: 1800px) {
  .footer .footer-web {
    padding: 16px 100px;
  }
}
@media (max-width: 1600px) {
  .footer .footer-web {
    padding: 16px 80px;
  }
}
@media (max-width: 1400px) {
  .footer .footer-web {
    padding: 16px 60px;
  }
}
@media (max-width: 1200px) {
  .footer .footer-web {
    padding: 16px 40px;
  }
}
@media (max-width: 1000px) {
  .footer .footer-web {
    padding: 16px 30px;
  }
}
@media (max-width: 800px) {
  .footer .footer-web {
    padding: 14px 20px;
  }
}
@media (max-width: 600px) {
  .footer .footer-web {
    padding: 12px 16px;
  }
}
.footer .footer-web .footer-web-logo-container {
  width: 20%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-evenly;
}
.footer .footer-web .footer-web-logo-container .footer-web-logo {
  width: 240px;
  height: 240px;
}
@media (max-width: 2000px) {
  .footer .footer-web .footer-web-logo-container .footer-web-logo {
    width: 240px;
    height: 240px;
  }
}
@media (max-width: 1800px) {
  .footer .footer-web .footer-web-logo-container .footer-web-logo {
    width: 220px;
    height: 220px;
  }
}
@media (max-width: 1600px) {
  .footer .footer-web .footer-web-logo-container .footer-web-logo {
    width: 200px;
    height: 200px;
  }
}
@media (max-width: 1400px) {
  .footer .footer-web .footer-web-logo-container .footer-web-logo {
    width: 180px;
    height: 180px;
  }
}
@media (max-width: 1200px) {
  .footer .footer-web .footer-web-logo-container .footer-web-logo {
    width: 160px;
    height: 160px;
  }
}
@media (max-width: 1000px) {
  .footer .footer-web .footer-web-logo-container .footer-web-logo {
    width: 140px;
    height: 140px;
  }
}
@media (max-width: 800px) {
  .footer .footer-web .footer-web-logo-container .footer-web-logo {
    width: 120px;
    height: 120px;
  }
}
@media (max-width: 600px) {
  .footer .footer-web .footer-web-logo-container .footer-web-logo {
    width: 100px;
    height: 100px;
  }
}
.footer .footer-web .footer-web-menu-items-container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 30%;
}
.footer .footer-web .footer-web-info-container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50%;
}
.footer .footer-web li {
  margin-bottom: 10px;
}
.footer .footer-web a {
  font-size: 14px;
}
@media (max-width: 2000px) {
  .footer .footer-web a {
    font-size: 14px;
  }
}
@media (max-width: 1800px) {
  .footer .footer-web a {
    font-size: 12px;
  }
}
@media (max-width: 1600px) {
  .footer .footer-web a {
    font-size: 13px;
  }
}
@media (max-width: 1400px) {
  .footer .footer-web a {
    font-size: 12px;
  }
}
@media (max-width: 1200px) {
  .footer .footer-web a {
    font-size: 11px;
  }
}
@media (max-width: 1000px) {
  .footer .footer-web a {
    font-size: 10px;
  }
}
@media (max-width: 800px) {
  .footer .footer-web a {
    font-size: 9px;
  }
}
@media (max-width: 600px) {
  .footer .footer-web a {
    font-size: 8px;
  }
}
.footer .footer-mobile {
  padding: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media (max-width: 500px) {
  .footer .footer-mobile {
    padding: 12px;
  }
}
@media (max-width: 400px) {
  .footer .footer-mobile {
    padding: 10px;
  }
}
@media (max-width: 300px) {
  .footer .footer-mobile {
    padding: 8px;
  }
}
.footer .footer-mobile .footer-mobile-logo {
  width: 80px;
  height: 80px;
  margin-bottom: 10px;
}
@media (max-width: 500px) {
  .footer .footer-mobile .footer-mobile-logo {
    width: 80px;
    height: 80px;
  }
}
@media (max-width: 400px) {
  .footer .footer-mobile .footer-mobile-logo {
    width: 80px;
    height: 80px;
  }
}
@media (max-width: 300px) {
  .footer .footer-mobile .footer-mobile-logo {
    width: 60px;
    height: 60px;
  }
}
.footer .footer-mobile .social-media-icon {
  width: 24px;
  height: 24px;
}
.footer .footer-mobile ul {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.footer .footer-mobile li {
  margin-bottom: 10px;
}
.footer .footer-mobile a {
  font-size: 12px;
}
@media (max-width: 500px) {
  .footer .footer-mobile a {
    font-size: 12px;
  }
}
@media (max-width: 400px) {
  .footer .footer-mobile a {
    font-size: 10px;
  }
}
@media (max-width: 300px) {
  .footer .footer-mobile a {
    font-size: 8px;
  }
}

.copy-right {
  color: white;
  margin-top: 20px;
  padding-bottom: 20px;
  text-align: center;
}

.cursor {
  cursor: pointer;
}
/*!**************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./TasteOfPersia/Components/Map.razor.scss ***!
  \**************************************************************************************************************************************************************/
.map__default {
  width: 800px;
  height: 400px;
  border-radius: 10px;
}
/*!*****************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./TasteOfPersia/Components/Slider.razor.scss ***!
  \*****************************************************************************************************************************************************************/
.slider {
  width: 100%;
  height: 100vh;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.backdrop {
  width: 100%;
  height: 100%;
  background-color: rgba(19, 19, 19, 0.4);
  position: absolute;
}

.slider-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.slider-text {
  font-size: 18px;
  color: #fff;
  text-align: left;
  padding: 0 20px;
}
@media (max-width: 2000px) {
  .slider-text {
    font-size: 18px;
  }
}
@media (max-width: 1800px) {
  .slider-text {
    font-size: 17px;
  }
}
@media (max-width: 1600px) {
  .slider-text {
    font-size: 16px;
  }
}
@media (max-width: 1400px) {
  .slider-text {
    font-size: 15px;
  }
}
@media (max-width: 1200px) {
  .slider-text {
    font-size: 14px;
  }
}
@media (max-width: 1000px) {
  .slider-text {
    font-size: 13px;
    padding: 0 10px;
  }
}
@media (max-width: 800px) {
  .slider-text {
    font-size: 12px;
  }
}
@media (max-width: 600px) {
  .slider-text {
    font-size: 11px;
  }
}
@media (max-width: 500px) {
  .slider-text {
    font-size: 18px;
    text-align: center;
  }
}
@media (max-width: 400px) {
  .slider-text {
    font-size: 17px;
    text-align: center;
  }
}
@media (max-width: 300px) {
  .slider-text {
    font-size: 16px;
    text-align: center;
  }
}

.slider-content-holder {
  max-width: 574px;
  z-index: 1;
  text-align: left;
  margin: 0 140px;
}
@media (max-width: 1200px) {
  .slider-content-holder {
    margin: 0 100px;
  }
}
@media (max-width: 700px) {
  .slider-content-holder {
    margin: 0 70px;
  }
}
@media (max-width: 500px) {
  .slider-content-holder {
    margin: 0 16px;
  }
}
.slider-content-holder .slider-title-container {
  display: flex;
  flex-direction: column;
}
@media (max-width: 500px) {
  .slider-content-holder .slider-title-container {
    align-items: center;
  }
}
.slider-content-holder .slider-title-container .slider-title {
  font-size: 80px;
  font-family: "Lora", serif !important;
  font-style: italic;
  font-weight: 400;
  letter-spacing: 0;
  text-align: left;
}
@media (max-width: 2000px) {
  .slider-content-holder .slider-title-container .slider-title {
    font-size: 80px;
  }
}
@media (max-width: 1800px) {
  .slider-content-holder .slider-title-container .slider-title {
    font-size: 75px;
  }
}
@media (max-width: 1600px) {
  .slider-content-holder .slider-title-container .slider-title {
    font-size: 70px;
  }
}
@media (max-width: 1400px) {
  .slider-content-holder .slider-title-container .slider-title {
    font-size: 65px;
  }
}
@media (max-width: 1200px) {
  .slider-content-holder .slider-title-container .slider-title {
    font-size: 60px;
  }
}
@media (max-width: 1000px) {
  .slider-content-holder .slider-title-container .slider-title {
    font-size: 55px;
  }
}
@media (max-width: 800px) {
  .slider-content-holder .slider-title-container .slider-title {
    font-size: 50px;
  }
}
@media (max-width: 600px) {
  .slider-content-holder .slider-title-container .slider-title {
    font-size: 40px;
  }
}
@media (max-width: 500px) {
  .slider-content-holder .slider-title-container .slider-title {
    font-size: 44px;
    text-align: center;
  }
}
@media (max-width: 400px) {
  .slider-content-holder .slider-title-container .slider-title {
    font-size: 44px;
    text-align: center;
  }
}
@media (max-width: 300px) {
  .slider-content-holder .slider-title-container .slider-title {
    font-size: 42px;
    text-align: center;
  }
}
@media (max-width: 200px) {
  .slider-content-holder .slider-title-container .slider-title {
    font-size: 42px;
    text-align: center;
  }
}
/*!************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./TasteOfPersia/Dialogs/FoodDetailDialog.razor.scss ***!
  \************************************************************************************************************************************************************************/
.food-detail-container {
  width: 100%;
  height: 100%;
  background-color: #FFFFFF;
  display: flex;
  flex-wrap: wrap;
  align-content: space-between;
}
.food-detail-container .food-detail-icon-container {
  width: 100%;
  height: 304px;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  background: #F8F4EB;
  border-radius: 8px;
  margin: auto;
}
@media (min-width: 480px) {
  .food-detail-container .food-detail-icon-container {
    min-width: 432px;
  }
}
@media (max-width: 1000px) {
  .food-detail-container .food-detail-icon-container {
    height: 290px;
  }
}
@media (max-width: 600px) {
  .food-detail-container .food-detail-icon-container {
    height: 240px;
  }
}
.food-detail-container .food-detail-empty-image-container {
  width: 100%;
  height: 304px;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  background: #F8F8F8;
  border-radius: 8px;
}
.food-detail-container .food-detail-dialog-img {
  width: 100%;
}
.food-detail-container .food-detail-body {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.food-detail-container .food-detail-body .food-detail-text-container {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.food-detail-container .food-detail-body .food-detail-text-container .food-detail-name {
  padding-top: 24px;
  font-size: 22px;
  font-weight: 500;
  color: #0c121c;
}
.food-detail-container .food-detail-body .food-detail-text-container .food-detail-ingredients {
  padding: 16px 0 24px 0;
  font-size: 18px;
  font-weight: 400;
  color: #0c121c;
}
@media (max-width: 500px) {
  .food-detail-container .food-detail-body .food-detail-text-container .food-detail-ingredients {
    font-size: 14px;
  }
}
.food-detail-container .food-detail-footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}
.food-detail-container .food-detail-footer .food-detail-divider {
  width: 100%;
  height: 1px;
  background: #E5E7EB;
}
.food-detail-container .food-detail-footer .food-detail-price-title {
  font-size: 22px;
  font-weight: 500;
  color: #7d8096;
}
.food-detail-container .food-detail-footer .food-detail-price {
  font-size: 22px;
  font-weight: 500;
  color: #0c121c;
}
/*!*************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./TasteOfPersia/Pages/AboutUs.razor.scss ***!
  \*************************************************************************************************************************************************************/
.about-us__image-container {
  width: 100%;
  margin-bottom: 94px;
  margin-top: 42px;
}
@media (max-width: 500px) {
  .about-us__image-container {
    margin-top: 34px;
  }
}
.about-us__image-container .about-us__image {
  width: 250px;
  margin: 3px 6px;
}
@media (max-width: 1920px) {
  .about-us__image-container .about-us__image {
    width: 230px;
  }
}
@media (max-width: 1280px) {
  .about-us__image-container .about-us__image {
    width: 200px;
  }
}
@media (max-width: 960px) {
  .about-us__image-container .about-us__image {
    width: 160px;
  }
}
@media (max-width: 800px) {
  .about-us__image-container .about-us__image {
    width: 140px;
  }
}
@media (max-width: 700px) {
  .about-us__image-container .about-us__image {
    width: 110px;
  }
}
@media (max-width: 600px) {
  .about-us__image-container .about-us__image {
    width: 168px;
  }
}
@media (max-width: 400px) {
  .about-us__image-container .about-us__image {
    width: 148px;
  }
}

.about-us__title {
  font-family: "Lora", serif !important;
  font-size: 80px;
  font-style: italic;
  font-weight: 400;
  text-align: center;
  color: #0c121c;
}
@media (max-width: 1920px) {
  .about-us__title {
    font-size: 80px;
  }
}
@media (max-width: 1280px) {
  .about-us__title {
    font-size: 70px;
  }
}
@media (max-width: 960px) {
  .about-us__title {
    font-size: 60px;
  }
}
@media (max-width: 600px) {
  .about-us__title {
    font-size: 50px;
  }
}
@media (max-width: 500px) {
  .about-us__title {
    font-size: 22px;
    font-weight: 600;
    text-align: left;
  }
}

.about-us__description-container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.about-us__description-container .about-us__description {
  width: 50%;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0;
  text-align: center;
  color: #0c121c;
  margin-top: 32px;
}
@media (max-width: 1920px) {
  .about-us__description-container .about-us__description {
    width: 50%;
  }
}
@media (max-width: 1280px) {
  .about-us__description-container .about-us__description {
    width: 50%;
  }
}
@media (max-width: 960px) {
  .about-us__description-container .about-us__description {
    width: 70%;
  }
}
@media (max-width: 500px) {
  .about-us__description-container .about-us__description {
    width: 100%;
    text-align: left;
    line-height: 24px;
  }
}
/*!**************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./TasteOfPersia/Pages/Catering.razor.scss ***!
  \**************************************************************************************************************************************************************/
.catering {
  display: flex;
  flex-direction: row;
}
.catering .catering__form-container {
  width: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 50px 200px;
}
@media (max-width: 700px) {
  .catering .catering__form-container {
    width: 100%;
    align-items: center;
  }
}
@media (max-width: 2000px) {
  .catering .catering__form-container {
    padding: 50px 180px;
  }
}
@media (max-width: 1800px) {
  .catering .catering__form-container {
    padding: 50px 130px;
  }
}
@media (max-width: 1600px) {
  .catering .catering__form-container {
    padding: 50px 80px;
  }
}
@media (max-width: 1400px) {
  .catering .catering__form-container {
    padding: 50px 60px;
  }
}
@media (max-width: 1200px) {
  .catering .catering__form-container {
    padding: 50px 40px;
  }
}
@media (max-width: 1000px) {
  .catering .catering__form-container {
    padding: 50px 20px;
  }
}
@media (max-width: 800px) {
  .catering .catering__form-container {
    padding: 50px 16px;
  }
}
@media (max-width: 600px) {
  .catering .catering__form-container {
    padding: 50px 16px;
  }
}
.catering .catering__form-container .catering__form-title {
  font-family: "Lora", serif !important;
  font-size: 44px;
  font-style: italic;
  font-weight: 400;
  letter-spacing: 0;
  text-align: left;
  color: #0c121c;
}
@media (max-width: 1600px) {
  .catering .catering__form-container .catering__form-title {
    font-size: 40px;
  }
}
@media (max-width: 1400px) {
  .catering .catering__form-container .catering__form-title {
    font-size: 35px;
  }
}
@media (max-width: 1200px) {
  .catering .catering__form-container .catering__form-title {
    font-size: 30px;
  }
}
@media (max-width: 1000px) {
  .catering .catering__form-container .catering__form-title {
    font-size: 25px;
  }
}
.catering .catering__form-container .catering__form-description {
  margin-top: 16px;
  margin-bottom: 16px;
  font-family: "Inter", serif !important;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0;
  text-align: left;
  color: #0c121c;
}
.catering .catering__form-container .catering__form-name-container {
  display: flex;
  width: 100%;
  flex-direction: row;
  justify-content: space-evenly;
}
.catering .catering__form-container .catering__form-input-container {
  display: flex;
  width: 100%;
  flex-direction: column;
  margin-top: 24px;
}
.catering .catering__form-container .catering__form-input-container .catering__form-input-title {
  font-family: "Inter", serif !important;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0;
  text-align: left;
  color: #0c121c;
  margin-bottom: 8px;
}
.catering .catering__form-container .catering__form-submit-button {
  font-family: "Inter", serif !important;
  width: 100%;
  color: #FFFFFF;
  border-radius: 30px;
  height: 48px;
  margin-top: 32px;
  margin-bottom: 120px;
  background: #00A693;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0;
  text-align: left;
}
.catering .catering__form-container .catering__form-loading-label {
  font-family: "Inter", serif !important;
  color: #FFFFFF;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0;
  text-align: left;
  margin-left: 16px;
}
.catering .catering__form-container .catering__form-submit-button {
  font-family: "Inter", serif !important;
  width: 100%;
  color: #FFFFFF;
  border-radius: 30px;
  height: 48px;
  margin-top: 32px;
  margin-bottom: 120px;
  background: #00A693;
  font-size: 14px;
  font-weight: 700;
  line-height: 17px;
  letter-spacing: 0;
  text-align: left;
}
.catering .catering__form-container .catering__form-submit-button-disable {
  background: rgba(0, 166, 147, 0.43) !important;
}
.catering .catering__form-new-message-button {
  max-width: 536px;
  min-width: 300px;
  border-radius: 34px;
  border: 1px solid #00A693;
  color: #00A693;
  font-family: "Inter", serif !important;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}
.catering .catering__image-container {
  width: 50%;
  padding: 50px 100px;
}
@media (max-width: 2000px) {
  .catering .catering__image-container {
    padding: 50px 100px;
  }
}
@media (max-width: 1800px) {
  .catering .catering__image-container {
    padding: 50px 100px;
  }
}
@media (max-width: 1600px) {
  .catering .catering__image-container {
    padding: 50px 80px;
  }
}
@media (max-width: 1400px) {
  .catering .catering__image-container {
    padding: 50px 60px;
  }
}
@media (max-width: 1200px) {
  .catering .catering__image-container {
    padding: 50px 40px;
  }
}
@media (max-width: 1000px) {
  .catering .catering__image-container {
    padding: 50px 20px;
  }
}
@media (max-width: 800px) {
  .catering .catering__image-container {
    padding: 50px 15px;
  }
}
@media (max-width: 700px) {
  .catering .catering__image-container {
    display: none;
  }
}
@media (max-width: 600px) {
  .catering .catering__image-container {
    padding: 50px 10px;
  }
}
.catering .catering__image-container .catering__image {
  width: 100%;
}
.catering .catering__success-container {
  width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 50px 180px;
}
@media (max-width: 700px) {
  .catering .catering__success-container {
    width: 100%;
    align-items: center;
  }
}
@media (max-width: 2000px) {
  .catering .catering__success-container {
    padding: 50px 180px;
  }
}
@media (max-width: 1800px) {
  .catering .catering__success-container {
    padding: 50px 130px;
  }
}
@media (max-width: 1600px) {
  .catering .catering__success-container {
    padding: 50px 80px;
  }
}
@media (max-width: 1400px) {
  .catering .catering__success-container {
    padding: 50px 60px;
  }
}
@media (max-width: 1200px) {
  .catering .catering__success-container {
    padding: 50px 40px;
  }
}
@media (max-width: 1000px) {
  .catering .catering__success-container {
    padding: 50px 20px;
  }
}
@media (max-width: 800px) {
  .catering .catering__success-container {
    padding: 50px 16px;
  }
}
@media (max-width: 600px) {
  .catering .catering__success-container {
    padding: 50px 16px;
  }
}
.catering .catering__success-container .catering__success-icon {
  width: 40px;
  height: 40px;
  margin-bottom: 24px;
}
.catering .catering__success-container .catering__success-title {
  font-family: "Lora", serif !important;
  font-size: 44px;
  font-style: italic;
  font-weight: 400;
  text-align: left;
  color: #0c121c;
}
@media (max-width: 700px) {
  .catering .catering__success-container .catering__success-title {
    text-align: center;
  }
}
@media (max-width: 1600px) {
  .catering .catering__success-container .catering__success-title {
    font-size: 40px;
  }
}
@media (max-width: 1400px) {
  .catering .catering__success-container .catering__success-title {
    font-size: 35px;
  }
}
@media (max-width: 1200px) {
  .catering .catering__success-container .catering__success-title {
    font-size: 30px;
  }
}
@media (max-width: 1000px) {
  .catering .catering__success-container .catering__success-title {
    font-size: 25px;
  }
}
.catering .catering__success-container .catering__success-description {
  max-width: 538px;
  font-family: "Inter", serif !important;
  margin-top: 16px;
  margin-bottom: 16px;
  font-size: 20px;
  font-weight: 400;
  letter-spacing: 0;
  text-align: left;
  color: #0c121c;
}
@media (max-width: 700px) {
  .catering .catering__success-container .catering__success-description {
    text-align: center;
  }
}
@media (max-width: 1600px) {
  .catering .catering__success-container .catering__success-description {
    font-size: 16px;
  }
}
@media (max-width: 1200px) {
  .catering .catering__success-container .catering__success-description {
    font-size: 12px;
  }
}
/*!***************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./TasteOfPersia/Pages/ContactUs.razor.scss ***!
  \***************************************************************************************************************************************************************/
.contact-us {
  display: flex;
  width: 100%;
  padding: 96px 345px;
  flex-direction: row;
  align-items: center;
}
@media (max-width: 2000px) {
  .contact-us {
    padding: 96px 345px;
  }
}
@media (max-width: 1800px) {
  .contact-us {
    padding: 90px 280px;
  }
}
@media (max-width: 1600px) {
  .contact-us {
    padding: 80px 230px;
  }
}
@media (max-width: 1400px) {
  .contact-us {
    padding: 70px 180px;
  }
}
@media (max-width: 1200px) {
  .contact-us {
    padding: 60px 70px;
  }
}
@media (max-width: 1000px) {
  .contact-us {
    padding: 50px 100px;
  }
}
@media (max-width: 800px) {
  .contact-us {
    padding: 30px 40px;
  }
}
@media (max-width: 600px) {
  .contact-us {
    padding: 15px 20px;
  }
}
.contact-us .contact-us__info-container {
  display: flex;
  width: 50%;
  flex-direction: column;
}
.contact-us .contact-us__info-container .contact-us__info-title {
  font-family: "Lora", serif !important;
  font-size: 44px;
  font-weight: 400;
  color: #0c121c;
}
@media (max-width: 1920px) {
  .contact-us .contact-us__info-container .contact-us__info-title {
    font-size: 44px;
  }
}
@media (max-width: 1280px) {
  .contact-us .contact-us__info-container .contact-us__info-title {
    font-size: 40px;
  }
}
@media (max-width: 960px) {
  .contact-us .contact-us__info-container .contact-us__info-title {
    font-size: 38px;
  }
}
@media (max-width: 700px) {
  .contact-us .contact-us__info-container .contact-us__info-title {
    font-size: 30px;
  }
}
@media (max-width: 600px) {
  .contact-us .contact-us__info-container .contact-us__info-title {
    font-size: 26px;
  }
}
.contact-us .contact-us__info-container .contact-us__info-item {
  display: flex;
  margin-top: 28px;
  cursor: pointer;
}
.contact-us .contact-us__info-container .contact-us__info-item .contact-us__info-text {
  margin-left: 16px;
  font-family: "Inter", serif !important;
  font-size: 16px;
  font-weight: 400;
  color: #0c121c;
}
@media (max-width: 600px) {
  .contact-us .contact-us__info-container .contact-us__info-item .contact-us__info-text {
    font-size: 14px;
  }
}
.contact-us .contact-us__map-container {
  display: flex;
  width: 50%;
}

.contact-us__working-time-container {
  background-color: #000000;
  padding: 20px 0;
  width: 100%;
}
.contact-us__working-time-container .contact-us__working-time {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0;
  text-align: center;
}

.contact-us__working-time-container-mobile {
  display: flex;
  padding: 16px 5px;
  background: #0c121c;
  flex-direction: column;
}
.contact-us__working-time-container-mobile .contact-us__working-time-mobile {
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  text-align: center;
  color: #FFFFFF;
}

.contact-us-mobile {
  display: flex;
  width: 100%;
  padding: 40px 16px;
  flex-direction: column;
  align-items: center;
}
.contact-us-mobile .contact-us__info-container {
  display: flex;
  width: 100%;
  flex-direction: column;
}
.contact-us-mobile .contact-us__info-container .contact-us__info-title {
  font-family: "Lora", serif !important;
  font-size: 22px;
  font-weight: 600;
  color: #0c121c;
  margin-bottom: 16px;
}
.contact-us-mobile .contact-us__info-container .contact-us__info-item {
  display: flex;
  margin-top: 16px;
  cursor: pointer;
}
.contact-us-mobile .contact-us__info-container .contact-us__info-item .contact-us__info-text {
  margin-left: 16px;
  font-family: "Inter", serif !important;
  font-size: 16px;
  font-weight: 400;
  color: #0c121c;
}
.contact-us-mobile .contact-us__map-container {
  display: flex;
  width: 100%;
}
/*!**********************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./TasteOfPersia/Pages/Home.razor.scss ***!
  \**********************************************************************************************************************************************************/
.custom-grid {
  display: flex;
  flex-wrap: wrap;
}

.custom-grid-item {
  flex: 1 0 calc(50% - 16px);
  margin: 0;
}
@media (max-width: 1080px) {
  .custom-grid-item {
    flex: 1 0 calc(100% - 16px);
  }
}

.mobile-img-container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
  height: 615px;
}
@media (max-width: 1080px) {
  .mobile-img-container {
    flex-direction: column;
  }
  .mobile-img-container img {
    max-width: 100%;
    height: auto;
  }
}
@media (max-width: 768px) {
  .mobile-img-container {
    height: auto;
  }
}
@media (max-width: 480px) {
  .mobile-img-container {
    flex-direction: column;
  }
  .mobile-img-container img {
    max-width: 100%;
    height: auto;
  }
}

@media (max-width: 1080px) {
  .mud-item-responsive {
    flex-direction: column;
  }
  .mud-item-responsive img {
    max-width: 100%;
    height: auto;
  }
}
@media (max-width: 768px) {
  .mud-item-responsive {
    height: auto;
  }
}
@media (max-width: 480px) {
  .mud-item-responsive {
    flex-direction: column;
  }
  .mud-item-responsive img {
    max-width: 100%;
    height: auto;
  }
}

.about-background {
  background-color: #00655A;
}

.about-color {
  color: #00655A;
}

.contact-background {
  background-color: #BEA976;
}

.contact-color {
  color: #BEA976;
}

.about-container-parent {
  position: relative;
  height: 580px;
  width: 100%;
}
.about-container-parent .about-pattern-container {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row-reverse;
}

.about-container, .download-container {
  display: flex;
  flex-direction: column;
  padding: 4rem 0 4rem 6rem;
  justify-content: center;
  height: 100%;
}
.about-container .coming-soon, .download-container .coming-soon {
  width: fit-content;
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: 0em;
  color: #026AA2;
  padding: 8px 12px 8px 12px;
  border-radius: 16px;
  background: #E9EEEB;
  margin-bottom: 24px;
}
.about-container .about-title, .download-container .about-title {
  font-family: "Lora", serif !important;
  font-weight: 400;
  line-height: 102.4px;
  font-size: 80px;
}
.about-container .about-button, .download-container .about-button {
  border-radius: 25px;
  height: 50px;
  width: 150px;
  background-color: white;
}
.about-container .about-description, .download-container .about-description {
  width: 450px;
  font-weight: 400;
  line-height: 21.78px;
  font-size: 18px;
}
.about-container .download-title, .download-container .download-title {
  display: flex;
  flex-direction: column;
  width: 410px;
  font-family: "Lora", serif !important;
  font-weight: 400;
  line-height: 46.08px;
  font-size: 36px;
  color: rgb(0, 0, 0);
}
.about-container .download-title .download-title-bold, .download-container .download-title .download-title-bold {
  font-weight: 600;
}
.about-container .download-description, .download-container .download-description {
  width: 557px;
  font-weight: 400;
  font-size: 18px;
  line-height: 21.78px;
  color: rgb(12, 18, 28);
}
@media (max-width: 768px) {
  .about-container .mud-text, .download-container .mud-text {
    font-size: 0.9rem;
  }
}
@media (max-width: 480px) {
  .about-container .mud-text, .download-container .mud-text {
    font-size: 0.8rem;
  }
}
@media (max-width: 768px) {
  .about-container .mud-button, .download-container .mud-button {
    height: 45px;
    width: 130px;
  }
}
@media (max-width: 480px) {
  .about-container .mud-button, .download-container .mud-button {
    height: 40px;
    width: 120px;
  }
}
@media (max-width: 1080px) {
  .about-container, .download-container {
    padding: 2rem;
    flex-direction: column;
    margin-right: 0 !important;
  }
}
@media (max-width: 768px) {
  .about-container, .download-container {
    padding: 2rem;
    margin-right: 0 !important;
  }
}
@media (max-width: 600px) {
  .about-container, .download-container {
    padding: 2rem 0 2rem 2rem;
  }
}
@media (max-width: 480px) {
  .about-container, .download-container {
    padding: 1rem;
  }
}

.download-button-row {
  display: flex;
}
.download-button-row .mobile-page-icons {
  margin: 10px !important;
}
@media (max-width: 1080px) {
  .download-button-row {
    flex-direction: column;
    align-items: center;
  }
  .download-button-row .mud-image {
    margin: 10px;
    max-width: 100%;
    height: auto;
  }
}
@media (max-width: 768px) {
  .download-button-row {
    flex-direction: column;
    align-items: center;
  }
  .download-button-row .mud-image {
    margin: 10px;
    max-width: 100%;
    height: auto;
  }
}

.mobile-container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
  height: 580px;
}

.about-image-container {
  padding: 0 0;
  margin: 0 0;
}
.about-image-container .about-image {
  width: 100% !important;
}
@media (max-width: 768px) {
  .about-image-container {
    padding: 2rem 0;
  }
  .about-image-container img {
    max-width: 100%;
    height: auto;
  }
}

.console-layout {
  padding: 0 0;
  margin-top: -5px;
  margin-left: 8px;
}

.about-grid-container {
  height: 580px !important;
}
@media (max-width: 768px) {
  .about-grid-container {
    height: auto !important;
  }
}

.grid-height {
  height: 580px !important;
}
@media (max-width: 1080px) {
  .grid-height {
    height: auto !important;
  }
}
/*!**********************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./TasteOfPersia/Pages/Menu.razor.scss ***!
  \**********************************************************************************************************************************************************/
.menu-type-container {
  background: #F8F8F8;
}

.food-list-container {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  margin-bottom: 64px;
}
.food-list-container .food-list-item-container {
  width: 70%;
}
@media (max-width: 2000px) {
  .food-list-container .food-list-item-container {
    width: 70%;
  }
}
@media (max-width: 1600px) {
  .food-list-container .food-list-item-container {
    width: 75%;
  }
}
@media (max-width: 1400px) {
  .food-list-container .food-list-item-container {
    width: 80%;
  }
}
@media (max-width: 1200px) {
  .food-list-container .food-list-item-container {
    width: 85%;
  }
}
@media (max-width: 1000px) {
  .food-list-container .food-list-item-container {
    width: 90%;
  }
}
@media (max-width: 800px) {
  .food-list-container .food-list-item-container {
    width: 90%;
  }
}
@media (max-width: 600px) {
  .food-list-container .food-list-item-container {
    width: 95%;
  }
}
.food-list-container .food-type {
  font-size: 16px;
  font-weight: 500;
  line-height: 19px;
  text-align: left;
  color: #0c121c;
  margin: 40px 0 24px 0;
}

.menu-text {
  font-size: 14px;
  font-weight: 500;
  line-height: 17px;
  letter-spacing: 0;
  text-align: left;
  color: #0c121c;
}

.skeleton-container {
  width: 70% !important;
  overflow: hidden !important;
}

.selected-tab-container-mobile {
  display: flex;
  border-radius: 45px;
  padding: 8px 16px;
  height: 33px;
  background: #00A693;
  align-items: center;
}
.selected-tab-container-mobile .menu-label {
  color: #FFFFFF;
  font-family: "Inter", serif !important;
  font-size: 14px;
  font-weight: 500;
}

.tab-container-mobile {
  display: flex;
  border-radius: 45px;
  height: 33px;
  background: none;
  align-items: center;
}
.tab-container-mobile .menu-label {
  color: #0c121c;
  font-family: "Inter", serif !important;
  font-size: 14px;
  font-weight: 500;
}
/*!*****************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./TasteOfPersia/Shared/MainLayout.razor.scss ***!
  \*****************************************************************************************************************************************************************/
.body-container {
  min-height: 64vh;
}

.header-container {
  width: 100%;
  z-index: 1001;
  padding: 25px 40px;
}
@media (max-width: 500px) {
  .header-container {
    padding: 15px 30px;
  }
}

.logo {
  margin: -15px;
  width: 80px;
  height: 80px;
}
@media (max-width: 2000px) {
  .logo {
    width: 80px;
    height: 80px;
  }
}
@media (max-width: 1800px) {
  .logo {
    width: 75px;
    height: 75px;
  }
}
@media (max-width: 1600px) {
  .logo {
    width: 70px;
    height: 70px;
  }
}
@media (max-width: 1400px) {
  .logo {
    width: 65px;
    height: 65px;
  }
}
@media (max-width: 1200px) {
  .logo {
    width: 60px;
    height: 60px;
  }
}
@media (max-width: 1000px) {
  .logo {
    width: 55px;
    height: 55px;
  }
}
@media (max-width: 800px) {
  .logo {
    width: 50px;
    height: 50px;
  }
}
@media (max-width: 600px) {
  .logo {
    width: 45px;
    height: 45px;
  }
}
@media (max-width: 400px) {
  .logo {
    width: 40px;
    height: 40px;
  }
}
@media (max-width: 300px) {
  .logo {
    width: 35px;
    height: 35px;
  }
}

.drawer-menu-item {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: 20px;
  cursor: pointer;
}
/*!**************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./TasteOfPersia/Shared/NavMenu.razor.scss ***!
  \**************************************************************************************************************************************************************/
.nav-menu--title {
  font-size: 16px;
  line-height: 19px;
  letter-spacing: 0;
  text-align: left;
}
/*!******************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./TasteOfPersia/Shared/Style/Scss/colors.scss ***!
  \******************************************************************************************************************************************************************/

/*!****************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./TasteOfPersia/Shared/Style/Scss/main.scss ***!
  \****************************************************************************************************************************************************************/
html, body {
  font-family: "Inter", Helvetica, Arial, sans-serif !important;
}

h1:focus {
  outline: none;
}

a, .btn-link {
  color: #0071c1;
}

.w-100 {
  width: 100% !important;
}

.w-70 {
  width: 70% !important;
}

.h-100 {
  height: 100% !important;
}

.h-auto {
  height: auto !important;
}

.text-white {
  color: #fff !important;
}

.text-primary {
  color: #00A693;
}

.btn-primary {
  color: #fff;
  background-color: #1b6ec2;
  border-color: #1861ac;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
  padding-top: 1.1rem;
}

.valid.modified:not([type=checkbox]) {
  outline: 1px solid #26b050;
}

.invalid {
  outline: 1px solid red;
}

.validation-message {
  color: red;
}

#blazor-error-ui {
  background: lightyellow;
  bottom: 0;
  box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
  display: none;
  left: 0;
  padding: 0.6rem 1.25rem 0.7rem 1.25rem;
  position: fixed;
  width: 100%;
  z-index: 1000;
}

#blazor-error-ui .dismiss {
  cursor: pointer;
  position: absolute;
  right: 0.75rem;
  top: 0.5rem;
}

.blazor-error-boundary {
  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
  padding: 1rem 1rem 1rem 3.7rem;
  color: white;
}

.blazor-error-boundary::after {
  content: "An error has occurred.";
}

.loading-progress {
  position: relative;
  display: block;
  width: 8rem;
  height: 8rem;
  margin: 20vh auto 1rem auto;
}

.loading-progress circle {
  fill: none;
  stroke: #e0e0e0;
  stroke-width: 0.6rem;
  transform-origin: 50% 50%;
  transform: rotate(-90deg);
}

.loading-progress circle:last-child {
  stroke: #1b6ec2;
  stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
  transition: stroke-dasharray 0.05s ease-in-out;
}

.loading-progress-text {
  position: absolute;
  text-align: center;
  font-weight: bold;
  inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
}

.loading-progress-text:after {
  content: var(--blazor-load-percentage-text, "Loading");
}

.tabs-container {
  background: transparent !important;
}
.tabs-container .mud-tabs-toolbar-inner {
  align-items: center !important;
}

.mud-tab {
  min-width: auto !important;
  text-transform: none !important;
}

.main-menu {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.main-menu .logo-container {
  width: 100%;
  text-align: center;
}

.main-menu .mobile-mode {
  display: none;
}
@media (max-width: 500px) {
  .main-menu .mobile-mode {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 100%;
  }
}

.main-menu .web-mode {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
@media (max-width: 500px) {
  .main-menu .web-mode {
    display: none;
  }
}

.main-menu .mud-icon-button {
  padding: 0 !important;
}
.main-menu .mud-icon-button .mud-icon-button-label {
  color: #0C121C;
}

.main-menu.home .mud-icon-button {
  padding: 0 !important;
}
.main-menu.home .mud-icon-button .mud-icon-button-label {
  color: white;
}

.main-menu .mud-tabs {
  padding: 0 8px;
  width: 100%;
}
.main-menu .mud-tabs .nav-menu--title {
  font-size: 20px;
}
@media (max-width: 1400px) {
  .main-menu .mud-tabs .nav-menu--title {
    font-size: 18px;
  }
}
@media (max-width: 1200px) {
  .main-menu .mud-tabs .nav-menu--title {
    font-size: 17px;
  }
}
@media (max-width: 1000px) {
  .main-menu .mud-tabs .nav-menu--title {
    font-size: 16px;
  }
}
@media (max-width: 900px) {
  .main-menu .mud-tabs .nav-menu--title {
    font-size: 14px;
  }
}
@media (max-width: 800px) {
  .main-menu .mud-tabs .nav-menu--title {
    font-size: 13px;
  }
}
@media (max-width: 600px) {
  .main-menu .mud-tabs .nav-menu--title {
    font-size: 12px;
  }
}

.main-menu .mud-tab:not(.mud-tab-active) {
  color: #0C121C;
  font-weight: 400;
}

.main-menu .mud-tab.mud-tab-active {
  font-weight: 500;
  background: none !important;
}

.main-menu.home .mud-tab:not(.mud-tab-active) {
  color: #fff;
  font-weight: 400;
}

.main-menu.home .mud-tab.mud-tab-active {
  font-weight: 500;
  background: none !important;
}

.position-absolute {
  position: absolute;
}

.drawer-menu {
  position: fixed !important;
  background: #0C121C;
}

.dialog-blur-background {
  backdrop-filter: blur(10px);
}

.mud-dialog {
  border-radius: 24px;
}

.food-skeleton {
  border-radius: 8px;
}

.cursor-pointer {
  cursor: pointer;
}

.main-menu-shadow-background {
  box-shadow: 0 4px 4px 0 rgba(70, 70, 70, 0.1215686275);
  background: #F8F4EB;
}

.header-sticky {
  background: #F8F4EB;
  position: sticky;
  top: 0;
}

.drawer-menu-unselected {
  color: white;
}

.drawer-menu-selected {
  color: #00A693;
}

.contact-us__map {
  width: 100%;
  height: 515px;
  border-radius: 24px;
}
@media (max-width: 1920px) {
  .contact-us__map {
    height: 515px;
  }
}
@media (max-width: 1600px) {
  .contact-us__map {
    height: 450px;
  }
}
@media (max-width: 1280px) {
  .contact-us__map {
    height: 400px;
  }
}
@media (max-width: 960px) {
  .contact-us__map {
    height: 300px;
  }
}
@media (max-width: 500px) {
  .contact-us__map {
    height: 216px;
    margin: 32px 0;
  }
}

.mud-dialog-fullscreen {
  border-radius: 0 !important;
}

/* _________catering________ */
.catering__form-input-container .mud-input-outlined-border {
  border-radius: 24px !important;
  border: 1px solid #B8BFC6 !important;
}

.catering__form-input-container .mud-input-root {
  font-family: "Inter", serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  background: white !important;
  border-radius: 24px !important;
  margin: 0 !important;
  padding: 19px 14px !important;
}

/* _________catering________ */
/* _________FoodDetailDialog_________ */
.food-detail-icon {
  width: 128px;
  height: 128px;
}
@media (max-width: 600px) {
  .food-detail-icon {
    width: 100px;
    height: 100px;
  }
}

/* _________FoodDetailDialog_________ */