@import "~Breakpoints";
@import "~Colors";
@import "~Layout";
@import "~FontSize";

//@mixin fontSizer($minSize, $maxSize) {
//  $slope: $maxSize - $minSize;
//  font-size: calc(#{$slope} * 1vw + #{$minSize}rem);
//}
.content {
  @include container();
  & > *:first-child {
    margin-top: 0;
  }
  img[class*='userUpload'] {
    width: 100%;
    @include media-breakpoint-up(sm) {
      width: auto;
      max-width: 50%;
    }
    @include media-breakpoint-up(md) {
      max-width: 75%;
    }
    object-fit: contain;
  }
}

.header1 {
  font-family: $font-family-sans-serif;
  color: $brand-primary;
  font-weight: 300;
  text-transform: uppercase;
  margin-top: 5rem;
  letter-spacing: .2rem;
  line-height: 1;
  width: 100%;
  @include fontSizer(3);

}

.header2 {
  font-size: 2rem;
  font-weight: 500;
  letter-spacing:.2rem;
  text-transform: uppercase;
  color: $brand-secondary;
  margin-top: 5rem;


}

.content a:not([class*='button']), .link, .paraLink  {
  color:       $brand-secondary;
  font-weight: 300;
  &:hover {
    text-decoration: none;
  }
}

.content > a, .link  {
  font-family: $font-family-sans-serif;
  font-size: 1.6rem;
  text-transform: uppercase;
  letter-spacing: .1rem;
}

.content :not(blockquote) p:not(.subtitle),  .content p:not(.subtitle), .bodyCopy {
  margin-top:  3rem;
  line-height: 1.8;
  text-align:  justify;
  hyphens:     auto;
  @include media-breakpoint-up(sm) {
    hyphens: none;
  }
}

.content p:not([class*="callout"]), .bodyCopy {
  font-family: $font-family-sans-serif;
  margin-top: 3rem;
  line-height: 1.8;
}

.img {
  display: block;
  float: left;
  width: 100%;
  @include media-breakpoint-up(md) {
    width: 55%;
  }
  height: auto;
  padding-bottom: 3rem;
  margin-top: 3rem;
  margin-left: auto;
  margin-right: 2rem;
}

.content ul, .content ol, .ol, .ul {
  display: inline-block;
  vertical-align: text-top;
  width: 100%;
  margin-top: 3rem;
  @include media-breakpoint-up(md) {
    width: 50%;
  }
}
.content li, .li {
  p {
    margin: 0 !important;
  }
}
.map {
  width: 100%;
  height: 25rem;
  object-fit: cover;
}