/********** Featured Area **********/
.featuredArea { margin-left: 20px; width: calc(100% - 320px); float: right; background: none; position: relative }
.featuredArea.fixed { width: 930px !important; position: fixed; top: 67px; right: calc(((100% - 1282px) / 2) + 16px); background: none !important }
.featuredArea ul { display: inline-block; float: right; width: 100%; }
.featuredArea ul li { float: right; margin-left: 16px; margin-bottom: 16px; width: calc((100% - 32.1px) / 3); height: auto; position: relative; overflow: hidden;transition:none}
.featuredArea ul li .link { display: block }
.featuredArea ul li .link .imageCntnr { position: relative; overflow: hidden; padding-bottom: 56.25%; display: inline-block; float: right; width: 100% }
.featuredArea ul li:first-child .link .imageCntnr { padding-bottom: calc(56.25% + 6px) }
.featuredArea ul li .link img { position: absolute; top: 50%; right: auto; bottom: auto; left: 50%; transform: translate(-50%, -50%); margin: 0 auto; width: 100%; height: 100%;object-fit:cover; border: none; }
.featuredArea ul li:first-child { width: calc(100% - ((100% + 16px) / 3)) }
.featuredArea ul li:nth-child(2), .featuredArea ul li:nth-child(3), .featuredArea ul li:last-child { margin-left: 0 }
.featuredArea ul li:nth-child(4), .featuredArea ul li:nth-child(5), .featuredArea ul li:last-child { margin-bottom: 0 }
.featuredArea .desc { width: 100%; height: 50%; cursor: pointer; position: absolute; bottom: 0; right: 0; pointer-events: none; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0); }
.featuredArea .desc .details { position: absolute; bottom: 6px; right: 0; width: 100% }
.featuredArea ul li span { display: inline-block; float: right; margin-right: 10px;margin-bottom: 6px;height:20px;max-height:20px;min-height:20px}
.featuredArea ul li .secName { display: inline-block;float:right; padding: 0 6px; font-size: 11px; color: #fff; background: #E03322;font-family:inherit; z-index: 1; height: 20px; line-height: 20px; pointer-events: visible; transition:none}
.featuredArea .desc h2 { display: inline-block; display: -webkit-box; width: 100%; float: right; color: #fff; text-align: right;font-family:inherit; max-height: 44px;min-height:22px; line-height: 1.6; padding: 0 10px; font-size: 14px;-webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;transition:none}
.featuredArea ul li:first-child .desc h2 { font-size: 18px; line-height: 1.8; max-height: unset;min-height:32px }
.leftSide { display: inline-block; float: left; width: 300px }
.ramadan .leftSide{position:relative;z-index:100}
 /*featuredsticky in ramdan*/
.featuredHintSticky{ margin-left: 20px; width: calc(100% - 320px); float: right; background: none; position: relative;z-index:2}
.featuredHintSticky.fixed { width: 930px !important; position: fixed; top: 67px; right: calc(((100% - 1282px) / 2) + 16px); background: none !important }
.ramadan  .featuredArea, .ramadan  .HintSection{width:100%}


/********** Akhbar Themak **********/
.akhbarthemak { display: inline-block; float: left;width:100%;height:655px; }
.akhbarThemak { float: right; width: 300px; height:625px; box-shadow: none; overflow: hidden; position: relative; border: 1px solid #e8e8e8; background: #fff }
.akhbarThemak .ttl { display: inline-block; float: right; width: 100%; height: 48px; overflow: hidden; padding: 0 12px; background: #E03322; border-bottom: none !important }
.akhbarThemak .ttl .inTtl { float: right; display: inline-block; padding: 0px; font-family: DroidKufiBold, Arial; font-size: 18px; background: none !important; color: #fff; display: block; line-height: 48px; }
.akhbarThemak .ttl .inTtl:after { display: none }
.akhbarThemak .ttl .inTtl a { color: #fff }
.akhbarThemak .ttl .icons { display: inline-block; float: left; }
.akhbarThemak .ttl .icons .cd-popup-setting, .akhbarThemak .ttl .icons .cd-popup-notify { display: inline-block; float: right; }
.akhbarThemak .ttl .icons .cd-popup-notify { margin-right: 10px }
.akhbarThemak .ttl .icons .icon-setting:before { content: "p"; color: #fff; font-size: 20px; line-height: 48px }
.akhbarThemak .ttl .icons .icon-notify:before { content: "i"; color: #fff; font-size: 22px; line-height: 48px }
.akhbarThemak .popupSetting, .akhbarThemak .popupNotify { position: fixed; left: 0; top: 0; height: 100%; width: 100%; background-color: rgba(0, 0, 0, 0.8); opacity: 0; visibility: hidden; -webkit-transition: opacity 0.3s 0s, visibility 0s 0.3s; -moz-transition: opacity 0.3s 0s, visibility 0s 0.3s; transition: opacity 0.3s 0s, visibility 0s 0.3s; }
.akhbarThemak .popupSetting.is-visible, .akhbarThemak .popupNotify.is-visible { opacity: 1; visibility: visible; z-index: 10; -webkit-transition: opacity 0.3s 0s, visibility 0s 0s; -moz-transition: opacity 0.3s 0s, visibility 0s 0s; transition: opacity 0.3s 0s, visibility 0s 0s; }
.akhbarThemak .cd-popup-container { position: absolute; padding: 24px; width: 1000px; height: 500px; left: 50%; top: 50%; transform: translate(-50%,-50%); background: #FFF; text-align: center; box-shadow: 0 0 20px rgba(0, 0, 0, 0.4); -webkit-backface-visibility: hidden; -webkit-transition-property: -webkit-transform; -moz-transition-property: -moz-transform; transition-property: transform; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; transition-duration: 0.3s; }
.akhbarThemak .cd-popup-container h2 { display: inline-block; width: 100%; font-family: DroidKufiBold, Arial; font-size: 22px; color: #1d1d1d; margin-bottom: 0; padding: 0; background: none; }
.akhbarThemak .cd-popup-container h2:after { display: none }
.akhbarThemak .cd-popup-container h4 { display: inline-block; float: right; width: 100%;  font-size: 13px; color: #666; margin-bottom: 12px; padding: 0; text-align: right }
.akhbarThemak .cd-popup-container .sectionContainer { display: inline-block; float: right; width: 100%; position: relative }
.akhbarThemak .cd-popup-container .sec { display: inline-block; width: calc((100% - 160px) / 5); float: right; margin-left: 12px }
.akhbarThemak .cd-popup-container .sec:last-child { margin-left: 0; width: 100px }
.akhbarThemak .cd-popup-container h3 { display: inline-block; width: 100%; font-family: DroidKufiBold, Arial; font-size: 14px; color: #1d1d1d; margin-bottom: 12px; padding-right: 0; background: #eee }
.akhbarThemak .cd-popup-container .cd-buttons { position: absolute; left: 50%; bottom: 20px; width: 410px; height: 50px; transform: translateX(-50%) }
.akhbarThemak .cd-popup-container .cd-buttons a { position: relative; top: 0; left: 0; float: right; background: #ddd; margin-left: 10px; width: 200px; height: 50px;  font-size: 14px; color: #1d1d1d; text-align: center; display: inline-block; line-height: 50px; }
.akhbarThemak .cd-popup-container .cd-buttons a:before, .akhbarThemak .cd-popup-container .cd-buttons a:after { display: none }
.akhbarThemak .cd-popup-container .cd-buttons a:first-child { background: #E03322; color: #fff }
.akhbarThemak .cd-popup-container .cd-buttons a:hover { background: #ccc }
.akhbarThemak .cd-popup-container .cd-buttons a:first-child:hover { background: #E03322 }
.akhbarThemak .cd-popup-container .cd-buttons a:last-child { margin-left: 0 }
/** Notify **/
.akhbarThemak .cd-popup-notify { position: relative }
.akhbarThemak .cd-popup-notify .ntfyNum { position: absolute; top: 8px; right: -10px; width: 17px; height: 17px; background: red; border-radius: 50%; color: #fff; text-align: center; font-family: Arial; font-size: 12px; line-height: 1.5 }
.akhbarThemak .cd-popup-container.notify { width: 700px; height: 150px }
.akhbarThemak .cd-popup-container.notify p { display: inline-block; width: 100%;  font-size: 15px; text-align: center; color: #1d1d1d; margin-bottom: 0; padding: 0; line-height: 102px }
.akhbarThemak .cd-popup-container .cd-popup-close { position: absolute; top: 12px; left: 12px; width: 36px; height: 36px; }
.akhbarThemak .cd-popup-container .cd-popup-close::before, .akhbarThemak .cd-popup-container .cd-popup-close::after { content: ''; position: absolute; top: 0; width: 2px; height: 100%; background-color: #1d1d1d; opacity: 0.2; 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; }
.akhbarThemak .cd-popup-container .cd-popup-close:hover::before, .akhbarThemak .cd-popup-container .cd-popup-close:hover::after { opacity: 1 }
.akhbarThemak .cd-popup-container .cd-popup-close::before { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
.akhbarThemak .cd-popup-container .cd-popup-close::after { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }
body.popupOverlay { position: fixed;top: 0;left: 0;bottom: 0;right: 0; }
.akhbarThemak ul { display: inline-block; float: right; width: 100%; padding: 0 10px; }
.akhbarThemak li { width: 100%; display: inline-block; float: right; padding: 10px 0; position: relative; border-bottom: 1px solid #e8e8e8 }
.akhbarThemak li:last-child { border-bottom: none }
.akhbarThemak ul li .item .imageCntnr { position: relative; overflow: hidden; padding-bottom: calc((100px * 75) / 100); float: right; width: 100px; }
.akhbarThemak li img { position: absolute; top: 0; bottom: 0; left: 50%; transform: translateX(-50%); margin: 0 auto; float: right; width: auto; max-width: unset; height: 100%;object-fit: cover; }
.akhbarThemak li .cnts { display: inline-block; float: right; width: calc(100% - 100px); padding-right: 10px }
.akhbarThemak li h2 { float: right; width: 100%;  color: #000; font-size: 13px; line-height: 1.6; height: 42px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.akhbarThemak li .secName { display: inline-block; float: right; margin-bottom: 6px; font-family: DroidKufiBold, Arial; color: #fff; font-size: 12px; }
/*.akhbarThemak li .secName:before{content:"";float:right;margin-left:5px;width:4px;height:12px;background:#E03322;margin-top:4px}*/
.akhbarThemak li.native{padding: 0;border-bottom: none;}
.akhbarThemak.fixed { position: fixed }


.infoClips { display: inline-block; float: right; width: 100%; }

/******** waya *******/
.waya { display: inline-block; float: right; width: calc(100% - 640px); height: 266px; position: relative; background-color: #fff; overflow: hidden; border: 1px solid #e8e8e8; margin-left: 20px }
.waya .wayaLogo { display: inline-block; float: right; width: 100%; height: auto; position: absolute; bottom: 3px; left: 0; z-index: 2; height: 20px; background-color: rgb(255, 99, 30); overflow: hidden; }
.waya .wayaLogo p { display: inline-block; float: left; color: #fff;  font-size: 9px; line-height: 2.5; margin-right: 5px }
.waya .wayaLogo img { display: inline-block; position: relative; width: 35px; height: auto; border: 0; float: left; margin: 5px; margin-right: 5px; }
.waya .title { display: inline-block; float: right; width: 100%; padding: 12px 10px; background: linear-gradient(to right, #ff5920 , #ff7e27); height: 50px }
.waya .title .rss { display: inline-block; float: right; width: 20px; height: 20px; margin-left: 8px; border: 0 }
.waya .title .rss:before { content: 'A'; color: #fff; font-size: 20px; line-height: 1.4 }
.waya .title .text { display: inline-block; width: auto; float: right; }
.waya .title .text p { display: inline-block; float: right; color: #fff; font-family: DroidKufiBold, Arial; font-size: 15px; cursor: auto }
.waya .title .text p span {#cd-lateral-nav.lateral-menu-is-open font-weight: bold; font-family: Arial; font-size: 16px }
.waya .title .more { display: inline-block; float: left; font-size: 14px;  color: #fff; border-bottom: 1px solid #fff; position: relative; line-height: 1.5 }
.waya .title .more:before { content: ''; width: 100%; height: 1px; background-color: #fff; position: absolute; bottom: -4px; right: 0 }
.waya .content { display: inline-block; width: 100%; float: right; background-color: #fff; padding: 0 }
.waya .content ul { width: 100%; height: 268px; overflow-x: auto; direction: rtl; padding: 10px; }
.waya .content li { display: inline-block; width: 100%; float: right; padding: 10px; border: 1px solid #e8e8e8; margin-bottom: 12px; background-color: #fff; }
.waya .content li a { display: inline-block; width: 100%; height: 100% }
.waya .content li:last-child { margin-bottom: 26px }
.waya .content li .imageCntnr { display: none; width: 80px; float: right; position: relative; padding-bottom: calc((80px * 75)/ 100); margin-left: 15px }
.waya .content li .imageCntnr img { display: inline-block; position: absolute; width: 100%; height: 100%; right: 0; top: 0 }
/*.waya .content li p{display:inline-block;width:calc(100% - 95px);font-size:16px;color:#000;line-height:1.6;padding-left:10px;max-height:48px;overflow:hidden}*/
.waya .content li p { display: inline-block; width: 100%;  font-size: 14px; color: #000; line-height: 1.6; max-height: 48px; overflow: hidden }
.waya .border { display: inline-block; float: right; width: 100%; height: 3px; background: linear-gradient(to right, #ff5920 , #ff7e27); position: absolute; right: 0; bottom: 0 }
.waya .content ul::-webkit-scrollbar { width: 8px; }
.waya .content ul::-webkit-scrollbar-track { box-shadow: inset 0 0 2px grey; }
.waya .content ul::-webkit-scrollbar-thumb { background: #c0c0c0; }
/******** waya *******/
.threeDiv .waya { width: calc((100% - 324px) /2); margin: 0 12px }

/** Video Popup **/
.openVideoPopupMain { overflow: hidden !important }
.videoPlayerPopup { position: fixed; top: 50px; left: 0; right: 0; bottom: 0; width: 100%; padding: 60px 200px; height: calc(100% - 50px); background: linear-gradient(45deg,#1d1d1d,#222,#1d1d1d); visibility: hidden; opacity: 0; z-index: 200; }
/*.videoPlayerPopup:before {content: "";width: 100%;height: 100%;position: absolute;top: 0;left: 0;right: 0;bottom: 0;background: url(../Images/ACN2022/videoPopupBG.png) center center repeat;background-size: auto 40%;opacity: 0.05;pointer-events: none;}*/
.openVideoPopupMain .videoPlayerPopup { visibility: visible; opacity: 1 }
.videoPlayerPopup .closeVideoPopup { position: absolute; width: 50px; height: 50px; top: 20px; left: 20px; border-radius: 50%; background: #E03322; transition: none; opacity: 0; visibility: hidden }
.openVideoPopupMain .videoPlayerPopup .closeVideoPopup { visibility: visible; opacity: 1 }
.openVideoPopupMain .videoPlayerPopup .videoPlayerContainer { height: 100% }
.videoPlayerPopup .videoSponsor { position: absolute; top: 60px; right: 60px; }
.videoPlayerPopup .videoSponsor img { width: auto; height: 60px }
.videoPlayerPopup .closeVideoPopup:after, .videoPlayerPopup .closeVideoPopup:before { content: ''; position: absolute; top: 50%; margin-top: -15px; width: 2px; height: 30px; background-color: #fff; }
.videoPlayerPopup .closeVideoPopup:before { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
.videoPlayerPopup .closeVideoPopup:after { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }
.videoPlayerPopup .playerPopupCntnr { width: 100%; height: 100%; display: -ms-flexbox; display: flex; position: relative; transition: none; opacity: 0; visibility: hidden }
.openVideoPopupMain .videoPlayerPopup .playerPopupCntnr { visibility: visible; opacity: 1 }
.videoPlayerPopup .mainVideo { display: inline-block; float: right; width: calc(100% - 400px); position: relative; padding-left: 40px }
.videoPlayerPopup .mainVideo .jp-container { max-height: 500px; height: auto }
.videoPlayerPopup .mainVideo .jspTrack { background: #171c2a; border-left: 1px solid #2c3348; }
.videoPlayerPopup .mainVideo .jspDrag { background: rgba(255,255,255,0.2) }
.videoPlayerPopup .mainVideo .cntnr { display: inline-block; float: right; width: 100%; height: 0; position: relative; padding-bottom: 56.5%; background: #000; overflow: hidden; }
.videoPlayerPopup .mainVideo .cntnr iframe { position: absolute; width: 100%; height: 100%; top: 50%; left: 50%; transform: translate(-50%,-50%); }
.videoPlayerPopup .mainVideo .cntnr .twitter-tweet { margin: 0 !important; position: absolute; width: 100% !important; height: 100% !important; max-width: 100% !important; top: 0; right: 0; left: 0; bottom: 0; overflow-y: auto; }
.videoPlayerPopup .mainVideo .cntnr .twitter-tweet iframe { position: absolute !important; width: 550px !important; height: auto; top: 0; transform: translateX(-50%); background: #fff; min-height: 100% !important }
.videoPlayerPopup .mainVideo .desc { display: inline-block; float: right; width: 100%; padding: 20px 16px; position: relative }
.videoPlayerPopup .mainVideo .desc p { display: inline-block; float: right; width: calc(100% - 120px); font-family: DroidKufiBold, arial; color: #fff; font-size: 26px; line-height: 1.8; overflow: hidden; height: 92px }
.videoPlayerPopup .mainVideo .desc p.date { font-size: 13px; color: rgba(255,255,255,0.5); max-height: unset; margin-bottom: 10px;  height: auto; padding: 8px 0 }
.videoPlayerPopup .mainVideo .shareMenu { position: absolute; left: 0; top: 20px; }
.videoPlayerPopup .mainVideo .shareMenu a { float: right; display: inline-block; width: 40px; height: 40px; text-align: center; line-height: 40px; font-size: 18px; color: #fff; margin-left: 10px; border: 1px solid #fff; border-radius: 50% }
.videoPlayerPopup .mainVideo .shareMenu a:before { line-height: 38px }
.videoPlayerPopup .mainVideo .shareMenu a:last-child { margin-left: 0; position: relative; }
.videoPlayerPopup .mainVideo .shareMenu a.icon-tw { margin-left: 0 }
.videoPlayerPopup .mainVideo .shareMenu a.icon-fb:hover { background: #4267b2; border: 1px solid #4267b2 }
.videoPlayerPopup .mainVideo .shareMenu a.icon-tw:hover { background: #1da1f2; border: 1px solid #1da1f2 }
.videoPlayerPopup .mainVideo .shareMenu a.icon-fb:before { content: "u"; }
.videoPlayerPopup .mainVideo .shareMenu a.icon-tw:before { content: "?"; }
.videoPlayerPopup .mainVideo .shareMenu a.icon-wapp:before { content: "S"; }
.videoPlayerPopup .mainVideo .shareMenu a.icon-wapp { display: none }
/** Video Popup Left **/
.videoPlayerPopup aside { display: inline-block; float: right; width: 400px; background: rgba(0,0,0,0.3); /*border-right:4px solid #E03322;*/ overflow: hidden; }
.videoPlayerPopup aside h2 { display: inline-block; float: right; width: 100%; font-family: DroidKufiBold, arial; color: #fff; font-size: 16px; text-align: right; padding: 10px 16px; background: rgba(0,0,0,0.5); border-bottom: 1px solid rgba(255,255,255,0.2) }
.videoPlayerPopup aside .playerList { display: inline-block; float: right; width: calc(100% + 17px); padding: 10px; position: relative; height: calc(100% - 52px); overflow: auto; padding: 0; }
.videoPlayerPopup aside .playerList li { display: inline-block; float: right; width: 100%; padding: 12px; 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; }
.videoPlayerPopup aside .playerList li .imageCntnr { position: relative; overflow: hidden; padding-bottom: calc((110px * 67)/ 100); width: 110px; height: 100%; display: inline-block; float: right; }
.videoPlayerPopup aside .playerList li .imageCntnr img { position: absolute; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0 }
.videoPlayerPopup aside .playerList li.playing, .videoPlayerPopup aside .playerList li:hover { background: rgba(0,0,0,0.4); }
.videoPlayerPopup aside .playerList li.playing .desc p, .videoPlayerPopup aside .playerList li:hover .desc p { color: #A8006B }
.videoPlayerPopup aside .playerList li .desc { display: inline-block; float: right; width: calc(100% - 110px); padding: 4px 16px }
.videoPlayerPopup aside .playerList li .desc p { display: inline-block; float: right; width: 100%; overflow: hidden;  color: #fff; font-size: 13px; line-height: 1.6; max-height: 42px; overflow: hidden; margin-bottom: 0px }
.videoPlayerPopup aside .playerList li .desc p.date { font-size: 11px; color: rgba(255,255,255,0.5); max-height: unset; margin-bottom: 6px }
.videoPlayerPopup aside .playerList li .icon { width: 22px; height: 22px; float: right; margin-left: 10px; text-align: center; background: #E03322; position: absolute; top: 0; right: 0; z-index: 1; }
.videoPlayerPopup aside .playerList li .icon:before { content: "s"; margin-left: 2px; color: #fff; font-size: 13px; line-height: 22px; }
.videoPlayerPopup aside .playerList li.adsList:hover { background: transparent }
.videoPlayerPopup aside .playerList .sponsorBanner { display: inline-block; float: right; width: 100%; }
.videoPlayerPopup aside .playerList .sponsorBanner img { width: 100%; height: auto }
.videoPlayerPopup aside .playerList .acn-loader {position: absolute;width: 70px;height: 70px;top: 50%;left: 50%;transform: translate(-50%, -50%);}
.videoPlayerPopup aside .playerList .acn-loader img{width:100%;}

/********** Entrypoints **********/
.entrypoints { background: none; box-shadow: none; width: 300px; height: 266px; margin-left: 20px }
.entrypoints .bx-wrapper:first-child { margin-bottom: 20px !important }
.entrypoints ul { display: inline-block; width: 300px !important; height: 121px !important; margin-bottom: 20px; overflow: hidden; float: right }
.entrypoints ul:last-child { margin-bottom: 0 }
.entrypoints ul li { display: inline-block; width: 100%; transition: none; }
.entrypoints ul li img { width: 300px; height: 121px }
.acnDiv .acnCntnr { display: inline-block; text-align: center; width: 948px; float: right; margin: 0 calc((100% - 948px) / 2) 24px; }
.acnDiv .entryPointSlider { display: inline-block; width: auto; height: 266px !important; margin-left: 24px }
.acnDiv .entryPointSlider li { display: inline-block; float: right; width: 300px; height: 266px; margin-left: 24px; background: #fff }
.acnDiv .entryPointSlider li:last-child { margin-left: 0 }
.acnDiv .entryPointSlider li img { width: 100% !important; height: 266px !important }


/********** Latest News **********/
.pattern01 { padding: 0; background: none; box-shadow: none; position: relative; z-index: 3 }
.pattern01 .ttl h3 { padding: 0; background: none !important; color: #1d1d1d }
.pattern01 .allItems { display: inline-block; width: 100%; padding: 16px 0 0 }
.pattern01 ul li { float: right; margin-left: 16px; margin-bottom: 16px; width: calc((100% - 64px) / 5); height: auto; position: relative; overflow: hidden; display: inline-table; background: #fff; border: 1px solid #e8e8e8; }
.pattern01 ul li a { display: block }
.pattern01 ul li .item .imageCntnr { position: relative; overflow: hidden; padding-bottom: 56.25%; float: right; display: inline-block; width: 100%; }
.pattern01 ul li .item img:not(article .details .divVideoStep .ivbsThumbWrapper>img) { position: absolute; top: 50%; right: auto; bottom: auto; left: 50%; transform: translate(-50%,-50%); margin: 0 auto !important; width: 100%; height: auto; transition: none }
.pattern01 ul li:nth-child(5n) { margin-left: 0 }
.pattern01 ul li:nth-last-child(-n+5) { margin-bottom: 0 }
.pattern01 ul li .desc { width: 100%; overflow: hidden; cursor: pointer; position: relative }
.pattern01 ul li .desc h2 { color: #1d1d1d; height: 68px; cursor: pointer; overflow: hidden; text-align: right; line-height: 1.6; font-size: 14px; padding: 0 10px; margin: 40px 0 10px;  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; 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; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s }
.pattern01 ul li .item .desc:hover h2 { color: #666 }
.pattern01 ul li .secName { font-family: DroidKufiBold, Arial; font-size: 12px; color: #fff; display: inline-block; position: absolute; top: 10px; right: 10px; pointer-events: visible }
/*.pattern01 ul li .secName:after{content:"";width:4px;height:14px;background:#E03322;float:right;margin-left:5px;margin-top:6px}*/
/*.pattern01 ul li .secName:hover{color:#1d1d1d}*/
/*.pattern01 ul li.icon-video, .pattern01 ul li.icon-image{background:#1d1d1d;}
.pattern01 ul li.icon-video .desc p, .pattern01 ul li.icon-image .desc p{color: #fff;padding: 10px}
.pattern01 ul li.icon-video .item:hover .desc p, .pattern01 ul li.icon-image .item:hover .desc p{color:#666}
.pattern01 ul li.icon-video .secName, .pattern01 ul li.icon-image .secName{margin-right:10px;color:#bbb;}
.pattern01 ul li.icon-video .secName:hover, .pattern01 ul li.icon-image .secName:hover{color:#666}*/
.pattern01 ul li.icon-video .imageCntnr span,
.pattern01 ul li.icon-image .imageCntnr span { position: absolute; width: 32px; height: 32px; left: 4px; top: 4px; z-index: 1; line-height: 32px; text-align: center; background: #E03322; border-radius: 50%; }
.pattern01 ul li.icon-video .imageCntnr span:before,
.pattern01 ul li.icon-image .imageCntnr span:before { color: #fff; font-size: 17px; line-height: 32px; opacity: 1; transition: all .2s ease-in-out 0s; -webkit-transition: all .2s ease-in-out 0s; -moz-transition: all .2s ease-in-out 0s; -ms-transition: all .2s ease-in-out 0s; -o-transition: all .2s ease-in-out 0s; }
.pattern01 ul li.icon-image .imageCntnr span:before { content: "t";  }
.pattern01 ul li.icon-video .imageCntnr span:before { content: "s"; margin-left: 2px }

/********** Most Read **********/
.mostRead { padding: 10px; height: 616px; width: calc(100% - 648px); float: right; margin-left: 24px; border: 1px solid #e8e8e8 }
.mostRead .ttl { height: 40px }
.mostRead .ttl h3 { padding: 0; background: none !important; line-height: 40px; color: #1d1d1d; font-size: 18px; }
.mostRead .ttl h3 a { color: #1d1d1d }
.mostRead .ttl .more { line-height: 40px }
.mostRead .ttl .icon-more:before { line-height: 40px }
.mostRead .allItems { display: inline-block; width: 100%; padding: 16px 0 0; }
.mostRead .allItems li { width: 100%; margin-bottom: 24px; display: inline-block; position: relative; float: right; }
.mostRead .allItems li:after { content: ""; position: absolute; bottom: -12px; right: 0; width: 100%; height: 1px; background: #ddd }
.mostRead .allItems li:last-child:after { display: none }
.mostRead ul li .item .imageCntnr { position: relative; overflow: hidden; padding-bottom: calc((116px * 75) / 100); float: right; width: 116px; }
.mostRead .allItems li img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: 0 auto; width: 100%; height: 100%; float: right; }
.mostRead .allItems li .cnts { display: inline-block; float: right; width: calc(100% - 116px); padding-right: 12px }
.mostRead .allItems li .desc { display: inline-block; float: right; width: 100%; }
.mostRead .allItems li .desc h2 {  font-size: 14px; color: #1d1d1d; line-height: 1.6; height: 46px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.mostRead .allItems li .secName { display: inline-block; float: right; font-family: DroidKufiBold, Arial; font-size: 12px; color: #fff; margin-bottom: 6px }
/*.mostRead .allItems li .secName:after{content:"";width:4px;height:14px;background:#E03322;float:right;margin-left:5px;margin-top:3px}*/
.mostRead .allItems li .number { position: absolute; top: 0px; right: 0px; width: 26px; height: 26px; border-left: 1px solid #fff; border-bottom: 1px solid #fff; background: #E03322; color: #fff; font-family: Arial; font-weight: bold; font-size: 20px; text-align: center; line-height: 1.3; pointer-events: none; z-index: 1 }
.mostRead .allItems li .item:hover .desc p { color: #666 }

/********** Special Files **********/
.specialFilesSlider {display: inline-block;position: relative;float: left;width: 100%;}
.specialFiles { padding: 0; width: 300px; height: 225px; margin-bottom: 24px; direction: ltr; overflow: hidden; }
.specialFiles  .specialFilesLi{ position: relative; overflow: hidden;height:225px;width:100% }
.specialFiles  .specialFilesLia { display: block }
.specialFiles  .specialFilesLia img { width: 100%; height: 100%; max-height: 225px;object-fit: cover;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%); }
.specialFiles .desc { width: 100%; height: 50%; overflow: hidden; cursor: pointer; position: absolute; bottom: 0; right: 0; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0); }
.specialFiles .desc p { color: #fff; text-align: center; line-height: 1.6; padding: 10px; font-size: 16px;  position: absolute; bottom: 10px; right: 0; height: auto; overflow: hidden; margin-bottom: 5px }
.specialFiles .name { width: 150px; height: 70px; background: #E03322; border-bottom: 5px solid #fff; position: absolute; left: -52px; top: -8px; z-index: 999; pointer-events: none; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); }
.specialFiles .name h2, .specialFiles .name span { padding: 0; font-family: DroidKufiBold, arial; color: #fff; font-size: 16px; display: block; line-height: 6.3; text-align: center; }
.bx-wrapper { width: 100%; height: auto; position: relative; z-index: 0 }
.bx-wrapper img { max-width: 100%; display: block; border: none }
.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto { position: absolute; bottom: 0; width: 100%; }
.IslameyatProg ul li.icon-video:before { content: "s"; color: #fff; font-size: 40px; position: absolute; top: 50%; left: 50%; margin-top: -20%; margin-left: -5%; width: 40px; height: 40px; z-index: 1; opacity: 0.7 }
.specialFiles  .flickity-viewport{width:100%;display:inline-block;float:left;height:100%}
.specialFiles  .flickity-slider{width:100%;display:inline-block;float:left;height:100%}
.flickity-button{width: 48px;
    top: 50%;
    margin-top: -39px;
    outline: 0;
    display: inline-block;
    position: absolute;
    color: #fff;
    opacity: 0.7;
    z-index: 99;background:transparent}
.specialFiles ul li {
    position: relative;
    overflow: hidden;
    height: 225px;
}
.specialFiles ul li a {
    display: block;
}
.imageCntnr {
    overflow: hidden;
}


.specialFiles ul li a img {
    width: 100%;
    height: 100%;
    max-height: 225px;
    object-fit: cover;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
.specialFiles  li.dot{height: 12px;
    width: 12px;
    margin-top: 10px;}
.flickity-button svg{display:none}
.flickity-button.previous{right:0}
.flickity-button.next{left:0}
.flickity-button.next:before { content: "q"; font-size:48px}
 .flickity-button.previous:before { content: "r"; font-size:48px }
 .flickity-page-dots{    display: inline-block;width: auto;height: 32px;position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);}
  .flickity-page-dots li{    display: inline-block;
    width: 12px;
    height: 12px;
    border: 1px solid #fff;
    border-radius: 50%;margin-right:3px;float:right}
  .dot.is-selected{background:#fff}

/* Next & Prev */
.bx-wrapper .bx-controls-direction a {width:48px;top: 50%; margin-top: -39px; outline: 0; display: inline-block; position: absolute; color: #fff; opacity: 0.7 }
.bx-wrapper .bx-controls-direction a:hover { opacity: 1 }
.bx-wrapper .bx-controls-direction a.disabled { display: none; }
.bx-wrapper .bx-controls-direction a:before { font-size: 46px; }
.bx-wrapper .bx-next { right: 0 }
.bx-wrapper .bx-next:before { content: "r"; }
.bx-wrapper .bx-prev { left: 0 }
.bx-wrapper .bx-prev:before{ content: "q"; }
/* Bullets */
.bx-wrapper .bx-pager { text-align: center; }
.bx-wrapper .bx-pager-item { margin-right: 3px }
.bx-wrapper .bx-pager-item:last-child { margin-right: 0 }
.bx-wrapper .bx-pager .bx-pager-item, .bx-wrapper .bx-controls-auto .bx-controls-auto-item { display: inline-block; *zoom: 1; *display: inline; position: relative }
.bx-wrapper .bx-pager a { background: none; text-indent: -9999px; display: block; width: 12px; height: 12px; outline: 0; border: 1px solid #fff; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; }
.bx-wrapper .bx-pager a:hover, .bx-wrapper .bx-pager a.active { background: #fff }
/********** Mobawaba **********/
.mobawaba { padding: 12px; background: #0683a4; width: 300px; height: 367px }
.mobawaba .border { border: 1px solid #5daebf; height: 343px }
.mobawaba .ttl { padding: 0 8px; height: 49px; border-bottom: 1px solid #5daebf !important }
.mobawaba .ttl h2 a { background: url(../Images/mobawabaLogo.png) no-repeat right 0; height: 33px; line-height: 4.4; padding: 10px 80px 5px 0; color: #fff; font-size: 14px;}
.mobawaba .ttl h2:after { display: none }
.mobawaba .allItems { padding: 8px; border-bottom: 1px solid #5daebf }
.mobawaba ul li { position: relative }
.mobawaba ul li a { display: block }
.mobawaba ul li a img { width: 100%; height: auto; border: none; }
.mobawaba .desc { width: 100%; height: 50%; overflow: hidden; cursor: pointer; position: absolute; bottom: 0; right: 0; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0); }
.mobawaba .desc p { color: #fff; text-align: center; line-height: 1.6; padding: 12px; font-size: 18px;  position: absolute; bottom: 0; right: 0; height: 80px; overflow: hidden }
.mobawaba .footer { width: 100%; height: 65px; background: #01313d; padding: 8px; position: absolute; bottom: -82px; right: 0; cursor: default }
.mobawaba .footer .price { float: right; font-family: Arial; font-weight: bold; font-size: 22px; color: #fff; line-height: 2.2; cursor: default }
.mobawaba .footer .price span { margin-right: 5px;  font-size: 14px; font-weight: normal }
.mobawaba .footer .add { float: left; height: 49px; padding: 0 8px;  font-size: 15px; color: #fff; line-height: 3.4 }
.mobawaba .footer .add:hover { background: #08708a }

/********** Opinions **********/
.opinions { padding: 12px; height: 310px; width: calc((100% - 372px) /2); float: right; border: 1px solid #e8e8e8; margin-left: 20px }
.opinions .ttl { height: 40px; border-bottom: 2px solid #E03322 !important; }
.opinions .ttl h3 { padding: 0; background: none !important; line-height: 40px; font-size: 18px; }
.opinions .ttl h3 a { color: #1d1d1d }
.opinions .ttl .more { line-height: 40px }
.opinions .ttl .icon-more:before { line-height: 40px }
.opinions .allItems { display: inline-block; width: 100%; padding: 16px 0 0; }
.opinions .allItems li { width: 100%; margin-bottom: 12px; padding-bottom: 12px; display: inline-block; position: relative; float: right; border-bottom: 1px solid #ddd }
.opinions .allItems li:last-child { border-bottom: 0; margin-bottom: 0; }
.opinions ul li a .imageCntnr { position: relative; overflow: hidden; padding-bottom: calc((60px * 100) / 100); float: right; width: 60px; border-radius: 50%; overflow: hidden }
.opinions .allItems li img { position: absolute; top: -4px; left: 50%; margin: 0 auto; width: auto; height: 150%; max-width: unset; transform: translateX(-50%); float: right; }
.opinions .allItems li .desc { float: right; width: calc(100% - 60px); padding-right: 12px; margin-top: 6px }
.opinions .allItems li .desc h2 { font-family: DroidKufiBold, Arial; font-size: 14px; color: #1d1d1d; line-height: 1.5; height: 22px; overflow: hidden }
.opinions .allItems li .writer { position: absolute; right: 72px; bottom: 16px;  font-size: 12px; color: #666; display: inline-block }
.opinions .allItems li .date { position: absolute; left: 0; bottom: 16px;  font-size: 12px; color: #666; display: inline-block; cursor: default; }
.opinions .allItems li .icon-date:before { content: "c"; float: right; margin-left: 5px }
.opinions .allItems li .item:hover .desc h2 { color: #E03322 }
.opinions .allItems li .writer:hover { color: #1d1d1d }
/********** Cross Media **********/
.crossMedia { padding: 12px; height: 310px; width: calc((100% - 372px) /2); float: right; margin-left: 20px; border: 1px solid #e8e8e8 }
.crossMedia .ttl { height: 40px; border-bottom: 2px solid #E03322 !important; }
.crossMedia .ttl h3 { padding: 0; background: none !important; line-height: 40px; color: #1d1d1d; font-size: 18px; }
.crossMedia .ttl h3 a { color: #1d1d1d }
.crossMedia .ttl .more { line-height: 40px }
.crossMedia .ttl .icon-more:before { line-height: 40px }
.crossMedia .allItems { display: inline-block; width: 100%; padding: 16px 0 0; }
.crossMedia .allItems li { width: 100%; margin-bottom: 24px; display: inline-block; position: relative; float: right; }
.crossMedia .allItems li:last-child { margin-bottom: 0 }
.crossMedia .allItems li:after { content: ""; position: absolute; bottom: -12px; right: 0; width: 100%; height: 1px; background: #ddd }
.crossMedia .allItems li:last-child:after { display: none }
.crossMedia ul li .item .imageCntnr { position: relative; overflow: hidden; padding-bottom: calc((180px * 56.25) / 100); float: right; width: 142px; }
.crossMedia .allItems li img { position: absolute; top: 50%; right: auto; bottom: auto; left: 50%; transform: translate(-50%,-50%); margin: 0 auto; width: auto; height: 100%; float: right; }
.crossMedia .allItems li .cnts { display: inline-block; float: right; width: calc(100% - 142px); padding-right: 12px }
.crossMedia .allItems li .desc { display: inline-block; float: right; width: 100%; }
.crossMedia .allItems li .desc h2 {  font-size: 14px; color: #1d1d1d; line-height: 1.6; height: 66px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.crossMedia .allItems li .secName { display: inline-block; float: right; font-family: DroidKufiBold, Arial; font-size: 12px; color: #fff; margin-bottom: 6px }
.crossMedia .allItems li .number { position: absolute; top: 0px; right: 0px; width: 26px; height: 26px; border-left: 1px solid #fff; border-bottom: 1px solid #fff; background: #E03322; color: #fff; font-family: Arial; font-weight: bold; font-size: 20px; text-align: center; line-height: 1.3; pointer-events: none; z-index: 1 }
.crossMedia .allItems li .item:hover .desc h2 { color: #E03322 }



/******************** app masrawy ********************/
.masrawyApp{display:inline-block;float:right;width:100%;height:250px;position:relative;margin-bottom:30px;overflow:hidden}
.masrawyApp .appbk{display:inline-block;position:absolute;width:100%;height:100%;top:0;right:0;z-index:0;pointer-events:none}
.masrawyApp a{display:inline-block;width:100%;height:100%;padding:30px 300px 0;position:relative;z-index:1}
.masrawyApp .rightSide{display:inline-block;width:341px;float:right}
.masrawyApp .rightSide p{display:inline-block;width:100%;float:right;font-size:51px;font-weight:700;color:#E53935;line-height:1;margin-bottom:32px;text-align:right}
.masrawyApp .rightSide span{display:inline-block;width:100%;float:right;font-size:34px;font-weight:400;color:#fff;line-height:1;margin-bottom:22px;text-align:right}
.masrawyApp .rightSide .appBtns div{display:inline-block;float:right;width:164px;height:50px;margin-left:10px}
.masrawyApp .rightSide .appBtns div:last-child{margin-left:0}
.masrawyApp .appHand{display:inline-block;width:290px;height:auto;position:absolute;bottom:-6px;left:20%;background-size:100%;z-index:0;pointer-events:none}
.masrawyApp .rightSide .appBtns div img{max-height: unset;width: 100%;height: auto;}

/****************************** Category ******************************/
/** Category Pattern01 **/
.catPattern01 { padding: 0; background: none }
.catPattern01 .allItems { display: inline-block; width: 100%; padding: 16px 0 0 }
.catPattern01 ul li { float: right; margin-left: 16px; margin-bottom: 16px; width: calc((100% - 64px) / 5); height: auto; position: relative; overflow: hidden; background: #fff; border: 1px solid #e8e8e8 }
.catPattern01 ul li a { display: block }
.catPattern01 ul li a .imageCntnr { position: relative; overflow: hidden; padding-bottom: 56.25% }
.catPattern01 ul li a img { position: absolute; top: 50%; right: auto; bottom: auto; left: 50%; transform: translate(-50%,-50%); margin: 0 auto; width: 100%;height: 100%;object-fit: cover;}
.catPattern01 ul li:first-child, .catPattern01 ul li:nth-child(2), .catPattern01 ul li:nth-child(3) { width: calc((100% - 32.1px) / 3) }
/*.catPattern01 ul li:first-child .item:hover .desc h2,
.catPattern01 ul li:nth-child(2) .item:hover .desc h2,
.catPattern01 ul li:nth-child(3) .item:hover .desc h2 { color: #fff !important }*/
.catPattern01 ul li:nth-child(3), .catPattern01 ul li:last-child { margin-left: 0 }
.catPattern01 ul li:nth-last-child(-n+5) { margin-bottom: 0 }
.catPattern01 .desc { width: 100%; height: 50%; overflow: hidden; cursor: pointer; position: absolute; bottom: 0; right: 0; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0); }
.catPattern01 .desc h2 { color: #fff; text-align: right; line-height: 1.6; padding: 0 10px; font-size: 15px;  position: absolute; bottom: 6px; right: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.catPattern01 ul li:first-child .desc h2, .catPattern01 ul li:nth-child(2) .desc h2, .catPattern01 ul li:nth-child(3) .desc h2 { font-size: 16px; line-height: 1.6 }
.catPattern01 ul li:nth-last-child(-n+5) .desc { position: relative; background: none; padding: 10px }
.catPattern01 ul li:nth-last-child(-n+5) .desc h2 { position: relative; color: #1d1d1d; font-size: 14px; bottom: 0; line-height: 1.6; padding: 0px; height: 68px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.catPattern01 ul li:nth-last-child(-n+5) .item:hover .desc h2 { color: #666 }
.catPattern01 ul li:nth-last-child(-n+5) .secName:hover { color: #1d1d1d }
.catPattern01 ul li.icon-video .imageCntnr span,
.catPattern01 ul li.icon-image .imageCntnr span { position: absolute; width: 32px; height: 32px; left: 4px; top: 4px; z-index: 1; line-height: 32px; text-align: center; background: #E03322; border-radius: 50%; }
.catPattern01 ul li.icon-video .imageCntnr span:before,
.catPattern01 ul li.icon-image .imageCntnr span:before { color: #fff; font-size: 17px; line-height: 32px; opacity: 1; transition: all .2s ease-in-out 0s; -webkit-transition: all .2s ease-in-out 0s; -moz-transition: all .2s ease-in-out 0s; -ms-transition: all .2s ease-in-out 0s; -o-transition: all .2s ease-in-out 0s; }
.catPattern01 ul li.icon-image .imageCntnr span:before { content: "t"; }
.catPattern01 ul li.icon-video .imageCntnr span:before { content: "s"; margin-left: 2px }
/** Category Pattern02 **/
.catPattern02 { padding: 0; background: none; width: calc((100% - 30px) / 2); margin-left: 30px }
.catPattern02:last-child { margin-left: 0 }
.catPattern02 .allItems { display: inline-block; width: 100%; padding: 16px 0 0 }
.catPattern02 ul li { float: right; margin-left: 16px; margin-bottom: 16px; width: calc((100% - 32px) / 3); height: auto; position: relative; overflow: hidden; background: #fff; border: 1px solid #e8e8e8 }
.catPattern02 ul li a { display: block }
.catPattern02 ul li a .imageCntnr { position: relative; overflow: hidden; padding-bottom: 56.25% }
.catPattern02 ul li a img { position: absolute; top: 50%; right: auto; bottom: auto; left: 50%; transform: translate(-50%,-50%); margin: 0 auto; width: 100%; height: 100%;object-fit: cover;}
.catPattern02 ul li:first-child, .catPattern02 ul li:nth-child(2) { width: calc((100% - 16px) / 2) }
.catPattern02 ul li:first-child .item:hover .desc h2,
.catPattern02 ul li:nth-child(2) .item:hover .desc h2 { color: #fff !important }
.catPattern02 ul li:nth-child(2), .catPattern02 ul li:last-child { margin-left: 0 }
.catPattern02 ul li:nth-last-child(-n+3) { margin-bottom: 0 }
.catPattern02 .desc { width: 100%; height: 50%; overflow: hidden; cursor: pointer; position: absolute; bottom: 0; right: 0; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0); }
.catPattern02 .desc h2 { color: #fff; text-align: right; line-height: 1.6; padding: 0 10px; font-size: 15px;  position: absolute; bottom: 6px; right: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.catPattern02 ul li:first-child .desc h2, .catPattern02 ul li:nth-child(2) .desc h2 { font-size: 16px; line-height: 1.6 }
.catPattern02 ul li:nth-last-child(-n+3) .desc { position: relative; background: none; padding: 10px; }
.catPattern02 ul li:nth-last-child(-n+3) .desc h2 { position: relative; color: #1d1d1d; font-size: 14px; line-height: 1.6; bottom: 0; padding: 0; height: 68px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.catPattern02 ul li:nth-last-child(-n+3) .item:hover .desc h2 { color: #666 }
.catPattern02 ul li:nth-last-child(-n+3) .secName:hover { color: #1d1d1d }
.catPattern02 ul li.icon-video .imageCntnr span,
.catPattern02 ul li.icon-image .imageCntnr span { position: absolute; width: 32px; height: 32px; left: 4px; top: 4px; z-index: 1; line-height: 32px; text-align: center; background: #E03322; border-radius: 50%; }
.catPattern02 ul li.icon-video .imageCntnr span:before,
.catPattern02 ul li.icon-image .imageCntnr span:before { color: #fff; font-size: 17px; line-height: 32px; opacity: 1; transition: all .2s ease-in-out 0s; -webkit-transition: all .2s ease-in-out 0s; -moz-transition: all .2s ease-in-out 0s; -ms-transition: all .2s ease-in-out 0s; -o-transition: all .2s ease-in-out 0s; }
.catPattern02 ul li.icon-image .imageCntnr span:before { content: "t"; }
.catPattern02 ul li.icon-video .imageCntnr span:before { content: "s"; margin-left: 2px }
.patternGroup { display: inline-block; float: right; width: 100% }
/** Category Pattern03 **/
.catPattern03 { padding: 0; width: calc((100% - 60.1px) / 3); margin-left: 30px; overflow: hidden; background: none }
.catPattern03:last-child { margin-left: 0 }
.catPattern03 .allItems { display: inline-block; width: 100%; padding: 16px 0 0 }
.catPattern03 ul li { float: right; margin-bottom: 16px; width: 100%; height: auto; position: relative; background: #fff; border: 1px solid #e8e8e8 }
.catPattern03 ul li:first-child:after, .catPattern03 ul li:last-child:after { display: none }
.catPattern03 ul li:last-child { margin-bottom: 0 }
.catPattern03 ul li a { display: block }
.catPattern03 ul li a .imageCntnr { position: relative; overflow: hidden; padding-bottom: calc((120px * 56.25) / 100); float: right; width: 120px }
.catPattern03 ul li:first-child a .imageCntnr { position: relative; overflow: hidden; padding-bottom: 56.25%; float: none; width: auto; margin-left: 0 }
.catPattern03 ul li a img { position: absolute; top: 50%; right: auto; bottom: auto; left: 50%; transform: translate(-50%,-50%); margin: 0 auto; width: 100%; height: 100%;object-fit: cover;}
.catPattern03 .desc { width: calc(100% - 120px); height: 50%; overflow: hidden; cursor: pointer; position: relative; float: right; padding: 10px }
.catPattern03 .desc h2 { color: #1d1d1d; text-align: right; line-height: 1.6; font-size: 14px;  position: relative; bottom: 0; right: 0; height: 42px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.catPattern03 ul li:first-child .desc { position: absolute; bottom: 0; right: 0; float: none; width: 100%; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0); }
.catPattern03 ul li:first-child .desc h2 { font-size: 18px; line-height: 1.6; margin-bottom: 0; position: absolute; bottom: 6px; right: 0; font-size: 16px; color: #fff; padding: 0 10px; height: auto }
.catPattern03 ul li:nth-last-child(-n+3) .item:hover .desc h2 { color: #666 }
.catPattern03 ul li.icon-video .imageCntnr span,
.catPattern03 ul li.icon-image .imageCntnr span { position: absolute; width: 32px; height: 32px; left: 4px; top: 4px; z-index: 1; line-height: 32px; text-align: center; background: #E03322; border-radius: 50%; }
.catPattern03 ul li.icon-video .imageCntnr span:before,
.catPattern03 ul li.icon-image .imageCntnr span:before { color: #fff; font-size: 17px; line-height: 32px; opacity: 1; transition: all .2s ease-in-out 0s; -webkit-transition: all .2s ease-in-out 0s; -moz-transition: all .2s ease-in-out 0s; -ms-transition: all .2s ease-in-out 0s; -o-transition: all .2s ease-in-out 0s; }
.catPattern03 ul li.icon-image .imageCntnr span:before { content: "t";  }
.catPattern03 ul li.icon-video .imageCntnr span:before { content: "s"; margin-left: 2px }
.catPattern03 ul li:first-child .item:hover .desc h2 { color: #fff !important }

/********** Homepage Pattern **********/
.pattern02 { padding: 0; background: none }
.pattern02 .ttl .icon-more:before { transform: rotate(-90deg) }
.pattern02 .allItems { display: inline-block; float: right; width: 100%; padding: 16px 0 0 }
.pattern02 ul li { float: right; margin-left: 16px; margin-bottom: 16px; width: calc((50% - 23px) / 2); height: auto; position: relative; z-index: 0;transition:none }
.pattern02 ul li .item { display: block }
.pattern02 ul li .item .imageCntnr { position: relative; overflow: hidden; padding-bottom: 56.25%; display: inline-block; float: right; width: 100% }
.pattern02 ul li .item img { position: absolute; top: 50%; right: auto; bottom: auto; left: 50%; transform: translate(-50%, -50%); margin: 0 auto; width: 100%; height: auto; }
.pattern02 .desc { width: 100%; height: 50%; cursor: pointer; position: absolute; bottom: 0; right: 0; pointer-events: none; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0); }
.pattern02 .desc .details { position: absolute; bottom: 6px; right: 0; width: 100% }
.pattern02 ul li .desc span { display: inline-block; float: right; margin-right: 10px }
.pattern02 ul li .secName { display: inline-block; padding: 0 6px;  font-size: 11px; color: #fff; background: #E03322; z-index: 1; height: 20px; line-height: 20px; pointer-events: visible; margin-bottom: 6px;transition:none}
.pattern02 .desc h2 { display: inline-block; display: -webkit-box; width: 100%; float: right; color: #fff; text-align: right; max-height: 44px; line-height: 1.6; padding: 0 10px; font-size: 14px;  -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;transition:none}
.pattern02 .desc h2 a { color:inherit}
.pattern02 ul li:first-child .desc h2 { font-size: 18px; line-height: 1.8; max-height: unset }
.pattern02 ul li .item:hover a h2, .pattern02 ul li .item:hover .desc h2 { color: #fff !important }
.pattern02 ul li:first-child { width: calc(50% - 9px) }
.pattern02 ul li:first-child .item .imageCntnr { padding-bottom: calc(56.25% + 8px) }
.pattern02 ul li:first-child .desc h2 { font-size: 18px; line-height: 1.8; }
.pattern02 ul li:first-child, .pattern02 ul li:nth-child(4), .pattern02 ul li:nth-child(5) { margin-bottom: 0 }
.pattern02 ul li:nth-child(3), .pattern02 ul li:last-child { margin-left: 0 }
.pattern02 ul li.icon-video .imageCntnr span,
.pattern02 ul li.icon-image .imageCntnr span { position: absolute; width: 32px; height: 32px; left: 4px; top: 4px; z-index: 1; line-height: 32px; text-align: center; background: #E03322; border-radius: 50%; }
.pattern02 ul li.icon-video .imageCntnr span:before,
.pattern02 ul li.icon-image .imageCntnr span:before { color: #fff; font-size: 17px; line-height: 32px; opacity: 1; transition: all .2s ease-in-out 0s; -webkit-transition: all .2s ease-in-out 0s; -moz-transition: all .2s ease-in-out 0s; -ms-transition: all .2s ease-in-out 0s; -o-transition: all .2s ease-in-out 0s; }
.pattern02 ul li.icon-image .imageCntnr span:before { content: "t";  }
.pattern02 ul li.icon-video .imageCntnr span:before { content: "s"; margin-left: 2px }
.pattern02 .mvLp { display: none }
.pattern02.ramadan { position: relative; background: linear-gradient(0deg,#4c3a6e,#22215b); background: -webkit-linear-gradient(0deg,#4c3a6e,#22215b); background: -o-linear-gradient(0deg,#4c3a6e,#22215b); background: -moz-linear-gradient(0deg,#4c3a6e,#22215b); background: -ms-linear-gradient(0deg,#4c3a6e,#22215b); }
/*.pattern02.ramadan:before{content:"";position:absolute;right:0;top:0;width:100%;height:100%;background:url(../Images/ramadanBg.jpg) no-repeat left 0 #fff;z-index:0;opacity:0.7}*/
.pattern02.ramadan .mvLp { display: none; content: ""; position: absolute; left: 50%; top: 5px; transform: translateX(-50%); width: 165px; height: 46px; z-index: 1 }
.pattern02.ramadan .mvLp .mv { float: right; margin-left: 10px; width: 111px; height: 46px; display: inline-block; background: url(../Images/mvLogo.png) no-repeat center center; background-size: 100% }
.pattern02.ramadan .mvLp .ic { float: right; width: 44px; height: 46px; display: inline-block; background: url(../Images/icityLogo.png) no-repeat center center; background-size: 100% }
.pattern02.ramadan .ttl { position: relative; z-index: 1 }
.ramadan .pattern02.ramadan { background: #fff }
.ramadan .pattern02.ramadan:before { display: none }
.ramadan .filterMainContent h3{width:170px}
.pattern02.ramadan:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url(../Images/ramadanPatternBG.png?ref=0.1) top -20px right repeat; background-size: 80px auto; opacity: 0.7; pointer-events: none }
.pattern02.ramadan:after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url(../Images/ramMasrawyLogo.png) top 10px right 194px no-repeat; background-size: 40px auto; pointer-events: none }
.pattern02.ramadan .ttl h3, .pattern02.ramadan .ttl h3 a { color: #fff }
.pattern02.ramadan .ttl { border-bottom: none }
.pattern02.ramadan .ttl h3:after { background: #fff; }
.pattern02.ramadan ul li:nth-last-child(-n+3) .desc p { color: #fff }
.pattern02.ramadan ul li:nth-last-child(-n+3) .item:hover .desc p { color: #ccc }
.pattern02.ramadan ul li:nth-last-child(-n+3) .secName { color: #fff }
.pattern02.ramadan ul li a img { border: 1px solid #686868; }
.pattern02.ramadan .ttl .more { color: #fff }
.ramadan .mobawaba img { width: 100%; height: 100% }
.patternGroup { display: inline-block; float: right; width: 100% }

/********** Masrawy TV **********/
.masrawyTV { width: 332px; float: left; background: #fff; border: 1px solid #e8e8e8; padding: 12px; height: 310px }
.masrawyTV .ttl h3 { padding: 0; background: none !important; font-size: 18px }
.masrawyTV .ttl h3 a { color: #1d1d1d }
.masrawyTV ul li { width: 100% !important; display: inline-block !important; }
.pattern02.masrawyTV ul li .item .imageCntnr { padding-bottom: 75% }
.pattern02.masrawyTV ul li .item img { width: auto; height: 100%; }
.pattern02.masrawyTV .ttl .icon-more:before { transform: none }


/********** Media **********/
.media { background: none; }
.media .ttl { border-bottom: 2px solid #1d1d1d !important }
.media .ttl h3 { background: #1d1d1d !important }
.media .ttl h3 a { color: #fff }
.media .ttl .secMenu li { background: none }
.media .ttl .more { color: #1d1d1d }
.media .ttl .icon-more:before { color: #1d1d1d }
.media .allItems { display: inline-block; width: 100%; padding: 16px 0 0; }
.media ul li { position: relative; width: 430px; float: right; display: inline-block; margin-bottom: 16px; background: #fff; border: 1px solid #e8e8e8 }
.media ul li:first-child { width: calc(100% - 446px); margin-left: 16px; margin-bottom: 0 }
.media ul li:last-child { margin-bottom: 0 }
.media ul li .item .imageCntnr { position: relative; overflow: hidden; padding-bottom: calc((178px * 56.25) / 100); width: 142px; display: inline-block; float: right; }
.media ul li .item img { position: absolute; top: 50%; right: auto; bottom: auto; left: 50%; transform: translate(-50%, -50%); margin: 0 auto; width: 100%; height: 100%;object-fit: cover; border: none; }
.media .cnts { display: inline-block; float: right; width: calc(100% - 142px); }
.media .desc { display: inline-block; float: right; padding: 10px }
.media .desc h2 { float: right; width: 100%; color: #1d1d1d; text-align: right; line-height: 1.6; font-size: 14px;  max-height: 68px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.innerSection .media .desc h2 { -webkit-line-clamp: 3; }
.innerSection .media ul li:first-child .desc h2 { -webkit-line-clamp: 2; }
.media ul li .secName { display: inline-block; font-family: DroidKufiBold, Arial; font-size: 12px; color: #fff; z-index: 1; pointer-events: visible; margin-bottom: 6px }
.media ul li:first-child .secName { padding: 0px 6px; color: #fff !important; background: #E03322;  font-size: 11px; height: 20px; line-height: 20px; margin-bottom: 6px }
.media ul li:first-child .item .imageCntnr { padding-bottom: calc(56.25% + 3px); width: 100%; }
.media ul li:first-child .desc { width: 100%; height: 50%; cursor: pointer; position: absolute; bottom: 0; right: 0; padding: 0; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0); }
.media ul li:first-child .desc h2 { float: right; width: 100%; font-size: 18px; line-height: 1.8; padding: 0 10px; max-height: unset; color: #fff; height: auto }
.media ul li:first-child .item:hover .desc h2 { color: #fff !important }
.media ul li .desc .details { display: inline-block; float: right; width: 100% }
.media ul li .desc span { display: inline-block; float: right; }
.media ul li:first-child .desc .details { position: absolute; bottom: 6px; right: 0; width: 100%; }
.media ul li:first-child .desc span { margin-right: 10px }
.media ul li.icon-video .imageCntnr span,
.media ul li.icon-image .imageCntnr span { position: absolute; width: 32px; height: 32px; left: 4px; top: 4px; z-index: 1; line-height: 32px; text-align: center; background: #1d1d1d; border-radius: 50%; }
.media ul li.icon-video .imageCntnr span:before,
.media ul li.icon-image .imageCntnr span:before { color: #fff; font-size: 17px; line-height: 32px; opacity: 1; transition: all .2s ease-in-out 0s; -webkit-transition: all .2s ease-in-out 0s; -moz-transition: all .2s ease-in-out 0s; -ms-transition: all .2s ease-in-out 0s; -o-transition: all .2s ease-in-out 0s; }
.media ul li.icon-image .imageCntnr span:before { content: "t"; }
.media ul li.icon-video .imageCntnr span:before { content: "s"; margin-left: 2px }
.innerSection .media .desc { padding: 10px }
.innerSection .media ul li .desc span { display: none }


@media screen and (min-width:1680px) and (max-width:1919px) {

    .featuredArea.fixed { width: 748px !important; right: calc(((100% - 1100px) / 2) + 16px) }
     .featuredHintSticky.fixed{ width: 748px !important; right: calc(((100% - 1100px) / 2) + 16px) }
     .ramadan .featuredArea.fixed{width:100%;right:unset;}
        .masrawyApp a{padding:30px 210px 0}
    .masrawyApp:after{left:15%}

    .openVideoPopupMain .videoPlayerPopup { padding: 60px 130px }
    .videoPlayerPopup .videoSponsor { right: 30px }
    .videoPlayerPopup .mainVideo .cntnr .twitter-tweet iframe { width: 550px !important }

     .media ul li { width: 320px; }
    .media ul li .item .imageCntnr { padding-bottom: calc((120px * 75) / 100); width: 120px; }
    .media .cnts { width: calc(100% - 120px); }
    .media .desc { padding: 6px 10px }
    .media ul li:first-child { width: calc(100% - 336px); }

        .infoClips.inner .corona .item .circle span.number { font-size: 22px }
    .infoClips.inner .corona .item { margin-left: 5px }
    .infoClips.inner .corona .item p { font-size: 12px }
    .infoClips.inner .corona .maindiv { width: calc(100% + 20px); margin-right: -10px }

    
    .masrawyApp{height:213px}
    .masrawyApp a{padding:30px 210px 0;}
    .masrawyApp .rightSide{width:304px}
    .masrawyApp .rightSide p{font-size:45px}
    .masrawyApp .rightSide span{font-size:30px}
    .masrawyApp .rightSide .appBtns div{width: 136px;}
    .masrawyApp .appHand{left:15%;bottom:-35px}

}

@media screen and (min-width:1600px) and (max-width:1679px) {
    .featuredArea.fixed { width: 748px !important; right: calc(((100% - 1100px) / 2) + 16px) }
        .featuredHintSticky.fixed{ width: 748px !important; right: calc(((100% - 1100px) / 2) + 16px) }
    .ramadan .featuredArea.fixed{width:100%;right:unset;}
    .masrawyApp a{padding:30px 210px 0}
    .masrawyApp:after{left:15%}

        .openVideoPopupMain .videoPlayerPopup { padding: 60px 190px }
    .videoPlayerPopup .videoSponsor { right: 60px }
    .videoPlayerPopup .mainVideo .cntnr .twitter-tweet iframe { width: 460px !important }

     .media ul li { width: 320px; }
    .media ul li .item .imageCntnr { padding-bottom: calc((120px * 75) / 100); width: 120px; }
    .media .cnts { width: calc(100% - 120px); }
    .media .desc { padding: 6px 10px }
    .media ul li:first-child { width: calc(100% - 336px); }

        .infoClips.inner .corona .item .circle span.number { font-size: 22px }
    .infoClips.inner .corona .item { margin-left: 5px }
    .infoClips.inner .corona .item p { font-size: 12px }
    .infoClips.inner .corona .maindiv { width: calc(100% + 20px); margin-right: -10px }

       .masrawyApp{height:213px}
    .masrawyApp a{padding:30px 210px 0;}
    .masrawyApp .rightSide{width:304px}
    .masrawyApp .rightSide p{font-size:45px}
    .masrawyApp .rightSide span{font-size:30px}
    .masrawyApp .rightSide .appBtns div{width: 136px;}
    .masrawyApp .appHand{left:15%;bottom:-35px}

}

@media screen and (min-width:1536px) and (max-width:1599px) {
    .featuredArea.fixed { width: 748px !important; right: calc(((100% - 1100px) / 2) + 16px) }
        .featuredHintSticky.fixed{ width: 748px !important; right: calc(((100% - 1100px) / 2) + 16px) }
    .ramadan .featuredArea.fixed{width:100%;right:unset;}

    .masrawyApp a{padding:30px 210px 0}
    .masrawyApp:after{left:15%}

        .openVideoPopupMain .videoPlayerPopup { padding: 50px 200px }
    .videoPlayerPopup .videoSponsor { top: 50px; right: 65px }
    .videoPlayerPopup .mainVideo { width: calc(100% - 350px); }
    .videoPlayerPopup aside { width: 350px }
    .videoPlayerPopup .mainVideo .cntnr .twitter-tweet iframe { width: 430px !important; }

    .media ul li { width: 320px; }
    .media ul li .item .imageCntnr { padding-bottom: calc((120px * 75) / 100); width: 120px; }
    .media .cnts { width: calc(100% - 120px); }
    .media .desc { padding: 6px 10px }
    .media ul li:first-child { width: calc(100% - 336px); }

        .infoClips.inner .corona .item .circle span.number { font-size: 22px }
    .infoClips.inner .corona .item { margin-left: 5px }
    .infoClips.inner .corona .item p { font-size: 12px }
    .infoClips.inner .corona .maindiv { width: calc(100% + 20px); margin-right: -10px }

      .masrawyApp{height:213px}
     .masrawyApp a{padding:30px 210px 0;}
    .masrawyApp .rightSide{width:304px}
    .masrawyApp .rightSide p{font-size:45px}
    .masrawyApp .rightSide span{font-size:30px}
    .masrawyApp .rightSide .appBtns div{width: 136px;}
    .masrawyApp .appHand{left:15%;bottom:-35px}

}

@media screen and (min-width:1440px) and (max-width:1535px) {
    .featuredArea.fixed { width: 748px !important; right: calc(((100% - 1100px) / 2) + 16px) }
        .featuredHintSticky.fixed{ width: 748px !important; right: calc(((100% - 1100px) / 2) + 16px) }
    .ramadan .featuredArea.fixed{width:100%;right:unset;}

        .masrawyApp a{padding:30px 210px 0}
    .masrawyApp:after{left:15%}

        .openVideoPopupMain .videoPlayerPopup { padding: 50px 120px }
    .videoPlayerPopup .videoSponsor { top: 50px; right: 25px }
    .videoPlayerPopup .mainVideo { width: calc(100% - 350px); }
    .videoPlayerPopup aside { width: 350px }
    .videoPlayerPopup .mainVideo .cntnr .twitter-tweet iframe { width: 450px !important; }

    
    .media ul li { width: 320px; }
    .media ul li .item .imageCntnr { padding-bottom: calc((120px * 75) / 100); width: 120px; }
    .media .cnts { width: calc(100% - 120px); }
    .media .desc { padding: 6px 10px }
    .media ul li:first-child { width: calc(100% - 336px); }

        .infoClips.inner .corona .item .circle span.number { font-size: 22px }
    .infoClips.inner .corona .item { margin-left: 5px }
    .infoClips.inner .corona .item p { font-size: 12px }
    .infoClips.inner .corona .maindiv { width: calc(100% + 20px); margin-right: -10px }

      .masrawyApp{height:213px}
     .masrawyApp a{padding:30px 210px 0;}
    .masrawyApp .rightSide{width:304px}
    .masrawyApp .rightSide p{font-size:45px}
    .masrawyApp .rightSide span{font-size:30px}
    .masrawyApp .rightSide .appBtns div{width: 136px;}
    .masrawyApp .appHand{left:15%;bottom:-35px}

}

@media screen and (min-width:1360px) and (max-width:1439px) {
    .featuredArea.fixed { width: 748px !important; right: calc(((100% - 1100px) / 2) + 16px) }
        .featuredHintSticky.fixed{ width: 748px !important; right: calc(((100% - 1100px) / 2) + 16px) }
    .ramadan .featuredArea.fixed{width:100%;right:unset;}

        .masrawyApp a{padding:30px 210px 0}
    .masrawyApp:after{left:15%}

        .openVideoPopupMain .videoPlayerPopup { padding: 50px 170px }
    .videoPlayerPopup .videoSponsor { top: 50px; right: 50px }
    .videoPlayerPopup .mainVideo { width: calc(100% - 300px); }
    .videoPlayerPopup aside { width: 300px }
    .videoPlayerPopup aside .playerList li .imageCntnr { padding-bottom: calc((100px * 67)/ 100); width: 100px }
    .videoPlayerPopup aside .playerList li .desc { width: calc(100% - 100px); padding: 2px 16px; }
    .videoPlayerPopup .mainVideo .desc { padding: 10px 16px }
    .videoPlayerPopup .mainVideo .desc p.date { font-size: 12px; margin-bottom: 0 }
    .videoPlayerPopup .mainVideo .desc p { font-size: 20px; height: 72px }
    .videoPlayerPopup .mainVideo .shareMenu { top: 10px }
    .videoPlayerPopup .mainVideo .cntnr .twitter-tweet iframe { width: 370px !important }

    
    .media ul li { width: 320px; }
    .media ul li .item .imageCntnr { padding-bottom: calc((120px * 75) / 100); width: 120px; }
    .media .cnts { width: calc(100% - 120px); }
    .media .desc { padding: 6px 10px }
    .media ul li:first-child { width: calc(100% - 336px); }

        .infoClips.inner .corona .item .circle span.number { font-size: 22px }
    .infoClips.inner .corona .item { margin-left: 5px }
    .infoClips.inner .corona .item p { font-size: 12px }
    .infoClips.inner .corona .maindiv { width: calc(100% + 20px); margin-right: -10px }

      .masrawyApp{height:213px}
     .masrawyApp a{padding:30px 210px 0;}
    .masrawyApp .rightSide{width:304px}
    .masrawyApp .rightSide p{font-size:45px}
    .masrawyApp .rightSide span{font-size:30px}
    .masrawyApp .rightSide .appBtns div{width: 136px;}
    .masrawyApp .appHand{left:15%;bottom:-35px}

}

@media screen and (min-width:1280px) and (max-width:1359px) {
    .featuredArea.fixed { width: 648px !important; right: calc(((100% - 1000px) / 2) + 16px) }
        .featuredHintSticky.fixed{ width: 648px !important; right: calc(((100% - 1000px) / 2) + 16px) }
    .ramadan .featuredArea.fixed{width:100%;right:unset;}

    
       .masrawyApp a{padding:30px 175px 0}
    .masrawyApp:after{left:11%}
    .masrawyApp .rightSide p{font-size:46px}
    .masrawyApp .rightSide span{font-size:30px}
    .masrawyApp .rightSide .appBtns div{width:148px;height:45px}

        .openVideoPopupMain .videoPlayerPopup { padding: 50px 120px }
    .videoPlayerPopup .videoSponsor { top: 50px; right: 25px }
    .videoPlayerPopup .mainVideo { width: calc(100% - 300px); }
    .videoPlayerPopup aside { width: 300px }
    .videoPlayerPopup aside .playerList li .imageCntnr { padding-bottom: calc((100px * 67)/ 100); width: 100px }
    .videoPlayerPopup aside .playerList li .desc { width: calc(100% - 100px); padding: 2px 16px; }
    .videoPlayerPopup .mainVideo .desc { padding: 10px 16px }
    .videoPlayerPopup .mainVideo .desc p.date { font-size: 12px; margin-bottom: 0 }
    .videoPlayerPopup .mainVideo .desc p { font-size: 20px; height: 72px }
    .videoPlayerPopup .mainVideo .shareMenu { top: 10px }
    .videoPlayerPopup .mainVideo .cntnr .twitter-tweet iframe { width: 400px !important }

    
    .media ul li { width: 370px; }
    .media ul li .item .imageCntnr { padding-bottom: calc((130px * 75) / 100); width: 130px; }
    .media .cnts { width: calc(100% - 130px); }
    .media .desc { padding: 6px 10px }
    .media ul li:first-child { width: calc(100% - 386px); }
    /*.media ul li:last-child { display: none }*/
    .media ul li:nth-of-type(5) { margin-bottom: 0 ;display: none}

    .infoClips { max-width: 100%; margin: 0 }
        .infoClips.inner .corona .item .circle span.number { font-size: 20px }
    .infoClips.inner .corona .item { margin-left: 0; width: 100px }
    .infoClips.inner .corona .item p { font-size: 12px }
    .infoClips.inner .corona .maindiv { width: calc(100% + 20px); margin-right: -10px }

  .masrawyApp{height:194px}
    .masrawyApp .appHand{left:11%;bottom: -56px;}
    .masrawyApp a{padding:23px 175px 0;}
    .masrawyApp .rightSide{width:304px}
    .masrawyApp .rightSide p{font-size:45px}
    .masrawyApp .rightSide span{font-size:30px}

    .masrawyApp .rightSide .appBtns div{width:136px;height:45px}

}

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

     .featuredArea.fixed { width: 448px !important; right: calc(((100% - 800px) / 2) + 16px) }
    .featuredHintSticky.fixed{ width: 448px !important; right: calc(((100% - 800px) / 2) + 16px) }
    .ramadan .featuredArea.fixed{width:100%;right:unset;}

    .featuredArea ul li { margin-left: 16px; margin-bottom: 16px; width: calc((100% - 16px) / 2); position: relative; border: none; overflow: hidden }
    .featuredArea ul li a img { width: 100%; height: auto; 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; }
    .featuredArea ul li:first-child a img { width: 100% }
    .featuredArea ul li:first-child { width: 100% }
    .featuredArea ul li:last-child { display: none }
    .featuredArea ul li:nth-child(2), .featuredArea ul li:last-child { margin-left: 16px }
    .featuredArea ul li:nth-child(2n + 1) { margin-left: 0 }
    .featuredArea ul li:nth-child(4), .featuredArea ul li:nth-child(5), .featuredArea ul li:last-child { margin-bottom: 0 }

    .media ul li { width: calc((100% - 16px) / 2); margin-left: 16px }
    .media ul li:nth-of-type(2n+1) { margin-left: 0 }
    .media ul li .item .imageCntnr { padding-bottom: calc((130px * 75) / 100); width: 130px; }
    .media .cnts { width: calc(100% - 130px); }
    .media .desc { padding: 6px 10px }
    .media ul li:first-child { width: 100%; margin-left: 0; margin-bottom: 16px }
    .media ul li:last-child { display: inline-block }
    .media ul li:nth-of-type(5) { margin-bottom: 0 }

       .masrawyApp a{padding:30px 100px 0}
    .masrawyApp:after{left:8%}
    .masrawyApp .rightSide{width:300px}
    .masrawyApp .rightSide p{font-size:40px}
    .masrawyApp .rightSide span{font-size:26px}
    .masrawyApp .rightSide .appBtns div{width:130px;height:40px}

        .openVideoPopupMain .videoPlayerPopup { padding: 50px 120px }
    .videoPlayerPopup .videoSponsor { top: 50px; right: 25px }
    .videoPlayerPopup .mainVideo { width: calc(100% - 300px); }
    .videoPlayerPopup aside { width: 300px }
    .videoPlayerPopup aside .playerList li .imageCntnr { padding-bottom: calc((100px * 67)/ 100); width: 100px }
    .videoPlayerPopup aside .playerList li .desc { width: calc(100% - 100px); padding: 2px 16px; }
    .videoPlayerPopup .mainVideo .desc { padding: 10px 16px }
    .videoPlayerPopup .mainVideo .desc p.date { font-size: 12px; margin-bottom: 0 }
    .videoPlayerPopup .mainVideo .desc p { font-size: 20px; height: 72px }
    .videoPlayerPopup .mainVideo .shareMenu { top: 10px }
    .videoPlayerPopup .mainVideo .cntnr .twitter-tweet iframe { width: 100% !important }

      .catPattern01 ul li { width: calc((100% - 32px) / 3); margin-bottom: 16px }
    .catPattern01 ul li:nth-child(3n+2) { margin-left: 0 }
    .catPattern01 ul li:first-child, .catPattern01 ul li:nth-child(2) { width: calc((100% - 16px) / 2); }
    .catPattern01 ul li:nth-child(2) { margin-left: 0 }
    .catPattern01 ul li:nth-child(3) { margin-left: 16px }
    .catPattern01 ul li:nth-last-child(-n+5) { margin-bottom: 16px }
    .catPattern01 ul li:nth-last-of-type(-n+3) { margin-bottom: 0 }
    .catPattern01 ul li:nth-last-child(-n+6) .desc { position: relative; background: none; padding: 10px; }
    .catPattern01 ul li:nth-last-child(-n+6) .desc h2 { position: relative; color: #1d1d1d; font-size: 14px; line-height: 1.6; padding: 0px; height: 68px; overflow: hidden; bottom: auto; }
    .catPattern01 ul li:nth-last-child(-n+6) .item:hover .desc h2 { color: #666; }
    .catPattern01 ul li.news:nth-child(3) .item:hover a h2,
    .catPattern01 ul li.news:nth-child(3) .item:hover .desc h2 { color: #E03322 !important; }
    .catPattern01 ul li.sports:nth-child(3) .item:hover a h2,
    .catPattern01 ul li.sports:nth-child(3) .item:hover .desc h2 { color: #056818 !important; }
    .catPattern01 ul li.arts:nth-child(3) .item:hover a h2,
    .catPattern01 ul li.arts:nth-child(3) .item:hover .desc h2 { color: #A8006B !important; }
    .catPattern01 ul li.howa_w_hya:nth-child(3) .item:hover a h2,
    .catPattern01 ul li.howa_w_hya:nth-child(3) .item:hover .desc h2 { color: #7b1fa2 !important; }
    .catPattern01 ul li.autos:nth-child(3) .item:hover a h2,
    .catPattern01 ul li.autos:nth-child(3) .item:hover .desc h2 { color: #1a237e !important; }
    .catPattern01 ul li.islameyat:nth-child(3) .item:hover a h2,
    .catPattern01 ul li.islameyat:nth-child(3) .item:hover .desc h2 { color: #075C99 !important; }
    .catPattern02 ul li:first-child { width: 100%; margin-left: 0 }
    .catPattern02 ul li:nth-child(2), .catPattern02 ul li { width: calc((100% - 12px) / 2); margin-left: 12px; margin-bottom: 12px }
    .catPattern02 ul li:nth-child(2n+1) { margin-left: 0 }
    .catPattern02 ul li:nth-last-child(-n+3) { margin-bottom: 12px }
    .catPattern02 ul li:nth-last-child(-n+2) { margin-bottom: 0 }
    .catPattern02 ul li:nth-last-child(-n+4) .desc { position: relative; background: none; padding: 10px; }
    .catPattern02 ul li:nth-last-child(-n+4) .desc h2 { position: relative; color: #1d1d1d; font-size: 14px; line-height: 1.4; padding: 5px 0; height: 62px; overflow: hidden; margin-bottom: 5px; bottom: auto; }
    .catPattern02 ul li:nth-last-child(-n+4) .item:hover .desc h2 { color: #666 }
    .catPattern02 ul li.news:nth-child(2) .item:hover a h2,
    .catPattern02 ul li.news:nth-child(2) .item:hover .desc h2 { color: #E03322 !important; }
    .catPattern02 ul li.sports:nth-child(2) .item:hover a h2,
    .catPattern02 ul li.sports:nth-child(2) .item:hover .desc h2 { color: #056818 !important; }
    .catPattern02 ul li.arts:nth-child(2) .item:hover a h2,
    .catPattern02 ul li.arts:nth-child(2) .item:hover .desc h2 { color: #A8006B !important; }
    .catPattern02 ul li.howa_w_hya:nth-child(2) .item:hover a h2,
    .catPattern02 ul li.howa_w_hya:nth-child(2) .item:hover .desc h2 { color: #7b1fa2 !important; }
    .catPattern02 ul li.autos:nth-child(2) .item:hover a h2,
    .catPattern02 ul li.autos:nth-child(2) .item:hover .desc h2 { color: #1a237e !important; }
    .catPattern02 ul li.islameyat:nth-child(2) .item:hover a h2,
    .catPattern02 ul li.islameyat:nth-child(2) .item:hover .desc h2 { color: #075C99 !important; }
    .catPattern03 { width: 100%; margin-left: 0 }
    .catPattern03 ul li { width: calc((100% - 32px) / 3); margin-bottom: 16px; margin-left: 16px }
    .catPattern03 ul li a .imageCntnr { width: 100%; padding-bottom: 75% }
    .catPattern03 ul li:first-child a .imageCntnr, .catPattern03 ul li:nth-child(2) a .imageCntnr { position: relative; overflow: hidden; padding-bottom: 75%; float: none; width: auto; margin-left: 0; }
    .catPattern03 ul li:first-child .desc, .catPattern03 ul li:nth-child(2) .desc { position: absolute; bottom: 0; right: 0; float: none; width: 100%; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0); }
    .catPattern03 ul li:first-child .desc h2, .catPattern03 ul li:nth-child(2) .desc h2 { font-size: 18px; line-height: 1.6; margin-bottom: 0; position: absolute; bottom: 0; right: 0; font-size: 16px; color: #fff; padding: 12px; height: auto; }
    .catPattern03 ul li:nth-child(3n+2) { margin-left: 0 }
    .catPattern03 ul li:first-child, .catPattern03 ul li:nth-child(2) { width: calc((100% - 16px) / 2); }
    .catPattern03 ul li:nth-child(2) { margin-left: 0 }
    .catPattern03 ul li:nth-child(3) { margin-left: 16px }
    .catPattern03 ul li:nth-child(3),
    .catPattern03 ul li:nth-child(4),
    .catPattern03 ul li:nth-child(5) { margin-bottom: 0 }
    .catPattern03 ul li:nth-child(3) .desc,
    .catPattern03 ul li:nth-child(4) .desc,
    .catPattern03 ul li:nth-child(5) .desc { position: relative; background: none; padding: 10px; width: 100% }
    .catPattern03 ul li:nth-child(3) .desc h2,
    .catPattern03 ul li:nth-child(4) .desc h2,
    .catPattern03 ul li:nth-child(5) .desc h2 { position: relative; color: #1d1d1d; font-size: 14px; line-height: 1.6; padding: 0px; height: 68px; overflow: hidden; }
    .catPattern03 ul li:nth-child(3) .item:hover .desc h2,
    .catPattern03 ul li:nth-child(4) .item:hover .desc h2,
    .catPattern03 ul li:nth-child(5) .item:hover .desc h2 { color: #666; }
    .catPattern03 ul li:nth-child(2) .item:hover a h2,
    .catPattern03 ul li:nth-child(2) .item:hover .desc h2 { color: #fff !important }

        .infoClips { max-width: 100%; margin: 0 }
      .infoClips.inner .corona { width: 100%; margin-bottom: 20px }
    .infoClips.inner .waya { width: 100%; margin-right: 0 }

    .opinions { width: 100%; margin-left: 0 }
    .crossMedia { width: calc(100% - 352px) }

     .mostRead { width: 100%; margin-left: 0 }
    .monsterDiv { margin-right: calc((100% - 620px) / 2) }

     .paginationDiv .pattern01 ul li { width: calc((100% - 16px) / 2) }
    .paginationDiv .pattern01 ul li:nth-child(3n) { margin-left: 16px }
    .paginationDiv .pattern01 ul li:nth-child(2n) { margin-left: 0 }
    .paginationDiv .pattern01 ul li:nth-last-of-type(-n+2) { display: inline-block }

     .pattern01 ul li { width: calc((100% - 48px) / 4); }
    .pattern01 ul li:nth-child(5n) { margin-left: 16px; }
    .pattern01 ul li:nth-child(4n) { margin-left: 0; }
    .pattern01 ul li:nth-last-of-type(-n+2) { display: none }
    .pattern01 ul li:nth-last-child(-n+6) { margin-bottom: 0; }
    .waya { width: calc(100% - 320px); margin-left: 0 }
    .entrypoints { display: none }

    
    .masrawyApp{height:154px}
   .masrawyApp a{padding:16px 100px 0}
    .masrawyApp .appHand{left:8%;bottom: -88px;}
    .masrawyApp .rightSide{width:270px}
    .masrawyApp .rightSide p{font-size:36px;margin-bottom:20px}
    .masrawyApp .rightSide span{font-size:23px;margin-bottom:20px}

    .masrawyApp .rightSide .appBtns div{width:112px;height:40px}
}

@media screen and (min-width:1024px) and (max-width:1151px) {
    .featuredArea.fixed { width: 448px !important; right: calc(((100% - 800px) / 2) + 16px) }
     .featuredArea ul li { margin-left: 16px; margin-bottom: 16px; width: calc((100% - 16px) / 2); position: relative; border: none; overflow: hidden }
    .featuredArea ul li a img { width: 100%; height: auto; 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; }
    .featuredArea ul li:first-child a img { width: 100% }
    .featuredArea ul li:first-child { width: 100% }
    .featuredArea ul li:last-child { display: none }
    .featuredArea ul li:nth-child(2), .featuredArea ul li:last-child { margin-left: 16px }
    .featuredArea ul li:nth-child(2n + 1) { margin-left: 0 }
    .featuredArea ul li:nth-child(4), .featuredArea ul li:nth-child(5), .featuredArea ul li:last-child { margin-bottom: 0 }
         .featuredHintSticky.fixed{ width: 448px !important; right: calc(((100% - 800px) / 2) + 16px) }
    .ramadan .featuredArea.fixed{width:100%;right:unset;}


      .media ul li { width: calc((100% - 16px) / 2); margin-left: 16px }
    .media ul li:nth-of-type(2n+1) { margin-left: 0 }
    .media ul li .item .imageCntnr { padding-bottom: calc((130px * 75) / 100); width: 130px; }
    .media .cnts { width: calc(100% - 130px); }
    .media .desc { padding: 6px 10px }
    .media ul li:first-child { width: 100%; margin-left: 0; margin-bottom: 16px }
    .media ul li:last-child { display: inline-block }
    .media ul li:nth-of-type(5) { margin-bottom: 0 }
    
        .masrawyApp a{padding:30px 100px 0}
    .masrawyApp:after{left:8%}
    .masrawyApp .rightSide{width:300px}
    .masrawyApp .rightSide p{font-size:40px}
    .masrawyApp .rightSide span{font-size:26px}
    .masrawyApp .rightSide .appBtns div{width:130px;height:40px}


        .openVideoPopupMain .videoPlayerPopup { padding: 70px 100px }
    .videoPlayerPopup .videoSponsor { top: 70px; right: 20px }
    .videoPlayerPopup .videoSponsor img { height: 50px }
    .videoPlayerPopup .mainVideo { width: calc(100% - 250px); padding-left: 20px; }
    .videoPlayerPopup aside { width: 250px }
    .videoPlayerPopup aside .playerList li .imageCntnr { padding-bottom: calc((90px * 67)/ 100); width: 90px }
    .videoPlayerPopup aside .playerList li .desc { width: calc(100% - 90px); padding: 0 10px; }
    .videoPlayerPopup aside .playerList li .desc p { font-size: 12px; max-height: 38px; }
    .videoPlayerPopup aside .playerList li .desc p.date { font-size: 10px }
    .videoPlayerPopup .mainVideo .desc { padding: 10px 16px }
    .videoPlayerPopup .mainVideo .desc p.date { font-size: 12px; margin-bottom: 0 }
    .videoPlayerPopup .mainVideo .desc p { font-size: 20px; height: 72px }
    .videoPlayerPopup .mainVideo .shareMenu { top: 10px }
    .videoPlayerPopup .mainVideo .cntnr .twitter-tweet iframe { width: 100% !important }

     .catPattern01 ul li { width: calc((100% - 32px) / 3); margin-bottom: 16px }
    .catPattern01 ul li:nth-child(3n+2) { margin-left: 0 }
    .catPattern01 ul li:first-child, .catPattern01 ul li:nth-child(2) { width: calc((100% - 16px) / 2); }
    .catPattern01 ul li:nth-child(2) { margin-left: 0 }
    .catPattern01 ul li:nth-child(3) { margin-left: 16px }
    .catPattern01 ul li:nth-last-child(-n+5) { margin-bottom: 16px }
    .catPattern01 ul li:nth-last-of-type(-n+3) { margin-bottom: 0 }
    .catPattern01 ul li:nth-last-child(-n+6) .desc { position: relative; background: none; padding: 10px; }
    .catPattern01 ul li:nth-last-child(-n+6) .desc p { position: relative; color: #1d1d1d; font-size: 14px; line-height: 1.6; padding: 0px; height: 68px; overflow: hidden; bottom: auto }
    .catPattern01 ul li:nth-last-child(-n+6) .item:hover .desc p { color: #666; }
    .catPattern01 ul li.news:nth-child(3) .item:hover a p,
    .catPattern01 ul li.news:nth-child(3) .item:hover .desc p { color: #E03322 !important; }
    .catPattern01 ul li.sports:nth-child(3) .item:hover a p,
    .catPattern01 ul li.sports:nth-child(3) .item:hover .desc p { color: #056818 !important; }
    .catPattern01 ul li.arts:nth-child(3) .item:hover a p,
    .catPattern01 ul li.arts:nth-child(3) .item:hover .desc p { color: #A8006B !important; }
    .catPattern01 ul li.howa_w_hya:nth-child(3) .item:hover a p,
    .catPattern01 ul li.howa_w_hya:nth-child(3) .item:hover .desc p { color: #7b1fa2 !important; }
    .catPattern01 ul li.autos:nth-child(3) .item:hover a p,
    .catPattern01 ul li.autos:nth-child(3) .item:hover .desc p { color: #1a237e !important; }
    .catPattern01 ul li.islameyat:nth-child(3) .item:hover a p,
    .catPattern01 ul li.islameyat:nth-child(3) .item:hover .desc p { color: #075C99 !important; }
    .catPattern02 ul li:first-child { width: 100%; margin-left: 0 }
    .catPattern02 ul li:nth-child(2), .catPattern02 ul li { width: calc((100% - 12px) / 2); margin-left: 12px; margin-bottom: 12px }
    .catPattern02 ul li:nth-child(2n+1) { margin-left: 0 }
    .catPattern02 ul li:nth-last-child(-n+3) { margin-bottom: 12px }
    .catPattern02 ul li:nth-last-child(-n+2) { margin-bottom: 0 }
    .catPattern02 ul li:nth-last-child(-n+4) .desc { position: relative; background: none; padding: 10px; }
    .catPattern02 ul li:nth-last-child(-n+4) .desc p { position: relative; color: #1d1d1d; font-size: 14px; line-height: 1.4; padding: 5px 0; height: 62px; overflow: hidden; margin-bottom: 5px; bottom: auto }
    .catPattern02 ul li:nth-last-child(-n+4) .item:hover .desc p { color: #666 }
    .catPattern02 ul li.news:nth-child(2) .item:hover a p,
    .catPattern02 ul li.news:nth-child(2) .item:hover .desc p { color: #E03322 !important; }
    .catPattern02 ul li.sports:nth-child(2) .item:hover a p,
    .catPattern02 ul li.sports:nth-child(2) .item:hover .desc p { color: #056818 !important; }
    .catPattern02 ul li.arts:nth-child(2) .item:hover a p,
    .catPattern02 ul li.arts:nth-child(2) .item:hover .desc p { color: #A8006B !important; }
    .catPattern02 ul li.howa_w_hya:nth-child(2) .item:hover a p,
    .catPattern02 ul li.howa_w_hya:nth-child(2) .item:hover .desc p { color: #7b1fa2 !important; }
    .catPattern02 ul li.autos:nth-child(2) .item:hover a p,
    .catPattern02 ul li.autos:nth-child(2) .item:hover .desc p { color: #1a237e !important; }
    .catPattern02 ul li.islameyat:nth-child(2) .item:hover a p,
    .catPattern02 ul li.islameyat:nth-child(2) .item:hover .desc p { color: #075C99 !important; }
    .catPattern03 { width: 100%; margin-left: 0 }
    .catPattern03 ul li { width: calc((100% - 32px) / 3); margin-bottom: 16px; margin-left: 16px }
    .catPattern03 ul li a .imageCntnr { width: 100%; padding-bottom: 75% }
    .catPattern03 ul li:first-child a .imageCntnr, .catPattern03 ul li:nth-child(2) a .imageCntnr { position: relative; overflow: hidden; padding-bottom: 75%; float: none; width: auto; margin-left: 0; }
    .catPattern03 ul li:first-child .desc, .catPattern03 ul li:nth-child(2) .desc { position: absolute; bottom: 0; right: 0; float: none; width: 100%; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0); }
    .catPattern03 ul li:first-child .desc p, .catPattern03 ul li:nth-child(2) .desc p { font-size: 18px; line-height: 1.6; margin-bottom: 0; position: absolute; bottom: 0; right: 0; font-size: 16px; color: #fff; padding: 12px; height: auto; }
    .catPattern03 ul li:nth-child(3n+2) { margin-left: 0 }
    .catPattern03 ul li:first-child, .catPattern03 ul li:nth-child(2) { width: calc((100% - 16px) / 2); }
    .catPattern03 ul li:nth-child(2) .desc h2{font-size: 18px;line-height: 1.6;margin-bottom: 0;position: absolute;bottom: 6px;right: 0;font-size: 16px;color: #fff;padding: 0 10px;height: auto;}
    .catPattern03 ul li:nth-child(2) { margin-left: 0 }
    .catPattern03 ul li:nth-child(3) { margin-left: 16px }
    .catPattern03 ul li:nth-child(3),
    .catPattern03 ul li:nth-child(4),
    .catPattern03 ul li:nth-child(5) { margin-bottom: 0 }
    .catPattern03 ul li:nth-child(3) .desc,
    .catPattern03 ul li:nth-child(4) .desc,
    .catPattern03 ul li:nth-child(5) .desc { position: relative; background: none; padding: 10px; width: 100% }
    .catPattern03 ul li:nth-child(3) .desc p,
    .catPattern03 ul li:nth-child(4) .desc p,
    .catPattern03 ul li:nth-child(5) .desc p { position: relative; color: #1d1d1d; font-size: 14px; line-height: 1.6; padding: 0px; height: 68px; overflow: hidden; }
    .catPattern03 ul li:nth-child(3) .item:hover .desc p,
    .catPattern03 ul li:nth-child(4) .item:hover .desc p,
    .catPattern03 ul li:nth-child(5) .item:hover .desc p { color: #666; }
    .catPattern03 ul li:nth-child(2) .item:hover a p,
    .catPattern03 ul li:nth-child(2) .item:hover .desc p { color: #fff !important }
    .cd-gallery li { width: calc((100% - 16px) / 2); }

        .infoClips { max-width: 100%; margin: 0 }
       .infoClips.inner .corona { width: 100%; margin-bottom: 20px }
    .infoClips.inner .waya { width: 100%; margin-right: 0 }

     .paginationDiv .pattern01 ul li { width: calc((100% - 16px) / 2) }
    .paginationDiv .pattern01 ul li:nth-child(3n) { margin-left: 16px }
    .paginationDiv .pattern01 ul li:nth-child(2n) { margin-left: 0 }
    .paginationDiv .pattern01 ul li:nth-last-of-type(-n+2) { display: inline-block }
    .mostRead { width: 100%; margin-left: 0 }
    .monsterDiv { margin-right: calc((100% - 624px) / 2) }
      .mostRead { width: 100%; margin-left: 0 }
    .monsterDiv { margin-right: calc((100% - 620px) / 2) }
     .opinions { width: 100%; }
    .mobawaba { /*width:calc(100% - 348px);height:225px*/ }
    .mobawaba .border { height: 201px }
    .mobawaba .allItems { border-bottom: none; height: 225px }
    .mobawaba ul li { display: inline-block }
    .mobawaba ul li a img { width: 178px; height: auto; float: right; margin-left: 12px }
    .mobawaba .desc { width: calc(100% - 190px); height: auto; overflow: hidden; cursor: pointer; position: relative; bottom: auto; top: 0; right: 0; float: right; background: none }
    .mobawaba .desc p { text-align: right; padding: 0; position: relative; }
    .mobawaba .footer { width: calc(100% - 190px); height: 65px; background: #01313d; padding: 8px; float: right; right: 190px; bottom: 0 }

    .opinions { width: 100%; margin-left: 0 }
    .crossMedia { width: calc(100% - 352px) }


      .mostRead { width: 100%; margin-left: 0 }
    .monsterDiv { margin-right: calc((100% - 620px) / 2) }

    .pattern01 ul li { width: calc((100% - 48px) / 4); }
    .pattern01 ul li:nth-child(5n) { margin-left: 16px; }
    .pattern01 ul li:nth-child(4n) { margin-left: 0; }
    .pattern01 ul li:nth-last-of-type(-n+2) { display: none }
    .pattern01 ul li:nth-last-child(-n+6) { margin-bottom: 0; }
    .waya { width: calc(100% - 320px); margin-left: 0 }

        .entrypoints { margin-right: calc((100% - 624px) / 2) }
        .entrypoints { display: none }

        
    .masrawyApp{height:154px}
   .masrawyApp a{padding:16px 100px 0}
    .masrawyApp .appHand{left:8%;bottom: -88px;}
    .masrawyApp .rightSide{width:270px}
    .masrawyApp .rightSide p{font-size:36px;margin-bottom:20px}
    .masrawyApp .rightSide span{font-size:23px;margin-bottom:20px}

    .masrawyApp .rightSide .appBtns div{width:112px;height:40px}
}


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

     .featuredArea, .featuredHintSticky { width: 100%; margin-left: 0 }
    .featuredHintSticky{margin-bottom:40px}

    /*.featuredArea.fixed{width:448px!important;right:calc(((100% - 800px) / 2) + 16px)}*/
    .featuredArea ul li { margin-left: 16px; margin-bottom: 16px; width: calc((100% - 16px) / 2); position: relative; border: none; overflow: hidden }
    .featuredArea ul li a img { width: 100%; height: auto; 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; }
    .featuredArea ul li:first-child a img { width: 100% }
    .featuredArea ul li:first-child { width: 100% }
    .featuredArea ul li:last-child { display: none }
    .featuredArea ul li:nth-child(2), .featuredArea ul li:last-child { margin-left: 16px }
    .featuredArea ul li:nth-child(2n + 1) { margin-left: 0 }
    .featuredArea ul li:nth-child(4), .featuredArea ul li:nth-child(5), .featuredArea ul li:last-child { margin-bottom: 0 }
    .leftSide { width: 100% }
 
    .media ul li { width: calc((100% - 16px) / 2); margin-left: 16px }
    .media ul li:nth-of-type(2n+1) { margin-left: 0 }
    .media ul li .item .imageCntnr { padding-bottom: calc((142px * 56.25) / 100); width: 130px; }
    .media .cnts { width: calc(100% - 130px); }
    .media .desc { padding: 6px 10px }
    .media ul li:first-child { width: 100%; margin-left: 0; margin-bottom: 16px }
    .media ul li:last-child { display: inline-block }
    .media ul li:nth-last-of-type(-n+2) { margin-bottom: 0 }

    .paginationDiv .pattern01 ul li:nth-last-of-type(-n+2) { display: inline-block }
    .paginationDiv .pattern01 ul li:nth-child(4n) { margin-left: 16px; }

        .masrawyApp a{padding:30px 100px 0}
    .masrawyApp:after{left:8%}
    .masrawyApp .rightSide{width:300px}
    .masrawyApp .rightSide p{font-size:40px}
    .masrawyApp .rightSide span{font-size:26px}
    .masrawyApp .rightSide .appBtns div{width:130px;height:40px}

        .openVideoPopupMain .videoPlayerPopup { padding: 0 }
    .openVideoPopupMain .videoPlayerContainer { padding: 100px 0; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: flex-start; overflow-y: auto; width: auto; height: 100%; color: #fff; }
    .videoPlayerPopup .videoSponsor { top: 0; right: 0; padding: 20px 10px; background: #1a3f80; z-index: 2; border-bottom-left-radius: 6px }
    .videoPlayerPopup .videoSponsor img { height: 40px }
    .videoPlayerPopup .closeVideoPopup { top: 10px; left: 30px }
    .videoPlayerPopup .playerPopupCntnr { display: inline-block }
    .videoPlayerPopup .mainVideo { width: 100%; padding-left: 0; margin-bottom: 50px; }
    .videoPlayerPopup aside { width: 100%; border-radius: 0 }
    .videoPlayerPopup aside .playerList { width: 100%; height: 100% }
    .videoPlayerPopup aside .playerList li .imageCntnr { padding-bottom: calc((150px * 67)/ 100); width: 150px }
    .videoPlayerPopup aside .playerList li .desc { width: calc(100% - 150px); padding: 0 10px; }
    .videoPlayerPopup aside .playerList li .desc p { font-size: 13px; max-height: 42px; }
    .videoPlayerPopup aside .playerList li .desc p.date { font-size: 10px }
    .videoPlayerPopup .mainVideo .desc { padding: 10px 16px }
    .videoPlayerPopup .mainVideo .desc p.date { font-size: 12px; margin-bottom: 0 }
    .videoPlayerPopup .mainVideo .desc p { font-size: 20px; height: auto }
    .videoPlayerPopup .mainVideo .shareMenu { top: 10px; left: 10px }
    .videoPlayerPopup .mainVideo .cntnr .twitter-tweet iframe { width: 450px !important; }

     .catPattern01 ul li { margin-left: 0; margin-bottom: 16px; width: 100%; overflow: visible }
    .catPattern01 ul li:first-child, .catPattern01 ul li:nth-child(2), .catPattern01 ul li:nth-child(3) { width: 100% }
    .catPattern01 ul li:nth-child(3) { margin-left: 0 }
    .catPattern01 ul li:nth-child(2n) { margin-left: 0 }
    .catPattern01 ul li:nth-last-child(-n+5) { margin-bottom: 16px }
    .catPattern01 ul li:last-child { margin-bottom: 0 }
    .catPattern01 .desc h2, .catPattern01 ul li:nth-child(2) .desc h2, .catPattern01 ul li:nth-child(3) .desc h2 { color: #000; position: relative; bottom: auto; padding: 0; height: 60px; line-height: 1.6; font-size: 14px; }
    .catPattern01 ul li:first-child .desc h2 { color: #fff; position: absolute; padding: 10px; height: auto; font-size: 18px; line-height: 1.8; bottom: 6px }
    .catPattern01 ul li a .imageCntnr { width: 132px; padding-bottom: calc((142px * 56.25)/ 100); float: right; }
    .catPattern01 ul li:first-child a .imageCntnr { width: 100%; padding-bottom: 56.25%; float: right; margin-left: 0; }
    .catPattern01 .desc { float: right; position: relative; width: calc(100% - 132px); height: auto; display: inline-block; background: #fff; padding: 10px; margin-top: 0; }
    .catPattern01 ul li:first-child .desc { float: right; position: absolute; width: 100%; height: 50%; display: inline-block; padding: 0; margin-top: 0; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#ff1a3b00',GradientType=0); }
    .catPattern01 ul li:nth-last-child(-n+7) .desc { position: relative; background: none; height: 80px; }
    .catPattern01 .desc h2 { color: #000; position: relative; padding: 0; height: 60px; line-height: 1.6; font-size: 14px; }
    .catPattern01 ul li:first-child .desc h2 { color: #fff; position: absolute; padding: 0 10px; height: auto; font-size: 18px; }
    .catPattern01 ul li:first-child:after, .catPattern01 ul li:last-child:after { display: none }
    .catPattern02 { width: 100%; margin-left: 0 }
    .catPattern02 ul li { margin-left: 0; margin-bottom: 16px; width: 100%; overflow: visible }
    .catPattern02 ul li:first-child, .catPattern02 ul li:nth-child(2), .catPattern02 ul li:nth-child(3) { width: 100% }
    .catPattern02 ul li:nth-child(3) { margin-left: 0 }
    .catPattern02 ul li:nth-child(2n) { margin-left: 0 }
    .catPattern02 ul li:nth-last-child(-n+5) { margin-bottom: 16px }
    .catPattern02 ul li:last-child { margin-bottom: 0 }
    .catPattern02 .desc h2, .catPattern02 ul li:nth-child(2) .desc h2, .catPattern02 ul li:nth-child(3) .desc h2 { color: #000; position: relative; bottom: auto; padding: 0; height: 60px; line-height: 1.6; font-size: 14px; }
    .catPattern02 ul li:first-child .desc h2 { color: #fff; position: absolute; padding: 0 10px; height: auto; font-size: 18px; line-height: 1.8; bottom: 6px }
    .catPattern02 ul li a .imageCntnr { width: 132px; padding-bottom: calc((142px * 56.25)/ 100); float: right; }
    .catPattern02 ul li:first-child a .imageCntnr { width: 100%; padding-bottom: 56.25%; float: right; margin-left: 0; }
    .catPattern02 .desc { float: right; position: relative; width: calc(100% - 132px); height: auto; display: inline-block; background: #fff; padding: 10px; margin-top: 0; }
    .catPattern02 ul li:first-child .desc { float: right; position: absolute; width: 100%; height: 50%; display: inline-block; padding: 0; margin-top: 0; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#ff1a3b00',GradientType=0); }
    .catPattern02 ul li:nth-last-child(-n+4) .desc { position: relative; background: none; height: 80px; }
    .catPattern02 .desc h2 { color: #000; position: relative; padding: 0; height: 60px; line-height: 1.6; font-size: 14px; }
    .catPattern02 ul li:first-child:after, .catPattern02 ul li:last-child:after { display: none }
    .catPattern03 { width: 100%; margin-left: 0; height: auto }
    .catPattern03 ul li { margin-left: 0; margin-bottom: 16px; width: 100%; overflow: visible }
    .catPattern03 ul li:first-child, .catPattern03 ul li:nth-child(2), .catPattern03 ul li:nth-child(3) { width: 100% }
    .catPattern03 ul li:nth-child(3) { margin-left: 0 }
    .catPattern03 ul li:nth-child(2n) { margin-left: 0 }
    .catPattern03 ul li:nth-last-child(-n+5) { margin-bottom: 16px }
    .catPattern03 ul li:last-child { margin-bottom: 0 }
    .catPattern03 .desc h2, .catPattern03 ul li:nth-child(2) .desc h2, .catPattern03 ul li:nth-child(3) .desc h2 { color: #000; position: relative; bottom: auto; padding: 0; height: 60px; line-height: 1.6; font-size: 14px; }
    .catPattern03 ul li:first-child .desc h2 { color: #fff; position: absolute; padding: 0 10px; height: auto; font-size: 18px; line-height: 1.8; bottom: 6px }
    .catPattern03 ul li a .imageCntnr { width: 132px; padding-bottom: calc((132px * 56.25)/ 100); float: right; margin-left: 0 }
    .catPattern03 ul li:first-child a .imageCntnr { width: 100%; padding-bottom: 56.25%; float: right; margin-left: 0; }
    .catPattern03 .desc { float: right; position: relative; width: calc(100% - 132px); height: auto; display: inline-block; background: #fff; padding: 10px; margin-top: 0; }
    .catPattern03 ul li:first-child .desc { float: right; position: absolute; width: 100%; height: 50%; display: inline-block; padding: 0; margin-top: 0; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#ff1a3b00',GradientType=0); }
    .catPattern03 ul li:nth-last-child(-n+4) .desc { position: relative; background: none; height: 80px; }
    .catPattern03 .desc h2 { color: #000; position: relative; padding: 0; height: 60px; line-height: 1.6; font-size: 14px; }
    .catPattern03 ul li:first-child:after, .catPattern03 ul li:last-child:after { display: none }


      .catPattern01 ul li.news:nth-child(2) .item:hover a p,
    .catPattern01 ul li.news:nth-child(2) .item:hover .desc p,
    .catPattern01 ul li.news:nth-child(3) .item:hover a p,
    .catPattern01 ul li.news:nth-child(3) .item:hover .desc p { color: #E03322 !important; }
    .catPattern01 ul li.sports:nth-child(2) .item:hover a p,
    .catPattern01 ul li.sports:nth-child(2) .item:hover .desc p,
    .catPattern01 ul li.sports:nth-child(3) .item:hover a p,
    .catPattern01 ul li.sports:nth-child(3) .item:hover .desc p { color: #056818 !important; }
    .catPattern01 ul li.arts:nth-child(2) .item:hover a p,
    .catPattern01 ul li.arts:nth-child(2) .item:hover .desc p,
    .catPattern01 ul li.arts:nth-child(3) .item:hover a p,
    .catPattern01 ul li.arts:nth-child(3) .item:hover .desc p { color: #A8006B !important; }
    .catPattern01 ul li.howa_w_hya:nth-child(2) .item:hover a p,
    .catPattern01 ul li.howa_w_hya:nth-child(2) .item:hover .desc p,
    .catPattern01 ul li.howa_w_hya:nth-child(3) .item:hover a p,
    .catPattern01 ul li.howa_w_hya:nth-child(3) .item:hover .desc p { color: #7b1fa2 !important; }
    .catPattern01 ul li.autos:nth-child(2) .item:hover a p,
    .catPattern01 ul li.autos:nth-child(2) .item:hover .desc p,
    .catPattern01 ul li.autos:nth-child(3) .item:hover a p,
    .catPattern01 ul li.autos:nth-child(3) .item:hover .desc p { color: #1a237e !important; }
    .catPattern01 ul li.islameyat:nth-child(2) .item:hover a p,
    .catPattern01 ul li.islameyat:nth-child(2) .item:hover .desc p,
    .catPattern01 ul li.islameyat:nth-child(3) .item:hover a p,
    .catPattern01 ul li.islameyat:nth-child(3) .item:hover .desc p { color: #075C99 !important; }
    /********************/
    .catPattern02 ul li.news:nth-child(2) .item:hover a p,
    .catPattern02 ul li.news:nth-child(2) .item:hover .desc p,
    .catPattern02 ul li.news:nth-child(3) .item:hover a p,
    .catPattern02 ul li.news:nth-child(3) .item:hover .desc p { color: #E03322 !important; }
    .catPattern02 ul li.sports:nth-child(2) .item:hover a p,
    .catPattern02 ul li.sports:nth-child(2) .item:hover .desc p,
    .catPattern02 ul li.sports:nth-child(3) .item:hover a p,
    .catPattern02 ul li.sports:nth-child(3) .item:hover .desc p { color: #056818 !important; }
    .catPattern02 ul li.arts:nth-child(2) .item:hover a p,
    .catPattern02 ul li.arts:nth-child(2) .item:hover .desc p,
    .catPattern02 ul li.arts:nth-child(3) .item:hover a p,
    .catPattern02 ul li.arts:nth-child(3) .item:hover .desc p { color: #A8006B !important; }
    .catPattern02 ul li.howa_w_hya:nth-child(2) .item:hover a p,
    .catPattern02 ul li.howa_w_hya:nth-child(2) .item:hover .desc p,
    .catPattern02 ul li.howa_w_hya:nth-child(3) .item:hover a p,
    .catPattern02 ul li.howa_w_hya:nth-child(3) .item:hover .desc p { color: #7b1fa2 !important; }
    .catPattern02 ul li.autos:nth-child(2) .item:hover a p,
    .catPattern02 ul li.autos:nth-child(2) .item:hover .desc p,
    .catPattern02 ul li.autos:nth-child(3) .item:hover a p,
    .catPattern02 ul li.autos:nth-child(3) .item:hover .desc p { color: #1a237e !important; }
    .catPattern02 ul li.islameyat:nth-child(2) .item:hover a p,
    .catPattern02 ul li.islameyat:nth-child(2) .item:hover .desc p,
    .catPattern02 ul li.islameyat:nth-child(3) .item:hover a p,
    .catPattern02 ul li.islameyat:nth-child(3) .item:hover .desc p { color: #075C99 !important; }

     .opinions { width: 100%; }
    .mostRead { width: 100%; margin-left: 0 }
    .monsterDiv { margin-right: calc((100% - 620px) / 2) }
     .crossMedia { width: calc(100% - 352px) }

    .mobawaba .border { height: 201px }
    .mobawaba .allItems { border-bottom: none }
    .mobawaba ul li { display: inline-block; width: 100%; }
    .mobawaba ul li a img { width: 120px; height: auto; float: right; margin-left: 12px }
    .mobawaba .desc { width: calc(100% - 132px); height: auto; overflow: hidden; cursor: pointer; position: relative; bottom: auto; top: 0; right: 0; float: right; background: none }
    .mobawaba .desc p { text-align: right; padding: 0; position: relative; }
    .mobawaba .footer { width: 100%; height: 40px; background: #01313d; padding: 8px; float: right; right: 0; bottom: -46px }
    .mobawaba .footer .price { float: right; font-family: Arial; font-weight: bold; font-size: 20px; color: #fff; line-height: 1.2 }
    .mobawaba .footer .price span { margin-right: 5px;  font-size: 14px; font-weight: normal }
    .mobawaba .footer .add { float: left; height: 24px; padding: 0 8px;  font-size: 15px; color: #fff; line-height: 1.8 }
    .mobawaba .footer .add:hover { background: #08708a }

     .pattern01 ul li { width: calc((100% - 48px) / 4); }
    .pattern01 ul li:nth-child(5n) { margin-left: 16px; }
    .pattern01 ul li:nth-child(4n) { margin-left: 0; }
    .pattern01 ul li:nth-last-of-type(-n+2) { display: none }
    .pattern01 ul li:nth-last-child(-n+6) { margin-bottom: 0; }
    .waya { width: calc(100% - 320px); margin-left: 0 }
    .entrypoints { margin-right: calc((100% - 624px) / 2) }
    .entrypoints { display: none }

     .akhbarThemak.fixed { position: relative; }
    .akhbarThemak { width: 100%; top: 0 !important; height: auto !important; }
    .akhbarThemak .cd-popup-container { width: 700px; height: 400px; }
    .akhbarThemak .cd-popup-container .sectionContainer { overflow-y: scroll; overflow-x: hidden; height: 200px }
    .akhbarThemak .cd-popup-container h4 { margin-bottom: 20px }
    .akhbarThemak .cd-popup-container h3 { line-height: 36px }
    .akhbarThemak .cd-popup-container .sec { width: 100%; margin-left: 0; margin-bottom: 24px; float: none; }
    .akhbarThemak .cd-popup-container .sec:nth-child(6n+1) { margin-left: 0 }
    .akhbarThemak input[type="checkbox"] + label { margin: 0 0 10px 20px; width: auto }
    .akhbarThemak .cd-popup-container .sec:last-child { width: 100% }
       .masrawyApp{height:154px;background: linear-gradient(168deg, rgb(44 53 68) 0, rgba(29, 29, 29, 1) 100%);}
     .masrawyApp a{padding:16px 100px 0}
    .masrawyApp .appHand{left:8%;bottom: -88px;}
    .masrawyApp .appbk{height:auto}
    
        
    .masrawyApp .rightSide{width:270px}
    .masrawyApp .rightSide p{font-size:36px;margin-bottom:20px}
    .masrawyApp .rightSide span{font-size:23px;margin-bottom:20px}

    .masrawyApp .rightSide .appBtns div{width:112px;height:40px}
    }

@media screen and (min-width:320px) and (max-width:767px) {

     .featuredArea { padding: 10px 10px 0 }
    .featuredArea .allItems { padding: 10px 0 }
    /*.featuredArea ul { margin-bottom: 40px }*/
    .featuredArea ul li { margin-left: 0; width: 100%; margin-bottom: 16px; overflow: visible; background: #fff; border: 1px solid #e8e8e8 }

    .featuredArea .desc { width: calc(100% - 120px);pointer-events:visible; height: auto; overflow: hidden; cursor: pointer; position: relative; bottom: 0; right: 0; background: none; padding: 0 10px; display: inline-block; float: right; }
    .featuredArea .desc .details { position: relative; bottom: auto; right: auto; display: inline-block; float: right }
    .featuredArea .desc h2 { color: #1d1d1d; text-align: right; line-height: 1.6; max-height: 38px;min-height:20px; overflow: hidden; padding: 0; font-size: 12px;position: relative; bottom: 0; right: 0; -webkit-line-clamp: 2; }
    
    .featuredArea ul li:nth-last-child(-n+5) .item:hover .desc h2 { color: #666 }
    .featuredArea.fixed {width:100%!important;right:unset!important;top:unset!important;position:relative}

    .featuredArea ul li:first-child .desc{width: 100%;height: 50%;position: absolute;pointer-events:none;bottom: 0;right: 0;background: linear-gradient(270deg,rgba(0,0,0,0),#000000);
    background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000);
    background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000);
    background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000);
    background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0);
}


    .featuredArea ul li:first-child .desc h2 { font-size: 16px; line-height: 1.6;min-height:26px;color: #fff;max-height:51px }
    .featuredArea ul li:first-child:after, .featuredArea ul li:last-child:after { display: none }
    .featuredArea ul li .link .imageCntnr { position: relative; width: 120px; overflow: hidden; padding-bottom: calc((120px * 56.25) / 100); float: right; }
    .featuredArea ul li:first-child .link .imageCntnr { padding-bottom: 56.25% }
    .featuredArea ul li:first-child .link .imageCntnr { width: 100%; }
    .featuredArea ul li:first-child { width: 100% }
    .featuredArea ul li:nth-child(2), .featuredArea ul li:nth-child(3) { width: 100% }
    .featuredArea ul li:nth-child(3), .featuredArea ul li:nth-child(5), .featuredArea ul li:last-child { margin-left: 0 }
        .featuredArea ul li.featuredSCMob { background:none;border:none;margin-left:0;}

    .featuredArea ul li:first-child { margin-bottom: 16px }
    .featuredArea ul li:nth-child(4), .featuredArea ul li:nth-child(5) { margin-bottom: 16px }
    .featuredArea ul li:last-child { display: block }
    
    .featuredArea ul li span { margin-right: 0; margin-top: 2px;margin-bottom: 2px }
    .featuredArea ul li:first-child span { margin-right: 0; margin-top: 0;margin-bottom: 6px }
    .featuredArea ul li:nth-last-child(-n+5) .secName { background: none !important; padding: 0; font-weight: bold; font-size: 11px; }

      .media { width: calc(100% - 20px); margin: 0 10px 40px }
    .media ul li { width: 100% }
    .media ul li:first-child { width: 100% }
    .media ul li:nth-child(2n) { margin-left: 0 }
    .media ul li:nth-child(3) { margin-left: 0 }
    .media ul li:nth-last-child(-n+3) { margin-bottom: 16px }
    .media ul li:last-child { margin-bottom: 0 }
    .media ul li .item .imageCntnr { padding-bottom: calc((120px * 56.25) / 100); width: 120px; }
    .media ul li .cnts { width: calc(100% - 120px); }
    .media ul li .desc { padding: 0 10px }
    .media ul li .desc h2 { color: #1d1d1d; text-align: right; line-height: 1.6; height: auto; max-height: unset; overflow: hidden; font-size: 12px;  position: relative; bottom: 0; right: 0; -webkit-line-clamp: 2; }
    .media ul li .secName { font-size: 11px; margin: 2px 0 }
    .innerSection .media .desc { padding: 4px 10px }
    .media ul li:first-child .desc h2 { font-size: 16px; line-height: 1.6; padding: 6px 10px 0; }
    .media ul li:last-child { display: inline-block; }
    .media ul li:first-child .secName { margin-bottom: 0 }
     .media ul li .item img,
    .pattern02.masrawyTV ul li .item img { width: 100%; height: auto; top: 50%; left: 50%; right: auto; bottom: auto; transform: translate(-50%, -50%) }

       .akhbarThemak { width: calc(100% - 20px); top: 0 !important; margin: 0 10px 40px;height:590px }
    .akhbarThemak li .secName { margin-bottom: 2px; font-size: 11px }
    .akhbarThemak ul li .item .imageCntnr { padding-bottom: calc((110px * 56.25) / 100); width: 110px }
    .akhbarThemak li .cnts { width: calc(100% - 110px); }
    .akhbarThemak li h2 { font-size: 12px; height: auto }
      .akhbarThemak li img,
    .crossMedia .allItems li img,
    .pattern01 ul li .item img:not(article .details .divVideoStep .ivbsThumbWrapper>img, .spk-stand-wg .sp-wi-item img),
    .pattern02 ul li .item img,
    .mostRead .allItems li img,
    .shiftPattern ul li .imageCntnr img,
    .elconsoltoPattern .sides.news li img,
    .media ul li .item img { width: 100%; height: auto; top: 50%; left: 50%; right: auto; bottom: auto; transform: translate(-50%, -50%) }

        .akhbarThemak .cd-popup-container { width: 300px; height: 400px; padding: 24px 10px }
    .akhbarThemak .cd-popup-container h2 { font-size: 18px }
    .akhbarThemak .cd-popup-container h4 { font-size: 12px }
    .akhbarThemak .cd-popup-container .sec { width: 100%; margin-left: 0; margin-bottom: 24px }
    .akhbarThemak .cd-popup-container .sec:nth-child(6n+1) { margin-left: 0; margin-bottom: 0 }
    .akhbarThemak input[type="checkbox"] + label { margin: 0 0 12px; width: 100% }
    .akhbarThemak .cd-popup-container.notify { width: 300px; height: 150px; }
    .akhbarThemak .cd-popup-container .cd-buttons { width: 280px; height: 40px; }
    .akhbarThemak .cd-popup-container .cd-buttons a { width: 135px; height: 40px; line-height: 40px; font-size: 13px; }

        .masrawyApp{height:150px;width:300px;margin:0 calc((100% - 300px) /2) 40px;}
        .masrawyApp a{padding:24px 20px 0;}
    .masrawyApp .rightSide p{font-size:23px;margin-bottom:16px}
    .masrawyApp .rightSide span{font-size:15px;margin-bottom:14px}
    .masrawyApp .rightSide{width:auto}
    .masrawyApp .rightSide .appBtns div{width:80px;height:24px}
    .masrawyApp:after{background:url(../Images/App/ApphandMib.png) no-repeat left bottom;width: 105px; background-size: 100%; left: 0;}


        .openVideoPopupMain .videoPlayerPopup { padding: 0 }
    .openVideoPopupMain .videoPlayerContainer { padding: 80px 0; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: flex-start; overflow-y: auto; width: auto; height: 100%; color: #fff; }
    .videoPlayerPopup .videoSponsor { top: 0; right: 0; padding: 20px 10px; background: #1a3f80; z-index: 2; border-bottom-left-radius: 6px }
    .videoPlayerPopup .videoSponsor img { height: 30px }
    .videoPlayerPopup .closeVideoPopup { top: 10px; left: 10px; width: 30px; height: 30px; }
    .videoPlayerPopup .closeVideoPopup:after, .videoPlayerPopup .closeVideoPopup:before { height: 20px; margin-top: -10px; }
    .videoPlayerPopup .playerPopupCntnr { display: inline-block }
    .videoPlayerPopup .mainVideo { width: 100%; padding-left: 0; margin-bottom: 30px; }
    .videoPlayerPopup aside { width: 100%; border-radius: 0 }
    .videoPlayerPopup aside .playerList { width: 100%; height: 100% }
    .videoPlayerPopup aside .playerList li .imageCntnr { padding-bottom: calc((100px * 67)/ 100); width: 100px }
    .videoPlayerPopup aside .playerList li .desc { width: calc(100% - 100px); padding: 0 10px; }
    .videoPlayerPopup aside .playerList li .desc p { font-size: 12px; max-height: 38px; }
    .videoPlayerPopup aside .playerList li .desc p.date { font-size: 10px }
    .videoPlayerPopup .mainVideo .cntnr { padding-bottom: 117% }
    .videoPlayerPopup .mainVideo .desc { padding: 16px }
    .videoPlayerPopup .mainVideo .desc p.date { font-size: 11px; margin-bottom: 10px }
    .videoPlayerPopup .mainVideo .desc p { font-size: 16px; height: auto; width: 100% }
    .videoPlayerPopup .mainVideo .shareMenu { top: 16px; left: 16px }
    .videoPlayerPopup .mainVideo .shareMenu a { width: 30px; height: 30px; font-size: 16px; line-height: 30px; }
    .videoPlayerPopup .mainVideo .shareMenu a:before { line-height: 28px; }
    .videoPlayerPopup .mainVideo .cntnr .twitter-tweet iframe { width: 100% !important; }

    .catPattern01 { padding: 10px }
    .catPattern01 .allItems { padding: 10px 0 0 }
    .catPattern01 ul li { margin-left: 0; width: 100%; margin-bottom: 16px; overflow: visible; }
    .catPattern01 ul li:first-child:after, .catPattern01 ul li:last-child:after { display: none }
    .catPattern01 ul li a .imageCntnr { position: relative; width: 120px; overflow: hidden; padding-bottom: calc((120px * 56.25) / 100); float: right; margin-left: 0 }
    .catPattern01 ul li:first-child a .imageCntnr { width: 100%; padding-bottom: 56.25% }
    .catPattern01 ul li:first-child { width: 100% }
    .catPattern01 ul li:nth-child(2), .catPattern01 ul li:nth-child(3) { width: 100% }
    .catPattern01 ul li:nth-child(3), .catPattern01 ul li:nth-child(5), .catPattern01 ul li:last-child { margin-left: 0 }
    .catPattern01 ul li:first-child { margin-bottom: 16px }
    .catPattern01 ul li:nth-child(4), .catPattern01 ul li:nth-child(5) { margin-bottom: 16px }
    .catPattern01 ul li:last-child { display: block }
    .catPattern01 ul li:nth-last-child(-n+7) { margin-bottom: 16px }
    .catPattern01 ul li:last-child { margin-bottom: 0 }
    .catPattern01 ul li:first-child .desc h2 { padding: 0 10px; font-size: 16px; line-height: 1.6; height: auto }
    .catPattern01 ul li:nth-last-child(-n+7) .desc { width: calc(100% - 120px); height: auto; overflow: hidden; cursor: pointer; position: relative; bottom: 0; right: 0; background: none; padding: 0 10px }
    .catPattern01 ul li:nth-last-child(-n+7) .desc h2 { color: #1d1d1d; text-align: right; line-height: 1.6; height: auto; padding: 4px 0; font-size: 12px;  position: relative; bottom: 0; right: 0; -webkit-line-clamp: 3; }
    .catPattern01 ul li:nth-last-child(-n+7) .item:hover .desc h2 { color: #666 }
    .catPattern02 { padding: 10px }
    .catPattern02 .allItems { padding: 10px 0 0 }
    .catPattern02 ul li { margin-left: 0; width: 100%; margin-bottom: 16px; overflow: visible; }
    .catPattern02 ul li:first-child:after, .catPattern02 ul li:last-child:after { display: none }
    .catPattern02 ul li a .imageCntnr { position: relative; width: 120px; overflow: hidden; padding-bottom: calc((120px * 56.25) / 100); float: right; margin-left: 0 }
    .catPattern02 ul li:first-child a .imageCntnr { width: 100%; padding-bottom: 56.25% }
    .catPattern02 ul li:first-child { width: 100% }
    .catPattern02 ul li:nth-child(2), .catPattern02 ul li:nth-child(3) { width: 100% }
    .catPattern02 ul li:nth-child(3), .catPattern02 ul li:nth-child(5), .catPattern02 ul li:last-child { margin-left: 0 }
    .catPattern02 ul li:first-child { margin-bottom: 16px }
    .catPattern02 ul li:first-child .desc h2 { padding: 0 10px; font-size: 16px; line-height: 1.6; }
    .catPattern02 ul li:nth-child(4), .catPattern02 ul li:nth-child(5) { margin-bottom: 16px }
    .catPattern02 ul li:last-child { display: block }
    .catPattern02 ul li:nth-last-child(-n+4) { margin-bottom: 16px }
    .catPattern02 ul li:last-child { margin-bottom: 0 }
    .catPattern02 ul li:nth-last-child(-n+4) .desc { width: calc(100% - 120px); height: auto; overflow: hidden; cursor: pointer; position: relative; bottom: 0; right: 0; background: none; padding: 0 10px }
    .catPattern02 ul li:nth-last-child(-n+4) .desc h2 { color: #1d1d1d; text-align: right; line-height: 1.6; height: auto; padding: 4px 0; font-size: 12px;  position: relative; bottom: 0; right: 0; -webkit-line-clamp: 3; }
    .catPattern02 ul li:nth-last-child(-n+4) .item:hover .desc h2 { color: #666 }
    .catPattern03 { padding: 10px }
    .catPattern03 .allItems { padding: 10px 0 0 }
    .catPattern03 ul li { margin-left: 0; width: 100%; margin-bottom: 16px; overflow: visible; }
    .catPattern03 ul li:first-child:after, .catPattern03 ul li:last-child:after { display: none }
    .catPattern03 ul li a .imageCntnr { position: relative; width: 120px; overflow: hidden; padding-bottom: calc((120px * 56.25) / 100); float: right; margin-left: 0 }
    .catPattern03 ul li:first-child a .imageCntnr { width: 100%; padding-bottom: 56.25% }
    .catPattern03 ul li:first-child { width: 100% }
    .catPattern03 ul li:nth-child(2), .catPattern03 ul li:nth-child(3) { width: 100% }
    .catPattern03 ul li:nth-child(3), .catPattern03 ul li:nth-child(5), .catPattern03 ul li:last-child { margin-left: 0 }
    .catPattern03 ul li:first-child { margin-bottom: 16px }
    .catPattern03 ul li:first-child .desc h2 { padding: 0 10px; font-size: 16px; line-height: 1.6; }
    .catPattern03 ul li:nth-child(4), .catPattern03 ul li:nth-child(5) { margin-bottom: 16px }
    .catPattern03 ul li:last-child { display: block }
    .catPattern03 ul li:nth-last-child(-n+4) { margin-bottom: 16px }
    .catPattern03 ul li:last-child { margin-bottom: 0 }
    .catPattern03 ul li:nth-last-child(-n+4) .desc { width: calc(100% - 120px); height: auto; overflow: hidden; cursor: pointer; position: relative; bottom: 0; right: 0; background: none; padding: 0 10px }
    .catPattern03 ul li:nth-last-child(-n+4) .desc h2 { color: #1d1d1d; text-align: right; line-height: 1.6; height: auto; padding: 4px 0; font-size: 12px;  position: relative; bottom: 0; right: 0; -webkit-line-clamp: 3; }
    .catPattern03 ul li:nth-last-child(-n+4) .item:hover .desc h2 { color: #666 }

        .media ul li .item img { width: 100%; height: auto; top: 50%; left: 50%; right: auto; bottom: auto; transform: translate(-50%, -50%) }

    .infoClips.inner .waya .content ul { height: 328px; }
     .infoClips { padding: 0 10px }

     .opinions { width: 100%; padding: 10px; }
    .opinions .allItems li:last-child { margin-bottom: 2px }
    .opinions .allItems li .desc h2 { font-size: 13px; height: 20px }
    .opinions .allItems li .date { display: none }
    .specialFiles { width: 300px; margin: 0 calc((100% - 300px) / 2) 40px }
    .mobawaba { padding: 12px; width: 300px; height: 367px; margin: 0 calc((100% - 300px) / 2) 40px }
    .mobawaba .border { border: 1px solid #5daebf; height: 343px }
    .mobawaba .ttl { height: 49px; border-bottom: 1px solid #5daebf }
    .mobawaba .ttl h2 a:after { display: none }
    .mobawaba .allItems { padding: 8px; border-bottom: 1px solid #5daebf }
    .mobawaba ul li { position: relative }
    .mobawaba ul li a { display: block }
    .mobawaba ul li a img { width: 100%; height: auto; margin-left: 0; border: none;}
    .mobawaba .desc { width: 100%; height: 50%; overflow: hidden; cursor: pointer; position: absolute; bottom: 0; right: 0; top: auto; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#FF000000',GradientType=0); }
    .mobawaba .desc p { color: #fff; text-align: center; line-height: 1.6; padding: 12px; font-size: 18px;  position: absolute; bottom: 0; right: 0; height: 80px; overflow: hidden }
    .mobawaba .footer { width: 100%; height: 65px; background: #01313d; padding: 8px; position: absolute; bottom: -84px; right: 0; cursor: default }
    .mobawaba .footer .price { float: right; font-family: Arial; font-weight: bold; font-size: 22px; color: #fff; line-height: 2.2; cursor: default }
    .mobawaba .footer .price span { margin-right: 5px; font-family: DroidKufiLight, Arial; font-size: 14px; font-weight: normal }
    .mobawaba .footer .add { float: left; height: 49px; padding: 0 8px;  font-size: 15px; color: #fff; line-height: 3.4 }
    .mobawaba .footer .add:hover { background: #08708a }

      .opinions { width: 100%; margin-left: 0 }
    .crossMedia { width: calc(100% - 352px) }
      .crossMedia .allItems li img,
    .pattern01 ul li .item img:not(article .details .divVideoStep .ivbsThumbWrapper>img, .spk-stand-wg .sp-wi-item img),
    .pattern02 ul li .item img,
    .mostRead .allItems li img,
    .shiftPattern ul li .imageCntnr img,
    .elconsoltoPattern .sides.news li img,
    .media ul li .item img { width: 100%; height: auto; top: 50%; left: 50%; right: auto; bottom: auto; transform: translate(-50%, -50%) }


        .waya, .infoClips.inner .waya { width: calc(100% - 20px); margin: 0 10px 40px; height: 350px !important; border: 1px solid #e8e8e8 }
    .waya .content ul { height: 300px }
    .pattern02 { padding: 0 10px }
    .masrawyTV { padding: 10px }

       .crossMedia { width: 100%; height: auto }
    .crossMedia ul li .item .imageCntnr { padding-bottom: calc((110px * 56.25) / 100); width: 110px; }
    .crossMedia .allItems li .cnts { width: calc(100% - 110px); padding-right: 10px; }
    .crossMedia .allItems li .desc h2 { font-size: 12px; height: auto; -webkit-line-clamp: 2; }
    .crossMedia .allItems li .secName { font-size: 11px; margin-bottom: 2px }
    .masrawyTV { width: 100%; height: auto }
    .masrawyTV ul li { margin-bottom: 0 !important }

     .pattern02 .allItems { padding: 10px 0 0 }
    .pattern02 ul li { margin-left: 0; width: 100%; margin-bottom: 16px; overflow: visible; background: #fff; border: 1px solid #e8e8e8 }
    .pattern02 ul li:first-child .desc h2 { height: auto; font-size: 16px; line-height: 1.6 }
    .pattern02 ul li .item .imageCntnr { position: relative; width: 120px; overflow: hidden; padding-bottom: calc((120px * 56.25) / 100); float: right }
    .pattern02 ul li:first-child .item .imageCntnr { width: 100%; padding-bottom: 56.25% }
    .pattern02 ul li:first-child { width: 100% }
    .pattern02 ul li:nth-child(2), .pattern02 ul li:nth-child(3) { width: 100% }
    .pattern02 ul li:nth-child(3), .pattern02 ul li:nth-child(5), .pattern02 ul li:last-child { margin-left: 0 }
    .pattern02 ul li:first-child { margin-bottom: 16px }
    .pattern02 ul li:nth-child(3), .pattern02 ul li:nth-child(4) { margin-bottom: 16px }
    .pattern02 ul li:last-child { display: block }
    .pattern02 ul li:nth-last-child(-n+4) .desc { width: calc(100% - 120px); height: auto; overflow: hidden; cursor: pointer; position: relative; bottom: 0; right: 0; background: none; padding: 0 10px; display: inline-block; float: right; }
    .pattern02 ul li:nth-last-child(-n+4) .desc .details { position: relative; bottom: auto; right: auto; display: inline-block; float: right }
    .pattern02 ul li:nth-last-child(-n+4) .desc h2 { color: #1d1d1d; text-align: right; line-height: 1.6; max-height: 62px; overflow: hidden; padding: 0; font-size: 12px;  position: relative; bottom: 0; right: 0; -webkit-line-clamp: 2; }
    .pattern02.ramadan ul li:nth-last-child(-n+4) .desc h2 { color: #fff; }
    .pattern02 ul li .desc span { margin-right: 0; margin-top: 2px;line-height: 20px;}
    .pattern02 ul li .item:hover a h2, .pattern02 ul li .item:hover .desc h2 {color: inherit !important;}
    .pattern02 ul li:nth-last-child(-n+4) .desc{pointer-events:visible}
    .pattern02 ul li:first-child .desc span { margin-right: 10px; margin-top: 0 }
    .pattern02 ul li:nth-last-child(-n+4) .secName { background: none !important; padding: 0; font-family: DroidKufiBold, Arial; font-size: 11px; margin-bottom: 2px }
      .mostRead { width: calc(100% - 20px); margin: 0 10px 40px; height: auto }
    .mostRead ul li .item .imageCntnr { padding-bottom: calc((110px * 56.25) / 100); width: 110px; }
    .mostRead .allItems li .cnts { width: calc(100% - 110px); padding-right: 10px; }
    .mostRead .allItems li .desc h2 { font-size: 12px; height: auto; -webkit-line-clamp: 2; }
    .mostRead .allItems li:last-child { margin-bottom: 0 }
    .mostRead .allItems li .secName { font-size: 11px; margin-bottom: 2px }

     .pattern01 { padding: 0 10px }
    .pattern01 ul li { width: 100%; margin-left: 0; margin-bottom: 16px !important }
    .pattern01 ul li:nth-last-of-type(-n+2) { display: inline-block; }
    .pattern01 ul li:last-of-type { margin-bottom: 0px !important }
    .pattern01 ul li .item img:not(article .details .divVideoStep .ivbsThumbWrapper>img, .spk-stand-wg .sp-wi-item img) { width: auto; height: 100% }
    .pattern01 ul li .nativeFrameMob { display: inline-block; float: right; width: 100% }
    .pattern01 ul li .nativeFrameMob > div { display: inline-block; float: right; width: 100% }
    .pattern01 ul li .nativeFrameMob iframe { height: 90px }
    .pattern01 ul li .item .imageCntnr { width: 120px; padding-bottom: calc((120px * 56.25) / 100); }
    .pattern01 ul li .desc { width: calc(100% - 120px); display: inline-block; float: right; }
    .pattern01 ul li .secName { top: 2px; font-size: 11px }
    .pattern01 ul li .desc h2 { line-height: 1.6; height: auto; overflow: hidden; font-size: 12px; margin: 26px 0 0; -webkit-line-clamp: 2; }
    .paginationDiv .pattern01 ul li { width: 100%; margin-left: 0 !important; margin-bottom: 16px !important }
     .entrypoints { margin: 0 calc((100% - 300px) / 2) 40px }

             .masrawyApp{height:150px;width:300px;margin:0 calc((100% - 300px) /2) 40px;}
        .masrawyApp a{padding:24px 20px 0;}
    .masrawyApp .rightSide p{font-size:23px;margin-bottom:16px}
    .masrawyApp .rightSide span{font-size:15px;margin-bottom:14px}
    .masrawyApp .rightSide{width:auto}
    .masrawyApp .rightSide .appBtns div{width:80px;height:24px}
    .masrawyApp .appHand{width: auto;
        left: 0;
        height: 140px;bottom:0}

    .featuredHintSticky.fixed{width: 100% !important;
    position: relative;
    top: auto;
    right: auto;}
}