html{
    overflow:auto; /*--Hide Disabled Internet Explorer Vertical Scrollbar IE7 hack------*/
}

#wrapper {
    margin: 0 auto;
    width: 1000px;
	background-color:#FFFFFF;
	border: 1px solid #ccc;}

body {
	font-family:Arial, sans-serif;
	color:#000;
	margin:0;
	padding:0;
	
	background-color: #dddddd; /* Fallback background color for non supported browsers */
    background:-moz-linear-gradient(top, #ffffff, #dddddd) no-repeat #dddddd;
    background:-webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#dddddd)) no-repeat #dddddd;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffff,endColorstr=#dddddd);    /* IE6�IE9 */
	height: 100%;
}


h1 {
font-family:Verdana,Arial,sans-serif;
font-size:120%;
color:#334d55;
margin:0;
padding:0;
}

h2 {
font-family:Arial,sans-serif;
font-size:114%;
color:#069;
margin:0;
padding:0;
}

h3 {
font-family:Arial,sans-serif;
font-size:100%;
color:#334d55;
margin:0;
padding:0;
}

h4 {
font-family:Arial,sans-serif;
font-size:100%;
font-weight:400;
color:#333;
margin:0;
padding:0;
}

h5 {
font-family:Verdana,Arial,sans-serif;
font-size:100%;
color:#334d55;
margin:0;
padding:0;
}

ul {
list-style-type:square;
}

ul ul {
list-style-type:disc;
}

ul ul ul {
list-style-type:none;
}
img
{  border-style: none;
}

/*----------------Welcome to Janathi Message Text----------------*/
#welcome {
margin-left:8px;
padding-top:10px;
margin-bottom:3px;
margin-right:40px;
height:44px;
float:left;
}
.style3 {
font-size:32px;
font-family: Impact, Charcoal, sans-serif;
letter-spacing: 3.2px;



}
.style4 {
color:#093;
}
/*--------------------------------*/

#Logo {
	z-index: 2;
	position:absolute;
	left:830px;
	top:-49px;
	width:109px;
	height:110px;
	background-image:url(../Images/Logo.jpg);
	visibility: visible;
}
/*--------------------------------*/

#masthead {
position:relative;
border-bottom:1px solid #ccc;
width:1000px;
padding:0;
clear:left;

}
#siteName {
margin:0;
padding:0 0 0 10px;
}

#pageName {
font-size:160%;
font-weight:700;
margin:0;
padding:0 0 0 10px;
clear:left;

}
/*----------------globalNav (main navigation bar)----------------*/
#globalNav {


padding:0 0 2px 0;
width:100%;
}

/*----------------globalNav (Button Bar)----------------*/

#globalNav a{
	color: #6e6e6e;}
a.button {
    
    font: bold 13px Helvetica, Arial, sans-serif;
    text-decoration: none;
    padding: 6px 10px;
    position: relative;
    display: inline-block;
    text-shadow: 0 1px 0 #fff;
    -webkit-transition: border-color .218s;
    -moz-transition: border .218s;
    -o-transition: border-color .218s;
    transition: border-color .218s;
    background: #f3f3f3;
    background: -webkit-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
    background: -moz-linear-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
    border: solid 1px #dcdcdc;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    margin-right: 10px;
}
#globalNav a.button:hover {
    color: #333;
    border-color: #999;
    -moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2) -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}
#globalNav a.button:active {
    color: #000;
    border-color: #444;
}

#globalNav a.left {
    -webkit-border-top-right-radius: 0;
    -moz-border-radius-topright: 0;
    border-top-right-radius: 0;
    -webkit-border-bottom-right-radius: 0;
    -moz-border-radius-bottomright: 0;
    border-bottom-right-radius: 0;
    margin: 0;
	
}
#globalNav a.middle {
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-left: solid 1px #f3f3f3;
    margin: 0;
    border-left: solid 1px rgba(255, 255, 255, 0);
}
#globalNav a.middle:hover,
#globalNav a.right:hover { border-left: solid 1px #999 }
#globalNav a.right {
    -webkit-border-top-left-radius: 0;
    -moz-border-radius-topleft: 0;
    border-top-left-radius: 0;
    -webkit-border-bottom-left-radius: 0;
    -moz-border-radius-bottomleft: 0;
    border-bottom-left-radius: 0;
    border-left: solid 1px #f3f3f3;
    border-left: solid 1px rgba(255, 255, 255, 0);
}


/*----------------navBar (left navigation bar)----------------*/
#navBar ul {
list-style:none;
margin:0;
padding:0;
}

#navBar {
float:left;

width:180px;
background-color:#f3f3f3;
border-right:1px solid #ccc;
margin:0;
padding:0;
}

#navBar li {
border-bottom:1px solid #EEE;
}

html>body #navBar li {
border-bottom:none;
}
/*----------------sectionLinks (left navigation bar)----------------*/
#sectionLinks {
position:relative;
border-bottom:1px solid #ccc;
font-size:90%;
top:1px;
margin:0;
padding:0;
}

#sectionLinks h3 {
padding:10px 0 2px 10px;
}

#sectionLinks a {
display:block;
border-top:1px solid #ccc;
padding:2px 0 2px 10px;
}
#sectionLinks strong{
	padding:2px 0 2px 10px;}
#sectionLinks a:hover {
background-color:#ddd;
text-decoration:none;

}

/*----------------headlines (links to Sunni Sites)----------------*/
#headlines {
float:right;
 
width:200px;
border-left:1px solid #ccc;

font-size:80%;
padding:0 0 0 10px;
}
#headlines a:hover{
	text-decoration:underline;
	color:#093;}
	
#headlines p {padding-top:10px;}
#headlines h3 {padding-top:10px;}
/*----------------Main Contents)----------------*/
#content {
float:left;
width:600px;
}

.feature {
	font-size:16px;
	font-weight:400;
	padding:0 0 10px 10px;
}

.feature h3 {
text-align:center;
padding:30px 0 5px;
}

/*----------------siteInfo (footer)----------------*/
#siteInfo {
clear:both;
zoom:1; /*--Double padding in IE7 hack------*/
border-top:1px solid #ccc;
font-size:75%;
color:#ccc;
padding:10px;

}
/*----------------Home Page----------------*/

#left_content{
width:520px;
height:auto;
margin:10px 30px 10px 50px;
}

#left_content p{
text-align:justify;
line-height:16px;
padding:5px 0;
font-size:14px;
margin:0;
}

#services ul {
        list-style-type: none;
        width: 520px;
        margin: 0;
        padding:0;
	} 

#services ul li {
        font-size:14px;
        margin: 0;
        padding:0;
	text-align:justify;
	
}

#services li a { 
        display: block;
       padding:5px;
        text-decoration: none;
}
 * html #services li a {  /* make hover effect work in IE */
	width: 520px;
}
#services li a:hover {
        background:#FF9
}
services.span{
color:#FF9900;
}
#services a span {
         color:#000;
		 font-size:14px;
		 line-height:16px;  
}

#services strong{
	color:#093;
	font-weight: bolder;}
img.left_img{
float:left;
margin:0 12px 0 0;
}
	
#cols{
width:520px;
height:auto;
margin:0 30px 0 50px;
}
#latest{
width:210px;
float:left;
height:auto;
margin-top:5px;
margin-bottom:5px;
}

#latest li, #basics li, #popular li {
	
	padding: 0;
	list-style: none;
	line-height: normal;
	text-align:left;
	font-size:12px;
}
#latest h3, #basics h3, #popular h3 {
padding:0 0 3px;
        font-size:15px;	
        color:#900;
	text-align:left;}
#latest a, #basics a, #popular a {
	text-decoration:none;
	}
#latest a:hover, #basics a:hover, #popular a:hover {
	text-decoration:underline;
	color:#093;
}
#latest ul, #basics ul, #popular ul {
	margin: 0;
    padding:0;}

#basics{
width:130px;
float:left;
height:auto;
padding-left:10px;
margin-top:5px;
margin-left:10px;
margin-bottom:5px;
}
#popular{
width:120px;
float:left;
height:auto;
padding-left:20px;
margin-left:20px;
margin-top:5px;
margin-bottom:5px;
}
/*----------------Daily Hadith----------------*/

.hadithtitle {
color:#069;
font-size:14px;
font-weight:700;
font-family:Geneva, Arial, Helvetica, sans-serif;
text-align:center;}

#dailyhadith{
width:520px;
height:auto;
margin:10px 30px 10px 50px;
}
#thesayings {
border:#999 medium solid;
background-color:#CCC;
padding-top:3px;
width:510px;
text-align:center;
-moz-border-radius:5px;
-webkit-border-radius:5px;}

#hadithquote {
background-color:#FFF;
padding-top:2px;
padding-bottom:2px;
margin-top:2px;
color:#093;
font-size:12px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-weight:700;

}

/*----------------Site Search----------------*/
#searchContainer {
    margin-top:16px;
	float:left;
	}
form#searchsite {
margin: 0; 
padding: 0;

} 
/* Style the search input field. */
#query {
    float:left; 
    width:205px; 
    height:23px; 
    line-height:22px;
    text-indent:5px; 
    font-family:arial, sans-serif; 
    font-size:0.75em; 
    color:#333; 
    background: #fff; 
    border:solid 1px #d9d9d9; 
  }

/* Settings of line-height, font-size, text-indent used to hide submit value in IE */
#searchsubmit {
    cursor:pointer; 
    width:40px; 
	margin-left:7px;
    height: 27px; 
    line-height:0; 
    font-size:0; 
    text-indent:-999px;
    color: transparent;  
    background: url(../Images/ico-search1.png) no-repeat #093 center; 
    border: 1px solid #093; 
    -moz-border-radius: 2px; 
    -webkit-border-radius: 2px; 
}
/* Style the search button hover state */
#searchsubmit:hover {
    background: url(../Images/ico-search.png) no-repeat center #093; 
    border: 1px solid #000;
}
/* Clear floats */
.fclear {clear:both}

/*----------------Ask The Imam----------------*/	
.categoryname{font-size: 11px;
color: #093;

} 
.atifont{font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:13px;}

.questionnum {
	font-size: 14px;
}
.qanswer {
	font-family: Arial, Helvetica, sans-serif;
	color: #000;
	font-size: 14px;
}
.question {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #00659C;
	font-size: 14px;
}
.atibutton{
   padding:0 .25em 0 .25em;
   width:auto;
   overflow:visible;
}
.askimamsearch{
	padding:5px 0 5px 8px;}
/*----------------Ask The Imam Form----------------*/	
#askimamform{
	margin-top:10px;
	padding-left:10px;}
 
#askimamform label{
float: left;
width: 120px;
font-weight: bold;
font-size:14px;
}

.inputbox{
width: 180px;
margin-bottom: 5px;
padding:2px;
border: 1px solid #000;
}


#askimamform textarea{
width: 380px;
height: 270px;
margin-bottom: 5px;
border: 1px solid #000;
}

#askimamform #submitbutton{
margin-left: 120px;
margin-top: 2px;
width: 90px;
}

#askimamform br{
clear: left;
}
/*----------------others----------------*/


.style1 {
font-size:large;
}

.style2 {
font-size:xx-large;
}
.style5 {
	font-size: 160%;
	font-weight: bold;
}

a,a:link,a:visited {
color:#069;
text-decoration:none;
}

#style10,.style10 {
font-size:14px;
}

#globalNav img,.show,#navBar ul a:link,#navBar ul a:visited,.relatedLinks a:link,.relatedLinks a:visited {
display:block;
}

/*----------------Quiz----------------*/
#quiz{
	}
.qbox {
/*	border-bottom: double 4px #666;*/
	margin-bottom: 10px;
	padding-bottom: 5px;
	font-family:Verdana, Geneva, sans-serif;
	
	font-size:14px;
	}
.qbox h4{
	font-weight:bold;
}
.intro{	
	margin-bottom:10px;
}
code { 
	overflow: auto; 
	width: 75%; 
	border: 1px solid #666; 
	padding: 10px;
	margin: 5px 0;
	display: block;
}
.key {
	margin: 5px 0;
	padding: 10px;
	border: 1px outset #666;
	background-color: #fafafa;
}
.correct {
	color: green;
	font-weight: bold;
}
.wrong { 
	color: red;
}
.your_choice {
	border-bottom: dashed 2px #666;
}
.feedbackForm {
	border-right: solid 3px #ccc;
	border-bottom: solid 3px #eee;
	border-top: none;
	border-left: none;
	width:500px;
	float: left;
}
.feedback {
	width: 5em;
	float: left;
	text-align: right;
	margin: 0 1em 10px 0;
	clear: both
}

.summary {
	width: 560px;
	border: solid green 2px;
	margin-bottom:10px;
	margin-top:10px;
	padding: 10px;
}
/* ------------------------Tabs----------------------- */

.articletabs{
list-style: none;
    margin: 0;
    padding: 0;}

.articletabs li{
  float: left;
  margin-left: -1px;
}

.articletabs li a{

     display: block;
    float: left;
    height: 2em;
     text-decoration: none;
	padding:5px;
  background: #eee;
  
  border-bottom: 1px solid #ccc ;
  border-left: 1px solid #ccc ;
  border-right: 1px solid #ccc ;
 
}

.articletabs li a:visited{
color: #2d2b2b;
}

.articletabs li a:hover{
text-decoration: underline;

color: #093;
}

.articletabs li a.selected{ /*selected main tab style */
background-color: white;
border-bottom-color: white;
color:#093;
font-weight:bold;
}

.articletabs li a.selected:hover{ /*selected main tab style */
text-decoration: none;
}

.tabcontent{
display:none;
clear: both;
 padding: 5px 1px 2px 5px;
}

.tabcontent1{
display:none;
clear: both;
 padding: 0 5px 2px 5px;
 text-align:justify;
 font-family: Century Gothic, sans-serif;
}


#headlines ul
{
list-style-type: none;
padding: 0;
margin-left: 0em;
}
#headlines li
{line-height:24px;
font-size:94%;
}

@media print {
.tabcontent {
display:block !important;

}
}
@media print {
.tabcontent1 {
display:block !important;

}
}

/*------------------------------------*\
	IPHONE
\*------------------------------------*/
@media screen and (max-device-width: 480px){

body{
  -webkit-text-size-adjust:none;
  font-family:Helvetica, Arial, Verdana, sans-serif;
  
}
@font-face {
    font-family: 'ImpactRegular';
	src: url('fonts/impact-webfont.eot');
    src: url('fonts/impact-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/impact-webfont.woff') format('woff'),
         url('fonts/impact-webfont.ttf') format('truetype'),
         url('fonts/impact-webfont.svg#ImpactRegular') format('svg');
   }
.style3 {
font-size:32px;
font-family: 'ImpactRegular', Charcoal, sans-serif;
letter-spacing: 3.2px;
}
}

/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
body{
  -webkit-text-size-adjust:none;
  font-family:Helvetica, Arial, Verdana, sans-serif;
  
}
@font-face {
    font-family: 'ImpactRegular';
	src: url('fonts/impact-webfont.eot');
    src: url('fonts/impact-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/impact-webfont.woff') format('woff'),
         url('fonts/impact-webfont.ttf') format('truetype'),
         url('fonts/impact-webfont.svg#ImpactRegular') format('svg');
   }
.style3 {
font-size:32px;
font-family: 'ImpactRegular', Charcoal, sans-serif;
letter-spacing: 3.2px;
}
}