Sticky nav

CSS

The "width", "padding", and "right" attributes will need to be updated depending upon how long the words are for the calls to action.

You will also need to move the navigation down so that the buttons don't lay on top of the navigation.

@button-color: #ffa500;

//// Social Media ////
// Stylizes Social Media At Top of SIte
.social-gallery {
  position: fixed; 
  z-index: 999999;
  top: 5px;
  right: 315px;
  }
// Hides Social Media On Smaller Screens
@media screen and (max-width: 1024px) { .social-gallery { display: none;  } }

//// Stick Button Contact ////
// Style sticky button contact
.second-button a {color: white;}
.second-button:hover {opacity: .9; transition: all ease .5s;}

.second-button {
  position: fixed; 
  display: block;
  z-index: 999999;
  background-color: @button-color;
  right: 40px;
  width: 90px;
  padding: 10px 0px 10px 20px;
  margin-top: 0px!important;
  font-family: "Adobe Garamond Pro",Georgia,serif;
  font-weight: 400;
  font-size: 15px;
  }

// sticky cta on mobile
@media screen and (max-width: 768px) {
  .second-button {
    padding:15px 20px 10px 20px;
    right: 10px!important;
    top: -4px;
    width: 70px;
  }
}

// style sticky button admissions tickets
.first-button a {color: white;}
.first-button:hover {opacity: .9; transition: all ease .5s;}

.first-button {
  position: fixed; 
  display: block;
  z-index: 999999;
  background-color: @button-color;
  right: 155px;
  width: 115px;
  padding: 10px 0px 10px 25px;
  margin-top: 0px!important;
  font-family: "Adobe Garamond Pro",Georgia,serif;
  font-weight: 400;
  font-size: 15px;
  }

// sticky cta on mobile
@media screen and (max-width: 768px) {
  .first-button {
    padding: 15px 20px 10px 20px;
    right: 130px!important;
    width: 90px;
    top: -4px;
  }
}

Code Injection - Header

White Icons

<div class="first-button">  <a href="/events">ADMISSIONS</a></div>
<div class="second-button"><a href="/donate">CONTACT</a></div>
<div class="social-gallery">
  <a href="https://www.facebook.com/castcenters/" target="_blank"><img src="//static1.squarespace.com/static/5554ebc6e4b0f33dbaf91ce1/t/593831ef1b631b1aa4e1b5bf/1496855024016/FB+Icon.png" style="width: 20px; height: 20px; padding: 2px;"></a>
  <a href="https://www.instagram.com/castcenters/" target="_blank"><img src="//static1.squarespace.com/static/5554ebc6e4b0f33dbaf91ce1/t/593831f21b631b1aa4e1b5cb/1496855026294/IG+Icon.png" style="width: 20px; height: 20px; padding: 2px;"></a>
  <a href="https://twitter.com/castcenters" target="_blank"><img src="//static1.squarespace.com/static/5554ebc6e4b0f33dbaf91ce1/t/593831f4d482e9d9497001c4/1496855028563/Twitter+Icon.png" style="width: 20px; height: 20px; padding: 2px;"></a>
  <a href="https://youtube.com/castcenters" target="_blank"><img src="//static1.squarespace.com/static/5554ebc6e4b0f33dbaf91ce1/t/593831f8e6f2e1de4897b598/1496855032241/Youtube+Icon.png" style="width: 20px; height: 20px; padding: 2px;"></a>
    <a href="https://www.linkedin.com/in/titusmejia" target="_blank"><img src="//static1.squarespace.com/static/5554ebc6e4b0f33dbaf91ce1/t/593833359f7456e2786d572f/1496855349146/LinkedIn+Icon.png" style="width: 20px; height: 20px; padding: 2px;"></a>
  <a href="mailto:info@castcenters.com" target="_blank"><img src="//static1.squarespace.com/static/5554ebc6e4b0f33dbaf91ce1/t/593831fe1e5b6c832fe50b4d/1496855038134/Mail+Icon.png" style="width: 20px; height: 20px; padding: 2px;"></a>
</div>

Black Icons

<div class="first-button">  <a href="/events">ADMISSIONS</a></div>
<div class="second-button"><a href="/donate">CONTACT</a></div>
<div class="social-gallery">
  <a href="https://www.facebook.com/castcenters/" target="_blank"><img src="//static1.squarespace.com/static/5554ebc6e4b0f33dbaf91ce1/t/59383494a5790a9793c057ef/1496855700577/FB+Icon.png" style="width: 20px; height: 20px; padding: 2px;"></a>
  <a href="https://www.instagram.com/castcenters/" target="_blank"><img src="//static1.squarespace.com/static/5554ebc6e4b0f33dbaf91ce1/t/5938349659cc68b6c0f32c06/1496855702594/IG+Icon.png" style="width: 20px; height: 20px; padding: 2px;"></a>
  <a href="https://twitter.com/castcenters" target="_blank"><img src="//static1.squarespace.com/static/5554ebc6e4b0f33dbaf91ce1/t/59383499197aea38eb427f82/1496855705189/Twitter+Icon.png" style="width: 20px; height: 20px; padding: 2px;"></a>
  <a href="https://youtube.com/castcenters" target="_blank"><img src="//static1.squarespace.com/static/5554ebc6e4b0f33dbaf91ce1/t/5938349e03596e4aa835b1d2/1496855710323/Youtube+Icon.png" style="width: 20px; height: 20px; padding: 2px;"></a>
    <a href="https://www.linkedin.com/in/titusmejia" target="_blank"><img src="//static1.squarespace.com/static/5554ebc6e4b0f33dbaf91ce1/t/593834a0db29d6c8258cda6f/1496855712923/LinkedIn+Icon.png" style="width: 20px; height: 20px; padding: 2px;"></a>
  <a href="mailto:info@castcenters.com" target="_blank"><img src="//static1.squarespace.com/static/5554ebc6e4b0f33dbaf91ce1/t/5938349b03596e4aa835b186/1496855708027/Mail+Icon.png" style="width: 20px; height: 20px; padding: 2px;"></a>
</div>

All Templates