@media only screen and (min-width: 1920px){



body{

background-size: cover;

margin:0;

padding:0;

padding-right: 0;

width: 100%;
}

	#Title{
		background-image: url(../Image/4V7A1383.jpg);
		width: 100%;
		height: 800px;
		background-attachment: fixed;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		opacity: .75;
		position: relative;
	}

	#Buy_Button {
				position: absolute;
				background-color: transparent;
				border-style: solid;
				border-width: thin;
				color: #ffffff;
				text-align: center;
				text-decoration: none;
				display: inline-block;
				font-size: 25pt;
				font-family: 'Poppins', sans-serif;
				font-weight: 500;
				-webkit-transition-duration: 0.4s; /*Safari*/
				transition-duration: 0.4s;
				cursor: pointer;
				/* width: 26%; */
				line-height: 43px;
				border-color: white;
				padding-top: 6px;
				padding-bottom: 6px;
				/* margin-left: 34%; */
				margin-top: 40px;
				left: 50%;
				transform: translateX(-50%);
				}
			#Buy_Button:hover {

				background-color: silver;
				color: gray;
				box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
			}
		.logo{

		}

	#Join{
		color: white;
		font-family: 'Poppins', sans-serif;
		font-weight: 100;
		font-size: 25pt;
		/* margin-left: 550px; */
		margin-bottom: 100px;
		padding-top: 50px;
		text-shadow: 4px 4px 4px #000000;
		position: relative;
		width: 100%;
		text-align: center;
	}

	nav{
		position: fixed;
		z-index: 10000;
		/* margin-left: 73%; */
		margin-top: 40px;
		width: 100%;
		/* float: right; */
	}
	.navigate{
				background-color: black;
				opacity: .5;
				
				-webkit-transition: background-color 1000ms linear;
                -ms-transition: background-color 1000ms linear;
    			transition: background-color 1000ms linear;


			}

			.stop{
				-webkit-transition: background-color 1000ms linear;
                -ms-transition: background-color 1000ms linear;
    			transition: background-color 1000ms linear;


			}

	li {
		display: inline;
		padding-right: 15px;

	}

	li a{
		color: white;
		text-decoration: none;
		
		font-size: 17pt;

	}

	a{
		text-decoration: none;
	}

	li a:hover{

		color: yellow;
	}

	li:last-child {
    background: teal;
    padding: 8px;
}
	header{
		color: white;
		font-family: 'Poppins', sans-serif;
		font-size: 50pt;
		text-align: center;
		font-weight: 600;
		margin-top: 200px;
		 text-shadow: 4px 4px 4px #000000;
	}

	#Updates{
		background-color: white;
		width: 100%;
		height: 600px;
		background-attachment: fixed;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		position: relative;
		
		

	}

	#microphone{
		margin-left: 2%;
		margin-top: 100px;
		position: absolute;
	}

	#Invite{background-image: url(../Image/Faith.jpg);width: 100%;height: 200px;opacity: .85;position: relative;background-position: 50% 60%;background-size: cover;background-repeat: no-repeat;justify-content: center;}

	#Join_Button{
		position: absolute;
		background-color: gold;
		border-style: solid;
		border-width: thin;
		color: #ffffff;
		border-radius: 5px;
		text-align: center;
		text-decoration: none;
		display: inline-block;
		font-size: 25px;
		font-family: 'Poppins', sans-serif;
		font-weight: 500;
		-webkit-transition-duration: 0.4s; /*Safari*/
		transition-duration: 0.4s;
		cursor: pointer;
		/* width: 27.04%; */
		line-height: 43px;
		border-color: gold;
		margin-top: -70px;
		/* margin-left: 37%; */
		text-shadow: 2px 2px 2px #000000;
		left: 50%;
		transform: translateX(-50%);
	}

	#Join_Button:hover{
		background-color: #c6a30d;
		border-color: #c6a30d;
		text-decoration: underline;
	}
		

	#Social{
		background-color: teal;
		width: 100%;
		height: 520px;
	}

	#Sermon{
		font-family: 'Poppins', sans-serif;
		position: absolute;
		margin-left: 3%;
		margin-top: 30px;
		font-size: 25pt;
		color: silver;
		text-shadow: 2px 2px 2px #000000;
	}

	#Latest{
		font-family: 'Poppins', sans-serif;
		position: absolute;
		margin-left: 4%;
		line-height: 30px;
	}

	.first{

		margin-top: 80px;

	}

	.second{
		margin-top: 180px;
	}

	.third{
		margin-top: 280px;
	}

	.fourth{
		margin-top: 380px;
	}

	.Place{
		position: absolute;
		margin-top: 30px;
		margin-left: 30%;
		width: 150px;
		height: 150px;
		opacity: 1.0;
		-webkit-transition: background-color 1000ms linear;
		-ms-transition: background-color 1000ms linear;
		transition: background-color 1000ms linear;
	}

	.Place:hover{
		opacity: .5;
	}

	.Get_Involved{

position: absolute;

margin-top: 30px;

margin-left: 54%;

opacity: 1.0;

}

	.Get_Involved:hover{
		opacity: .5;

	}
	

	.Connect{
		position: absolute;
		margin-top: 30px;
		margin-left: 76%;
		opacity: 1.0;
		-webkit-transition: background-color 1000ms linear;
		-ms-transition: background-color 1000ms linear;
		transition: background-color 1000ms linear;
	}

	.Connect:hover{
		opacity: .5;
	}

	#P_Head{
		margin-top: 340px;
		margin-left: 32%;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 22pt;
	}

	#I_Head{
		margin-top: 340px;
		margin-left: 54%;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 20pt;
	}

	#C_Head{
		margin-top: 340px;
		margin-left: 78%;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 22pt;
	}

	#P_Par{
		margin-top: 395px;
		margin-left: 30%;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 12pt;
		padding-right: 58%;
		line-height: 30px;
	}

	#I_Par{
		margin-top: 395px;
		margin-left: 54%;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 12pt;
		padding-right: 34%;
		line-height: 25px;
	}

	#C_Par{
		margin-top: 395px;
		margin-left: 77%;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 12pt;
		padding-right: 250px;
		line-height: 25px;
	}

	.tweets{
		position: absolute;
		margin-top: 30px;
		margin-left: 100px;
	}

	#Where{
		background-color: #36384c;
		width: 100%;
		height: 370px;
		background-attachment: fixed;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		position: relative;
		
		

	}

	#Location{

		position: absolute;
		margin-top: 30px;
		margin-left: 100px;
	}

	img{

		width: 200px;
	}


		#menuToggle input
{
  display: block;
  width: 40px;
  height: 32px;
  position: absolute;
  top: -7px;
  left: -5px;
  
  cursor: pointer;
  
  opacity: 0; /* hide this */
  z-index: 2; /* and place it over the hamburger */
  
  -webkit-touch-callout: none;
}



	.give{

		position: absolute;
		margin-left: 83%;
		margin-top: 20px;
	}

	.cta_head{

		color: white;
		margin-left: 30%;
		font-size: 31px;
		margin-top: 40px;
		position: absolute;
		font-weight: 500px:;
	}

	.cta_join{

		color: white;
		margin-left: 30%;
		font-size: 24px;
		margin-top: 90px;
		position: absolute;
		font-weight: 200;



}

	.border_head{
		background-color: teal;
		width: 400px;
		padding: 2px 2px 2px 2px;
		position: absolute;
		margin-left: 29%;
		margin-top: 78px;
	}

	.cta_contact{
		color: white;
		margin-left: 60%;
		font-size: 31px;
		margin-top: 40px;
		position: absolute;
		font-weight: 500px:;


	}

	.cta_info{

		color: white;
		margin-left: 60%;
		font-size: 24px;
		margin-top: 90px;
		position: absolute;
		font-weight: 200;
		text-decoration: none;

	}

	.cta_info a {
    color: #1DA1F2; /* Twitter blue or whatever color you want */
    text-decoration: none;
}

	.border_info{
		background-color: teal;
		width: 400px;
		padding: 2px 2px 2px 2px;
		position: absolute;
		margin-left: 59%;
		margin-top: 78px;



	}


	




}
















@media only screen and (min-width: 1025px) and (max-width: 1919px){



body{

	background-size: cover;
	
	 margin:0;
    padding:0;
    padding-right: 0;
    width: 100%;
}

	#Title{
		background-image: url(../Image/4V7A1383.jpg);
		width: 100%;
		height: 800px;
		background-attachment: fixed;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		opacity: .75;
		position: relative;
	}

	#Buy_Button {
				position: absolute;
				background-color: transparent;
				border-style: solid;
		    	border-width: thin;
		    	color: #ffffff;

		    	text-align: center;
		    	text-decoration: none;
		    	display: inline-block;
		    	font-size: 19px;
		    	font-family: 'Poppins', sans-serif;
				font-weight: 500;
		        -webkit-transition-duration: 0.4s; /*Safari*/
		    	transition-duration: 0.4s;
		    	cursor: pointer;
		    	width: 38.04%;
		    	line-height: 43px;
		    	border-color: white;
		    	padding-top: 6px;
		    	padding-bottom: 6px;
		    	margin-left: 30%;
		    	margin-top: 40px;
					}
			#Buy_Button:hover {

				background-color: silver;
				color: gray;
				box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
			}
		.logo{

		}

	#Join{
		color: white;
		font-family: 'Poppins', sans-serif;
		font-weight: 100;
		font-size: 21pt;
		margin-left: 18.65%;
		margin-bottom: 100px;
		padding-top: 50px;
		 text-shadow: 4px 4px 4px #000000;
		position: relative;
	}

	nav{
		position: fixed;
		z-index: 10000;
		margin-left: 50.68%;
		margin-top: 40px;
		width: 100%;

	}
	.navigate{
				background-color: black;
				opacity: .5;
				
				-webkit-transition: background-color 1000ms linear;
                -ms-transition: background-color 1000ms linear;
    			transition: background-color 1000ms linear;


			}

			.stop{
				-webkit-transition: background-color 1000ms linear;
                -ms-transition: background-color 1000ms linear;
    			transition: background-color 1000ms linear;


			}

	li {
		display: inline;
		padding-right: 15px;

	}

	li a{
		color: white;
		text-decoration: none;
		
		font-size: 17pt;

	}

	a{
		text-decoration: none;
	}

	li a:hover{

		color: yellow;
	}

	li:last-child {
    background: teal;
    padding: 8px;
}
	header{
		color: white;
		font-family: 'Poppins', sans-serif;
		font-size: 50pt;
		text-align: center;
		font-weight: 600;
		margin-top: 200px;
		 text-shadow: 4px 4px 4px #000000;
	}

	#Updates{
		background-color: white;
		width: 100%;
		height: 600px;
		background-attachment: fixed;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		position: relative;
		
		

	}

	#microphone{
		margin-left: 55%;
		margin-top: 100px;
		position: absolute;
	}

	#Invite{

		background-image: url(../Image/Faith.jpg);
		width: 100%;
		height: 200px;
		opacity: .85;
		position: relative;
		background-position: 50% 60%;

	}

	#Join_Button{
		position: absolute;
				background-color: gold;
				border-style: solid;
		    	border-width: thin;
		    	color: #ffffff;
border-radius: 5px;
		    	text-align: center;
		    	text-decoration: none;
		    	display: inline-block;
		    	font-size: 21px;
		    	font-family: 'Poppins', sans-serif;
				font-weight: 500;
		        -webkit-transition-duration: 0.4s; /*Safari*/
		    	transition-duration: 0.4s;
		    	cursor: pointer;
		    	width: 35.04%;
		    	line-height: 43px;
		    	border-color: gold;
		    	margin-top: -70px;
		    	margin-left: 32.24%;
		    	text-shadow: 2px 2px 2px #000000;

	}

	#Join_Button:hover{
		background-color: #c6a30d;
		border-color: #c6a30d;
		text-decoration: underline;
	}
		

	#Social{
		background-color: teal;
		width: 100%;
		height: 520px;
	}

	#Sermon{
		font-family: 'Poppins', sans-serif;
		position: absolute;
		margin-left: 60%;
		margin-top: 30px;
		font-size: 25pt;
		color: silver;
		text-shadow: 2px 2px 2px #000000;
	}

	#Latest{
		font-family: 'Poppins', sans-serif;
		position: absolute;
		margin-left: 60%;
		line-height: 30px;
	}

	.first{

		margin-top: 80px;

	}

	.second{
		margin-top: 180px;
	}

	.third{
		margin-top: 280px;
	}

	.fourth{
		margin-top: 380px;
	}

	.Place{
		position: absolute;
		margin-top: 30px;
		margin-left: 49.48%;

		width: 7.81%;
		height: 150px;

		opacity: 1.0;
				
				-webkit-transition: background-color 1000ms linear;
                -ms-transition: background-color 1000ms linear;
    			transition: background-color 1000ms linear;
    			z-index: -1;

	}


	img{
		width: 150px;
	}







	.Place:hover{
		opacity: 0;
	}

	.Get_Involved{

		position: absolute;
		margin-top: 30px;
		margin-left: 62.33%;

		opacity: 0;
		z-index: -1;
				
				
	}

	.Get_Involved:hover{
		opacity: 0;

	}
	

	.Connect{
		position: absolute;
		margin-top: 30px;
		margin-left: 75.52%;
		z-index: -1;
		opacity: 1.0;
				
				-webkit-transition: background-color 1000ms linear;
                -ms-transition: background-color 1000ms linear;
    			transition: background-color 1000ms linear;

	}

	.Connect:hover{
		opacity: .5;
		z-index: -1;
	}

	#P_Head{
		margin-top: 340px;
		margin-left: 51.04%;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 22pt;
		z-index: -1;
	}

	#I_Head{
		margin-top: 340px;
		margin-left: 62.5%;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 20pt;
		z-index: -1;
	

	}

	#C_Head{
		margin-top: 340px;
		margin-left: 77.08%;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 22pt;
		z-index: -1;

	}

	#P_Par{
		margin-top: 395px;
		margin-left: 49.48%;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 10pt;
		/*padding-right: 735px;*/
		line-height: 30px;
		width: 180px;
		z-index: -1;
	}

	#I_Par{
		margin-top: 395px;
		margin-left: 62.5%;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 11pt;
		/*padding-right: 500px;*/
		line-height: 25px;
		width: 180px;
		z-index: -1;

	}

	#C_Par{
		margin-top: 395px;
		margin-left: 75.52%;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 11pt;
		/*padding-right: 250px;*/
		line-height: 25px;
		width: 180px;
		z-index: -1;
	}

	.tweets{
		position: absolute;
		margin-top: 30px;
		margin-left: 10.21%;
	}

	#Where{
		background-color: #36384c;
		width: 100%;
		height: 370px;
		background-attachment: fixed;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		position: relative;
		
		

	}

	#Location{

		position: absolute;
		margin-top: 30px;
		margin-left: 100px;
	}


	#menuToggle input
{
  display: block;
  width: 40px;
  height: 32px;
  position: absolute;
  top: -7px;
  left: -5px;
  
  cursor: pointer;
  
  opacity: 0; /* hide this */
  z-index: 2; /* and place it over the hamburger */
  
  -webkit-touch-callout: none;
}

.give{

		position: absolute;
		margin-left: 70%;
		margin-top: 80px;
		z-index: -1;
	}



	.cta_head{

		color: white;
		margin-left: 60%;
		font-size: 29px;
		margin-top: 40px;
		position: absolute;
		font-weight: 500px:;
	}

	.cta_join{

		color: white;
		margin-left: 60%;
		font-size: 22px;
		margin-top: 90px;
		position: absolute;
		font-weight: 200;



}

	.border_head{
		background-color: teal;
		width: 400px;
		padding: 2px 2px 2px 2px;
		position: absolute;
		margin-left: 59%;
		margin-top: 78px;
	}

	.cta_contact{
		color: white;
		margin-left: 20%;
		font-size: 29px;
		margin-top: 40px;
		position: absolute;
		font-weight: 500px;
		z-index: -1;


	}

	.cta_info{

		color: white;
		margin-left: 60%;
		font-size: 24px;
		margin-top: 300px;
		position: absolute;
		font-weight: 200;

	}

	.border_info{
		background-color: teal;
		width: 200px;
		padding: 2px 2px 2px 2px;
		position: absolute;
		margin-left: 20%;
		margin-top: 78px;
		z-index: -1;



	}





}
















@media only screen and (min-width: 769px) and (max-width: 1024px){



body{

	background-size: cover;
	
	 margin:0;
    padding:0;
    padding-right: 0;
    width: 100%;
}

	#Title{
		background-image: url(../Image/4V7A1383.jpg); 
		width: 100%;
		height: 800px;
		background-attachment: fixed;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		opacity: .75;
		position: relative;
	}

	#Buy_Button {
				position: absolute;
				background-color: transparent;
				border-style: solid;
		    	border-width: thin;
		    	color: #ffffff;

		    	text-align: center;
		    	text-decoration: none;
		    	display: inline-block;
		    	font-size: 19px;
		    	font-family: 'Poppins', sans-serif;
				font-weight: 500;
		        -webkit-transition-duration: 0.4s; /*Safari*/
		    	transition-duration: 0.4s;
		    	cursor: pointer;
		    	width: 37.04%;
		    	line-height: 43px;
		    	border-color: white;
		    	padding-top: 6px;
		    	padding-bottom: 6px;
		    	margin-left: 33%;
		    	margin-top: 40px;
					}
			#Buy_Button:hover {

				background-color: silver;
				color: gray;
				box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
			}
		.logo{

		}

	#Join{
		color: white;
		font-family: 'Poppins', sans-serif;
		font-weight: 100;
		font-size: 19pt;
		margin-left: 23.65%;
		margin-bottom: 100px;
		padding-top: 50px;
		 text-shadow: 4px 4px 4px #000000;
		position: relative;
	}

	nav{
		position: fixed;
		z-index: 10000;
		margin-left: 45.68%;
		margin-top: 40px;
		width: 100%;

	}
	.navigate{
				background-color: black;
				opacity: .5;
				
				-webkit-transition: background-color 1000ms linear;
                -ms-transition: background-color 1000ms linear;
    			transition: background-color 1000ms linear;


			}

			.stop{
				-webkit-transition: background-color 1000ms linear;
                -ms-transition: background-color 1000ms linear;
    			transition: background-color 1000ms linear;


			}

	li {
		display: inline;
		padding-right: 15px;

	}

	li a{
		color: white;
		text-decoration: none;
		
		font-size: 17pt;

	}

	a{
		text-decoration: none;
	}

	li a:hover{

		color: yellow;
	}

	li:last-child {
    background: teal;
    padding: 8px;
}
	header{
		color: white;
		font-family: 'Poppins', sans-serif;
		font-size: 50pt;
		text-align: center;
		font-weight: 600;
		margin-top: 200px;
		 text-shadow: 4px 4px 4px #000000;
	}

	#Updates{
		background-color: white;
		width: 100%;
		height: 600px;
		background-attachment: fixed;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		position: relative;
		
		

	}

	#microphone{
		margin-left: 27%;
		margin-top: 100px;
		position: absolute;
	}

	#Invite{

		background-image: url(../Image/Faith.jpg);
		width: 100%;
		height: 200px;
		opacity: .85;
		position: relative;
		background-position: 30% 70%;

	}

	#Join_Button{
		position: absolute;
				background-color: gold;
				border-style: solid;
		    	border-width: thin;
		    	color: #ffffff;
border-radius: 5px;
		    	text-align: center;
		    	text-decoration: none;
		    	display: inline-block;
		    	font-size: 19px;
		    	font-family: 'Poppins', sans-serif;
				font-weight: 500;
		        -webkit-transition-duration: 0.4s; /*Safari*/
		    	transition-duration: 0.4s;
		    	cursor: pointer;
		    	width: 37.04%;
		    	line-height: 43px;
		    	border-color: gold;
		    	margin-top: -70px;
		    	margin-left: 33%;
		    	text-shadow: 2px 2px 2px #000000;

	}

	#Join_Button:hover{
		background-color: #c6a30d;
		border-color: #c6a30d;
		text-decoration: underline;
	}
		

	#Social{
		background-color: teal;
		width: 100%;
		height: 520px;
	}

	#Sermon{
		font-family: 'Poppins', sans-serif;
		position: absolute;
		margin-left: 58.65%;
		margin-top: 30px;
		font-size: 25pt;
		color: silver;
		text-shadow: 2px 2px 2px #000000;
	}

	#Latest{
		font-family: 'Poppins', sans-serif;
		position: absolute;
		margin-left: 58.65%;
		line-height: 30px;
	}

	.first{

		margin-top: 80px;

	}

	.second{
		margin-top: 180px;
	}

	.third{
		margin-top: 280px;
	}

	.fourth{
		margin-top: 380px;
	}

	.Place{
		position: absolute;
		margin-top: 30px;
		margin-left: 49.48%;

		width: 7.81%;
		height: 150px;

		opacity: 1.0;
				
				-webkit-transition: background-color 1000ms linear;
                -ms-transition: background-color 1000ms linear;
    			transition: background-color 1000ms linear;

	}


	img{
		width: 150px;
	}







	.Place:hover{
		opacity: .5;
	}

	.Get_Involved{

		position: absolute;
		margin-top: 30px;
		margin-left: 62.33%;

		opacity: 1.0;
				
				
	}

	.Get_Involved:hover{
		opacity: .5;

	}
	

	.Connect{
		position: absolute;
		margin-top: 30px;
		margin-left: 75.52%;

		opacity: 1.0;
				
				-webkit-transition: background-color 1000ms linear;
                -ms-transition: background-color 1000ms linear;
    			transition: background-color 1000ms linear;

	}

	.Connect:hover{
		opacity: .5;
	}

	#P_Head{
		margin-top: 340px;
		margin-left: 51.04%;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 22pt;
		opacity: 0;
	}

	#I_Head{
		margin-top: 340px;
		margin-left: 62.5%;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 20pt;
		opacity: 0;
	

	}

	#C_Head{
		margin-top: 340px;
		margin-left: 77.08%;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 22pt;
		opacity: 0;

	}

	#P_Par{
		margin-top: 395px;
		margin-left: 49.48%;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 10pt;
		/*padding-right: 735px;*/
		line-height: 30px;
		width: 180px;
		opacity: 0;
	}

	#I_Par{
		margin-top: 395px;
		margin-left: 62.5%;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 11pt;
		/*padding-right: 500px;*/
		line-height: 25px;
		width: 180px;
		opacity: 0;

	}

	#C_Par{
		margin-top: 395px;
		margin-left: 75.52%;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 11pt;
		/*padding-right: 250px;*/
		line-height: 25px;
		width: 180px;
		opacity: 0;
	}

	.tweets{
		position: absolute;
		margin-top: 30px;
		margin-left: 13.21%;
	}

	#Where{
		background-color: #36384c;
		width: 100%;
		height: 370px;
		background-attachment: fixed;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		position: relative;
		
		

	}

	#Location{

		position: absolute;
		margin-top: 30px;
		margin-left: 13.21%
	}


	#menuToggle input
{
  display: block;
  width: 40px;
  height: 32px;
  position: absolute;
  top: -7px;
  left: -5px;
  
  cursor: pointer;
  
  opacity: 0; /* hide this */
  z-index: 2; /* and place it over the hamburger */
  
  -webkit-touch-callout: none;
}

.cta_head{

		color: white;
		margin-left: 60%;
		font-size: 29px;
		margin-top: 40px;
		position: absolute;
		font-weight: 500px:;
	}

	.cta_join{

		color: white;
		margin-left: 60%;
		font-size: 22px;
		margin-top: 90px;
		position: absolute;
		font-weight: 200;



}

	.border_head{
		background-color: teal;
		width: 400px;
		padding: 2px 2px 2px 2px;
		position: absolute;
		margin-left: 59%;
		margin-top: 78px;
	}

	.cta_contact{
		color: white;
		margin-left: 20%;
		font-size: 29px;
		margin-top: 40px;
		position: absolute;
		font-weight: 500px;
		z-index: -1;


	}

	.cta_info{

		color: white;
		margin-left: 60%;
		font-size: 24px;
		margin-top: 300px;
		position: absolute;
		font-weight: 200;

	}

	.border_info{
		background-color: teal;
		width: 200px;
		padding: 2px 2px 2px 2px;
		position: absolute;
		margin-left: 20%;
		margin-top: 78px;
		z-index: -1;



	}






}






















































@media only screen and (min-width: 0px) and (max-width: 768px){



body{

	background-size: cover;
	
	 margin:0;
    padding:0;
    padding-right: 0;
    width: 100%;
    background-color: orange;
}

	#Title{
		background-image: url(../Image/4V7A1383.jpg);
		width: 100%;
		height: 812px;
		
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		opacity: .75;
		position: relative;
	}

	#Buy_Button {
				position: absolute;
				background-color: transparent;
				border-style: solid;
		    	border-width: thin;
		    	color: #ffffff;

		    	text-align: center;
		    	text-decoration: none;
		    	display: inline-block;
		    	font-size: 17px;
		    	font-family: 'Poppins', sans-serif;
				font-weight: 500;
		        -webkit-transition-duration: 0.4s; /*Safari*/
		    	transition-duration: 0.4s;
		    	cursor: pointer;
		    	width: 73%;
		    	line-height: 43px;
		    	border-color: white;
		    	padding-top: 6px;
		    	padding-bottom: 6px;
		    	margin-left: 13.542%;
		    	margin-top: 40px;
					}
			#Buy_Button:hover {

				background-color: silver;
				color: gray;
				box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
			}
		.logo{

		}

	#Join{
		color: orange;
		font-family: 'Poppins', sans-serif;
		font-weight: 100;
		font-size: 0pt;
		margin-left: 0px;
		margin-bottom: 0px;
		padding-top: 0px;
		 text-shadow: 4px 4px 4px #000000;
		position: relative;
	}





a
{
  text-decoration: none;
  color: #232323;
  
  transition: color 0.3s ease;
}

a:hover
{
  color: tomato;
}

#menuToggle
{
  display: block;
  position: relative;
  top: 50px;
  left: 50px;

  width: 50px;
  
  z-index: 1;
  
  -webkit-user-select: none;
  user-select: none;
}

#menuToggle input
{
  display: block;
  width: 40px;
  height: 32px;
  position: absolute;
  top: -7px;
  left: -5px;
  
  cursor: pointer;
  
  opacity: 0; /* hide this */
  z-index: 2; /* and place it over the hamburger */
  
  -webkit-touch-callout: none;
}

/*
 * Just a quick hamburger
 */
#menuToggle span
{
  display: block;
  width: 33px;
  height: 4px;
  margin-bottom: 5px;
  position: relative;
  
  background: #cdcdcd;
  border-radius: 3px;
  
  z-index: 1;
  
  transform-origin: 4px 0px;
  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
}

#menuToggle span:first-child
{
  transform-origin: 0% 0%;
}

#menuToggle span:nth-last-child(2)
{
  transform-origin: 0% 100%;
}

/* 
 * Transform all the slices of hamburger
 * into a crossmark.
 */
#menuToggle input:checked ~ span
{
  opacity: 1;
  transform: rotate(45deg) translate(-2px, -1px);
  background: #232323;
}

/*
 * But let's hide the middle one.
 */
#menuToggle input:checked ~ span:nth-last-child(3)
{
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

/*
 * Ohyeah and the last one should go the other direction
 */
#menuToggle input:checked ~ span:nth-last-child(2)
{
  transform: rotate(-45deg) translate(0, -1px);
}

/*
 * Make this absolute positioned
 * at the top left of the screen
 */
#menus
{
  position: absolute;
  width: 150px;
  margin: -100px 0 0 -50px;
  padding: 50px;
  padding-top: 125px;
  background-color: rgba(255,255,255, 0.85);
  
  list-style-type: none;
  -webkit-font-smoothing: antialiased;
  /* to stop flickering of text in safari */
  
  transform-origin: 0% 0%;
  transform: translate(-100%, 0);
  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
}

#menus li
{
  padding: 10px 0;
  font-size: 22px;
   text-transform: uppercase;
   font-family: 'Poppins', sans-serif;
}

/*
 * And let's slide it in from the left
 */
#menuToggle input:checked ~ ul
{
  transform: none;
}

#menu
{

z-index: -1;
	height: 0px;
}





























	header{
		color: white;
		font-family: 'Poppins', sans-serif;
		font-size: 30pt;
		text-align: center;
		font-weight: 600;
		margin-top: 100px;
		 text-shadow: 4px 4px 4px #000000;
	}

	#Updates{
		background-color: white;
		width: 100%;
		height: 500px;
		background-attachment: fixed;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		position: relative;
		
		

	}

	#microphone{
		margin-left: 3%;
		margin-top: 100px;
		position: absolute;
	}

	#Invite{

		background-image: url(../Image/Faith.jpg);
		width: 100%;
		height: 200px;
		opacity: .85;
		position: relative;
		background-position: 30% 70%;

	}

	#Join_Button{
		position: absolute;
				background-color: gold;
				border-style: solid;
		    	border-width: thin;
		    	color: #ffffff;
border-radius: 5px;
		    	text-align: center;
		    	text-decoration: none;
		    	display: inline-block;
		    	font-size: 18px;
		    	font-family: 'Poppins', sans-serif;
				font-weight: 500;
		        -webkit-transition-duration: 0.4s; /*Safari*/
		    	transition-duration: 0.4s;
		    	cursor: pointer;
		    	width: 73%;
		    	line-height: 43px;
		    	border-color: gold;
		    	margin-top: 60px;
		    	margin-left: 13.542%;
		    	text-shadow: 2px 2px 2px #000000;

	}

	#Join_Button:hover{
		background-color: #c6a30d;
		border-color: #c6a30d;
		text-decoration: underline;
	}
		

	#Social{
		background-color: teal;
		width: 100%;
		height: 520px;
	}

	#Sermon{
		font-family: 'Poppins', sans-serif;
		position: absolute;
		margin-left: 10%;
		margin-top: 30px;
		font-size: 25pt;
		color: silver;
		text-shadow: 2px 2px 2px #000000;
	}

	#Latest{
		font-family: 'Poppins', sans-serif;
		position: absolute;
		margin-left: 10%;
		line-height: 30px;
	}

	.first{

		margin-top: 80px;

	}

	.second{
		margin-top: 180px;
	}

	.third{
		margin-top: 280px;
	}

	.fourth{
		margin-top: 380px;
	}

	.Place{
		position: absolute;
		margin-top: 30px;
		margin-left: 0px;
		z-index: -1;

		width: 150px;
		height: 150px;

		opacity: 1.0;
				
				-webkit-transition: background-color 1000ms linear;
                -ms-transition: background-color 1000ms linear;
    			transition: background-color 1000ms linear;

	}

	.Place:hover{
		opacity: .5;
	}

	.Get_Involved{

		position: absolute;
		margin-top: 30px;
		margin-left: 0px;
		z-index: -1;

		opacity: 1.0;
				
				
	}

	.Get_Involved:hover{
		opacity: .5;

	}
	

	.Connect{
		position: absolute;
		margin-top: 30px;
		margin-left: 0px;
		z-index: -1;

		opacity: 1.0;
				
				-webkit-transition: background-color 1000ms linear;
                -ms-transition: background-color 1000ms linear;
    			transition: background-color 1000ms linear;

	}

	.Connect:hover{
		opacity: .5;
	}

	#P_Head{
		margin-top: 340px;
		margin-left: 0px;

		z-index: -1;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 22pt;
	}

	#I_Head{
		margin-top: 340px;
		margin-left: 0px;

z-index: -1;

		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 20pt;
	

	}

	#C_Head{
		margin-top: 340px;
		margin-left: 0px;


z-index: -1;


		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 22pt;

	}

	#P_Par{
		margin-top: 5px;
		margin-left: 0px;

z-index: -1;


		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 12pt;
		padding-right: 0px;
		line-height: 30px;
	}

	#I_Par{
		margin-top: 5px;
		margin-left: 0px;


		z-index: -1;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 12pt;
		padding-right: 0px;
		line-height: 25px;

	}

	#C_Par{
		margin-top: 5px;
		margin-left: 0px;


		z-index: -1;
		color: black;
		font-family: 'Poppins', sans-serif;
		position: absolute;
		font-size: 12pt;
		padding-right: 0px;
		line-height: 25px;
	}

	.tweets{
		position: absolute;
		margin-top: 0px;
		margin-left: 0px;
		z-index: -1;
	}

	#Where{
		background-color: #36384c;
		width: 100%;
		height: 350px;
		background-attachment: fixed;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		position: relative;
		
		

	}

	#Location{

		position: absolute;
		margin-top: 30px;
		margin-left: 10%;
		width: 80%;
	}


	img{
		width: 0px;
	}
.cta_head{

		color: white;
		margin-left: 60%;
		font-size: 1px;
		margin-top: 40px;
		position: absolute;
		font-weight: 500px:;
		z-index: -5;
	}

	.cta_join{

		color: white;
		margin-left: 60%;
		font-size: 1px;
		margin-top: 90px;
		position: absolute;
		font-weight: 200;
		z-index: -5;



}

	.border_head{
		background-color: teal;
		width: 0px;
		padding: 2px 2px 2px 2px;
		position: absolute;
		margin-left: 59%;
		margin-top: 78px;
		z-index: -5;
	}

	.cta_contact{
		color: white;
		margin-left: 20%;
		font-size: 1px;
		margin-top: 40px;
		position: absolute;
		font-weight: 500px;
		z-index: -1;


	}

	.cta_info{

		color: white;
		margin-left: 60%;
		font-size: 1px;
		margin-top: 300px;
		position: absolute;
		font-weight: 200;
		z-index: -6;

	}

	.border_info{
		background-color: teal;
		width: 0px;
		padding: 2px 2px 2px 2px;
		position: absolute;
		margin-left: 20%;
		margin-top: 78px;
		z-index: -1;



	}




}


























/********************************************************************************************************************************
*****************************************************************************************************************************************
********************************************************************************************************************************************
***********************************************************************************************************************************************************
*************************************************************************************************************************************
***************************retina diesplays**********************************************************************************
******************************************************************************************************************************/







































































.section { padding: clamp(2rem, 6vw, 4rem) min(6vw, 48px); }

.sermons__inner { max-width: 1200px; margin: 0 auto; }
.sermons__header {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; margin-bottom: clamp(1rem, 3vw, 1.5rem);
}
.sermons__header h2 {
  margin: 0; font: 700 clamp(1.25rem, 3.5vw, 2rem) 'Poppins', sans-serif;
}
.sermons__all { text-decoration: none; color: #1DA1F2; }
.sermons__all:hover { text-decoration: underline; }

/* Featured */
.sermon--featured {
  display: grid; gap: clamp(1rem, 3vw, 1.5rem);
  grid-template-columns: 1fr; background: #0f1a2b; color: #fff;
  border-radius: 14px; overflow: hidden; box-shadow: 0 16px 40px rgba(0,0,0,.18);
  margin-bottom: clamp(1.25rem, 3vw, 2rem);
}
.sermon--featured .sermon__img { width: 100%; height: auto; display: block; }
.sermon--featured .sermon__body { padding: clamp(1rem, 3vw, 1.5rem); }
.sermon__title { margin: 0 0 .25rem; font-weight: 700; }
.sermon--featured .sermon__title { font-size: clamp(1.1rem, 2.6vw, 1.75rem); }
.sermon__meta { margin: 0 0 .75rem; opacity: .85; }
.sermon__desc { margin: 0 0 1rem; opacity: .95; }

.sermon__actions { display: flex; gap: .75rem; flex-wrap: wrap; }
.btn {
  display: inline-block; padding: .75rem 1rem; border-radius: 10px;
  text-decoration: none; font-weight: 600; transition: .2s ease;
}
.btn.primary { background: gold; color: #232323; }
.btn.primary:hover { background: #c6a30d; }
.btn.ghost { border: 2px solid #fff; color: #fff; }
.btn.ghost:hover { background: rgba(255,255,255,.12); }

/* Grid of recent */
.sermons__grid {
  display: grid; gap: clamp(0.9rem, 2.2vw, 1.25rem);
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}
.sermon--card {
  background: #fff; border-radius: 12px; overflow: hidden;
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
}
.sermon__link { color: inherit; text-decoration: none; display: grid; gap: .5rem; }
.sermon__thumb { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.sermon--card .sermon__title { font: 700 1rem/1.25 'Poppins', sans-serif; margin: 0 .9rem; }
.sermon--card .sermon__meta { margin: 0 .9rem 1rem; color: #4b5563; font-size: .9rem; }

/* Utilities */
.clamp-2 {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

/* Responsive tweak: two-column featured on desktop */
@media (min-width: 900px){
  .sermon--featured { grid-template-columns: 1.2fr 1.8fr; }
}


/* Frosted glass nav (desktop/tablet only) */
@media (min-width: 735px){
  #menu{
    position: fixed;
    top: calc(12px + env(safe-area-inset-top));
    right: 16px;
    left: auto;
    transform: none;
    z-index: 10000;

    width: max-content;
    max-width: 92vw;

    /* frosted glass */
    background: rgba(255,255,255,0.18);
    backdrop-filter: blur(12px) saturate(160%);
    -webkit-backdrop-filter: blur(12px) saturate(160%);

    border: 1px solid rgba(255,255,255,0.28);
    border-radius: 14px;
    box-shadow: 0 8px 24px rgba(0,0,0,.20);
    padding: 10px 14px;
    color: #fff;

    transition: background-color .25s ease, box-shadow .25s ease, border-color .25s ease;
  }

  /* prevent earlier rules from forcing full-width on large screens */
  nav{ width: auto !important; margin: 0 !important; }

  /* link + hamburger contrast on glass */
  #menu a{ color:#fff; text-shadow:0 1px 1px rgba(0,0,0,.25); }
  #menu #menuToggle span{ background:#fff; }

  /* darker once scrolled */
  #menu.is-solid{
    background: rgba(15,26,43,0.86);
    border-color: transparent;
    box-shadow: 0 10px 30px rgba(0,0,0,.30);
  }

  /* fallback if blur unsupported (desktop only) */
  @supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))){
    #menu{ background: rgba(15,26,43,.85); }
  }
}




































/* Let the container size itself instead of forcing 600px */
#Updates {
  height: auto;
  min-height: 0;
  padding-top: 0;
  padding-bottom: 0;
}

/* Tighten the "Latest Sermons" section spacing */
#latest-sermons.section {
  padding: 1rem min(6vw, 48px) 1.5rem; /* top | sides | bottom */
}

/* Make sure the section header isn't adding extra gap */
#latest-sermons .sermons__header {
  margin-bottom: 0.75rem;
}
#latest-sermons h2 {
  margin-top: 0;
}

/* If the gap is actually between Invite and the sermons, trim it */
#Invite { 
  margin-bottom: 0.75rem;
}