/* CSS Document 
************* CHANGE LOG ****************
08-01-2026 : Added ".table11" style for contactUs.php page. COpied from style  ".table1". table1 was NOT defined under @media section, and I needed it for mobile devices for the form show in 95%.
		 In table1 it was 60% (only for desktops). Since table1 might be used in other places, i just made a copy a dn used it. 
		 * changed .z style in @media to align the site name in the middle in portrait mode, and inxrease it size from 20px to 30px.
		 * changed nstyle2 in media section to change font size from 16px to 12px 
		 

*/
html {
	padding:0px;
	margin:0px;
}

body {
	padding:0px;
	margin:0px;
	width:1265px;
	font-family:tahoma;
}

/* CSS Document for fifa2026 page*/

.dateBar {
	background-color:#00A36C;
	color:white;
	font-size:16px;
	font-weight:bold;
	text-align:center;
	width:100%;
}

.tr1 {
	border-bottom:2px dashed silver;
}

/* end fifa 2026 styles */
.main       {margin-top:2px; width:1000px;height:100%; background-color:white;}
.header     {width:990; background-image: linear-gradient(#d5d5cc,  #f3f3ee ); height:50px;padding-top:10px;}
.content    {margin:2px; width:100%;height:99%;font-family:tahoma;font-size:12px; text-align:justify;margin-top:0px} 

.label1		{font-family:tahoma;font-size:14px;color:gray;display:inline-block;width:25%;text-align:right;margin:7px;}
.label2		{font-family:tahoma;font-size:16px;color:gray;display:text-align:right;}

.subHeading1 {font-family:tahoma;font-size:22px;color:black;font-weight:bold;background:#E0FCE2;}
.submit1 {font-family:tahoma;font-size:16px;width:100px;font-weight:bold;}
.clock1 {
	float:left;
	text-align:left;
	padding-left:8px;
	font-size:12px;
}

.login1 {
	float:right;
	text-align:right;
	padding-right:8px;
	font-size:12px;
}

/*** Style for errmsg Box **/
.font1{width:990;border:0;}
.stocks_s1	{font-family:tahoma;font-size:15px;color:red;}
.errmsg		{font-family:tahoma;font-size:10px;color:red;width:60%;text-align:left;}
.AllTop		{display:inline-block;width:70px;}

.add_banner	{width:98%;margin-left:10px;margin-bottom:10px;border:1px solid #CCCCCC;height:80px;}
.h_dt		{color:#999999;font-size:11px;text-align:right;}
.gray_bg_l	{background:#EFEFEF;}
.gray_bg_r	{text-align:right;background:#EFEFEF;width:100%;padding-top:5px;}
.gray_bg_r a{font-size:11px; text-decoration:none;color:black;padding:5px;}
.srch_txt	{	
	border-collapse:collapse;
	vertical-align:top;
	padding:0px;
	margin:0px;
	font-weight:bold;
	font-family: arial;
	background:url('../images/cal_bg.jpg');
	border:1px solid red;
	color:white;
	font-size:12px;
}
.srch_btn	{/*background:#333333;*/color:black;/*border:2px solid black;*/}
.local		{width:130px;}
.local span	{width:130px;background:yellow;}
.menu		{width:100%;}
.menu_links			{background-image:url('../images/g_bg.png');background-repeat:repeat-x;padding:4px;margin:0px;border-collapse:collapse;font-size:14px;font-weight:bold;text-align:center;height:30px;}
.menuItemsColor		{ color: yellow; text-decoration:none; font-family:Arial, Helvetica, sans-serif; font-size:13px; font-weight:bold; }
a.alinks:link		{ color: yellow; text-decoration:none; }
a.alinks:visited	{ color: yellow; text-decoration: none; }
a.alinks:hover		{ color: yellow; text-decoration: underline; }
a.alinks:active		{ color: yellow; text-decoration: none; }
a.cont_link:link	{ color: #0033FF; text-decoration: underline; }
a.cont_link:visited { color: #0033FF; text-decoration:  underline; }
a.cont_link:hover	{ color: #0033FF; text-decoration: underline; }
a.cont_link:active	{ color: #0033FF; text-decoration: underline; }
.localnews{position:absolute;margin-top:17px;margin-left:-92px; width:120px;border:1px solid silver;}
.classified{position:absolute;width:120px;position:absolute;border:1px solid silver;}
.islamic{width:120px;position:absolute;margin-top:17px;margin-left:-108px; border:1px solid silver;}
.menuStyle1	{position:absolute;background:#FFFFFF;border-right:solid 2px #AAAAAA;border-bottom:solid 2px #AAAAAA;border-left:solid 1px #CCCCCC;border-top:solid 1px #CCCCCC;width:180px;}
.menuTd{padding-left:10px;padding-top:5px;padding-bottom:5px;font-family:Arial, Helvetica, sans-serif;font-size:12px;border:solid 1px #EEEEEE;cursor:pointer;text-align:left;}
.menuTd a{ text-decoration:none;text-align:left;}
.heading{background:#004400;height:22px;font-size:11px;color:white;font-weight:bold;text-align:center;margin-bottom:2px;font-family:verdana;border:solid 2px #004400;}
tr.menuon { background:#FFFFFF; border:solid 1px; font-weight:bold; }
tr.menuoff { background:#FFFFFF;  border:none; font-weight:normal;}
tr.menuon a{ text-decoration:none;}
tr.menuoff a {text-decoration:none;}
.hTdOn{	font-family:Verdana, Arial, Helvetica, sans-serif;font-size:11px;background:#FEFEFE;cursor:pointer;padding-left:10px;padding-top:6px;padding-bottom:6px;border:solid 1px #EEEEEE;color:#0614BB;}
.hTdOff{font-family:Verdana, Arial, Helvetica, sans-serif;font-size:11px;background:#FEFEFE;cursor:pointer;padding-left:10px;padding-top:6px;padding-bottom:6px;border:solid 1px #EEEEEE;color:#0066FF;font-weight:bold;}

.why	{font-size:12px;color:gray;font-family:Tahoma;}
.why1	{font-size:18px;color:gray;font-family:Amienne;font-style:italic;}
.middleSpace{ height:100px;clear:both;}

/* These styles are used in the calender icon showed in the header */
.class1 {
	border-radius:5px;
	background-image:url('../images/cal_bottom_grad.png');
	height:55px;
	width:250px;
	border:1px solid gray;
	text-align:center;
	font-weight:bold;
	font-family:sans-serif;
	font-size:28px;
	box-shadow: 5px 5px 5px #888;
}
.class2 {
	border-top-right-radius:3px;
	border-top-left-radius:3px;
	height:20px;
	width:100%;
	color:yellow;
	background-image:url('../images/cal_top_grad.png');
	text-align:center;
	font-size:12px;
	font-weight:bold;
	font-family:sans-serif;
}
/* Header calender incon styles end here */
/*********************************************** Old file styles *******************************************************/
/* CSS Document */

.latestAndAllNews{ font-size:9px; font-weight:normal; color:darkred;}
.rightSuperDiv{ border:solid 0px #0000ff; }
.rightInnerDivs{ border:solid 0px #ff0000; }
.tdDistance{height:20px;width:10px;text-align:left;padding-right:1px;margin-top:0px;}
.IslamicHeadings{font-size:16px;color:#009966;text-decoration:underline;text-align:center;}
.IslamicData{text-align:center;font-size:12px;height:30%;}
.IslamicData a{text-align:center;font-size:12px;}
.IslamicData a:hover{text-align:center;font-size:12px;color:#00CCFF;text-decoration:underline;}
#dateSec{font:12 "tahoma";}
#sports{background:#FFCCFF;color:black;font-family:tahoma;}
#biz{background:#00CCFF;color:black;font-family:tahoma;}
#headlines{color:white;font-family:tahoma;}
#inational{background:#99FFCC;color:black;font-family:tahoma;}
.container{width:100%;height:auto;margin-top:4px;margin-bottom:4px;}
.mid{width:100%;margin:0;padding:0;float:left;}
.leftBox{text-align:left;width:18.5%;float:right;/*background:#eeeeee;*/}
.midSetter{float:left;padding:0;width:100%;margin-top:5px;hieght:auto;}
.link{width:100%;padding-top:3;padding-left:0;}
.rightBox{float:left;width:714px;margin-left:0;height:auto;}
.leftBox a{text-decoration:none;font-size:13px;font-family:thoma;color:#23aaff;}
.leftBox a:hover{color:green;font-size:14px;font-weight:bold;width:100%;cursor:hand;}
.leftBox a:active{font-weight:bold;color:#dfa2af;}
a{cursor:hand;text-decoration:none;}
.mainDiv{width:800; border: solid 1px;border-color:#004000;float:right;font-family:thoma;font-size:12pt;}
.smallBoxRight{text-align:left;float:right;width: 50%;font-family:thoma;font-size:14px;}
.smallBoxLeft a{  font-family:tahoma;font-size:7pt;}
.smallBoxLeft a:hover{text-decoration:underline;}
.smallBoxRight a{font-family:tahoma;font-size:7pt;}
.smallBoxRight a:hover{text-decoration:underline;}
.smallBoxLeft{text-align:left;display:block; float:left;width: 399.4;font-family:thoma;}
.smallHeadingRight,.smallHeadingLeft{float:left;width: 399px;background-color:#C0C0C0;text-align:center;color:#000000;font-family:thoma;font-size:15px;font-weight:bold;}
.bigHeadingMiddle{width: 100%;background-color:#C0C0C0;  text-align:center;  color:#black;  font-family:thoma;  font-size:15px;    font-weight:bold; }
.bigBoxMiddle{  width: 100%;  text-align:right;  color:#000000;  font-family:thoma;  font-size:10px; }
.headingDiv {width: 100%;  background-color:#008800;  border : 1px;  font: 17px trebuchetms white;  font-weight:bold; }
.imgRight { float:right; }
.test {width:100%;float:left;}

.style5 { 
	font-size:12px;
	text-align:center; 
}

/*********************** Styles for Stocks area ***********************
Initial Deployment : March 16, 2009.
*/
.stocks1 {font-family:tahoma;font-size:10px;color:blue;}
.stocks2 {font-family:tahoma;font-size:10px;color:red;}
.stocks3 {font-family:tahoma;font-size:10px;color:blue;text-align:right;}
.stocks4 {font-family:tahoma;font-size:10px;color:red;text-align:right;}
.stocks5 {font-family:tahoma;font-size:10px;color:#838996;text-align:right;}
.s1 {
	width:240px;
	border:1px solid green;
	float:right;
}

.s2 {
	background-color:green; 
	text-align:center;
	color:white;
	font-size:18px;
}
.s3 { 
	background-color:green;
	text-align:right;
	color:white;
	font-size:10px;
}
.s4 {
	color:black;
	font-weight:bold;
	font-family:tahoma;
	font-size:12px;
}
.s5 {
	color:black;
	font-weight:bold;
	font-family:tahoma;
	font-size:12px;
}
.s6 {text-align:right; font-family:tahoma; font-size:12; width:50px}
/***************** MARHETS Styles end here*************/

/**** Styles for twitter Widget *******/

.twitter1{
	height:1000px;
	width:350px;
}
/**** twitter widget styles ends here *******/


.header {
  background-color:  #f1f1f1 ;
  color: black;
  text-align: center;

  top: 0;
  width: 100%;
  height:100px;
  z-index: 1;
}

.menuItem {
	margin:2px;
	padding:2px 2px;
	font-size:12px;
	display: inline-block;
}
@font-face {
    src: url(fonts/becker.ttf);
    font-family: beckerregular;
}

@font-face {
    font-family: 'becker1';
    src: url('custom-fonts/becker-webfont.woff2') format('woff2'),
         url('custom-fonts/becker-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.z{
	font-family:becker1;
	font-size:50px;
	color:  #2e702c ; 
	/*text-shadow: 0px 0px 8px   #06b804  	;*/
} 

@font-face {
    font-family: 'Nastaleeq1';
    src: url('custom-fonts/Jameel-Noori-Nastaleeq.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.nstyle1 {
	font-family:Nastaleeq1;
	font-size:16px;
	line-height:25px;
	padding-top:0px;
	padding-right:5px;
	background-color:#FFFFFF;
	color:blue; 
	margin-top:0px;
}

.nstyle3 {
	font-family:Nastaleeq1;
	font-size:20px;
	line-height:25px;
	padding:20px;
	background-color:#DAF7A6;
	color:blue; 
	margin-top:0px;
	box-shadow: 5px 10px silver;
	border-radius:5px;
	width:70%;
	text-align:right;
}

.zz {
	display:block;
}



.submit3		{
	font-family:tahoma;
	font-size:16px;
	font-weight:bold;
	padding:10px;
	border:1px solid silver;
	border-radius:5px;
	color:white;
	background-color:green;
}

.submit3:hover		{
	font-family:tahoma;
	font-size:16px;
	font-weight:bold;
	padding:10px;
	border:1px solid silver;
	border-radius:5px;
	color:white;
	background-color: green ;
	font-style:italic;

}

.foot {
	 display: flex;
       justify-content: center;
     align-items: center;
	 text-align:center;
	width:100%;
	height:150px;
	color:#ffd700;
	font-size:12px;
	background-color:green;
}


.table1{
	border-radius:5px;
	box-shadow: 0px 0px 5px 5px lavender;

}


.table11{
	border-radius:5px;
	box-shadow: 0px 0px 5px 5px lavender;
	width:60%;
}

.bb {
	padding:25px;
	color:green;
	font-family:tahoma;
	font-size:20px;
	text-align:center;
	height:80%;
	
}

.tt1 {
	width:60%;
}

.subHeading2 	{
	font-family:tahoma;
	font-size:32px;
	color:#696969;
	font-weight:bold;
	height:80px;
	text-align:center;
}

.input1			{
	display:inline-block;
	font-family:tahoma;
	font-size:14px;
	color:purple; 
	padding:5px; 
	border:1px silver solid;
	border-radius:5px;
	width:98%;

}

.input1:focus	{
	box-shadow: 0px 0px 5px 5px lavender;
}

.span1 {
	display:inline-block;
	width:50%;
	text-align:left;
	font-size:14px;
}

.footer1 {
	border-radius:0 0 5px 5px; 
	display: flex; 
	justify-content:center;
	align-items: center;	 
	text-align:center;	
	width:100%;	
	height:150px;	
	color:yellow;	
	font-size:12px;	
	background-color:green;
	padding:5px; 
	font-weight:bold;
}

.footer2  {
	width:30%; 
	float:right;
}

.footer3 {
	width:70%;
	
}
.footer4 {
	width:0px;
}

/* 8-2-2026 : Moving stle from html to css, to fix portrait mode display */
.forex1 {
	font-size:10px;
	border:1px solid silver;
	padding:5px;
	float:right;
	width:240px;
	border-collpase: collapse;"
}

.comm1 {
	width:240px;
	border:1px solid green;
	float:right;
}

/* Use a media query to add a breakpoint at 800px: */
@media screen and (max-width: 800px) {
	body {
		padding:1px;
		margin:1px;
		width:100%;
		font-family:tahoma;
	}	
  .left, .main, .right {
    width: 100%; /* The width is 100%, when the viewport is 800px or smaller */
  }
  
  .z{
	font-family:becker1;
	font-size:30px;
	color:  #2e702c ; 
	align:center;
	/*text-shadow: 0px 0px 8px   #06b804  	;*/
	}

	.header{
		width:100%;
		background-image: linear-gradient(#d5d5cc,  #f3f3ee ); 
		height:50px;
		padding-top:1px;
		text-align:center;
	}
	.zz {
		display:none;
	}
	.clock1 {
		float:left;
		text-align:left;
		padding-left:2px;
		font-size:8px;
	}
	.login1 {
		float:right;
		text-align:right;
		padding-right:2px;
		font-size:8px;
	}
	
	.nstyle1 {
		font-family:Nastaleeq1;
		font-size:12px;   /* 08-01-2026 : changed font size to 12px from 9px */
		line-height:15px;
		padding-top:0px;
		padding-right:5px;
		background-color:#FFFFFF;
		color:blue; 
		margin-top:0px;
	}
	
	.nstyle3 {
		font-family:Nastaleeq1;
		font-size:16px;
		line-height:15px;
		padding:5px;
		background-color:#DAF7A6;
		color:blue; 
		margin-top:0px;
		box-shadow: 5px 10px silver;
		border-radius:5px;
		width:90%;
	}
	
	.foot {
		clear:both;
		width:100%;
		height:150px;
		text-align:center;
		color:yellow;
		font-size:14px;
		background-color:green;
	}
	
	.tt1 {
		width:95%;
	}
	
	.label1	{
		font-family:tahoma;
		font-size:12px;
		color:gray;
		display:inline-block;
		width:100%;
		text-align:left;
	}
	
	
	.input1			{
		font-family:tahoma;
		font-size:12px;
		color:purple; 
		padding:3px; 
		border:1px silver solid;
		border-radius:3px;
		width:95%;
	}
	
	.span1 {
		display:inline-block;
		width:98%;
		text-align:left;
		font-size:10px;
	}
	/*********************** Styles for Stocks area ***********************	*/
	.stocks1 {
		font-family:tahoma;
		font-size:10px;
		color:blue;
		float:right;
	}
	.stocks2 {
		font-family:tahoma;
		font-size:10px;
		color:red;
	}
	.s1 {
		width:99%;
		border:1px solid green;
		align:center;
	}

	.s2 {
		background-color:green; 
		text-align:center;
		color:white;
		font-size:18px;
		
	}
	.s3 { 
		background-color:green;
		text-align:right;
		color:white;
		font-size:10px;
	}
	.s4 {
		color:black;
		font-weight:bold;
		font-family:tahoma;
		font-size:12px;
		text-align:center;
	}
	.s5 {
		color:black;
		font-weight:bold;
		font-family:tahoma;
		font-size:12px;
	}
	.s6 {text-align:right; font-family:tahoma; font-size:12; width:50px}
	/***************** MARHETS Styles end here*************/
		/**** Styles for twitter Widget *******/

	.twitter1{
		height:500px;
		width:350px;;
	}
	/**** twitter widget styles ends here *******/
	.table11{
		border-radius:5px;
		box-shadow: 0px 0px 5px 5px lavender;
		width: 95%;
		font-size: 12px;
		text-align: justify;
	}
	.footer1 {
		border-radius:0 0 5px 5px; 
		display: flex; 
		justify-content:center;
		align-items: center;	 
		text-align:center;	
		width:100%;	
		height:150px;	
		color:yellow;	
		font-size:10px;	
		background-color:green;
		padding:3px; 
		font-weight:bold;
	}

	.footer2  {
		width:45%; 
		height:90%;
		float:right;
		text-align:left;
	
	}
	.footer3 {
		display:block;
		width:25%;
		height:90%;
		text-align:right;
		float:right;
		display: flex;
		flex-direction: column; /* Stacks items vertically */
		gap: 10px; /* Adds space between the stacked spans */
	}
	.footer4 {   /* 08-01-2026 : added footer4 to manahe/control footer better */
		width:0px;
		width:30%;
		height:90%;
	}
	/* 8-2-2026 : Moving stle from html to css, to fix portrait mode display */
	.forex1 {
		font-size:10px;
		border:1px solid silver;
		padding:5px;
		float:right;
		width:99%;
		border-collpase: collapse;"
	}
	.comm1 {
		width:99%;
		border:1px solid green;
		text-align:center;
	}


}