.elementor-kit-8{--e-global-color-primary:#0C71C3;--e-global-color-secondary:#231B1B;--e-global-color-text:#7A7A7A;--e-global-color-accent:#EAC435;--e-global-color-67da3dc:#3FA2F3;--e-global-color-4e6090d:#EA7AF4;--e-global-color-4e96617:#0DC2D3;--e-global-typography-primary-font-family:"Nunito Sans";--e-global-typography-primary-font-size:20px;--e-global-typography-primary-font-weight:900;--e-global-typography-secondary-font-family:"Averia Libre";--e-global-typography-secondary-font-size:20px;--e-global-typography-secondary-font-weight:700;--e-global-typography-secondary-font-style:oblique;--e-global-typography-text-font-family:"Muli";--e-global-typography-text-font-weight:700;--e-global-typography-accent-font-family:"Archivo Narrow";--e-global-typography-accent-font-weight:500;--e-global-typography-8d85c2e-font-family:"Candal";--e-global-typography-8d85c2e-font-weight:600;background-color:transparent;background-image:linear-gradient(135deg, #EBF2FA 0%, #FFFFFF 100%);}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-container{--container-max-width:1140px;}.elementor-widget:not(:last-child){margin-bottom:20px;}.elementor-element{--widgets-spacing:20px;}{}h1.entry-title{display:var(--page-title-display);}.elementor-kit-8 e-page-transition{background-color:#FFBC7D;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-container{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-container{--container-max-width:767px;}}/* Start custom CSS */.site-main .page-header h1 {
    color: #0c71c3;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 900;
    margin: auto;
    max-width: 80%;
    padding: 20px;
    text-align:center;
}

.contribution-description {
    color: #7a7a7a;
    font-family: 'Mulish', sans-serif;
    font-weight: 700;
    padding: 0px 20px 40px 0px;
    text-align: center;
}

.donation-page-image {
    height: 300px;
    width: 300px;
    float: left;
    padding: 20px;
}

span.dot {
  height: 25px;
  width: 25px;
  border-radius: 50%;
  display: block;
  margin:auto;
  text-align:center;
}

span.dot-avail-green {
    background-color: #78bc61;
}

span.dot-avail-yellow {
    background-color: #eac435;
}

span.dot-avail-red {
    background-color: #d66853;
}

span.spots-notice {
    display: block;
    text-align: center;
}

span.sold-out-icon {
    color: #fff !important;
	background: #bbb;
	padding: 12px 24px;
	border-radius: 3px;
	display: inline-block;
	font-size: 1.2em;
	
}

#crm-main-content-wrapper {
    margin: auto;
    max-width: 80%;
}

/* Clean up for mobile. */
@media only screen and (min-width: 800px) {
 #crm-main-content-wrapper {
    margin: auto;
    max-width: 100%;
 }   
}

/* clean up the CiviCRM "not you" message */
.crm-not-you-message {
    margin-bottom: 40px;
    width: 300px;
}

/* lines up top of all new buttons */
#priceset.crm-section  div.content { 
    padding-top: 0px;
}  

/* prevents various sections from overlapping or wrapping weirdly if the description includes
images or divs, not a bad candidate for basic Civi css */
#crm-container.crm-public .crm-section, .crm-section {
    display: flow-root;
    
}


/* Set container width to fix confirmation screens. */
#crm-container.crm-public {
    margin: auto;
    max-width: 80%;
}

.crm-contribution-page-id-1 div.crm-title, 
.crm-contribution-page-id-1 #pricelabel {
    display: none;
}

/* Styling the buttons */
.crm-contribution-page-id-1 .price-set-option-content input[type="radio"],
.crm-contribution-page-id-1 .price-set-option-content input[type="radio"] + label,
.crm-contribution-page-id-1 .price-set-option-content input[type="checkbox"],
.crm-contribution-page-id-1 .price-set-option-content input[type="checkbox"] + label {
    float:left;
    width:160px;
    margin:4px;
    background-color:#D8ECFD;
    border-radius:4px;
    border:0px solid #D0D0D0;
    overflow:auto;      
    padding:13px 6px;
    
}

/* Styling the labels */
.crm-contribution-page-id-1 .price-set-option-content label,
.crm-contribution-page-id-1 .price-set-option-content label span,
.crm-contribution-page-id-1 .price-set-option-content input[type="checkbox"] + label {
    text-align:center;
    /* font-size: 32px; */
    display:block;
    
}

/* make Total Amount same size as button text */
#crm-container.crm-public .calc-value { 
    font-size: 32px;}

/* Alternate text styles for the amounts, if both labels and amounts are shown for a field
(don't want everything to be large) */
.crm-contribution-page-id-1 .price-set-option-content input[type="radio"] + label .crm-price-amount-amount {
    font-size: 16px;
    
}

/* puts the normal input controls out of sight */
.crm-contribution-page-id-1 .price-set-option-content input[type="radio"],
.crm-contribution-page-id-1 .price-set-option-content input[type="checkbox"],
.crm-contribution-page-id-1 span.crm-price-amount-label-separator {
    position:fixed;
    top:-50px;}

/* Style for hovered item */
.crm-contribution-page-id-1 .price-set-option-content input[type="radio"]:hover + label,
.crm-contribution-page-id-1 .price-set-option-content input[type="radio"]:hover + label .crm-price-amount-amount,
.crm-contribution-page-id-1 .price-set-option-content input[type="checkbox"]:hover + label {
    background-color:#B1D9FB;
    
}

/* Style for selected item */
.crm-contribution-page-id-1 .price-set-option-content input[type="radio"]:checked + label,
.crm-contribution-page-id-1 .price-set-option-content input[type="radio"]:checked + label .crm-price-amount-amount,
.crm-contribution-page-id-1 .price-set-option-content input[type="checkbox"]:checked + label {
    background-color:#0c71c3;
    color:#fff !important;}

/* Fieldset styling. */
fieldset {
    margin-top: 1em;
}

legend {
    color: #0c71c3;
    font-size: 1.2rem;
    font-weight: 600;
}

/* Style credit card icons. */
.crm-credit_card_type-icons {
    background-color: #fff;
    border-left: 5px solid #0dc2d3;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin: 10px;
    padding: 20px;
}

.crm-credit_card_type-icons > a {
    font-size: 1.1rem;
    font-weight: 500;
    padding: 14px;
}

/* Style dropdown questions. */
.select2-container {
    margin-bottom: 10px !important;
}


.crm-form-submit {
    margin-top: 20px;
}

.crm-submit-buttons {
    float: right;
    margin-bottom: 40px;
}


.contribution_amount-section > .label > label {
    color: #0c71c3;
    font-size: 1.5rem;
    font-weight: 600;
}

/* Style the error message. */

div.messages.crm-error {
    background: #eac435;
    border: 1px solid #eac435;
    box-shadow: 1px 1px 1px #aaaaaa;
    margin-bottom: 10px;
    margin-top: 10px;
    padding: 10px;
    border-radius: 5px;
}

span[class="crm-error"] {
  background: #eac435;
  padding: 10px;
  border-radius: 0;
  position: relative; 
  display: inline-block;
  box-shadow: 1px 1px 1px #aaaaaa;
  margin-top: 10px;
}

span[class="crm-error"]:before {
    content: ''; 
    width: 0; 
    height: 0; 
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #eac435;
    position: absolute; 
    top: -10px; 
}

/* Style the "Review your Contribution" block. */
.crm-contribution-confirm-form-block, .crm-contribution-thankyou-form-block {
    margin-top:20px;
}

div.crm-group>div.header-dark {
    color: #0c71c3;
    font-size: 1.2rem;
    font-weight: 600;
}

div.crm-contribution-confirm-form-block>div.crm-group {
    margin-top: 20px;
}

div.crm-contribution-confirm-form-block>div.messages {
    margin-top: 20px;
}

fieldset.crm-profile-view>div.header-dark {
    color: #0c71c3;
    font-size: 1.2rem;
    font-weight: 600;
}

fieldset.crm-profile-view>div>.label {
    font-weight: 600;
}

/* Style the "Confirmation Screen" */
div.crm-contribution-thankyou-form-block>div.crm-group, div.crm-contribution-thankyou-form-block>div.help {
    margin-top: 20px;
}



/* Styling for Event Registration Screens 
 *
 * Prefix everything with .crm-event-register-form-block
 * so as not to bleed into other areas of the site.
 */

.crm-event-register-form-block .tickets-section,
.crm-event-register-form-block .donation-section {
    display: flex;
    flex-direction: row;
    padding: 10px 4px;
    white-space: nowrap;
}

.crm-event-register-form-block .donation-section {
    padding-top: 0px;
}

.crm-event-register-form-block .tickets-section > .label,
.crm-event-register-form-block .donation-section > .label{
    display: inline-block;
    font-weight: bold;
}

.crm-event-register-form-block .tickets-content,
.crm-event-register-form-block .donation-content {
    display: inline-block;
}

.crm-event-register-form-block label.crm-inline-error {
    background: #eac435;
    border: 1px solid #eac435;
    box-shadow: 1px 1px 1px #aaaaaa;
    display: inline;
    margin-bottom: 10px;
    margin-top: 10px;
    padding: 10px;
    border-radius: 5px;
}

.crm-event-register-form-block .tickets-content > .price-field-amount,
.crm-event-register-form-block .service_fee-section > .label,
.crm-event-register-form-block .donation-section .price-field-amount {
    display: none;
}

.crm-event-register-form-block .service_fee-content {
    padding-bottom: 40px;
}

.crm-event-register-form-block .service_fee-content .crm-price-amount-label {
    font-weight: bold;
    padding: 0px 4px;
}

.crm-event-register-form-block .service_fee-content .crm-price-amount-amount {
    margin-left: 1em;
}

.crm-event-register-form-block .service_fee-content #service-fee-description {
    font-size: .8em;
    padding: 0px 4px;
}

.crm-event-register-form-block .donation-tag-line {
    font-weight: bold;
}

.crm-event-register-form-block .section-pricesetTotal {
    display: flex;
    flex-direction: row;
    padding-top: 10px;
    white-space: nowrap;
}

.crm-event-register-form-block .section-pricesetTotal #pricelabel,
.crm-event-register-form-block #amount-sum-total {
    display: inline-block;
}

/* Event confirmation screen styling. */

.crm-event-confirm-form-block .crm-group,
.crm-event-confirm-form-block .continue_message-section {
    padding-top: 20px;
}

a[title="View complete event information."] {
    display:none;
}

/* Thank you for your order screen styling. */

.crm-event-thankyou-form-block .crm-group {
    padding-top: 10px;
    padding-bottom: 10px;
}

.crm-event-thankyou-form-block .event_info_link-section,
.crm-event-thankyou-form-block .iCal_links-section {
    display: none;
}
.pointer {cursor: pointer;}/* End custom CSS */