/* Custom CSS Declarations */

.dotted-line {
	background: url('../images/dottedline.png') repeat-x 0 50%;
	height: 10px
}

/* Salaat Time Table */

table.salaattime,
table.feedbackform {
	margin: 0;
	padding: 0;
	width: 98%;
}

td.salaatcityinfo {
	padding: 0;
}

td.salaatleft {
	text-align: left;
}

td.salaatright {
	text-align: right;
}

td.salaatbreak,
td.miqaatbreak {
	background: url('../images/dottedline.png') repeat-x 0 0;
	height: 1px
}

td.salaatcookieset {
	height: 25px;
	text-align: center;
}

td.salaatchangecity {
	height: 20px;
	text-align: center;
}

td.salaatprintlink {
	text-align: center;
}

/* End Salaat Time Table CSS */

/* Miqaats List */
table.miqaatlist {
	margin: 0;
	padding: 0;
	width: 98%;
}

td.miqaatlisthead {
	padding: 0;
	background: #f7f7f7;
	font-weight: bold;
}

td.miqaatdateon {
	width: 20%;
	background: #ffffcc;
	font-weight: bold;
	text-align: center;
}

td.miqaatdateoff {
	width: 20%;
	text-align: center;
}

td.miqaatnameon {
	width: 80%;
	background: #ffffcc;
	font-weight: bold;
}

td.miqaatnameooff {
	width: 80%;
}

/* End Miqaats List CSS */

/* HijriCalendar */
table.hijrical {
	margin: 0;
	padding: 0;
	width: 98%;
}

td.hijricalhead {
	padding: 0;
	border: 1px dotted #cccccc;
	font-weight: bold;
	text-align: center;
	height: 23px;
}

td.hijricaldays {
	border: 1px dotted #cccccc;
	text-align: center;
	font-weight: bold;
	color: #006600;
	width: 14%;
}

td.hijricalcell {
	border: 1px dotted #cccccc;
	text-align: center;
	font-weight: bold;
	width: 14%;
	height: 20px;
}

td.hijricalcelldark {
	border: 1px dotted #cccccc;
	text-align: center;
	font-weight: bold;
	background: #cccccc;
	width: auto;
	height: 20px;
}


td.hijricalcellprogram {
	border: 1px dotted #cccccc;
	text-align: center;
	font-weight: bold;
	background: yellow;
	width: auto;
	height: 20px;
}
td.hijricallink {
	text-align: center;
	padding-top: 10px;
}

/* End HijriCalendar */

span.hijridate {
	display: block;
	padding-top: 4px;
	font-weight: bold;
	height: 20px;
	line-height: 22px;
	float: left;
	overflow: hidden;
	width: 270px;
}

div.google-maps {
	margin-left: auto;
	margin-right: auto;
}

#login-module { display: none; }

/* Committee Member List Corner Background CSS */
.commlist { display: block; }

.commlist *{
  display: block;
  height: 1px;
  overflow: hidden;
  font-size: .01em;
  background: #f2f2f2;
}

.commlist1 {
  margin-left: 3px;
  margin-right: 3px;
  padding-left: 1px;
  padding-right: 1px;
  border-left: 1px solid #f9f9f9;
  border-right: 1px solid #f9f9f9;
  background: #f5f5f5;
}

.commlist2 {
  margin-left: 1px;
  margin-right: 1px;
  padding-right: 1px;
  padding-left: 1px;
  border-left: 1px solid #fdfdfd;
  border-right: 1px solid #fdfdfd;
  background: #f4f4f4;
}

.commlist3 {
  margin-left: 1px;
  margin-right: 1px;
  border-left: 1px solid #f4f4f4;
  border-right: 1px solid #f4f4f4;
}

.commlist4 {
  border-left: 1px solid #f9f9f9;
  border-right: 1px solid #f9f9f9;
}

.commlist5 {
  border-left: 1px solid #f5f5f5;
  border-right: 1px solid #f5f5f5;
}

.commlistfg {
  padding: 5px;
  background: #f2f2f2;
}

table.memberlist {
	border: 0px none;
	width: 98%;
	background: #f9f9f9;
	margin-left: auto;
	margin-right: auto
}

td.commlistleft {
	width: 6%;
	text-align: center;
}

td.commlistpos {
	width: 94%;
	text-align: left;
	color: #52ADD6;
	font-weight: bold;
}

td.commlistcontent {
	width: 85%;
	text-align: left;
	color: #000;
	font-weight: bold;
	width: 50%;
}

img.memlist {
	padding-right: 3px;
	padding-top: 1px;
	vertical-align: text-top;
}

td.memlistbreak,
td.newmemberbreak,
td.contentamilbreak,
td.feedbackbreak {
	background: url('../images/dottedline.png') repeat-x 0 5px;
	height: 10px
}

.memreglistfg {
  padding: 0;
  background: #f2f2f2;
}

/* New Member Registration Table CSS */

div.newmemberintro,
div.feedbackintro {
	text-align: left;
	padding-bottom: 15px;
}

span.newmemberintrohead,
span.feedbackintrohead {
	font-size: medium;
	font-weight: bold;
	color: green;
	text-decoration: underline;
	line-height: 30px;
}

.newmemberfg,
.feedbackfg {
	padding: 0;
	background: #f2f2f2;	
}

table.newmember,
table.feedback {
	width: 97%;
	margin-left: auto;
	margin-right: auto;
	background: #f9f9f9;
}

td.newmemberhead,
td.feedbackhead {
	width: 100%;
	text-align: left;
	font-weight: bold;
	padding-left: 5px;
}

td.newmemberleft {
	text-align: left;
	width: 35%;
	padding-left: 5px;
}

td.newmemberright {
	text-align: left;
	width: 65%;
	padding-left: 5px;
}

td.feedbackleft {
	text-align: left;
	width: 20%;
	padding-left: 5px;
}

td.feedbackright {
	text-align: left;
	width: 80%;
	padding-left: 5px;
}

td.feedbackcell {
	width: auto;
	vertical-align: top;
}

td.feedbackbutton {
	width: auto;
	padding: 5px 0;
}

span.feedbacktags {
	font-weight: bold;
	font-size: 1em;
}

span.feedbackerror {
	color: red;
}

td.newmembererror {
	color: red;
	font-weight: bold;
}

div.feedbackerror {
	color: red;
	padding: 10px;
	background: gray;
}

/* @end New Member Registration Table CSS */

/* General Content CSS */

table.gencontent {
	width: 98%;
	margin-left: auto;
	margin-right: auto;
	background: #f9f9f9;
}

td.contentamilheading {
	width: 100%;
	padding-left: 5px;
	font-weight: bold;
}

td.contentamilleft {
	padding-left: 5px;
	width: 70%;
}

td.contentamilright {
	text-align: center;
	width: 30%;
}

span.contentamilhead, 
span.educationhead,
span.touristhead {
	color: #52ADD6;
	font-weight: bold;
}

img.contentamilphoto {
	vertical-align: top;
}

table.mapcontent {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

td.mapcontentleft {
	width: 70%;
	text-align: left;
	vertical-align: top;
}

td.mapcontentright {
	width: 30%;
	vertical-align: top;
}

div.mapcontent ul {
  margin: 0;
  padding: 0;
  list-style:none;
}

div.mapconten li {
	float: left;
	margin: 0;
	padding: 0;
}

table.moonphase {
	width: 95%;
	margin-left: auto;
	margin-right: auto;
}

td.moonphasecontent {
	border: 1px solid #000000;
	background: black;
	color: white;
	text-align: center;
	padding: 5px 0;
}

span.moonphasespan {
	display: block;
	padding-top: 5px;
}

a.moonphaselink {
	color: #777777;
	text-decoration: none;
}

/* Salaat Timings Calculation CSS */

div.salaattimemaindiv {
	margin: 0;
	padding: 0;
}

table.salaattimemain,
table.salaattimelatlong,
table.salaattimecal {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	border-collapse: collapse;
	border-spacing: 0;
	background: #f2f2f2;
}

td.stcalhead {
	font-weight: bold;
	background: #003300;
	color: white;
	padding: 5px;
}

td.stfindbox {
	padding: 5px;
	text-align: left;
}

td.stresultleft,
td.stprintleft {
	text-align: left;
	width: 20%;
	font-weight: bold;
	padding: 5px;
}

td.stresultright,
td.stprintright {
	text-align: left;
	width: 80%;
	font-weight: bold;
	padding: 5px;
}

td.stshowmap {
	width: 90%;
	height: 200px;
	text-align: center;
	vertical-align: top;
}

/* @end Salaat Timings Calculation CSS */

/* Search Page CSS */

/* Search Form */

.searchform { display: block; }

.searchform *{
  display: block;
  height: 1px;
  overflow: hidden;
  font-size: .01em;
  background: #f2f2f2;
}

.searchform1 {
  margin-left: 3px;
  margin-right: 3px;
  padding-left: 1px;
  padding-right: 1px;
  border-left: 1px solid #f9f9f9;
  border-right: 1px solid #f9f9f9;
  background: #f5f5f5;
}

.searchform2 {
  margin-left: 1px;
  margin-right: 1px;
  padding-right: 1px;
  padding-left: 1px;
  border-left: 1px solid #fdfdfd;
  border-right: 1px solid #fdfdfd;
  background: #f4f4f4;
}

.searchform3{
  margin-left: 1px;
  margin-right: 1px;
  border-left: 1px solid #f4f4f4;
  border-right: 1px solid #f4f4f4;
}

.searchform4{
  border-left: 1px solid #f9f9f9;
  border-right: 1px solid #f9f9f9;
}

.searchform5{
  border-left: 1px solid #f5f5f5;
  border-right: 1px solid #f5f5f5;
}

.searchformfg{
  padding: 10px;
  background: #f2f2f2;
}

.searchkeyword {
	background: #d8d8d8;
	padding: 5px;
}

.searchresultheader {
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
	width: auto;
	height: 25px;
	line-height: 25px;
	background: #003300;
	color: white;
	padding: 5px;
}

.searchresultcontent {
	padding: 5px;
}

.searchresultbreak {
	background: url('../images/dottedline.png') repeat-x 0 5px;
	height: 10px
}

.searchlinks {
	background: #f2f2f2;
	margin-bottom: 10px;
	padding: 5px;
	text-align: center;
	height: 25px;
	line-height: 25px;
}

/* @end Search Page CSS */

/* Footer Copyright CSS */

.copyright {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

.copyrightlt {
	width: 75%;
	text-align: left;
}

.copyrightrt {
	width: 25%;
}

/* @end Footer Copyright CSS */

/* @end General Content CSS */

/*---------- Hijricalendar Tooltip -----------*/
a.tt{
    position:relative;
    z-index: 24;
    text-decoration: none;
    font-size: 11px;
    font-family: verdana, arial;
}
a.tt span {
	display: none;
}

a.tt:hover {
	z-index: 25;
	color: #ff0000;
}

a.tt:hover span.tooltip {
    display: block;
    position: absolute;
    top: 0px;
	right: 0px;
    padding: 15px 0 0 0;
    width: 195px;
    color: #000000;
    text-align: center;
    z-index: 100;
}

a.tt:hover span.top {
	display: block;
	background: url('../images/toolbg.gif') no-repeat top;; padding-left:8px; padding-right:8px; padding-top:30px; padding-bottom:0
}

a.tt:hover span.middle {
	display: block;
	background: url('../images/toolbg_filler.gif') bottom;
	text-decoration: none; padding-left:8px; padding-right:8px; padding-top:0px; padding-bottom:0px
}

a.tt:hover span.bottom {
	display: block;
	color: #548912;
    background: url('../images/toolbg.gif') no-repeat bottom;; padding-left:8px; padding-right:8px; padding-top:3px; padding-bottom:10px
}

img.calimgpopup {
	float: left;
	margin: 5px 0px 5px 10px;
}

/*---------- Ajax Contact Form -----------*/
#form_box {
	width: 100%;
	background: #f8f8f8;
	border: 1px solid #d6d6d6;
	border-left-color: #e4e4e4;
	border-top-color: #e4e4e4;
	margin-top: 5px;
	margin-bottom: 5px;
}

table.ajaxform {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}
 
#confirmation {
	display: block;
}

/*---------- Member Directory and Details CSS -----------*/
table.memberdetails {
	width: 98%;
	margin-left: auto;
	margin-right: auto;
	background: #f9f9f9;
}

td.memberdetails-left,
td.memberdetails-center,
td.memberdetails-right {
	text-align: left;
	width: 32%;
	padding: 5px 10px;
	vertical-align: top;
}

td.memberdetails-spacer {
	width: 1%;
	border-left: 1px dotted black;
}

td.memberdetails-line {
	border-top: 1px dotted black;
	padding-top: 5px;
	margin-top: 5px;
}

tr.memsectiontableentry1 td,
td.memsectiontableentry1 {
  	padding: 5px;
  	vertical-align: top;
}

tr.memsectiontableentry2 td,
td.memsectiontableentry2 {
	padding: 5px;
	vertical-align: top;
}

td.memsectiontableentryline {
	border-bottom: 1px dotted black;
	margin-top: 5px;
}

tr.sectiontablepagination td,
td.sectiontablepagination {
	background: #f9f9f9;
	height: 25px;
}

/* COM_USER CSS */
div.password-reset,
div.user-login,
div.edit-user-details {
	margin-top: 15px;
	padding-top: 15px;
}

div.password-reset fieldset,
div.user-login fieldset,
div.edit-user-details fieldset {
	border: 1px solid gray;
}

div.password-reset legend,
div.user-login legend,
div.edit-user-details legend {
  padding: 0.2em 0.5em;
  border: 1px solid gray;
  color: green;
  font-size: 100%;
  text-align: center;
  }

/* Hijri Yearly Calendar CSS */
table.hyc-header,
table.hyc-middle,
table.hyc-footer {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

table.hyc-header,
table.hyc-footer {
	background: #006633;
	height: 40px;
}

table.hyc-main-table {
	background: black;
}

table.hyc-salaat-head {
	width: 100%;
	background: #006600;
	border: 1px dotted #339966;
}

table.hyc-salaat-time {
	width: 100%;
	background: #efefef;
	border: 1px dotted #339966;
}

td.hyc-header-left,
td.hyc-footer-left {
	width: 15%;
	text-align: left;
	padding-left: 5px;
}

td.hyc-header-center,
td.hyc-selectbox {
	width: 60%;
	text-align: center;
	font-size: 150%;
	color: white;
}

td.hyc-header-right,
td.hyc-footer-right {
	width: 15%;
	text-align: right;
	padding-right: 5px;
}

tr.hyc-daysname {
	height: 30px;
	line-height: 30px;
	font-size: 125%;
	background: #009933;
	color: white;
}

table.hyc-salaat-head td {
	width: 25%;
	text-align: center;
	font-size: 80%;
	color: white;
}

table.hyc-salaat-time td {
	width: 25%;
	text-align: center;
	font-size: 80%;
	color: black;
}

td.hyc-beforedayboxes,
td.hyc-afterdayboxes,
td.hyc-highlighteddayboxes,
td.hyc-dayboxes {
	height: 110px;
}

td.hyc-beforedayboxes,
td.hyc-afterdayboxes {
	background: #efefef;
}

td.hyc-highlighteddayboxes {
	background: #006600;
}

td.hyc-dayboxes {
	background: white;
}

/* Contact us page CSS*/
table.contactusMain {
	margin: 0;
	width: 100%;
}

td.contactusleft {
	width: 37%;
	text-align: left;
	font-weight: bold;
}

td.contactusright {
	width: 63%;
	text-align: left;
}

.contactusInput {
	width: 250px;
	font-size: 12px;
	font-family: arial, verdana;
	color: blue;
}

.contactusButton	{
	border: 1px solid #000000;
	padding: 0px 1px 0px 2px;
	color: #fff;
	background-color: #009900;
	font-family: Arial, Verdana;
	font-size: 12px;
	height: 18px;
	cursor: pointer;
}

.contactusButton:hover {
	background: #F8550D;
}

span.contactusPhone {
	font-size: 10px;
	color: gray;
}
/* @end Custom CSS Declarations */