/* Project Slider Overlay Styles */
.mra-project-slider-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background: rgba(0,0,0,0.2);
	z-index: 9999;
	justify-content: center;
	align-items: center;
	opacity: 0;
	transition: opacity 0.3s;
	-webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}

.mra-project-slider-content {
	width: 90vw;
	max-width: 1200px;
	/* background: #fff; */
	position: relative;
	padding: 4em 2em 2em 2em;
	border-radius: 8px;
	/* box-shadow: 0 8px 32px rgba(0,0,0,0.2); */
	overflow-y: auto;
	max-height: 90vh;
}

.mra-project-slider-close {
	position: absolute;
    top: 10px;
    right: 10px;
    padding: 5px 10px 10px 10px;
    background: #ffffff;
    color: #000;
    border: 1px solid #000;
    border-radius: 999px;
    text-align: center;
	position: absolute;
	font-size: 1em;
	cursor: pointer;
	z-index: 10001;
	transition: color 0.2s;
}
.mra-project-slider-close:hover {
	color: #e74c3c;
}

.mra-project-featured-image {
	max-width: 100%;
	height: auto;
	border-radius: 6px;
	box-shadow: 0 2px 8px rgba(0,0,0,0.08);
	margin-bottom: 1em;
	transition: box-shadow 0.2s;
	cursor: pointer;
}
.mra-project-featured-image:hover {
	box-shadow: 0 4px 16px rgba(0,0,0,0.18);
}

@media (max-width: 600px) {
	.mra-project-slider-content {
		width: 98vw;
		padding: 1em;
		max-width: 100vw;
	}
	.mra-project-slider-close {
		font-size: 1.5em;
		top: 0.5em;
		right: 0.5em;
	}
}

/**/
.mra-custom-project-item-slider {
	height: 500px;
	min-height: 500px;
}
.mra-custom-project-item-slide {
	background-color: #ffffff;
	min-height: 500px;
	height: 500px;
	max-height: 80vh;
	overflow: hidden;
}

.mra-custom-project-slide-image img,
.mra-custom-project-slide-video iframe,
.mra-custom-project-slide-map,
.mra-custom-project-slide-text {
	/* ...existing code... */
	height: 500px !important;
	min-height: auto;
	max-height: 500px !important;
}
/* Ensure all slider items have the same height, auto width, and min width */
.mra-custom-project-item-slider {
	display: flex;
	flex-direction: row;
	align-items: stretch;
	justify-content: center;
	width: 100%;
	gap: 1em;
}
.mra-custom-project-item-slide {
	flex: 0 1 auto;
	min-width: 150px;
	width: auto;
	/* height: 100%; */
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: stretch;
	align-items: stretch;
}
.mra-custom-project-item-slide.extra-slide{flex-direction: row;}
/* Make sure images/videos/maps/text inside slide fill the height */
.mra-custom-project-slide-image img,
.mra-custom-project-slide-video iframe,
.mra-custom-project-slide-map,
.mra-custom-project-slide-text {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: top;
	display: block;
}
.mra-custom-project-item-slide.extra-slide {
	flex: 1 0 auto;
}

@media (max-width: 768px) {
	.mra-custom-project-item-slider {
		height: 300px;
		min-height: auto;
		max-height: 90vh;
	}
	.mra-custom-project-item-slide {
		height: 300px;
		min-height: auto;
		max-height: 90vh;
	}
	.mra-custom-project-item-slide.extra-slide{flex-direction: column;}
	.mra-custom-project-item-slide.extra-slide,
	.mra-custom-project-item-slide:has( .mra-custom-project-slide-text) {
		overflow-y: auto;
	}

	.mra-custom-project-slide-text {
		font-size: 10px;
		overflow-y: auto;
		padding: 10px;
	}
	.mra-custom-project-item-slide {
		display: flex;
	}
	.mra-custom-project-item-slide:has( .mra-custom-project-slide-video) {
        justify-content: center;
	}
	.mra-custom-project-item-slide .mra-custom-project-slide-video .html5-video-container video {
		width: 441px;
		height: 300px;
		left: 0px;
		top: 200px;
	}
}

.mra-custom-project-item-slider .owl-nav {
    width: 100%;
    display: flex;
    justify-content: space-between;

	--nav-prev-icon: url("data:image/svg+xml,%3Csvg width='35' height='25' viewBox='0 0 114 85' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M52.41 3.08L2.44 42.16L52.41 81.24V3.08Z' fill='white'/%3E%3Cpath d='M53.91 84.32L0 42.16L53.91 0V84.32ZM4.87 42.16L50.91 78.17V6.15L4.87 42.16Z' fill='black'/%3E%3Cpath d='M83.04 56.66H112.03V27.67H83.04V56.66Z' fill='white'/%3E%3Cpath d='M113.53 58.16H81.54V26.16H113.53V58.16ZM84.54 55.16H110.53V29.16H84.54V55.16Z' fill='black'/%3E%3C/svg%3E") 1 1, pointer;
	--nav-next-icon: url("data:image/svg+xml,%3Csvg width='35' height='25' viewBox='0 0 114 85' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M61.12 81.24L111.1 42.16L61.12 3.08V81.24Z' fill='white'/%3E%3Cpath d='M59.62 84.32V0L113.53 42.16L59.62 84.32ZM62.62 6.15V78.17L108.66 42.16L62.62 6.15Z' fill='black'/%3E%3Cpath d='M30.49 27.66H1.5V56.65H30.49V27.66Z' fill='white'/%3E%3Cpath d='M31.99 58.16H0V26.16H31.99V58.16ZM3 55.16H28.99V29.16H3V55.16Z' fill='black'/%3E%3C/svg%3E") 1 1, pointer;
	button.owl-prev {
		background: transparent;
		height: 100%;
		width: 20%;
		position: absolute;
		left: 0;
		top: 0;
		float: left;
		cursor: -webkit-grab; cursor: grab;
		/* cursor: w-resize !important; */
		cursor: var(--nav-prev-icon) !important;
	}

	button.owl-next {
		background: transparent;
		height: 100%;
		width: 20%;
		position: absolute;
		right: 0;
		top: 0;
		float: right;
		cursor: -webkit-grab; cursor: grab;
		/* cursor: e-resize !important; */
		cursor: var(--nav-next-icon) !important;
	}

	button span {
		color: transparent;
		background: transparent;
		height: 100%;
		width: 100%;
	}
	button:hover span {
		color: rgba(0, 0, 0, 0);
		background: rgba(255, 255, 255, 0) !important;
	}
	button:hover {
		background: rgba(0, 0, 0, 0.014) !important;
		cursor: pointer;
	}
}

.mra-custom-project-item-slider.owl-dots {
    position: absolute;
    left: 50%;
    bottom: 20px;
}
@media (max-width: 768px) {
	.mra-custom-project-item-slider .owl-nav button.owl-prev,
	.mra-custom-project-item-slider .owl-nav button.owl-next {
		width: 15%;
	}
	.mra-custom-project-item-slider.owl-dots {
		bottom: 10px;
	}
	.mra-custom-project-item-slider .owl-nav button.owl-prev::after{
		content: var(--nav-prev-icon);
		display: block;
		width: 100%;
		height: 100%;
		/* background: ; */
	}
	.mra-custom-project-item-slider .owl-nav button.owl-next::after{
		content: var(--nav-next-icon); 
		display: block;
		width: 100%;
		height: 100%;
		/* background: var(--nav-next-icon); */
	}
	.mra-custom-project-item-slider .owl-nav button span {
		display: block;
        width: 30px;
        height: 30px;
        margin-top: 0;
        border: solid 1px #00000000;
        color: #00000085;
        border-radius: 45px;
        margin-left: 30%;
    }

	.mra-custom-project-item-slider .owl-nav:hover button span {
		color: rgb(0, 0, 0) !important;
		background: rgba(255, 255, 255, 0.76) !important;
	}
}

.text-right{
	text-align: right;
}
.mra-project-item-inner img {
    border-radius: 10px;
}

  @keyframes scale-up-center-normal {0% { transform: scale(0.5); } 100% { transform: scale(1);} }

.scale-up-center-normal { 
    animation: scale-up-center-normal 1s ease 0s 1 normal both; 
}
  @keyframes scale-down-center-normal {0% { transform: scale(1); } 100% { transform: scale(0.5);} }

.scale-down-center-normal { 
    animation: scale-down-center-normal 1s ease 0s 1 normal both; 
}

/* 
on scroll 
.mra-custom-project-container



*/
/* @keyframes scrollReveal {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
} */

/* .mra-custom-project-container {
  animation: scrollReveal 0.5s ease forwards;
} */
 .mra-custom-project-load-more {
    text-align: center;
    margin-top: 40px;
}
 .mra-custom-project-item h3,
.mra-custom-project-item-slide.extra-slide h3 {
    font-size: 16px;
    margin-bottom: 10px;
}

.mra-custom-project-item .mra-project-item-field,
.mra-custom-project-item-slide.extra-slide .mra-project-item-field {
    font-size: 12px;
}
.mra-custom-project-container {
	/* animation: scrollReveal 0.5s ease forwards; */
	max-width: 800px;
	margin: 0 auto; 
	transition: 1s ease;
}
.mra-custom-project-item {
	display: flex;
	flex-direction: row;
	gap: 30px;
	margin-bottom: 30px;
	display: flex;
	width: 100%;
}

.mra-project-item-fields {
	flex: 1;
}

.mra-project-item-inner {
	flex: 3;
}
.mra-custom-project-container.scaled { transform: scale(0.9555, 0.9555); }

@media (max-width: 768px) {
	.mra-custom-project-item {
		flex-direction: column-reverse;
		gap: 0;
	}
}
.admin-bar #page {
	height: calc(100vh - 32px);
	overflow-y: auto;
}
@media (max-width: 782px) {
	.admin-bar #page {
		height: calc(100vh - 46px);
	}
}
.mra-custom-project-slide-video:hover::before {
    content: "";
    background: #e4191900;
    height: 45%;
    width: 100%;
    position: absolute;
}
.mra-custom-project-slide-video:hover::after {
    content: "";
    background: #06302300;
    height: 30%;
    width: 100%;
    position: absolute;
    right:0;
    bottom:0;
}