/* CSS Document */

/*STYLE SHEET FOR THE DROPDOWN GLOSSARY*/


.dropdown-menu {
	max-height: 400px;
	overflow-y: auto;
}

/********************* A-Z DROPDOWN BUTTONS *************************/
/* dropdown buttons*/
.my-social-buttons {
	color: #33333;
	background-color:#FFF;
	border: 1px solid #ccc;
	border-radius: 0; /* Remove rounded corners */
	font-family:"Times New Roman", Times, serif;
	line-height:1rem;
	padding:2px 2px;
	margin-right: .4rem;
	margin-top: 1rem;
	float:left;
	width:1.5rem;
}
.my-social-buttons:hover {
	color:white;
	background-color:#aaa;
	border: 1px solid #aaa;
	border-radius: 0; /* Remove rounded corners */
}
.my-social-buttons:focus {
	outline: none;
	box-shadow: none; /* Remove focus shadow */
}
.custom-col {
	padding-right: 8px; /* Adjust these values as needed */
	margin-bottom: 8px;
	padding-left: 0;
	border-radius: 0; /* Remove rounded corners */
}
/* Remove the caret from all dropdown toggles */
.dropdown-toggle::after {
	display: none;
}
.dropdown-item {
	font-family:"Times New Roman", Times, serif;
	line-height:1.3rem;
	padding-left: 1rem;
	font-size: .85rem; 
}
.dropdown-menu {
	background-color: white /* Light grey background */
	border-radius: 5px; /* Rounded corners */
	box-shadow: 0 8px 16px 0 rgba(0,0,0,0.1); /* Add some shadow */
	padding: 0 0 0 0; 
}

/********************* IMAGE CONTAINERS *************************/
.imagesocial {
	margin-top: .5rem;
	width: 150px;
	border: 1px solid #ccc;
	float: left;
	padding:4px;
	margin-right: 1rem;
}
.imagesocial img {
		width: 100%; /* Make the image fit the width of the div */
		height: auto; /* Keep the image's aspect ratio */
}
/* styles for figures */
 .image-small-map {
    width:220px;
    float:right;
    margin-left: .6rem;
    margin-top: .3rem;
    padding-bottom: .5rem;
    border-bottom: 1px solid #ccc;
}
/* Media query centers figure on small devices */
@media (max-width: 576px) {
.image-small-map {
	float: none;       /* Remove float */
	margin: 0 auto;    /* Center the element */
	display: block;    /* Ensure it behaves as a block element */
	margin-bottom: 1.5rem;
    }
}
/********************* LARGE IMAGE CONTAINERS *************************/
.image-large-map {
    width:100%;
    margin-top: .3rem;
    margin-bottom: 1rem;
    padding-bottom: .5rem;
    border-bottom: 1px solid #ccc;
    font-family:"Times New Roman", Times, serif;
    font-size:.5rem;
}
/********************* IMAGE CAPTIONS *************************/ 
.image-large-map figcaption, .image-small-map figcaption{
	font-size: .85rem;
	margin-top:.5rem;
	color: #666;
	line-height: 1.1rem
}
/********************* BACK BUTTON *************************/
#backButton {
  position: sticky;
  top: 1rem;      /* Position slightly below the top */
  left: 1rem !important;     /* Position to the left with some space */
  z-index: 1000;  /* Ensure it stays above other content */
  outline: none;  /* Remove the default focus outline */
  margin-bottom: .5rem;
}
#backButton:focus {
  box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.8); /* Custom focus style */
  outline: none; /* Ensure the outline remains removed */
}
#backButton:active {
  outline: none; /* Remove the blue outline on click */
  box-shadow: none; /* Remove any box-shadow during the active state */
}
/***************++++++++++****** BLOCKQUOTE *************************/
blockquote {
  margin: 1rem 0; /* Vertical margin */
  padding:0px 2rem; /* Padding inside blockquote */
}
/*************++++++++++++++******** MODALS *************************/
/* show modal footer */
 .modal-footer  {
	display:inline;
}
#nodeInfoModal .glossary-footnotes {

  margin-top: 1rem;
}
#nodeInfoModal .glossary-footnotes p {
	margin-bottom: 0.3rem;
	font-size: 0.8rem;
	line-height: 1.2rem;
} 

