/* Master Color */
body {
	background-color: #4A4A4A;
	color: #F2CB91;
}

a:visited {
	color: #B43E69;
}

a {
	color: #3EB489;
}

.soft-edge img {
	border-radius: 50%;
	-webkit-mask-image: radial-gradient(ellipse 75% 75% at 50% 50%, black 75%, transparent 60%);
	mask-image: radial-gradient(ellipse 75% 75% at 50% 50%, black 75%, transparent 60%);
}

.soft-edge img:hover {
    transform: scale(1.05);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3);
}

.soft-edge2 img {
    width: 150px;              /* adjust size as needed */
    height: 200px;             /* taller than width = oval */
    object-fit: cover;         /* keeps image from stretching */
    
    border-radius: 50% / 60%;  /* creates an oval instead of a circle */
    
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2); /* soft depth */
    
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.soft-edge2 img:hover {
    transform: scale(1.05);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3);
}

/* Reset default list styling */
.navbar ul {
list-style: none;
margin: 0;
padding: 0;
}

/* Navbar container */
.navbar {
background-color: #333;
padding: 0 20px;
}

/* Make links horizontal */
.navbar ul {
display: flex;
justify-content: center;
}

/* Each list item */
.navbar li {
margin: 0;
}

/* Links */
.navbar a {
display: block;
padding: 15px 20px;
color: #F2CB91;
text-decoration: none;
font-family: Arial, sans-serif;
transition: background 0.3s;
}

/* Hover effect */
.navbar a:hover {
background-color: #555;
}

.image-dropdown {
  position: relative;
  display: inline-block;
}

.image-content {
  display: none;
  position: absolute;
  top: 0;
  left: 210px; /* pushes it to the right of the 200px image */
  white-space: nowrap;
}

.image-content img {
  width: 100px; /* adjust as needed */
  margin-right: 5px;
}

.image-dropdown:hover .image-content {
  display: block;
}