/* CSS Document */

body { font-family: Arial, Helvetica, sans-serif; /*Verdana;*/ color: #aaaaaa; background-image: url("../images/bg4.jpg"); }

* { box-sizing: border-box; }

a { color: #09F; }

.cleaner { clear: both; width: 100%; height: 0px; font-size: 0px;  }

.cleaner_h05 { clear: both; width:100%; height: 5px; }
.cleaner_h10 { clear: both; width:100%; height: 10px; }
.cleaner_h20 { clear: both; width:100%; height: 20px; }
.cleaner_h30 { clear: both; width:100%; height: 30px; }
.cleaner_h35 { clear: both; width:100%; height: 35px; }
.cleaner_h40 { clear: both; width:100%; height: 40px; }
.cleaner_h45 { clear: both; width:100%; height: 45px; }
.cleaner_h50 { clear: both; width:100%; height: 50px; }
.cleaner_h60 { clear: both; width:100%; height: 60px; }

.header { background-color: #0065cc; width: 100%; padding: 10px; margin: -8px; vertical-align: top; position: fixed; z-index: 100; }

.subheader { background-color: #312c2d; color:#FFF; width: 100%; height: 60px; padding: -10px; margin-top: 75px; margin-left: -8px; position: fixed; text-align: center; z-index: 100;}

.subheader_mob { display: none; background-color: #312c2d; color:#FFF; width: 100%; height: 60px; padding: -10px; margin-top: 75px; margin-left: -8px; position: fixed; text-align: center; z-index: 100;}

.subheader_times {
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: N; /* number of lines to show */
   line-height: X;        /* fallback */
   max-height: X*N;       /* fallback */
}

.nextPrayer { text-align:center; }

.header_logo { float: left; color: #FFF; font-size: 20px; text-align: center; }

.header_title { float: left; padding: 0px; color: #FFF; }

.header_subtitle { float: left; padding: 0px; color: #FFF; }

.header_menu { float: right; padding-left: 30px; padding-right: 30px; text-align: left; /* border: 1px solid; */ /* border-color: #000; */ }

.header_menu a { color: #FFF; padding: 10px; text-decoration: none; }

.header_menu a:hover { background-color: #FFF; color: #09F; padding: 10px; }

.header_mob-menu-icon { display: none; }

.sub_header_menu { float: right; padding-left: 25px; padding-right: 30px; margin-top: 20px; text-align: left; /* border: 1px solid; */ /* border-color: #000; */ }

.sub_header_menu a { color: #FFF; padding: 10px; text-decoration: none; }

.sub_header_menu a:hover { background-color: #FFF; color: #09F; padding: 10px; }

.Welcome_Right { float: right; width: 48%; color: #000; margin-top: -25px; }

.Welcome_Right_Mob { display: none; }

.left { float:left; width:20%; text-align:center; }

.left a { background-color:#e5e5e5; padding:8px; margin-top:7px; display:block; width:100%; color:#09F; text-decoration: none; }

.left a:hover { background-color:#09F; padding:8px; margin-top:7px; display:block; width:100%; color:#FFF; }

.main { color: #000; float:left; width:60%; padding:0px 20px; } 

.100widthcontent { color: #000; float:left; width:100%; padding:0px 20px; } 

.main_Mob { display: none; }

.prayer_times_heading { color: #000; float:left; width:60%; padding:0px 20px; }

/* .prayer_times_heading_mob { display: none; } */

.right { background-color:#e5e5e5; color: #000; float:right; width:20%; padding:15px; margin-top:7px; text-align:center; }

/* SPLIT CONTENT LEFT AND RIGHT  */

.Pos_Left { float: left; color: #000; margin-top: -25px; }

.Pos_Right { float: right; width: 48%; color: #000; margin-top: -25px; }

/* CENTER ONLY CONTENT  */

#center_wrapper {
	position:  absolute;
	width: 100%;
	background-color: #312c2d;
	text-align: center;
}


/* DONATION BUTTONS  */

.donation-button {
  background-color: #0084FF;
  border-radius: 8px;
  border-style: none;
  box-sizing: border-box;
  color: #FFFFFF;
  cursor: pointer;
  display: inline-block;
  font-family: "Haas Grot Text R Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-weight: 500;
  height: 40px;
  line-height: 20px;
  list-style: none;
  margin: 0;
  outline: none;
  padding: 10px 16px;
  position: relative;
  text-align: center;
  text-decoration: none;
  transition: color 100ms;
  vertical-align: baseline;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
}

.donation-button:hover,
.donation-button:focus {
  background-color: #64B4FF;
}

.item{
  width:200px;
  text-align:center;
  display:block;
  background-color: transparent;
  border: 1px solid transparent;
  margin-right: 10px;
  margin-bottom: 1px;
  float:left;
}

#index-gallery{
  width:550px;
}


/* .footer { background-color: #0065cc; /* #F5D99C; */ /* color: #FFF; text-align: center; margin-bottom: 0; vertical-align:bottom; } */

/* footer */

#footer_wrapper {
	position:  absolute;
	bottom: 8;
	width: 100%;
	margin: -8px;
	background-color: #312c2d;
}

#footer {
	width: 100%;
	margin: 0 auto;
	padding: 20px 20px;
	font-style: normal;
	color: #FFF;
	background: #312c2d;
}

#footer-btm-left {
	width: 40%;
	float: left;
	word-spacing: 3px;
	font-size: 14px;
}

#footer-btm-right {
	width: 40%;
	float: right;
	word-spacing: 3px;
	text-align: right;
	font-size: 14px;
}

#footer  a {
	color: #09F;
}


/* end of footer */
@media only screen and (max-width:1200px) {
	/* For mobile phones: */
	body { background-image: url("../images/bg4.jpg"); }
	.left, .main, .right { width: 100%; }
	.header_menu { display: none; }
	.header_mob-menu-icon { display: block; float: right; padding-right: 10px; margin-top: -2px; }
	/* .prayer_times_heading { display: none; } */
	/* .prayer_times_heading_mob { display: block; width: 100%; color: #000000; } */
	.subheader { display: none; }
	.main { display: none; }
	.main_Mob { display: block; width: 100%; color: #000; }
	.nextPrayer { display: none; }
	.subheader_mob { display: block; background-color: #312c2d; color:#FFF; width: 100%; height: 60px; padding: -10px; margin-top: 75px; margin-left: -8px; position: fixed; text-align: center; z-index: 100;}
	.Welcome_Right { display: none; }
	.Welcome_Right_Mob { display: block; width: 100%; color: #000; }
	
}