
/* South Park LA Purchased Fonts */

@font-face {
  font-family: 'SP Alte Haas Grotesk';
  font-weight: 400;
  font-style: normal;
  font-display: swap; 
  src: url('//ctycms.com/ca-south-park-la/_fonts/altehaasgroteskregular-webfont.woff2') format('woff2'), 
  url('//ctycms.com/ca-south-park-la/_fonts/altehaasgroteskregular-webfont.woff') format('woff');
}

@font-face {
  font-family: 'SP Alte Haas Grotesk';
  font-weight: 700;
  font-style: normal;
  font-display: swap; 
  src: url('//ctycms.com/ca-south-park-la/_fonts/altehaasgroteskbold-webfont.woff2') format('woff2'), 
  url('//ctycms.com/ca-south-park-la/_fonts/altehaasgroteskbold-webfont.woff') format('woff');
}

@font-face {
  font-family: 'SP Feature Display';
  font-weight: 400;
  font-style: normal;
  font-display: swap; 
  src: url('//ctycms.com/ca-south-park-la/_fonts/FeatureDisplay-Regular-Web.woff2') format('woff2'), 
  url('//ctycms.com/ca-south-park-la/_fonts/FeatureDisplay-Regular-Web.woff') format('woff');
}

/* Typography */

html {
  font-size: 16px; /* 16 is default for most browsers*/
}
@media screen and (min-width: 320px) {
  html { font-size: 110%; }
}
@media screen and (min-width: 992px) {
  html { font-size: 115%; }
}
@media screen and (min-width: 1200px) {
  html { font-size: 120%; }
}
@media screen and (min-width: 1400px) {
  html { font-size: 130%; }
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  line-height:1.5;
  font-family: 'SP Alte Haas Grotesk', sans-serif; 
  /*xword-break: break-all;
  xhyphens: auto;*/
}

.serif { font-family: 'SP Feature Display',serif; }

/* global typography */

h1,h2,h3,h4,h5,h6 { text-wrap:balance; color:inherit; font-weight:400; letter-spacing:-0.100rem; }

h1 { font-size: 3.6em; line-height:1.1; font-weight:400; margin-top:0px; margin-bottom: 1rem; text-transform:uppercase; }
h2 { font-size: 3.2rem; line-height:1.1; font-weight:400; margin-top:0rem; margin-bottom: 1rem; text-transform:uppercase; }
h3 { font-family: 'SP Feature Display',serif; font-size: 1.618rem; line-height:1.3; font-weight:400; letter-spacing:0rem; margin-bottom: 1rem; } 

@media all and (max-width: 768px) {
  h2.shrink-mobile { font-size:2.8rem; }
}

@media all and (min-width: 992px) {
  h1 { font-size:7rem; }
  h2 { font-size:5rem; }
  h3 { font-size:2rem; }
}

p, li { font-size:1rem; }
li { margin-bottom:0.25rem; } /* differentiate between line height and list items */
p.intro,p.lead { font-weight:inherit; font-size:1.2rem; }

hr { margin-top: 1rem; margin-bottom: 1rem; border: 0; border-top-color: currentcolor; border-top-style: none; border-top-width: 0px; border-top: 1px solid rgba(0,0,0,.1); opacity:1; }

a { color:inherit; text-decoration:underline; }
a:hover { color:inherit; text-decoration:underline; }

