@charset "UTF-8";
/* CSS Document */
/* Color scheme hexadecimal values: FFE8DF 8F92B2 F9F9FF BBCCB3 99B28B */
@import url('https://fonts.googleapis.com/css2?family=Englebert&display=swap');

/* The body tag style applies to all elements on the page */
body {
/* background-color: rgb(177, 231, 194)
; */
font-family: Englebert, Verdana, Geneva, Arial, sans-serif;
padding:0px;
margin:0px;
background: rgb(42,122,98);
background: -moz-linear-gradient(top,  rgba(42,122,98,1) 1%, rgba(174,186,135,1) 100%);
background: -webkit-linear-gradient(top,  rgba(42,122,98,1) 1%,rgba(174,186,135,1) 100%);
background: linear-gradient(to bottom,  rgba(42,122,98,1) 1%,rgba(174,186,135,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2a7a62', endColorstr='#aeba87',GradientType=0 );
}

@media (min-width: 200px) and (max-width:700px){
	body {
		background: rgb(42,122,98);
	}
}

/* The wrapper ID style is used with a div tag to provide a 960px wide page */
#wrapper {
width: 960px;
height: auto;
margin-left: auto;
margin-right: auto;
background-color:#99B28B ;
}

@media (min-width: 200px) and (max-width:700px){
	#wrapper {
		width: 900px;
		background: rgb(42,122,98);
		
	}
}

nav ul {
	Text-decoration: none; 
	display: flex; 
	flex-direction: row; 
	margin: auto; 
	float: right"
}

div.navphoneleft {
	display: none;
}


div.phone{ display: none;
}

@media (min-width: 200px) and (max-width:700px){
#nav {
    display: none;
}
}


/* The box holds the gallery name and scripture */
div.box {
	width: 925px;
	background: rgb(42,122,98);
	background: -moz-linear-gradient(top,  rgba(42,122,98,1) 1%, rgba(174,186,135,1) 100%);
	background: -webkit-linear-gradient(top,  rgba(42,122,98,1) 1%,rgba(174,186,135,1) 100%);
	background: linear-gradient(to bottom,  rgba(42,122,98,1) 1%,rgba(174,186,135,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2a7a62', endColorstr='#aeba87',GradientType=0 );
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
	height:auto;
	padding: 20px;
	
	
}



@media (min-width: 200px) and (max-width:700px){
	div.box  {width: 900px;
		position: relative;
		top: 20%;
		left: 5%;
		right: 5%;
		margin-bottom: 25px;
		font-size: 35pt;
		line-height: 40pt;
		padding: 3px;
		
		
	}
}

h2 {
	margin-left: 50px; 
	margin-top: 20px;
	color: antiquewhite;
}

@media (min-width: 200px) and (max-width:700px){
h2 {
	margin-left: 25px; 
	margin-right: 50px;
	margin-top: 20px;
	
}
}


 p.box {
	font-size: 16pt; 
	color: rgb(47, 38, 59);  
	margin-left: 3%; 
	margin-right: 3%;
	font-style: italic
}

@media (min-width: 200px) and (max-width:700px){
	.box p { 
	color: rgba(86,0,73,1);
	font-size: 18pt;
	line-height: 25pt;
		
	
}
}
	

span {
	font-size: 18pt; 
	color:rgb(47, 38, 59); 
	line-height: 25pt; 
	font-style: italic;
}

@media (min-width: 200px) and (max-width:700px){
	.box span { font-size: 35pt;
		color: rgba(86,0,73,1);
		font-weight: bold;
		padding-top: 0;
		font-size: 24pt;
		line-height: 30pt;
	
}
}
	
	

div.gallery{
	width: 960px;
	margin-left: 0;
	margin-right: 100px;
	margin-bottom: 50px;
	display: flex;
	flex-direction: column;
	
	

}


@media (min-width: 200px) and (max-width:700px){
	div.gallery {
		width: 900px;
		margin-left: 0 auto;
		margin-right: 10%;
		
		
	}
}

div.carousel {
	text-align: center;
	position: relative;
	top: 20px;
  	margin-left: 100px;
  	margin-right: 100px;
	
  
  }

  @media (min-width: 200px) and (max-width:700px){
	div.carousel{
		width: 900px;
		displaY: flex;
		flex-direction: column;
		justify-items: start;
		margin-right: 50px;
		margin-left: 50px;
	}
		
}


	#bigpic {
  	height: 350px;
	opacity: 1;
	position: relative;
	top: 8%;
  	bottom: 15px;
  	padding-bottom: 50px;
  	margin: 0 auto;
	  
    }

	@media (min-width: 200px) and (max-width:700px){
		#bigpic{
			width: 800px;
			height: auto;
			margin:0 auto;
			margin-right: 50px;
			margin-right: 50px;
			/* padding-right: 10px; */
		}
	}
	

   
  .thumbs img {
  height: 100px;
  width: 120px;
  opacity: .9;
  margin: 5px;
  padding: 3px;
  display: flex;
  flex-direction: row;
    }

	@media (min-width: 200px) and (max-width:700px){
		.thumbs img{
			width: 350px;
			height: 350px;
			margin:0 auto;
			margin-bottom: 20px;
			padding: 20px;
			flex: row;
			background: antiquewhite; opacity: 1;
			
		}
	}




	

	
	




.desc .Gods a {
	color: rgb(42,122,98);
}
.desc .Gods a:visited {
	color: #021105;
}

.desc .Gods a:hover {
	color: rgb(24, 53, 150);
}

div.desc
	{
		font-size: 12pt;
		background-color:hsl(97, 44%, 80%);
		
	}

	@media (min-width: 200px) and (max-width:700px){
		div.desc
		{font-size: 20pt;
		} }

/* This clear class style terminates float */
.clear{ 
clear: both; 
}