@font-face {
    font-family:'DIN Next LT Arabic Ultra Light';
    src:url('fonts/DINNextLTArabic-UltraLight.ttf');
    src:local('âک؛'),
        url('fonts/DINNextLTArabic-UltraLight.ttf') format('truetype');
    font-weight:lighter;
}
@font-face {
    font-family:'DIN Next LT Arabic Light';
    src:url('fonts/DINNextLTArabic-Light.ttf');
    src:local('âک؛'),
        url('fonts/DINNextLTArabic-Light.ttf') format('truetype');
    font-weight:lighter;
}
@font-face {
    font-family:'DIN Next LT Arabic';
    src:url('fonts/DINNextLTArabic-Regular.ttf');
    src:local('âک؛'),
        url('fonts/DINNextLTArabic-Regular.ttf') format('truetype');
    font-weight:normal;
}
@font-face {
    font-family:'DIN Next LT Arabic Medium';
    src:url('fonts/DINNextLTArabic-Medium.ttf');
    src:local('âک؛'),
        url('fonts/DINNextLTArabic-Medium.ttf') format('truetype');
    font-weight:bold;
}
* {
	outline: none;
	-webkit-transition-property: background, border-color, color, box-shadow, display, padding, width, bottom, right;
	-webkit-transition-duration: 0.2s;
	-webkit-transition-timing-function: ease;
}
::selection {
	background: #a4404b; /* Safari */
	color: #fff;
}
::-moz-selection {
	background: #a4404b; /* Firefox */
	color: #fff;
}
ul, h3, h4 {
	margin: 0;
	padding: 0;
	font-weight: normal;
}
p {
	margin: 0;
	padding: 0;
	display: block;
}
li {
	list-style-type: none;
	margin: 0;
	padding: 0;
}
a {
	text-decoration: none;
	color: inherit;
}
a img {
	border: none;
}
html {
	background-image: url('images/pbg.jpg');
	background-attachment: fixed;
}
body {
	margin: 0;
	padding: 0;
	overflow-x: hidden;
	background-color: #eeeeee;
	direction: rtl;
	font-family: "DIN Next LT Arabic Light";
}
header {
	background-color: #fff;
	position: relative;
	display: grid;
	grid-template-columns: 1fr 440px 760px 1fr;
	grid-template-rows: 60px 40px 40px;
}
header #logo {
	background-image: url('images/logo.png');
	background-repeat: no-repeat;
	background-position: center center;
	height: 100px;
	width: 420px;
	margin: 16px 0 16px 0;
	grid-column: 2/2;
	grid-row: 1/3;
}
header nav {
	background-color: #c33e4c;
	grid-column: 3/5;
	grid-row: 2/2;
	border-radius: 0 7px 7px 0;
}
header form {
	display: flex;
	gap: 5px;
	height: 26px;
	color: #FFFFFF;
    grid-column: 3/4;
    grid-row: 1/2;
    position: absolute;
    left: 100px;
    top: 5px;
}
header form input[type=search] {
	border-style: none;
	height: 24px;
	background-color: rgba(0,0,0,0.08);
	border-radius: 3px;
}
header form input[type=submit] {
	padding: 8px 5px 8px 5px;
	background-position: center center;
	border-style: none;
	background-color: #c33e4c;
	color: #fff;
	font-family: 'DIN Next LT Arabic Light';
	font-weight: bold;
	background-image: url('images/search.png');
	background-repeat: no-repeat;
	background-size: 60%;
	width: 24px;
	height: 24px;
	cursor: pointer;
	border-radius: 4px;
}
header form input[type=submit]:hover {
	background-color: #641E25;
}
#ajel_nav.msg {
	background-color: #333;
	margin: 10px 0 5px 0;
	padding: 0px 86px 0px 5px;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	font-family: 'DIN Next LT Arabic Light';
	font-size: 15px;
	line-height: 18px;
	background-repeat: no-repeat;
	background-position: right center;
	font-weight: bold;
}
#ajel_nav.msg li {
	height: 36px;
	line-height: 36px;
}
#ajel_nav.msg a {
	font-weight: bold;
	color: #fff;
	text-decoration: none;
	display: block;
	width: 900px;
}
#ajel_nav.red {
	background-image: url('images/ajel.gif');
}
#ajel_nav.orng {
	background-image: url('images/tnweh.gif');
}
#ajel_nav.ham {
	background-image: url('images/ham.gif');
}
#socials {
	border-width: 1px;
	border-color: #CCCCCC;
	overflow: hidden;
	grid-column: 3/4;
	grid-row: 1/2;
	display: flex;
	flex-wrap: nowrap;
	position: absolute;
	left: 0;
	top: 5px;
	border-right-style: solid;
	padding-right: 5px;
}
#socials a {
	height: 20px;
	width: 24px;
	display: block;
	margin-right: 4px;
	margin-bottom: 4px;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: left top;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-transition-property: opacity, filter, background-position;
	-webkit-transition-duration: 0.2s;
	-webkit-transition-timing-function: ease-in;
	opacity: 0.4;
    filter: alpha(opacity=40);
}
#socials a.facebook {
	background-image: url('images/facebook.png');
}
#socials a.google {
	background-image: url('images/google+.png');
}
#socials a.twitter {
	background-image: url('images/twitter.png');
}
#socials a.youtube {
	background-image: url('images/youtube.png');
}
#socials a.rss {
	background-image: url('images/rss.png');
}
#socials a:hover{
	opacity: 1;
    filter: alpha(opacity=100);
	filter: grayscale(0);
	-webkit-filter: grayscale(0);
}
#nav-toggle { 
	display: none;
	position: fixed;
	top: 10px;
	left: 10px;
	z-index: 10001;
	direction: ltr;
	cursor: pointer;
	padding: 16px 36px 21px 6px;
	overflow: hidden;
	background-color: rgba(0,0,0,0.35);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
#nav-toggle span, 
#nav-toggle span:before, 
#nav-toggle span:after {
  cursor: pointer;
  border-radius: 1px;
  height: 5px;
  width: 30px;
  background: white;
  position: absolute;
  display: block;
  content: '';
}
#nav-toggle span:before {
  top: -10px; 
}
#nav-toggle span:after {
  bottom: -10px;
}
#nav-toggle span, #nav-toggle span:before, #nav-toggle span:after {
  transition: all 500ms ease-in-out;
}
#nav-toggle.active span {
  background-color: transparent;
}
#nav-toggle.active span:before, #nav-toggle.active span:after {
  top: 0;
}
#nav-toggle.active span:before {
  transform: rotate(45deg);
}
#nav-toggle.active span:after {
  transform: rotate(-45deg);
}
nav ul.links {
	height: 40px;
	display: block;
	font-size: 20px;
	text-transform: capitalize;
	font-weight: normal;
	display: flex;
	flex-wrap: nowrap;
}
nav ul.links > li {
	display: block;
	position: relative;
	padding: 0;
	margin: 0;
	height: 40px;
}
nav ul.links > li a {
	font-family: 'DIN Next LT Arabic Light';
	text-decoration: none;
	color: #fff;
	padding: 0 20px;
	margin: 0px;
	font-size: 18px;
	line-height: 40px;
	display: block;
}
nav ul.links li a:hover, 
nav ul.links li a.current {
	background-color: rgba(0,0,0,0.1);
	color: #FFFFFF;
}
nav ul.links li ul {
	position: absolute;
	margin: 0;
	z-index: 1000;
	display: none;
	top: 40px;
	right: 0px;
	padding: 5px;
	overflow: hidden;
	-webkit-border-bottom-left-radius: 8px;
	-webkit-border-bottom-right-radius: 8px;
	-moz-border-radius-bottomleft: 8px;
	-moz-border-radius-bottomright: 8px;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
	-moz-box-shadow: 0 0 10px rgba(115,82,0,0.20);
	-webkit-box-shadow: 0 0 10px rgba(115,82,0,0.20);
	box-shadow: 0 0 10px rgba(115,82,0,0.20);
	background-color: rgba(255,255,255,1);
}
nav ul.links li :empty {
   display: none;
}
nav ul.links li:hover ul {
	display: block;
}
nav ul.links li ul li {
	float: none;
	display: block;
	padding: 0;
	min-width: 160px;
}
nav ul.links li ul li a {
	display: block;
	font-family: 'DIN Next LT Arabic Light';
	font-size: 15px;
	line-height: 30px;
	border-radius: 2px;
	color: #c33e4c;
	border-style: none;
	background-color: transparent;
	white-space: nowrap;
}
nav ul.links li ul li a:hover {
	background-color: #c33e4c;
	color: #fff;
}
/* news ticker */
#wrapper {
	width: 100%;
	direction: rtl;
	position: relative;
}
#wrapper.shadow {
	position: fixed;
	top: 10px;
	z-index: 1001;
}
#wrapper h2 {
	position: absolute;
	top: 8px;
	background-color: #222626;
	color: #ffba00;
	padding: 0px 20px 7px 20px;
	font-size: 20px;
}
#wrapper > div {
	font-family: 'DIN Next LT Arabic';
	font-weight: normal;
	background: #d1d5de;
	color: #444d61;
	height: 30px;
	box-sizing: border-box;
	overflow: auto;
	font-size: 14px;
	line-height: 18px;
	overflow: hidden;
}
#wrapper a {
	font-family: 'DIN Next LT Arabic Medium';
	background-position: left 3px;
	margin-left: 24px;
	background-image: url(images/seperator.png);
	background-repeat: no-repeat;
	padding-left: 42px;
	line-height: 26px;
	display: inline-block;
}
#wrapper a:hover {
	color: #c33e4c;
}
#wrapper .pointer {
	height: 24px !important;
	width: 100% !important;
}
#wrapper .pointer div {
	direction: rtl;
}
.featured {
	margin: 20px auto 10px auto;
	display: grid;
	grid-template-columns: 420px 205px 205px 320px;
	grid-template-rows: 190px 190px;
	grid-column: 2/2;
	grid-gap: 10px;
	width: 1200px;
	padding: 0;
	background-color: transparent;
}
.featured .art {
	border-radius: 10px;
	position: relative;
	overflow: hidden;
}
.featured .art .cat-lnk {
	display: inline-block;
    background-color: #c33e4c;
    color: #fff;
    font-size: 12px;
    line-height: 24px;
    padding: 0 8px;
    margin-top: 10px;
    position: absolute;
    z-index: 10;
	border-radius: 3px 0 0 3px;
}
.featured .art:hover .cat-lnk {
    background-color: #f2a61c;
}
.featured .art:nth-child(1) {
	grid-column: 1/2;
	grid-row: 1/3;
}
.featured .art:nth-child(2) {
	grid-column: 2/4;
	grid-row: 1/2;
}
.featured .art:nth-child(3) {
	grid-column: 2/2;
	grid-row: 2/3;
}
.featured .art:nth-child(4) {
	grid-column: 3/3;
	grid-row: 2/3;
}
.featured .art a.img-lnk {
	display: block;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	transition: all .3s;
}
.featured .art:hover a.img-lnk {
	transform: scale(1.1);
}
.featured .art a.title-lnk {
    position: absolute;
    bottom: 0;
    right: 0;
    height: 50%;
    display: block;
    width: 100%;
    padding-bottom: 10px;
	background: linear-gradient(to top, rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%);
}
.featured .art h2 {
    font-family:'DIN Next LT Arabic';
	color: #fff;
	font-weight: normal;
	font-size: inherit;
	margin: 0px;
	display: block;
	width: 100%;
	font-size: 24px;
	padding: 20px;
	box-sizing: border-box;
	position: absolute;
	bottom: 0;
	right: 0;
}
.featured .art:first-child h2 {
	bottom: 20px;
}
.featured .art:not(:first-child) h2 {
	font-size: 16px;
}
.featured .art:nth-child(2) h2 {
	font-size: 18px;
}
.featured .art h2 sup {
	color: #f2a61c;
	display: inline-block;
	border-bottom: 2px solid;
	padding: 5px;
	position: absolute;
	font-size: 20px;
    top: -20px;
    right: 20px;
    font-weight: normal;
}
.featured .art h2 sup:empty {
	display: none;
}
.top_article {
	color: #fff;
	padding: 20px;
	box-sizing: border-box;
	overflow: hidden;
	background-color: #c38f3e;
	grid-column: 4/5;
	grid-row: 1/3;
	border-radius: 10px;
	text-align: justify;
}
.top_article h2 {
	font-family: 'DIN Next LT Arabic';
	font-size: 22px;
	font-weight: normal;
	margin: 0 0 10px 0;
}
main {
	display: grid;
	grid-template-columns: repeat(6, 180px);
	width: calc(100% - 60px);
	max-width: 1200px;
	margin: auto;
	padding-top: 10px;
	grid-gap: 20px;
}
main.inpage {
	grid-template-columns: 1fr 320px;
}
main.inpage section.cat-block {
	grid-column:2/3;
}
section.cat-block {
	background-color: #fff;
	overflow: auto;
	padding: 15px 20px 20px 20px;
	grid-column: span 2;
	border-radius: 10px;
}
section.cat-block.marq {
	grid-column: span 3;
}
section.cat-block.imprt {
	grid-column: span 6;
}
section.cat-block h3 {
	border-width: 2px;
	font-family: 'DIN Next LT Arabic';
	margin-bottom: 10px;
	color: #c33e4c;
	border-bottom-style: solid;
	display: inline-block;
    padding-bottom: 10px;
    font-size: 22px;
}
article .links,
section.cat-block ul {
	display: flex;
	flex-wrap: wrap;
}
article .links li {
	flex-basis: 40%;
	flex-grow: 1;
}
article .links li,
section.cat-block .links li {
	display: block;
	width: 100%;
	overflow: hidden;
	text-align: justify;
	margin: 5px 0;
	padding: 5px;
	border-radius: 10px;
}
article .links li a,
section.cat-block .links li a {
	display: block;
	height: 100%;
    overflow: hidden;
	font-family: 'DIN Next LT Arabic';
}
article .links li .img,
section.cat-block .links li .img {
	background-position: center center;
	background-size: cover;
	width: 74px;
	height: 74px;
	overflow: hidden;
	border-radius: 50%;
	float: right;
	margin-left: 10px;
	background-repeat: no-repeat;
}
article .links li:hover,
section.cat-block .links li:hover {
	background-color: rgba(0,0,0,0.1);
}
section.cat-block.marq ul {
	display: flex;
	flex-wrap: nowrap;
}
section.cat-block.marq .links li {
	display: block;
	flex-basis: 260px;
	flex-grow: 1;
	width: 260px;
	height: 260px;
	margin: 10px;
	padding: 0;
	overflow: hidden;
	background-color: #ccc;
	position: relative;
}
section.cat-block.marq .links li a {
	background-size: cover;
    display: block;
    background-repeat: no-repeat;
    height: 35%;
    width: 100%;
    line-height: 22px;
    font-size: 18px;
    overflow: hidden;
    position: absolute;
    bottom: 0;
    color: #fff;
    padding: 10px;
    box-sizing: border-box;
    background: linear-gradient(to top, rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%);
}
section.cat-block.marq .links li .img {
	background-position: center center;
	background-size: cover;
	width: 100%;
	height: 100%;
	overflow: hidden;
	float: none;
	border-radius: inherit;
	margin-left: 10px;
	background-repeat: no-repeat;
	transition: all 0.3s ease;
}
section.cat-block.marq .links li:hover .img {
	transform: scale(1.1);
}
section.cat-block.imprt .links li {
	display: block;
	flex-basis: 30%;
	flex-grow: 1;
	height: 90px;
	overflow: hidden;
	text-align: justify;
	margin: 5px 0;
	padding: 5px;
	border-radius: 5px;
}
section.cat-block.imprt .links li .img {
	background-position: center center;
	background-size: cover;
	width: 140px;
	height: 90px;
	overflow: hidden;
	border-radius: 5px;
	float: right;
	margin-left: 10px;
	background-repeat: no-repeat;
}
main #new_art {
	font-family: 'DIN Next LT Arabic Light';
	color: #fff;
	font-size: 17px;
	display: block;
	width: 235px;
	height: 135px;
	background-color: #323232;
	position: fixed;
	top: 180px;
	right: 10px;
	overflow: hidden;
	z-index: 10001;
	margin-right: -260px;
	background-repeat: no-repeat;
	-webkit-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.39);
	-moz-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.39);
	box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.39);
}
main #new_art span {
	background-position: center 4px;
	background-color: #a4404b;
	display: block;
	width: 45px;
	height: 80px;
	float: right;
	background-image: url('images/close.png');
	background-repeat: no-repeat;
	cursor: pointer;
}
main #new_art h2 {
	width: 45px;
	height: 55px;
	margin-top: -55px;
	float: right;
	background-color: #323232;
	font-weight: normal;
	line-height: 58px;
	text-align: center;
	margin-bottom: 0px;
	transform: rotate(270deg);
}
main #new_art a {
	background-position: center center;
	background-size: cover;
	display: block;
	width: 190px;
	height: 135px;
	overflow: hidden;
	text-align: justify;
	background-repeat: no-repeat;
	-webkit-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.39);
	-moz-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.39);
	box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.39);
}
main #new_art a h4 {
	width: auto;
	height: 45px;
	margin-top: 80px;
	background-color: rgba(0,0,0,0.5);
	text-align: justify;
	font-size: 15px;
	font-family: 'DIN Next LT Arabic Light';
	font-weight: bold;
	padding: 5px;
}
main .block {
	border-width: 2px;
	border-bottom-style: solid;
	padding: 5px;
	margin-bottom: 10px;
	position: relative;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}
main .block h3 {
	font-family: 'DIN Next LT Arabic';
	font-size: 22px;
	line-height: 30px;
	padding-right: 5px;
	display: block;
	margin-bottom: 4px;
	font-weight: normal;
}
main .block h3 a {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	display: block;
}
main .block ul.links a div.img, 
main .block ul.big_links li:nth-child(even) a div.img {
	overflow: hidden;
	display: block;
	float: right;
	width: 60px;
	height: 60px;
	margin-left: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	position: relative;
}
main .block ul.links a:hover div.img span.date, 
main .block ul.big_links li:nth-child(even) a:hover div.img span.date {
	top: 0px;
}
main .links li a, main .big_links li:nth-child(even) a {
	overflow-x: hidden !important; 
}
main .links li a div.img span.date, 
main .big_links li:nth-child(even) a div.img span.date {
	overflow: hidden;
	width: 60px;
	height: 60px;
	display: block;
	float: right;
	background-color: rgba(0,0,0,0.50);
	font-family: 'DIN Next LT Arabic Light';
	font-size: 16px;
	margin-left: 5px;
	text-align: center;
	line-height: 32px;
	position: absolute;
	top: 60px;
	right: 0px;
	color: #FFFFFF;
	padding: 5px 0 0 0;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-transition-property: top;
	-webkit-transition-duration: 0.2s;
	-webkit-transition-timing-function: ease;
}
main .links li a div.img span.date i, 
main .big_links li:nth-child(even) a div.img span.date i {
	font-size: 8px;
	font-style: normal;
	line-height: 8px;
	display: block;
}
main .links li a div.img span.static, 
main .big_links li:nth-child(even) a div.img span.static {
	top: 0;
	background-color: rgba(0,0,0,0.20);
}
#left_col {
	width: 335px;
	float: left;
}
#left_col .block {
	border-color: #788639;
	background-color: #89984c;
	color: #FFFFFF;
}
#left_col .orng {
	border-color: #926633;
	background-color: #c38f3e;
}
#left_col .brn {
	border-color: #873f29;
	background-color: #a45740;
}

#left_col .block h3 {
	color: #FFFFFF;
	text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.50);
}
#left_col .block .tools {
	position: absolute;
	top: 12px;
	left: 7px;
	direction: ltr;
	width: 100px;
}
#left_col .block .tools a {
	border-width: 2px;
	border-color: #743523;
	margin: 0px;
	padding: 6px 8px 4px 8px;
	background-color: #873f29;
	border-bottom-style: solid;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}
#left_col .block .tools a:hover {
	background-color: #743523;
}
#left_col .block p {
	font-weight: bold;
	font-family: 'DIN Next LT Arabic Light';
	font-size: 15px;
	text-align: justify;
	padding-right: 5px;
	padding-left: 5px;
	line-height: 22px;
	text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.50);
}
#left_col a.addon img {
	margin: 0 5px 10px 0;
	width: 295px;
	max-height: 295px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}
.scrollable {
	max-height: 310px;
	overflow-x: hidden;
	overflow-y: auto;
	padding-left: 5px;
}
#left_col .block a {
	font-family: 'DIN Next LT Arabic Light';
	font-size: 18px;
	color: #FFFFFF;
}
#left_col .links > a, #left_col .links li a, #left_col .big_links li:nth-child(even) a {
	overflow: auto;
	text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.50);
}
#left_col .links > a, #left_col .links li a, #left_col .big_links li a {
	padding: 5px;
	color: #FFFFFF;
	line-height: 20px;
	display: block;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	margin-bottom: 2px;
}
#left_col .links > a span.img, #left_col .links li a span.img, #left_col .big_links li:nth-child(even) a span.img {
	overflow: hidden;
	display: block;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	float: right;
	width: 60px !important;
	height: 60px !important;
	margin-left: 5px;
}
#left_col .links > a img, #left_col .links li a img, #left_col .big_links li:nth-child(even) a img {
	display: block;
	height: 60px;
}
#left_col .links > a:hover, #left_col .links li a:hover, #left_col .big_links li:nth-child(even) a:hover {
	background-color: rgba(0,0,0,0.15);
	padding-right: 10px;
}
#left_col .big_links li:nth-child(odd) {
	margin-bottom: 10px;
}
#left_col .big_links li:nth-child(odd) a {
	padding: 0;
}
#left_col .big_links li:nth-child(odd) a div {
	overflow: hidden;
	display: block;
	width: 290px;
	height: 140px;
	padding-bottom: 5px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	margin-bottom: 5px;
}
#left_col .big_links li:nth-child(odd) a div img {
	width: 290px;
	margin-top: -30px;
}
#left_col .big_links li:nth-child(odd):hover {
	background-color: #96A754;
}
article,
section {
	background-color: #fff;
	overflow: auto;
	padding: 20px;
	position: relative;
	border-radius: 10px;
}
article h3,
section h3 {
	border-width: 2px;
	font-family: 'DIN Next LT Arabic';
	margin-bottom: 10px;
	color: #c33e4c;
	border-bottom-style: solid;
	display: block;
    padding-bottom: 10px;
    font-size: 22px;
}
article a.addon img {
	width: 690px;
	max-height: 160px;
	margin: 0px auto 10px auto;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}
article .block {
	width:100%;
	margin-left: 10px;
	flex-grow: 1;
	flex-shrink: 1;
	justify-content: space-between;
}
article .ii {
	width: 200px;
	overflow-x: hidden;
	flex-shrink: 1;
	flex-grow: 1;
}
article .block {
	border-color: #D4D4D4;
	background-color: #E8E8E8;
}
article .art {
	overflow: visible;
}
article .block h3 {
	color: #c33e4c;
	width: 100%;
	padding-left: 72px;
	box-sizing: border-box; 
}
article .block .tools {
	position: absolute;
	top: 12px;
	left: 7px;
	direction: ltr;
	width: 100px;
}
article .block .tools a {
	border-width: 2px;
	border-color: #c33e4c;
	margin: 0px;
	padding: 8px 10px 2px 10px;
	background-color: #a4404b;
	border-bottom-style: solid;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}
article .block .tools a:hover {
	background-color: #c33e4c;
}
article .small_tools {
	position: absolute;
	top: 75px;
	left: 20px;
	direction: ltr;
}
article .small_tools img {
	margin: 0;
	padding: 5px;
	background-color: #999999;
	border-radius: 35px;
	cursor: pointer;
}
article .small_tools img:hover {
	background-color: #AA0000;
}
article .stats {
	background-position: left top;
	font-family: 'DIN Next LT Arabic Light';
	font-size: 14px;
	color: #fff;
	background-color: #c33e4c;
	height: 26px;
	line-height: 26px;
	white-space: nowrap;
	display: inline-block;
	position: relative;
	padding-top: 1px;
	padding-bottom: 1px;
	border-radius: 3px;
}
/* article .stats .corner {
	background-image: url('images/stat_corner.png');
	background-repeat: no-repeat;
	background-position: right center;
	width: 6px;
	height: 30px;
	position: absolute;
	right: -6px;
	top: 0px;
	display: inline-block;
	z-index: 101;
} */
article .stats img {
	float: right;
	margin: 3px 5px;
}
article .stats a {
	float: right;
	margin-left: 5px;
	padding-left: 5px;
}
article .stats a:hover {
	background-color: #c33e4c;
}
article .block ul.links {
	overflow: auto;
}
article .block ul.links a {
	overflow: auto;
	padding: 5px;
	display: block;
	font-family: 'DIN Next LT Arabic Light';
	font-size: 16px;
	text-decoration: none;
	float: right;
	width: 100%;
	box-sizing: border-box;
	border-radius: 5px;
	margin-left: 8px;
}
article .block ul.links li a:hover {
	background-color: #D7D7D7;
}
article .block ul.links a img {
	height: 60px;
	min-width: 60px;
}
article .block ul.big_links {
	overflow: auto;
}
article .block ul.big_links li {
	float: left;
	width: 226px;
}
article .block ul.big_links li a {
	overflow: hidden;
	margin: 8px;
	color: #333;
	height: 196px;
	font-size: 15px;
	display: block;
	position: relative;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.50);
}
article .block ul.big_links li a img {
	min-width: 216px;
	height: 198px;
	background-color: #FFFFFF;
}
article .block ul.big_links li a span {
	padding: 3px;
	color: #FFFFFF;
	display: block;
	z-index: 2;
	position: absolute;
	bottom: -22px;
	right: 0px;
	font-family: 'DIN Next LT Arabic Light';
	font-size: 18px;
	width: 204px;
	height: 70px;
	line-height: 20px;
	text-align: justify;
	background-color: rgba(1, 1, 1, 0.60);
}
article .block ul.big_links li a:hover span {
	bottom: 0px;
}
article .block .caroufredsel_wrapper {
	width: auto !important;
}
article .block legend {
	font-family: 'DIN Next LT Arabic Light';
	font-size: 18px;
	display: block;
	text-align: right;
	line-height: 20px;
	color: #a4404b;
}
article .block label {
	font-family: 'DIN Next LT Arabic Light';
	font-size: 18px;
	display: block;
	text-align: right;
	line-height: 20px;
	color: #590000;
}
article .block fieldset {
	border: 1px solid #d7d7d7;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
article .block iframe.yt.float {
	position: fixed;
	bottom: 10px;
	right: 10px;
	width: 320px;
	height: 200px;
	z-index: 1000;
}
article form {
	border-width: 3px;
	border-color: #DDDDDD;
	border-bottom-style: solid;
	padding: 5px 0;
	margin: 5px 0;
}
article form * {
	font-size: 20px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
article form select {
	min-width: 40px;
	height: 35px;
	margin: 5px;
	float: right;
	font-weight: bold;
}
article form textarea {
	padding: 5px;
	width: 98%;
	border-style: solid;
	background-color: #fff;
	color: #333;
	font-family: 'DIN Next LT Arabic Light';
	border-color: #ccc;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-left-width: 1px;
}
article form input[type=text], article form input[type=email] {
	height: 25px;
	width: 300px;
	margin: 5px;
	padding: 5px 5px 5px 5px;
	border-style: solid;
	background-color: #fff;
	color: #333;
	font-family: 'DIN Next LT Arabic Light';
	border-color: #ccc;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-left-width: 1px;
}
article form input[type=text].input {
	width: 100px;
	float: right;
	margin-top: 0px;
	font-family: 'DIN Next LT Arabic Light';
	font-size: 26px;
}
article form input[type=submit] {
	height: 35px;
	width: 150px;
	margin: 5px;
	padding: 8px 5px 8px 5px;
	border-style: none;
	background-color: #a4404b;
	color: #fff;
	font-family: 'DIN Next LT Arabic Light';
	cursor: pointer;
	border-color: #c33e4c;
	border-bottom-style: solid;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	font-size: 16px;
}
article form input[type=submit]:hover {
	background-color: #c33e4c;
}
article .inpage {
	font-family: 'DIN Next LT Arabic';
	overflow: auto;
	font-size: 19px;
	text-align: justify;
	color: #333333;
	padding: 0 5px;
}
article .inpage a {
	color: #a45740;
}
article .inpage a:hover {
	background-color: #c38f3e;
	color: #FFFFFF;
}
article .inpage a.art_img {
	background-position: center center;
	background-size: cover;
	width: 100%; /*300px*/
	aspect-ratio: 16/10;
	margin: 10px auto; /*10px*/
	box-sizing: border-box;
	display: block;
	background-repeat: no-repeat;
	border: 5px solid #EAEAEA;
	position: relative;
}
article .inpage a.art_img:hover {
	border-color: #a4404b;
}
article .inpage #img_cmnt {
	padding: 0 5px;
	background-color: rgba(164,64,75,0.8);
	width: 100%;
	font-family: 'DIN Next LT Arabic Light';
	font-size: 12px;
	font-weight: normal;
	color: #fff;
	display: block;
	position: absolute;
	right: 0px;
	bottom: 0px;
	box-sizing: border-box; 
}
article .inpage #date {
	margin: 2px auto 5px 5px;
	border-width: 2px;
	display: inline-block;
	color: #00928e;
	border-right-style: solid;
	padding-right: 5px;
	width: 520px;
	font-family: 'DIN Next LT Arabic Light';
	font-size: 12px;
	font-weight: normal;
}
article .inpage p img {
	width: auto !important;
	height: auto !important;
	max-width: 100%;
	max-height: 500px;
}
article .inpage .files {
	overflow: auto;
	margin-top: 10px;
}
article .inpage .files a {
	display: block;
	overflow: hidden;
	padding: 2px;
	float: right;
	width: 48%;
	border-radius: 5px;
	margin-right: 2px;
	margin-left: 2px;
}
article .inpage .files a img {
	margin-left: 4px;
}
article .inpage .files a:hover {
	background-color: #a4404b;
	color: #FFFFFF;
}
article .inpage .attachs {
	margin: 10px 5px 5px 5px;
	display: block;
}
article .inpage .attachs a {
	margin: 5px;
	overflow: hidden;
	display: inline-block;
	width: 100px;
	height: 100px;
	border-radius: 8px;
}
article .inpage .attachs a img {
	width: 160px;
	min-height: 100px;
	transition: all 300ms ease;
}
article .inpage .attachs a:hover img {
	transform: scale(1.2);
}
article .inpage p {
	padding: 5px;
	border-radius: 3px;
}
article .inpage p:hover {
	color: black;
	background-color: rgba(0,0,0,0.05);
}

/* comments */
article #cmnts {
	color: #5E5A22;
	font-family: 'DIN Next LT Arabic Light';
	font-size: 12px;
	position: relative;
}
article #cmnts .title{
	background-position: right top;
	background-color: #8E8A33;
	background-image: url('images/cmnts.png');
	background-repeat: no-repeat;
	padding-right: 36px;
	width: 636px;
	padding-top: 5px;
	height: 25px;
}
article img#arr {
	position: absolute;
	top: 10px;
	left: 10px;
	cursor: pointer;
}
article img#arr:hover {
	padding: 5px;
	top: 5px;
	left: 5px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	background-image: url('images/arr_bg.jpg');
}
article #cmnts #add{
	text-decoration: none;
	cursor: pointer;
	font-weight: bold;
	font-family: 'DIN Next LT Arabic Light';
	font-size: 16px;
}
article #cmnts .nums {
	border-width: 2px;
	border-color: #5E5A22;
	display: block;
	width: 100px;
	float: left;
	position: absolute;
	top: 40px;
	border-right-style: solid;
	padding-right: 5px;
	left: 0px;
}
article #cmnts #hide {
	border: 1px solid #BCB788;
	margin: 5px;
	padding: 5px;
	background-color: #F4F3EC;
	line-height: 20px;
	position: relative;
}
article #cmnts #hide input[type=text] {
	width: 200px;
}
article #cmnts #hide input[type=submit] {
	border: 1px solid #5E5A22;
	background-position: center bottom;
	width: 100px;
	background-color: #8E8A33;
	background-image: url('images/gloss_bg.png');
	color: #FFFFFF;
	background-repeat: repeat-x;
	cursor: pointer;
	font-weight: bold;
	font-size: 15px;
}
article #cmnts #hide input[type=submit]:hover {
	background-color: #8C1821;
}
article #cmnts #hide p {
	position: absolute;
	top: -5px;
	left: 5px;
}
article #cmnts #hide p textarea {
	border-color: #ADADAD!important;
	width: 460px;
	height: 110px;
}
section.comments {
	overflow:hidden;
	grid-column:1/2;
	background-color:#fff;
}
.cmnt_add {
	background-position: right center;
	border: 1px solid #CDD937;
	margin: 5px;
	padding: 5px 25px 5px 5px;
	font-family: 'DIN Next LT Arabic Light';
	font-size: 16px;
	background-color: #F9FFCE;
	line-height: 20px;
	font-weight: bold;
	color: #58630C;
	background-image: url('images/tick.png');
	background-repeat: no-repeat;
}
.c1 {
	border: 1px solid #BCB788;
	padding: 5px;
	margin: 5px;
	min-height: 60px;
	background-color: #F2F1EA;
	position: relative;
}
.c2 {
	padding: 5px;
	margin: 5px;
	border-width: 2px;
	border-color: #A7A267;
	min-height: 60px;
	background-color: #FFFFFF;
	border-right-style: dashed;
	border-left-style: dashed;
	position: relative;
}
#comments .titl {
	font-family: 'DIN Next LT Arabic Light';
	font-size: 16px;
	font-weight: bold;
	color: #333333;
	display: block;
	line-height: 30px;
	text-align: right;
	width: 620px;
}
#comments h3 {
	font-family: 'DIN Next LT Arabic Light';
	font-size: 22px;
	font-weight: bold;
	color: #CCCCCC;
	width: 45px;
	position: absolute;
	left: 0px;
	top: -18px;
	text-align: center;
	display: inline-block;
	font-style: italic;
}
#comments .body {
	border-style: none;
	text-align: justify;
	padding-bottom: 5px;
}
#comments .footer {
	background-position: center -20px;
	font-size: 11px;
	display: block;
	width: 100%;
	line-height: 20px;
	font-weight: normal;
	margin-top: 5px;
	background-image: url('images/gloss_bg.png');
	background-repeat: repeat-x;
}
#comments .date {
	width: 180px;
	display: block;
	float: left;
}
/* --- Pagination --- */
div.pagination {
	width: 100%;
	color: #CCCCCC;
	padding: 0px 10px 10px 10px;
	direction: ltr;
	font-family: 'DIN Next LT Arabic Light';
	font-size: 15px;
	text-align: left;
	display: block;
	position: relative;
	height: 16px;
	font-weight: bold;
	grid-column: 1/2;
}
div.pagination a {
	color: #666666;
	padding: 5px 10px 3px 10px;
	text-decoration: none;
	font-weight: bold;
	margin-right: 2px;
	margin-left: 2px;
	background-color: #FBFBFB;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
}
div.pagination a:hover, 
div.pagination a:active {
	color: #F8F8F8;
	background-color: #c33e4c;
}
div.pagination span.current {
	padding: 2px;
	color: #c33e4c;
	font-weight: bold;
	padding: 5px 10px 3px 10px;
	background-color: #e6e6e6;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
}
div.pagination span.disabled {
	color: #C0C0C0;
	padding: 5px 10px;
	margin: 0 2px;
	font-weight: bold;
}
div.pagination .statics {
	margin: 0px;
	padding: 5px;
	font-family: 'DIN Next LT Arabic Light';
	font-size: 12px;
	color: #999999;
	font-weight: normal;
	position: absolute;
	text-align: center;
	direction: rtl;
	right: 5px;
	left: auto;
	height: 11px;
	top: -4px;
}
footer {
	overflow: auto;
	padding: 5px;
	clear: both;
	margin-top: 10px;
	background-color: #444d61;
}
footer .links {
	margin: auto;
	width: 750px;
	padding: 0 0 0 250px;
	display: block;
	position: relative;
	height: 100px;
}
footer .editors {
	width: 174px;
	font-family: 'DIN Next LT Arabic Light';
	display: block;
	min-height: 80px;
	position: absolute;
	top: 6px;
	left: 0px;
	color: #ffffff;
	font-size: 12px;
}
footer .editors div {
	width: 100%;
	text-align: right;
	padding-top: 10px;
}
footer .links h4 {
	font-size: 16px;
	font-weight: normal;
	margin-bottom: 10px;
}
footer .links a {
	margin: 2px;
	overflow: hidden;
	padding: 2px;
	display: block;
	font-family: 'DIN Next LT Arabic Light';
	font-size: 12px;
	color: #FFFFFF;
	white-space: nowrap;
	text-overflow: ellipsis;
	line-height: 18px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	float: right;
	width: 200px;
}
footer .links a:hover {
	background-color: rgba(0,0,0,0.2);
}
#rights {
	margin: 0;
	background-color: #252C36;
	font-family: 'DIN Next LT Arabic Light';
	font-size: 11px;
	color: #D9D9D9;
	padding: 8px 0;
	text-align: center;
	direction: ltr;
	display: block;
	clear: both;
}
#rights div {
	width: 1000px;
	margin: auto;
	overflow: auto;
}
#rights a {
	color: #e4eef1;
	text-decoration: none;
	font-weight: bold;
}
#rights span:last-child {
	float: right;
}
#rights span:first-child {
	float: left;
}
#rights span:first-child a {
	background-position: -20px center;
	background-repeat: no-repeat;
}
#rights span:first-child:hover a {
	padding-left: 24px;
	background-position: 4px center;
}
#rights a:hover {
	color: #FFFFFF;
	text-decoration: underline;
}

/*Back to top button */
#back-top {
	position: fixed;
	bottom: 10px;
	margin-right: 14px;
}
#back-top span {
	width: 40px;
	height: 50px;
	display: block;
	margin-bottom: 7px;
	background: url(images/top.png) center center no-repeat;
	border-radius: 4px;
	transition: 1s;
	background-color: #c33e4c;
}
#back-top a:hover span {
	background-color: #CF6570;
}
.clear {
	float: none;
	clear: both;
}
@media screen and (max-width: 720px) {
	main {
		width: 100%;
		grid-template-columns: 100% !important;
	}
	main.inpage section.cat-block {
		grid-column:1/2;
	}
	.featured {
		width: 100%;
		grid-template-columns: 100%;
		grid-template-rows: 300px 190px 190px 190px 372px;
		grid-column: 1/1;
	}
	.featured .art {
		grid-column: 1/2 !important;
	}
	.featured .art:nth-child(1) {
    	grid-row: 1/2;
	}
	.featured .art:nth-child(2) {
    	grid-row: 2/3;
	}
	.featured .art:nth-child(3) {
    	grid-row: 3/4;
	}
	.featured .art:nth-child(4) {
    	grid-row: 4/5;
	}
	.top_article {
		grid-column: 1/2;
    	grid-row: 5/6;
	}
	section.cat-block.marq {
		width: 100%;
		box-sizing: border-box;
		grid-column: 1/2;
	}
	section.cat-block.imprt {
		grid-column: 1/2;
	}
	section.cat-block.imprt .links li {
		flex-basis: 100%;
	}
	section.cat-block.marq .links li a {
		line-height: 18px;
		font-size: 16px;
		height: 40%;
	}
	section.cat-block {
		grid-column: 1/2;
		padding: 10px;
	}
	.scrollable {
		overflow-y: auto !important;
		max-height: 290px;
	}
	header {
		display: block;
	}
	header #logo {
	    background-position: right center;
		background-size: contain;
		margin: 16px;
		height: 60px;
		display: block;
	}
	#nav-toggle {
		display: block;
	}
	header form, 
	#socials {
		display: none;
	}
	nav ul.links {
		height: 100vh;
		width: 70%;
		z-index: 100;
		padding: 100px 10px 10px 10px;
		top: 0;
		left: -80%;
		position: fixed;
		align-content: flex-start;
		background: #c33e52e0;
		flex-wrap: wrap;
		backdrop-filter: blur(5px);
		transition: left 0.3s ease;
	}
	nav ul.links.sided {
		left: 0;
	}
	nav ul.links > li {
		width: 100%;
	}
	header,
	main,
	footer .links {
		overflow: hidden;
	}
}