/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/


	.dark #header.transparent-header.semi-transparent #header-wrap,
	#header.transparent-header.semi-transparent.dark #header-wrap {
		background-color: rgba(0,0,0,0.5);
	}


.blue-button {
	display: inline-block;
	position: relative;
	cursor: pointer;
	outline: none;
	white-space: nowrap;
	margin: 5px;
	padding: 8px 22px;
	font-size: 0.875rem;
	line-height: 24px;
	background-color: #4267B2;
	color: #FFF;
	font-weight: 700;
	text-transform: none;
	letter-spacing: 1px;
	border: none;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
}

.btn-info {
	--bs-btn-color: #fff;
	--bs-btn-bg: #0000cd;
	--bs-btn-border-color: #0000cd;
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: #3660eb;
	--bs-btn-hover-border-color: #25cff2;
	--bs-btn-focus-shadow-rgb: 11, 172, 204;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: #3660eb;
	--bs-btn-active-border-color: #25cff2;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #fff;
	--bs-btn-disabled-bg: #0000cd;
	--bs-btn-disabled-border-color: #0000cd;
}


#page-title span {
	display: block;
	margin-top: 10px;
	font-weight: 300;
	color: #777;
	font-size: 1.4rem;
}

.menu-item:hover > .menu-link,
.menu-item.current > .menu-link {
	color: limegreen;
}
    

#content p { line-height: 1.4; font-size: 18px; }
#content { line-height: 1.4; font-size: 18px; }

div.sm {
padding-left: 100px;
    
}


:root {
--bs-success-rgb: 120, 220, 120;
}

/* [1] The container */
.zoom-wrapper {
  height: ; /* [1.1] Set it as per your need */
  overflow: visible; /* [1.2] Hide the overflowing of child elements */
}

/* [2] Transition property for smooth transformation of images */
.zoom-wrapper img {
  transition: transform .5s ease;
}

/* [3] Finally, transforming the image when container gets hovered */
.zoom-wrapper:hover img {
  transform: scale(1.4);
}

/* [1] The container */
.zoom-wrapper2 {
  height: ; /* [1.1] Set it as per your need */
  overflow: visible; /* [1.2] Hide the overflowing of child elements */
}

/* [2] Transition property for smooth transformation of images */
.zoom-wrapper2 img {
  transition: transform .5s ease;
}

/* [3] Finally, transforming the image when container gets hovered */
.zoom-wrapper2:hover img {
  transform: scale(1.2);
}

.bg-gold {
	--bs-bg-opacity: 1;
	background-color: rgba(var(--bs-gold-rgb), var(--bs-bg-opacity)) !important;
}