/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
*/

/* READ MORE BUTTON */
.je-btn-load-more{
    
}

.je-loading{
    display: none;
}

.post-content .post-iframe-wrapper{
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
}

.post-content iframe{
    width: 100%;

}

.post-content .post-iframe-wrapper iframe{
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
}

.je-read-more-container{
    position: relative;
    overflow: hidden;
}

.je-read-more-container::after{
    content: '';
    position: absolute;
    width: 100%;
    height: 3.75rem;
    bottom: 0;
    pointer-events: none;
    background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.5) 32%, #fff 100%);
    background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.5) 32%, #fff 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.5) 32%, #fff 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#ffffff', GradientType=0);
}

.je-read-more-container ~ .widget-je-widget-premium-content{
    display: none;
}

.je-btn-readmore-container {
    position: absolute;
    left: 0;
    right: 0;
    z-index: 1;
    bottom: 0px;
    display: block;
}

/* .je-btn-readmore {
    color: #fff;
    background-color: #f9433b;
    text-transform: uppercase;
    padding: 4px 10px;
    font-size: 12px;
    display: table;
    margin: 0 auto;
    font-weight: 500;
    transition: all .2s ease-in-out;
    cursor: pointer;
} */

.je-btn-readmore svg {
    width: .875em;
    display: inline-block;
    font-size: inherit;
    height: 1em;
    overflow: visible;
    vertical-align: -.125em;
    margin-left: 5px;
}

.read-more-container:after {
    content: "";
    background: linear-gradient(180deg,hsla(0,0%,100%,0),#f4f4f4);
    height: 80px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
}
/* END READ MORE BUTTON */

.widget-je-widget-category-last-popular {
    max-width: 300px;
}
@media (max-width: 960px) {
    .widget-je-widget-category-last-popular {
        max-width: 100%;
    }   
}
.latest-popular-block.borderless {
    border: 0px;
}
.latest-popular-block .uk-tab::before {
    left: 0px!important;
}

.more-sections-background-padding{
    padding: 20px !important;
    padding-bottom: 40px;
}

/* hp MYJE */

.myje-healine{
    max-height: 30px;
}

.myje-category-item{
    display: flex;
    flex-direction: column;
}

/* NEWSLETTER */

.uk-section-primary-overlay{
    background-color: #f9433b40;
}

.uk-button.newsletter-btn{
    display: none;
}


.uk-text-decoration-underline{
    text-decoration: underline;
}

/* brand-channel single post */
.tax-brand-channel .hero-section{
    background-color: #747F8A;
}

.tax-brand-channel .hero-section .uk-text-muted, .tax-brand-channel .hero-section .widget-je-widget-modified-date{
    color: #C4C4C4 !important;
}

.menu-sticky-suplements .uk-active a{
    color: #f9433b;
}

.je-newsletters .je-box{
    min-height: 150px;
    display: flex;
    align-items: flex-end;
}



/* newsletters */
.toggle {
	align-items: center;
	border-radius: 100px;
	display: flex;
	font-weight: 700;
	margin-bottom: 16px;
    margin-top: 10px;
}

.toggle__input {
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	height: 1px;
	overflow: hidden;
	position: absolute;
	white-space: nowrap;
	width: 1px;

	
}

/* .toggle__input:not([disabled]):active + .toggle-track,
.toggle__input:not([disabled]):focus + .toggle-track {
    border: 1px solid transparent;
    box-shadow: 0px 0px 0px 2px #000;
} */

.toggle__input:disabled + .toggle-track {
    cursor: not-allowed;
    opacity: 0.7;
}

.toggle-track {
	background: #b1b1b1;
    box-shadow: inset 0 0 5px rgb(0 0 0 / 80%);
	border-radius: 100px;
	cursor: pointer;
	display: flex;
	height: 30px;
	margin-right: 12px;
	position: relative;
	width: 60px;
}

.toggle-indicator {
	align-items: center;
	background: #fff;
	border-radius: 24px;
	bottom: 3px;
	display: flex;
	height: 24px;
	justify-content: center;
	left: 2px;
	/* outline: solid 2px transparent; */
	position: absolute;
	transition: 0.3s;
	width: 24px;
}

.checkMark {
	fill: #F9423A;
	height: 20px;
	width: 20px;
	opacity: 0;
	transition: opacity 0.3s ease-in-out;
}

.checkMark svg{
    vertical-align: baseline;
}

.toggle__input:checked + .toggle-track .toggle-indicator {
	background: #fff;
	transform: translateX(30px);
}

.toggle__input:checked + .toggle-track .toggle-indicator .checkMark{
    opacity: 1;
    transition: opacity 0.3s ease-in-out;
}

@media screen and (-ms-high-contrast: active) {
	.toggle-track {
		border-radius: 0;
	}
}

.premium-content-message {
    margin: 40px 0 40px 0;
    background-color: #eeeeee;
    padding: 50px;
    text-align: center;
    font-size: 20px;
}