<section>
  <div class="container margin">
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>    
  </div>
</section>   

.margin .item,
.negative-margin .item {
  margin: 0 1rem;
}

.negative-margin {
  margin: 0 -1rem;
}

.gap {
  gap: 1rem;
}



section {
  max-width: 100%;
  margin: 0 auto;
  border: 2px dashed #4c004c;
}

.container {
  display: flex;
  margin-top: 1rem;
  margin-bottom: 1rem;
  box-sizing: border-box;
}


body {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  min-height: 100vh;
  background: linear-gradient(-45deg, #ff9f4d 10%, #ffc857 0, #ffc857 90%, #ff9f4d 0, #ff9f4d 100%);
}

.item {
  flex: auto 1 1;
  padding: 50px;
  border-radius: 15px;
  background-color: hsl(300deg 23% 97%);
  background-image: linear-gradient(hsl(7deg 100% 64%),hsl(7deg 100% 64%)), linear-gradient(hsl(301deg 100% 15%),hsl(301deg 100% 15%));
  background-size: 50px 10px, 60px 10px;
  background-position: 20px 40px, 20px 60px;
  background-repeat: no-repeat;
}

* {
  box-sizing: border-box;
}