/* Global Styles (portrait) ----------- */
body {
  -webkit-text-size-adjust: none;
}
input,
button,
textarea {
  -webkit-appearance: none;
}
#toggle-menu {
  font-size: 1rem;
  line-height: 58px;
  color: #ffffff;
  padding: 0 0.54em;
  display: none;
  text-transform: uppercase;
}

@media only screen and (max-width: 1199px) {
  html,
  body {
    font-size: 15px;
  }
  .tuIntroContent p {
    font-size: 1rem;
    line-height: 1.6em;
  }
}
@media only screen and (max-width: 991px) {
  #logo {
    width: auto;
  }
  #navigation {
    margin-left: auto;
    text-align: right;
    margin-right: 1rem;
  }
  #toggle-menu {
    display: block;
  }

  #navigation ul.desktopMenu {
    position: absolute;
    display: inherit;
    z-index: 99;
    width: 180px;
    background: var(--blue);
    right: 0;
    text-align: left;
    display: none;
  }
  #navigation ul.desktopMenu > li {
    position: relative;
    border-top: solid 1px rgba(255, 255, 255, 0.1);
  }

  #navigation ul.desktopMenu > li > a {
    line-height: 1.5em;
    padding: 0.6em 1.2em;
  }
  #navigation ul.desktopMenu > li > a > span {
    display: inline-block;
    margin-left: 0.5em;
    vertical-align: middle;
  }
  #navigation ul.desktopMenu > li > a > i {
    font-size: 0.9em;
  }
  #navigation ul.desktopMenu > li > ul {
    display: block !important;
    height: auto !important;
    opacity: 1 !important;
    width: 100% !important;
    position: relative !important;
  }
  #navigation ul.desktopMenu > li > ul > li > a {
    padding: 0.6em 2em;
  }
  #headerSocial {
    width: auto;
    padding-right: 0;
    font-size: 1.3rem;
  }
  #headerSocial > a {
    margin-right: 0;
    margin-left: 0.4em;
  }
  #page-home .bannerTitle {
    font-size: 3rem;
  }
  #page-home .bannerTagline,
  #page-my-story #banner .bannerTagline {
    font-size: 1.9rem;
  }
  .sectionTitle.big {
    font-size: 1.95rem;
  }
  .bannerTitle,
  #page-about #banner .bannerTitle,
  .single-trauma_unlockings #banner .bannerTitle,
  #page-the-healing-codependency-course #banner .bannerTitle,
  #page-narcisstic-recovery-program #banner .bannerTitle,
  .page-template-default #banner .bannerTitle,
  #work-with-me .bannerTitle {
    font-size: 2.65rem;
  }
  #page-trauma-unlocking .bannerTitle {
    font-size: 2.55rem;
  }
  .reasonsTitle,
  .labelNo1 {
    font-size: 2.26rem;
  }
  .featuredLabel,
  .bannerTagline,
  .accordionQ {
    font-size: 1.46rem;
  }
  .podcastBxTitle {
    font-size: 1.7rem;
  }
  .accessCTATitle,
  .recentTitle {
    font-size: 2rem;
  }
  .quesText {
    font-size: 1.08rem;
  }
}
@media only screen and (max-width: 767px) {
  #page-home #banner,
  #home-heal,
  #home-self,
  #home-join,
  #healing-course,
  #page-podcast #banner,
  #page-the-healing-codependency-course #banner,
  #page-narcisstic-recovery-program #banner,
  #healing-course-help,
  #page-contact #banner,
  #page-work-with-me #banner,
  #page-my-story #banner,
  #my-story-intro, #my-story-intro-4 {
    padding-top: 0;
    position: relative;
    padding-bottom: 4rem;
  }
  #page-home .bannerImg,
  #home-heal .bg-image,
  #home-self .bg-image,
  #home-join .bg-image,
  #healing-course .bg-image,
  #page-podcast #banner .bannerImg,
  #page-the-healing-codependency-course #banner .bannerImg,
  #page-narcisstic-recovery-program #banner .bannerImg,
  #healing-course-help .bg-image,
  #page-contact #banner .bannerImg,
  #page-work-with-me #banner .bannerImg,
  #page-my-story #banner .bannerImg,
  #my-story-intro .bg-image, #my-story-intro-4 .bg-image {
    width: 100%;
    height: 55vw;
    position: relative;
    min-height: 240px;
    max-height: 300px;
  }
  #page-home .bannerImg img,
  #home-heal .bg-image img,
  #home-self .bg-image img,
  #home-join .bg-image img,
  #healing-course .bg-image img,
  #page-podcast #banner .bannerImg img,
  #page-the-healing-codependency-course #banner .bannerImg img,
  #page-narcisstic-recovery-program #banner .bannerImg img,
  #healing-course-help .bg-image img,
  #page-contact #banner .bannerImg img,
  #page-work-with-me #banner .bannerImg img,
  #page-my-story #banner .bannerImg img,
  #my-story-intro .bg-image img, #my-story-intro-4 .bg-image img {
    object-position: center top;
  }
  #page-home .bannerImg:after,
  #home-heal .bg-image:after,
  #home-self .bg-image:after,
  #home-join .bg-image:after,
  #healing-course .bg-image:after,
  #page-podcast #banner .bannerImg:after,
  #page-the-healing-codependency-course #banner .bannerImg:after,
  #page-narcisstic-recovery-program #banner .bannerImg:after,
  #healing-course-help .bg-image:after,
  #page-contact #banner .bannerImg:after,
  #page-work-with-me #banner .bannerImg:after,
  #page-my-story #banner .bannerImg:after,
  #my-story-intro .bg-image:after, #my-story-intro-4 .bg-image:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: linear-gradient(360deg, #fff 0%, rgba(0, 0, 0, 0) 25%);
  }
  #page-home #banner.withImg::after,
  #home-heal:after,
  #home-self:after,
  #home-join:after,
  #healing-course:after,
  #page-podcast #banner:after,
  #page-the-healing-codependency-course #banner:after,
  #page-narcisstic-recovery-program #banner:after,
  #healing-course-help:after,
  #page-contact #banner:after,
  #page-work-with-me #banner:after,
  #page-my-story #banner:after,
  #my-story-intro:after, #my-story-intro-4:after {
    display: none;
  }
  #home-join .bg-image:after,
  #my-story-intro .bg-image:after {
    background: linear-gradient(360deg, var(--blue) 0%, rgba(0, 0, 0, 0) 25%);
  }
  #healing-course .bg-image:after {
    background: linear-gradient(360deg, #f2f7ff 0%, rgba(0, 0, 0, 0) 25%);
  }
  #page-the-healing-codependency-course #banner .bannerImg:after,
  #page-narcisstic-recovery-program #banner .bannerImg:after,
  #page-contact #banner .bannerImg:after,
  #page-work-with-me #banner .bannerImg:after, #my-story-intro-4 .bg-image:after {
    background: linear-gradient(360deg, #f0f3ff 0%, rgba(0, 0, 0, 0) 25%);
  }
  #page-home .bannerTitle {
    font-size: 2.5rem;
  }
  #page-home .bannerTagline,
  #page-my-story #banner .bannerTagline {
    font-size: 1.6rem;
  }
  .testimonialTxt {
    font-size: 1.3rem;
  }
  .testimonialName {
    font-size: 1.65rem;
  }
  .labelNo1,
  .reasonsTitle {
    font-size: 1.9rem;
  }
  .featuredLabel,
  .bannerTagline,
  .accordionQ {
    font-size: 1.24rem;
  }
  .bannerTitle,
  #page-about #banner .bannerTitle,
  .single-trauma_unlockings #banner .bannerTitle,
  #page-the-healing-codependency-course #banner .bannerTitle,
  #page-narcisstic-recovery-program #banner .bannerTitle,
  .page-template-default #banner .bannerTitle,
  #work-with-me .bannerTitle {
    font-size: 2.25rem;
  }
  .accessCTATitle,
  .recentTitle {
    font-size: 1.7rem;
  }
  #home-power .col-md-6 {
    flex: 0 0 auto;
    width: 58%;
  }
  #home-power .bg-image {
    right: 10px;
  }
  #home-self .bg-image img {
    width: 70%;
  }
  #home-self .bg-image::after {
    background: linear-gradient(360deg, #fff 0%, rgba(186, 182, 182, 0) 25%),
      linear-gradient(270deg, #ffffff 35%, rgba(255, 255, 255, 0) 45%);
  }

  .homePodcastRow {
    display: block;
  }
  .homePodcastTxt {
    width: 100%;
    padding-right: 0;
    padding-top: 2rem;
  }
  .homePodcastImg {
    width: 250px;
    max-width: 100%;
  }
  .tuIntroRow {
    display: block;
  }
  .tuIntroImg {
    width: 100%;
    position: relative;
    height: 60vw;
    min-height: 240px;
    max-height: 320px;
    margin-bottom: 1.5rem;
  }
  .flex.reverse .tuIntroTxt {
    padding-left: 0;
    padding-right: 0;
  }
  .tuIntroTxt {
    width: 100%;
    padding-left: 0;
  }
  #tuPosts .podcastBx,
  .podcastBx,
  .contentBoxPosts .podcastBx.align-justify-content-start {
    padding: 1.5rem 1.5rem;
  }
  .contentBoxPosts .podcastBx.align-justify-content-start .podcastSummaryBx {
    width: 60%;
  }
  .tuIntroImg.tuSidebarImgs {
    height: auto;
    min-height: auto;
    max-height: inherit;
    margin-bottom: 0;
    display: flex;
  }
  .tuIntroImg.tuSidebarImgs .podcastImg {
    height: 300px;
    margin-left: 10px;
    margin-right: 10px;
  }
  .podcastBxTitle {
    font-size: 1.45rem;
  }
  input[type="submit"],
  button,
  .button,
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input.text,
  input.title,
  textarea,
  select,
  .gfield_label {
    height: 42px;
    line-height: 42px;
  }
  .podcastList > li {
    width: 140px;
  }
  #healing-course-intro2 .tuIntroTxt,
  #healing-course-intro4 .tuIntroTxt {
    padding-left: 0;
    padding-top: 0;
    padding-bottom: 0;
  }
  .backBtn {
    font-size: 1.4rem;
  }
  #narcissistic-recovery-intro2 .tuIntroTxt {
    padding-left: 0;
    padding-top: 0;
    padding-bottom: 0;
  }
  #contentbx-narcissistic-program-covers .podcastBx {
    min-height: inherit;
  }
  .onePaymentImgBx {
    width: 280px;
    margin: 0 0 1.5rem;
  }
  .reasonsList > li {
    margin-bottom: 4em;
  }
}

@media only screen and (max-width: 575px) {
  #page-home .bannerTitle,
  #page-trauma-unlocking .bannerTitle {
    font-size: 2.1rem;
  }
  #page-home .bannerTagline,
  #page-my-story #banner .bannerTagline {
    font-size: 1.36rem;
  }
  .bannerTxt {
    font-size: 1.05rem;
  }
  .sectionTitle.big {
    font-size: 1.65rem;
  }
  .labelNo1,
  .reasonsTitle {
    font-size: 1.6rem;
  }
  .font22,
  .featuredLabel,
  .bannerTagline,
  .accordionQ {
    font-size: 1.1rem;
  }
  .font23 {
    font-size: 1.15rem;
  }
  .tuIntroRow h3,
  .bannerTitle,
  #page-about #banner .bannerTitle,
  .single-trauma_unlockings #banner .bannerTitle,
  #page-the-healing-codependency-course #banner .bannerTitle,
  #page-narcisstic-recovery-program #banner .bannerTitle,
  .page-template-default #banner .bannerTitle,
  #work-with-me .bannerTitle {
    font-size: 1.9rem;
  }
  .aboutTitle,
  .tuQuote {
    font-size: 1.45rem;
  }
  .tuListLabel {
    font-size: 1.2rem;
  }

  #home-power {
    padding-top: 0;
  }
  #home-power .bg-image {
    right: 0;
    width: 100%;
    position: relative;
    height: 280px;
    overflow: hidden;
    margin-bottom: 2rem;
  }
  #home-power .bg-image img {
    object-position: center top;
  }
  #home-power .col-md-6 {
    width: 100%;
  }
  #tuPosts .bg-image,
  #tuPosts .bg-image,
  .contentBoxPosts .podcastBx.withImg .bg-image {
    width: 100%;
    position: relative;
    height: 240px;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 1.5rem;
  }
  #tuPosts .podcastBx::after,
  #tuPosts .bg-image,
  .contentBoxPosts .podcastBx.withImg:after {
    display: none;
  }
  .podcastBxHead {
    display: block;
  }
  #tuPosts .podcastSummaryBx {
    width: 100%;
  }
  .tuIntroImg.tuSidebarImgs .podcastImg {
    height: 45vw;
    margin-left: 5px;
    margin-right: 5px;
  }
  .podcastImgBx {
    width: 100%;
    padding-right: 0;
    margin-bottom: 1.5rem;
  }
  .podcastSummaryBx {
    width: 100%;
  }
  .podcastBxTitle {
    font-size: 1.3rem;
  }
  .accessCTATitle,
  .recentTitle {
    font-size: 1.45rem;
  }
  .accessCTATxt {
    font-size: 1.05rem;
  }
  input[type="submit"],
  button,
  .button {
    font-size: 0.9rem;
    padding: 0 0.9em;
  }
  #page-podcasts #banner h3 {
    font-size: 2rem;
  }
  #paginationWrapper {
    flex-direction: column;
  }
  #paginationWrapper .wp-pagenavi {
    margin: 1rem 0;
  }
  .backBtn {
    font-size: 1.2rem;
  }
  .accordionQ,
  .accordionA {
    padding-left: 3rem;
    padding-right: 1rem;
  }
  .accordionQ::before {
    left: 1em;
  }
  .contentBoxPosts .podcastBx.align-justify-content-start .podcastSummaryBx {
    width: 100%;
  }
  ul.gform_fields > li.gfield {
    width: 100%;
  }
}
