	
	.header_container {
		position: relative;
		width: 100%;
		height: 550px;
		

		
	  }

	  @media (max-width: 500px){.header_container {
		position: relative;
		width: 100%;
		height: 50vw;
		

		
	  }} 

	  .header_container::after {
		content: "";
		position: absolute;
		left: 0;
		width: 100%;
		height: 550px;
		background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 90%);
		
		
	  }
	  
	 
	  @media (max-width: 500px){.header_container::after {
		content: "";
		position: absolute;
		left: 0;
		width: 100%;
		height: 50vw;
		background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 90%);
		
		
	  }}

	 
	  
	
	  
	  .header_container img {
		position: absolute;
		left: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
		opacity: 0;
		transition: opacity 3s ease-in-out;
		/*border-top: 2px solid #FCDC83;*/
	  }

	  .header_container img.is-active {
		opacity: 1;
	  }
	  
	  .text-overlay {
		position: absolute;
		top: 45%;
		left: 50%;
		transform: translate(-50%, -50%);
		text-align: center;
		color: #fff;
		z-index: 1;
	  }

	  .text-overlay h1 {
		font-size: 3em;
		font-weight: bold;
		margin-bottom: 0.5em;
		color: #fff
	  }
	  
	  @media (max-width: 920px) {.text-overlay h1 {
		font-size: 2em;
		font-weight: bold;
		margin-bottom: 0.4em;
		color: #fff
	  }
	}


	@media (max-width: 780px) {.text-overlay h1 {
		font-size: 1.8em;
		font-weight: bold;
		margin-bottom: 0.3em;
		color: #fff
	  }
	}

	@media (max-width: 500px) {.text-overlay h1 {
		font-size: 1.3em;
		font-weight: bold;
		margin-bottom: 0.3em;
		color: #fff
	  }
	}
	  
	  .text-overlay p {
		font-size: 1.4em;
		margin-bottom: 1.5em;
	  }

	  @media (max-width: 920px) {.text-overlay p {
		font-size: 1em;
		margin-bottom: 1.5em;
	  }
	}

	@media (max-width: 780px) {.text-overlay p {
		font-size: 1em;
		margin-bottom: 1.0em;
	  }
	}

	@media (max-width: 500px) {.text-overlay p {
		font-size: 0.8em;
		margin-bottom: 1.0em;
	  }
	}

	  
	.text-overlay button {
		padding: 1em 2em;
		background-color: rgba(98, 113, 235, 0.4); /* semi-transparent version of #6271eb */
		color: #fff;
		font-size: 1.2em;
		border: 2px solid rgba(252, 220, 131, 0.4);
		border-radius: 10px;
		cursor: pointer;
	  }

	  @media (max-width: 920px){ .text-overlay button {
		padding: 1em 2em;
		background-color: rgba(98, 113, 235, 0.4); /* semi-transparent version of #6271eb */
		color: #fff;
		font-size: 0.8em;
		border: 2px solid rgba(252, 220, 131, 0.4);
		border-radius: 10px;
		cursor: pointer;
	  	}
	  }

	  @media (max-width: 780px){ .text-overlay button {
		padding: 0.8em 2em;
		background-color: rgba(98, 113, 235, 0.4); /* semi-transparent version of #6271eb */
		color: #fff;
		font-size: 0.8em;
		border: 2px solid rgba(252, 220, 131, 0.4);
		border-radius: 10px;
		cursor: pointer;
	  	}
	  }

	  @media (max-width: 500px){ .text-overlay button {
		padding: 0.8em 2em;
		background-color: rgba(98, 113, 235, 0.4); /* semi-transparent version of #6271eb */
		color: #fff;
		font-size: 0.8em;
		border: 2px solid rgba(252, 220, 131, 0.4);
		border-radius: 10px;
		cursor: pointer;
	  	}
	  }

	  @media (max-width: 450px){ .text-overlay button {
		padding: 0.8em 2em;
		background-color: rgba(98, 113, 235, 0.4); /* semi-transparent version of #6271eb */
		color: #fff;
		font-size: 0.6em;
		border: 2px solid rgba(252, 220, 131, 0.4);
		border-radius: 10px;
		cursor: pointer;
	  	}
	  }

	  .text-overlay button:hover {
		padding: 1em 2em;
		background-color: rgba(88, 113, 235, 0.6); /* semi-transparent version of #6271eb */
		color: #fff;
		font-size: 1.22em;
		border: 2px solid rgba(252, 220, 131, 0.7);
		border-radius: 10px;
		cursor: pointer;
	  }

	  .header-border {
		z-index: 3;
		position: relative; /* add this line */
		/* other styles... */
		bottom: 7vw;
		
	  }

	  
	  