[RbnJrg]

Maybe you are doing something wrong. I used this code without any issue:

h1 {
   font-family: "Arial", sans-serif;
   text-align: center;
   margin-bottom: 1em;
}

h2 {
   width: 70%;
   font-family: serif;
   font-style: italic;
   text-align: center;
   margin: 0 auto 1em auto;
   padding: 1em;
   border: 7px double black;
   -webkit-border-radius: 25px;
}

p {
   text-indent: 0; 
   text-align: justify;
   font-family: serif;
}

.boldss {
   font-family: "Arial", sans-serif;
   font-weight: bold;
}

and:

<h1>This title in sans-serif</h1>

  <h2>Subtitle in serif</h2>

  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla ac tellus nunc. Phasellus imperdiet leo metus, et gravida lacus. Donec metus ligula, elementum at pellentesque pellentesque, suscipit ac nunc. Etiam lobortis, <span class="boldss">this text in bold sans-serif</span> massa ac aliquam auctor, augue nisl sagittis urna, at dapibus tellus erat ullamcorper ligula. Praesent orci dui, pulvinar id convallis a, faucibus non mauris. Donec tellus augue, tempus sed facilisis sed, fringilla quis leo. Mauris vulputate, leo ac facilisis vulputate, enim orci interdum augue, in blandit quam turpis quis dui.</p>

This is how it looks in Kindle Previewer (Kindle Paperwhite):



This is how it looks in my K4NT:



Below you can check the respective epub.

Regards
Rubén