.dboom-button,.dboom-button::before,.dboom-button::after { 
  position: absolute; top: 50%; left: 50%; transition: all .3s ease-in-out;
}
.dboom-button,.dboom-button::before { 
  -webkit-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.25);
  -moz-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.25);
  box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.25);
}
.dboom-button-link {
  z-index: 1;
  position: absolute;
  border-radius: 100%;
  transition: all .3s ease-in-out;
}

/*************/
/* BUTTON MD */
/*************/

.dboom-button-link.md {
  width: 50%;
  height: 50%;
  margin-left: -25%;
  margin-top: 25%;
  padding-top: 7%;
  border: 0.1em solid rgba(99, 99, 99, 0.1);
}
.dboom-button-link.md.active {
  border: solid #FF9933 0.1em;
  color: #FF9933 !important;
}
.dboom-button-link.md.active:hover {
  border: solid #FF9933 0.1em;
  color: white !important;
}
.dboom-button.md {
  text-align: center; 
  -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%;
  border: 0.1em solid rgba(99, 99, 99, 0.1);
  content: "";
  border-left-color: #1AA346;
  border-right-color: rgba(19, 65, 99, 1);
  margin: -3em 0 0 -3em;
  height: 6em;
  width: 6em;
}
.dboom-button.md::before {
  -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%;
  border: 0.4em solid rgba(99, 99, 99, 0.1);
  content: "";
  border-top-color: rgba(19, 65, 99, 1);
  border-bottom-color: #1AA346; 
  margin: -2.5em 0 0 -2.5em;
  height: 5em;
  width: 5em;
}
.dboom-button.md.spin-right:before { -webkit-animation: spin-right 2s cubic-bezier(1, .06, .39, .77) infinite; -moz-animation: spin-right 2s cubic-bezier(1, .06, .39, .77) infinite; -o-animation: spin-right 2s cubic-bezier(1, .06, .39, .77) infinite; animation: spin-right 2s cubic-bezier(1, .06, .39, .77) infinite;  }
.dboom-button.md.spin-left:before { -webkit-animation: spin-left 2s cubic-bezier(1, .06, .39, .77) infinite; -moz-animation: spin-left 2s cubic-bezier(1, .06, .39, .77) infinite; -o-animation: spin-left 2s cubic-bezier(1, .06, .39, .77) infinite; animation: spin-left 2s cubic-bezier(1, .06, .39, .77) infinite;  }

.dboom-button.md::after {
  -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%;
  border: 0.2em solid rgba(99, 99, 99, 0.1);
  content: "";
  border-right-color: rgba(19, 65, 99, 1);
  border-left-color: #1AA346;
  margin: -2em 0 0 -2em;
  height: 4em;
  width: 4em;
}

.dboom-button.md:hover:after { border-left: solid #FF9933 0.1em; border-right: solid #FF9933 0.1em; }
.dboom-button.md.spin-right:hover:after { transform:rotate(360deg);-ms-transform:rotate(360deg);-webkit-transform:rotate(360deg); }
.dboom-button.md.spin-left:hover:after { transform:rotate(-360deg);-ms-transform:rotate(-360deg);-webkit-transform:rotate(-360deg); }
.dboom-button.md.active:after { border-left: solid #FF9933 0.18em; border-right: solid #FF9933 0.2em; }
.dboom-button.md.active.spin-right:after { -webkit-animation: spin-right 2s cubic-bezier(1, .06, .39, .77) infinite; -moz-animation: spin-right 2s cubic-bezier(1, .06, .39, .77) infinite; -o-animation: spin-right 2s cubic-bezier(1, .06, .39, .77) infinite; animation: spin-right 2s cubic-bezier(1, .06, .39, .77) infinite; }
.dboom-button.md.active.spin-left:after { -webkit-animation: spin-left 2s cubic-bezier(1, .06, .39, .77) infinite; -moz-animation: spin-left 2s cubic-bezier(1, .06, .39, .77) infinite; -o-animation: spin-left 2s cubic-bezier(1, .06, .39, .77) infinite; animation: spin-left 2s cubic-bezier(1, .06, .39, .77) infinite; }

/*************/
/* BUTTON SM */
/*************/

.dboom-button-link.sm {
  width: 50%;
  height: 50%;
  margin-left: -25%;
  margin-top: 25%;
  padding-top: 4%;
}
.dboom-button-link.sm.active {
  color: #FF9933 !important;
}
.dboom-button-link.sm.active:hover {
  color: white !important;
}
.dboom-button.sm {
  text-align: center; 
  -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%;
  border: 0.1em solid rgba(19, 65, 99, 1);
  content: "";
  margin: -2.5em 0 0 -2.5em;
  height: 5em;
  width: 5em;
}
.dboom-button.sm::before {
  -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%;
  border: 0.18em solid rgba(99, 99, 99, 0.1);
  content: "";
  border-right-color: rgba(19, 65, 99, 1);
  border-left-color: #1AA346;;
  margin: -2em 0 0 -2em;
  height: 4em;
  width: 4em;
}
.dboom-button.sm:hover:before {
  border-left: solid #FF9933 0.18em;
  border-right: solid #FF9933 0.18em;
}
.dboom-button.sm.active:before {
  border-left: solid #FF9933 0.18em;
  border-right: solid #FF9933 0.18em;
  -webkit-animation: rotate 2s cubic-bezier(1, .06, .39, .77) infinite; -moz-animation: rotate 2s cubic-bezier(1, .06, .39, .77) infinite; -o-animation: rotate 2s cubic-bezier(1, .06, .39, .77) infinite; animation: rotate 2s cubic-bezier(1, .06, .39, .77) infinite; 
}
.dboom-button.sm.spin-right:hover:before { transform:rotate(360deg);-ms-transform:rotate(360deg);-webkit-transform:rotate(360deg); }
.dboom-button.sm.spin-right.active:before { -webkit-animation: spin-right 2s cubic-bezier(1, .06, .39, .77) infinite; -moz-animation: spin-right 2s cubic-bezier(1, .06, .39, .77) infinite; -o-animation: spin-right 2s cubic-bezier(1, .06, .39, .77) infinite; animation: spin-right 2s cubic-bezier(1, .06, .39, .77) infinite; }
.dboom-button.sm.spin-left:hover:before { transform:rotate(-360deg);-ms-transform:rotate(-360deg);-webkit-transform:rotate(-360deg); }
.dboom-button.sm.spin-left.active:before { -webkit-animation: spin-left 2s cubic-bezier(1, .06, .39, .77) infinite; -moz-animation: spin-left 2s cubic-bezier(1, .06, .39, .77) infinite; -o-animation: spin-left 2s cubic-bezier(1, .06, .39, .77) infinite; animation: spin-left 2s cubic-bezier(1, .06, .39, .77) infinite; }


/*************/
/* BUTTON XS */
/*************/

.dboom-button-link.xs {
  width: 50%;
  height: 50%;
  margin-left: -25%;
  margin-top: 15%;
  padding-top: 4%;
}
.dboom-button-link.xs.active {
  color: #FF9933 !important;
}
.dboom-button-link.xs.active:hover {
  color: white !important;
}
.dboom-button.xs {
  text-align: center; 
  -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%;
  border: 0.1em solid rgba(19, 65, 99, 1);
  content: "";
  margin: -1.75em 0 0 -1.75em;
  height: 3.5em;
  width: 3.5em;
}
.dboom-button.xs::before {
  -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%;
  border: 0.1em solid rgba(99, 99, 99, 0.1);
  content: "";
  border-right-color: rgba(19, 65, 99, 1);
  border-left-color: #1AA346;;
  margin: -1.25em 0 0 -1.25em;
  height: 2.5em;
  width: 2.5em;
}
.dboom-button.xs:hover:before {
  border-left: solid #FF9933 0.1em;
  border-right: solid #FF9933 0.1em;
}
.dboom-button.xs.active:before {
  border-left: solid #FF9933 0.1em;
  border-right: solid #FF9933 0.1em;
  -webkit-animation: rotate 2s cubic-bezier(1, .06, .39, .77) infinite; -moz-animation: rotate 2s cubic-bezier(1, .06, .39, .77) infinite; -o-animation: rotate 2s cubic-bezier(1, .06, .39, .77) infinite; animation: rotate 2s cubic-bezier(1, .06, .39, .77) infinite; 
}
.dboom-button.xs.spin-right:hover:before { transform:rotate(360deg);-ms-transform:rotate(360deg);-webkit-transform:rotate(360deg); }
.dboom-button.xs.spin-right.active:before { -webkit-animation: spin-right 2s cubic-bezier(1, .06, .39, .77) infinite; -moz-animation: spin-right 2s cubic-bezier(1, .06, .39, .77) infinite; -o-animation: spin-right 2s cubic-bezier(1, .06, .39, .77) infinite; animation: spin-right 2s cubic-bezier(1, .06, .39, .77) infinite; }
.dboom-button.xs.spin-left:hover:before { transform:rotate(-360deg);-ms-transform:rotate(-360deg);-webkit-transform:rotate(-360deg); }
.dboom-button.xs.spin-left.active:before { -webkit-animation: spin-left 2s cubic-bezier(1, .06, .39, .77) infinite; -moz-animation: spin-left 2s cubic-bezier(1, .06, .39, .77) infinite; -o-animation: spin-left 2s cubic-bezier(1, .06, .39, .77) infinite; animation: spin-left 2s cubic-bezier(1, .06, .39, .77) infinite; }


/* AMIMATIONS */

@-webkit-keyframes spin-left {
  from { transform:rotateZ(0deg); -ms-transform:rotateZ(0deg); /* IE 9 */ -moz-transform:rotateZ(0deg); /* Firefox */ -webkit-transform:rotateZ(0deg); /* Safari and Chrome */ -o-transform:rotateZ(0deg); /* Opera */ }
  to { transform:rotateZ(-360deg); -ms-transform:rotateZ(-360deg); /* IE 9 */ -moz-transform:rotateZ(-360deg); /* Firefox */ -o-transform:rotateZ(-360deg); /* Opera */-webkit-transform:rotateZ(-360deg); }
}

@keyframes spin-left {
  from { transform:rotateZ(0deg); -ms-transform:rotateZ(0deg); /* IE 9 */ -moz-transform:rotateZ(0deg); /* Firefox */ -webkit-transform:rotateZ(0deg); /* Safari and Chrome */ -o-transform:rotateZ(0deg); /* Opera */ }
  to { transform:rotateZ(-360deg); -ms-transform:rotateZ(-360deg); /* IE 9 */ -moz-transform:rotateZ(-360deg); /* Firefox */ -o-transform:rotateZ(-360deg); /* Opera */-webkit-transform:rotateZ(-360deg); }
}

@-webkit-keyframes spin-right {
  from { transform:rotateZ(0deg); -ms-transform:rotateZ(0deg); /* IE 9 */ -moz-transform:rotateZ(0deg); /* Firefox */ -webkit-transform:rotateZ(0deg); /* Safari and Chrome */ -o-transform:rotateZ(0deg); /* Opera */ }
  to { transform:rotateZ(360deg); -ms-transform:rotateZ(360deg); /* IE 9 */ -moz-transform:rotateZ(360deg); /* Firefox */ -o-transform:rotateZ(360deg); /* Opera */-webkit-transform:rotateZ(360deg); }
}

@keyframes spin-right {
  from { transform:rotateZ(0deg); -ms-transform:rotateZ(0deg); /* IE 9 */ -moz-transform:rotateZ(0deg); /* Firefox */ -webkit-transform:rotateZ(0deg); /* Safari and Chrome */ -o-transform:rotateZ(0deg); /* Opera */ }
  to { transform:rotateZ(360deg); -ms-transform:rotateZ(360deg); /* IE 9 */ -moz-transform:rotateZ(360deg); /* Firefox */ -o-transform:rotateZ(360deg); /* Opera */-webkit-transform:rotateZ(360deg); }
}