section.main-image {
	overflow: hidden;
	position: relative;
	width: 100%;
	height: 65vh;
	transition:all 0.3s;
}

section.main-image.video {
	height: 80vh;
}


 
section.main-image div.image {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-position: center center;
	background-size: cover;
}
section.main-image div.image:after {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
}


.jacobite section.main-image .info:before { 
	content:'';
	background: url('jacobite-rose.png') no-repeat;
	background-size: contain;
	width: 80px;
	height: 70px;
	position: absolute;
	top: -77px;
	left: 50%;
	transform: translate(-50%, 0);
	filter: drop-shadow(0 0 4px rgb(57, 51, 55));
}

.jacobite section.main-image .info {
	top: 60%;
}


section.main-image .info {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 100%;
	text-align: center;
	padding: 0 4%;
	z-index: 6;
	
}
section.main-image .info h1 {
	font-weight: 500;
	color:var(--white-color);
	margin:0 auto;
	max-width:900px;
	text-shadow: 0 0 4px rgb(57, 51, 55);
}


 section.main-image video {
position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%; /* Ensures the video covers the width */
  min-height: 100%; /* Ensures the video covers the height */
  width: auto;
  height: auto;
  transform: translate(-50%, -50%); /* Centers the video */
  object-fit: cover; /* Ensures the video covers the container without stretching */
}

@media screen and (min-width: 1024px){ 
	section.main-image .info  h1 {
		font-size: 4.5em;
	}
}

@media screen and (max-width: 1023px){ 
	section.main-image .info  h1 {
		font-size: 3.75em;
	}
}

@media screen and (max-width: 500px){ 
	section.main-image .info   h1 {
		font-size: 3.25em;
		font-weight: 500;
	}
}

section.main-image .info h1:after{
	display:none;
}
section.main-image .info p.text {
	transition:all 1.5s 0s;
	transform:translateY(0);
	font-size:1.2em;
	font-weight:400;
	color:var(--lighter-gold);
	max-width: 640px;
	margin: 20px auto 0;
	line-height:1.5em;
	text-shadow: 0 0 4px rgb(57, 51, 55);
}

section.main-image .overlay {
	content: '';
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	position: absolute;
	background: rgb(66, 40, 56);
	mix-blend-mode: multiply;
	z-index: 5;
}

@media screen and (max-width:800px){
	section.main-image .info {
		text-align: left;
	}
	
	.jacobite section.main-image .info:before{
		left: 25px;
		transform: translate(0, 0);
	}
	
	section.main-image .info p.text {
		margin: 1em 0;
	}
}




@media screen and (min-width:1024px){
	section.main-image .info h1{
		font-size:4.5em;
	}
}