@font-face {
    font-family: helvetica neue;
    font-style: normal;
    font-weight: 400;
    src: url(https://www.ucsfhealth.org/assets/ucsf/fonts/f95f9fc2-ffda-431c-9d6a-2c3668f5b20b.eot?#iefix) format("eot"),url(https://www.ucsfhealth.org/assets/ucsf/fonts/5b1fbd62-45dc-4433-a7df-a2b24a146411.woff2) format("woff2"),url(https://www.ucsfhealth.org/assets/ucsf/fonts/050b1948-f226-4d20-a65a-15d8ed031222.woff) format("woff"),url(https://www.ucsfhealth.org/assets/ucsf/fonts/beb88be6-2a60-46fe-914f-6892b3ae46ce.ttf) format("truetype")
}

@font-face {
    font-family: helvetica neue;
    font-style: normal;
    font-weight: 100;
    src: url(https://www.ucsfhealth.org/assets/ucsf/fonts/1b950d2a-907a-4888-8056-0d44e8e86338.eot?#iefix) format("eot"),url(https://www.ucsfhealth.org/assets/ucsf/fonts/3a46542f-f429-4821-9a88-62e3be54a640.woff2) format("woff2"),url(https://www.ucsfhealth.org/assets/ucsf/fonts/50ac1699-f3d2-47b6-878f-67a368a17c41.woff) format("woff"),url(https://www.ucsfhealth.org/assets/ucsf/fonts/0be5590f-8353-4ef3-ada1-43ac380859f8.ttf) format("truetype")
}

@font-face {
    font-family: helvetica neue;
    font-style: normal;
    font-weight: 700;
    src: url(https://www.ucsfhealth.org/assets/ucsf/fonts/829e3f99-4330-41bd-872d-3aae5404d41d.eot?#iefix) format("eot"),url(https://www.ucsfhealth.org/assets/ucsf/fonts/cb249624-c6ac-4fa8-84a6-921dc1627b9c.woff2) format("woff2"),url(https://www.ucsfhealth.org/assets/ucsf/fonts/61a17c5f-4b44-4cb1-928a-52f47ac973dc.woff) format("woff"),url(https://www.ucsfhealth.org/assets/ucsf/fonts/42c62872-d26e-47de-9b2d-6e876bb411d1.ttf) format("truetype")
}

@font-face {
    font-family: helvetica neue;
    font-style: italic;
    font-weight: 100;
    src: url(https://www.ucsfhealth.org/assets/ucsf/fonts/e36efb7d-12e3-4773-a830-26e5652373ea.eot?#iefix) format("eot"),url(https://www.ucsfhealth.org/assets/ucsf/fonts/261b4efb-3d70-4965-977d-38af9422700d.woff2) format("woff2"),url(https://www.ucsfhealth.org/assets/ucsf/fonts/2e00514e-1764-4250-a0c5-aca3e5a8d133.woff) format("woff"),url(https://www.ucsfhealth.org/assets/ucsf/fonts/e2fe2e07-9419-400f-953d-dc23cfa647a2.ttf) format("truetype")
}

html {
 scroll-behavior: smooth;
}

.topHeader,
.header,
.main_white,
.main_blue,
.main_grey,
footer {
    padding: 1rem var(--lg-pad-sides) 1rem;
    margin: 0 auto;
}

body {
    margin: 0 auto !important;
    padding: 0;
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    background: #ffffff;
    max-width: 1440px;
}
.notForYouRow a {
    font-weight: normal;
    color: #006BE9;
}

.topHeader {
    background-color: #506380;
    height: 50px;
    padding: 0 40px;
}

.topHeaderText {
    color: #fff;
    font-family: helvetica neue,Helvetica,Arial,sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    float: left;
    margin-top: 0;
}

.topHeaderPhone {
    order: 2;
    padding: 10px 0;
    width: 170px;
}
.topHeaderPhone, a, .topHeaderPhone a {
    cursor: pointer;
}

.phoneText a p {
    color: #006be9;
    text-align: right;
    font-family: helvetica neue,Helvetica,Arial,sans-serif;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    float: right;
}

.phoneImage {
    float: left;
    margin-top: 17px;
    width: 35px;
}

.primaryHeaderLogo {
    margin: 10px 0 0 0;
    display: block;
    order: 1;
    width: 14rem;
    height: auto;
}

.fullWidthHero {
    background-image: url(https://image.s7.sfmc-content.com/lib/fe2911717d64047b7c1479/m/1/d8154d8c-ec52-490f-a9a4-1a4be682eab1.jpg);
    padding: 250px 100px 300px 100px;
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    margin-top: 10px;
    background-position: center;
}

.leftText,
.leftText h1,
.leftText p {
    color: #ffffff;
}

.fullWidthHero h1 {
    font-family: helvetica neue,Helvetica,Arial,sans-serif;
    font-size: 65px;
    font-style: normal;
    font-weight: 700;
    line-height: 70px;
    letter-spacing: -1px;
}

.fullWidthHero p {
    font-family: helvetica neue,Helvetica,Arial,sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
}
.hat {
    display: inherit;
}
.rabbit {
 display:none;
}

.whitePill {
    margin: 40px 0 0 0;
}

.whitePill a {
    border-radius: 30px;
    background: #FFF;
    padding: 18px 30px;
    color: #052049;
    text-align: center;
    font-family: helvetica neue,Helvetica,Arial,sans-serif;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
    text-decoration: none;
    display: inline-block;
}

.subtitle h2 {
    color: #052049;
    text-align: center;
    font-family: helvetica neue,Helvetica,Arial,sans-serif;
    font-size: 50px;
    font-style: normal;
    font-weight: 400;
    line-height: 46px;
    margin: 30px 0 50px 0;
}

.threeCol,
.row {
    max-width: 1440px;
    margin: 0rem auto;
    display: flex;
    flex-direction: row;
    align-items: top;
    justify-content: space-between;
}

.threeCol .box {
    border-radius: 10px;
    background: #F8F8F9;
    width: 32%;
    padding: 30px 50px 40px 50px;
    text-align: center;
    margin-bottom: 20px;
}

.b_number {
    color: #052049;
    text-align: center;
    font-family: helvetica neue,Helvetica,Arial,sans-serif;
    font-size: 48px;
    font-style: normal;
    font-weight: 700;
    line-height: 50px;
    margin-top: 10px;

}

.b_text {
    color: #052049;
    text-align: center;
    font-family: helvetica neue,Helvetica,Arial,sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
    margin-top: 10px;
}

.row {
    margin-top: 30px;
    margin-bottom: 30px;
}

.blue_container {
    background: #F9F9FF;
    max-width: 100%;
    margin: 0rem;
    padding: 30px 50px 250px 50px;
}

.textCol {
    max-width: 40%;
}

img.a_icon {
    height: 15px;
    width: auto;
    position: relative;
    top: 3px;
}

img.b_icon, img.r_icon, img.downloadIcon, img.startIcon, img.scheduleIcon {
    height: 35px;
    width: auto;
}

h3.r_head {
    color: #052049;
    font-family: helvetica neue,Helvetica,Arial,sans-serif;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
    margin: 10px 0 0 0;
}

p.r_text {
    color: #052049;
    font-family: helvetica neue,Helvetica,Arial,sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    margin: 10px 0 40px 0;
}

.noColor .picCol {
    margin-left: 40px;
}

.blue_container .picCol {
    margin-right: 60px;
    text-align: center;
}

.blueCaption {
    border-radius: 10px;
    background: #052049;
    width: 600px;
    padding: 20px 30px;
    color: #ffffff;
    font-family: helvetica neue,Helvetica,Arial,sans-serif;
    font-size: 28px;
    font-style: normal;
    font-weight: 700;
    line-height: 35px;
    position: relative;
    bottom: -11px;
    left: -10px;
    margin-top: -80px;
text-align: left;
}

.bluePill {
    margin: 40px auto;
    text-align: center;
}

.bluePill a, input.bluePill {
    border-radius: 30px;
    background: #006BE9;
    padding: 18px 50px;
    color: #ffffff;
    text-align: center;
    font-family: helvetica neue,Helvetica,Arial,sans-serif;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
    text-decoration: none;
    display: inline-block;
}
.donorCTA {
    border-radius: 10px;
    background: #052049;
    padding: 90px 80px 30px 80px;
    position: relative;
    top: -200px;
    margin: 20px 100px -120px 100px;
}
.donorCTA h2 {
    color: var(--White, #FFF);
    text-align: center;
    font-feature-settings: 'clig' off, 'liga' off;
    font-family: helvetica neue,Helvetica,Arial,sans-serif;
    font-size: 50px;
    font-style: normal;
    font-weight: 700;
    line-height: 66px;
}
.faq_intro h2 {
    color: #052049;
text-align: center;
font-family: helvetica neue,Helvetica,Arial,sans-serif;
font-size: 50px;
font-style: normal;
font-weight: 700;
line-height: 46px;
}

.faq_intro p {
    color:#052049;
text-align: center;
font-family:helvetica neue,Helvetica,Arial,sans-serif;
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 30px;
margin-left: 20%;
margin-right: 20%;
margin-bottom:40px;
}

/* Arrows on the FAQ */
summary {
  list-style: none;
}

summary::-webkit-details-marker {
  display: none;
}

summary span {
    font-size: 170%;
    color: #000;
    background-color: transparent;
    padding: 0.3em 0.2em 0 0.2em;
    border: none;
    border-radius: 0%;
    line-height: 1;
    text-align: center;
    text-indent: 0;
   /* transform: rotate(270deg); */
    float: right;
    margin: -10px 0 0 0;
}

summary img {
  transition: transform 0.25s ease-in;
  transform-origin: center 45%;
}
details:hover {
}

details[open] summary img {
  transform: rotate(180deg);
}


section[role="group"] > div {
  margin: 0;
}

details > div {
  height: calc(70vh - 7.5em);
  overflow: auto;
  padding: 0.25em 1.25em;
  border: 0.1em solid #ddd;
  background-color: #fff;
  margin-top: -0.1em;
  background:
    linear-gradient(var(--page-bg) 30%, var(--page-bg)),
    linear-gradient(var(--page-bg), var(--page-bg) 70%) 0 100%,
    radial-gradient(farthest-side at 50% 0, rgba(0,0,0,.2), rgba(0,0,0,0)),
    radial-gradient(farthest-side at 50% 100%, rgba(0,0,0,.2), rgba(0,0,0,0)) 0 100%;
  background-repeat: no-repeat;
  background-color: var(--page-bg);
  background-size: 100% 4em, 100% 4em, 100% 1.4em, 100% 1.4em;
  background-attachment: local, local, scroll, scroll;
}

details {
    border-radius: 10px;
    border: 1px solid #D4D2E3;
    background:  #FFF;
    padding: 20px 40px;
    margin-bottom:20px;
display:block;
}
details[open] {
    border: 2px solid #006BE9;
    background: #F8F8F9;
    padding: 20px 40px;
}
details summary h3 {
    color: #052049;
    font-family: helvetica neue,Helvetica,Arial,sans-serif;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 34px;
    margin-bottom: 0;
    }
    details[open] summary h3 {
    color: #006BE9 !important;
    }
    details p {
        color: #052049;
        font-family: helvetica neue,Helvetica,Arial,sans-serif;
        font-size: 20px;
        font-style: normal;
        font-weight: 400;
        line-height: 30px;
    }

@media print {
  summary, section[role="group"], details > div {
    border: none;
    background: transparent;
    padding: 0;
  }
  summary span {
    display: none;
  }
  details > div {
    height: auto;
  }
}
.scheduleCol {
    margin-right: 10px;
    background-image:url(https://image.s7.sfmc-content.com/lib/fe2911717d64047b7c1479/m/1/63cba094-6237-44e0-ae38-8d90e711b088.jpg);
    padding: 10px 30px 0px 100px;
}
.startCol {
    margin-left: 10px;
    background-image:url(https://image.s7.sfmc-content.com/lib/fe2911717d64047b7c1479/m/1/f9e05e65-7b84-4bd3-b4b9-efce110fe91a.jpg);
    padding: 10px 100px 0px 30px;
    background-position: right;

}
.scheduleCol, .startCol {
    float: left;
    width: 48%;
    background-size: cover;
    background-repeat: no-repeat;
    margin-bottom: 20px;
    border-radius: 20px;
    display: flex;
    align-content: flex-start;
    align-items: center;
    justify-content: center;


}
.bgimage {
    position: relative;
    top: -271px;
    z-index: 1;
}
.textarea {
    position: relative;
    z-index: 100;
    text-align: center;
}
.scheduleStartRow {
    display: flex;
    width: 100%;
    margin: 0;
    flex-wrap: nowrap;
    flex-direction: row;
    align-content: center;
    justify-content: center;
}

.downloadFormRow, .m_downloadFormRow {
    display: inline-flex;
    margin-bottom: 40px;
    width:100%;
}

.downloadFormRow .formCol, .m_downloadFormRow .m_formCol {
    width: 50%;
    background: var(--Light-Grey, #F8F8F9);
    order: 1;
    padding: 100px 50px 50px;

}
/* deprecated 
.downloadFormRow .imgCol {
    width: 50%;
    order: 2;
}*/

.downloadFormRow .imgCol, .m_downloadFormRow .m_imgCol {
    width: 50%;
    order: 2;
    background-image: url(https://image.s7.sfmc-content.com/lib/fe2911717d64047b7c1479/m/1/58532885-e941-4950-a7bb-67cc3664c3eb.jpg);
    background-size: cover;
}

.downloadFormRow .formCol h3, .m_downloadFormRow .m_formCol h3 {
    color: var(--Dark-Blue, var(--Dark-Blue, #052049));
font-feature-settings: 'clig' off, 'liga' off;
font-family: helvetica neue,Helvetica,Arial,sans-serif;
font-size: 50px;
font-style: normal;
font-weight: 700;
line-height: 60px; /* 120% */
}

.downloadFormRow .formCol .bluePill a, .m_downloadFormRow .m_formCol .m_bluePill a {
    display: block;
}
.notForYouRow h2 {
    color: #052049;
    text-align: center;
    font-family: helvetica neue,Helvetica,Arial,sans-serif;
    font-size: 36px;
    font-style: normal;
    font-weight: 700;
    line-height: 46px;
}
.notForYouRow p {
    color: #052049;
text-align: center;
font-family: helvetica neue,Helvetica,Arial,sans-serif;
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 30px; 
margin: 10px 100px 40px 100px;
}
.textarea p {
    font-family: helvetica neue,Helvetica,Arial,sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 30px;
    letter-spacing: 0em;
    text-align: center;
}
input[type=text] {
    font-size: 20px;
    width: 95%;
    padding: 12px 20px;
    margin: 8px 0;
    box-sizing: border-box;
    height: 60px;
    border: solid 0 #9c9fa2;
    border-radius: 60px;
    background-color: #fff;
    -webkit-appearance: none;
}