@font-face {
  font-display: swap; 
  font-family: 'Chivo';
  font-style: normal;
  font-weight: 100;
  src: url('fonts/chivo-v21-100.woff2') format('woff2');
}
@font-face {
  font-display: swap;
  font-family: 'Chivo';
  font-style: normal;
  font-weight: 200;
  src: url('fonts/chivo-v21-200.woff2') format('woff2');
}
@font-face {
  font-display: swap;
  font-family: 'Chivo';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/chivo-v21-300.woff2') format('woff2');
}

@font-face {
  font-display: swap;
  font-family: 'Chivo';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/chivo-v21-regular.woff2') format('woff2');
}

@font-face {
  font-display: swap;
  font-family: 'Chivo';
  font-style: italic;
  font-weight: 400;
  src: url('fonts/chivo-v21-italic.woff2') format('woff2');
}
@font-face {
  font-display: swap;
  font-family: 'Chivo';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/chivo-v21-500.woff2') format('woff2');
}

@font-face {
  font-display: swap;
  font-family: 'Chivo';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/chivo-v21-600.woff2') format('woff2');
}

@font-face {
  font-display: swap;
  font-family: 'Chivo';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/chivo-v21-700.woff2') format('woff2');
}

@font-face {
  font-display: swap;
  font-family: 'Chivo';
  font-style: normal;
  font-weight: 800;
  src: url('fonts/chivo-v21-800.woff2') format('woff2'); 
}
@font-face {
  font-display: swap; 
  font-family: 'Chivo';
  font-style: normal;
  font-weight: 900;
  src: url('fonts/chivo-v21-900.woff2') format('woff2');
}

@font-face {
  font-display: swap;
  font-family: 'Sora';
  font-style: normal;
  font-weight: 100;
  src: url('fonts/sora-v17-100.woff2') format('woff2');
}
@font-face {
  font-display: swap;
  font-family: 'Sora';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/sora-v17-300.woff2') format('woff2');
}
@font-face {
  font-display: swap;
  font-family: 'Sora';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/sora-v17-regular.woff2') format('woff2');
}
@font-face {
  font-display: swap;
  font-family: 'Sora';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/sora-v17-500.woff2') format('woff2');
}
@font-face {
  font-display: swap;
  font-family: 'Sora';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/sora-v17-600.woff2') format('woff2');
}
@font-face {
  font-display: swap;
  font-family: 'Sora';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/sora-v17-700.woff2') format('woff2');
}
@font-face {
  font-display: swap;
  font-family: 'Sora';
  font-style: normal;
  font-weight: 800;
  src: url('fonts/sora-v17-800.woff2') format('woff2');
}
@font-face {
  font-display: swap;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 100;
  src: url('fonts/poppins-v24-100.woff2') format('woff2');
}
@font-face {
  font-display: swap;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 200;
  src: url('fonts/poppins-v24-200.woff2') format('woff2');
}
@font-face {
  font-display: swap;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/poppins-v24-300.woff2') format('woff2');
}
@font-face {
  font-display: swap;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/poppins-v24-regular.woff2') format('woff2');
}
@font-face {
  font-display: swap;
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 400;
  src: url('fonts/poppins-v24-italic.woff2') format('woff2');
}
@font-face {
  font-display: swap;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/poppins-v24-500.woff2') format('woff2');
}

@font-face {
  font-display: swap;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/poppins-v24-600.woff2') format('woff2');
}
@font-face {
  font-display: swap;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/poppins-v24-700.woff2') format('woff2');
}

@font-face {
  font-display: swap;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 800;
  src: url('fonts/poppins-v24-800.woff2') format('woff2');
}
@font-face {
  font-display: swap;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 900;
  src: url('fonts/poppins-v24-900.woff2') format('woff2');
}





    :root {
    	/* --base-color: #2A3253; */
    	--black-color-rgb: 0, 0, 0;
    	--black-color: #000000;
    	--white-color: #ffffff;
    	--surface-1: #FFFFFF;
    	--surface-2: #F5F5F5;
    	--surface-3: #E5E5E5;
    	--surface-4: #ebebeb;
    	--surface-5: #fdfdfd;
    	--surface-6: #f8f9fa;
    	/* text-variable */
    	--text-primary: #242424;
    	--text-secondary: rgba(66, 66, 66, 0.80);
    	--text-disabled: rgba(66, 66, 66, 0.56);
    	--text-contrast: #FFFFFF;
    	--primary-primary: #F6CA19;
    	--primary-light: #FDF6D8;
    	--primary-hover: #7F6A13;
    	--secondary-primary: #1946F6;
    	--secondary-light: #E8ECFC;
    	--additional-divider: #E3E3E3;
    	--additional-dialogue-success-main: #00CC74;
    	--additional-dialogue-success-light: #CCFFE9;
    	--additional-dialogue-danger-main: #FF004C;
    	--additional-dialogue-danger-light: #FFCCDB;
    	--error-color: #ff0000;
    	/* icons-variable */
    	--icons-active: var(--primary-hover);
    	--icons-hover: var(--primary-primary);
    	--icons-info: var(--text-secondary);
    	--icons-disabled: var(--text-disabled);
    	--compnents-buttons-text: #242424;
    	--compnents-buttons-bg-active: var(--primary-primary);
    	--compnents-buttons-bg-hover: var(--primary-hover);
    	--compnents-buttons-bg-disabled: rgba(36 36 36, 0.56);
    	/* font and line height */
    	--size-xs: 12px;
    	--size-sm: 14px;
    	--size-md: 16px;
    	--size-lg: 18px;
    	--size-xl: 20px;
    	--size-2xl: 24px;
    	--size-3xl: 28px;
    	--size-4xl: 32px;
    	--size-5xl: 40px;
    	--size-6xl: 48px;
    	/* line-height */
    	--line-height-2xs: 12px;
    	--line-height-xs: 16px;
    	--line-height-sm: 20px;
    	--line-height-md: 24px;
    	--line-height-lg: 32px;
    	--line-height-xl: 40px;
    	--line-height-2xl: 48px;
    	--line-height-3xl: 64px;
    	/* fontweight */
    	--fw-light: 300;
    	--fw-regular: 400;
    	--fw-medium: 500;
    	--fw-semibold: 600;
    	--fw-bold: 700;
    	--fw-black: 800;
    	--fw-extra-black: 900;
    	--container: 1314px;
    	/* fonts */
    	--font1: "Sora", sans-serif;
    	--font2: "Chivo", sans-serif;
    	--font3: "Poppins", sans-serif;
    	--family-title: "Chivo", sans-serif;
    	--family-body: "Sora", sans-serif;
    	--heading-font: "Chivo", sans-serif;
    	--primary-font: "Sora", sans-serif;
    	--secondary-font: "Poppins", sans-serif;
    }

    /* for dark mode varible */
    /* Dark mode variables overrides */
    html.dark-mode {
    	--black-color: #ffffff;
    	--surface-1: #171515;
    	--surface-2: #242424;
    	--surface-3: #444444;
    	--surface-4: #303030;
    	--surface-5: #242424;
    	--surface-6: #242424;
    	--text-primary: #FFFFFF;
    	--text-secondary: rgba(255, 255, 255, 0.56);
    	--text-disabled: rgba(255, 255, 255, 0.24);
    	--text-contrast: #242424;
    	--primary-primary: #F6CA19;
    	--primary-light: #2F2C25;
    	--primary-hover: #FAE07A;
    	--secondary-primary: #496DF8;
    	--secondary-light: #202B58;
    	--additional-divider: #333333;
    	--additional-dialogue-success-main: #00CC74;
    	--additional-dialogue-success-light: #00331D;
    	--additional-dialogue-danger-main: #FF004C;
    	--additional-dialogue-danger-light: #33000F;
    	--icons-active: #7F6A13;
    	--icons-hover: var(--primary-primary);
    	--icons-info: var(--text-secondary);
    	--icons-disabled: var(--text-disabled);
    	--compnents-buttons-text: #242424;
    	--compnents-buttons-bg-active: #4D6079;
    	--compnents-buttons-bg-hover: #FFFFFF;
    	--compnents-buttons-bg-disabled: #4D6079;
    }

    /* for dark mode varibles ends */
    *,
    *::after,
    *::before {
    	-webkit-box-sizing: border-box;
    	box-sizing: border-box;
    	-webkit-font-smoothing: antialiased;
    	-webkit-tap-highlight-color: transparent
    }

    html,
    body,
    div,
    span,
    applet,
    object,
    iframe,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    blockquote,
    pre,
    a,
    abbr,
    acronym,
    address,
    big,
    cite,
    code,
    del,
    dfn,
    em,
    img,
    ins,
    kbd,
    q,
    s,
    samp,
    small,
    strike,
    strong,
    sub,
    sup,
    tt,
    var,
    b,
    u,
    i,
    center,
    dl,
    dt,
    dd,
    ol,
    ul,
    li,
    fieldset,
    form,
    label,
    legend,
    table,
    caption,
    tbody,
    tfoot,
    thead,
    tr,
    th,
    td,
    article,
    aside,
    canvas,
    details,
    embed,
    figure,
    figcaption,
    footer,
    header,
    hgroup,
    menu,
    nav,
    output,
    ruby,
    section,
    summary,
    time,
    mark,
    audio,
    video {
    	margin: 0;
    	padding: 0;
    	border: 0;
    	font-size: 100%;
    	font: inherit;
    	vertical-align: baseline
    }

    html {
    	scroll-behavior: smooth
    }

    /* Thai font import */
    html[lang="th"] {
    	--font1: "Prompt", sans-serif;
    	--font2: "Prompt", sans-serif;
    	--font3: "Prompt", sans-serif;
    	--family-title: "Prompt", sans-serif;
    	--family-body: "Prompt", sans-serif;
    	--heading-font: "Prompt", sans-serif;
    	--primary-font: "Prompt", sans-serif;
    	--secondary-font: "Prompt", sans-serif;
    }

    /* Load Prompt only when needed */
    html[lang="th"] {
    	font-family: var(--font1);
    }

    body {
    	font-family: var(--family-body);
    	font-style: normal;
    	font-size: var(--size-sm);
    	line-height: var(--line-height-sm, 20px);
    	font-weight: var(--fw-regular);
    	font-optical-sizing: auto;
    	-webkit-text-size-adjust: 100%;
    	-webkit-tap-highlight-color: transparent;
    	-webkit-font-smoothing: antialiased;
    	-moz-osx-font-smoothing: grayscale;
    	scrollbar-width: thin;
    	margin: 0;
    	padding: 0;
    	background: var(--surface-1);
    }

    /* body.rtl {
        direction: rtl;
    } */
    a {
    	text-decoration: none;
    	color: currentColor;
    	outline: 0;
    	text-underline-offset: 3px;
    	cursor: pointer;
    }

    a:focus {
    	background: transparent;
    	text-decoration: none;
    	color: currentColor;
    	outline: 0;
    }

    img {
    	outline: 0;
    	max-width: 100%;
    	height: auto;
    }

    ol {
    	margin-bottom: 0;
    }

    ul {
    	margin-right: 0;
    	padding: 0;
    }

    li::marker {
    	font-family: var(--font1);
    }

    /* default container */
    .container {
    	max-width: 100%;
    	width: 100%;
    	padding-left: 16px;
    	padding-right: 16px;
    	margin-right: auto;
    	margin-left: auto;
    }

    h1,
    .h1,
    h2,
    .h2,
    h3,
    .h3,
    h4,
    .h4,
    h5,
    .h5,
    h6,
    .h6,
    .heading-4xl,
    .heading-3xl,
    .heading-2xl,
    .heading-xl,
    .heading-lg,
    .heading-md {
    	font-family: var(--family-title);
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
    	margin: 0 0 16px;
    	font-style: normal;
    }

    /* title heading 1 */
    h1,
    .h1,
    .heading-4xl {
    	font-size: var(--size-4xl);
    	line-height: var(--line-height-xl);
    	letter-spacing: -0.64px;
    	font-weight: 700;
    }

    /* title heading 2 */
    h2,
    .h2,
    h2.entry-title,
    .heading-3xl {
    	font-size: var(--size-3xl);
    	line-height: var(--line-height-lg);
    	letter-spacing: -0.56px;
    	font-weight: 700;
    }

    /* title heading 3 */
    h3,
    .h3,
    .heading-2xl {
    	font-size: var(--size-2xl);
    	line-height: var(--line-height-lg);
    	letter-spacing: -0.24px;
    	font-weight: 700;
    }

    /* title heading 4 */
    h4,
    .h4,
    .heading-xl {
    	font-size: var(--size-xl);
    	line-height: 122%;
    	letter-spacing: 0;
    	font-weight: 700;
    }

    /* title heading 5 */
    h5,
    .h5,
    .heading-lg {
    	font-size: var(--size-lg);
    	line-height: var(--line-height-md);
    	letter-spacing: 0;
    	font-weight: 700;
    }

    /* title heading 6 */
    h6,
    .h6,
    .heading-md {
    	font-size: var(--size-md);
    	font-weight: 600;
    	line-height: var(--line-height-sm);
    }

    p {
    	font-size: var(--size-md);
    	line-height: var(--line-height-md);
    	margin: 0 0 16px;
    	font-weight: var(--fw-regular);
    	color: var(--text-secondary, rgba(66, 66, 66, 0.80));
    	font-family: var(--family-body);
    }

    p:last-child {
    	margin-bottom: 0;
    }

    p em {
    	font-style: italic;
    }

    em,
    i:not([class*="fa"]):not([class*="sui-"]) {
    	font-style: italic;
    }

    strong {
    	font-weight: 700;
    }

    .secn-spacing {
    	margin-bottom: 48px;
    }

    .my-48 {
    	margin: 48px 0;
    }

    .my-40 {
    	margin: 40px 0;
    }

    .mt-16 {
    	margin-top: 16px;
    }

    .mb-16 {
    	margin-top: 16px;
    }

    .mt-48 {
    	margin-top: 48px;
    }

    .mb-48 {
    	margin-bottom: 48px;
    }

    .mt-40 {
    	margin-top: 40px;
    }

    .mb-40 {
    	margin-bottom: 40px;
    }

    .mb-0 {
    	margin-bottom: 0;
    }

    .mt-0 {
    	margin-bottom: 0;
    }

    .m-0 {
    	margin: 0;
    }

    .py-48 {
    	padding: 48px 0;
    }

    .p-0 {
    	padding: 0;
    }

    .py-40 {
    	padding: 40px 0;
    }

    .pt-40 {
    	padding-top: 40px;
    }

    .pb-40 {
    	padding-top: 40px;
    }

    .pb-0 {
    	padding-bottom: 0;
    }

    .pt-0 {
    	padding-top: 0;
    }

    a {
    	text-decoration-skip-ink: auto
    }

    a[href^="tel"] {
    	color: inherit;
    	text-decoration: none
    }

    button {
    	outline: 0
    }

    ol,
    ul {
    	list-style: none
    }

    blockquote,
    q {
    	quotes: none
    }

    blockquote:before,
    blockquote:after,
    q:before,
    q:after {
    	content: '';
    	content: none
    }

    q {
    	display: inline;
    	font-style: italic
    }

    q:before {
    	content: '"';
    	font-style: normal
    }

    q:after {
    	content: '"';
    	font-style: normal
    }

    textarea,
    input[type="text"],
    input[type="button"],
    input[type="submit"],
    input[type="reset"],
    input[type="search"],
    input[type="password"] {
    	-webkit-appearance: none;
    	appearance: none;
    	border-radius: 0
    }

    input[type="search"] {
    	-webkit-appearance: textfield
    }

    table {
    	border-collapse: collapse;
    	border-spacing: 0
    }

    th,
    td {
    	padding: 2px
    }

    big {
    	font-size: 120%
    }

    small,
    sup,
    sub {
    	font-size: 80%
    }

    sup {
    	vertical-align: super
    }

    sub {
    	vertical-align: sub
    }

    dd {
    	margin-left: 20px
    }

    kbd,
    tt {
    	font-family: courier;
    	font-size: 12px
    }

    ins {
    	text-decoration: underline
    }

    del,
    strike,
    s {
    	text-decoration: line-through
    }

    dt {
    	font-weight: bold
    }

    address,
    cite,
    var {
    	font-style: italic
    }

    article,
    aside,
    details,
    figcaption,
    figure,
    footer,
    header,
    hgroup,
    menu,
    nav,
    section {
    	display: block
    }

    .sticky {}

    .bypostauthor {}

     figure.wp-caption,
    figure.wp-caption img,
    img.aligncenter {
    	max-width: 100%;
    }

    .alignnone {
    	margin: 5px 20px 20px 0
    }

    /* CENTER */
    .aligncenter,
    div.aligncenter,
    a img.aligncenter {
    	display: block;
    	margin-left: auto;
    	margin-right: auto;
    }

    /* LEFT */
    .alignleft,
    a img.alignleft {
    	float: left;
    	margin: 0 1em 1em 0;
    }

    /* RIGHT */
    .alignright,
    a img.alignright {
    	float: right;
    	margin: 0 0 1em 1em;
    }

    /* Make sure containers clear floats so boxes don't jump up */
    .wp-caption,
    .entry-content::after,
    .clearfix::after {
    	content: "";
    	display: block;
    	clear: both;
    }

    .wp-caption {
    	max-width: 96%;
    	max-width: 556px;
    	padding: 5px 3px 10px;
    	text-align: center
    }

    .wp-caption.alignnone {
    	margin: 5px 20px 20px 0
    }

    .wp-caption.alignleft {
    	margin: 5px 20px 20px 0
    }

    .wp-caption.alignright {
    	margin: 5px 0 20px 20px
    }

    .wp-caption img {
    	border: 0 none;
    	height: auto;
    	margin: 0;
    	max-width: 98.5%;
    	padding: 0;
    	width: auto
    }

    .wp-caption p.wp-caption-text {
    	font-size: 11px;
    	line-height: 17px;
    	margin: 0;
    	padding: 0 4px 5px;
		color: var(--text-primary);		
    }
	.wp-caption-text {
		color: var(--text-primary);
	}

    .gallery-item {
    	display: inline-block;
    	text-align: left;
    	vertical-align: top;
    	width: 50%
    }

    .gallery-item a,
    .gallery-item a:hover,
    .gallery-item a:focus {
    	-webkit-box-shadow: none;
    	box-shadow: none;
    	background: none;
    	display: inline-block;
    	max-width: 100%
    }

    .gallery-item a img {
    	display: block;
    	-webkit-transition: -webkit-filter 0.2s ease-in;
    	transition: -webkit-filter 0.2s ease-in;
    	transition: filter 0.2s ease-in;
    	transition: filter 0.2s ease-in, -webkit-filter 0.2s ease-in;
    	-webkit-backface-visibility: hidden;
    	backface-visibility: hidden
    }

    .gallery-item a:hover img,
    .gallery-item a:focus img {
    	-webkit-filter: opacity(60%);
    	filter: opacity(60%)
    }

    .gallery-caption {
    	display: block;
    	text-align: left;
    	padding: 0 10px 0 0;
    	margin-bottom: 0
    }

    .screen-reader-text {
    	border: 0;
    	clip: rect(1px, 1px, 1px, 1px);
    	-webkit-clip-path: inset(50%);
    	clip-path: inset(50%);
    	height: 1px;
    	margin: -1px;
    	overflow: hidden;
    	padding: 0;
    	position: absolute !important;
    	width: 1px;
    	word-wrap: normal !important;
    	word-break: normal
    }

    .screen-reader-text:focus {
    	background-color: #f7f7f7;
    	border-radius: 3px;
    	box-shadow: 0 0 2px 2px rgba(0, 0, 0, .6);
    	clip: auto !important;
    	-webkit-clip-path: none;
    	clip-path: none;
    	color: #007acc;
    	display: block;
    	font-size: 14px;
    	font-size: .875rem;
    	font-weight: 700;
    	height: auto;
    	right: 5px;
    	line-height: normal;
    	padding: 15px 23px 14px;
    	text-decoration: none;
    	top: 5px;
    	width: auto;
    	z-index: 100000
    }

    .skip-link {
    	left: -9999rem;
    	top: 2.5rem;
    	z-index: 999999999;
    	text-decoration: underline
    }

    .skip-link:focus {
    	display: block;
    	left: 6px;
    	top: 7px;
    	font-size: 14px;
    	font-weight: 600;
    	text-decoration: none;
    	line-height: normal;
    	padding: 15px 23px 14px;
    	z-index: 100000;
    	right: auto
    }

    .show-more-link.expandable {
    	display: none;
    }

    .visually-hidden:not(:focus):not(:active),
    .form-allowed-tags:not(:focus):not(:active) {
    	position: absolute !important;
    	height: 1px;
    	width: 1px;
    	overflow: hidden;
    	clip: rect(1px 1px 1px 1px);
    	clip: rect(1px, 1px, 1px, 1px);
    	white-space: nowrap
    }

    .w-100 {
    	width: 100%;
    }

    .h-100 {
    	height: 100%;
    }

    .text-xs {
    	font-size: var(--size-xs);
    }

    .text-sm {
    	font-size: var(--size-sm);
    }

    .text-md {
    	font-size: var(--size-md);
    }

    .text-lg {
    	font-size: var(--size-lg);
    }

    .text-xl {
    	font-size: var(--size-xl);
    }

    .text-2xl {
    	font-size: var(--size-2xl);
    }

    .text-3xl {
    	font-size: var(--size-3xl);
    }

    .text-4xl {
    	font-size: var(--size-4xl);
    }

    .text-5xl {
    	font-size: var(--size-5xl);
    }

    .text-6xl {
    	font-size: var(--size-6xl);
    }

    /*==========================
        FLEXBOX COLUMN LAYOUTS
    ==========================*/
    /* two cols */
    .two-col-row {
    	--gap: 30px;
    	--gap-comp: calc(var(--gap)/2);
    	display: -webkit-box;
    	/* Safari ≤ 9 */
    	display: -ms-flexbox;
    	/* IE 10 */
    	display: flex;
    	-webkit-box-flex: 1;
    	-ms-flex-wrap: wrap;
    	flex-wrap: wrap;
    	gap: var(--gap);
    }

    .two-col-row>* {
    	-webkit-box-flex: 0;
    	-ms-flex: 0 1 calc(50% - var(--gap-comp));
    	flex: 0 1 calc(50% - var(--gap-comp));
    	-webkit-box-sizing: border-box;
    	box-sizing: border-box;
    }

    /* three cols */
    .three-col-row {
    	--gap: 30px;
    	--gap-comp: calc((var(--gap) * 2) / 3);
    	display: -webkit-box;
    	display: -ms-flexbox;
    	display: flex;
    	-ms-flex-wrap: wrap;
    	flex-wrap: wrap;
    	gap: var(--gap);
    }

    .three-col-row>* {
    	-webkit-box-flex: 0;
    	-ms-flex: 0 1 calc(33.333% - var(--gap-comp));
    	flex: 0 1 calc(33.333% - var(--gap-comp));
    	-webkit-box-sizing: border-box;
    	box-sizing: border-box;
    }

    /* four cols */
    .four-col-row {
    	--gap: 30px;
    	--gap-comp: calc((var(--gap) * 3) / 4);
    	display: -webkit-box;
    	display: -ms-flexbox;
    	display: flex;
    	-ms-flex-wrap: wrap;
    	flex-wrap: wrap;
    	gap: var(--gap);
    }

    .four-col-row>* {
    	-webkit-box-flex: 0;
    	-ms-flex: 0 1 calc(25% - var(--gap-comp));
    	flex: 0 1 calc(25% - var(--gap-comp));
    	-webkit-box-sizing: border-box;
    	box-sizing: border-box;
    }

    /* five cols */
    .five-col-row {
    	--gap: 30px;
    	--gap-comp: calc((var(--gap) * 4) / 5);
    	display: -webkit-box;
    	display: -ms-flexbox;
    	display: flex;
    	-ms-flex-wrap: wrap;
    	flex-wrap: wrap;
    	gap: var(--gap);
    }

    .five-col-row>* {
    	-webkit-box-flex: 0;
    	-ms-flex: 0 1 calc(20% - var(--gap-comp));
    	flex: 0 1 calc(20% - var(--gap-comp));
    	-webkit-box-sizing: border-box;
    	box-sizing: border-box;
    }

    /*==========================
            GRID LAYOUTS
    ==========================*/
    .d-grid {
    	display: -ms-grid;
    	display: grid;
    	gap: 30px;
    }

    .grid-col-2 {
    	display: -ms-grid;
    	display: grid;
    	-ms-grid-columns: 1fr 1fr;
    	grid-template-columns: repeat(2, 1fr);
    }

    .grid-col-3 {
    	display: -ms-grid;
    	display: grid;
    	-ms-grid-columns: 1fr 1fr 1fr;
    	grid-template-columns: repeat(3, 1fr);
    }

    .grid-col-4 {
    	display: -ms-grid;
    	display: grid;
    	-ms-grid-columns: 1fr 1fr 1fr 1fr;
    	grid-template-columns: repeat(4, 1fr);
    }

    .grid-col-5 {
    	display: -ms-grid;
    	display: grid;
    	-ms-grid-columns: 1fr 1fr 1fr 1fr 1fr;
    	grid-template-columns: repeat(5, 1fr);
    }

    /*==========================
        UNIVERSAL FIXES
    ==========================*/
    /* Smooth rendering on WebKit browsers */
    /* Flex gap polyfill fallback for Safari <14 (optional, if needed)
    .two-col-row,
    .three-col-row,
    .four-col-row,
    .five-col-row {
        margin: calc(-1 * var(--gap) / 2);
    }
    .two-col-row > *,
    .three-col-row > *,
    .four-col-row > *,
    .five-col-row > * {
        margin: calc(var(--gap) / 2);
    }
    */
    .d-none {
    	display: none;
    }

    .d-block {
    	display: block;
    }

    .d-flex {
    	display: -webkit-box;
    	display: -ms-flexbox;
    	display: flex;
    }

    /* positions */
    .position-relative {
    	position: relative;
    }

    .position-fixed {
    	position: fixed;
    }

    .position-absolute {
    	position: absolute;
    }

    .heading-title {
    	margin-bottom: 16px;
    	color: var(--text-secondary);
    	font-family: var(--family-title);
    	font-style: normal;
    	font-weight: 700;
    	line-height: var(--line-height-lg);
    	font-size: var(--size-2xl);
    	letter-spacing: -0.24px;
    }

    .bg-surface2 {
    	background: var(--surface-2);
    }

    /* -----------slick slider css */
    /*======= common slick slider ============= */
    /* // slick slider common css  */
    .slick-slider .slick-arrow {
    	position: absolute;
    	top: auto;
    	bottom: calc(100% + 24px);
    	right: 0;
    	margin: 0;
    	appearance: none;
    	z-index: 9;
    	background-color: var(--secondary-light, #E8ECFC);
    	border-radius: 32px;
    	border: none;
    	font-size: 0;
    	color: transparent;
    	cursor: pointer;
    	display: flex;
    	width: 40px;
    	height: 40px;
    	padding: 1px;
    	justify-content: center;
    	align-items: center;

    }

    .slick-slider .slick-arrow::after {
    	position: absolute;
    	content: '';
    	background-image: url("../images/chevron-right.svg");
    	background-size: 20px;
    	background-position: center;
    	background-repeat: no-repeat;
    	padding: 10px;
    	top: 50%;
    	left: 50%;
    	transform: translate(-50%, -50%);
    }

    .slick-slider .slick-arrow.slick-prev {
    	right: 64px;
    	left: auto;
    }

    .slick-slider .slick-arrow.slick-prev::after {
    	transform: translate(-50%, -50%) scaleX(-1);
    }

    .slick-slider .slick-arrow.slick-next {
    	right: 16px;
    	left: auto;
    }

    .slick-slider .slick-arrow.slick-disabled {
    	cursor: auto;
    	background: var(--surface-2, #F5F5F5);
    }

    .slick-slider .slick-arrow.slick-disabled::after {
    	background-image: url("../images/chevron-right-dark.svg");
    }

    .slick-slider .slick-arrow:not(.slick-disabled):hover,
    .slick-slider .slick-arrow:not(.slick-disabled):active {
    	background-color: var(--secondary-primary);
    }

    .slick-slider .slick-arrow:not(.slick-disabled):hover::after,
    .slick-slider .slick-arrow:not(.slick-disabled):active::after {
    	filter: brightness(100);
    }

    html.dark-mode .slick-slider .slick-arrow.slick-disabled::after {
    	filter: brightness(2.5);
    }

    /* Slick dots container */
    .slick-slider {
    	position: relative;
    	display: block;
    	-webkit-user-select: none;
    	-moz-user-select: none;
    	-ms-user-select: none;
    	user-select: none;
    	-webkit-touch-callout: none;
    	-khtml-user-select: none;
    	-ms-touch-action: pan-y;
    	touch-action: pan-y;
    	-webkit-tap-highlight-color: transparent;
    }

    .slick-slider .slick-dots {
    	display: flex;
    	justify-content: center;
    	align-items: center;
    	padding: 0;
    	list-style: none;
    	max-width: 618px;
    	margin: 16px auto 0;
    }

    /* Each dot's LI */
    .slick-slider .slick-dots li {
    	flex: 1;
    	height: 4px;
    	background-color: var(--secondary-primary);
    	margin: 0;
    	position: relative;
    	border-radius: 0;
    	overflow: hidden;
    }

    .slick-slider .slick-dots li:hover,
    .slick-slider .slick-dots li:active {
    	cursor: pointer;
    }

    .slick-slider .slick-dots li:first-child {
    	border-top-left-radius: 1px;
    	border-bottom-left-radius: 1px;
    }

    .slick-slider .slick-dots li:last-child {
    	border-top-right-radius: 1px;
    	border-bottom-right-radius: 1px;
    }

    .slick-slider .slick-dots li.slick-active::after {
    	content: '';
    	display: block;
    	position: absolute;
    	top: 0;
    	left: 0;
    	height: 100%;
    	width: 0;
    	background-color: var(--primary-primary);
    	border-radius: 1px;
    	animation: progress-fill 1s linear forwards;
    }

    /* Progress bar animation */
    @keyframes progress-fill {
    	from {
    		width: 0;
    	}

    	to {
    		width: 100%;
    	}
    }

    /* Hide default slick dot button */
    .slick-slider .slick-dots li button {
    	display: none;
    }

    .slick-slider .slick-list {
    	position: relative;
    	display: block;
    	overflow: hidden;
    	margin: 0;
    	padding: 0;
    }

    .slick-slider .slick-list .slick-track {
    	display: flex;
    }

    .slick-slider {
    	margin: 0 -15px;
    }

    .slick-slide {
    	margin-right: 15px;
    	margin-left: 15px;
    }

    /* common slick */
    .slick-slider .slick-track>div,
    .slick-slider .slick-track>article {
    	height: inherit;
    	line-height: 0.25;
    }

    /* -----------slick slider css ends*/
    .show-more-link,
    .read-full-link {
    	color: var(--text-primary);
    	font-family: var(--family-body);
    	font-size: var(--size-xs);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-xs);
    	padding: 8px 4px;
    	text-align: center;
    	border-bottom: 0;
    	display: inline-block;
    	/* text-transform: capitalize; */
    	box-shadow: inset 0 -2px 0 0 var(--primary-primary);
    }

    /* Desktop hover */
    .show-more-link:hover,
    .read-full-link:hover {
    	color: var(--primary-primary);
    }

    /* Mobile / touch devices */
    .show-more-link:active,
    .read-full-link:active,
    .show-more-link:focus,
    .read-full-link:focus {
    	color: var(--primary-primary);
    }

    /* common news card css */
    .news-card {
    	border-radius: 16px;
    	background: var(--surface-2);
    	display: flex;
    	flex-flow: column;
    }

    .common-news-head {
    	display: flex;
    	justify-content: space-between;
    	align-items: center;
    	margin-bottom: 24px;
    }

    .common-news-head .secn-title {
    	margin-bottom: 0;
    }

    .secn-title {
    	color: var(--text-primary, #242424);
    }

    .news-card-img {
    	line-height: 0;
    }

    .news-card-img a {
    	display: flex;
    	justify-content: center;
    	align-items: center;
    	text-decoration: none;
    }

    .news-card-img img {
    	border-radius: 16px;
    	width: 100%;
    	object-fit: cover;
    }

    .news-card .caption-title {
    	overflow: hidden;
    	color: var(--text-primary);
    	text-overflow: ellipsis;
    	font-family: var(--family-title);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-sm);
    	font-size: var(--size-md);
    	display: -webkit-box;
    	-webkit-box-orient: vertical;
    	-webkit-line-clamp: 3;
    	align-self: stretch;
    }

    .news-card .caption-title a {
    	color: currentColor;
    	text-decoration: none;
    }

    /* Desktop hover */
    .news-card .caption-title a:hover,
    .news-card .caption-title a:focus,
    .news-card .caption-title a:active {
    	text-decoration-line: underline;
    	text-decoration-style: solid;
    	text-decoration-color: var(--primary-primary, #F6CA19);
    	text-decoration-thickness: 1px;
    	text-underline-offset: 3px;
    	/* Only the WebKit properties that actually exist */
    	-webkit-text-decoration-line: underline;
    	-webkit-text-decoration-color: var(--primary-primary, #F6CA19);
    	-webkit-text-decoration-style: solid;
    }


    /* Mobile / touch devices */
    /* .news-card .caption-title a:active,
    .news-card .caption-title a:focus {
        color: var(--primary-hover);
    } */

    .cd-post-time {
    	display: flex;
    	margin-top: 8px;
    	gap: 4px 10px;
    	flex-wrap: wrap;
    }

    .cd-post-time span,
    .cd-post-time a {
    	display: -webkit-box;
    	-webkit-box-orient: vertical;
    	-webkit-line-clamp: 3;
    	overflow: hidden;
    	color: var(--text-secondary);
    	text-overflow: ellipsis;
    	font-family: var(--family-body);
    	font-size: var(--size-xs);
    	font-style: normal;
    	font-weight: 400;
    	line-height: var(--line-height-xs);

    }

    .cd-post-time a:hover,
    .cd-post-time a:active,
    .cd-post-time a:focus {
    	text-decoration-line: underline;
    	text-decoration-style: solid;
    	text-decoration-skip-ink: auto;
    	text-decoration-color: var(--primary-primary, #F6CA19);
    	text-decoration-thickness: auto;
    	text-underline-offset: auto;
    	text-underline-position: from-font;
    	text-decoration-thickness: 1px;
    	text-underline-offset: 3px;
    	/* Only the WebKit properties that actually exist */
    	-webkit-text-decoration-line: underline;
    	-webkit-text-decoration-color: var(--primary-primary, #F6CA19);
    	-webkit-text-decoration-style: solid;
    }

    /* ===============coin marquee================ */
    body .ccpw-ticker-cont {
    	z-index: 9;
    }

    /* ---------- Default (Desktop) ---------- */
    body .style-1-2 .tickercontainer {
    	max-height: 72px;
    	/* overflow-x: auto;
        scrollbar-width: none;
        -ms-overflow-style: none; */
    }

    /* body .style-1-2 .tickercontainer::-webkit-scrollbar {
        display: none;
    }

    .tickercontainer .rfm-marquee-container {
        overflow-x: visible;
        -webkit-overflow-scrolling: touch;
    } */

    .tickercontainer .rfm-marquee {
    	padding-bottom: 12px;
    	padding-top: 16px;
    }

    .tickercontainer .rfm-marquee .rfm-child {
    	border-radius: 24px;
    	background: var(--surface-2, #F5F5F5);
    	padding: 8px 12px;
    	flex: 0 0 auto;
    	min-width: 160px;
    	width: fit-content;
    	position: relative;
    	margin: 0 8px;
    }

    .rfm-marquee .ticker-item .cmc_links {
    	display: grid;
    	align-items: center;
    	grid-template-columns: 24px 1fr;
    	gap: 12px;
    	width: 100%;
    	line-height: 0;
    }

    .rfm-marquee .ticker-item .cmc_links .ccpw_icon img {
    	width: 100% !important;
    	height: 24px;
    	object-fit: cover;
    	border-radius: 50px;
    }

    .ticker-wrapper {
    	display: flex;
    	flex-flow: column;
    }

    .rfm-marquee .ticker-symbol-name .ticker-name {
    	color: var(--text-primary) !important;
    	font-size: 10px;
    	font-style: normal;
    	font-weight: 400;
    	line-height: 12px;
    	margin: 0;
    	word-break: break-word;
    }

    .rfm-marquee .ticker-symbol-name .ticker-symbol {
    	margin-left: 4px;
    	color: var(--text-secondary, rgba(66, 66, 66, 0.80)) !important;
    	font-size: 10px;
    	font-style: normal;
    	font-weight: 400;
    	line-height: 12px;
    	word-break: break-word;
    }

    .ticker-symbol-name {
    	position: relative;
    	z-index: 1;
    }

    .tickercontainer .rfm-marquee .ticker-wrapper .ticker-price {
    	color: var(--text-primary, #242424) !important;
    	font-size: var(--size-xs, 12px);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-xs, 16px);
    	margin-left: 0;
    	word-break: break-word;
    }

    .tickercontainer .rfm-marquee span.ccpw-changes {
    	display: flex;
    	justify-content: center;
    	align-items: center;
    	margin-left: 0px;
    	position: absolute;
    	top: -8px;
    	right: 0;
    	padding: 4px;
    	font-family: var(--font3);
    	font-size: 10px;
    	font-style: normal;
    	font-weight: 600;
    	line-height: 12px;
    	border-radius: 16px;
    }

    .tickercontainer span.ccpw-changes svg {
    	display: none;
    }

    .tickercontainer .rfm-marquee span.ccpw-changes.up {
    	color: var(--additional-dialogue-success-main);
    	background: var(--additional-dialogue-success-light);
    }

    .tickercontainer .rfm-marquee span.ccpw-changes.down {
    	color: var(--additional-dialogue-danger-main);
    	background: var(--additional-dialogue-danger-light);
    }

    .tickercontainer [id^="ccpw-ticker-"] {
    	background-color: transparent !important;
    }

    html.dark-mode .tickercontainer [id^="ccpw-ticker-"] {
    	background-color: var(--surface-1) !important;
    }

    /* for yellow coin marque box */
    .tickercontainer .rfm-marquee .rfm-child.meme-coin-item {
    	background: var(--primary-light, #FDF6D8);
    }

    .tickercontainer .rfm-marquee .rfm-child.meme-coin-item .ticker-wrapper .ticker-price {
    	color: var(--text-secondary, rgba(66, 66, 66, 0.80));
    	font-family: var(--family-body);
    	font-size: 10px;
    	font-style: normal;
    	font-weight: 400;
    	line-height: 12px;
    }

    .tickercontainer .rfm-marquee .rfm-child.meme-coin-item .ticker-symbol-name .ticker-name {
    	color: var(--text-primary, #242424);
    	font-size: var(--size-xs, 12px);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-xs, 16px);
    }

    .tickercontainer .rfm-marquee .rfm-child.meme-coin-item .ticker-price span.ccpw-changes.top {
    	display: flex;
    	justify-content: center;
    	align-items: center;
    	margin-left: 0px;
    	position: absolute;
    	top: -8px;
    	right: 0;
    	padding: 4px;
    	border-radius: 16px;
    	color: var(--text-primary, #242424);
    	font-family: var(--secondary-font);
    	font-size: 10px;
    	font-style: normal;
    	font-weight: 600;
    	line-height: 12px;
    	background: var(--icons-hover, #F6CA19);
    }

    /* for yellow coin marque box */
    /* ===============coin marquee ends================ */
    /* ===========================
    Related articles css begins
    ================================ */
    .related-articles {
    	margin: 48px 0;
    }

    .related-articles .common-news-head .secn-title {
    	padding: 4px 0;
    }

    .related-post-card {
    	border-radius: 16px;
    	background: var(--surface-2);
    	display: flex;
    	flex-flow: column;
    	height: 100%;
    }

    .related-post-card a {
    	display: flex;
    	flex-flow: column;
    	height: 100%;
    }

    .related-post-card figure {
    	line-height: 0;
    	overflow: hidden;
    	border-radius: 16px;
    	align-self: stretch;
    	display: flex;
    	justify-content: center;
    }

    .related-post-card figure img {
    	border-radius: 16px;
    	width: 100%;
    	height: 124px;
    	object-fit: cover;
    }

    .related-post-card .post-card-content {
    	padding: 12px 16px 16px;
    	height: calc(100% - 124px);
    	flex: 1;
    	display: flex;
    	flex-flow: column;
    	align-self: stretch;
    }

    .post-card-content .post-card-title {
    	display: -webkit-box;
    	-webkit-box-orient: vertical;
    	-webkit-line-clamp: 3;
    	align-self: stretch;
    	overflow: hidden;
    	color: var(--text-primary);
    	text-overflow: ellipsis;
    	font-family: var(--family-title);
    	font-size: var(--size-md);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-sm);
    }

    .related-post-card a:hover .post-card-title,
    .related-post-card a:active .post-card-title,
    .related-post-card a:focus .post-card-title {
    	/* Standard underline properties */
    	text-decoration-line: underline;
    	text-decoration-style: solid;
    	text-decoration-color: var(--primary-primary, #F6CA19);
    	text-decoration-thickness: 1px;
    	text-underline-offset: 3px;

    	/* Safari/WebKit support */
    	-webkit-text-decoration-line: underline;
    	-webkit-text-decoration-style: solid;
    	-webkit-text-decoration-color: var(--primary-primary, #F6CA19);
    }

    /* ===========================
    Related articles css ends
    ================================ */
    /* =====================
    ===============three shortcodes column css==========
    */
    .bg-secondary-primary {
    	background: var(--secondary-primary);
    }

    .crypto-articles {
    	align-items: stretch;
    	padding-bottom: 1rem;
    }

    .crypto-box {
    	gap: 16px;
    	display: flex;
    	flex-direction: column;
    	position: relative;
    }

    .crypto-box .heading-title {
    	margin-bottom: 0;
    }

    .crypto-box .crypto-box-list {
    	padding: 16px;
    	border-radius: 24px;
    	background: var(--surface-2, #F5F5F5);
    	flex: 1;
    	display: flex;
    	flex-direction: column;
    	justify-content: flex-start;
    }

    .crypto-box-list ul {
    	list-style: none;
    	margin: 0;
    	padding: 0;
    }

    .crypto-box-list ul li:not(:last-child) a,
    .news-list li:not(:last-child) a {
    	margin-bottom: 12px;
    	padding-bottom: 12px;
    	border-bottom: 1px solid var(--additional-divider);
    }

    .crypto-box-list ul li a {
    	display: flex;
    	align-items: center;
    	justify-content: space-between;
    	gap: 12px;
    	position: relative;
    }

    .crypto-box-list ul li a::after {
    	background-image: url("../images/chevron-right-dark.svg");
    	background-size: 20px;
    	background-position: 100%;
    	background-repeat: no-repeat;
    	bottom: 0;
    	content: "";
    	margin: auto auto auto 0px;
    	position: relative;
    	right: 0;
    	top: 0px;
    	height: 20px;
    	width: 20px;
    }

    /* hover state */
    .crypto-box-list ul li a:hover,
    .crypto-box-list ul li a:active,
    .crypto-box-list ul li a:focus {
    	border-bottom-color: var(--primary-primary) !important;
    }

    .crypto-box-list ul li a:hover::after,
    .crypto-box-list ul li a:focus::after,
    .crypto-box-list ul li a:active::after {
    	background-image: url("../images/right-cheveron-hover.svg");
    }

    /* hover state */
    .choice-option {
    	display: flex;
    	padding: 6px 8px;
    	justify-content: center;
    	align-items: center;
    	border-radius: 16px;
    	font-family: var(--font3);
    	font-size: 10px;
    	font-style: normal;
    	font-weight: 600;
    	line-height: 12px;
    }

    .choice-option.ongoing,
    .choice-option.top-choice {
    	background: var(--secondary-primary);
    	color: var(--text-contrast);
    }

    .choice-option.upcoming {
    	border: 1px solid var(--secondary-primary);
    	color: var(--secondary-primary);
    }

    .choice-option.ended {
    	color: var(--text-disabled);
    	background: var(--surface-3);
    }

    .coin-info-detail {
    	display: grid;
    	grid-template-columns: 48px 1fr;
    	gap: 12px;
    	flex: 1;
    	align-items: self-start;
    }

    .coin-img {
    	display: flex;
    	justify-content: center;
    	align-items: center;
    }

    .coin-img img {
    	width: 100%;
    	height: 100%;
    	max-width: 48px;
    	max-height: 48px;
    	object-fit: cover;
    	border-radius: 50px;
    }

    .coin-info {
    	display: flex;
    	flex-flow: column;
    	gap: 4px;
    	word-break: break-word;
    }

    .coin-info .coin-name:not(small) {
    	color: var(--text-primary);
    	font-size: var(--size-sm);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-sm);
    	word-break: break-word;
    }

    .coin-name small {
    	color: var(--text-secondary);
    	font-size: 10px;
    	font-style: normal;
    	font-weight: 400;
    	line-height: 12px;
    	margin-left: 4px;
    }

    .crypto-box-presale .coin-name small {
    	margin-left: 0px;
    	margin-top: 4px;
    	display: block;
    }

    .coin-info .coin-price {
    	color: var(--text-primary);
    	font-size: var(--size-md);
    	font-style: normal;
    	font-weight: 700;
    	line-height: 150%;
    }

    .coin-change {
    	display: flex;
    	padding: 4px 8px;
    	justify-content: center;
    	align-items: center;
    	border-radius: 16px;
    	font-size: var(--size-sm);
    	font-style: normal;
    	font-weight: 700;
    	line-height: var(--line-height-sm);
    }

    .coin-change.up {
    	background: var(--additional-dialogue-success-light);
    	color: var(--additional-dialogue-success-main);
    }

    .coin-change.down {
    	color: var(--additional-dialogue-danger-main);
    	background: var(--additional-dialogue-danger-light);
    }

    .crypto-box .show-more {
    	margin-top: auto;
    	text-align: start;
    	position: absolute;
    	top: calc(100% + 16px);
    }

    /* .crypto-section .show-more {
        margin-top: 1rem;
    } */

    /* three box shortcodes ends  */
    /* common breadcrumb css */
    .breadcrumb-wrapper {
    	margin-bottom: 1rem;
    }

    .breadcrumb-wrapper p {
    	color: var(--text-secondary, rgba(66, 66, 66, 0.80));
    	font-family: var(--family-body);
    	font-size: var(--size-xs);
    	font-style: normal;
    	font-weight: 400;
    	line-height: var(--line-height-xs);
    }

    .breadcrumb-wrapper p span {
    	color: var(--text-secondary, rgba(66, 66, 66, 0.80));
    	font-family: var(--family-body);
    	font-size: var(--size-xs);
    	font-style: normal;
    	font-weight: 400;
    	line-height: var(--line-height-xs);
    	display: inline-block;
    }

    .breadcrumb-wrapper p span span a {
    	color: currentColor;
    	font-family: inherit;
    	line-height: inherit;
    	font-weight: var(--fw-regular);
    }

    .breadcrumb-wrapper p span span a:hover,
    .breadcrumb-wrapper p span span a:active,
    .breadcrumb-wrapper p span span a:focus {
    	color: var(--text-primary);
    	text-decoration-line: underline;
    	text-decoration-style: solid;
    	text-decoration-color: var(--primary-primary, #F6CA19);
    	text-decoration-thickness: 1px;
    	text-underline-offset: 3px;
    	/* Only the WebKit properties that actually exist */
    	-webkit-text-decoration-line: underline;
    	-webkit-text-decoration-color: var(--primary-primary, #F6CA19);
    	-webkit-text-decoration-style: solid;
    }

    .breadcrumb-wrapper p span img {
    	width: 16px;
    	height: 16px;
    	vertical-align: middle;
    	margin: 0 4px;
    }

    .breadcrumb-wrapper p span.breadcrumb_last {
    	color: var(--text-primary, #242424);
    }

    /* --signle article page css */
    h1.post-title {
    	margin-bottom: 32px;
    }

    .content-area h1 {
    	color: var(--text-primary);
    }

    .content-area .post-thumbnail,
	.guide-page-secn .post-thumbnail
	{
    	line-height: 0;
    	margin-bottom: 32px;
    }

    .content-area .post-thumbnail img,
	.guide-page-secn .post-thumbnail img {
		width: 100%;
		border-radius: 16px;
		object-fit: cover;
		height: 424px;
		aspect-ratio: 16/9;
	}

    .content-area h2,
    .content-area h3,
    .content-area h4,
    .content-area h5,
    .content-area h6,
    .content-area .post-content p {
    	color: var(--text-primary);
    }

    .content-area .post-content p a {
    	font-style: normal;
    	color: var(--secondary-primary);
    	font-size: inherit;
    	font-weight: inherit;
    	line-height: var(--line-height-xs);

    	word-wrap: break-word;
    }

    .content-area .post-content p a:hover,
    .content-area .post-content p a:focus,
    .content-area .post-content p a:active {
    	text-decoration: underline;
    }

    .content-area blockquote,
    body .su-quote {
    	padding: 24px 24px 24px 88px;
    	border-radius: 16px;
    	background: var(--surface-2);
    	margin: 16px 0 32px;
    	position: relative;
    	font-style: normal;
    }

    .content-area blockquote em {
    	font-style: normal;
    }

    .content-area blockquote p,
    body .su-quote .su-quote-inner p {
    	font-weight: 600;
    	font-style: normal;
    	margin-top: 0 !important;
    }

    .content-area blockquote::before,
    body .su-quote::before {
    	content: "";
    	position: absolute;
    	top: 24px;
    	left: 24px;
    	width: 48px;
    	height: 48px;
    	background-image: url("../images/quote.svg");
    	background-repeat: no-repeat;
    	background-size: 48px;
    }

    body .su-quote::after {
    	display: none;
    }

    .post-content iframe {
    	width: 100%;
    	height: auto;
    	aspect-ratio: 16/9;
    	border-radius: 16px;
    }

    /* .content-area .post-content p img[class^="wp-"],
    .content-area .post-content p img[class*=" wp-"] {
        max-width: 100%;
        height: auto;  
    } */
    /* common breadcrumb css */
    /* signle archive post page css */
    .cd-archive-wrapper {
    	padding-top: var(--size-md);
    }

    /* top-header css archive-header-wrapper */
    .archive-header-wrapper {
    	display: flex;
    	align-items: flex-start;
    	gap: 30px;
    	flex-wrap: wrap;
    	margin-bottom: 48px;
    }

    .left-content-box {
    	border-radius: 16px;
    	border: 1px solid var(--additional-divider);
    	display: flex;
    	padding: 24px 32px;
    	flex-direction: column;
    	align-items: flex-start;
    	flex: 0 0 calc(100% - 418px - 30px);
    }

    .left-content-box p {
    	color: var(--text-primary, #242424);
    	font-size: var(--size-sm);
    	line-height: var(--line-height-sm);
    }

    .sub-content-view-more {
    	display: flex;
    	align-items: center;
    	justify-content: space-between;
    	flex-wrap: wrap;
    }

    .sub-content-view-more .post-count {
    	position: relative;
    	color: var(--text-secondary, rgba(66, 66, 66, 0.80));
    	text-align: center;
    	font-size: var(--size-sm);
    	font-style: normal;
    	font-weight: 400;
    	line-height: var(--line-height-sm);
    	display: inline-flex;
    	align-items: center;
    	padding: 6px 0;
    	justify-content: center;
    	align-self: anchor-center;
    	margin-top: 0px;
    	flex: 0 0 auto;
    	margin-left: auto;
    }

    .crypto-archive-sub-content .show-more-link {
    	margin-top: 0px;
    }

    .crypto-archive-sub-content {
    	width: 100%;
    }

    .crypto-archive-sub-content .sub-content-text {
    	/* overflow: hidden;
        max-height: 40px; */
    	transition: max-height 0.4s ease, padding 0.4s ease;
    	padding-bottom: 0;
    	margin-bottom: 8px;
    	color: var(--text-primary, #242424);
    	font-size: var(--size-sm, 14px);
    	font-style: normal;
    	font-weight: 400;
    	line-height: var(--line-height-sm, 20px);
    }

    /* .cd-archive-secn .crypto-archive-sub-content .sub-content-text.expanded,
    .crypto-archive-sub-content .sub-content-text.expanded {
        max-height: 1000px;
    } */

    .right-content-box {
    	height: auto;
    	padding: 24px 32px;
    	flex: 1 0 0;
    	border-radius: 16px;
    	border: 1px solid var(--additional-divider);
    	width: 418px;
    }

    .cryptodnes_market_global_box .cryptodnes_market_row {
    	margin-bottom: 16px;
    	padding-bottom: 16px;
    	border-bottom: 1px solid var(--additional-divider);
    }

    .cryptodnes_market_global_box .cryptodnes_market_row:last-child {
    	margin-bottom: 0;
    	padding-bottom: 0;
    	border-bottom: 0;
    }

    .cryptodnes_market_row {
    	display: grid;
    	grid-template-columns: 1fr auto;
    	align-items: center;
    	gap: 5px;
    }

    .market_row_title {
    	display: flex;
    	flex-flow: column;
    	gap: 4px;
    	word-break: break-word;
    }

    .market_row_title .cryptodnes_market_label {
    	color: var(--text-secondary, rgba(66, 66, 66, 0.80));
    	font-size: var(--size-sm);
    	font-style: normal;
    	font-weight: 400;
    	line-height: var(--line-height-sm, 20px);
    }

    .market_row_title .cryptodnes_market_value {
    	color: var(--text-primary);
    	font-size: var(--size-md);
    	font-style: normal;
    	font-weight: 700;
    	line-height: 150%;
    }

    .cryptodnes_market_change {
    	display: flex;
    	padding: 4px 8px;
    	justify-content: center;
    	align-items: center;
    	border-radius: 16px;
    	font-size: var(--size-sm);
    	font-style: normal;
    	font-weight: 700;
    	line-height: var(--line-height-sm);
    	margin-left: auto;
    	word-break: break-word;
    }

    .cryptodnes_market_change.down {
    	color: var(--additional-dialogue-danger-main);
    	background: var(--additional-dialogue-danger-light);
    }

    .cryptodnes_market_change.up {
    	background: var(--additional-dialogue-success-light);
    	color: var(--additional-dialogue-success-main);
    }

    /* top-header css archive-header-wrapper */
    .flex-row {
    	display: flex;
    	gap: 30px;
    	flex-wrap: wrap;
    }

    .flex-row .flex-left-col {
    	flex: 1 0 0;
    }

    .flex-row.full-width {
    	width: 100% !important;
    	gap: 0 !important;
    }

    .single-archive-row {
    	margin: 48px 0;
    }

    /* Default: Desktop behavior */
    .tabs-layout {
    	display: none;
    }

    .archive-crypto-ladders.three-col-row {
    	display: flex;
    }

    /* ------------------common tabs */
    .tab-content {
    	display: none;
    }

    .tab-content.active-class-tab {
    	display: block;
    }

    .cats-tab-con {
    	display: flex;
    	gap: 32px;
    	max-width: max-content;
    	margin-left: 0;
    	margin-right: auto;
    	overflow-x: auto;
    	flex-wrap: nowrap;
    	justify-content: flex-start;
    	padding-bottom: 0px;
    	width: calc(100% + 16px);
    	margin-bottom: 24px;
    	scrollbar-width: none;
    	-ms-overflow-style: none;
    }

    /* Chrome, Safari, Opera */
    .cats-tab-con::-webkit-scrollbar {
    	display: none;
    }

    .cats-tab-con .cat-tab {
    	color: var(--text-secondary);
    	font-size: var(--size-lg);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-lg);
    	cursor: pointer;
    	white-space: nowrap;
    	flex: 0 0 auto;
    	border-bottom: none;
    	transition: all .3s ease-in-out;
    }

    .cats-tab-con .cat-tab.active-class-tab,
    .cats-tab-con .cat-tab:hover {
    	color: var(--text-primary);
    	box-shadow: inset 0 -2px 0 0 var(--secondary-primary);
    }

    /* Styles only for lists inside .content-area for post-content */
    .post-content ul,
    .post-content ol {
    	margin: 1em 0 2em 0;
    	padding-left: 28px;
    	font-family: var(--family-body);
    	line-height: 1.6;
    }

    .post-content ul li,
    .post-content ol li {
    	color: var(--text-primary);
    	font-size: var(--size-md);
    	font-style: normal;
    	font-weight: 400;
    	line-height: var(--line-height-md);
    	margin-bottom: 16px;
    }

    .post-content ul li:last-child,
    .post-content ol li:last-child {
    	margin-bottom: 0;
    }

    .post-content ul li::marker {
    	color: var(--secondary-primary, #1946F6);
    	font-size: var(--size-xl);
    	line-height: 1;
    }

    .post-content ol li a,
    .post-content ul li a {
    	font-style: normal;
    	color: var(--secondary-primary);
    	font-size: inherit;
    	font-weight: inherit;
    	line-height: var(--line-height-xs);
    }

    .post-content ol li a:hover,
    .post-content ol li a:active,
    .post-content ul li a:hover,
    .post-content ul li a:active {
    	text-decoration: underline;
    }

    .post-content ul {
    	list-style-type: disc;
    }

    .post-content ul ul {
    	list-style-type: circle;
    	padding-left: 28px;
    	margin-bottom: 0;
    }

    .post-content ol {
    	counter-reset: step;
    	list-style: none;
    	padding-left: 0;
    }

    .post-content ol li {
    	counter-increment: step;
    	margin-bottom: 16px;
    	position: relative;
    	padding-left: 34px;
    }

    .post-content ol li::before {
    	content: counter(step);
    	position: absolute;
    	left: 0;
    	top: 0;
    	width: 24px;
    	height: 24px;
    	border-radius: 50%;
    	background: var(--secondary-light, #E8ECFC);
    	color: var(--secondary-primary, #1946F6);
    	font-weight: 700;
    	display: flex;
    	justify-content: center;
    	align-items: center;
    	font-family: var(--family-body);
    	font-size: var(--size-sm, 14px);
    	line-height: var(--line-height-sm);
    }

    /* Nested ol styling */
    .post-content ol ol {
    	counter-reset: substep;
    	padding-left: 0px;
    	margin-top: 8px;
    	margin-bottom: 0;
    }

    .post-content ol ol li {
    	counter-increment: substep;
    	margin-bottom: 8px;
    	padding-left: 30px;
    	/* space for nested badge */
    }

    .post-content ol ol li::before {
    	content: counter(step) "." counter(substep);
    	position: absolute;
    	left: 0;
    	top: 0;
    	width: 24px;
    	height: 24px;
    	border-radius: 50%;
    	background: var(--secondary-light);
    	color: var(--secondary-primary);
    	font-weight: 700;
    	display: flex;
    	justify-content: center;
    	align-items: center;
    	font-family: var(--family-body);
    	font-size: var(--size-sm, 14px);
    	line-height: var(--line-height-sm);
    }

    .border-box {
    	border-radius: 16px;
    	border: 1px solid var(--additional-divider);
    }

    .rounded-border-box {
    	border-radius: 16px;
    	border: 1px solid var(--additional-divider);
    	padding: 1.5rem;
    }

    .rounded-border-box h1 {
    	color: var(--text-primary);
    }

    /* comon pagination */
    .cd-pagination {
    	margin-top: 24px;
    }

    .cd-pagination .nav-links {
    	display: flex;
    	align-items: center;
    	gap: 1rem;
    }

    .cd-pagination .nav-links .cd-pagination-prev,
    .cd-pagination .nav-links .cd-pagination-next {
    	--size: 2rem;
    	display: flex;
    	justify-content: center;
    	align-items: center;
    	width: var(--size);
    	min-width: var(--size);
    	height: var(--size);
    	font-size: 14px;
    	font-weight: 600;
    	text-decoration: none;
    	color: var(--text-primary);
    	transition: all 0.3s ease;
    	padding: 6px;
    	border-radius: var(--size);
    	background: var(--surface-2);
    	position: relative;
    }

    .cd-pagination .nav-links .cd-pagination-prev.disabled,
    .cd-pagination .nav-links .cd-pagination-next.disabled {
    	cursor: auto;
    	background: var(--surface-2);
    }

    .cd-pagination .nav-links .cd-pagination-prev.disabled svg path,
    .cd-pagination .nav-links .cd-pagination-next.disabled svg path {
    	fill: var(--text-disabled);
    }

    .cd-pagination .nav-links .cd-pagination-prev:not(.disabled),
    .cd-pagination .nav-links .cd-pagination-next:not(.disabled) {
    	background: var(--secondary-light);
    }

    .cd-pagination .nav-links svg {
    	width: 20px;
    	height: 20px;
    }

    .cd-pagination .nav-links .cd-pagination-prev:not(.disabled) svg path,
    .cd-pagination .nav-links .cd-pagination-next:not(.disabled) svg path {
    	fill: var(--secondary-primary);
    }

    /* hover state */
    .cd-pagination .nav-links .cd-pagination-prev:not(.disabled):hover,
    .cd-pagination .nav-links .cd-pagination-prev:not(.disabled):active,
    .cd-pagination .nav-links .cd-pagination-next:not(.disabled):hover,
    .cd-pagination .nav-links .cd-pagination-next:not(.disabled):active {
    	background: var(--secondary-primary);
    }

    .cd-pagination .nav-links .cd-pagination-prev:not(.disabled):hover svg path,
    .cd-pagination .nav-links .cd-pagination-prev:not(.disabled):active svg path,
    .cd-pagination .nav-links .cd-pagination-next:not(.disabled):hover svg path,
    .cd-pagination .nav-links .cd-pagination-next:not(.disabled):active svg path {
    	fill: var(--text-contrast);
    }

    /* hover state */
    html.dark-mode .cd-pagination .nav-links svg path {
    	fill: var(--text-disabled, rgba(255, 255, 255, 0.24));
    }

    html.dark-mode .cd-pagination .nav-links .cd-pagination-prev:not(.disabled):hover svg path,
    html.dark-mode .cd-pagination .nav-links .cd-pagination-prev:not(.disabled):active svg path html.dark-mode .cd-pagination .nav-links .cd-pagination-next:not(.disabled):hover svg path,
    html.dark-mode .cd-pagination .nav-links .cd-pagination-next:not(.disabled):active svg path {
    	fill: var(--text-primary);
    }

    .cd-pagination ul.page-numbers {
    	display: flex;
    	align-items: center;
    	gap: 8px;
    	list-style: none;
    	padding: 0;
    }

    .cd-pagination ul.page-numbers li {
    	--size: 2rem;
    	display: flex;
    	justify-content: center;
    	align-items: center;
    	display: flex;
    	justify-content: center;
    	align-items: center;
    	width: fit-content;
    	min-width: var(--size);
    	height: var(--size);
    }

    .cd-pagination ul.page-numbers li span,
    .cd-pagination ul.page-numbers li a {
    	display: flex;
    	justify-content: center;
    	align-items: center;
    	width: 100%;
    	height: 100%;
    	font-size: 14px;
    	font-weight: 600;
    	text-decoration: none;
    	color: var(--text-primary);
    	border-bottom: 1px solid transparent;
    	transition: all 0.3s ease;
    	padding: 6px;
    	border-radius: 0px;
    }

    .cd-pagination ul.page-numbers li span {
    	border-radius: 0;
    }

    .cd-pagination ul.page-numbers li span.current {
    	border-bottom: 1px solid var(--secondary-primary);
    	font-weight: 600;
    }

    .cd-pagination ul.page-numbers li a.prev {
    	border-radius: 32px;
    	background: var(--surface-2);
    }

    .cd-pagination ul.page-numbers li a.next {
    	border-radius: 32px;
    	background: var(--secondary-light, #E8ECFC);
    }

    .cd-pagination ul.page-numbers li a:not(.prev, .next):hover {
    	border-bottom: 1px solid var(--secondary-primary, #1946F6);
    	color: var(--secondary-primary, #1946F6);
    }

    .cd-pagination ul.page-numbers li a.prev:hover,
    .cd-pagination ul.page-numbers li a.next:hover {
    	background: var(--secondary-light, #E8ECFC);
    }

    .cd-pagination ul.page-numbers li a img {
    	max-width: 20px;
    	height: auto;
    }

    html.dark-mode .cd-pagination ul.page-numbers li a.prev img {
    	filter: brightness(3.5);
    }

    /* cd-post grid for autor details */
    .latest-posts h2 {
    	color: var(--text-primary);
    }

    .posts-grid {
    	display: grid;
    	grid-template-columns: 1fr 306px;
    	gap: 30px
    }

    .posts-grid-left {
    	display: grid;
    	grid-template-columns: 1fr;
    	gap: 16px;
    }

    .post-item-card {
    	border-radius: 16px;
    	background: var(--surface-2);
    }

    .post-item-thumb {
    	line-height: 0;
    	overflow: hidden;
    	border-radius: 16px;
    }

    .post-item-thumb img {
    	width: 100%;
    	object-fit: cover;
    	border-radius: 16px;
    }

    .post-item-card .post-item-summary {
    	padding: 12px 16px 16px;
    }

    .post-item-card .post-item-title {
    	overflow: hidden;
    	color: var(--text-primary);
    	text-overflow: ellipsis;
    	font-family: var(--family-title);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-sm);
    	font-size: var(--size-md);

    	display: -webkit-box;
    	-webkit-box-orient: vertical;
    	-webkit-line-clamp: 3;
    	align-self: stretch;
    	word-break: break-word;
    }

    .post-item-card .post-item-title a {
    	color: currentColor;
    	text-decoration: none;
    }

    /* right side posts lis */
    .common-post-list {
    	border-radius: 24px;
    	display: flex;
    	padding: 16px;
    	flex-direction: column;
    	align-items: flex-start;
    	align-self: stretch;
    	background: var(--surface-2);
    	height: auto;
    }

    .common-post-list .post-item {
    	margin-bottom: 16px;
    	padding-bottom: 16px;
    	border-bottom: 1px solid var(--surface-3);
    	display: flex;
    	flex-flow: column;
    	gap: 4px;
    }

    .common-post-list .post-item:last-child {
    	padding-bottom: 0;
    	margin-bottom: 0;
    	border-bottom: 0;
    }

    .common-post-list .post-item-heading a {
    	overflow: hidden;
    	color: var(--text-primary);
    	text-overflow: ellipsis;
    	font-family: var(--family-body);
    	font-size: var(--size-sm);
    	font-style: normal;
    	font-weight: 400;
    	line-height: var(--line-height-sm);
    	display: -webkit-box;
    	-webkit-box-orient: vertical;
    	-webkit-line-clamp: 3;
    	align-self: stretch;
    }

    /* Desktop hover */
    .post-item-card .post-item-title a:hover,
    .post-item-card .post-item-title a:active,
    .post-item-card .post-item-title a:focus,
    .common-post-list .post-item-heading a:hover,
    .common-post-list .post-item-heading a:focus,
    .common-post-list .post-item-heading a:active {
    	text-decoration-line: underline;
    	text-decoration-style: solid;
    	text-decoration-skip-ink: auto;
    	text-decoration-color: var(--primary-primary, #F6CA19);
    	text-decoration-thickness: auto;
    	text-underline-offset: auto;
    	text-underline-position: from-font;
    	/* Only the WebKit properties that actually exist */
    	-webkit-text-decoration-line: underline;
    	-webkit-text-decoration-color: var(--primary-primary, #F6CA19);
    	-webkit-text-decoration-style: solid;
    }

    .common-post-list .post-item .post-dispatch-time,
    .common-post-list .post-item .post-date {
    	overflow: hidden;
    	color: var(--text-secondary);
    	text-overflow: ellipsis;
    	font-family: var(--family-body);
    	font-size: var(--size-xs, 12px);
    	font-style: normal;
    	font-weight: 400;
    	line-height: var(--line-height-xs);
    	display: -webkit-box;
    	-webkit-box-orient: vertical;
    	-webkit-line-clamp: 3;
    	align-self: stretch;
    }

    /* faq css */
    .man_faq_sec {
    	border-radius: 16px;
    	border: 1px solid var(--surface-3);
    	margin: 16px 0;
    }

    .man_faq_sec .ms_faq {
    	border-bottom: 1px solid var(--surface-3, #E5E5E5);
    }

    .man_faq_sec .ms_faq.ms_card:last-of-type {
    	border-bottom: 0;
    }

    .man_faq_sec .ms_faq,
    .man_faq_sec .ms_faq.ms_card:last-of-type {
    	margin-bottom: 0;
    }

    .man_faq_sec .ms_faq .accordionButton {
    	padding: 16px 56px 16px 16px;
    	background: url("../images/chevron.svg") no-repeat;
    	background-size: 24px;
    	background-position: right 16px center;
    	border-bottom: none;
    }

    .man_faq_sec .ms_faq .accordionButton.on {
    	background: url("../images/chevron-up.svg") no-repeat;
    	background-size: 24px;
    	background-position: right 16px center;
    	border-bottom: 0;
    }

    /* dark-mode */
    html.dark-mode .man_faq_sec .ms_faq .accordionButton {
    	background: url("../images/chevron-bottom-dark-mode.svg") no-repeat;
    	background-size: 24px;
    	background-position: right 16px center;
    	border-bottom: none;
    }

    html.dark-mode .man_faq_sec .ms_faq .accordionButton.on {
    	background: url("../images/chevron-up-dark-mode.svg") no-repeat;
    	background-size: 24px;
    	background-position: right 16px center;
    	border-bottom: 0;
    }

    /* dark-mode */
    .man_faq_sec .ms_faq .accordionButton h3 {
    	color: var(--text-primary) !important;
    	font-family: var(--family-body);
    	font-size: var(--size-md) !important;
    	font-style: normal !important;
    	font-weight: 600 !important;
    	line-height: var(--line-height-md) !important;
    }

    .man_faq_sec .ms_faq .accordionContent {
    	padding: 0 1rem 0.5rem;
    }

    .man_faq_sec .ms_faq .accordionContent p {
    	font-size: var(--size-md);
    	line-height: var(--line-height-md);
    	font-weight: var(--fw-regular);
    	color: var(--text-primary);
    }

    /* errorpage 404 css */
    .about-secn-summary {
    	padding: 24px 32px;
    	margin-bottom: 24px;
    }

    .about-secn-summary h1,
    .latest-posts .title-heading {
    	color: var(--text-primary);
    }

    .about-secn-summary p {
    	color: var(--text-primary, #242424);
    	font-size: var(--size-sm, 14px);
    	line-height: var(--line-height-sm);
    }

    .title-heading {
    	margin-bottom: 16px;
    }

    html.dark-mode .breadcrumb-wrapper p span img {
    	filter: brightness(2.5);
    }

    /* errorpage 404 css */
    .common-news-articles .common-news-head .heading-title {
    	margin-bottom: 0;
    }

    .common-news-grid {
    	display: grid;
    	grid-template-columns: 1fr;
    }

    /* ----guide page pros-cons */
    .pros-cons-wrapper {
    	max-width: 100%;
    }

    .pros-cons-wrapper {
    	padding: 1.5rem;
    	border-radius: 16px;
    	background: var(--surface-2, #F5F5F5);
    	border: 0;
    	margin: 2rem 0;
    }

    .pros-cons-wrapper .pros-cons-title {
    	color: var(--text-primary, #242424);
    	background-color: transparent;
    	font-family: var(--family-title);
    	font-size: var(--size-2xl);
    	font-style: normal;
    	font-weight: 700;
    	line-height: var(--line-height-lg);
    	letter-spacing: -0.24px;

    	padding: 0;
    	margin-bottom: 1rem;
    }

    .pros-cons-wrapper .pros-cons-content {
    	padding: 0;
    	background: transparent;
    }

    .pros-cons-wrapper .pros-cons-heading {
    	border: 0;
    	margin-bottom: 1rem;
    	padding: 0;
    	color: var(--text-primary, #242424);
    	font-family: var(--family-body);
    	font-size: var(--size-md, 16px);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-md, 24px);
    }

    .pros-cons-wrapper .pros-cons-content .pros-cons-list {
    	margin-bottom: 1rem;
    }

    .pros-cons-list ul {
    	padding: 0;
    	margin: 0;
    	list-style: none;
    }

    .pros-cons-wrapper .pros-cons-content .pros-cons-list ul li {
    	padding: 2px 0 2px 32px !important;
    	margin-bottom: 8px !important;
    	color: var(--text-primary, #242424);
    	font-size: var(--size-sm, 14px) !important;
    	font-style: normal;
    	font-weight: 600 !important;
    	line-height: var(--line-height-sm, 20px) !important;
    	list-style-type: none;
    }

    /* pros icon */
    .pros-cons-wrapper .pros-section .pros-cons-list ul li {
    	background: url("../images/pros.svg");
    	background-size: 24px;
    	background-position: left center;
    	background-repeat: no-repeat;
    }

    /* --cons icons */
    .pros-cons-wrapper .cons-section .pros-cons-list ul li {
    	background: url("../images/cons.svg");
    	background-size: 24px;
    	background-position: left center;
    	background-repeat: no-repeat;
    }

    .pros-cons-wrapper .pros-section .pros-cons-list ul li:last-child,
    .pros-cons-wrapper .cons-section .pros-cons-list ul li:last-child {
    	margin-bottom: 0 !important;
    }

    /* common su-table */

    /* === su-table responsive inside .post-content === */
    body .su-table {
    	width: 100%;
    	display: block;
    	margin: 2rem 0;
    	/* border-radius: 0px;
        border: 1px solid var(--secondary-light, #E8ECFC) !important; */
    	border-top-width: 0 !important;
    }

    /* === Style the table === */
    body .su-table table {
    	width: 100%;
    	min-width: 600px;
    	border-collapse: separate !important;
    	background-color: transparent !important;
    	border-radius: 16px !important;
    	overflow: hidden;
    	scrollbar-width: thin;
    	border: 1px solid var(--secondary-light, #E8ECFC) !important;
    	border-top-width: 0px !important;
    }

    /* === Header cells === */
    body .su-table thead th {
    	background-color: var(--surface-2) !important;
    	text-align: left !important;
    	padding: 1rem !important;
    	border: 0 !important;
    	white-space: nowrap;
    	color: var(--text-primary) !important;
    	font-family: var(--family-title);
    	font-size: var(--size-md) !important;
    	font-style: normal;
    	font-weight: 600 !important;
    	line-height: var(--line-height-sm) !important;

    }

    body .su-table thead th:first-child {
    	border-top-left-radius: 16px;
    	border-bottom-left-radius: 16px;

    }

    body .su-table thead th:last-child {
    	border-top-right-radius: 16px;
    	border-bottom-right-radius: 16px;
    }

    /* === Table body cells === */
    body .su-table table tr:nth-child(even) td,
    body .su-table.su-table-alternate table tr:nth-child(even) td {
    	background-color: transparent !important;
    }

    body .su-table tbody td {
    	padding: 0.625rem 1rem !important;
    	border-radius: 0px;
    	border-width: 0 0 1px 0 !important;
    	border-bottom: 1px solid var(--secondary-light) !important;
    	color: var(--text-primary);
    	font-family: var(--family-body);
    	font-size: var(--size-md) !important;
    	font-style: normal;
    	font-weight: 400;
    	line-height: var(--line-height-md);
    	background-color: transparent !important;
    }

    body .su-table tbody td a {
    	color: var(--secondary-primary);
    }

    body .su-table tbody td a:hover,
    body .su-table tbody td a:active {
    	text-decoration: underline;
    }
	/* body .su-note .su-table table {
    border: 1px solid var(--text-primary, #242424) !important;
}
	body .su-note .su-table tbody td {
    border-color: var(--text-primary, #242424) !important;
} */

    /* === Rounded corners on last row === */
    body .su-table tbody tr:last-child td {
    	border-bottom: 0 !important;
    }

    body .su-table tbody tr:last-child td:first-child {
    	border-bottom-left-radius: 16px;
    }

    body .su-table tbody tr:last-child td:last-child {
    	border-bottom-right-radius: 16px;
    }

    /* === Alternate row background if using su-table-alternate === */
    /* === Optional: scrollbar styling === */
    body .su-table::-webkit-scrollbar {
    	height: 4px;
    }

    body .su-table::-webkit-scrollbar-thumb {
    	background: var(--surface-2, #F5F5F5);
    	border-radius: 4px;
    }

    body .su-table::-webkit-scrollbar-thumb:hover {
    	background: var(--primary-hover);
    }

    /* su-ordered and uorders list css */
    .su-ordered-list,
    .su-list.su-ordered-list,
    .su-unordered-list,
    .su-list.su-unordered-list {
    	margin: 2rem 0;
    }

    .su-ordered-list {
    	border-radius: 16px;
    	border: 1px solid var(--additional-divider, #E3E3E3);
    	background: var(--surface-1, #FFF);
    	padding: 1rem;
    }

    .su-ordered-list ol {
    	margin: 0;
    	padding-left: 0 !important;
    }

    .su-ordered-list ol li {
    	color: var(--text-primary, #242424);
    	font-size: var(--size-md);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-md);
    }

    .su-ordered-list ol li:not(:last-child) {
    	margin-bottom: 1rem;
    	padding-bottom: 1rem;
    	border-bottom: 1px solid var(--surface-2, #F5F5F5);
    }

    .su-ordered-list ol li i {
    	display: none;
    }

    /* unrdered list */
    body .su-unordered-list ul li {
    	color: var(--text-primary, #242424);
    	font-size: var(--size-md, 16px) !important;
    	font-style: normal;
    	font-weight: 400;
    	line-height: var(--line-height-md) !important;
    	margin-bottom: 1rem !important;
    	padding: 0 0 0 28px !important;
    }

    body .su-unordered-list ul li:last-child {
    	margin-bottom: 0 !important;
    }

    .su-unordered-list.su-list ul li>i,
    .su-unordered-list ul li>i {
    	width: 20px;
    	height: 20px;
    	color: var(--secondary-primary, #1946F6) !important;
    	line-height: 8px;
    	top: 0;
    	font-size: 8px;
    	left: 0;
    	display: flex;
    	justify-content: center;
    	align-items: center;
    }

    .su-unordered-list ul li:last-child {
    	margin-bottom: 0;
    }

    /* su-button and note */
    body .su-button-center {
    	text-align: center;
    }

    body .su-button-center .su-button {
    	margin-left: auto;
    	margin-right: auto;
    }

    body .su-button {
    	min-width: 164px;
    	max-width: fit-content;
    	height: 48px;
    	padding: 12px 32px;
    	margin-top: 24px !important;
    	margin-bottom: 24px !important;
    	display: inline-block !important;
    	 	border-radius: 32px !important;
    	background: var(--primary-primary, #F6CA19) !important;
    	color: var(--compnents-buttons-text, #242424) !important;
    	font-size: var(--size-md, 16px) !important;
    	font-style: normal;
    	font-weight: 600 !important;
    	line-height: var(--line-height-md, 24px) !important;
    	text-decoration: none;
    	border: 0 !important;
    	box-sizing: border-box !important;
    }

    body .su-button span {
    	padding: 0 !important;
    	font-size: inherit !important;
    	line-height: inherit !important;
    	border: 0 !important;
    	box-sizing: border-box !important;
    	color: inherit !important;
    	top: 0 !important;
    	font-weight: 600 !important;
    }

    /* hover */
    body .su-button:hover,
    body .su-button:active,
    body .su-button:focus {
    	background: var(--primary-hover) !important;
    	text-decoration: none !important;
    	color: var(--text-contrast) !important;
    	opacity: 1 !important;
    }

    body .su-note {
    	border-radius: 16px !important;
    	background: var(--surface-2);
    	padding: 32px;
    	margin-bottom: 32px;
    	margin-top: 32px;
    	border: 0;
    }

    body .su-note .su-note-inner {
    	background-color: transparent !important;
    	border: 0;
    	padding: 0;
    	color: var(--text-primary, #242424) !important;
    	font-size: var(--size-md, 16px) !important;
    	font-style: normal;
    	font-weight: 400;
    	line-height: var(--line-height-md, 24px)
    }

    .dark-mode .su-tabs .su-tabs-panes .su-note {
    	background: var(--surface-3);
    }

    /*============== HOW TO STEPS ==============*/
    .how-to-steps {
    	margin: 2rem 0;
    	padding-right: 111px;
    	position: relative;
    }

    /* Each Step Box */
    .how-to-step {
    	margin-bottom: 24px;
    	border-radius: 16px;
    	background: var(--surface-2, #F5F5F5);
    	padding: 24px;
    	max-width: 85%;
    	position: relative;
    }

    /* Remove margin from last step */
    .how-to-step:last-child {
    	margin-bottom: 0;
    }

    /* Step Number Tag */
    .how-to-step .step-number {
    	border-radius: 16px;
    	border: 1px solid var(--secondary-primary);
    	background: var(--secondary-light);
    	position: absolute;
    	right: -56px;
    	top: 15px;
    	display: flex;
    	padding: 7px 16px;
    	justify-content: center;
    	align-items: center;
    	gap: 10px;
    	color: var(--secondary-primary, #1946F6);
    	text-align: center;
    	font-family: var(--family-title);
    	font-size: var(--size-md, 16px);
    	font-weight: 600;
    	line-height: var(--line-height-sm, 20px);
    	/* text-transform: capitalize; */
    	min-width: 104px;
    }

    .how-to-step .su-button {
    	margin-bottom: 0 !important;
    	width: 100%;
    	max-width: 100%;
    }

    .how-to-step .friendly-tip {
    	margin-bottom: 1rem;
    }

    .how-to-step .su-ordered-list {
    	border: 0;
    	margin: 1rem 0;
    }

    .how-to-step .step-content p a {
    	color: var(--text-primary, #242424);
    	/* Body/Large/Default */
    	font-family: var(--family-body, Sora);
    	font-size: var(--size-md, 16px);
    	font-style: normal;
    	font-weight: 400;
    	line-height: var(--line-height-md, 24px);
    	text-decoration-line: underline;
    	text-decoration-style: solid;
    	text-decoration-skip-ink: auto;
    	text-decoration-color: var(--primary-primary, #F6CA19);
    	text-decoration-thickness: auto;
    	text-underline-offset: auto;
    	text-underline-position: from-font;
    }

    /* how to steps css ends */
    /* guide page tempalte css */
    .guide-page-secn {
    	margin-top: 1rem;
    }

    .guide-page-secn h1.entry-title {
    	color: var(--text-primary);
    }

    /* conclusion css */
    .post-conclusion {
    	border-radius: 16px;
    	border: 1px solid var(--additional-divider);
    	display: flex;
    	padding: 32px 32px 48px 32px;
    	align-items: flex-start;
    	flex-flow: column;
    	margin-top: 48px;
    }

    .post-conclusion h3 {
    	color: var(--text-secondary, rgba(66, 66, 66, 0.80));
    	margin-top: 0;
    }

    .conclusion-content p {
    	color: var(--text-primary);
    	font-size: var(--size-sm);
    	line-height: var(--line-height-sm);
    }

    /* author box css */
    .post-conclusion+.author-box {
    	margin-top: -24px;
    }

    .author-box {
    	border-radius: 16px;
    	background: var(--surface-2);
    	padding: 32px;
    	margin-bottom: 48px;
    	margin-top: 48px;
    }

    .author-box-grid {
    	display: grid;
    	grid-template-columns: 1fr 160px;
    	grid-template-areas: "author-box-left author-box-right";
    	align-items: start;
    	gap: 8px 24px;
    }

    /* for left side author box */
    .author-box-left {
    	display: flex;
    	flex-flow: column;
    	word-break: break-word;
    	grid-area: author-box-left;
    }

    /* role */
    .author-role {
    	margin-bottom: 4px;
    	color: var(--secondary-primary);
    	font-size: var(--size-xs);
    	font-weight: 600;
    	line-height: var(--line-height-xs);
    }

    /* name */
    .author-display-name {
    	margin-bottom: 12px;
    }

    .author-display-name a {
    	color: var(--text-primary);
    	font-family: var(--family-title);
    	font-size: var(--size-3xl);
    	font-weight: 700;
    	line-height: var(--line-height-lg);
    	letter-spacing: -0.56px;

    }

    .author-display-name a:hover,
    .author-display-name a:active,
    .author-display-name a:focus {
    	text-decoration-line: underline;
    	text-decoration-style: solid;
    	text-decoration-skip-ink: auto;
    	text-decoration-color: var(--primary-primary, #F6CA19);
    	text-decoration-thickness: auto;
    	text-underline-offset: auto;
    	text-underline-position: from-font;
    	/* Only the WebKit properties that actually exist */
    	-webkit-text-decoration-line: underline;
    	-webkit-text-decoration-color: var(--primary-primary, #F6CA19);
    	-webkit-text-decoration-style: solid;
    }

    /* social */
    .author-social-profile {
    	margin-bottom: 16px;
    }

    .author-social-profile ul {
    	display: flex;
    	gap: 16px;
    	flex-wrap: wrap;
    }

    /* avatar */
    .author-box-right {
    	display: flex;
    	flex-flow: column;
    	gap: 8px;
    	grid-area: author-box-right;
    }

    .author-avatar a {
    	display: flex;
    	align-items: center;
    	justify-content: center;
    	line-height: 0;
    	overflow: hidden;
    	border-radius: 16px;
    }

    .author-avatar img {
    	width: 100%;
    	height: 160px;
    	aspect-ratio: 1/1;
    	object-fit: cover;
    	border-radius: 16px;
    }

    /* bio */
    .author-info {
    	margin-bottom: 16px;
    }

    .author-info .author-bio {
    	color: var(--text-secondary, rgba(66, 66, 66, 0.80));
    	font-family: var(--family-body);
    	font-size: var(--size-sm);
    	font-weight: 400;
    	line-height: var(--line-height-sm);
    }

    /* CTA */
    .about-author-cta a {
    	color: var(--text-primary);
    	font-family: var(--family-body);
    	font-size: var(--size-xs);
    	font-weight: 600;
    	line-height: var(--line-height-xs);
    	padding: 8px 4px;
    	/* text-transform: capitalize; */
    }

    .about-author-cta a:hover,
    .about-author-cta a:active,
    .about-author-cta a:focus {
    	cursor: pointer;
    	color: var(--primary-primary);

    }

    /* articles */
    .author-articles-count {
    	display: flex;
    	flex-direction: column;
    	align-items: center;
    	gap: 4px;
    }

    .author-articles-count a {
    	color: var(--text-primary, #242424);
    	font-family: var(--family-body);
    	font-size: var(--size-xs);
    	font-weight: 600;
    	line-height: var(--line-height-xs);
    	text-decoration: underline;
    	text-decoration-color: var(--primary-primary);
    	text-align: center;
    	margin-bottom: 4px;
    }

    .author-articles-count a:hover,
    .author-articles-count a:active,
    .author-articles-count a:focus {
    	cursor: pointer;
    	color: var(--primary-primary);
    }

    .author-articles-count span {
    	color: var(--text-secondary, rgba(66, 66, 66, 0.80));
    	font-size: var(--size-xs);
    	font-weight: 400;
    	line-height: var(--line-height-xs);
    	text-align: center;
    }

    /* hidden for desktop */
    .author-box-right-info .author-role,
    .author-box-right-info .author-display-name {
    	display: none;
    }

    /* post tags css */
    .post-tags {
    	margin: 2rem 0;
    }

    .tags-list {
    	display: flex;
    	flex-wrap: wrap;
    	gap: 8px;
    }

    .tags-list .tag {
    	display: flex;
    	padding: 4px 16px;
    	align-items: center;
    	gap: 8px;
    	border-radius: 24px;
    	background: var(--primary-light);
    	color: var(--text-primary);
    	font-size: var(--size-xs);
    	font-style: normal;
    	font-weight: 400;
    	line-height: var(--line-height-xs);
    }

    .tags-list .tag:hover,
    .tags-list .tag:active,
    .tags-list .tag:focus {
    	background: var(--primary-primary);
    	color: var(--text-primary);
    }

    /* cd-addtional action with reaction and  share articles */
    .cd-additional-actions {
    	margin: 32px 0 48px 0;
    	display: flex;
    	padding: 16px 32px;
    	flex-direction: column;
    	align-items: flex-start;
    	align-self: stretch;
    	border-radius: 16px;
    	border: 1px solid var(--secondary-light);
    	background: var(--surface-1);
		clear: both;
    }

    .additional-actions-box {
    	margin-bottom: 16px;
    	padding-bottom: 16px;
    	width: 100%;
    	flex: 1;
    	display: grid;
    	grid-template-columns: minmax(250px, 1fr) auto;
    	gap: 16px;
    	align-items: center;
    }

    .article-reactions {
    	border-bottom: 1px solid var(--surface-3);
    }

    .additional-actions-box:last-child {
    	padding-bottom: 0;
    	margin-bottom: 0;
    	border-bottom: 0;
    }

    .additional-actions-box .additional-action-label {
    	color: var(--text-primary);
    	font-family: var(--family-title);
    	font-size: var(--size-md);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-sm);
    	/* text-transform: capitalize; */
    	max-width: 100%;
    	word-wrap: break-word;
    	white-space: normal;
    	overflow-wrap: anywhere;
    }

    .cd-reaction-picker,
    .cd-social-share-picker {
    	display: flex;
    	flex: 1 1 auto;
    	flex-wrap: wrap;
    	gap: 16px;
    }

    .cd-reaction-picker-list,
    .cd-social-share-list {
    	display: flex;
    	gap: 16px;
    	flex-wrap: wrap;
    	align-items: center;
    }

    .cd-reaction-icon,
    .cd-social-share-icon {
    	display: flex;
    	min-width: 88px;
    	padding: 4px 12px;
    	justify-content: center;
    	align-items: center;
    	gap: 4px;
    	border-radius: 16px;
    	background: var(--surface-2);
    	cursor: pointer;
    	transition: background 0.3s ease, color 0.3s ease;
    }

    .cd-reaction-icon img,
    .cd-social-share-icon img {
    	width: 24px;
    	height: 32px;
    	object-fit: contain;
    }

    .reaction-count {
    	color: var(--text-primary);
    	text-align: center;
    	font-family: var(--family-body);
    	font-size: var(--size-sm);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-sm);
    	min-width: 24px;
    }

    .cd-reaction-icon:hover,
    .cd-reaction-icon:active,
    .cd-reaction-icon:focus,
    .cd-reaction-icon.has-own,
    .cd-social-share-icon:hover,
    .cd-social-share-icon:active,
    .cd-social-share-icon:focus {
    	background: var(--secondary-light);
    }

    .cd-reaction-icon:hover .reaction-count,
    .cd-reaction-icon:active .reaction-count,
    .cd-reaction-icon:focus .reaction-count,
    .cd-reaction-icon.has-own .reaction-count {
    	color: var(--secondary-primary);
    }

    /* cd-addtional action with reaction and  share articles */
    /* highlight box article */
    .highlight-block {
    	margin: 2rem 0;
    	padding: 2rem;
    	border-radius: 16px;
    	background: var(--surface-2, #F5F5F5);
    }

    .highlight-block .highlight-header {
    	display: grid;
    	grid-template-columns: 64px 1fr;
    	gap: 1rem;
    	align-items: center;
    	margin-bottom: 1.5rem;
    }

    .highlight-header .highlight-avatar {
    	--size: 64px;
    	width: var(--size);
    	height: var(--size);
    	object-fit: cover;
    	border-radius: var(--size);
    }

    .highlight-title-container {
    	display: flex;
    	flex-flow: column;
    }

    .highlight-title-container .highlight-title {
    	color: var(--text-primary, #242424);
    	font-family: var(--family-title);
    	font-size: var(--size-3xl, 28px);
    	font-style: normal;
    	font-weight: 700;
    	line-height: var(--line-height-lg, 32px);
    	letter-spacing: -0.56px;

    	word-break: break-word;
    }

    .highlight-recommended {
    	color: var(--secondary-primary, #1946F6);
    	font-size: var(--size-xs, 12px);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-xs, 16px);
    	word-break: break-word;
    }

    .highlight-body p {
    	color: var(--text-primary, #242424);
    	font-size: var(--size-md, 16px);
    	line-height: var(--line-height-md, 24px);
    }

    .highlight-body .highlight-embed {
    	margin: 24px 0;
    }

    .highlight-embed .twitter-tweet-rendered iframe,
    .post-content .twitter-tweet-rendered iframe,
    .twitter-tweet-rendered iframe {
    	border-radius: 0;
    }

    html.dark-mode .highlight-embed .twitter-tweet-rendered iframe,
    html.dark-mode .twitter-tweet-rendered iframe {
    	filter: invert(1) brightness(1);
    }

    .highlight-body p img {
    	margin: 1.5rem 0;
    }

    .highlight-body strong {
    	font-weight: 600;
    }

    .highlight-block .highlight-body p a:not(.highlight-link, .su-button) {
    	color: var(--text-primary, #242424) !important;
    	font-size: var(--size-md, 16px);
    	font-style: normal;
    	font-weight: 400;
    	line-height: var(--line-height-md, 24px);
    	text-decoration-line: underline;
    	text-decoration-style: solid;
    	text-decoration-skip-ink: auto;
    	text-decoration-color: var(--primary-primary);
    	text-decoration-thickness: auto;
    	text-underline-offset: auto;
    	text-underline-position: from-font;
    }

    .highlight-block .highlight-body .su-button {
    	margin-bottom: 0 !important;
    }

    .post-content .highlight-body .highlight-link {
    	display: flex;
    	min-width: 164px;
    	max-width: fit-content;
    	height: 48px;
    	padding: 12px 32px;
    	margin-top: 24px;
    	justify-content: center;
    	align-items: center;
    	border-radius: 32px;
    	background: var(--primary-primary);
    	color: var(--compnents-buttons-text);
    	font-size: var(--size-md, 16px);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-md, 24px);
    	text-decoration: none;
    }

    .post-content .highlight-body .highlight-link:hover,
    .post-content .highlight-body .highlight-link:active,
    .post-content .highlight-body .highlight-link:focus {
    	background: var(--primary-hover);
    	text-decoration: none;
    	color: var(--text-contrast);
    }

    .post-content .highlight-body iframe {
    	width: 418px;
    	height: 272px;
    }

    /* highlight box article */
    /* ============quick links for sidebar======== */
    .cd-sidebar-links {
    	position: absolute;
    	top: 1rem;
    	top: 16px;
    	left: 1rem;
    	z-index: 1000;
    	display: flex;
    	flex-flow: column;
    	gap: 1rem;
    }

    .quick-links {
    	width: 48px;
    	padding: 24px 12px;
    	border-radius: 24px;
    	background: var(--surface-1, #fff);
    	box-shadow: 5px 5px 16px 0 rgba(0, 0, 0, 0.05);
    	transition: width 0.3s ease, padding 0.3s ease, border-radius 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
    	overflow: hidden;
    	position: relative;
    	top: 0;
    	left: 0;
    	border: 1px solid transparent;
    }

    /* body.admin-bar .quick-links {
        top: calc(148px + 32px);
    } */
    .cd-sidebar-links.scrolled {
    	position: fixed;
    	/* top: calc(42px + 16px); */
    	top: calc(132px + 16px);
    }

    /* Expanded sidebar */
    .quick-links:hover,
    .quick-links:active,
    .quick-links:focus {
    	width: fit-content;
    	padding: 24px;
    	border-radius: 32px;
    	border: 1px solid var(--additional-divider, #e3e3e3);
    	background: var(--surface-4);
    	box-shadow: 5px 5px 16px 0 rgba(0, 0, 0, 0.15);
    }

    /* List style */
    .quick-links:not(.toc-link) ul {
    	display: flex;
    	flex-direction: column;
    	padding: 0;
    	margin: 0;
    	list-style: none;
    }

    /* Individual list items */
    .quick-links:not(.toc-link) ul li {
    	margin-bottom: 16px;
    	padding-bottom: 16px;
    	border-bottom: 1px solid var(--surface-3);
    	transition: border-color 0.3s ease;
    }

    .quick-links:not(.toc-link) ul li:last-child {
    	border-bottom: none;
    	margin-bottom: 0;
    	padding-bottom: 0;
    }

    .quick-links:not(.toc-link):hover ul li,
    .quick-links:active ul li,
    .quick-links:focus ul li {
    	border-bottom-color: var(--surface-1);
    }

    .quick-links:not(.toc-link) ul li:hover,
    .quick-links:not(.toc-link) ul li:active,
    .quick-links:not(.toc-link) ul li:focus {
    	border-bottom-color: var(--primary-primary);
    }

    .quick-links:not(.toc-link) ul li a {
    	display: flex;
    	align-items: center;
    	gap: 12px;
    	cursor: pointer;
    	text-decoration: none;
    	color: var(--text-primary);
    	transition: color 0.3s ease;
    }

    .quick-links:not(.toc-link) ul li img {
    	width: 24px;
    	height: 24px;
    	flex-shrink: 0;
    }

    .quick-links:not(.toc-link) ul li span {
    	flex: 1;
    	opacity: 0;
    	transform: translateX(-10px);
    	transition: opacity 0.3s ease, transform 0.3s ease;
    	font-family: var(--family-body);
    	font-size: var(--size-md);
    	font-weight: 600;
    	line-height: var(--line-height-md);
    	display: inline-block;
    	align-items: center;
    	gap: 8px;
    	/* text-transform: capitalize; */
    	white-space: nowrap;
    	text-overflow: ellipsis;
    	visibility: hidden;
    }

    .quick-links-cta {
    	display: flex;
    	align-items: center;
    }

    .quick-links:not(.toc-link) ul li .icon-text img {
    	width: 20px;
    	height: 20px;
    }

    /* Show text on hover */
    .quick-links:not(.toc-link):hover ul li span,
    .quick-links:not(.toc-link):active ul li span,
    .quick-links:not(.toc-link):focus ul li span {
    	opacity: 1;
    	transform: translateX(0);
    	visibility: visible;
    }

    .copy {
    	position: relative;
    }

    .copy-toast {
    	position: absolute;
    	top: calc(100% - 10px);
    	left: 50%;
    	transform: translateX(-50%);
    	background: var(--icons-active);
    	color: var(--text-contrast);
    	padding: 4px 8px;
    	line-height: var(--line-height-xs);
    	border-radius: 4px;
    	font-size: var(--size-xs);
    	font-weight: 500;
    	white-space: nowrap;
    	opacity: 0;
    	pointer-events: none;
    	transition: opacity 0.3s ease, transform 0.3s ease;
    	z-index: 10;
    }

    /* arrow below tooltip */
    .copy-toast::after {
    	content: "";
    	position: absolute;
    	top: -12px;
    	left: 50%;
    	transform: translateX(-50%);
    	border-width: 6px;
    	border-style: solid;
    	border-color: transparent transparent var(--icons-active) transparent;
    }

    /* visible state */
    .copy-toast.shown {
    	opacity: 1;
    	transform: translateX(-50%) translateY(-5px);
    }

    /* =====dark-mode article css */
    html.dark-mode .quick-links {
    	background: var(--surface-1, #171515);
    	box-shadow: 5px 5px 16px 0 rgba(255, 255, 255, 0.05);
    }

    html.dark-mode .quick-links:hover,
    html.dark-mode .quick-links:active html.dark-mode .quick-links:focus {
    	border: 1px solid var(--secondary-light, #202b58);
    	background: var(--surface-4);
    	box-shadow: 5px 5px 16px 0 rgba(0, 0, 0, 0.15);
    }

    html.dark-mode .quick-links ul li img {
    	filter: grayscale(1);
    	transition: filter 0.3s ease;
    }

    html.dark-mode .quick-links ul li:hover img,
    html.dark-mode .quick-links ul li:active img,
    html.dark-mode .quick-links ul li:focus img {
    	filter: brightness(0) saturate(100%) invert(77%) sepia(62%) saturate(2564%) hue-rotate(8deg) brightness(104%) contrast(96%);
    }

    html.dark-mode .quick-links ul li .icon-text img {
    	filter: none;
    }

    /* toc sidebar desktop version */
    .cd-sidebar-links .toc-link.quick-links .toc-desktop-icon {
    	width: 24px;
    	height: 24px;
    }

    html.dark-mode .cd-sidebar-links .toc-link.quick-links .toc-desktop-icon {
    	filter: brightness(3);
    }

    .cd-sidebar-links .toc-link.quick-links {
    	line-height: 0;
    }

    .cd-sidebar-links div#ez-toc-container {
    	background: transparent;
    	border: 0;
    	border-radius: 0;
    	padding: 0;
    	box-shadow: none;
    	transition: all 0.3s ease;
    	margin-bottom: 0;
    }

    .cryptodnes-toc-container .cryptodnes-toc-header {
    	position: relative;
    	display: flex;
    	align-items: center;
    	color: var(--text-primary, #242424);
    	text-align: right;
    	font-family: var(--family-body);
    	font-size: var(--size-md);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-md);
    	margin-bottom: 1rem;
    	padding-bottom: 1rem;
    	border-bottom: 1px solid var(--surface-3, #E5E5E5);
    	cursor: auto;
    }

    .cryptodnes-toc-icon {
    	margin-right: 8px;
    	display: flex;
    	justify-content: center;
    	align-items: center;
    }

    .cryptodnes-toc-icon img {
    	width: 24px;
    	height: 24px;
    }

    .dark-mode .cryptodnes-toc-icon img {
    	filter: brightness(3.5);
    }

    .cd-sidebar-links .toc-link .cryptodnes-toc-container {
    	display: none;
    }

    .cd-sidebar-links .toc-link.quick-links:hover {
    	cursor: pointer;
    }

    .cd-sidebar-links .toc-link.quick-links:hover .cryptodnes-toc-container {
    	display: block;
    }

    .cd-sidebar-links .cd-toc nav {
    	margin-bottom: 1rem;
    }

    /* toc plugin css */
    .cd-toc-con {
    	margin-bottom: 1rem;
    }

    .ez-toc .ez-toc-widget-container .widget-title .ez-toc-btn {
    	width: 24px;
    	height: 24px;
    	margin-left: auto;
    	background-image: url(../../images/chevron-up.svg);
    	background-size: 24px;
    	background-position: center;
    	transition: transform 0.3s ease;
    	cursor: pointer;
    	background-color: transparent;
    	border: 0;
    	box-shadow: none;
    	transform: rotate(180deg);
    	outline: 0;
    	border-radius: 0;
    }

    .ez-toc .ez-toc-widget-container .widget-title .ez-toc-toggle span {
    	display: none;
    }

    .ez-toc .ez-toc-widget-container.toc_close .widget-title .ez-toc-btn {
    	transform: rotate(0deg);
    }

    html.dark-mode .ez-toc .ez-toc-widget-container .widget-title .ez-toc-toggle {
    	filter: brightness(3);
    }

    /* Base TOC styling */
    .cd-toc-con {
    	padding-left: 0;
    	max-height: 150px;
    	transition: max-height 0.3s ease;
    	overflow: hidden;
    	scroll-behavior: smooth;
    	scroll-snap-type: y proximity;
    	height: auto;
    }

    /* .cryptodnes-toc-container.has-button .cd-toc-con {
        height: 150px;
    } */

    /* When expanded (after clicking Show More) */
    .cryptodnes-toc-container.expanded .cd-toc-con {
    	max-height: 350px;
    	overflow-y: auto;
    	scrollbar-width: thin;
    	scroll-snap-type: y proximity;
    	cursor: pointer;
    }

    .cd-toc-con ul {
    	list-style: none;
    	margin: 0;
    	padding: 0 0 0 16px;
    	position: relative;
    	display: flex;
    	flex-flow: column;
    	gap: 12px;
    }

    ul.cryptodnes-toc-list::before {
    	display: inline-block;
    	content: '';
    	position: absolute;
    	top: 12px;
    	left: 3.5px;
    	width: 10px;
    	height: calc(100% - 24px);
    	border-left: 1px solid var(--secondary-light, #E8ECFC);
    }

    ul.cryptodnes-toc-list ul:before {
    	display: none;
    }

    ul.cryptodnes-toc-list li {
    	border-bottom: 0;
    }

    ul.cryptodnes-toc-list li ul {
    	margin: 6px 0;
    	padding: 0 0 0 16px;
    	position: relative;
    }

    ul.cryptodnes-toc-list ul li::before {
    	display: none;
    }


    /* Each TOC li */
    ul.cryptodnes-toc-list li {
    	position: relative;
    	line-height: 20px;
    	font-size: 100%;
    }

    /* Bullet for each li */
    ul.cryptodnes-toc-list li::after {
    	content: '';
    	position: absolute;
    	left: -16px;
    	top: 6px;
    	width: 8px;
    	height: 8px;
    	line-height: 8px;
    	border-radius: 8px;
    	background: var(--secondary-light, #E8ECFC);
    	border: 2px solid var(--secondary-light);
    	z-index: 2;
    	transition: all 0.3s ease;
    }


    ul.cryptodnes-toc-list li:not(:first-child, :last-child)::after {
    	top: 6px;
    }

    ul.cryptodnes-toc-list li:last-child::after {
    	top: 6px;
    	bottom: auto;
    }

    ul.cryptodnes-toc-list li::before {
    	display: inline-block;
    	content: '';
    	position: absolute;
    	left: -12.5px;
    	bottom: -18px;
    	height: calc(100% + 18px);
    	width: 10px;
    	z-index: 1;
    }

    ul.cryptodnes-toc-list li:first-of-type:before {
    	height: calc(100% + 12px);
    }

    ul.cryptodnes-toc-list>li:last-of-type:before {
    	height: calc(100% + 0px);
    	bottom: 0;
    	opacity: 0;
    }

    ul.cryptodnes-toc-list li.current::before {
    	border-left: 1px solid var(--secondary-primary);
    }

    ul.cryptodnes-toc-list li.previous-active::before {
    	border-left: 1px solid var(--secondary-primary);
    }

    ul.cryptodnes-toc-list>li:first-child.active::after,
    ul.cryptodnes-toc-list li.previous-active::after,
    ul.cryptodnes-toc-list li.current::after {
    	background: var(--secondary-primary);
    	border: 2px solid var(--secondary-primary);
    }

    ul.cryptodnes-toc-list li.has-children.current ul li::after {
    	background: var(--secondary-primary);
    	border: 2px solid var(--secondary-primary);
    }

    ul.cryptodnes-toc-list li .cryptodnes-toc-text {
    	color: var(--text-secondary, rgba(66, 66, 66, 0.80));
    	text-align: start;
    	font-family: var(--family-body);
    	font-size: var(--size-sm, 14px);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-sm, 20px);
    	/* text-transform: capitalize; */
    	padding: 0;
    	display: inline-block;
    }

    ul.cryptodnes-toc-list li.has-children>.cryptodnes-toc-text {
    	padding-right: 25px;
    }

    ul.cryptodnes-toc-list li.active>.cryptodnes-toc-text,
    ul.cryptodnes-toc-list li.current>.cryptodnes-toc-text {
    	color: var(--text-primary);
    }

    ul.cryptodnes-toc-list li.has-children>.cryptodnes-toc-list {
    	display: none;
    }

    ul.cryptodnes-toc-list li.has-children.child-active>.cryptodnes-toc-list {
    	display: flex;
    }

    ul.cryptodnes-toc-list li .cryptodnes-toc-text:hover {
    	cursor: pointer;
    	color: var(--text-primary);
    }

    ul.cryptodnes-toc-list li:not(:first-child, :last-child) {
    	padding: 0 0;
    }

    ul.cryptodnes-toc-list li:first-child {
    	padding-top: 0;
    	padding-left: 0;
    	padding-bottom: 0;
    }

    ul.cryptodnes-toc-list li:last-child {
    	padding-bottom: 0;
    	padding-left: 0;
    	padding-top: 0px;
    }

    /* Arrow toggle for nested lists */
    ul.cryptodnes-toc-list li.has-children .cryptodnes-toc-text>.toc-arrow {
    	cursor: pointer;
    	margin-left: 3px;
    	display: flex;
    	justify-content: center;
    	align-items: center;
    	width: 25px;
    	height: 20px;
    	border-left: 1px solid var(--surface-3, #E5E5E5);
    	position: absolute;
    	right: 0;
    	top: 0;
    	transition: transform 0.2s ease;
    }

    ul.cryptodnes-toc-list li.has-children .cryptodnes-toc-text>.toc-arrow::before {
    	content: '';
    	position: absolute;
    	right: 0;
    	width: 16px;
    	height: 16px;
    	background: url("../images/chevron-down.svg") no-repeat center;
    	background-size: 16px;
    	transition: transform 0.2s ease;
    	margin: auto;
    }

    /*  Only rotate the clicked arrow */
    ul.cryptodnes-toc-list li.has-children.rotated .cryptodnes-toc-text>.toc-arrow::before {
    	transform: rotate(180deg);
    }


    .cryptodnes-toc-show-more,
    .mob-cryptodnes-toc-show-more {
    	text-decoration: none;
    	color: var(--text-primary);
    	font-family: var(--family-body);
    	font-size: var(--size-xs);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-xs);
    	padding: 8px 4px;
    	text-align: center;
    	border-bottom: 0;
    	/* text-transform: capitalize; */
    	box-shadow: inset 0 -2px 0 0 var(--secondary-primary);
    	cursor: pointer;
    	background: transparent;
    	border: 0;
    	display: none;
    }

    .mob-cryptodnes-toc-show-more:hover,
    .mob-cryptodnes-toc-show-more:active,
    .mob-cryptodnes-toc-show-more:focus,
    .cryptodnes-toc-show-more:hover,
    .cryptodnes-toc-show-more:active,
    .cryptodnes-toc-show-more:focus {
    	color: var(--primary-hover);
    }


    /* toc plugin css ends */
    .posts-author-choise-section .common-news-head .heading-title {
    	margin-bottom: 0;
    }

    .author-all-guides {
    	margin: 24px 0;
    }

    .author-all-guides .common-news-head .heading-title {
    	margin-bottom: 0;
    	padding: 4px 0;
    }

    .author-choice-list.posts-grid .posts-grid-right .common-post-list {
    	padding: 0;
    	background-color: transparent;
    	gap: 20px;
    }

    .post-block {
    	border-radius: 16px;
    	background: var(--surface-2);
    	height: 100%;
    	display: flex;
    	flex-flow: column;
    }

    .post-block figure {
    	line-height: 0;
    	overflow: hidden;
    	border-radius: 16px;
    }

    .post-block figure img {
    	border-radius: 16px;
    	width: 100%;
    	height: 274px;
    	object-fit: cover;
    }

    .post-block-content {
    	padding: 16px 24px;
    	height: calc(100% - 274px);
    	flex: 1;
    	display: flex;
    	flex-flow: column;
    }

    .post-block-content .post-block-title {
    	margin-bottom: 16px;
    }

    .post-block-title a {
    	display: -webkit-box;
    	-webkit-box-orient: vertical;
    	-webkit-line-clamp: 3;
    	overflow: hidden;
    	color: var(--text-primary);
    	text-overflow: ellipsis;
    	font-style: normal;
    	font-weight: 700;
    	line-height: 122%;

    }

    .post-block-title a:active,
    .post-block-title a:focus,
    .post-block-title a:hover {
    	text-decoration: none;
    }

    .guide-meta {
    	margin-top: auto;
    	display: flex;
    	justify-content: space-between;
    	align-items: center;
    	flex-wrap: wrap;
    	gap: 8px;
    }

    .reading-time {
    	overflow: hidden;
    	color: var(--text-secondary, rgba(66, 66, 66, 0.80));
    	text-align: right;
    	text-overflow: ellipsis;
    	display: -webkit-box;
    	-webkit-box-orient: vertical;
    	-webkit-line-clamp: 3;
    	font-family: var(--family-body);
    	font-size: var(--size-xs);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-xs);
    }

    .reading-time::before {
    	content: "";
    	display: inline-block;
    	width: 24px;
    	height: 24px;
    	background-image: url('../images/timer-clock.svg');
    	background-repeat: no-repeat;
    	background-position: center;
    	background-size: contain;
    	vertical-align: -6px;
    	margin-right: 4px;
    }

    .common-sidebar .widget.redes-widget {
    	margin: 0 0 24px 0;
    }

    /* guide bm plugin css */
    .cbm-presale-toplist__offer-launched br,
    .cbm-presale-toplist__offer-meta br {
    	display: none;
    }

    .content-area .cbm-presale-toplist__offer-info p {
    	margin-top: 0;
    }

    .content-area .cbm-presale-toplist__offer-info p .cbm-presale-toplist__offer-cta-button {
    	text-decoration: none;
    	text-align: center;
    	word-wrap: normal;
    	color: var(--compnents-buttons-text, #242424);
    	font-family: var(--family-body);
    	font-size: var(--size-xs, 12px);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-xs, 16px);
    }

    .content-area .cbm-presale-toplist__offer-info p .cbm-presale-toplist__offer-cta-button:hover,
    .content-area .cbm-presale-toplist__offer-info p .cbm-presale-toplist__offer-cta-button:active,
    .content-area .cbm-presale-toplist__offer-info p .cbm-presale-toplist__offer-cta-button:focus {
    	text-decoration: none;
    	color: #242424;
    	background: #fdf6d8;
    }

    /* ============================
    Common news articles
    =============================== */
    /* editorr tabs secn css */
    .editor-picks .common-news-head {
    	margin-bottom: 16px;
    }

    .common-news-secn a.show-more-link,
    .editor-picks .show-more-link {
    	display: none;
    }

    /* editor tabs secn css  */

    /*======================
    comon news list secn css
    =========== */

    /*-------------single coin details page css started----------- */
    .single-coin-title {
    	display: flex;
    	align-items: center;
    	flex-wrap: wrap;
    	margin-bottom: 1rem;
    }

    .single-coin-title .coin-icon {
    	width: 40px;
    	height: 40px;
    	margin-right: 8px;
    }

    .single-coin-title h1 {
    	margin-bottom: 0;
    	color: var(--text-primary);
    }

    .single-coin-title .single-coin-symbol {
    	color: var(--text-secondary, rgba(66, 66, 66, 0.80));
    	font-size: var(--size-sm);
    	font-style: normal;
    	font-weight: 400;
    	line-height: var(--line-height-sm);
    	display: flex;
    	justify-content: center;
    	align-items: flex-end;
    	margin: auto 0 4px 4px;
    }

    .crypto-archive-sub-content .sub-content-text span {
    	color: var(--secondary-primary, #1946F6);
    }

    .cd-single-coin-wrapper .right-content-box {
    	border-radius: 16px;
    	background: var(--primary-light, #FDF6D8);
    	border: 0;
    }

    .current-price-box {
    	display: grid;
    	grid-template-columns: 1fr;
    	gap: 1rem;
    	position: relative;
    }

    .current-price-box .coin-change {
    	border-radius: 16px;
    	position: absolute;
    	right: 0;
    	top: 0;

    }

    .current-price-box .coin-change:not(.up, .down) {
    	background: var(--surface-1, #FFF);
    	color: var(--text-primary);
    }

    .current-price-box .coin-change.up,
    .current-price-box .coin-change.down {
    	background: var(--surface-1, #FFF);
    }

    .coin-price-value {
    	display: flex;
    	flex-flow: column;
    	gap: 8px;
    	word-break: break-word;
    }

    .coin-price-value span {
    	color: var(--text-secondary, rgba(66, 66, 66, 0.80));
    	font-size: var(--size-sm);
    	font-style: normal;
    	font-weight: 400;
    	line-height: var(--line-height-sm);
    	display: block;
    	word-break: break-word;
    	padding-right: 25%;
    }

    .coin-price-value .current-price-value {
    	color: var(--text-primary);
    }

    .current-price-box .btn-buy-now {
    	display: flex;
    	padding: 8px 32px;
    	justify-content: center;
    	align-items: center;
    	align-self: stretch;
    	border-radius: 32px;
    	background: var(--primary-primary, #F6CA19);
    	color: var(--compnents-buttons-text, #242424);
    	font-size: var(--size-md);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-md);
    }

    .current-price-box .btn-buy-now:hover,
    .current-price-box .btn-buy-now:active,
    .current-price-box .btn-buy-now:focus {
    	background: var(--compnents-buttons-bg-hover);
    	color: var(--text-contrast);
    }

    .sidebar-coin-details,
    .coin-website-link,
    .coin-social-links-box {
    	margin-bottom: 1.5rem;
    }

    .coin-website-link,
    .coin-social-links-box {
    	border-radius: 16px;
    	background: var(--surface-2, #F5F5F5);
    	padding: 24px;
    }

    .coin-website-link a {
    	display: flex;
    	align-items: center;
    	gap: 8px;
    	color: var(--text-primary, #242424);
    	font-size: var(--size-md, 16px);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-md, 24px);
    	text-decoration: none;
    	overflow: hidden;
    }

    .coin-website-link a span {
    	min-width: 0;
    	color: var(--text-primary, #242424);
    	font-size: var(--size-md, 16px);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-md, 24px);
    	transition: all 0.3s ease;
    	flex: 1;
    	display: flex;
    	align-items: center;
    	gap: 8px;
    	word-break: break-all;
    	overflow-wrap: anywhere;
    	white-space: normal;
    }

    .coin-website-link a img {
    	flex-shrink: 0;
    	width: 24px;
    	height: 24px;
    }

    .coin-website-link a:hover span+img,
    .coin-website-link a:active span+img {
    	filter: brightness(0) saturate(100%) invert(79%) sepia(66%) saturate(1781%) hue-rotate(2deg) brightness(104%) contrast(101%);
    }

    .coin-website-link a:hover span,
    .coin-website-link a:active span {
    	color: var(--text-primary);
    	text-decoration: underline;
    	text-decoration-line: underline;
    	text-decoration-style: solid;
    	text-decoration-color: var(--primary-primary, #F6CA19);
    	text-decoration-thickness: 1px;
    	text-underline-offset: 3px;
    	/* Only the WebKit properties that actually exist */
    	-webkit-text-decoration-line: underline;
    	-webkit-text-decoration-color: var(--primary-primary, #F6CA19);
    	-webkit-text-decoration-style: solid;
    }

    html.dark-mode .coin-website-link a span img {
    	filter: brightness(3.5);
    }

    .coin-details-list li:not(:last-child) {
    	margin-bottom: 1rem;
    	padding-bottom: 1rem;
    	position: relative;
    }

    .coin-details-list li:not(:last-child)::after {
    	background: var(--additional-divider, #E3E3E3);
    	position: absolute;
    	bottom: 0;
    	left: 0;
    	content: '';
    	width: calc(100% - 2rem);
    	height: 1px;
    }

    .coin-details-list-col {
    	display: grid;
    	grid-template-columns: 1fr auto;
    	gap: 0.5rem;
    	align-items: start;
    }

    .coin-details-list-col .coin-list-title {
    	display: flex;
    	flex-flow: column;
    	word-break: break-word;
    	gap: 4px;
    }

    .coin-list-title .small-title {
    	color: var(--text-secondary, rgba(66, 66, 66, 0.80));
    	font-size: var(--size-sm);
    	font-style: normal;
    	font-weight: 400;
    	line-height: var(--line-height-sm);
    }

    .coin-details-list .coin-list-price {
    	color: var(--text-primary, #242424);
    	font-size: var(--size-md, 16px);
    	font-style: normal;
    	font-weight: 700;
    	line-height: 150%;
    }

    .dark-mode .ccpw-container.chart {
    	background-color: #fff;
    }

    .dark-mode .ccpw-container.chart * {
    	color: #242424 !important;
    }

    /*coin-social-links-box */
    .coin-social-links-list {
    	display: grid;
    	grid-template-columns: minmax(160px, 1fr) auto;
    	gap: 8px;
    	align-items: center;
    }

    .coin-social-links-list span {
    	color: var(--text-primary);
    	font-size: var(--size-md);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-sm);
    	/* text-transform: capitalize; */
    	max-width: 100%;
    	word-wrap: break-word;
    	white-space: normal;
    	overflow-wrap: anywhere;
    }

    .coin-social-links-list .social-link-list {
    	display: flex;
    	flex-wrap: wrap;
    	align-items: center;
    	gap: 1rem;
    }

    .coin-social-links-list .social-link-list a {
    	display: flex;
    	justify-content: center;
    	align-items: center;
    	text-decoration: none;
    	transition: all 0.3s ease;
    }

    .coin-social-links-list .social-link-list a i {
    	font-size: 2rem;
    	transition: all 0.3s ease;
    	color: var(--icons-active);
    }

    .coin-social-links-list .social-link-list a i:hover,
    .coin-social-links-list .social-link-list a i:active,
    .coin-social-links-list .social-link-list a i:focus {
    	color: var(--primary-primary);
    }

    .single-page {
    	padding-top: 1rem;
    }

    body .alphabetical-links-list .api-wrapper {
    	overflow: hidden;
    	border-radius: 16px;
    	border: 1px solid var(--secondary-light);
    }

    body .alphabetical-links-list .api-wrapper .api-toggle {
    	background: var(--surface-2);
    	color: var(--text-primary);
    }

    .dark-mode .alphabetical-links-list .api-wrapper .api-toggle .api-caret {
    	filter: brightness(0) invert(0.6);
    }


    .cryptocoins-table table .coin-name .coin-link:hover span.coin-symbol,
    .cryptocoins-table table .coin-name .coin-link:active span.coin-symbol,
    .cryptocoins-table table .coin-name .coin-link:focus span.coin-symbol {
    	text-decoration-line: underline;
    	text-decoration-style: solid;
    	text-decoration-skip-ink: auto;
    	text-decoration-color: var(--primary-primary, #F6CA19);
    	text-decoration-thickness: auto;
    	text-underline-offset: auto;
    	text-underline-position: from-font;
    }


    /* toc for page content part */
    body #ez-toc-container {
    	padding: 24px;
    	border: 1px solid var(--secondary-light);
    	background: var(--surface-5);
    	box-shadow: 5px 5px 16px 0 rgba(0, 0, 0, 0.05);
    	position: relative;
    	width: 100%;
    	border-radius: 12px;
    	margin-bottom: 1.5rem;
    }

    body #ez-toc-container .ez-toc-title-container {
    	display: flex;
    	align-items: center;
    	justify-content: space-between;

    }

    body #ez-toc-container .ez-toc-title-container .ez-toc-title {
    	position: relative;
    	color: var(--text-primary, #242424);
    	text-align: start;
    	font-family: var(--family-body);
    	font-size: var(--size-md);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-md);
    	flex: 1 0 0;
    	padding-left: 2rem;
    }

    body #ez-toc-container .ez-toc-title-container .ez-toc-title::before {
    	--size: 24px;
    	position: absolute;
    	left: 0;
    	content: '';
    	top: -2px;
    	width: var(--size);
    	height: var(--size);
    	background: url("../images/toc-interface.svg") no-repeat;
    	background-size: var(--size);
    	background-position: center;

    }

    body #ez-toc-container .ez-toc-title-container p {
    	flex: 0 0 auto;
    }

    body #ez-toc-container .ez-toc-title-container span.ez-toc-title-toggle a {
    	padding: 0;
    }

    body #ez-toc-container .ez-toc-title-container span.ez-toc-title-toggle a span.ez-toc-js-icon-con {
    	left: 0;
    	border: 0;
    	width: 24px;
    	height: 24px;
    	display: flex;
    	justify-content: center;
    	align-items: center;
    }

    body #ez-toc-container .ez-toc-title-container span.ez-toc-title-toggle a span.ez-toc-js-icon-con .ez-toc-icon-toggle-span svg {
    	display: none;
    }

    body #ez-toc-container .ez-toc-title-container span.ez-toc-title-toggle a span.ez-toc-js-icon-con .ez-toc-icon-toggle-span {
    	width: 24px;
    	height: 24px;
    	background-image: url("../images/chevron-up.svg");
    	background-size: 24px;
    	background-position: center;
    	background-repeat: no-repeat;
    	transition: transform 0.3s ease;
    	transform: rotate(180deg);
    	cursor: pointer;
    }

    body #ez-toc-container .ez-toc-title-container span.ez-toc-title-toggle a:hover span.ez-toc-js-icon-con .ez-toc-icon-toggle-span {
    	filter: invert(38%) sepia(82%) saturate(295%) brightness(89%) contrast(124%);
    }

    body #ez-toc-container.toc_close .ez-toc-title-container span.ez-toc-title-toggle a span.ez-toc-js-icon-con span.ez-toc-icon-toggle-span {
    	transform: rotate(0deg);
    }

    /* for nav list items css */
    body #ez-toc-container ul.ez-toc-list {
    	margin-top: 1rem;
    	padding-top: 1rem;
    	border-top: 1px solid var(--surface-3, #E5E5E5);
    }

    body #ez-toc-container ul.ez-toc-list li {
    	margin-bottom: 0.5rem;
    	padding-top: 0.5rem;
    	font-size: var(--size-sm);
    	font-style: normal;
    	line-height: var(--line-height-sm);
    }

    body #ez-toc-container ul.ez-toc-list li.ez-toc-page-1 {
    	padding-top: 0;
    }

    body #ez-toc-container ul.ez-toc-list li.ez-toc-page-1:last-child {
    	margin-bottom: 0;
    }

    body #ez-toc-container ul.ez-toc-list li a {
    	color: var(--text-secondary, rgba(66, 66, 66, 0.80));
    	text-align: start;
    	font-family: var(--family-body);
    	font-size: var(--size-sm);
    	font-style: normal;
    	font-weight: 600;
    	line-height: var(--line-height-sm);
    	/* text-transform: capitalize; */
    	padding: 0;
    	display: inline-block;
    }

    body #ez-toc-container ul.ez-toc-list li a:visited {
    	color: var(--text-primary);
    }

    body #ez-toc-container ul.ez-toc-list li a:hover {
    	color: var(--text-primary);
    }

    .dark-mode body #ez-toc-container .ez-toc-title-container .ez-toc-title::before,
    .dark-mode body #ez-toc-container .ez-toc-title-container span.ez-toc-title-toggle a span.ez-toc-js-icon-con span.ez-toc-icon-toggle-span {
    	filter: brightness(3);
    }

    .dark-mode body #ez-toc-container .ez-toc-title-container span.ez-toc-title-toggle a:hover span.ez-toc-js-icon-con .ez-toc-icon-toggle-span {
    	filter: invert(38%) sepia(82%) saturate(295%) brightness(89%) contrast(124%);
    }

    /* toc for page content part ends */
    /* css for bm plguin for guidepage */
    .toplist-cryptodnes__wrapper .toplist-cryptodnes__offers .toplist-cryptodnes__offer-logo-wrapper {
    	justify-content: flex-start;
    }

    body .toplist-cryptodnes__wrapper .toplist-cryptodnes__offer-key-features {
    	padding-left: 0;
    	margin: 0;
    }

    body .toplist-cryptodnes__offer-actions br {
    	display: none;
    }

    .dark-mode .toplist-cryptodnes__offer-title,
    .dark-mode body .toplist-cryptodnes__offer-key-features li {
    	color: #ffffff;
    }

    .dark-mode .toplist-cryptodnes__offer-brand {
    	color: rgba(255, 255, 255, 0.56);
    }

    .dark-mode .toplist-cryptodnes__offer-review-link,
    .dark-mode .toplist-cryptodnes__offer-review-link:hover {
    	color: #ffffff;
    }

    .dark-mode .toplist-cryptodnes__offer:after,
    .dark-mode .toplist-cryptodnes__offer:first-child:after {
    	background: #242424;
    }

    .dark-mode .toplist-cryptodnes__offer:first-child:before,
    .dark-mode .toplist-cryptodnes__offer:before {
    	color: #fff;
    	background: #202B58;
    }

    /* css for bm plguin for guidepage ends */


    /*------------ single coin details page css ends--------------- */
    /*======== for dark-mode ============*/
    html.dark-mode .reading-time::before {
    	background-image: url('../images/timer-clock-light.svg');
    }

    html.dark-mode .crypto-box-list ul li a::after {
    	background-image: url('../images/chevron-right-dark-mode.svg');
    }

    html.dark-mode .crypto-box-list ul li a:hover::after,
    html.dark-mode .crypto-box-list ul li a:active::after,
    html.dark-mode .crypto-box-list ul li a:focus::after {
    	background-image: url("../images/right-cheveron-hover.svg");
    }

    /* for cookie */
    .dark-mode #cookie-notice.cookie-notice-visible.cn-effect-fade {
    	background-color: var(--surface-2) !important;
    }

    .dark-mode .cookie-notice-visible .cn-text-container {
    	color: #fff;
    }

    /* for su-tabs shortcode for darkmode */
    .dark-mode .su-tabs,
    .dark-mode .su-tabs-panes .su-tabs-pane {
    	background: var(--surface-2);
    	color: var(--text-primary);
    }

    .dark-mode .su-tabs-nav span {
    	color: #6a6a6a;
    }

    .dark-mode .su-tabs-panes .su-tabs-pane p,
    .dark-mode .su-tabs-panes .su-tabs-pane strong,
    .dark-mode .su-tabs-panes .su-tabs-pane span {
    	color: #fff;
    }

    /* ============quick links for sidebar======== */


    .footer-navigation-link .widget_nav_menu ul>li.menu-item-has-children .sub-menu,
    .footer-navigation-link .widget_nav_menu ul>li.menu-item-has-children>a::after {
    	display: none !important;
    }


    /* brand table dark mode and light mode styling */
    body .campaign-compact-table__offers-wrapper .campaign-compact-table__offer-key-features ul {
    	padding: 0;
    }

    body .campaign-compact-table__offers-wrapper .campaign-compact-table__offer-key-features ul li {
    	margin-bottom: 0;
    	font-size: 14px;
    	line-height: 21px;
    }

    .dark-mode .campaign-compact-table__offers-wrapper .campaign-compact-table__offer-key-features ul li {
    	color: #242424;
    }

    .dark-mode .campaign-compact-table__offer p {
    	color: #242424;
    }

    .dark-mode .campaign-compact-table__show-more-btn {
    	color: #1946F6;
    	border: 1px solid #1946F6;
    }

    /* shortcode box css */
    .bg-light {
    	background: var(--surface-6, #f8f9fa);
    }

    .dark-mode .bg-light {
    	background: var(--surface-6, #242424);
    }

    body .read-more {
    	padding: 1rem;
    	border: 1px solid var(--additional-divider, #E3E3E3);
    	border-radius: 16px;
    	margin-top: 1.5rem;
    	margin-bottom: 1.5rem;
    }

    body .read-more h5 {
    	border-bottom: 1px solid var(--additional-divider, #E3E3E3);
    	margin-bottom: 1rem;
    	padding-bottom: 0.5rem;
    }

    .read-more .row {
    	display: flex;

    }

    .read-more .row .contentRight {
    	flex: 0 0 33.33333333%;
    	max-width: 33.33333333%;
    	padding-right: 8px;
    	line-height: 0;
    }

    .read-more .row .contentLeft {
    	flex: 0 0 66.66666667%;
    	max-width: 66.66666667%;
    	padding-left: 8px;
    }

    .contentRight .imgContainer {
    	line-height: 0;
    	display: flex;
    	justify-content: center;
    	align-items: center;
    }

    body .read-more a:hover .title {
    	text-decoration-line: underline;
    	text-decoration-style: solid;
    	text-decoration-color: var(--primary-primary, #F6CA19);
    	text-decoration-thickness: 1px;
    	text-underline-offset: 3px;

    }

    /* shortcode box css ends */
    /* su-accordion */
    body .su-accordion .su-spoiler .su-spoiler-title,
    body .su-accordion .su-spoiler-content {
    	color: var(--text-primary);
    }

    .dark-mode .su-accordion .su-spoiler .su-spoiler-title,
    .dark-mode .su-accordion .su-spoiler-content {
    	color: #fff;
    }

    body .su-spoiler-title:focus {
    	outline: 0;
    }

    /* css for su-box */
    body .su-box .su-box-content {
    	background-color: var(--surface-1, #fff);
    	color: var(--text-primary, #24242424);
    }

    .dark-mode table:not(.su-table table):not(.campaign-compact-table) tr th {
    	color: var(--text-primary);
    }
    p.excerpt-content {
        position: relative;
        display: block;
        padding-left: 24px;
        margin-bottom: 40px;
        font-size: var(--size-md);
        font-weight: 700;
        line-height: 1.78;
        letter-spacing: normal;
        text-align: left;
        color: #444;
    }
    p.excerpt-content::before {
        content: '';
        position: absolute;
        left: 0;
        top: 12px;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        display: block;
        background-color: #f6ca19;
    }
  	.post-content .about-cd-card{
    	margin-bottom: 20px;
    }
    .dark-mode .liveblog-entry-content *:not(.su-button) {
      color: #eaeaea;
    }
    .dark-mode .liveblog-entry-meta-authors,
    .dark-mode .liveblog-entry-meta,
    .dark-mode .liveblog-entry-aside * {
      color: #cccccc !important;
    }
    .dark-mode .liveblog-headline {
      color: #ffffff;
    }
    .dark-mode [class*="liveblog-entry"], .liveblog-editor-container {
        background-color: #242424;
    }
    .cryptodnes-list-section {
      padding: 1.5rem;
      border-radius: 16px;
      background: var(--surface-2, #F5F5F5);
      border: 0;
      margin: 0 0 2rem 0;
    }
    .cryptodnes-list-items ul {
        padding: 0;
        margin: 0;
        list-style: none;
    }
    .cryptodnes-list-section .cryptodnes-list-items ul li {
      padding: 2px 0 2px 32px !important;
      margin-bottom: 8px !important;
      color: var(--text-primary, #242424);
      font-size: var(--size-sm, 14px) !important;
      font-style: normal;
      font-weight: 600 !important;
      line-height: var(--line-height-sm, 20px) !important;
      list-style-type: none;
    }
    .cryptodnes-list-section.plus .cryptodnes-list-items ul li {
      background: url("../images/pros.svg");
      background-size: 24px;
      background-position: left center;
      background-repeat: no-repeat;
    }
    .cryptodnes-list-section.minus .cryptodnes-list-items ul li {
      background: url("../images/cons.svg");
      background-size: 24px;
      background-position: left center;
      background-repeat: no-repeat;
    }
    /* ============================
    Responsive Design (Mobile)
    =============================== */
    /*========= common media query for style================ */
    @media (min-width: 992px) {
    	body {
    		padding-top: 132px;
    	}

    	.single-post-row .post-content-area {
    		min-width: 0;
    	}

    	body.admin-bar {
    		padding-top: calc(132px - 32px);
    	}

    	.d-lg-none {
    		display: none !important;
    	}

    	.d-lg-block {
    		display: block !important;
    	}

    	.d-lg-flex {
    		display: flex !important;
    	}

    	.grid-col-lg-3 {
    		grid-template-columns: repeat(3, 1fr);
    	}

    	.grid-col-lg-4 {
    		grid-template-columns: repeat(4, 1fr);
    	}

    	.grid-col-lg-5 {
    		grid-template-columns: repeat(5, 1fr);
    	}

    	.grid-col-lg-6 {
    		grid-template-columns: repeat(6, 1fr);
    	}

    	.news-card .news-card-content {
    		padding: 12px 16px 16px;
    	}

    	.news-card.title-1-line .news-card-img img,
    	.post-item-card.title-1-line .post-item-thumb img {
    		height: auto;
    	}

    	.news-card.title-2-lines .news-card-img img,
    	.post-item-card.title-2-lines .post-item-thumb img {
    		height: 144px;
    	}

    	.news-card.title-3-lines .news-card-img img,
    	.post-item-card.title-3-lines .post-item-thumb img {
    		height: 124px;
    	}

    	/* for based on title line height */
    	.cd-post-time {
    		display: none;
    	}

    	/* tabs-layout fro cryptoshortcodes */
    	.tabs-layout {
    		display: none !important;
    	}

    	.archive-crypto-ladders.three-col-row {
    		display: flex !important;
    		row-gap: 1rem;
    	}

    	/* grid posts tabs secn */
    	.posts-grid-left {
    		grid-template-columns: repeat(2, 1fr);
    		gap: 30px 16px;
    	}

    	.author-choice-list.posts-grid .posts-grid-left {
    		gap: 24px 16px;
    	}

    	.posts-grid-left .post-item-card:first-of-type {
    		grid-column: span 2;
    		border-radius: 24px 24px 16px 16px;
    	}

    	.posts-grid-left .post-item-card:first-of-type .post-item-thumb {
    		border-radius: 24px;
    	}

    	.posts-grid-left .post-item-card:first-of-type .post-item-thumb img {
    		height: 328px;
    		border-radius: 24px;
    	}

    	.posts-grid-left .post-item-card:first-of-type .post-item-summary {
    		padding: 24px;
    	}

    	.posts-grid-left .post-item-card:first-of-type .post-item-title {
    		color: var(--text-primary);
    		text-overflow: ellipsis;
    		font-size: var(--size-3xl, 28px);
    		font-style: normal;
    		font-weight: 700;
    		line-height: var(--line-height-lg, 32px);
    		letter-spacing: -0.56px;

    	}

    	.posts-grid-left .post-item-card {
    		display: flex;
    		flex-flow: column;
    	}

    	.common-post-list .post-item-heading a {
    		min-height: 60px;
    	}

    	.common-news-grid {
    		display: grid;
    		grid-template-columns: repeat(3, 1fr);
    		gap: 24px 30px;
    	}

    	.how-to-steps {
    		margin: 2rem 0;
    		padding-right: 111px;
    	}

    	.how-to-step {
    		max-width: 85%;
    	}

    	/* --- FIXED CONNECTOR LINES --- */
    	.how-to-step::before {
    		content: '';
    		position: absolute;
    		left: calc(100% + 113px);
    		top: 0;
    		width: 1px;
    		height: 100%;
    		background: var(--secondary-light, #E8ECFC);
    	}

    	.how-to-step::after {
    		content: '';
    		position: absolute;
    		left: 100%;
    		top: 33px;
    		width: 113px;
    		height: 1px;
    		background: var(--secondary-light, #E8ECFC);
    		transform: translateY(-50%);
    		z-index: -1;
    	}

    	/* Connect lines seamlessly: only extend below except last */
    	.how-to-step:not(:last-child)::before {
    		height: calc(100% + 33px + 24px);
    	}

    	.how-to-step:first-child::before {
    		top: 33px;
    	}

    	/* Hide connector for last step */
    	.how-to-step:last-child::before {
    		display: none;
    	}

    	.mobile-widget-block {
    		display: none;
    	}

    		/* -------pros-cons tabs */
    	.pros-cons-tabs {
    		display: none;
    	}

    	

    	body.page-template-guide .post-conclusion+.author-box {
    		margin-bottom: 0;
    	}

    	/* common post articles */
    	/* Large left card */
    	.top-news-article .news-card:nth-of-type(1) {
    		grid-column: 1/9;
    		grid-row: 1/3;
    	}

    	.top-news-article .news-card:nth-of-type(2) {
    		grid-column: 9/13;
    		grid-row: 1/2;
    	}

    	.top-news-article .news-card:nth-of-type(3) {
    		grid-column: 9/13;
    		grid-row: 2/2;
    	}

    	/* Bottom row: 3 equal small cards */
    	.top-news-article .news-card:nth-of-type(4) {
    		grid-column: 1/5;
    		grid-row: 3/4;
    	}

    	.top-news-article .news-card:nth-of-type(5) {
    		grid-column: 5/9;
    		grid-row: 3/4;
    	}

    	.top-news-article .news-card:nth-of-type(6) {
    		grid-column: 9/13;
    		grid-row: 3/4;
    	}

    	.top-news-article .news-card:nth-of-type(1) .news-card-content {
    		padding: 24px 24px;
    	}

    	.common-post-articles .news-card:nth-of-type(1) .caption-title,
    	.top-news-article .news-card:nth-of-type(1) .caption-title {
    		font-size: var(--size-3xl, 28px);
    		font-weight: 700;
    		line-height: var(--line-height-lg, 32px);
    		letter-spacing: -0.56px;
    	}

    	.common-post-articles {
    		display: grid;
    		grid-template-columns: repeat(4, 1fr);
    		grid-template-rows: auto;
    		gap: 16px 30px;
    	}

    	.common-post-articles .news-card:nth-of-type(1) {
    		grid-column: span 2;
    		grid-row: span 2;
    	}

    	.common-post-articles .news-card:nth-of-type(1) .news-card-content {
    		padding: 24px;
    	}

    	.common-post-articles .news-card:nth-of-type(2),
    	.common-post-articles .news-card:nth-of-type(3),
    	.common-post-articles .news-card:nth-of-type(4) {
    		grid-column: span 1;
    		grid-row: span 1;
    		/* Normal cards */
    	}

    	.latest-news-list .news-title a {
    		min-height: 60px;
    	}

    	.common-post-articles .news-card:nth-of-type(1) .news-card-img img,
    	.top-news-article .news-card:nth-of-type(1) .news-card-img img {
    		height: 328px;
    	}

    	/* single coin page */
    	.single-coin-content-wrapper .flex-left-col .common-counter-article {
    		display: none;
    	}

    	.popular-guide-secn .common-news-head .secn-title {
    		padding-block-start: 8px;
    	}

    	.mobile-view {
    		display: none;
    	}

    	.dark-mode .campaign-compact-table__show-more-btn:hover {
    		color: #1C2642;
    		border: 1px solid #1C2642;
    	}

    }

    /* 992 ends */
    @media (min-width:1200px) {
    	.grid-col-xl-3 {
    		grid-template-columns: repeat(3, 1fr);
    	}

    	.grid-col-xl-4 {
    		grid-template-columns: repeat(4, 1fr);
    	}

    	.grid-col-xl-5 {
    		grid-template-columns: repeat(5, 1fr);
    	}

    	.grid-col-xl-6 {
    		grid-template-columns: repeat(6, 1fr);
    	}

    	.flex-row .flex-left-col {
    		width: calc(100% - 418px - 30px);
    		flex: 1 0 0;
    	}

    	/* .flex-row .flex-left-col {
            flex: 1; 
            min-width: 0; 
        } */
    	.pros-cons-wrapper, .cryptodnes-list-section {
    		max-width: 74.135%;
    	}

    	/* Ad widget (redes) — sticky */
    	body.single .common-sidebar .widget.redes-widget {
    		position: -webkit-sticky;
    		position: sticky;
    		top: calc(132px + 1rem);
    		z-index: 10;
    		transition: all 0.3s ease;
    	}

    }

    @media (min-width:1440px) {
    	.container {
    		max-width: var(--container);
    		padding-left: 0;
    		padding-right: 0;
    	}
		.cd-sidebar-links .toc-link.quick-links:hover .toc-desktop-icon {
    		display: none;
    	}

    	/* -------pros-cons tabs */
    	.pros-cons-tabs {
    		display: none;
    	}

    	/* toc quick links */
    	.cd-sidebar-links .toc-link.quick-links:hover,
    	.cd-sidebar-links .toc-link.quick-links:active,
    	.cd-sidebar-links .toc-link.quick-links:focus {
    		width: 263px;
    		border-radius: 32px;
    		padding: 24px;
    		border: 1px solid var(--secondary-light);
    		background: var(--surface-5);
    		box-shadow: 5px 5px 16px 0 rgba(0, 0, 0, 0.05);
    	}

    	.cryptodnes-toc-show-more {
    		display: inline-block;
    	}

    	.mob-cryptodnes-toc-show-more {
    		display: none
    	}
    }

    @media (max-width:1440px) {
		
    	.cd-sidebar-links .quick-links:not(.toc-link) {
    		display: none;
    	}
		.cd-sidebar-links .toc-link.quick-links {
    		display: none;
    	}

    	/* toc mobile version */
    	.cryptodnes-toc-container .cryptodnes-toc-header {
    		padding-right: 25px;
    	}

    	.cryptodnes-toc-show-more {
    		display: none;
    	}

    	.mob-cryptodnes-toc-show-more {
    		display: inline-block;
    	}
body #ez-toc-container {
    		padding: 1rem;
    	}

	}
    @media (max-width:991.98px) {

    	/* basic typography */
    	:root {
    		/* font and line height */
    		--size-xs: 12px;
    		--size-sm: 14px;
    		--size-md: 16px;
    		--size-lg: 18px;
    		--size-xl: 20px;
    		--size-2xl: 22px;
    		--size-3xl: 22px;
    		--size-4xl: 28px;
    		--size-5xl: 32px;
    		--size-6xl: 48px;
    		/* line-height */
    		--line-height-2xs: 12px;
    		--line-height-xs: 16px;
    		--line-height-sm: 18px;
    		--line-height-md: 20px;
    		--line-height-lg: 24px;
    		--line-height-xl: 28px;
    		--line-height-2xl: 40px;
    		--line-height-3xl: 48px;
    	}

    	/* --------------common page css------------ */

    	h1,
    	.h1,
    	.heading-4xl {
    		letter-spacing: -0.56px;
    	}

    	h2,
    	.h2,
    	h2.entry-title,
    	.heading-3xl {
    		letter-spacing: -0.44px;
    	}

    	h3,
    	.h3,
    	.heading-2xl {
    		letter-spacing: -0.22px;
    	}

    	body {
    		padding-top: 104px;
    	}

    	body.admin-bar {
    		padding-top: calc(104px - 46px);
    	}

    	.heading-title {
    		margin-bottom: 16px;
    	}

    	/* header rfm marquee */
    	.tickercontainer .rfm-marquee {
    		padding-bottom: 10px;
    		padding-top: 10px;
    	}

    	/* body .style-1-2 .tickercontainer {
            scrollbar-width: thin;
            -ms-overflow-style: auto;
        } */

    	body .style-1-2 .tickercontainer::-webkit-scrollbar {
    		display: block;
    		height: 6px;
    	}

    	body .style-1-2 .tickercontainer::-webkit-scrollbar-thumb {
    		background: rgba(0, 0, 0, 0.25);
    		border-radius: 4px;
    	}

    	body .style-1-2 .tickercontainer::-webkit-scrollbar-track {
    		background: transparent;
    	}

    	/* header rfm marquee */
    	/* home page css */
    	.news-card:first-of-type {
    		margin-bottom: 8px;
    	}

    	.news-card:not(:first-of-type) {
    		display: grid;
    		grid-template-columns: 120px 1fr;
    	}

    	.news-card:first-of-type .news-card-content {
    		padding: 16px;
    	}

    	.news-card:not(:first-of-type) .news-card-content {
    		padding: 12px;
    	}

    	.news-card-img img {
    		height: 84px;
    	}

    	.news-card:first-of-type .news-card-img img {
    		height: 176px;
    	}

    	.news-card .caption-title {
    		-webkit-line-clamp: 2;
    	}

    	.news-card:first-of-type .caption-title {
    		font-size: var(--size-3xl);
    		font-style: normal;
    		font-weight: 700;
    		line-height: var(--line-height-lg, 24px);
    		letter-spacing: -0.44px;

    	}

    	/* three box shortcodes css*/
    	.crypto-box-list ul li:not(:last-child) a {
    		border-bottom: 1px solid var(--secondary-light);
    	}

    	.crypto-box .show-more {
    		margin-top: auto;
    		text-align: start;
    		position: relative;
    		top: 0;
    	}

    	.common-news-head {
    		margin-bottom: 16px;
    		flex-wrap: wrap;
    		gap: 5px;
    	}

    	.related-articles .common-news-head {
    		margin-bottom: 24px;
    	}

    	.related-articles .common-news-head {
    		margin-bottom: 24px;
    	}

    	.related-articles .common-news-head .secn-title {
    		max-width: 75%;
    		padding: 8px 0;
    	}

    	.related-articles-slider.slick-slider {
    		margin: 0;
    	}

    	.related-articles-slider .slick-slide {
    		margin: 0 5px;
    	}

    	.related-post-card a {
    		flex-direction: row;
    	}

    	.related-post-card figure {
    		width: 120px;
    	}

    	.related-post-card figure img {
    		height: 84px;
    	}

    	.related-post-card .post-card-content {
    		padding: 12px 16px 12px 12px;
    		height: 100%;
    		width: calc(100% - 120px);
    	}

    	.post-card-content .post-card-title {
    		-webkit-line-clamp: 2;
    	}

    	h1.post-title {
    		margin-bottom: 24px;
    	}
		.guide-page-secn .post-thumbnail,
    	.content-area .post-thumbnail {
    		margin-bottom: 24px;
    	}

    	.content-area blockquote,
    	body .su-quote {
    		padding: 56px 16px 16px;
    		margin: 16px 0 24px;
    	}

    	.content-area blockquote::before,
    	body .su-quote::before {
    		top: 16px;
    		left: 16px;
    		width: 32px;
    		height: 32px;
    		background-size: contain;
    	}

    	/* three shortcodes tabs layout */
    	.tabs-layout {
    		display: block !important;
    	}

    	.archive-crypto-ladders.three-col-row {
    		display: none !important;
    	}

    	.crypto-tabs-wrapper .show-more {
    		margin-top: 1rem;
    	}

    	.tabs-layout .tab-container.cats-tab-con {
    		margin-bottom: 20px;
    	}

    	/* arhive post cryptocurrency */
    	.archive-header-wrapper {
    		flex-flow: column;
    		margin-bottom: 24px;
    		gap: 24px;
    	}

    	.left-content-box,
    	.right-content-box {
    		width: 100%;
    		flex: 1;
    	}

    	.left-content-box {
    		padding: 16px;
    	}

    	.right-content-box {
    		padding: 24px 16px;
    	}

    	/* .crypto-archive-sub-content .sub-content-text {
            max-height: 72px;
        } */
    	.crypto-tabs-area .heading-title {
    		display: none;
    	}

    	.single-archive-row {
    		margin: 24px 0;
    	}

    	.news-card.mobile-hidden {
    		display: none;
    	}

    	.flex-row {
    		flex-flow: column;
    		gap: 24px;
    	}

    	.cd-pagination .nav-links,
    	.cd-pagination ul.page-numbers {
    		gap: 0.25rem;
    	}

    	.cd-pagination .nav-links .cd-pagination-prev,
    	.cd-pagination .nav-links .cd-pagination-next {
    		--size: 1.75rem;
    	}

    	.cd-pagination ul.page-numbers li {
    		--size: 1.5rem;
    	}

    	/* author details page css */
    	.posts-grid {
    		grid-template-columns: 1fr;
    		gap: 16px;
    	}

    	.posts-grid-left .post-item-card:first-of-type {
    		display: grid;
    		grid-template-columns: 1fr;
    		grid-auto-flow: row;
    	}

    	.post-item-card {
    		display: grid;
    		grid-template-columns: 120px 1fr;
    		width: 100%;
    	}

    	.posts-grid-left .post-item-card:first-of-type .post-item-thumb {
    		border-radius: 16px;
    	}

    	.posts-grid-left .post-item-card:first-of-type .post-item-thumb img {
    		height: 176px;
    		border-radius: 16px;
    	}

    	.post-item-thumb img {
    		height: 84px;
    	}

    	.posts-grid-left .post-item-card:first-of-type .post-item-summary {
    		padding: 16px;
    	}

    	.posts-grid-left .post-item-card:first-of-type .post-item-title {
    		overflow: hidden;
    		text-overflow: ellipsis;
    		font-size: var(--size-3xl);
    		font-style: normal;
    		font-weight: 700;
    		line-height: var(--line-height-lg, 24px);
    		letter-spacing: -0.44px;

    	}

    	.post-item-card .post-item-title {
    		font-weight: 500;
    		-webkit-line-clamp: 2;
    	}

    	.post-item-card .post-item-summary {
    		padding: 12px 16px 12px 12px;
    		word-break: break-word;
    	}

    	.cd-post-time .post-date::after {
    		content: ",";
    		margin-left: 0px;
    		display: inline-block;
    	}

    	/* error page */
    	.about-secn-summary {
    		padding: 16px;
    		margin-bottom: 1rem;
    	}

    	.about-secn-summary p {
    		margin-bottom: 8px;
    	}

    	.mt-48 {
    		margin-top: 24px;
    	}

    	/* slick slider */
    	.slick-slider {
    		margin: 0 -16px 0 0;
    		scroll-snap-type: x mandatory;
    		-webkit-overflow-scrolling: touch;
    	}

    	.slick-slide {
    		margin-right: 10px;
    		margin-left: 10px;
    	}

    	.slick-slider .slick-arrow {
    		bottom: calc(100% + 16px);
    	}

    	.slick-slider .slick-arrow.slick-next {
    		right: 15px;
    		left: auto;
    	}

    	.slick-slider .slick-arrow.slick-prev {
    		right: 63px;
    	}

    	/* slick slider */
    	.flex-row .flex-left-col {
    		width: 100%;
    		flex: 1;
    	}

    	/* su-note */
    	body .su-note {
    		padding: 16px;
    		margin-bottom: 24px;
    		margin-top: 24px;
    	}

    	/* .crypto-archive-sub-content .sub-content-text {
            max-height: 64px;
        }

        .cd-archive-secn .crypto-archive-sub-content .sub-content-text {
            max-height: 72px;
        } */

    	.post-conclusion {
    		padding: 16px 16px 48px;
    		margin-top: 24px;
    	}

    	.post-conclusion h3 {
    		margin-bottom: 8px;
    	}

    	/* auhtor box css for mobile */
    	.author-box {
    		padding: 16px;
    		margin-bottom: 24px;
    		margin-top: 24px;
    	}

    	.author-box-grid {
    		grid-template-columns: 1fr;
    		grid-template-areas: " author-box-right" "author-box-left";
    		gap: 16px;
    	}

    	.author-box-left .author-role,
    	.author-box-left .author-display-name {
    		display: none;
    	}

    	.author-box-right {
    		display: grid;
    		grid-template-columns: 80px 1fr;
    		align-items: flex-start;
    	}

    	.author-box-right-info {
    		padding: 8px 0;
    		word-break: break-word;
    	}

    	.author-box-right-info .author-role,
    	.author-box-right-info .author-display-name {
    		display: block;
    	}

    	.author-articles-count {
    		display: flex;
    		flex-flow: row;
    		margin-bottom: 0;
    		gap: 8px;
    	}

    	.author-articles-count span {
    		order: 0;
    	}

    	.author-articles-count span::after {
    		content: ",";
    		margin-left: 0px;
    	}

    	.author-articles-count a {
    		margin-bottom: 0;
    		order: 1;
    	}

    	.author-display-name {
    		margin-bottom: 4px;
    	}

    	.author-avatar img {
    		width: 100%;
    		height: 80px;
    	}

    	.author-box-grid .author-social-profile {
    		margin-bottom: 16px;
    		margin-top: 0;
    		padding-top: 0;
    	}

    	.author-role {
    		margin-top: 0px;
    	}

    	/* author box ends for mobile */
    	/* post tags */
    	.post-tags {
    		margin: 24px 0;
    	}

    	/* howto step box */
    	.how-to-steps {
    		margin: 1.5rem 0;
    		padding-right: 0;
    	}

    	.how-to-step {
    		margin-bottom: 24px;
    		padding: 24px 16px;
    		max-width: 100%;
    	}

    	.how-to-step .step-number {
    		right: 0;
    		top: -17px;
    	}

    	.how-to-step .friendly-tip .tip-text.tooltip-content {
    		left: -16px;
    	}

    	/* for mobile view */
    	.mobile-widget-block {
    		display: flex;
    		justify-content: space-between;
    		align-items: flex-end;
    		margin-bottom: 24px;
    		position: relative;
    		padding-top: 4px;
    	}

    	.mobile-widget-block .article-details-box {
    		background: transparent;
    		padding: 0;
    		width: 100%;
    		flex: 1;
    	}

    	.mobile-widget-block .disclosure-wrapper {
    		position: absolute;
    		left: 0;
    		top: 0;
    	}

    	.mobile-widget-block .article-details-box .article-details-header {
    		justify-content: flex-end;
    		width: calc(100% - 110px);
    		margin-left: auto;
    		text-align: end;
    		color: var(--text-secondary);
    	}

    	.mobile-widget-block .article-details-box .article-details-header .collapse-icon {
    		margin-left: 0;
    	}

    	.mobile-widget-block .article-details-box .post-meta-info {
    		display: grid;
    		grid-template-columns: repeat(2, 1fr);
    		gap: 12px;
    	}

    	.mobile-widget-block .article-details-box .post-meta-info .last-updated-post {
    		grid-column: span 2;
    		padding-top: 12px;
    	}

    	.cd-additional-actions {
    		margin: 24px 0;
    		padding: 16px;
    	}

    	.additional-actions-box {
    		display: grid;
    		grid-template-columns: 1fr;
    		gap: 16px;
    		grid-auto-flow: row;
    	}

    	.cd-reaction-picker-list,
    	.cd-social-share-list {
    		gap: 8px 16px;
    	}

    	.cd-reaction-icon,
    	.cd-social-share-icon {
    		padding: 4px 12px;
    	}

    	.cd-reaction-icon img,
    	.cd-social-share-icon img {
    		width: 22px;
    		height: 24px;
    		object-fit: contain;
    	}

    	/* highlight box css */
    	.highlight-block {
    		margin: 1.5rem 0;
    		padding: 1.5rem 1rem;
    	}

    	.highlight-block .highlight-header {
    		align-items: self-start;
    		margin-bottom: 1rem;
    	}

    	.highlight-body p a:not(.highlight-link, .su-button) {
    		color: var(--primary-primary, #F6CA19) !important;
    	}

    	.highlight-body .highlight-embed .twitter-tweet {
    		width: 100% !important;
    		max-width: 100% !important;
    	}

    	.highlight-body .highlight-embed .twitter-tweet iframe {
    		width: 100% !important;
    	}

    	.post-content .highlight-body iframe {
    		width: 100%;
    		height: 226px;
    	}

    	.post-content .highlight-body .highlight-link {
    		max-width: 100%;
    		height: 48px;
    		padding: 14px 32px;
    		margin-top: 16px;
    		font-size: var(--size-md, 16px);
    		line-height: var(--line-height-md, 20px);
    	}

    	.highlight-body p img,
    	.highlight-body .highlight-embed {
    		margin: 1rem 0;
    	}

    	.highlight-embed .twitter-tweet-rendered iframe,
    	.post-content .twitter-tweet-rendered iframe {
    		width: 100% !important;
    	}

    	/* pros-cons tabs styling */
    	.pros-cons-wrapper, .cryptodnes-list-section {
    		padding: 1rem;
    	}

    	.pros-cons-tabs {
    		display: flex;
    		gap: 32px;
    		max-width: 100%;
    		justify-content: center;
    		align-items: center;
    		padding-bottom: 0px;
    		margin: 1rem 0;
    		scrollbar-width: none;
    		-ms-overflow-style: none;
    	}

    	.pros-cons-tabs br {
    		display: none;
    	}

    	.pros-cons-tabs button {
    		color: var(--text-secondary);
    		font-size: var(--size-lg);
    		font-style: normal;
    		font-weight: 600;
    		line-height: var(--line-height-lg);
    		cursor: pointer;
    		flex: 1;
    		width: 100%;
    		transition: all .3s ease-in-out;
    		border: 0;
    		text-align: center;
    		outline: 0;
    		background: transparent;
    	}

    	.pros-cons-tabs button.active,
    	.pros-cons-tabs button:hover {
    		color: var(--text-primary);
    		box-shadow: inset 0 -2px 0 0 var(--secondary-primary);
    	}

    	.layout-tabs .pros-cons-content .pros-list,
    	.layout-tabs .pros-cons-content .cons-list {
    		display: none;
    		transition: all 0.3s ease;
    	}

    	.layout-tabs .pros-cons-content .pros-list.active,
    	.layout-tabs .pros-cons-content .cons-list.active {
    		display: block;
    	}

    	.rounded-border-box {
    		padding: 1rem;
    	}

    	
    	.guide-meta {
    		margin-top: 4px;
    	}

    	.post-block-content {
    		padding: 16px 16px;
    	}

    	/* author guide slider */
    	.author-all-guides .author-guides.slick-slider {
    		margin: 0 -8px;
    	}

    	.author-all-guides .author-guides.slick-slider .slick-arrow.slick-prev {
    		right: 56px;
    	}

    	.author-all-guides .author-guides.slick-slider .slick-arrow.slick-next {
    		right: 8px;
    	}

    	.author-all-guides .author-guides.slick-slider .slick-slide {
    		margin-right: 8px;
    		margin-left: 8px;
    	}

    	.author-all-guides .author-guides.slick-slider .guide-meta {
    		margin-top: auto;
    	}

    	.author-all-guides .post-block-content {
    		padding: 16px 24px;
    	}

    	.author-choice-list.posts-grid .posts-grid-right .common-post-list {
    		gap: 16px;
    	}

    	.post-content .about-cd-card .follow-us .social-media-links {
    		padding: 0;
    		margin: 0;
    		list-style: none;
    	}

    	.post-content .about-cd-card .follow-us .social-media-links li {
    		padding: 0;
    		line-height: normal;
    		margin: 0;
    	}

    	body.page-template-guide .man_faq_sec {
    		margin-bottom: 0;
    	}

    	.post-content .widget.redes-widget {
    		margin: 1rem 0;
    	}

    	body.page-template-guide .post-content .disclaimer-card,
    	body.page-template-guide .post-content .about-cd-card {
    		margin-bottom: 1.5rem;
    	}

    	body.page-template-guide .post-conclusion,
    	body.page-template-guide .author-box {
    		display: none;
    	}

    	body.page-template-guide .common-sidebar {
    		display: flex;
    		flex-flow: column;
    	}

    	body.page-template-guide .common-sidebar .widget_cryptodnes_disclaimer,
    	body.page-template-guide .common-sidebar .widget_cryptodnes_article_details,
    	body.page-template-guide .common-sidebar .widget_cryptodnes_about_crypto,
    	body.page-template-guide .common-sidebar .widget_cryptodnes_disclousre {
    		display: none;
    	}

    	body.page-template-guide .common-sidebar .widget_cryptodnes_experts {
    		order: 2;
    		margin-bottom: 0;
    	}

    	body.page-template-guide .common-sidebar .widget_cryptodnes_follow_us {
    		order: 0;
    		margin-bottom: 24px;
    	}

    	body.page-template-guide .newsletter-secn {
    		display: none;
    	}

    	body.page-template-guide .related-articles {
    		margin-bottom: 0;
    	}

    	.related-articles .slick-slider .slick-arrow {
    		bottom: calc(100% + 24px);
    	}

    	.related-articles .slick-slider .slick-arrow.slick-next {
    		right: 0;

    	}

    	.related-articles .slick-slider .slick-arrow.slick-prev {
    		right: 48px;
    	}

    	.cbm-presale-toplist__offer .cbm-presale-toplist__offer-extra .cbm-presale-toplist__offer-name {
    		margin-top: 0px;
    		padding-left: 0;
    		text-align: center;
    	}

    	.highlight-block .highlight-body .su-button {
    		width: 100%;
    		min-width: 100%;
    	}

    	/* tabs comon css with articles */
    	.common-post-articles,
    	.top-news-article.article-grid-6 {
    		display: flex;
    		gap: 8px;
    		flex-flow: column;
    	}

    	.latest-news-list {
    		margin-bottom: 12px;
    		padding-bottom: 12px;
    	}

    	.editor-picks .show-more-link {
    		display: inline-block;
    		margin-top: 16px;
    	}

    	.common-news-secn .show-more-link {
    		margin-top: 16px;
    		display: inline-block !important;
    	}

    	.crypto-articles {
    		align-items: stretch;
    		padding-bottom: 16px;
    		gap: 24px;
    		flex-flow: column;
    	}

    	.crypto-box {
    		flex: 1;
    		width: 100%;
    	}

    	/* single coin page */
    	/* for hiding commn counter under 991 and display in left sidebar */
    	.single-coin-content-wrapper .flex-left-col .common-counter-article {
    		display: block;
    		margin-top: 84px;
    	}

    	.single-coin-sidebar .common-counter-article {
    		display: none;
    	}

    	.flex-row.single-coin-content-wrapper .flex-left-col {
    		order: 1;
    	}

    	.coin-details-list-col {
    		align-items: center;
    	}

    	.flex-row.single-coin-content-wrapper {
    		gap: 1rem;
    	}

    	.single-coin-sidebar .coin-website-link,
    	.single-coin-sidebar .coin-social-links-box {
    		padding: 1rem;
    	}

    	.single-coin-sidebar .coin-social-links-box {
    		margin-bottom: 0;
    	}

    	/* single coin page */
    	.about-cd-content ul.social-media-links {
    		gap: 1.5rem;
    	}

    	.guides-slider .post-block-content .post-block-title {
    		margin-bottom: 0;
    	}

    	/* for search result page */
    	body.search-results .common-sidebar {
    		display: flex;
    		flex-flow: column;
    		gap: 24px;
    	}

    	body.search-results .common-sidebar .widget_cryptodnes_follow_us {
    		order: 1;
    		margin-bottom: 0;
    	}

    	body.search-results .common-sidebar .widget_cryptodnes_experts .common-counter-article {
    		margin-top: 68px;
    	}

    	body.search-results .common-sidebar .widget_cryptodnes_about_crypto {
    		order: 0;
    		margin-bottom: 0;
    	}

    	body.search-results .common-sidebar .widget_cryptodnes_experts {
    		order: 2;
    		margin-bottom: 0;
    	}

    	.single-page .post-content .disclaimer-card {
    		margin-bottom: 1.5rem;
    	}

    	.cd-archive-secn .common-sidebar .widget_cryptodnes_experts {
    		margin-top: 92px;
    	}

    	.coin-website-link,
    	.coin-social-links-box {
    		padding: 16px;
    	}

    	.mobile-view {
    		display: block;
    	}

    	.desktop-view {
    		display: none;
    	}
    	.news-card .caption-title {
    		min-height: 38px;
    	}

    	.latest-news-list .news-title a {
    		min-height: 54px;
    	}
      .entry-content.content-area .collapse-box, .disclaimer-card, .about-cd-card{
        margin-bottom: 20px;
      }

    }

    /* -----991 ends----- */
    @media (min-width:768px) and (max-width:991.98px) {
    	.content-area .post-thumbnail img ,
    	.guide-page-secn .post-thumbnail img  {
    		height: auto;	
			max-height:400px;		
    	}

    	.common-news-grid {
    		display: grid;
    		grid-template-columns: repeat(2, 1fr);
    		gap: 16px;
    	}

    	.author-all-guides .common-news-head .heading-title {
    		max-width: 85%;
    	}
    }

    @media (min-width:992px) and (max-width:1199.98px) {
    	.flex-row .flex-left-col {
    		width: 100%;
    		flex: 1;
    	}

    	.cats-tab-con {
    		margin-left: 0px;
    		margin-right: auto;
    		width: 100%;
    		margin-bottom: 12px;
    		padding: 0 1rem 4px;
    	}
    }

    @media (max-width: 767.98px) {
    	.wp-caption {
    		width: 100% !important;
    	}

    	.secn-spacing {
    		margin-bottom: 24px;
    	}

    	.related-articles {
    		margin: 24px 0;
    	}

    	.content-area .post-thumbnail img,
		.guide-page-secn .post-thumbnail img 
		{
    		height: 186px;
    	}
    	.cats-tab-con {
    		margin-left: -16px;
    		margin-right: -16px;
    		width: calc(100% + 32px);
    		margin-bottom: 12px;
    		padding: 0 1rem 4px;
    	}

    	body .su-table {
    		margin: 1.5rem -1rem;
    		overflow-x: auto;
    		-webkit-overflow-scrolling: touch;
    		width: calc(100% + 2rem);
    		padding: 0 1rem;
    	}

    	body .su-table table {
    		min-width: 866px;    		
    	}

    	body .su-table thead th {
    		font-weight: 500 !important;
    	}

    	body .su-table tbody td {
    		white-space: nowrap;
    		line-height: var(--line-height-md, 20px) !important;
    	}

    	.cd-pagination .nav-links svg {
    		width: 16px;
    		height: 16px;
    	}

    	.author-all-guides .common-news-head .heading-title {
    		max-width: 75%;
    	}


    	table:not(.su-table table):not(.campaign-compact-table) {
    		border-collapse: collapse !important;
    		border-spacing: 0;
    		display: block;
    		overflow: auto;
    		margin-bottom: 1.5rem;
    	}

    }

    /* -------------767 ends------------ */
    @media (max-width:380px) {

    	.cd-pagination .nav-links,
    	.cd-pagination ul.page-numbers {
    		gap: 2px;
    	}

    }

    /* common media query for style ends */