@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Oswald&family=Roboto+Condensed:wght@300;400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@400;500;600;700&display=swap');
@font-face {
    font-family: PlayfairDisplay;
    src: url(/template/desktop/styles/fonts/PlayfairDisplay/PlayfairDisplay-SemiBold.woff2);    
    font-weight: 600;
    font-display:swap
    
}
@font-face {
    font-family: NotoSerif;
    src: url(/template/desktop/styles/fonts/NotoSerif/NotoSerif-Regular.woff2);
    font-weight: 400; font-display:swap
}

@font-face {
    font-family: NotoSerif;
    src: url(/template/desktop/styles/fonts/NotoSerif/NotoSerif-Medium.woff2);
    font-weight: 500; font-display:swap
}

@font-face {
    font-family: NotoSerif;
    src: url(/template/desktop/styles/fonts/NotoSerif/NotoSerif-SemiBold.woff2);
    font-weight: 600; font-display:swap
}

@font-face {
    font-family: Newsreader;
    src: url(/template/desktop/styles/fonts/Newsreader/newsreader-bold.woff2);
    font-weight: 700; font-display:swap
}
.form-text {
    font-size: 14px;
    color: #dc3545;
    margin-top: 5px;
}

.box-comment .box-content .form-control {
    font-family: Quicksand;
    font-size: 14px;
    font-weight: 600;
    padding: 12px 15px;
    height: 38px;
    border-color: #ddd;
}

.box-comment .heading {
    font-family: NewsreaderDisplay;
    font-weight: 700;
    font-size: 22px;
    line-height: 30px;
    color: #d03927;
    text-transform: uppercase;
    z-index: 1;
    position: relative;
    background: #fff;
    padding-right: 16px;
}

.article__tag .box-content {
    display: flex;
    justify-content: flex-start;
    flex-flow: row wrap;
    padding-left: 10px;
    overflow-x: unset;
}

    .article__tag .box-content a {
        background: #fff;
        border: 1px solid #dee2e6;
        border-radius: 8px;
        margin-right: 12px;
        margin-bottom: 6px;
        padding: 4px 8px;
        font-weight: 600;
        font-size: 13px;
        line-height: 160%;
        color: #212529;
    }

.multimedia-wrapper {
    margin-top: 10px;
    margin-bottom: 30px;
}

    .multimedia-wrapper .story-wrapper {
        display: flex;
        flex-wrap: wrap;
    }

    .multimedia-wrapper .story:nth-child(-n+2) {
        margin-top: 0;
    }

    .multimedia-wrapper .story:nth-child(2n-2) {
        margin-right: 0;
    }

    .multimedia-wrapper .story__heading a {
        font-size: 16px;
        line-height: 22px;
        color: #413836;
        padding-top: 8px;
    }

    .multimedia-wrapper .story {
        width: calc(50% - 10px);
        margin-top: 20px;
        margin-right: 20px;
    }

    .multimedia-wrapper .story__thumb {
        width: 100%;
        height: 28vw;
    }

.story figure {
    margin: 0;
}

.story__thumb {
    border-radius: 3px;
    overflow: hidden;
    background: #e9ecef;
}

.multimedia-wrapper .icon-video {
    width: 21px;
    height: 18px;
    background: url(../images/icon-video.png) center center/21px no-repeat;
}

.multimedia-wrapper .icon-camera {
    width: 18px;
    height: 18px;
    background: url(../images/icon-camera.png) center center/18px no-repeat;
}

.multimedia-wrapper .icon {
    display: inline-block;
    margin: 0 auto;
    font-size: 0;
    margin-right: 5px;
    position: relative;
    top: -5px;
}

.box-info {
    margin-bottom: 22px;
    margin-top: 28px;
}

    .box-info .box-heading {
        margin-bottom: 15px;
    }
    /*@media (min-width: 375px)*/

    .box-info .heading {
        font-size: 22px;
    }

    .box-info .heading {
        font-family: Newsreader;
        font-weight: 700;
        font-size: 25px;
        line-height: 25px;
        text-transform: uppercase;
        color: #d03927 !important;
        letter-spacing: -.02em;
        /*position: relative;
    padding-left: 18px;
    transition: .5s;
    z-index: 1;
    padding-right: 7px;
    background-color: #fff;*/
        position: relative;
        z-index: 1;
        padding-right: 16px;
        background: #fff;
    }

    .box-info .wrap-heading {
        position: relative;
        width: 100%;
    }

        .box-info .wrap-heading::after {
            position: absolute;
            content: "";
            width: 100%;
            border-bottom: 1px solid #d03927;
            bottom: 8px;
            right: 0;
        }

    .box-info .rank-2 {
        margin-top: 16px;
        padding-top: 20px;
        border-top: 1px solid #eee;
    }

    .box-info .rank-1 .story__heading a {
        font-family: PlayfairDisplay;
        font-weight: 500;
        font-size: 18px;
        line-height: 25px;
        padding-top: 8px;
        color: #212529;
    }

    .box-info .rank-1 .story__thumb {  position: relative;height:55vw;     }
    .box-info .rank-2 .story:first-child {
        margin-top: 0;
        padding-top: 0;
        border-top: none;
    }

    .box-info .rank-2 .story {
        overflow: auto;
        margin-top: 20px;
        padding-top: 20px;
        border-top: 1px solid #eee;
    }

    .box-info .rank-2 .story__thumb {  width: 33%;height: 20vw;  float: left;   margin-right: 15px; position: relative;  }
    .box-info .rank-2 .story__heading a {
        font-family: NotoSerif;
        font-weight: 600;
        font-size: 15px;
        line-height: 22px;
        color: #212529;
    }

    .box-info .rank-2 .icon-play {
        position: absolute;
        bottom: 8px;
        left: 8px;
        height: 24px;
        /* box-shadow: 0 0 4px rgb(0 0 0 / 25%); */
        background: url(../images/icon-play_ver3.png) center center/32px no-repeat !important;
    }

    .box-info .rank-1 .icon-play {
        position: absolute;
        bottom: 16px;
        left: 16px;
        height: 72px;
        width: 72px;
        /* box-shadow: 0 0 4px rgb(0 0 0 / 25%); */
        background: url(../images/icon-play_ver3.png) center center/72px no-repeat !important;
    }
.article__body a{color:#0076FF;}
.breadcrumb-wrapper .active{font-size: 20px;line-height: 32px;color: #e21f26;font-weight:bold;}
.courrier_color {color: #d03927!important;}
.author{font-style: normal;font-weight:500;color: #000;}
.related-news .story{margin-top:24px;padding-top:24px;border-top:1px solid #e9ecef}
.related-news .story:first-child{margin-top:0;padding-top:0;border-top:none;}
.article table.picture .caption{text-align:left;font-size:16px;}
.magazine .slick-slide .story__thumb{height:212px;}
.magazine .story__heading a {background:linear-gradient(180deg,rgba(0,0,0,0) 60%,#000 99.30%);}
.wrap-breadcrumb a.active{position:relative;z-index:5;}
.site-body{padding-top:15px;}
.article__title{display:inline-block;}
.back-to-top{background-color: #e82335;}
.box-comment a.btnSubmit{color:#fff;}
.page-header{background:#d03927;}
.page-footer{background-color:#d03927;}
.load-more{background: #bd1723 url(../template/mobile/styles/img/arrow.png) top 12px left 20px/7px no-repeat; padding-left:40px;}
.abf-cate .four-pack .story__thumb {width: 100%; height: 29.6vw;}
.abf-cate .four-pack {margin-top: 5px;}
.abf-cate .wrapper .story__heading a { font-weight: 400; font-size: 15px;line-height: 20px;}
.abf-homepage .rank-1 .story__thumb{height:65vw;}
/*css for logo tet*/
/* .page-header .region-logo {   filter: revert;} */

/*  -- css for audio 15 - 04 - 2024 -- */
.podcast-detail>.audio {    background: url(../images/m.bg-podcast4.jpg) center center/cover no-repeat;  height: 270px;  border-radius: 0;  border: none;  margin:0 -16px;  display: block;  padding-top: 55px;    width: auto;    background-color:#d03927;    text-align: center;}
.podcast-detail .article-header {    border-radius: 6px;    border: 1px solid #dee2e6;    background: rgba(255,255,255,.95);    margin-top: -120px;    position: relative;    z-index: 1;    display: grid;
    padding: 20px;    gap: 10px;}
.article .article__avatar img {    max-width: 100%;    border-radius: 6px;    object-fit: cover;height:100%;}
.podcast-detail .article-header .article__avatar {    margin-bottom: 15px;    margin-left: auto;    margin-right: auto;    width: 150px;    height: 150px;}
.podcast-detail .article-header .time {    font-family: Quicksand; color: #6c757d;    font-size: 14px;    font-weight: 400;    line-height: 150%;    text-align: center;    display: block;}
.podcast-detail .article-header .article__title {       text-align: center;        line-height: 150%;}
.podcast-detail .article-header .article__sapo {    color: #6c757d;    text-align: center;    font-size: 16px;    font-weight: 500;    line-height: 140%;    display: grid;    gap: 6px;}
.podcasts .podcast .story__thumb{border-radius: 6px;padding:unset;box-shadow: 3px 3px 2px #cb7b72;}
.podcasts .podcast .story__thumb img {  border-radius: 6px;}
.podcast h5{padding:10px;}
.multimedia-wrapper .story{float: none;    box-shadow: 0px 0px 3px rgba(0,0,0,0.2);    border-radius: 0 0 4px 4px;}

.multimedia-wrapper .podcast .story__thumb {  height: 40vw;}
.multimedia-wrapper .story h5.story__heading{ padding:10px;}
.multimedia-wrapper .podcast-cate .story {    float: left;    margin-right: 20px;    margin-top: 20px!important;   margin-bottom: 10px;}
.multimedia-wrapper .podcast-cate .story__thumb {    width: 100%;    height: 100%;   min-height: 34vw;    border: 1px solid #e9ecef;  margin: 0 auto;    border-radius: 3px;    overflow: hidden;    background: #e9ecef;}
.multimedia-wrapper .podcast-cate .story__thumb  img {     min-height: 34vw;}
.podcast-cate .heading {    font-family: Newsreader;    font-weight: 700;    font-size: 18px;    line-height: 25px;    letter-spacing: -.02em;    color: #d03927;    text-transform: uppercase;}
.wrap-breadcrumb.podcast {display:flex;}
  /*  -- End css for audio 15 - 04 - 2024 -- */
.article .article__body table a{color: #0076FF;}