#details{
  width: 80%;
  margin: auto;
  text-align: center;
  max-width: 800px;
}
#details p{
  margin: 0 3vw;
}
#details hr{
  margin: 30px 0;
}
iframe {
  width: 90%;
  max-width: 500px;
}

.color-palette {
  display: flex;
  justify-content: center;
  gap: 15px;
  margin: 20px 0;
}

.color-circle {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 2px solid #ccc;
}

.deep-blue { background-color: #2c3a5d; }
.dusty-blue { background-color: #77a0c9; }
.gray { background-color: #94a1af; }
.cream { background-color: #FFF5E1; }

.color-slider {
      width: 80%;
      max-width: 500px;
      height: 30px;
      border-radius: 15px;
      border: 1px solid #ccc;
      background: linear-gradient(to right,
        #5C4033,  /* Dark Brown */
        #8B5E3C,  /* Chestnut */
        #A9745F,  /* Light Brown */
        #C8AD7F,  /* Tan */
        #EED6B1,  /* Pale Beige */
        #FFF5E1   /* Cream */
      );
      margin: 20px auto;
    }


#main-card {
    width: 90%;
    max-width: 700px;
    background-color: #2c3a5d;
    margin: auto;
    border-radius: 1vw;
    box-sizing: border-box;
    color: #ffffff;
    padding: 15px;
}
#content{
  width: 100%;
  border: 2px solid #f0f0f0;
  box-sizing: border-box;
  border-radius: calc(1vw - 1px);
  margin: auto;
  text-align: center;
  color: #ffffff;
  padding: 15px;
}
#main-card hr {
  z-index: 0;
}
.entourage {
  display: flex;
  justify-content: space-between; /* Equal space around all items */
  color: #ffffff;
}

.box {
  flex: 1; /* makes both divs grow equally */
  text-align: center;
  color: #ffffff;
}
#content p{
  margin: 15px 0 0 0;
  padding: 0;
  color: #ffffff;
}
#content i{
  font-size: large;
  font-weight: bold;
  color: #ffffff;
}
#content hr{
  margin: 10px 0;
}


.groom-bride{
  font-style: italic;
  margin-bottom: 20px;
  color: #ffffff;
}
.groom-bride #and, .groom-bride h4{
  margin: 0;
  padding: 0;
}
.groom-bride h4{
  font-weight: bold;
}


/* === Tablet (>= 600px) === */
@media (max-width: 700px) {
  .entourage {
    display: block;
  }
}