

*{
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
html{
	scroll-behavior:smooth;
}




body{
	background: white;
	box-sizing: border-box;
	.poppins-thin {
		font-family: "Poppins", sans-serif;
		font-weight: 100;
		font-style: normal;
	  }
	  
	  .poppins-medium {
		font-family: "Poppins", sans-serif;
		font-weight: 500;
		font-style: normal;
	  }
	  
	  .poppins-semibold {
		font-family: "Poppins", sans-serif;
		font-weight: 600;
		font-style: normal;
	  }
	  
	  .poppins-bold {
		font-family: "Poppins", sans-serif;
		font-weight: 700;
		font-style: normal;
	  }
	  
	  .poppins-light-italic {
		font-family: "Poppins", sans-serif;
		font-weight: 300;
		font-style: italic;
	  }
	  
	  .poppins-regular-italic {
		font-family: "Poppins", sans-serif;
		font-weight: 400;
		font-style: italic;
	  }
	  
	  .poppins-medium-italic {
		font-family: "Poppins", sans-serif;
		font-weight: 500;
		font-style: italic;
	  }
	  
	  .poppins-bold-italic {
		font-family: "Poppins", sans-serif;
		font-weight: 700;
		font-style: italic;
	  }


}

h1{
    text-align: center;
    color: rgb(245, 183, 12);
    font-size: 45PX;
	margin-bottom: 10px;
	padding-top: 15px;
}
h2{
    font-size: 20PX;
    text-align: center;
	margin-bottom: 10px;
}
h3{
    font-size: 30px;
	font-weight: 500;
    color: rgb(245, 183, 12);
	margin-bottom: 10px;
}
h4{
    font-size: 25px;
	font-weight: 500;
	margin-bottom: 10px;

}

.effective{
    color: #fb04ea;
}

span{
	color: #1c1517;
	font-size: 22px;
}




.address{
	text-align: justify;
	padding-left: 290px;
text-transform: capitalize;
	
}
.map{
	padding: 40px;
	border: 1px dashed rgb(252, 191, 8);
	border-radius: 20px;
}

p{
	text-align: justify;
	font-size: 22px;
	margin-bottom: 10px;
}

#duya-a{
	padding-bottom: 10px;
	width: 100%;
	border-bottom:1px dashed #df70d8;
	
}


.anchor{
	color: #030e1ee8;
	padding-bottom:10px ;
}


.anchor:hover{
	color: #09a0f1;
	

}

.abbr{
	font-size: 16px;
}

	.section{
		width: 100%;
		height: auto;
		background-color: #ddd.;
	}

	.container{
		width: 90%;
		margin: auto;
		padding: 40px;
		display: inline-block;
		height: auto;
		
	}
	.content-section{
		width: 60%;
		float: left;
		height: auto;

		display:block;
	
	
	}
	.image-section{
		float: right;
		width: 30%;
		height: auto;
		display: block;
		
		
	}
	.image-section img, video, iframe{
		width: 330px;
		height: auto;
		padding: 20px 20px;
	
	}
	
	.titlee{
		text-align: center;
		color: rgb(245, 183, 12);
         font-size: 45PX;
		
	}
	.content p{
		text-align: justify;
	}
	.des{
		text-align: center;
		font-size: 18px;
	}
	.button{
		padding: 5px 10px 5px 0px;
	}
	.button a{
		font-size: 18px;
	}
	
	#address-sign{
		color: #d8ab16;
	}
	#envelop{
		padding: 0 7px;
	}
	
	
	#map{
		width: 30%;
		padding: 25px 40px 10px 10px;

	}
	span{
		font-size: 18px;
	}
	#new-address{
		text-align:center;
		
	
	}
 .intro{
	width: 100%;
	height: 120px;
	text-align: center;
	
 }
 #active{
	background-color: #ddd;
	border-radius: 10px;
	color: black;
 }
 #barat{
	background-color: #edd376;
	padding: 10px;
 }
 #sahoor{
	background-color: #e0e0d4;
	padding: 10px;

 }
 .sahoor{
	color: #e18617;
 }
 h6{
    
    padding: 15px 5px;
	font-size: 20px;
}

#activa{
	background: #a0bfeb;
	width: 150px;
	height: 100%;
}
#chapter{
	width: 100%;
	height: 80px;
	font-size: 22px;
	background: #e9c448;
	text-align: center;
	padding-top: 15px;
}
/*  ---------------More contents section starts-----*/
.more-contents-container{
	width: 100%;
	background: #69b0d5;
	align-items:flex-end;
	margin: 1px;
}
.more-contents-container-section{
	width: 19.9%;
	background: rgba(245, 168, 2, 0.966);
	height: 110px;
	border-bottom:1px solid #110e0b;
	float: right;
	align-content: center;
	margin-right: 1px;
	float: left;
	border-radius: 50px;
	padding: 3px;
	margin-bottom: 3px;

}
.more-contents-a{
	
	color: black;
	
	width: 100%;
	text-transform: capitalize;
	text-decoration:none;
	padding: 5px 30px;
	font-size: 20px;
	text-align: center;
	
	}
.more-contents-a:hover{
	background: #040404;
	width: 100%;
	height: 100%;
	border-radius: 50px;
	color: white;
}
#dignity-muslim-chapter-tab{
background: rgb(239, 159, 11);	
}

#dignity-muslim-chapter-tab:hover{
	border-bottom: 1px black solid;
}







/*  ---------------More contents section ends-----*/

span{
	float: right;
}
		
	
	

@media screen and (max-width: 768px){
		p{
	
	font-size: 16px;
	
}
h2{
    font-size: 18PX;
  
}
h3{
    font-size: 22px;
	font-weight: 500;
    
}


	
	.content-section{
	
		width: 100%;
		margin: auto;
		
		

		
	}
	.image-section{
	   padding-top:50px;
		
		width: 100%;
		
		
		margin-top: 25px;
		
		height: auto;
	}
	.image-section img, video, iframe{
		width: 330px;
		height: auto;
		padding:20px 30px 20px 30px;
		
	
	}
	video{
	    padding-top:20px;
	}
	
	#map{
		padding-right: 200px;
	}
	.h1{
		font-size: 25px;
	}
	.culture{
		display:block
	}
	h2{
		display: none;
	}
	.more-contents-container-section{
			
		width: 100%;
		

	}
	
	
	
	#second-nav{
		height: 200px;
	}
	.sahoor-image{
		display: none;
	}
	
	
	
	
}

/*---------------------
	@media only screen and (-webkit-min-device-pixel-ratio: 2.625) {
		.more-contents-container-section{
			
			width: 100%;
	
		}
		img{
			width: 330px;
		}
		#chapter{
			height: 100px;
			
		}
		.image-section video,
	.image-section img,
	.image-section iframe{
		width: 300px;
		
	}
		
	#second-nav{
		height: 200px;
	}
	
	.image-section{
		float: none;
		width: 100%;
		margin: auto;
		display: block;
		margin-top: 25px;
		box-sizing: border-box;
	}	
	.sahoor-image{
		display: none;
	}
	
	
		
		
		
			
		
	}
	-----------------^/
	
	


	

	
	
