/* Fade in Page 


@keyframes fadeInAnimation {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

body {
    background-color:#fff;
    animation: fadeInAnimation ease 2s;
    animation-iteration-count: 1;
    animation-fill-mode: backwards;
}
*/

/* Header */

#header {
    color:#000;
    background-color:#fff;
    border-bottom: var(--border);
    position: relative;
    width:100%;
    left:0;
    top:0;
    z-index:300;
    padding-top: 1.75em;
}

#header .ncontain {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1850px;
}

.header_logo {
    order: 2;
    color: var(--purple);
    font-size: 2.75em;
    display: block;
    transition: 0.6s;
}

.header_logo span {
    display: block;
}

.header_desc {
    order: 1;
    padding-left: 3.3em;
    background: url(../img/colors-circle.svg) no-repeat left center;
    background-size: auto 80%;
    font-weight: 450;
}

.header_desc:hover a{
    text-decoration: underline;
    text-decoration-color: var(--green);
}

.header_callouts {
    order:3;
    display: flex;
    justify-content: right;
    align-items: center;
}

.header_desc,
.header_callouts {
    width:350px;
    font-size: var(--txt-small);
    color: var(--purple)
}


  @media(max-width:1125px){
    .header_desc,
    .header_menu,
    .ncsearchtrigger {
        display: none;
    }

    .header_logo {
        font-size: 2.1em;
    }

    .header_nav.ncontain {
        justify-content: start !important;
        position: relative;
        left: -0.5em;
    }
    .mpanel_button {
        display: block;
    }

    .header_logo,
    .header_callouts {
        z-index: 1001;
    }

}

@media(max-width:650px){
    .header_menu-second li:not(:last-child) {
        display: none;
    }
}


/* Make home links blank */

body.home .header_logo {
    cursor: default;
    pointer-events: none;
}


/* Search trigger */

#header .ncsearchtrigger {
    align-items: center;
    font-size: 1.3em;
}

#header .ncsearchtrigger_icon { 
    width: 1.3em; 
}


.ncsearchtrigger {
    cursor:pointer;
    padding:3px; /* for Firefox and Edge */
    align-self: center;
    margin-inline: var(--gap) 0;
    position: relative;
    color: currentcolor;
    transition:0.3s;
}

.ncsearchtrigger:hover {
    color: var(--green);
}

.ncsearchtrigger:after {
    content:'';
    display: block;
    width: 45px;
    height: 45px;
    position: absolute;
    left: -35%;
    top: -20%;
}


/* Search form, field, and close button */

.ncsearchreveal {
  --bg-color-start: var(--green);
  --bg-color-end: var(--purple);
  --text-color: #fff;
  --text-size: 1.2em;
  --text-align: left;
  --field-padding: 0.5rem 1.5rem;
  --field-border: solid 1px #000;
  --x-button-size: 1.25em;
  --x-button-color: #fff;
  --x-button-color-hover: #fff;
}

.ncsearchreveal {
position:absolute;
top:0;left:0;
width:100%;
height: 6em;
margin:0;

/* for the positioning of the close button */
display:flex;
align-items:center;
justify-content:flex-end;
padding-left:1.5rem;
padding-right:1.5rem;

/* Must be hidden for header elements to interactive */
visibility:hidden;
}

.ncsearchreveal_input {
position:absolute;
left:0;
bottom:100%;
height:100%;
width:100%;
padding:var(--field-padding);
border:var(--field-border);
outline:none;
font-size:var(--text-size);
background-color:var(--bg-color-start);
color:var(--text-color);
z-index:4;
text-align:var(--text-align);
transition:0.3s;
visibility:visible; /* Must be visible to be interactive */
text-align: center;
}

/* Currently this is hidden in place of a close field button */

.ncsearchreveal_input::-webkit-search-cancel-button {
-webkit-appearance: none;
appearance: none;
height:1.5rem;
width: 1.5rem;
cursor:pointer;

background-repeat:no-repeat;
background-position:center;
background-size:contain;
display:none;
}

.ncsearchreveal_input:focus {
bottom:0;
top:auto;
box-shadow:0 0 1em rgba(0,0,0,0.3);
background-color:var(--bg-color-end);
}

.ncsearchreveal_close {
  padding: 0 1em;
  background: none;
  border: none;
  display: block;
  cursor: pointer;
  transition: 0.1s;
  visibility: hidden;
  opacity: 0;
  position: absolute;
  right: 0;
  height: 100%;
}

.ncsearchreveal_input:focus + .ncsearchreveal_close{
visibility:visible;
z-index:6;
opacity:1;
}

.ncsearchreveal_x {
    font-size:var(--x-button-size); 
    display:block; 
    color:var(--x-button-color);
    transition:0.3s;
}

.ncsearchreveal_x:hover {
    color:var(--x-button-color-hover);
}



/* Search Form 
 
  <form class="ncsearchform">
    <div class="ncsearchform_contain">
      <label for="wp-searchbox" class="hidetext">Search</label>
      <input class="ncsearchform_input" type="search" id="wp-searchbox" name="s" placeholder="Search">
      <button class="ncsearchform_button" type="submit">
        <svg class="ncsearchform_icon">...</svg>
      </button>
    </div>  
  </form>
 
 */

 .ncsearchform {
    --align-self: center;
    --min-height: 2.5em;
    --text-indent: 1em;
    --radius: 25px;
    --min-width: 150px;
    --text-size: 1em;
    --text-color: #000;
    --bg-color: #fff;
    --border: solid 1px #ccc;
    --button-width: 2.5em;
    --button-bg-color: none;
    --button-bg-color-hover: none;
    --button-color: var(--green);
    --button-color-hover: #000;
    --focus-text-color: #000;
    --focus-button-color: #000;
    --focus-border: solid 1px #000;
    --focus-bg-color: #fff;
    --focus-dropshadow: 0 1px 0.3rem rgba(0,0,0,0.3);
  }


  
  .ncsearchform {
    flex-grow: 1;
    min-width:var(--min-width);
    align-self:var(--align-self);
  }
  
  .ncsearchform_contain {
    display: flex;
    position:relative;
    align-items: center;
    flex-grow: 1;
  }
  
  .ncsearchform_input {
    background: var(--bg-color);
    text-indent: var(--text-indent);
    border: var(--border);
    border-radius: var(--radius);
    width: 100%;
    font-size: var(--text-size);
    min-height:var(--min-height);
    padding-right:var(--button-width);
    outline: none;
    transition: 0.3s;
    color:var(--text-color);
  }
  
  .ncsearchform_input,
  .ncsearchform_input::-webkit-search-cancel-button {
    -webkit-appearance: none;
    appearance: none;
  }
  
  .ncsearchform_input:focus {
    border:var(--focus-border);
    background: var(--focus-bg-color);
    box-shadow: var(--focus-dropshadow);
    color:var(--focus-text-color);
  }

  .ncsearchform_button {
    cursor: pointer;
    background: var(--button-bg-color);
    border: none;
    position: absolute;
    right: 0;
    height:100%;
    font-size: 1em;
    border-radius:var(--radius);
    border-top-left-radius:0;
    border-bottom-left-radius:0;
    width: var(--button-width);
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    transition:0.3s;
  }
  
  .ncsearchform_icon {
    color: var(--button-color);
    display: block;
    transition: 0.3s;
  }
  
  .ncsearchform_button:hover {
    background: var(--button-bg-color-hover);
  }
  
  .ncsearchform_button:hover .ncsearchform_icon {
    color: var(--button-color-hover);
  }

  .ncsearchform_input:focus + .ncsearchform_button .ncsearchform_icon {
    color: var(--focus-button-color);
  }

  
  /* Modifier 
  Stretch
  */
  
  .ncsearchform-stretch {
    align-self:stretch;
    position:relative;
    display: flex;
  }
  .ncsearchform-stretch .ncsearchform_contain {
    align-items: stretch;
  }
  
  .ncsearchform-stretch .ncsearchform_input {
    align-items: stretch;
  }
  
  .ncsearchform-stretch .ncsearchform_input,
  .ncsearchform-stretch .ncsearchform_button {
    border-radius:0;
  }


/* Second Top Menu */

.header_menu-second {
    display: flex;
    list-style-type: none;
    margin: 0;
    padding: 0;
    font-weight: bold;
    gap: 1.25rem;
}

.header_menu-second > li {
    position: relative;
}

.header_menu-second a {
    padding-block: 1em;
    transition:0.5s
}

.header_menu-second li:hover a {
    color: var(--green);
}

.header_menu-second > li:last-child a {
    padding-inline: 1em;
    border-radius: var(--radius);
    background: var(--gold);
    color: #fff;
    transition:0.5s
}

.header_menu-second > li:last-child a:hover {
    background: var(--green);
}

.second-submenu {
    position: absolute;
    top: 2em;
    right: 0;
    line-height: normal;
    z-index: 500;
    background: #fff;
    transition: 0.5s;
    color: #fff;
    opacity: 0;
    visibility: hidden;
    transform: scale(1,0);
    transform-origin: center top;
    filter: drop-shadow(0 5px 5px rgba(0,0,0,0.1));
    border:solid 1px #ddd;
    border-radius: 10px;
}

.header_menu-second > li:hover .second-submenu,
.header_menu-second > li:focus .second-submenu,
.header_menu-second > li:active .second-submenu  {
    z-index: 510;
    opacity: 1;
    visibility: visible;
    transform: scale(1,1);
}

.submenushop {
    padding: 1rem !important;
    font-size: var(--txt-small);
    width: 260px;
    display:flex;
    align-items: center;
    font-weight: 450;
    transition: 0.3s;
    line-height: 1.5;
    border-bottom: solid 3px transparent
}

.submenushop:hover {
    text-decoration: underline;
    text-decoration-color: var(--green);
}

.submenushop span {
    color: var(--purple);
    transition: 0.3s;
    padding-left: 1em;
    hyphens: none;
}

.submenushop span b {
    font-weight: 700;
}

.submenushop img {
    min-width: 75px;
    flex-basis: 75px;
    object-fit: contain;
    object-position: center;
    height: 75px;
}


.second-submenu .ncsocial {
    --icon-width: 2em;
    --icon-gap: 0.75rem;
    --icon-radius: 50%;
    --icon-scale: scale(1);
    --icon-color: #fff;
    --icon-color-hover: #fff;
    --icon-bg-color: var(--purple);
    --icon-bg-color-hover: var(--green);
    --icon-border: none;
    --icon-border-hover: none;
    margin:1rem;
  }

/* WooCommerece */

#woocommerce-wrapper {
    margin-top:3em;
}


/* Mpanel Button Icon */

.mpanel_button {
    cursor: pointer;
    color: var(--purple);
    font-size: 1.2em;
    margin-left: 1em;
    position: relative;
    width:20px;
    height: 20px;
    display:flex;
    align-items: center;
    justify-content: center;
}

.mpanel_button:after {
    content:'';
    display: block;
    height: 45px;
    width:45px;
    position: absolute;
    left: -13px;
    top: -13px;
}

.mpanel_button span:last-child {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    font-size: 1.2em;
}

/* Mobile Panel */

.mpanel {
    position: absolute;
    top: 0;
    left:0;
    width: 100%;
    padding: 6em var(--gap) 3rem;
    background: var(--purple);
    color:#fff;
    z-index: 1000;
    min-height: 400px;
    overflow-y: auto;
    font-size: var(--base);
    transform: translateY(-100%);
    transition: all 0.5s ease-in-out;
    visibility: hidden;
    box-shadow: 0 0 0 #000;
}

@media(min-width:1125px){
    .mpanel,
    .mpanel_underlay,
    .mpanel_content,
    .mpanel_button {
        display:none;
    }
    .header_logo,
    .mpanel_button {
        color:var(--purple) !important
    }
}

.mpanel_desc {
    max-width: 275px;
    font-size: var(--txt-small);
    margin-bottom: var(--gap);
}

.mpanel_content {
    visibility: hidden;
    opacity: 0;
    transition: 0.6s;
    transition-delay: 0.6s;
}

.mpanel_div {
    border-top: solid 1px var(--gold);
    margin-block: var(--gap) 2em;
}

.mpanel .ncsocial {
    --icon-width: 2em;
    --icon-gap: 0.75rem;
    --icon-radius: 50%;
    --icon-scale: scale(1.1);
    --icon-color: var(--purple);
    --icon-color-hover: var(--purple);
    --icon-bg-color: #fff;
    --icon-bg-color-hover: var(--green);
    --icon-border: none;
    --icon-border-hover: none;
    margin-left:0.5em;
}

.mpanel .ncsearchform {
    --align-self: center;
    --min-height: 2.5em;
    --text-indent: 1em;
    --radius: 10px 0 10px 0;
    --min-width: 150px;
    --text-size: 1em;
    --text-color: #fff;
    --bg-color: rgba(255,255,255,0.3);
    --border: none;
    --button-width: 2.5em;
    --button-bg-color: none;
    --button-bg-color-hover: none;
    --button-color: #fff;
    --button-color-hover: #fff;
    --focus-text-color: #000;
    --focus-button-color:#000;
    --focus-border: none;
    --focus-bg-color: #fff;
    --focus-dropshadow: 0 1px 0.3rem rgba(0,0,0,0.3);
  }

.mpanel_menu {
    margin-inline: var(--gapn);
}

.mpanel_menu,
.mpanel_menu .sub-menu {
    padding: 0;
    margin-top: var(--gap);
    list-style-type: none;
}

.mpanel_menu .sub-menu {
    background: rgba(0,0,0,0.2);
}

.mpanel_menu a {
    display: block;
    padding: 0.5em 2em;
}

.mpanel_menu > li > a {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: top;
}

.mpanel_menu > li > a:after {
    content:'\e902';
    font-family: 'ncicons';
    font-weight: normal;
    transform: rotate(0);
    transition: 0.25s;
}


.mpanel_menu > li.menu-item-has-children:hover > a:after,
.mpanel_menu > li.menu-item-has-children:active > a:after,
.mpanel_menu > li.menu-item-has-children:focus > a:after {
    transform: rotate(90deg);
}

.mpanel_menu > li > a {
    font-weight: 600;
} 

.mpanel_menu a:hover,
.mpanel_menu a:active,
.mpanel_menu a:focus {
    background: rgba(0,0,0,0.2)
} 

.mpanel_menu > li .sub-menu {
    margin-block: 0;
    text-indent: 0.75rem;
    opacity: 0;
    visibility: hidden;
    max-height: 0;
    transition: 0.5s;
}

.mpanel_menu > li:hover .sub-menu,
.mpanel_menu > li:focus .sub-menu,
.mpanel_menu > li .sub-menu.focused {
    opacity: 1;
    visibility: visible;
    max-height: 900px;
}


.mpanel_underlay {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 999;
    background: #000;
    opacity: 0;
    width:100%;
    height:100%;
    visibility: hidden;
    transition:0.5s;
}

/* When the label is clicked, it reveals the mobile panel */

    .mpanel_input:checked + .mpanel {
        transform: translateY(-1px);
        box-shadow: 5px 0 1em rgba(0, 0, 0, 0.3);
        visibility: visible;
    }

    .mpanel_input:checked + .mpanel + .mpanel_underlay {
        opacity: 0.5;
        visibility: visible;
    }

    .mpanel_input:checked ~ .ncontain .header_logo,
    .mpanel_input:checked ~ .ncontain .header_callouts .mpanel_button {
        color: #fff;
    }

    .mpanel_input:checked + .mpanel .mpanel_content {
        visibility: visible;
        opacity: 1;
    }

    .mpanel_input:checked ~ .ncontain .header_callouts .mpanel_button span:last-child {
        visibility: visible;
        opacity: 1;
    }

    .mpanel_input:checked ~ .ncontain .header_callouts .mpanel_button span:first-child {
        visibility: hidden;
        opacity: 0;
    }


/* WP Header Image */

.wp-bannerimage {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center top;
    height: 200px;
}



/* Mega Footer */

#footer {
    padding: 5em 0;
    background-color: var(--purple);
    color: #fff;
    font-size: 0.9em;
    --width-limit: calc(100% - 4.5rem);
    border-top:solid 6px var(--gold);
}

.footer_logo {
    width:30vw;
    max-width: 275px;
    min-width: 200px;
    display: block;
    margin:0 auto 5em;
}

.footer_columns {
    display:grid;
    gap: clamp(2em, 5vmin, 5%);
    grid-template-columns: repeat(4, 1fr);
    position: relative;
}

.footer_columns .widget_header,
.footer_columns h2 {
    color: var(--gold);
    font-weight: bold;
    text-transform: uppercase;
    font-size: 1em;
    font-family: var(--sans);
}

@media(max-width:1150px){
    .footer_columns {
        grid-template-columns: repeat(2, 1fr);
        --width-max: var(--width-standard);
        gap:4rem
    }
}

@media(max-width:700px){
    .footer_columns {
        grid-template-columns: repeat(1, 1fr);
        --width-max: 360px;
        gap:2em;
    }
}


.footer_column1 {
    display: flex;
    gap: 1.5em;
    justify-content: space-between;
    max-width: 100%;
}

.footer_column1 .widget {
    margin-bottom: 0;
}

.footer_column1 > div {
    flex-basis: 50%;
    flex-grow: 1;
    overflow: hidden;
}

.footer_columns .menu {
    margin-bottom: 0;
}

.footer_columns .menu > li > a {
    display: block;
    padding-bottom: 1.3em;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.footer_columns .menu > li > a:hover {
    text-decoration: underline;
}

.footer_columns .ncsocial {
    --icon-width: 2em;
    --icon-gap: 0.75rem;
    --icon-radius: 50%;
    --icon-scale: scale(1.25);
    --icon-color: var(--purple);
    --icon-color-hover: var(--purple);
    --icon-bg-color: #fff;
    --icon-bg-color-hover: #fff;
    --icon-border: none;
    --icon-border-hover: none;
  }


  #footer .sparklogo img {
    display: block;
  }


  #topbutton {
    height: 50px;
    width: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.2);
    color: #fff;
    position: absolute;
    right: 0.75rem;
    bottom: 0.75rem;
    transform: rotate(90deg);
  }

  #topbutton:after {
    content:'\e901';
    font-family: 'ncicons';
  }


/* Audio / Video Player */

.mejs-container {
    max-width: 100% !important;
}

.ncontent_main > .mejs-container,
.wp-video {
    max-width: var(--width-standard) !important;
    width: var(--width-limit) !important;
    margin-bottom: var(--gap);
}


/* Main Body Content Layout */

body.blog .ncontent_main > *,
body.archive .ncontent_main > *,
body.error404 .ncontent_main > *,
body.search .ncontent_main > * {
    max-width: var(--width-max);
    width: var(--width-limit);
    margin-inline:auto;
}

.ncontent {
    min-height: 70vh;
}

body .ncontent {
    margin-bottom: clamp(2em, 6vmin, 6rem);
    background: linear-gradient(
    to bottom, 
    var(--gray-light),
    #fff,
    #fff, 
    #fff,
    #fff,
    #fff
    );
}

.ncontent_main > * {
    width: var(--width-limit);
    max-width:var(--width-standard);
    margin-inline:auto;
}

.ncontent_main > .alignwide {
    max-width:var(--width-wide);
}

.ncontent_main > .alignmax {
    max-width: var(--width-max);
}

.ncontent_main > .alignfull {
    max-width:100%;
    width:100%;
}

/* Misc Needed to pass test */

.sticky,
.gallery-caption,
.bypostauthor{
    cursor:inherit;
 }


/* --------------------------------- */


.featuredimage  {
    margin-bottom:var(--gap);
}

.featuredimage .wp-caption-text {
    text-align: center;
    max-width: 600px;
    margin-inline: auto;
    padding: 0.75em var(--gap);
    font-style: normal;
    color: var(--purple);
}

.featuredimage img {
    border-radius: 10px;
}

@media(max-width:700px){
    .featuredimage{
        width: 100%;
        order: -4 !important;
        margin-bottom: -1.5rem;
    }
    .featuredimage img {
        border-radius: 0;
    }
}


/* Card Listings */

.lcard {
    --card-padding: 0;
    --card-margin-bottom:3em;
    --card-bg-color: #fff;
    --card-bg-color-hover: #fff;
    --card-flex-direction: row;
    --card-border: none;
    --card-border-hover: none;
    --card-bshadow: none;
      
    --border-radius: 5px;
    --pretext-color:currentColor;
  
    --image-width: 30%;
    --image-height: 70%;
  
    --text-padding: 1.5em;
    --text-size: 1em;
    --text-color: #000;
    --text-color-hover: #000;
  
    --trans-speed: 0.6s;
    
    }
    
    .lcard { 
      width:100%; 
      max-width:100%; 
      position:relative; 
      margin-bottom:var(--card-margin-bottom);
     }
    
    .lcard_link {
    text-decoration:none;
    color:inherit;
    display:block;
    }
    
    .lcard_container {
    display:flex;
    position:relative;
    background:var(--card-bg-color);
    padding:var(--card-padding);
    flex-direction:var(--card-flex-direction);
    border:var(--card-border);
    box-shadow:var(--card-bshadow);
    transition:var(--trans-speed);
    border-radius: var(--border-radius);
    overflow: hidden;
    }
    
    .lcard:hover .lcard_container {
    background:var(--card-bg-color-hover);
    border:var(--card-border-hover);
    }
    
    .lcard_image {
    flex-basis:var(--image-width);
    min-width:var(--image-width);
    overflow:hidden;
    background-color: #eee;
    }
    
    .lcard_imgcon {
      padding-top:var(--image-height);
      width:100%;
      height:var(--image-height);
      min-height:100%;
      display:block;
      position:relative;
    }
    
    .lcard_img {
      position:absolute;
      object-fit:cover;
      top:0; left:0;
      display:block;
      width:100%;
      height:100%;
      transform: rotate(0deg) scale(1) translateZ(0);
      transition:var(--trans-speed);
    }
    
    .lcard:hover .lcard_img {
    transform: rotate(-2.5deg) scale(1.25) translateZ(0);
    }
    
    .lcard_text {
    display:flex;
    flex-grow:1;
    flex-direction:column;
    justify-content:center;
    font-size:var(--text-size);
    color:var(--text-color);
    padding:var(--text-padding);
    transition:var(--trans-speed);
    min-width: 0; /* This is needed if you use truncated content within a flexbox */
    }
    
    .lcard:hover .lcard_text {
    color:var(--text-color-hover);
    }
    
  
  /* Listings */
  
  .lcard_title { 
    font-weight:bold; 
    text-transform:uppercase;
   }
  
  .lcard_meta { color:#999;}
  
  .lcard_readmore { 
    display:inline-flex; 
    align-items: center; 
    border-bottom:solid 1px var(--link-color);
    text-transform: uppercase;
    font-size:var(--txt-small);
    font-weight: 500;
  }
  
  @media(max-width:768px){
  .lcard {
    --card-flex-direction:column;
    --image-width:100%;
    --image-height:50%;
    --text-size:0.8em;
        --text-padding:1em;
    }
  }
  
  
  /* Site Pagination */
  
  .pagination {
    --pgbgcolor: var(--gray);
    --pgtextcolor: var(--purple);
    --pgbgcolor-hover: var(--link-color);
    --pgtextcolor-hover: #fff;
    --pgbgcolor-current: var(--purple);
    --pgtextcolor-current: #fff;
    --pgradius: 5px;
    --pgbordercolor: #eee;
  }
  
  .pagination {
    position: relative;
    display: flex;
    justify-content: flex-start;
    margin-top:var(--gap);
  }
  
  .pagination .page-numbers {
    padding: 0.5em;
    border-radius: var(--pgradius);
    text-align: center;
    background-color: var(--pgbgcolor);
    margin: 0.25em;
    font-weight: bold;
    width: 3em;
    border:solid 1px var(--pgbordercolor);
    transition: .3s;
  }
  
  .pagination .page-numbers:first-child {
    margin-left: 0;
  }
  
  .pagination .page-numbers:last-child {
    margin-right: 0;
  }
  
  .pagination .page-numbers.dots {
    cursor: default;
  }
  
  .pagination .page-numbers:hover:not(.dots):not(.current) {
    background-color: var(--pgbgcolor-hover);
    color: var(--pgtextcolor-hover);
    border:solid 1px var(--pgbgcolor-hover);
  }
  
  .pagination a.page-numbers {
    color: var(--pgtextcolor);
  }
  
  .pagination_prev:before {
    content: '\2039';
  }
  
  .pagination_next:before {
    content: '\203A';
  }
  
  .pagination .page-numbers.current {
    background-color: var(--pgbgcolor-current);
    color: var(--pgtextcolor-current);
    border:solid 1px var(--pgbgcolor-current);
    cursor: default;
  }



  	
/* Main Title */
#maintitle { 
    padding: 3em 0; 
    text-align: center;
    --width-standard: var(--width-wide);
}

#maintitle > :last-child {
    margin-bottom: 0;
}

.maintitle_heading {
    font-size: var(--txt-xxxlarge);
    color: var(--purple);
}

/* Post meta */

.postmeta { 
    display: inline-flex;
    gap: 0 1em;
    color:var(--green);
    font-weight: 600;
    flex-wrap: wrap;
    justify-content: center;
    font-size: var(--txt-small);
}

.postmeta a {
    font-weight: 600 !important;
}


.sharelinks {
    --bgcolor: var(--purple);
    --color: #fff;
    --space: 1em;
    --size: 1em;

    display: flex;
    align-items: center;
    gap: var(--space);
    justify-content: center;
}

.sharelinks_anchor {
    position: relative;
    transition: 0.3s;
    transform: scale(1);
    color: var(--color, #000);
    background: var(--bgcolor);
    padding: 0.25em;
    aspect-ratio: 2 / 2;
    width: 2em;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--size);
    cursor: pointer;
}

.sharelinks_anchor span {
    display: flex;
    align-items: center;
    justify-content: center;
}

.sharelinks_anchor:hover,
.sharelinks_anchor:active {
    transform:scale(1);
    --bgcolor: var(--green);
    --color: #fff;
}


.ncontent_main > h2,
.ncontent_main > h3,
.ncontent_main > h4 {
    color: var(--purple);
}

.ncontent_main > h2 a,
.ncontent_main > h3 a,
.ncontent_main > h4 a {
    text-decoration: underline;
    text-decoration-color: var(--green);
    transition:0.3s
}

.ncontent_main > h2 a:hover,
.ncontent_main > h3 a:hover,
.ncontent_main > h4 a:hover {
    color: var(--green);
}

/* Link colors */

.ncontent_main p a:not([class]),
.ncontent_main li a:not([class]) { 
    transition: 0.3s;
    font-weight: 500;
    color: var(--green);
    text-decoration: underline;
    text-decoration-color: var(--green);

}

.ncontent_main p a:not([class]):hover,
.ncontent_main li a:not([class]):hover {
    color: var(--purple);
}




/* Taxonomy (Tags and Categories) */

.taxonomy {
position: relative;
margin-block: 0 3rem;
display: flex;
align-items: start;
gap: 0.75em;
padding-top: var(--gap);
border-top:solid 1px #ddd;
font-size: var(--txt-small);

}

.taxonomy_label {
    white-space: nowrap;
    padding: 0.5em 0;
}

.taxonomy_anchors ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75em;
}

.taxonomy a {
    border: none !important;
    padding: 0.5em 0.75em;
    border-radius: 5px;
    background: var(--gray-light);
    transition: 0.3s;
}

.taxonomy a:hover {
    background: var(--green);
    color: #fff !important;
} 


/* for WordPress Categories: they print things out in lists */

.taxonomy_anchors ul,
.taxonomy_anchors li {
list-style-type: none;
padding: 0;
margin: 0 !important;
}

.taxonomy_anchors li a {
display: block;
text-decoration: none !important;

}



/* Author Box */

.authorbox {
	--box-avatar-size: 150px;
	--box-avatar-gap:clamp(var(--gap), 2vw, 2em);
    --width-limit: calc(100% - 4.5rem);
    width: 100%;
    max-width: 100%;
    background: var(--gray-light);
    padding-block:3rem;
}

.authorbox_header,
.authorbox_header a {
    color: var(--purple);
    font-weight: bold;
}

.authorbox .ncontain {
    display: grid;
    grid-template-columns:var(--box-avatar-size) 1fr;
    grid-gap:var(--box-avatar-gap);
    max-width: var(--width-standard);
    position: relative;
}

.authorbox_avatar img {
    border-radius: 50%;
    display: block;
}

.authorbox_phone {
    margin:0;
}

@media(max-width:500px){
    .authorbox .ncontain {
        grid-template-columns:1fr;
    }
    .authorbox_avatar img {
    	width:var(--box-avatar-size);
        display: block;
        margin-inline:auto;
    }
    .authorbox_content {
        text-align: center;
    }
    .socialbuttons {
        justify-content: center;
    }
}


/* Social Buttons */

.socialbuttons {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
  }

  .authorbox_desc + .socialbuttons {
    margin-top: -0.5em;
  }
  
  .socialbuttons_link {
    width: 2em;
    height: 2em;
    font-size: 1em;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    transition: .3s;
    align-self: flex-start;
    background-color: var(--purple);
    border: none;
  }
  
  .socialbuttons_link .ncicon {
    color: #fff;
  }
  
  /*
  .socialbuttons_facebook {
    background-color: var(--facebook);
  }
  
  .socialbuttons_twitter {
    background-color:  var(--twitter);
  }
  
  .socialbuttons_linkedin {
    background-color:  var(--linkedin);
  }
  
  .socialbuttons_pinterest {
    background-color:  var(--pinterest);
  }
  
  .socialbuttons_youtube {
    background-color:  var(--youtube);
  }
  
  .socialbuttons_instagram {
    background-color:  var(--instagram);
  }
  
  .socialbuttons_personal {
    background-color: #444;
  }
  
  .socialbuttons_email {
    background-color: #999;
  }
  
  .socialbuttons_wikipedia {
    background-color: #333;
  }
  
  .socialbuttons_vimeo {
    background-color:  var(--vimeo);
  }
  
  .socialbuttons_tumblr {
    background-color:  var(--tumblr);
  }
  */

  .socialbuttons_link:hover {
      background-color: var(--green);
      opacity: 1
  }

  .socialbuttons_link:hover .ncicon {
    color: #fff;
  }


/* Trending */

  
.ncrelposts {
    margin-block: 3rem 0;
}

.ncrelposts .ncard_meta,
.ncrelposts .ncard_desc {
    display: none;
}

.ncrelposts header {
    font-size: var(--txt-xxlarge);
    font-weight: bold;
    font-family: var(--serif);
    color: var(--purple);
    margin-bottom: var(--gap);
}

.ncrelposts .ncontain {
    position: relative;
}

.ncrelposts_columns > .ncard {
    --card-flex-direction: column;
    --image-width: 100%;
    --image-height: 60%;
}

.ncrelposts_columns {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: var(--padding3);
}

@media(max-width:1300px){
    .ncrelposts_columns {
    grid-template-columns: repeat(3,1fr);
    }
}

@media(max-width:960px){
    .ncrelposts_columns {
    grid-template-columns: repeat(2,1fr);
    }
}

@media(max-width:600px){
    .ncrelposts_columns {
    grid-template-columns: 1fr;
    }
    .ncrelposts_columns > .ncard {
        --image-height: 40%;
    }
}


/* Related Posts */

.relatedposts_container {
    position: relative;
}

.relatedposts_innercontainer {
    margin-block: 0 3rem;
    max-width: 600px;
}

.relatedposts_list {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--padding3);
}

.relatedposts_list > .ncard {
    --card-flex-direction: row;
    --image-width: 40%;
    --image-height: 70%;
    --text-padding: 0 0 0 1em;
    --text-color: var(--green);
}

.relatedposts_list .ncard_readtime {
    font-size: var(--txt-xsmall)
}

.relatedposts header {
    font-weight: bold;
    font-size: var(--txt-large);
    font-family: var(--serif);
    color: var(--purple);
    text-transform: uppercase;
    margin-bottom: var(--gap);
    line-height: normal;
}

@media(min-width:1650px){

    .relatedposts_container {
        order:-1;
    }
    .relatedposts_innercontainer {
        position: absolute;
        left: 110%;
        width: 360px;
        margin-block: 30% 0;
    }

    .relatedposts_list > .ncard {
        --card-flex-direction: row-reverse;
        --text-padding: 0 1em 0 0;
    }
    
}


body.single .ncontent_main {
    display: flex;
    flex-direction: column;
}

#maintitle {
    order: -2;
}

.featuredimage {
    order: -2;
}


/* Prev and Next Links */

.np_container {
    display: flex;
    gap: var(--gap);
    justify-content: space-between;
    margin-block: var(--gap);
  }
  
  .np_container a {
    display:block;
    color: var(--green);
    font-weight: 500;
    text-decoration: underline;
    flex-basis: 50%;
    flex-grow: 1;
  }

  .np_container a[rel=next]{
    text-align: right;
  }
  
  .np_container a:hover {
    color: var(--purple);
  }
  

/* Popup */
  
#popup .ncpopup { 
    background: var(--purple) url() no-repeat center;
    background-size: cover;
    padding:2.5em; 
    /*
    display:flex; 
    align-items:center; 
    justify-content:center; 
    */
    text-align:center;  
    color:#ffffff;
    width:100%;
    max-width: 400px;
    min-height: 400px;
    box-shadow: 0 3px 1em rgba(0,0,0,0.5);
    position: relative;
    margin:0 auto;
  }
  
  /* for frontend */
  #popup .ncpopup {
    transition: 0.5s;
    transition-delay: 0.5s;
    opacity: 0;
    top:-400px;
  }
  
  #popup .ncpopup_close {
    background: transparent;
    padding:1em;
    position: absolute;
    right:0; 
    top:0;
    cursor: pointer;
    border:none;
    display:block;
    color: #ffffff;
  }
  
  
  #popup.ncpopup_overlay {
    position: fixed;
    left:0; top:0; right:0; bottom:0;
    width:100% !important;
    max-width:100% !important;
    height: 100% !important;
    /*
    display:flex;
    align-items: center;
    justify-content: center;
    */
    z-index: 99998;
    padding: 3rem 0.75rem;
    visibility: hidden;
    opacity:0;
    transition:0.5s;
    overflow: auto;
  }
  
  #popup.ncpopup_overlay:before {
    content:'';
    opacity: 0.5;
    background-color: #000;
    position: fixed;
    left:0; top:0; right:0; bottom:0;
    width:100%; height:100%;
    display:block;
  }
  
  #popup.ncpopup_overlay.open {
    visibility: visible;
    opacity:1;
  }
  
  #popup.ncpopup_overlay.open .ncpopup {
    opacity:1;
    top:0;
  }
  
  #popup .newsletterlogo {
  display:block;
  width: 100%
  }
  
  #popup .newsletterlogo img {
  margin-inline: auto;
  display:block
  }