@import "main.css";
@import "gallery.css";
main{padding-top:60px !important;}
#mainTitle > div{
  position:relative;
  width:90%;
  margin:0 auto;
}
#mainTitle > div::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right:0;
  bottom:0;
  background-image: url('../img/searchIcon.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  opacity: .4;
}
#mainTitle > div > h2{text-align: center;}
#introMuseo{
  width:100%;
  height:70vh;
  overflow-y: auto;
  overflow-x: hidden;
}
#introMuseo h4, #introMuseo h6{font-weight: bold; color:rgb(198,156,85) !important;}
/* #introMuseo h6{font-size: 1.2rem; margin-top:1.5rem;} */
#introMuseo span{font-weight: bold;}
#introMuseo p{margin:0; font-size:.9rem;}
#introMuseo li{padding: .25rem 1.25rem; font-size: .8rem;}

svg{width:98%;height:60vh; margin:0 1%; font-family: sans-serif;}

#sale > g,
#vetrine g > g,
#scaffali g,
#colonne g{cursor:pointer}

#sale path, 
#sale rect, 
#vetrine path, 
#vetrine rect{fill:#ffffff;}

.contenitore, .sala{fill:rgb(255,255,255);}
.contenitoreHover, .contenitoreActive{fill:rgb(198,156,85) !important;}
.salaHover, .salaActive{fill:rgba(23,16,84,0.3) !important;}

#findWrap{
  position:relative;
  width:100%;
  margin:0 auto;
  /* padding:0 30px; */
  padding:0;
  display: flex;
  flex-wrap: wrap;
  align-content: center;
}

#findWrap>.item{
  position:relative;
  cursor:pointer;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  margin:2px;
}

#findWrap > .item > .legenda{
  position:absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width:100%;
  top:60%;
  bottom:0;
  left:0;
  padding:10px;
  color: rgb(255, 255, 255);
  background-color: rgba(0, 0, 0, 0.7);
}

#guidaNavigazione{
  position: absolute;
  left: 10px;
  top: 15px;
  width: 400px;

  #navTip{
    margin-top: 15px;
    li{ font-size:14px }
  }
}

#listaCassette{ height:auto; max-height: 300px; overflow: auto; }

.breadcrumb{font-size: 1.6rem;justify-content: center;}


/* ACCORDION OVERWRITE CSS */
.accordion-button:focus { box-shadow: none !important;}
.accordion-button:not(.collapsed) {
  /* color: var(--bs-accordion-active-color); */
  color: #fff;
  background-color: rgb(198, 156, 85) !important;
  box-shadow: none !important;
}

@media (min-width: 768px) {
  #mainTitle > div{
    width:60%;
    padding-left:130px;
  }
  #mainTitle > div::before{
    background-position: left;
  }
  #mainTitle > div > h2{text-align: left;}
}