index.html

<!DOCTYPE html>
<html>
  <head>
    <!-- Global site tag (gtag.js) - Google Analytics -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-112546121-1"></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());

      gtag('config', 'UA-112546121-1');
    </script>
    <title>Bradley Reeder :: Shamanic Energy Healing</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://use.fontawesome.com/6691c48adf.js"></script>
    <link rel="stylesheet" type="text/css" href="public/css/main.css">
    <link href='https://fonts.googleapis.com/css?family=Roboto+Condensed:300' rel='stylesheet' type='text/css'>
    <link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
    <link href="https://fonts.googleapis.com/css?family=Playfair+Display|Raleway" rel="stylesheet" type="text/css">
    <link href="//cdn-images.mailchimp.com/embedcode/classic-10_7.css" rel="stylesheet" type="text/css">
    <style type="text/css">
    #mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif; }
    </style>
  </head>
  <body>
    <div id="container"></div>
    <script
      src="https://code.jquery.com/jquery-3.1.1.min.js"
      integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="
      crossorigin="anonymous">
    </script>
    <script type="text/javascript" src="https://assets.calendly.com/assets/external/widget.js"></script>
    <script type="text/javascript" src="public/bundle.js"></script>
    <script>
    /*Scroll transition to anchor*/


    $("a.toscroll").on('click', function(e) {
      if (e.target.className === 'fa fa-angle-double-down') {
        var hash = 'about';
      } else if (e.target.className.includes('towork')) {
        var hash = 'pricing';
      } else if (e.target.className.includes('absolute-anchor')){
        var hash = 'about';
      } else {
        var hash = e.target.innerHTML;
      }
      $('html, body').animate({
        scrollTop: $('#' + hash).offset().top
      }, 1000);
      return false;
    });

    //$(window).scroll( function() {
    //if($(this).scrollTop() > $('#header').height() - $('.menu').height() + 4) {
    //  console.log($('#header').height());
    //  console.log($(this).scrollTop());
    //    $('#inspiration').css('background-attachment','fixed');
    //    $('#inspiration').css('background-position', 'top');
    //} else {
    //    console.log($('#header').height());
    //    console.log($(this).scrollTop());
    //    $('#inspiration').css('background-attachment','none');
    //}
   //});

    $(window).scroll(function() {
      $(".bounce").css("opacity", 1 - $(window).scrollTop() / 250);
    });

    // the following code will highlight the relevant item on the navbar menuItem
    // once its section of the page is scrolled past. Bugs are currently created
    // when the user navigates to one of the case study pages, however, so this
    // should be saved until navigation bugs are resolved.

    // Cache selectors
// var lastId,
//     topMenu = $("#menu"),
//     topMenuHeight = topMenu.outerHeight()+15,
//     // All list items
//     menuItems = topMenu.find("a"),
//     // Anchors corresponding to menu items
//     scrollItems = menuItems.map(function(){
//     	var temp = $(this).attr("href");
//       var ID = temp.split('#').pop();
//      	if(!ID){
//       	var item = $('body');
//       } else {
//       	var item = $('#'+ID);
//       }
//
//       if (item.length) { return item; }
//     });
//
// // Bind click handler to menu items
// // so we can get a fancy scroll animation
// menuItems.click(function(e){
//   var href = $(this).attr("href"),
//       offsetTop = href === "#" ? 0 : $(href).offset().top-topMenuHeight+1;
//   $('html, body').stop().animate({
//       scrollTop: offsetTop
//   }, 300);
//   e.preventDefault();
// });
//
// // Bind to scroll
// $(window).scroll(function(){
//    // Get container scroll position
//    var fromTop = $(this).scrollTop()+topMenuHeight;
//
//    // Get id of current scroll item
//    var cur = scrollItems.map(function(){
//      if ($(this).offset().top < fromTop)
//        return this;
//    });
//    // Get the id of the current element
//    cur = cur[cur.length-1];
//    var id = cur && cur.length ? cur[0].id : "";
//
//    if (lastId !== id) {
//        lastId = id;
//        console.log(id);
//        // Set/remove active class
//        menuItems
//          .parent().removeClass("active")
//          .end().filter("[href='#"+id+"']").parent().addClass("active");
//    }
// });
    </script>

  <div class="content-container">

    <div id="booking"></div>
    <h2 class="padding-top-2em top-h2">booking</h2>
    <div class="content-background-colour padding-top-40px">
      <h2 class="no-margins">I am offering 1-1 shamanic energy healing sessions <i>by donation</i></h2>
      <hr />
      <strong><p class="decrease-padding padding-bottom-20px">Donations can be made via paypal <a target="_blank" href="https://www.paypal.me/bradleyreeder">here</a> before or after sessions. Give based on what you can afford right now.</p></strong>
      <strong><p class="decrease-padding padding-bottom-20px">I also welcome non-financial contributions for our time together such as reviews, which we could discuss.</p></strong>
      <strong><p class="decrease-padding">Book a slot below for an in-person or distance healing session. Or write to me <a target="_blank" href="mailto: bradjohnreeder@gmail.com">bradjohnreeder@gmail.com</a> and I will be in touch!</p></strong>
      <div id="calendly-inline-widget" class="calendly-inline-widget padding-bottom-80px" data-url="https://calendly.com/bradley-reeder/shamanic-energy-healing?background_color=333333&text_color=ffffff&primary_color=0088e2"></div>
    </div>


    <div class="contact">
      <div id="contact"></div>
      <h2>get in touch!</h2>
      <div class="contact-background-color">
        <div class="contact padding-top-40px padding-bottom-80px">

          <div id="mc_embed_signup">
            <strong><p class="contact-header">Just send an email to <a target="_blank" href="mailto:bradjohnreeder@gmail.com">bradjohnreeder@gmail.com</a>, call <a target="_blank" href="tel:+447479507365">+44 7479 507365</a>, or leave a message below and I will be in touch within 24 hours.</p></strong>
            <strong><p class="contact-header">The latter will also subscribe you to my monthly e-bulletin. I draw one random name per month from this list for a free 30 minute healing session.</p></strong>
          <form action="https://github.us4.list-manage.com/subscribe/post?u=7281ec38aacaa29248a5bf895&amp;id=c2698af877" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
            <div id="mc_embed_signup_scroll">
          <div class="indicates-required"><span class="asterisk">*</span> indicates required</div>
          <div class="mc-field-group">
          <label class="label" for="mce-FNAME">First Name  <span class="asterisk">*</span>
          </label>
          <input type="text" value="" name="FNAME" class="required" id="mce-FNAME">
          </div>
          <div class="mc-field-group">
          <label class="label" for="mce-EMAIL">Email Address  <span class="asterisk">*</span>
          </label>
          <input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL">
          </div>
          <div class="mc-field-group">
          <label class="label" for="mce-MMERGE3">Message for Bradley (max 255 characters) </label>
          <input type="text" value="" name="MMERGE3" class="" id="mce-MMERGE3">
          </div>
          <div class="mc-field-group input-group">
            <strong>Confirm that I have permission to contact you via:  <span class="asterisk">*</span>
          </strong>
            <ul><li><input type="radio" value="Email" name="MMERGE2" id="mce-MMERGE2-0"><label for="mce-MMERGE2-0">Email</label></li>
          </ul>
          </div>
          <div id="mce-responses" class="clear">
            <div class="response" id="mce-error-response" style="display:none"></div>
            <div class="response" id="mce-success-response" style="display:none"></div>
          </div>
            <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_7281ec38aacaa29248a5bf895_c2698af877" tabindex="-1" value=""></div>
            <div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
            <i><p class="contact-header">Unsubscribe at any time by clicking the link in the footer of my emails.</p></i>
            </div>
          </form>
          </div>
          <script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script><script type='text/javascript'>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[1]='FNAME';ftypes[1]='text';fnames[0]='EMAIL';ftypes[0]='email';fnames[3]='MMERGE3';ftypes[3]='text';fnames[2]='MMERGE2';ftypes[2]='radio';}(jQuery));var $mcj = jQuery.noConflict(true);</script>

        </div>
      </div>
    </div>

  </div>

    <div id="footer">
      <div class="row">
        <div class="column">
          <a target="_blank" href="https://www.facebook.com/Pachakuti-Healing-101448564905678"><img class="social-media-icons" src="public/resources/facebook-icon.PNG"/></a>
        </div>
        <div class="column">
          <a target="_blank" href="https://medium.com/@bradjohnreeder/what-is-natural-wisdom-b861383a8368"><img class="social-media-icons" src="public/resources/medium-icon.PNG"/></a>
        </div>
        <div class="column">
          <a target="_blank" href="https://www.meetup.com/London-Shamanic-Community/"><img class="social-media-icons" src="public/resources/meetup-icon.PNG"/></a>
        </div>
      </div>

      <div id="footer-content"><p>©2020 Bradley Reeder. All Rights Reserved</p></div>
    </div>

  </body>
</html>