.latestArticle{display:inline-block;width:100%;float:right;margin-bottom:0;margin-top:15px;background:unset;position:relative;overflow:hidden;height: 334px;}
.latestArticle .ttl h3{background:unset;padding:0;margin-bottom:5px}
.latestArticle .ttl{border-bottom:2px solid #E63B34;margin-bottom:10px}
.latestArticle .ttl h3 a{color:#000000;font-size:17px;}
.latestArticleLI{width:100%;      display: flex;overflow: hidden;}
  
.latestArticle ul li { margin-bottom: 0; width: 210px; margin-left: 12px; height: 230px; position: relative;border: 1px solid #E8E8E8;background: #FFF; overflow: hidden;display: inline-block ;flex: 0 0 210px;}

/*.latestArticle ul li:nth-of-type(3n) { margin-left: 0 }*/
.latestArticle ul li .imageCntnr {     position: relative;
    overflow: hidden;
    padding-bottom: 56.25%;
    display: inline-block;
    float: right;
    width: 100%;}
.latestArticle .flickity-enabled  li:first-child{margin-right:12px}
.latestArticle ul li a img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: 0 auto; width: 100%; height: 100%; border: none; filter: brightness(100%) contrast(100%); -webkit-filter: brightness(100%) contrast(100%); -moz-filter: brightness(100%) contrast(100%); -o-filter: brightness(100%) contrast(100%); -ms-filter: brightness(100%) contrast(100%); transition: all 0.2s ease-in-out 0s; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; }
.latestArticle ul li:hover img { filter: brightness(108%) contrast(108%); -webkit-filter: brightness(108%) contrast(108%); -moz-filter: brightness(108%) contrast(108%); -o-filter: brightness(108%) contrast(108%); -ms-filter: brightness(108%) contrast(108%) }
.latestArticle ul li .desc { width: 100%; cursor: pointer; display: inline-block; float: right; padding: 10px }
.latestArticle ul li .desc h2 { display: inline-block; float: right; width: 100%; color: #000; text-align: right; line-height: 1.8; font-size: 14px;   direction: rtl; height: 50px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.latestArticle ul li:hover .desc p { color: #0277bd }
.latestArticle ul li .sectionTarget {padding: 0 0 0 10px; font-size: 13px; font-family:DroidKufiBold, tahoma;   position: relative;color: #E63B34;z-index: 1;height: 30px;line-height: 2.3;width: 100%;height: 25px;overflow: hidden;}


.latestArticle .flickity-button{width:32px;height:32px;background: #E63B34;top: 4px;opacity:1;margin-top:0}
.latestArticle .flickity-button:before{color:#fff!important;font-size:14px!important;line-height:32px}
.latestArticle .flickity-button:disabled{opacity:1;border: 1px solid #AFAFAF;background: #F8F8F8;}
.latestArticle .flickity-button:disabled:before{color:#AFAFAF!important}
 .latestArticle   .flickity-button.previous{left:40px;right:auto}
.latestArticle .flickity-enabled.is-draggable{text-align:center;overflow:hidden;    display: inline-block;}
.latestArticle .flickity-page-dots{display:inline-block;width:auto;margin-top:10px;margin-bottom:0}
.latestArticle .flickity-page-dots li{height:10px;width:10px;background:#E0E0E0;border-radius:50%;margin-left:5px}
.latestArticle .flickity-page-dots li:last-child{margin-left:0}
.latestArticle .flickity-page-dots li.is-selected{background:#E63B34}

.LatestArticleLI.flickity-enabled.is-draggable {
    display: inline-block;
    overflow: visible;
    width: 100%;
}
.latestArticle .LatestArticleLI.flickity-enabled.is-draggable li {
    float: right;
    width: 210px;
    flex: unset;
}
.latestArticle .flickity-button.previous{left:40px}

.latestArticle ul li.ramadan .secName { color: #330D46 }
.latestArticle ul li.news .secName { color: #E03322 }
.latestArticle ul li.sports .secName { color: #056818 }
.latestArticle ul li.arts .secName { color: #A8006B }
.latestArticle ul li.howa_w_hya .secName { color: #7b1fa2 }
.latestArticle ul li.autos .secName { color: #1a237e }
.latestArticle ul li.islameyat .secName { color: #075C99 }
.latestArticle ul li.ecommerce .secName { color: #542f00 }

@media screen and (min-width:320px) and (max-width:767px) {
    .latestArticle{padding:0 ;margin-top:30px}
    .latestArticle .flickity-button.previous{left:40px}
        .latestArticle .flickity-button.next{left:0}

    .latestArticle ul li:first-child{margin-right:12px}


   .latestArticle .flickity-page-dots{margin:20px 0 0}
   }