body, div, p, iframe, audio, video {
  font-family: lato;
  background-color: none;  
  padding: 0px;
  margin: 0px auto;
  font-size: 18px;
  decoration: none;
  color: black;
  line-height: 1.3;
  text-indent: 0px;
  background-color: none;
}
p {
	text-indent: 40px;
	font-size: 18px;
    text-align: justify;
}

a:link, a:visited, a:active {
  text-decoration: none;
  color: black;
}
a:hover {
  text-decoration: none;
  color: purple;
}



/* font-size: clamp(0.8em, 0.8em + 1vw, 1.1em); */

/* título   */

h1, h2 {
	color: #9F8242;
    font-family: lato;
    margin: 0 auto;
	text-align: center;
	background-color: none; 
	line-height: 1.3;	
	text-indent: 0px;
}

h1 {
	font-size: 30px;
}

h2 {
	font-size: 20px;
}

h3, h4 , h5 {
    color: #333333;
    font-family: lato;
    line-height: 1.3;
    margin: 0 auto;
	text-align: justify;
	background-color: none; 
	line-height: 1.3;
}


/* H3 - texto normal */
h3, h3:link {
	font-size: 18px;
	text-indent: 0px;
	text-align: center;
}

/* H4 - observação */
h4 {
	font-size: 20px;
	text-indent: 0px;
}

h5, h5p, h5 > p {
   font-family: lato;
   background-color: none;  
   padding: 0px;
   margin: 0px auto;
   font-size: 18px;
   decoration: none;
   color: black;
   	line-height: 1.3;
   text-align: justify;
   text-indent: 0px;
   	font-weight: normal;
}



h6, h6 p, h6 > p {
   font-family: lato;
   background-color: none;  
   padding: 0px;
   margin: 0px auto;
   font-size: 12px;
   decoration: none;
   color: black;
   	line-height: 1.3;
   text-align: center;
   text-indent: 0px;
   	font-weight: normal;
}

h7 {
  font-family: lato;
  background-color: none;  
  padding: 0px;
  margin: 0px;
  font-size: 16px;
  font-style: none;
  text-align: center;
  text-indent: 0px;
  align: center;
}

h8 {
	font-family: lato;
    background-color: none;  
    padding: 0px;
    margin: 0px;
	font-size: 21px;
	text-indent: 0px;
	text-align: center;
	align: center;
}

img {
  max-width: 100%;
  height: auto;
  background-color: none;
  text-indent: 0px;
  align: center;
}

.img, .img a:link, .img a:visited, .img a:hover, .img a:active{
	padding-top: 100px;
	max-width: 100%;
	min-width: 50%;
	height: auto;
	text-indent: 0px;
	align: center;
}

.geral {
	width: 100%;
	height: auto;
	margin: 0px auto;
	background-color: #F7F1E4;
	border: 0px solid red;
}

.container-topo {
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  padding: 0px;
  width: 70%;
  height: auto;
  margin: 0px auto;
  border: 0px solid blue;
  background-color: #F7F1E4;
}	

.container-conteudo {
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  padding: 0px;
  width: 70%;
  height: auto;
  margin: 0px auto;
  border: 0px solid blue;
  background-color: #F7F1E4;
}

.container-conteudo-dentro {
  display: block;
  text-align: left;
  flex-wrap: nowrap;
  padding-top: 10px;
  width: 90%;
  height: auto;
  margin: 0 auto;
  border: 0px solid green;

}
.container-conteudo-dentro p {
	text-align: justify;	
}

		/* Rodapé */
		.container-rodape {
			display: flex;
			flex-wrap: nowrap;
			height: auto;
			width: 100%;
			margin: 0 auto;
			margin-top: 0px;
			border: 0px solid yellow;
			justify-content: space-between;
			background-color: #514328; 
		}

		.row-rodape {
		  display: grid;
		  grid-column-gap: 0px;
		  grid-template-areas:
			'esq meio dir';
			
		  background-color: #514328;
		  width: 70%;
		  margin: 0 auto;
		  justify-content: space-evenly;
		  border: 0px solid yellow;
		  align-items: center;
		}
		.esq {      
			display: grid;
			grid-area: esq;
			  background-color: #514328;
			  margin: 10px;
			  margin-left: 0;
			  max-width: 164px;
			  padding: 0px;
			  text-align: center;
			  align-items: center;
			}
		.meio {      
			display: grid;
			grid-area: meio;
			  background-color: #514328;
			  width: auto;
			  padding: 0px;
			  text-align: center;	  
			  color: white;
			  align-items: center;
			}	
		.meio h7, .meio h8, .meio p {
			color: white;
			background-color: #514328;
		}
		.dir {      
			display: grid;
			grid-area: dir;
			  background-color: #514328;
			  margin: 10px;
			  margin-right: 0;
			  max-width: 164px;
			  padding: 0px;
			  text-align: right;
			  align-items: center;
			}
	
	
						.imagem, .imagem div, .imagem  > div{
							 text-indent: 0px;
							 align: center;
							 align-items: center;
							 text-align: center;
							 align-content: center;
							 margin: 0px auto;
							 padding: 0px;
							 max-width: 500px;
							 border: 0px solid #ccc;
						}
						
						.imagem p, .imagem > p {
							width: 95%;
						}

			
								

									.container-video1 {
										display: flex;
										display: -webkit-flex;
										flex-wrap: nowrap;
										width: 70%;
										height: auto;
										margin: 0 auto;											
										background-color: #F4E8CF;
										justify-content: center;
										padding-top: 0px;
										padding-bottom: 20px;
									}
						
									.container-video1 img {
										display: block;
										border: 0px solid red;	
										background-color: none;										
									}
									
									.container-video1 p {
										align-content: center;
										background-color: #ECD9B1;
									}
																	
									
								
									.videoyoutubegrande {
										display: block;
										background-color: none;
										max-width: 450px;
										 align: center;
										 align-items: center;
										 text-align: center;
										 align-content: center;
									}
									.videoyoutubegrande p {
										text-indent: 0px;
										 align: center;
										 align-items: center;
										 text-align: center;
										 align-content: center;
										background-color: none;
									}

									.videoyoutubepequeno {
										display: none;
										background-color: none;
										max-width: 290px;
										 align: center;
										 align-items: center;
										 text-align: center;
										 align-content: center;										
									}
									.videoyoutubepequeno p {
										text-indent: 0px;
										 align: center;
										 align-items: center;
										 text-align: center;
										 align-content: center;
										background-color: none;
									}

.conteudo-vela  { display: grid;
		    grid-area: conteudo; 
		    height: auto;
			width: auto;


			background-color: #eeeeee;
			padding: 10px;
		    margin: 0px auto;
		    		
			grid-gap: 0px;
		    border: 0px solid #9F8242;
			align: center;
			align-items: flex-start;
			align-content: flex-start;
			
		text-indent: 50px;
		text-align: justify;
		font-size: 18px;
		line-height: 1.3; 
		    }
	
.container-vela-novena {
	width: 80%;
	height: auto;
	margin: 0 auto;
	border: 1px solid #ccc;
	background-color: white;
	border: 1px solid #aaa;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
}

.boxvela-novena, .boxvela-novena p {
	width: 100%;
	height: auto;

	background-color: white;
    grid-gap: 25px;
	border: 1px solid #ccc;
	text-align: center;
	text-indent: 0px;
	padding-bottom: 0px;
	padding-top: 20px;
	align-content: center;
}

.boxvela-novena img {
	width: 50px;
}
			
								
	

	@media screen and (max-width: 850px) {

			h1 {
				font-size: 24px;
			}	
			h2 {
				font-size: 18px;
			}	
			h4 {
				font-size: 14px;
			}	

				.container-vela-novena {
					width: 95%;
					grid-template-columns: repeat(2, 1fr);
				}
					
						.videoyoutubegrande {
							display: none;
						}

						.videoyoutubepequeno {
							display: block;
						}
	}

	@media screen and (max-width: 750px) {
			p {
				font-size: 14px;
			}
			
			h1 {
				font-size: 22px;
			}		
			h2 {
				font-size: 16px;
			}		
			h4 {
				font-size: 11px;
			}
								
						.container-video1 {
							width: 95%;
							padding: 0px;
						}			
						
						.container-topo {
						  width: 100%;
						}	
						
						.container-conteudo {
						  width: 100%;
						  padding: 0px;
						}
						
						.container-rodape {
						  width: 100%;
						  padding: 0px;
						}						
						
						.row-rodape {
						  grid-template-areas:
							'esq dir';
							
						  width: 100%;
						}	

						.meio {      
							display: none;
						}

					.conteudo-vela {
								width: 100%;
								min-width: 300px;
								margin: 0 auto;
								padding: 5px;	
								justify-content: center;
								max-width: 100%;
								font-size: 18px;
								line-height: 1.3; 
								text-indent: 0px;
								text-align: justify;
							}

							
					.container-vela-novena {
						grid-template-columns: repeat(2, 1fr);
					}
					.container-vela-novena img {
						width: 50px;
					}
					
	}	
	
	@media screen and (max-width: 500px) {
		
									p {
									text-indent: 25px;
									}
									
									.imagem {
									 padding: 5px;
									 max-width: 70%;
									 border: 0px solid red;
									}
								
									.imagem p, .imagem > p {
										width: 100%;
									}	

	}