title: Font not rendering in Safari or mobile browsers
body: <p>Having issues with my custom MyFonts font rendering in Safari and mobile browsers. Chrome and Firefox are fine.</p>
  
  <p>Font files and MyFontsWebfontsKit.css files are in the right place, with the files called correctly in the master stylesheet. Font files include .eot .woff. woff2 .ttf .svg.</p>
  
  <p>URL: <a href="http://geltor.com" rel="nofollow noreferrer">http://geltor.com</a></p>
  
  <p>The correct font shows up in Chrome and Safari on my Mac, but Safari and all mobile browsers default to the sans-serif backup. Would appreciate any pointers on getting the correct Brasley font to display everywere. Thanks!</p>
  
  <p>MyFontsWebfontsKit.css:</p>
  
  <pre><code>@import url("//hello.myfonts.net/count/391209");
  
  
  @font-face {font-family: 'Brasley-Bold';src: url('webfonts/391209_0_0.eot');src: url('webfonts/391209_0_0.eot?#iefix') format('embedded-opentype'),url('webfonts/391209_0_0.woff2') format('woff2'),url('webfonts/391209_0_0.woff') format('woff'),url('webfonts/391209_0_0.ttf') format('truetype'),url('webfonts/3927A3_A_0.svg') format('svg');}
  
  
  @font-face {font-family: 'Brasley-Light';src: url('webfonts/391209_1_0.eot');src: url('webfonts/391209_1_0.eot?#iefix') format('embedded-opentype'),url('webfonts/391209_1_0.woff2') format('woff2'),url('webfonts/391209_1_0.woff') format('woff'),url('webfonts/391209_1_0.ttf') format('truetype'),url('webfonts/3927A3_2_0.svg') format('svg');}
  
  
  @font-face {font-family: 'Brasley-Thin';src: url('webfonts/391209_2_0.eot');src: url('webfonts/391209_2_0.eot?#iefix') format('embedded-opentype'),url('webfonts/391209_2_0.woff2') format('woff2'),url('webfonts/391209_2_0.woff') format('woff'),url('webfonts/391209_2_0.ttf') format('truetype'),url('webfonts/3927A3_0_0.svg') format('svg');}
  
  
  @font-face {font-family: 'Brasley-BoldItalic';src: url('webfonts/391209_3_0.eot');src: url('webfonts/391209_3_0.eot?#iefix') format('embedded-opentype'),url('webfonts/391209_3_0.woff2') format('woff2'),url('webfonts/391209_3_0.woff') format('woff'),url('webfonts/391209_3_0.ttf') format('truetype'),url('webfonts/3927A3_B_0.svg') format('svg');}
  
  
  @font-face {font-family: 'Brasley-Medium';src: url('webfonts/391209_4_0.eot');src: url('webfonts/391209_4_0.eot?#iefix') format('embedded-opentype'),url('webfonts/391209_4_0.woff2') format('woff2'),url('webfonts/391209_4_0.woff') format('woff'),url('webfonts/391209_4_0.ttf') format('truetype'),url('webfonts/3927A3_6_0.svg') format('svg');}
  
  
  @font-face {font-family: 'Brasley-LightItalic';src: url('webfonts/391209_5_0.eot');src: url('webfonts/391209_5_0.eot?#iefix') format('embedded-opentype'),url('webfonts/391209_5_0.woff2') format('woff2'),url('webfonts/391209_5_0.woff') format('woff'),url('webfonts/391209_5_0.ttf') format('truetype'),url('webfonts/3927A3_3_0.svg') format('svg');}
  
  
  @font-face {font-family: 'Brasley-ThinItalic';src: url('webfonts/391209_6_0.eot');src: url('webfonts/391209_6_0.eot?#iefix') format('embedded-opentype'),url('webfonts/391209_6_0.woff2') format('woff2'),url('webfonts/391209_6_0.woff') format('woff'),url('webfonts/391209_6_0.ttf') format('truetype'),url('webfonts/3927A3_1_0.svg') format('svg');}
  
  
  @font-face {font-family: 'Brasley-SemiBold';src: url('webfonts/391209_7_0.eot');src: url('webfonts/391209_7_0.eot?#iefix') format('embedded-opentype'),url('webfonts/391209_7_0.woff2') format('woff2'),url('webfonts/391209_7_0.woff') format('woff'),url('webfonts/391209_7_0.ttf') format('truetype'),url('webfonts/3927A3_8_0.svg') format('svg');}
  
  
  @font-face {font-family: 'Brasley-Regular';src: url('webfonts/391209_8_0.eot');src: url('webfonts/391209_8_0.eot?#iefix') format('embedded-opentype'),url('webfonts/391209_8_0.woff2') format('woff2'),url('webfonts/391209_8_0.woff') format('woff'),url('webfonts/391209_8_0.ttf') format('truetype'),url('webfonts/3927A3_4_0.svg') format('svg');}
  
  
  @font-face {font-family: 'Brasley-MediumItalic';src: url('webfonts/391209_9_0.eot');src: url('webfonts/391209_9_0.eot?#iefix') format('embedded-opentype'),url('webfonts/391209_9_0.woff2') format('woff2'),url('webfonts/391209_9_0.woff') format('woff'),url('webfonts/391209_9_0.ttf') format('truetype'),url('webfonts/3927A3_7_0.svg') format('svg');}
  
  
  @font-face {font-family: 'Brasley-SemiBoldItalic';src: url('webfonts/391209_A_0.eot');src: url('webfonts/391209_A_0.eot?#iefix') format('embedded-opentype'),url('webfonts/391209_A_0.woff2') format('woff2'),url('webfonts/391209_A_0.woff') format('woff'),url('webfonts/391209_A_0.ttf') format('truetype'),url('webfonts/3927A3_9_0.svg') format('svg');}
  
  
  @font-face {font-family: 'Brasley-RegularItalic';src: url('webfonts/391209_B_0.eot');src: url('webfonts/391209_B_0.eot?#iefix') format('embedded-opentype'),url('webfonts/391209_B_0.woff2') format('woff2'),url('webfonts/391209_B_0.woff') format('woff'),url('webfonts/391209_B_0.ttf') format('truetype'),url('webfonts/3927A3_5_0.svg') format('svg');}
  </code></pre>
  
  <p>Style.css excerpt:</p>
  
  <pre><code>&lt;style&gt;
  p, h2, h3, h4, h5, a {
  color:#1a2f5a;
  font-family: "Brasley", sans-serif !important;
  font-size: 1em;
  line-height: 1.25em;
  -webkit-font-smoothing: antialiased;
  }
  
  article .title-link a {
      color: #1a2f5a;
  }
  
  .bbx-bullet-link.type-2 {
      color: #1a2f5a;
  }
  
  .Brasley-Bold { 
      font-family: Brasley-Bold;
      font-weight: normal;
      font-style: normal;
  }
  .Brasley-Light { 
      font-family: Brasley-Light;
      font-weight: normal;
      font-style: normal;
  }
  .Brasley-Thin { 
      font-family: Brasley-Thin;
      font-weight: normal;
      font-style: normal;
  }
  .Brasley-BoldItalic { 
      font-family: Brasley-BoldItalic;
      font-weight: normal;
      font-style: normal;
  }
  .Brasley-Medium { 
      font-family: Brasley-Medium;
      font-weight: normal;
      font-style: normal;
  }
  .Brasley-LightItalic { 
      font-family: Brasley-LightItalic;
      font-weight: normal;
      font-style: normal;
  }
  .Brasley-ThinItalic { 
      font-family: Brasley-ThinItalic;
      font-weight: normal;
      font-style: normal;
  }
  .Brasley-SemiBold { 
      font-family: Brasley-SemiBold;
      font-weight: normal;
      font-style: normal;
  }
  .Brasley-Regular { 
      font-family: Brasley-Regular;
      font-weight: normal;
      font-style: normal;
  }
  .Brasley-MediumItalic { 
      font-family: Brasley-MediumItalic;
      font-weight: normal;
      font-style: normal;
  }
  .Brasley-SemiBoldItalic { 
      font-family: Brasley-SemiBoldItalic;
      font-weight: normal;
      font-style: normal;
  }
  .Brasley-RegularItalic { 
      font-family: Brasley-RegularItalic;
      font-weight: normal;
      font-style: normal;
  }
  
  
  .colorblock-dblue {color: white; background-color: #1a2f5a; padding:1em; width: 200px; margin-bottom: 1em;}
  
  .colorblock-mblue {color: white; background-color: #515d7d; padding:1em; width: 200px; margin-bottom: 1em;}
  
  .colorblock-lblue {color: white; background-color: #c2c9d3; padding:1em; width: 200px; margin-bottom: 1em;}
  
  .colorblock-pink {color: white; background-color: #fee9df; padding:1em; width: 200px; margin-bottom: 1em;}
  
  .colorblock-dpink {color: white; background-color: #CF7475; padding:1em; width: 200px; margin-bottom: 1em;}
  
  body {color:#1a2f5a; font-family: "Brasley-Regular", sans-serif;  font-size: 1em; line-height: 1.25em; -webkit-font-smoothing: antialiased;}
  
  a {color: inherit;}
  
  a:hover {color: #CF7475; text-decoration: none;}
  
  .menuitem {font-size: 1em; text-transform: uppercase; letter-spacing: .5em !important;}
  
  .header-headline {font-size: 2.5em; line-heght: 3em; line-height: 1.25em; font-family: "Brasley-Medium", sans-serif;}
  
  .header-body {font-size: 1.25em; line-height: 1.8em;}
  
  .bluebox {background-color: #515d7d; padding: 1em; }
  
  .bluebox-headline {font-size: 1.25em; line-height: 1.25em; font-family: "Brasley-Regular"; text-transform: uppercase; letter-spacing: .25em; color:#fee9df; }
  
  .bluebox-body {color:#fee9df; line-height: 1.8em;}
  
  .section-title {font-size: 1.25em; line-height: 1.5em; font-family: Brasley-Bold; text-transform: uppercase; letter-spacing: .25em;}
  
  .section-headline-dblue {font-size: 3em; line-height: 1.25em; font-family: "Brasley-Medium";}
  
  .section-headline-mblue {font-size: 3em; line-height: 1.25em; font-family: "Brasley-Medium"; color: #515d7d;}
  
  .section-headline-dpink {font-size: 3em; line-height: 1.25em; font-family: "Brasley-Medium"; color:#CF7475;}
  
  .section-subhead {font-family: "Brasley-Bold";}
  
  .body-dblue {color:#1a2f5a;}
  
  .body-mblue {color: #515d7d;}
  
  .CTA {font-family: "Brasley-Medium";}
  
  .Button-dblue {color:#fee9df; padding:.5em; padding-bottom: .4em; width: 200px; background-color: #1a2f5a; text-align: center; text-transform: uppercase; letter-spacing: .5em;  }
  
  .Button-mblue {color:#fee9df; padding:.5em; padding-bottom: .4em; width: 200px; background-color: #515d7d; text-align: center; text-transform: uppercase; letter-spacing: .5em;  }
  
  .legal {font-size: .75em; color:#515d7d;}
  
  .footer {background-color: #2E4368; padding: 1em;}
  
  .footer-menutitle {text-transform: uppercase; letter-spacing: .5em; font-family: "Brasley-Bold"; color: #fee9df; }
  
  .footer-menuitem { font-size: .85em; color: #fee9df;}
  &lt;/style&gt;
  </code></pre>