How to make left and right paddings of the page smaller?

Add the following CSS to design customizations:

.page-preview-item, .page-title {
  max-width: 1000px;
  padding-left: 10px;
  padding-right: 10px;
}

To apply it only on mobile use media queries. In the following example it will apply only for screens with the width less than 760px:

@media and (max-width: 760px) {
  .page-preview-item, .page-title  {
    max-width: 1000px;
    padding-left: 10px;
    padding-right: 10px;
  } 
}