/** Related Article **/
.relatedArticles { display: inline-block; width: 100%; float: right; margin-bottom: 40px;position: relative; z-index: 2 }
.relatedArticles ul { display: inline-block; width: 100%; float: right;height:120px }
.relatedArticles ul li.item { float: right; width: calc((100% - 16px) / 2); background:#fff;height: 120px; margin-left: 16px;border-radius:6px; border-bottom: none; padding: 0; position: relative; cursor: pointer }
.relatedArticles ul li.item:last-child{margin-left:0}
.relatedArticles ul li.item a .arrow { float: right; position: absolute; top: 0; right: 0; width: 30px; height: 120px; display: inline-block; background: #0277bd }
.relatedArticles ul li.item a .arrow span { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) }
.relatedArticles ul li.item a .arrow .icon-next:before { content: "i"; color: #fff; font-size: 20px }
.relatedArticles ul li.item a .imageCntnr { width: 130px; height: 120px; float: right; position: relative; overflow: hidden; margin-right: 30px }
.relatedArticles ul li.item a img { position: absolute; top: 0; left: 50%;transform:translateX(-50%); bottom: 0;  margin: 0 auto; width: auto;max-width:unset; 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; }
.relatedArticles ul li.item: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%); }
.relatedArticles ul li.item .desc { float: right; width: calc(100% - 180px); height: auto; cursor: pointer; position: relative; display: inline-block; padding: 0 10px }
.relatedArticles ul li.item .nextPrev:after { float: right; width: 100%; display: inline-block; text-align: right; margin-top:10px;margin-bottom:5px;  font-size: 12px; color: #0079BB; content: "الخبر السابق";font-family:droidBold, Arial }
.relatedArticles ul li.item .desc h3,
.relatedArticles ul li.item .desc .relatedttl{ float: right; display: inline-block; width: 100%; text-align: right;  display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        text-overflow: ellipsis; font-size: 14px; color: #000; line-height: 1.8; height: 75px; overflow: hidden; position: relative; cursor: pointer; 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; }
.relatedArticles ul li.item:hover .desc h3 { color: #0277bd }
.relatedArticles ul li.item:last-child { margin-bottom: 0 }
.relatedArticles ul li.item:last-child { float: left }
.relatedArticles ul li.item:last-child a .arrow { float: left; right: auto; left: 0 }
.relatedArticles ul li.item:last-child a .arrow .icon-next:before { content: "j" }
.relatedArticles ul li.item:last-child a .imageCntnr { float: left; margin-right: 0; margin-left: 30px }
.relatedArticles ul li.item:last-child .desc { float: left }
.relatedArticles ul li.item:last-child .nextPrev:after { content: "الخبر التالى"; text-align: left }
.relatedArticles ul li.item:last-child .desc h3 { float: left; text-align: left }

.relatedArticles ul li.item:last-child .desc .relatedttl{text-align:left}
.euroInner .relatedArticles ul li.item .desc { width: calc(100% - 170px);    padding: 0 10px; }

@media screen and (min-width:1680px) and (max-width:1919px) {
        .relatedArticles ul li.item:nth-of-type(2n) .desc .relatedttl{text-align:left}
}

@media screen and (min-width:1600px) and (max-width:1679px) {
        .relatedArticles ul li.item:nth-of-type(2n) .desc .relatedttl{text-align:left}
}


@media screen and (min-width:1536px) and (max-width:1599px) {
        .relatedArticles ul li.item:nth-of-type(2n) .desc .relatedttl{text-align:left}
}

@media screen and (min-width:1440px) and (max-width:1535px) {
     .relatedArticles ul li.item:nth-of-type(2n) .desc .relatedttl{text-align:left}

}


@media screen and (min-width:1360px) and (max-width:1439px) {

     .relatedArticles ul li.item:nth-of-type(2n) .desc .relatedttl{text-align:left}
}


@media screen and (min-width:1280px) and (max-width:1359px) {
     .relatedArticles ul li.item:nth-of-type(2n) .desc .relatedttl{text-align:left}
     .relatedArticles ul li.item a .imageCntnr{display:none}
     .euroInner .relatedArticles ul li.item .desc{width:calc(100% - 30px);float:left}
          .euroInner .relatedArticles ul li.item:last-child .desc{float:right}

}


@media screen and (min-width:1152px) and (max-width:1279px) {


     .relatedArticles ul li.item:nth-of-type(2n) .desc .relatedttl{text-align:left}
          .relatedArticles ul li.item a .imageCntnr{display:none}
     .euroInner .relatedArticles ul li.item .desc{width:calc(100% - 30px);float:left}
               .euroInner .relatedArticles ul li.item:last-child .desc{float:right}


}

@media screen and (min-width:1024px) and (max-width:1151px) {


     .relatedArticles ul li.item:nth-of-type(2n) .desc .relatedttl{text-align:left}
          .relatedArticles ul li.item a .imageCntnr{display:none}
     .euroInner .relatedArticles ul li.item .desc{width:calc(100% - 30px);float:left}
               .euroInner .relatedArticles ul li.item:last-child .desc{float:right}


}

@media only screen and (max-width: 1023px) {

     .relatedArticles ul li.item:nth-of-type(2n) .desc .relatedttl{text-align:right}
    }

@media screen and (min-width:320px) and (max-width:767px) {
    .euroInner .relatedArticles{padding:0}
    .euroInner .relatedArticles ul li.item {
        width: calc((100% - 10px) /2);margin-left:10px;
        height: auto;border: 1px solid #E8E8E8;
    }
    .relatedArticles ul li.item a img{width:100%;height:auto}
 .euroInner   .relatedArticles ul li.item:last-child {
        margin-left: 0;
    }
  .euroInner  .relatedArticles ul li.item a .arrow {
       height: 32px;
        width: 100%;
        position: relative;
        top: auto;
        right: auto;
    }
   .euroInner .relatedArticles ul li.item .desc h3 {
        height: 72px;
    }
   .euroInner .relatedArticles ul li.item a .arrow span{display:none}
   .euroInner .relatedArticles ul li.item a .nextPrev{    text-align: center;
    display: inline-block;
    width: 100%;
    float: unset;height:100%}
  .euroInner  .relatedArticles ul li.item .nextPrev:after{color:#fff;width:auto;float:none;text-align:center;line-height:32px;margin-top:0}
   .euroInner .relatedArticles ul li.item a .arrow .nextPrev:before{content: "i";color: #fff;font-size: 12px;line-height:32px;margin-left:10px}
   .euroInner .relatedArticles ul li.item:last-child a .arrow .nextPrev:before{content:'j'}
   .euroInner .relatedArticles ul li.item a .imageCntnr{display:inline-block!important;height:110px;margin-right: 0;width:100%}
   .euroInner .relatedArticles ul li:first-child.item a .imageCntnr{float:right;margin-right: 0;margin-top: 0;}
   .euroInner .relatedArticles ul li:last-child.item a .imageCntnr{float:left;margin-left:0}
   .euroInner .relatedArticles ul li.item .desc{    width:100%;margin-right:0;height:122px}
   .euroInner .relatedArticles ul li.item:last-child .desc{margin-left:0}
   .euroInner .relatedArticles ul li.item:last-child.item a .nextPrev{direction:ltr}
   .euroInner .relatedArticles ul li.item:last-child.item a .nextPrev:before{margin-left:0;margin-right:10px}



  .euroInner .relatedArticles ul{height:270px}
     .euroInner .relatedArticles .secName{font-size:12px;font-family:droidBold, arial;color:#0079BB;}
     .euroInner .relatedArticles ul li.item .desc .relatedttl{font-size:13px;height:70px}
}