﻿:root {
    --body-font-compressed: 'trade-gothic-next-compressed', 'Libre Franklin', system-ui, -apple-system, 'Segoe UI', 'Roboto', 'Ubuntu', 'Cantarell', 'Noto Sans', sans-serif;
    --body-font: 'trade-gothic-next', 'Libre Franklin', system-ui, -apple-system, 'Segoe UI', 'Roboto', 'Ubuntu', 'Cantarell', 'Noto Sans',
    sans-serif;
    --ros-blue: #062a60;
    --ros-pink: #ff00c2;
}

body h1 {
    font-family: var(--body-font-compressed) !important;
}

body h2 {
    font-family: var(--body-font-compressed) !important;
}
body h4, #singular-options h4, #monthly-options h4 {
    font-family: var(--body-font-compressed) !important;
}

/* Override bariolregular from main.min.css - higher specificity needed */
body h3,
h3, .individual__content__pay h3, .small-contnet .box-detail h3 {
    font-family: var(--body-font-compressed) !important;
    margin-bottom: 15px !important
}

body p,
p, body a, body .btn, .individual .ftr p, .small-contnet .ftr ul li a {
    font-family: var(--body-font) !important;
}

.small-contnet .ftr p {
    font-weight: normal !important;
}

.small-contnet .ftr ul li a {
    font-weight: normal !important;
}

body .btn {
    font-size: 17px !important;
    line-height: 21px !important;
    height: 41px;
    display: flex;
    align-items: center;
    justify-content: center;
}

body .btn:hover {
    text-decoration: underline !important;
    background-color: #062a60 !important;
}

body p,
p, body a {
    line-height: 1.2 !important;
}

.donations-logo svg {
  height: 92px;
  width: 210px;
}

.become-member__grid h3 {
    font-family: var(--body-font-compressed) !important;
    font-size: 22px !important;
    margin-bottom: 10px !important
}

.become-member__info h3 {
    font-family: var(--body-font-compressed) !important;
    font-size: 18px !important;
    padding-top: 15px !important
}

.text ul {
    margin-bottom: 40px !important
}

.become-member__grid .boxs ol li > button .info h4 {
    font-size: 21px !important
}

.box__input.box__input--select {
    padding-left: 0px
}

.pay-card__content .box__input.box__input--select {
    padding-left: 15px
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}

.dob input[type=number] {
    text-align: center !important
}

.done h4 {
    font-weight: bold !important
}

.active h4 {
    font-weight: bold !important
}

p.smallText {
    font-size: 18px !important
}

.individual__content__pay {
    padding-top: 0px !important
}

p.radio-label {
    font-weight: bold !important;
    font-size: 18px !important
}

.accordion h3 {
    margin-bottom: 0px !important
}

.individual__content__pay__radio .content p {
    font-size: 18px !important;
    line-height: 24px !important
}

.individual__content__pay__radio h4 {
    font-size: 21px;
}

.giftaid {
    margin-top: 30px !important
}

.individual__content__pay__giftaid p {
    font-size: 18px !important
}

.dd-confirmation h3 {
    margin-top: 10px !important
}

.dd-confirmation .box {
    padding-bottom: 0px !important
}

.dd-confirmation p {
    font-size: 18px !important
}

.summary-intro {
    margin-top: 30px !important
}

.expandable-checkboxes ul {
    padding-top: 0px !important
}

.box__input h4, .box__input p {
    padding-left: 10px !important
}

.hcp-work.box__input {
    padding-left: 15px;
}

.individual__content a {
    font-weight: bold !important
}

.hcp-welcome-pack {
    padding-bottom: 0px !important
}

.currencyinput {
    position: relative;
    left: -112px;
    top: 13px;
    font-size: 18px;
}

.donations.individual__content {
    padding-left: 20px !important;
    padding-right: 20px !important
}

.individual__content .pay-price__radio label .content .fx .image {
    width: 30% !important
}

.individual__content .pay-price__radio label .content .fx .text p {
    padding: 5px 5px 0 10px !important
}

.box__input.full-drop {
    padding-right: 0px !important
}

.small-contnet .individual {
    max-width: 480px !important
}

.donations-logo {
    padding-bottom: 30px !important
}

.choices__list--single {
    padding: 6px 16px 4px 2px
}

.individual__content .pay-price__radio label .content .fx {
    padding: 8px !important
}

.box__input.box__input--select {
    padding-bottom: 5px !important
}

.individual__head ol li.done h3 {
    color: #fff !important;
    border: 1px solid var(--ros-pink) !important
}

.individual__head ol li.done h4 {
    color: var(--ros-pink) !important
}

.individual__head ol li.active h3 {
    color: var(--ros-pink) !important;
    border: 1px solid var(--ros-pink) !important
}

.individual__head ol li.active h4 {
    color: var(--ros-pink) !important
}

.individual__head ol li.done:after {
    border: 1px solid var(--ros-pink) !important
}

.label-checkbox a {
    text-decoration: underline !important
}

.container-header h3 {
    font-size: 24px;
    line-height: 1.2;
    color: var(--ros-blue);
}
