.montserrat {
    font-family: Montserrat;
    font-weight: 500;
}

.roboto {
    font-family: Roboto;
    font-weight: 500;
}

.questrial {
    font-family: Questrial;
}

/* 
red gradient 
    background-image: linear-gradient(90deg, #5d0b3c, #c1328c);


blue gradient 
  background-image: linear-gradient(90deg, #0b3c5d, #328cc1);


green gradient 
    background-image: linear-gradient(90deg, #3c5d0b, #8cc132);
*/

.gradient-header {
  background-image: linear-gradient(90deg, #0b3c5d, #328cc1);
  background-origin: padding-box;
  background-position: 0% 0%;
  background-repeat: repeat;
  background-size: auto;

  border-radius: 3px;
  box-shadow:
    rgba(0, 0, 0, 0.56) 0px 16px 38px -12px,
    rgba(0, 0, 0, 0.12) 0px 4px 25px 0px,
    rgba(0, 0, 0, 0.2) 0px 8px 10px -5px;

  box-sizing: border-box;
  color: #fff;
  font-family: 'Questrial', sans-serif;
  font-size: 14px;
  line-height: 24px;
  padding: 16px 15px;
  margin: -30px 15px 0 15px;
  text-align: left;
}

.card-title {
  font-family:Questrial;
}

.lucille-background {
    background: url("../images/MCH.webp") no-repeat center center;
    background-size: contain;
    height: 200px; /* Adjust height as needed */
    }


/* accessory.css */

/* ====== Jade Gradient ====== */
.jade-gradient {

  background-image: linear-gradient(90deg,  #34caa1, #007755);
  color: white;
}

/* ====== Ruby Gradient ====== */
.ruby-gradient {
  background-image: linear-gradient(90deg, #e0115f, #8b0000);
  color: white;
}

/* ====== Lapis Lazuli Gradient ====== */
.lapis-gradient {
  background-image: linear-gradient(90deg, #26619c, #1a3f7d);

  color: white;
}

/* use this formts, the above for headers */
form.jade-gradient {
  background-image: linear-gradient(to right, #007755, #34caa1);
  background-size: cover;
  background-position: center;
  color: white;
  padding: 2rem;
  border-radius: 0.5rem;
}


/* ====== Dark Jade Gradient ====== */
.jade-medium-form {
  background-image: linear-gradient(to right, #004d3c #228b76);
  color: white;
}

/* ====== Dark Ruby Gradient ====== */
.ruby-medium-form {
  background-image: linear-gradient(to right, #600012, #b01048);
  color: white;
}

/* ====== Dark Lapis Lazuli Gradient ====== */
.lapis-medium-form {
  background-image: linear-gradient(to right, #112b4d, #1e3f66);
  color: white;
}

/* ====== Very Dark Jade Gradient ====== */
.jade-medium-form {
  background-image: linear-gradient(to right, #002d22, #165c4e);
  color: white;
}

/* ====== Very Dark Ruby Gradient ====== */
.ruby-medium-form {
  background-image: linear-gradient(to right, #330008, #800025);
  color: white;
}

/* ====== Very Dark Lapis Lazuli Gradient ====== */
.lapis-medium-form {
  background-image: linear-gradient(to right, #0a1b30, #142b47);
  color: white;
}