/* ROW 1 */
.row1 {
  display: flex;
  justify-content: space-between;
  background-color: #883e24;
  padding-top: 60px;
  /* border: 1px solid yellow; */
}

.row-container1-1 {
  /* border: 1px solid blue; */
}

.coffee {
  max-width: 100%;
  height: auto;
}
.row-container1-2 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  /* border: 1px solid green; */
  flex: 1;
}

@media (max-width: 768px) {
  .row1 {
    flex-direction: column;
  }

  .row-container1-1 {
    display: flex;
    justify-content: center;
  }

  .row-container1-2 {
    justify-content: space-around;
    height: 200px;
  }
}

.row-container1-2 h3 {
  font-family: Hind-Light;
  color: #dfd9ab;
  font-size: 50px;
}

.row-container1-2 .coffee-text {
  font-size: 20px;
  color: #dfd9ab;
}

h3 {
  margin: 0;
  padding: 0;
  color: #dfd9ab;
  font-size: 30px;
}

h2 {
  margin: auto;
  color: #dfd9ab;
  font-size: 30px;
}

.menu-text {
  color: #dfd9ab;
  font-size: 25px;
}

.coffee-text1, .coffee-text2 {
  color: #dfd9ab;
}

/* Row 2 */
.row2 {
  display: flex;
  background-color: #dfd9ab;
  height: 250px;
}

.row-container2-1 {
  display: flex;
  flex-direction: column;
  flex: 1;
  /* border: 1px solid blue; */
}

.row-container2-1 .header-4 {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  /* border: 1px solid blue; */
  margin: 0;
}

.row-container2-1-1 {
  flex: 1;
  display: flex;
  justify-content: space-around;
  align-items: center;
}

.row-container2-2 {
  display: flex;
  flex-direction: column;
  flex: 1;
  /* border: 1px solid blue; */
}

.row-container2-2 .header-4 {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  /* border: 1px solid blue; */
  margin: 0;
}

.row-container2-2-2 {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
}

.row-container2-3 {
  display: flex;
  flex-direction: column;
  flex: 1;
  /* border: 1px solid blue; */
}

.row-container2-3 .header-4 {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  /* border: 1px solid blue; */
  margin: 0;
}

.row-container2-3-3 {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
}

@media (max-width: 768px) {
  .row2 {
    flex-direction: column;
    align-items: center;
    height: 600px;
  }
  .row-container2-1 {
    width: 100%;
  }
  .row-container2-2 {
    width: 100%;
  }
  .row-container2-3 {
    width: 100%;
  }
}

/* Row 3 */

.row3 {
  display: flex;
  background-color: #883e24;
  height: 250px;
}

.row-container3-1 {
  display: flex;
  justify-content: space-around;

  flex: 1;
}

.row-container3-1-1 {
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 1;
}

.img-merch {
  max-width: 100%;
  height: 100px;
  border-radius: 10px;
}

.row-container3-1-2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;
  /* border: 1px solid blue; */
  flex: 2;
}

.row-container3-2 {
  display: flex;
  justify-content: space-around;
  flex: 1;
}

.row-container3-2-1 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;
  /* border: 1px solid blue; */
  flex: 2;
}

.row-container3-2-2 {
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 1;
}

@media (max-width: 768px) {
  .row3 {
    height: 300px;
  }

  .row-container3-1-2 {
    justify-content: space-around;
    flex-direction: column;
  }
  .row-container3-2-1 {
    justify-content: space-around;
    flex-direction: column;
  }
}

@media (max-width: 600px) {
  .row3 {
    height: 600px;
    flex-direction: column;
  }
}