@font-face {
    font-family: 'DroidKufi';
    src: url('fonts/Droid_Kufi/droidkufi-regular.eot');
    src: url('fonts/Droid_Kufi/droidkufi-regular.eot?#iefix') format('embedded-opentype'),
    url('fonts/Droid_Kufi/droidkufi-regular.ttf') format('truetype'),
    url('fonts/Droid_Kufi/droidkufi-regular.woff') format('woff'),
    url('fonts/Droid_Kufi/droidkufi-regular.svg') format('svg');
    font-weight:normal;
    font-style: normal;
}

@font-face {
    font-family: 'DroidKufiBold';
    src: url('fonts/Droid_Kufi/droidkufi-bold.eot');
    src: url('fonts/Droid_Kufi/droidkufi-bold.eot?#iefix') format('embedded-opentype'),
    url('fonts/Droid_Kufi/droidkufi-bold.ttf') format('truetype'),
    url('fonts/Droid_Kufi/droidkufi-bold.woff') format('woff'),
    url('fonts/Droid_Kufi/droidkufi-bold.svg') format('svg');
    font-weight:normal;
    font-style: normal;
}

*{padding:0; margin:0;}
a{text-decoration: none;color:inherit;}
body{font-family: 'DroidKufi', Helvetica, Arial, sans-serif; padding-top: 105px}
h1, h2, h3, h4, h5, h6, p, a, label {direction: rtl;font-weight: normal}
ul, ol{list-style: none}
body.no-scroll{overflow: hidden !important;}

.mr-btm-10{margin-bottom:10px !important;}
.mr-btm-20{margin-bottom:20px !important;}
.mr-btm-30{margin-bottom:30px !important;}
p.no-results{font-size:16px; font-family:'DroidKufiBold', Helvetica, Arial, sans-serif; color:black; display: block; margin:40px 0; text-align: center}

header{width:100%; display: block; border-bottom:7px solid #0595C6; position: fixed; z-index: 100; background: white; top: 0;}
header .header-wrapper{width:90%; max-width: 1400px; margin:20px auto; display: flex; display: -webkit-flex; justify-content: space-between; align-items: center; direction: rtl}
header a.logo{max-width:200px; display: flex; display: -webkit-flex; outline: none}
header a.logo img{width: 100%; height: 100%}

header a.burger-menu{display: none; position: absolute; top:26px; right:20px; z-index: 1}
header a.burger-menu:before, header a.burger-menu:after{content: ""; width: 23px; height: 3px; display: block; position: absolute; background-color: black; border-radius: 5px; -webkit-border-radius: 5px}
header a.burger-menu:before{bottom:7px}
header a.burger-menu:after{top:7px}
header a.burger-menu span{width: 23px; height: 3px; background-color: black; display: block; border-radius: 5px; -webkit-border-radius: 5px; position: relative}

header .mask{width:100%; position: fixed; top:0; right:0; left:0; bottom:0; background-color:rgba(0,0,0,0.85); z-index: 2; display: none}
header .menu-wrapper a.close-menu, header .search-wrapper, header .bottom-component{display: none}
header .menu-wrapper{display: block}
header .menu-wrapper ul.menu-list{display: flex; display: -webkit-flex;}
header .menu-wrapper ul.menu-list li{display: block; margin:0 20px}
header .menu-wrapper ul.menu-list li a{font-size:17px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:black; display: block; transition: .3s; -webkit-transition: .3s; position: relative}
header .menu-wrapper ul.menu-list li a:hover{color:#0595C6}
header .menu-wrapper ul.menu-list li a:after{content:""; display: block; position: absolute; height:2px; width:0; background-color:#0595C6; right:0; bottom:-5px; transition: .3s; -webkit-transition: .3s}
header .menu-wrapper ul.menu-list li a:hover:after{width:100%}
header .menu-wrapper ul.menu-list li.newspaper{margin-right:40px}
header .menu-wrapper ul.menu-list li.newspaper a:before{content:""; width:20px; height:20px; background:url('/css/images/revamp/pdf-icon.svg') center no-repeat; position: absolute; top:1px; right:-30px}
header .social-media-links{display: flex; display: -webkit-flex;}
header ul.list{display: flex; display: -webkit-flex; direction: ltr}
header ul.list li a{width:30px; height:30px; text-align: center; display: block; border-radius: 50%; -webkit-border-radius: 50%}
header ul.list li a i{display: block; color:white; padding:8px 0}
header ul.list li.facebook{margin:0 7px}
header ul.list li.twitter a{background-color:rgb(106,171,232)}
header ul.list li.facebook a{background-color:rgb(66,89,147)}
header ul.list li.instagram a{background: #f09433; background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);   background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);  background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); }
header a.search-btn{display: flex; display: -webkit-flex; margin:5px 25px 0 0}
header a.search-btn i{font-size:20px; color:black}
header .search-container{width:90%; max-width: 900px; position: absolute; top:0; left:0; right:0; margin:180px auto 0; display: none; z-index: 3}
header .search-container form{position: relative}
header .search-container p.error-message{font-size:14px; color:#b30000; display: none; position: absolute; bottom:-40px; right:-20px; z-index: 1}
header .search-container .submit-btn{position: absolute; left:20px; top:26px}
header .search-container .close-btn{position: absolute; right:-100px; top:17px}
header .search-container input{width:100%; font-size:20px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:black; border:none; background-color:white; padding:20px; border-radius: 7px; -webkit-border-radius: 7px; direction: rtl; outline: none; -moz-outline-color: inherit}
header .search-container input::placeholder {
    color: #000000;
    opacity: 1;
}
header .search-container input:-ms-input-placeholder {
    color: #000000;
}
header .search-container input::-ms-input-placeholder {
    color: #000000;
}

header form.search-form.error  input::placeholder {
    color: #b30000;
    opacity: 1;
}

header form.search-form.error input:-ms-input-placeholder{
    color:#b30000;
}

header form.search-form.error input::-ms-input-placeholder {
    color: #b30000;
}

form.search-form a.submit-search-btn i.fa{font-size:30px; color:black; display: none}
form.search-form a.submit-search-btn.loading{pointer-events: none}
form.search-form a.submit-search-btn.loading i.fa{display: block}
form.search-form a.submit-search-btn.loading img{display: none}

footer .white-beard{background-color:#0595C6}
footer .white-beard a{font-size:17px; text-transform: uppercase; text-align: center; display: table; margin:auto; padding:4px 0 0; color:white; direction: ltr}
footer .white-beard a img{max-width: 89px; margin-left:7px}
footer .white-beard a span{font-family:Helvetica, Arial, sans-serif; font-size: 12px; position: relative; bottom: 3px}
footer .content{width: 90%; max-width: 1400px; margin:auto; direction: rtl}
footer a.logo{width:120px; display: table; margin:20px 0}
footer a.logo:after, footer .footer-wrapper:after, footer .footer-wrapper .col-2:after{content:""; display: block; clear: both}
footer a.logo img{width: 100%; float: right}
footer .footer-wrapper{display: block; border-top:1px solid #e6e6e6; padding:20px 0 50px}
footer .footer-wrapper .col-1{float: right; width: 63%; margin-left:2%}
footer .footer-wrapper .col-2{float: right; width: 35%}
footer .footer-wrapper ul.list{width:90%; display: flex; display: -webkit-flex; direction: rtl; border-left:1px solid black}
footer .footer-wrapper ul.list li:not(:last-child){margin:0 0 0 30px}
footer .footer-wrapper ul.list li a, footer .footer-wrapper .links a{font-size:15px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:black; border-bottom:1px solid transparent; transition: .3s; -webkit-transition: .3s}
footer .footer-wrapper ul.list li a:hover, footer .footer-wrapper .links a:hover{border-color:inherit; opacity: 0.95}
/*footer .footer-wrapper .links a:hover{color:#1d56c9}*/
footer .footer-wrapper .links{float: right}
footer .footer-wrapper .links a{color:#0595C6}
footer .footer-wrapper .links a:first-child{margin-left:20px}
ul.social-media-list{float:left; display: block; direction: ltr}
ul.social-media-list li{display: inline-block; margin-right:15px}
ul.social-media-list li a{width:30px; height:30px; display: block; background-color:#0595C6; border-radius: 50%; -webkit-border-radius: 50%; text-align: center; transition: .3s; -webkit-transition: .3s}
ul.social-media-list li a:hover{background-color:#3670e2}
ul.social-media-list li a i{font-size:15px; color:white}
.container-wrapper{background-color:#F8F8F9; padding:30px 0}
.main-container{width:90%; max-width: 1400px; margin:0 auto 30px; direction: rtl}

.main-wrapper{display: block}
.main-wrapper:after{content:""; display: block; clear: both}
.main-wrapper .right-col{width:calc(100% - 400px); margin-left:50px; float: right}
.main-wrapper .left-col{width:350px; float: right}

.filled-container{background-color:#F8F8F9; padding:30px 0 80px}

a.component-title{display: block; padding:13px 45px 13px 13px; background-color:#0595C6; position: relative}
a.component-title h3, a.component-title h2{font-size:15px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:white; line-height: 1; margin-right: 10px}
a.component-title:after{content:"\f104"; font-family: FontAwesome; font-size:20px; color:white; position: absolute; left:15px; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%)}

article.article-1{width:100%; display: block}
article.article-1 a{width: 100%; display: block}
article.article-1 figure{width:100%; height:300px; margin-bottom:15px}
article.article-1 h2, article.article-1 h3{font-size:16px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:black; line-height: 25px}

article.article-2{width:100%; height:300px; position: relative}
article.article-2 .title{position: absolute; bottom:0; left:0; right:0; padding:30px; background:linear-gradient(to bottom,transparent 0,#000 100%); background:-webkit-gradient(linear,left top,left bottom,from(transparent),to(black))}
article.article-2 .title h2{font-size:25px; width:85%; color:white; line-height: 40px; transition: .25s; -webkit-transition: .25s}
article.article-2 a{display: block; width:inherit; height: inherit}
/*article.article-2 a:hover .title h2{color:#0595C6}*/

article.article-3{width: 100%}
article.article-3:after, article.article-3 a:after{content:""; display: block; clear: both;}
article.article-3 a{display: block}
article.article-3 figure{width:120px; height:80px; float:right}
article.article-3 .title{width:calc(100% - 140px); margin-right:20px; float: right; text-align: right; direction: rtl}
article.article-3 .title h3{font-size:13px; color:black; line-height: 24px}

.aricle_main_image {height: 500px}

section.mostread a.component-title{padding:13px 25px}
section.mostread .leading-article{border-bottom:1px solid rgba(149,152,154,0.27); margin-top:25px}
section.mostread .leading-article a{display: block}
section.mostread .leading-article figure{width:100%; height:180px}
section.mostread .leading-article h3{font-size:16px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:black; line-height: 24px; margin:15px 0 20px}
section.mostread ul.mostread-list li{padding:13px 0; display: block}
section.mostread ul.mostread-list li:not(:last-child){border-bottom:1px solid rgba(149,152,154,0.27)}
section.mostread ul.mostread-list li a{display: flex; display: -webkit-flex}
section.mostread ul.mostread-list li figure{width:120px; height:80px; margin-left:20px}
section.mostread ul.mostread-list li h3{font-size:14px; width: calc(100% - 140px); line-height: 20px; max-height: 60px; overflow: hidden}

section.newsletter-subscription{width:100%; display:block; background-color:white; box-shadow: 0 2px 6px rgba(0,0,0,0.1)}
section.newsletter-subscription .wrapper{padding:20px}
section.newsletter-subscription h3{font-size:14px; font-family: Droid, 'DroidKufiBold', Helvetica, Arial, sans-serif; color:black; margin-bottom:20px; padding-bottom:10px; border-bottom:1px solid rgba(112,112,112,0.2)}
section.newsletter-subscription input{width:calc(100% - 20px); font-size:14px; font-family: 'DroidKufi', Helvetica, Arial, sans-serif; color:#262626; background-color:#EDF5F8; border:none; padding:10px; outline: none; direction: ltr; text-align: right;}
section.newsletter-subscription input.required{border:1px solid #b30000}
section.newsletter-subscription .input-response-message{font-size:12px; color:black; margin:5px 0 0; display: none}
section.newsletter-subscription .input-response-message.success{color:#0595C6}
section.newsletter-subscription .input-response-message.error{color:#b30000}
section.newsletter-subscription input::placeholder {
    color: #262626;
    opacity: 1;
}
section.newsletter-subscription input:-ms-input-placeholder {
    color: #262626;
}
section.newsletter-subscription input::-ms-input-placeholder {
    color: #262626;
}
section.newsletter-subscription a.submit-btn{width:100%; font-size:14px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; display: block; background-color:#0595C6; padding:8px 0; text-align: center; color:white; margin:15px 0 0; transition: .3s; -webkit-transition: .3s}
section.newsletter-subscription a.submit-btn:hover{transform:scale(0.95)}
section.newsletter-subscription a.submit-btn:active{transform:scale(1.05)}

section.related-articles{display:block; padding:20px 20px 30px; background-color:rgba(230, 234, 242, 0.6)}
section.related-articles > h3{font-size:18px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:black; margin-bottom:15px;}
section.related-articles ul li{display: block; background-color:white}
section.related-articles ul li:not(:last-child){margin-bottom:35px}
section.related-articles ul li a{display: block}
section.related-articles ul li figure{width:100%; height:150px}
section.related-articles ul li h3{font-size:13px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:black; line-height: 22px; padding:15px 10px}

h3.author_name {color: white; font-size: 16px}
h4.author_name {font-size: 14px}

.category-title{background-color:#DEE3EE; padding:12px 15px; margin-bottom:24px}
.category-title h1, .category-title h2{font-size:18px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:black; line-height: 1}

.header-title{font-size:24px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:white; background-color:#0595C6; margin-bottom:70px; padding:30px 10px; display: block; text-align: center}

.ad-component{width:100%; display: block; max-width:300px; margin:30px auto}
.ad-component img{width:100%}

.homepage .section-title{background-color:rgb(222,227,238); margin-bottom:20px}
.homepage .section-title a{color:black; display: block; padding:13px 20px; position: relative}
.homepage .section-title a:after{content:"\f067"; font-family: FontAwesome; font-size:12px; color:black; position: absolute; left:20px; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%)}
.homepage .section-title a h2{font-size:16px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; line-height: 1}

.homepage .featured-articles{margin:0 0 20px}
.homepage .featured-articles:after{content:""; display: block; clear: both}
.homepage .featured-articles.art-col-1 article{width: 100%; height:400px; display: block;}
.homepage .featured-articles.art-col-2 article{width:49%; height:400px; display: block; float: left}
.homepage .featured-articles.art-col-2 article:first-child{margin-right:1%}
.homepage .featured-articles.art-col-2 article:last-child{margin-left:1%}
.homepage .featured-articles.art-col-3 article.art-1{width: 63%; height:400px; float:right; margin-left:2%}
.homepage .featured-articles.art-col-3 article.art-2, .homepage .featured-articles.art-col-3 article.art-3{width: 35%; height:190px; float:right}
.homepage .featured-articles.art-col-3 article.art-2{margin-bottom:10px}
.homepage .featured-articles.art-col-3 article.art-3{margin-top:10px}
.homepage .featured-articles article a{width:100%; height:100%; display: block; background-color:#f2f2f2; position: relative; transition: .3s; -webkit-transition: .3s}
.homepage .featured-articles article a:hover:after{content:""; height:100%; background:transparent; display: block; transition: .25s; -webkit-transition: .25s}
.homepage .featured-articles article a:hover:after{background-color:rgba(0,0,0,0.1)}
.homepage .featured-articles article .title{position: absolute; bottom:0; left:0; right:0; padding:30px; background:linear-gradient(to bottom,transparent 0,#000 100%); background:-webkit-gradient(linear,left top,left bottom,from(transparent),to(black))}
.homepage .featured-articles article .title h2{font-size:25px; width:85%; color:white; line-height: 40px; transition: .25s; -webkit-transition: .25s}
/*.homepage .featured-articles article a:hover .title h2{color:#0595C6}*/
.homepage .featured-articles.art-col-3 article.art-2 .title h2, .homepage .featured-articles.art-col-3 article.art-3 .title h2{font-size:15px; line-height: 24px; max-height: 50px; overflow: hidden}

.homepage .breaking-news{width:100%; height:55px; display: flex; display: -webkit-flex; margin:30px 0 40px; background-color:white; box-shadow: 0 2px 6px rgba(0,0,0,0.1); -webkit-box-shadow: 0 2px 6px rgba(0,0,0,0.1); border-bottom:4px solid #B20000; direction: rtl; overflow: hidden}
.homepage .breaking-news .col-1{width:150px; background-color:#B20000; position: relative}
.homepage .breaking-news .col-1:after{content:""; display: block; border-left: 35px solid black; width: 0; height:90px; position: absolute; top:-21px; left:-15px; transform: rotate(40deg); -webkit-transform: rotate(40deg); -moz-transform: rotate(40deg)}
.homepage .breaking-news .col-1 p{font-size:17px; font-family:Droid, 'DroidKufiBold', Helvetica, Arial, sans-serif; color:white; padding:12px 12px 0 0}
.homepage .breaking-news .col-2{width:calc(100% - 180px); display: flex; display:-webkit-flex}
.homepage .breaking-news .col-2 .col-wrapper{width:100%; display: flex; display:-webkit-flex}
.homepage .breaking-news .col-2 p{font-size:15px; font-family: Helvetica, Arial, sans-serif; width:150px; background-color:black; position: relative; color:white; font-weight: bold; direction: ltr; text-align: right; padding:20px 25px 0 0}
.homepage .breaking-news .col-2 p:after{content:""; display: block; border-left: 40px solid white; width: 0; height:90px; position: absolute; top:-23px; left:-13px; transform: rotate(40deg); -webkit-transform: rotate(40deg); -moz-transform: rotate(40deg)}
.homepage .breaking-news .col-2 h3{font-size: 18px; width:calc(100% - 170px); color:black; padding:10px 5px 0 0; position: relative; z-index: 1}

.homepage .breaking-news .col-2 .col-wrapper:not(:first-child){display: none}

/*.slick-slider .slick-list, .slick-slider .slick-track{transform: initial !important;}*/

.homepage section.grid-col-3{width:100%; display: block; margin:20px 0 40px}
.homepage section.grid-col-3:after{content:""; display: block; clear: both}
.homepage section.grid-col-3 .gr-col-1, .homepage section.grid-col-3 .gr-col-3{width:320px; float:right}
.homepage section.grid-col-3 .gr-col-2{width:calc(100% - 680px); margin:0 20px; float:right}

.homepage section.leading-news .authors h3{font-size:16px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:black; line-height: 1.2; margin-bottom:15px; border-right:3px solid #0595C6; padding-right:10px;}
.homepage section.leading-news .authors.kouttab > a {display: block; position: relative}
.homepage section.leading-news .authors.kouttab > a:after{content:"\f067"; font-family: FontAwesome; font-size:12px; color:black; position: absolute; left:20px; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%)}

.homepage section.leading-news .authors.kouttab ul.list {max-height: 485px; overflow: auto}

.homepage section.leading-news .authors ul{border:1px solid #DBDBDB; padding:0 13px}
.homepage section.leading-news .authors ul li{display: block; padding:13px 0}
.homepage section.leading-news .authors ul li:after{content:""; display: block; clear: both}
.homepage section.leading-news .authors ul li:not(:last-child){border-bottom:1px solid rgba(149, 152, 154, 0.3)}
.homepage section.leading-news .authors ul li .left{width:65px; height:65px; float: right; border-radius: 50%; -webkit-border-radius: 50%;}
.homepage section.leading-news .authors ul li .left a{width:100%; height:100%; display: block}
.homepage section.leading-news .authors ul li .left figure{width: 100%; height:100%; border-radius: 50%}
.homepage section.leading-news .authors ul li .right{width:calc(100% - 85px); float: right; text-align: right; margin-right:20px}
.homepage section.leading-news .authors ul li .right a.author-name{font-size:14px; color:#0595C6; display: block; margin-bottom:5px}
.homepage section.leading-news .authors ul li .right a.author-name:hover{text-decoration: underline}
.homepage section.leading-news .authors ul li .right a.article-title{font-size:13px; color:black; display: block; line-height: 20px; max-height:42px; overflow: hidden}

.homepage section.leading-news .trending > a.component-title:before{content:""; width:30px; height:30px; background:url('/css/images/revamp/trending-icon.png?1') center / contain no-repeat; position: absolute; right:15px; top:0; bottom:0; margin:auto}
.homepage section.leading-news .trending ul.list{display: block; padding:8px 13px; background-color:#EDF0F4}
.homepage section.leading-news .trending ul.list li{display: block; padding:17px 0}
.homepage section.leading-news .trending ul.list li:after{content:""; display: block; clear: both}
.homepage section.leading-news .trending ul.list li:not(:last-child){border-bottom:1px solid rgba(149, 152, 154, 0.3)}
.homepage section.leading-news .trending ul.list li a{display: block; transition: .25s; -webkit-transition: .25s}
.homepage section.leading-news .trending ul.list li p{font-size:14px; font-family: Helvetica, Arial, sans-serif; font-weight: bold; width:60px; float:right}
.homepage section.leading-news .trending ul.list li h4{font-size:15px; width:calc(100% - 80px); margin-right:20px; color:black; float:right; text-align: right; line-height: 22px; max-height: 45px; overflow: hidden}

.homepage section.mixed-news .gr-col-1 article.article-1 h2, .homepage section.mixed-news .gr-col-3 article.article-1 h2{max-height: 54px; overflow: hidden}
.homepage section.mixed-news .gr-col-1 article.article-3 .title h3, .homepage section.mixed-news .gr-col-3 article.article-3 .title h3{max-height: 72px; overflow: hidden}

.homepage .articles-list-4:after{content:""; display: block; clear: both}
.homepage .articles-list-4 article{width:calc(50% - 10px); float: right}
.homepage .articles-list-4 article:nth-child(odd){margin-left:10px; }
.homepage .articles-list-4 article:nth-child(even){margin-right:10px}
.homepage .articles-list-4 article:first-child, .homepage .articles-list-4 article:nth-child(2){margin-bottom:30px}
.homepage .articles-list-4 article a{display: block}
.homepage .articles-list-4 article figure{width: 100%; height:190px; margin-bottom:12px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); -webkit-box-shadow: 0 2px 8px rgba(0,0,0,0.1)}
.homepage .articles-list-4 article h3{font-size:14px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; line-height: 24px; height: 50px; overflow: hidden}

.homepage .mixed-news .gr-col-1 article.article-1 figure, .homepage .mixed-news .gr-col-3 article.article-1 figure{height:180px}
.homepage .mixed-news article.article-1{margin-bottom:20px}
.homepage .mixed-news article:not(.article-1){padding:14px 0; border-top:1px solid rgba(149, 152, 154, 0.3)}
.homepage .mixed-news .gr-col-2 .article-1 figure{height:280px}
.homepage .mixed-news .gr-col-2 .article-3 h3{font-size:17px; max-width: 90%; line-height: 30px; max-height: 90px; overflow: hidden}
.homepage .mixed-news .gr-col-2 .article-3 figure{width:180px; height:100px}
.homepage .mixed-news .gr-col-2 .article-3 .title{width:calc(100% - 200px)}

.homepage .videos{background-color:rgb(238,238,239)}
.homepage .videos h2.title{font-size:20px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:black; margin-bottom:30px; line-height: 1}
.homepage .videos .videos-wrapper{display: block; padding:40px 0}
.homepage .videos .videos-wrapper:after, .homepage .videos .videos-wrapper .col-2{content:""; display: block; clear: both}
.homepage .videos .videos-wrapper .col-1{width:58%; margin-left:2%; float: right; display: inline-block}
.homepage .videos .videos-wrapper .col-2{width:40%; display: inline-block}
.homepage .videos .videos-wrapper .col-1 article{height:450px}
.homepage .videos .videos-wrapper .articles-list-4 figure{position: relative}
.homepage .videos .videos-wrapper .col-1 article:after, .homepage .videos .videos-wrapper .articles-list-4 figure:after{content:""; background:url('/css/images/revamp/video-icon.png') center / contain no-repeat; width:40px; position: absolute; top:0; bottom:0; left:0; right:0; margin:auto}
.homepage .videos .videos-wrapper .articles-list-4 article figure{height:140px}

.homepage .arabic-world{margin:20px 0}
.homepage .arabic-world:after, .homepage .sprt-int-news:after{content:""; display: block; clear: both}
.homepage .arabic-world article{width:calc(100%/4 - 15px); float:right}
.homepage .arabic-world article:not(:last-child){margin-left:20px}
.homepage .arabic-world article figure{height:200px}
.homepage .arabic-world article h3{max-height: 52px; overflow: hidden}

.homepage .sprt-int-news{margin:30px 0 40px}
.homepage .sprt-int-news .col{width:calc(100% / 3 - 20px); float:right}
.homepage .sprt-int-news .col:not(:last-child){margin-left:30px}
.homepage .sprt-int-news .article-1{margin-bottom:20px}
.homepage .sprt-int-news .article-1 figure{height:200px}
.homepage .sprt-int-news .article-1 h3{font-size:18px; line-height: 30px}
.homepage .sprt-int-news article:not(.article-1){padding:20px 0; border-top:1px solid rgba(149, 152, 154, 0.3)}
.homepage .sprt-int-news h3{font-size:14px; color:black; line-height: 22px}

/*-- Article page --*/
.article-page .article-header{margin:40px 0 30px}
.article-page .article-header .header-wrapper{display: flex; display: -webkit-flex; margin:0 0 30px}
.article-page .article-header img.main{width:100%}
.article-page .article-header .col-1{width:130px; margin-left:30px; text-align: center}
.article-page .article-header .col-1 figure{width:110px; height:110px; border-radius: 50%; -webkit-border-radius: 50%; margin:0 auto 10px}
.article-page .article-header .col-1 .author-title h4{font-size:17px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:#7E7E7E; text-align: center}
.article-page .article-header .col-2{width:calc(100% - 160px)}
.article-page .article-header .col-2 a.category{display: table}
.article-page .article-header .col-2 a.category h2{font-size:14px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:#0595C6}
.article-page .article-header .col-2 h1{font-size:25px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:#000000; margin:6px 0 12px; line-height: 40px}
.article-page .article-header .col-2 p.date{font-size:14px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:#7E7E7E}
.article-page .article-body{position: relative}
.article-page .article-body * {max-width: 100%}
.article-page .article-body ul.article-share-list{position: absolute; top:50px; right:0}
.article-page .article-body ul.article-share-list li{display: block; width:40px; height:40px}
.article-page .article-body ul.article-share-list li.facebook{background-color:#365993}
.article-page .article-body ul.article-share-list li.twitter{background-color:#7DC4DE}
.article-page .article-body ul.article-share-list li.whatsapp{background-color:#25d366}
.article-page .article-body ul.article-share-list li.linkedin{background-color:#3F6EA7}
.article-page .article-body ul.article-share-list li.mail{background-color:#CC4332}
.article-page .article-body ul.article-share-list li.enlarge-font{background-color:black}
.article-page .article-body ul.article-share-list li a{display: block; color:white; text-align: center; padding:5px 0}
.article-page .article-body ul.article-share-list li.enlarge-font span{font-size:14px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:white}
.article-page .article-body .article-content{display: block; margin:0 70px 80px 0; min-height: 200px}
.article-page .article-body .article-content p, .article-page .article-body .article-content div, .article-page .article-body .article-content span{font-size:17px; color:black}
.article-page .article-body .article-content p:not(:last-child){margin-bottom:25px}
.article-page .article-body .trending-articles{background-color:rgba(230, 234, 242, 0.6); border-top:5px solid #0595C6; padding:20px}
.article-page .article-body .trending-articles > h3{font-size:16px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color: black; margin-bottom:15px}
.article-page .article-body .trending-articles ul:after, .article-page .article-body .trending-articles ul li a:after{content:""; display: block; clear: both}
.article-page .article-body .trending-articles ul li{width:48%; float: right; background-color:white;}
.article-page .article-body .trending-articles ul li:nth-child(odd){margin-left:1%}
.article-page .article-body .trending-articles ul li:nth-child(even){margin-right:1%}
.article-page .article-body .trending-articles ul li:nth-child(-n+2){margin-bottom:20px}
.article-page .article-body .trending-articles ul li figure{width:120px; height:80px; float: right}
.article-page .article-body .trending-articles ul li .title{width:calc(100% - 120px); float: right;}
.article-page .article-body .trending-articles ul li h3{ font-size:14px; color:black; line-height: 22px; padding:18px 15px; max-height: 28px; overflow: hidden}
/*-- End of Article page --*/

/*-- Videos page --*/
.videos .filled-container{padding-bottom:0}
.videos .latest-videos{background-color:#EFEFEF; padding:20px 0 80px}
.videos .latest-videos .main-container > h2{font-size:20px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:black; margin-bottom:10px}
.videos .primary-article article{height:400px}
.videos .primary-article article h2{max-width: 70%}
.videos .latest-videos ul.list:after{content:""; display: block; clear: both}
.videos .latest-videos ul.list li{width:calc(100% / 3 - 20px); float: right; margin-bottom:35px}
.videos .latest-videos ul.list li:not(:nth-child(3n)){margin-left:30px}
.videos .latest-videos ul.list li a{display: block}
.videos .latest-videos ul.list li figure{width:100%; height:200px; margin-bottom:15px; position: relative}
.videos .latest-videos ul.list li figure:after, .videos .primary-article article:before{content:""; background:url('/css/images/revamp/video-icon.png') center / contain no-repeat; width:40px; position: absolute; top:0; bottom:0; left:0; right:0; margin:auto}
.videos .latest-videos ul.list li h3{font-size:14px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:black; height:43px; overflow: hidden; line-height: 22px}
/*-- End videos page --*/

/*-- Category page --*/
.category-page > .main-container{margin-bottom:0}
.category-page .primary-article{margin-bottom:25px}
.category-page .primary-article article{height:350px}
.category-page .primary-article article .title h2{font-size:20px; max-width: 70%; line-height: 32px}
.category-page ul.sub-categories{display: flex; display: -webkit-flex; margin-bottom:25px}
.category-page ul.sub-categories li{min-width: 80px}
.category-page ul.sub-categories li:not(:last-child){margin-left:20px}
.category-page ul.sub-categories li a{font-size:14px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:white; display: block; padding:5px 10px; background-color:rgba(21,64,149, 0.55); text-align: center; transition: .3s; -webkit-transition: .3s}
.category-page ul.sub-categories li a:hover{background-color:rgba(21,64,149, 0.85)}
.category-page ul.sub-categories li.active a{background-color:#0595C6}
.category-page .list:after{content:""; display: block; clear: both}
.category-page .list article{margin-bottom:30px}
.category-page .list article{width:calc(100% / 2 - 15px); float: right}
.category-page .list article:nth-child(odd){margin-left:15px; clear: both}
.category-page .list article:nth-child(even){margin-right:15px}
.category-page .list article figure{height:230px}
.category-page .list article h3{height:50px; overflow: hidden}
/*-- End of category page --*/

/*-- Trending news page --*/
.trending-news .category-title{background-color:#0595C6; position: relative}
.trending-news .category-title h1:before{content:""; width:30px; height:30px; background:url('/css/images/revamp/trending-icon.png?1') center / contain no-repeat; position: absolute; right:0; bottom:-3px}
.trending-news .category-title h1{color:white; position: relative; top:1px; padding-right:40px}

.trending-news .primary-article{border-bottom:1px solid rgba(149, 152, 154, 0.27); padding-bottom:25px; margin-bottom:20px;}
.trending-news .primary-article article figure{height:350px; margin-bottom:20px}
.trending-news .primary-article article h2{font-size:18px}
.trending-news .list article figure{width:220px; height:110px}
.trending-news .list article .title{width:calc(100% - 240px)}
.trending-news .list article .title h3{font-size:17px; max-width: 80%; max-height:90px; overflow: hidden; line-height: 30px}
.trending-news .list article:not(:last-child){margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid rgba(149, 152, 154, 0.27)}
/*-- End of trending news page --*/

/*-- Mostread news page --*/
.mostread-news .category-title{background-color:black}
.mostread-news .category-title h1{color:white}
.mostread-news .primary-article{margin-bottom:20px}
.mostread-news .primary-article article{height:330px}
.mostread-news .primary-article article h2{font-size:18px; max-width: 500px; line-height: 28px}
.mostread-news .list:after{content:""; display: block; clear: both}
.mostread-news .list article{width:calc(100% / 2 - 10px); float: right; margin-bottom:20px}
.mostread-news .list article:nth-child(odd){margin-left:10px; clear: both;}
.mostread-news .list article:nth-child(even){margin-right:10px}
.mostread-news .list article:nth-last-child(-n+2){margin-bottom:0}
.mostread-news .list article figure{height:200px}
.mostread-news .list article h3{font-size:14px; font-family: 'DroidKufi', Helvetica, Arial, sans-serif; height:50px; overflow: hidden}
/*-- End of mostread news page --*/

/*-- Breaking news page --*/
.breaking-news .category-title{background-color:#B20000}
.breaking-news .category-title h1{color:white}
.breaking-news ul.list li{display: block; height:40px; background-color:rgb(241,242,242); overflow: hidden}
.breaking-news ul.list li:not(:last-child){margin-bottom:20px}
.breaking-news ul.list li a{padding:10px; display: block}
.breaking-news ul.list li a:after{content:""; display: block; clear: both}
.breaking-news ul.list li p{font-size:11px; font-family: Helvetica, Arial, sans-serif; font-weight: bold; width:60px; margin-left:20px; float: right; position: relative; line-height: 20px; direction: ltr}
.breaking-news ul.list li p:after{content:"|"; display: block; position: absolute; left:0; top:0; bottom:0}
.breaking-news ul.list li h3{font-size:12px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; width:calc(100% - 80px); height:22px; overflow: hidden; float: right; line-height: 20px}
/*-- End of breaking news page --*/

/*-- Terms page --*/
.terms .filled-container{padding-top:10px}
.terms .content section:not(:last-child){margin-bottom:40px}
.terms .content section h3{font-size:20px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:black; margin-bottom:20px}
.terms .content section p{font-size:15px; color:#696767}
/*-- End of terms page --*/

/*-- Contact us --*/
.contact-us h1{font-size:28px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; margin-bottom:20px; color:#0595C6}
.contact-us .info_component{margin-bottom:20px}
.contact-us .info_component h2{font-size:22px}
.contact-us .info_component h3{font-size:18px}
/*-- End contact us --*/

/*-- Author view --*/
.authors .list article figure{width:120px; height:120px; border-radius: 50%}
/*-- End author view page --*/

/*-- OLD STYLES --*/
.pdfContents iframe { width: 100%; height:500px; border: none }
.pdf.footer {display: none}
.previousIssues > div { direction: rtl; float: right; width: 120px; height: 160px; text-align: center; margin: 0 0 10px 10px }
.previousIssues > div a {font-family: GE}
.previousIssues h2 { margin: 10px 0; clear: both }
.pdfPage a.download{font-size:15px; color:#0595C6; margin-bottom:10px; display: table}

.calendar { float: initial !important; height:auto !important; position: relative }
.calendar .ui-datepicker { background: #e3ecef; width: 223px; text-align: center; box-shadow: 0 0 16px 0 rgba(122,118,122,1); border-radius: 10px; }
.calendar .ui-datepicker-header { background: none; color: #4D4D4D; font-weight: bold; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; text-shadow: none; filter: none; line-height: 30px; border-width: 0 0 0 0; margin: 10px 0 0 0; }
.calendar .ui-widget-content { border: none }
.calendar .ui-datepicker table { width: 200px; margin: 14px 12px 0 12px }
.calendar .ui-state-default { border: none; background: none }
.calendar .ui-datepicker td { padding: 4px 1px }
.calendar .ui-state-default { color: #0595C6; font-weight: normal }
.calendar .ui-state-disabled .ui-state-default { color: #B3B3B3; font-family: GE,Arial,Helvetica,sans-serif; }
.calendar .ui-datepicker-current-day { background: #0595C6; }
.calendar .ui-state-active { color: #EEF1F5 }
.calendar .ui-datepicker td span, .newspaper .pdfviewer .meta .calendar .ui-datepicker td a { text-align: center }
.calendar .ui-icon-circle-triangle-w { background-position: 8px 6px; font-size: 0; }
.calendar .ui-icon-circle-triangle-e { background-position: -169px 6px; font-size: 0; }
.calendar .ui-datepicker-next.ui-corner-all.ui-state-disabled {opacity: .35;}
.calendar .ui-datepicker .ui-datepicker-next { cursor: pointer; background: url(images/calendar_arrows_prev.png) no-repeat center center; background-size: 17px; padding: 0 18px 0 0; position: absolute; right: 180px; }
.calendar .ui-datepicker .ui-datepicker-prev { cursor: pointer; background: url(images/calendar_arrows_next.png) no-repeat center center; background-size: 17px; padding: 0 0 0 18px; position: absolute; right: 20px; }
.calendar .ui-datepicker .ui-datepicker-title { font-family: Helvetica, Arial,sans-serif; font-size: 18px; padding: 4px 0 0 0; }

/*-- End OLD STYLES --*/

@media only screen and (max-width: 1370px) {
    header .menu-wrapper ul.menu-list li {margin: 0 15px}
    header .menu-wrapper ul.menu-list li a {font-size: 15px}
}

@media only screen and (max-width: 1210px) {
    header a.logo {max-width: 155px}
    header .menu-wrapper ul.menu-list li {margin: 0 12px}
    header .menu-wrapper ul.menu-list li a {font-size: 14px}
}

@media only screen and (max-width: 1100px) {
    header a.logo {max-width: 125px}
    header .menu-wrapper ul.menu-list li {margin: 0 12px}
    header .menu-wrapper ul.menu-list li a {font-size: 13px}
}

@media only screen and (max-width: 1000px) {
    body{padding-top: 53px}
    p.no-results{font-size:14px}
    header{border-width: 4px;}
    header .social-media-links{display: none}
    header .header-wrapper{margin:10px auto}
    header a.logo{max-width: 100px; margin:auto}
    header a.burger-menu{display: block}

    header .menu-wrapper{width:80%; max-width:270px; height:100%; background-color:white; top:0; bottom:0; right:-100%; position: fixed; z-index: 3; transition: .3s; -webkit-transition: .3s}
    header .menu-wrapper.active{right:0}
    header .menu-wrapper a.close-menu{display: table; margin:20px 20px 0}
    header .search-wrapper{width:90%; margin:10px auto; display: block; position: relative}
    header .search-wrapper input{width:calc(100% - 40px); font-size:14px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:black; border:none; background-color:#F4F4F4; padding:7px 10px 7px 30px; border-radius: 5px}
    header .search-wrapper input::placeholder {
        color: #000000;
        opacity: 1;
    }
    header .search-wrapper input:-ms-input-placeholder {
        color: #000000;
    }
    header .search-wrapper input::-ms-input-placeholder {
        color: #000000;
    }
    header .search-wrapper a.submit-search{display: block; position: absolute; top:9px; left:10px}
    header .search-wrapper a.submit-search i.fa{font-size:18px; margin-top:3px}
    header .menu-wrapper ul.menu-list{display: block; margin-right:20px; max-height: 500px; overflow: auto}
    header .menu-wrapper ul.menu-list li{margin:0; padding:0}
    header .menu-wrapper ul.menu-list li a{font-size:14px; font-family:'DroidKufiBold', Helvetica, Arial, sans-serif; padding:7px 10px; transition: .3s}
    header .menu-wrapper ul.menu-list li.newspaper{margin-right:0}
    header .menu-wrapper ul.menu-list li.newspaper a {padding-right: 30px}
    header .menu-wrapper ul.menu-list li.newspaper a:before {right: 0; top: 8px}
    header .menu-wrapper ul.menu-list li a:hover{color:black;}
    header .menu-wrapper ul.menu-list li a:hover:after{display: none}
    header .menu-wrapper ul.menu-list li.active{background-color:rgba(21,64,149,0.06)}
    header .bottom-component{position: absolute; bottom:0; left:0; right:0; background-color:white; display: block; z-index: 1}
    header .bottom-component .white-beard{background-color:#0595C6}
    header .bottom-component .white-beard a{text-transform: uppercase; text-align: center; display: table; margin: auto; padding: 3px 0; color: white; direction: ltr}
    header .bottom-component .white-beard span{font-family: Helvetica; font-weight: bold; font-size: 10px; position: relative; bottom: 3px;}
    header .bottom-component .white-beard img{max-width: 76px; margin-left:7px}
    header .bottom-component .terms{display: block; text-align: center; margin-bottom:15px; padding-top:13px; border-top:1px solid #EAEAEA}
    header .bottom-component .terms a{font-size:12px; font-family: 'DroidKufiBold', Helvetica, Arial, sans-serif; color:#0595C6}
    header .bottom-component .terms a:first-child{margin-left:20px}
    header .bottom-component ul.social-media-list{margin-bottom:15px}

    footer .content{width:100%}
    footer a.logo{max-width: 100px; margin:20px auto}
    footer .footer-wrapper{padding:0 0 20px}
    footer .footer-wrapper .col-1, footer .footer-wrapper .col-2{width:100%; float:initial}
    footer .footer-wrapper .col-1{margin:0 auto 30px; border-bottom:1px solid #e6e6e6; padding:20px 0}
    footer .footer-wrapper .col-2{max-width:320px; margin:auto}
    footer .footer-wrapper ul.list{width:180px; border:none; display: block; margin:auto}
    footer .footer-wrapper ul.list:after{content:""; display: block; clear: both}
    footer .footer-wrapper ul.list li{float:right}
    footer .footer-wrapper ul.list li:not(:last-child){margin:0}
    footer .footer-wrapper ul.list li:nth-child(odd){width:40px; margin-left:50px}
    footer .footer-wrapper ul.list li:nth-child(even){width:90px}
    footer .footer-wrapper ul.list li a, footer .footer-wrapper .links a{font-size:13px}
    footer .footer-wrapper .links, ul.social-media-list{width:100%; float:initial; display: block; text-align: center}
    footer .white-beard a span{font-size:11px}
    footer .white-beard a img{max-width:81px}
    ul.social-media-list{margin-bottom:10px}

    .main-container{width: 100%}
    .container-wrapper{padding:0}

    .main-wrapper .right-col{margin:0 0 20px 0}
    .main-wrapper .right-col, .main-wrapper .left-col{width:100%; float: initial; display: block}

    .filled-container{padding-top:20px}

    .category-title{margin-bottom:20px}
    .category-title h1, .category-title h2{text-align: center}

    .header-title{font-size:17px; margin-bottom:30px; padding:20px 10px}

    section.newsletter-subscription{width:90%; margin:auto}

    article.article-2 .title{padding:20px}
    article.article-2 .title h2{font-size:16px; line-height: 24px}
    article.article-1 h2, article.article-1 h3{font-size:14px; line-height: 22px}

    .aricle_main_image {height: 170px; background-size: contain!important}

    section.mostread, section.related-articles{width:90%; margin-right:auto; margin-left:auto}
    section.mostread .leading-article h3{font-size:15px;}
    section.related-articles{padding:20px 0}
    section.related-articles > h3{font-size:16px; margin:0 20px}
    section.related-articles ul{padding:20px}

    .homepage .featured-articles.art-col-1 article, .homepage .featured-articles.art-col-2 article, .homepage .featured-articles.art-col-3 article.art-1{height:240px }
    .homepage .featured-articles.art-col-3 article.art-2, .homepage .featured-articles.art-col-3 article.art-2{height:190px !important}
    .homepage .featured-articles.art-col-2 article, .homepage .featured-articles.art-col-3 article.art-1{width:100%; float: initial; display: block; margin:0}
    .homepage .featured-articles.art-col-3 article.art-2, .homepage .featured-articles.art-col-3 article.art-3{width:90%; float: initial; display: block; margin-left:auto; margin-right:auto}
    .homepage .featured-articles article:not(:last-child){margin-bottom:20px !important}
    .homepage .featured-articles article .title{padding:0 10px 20px}
    .homepage .featured-articles article .title h2{font-size:16px; width:100%; line-height: 29px}

    .homepage .breaking-news{display: block; height:auto; margin:20px 0 0}
    .homepage .breaking-news .col-1{width:100%; height:45px; display: block}
    .homepage .breaking-news .col-1:after{display: none}
    .homepage .breaking-news .col-1 p{font-size:16px; padding:6px 12px 0 0}
    .homepage .breaking-news .col-2{width:100%}
    .homepage .breaking-news .col-2 .col-wrapper{height:42px; overflow: hidden}
    .homepage .breaking-news .col-2 p{font-size:13px; width:105px; padding:16px 15px 0 0}
    .homepage .breaking-news .col-2 h3{font-size: 14px; width:calc(100% - 120px); white-space: nowrap; padding:8px 0 0 0; position: relative; right:-16px}

    .homepage section.leading-news .authors.kouttab ul.list {max-height: 100%}

    .homepage section.grid-col-3 .gr-col-1, .homepage section.grid-col-3 .gr-col-2, .homepage section.grid-col-3 .gr-col-3{width:100%; display: block; float:initial}
    .homepage section.grid-col-3 .gr-col-2{margin:20px 0}

    .homepage section.leading-news{margin-bottom:0}
    .homepage section.leading-news .gr-col-1, .homepage section.leading-news .gr-col-2, .homepage section.mixed-news{width:90%; margin-right:auto; margin-left:auto}
    .homepage section.grid-col-3 .gr-col-3{width:100%}
    .homepage section.leading-news .authors{margin:30px auto}

    .homepage .articles-list-4 article{width: 100%; float: initial; display: block; margin-bottom:20px}
    .homepage .articles-list-4 article:first-child, .homepage .articles-list-4 article:nth-child(2){margin-bottom:20px}
    .homepage .articles-list-4 article:nth-child(odd), .homepage .articles-list-4 article:nth-child(even){margin-left:0; margin-right:0}
    .homepage .articles-list-4 article h3{font-size:12px}
    .homepage .articles-list-4 article figure{background-size: contain !important; box-shadow:initial}

    .homepage .mixed-news .gr-col-2 .article-1 figure{height:180px}
    .homepage .mixed-news .gr-col-2 .article-3 figure{width:110px; height:80px}
    .homepage .mixed-news .gr-col-2 .article-3 .title{width: calc(100% - 130px)}
    .homepage .mixed-news .gr-col-2 .article-3 h3{font-size:14px; max-width: 100%; line-height: 22px; max-height: 66px}
    .homepage section.mixed-news .gr-col-1 article.article-1 h2, .homepage section.mixed-news .gr-col-3 article.article-1 h2{max-height: initial}

    .homepage .videos{background-color: rgb(230, 234, 242)}
    .homepage .videos .main-container{width:100%}
    .homepage .videos .videos-wrapper .col-1, .homepage .videos .videos-wrapper .col-2{width:100%; display: block; float: initial}
    .homepage .videos .videos-wrapper .col-1{margin:0 0 20px 0}
    .homepage .videos .videos-wrapper{padding:20px 0}
    .homepage .videos h2.title{font-size:18px; padding:0 20px 0 0}
    .homepage .videos .videos-wrapper .col-1 article, .homepage .videos .videos-wrapper .articles-list-4 article figure{height:200px}
    .homepage .videos-wrapper .articles-list-4 article h3{max-height: initial; padding: 0 40px}
    .homepage .articles-list-4 article h3{font-size:14px; padding:0 10px}


    .homepage .arabic-world{width:90%; margin:auto}
    .homepage .arabic-world article figure{height:170px;} /*  background-size: contain !important; */
    .homepage .arabic-world article, .homepage .sprt-int-news .col{width:100%; display: block; float:initial}
    .homepage .arabic-world article:not(:last-child), .homepage .sprt-int-news .col:not(:last-child){margin:0 0 20px 0}
    .homepage .arabic-world article h3{max-height: initial}

    .homepage .sprt-int-news{width:90%; margin:30px auto 0}
    .homepage .sprt-int-news .article-1 h3{font-size:15px; line-height: 23px}
    .homepage .sprt-int-news h3{font-size:13px}

    /*-- Article page --*/
    .article-page .article-header{width:90%; margin:20px auto 10px}
    .article-page .article-header .header-wrapper{display: block; position: relative; margin-bottom:20px}
    .article-page .article-header .col-1{width:100%; min-height:25px; margin:0 0 10px; text-align: right; position: relative}
    .article-page .article-header .col-1 figure{width:70px; height:70px; margin:0 0 10px}
    .article-page .article-header .col-2{width:100%;}
    .article-page .article-header .col-2 h1{font-size:16px; line-height: 28px; margin:0 0 8px}
    .article-page .article-header .col-2 a.category{position: absolute; top:8px; right:85px}
    .article-page .article-header .col-2 a.category h2{font-size:13px}
    .article-page .article-header .col-1 .author-title{position: absolute; right:85px; bottom:8px}
    .article-page .article-header .col-1 .author-title h4{font-size:12px; text-align: right}
    .article-page .article-header .col-2 p.date{font-size:12px}
    .article-page .article-body .article-content{width: 90%; margin:0 auto 40px}
    .article-page .article-body .article-content iframe{width:100%}
    .article-page .article-body .article-content p, .article-page .article-body .article-content div, .article-page .article-body .article-content span{font-size:15px}
    .article-page .article-body ul.article-share-list{display: flex; display: -webkit-flex; position: fixed; width:100%; top:initial; bottom:0; left:0; margin:auto; direction: ltr; z-index: 1}
    .article-page .article-body ul.article-share-list li{width:20%}
    .article-page .article-body .trending-articles{padding:20px 20px 30px; margin:0 0 30px}
    .article-page .article-body .trending-articles ul li{width:100%}
    .article-page .article-body .trending-articles ul li:not(:last-child){margin-bottom:20px}
    .article-page .article-body .trending-articles ul li:nth-child(odd), .article-page .article-body .trending-articles ul li:nth-child(even){margin-left:0; margin-right:0}
    .article-page .article-body .trending-articles ul li h3{font-size:13px}
    /*-- End of article page --*/


    /*-- Videos page --*/
    .videos .filled-container{padding-top:20px}
    .videos .latest-videos .main-container{width:90%; margin:auto}
    .videos .latest-videos .main-container > h2{font-size:18px}
    .videos .primary-article article{height:220px}
    .videos .primary-article article h2{width:100%; max-width: 100%; max-height: 47px; overflow: hidden}
    .videos .latest-videos ul.list li{width: 100%; float: initial; margin-bottom:20px}
    .videos .latest-videos ul.list li h3{font-size:14px}
    .videos .latest-videos ul.list li figure{height:170px}
    /*-- End of videos page ---*/

    /*-- Category page --*/
    .category-page .filled-container{padding:0 0 30px}
    .category-page .primary-article article{height:250px}
    .category-page .primary-article article .title h2{font-size:16px; width:100%; max-width: 100%; line-height:24px}
    .category-page .list{width:90%; display: block; margin:0 auto 45px}
    .category-page .list article{width:100%; float: initial}
    .category-page .list article:nth-child(odd), .category-page .list article:nth-child(even){margin-left:0; margin-right:0}
    .category-page .list article h3{height:45px}
    .category-page .list article figure{height:200px; background-size:contain !important;}
    .category-page ul.sub-categories{width:90%; margin:0 auto 20px; flex-wrap:wrap; -webkit-flex-wrap: wrap; justify-content:space-between; -webkit-justify-content:space-between; -moz-justify-content:space-between}
    .category-page ul.sub-categories li{flex: 1 1 48%; margin-bottom:10px; -webkit-box-flex:1; -ms-flex:1 1 48%; flex-basis:48%; -webkit-flex-basis:48%; width:48%; flex-grow:0; -webkit-flex-grow: 0}
    .category-page ul.sub-categories li:not(:last-child){margin-left:0}
    .category-page ul.sub-categories li:nth-last-child(-n+2){margin-bottom:0}
    /*-- End category page --*/

    /*-- Trending news page --*/
    .trending-news .filled-container{padding-top:1px}
    .trending-news .category-title h1{display: table}
    .trending-news .primary-article{border:none; padding:0; margin-bottom:30px}
    .trending-news .primary-article article figure{height:220px}
    .trending-news .primary-article article h2{font-size:16px; width:90%; margin:auto; line-height: 24px}
    .trending-news .list{width:90%; margin:0 auto 35px}
    .trending-news .list article figure{width:100%; height:200px; float: initial; display: block}
    .trending-news .list article .title{width:100%; float: initial; margin:10px 0 0}
    .trending-news .list article .title h3{font-size:15px; width:100%; max-width: 100%}
    .trending-news .list article:not(:last-child){padding:0; border:none}
    /*-- End of trending news page --*/

    /*-- Mostread news page --*/
    .mostread-news .filled-container{padding-top:0}
    .mostread-news .primary-article article{height:200px}
    .mostread-news .primary-article article h2{font-size:15px; width:100%; max-width:100%}
    .mostread-news .category-title{margin-bottom:0}
    .mostread-news .list{width:90%; margin:0 auto 30px}
    .mostread-news .list article{width:100%; float: initial; display: block; margin-bottom:20px; background-size:contain !important;}
    .mostread-news .list article:nth-child(odd), .mostread-news .list article:nth-child(even){margin-left:10px; margin-right:0}
    .mostread-news .list article figure{height:210px}
    .mostread-news .list article h3{font-size:14px; height: auto}
    /*-- End of mostread news page --*/

    /*-- Breaking news page --*/
    .breaking-news ul.list{margin:0 0 30px}
    .breaking-news ul.list li{height:auto}
    .breaking-news ul.list li a{width:90%; margin:auto; padding:10px 0}
    .breaking-news ul.list li p, .breaking-news ul.list li h3{width:100%; float: initial; display: block}
    .breaking-news ul.list li p:after{display: none}
    .breaking-news ul.list li h3{height:auto; margin-top:10px}
    /*-- End of breaking news page --*/

    /*-- Terms page --*/
    .terms .content{width:90%; margin:0 auto 30px}
    .terms .content section:not(:last-child){margin-bottom:25px}
    .terms .content section h3{font-size:16px; margin-bottom:10px}
    .terms .content section p{font-size:13px}
    /*-- End of terms page --*/

    /*-- Contact Us page --*/
    .contact-us h1{font-size:22px}
    .contact-us .content{width:90%; margin:auto}
    .contact-us .info_component h2{font-size:18px}
    .contact-us .info_component h3{font-size:16px}
    /*-- End of contact us page --*/

    .authors .list article figure{width:100px; height:100px !important;}

    .container.pdfPage .previousIssues > div {height: auto; width: auto}
    .container.pdfPage .right .pdfContents {display: none}

    .previousIssues h2{font-size:18px;}
    .pdfPage .main-wrapper{width:90%; margin:auto}
    .pdfPage .calendar, .calendar .ui-datepicker{width:100% !important;}
    .pdfPage .calendar{margin-bottom:50px !important}
    .pdfPage .calendar .ui-datepicker table{width:90%; margin:15px auto}
    .calendar .ui-datepicker .ui-datepicker-next{right:20px}
    .calendar .ui-datepicker .ui-datepicker-next{left:20px; right:initial}
}