@charset "utf-8";
/* CSS Document */
body {
	font: 13px Verdana, Arial, Helvetica, sans-serif;
	color: #000;
	background-image: url(images/background.gif);
	background-repeat: repeat-x repeat-y;
	background-color: #eefdfd;
}


.khalifa {
  font-family: arial;
  font-weight: bold;
  color: #FFFFFF !important;
  font-size: 12px;
  box-shadow: 1px 1px 1px #C3E7FF;
  padding: 8px 18px;
  border-radius: 40px;
  border: 0px solid #3866A3;
  background: #41ccc3;
	text-decoration: none;
	
}
.khalifa:hover {
  color: #14396A !important;
  background: #468CCF;
  background: #13a69c;
}

		
.flex-container {
  /* We first create a flex layout context */
  display: flex;
  
  /* Then we define the flow direction 
     and if we allow the items to wrap 
   * Remember this is the same as:
   * flex-direction: row;
   * flex-wrap: wrap;
   */
  flex-flow: row wrap;
  
  /* Then we define how is distributed the remaining space */
  justify-content: space-around;
  
  padding: 0;
  margin: 0;
  list-style: none;
	background-color: #000;
}

.flex-item {
  background: black;
  padding: 1px;
  width: 20%;
  height: 150px;
  margin-top: 10px;
  line-height: 150px;
  color: white;
  font-weight: bold;
  font-size: 3em;
  text-align: center;
}
/*  Background Image */
.lakab{color:#C76E03}
hr.type_4 {
border: 0;
height: 22px;
background-image: url(images/type_4.png);
background-repeat: no-repeat;
width: 100%;
}
.K_name {
	font-size: 1em;
	color: #13A69C;
	font-weight: bold;font-family: 'ABeeZee', sans-serif;
}
.K_txt {
	font-size: 1em;
	line-height: 150%;font-family: 'ABeeZee', sans-serif;
}
.esum {
  display: list-item;
      margin-left: 1.5em;
      list-style-type: decimal;
	
}

.l_green{}

.downloadbuttonblock{ width:100%; float:right; border:0px solid #EC2225; text-align: right;}
.nav{font-family: 'Roboto Slab', serif;}
.englishContent{font-family: 'ABeeZee', sans-serif;}
.english {
	text-align: left;
}
.MaroofPeerlogo {
	display: inline-block;
	width: auto;
	height: auto;
	border: 0px dotted black;
	position: relative;
	color: #fff;
	font-size: 1.5em;
	font-weight: bold;
	padding-left: 0.2em;
	font-family: 'Roboto Slab', serif;
}
.New_Container {
	height: auto;
	width: 80%;
	border: 0px solid #F00;
	margin: auto;
}
.clear {
	clear: both;
}
hr.style-one {
	border: 0;
	height: 5px;
	background: #13a69c;
	background-image: linear-gradient(to right, #eaf8f7, #13a69c, #eaf8f7);
	margin-top: 0px;
}
.New_LinksLeft {
	float: left;
	border: 0px solid #096;
}
.New_LinksRight {
	float: right;
	border: 0px solid #096;
}
/*social icon( http://www.gadgetronicx.com/social-media-icons-rollover-hover-effect/ )*/
.New_Roll_Over {
	height: 32px;
	width: 32px;
	margin: 5px;
	float: left;
	-webkit-transition: all ease 0.5s;
	-moz-transition: all ease 0.5s;
	-o-transition: all ease 0.5s;
	-ms-transition: all ease 0.5s;
	transition: all ease 0.5s;
	/*source(http://www.cssmatic.com/border-radius)*/
	border-radius: 5px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
	border: 0px solid #000000;
}
.New_Roll_Over:hover {
	background-position: 0px -32px;
}
.New_Home {
	background-image: url(images/social/home.png)
}
.New_Contactus {
	background-image: url(images/social/contactus.png)
}
.New_Blog {
	background-image: url(images/social/blog.png)
}
.New_Youtube {
	background-image: url(images/social/youtube.png)
}
.New_twitter {
	background-image: url(images/social/twitter.png)
}
.New_Wapp {
	background-image: url(images/social/wapp.png)
}
/*end common/////////////////////////////////////////////////////////*/



/*start header/////////////////////////////////////////////////////////*/
.New_Header {
	height: auto;
	width: 100%;
}
.New_TopNav {
	height: 50px;
	width: 96.4%;
	background-color: #FFF;
	margin: auto;
}
.New_Menu {
	height: auto;
	min-height: auto;
	width: 100%;
	background-color: #13a69c;
}
/*end header/////////////////////////////////////////////////////////*/

/*start content/////////////////////////////////////////////////////////*/
copy

.New_Content {
	height: auto;
	width: 100%;
}
.New_Left {
	height: 300px;
	width: 1.2%;
	background-color: transparent;
	float: left;
	background-image: url(images/leftbanner.gif);
	background-repeat: no-repeat;
	background-position: top left;
}
.New_Left_Page {
	height: 300px;
	width: 1.2%;
	background-color: transparent;
	float: left;
	background-image: url(images/pageleftbanner.gif);
	background-repeat: no-repeat;
	background-position: top left;
}


/*video byaan issue */
.New_Content_Centre {
	height: auto;
	min-height: 300px;
	width: 97.6%;
	background-color: #fff;
	float: left;
	margin: auto;
	

}
/*video byaan issue */







.New_Slider_message_date_news {
	width: 100%;
}
.New_Slider {
	width: 59%;
	float: left;
	height: auto;
	border: 0px solid #EF0B0F;
	margin-right: 0.5%;
}
.New_Message_Date_News {
	width: 40%;
	float: left;
	height: auto;
	background-image: url(images/banner_bg.gif);
	background-repeat: repeat;
}





.New_Messsage {
	width: 100%;
	float: left;
	height: auto;
}
.New_Date {
	width: 100%;
	float: left;
	height: auto;
}
.New_News {
	width: 100%;
	float: left;
	height: auto;
	border: 0px solid #C00;
}
.New_Books_Only {
	width: 100%;
	float: left;
	background-color: #fff;
	height: auto;
}
.New_Books_Banner {
	width: 98%;
	margin: auto;
}
.New_Books {
	width: 60%;
	float: left;
	background-color: #C60;
	height: 50px;
}
.New_Banner {
	width: 40%;
	float: left;
	background-color: #C69;
	height: 50px;
}
.New_Video_Announce_Tst {
	width: 98%;
	margin: auto;
	border: 0px solid #066;
	height: auto;
}
.New_Video_block {
	width: 32%;
	height: auto;
	background-color: #fff;
	float: left;
	margin: 0.5%;
}
.New_Announcement_block {
	width: 33%;
	height: auto;
	background-color: #fff;
	float: left;
	margin: 0.5%;
}
.New_Testimonial_block {
	width: 32%;
	height: auto;
	background-color: #fff;
	float: left;
	margin: 0.5%;
}
.New_Video_FeaturedVideo {
	width: 100%;
}
.New_Video {
	width: 60%;
	float: left;
	background-color: #6CF;
	height: 50px;
}
.New_FeaturedVideo {
	width: 40%;
	float: left;
	background-color: #66C;
	height: 50px;
}
.New_Testimonial_Map {
	width: 100%;
}
.New_Testimonial {
	width: 60%;
	float: left;
	background-color: #036;
	height: 50px;
}
.New_Map {
	width: 40%;
	float: left;
	background-color: #633;
	height: 50px;
}
.New_Right {
	height: 300px;
	width: 1.2%;
	background-color: transparent;
	float: right;
	background-image: url(images/rightbanner.gif);
	background-repeat: no-repeat;
	background-position: top right;
}
.New_Right_Page {
	height: 300px;
	width: 1.2%;
	background-color: transparent;
	float: right;
	background-image: url(images/pagerightbanner.gif);
	background-repeat: no-repeat;
	background-position: top right;
}
/*end content/////////////////////////////////////////////////////////*/








/*GENERAL CSS++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

img {
	width: 100%;
	height: auto;	
	max-width:100%;
}
.noresImg {
	width: auto;
}
video {
	width: 100%!important;
	height: auto!important;
}
.Clear {
	clear: both;
}
.Index_page_Content {
	width: 100%;
	margin: auto;
	border: 0px #000 solid;
	height: auto;
}
/*bubble with http://www.ilikepixels.co.uk/drop/bubbler/ */


/*search select*/
.selectmenu {
	padding: 10px;
}
.search {
	font-size: 16px;
	padding: 5px;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	line-height: 15px;
}
/*end search select*/
.Maroofpeer a:link {
	color: #FFFFFF;
	font-size: 26px;
	text-decoration: none;
	
}
/* visited link */
.Maroofpeer a:visited {
	color: #FFFFFF;
	font-size: 26px;
	text-decoration: none;
}
/* mouse over link */
.Maroofpeer a:hover {
	color: #3FF;
	font-size: 26px;
	text-decoration: none;
}
/* selected link */
.Maroofpeer a:active {
	color: #FFFFFF;
	font-size: 26px;
	text-decoration: none;
}
.Kalaamlink a:link {
	color: #13a69c;
	font-size: 21px;
	text-decoration: none;
}
/* visited link */
.Kalaamlink a:visited {
	color: #13a69c;
	font-size: 21px;
	text-decoration: none;
}
/* mouse over link */
.Kalaamlink a:hover {
	color: #13a69c;
	font-size: 21px;
	text-decoration: underline;
}
/* selected link */
.Kalaamlink a:active {
	color: #13a69c;
	font-size: 21px;
	text-decoration: none;
}
.downloadlink a:link {
	color: #13a69c;
	font-size: 21px;
	text-decoration: none;
}
/* visited link */
.downloadlink a:visited {
	color: #13a69c;
	font-size: 21px;
	text-decoration: none;
}
/* mouse over link */
.downloadlink a:hover {
	color: #13a69c;
	font-size: 21px;
	text-decoration: underline;
}
/* selected link */
.downloadlink a:active {
	color: #13a69c;
	font-size: 21px;
	text-decoration: none;
}
.bubble {
	position: relative;
	width: 90%;
	height: auto;
	padding: 0px;
	background: #8ec8c5;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
}
.bubble:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 0 15px 15px;
	border-color: #8ec8c5 transparent;
	display: block;
	width: 0;
	z-index: 1;
	margin-left: -15px;
	top: -15px;
	left: 17%;
}
.L_News {
	float: left;
	position: relative;
	width: 120px;
	height: 50px;
	padding: 0px;
	background: #11867e;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
}
.L_News:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 11px 0 11px 15px;
	border-color: transparent #11867e;
	display: block;
	width: 0;
	z-index: 1;
	right: -15px;
	top: 15px;
}
.Newstag {
	width: 100%;
	color: #fff;
	padding: 1em;
	font-weight: bold;
}
/*Pages Css*/


.name {
	color: #13a69c;
	font-weight: bold;
}
.Bismillah {
	font-weight: bold;
	color: #13a69c;
}
.Question {
	font-size: 1.3em;
	color: #13A69C;
	font-weight: bold;
}
.Imp_txt {
	font-size: 1.3em;
	line-height: 150%;
}
.Page_Content {
	width: 98%;
	margin: auto;
	border: 0px #CCC solid;
	height: auto;
	padding: 1em;
	line-height: 180%;
	font-size: 1.2em;
}
.Page_Cover {
	width: 100%;
	background-color: #13a69c;
	height: 6em;
	background-image: url(images/page_cover.jpg);
	background-repeat: repeat-x;
}
.Page_Title {
	width: 98%;
	margin: auto;
	height: auto;/* background-color:#069;*/
	padding-top: 1.4em;
	font-size: 1.8em;
	color: #000000;
	font-family: 'ABeeZee', sans-serif;
}
.Books_Carrier {
	width: 100%;
	background-color: #FFFFFF;
	margin: auto;
}
/*.Sufi_Books{ width:48%;float:left;background-color:#FFFFFF; margin:1%; height:auto;border:0px solid #0CC;}*/ /*for 50%*/
.Sufi_Books {
	width: 98%;
	float: left;
	height: auto;
	border: 0px solid #0CC;
	border-bottom: 1px dotted #333;
	margin: 1%;
}
.Sufi_Books_Img {
	float: left;
	width: 15%;
	height: auto;
	background-color: #FFFFFF;/* border:0px solid #0CC;*/
	margin-right: 2%;
}
.Sufi_Books_Img_Listing {
	width: 200px;
	height: 252px;
}
.Sufi_Books_content {
	float: right;
	width: 82%;
	height: auto; /*background-color:#FC3;border:0px solid #63C;*/
}
.Book_Title {
	font-size: 1.5em;
	color: #13a69c;
	font-weight: bold;
	padding: 0.2em;
}
.Book_Description {
	font-size: 0.9em;
	color: #000000;
	height: auto;
	padding: 0.5em;
}/*height 157/16*/
/*.Book_Description_Details{font-size:1.5em; color:#000000;height:auto;}*/
.button_block {
	margin-bottom: 25px;
	width: 18%;
	/*float: left;*/
	display: inline-block;
	
}
.Book_Writer {
	font-size: 1em;
	color: #858585;
	font-weight: bold;
	padding-left: 0.5em;
}
.Book_Writer_Description {
	font-size: 0.8em;
	color: #858585;
	font-weight: bold;
	padding-left: 0.5em;
}
.Sufi_Books_Details {
	width: 100%;
	float: left;
	background-color: #FFFFFF;
	height: auto;
	border: 0px solid #0CC;
}
.Sufi_Books_Details_Img {
	float: left;
	width: 18%;
	height: auto; /*background-color:#36C; border:0px solid #0CC;*/
	margin-right: 2%;
}
.Sufi_Books_Details_content {
	float: right;
	background-color: #FFFFFF;
	padding: 0em;
	width: 80%;
	height: auto; /*background-color:#FC3;border:0px solid #63C;*/
}
.Page_Details {
	width: 100%;
	float: left;
	height: auto;
	border: 0px solid #0CC;
	margin: auto;
}
.Page_Details_Img {
	float: left;
	width: 18%;
	height: auto; /*background-color:#36C; */
	margin-right: 2%;
	border: 0px solid #0CC;
}
.Page_Details_content {
	float: right;
	width: 80%;
	height: auto; /*background-color:#FC3;*/
	border: 0px solid #63C;/*margin-left:0.5%;*/
}
.Page_Nav {
	width: 100%;
	border: 0px solid #03C;
	height: auto;
	float: left;
	background-color: #FFF;
	margin-bottom: 0.5em;
}
.Left_Nav {
	width: 29%;
	float: left;
	height: auto;
}
.Right_Nav {
	width: 70%;
	float: right;
	height: auto;
}
.Golden_block ol {
	/*list-style: decimal;*/
	list-style: decimal-leading-zero;
	
	
	margin-left: 2.5em;
	
}
.Golden_block li {
	margin-left: 1.5em;
	
	
}
.pagemusic {
	background: #ffffff;
	padding: 5px;
	width: 96.5%;
	margin: auto;
}
.back_btn {
	font-size: 0.8em;
	border-radius: 5px;
	/*border:1px solid #ffaa22;*/
	padding: 4px 16px;
	text-decoration: none;
	background-color: #E6E6E6;
	color: #999;
	display: inline-block;
}
.back_btn:hover {
	background-color: #ffab23;
	color: #333;
}
.back_btn:active {
	position: relative;
	top: 1px;
}
/*language menu*/

/* This css button was generated by css-button-generator.com */


	
/* nav */
.s_nav {
	margin: 0px 0;
	z-index: 999999;
}
.s_nav ul {
	margin: 0;
	padding: 0;
}
.s_nav li {
	margin: 0 5px 10px 0;
	padding: 0;
	list-style: none;
	display: inline-block;
 *display:inline; /* ie7 */
}
.s_nav a {
	padding: 3px 4px;
	text-decoration: none;
	color: #999;
	line-height: 100%;
	font-size: 0.8em;
}
.s_nav a:hover {
	color: #000;
}
.s_nav .current a {
	background: #13a69c;
	color: #fff;
	border-radius: 5px;
}
/* right nav */
.s_nav.right ul {
	text-align: right;
}
/* center nav */
.s_nav.center ul {
	text-align: center;
}

@media screen and (max-width: 600px) {
.s_nav {
	position: relative;
	min-height: 40px;
}
.s_nav ul {
	width: 180px;/*180px*/
	padding: 5px 0;
	position: absolute;
	top: 0;
	left: 0;
	border: solid 1px #aaa;
	background: #fff url(images/icon-menu.png) no-repeat 10px 11px;
	border-radius: 5px;
	box-shadow: 0 1px 2px rgba(0,0,0,.3);
}
.s_nav li {
	display: none; /* hide all <li> items */
	margin: 0;
}
.s_nav .current {
	display: block; /* show only current <li> item */
}
.s_nav a {
	display: block;
	padding: 5px 5px 5px 32px;
	text-align: left;
}
.s_nav .current a {
	background: none;
	color: #666;
}
/* on nav hover */
.s_nav ul:hover {
	background-image: none;
}
.s_nav ul:hover li {
	display: block;
	margin: 0 0 5px;
}
.s_nav ul:hover .current {
	background: url(images/icon-check.png) no-repeat 10px 7px;
}
.s_nav ul:focus {
	background-image: none;
}
.s_nav ul:focus li {
	display: block;
	margin: 0 0 5px;
}
.s_nav ul:focus .current {
	background: url(images/icon-check.png) no-repeat 10px 7px;
}
/* right nav */
.s_nav.right ul {
	left: auto;
	right: 0;
}
/* center nav */
.s_nav.center ul {
	left: 50%;
	margin-left: -90px;
}
/* This css button was generated by css-button-generator.com */
	
}
/*end language menu*/


/*blockquote*/
blockquote {
	font-size: 1.2em;
	font-style: italic;
	width: 70%;
	margin: 0.25em 0;
	padding: 0.25em 40px;
	line-height: 1.45;
	position: relative;
	color: #383838;
}
blockquote:before {
	display: block;
	content: "\201C";
	font-size: 80px;
	position: absolute;
	left: -20px;
	top: -20px;
	color: #7a7a7a;
}
blockquote cite {
	color: #999999;
	font-size: 14px;
	display: block;
	margin-top: 5px;
}
/*end blockquote*/

/*book details*/
.transformer-tabs ul {
	list-style: none;
	padding: 0;
	margin: 0;
	border-bottom: 3px solid white;
}
.transformer-tabs li {
	display: inline-block;
	padding: 0;
	vertical-align: bottom;
}
.transformer-tabs li:nth-child(1) .active {
	color: #290b58;
	border-bottom-color: #f5f3f9;
}
.transformer-tabs li:nth-child(2) .active {
	color: #290b58;
	border-bottom-color: #f5f3f9;
}
.transformer-tabs li:nth-child(3) .active {
	color: #290b58;
	border-bottom-color: #f5f3f9;
}
.transformer-tabs li:nth-child(4) .active {
	color: #290b58;
	border-bottom-color: #f5f3f9;
}
.transformer-tabs li:nth-child(5) .active {
	color: #290b58;
	border-bottom-color: #f5f3f9;
}
.transformer-tabs li:nth-child(6) .active {
	color: #290b58;
	border-bottom-color: #f5f3f9;
}
.transformer-tabs li:nth-child(7) .active {
	color: #290b58;
	border-bottom-color: #f5f3f9;
}
.transformer-tabs li:nth-child(8) .active {
	color: #290b58;
	border-bottom-color: #f5f3f9;
}
.transformer-tabs a {
	display: inline-block;
	color: #a99dbc;/*a99dbc*/
	text-decoration: none;
	padding: 0.5rem;
}
.transformer-tabs a.active {
	border-bottom: 3px solid transparent;
	position: relative;
	bottom: -3px;
}

@media (max-width: 700px) {
.transformer-tabs a {
	color: #000000;/*a99dbc*/
}
.transformer-tabs ul {
	border-bottom: 0;
	overflow: hidden;
	position: relative;
	background: #f9fbb6;
	/* fallback */
	background: linear-gradient(#f9fbb6, #fceb8a);
}
.transformer-tabs ul::after {
	content: "☰";
	position: absolute;
	top: 8px;
	right: 15px;
	z-index: 2;
	pointer-events: none;
}
.transformer-tabs ul.open a {
	position: relative;
	display: block;
}
.transformer-tabs li {
	display: block;
}
.transformer-tabs a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.transformer-tabs a.active {
	border: 0;
	z-index: 1;
	background: #f9fbb6;
	/* fallback */
	background: linear-gradient(#f9fbb6, #fceb8a);
}
}
.tabs > div {
	display: none;
	padding: 0.5em;
}
.tabs h2 {
	font-size: 1.5em;
	line-height: 1.6em;
}
.tabs p {
}/*line-height:180%;font-size:1.2em;*/
.tabs > div:nth-of-type(1) {
	background: #E2F6F8;
}
.tabs > div:nth-of-type(2) {
	background: #E2F6F8;
}
.tabs > div:nth-of-type(3) {
	background: #E2F6F8;
}
.tabs > div:nth-of-type(4) {
	background: #E2F6F8;
}
.tabs > div:nth-of-type(5) {
	background: #E2F6F8;
}
.tabs > div:nth-of-type(6) {
	background: #E2F6F8;
}
.tabs > div:nth-of-type(7) {
	background: #E2F6F8;
}
.tabs > div:nth-of-type(8) {
	background: #E2F6F8;
}
.tabs > .active {
	display: block;
}
/*body {
  padding: 1rem;
  background: #333;
  color: white;
  font: 100%/1.4 Sans-Serif;
}*/
/*end book details*/




.Events {
	width: 100%;
	float: left;
	margin: 0%;
	height: auto;
	border: 0px solid #0CC;
	border-bottom: 0px solid #000;
}
.Events_Img {
	float: left;
	width: 18%;
	height: auto;/* border:0px solid #0CC;*/
	margin-right: 2%;
}
.Events_Img_Listing {
	width: 200px;
	height: 252px;
}
.Events_list {
	float: right;
	width: 80%;
	height: auto; /*background-color:#FC3;border:0px solid #63C;*/
}
.Aboutus_Details {
	width: 98%;
	float: left;
	background-color: #CC0;
	margin: 1%;
	height: auto;
	border: 0px solid #0CC;
}
.Aboutus_Details_Img {
	float: left;
	width: 18%;
	height: auto; /*background-color:#36C; border:0px solid #0CC;*/
	margin: 1%;
}
.Aboutus_Details_content {
	float: right;
	width: 78%;
	height: auto; /*background-color:#FC3;border:0px solid #63C;*/
	margin: 1%;
}
.Date_News {
	width: 85%;
	border: 0px #000 solid;
	margin: auto;
}
.Arabic_date {
	width: 90%;
	float: left;
	border: 0px #000 solid;
	height: auto;
	margin: auto;
	padding-top: 0.5em;
	padding-top: 0.5em;
	font-size: 1.2em;
	text-align: center;
	font-weight: bold;
	color: #3a117b;
}
.News_Scroller {
	float: left;
	width: 70%;
	float: left;
	margin-left: 4%;
	border: 0px #000 solid;
	height: auto;/*background-color:#fff;*/
	padding-top: 1em;
	color: #990000;
}
/*accordion*/
.content {
	width: 100%;
	margin: 0px auto;
	padding: 2px;
}
.content h1 {
	font-weight: 400;
	text-transform: uppercase;
	margin: 0;
}
.content h2 {
	font-weight: 400;
	text-transform: uppercase;
	color: #333;
	margin: 0 0 20px;
}
.content p {
	font-size: 1em;
	font-weight: 300;
	line-height: 1.5em;
	margin: 0 0 20px;
}
.content p:last-child {
	margin: 0;
}
.content a.button {
	display: inline-block;
	padding: 10px 20px;
	background: #ff0;
	color: #000;
	text-decoration: none;
}
.content a.button:hover {
	background: #000;
	color: #ff0;
}
.content.title {
	position: relative;
	background: none;
	border: 2px dashed #333;
}
.content.title h1 span.demo {
	display: inline-block;
	font-size: .5em;
	padding: 5px 10px;
	background: #000;
	color: #fff;
	vertical-align: top;
	margin: 7px 0 0;
}
.content.title .back-to-article {
	position: absolute;
	bottom: -20px;
	left: 20px;
}
.content.title .back-to-article a {
	padding: 10px 20px;
	background: #f60;
	color: #fff;
	text-decoration: none;
}
.content.title .back-to-article a:hover {
	background: #f90;
}
.content.title .back-to-article a i {
	margin-left: 5px;
}
.content.white {
	background: #fff;/*box-shadow: 0 0 10px #999;*/
}
.content.black {
	background: #000;
}
.content.black p {
	color: #999;
}
.content.black p a {
	color: #08c;
}
.accordion-container {
	width: 100%;
	margin: 0 0 3px;
	clear: both;
	
	}
.accordion-toggle {
	position: relative;
	display: block;
	padding: 15px;
	font-size: 1em;
	font-weight: 300;
	background: #11867e;
	color: #fff;
	text-decoration: none;
}
.accordion-toggle.open {
	background: #0e6c66;
	color: #fff;
}
.accordion-toggle:hover {
	background: #0e6c66;
}
.accordion-toggle span.toggle-icon {
	position: absolute;
	top: 9px;
	right: 20px;
	font-size: 1.5em;
}
.accordion-content {
	display: none;
	padding: 20px;
	overflow: auto;
}
.accordion-content img {
	display: block;
	float: left;
	margin: 0 15px 10px 0;
	max-width: 100%;
	height: auto;
}

/* media query for mobile */
@media (max-width: 767px) {
.content {
	width: auto;
}
.accordion-content {
	padding: 10px 0;
	overflow: inherit;
}
}
/*accordion*/










/*Golden words */
#dropcontentsubject {
	width: 80%;
	font-weight: bold;
	margin: auto;
	font-size: 1em;
	color: #999;
	text-align: left;
}
.dropcontent {
	width: 100%;
	height: auto;
	/*border: 0.09em solid black;*/
	background-color: #8ec8c5;
	display: block;
	margin: auto;
	font-size: 1.5em;
	text-align: center;
	padding: 0.5em;
	margin-top: 1em;
}
/*end Golden words */

.Books {
	margin-top: 2em;
}
/*books*/

/*end books*/
.Main_Header {
	background-color: #13a69c;
	border-top: 3px solid #f1c940;
	border-bottom: 1px solid #250a4c;
	width: 100%;
	height: auto;
}/*108/16*/
.Top_Nav {
	background-color: #13a69c;
	width: 80%;
	height: 4em;
	border: 0px solid #36C;
	margin: auto;
}/*62/16*/
.Brand {
	margin-top: 0.8em;
	width: 100%;
	border: 0px #000 solid;
	height: auto;
}
.Logo {
	font-size: 2.5em;
	font-family: Arial, Helvetica, sans-serif;
	color: #FFF;
	font-weight: 400;
	float: left;
	border: 0px solid #0CC;
	width: auto;
	-webkit-font-smoothing: antialiased;
}
.Logo a {
	color: #FFF;
	text-decoration: none;
}
.Logo a:hover {
	color: #FFFFFF;
}
.Social {
	border: 0px solid #0CC;
	float: left;
	text-align: right;
	width: 40%;
}
.Logo1 {
	float: right;
	border: 0px solid #0CC;
	width: auto;
}
.Logo1 {
	opacity: 0.4;
	filter: alpha(opacity=40); /* For IE8 and earlier */
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
	-webkit-transition: opacity 1s ease-in-out;
	-moz-transition: opacity 1s ease-in-out;
	-o-transition: opacity 1s ease-in-out;
	transition: opacity 1s ease-in-out;
}
.Logo1:hover {
	opacity: 1.0;
	filter: alpha(opacity=100); /* For IE8 and earlier */
	-webkit-filter: grayscale(0%);
	filter: grayscale(0%);
}
.Navigation {
	border: 0px solid #36C;
	margin: auto;
	width: 100%;
	height: auto;
	font-family: Arial, Helvetica, sans-serif;
}
.container {
	border-top: 0px solid #5b3991;
	width: 100%;
}
/*marquee*/
.marquee {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 35px;/*background-Color:#f4f0f8;border:solid red 0px;*/
}
/*end Marquee*/

.Video_Announce_Tst {
	width: 100%;
	height: auto;
	border: 0px solid #066;
	margin-top: 1em;
	height: auto;
	margin: auto;
}
.Latest_Video {
	width: 32.33%;
	float: left;
	height: auto;
	padding: 0.0em;
	margin-right: 1%;
}
.Announce {
	width: 33.33%;
	float: left;
	margin-left: 0%;
	padding: 0.0em;
}
.Tst {
	width: 32.33%;
	float: left;
	padding: 0.0em;
	margin-left: 1%;
}
.Video_Title {
	font-size: 1.5em;
	padding: 5px;
}
.Announce_Title {
	font-size: 1.5em;
	padding: 5px;
}
.Tst_Title {
	font-size: 1.5em;
	padding: 5px;
}
.Photo_thumbnail {
	width: 100%;
	margin: auto;
	border: 0px solid #009;
	height: auto;
}
/*Video Responsive*/
.Videos_thumbnail {
	width: 100%;
	margin: auto;
	border: 0px solid #009;
	height: auto;
	margin: -top
}
.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
/*end video Responsive*/
/*lighbox image video*/

.Photos_thumbnail {
	margin: auto;
	width: auto;
}
.Video_gallery ul {
	list-style: none outside none;
	padding-left: 0;
}
.Title {
	font: Georgia, "Times New Roman", Times, serif;
	font-weight: bold;
	font-size: 1em;
}
.Date_uplaod {
	font: Georgia, "Times New Roman", Times, serif;
	font-weight: bold;
	font-size: 0.6em;
}

.Video_gallery li {
	display: block;
	float: left;
	height: 16em;
	margin-bottom: 0.8em;
	margin-right: 0.6em;
	width: auto;
	border: 0.1em solid #CCC;
	background-color: #FFFFFF;
	text-align: center;
	line-height: 1.2em;
	color: #000;
	max-width: 250px;
	filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0'/></filter></svg>#grayscale");
	-webkit-filter: none;
	filter: none;
	/* IE 6-9 */
	-moz-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	-webkit-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
}
.Video_gallery li:hover {
	display: block;
	float: left;
	height: 16em;
	margin-bottom: 0.8em;
	margin-right: 0.6em;
	width: auto;
	border: 0.1em solid #411484;
	background-color: #411484;/*411484*/
	text-align: center;
	line-height: 1.2em;
	color: grey;
	
	
	filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
	/* Firefox 10+, Firefox on Android */
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
	filter: gray;
	
}

.Video_gallery li a {
	height: 100%;
	width: 100%;
}
.Video_gallery li a img {
	max-width: 100%;
}
.Video_gallery li figure {
	margin: 0px;
	padding: 0px;
	height: auto;
	width: auto;
}
.gallery ul {
	list-style: none outside none;
	padding-left: 0;
}
.gallery li {
	display: block;
	float: left;
	height: 100px;
	/*margin-bottom: 6px;
			margin-right: 6px;*/
	padding: 0.188em;
	width: 100px;
}
.gallery li a {
	height: 100px;
	width: 100px;
}
.gallery li a img {
	max-width: 100px;
}
/*end lightbox image video */




.Avatar_holder {
	width: 90%;
	height: auto;
	border: 0px solid #006;
}
.Avatar_Img {
	float: left;
	width: 45%;
	height: auto;
	border: 0px solid #006;
}

.Avatar_Details {
	float: right;
	width: 100%;
	height: auto;
	border: 0px solid #006;
	padding-top: 0px;
}
.Avatar_address {
	float: left;
	width: 100%;
	border-bottom: 1px solid #b7f7f3;
	margin-bottom: 1em;
}
/*Contact*/
#Contact_wrapper {
	width: 98%;
	/*	max-width: 1024px;*/
	margin: auto;
	font-size: 0.9em;
	border: 0px solid #F00;
	height: auto;
}
#Contact_wrapper a {
	color: #999;
	text-decoration: none;
}
#Contact_wrapper a:hover {
	color: #FC0;
}
#Contact {
	width: 100%;
	float: left;
	color: #000000;/*padding:0.8em;*/
}
.ContactFloat {
	width: 48%;
	float: left;
	min-width: 200px;
	border: 0px solid #F0F;/*border-right:0.01em solid #999;*//*margin-right:0.4em;*/
}
/*end Contact*/
/*feedback form*/


#contact-form input[type="text"], #contact-form input[type="email"], #contact-form input[type="tel"], #contact-form input[type="url"], #contact-form textarea, #contact-form button[type="submit"] {
	font: 400 12px/12px "Helvetica Neue", Helvetica, Arial, sans-serif;
}
#contact-form {
	/*text-shadow:0 1px 0 #FFF;*/
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	background: #13a69c;
	padding: 1.8em;
}
#contact-form h3 {
	color: #FFF;
	display: block;
	font-size: 28px;
}
#contact-form h4 {
	/*margin:5px 0 15px;*/
	display: block;
	font-size: 21px;
	color: #FFF;
	font-weight: bold;
}
#contact-form label span {
	cursor: pointer;
	color: #FFF;
	display: block;/*margin:5px 0;*//*font-weight:900;*/
}
#contact-form input[type="text"], #contact-form input[type="email"], #contact-form input[type="tel"], #contact-form input[type="url"], #contact-form textarea {
	width: 90%;
	box-shadow: inset 0 1px 2px #DDD, 0 1px 0 #FFF;
	-webkit-box-shadow: inset 0 1px 2px #DDD, 0 1px 0 #FFF;
	-moz-box-shadow: inset 0 1px 2px #DDD, 0 1px 0 #FFF;
	border: 1px solid #CCC;
	background: #FFF;
	margin: 0 0 5px;
	padding: 10px;
	border-radius: 5px;
}
#contact-form input[type="text"]:hover, #contact-form input[type="email"]:hover, #contact-form input[type="tel"]:hover, #contact-form input[type="url"]:hover, #contact-form textarea:hover {
	-webkit-transition: border-color 0.3s ease-in-out;
	-moz-transition: border-color 0.3s ease-in-out;
	transition: border-color 0.3s ease-in-out;
	border: 1px solid #AAA;
}
#contact-form textarea {
	height: 100px;
	max-width: 100%;
}
#contact-form button[type="submit"] {
	cursor: pointer;
	width: 97%;
	border: none;
	background: #991D57;
	background-image: linear-gradient(bottom, #8C1C50 0%, #991D57 52%);
	background-image: -moz-linear-gradient(bottom, #8C1C50 0%, #991D57 52%);
	background-image: -webkit-linear-gradient(bottom, #8C1C50 0%, #991D57 52%);
	color: #FFF;
	margin: 0 0 5px;
	padding: 10px;
	border-radius: 5px;
}
#contact-form button[type="submit"]:hover {
	background-image: linear-gradient(bottom, #9C215A 0%, #A82767 52%);
	background-image: -moz-linear-gradient(bottom, #9C215A 0%, #A82767 52%);
	background-image: -webkit-linear-gradient(bottom, #9C215A 0%, #A82767 52%);
	-webkit-transition: background 0.3s ease-in-out;
	-moz-transition: background 0.3s ease-in-out;
	transition: background-color 0.3s ease-in-out;
}
#contact-form button[type="submit"]:active {
	box-shadow: inset 0 1px 3px rgba(0,0,0,0.5);
}
#contact-form input:focus, #contact-form textarea:focus {
	outline: 0;
	border: 1px solid #999;
}
::-webkit-input-placeholder {
 color:#888;
}
:-moz-placeholder {
 color:#888;
}
::-moz-placeholder {
 color:#888;
}
:-ms-input-placeholder {
 color:#888;
}
/*end feedback Form*/



/*download button*/
a.download_button {
	position: relative;
	color: rgba(255,255,255,1);
	text-decoration: none;
	background-color: rgba(219,87,5,1);
	/* font-family: 'Yanone Kaffeesatz';*/
	font-weight: 400;
	font-size: 1em;
	display: block;
	padding: 4px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
	-moz-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
	box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
	/*margin: 100px auto;*/
	width: 10em;
	text-align: center;
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
}
a.download_button:active {
	-webkit-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
	-moz-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
	box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
	position: relative;
	top: 6px;
}
a.read_button {
	position: relative;
	color: rgba(255,255,255,1);
	text-decoration: none;
	background-color: rgba(1, 89, 83, 1);
	/* font-family: 'Yanone Kaffeesatz';*/
	font-weight: 400;
	font-size: 1em;
	display: block;
	padding: 4px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 0px 9px 0px rgba(16, 140, 132, 1), 0px 9px 25px rgba(0,0,0,.7);
	-moz-box-shadow: 0px 9px 0px rgba(16, 140, 132, 1), 0px 9px 25px rgba(0,0,0,.7);
	box-shadow: 0px 9px 0px rgba(16, 140, 132, 1), 0px 9px 25px rgba(0,0,0,.7);
	/*margin: 100px auto;*/
	width: 10em;
	text-align: center;
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
}
a.read_button:active {
	-webkit-box-shadow: 0px 3px 0px rgba(35, 11, 70, 1), 0px 3px 6px rgba(0,0,0,.9);
	-moz-box-shadow: 0px 3px 0px rgba(35, 11, 70, 1), 0px 3px 6px rgba(0,0,0,.9);
	box-shadow: 0px 3px 0px rgba(35, 11, 70, 1), 0px 3px 6px rgba(0,0,0,.9);
	position: relative;
	top: 6px;
}
/*end download button*/




/*footer*/
/*http://jsfiddle.net/Gar3H/5/*/
.Main_Footer {
	font-family: 'ABeeZee', sans-serif;
	width: 95%;
	background-color: #333;
	margin: auto;
	color: #999;
	font-size: 1em;
	color: #999;
	padding: 1%;
	height: auto;
}
.Main_Footer a {
	color: #999;
	text-decoration: none;
}
.Main_Footer a:hover {
	color: #FC0;
}
.FooterLink {
	display: block;
}
#footer {
	width: 100%;
	float: left;
	color: #FFFFFF;
	padding-top: 0.5em;
}
.footerFloat {
	width: 25%;
	float: left;
	min-width: 200px;
	padding-top: 1em;
	line-height: 150%;
}
.donwloadbuttonblock {
	width: 80%;
	float: right;
}

/*end footer*/





/*END GENERAL CSS++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

/*https://codepen.io/dudleystorey/pen/ehKpi*/
@keyframes slidy {
0% {
left: 0%;
}
20% {
left: 0%;
}
25% {
left: -100%;
}
45% {
left: -100%;
}
50% {
left: -200%;
}
70% {
left: -200%;
}
75% {
left: -300%;
}
95% {
left: -300%;
}
100% {
left: -400%;
}
}
div#slider {
	overflow: hidden;
}
div#slider figure img {
	width: 20%;
	float: left;
}
div#slider figure {
	position: relative;
	width: 500%;
	margin: 0;
	left: 0;
	text-align: left;
	font-size: 0;
	animation: 30s slidy infinite;
}
/*responvie(http://smasala.github.io/responsive-tables-js/demo.html)*/

table {
	width: 100%;
	border-collapse: collapse;
}
tr:nth-of-type(odd) {
	background: #dcfbfa;
}
th {
	background: #13a69c;
	color: white;
	font-weight: bold;
}
td, th {
	padding: 10px;
	border: 0px solid #dcfbfa;
	text-align: left;
	font-size: 1.2em;
}
.down_but {
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0px;
	font-family: Arial, Helvetica, sans-serif;
	color: #ffffff;
	font-size: 14px;
	background: #decd5b;
	padding: 10px 20px 10px 20px;
	text-decoration: none;
}
.down_but:hover {
	background: #fcdc3c;
	text-decoration: none;
}
/*end */






/************************************************************************************
NAV
*************************************************************************************/
#nav-wrap {
	margin-top: 0px;
	font-family: 'ABeeZee', sans-serif;
}
/* menu icon */
#menu-icon {
	display: none; /* hide menu icon initially */
}
#nav, #nav li {
	margin: 0;
	padding: 0;
}
#nav li {
	list-style: none;
	float: left;
	margin-right: 5px;
}
/* nav link */
#nav a {
	padding: 3px 4px;
	text-decoration: none;
	color: #000;
	line-height: 100%;
	font-size: 0.8em;/*padding: 4px 15px;
	display: block;
	color: #000;
	background: #ecebeb;*/
}
#nav a:hover {
	background: #f8f8f8;
	color: #000;
}
/* nav dropdown */
#nav ul {
	background: #fff;
	padding: 2px;
	position: absolute;
	border: solid 1px #ccc;
	display: none; /* hide dropdown */
	width: 250px;
}
#nav ul li {
	float: none;
	margin: 0;
	padding: 0;
}
#nav li:hover > ul {
	display: block; /* show dropdown on hover */
}
#nav .current a {
	background: #13a69c;
	color: #fff;
	border-radius: 5px;
}

/************************************************************************************
MOBILE
*************************************************************************************/
@media screen and (max-width: 600px) {
/* nav-wrap */
#nav-wrap {
	position: relative;
}
/* menu icon */
#menu-icon {
	color: #000;
	width: 42px;
	height: 30px;
	background: #ecebeb url(images/menu-icon.png) no-repeat 10px center;
	padding: 8px 10px 0 42px;
	cursor: pointer;
	border: solid 1px #666;
	display: block; /* show menu icon */
}
#menu-icon:hover {
	background-color: #f8f8f8;
}
#menu-icon.active {
	background-color: #bbb;
}
/* main nav */
#nav {
	clear: both;
	position: absolute;
	top: 38px;
	width: 160px;
	z-index: 10000;
	padding: 5px;
	background: #f8f8f8;
	border: solid 1px #999;
	display: none; /* visibility will be toggled with jquery */
}
#nav li {
	clear: both;
	float: none;
	margin: 5px 0 5px 10px;
}
#nav a, #nav ul a {
	font: inherit;
	background: none;
	display: inline;
	padding: 0;
	color: #000;
	border: none;
}
#nav a:hover, #nav ul a:hover {
	background: none;
	color: #000;
}
#nav .current a {
	background: #13a69c;
	color: #fff;
	border-radius: 5px;
	padding: 5px;
}
/* dropdown */
#nav ul {
	width: auto;
	position: static;
	display: block;
	border: none;
	background: inherit;
}
#nav ul li {
	margin: 3px 0 3px 15px;
}
}




@media screen and (min-width: 800px) {
/* ensure #nav is visible on desktop version */
#nav {
	display: block !important;
}
}

/*320px++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/



@media screen and (max-width: 320px) {
/*main strucure responsive css*/
.New_Container {

	width: 99%;
}
.New_Left {
	width: 4%;
}
.New_Left_Page {
	width: 4%;
}
.New_Content_Centre {
	width: 92%;
}
.New_Right_Page {
	width: 4%;
}
.New_Right {
	width: 4%;
}
/*end main strucure responsive css*/	


.New_Roll_Over {
	margin: 2px;
}
.New_Slider {
	width: 100%;
	float: left;
	background-color: #33F;
	height: auto;
}
.New_Message_Date_News {
	width: 100%;
	margin: auto;
	border: 0px solid #F00;
}
.New_Messsage {
	width: 100%;
	float: left;
	height: auto;
}
.New_Date {
	width: 100%;
	float: left;
	height: auto;
	padding-top: 5px;
	padding-bottom: 5px;
}
.New_News {
	width: 100%;
	float: left;
	height: auto;
}
.bubble {
	width: 96%;
	margin: auto;
}
#dropcontentsubject {
	width: 100%;
	font-size: 0.5em;
}
.L_News {
	width: 50px;
	height: 38px;
}
.L_News:after {
	border-width: 5px 0 5px 7px;
	right: -7px;
	top: 10px;
}
.Newstag {
	padding: 0.4em;
	font-size: 0.8em;
}
.News_Scroller {
	width: 75%;
	margin-top: 1%;
	padding-top: 0em;
}
.New_Video_Announce_Tst {
	width: 100%;
}
.New_Video_block {
	width: 100%;
}
.New_Announcement_block {
	width: 100%;
}
.New_Testimonial_block {
	width: 100%;
}
.Kalaamlink a:link {
	color: #13a69c;
	font-size: 14px;
	text-decoration: none;
}
/* visited link */
.Kalaamlink a:visited {
	color: #13a69c;
	text-decoration: none;
}
/* mouse over link */
.Kalaamlink a:hover {
	color: #13a69c;
	text-decoration: none;
}
/* selected link */
.Kalaamlink a:active {
	color: #13a69c;
	text-decoration: none;
}
.Navigation {
	background-color: #13a69c;
	border: 0px solid #36C;
	margin: auto;
	width: 100%;
	height: auto;
}
.Index_page_Content {
	width: 96%;
	margin: auto;
	border: 0px #000 solid;
	height: auto;
}
.name {
	color: #63C;
	font-weight: bold;
}
.Question {
	font-size: 1em;
}
.Imp_txt {
	font-size: 1.1em;
	line-height: 150%;
}
.Page_Content {
	width: 96%;
	margin: auto;
	border: 0px #999 solid;
	height: auto;
	;
	line-height: 180%;
	font-size: 0.8em;
	padding: 0.2em;
}
.Video_Announce_Tst {
	width: 99%;
	height: auto;
	border: 0px solid #066;
	margin-top: 1em;
	height: auto;
	margin: auto;
}
.Latest_Video {
	width: 98%;
	margin: auto;
	float: none;
	padding: 0em;
}
.Announce {
	width: 98%;
	height: auto;
	margin: auto;
	float: none;
	padding: 0em;
}
.Tst {
	width: 98%;
	margin: auto;
	float: none;
	padding: 0em;
}
.Video_Title {
	font-size: 1em;
}
.Announce_Title {
	font-size: 1em;
}
.Tst_Title {
	font-size: 1em;
}
.Top_Nav {
	background-color: #13a69c;
	width: 98%;
	height: 3em;
	border: 0px solid #36C;
	margin: auto;
}/*62/16*/
.Brand {
	margin-top: 0.5em;
	width: 100%;
	border: 0px #000 solid;
	height: auto;
}
.Logo {
	font-size: 1.8em;
	font-family: 'Crete Round', serif;
	color: #FFF;
	font-weight: 200;
	float: left;
	border: 0px solid #0CC;
	width: auto;
	-webkit-font-smoothing: antialiased;
}
.Date_News {
	width: 98%;
	margin: auto;
	border: 0px #000 solid;
}
.Arabic_date {
	width: 100%; /*border:1px #000 solid; height:auto; width:420px;*/
	border: 0px solid #600;
	margin: auto;
	padding-top: 0px;
	font-size: 0.8em;
	text-align: center;
	font-weight: bold;
	color: #030;
	color: #3a117b;
}
.Sufi_Books {
	width: 98%;
}
.Sufi_Books_Img {
	width: 50%;
	text-align: center;
	border: 0px #000 solid;
	margin: auto;
	float: none;
}
.Sufi_Books_content {
	width: 98%;
	border: 0px #000 solid;
}
/*.Book_Title{width:98%;font-size:1.5em; color:#13a69c;font-weight:bold; text-align:left;}*/
.Book_Description {
	width: 98%;
	font-size: 0.9em;
	line-height: 1.6em;
	color: #000000;
	height: auto;
}/*height 157/16*/
/*.Book_Description_Details{font-size:1.5em; color:#000000;height:auto;}*/
.Book_Writer {
	width: 98%;
	font-size: 0.9em;
	color: #858585;
	font-weight: normal;
}
.Book_Writer_Description {
	width: 98%;
	font-size: 0.7em;
	color: #858585;
	font-weight: normal;
	display: none;
}
.Sufi_Books_Details {
	width: 98%;
	float: left;
}
.Sufi_Books_Details_Img {
	display: none;/*width:50%;border:0px #000 solid; margin:auto;float:none; margin-bottom:1em;*/
}
.Sufi_Books_Details_content {
	background-color: #FFFFFF;
	width: 98%;
	height: auto;
}
.Book_Title {
	font-size: 1.4em;
	color: #13a69c;
	font-weight: bold;
	text-align: center;
}
.Page_Details {
	width: 100%;
	height: auto;
	border: 0px solid #0CC;
	margin: auto;
	padding: 0.0em;
}
.Page_Details_Img {
	width: 100%;
	height: auto;
	display: none; /*background-color:#36C; border:0px solid #0CC;*//* margin-right:1%;*/
}
.Page_Details_content {
	width: 100%;
	border: 0px red solid;
}
.Page_Nav {
	width: 98%;
	border: 0px solid #03C;
	height: auto;
	float: left;
	padding: 0.2em;
}
.Left_Nav {
	width: 29%;
	float: left;
	height: auto;
}
.Right_Nav {
	width: 70%;
	float: right;
	height: auto;
}
.pagemusic {
	width: 88%;
}
.back_btn {
	font-size: 0.8em;
	border-radius: 5px;
	/*border:1px solid #ffaa22;*/
	padding: 8px 20px;
	text-decoration: none;
	background-color: #E6E6E6;
	color: #999;
	display: inline-block;
}
.back_btn:hover {
	background-color: #ffab23;
	color: #333;
}
.back_btn:active {
	position: relative;
	top: 1px;
}
.name {
	color: #63C;
}
.Bismillah {
	font-weight: bold;
	color: #999;
}
.Question {
	font-size: 1.6em;
	color: #636;
	font-weight: bold;
}
.Page_Cover {
	width: 100%;
	background-color: #339;
	height: 3em;
	border-top: 0.025em solid #5b3991;
	background-image: url(images/page_cover.jpg);
	background-repeat: repeat-x;
}
.Page_Title {
	width: 97%;
	margin: auto; /*border:1px #000 solid;*/
	height: auto;/* background-color:#069;*/
	padding-top: 0.5em;
	font-size: 1.2em;
	color: #000;
	font-family: 'Playfair Display', serif;
	font-weight: bold;
}
.Events {
	width: 100%;/*float:left;*/
	background-color: #FFFFFF;
	margin: 0%;
	height: auto;/*border:0px solid #0CC; border-bottom:0px solid #000;*/
}
.Events_Img { /*float:left;*/
	display: none;  /*width:100%; height:auto; background-color:#ef424b;*//* border:0px solid #0CC;*/ /*margin:1%;*/
}
.Events_Img_Listing { /*width:200px; height:252px;*/
}
.Events_list {/*float:right;*/
	width: 100%;
	height: auto;/*background-color:#FC3;border:0px solid #63C;*//*margin:1%;*/
}
/*books tab*/

/*end book tab*/






/*Golden words */
#dropcontentsubject {
	width: 85%;
	font-size: 0.8em;
	color: #999;
	text-align: center;
	font-weight: normal;
}
.dropcontent {
	width: 85%;
	height: auto;
	font-size: 0.9em;
	font-weight: bold;
}
/*end Golden words */


/*lighbox image video*/

.Title {
}
.Date_uplaod {
}
.Video_gallery li {
	height: 8em;
	width: 10.5em;
	line-height: 1em;
	margin-bottom: 0.4em;
	margin-right: 0.6em;
	filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0'/></filter></svg>#grayscale");
	-webkit-filter: none;
	filter: none;
}
.Video_gallery li:hover {
	height: 8em;
	width: 10.5em;
	line-height: 1em;
	margin-bottom: 0.4em;
	margin-right: 0.6em;
}
.Video_gallery li a img {
	max-width: 100%;
	margin-bottom: 0.4em;
}
.gallery ul {
	list-style: none outside none;
	padding-left: 0px;
}
.gallery li {
	display: block;
	float: left;
	height: 80px;
	/*margin-bottom: 6px;
			margin-right: 6px;*/
	padding: 0.188em;
	width: 80px;
}
.gallery li a {
	height: 80px;
	width: 80px;
}
.gallery li a img {
	max-width: 80px;
}
/*end lightbox image video */



.Avatar_holder {
	width: 100%;
	height: auto;
	border: 0px solid #006;
}
.Avatar_Img {
	float: left;
	width: 35%;
	height: 50px;
	border: 0px solid #006;
}
.Avatar_Details {
	float: right;
	width: 79%;
	height: 50px;
	border: 0px solid #006;
	padding-top: 5px;
}
.Avatar_address {
	float: left;
	width: 100%;
}
/*contact */
.ContactFloat {
	width: 98%;
	min-width: 280px;/*border-right:0.01em solid #999;*/
	/*margin-right:0.4em;*/
	
    
}

/*end contact*/
.button_block {
	margin-bottom: 25px;
	width: 100%;
	float: left;
}
/*download button*/
a.download_button {
	position: relative;
	color: rgba(255,255,255,1);
	text-decoration: none;
	background-color: rgba(219,87,5,1);
	/* font-family: 'Yanone Kaffeesatz';*/
	font-weight: 400;
	font-size: 1em;
	display: block;
	padding: 4px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
	-moz-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
	box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
	/*margin: 100px auto;*/
	width: 10em;
	text-align: center;
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
}
a.download_button:active {
	-webkit-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
	-moz-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
	box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
	position: relative;
	top: 6px;
}
a.read_button {
	position: relative;
	color: rgba(255,255,255,1);
	text-decoration: none;
	background-color: rgba(89, 0, 255, 1);
	/* font-family: 'Yanone Kaffeesatz';*/
	font-weight: 400;
	font-size: 1em;
	display: block;
	padding: 4px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 0px 9px 0px rgba(65, 20, 132, 1), 0px 9px 25px rgba(0,0,0,.7);
	-moz-box-shadow: 0px 9px 0px rgba(65, 20, 132, 1), 0px 9px 25px rgba(0,0,0,.7);
	box-shadow: 0px 9px 0px rgba(65, 20, 132, 1), 0px 9px 25px rgba(0,0,0,.7);
	/*margin: 100px auto;*/
	width: 10em;
	text-align: center;
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
}
a.read_button:active {
	-webkit-box-shadow: 0px 3px 0px rgba(35, 11, 70, 1), 0px 3px 6px rgba(0,0,0,.9);
	-moz-box-shadow: 0px 3px 0px rgba(35, 11, 70, 1), 0px 3px 6px rgba(0,0,0,.9);
	box-shadow: 0px 3px 0px rgba(35, 11, 70, 1), 0px 3px 6px rgba(0,0,0,.9);
	position: relative;
	top: 6px;
}
/*end download button*/


/*Footer*/
.Main_Footer {
	width: 86%;
	background-color: #333;
	margin: auto;
	color: #999;
	font-size: 0.9em;
	color: #999;
	padding: 0.5em;
	height: auto;
}
.FooterLink {
	display: none;
}
#footer {
	width: 97%;
	margin: auto;
	color: #FFFFFF;
	padding-top: 0.3em;
	padding-bottom: 0.4em;
}
.footerFloat {
	width: 98%;
	float: left;
	min-width: 200px;
	padding-top: 1em;
	line-height: 150%;
}
/*End Footer*/


}

/*end 320px++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/








/*481-767px++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

@media screen and (min-width:320px) and (max-width: 767px) {
.pagemusic {
	width: 92%;
}
/*main strucure responsive css*/
.New_Container {
	width: 98%;
}
.New_Left {
	width: 3%;
}
.New_Left_Page {
	width: 3%;
}
.New_Content_Centre {
	width: 94%;
}
.New_Right_Page {
	width: 3%;
}
.New_Right {
	width: 3%;
}
/*end main strucure responsive css*/	


.New_Roll_Over {
	margin: 2px;
}
.New_Slider {
	width: 100%;
	float: left;
	background-color: #fff;
	height: auto;
}
.New_Message_Date_News {
	width: 100%;
	margin: auto;
	border: 0px solid #F00;
}
.New_Messsage {
	width: 100%;
	float: left;
	height: auto;
}
.New_Date {
	width: 100%;
	float: left;
	height: auto;
	padding: 0.5em;
}
.New_News {
	width: 100%;
	float: left;
	height: auto;
}
.bubble {
	width: 96%;
	margin: auto;
}
#dropcontentsubject {
	width: 100%;
	font-size: 0.5em;
}
.L_News {
	width: 100px;
	height: 38px;
}
.L_News:after {
	border-width: 5px 0 5px 7px;
	right: -7px;
	top: 10px;
}
.Newstag {
	padding: 0.4em;
	font-size: 0.8em;
}
.News_Scroller {
	width: 70%;
	padding-top: 0em;
}
.New_Video_Announce_Tst {
	width: 100%;
}
.New_Video_block {
	width: 98%;
	margin: 1%;
}
.New_Announcement_block {
	width: 98%;
	margin: 1%;
}
.New_Testimonial_block {
	width: 98%;
	margin: 1%;
}
.Kalaamlink a:link {
	color: #13a69c;
	font-size: 14px;
	text-decoration: none;
}
/* visited link */
.Kalaamlink a:visited {
	color: #13a69c;
	text-decoration: none;
}
/* mouse over link */
.Kalaamlink a:hover {
	color: #13a69c;
	text-decoration: none;
}
/* selected link */
.Kalaamlink a:active {
	color: #13a69c;
	text-decoration: none;
}
.Top_Nav {
	width: 98%;
	height: 3.5em;
}/*62/16*/
.Navigation {
	width: 100%;
}
.Brand {
	margin-top: 0.4em;
}
.Logo {
	font-size: 2em;
}
.Index_page_Content {
	width: 96%;
	margin: auto;
	border: 0px #000 solid;
	height: auto;
}
.Video_Announce_Tst {
	width: 100%;
	margin-top: 1em;
	margin: auto;
	border: 0px solid #0C9;
}
.Latest_Video {
	width: 48%;
	float: left;
	padding: 0.0em;
	margin-right: 0.5%;
}
.Announce {
	width: 51%;
	float: right;
	padding: 0.0em;
	margin-left: 0.5%;
}
.Tst {
	width: 100%;
	padding: 0.0em;
	float: left;
	margin: auto;
}
.Video_Title {
	font-size: 1.0em;
}
.Announce_Title {
	font-size: 1.0em;
}
.Tst_Title {
	font-size: 1.0em;
}
.Date_News {
	width: 98%;
	margin: auto;
	border: 0px #000 solid;
}
.Arabic_date {
	width: 100%;
	font-size: 1em;
	text-align: center;
	font-weight: bold;
	color: #3a117b;
}
.Sufi_Books {
	width: 100%;
	float: left;
	height: auto;
	border: 0px solid #0CC;
	border-bottom: 1px solid #333;
	margin: 0.3%;
}
.Sufi_Books_Img {
	float: left;
	width: 25%;
	height: auto;
	background-color: #FFFFFF;/* border:0px solid #0CC;*/
	margin-right: 1%;
}
.Sufi_Books_Img_Listing {
	width: 200px;
	height: 252px;
}
.Sufi_Books_content {
	float: right;
	width: 74%;
	height: auto; /*background-color:#FC3;border:0px solid #63C;*/
}
.Book_Title {
	font-size: 2em;
	color: #13a69c;
	font-weight: bold;
	padding: 0.2em;
}
.Book_Description {
	font-size: 1em;
	color: #000000;
	height: auto;
	padding: 0.5em;
	line-height: 160%;
}/*height 157/16*/
.Book_Writer {
	font-size: 1em;
	color: #858585;
	font-weight: bold;
	padding-left: 0.5em;
}
.Book_Writer_Description {
	display: none;
}
.Title {
	font-size: 0.9em;
}
/*Golden words */
#dropcontentsubject {
	width: 85%;
	font-size: 0.8em;
	font-weight: normal;
}
.dropcontent {
	width: 85%;
	font-size: 1.4em;
	font-weight: bold;
}
/*end Golden words */

.Top_Nav {
	width: 98%;
	height: 3em;
}/*62/16*/
.Brand {
	margin-top: 0.5em;
}
.Logo {
	font-size: 2em;
}
.Question {
	font-size: 1.1em;
	color: #636;
	font-weight: bold;
}
.Imp_txt {
	font-size: 1.1em;
	line-height: 150%;
}
.Page_Content {
	width: 94%;
	padding: 0.5em;
	line-height: 180%;
	font-size: 1em;
	border: 0px solid #060;
}
.Page_Cover {
	height: 4em;
}
.Page_Title {
	width: 98%;
	padding-top: 0.6em;
	font-size: 1.5em;
}
.Events {
	width: 96%;
	padding: 0.1em;
}
.Events_Img {
	display: none;
}
.Events_Img_Listing {
	width: 200px;
	height: 252px;
}
.Events_list {
	width: 100%;
}
.Sufi_Books_Details {
	width: 98%;
}
.Sufi_Books_Details_Img {
	display: none;
}
.Sufi_Books_Details_content {
	width: 100%;
}
/*lighbox image video*/
.Video_gallery li {
	height: 10em;
	width: 10.5em;
	line-height: 1em;
	margin-bottom: 0.4em;
	margin-right: 0.6em;
	filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0'/></filter></svg>#grayscale");
	-webkit-filter: none;
	filter: none;
}
.Video_gallery li:hover {
	height: 10em;
	width: 10.5em;
	line-height: 1em;
	margin-bottom: 0.4em;
	margin-right: 0.6em;
}
.Video_gallery li a img {
	max-width: 100%;
	margin-bottom: 0.4em;
}
/*.Video_gallery li {width:12em;}			
		.Video_gallery li:hover {width:12em;}*/
		
/*end lightbox image video */




.Books_Carrier {
	width: 100%;
	background-color: #FFFFFF;
	margin: auto;
}
.Page_Details {
	width: 96%;
	padding: 0.1em;
}
.Page_Details_Img {
	display: none;
}
.Page_Details_content {
	width: 100%;
}
.Page_Nav {
	width: 98%;
	float: left;
	padding: 0.3em;
}
.Left_Nav {
	width: 30%;
	float: left;
	height: auto;
}
.Right_Nav {
	width: 70%;
	float: right;
	height: auto;
}
#Contact_wrapper {
	font-size: 0.8em;
}
.ContactFloat {
	width: 98%;
}
/*end Contact*/

.button_block {
	margin-bottom: 25px;
	width: 100%;
	float: left;
}
/*download button*/
a.download_button {
	position: relative;
	color: rgba(255,255,255,1);
	text-decoration: none;
	background-color: rgba(219,87,5,1);
	/* font-family: 'Yanone Kaffeesatz';*/
	font-weight: 400;
	font-size: 1em;
	display: block;
	padding: 4px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
	-moz-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
	box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
	/*margin: 100px auto;*/
	width: 9.5em;
	text-align: center;
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
}
a.download_button:active {
	-webkit-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
	-moz-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
	box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
	position: relative;
	top: 6px;
}
a.read_button {
	position: relative;
	color: rgba(255,255,255,1);
	text-decoration: none;
	background-color: rgba(89, 0, 255, 1);
	/* font-family: 'Yanone Kaffeesatz';*/
	font-weight: 400;
	font-size: 1em;
	display: block;
	padding: 4px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 0px 9px 0px rgba(65, 20, 132, 1), 0px 9px 25px rgba(0,0,0,.7);
	-moz-box-shadow: 0px 9px 0px rgba(65, 20, 132, 1), 0px 9px 25px rgba(0,0,0,.7);
	box-shadow: 0px 9px 0px rgba(65, 20, 132, 1), 0px 9px 25px rgba(0,0,0,.7);
	/*margin: 100px auto;*/
	width: 9.5em;
	text-align: center;
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
}
a.read_button:active {
	-webkit-box-shadow: 0px 3px 0px rgba(35, 11, 70, 1), 0px 3px 6px rgba(0,0,0,.9);
	-moz-box-shadow: 0px 3px 0px rgba(35, 11, 70, 1), 0px 3px 6px rgba(0,0,0,.9);
	box-shadow: 0px 3px 0px rgba(35, 11, 70, 1), 0px 3px 6px rgba(0,0,0,.9);
	position: relative;
	top: 6px;
}
/*end download button*/

/*Footer*/
.Main_Footer {
	width: 94%;
	background-color: #333;
	margin: auto;
	color: #999;
	font-size: 0.8em;
	color: #999;
	padding: 0.5em;
	height: auto;
	border: 0px solid #0C3;
}
.FooterLink {
	display: none;
}
#footer {
	width: 96%;
	margin: auto;
	color: #FFFFFF;
	padding-top: 0.3em;
	padding-bottom: 0.4em;
}
.footerFloat {
	width: 50%;
	float: left;
	min-width: 200px;
	padding-top: 0.7em;
	line-height: 150%;
}
/*End Footer*/
	
}

/*end 481-767px++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

/*768-1024px++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media screen and (min-width:768px) and (max-width:1024px) {
.pagemusic {
	width: 94%;
}
/*main strucure responsive css*/
.New_Container {
	width: 97%;
}
.New_Left {
	width: 2.5%;
}
.New_Left_Page {
	width: 2.5%;
}
.New_Content_Centre {
	width: 95%;
}
.New_Right_Page {
	width: 2.5%;
}
.New_Right {
	width: 2.5%;
}
/*end main strucure responsive css*/

.New_Roll_Over {
	margin: 2px;
}
.New_Slider {
	width: 100%;
	float: left;
	background-color: #fff;
	height: auto;
}
.New_Message_Date_News {
	width: 100%;
	margin: auto;
	border: 0px solid #F00;
}
.New_Messsage {
	width: 100%;
	float: left;
	height: auto;
}
.New_Date {
	width: 100%;
	float: left;
	height: auto;
	padding: 1em;
}
.New_News {
	width: 100%;
	float: left;
	height: auto;
}
.bubble {
	width: 96%;
	margin: auto;
}


.L_News {
	width: 90px;
	height: 38px;
}
.L_News:after {
	border-width: 5px 0 5px 7px;
	right: -7px;
	top: 10px;
}
.Newstag {
	padding: 0.4em;
	font-size: 0.8em;
}
.News_Scroller {
	width: 80%;
	padding-top: 0em;
}
.New_Video_Announce_Tst {
	width: 100%;
}
.New_Video_block {
	width: 98%;
	margin: 1%;
}
.New_Announcement_block {
	width: 98%;
	margin: 1%;
}
.New_Testimonial_block {
	width: 98%;
	margin: 1%;
}
.Kalaamlink a:link {
	color: #13a69c;
	font-size: 14px;
	text-decoration: none;
}
/* visited link */
.Kalaamlink a:visited {
	color: #13a69c;
	text-decoration: none;
}
/* mouse over link */
.Kalaamlink a:hover {
	color: #13a69c;
	text-decoration: none;
}
/* selected link */
.Kalaamlink a:active {
	color: #13a69c;
	text-decoration: none;
}
.Top_Nav {
	width: 98%;
	height: 3.5em;
}/*62/16*/
.Navigation {
	width: 100%;
}
.Brand {
	margin-top: 0.4em;
}
.Logo {
	font-size: 2.5em;
}
.Index_page_Content {
	width: 95%;
}
.Video_Announce_Tst {
	width: 100%;
	margin-top: 1em;
	margin: auto;
}
.Latest_Video {
	width: 47.8%;
	float: left;
	padding: 0.0em;
	margin-right: 0.5%;
}
.Announce {
	width: 49.2%;
	float: right;
	padding: 0.0em;
	margin-left: 0.5%;
}
.Tst {
	width: 100%;
	padding: 0.0em;
	float: left;
	margin: auto;
}
.Video_Title {
	font-size: 1.0em;
}
.Announce_Title {
	font-size: 1.0em;
}
.Tst_Title {
	font-size: 1.0em;
}
.Date_News {
	width: 98%;
	margin: auto;
	border: 0px #000 solid;
}
.Arabic_date {
	width: 100%;
	font-size: 1em;
	text-align: center;
	font-weight: bold;
	color: #3a117b;
	float: left;
}
/*Golden words */
#dropcontentsubject {
	width: 90%;
	font-size: 1.5em;
	font-weight: bold;
}
.dropcontent {
	width: 90%;
	
}
/*end Golden words */

.Top_Nav {
	width: 98%;
	height: 3em;
}/*62/16*/
.Brand {
	margin-top: 0.5em;
}
.Logo {
	font-size: 2em;
}
.Page_Content {
	width: 94%;
	padding: 0.5em;
	line-height: 180%;
	font-size: 1em;
	border: 0px solid #060;
}
.Page_Cover {
	height: 4em;
}
.Page_Title {
	width: 98%;
	padding-top: 0.6em;
	font-size: 1.5em;
}
.Events {
	width: 100%;
	float: left;
	background-color: #FFFFFF;
	margin: 0%;
	height: auto;
	border: 0px solid #0CC;
	border-bottom: 0px solid #000;
}
.Events_Img {
	float: left;
	width: 18%;
	height: auto;
	background-color: #ef424b;/* border:0px solid #0CC;*/
	margin: 1%;
}
.Events_Img_Listing {
	width: 200px;
	height: 252px;
}
.Events_list {
	float: right;
	width: 78%;
	height: auto; /*background-color:#FC3;border:0px solid #63C;*/
	margin: 1%;
}
.Sufi_Books_Details {
	width: 98%;
	float: left;
	background-color: #FFFFFF;
	margin: 1%;
	height: auto;
	border: 0px solid #0CC;
}
.Sufi_Books_Details_Img {
	float: left;
	width: 18%;
	height: auto; /*background-color:#36C; border:0px solid #0CC;*/
	margin-right: 1%;
}
.Sufi_Books_Details_content {
	float: right;
	background-color: #FFFFFF;
	padding: 0em;
	width: 80%;
	height: auto; /*background-color:#FC3;border:0px solid #63C;*/
	margin-left: 1%;
}
/*lighbox image video*/
.Video_gallery li {
	height: 10em;
	width: 11.5em;
	line-height: 1em;
	margin-bottom: 0.4em;
	margin-right: 0.6em;
	filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0'/></filter></svg>#grayscale");
	-webkit-filter: none;
	filter: none;
}
.Video_gallery li:hover {
	height: 10em;
	width: 11.5em;
	line-height: 1em;
	margin-bottom: 0.4em;
	margin-right: 0.6em;
}
.Video_gallery li a img {
	max-width: 100%;
	margin-bottom: 0.4em;
}
/*.Video_gallery li {width:12em;}			
		.Video_gallery li:hover {width:12em;}*/
		
/*end lightbox image video */


.Book_Title {
	font-size: 1.2em;
}
.Book_Description {
	font-size: 0.9em;
	height: auto;
}/*height 157/16*/
.Book_Writer {
	font-size: 0.8em;
}
.Book_Writer_Description {
	font-size: 0.6em;
}
.Books_Carrier {
	width: 100%;
	background-color: #FFFFFF;
	margin: auto;
}
.Page_Details {
	width: 96%;
	padding: 0.1em;
}
.Page_Details_Img {
	float: left;
	width: 18%;
	height: auto; /*background-color:#36C; */
	margin-right: 2%;
	border: 0px solid #0CC;
}
.Page_Details_content {
	float: right;
	width: 80%;
	height: auto; /*background-color:#FC3;*/
	border: 0px solid #63C;/*margin-left:0.5%;*/
}
.Page_Nav {
	width: 98%;
	float: left;
	padding: 0.3em;
}
.Left_Nav {
	width: 30%;
	float: left;
	height: auto;
}
.Right_Nav {
	width: 70%;
	float: right;
	height: auto;
}
.button_block {
	margin-bottom: 25px;
	width: 33%;
	float: left;
}
/*download button*/
a.download_button {
	position: relative;
	color: rgba(255,255,255,1);
	text-decoration: none;
	background-color: rgba(219,87,5,1);
	/* font-family: 'Yanone Kaffeesatz';*/
	font-weight: 400;
	font-size: 1em;
	display: block;
	padding: 4px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
	-moz-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
	box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
	/*margin: 100px auto;*/
	width: 10em;
	text-align: center;
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
}
a.download_button:active {
	-webkit-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
	-moz-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
	box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
	position: relative;
	top: 6px;
}
a.read_button {
	position: relative;
	color: rgba(255,255,255,1);
	text-decoration: none;
	background-color: rgba(89, 0, 255, 1);
	/* font-family: 'Yanone Kaffeesatz';*/
	font-weight: 400;
	font-size: 1em;
	display: block;
	padding: 4px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 0px 9px 0px rgba(65, 20, 132, 1), 0px 9px 25px rgba(0,0,0,.7);
	-moz-box-shadow: 0px 9px 0px rgba(65, 20, 132, 1), 0px 9px 25px rgba(0,0,0,.7);
	box-shadow: 0px 9px 0px rgba(65, 20, 132, 1), 0px 9px 25px rgba(0,0,0,.7);
	/*margin: 100px auto;*/
	width: 10em;
	text-align: center;
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
}
a.read_button:active {
	-webkit-box-shadow: 0px 3px 0px rgba(35, 11, 70, 1), 0px 3px 6px rgba(0,0,0,.9);
	-moz-box-shadow: 0px 3px 0px rgba(35, 11, 70, 1), 0px 3px 6px rgba(0,0,0,.9);
	box-shadow: 0px 3px 0px rgba(35, 11, 70, 1), 0px 3px 6px rgba(0,0,0,.9);
	position: relative;
	top: 6px;
}
/*end download button*/
/*footer*/
/*http://jsfiddle.net/Gar3H/5/*/
.Main_Footer {
	width: 93%;
	background-color: #333;
	margin: auto;
	color: #999;
	font-size: 1em;
	color: #999;
	padding: 0.8em;
	line-height: 1.9em;
}
.Main_Footer a {
	color: #999;
	text-decoration: none;
}
.Main_Footer a:hover {
	color: #FC0;
}
.FooterLink {
	display: block;
}
#footer {
	width: 100%;
	float: left;
	color: #FFFFFF;
	padding-top: 0.5em;
}
.footerFloat {
	width: 25%;
	float: left;
	min-width: 200px;
}
/*end footer*/

	
}

/*end 768-1024px++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/



/*1025-1247px++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media screen and (min-width:1025px) and (max-width:1247px) {
.pagemusic {
	width: 95.5%;
}
/*main strucure responsive css*/
.New_Container {
	width: 96%;
}
.New_Left {
	width: 1.8%;
}
.New_Left_Page {
	width: 1.8%;
}
.New_Content_Centre {
	width: 96.4%;
}
.New_Right_Page {
	width: 1.8%;
}
.New_Right {
	width: 1.8%;
}
/*end main strucure responsive css*/


#dropcontentsubject {
	font-size: 0.8em;
}
.dropcontent {
	font-size: 1.2em;
	padding: 0.8em;
	font-weight: bold;
}
.Arabic_date {
	font-size: 1em;
	padding-top: 10px;
	padding-bottom: 10px;
}
.L_News {
	width: 100px;
	height: 30px;
}
.L_News:after {
	border-width: 5px 0 5px 7px;
	right: -7px;
	top: 10px;
}
.Newstag {
	padding: 0.4em;
	font-size: 0.8em;
}
.News_Scroller {
	width: 68%;
	padding-top: 0em;
}
.Top_Nav {
	background-color: #13a69c;
	width: 98%;
	height: 4em;
	border: 0px solid #36C;
	margin: auto;
}/*62/16*/
.Brand {
	margin-top: 0.7em;
	width: 100%;
	border: 0px #000 solid;
	height: auto;
}
.Logo {
	font-size: 2.5em;
	font-family: 'Crete Round', serif;
	color: #FFF;
	font-weight: 400;
	float: left;
	border: 0px solid #0CC;
	width: auto;
	-webkit-font-smoothing: antialiased;
}
.Navigation {
	border: 0px solid #36C;
	margin: auto;
	width: 100%;
	height: auto;
}
.Index_page_Content {
	width: 98%;
	margin: auto;
	border: 0px #000 solid;
	height: auto;
}
.Page_Content {
	width: 98%;
	margin: auto;
	padding: 0.5em;
	border: 0px #000 solid;
	height: auto;
	background-color: #FFFFFF;
	font-size: 0.9em;
}
.Page_Cover {
	height: 4em;
}
.Page_Title {
	width: 98%;
	padding-top: 0.6em;
	font-size: 1.5em;
}
.Events {
	width: 100%;
	float: left;
	background-color: #FFFFFF;
	margin: 0%;
	height: auto;
	border: 0px solid #0CC;
	border-bottom: 0px solid #000;
}
.Events_Img {
	float: left;
	width: 18%;
	height: auto;
	background-color: #ef424b;/* border:0px solid #0CC;*/
	margin: 1%;
}
.Events_Img_Listing {
	width: 200px;
	height: 252px;
}
.Events_list {
	float: right;
	width: 78%;
	height: auto; /*background-color:#FC3;border:0px solid #63C;*/
	margin: 1%;
}
.Sufi_Books_Details {
	width: 98%;
	float: left;
	background-color: #FFFFFF;
	margin: 1%;
	height: auto;
	border: 0px solid #0CC;
}
.Sufi_Books_Details_Img {
	float: left;
	width: 18%;
	height: auto; /*background-color:#36C; border:0px solid #0CC;*/
	margin-right: 1%;
}
.Sufi_Books_Details_content {
	float: right;
	background-color: #FFFFFF;
	padding: 0em;
	width: 80%;
	height: auto; /*background-color:#FC3;border:0px solid #63C;*/
	margin-left: 1%;
}
/*lighbox image video*/
.Video_gallery li {
	height: 10em;
	width: 13.5em;
	line-height: 1em;
	margin-bottom: 0.4em;
	margin-right: 0.6em;
	filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0'/></filter></svg>#grayscale");
	-webkit-filter: none;
	filter: none;
}
.Video_gallery li:hover {
	height: 10em;
	width: 13.5em;
	line-height: 1em;
	margin-bottom: 0.4em;
	margin-right: 0.6em;
}
.Video_gallery li a img {
	max-width: 100%;
	margin-bottom: 0.4em;
}
/*.Video_gallery li {width:12em;}			
		.Video_gallery li:hover {width:12em;}*/
		
/*end lightbox image video */
.Book_Title {
	font-size: 1.8em;
}
.Book_Description {
	font-size: 1.2em;
	height: auto;
}/*height 157/16*/
.Book_Writer {
	font-size: 1em;
}
.Book_Writer_Description {
	font-size: 1em;
}
.Books_Carrier {
	width: 100%;
	background-color: #FFFFFF;
	margin: auto;
}
.Page_Details {
	width: 96%;
	padding: 0.1em;
}
.Page_Details_Img {
	display: none;
}
.Page_Details_content {
	width: 100%;
}
.Page_Nav {
	width: 98%;
	float: left;
	padding: 0.3em;
}
.Left_Nav {
	width: 30%;
	float: left;
	height: auto;
}
.Right_Nav {
	width: 70%;
	float: right;
	height: auto;
}
.button_block {
	margin-bottom: 25px;
	width: 20%;
	float: left;
	
}
/*download button*/
a.download_button {
	position: relative;
	color: rgba(255,255,255,1);
	text-decoration: none;
	background-color: rgba(219,87,5,1);
	/* font-family: 'Yanone Kaffeesatz';*/
	font-weight: 400;
	font-size: 1em;
	display: block;
	padding: 4px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
	-moz-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
	box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
	/*margin: 100px auto;*/
	width: 9.5em;
	text-align: center;
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
	
}
a.download_button:active {
	-webkit-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
	-moz-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
	box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
	position: relative;
	top: 6px;
}
a.read_button {
	position: relative;
	color: rgba(255,255,255,1);
	text-decoration: none;
	background-color: rgba(89, 0, 255, 1);
	/* font-family: 'Yanone Kaffeesatz';*/
	font-weight: 400;
	font-size: 1em;
	display: block;
	padding: 4px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 0px 9px 0px rgba(65, 20, 132, 1), 0px 9px 25px rgba(0,0,0,.7);
	-moz-box-shadow: 0px 9px 0px rgba(65, 20, 132, 1), 0px 9px 25px rgba(0,0,0,.7);
	box-shadow: 0px 9px 0px rgba(65, 20, 132, 1), 0px 9px 25px rgba(0,0,0,.7);
	/*margin: 100px auto;*/
	width: 9.5em;
	text-align: center;
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
}
a.read_button:active {
	-webkit-box-shadow: 0px 3px 0px rgba(35, 11, 70, 1), 0px 3px 6px rgba(0,0,0,.9);
	-moz-box-shadow: 0px 3px 0px rgba(35, 11, 70, 1), 0px 3px 6px rgba(0,0,0,.9);
	box-shadow: 0px 3px 0px rgba(35, 11, 70, 1), 0px 3px 6px rgba(0,0,0,.9);
	position: relative;
	top: 6px;
}
/*end download button*/
/*footer*/
/*http://jsfiddle.net/Gar3H/5/*/
.Main_Footer {
	width: 96%;
	background-color: #333;
	margin: auto;
	color: #999;
	font-size: 1em;
	color: #999;
	padding: 0.8em;
	height: auto;
}
.Main_Footer a {
	color: #999;
	text-decoration: none;
}
.Main_Footer a:hover {
	color: #FC0;
}
.FooterLink {
	display: block;
}
#footer {
	width: 100%;
	float: left;
	color: #FFFFFF;
	padding-top: 0.5em;
}
.footerFloat {
	width: 25%;
	float: left;
	min-width: 200px;
	padding-top: 1em;
	line-height: 150%;
}
/*end footer*/
}

/*end 10251247px++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/


/*1248_1324px++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media screen and (min-width:1248px) and (max-width:1324px) {
.pagemusic {
	width: 95.5%;
}
.MaroofPeerlogo {
	font-size: 1.5em;
	padding-left: 0.2em;
	padding-bottom: 0.2em;
}
/*main strucure responsive css*/
.New_Container {
	width: 96%;
}
.New_Left {
	width: 1.8%;
}
.New_Left_Page {
	width: 1.8%;
}
.New_Content_Centre {
	width: 96.4%;
}
.New_Right_Page {
	width: 1.8%;
}
.New_Right {
	width: 1.8%;
}
/*end main strucure responsive css*/


#dropcontentsubject {
	font-size: 1em;
}
.dropcontent {
	font-size: 1.6em;
	padding: 1em;
	font-weight: bold;
}
.Arabic_date {
	font-size: 1em;
	padding: 12px;
}
.L_News {
	width: 90px;
	height: 30px;
}
.L_News:after {
	border-width: 5px 0 5px 7px;
	right: -7px;
	top: 10px;
}
.Newstag {
	padding: 0.4em;
	font-size: 0.8em;
}
.News_Scroller {
	width: 75%;
	padding-top: 0em;
}
.Navigation {

	border: 0px solid #36C;
	margin: auto;
	width: 100%;
	height: auto;
}
.Top_Nav {
	background-color: #13a69c;
	width: 85%;
	height: 4em;
	border: 0px solid #36C;
	margin: auto;
}/*62/16*/
.Index_page_Content {
	width: 81%;
	margin: auto;
	border: 0px #000 solid;
	height: auto;
}
.Video_Announce_Tst {
	width: 99%;
	height: auto;
	border: 0px solid #066;
	margin-top: 1em;
	height: auto;
	margin: auto;
}
.Latest_Video {
	width: 33.33%;
	float: left;
	height: auto;
margin-right:0.5% padding:0.0em;
}
.Announce {
	width: 33.33%;
	float: left;
	padding: 0.0em;
}
.Tst {
	width: 31.33%;
	float: right;
	padding: 0.0em;
	margin-left: 0.5%;
}
.button_block {
	margin-bottom: 25px;
	width: 28%;
	float: left;
}
/*download button*/
a.download_button {
	position: relative;
	color: rgba(255,255,255,1);
	text-decoration: none;
	background-color: rgba(219,87,5,1);
	/* font-family: 'Yanone Kaffeesatz';*/
	font-weight: 400;
	font-size: 1em;
	display: block;
	padding: 4px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
	-moz-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
	box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
	/*margin: 100px auto;*/
	width: 10em;
	text-align: center;
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
}
a.download_button:active {
	-webkit-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
	-moz-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
	box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
	position: relative;
	top: 6px;
}
a.read_button {
	position: relative;
	color: rgba(255,255,255,1);
	text-decoration: none;
	background-color: rgba(89, 0, 255, 1);
	/* font-family: 'Yanone Kaffeesatz';*/
	font-weight: 400;
	font-size: 1em;
	display: block;
	padding: 4px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 0px 9px 0px rgba(65, 20, 132, 1), 0px 9px 25px rgba(0,0,0,.7);
	-moz-box-shadow: 0px 9px 0px rgba(65, 20, 132, 1), 0px 9px 25px rgba(0,0,0,.7);
	box-shadow: 0px 9px 0px rgba(65, 20, 132, 1), 0px 9px 25px rgba(0,0,0,.7);
	/*margin: 100px auto;*/
	width: 10em;
	text-align: center;
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
}
a.read_button:active {
	-webkit-box-shadow: 0px 3px 0px rgba(35, 11, 70, 1), 0px 3px 6px rgba(0,0,0,.9);
	-moz-box-shadow: 0px 3px 0px rgba(35, 11, 70, 1), 0px 3px 6px rgba(0,0,0,.9);
	box-shadow: 0px 3px 0px rgba(35, 11, 70, 1), 0px 3px 6px rgba(0,0,0,.9);
	position: relative;
	top: 6px;
}
/*end download button*/

}

/*end 1248_1324px++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
/*1325-1440px++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media screen and (min-width:1325px) and (max-width:1440px) {
.pagemusic {
	width: 95.5%;
}
.MaroofPeerlogo {
	font-size: 1.8em;
	padding-left: 0.2em;
	padding-bottom: 0.2em;
}
/*main strucure responsive css*/
.New_Container {
	width: 96%;
}
.New_Left {
	width: 1.8%;
}
.New_Left_Page {
	width: 1.8%;
}
.New_Content_Centre {
	width: 96.4%;
}
.New_Right_Page {
	width: 1.8%;
}
.New_Right {
	width: 1.8%;
}
/*end main strucure responsive css*/

#dropcontentsubject {
	font-size: 0.9em;
}
.dropcontent {
	font-size: 1.7em;
	padding: 1.1em;
	font-weight: bold;
}
.Arabic_date {
	font-size: 1.2em;
	padding: 6px;
}
.L_News {
	width: 120px;
	height: 40px;
}
.L_News:after {
	border-width: 5px 0 5px 7px;
	right: -7px;
	top: 10px;
}
.Newstag {
	padding: 0.5em;
	font-size: 1em;
}
.News_Scroller {
	width: 70%;
	padding-top: 0em;
}
.Navigation {
	border: 0px solid #36C;
	margin: auto;
	width: 100%;
	height: auto;
}
.Top_Nav {
	background-color: #13a69c;
	width: 80%;
	height: 4em;
	border: 0px solid #36C;
	margin: auto;
}/*62/16*/
}

/*end 1325-1440px++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/


/*1441-1640px++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media screen and (min-width:1441px) and (max-width:1640px) {
.pagemusic {
	width: 96%;
}
/*main strucure responsive css*/
.New_Container {
	width: 90%;
}
.New_Left {
	width: 1.5%;
}
.New_Left_Page {
	width: 1.5%;
}
.New_Content_Centre {
	width: 97%;
}
.New_Right_Page {
	width: 1.5%;
}
.New_Right {
	width: 1.5%;
}
/*end main strucure responsive css*/

#dropcontentsubject {
	font-size: 1em;
}
.dropcontent {
	font-size: 1.5em;
	padding: 1.6em;
	font-weight: bold;
}
.Arabic_date {
	font-size: 1.2em;
	padding: 12px;
}
.L_News {
	width: 90px;
	height: 30px;
}
.L_News:after {
	border-width: 5px 0 5px 7px;
	right: -7px;
	top: 10px;
}
.Newstag {
	padding: 0.4em;
	font-size: 0.8em;
}
.News_Scroller {
	width: 75%;
	padding-top: 0em;
}
.Navigation {
	border: 0px solid #36C;
	margin: auto;
	width: 100%;
	height: auto;
}
.Top_Nav {
	background-color: #13a69c;
	width: 80%;
	height: 4em;
	border: 0px solid #36C;
	margin: auto;
}/*62/16*/
}

/*end 1441-1640px++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
/*1641-1800px++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media screen and (min-width:1641px) and (max-width:1800px) {
.MaroofPeerlogo {
	font-size: 1.6em;
}
/*main strucure responsive css*/
.New_Container {
	width: 80%;
}
.New_Left {
	width: 1.5%;
}
.New_Left_Page {
	width: 1.5%;
}
.New_Content_Centre {
	width: 97%;
}
.New_Right_Page {
	width: 1.5%;
}
.New_Right {
	width: 1.5%;
}
/*end main strucure responsive css*/

#dropcontentsubject {
	font-size: 1em;
}
.dropcontent {
	font-size: 1.8em;
	padding: 1em;
	font-weight: bold;
}
.Navigation {
	border: 0px solid #36C;
	margin: auto;
	width: 100%;
	height: auto;
}
.Top_Nav {
	background-color: #13a69c;
	width: 80%;
	height: 4em;
	border: 0px solid #36C;
	margin: auto;
}/*62/16*/
}

/*end 1641-1800px++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
/*1801-1920px++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media screen and (min-width:1801px) and (max-width:1920px) {
.MaroofPeerlogo {
	padding-left: 0.5em;
}
/*main strucure responsive css*/
.New_Container {
	width: 80%;
}
.New_Left {
	width: 1.5%;
}
.New_Left_Page {
	width: 1.5%;
}
.New_Content_Centre {
	width: 97%;
}
.New_Right_Page {
	width: 1.5%;
}
.New_Right {
	width: 1.5%;
}
/*end main strucure responsive css*/

#dropcontentsubject {
	font-size: 1em;
}
.dropcontent {
	font-size: 1.8em;
	padding: 1em;
	font-weight: bold;
}
.Arabic_date {
	font-size: 1.2em;
	padding: 18px;
}
.Navigation {
	border: 0px solid #36C;
	margin: auto;
	width: 100%;
	height: auto;
}
.Top_Nav {
	background-color: #13a69c;
	width: 80%;
	height: 4em;
	border: 0px solid #36C;
	margin: auto;
}/*62/16*/
}

/*end 1801-1920px++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

/*view-source:http://woosterwebdesign.com/experiments/youtube-player.html*/

  		.vidcontainer {
  			width: 100%;
  			max-width: 1044px;
  			
  			background: #161616;
			margin-bottom:30px;
			
			border:0px solid red;
			
  			/*margin: 0 auto;*/
  		}

.vidcontainer img{
  			width:auto;
	height: auto;
  		}





/*start video bayan*/
.Videobox{ width:100%;height:auto;}
.clearfix{ clear: both;overflow: auto;		}
		
  		.title {
  			width: 100%;
  			max-width: 854px;
  			margin: 0 auto;
  		}

  		.caption {
  			width: 100%;
  			max-width: 854px;
  			margin: 0 auto;
  			padding: 20px 0;
  		}

  		.vid-main-wrapper {
  			width: 80%;
  			max-width: 1100px;
 			min-width: 340px;
  			background: #fff;
  			margin: 0 ;
			border:0px solid red;
			
			
  		}


  		/*  VIDEO PLAYER CONTAINER
 		############################### */
  		.vid-container {
		    position: relative;
		    padding-bottom: 52%;
		    padding-top: 30px; 
		    height: 0; 
        width:70%;
        float:left;
		}
		 
		.vid-container iframe,
		.vid-container object,
		.vid-container embed {
		    position: absolute;
		    top: 0;
		    left: 0;
		    width: 100%;
		    min-height: 360px;
		}


		/*  VIDEOS PLAYLIST 
 		############################### */
		.vid-list-container {
			width: 30%;
      height:360px;
			overflow: hidden;
      float:right;
			background: #000;
		}

    .vid-list-container:hover, .vid-list-container:focus {
       overflow-y: auto;
     }

		ol#vid-list {
      margin:0;
      padding:0;
      background: #000;
		}

    ol#vid-list li {
		  list-style: none;
    }

    ol#vid-list li a {
      text-decoration: none;
      background-color:#000;
      height:75px;
      display:block;
		padding-top: 2px;
		padding-bottom: 2px;
      padding:10px;
		float:left;
		width: 90%;
    }

    ol#vid-list li a:hover {
      background-color:#121212;
		 padding:10px;
    }

		.vid-thumb {
      float:left;
			margin-right: 8px;
		}

    .active-vid { 
      background:#3A3A3A;
    }

		#vid-list .desc {
			color: #CACACA;
			font-size: 13px;
			margin-top:5px;
		}


		@media  (max-width: 624px) {
		.Videobox{ width:100%;height:auto;}	
					.vid-list-container {
	background-color: #000;
	width: 90%;
						float: left;
						margin-top: 150px;
						
}
.vid-container {
	width: 100%;
}
.vid-main-wrapper {
	width: 90%;
	border: 0px solid red;
	background: #000;
}
			
			

		}
		
/*end of video bayan*/


