Custom font CSS for multiple quote blocks on one page only?

Site URL: http://www.myartbeatflorals.com

Hopefully this is my last question, as my website is basically done: I want to customize my quote fonts only on my Testimonials page. I have a quote already on my home page, which I'd like to stay as is. I have already uploaded the custom fonts, but don't know the CSS code to make it apply exclusively to that one page. I will have several quote blocks on the same page with the same two fonts. I considered making a Word document into a PDF and embedding it, but that puts a gray space around the document and I don't want that. If there's a way to avoid that, it would probably be easiest. 

Otherwise....For the quoted portion, I want it to be Eras Medium ITC (ErasMediumITC.ttf) in 11 pt. The source, I want to be Ink Free (inkfree.ttf) in 12 pt. I am not picky on animation...anything that looks good with multiple quotes, or none at all. 

What code would accomplish this? I've attached a photo of how I want the quote to look (the source being indented would be nice, but not necessary).

Hi. Can you share link to page where you added quote block? We can check easier

On 5/16/2021 at 3:48 AM, tuanphan said:

Hi. Can you share link to page where you added quote block? We can check easier

I have only added one quote thus far, but there will be quotes throughout that page in the blank spaces. 

https://www.myartbeatflorals.com/testimonials

17 hours ago, Ashelle said:

I have only added one quote thus far, but there will be quotes throughout that page in the blank spaces. 

https://www.myartbeatflorals.com/testimonials

 

Your Custom CSS box has a syntax error, all CSS or some CSS won't work properly. You can fix it first.

If you look at the bottom right corner in Custom CSS, you will see a red notice

4 hours ago, tuanphan said:

Your Custom CSS box has a syntax error, all CSS or some CSS won't work properly. You can fix it first.

If you look at the bottom right corner in Custom CSS, you will see a red notice

I have seen that, but it just says it needs a closing and I cannot figure out where the closing needs to go. I'm completely ignorant in coding...

Just now, Ashelle said:

I have seen that, but it just says it needs a closing and I cannot figure out where the closing needs to go. I'm completely ignorant in coding...

Here's what I have:

a.Mobile-bar-branding:after {
    content: "SOLA WOOD | SILK | PRESERVED";
    display: block;
    margin-top: 20px;
    font-size: 8px;
    font-family: futura-pt;
    color: #A0A0A0;
}

@media screen and (max-width: 639px){
  #pitch {
    min-height: unset !important;
}

  //remove space at bottom of site on mobile//
.Mobile-bar.Mobile-bar--bottom {
  padding: 0;
}

I have just gone ahead and picked different fonts for the quote blocks. I feel that it would be a hassle to customize each and every quote I have on that page, especially if I will be switching out quotes periodically.