style.css

html {
  height: 100%;
  width: 100%;
}

#top {
	box-shadow: 2px 10px red;
}
#content2 {
  margin-top:15vh;
}
#content2 button {
  background:none;
  height: 150px;
    width: 150px;
  margin-right:auto;
  margin-left:auto;
  padding:0;
  border:none;
}

#infoModal {
  --bs-modal-bg: rgb(61, 61, 61);
  --bs-modal-color: rgb(228, 228, 228);
}

#credits {
  margin:5px;
  margin-right:10px;
  font-size: 15px;
  transition: all .2s ease-in-out; 
}
#credits:hover {
  font-size:25px;

  transition:scale(1.1);
}

.col img{
  height: 150px;
  width:150px;
  margin:none;
  padding:none;
  object-fit: fill;
}
#header {
  position:sticky;
  height:100px;
  width:100%;
  display:flex;
  flex-direction:row;
  background-color: #3177a5;
}

#roslynLogo {
  /* background-color:rgb(0, 0, 0); */
  width:90px;
  height:90px;
  margin:5px;
  /* box-shadow: 3px 3px 20px rgba(0, 0, 0, 1); */
}

#headText {
  color: rgba(236, 236, 236, 0.8);
}

#quoteCarousel {
  height:50vh;
  width:100%;
  background-color: rgb(61, 61, 61);
}

.person-image {
  height:50vh;
  width: 100%;
}

.active, .carousel-item{
  height:65vh;
  width:100%;

}
.carousel-caption {
  margin-left:auto;
  margin-right:auto;
  width:50%;
}
.carousel-item img {
  object-fit: contain;
}
div .carousel-caption {
  border-radius:15px;
  color:rgb(228, 228, 228);
  background-color: rgb(54, 54, 54);
  box-shadow: 3px 3px 20px rgba(0, 0, 0, 1);
}