Hi, thanks for coming back.
I have some custom CSS loaded into my site already. For ref - I've copied this below.
It's working well throughout the site, until we reach the titling areas within the course pages.
I've attached a screengrab which shows how the title font has switched from Arial back to the default serif font...but only in these specific areas.
Are these controlled separately? If so, how do I do this?
UPDATE: I see you've put the following above:
.course-list .course-list__course-name {
font-family: myCustomFont;
}
This has worked on the course home page (main title) but hasn't carried through to the individual lesson pages. So I'm almost there... 🙂
Thanks!
...
Here's my custom CSS at present:
@font-face {
font-family: 'arlrdbd';
src: url('https://static1.squarespace.com/static/621e334b7b2f321d631474cd/t/63242e0be6d27f32ad8a8f60/1663315467511/arlrdbd.ttf');
}
h1 {font-family: 'arlrdbd';}
h2 {font-family: 'arlrdbd';}
h3 {font-family: 'arlrdbd';}
@font-face {
font-family: 'Arial-Rounded-MT';
src: url('https://static1.squarespace.com/static/621e334b7b2f321d631474cd/t/63242e01cf23a015b4799dca/1663315457104/Arial-Rounded-MT.Ttf');
}
p1 {font-family: 'Arial-Rounded-MT';}
p2 {font-family: 'Arial-Rounded-MT';}
p3 {font-family: 'Arial-Rounded-MT';}
@font-face {
font-family: 'ShadowsIntoLighttwo-Regular';
src: url('https://static1.squarespace.com/static/621e334b7b2f321d631474cd/t/6331758eea35ce32d16dd63f/1664185742694/ShadowsIntoLightTwo-Regular.ttf');
}
h4 {font-family: 'ShadowsIntoLighttwo-Regular';}
.markdown-block img {
float: left;
margin-right: 15px;
}
.ml-onclick-form{
padding: 10px 20px;
background-color: #440090;
color: #DFE0E1;
border: solid 1px #DFE0E1;
}
.ml-onclick-form:hover{
background-color: #212F76;
}
