@charset "UTF-8";
/* CSS Document */

/* ==========================================================================
    5.4. BUTTONS 
    ========================================================================= */
.buttons-presentation .btn {
  margin-right: 5px;
  margin-bottom: 5px;
  float: left;
}
.btn {
  text-transform: uppercase;
  font-weight: 700;
  position: relative;
  overflow: hidden;
  display: inline-block;
  backface-visibility: hidden;
  float: right;
  margin-left:5px;
  font-family: 'Open Sans', Arial, sans-serif;
}
.btn::after {
  position: absolute;
  content: '';
  width: 0%;
  height: 100%;
  top: 0;
  left: 0;
  -webkit-transition: all 0.2s ease 0s;
  -moz-transition: all 0.2s ease 0s;
  -o-transition: all 0.2s ease 0s;
  -ms-transition: all 0.2s ease 0s;
  transition: all 0.2s ease 0s;
}
.btn:hover::after {
  width: 100%;
  z-index: 1;
}
.btn span {
  position: relative;
  -webkit-transition: all 0.2s ease 0s;
  -moz-transition: all 0.2s ease 0s;
  -o-transition: all 0.2s ease 0s;
  -ms-transition: all 0.2s ease 0s;
  transition: all 0.2s ease 0s;
  display: block;
  z-index: 2;
  width: 100%;
  height: 100%;
  color: #fff;
}
.btn.float-left {
  float: left;
}
.btn.float-none {
  float:none;
}
.btn-big {
  padding: 10px 60px;
  font-size: 12px;
}
.btn-medium {
  padding: 7px 40px;
  font-size: 12px;
}
.btn-small {
  padding: 4px 20px;
  font-size: 11px;
}
.btn.empty {
  border: 2px solid;
  background-color: transparent;
}
.btn-centered {
  display: table;
  margin: 0 auto;
  float: none;
}
.btn.empty.white {
  border: 2px solid #fff;
}
.btn.empty.white span {
  color: #fff;
}
.btn.empty.white:after {
  background-color: rgba(255, 255, 255, 0.3);
}
.btn.empty.black {
  border: 2px solid #252525;
  background-color: transparent;
}
.btn.empty.black span {
  color: #252525;
}
.btn.empty.black:after {
  background-color: #252525;
}
.btn.empty.grey {
  border: 2px solid #777;
  background-color: transparent;
}
.btn.empty.grey span {
  color: #777;
}
.btn.empty.grey::after {
  background-color: #777;
}
.btn.empty.silver {
  border: 2px solid #aaa;
  background-color: transparent;
}
.btn.empty.silver span {
  color: #aaa;
}
.btn.empty.silver::after {
  background-color: #aaa;
}
.btn.empty.blue {
  border: 2px solid #2277eb;
  background-color: transparent;
}
.btn.empty.blue span {
  color: #2277eb;
}
.btn.empty.blue::after {
  background-color: #2277eb;
}
.btn.empty.light-blue {
  border: 2px solid #49c6e5;
  background-color: transparent;
}
.btn.empty.light-blue span {
  color: #49c6e5;
}
.btn.empty.light-blue::after {
  background-color: #49c6e5;
}
.btn.empty.aqua {
  border: 2px solid #60cfc8;
  background-color: transparent;
}
.btn.empty.aqua span {
  color: #60cfc8;
}
.btn.empty.aqua::after {
  background-color: #60cfc8;
}
.btn.empty.soft-red {
  border: 2px solid #e65754;
  background-color: transparent;
}
.btn.empty.soft-red span {
  color: #e65754;
}
.btn.empty.soft-red::after {
  background-color: #e65754;
}
.btn.empty.purple::after {
  background-color: #6B5093;
}
.btn.empty.purple {
  border: 2px solid #6B5093;
  background-color: transparent;
}
.btn.empty.purple span {
  color: #6B5093;
}
.btn.empty.red {
  border: 2px solid #d52b2a;
  background-color: transparent;
}
.btn.empty.red span {
  color: #d52b2a;
}
.btn.empty.red::after {
  background-color: #d52b2a;
}
.btn.empty.yellow {
  border: 2px solid #fcc820;
  background-color: transparent;
}
.btn.empty.yellow span {
  color: #fcc820;
}
.btn.empty.yellow::after {
  background-color: #fcc820;
}
.btn.empty.orange {
  border: 2px solid #ff6600;
  background-color: transparent;
}
.btn.empty.orange span {
  color: #ff6600;
}
.btn.empty.orange::after {
  background-color: #ff6600;
}
.btn.empty.olive {
  border: 2px solid #9ab869;
  background-color: transparent;
}
.btn.empty.olive span {
  color: #9ab869;
}
.btn.empty.olive::after {
  background-color: #9ab869;
}
.btn.empty.green {
  border: 2px solid #5ab124;
  background-color: transparent;
}
.btn.empty.green span {
  color: #5ab124;
}
.btn.empty.green::after {
  background-color: #5ab124;
}
.btn.empty.brown {
  border: 2px solid #8b5b4d;
  background-color: transparent;
}
.btn.empty.brown span {
  color: #8b5b4d;
}
.btn.empty.brown::after {
  background-color: #8b5b4d;
}
.btn.empty:hover span {
  color: #fff;
}
.btn.icon-animated i {
  position: relative;
  left: -30px;
  z-index: 2;
  transform: translate(-15px, 0);
  -webkit-transform: translate(-15px, 0);
  -moz-transform: translate(-15px, 0);
  -ms-transform: translate(-15px, 0);
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -5px;
  opacity: 0;
}
.btn.icon-animated:hover i {
  opacity: 1;
  left: 0;
}
.btn.icon-animated:hover span {
  transform: translate(10px, 0);
  -webkit-transform: translate(10px, 0);
  -moz-transform: translate(10px, 0);
  -ms-transform: translate(10px, 0);
}
.btn.btn-medium.icon-animated i,
.btn.btn-big.icon-animated i {
  transform: translate(-20px, 0);
  -webkit-transform: translate(-20px, 0);
  -moz-transform: translate(-20px, 0);
  -ms-transform: translate(-20px, 0);
  margin-top: -6px;
}
.btn:after {
  background-color: rgba(255, 255, 255, 0.2);
}
.btn.black {
  background-color: #252525;
}
.btn.grey {
  background-color: #777;
}
.btn.silver {
  background-color: #aaa;
}
.btn.blue {
  background-color: #2277eb;
}
.btn.light-blue {
  background-color: #49c6e5;
}
.btn.aqua {
  background-color: #60cfc8;
}
.btn.soft-red {
  background-color: #e65754;
}
.btn.purple {
  background-color: #6B5093;
}
.btn.red {
  background-color: #d52b2a;
}
.btn.yellow {
  background-color: #fcc820;
}
.btn.orange {
  background-color: #ff6600;
}
.btn.olive {
  background-color: #9ab869;
}
.btn.green {
  background-color: #5ab124;
}
.btn.brown {
  background-color: #8b5b4d;
}