@font-face {
    font-family: 'icomoon';
    src:    url('../fonts/icomoon.eot?oy0ago');
    src:    url('../fonts/icomoon.eot?oy0ago#iefix') format('embedded-opentype'),
        url('../fonts/icomoon.ttf?oy0ago') format('truetype'),
        url('../fonts/icomoon.woff?oy0ago') format('woff'),
        url('../fonts/icomoon.svg?oy0ago#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* Windows Chrome ugly fix style="text-align:center;"://stackoverflow.com/questions/13674808/chrome-svg-font-rendering-breaks-layout/14345363#14345363 */
@media screen and (-webkit-min-device-pixel-ratio:0) {
	
	
	@font-face {
		font-family: 'icomoon';
		src: url('../fonts/icomoon.svg#icomoon') format('svg');
	}
}

.icon-testimonies, .icon-praise, .icon-home, .icon-sermons, .icon-about, .icon-contact,	 .icon-menu , .icon-kids, .icon-girls, .icon-youth ,.icon-studies , .icon-articles , .icon-events , .icon-english, .icon-images,   .icon-youtube , .icon-facebook , .icon-audio , .icon-headphone
,.icon-video ,.icon-download, .icon-visits, .icon-share {
	font-family: 'icomoon';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
}

.icon-home:before {
	content: "\e900";
}

.icon-about:before {
	content: "\e905";
}



.icon-sermons:before {
	content: "\e913";
}

.icon-praise:before {
	content: "\e911";
}
 .icon-testimonies:before {
	content: "\e906";
}

 
.icon-girls:before {
	content: "\e903";
}
.icon-kids:before {
	content: "\e904";
}
.icon-youth:before {
	content: "\e9de";
}
.icon-studies:before {
	content: "\e920";
}
.icon-articles:before {
	content: "\e922";
}
.icon-events:before {
	content: "\e953";
}
.icon-menu:before {
	content: "\e9be";
}
.icon-english:before {
	content: "\e613";
}
 
.icon-contact:before {
	content: "\e620";
}

.icon-images:before {
	content: "\e90e";
}
 .icon-youtube:before {
	content: "\e61b";
}
.icon-facebook:before {
	content: "\e619";
}
.icon-audio:before {
	content: "\ea26";
}
.icon-headphone:before {
	content: "\e910";
}
.icon-video:before {
	content: "\e914";
}
.icon-download:before {
	content: "\e960";
}
.icon-visits:before {
	content: "\e9ce";
}
.icon-share:before {
	content: "\ea82";
}
a, li {
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}


/* Global CSS that are applied for all screen sizes */

.nav ul {
	max-width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: .85vw;
	font-weight: 300;
}
.nav li{	box-shadow:0px -2px 5px -2px #B4B4B4; 
}
.nav li span {
	display: inline-block;
}

.nav a {
	display: block;
	color: rgba(249, 249, 249, .9);
	text-decoration: none;
	-webkit-transition: color .5s, background .5s, height .5s;
	-moz-transition: color .5s, background .5s, height .5s;
	-o-transition: color .5s, background .5s, height .5s;
	-ms-transition: color .5s, background .5s, height .5s;
	transition: color .5s, background .5s, height .5s;
}

.nav i{
	/* Make the font smoother for Chrome */
	-webkit-transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	-o-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}

/* Remove the blue Webkit background when element is tapped */

a, button {
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

/* Hover effect for the whole navigation to make the hovered item stand out */

.no-touch .nav ul:hover a {
	color: rgba(249, 249, 249, .5);
}

.no-touch .nav ul:hover a:hover {
	color: rgba(249, 249, 249, 0.99);
}

/* Adding some background color to the different menu items */

.nav li {
	background:rgba(27,53,70, 1.00);
	
}
 /* For screen bigger than 800px */
@media (min-width: 50em) {
	#hiddenContent{width:60%;}
	 #goTop{
		   
		   z-index:9999;
    background:rgba(187,76,51,0.93) url(../fonts/cd-top-arrow.svg) no-repeat 50%;
    padding:25px;
	border-radius:50%;
	display:block;
    position:fixed;
    bottom:-100px;
    right:30px;
	text-align:right;
    cursor:pointer;
	color:#fff;
	
	-webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none;   /* Chrome/Safari/Opera */
  -khtml-user-select: none;    /* Konqueror */
  -moz-user-select: none;      /* Firefox */
  -ms-user-select: none;       /* IE/Edge */
  user-select: none; 
}

	.container > header {

	background:url(../h.png) no-repeat 50% 60%  ;
}
	.upper{position:relative; top:0;  background: rgba(27,53,70, .30); z-index:5555; font-size:16px; line-height:30px;}
	.jjsmsm{right:10px;  width:22%; height:auto;  position:absolute; top:8px; z-index:8888;}
	.logo{position:absolute; top:30px; width:12%;  float:left;  height:auto; }
	
	.container > header h1 {
	padding-top:0;
	 font-size:2vw ;
	 
	line-height: 1.2em;
	margin: 0;
	margin-top:2vw;
	font-weight: 200;
	color:#fff;
}

	
 	

	.1menu{margin:0 auto;}
	
	
	.language{ }
	
	.social{}
	.Men{ margin-top:0em;  }
	.SM{position:absolute;}
	.submenus-text{ font-size:.8vw;}
  #about{width:12.5%;}
#sermons , #praise , #readings{width:12.5%;}
 	 
	/*header{ display:inline-block;}*/
 	 
.mobile-logo{display:none;}
	/* Transforms the list into a horizontal navigation */
	.nav li {
		float: left;
 		text-align: center;
		font-weight: bolder;
		-webkit-transition: border .5s;
		-moz-transition: border .5s;
		-o-transition: border .5s;
		-ms-transition: border .5s;
		transition: border .5s;
	}
	
	/* adjusting the width*/
.nav li:nth-child(6n+1) , .nav li:nth-child(6n+2) ,.nav li:nth-child(6n+5),.nav li:nth-child(6n+3),.nav li:nth-child(6n+4),.nav li:nth-child(6n+6),.nav li:nth-child(6n+7),.nav li:nth-child(6n+8) {width:12.5%;}

 
	.nav a {
		display: block;
		width: auto;
	}

	/* hover, focused and active effects that add a little colored border to the different items */
	.no-touch .nav li  a:hover,
	.no-touch .nav li  a:active,
	.no-touch .nav li  a:focus {
		border-bottom: 4px solid rgb(191, 117, 20);
	}
 
	/* Placing the icon */
	
	.icon {
		margin-top: .9em;
		font-size:.7em;
		
 	}
.nav li span:nth-child(2){font-size:1.4em; line-height:2.0em; font-weight:100;  }
	.icon + span {
		margin-top: .5em;
		-webkit-transition: margin .1s;
		-moz-transition: margin .1s;
		-o-transition: margin .1s;
		-ms-transition: margin .1s;
		transition: margin .1s;
	}

	/* Animating the height of the element*/
	.nav a {
		height: 3.4vw; 
 	}
	 

	.no-touch .nav a:hover ,
	.nav a:active ,
	.nav a:focus {
		height: 3.4vw;
	}	

	/* Making the text follow the height animation
	.no-touch .nav a:hover .icon + span {
		margin-top: .8em;
		-webkit-transition: margin .1s;
		-moz-transition: margin .1s;
		-o-transition: margin .1s;
		-ms-transition: margin .1s;
		transition: margin .1s;
	}
 */
	/* Positioning the icons and preparing for the animation*/
	.nav i {
		position: relative;
		display: inline-block;
		margin: 0 auto;
 		padding:0.31em 0.25em;
		border-radius: 50%;
		font-size: 1.3vw;
		box-shadow: 0 0 0 30px transparent;
		background: rgba(255,255,255,0.1);
		-webkit-transform: translate3d(0, 0, 0);
		-moz-transform: translate3d(0, 0, 0);
		-o-transform: translate3d(0, 0, 0);
		-ms-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
		-webkit-transition: box-shadow .6s ease-in-out;
		-moz-transition: box-shadow .6s ease-in-out;
		-o-transition: box-shadow .6s ease-in-out;
		-ms-transition: box-shadow .6s ease-in-out;
		transition: box-shadow .6s ease-in-out;
	}	
	
	/* Animate the box-shadow to create the effect */
	.no-touch .nav a:hover i,
	.no-touch .nav a:active i,
	.no-touch .nav a:focus i {		
		box-shadow: 0 0 0 0 rgba(255,255,255,0.2);
		-webkit-transition: box-shadow .4s ease-in-out;
		-moz-transition: box-shadow .4s ease-in-out;
		-o-transition: box-shadow .4s ease-in-out;
		-ms-transition: box-shadow .4s ease-in-out;
		transition: box-shadow .4s ease-in-out;
	}
	
	/*********/
	
		/*****breadcrumb******/
	
	
			.breadcrumb li a {
		 
			font-size:.8vw;
		}
		
			/******main*****/
			
.vision{ line-height:4vw; font-size:1.6vw; font-weight: bolder; }
.div1{  z-index:7777;  width:100%; height:36vw;  position:relative;  
     padding:3vw 5% 3vw 5%; }

.streaming{width:50%; height:31vw; margin:0 auto; float:right;box-shadow:2px 2px 5px 0px #413C37;
                   border-radius:0px; overflow:hidden; line-height:3vw; font-size:1.2vw;  text-align:center;
				    text-shadow:.5px .5px #fff; color:#FFF;}

.streaming-title{height:11%;}

.streaming-footer{height:11%;}
.div1 > .weekly{  margin:0 auto;
width:45%; height:18vw;   float:left;box-shadow:2px 2px 5px 0px #413C37;
                   border-radius:0px; overflow:hidden;}
.div1 > .weekly:nth-child(3n+1){}
.div1 > .weekly> .title{width:100%; height:16%; background:rgba(27,53,70, 1.0); line-height:3vw; text-align:center; text-shadow:.5px .5px #fff;font-size:1.2vw; color:#FFF; z-index:9999;  position:relative;}

.new{ margin:0 auto; font-size:1.2vw; color:rgba(99,3,17,0.99);
width:45%; height:14.7vw;   float:left;box-shadow:2px 2px 5px 0px #413C37; margin-bottom:1.5vw; font-weight:bold;
                   border-radius:0px; overflow:hidden;    animation:blur 1.25s ease infinite; text-shadow:-.5px 0px .2px #fff,
      0px 0px .2px #fff;
} 
.new-mob-title{display:none;}
.new-mob-footer{display:none;}

.new-img{width:60%; height:100%; float:right; }
.new-text{height:100%; box-shadow: inset 1px 1px -40px rgba(255,255,255,1);}
 
@keyframes blur{
  from{
      text-shadow:0px 0px 5px #fff,
      0px 0px 10px #fff , 
      0px 0px 15px #fff,
      0px 0px 20px #fff,
      0px 0px 25px #fff;
	  
	  
	  
	  
	  }
	  }
.promise{ margin:0 auto; font-size:1.2vw; color:rgba(99,3,17,0.99);
width:45%; height:14.7vw;   float:left;box-shadow:2px 2px 5px 0px #413C37; margin-bottom:1.5vw; font-weight:bold;
                   border-radius:0px; overflow:hidden;    animation:1.25s ease infinite; text-shadow:1.5px .5px .2px #fff;
} 
.promise-mob-title{display:none;}
.promise-mob-footer{display:none;}
.promise-img{width:60%; height:100%; float:right; }
.promise-text{height:100%; box-shadow: inset 1px 1px -40px rgba(255,255,255,1); background:none;}

   .promise:hover{ -webkit-transform: rotate(1deg);
    -moz-transform: rotate(1deg);
    -ms-transform: rotate(1deg);
    -o-transform: rotate(1deg);
    transform: rotate(1deg);
    }
	.new:hover{ -webkit-transform: rotate(1deg);
    -moz-transform: rotate(1deg);
    -ms-transform: rotate(1deg);
    -o-transform: rotate(1deg);
    transform: rotate(1deg);
    }
	 
	 				   	
.notes{width:96%; height:19vw; margin:2vw auto; float:none;box-shadow:2px 2px 5px 0px #413C37;
                   border-radius:0px; overflow:hidden; line-height:3vw; text-align:center;
				    text-shadow:.5px .5px #fff;font-size:1.2vw; color:#FFF;} 		

.meetings{width:45%; height:16vw; margin:1vw auto; float:right;box-shadow:2px 2px 5px 0px #413C37;
                   border-radius:0px; overflow:hidden;  line-height:3vw; text-align:center; text-shadow:.5px .5px #fff;font-size:1.2vw; }
.meeting-txt{font-size:1.0vw;   text-shadow:.5px .5px #fff; color:rgba(108,11,13,1.00); line-height:2vw; text-align:right; width:25%; float:right;}

 


.div2{z-index:7777;  width:100%; height:32vw;  position:relative;  background:url(../tbg.png) no-repeat 50% 30%; background-size:100% 100%;

            
          padding:1.5vw 5%;  
  }
		  
		  
		  
 
.div2 > .weekly{margin:1.5vw 2%;      transition:all .5s ease; overflow:hidden;

width:21%; height:25vw;   float:right;box-shadow:0px 2px 2px -1px #000;
                   border-radius:15px; }

.div2 > .weekly> .title{width:100%; height:14%; background:rgba(99,3,17,0.70); line-height:3vw; text-align:center; text-shadow:.5px .5px #fff;font-size:1.2vw; color:#FFF; z-index:9999;  position:relative;}
.weekly-img{width:100%; height:50%;  z-index:5555;  position:relative; overflow:hidden;}		  
		  
.desc{line-height:2.2vw;  font-size:.9vw; width:100%; height:36%; background:rgba(247,247,247,0.50);  text-align:center; text-shadow:.1px .1px #000;  color:#000; z-index:9999;  position:relative;}		  


	.div2 > .weekly:hover{  box-shadow:1px 2px 8px 0px #000;   }
	 

 
		  
	.div3{height:27vw;  z-index:7777;  width:100%;   position:relative;
         
         
         
          padding:1.5vw 5%;
          }	  
		  

.div3 > .weekly{ margin:0 0 0 5%;
width:22%; height:26vw;   float:right;box-shadow:2px 2px 5px 0px #413C37;
                   border-radius:0px; overflow:hidden;  }
				   

 .div3 > .weekly> .title{width:100%; height:13%; background:rgba(27,53,70, 1.0); line-height:3vw; text-align:center; text-shadow:.5px .5px #fff;font-size:1.2vw; color:#FFF; z-index:9999;  position:relative;}	
 
 
 
  .div3 > .registration{  
width:23%; height:26vw;    box-shadow:2px 2px 5px 0px #413C37;
                   border-radius:0px; overflow:hidden;  }
  .div3 > .registration> .title{width:100%; height:13%; background:rgba(27,53,70, 1.0); line-height:3vw; text-align:center; text-shadow:.5px .5px #fff;font-size:1.2vw; color:#FFF; z-index:9999;  position:relative;}
  #clr{font-size:1vw; margin-bottom:1vw;
  }		  
	#visitors-field{width:40%; background:rgba(78,31,16,0.84);  font-size:1vw; height:2.5vw; min-height:25px; color:#fff; margin:20px auto;}			
	
	
	.close{width:100%; height:6vw; background:rgba(27,53,70, 1.00) url(../tbg.png) no-repeat 20% 50%; background-size:cover; text-align:center; color:#fff; text-shadow:.2px .2px 1px #000; border-top:4px solid rgb(174, 78, 1);
    box-shadow: 2px 2px 16px 2px #171717; overflow:hidden; font-size:1vw;}  
			/***********/
			
			
			
	.video-audio-related-wrapper{margin:2vw auto; min-height:32.5vw; }
	
	.sermon-title{ 
   padding:1vw 0 1.5vw 0; 
  margin:0 auto;
  min-height:8vw;
	}
	
.subj-title{font-size:1.5vw;}
.subj-details{font-size:1vw;}
	
		.sermon1{width:100%; margin:0; background:rgba(167,118,56,0.84); position:relative;   clear:both; overflow:hidden;  text-align:center; border-bottom:solid 1px #000;
		 }
			  
		   .sermon11{width:33.333%;  direction:rtl; position:relative;     cursor:pointer; font-size:1vw;
  overflow:hidden;  color:#fff; line-height:3vw; float:right;      display:compact;      z-index:1000;   }
  
 
  
		
	.brief{width:88%; height:100%; overflow:auto; text-align:left; margin:30px auto; clear:both; position:relative;  
	 background:rgba(243,243,243,0.70) ; box-shadow: 1px 2px 5px 0 #000; padding:20px;  direction:ltr; font-size:1.4vw; line-height:3vw; }
	 
	 
	 				/***********/

		.share{ background:rgba(63,63,63,0.44); border:.5px solid rgba(236,236,236,1.00); margin-top:-2.8vw;
		 transition:width .5s ;
line-height:2.5vw;  width:auto; height:3vw; position:fixed; right:-.6vw; font-size:.9vw; text-align:right; padding:.3vw .7vw;  text-shadow:none; border-radius:6px; z-index:9999; direction:rtl; overflow-style:marquee-line;}	
			
			
		.icon-share{ position:relative; float:right; margin-right:3px;  color:rgba(255,255,255,1.00);   line-height:2.5vw; font-size:1vw; }	
		#shareIcons{margin-top:0;    z-index:9999;  padding:.1vw .5vw; width:15vw; float:left;}	
			
		.a2a_svg{height:2.3vw;line-height:3vw;width:2.3vw; }			
	
			
	.video-audio{width: 55vw; position:relative;
    height: auto; min-height:31.5vw; clear:none; margin-right:7%; margin-top:0vw; float:right; overflow:hidden; margin-bottom:1vw; 
	-webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none;   /* Chrome/Safari/Opera */
  -khtml-user-select: none;    /* Konqueror */
  -moz-user-select: none;      /* Firefox */
  -ms-user-select: none;       /* IE/Edge */
  user-select: none;
    }
	.video-audio iframe{height:29.4vw;  box-shadow: 1px 4px 6px -3px #000;}
	#audio{height:28.8vw;  box-shadow: 1px 4px 6px -3px #000; margin-bottom:.5vw;}
	.audioImg{width:100%; text-align:center; margin-top:-5.5vw; z-index:1111; position:relative; background:white;}

	.description{width: 100%; position:relative; background:rgba(243,243,243,0.70)  ;
    height: 6.3vw; clear:none; margin-right:0%; margin-top:0vw; float:right; overflow:hidden; margin-bottom:.5vw;  box-shadow: 1px 2px 3px -1px #000; direction:rtl; text-align:right; padding:.7vw 1vw; font-size:.8vw; }
	
	
/*	.description{width: 100%; position:relative; background:rgba(243,243,243,0.70) ;
    height: 6.3vw; clear:none; margin-right:7%; margin-top:0vw; float:right; overflow:hidden; margin-bottom:.5vw;  box-shadow: 1px 2px 3px -1px #000; direction:rtl; text-align:right; padding:.3vw; font-size:.8vw; }*/
		.related-wrap{width: 25%; position:relative; z-index:5555;
    height:auto;  margin:0vw; padding:0; margin-left:7%;    float:left;  overflow:hidden; background:rgba(99,53,29,0.52);  
		-webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none;   /* Chrome/Safari/Opera */
  -khtml-user-select: none;    /* Konqueror */
  -moz-user-select: none;      /* Firefox */
  -ms-user-select: none;       /* IE/Edge */
  user-select: none; 
  }

	.related{ width: 100%; position:relative; z-index:5555;
      border-left:solid .5px rgba(99,53,29,0.52); border-right:solid .5px rgba(99,53,29,0.52);
		 background:rgba(243,243,243,0.70); box-shadow: 0 #000;
	 direction:rtl; overflow:hidden;}
	 .relatedhigh{height: 33vw;}
	  .relatedshort{height: 26vw;}
  .arrowDown{width:100%; margin:0  ; height:2vw; cursor:pointer;  clear:none;   background:rgba(167,118,56,0.84) url(../fonts/cd-top-arrow.svg) no-repeat 50%; position:relative;  margin-left:0%;  box-shadow: 5px -3px 8px #000; float:left; z-index:9999; margin-top:.5vw; background-size:1vw;
	  -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);}
	
	.arrowDown:hover{background:rgba(27,53,70, 1.00)  url(../fonts/cd-top-arrow.svg) no-repeat 50%;  } 
	
	
 .arrowUp{width:25%; margin:0 auto; height:2vw; cursor:pointer; background:rgba(167,118,56,0.84) url(../fonts/cd-top-arrow.svg) no-repeat 50%; position:relative;  margin-left:7%;  box-shadow: 2px -2px 4px 0 #000; float:left; z-index:8888; margin-bottom:-1px;  background-size:1vw; }
	
	 .arrowUp:hover{background:rgba(27,53,70, 1.00)  url(../fonts/cd-top-arrow.svg) no-repeat 50%; }
	
	
	.related-list{width: 95%; margin:0vw auto; }
	
				.arrows{display:none;}

	.related-item{width:100%; height:6.5vw; background:rgba(255,255,255,0.80); overflow:hidden; margin:1vw auto;
	 box-shadow:0; border:solid .5px rgba(130,130,130,1.00);
	font-size:.8vw; cursor:pointer;   transition:all .3s ; }
	.related-item:hover{box-shadow: 1px 2px 7px -1px #696969;  }
	.thumb-wrapper{width:46%; height:98%; position:relative; float:left;}
	.thumb-wrapper img{width:12vw; position: relative;top: -1.1vw;}
	.related-text{width:50%; height:98%; position:relative; float:right; direction:rtl; overflow:hidden;  padding:0px 5px;}
	
	
		/***sermons by cat*****/
	.cat-title{ font-size:200%; direction:ltr; font-weight:bold; line-height:5em;}
	.sermons-cat{width:20%; position:relative; height:100%;  margin:40px 1% 20px 0;
	float:left;      font-size:1.1vw; overflow:hidden; line-height:3.5vw;}
	.sermon-cat{ box-shadow: 2px 2px 5px -1px #000; width:90%; height:29vw; margin-bottom:0vw;  background:rgba(199,162,131,0.30); }
	
	.sermon-cat-title{font-size:130%; line-height:3.5vw; background:rgba(27,53,70, 1.00); color:white; text-align:center; }

	.i-cat{width:15%; float:left;  margin:.25vw 5px -.25vw 5px;}
	.sermons-cat i{font-size:120%;  margin-left:1vw;  text-shadow:.5px .3px #FDF7CC;}
	
	.sermon-cat a{text-shadow:.5px .3px #FDF7CC; color:rgba(96,0,1,1.00)}
	.sermon-cat a:hover{color:rgba(24,0,107,1.00);}
	.sermons-container{width:78%; height:60vw; min-height:550px;   position:relative; float:right;   margin:20px auto ;  
	}
	.one-sermon{width:23%; margin:.7vw .7vw; float:left; box-shadow: 2px 2px 5px -3px #424242; text-align:center; vertical-align:super;
	 background:#fff /*rgba(252,255,209,0.600)*/; height:auto;  overflow:hidden;   border-radius:4%; border:.5px solid #fff;
	 
-webkit-transition: box-shadow 0.5s, border 0.5s;
		-moz-transition:box-shadow 0.5s, border 0.5s;
		-o-transition: box-shadow 0.5s, border 0.5s;
		-ms-transition: box-shadow 0.5s, border 0.5s;
		transition:box-shadow 0.5s, border 0.5s;}
		
	.one-sermon:hover{box-shadow: 2px 2px 10px -1px #390000;   border:.5px solid #000000;}
	 
	 
	 
	 
	 
		  .sermon-image{width:100%; height:auto; overflow:hidden; z-index:6666;}
.sermon-details{background:none; height:auto; width:100%; z-index:8888;  text-align:left; padding:.4vw 0; position:relative;  }
.sermons-title{ font-size:.9vw; z-index:8888;  text-shadow:.5px .5px #fff;margin-left:15px; }
.sermon-speaker-date{line-height:1.0vw; font-size:.55vw; z-index:8888; color:rgba(148,149,152,1.00); margin-left:15px; 
 text-shadow:.2px .2px #fff; }


.sermon-icons{width:15%; text-align:center; position:relative; float:left; border:thin solid rgba(123,123,123,1.00);
margin:0 1.5vw; border-radius:50%;
  }
 .sermon-icons:hover{box-shadow:1px 1px 5px #ccc; }
 .vid-icons{position:relative; background:rgba(252,255,209,0.00); float:left ; width:100%; height:1.5vw; margin-top: 1%; z-index:5555;
  margin-left:0; margin-bottom:1vw;  
}
.vid-icons a{font-size:1.2vw; color:#63737F; line-height:2.5vw; text-shadow:.5px .5px #fff; margin:0 ; text-align:center; margin-top:-5%;

-webkit-transition: all 0.5s;
		-moz-transition: all 0.5s;
		-o-transition: all 0.5s;
		-ms-transition: all 0.5s;
		transition: all 0.5s;}

.vid-icons a:hover{font-size:1.2vw; color:#2F2360; line-height:2.5vw; text-shadow:.5px .5px #ccc;  
 }
 .videoIcon:before{
content: 'شاهد فيديو';
 	z-index:9999;
	font-size:.7vw;
 position: absolute;
     top: -2.5vw;
    left: -.5vw;
	width:200%;
	padding:0 .1vw;
background:rgba(83,0,1,1.00);
    
     display: inline-block;
	  
	 
	color:#FFFFFF;

 
 
  
 
-webkit-transition: all 0.5s;
		-moz-transition: all 0.5s;
		-o-transition: all 0.5s;
		-ms-transition: all 0.5s;
		transition: all 0.5s;
		    opacity: 0;}
.videoIcon:hover:before{
    
	    opacity: 1;
		     top: -2.5vw;

   
 }
 
 
  .audioIcon:before{
content: '  صوت فقط';
	z-index:9999;
	font-size:.7vw;
 position: absolute;
    top: -2.5vw;
    left: -.5vw;
	width:200%;
	padding:0 .1vw;
background:rgba(83,0,1,1.00);
    
     display: inline-block;
	  
	 
	color:#FFFFFF;

 
 
  
 
-webkit-transition: all 0.5s;
		-moz-transition: all 0.5s;
		-o-transition: all 0.5s;
		-ms-transition: all 0.5s;
		transition: all 0.5s;
		    opacity: 0;}
.audioIcon:hover:before{
    		     top: -2.5vw;

	    opacity: 1;
   
 }
 
  
  .dloadIcon:before{
content: ' تحميل mp3';
 	z-index:9999;
	direction:rtl;
	font-size:.7vw;
 position: absolute;
    top: -2.5vw;
    left: -.5vw;
	width:200%;
	padding:0 .1vw;
background:rgba(83,0,1,1.00);
    
     display: inline-block;
	  
	 
	color:#FFFFFF;
 
 
  
 
-webkit-transition: all 0.5s;
		-moz-transition: all 0.5s;
		-o-transition: all 0.5s;
		-ms-transition: all 0.5s;
		transition: all 0.5s;
		    opacity: 0;}
.dloadIcon:hover:before{
    		     top: -2.5vw;

	    opacity: 1;
   
 }

.mkala-img{text-align:center; width:30%; height:20vw; position:relative;float:right; background:none; margin:0 .5vw .9vw 4vw; border-radius:10%;
overflow:hidden;}
}



 
  
   @media (min-width: 105em){
	   
     .fixed-menu{height:4.2em; }
	 .fixed-logo img {width:50%;
	 }
	/* header{height:10em ;}*/
    	 		}                        
@media (min-width: 89em) and (max-width: 105em) {
	/* Size and font adjustments to make it fit into the screen*/
 	 .fixed-logo img {width:43%;}

 	      .fixed-menu{height:3.2em;}

	.nav ul {
		/*font-size: .8em;*/
	}
	/*header{height:9.5em ; font-size:.9em; line-height:9em;   display:inline-block;}*/
    }
@media (min-width: 79em) and (max-width: 89em) {
 	  	 .fixed-logo img {width:39%;}

  	      .fixed-menu{height:2.9em;}

	/* Size and font adjustments to make it fit into the screen*/
	.nav ul {
		/*font-size: .75em;*/
	}
/*header{height:9.5em ;font-size:.8em; display:inline-block;}*/
   }
@media (min-width: 69em) and (max-width: 79em) {
   	    
		 	 .fixed-logo img {width:42%;}

		  .fixed-menu{height:2.7em;}

	/* Size and font adjustments to make it fit into the screen*/
	.nav ul {
		/*font-size: .7em;*/
	}
/*header{height:9.5em ;font-size:.7em; display:inline-block;}*/
  }
@media (min-width: 59em) and (max-width: 69em) {
    	      .fixed-menu{height:2.4em;}
		 	 .fixed-logo img {width:42%;}
			 .Men{margin-top:-.2em;}

	/* Size and font adjustments to make it fit into the screen*/
	.nav ul {
		/*font-size: .6em;*/
	}
/*header{height:8.9em ;font-size:.6em; display:inline-block;  }*/
  
   }
 
 
 /******************/
@media (min-width: 50em) and (max-width: 59em) {
    	      .fixed-menu{height:1.9em;}
		 	 .fixed-logo img {width:42%;}
.Men{margin-top:-.2em;}
	/* Size and font adjustments to make it fit into the screen*/
	.nav ul {
		/*font-size: .5em;*/
	}
/*header{height:10em ;font-size:.5em; display:inline-block;}*/
 
 }
/* The "tablet" and "mobile" version */

@media (max-width: 49.938em) {		
.mobile-logo{display:none;}

	/* Instead of adding a border, we transition the background color */
	.no-touch .nav ul li a:hover,
	.no-touch .nav ul li a:active,
	.no-touch .nav ul li a:focus {
		background: rgb(245, 160, 41);
	}
 	
	.nav ul li {
		-webkit-transition: background 0.5s;
		-moz-transition: background 0.5s;
		-o-transition: background 0.5s;
		-ms-transition: background 0.5s;
		transition: background 0.5s;
	}	
	 
}

/* CSS specific to the 2x3 columns version */
@media (min-width:32.5em) and (max-width: 49.938em) {
	/*.ministry{ padding-top:.5em;}*/
		.nav ul {
font-size:2vw;}
.container > header h1 {
	padding-top:0;
	 font-size:15px;
	 
	line-height: 1.3em;
	margin: 0;
	margin-top:2.2vw;
	font-weight: 200;
	color:#fff;
}

	/***sermons by cat*****/
	 .cat-title{ font-size:4vw; direction:rtl; font-weight:bold; line-height:20vw}	
	
	
	
	  
	.sermons-container{width:100%; height:100%; min-height:250px;   position:relative; float:left; backgroud:#eee; margin:20px auto ; overflow: hidden;}  
	    
	  .one-sermon{width:45%; margin:1.9vw 2.5%; float:right;   box-shadow: 2px 2px 5px -3px #000; text-align:center; background:#fff; height:auto; overflow:hidden;   border-radius:15px; border:.5px solid #fff;
	  	 
-webkit-transition: box-shadow 0.5s, border 0.5s;
		-moz-transition:box-shadow 0.5s, border 0.5s;
		-o-transition: box-shadow 0.5s, border 0.5s;
		-ms-transition: box-shadow 0.5s, border 0.5s;
		transition:box-shadow 0.5s, border 0.5s;}
 			.one-sermon:hover{box-shadow: 2px 2px 10px -1px #390000;   border:.5px solid #000000;}

		
 	  .sermon-image{height:auto; overflow:hidden;  z-index:6666; width:100%;}
.sermon-details{background:#fff; height:auto; width:100%; text-align:left; padding:1vw 0; }
.sermons-title { font-size:2vw;text-align:left;  margin-left:15px;  padding:0vw 0; }
.sermon-speaker-date{line-height:2vw; font-size:1.3vw;  margin-left:10px; color:rgba(148,149,152,1.00); }

 .vid-icons{position:relative; background:rgba(252,255,209,0.00); float:left ; width:100%; height:6.5vw; margin-bottom:0vw; z-index:5555; margin-right:0%;}	 
.vid-icons a{font-size:3.2vw;}

.sermon-icons{width:15%; text-align:center; position:relative; float:left; border:thin solid #FFF7E2;
margin:0 3.6vw; border-radius:50%; font-weight:normal;}


	.streaming-title{height:7vw; font-size:3vw; line-height:7vw;}
	.streaming-footer{height:8vw;}
.promise-mob-title{ height:7vw; font-size:3vw; line-height:7vw;}
.new-mob-title{ height:7vw; font-size:3vw; line-height:7vw;}

.div2{z-index:7777;  width:98%; height:132vw;  position:relative;  
          padding:2vw 0;  margin:0 1%;  border-radius:5px;   background:none;
    }
		  
	 
 .div2> .weekly{margin:2vw 2%;

width:46%; height:60vw;   float:right;box-shadow:0px 2px 5px -1px #000;
                   border-radius:5px; overflow:hidden;}
.div3{height:60vw;}
 .div3> .weekly{margin:2vw 0;

width:48%; height:60vw;   float:right;box-shadow:0px 2px 5px -1px #000;
                   border-radius:0px; overflow:hidden;}

  .div2>.weekly> .title{width:100%; height:15%; background:rgba(128,4,23,0.80); line-height:8vw; text-align:center; text-shadow:.5px .5px #000;font-size:3.1vw; color:#FFF; z-index:9999;  position:relative;}
 
 
 .div3>.weekly> .title{width:100%; height:15%; background: rgba(27,53,70, 1.0); line-height:8vw; text-align:center; text-shadow:.5px .5px #000;font-size:3.1vw; color:#FFF; z-index:9999;  position:relative;}

.weekly-img{width:100%; height:50%;  z-index:5555;  position:relative; overflow:hidden;}		  
.desc{line-height:5.5vw;  font-size:2.3vw; width:100%; height:35%; background:rgba(27,53,70, 0.5);  text-align:center; text-shadow:.2px .1px #000;  color:#FFF; z-index:9999;  position:relative; font-weight:500;}		  
 
 .div3>.weekly>.desc{line-height:5.5vw;  font-size:2.3vw; width:100%; margin-top:0vw; height:35%; background:rgba(27,53,70, 0.5);  text-align:center; text-shadow:.2px .1px #000;  color:#FFF; z-index:9999;  position:relative; font-weight:500;}		  
  .div3 > .registration{ margin:2vw 0;

width:48%; height:60vw;    box-shadow:0px 2px 5px -1px #000;
                   border-radius:0px; overflow:hidden;}
  .div3 > .registration> .title{width:100%; height:15%; background: rgba(27,53,70, 1.0); line-height:8vw; text-align:center; text-shadow:.5px .5px #000;font-size:3.1vw; color:#FFF; z-index:9999;  position:relative;}		  
	#visitors-field{width:40%; background:rgba(78,31,16,0.84);  font-size:2.0vw; height:2.5vw; min-height:25px; color:#fff; margin:20px auto;}			  
#clr{font-size:2vw;}		  
	
}

/* Adapting the font size and width for smaller screns*/
@media (min-width: 32.5em) and (max-width: 38.688em) {
	
.container > header h1 {
	padding-top:0;
	 font-size:15px;
	 
	line-height: 1.3em;
	margin: 0;
	margin-top:2.2vw;
	font-weight: 200;
	color:#fff;
}


	
	.nav li span.icon {
		width: 50%;
	}

	.nav li .icon + span {
		font-size: 3.5vw;
	}
	
	.nav ul {
font-size:3vw;}
	 
}

/* Styling the toggle menu link and hiding it */
.nav .navtoogle{
 	display: none;	
	width: 100%;
	padding-right: .8em;
	padding-top: .2em;
 	font-weight: bold;
	text-align: right;
	color: rgb(7, 16, 15);
	font-size: 1.2em;
	background:none;	
	border: none;
 	cursor: pointer;
	outline:none;
	z-index:8888;
	 
  font-family: 'Droid Arabic Kufi';
  font-style: normal;
   src: url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Regular.eot);
  src: url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Regular.eot?#iefix) format('embedded-opentype'),
       url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Regular.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Regular.woff) format('woff'),
       url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Regular.ttf) format('truetype');
	   
 }

.navtoogle i{
	z-index:-1;
}




/**/

 
/*****/
.icon-menu {
	position: relative;
	top: 0;
	line-height: 0;
	font-size: 1em;

}
@media (max-width: 32.5em) {.container > header h1 {
	padding-top:0;
	 font-size:12px;
	 
	line-height: 1.5em;
	margin: 0;
	margin-top:4vw;
	font-weight: 200;
	color:#fff;
}

/***sermons by cat*****/
	 .cat-title{ font-size:4vw; direction:rtl; font-weight:bold; line-height:20vw}	
	
	
.nav ul {
font-size:3.5vw;}
		.submenus-text{ font-size:2.8vw; line-height:7vw;}
  
	.sermons-container{width:100%; height:100%; min-height:250px;   position:relative; float:left; backgroud:#eee; margin:30px auto ; overflow: hidden;}  
	    
	  .one-sermon{width:86%; margin:1.6vw 7%;   box-shadow: 2px 2px 5px -3px #000; text-align:center; background:#fff; height:auto; overflow:hidden;   border-radius:5%; border:.5px solid #fff; float:right;
	  	  	 
-webkit-transition: box-shadow 0.5s, border 0.5s;
		-moz-transition:box-shadow 0.5s, border 0.5s;
		-o-transition: box-shadow 0.5s, border 0.5s;
		-ms-transition: box-shadow 0.5s, border 0.5s;
		transition:box-shadow 0.5s, border 0.5s;}
			.one-sermon:hover{box-shadow: 2px 2px 10px -1px #390000;   border:.5px solid #000000;}

 	  .sermon-image{height:auto; overflow:hidden;  z-index:6666; width:100%;}
.sermon-details{background:none; height:auto; width:100%; text-align:left; padding:2vw 0;  }
.sermons-title { font-size:2.9vw; text-align:left; margin-left:15px;  padding:1vw 0; position:relative;}
.sermon-speaker-date{line-height:4vw; font-size:2.2vw; margin-left:15px;  color:rgba(148,149,152,1.00);}
 .vid-icons{position:relative; background:rgba(252,255,209,0.00); float:left ; width:100%; height:6.5vw; margin-bottom:5vw; z-index:5555; margin-right:0%;}	
.vid-icons a{font-size:5.2vw;  line-height:11vw;}
.sermon-icons{width:15%; text-align:center; position:relative; float:left; border:thin solid #FFF7E2;
margin:0 7vw; border-radius:50%; font-weight:normal;}





	.streaming-title{height:10vw; font-size:3.5vw; line-height:9.5vw;}
	.streaming-footer{height:10vw;}
.new-mob-title{ height:10vw; font-size:3.5vw; line-height:9.5vw;}

.promise-mob-title{ height:10vw; font-size:3.5vw; line-height:9.5vw;}
.div2{z-index:7777;  width:98%; height:400vw;  position:relative;  
          padding:2vw 0;  margin:0 1%;  border-radius:5px;   background:none;
    }
		  
	 
  .div2>.weekly{margin:2vw 2%;

width:96%; height:95vw;   float:right;box-shadow:0px 2px 5px -1px #000;
                   border-radius:5px; overflow:hidden;}
.div3{height:60vw;}
  .div3.weekly{margin:2vw 2%;

width:96%; height:95vw;   float:right;box-shadow:0px 2px 5px -1px #000;
                   border-radius:0px; overflow:hidden;}

.div3>.registration{margin:2vw auto;

width:100%; height:75vw;   float:right;box-shadow:0px 2px 5px -1px #000;
                   border-radius:0px; overflow:hidden;} 
#visitors-field{width:40%; background:rgba(78,31,16,0.84);  font-size:2.5vw; height:2.5vw; min-height:25px; color:#fff; margin:20px auto;}				   
 .div2>.weekly> .title{width:100%; height:12%; background:rgba(128,4,23,0.80); line-height:11vw; text-align:center; text-shadow:.5px .5px #000;font-size:4.1vw; color:#FFF; z-index:9999;  position:relative;}
 .div3>.weekly> .title{width:100%; height:12%; background:rgba(27,53,70, 1.0); line-height:11vw; text-align:center; text-shadow:.5px .5px #000;font-size:4.1vw; color:#FFF; z-index:9999;  position:relative;}

 .div3>.registration> .title{width:100%; height:12%; background:rgba(27,53,70, 1.0); line-height:9vw; text-align:center; text-shadow:.5px .5px #000;font-size:4.1vw; color:#FFF; z-index:9999;  position:relative;}
#clr{font-size:3vw;}

.weekly-img{width:100%; height:60%;  z-index:5555;  position:relative; overflow:hidden;}		  
.desc{line-height:7vw;  font-size:3.5vw; width:100%; height:29%; background:rgba(27,53,70, 0.5);  text-align:center; text-shadow:.2px .1px #000;  color:#FFF; z-index:9999;  position:relative; font-weight:500;}		  
		  
.div3>.weekly>.desc{line-height:7vw;  font-size:3.5vw; width:100%; margin-top:-2vw; height:34%; background:rgba(27,53,70, 0.5);  text-align:center; text-shadow:.2px .1px #000;  color:#FFF; z-index:9999;  position:relative; font-weight:500;}		  
		  	

 }
 
@media (max-width: 50em) {
		#hiddenContent{width:100%;}

	 #goTop{
		   
		   z-index:9999;
    background:rgba(187,76,51,0.93) url(../fonts/cd-top-arrow.svg) no-repeat 50%;
    padding:15px;
	border-radius:50%;
	display:block;
    position:fixed;
	font-size:70%;
    bottom:-100px;
    left:10px;
	text-align:right;
    cursor:pointer;
	color:#fff;
	
	-webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none;   /* Chrome/Safari/Opera */
  -khtml-user-select: none;    /* Konqueror */
  -moz-user-select: none;      /* Firefox */
  -ms-user-select: none;       /* IE/Edge */
  user-select: none; 
}


	.container > header {

	background:url(../tbg2.png) no-repeat center rgba(233,233,233,0.10) ;
}

	.upper{position:fixed; bottom:0;  background: rgba(164,162,162,0.92); z-index:9999; overflow:hidden;}
	
		.jjsmsm{right:0;  width:18%; height:auto;  position:absolute; top:3px; min-width:105px; z-index:2222; overflow:hidden; }
 	.logo{position:absolute; top:1px; width:12%;    height:auto; min-width:75px; left:-8px;}
	
	   
	.brief{width:98%; height:100%; overflow:auto; text-align:left; margin:20px auto; clear:both; position:relative; 
	 background:rgba(243,243,243,0.70); box-shadow: 1px 2px 5px 0 #000; padding:10px; font-size:110%; direction:ltr;  margin-bottom:20px;}
		
	.contact{right:0;}
	.language{ }
		.social{ }



	.Men{ 	background:rgba(27,53,70, 1.00);

	margin-top:0; height:2.5em; z-index:9999; position:relative; 
	}
 		  .fixed-menu{height:3em;}
.SM{position:inherit;}

 #about , #sermons , #praise , #readings{width:100%;}
 

  	 
	header{display:block; z-index:2222;   min-height:55px; background:rgba(233,233,233,0.20); } 
	.mobile-logo{display:none; z-index:9999;}
	
	
	/* Unhiding the styled menu link */
	.nav .navtoogle{
		width:40%;
 		margin:0 30%;
 		display: inline-block;
		font-size:100%;
		text-align:center;
		
	}
	
 
	/* Animating the height of the navigation when the button is clicked */
	
	/* When JavaScript is disabled, we hide the menu */
	.no-js .nav ul {
		max-height: 20vw;
		overflow: hidden;
	}
	
	/* When JavaScript is enabled, we hide the menu */
	.js .nav ul {
		max-height: 0em;
		overflow: hidden;
	}
	
	/* Displaying the menu when the user has clicked on the button*/
	.js .nav .active + ul {		
		max-height: 20em;
		overflow: auto;
		-webkit-transition: max-height .4s;
		-moz-transition: max-height .4s;
		-o-transition: max-height .4s;
		-ms-transition: max-height .4s;
		transition: max-height .4s;
	}
.nav ul {
	max-width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
 	font-weight: 300;
}
	/* Adapting the layout of the menu for smaller screens : icon on the left and text on the right*/
	
	.nav li span {
		display: inline-block;
		height: 100%;
		
	}

	.nav a {
		padding: 0.5em;
				
	}
	
	.icon + span {
		margin-left: 1em;
		float:none;
		text-align:center;
	}
	
	/* Adding a left border of 8 px with a different color for each menu item*/
	.nav li:nth-child(6n+1) {
		border-left: 8px solid rgb(174, 78, 1);
	}

	.nav li:nth-child(6n+2) {
		border-left: 8px solid rgb(191, 117, 20);
	}

	.nav li:nth-child(6n+3) {
		border-left: 8px solid rgb(13, 111, 150);
	}

	.nav li:nth-child(6n+4) {
		border-left: 8px solid rgb(10, 75, 117);
	}

	.nav li:nth-child(6n+5) {
		border-left: 8px solid rgb(16, 34, 44);
	}

	.nav li:nth-child(6n+6) {
		border-left: 8px solid rgb(9, 18, 25);
	}

	/* make the nav bigger on touch screens */
	.touch .nav a {
		padding: 0.8em;
	}
	
	
	
	 
	
	/*****share******/
			.share{ background:rgba(120,138,187,1.00); border:none;  transition:all .5s ;
line-height:6vw; width:auto;  position:fixed; right:0; bottom:30px; font-size:3vw; text-align:right; padding:.6vw .9vw;  text-shadow:none; border-radius:0px; z-index:9999;}	
			
			
				.icon-share{ position:relative; float:right; color:rgba(255,255,255,1.00); margin-right:3px; line-height:6vw; font-size:3.1vw; }	
			#shareIcons{   z-index:9999; width:30vw; min-width:110px; float:left;  }	

.a2a_svg{height:5vw;line-height:6vw;width:5vw; margin-top:.5vw;  }
			
	/*****breadcrumb******/
	.breadcrumb{height:5.9vw;
	overflow-x:auto;
	overflow-y:hidden;
	width:auto;}
	
			.breadcrumb li a {
		 
			font-size:2vw;
		}
		
		/****main*******/
		
		.vision{  line-height:5vw; font-size:3.5vw;}
		
		.div1{  z-index:7777;  width:100%; height:233vw;  position:relative; background:rgba(95,76,243,0.00);
		  line-height:5.8vw; font-size:2.7vw;  text-align:center;
     padding:3.5vw 2% ;color:#FFF; }
	 
		.streaming{width:100%; height:67vw; margin:0 auto; float:right;box-shadow:2px 2px 5px 0px #413C37;
                   border-radius:0px; overflow:hidden;
				    text-shadow:.4px .4px #000; }
		


.div1 > .weekly{margin:0 auto; margin-top:4%;
width:100%; height:60vw;   float:right; box-shadow:2px 2px 5px 0px #413C37;
                   border-radius:0px; overflow:hidden;}
.div1 > .weekly:nth-child(3n+1){}
.div1 > .weekly> .title{width:100%; height:12%; background:rgba(27,53,70, 1.0);  text-align:center; text-shadow:.4px .4px #000;  z-index:9999;  position:relative;}



		
			.new{ margin:0 auto; margin-top:4%;
width:100%; height:auto;   float:right;box-shadow:2px 2px 5px 0px #413C37; 
                   border-radius:0px; overflow:hidden; 
	  animation:blur 1.25s ease infinite; text-shadow:-.5px 0px .2px #fff,
      0px 0px .2px #fff;}
				   
		@keyframes blur{
  from{
      text-shadow:0px 0px 5px #fff,
      0px 0px 10px #fff , 
      0px 0px 15px #fff,
      0px 0px 20px #fff,
      0px 0px 25px #fff;
	  
	  
	  
	  
	  }
} 
.new-mob-title{display:block; width:100%;   background:rgba(27,53,70, 1.0);  z-index:9999;  position:relative; direction:rtl;}
.new-mob-footer{display:inline-table; width:100%; height:6vw;  background:rgba(27,53,70, 0.5); float:left;  z-index:9999;  position:relative; direction:rtl; margin-top:-2vw;}

.new-img{width:100%; height:auto;  float:right; position:relative; overflow:hidden; margin:0; padding:0;}
.new-text{ display:none; }	




 	.promise{ margin:0 auto; margin-top:4%;
width:100%; height:auto;   float:right;box-shadow:2px 2px 5px 0px #413C37; 
                   border-radius:0px; overflow:hidden;} 

.promise-mob-title{display:block; width:100%;  background:rgba(27,53,70, 1.0);  z-index:9999;  position:relative; direction:rtl;}


.promise-mob-footer{display:inline-table; width:100%; height:6vw; background:rgba(27,53,70, 0.5); margin-top:-2vw; z-index:9999;  position:relative; float:left;}

.promise-img{width:100%; height:auto; float:right; }
.promise-text{ display:none;}		
		
		
 		


		.notes{width:100%; height:40vw; margin:3vw auto; float:right; box-shadow:2px 2px 5px 0px #413C37; text-shadow:.1px .1px #000;
                   border-radius:0px; overflow:hidden;  text-align:center; color:#fff; font-size:2.7vw; line-height:6.5vw;
				    } 
		.note{font-size:3vw;  text-shadow:0px; }
		.meetings{width:100%; height:30vw; margin:1vw auto; float:left; box-shadow:2px 2px 5px 0px #413C37;  text-shadow:.1px .1px #000;
                   border-radius:0px; overflow:hidden; line-height:5.5vw; font-size:2.7vw; text-align:center;}		   
		        .meeting-txt{font-size:2.2vw;   text-shadow:.1px .1px #fff; color:rgba(108,11,13,1.00); line-height:4vw; text-align:right; width:25%; float:right;}




	  


.div3{  z-index:7777;  width:100%;    position:relative; background:rgba(95,76,243,0.00);
		  line-height:5.8vw; font-size:2.7vw;  text-align:center;
     padding:3.5vw 2% ;color:#FFF;   }

	.close{width:100%; height:14vw; margin-bottom:30px; background:rgba(27,53,70, 1.00) url(../tbg.png) no-repeat 20% 70%; background-size:cover; text-align:center; color:#fff; text-shadow:.2px .2px 1px #000; border-top:4px solid rgb(174, 78, 1);
    box-shadow: 2px 2px 16px 2px #171717; font-size:2vw;}

 			/***********/
.video-audio-related-wrapper{height:auto;}
		.video-audio{width: 100%; position:relative;
    min-height:62vw; clear:right; margin:5px auto; overflow:hidden;   padding-bottom:3vw;
	-webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none;   /* Chrome/Safari/Opera */
  -khtml-user-select: none;    /* Konqueror */
  -moz-user-select: none;      /* Firefox */
  -ms-user-select: none;       /* IE/Edge */
  user-select: none; }
		.video-audio iframe{height:55vw; box-shadow: 1px 1px 5px 3px rgba(107,107,107,0.73); }
	#audio{height:55vw; box-shadow: 1px 1px 5px 3px rgba(107,107,107,0.73); }
.audioImg{width:100%; text-align:center; margin-top:-10vw; z-index:1111; position:relative; background:white;}
 	.sermon1{width:100%; margin:0 auto;  background:rgba(167,118,56,0.84); height:7vw; overflow:hidden; border-bottom:solid 1px black;
	  }
		  
		   .sermon11{width:33.333%; margin:0 auto; display:block; direction:rtl; position:relative;  cursor:pointer; float:right;
		     text-align:center; overflow:hidden;   color:#fff; line-height:6.5vw;  height:7vw; font-size:2.5vw;
			 }
			 
			 
		.sermon-title{ 
 			  padding:1.5vw 0 2.5vw 0; 
  		   min-height:16vw;

				margin:0 auto; font-size:70%;
	}
	
  .subj-title{font-size:3vw;}
.subj-details{font-size:2vw;}

	
	.description{width: 100%; position:relative; background:rgba(243,243,243,0.70) ;
     min-height: 15vw; height:auto; clear:none; margin-right:0%; margin-top:0vw; float:right; overflow:hidden; margin-bottom:1vw; box-shadow: 1px 1px 5px 3px rgba(107,107,107,0.73); direction:rtl; text-align:right; padding:1vw 2vw; font-size:2vw; }
	.related-wrap{width:100%; height:41.5vw; overflow:hidden; background:rgba(99,53,29,0.52); margin:0vw 0 2vw 0;}
	.related{width: 100%; position:relative; padding:.5vw ; 
    height: 40vw;     overflow-x: scroll;overflow-y: hidden;
 clear:both; margin:15px auto; direction:rtl;   box-shadow: 0 0 0 0 rgba(255,255,255,0.2);
	  
			 }
	.arrowDown{display:none;}
	.arrowUp{display:none;}
	.related-list{width: 450vw; overflow:auto; height:29vw; padding-top:0;}

	.related-item{width:29vw; height:28vw; background:rgba(255,255,255,0.80); overflow:hidden; margin:auto .8vw; 
	font-size:2vw; cursor:pointer; float:right; position:relative; line-height:3.5vw; direction:rtl;}
	.related-item:nth-child(4n+4) {margin-left:0;}
	.thumb-wrapper{width:100%; height:17vw; position:relative; float:left; overflow:hidden;}
    .thumb-wrapper img{width: 110%; position: relative;top: -2.9vw;}

	.related-text{width:100%; height:50%; text-align:center; position:relative; float:right; direction:rtl; overflow:hidden;
	  padding:0px 0px;}
 .sermons-cat{width:95%; position:relative; height:28vw;    background:rgba(233,233,233,0.00); margin:1vw 2.5% 0 2.5%;
	float:right; border-radius:0px;  font-size:2.3vw;   }
	
 	.half-cat{position:relative; width:40%; float:right;  margin-right:5%;}
	.otherhalf-cat{position:relative; width:40%; float:right; margin-right:10%;}

  .sermon-cat{ width:95%;  box-shadow: 2px 2px 5px -1px #000; height:100%; margin:3% 2.5%; line-height:5vw;
   background:rgba(233,233,233,0.50); float:right; }

  .sermon-cat-title{font-size:130%; line-height:6.6vw; background:rgba(27,53,70, 1.00); color:white; text-align:center; }

 .i-cat{width:15%; float:right;  margin:.5vw 5px -.5vw 0px;}
	.sermons-cat i{font-size:120%;  margin-right:1vw;  text-shadow:.5px .3px #FDF7CC;}
	.sermon-cat a{text-shadow:.5px .3px #FDF7CC; color:rgba(96,0,1,1.00)}
	.sermon-cat a:hover{color:rgba(24,0,107,1.00);}
	

.vid-icons a{  color:#FFF7E2; text-shadow:.5px .5px #ccc;  margin:2vw 0 ; text-align:center; 
-webkit-transition: all 0.5s;
		-moz-transition: all 0.5s;
		-o-transition: all 0.5s;
		-ms-transition: all 0.5s;
		transition: all 0.5s;}

.vid-icons a:hover{  color:#E1E1E1;   text-shadow:.5px .5px #fff;}


 


 .videoIcon:before{
content: 'شاهد فيديو';
 	z-index:9999;
	font-size:8px;
    line-height:5.5vw;
 text-shadow:none;
	 position: absolute;
     top: -6vw;
	 left: -1.5vw;
font-weight:bolder;
 	width:170%;
 	padding:0 .6vw;
background:rgba(83,0,1,0.70);
    
     display: inline-block;
	  
	 
	color:#FFFFFF;

 
 
  
 
-webkit-transition: all 0.5s;
		-moz-transition: all 0.5s;
		-o-transition: all 0.5s;
		-ms-transition: all 0.5s;
		transition: all 0.5s;
		    opacity: 0;}
.videoIcon:hover:before{
    
	    opacity: 1;
   
 }
 
 
  .audioIcon:before{
content: '  صوت فقط';
	z-index:9999;
	font-size:8px;
	line-height:5.5vw;
 text-shadow:none;

 position: absolute;
     top: -6vw;
	 left: -1.5vw;
font-weight:bolder;
 	width:160%;
 	padding:0 .6vw;
background:rgba(83,0,1,0.70);
    
     display: inline-block;
	  
	 
	color:#FFFFFF;

 
 
  
 
-webkit-transition: all 0.5s;
		-moz-transition: all 0.5s;
		-o-transition: all 0.5s;
		-ms-transition: all 0.5s;
		transition: all 0.5s;
		    opacity: 0;}
.audioIcon:hover:before{
    
	    opacity: 1;
   
 }
 
  
  .dloadIcon:before{
content: ' تحميل mp3';
 	z-index:9999;
	direction:rtl;
	font-size:8px;
	line-height:5.5vw;
 position: absolute;
     top: -6vw;
	 left: -1.5vw;
 text-shadow:none;
font-weight:bolder;
 	width:160%;
 	padding:0 .6vw;
background:rgba(83,0,1,0.70);
    
     display: inline-block;
	  
	 
	color:#FFFFFF;
 
 
  
 
-webkit-transition: all 0.5s;
		-moz-transition: all 0.5s;
		-o-transition: all 0.5s;
		-ms-transition: all 0.5s;
		transition: all 0.5s;
		    opacity: 0;}
.dloadIcon:hover:before{
    
	    opacity: 1;
   
 }
.mkala-img{text-align:center; width:95%; height:auto;  position:relative;float:right; background:none; margin:1vw 2.5%; border-radius:5%; overflow:hidden;}

  
}