@charset "utf-8";
/* CSS Document */


select,button,input{
	font-family:Tahoma;
	font-size:11px;
	vertical-align:middle;
	background-color:white;
	}
label{
	display:inline-block;
	vertical-align:middle;
	}
input[type=checkbox],input[type=radio]{
	margin:0 6px 0 12px;
	height:13px;
	}
.floatStart{
	float:left;
	}
.floatEnd{
	float:left;
	}

.icon-btn{
	width:16px;
	height:16px;
	border:0;
	cursor:pointer;
	vertical-align:middle;
	}

.button:hover{
	border-color:#7D98B8;
	cursor:pointer;
	-moz-box-shadow:0 1px 1px rgba(0,0,0,0.1);
	}

#player-pad{
	display:none;
	}
#player-loading div{
	background:none;
	border:none;
	height:21px;
	text-align:center;
	}

.sub-menu{
	font-family:Tahoma,Arial;
	font-size:11px;
	color:#555;
	background:#FcFcFc;
	margin:16px 3px 0px;
	width:184px;
	overflow:visible;
	text-align:left;
	text-shadow:0 1px 0 #fff;
	box-shadow:0px 1px 1px #eee;
	-moz-box-shadow:0px 1px 1px #eee;
	-webkit-box-shadow:0 1px 1px #eee;
	}


.menu-setting-icon{
		width:20px;
		margin-top: -36px;
	}
.menu-row{
	padding:2px 0 2px 7px;
	margin:0;
	position:relative;
	}


.vspace{
	display:block;
	height:5px;
	}
#searchText,#gotoText{
	width:132px;
	padding:3px;
	direction:rtl;
	}
#gotoText{
	direction:ltr;
	}



 .icon{
	width:16px;
	height:16px;
	display:inline-block;
	cursor:pointer;
	}

#charList{color:gray;direction:rtl;text-align:center;border-top:1px solid #eee;border-bottom:1px solid #eee;margin:5px 7px;background:#f6f6fa;padding:2px 3px;cursor:pointer;}
#charList a{color:#77b;line-height:1.5em;font-family:Tahoma;font-size: 11px; position:relative;}
#charList a:hover{background:#ddf;color:blue;}
.current-char{background:#ddf;color:green;}

.trans-row .icon{
	margin-left:-3px;
	display:none;
	background-position:-32px -16px;
	}
.trans-row .icon.active{
	background-position:-48px 0px;
	}
.reciter select.reciteMenu{
	width:110px;
	}
.reciter select.repeatMenu{
	display:none;
	width:45px;
	}
.repeatCount{
	display:inline-block;
	cursor:pointer;
	width:15px;
	text-align:center;
	margin-right: 10px;
	}
.edit select.reciteMenu{
	width:120px;
	}
.edit select.repeatMenu{
	display:inline-block;
	}
.edit .repeatCount{
	display:none;
	}
.reciter .icon-close{
	margin: 0 10px;
	width: 18px;
	height: 18px;
	}
.icon-setting{
	background-position:-64px -16px;
	width: 20px;
	height: 20px;
	cursor: pointer;
	}
.icon-setting:hover{
	background-position:-64px 0;

	}
.icon-close{
	background-position:-96px -16px;
	}
.icon-close:hover{
	background-position:-96px 0;
	}

.sound-options{
	display:none;
	background:#f4f4f5;
	padding:8px 0 5px;
	border-bottom:1px solid #ddd;
	}
#search-tab{
	width:500px;
	margin:25px 32px 100px;
	}
.searchHeader{
	font-family:Arial;
	font-weight:normal;
	font-size:14px;
	padding:5px 3px;
	color:#333;
	}
.searchOffset{
	font-family:Arial;
	font-size:12px;
	line-height:1.1em;
	width:15px;
	height:1em;
	padding:0px;
	text-align:center;
	}
.searchFrame{
	font-size:16px;
	border:4px solid #D4DDCC;
	background:#F5FFEB;
	max-height:450px;
	overflow:auto;
	direction:ltr;
	}
.searchResults{
	font-family:"Traditional Arabic","Times New Roman";
	direction:rtl;
	line-height:1.5em;
	padding:0px;
	}
.result{
	cursor:pointer;
	border-bottom:1px solid #D4DDCC;
	}
.result div{
	padding:5px 10px;
	}
.result div:hover{
	background:#E4EEDC;
	}
.result .row-0{
	background:#F5FFEB;
	}
.result .row-1{
	background:#EEF8E5;
	}
.searchResults .spec,.searchResults .number{
	font-family:"Traditional Arabic","Times New Roman";
	font-size:18px;
	white-space:nowrap;
	color:green;
	}
.searchResults .highlight{
	color:blue;
	font-weight:bold;
	font-size:95%;
	}
#searchPattern{
	font-family:Tahoma,"Traditional Arabic";
	direction:rtl;
	background:#f3f3ff;
	}

#about,#resources{
	padding:10px;
	}
.tip{
	z-index:1000;
	}
.tip-wrapper{
	border:1px solid #999;
	font-family:Tahoma,Arial;
	font-size:12px;
	color:#454545;
	}
.tip-title{
	background-color:#e1e1e1;
	padding:2px 4px;
	font-weight:bold;
	}
.tip-content{
	background-color:#fff;
	padding:2px 4px;
	}
a.tip-close,a.tbox-close{
	color:#999;
	display:inline-block;
	float:right;
	font-size:12px;
	text-decoration:none;
	font-family:arial,helvetica,tahoma,verdana,sans-serif}
a.tip-close:hover,a.tbox-close:hover{
	text-decoration:underline;
	}
.tip-shadow{
	background-color:#e4e4e4;
	background-color:rgba(200,200,200,0.6);
	}
.tip-shadow2{
	box-shadow:3px 3px 4px #aaa;
	-moz-box-shadow:3px 3px 4px #aaa;
	-webkit-box-shadow:3px 3px 4px #aaa;
	}
.transTip .tip-wrapper{
	border:2px solid #8cb;
	font-size:13px;
	}
.transTip .tip-title{
	background-color:#e2f2e8;
	color:#333;
	padding:7px 10px;
	font-weight:bold;
	font-family:Tahoma,Arial;
	font-size:12px;
	}
.transTip .tip-content{
	background-color:#fff;
	color:#404040;
	padding:7px 10px 10px;
	}
.tbox{
	z-index:100;
	display:none;
	position:absolute;
	padding-right:10px;
	}
.tbox-wrapper{
	width:250px;
	background-color:#fff;
	font-family:Tahoma,Arial;
	font-size:13px;
	}
.tbox-wrapper{
	position:relative;
	border:3px solid #B7D8B1;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	}
.tbox-title{
	background-color:#E4EEDC;
	padding:8px 7px;
	font-weight:bold;
	color:#333;
	font-size:12px;
	}
.tbox-content{
	background-color:#fff;
	padding:7px 7px 9px;
	color:#404040;
	}
.tbox-title,.tip-title{
	direction:ltr;
	text-align:left;
	}
.tbox-title.rtl,.tip-title.rtl{
	text-align:right;
	}
.rtl a.tbox-close,.rtl a.tip-close{
	float:left;
	}
.console{
	z-index:1000;
	position:absolute;
	top:0;
	left:0;
	width:250px;
	background:white;
	}
.modal .tbox,.modal .tip,.modal .qtip{
	visibility:hidden;
	}

.font-tester{
	position:absolute;
	left:-10000px;
	font-size:19px;
	display:none;
	}
#loadingImage{
	position:absolute;
	right:5px;
	top:5px;
	}
#jplayer-box{
	hieght:0;
	width:0;
	}
#loading-font{
	display:none;
	padding:3px 9px 0 0;
	}
.ui-tab{
	margin:0;
	padding:.2em .2em 0;
	}
.ui-tab li{
	list-style:none;
	float:right;
	position:relative;
	
	margin:0 .2em 1px 0;
	border-bottom:0 !important;
	padding:0;
	white-space:nowrap;
	}
.ui-tab a{
	float:left;
	padding:.5em 1em;
	text-decoration:none;
	cursor:pointer;
	}
.ui-tab .selected{
	margin-bottom:0;
	
	}
.ui-tab .selected a{
	cursor:text;
	}
.ui-tab a:active{
	outline:none;
	}
#menu-tab ul{
	background:#EBEEF3;
	border:1px solid #CCCCCC;
	border-top:0px;
	padding:4px 2px 0;
	}
#menu-tab li{
	background:#FCFCFC;
	border:1px solid #CCCCCC;
	margin:0 0 0 2px;
	}
#menu-tab a{
	background:#ECEFF0;
	padding:1px 4px 2px;
	font-family:Verdana;
	font-size:9px;
	color:#999;
	}
#menu-tab a:hover{
	background:#FBFBFB;
	color:blue;
	}
#menu-tab .selected a,#menu-tab .selected a:hover{
	background:#FCFCFC;
	color:#4682b4;
	}
#page-tab{
	position:relative;
	}
#page-tab ul{
	
padding: 0;
background: #E4EEDC;
border-bottom: 1px solid #CCCCCC;
padding-top: 5px;
height: 27px;
	}
#page-tab li{
	
	
margin-left: 10px;
zoom: 1;
background: #eee;
border: solid 1px #ccc;
border-bottom: none;
float: right;
	}
#page-tab a{
	
	font-size: 13px;
line-height: 2em;
display: block;
padding: 0 10px;
outline: none;
color: #777;
	}
#page-tab a:hover{
	background:#FBFBFB;
	color:#4682b4;
	}
#page-tab .selected a,#page-tab .selected a:hover{
	background:white;
	padding-top: 1px;
	}
.ui-helper-clearfix:after{
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
	}
.ui-helper-clearfix{
	display:inline-block;
	}
* html .ui-helper-clearfix{
	height:1%;
	}
.ui-helper-clearfix{
	display:block;
	}
.ui-hidden{
	display:none;
	}
.no-hover:hover{
	background-color:white;
	}
.top-ad{
	display:none;
	position:relative;
	font-family:"lucida grande",tahoma,arial;
	font-size:12px;
	background-color:#FFF9D7;
	border:1px solid #E2C822;
	padding:8px;
	color:#222;
	margin:16px 32px -4px;
	}
.quran{
	width:500px;
	margin:4px 32px;
	padding-top:20px;
	direction:ltr;
	font-family:"Times New Roman";
	}
.qFrameTop{
	background:#F7FCE3 url(../images/frame.png) no-repeat;
	height:23px;
	}
.qFrameMiddle{
	background:#F7FCE3 url(../images/frame.png) repeat-y -500px 0;
	line-height:2.35em;
	font-family:"Traditional Arabic",Scheherazade,"Times New Roman";
	}
.qFrameBottom{
	background:#F7FCE3 url(../images/frame.png) no-repeat 0 bottom;
	height:23px;
	}
.suraHeaderFrame{
	background:url(../images/download.png) no-repeat center center;
	margin:3px 0px 7px;
	}
.suraHeaderText{
	font-family:"Times New Roman";
	font-weight:bold;
	font-size:16px;
	text-align:center;
	line-height:49px;
	width:412px;
	}
.quranPageHeader,.quranPageFooter{
	direction:ltr;
	text-align:center;
	font-family:"Times New Roman";
	font-weight:bold;
	font-size:16px;
	padding:5px;
	color:#333;
	}
.quranText{
	line-height: 50px;
text-align: justify;
font-family: Traditional Arabic;
font-weight: normal;
direction: rtl;
text-align: right;
width: 412px;
margin: 0px 30px;
padding: 16px 14px;
color: black;
	}
.aya{
	background-color:#F7FCE3;
	}
.aya.hover{
	background-color:#E4EEDC;
	}
.aya.selected,.aya.highlight{
	background-color:#C4ECBD;
	}
.ayaNumber{
	font-size:.85em;
	white-space:nowrap;
	color:#050;
	cursor:pointer;
	}
.ayaNumber a{
	color:#050;
	}
.aya.highlight .sign{
	color:black;
	}
.aya.highlight span.highlight{
	color:blue;
	}
.besm{
	text-align:center;
	}
.sign{
	font-family:"Times New Roman";
	color:#FB7600;
	font-size:0.9em;
	}
.internal-sign{
	font-family:"Times New Roman";
	color:green;
	font-size:0.65em;
	}
.juz-sign{
	width:16px;
	height:16px;
	background-position:0 -48px;
	display:inline-block;
	vertical-align:middle;
	margin-top:3px;
	}
.arrow-link{
	font-family:"Times New Roman";
	color:#AAA;
	font-size:0.9em;
	text-decoration:none;
	}
.arrow-link:hover{
	color:#666;
	text-decoration:none;
	}
.transText{
	font-family:Tahoma,Arial,"Times New Roman",Sans-Serif;
	direction:rtl;
	font-size:0.8em;
	line-height:1.5em;
	text-align:justify;
	width:412px;
	margin:0px 44px;
	padding:16px 0px;
	color:black;
	}
.transText .aya.selected,.transText .aya.selected .ayaNumber{
	
	}
.transText .ayaNumber{
	font-weight:bold;
	}
.quranText .ayaNumber{
	font-family:"Traditional Arabic","Times New Roman";
	}
.jp-interface .icon{
	width:14px;
	height:16px;
	}
.icon-play{
	background-position:0px 0px;
	}
.icon-play:hover{
	background-position:0px -16px;
	}
.icon-pause{
	background-position:-16px 0px;
	}
.icon-pause:hover{
	background-position:-16px -16px;
	}
.icon-volume{
	background-position:-32px 0px;
	}
.jp-volume-toggle.mute .icon{
	background-position:-32px -16px;
	}
.jp-interface div{
	overflow:hidden;
	padding:0;
	margin:0;
	}
div.jp-interface{
	vertical-align:middle;
	margin:3px 0 0;
	position:relative;
	width:166px;
	height:19px;
	border:1px solid #bbb;
	border-color:#eee #bbb #ABABAB;
	background:#f0f0f0 url(../images/bg.png) repeat-x 0 -200px;
	direction:ltr;
	margin-right: 15px;
	}
div.jp-play-pause{
	position:absolute;
	height:16px;
	left:0;
	padding:1px;
	padding-right:4px;
	cursor:pointer;
	border-right:1px solid #ccc;
	}
div.jp-progress{
	position:absolute;
	top:6px;
	left:25px;
	width:90px;
	height:6px;
	}
div.jp-seek-bar{
	background-color:#ABACD3;
	width:0px;
	height:6px;
	cursor:pointer;
	}
div.jp-play-bar{
	background-color:#000099;
	width:0px;
	height:6px;
	}
div.jp-volume-toggle{
	position:absolute;
	height:16px;
	left:120px;
	padding:1px 0px;
	cursor:pointer;
	border-left:1px solid #ccc;
	}
div.jp-volume-mute-pad{
	display:none;
	position:absolute;
	height:18px;
	left:120px;
	width:42px;
	cursor:pointer;
	}
div.jp-volume-max{
	position:absolute;
	top:1px;
	left:160px;
	height:16px;
	width:4px;
	cursor:pointer;
	}
div.jp-volume-bar{
	position:absolute;
	top:1px;
	width:25px;
	height:16px;
	cursor:pointer;
	left:135px;
	}
div.jp-volume-bar-wrapper{
	background-color:#ccc;
	margin-top:6px;
	height:4px;
	}
div.jp-volume-bar-value{
	background-color:#01a;
	width:0px;
	height:4px;
	}