redbadger/website-honestly

/**
* Licensing fonts from 2 independent providers
*/

/**
 * @license
 * MyFonts Webfont Build ID 3286567, 2016-09-22T07:01:50-0400
 *
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are
 * explicitly restricted from using the Licensed Webfonts(s).
 *
 * You may obtain a valid license at the URLs below.
 *
 * Webfont: ProximaNova-Bold by Mark Simonson
 * URL: http://www.myfonts.com/fonts/marksimonson/proxima-nova/bold/
 *
 * Webfont: ProximaNova-Light by Mark Simonson
 * URL: http://www.myfonts.com/fonts/marksimonson/proxima-nova/light/
 *
 *
 * License: http://www.myfonts.com/viewlicense?type=web&buildid=3286567
 * Licensed pageviews: 1,000,000
 * Webfonts copyright: Copyright (c) Mark Simonson, 2005. All rights reserved.
 *
 * © 2016 MyFonts Inc
*/

/*
  Copyright (C) 2011-2016 Hoefler & Co.
  This software is the property of Hoefler & Co. (H&Co).
  Your right to access and use this software is subject to the
  applicable License Agreement, or Terms of Service, that exists
  between you and H&Co. If no such agreement exists, you may not
  access or use this software for any purpose.
  This software may only be hosted at the locations specified in
  the applicable License Agreement or Terms of Service, and only
  for the purposes expressly set forth therein. You may not copy,
  modify, convert, create derivative works from or distribute this
  software in any way, or make it accessible to any third party,
  without first obtaining the written permission of H&Co.
  For more information, please visit us at http://typography.com.
  296519-110129-20160915
*/

/* Impressions counter required by the license */

@value mediumScreen, largeScreen from "../_sizes.css";
@import url('//hello.myfonts.net/count/322627');
@import url('https://fonts.googleapis.com/css?family=Raleway:400,700&display=swap');

@font-face {
  font-family: 'ProximaNova-Bold';
  src: url('./fonts/322627_0_0.woff2') format('woff2'),
    url('./fonts/322627_0_0.woff') format('woff'), url('./fonts/322627_0_0.ttf') format('truetype');
  font-weight: bold;
}

@font-face {
  font-family: 'ProximaNova-Light';
  src: url('./fonts/322627_1_0.woff2') format('woff2'),
    url('./fonts/322627_1_0.woff') format('woff'), url('./fonts/322627_1_0.ttf') format('truetype');
}

.serif {
  font-family: 'Sentinel A', 'Sentinel B', Georgia, serif;
  font-weight: 800;
}

.lightSerif {
  font-family: 'Sentinel A', 'Sentinel B', Georgia, serif;
  font-weight: 300;
}

.sansSerif {
  font-family: 'ProximaNova-Light', sans-serif;
}

.boldSansSerif {
  font-family: 'ProximaNova-Bold', sans-serif;
}

.fontXL {
  font-size: 40px;
  line-height: 1.1em;
}

.fontL {
  font-size: 30px;
  line-height: 1.2em;
}

.fontM,
.fontStaticM {
  font-size: 24px;
  line-height: 1.2em;
}

.fontM2,
.fontStaticM2 {
  font-size: 20px;
  line-height: 1.2em;
}

.fontS2 {
  font-size: 20px;
  line-height: 1.35em;
}

.fontS {
  font-size: 16px;
  line-height: 1.2em;
}

.fontXS {
  font-size: 16px;
  line-height: 1.5em;
}

@media mediumScreen {
  .fontXL {
    font-size: 60px;
  }

  .fontL {
    font-size: 40px;
    line-height: 1.1em;
  }

  .fontM2 {
    font-size: 30px;
  }

  .fontM,
  .fontStaticM {
    font-size: 30px;
  }

  .fontS2 {
    font-size: 20px;
    line-height: 1.35em;
  }

  .fontS {
    font-size: 24px;

    &.serif {
      line-height: 1.2em;
    }

    &.sansSerif {
      line-height: 1.5em;
    }
  }
}

@media largeScreen {
  .fontXL {
    font-size: 90px;
    line-height: 1em;
  }

  .fontL {
    font-size: 60px;
  }

  .fontM {
    font-size: 40px;
    line-height: 1.1em;
  }

  .fontM2 {
    font-size: 30px;
    line-height: 1.2em;
  }
}