body {
	margin:0px;
	padding:0px;
}


h1{
	font-family: "Script MT Bold" Arial;
	margin:0px;
}

h3{
	background:#000000;
	color:#FFFFFF;
	width:100%;
	height:30px;
	float:left;
	padding:8px 0 0 0px;
	margin:0px;
}

#wrapper{
	margin:0px;
	padding:0px;
	width:100%;
}

#main{
	margin:0 auto;
	padding:0px;
	width:1024px;
	border-top:#000000 25px solid;	
}

#header{
	margin:0px;
	padding:18px 0 0 0 ;
	width:974px;
	float:left;
	border-right:#000000 25px solid;
	border-left:#000000 25px solid;
}

#content{
	margin:0px;
	padding:10px 0 0 0px;
	width:974px;
	float:left;
	border-right:#000000 25px solid;
	border-left:#000000 25px solid;
}

#footer{
	margin:0px;
	padding:0px 2%;
	width:96%;
	height:25px;
	background:#000000;
	text-align:right;
	color:#FFFFFF;
	float:left;
}

#left_panel{
	margin:0px;
	padding:0px;
	width:210px;	
	float:left;
}

#right_panel{
	margin:0px 0 0 9px;
	padding:0px;
	width:755px;	
	float:left;
}

/*Head*/

#hadith{
	width:400px;
	color:#000000;
	float:left;
	margin:0 30px 0 50px;
}

#subscribe{
	width:100%;
	margin:0px 0px 10px 0px;
	float:left;
}

/*Classes*/

.logo{
	margin:0px 80px 0 30px;
	float:left;	
}

.top_menu, .top_menu ul{
	margin:0px;
	padding:0px;
	width:130px;
	float:left;
	list-style-type:none;	
}

.top_menu ul li{
	margin:0px;
	padding:0px;
	width:100%;
	float:left;
	width:130px;
}

.top_menu a:link{
	color:#000000;
	text-decoration:none;
}

.head_input{
	border:0px;
	width:180px;
	height:25px;
	float:left;
	padding:2px;
	background-color:#CCCCCC;
	color:#FFFFFF;
}



/*Drop Down Menus*/
.main_menu 
{
	margin:10px 0 0 0px;
	padding:0px;
	width:100%;
	float:left;
	list-style-type:none;
	border-top:#b1b1b1 1px solid;
}

.main_menu  a
{
	display:block;
	color:#000000;
	text-decoration:none;	
	padding:8px 48px;
	float:left;
	border-left:#b1b1b1 1px solid;
}

.main_menu li
{
	position:relative;
	float:left;
	margin:0;
	padding:0
}

.main_menu li.current-menu-item
{
	background:#ddd
}

.main_menu  li a:hover, .main_menu ul li a:hover
{
	background:#525252;
	color:#FFFFFF;
}

.main_menu  ul
{
	display:none;
	position:absolute;
	top:100%;
	left:0;
	background:#fff;
	padding:0;
	z-index: 1;
	margin-top:0px;
	width:100%;
}

.main_menu  ul li
{
	float:left;
	width:100%;
	border-bottom:1px solid #333;
}

.main_menu  ul a
{
	padding:10px 5%;
	width:90%;
}

.main_menu  ul ul
{
	top:0;
	left:100%
}

.main_menu  li:hover > ul
{
	display:block
}


/*Content*/

.news, .news ul{
	margin:0px 0 10px 0;
	padding:6px 0px;
	width:100%;
	float:left;


	list-style-type:none;
	background:#E3E1E1;	
}

.news li{
	margin:0px;
	padding:5px 5px 10px 5px !important;
	width:95%;
	float:left;
	
	border-bottom:#b1b1b1 1px solid;
	
}

.news a:link{
	color:#000000;
	text-decoration:none;
	margin:20px 5px;
	/*border-bottom:#b1b1b1 1px solid;	*/
}

.subs_input{
	border:0px;
	width:97%;
	height:20px;
	float:left;
	padding:1.7%;
	background-color:#CCCCCC;
	color:#FFFFFF;
}

.subs_btn{
	border:0px;
	width:100%;
	height:30px;
	float:left;
	background-color:#4C4B4B;
	color:#FFFFFF;
	font-weight:bold;
	text-align:center;
}

.article, .article ul{
	margin:0px 0 10px 0;
	padding:6px 0px;
	float:left;
	height:100px;
	overflow:hidden;
	list-style-type:none;
	border:#b1b1b1 1px solid;
	width:208px
}

.article ul li{
	margin:0px;
	padding:5px;
	width:100%;
	float:left;
	width:100%;}

.article a:link{
	color:#000000;
	text-decoration:none;
	float:left;
	margin:5px 4px;
	border-bottom:#b1b1b1 1px dashed;	
}

.time_div{
	border-bottom:#b1b1b1 1px dashed;
	margin:0px;
}

.time_div select{
	color:#FFFFFF;
	width:150px;
	height:25px;
	margin-left:10px;
	background:url(../images/arrow.png) #000000 133px 7px  no-repeat;
}

.time_div select option{
	color:#000;
	background:#fff;
}

.time, .time ul{
	margin:0px;
	padding: 0px;
	float:left;
	width:100%;
	list-style-type:none;
}

.time li{
	margin:0px;
	padding:8px 0 0 4%;
	width:16%;
	float:left;
}

.time .waqt {
		
}

.time .mint {
	font-size:30px !important;
	margin:8px 0 0 -10px;		
}


/***************** tab pane styling start *****************/
.panes div {
    display:none;
    padding:15px 10px;
    border:3px solid #000;
    border-top:0;
    height:100px;
	width:95.6%;
    font-size:14px;
	background-color:#CDCBCB;
}


/* root element for tabs  */
ul.tabs {
    list-style:none;
    margin:0 !important;
    padding:0;
    border-bottom:1px solid #666;
    height:30px;
	width:99%;
}

/* single tab */
ul.tabs li {
    float:left;
    text-indent:0;
    padding:0;
	width:30%;
    /*margin:0 !important;*/
	margin-right:3%;
    list-style-image:none !important;
	background-color:#000000;
}

/* link inside the tab. uses a background image */
ul.tabs li a {
    font-size:11px;
    display:block;
    height: 30px;
    line-height:30px;
    text-align:center;
    text-decoration:none;
    color:#fff;
    padding:0px;
    margin:0px;
    position:relative;
}

ul.tabs li a:active {
    outline:none;
	border:1px solid #000;
	background:#FFFFFF;
	color:#000000;
}

/* when mouse enters the tab move the background image */
ul.tabs li a:hover {
    background-position: -420px -31px;
    color:#000;
	background:#FFFFFF;
	border:1px solid #000;
	height: 29px;
    line-height:29px;
}

/* active tab uses a class name "current". its highlight is also done by moving the background image. */
ul.tabs li a.current, ul.tabs li a.current:hover, ul.tabs li.current a {
    background-position: -420px -62px;
    cursor:default !important;
}

/* Different widths for tabs: use a class name: w1, w2, w3 or w2 */


/* width 1 */
ul.tabs a.s { background-position: -553px 0; width:81px; }
ul.tabs a.s:hover { background-position: -553px -31px; }
ul.tabs a.s.current  { background-position: -553px -62px; }

/* width 2 */
ul.tabs a.l { background-position: -248px -0px; width:174px; }
ul.tabs a.l:hover { background-position: -248px -31px; }
ul.tabs a.l.current { background-position: -248px -62px; }


/* width 3 */
ul.tabs a.xl { background-position: 0 -0px; width:248px; }
ul.tabs a.xl:hover { background-position: 0 -31px; }
ul.tabs a.xl.current { background-position: 0 -62px; }


/* initially all panes are hidden */
.panes .pane {
    display:none;
}

/***************** tab pane styling end *****************/

/***************** Footer Scroll starts *****************/

/*
  root element for the scrollable.
  when scrolling occurs this element stays still.
  */
.scrollable {

    /* required settings */
    position:relative;
    overflow:hidden;
    width: 892px;
    height:120px;

    /* custom decorations */
    border:1px solid #ccc;
}

/*
   root element for scrollable items. Must be absolutely positioned
   and it should have a extremely large width to accomodate scrollable
   items.  it's enough that you set the width and height for the root
   element and not for this element.
*/
.scrollable .items {
    /* this cannot be too large */
    width:20000em;
    position:absolute;
    clear:both;
}

.items div {
    float:left;
    width:910px;
}

/* single scrollable item */
.scrollable img {
    float:left;
    margin:20px 5px 20px 15px;
    background-color:#fff;
    padding:2px;
    border:1px solid #ccc;
    width:100px;
    height:75px;

    -moz-border-radius:4px;
    -webkit-border-radius:4px;
}

/* active item */
.scrollable .active {
    border:2px solid #000;
    position:relative;
    cursor:default;
}

/* this makes it possible to add next button beside scrollable */
.scrollable {
    float:left;
}

/* prev, next, prevPage and nextPage buttons */
a.browse {
    background:url(../images/hori_large.png) no-repeat;
    display:block;
    width:30px;
    height:30px;
    float:left;
    margin:40px 10px;
    cursor:pointer;
    font-size:1px;
}

/* right */
a.right { background-position: 0 -30px; clear:right; margin-right: 0px;}
a.right:hover { background-position:-30px -30px; }
a.right:active { background-position:-60px -30px; }


/* left */
a.left { margin-left: 0px; }
a.left:hover  { background-position:-30px 0; }
a.left:active { background-position:-60px 0; }

/* up and down */
a.up, a.down  {
    float: none;
    margin: 10px 50px;
}

/* up */
a.up:hover { background-position:-30px 0; }
a.up:active { background-position:-60px 0; }

/* down */
a.down { background-position: 0 -30px; }
a.down:hover { background-position:-30px -30px; }
a.down:active { background-position:-60px -30px; }


/* disabled navigational button */
a.disabled {
    visibility:hidden !important;
}
/***************** Footer Scroll end *****************/

/*Slider*/

.bannner {
	width:100%;
	float:left;
}

#slider							{ background: white url(../images/slider-bg.jpg); height:290px; overflow: hidden;
								   margin: 10px 0; }
								  
                                /* DEFAULT is for three panels in width, adjust as needed
                                   This only matters if JS is OFF, otherwise JS sets this. */								  
#mover							{ width: 2880px; position: relative; }

.slide							{ padding: 0px; width: 975px; float: left; position: relative; }
.slide h1						{ font-family: Helvetica, Sans-Serif; font-size: 28px; letter-spacing: -1px; /*position: absolute; top: 30px; width:350px;*/ color: #000; font-weight:lighter; }
#text							{ position: absolute; right: 1px; top: 0px; background-color: #FFEA97; width: 294px; height:290px; padding: 35px 20px 0 20px;}
								  
.slide p						{ color: #254668; /*position: absolute; font-size: 20px; padding:5% 10px 5px 10px; height:100px; line-height: 22px; width: 300px; top: 30px;*/  }
.slide img						{ /*position: absolute; top: 50px; left: 400px;*/ }
#slider-stopper					{ position: absolute; top: 1px; right: 20px; background: #ac0000; color: white;
								  padding: 3px 8px; font-size: 10px; text-transform: uppercase; z-index: 1000; }