/* Weights - 400/700 */
html {
  font-family: 'Barlow', sans-serif;
  color: #636363;
  line-height: 1.2; 
  font-weight: 300;
  font-style: normal;
  font-size: 100%; 
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

strong {
  font-weight: 600;
}

/* Global Links
---------------------------------- */

a {
  color: var(--lt-blue);
  text-decoration: none; 
  font-weight: 500;
}
  
a:focus, 
a:hover {
  color: var(--orange);
  outline: none;
}

/* Firefox Seleted Text
------------------------------------ */

*::-moz-selection,
*::selection {
  background: var(--dk-blue);
  color: var(--white);
}


/* Headings - 400/700
------------------------------------ */

h1, h2, h3 { 
  font-style: normal;
  font-weight: 700;
  color: var(--gray);
}

h1 {
  font-size: 175%;
  margin-bottom: .5em;
  line-height: 1;
}

@media only screen and (min-width: 360px)  { h1 { font-size: 200%; } }
@media only screen and (min-width: 740px)  { h1 { font-size: 225%; } }
@media only screen and (min-width: 1400px) { h1 { font-size: 250%; } }

h2 {
  font-size: 130%;
  line-height: 1;
  margin-bottom: .75em
}

@media only screen and (min-width: 740px)  { h2 { font-size: 160%; } }

h3 {
  font-size: 120%;
  line-height: 1;
  margin-bottom: .5em
}

@media only screen and (min-width: 740px)  { h3 { font-size: 140%; } }

h4 {
	font-size: 110%;
	margin-bottom: .5em
}

h1 a,
h2 a { display: inline-block; }



/* Text Elements
---------------------------------- */

p { 
	margin: 0 0 1em; 
}

p:last-child { 
  margin-bottom: 0; 
}

em { font-style: italic; }

small { 
  font-size: 85%; 
  display: block; 
}
.meta small { 
  text-transform: uppercase; 
  padding-bottom: .75em;
}
blockquote {
  font-weight: 300; 
}
strong { 
  font-weight: 600;
}

sup { 
  vertical-align: super;
  font-size: smaller;
}

.footnotes { 
  font-size: smaller;
  padding-top: 1.5em;
}


/* Lists
---------------------------------- */
main ul,
section ul,
main ol,
section ol      { margin: 0 0 1.5em 2em; }

main li,
section li      { margin-bottom:.25em; }


@font-face {
  font-family: 'Trilogy-Icons';
  src:  url('https://s3.amazonaws.com/icomoon.io/31537/Trilogy/Trilogy-Icons.eot?4ywpzi');
  src:  url('https://s3.amazonaws.com/icomoon.io/31537/Trilogy/Trilogy-Icons.eot?4ywpzi#iefix') format('embedded-opentype'),
    url('https://s3.amazonaws.com/icomoon.io/31537/Trilogy/Trilogy-Icons.woff2?4ywpzi') format('woff2'),
    url('https://s3.amazonaws.com/icomoon.io/31537/Trilogy/Trilogy-Icons.ttf?4ywpzi') format('truetype'),
    url('https://s3.amazonaws.com/icomoon.io/31537/Trilogy/Trilogy-Icons.woff?4ywpzi') format('woff'),
    url('https://s3.amazonaws.com/icomoon.io/31537/Trilogy/Trilogy-Icons.svg?4ywpzi#Trilogy-Icons') format('svg');
  font-weight: normal;
  font-style: normal;
}

.icons {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'Trilogy-Icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
