:root {
	/*1. Make background black*/
	/*--body-bg: #000000;*/
	/*2. Make Text White*/
	/*--body-color: #FFFFFF;*/
	/*3. Adjust Cassiopeia Color Scheme*/
	--cassiopeia-color-primary: #71608e;
	--cassiopeia-color-link: #71608e;
	--cassiopeia-color-hover: 71608e;
  
  .breadcrumb {
 background-color: #f8b454;
}
.container {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}

/* Then style the iframe to fit in the container div with full height and width */
.responsive-iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
} 
.direction-container {
            display: flex;
            flex-wrap: wrap;
        }

        .iframe-direction-container {
            flex: 1;
            padding: 10px;
        }

        .iframe-direction-container iframe {
            width: 100%;
            height: 100%;
            border: none;
        }  

  /* Make the logo image 20% larger */
.brand-logo img {
    width: 421px; /* 20% larger */
    height: auto; /* Maintain aspect ratio */
    transition: transform 0.3s ease-in-out; /* Smooth hover transition */
}

/* Add the hover effect (optional) */
.brand-logo img:hover {
    transform: scale(1.1); /* Enlarge by an additional 10% on hover */
}

/* Target all main menu links */
 /* ul.mod-menu a {
  color: #E9E9CB !important;
} */
  
}