/* CSS layout Reset and usislam styles */

/* ERIC MEYER'S CSS RESET */

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
Mdel, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/*------------------------- ?????????????? Next Statement IMPORTANT   ?????????????--------------------- */

*{
	padding: 0;
	margin: 0;
	text-align: center;
}


	/*--------------------- END CSS RESET --------------------------*/

	/*--------------------- Start Styles of Usislam --------------------------*/
body {
	  	background-image: url('background5.gif');
}

div.gcse-searchbox{
margin-left:auto;
margin-right:auto;
width:320px;
}

div.Content{ 
		margin-left:auto;
		margin-right:auto;
		background-image: url('background5.gif');
		width:950px;
}
div.errors {
	  padding-top: 10px;
	  font-size: 10px;
}
/*------------------------- after close Div all--------------------- */
.clear { clear:both; display:block; overflow:hidden; visibility:hidden; height:0px;}


div.para{
		margin-left:auto;
		margin-right:auto;
		background-image: url('background5.gif');
		width:900px;
}

div.content div.left { 
	  background-image: url('islamic-border-design.png');
	  float: left;
	  padding: 5px 0;
	  width: 25px;
	  min-height: 100%;
	  }
	  
div.content div.right { 
	  background-image: url('islamic-border-design.png');
	  float:right;
	  padding: 5px 0;
	  width: 25px;
	  min-height: 100%;
	  }


										/*  menu all-left-right */
div.all {
	  width: 900px;
		margin-left:auto;
		margin-right:auto;
	  padding: 2px;
		}
						/*  The problem is the black background of Div. Left */
div.all div.left { 
	  float: left;
	  padding: 5px 0;
	  width: 250px;
	  text-align: center;
	  }

div.all div.left div.menutop { 
	  background: #0000FF;            /*--   Blue  background --*/
	  float: left;
	  padding: 5px 0;
	  width: 250px;
	  text-align: center;
	  }
	  									/* div.mosque   added */
	  
div.all div.left div.mosque {
	  background: #FFFFFF;            /*-- White   background --*/
	  float: left;
	  padding: 5px 0;
	  width: 250px;
	  text-align: center;
	  }

div.all div.right { 
	  background-image: url('background5.gif');
	  float: left;
	  padding: 5px 0;
	  width: 650px;
	  text-align: center;
	 }
/*================  used to center images and Div  ==============*/
.center {
		margin-left:auto;
		margin-right:auto;
}
										/*-- center images  --*/
.center-img
		{
		margin-left:auto;
		margin-right:auto;
	    margin-top:0px;
	    margin-bottom:0px;
	    padding:0px;
		}

/* ============floats images to right or left ============*/
.imgrgt {
	float: right;
	padding: 7px;
}
.imglft {
	float: left;
	padding: 7px;
}

				/*-- Safe Font  Verdana, Arial, Helvetica, sans-serif --*/

				/*-- colors  Black,color: #000000 ; blue, color:#0000FF; White color: #FFFFFF; Red color: #FF0000  --*/
		
		/*-- Black Text --*/
.auto-style1 
		{
	    font-family: Verdana, Arial, Helvetica, sans-serif;
	    font-size: 12px;
	    line-height: 18px;           		/*--Line spacing --*/
		font-weight: bold;
		text-align: center;
		color: #000000 ;		
		}
		/*-- dark brown Text  :#800000  --*/
		/*--  Color : #800000 is good use it for Quran  and Bible verses --*/
.auto-style2 
		{
	    font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		line-height: 18px;           		/*--Line spacing --*/
		font-weight: bold;
		text-align: center;
		color:#800000;
		}
		 /*-- Video Text blue Text  --*/
.auto-style3 {
    font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 18px;           		/*--Line spacing --*/
	text-align: center;
	color: #0000FF;
	}
	/*-- footer blue background  White Fonts--*/
.auto-style4 {					
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
	color: #FFFFFF;		
	}
	/*--  vistors --*/
.auto-style5 {

	    font-family: Verdana, Arial, Helvetica, sans-serif;
		font-weight: bold;
		text-align: center;
 		font-weight:bold;
 		font-size:18px;
		}
		/*-- Books  & main Paragraphs Text  LEFT--*/
.auto-style6 
		{
	    font-family: Verdana, Arial, Helvetica, sans-serif;
	    font-size: 12px;
	    line-height: 18px;           		/*--Line spacing --*/
		font-weight: bold;
		text-align: left;
		margin:0 0 0 5px;
		color: #000000 ;		
		}
.auto-style7 {
	border: 5px solid #800000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 21px; /*--Line spacing --*/;
	font-weight: bold;
	text-align: center;
	color: #800000;
}
		/*-- Arabic - Black Text Normal --*/
.auto-style8 
		{
	    font-family: Verdana, Arial, Helvetica, sans-serif;
	    font-size: 18px;
	    line-height: 36px;           		/*--Line spacing --*/
		font-weight: bold;
		text-align: center;
		color: #000000 ;		
		}
		/*-- RED Text  --*/
.auto-style9 {
	    font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		line-height: 18px;           		/*--Line spacing --*/
		font-weight: bold;
		text-align: center;
		color: #FF0000;
		}
		/*-- Arabic - Title Red font x-large Line spacing --*/
.auto-style10 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: x-large;
	line-height: 36px; 
	font-weight: bold;
	text-align: center;
	color: #FF0000;
}
		/*-- Red Text  --*/
.auto-style11 
		{
	    font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		line-height: 18px;           		/*--Line spacing --*/
		font-weight: bold;
		font-style:italic;
		margin-left: 10px;
		color:#0000FF;
		}

.searchgbox
		{
    width: 480px;
    padding: 10px;
    border: 1px solid gray;
    margin-left:auto;
	margin-right:auto;
	margin-top:0px;
	margin-bottom:0px;
		}

div#menu-spacer {
  height: 5px;
}
 
/* Color blue #0000FF */
         
a {
	text-decoration: none;
	color: #0000FF;
}
a:active {
	color: #FF0000;
}
a:hover {
	color: #FF6600;
}
a:visited {
	color: #990066;
}
											/* general formats */
											
/*--  Black,color: #000000 ; blue, color:#0000FF; White color: #FFFFFF; Red color: #FF0000  --*/

/*--  H1 Red color: #FF0000  For page title --*/
h1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
    text-align:center;
	font-size: 24px;
	font-weight: bold;
	color: #FF0000;
}
/*--  H2 dark brown , color:#800000 sub title --*/
h2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
    text-align:center;
	font-size: 16px;
	font-style:italic;
	line-height: 24px; /*--Line spacing --*/;
	font-weight: bold;
	color: #800000;
	}
/*--  H3 Black,color: #000000   for main aricles --*/
h3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
    text-align: left;
	font-size: 12px;
	line-height: 18px;           		/*--Line spacing --*/
	font-weight: bold;
	color: #000000;
	margin:0 0 0 5px;
}
/*--  H4  brown  color:#580000 sub sub title  --*/
h4 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
    text-align: left;
	font-size: 14px;
	line-height: 21px;           		/*--Line spacing --*/
	font-weight: bold;
	color: #580000 ;
	margin:0 0 0 5px;
}
/*--  H5 Red color: #B80000   Sub-Title--*/
h5 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
    text-align: left;
	font-size: 16px;
	line-height: 24px;           		/*--Line spacing --*/
	font-weight: bold;
	color:#B80000  ;
	margin:0 0 0 15px;
}
/*--  H6  Verses brown  color:#580000 indented italic--*/
h6 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 18px;           		/*--Line spacing --*/
	font-weight: bold;
	font-style:italic;
    color: #580000 ;
	margin:0 0 0 10px;
}
nav {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	margin-left:auto;
	margin-right:auto;
	font-size: 12px;
	line-height: 18px;           		/*--Line spacing --*/
	font-weight: bold;
	background:navy;
	width:900px;
}

nav a {
    color: white;
    background: #aaab24;
    text-decoration:underline;
}
ul li {
display: inline;
} 
.video {
	margin-left:auto;
	margin-right:auto;
	width:90%;
	display: inline;
}
  
/* ----------- ----------- ----------- Smartphones (portrait and landscape)  ---------------------- */
@media only screen 
and (min-device-width : 320px) and (max-device-width : 900px) 
{

html, body, .outer { height: 100% }
.inner { min-height: 100%; }

div.Content{ 
		margin-left:auto;
		margin-right:auto;
		background-image: url('background5.gif');
		width:90%;
		min-height: 100%;
}

div.para{
		margin-left:auto;
		margin-right:auto;
		background-image: url('background5.gif');
		width:90%;
}

div.content div.left { 
	  background-image: url('islamic-border-design.png');
	  float: left;
	  padding: 5px 0;
	  width: 25px;
	  min-height: 100%;
	  }
	  
div.content div.right { 
	  background-image: url('islamic-border-design.png');
	  float:right;
	  padding: 5px 0;
	  width: 25px;
	  min-height: 100%;
	  }


										/*  menu all-left-right */

div.all {
		width:90%;
		margin-left:auto;
		margin-right:auto;
	  padding: 2px;
		min-height: 100%;
overflow:hidden;		
		}
					/*  The problem is the black background of Div. Left */
div.all div.left { 
	  float: left;
	  padding: 5px 0;
	  width: 250px;
	  	margin-left:auto;
		margin-right:auto;
	  text-align: center;
		min-height: 100%;
	  }
div.all div.left div.menutop {
	  background: #0000FF;            /*--   Blue  background --*/
	  float: left;
	  padding: 5px 0;
	  width: 250px;
		margin-left:auto;
		margin-right:auto;
	  text-align: center;
		min-height: 100%;
	  }
	  /* div.mosque   added */
div.all div.left div.mosque {
	  background: #FFFFFF;            /*-- White   background --*/
	  float: left;
	  padding: 5px 0;
	  width: 250px;
		margin-left:auto;
		margin-right:auto;
	  text-align: center;
		min-height: 100%;
	  }
  
div.all div.right { 
	  background-image: url('background5.gif');
	  float: left;
	  padding: 5px 0;
		width:90%;
	  text-align: center;
		min-height: 100%;
	 overflow:hidden;	
	 }
	
nav {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	margin-left:auto;
	margin-right:auto;
	font-size: 12px;
	line-height: 18px;           		/*--Line spacing --*/
	font-weight: bold;
	background:navy;
		width:90%;
}
		
.footer {
		width:90%;
		margin-left:auto;
		margin-right:auto;
	  padding: 2px;
		min-height: 100%;
		}

/*-- colors  Black,color: #000000 ; blue, color:#0000FF; White color: #FFFFFF; Red color: #FF0000  --*/
		
		/*-- Black Text --*/
.auto-style1 
		{
	    font-family: Verdana, Arial, Helvetica, sans-serif;
	    font-size: 14px;
	    line-height: 18px;           		/*--Line spacing --*/
		font-weight: bold;
		text-align: center;
		color: #000000 ;		
		}
		/*-- dark brown Text  :#800000  --*/
		/*--  Color : #800000 is good use it for Quran  and Bible verses --*/
.auto-style2 
		{
	    font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 14px;
		line-height: 18px;           		/*--Line spacing --*/
		font-weight: bold;
		text-align: center;
		color:#800000;
		}
		 /*-- Video Text blue Text  --*/
		 
.auto-style3  {
    font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 18px;           		/*--Line spacing --*/
	text-align: center;
	color: #0000FF;
	}

	/*-- footer blue background  White Fonts--*/

.auto-style4 {					
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	text-align: center;
	color: #FFFFFF;		
	}
		/*-- Books  & main Paragraphs Text  LEFT--*/

.auto-style6 
		{
	    font-family: Verdana, Arial, Helvetica, sans-serif;
	    font-size: 14px;
	    line-height: 18px;           		/*--Line spacing --*/
		font-weight: bold;
		text-align: left;
		margin:0 0 0 5px;
		color: #000000 ;		
		}
		/*-- Arabic - Black Text Normal --*/
.auto-style8 
		{
	    font-family: Verdana, Arial, Helvetica, sans-serif;
	    font-size: 18px;
	    line-height: 36px;           		/*--Line spacing --*/
		font-weight: bold;
		text-align: center;
		color: #000000 ;		
		}
					/*-- RED Text  --*/
.auto-style9 {
	    font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 14px;
		line-height: 18px;           		/*--Line spacing --*/
		font-weight: bold;
		text-align: center;
		color: #FF0000;
		}
		/*-- Arabic - Title Red font x-large Line spacing --*/

.auto-style10 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: x-large;
	line-height: 36px; 
	font-weight: bold;
	text-align: center;
	color: #FF0000;
}

			/*--  H3 Black,color: #000000   for main aricles --*/
h3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
    text-align: left;
	font-size: 14px;
	line-height: 18px;           		/*--Line spacing --*/
	font-weight: bold;
	color: #000000;
	margin:0 0 0 5px;
}
			/*--  H4  brown  color:#580000 sub sub title  --*/

			/*--  H6  Verses brown  color:#580000 indented italic--*/
h6 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 18px;           		/*--Line spacing --*/
	font-weight: bold;
	font-style:italic;
    color: #580000 ;
	margin:0 0 0 10px;

}
	
}