Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
squarelust

Fonts listed in CSS are not appearing

Question

Why are the fonts specified in the CSS code below not appearing on screen?

I'm trying implement my code on an unlinked page in the Brine template.

I've inserted the CSS code via Design-->Custom Code. Only Freight Text is appearing, not the other fonts.

Project HTML


<div class="tt-canvas-inner-21813">
   <span class="tt-layer tt-21813-layer-1">LEGALITIES</span>
   <span class="tt-layer tt-21813-layer-2">This page was last updated in </span>
   <span class="tt-layer tt-21813-layer-3">JULY</span>
   <span class="tt-layer tt-21813-layer-4">2019</span>
</div>



Project CSS

div.tt-canvas-21813 { padding: 2em 0; margin: 0 auto; background-color: #fff;}

div.tt-canvas-inner-21813 { position: relative; margin: 0 auto; width: 811px; height: 192px;}

span.tt-layer { position: absolute; display: inline-block; white-space: normal; line-height: 1em; transform-origin: 50% 50%;}

span.tt-21813-layer-1 { border-color: #fff; border-radius: 0em; border-width: 0em; color: #242424; font-family: freight-neo-pro; font-size: 3.6em; font-weight: 600; padding: 0em; white-space: nowrap; overflow: visible; top: 19px; left: 0; width: 282px; height: 57px; z-index: 1000;}

span.tt-21813-layer-2 { border-color: #fff; border-radius: 0em; border-width: 0em; color: #@$@$@$; font-family: freight-text-pro; font-size: 1.8em; padding: 0em; white-space: nowrap; overflow: visible; top: 106px; left: 3px; width: 351px; height: 28px; z-index: 1000;}

span.tt-21813-layer-3 { border-color: #fff; border-radius: 0em; border-width: 0em; color: #c1c1c1; font-family: freight-text-pro; font-size: 3em; font-weight: 500; letter-spacing: 0.05em; padding: 0em; white-space: nowrap; overflow: visible; top: 94px; left: 348px; width: 118px; height: 48px; z-index: 1000; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg);}

span.tt-21813-layer-4 { border-color: #fff; border-radius: 0em; border-width: 0em; color: #c1c1c1; font-family: freight-text-pro; font-size: 12em; font-weight: 500; letter-spacing: -0.025em; padding: 0em; white-space: nowrap; overflow: visible; top: 0; left: 462px; width: 349px; height: 192px; z-index: 1000; -webkit-transform: rotate(-360deg); -moz-transform: rotate(-360deg); -ms-transform: rotate(-360deg); -o-transform: rotate(-360deg); transform: rotate(-360deg);}

Edited by squarelust
Initial Revision

Share this post


Link to post

1 answer to this question

Recommended Posts

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...