@charset "UTF-8";
/* Trilogy Interactive Salsa Contribution Page Stylesheet
   Assumes the content is wrapped with #content in order to overwrite default Salsa styles
*/

/* Core Styles */



#content {
  padding: 10px;
  background-color: #fff;
  text-align: left;
}

/*
#content .salsa .supporterInfo .diaFields {
  margin-top: -20px;
}

#content .salsa #honorof {
  margin-top: 20px;
}
*/

#donation_amount, #credit_card_information {padding-top: 10px;}


.hidden { display: none; }
.unhidden { display: block; }


/* Typography */

fieldset {border: 0;}

#content .salsa legend { 
  background-color: #002950;
  text-transform: uppercase; 
  border-bottom: 1px solid #333333; 
  padding: 2px 8px; 
  font-size: 20px; 
  text-align: left; 
  text-shadow:-1px -1px 0 black;
  clear: both; 
  width: 300px;
  color: #EDEDED;
}


/* Formatting */


#PageHeadline h1 {
	line-height: 30px;
}



#cardinfo {
	margin-top: 15px;
}

#cardtypes li {  list-style-type:none; margin-right: 15px; margin-bottom: 8px; float: left; }

#cardtypes {display: inline;}

.eligibilitydisclaimer {
    font-size: 12px;
    font-weight: 300;
    margin-top: 5px;}

.required {color: #CC0000;}

/* Inputs */

#content .salsa input, #content .salsa select {
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	border: 1px solid #CCCCCC;
	font-family: inherit;
	font-size: 14px;
    font-weight: 300;
    height: 21px;
	letter-spacing: 0.2px;
    padding: 4px;
    width: 160px;
}

#content .salsa input:focus, #content .salsa select:focus {
outline: none;
border: 1px solid #ccc;
-moz-box-shadow: #85ADAD 0 0 10px inset !important;
-webkit-box-shadow: #85ADAD 0 0 10px inset !important;
box-shadow: #85ADAD 0 0 10px inset !important; }

#content .salsa select {height: 28px;}
#content .salsa #ccExpMonth, #content .salsa #ccExpYear {width: 50px;}
#content .salsa #donation_amount #donation_pay_periods, #content .salsa #donation_amount #donation_term {width: 115px;}


#content .salsa #donation_amount input {
  height: 14px;
  width: 14px;
}
#content .salsa #donation_amount #otheramt {width: 70px; height: 24px; font-size: 18px;}

#content .salsa textarea {
  -moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	border: 1px solid #CCCCCC;
	font-family: inherit;
	font-size: 14px;
    font-weight: 300;
    width: 225px;
    }


#cc_number {width: 190px !important; }

#CVV2, #amountOther {width: 45px !important; }

#zip_code {width: 95px !important; }

#cc_month, #cc_year {width: 75px !important; }

#state_select, #cc_month, #cc_year { 
	-moz-border-radius: 5px 5px 5px 5px; 
	border-radius: 5px 5px 5px 5px; 
	-webkit-border-radius: 5px 5px 5px 5px;
    border: 1px solid #CCCCCC;
    font-family: inherit;
    font-size: 14px;
    font-weight: 300;
    height: 30px;
    letter-spacing: 0.2px;
    padding: 4px;
    width: 190px;
}

#state_select:focus, #cc_month:focus, #cc_year:focus {
	-moz-box-shadow: #85ADAD 0 0 10px inset !important;
	-webkit-box-shadow: #85ADAD 0 0 10px inset !important;
	box-shadow: #85ADAD 0 0 10px inset !important;
}

.checkbox {margin: 3px 8px 3px -22px;}

#eligibilitycheckL {margin-left: 22px;}

.cardtypes_js input {display: none;}

#donation_amounts input, #donation_recurring input, #confirm_eligibility input, #submit {width: auto; height: auto;}

/* Labels */


#content .salsa label, .spanLabel {
    display: block;
	clear: both;
    font-size: 14px;
	color: #444;
    margin-top: 5px;
	padding-left: 3px;
}

#donation_recurring .spanLabel {display: inline;}

td label {padding-left: 0;}

#donation_amounts label, #donation_amount_other label {
    font-size: 14px;
	color: #000;
    font-weight: 300;
}


#donation_recurring label {font-size: 13px; color: #000; font-weight: 300;}

.selectedAmount + span, .selectedAmount + span label { font-weight: bold !important; }

label.cc_image {display: block; width: 64px; height: 39px;}

label#visaL {background-image: url('https://assets.trilogyinteractive.com/shared/img/cc_type_visa.png'); background-repeat: no-repeat; }
label#mastercardL {background-image: url('https://assets.trilogyinteractive.com/shared/img/cc_type_mastercard.png'); background-repeat: no-repeat; }
label#amexL {background-image: url('https://assets.trilogyinteractive.com/shared/img/cc_type_amex.png'); background-repeat: no-repeat; }

label.cc_image:hover {background-position: 0 -39px;}
label.cc_image:active {background-position: 0 -79px;}
label.cc_selected {background-position: 0 -39px;}
label.cc_unselected {background-position: 0 -119px;}

label:hover {cursor: pointer; color: #003366 !important;}

.amountError {color: rgb(215, 32, 39); font-size: 12px; font-weight: bold; margin-left: 240px; margin-right: 0pt; margin-top: -40px; padding: 4px 4px 4px 40px; position: absolute; width: 130px; }

.ccTypeError {color: rgb(215, 32, 39); font-size: 12px; font-weight: bold; margin-bottom: 20px; margin-right: 120px; margin-top: 5px; padding: 4px 4px 4px 40px; width: 172px; }

#cardtypes li input {width: 60px} /* Fixes layout for non-JS browsers */

/* Hidden Explainers */

.whatsthis a {    
	font-size: 12px;
    font-weight: bold;
	-moz-border-radius: 18px 18px 18px 18px;
	-webkit-border-radius: 18px;
	border-radius: 18px;
	background: #888;
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#BBB), to(#888));
    background: -moz-linear-gradient(center top , #BBB, #888) repeat scroll 0 0 transparent;
    color: #FFFFFF;
    display: inline;
    margin-left: 3px;
    padding: 2px 6px;
    text-decoration: none;
}
    
#clairescrewexplain, #cvv2explain, #employmentexplain {
	-moz-box-shadow: 0 0 4px #ddd; 
	-webkit-box-shadow: 0 0 4px #ddd; 
	box-shadow: 0 0 4px #ddd; 
	-moz-border-radius: 4px 4px 4px 4px; 
	-webkit-border-radius: 4px 4px 4px 4px; 
	border-radius: 4px 4px 4px 4px;
    background: none repeat scroll 0 0 #F9F9F9; 
	font-size: 12px; 
	color: #666; 
	margin-top: 5px; 
	padding: 8px;
}

#employmentexplain {
	margin-top: 35px;
}



/* Submit Button */




#content .salsa #submitContribution, #content .salsa input#sendTargeted {
background: url('https://assets.trilogyinteractive.com/shared/img/alert-overlay.png') repeat-x;
display: inline-block;
padding: 10px 20px;
color: #fff;
text-decoration: none;
line-height: 1;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-moz-box-shadow: 0 1px 3px #999;
-webkit-box-shadow: 0 1px 3px #999;
text-shadow: 0 -1px 1px #222;
border: none !important;
position: relative;
cursor: pointer;
-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
font-size: 18px;
font-weight: bold !important;
padding: 9px 16px 9px;
background-color: #CC0000;
text-transform: uppercase;
margin-bottom: 10px;
height: 40px;
width: auto;
}

#content .salsa #submitContribution:hover, #sendTargeted:hover { background-color: #990000;
 }

#content .salsa #submitContribution:active, #sendTargeted:active { top: 1px; }

#content .salsa #submit p, #content .salsa #salsaDonationFooter p {font-style: italic;}

#content .donation #submit {width: 100%;}

.securityseal {padding: 0 8px 5px 0; float: left;}

.securedisclaimer {font-size: 11px !important; float: left;}

.submitRow {clear: both; text-align: center;}

.reqExplainer {text-align: center;}


/* Error Messages */

label.error {display: inline; border: 1px solid;
margin: 10px 0px;
padding:15px 10px 15px 50px;
background-repeat: no-repeat;
background-position: 10px center;
color: #D8000C;
background-color: #FFBABA;
background-image: url('https://assets.trilogyinteractive.com/shared/img/validate_error.png');
}

label.error {  float: right;
    margin: 0;
    padding: 4px 4px 4px 40px;
    width: 33%;
font-size: 12px;}

.message, div.error {border: 1px solid; font-weight: bold; padding-bottom: 15px; text-align: center; color: rgb(216, 0, 12); background: none repeat scroll 0% 0% rgb(255, 186, 186); width: 70%; margin-right: auto; margin-left: auto; margin-bottom: 15px; padding: 5px;}

input.error, #state_select.error, #cc_month.error, #cc_year.error { -moz-box-shadow: #C11B17 0 0 10px inset;
-webkit-box-shadow: #C11B17 0 0 10px inset;
box-shadow: #C11B17 0 0 10px inset;
 }
 
 #result_message {
	 display: none;
	 text-align: center;
 }
 

#RapidSSL {float: left; clear: left; margin: 20px 0 0 13px; padding: 0 10px 10px 0;}