/*------------------------------------*\
    
    Hide/Show Text Area - Global styling for all hide/show text

    This method is CSS heavy and light on JS, which is important for good SEO and CWV results
    Find the code snippet here: https://webfxcodelibrary.webpagefxstage.com/#intermediate_cssshowhidetext

\*------------------------------------*/

  
.read-more {
	display: block;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: var( --readMoreLines );
	overflow: hidden;
}

.read-more--toggle,
.read-more--cta {
    margin-top: 1.2rem; /* Adjust to match site design */
}

/* fix - display: -webkit-box; prevents margins from collapsing */
.read-more__content p {
    margin-top: 0;
}

a.js-read-more-expand {
    display: inline-block;
    cursor: pointer;
    margin-top: 10px;
    text-decoration: none;
}
.js-read-more-expand::after {
    content: "\e90b";
    font-family: var(--westmemorials-icon);
    font-size: 10px;
    font-style: normal;
    font-weight: normal;
    padding-left: 5px;
    top: -1px;
    position: relative;
}

.js-read-more-expand.expand-text::after {
    content: "\e90e";
}