body{
  font-family: Nunito;
  font-weight: 100;
}

h1,
h2,
h3,
h4,
h5,
h6{
  font-family: Butler;
  &.subheading{
    font-family: Nunito;
    text-transform: uppercase;
  }
}

::selection {
  text-shadow: none;
  background-color: $primary2;
  color: $white;
}

::-moz-selection {
  text-shadow: none;
  background-color: $primary2;
  color: $white;
}

.icon-placeholder{
  svg{
    color: $primary;
    width: $size-large * 2;
    margin-bottom: $size-large;
  }
}

strong{
  font-weight: 700;
}

.btn-toggle{
  z-index: 1000;
  background-color: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
  outline: none;
  &:focus,
  &:active,
  &:hover{
    background-color: transparent;
    border: none;
    box-shadow: none;
    outline: none;
  }

  &:hover{
    span{
      background-color: $black;
    }
  }

  span {
    display: block;
    width: 33px;
    height: 3px;
    margin-bottom: 5px;
    position: relative;

    background: $white;
    border-radius: 3px;

    z-index: 1;

    @include transformOrigin(4px 0px);

    @include transition(transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),
            background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0) .1s,
            opacity 0.55s ease);

    &:first-child {
      @include transformOrigin(0 0);
    }

    &:last-child {
      @include transformOrigin(0 100%);
    }
  }

  &.open {
    span {
      opacity: 1;
      @include transform(rotate(45deg) translate(-3px, 0));

      @include transition(transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),
              background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0) .4s,
              opacity 0.55s ease);

      &:nth-child(2) {
        opacity: 0;
        @include transform(rotate(0deg) scale(0.2, 0.2));
      }
      &:last-child {
        @include transform(rotate(-45deg) translate(-5px, 0));
      }
    }
  }
}

.btn{
  border-radius: 0;
  &:focus{
    box-shadow: none !important;
  }
  &:active{
    box-shadow: none !important;
  }
}

.pointer{
  cursor: pointer;
}

.img-hover{
  cursor: pointer;
  @include transition(transform .3s ease-in-out);
  &:hover{
    @include transform(scale(1.1));
  }
}