@font-face {
    font-family: 'Montserrat';
    src: url('../font/montserrat-regular.woff2') format('woff2'),
         url('../font/montserrat-regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'Montserrat';
    src: url('../font/montserrat-italic.woff2') format('woff2'),
         url('../font/montserrat-italic.woff') format('woff');
    font-weight: 400;
    font-style: italic;
}
@font-face {
    font-family: 'Montserrat';
    src: url('../font/montserrat-medium.woff2') format('woff2'),
         url('../font/montserrat-medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'Montserrat';
    src: url('../font/montserrat-mediumitalic.woff2') format('woff2'),
         url('../font/montserrat-mediumitalic.woff') format('woff');
    font-weight: 500;
    font-style: italic;
}
@font-face {
    font-family: 'Montserrat';
    src: url('../montserrat-black.woff2') format('woff2'),
         url('../font/montserrat-black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}
@font-face {
    font-family: 'Montserrat';
    src: url('../font/montserrat-blackitalic.woff2') format('woff2'),
         url('../font/montserrat-blackitalic.woff') format('woff');
    font-weight: 900;
    font-style: italic;
}
:root {
  font-size: 0.875em;
}
body {
	font-family: Montserrat, sans-serif;
}
h1 {
	font-size: 6.6rem;
	color: rgb(255, 234, 128);
	font-weight: 900;
  font-style: italic;
  text-transform: uppercase;
  padding: 0.4em 0em;
  text-shadow: -1px 1px 8px rgba(0,0,0,0.7);
}
h2 {
  font-size: 2.2rem;
  color: rgb(250,250,250);
  font-weight: 500;
  line-height: 1.6; 
  background-color: rgba(0,0,0,0.4);
  padding: 1em;
  border-radius: 1em;
}
h3 {
  font-size: 1.8rem;
  color: rgb(50,150,220);
  font-weight: 500;
  line-height: 1.4;
  text-shadow: -1px 1px 6px rgba(0,0,0,0.7);
}
h4 {
  font-size: 1.6rem;
  color: rgb(250,250,250);
  font-weight: 500;
  line-height: 1.6;
  background-color: rgba(0,0,0,0.4);
  padding: 1em;
  border-radius: 1em;
}
a {
  font-size: 1.2rem;
  font-weight: 400;
  line-height: 1.3;
  color: #bdbdbd;
  text-decoration: none;
}
p {
  font-size: 1.3rem;
  font-weight: 400;
  line-height: 1.3;
  color: #bdbdbd;
}
span {
  color: rgb(50,150,220);
  font-size: 1.8rem;
}

@media screen and (max-width: 45em) {
h1 {
  font-size: 3.8rem;
  color: rgb(255, 234, 128);
  font-weight: 900;
  font-style: italic;
  text-transform: uppercase;
  padding: 0.4em 0em;
  text-shadow: -1px 1px 8px rgba(0,0,0,0.7);
}
h2 {
  font-size: 1.6rem;
  color: rgb(250,250,250);
  font-weight: 500;
  line-height: 1.6; 
}
h3 {
  font-size: 1.4rem;
  color: rgb(50,150,220);
  font-weight: 500;
  line-height: 1.4;
}
h4 {
  font-size: 1.2rem;
  color: rgb(250,250,250);
  font-weight: 500;
  line-height: 1.6; 
}
p {
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.28;
  color: #bdbdbd;
}
a {
  font-size: 1.1rem ;
  font-weight: 400;
  line-height: 1.2;
  color: #bdbdbd;
  text-decoration: none;
}
}