/*
Theme Name: Kokoro Child
Theme URI: 
Description: Kokoro Child Theme
Author: Techindustan
Author URI: 
Template: kokoro
Version: 1.0.1
*/

/* Add your custom styles here */

* {
    box-sizing: border-box;
    margin: 0;
    font-family: var(--font-family);
}

a {
    text-decoration: none;
}

body {
    background-color: #fff !important;
}

/* Theme Font */
/* @import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap'); */


@font-face {
    font-family: 'kokoro';
    src: url('/wp-content/themes/kokoro-child/assets/fonts/Trap-ExtraBold.woff2') format('woff2');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'kokoro';
    src: url('/wp-content/themes/kokoro-child/assets/fonts/Trap-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'kokoro';
    src: url('/wp-content/themes/kokoro-child/assets/fonts/Trap-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

/* Global Variables */
:root {
    --white-color: #ffffff;
    --primary-color: #FFFBF2;
    --secondary-color: #00ff00;
    --text-color: #263238;
    --font-family: 'kokoro';
    /* --inter-font: "Inter", sans-serif; */
    --dark-green: #B0C6C1;
    --light-green: #E6EDEB;
    --dark-flesh: #FECCBF;
    --light-flesh: #FFEFEA;
    --dark-palepurple: #F1DFFD;
    --light-palepurple: #FAF5FE;
    --portland-orange: #FC5A31;
    --Llavender-indigo: #9747FF;
    --brunswick-green: #004638;
    --Gray81: #CFCFCF;
    --danger: #F44336;
    --large-font-size: clamp(28px, 4.35vw, 64px);
    --mid-heading-size: clamp(22px, 4.15vw, 48px);
    --sub-text-size: clamp(18px, 1.15vw, 22px);
    --title-text-size: clamp(18px, 1.92vw, 32px);

    --text-size: clamp(16px, 1.25vw, 20px);
    --text-md-size: clamp(15px, 1.25vw, 18px);

    --normal-text-size: clamp(12px, 2.25vw, 16px);
    --button-text-size: clamp(14px, 1.15vw, 19px);

    --post-heading-size: clamp(20px, 2.15vw, 42px);
    --h5-heading-size: clamp(22px, 3.15vw, 28px);
    --p-text-size: clamp(14px, 1.15vw, 16px);
    --h2-singlepost: clamp(20px, 2.55vw, 28px);
}

/* width */
::-webkit-scrollbar {
    width: 4px;
    height: 4px;
}

/* Track */
::-webkit-scrollbar-track {
    background: var(--light-flesh);
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: var(--dark-flesh);
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: var(--portland-orange);
}
.temp-hide {
    display: none !important;
    opacity: 0;
}
p {
    margin-bottom: 0;
    font-size: var(--text-md-size);
    font-family: var(--font-family);
    font-style: normal;
    font-weight: 300;
    line-height: 150%;
}

p:empty {
    display: none;
}

h1,
h1.elementor-heading-title {
    font-size: var(--large-font-size);
    font-style: normal;
    font-weight: 800;
    line-height: normal;
    font-family: var(--font-family);
}

h2,
h2.elementor-image-box-title {
    font-size: var(--mid-heading-size);
    font-style: normal;
    font-weight: 800;
    line-height: normal;
    font-family: var(--font-family);
}

h3,
h3.elementor-heading-title {
    font-size: var(--large-font-size);
    font-style: normal;
    font-weight: 800;
    line-height: normal;
    font-family: var(--font-family);
}

h4,
h4.elementor-heading-title {
    font-size: var(--sub-text-size);
    font-style: normal;
    font-weight: 800;
    line-height: normal;
    font-family: var(--font-family);
}

h5,
h5.elementor-heading-title {
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    font-size: var(--h5-heading-size);
    line-height: 120%;
    margin-bottom: 4px;
    font-family: var(--font-family);
}

.text-editor-content p,
.text-editor-content li,
.text-editor-content a {
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    font-size: 18px;
    line-height: 150%;
}


.color-orange {
    background-color: var(--dark-flesh);
    padding: 3px 4px;
}

.color-purlple {
    background-color: var(--dark-palepurple);
    padding: 3px 4px;
}

.color-green {
    background-color: var(--dark-green);
    padding: 3px 4px;
}

.elementor-button .elementor-button-text {
    position: relative;
    display: flex;
    align-items: center;
}

header#masthead {
    border-bottom: 1px solid #F2F2F2;
    background: var(--primary-color);
}

.ehf-header #masthead {
    z-index: 333;
    position: sticky;
    top: 0;
    transition: all 0.5s ease;
}

.singlePost h1 {
    font-family: var(--font-family);
    font-weight: 800;
    font-size: var(--post-heading-size);
}

.singlePost h2 {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: var(--h2-singlepost);
    line-height: 120%;
    margin-bottom: 6px;
    margin-top: 16px;
}

.singlePost h2~p:has(b) {
    margin-top: 12px;
}

.singlePost h3 {
    font-family: var(--font-family);
    font-weight: 700;
    margin-top: 24px;
    color: #000000 !important;
    opacity: 0.9;
    letter-spacing: 0;
    margin-bottom: 16px;
    margin-left: 0;
    font-size: 20px;
}


.singlePost h4 {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: var(--text-md-size);
    margin-top: 30px;
}

.singlePost h5 {
    font-family: var(--font-family);
    font-weight: 700;
}

.singlePost h6 {
    font-family: var(--font-family);
    font-weight: 600;
    font-size: var(--p-text-size);
}

.singlePost li,
.singlePost p,
.singlePost li p,
.singlePost a,
.singlePost b,
.singlePost strong,
.singlePost em,
.singlePost i,
.singlePost cite,
.singlePost q,
.singlePost p span,
.singlePost li span {
    font-family: var(--font-family);
    /* font-size: var(--p-text-size); */
}

.singlePost b,
.singlePost strong {
    font-weight: bold;
}

.singlePost li {
    margin-bottom: 8px;
}

.singlePost ul,
.singlePost ol {
    padding-left: 2.2em;
    margin-bottom: 2em;
}

.singlePost .postContent a {
    color: #263238;
    text-decoration: none;
    border-bottom: 1px solid;
    border-bottom-width: 2px;
    border-bottom-color: #e1e1e1;
    transition: border .2s;
}

.singlePost .postContent a:hover {
    border-bottom-color: #5CDB5C;
}

.singlePost .elementor-image-box-wrapper a {
    border: none;
}

.singlePost p {
    margin-bottom: 12px;
}

.singlePost .postContent .elementor-element {
    padding: 0;
}

.singlePost .postContent .e-con>.e-con-inner {
    gap: 0;
    padding: 0;
}

.singlePost .qsm-quiz-container,
.singlePost .fun-facts {
    margin: 20px 0 !important;
}

.singlePost h3 span {
    font-weight: 600 !important;
}

.singlePost p b,
.singlePost p strong {
    font-size: var(--sub-text-size);
}

.singlePost ul li b,
.singlePost ul li strong,
.singlePost ul li p b,
.singlePost ul li p strong {
    font-size: var(--p-text-size);
}

/* .singlePost p:has(b),
.singlePost p:has(strong) {
  margin-top: 30px;
} */
.singlePost .quiz-col .elementor-widget-container>ol,
.singlePost .pro-tip .elementor-widget-container>ol,
.singlePost .fun-facts .elementor-widget-container>ol {
    display: flex;
    margin: 0;
    padding: 0;
    gap: 12px;
    list-style: none;
    line-height: normal;
    margin-bottom: 12px;
}

.singlePost .quiz-col .elementor-widget-container>ol>li,
.singlePost .pro-tip .elementor-widget-container>ol>li,
.singlePost .fun-facts .elementor-widget-container>ol>li {
    line-height: normal;
    height: 20px;
    font-weight: 600;
    color: #124637;
    padding-left: 20px;
}

.singlePost .prompt_heading {
    margin-top: 10px;
}

.singlePost .quiz-col .elementor-widget-container {
    padding: 20px;
    background: #fffdfd;
    border-radius: 16px;
    border: 1px dashed #202020;
    margin-top: 20px;
    margin-bottom: 20px;
}

.singlePost .pro-tip .elementor-widget-container {
    padding: 20px;
    background: #FFEFEA;
    border-radius: 16px;
    border: 1px dashed #FC5A31;
}

.singlePost .quiz-col .elementor-widget-container>p,
.singlePost .pro-tip .elementor-widget-container>p {
    margin-bottom: 10px;
}

/* New Update  Font Size Guidelines for Articles */

.single-exclusive .singlePost h1,
.single-post .singlePost h1 {
    font-size: 42px;
    font-weight: bold;
    margin-bottom: 1rem;
}

.single-exclusive .singlePost h2 a,
.single-post .singlePost h2 a {
    letter-spacing: 0;
    margin-top: 0;
    margin-bottom: 24px;
    margin-left: 0;
    padding-top: 30px;
    font-size: 26px;
    font-weight: 700;
    line-height: 150%;
}

.single-exclusive .singlePost h2,
.single-post .singlePost h2 {
    letter-spacing: 0;
    margin-top: 0;
    margin-bottom: 24px;
    margin-left: 0;
    padding-top: 30px;
    font-size: 26px;
    font-weight: 700;
    line-height: 150%;
}

.single-exclusive .singlePost h3 .single-post .singlePost h3 {
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 0.5rem;
}

.single-exclusive .singlePost h4,
.single-post .singlePost h4 {
    font-size: 18px;
    font-weight: bold;
    margin: 0;
    margin-bottom: 0.5rem;
    color: #6b6b6b;
}

.single-exclusive .singlePost h5,
.single-post .singlePost h5 {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 0.5rem;
}

.single-exclusive .singlePost h6,
.single-post .singlePost h6 {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 0.5rem;
}

.single-exclusive .singlePost p, .single-exclusive .singlePost p span,
.single-post .singlePost p, .single-post .singlePost p span {
    font-size: 18px;
    margin-bottom: 1.4rem;
    line-height: 1.8;
}

.singlePost p.elementor-heading-title {
    font-weight: 600;
    opacity: 0.9;
    margin-top: 16px;
}

.single-exclusive .singlePost p:last-child,
.single-post .singlePost p:last-child {
    margin-bottom: 0.5rem;
}

.single-exclusive .singlePost ul li b,
.single-exclusive .singlePost ul li strong,
.single-exclusive .singlePost ul li p b,
.single-exclusive .singlePost ul li p strong,
.single-post .singlePost ul li b,
.single-post .singlePost ul li strong,
.single-post .singlePost ul li p b,
.single-post .singlePost ul li p strong {
    font-size: 18px;
    font-weight: 600;
}

.single-post .singlePost li b,
.single-exclusive .singlePost li b {
    font-weight: 600;
}

.single-exclusive .singlePost li b,
.single-exclusive .singlePost li span,
.single-exclusive .singlePost li,
.single-post .singlePost li b,
.single-post .singlePost li span,
.single-post .singlePost li {
    font-size: 18px;
    margin-bottom: 1rem;
    line-height: 1.8;

}

.single-exclusive .singlePost ul ul li,
.single-post .singlePost ul ul li {
    margin-bottom: 0.5rem;
    line-height: 1.6;
}

.single-exclusive .singlePost ul ul,
.single-post .singlePost ul ul {
    margin-bottom: 0.5rem;
}

.single-exclusive .singlePost a,
.single-post .singlePost a {
    font-size: 18px;
}

.single-exclusive .singlePost p strong, .single-exclusive .singlePost p b,
.single-post .singlePost p strong, .single-post .singlePost p b {
    font-weight: bold;
    font-size: 18px;
}

/* .singlePost ol ul,
.singlePost ul ul, .singlePost ol ol {
    padding-left: 14px;
    margin-bottom: 0.5rem;
} */
.single-exclusive .singlePost ol li::marker,
.single-post .singlePost ol li::marker {
    color: var(--brunswick-green);
    font-weight: bold;
    line-height: normal;
}

.single-exclusive .singlePost ul li::marker,
.single-post .singlePost ul li::marker {
    font-size: 150%;
    color: var(--portland-orange);
    line-height: normal;
    /* animation: liping 2s ease 1s infinite normal forwards;
    -webkit-animation: liping 2s ease 1s infinite normal forwards; */
}

.single-exclusive .singlePost ul ul li::marker,
.single-post .singlePost ul ul li::marker {
    font-size: 150%;
    color: var(--portland-orange);
    line-height: normal;
    /* animation: liping 10s ease 8s infinite normal forwards;
    -webkit-animation: liping 10s ease 8s infinite normal forwards; */
}

@keyframes liping {
    0% {
        opacity: 0.8;
        transform: scale(0.2);
    }

    80% {
        opacity: 0.9;
        transform: scale(1.2);
    }

    100% {
        opacity: 0;
        transform: scale(2.2);
    }
}

.single-exclusive .singlePost blockquote:has(em) em p,
.single-exclusive .singlePost blockquote:has(em) em span,
.single-post .singlePost blockquote:has(em) em p,
.single-post .singlePost blockquote:has(em) em span {
    font-size: 24px;
    padding: 6px 2px;
    text-decoration: none !important;
}

blockquote:has(em) {
    padding-left: 30px;
    margin-bottom: 0;
}

.single-exclusive .singlePost blockquote:has(em) em,
.single-post .singlePost blockquote:has(em) em {
    background-color: #ededed;
    line-height: normal;
    padding: 8px 3px 6px;
}

.single-exclusive .singlePost:has(em) ol,
.single-post .singlePost:has(em) ol {
    padding-left: 30px;
}

.single-exclusive .singlePost:has(em) ol blockquote,
.single-post .singlePost:has(em) ol blockquote {
    padding: 0;
}

.single-exclusive .singlePost:has(em) li,
.single-post .singlePost:has(em) li {
    margin-bottom: 8px;
}

/* .single-post .singlePost li {
 padding-left: 30px;
 position: relative;
} */

/* .single-post .singlePost ul, .single-post .singlePost ol {
 padding-left: 0;
 list-style: none;
 margin: 0;
}  */


/* Header CSS */
.nav-up {
    transform: translateY(-100%);
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
}

.nav-down {
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
}

.main-menu .hfe-nav-menu-icon {
    line-height: 0;
}

.header-btn-kokoro {
    width: 100%;
}

.header-btn-kokoro a.elementor-button {
    width: 100%;
    text-align: center;
}

.header-btn-kokoro .elementor-button .elementor-button-text {
    color: var(--white-color);
    text-align: center;
    font-size: var(--button-text-size);
    justify-content: center;
    font-style: normal;
    font-weight: 800;
    line-height: 120%;
    text-transform: uppercase;
    text-shadow: none;
    transform: translateY(2px);
}

.header-btn-kokoro .elementor-button .elementor-button-text::after {
    display: none;
}

.header-btn-kokoro a.elementor-button:hover {
    text-decoration: none;
}

.main-menu .hfe-flyout-wrapper .hfe-side.hfe-flyout-right {
    width: 100%;
}

nav.menu-is-active a.hfe-menu-item {
    color: var(--text-color) !important;
    font-family: var(--font-family);
    font-size: 64px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
}

.p-tag,
.p-tag span {
    line-height: 160%;
    font-family: var(--font-family);
}

.lottie-card dotlottie-player {
    padding: 20px 40px 10px;
}

/* Mega Menu CSS */
@keyframes megamenu {
    0% {
        opacity: 0;
        transform: translateY(-100px);
        -webkit-transform: translateY(-100px);
        -moz-transform: translateY(-100px);
        -ms-transform: translateY(-100px);
        -o-transform: translateY(-100px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}


.child-menu-container {
    max-width: 1388px;
    margin: 0 auto;
    display: flex;
    padding: 24px 24px 30px 24px;
    justify-content: center;
    align-items: flex-start;
    gap: 24px;
}

.menu-categories {
    width: 35%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.menu-articles {
    width: 65%;
}

.category-wrap {
    visibility: hidden;
    opacity: 0;
    height: 0;
}

/* .menu-category-mind {
    display: block;
} */
.menu-category-mind.mactive,
.menu-category-body.mactive,
.menu-category-self.mactive,
.child-menu-container:has(.m-menu.mactive:hover) .menu-category-mind,
.child-menu-container:has(.b-menu.mactive:hover) .menu-category-body,
.child-menu-container:has(.s-menu.mactive:hover) .menu-category-self {
    visibility: visible;
    height: auto;
    animation: arthov 0.5s ease 0.2s 1 normal forwards;
}

@keyframes arthov {
    0% {
        opacity: 0;
        transform: translateY(50px);
        -webkit-transform: translateY(50px);
        -moz-transform: translateY(50px);
        -ms-transform: translateY(50px);
        -o-transform: translateY(50px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
    }
}

.child-menu-container:has(.b-menu:hover) .menu-category-mind,
.child-menu-container:has(.s-menu:hover) .menu-category-mind {
    visibility: hidden;
    opacity: 0;
    height: 0;
}

/* .child-menu-container:has(.b-menu:hover) .m-menu,
.child-menu-container:has(.s-menu:hover) .m-menu {
    background: none;
    border-left: none;
    background-position:unset;
} */


.m-menu.mactive {
    padding-left: 20px;
    padding-right: 15px;
    transition: all 0.2s ease;
}

.m-menu.mactive, .m-menu.mactive:hover {
    background-position: left bottom;
    border-left: 4px solid var(--Mind, #FC5A31);
}

.m-menu:hover .titlecat-menu {
    color: #FC5A31;
}

.m-menu:hover .titlecat-menu .arrow-icon svg path {
    fill: #FC5A31;
    stroke: #FC5A31;
}

.m-menu {
    background: linear-gradient(to right, rgba(252, 90, 49, 0.10) 50%, white 50%);
}

.b-menu.mactive,
.b-menu:hover {
    background-position: left bottom;
    border-left: 4px solid var(--Mind, #004638);
}

.b-menu:hover .titlecat-menu {
    color: #004638;
}

.b-menu:hover .titlecat-menu .arrow-icon svg path {
    fill: #004638;
    stroke: #004638;
}

.b-menu {
    background: linear-gradient(to right, rgb(0 70 56 / 10%) 50%, white 50%);
}

.s-menu.mactive,
.s-menu:hover {
    background-position: left bottom;
    border-left: 4px solid var(--Mind, #BE6FF6);

}

.s-menu {
    background: linear-gradient(to right, rgb(190 111 246 / 5%) 50%, white 50%);
}


.s-menu:hover .titlecat-menu .arrow-icon svg path {
    fill: #BE6FF6;
    stroke: #BE6FF6;
}

.s-menu:hover .titlecat-menu {
    color: #BE6FF6;
}

.category-item.mactive {
    padding-left: 16px;
    padding-right: 16px;
}

.b1, .s1 {
    margin-top: 16px;
}

.category-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px 0;
    cursor: pointer;
    border-radius: 20px;
    background-size: 200% 100%;
    background-position: right bottom;
    transition: all 0.2s ease;
}

.category-item:hover {
    padding-left: 20px;
    padding-right: 15px;
    transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
}

/* .category-item:hover .titlecat-menu {
    text-decoration: underline;
} */


.category-item img {
    width: clamp(47px, 7.25vw, 97px);
    height: clamp(47px, 7.25vw, 97px);
}

.titlecat-menu {
    color: #263238;
    font-family: 'kokoro';
    font-size: 20px;
    font-style: normal;
    font-weight: 800;
    line-height: 120%;
    /* 24px */
    display: flex;
    align-items: center;
    gap: 4px;
    transition: all 0.2s ease;
}

.titlecat-menu .arrow-icon svg {
    width: 30px;
    transform: translateY(-2px);
}

.articlelink-menu {
    width: calc(100% - 235px);
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.titlecat-menu .arrow-icon {
    opacity: 0;
}

.category-item:hover .titlecat-menu .arrow-icon {
    opacity: 1;
}

.titlemenu-art {
    margin-bottom: 0;
    color: var(--dark-blue-text, #263238);
    font-family: 'kokoro';
    font-size: clamp(14px, 1.25vw, 18px);
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    letter-spacing: -0.1px;
    margin-top: 16px;
    transition: all 0.2s ease;
    text-transform: none;
}

.articlelink-menu .menu-play-icon svg {
    width: 32px;
}

.articlelink-menu .menu-play-icon svg path {
    fill: #FC5A31;
}

.catcol p {
    color: var(--Grey-text, #868686);
    font-family: 'kokoro';
    font-size: clamp(11px, 1.25vw, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
    max-width: 290px;
    width: 100%;
}

.top-article {
    border-radius: 17.425px;
    background: var(--Card-Textbox, #FDF7E8);
    display: flex;
    align-items: center;
    gap: 11.304px;
    margin: 16px 0 0 0;
    overflow: hidden;
    transition: all 0.2s ease;
}

.category-item.m-menu,
.top-article:first-child {
    margin-top: 0;
}

.top-article:hover .titlemenu-art {
    color: #FC5A31;
    transition: all 0.2s ease;
}

.menu-read-info {
    display: flex;
    gap: 8px;
}

.articleToplink {
    display: flex;
    width: 100%;
    justify-content: space-between;
}

.articleToplink img {
    width: 100%;
    max-width: 235.13px;
    object-fit: cover;
    height: 132.261px;
}

.read-badge {
    border-radius: 6.534px;
    background: rgba(0, 70, 56, 0.10);
    display: flex;
    padding: 4px 8px;
    justify-content: center;
    align-items: center;
    gap: 4px;
}

.read-badge .me-read-time {
    color: var(--Body, #004638);
    font-family: 'kokoro';
    font-size: clamp(12px, 1.25vw, 14px);
    font-style: normal;
    font-weight: 500;
    line-height: 130%;
    padding: 3px 0 0 0;
}

.notebook {
    display: flex;
}

.notebook svg {
    display: flex;
    width: 23px !important;
    height: 24px !important;
    object-fit: contain;
}


.toggle-section {
    display: none;
}





@media screen and (min-width: 1024.99px) {
    .mega-menu {
        position: fixed;
        width: 100%;
        top: 68px;
        left: 0;
        background: #ffff;
        visibility: hidden;
        opacity: 0;
        box-shadow: 0px 50vmax 0 50vmax rgba(156, 156, 156, 0.5);
        overflow: auto;
        transform: translateY(-1000px);
        /* z-index: -1; */
    }

    .mega-menu.active {
        overflow: hidden;
        visibility: visible;
        opacity: 1;
        border-radius: 0 0 16px 16px;
        animation: megamenu 0.3s linear 0.2s 1 normal forwards;

    }

    #page:has(.mega-menu.active) .site-content-contain {
        z-index: -1;
        position: relative;
    }
}

@media screen and (max-width: 1080px) {

    .articlelink-menu {
        width: calc(100% - 165px);
    }

    .articleToplink img {
        max-width: 165px;
        height: 120.261px;
    }
}

@media screen and (max-width: 1024.99px) {

    .toggle-section {
        border: 1px solid #eaeaea;
        border-radius: 5px;
    }

    .toggle-header {
        background-color: #F2F2F7;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: space-between;
        color: #263238;
        font-family: 'kokoro';
        font-size: 18px;
        font-style: normal;
        font-weight: 600;
        line-height: 2;
        padding: 12px 16px;
    }

    .toggle-item {
        border-bottom: 1px solid #D4D6D7;
    }

    .arrow-togg svg.icon {
        width: 18px;
        height: 24px;
    }

    .toggle-content .category-wrap {
        visibility: visible;
        opacity: 1;
        height: unset;
    }

    .top-article a.articleToplink {
        display: flex !important;
    }

    .category-icon {
        margin-right: 8px;
        /*  margin-top: -4px; */
    }

    .category-icon img {
        width: 32.64px;
        height: 32.64px;
    }

    .toggle-content {
        display: none;
        padding: 0 15px 15px 16px;
        background-color: #F2F2F7;
    }

    .toggle-content .category-wrap .top-article {
        border-radius: 8px;
        margin: 12px 0 0 0;
    }

    .toggle-content .category-wrap .top-article:first-child {
        margin-top: 0;
    }

    /* .article-card {
        display: flex;
        justify-content: space-between;
        border-bottom: 1px solid #ddd;
        padding: 10px 0;
    } */

    .article-details {
        flex: 1;
    }

    .article-details h3 {
        font-size: 16px;
        margin: 5px 0;
    }

    .article-image {
        width: 100px;
    }

    .article-image img {
        width: 100%;
        border-radius: 5px;
    }

    .read-time, .audio-play {
        font-size: 14px;
        margin-right: 5px;
        color: #555;
    }

    .main-header nav .sub-menu .menu-item {
        display: none !important;
    }

    .main-header nav .main-menu-col .sub-menu a {
        padding-left: 0;
        display: flex;
        align-items: center;
    }

    .arrow-togg {
        width: 32px;
        height: 32px;
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }

    .toggle-header.active svg.icon {
        transform: rotate(180deg);
        transition: transform 0.2s ease;
        fill: var(--portland-orange);
    }

    .toggle-header svg.icon {
        transition: transform 0.2s ease;
    }
}

@media screen and (max-width: 1024.99px) {

    .catcol p,
    .menu-articles {
        display: none;
    }

    .menu-categories {
        width: 100%;
    }

    .mega-menu {
        visibility: hidden;
        opacity: 0;
        height: 0;
        background-color: transparent;
    }

    .mega-menu.active {
        visibility: visible;
        opacity: 1;
        height: auto;
    }
}

@media screen and (max-width: 480.99px) {
    .articleToplink img.artmeimg {
        display: none;
    }

    .articlelink-menu {
        width: 100%;
        padding: 14px;
    }
}


/* Login Screen UI Start*/
.login-page {
    background: #ffffff;
}

.login-page-section {
    display: flex;
    /* align-items: center; */
    max-width: 1400px;
    max-height: 830px;
    justify-content: center;
    background: var(--Background, #FFFBF2);
    margin: auto;
}

.login-page-section .login-left-sec {
    width: 50%;
    text-align: center;
    background: #ffffff;
    padding: 40px 30px;
    height: 100vh;
    min-height: clamp(450px, 55.25vw, 800px);
    max-height: clamp(450px, 55.25vw, 800px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

#check_email_id {
    color: #868686;
    font-family: 'kokoro';
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
}

.login-logo {
    width: 50px;
    height: 50px;
    object-fit: contain;
}

.loIcon svg {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.login-right-sec {
    width: 50%;
    box-shadow: 50vh 0 0 0 rgb(254 251 242);
    overflow: auto;
    padding-top: 40px;
}

input.continue-email {
    border-radius: 8px;
    border: 1px solid var(--Border, #D4D6D7);
    background: var(--White, #FFF);
    color: #747474;
    font-family: 'kokoro';
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 24px */
    display: flex;
    width: 100%;
    max-width: 360px;
    height: 48px;
    padding: 14px 16px 12px 44px;
    align-items: center;
    gap: 10px;
    outline: none;
    margin: 0 auto;
}

.login_form_loader {
    margin-top: 20px;
}

.login_loader {
    width: 20px;
    height: 20px;
    position: relative;
    border-radius: 50%;
    color: rgba(0, 70, 56, 0.429);
    animation: fill 1s ease-in infinite alternate;
}

.login_loader::before, .login_loader::after {
    content: '';
    position: absolute;
    height: 100%;
    width: 100%;
    border-radius: 50%;
    left: 28px;
    top: 0;
    animation: fill 0.9s ease-in infinite alternate;
}

.login_loader::after {
    left: auto;
    right: 28px;
    animation-duration: 1.1s;
}

@keyframes fill {
    0% {
        box-shadow: 0 0 0 2px inset
    }

    100% {
        box-shadow: 0 0 0 10px inset
    }
}

.continue_em_add {
    position: relative;
    max-width: 360px;
    margin: 0 auto;
    width: 100%;
}

.message-icon {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
}

.openGmail-btn,
input.magic_link {
    border-radius: 78px;
    border: 1px solid var(--Body, #004638);
    background: var(--Body, #004638);
    box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
    display: flex;
    padding: 14px 18px 12px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    width: 100%;
    color: var(--White, #FFF);
    font-family: 'kokoro';
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    /* 150% */
    max-width: 360px;
    margin: 0 auto;
    transition: all 0.5s ease;
}

.openGmail-btn {
    margin-top: 20px;
}

.openGmail-btn:hover,
input.magic_link:hover {
    color: var(--Body, #004638);
    background: var(--Body, rgba(0, 70, 56, 0.20));
    transition: all 0.5s ease;
}

form#continue-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-top: 16px;
}

.login-right-sec img {
    width: 100%;
    max-width: 800px;
}

.login-buttons {
    display: inline-flex;
    flex-direction: column;
    gap: 16px;
    max-width: 360px;
    width: 100%;
    margin-top: 32px;
}

.log-comBtn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    align-self: stretch;
    border-radius: 100px;
    border: 1px solid var(--Border, #D4D6D7);
    background: var(--White, #FFF);
    box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
    color: var(--Gray-700, #344054);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    padding: 12px 16px;
}

.logPara {
    color: var(--Gray-600, #475467);
    text-align: center;
    font-family: 'kokoro';
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}

.logTitle {
    color: var(--Gray-900, #101828);
    text-align: center;
    font-family: 'kokoro';
    font-size: clamp(24px, 2.25vw, 30px);
    font-style: normal;
    font-weight: 700;
    line-height: 126.667%;
    margin-bottom: 12px;
    margin-top: 24px;
    transition: all 0.5s ease;
}



.complete-profile-section .logTitle {
    text-align: left;
}

.complete-profile-section .logPara {
    color: var(--Grey-text, #868686);
    text-align: left;
}

.complete-profile-section .continue_section {
    width: 100%;
    text-align: left;
    padding-right: 30px;
}

.continue-form-sec label {
    color: var(--dark-blue-text, #263238);
    font-family: 'kokoro';
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 150%;
    display: block;
    margin-bottom: 6px;
}

.continue-form-sec .continue_em_add {
    max-width: 50%;
    margin: unset;
    float: left;
}

.continue-form-sec input, .continue-form-sec select {
    border-radius: 8px;
    border: 1px solid var(--Border, #D4D6D7);
    background: none;
    width: 100%;
    display: block;
    height: 48px;
    padding: 14px 16px 12px;
    gap: 10px;
    outline: none;
    z-index: 2;
    position: relative;
    appearance: none;
}

input[type="date"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-calendar-picker-indicator {
    opacity: 0;
    -webkit-appearance: none;
}

.continue-form-sec .uspro-icon-arrow,
.continue-form-sec .uspro-icon-calender {
    z-index: 0;
    cursor: pointer;
}

form#complete-form {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

button.complete_profile {
    border-radius: 132px;
    background: var(--Mind, #FC5A31);
    color: var(--White, #FFF);
    font-family: 'kokoro';
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 28px;
    /* 175% */
    display: flex;
    max-width: 353px;
    width: 100%;
    height: 48px;
    padding: 16px 24px 14px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border: none;
    outline: none;
}

.formfil-grp {
    display: flex;
    gap: 30px;
    padding-top: 30px;
}

.complete-profile-section .login-left-sec {
    max-height: max-content;
}

.interests {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 10px;
}

.col-inter {
    display: flex;
}

form#complete-form .uspro-form-group {
    margin-bottom: 15px;
}

.titletextiner {
    color: var(--dark-blue-text, #263238);
    font-family: 'kokoro';
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
}

.para-text-inter {
    color: var(--dark-blue-text, #263238);
    font-family: 'kokoro';
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    margin-bottom: 20px;
    flex: 1 0 0;
    width: 100%;
}

.interest {
    padding: 10px 16px 8px;
    border: 1px solid #d9d9d9;
    border-radius: 50px;
    background-color: #fff;
    color: #333;
    cursor: pointer;
    font-size: 14px;
    transition: background-color 0.3s ease;
}

.container-interest {
    border-radius: 20px;
    background: var(--Background, #FFFBF2);
    display: flex;
    padding: 20px;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
}

.interest.selected {
    background-color: #2e3c45;
    /* Dark background for selected items */
    color: #fff;
    /* White text color for selected items */
}

.interest:hover {
    background-color: #2e3c45;
    /* Dark background on hover */
    color: #fff;
}

@media screen and (max-width: 1023.99px) {
    .mobtab-scroll {
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        white-space: nowrap;
        position: relative;
        width: 100%;
    }

    .col-inter {
        text-decoration: none;
        display: table-cell;
        vertical-align: middle;
        padding: 4px 6px;
        line-height: 1.35;
    }

    .interests {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: 10px;
        display: inherit;
        flex-wrap: inherit;
        padding-left: inherit;
        margin-bottom: inherit;
        list-style: inherit;
    }

    .mobtab-scroll::-webkit-scrollbar {
        width: 0;
        height: 0;
    }
}

@media screen and (max-width: 991.99px) {
    .complete-profile-section .continue_section {
        padding-right: 0;
    }

    .formfil-grp {
        gap: 16px;
        padding-top: 20px;
    }

    form#complete-form {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .complete-profile-section .uspro-form-group {
        margin-bottom: 0;
    }

    .formfil-grp {
        flex-direction: column;
    }

    .continue-form-sec .continue_em_add {
        max-width: 100%;
    }

    .complete-profile-section .login-left-sec {
        height: max-content;
        min-height: unset;
    }

    .login-page-section.complete-profile-section {
        max-height: unset;
    }

}

@media screen and (max-width: 767.99px) {
    .login-page-section {
        flex-direction: column;
    }

    .login-page-section .login-left-sec {
        width: 100%;
        padding: 40px 20px;
        max-height: unset;
        height: 100%;
    }

    .login-right-sec {
        display: none;
    }

    .logPara {
        font-size: 14px;
        line-height: 140%;
    }

    .openGmail-btn, input.magic_link {
        padding: 10px 18px 8px;
        font-size: 14px;
    }

    .interest {
        padding: 8px 16px;
        font-size: 14px;
    }
}





/* Login Screen Ui End */



/* Mega menu CSS end */


/* Account Page UI Start */
.profile-section {
    display: flex;
    align-items: center;
    gap: 30px;
    border-radius: 16px;
    background: var(--Background, #FFFBF2);
    overflow: hidden;
}

.account-wrap {
    max-width: 1374px;
    margin: 0 auto;
    padding: 40px 20px;
}

.pro-img-sec {
    display: flex;
    max-width: 212.088px;
    max-height: 227px;
    width: 100%;
    height: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    background: var(--MInd-Light, #FECCBF);
    overflow: hidden;
}

.pro-img-sec img {
    width: 100%;
    height: 100%;
}

.pro-title {
    color: #263238;
    font-family: 'kokoro';
    font-size: clamp(20px, 3.35vw, 50px);
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
    /* 60px */
    letter-spacing: 1.28px;
    margin-bottom: 12px;
}

.joined-date {
    color: var(--dark-blue-text, #263238);
    font-family: 'kokoro';
    font-size: clamp(14px, 1.25vw, 20px);
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
    /* 28.8px */
    letter-spacing: 1px;
}

.pro-edit-sec {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-top: 20px;
}

.edit_profile_btn {
    border-radius: 8px;
    border: 1px solid var(--Body, #004638);
    background: #F0FFFC;
    display: flex;
    height: 44px;
    padding: 12px 20px 10px 14px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    color: var(--Body, #004638);
}

.edit_profile_btn svg {
    transform: translateY(-2px);
}

.logout-btn {
    border-radius: 8px;
    border: 1px solid #FC5A31;
    background: #ffefeb;
    display: flex;
    height: 44px;
    padding: 10px 14px 10px 14px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    color: #FC5A31;
    cursor: pointer;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
}

.iconlogout {
    width: 20px;
    height: 20px;
    display: inline-flex;
}

.pro-info {
    height: 100%;
    width: 100%;
    padding: 16px 0;
}

button.tablinks {
    color: #263238;
    font-family: 'kokoro';
    font-size: clamp(12px, 1.95vw, 20px);
    font-style: normal;
    font-weight: 600;
    line-height: 28px;
    /* 140% */
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    padding: 10px 24px 10px 16px;
    outline: none;
    transition: all 0.5s ease;
    margin-bottom: -1px;
}

button.tablinks svg {
    margin-right: 8px;
}

button.tablinks.active {
    border-color: #404040;
    transition: all 0.5s ease;
}

.tabcontent {
    display: none;
}

.tabcontent.active {
    display: block;
    background: none !important;
}

.tab {
    margin-top: 40px;
    margin-bottom: 40px;
    border-bottom: 1px solid var(--Border, #D4D6D7);
}

.profilemodal .random_posts.postloader {
    top: 50%;
    transform: translateY(-50%) translateX(-50%);
}

.profilemodal {
    max-width: 630px;
    width: 100%;
    background-color: #fff;
    border-radius: 10px;
    padding: 20px;
    margin: 20px auto;
    font-size: 14px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateY(-50%) translateX(-50%);
    z-index: 99;
    box-shadow: 0 0 0 50vmax rgba(0, 0, 0, 0.5);
}

.profilemodal:before {
    content: '';
    position: absolute;
    width: 100vw;
    height: 100vh;
    left: 50%;
    top: 50%;
    transform: translateY(-50%) translateX(-50%);
    background: rgb(0 0 0 / 0%);
    z-index: -9;
}

.close_profile {
    position: absolute;
    right: 16px;
    top: 16px;
    background: none !important;
    border: none !important;
}

.headingmodal {
    color: var(--Gray-900, #101828);
    font-family: 'kokoro';
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 28px;
    /* 155.556% */
    width: calc(100% - 24px);
    margin-bottom: 2px;
}

.paramodal {
    color: var(--Grey-text, #868686);
    font-family: 'kokoro';
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}

.profilemodal-pic {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    margin-bottom: 20px;
    margin-top: 20px;
    gap: 20px;
}

.profilePic {
    width: 110px;
    height: 110px;
    object-fit: contain;
    border-radius: 50px;
    overflow: hidden;
}

.profilemodal-pic img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.profilemodal-upload-btns {
    display: flex;
    gap: 10px;
}

.profilemodal-upload-btns button {
    padding: 8px 12px;
    cursor: pointer;
    color: var(--dark-blue-text, #263238);
    font-family: 'kokoro';
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    border-radius: 8px;
    border: 1px solid var(--Gray-300, #D0D5DD);
    background: var(--Base-White, #FFF);
    box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
    outline: none;
}

.profilemodal-upload-btns button svg {
    margin-right: 1px;
}

.profilemodal-upload-btns button:hover {
    background-color: #e0e0e0;
}

.recommended-text {
    color: var(--Grey-text, #868686);
    font-family: 'kokoro';
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
    margin-top: 8px;
}

.profilemodal input[type="text"],
.profilemodal input[type="email"],
.profilemodal input[type="date"],
.profilemodal select {
    width: 100%;
    padding: 11px 14px 10px;
    border-radius: 8px;
    border: 1px solid var(--Gray-300, #D0D5DD);
    background: none;
    box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
    color: var(--dark-blue-text, #263238);
    font-family: 'kokoro';
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    outline: none !important;
    appearance: none;
    height: 44px;
    text-align: left;
}

.profilemodal input[type="date"]::-webkit-inner-spin-button,
.profilemodal input[type="date"]::-webkit-calendar-picker-indicator {
    opacity: 0;
    -webkit-appearance: none;
}

#dob {
    display: inline-grid;
    justify-content: flex-start;
}

.icon-col {
    position: relative;
}

.uspro-icon-arrow, .uspro-icon-calender {
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: -1;
    cursor: pointer;
}

.uspro-form-group {
    margin-bottom: 15px;
}

.profilemodal input[type="email"] {
    background-color: #f0f0f0;
    user-select: none;
}

form.profile-form label {
    color: var(--dark-blue-text, #263238);
    font-family: 'kokoro';
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    margin-bottom: 4px;
}

.profilemodal-btn-group {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 12px;
}

.profilemodal-btn-group button {
    display: flex;
    padding: 12px 18px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    flex: 1 0 0;
    outline: none;
}

.profilemodal-btn-save {
    cursor: pointer;
    border-radius: 100px;
    border: 1px solid var(--Body, #004638);
    background: var(--Body, #004638);
    box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
    color: var(--Base-White, #FFF);
    font-family: 'kokoro';
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
}

.profilemodal-btn-save:hover {
    background-color: #043c35;
}

.profilemodal-btn-cancel {
    border-radius: 100px;
    border: 1px solid var(--Gray-300, #D0D5DD);
    background: var(--Base-White, #FFF);
    box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
    color: var(--dark-blue-text, #263238);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    cursor: pointer;
    transition: all 0.5s ease;
}

.profilemodal-btn-cancel:hover {
    background-color: #e0e0e0;
}

.login-dis-article {
    grid-template-columns: 1fr;
    display: grid;
    justify-content: center;
    gap: 20px;
    row-gap: 30px;
    transition: all 0.5s ease;
}

.article-card {
    position: relative;
}

.bookmark-filled-display {
    position: absolute;
    top: 16px;
    right: 16px;
    cursor: pointer;
    border-radius: 100px;
    background: #FFF;
    display: flex;
    width: 46px;
    height: 46px;
    padding: 12px;
    justify-content: center;
    align-items: center;
}

.bookmark-filled-display:hover {
    background: #fefbf2;
    box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.10);
}

.no_saved_articles {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px 0;
}

.no_saved_articles h4 {
    color: var(--dark-blue-text, #263238);
    text-align: center;
    font-family: 'kokoro';
    font-size: clamp(20px, 2.25vw, 36px);
    font-style: normal;
    font-weight: 800;
    line-height: 150%;
}

.no_saved_articles p {
    color: var(--dark-blue-text, #263238);
    text-align: center;
    font-family: 'kokoro';
    font-size: clamp(12px, 1.75vw, 18px);
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}

.no_saved_article_image {
    display: block;
    margin-bottom: 30px;
}

.no_saved_article_image svg {
    width: 100%;
    max-width: 400px;
    height: 100%;
}

@media only screen and (min-width: 640px) {
    .login-dis-article {
        grid-template-columns: 1fr 1fr;
    }
}

@media screen and (min-width: 991.99px) {
    .login-dis-article {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .login-dis-article:has(.no_saved_articles) {
        grid-template-columns: 1fr;
    }

}

@media screen and (max-width: 767.99px) {
    .profilemodal {
        max-width: 96%;
        width: 100%;
        padding: 20px 16px;
    }

    .profilemodal-btn-group button {
        padding: 8px 10px;
        gap: 8px;
    }

    .profilemodal-btn-save,
    .profilemodal-btn-cancel {
        font-size: 14px;
        font-weight: 500;
    }

    .recommended-text {
        font-size: 12px;
    }

    .profile-section {
        padding: 20px;
        display: flex;
        align-items: center;
        gap: 16px;
        border-radius: 0;
        background: var(--Background, #FFFBF2);
        overflow: hidden;
        margin: 0 -20px;
    }

    .pro-img-sec {
        max-width: 140px;
        max-height: 140px;
    }

    .pro-info {
        padding: 0;
    }

    button.tablinks {
        padding: 8px 12px 8px 8px;
    }

    button.tablinks svg {
        margin-right: 6px;
        width: 28px;
        height: 28px;
    }

    .logout-btn,
    .edit_profile_btn {
        height: 40px;
        padding: 10px 12px 10px 8px;
        gap: 6px;
        font-size: 12px;
    }

    .iconlogout,
    .edit_profile_btn svg {
        transform: translateY(-2px);
        width: 19px;
        height: 19px;
    }

    #dob {
        display: inline-grid;
        justify-content: flex-start;
    }

}

@media screen and (max-width: 480.99px) {
    .profilemodal-upload-btns button {
        font-size: 0;
    }

    .uspro-fieldset {
        max-height: 30vh;
        height: 100%;
        overflow: auto;
    }

    .uspro-fieldset::-webkit-scrollbar {
        display: none;
    }

    .pro-title {
        margin-bottom: 8px;
    }

    .pro-img-sec {
        max-width: clamp(75px, 26.35vw, 120px);
        max-height: clamp(75px, 26.35vw, 120px);
    }

    .profile-section {
        gap: 12px;
    }

    .pro-edit-sec {
        margin-top: 8px;
    }

    button.tablinks svg {
        margin-right: 6px;
        width: 24px;
        height: 24px;
    }

    .logout-btn, .edit_profile_btn {
        height: 34px;
        padding: 10px 6px 10px 6px;
        gap: 6px;
        font-size: 12px;
    }

    .iconlogout, .edit_profile_btn svg {
        transform: translateY(-1px);
        width: 17px;
        height: 17px;
    }
}

/* Account UI end */





/* Search */
/* form.search-bar {
    display: flex;
    position: relative;
}

.sr-icon {
    position: absolute;
    width: 24px;
    height: 26px;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);

}

span.close-icon {
    display: none;
    cursor: pointer;
    transition: all 0.5s ease;
    animation: closeani 0.5s ease 0s 1 normal forwards;
    -webkit-animation: closeani 0.5s ease 0s 1 normal forwards;
}

@keyframes closeani {
    0% {
        transform: scale(0.7);
        -webkit-transform: scale(0.7);
        -moz-transform: scale(0.7);
        -ms-transform: scale(0.7);
        -o-transform: scale(0.7);
    }

    100% {
        transform: scale(1);
    }
}

form.search-bar input#custom-search {
    border-radius: 12px;
    border: 1px solid var(--Border, #D4D6D7);
    background: none;
    padding: 19px 40px 18px 14px;
    color: var(--text-color);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
    width: 100%;
    outline: none;
    height: 55px;
}

span.close-icon svg,
span.searah-icon svg {
    width: 100%;
    height: 100%;
    transition: all 0.5s ease;
}

span.close-icon svg {
    max-width: 18px;
    height: 18px;
    margin-left: 3px;
}

span.close-icon:hover svg {
    color: var(--portland-orange);
    transition: all 0.5s ease;
}

.global-search-col {
    display: none;
    position: fixed;
    width: 100%;
    z-index: 99;
    background: #fff;
    height: 100%;
    top: 0;
}

div#results {
    position: absolute;
    width: 100%;
    background: var(--white-color);
    padding: 6px;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    -o-border-radius: 12px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 2px 0px;
    overflow: hidden;
    z-index: 99;
    display:none;
}

.notresult-found p {
    font-size: 20px;
    font-weight: 700;
    color: var(--portland-orange);
}

span.notresult-image svg {
    width: 100%;
    height: 100%;
    max-width: 240px;
}

span.notresult-image {
    display: block;
    padding: 0 10px 10px;
}

.notresult-found {
    text-align: center;
    padding: 30px 0 40px;
}

#results .resdrg {
    overflow-y: auto;
    height: 100%;
    max-height: 500px;
    margin-right: -2px;
    padding-right: 6px;
    padding-left: 8px;
    padding-top: 8px;
    display: flex;
    flex-direction: column;
    row-gap: 4px;
}

#results .resdrg .item a .asl_content {
    display: flex;
    gap: 16px;
    padding: 10px;
    text-decoration: none;
    background-color: var(--primary-color);
}

#results .resdrg .item a:hover {
    text-decoration: none;
}

#results .resdrg .item a:hover .asl_content {
/*    box-shadow: rgba(17, 17, 26, 0.1) 0px 0px 16px;
}

#results .resdrg .item a:hover h4 {
    color: var(--portland-orange);
    transition: all 0.5s ease;
}

#results .resdrg .item .asl_image {
    width: 100%;
    max-width: 140px;
    object-fit: cover;
    object-position: center;
    border-radius: 12px;
}

.global-search-col #results .resdrg .item {
    width: 100%;
    display: inline-block;
    position: relative;
}

.global-search-col #results .resdrg .item .categories {
    position: absolute;
    width: 40px;
    height: 18px;
    top: 6px;
    left: -4px;
    -ms-transform: rotate(-25deg);
    -webkit-transform: rotate(-25deg);
    -moz-transform: rotate(-25deg);
    -o-transform: rotate(-25deg);
    transform: rotate(-25deg);
}

.global-search-col #results .resdrg .item .categories span {
    background-color: #FC5A31;
    text-align: center;
    border-radius: 20px;
    text-transform: uppercase;
    color: #ffffff;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: normal;
    height: 100%;
    font-size: 9px;
    padding-top: 1px;
    font-weight: 600;
    letter-spacing: 0.5px;
}

.global-search-col #results .resdrg .item .categories span.Mind {
    background-color: #FC5A31;
}

.global-search-col #results .resdrg .item .categories span.Body {
    background-color: #004638;
}

.global-search-col #results .resdrg .item .categories span.Self {
    background-color: #D199F9;
}

.global-search-col #results .resdrg .item .categories span.Uncategorized {
    display: none;
}

.search-content h4 {
    margin-bottom: 4px;
    font-size: var(--text-md-size);
    color: var(--text-color);
}

.search-content p {
    font-size: 14px;
    color: var(--text-color);
}

.global-search-col #results .resdrg .item {
    width: 100%;
    display: inline-block;
    position: relative;
}
.global-search-col #results .resdrg .item .categories {
    position: absolute;
    width: 40px;
    height: 18px;
    top: 6px;
    left: -4px;
    -ms-transform: rotate(-25deg);
    -webkit-transform: rotate(-25deg);
    -moz-transform: rotate(-25deg);
    -o-transform: rotate(-25deg);
    transform: rotate(-25deg);
}
.global-search-col #results .resdrg .item .categories span {
    background-color: #FC5A31;
    text-align: center;
    border-radius: 20px;
    text-transform: uppercase;
    color: #ffffff;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: normal;
    height: 100%;
    font-size: 9px;
    padding-top: 1px;
    font-weight: 600;
    letter-spacing: 0.5px;
}
.global-search-col #results .resdrg .item .categories span.Mind {
    background-color: #FC5A31;
}
.global-search-col #results .resdrg .item .categories span.Body {
    background-color: #004638;
}
.global-search-col #results .resdrg .item .categories span.Self {
    background-color: #D199F9;
}
.global-search-col #results .resdrg .item .categories span.Uncategorized {
    display: none;
} */


/* Update CSS 20jun */
/* Search */
form.search-bar {
    display: flex;
    position: relative;
    max-width: 70vw;
    margin: 0 auto;
    top: 4rem;
}

span.searchclose-icon {
    position: fixed;
    right: 16px;
    top: 16px;
    cursor: pointer;
    background: #f3d4cc;
    width: 36px;
    height: 36px;
    border-radius: 50px;
}

span.searchclose-icon svg {
    width: 18px;
    height: 18px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
}

.sr-icon {
    position: absolute;
    width: 24px;
    height: 26px;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);

}

span.close-icon {
    display: none;
    cursor: pointer;
    transition: all 0.5s ease;
    animation: closeani 0.5s ease 0s 1 normal forwards;
    -webkit-animation: closeani 0.5s ease 0s 1 normal forwards;
}

@keyframes closeani {
    0% {
        transform: scale(0.7);
        -webkit-transform: scale(0.7);
        -moz-transform: scale(0.7);
        -ms-transform: scale(0.7);
        -o-transform: scale(0.7);
    }

    100% {
        transform: scale(1);
    }
}

form.search-bar input#custom-search {
    border-radius: 12px;
    border: 1px solid var(--Border, #D4D6D7);
    background: none;
    padding: 19px 40px 18px 14px;
    color: var(--text-color);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
    width: 100%;
    outline: none;
    height: 55px;
    background-color: #fff;
}

span.close-icon svg,
span.searah-icon svg {
    width: 100%;
    height: 100%;
    transition: all 0.5s ease;
}

span.close-icon svg {
    max-width: 18px;
    height: 18px;
    margin-left: 3px;
}

span.close-icon:hover svg {
    color: var(--portland-orange);
    transition: all 0.5s ease;
}

.global-search-col {
    display: none;
    position: fixed;
    width: 100%;
    z-index: 99;
    background: #fff;
    height: 100%;
    top: 0;
}

div#results {
    position: absolute;
    width: 100%;
    max-width: 70vw;
    left: 50%;
    top: 8rem;
    transform: translateX(-50%);
    background: var(--white-color);
    padding: 6px;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    -o-border-radius: 12px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 2px 0px;
    overflow: hidden;
    z-index: 99;
    display: none;
}

.notresult-found p {
    font-size: 20px;
    font-weight: 700;
    color: var(--portland-orange);
}

span.notresult-image svg {
    width: 100%;
    height: 100%;
    max-width: 240px;
}

span.notresult-image {
    display: block;
    padding: 0 10px 10px;
}

.notresult-found {
    text-align: center;
    padding: 30px 0 40px;
}

#results .resdrg {
    overflow-y: auto;
    height: 100%;
    max-height: 75vh;
    margin-right: -2px;
    padding-right: 6px;
    padding-left: 8px;
    padding-top: 8px;
    padding-bottom: 1rem;
    display: flex;
    flex-direction: column;
    row-gap: 4px;
    /* grid-template-columns: 1fr 1fr 1fr; */
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
    /* grid-template-rows: auto;
    grid-auto-columns: 1fr;
    display: grid; */
    position: relative;
}

#results .resdrg .item a .asl_content {
    display: flex;
    gap: 16px;
    padding: 10px;
    text-decoration: none;
    background-color: var(--primary-color);
}

#results .resdrg .item a:hover {
    text-decoration: none;
}

#results .resdrg .item a:hover .asl_content {
    box-shadow: rgba(17, 17, 26, 0.1) 0px 0px 16px;
}

#results .resdrg .item a:hover h4 {
    color: var(--portland-orange);
    transition: all 0.5s ease;
}

.search-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#results .resdrg .item .asl_image {
    width: 100%;
    max-width: 140px;
    object-fit: cover;
    object-position: center;
    border-radius: 12px;
}

.search-content h4 {
    margin-bottom: 4px;
    font-size: var(--text-md-size);
    color: var(--text-color);
}

.search-content p {
    font-size: 14px;
    color: var(--text-color);
}

.global-search-col #results .resdrg .item {
    width: 100%;
    display: inline-block;
    position: relative;
}

.global-search-col #results .resdrg .item .categories {
    position: absolute;
    width: 40px;
    height: 18px;
    top: 6px;
    left: -4px;
    -ms-transform: rotate(-25deg);
    -webkit-transform: rotate(-25deg);
    -moz-transform: rotate(-25deg);
    -o-transform: rotate(-25deg);
    transform: rotate(-25deg);
}

.global-search-col #results .resdrg .item .categories span {
    background-color: #FC5A31;
    text-align: center;
    border-radius: 20px;
    text-transform: uppercase;
    color: #ffffff;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: normal;
    height: 100%;
    font-size: 9px;
    padding-top: 1px;
    font-weight: 600;
    letter-spacing: 0.5px;
}

.global-search-col #results .resdrg .item .categories span.Mind {
    background-color: #FC5A31;
}

.global-search-col #results .resdrg .item .categories span.Body {
    background-color: #004638;
}

.global-search-col #results .resdrg .item .categories span.Self {
    background-color: #D199F9;
}

.global-search-col #results .resdrg .item .categories span.Uncategorized {
    display: none;
}

/* old */
.search-bar #ajaxsearchlite1 .probox .proinput input {
    color: var(--text-color) !important;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
}

.search-bar #ajaxsearchlite1 .probox .proinput,
.search-bar div.asl_w .probox .proinput {
    margin: 0;
    padding: 0;
}

.search-bar div.asl_w .probox .promagnifier .innericon svg {
    fill: var(--text-color);
    width: 24px;
    height: 24px;
    outline: none;
}

div.asl_w .probox .promagnifier,
.search-bar span.innericon {
    outline: none;
    box-shadow: none !important;

}

body div.asl_r .results .item .asl_content h3 a {
    padding-top: 16px;
    display: flex;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    letter-spacing: 0.5px;
    color: var(--text-color) !important;
    font-size: 16px !important;
    line-height: 120% !important;
    font-weight: 600 !important;
    padding-right: 10px !important;
}

div.asl_r .results .item .asl_content .asl_desc {
    padding-right: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.results .asl_nores .asl_keyword {
    opacity: 0;
    display: none;
}

div.asl_r .results .resdrg {
    padding: 5px;
}

div#ajaxsearchliteres1 {
    margin-top: 10px;
    padding: 0;
    border-radius: 12px;
}

body div.asl_r .results .item .asl_content {
    border-radius: 12px;
    background: var(--primary-color);
    padding: 0;
}

div.asl_r.asl_w.vertical .results .item::after {
    background: none !important;
}

body div.asl_r .results .item .asl_image {
    overflow: hidden;
    background: #FFEFEA !important;
    margin: 0;
    padding: 0;
    float: left;
    background-position: center;
    background-size: cover;
    margin-right: 20px;

}

body div[id*='ajaxsearchliteres'].wpdreams_asl_results .results img.asl_image {
    width: 120px;
    height: 120px;
    object-fit: cover;
    background: #FAF5FE;
}


/* Slick slider */
ul.slick-dots {
    padding: 0;
    list-style: none;
    display: flex;
    gap: 8px;
    justify-content: center;
    margin-top: 24px;
}

ul.slick-dots button {
    padding: 6px;
    font-size: 0;
    border: none;
    background-color: var(--light-green);
}

ul.slick-dots .slick-active button {
    background-color: var(--dark-green);
}

button.slick-arrow {
    background: none;
    border: none;
    padding: 0;
    border-radius: 0;
    transform: translateY(-150px);
    text-shadow: none;
    font-size: 0;
    position: relative;
    padding: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    outline: none;
    transition: 0.5s;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -ms-transition: 0.5s;
    -o-transition: 0.5s;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    -o-border-radius: 12px;
}

.slick-arrow:focus {
    background: none;
}

.slick-arrow:hover {
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    -o-border-radius: 12px;
}

.slick-arrow:before {
    content: '';
    background-image: url('/wp-content/uploads/2024/03/arrow.svg');
    position: absolute;
    width: 28px;
    height: 19px;
    background-repeat: no-repeat;
    background-size: contain;
    left: 0;
}

.slick-prev.slick-arrow::before {
    transform: rotate(180deg) translateX(-6px);
    -webkit-transform: rotate(180deg) translateX(-6px);
    -moz-transform: rotate(180deg) translateX(-6px);
    -ms-transform: rotate(180deg) translateX(-6px);
    -o-transform: rotate(180deg) translateX(-6px);
}

.wpsisac-slick-slider.design-1 .slick-arrow {
    display: flex;
    align-items: center;
}

.slider-container ul.slick-dots {
    display: none !important;
}

span.button-text {
    padding: 18px 60px 18px 40px;
    background: var(--portland-orange);
    color: var(--white-color);
    font-size: 16px;
    font-style: normal;
    font-weight: 800;
    line-height: 120%;
    display: inline-block;
    position: relative;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    -o-border-radius: 12px;
}

span.button-text::before {
    content: '';
    background-image: url(/wp-content/uploads/2024/03/btn-arrow.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 20px;
    height: 22px;
    margin-left: 8px;
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
    right: 17%;
}

.slider-banner-post .slick-slide {
    justify-content: center;
}

.slider-banner-post .custom-slider {
    display: flex;
    align-items: center;
    justify-content: center;
}

.slider-banner-post .slick-slide .slide-content {
    margin: 0 auto;
    text-align: center;
}


.slider-banner-post h2 {
    margin-bottom: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.slider-banner-post .button-wrapper {
    margin-top: 20px;
}

.elementor-element:has(.card-page) {
    overflow: hidden;
}

.card-page figure.elementor-image-box-img {
    min-height: 372px;
    margin-bottom: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.card-page figure.elementor-image-box-img img {
    max-height: 350px;
}

.c1 figure.elementor-image-box-img {
    background-color: var(--light-flesh);
}

.c2 figure.elementor-image-box-img {
    background-color: var(--light-green);
}

.c3 figure.elementor-image-box-img {
    background-color: var(--light-palepurple);
}

.card-page .elementor-image-box-content {
    padding: 25px 36px;
}

.card-page .elementor-image-box-content .elementor-image-box-description {
    font-size: var(--text-size);
}

.card-page .elementor-image-box-content h2.elementor-image-box-title {
    margin-bottom: 6px;
}

/* Professional Article Page CSS */

.professional_articles-loader.daily_kokoro_loader_load {
    transform: translateY(-50%) translateX(-50%);
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 999;
    box-shadow: 0 0 0 50vmax rgb(255 255 255 / 80%);
    display: flex;
    justify-content: center;
    background-color: rgb(255 255 255 / 80%);
}

.professional-article-page {
    padding: 40px 0;
}

.professional-articles-container {
    padding-top: 40px;
    padding-bottom: 30px;
}

.professional-articles-container .survay-articles {
    padding: 0;
    margin-bottom: 0;
}

.titlecenter-article .professional-articles-heading {
    color: #263238;
    text-align: center;
    font-size: clamp(28px, 3.15vw, 42px);
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
    margin-bottom: 0;
}

.nofound-content {
    text-align: center;
    font-size: clamp(16px, 1.75vw, 20px);
    font-weight: 600;
    color: var(--danger);
    max-width: 800px;
    line-height: 140%;
    margin: auto;
}

.professional_articles .authCardProf.active {
    border-radius: 16px;
    border-top: 4px solid var(--Mind, #FC5A31);
    border-bottom: 4px solid var(--Mind, #FC5A31);
    background: var(--Mind-Lightest, #FFEFEA);
    box-shadow: 0px 3px 12px 3px rgba(252, 90, 49, 0.25);
}

.authCardProf .auth-disc {
    position: unset;
    width: 100%;
    transform: unset;
    background: var(--Self-Lightest, #FAF5FE);
    text-align: center;
    display: flex;
    min-height: 40px;
    padding: 12px 20px;
    justify-content: center;
    align-items: center;
    border-radius: 0;
}


.authCardProf.active:after {
    content: '';
    background: rgba(252, 90, 49, 0.15);
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
}

.professional_articles .authCardProf {
    background: #E4E4E4;
    height: 100%;
    border-top: 4px solid #ffff;
    border-bottom: 4px solid #ffff;
}

.professional_articles .authCardProf .auth-img img {
    /* max-height: 168px; */
    min-height: 100%;
    object-fit: cover;
}

.professional_articles .authCardProf .auth-disc h4 {
    color: #263238;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.professional_articles .authCardProf.active .auth-disc {
    background-color: #263238;
}

.professional_articles .authCardProf.active .auth-disc h4 {
    color: #ffffff;
}

/* Container Tooltip */
.tooltip-auth {
    position: absolute;
    right: 14px;
    top: 8px;
    z-index: 999;
    display: none;
}

.authCardProf.active .tooltip-auth {
    display: block;
}

/* Style text tooltip */
.tooltipText-auth {
    /* background-color: #fff;
    position: absolute;
    bottom: 130%;
    padding: 10px 15px;
    border-radius: 5px;
    font-size: 14px;
    opacity: 0;
    transition: all .5s; */
    color: var(--text-color);
    background-color: #fff;
    position: absolute;
    bottom: -50px;
    width: 108px;
    left: -87px;
    padding: 8px 12px 6px;
    border-radius: 5px;
    line-height: 100%;
    font-size: 14px;
    opacity: 0;
    transition: all .5s;
}


/*  Membuat dan style tip*/
.tooltipText-auth::after {
    /* content: '';
    border-width: 5px;
    border-style: solid;
    border-color: #fff transparent transparent transparent;
    position: absolute;
    top: 100%;
    left: 40%;
    margin-left: 5%; */
    content: '';
    border-width: 6px;
    border-style: solid;
    border-color: #fff transparent transparent transparent;
    position: absolute;
    top: -12px;
    left: 77%;
    margin-left: 0%;
    transform: rotate(180deg);
}


/* Hover text tooltip */
.authCardProf.active .tooltip-auth:hover .tooltipText-auth {
    opacity: 1;
    transform: translateY(-10px);
}

.expro-collective {
    display: flex;
}

.expro-collective.slick-slider {
    display: block;
}

.expro-collective button.slick-next {
    right: -20px;
}

.expro-collective button.slick-prev {
    left: -20px;
}

.expro-collective button.slick-arrow {
    position: absolute;
    top: 48%;
    z-index: 9;
    transform: translateY(-50%);
    background-color: transparent;
    padding: 20px;
    height: 100%;
}

.expro-collective button.slick-arrow:after {
    content: '';
    right: 0;
    position: absolute;
    top: 0;
    width: 160px;
    height: 100%;
    background: linear-gradient(275deg, #fff 3.09%, rgb(255 255 255 / 0%) 96.68%);
    z-index: -1;
}

.expro-collective button.slick-prev.slick-arrow:after {
    right: unset;
    left: 0;
    background: linear-gradient(90deg, #fff 3.09%, rgb(255 255 255 / 0%) 96.68%);
}

.expro-collective .slick-list {
    padding: 16px 6px;
}

.expro-collective .slick-list::before {
    content: '';
    left: 0;
    position: absolute;
    top: 0;
    width: 24px;
    height: 100%;
    background: linear-gradient(275deg, #ffffffb5 15.2px, rgb(255 255 255 / 0%) 96.68%);
}


.expro-collective button.slick-arrow.slick-disabled {
    opacity: 0;
    display: none !important;
}

.authimg-small {
    display: flex;
    width: 30px;
    height: 30px;
    padding-top: 0.752px;
    justify-content: center;
    align-items: center;
    border-radius: 100px;
    background: #FECCBF;
    overflow: hidden;
    margin-right: 8px;
}

.professional-articles-container .survay-articles .article-grid .category-pop {
    justify-content: space-between;
    padding: 0;
    margin-bottom: 8px;
    gap: 30px;
}

.professional-articles-container .article-card .category-pop .kokoro_on_go_audio {
    margin: 0;
    padding: 0;
}

.professional-articles-container .article-card .category-pop .kokoro_on_go_audio span.read-time {
    margin-top: 6px;
}

.linkauth-profile a {
    color: var(--Dark-blue, #263238);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
    letter-spacing: 0.32px;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    white-space: normal;
    max-width: 120px;
    overflow: hidden;
}

.linkauth-profile {
    color: var(--Dark-blue, #263238);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
    letter-spacing: 0.32px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.authimg-small img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.article-card:hover .authimg-small a img {
    transform: none;
}

div#professional-article-container .category-pop {
    padding: 0;
    margin-bottom: 8px;
    margin-top: 0;
}

#professional-article-container .category-pop .kokoro_on_go_audio {
    margin: 0;
    padding: 0;
}

.category-pop:has(a.alexa-simmons) .linkauth-profile,
.category-pop:has(a.jordan-wells) .linkauth-profile {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
    color: black !important;
}

.category-pop:has(a.alexa-simmons) .linkauth-profile a.alexa-simmons,
.category-pop:has(a.jordan-wells) .linkauth-profile a.jordan-wells {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
    color: black;
}

/* Professional Collective​ CSS */
.author-container {
    max-width: 1380px;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 4vw;
    margin: 0 auto;
}

.author-container .col-authImg {
    width: 100%;
    max-width: 170px;
    border-radius: 10px;
    background: #FECCBF;
}

.author-container .col-authImg img {
    object-fit: cover;
    min-height: 140px;
    max-height: 195px;
}

.survay-articles {
    max-width: 1380px;
    padding-left: 20px;
    padding-right: 20px;
    margin: 0 auto 6vw;
}

.survay-articles h2 {
    color: #263238;
    font-size: clamp(24px, 2.15vw, 34px);
    font-style: normal;
    font-weight: 800;
    line-height: 140%;
    margin-bottom: 20px;
}

.author-container .col-social {
    width: 100%;
    display: flex;
    gap: 16px;
    padding-bottom: 4vw;
}

.author-container .col-social .col-social-links {
    width: 100%;
}

.author-container .col-social .col-other-links {
    width: 100%;
    margin-top: 0;
}

.author-container .col-profile {
    padding-bottom: 20px;
    width: 100%;
}

/* .collective-profess .pro-col .elementor-image-box-wrapper {
    border-radius: 20px;
    overflow: hidden;
    background-color: var(--light-green);
}

.collective-profess figure.elementor-image-box-img {
    height: 240px;
    display: block;
}

.collective-profess figure.elementor-image-box-img img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.collective-profess .elementor-image-box-content {
    padding: 16px;
}

.collective-profess .elementor-image-box-content .elementor-image-box-title {
    font-size: var(--text-md-size);
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.36px;

}

.collective-profess .elementor-image-box-content .elementor-image-box-description {
    font-size: var(--normal-text-size);
    font-style: normal;
    font-weight: 400;
    line-height: normal;
} */

.pro-collective .slick-track {
    display: inline-flex;
}

.pro-collective button.slick-arrow {
    position: absolute;
    top: 50%;
    z-index: 9;
    transform: translateY(-50%);
    background-color: var(--white-color);
    padding: 20px;
}

.pro-collective button.slick-arrow:focus,
.pro-collective button.slick-arrow:hover {
    opacity: 0.8;
}

.pro-collective button.slick-next::before {
    left: 5px;
}

.pro-collective button.slick-prev::before {
    left: 1px;
}

.pro-collective button.slick-prev {
    left: -20px;
}

.pro-collective button.slick-next {
    right: -20px;
}

.pro-collective .slick-disabled {
    opacity: 0;
}

body ul.formkit-alert.formkit-alert-error {
    position: absolute;
    margin: 0 !important;
    background: none !important;
    border: none !important;
    color: var(--danger);
    padding: 0 !important;
    width: fit-content !important;
    bottom: -20px;
    font-size: 12px;
    left: -5px;
}

body ul.formkit-alert.formkit-alert-error li {
    color: var(--danger);
}

.formkit-form[data-uid="14573fbc1d"] [data-style="clean"] {
    position: relative;
}

.authCard {
    border-radius: 16px;
    overflow: hidden;
    background-color: var(--light-green);
    margin-right: 20px;
    cursor: pointer;
    float: left;
    height: auto;
}

.authCard:last-child {
    margin-right: 0;
}

.ns-form-card ul.formkit-alert.formkit-alert-error {
    top: 62px;
    left: 0;
    bottom: unset;
    position: absolute;
}

.auth-img img {
    width: 100%;
}

.auth-img .authorIcon {
    /* position: absolute;
    top: 6px;
    right: 10px; */
    cursor: pointer;
    display: none;
    z-index: 999;
    -webkit-animation: slide2 1s ease-in-out infinite;
    animation: slide2 1s ease-in-out infinite;
}

.auth-img {
    position: relative;
}

.auth-img .authorIcon svg {
    width: 30px;
    height: 30px;
}

.professional_articles .authCardProf.active .authorIcon {
    display: block;
}

/* .professional_articles .authCardProf:hover .auth-img .authorIcon {
    display: block;

} */
.professional_articles .authCardProf .auth-img .authorIcon:hover {
    animation: slide2 2s ease-in-out infinite;
    -webkit-animation: slide2 2s ease-in-out infinite;
}

@keyframes slide2 {

    0%,
    100% {
        transform: translate(6px, 0px) rotate(0deg);
    }

    50% {
        transform: translate(0px, 6px) rotate(0deg);
    }
}

.auth-disc {
    padding: 16px;
    min-height: 80px;
    gap: 3px;
    display: flex;
    flex-direction: column;
}

.auth-disc h4 {
    font-size: var(--text-md-size);
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.36px;
    margin-bottom: 0;
    color: #263238;
}

.auth-disc p {
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
    margin-top: 2px;
    color: #263238;
}

.auth-disc h6:empty {
    display: none;
}

.auth-disc h6 {
    font-size: 12px;
    margin: 0;
    font-weight: 600;
}

.loader {
    width: 48px;
    height: 48px;
    border: 3px solid #FC5A31;
    border-radius: 50%;
    display: inline-block;
    position: absolute;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
    z-index: 99;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
}

.loader::after,
.loader::before {
    content: '';
    box-sizing: border-box;
    position: absolute;
    left: 0;
    top: 0;
    background: var(--portland-orange);
    width: 6px;
    height: 6px;
    transform: translate(150%, 150%);
    border-radius: 50%;
}

.loader::before {
    left: auto;
    top: auto;
    right: 0;
    bottom: 0;
    transform: translate(-150%, -150%);
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

div#myModal {
    padding: 0 !important;
}

#myModal .modal-dialog {
    max-width: 100%;
    width: 100%;
    position: absolute;
    margin-bottom: 0;
    margin-top: 0;
    bottom: 0;
    animation: modalani 0.5s ease 0s 1 normal forwards;
    -webkit-animation: modalani 0.5s ease 0s 1 normal forwards;
    border-radius: 40px 40px 0px 0px;
    background: var(--Background, #FFFBF2);
    height: 100%;
    max-height: 90%;
    pointer-events: visible;
    overflow: hidden;
}


@keyframes modalani {
    0% {
        transform: translateY(100%);
        -webkit-transform: translateY(100%);
        -moz-transform: translateY(100%);
        -ms-transform: translateY(100%);
        -o-transform: translateY(100%);
    }

    100% {
        transform: translateY(0);
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
    }
}

.modal-container {
    display: flex;
    gap: 48px;
}

.col-profile {
    width: 60%;
    padding-bottom: 50px;
}

.col-social {
    width: 40%;
}


.close-modal {
    position: absolute;
    right: 20px;
    z-index: 99;
    top: 20px;
    display: inline-flex;
    float: right;
    cursor: pointer;

}

.close-modal img {
    width: 30px;
}

.close-modal svg {
    border-radius: 50px;
    border: 2px solid;
    padding: 4px;
    width: 36px;
    height: 36px;
}

.modal-open #myModal.modal {
    overflow-x: hidden;
    overflow-y: hidden;
}

#myModal .modal-dialog .modal-content {
    background: none;
    padding: 20px 60px 100px;
    height: 100%;
    margin-top: 60px;
    overflow-x: auto;
    position: absolute;
    border: none;
    left: 0;
    display: inline-flex;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

.col-head {
    display: flex;
    align-items: center;
    gap: 20px;
    border-radius: 16px;
    background: var(--Background, #FFFBF2);
}

.col-authImg img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.col-authImg {
    border-radius: 16px;
    background: var(--white-color);
    display: flex;
    width: 160px;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.col-authDetail {
    padding-top: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-align: left;
}

.col-authDetail p a {
    color: var(--portland-orange);
}

.col-authDetail>* {
    color: var(--text-color);
    font-size: var(--text-md-size);
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}

.col-authDetail p {
    padding-bottom: 24px;
}

.col-title {
    text-align: left;
    display: block;
    padding-right: 10px;
    padding-top: 20px;
    padding-bottom: 20px;
    padding-right: 10px;
}

.col-title h3 {
    color: var(--dark-blue-text, #263238);
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
    letter-spacing: 1.28px;
    font-size: clamp(22px, 3.92vw, 50px);
}

.col-title h5 {
    color: var(--dark-blue-text, #263238);
    margin-bottom: 14px;
    font-size: clamp(16px, 3.15vw, 28px);
}

.col-title p {
    color: var(--portland-orange);
    font-size: clamp(12px, 1.25vw, 20px);
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    letter-spacing: 0.48px;
}

.col-social-links {
    display: flex;
    padding: 24px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    border-radius: 20px;
    border-radius: 20px;
    background: var(--Body-Lightest, #E6EDEB);
}

.links-social {
    display: flex;
    justify-content: flex-end;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
}

.links-social a {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    color: var(--text-color);
    font-size: var(--text-size);
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    word-break: break-word;
}

.title-social {
    color: var(--text-color);
    text-align: center;
    font-size: var(--sub-text-size);
    font-style: normal;
    font-weight: 800;
    line-height: normal;
    letter-spacing: 0.48px;
    text-transform: uppercase;
}

.links-social a img {
    width: 40px;
    height: 40px;
    mix-blend-mode: multiply;
}

.links-social a svg {
    width: 40px;
    height: 40px;
    color: initial;
}

.col-other-links {
    display: flex;
    padding: 24px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    border-radius: 20px;
    margin-top: 30px;
    border-radius: 20px;
    background: var(--Mind-Lightest, #FFEFEA);
}

.oth-link a {
    color: var(--text-color);
    font-family: var(--font-family);
    font-size: var(--text-md-size);
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    text-decoration-line: underline;
    text-transform: lowercase;
    padding: 4px 0 18px 0;
    display: block;
    word-break: break-all;
    text-align: left;
}

.oth-link a:hover,
.links-social a:hover {
    color: var(--portland-orange);
}

.oth-link p {
    color: var(--text-color);
    font-family: var(--font-family);
    font-size: var(--text-md-size);
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    text-transform: uppercase;
}

.oth-link {
    display: flex;
    flex-direction: column;
    gap: 4px;
    text-align: left;
}


span#print-post-btn {
    display: flex;
    width: 144px;
    height: 60px;
    padding: 16px 24px 16px 20px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 12px;
    border: 2px solid var(--text-color);
    margin-top: 20px;
}

span.icon-date {
    color: var(--text-color);
    font-family: var(--font-family);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}

/* testimonials */
.testimonials-col .sp-testimonial-free-wrapper {
    position: relative;
    overflow: visible;
}

.testimonials-col .sp-testimonial-item {
    padding: 48px 30px;
    background-color: var(--light-green);
    border-radius: 20px;
    height: auto;
}

.testimonials-col .sp-testimonial-item .sp-testimonial-client-testimonial p {
    font-size: var(--text-md-size);
    font-style: normal;
    font-weight: 300;
    line-height: 150%;
    text-align: left;
}

.testimonials-col .sp-testimonial-client-name {
    font-size: var(--text-md-size);
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    text-align: left;
    margin-bottom: 1px;
}

#sp-testimonial-free-wrapper-476 .sp-testimonial-free-section .sp-testimonial-client-designation {
    color: var(--text-color);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-align: left;
}

.testimonials-col .sp-testimonial-free-section .testimonial-nav-arrow {
    border: none !important;
    border-radius: 10px;
    background: var(--white-color) !important;
    top: 50%;
    font-size: 0;
    width: 50px;
    height: 50px;
    padding: 0;
    cursor: pointer;
    outline: 0;
    position: absolute;
    text-align: center;
    z-index: 22;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    transition: all .3s ease;
    transform: translateY(0);
    display: flex;
    justify-content: center;
    align-items: center;
    -webkit-transform: translateY(0%);
    -moz-transform: translateY(0%);
    -ms-transform: translateY(0%);
    -o-transform: translateY(0%);
}

.testimonials-col .sp-testimonial-free-section .testimonial-nav-arrow.swiper-button-next {
    right: -38px;
    left: auto;
}

.testimonials-col .sp-testimonial-free-section .testimonial-nav-arrow.swiper-button-prev {
    left: -38px;
    right: auto;
}

.sp-testimonial-free-section .testimonial-nav-arrow i {
    font-size: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sp-testimonial-free-section .testimonial-nav-arrow i:before {
    content: '';
    background-image: url('/wp-content/uploads/2024/03/arrow.svg');
    position: absolute;
    width: 28px;
    height: 19px;
    background-repeat: no-repeat;
    background-size: contain;
}

.sp-testimonial-free-section .testimonial-nav-arrow.swiper-button-prev i:before {
    transform: rotate(180deg);
}

.testimonials-col .sp-testimonial-free-section {
    margin: 0 !important;
}

/* Footer */
.we-promise-text p {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: var(--normal-text-size);
    margin-top: 2px;
}

.we-promise-text p img {
    margin-top: -5px;
}

/* .title-ns-text .elementor-heading-title {
    font-weight: 800;
    line-height: 120%;
    text-transform: uppercase;
}

.social-border {
    position: relative;
}

.ft-menu-col li.elementor-icon-list-item a,
.contact-us h4 {
    font-size: var(--text-size);
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    font-family: var(--font-family);
    transition: all 0.5s ease;
}

.ft-menu-col li.elementor-icon-list-item a:hover {
    text-decoration: none;
}

.ft-menu-col li.elementor-icon-list-item a:hover span.elementor-icon-list-text {
    transition: all 0.5s ease;
}

.ft-menu-col li.elementor-icon-list-item a span.elementor-icon-list-text {
    line-height: 0;
    transform: translateY(2px);
}

.mindftLink li.elementor-icon-list-item:nth-child(1) a,
.menuft-links li.elementor-icon-list-item:nth-child(1) a:hover {
    background: var(--dark-flesh);
}

.bodyftLink li.elementor-icon-list-item:nth-child(2) a,
.menuft-links li.elementor-icon-list-item:nth-child(2) a:hover {
    background: var(--dark-green);
}

.selfftLink li.elementor-icon-list-item:nth-child(3) a,
.menuft-links li.elementor-icon-list-item:nth-child(3) a:hover {
    background: var(--dark-palepurple);
}

.contact_details a {
    color: var(--text-color);
    text-transform: lowercase;
    font-weight: 600;
    font-family: var(--font-family);
}

.contact_details a:hover {
    color: var(--portland-orange);
    transition: all 0.5s ease;
    text-decoration: none;
}

.address-col a {
    text-transform: inherit;
}

.copyright-text p {
    margin-bottom: 0;
    font-size: var(--normal-text-size);
}

.copyright-text p a {
    font-family: var(--font-family);
    color: var(--text-color);
    text-decoration: none;
    transition: all 0.5s ease;
    font-weight: 600;
}

.copyright-text p a:hover {
    opacity: 0.8;
    color: var(--portland-orange);
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
}

.footer-links .menu-item a.hfe-menu-item {
    font-weight: 600;
    line-height: normal;
    cursor: pointer;
    font-family: var(--font-family);
}

a.sub-domCard {
    display: block;
    text-decoration: none;
}

a.sub-domCard .elementor-image-box-wrapper {
    padding: 20px;
    text-align: center;
    height: 100%;
    display: block;
}

a.sub-domCard .elementor-image-box-wrapper.mind {
    background: var(--dark-flesh);
}

a.sub-domCard .elementor-image-box-wrapper.body {
    background: var(--dark-green);
}

a.sub-domCard .elementor-image-box-wrapper.self {
    background: var(--dark-palepurple);
}

a.sub-domCard .elementor-image-box-wrapper h2.elementor-image-box-title {
    color: var(--text-color);
}

a.sub-domCard .elementor-image-box-wrapper p.elementor-image-box-description {
    color: var(--text-color);
}

.daily-ritual-mobile .wpsisac-slick-slider .wpsisac-image-slide .wpsisac-slide-wrap img {
    padding: 0 60px 20px;
    border-radius: 12px;
    width: 100%;
} */

/* survay_form CSS */
body:has(.quiz-container) {
    background: #ffffff;
}

/* Loader */
.loader-qsm-quiz {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: inline-block;
    border-top: 4px solid #FFF;
    border-right: 4px solid transparent;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 99;
    transform: translateX(-50%) translateY(-50%);
    z-index: 99;
    top: 35%;
}

.loader-qsm-quiz::after {
    content: '';
    box-sizing: border-box;
    position: absolute;
    left: 0;
    top: 0;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border-bottom: 4px solid #FF3D00;
    border-left: 4px solid transparent;
}

.assignment-heading {
    text-align: center;
}

.quiz-container .qsm-quiz-form .qmn_error:after {
    display: none;
}

.title-assignment {
    font-size: clamp(20px, 3.15vw, 32px);
    font-style: normal;
    font-weight: 800;
    line-height: 150%;
}

.quiz-container .qsm-quiz-container.quiz_theme_qsm-theme-breeze .quiz_section .mlw_qmn_new_question {
    padding-top: 10px;
    padding-right: 20px;
}

.quiz_theme_qsm-theme-breeze .quiz_end,
.quiz_theme_qsm-theme-breeze .qsm-breeze-pagination-timer-header {
    display: none !important;
}

.quiz-container {
    padding: 40px 20px;
    max-width: 1380px;
    padding-left: 20px;
    padding-right: 20px;
    margin: 0 auto;
    min-height: 400px;
}

.survay-articles a {
    text-decoration: none;
}

.quiz-container .quiz_theme_qsm-theme-breeze .mlw_breeze_previous {
    visibility: hidden;
    opacity: 0;
}

.quiz-container .qmn_pagination, .qsm_auto_pagination_enabled .qmn_pagination {
    border: none !important;
}

.quiz-container .quiz_theme_qsm-theme-breeze .qmn_radio_answers .qmn_mc_answer_wrap .qsm-input-label {
    padding-top: 12px;
    padding-bottom: 9px;
}

.quiz-container .quiz_theme_qsm-theme-breeze .qsm-question-wrapper .qmn_radio_answers .qsm-input-label::before {
    margin-top: -2px;
}

.quiz-container .quiz_theme_qsm-theme-breeze .margin-bottom::before {
    background-image: linear-gradient(to right, #fc5a31, #fff);
}

.quiz-container .quiz_theme_qsm-theme-breeze .qsm_theme_breeze_header {
    border: none;
    display: block !important;
    padding: 0 30px;
}

.quiz-container .breeze_header_content .breeze_progress_bar {
    display: block !important;
}

.quiz-container .quiz_theme_qsm-theme-breeze.qsm-quiz-container {
    box-shadow: none;
    background: transparent;
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
}

.quiz-container form#quizForm1 {
    max-width: 900px;
    margin: 0 auto;
    padding: 15px 30px 0;
    border-radius: 20px 20px 0 0;
}

.quiz-container .qmn_pagination.border.margin-bottom {
    max-width: 900px;
    margin: 0 auto;
    padding: 15px 30px 30px;
    border-radius: 0 0 20px 20px;
}

.quiz-content {
    display: flex;
    flex-wrap: wrap;
}

.quiz-container .quiz_theme_qsm-theme-breeze.qsm-quiz-container-1 .qmn_btn {
    width: 120px;
    height: 48px;
    font-size: 16px !important;
    align-items: center;
    font-weight: 600;
    transition: all 0.5s ease;
}

.survay-articles .article-grid {
    grid-template-columns: 1fr 1fr 1fr;
    display: grid;
    justify-content: center;
    gap: 20px;
    row-gap: 30px;
    /* grid-template-columns: 1fr 1fr 1fr; */
    transition: all 0.5s ease;
}

.survay-articles .ko-go-content {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}

.survay-articles .shortarticle-col {
    width: 100%;
}

.survay-articles .kokoro_on_go_audio {
    margin-top: 8px;
    margin-left: 0;
    padding: 0 16px;
}

.survay-articles .ko-go-content img {
    width: 100%;
    max-width: 100%;
    border-radius: 0;
    margin-bottom: 0;
}

.survay-articles .ko-gotitle {
    color: var(--dark-blue-text, #263238);
    font-size: clamp(20px, 1.35vw, 26px);
    font-style: normal;
    font-weight: 700;
    line-height: 110%;
    margin-bottom: 0;
    /* display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden; */
    padding-top: 5px;
}

.survay-articles .shortarticle-content p {
    text-align: left;
    color: var(--Black, #000);
    font-family: var(--font-family-kokoro);
    font-size: clamp(14px, 1.15vw, 16px);
    font-style: normal;
    font-weight: 300;
    line-height: 150%;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-decoration: none;
}

.survay-articlesl a {
    color: var(--Mind, #FC5A31);
    font-family: var(--font-family-kokoro);
    font-size: clamp(14px, 1.15vw, 16px);
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
}

.survay-articles .article-grid .category.Body:before {
    content: '';
    width: 8px;
    height: 8px;
    background: #004638;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -1px;
    border-radius: 50px;
    transform: translateY(-50%);
}

.survay-articles .article-grid .category.Mind:before {
    content: '';
    width: 8px;
    height: 8px;
    background: #FC5A31;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -1px;
    border-radius: 50px;
    transform: translateY(-50%);
}

.survay-articles .article-grid .category-pop span {
    margin-bottom: 0;
    white-space: nowrap;
}

.survay-articles .article-grid .read-time, .survay-articles .article-grid .icon-date, .survay-articles .article-grid .shareCountcol {
    display: flex;
    align-items: center;
    gap: 8px;
}

.survay-articles .article-grid .content:hover a img {
    transform: translate(0, -16px) scale(1.1);
    transition: 400ms;
}

.survay-articles .article-grid .ko-go-content img {
    margin-bottom: 0;
    min-height: 250px;
    border-radius: 0;
}

.survay-articles .article-grid .content:hover a .ko-gotitle {
    color: #fc5a31;
}

.survay-articles .article-grid * {
    transition: 400ms;
}

.survay-articles .article-grid .date, .read-time {
    display: block;
    font-size: 15px;
    color: var(--Dark-blue, #263238);
    position: relative;
    line-height: 100%;
}

.survay-articles .read-time::before {
    display: inline-block;
    content: '';
    border-radius: 0.375rem;
    width: 6px;
    height: 6px;
    transform: translateY(-2px);
    background-color: var(--Dark-blue, #263238);
}

.survay-articles .article-grid .category-pop {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 4px 0;
}

.survay-articles .article-grid .content {
    overflow: hidden;
    max-width: 100%;
    width: 100%;
    text-align: left;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 2px 0px;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
    transition: all 0.8s ease;
}

.survay-articles .article-grid .content .shortarticle-content {
    padding: 0 20px 20px;
}

.survay-articles .article-grid .content:hover {
    box-shadow: rgba(0, 0, 0, 0.1) -4px 9px 25px -6px;
    transition: all 0.8s ease;
}

.survay-articles .article-grid .content:hover a {
    color: #fc5a31;
}

.survay-articles .article-grid.category {
    padding: 0 0 0 16px;
    border-radius: 20px;
    font-size: 14px;
    overflow: hidden;
    color: var(--Dark-blue, #263238);
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    display: inline-block;
    position: relative;
}

.survay-articles .category {
    padding: 0 0 0 16px;
    font-size: 14px;
    overflow: hidden;
    color: var(--Dark-blue, #263238);
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    display: inline-block;
    position: relative;
}

form#survay_form {
    flex-wrap: wrap;
    max-width: 830px;
    border-radius: 24px;
    background: var(--Background, #FFFBF2);
    display: flex;
    padding: 30px 40px;
    align-items: center;
    row-gap: 8px;
    gap: 8px;
}

.survay_form_heading {
    color: var(--Dark-Blue, #263238);
    font-size: clamp(24px, 1.35vw, 34px);
    font-style: normal;
    font-weight: 800;
    line-height: 120%;
    text-transform: uppercase;
}

form#survay_form .formit-input {
    max-width: calc(100% - 200px);
    max-height: 60px;
}

form#survay_form .formit-input input {
    max-width: 100%;
    width: 100%;
    height: 60px;
    padding: 18px 24px 5px 30px;
    border: 0;
    border-bottom: 1px solid var(--Dark-blue, #263238);
    outline: none;
    overflow: hidden;
    color: var(--Dark-blue, #263238) !important;
    text-overflow: ellipsis;
    font-family: 'kokoro';
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    background: none !important;
    box-shadow: none !important;
}

form#survay_form button#survay_btn {
    width: 100%;
    max-width: 190px;
    border-radius: 12px;
    background: var(--Mind, #FC5A31);
    display: flex;
    height: 55px;
    padding: 16px 24px 14px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    color: var(--White, #FFF);
    text-align: center;
    font-family: 'kokoro';
    font-size: var(--normal-text-size);
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    text-transform: uppercase;
    box-shadow: none;
    text-shadow: none;
    outline: none;
    border: none;
    transition: all 0.5s ease;
    letter-spacing: 0.2px;
    position: relative;
}

form#survay_form input#newsletter {
    margin-top: -3px;
    width: 16px;
    height: 16px;
}

.survay-newsletter {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 14px;
    margin-top: 15px;
}

input#newsletter[type='checkbox'] {
    accent-color: #FC5A31;
}



/* Newsletter Form UI */

.ns-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 24px;
    background: var(--white-color);
    position: fixed;
    top: 50%;
    left: 50%;
    padding: 40px;
    transform: translateY(-50%) translateX(-50%);
    z-index: 9999999;
    align-content: center;
    flex-direction: row;
    width: 100%;
    max-width: calc(100% - 40px);
    height: calc(100% - 40px);
    box-shadow: 0 0 0 50vmax rgba(0, 0, 0, 0.5);
    overflow: auto;
}

.sub-container {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
    max-width: 1754px;
    padding: 0;
}

.ns-title {
    color: var(--text-color);
    font-style: normal;
    font-size: var(--mid-heading-size);
    font-weight: 500;
    line-height: 150%;
    text-transform: uppercase;
    border-bottom: 3px solid;
    border-image-slice: 1;
    border-width: 3px;
    border-image-source: linear-gradient(to left, #e0bff6, #536662, #f29881, #fc5a31);
    margin-bottom: 3vw;
    width: fit-content;
}

.ns-para {
    color: #263238;
    font-family: var(--font-family);
    font-size: clamp(14px, 1.15vw, 20px);
    font-style: normal;
    font-weight: 500;
    line-height: 150%;
    margin-bottom: 10px;
    max-width: 650px;
    padding-left: 26px;
    position: relative;
}

.ns-para span.tick-icon {
    padding: 0;
    display: flex;
    margin-right: 4px;
    float: left;
    position: absolute;
    left: -1px;
    top: 0px;
}

.ns-para span.tick-icon img {
    width: 24px;
    height: 24px;
}


.ns-para span {
    font-weight: 600;
    padding: 5px 4px;
}

.ns-content {
    display: flex;
    padding: 60px 30px 60px 60px;
    flex-direction: column;
    justify-content: center;
    gap: 24px;
    width: calc(100% - 43%);
}

p.ins-para {
    color: #ffffff;
    background: linear-gradient(6deg, #263238 0%, #f29881 10%, #fc5a31 40%, #263238 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-size: 200% auto;
    animation: shine 4s linear infinite;
    -webkit-animation: shine 4s linear infinite;
    line-height: 140%;
    display: flex;
    align-items: center;
}

p.ins-para span {
    display: inline-flex;
    align-items: center;
}

p.ins-para svg {
    margin-top: -3px;
    margin-right: 6px;
    fill: #263238;
}


@keyframes shine {
    to {
        background-position: 200% center;
    }
}

.ns-image {
    display: flex;
    padding: 0;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-self: center;
    width: 43%;
}

.back-to-live {
    width: 100%;
    display: flex;
    position: absolute;
    bottom: 20px;
    text-align: center;
    justify-content: center;
}

.back-to-live span {
    text-decoration: underline;
    color: #999999;
    font-weight: normal;
    line-height: normal;
    font-family: var(--font-family);
    font-size: var(--normal-text-size);
    cursor: pointer;
}

.newsletter-popup {
    display: none;
}


div#ns-close-modal {
    position: absolute;
    right: -21px;
    top: -18px;
    background: var(--white-color);
    width: 48px;
    height: 48px;
    border-radius: 50px;
    cursor: pointer;
}

div#ns-close-modal svg {
    width: 30px;
    margin: 0 auto;
    display: block;
}

.formkit-form[data-uid="14573fbc1d"] .formkit-field,
.formkit-form[data-uid="14573fbc1d"] .formkit-submit {
    margin: 0 !important;
}

.formkit-powered-by-convertkit-container {
    display: none !important;
}

.ns-form-card form.seva-form.formkit-form .formkit-field {
    width: 100%;
    max-width: 100%;
}

.ns-form-card form.seva-form.formkit-form button.formkit-submit.formkit-submit {
    width: 100%;
    max-width: 100%;
    display: flex;
    height: 50px;
    padding: 16px 32px;
    justify-content: center;
    align-items: center;
    gap: 8px;
}

.ns-form-card form.seva-form.formkit-form button.formkit-submit.formkit-submit span {
    padding: 0;
    font-size: var(--normal-text-size);
}

.ns-form-card form.seva-form.formkit-form .formkit-field input.formkit-input {
    border-bottom: 1px solid var(--white-color) !important;
    color: #fff !important;
}

body:has(.newsletter-popup[style="display: block;"]) {
    overflow: hidden;
}

.ns-image img {
    width: 100%;
    max-width: 100%;
    /* max-height: 700px; */
    object-fit: contain;
}

.wpsisac-slick-slider.design-2 .slick-next {
    right: 5px !important;
}

.daily-ritual-mobile .wpsisac-slick-slider.design-2 .slick-arrow {
    top: clamp(150px, 23.35vw, 259px) !important;
}

.wpcap-grid span.post-comments {
    display: none;
}

.wpcap-grid article.wpcap-post {
    box-shadow: none;
    border-radius: 30px !important;
    background: #FDF7E8 !important;
}

.elementor-widget-elementor-blog-posts .wpcap-grid-container .wpcap-post .title>a:hover {
    text-decoration: none;
}

.menuft-links li.elementor-icon-list-item a {
    padding: 44px 30px;
}

.menuft-links li.elementor-icon-list-item a span.elementor-icon-list-icon {
    display: none;
}

div#siteLoader {
    position: fixed;
    background: rgba(249, 237, 237, 0.87);
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
}

div#siteLoader svg {
    max-width: 120px;
    max-height: 120px;
}


.mobile-search-modal {
    position: fixed;
    top: 0;
    display: none;
}

/* Single Page  */
#toast-container>.toast-success {

    background-color: #51A351;

}

#toast-container>.toast-error {

    background-color: #BD362F !important;

}

.singlePost .qsm-quiz-container {
    background: #f8f8f8;
}

.singlePost {
    width: 100%;
    max-width: 980px;
    padding: 4vw 2vw;
    margin: 0 auto;
    display: flex;
    gap: 110px;
    position: relative;
}

.sidebar-section {
    display: flex;
    justify-content: center;
}

.sidebar-section .read-time::before {
    display: none;
}

.sidebar-section .audioplayer {
    justify-content: left;
}

.post-data img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

main#main:has(.liked-section) .postContent {
    padding-bottom: 2rem;
}

h1.postTitle,
h4.postTitle {
    color: var(--text-color);
    font-style: normal;
    font-weight: 800;
    line-height: 120%;
    font-size: var(--mid-heading-size);
    text-align: center;
}

ul.social a svg {
    width: 30px;
}

ul.social li {
    list-style: none;
}

div#print-content {
    display: none;
}

.articleList {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.articleCard .link-more {
    display: none;
}

.articleCard {
    overflow: hidden;
    max-width: 100%;
    width: 100%;
    text-align: left;
    background-color: #fff;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 2px 0px;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
    transition: all 0.8s ease;
}

.articleCard img {
    width: 100%;
    height: auto;
}

.articleCard p {
    color: var(--Dark-blue, #263238);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 24px */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.articleCard:hover {
    box-shadow: rgba(0, 0, 0, 0.1) -4px 9px 25px -6px;
    transition: all 0.8s ease;
}

.articleCard:hover a img {
    transform: translate(0, -16px) scale(1.1);
    transition: 400ms;
}

.articleCard * {
    transition: 400ms;
}

.articleCard:hover a .titleArt,
.articleCard:hover a {
    color: #fc5a31;
}

.articleImg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.articleImg a {
    display: block;
}

.liked-section {
    max-width: 1190px;
    width: 100%;
    padding: 0 2vw 6vw;
    margin: 0 auto;

}

.articleShareCol {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin-top: 24px;
}

.share-wrapper {
    justify-content: space-between;
    align-items: center;
}

ul.social {
    padding: 0;
    margin: 0;
    display: flex;
}

.artshortContent p {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    position: initial;
}

.titleArt {
    color: var(--text-color);
    font-family: var(--font-family-kokoro);
    font-size: clamp(18px, 1.35vw, 24px);
    font-style: normal;
    font-weight: 800;
    line-height: 140%;
    letter-spacing: 0.48px;
}

.single-post .liked-section .artshortContent .titleArt {
    font-size: clamp(16px, 1.25vw, 20px);
    margin-bottom: 0;

}

.artshortContent:hover a {
    text-decoration: none;
}

.link-more a {
    color: var(--text-color);
}

.title-related h4 {
    font-size: var(--post-heading-size);
    font-weight: 800;
    line-height: 120%;
    margin-bottom: 48px;
}

.artLinksButton a.linkArt {
    border-radius: 79.121px;
    border: 0.791px solid var(--Dark-blue, #263238);
    display: flex;
    width: 38.769px;
    height: 38.769px;
    padding: 12.66px 12.66px 11.867px 11.867px;
    justify-content: center;
    align-items: center;
}

.artLinksButton a.linkArt:hover {
    transition: all 0.5s ease;
    border-color: var(--danger);
}

.artLinksButton a.linkArt:hover svg path {
    fill: var(--portland-orange);
    transition: all 0.5s ease;
}

.socialPostShare {
    padding: 10px;
    border-radius: 50px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
    transition: all 0.5s ease;
}

.socialPostShare .share:hover,
.socialPostShare .share:focus,
.socialPostShare .colShare:hover,
.socialPostShare .colShare:focus {
    animation: clickshare 1s ease 0s 1 normal forwards;
    -webkit-animation: clickshare 1s ease 0s 1 normal forwards;
}

@keyframes clickshare {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.2;
        color: var(--portland-orange);
    }

    100% {
        opacity: 1;
    }
}

.socialPostShare ul.postshare .fas svg {
    transition: all 0.5s ease;
}

.socialPostShare ul.postshare .fas:hover svg {
    color: var(--portland-orange);
    transition: all 0.5s ease;
}

.socialPostShare ul.postshare {
    position: absolute;
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    left: 46px;
    gap: 8px;
    top: 6px;
}

.socialPostShare ul.postshare li a {
    display: block;
    cursor: pointer;
    color: var(--text-color);
}

.socialPostShare ul.postshare li a svg {
    width: 30px;
    height: 30px;
}

.postshare {
    display: none;
}

.mobile-details-post {
    display: none;
    opacity: 0;
    align-items: center;
    gap: 16px;
    padding: 12px 20px;
    justify-content: center;
}


.mobile-details-post .sideshare-wrapper {
    display: flex;
    width: 48px;
    height: 48px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    padding: 10px;
    margin: 0;
}

.mobile-details-post .iprint-post {
    display: flex;
    width: 48px;
    height: 48px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    padding: 10px;
    margin: 0;
}

.mobile-details-post .read-time {
    border-right: 1px solid #D4D6D7;
    padding-right: 16px;
    line-height: 1;
}

.wpsisac-slick-slider .slick-arrow,
.wpsisac-slick-carousal .slick-arrow {
    background-color: transparent !important;
}

.wpsisac-slick-slider .slick-arrow svg,
.wpsisac-slick-carousal .slick-arrow svg {
    display: none;
}



.wpsisac-slick-slider.design-2 .wpsisac-image-slide .wpsisac-slide-wrap .wpsisac-slider-overlay {
    background: none;
    position: unset;
    display: block;
}

.wpsisac-slick-slider.design-2 .wpsisac-image-slide .wpsisac-slide-wrap .wpsisac-slider-content {
    position: unset;
    transform: unset;
    text-align: center;
    width: 80%;
    margin: 0 auto;
    float: none;
}

.wpsisac-slick-slider h2.wpsisac-slide-title {
    margin: 12px 0 12px 0 !important;
    text-align: center;
    font-family: var(--font-family);
    font-size: var(--post-heading-size);
    font-style: normal;
    font-weight: 800;
    line-height: 120%;
    padding: 0 10px !important;
    color: var(--text-color) !important;
    text-shadow: none !important;
}

.wpsisac-slick-slider .wpsisac-readmore {
    display: none;
}

.content-card {
    text-align: center;
}

.slider-buttons {
    position: absolute;
    top: 35%;
    width: 100%;
    display: flex;
    justify-content: space-between;
    transform: translateY(-50%);
    z-index: 99;
}

.slider-button {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1.5em;
}

.slider-buttons .slider-button.slick-next.slick-arrow:before {
    right: 0;
}

.slider-buttons a.slider-button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.slider-buttons a.slider-button.slick-prev.slick-arrow {
    left: -16px;
}

.slider-buttons a.slider-button.slick-next.slick-arrow {
    right: 28px;
}

.slider-container {
    min-height: 710px;
    position: relative;
}

.slider-buttons a.slick-prev.slick-arrow::before {
    transform: rotate(180deg) translateX(-12px);
}

.slider {
    transition: transform 0.5s ease-in-out;
    position: relative;
    max-width: 900px;
    height: 100%;
    margin: 0 auto;
}

.slide {
    width: 100%;
    box-sizing: border-box;
    position: absolute;
}

.slide-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.slide.slide-z-3 .post-img {
    padding: 0 40px;
}

.slide.slide-z-3 .post-img img {
    transition: all 0.5s cubic-bezier(0.68, -0.55, 0.27, 1.55);
    -webkit-transition: all 0.5s cubic-bezier(0.68, -0.55, 0.27, 1.55);
    -moz-transition: all 0.5s cubic-bezier(0.68, -0.55, 0.27, 1.55);
    -ms-transition: all 0.5s cubic-bezier(0.68, -0.55, 0.27, 1.55);
    -o-transition: all 0.5s cubic-bezier(0.68, -0.55, 0.27, 1.55);
}

.slide.slide-z-2 .post-img {
    padding: 0 20px;
}

.slide.slide-z-2 .post-img img {
    padding: 7px 0;
    transition: all 0.2s cubic-bezier(0.68, -0.55, 0.27, 1.55);
    -webkit-transition: all 0.2s cubic-bezier(0.68, -0.55, 0.27, 1.55);
    -moz-transition: all 0.2s cubic-bezier(0.68, -0.55, 0.27, 1.55);
    -ms-transition: all 0.2s cubic-bezier(0.68, -0.55, 0.27, 1.55);
    -o-transition: all 0.2s cubic-bezier(0.68, -0.55, 0.27, 1.55);
}

.slide.slide-z-1 .post-img {
    padding: 0;
}

.slide.slide-z-1 .post-img img {
    padding: 14px 0;
}

.post-img {
    display: block;
    max-height: 100%;
    width: 100%;
}

.post-img img {

    width: 100%;
    max-width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
    height: clamp(190px, 41.35vw, 480px);

}

.post-data .wp-post-image {
    border-radius: 16px 16px 0 0;
}

.content-card {
    display: none;
}

.slider-active .content-card {
    display: block;
    margin-top: 40px;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
}

.slide {
    transition: opacity 0.5s ease-in-out;
}

.share-wrapper i svg {
    width: 24px;
    height: 24px;
    user-select: none;
}

.read-time,
.icon-date,
.shareCountcol {
    display: flex;
    align-items: center;
    gap: 8px;
    line-height: 150%;
}

.sideshare-wrapper {
    border-radius: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    overflow: visible;
    position: relative;
}

.sideshare-wrapper .colShare {
    height: 28px;
}

.iprint-post {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 12px;
    cursor: pointer;
}

.popsoacial-wrapper {
    position: absolute;
    left: 0;
    top: 50px;
}

.popsoacial-wrapper .popsocial {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 8px;
    position: absolute;
    left: -48px;
    background: #ebebeb;
    border-radius: 30px;
    padding: 6px 6px !important;
    z-index: 99;
    width: 120px;
}

.popsoacial-wrapper .popsocial li {
    margin-bottom: 0;
}

.popsoacial-wrapper .popsocial li i svg {
    width: 28px;
    height: 28px;
    transition: all 0.5s ease;
}

.popsoacial-wrapper .popsocial li a:hover svg path {
    /* fill: var(--portland-orange); */
    transition: all 0.5s ease;
}

.sidebar-section ul.popsocial {
    opacity: 1;
}

.sidebar-section ul.popsocial li {
    margin: 0;
}

.sidebar-section ul.popsocial li .popsocial i {
    display: flex;
}

i.ireadtime,
i.ipostdate {
    line-height: normal;
    transform: translateY(-2px);
}

.popsocial {
    position: absolute;
    top: 40%;
    left: 0;
    transform: translateY(-50%);
    list-style: none;
    padding: 0 !important;
    margin: 0 !important;
    opacity: 0;
}

.popsoacial-wrapper-scroll-show ul.popsocial {
    position: fixed;
    /* left: 3vw; */
    width: 40px;
    row-gap: 8px;
    display: flex;
    flex-direction: column;
}

.popsocial .playpause-single .pl svg {
    animation: pulse-animation 2s infinite;
    -webkit-animation: pulse-animation 2s infinite;
    border-radius: 50px;
}

@keyframes pulse-animation {
    0% {
        box-shadow: 0 0 0 0px rgb(244 67 54 / 30%);
    }

    100% {
        box-shadow: 0 0 0 7px rgb(244 67 54 / 7%);
    }
}

.popsoacial-wrapper-scroll.popsoacial-wrapper-scroll-show ul.popsocial {
    animation: fadetopshare 2s ease 0s 1 normal forwards;
}

@keyframes fadetopshare {
    0% {
        opacity: 0;
        transform: translateY(-50px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.popsoacial-wrapper-scroll.popsoacial-wrapper-scroll-hide ul.popsocial {
    animation: fadebottshare 2s ease 0s 1 normal forwards;
    -webkit-animation: fadebottshare 2s ease 0s 1 normal forwards;
}

@keyframes fadebottshare {
    0% {
        opacity: 0;
        transform: translateY(50px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.popsoacial-wrapper-scroll-show ul.popsocial li {
    margin-bottom: 0;
}

/* 
ul.popsocial {
    list-style: none;
    position: absolute;
    top: 0;
    right: -70px;
    display: flex;
    flex-direction: column;
    margin: 0;
    gap: 8px;
    background-color: var(--white-color);
    padding: 12px;
    border-radius: 16px;
    box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;
    animation: popclickshare 1s ease 0s 1 normal forwards;
    -webkit-animation: popclickshare 1s ease 0s 1 normal forwards;
} */

@keyframes popclickshare {
    0% {
        opacity: 0;
        transform: rotateY(100deg);
        transform-origin: left;
    }

    100% {
        opacity: 1;
        transform: rotateY(0);
        transform-origin: left;
    }
}

ul.popsocial li:last-child {
    margin-bottom: 0;
}

.mobile-play-pause {
    display: none;
}

.details-post {
    width: 100%;
    gap: 16px;
    display: flex;
    padding: 16px 20px 14px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
}

.details-post .read-time {
    padding-right: 16px;
    border-right: 1px solid var(--Border, #D4D6D7);
}

.col-timeread {
    display: flex;
    gap: 16px;
}

.col-share {
    display: flex;
    gap: 16px;
}

.img-post-card {
    margin-bottom: 20px;
    border-radius: 0px 0px 16px 16px;
    border-right: 1px solid var(--Grey-F7, #F7F7F7);
    border-bottom: 1px solid var(--Grey-F7, #F7F7F7);
    border-left: 1px solid var(--Grey-F7, #F7F7F7);
}

.img-post-card:not(img) {
    border-top: 1px solid var(--Grey-F7, #F7F7F7);
    border-radius: 16px;
}

.singlePost .postContent {
    margin-bottom: 24px;
}

.singlePost .postContent .conclusion-col {
    border: 2px solid #F0F4F3;
    background-color: #F0F4F3;
    padding: 1vw 3vw 1vw 2vw;
    box-shadow: 0 0 0 2px #f1faf9;
    border-radius: 20px;
    margin-top: 20px;
    margin-bottom: 20px;
}

.singlePost .postContent .conclusion-col h2 {
    color: #000000;
    padding-top: 12px;
}

.faq-section-col a.elementor-accordion-title {
    text-decoration: none !important;
    border: none;
    line-height: 1.6;
}

.faq-section-col .elementor-accordion .elementor-tab-title {
    display: flex;
    align-items: center;
    font-weight: 600;
}

.faq-section-col .elementor-accordion .elementor-accordion-item {
    border-radius: 2px;
}

.share-icon {
    display: flex;
    align-items: center;
    gap: 8px;
}

.share-icon span {
    color: var(--dark-blue-text, #263238);
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 120%;
    text-transform: uppercase;
    padding-top: 3px;
}

.share-icon a svg {
    width: 28px;
    height: auto;
    opacity: 0.6;
    transition: all 0.5s ease;
}

.share-icon a:hover svg {
    opacity: 1;
    transition: all 0.5s ease;
}

.toolbar-share {
    border-radius: 16px;
    border: 1px solid var(--Border, #D4D6D7);
    display: flex;
    /* padding: 16px 20px; */
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0;
    visibility: hidden;
    height: 0;
}

.popsocial i {

    display: block;
    cursor: pointer;
}

.popsocial i:before {
    display: none;
}

.popsocial i svg {
    width: 40px;
    height: 40px;
    fill: #000;
    transition: all 0.5s ease;
}

.popsocial .pl svg {
    width: 45px;
    height: 45px;
    margin-left: -2px;
    fill: #F44336;
}

.popsocial li:last-child i svg {
    transform: scale(1.1);
}

.popsocial li:last-child i:hover svg {
    transform: scale(1.2);
}

.popsocial i:hover svg {
    transform: scale(1.1);
    transition: all 0.5s ease;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    opacity: 0.7;
}

.share-wrapper {
    float: left;
}

.commonshare-wrapper,
.popsoacial-wrapper {
    display: none;
}

.socialPostShare ul.postshare {
    animation: shareani 1s ease 0s 1 normal forwards;
    -webkit-animation: shareani 1s ease 0s 1 normal forwards;
}

@keyframes shareani {
    0% {
        opacity: 0;
        transform: translateX(-50px);
        -webkit-transform: translateX(-50px);
        -moz-transform: translateX(-50px);
        -ms-transform: translateX(-50px);
        -o-transform: translateX(-50px);
    }

    100% {
        opacity: 1;
        transform: translateX(0);
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
    }
}

.share-wrapper ul.social {
    opacity: 0;
    visibility: hidden;
    list-style-type: none;
    padding: 0;
    margin: 0;
    transform: translate(-3rem, 3rem);
    transition: visibility 0.4s, opacity 0.4s, -webkit-transform 0.4s;
}

.share-wrapper ul.social.active {
    opacity: 1;
    visibility: visible;
    transform: translate(0);
}

.share-wrapper .share.active+.social li {
    transform: scale(1);
}

.share-wrapper ul.social li {
    width: 53px;
    height: 53px;
    border-radius: 50%;
    color: #FFF;
    background-color: #FFF;
    text-align: center;
    line-height: 2.1;
    font-size: 25px;
    cursor: pointer;
    margin-bottom: 15px;
    box-shadow: 0.5px 0.87px 4px 0 rgba(0, 0, 0, 0.3);
    transition: all 0.4s;
    transform: scale(0.4);
}

.article-group {
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 1.5rem;
    grid-row-gap: 1.5rem;
    grid-template-rows: auto;
    grid-auto-columns: 1fr;
    display: grid;
    position: relative;
}

.artshortContent {
    padding: 20px;
}

.search-bar #ajaxsearchlite1 .probox,
.search-bar div.asl_w .probox {
    border-radius: 12px;
    border: 1px solid var(--Border, #D4D6D7);
    background: none;
    padding: 14px 20px;
    color: var(--text-color);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
}

.formkit-form[data-uid="14573fbc1d"] .formkit-alert-success {
    font-size: var(--text-size);
    font-style: normal;
    font-weight: 800;
    line-height: 120%;
    margin: 0 !important;
}

.wpsisac-slick-slider.design-2 .wpsisac-image-slide .wpsisac-slide-wrap .wpsisac-slider-short-content p {
    margin-bottom: 0;
    font-size: var(--text-size) !important;
    font-family: var(--font-family);
    font-style: normal;
    font-weight: 300;
    line-height: 150%;
    text-shadow: none !important;
}

.middelfix {
    position: relative;
}

.sideimg-fix {
    position: sticky;
    top: 150px;
    /* transform: translateY(-50%); */
}

section.error-404.not-found {
    text-align: center;
    padding: 8rem 2rem;
}

section.error-404.not-found .page-title {
    font-size: var(--mid-heading-size);
}

section.error-404.not-found p {
    font-size: var(--normal-text-size);
}

/* Temp */
.wpcap-grid-container .post-grid-thumbnail .wp-post-image {
    width: 100%;
}

section.pro-collective .slick-slider .slick-track {
    display: flex;
}


.wpsisac-image-slide,
.wpsisac-slide-wrap {
    height: auto !important;
}

.sub-domCard {
    overflow: hidden;
}

.close-search-mobile .elementor-icon {
    cursor: pointer;
    padding: 0.4em;
}

@keyframes arrow-ani {
    0% {
        transform: translateX(-50px);
        -webkit-transform: translateX(-50px);
        -moz-transform: translateX(-50px);
        -ms-transform: translateX(-50px);
        -o-transform: translateX(-50px);
    }

    100% {
        transform: translateX(0);
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
    }
}

body div.asl_r .results .asl_nores {
    overflow: hidden;
    width: auto;
    line-height: initial;
    text-align: center;
    margin: 0;
    background: #fff;
    padding: 10px 3px;
    color: #222;
    height: 60vw;
    max-height: 262px;
}

span.asl_nores_header:before {
    content: '';
    background-image: url(/wp-content/uploads/2024/03/Page-Not-Found.svg);
    width: 100%;
    max-width: 220px;
    background-repeat: no-repeat;
    height: 100%;
    background-size: contain;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateY(-50%) translateX(-50%);
}

body span.asl_nores_header {
    position: relative;
    height: auto;
    display: block;
    width: 100%;
    text-align: center;
    padding-top: 224px;
    color: var(--Mind, #FC5A31);
    font-size: 18px;
    font-style: normal;
    font-weight: 800;
    line-height: 120%;
    letter-spacing: -0.4px;
}

body div.asl_m .probox .proclose svg {
    background: var(--portland-orange);
}

div.asl_w .probox .proclose {
    width: 26px !important;
    height: 22px !important;
}

.footer-ns-content .ns-title {
    color: var(--text-color);
    margin-bottom: 16px;
    font-size: var(--h5-heading-size);
    display: none;
}

.footer-ns-content .ns-para {
    font-size: var(--text-md-size);
    max-width: 650px;
    margin-bottom: 0;
    padding-left: 0;
}

.footer-ns-content {
    max-width: 600px;
}

form.search-form {
    display: none;
}

.search.search-no-results .wrap {
    text-align: center;
    padding: 8rem 4rem;
}

.cookie-section {
    background: var(--text-color);
    display: flex;
    height: 90px;
    padding: 10px 40px;
    justify-content: space-between;
    align-items: center;
}

.cookie-section p {
    color: var(--white-color);
    font-family: var(--font-family);
    font-size: var(--normal-text-size);
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
}

.cookieButtons {
    display: flex;
    gap: 16px;
}

.cookieButtons button {
    display: flex;
    height: 44px;
    padding: 8px 24px !important;
    justify-content: center;
    align-items: center;
    gap: 10px;
    text-shadow: none !important;
    border: none;
    border-radius: 8px !important;
    color: var(--white-color);
    font-size: var(--text-size);
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    outline: none;
}

button#rejectCookies {
    color: inherit;
    background-color: #fff;
}

div#cookieConsent {
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 99999;
    animation: cookies 2s ease 0s 1 normal forwards;
    -webkit-animation: cookies 2s ease 0s 1 normal forwards;
}

@keyframes cookies {
    0% {
        opacity: 0;
        transform: translateY(250px);
        -webkit-transform: translateY(250px);
        -moz-transform: translateY(250px);
        -ms-transform: translateY(250px);
        -o-transform: translateY(250px);
    }

    100% {
        opacity: 1;
        transform: translateY(0px);
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
    }
}

.random_posts,
.newsletter_form_loader,
.ft-newsletter_form_loader {
    display: none;
}

.postloader,
.newsletter_res_loader,
.ft-newsletter_res_loader {
    display: block;
}

.postloader {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.loaderpost {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    display: block;
    margin: 15px auto;
    position: relative;
    background: #FFF;
    box-shadow: -24px 0 #FFF, 24px 0 #FFF;
    box-sizing: border-box;
    animation: shadowPulseloader 2s linear infinite;
    -webkit-animation: shadowPulseloader 2s linear infinite;
}

@keyframes shadowPulseloader {
    33% {
        background: #FFF;
        box-shadow: -24px 0 #FF3D00, 24px 0 #FFF;
    }

    66% {
        background: #FF3D00;
        box-shadow: -24px 0 #FFF, 24px 0 #FFF;
    }

    100% {
        background: #FFF;
        box-shadow: -24px 0 #FFF, 24px 0 #FF3D00;
    }
}


.bannerSlider {
    display: flex;
    align-items: center;
    gap: 20px;
    row-gap: 20px;
    transition: all 0.5s ease;
}

.articleCard.card-1 {
    background-color: var(--dark-flesh);
}

.articleCard.card-3 {
    background-color: var(--dark-palepurple);
}

.bannerSlider .articleCard {
    transition: all 0.5s ease;
    width: 100%;
    height: auto;

}

.bannerSlider .articleCard:hover {
    transform: translate(0, -30px);
    box-shadow: rgba(0, 0, 0, 0.09) 0px 3px 12px;
    cursor: pointer;
    -webkit-transform: translate(0, -30px);
    -moz-transform: translate(0, -30px);
    -ms-transform: translate(0, -30px);
    -o-transform: translate(0, -30px);
}

.img-ani-post img {
    animation: looping 2s ease 0s infinite normal forwards;
}

@keyframes looping {
    0% {
        transform: translate(0);
    }

    20% {
        transform: translate(2px, -2px);
    }

    40% {
        transform: translate(2px, 2px);
    }

    60% {
        transform: translate(-2px, 2px);
    }

    80% {
        transform: translate(-2px, -2px);
    }

    100% {
        transform: translate(0);
    }
}

.bannerSlider .slick-track {
    display: flex;
    gap: 0;
    padding: 40px 0 10px;
    justify-content: space-around;
}

.bannerSlider .slick-track .articleCard {
    margin-right: 20px;
    box-shadow: rgba(0, 0, 0, 0.09) 0px 3px 12px;
}

.bannerSlider .slick-track .articleCard:last-child {
    margin-right: 0;
}

.bannerSlider .slick-track img {
    /* height: 100%; */
    height: 250px;
}

/* .bannerSlider .slick-list {
    overflow: visible;
} */

/* Updated News latter form */


form.formchild-col {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 24px;
    max-width: 650px;
}

.formit-input .con-news-letter-email {
    line-height: 1.4;
    margin: 0;
    -webkit-transition: border-color ease-out 300ms;
    transition: border-color ease-out 300ms;
    background: none;
    display: flex;
    width: 100%;
    height: 50px;
    padding: 8px 24px 0px 30px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    border-radius: 0;
    border: 0;
    border-bottom: 1px solid #263238;
    color: #263238;
    text-overflow: ellipsis;
    font-size: var(--text-md-size);
    position: relative;
    outline: none;
}

.formit-input {
    position: relative;
    width: 100%;
    max-width: calc(100% - 220px);
}

.newsform-col .form-submit-btn {
    width: 100%;
    max-width: 190px;
    border-radius: 12px;
    background: var(--Mind, #FC5A31);
    display: flex;
    height: 55px;
    padding: 16px 24px 14px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    color: var(--White, #FFF);
    text-align: center;
    font-family: 'kokoro';
    font-size: var(--normal-text-size);
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    text-transform: uppercase;
    box-shadow: none;
    text-shadow: none;
    outline: none;
    border: none;
    transition: all 0.5s ease;
    letter-spacing: 0.2px;
    position: relative;
}

.newsform-col .form-submit-btn[disabled],
.newsform-col .form-submit-btn:disabled {
    min-width: 189px;
    font-size: 0;

}

.formit-input:before {
    content: '';
    background-image: url(/wp-content/uploads/2024/03/envelope.svg);
    background-repeat: no-repeat;
    background-size: contain;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 57%;
    transform: translateY(-50%) translateX(0%);

}

.formit-input::placeholder {
    color: var(--white-color);
    opacity: 1;
}

.ns-form-card .formit-input::before {
    /* filter: brightness(10); */
}

.nsloader {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 16px;
    height: 16px;
    border-radius: 50%;
    margin: 15px auto;
    background: #FFF;
    box-shadow: -24px 0 #FFF, 24px 0 #FFF;
    box-sizing: border-box;
    animation: shadowPulse 2s linear infinite;
}



@keyframes shadowPulse {
    33% {
        background: #FFF;
        box-shadow: -24px 0 var(--light-flesh), 24px 0 #FFF;
    }

    66% {
        background: var(--dark-flesh);
        box-shadow: -24px 0 #FFF, 24px 0 #FFF;
    }

    100% {
        background: #FFF;
        box-shadow: -24px 0 #FFF, 24px 0 var(--dark-flesh);
    }
}

.error-message,
.ft-error-message {
    position: absolute;
    color: var(--danger);
    font-size: 13px;
    padding: 4px 0 0;
}

.success-message,
.ft-success-message {
    background: rgb(40 167 69 / 40%);
    padding: 12px;
    text-align: center;
    border-radius: 8px;
    font-weight: 600;
    color: white;
    border: 1px solid #28a745;
    max-width: 650px;
}

.ft-success-message {
    background: rgb(40 167 69 / 100%);
    max-width: 500px;
}

.alert-message,
.ft-alert-message {
    position: absolute;
    background: none;
    padding: 0;
    border: none;
    font-size: 13px;
    padding: 1px 0 0;
    font-weight: 400;
    color: var(--danger);
}

/* Footer New Update form */
.ft-form-col .formit-input {
    max-width: 300px;
    width: 100%;
}

.footer-con-news-letter-email {
    max-width: 100%;
    width: 100%;
    height: 60px;
    padding: 18px 24px 5px 30px;
    border: 0;
    border-bottom: 1px solid var(--Dark-blue, #263238);
    outline: none;
    overflow: hidden;
    color: var(--Dark-blue, #263238);
    text-overflow: ellipsis;
    font-family: 'kokoro';
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    background: none;
}

.ft-form-col {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 auto;
    align-items: center;
    gap: 16px;
}

button#footernewsletterbtn {
    display: flex;
    height: 60px;
    width: 190px;
    padding: 18px 24px 14px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    color: var(--White, #FFF);
    text-align: center;
    font-size: var(--text-size);
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    letter-spacing: 0.2px;
    text-transform: uppercase;
    text-shadow: none;
    border: none;
    transition: all 0.5s ease;
    position: relative;
    outline: none;
}

button#footernewsletterbtn:disabled,
button#footernewsletterbtn[disabled] {
    font-size: 0;
    width: 190px;
    padding: 18px 24px 14px;
}

#ft-form-message {
    position: absolute;
    font-size: 13px;
    margin-top: 0;
}

.ft-error-message {
    color: var(--danger);
}

/* Slider CSS Update */
.slider-container {
    display: block;
    height: 100%;
    width: auto;
    min-height: auto;
    margin: 0 auto;
    position: relative;
    max-width: 1300px;
}

.slider-container .arrow-left {
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translate3d(0, -50%, 0);
    color: white;
    font-size: 28px;
    cursor: pointer;
    z-index: 9;
    height: 20px;
    width: 28px;

}

.slider-container .arrow-right:before {
    content: '';
    background-image: url(/wp-content/uploads/2024/03/arrow.svg);
    position: absolute;
    width: 28px;
    height: 19px;
    background-repeat: no-repeat;
    background-size: contain;
    left: 0;
}

.slider-container .arrow-left:before {
    content: '';
    background-image: url(/wp-content/uploads/2024/03/arrow.svg);
    position: absolute;
    width: 28px;
    height: 19px;
    background-repeat: no-repeat;
    background-size: contain;
    left: 0;
    transform: rotate(180deg);
}

.slider-container span.arrow-disable {
    opacity: 0.3;
    cursor: none;
}

.e-con-boxed .sub-domCard {
    overflow: visible;
}

.e-con-boxed .sub-domCard .lottie-card {
    width: 100%;
    display: inline-block;
    position: relative;
}

.e-con-boxed .sub-domCard .lottie-card .read-now-badge {
    position: absolute;
    width: 100px;
    top: -4px;
    left: -23px;
    -ms-transform: rotate(-25deg);
    -webkit-transform: rotate(-25deg);
    -moz-transform: rotate(-25deg);
    -o-transform: rotate(-25deg);
    transform: rotate(-25deg);
    background-color: #FC5A31;
    text-align: center;
    border-radius: 20px;
    text-transform: uppercase;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: normal;
    height: 28px;
    font-size: 14px;
    padding-top: 1px;
    font-weight: 600 !important;
    letter-spacing: 0.5px;
}

.e-con-boxed .sub-domCard .lottie-card .elementor-widget-container {
    border-radius: 32px;
}

.e-con-boxed .sub-domCard .elementor-image-box-wrapper {
    border-radius: 0 0 32px 32px;
}

.e-con-boxed .sub-domCard .lottie-card .read-now-badge.mind-bedge {
    background-color: #FC5A31;
}

.e-con-boxed .sub-domCard .lottie-card .read-now-badge.body-bedge {
    background-color: #004638;
}

.e-con-boxed .sub-domCard .lottie-card .read-now-badge.self-bedge {
    background-color: #D199F9;
}

/* Survey Page CSS Here */
.survey-top-sec h3 {
    font-size: var(--title-text-size);
}

.survey-top-sec h4 {
    margin-top: 25px;
}

.survey-top-sec .elementor-widget-container img {
    border-radius: 22px;
}

.survey-top-sec .e-con-inner {
    align-items: center !important;
}

.instagram {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
    box-sizing: border-box;
    transition-duration: .3s;
    transition-property: transform;
}

.instagram a {
    padding: 0.5em;
    border-radius: 50%;
    border: 1px solid #000000;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition-duration: .3s;
    transition-property: transform;
}

.instagram a:hover {
    transform: scale(1.1);
}


@media (max-width: 768px) {
    .slider-container .arrow-left {
        display: none;
    }
}

.slider-container .arrow-right {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translate3d(0, -50%, 0);
    color: white;
    font-size: 28px;
    cursor: pointer;
    z-index: 9;
    height: 20px;
    width: 28px;

}

@media (max-width: 768px) {
    .slider-container .arrow-right {
        display: none;
    }
}

.slider-container .dots {
    display: inline-block;
    width: 100%;
    text-align: center;
    user-select: none;
}

.slider-container .dots span {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 2px;
    cursor: pointer;
    user-select: none;
    padding: 10px 0;
    position: relative;
}

.slider-container .dots span:before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate3d(-50%, -50%, 0);
    height: 10px;
    width: 10px;
    border-radius: 50%;
    background-color: #ccc;
    opacity: 0.6;
}

@media (max-width: 768px) {
    .slider-container .dots span {
        width: 16px;
    }
}

.slider-container .dots span.active:before {
    background-color: var(--portland-orange);
    opacity: 1;
}

.slider-container .slider {
    display: block;
    width: 700px;
    min-height: 520px;
    margin: 0 auto;
    position: relative;
    text-align: center;
    color: white;
}

@media (max-width: 991px) {
    .slider-container .slider {
        width: 680px;
        min-height: 470px;
    }

}

@media (max-width: 768px) {
    .slider-container .slider {
        width: 70%;
        min-height: 530px;
    }

}

@media (max-width: 600px) {
    .slider-container .slider {
        width: 80%;
        min-height: 410px;
    }

}

@media (max-width: 480px) {
    .slider-container .slider {
        width: 100%;
    }
}

.slider-container .slider .slide {
    display: flex;
    width: 90%;
    justify-content: center;
    flex-direction: column;
    padding: 30px;
    height: auto;
    min-height: 400px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate3d(-50%, -50%, 0) scale3d(0.4, 0.4, 1);
    transition: transform 0.3s ease-in-out 0s, z-index 0.2s ease-in-out 0.1s;
    background-color: #fdf7e8;
    color: #263238;
    border-radius: 20px;
    /*filter: blur(2px) grayscale(0.4);
        -webkit-filter:;
        */
    filter: blur(1px) grayscale(1);
    -webkit-filter: blur(1px) grayscale(1);
    box-shadow: #fc5a312b 0px 0px 5px 0px, #fc5a3142 0px 0px 1px 0px;
}

.slider-container .slider .slide h3 {
    font-size: 28px;
    width: 100%;
    display: inline-block;
    padding: 30px;
}

.slider-container .slider .slide h3 p {
    margin-top: 16px;
}

.slider-container .slider .slide h3 span {
    margin-bottom: 16px;
    display: block;
}

@media (max-width: 768px) {
    .slider-container .slider .slide {
        width: 100%;
        height: auto;
    }
}

.slider-container .slider .slide.prev-2 {
    transform: translate3d(-105%, -50%, 0) scale3d(0.4, 0.4, 1);
    z-index: 1;
    opacity: 0.5;
}

.slider-container .slider .slide.prev-1 {
    transform: translate3d(-85%, -50%, 0) scale3d(0.6, 0.6, 1);
    z-index: 2;
}

.slider-container .slider .slide.next-1 {
    z-index: 2;
    transform: translate3d(-15%, -50%, 0) scale3d(0.6, 0.6, 1);
}

.slider-container .slider .slide.next-2 {
    z-index: 1;
    transform: translate3d(5%, -50%, 0) scale3d(0.4, 0.4, 1);
    opacity: 0.5;
}

.slider-container .slider .slide.active {
    z-index: 3;
    transform: translate3d(-50%, -50%, 0) scale3d(1, 1, 1);
    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 50px;
    backface-visibility: hidden;
    filter: unset;
}

.sliderImg img {
    width: 100%;
    max-width: 65%;
    border-radius: 24px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 6px;
}

.sliderImg {
    padding: 33px 0;
    overflow: hidden;
}

/* .contentCard-col {
        padding: 0 24px 30px;
    } */
span.iconDate {
    display: inline-block;
}

span.iconDate svg {
    width: 100%;
    max-width: 60px;
    max-height: 60px;
    height: 100%;
}

.daliyDate {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    justify-content: center;
}

.daliytitle {
    font-size: var(--post-heading-size);
    margin-bottom: 0;
}

.daliyVichar {
    font-size: var(--text-md-size);
}

.daliyDate .daliytitle {
    margin-bottom: 0;
    font-size: var(--mid-heading-size);
    line-height: 140%;
}

@media (max-width: 767px) {
    .daliyDate {
        flex-direction: column;
        margin: 0 auto;
    }

    span.iconDate {
        margin: 0 auto;
    }

    .daliytitle {
        width: 100%;
    }

    .sliderImg {
        padding: 24px 0;
    }

    .sliderImg img {
        max-width: 80%;
        border-radius: 18px;
    }

    .slider-container .slider .slide {
        padding: 20px;
    }

    .slider-container .slider .slide {
        min-height: 250px;
    }
}

/* Back to top button */
.btn-scroll-top svg {
    width: 40px;
    height: 40px;
    fill: var(--portland-orange);
    animation: myAnim 2s ease 1s infinite reverse both;
    border-radius: 50px;
    opacity: 0.4;
}

.btn-scroll-top {
    position: fixed;
    bottom: 120px;
    right: 25px;
    cursor: pointer;
    z-index: 99;
    display: none;
}

.btn-scroll-top:hover svg {
    opacity: 1;
}



@keyframes myAnim {
    0% {
        animation-timing-function: ease-out;
        transform: scale(1);
        transform-origin: center center;
    }

    10% {
        animation-timing-function: ease-in;
        transform: scale(0.91);
    }

    17% {
        animation-timing-function: ease-out;
        transform: scale(0.98);
    }

    33% {
        animation-timing-function: ease-in;
        transform: scale(0.87);
    }

    45% {
        animation-timing-function: ease-out;
        transform: scale(1);
    }
}

a.backbtn {
    color: #263238;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    font-weight: 600;
    opacity: 0.8;
    font-size: 15px;
    text-decoration: none;
    transition: all 0.5s ease;
}

.backbtn-col {
    display: block;
    position: absolute;
    top: 15px;
    left: 30px;
}

a.backbtn span svg {
    transform: rotate(180deg);
    width: 24px;
    height: 24px;
}

a.backbtn:hover {
    opacity: 1;
    color: var(--portland-orange);
    transition: all 0.5s ease;
}

form.search-bar:has(input#custom-search:focus) span.close-icon svg {
    color: var(--portland-orange);
}

/* 
.terms-of-use h3 {
    font-size: 32px;
    margin: 40px 0 10px;
}

:is(.privacy-policy, .terms-of-use) .text-editor-content p strong {
    font-weight: 900;
}

:is(.privacy-policy, .terms-of-use) .text-editor-content a {
    color: #fd5930;
}

:is(.privacy-policy, .terms-of-use) .text-editor-content a:hover {
    color: #000;
}

:is(.privacy-policy, .terms-of-use) .text-editor-content p {
    margin-bottom: 1rem;
}

:is(.privacy-policy, .terms-of-use) .text-editor-content :is(ul, ol) {
    padding-left: 2.5rem;
    margin-top: 16px;
    margin-bottom: 20px;
}

:is(.privacy-policy, .terms-of-use) .text-editor-content :is(ul, ol) li::marker {
    font-size: 20px;
}

:is(.privacy-policy, .terms-of-use) .text-editor-content :is(ul, ol) li> :is(ul, ol) {
    padding-left: 2rem;
}

:is(.privacy-policy, .terms-of-use) .text-editor-content :is(ol, ul) li:not(:last-child) {
    margin-bottom: .75rem;
}

:is(.privacy-policy, .terms-of-use) .text-editor-content :is(ol, ul) li {
    font-size: var(--text-md-size);
}

:is(.privacy-policy, .terms-of-use) .text-editor-content ol li>ol {
    list-style-type: lower-alpha;
}

:is(.privacy-policy, .terms-of-use) .text-editor-content table td {
    border: 1px solid #000;
    vertical-align: text-bottom;
    padding: 10px;
}

:is(.privacy-policy, .terms-of-use) .text-editor-content table td p:last-child {
    margin-bottom: 0;
}

:is(.privacy-policy, .terms-of-use) .text-editor-content table td :is(ul, ol) {
    padding-left: 1.2rem;
    margin-top: 5PX;
    margin-bottom: 5px;
}

:is(.privacy-policy, .terms-of-use) .text-editor-content table tbody tr:first-child td {
    background-color: #e9e6df;
    text-align: center;
}

@media(max-width: 767px) {
    :is(.privacy-policy, .terms-of-use) .text-editor-content :is(ul, ol) {
        padding-left: 1.5rem;
    }

    :is(.privacy-policy, .terms-of-use) .text-editor-content :is(ul, ol) li> :is(ul, ol) {
        padding-left: 1.2rem;
    }

    :is(.privacy-policy, .terms-of-use) .text-editor-content p {
        margin-bottom: .75rem;
    }
} */


/* Update Policy CSS */
.policy-term-page ul, .policy-term-page ol {
    padding-left: 1.4em;
    margin-bottom: 2em;
}

.policy-term-page a {
    color: var(--portland-orange);
    text-decoration: none;
    word-break: break-all;
}

.policy-term-page h1 {
    font-size: 42px;
    font-weight: bold;
    margin-bottom: 1rem;
}

.policy-term-page h2 a {
    font-size: 36px;
}

.policy-term-page h2 {
    font-size: 36px;
    font-weight: bold;
    margin-bottom: 0.5rem;
}

.policy-term-page h3 {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 0.5rem;
}

.policy-term-page h4 {
    font-size: 24px;
    font-weight: bold;
    margin: 0;
    margin-bottom: 0.5rem;
}

.policy-term-page h5 {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 0.5rem;
}

.policy-term-page h6 {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 0.5rem;
}

.policy-term-page p, .policy-term-page p span {
    font-size: 18px;
    margin-bottom: 2rem;
    line-height: 1.8;
}

.policy-term-page ul li b,
.policy-term-page ul li strong,
.policy-term-page ul li p b,
.policy-term-page ul li p strong {
    font-size: 18px;
}

.policy-term-page li b,
.policy-term-page li span,
.policy-term-page li {
    font-size: 18px;
    margin-bottom: 1rem;
    line-height: 1.5;
}

.policy-term-page a {
    font-size: 18px;
}

.policy-term-page p strong, .policy-term-page p b {
    font-weight: bold;
    font-size: 18px;
}

.singlePost ol ul,
.singlePost ul ul, .singlePost ol ol {
    padding-left: 14px;
    margin-bottom: 0.2em;
}

.policy-term-page ol li::marker {
    color: var(--brunswick-green);
    font-weight: bold;
}

.policy-term-page ul li::marker {
    font-size: 150%;
    color: var(--portland-orange);
}

.policy-term-page ul ul li::marker {
    font-size: 150%;
    color: var(--portland-orange);
}

.policy-term-page table {
    border: solid 1px rgb(18 70 55 / 50%);
    display: block;
    border-radius: 8px;
}

.policy-term-page table {
    width: 100%;
    table-layout: fixed;
    overflow: auto;
}

.policy-term-page .tbl-header {
    background-color: rgba(255, 255, 255, 0.3);
}

.policy-term-page .tbl-content {
    height: 300px;
    overflow-x: auto;
    margin-top: 0px;
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.policy-term-page th {
    padding: 20px 15px;
    text-align: left;
    font-weight: 500;
    font-size: 12px;
    text-transform: uppercase;
}

.policy-term-page td {
    padding: 15px;
    text-align: left;
    vertical-align: middle;
    font-size: 14px;
    border-bottom: solid 1px rgb(18 70 55 / 50%);
    border-right: solid 1px rgb(18 70 55 / 50%);
}


.policy-term-page td li {
    font-size: 14px;
    margin-bottom: 8px;
    line-height: normal;
}

.policy-term-page td ul, .policy-term-page td ol {
    margin-bottom: 0;
}

.policy-term-page td:last-child {
    border-right: 0;
}

.policy-term-page tr:last-child td {
    border-bottom: 0;
}

.policy-term-page td strong {
    font-weight: 600;
    font-size: 16px;
}

.policy-term-page table tbody td {
    min-width: 250px;
}

/* Update Policy css end */




@media(max-width: 450px) {
    body span.asl_nores_header {
        padding-top: 200px;
    }

    span.asl_nores_header:before {
        max-width: 200px;
    }

    .terms-of-use h3 {
        font-size: 24px;
        margin: 24px 0 10px;
    }
}


@media print {

    header#masthead,
    footer {
        display: none !important;
    }
}

/* Refer a friend */
.form-group-col {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 48px;
}

.form-group-col span.wpcf7-form-control-wrap input.wpcf7-form-control {
    border-radius: 12px;
    border: 1px solid var(--Border, #D4D6D7);
    background: none;
    padding: 14px 18px;
    color: var(--text-color);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
    width: 100%;
    outline: none;
    height: 55px;
}

.form-group-col .form-group {
    /* width: calc(50% - 10px); */
    width: 100%;
    margin-bottom: 0;
}

/* .form-group-col #ref_email_group {
    display: none;
} */
.form-group-col .email-col {
    width: 100%;
}

form.wpcf7-form .ref-from {
    max-width: 650px;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    -o-border-radius: 12px;
}

.rec-title,
.ref-title {
    font-size: var(--title-text-size);
}

.form-group-btn p {
    position: relative;
}

.form-group-btn input.wpcf7-submit {
    min-width: 260px;
    font-weight: 700;
    text-transform: uppercase;
    border-radius: 12px;
    background: var(--Mind, #FC5A31);
    border: none;
    padding: 14px 16px 12px;
    cursor: pointer;
    color: var(--White, #FFF);
    text-align: center;
    font-family: 'kokoro';
    font-size: 16px;
    text-shadow: none;
    height: 50px;
}

.form-group-btn span.wpcf7-spinner {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    margin: 0;
}

.form-group-btn {
    width: fit-content;
    display: block;
}

.form-group-col .wpcf7-form-control-wrap {
    display: block;
}

.form-group-col .wpcf7-form-control-wrap span.wpcf7-not-valid-tip {
    position: absolute;
    bottom: -17px;
    line-height: 1;
    font-size: 13px;
}

.wpcf7 form.invalid .wpcf7-response-output {
    border: none;
    margin: 20px;
    padding: 0;
}

.wpcf7 input::placeholder {
    font-style: italic;
}

.wpcf7 .wpcf7-response-output {
    display: none;
}

.thankyoucard-share {
    box-shadow: none;
    text-align: center;
    padding: 40px 20px;
}

.thankyoucard-share h3 {
    font-size: var(--title-text-size);
}

span.icon-thanks {
    max-width: 200px;
    height: 100%;
    display: block;
    margin: 0 auto;
    padding: 20px;
}

span.icon-thanks svg {
    fill: #28a745;
    animation: thanks 1s ease 1s 3 normal forwards;
    -webkit-animation: thanks 1s ease 1s 3 normal forwards;
}

@keyframes thanks {
    0% {
        transform: scale3d(1, 1, 1);
        fill: var(--light-palepurple);
    }

    30% {
        transform: scale3d(1.25, 0.75, 1);
        fill: var(--light-green);
    }

    40% {
        transform: scale3d(0.75, 1.25, 1);
        fill: var(--light-flesh);
    }

    50% {
        transform: scale3d(1.15, 0.85, 1);
        fill: var(--dark-palepurple);
    }

    65% {
        transform: scale3d(0.95, 1.05, 1);
        fill: var(--dark-flesh);
    }

    75% {
        transform: scale3d(1.05, 0.95, 1);
        fill: var(--danger);
    }

    100% {
        transform: scale3d(1, 1, 1);
        fill: #28a745;
    }
}

@media only screen and (max-width: 768px) {
    form.wpcf7-form .ref-from {
        padding: 0;
        max-width: 100%;
    }

    .form-group-col {
        flex-direction: column;
        margin-bottom: 24px;
    }

    .form-group-col .form-group {
        width: 100%;
        margin-bottom: 0;
    }

    .form-group-btn input.wpcf7-submit {
        min-width: 150px;
    }

    .thankyoucard-share {
        padding: 20px;
    }

    span.icon-thanks svg {
        width: 100px;
    }

}

/*Update Newsletter Section  */
.subscription_count {
    display: flex;
    align-items: center;
    gap: 6px;
    background: #fff;
    width: fit-content;
    padding: 4px 20px;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 600;
    color: #fc5a31;
}

span.icon-stock {
    overflow: hidden;
}

span.icon-stock img {
    width: 36px;
    height: 36px;
    object-fit: contain;
    transform: scale(2.5);
}

/* Count Sub */

.user_account_icon a {
    border-radius: 12px;
    border: 1px solid var(--Border, #D4D6D7);
    display: flex;
    height: 44px;
    padding: 10px;
    align-items: center;
    gap: 52px;
    background: no-repeat;
}

.user_account_icon svg {
    width: 32px;
    height: 32px;
    fill: #263238;
}
.user-count-landing {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: var(--text-md-size);
    color: var(--text-color);
    font-weight: 600;
}

.user-count-landing p {
    font-size: var(--text-md-size);
    color: var(--text-color);
    font-weight: 600;
    margin-bottom: 0;
}

.arrow-subuser svg {
    fill: #f44336;
    display: inline-block;
    position: absolute;
    right: -4rem;
    top: -2px;
    animation: arrowmove 3s ease 0s infinite normal forwards;
}

@keyframes arrowmove {

    0%,
    100% {
        transform: translateY(0) rotate(0);
        transform-origin: 50% 50%;
    }

    15% {
        transform: translateY(-5px) rotate(-6deg);
    }

    30% {
        transform: translateY(3px) rotate(6deg);
    }

    45% {
        transform: translateY(-5px) rotate(-3.6deg);
    }

    60% {
        transform: translateY(2px) rotate(2.4deg);
    }

    75% {
        transform: translateY(-0px) rotate(-1.2deg);
    }
}

.user-sub-imageicon img {
    max-width: 120px;
    width: 100%;
}

.user-sub-imageicon {
    display: flex;
    align-items: center;
}

.arrow-text-reader {
    display: flex;
    align-items: center;
    max-width: 170px;
    width: 100%;
}

span.text-reader {
    font-size: var(--text-md-size);
    color: var(--text-color);
    font-weight: 600;
}

.count-col {
    background-color: var(--dark-palepurple);
    padding: 9px 10px 4px;
    font-size: var(--h5-heading-size);
    font-family: 'kokoro';
    font-weight: 700;
}

.count-number {
    font-size: var(--h5-heading-size);
    font-family: 'kokoro';
    font-weight: 700;
}

.arrow-subuser {
    position: relative;
}

.arrow-subuser svg {
    fill: #f44336;
    display: inline-block;
    position: absolute;
    right: -4rem;
    top: -2px;
    animation: arrowmove 3s ease 0s infinite normal forwards;
}

@media only screen and (max-width: 767px) {

    /* .hide-mob {
    display: none;
} */
    .count-col {
        order: 1;
    }

    .user-sub-imageicon {
        order: 2;
    }

    .arrow-text-reader {
        order: 3;
    }
}

/* Feedback form  */
div#feedbackModal {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    background: rgb(47 47 47 / 94%);
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
}

textarea#feedback_message {
    width: 100%;
    height: 90px;
    padding: 0 24px 5px 30px;
    border: 0;
    border-bottom: 1px solid var(--Dark-blue, #263238);
    outline: none;
    color: var(--Dark-blue, #263238);
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    display: -webkit-box;
    background: none;
    resize: none;
    overflow: auto;
}

.form-group-col:has(textarea#feedback_message) span.wpcf7-form-control-wrap:before {
    background-image: url(/wp-content/themes/kokoro-child/assets/images/comment.svg);
    top: 12px;
    width: 24px;
    height: 24px;
}

div#feedbackModal span.wpcf7-form-control-wrap {
    position: relative;
}

div#feedbackModal span.wpcf7-form-control-wrap:before {
    content: '';
    background-image: url(/wp-content/uploads/2024/03/envelope.svg);
    background-repeat: no-repeat;
    background-size: contain;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 34px;
    transform: translateY(-50%) translateX(0%);
}

.feedback-col-from .form-group-col {
    margin-bottom: 24px;
}

.feedback-col-from .form-group input#feedback_email::placeholder {
    font-style: normal;
}

.feedback-col-from .form-group-col span.wpcf7-form-control-wrap input.wpcf7-form-control {
    max-width: 100%;
    width: 100%;
    height: 60px;
    padding: 18px 24px 5px 30px;
    border: 0;
    border-bottom: 1px solid var(--Dark-blue, #263238);
    outline: none;
    color: var(--Dark-blue, #263238);
    font-family: 'kokoro';
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    background: none;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

.feedback-close-modal {
    position: absolute;
    right: -18px;
    top: -18px;
    background: #263238;
    padding: 12px;
    border-radius: 50px;
    z-index: 9;
}

.feedback-col-from .form-group input#feedback_email {
    color: var(--text-color);
}

.feedback-close-modal svg {
    width: 32px;
    height: 32px;
    cursor: pointer;
}

.feedback-close-modal svg path {
    fill: #E6EDEB;
}

.modal-feedback-card {
    background: #FFFBF2;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 94%;
    max-width: 1200px;
    gap: 24px;
    position: relative;
    box-shadow: rgba(17, 17, 26, 0.1) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 48px;
}

.feedback-modal-content {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    padding: 3vw;
    overflow: hidden;
    gap: 2vw;
    border-radius: 16px;
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    -ms-border-radius: 16px;
    -o-border-radius: 16px;
}

.feedback-modal-content:after {
    content: '';
    background-image: url(/wp-content/themes/kokoro-child/assets/images/feedback-bg.svg);
    background-size: 100%;
    background-repeat: no-repeat;
    position: absolute;
    right: 5px;
    bottom: 2px;
    width: 189.211px;
    height: 164.969px;
}

.feedback-modal-content::before {
    content: '';
    background-image: url(/wp-content/themes/kokoro-child/assets/images/bgttop.svg);
    background-size: 100%;
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
    top: 2px;
    width: 189.211px;
    height: 164.969px;
    z-index: 1;
}

.feedback-col-from .form-group-col:last-child {
    margin-bottom: 0;
}

.title-feedback {
    color: var(--text-color);
    font-style: normal;
    font-size: clamp(24px, 5.35vw, 59px);
    font-weight: 700;
    line-height: 120%;
    margin-bottom: 20px;
    width: fit-content;
}

.para-feedback {
    margin-bottom: 24px;
}

.feedback-modal-content .wpcf7 {
    width: 100%;
}

.modal-feedback-card:has(.sent) .feedback-modal-content,
.modal-feedback-card:has(.invalid) .feedback-modal-content {
    padding-bottom: 60px;
    transition: all 0.5s ease;
}

div#feedbackModal span.wpcf7-spinner {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 16px;
    height: 16px;
    border-radius: 50%;
    margin: 0 auto;
    background: #FFF;
    box-shadow: -24px 0 #FFF, 24px 0 #FFF;
    box-sizing: border-box;
    animation: shadowPulse 2s linear infinite;
    opacity: 1;
    top: 20px;

}

div#feedbackModal span.wpcf7-spinner::before {
    display: none;
}


@keyframes shadowPulse {
    33% {
        background: #FFF;
        box-shadow: -24px 0 var(--light-flesh), 24px 0 #FFF;
    }

    66% {
        background: var(--dark-flesh);
        box-shadow: -24px 0 #FFF, 24px 0 #FFF;
    }

    100% {
        background: #FFF;
        box-shadow: -24px 0 #FFF, 24px 0 var(--dark-flesh);
    }
}

.feedback-modal-content form.submitting input#feedback_submit {
    font-size: 0;

}

input#feedback_submit {
    padding: 18px 50px 14px;
    color: var(--White, #FFF);
    text-align: center;
    font-size: var(--text-size);
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    letter-spacing: 0.2px;
    text-transform: uppercase;
    text-shadow: none;
    border: none;
    transition: all 0.1s ease;
    position: relative;
    width: 100%;
    outline: none;
    height: 54px;
    -webkit-transition: all 0.1s ease;
    -moz-transition: all 0.1s ease;
    -ms-transition: all 0.1s ease;
    -o-transition: all 0.1s ease;
}

div#feedbackModal .wpcf7-response-output {
    margin: 0;
    margin-top: 12px;
    animation: msgformani 2s ease 0s 1 normal forwards;
    position: absolute;
    width: 100%;
    left: 0;
    bottom: -1px;
    border-radius: 0 !important;
    font-weight: 700;
    line-height: 130%;
}


.feedback-modal-content form.sent .wpcf7-response-output {
    border: none;
    color: #fff;
    padding: 8px;
    background: #46b450;
    border-radius: 8px;
    font-size: 14px;
    text-align: center;
}

.feedback-modal-content form.invalid .wpcf7-response-output {
    color: #fff;
    padding: 8px;
    background: #dc3545;
    border-radius: 8px;
    font-size: 14px;
    text-align: center;
}

@keyframes msgformani {
    0% {
        opacity: 0;
        transform: rotateX(-70deg);
        transform-origin: bottom;
    }

    100% {
        opacity: 1;
        transform: rotateX(0);
        transform-origin: bottom;
    }
}

.feedbackImage {
    width: 40%;
}

.feedbackImage img {
    width: 100%;
    max-width: clamp(35vw, 29.35vw, 36vw);
    float: right;
    position: relative;
    top: -6rem;
    z-index: 2;
}

.formSide {
    width: 60%;
    z-index: 9;
}

.form-group.submit-btn-fd span.wpcf7-spinner {
    margin: 0;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateY(-50%) translateX(-50%);
}

.form-group.submit-btn-fd p {
    position: relative;
}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
    div#feedbackModal {
        overflow: scroll;
        padding-top: 40%;
        padding-bottom: 10%;
    }
}

@media only screen and (min-device-width: 400px) and (max-device-width: 767px) and (orientation: landscape) {
    div#feedbackModal {
        overflow: scroll;
        padding-top: 65%;
        padding-bottom: 10%;
    }
}

@media only screen and (min-device-width : 300px) and (max-device-width : 767px) and (orientation : portrait) {
    div#feedbackModal {
        overflow: scroll;
        padding-top: 65%;
        padding-bottom: 12%;
    }

    /* .singlePost li, .singlePost p, .singlePost li p, .singlePost a, .singlePost b, .singlePost strong, .singlePost em, .singlePost i, .singlePost cite, .singlePost q, .singlePost p span, .singlePost li span {
        font-size: 17px !important;
    } */
}

/* SUBSCRIBE TO NEWSLETTER Article  */
.single-post-box .ns-wrap1 {
    display: flex;
    align-items: center;
    gap: 3vw;
    border-radius: 24px;
    border: 1px solid var(--text-color);
    flex-direction: row;
    max-width: 1100px;
    margin-top: 20px;
    margin-bottom: 20px;
    padding: clamp(20px, 3.92vw, 1.5vw);
}

.singlePost .single-post-box .ns-wrap1 {
    background: var(--Background, #FFFBF2);
}

.single-post-box .ns-wrap1 p.ns-para {
    padding: 0;
    margin-bottom: 10px;
    font-size: clamp(14px, 1.25vw, 18px) !important;
}

section.single-post-box .ns-content {
    display: flex;
    padding: 0;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding-bottom: 0.5rem;
}

section.single-post-box .ns-content .ns-title {
    margin-bottom: 24px;
    margin-top: 0;
    font-size: clamp(18px, 1.65vw, 28px);
    color: #263238;

}

section.single-post-box form#newsletter-form-article .form-submit-btn {
    max-width: 100%;
}

section.single-post-box form#newsletter-form-article .formit-input {
    position: relative;
    width: 100%;
    max-width: 100%;
}

section.single-post-box .ns-image {
    width: 35vw;
    max-width: 345px;
}

section.single-post-box .ns-image img {
    margin: 0;
}

.single-post-box .ns-wrap1 input#articleemail {
    padding-right: 8px;
}

section.single-post-box .newsform-col .success-message {
    background: rgb(40 167 69 / 66%);
    margin-bottom: 0;
}

.grecaptcha-badge {
    display: none !important;
}

/* Audio Player Article */

.singlePost .post-data {
    overflow: hidden;
}

.singlePost .audio-wrapper {
    display: block;
    width: 100%;
    max-width: 100%;
    transform: unset;
    background: #fff;
    padding: 4px;
    margin: 20px 0;
    box-shadow: none;
    border: 1px solid #eeeeee;
    position: relative;
    left: 0;
    top: 8px;
    transition: all 0.1s ease;
    z-index: 1;

}

.singlePost .audio-wrapper h6,
.singlePost .audio-wrapper .closeIconAudio-single {
    display: none;
}

.singlePost .audio-wrapper-single,
.singlePost .audio-wrapper-single:has(.audioplayer.audioplayer-playing) {
    position: fixed;
    height: max-content;
    width: 45vw;
    left: 50%;
    transform: translateX(-50%);
    box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
    background: #ffefeb;
    background-size: 400% 400%;
    animation: gradient 15s ease infinite;
    padding: 1vw 1vw 1.5vw;
    border-radius: 8px;
    transition: all 0.5s ease;
    z-index: 999;
    backdrop-filter: blur(20px);
    bottom: 20px;
    margin: 0;
}

.singlePost .audio-fixed {
    max-width: 600px;
    position: fixed;
    height: max-content;
    width: 100%;
    left: 50%;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
    background: #ffefeb;
    background-size: 400% 400%;
    animation: gradient 15s ease infinite;
    padding: 1vw 1vw 1.5vw;
    border-radius: 8px;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transition: all 0.5s ease;
    z-index: 999;
    backdrop-filter: blur(20px);
    bottom: 0;
    top: unset;
}

.singlePost:has(.audio-fixed) .postContent {
    padding-top: 5px;
    transition: all 0.2s ease;
}

.singlePost .postContent {
    transition: all 0.5s ease;
}

.singlePost .audio-fixed h6, .singlePost .audio-fixed .closeIconAudio-single {
    display: block;
}

.closeIconAudio-single {
    position: absolute;
    right: -12px;
    top: -12px;
    background: #fc5a31;
    border-radius: 50px;
    padding: 10px;
    cursor: pointer;
}

.closeIconAudio-single svg {
    width: 24px;
    height: auto;
}

.singlePost .audio-wrapper .audioplayer {
    margin: 0;
    height: auto;
    border-radius: 12px;
    background: #ffffff;
    padding: 4px 8px;
}

.singlePost .audio-fixed .audioplayer {
    margin: 0;
    background: #ffffff;
    padding: 10px 10px;
    border: 0;
    height: auto;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    -o-border-radius: 12px;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
    justify-content: center;
}

.audio-wrapper-single .audioplayer {
    margin: 0;
}

.singlePost .audio-wrapper .audio-player-stream {
    margin-bottom: 0;
    font-size: 11px;
    padding: 0;
}

.singlePost .audio-wrapper-single .audioplayer {
    margin: 0;
    height: auto;
    border-radius: 8px;
    padding: 8px 8px;
    background: #0000000a;
}

.singlePost .audio-wrapper-single .closeIconAudiox,
.singlePost .audio-wrapper-single h6 {
    display: flex;
}

.audioplayer {
    padding: 10px 10px;
    background: #0000000a;
    border: 0;
    height: auto;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    -o-border-radius: 12px;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
    justify-content: center;
}

.audioplayer .audioplayer-playpause {
    width: 25px;
    height: 25px;
}

.audioplayer .audioplayer-time-current {
    margin: 0;
}

.audioplayer .audioplayer-time-duration {
    margin: 0 10px 0 0;
}

.audioplayer .audioplayer-volume .audioplayer-volume-adjust {
    margin: 0;
    width: 100%;
}

.audioplayer audio {
    display: none;
}

.audioplayer-volume-adjust div div {
    background-color: #FC5A31 !important;
}

.audioplayer .audioplayer-playpause {
    border-color: #FC5A31 !important;
}

.audioplayer .audioplayer-playpause a {
    border-left-color: #FC5A31 !important;
}

.audioplayer .audioplayer-time {
    color: #263238;
}

.audioplayer .audioplayer-bar {
    margin: 0 8px;
    width: 40px;
}

.audioplayer:not(.audioplayer-mute) .audioplayer-volume-button a:after {
    top: 1px;
}

.audioplayer-playing .audioplayer-bar-played::after {
    border: 2px solid #FC5A31 !important;
}

.audioplayer-bar-played {
    background: -webkit-linear-gradient(left, #f45a31, #f9b7aa);
}

@media screen and (max-width: 679px) {
    .audioplayer-volume-adjust {
        display: block;
    }
}

@media screen and (max-width: 767px) {
    .audioplayer-volume-adjust {
        display: block;
    }

    .singlePost .audio-wrapper-single {
        max-width: 450px;
        width: 100%;
        margin: 0 auto;
        left: 50%;
        transform: translateX(-50%);
        padding: 14px 10px 20px;
    }

    .details-post {
        gap: 8px;
        display: flex;
        padding: 8px 8px;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;
    }

    .col-timeread {
        display: flex;
        gap: 16px;
        transform: translateY(2px);
    }

    .details-post .sideshare-wrapper, .details-post .iprint-post {
        font-size: 0;
        gap: 0;
    }
}

@media screen and (max-width: 420px) {
    .singlePost .audio-wrapper-single {
        max-width: 300px;
    }

    .details-post .read-time {
        display: none;
    }
}

/* audio Loader */
#wrapper:has(.audioplayer) .audio-loader {
    display: none;
}

.audio-loader {
    border: 2px solid #FFF;
    width: 36px;
    height: 36px;
    background: #FF3D00;
    border-radius: 50%;
    display: block;
    margin: 0 auto;
    position: relative;
    box-sizing: border-box;
    animation: rotation 2s linear infinite;
}

.audio-loader::after {
    content: '';
    box-sizing: border-box;
    position: absolute;
    left: 50%;
    top: 50%;
    border: 14px solid;
    border-color: transparent #FFF;
    border-radius: 50%;
    transform: translate(-50%, -50%);
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* Promet Section Css */
/* Single Article Modal */

.chat_res_loader {
    width: 100%;
    height: 215px;
    display: block;
    margin: auto;
    position: relative;
    box-sizing: border-box;
}

.chat_res_loader::after {
    content: '';
    width: calc(100% - 30px);
    height: calc(100% - 15px);
    top: 15px;
    left: 15px;
    position: absolute;
    background-image: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5) 50%, transparent 100%),
        linear-gradient(#d7d7d7 100px, transparent 0),
        linear-gradient(#d7d7d7 16px, transparent 0),
        linear-gradient(#d7d7d7 50px, transparent 0);
    background-repeat: no-repeat;
    background-size: 75px 175px, 100% 100px, 100% 16px, 100% 30px;
    background-position: -185px 0, center 0, center 115px, center 142px;
    box-sizing: border-box;
    animation: animloader 1s linear infinite;
}

.wrapper-tags {
    display: flex;
    gap: 16px;
    align-items: center;
    margin-top: 24px;
    flex-wrap: wrap;
    /* border-bottom: 1px solid var(--Border, #D4D6D7); */
    padding-bottom: 30px;
}

.wrapper-tags .article-tags {
    padding: 14px 30px 12px 15px;
    border-radius: 50px;
    text-align: left;
    line-height: 120%;
    cursor: pointer;
    width: 100%;
    background: #FFEFEA;
    color: #263238;
    font-weight: 500;
    display: flex;
    align-items: center;
    column-gap: 10px;
}

.wrapper-tags .article-tags:nth-child(2) {
    background: #F0F4F3;
}

.wrapper-tags .article-tags:nth-child(3) {
    background: #FAF5FE;
}

.wrapper-tags .article-tags img {
    width: 24px;
    margin: 0;
    height: auto;
}

/* div#wrapper {
    padding-top: 15px;
} */
.singleArticle-modal {
    background: rgb(0 0 0 / 86%);
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 99999999999;
    box-shadow: rgba(0, 0, 0, 0.283) 0px 3px 12px;
    height: 100%;
    display: none;
    transition: all .5s ease-in-out;
}

.cardModal-pro {
    position: relative;
    max-width: 450px;
    float: right;
    right: 20px;
    top: 20px;
    bottom: 0;
    background: #fff;
    height: 98%;
    border-radius: 16px 60px 0 0;
    overflow: hidden;
}

.singleArticle-modal.popup-active {
    display: block;
}

.likeunlink-col {
    display: block;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
}

.smily-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    color: rgb(0 71 58 / 73%);
    background: #fff;
    padding: 12px;
    height: 64px;
    border-top: 2px solid rgb(0 70 56 / 20%);
}

.smily-icon span img, .smily-icon span svg {
    margin: 0;
    max-width: 44px;
    cursor: pointer;
}

.smily-icon span img.like-img-animation {
    display: none;
}

.smily-icon .like:hover img.like-img {
    display: none;
}

.smily-icon .like:hover img.like-img-animation {
    display: block;
}

div#likedResponse {
    padding: 18px;
    text-align: center;
    color: #28a745;
    font-size: var(--button-text-size);
    text-transform: uppercase;
    background: #f0f4f3;
    font-weight: 600;
    height: 64px;
    display: none;
}

.smily-icon .icon {
    width: 40px;
    height: 40px;
}

@keyframes smileicon {
    0% {
        animation-timing-function: ease-out;
        transform: scale(1);
        transform-origin: center center;
    }

    10% {
        animation-timing-function: ease-in;
        transform: scale(0.91);
    }

    17% {
        animation-timing-function: ease-out;
        transform: scale(0.98);
    }

    33% {
        animation-timing-function: ease-in;
        transform: scale(0.87);
    }

    45% {
        animation-timing-function: ease-out;
        transform: scale(1);
    }
}

span#disliked {
    cursor: pointer;
}

/* span#disliked svg{       
    animation: dislinkicon 2s ease 1s infinite normal forwards;
}  */
span#disliked:hover svg {
    animation: dislinkicon 1s ease 1s 1 normal forwards;
    -webkit-animation: dislinkicon 1s ease 1s 1 normal forwards;
}


@keyframes dislinkicon {

    0%,
    100% {
        transform: translateX(0%);
        transform-origin: 50% 50%;
    }

    15% {
        transform: translateX(-3px) rotate(6deg);
        -webkit-transform: translateX(-3px) rotate(6deg);
        -moz-transform: translateX(-3px) rotate(6deg);
        -ms-transform: translateX(-3px) rotate(6deg);
        -o-transform: translateX(-3px) rotate(6deg);
    }

    30% {
        transform: translateX(2px) rotate(-6deg);
        -webkit-transform: translateX(2px) rotate(-6deg);
        -moz-transform: translateX(2px) rotate(-6deg);
        -ms-transform: translateX(2px) rotate(-6deg);
        -o-transform: translateX(2px) rotate(-6deg);
    }

    45% {
        transform: translateX(-3px) rotate(3.6deg);
        -webkit-transform: translateX(-3px) rotate(3.6deg);
        -moz-transform: translateX(-3px) rotate(3.6deg);
        -ms-transform: translateX(-3px) rotate(3.6deg);
        -o-transform: translateX(-3px) rotate(3.6deg);
    }

    60% {
        transform: translateX(2px) rotate(-2.4deg);
        -webkit-transform: translateX(2px) rotate(-2.4deg);
        -moz-transform: translateX(2px) rotate(-2.4deg);
        -ms-transform: translateX(2px) rotate(-2.4deg);
        -o-transform: translateX(2px) rotate(-2.4deg);
    }

    75% {
        transform: translateX(-1px) rotate(1.2deg);
        -webkit-transform: translateX(-1px) rotate(1.2deg);
        -moz-transform: translateX(-1px) rotate(1.2deg);
        -ms-transform: translateX(-1px) rotate(1.2deg);
        -o-transform: translateX(-1px) rotate(1.2deg);
    }
}

.singleArticle-modal .sa-icon {
    position: absolute;
    right: 8px;
    top: 8px;
    cursor: pointer;
    transition: all 0.5s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 20px;
    background: #fc5a31;
    z-index: 1;
    /* animation: cardModalclose 2s ease 8s 3 normal forwards; */
}

/* @keyframes cardModalclose {
	0% {
		transform: scale(0.5);
	}

	100% {
		transform: scale(1);
        opacity: 1;
	}
} */
form#survay_form {
    margin-top: 24px;
}

.popupModal-content {
    position: relative;
    overflow: auto;
    height: calc(90% - 65px);

}

#aiappendcontent {
    padding: 20px 20px 40px;
    height: 100%;
    overflow: auto;
}

.singleArticle-modal .sa-icon svg {
    width: 16px;
    height: 16px;
}

.singleArticle-modal .sa-icon svg path {
    fill: #fff;
}

.singleArticle-modal .sa-icon:hover {
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    opacity: 0.8;
}

#popupModal-content {
    height: 100%;
}

.singleArticle-modal .title {
    color: #263238;
    font-size: var(--sub-text-size);
    font-weight: 600;
    padding: 28px 20px 8px;
    line-height: 130%;
    border-bottom: 2px solid rgb(0 70 56 / 20%);
    border-radius: 24px;
}

.aicontent {
    font-size: var(--p-text-size);
    line-height: 130%;
}

/* DK loader */
/* .daily_kokoro_loader_load  {
    animation-name: spin;
    animation-duration: 2200ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    margin-left: -30px;
  } */
/* .daily_kokoro_loader_load :after{
    content: '';
    position: absolute;
    inset: 8px;
    margin: auto;
    background: #222b32;
     border-radius: 50%;
  } */
.daily_kokoro_loader_load:before {
    content: "";
    background: url(/wp-content/uploads/2024/06/Loader.png);
    width: 34px;
    height: 32px;
    background-size: cover;
    background-repeat: no-repeat;
    display: inline-block;
    vertical-align: middle;
    animation: rotation 1s linear infinite;
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/*       
.daily_kokoro_loader_load {
    width: 100%;
    max-width: 400px;
    height: 250px;
    margin: 6vw auto;
    background: #979794;
    box-sizing: border-box;
    position: relative;
    border-radius:8px;
    perspective: 1000px;
    }
    
    .daily_kokoro_loader_load:before{
    content: '';
    position: absolute;
    left: 10px;
    right: 10px;
    top: 10px;
    bottom: 10px;
    border-radius:8px;
    background: #f5f5f5  no-repeat;
    background-size: 60px 10px;
    background-image: 	linear-gradient(#ddd 100px, transparent 0) ,
                linear-gradient(#ddd 100px, transparent 0), 
                linear-gradient(#ddd 100px, transparent 0), 
                linear-gradient(#ddd 100px, transparent 0), 
                linear-gradient(#ddd 100px, transparent 0), 
                linear-gradient(#ddd 100px, transparent 0);
    
    background-position: 15px 30px , 15px 60px , 15px 90px, 
                105px 30px , 105px 60px , 105px 90px;
    box-shadow: 0 0 10px rgba(0,0,0,0.25);
    }
    .daily_kokoro_loader_load:after {
    content: '';
        position: absolute;
        width: calc(50% - 10px);
        right: 10px;
        top: 10px;
        bottom: 10px;
        border-radius: 8px;
        background: #fff no-repeat;
        background-size: 60px 10px;
        background-image: linear-gradient(#ddd 100px, transparent 0), 
                linear-gradient(#ddd 100px, transparent 0), 
                linear-gradient(#ddd 100px, transparent 0);
        background-position: 50% 30px ,50% 60px , 50%  90px;
        transform: rotateY(0deg );
        transform-origin: left center;
    animation: paging 1s linear infinite;
    }
    
    
    @keyframes paging {
    to {
        transform: rotateY( -180deg );
    }
    } */

/*Dk loader end*/

/* (category page) Start */

.cat-article-box,
.cat-most-read-article-box,
.box-all-article-box {
    display: grid;
    justify-content: center;
    gap: 20px;
    row-gap: 20px;
    grid-template-columns: 1fr 1fr 1fr;
    transition: all 0.5s ease;
}

.dynamic-content {
    grid-column: 1 / span 3;
    display: flex;
    padding: 80px;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    align-self: stretch;
    /* background: var(--Body-Light, #B0C6C1); */
    position: relative;
    margin-top: 4vw;
    margin-bottom: 4vw;
}

section.todays-article .content {
    display: flex;
    align-items: center;
    gap: 40px;
    /* padding-top: 40px; */
}

section.todays-article .content>a {
    display: none;
}

.dynmic-title p {
    /* color: var(--Mind, #FC5A31); */
    text-align: center;
    font-size: clamp(20px, 2.35vw, 34px);
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
}

.dynmic-auth {
    /* color: var(--Mind, #FC5A31); */
    text-align: center;
    font-size: clamp(14px, 1.35vw, 18px);
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
    margin-top: 30px;
    margin-bottom: 0;
}

.mind-bg .dynmic-auth,
.mind-bg .dynmic-title p {
    color: var(--Mind, #FC5A31);
}

.body-bg .dynmic-auth,
.body-bg .dynmic-title p {
    color: var(--Body, #004638);
}

.self-bg .dynmic-auth,
.self-bg .dynmic-title p {
    color: #BE6FF6;
}

.dynamic-content:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 100%;
    left: -50%;
    z-index: -1;
}

.mind-bg:before {
    background-color: #FFEFEA;
    background-image: url(/wp-content/themes/kokoro-child/assets/images/mind-bg.svg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;

}

.body-bg:before {
    background-color: #b0c6c1;
    background-image: url(/wp-content/themes/kokoro-child/assets/images/body-bg.svg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;

}

.self-bg:before {
    background-color: #FAF5FE;
    background-image: url(/wp-content/themes/kokoro-child/assets/images/self-bg.svg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;

}

.cat-single-post-box {
    grid-column: 1 / span 3;
    display: flex;
    padding: 60px 0;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 24px;
    align-self: stretch;
    position: relative;
    margin-top: 4vw;
    margin-bottom: 4vw;
}

.cat-single-post-box:before {
    content: '';
    position: absolute;
    width: 200%;
    height: 100%;
    left: -50%;
    z-index: -1;
    background-color: #004638;
}

section.single-post-box.cat-single-post-box .ns-content {
    padding-bottom: 0;
}

.box-all-article-box .cat-single-post-box .ns-wrap1 {
    max-width: 100%;
    width: 100%;
    padding: 0;
    border: none;
    margin: 0;
    border-radius: 0;
}

.cat-nes-check {
    display: inline-block;
    margin-right: 10px;
}

.box-all-article-box .cat-single-post-box .ns-wrap1 .ns-content {
    width: calc(100% - 40%);
}

.box-all-article-box .cat-single-post-box .ns-wrap1 .ns-content .user-count-landing {
    margin: 5px 0 10px;
}

.box-all-article-box .cat-single-post-box .ns-image {
    width: 40%;
}

.box-all-article-box .cat-single-post-box .ns-image img {
    margin-bottom: -60px;
}

.box-all-article-box .cat-single-post-box .ns-wrap1 .ns-content .user-count-landing p {
    color: #fff;
}

.box-all-article-box .cat-single-post-box .ns-wrap1 .ns-content .ns-title {
    color: var(--White, #FFF);
    font-size: clamp(24px, 2.35vw, 34px);
    font-style: normal;
    font-weight: 800;
    line-height: 120%;
    /* 40.8px */
    text-transform: uppercase;
}

.box-all-article-box .cat-single-post-box .ns-wrap1 .ns-content .ns-para {
    color: var(--White, #FFF);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 150%;
    /* 24px */
    letter-spacing: 0.32px;
    display: flex;
}

.box-all-article-box .cat-single-post-box .ns-wrap1 .ns-content .ns-para span {
    padding-top: 0;
}

.box-all-article-box .cat-single-post-box .ns-wrap1 .ns-content .user-count-landing .arrow-text-reader span.text-reader {
    color: #fff;
}

.box-all-article-box .cat-single-post-box .ns-wrap1 .ns-content .user-count-landing .arrow-text-reader span.subscribers-txt {
    color: #FC5A31;
    font-size: 20px;
    font-weight: 800;
    margin-right: 8px;
}

.box-all-article-box .cat-single-post-box .ns-wrap1 .ns-content .user-count-landing .count-col {
    padding: 7px 10px 2px;
    font-family: 'kokoro';
    font-weight: 700;
    font-size: var(--h5-heading-size);
}

.box-all-article-box .cat-single-post-box form.formchild-col {
    margin-bottom: 16px;
}

.box-all-article-box .cat-single-post-box p.ins-para {
    background: none;
    -webkit-text-fill-color: #ffffff;
}

.box-all-article-box .cat-single-post-box p.ins-para svg {
    fill: #ffffff;
}

/* .box-all-article-box .cat-single-post-box .formit-input {
        width: 100%;
        max-width: 100%;
    }
    
    .box-all-article-box .cat-single-post-box .newsletterbtn-article {
        max-width: 100%;
    } */

.box-all-article-box .cat-single-post-box .formit-input::before {
    filter: brightness(10);
    top: 55%;
}

.box-all-article-box .cat-single-post-box .formit-input input {
    border-bottom: 1px solid var(--White, #FFF);
    color: #fff;
}

.box-all-article-box .cat-single-post-box .formit-input input::placeholder {
    color: var(--white-color);
    opacity: 0.6;
}

.category-page {
    overflow: hidden;
    padding-top: 4vw;
    padding-bottom: 4vw;
}

.todays-article {
    /* padding-bottom: 4vw; */
}

.todays-article .page-container .content {
    border-bottom: 1px solid #D4D6D7;
    padding-bottom: 4vw;
}

.titlecenter-article {
    text-align: center;
    padding-bottom: 24px;
}

.kokoros_choice {
    padding-top: 4vw;
    padding-bottom: 4vw;
}

.kokoros_choice:last-child {
    padding-bottom: 10px;
}

.category-heading {
    border-bottom: 2px solid var(--dark-blue-text, #263238);
    display: unset;
    margin: 0 auto;
    color: var(--dark-blue-text, #263238);
    text-align: center;
    font-size: clamp(24px, 4.35vw, 48px);
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
    /* 57.6px */
    letter-spacing: 2.88px;
    text-transform: uppercase;
    width: 100%;
}

.todays-article .ko-go-content {
    width: 60%;
}

.todays-article .shortarticle-col {
    width: 40%;
}

.todays-article .shortarticle-col .ko-gotitle {
    font-size: clamp(24px, 4.35vw, 48px);
    display: -webkit-box;
    -webkit-line-clamp: unset;
    -webkit-box-orient: unset;
    overflow: unset;
    margin-bottom: 16px;
}

section.todays-article .content .read-more-today {
    padding: 10px 16px;
    border-radius: 8px;
    background: var(--Mind, #FC5A31);
    color: var(--White, var(--White, #FFF));
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
    display: inline-block;
    margin-top: 16px;
}

section.todays-article .go-content p {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-decoration: none;
}

/* (category page) End */

/* Media Queries */
@media only screen and (min-width: 900px) {
    .popsoacial-wrapper-scroll-show ul.popsocial {
        left: 3vw;
    }

    .popsoacial-wrapper-scroll-hide {
        display: none;
    }
}

@media only screen and (min-width: 1300px) {
    .popsoacial-wrapper-scroll-show ul.popsocial {
        left: 4vw;
    }
}

@media only screen and (min-width: 1400px) {
    .popsoacial-wrapper-scroll-show ul.popsocial {
        left: 7vw;
    }
}

@media only screen and (min-width: 1500px) {
    .popsoacial-wrapper-scroll-show ul.popsocial {
        left: 9vw;
    }
}

@media only screen and (min-width: 1600px) {
    .popsoacial-wrapper-scroll-show ul.popsocial {
        left: 11vw;
    }
}

@media only screen and (min-width: 819px) and (max-width:1120px) {
    button#acceptCookies {
        margin-right: 8px;
    }

    .cookieButtons {
        gap: 10px;
    }
}

@media only screen and (min-width: 768px) and (max-width:880px) {
    div#results {
        min-width: 575px;
        left: -210px;
        transform: translateX(5%);
    }
}

@media only screen and (min-width: 482px) {
    form.formkit-form[data-format="inline"] {
        margin: unset;
    }
}

@media only screen and (min-width: 1024.99px) {

    .daily-ritual-mobile .wpsisac-slick-slider.design-2 .slick-dots {
        display: none !important;
    }

    .slider-container .dots {
        display: none;
    }

    .main-header nav .main-menu-col .category-menu-hover ul.sub-menu.active {
        display: block;
        border-radius: 12px;
        background: #faece9;
        backdrop-filter: blur(12px);
        padding: 15px 20px;
        width: 174px;
        box-shadow: rgba(0, 0, 0, 0.09) 0px 3px 12px;
        top: 30px;
    }

    ul.sub-menu::before, ul.sub-menu::after {
        content: "";
        display: block;
        position: absolute;
        bottom: 100%;
    }

    ul.sub-menu::after {
        border: .8rem solid transparent;
        border-bottom-color: #f45a31;
        left: 1.8rem;
    }

    .sub-menu::before {
        width: 85%;
        height: 16px;
    }
}

@media only screen and (min-width: 992px) {
    .mobile-audio {
        display: none;
    }
}

@media only screen and (min-width: 1180px) {
    .ns-form-card form.seva-form.formkit-form button.formkit-submit.formkit-submit {
        width: 100%;
        max-width: 35%;
        display: flex;
        height: 50px;
        padding: 14px 12px;
    }

    .ns-form-card .seva-fields.formkit-fields {
        align-items: baseline;
    }

    .ns-form-card form.seva-form.formkit-form .formkit-field {
        width: 100%;
        max-width: calc(100% - 41.2%);
    }
}

/* @media only screen and (max-width: 1540px) {
    .singlePost,
    .liked-section {
        max-width: 1340px;
    }
} */
@media only screen and (min-width: 1440px) {
    .formkit-form[data-uid="14573fbc1d"] .formkit-field {
        padding-left: 6px;
    }
}

@media only screen and (max-width: 1440px) {
    /* .singlePost,
    .liked-section {
        max-width: 1240px;
    } */

    section.single-post-box form#newsletter-form-article {
        flex-direction: column;
        align-items: flex-start;
    }

    section.single-post-box form#newsletter-form-article .formit-input {
        max-width: 100%;
    }

    /* section.single-post-box .newsform-col .form-submit-btn {
        max-width: 100%;
    } */
}

@media only screen and (max-width: 1366px) {
    .formkit-form[data-uid="14573fbc1d"] .formkit-field {
        max-width: 304px;
    }

    .formkit-form[data-uid="14573fbc1d"] .formkit-submit {
        width: 100%;
        max-width: 200px;
    }

    .singlePost {
        max-width: 80%;
        gap: 90px;
    }

    section.single-post-box form#newsletter-form-article {
        flex-direction: column;
        align-items: flex-start;
    }

    section.single-post-box form#newsletter-form-article .formit-input {
        max-width: 100%;
    }

    /* section.single-post-box .newsform-col .form-submit-btn {
        max-width: 100%;
    } */
    section.single-post-box .ns-title {
        margin-top: 0px;
        margin-bottom: 20px;
    }
}

@media only screen and (max-width: 1180px) {
    .formkit-form[data-uid="14573fbc1d"] .formkit-field {
        max-width: 200px;
    }

    .formkit-form[data-uid="14573fbc1d"] .formkit-submit {
        max-width: 216px;
    }

    .singlePost {
        gap: 60px;
        max-width: 86%;
    }

    .sidebar-section {
        min-width: 230px;
    }

    .bannerSlider .articleCard:hover {
        transform: none;
        -webkit-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        -o-transform: none;
    }

    .ft-form-col .formit-input {
        max-width: 260px;
        width: 100%;
    }

    button#footernewsletterbtn:disabled,
    button#footernewsletterbtn[disabled] {
        font-size: 0;
        width: 166px;
    }

    button#footernewsletterbtn {
        width: 166px;
    }

}

@media only screen and (max-width: 1024px) {

    .formkit-form[data-uid="14573fbc1d"] .formkit-field,
    .formkit-form[data-uid="14573fbc1d"] .formkit-submit {
        max-width: 100%;
    }

    .daily-ritual-mobile .wpsisac-slick-slider.design-2 .slick-arrow {
        top: clamp(150px, 19.35vw, 259px) !important;
    }

    .formkit-form[data-uid="14573fbc1d"] .formkit-input {
        height: 50px;
    }

    span.iconDate svg {
        max-width: 50px;
        max-height: 50px;
    }

    .e-con-boxed .e-con-inner>.sub-domCard {
        margin: 5px 0;
    }

    .e-con-boxed .sub-domCard .lottie-card .read-now-badge {
        left: -20px;
    }

    body .survey-explore-feature .elementor-widget-container {
        margin: 0 !important;
    }

    .survay-articles .article-grid .ko-go-content img {
        min-height: 180px;
    }

    div#popsoacial-wrapper-scroll {
        display: none;
    }

    .singlePost .audio-wrapper {
        width: 100%;
        margin: 0 auto;
        left: 50%;
        bottom: 20px;
        position: unset;
        margin-bottom: 20px;
    }

    .singlePost .audio-fixed {
        position: fixed !important;
        margin-bottom: 0;
        padding: 14px 10px 20px;
    }

    .playpause-single.mobile-play-pause {
        position: fixed;
        right: 11px;
        width: 33px;
        height: 33px;
        bottom: 46px;
        z-index: 99;
        animation: pulse-animation 2s infinite;
        border-radius: 50px;
    }

    @keyframes pulse-animation {
        0% {
            box-shadow: 0 0 0 0px rgb(244 67 54 / 30%);
        }

        100% {
            box-shadow: 0 0 0 7px rgb(244 67 54 / 7%);
        }
    }

    .singlePost:has(.audio-fixed) .playpause-single.mobile-play-pause {
        display: none !important;
    }

    .playpause-single.mobile-play-pause svg {
        fill: rgb(244, 67, 54);
    }
}

@media only screen and (max-width: 991px) {
    .todays-article .ko-go-content {
        width: 100%;
        border-radius: 12px;
        overflow: hidden;
    }

    .todays-article .shortarticle-col {
        width: 100%;
    }

    .survay-articles .article-grid {
        grid-template-columns: 1fr 1fr;
    }

    .dynamic-content {
        grid-column: 1 / span 2;
    }

    section.todays-article .content {
        display: flex;
        align-items: center;
        flex-direction: column;
        gap: 20px;
    }

    .survay-articles .article-grid .ko-go-content img {
        min-height: 27vw;
    }

    .ns-image img {
        max-width: 180px;
    }

    .formkit-form[data-uid="14573fbc1d"] .formkit-fields {
        flex-direction: column;
    }

    .footer-links .menu-item a.hfe-menu-item {
        padding: 0;
        margin: 0 0 6px;
    }

    .ns-form-card {
        width: 100%;
    }

    .search.search-no-results .wrap {
        text-align: center;
        padding: 4rem 1.25rem;
    }

    .singlePost {
        max-width: 100%;
        gap: 16px;
        flex-direction: column;
    }

    .post-data {
        width: 100%;
        overflow: hidden;
    }

    .liked-section {
        max-width: 100%;
    }

    div#ns-close-modal {
        right: -6px;
        top: -10px;
    }

    div#ajaxsearchliteres1 {
        max-width: 80% !important;
        width: 100% !important;
        left: 10% !important;
    }

    .ns-content {
        width: 100%;
        padding: 40px 40px 80px 40px;
    }

    .ns-image {
        opacity: 0.05;
        width: 215px;
        top: 10%;
        position: absolute;
        right: 1%;
        display: none;
    }

    .ns-wrap {
        padding: 0;
        height: auto;
    }

    .mobile-details-post {
        display: flex;
        opacity: 1;
        min-height: 72px;
        justify-content: space-between;
        padding: 12px 0;
    }

    .mobile-details-post .read-time:before {
        display: none;
    }

    .mobile-details-post>div {
        display: flex;
        gap: 16px;
    }

    .mobile-scroll-fixed {
        position: fixed;
        bottom: 10px;
        background: var(--white-color);
        left: 50%;
        z-index: 99;
        width: 100%;
        max-width: 420px;
        border-radius: 12px;
        box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 50px;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transition: all 0.5s ease;
        padding: 12px;
    }

    #myModal .modal-dialog .modal-content {
        padding: 20px 20px 60px;
    }

    ul.popsocial {
        top: -80px;
        right: -50px;
        display: flex;
        flex-direction: row;
    }

    ul.popsocial li {
        margin: 0;
    }

    .mobile-details-post.mobile-share {
        animation: sharebottomtop 2s ease 0s 1 normal forwards;
        -webkit-animation: sharebottomtop 2s ease 0s 1 normal forwards;
        opacity: 0 !important;
    }

    @keyframes sharebottomtop {
        0% {
            opacity: 0;
            transform: translateY(0) translateX(-50%);
            -webkit-transform: translateY(0) translateX(-50%);
            -moz-transform: translateY(0) translateX(-50%);
            -ms-transform: translateY(0) translateX(-50%);
            -o-transform: translateY(0) translateX(-50%);
        }

        100% {
            opacity: 1;
            transform: translateY(110%) translateX(-50%);
            -webkit-transform: translateY(110%) translateX(-50%);
            -moz-transform: translateY(110%) translateX(-50%);
            -ms-transform: translateY(110%) translateX(-50%);
            -o-transform: translateY(110%) translateX(-50%);
        }
    }

    .sideshare-wrapper .colShare {
        height: auto;
    }

    .titleArt {
        margin-bottom: 14px;
    }

    .articleShareCol {
        margin-top: 16px;
    }

    .artshortContent {
        padding: 20px;
    }

    .mobile-details-post-hide {
        display: none;
    }

    .singlePost {
        padding: 20px 0 10px;
        gap: 0;
    }

    .post-data {
        padding: 0 20px;
    }

    .liked-section {
        padding: 0 20px 50px;
        margin-top: 6px;
    }

    .title-related h4 {
        margin-bottom: 16px;
    }

    .search-content p {
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
    }

    section.single-post-box h4.ns-title {
        margin-top: 0;
    }

    section.single-post-box .ns-content {
        width: 100%;
    }

    .feedback-modal-content {
        padding: 4vw;
    }

    .single-post-box .ns-wrap1 {
        border-radius: 12px;
    }

    .single-exclusive .singlePost h1,
    .single-post .singlePost h1 {
        font-size: 32px;
        font-weight: bold;
        margin-bottom: 1rem;
    }

    .single-exclusive .singlePost h2 a,
    .single-post .singlePost h2 a {
        font-size: 28px;
    }

    .single-exclusive .singlePost h2,
    .single-post .singlePost h2 {
        font-size: 28px;
    }

    .single-exclusive .singlePost h3,
    .single-post .singlePost h3 {
        font-size: 20px;
    }

    .single-exclusive .singlePost h4,
    .single-post .singlePost h4 {
        font-size: 18px;
    }

    .single-exclusive .singlePost h5,
    .single-exclusive .singlePost h5 {
        font-size: 16px;
    }

    .single-exclusive .singlePost h6,
    .single-post .singlePost h6 {
        font-size: 14px;
    }

    .single-exclusive .singlePost p,
    .single-exclusive .singlePost p span,
    .single-exclusive .singlePost ul li b,
    .single-exclusive .singlePost ul li strong,
    .single-exclusive .singlePost ul li p b,
    .single-exclusive .singlePost ul li p strong,

    .single-post .singlePost p,
    .single-post .singlePost p span,
    .single-post .singlePost ul li b,
    .single-post .singlePost ul li strong,
    .single-post .singlePost ul li p b,
    .single-post .singlePost ul li p strong {
        font-size: 18px;

    }

    .single-exclusive .singlePost li b,
    .single-exclusive .singlePost li span,
    .single-exclusive .singlePost li,

    .single-post .singlePost li b,
    .single-post .singlePost li span,
    .single-post .singlePost li {
        font-size: 18px;
    }

    .single-exclusive .singlePost a,
    .single-post .singlePost a {
        font-size: 18px;
    }

    .single-exclusive .singlePost p strong,
    .single-exclusive .singlePost p b,

    .single-post .singlePost p strong,
    .single-post .singlePost p b {
        font-size: 18px;
    }

    .single-exclusive .singlePost ul li::marker,
    .single-post .singlePost ul li::marker {
        font-size: 100%;
    }

    .articleImg img {
        min-height: 23vw;
    }

    .survay-articles .shortarticle-col {
        padding: 0;
    }

    form#survay_form {
        border-radius: 12px;
        padding: 24px 24px;
    }

    .cat-article-box, .cat-most-read-article-box, .box-all-article-box {
        display: flex;
        flex-direction: column;
    }

    .cat-most-read-article-box {
        row-gap: 30px;
    }

    .dynamic-content {
        grid-column: 1 / span 1;
        padding: 40px 30px;
    }

    .box-all-article-box .articleCard .artshortContent {
        padding: 0;
    }

    .box-all-article-box .cat-single-post-box .ns-wrap1 .ns-content {
        width: 100%;
    }

    .box-all-article-box .cat-single-post-box .ns-image {
        width: 100%;
    }

    .cat-single-post-box {
        padding: 40px 0;
    }

    .kokoros_choice {
        padding-top: 7vw;
        padding-bottom: 7vw;
    }

    .kokoros_choice:last-child {
        padding-bottom: 7vw;
    }

    .titlecenter-article {
        padding-bottom: 30px;
    }

    .box-all-article-box .cat-single-post-box .ns-wrap1 .ns-content .newsletter-form-category {
        max-width: 100%;
    }

    .todays-article .page-container .content {
        padding-bottom: 6vw;
    }

    .box-all-article-box .cat-single-post-box .ns-wrap1 .ns-content .user-count-landing {
        margin: 0;
    }

    .author-container .col-social {
        padding-bottom: 8vw;
    }

    .linkauth-profile a {
        max-width: 90px;
    }
}

@media only screen and (max-width: 767px) {
    .cat-article-box, .cat-most-read-article-box, .box-all-article-box {
        gap: 20px;
        row-gap: 30px;
        grid-template-columns: 1fr;
        transition: all 0.5s ease;
    }

    .dynamic-content {
        grid-column: 1 / span 1;
    }

    .main-search {
        position: fixed;
        left: 0;
        top: 0;
        background: var(--primary-color);
        height: 100vh;
        padding: 40px 20px 20px;
        animation: mobsearch 0.5s ease 0s 1 normal forwards;
        -webkit-animation: mobsearch 0.5s ease 0s 1 normal forwards;
    }

    .search-content h4 {
        overflow: hidden;
        width: 85%;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .search-content p {
        overflow: hidden;
        width: 85%;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    @keyframes mobsearch {
        0% {
            opacity: 0;
            transform: translateY(50px);
        }

        100% {
            opacity: 1;
            transform: translateY(0);
        }
    }

    span.searchclose-icon {
        position: absolute;
        right: 0px;
        top: -50px;
        cursor: pointer;
    }

    span.searchclose-icon svg {
        width: 18px;
        height: 18px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
    }

    .daily-ritual-mobile .wpsisac-slick-slider.design-2 .slick-arrow {
        opacity: 0;
    }

    .daily-ritual-mobile .wpsisac-slick-slider .slick-dots li.slick-active button,
    .daily-ritual-mobile .wpsisac-slick-carousal .slick-dots li.slick-active button {
        background: var(--dark-green) !important;
        border-color: var(--dark-green) !important;
    }

    .daily-ritual-mobile .wpsisac-slick-slider .slick-dots li button,
    .daily-ritual-mobile .wpsisac-slick-carousal .slick-dots li button {
        border-color: var(--dark-flesh) !important;
        background: var(--dark-flesh) !important;
    }

    .slider-container {
        /* min-height: 50vh; */
        position: relative;
    }

    .slide.slide-z-3 .post-img {
        padding: 0 20px;
    }

    .slide.slide-z-2 .post-img {
        padding: 0 10px;
    }

    .slide.slide-z-1 .post-img {
        padding: 0;
    }

    .slider-banner-post h2 {
        margin-bottom: 16px;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .article-group {
        grid-template-columns: 1fr;
    }

    .cookie-section {
        gap: 10px;
        padding: 10px 20px;
    }

    .pro-collective .slick-list {
        margin: 0 -20px;
        padding-left: 20px;
    }

    .testimonials-col .sp-testimonial-free-section .testimonial-nav-arrow.swiper-button-next {
        right: -20px;
        width: 36px;
        height: 36px;
    }

    .testimonials-col .sp-testimonial-free-section .testimonial-nav-arrow.swiper-button-prev {
        left: -20px;
        width: 36px;
        height: 36px;
        opacity: 0;
    }

    .testimonials-col .sp-testimonial-item {
        margin-right: 30px;
    }

    .wpsisac-slick-slider.design-2 .slick-prev {
        left: -20px !important;
    }

    .wpsisac-slick-slider.design-2 .slick-next {
        right: -20px !important;
    }

    .wpsisac-slick-slider.design-2 .wpsisac-image-slide .wpsisac-slide-wrap .wpsisac-slider-content {
        width: 90%;
    }

    .daily-ritual-mobile {
        background: #FDF7E8;
    }

    #myModal .modal-dialog {
        margin: 0;
    }

    #myModal .modal-dialog .modal-content {
        padding: 20px;
    }

    .modal-container {
        display: flex;
        flex-direction: column;
        gap: 10px;
        padding-bottom: 80px;
    }

    .col-profile {
        width: 100%;
        padding-bottom: 24px;
    }

    .col-social {
        width: 100%;
        flex-direction: column;
    }

    /* .col-social-links {
        padding: 0;
    } */

    .ns-form-card {
        width: 100%;
    }

    .ns-content {
        padding: 50px 20px 30px;
        flex-direction: column;
        gap: 12px;
        width: 100%;
    }

    .ns-image {
        display: none;
    }

    .results .asl_nores .asl_keyword {
        display: none;
    }

    .pro-collective button.slick-arrow {
        background-color: transparent;
        opacity: 0;
    }

    .menuft-links li.elementor-icon-list-item a {
        padding: 30px 20px;
    }

    .sideimg-fix {
        position: unset;
    }

    .header-btn-kokoro {
        width: 75%;
    }

    div#siteLoader svg {
        max-width: 90px;
        max-height: 90px;
    }

    form.formkit-form[data-format="inline"] {
        margin-bottom: 0;
    }

    .bannerSlider .slick-track {
        display: flex;
        gap: 0;
        padding: 10px 0 10px;
    }

    .bannerSlider .slick-track .articleCard {
        margin-right: 16px;
    }

    .bannerSlider .slick-track .articleCard:last-child {
        margin-right: 0;
    }

    .socialPostShare ul.postshare {
        left: 36px;
        top: 0px;
    }

    .ft-form-col .formit-input {
        max-width: 100%;
        width: 100%;
    }

    button#footernewsletterbtn {
        height: 50px;
        width: 100%;
        min-width: 100%;
    }

    .ft-form-col {
        gap: 24px;
    }

    .footer-con-news-letter-email {
        height: 50px;
    }

    span.iconDate svg {
        max-width: 40px;
        max-height: 40px;
    }

    .btn-scroll-top {
        bottom: 60px;
        right: 15px;
    }

    .e-con-boxed .sub-domCard .lottie-card .read-now-badge {
        width: 82px;
        height: 26px;
        font-size: 12px;
        padding-top: 2px;
    }

    .global-search-col #results .resdrg .item .categories {
        width: 36px;
        height: 15px;
    }

    .global-search-col #results .resdrg .item .categories span {
        font-size: 8px;
    }

    .back-to-live {
        width: auto;
        top: 20px;
        justify-content: flex-end;
        right: 20px;
        bottom: auto;
    }

    p.ins-para {
        align-items: flex-start;
    }

    /* Feedback  */
    .feedback-modal-content {
        flex-direction: column-reverse;
        padding: 7vw 7vw 14vw 7vw;
    }

    .feedbackImage img {
        top: 0;
        max-width: 100%;
    }

    .formSide {
        max-width: 100%;
        width: 100%;
    }

    .feedbackImage {
        width: 300px;
    }

    .para-feedback {
        margin-bottom: 10px;
    }

    .feedback-close-modal {
        right: -7px;
        top: -7px;
        padding: 6px;
    }

    .feedback-close-modal svg {
        width: 24px;
        height: 24px;
    }

    textarea#feedback_message,
    .feedback-col-from .form-group input#feedback_email {
        font-size: 16px;
        line-height: 140%;
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -ms-border-radius: 0;
        -o-border-radius: 0;
    }

    /* Promet */
    .singleArticle-modal .sa-icon {
        right: 4px;
        top: 78px;
    }

    .cardModal-pro {
        width: 94%;
        right: 10px;
        top: 90px;
        height: calc(100% - 90px);
        border-radius: 12px;
    }

    .popupModal-content {
        height: calc(90% - 90px);
    }

    .single-exclusive .singlePost blockquote:has(em) em p,
    .single-exclusive .singlePost blockquote:has(em) em span,
    .single-post .singlePost blockquote:has(em) em p,
    .single-post .singlePost blockquote:has(em) em span {
        font-size: 20px;
    }

    .articleImg img {
        min-height: 45vw;
    }

    .survey-top-sec h3 {
        font-size: 22px;
        text-align: center;
    }

    .survey-top-sec p {
        text-align: center;
    }

    body .survey-explore-feature {
        padding: 0;
    }

    form#survay_form button#survay_btn {
        width: 100%;
        max-width: 100%;
        margin-top: 16px;
    }

    .quiz-container form#quizForm1 {
        padding: 15px 0;
    }

    .kokoro-on-the-go .content .category-pop span.read-time {
        padding-top: 2px;
    }

    .article-content .category-pop span.read-time {
        margin-top: 1px;
    }

    .professional-articles-container .survay-articles .article-grid .category-pop {
        gap: 12px;
    }

    #results .resdrg {
        max-height: 65vh;
        padding-bottom: 2rem;
    }
}

@media (orientation: landscape) {
    #results .resdrg {
        max-height: 65vh;
    }
}

@media only screen and (max-width: 640px) {
    section.todays-article .content .read-more-today {

        width: 100%;
        text-align: center;
    }

    .survay-articles .article-grid {
        grid-template-columns: 1fr;
    }

    #results .resdrg .item .asl_image {
        width: 100%;
        max-width: 90px;
    }

    .singlePost {
        padding: 20px 0 10px;
        gap: 0;
    }

    .post-data {
        padding: 0 20px;
    }

    .liked-section {
        padding: 0 20px 50px;
        margin-top: 6px;
    }

    .title-related h4 {
        margin-bottom: 16px;
    }

    .articleImg img {
        max-height: 275px;
    }

    .lottie-card dotlottie-player {
        padding: 20px;
        height: 320px !important;
    }

    /* .col-head {
        padding-bottom: 24px;
        flex-direction: column;
        align-items: flex-start;
    } */

    .col-authImg {
        width: 90px;
    }

    .author-container .col-authImg {
        width: 100%;
        max-width: 100px;
        border-radius: 10px;
        background: #FECCBF;
    }

    .cookie-section {
        flex-direction: column;
        height: auto;
        padding: 20px 20px;
        justify-content: space-between;
        align-items: center;
        gap: 10px;
    }

    .cookie-section p {
        text-align: center;
    }

    section.error-404.not-found {
        padding: 4rem 1.25rem;
    }

    .daily-ritual-mobile .wpsisac-slick-slider .wpsisac-image-slide .wpsisac-slide-wrap img {
        padding: 0;
    }

    .socialPostShare {
        padding: 4px;
        width: 28px;
        height: 28px;
    }

    .share-wrapper i svg {
        width: 20px;
        height: 20px;
    }

    .artLinksButton a.linkArt {
        width: 32.769px;
        height: 32.769px;
        padding: 10px;
    }

    form.formchild-col {
        gap: 24px;
        flex-direction: column;
    }

    .formit-input {
        width: 100%;
        max-width: 100%;
    }

    .newsform-col .form-submit-btn {
        width: 100%;
        max-width: 100%;
    }

    .singleArticle-modal {
        min-width: 100%;
        max-width: 100%;
    }

}

@media only screen and (max-width: 480px) {
    .mobile-details-post {
        font-size: 12px;
        gap: 0;
    }

    .mobile-details-post>div {
        gap: 8px;
    }

    .mobile-scroll-fixed {
        max-width: calc(100% - 84px);
        bottom: 5px;
        padding: 8px 10px;
    }

    .btn-scroll-top {
        bottom: 80px;
        right: 7px;
    }

    .btn-scroll-top svg {
        width: 34px;
        height: 34px;
    }

    .read-time,
    .icon-date,
    .shareCountcol {
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .mobile-details-post .read-time {
        padding-right: 8px;
    }

    .mobile-scroll-fixed .mob-det-left {
        width: calc(100% - 85px);
        max-width: 200px;
    }

    .mobile-scroll-fixed .mob-det-right {
        width: 85px;
        justify-content: flex-end;
    }

    .mobile-scroll-fixed .mob-det-left .read-time,
    .mobile-scroll-fixed .mob-det-left .icon-date {
        flex: 1;
        flex-direction: column;
        justify-content: center;
    }

    .mobile-scroll-fixed .mob-det-left span.mob-d-flex {
        text-align: center;
        line-height: normal;
        white-space: nowrap;
        font-size: 13px;
    }

    .mobile-details-post .sideshare-wrapper,
    .mobile-details-post .iprint-post {
        width: 36px;
        height: 36px;
    }

    span.iconDate svg {
        max-width: 30px;
        max-height: 30px;
    }

    .search-content h4 {
        overflow: hidden;
        width: 95%;
    }

    .search-content p {
        overflow: hidden;
        width: 95%;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
    }

    #results .resdrg .item .asl_image {
        width: 100%;
        max-width: 60px;
    }

    .user-count-landing p.hide-mob {
        display: block;
        width: 100%;
    }

    p.ins-para {
        font-size: 14px;
    }

    .feedback-close-modal {
        right: -4px;
        top: -4px;
        padding: 6px;
    }

    .feedback-close-modal {
        right: -4px;
        top: -4px;
        padding: 6px;
    }

    .linkauth-profile a {
        font-size: 0;
    }

    .linkauth-profile {
        gap: 0;
        font-size: 0;
    }

    .linkauth-profile .authimg-small {
        margin-right: 0;
    }
}

@media only screen and (max-width: 360px) {
    .header-btn-kokoro .elementor-button .elementor-button-text {
        font-size: 12px;
    }

    .footer-links .menu-item a.hfe-menu-item {
        font-size: 14px;
    }

    .ehf-header #masthead .e-con-inner {
        display: flex;
        justify-content: space-between;
        flex-direction: row;
        gap: 0;
    }

    .ehf-header #masthead .e-con-inner .elementor-element.elementor-element-c0b2d8f {
        width: 160px;
    }

}

/* Banner Mind, Body, Self */
@media (max-width: 1199px) {
    .bannerSlider:has(> .articleCard) {
        display: flex;
        flex-wrap: wrap;
        max-height: 100%;
        overflow: hidden;
    }

    .bannerSlider>.articleCard {
        width: 46%;
        height: 319px;
        margin-top: 40px;
    }

    .bannerSlider>.articleCard:nth-child(3) {
        display: none;
    }

    .bannerSlider .slick-track .articleCard {
        display: block;
    }
}

@media (max-width: 767px) {
    .bannerSlider>.articleCard {
        margin-top: 10px;
    }
}

@media (max-width: 599px) {
    .bannerSlider:has(> .articleCard) {
        display: grid;
        max-height: 410px;
    }

    .bannerSlider>.articleCard {
        width: calc(100% - 80px);
        height: 400px;
    }
}

@media (max-width: 450px) {
    .bannerSlider:has(> .articleCard) {
        max-height: 310px;
    }

    .bannerSlider>.articleCard {
        height: 300px;
    }
}

/* New Header CSS Start */
.headercol {
    border-bottom: 1px solid #F7F7F7;
    background: rgba(255, 255, 255, 0.80);
    backdrop-filter: blur(12px);
    padding-top: 12px;
    padding-bottom: 12px;
    position: sticky;
    z-index: 99;
    top: 0;
}

.main-header {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* max-width: 92vw; */
    max-width: 1380px;
    padding-left: 20px;
    padding-right: 20px;
    margin: 0 auto;
}

.logo {
    display: flex;
    align-items: center;
}

.logo img {
    height: 40px;
}

.main-header nav .main-menu-col {
    list-style: none;
    display: flex;
    gap: 30px;
    margin-bottom: 0;
    padding-left: 0;
    position: relative;
}


.main-header nav li:last-child {
    margin-right: 0;
}

.main-header .main-menu-col a .icon {
    width: 26px;
    height: 26px;
    padding-left: 6px;
    margin-top: -6px;
    transition: all 0.5s ease;
}

.main-header nav .main-menu-col .current-menu-item a {
    color: #F44336;
}

.main-header nav .sub-menu li a::before {
    content: '';
    position: absolute;
    left: 0;
    top: 42%;
    width: 10px;
    height: 10px;
    /* background-color: #FC5A31; */
    border-radius: 50%;
    transform: translateY(-50%);
}

.main-header nav .sub-menu {
    list-style: none;
    padding: 0;
    display: none;
    position: absolute;
}

.main-header nav .sub-menu a {
    padding-left: 20px;
    display: inline-block;
    width: 100%;
}

.main-header nav .sub-menu .mob-body a,
.main-header nav .sub-menu .mob-self a,
.main-header nav .sub-menu .mob-mind a {
    padding-left: 44px;

}

/* .main-header nav .sub-menu a::before {
    background-repeat: no-repeat;
    background-size: contain;
    width: 32.64px !important;
    height: 32.64px !important;
} */

.main-header nav .sub-menu .mob-mind a::before {
    background-image: url("/wp-content/themes/kokoro-child/assets/images/Brain.svg");
}

.main-header nav .sub-menu .mob-body a::before {
    background-image: url("/wp-content/themes/kokoro-child/assets/images/Yoga-Full.svg");
}

.main-header nav .sub-menu .mob-self a::before {
    background-image: url("/wp-content/themes/kokoro-child/assets/images/Self-Care.svg");
}

/* .main-header nav ul li:nth-child(2) a::before {
    background-color: #004638;
}

.main-header nav ul li:nth-child(3) a::before {
    background-color: #D199F9;
} */
/* .main-header nav .main-menu-col a svg{
    fill: var(--portland-orange);
} */
.main-header nav .main-menu-col a .active {
    background: none;
    transform: rotate(180deg) translateX(-3px);
    transition: all 0.5s ease;
    padding-left: 0;
    fill: var(--portland-orange);
}

/* .main-header nav .sub-menu:has(.main-menu-col):hover .main-menu-col a:hover svg.icon,
.main-header nav .main-menu-col a:hover svg.icon {
    fill:  var(--portland-orange);
    transform: rotate(180deg) translateX(-3px);
    transition: all 0.5s ease;
    padding-left: 0;
} */
.main-header nav .sub-menu .menu-item {
    padding: 6px 0;
}

.main-header nav .main-menu-col a {
    text-decoration: none;
    color: var(--dark-blue-text, #263238);
    text-align: left;
    font-family: 'kokoro';
    font-size: clamp(15px, 1.25vw, 17px);
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    text-transform: uppercase;
    display: flex;
    position: relative;
    margin-right: 0;
    cursor: pointer;
    transition: all 0.5s ease;
    letter-spacing: 2px;
}

.main-header nav .sub-menu .menu-item a {
    text-align: left;
}

.search-join {
    display: flex;
    align-items: center;
    gap: 10px;
}

.search-join input {
    padding: 5px;
}

button.hd-search-btn {
    border-radius: 12px;
    border: 1px solid var(--Border, #D4D6D7);
    display: flex;
    height: 44px;
    padding: 14px 18px;
    align-items: center;
    gap: 52px;
    background: no-repeat;
}

button.hd-search-btn:hover {
    background: none;

}

button.hd-search-btn:focus {
    color: inherit;
    background-color: transparent;
    outline: none;
}

button.join-button {
    border-radius: 12px;
    background: var(--Mind, #FC5A31);
    border: none;
    padding: 14px 16px 12px;
    cursor: pointer;
    color: var(--White, #FFF);
    text-align: center;
    font-family: 'kokoro';
    font-size: 16px;
    font-style: normal;
    font-weight: 800;
    text-transform: uppercase;
    text-shadow: none;
}

.hamburger {
    display: none;
    flex-direction: column;
    gap: 4px;
    cursor: pointer;
}

/* .hamburger span {
    width: 25px;
    height: 3px;
    background-color: #333;
    border-radius: 3px;
} */
.nav-close svg {
    width: 27px;
    height: 27px;
    transform: translateX(5px);
}

@media (max-width: 1199px) {

    .main-header nav .main-menu-col {
        gap: 16px;
    }

    .main-header .main-menu-col a .icon {
        width: 18px;
        height: 16px;
        padding-left: 6px;
        margin-top: -4px;
    }

    .logo img {
        height: 28px;
    }

    button.hd-search-btn {
        height: 40px;
        padding: 8px 10px;
        gap: 50px;
    }

    button.join-button {
        padding: 8px 12px 6px;
        font-size: 14px;
    }
}

@media (max-width: 1024px) {
    .main-header nav .sub-menu li a::before {
        top: 50%;
    }

    .headercol {
        background: #fff;
    }

    .headercol nav .main-menu-col {
        display: none;
        position: absolute;
        width: 100%;
        height: 100vh;
        top: 53px;
        left: 0;
        background-color: #fff;
        padding: 0;
        overflow: auto;
        padding-bottom: 150px;
        animation: menuopen 0.5s ease 0s 1 normal forwards;
        -webkit-animation: menuopen 0.5s ease 0s 1 normal forwards;
    }

    @keyframes menuopen {
        0% {
            opacity: 0;
            transform: translateX(-50px);
        }

        100% {
            opacity: 1;
            transform: translateX(0);
        }
    }

    .main-header nav a {
        font-size: 38px;
        margin-right: 0;
        /* padding-left: 24px;
        padding-top: 5px; */
        /* margin-bottom: 20px; */
        text-align: left;
    }

    .main-header nav a:nth-child(3) {
        margin-top: 0;
    }

    .search-join {
        flex-direction: row-reverse;
        gap: 20px;
        position: absolute;
        right: 65px;
        width: auto;
    }

    button.hd-search-btn {
        border-radius: 12px;
        border: none;
        display: flex;
        height: 36px;
        padding: 6px;
        align-items: center;
        gap: 52px;
        background: no-repeat;
    }

    button.join-button {
        background: none;
        color: var(--Mind, #FC5A31);
        padding: 8px 6px 5px;
        border: 1px solid;
        font-size: 14px;
        border-radius: 8px;
        width: 110px;
    }

    button.join-button:focus,
    button.join-button:active {
        color: #FC5A31;
        background-color: transparent;
        outline: none;
        opacity: 0.9;
    }

    .logo,
    .hamburger {
        display: flex;
        z-index: 9;
    }

    .hamburger.active+nav ul,
    .hamburger.active+nav+.search-join {
        display: flex;
    }

    main {
        flex-direction: column;
        align-items: center;
    }

    div#results,
    form.search-bar {
        max-width: 92vw;
    }

    /* .main-header nav .main-menu-col a {
        color: #263238;
        font-family: 'kokoro';
        font-size: 18px;
        font-style: normal;
        font-weight: 600;
        line-height: 2;
        padding-top: 4px;
    } */

    .main-header nav .sub-menu {
        position: unset;
        text-align: center;
    }

    .main-header nav .main-menu-col .category-menu-hover ul.sub-menu {
        position: unset;
        max-width: 100%;
        box-shadow: none;
        padding: 0;
        /* padding-bottom: 20px;   
        margin-top: -15px;  */
    }

    ul.sub-menu.active {
        display: block;
        background: none;
    }

    .main-header .main-menu-col a .icon {
        width: 24px;
        height: 24px;
        padding-left: 6px;
        margin-top: -4px;
    }

    .main-header nav .sub-menu .menu-item a {
        text-align: left;
        display: flex;
        justify-content: normal;
        align-items: center;
        margin: 2px 0;
        width: 100%;
    }

    .main-header nav .sub-menu .menu-item {
        padding: 0;
        display: flex;
        width: 100%;
        margin: 0 auto;
    }

    .headercol nav .main-menu-col .kokoro_academy_menu,
    .headercol nav .main-menu-col .menu-item-type-post_type,
    .headercol nav .main-menu-col .menu-item-has-children .sub-menu .menu-item-type-custom {
        padding: 18px 16px;
        border-bottom: 1px solid #D4D6D7;
    }

    .headercol nav .main-menu-col .menu-item-has-children>a {
        padding: 18px 16px;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .headercol nav .main-menu-col li.menu-item.menu-item-has-children {
        background: none;
    }

    .headercol nav .main-menu-col:has(.icon-angle-down.active) li.menu-item.menu-item-has-children {
        background: var(--Background, #F2F2F7);
    }

    .headercol nav .main-menu-col li.menu-item.menu-item-has-children>a {
        border-bottom: 1px solid #D4D6D7;
    }
}

/* New Header CSS End */

/* Dicuss commenting CSS Start*/
#wpdcom .wpd-form-head {
    display: none;
}

#comments {
    background: #fbfbfb;
    padding: 16px 24px !important;
    box-shadow: rgb(251 251 251 / 50%) 0px 1px 0px, rgb(79 79 84 / 10%) 0px 0px 9px;
    border-radius: 20px;
}

#wpdcom .wpd-form-row .wpd-field {
    border-radius: 6px;
    border: 1px solid var(--Border, #D4D6D7);
    background: none;
    padding: 15px 12px 12px 20px;
    color: var(--text-color);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
    width: 100%;
    outline: none;
    height: 48px !important;
    background-color: #fff;

}

#wpdcom .wpd-comment .wpd-reply-to a {
    text-decoration: none;
    opacity: 0.8;
    color: #1e1d1d;
    font-size: 14px;
}

.wpd-form-row {
    display: flex;
    gap: 30px;
}


.wpd-form-col-right {
    flex: 1 0 0;
    width: 100%;
}

.wpdiscuz-recaptcha {
    width: 100%;
    transform: unset !important;
}

.wpd-form-row {
    display: inline-flex;
    width: 100%;
    flex-direction: column;
    gap: 16px;
}

.wpd-form-col-left {
    width: 100% !important;
    display: flex;
    gap: 16px;
}

.wpd-form-col-right {
    width: 100% !important;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
}

form.wpd_comm_form.wpd-secondary-form-wrapper {
    max-width: 100%;
    padding-left: 80px;
}

.wpdiscuz-recaptcha {
    width: 100%;
    transform: unset !important;
}


#wpdcom .wpd-field-captcha.wpdiscuz-item {
    width: auto;
    padding: 0;
}

#wpdcom .wc-field-submit {
    padding: 0;
}

.wpdiscuz-recaptcha div {
    display: flex;
}

.wc_social_plugin_wrapper {
    display: none;
}

div#wpdcom {
    width: 100%;
    padding: 0;
}

div#respond {
    display: none;
}

#wpdcom .wc-field-submit input[type="submit"] {
    width: 100%;
    border-radius: 12px;
    background: var(--Mind, #FC5A31);
    display: flex;
    height: 40px;
    padding: 12px 16px 10px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    color: var(--White, #FFF);
    text-align: center;
    font-family: 'kokoro';
    font-size: var(--normal-text-size);
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    text-transform: uppercase;
    outline: none;
    border: none;
    transition: all 0.5s ease;
    letter-spacing: 0.2px;
}

#wpdcom .wpd-thread-head .wpd-thread-info {
    color: #263238;
    border-bottom: 2px solid #f45a31;
    line-height: 24px;
    padding: 5px 5px 3px 5px;
}

#wpdcom .wpd-comment-header .wpd-comment-author, #wpdcom .wpd-comment-header .wpd-comment-author a {
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    letter-spacing: 0.7px;
    margin-right: 5px;
    color: #263238;
    text-transform: capitalize;
}

#wpdcom .wpd-comment-text *,
#wpdcom .wpd-comment-text,
#wpdcom .wpd-comment-text p {
    font-size: 16px;
    line-height: 130%;
    font-family: var(--font-family);
    color: #263238;
}

#wpdcom .wpd-comment-text p {
    margin-bottom: 8px;
}

#wpdcom .ql-container.ql-snow {
    border: 1px solid #ccc;
    border-radius: 12px 12px 0 0;
    border-bottom: none;
}

#wpdcom .ql-toolbar.ql-snow {
    border: 1px solid #ccc;
    box-sizing: border-box;
    font-family: 'kokoro';
    padding: 8px;
    border-radius: 0 0 12px 12px;
}

#wpdcom .ql-snow .ql-editor pre.ql-syntax {
    background-color: #ffffff;
    color: #F44336;
    overflow: visible;
    height: 88%;
    font-size: 13px;
    border: 1px solid #fac8c4;
}

#wpdcom .ql-editor p {
    font-size: 16px;
}

#wpdcom .wpd-thread-head .wpd-thread-info .wpdtc {
    display: none !important;
}

#wpdcom .wpd-form-row .wpdiscuz-item .wpd-field-icon i.fa-user {
    background-image: url(/wp-content/uploads/2024/11/user-2-fill.png);
    background-size: contain;
    background-repeat: no-repeat;
    width: 18px;
    height: 18px;
    position: absolute;
    top: 7px;
    left: 1px;

}

#wpdcom .wpd-form-row .wpdiscuz-item .wpd-field-icon i.fas.fa-at {
    background-image: url(/wp-content/uploads/2024/11/mail-fill.png);
    background-size: contain;
    background-repeat: no-repeat;
    width: 18px;
    height: 18px;
    position: absolute;
    top: 7px;
    left: 1px;
}

#wpdcom .wpd-thread-head .wpdiscuz-user-settings,
div#comments:has(.wpd-thread-info[data-comments-count="0"]) div#wpd-threads {
    display: none;
}

@media screen and (max-width: 600px) {

    #wpdcom .wpd-form-row .wpd-form-col-left,
    #wpdcom .wpd-form-row .wpd-form-col-right {
        width: 100%;
        float: none;
        flex-direction: column;
        gap: 8px;
    }

    #wpdcom.wpd-layout-2 .wpd-comment .wpd-comment-header .wpd-user-info {
        display: block;
        flex-grow: 1;
        margin-bottom: -3px;
        margin: unset;
        margin-bottom: -3px;
    }

    #comments {
        padding: 2px 14px !important;
        border-radius: 12px;
    }
}

/* Dicuss commenting CSS END*/