@charset "UTF-8";



/********** Keywords **********/
.mainKeywords { background: #fff; overflow: hidden; margin-bottom: 20px; box-shadow: none; padding: 20px 16px; border: 1px solid #e8e8e8;height:77px }
.mainKeywords .title { display: inline-block; float: right; width: 164px; margin-left: 20px; height: 35px }
.mainKeywords img { display: inline-block; float: right; width: 26px; height: auto; margin-left: 4px; margin-top: 4px; }
.mainKeywords p { float: right; display: inline-block; font-family: DroidKufiBold, Arial; font-size: 14px; color: #1d1d1d; text-align: center; line-height: 35px; }
.mainKeywords .keywords { float: right; display: inline-block; width: calc(100% - 184px); height: 35px; overflow: hidden }
.mainKeywords .keywords a { float: right; padding: 5px 20px;  color: #1d1d1d; font-size: 13px; background: #f2f2f2; margin-left: 10px; display: inline-block; }
.mainKeywords .keywords a:last-child { margin-left: 0 }
.mainKeywords .keywords a:hover { background: #E03322; color: #fff }
/********** 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 }

/********** 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.2s 0s, visibility 0s 0.2s; -moz-transition: opacity 0.2s 0s, visibility 0s 0.2s; transition: opacity 0.2s 0s, visibility 0s 0.2s; }
.akhbarThemak .popupSetting.is-visible, .akhbarThemak .popupNotify.is-visible { opacity: 1; visibility: visible; z-index: 10; -webkit-transition: opacity 0.2s 0s, visibility 0s 0s; -moz-transition: opacity 0.2s 0s, visibility 0s 0s; transition: opacity 0.2s 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.2s; -moz-transition-duration: 0.2s; transition-duration: 0.2s; }
.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: opacity 0.2s ease-in-out 0s; -webkit-transition: opacity 0.2s ease-in-out 0s; -moz-transition: opacity 0.2s ease-in-out 0s; -ms-transition: opacity 0.2s ease-in-out 0s; -o-transition: opacity 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 }

/********** BBC **********/
.News_BBC .ttl { border-bottom: 2px solid #bb1919 }
.News_BBC .ttl h1,
.News_BBC .ttl h2,
.News_BBC .ttl h3 { display: none }
.News_BBC .ttl img.bbcHeaderImg { display: inline-block; float: right; width: auto; height: 32px }
.bbcTtl { display: none }
.listing.News_BBC .ttl,
.news.BBC .bbcTtl { border-bottom: none; background: #bb1919; }
.news.BBC .bbcTtl { display: inline-block; float: right; width: 100%; margin-bottom: 30px; text-align: right }
.listing.News_BBC .ttl a,
.news.BBC .bbcTtl a { display: inline-block; float: right; width: 100%; }
.listing.News_BBC .ttl img.bbcHeaderImg,
.news.BBC .bbcTtl img.bbcHeaderImg { height: 36px }
.news.BBC .bbcTtl img.bbcFooterImg { height: 30px }
.news.BBC .breadcrumb { margin-bottom: 30px }
.news.BBC .provider { display: none }
/********** 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-block; 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: color 0.2s ease-in-out 0s; -webkit-transition: color 0.2s ease-in-out 0s; -moz-transition: color 0.2s ease-in-out 0s; -o-transition: color 0.2s ease-in-out 0s; -ms-transition: color 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.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;}
.pattern01 ul li.icon-image .imageCntnr span:before { content: "t";  }
.pattern01 ul li.icon-video .imageCntnr span:before { content: "s"; margin-left: 2px }
/********** Opinions **********/
.opinions { padding: 12px; height: 310px; width: calc((100% - 40px) /3); 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: 0; left: 50%; margin: 0 auto; width: auto; height: 100%; 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 .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% - 40px) /3); 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 }
/** 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: background 0.2s ease-in-out 0s; -webkit-transition: background 0.2s ease-in-out 0s; -moz-transition: background 0.2s ease-in-out 0s; -ms-transition: background 0.2s ease-in-out 0s; -o-transition: background 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;transition: color 0.2s ease-in-out 0s; -webkit-transition: color 0.2s ease-in-out 0s; -moz-transition: color 0.2s ease-in-out 0s; -ms-transition: color 0.2s ease-in-out 0s; -o-transition: color 0.2s ease-in-out 0s; }
.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 }

/********** 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: auto; height: 100%; }
.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; }
.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.hp-sanwya{background:#E03322;padding:20px}
.pattern02.hp-sanwya .ttl h3{padding:0;font-size:19px}
.pattern02.hp-sanwya ul li:first-child .secName.news,
.pattern02.hp-sanwya ul li .secName{background:#FBAA19!important;color:#232323!important}
/********** Masrawy TV **********/
.masrawyTV { width: calc((100% - 40px) /3); 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 .ttl .icon-more:before { transform: none }

.pattern02.masrawyTV ul li:first-child .item .imageCntnr {padding-bottom: calc(56.25% + 18px);}

/********** 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((156px * 56.25) / 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  .specialFilesLi a { display: block }
.specialFiles  .specialFilesLi a 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}
.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}

  /******************** ramadan countdown ********************/
.ramadanCountDown{margin-bottom:20px;background-color:transparent}
.ramadanCountDown a{display:inline-block;position:relative;width:300px;height:150px;float:right}
.ramadanCountDown a img{display:inline-block;width:100%;height:100%;float:right}
.ramadanCountDown a .phrosCounter{display: inline-block;position: absolute;z-index: 1;bottom: 36px;left: 50%;transform: translateX(-50%);line-height: 1;text-shadow: #511c62 0 0 1px;width: 246px;height: 38px;}
.ramadanCountDown a .phrosCounter .phrosTimer{display: inline-block;float: right;width: 51px;height: 38px;color: #1E1E1E;font-size: 18px;line-height: 41px;margin-left:13px;font-weight:700}
.ramadanCountDown a .phrosCounter .phrosTimer:last-child{margin-left:0}
.ramadanCountDown a .phrosCounter  span{display: block;
    color: #F1D1AB;
    font-size: 8px;
    line-height: 13px;font-family:DroidKufiLight, arial}
.removeHref a{pointer-events:none}

/* 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 }
/********** Dugout **********/
.dugoutVideo { padding: 0; background: #000; position: relative; margin-bottom: 30px }
.dugoutVideo .cntnr { display: inline-block; width: 100%; float: right; padding-bottom: 56.30%; position: absolute; left: 0; top: 50%; transform: translateY(-50%) }
.dugoutVideo .cntnr iframe { width: 100%; height: 100%; min-width: 100%; position: absolute; top: 0; left: 0; overflow: hidden }
/* tabs CSS */
.tabs-nav { list-style: none; margin: 0; display: inline-block; float: right; width: 100% }
.tabs-nav:after { display: block; clear: both; content: " "; }
.tabs-nav > li { position: relative; float: right; font-size: 12px; }
.tabs-nav > li > a { display: block; color: #8a8a8a; position: relative; text-align: center; height: 26px; line-height: 2; white-space: nowrap; -webkit-transition: background-color 0.2s ease-out 0s, color 0.2s ease-out 0s; -moz-transition: background-color 0.2s ease-out 0s, color 0.2s ease-out 0s; -o-transition: background-color 0.2s ease-out 0s, color 0.2s ease-out 0s; transition: background-color 0.2s ease-out 0s, color 0.2s ease-out 0s}
.tabs-nav .tabs-selected > a { font-size: 12px; line-height: 1.5; background-color: #168039; color: #fff }
.tabs-nav > li > a:hover, .tabs-nav > li > a:focus, .tabs-nav > li > a:active { background-color: #168039; color: #fff; outline: 0; }
.tabs-nav > li:hover > a, .tabs-nav > li:focus > a, .tabs-nav > li:active > a { background-color: #168039; color: #fff; outline: 0; }
.tabs-nav .tabs-selected > a:link, .tabs-nav .tabs-selected > a:visited, .tabs-nav .tabs-disabled a:link, .tabs-nav .tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */ cursor: text; }
.tabs-nav > li > a:hover, .tabs-nav > li > a:focus, .tabs-nav > li > a:active { cursor: pointer; }
.tabs-loading em { padding: 0 0 0 20px; background: url(loading.gif) no-repeat 0 50%; }
.tabs-hide { display: none; }
.sportsContainer { background: none; box-shadow: none; margin-bottom: 0 }
/********** Matches Tabs **********/
.matchesTabs { background: none; box-shadow: none }
.matchesTabs .allMatches { display: inline-block; float: right; width: 100% }
.matchesTabs .allMatches #matchesTableTabs { display: inline-block; float: right; width: 100% }
.matchesTabs .allMatches #matchesTableTabs #divcontainer { display: inline-block; float: right; width: 100%; margin-top: -1px; background: #fff; border: 1px solid #e8e8e8 }
.matchesTable { padding: 10px 15px; min-height: 142px; display: inline-block; width: 270px; }
.matchesTable .tabs-container .slide .noMatches { text-align: center; font-size: 14px; padding-top: 0; line-height: 8 }
/* Tab Menu */
.allMatches .tabs-nav li { width: 80px; height: 30px; margin-left: 2px; }
.allMatches .tabs-nav li > a { height: 30px; line-height: 2.4; border: 0; box-shadow: none; font-size: 13px; background-color: #ddd; color: #1d1d1d; }
.allMatches .tabs-nav .tabs-selected > a { background-color: #fff; color: #1d1d1d; border: 1px solid #e8e8e8; border-bottom: none; }
.allMatches .tabs-nav > li > a { border-right: none; box-shadow: none }
/* Tab Content */
.allMatches #tab-content { border: 1px solid #d7d7d7; background-color: #eeeeee; height: 100%; margin: 0; clear: both; padding: 0px; display: block }
.allMatches #tab-01 { width: 100% }
.allMatches #tab-02 { width: 100% }
.allMatches #tab-03 { width: 100% }
.allMatches .tabs-container .slide p { text-align: center;  font-size: 13px; padding-top: 10px; color: #fff }
.allMatches .tabs-container { overflow: auto; direction: rtl; display: inline-block; float: right; width: 100%; }
.allMatches .slide { display: inline-block; width: 100%; height: 162px; overflow-x: hidden; overflow-y: hidden; white-space: nowrap; float: right; }
.allMatches .item { color: #1d1d1d; font-size: 12px; text-align: center; padding: 18px; position: relative; width: calc((100% /3) - 0.1px); float: right; white-space: normal; }
.allMatches .item:after { content: ""; position: absolute; top: 74px; left: -1px; height: 86px; width: 1px; background: #ddd }
.allMatches .item:nth-child(3n):after { display: none }
.allMatches .item .tourName { font-size: 13px; color: #1d1d1d; padding-bottom: 5px; float: right; margin-bottom: 24px; cursor: auto; text-align: center; width: 100%; display: inline-block; border-bottom: 1px solid #056818 }
.allMatches .item .teamA { float: right; width: 110px; height: 66px }
.allMatches .item .teamA img, .allMatches .item .teamB img { height: 40px; width: auto; border: none; overflow: hidden; background: none; min-height: unset; }
.allMatches .item .teamA p, .allMatches .item .teamB p { display: block; margin: 0; padding-top: 10px; color: #1d1d1d;  font-size: 12px; line-height: 1.4 }
.allMatches .item .result { float: right; width: calc(100% - 220px); padding-top: 0 }
.allMatches .item .result.yesterday { padding-top: 12px; font-family: arial }
.allMatches .item .teamB { float: right; width: 110px; height: 66px }
.allMatches .item .result { font-size: 42px }
.allMatches .item .result .matchResult span { color: #1d1d1d; font-size: 14px !important; text-align: center; margin: 0 10px }
.allMatches .item .status a { background: #666; color: #fff; font-size: 12px; display: block }
.allMatches .status { position: relative; margin: 0 auto; width: 100%; font-family: arial }
.allMatches .item .result .status span { background: none; color: #1d1d1d !important; line-height: 1; display: block; margin-top: 14px !important; font-size: 16px !important }
.allMatches .item .result span.now { width: 60px; height: 20px; background: #056818; color: #fff !important; text-align: center; font-size: 11px !important; line-height: 1.8; margin: 10px auto 0 !important; border-radius: 0 !important }
.allMatches .matchResult { font-family: Arial; font-size: 30px; line-height: 1.4; margin-top: 0 }
.matchesTabs .more { color: #fff; width: 100%; height: 36px; font-size: 14px; text-align: center; background: #056818; display: inline-block; float: right; padding: 3px 0; line-height: 2.2; transition: background-color 0.2s ease 0s; }
.matchesTabs .more:hover { background-color: #2e8432 }
.matchesTabs .slide .noMatches { font-size: 20px !important; padding-top: 56px !important; width: 100%; color: #1d1d1d !important; line-height: 3.5; }
/******************** Matches HP Clip ********************/
.matchesHp{display:inline-block;width:100%;float:right;background:none}
.matchesHp .matchesHpCntnr{display:inline-block;width:100%;float:right;padding:0 28px;height:100px;overflow:hidden;margin:6px 0 0}
.matchesHp .matchesHpCntnr .matchesSlider{display: inline-block;width: 100%;height: 100px;float:right;background:#fff}
.matchesHp .matchItem{display:inline-block;float:right;width:calc(100% / 5);height:100px;background:#fff;overflow: hidden;border-left: 2px solid #e8e8e8;padding:6px 12px}
.matchesHp .matchItem:first-of-type{border-right:2px solid #f2f2f2}
.matchesHp .matchItem .tourName{font-size: 11px;color:#000;text-align:center;width:100%;display:inline-block;line-height: 1.4;float:right;margin-bottom: 4px;}
.matchesHp .matchItem .teamA, .matchesHp .matchItem .teamB{float:right;width:calc((100% - 66px) / 2);height:64px;text-align:center}
.matchesHp .matchItem .teamA{padding-left:12px}
.matchesHp .matchItem .teamB{padding-right:12px}
.matchesHp .matchItem .teamA img, .matchesHp .matchItem .teamB img{height: 26px;width: auto;border:none;display:inline-block;min-height:unset}
.matchesHp .matchItem .teamA p, .matchesHp .matchItem .teamB p{display:inline-block;width:100%; margin:0; padding-top:5px;color:#000;font-size:11px;line-height:1.2;text-align:center}
.matchesHp .matchItem .resultDiv{ float:right;width:66px;margin-top: 6px;}
.matchesHp .matchItem .resultDiv .result{color:#000; font-size:16px;font-family:CenturyGothicBold;font-weight:bold;display:inline-block;}
.matchesHp .matchItem .resultDiv .result:first-of-type{float:right}
.matchesHp .matchItem .resultDiv .result:last-of-type{float:left}
.matchesHp .matchItem .resultDiv .matchStatus{display:inline-block;width: 100%;}
.matchesHp .matchItem .resultDiv .matchStatus .status{width:100%;height:18px;display:inline-block;font-size:10px;text-align:center;margin:6px 0 4px;line-height:1.8}
.matchesHp .matchItem .penaltyRes{bottom:3px}
.matchesHp .matchItem .penaltyRes span{font-size:12px}
/** Soon **/
.matchesHp .matchItem.soon .resultDiv .matchStatus .status{border:1px solid #45B3EB;color:#45B3EB}
.matchesHp .matchItem.soon .resultDiv .matchStatus .status:before{content:"لم تبدأ";}
/** Live **/
.matchesHp .matchItem.live .resultDiv .matchStatus .status{border:1px solid #308F40;color:#308F40}
.matchesHp .matchItem.live .resultDiv .matchStatus .status:before{content:"مباشر";}
/** Done **/
.matchesHp .matchItem.done .resultDiv .matchStatus .status{border:1px solid #666;color:#666}
.matchesHp .matchItem.done .resultDiv .matchStatus .status:before{content:"إنتهت";}
/** Live **/
.matchesHp .matchItem .resultDiv .matchStatus .status{border:1px solid #308F40;color:#308F40}
.matchesHp .matchItem .resultDiv .matchStatus .status:before{content:"مباشر";}
.matchesHp .matchItem .resultDiv .matchStatus .time{width:100%;float:right;display:inline-block;color:#666;font-family:arial;font-size:12px;text-align:center}
/** Postponed **/
.matchesHp .matchItem.postponed .resultDiv .matchStatus .status{background:#ff1a3b}
.matchesHp .matchItem.postponed .resultDiv .matchStatus .status:before{content:"مؤجل";}
.matchesHp .matchItem.postponed .resultDiv .matchStatus .time{display:none}
.matchesHp .matchItem.postponed .resultDiv .matchTime{display:none}
.matchesHp .matchItem.postponed .resultDiv .moreDtls{display:none}
.matchesHp .matchItem.postponed .resultDiv .matchResult{display:none}
.matchesHp .ttl{border:none;padding-right:0;background:none;height:32px;position:relative;margin-bottom:0;border-bottom:none!important}
.matchesHp .ttl .matchesTtl{display:inline-block;float:right;position:absolute;bottom:0;left:50%;transform:translateX(-50%)}
.matchesHp .ttl .matchesTtl .inTtl{float:right;background:#fff;color:#000;width:130px;font-size:13px;text-align:center;padding:0;height:32px;line-height:2.4}
.matchesHp .allMatchesBtn{display:inline-block;float:left;font-size:12px;background:#056818;color:#fff;padding:4px 10px}
.matchesHp .allMatchesBtn:hover{background:#2c792f}
.matchesHp .allMatchesBtn .icon-arrow:before{content:"q";font-size:10px;line-height:1.8;margin-right:6px}
.matchesHp .allMatchesBtn.mob{display:none}
.matchesHp .gotoDay{display: inline-block;padding:0 20px;height:32px;float:right;position: relative;text-align:center;color:#056818;font-size:12px;line-height:2.6}
.matchesHp .gotoDay.yesterday{margin-left:2px}
.matchesHp .gotoDay.tomorrow{margin-right:2px}
.matchesHp .gotoDay span{position: relative;display: inline-block;}
.matchesHp .gotoDay span.icon-prev:before{float:right;content:"h";margin:10px 0 0 6px;transform:rotate(180deg);line-height:1}
.matchesHp .gotoDay span.icon-next:before{float:left;content:"h";margin:10px 6px 0 0;line-height:1}
.matchesHp .gotoDay:hover{background:#fff;color:#056818}
.matchesHp .gotoDay.euro{display:none}
/*.matchesHp .slide .noMatches {font-size: 20px !important;padding-top: 56px !important;width:100%;color: #1d1d1d!important;line-height: 3.5;}*/
.matchesHp .bx-wrapper .bx-pager{display:none}
.matchesHp .flickity-button{position:absolute;width:28px;height:100px;top:0;background:#056818;color:#fff;overflow:hidden;text-align:center;border-radius:0;border:none;margin-top:0;opacity:1;z-index:1}
.matchesHp .flickity-button.previous{right:-28px;left:auto;border:0!important}
.matchesHp .flickity-button.previous:before{color:#fff!important;content:"r";font-size:26px;line-height:4;color:inherit}
.matchesHp .flickity-button.next{left:-28px;right:auto}
.matchesHp .flickity-button.next:before{color:#fff!important;content:"q";font-size:26px;line-height:4;color:inherit}
.matchesHp .flickity-button svg{display:none}
.matchesHp .flickity-button:active, .matchesHp .flickity-button:hover{background-color:#056818}
.matchesHp .flickity-button:active:before, .matchesHp .flickity-button:hover:before {color:#fff}
.matchesHp .flickity-button:focus{background-color:#056818}
.matchesHp .flickity-button:focus:before{color:#fff}
.matchesHp .flickity-button:disabled{opacity: 0.2;cursor: auto;pointer-events: none;}
.imageCntnr{overflow:hidden}
.matchesHp .noStatsDiv{display: inline-block;width: 100%;float: right;}
.matchesHp .noStatsDiv:hover{background:transparent}
.matchesHp .noStats{display:inline-block;width:100%;float:right;position:relative;height:100px}
.matchesHp .noStats p{position:absolute;top:50%;transform:translateY(-50%);font-size:13px;color:#000;width:100%;text-align:center}
.matchesHp .predResult{position: absolute;width: 68px;height: 18px;background-color: #efefef;top: 56px;left:50%;transform:translateX(-50%);line-height: 2;display: inline-block;color: #fff;font-family: DroidKufiLight, Arial;font-size: 10px;text-align: center;background: #000;}
.matchesHp .resultPredBtn .resultDiv .matchStatus .status{background:transparent!important;color:transparent}
.matchesHp .flickity-viewport{overflow:visible}

.cwcSection .pattern02.sports{background:#000000;}
.cwcSection .pattern02.sports .allItems{padding:16px 20px 20px}
.cwcSection .pattern02.sports .ttl{border-bottom:2px solid #232323}
.cwcSection .pattern02.sports .ttl h3{background:unset;color:#F1BE48;padding: 5px 20px;font-size:19px}
.cwcSection .pattern02.sports .ttl .secMenu li a,
.cwcSection .pattern02.sports .ttl h3 a{color:#F1BE48}
.cwcSection .pattern02.sports .ttl .moreLnks{margin-left:20px}
.cwcSection .pattern02.sports .ttl .secMenu{    margin-top: 8px;}
.cwcSection .pattern02 ul li:first-child .secName.sports,
.cwcSection .pattern02.sports ul li .secName,
.cwcSection .pattern02.sports li.icon-video.sports .imageCntnr span,
.cwcSection .pattern02.sports ul li.icon-image.sports .imageCntnr span{background:#F1BE48!important;color:#232323}
.cwcSection .pattern02.sports ul li.icon-video .imageCntnr span:before, 
.cwcSection .pattern02.sports ul li.icon-image .imageCntnr span:before{color:#232323}


/*taboola*/
.pattern01 ul li.tabola{height:252px}
.tabolaaContainer .videoCube{direction:rtl}
.tabolaaContainer .thumbnails-a-hp .videoCube .item-thumbnail-href{    padding-bottom: 56.25%;
    overflow: hidden;
    position: relative;}

.tabolaaContainer   .trc_elastic .thumbBlock_holder,
.tabolaaContainer .trc_related_container DIV.videoCube.thumbnail_top .thumbBlock, 
.tabolaaContainer  .trc_related_container DIV.videoCube.thumbnail_bottom .thumbBlock{    position: absolute;
    display: inline-block;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin-left: 0;
    margin-right: 0;}

.tabolaaContainer .thumbnails-a-hp .video-label-box .branding,
.tabolaaContainer .thumbnails-a-hp-stream .syndicatedItem .branding{
    font-family: DroidKufiBold, Arial;
    padding: 7px 0;
    margin: 0 8px;
    white-space: nowrap;
    overflow: hidden;
    width: calc(100% - 20px);
    text-overflow: ellipsis;

}

.tabolaaContainer .thumbnails-a-hp-stream .syndicatedItem .branding{padding:2px 0;margin:0;width:100%}
.tabolaaContainer .thumbnails-a-hp .syndicatedItem .video-label-box{padding:0}

.tabolaaContainer  .videoCube span.video-label.trc_ellipsis.tbl-rtl-label{
    font-family:DroidKufiLight, Arial!important;
        color: #1d1d1d;
    height: 68px;
    cursor: pointer;
    overflow: hidden;
    text-align: right;
    line-height: 1.6;
    font-size: 14px;
    padding: 0 10px;
    display: -webkit-box;
       -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: color 0.2s 
ease-in-out 0s;
    -webkit-transition: color 0.2s 
ease-in-out;
}
.tabolaaContainer .thumbnails-a-hp-stream .videoCube span.video-label.trc_ellipsis.tbl-rtl-label{-webkit-line-clamp: 2 !important;padding:0;height:47px}

.tabolaaContainer .thumbnails-a-hp .videoCube.syndicatedItem{border:0;margin-bottom:0}
.tabolaaContainer .thumbnails-a-hp-stream .videoCube .item-thumbnail-href{ 
width: 130px;
    padding-bottom: calc((130px * 56.25) / 100);
    overflow: hidden;
    display: inline-block;
    position: relative;
        float: right;
}
.tabolaaContainer  .thumbnails-a-hp-stream .videoCube.thumbnail_start .thumbBlock_holder{
    width:100%!important
}
.tabolaaContainer  .trc_elastic_thumbnails-a-hp-stream .videoCube{width:100%;margin:0}

.tabolaaContainer  .thumbnails-a-hp-stream .syndicatedItem .video-label-box{    width: 100%;
    padding: 0 10px;}

.tabolaaContainer  .thumbnails-a-hp-stream .videoCube a {
    padding: 0;
    width: calc(100% - 130px);
    display: inline-block;
    float: left;
}
.akhbarthemak .tabola{height:96px}
.akhbarthemak .tabolaaContainer .thumbnails-a-hp-stream .videoCube .item-thumbnail-href{
        position: relative;
    overflow: hidden;
    padding-bottom: calc((100px * 75) / 100);
    float: right;
    width: 100px;
}
.akhbarthemak .tabolaaContainer .thumbnails-a-hp-stream .videoCube a{    width: calc(100% - 100px);}
.akhbarthemak  .tabolaaContainer  .trc-widget-footer span{    font-size: 9px;line-height:16px}
.akhbarthemak  .tabolaaContainer  .trc-widget-footer{padding: 0 5px;    top: 10px;height: 16px;}
.tabolaaContainer  .trc-widget-footer{position: absolute;
    top: 0;
    width: auto;height:20px;padding:0 6px;
    z-index: 1;
    right: 0;
    background-color: rgba(255, 255, 255, .9);}

.tabolaaContainer  .trc-widget-footer span{line-height:20px;
}
.tabolaaContainer .trc_user_exclude_btn{left:5px;right:auto}

@media screen and (min-width:1360px) and (max-width:1919px) { 
    .pattern01 ul li.tabola{height:231px}
}
@media screen and (min-width:1600px) and (max-width:1679px) {
    .matchesHp .matchItem {width: calc(100% / 4)}
}
@media screen and (min-width:1536px) and (max-width:1599px) {
    .matchesHp .matchItem {width: calc(100% / 4)}
}
@media screen and (min-width:1440px) and (max-width:1535px) {
    .matchesHp .matchItem {width: calc(100% / 4)}
}
@media screen and (min-width:1360px) and (max-width:1439px) {
    .matchesHp .matchItem {width: calc(100% / 3)}
}
@media screen and (min-width:1280px) and (max-width:1359px) {
    .matchesHp .matchItem {width: calc(100% / 3)}
        .pattern01 ul li.tabola{height:220px}
}
@media screen and (min-width:1152px) and (max-width:1279px) {
    .matchesHp .matchItem {width: calc(100% / 3)}
       .pattern01 ul li.tabola{height:220px}
}
@media screen and (min-width:1024px) and (max-width:1151px) {
    .matchesHp .matchItem {width: calc(100% / 2)}
       .pattern01 ul li.tabola{height:217px}
}
@media only screen and (max-width: 1023px) {
    .matchesHp .matchItem {width: calc(100% / 3)}
    .ramadanCountDown a{float:none}
}
@media screen and (min-width: 320px) and (max-width: 767px) {
    .matchesHp{margin-bottom:30px;padding:10px}
    .matchesHp .ttl .matchesTtl{left:0;right:0;width:100%;transform:none;position:relative}
    .matchesHp .gotoDay,
    .matchesHp .ttl .matchesTtl .inTtl{padding:0;width:calc((100% - 114px) / 2)}
    .matchesHp .gotoDay{font-size:11px;line-height:3}
    .matchesHp .ttl .matchesTtl .inTtl{font-size:12px;line-height:2.6;width:110px}
    .matchesHp .allMatchesBtn{display:none}
    .matchesHp .allMatchesBtn.mob{display:inline-block;width:100%;margin-top:-12px}
    .matchesHp .matchItem {width: 100%}
    .matchesHp .matchesHpCntnr{height:120px}
    .pattern01 ul li.tabola{height:75px}
    .cwcSection .pattern02.sports{padding:0 10px 40px;width:calc(100% - 20px);margin-right:10px}
    .cwcSection .pattern02.sports .ttl .moreLnksBtn{color:#F1BE48;        margin-top: 10px;}
    .cwcSection .pattern02.sports .ttl .secMenu{background:#232323}
    .cwcSection .pattern02.sports .ttl .moreLnks{margin-left:0}
    .cwcSection .pattern02.sports .ttl{border:0}
     .cwcSection .pattern02.sports .moreLnks ul li{background:#232323;border-bottom: 1px solid #000;}
     .cwcSection .pattern02.sports .allItems{padding:10px 0 0}
     .cwcSection .pattern02.sports ul li{border:0}
     .cwcSection .pattern02.sports  ul li{background:#232323}
     .cwcSection .pattern02.sports ul li .secName{background:unset!important;color:#F1BE48}
     .cwcSection .pattern02.sports .desc h2 a{color:#fff}

     .akhbarthemak .tabola{height:94px}
     .akhbarthemak  .tabolaaContainer  .trc-widget-footer span{    font-size: 11px;line-height:20px}
.akhbarthemak  .tabolaaContainer  .trc-widget-footer{padding:0 6px;    top: 10px;height: 20px;}
}
.matchesHp .flickity-enabled {position: relative;}
.matchesHp .flickity-enabled:focus { outline: none; }
.matchesHp .flickity-viewport {overflow: hidden;position: relative;height: 100%;width:100%;}
.matchesHp .flickity-slider {position: absolute;width: 100%;height: 100%;}
.matchesHp .flickity-enabled.is-draggable {-webkit-tap-highlight-color: transparent;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.matchesHp .flickity-enabled.is-draggable .flickity-viewport {cursor: move;cursor: -webkit-grab;cursor: grab;}
.matchesHp .flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {cursor: -webkit-grabbing;cursor: grabbing;}

/********** Masrawy Service **********/
.masrawyServices { background: none }
.masrawyServices .allItems { overflow: auto; direction: rtl; padding: 16px 0 0; display: inline-block; float: right; width: 100%; }
.masrawyServices ul { display: inline-block; width: 100%; overflow-x: auto; overflow-y: hidden; white-space: nowrap; float: right }
.masrawyServices li { width: calc((100% - 32.1px) / 3); position: relative; float: right; margin-left: 16px; white-space: normal; }
.masrawyServices li:last-child { margin-left: 0 }
.masrawyServices li .item { display: inline-block }
.masrawyServices li img { width: 100%; height: auto; /*min-width:250px;*/ }
.masrawyServices li .more { width: 150px; height: 40px; display: none; margin: 12px calc((100% - 150px) / 2); background: #ffcc00; font-family: DroidKufiBold, Arial; color: #1d1d1d; font-size: 18px; text-align: center; line-height: 2.2 }
.masrawyServices li .more:hover { background: #eebe00 }
/********** 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;}
.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 }
/********** Caricature **********/
/** In poll view //
.caricature{padding:12px;width:calc((100% - 48px) - (100% - 696px));margin-left:48px;height:266px}*/
.caricature { width: 100%; margin-left: 0; margin-bottom: 0; background: none }
.caricature .ttl { border-bottom: 2px solid #7A4D1A; }
.caricature .ttl h3 { background: #7A4D1A; }
.caricature .allItems { display: inline-block; float: right; width: 100%; padding: 16px 0 0 }
/** In poll view //**/
.caricature li { width: calc((100% - 64px) / 5); position: relative; float: right; margin-left: 16px; background: #fff; border: 1px solid #e8e8e8; }
.caricature li:last-child { margin-left: 0; display: none }
.caricature li:nth-of-type(5) { margin-left: 0 }
.caricature li a .item { display: inline-block }
.caricature li a .imageCntnr { position: relative; overflow: hidden; padding-bottom: 56.6%; }
.caricature li a .imageCntnr img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: 0 auto; width: 100%; height: 100%;  }
/** In poll view //
.caricature li img{width:100%;max-width:170px;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;}*/
.caricature li h2 { width: 100%; height: 60px; display: inline-block;  color: #1d1d1d; font-size: 14px; text-align: right; line-height: 1.6; padding: 16px 10px; overflow: hidden; margin-bottom: 10px; }
.caricature li:hover h2 { color: #7A4D1A }
/********** Poll **********/
.poll { padding: 12px; width: calc(100% - 696px); height: 266px; position: relative }
.poll .allItems { display: inline-block; width: 100%; }
.poll .allItems h2 { display: inline-block; width: 100%; background: #eee; padding: 5px 12px; text-align: right; font-family: DroidKufiBold, Arial; font-size: 14px; color: #1d1d1d; margin: 12px 0 }
.poll .allItems input[type="radio"] + label { font-size: 14px; margin: 0 5px 8px; }
.poll .allItems .btns { position: absolute; left: 12px; bottom: 12px }
.poll .allItems .btns .vote { float: right; width: 100px; height: 30px; background: #E03322;  font-size: 14px; color: #fff; text-align: center; margin-left: 2px; line-height: 2.2 }
.poll .allItems .btns .vote:hover { background: #940500 }
.poll .allItems .btns .social { float: right; width: 30px; height: 30px; margin-left: 2px; color: #fff; text-align: center }
.poll .allItems .btns .social:last-child { margin-left: 0 }
.poll .allItems .btns .icon-fb { background: #3c5899 }
.poll .allItems .btns .icon-fb:hover { background: #2c4582 }
.poll .allItems .btns .icon-fb:before { content: "u"; font-size: 20px; line-height: 1.6 }
.poll .allItems .btns .icon-tw { background: #229ff3 }
.poll .allItems .btns .icon-tw:hover { background: #178cd7 }
.poll .allItems .btns .icon-tw:before { content: "?"; font-size: 20px; line-height: 1.6 }
.leftDtlsSc .akhbarThemak { margin-bottom: 30px }


/****************************** ADS ******************************/
#adxbox{transition:none!important}

.adTtl{min-height:16px;transition:none}


/** Left Entry Point **/
.leftHP .eventEntryPoint { width: 300px; height: 150px; margin: 0 calc((100% - 300px) / 2) 30px }

.leftHP .eventEntryPoint a { width: 100%; margin-left: 0; height: 150px }
.leftHP .eventEntryPoint a:last-child { margin-bottom: 0 }
.leftHP .eventEntryPoint a img { width: 300px; height: 150px;position:relative;left:0;top:0;transform:none }






/******************** 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 .rightSide .appBtns div img{max-height: unset;width: 100%;height: auto;}
.masrawyApp .appHand{display:inline-block;width:290px;height:auto;position:absolute;bottom:-6px;left:20%;background-size:100%;z-index:0;pointer-events: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) }

    .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); }
    .openVideoPopupMain .videoPlayerPopup { padding: 60px 130px }
    .videoPlayerPopup .videoSponsor { right: 30px }
    .videoPlayerPopup .mainVideo .cntnr .twitter-tweet iframe { width: 550px !important }
    .cd-articles article,
    .article.cd-gallery .infiniteListing li { padding: 30px 50px }

    .cd-tab-filter a { height: 34px; padding: 0 24px; line-height: 34px; font-size: 12px }


    .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}

    .pattern02.masrawyTV ul li:first-child .item .imageCntnr{padding-bottom: calc(56.25% + 52px);}

}

@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) }

    .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); }
    .openVideoPopupMain .videoPlayerPopup { padding: 60px 190px }
    .videoPlayerPopup .videoSponsor { right: 60px }
    .videoPlayerPopup .mainVideo .cntnr .twitter-tweet iframe { width: 460px !important }
    .cd-articles article,
    .article.cd-gallery .infiniteListing li { padding: 30px 50px }
    .cd-tab-filter a { height: 34px; padding: 0 24px; line-height: 34px; font-size: 12px }

    
   .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}

    .pattern02.masrawyTV ul li:first-child .item .imageCntnr{padding-bottom: calc(56.25% + 52px);}
}

@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) }


    .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); }
    .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; }
    .cd-articles article,
    .article.cd-gallery .infiniteListing li { padding: 30px 50px }
    .cd-tab-filter a { height: 34px; padding: 0 24px; line-height: 34px; font-size: 12px }


    .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}

    .pattern02.masrawyTV ul li:first-child .item .imageCntnr{padding-bottom: calc(56.25% + 52px);}
}

@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) }


    .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); }
    .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; }
    .cd-articles article,
    .article.cd-gallery .infiniteListing li { padding: 30px 50px }
    .cd-tab-filter a { height: 34px; padding: 0 24px; line-height: 34px; font-size: 12px }


    .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}

    .pattern02.masrawyTV ul li:first-child .item .imageCntnr{padding-bottom: calc(56.25% + 52px);}
}

@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) }


    .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); }
    .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 }
    .cd-articles article,
    .article.cd-gallery .infiniteListing li { padding: 30px 50px }
    .cd-tab-filter a { height: 34px; padding: 0 24px; line-height: 34px; font-size: 12px }


    .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}

    .pattern02.masrawyTV ul li:first-child .item .imageCntnr{padding-bottom: calc(56.25% + 52px);}
}

@media screen and (min-width:1280px) and (max-width:1359px) {

         .infoClips { max-width: 100%; margin: 0 }
    


        .featuredArea.fixed { width: 648px !important; right: calc(((100% - 1000px) / 2) + 16px) }
    .featuredHintSticky.fixed{ width: 648px !important; right: calc(((100% - 1000px) / 2) + 16px) }

    .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 }
    .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 }
    .cd-articles article,
    .article.cd-gallery .infiniteListing li { padding: 30px 50px }


    .cd-tab-filter a { height: 34px; padding: 0 24px; line-height: 34px; font-size: 12px }

    .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}

    .pattern02.masrawyTV ul li:first-child .item .imageCntnr{padding-bottom: calc(56.25% + 70px);}


}

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

    .infoClips { max-width: 100%; margin: 0 }


        .featuredArea.fixed { width: 448px !important; right: calc(((100% - 800px) / 2) + 16px) }
    .featuredHintSticky.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;}
    .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 }
    .opinions { width: 100%; margin-left: 0 }
    .crossMedia, .masrawyTV { width: calc((100% - 20px) /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; }

    .entrypoints { display: none }
    .ttl .moreLnks { position: relative }
    .ttl .moreLnksBtn { display: inline-block!important }
    .ttl .secMenu { background: #fff; position: absolute; top: 100%; left: 0; width: 250px; max-height: 250px; overflow-y: auto; box-shadow: 0px 0px 4px rgba(0,0,0,0.2); z-index: 1; opacity: 0; visibility: hidden;}
    .ttl .openLinksMenu .secMenu { visibility: visible; opacity: 1 }
    .ttl .secMenu li { width: 100% !important; margin-left: 0 !important; border-bottom: 1px solid #e8e8e8; padding: 6px 10px; }
    .ttl .secMenu li a { float: right }
    .pattern02 ul li { width: calc((100% - 16px) / 2); }
    .pattern02 ul li:first-child { width: 100%; margin-left: 0; margin-bottom: 16px }
    .mostRead { width: 100%; margin-left: 0 }
    .monsterDiv { margin-right: calc((100% - 620px) / 2) }
    
    .allMatches .item { width: calc(100% / 2) }
    .caricature li { width: calc((100% - 32px) / 3); margin-bottom: 16px }
    .caricature li:last-child { display: inline-block }
    .caricature li:nth-of-type(5) { margin-left: 16px }
    .caricature li:nth-of-type(3n) { margin-left: 0 }
    .caricature li:nth-last-of-type(-n+3) { margin-bottom: 0 }
    .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 }
    .cd-gallery li { width: calc((100% - 16px) / 2); }
    .cd-articles article,
    .article.cd-gallery .infiniteListing li { padding: 30px }
    


    .cd-tab-filter a { height: 34px; padding: 0 24px; line-height: 34px; font-size: 12px }

    .currGoldDiv .currGoldTable .title .name,
    .currGoldDiv .currGoldTable .currGoldDtls .item { width: 170px; }
    .currGoldDiv .currGoldTable .title .name:first-child,
    .currGoldDiv .currGoldTable .currGoldDtls .item:first-child { width: calc(100% - 170px) }


    .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}

    .pattern02.masrawyTV ul li:first-child .item .imageCntnr{padding-bottom: calc(56.25% + 34px);}


}

@media screen and (min-width: 1024px) and (max-width: 1279px) {
        #cd-top-nav > ul { margin-left: 70px }
    #cd-top-nav ul li { width: 70px; }
    #cd-top-nav > ul > li:first-child { width: 70px; }
    #cd-top-nav ul li > a { width: 70px; font-size: 9px; }
    #cd-top-nav ul li .weather .weatherIconHeader { left: 3px }
    #cd-top-nav ul li .weather > span { margin-right: 10px }


    article .details p.WizImg img { margin: 20px calc((100% - 400px)/ 2); height: auto; width: 400px; }
    .morphSearchDiv { width: 70px }
    .morphsearch { width: 70px }
    .morphsearch-input { padding: 28px 24px 0 24px; font-size: 9px }
    #cd-top-nav .rightDiv date, #cd-top-nav .rightDiv .octLogo { font-size: 14px; line-height: 52px }

     .featuredArea.fixed { width: 448px !important; right: calc(((100% - 800px) / 2) + 16px) }
     .featuredHintSticky.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;}
    .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 }
    .opinions { width: 100%; margin-left: 0 }
    .crossMedia, .masrawyTV { width:calc((100% - 20px) /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; }

    .entrypoints { display: none }
    .ttl .moreLnks { position: relative }
    .ttl .moreLnksBtn { display: inline-block!important }
    .ttl .secMenu { background: #fff; position: absolute; top: 100%; left: 0; width: 250px; max-height: 250px; overflow-y: auto; box-shadow: 0px 0px 4px rgba(0,0,0,0.2); z-index: 1; opacity: 0; visibility: hidden;}
    .ttl .openLinksMenu .secMenu { visibility: visible; opacity: 1 }
    .ttl .secMenu li { width: 100% !important; margin-left: 0 !important; border-bottom: 1px solid #e8e8e8; padding: 6px 10px; }
    .ttl .secMenu li a { float: right }
    .pattern02 ul li { width: calc((100% - 16px) / 2); }
    .pattern02 ul li:first-child { width: 100%; margin-left: 0; margin-bottom: 16px }
    .mostRead { width: 100%; margin-left: 0 }
    .monsterDiv { margin-right: calc((100% - 620px) / 2) }
    
    .allMatches .item { width: calc(100% / 2) }
    .caricature li { width: calc((100% - 32px) / 3); margin-bottom: 16px }
    .caricature li:last-child { display: inline-block }
    .caricature li:nth-of-type(5) { margin-left: 16px }
    .caricature li:nth-of-type(3n) { margin-left: 0 }
    .caricature li:nth-last-of-type(-n+3) { margin-bottom: 0 }
    .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) { 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); }
    .cd-articles article,
    .article.cd-gallery .infiniteListing li { padding: 30px }


    .cd-tab-filter a { height: 34px; padding: 0 24px; line-height: 34px; font-size: 12px }

    .currGoldDiv .currGoldTable .title .name,
    .currGoldDiv .currGoldTable .currGoldDtls .item { width: 170px; }
    .currGoldDiv .currGoldTable .title .name:first-child,
    .currGoldDiv .currGoldTable .currGoldDtls .item:first-child { width: calc(100% - 170px) }

    .pattern02.masrawyTV ul li:first-child .item .imageCntnr{padding-bottom: calc(56.25% + 34px);}


}

@media screen and (min-width:1152px) and (max-width:1359px) {
      #cd-top-nav ul > li:nth-last-child(-n+3) > .subMenu { right: -36px }
    #cd-top-nav ul > li:nth-last-child(-n+2) > .subMenu { right: -108px }

    .morphSearchDiv { width: 72px }
    .morphsearch { width: 72px }
    .morphsearch-input { padding: 28px 24px 0 24px; font-size: 9px }

     .allMatches .item .tourName { margin-bottom: 24px; font-size: 14px }
    .allMatches .item .teamA { width: 80px; height: 70px }
    .allMatches .item .teamA img, .allMatches .item .teamB img { height: 42px; }
    .allMatches .item .teamA p, .allMatches .item .teamB p { padding-top: 10px; font-size: 12px }
    .allMatches .item .result { width: calc(100% - 160px) }
    .allMatches .item .result.yesterday { padding-top: 12px; }
    .allMatches .item .teamB { float: right; width: 80px; height: 70px }
    .allMatches .item .result { font-size: 32px }
    .allMatches .item .result span { font-size: 14px !important; }
    .allMatches .item .status a { font-size: 12px }
    .allMatches .status span { margin-top: 26px }
    .allMatches .matchResult { font-size: 24px; margin-top: 0 }
    .caricature { width: 100%; margin-left: 0; height: auto }
    .caricature li img { max-width: none; }
    .poll { width: 100% }


     .weatherDiv .main .dropDownDiv { width: 100%; margin-bottom: 24px }
    .weatherDiv .main .cityDate { width: 100% }
}


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


    .infoClips { max-width: 100%; margin: 0 }


          #cd-top-nav ul > li:nth-last-child(-n+3) > .subMenu { right: -36px }
    #cd-top-nav ul > li:nth-last-child(-n+2) > .subMenu { right: -108px }

    .morphSearchDiv { width: 68px }
    .morphsearch { width: 68px }
    .morphsearch-input { padding: 28px 24px 0 24px; font-size: 9px }

      .mostRead { width: 100%; margin-left: 0 }

       .catPattern01 ul li:nth-last-child(-n+5) .desc h2 { font-size: 13px; height: 68px }
    .allMatches .item { padding: 12px }
    .allMatches .item .tourName { margin-bottom: 24px; font-size: 14px }
    .allMatches .item .teamA { width: 70px; height: 70px }
    .allMatches .item .teamA img, .allMatches .item .teamB img { height: 38px; }
    .allMatches .item .teamA p, .allMatches .item .teamB p { padding-top: 10px; font-size: 12px }
    .allMatches .item .result { width: calc(100% - 140px) }
    .allMatches .item .result.yesterday { padding-top: 12px; }
    .allMatches .item .teamB { float: right; width: 70px; height: 70px }
    .allMatches .item .result { font-size: 32px }
    .allMatches .item .result span { font-size: 14px !important; }
    .allMatches .item .status a { font-size: 12px }
    .allMatches .status span { margin-top: 26px }
    .allMatches .matchResult { font-size: 24px; margin-top: 0 }
    .caricature { width: 100%; margin-left: 0; height: auto }
    .caricature li img { max-width: none; }
    .poll { width: 100% }
    .entrypoints { margin-right: calc((100% - 624px) / 2) }
    .pattern01 { padding: 10px 10px 0; }


    .weatherDiv .main .dropDownDiv { width: 100%; margin-bottom: 24px }
    .weatherDiv .main .cityDate { width: 100% }

         .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 (max-width: 1023px) {

    .eventCountDown{margin:0 calc((100% - 300px) /2) 20px}

    .infoClips { max-width: 100%; margin: 0 }

    .content-wrap { margin: 0; width: 100%; padding-bottom: 0; }
    .content { padding-bottom: 60px; }
    .masrawyContainer { width: 100% }
    #cd-top-nav .rightDiv date { font-size: 14px; line-height: 3.7 }
    .mainKeywords .keywords a { font-size: 13px; padding: 5px 12px }
    #cd-vertical-nav { display: none }
    #cd-top-nav ul li { display: none }
    #cd-lateral-nav .linksMenu { display: inline-block }
    .morphSearchDiv { width: 60px }
    .morphsearch { width: 60px }
    .morphsearch-input { padding: 28px 16px 0 16px }
    .morphsearch-content .keywordsDiv .item { margin: 0 0 12px 12px }
    footer { display: none }
    .no-touch #cd-vertical-nav { display: none }
    body.openSearch .content-wrap { width: 100%; margin: 60px 0 0 }

    .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% }
    .opinions { width: 100%; }
    .mostRead { width: 100%; }
    
    .allMatches .item .tourName { font-size: 14px }
    .allMatches .matchResult { font-size: 32px }
    .allMatches .item .result .matchResult span { margin: 0 6px }
    .sportsContainer .allMatches .slide { width: 140%; }
    .sportsContainer .allMatches .item { width: calc(100% / 3); min-width: 400px; }
    .masrawyServices ul { width: 100% }
    .poll { width: 100% }
    .entrypoints { margin-right: calc((100% - 624px) / 2) }


     .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 }
    .searchResult { width: 100%; margin-left: 0 }

     .matchesSchedule .schedule { width: 100%; margin-left: 0 }

    .weatherDiv .weatherCnts { width: 100%; margin-left: 0 }
    .currGoldDiv .currencyDiv { width: 100%; margin-left: 0 }
    .currGoldDiv .goldDiv,
    .currGoldDiv .currDiv { width: 100%; margin-left: 0 }
    .contactUsDiv .contactUsCnts { width: 100%; margin-left: 0 }
    .zakahDiv .zakahCnts { width: 100%; margin-left: 0 }
    .newsPointerDiv .newsPointer { width: 100%; margin-left: 0 }
    .masrawyServicesDiv .services { width: 100%; margin-left: 0 }
    .masrawyServicesDiv .services .servicesCnts .item p { height: 108px }
    .pollListingDiv .pollListing { width: 100%; margin-left: 0 }
    .policyDiv .policy { width: 100%; margin-left: 0 }

   
    .featuredSC .showcaseDiv { display: inline-block;margin-bottom:0 }

    .articleSocialMedia::before { display: none }
    .rssDiv .rssCnts { width: 100%; margin-left: 0 }
    .dtlsSc { width: 100%; margin: 0 0 48px }

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

    .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;}
    .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% }
    .secondSC { margin: 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((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 }
    .opinions { width: 100%; margin-left: 0 }
    .crossMedia{ width:calc(100% - 454px) }
    .masrawyTV { width:434px }
    .pattern02.masrawyTV ul li:first-child .item .imageCntnr{padding-bottom:56.25%}
    .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; }

    .entrypoints { display: none }
    .ttl .moreLnks { position: relative }
    .ttl .moreLnksBtn { display: inline-block!important}
    .ttl .secMenu { background: #fff; position: absolute; top: 100%; left: 0; width: 250px; max-height: 250px; overflow-y: auto; box-shadow: 0px 0px 4px rgba(0,0,0,0.2); z-index: 1; opacity: 0; visibility: hidden;}
    .ttl .openLinksMenu .secMenu { visibility: visible; opacity: 1 }
    .ttl .secMenu li { width: 100% !important; margin-left: 0 !important; border-bottom: 1px solid #e8e8e8; padding: 6px 10px; }
    .ttl .secMenu li a { float: right }
    .pattern02 ul li { width: calc((100% - 16px) / 2); }
    .pattern02 ul li:first-child { width: 100%; margin-left: 0; margin-bottom: 16px }
    .mostRead { width: 100%; margin-left: 0 }
    .monsterDiv { margin-right: calc((100% - 620px) / 2) }
    
    .allMatches .item { width: calc(100% / 2) }
    .caricature li { width: calc((100% - 32px) / 3); margin-bottom: 16px }
    .caricature li:last-child { display: inline-block }
    .caricature li:nth-of-type(5) { margin-left: 16px }
    .caricature li:nth-of-type(3n) { margin-left: 0 }
    .caricature li:nth-last-of-type(-n+3) { margin-bottom: 0 }
    .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; }
    .cd-articles article,
    .article.cd-gallery .infiniteListing li { padding: 30px 50px }
    .lstNwsNtfy{ width: 100% }
    .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; }
    .cd-tab-filter a { height: 34px; padding: 0 24px; line-height: 34px; font-size: 12px }

     .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) {

    article .articlePoll { width: 100%; margin: 15px 0; padding: 10px; }

    .featuredArea.fixed{width:100%!important;right:unset;position: relative; top: unset;}

       .blockNotif .closePopupNotif{width:20px;height:20px;}
       .blockNotif .closePopupNotif:before{font-size:16px}

        .blockNotif .blockContainer{width:300px;height:350px;top:26%;transform:translateX(-50%)}
        .monsterDiv{margin-right:0}
       
    .newsPointer .allItems ul .leaderboardDiv, .newsPointer .allItems ul .showcaseDiv, .newsPointer .allItems ul .billboardDiv, .newsPointer .allItems ul .monsterDiv { margin: 30px 0; }
    /*.cd-main-content{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:auto;-webkit-overflow-scrolling: touch;}*/
   
    .mainKeywords { display: none }
    .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; }
    .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 }
    .poll { padding: 10px; width: 100%; height: auto }
    .poll .allItems { margin-bottom: 24px }
    body.openSearch .content-wrap { width: 100%; margin: 0 }
    .openSearch .morphsearch.open .morphsearch-form { height: 100px; width: 90% }
    .morphsearch-content h2, .morphsearch-content p { font-size: 18px; margin-bottom: 16px }
    .morphsearch-content .keywordsDiv .item { font-size: 13px; padding: 4px 10px }
    .specialFiles .desc p { font-size: 14px; margin-bottom: 0; bottom: 5px }
    .specialFiles .bx-pager { display: none }
    .allMatches .tabs-nav li > a { font-size: 13px }
    .allMatches .item .tourName { margin-bottom: 16px; font-size: 13px }
    .matchesTabs .more { font-size: 13px; line-height: 2.4 }

    .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 }
    .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,
    .media ul li .item img { width: 100%; height: auto; top: 50%; left: 50%; right: auto; bottom: auto; transform: translate(-50%, -50%) }

    .searchResult { padding: 0 10px }
    .filterMainContent.is-fixed .cd-gallery { padding-top: 16px; }
    .authorsListing .cd-gallery li .authorName { font-size: 12px }
    .quizListing .cd-gallery li .desc h2 { text-align: right }
    .cd-gallery .leaderboardDiv { margin: 10px auto 30px }
    .searchResult form { padding: 12px; }

    .cd-tab-filter a { font-size: 12px }
    .datepicker-form .icon-date { left: 18px }
    .datepicker-form .icon-date:before { font-size: 22px }
    .filterMainContent h3 { width: 90px; font-size: 14px }
    .matchesSchedule .table .allMatches { margin: 16px 0 0 }
    .matchesSchedule .allMatches h2 { font-size: 16px; margin-bottom: 16px }
    .matchesSchedule .allMatches .dropDownDiv { padding: 12px }
    .wrapperDropdown { padding: 8px 12px; font-size: 13px }
    .matchesSchedule .table .allMatches .tabs-nav li > a { padding: 0 10px; font-size: 12px; }
    .matchesSchedule .table .allMatches .tabs-nav li a.date { padding: 0 10px }
    .matchesSchedule .table .allMatches .item .time { line-height: 1; width: 100%; margin-left: 0; font-size: 15px; font-weight: bold; text-align: center; position: relative; display: inline-block; margin-bottom: 10px }
    .matchesSchedule .table .allMatches .item .time span.now { font-size: 11px !important; line-height: 24px; height: 24px; display: inline-block; margin: 0 calc((100% - 50px) / 2) !important; font-weight: normal }
    .matchesSchedule .table .allMatches .item .teamA, .matchesSchedule .table .allMatches .item .teamB { text-align: center; width: calc((100% - 60px) / 2); height: auto }
    .matchesSchedule .table .allMatches .item .teamA img { float: none; margin-right: 0 }
    .matchesSchedule .table .allMatches .item .teamB img { float: none; margin-left: 0 }
    .matchesSchedule .table .allMatches .item .teamA p, .matchesSchedule .table .allMatches .item .teamB p { float: none; text-align: center; line-height: 1.6; margin-top: 5px; height: auto; overflow: hidden; width: 100% }
    .matchesSchedule .table .allMatches .item .match { height: auto }
    .matchesSchedule .table .allMatches .item .result { width: 60px; margin-top: 20px }
    .matchesSchedule .table .allMatches .item .result .matchResult { margin-top: 0; font-size: 26px }
    .matchesSchedule .table .allMatches .item .channel { display: none }
    .matchesSchedule .allMatches .item { width: 100% }
    .matchesSchedule .allMatches .item .tourName { margin-bottom: 24px }
    .matchesSchedule .allMatches .item .teamA { width: 80px; height: 70px }
    .matchesSchedule .table .allMatches .item .teamA img, .matchesSchedule .table .allMatches .item .teamB img { height: 30px; }
    .matchesSchedule .allMatches .item .teamA img, .matchesSchedule .allMatches .item .teamB img { height: 30px; }
    .matchesSchedule .allMatches .item .teamA p, .matchesSchedule .allMatches .item .teamB p { padding-top: 10px; font-size: 12px }
    .matchesSchedule .allMatches .item .result { width: calc(100% - 160px) }
    .matchesSchedule .allMatches .item .result.yesterday { padding-top: 12px; }
    .matchesSchedule .allMatches .item .teamB { float: right; width: 80px; height: 70px }
    .matchesSchedule .allMatches .item .result { font-size: 32px }
    .matchesSchedule .allMatches .item .result span { font-size: 14px !important; margin: 0 }
    .matchesSchedule .allMatches .item .status a { font-size: 12px }
    .matchesSchedule .allMatches .status span { margin-top: 26px }
    .matchesSchedule .allMatches .matchResult { font-size: 32px; margin-top: 0 }
    .matchesSchedule .listing { padding: 24px 10px }
  
    .contactUsDiv .contactUsCnts { padding: 0 10px }
    .zakahDiv .zakahCnts { padding: 15px 10px }
    .newsPointerDiv .newsPointer { padding: 0 10px }
    .masrawyServicesDiv .services { padding: 0 10px }
    .masrawyServicesDiv .services h3 { padding: 12px; font-size: 16px }
    .masrawyServicesDiv .services .servicesCnts .item { min-width: 300px; width: 100%; margin: 0 0 24px 0 }
    .masrawyServicesDiv .services .servicesCnts .item p { height: auto }
    .pollListingDiv .pollListing { padding: 15px 10px }
    .policyDiv .policy { padding: 15px 10px }
    .innerListingContainer { padding: 15px 10px }
    .authorsListing .cd-tab-filter-wrapper { padding: 12px; margin: 16px 0 }
    .author .cd-tab-filter-wrapper { padding: 12px; margin-bottom: 0 }
    .AuthorsListing .cd-tab-filter-wrapper { margin: 0 }
        .overflow-hidden .morphSearchDiv { display: none !important }

        #cd-lateral-nav .scroll { mix-blend-mode: normal; background: none; width: 100%; }
    .scrollContainer { background: none }


     .rssDiv .rssCnts { padding: 15px 10px }
    .adBlkrDtctd .cd-popup-container { width: calc(100% - 20px); height: auto; margin: 100px 10px 0 }
    .adBlkrDtctd .cd-popup-container .warnMsg { width: 212px; margin: 0 calc((100% - 212px) / 2) }
    .adBlkrDtctd .cd-popup-container h2, .adBlkrDtctd .cd-popup-container h4 { font-size: 18px }
    .adBlkrDtctd .cd-popup-container .icon-warn { text-align: right; }
    .adBlkrDtctd .cd-popup-container .icon-warn:before { font-size: 36px; margin-left: 10px; }
    .adBlkrDtctd .cd-popup-container .msg p { font-size: 14px }
    .adBlkrDtctd .cd-popup-container .cd-popup-close { width: 30px; height: 30px }
    .mainMedia .featuredArea ul li:nth-last-child(-n+5) .desc h2 { color: #fff }
    .content .mainMedia .featuredArea li { border: none; }
 
    


     .lg-toolbar .lg-icon { width: 40px; font-size: 20px }
    #lg-counter { padding-left: 20px; font-size: 18px }
    .galleryTitle .galleryMasLogo { background-size: 103px 30px; width: 117px }
    .lg-outer #lg-share:after { font-size: 18px }
    .lg-sub-html p { font-size: 13px; }
    .lg-outer .lg-toogle-thumb { width: 20px; right: 10px }

     .akhbarthemak{height:612px;overflow:hidden;margin-bottom:20px}

   

    article .videoStrip { width: 300px; height: 25px; margin: -20px calc((100% - 300px) / 2) 20px }


      section { margin-bottom: 40px }
    .ttl h3, .ttl h1, .ttl h2,
    .searchResult.wzTag .ttl p,
    .newsPointer .ttl h4 { font-size: 16px }
    .searchResult.wzTag .ttl p { width: 138px; padding: 0 18px 0 8px }

    .featuredSC .showcaseDiv { margin-bottom: 16px;}

    article .details .pattern01 .ttl h4 { font-size: 16px }
    .featuredArea { padding: 10px 10px 0 }
    .featuredArea .allItems { padding: 10px 0 }

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

    .featuredArea .desc { width: calc(100% - 130px);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: 41px;min-height:20px; overflow: hidden; padding: 0; font-size: 13px;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 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: 130px; overflow: hidden; padding-bottom: calc((130px * 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;height: 24px;max-height: 24px; }
    .featuredArea ul li .secName{font-size:13px;height:24px;line-height:24px}
    .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: 13px; }

    
    .akhbarThemak { width: calc(100% - 20px); top: 0 !important; margin: 0 10px 40px;height:590px }
    .akhbarThemak li .secName { margin-bottom: 2px; font-size: 13px }
    .akhbarThemak ul li .item .imageCntnr,
    .akhbarthemak .tabolaaContainer .thumbnails-a-hp-stream .videoCube .item-thumbnail-href{ padding-bottom: calc((130px * 56.25) / 100); width: 130px }
    .akhbarThemak li .cnts,
    .akhbarthemak .tabolaaContainer .thumbnails-a-hp-stream .videoCube a{ width: calc(100% - 130px); }
    .akhbarThemak li h2 { font-size: 13px; height: auto }
    .leftWeather{width: calc(100% - 20px);top: 0 !important;margin: 0 10px 40px;}
    article .leftWeather{margin:0 0 40px;width:100%}
    .infoClips { padding: 0 10px }
    article .infoClips { padding: 0; }

    .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 }

    .entrypoints { margin: 0 calc((100% - 300px) / 2) 40px }
    .secondSC { margin: 0 calc((100% - 300px) / 2) 40px }
    .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: 130px; padding-bottom: calc((130px * 56.25) / 100); }
    .pattern01 ul li .desc { width: calc(100% - 130px); display: inline-block; float: right; }
    .pattern01 ul li .secName { top: 2px; font-size: 13px }
    .pattern01 ul li .desc h2 { line-height: 1.6; height: auto; overflow: hidden; font-size: 13px; margin: 26px 0 0; -webkit-line-clamp: 2; }
    .paginationDiv .pattern01 ul li { width: 100%; margin-left: 0 !important; margin-bottom: 16px !important }
    article .details .pattern01 ul li .item .imageCntnr { width: 120px; padding-bottom: calc((120px * 56.25) / 100); }
    article .details .pattern01 ul li .desc { width: calc(100% - 120px); }
    article .details .pattern01 ul li .secName { right: 130px; font-size: 11px; }
    article .details .pattern01 ul li h3 { height: auto !important; font-size: 12px !important }

    .pattern02 { padding: 0 10px }
    
    .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: 130px; overflow: hidden; padding-bottom: calc((130px * 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% - 130px); 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: 13px;  position: relative; bottom: 0; right: 0; -webkit-line-clamp: 2; }
    .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: 13px;height:24px;line-height:24px; margin-bottom: 2px }
    .pattern02.news ul li .secName{font-size:13px;height:24px;line-height:24px}
    
    .pattern02.hp-sanwya ul li{background:#00000066!important;border:0}
    .pattern02.hp-sanwya ul li .desc span a{color:#F1BE48!important}
    .pattern02.hp-sanwya ul li .desc h2{color:#fff!important}
    .pattern02.hp-sanwya{padding:10px;        width: calc(100% - 20px);
        margin: 0 10px 40px;}
    .masrawyTV { padding: 10px }
    .pattern02.masrawyTV ul li:first-child .item .imageCntnr { width: 100%; padding-bottom: 56.25% }
    
    .mostRead { width: calc(100% - 20px); margin: 0 10px 40px; height: auto }
    .mostRead ul li .item .imageCntnr { padding-bottom: calc((120px * 56.25) / 100); width: 120px; }
    .mostRead .allItems li .cnts { width: calc(100% - 120px); padding-right: 10px; }
    .mostRead .allItems li .desc h2 { font-size: 13px; height: auto; -webkit-line-clamp: 2; }
    .mostRead .allItems li:last-child { margin-bottom: 0 }
    .mostRead .allItems li .secName { font-size: 13px; margin-bottom: 2px }
    
    .matchesTabs { width: calc(100% - 20px); margin: 0 10px 40px }
    .sportsContainer .allMatches .slide { width: 902px; height: 140px }
    .sportsContainer .allMatches .item { width: 300px; min-width: unset; max-width: unset; padding: 12px }
    .sportsContainer .allMatches .item .teamA { width: 75px; height: 70px }
    .sportsContainer .allMatches .item .teamA img, .sportsContainer .allMatches .item .teamB img { height: 36px; }
    .sportsContainer .allMatches .item .teamA p, .sportsContainer .allMatches .item .teamB p { padding-top: 10px; font-size: 11px }
    .sportsContainer .allMatches .item .result { width: calc(100% - 150px) }
    .sportsContainer .allMatches .item .result.yesterday { padding-top: 12px; }
    .sportsContainer .allMatches .item .teamB { float: right; width: 75px; height: 70px }
    .sportsContainer .allMatches .item .result { font-size: 32px; margin-top: 3px }
    .sportsContainer .allMatches .item .result span { font-size: 16px !important; }
    .sportsContainer .allMatches .item .result span.now { font-size: 14px !important; line-height: 1.6 }
    .sportsContainer .allMatches .item .status a { font-size: 12px }
    .sportsContainer .allMatches .status span { margin-top: 26px }
    .sportsContainer .allMatches .matchResult { font-size: 26px; margin-top: 0 }
    
    .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((130px * 56.25) / 100); width: 130px; }
    .media ul li .cnts { width: calc(100% - 130px); }
    .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: 13px;  position: relative; bottom: 0; right: 0; -webkit-line-clamp: 2; }
    .media ul li .secName { font-size: 13px; 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 }
    .masrawyServices { width: calc(100% - 20px); margin: 0 10px 40px }
    .caricature { width: calc(100% - 20px); margin: 0 10px 40px }
    .caricature li { width: 100%; margin-bottom: 16px; margin-left: 0 }
    .caricature li:nth-last-of-type(-n+3) { margin-bottom: 16px }
    .caricature li:last-of-type { margin-bottom: 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; }
    .innerListing { padding: 16px 0 0 }
    .cd-gallery li { width: 100% }
    .cd-gallery li .desc { padding: 10px; margin-bottom: 10px; }
    .cd-gallery li .desc h2 { height: auto; font-size: 13px }
    .searchResult .cd-gallery li .secName { margin-bottom: 6px }
    .cd-gallery li .secName { font-size: 11px }
    .searchResult form input { font-size: 13px }
    .cd-articles article { padding: 0 10px; border-right: none; border-left: none;border-top:none }
    .article.cd-gallery .infiniteListing li { padding: 16px 10px 10px; border-right: none; border-left: none }
    .article.cd-gallery .infiniteListing li h3 { font-size: 18px; margin-bottom: 20px }
    .article.cd-gallery .infiniteListing li .secName { font-size: 12px; }
    .article.cd-gallery .infiniteListing li .time { font-size: 12px }
    .article.cd-gallery .infiniteListing li .icon-time:before { font-size: 13px; line-height: 24px; }
    .article.cd-gallery .infiniteListing li .imgDiv { padding-bottom: 10px; margin-bottom: 10px }
    .article.cd-gallery .infiniteListing li .moreBtn { width: 100%; height: 40px; line-height: 40px; font-size: 13px; margin: 0 }
    .newsPointerDiv { padding: 16px 0 0 }

    .currGoldDiv .main { padding: 0 10px; }
    .currGoldDiv.currGold { padding: 16px 0 0 }
    .currGoldDiv .currGoldTable .currGoldDtls .item { font-size: 14px }
  
    .cd-tab-filter-wrapper:before { width: 16px; height: 16px; }
    .cd-tab-filter a { height: 30px; padding: 0 20px; line-height: 30px; font-size: 11px }
    .searchResult form .morphsearch-submit { left: 20px; top: 22px }
    .matchesSchedule.sports { padding: 16px 0 0 }
    .matchesSchedule .allMatches #matchesTableTabs #divcontainer { padding: 0 10px 10px }
    .matchesSchedule .table .allMatches .item .tourName { font-size: 14px }

    .newsPointer .allItems ul li h2,
    .newsPointer .allItems ul li h3 { font-size: 12px }
    .currGoldDiv .main h3 { font-size: 12px }
    .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,
    .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%) }

     .currGoldDiv .currGoldTable .title .name,
    .currGoldDiv .currGoldTable .currGoldDtls .item { width: 110px ;font-size:10px}
    .currGoldDiv .currGoldTable .title .name:first-child,
    .currGoldDiv .currGoldTable .currGoldDtls .item:first-child { width: calc(100% - 110px) }
    .currGoldDiv .currGoldTable .currGoldDtls .item p { font-size: 13px }
    .currGoldDiv .currGoldTable .currGoldDtls .item.flag h1 { font-size: 11px }



        .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}


    #cd-lateral-nav .topIcons{padding:0}
    #cd-lateral-nav .topIcons .icons {width: calc((100% - 30px)/ 4);margin-left:10px}
    #cd-lateral-nav .topIcons .weather .icon-temp{right:8px}
    #cd-lateral-nav .topIcons .weather .weatherIconHeader{left:5px}

     
}
@media screen and (max-width:767px) and (orientation:portrait) {
    .sportsContainer .allMatches .slide { width: 272% }
    .sportsContainer .allMatches .slide .noMatches { width: calc((100% / 3) + 36px) }
    .poll { padding: 10px; width: 100%; height: auto }
    .masrawyServices ul { width: 200% }
    .table .allMatches .tabs-nav li > a { padding: 0 16px; }
    .currGoldDiv .currencyDiv .currGoldTable .title .name { font-size: 14px; width: calc((100% - 150px) / 2) }
    .currGoldDiv .currencyDiv .currGoldTable .title .name:first-child { width: 150px; }
    .currGoldDiv .currencyDiv .currGoldTable .title .name:nth-child(2) { display: none }
    .currGoldDiv .currencyDiv .currGoldTable .currGoldDtls .item { font-size: 14px; width: calc((100% - 150px) / 2) }
    .currGoldDiv .currencyDiv .currGoldTable .currGoldDtls .item:first-child { width: 150px; }
    .currGoldDiv .currencyDiv .currGoldTable .currGoldDtls .item:nth-child(2) { display: none }
    .currGoldDiv .goldDiv .currGoldTable .title .name:nth-child(2) { display: block }
    .currGoldDiv .goldDiv .currGoldTable .currGoldDtls .item:nth-child(2) { display: block }
    header.lateral-menu-is-open #cd-menu-trigger { -webkit-transform: translateX(-260px); -moz-transform: translateX(-260px); -ms-transform: translateX(-260px); -o-transform: translateX(-260px); transform: translateX(-260px); }
    #cd-lateral-nav { width: 260px; -webkit-transform: translateX(260px); -moz-transform: translateX(260px); -ms-transform: translateX(260px); -o-transform: translateX(260px); transform: translateX(260px); }
    .scrollContainer { width: 260px }
    .scrollContainer .scroll { width: 250px; margin: 0 calc((100% - 250px) / 2) }
    #cd-lateral-nav .socialDiv a { margin-left: 10px }

    article .details .pattern01 { width: 100%; padding: 0 }
    article .details .pattern01:before { display: none }


    .navOverlay { 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); margin-bottom: 40px; overflow: hidden; border-bottom: 2px solid #A8006B; }
    .navOverlay: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 }
    .navOverlay:after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url(../Images/ramadanMasrawy.png) bottom 16px center no-repeat,url(../Images/ramMasrawyLogo.png) top 60px left 10px no-repeat; background-size: 150px auto, 30px auto; pointer-events: none }
    .education .navOverlay:before, .education .navOverlay:after { display: none }

}