      .carousel-inner img {
        width: 100%;
        height: 100%;
      }
      /* Make the image fully responsive */
      .carousel-inner img {
        width: 100%;
        height: 100%;
      }
      /* Make the image fully responsive */
      .carousel-inner img {
        width: 100%;
        height: 100%;
      }
      /* Make the image fully responsive */
      .carousel-inner img {
        width: 100%;
        height: 100%;
      }
      .carousel-inner img {
        width: 100%;
        height: 100%;
      }
      .carousel-inner img {
        width: 100%;
        height: 100%;
      }

	.carousel-indicators li {
	  box-sizing: content-box;
	  -ms-flex: 0 1 auto;
	  flex: 0 1 auto;
	  width: 20px;
	  height: 20px;
	  margin-right: 3px;
	  margin-left: 3px;
	  text-indent: -999px;
	  cursor: pointer;
	  background-color: #fff;
	  background-clip: padding-box;
	  border-top: 10px solid transparent;
	  border-bottom: 10px solid transparent;
		border-radius: 50%;
	  opacity: .5;
	  transition: opacity 0.6s ease;
	}
.carousel-indicators .active {
  opacity: 1;
	background-color: #7C0A02;
}

/*!
 * Bootstrap CSS modifier styles
*/

html, body { scroll-behavior: smooth; }

    .toTop, .prevPage, .nextPage {
        width: 40px;
        height: 40px;
        position: relative;
        display: inline-block;
        border: none
    }
    .toTop .img-top, .prevPage .img-top ,.nextPage .img-top {
        display: none;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 99;
    }
    .toTop:hover .img-top, .prevPage:hover .img-top ,.nextPage:hover .img-top {
        display: inline;
        cursor: pointer;
    }


html body {
  background-color: rgba(178,34,34,0.50);
  background-color:#E8E7E2;
  background-size: auto; /* Resize the background image to cover the entire container */
  background-position: center; /* Center the image */
}

body {
  margin: 0;
  color: #212529;
  text-align: left;
  background-color: #fff;
}

header {background: #7C0A02; padding-bottom:5px }

header div.jumbotron { 
	padding-top: .5rem;	padding-bottom: .5rem; margin-bottom: 1px;
	background-image:  url("../images/photo4a.jpg");
	background-position: center 10%; /* Center the image */
	background-repeat: no-repeat; /* Do not repeat the image */
	background-size: cover; /* Resize the background image to cover the entire container */
}

header div.jumbotron h1.text-center {
	color: #FFFFFF; 
    text-shadow: 4px 4px 8px black; 
    text-decoration: none;  
}

header div.jumbotron p.text-center {
	color: #FFFFFF; 
    text-shadow: 4px 4px 8px black; 
}

.dropdown-item:hover, .dropdown-item:focus {
  background-color: #C3C3C3 ;
}

.dropdown-item.active, .dropdown-item:active {
  background-color: #B3B3B3 ;
}

/* --- for empty pages --- */
#mainContent { min-height: 600px; display: block;}


footer {  
	background-color: #7C0A02 !important; 
	padding: 1em;
}
footer {color: white;}

.ekko-lightbox-nav-overlay{ display: none !important; }

Section div.container { background-color: white; }

body section.first { }
.first .container { }

#mainContent .row {
    margin-left: 0; margin-right: 0px;
    padding: 0;
}


.bg-black { background-color: black !important; }

a.bg-black:hover, a.bg-black:focus,
button.bg-black:hover,
button.bg-black:focus { background-color: grey !important; }

.bg-barn-red { background-color: #7C0A02 !important; }

.txt-barn-red { color: #7C0A02 !important; }

h2.txt-barn-red {
	background-color: #7C0A02 !important;
	color: white !important;
	padding: 1rem
}

a.bg-barn-red:hover, a.bg-barn-red:focus,
button.bg-barn-red:hover,
button.bg-barn-red:focus { background-color: #B22222 !important; }

.nav-item {border-radius: 10px; margin-left: 5px;}
.nav-item:hover {background-color: #9C0A02;}
.nav-item.active{background-color:dimgrey; border-radius: 10px;}
.nav-item.active:hover{background-color:dimgrey;}
.navbar-brand {width: 3em;}

/* .navbar-toggler{color:white !important; border-color: white !important;} */


 .navbar-light .navbar-toggler-icon { background-image: url("../images/menu-icon1.png"); }

.musee { width:20% !important; }

.modal-header { padding: 0.5rem 1rem ; }

.ekko-lightbox .modal-footer {
    justify-content: flex-start;
    text-align: left;
    font-size: 80%;
    /*color: #6c757d; */
    padding: 0.3rem 0.75rem ;
	padding-top: 0;
}

.ekko-lightbox .modal-footer p {
	display: block !important;
	width: 100% !important;
	
	
}
P.footerTxt { overflow: auto; max-height: 110px; line-height: 1.0;}
p.sourceTxt { margin-top: 0 !important; text-align: right;	line-height: 0.85;}

.modal-dialog { }
.modal-body   { padding-bottom: 0rem }

.callout {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    font-size: 80%; font-style: italic;
}

.callout h3 { text-align: center; }

.stories figure img { border: thin solid #ddd; }
.stories #mainContent figure img.img-fluid:hover { opacity: 0.8; 
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
    transform: translateX(-3px);
    transform: translateY(3px);
}

figure { margin-right: auto; margin-left: auto; }
.figure-caption {font-size: 80%;}

hr {
  display: block;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  margin-left: auto;
  margin-right: auto;
  border-style: inset;
  border-width: 1px; 
  border-color: black;
}
    #HeadText h1 { padding-bottom: 0; margin-bottom: 0; }
    #HeadText p  { padding-top: 0; margin-top: 0; }

audio {
	border: #7C0A02 solid ;
	background-color: #7C0A02;
	border-radius: 30px;
}

#accordion h4 .btn-link {color: maroon !important; font-weight: bold;}

#nestedAccordion h5 .btn-link {color: black !important; font-weight: bold;}

#accordion .card-header {padding: 0.1em 0.1em ; border: 1px solid maroon !important;}

#nestedAccordion .card-header {padding: 0.0em 0.0em ;  border: none !important;}

#accordion .card-body, #nestedAccordion .card-body {padding: 0.2em; }

#accordion .btn, #nestedAccordion .card-body {width: 100%; text-align: left; }

#accordion figure, #nestedAccordion figure { background-color: white; padding: 0.5em; }
#accordion figure img, #nestedAccordion figure img { box-shadow: 3px 3px 5px grey; border: thin solid grey; margin-bottom: 0.2em;  }

@media (max-width: 575px){
    body {font: 1rem/1.5 "Inter", "Helvetica Neue", Arial, sans-serif; }
    #HeadText h1 { font-size: 2.2rem; }
    #HeadText p { font-size: 1.2rem; }
    #MuseeLogo { width: 250px; margin: auto; padding-bottom: 0.5rem;}
    footer{ font-size: small; }
    div.txt-barn-red h2 { font-size: 24px; }
    .gallery #mainContent div.txt-barn-red h2 {font-size: 16px;  } 
    div.txt-barn-red h4 { font-size: 20px; }
    body.home div.container h4, .callout h4 { font-size: 1.0rem !important; }
	h4.modal-title {line-height: 1.1em; font-size: 1.1rem;}
    #accordion figure img, #nestedAccordion figure img { width: 100% !important  }
    #accordion figcaption, #nestedAccordion figcaption { font-size: 0.85rem !important }
}

@media (min-width: 576px) and (max-width: 767px){
    body {font: 1.0rem/1.5 "Inter", "Helvetica Neue", Arial, sans-serif; }
    #HeadText h1 { font-size: 3.5rem; }
    #HeadText p { font-size: 1.5rem; }
    footer{ font-size: 0.8; }
    div.txt-barn-red h2 { font-size: 24px; }
    .gallery #mainContent div.txt-barn-red h2 {font-size: 20px;  } 
    div.txt-barn-red h4 { font-size: 20px; }
    body.home div.container h4, .callout h4 { font-size: 1.0rem !important; }
    #accordion figure img, #nestedAccordion figure img { width: 100% !important  }
    #accordion figcaption, #nestedAccordion figcaption { font-size: 0.9rem !important }
}


@media (min-width: 768px) and (max-width: 991px){
    body {font: 1.1rem/1.5 "Inter", "Helvetica Neue", Arial, sans-serif; }
    #HeadText h1 { font-size: 4.5rem; }
    #HeadText p { font-size: 2.0rem; }
    footer{ font-size: 1rem; }
    div.txt-barn-red h2 { font-size: 28px; }
    .gallery #mainContent div.txt-barn-red h2 {font-size: 24px;  } 
    div.txt-barn-red h4 { font-size: 22px; }
    body.home div.container h4, .callout h4 { font-size: 1.25rem !important; }
    #accordion figure img, #nestedAccordion figure img { width: 100% !important  }
    #accordion figcaption, #nestedAccordion figcaption { font-size: 1.0rem !important }
}

@media (min-width: 992px) and (max-width: 1200px){
    body {font: 1.2rem/1.5 "Inter", "Helvetica Neue", Arial, sans-serif; }
    #HeadText h1 { font-size: 5.5rem; }
    #HeadText p { font-size: 2.5rem; }
    div.txt-barn-red h2 { font-size: 32px; }
    .gallery #mainContent div.txt-barn-red h2 {font-size: 28px;  } 
    div.txt-barn-red h4 { font-size: 24px; }
    body.home div.container h4, .callout h4 { font-size: 1.5rem !important; }
    #accordion figcaption, #nestedAccordion figcaption { font-size: 1.0rem !important }
    
}

@media (min-width: 1201px){
    body {font: 1.2rem/1.5 "Inter", "Helvetica Neue", Arial, sans-serif; }
    #HeadText h1 { font-size: 5.5rem;padding-bottom: 0; margin-bottom:  0; }
    #HeadText p { font-size: 2.5rem; padding-top: 0;margin-top:  0;}
    div.txt-barn-red h2 { font-size: 32px; }
    .gallery #mainContent div.txt-barn-red h2 {font-size: 28px;  } 
    div.txt-barn-red h4 { font-size: 24px; }
    body.home div.container h4, .callout h4 { font-size: 1.7rem !important; }
    #accordion figcaption, #nestedAccordion figcaption { font-size: 1.1rem !important }
}
	

