/* article single */


/* article header  */

.article-header{
    /* max-width: calc(1212px + 2 * (var(--mobilePadding))); */
    max-width: calc(1212px + 4rem);
    /* padding-inline: var(--mobilePadding); */
    padding-inline: 2rem;
    margin-inline: auto;
}

.article-header .article-top-info,
.article-header .article-title,
.article-header .article-info,
.article-header .article-header-social{
    max-width: 715px;
    margin-inline: auto;
}

.article-header .article-top-info{
    color: #152046;
    margin-bottom: 12px;
    align-items: center;
    font-family: "PFSpekkVAR-Bold"; 
    flex-wrap: wrap;
}
.article-header .category{
    font-size: 20px;
    line-height: 115%;
    margin-right: 20px;
    border-bottom: 1px solid #2545B0; 
    height: 25px;
    margin-bottom: 5px;
}

.article-header .tags{
    background-color: #E3EAF4;
    padding: 8px 18px;
    border-radius: 6px;
    flex-wrap: wrap;
}

.article-header .tag{
    font-size: 14px;
    line-height: 120%;
}

.article-header .tag:not(:last-of-type){
    margin-right: 0.75rem;
}

.article-title{
    font-family: "PFSpekkVAR-Bold"; 
    font-weight: 700;
    /* font-size: 44px; */
    font-size: 48px;
    line-height: 110%;
    /* or 48px */

    letter-spacing: -0.02em;

    /* Blue 04 */

    color: #152046;  
    
    margin-bottom: 22px;
}

.article-header .article-image{
    margin-bottom: 22px;
}

.article-info{
    height: 18px;
    padding-bottom: 10px;
    border-bottom: 2px solid #D8E3F3;
}
.article-info,
.article-header-social{
    justify-content: space-between;
    align-items: center;
}

.article-info .author{
    font-size: 16px;
    line-height: 100%;
    color: #1C2D69;
    font-family: "PF Regal Text Pro";
}
.article-info .article-date{
    font-size: 14px;
    line-height: 18px;
    color: #152046;
}
.article-info .article-date::before{
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    border:1px solid #152046;
    display:inline-block;
    margin-right: 6px;
    transform: translateY(-1px);
}

.article-header-social{
    height: 36px;
    padding-block: 8px;
    font-size: 14px;
    line-height: 18px;
}

.article-header-social .msg-icon{
    margin-right: 10px;
}

.article-header-social .social li{
    width: 18px;
    height: 18px;
    margin-right: 36px;
}

/*  article body */

.article-grid{
    display: grid;
    grid-template-columns:  1fr 107px 193px 58px auto 50px 193px 107px 1fr;
    margin-top: 32px;
}

.article-grid .right-column{
    /* background-color: #a1a1a1; */
    grid-row: 1/2;
    height: 100%;
}

.article-grid .right-column aside{
    height: 60%;
}

.article-grid .right-column aside:not(:last-of-type){
    margin-bottom: 2rem;
}

.article-grid .left-column{
    grid-column: 3/4;
}
.article-grid .right-column{
    grid-column: -2/-4;
}

.article-body{
    grid-column: 5/6;
    max-width: 715px;
    color: #152046;
    /* font-size: 18px; */
    font-size: 21px;
    line-height: 140%;
    margin-inline: auto;
}

.article-body iframe{
    display: block;
    margin-inline: auto;
    /*width: 100%;*/
    max-width: 100%;
}

.article-body > *:not(:last-child){
    margin-bottom: 22px;
}

.article-body p:first-of-type{
    /* font-size: 20px; */
    font-size: 23px;
    line-height: 135%; 
    /*width: calc(100% - 130px);*/
    margin-inline: auto;
    position: relative;
    font-family: 'PFSpekkVAR-Bold';
    letter-spacing: -0.01em;
}
/*
.article-body p:first-of-type::first-letter{
    font-size: 75px;
    float:left;
    height: 100%;
    margin-left: -70px;
    margin-top: 25px;
    font-family: 'PF Regal Text Pro';
}*/

.article-body p{
    font-size: 21px;
    line-height: 140%;
    letter-spacing: -0.01em;
}

.article-body a{
    font-family: 'PFSpekkVAR-Bold';
    border-bottom: 2px solid #96ADFF;
}

.article-body strong{
    font-family: 'PFSpekkVAR-Bold';
}

.article-body blockquote{
    max-width: 450px;
    padding-right: 50px;
    font-size: 24px;
    line-height: 115%;
    margin-left: 90px;  
    position: relative; 
    font-family: "PF Regal Text Pro";
}

.article-body blockquote::before{
    content: "\201C";
    position: absolute;
    line-height: 100%;
    left: -70px;
    top: -9px;
    font-size: 165px;
    font-family: "PF Regal Text Pro";
}


.article-body > figure{
    aspect-ratio: 1.77;
    margin-block: 42px 32px;
}
.article-body  figcaption{
    font-size: 14px;
    line-height: 140%;
    color: #4E4E4E;
    margin-top: 12px;
}

.article-body ul li{
    list-style-type: disc;
}
.article-body ol li{
    list-style: auto;
}
.article-body li{
    margin-left: 2rem;
}

.article-body h2,
.article-body h3,
.article-body h4,
.article-body h5,
.article-body h6{
    margin-bottom: 0!important;
    line-height: 140%;
    font-family: "PFSpekkVAR-Bold";
}

.article-body h2{ font-size: 28px;}
.article-body h3{ font-size: 25px;}
.article-body h4{ font-size: 20px;}
.article-body h5{ font-size: 28px;}
.article-body h6{ font-size: 16px;}

.article-bosy aside{
    margin-block: 12px;
}

/* article footer */

.article-footer{
    grid-column: 5/6;
    margin-top: 72px;
    color: #303546;
    max-width: 728px;
}

.article-footer-header{
    margin-bottom: 12px;
    text-transform: uppercase;
    font-size: 22px;
    letter-spacing: -0.01em;
    line-height: 110%;
    font-family: 'PF Regal Text Pro';
}

.article-footer-header-mobile{
    display: none;
}

.footer-links{
    margin-bottom: 52px;
}
.footer-link-item{
    align-items: flex-start;
    min-height: 23px;
}

.footer-link-item:not(:last-of-type){
    margin-bottom: 12px;
}
.footer-link-item .category{
    font-size: 14px;
    line-height: 120%;
    font-family: "PFSpekkVAR-Bold";
    color: #1C2D69;
    margin-right: 1ch;
    min-width: 70px;
    margin-top: 4px;
}

.footer-link-item .category span{
    display: inline-block;
    border-bottom: 2px solid #2545B0;
}
.footer-link-item .title{
    font-size: 20px;
    line-height: 115%;
    letter-spacing: -0.01em;
    font-family: "PFSpekkVAR-SemiBold";
}

.article-footer-add{
    font-size: 18px;
    line-height: 115%;
    letter-spacing: -0.01em;
    max-width: 618px;
}

.article-footer-add a{
    font-family: "PFSpekkVAR-SemiBold";
    color: #1C2D69;
    border-bottom: 2px solid #96ADFF;
}

.article-footer-extra{
    margin-top: 62px;
}

/* left column - related */

.article-grid .left-column{
    grid-row: 1/2;   
    /*position: sticky;
    top: 90px; 
    margin-top: 150px;*/
}

.article-grid .left-column .section-header{
    margin-bottom:12px;
}
.article-grid .left-column .section-header::before{
    border-width: 4px;
}
.article-grid .left-column .section-header h2{
    font-size: 16px;
    line-height: 110%;
    letter-spacing: -0.01em;
    padding-inline: 8px;
}

.article-grid .left-column .card .title{
    padding-bottom:8px;
    margin-bottom:8px;
}
.article-grid .left-column .card-wrapper:not(:last-of-type){
    margin-bottom: 32px;    
}

/* comments */

.article-comments{
    max-width: 728px;
    margin-block: 80px 150px;
    grid-column: 5/6;
}

.article-comments-top{
    justify-content: center;
    align-items: center;
}

.article-comments-top h4{
    font-size: 22px;
    line-height: 110%;
    text-align: center;
    letter-spacing: -0.01em;

    color: #303546;
}
.article-comments-top .msg-icon{
    margin-inline: 14px 12px;
}
.article-comments-top .txt{
    color: #4862B9;
    font-size: 17px;
    line-height: 21px;
    font-family: "PFSpekkVAR-SemiBold";
}

.article-comment-btn{
    border: 1px solid #253775;
    border-radius: 110px;
    margin-inline: auto;
    margin-top: 2rem;
}

/* cards */

.most-read-single .title,
.popular-single .title{
    padding-bottom: 8px;
    margin-bottom: 7px;
}
.most-read-single .category,
.popular-single .category{
    margin-bottom: 7px;
}

.most-read-single .time{
    display: none;
}

.mobile-extra{
    display: none;
}

@media screen and (max-width: 1480px) {
    .article-grid{
        grid-template-columns:  1fr 0 193px 1fr auto 1fr 193px 107px 1fr;
    }  
    .article-header .article-info, 
    .article-header .article-header-social {
        max-width: unset;
        width: 100%;
    } 
}
@media screen and (max-width: 1380px) {
    .article-grid{
        grid-template-columns: 2rem 1fr 50px 300px 2rem;
    } 
    .article-grid .left-column{
        grid-column: 2/3;    
        grid-row-start: 2;   
        position: relative; 
        margin-top: 2rem;
    }
    .article-footer,
    .article-comments,
    .article-body{
        grid-column: 2/3;
    }
    .article-header{
        max-width: unset;
    }
    .article-grid .right-column {
        grid-column: 4/5;
        grid-row: 1/2;
    }
    .left-column .card-container{
        display: flex;
        justify-content: space-between;
    }
    .article-grid .left-column .card-wrapper:not(:last-of-type) {
        margin-bottom: 0;
    }
    .left-column .card-container .card-wrapper{
        width: calc((100% - 3rem) / 2);
    }
    .article-grid .left-column .section-header{
        margin-bottom:20px;
    }
    .article-grid .left-column .section-header::before{
        border-width: 7px;
    }
    .article-grid .left-column .section-header h2{
        font-size: 22px;
        padding-inline: 8px;
    }
}   

@media screen and (max-width: 1210px) {
    .article-grid{
        grid-template-columns: 2rem 1fr 2rem 300px 2rem;
    } 
    .article-grid .left-column,
    .article-footer, 
    .article-comments{
        grid-column: 2/-2;
        margin-inline: auto;
    }  
    .article-body{
        width: 100%;
    }
    .article-grid .left-column{
        width: 100%;
    }
}

@media screen and (max-width: 1120px) {
    .article-title{
        font-size: 38px;
    }
    .article-grid .left-column .card .title{
        font-size: 20px;
    }
    .article-grid .left-column .card .title{
        margin-bottom: 10px;
        padding-bottom: 10px;
    }
}

@media screen and (max-width: 1020px) {
    .most-read-single .card-wrapper:nth-of-type(1),
    .most-read-single .card-wrapper:nth-of-type(2),
    .popular-single .card-wrapper:nth-of-type(1),
    .popular-single .card-wrapper:nth-of-type(2){
        margin-bottom: 22px;
    }
}


@media screen and (max-width: 940px) {
    .article-header{
        max-width: calc(1212px + 2 * (var(--mobilePadding)));
        padding-inline: var(--mobilePadding);
    }
    .article-grid{
        grid-template-columns: var(--mobilePadding) 1fr 2rem 300px var(--mobilePadding);
    } 
    .article-body p:first-of-type{
        width: 100%;    
    }
    /*
    .article-body p:first-of-type::first-letter {
        font-size: 76px;
        height: auto;
        margin-left: 0;
        margin-top: 24px;
        margin-bottom: 4px
    }*/
    .left-column .card-container .card-wrapper {
        width: calc((100% - 2rem) / 2);
    }
}

@media screen and (max-width: 820px) {
    .article-title{
        font-size: 32px;
        margin-bottom: 20px;
    }
    .article-header .category{
        font-size: 18px;
    }
    .article-header .tags{
        padding: 6px 10px;
    }
    .article-image{
        width: calc(100% + 2 * var(--mobilePadding));
        margin-left: calc(-1 * var(--mobilePadding));
        margin-bottom: 10px;
    }
    .article-header-social{
        padding-block: 15px;
    }
    .article-info{
        padding-bottom: 14px;
    }
    .article-info .article-date{
        font-size: 15px;
    }
    .article-grid{
        margin-top: 10px;
    }
    .article-grid .right-column{
        display: none;
    }
    .article-body{
        grid-column: 2/-2;
        max-width: unset;
    }
    figure.full-width{
        width: calc(100% + 2 * var(--mobilePadding));
        margin-left: calc(-1 * var(--mobilePadding));
    }
    figure.full-width figcaption{
        padding-inline: calc(var(--mobilePadding) + 1rem);
    }
    .article-grid .left-column .card .title{
        font-size: 18px;
    }
    .footer-links{
        margin-bottom: 30px;
    }
    .most-read-single .card-wrapper .author,
    .popular-single .card-wrapper .author{
        display: none;
    }
    .most-read-single .time{
        display: block;
    }
}
@media screen and (max-width: 800px) {
    .article-footer-extra{
        display: none;
    }
    .article-comments{
        margin-block: 85px 90px;
    }
    .mobile-extra{
        display: block;
        margin-block: 30px;
    }
}
@media screen and (max-width: 680px) {
    .article-grid{
        grid-template-columns: var(--mobilePadding) 1fr var(--mobilePadding);
    }
    .article-body,
    .article-footer, 
    .article-gid .left-column{
        grid-column: 2/3;
    }

    .left-column .card-container .card-wrapper {
        width: calc((100% - 1rem) / 2);
    }
    .footer-link-item .title{
        font-size: 18px;
    }
}
@media screen and (max-width: 620px) {
    .article-header-social .social li{
        width: 16px;
        height: 16px;
        margin-right: 26px;
    }
    .article-header .article-top-info{
        margin-bottom: 10px;
    }
    .article-body p:first-of-type{
        font-size: 19px;
        line-height: 125%; 
    }
    /*
    .article-body p:first-of-type::first-letter{
        font-size: 76px;
    }*/
    
    .article-body p{
        /* font-size: 17px; */
        font-size: 19px;
    }

    .article-body > *:not(:last-child){
        margin-bottom: 20px;
    }

    .article-body > figure{
        margin-block: 30px 20px;
    }

    .article-body figcaption{
        padding-inline:1rem;
        margin-top: 10px;
    }
}
@media screen and (max-width: 580px) {

    .article-body blockquote{
        padding-right: 1rem;
        margin-left: 40px
    }
    .article-body blockquote::before{
        font-size: 125px;
        left: -53px;
        top: -21px;
    }
}

@media screen and (max-width: 520px) {
    .article-footer-header{
        display: none;
    }
    .article-footer-header-mobile{
        display: block;
    }
    .article-footer-header-mobile .section-header h2{
        font-size: 22px;
    }
    .article-footer-header-mobile .section-header::before{
        height: 7px;
    }
    .article-title{
        font-size: 26px;
    }
    .left-column .card-container{
        display: block;
        justify-content: space-between;
    }
    .article-grid .left-column .card-wrapper:not(:last-of-type) {
        margin-bottom: 22px;
        padding-block: 8px;
    }
    .left-column .card-container .card-wrapper{
        width: 100%;
    }
    .article-grid .left-column .card .title{
        font-size: 16px;
        border: none;
        padding-bottom: 0;
        margin-bottom: 5px;
    }
    .article-grid .left-column .card .card-details{
        justify-content: flex-start;
    }

    .footer-link-item{
        display: block;
    }
    .footer-link-item .title {
        color: #0025A8;    
    }
    .footer-link-item .category{
        margin-top: 0;
    }
    .most-read-single .card-wrapper:nth-of-type(1),
    .most-read-single .card-wrapper:nth-of-type(2),
    .most-read-single .card-wrapper:not(:last-of-type),
    .popular-single .card-wrapper:nth-of-type(1),
    .popular-single .card-wrapper:nth-of-type(2),
    .popular-single .card-wrapper:not(:last-of-type){
        margin-bottom: 23px;
    }
    .most-read-single .category,
    .popular-single .category{
        margin-bottom: 5px;
    }
    .most-read-single .title,
    .popular-single .title{
        border:none;
        padding-bottom:0;
    }

    .most-read-single .title{
        margin-bottom: 8px;
    }
    .popular-single .title{
        margin-bottom: 3px;
    }
}


@media screen and (max-width: 400px) {
    .article-info .author{
        font-size: 14px;
    }
    .article-info .article-date{
        font-size: 12px;
        line-height: 16px;
    }
    .article-header-social .social li{
        margin-right: 16px;
    }
}

@media screen and (max-width: 360px) {
    .article-grid{
        --mobilePadding: 16px;
    }    
}

@media screen and (max-width: 340px) {
    .article-info .author{
        font-size: 13px;
    }
    .article-info .article-date{
        font-size: 11px;
        line-height: 15px;
    }
}

@media screen and (max-width: 333px) {
    .article-grid{
        --mobilePadding: 10px;
    }    
}

/* article agenda */

.single-agenda.theatre{
    --bgColor:rgba(172, 110, 118, 0.2);
    --txtColor:rgb(172, 110, 118);
}
.single-agenda.cinema{
    --bgColor:rgba(160, 107, 185, 0.2);
    --txtColor:rgb(160, 107, 185);
}
.single-agenda.dance{
    --bgColor:rgba(208, 133, 45, 0.2);
    --txtColor:rgb(208, 133, 45);
}
.single-agenda.expo{
    --bgColor:rgba(103, 125, 204, 0.2);
    --txtColor:rgb(103, 125, 204);
}
.single-agenda.events{
    --bgColor:rgba(153, 193, 67, 0.2);
    --txtColor:rgb(153, 193, 67);
}
.single-agenda.concerts{
    --bgColor:rgba(39, 167, 175, 0.2);
    --txtColor:rgb(39, 167, 175);
}

/* article agenda header */

.article-agenda-header .top-row{
    background-color: var(--bgColor);
}
.article-agenda-header .top-row-wrapper{
    max-width: calc(1440px + 4rem);
    padding-inline: 2rem;
    margin-inline: auto; 
    position: relative;
    justify-content: center;
    align-items: center;
}
.article-agenda-header .top-row-wrapper > div{
    width: 50%
}
.article-agenda-header .header-left-side{
    position: relative;
    padding-inline: 98px 42px;
}
.article-agenda-header .header-left-side > div{
    position: relative;
}
.article-agenda-header .header-left-side::before{
    content: "";
    width: 236px;
    height: 236px;
    border-radius: 50%;
    opacity: 0.3;
    background-color: #fff;
    position: absolute;
    left: 100px;
    top: -30px;
}

.article-agenda-header .agenda-info{
    padding-left:35px;
}

.article-agenda-header .agenda-info .category{
    margin-top: 12px;
    border-bottom: 4px solid;
    width: fit-content;
    font-size: 16px;
    line-height: 115%;
    font-family: 'PFSpekkVAR-Bold';
    color: var(--txtColor);
}

.article-agenda-header .agenda-info time{
    flex-wrap: wrap;
    font-size: 40px;
    line-height: 110%;
    font-family: 'PFSpekkVAR-SemiBold';
    letter-spacing: -0.03em;
}
.article-agenda-header .agenda-info time span{
    width: fit-content;
}
.article-agenda-header .agenda-info time .year{
    width: 60%;
    font-size: 25px;
    line-height: 110%;
}

.article-agenda-header .agenda-header-texts{
    padding-left:28px;
}

.article-agenda-header .article-title{
    font-family: 'PFSpekkVAR-SemiBold';
    font-size: 44px;
    line-height: 110%;
    margin-bottom: 21px;
}

.article-agenda-header .lead{
    font-size: 20px;
    line-height: 130%;
}
.article-agenda-header .article-image{
    transform: translateY(30px);
    width: 50%;
}

.article-agenda-header .article-header-social{
    max-width: 715px;
    margin-inline: auto;
    margin-top: 65px;
    padding-bottom: 18px;
    border-bottom: 2px solid var(--txtColor);
}

.article-agenda-header .comments{
    display: none;
}

.top-header-navigation{
    display: none;
}

/* artticle agenda body */
/*
.single-agenda .article-body p:first-of-type::first-letter{
    font-size: inherit;
    float:unset;
    height: unset;
    margin-left: 0;
    margin-top: 0;
}*/

.single-agenda .article-body blockquote::before{
    color: var(--txtColor);
}

@media screen and (max-width: 1480px) {
    .article-agenda-header .header-left-side{
        padding-left: 2rem;
    }    
    .article-agenda-header .header-left-side::before{
        left:0;
    }
    .article-agenda-header .agenda-info{
        padding-left: 1rem;
    }
    .article-agenda-header .article-title{
        font-size: 38px;
    }
}

@media screen and (max-width: 1260px) {  
    .article-agenda-header .header-left-side{
        padding-right: 22px;    
    } 
    .article-agenda-header .header-left-side::before{
        left:0;
    }
    .article-agenda-header .article-title{
        font-size: 32px;
        margin-bottom: 16px;
    }
    .article-agenda-header .top-row-wrapper{
        padding-top: 20px;
    }
}

@media screen and (max-width: 1080px) {  
    .article-agenda-header .top-row-wrapper {
        flex-wrap: wrap;
        padding-top: 50px;
    }
    .article-agenda-header .top-row-wrapper > div{
        width: 100%;
    }
    .article-agenda-header .agenda-header-texts{
        max-width: 600px;
    }
    .article-agenda-header .header-left-side::before{
        width: 180px;
        height: 180px;
    }
    .article-agenda-header .agenda-info{
        padding-left: 2.5rem;
    }
    .article-agenda-header .article-header-social{
        padding-inline: 0;
        max-width: unset;
        width: calc(100% - 4rem);
    }
}


@media screen and (max-width: 980px) {
    .article-agenda-header .top-row-wrapper{
        flex-wrap: wrap;
        padding-inline: 0;
    }
    .article-agenda-header .top-row-wrapper > div{
        width: 100%;
    }
    .article-agenda-header .header-left-side{
        /* padding-inline: calc(2 * var(--mobilePadding)); */
        padding-inline: var(--mobilePadding);
    }
    .article-agenda-header .header-left-side::before{
        left: 40px;
    }
    .article-agenda-header .article-image {
        transform: translateY(0);
        margin-top: 2rem;
    }
    .article-agenda-header .agenda-info .category{
        min-width: 175px;
    }
    .article-agenda-header .article-header-social{
        margin-top: 30px;
        width: calc(100% - 2 * var(--mobilePadding));
    }
}

@media screen and (max-width: 820px) {  
    .article-agenda-header .agenda-header-texts{
        max-width: 600px;
    }
    .article-agenda-header .header-left-side::before{
        width: 150px;
        height: 150px;
        top: -16px;
    }
    .article-agenda-header .article-image {
        margin-left: 0;
        margin-bottom: 0;
    }
    .article-agenda-header .article-header-social{
        margin-bottom: 24px;
    }
}
@media screen and (max-width: 720px) {
    .article-agenda-header .header-left-side::before{
        width: 130px;
        height: 130px;
        left: 13px;
    }
    .article-agenda-header .agenda-info{
        padding-left: 1rem;
    }
    .article-agenda-header .agenda-info .category{
        min-width: 160px;
    }
    .article-agenda-header .lead{
        display: none;
    }
    .article-agenda-header .agenda-info time{
        font-size: 30px;
    }
    .article-agenda-header .agenda-info time .year{
        font-size: 20px;
    }
    .article-agenda-header .article-header-social{
        margin-top: 10px;
    }
}
@media screen and (max-width: 620px) {
    .article-agenda-header .article-title{
        font-size: 28px;
    }
}
@media screen and (max-width: 520px) {
    .article-agenda-header .header-left-side{
        flex-direction: column;
        flex-wrap: wrap;
    }
    .article-agenda-header .header-left-side,
    .article-agenda-header .header-left-side > *{
        width: 100%;
    }
    .article-agenda-header .agenda-info{
        position: relative;
    }
    .article-agenda-header .agenda-info time{
        max-width: 150px;
    }
    .article-agenda-header .article-image{
        /* width:calc(100% + 2 * var(--mobilePadding))!important; */
        --aspect-ratio:1.25!important;
        /* transform: translateY(0); */
        margin-top: 20px;
    }
    .article-agenda-header .agenda-header-texts{
        padding-left: 0;
        margin-block:  0;
    }
    .article-agenda-header .article-title{
        margin-block: 30px 0;
    }
    .article-agenda-header .agenda-info time{
        font-size: 25px;
    }
    .article-agenda-header .agenda-info time .year{
        font-size: 18px;
    }
    .article-agenda-header .top-row{
        position: relative;
    }
    .article-agenda-header .article-header-social{
        flex-wrap: wrap;
        height:auto;
        border:none;
    }
    .article-agenda-header .comments{
        display: flex;
    }
    .article-agenda-header .article-date{
        width: 100%;
        text-align: right;
        order:-1;
        border-bottom: 2px solid var(--txtColor);
        padding-bottom: 12px;
        margin-bottom: 16px;
    }
    .top-header-navigation{
        display: flex;
        width: 73px;
        justify-content: space-between;
        position: absolute;
        right: var(--mobilePadding);
        top: 60px;
        color: var(--txtColor);
    }
    .top-header-navigation > div{
        width: 26px;
        position: relative;
        height: 15px;
    } 
    .top-header-navigation .prev-btn::before{
        content: "\2190";
        position: absolute;
        width: 100%;
        left: 0;
        top: 0;
        font-size: 2rem;
    }
    .top-header-navigation .next-btn::before{
        content: "\2192";
        position: absolute;
        width: 100%;
        right: 0;
        top: 0;
        font-size: 2rem;
    }

    /* .single-agenda .article-grid{
        margin-top: 0;
    } */
}

/* paraskinio single */

.single.para{
    background-color: #12141C;
    padding-top: 2rem;
    margin-bottom: 2rem;
    position: relative;
}

.single.para .article-header > *{
    position: relative;
    z-index: 2;
}

.single.para::before{
    content: "";
    width: 50%;
    height: 100dvh;
    position: absolute;
    left:0;
    top:0;
    background: rgb(20,31,70);
    background: radial-gradient(at top, rgba(20,31,70,1) 10%, rgba(18,20,28,1) 30%);
}
.single.para::after{
    content: "";
    width: 50%;
    height: 100dvh;
    position: absolute;
    left:50%;
    top:0;
    background: rgb(39,19,54,1);
    background: radial-gradient(at 50% 33%, rgba(39,19,54,1) 10%, rgba(18,20,28,1) 30%);
}

.single.para .article-image{
    max-width: 715px;
    width: 100%;
    margin-inline: auto;    
}

/* .single.para::after{
    width: 100%;
    height: 80dvh;
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    background: radial-gradient(circle, rgba(20,31,70,1) 0%, rgba(18,20,28,1) 100%);
    background-size: top center;
    background-repeat: none;
    z-index: -1;
} */

.single.polla .article-grid{
    position: relative;
    z-index: 2;
}

.single.para .article-grid .left-column .card .title,
.single.para .article-grid .left-column .card .card-details,
.single.para .article-header, 
.single.para .article-title, 
.single.para .article-info .author, 
.single.para .article-info .article-date, 
.single.para .article-body,
.single.para .article-footer,
.single.para .article-comments-top h4,
.single.para .article-comments-top .txt,
.single.para .article-body figcaption{
    color: #fff;
} 
.single.polla .article-info .article-date, 
.single.polla .article-info .author{
    color: #777C8C;
}

.single.polla .article-header .comments{
    color: #0025A8;
}

.single.para .footer-link-item .category span,
.single.para .article-grid .left-column .card .card-info .time::before{
    border-color: #fff;
}

.single.polla .article-info{
    border-color: #4862B9;
}

.single.para .section-header h2{
    background-color: #12141c;
    color: #fff;
}

.single.para .article-comments-top .msg-icon,
.single.para .article-header-social .msg-icon,
.single.para .article-header-social .social li{
    filter: brightness(0) invert(1);
}

.single.polla .article-comments-top .msg-icon,
.single.polla .article-header-social .msg-icon,
.single.polla .article-header-social .social li{
    filter: brightness(0) invert(0.5);
}

.article-footer-add a{
    color: #96ADFF;
}

.single.para .para-logo-category{
    max-width: 715px;
    margin-inline: auto;
    margin-bottom: 12px;
}

.single.para .para-logo-category .logo{
    width: fit-content;
    padding-bottom: .5rem;
    border-bottom: 3px solid #f00;
}

.single.para .para-logo-category img{
    width: 237px;
}
.single.polla .para-logo-category .logo{
    display: flex;
    align-items: center;
}
.single.polla .para-logo-category img{
    width: fit-content;
    display: inline;
    margin-right: 11px;
}

.single.para .article-info .article-date::before{
    border-color: #777C8C;
}
/*
.single.para .article-body p:first-of-type:first-letter{
    float:left;
    font-size: 82px;
    line-height: 110%;
    margin-top: -5px;
    margin-left: -72px;
    font-family: "PF Regal Text Pro";
}*/

@media screen and (max-width: 1480px){
    .single.para .article-header .article-info, 
    .single.para .article-header .article-header-social {
        max-width: 715px;
        /* width: 100%; */
    }
}

@media screen and (max-width: 940px) {
    /*
    .single.para .article-body p:first-of-type:first-letter{
        margin-left: 0;
        margin-right: 0.5rem;
        font-size: 50px;
        margin-top: 4px;
        line-height: 100%;
    } */ 
    .single.para::before,
    .single.para::after{
        display: none;
    }

}

@media screen and (max-width: 520px) {
    .single.para .para-logo-category img{
        width: 150px;
    }
    .single.polla .para-logo-category img:first-of-type{
        width: 150px;
    }
    .single.polla .para-logo-category img:last-of-type{
        width: 105px;
    }
}