/**
 * Custom styles for Healing Hearth: Garden Harvest
 */
/*
 @font-face {
 font-family: "lucida_calligraphyitalic";
 src: url("../fonts/lucida_calligraphy_italic-webfont.woff2") format("woff2"),
 url("../fonts/lucida_calligraphy_italic-webfont.woff") format("woff");
 font-weight: normal;
 font-style: normal;
 }
 */
/*
 @font-face {
 font-family: "Georgia";
 src: url("../fonts/georgia-bold.ttf") format("ttf");
 font-weight: bold;
 font-style: normal;
 }
 */
/* https://www.kirupa.com/html5/ken_burns_effect_css.htm */
@keyframes kenburns {
  0% {
    opacity: 0;
    transform: translate3d(-45px, 0px, 0px);
  }
  5% {
    opacity: 1;
  }
  98% {
    transform: scale3d(1.08, 1.08, 1.08) translate3d(45px, -25px, 0px);
    animation-timing-function: ease-in;
    opacity: 1;
  }
  100% {
    transform: scale3d(2, 2, 2) translate3d(170px, -100px, 0px);
    opacity: 0;
  }
}
/** keyframe animation from https://tympanus.net/codrops/2013/04/30/text-opening-sequence-with-css-animations/ **/
@keyframes OpeningSequence {
  0% {
    text-shadow: 0 0 50px #fff;
    letter-spacing: 80px;
    opacity: 0.2;
    transform: rotateY(-90deg);
  }
  50% {
    text-shadow: 0 0 5px #fff;
    letter-spacing: 14px;
    opacity: 0.8;
    transform: rotateY(0deg);
  }
  85% {
    text-shadow: 0 0 15px #fff;
    opacity: 0.8;
    color: #fc6621;
    transform: rotateY(0deg) translateZ(100px);
  }
  100% {
    color: #fc6621;
    text-shadow: 0 0 30px #fff;
    opacity: 1;
    transform: rotateY(0deg) translateZ(100px);
  }
}
@keyframes FadeIn {
  0% {
    text-shadow: 0 0 50px #fff;
    opacity: 0.1;
    transform: scale(0.5);
  }
  50% {
    opacity: 0.4;
    color: #fc6621;
  }
  85% {
    opacity: 0.8;
    transform: scale(1);
  }
  100% {
    color: #fc6621;
    text-shadow: 0 0 30px #fff;
    opacity: 1;
    transform: scale(1);
  }
}
.os-phrases {
  height: 300px;
  width: 100vw;
  position: relative;
  /*
   h1#site-title > span > span {
   display: inline-block;
   perspective: 1000px;
   transform-origin: 50% 50%;
   margin: 0 3px;
   }
   h1#site-title > span > span > span {
   display: inline-block;
   color: hsla(0,0%,0%,0);
   transform-style: preserve-3d;
   transform: translate3d(0,0,0);
   animation: OpeningSequence 4s linear forwards;
   }
   h1#site-title span.word2 > span > span {
   animation-delay: 1.5s;
   }
   h1#site-title span.word3 > span > span {
   animation-delay: 3s;
   }
   */
}
.os-phrases h1#site-title {
  color: #fc6621 !important;
  text-shadow: 0 0 30px #fff;
  font-weight: 900;
  height: 100%;
  width: 32.5rem !important;
  overflow: hidden;
  text-transform: uppercase;
  padding: 0;
  margin: 0;
  position: absolute;
  top: 40%;
  right: 12vw;
  text-align: center;
  font-size: 3.9rem;
}
.os-phrases h1#site-title, .os-phrases h1#site-title > span {
  height: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin: 0 5px;
}
.os-phrases h1#site-title span {
  opacity: 0;
  animation: FadeIn 1.5s linear forwards;
}
.os-phrases h1#site-title span.word2 {
  animation-delay: 1s;
}
.os-phrases h1#site-title span.word3 {
  animation-delay: 2s;
}
/** menu blur taken from https://tympanus.net/Tutorials/BlurMenu/index2.html# **/
#menu-primary {
  position: fixed;
  top: 1.5rem;
  right: 0rem;
  z-index: 100;
  padding: 0;
  background: transparent;
  float: right;
}
#menu-primary .menu-items {
  /*
   &:hover li a {
   color: transparent;
   text-shadow: 0px 0px 3px #fff;
   background: rgba(88,22,22,0.2);
   transform: skew(0deg);
   }
   */
  /*
   li a:hover {
   text-shadow: 1px 1px 10px rgba(89,22,20,0.6);
   color: $accentColor;
   background: rgba($fontColor,0.45);
   }
   */
}
#menu-primary .menu-items li {
  display: block;
}
#menu-primary .menu-items li a {
  display: block;
  text-transform: uppercase;
  text-shadow: 1px 1px 2px rgba(37, 33, 32, 0.75);
  color: #fc6621;
  letter-spacing: 1px;
  font-size: clamp(14px, 3vw, 20px);
  font-weight: 600;
  /* for blur effect */
  /*
   background: rgba(255,255,255,0.25);
   transform: skew(-12deg);
   transition: all 0.4s ease-in-out;
   */
}
#menu-primary .menu-items li.active a {
  color: #fffff5;
}
@media only screen and (min-width: 540px) {
  #menu-primary {
    top: 0;
  }
  #menu-primary #menuWrapper {
    top: 0;
    opacity: 1;
    transition: 400ms;
  }
  #menu-primary #menuWrapper.hide {
    opacity: 0;
  }
  #menu-primary .menu-toggle {
    display: none;
  }
  #menu-primary .wrap {
    display: block !important;
  }
  #menu-primary .menu-items {
    margin-bottom: 0;
  }
  #menu-primary .menu-items li {
    float: left;
    margin-right: 0;
    width: auto;
  }
  #menu-primary .menu-items li a {
    background: none;
    border: none;
    padding: 1em 0.6em 0;
    margin-right: 0;
  }
  #menu-primary .menu-items li a:hover {
    background: none;
  }
}
dark {
  border-bottom-color: #fc6621;
  border-top-color: #222702;
  border-right-color: #3e0205;
  background: #fc6621;
  color: #110009;
}
article.light {
  color: #fff;
  text-shadow: 0 0 3px #000;
}
article.light h1, article.light h2, article.light h3, article.light h4, article.light h5 {
  color: #fff;
}
html, #container > .wrap, #reply-title small a, .whistles-tabs .whistles-tabs-nav li[aria-selected="true"] a {
  background: #263747;
}
#container #wrap {
  max-width: 100vw;
  width: 100vw;
  margin-bottom: 0;
  overflow: hidden;
}
#container #wrap #main #content {
  max-width: 1175px;
  margin: 0 auto;
}
.custom-background.layout-1c-narrow #container #wrap #main #content {
  max-width: 950px;
}
.custom-background #container > .wrap {
  background: transparent;
  color: #fff;
  margin-top: 0;
}
.custom-background #container > .wrap p {
  line-height: 1.5;
}
body, .media-shortcode-extend .media-info, .wp-playlist-dark .wp-playlist-item {
  color: #fff;
}
body.custom-background {
  background-attachment: fixed;
}
h1, h2, h3, h4, h5, h5, .entry h1, .entry h2, .entry h3, .entry h4, .entry h5, .entry-title, .entry-title a {
  font-family: 'Open Sans', Arial, sans-serif;
  font-weight: 400;
  color: #fff;
}
#site-title {
  font-family: Georgia, serif !important;
  font-weight: bold;
  position: fixed;
  top: 5rem;
  z-index: 1;
}
#site-title a {
  text-shadow: 0 0 50px #fff;
  color: #fc6621;
}
#site-title span {
  display: block;
}
#site-title span.word1, #site-title span.word2, #site-title span.word3 {
  position: absolute;
}
#site-title span.word1 {
  top: -5rem;
  left: 0;
}
#site-title span.word2 {
  top: 0rem;
  left: 4.5rem;
}
#site-title span.word3 {
  top: 5rem;
  left: 9rem;
}
#site-title sup {
  bottom: 0.6em;
  font-size: 0.4em;
  left: 0.2rem;
}
#site-title.persistent span:nth-of-type(2) {
  padding-left: 2rem;
}
#site-title.persistent span:nth-of-type(3) {
  padding-left: 4rem;
}
#site-description {
  position: fixed;
  top: 14.5rem;
  color: #fc6621;
}
.entry-content a {
  color: #fc6621;
}
a:hover, a:focus {
  text-decoration: none;
}
.font-primary, body, input, textarea, .label-checkbox, .label-radio, .required, #site-description, #reply-title small, .font-headlines {
  font-family: 'Open Sans', Arial, sans-serif;
}
blockquote, blockquote a:hover, blockquote a:focus, .entry-content blockquote a:hover, .entry-content blockquote a:focus, .wp-calendar td.has-posts a, input[type="submit"], input[type="reset"], input[type="button"], button, #menu-primary .menu-toggle button:hover, #menu-primary .menu-toggle button:focus, #menu-primary li.current-menu-item > a, #menu-primary li a:hover, #menu-primary li a:focus, #menu-secondary li li a:hover, #menu-secondary li li a:focus, #menu-sub-terms li a, .page-links a, .page-links a:hover, .page-links a:focus, .widget-title > .wrap, .widget-title > .wrap a, #comments-number > .wrap, #reply-title > .wrap, .attachment-meta-title > .wrap, .comment-reply-link, .comment-reply-login, .comment-reply-link:hover, .comment-reply-link:focus, .comment-reply-login:hover, .comment-reply-login:focus, .media-shortcode-extend a, .media-shortcode-extend a:hover, .media-shortcode-extend a:focus, .media-info-toggle, .entry-content .media-info-toggle, .mejs-time .mejs-currenttime, .mejs-time .mejs-duration, .mejs-volume-button .mejs-volume-slider .mejs-volume-current, .mejs-volume-button .mejs-volume-slider .mejs-volume-handle, .media-info-toggle:hover, .media-info-toggle:focus, .mejs-overlay-play .mejs-overlay-button::after, .mejs-time-rail .mejs-time-float, .wp-playlist-dark .wp-playlist-playing, .wp-playlist-dark .wp-playlist-caption:hover, .wp-playlist-dark .wp-playlist-caption:focus, .wp-playlist-dark .wp-playlist-item:hover .wp-playlist-dark .wp-playlist-item:focus, .skip-link .screen-reader-text:focus {
  color: #fffff5;
}
#menuWrapper {
  position: relative;
  top: 4rem;
}
/*
 #menu-primary, #menu-primary .search-form > div {
 background-color: $trimColor;
 }
 */
#footer {
  background: transparent;
}
.home #footer, .contact #footer {
  display: none;
}
#footer a {
  color: #fff;
}
#menu-primary .menu-toggle button {
  color: #fc6621;
  position: relative;
}
#menu-primary .menu-toggle button:before {
  position: absolute;
  top: 0;
  left: 0;
}
#menu-primary .menu-toggle button:hover, #menu-primary .menu-toggle button:focus {
  color: #fc6621;
}
/*
 nav {
 &.onpage {
 padding: 3rem auto 1rem;
 position: sticky;
 }
 }
 */
.display-header-text #header, .custom-header #header {
  border: none;
}
.header-div {
  width: 100vw;
  height: 600px;
  max-height: 50vh;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
  background-size: cover !important;
  background-position: center !important;
  position: fixed;
  left: 0;
  top: 0;
}
.custom-background.layout-1c-narrow #container > .wrap .header-div {
  right: calc((100vw - 950px) / 2);
}
.home .header-div {
  height: 100vh;
  max-height: 100vh;
}
body.custom-background {
  background: transparent !important;
}
.home #kenburns {
  animation: kenburns 20s infinite;
}
.bgdiv {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: calc(100vh - 14rem);
  z-index: -1;
}
.home .bgdiv, .contact .bgdiv {
  height: 100vh;
}
.home .bgdiv {
  width: calc(100vw + 135px);
  left: -90px;
}
.bgdiv .back {
  z-index: -99;
}
#wrap {
  min-height: 100vh;
}
.contact #wrap {
  min-height: 0;
  margin-bottom: 0;
}
#main {
  background-image: url("/wp-content/uploads/2017/12/bg-content.jpg");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  margin-top: calc(100vh - 15.6rem);
  position: relative;
  z-index: 10;
}
.home #main, .contact #main {
  background: none;
}
.services #main {
  background-position: right center;
}
.contact #main, .home #main {
  margin-top: 0;
}
/*
 was used with parallax
 .services {
 p {
 max-width: 450px;
 }
 }
 */
.copy {
  max-width: 600px;
}
.home .entry-header {
  display: none;
}
.entry {
  overflow: visible;
}
.entry-content article {
  margin-bottom: 6rem;
}
.full-section {
  width: 100vw;
  height: 100vh;
  position: relative;
}
.full-section.center {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.full-section .nk-awb {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  text-shadow: 0 0 10px #000;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.two-columns {
  column-count: 2;
}
.two-columns ul {
  margin-bottom: 0;
}
ul {
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  break-inside: avoid;
}
.flex-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  margin: 0 -1rem;
}
.flex-grid > div {
  width: 165px;
  margin: 0 0.6rem 1.7rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.flex-grid a {
  line-height: 0;
}
.flex-grid img {
  background: #fff;
  max-height: 155px;
  margin: 0;
  width: auto;
}
.main-append {
  padding-left: 75px;
  padding-right: 75px;
  display: none;
}
.contact .main-append.contact {
  display: block;
}
.nf-loading-spinner {
  display: none !important;
}
.nf-before-form-content {
  margin-bottom: 1rem;
}
.nf-response-msg {
  padding-bottom: 500px;
}
.nf-response-msg p {
  padding: 0 2rem 0 2rem;
  font-size: 1.8rem;
}
@media only screen and (min-width: 520px) {
  .nf-before-form-content {
    margin-left: 2rem;
    margin-right: 2rem;
  }
  .nf-form-title h3 {
    padding-left: 2rem;
    padding-right: 2rem;
  }
  nf-field {
    float: left;
    margin: 0 2rem;
    width: calc(50% - 4rem);
  }
  nf-field:nth-of-type(6), nf-field:nth-of-type(7), nf-field:nth-of-type(8) {
    clear: left;
  }
  nf-field input {
    max-width: 375px;
    margin-right: 0 !important;
  }
}
.post-edit-link {
  display: none !important;
}
@media only screen and (max-width: 540px) {
  #menu-primary {
    top: 0.5rem;
  }
  #menu-primary > .wrap {
    padding: 0;
    max-width: 400px;
    float: right;
  }
  #menu-primary .menu-toggle {
    position: relative;
    display: inline-block;
    margin: 0;
    cursor: pointer;
    font-size: 0.8125rem;
    line-height: 24px;
    vertical-align: middle;
    left: calc(100% - 7rem);
    top: 0.3rem;
  }
  #menu-primary .menu-toggle button::before {
    content: "\f419";
    display: inline-block;
    font-family: "Genericons";
    font-size: 32px;
    vertical-align: middle;
    -webkit-font-smoothing: antialiased;
  }
  .menu-toggle button {
    position: relative;
    top: 0;
  }
  .ltr .menu-toggle button {
    left: 0;
  }
  .rtl .menu-toggle button {
    right: 0;
  }
  #menu-primary .menu-toggle button {
    margin: 0 0 10px;
    padding: 0;
  }
  .ltr #menu-primary .menu-toggle button {
    margin-left: 1.5rem;
  }
  .rtl #menu-primary .menu-toggle button {
    margin-right: 1.5rem;
  }
  .ltr #menu-primary .menu-toggle button::before {
    padding: 0 0.75rem 0 0;
  }
  .rtl #menu-primary .menu-toggle button::before {
    padding: 0 0 0 0.75rem;
  }
  #branding {
    z-index: 1;
  }
  #menu-primary .wrap {
    display: none;
  }
  #menu-primary ul {
    margin: 0;
    list-style: none;
  }
  #menu-primary ul li {
    width: 100%;
    display: block;
  }
  #menu-primary ul li a {
    display: block;
    width: 100%;
    padding: 0.6rem 2rem 0.6rem 2.5rem;
    border-top: 1px solid;
    box-sizing: border-box;
  }
  .nf-response-msg p {
    padding: 0;
  }
}
.clearfix:after {
  content: ".";
  visibility: hidden;
  display: block;
  height: 0;
  clear: both;
}
@keyframes kenburnsMobile {
  0% {
    opacity: 0;
    transform: translate3d(0, 1vw, 0px);
  }
  5% {
    opacity: 1;
  }
  96.5% {
    transform: scale3d(1.25, 1.25, 1.25) translate3d(20vw, -4vw, 0px);
    animation-timing-function: ease-in;
    opacity: 1;
  }
  100% {
    transform: scale3d(2, 2, 2) translate3d(15vw, -6vw, 0px);
    opacity: 0;
  }
}
@media only screen and (max-width: 540px) {
  /* Styles */
  html, body {
    font-size: 13px;
  }
  #menu-primary .menu-items li a {
    background: rgba(0, 0, 0, 0.7);
  }
  .bgdiv {
    background-attachment: scroll;
  }
  .cancer-chef .bgdiv {
    background-position-x: 100%;
  }
  .bio .bgdiv {
    background-position-x: 30%;
  }
  .services .bgdiv {
    background-position-x: 70%;
  }
  .home #kenburns {
    animation: kenburnsMobile 20s infinite;
    background-position-x: 6%;
  }
  #main {
    background-attachment: fixed;
  }
  .os-phrases h1#site-title {
    font-size: 11vw;
    right: 1rem;
  }
  .two-columns {
    column-count: 1;
  }
  .flex-grid > div {
    max-width: calc(50% - 1.2rem);
  }
}
#menu-primary, #menu-primary .search-form > div, #footer {
  background: transparent !important;
}
