.step-by-step-guide {
  background-color: #f5f5f5;
  counter-reset: step-guide-counter;
  font-weight: bold;
  margin: 1.5rem 0;
  overflow: hidden;
  padding: 30px 20px;

}

@media screen and (min-width: 500px ) {
   .step-by-step-guide {
         padding: 30px 60px;
   }
  }

.step {
  background-position: 50% 0;
  background-repeat: no-repeat;
  list-style: none;
  padding: 135px 30px 5px; 
}

.step p {
    font-weight: normal;
    padding-left: 1.5rem;
    line-height: 1.3;
    font-size: 18px; 
}
    .step p::before {
      counter-increment: step-guide-counter;
      content: counter(step-guide-counter);
      display: inline-block;
      font-weight: bold;
      margin-left: -1.5rem;
      padding-right: 0.5rem; }

.step-by-step__header {
  color: #161616;
}

.step--one {
  background-image: url(https://nrs.preservation.mirrorweb.com/public/20181208132419oe_/https://cimg.visitscotland.com/cms-images/dev-module-images/534144/step-one); }

.step--two {
  background-image: url(https://nrs.preservation.mirrorweb.com/public/20181208132419oe_/https://cimg.visitscotland.com/cms-images/dev-module-images/534144/step-two);
  background-position: 50% 31px; }

.step--three {
  background-image: url(https://nrs.preservation.mirrorweb.com/public/20181208132419oe_/https://cimg.visitscotland.com/cms-images/dev-module-images/534144/step-three);
  background-position: 50% 35px; }