/* Base Styles -------------------- */
* {
  box-sizing: border-box; }

body {
  font-size: 1em;
  line-height: 1.5;
  color: #878787;
  margin: 0;
  font: "Helvetica Neue", Helvetica, Arial, sans-serif; }

h1,
h2 {
  font-family: "Abolition Regular", Helvetica, Arial, sans-serif; }

h2 {
  font-size: 3.3125em;
  line-height: 1.1;
  font-weight: normal;
  margin: 0 0 .5em; }

h3 {
  font-size: 1.25em;
  line-height: 1.2;
  color: #48525c;
  margin-bottom: 1.7em; }

img {
  max-width: 100%;
  margin-bottom: 20px;
  border-radius: 10px; }

ul,
ol {
  margin: 30px 0; }

li {
  margin-bottom: 10px; }

/* Pseudo-classes ------------------ */
a:link {
  color: #ffa949;
  text-decoration: none; }
a:visited {
  color: #add8e6; }
a:hover {
  color: rgba(255, 169, 73, 0.5); }

.main-header {
  padding-top: 170px;
  height: 850px;
  background: linear-gradient(#ffa949, transparent 90%), linear-gradient(0deg, #fff, transparent), #ffa949 url("../img/mountains.jpg") no-repeat center;
  background-size: cover; }
  @media (max-width: 786px) {
    .main-header {
      max-height: 380px;
      padding: 50px 25px 0; } }

.main-footer {
  padding-top: 60px;
  padding-bottom: 60px;
  border-bottom: 10px solid #ffa949; }
  @media (max-width: 786px) {
    .main-footer {
      padding: 20px 0; } }

.primary-content {
  padding-top: 25px;
  padding-bottom: 95px; }
  @media (max-width: 786px) {
    .primary-content {
      width: 100% !important;
      padding: 20px;
      border-top: none; } }
  @media (max-width: 1024px) {
    .primary-content {
      width: 90% !important; } }

.secondary-content {
  padding-top: 80px;
  padding-bottom: 70px;
  border-bottom: 2px solid #dfe2e6; }
  @media (max-width: 786px) {
    .secondary-content {
      width: 100% !important;
      padding: 20px;
      border-top: none; } }
  @media (max-width: 1024px) {
    .secondary-content {
      width: 90% !important; } }

.wildlife {
  color: white;
  text-align: left;
  padding: 18% 24%;
  border-top: 10px solid #ffa949;
  margin: 105px 0 60px;
  background: #434a52 url("../img/bear.jpg") no-repeat center;
  background-size: cover;
  box-shadow: inset 0 0 50px 10px rgba(0, 0, 0, 0.8);
  border-radius: 10px; }
  @media (max-width: 1024px) {
    .wildlife {
      padding: 10% 12%;
      margin: 50px 0 20px; } }

.tips {
  float: left; }
  @media (max-width: 786px) {
    .tips {
      float: none;
      width: 100% !important; } }

.resorts {
  float: right; }
  @media (max-width: 786px) {
    .resorts {
      float: none;
      width: 100% !important; } }

.main-header, .main-footer, .primary-content {
  text-align: center; }

.primary-content, .secondary-content {
  border-top: 2px solid #dfe2e6; }

.primary-content, .secondary-content {
  width: 75%;
  padding-left: 50px;
  padding-right: 50px;
  margin: auto;
  max-width: 960px; }

.tips, .resorts {
  width: 46.5%; }

.secondary-content:after {
  content: "";
  display: table;
  clear: both; }

/* Web Fonts -------------------- */
@font-face {
  font-family: "Abolition Regular";
  src: url("../fonts/abolition-regular-webfont.eot");
  src: url("../fonts/abolition-regular-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/abolition-regular-webfont.woff") format("woff"), url("../fonts/abolition-regular-webfont.ttf") format("truetype"); }
.main-heading {
  font-size: 5.625rem;
  line-height: 1.3;
  font-weight: normal;
  color: #fff;
  text-transform: uppercase;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.8);
  margin: 12px 0 0; }
  @media (max-width: 786px) {
    .main-heading {
      font-size: 5rem;
      line-height: 1.1; } }
.main-title {
  font-size: 1.625rem;
  font-weight: 200;
  color: #fff;
  letter-spacing: .065em;
  border-bottom: 2px solid;
  padding-bottom: 10px; }
  @media (max-width: 786px) {
    .main-title {
      font-size: 1.3rem;
      border: none; } }

.intro {
  font-size: 1.25em;
  line-height: 1.6;
  color: initial; }
  @media (max-width: 786px) {
    .intro {
      font-size: 1rem; } }

.callout {
  font-size: 1.25em;
  border-bottom: 3px solid #ffa949;
  padding: 0 9px 3px;
  margin-top: 20px;
  display: inline-block; }

.arrow {
  width: 50px;
  margin-top: 150px; }
  @media (max-width: 786px) {
    .arrow {
      display: none; } }

/*# sourceMappingURL=application.css.map */