@import url(https://fonts.googleapis.com/earlyaccess/droidarabickufi.css);
@import url(https://fonts.googleapis.com/earlyaccess/droidarabicnaskh.css);
@font-face {
    font-family: 'hacen_light';
    src: url('fonts/HacenLinerPrint-outLight.eot');
    src: url('fonts/HacenLinerPrint-outLight.eot?#iefix') format('embedded-opentype'),
         url('fonts/Hacen Liner Print-out Light.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
	font-family: 'hacen_xxl';
    src: url('fonts/Hacen_Liner_XXL.eot');
    src: url('fonts/Hacen_Liner_XXL.eot?#iefix') format('embedded-opentype'),
         url('fonts/Hacen Liner XXL.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
	font-family: 'hacen_screen';
    src: url('fonts/Hacen_Liner_Screen.eot');
    src: url('fonts/Hacen_Liner_Screen.eot?#iefix') format('embedded-opentype'),
         url('fonts/Hacen Liner Screen.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
.clear{
	clear:both;
	line-height:0;
	height:0;
	font-size:0;
}
html {
  height: 100%;
}
body{
	position:relative;
	min-height: 100%;
	background:url("img/body-bg.jpg") no-repeat fixed;
	background-size:cover;
	margin:0;
	padding:0 0 83px 0;
	font-size:13px;
	font-family:Tahoma, Geneva, sans-serif;
	color:#212224;
	box-sizing:border-box;
}
a{
	text-decoration:none;
	outline:none;
}
img{
	border:none;
}
.site-width{
	position:relative;
	width:1124px;
	margin:0 auto;
	direction:rtl;
	transition:margin 250ms;
}
@media screen and (max-width:1179px){
	.site-width{
		width:auto;
		margin:0 20px;
	}
}
@media screen and (max-width:854px){
	#all-site{
		position:relative;
		right:190px;
		right:0;
		transition:right 450ms;
	}
}
@media screen and (max-width:450px){
	.site-width{
		margin:0 10px;
	}
}
div#head{
	opacity:0.80;
	position:fixed;
	top:0;
	right:0;
	left:0;
	z-index:91;
	transition:right 450ms, left 450ms;
	background:#ffffff;
}
div#head .head-in{
	position:relative;
	height:100px;
	border-bottom-right-radius:3px;
	border-bottom-left-radius:3px;
	box-shadow:0 1px 5px rgba(0, 0, 0, 0.15);
}


@keyframes animatedHeadLine {
	from { background-position: -900px bottom; }
	to { background-position: 415% bottom; }
}
@-webkit-keyframes animatedHeadLine {
	from { background-position: -900px bottom; }
	to { background-position: 415% bottom; }
}
@-ms-keyframes animatedHeadLine {
	from { background-position: -900px bottom; }
	to { background-position: 415% bottom; }
}
@-moz-keyframes animatedHeadLine {
	from { background-position: -900px bottom; }
	to { background-position: 415% bottom; }
}
div#head .head-in .top-line{
	position:relative;
	height:50px;
	background:url("img/head-tile-colored-line.png") repeat-x center bottom #485053;
	background-size:auto 30%;
	
	animation: animatedHeadLine 25s linear infinite;
	-ms-animation: animatedHeadLine 25s linear infinite;
	-moz-animation: animatedHeadLine 25s linear infinite;
	-webkit-animation: animatedHeadLine 25s linear infinite;
	
}
div#head .head-in .top-line .top-line-in{
	background:url(img/head-tile.png) repeat-x center bottom;
	background-position:center bottom;
	background-size:auto 30%;
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
}
div#head .head-in .top-line .top-line-in .site-width{
	background:url(img/markaz-logo.gif) no-repeat top right;
	background-position:calc(100% - 0px) 5px;
	background-size:auto 54%;
	height:100%;
}
div#head .head-in .top-line .top-line-in .social{
	direction:ltr;
	position:absolute;
	top:9px;
	left:0;
	color:#616161;
	white-space:nowrap;
}
div#head .head-in .top-line .top-line-in .social a{
	transition:margin 450ms;
	font-size:17px;
	color:#ffffff;
	margin:0 7px 0 0;
}
div#head .head-in .top-line .top-line-in .social a:hover{
	color:#abd600;
}

div#head .head-in .bottom-line{
	background:url("img/mag-logo-first.gif") no-repeat calc(100% - 0px) 10px, url("img/mag-logo-middle.gif") no-repeat calc(100% - 64px) 8px, url("img/mag-logo-last.gif") no-repeat calc(100% - 110px) 10px  #ffffff;
	background-size:auto 26px, auto 32px, auto 26px;
	transition:background 450ms;
}

@media screen and (max-width:1015px){
	#all-site{
		position:relative;
		right:190px;
		right:0;
		transition:right 450ms;
	}
	div#head .head-in .bottom-line{
		background:url("img/mag-logo-first.gif") no-repeat calc(100% - 37px) 10px, url("img/mag-logo-middle.gif") no-repeat calc(100% - 103px) 8px, url("img/mag-logo-last.gif") no-repeat calc(100% - 152px) 10px  #ffffff;
		background-size:auto 26px, auto 32px, auto 26px;
	}
}
@media screen and (max-width:440px){
	div#head .head-in .top-line .top-line-in .social a{
		display:none;
	}
	div#head .head-in .top-line .top-line-in .social a:first-child, div#head .head-in .top-line .top-line-in .social a:nth-child(2){
		display:inline;
	}
}
@media screen and (max-width:355px){
	div#head .head-in .bottom-line{
		background:url("img/mag-logo-first.gif") no-repeat calc(100% - 37px) 12px, url("img/mag-logo-middle.gif") no-repeat calc(100% - 94px) 9px, url("img/mag-logo-last.gif") no-repeat calc(100% - 135px) 12px  #ffffff;
		background-size:auto 23px, auto 28px, auto 23px;
	}
}




















div#head .head-in #menu-icon{
	position: absolute;
	bottom:7px;
	right:5px;
	cursor:pointer;
	color:#4e5656;
	font-size:24px;
	visibility:hidden;
	opacity:0;
	background:#ffffff;
	transition:color 350ms, visibility 450ms, opacity 450ms;
}
div#head .head-in #menu-icon:hover{
	color:#e64f3b;
}

#main-menu{
	height:41px;
	transition:height 450ms;
	overflow:hidden;
	margin:1px 220px 0 0;
}

#main-nav{
	height:41px;
	margin:0;
/*	background:#993;*/
}
#main-nav .head-right-menu{
	margin:0;
	padding:10px 0 8px 0;
	text-align:center;
	border-bottom:1px solid #d7d7d7;
	display:none;
	background:#e5e5e5;
}
#main-nav .head-right-menu img{
	width:165px;
}
#main-nav .social{
	direction:ltr;
	font-size:15px;
	white-space:nowrap;
	margin:12px 0 0 0;
	text-align:center;
}
#main-nav .social a{
	color:#686868;
	margin:0 3px;	
}
#main-nav .social a:hover{
	color:#CB3235;
}
#main-nav ul#menu{
	display:inline-block;
	list-style:none;
	margin:0;
	padding:0;
	font-size:0;
	vertical-align:top;
	white-space:nowrap;
}
#main-nav ul#menu li{
	display:inline-block;
	background:url("img/menu-splite-3.gif") no-repeat;
	background-position:0 14px;
	background-size:2px auto;
}
#main-nav ul#menu li:last-child{
	background-image:none;
}
#main-nav ul#menu li a{
	display:block;
	height:41px;
	padding:0 10px;
	color:#b7bbca;
	font-size:21px;
}
#main-nav ul#menu li a span.text{
	line-height:43px;
	font-family:"Droid Arabic Kufi", "Tahoma";
	font-size:12px;
	display:inline-block;
	color:#3a362d;
	vertical-align:middle;
	padding:0 0 4px 0;
}
#main-nav ul#menu li a:hover span.text{
	color:#7c8e33;
}
#main-nav ul#menu li a span.have_drop{
	font-size:15px;
	color:#b7b7b7;
	text-indent:4px;
}
#main-nav ul#menu li a span.have_drop_left{
	font-size:15px;
	color:#b7b7b7;
	text-indent:7px;
	display:none;
}
#main-nav ul#menu li:hover{
	
}
#main-nav ul#menu li .drop{
	border-top-left-radius:10px;
	border-top-right-radius:10px;
	border-bottom-left-radius:5px;
	border-bottom-right-radius:5px;
	position:absolute;
	margin:0 -1px 0 0;
	background:#ffffff;
	display:none;
	z-index:10000000;
	box-shadow:0 1px 5px rgba(0, 0, 0, 0.15);
}
#main-nav ul#menu li .drop .top-cursor{
	font-size:24px;
	position:absolute;
	top:-16px;
	right:15px;
	color:#4e5656;
}
#main-nav ul#menu li .drop .right-cursor{
	font-size:24px;
	position:absolute;
	top:8px;
	right:-8px;
	color:#4e5656;
	display:none;
}
#main-nav ul#menu li:hover .drop{
	display:block;
}
#main-nav ul#menu li .drop ul{
	margin:0;
	padding:0;
}
#main-nav ul#menu li .drop ul li{
	display:block;
	border-top:1px solid #dcdcdc;
	background-image:none;
}
#main-nav ul#menu li .drop ul li:first-child{
	border-top:3px solid #4e5656;
	border-top-right-radius:10px;
	border-top-left-radius:10px;
}
#main-nav ul#menu li .drop ul li:last-child{
	border-bottom-right-radius:5px;
	border-bottom-left-radius:5px;
	border-bottom:none;
}
#main-nav ul#menu li .drop ul li:hover{
	background:#f6f6f6;
}
#main-nav ul#menu li .drop ul li a{
	height:auto;
	padding:0 13px 0 19px;
}
#main-nav ul#menu li .drop ul li a span{
	color:#6a6969;
	font-size:14px;
}
#main-nav ul#menu li .drop ul li a span.text{
	color:#767575;
	line-height:34px;
	display:inline-block;
	text-indent:0;
	min-width:120px;
	font-size:12px;
	padding:0;
}
@media screen and (max-width:1015px){
	div#head .head-in #menu-icon{
		visibility:visible;
		opacity:0.99;
	}
	#menu{
		height:3px;
		background:#ffffff;
		overflow:visible;
	}
	#main-nav{
		position:fixed;
		top:0;
		bottom:0;
		right:0;
		right:-190px;
		height:auto;
		margin:0;
		width:190px;
		background:#f5f5f5;
		border-left:1px solid #e0e5e9;
		transition:right 450ms;
		text-align:right;
		z-index:10000000;
	}
	#main-nav .head-right-menu{
		display:block;
	}
	#main-nav ul#menu{
		white-space:normal;
		display:block;
		border-left:none;
		border-right:none;
		background:none;
		height:auto;
	}
	#main-nav ul#menu li{
		display:block;
		position:relative;
		border-bottom:1px solid #ecebeb;
		border-left:none;
		border-right:none;
		background-image:none !important;
	}
	#main-nav ul#menu li a{
		height:auto;
		padding:4px 0 2px 0;
		text-indent:7px;
		font-size:17px;
		color:#63697e;
	}
	#main-nav ul#menu li a span.text{
		line-height:25px;
		color:#444233;
	}
	#main-nav ul#menu li a:hover span.text{
		color:#CB3235;
	}
	#main-nav ul#menu li a span.have_drop{
		display:none;
	}
	#main-nav ul#menu li a span.have_drop_left{
		display:inline-block;
		float:left;
		margin:6px 0 0 9px;
	}
	#main-nav ul#menu li .drop{
		top:-2px;
		right:191px;
		border-top-right-radius:10px;
		border-bottom-right-radius:10px;
	}
	#main-nav ul#menu li .drop .top-cursor{
		display:none;
	}
	#main-nav ul#menu li .drop .right-cursor{
		display:inline-block;
	}
	#main-nav ul#menu li .drop ul{
		margin:0;
		padding:0;
		border-top:3px solid #4e5656;
		border-right:3px solid #4e5656;
		border-radius:0;
		border-top-right-radius:5px;
		border-bottom-right-radius:10px;
		border-top-left-radius:10px !important;
	}
	#main-nav ul#menu li .drop ul li{
		border-top:none;
		background-image:none;
		border-radius:0 !important;
	}
	#main-nav ul#menu li .drop ul li:first-child{
		border-top:none;
		border-radius:0;
		border-top-right-radius:2px !important;
		border-top-left-radius:10px !important;
		background:#ffffff;
	}
	#main-nav ul#menu li .drop ul li:first-child:hover{
		border-radius:0;
		border-top-right-radius:2px !important;
		border-top-left-radius:10px !important;
		background:#f6f6f6;
	}
	#main-nav ul#menu li .drop ul li:last-child{
		border-radius:0;
		border-bottom-right-radius:10px !important;
		border-bottom-left-radius:5px !important;
	}
	#main-nav ul#menu li .drop ul li:last-child:hover{
		border-radius:0;
		border-bottom-right-radius:10px !important;
		background:#f6f6f6;
	}
	
	
	
	
	
	#main-nav ul#menu li .drop ul li a{
		padding:0 11px 0 12px;
		white-space:nowrap;
		text-indent:0;
	}
	#main-nav ul#menu li .drop ul li a span.text{
		line-height:25px;
		padding:5px 0 6px 0;
	}
}









div#head .head-in .bottom-line .HHH-search-button{
	position:absolute;
	bottom:10px;
	left:0;
	color:#485053;
	font-size:18px;
	cursor:pointer;
	transition:color 450ms;
}
div#head .head-in .bottom-line .HHH-search-button:hover{
	color:#3b7388;
}
div#head .head-in .bottom-line div.HHH-search-box{
	background:#ffffff;
	position:absolute;
	top:7px;
	left:-7px;
	opacity:0.90;
	border:1px solid #d9dce4;
	border-radius:5px;
	overflow:hidden;
	display:none;
}
div#head .head-in .bottom-line div.HHH-search-box input[type="text"]{
	width:200px;
	line-height:29px;
	height:29px;
	border:none;
	padding:5px 6px;
	margin:-1px;
	box-sizing:border-box;
	font-family:"Droid Arabic Kufi", "Tahoma";
	font-size:11px;
}
div#head .head-in .bottom-line div.HHH-search-box i.HHH-search-submit{
	position:absolute;
	top:5px;
	left:6px;
	color:#485053;
	font-size:18px;
	cursor:pointer;
	transition:color 450ms;
}
div#head .head-in .bottom-line div.HHH-search-box i.HHH-search-submit:hover{
	color:#D93C3F;
}




section#inside-content{
	background:none;
	border:none;
	padding-top:120px;
	padding-bottom:285px;
}
section#inside-content div.site-width{
	background:rgba(255, 255, 255, 0.80);
	border-radius:4px;
	box-shadow:0 1px 5px rgba(0, 0, 0, 0.15);
}

@media screen and (max-width:400px){
	section#inside-content{
		padding-bottom:260px;
	}
}

































footer#footer{
	opacity:0.80;
	position:absolute;
	bottom:0;
	right:0;
	left:0;
	z-index:91;
	transition:right 450ms, left 450ms;
	
	
}
footer#footer .footer-in{
	position:relative;
	box-shadow:0 -1px 5px rgba(0, 0, 0, 0.15);
	margin:0 0 45px 0;
	padding:0 0 2px 0;
	background:url("img/footer-tile-colored-line.png") repeat-x center bottom;
	background-size:auto 15px;
	
	animation: animatedHeadLine 25s linear infinite;
	-ms-animation: animatedHeadLine 25s linear infinite;
	-moz-animation: animatedHeadLine 25s linear infinite;
	-webkit-animation: animatedHeadLine 25s linear infinite;
}
footer#footer .footer-in .top-line{
	background:rgb(91, 103, 111, 0.92);
}
footer#footer .footer-in .top-line img.mag-logo{
	width:200px;
	position:absolute;
	top:-17px;
	right:calc(50% - 100px);
}
footer#footer .footer-in .top-line .site-width{
	height:280px;
}
footer#footer .footer-in .top-line .footer-l-m{
	position:absolute;
	top:23px;
	left:0;
	display:inline-block;
}
footer#footer .footer-in .top-line .footer-l-m img{
	height:200px;
	border:4px solid #FFFFFF;
	border-radius:4px;
}
	
	
footer#footer .footer-in .top-line .footer-l-m a:nth-child(2){
	position:absolute;
	top:10%;
	left:-30px;
	display:block;
	background:#fcb917;
	width:65px;
	height:65px;
	border-radius:50%;
	text-align:center;
	color:#ffffff;
	font-weight:bold;
	border:3px solid #FFFFFF;
	box-shadow:7px 1px 5px rgba(0, 0, 0, 0.25);
	font-family:"Droid Arabic Kufi", "Tahoma";
	font-size:14px;
	line-height:18px;
	padding:13px 4px 0 5px;
	box-sizing:border-box;
	transform: rotate(25deg);
	transition:transform 450ms;
}
footer#footer .footer-in .top-line .footer-l-m:hover a:nth-child(2){
	transform: rotate(-4deg);
}
footer#footer .footer-in .top-line .footer-l-m a:nth-child(2) .mag-number{
    font-size:32px;
    font-weight:bold;
    font-family:Cambria, Hoefler Text, Liberation Serif, Times, Times New Roman, serif;
}
@media screen and (max-width:1179px){
    footer#footer .site-width{
        margin:0 10px 0 30px;
    }
}
@media screen and (max-width:600px){
	footer#footer .footer-in .top-line img.mag-logo{
        width:168px;
		top:-14px;
		right:calc(50% - 84px);
	}
}
@media screen and (max-width:400px){
	footer#footer .footer-in .top-line .footer-l-m img{
		height:175px;
	}
	footer#footer .footer-in .top-line .footer-l-m a:nth-child(2){
		transform: rotate(25deg) scale(0.80);
	}
	footer#footer .footer-in .top-line .footer-l-m:hover a:nth-child(2){
		transform: rotate(-4deg) scale(0.80);
	}
}
	
	
	
footer#footer .footer-in .top-line .footer-l-m a.footer-l-m-d-link{
	position: relative;
	display: block;
	background:#ff3779;
	font-family: "Droid Arabic Kufi", "Tahoma";
	text-align: center;
	height: 33px;
	width: calc(100% - 8px);
	line-height: 33px;
	font-weight: bold;
	font-size: 12px;
	color: #ffffff;
	margin:-4px auto 0 auto;
	z-index: +1;
	border-bottom-left-radius:4px;
	border-bottom-right-radius:4px;
	transition:margin 300ms, background 400ms;
}
footer#footer .footer-in .top-line .footer-l-m:hover a.footer-l-m-d-link{
	
}
footer#footer .footer-in .top-line .footer-l-m a.footer-l-m-d-link:hover{
	background:#a159c7;
}
	
	
footer#footer .footer-in .top-line .footer-l-m-abhath{
	height:100%;
	padding:23px 0 20px 190px;
	box-sizing:border-box;
}
/*footer#footer .footer-in .top-line .footer-l-m-abhath div{
	background:red;
}*/
	
	
footer#footer .footer-in .top-line .footer-l-m-abhath ul{
	list-style:none;
	padding:0;
	margin:0;
	opacity:0.85;
}
footer#footer .footer-in .top-line .footer-l-m-abhath ul li{
	border-radius:3px;
	border-bottom:1px dashed #3d4f5a;
	margin:10px 13px 0 0;
	padding:0 0 10px 0;
	line-height:21px;
	transition:background 450ms;
}
footer#footer .footer-in .top-line .footer-l-m-abhath ul li:first-child{
	margin:0 13px 0 0;
}
footer#footer .footer-in .top-line .footer-l-m-abhath ul li:last-child{
	border:none;
	padding:0;
}
footer#footer .footer-in .top-line .footer-l-m-abhath ul li.dark{
	
}
footer#footer .footer-in .top-line .footer-l-m-abhath ul li a{
	color:#ecf4f6;
	font-family:"Droid Arabic Kufi", "Tahoma";
	display:block;
	padding:0 0 0 0;
	font-weight:bold;
	font-size:11px;
	transition:padding ease-in-out 450ms;
}
footer#footer .footer-in .top-line .footer-l-m-abhath ul li a b{
	font-size:18px;
	color:#ecf4f6;
	vertical-align: bottom;
	transition:font-size ease-in-out 450ms;
}
footer#footer .footer-in .top-line .footer-l-m-abhath ul li a span{
	display:block;
	color:#ecf4f6;
	padding:7px 20px 0 0;
	font-family:"Droid Arabic Kufi", "Tahoma";
	font-size:11px;
}
footer#footer .footer-in .top-line .footer-l-m-abhath ul li a span b{
	font-size:16px;
	color:#ecf4f6;
}


@media screen and (max-width:400px){
	footer#footer .footer-in .top-line .site-width{
		height:255px;
	}
	footer#footer .footer-in .top-line .footer-l-m-abhath{
		padding:23px 0 20px 155px;
	}
	footer#footer .site-width{
		margin:0 3px 0 17px;
	}
}

	



	
footer#footer .footer-in .bottom-line{
	position:absolute;
	bottom:-45px;
	right:0;
	left:0;
	height:45px;
	background:#485053;
	text-align:center;
}

footer#footer .footer-in .bottom-line span.text{
	color:#e2dfdf;
	font-family:"Droid Arabic Kufi", "Tahoma";
	font-size:10px;
	line-height:44px;
	direction:rtl;
	display:inline-block;
	white-space:nowrap;
}