.flex ul {
  list-style-type:none;
  padding:0;
  margin:0;
}

.flex li {
  border:1px solid lightgrey;
  padding:.5rem 0;
}

.flex li:first-child {
  border-top-left-radius:10px;
  border-bottom-left-radius:10px;
}

.flex li:last-child {
  border-top-right-radius:10px;
  border-bottom-right-radius:10px;
}

.flex ul li a {
  text-decoration:none;
  color:grey;
  padding:.5rem 1rem;
}

.active {
  background:#ee8e7f;
}

.flex .active a {
  color:white;
  padding:.5rem 1rem;
}

.flex {
  display:flex;
}

.flex-center {
  align-items:center;
  justify-content:space-between;
  width:80%;
  flex-wrap:wrap;
  margin:0 auto;
  margin-top:2rem;
}

.service {
  width:80%;
  margin:0 auto;
  justify-content:space-between;
  flex-wrap:wrap;
  text-align:center;
  margin-top:2rem;
  color:white;
  margin-bottom:2rem;
  position: relative;
}

.service div {
  width:230px;
  border-radius:20px;
  cursor:pointer;
/*   margin-bottom:2rem; */
}

.service p {
  width:150px;
  margin:0 auto;
  text-align:left;
  margin-top:1rem;
  margin-bottom:2rem;
}

.service h3 {
  margin-top:2rem;
}

.service div:nth-child(4n+1) {
  background:#cc9889;
}

.service div:nth-child(4n+2) {
  background:#f09683;
}

.service div:nth-child(4n+3) {
  background:#f4c1aa;
}

.service div:nth-child(4n) {
  background:#f4b692;
}


.serviceConsume img{
  width: 80vh;
}

.mask-inner {
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 100%;
  overflow: hidden;
  
  -moz-transition: ease 200ms;
  -o-transition: ease 200ms;
  -webkit-transition: ease 200ms;
  transition: ease 200ms;
}

.mask-wrapper .mask-inner {
  width: 100%;
  height: 100%;
}

.mask-wrapper .mask-inner {
  border-radius:30px;
}

.mask-inner {
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
}

.mask-inner span {
  margin-left:4rem;  
}

.mask-inner span p {
  width:400px;
}

.serviceFeedback {
  display:flex;
  flex-direction:column;
  width:60%;
  margin:0 auto;
}

.serviceFeedback img {
  width:100%;
  margin:0 auto;
}

#serviceFeedbackUpdate {
  color: white;
  background: #f09683;
  border: none;
  border-radius: 30px;
  padding: .6rem 2rem;
  text-decoration: none;
}

.serviceFeedbackBtn {
  text-align: center;
  margin-bottom: 2em;
}

@media screen and (max-width: 420px) {
  .card {
    margin-bottom:2rem;
  }
  .serviceFeedback {
    width:80 !important;
  }
  .serviceConsume img{
    width: 50vh;
  }
}