/*-Single.php-*/
article{
    padding-top: 80px;
    padding-bottom: 80px;
}

.single-cont{
    max-width: 1100px;
    margin-right: auto;
    padding-bottom: 34px;
    margin-bottom: 34px;
    border-bottom: 1px solid #f3f3f3;
}

.d_trt {
  color: var(--brand-primary-color);
  font-weight: 500;
}

/*-short-headlines-*/
.short_card{
    position: relative;
    margin-bottom: 64px;
}
.sheadtitle{
    font-size: 20px;
    font-weight: 700;
}

.short_headlines{
    margin-top: 24px;
}

.short_headlines li {
    list-style-type: square !important;
    margin-left: 22px!important;
    padding-left: 6px!important;
    line-height: 1.4;
    margin-bottom: 11px;
}

.short_headlines li:last-child{
    margin-bottom: 0px;
}
/*-short-headlines-*/


.featured_image img,
.single_content figure{
    width: 100%!important;
    width: -moz-available;
    width: -webkit-fill-available!important;
    /*height: 820px;*/
    object-fit: cover;
}

/*-table-of-content-*/
.dtoc {
    width: 240px;
    position: sticky;
    top: 40px;
    bottom: 40px;
    max-height: calc(100vh - 80px); /* Ensure TOC doesn't exceed viewport */
    overflow-y: auto; /* Enable scrolling for long TOCs */
    overflow-x: hidden;
    scroll-behavior: smooth; /* Smooth scrolling for TOC container */
}

/* Custom scrollbar for TOC */
.dtoc::-webkit-scrollbar {
    width: 4px;
}

.dtoc::-webkit-scrollbar-track {
    background: transparent;
}

.dtoc::-webkit-scrollbar-thumb {
    background: var(--outline, #e0e0e0);
    border-radius: 2px;
    transition: background 0.3s ease;
}

.dtoc::-webkit-scrollbar-thumb:hover {
    background: var(--main, #007cba);
}

/* Override smooth scroll when stopping */
html.scroll-stopping {
    scroll-behavior: auto;
}

.dtoc p {
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 700;
    border-bottom: var(--outline);
    padding-bottom: 10px;
}

#toc-list {
    display: grid;
    grid-template-columns: 1fr;
    grid-row-gap: 12px;
    padding-top: 20px;
    padding-bottom: 20px;
    position: relative;
    --dot-position: 0px;
    --dot-opacity: 0;
}

/* Progress Indicator - Full vertical line using ::before */
#toc-list::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #f3f4f6;
    border-radius: 2px;
    z-index: 1;
}

/* Moving circle indicator using ::after */
#toc-list::after {
    content: '';
    position: absolute;
    left: -6px;
    top: var(--dot-position, 0px);
    width: 11px;
    height: 11px;
    background: hsl(4.72deg 72.36% 48.24%);
    border-radius: 50%;
    border: 2px solid white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    transition: top 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s ease;
    opacity: var(--dot-opacity, 0);
    z-index: 2;
    transform: translateY(-50%);
}

/* Base link styling */
#toc-list a {
    font-size: 15px;
    color: var(--d-text); 
    font-weight: 500;
    display: flex;
    line-height: 1.2;
    transition: color 0.3s, font-weight 0.3s, transform 0.2s ease;
    position: relative;
    padding-left: 20px;
    z-index: 3;
}

#toc-list a:hover {
    font-weight: 700;
    color: var(--main);
    transform: translateX(3px);
}

#toc-list a.active {
    font-weight: 700;
    color: var(--main);
    transform: translateX(5px);
}

/* Visual hierarchy for different heading levels */

/* H2 - Main sections (clean, no icon) */
#toc-list a.toc-h2 {
    font-size: 15px;
    padding-left: 15px;
    color: var(--d-text);
    position: relative;
}

/* H3 - Subsections */
#toc-list a.toc-h3 {
    font-size: 14px;
    padding-left: 30px;
    color: var(--d-text);
    opacity: 0.9;
    position: relative;
}

#toc-list a.toc-h3::before {
    content: '▶';
    position: absolute;
    left: 20px;
    color: var(--main);
    font-size: 8px;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0.7;
}

/* H4 - Sub-subsections */
#toc-list a.toc-h4 {
    font-size: 14px;
    padding-left: 45px;
    color: var(--d-text);
    opacity: 0.8;
    position: relative;
}

#toc-list a.toc-h4::before {
    content: '●';
    position: absolute;
    left: 35px;
    color: var(--main);
    font-size: 6px;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0.6;
}

/* H5 - Minor sections */
#toc-list a.toc-h5 {
    font-size: 13px;
    padding-left: 60px;
    color: var(--d-text);
    opacity: 0.7;
    position: relative;
}

#toc-list a.toc-h5::before {
    content: '◦';
    position: absolute;
    left: 50px;
    color: var(--main);
    font-size: 10px;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0.5;
}

/* H6 - Smallest sections */
#toc-list a.toc-h6 {
    font-size: 13px;
    padding-left: 75px;
    color: var(--d-text);
    opacity: 0.6;
    position: relative;
}

#toc-list a.toc-h6::before {
    content: '-';
    position: absolute;
    left: 65px;
    color: var(--main);
    font-size: 8px;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0.4;
}

/* Enhanced active and hover states for all levels */
#toc-list a.toc-h2:hover,
#toc-list a.toc-h2.active {
    font-weight: 700;
    color: var(--main);
}

#toc-list a.toc-h3:hover,
#toc-list a.toc-h3.active {
    font-weight: 600;
    color: var(--main);
    opacity: 1;
}

#toc-list a.toc-h4:hover,
#toc-list a.toc-h4.active {
    font-weight: 600;
    color: var(--main);
    opacity: 1;
}

#toc-list a.toc-h5:hover,
#toc-list a.toc-h5.active {
    font-weight: 500;
    color: var(--main);
    opacity: 1;
}

#toc-list a.toc-h6:hover,
#toc-list a.toc-h6.active {
    font-weight: 500;
    color: var(--main);
    opacity: 1;
}

/* Visual feedback for auto-scrolling and last item handling */
#toc-list a.scrolling-to-view {
    background: linear-gradient(90deg, 
        transparent 0%, 
        rgba(var(--main-rgb, 0, 124, 186), 0.1) 50%, 
        transparent 100%);
    animation: scrollHighlight 0.6s ease-out;
}

/* Special styling for last TOC item to indicate footer-friendly behavior */
#toc-list a:last-child.active {
    position: relative;
}

#toc-list a:last-child.active::after {
    content: '⬇';
    position: absolute;
    right: -15px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 10px;
    color: var(--main);
    opacity: 0.6;
    animation: bounceDown 2s infinite;
}

@keyframes scrollHighlight {
    0% {
        background-size: 0% 100%;
    }
    50% {
        background-size: 100% 100%;
    }
    100% {
        background-size: 0% 100%;
    }
}

@keyframes bounceDown {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(-50%);
    }
    40% {
        transform: translateY(-40%);
    }
    60% {
        transform: translateY(-45%);
    }
}

/* Mobile Responsive */
@media only screen and (max-width:1080px) {
    .dtoc {
        width: auto;
    }
    
    .dtoc p {
        font-size: 14px;
        position: relative;
        cursor: pointer;
        transition: color 0.3s ease;
    }
    
    .dtoc p::after {
        content: "+";
        position: absolute;
        right: 0;
        font-size: 20px;
        transition: transform 0.3s ease, color 0.3s ease;
    }
    
    .dtoc p.active::after {
        content: "-";
        transform: rotate(180deg);
    } 
    
    #toc-list.open {
        max-height: 700px;
        opacity: 1;
        overflow: hidden;
        overflow-y: visible;
        padding-top: 20px;
        padding-bottom: 20px;
        border-bottom: var(--outline);
        transition: max-height 0.4s ease, opacity 0.4s ease;
    }
    
    #toc-list {
        margin-left: 0px;
        padding-top: 0px;
        padding-bottom: 0px;
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        transition: max-height 0.4s ease, opacity 0.4s ease;
    }
    
    /* Mobile progress indicator adjustments */
    #toc-list::before {
        width: 2px;
    }
    
    #toc-list::after {
        width: 9px;
        height: 9px;
        left: -3.5px;
    }
    
    /* Mobile hierarchy spacing */
    #toc-list a.toc-h2 {
        padding-left: 15px;
        font-size: 15px;
    }
    
    #toc-list a.toc-h3 {
        padding-left: 25px;
        font-size: 14px;
    }
    
    #toc-list a.toc-h4 {
        padding-left: 35px;
        font-size: 13px;
    }
    
    #toc-list a.toc-h5 {
        padding-left: 45px;
        font-size: 12px;
    }
    
    #toc-list a.toc-h6 {
        padding-left: 55px;
        font-size: 12px;
    }
    
    /* Mobile icon positions */
    #toc-list a.toc-h3::before { left: 16px; }
    #toc-list a.toc-h4::before { left: 26px; }
    #toc-list a.toc-h5::before { left: 36px; }
    #toc-list a.toc-h6::before { left: 46px; }
    
    /* Hide indicator when TOC is closed on mobile */
    #toc-list:not(.open)::before,
    #toc-list:not(.open)::after {
        opacity: 0;
    }
    
    #toc-list.open::before {
        opacity: 1;
        transition: opacity 0.4s ease;
    }
    
    #toc-list.open::after {
        transition: top 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s ease 0.2s;
    }
}

/* Dark mode support */
@media (prefers-color-scheme: dark) {
    #toc-list::before {
        background: rgba(255, 255, 255, 0.2);
    }
    
    #toc-list::after {
        border-color: var(--bg-color, #000);
    }
}

/* Print styles */
@media print {
    #toc-list::before,
    #toc-list::after {
        display: none;
    }
    
    #toc-list a {
        transform: none !important;
        padding-left: 0 !important;
    }
}

/*-Content-Section-*/
.content-sec{
    max-width: 1200px;
    margin: auto;
  display: grid;
  grid-template-columns: 2fr 0.6fr;
  grid-column-gap: 75px;
  grid-row-gap: 24px;
  margin-top: 70px;
  margin-bottom: 70px;
}

.single_content{
    font-size: 20px;
    overflow: hidden;
}

.single_content figure{
    margin: 24px 0px;
}

.single_content img{
    width:100%;
    width:-moz-available;
    width: -webkit-fill-available;
    margin: 20px 0px 0px;
    border-radius: 8px;
}

.single_content h2{
    font-size: 39.4px;
    margin-top: 70px;
    margin-bottom: 15px;
}
.single_content h3{
    font-size: 32.83px;
    margin-top: 30px;
    margin-bottom: 15px;
}
.single_content h4{
    font-size: 28px;
    margin-top: 30px;
    margin-bottom: 15px;
}
.single_content h5,
.single_content h6{
    font-size: 26px;
    margin-top: 30px;
    margin-bottom: 15px;
}

.single_content p,
.single_content ul,
.single_content ol{
    margin-bottom: 20px;
}

.single_content ul,
.single_content ol{
    margin-left: 20px;
}
    
.single_content p:last-child{
    margin-bottom:0px;
}

.single_content ul li,
.single_content ol li{
    list-style-type: square;
    margin-left: 21px;
    margin-bottom: 15px;
}

.single_content ul li:first-child,
.single_content ol li:first-child{
    margin-top:20px;
}
.single_content ul li:last-child,
.single_content ol li:last-child{
    margin-bottom:40px;
}

.single_content a{
    color:var(--hover);
}
.single_content a:hover {
    text-decoration:underline;
}

blockquote {
    display: inline-flex;
    border-left: 4px solid var(--hover);
    padding: 10px 20px;
    background: #f9f9f9;
}

blockquote p{
    color: var(--main);
}
/*--share-section--*/
.d-share{
    display: flex;
    align-items: flex-end;
}
.s-btns{
    display: flex;
    grid-template-columns: 1fr;
    grid-column-gap: 24px;
    width: fit-content;
    overflow: hidden;
}

.s-hd{
    font-size: 13px;
    text-transform: uppercase;
    font-weight: 700;
}

.shr_btn {
    display: flex;
    align-items: center;
    font-size: 15px;
    font-weight: 500;
    color: inherit;
    background: transparent;
    border: none;
    transition: all 0.4s ease;
}

.shr_btn::before,
.shr_btn::after{
    content:none!important;
}

.shr_btn:hover {
    color: var(--blue-color);
    font-weight: 600;
    transform: scale(1.1);
    padding: 1px;
}

.shr_btn span{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    grid-column-gap: 6px;
}

.t_icon::before{
    content:'';
    background-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17.5 14.3218' width='15' height='15' fill='%235e5e5e' aria-hidden='true'%3E%3Cpath d='m5.5,14.3218c5.6256.007,10.1975-4.5369,10.225-10.1625.0069-.0456.0069-.0919,0-.1375v-.475c.6985-.5144,1.2996-1.1493,1.775-1.875-.6536.2972-1.3494.4912-2.0625.575.7495-.4543,1.3091-1.1648,1.575-2-.7048.4154-1.4735.7111-2.275.875-1.3349-1.4193-3.5625-1.5029-5-.1875-.976.8746-1.4017,2.2093-1.1125,3.4875-1.4328-.0741-2.834-.4489-4.1125-1.1-1.2679-.6512-2.3806-1.5678-3.2625-2.6875-.9618,1.655-.4817,3.7719,1.1,4.85-.5708-.0221-1.1281-.1807-1.625-.4625-.0016,1.7143,1.1978,3.1953,2.875,3.55-.5296.1458-1.0858.1672-1.625.0625.4801,1.46,1.8261,2.4607,3.3625,2.5-1.4981,1.2147-3.4209,1.7776-5.3375,1.5625,1.6405,1.0559,3.5491,1.6198,5.5,1.625'/%3E%3C/svg%3E");
    width: 17px;
    height: 17px;
    background-size: cover;
    background-repeat: no-repeat;
    
}

.ln_icon::before{
    content:'';
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512' width='15' height='15' fill='%235e5e5e'%3E%3Cpath d='M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z'%3E%3C/path%3E%3C/svg%3E");
    width: 17px;
    height: 17px;
    background-size: cover;
    background-repeat: no-repeat;
}

.wt_icon::before{
    content:'';
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='15' height='15' fill='%235e5e5e'%3E%3Cpath d='m8,0C3.582,0,0,3.582,0,8c0,1.5008.4216,2.9,1.1406,4.1003L.0716,16l3.9831-1.0456c1.1649.6623,2.5096,1.0456,3.9453,1.0456,4.418,0,8-3.582,8-8S12.418,0,8,0Zm-2.7383,4.2682c.13,0,.2636-.0008.3789.0052.1427.0033.2979.0138.4466.3424.1767.3907.5613,1.3707.6107,1.4701s.0843.2164.0156.3464c-.0653.1333-.0993.214-.1953.332-.0993.1147-.2082.2571-.2982.3438-.0993.0993-.2019.2083-.0872.4063s.5129.8471,1.1016,1.3711c.7567.676,1.3951.8837,1.5938.9831s.3137.0839.4284-.0495c.118-.13.4956-.5761.6289-.7747.13-.1987.2627-.1643.4427-.099.1827.0653,1.1568.5452,1.3555.6445.1987.0993.3289.1485.3789.2292.0513.0833.0514.48-.1133.9427-.1647.462-.9733.9088-1.3359.9401-.366.034-.7076.1645-2.3789-.4935-2.016-.794-3.2874-2.8589-3.3867-2.9922-.0993-.13-.8073-1.0735-.8073-2.0469,0-.9767.5121-1.455.6914-1.6536.1827-.1987.3966-.2474.5299-.2474h0Z'/%3E%3C/svg%3E");
    width: 17px;
    height: 17px;
    background-size: cover;
    background-repeat: no-repeat;
}

.cp_icon::before{
    content:'';
    background-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.6138 14.6138' width='15' height='15' fill='%235e5e5e'%3E%3Cpath d='m9.0815,5.5297c.165.165.31.3412.4375.525l-.9075.9075c-.6585-1.1899-2.157-1.6207-3.3469-.9622-.1476.0817-.2864.1783-.4143.2884l-.135.125-2.7175,2.72c-.9606.9627-.959,2.5219.0037,3.4825.9108.9088,2.3677.9633,3.3438.125l.1337-.125,1.4662-1.4663.8837.8837-1.465,1.4663c-1.4351,1.4644-3.7856,1.4882-5.25.0531-1.4644-1.4351-1.4882-3.7856-.0531-5.25.0175-.0179.0352-.0355.0531-.0531l2.7175-2.7188c1.4498-1.4496,3.8002-1.4496,5.25,0v-.0012ZM13.5265,1.086c1.4496,1.4498,1.4496,3.8002,0,5.25l-2.7175,2.7188c-1.4497,1.45-3.8003,1.4503-5.2503.0006-.1336-.1335-.2568-.2771-.3685-.4294l.9-.9c.7164,1.156,2.2343,1.5123,3.3903.7959.109-.0675.2125-.1435.3097-.2271l.1338-.125,2.7188-2.7175c.9606-.9627.959-2.5219-.0037-3.4825-.9108-.9088-2.3677-.9633-3.3438-.125l-.135.125-1.4775,1.4763-.8837-.8838,1.4762-1.475c1.4498-1.4496,3.8002-1.4496,5.25,0l.0013-.0012Z'/%3E%3C/svg%3E");
    width: 17px;
    height: 17px;
    background-size: cover;
    background-repeat: no-repeat;
}

/*-link-copied-*/
.msg-copied{
    color: var(--blue-color);
    font-size: 13px;
    text-transform: uppercase;
    font-weight: 700;
    display: none;
}
/*-share-btns-*/

/*-Author-card-*/
.author-cont{
    max-width: 1200px;
    margin: auto;
}

.authorcard{
    margin-top: 40px;
    padding: 28px 28px;
    border-radius: 7px;
    background: var(--bg);
    box-shadow: rgba(0, 0, 0, 0.25) 0px 4px 12px;
}

.author-link{
    display: flex;
    align-items: center;
    border-radius: 100px;
    background: #ffffffa1;
    padding: 5px 19px 5px 5px;
    grid-column-gap: 10px;
    box-shadow: rgb(0 0 0 / 12%) 0px 4px 12px;
}

.author-link:hover{
    color:#fff;
    background: var(--hover);
}

.author_img_name{
    display: flex;
    flex-wrap:wrap;
    font-size: 21px;
    font-weight: 600;
    grid-column-gap: 8px;
    align-items: center;
    color: #939393;
}

.author_img_name img{
    border-radius: 100px;
}

.author_img_name a{
    color: var(--main);
}

.author_img_name a:hover{
    text-decoration:auto;
}

.authorcard_bio{
    display: flex;
    grid-column-gap: 44px;
    grid-row-gap: 14px;
    justify-content: space-between;
    margin: 15px 0px 15px 0px;
}

.acardbio{
    font-size: 18px;
    width: fit-content;
}

.authorcard_social{
    display: grid;
    justify-content: center;
    justify-items: start;
    align-items: start;
    flex: 0 0 155px;
    grid-row-gap: 6px;
    color: var(--main);
}

.authorcard_social a{
    width: fit-content;
    font-size: 16px;
    font-weight: 600;
}

.authorcard_social a:hover{
    text-decoration: auto;
}

.article_datetime{
    display: flex;
    font-size: 16px;
    font-style: italic;
    grid-column-gap: 12px;
    color: var(--d-text);
}

.article_datetime span{
    font-weight: 600;
}

/*-Author-card-*/


/*-link-underline-*/
.link-line{
    position:relative;
}

.link-line::after{
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 2px; /* adjust the height of the underline */
  background-color: var(--hover); /* use current text color */
  transition: width 0.3s ease-in-out; /* add transition effect */
}

.link-line:hover::after{
  width: 100%;
}

.link-line:hover{
    color: var(--hover);
    font-weight:600;
}


/*-related-section-*/
.rl-posts{
    max-width:1200px;
    margin:auto;
    margin-top: 60px;
}
.rl-hd{
    font-family: var(--main-font);
    font-size: 30px;
    display: flex;
    justify-content: flex-start;
    font-weight: 700;
    margin-bottom: 20px;
    border-left: 3px solid var(--hover);
    padding-left: 14px;
    line-height: 1;
}

/*-content-table-*/
table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-family: inherit;
    font-size: 17px;
    border-radius: .375rem;
    overflow: hidden;
    margin-bottom: 24px;
    display: block;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
}

th, td {
    padding: 10px 15px;
    text-align: left;
    border-right: var(--outline);
    border-bottom: var(--outline);
}

th:last-child,
td:last-child {
    border-right: none;
}

tr:last-child td {
    border-bottom: none;
}

table thead {
    background: #b0acac;
}

table tbody {
    background: var(--bg);
}

th:first-child {
    border-top-left-radius: .375rem;
}

th:last-child {
    border-top-right-radius: .375rem;
}

tr:last-child td:first-child {
    border-bottom-left-radius: .375rem;
}

tr:last-child td:last-child {
    border-bottom-right-radius: .375rem;
}

@media screen and (max-width: 767px) {
    table {
        font-size: 14px;
    }
}

@media only screen and (max-width:1080px) {
    article{
        padding: 60px 0px 100px 0px;
    }

    .content-sec{
        grid-template-columns: 1fr;
        margin-top: 20px;
        margin-bottom: 15px;
        padding-top: 10px;
        padding-bottom: 15px;
    }
    
    .single_content{
        order:2;
    }
    
    .s-btns{
        display: flex;
        flex-direction: row;
        grid-column-gap: 24px;
        justify-content: center;
        align-items: center;
        padding: 0px;
        box-shadow: none;
        background: transparent;
    }
    
    .d-share{
        margin-left:20px;
    }
}

@media only screen and (max-width:767px) {
    article{
        padding: 30px 0px 80px 0px;
    }
    /*--banner--*/
    
    .sheadtitle{
        font-size: inherit;
    }
    
    .short_headlines li {
        font-size: inherit;
    }
    
    .single_content{
        font-size: inherit;
    }
    
    h1{
        font-size: 36px;
    }
    
    .single_content h2{
        font-size: 30px;
        margin-top: 60px;
    }
    
    .single_content h3 {
        font-size: 26px;
    }
    
    .single_content h4,
    .single_content h5,
    .single_content h6{
        font-size: 24px;
    }
    
    .single_content ul,
    .single_content ol{
        margin-left: 10px;
    }
    
    /*-Author-card-*/
    .author_img_name {
        font-size: 18px;
    }
    
    .authorcard_bio{
        flex-wrap:wrap;
    }
    
    .acardbio{
        font-size: 15px;
    }
    
    .authorcard_social{
        max-width: 100%;
        flex: 0 0 auto;
    }
    .article_datetime{
        font-size: 15px;
    }
}