@import url('etapestry.css');

* 
{
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box; 
}

body { font-family: Verdana,Geneva; font-size: 10pt; }

img { max-width: 100%; }
::placeholder { color: #777; }

.pageRegion .row { margin-left: 0; margin-right: 0; padding-bottom: 10px; }
.pageRegion, .pageBlock, .pageBlockElement { float: left; width: 100%; }

.publishedBody {margin:0;padding:0;height:100%;width:100%;background-color:transparent;}
#pageContent.hidden {display: none}
.publishedBody h1, .publishedBody h2, .publishedBody h3, .publishedBody h4, .publishedBody h5, .publishedBody h6, .publishedBody p { margin:0; padding:0; }
.publishedBody h1, .publishedBody h2, .publishedBody h3, .publishedBody h4, .publishedBody h5, .publishedBody h6 { font-weight: bold; }
.clear { clear:both; display:block; }
.bold { font-weight: bold; }
.displaynone { display:none; }

ul { margin: 0; }
li { min-height: 23px; }

.udf ul { list-style-type: none; margin-bottom: 0; }
#pageContent .udf h6.radioType, #pageContent .udf h6.multiSelectType, #ecFundSelect h6.radioType, #gift_amount_advanced h6.radioType { padding-top: 0 !important; padding-bottom: 2px !important; }
.udfDateField, .udfMonthDayField, .udfNumberField, .udfCurrencyField { max-width: 125px; }
#gift_amount_advanced ul, #ecFundSelectField ul, .modal-body ul { list-style-type: none; }
#ecFundSelectField ul li { padding-left: 6px; height: auto !important; }

#resultContent {margin:0;min-height:300px;}
#resultContent .regionTitle {display:block; width:100%;}
#resultContent .pageBlock .label {width:auto; font-size: 13px;}
#resultContent .pageRegion .pageBlock .shortMessage {font-weight:normal;}
#resultContent .messageBlock p {font-family:sans-serif; font-size: 15px !important; padding: 0 0 15px 0 !important;}
#resultContent .messageBlock p.disclaimer {font-size: 13px !important; padding-top: 5px !important;}
#resultContent .messageBlock p.vcSurvey a {text-decoration:none;}
#resultContent .messageBlock p.vcSurvey a:hover {text-decoration:underline;}
#resultContent .messageBlock {padding-top:20px;}
#resultContent .pageRegion .pageBlock .pageBlockElement .shortMessage {font-weight: normal; padding-left:5px;}
#resultContent .pageRegion .pageBlock .pageBlockElement h6 {width:100%;}
#resultContent .messageBlock .resultOrgName {font-weight:bold;}

.defaultFont {font-family:Verdana,Geneva;font-size:9pt;color:#000;}

#bottomLogos #blackbaudLogo {margin: 5px auto 10px auto; display: block;}
#bottomLogos #poweredByText {width: 100%; text-align: center; display: block; margin: auto;}

.publishedBody .pageBlockElement #amountField {border:none; cursor: not-allowed; max-width: 125px !important; padding-top: 3px; background-color: transparent;}
.publishedBody .pageBlockElement #amountField:focus {outline:none;}
.publishedBody .pageBlockElement #creditOnlyField {border:none;}

.publishedBody .ecWidget {padding: 5px 0 5px 0 !important; width: auto !important;}
#ecDonateOther input {float: none !important; width: 75px !important;}
#ecDonateOther .euroOtherAmt {text-align: right; padding-right: 5px;}
#ecDonateOther .otherAmtBtn {background-color: #fff; border: #fff; margin-left: 2px; width: 100px !important; height: auto !important;}
#pageContent #ecDonateOther .otherAmtBtn {color: #000 !important;}

#cardCVV2Field { width: 70px !important; min-width: 70px !important; max-width: 70px !important; }
#cardExpMonthField, #cardExpYearField { width: 70px !important; }
#cvv2infoLink { padding-left: 5px; padding-top: 7px; height: 27px; float: left; font-family: Helvetica, Verdana, sans-serif;}

.pageBlock #commentsBox { height: 80px; }
#ecMembershipWidget { padding: 0 !important; }

#giftAidSection { margin-bottom: 5px; }
#giftAidInput { width: 20px !important; margin: 2px 5px 0 0 !important; }

#ecDonateOther #euroCents {width: 35px !important;}
#ecDonateOther #decimalSeparator {margin: 0 1px 0 2px;}
#gift_amount_simple #decimalSeparator {margin: 7px 2px 0 2px; font-size: 15px; font-weight: bold; float: left;}

#gift_amount_simple #gift_amount_simpleField {max-width: 125px !important;}
#ecAdvancedDonationWidget #gift_amount_simple .euroOtherAmt {max-width: 75px !important; text-align: right; padding-right: 5px;}
#ecAdvancedDonationWidget #gift_amount_simple #euroCents {max-width: 40px !important;}

.nonFunctionalContent a img {border:none;}
#captchaContainer { margin: 0 auto 20px 0; width: 90% !important;}
#pageContent #label.multiSelectType { width: 100% !important;}

#ecEventTicketWidget .ticketDivider { margin: 15px 0 5px 0; float: left; width: 100%; border-color: #bbb; }
#ecEventTicketWidget .ticketQuantity input { width: 40%; }
#ecEventTicketWidget .ticketQuantityLabel { padding: 0; }
#ecEventTicketWidget .ticketMultiply { width: 60%; text-align: center; display: inline-block; padding-top: 5px; }
#ecEventTicketWidget #eventTicketHeader .ticketPrice, #ecEventTicketWidget #eventTicketHeader .totalsBox { padding-top: 0; }
#ecEventTicketWidget #eventTicketHeader h6#label { padding: 0 !important; text-decoration: underline; text-underline-offset: 4px; }
#pageContent #ecEventTicketWidget .ticketName { padding-right: 10px !important; }
#ecEventTicketWidget .ticketPrice, #ecEventTicketWidget .totalsBox { padding: 5px 0 0 0; }
#ecEventTicketWidget .finalTotalLabel { float: right; width: auto; }
#ecEventTicketWidget .ticketDesc { margin-top: 5px; }
#ecEventTicketWidget .totalsRow { padding-bottom: 5px; font-weight: 700; }
#ecEventTicketWidget .totalsRow #label { padding: 0 !important; }

.labelRequired::after { content: "*" }

#edhEvent { text-align: center; }
#edhEventUrl { text-decoration: none; }

#gcSuccess { padding: 25px; }
#gcSuccess a { text-decoration: none; }

.pageBlockElement input[type="text"] { float: left; margin: 0; padding: 2px 5px; width: 100%; height: 30px; border: 1px solid #bbb; background-color: #fff; }
.pageBlockElement select { float: left; margin: 0; padding: 2px 5px; width: 100%; height: 30px; border: 1px solid #bbb; background-color: #fff; }
.pageBlockElement input[type="text"]:hover:not(:focus), .pageBlockElement select:hover:not(:focus) { border: 1px solid #444; }
.pageBlockElement input[type="text"]:focus, .pageBlockElement select:focus, .pageBlockElement textarea:focus { outline: 1px solid #444; }
.pageBlockElement:not(.udf) input[type="checkbox"] { margin:0px 0 8px 11px;padding:2px; }
.pageBlockElement input[type="checkbox"] { float:left; }

.pageBlock textarea { padding: 2px 5px; height: 75px; width: 100%; border: 1px solid #bbb; background-color: #fff; resize: vertical; }
.pageBlock textarea:hover:not(:focus) { border: 1px solid #444; }
.pageBlock textArea#addressField { margin: 0; width: 100%; }
#pageContent input[type="radio"] { margin:0px 5px 5px 5px;padding-right:5px; width: auto; }
.pageBlockElement li .label { margin: 0; }
#pageContent label.input_button input[type=radio] { position: absolute; z-index: -1; top: 0; left: 0; width: 1px; height: 1px; }
#pageContent label.button { width: auto !important; margin: 0 10px 5px 0; }
#pageContent label.button div.text-center { padding: 12px 20px; font-weight: 400; }
#pageContent label.otherAmtLabel div.text-center { padding: 10px 15px 10px 10px; }
#pageContent h6 { float:left; width: 100%;}
.pageBlock #label, #pageContent .pageBlockElement .currencySymbol { padding: 7px 0 5px 0 !important; }
body #pageContent .pageBlockElement .currencySymbol { min-height: 25px !important; margin-left: -50px; width: 50px; padding-top: 6px !important; font-size: 15px !important; }
body #pageContent .pageBlockElement #amountField, body #pageContent #gift_amount_advancedField { font-size: 10pt !important; }
.pageBlockElement { width: 100%; }
#pageContent ul { padding-left: 20px; }
.messageBlock p { font-size: 10pt; }
#submitSection { margin-bottom: 70px; }
#submitSection input { display: block; margin: 0; width: 100%; border: none; border-radius: 5px; padding: 12px 12px; }
#submitSection input:focus { outline: none; }
#submitSection a { width: 100%; text-align: center; display: block; padding: 10px 0; }
#pageContent { float: left; width: 100%; }
#contentBorder { float: left; }
.pageRegion { margin-bottom: 5px; }
#newUdfRegion:empty { margin-bottom: 0; }
#nameFormatField ul { padding-left: 0; margin-bottom: 0; }
#nameFormatField ul li::marker { content: ''; }
.noLogoImage #etapAppSiteTitle #headerText:empty { height: 10px; }
#bgBottom .noLogoImage #etapAppSiteTitle #headerText:empty { height: 5px; }

.radioLabel, .checkboxLabel { font-weight: normal; }

label.radioNew { display: block; margin-bottom: 2px; }
label.radioNew:hover { cursor: pointer; }
label.radioNew input[type=radio] { position: absolute; top: 0; left: 0; width: 1px; height: 1px; opacity: 0; }
label.radioNew div.radioLabel { padding: 6px 5px 5px 30px; position: relative; float: left; width: 100%; }
label.radioNew div.radioLabel::before,
label.radioNew div.radioLabel::after { position: absolute; content: " "; border-radius: 15px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
label.radioNew div.radioLabel::before { top: 5px; left: 0; z-index: 100; width: 20px; height: 20px; background-color: #fff; border: 1px solid #bbb; }
label.radioNew:hover div.radioLabel::before { border-color: #000; }
label.radioNew div.radioLabel::after { z-index: 101; width: 14px; height: 14px; }
label.radioNew input[type=radio]:checked + div.radioLabel::after { background-color: #000; top: 8px !important; left: 3px !important; }
label.radioNew div.otherAmtLabel { padding-top: 0; }

label.checkboxNew { display: block; margin-bottom: 0; }
label.checkboxNew:hover { cursor: pointer; }
label.checkboxNew input[type=checkbox] { position: absolute; top: 0; left: 0; width: 1px; height: 1px; opacity: 0; }
label.checkboxNew div { padding: 6px 5px 5px 30px; position: relative; float: left; width: 100%; }
label.checkboxNew div::before,
label.checkboxNew div::after { position: absolute; content: " "; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
label.checkboxNew div::before { top: 5px; left: 0; z-index: 100; width: 20px; height: 20px; background-color: #fff; border: 1px solid #bbb; }
label.checkboxNew:hover div::before { border-color: #000; }
label.checkboxNew div::after { z-index: 101; width: 0 !important; overflow: hidden; }
label.checkboxNew input[type=checkbox]:checked + div::after { width: 15px !important; border-bottom: 6px solid #000; border-right: 6px solid #000; transform: rotate(45deg); top: -2px !important; left: 5px !important; height: 25px !important; }

.col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12,
.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12,
.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12,
.col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
  padding-left: 0 !important;
}

.col-sm-8, .col-xs-12 { padding-right: 0 !important; }

@media only screen and (min-width: 668px)
{
  .pageBlockElement input[type="text"], .pageBlockElement:not(.udf) input[type="checkbox"], .pageBlockElement select { margin:0;}
}

@media only screen and (max-width: 480px)
{
  #ecEventTicketWidget .ticketQuantity { padding-right: 0; }
  #ecEventTicketWidget .ticketPrice { padding-left: 10px !important; }
  
  .pageRegion h1.regionTitle { font-size: 12pt !important; }
  .nonFunctionalContent img { width: 100% !important; height: auto !important; }

  /* iPhone zoom problem fix */
  @media screen and (-webkit-min-device-pixel-ratio:0)
  {
    #pageRoot .pageRegion .pageBlockElement textarea:focus, #pageRoot .pageRegion input[type="text"]:focus:not(.otherAmtBtn) { font-size: 16px !important; background: #eee !important; }
    #pageRoot .pageRegion .pageBlockElement select:focus { font-size: 18px !important; background: #eee !important; }
  }
}

@media only screen and (max-width: 667px) 
{
  .nonFunctionalContent img { height: auto !important; }
  #pageContent .pageBlock #label, #pageContent .publishedBody, #pageContent .pageBlockElement select, #pageContent #gift_amount_advancedField,
  #pageContent #amountField, #pageContent .currencySymbol, #pageContent #giftAidSection, #pageContent .ticketPrice, #pageContent .ticketMultiply,
  #pageContent .totalsBox, #pageContent #finalTotalValue, #pageContent .pageBlock input[type="text"]:not(.otherAmtBtn), #pageContent .pageBlock textarea { font-size: 10pt !important; }
}

@media only screen and (max-width: 767px)
{
  #pageContent #ecEventTicketWidget .ticketName { padding-bottom: 5px !important; }
  .pageBlock #label { padding: 2px 0 !important; }
  body #pageContent .pageBlockElement .currencySymbol { width: auto !important; margin-left: 0 !important; padding: 1px 0 0 0 !important; }
  body #pageContent #ecAdvancedDonationWidget .pageBlockElement .currencySymbol { padding-top: 6px !important; }
  #pageContent #amount.row { padding-bottom: 5px; }
  #pageContent #amountField { height: 20px; }
}

@media only screen and (max-width: 375px)
{
  #recaptcha_widget_div #recaptcha_area, #recaptcha_area #recaptcha_table { width: 100% !important; }
  #recaptcha_challenge_image { margin: 0 !important; width: 100% !important; height: auto !important; }
  #recaptcha_response_field { margin: 0 !important; width: 100% !important; height: auto !important; }
  .recaptchatable #recaptcha_image { margin: 0 !important; width: 100% !important; height: auto !important; }
}