• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23
• 24

// Lightbox
var att_config = {
  // =========================== USER DEFINED CONFIGURATION ===========================
  // Use the main title to grab attention. Try to keep it under 40 characters!
  title: "2x the Impact for Giving Tuesday!",
  // The sub title should entice your customer. Keep it short and sweet under 80 characters.
  subtitle: "A generous donor is matching gifts of $100 or more, up to $5,000 for today ONLY!",
  // Customize the link that closes the lightbox. Keep it under 30 characters.
  declineText: "NO THANKS",
  // Host your image and place a link to it here. The image should be clear and concise.
  // Try to keep the dimensions to 400px wide x 500px high.
  imageUrl: "https://s3.amazonaws.com/files.ccf.org/prod/s3fs-public/2019-11/2019-Giving-Tuesday-V2-500x400.png",
  // The button text should provide clear instructions. Keep it under 30 characters for maximum impact.
  buttonText: "DONATE NOW",
  // Once the customer has clicked, where do you want to redirect them?
  buttonLink: "https://secure2.convio.net/asco/site/Donation2?idb=1233128280&df_id=4543&mfc_pref=T&4543.donation=form1",
  // Time delay before the lightbox is shown, in seconds. Put a 0 to show the lightbox immediately, false to never show.
  delay: 2,
  // Set to true to close lightbox when the area outside the lightbox is clicked.
  clickBackgroundToClose: true
  // =========================== END USER DEFINED CONFIGURATION ===========================
};
(function(){"use strict";var title=null!=att_config.title&&att_config.title?att_config.title:"",subtitle=null!=att_config.subtitle&&att_config.subtitle?att_config.subtitle:"",buttonText=null!=att_config.buttonText&&att_config.buttonText?att_config.buttonText:"",buttonLink=null!=att_config.buttonLink&&att_config.buttonLink?att_config.buttonLink:"",declineText=null!=att_config.declineText&&att_config.declineText?att_config.declineText:"",template='\n<div id="att_lightbox">\n  <div class="att_lightbox_background"></div>\n  <div class="att_popup">\n    <div class="att_lightbox_left">\n    </div>\n    <div class="att_lightbox_right">\n      <div class="att_lightbox_right_contents">\n        <h1 class="att_lightbox_header">'+title+'</h1>\n        <p class="att_lightbox_subhheader">'+subtitle+'</p>\n        <a href="'+buttonLink+'" class="att_lightbox_button" rel="nofollow noopener">'+buttonText+'</a>\n        <a id="att_lightbox_close" href="#">'+declineText+"</a>\n      </div>\n    </div>\n  </div>\n</div>\n",bgImage=null!=att_config.imageUrl&&att_config.imageUrl?"background-image: url("+att_config.imageUrl+");":"",style="\n#att_lightbox {\n  display: none;\n  justify-content: center;\n  align-items: center;\n  position: fixed;\n  top: 0;\n  left: 0;\n  z-index: 1000;\n  width: 100vw;\n  height: 100vh;\n  margin: 0;\n  padding: 0;\n}\n.att_lightbox_background {\n  display: block;\n  position: fixed;\n  width: 100vw;\n  height: 100vh;\n  top: 0;\n  left: 0;\n  background-color: black;\n  opacity: 0.75;\n  z-index: 1000;\n  margin: 0;\n  padding: 0;\n}\n.att_popup * {\n  font-family: Open Sans;\n}\n.att_popup {\n  max-width: 800px;\n  max-height: 500px;\n  width: 100%;\n  height: 100%;\n  margin: 0;\n  padding: 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-direction: row;\n  z-index: 1001;\n  border-radius: 1px;\n}\n.att_lightbox_left {\n  max-width: 540px;\n  width: 100%;\n  height: 100%;\n  background-color: white;\n  "+bgImage+"\n  background-size: auto 100%;\n  background-position: center;\n}\n.att_lightbox_right {\n  background-color: #011A2E;\n  display: block;\n  width: 100%;\n  height: 100%;\n  position: relative;\n}\n.att_lightbox_right_contents {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  margin: 14px;\n  height: calc(100% - 40px);\n  width: calc(100% - 32px);\n}\n.att_lightbox_header {\n  text-align: center;\n  font-size: 32pt;\n  font-weight: 300;\n  line-height: 48px;\n  color: #ffffff;\n  margin: 0;\n  padding: 1rem;\n  line-height: 1.35;\n}\n.att_lightbox_subhheader {\n  font-size: 16pt;\n  text-align: center;\n  color: #ffffff;\n  line-height: 24px;\n  margin: 20px 30px;\n  padding: 0;\n}\n.att_lightbox_button {\n  height: 44px;\n  width: auto;\n  min-width: 80%;\n  background-color: #F66A13;\n  color: white;\n  border-radius: 27.4px;\n  border: 2px solid #F66A13;\n border\n  text-decoration: none;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 11pt;\n  margin: 10px;\n}\n.att_lightbox_button:hover {\n  background-color: #Ffffff;\n  text-decoration: none;\n  color: #F66A13;\n  cursor: pointer;\n}\n.att_lightbox_button:active {\n  background-color: #Ffffff;\n  text-decoration: none;\n  color: #F66A13;\n  cursor: pointer;\n}\n.att_lightbox_button[disabled=disabled],\n.att_lightbox_button:disabled {\n  background-color: #D8D8D8;\n  text-decoration: none;\n}\n#att_lightbox_close {\n  font-size: 12pt;\n  color: #d9d9d9;\n  text-align: center;\n  text-decoration: none;\n  margin: 10px;\n  font-weight: 300;\n}\n#att_lightbox_close:hover {\n  text-decoration: underline;\n}\n@media (max-width: 801px) {\n  .att_popup {\n    margin: 20px;\n  }\n  .att_lightbox_left {\n    display: none\n  }\n}\n",handlers=function(){var t=null!=att_config.delay&&att_config.delay?att_config.delay:5;function n(){document.getElementById("att_lightbox").style.display="none"}!1!==att_config.delay&&setTimeout(function(){att_config.fired||(document.getElementById("att_lightbox").style.display="flex",att_config.fired=!0)},1e3*t),document.getElementById("att_lightbox_close").addEventListener("click",function(t){t.preventDefault(),n()}),document.querySelector(".att_lightbox_background").addEventListener("click",function(t){att_config.clickBackgroundToClose&&(t.preventDefault(),n())})};injector({template:template,style:style,handlers:handlers});
"use strict";function injector(e){var t=null!=e.el&&e.el?e.el:document.body,l=document.createElement("div");e.templateClass&&l.classList.add(e.templateClass),l.innerHTML=null!=e.template&&e.template?e.template.replace(/(\r\n\t|\n|\r\t)/gm,""):"",t.appendChild(l);var n=document.createElement("style");n.innerText=null!=e.style&&e.style?e.style.replace(/(\r\n\t|\n|\r\t)/gm,""):"",document.head.appendChild(n),null!=e.handlers&&"function"==typeof e.handlers&&e.handlers()}})();