.homeheader {

}

.homeheader > .container {
  justify-content: space-between;

  flex-wrap: wrap-reverse;
}

.homeheader .homeheader-firstside,
.homeheader .homeheader-secondside {
  position: relative;
  display: flex;

  flex-direction: column;

  margin: 0 20px;

  width: calc((100% - (20px * 2)) / 2);
}

.homeheader .homeheader-firstside {
  margin-right: 0;
}
.homeheader .homeheader-secondside {
  margin-left: 0;
}

.homeheader-firstside-title {
  position: relative;

  margin-bottom: 10px;

  line-height: 1.2;

  text-align: justify;

  font-weight: 800;
  font-size: 60px;

  color: #000000;
}

.homeheader-firstside-subtitle {
  pointer-events: relative;

  margin-bottom: 10px;

  padding: 15px 0;

  text-align: justify;

  font-weight: 400;
  font-size: 20px;

  color: #b3b3b3;
}

.homeheader-row {
  position: relative;
  display: flex;

  flex-direction: row;
}
.homeheader-longbutton {
  position: relative;
  display: flex;

  align-items: center;
  justify-content: space-between;

  flex-direction: row;

  width: 100%;

  padding: 10px 25px;

  border-radius: 12px;

  text-decoration: none;

  font-weight: 500;
  font-size: 16px;

  fill: white;
  color: white;

  background: #EE3E08;
  box-shadow: 0 0 34px 0 rgba(0, 0, 0, 0.15);

  transition: 0.3s all ease-out;
}
.homeheader-longbutton:hover {
  background: #FF5521;
  box-shadow: 0 0 20px 5px rgba(0, 0, 0, 0.15);
}
.homeheader-longbutton svg {
  fill: inherit;
}
.homeheader-longbutton .homeheader-longbutton-iconcircle {
  position: relative;
  display: flex;

  align-items: center;
  justify-content: center;

  flex-direction: row;

  margin-right: 15px;

  width: 35px;
  height: 35px;

  border-radius: 100%;

  background: rgba(255, 255, 255, 0.1);
}


/*  */
.homeheader-imagescolle {
  position: relative;
  display: flex;

  flex-direction: row;

  flex-wrap: wrap;

  overflow: hidden;

  height: calc(100vh - (60px + 80px + 30px) - 30px);
  max-height: 400px;

  border-radius: 12px;
}

.homeheader-imagescolle .homeheader-imagescolle-item {
  position: relative;
  display: flex;

  align-items: center;
  justify-content: center;

  flex-direction: column;

  overflow: hidden;

  width: calc((100% - 10px) / 2);
  height: calc((100% - 10px) / 2);
}
.homeheader-imagescolle .homeheader-imagescolle-item:nth-child(even) {
  margin-right: 10px;
}
.homeheader-imagescolle .homeheader-imagescolle-item:nth-child(3),
.homeheader-imagescolle .homeheader-imagescolle-item:nth-child(4) {
  margin-top: 10px;
}

.homeheader-imagescolle .homeheader-imagescolle-item > img {
  position: relative;
  display: flex;

  min-width: 100%;
  min-height: 100%;
  max-height: 400px;

  object-fit: cover;
  object-position: center center;
}


@media (max-width: 850px) {
  .homeheader .homeheader-firstside,
  .homeheader .homeheader-secondside {
    margin: 20px 0;
    width: 100%;
  }
}





/* [ FEATURES ] */
.homefeatures {
}

.homefeatures > .container {
  justify-content: center;
}

.homefeatures .homefeatures-item {
  position: relative;
  display: flex;

  align-content: center;

  flex-direction: column;

  margin: 20px 0;

  width: calc(100% / 4);

  fill: #EE3E08;
  color: black;
}

.homefeatures .homefeatures-item-iconcont {
  position: relative;
  display: flex;

  align-items: center;
  justify-content: center;

  margin-bottom: 10px;

  width: 100%;
}
.homefeatures .homefeatures-item-iconcont svg {
  width: 30px;
  height: 30px;

  fill: inherit;
}

.homefeatures .homefeatures-item-title {
  margin: 0 auto;

  text-align: center;
}





/* [ Menu ] */
.homemenu {
  padding: 30px 0;
}
.homemenu > .container {
  flex-direction: column;
}
.homemenu .homemenu-title {
  margin: 0 auto;
  text-align: center;
}

.homemenu .homemenu-catgs {
  position: relative;
  display: flex;

  justify-content: center;

  flex-direction: row;
  flex-wrap: wrap;

  width: 100%;

  /* padding: 40px 0; */
}

.homemenu .homemenu-catg {
  position: relative;
  display: flex;
  flex: 1;
  flex-shrink: 0;

  flex-direction: column;

  min-width: 350px;

  padding: 30px 20px;
}

.homemenu .homemenu-catg-header {
  position: relative;
  display: flex;

  align-items: center;
  justify-content: center;

  flex-direction: column;

  width: 100%;

  padding: 15px 0;

  /* border-bottom: 1px solid rgba(0, 0, 0, 0.1); */
}

.homemenu .homemenu-catg-title {
  margin: 10px 0;

  text-decoration: none;

  font-weight: 500;
  font-size: 20px;

  color: #666666;

  transition: 0.3s all ease-out;
}
.homemenu .homemenu-catg-title:hover {
  color: #EE3E08;
}

.homemenu .homemenu-catg-image {
  position: relative;
  display: flex;

  align-items: center;
  justify-content: center;

  margin-bottom: 10px;

  width: 60px;
  height: 60px;

  border-radius: 50%;

  object-fit: cover;
  object-position: center center;

  box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.1);
}

.homemenu .homemenu-catg-list {
  position: relative;
  display: flex;

  flex-direction: column;

  width: 100%;

  padding: 10px 0;
}

.homemenu .homemenu-catg-list-item {
  position: relative;
  display: flex;

  flex-direction: row;

  width: 100%;

  padding: 15px 0;
}

.homemenu .homemenu-catg-list-item-imageside,
.homemenu .homemenu-catg-list-item-contentside {
  position: relative;
  display: flex;

  flex-direction: column;

  width: 100%;
}

.homemenu .homemenu-catg-list-item-imageside {
  margin-left: 15px;
  width: calc((100% / 4) * 1);
  max-height: 50px;
}
.homemenu .homemenu-catg-list-item-contentside {
  width: calc((100% / 4) * 3);
}

.homemenu .homemenu-catg-list-item-imageside-image {
  position: relative;
  display: flex;

  width: 100%;
  height: 100%;

  object-fit: cover;
  object-position: center center;
}

.homemenu .homemenu-catg-list-item-header {
  position: relative;
  display: flex;

  align-items: start;
  justify-content: space-between;

  flex-direction: row;
  flex-wrap: nowrap;

  width: 100%;
}
.homemenu .homemenu-catg-list-item-header::before {
  content: '';
  position: absolute;
  display: flex;
  z-index: -1;

  top: calc((20px / 2) + 1px);

  width: 100%;

  border-bottom: 1px dotted #B1B1B1;
}
.homemenu .homemenu-catg-list-item-title {
  position: relative;

  overflow: hidden;

  max-height: calc(20px * 2);

  padding-left: 5px;

  line-height: 20px;

  font-weight: 600;
  font-size: 16px;

  background: white;
}
.homemenu .homemenu-catg-list-item-price {
  position: relative;

  padding-right: 5px;

  white-space: nowrap;

  line-height: 20px;

  font-weight: 600;
  font-size: 13px;

  color: #EE3E08;
  background: white;
}

.homemenu .homemenu-catg-list-item-description {
  position: relative;
  display: flex;

  flex-direction: column;

  width: 100%;

  padding: 15px 0;

  text-align: justify;

  font-weight: 400;
  font-size: 13px;

  color: #666666;
}

.homemenu .homemenu-catg-list-item-description > p {
  overflow: hidden;

  max-height: calc(20px * 2);

  line-height: 20px;
}

@media (max-width: 850px) {
  .homemenu .homemenu-catg-list-item-imageside {
    margin-left: 0;
  }
  .homemenu .homemenu-catg-list-item-header {
    margin-top: 10px;
  }
}


.homemenu .homemenu-showallbutton {
  position: relative;
  display: flex;

  align-items: center;

  flex-wrap: nowrap;
  flex-direction: row;

  margin: 0 auto;

  text-decoration: none;

  white-space: nowrap;

  font-weight: 500;
  font-size: 16px;

  fill: #EE3E08;
  color: #EE3E08;
}
.homemenu .homemenu-showallbutton svg {
  margin-right: 5px;

  width: 20px;
  height: 20px;
}

@media (max-width: 850px) {
  .homemenu .homemenu-catg {
    min-width: 100%;
    padding-right: 0;
    padding-left: 0;
  }

  .homemenu .homemenu-catg-list-item {
    flex-wrap: wrap;
  }

  .homemenu .homemenu-catg-list-item-imageside,
  .homemenu .homemenu-catg-list-item-contentside {
    width: 100%;
  }

  .homemenu .homemenu-catg-list-item-imageside {
    max-height: 170px;
  }
}





/* [ BRANCHES ] */
.homebranches {
}
.homebranches > .container {
  flex-direction: column;
}

.homebranches .homebranches-title {
  position: relative;

  margin: 10px auto;
}

.homebranches .homebranches-list {
  position: relative;
  display: flex;

  flex-direction: row;
  flex-wrap: wrap;

  margin-left: -15px;
  margin-right: -15px;

  width: calc(100% + (15px * 2));
}

.homebranches .homebranches-list-item {
  position: relative;
  display: flex;

  align-items: center;

  flex-direction: column;

  margin: 15px 15px;

  width: calc((100% - (15px * 4)) / 2);

  padding: 30px 15px;

  border-radius: 12px;

  text-decoration: none;

  fill: white;
  color: white;

  background: rgba(238, 62, 8, 0.7);
  box-shadow: 0 0 34px 0 rgba(0, 0, 0, 0.03);
}

.homebranches .homebranches-list-item-title {
  text-align: center;
}

.homebranches .homebranches-list-item-iconcont {
  position: relative;
  display: flex;

  align-items: center;
  justify-content: center;

  margin-bottom: 10px;

  width: 100%;
}
.homebranches .homebranches-list-item-iconcont svg {
  width: 30px;
  height: 30px;

  fill: inherit;
}

.homebranches .homebranches-showallbutton {
  position: relative;
  display: flex;

  align-items: center;

  flex-wrap: nowrap;
  flex-direction: row;

  margin: 0 auto;
  margin-top: 20px;

  text-decoration: none;

  white-space: nowrap;

  font-weight: 500;
  font-size: 16px;

  fill: #EE3E08;
  color: #EE3E08;
}

.homebranches .homebranches-showallbutton svg {
  margin-right: 5px;

  width: 20px;
  height: 20px;
}





/* [ ORDER NOW BAR ] */
.homeordernowbar {
  position: relative;
  display: flex;

  overflow: hidden;

  width: 100%;

  padding: 30px;

  background: rgba(0, 0, 0, 0.4);
}
.homeordernowbar .homeordernowbar-overlay {
  content: '';
  position: absolute;
  display: flex;
  z-index: -1;

  top: 0;
  right: 0;
  left: 0;
  bottom: 0;

  width: 100vw;
  height: 100vh;

  background: url('https://images.unsplash.com/photo-1556745753-b2904692b3cd?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1932&q=80');
  background-attachment: fixed;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

.homeordernowbar > .container {
  flex-direction: column;
}

.homeordernowbar .homeordernowbar-title {
  margin: 0 auto;
  margin-bottom: 20px;

  text-align: center;

  font-weight: 600;
  font-size: 24px;

  color: white;
}

.homeordernowbar .homeordernowbar-button {
  position: relative;
  display: flex;

  flex-direction: row;

  overflow: hidden;

  margin: 0 auto;

  padding: 10px 25px;

  border: 3px solid white;

  text-decoration: none;

  font-weight: 600;
  font-size: 20px;

  fill: white;
  color: white;

  background: rgba(0, 0, 0, 0);

  transition: 0.3s all ease-out;
}
.homeordernowbar .homeordernowbar-button > span {
  z-index: 1;
}
.homeordernowbar .homeordernowbar-button::before {
  content: '';
  position: absolute;
  display: flex;
  z-index: 0;

  flex-direction: column;

  top: 0;
  right: calc(-100% - (25px * 2));
  bottom: 0;

  transform: skew(-20deg);

  width: calc(100% + (20px * 2));
  height: 100%;

  background: rgba(238, 62, 8, 1);
  transition: 0.3s all ease-out;
}
.homeordernowbar .homeordernowbar-button:hover::before {
  right: -20px;
  background: rgba(238, 62, 8, 1);
}
.homeordernowbar .homeordernowbar-button:hover {
  /* background: rgba(238, 62, 8, 1); */
  border-color: rgba(238, 62, 8, 1);
}





/* [ How Order ] */
.homehoworder {
  padding: 50px 0;
}

.homehoworder > .container {
}

.homehoworder .homehoworder-title {
  margin: 0 auto;

  text-align: center;
}

.homehoworder .homehoworder-list {
  position: relative;
  display: flex;

  flex-direction: column;

  padding: 0;
  margin: 0;
  list-style: none;

  width: 100%;
}

.homehoworder .homehoworder-list-item {
  position: relative;
  display: flex;

  flex-direction: row;
  flex-wrap: wrap;

  width: 100%;

  padding: 40px 0;
}

.homehoworder .homehoworder-list-item-imageside,
.homehoworder .homehoworder-list-item-contentside {
  position: relative;
  display: flex;

  flex-direction: column;

  margin: 0 20px;

  width: 100%;
}
.homehoworder .homehoworder-list-item-imageside {
  width: calc(((100% - (20px * 2)) / 4) * 1.5);
}
.homehoworder .homehoworder-list-item-contentside {
  width: calc(((100% - (20px * 2)) / 4) * 2.5);
}

.homehoworder .homehoworder-list-item:nth-child(even) {
  flex-direction: row-reverse;
}
.homehoworder .homehoworder-list-item:nth-child(even) .homehoworder-list-item-imageside {
  margin-left: 0;
}
.homehoworder .homehoworder-list-item:nth-child(even) .homehoworder-list-item-contentside {
  margin-right: 0;
}
.homehoworder .homehoworder-list-item:nth-child(odd) .homehoworder-list-item-imageside {
  margin-right: 0;
}
.homehoworder .homehoworder-list-item:nth-child(odd) .homehoworder-list-item-contentside {
  margin-left: 0;
}

@media (max-width: 850px) {
  .homehoworder .homehoworder-list-item-imageside,
  .homehoworder .homehoworder-list-item-contentside {
    margin: 20px 0;
    width: 100%;
  }
}

.homehoworder .homehoworder-list-item-imageside-image {
  position: relative;

  width: 100%;
  height: auto;

  object-fit: contain;
  object-position: center center;
}

.homehoworder .homehoworder-list-item-steptitle {
  margin: 10px 0;

  font-weight: 600;
  font-size: 16px;

  color: #EE3E08;
}

.homehoworder .homehoworder-list-item-title {
  margin: 10px 0;

  font-weight: 500;
  font-size: 24px;

  color: #000000;
}

.homehoworder .homehoworder-list-item-description {
  margin: 10px 0;

  font-weight: 500;
  font-size: 15px;

  color: rgba(130, 130, 130, 1);
}





/* [ Work Hours ] */
.homeworkhours {
}

.homeworkhours > .container {
  flex-direction: column;
}

.homeworkhours .homeworkhours-title {
  margin: 0 auto;

  text-align: center;

  font-weight: 600;
  font-size: 24px;
}

.homeworkhours .homeworkhours-list {
  position: relative;
  display: flex;

  flex-direction: row;
  flex-wrap: wrap;

  justify-content: center;

  padding: 0;
  margin: 0;
  list-style: none;

  margin: 20px 0;

  width: 100%;
}

.homeworkhours .homeworkhours-list-item {
  position: relative;
  display: flex;

  align-items: center;
  justify-content: center;

  flex-direction: column-reverse;

  padding: 20px 20px;

  width: calc(100% / 3);
}

.homeworkhours .homeworkhours-list-item-title {
  font-weight: 500;
  font-size: 18px;

  color: #000000;
}
.homeworkhours .homeworkhours-list-item-subtitle {
  font-weight: 400;
  font-size: 18px;

  color: #666666;
}

@media (max-width: 600px) {
  .homeworkhours .homeworkhours-list-item {
    width: calc(100% / 2);
  }
}
@media (max-width: 410px) {
  .homeworkhours .homeworkhours-list-item {
    width: 100%;
  }
}





/* [ Images Show ] */
.homeimagesshow {
  position: relative;
  display: flex;

  flex-direction: column;
}

.homeimagesshow .homeimagesshow-list {
  position: relative;
  display: flex;

  flex-direction: row;
  flex-wrap: nowrap;

  overflow: hidden;
  overflow-x: auto;

  width: 100%;
  height: 300px;
}

/* images show - scrollbar */
.homeimagesshow .homeimagesshow-list::-webkit-scrollbar {
  width: 3px;
  height: 3px;
}
.homeimagesshow .homeimagesshow-list::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.03);
}
.homeimagesshow .homeimagesshow-list::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.1);
}
.homeimagesshow .homeimagesshow-list:hover::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.2);
}

.homeimagesshow .homeimagesshow-list-item {
  cursor: pointer;
  position: relative;
  display: flex;

  overflow: hidden;

  min-width: fit-content;
  height: 100%;

  transition: 0.3s all ease-out;
}

.homeimagesshow .homeimagesshow-list-item .homeimagesshow-list-item-overlay {
  position: absolute;
  display: flex;

  align-items: center;
  justify-content: center;

  top: 0;
  right: 0;
  left: 0;
  bottom: 0;

  background: rgba(0, 0, 0, 0.4);

  opacity: 0;
  transition: 0.3s all ease-out;
}
.homeimagesshow .homeimagesshow-list-item:hover .homeimagesshow-list-item-overlay {
  opacity: 1;
}

.homeimagesshow .homeimagesshow-list-item .homeimagesshow-list-item-image {
  position: relative;

  transform: scale(1.05);

  width: auto;
  min-height: 100%;
  height: 100%;
  max-height: 100%;

  object-fit: cover;
  object-position: center center;

  transition: 1s all ease-out;
}
.homeimagesshow .homeimagesshow-list-item:hover .homeimagesshow-list-item-image {
  transform: scale(1.2);
}

.homeimagesshow .homeimagesshow-list-item-overlay-actionbutton {
  position: relative;
  display: flex;

  align-items: center;
  justify-content: center;

  flex-direction: column;

  transform: scale(0.5);

  fill: rgba(255, 255, 255, 1);
  color: rgba(255, 255, 255, 1);

  transition: 0.3s all ease-out;
}
.homeimagesshow .homeimagesshow-list-item-overlay-actionbutton svg {
  width: 30px;
  height: 30px;
}

.homeimagesshow .homeimagesshow-list-item:hover .homeimagesshow-list-item-overlay-actionbutton {
  transform: scale(1);
}