@CHARSET "UTF-8"; /* CSS Stylings */

:root {
--button-bg-color: #02a95c; 
--main-bg-color: #FFFFFF;
--button-radius: 4px;
--box-radius: 4px;	
--primary-text-color: #000000;
--button-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
}

body {
background-color: var(--main-bg-color);
}

.main aside {
background-color: #FFFFFF;
color: rgb(0,0,0);
padding: 10px 1%;
border: 1px solid;
border-radius: var(--box-radius);
}

nav {
bottom: 20px;
}

#amount {
background: none;
color: #000000;
border: 1px solid;
border-radius: 4px;
margin-left: 20px;
padding: 10px;
font-family: Roboto,Noto,sans-serif;
font-weight: 700;
font-size: 23px !important;
}

#amount-element input#amount {
color: #000000;
}

.amount_option {
background: none;
border: 1px solid;
}

.amount_option.active {
color: inherit;
background: #e6e1e5;
border-radius: var(--button-radius);
}

input#amount::placeholder {
color: #B3261E;
}

input#amount {
outline: none;
}

input[type=text] {
color: var(--primary-text-color);
border-top-style: hidden;
border-right-style: hidden;
border-left-style: hidden;
border-bottom: 1px solid #B7B7B7;
}

select {
border-top-style: hidden;
border-right-style: hidden;
border-left-style: hidden;
border-bottom: 1px solid #B7B7B7;
}

select#cc_year,
select#cc_month {
font-size: 1.2em;
}

input[type=text]:focus,
select:focus {
border: none;
border-bottom: 1px solid #B7B7B7;
box-shadow: none;
outline: none;
}

.personal_details {
margin-bottom: 50px;
}

.payment-personaldetails-yourdetails {
font-weight: 700 !important;
}

.main article h1 {
font-size: 2em;
text-transform: unset;
}

.main article h2 {
margin: 35px 0 10px;
font-weight: 700;
}

a.add-card {
height: 40px;
margin: 0;
color: #FFFFFF;
width: auto;
text-align: center;
font-size: 16px;
padding: 11px 40px;
font-weight: 700;
text-decoration: none;
text-transform: uppercase;
background-color: var(--button-bg-color);
}

.card {
border-radius: var(--box-radius);
}

h3.campaign-title {
font-size: 24px;
text-transform: capitalize;
padding-bottom: 20px;
}

.main aside h3 {
margin: 0 !important;
}

.main aside p {
margin: 1em 0 0 0 !important;
}

.campaign-donate-button paper-button {
border: 1px solid;
border-radius: var(--button-radius);
color: #000000 !important;
margin-bottom: 18px;
}

.footer-container {
background-color: var(--main-bg-color);
}

.main_footer_left,
.main_footer_right,
.main_footer_right a,
#login_link {
color: var(--primary-text-color);
}

a, a:link, a:visited {
color: var(--primary-text-color);
}

.main article #submit,
.main article #submit:hover,
.main article #back_button:hover,
.main article .back_button,
.main article .back_button:hover {
color: #FFFFFF;
background-color: var(--button-bg-color);
border: none;
text-transform: uppercase;
}

.main article #submit,
a.add-card {
color: #FFFFFF;
border-radius: var(--button-radius);
box-shadow: var(--button-shadow);
}

span.label, span.label_postcode {
font-size: 1.2em;
font-weight: 400;
}

tr#previous_details_email,
tr#previous_details_mobile,
tr#previous_details_dob {
color: #767676 !important;
}

tr#previous_details_amount {
height: 40px;
}

/*Tables*/

th {
min-width: 90px;
height: 50px;
border-bottom: 1px solid #000000;
font-weight: 500;
text-transform: uppercase;	
}

tr {
height: 52px;
}

table#payor-card-list, 
table#payor-list, 
table#payor-previous-payments, 
table#payor-recurring-payment-list {
margin-bottom: 20px;
}