.search-bar
  width: 80%
  margin-left: auto
  margin-right: auto
  position: relative
  margin-bottom: 40px

  input[type=text]
    width: 90%
    height: 24px
    border: none
    outline: none
    padding: 5%
    border-radius: 6px
    background-color: white

    color: $orange
    font-size: 16px
    line-height: 24px
    +transition(all 0.5s)

    +placeholder
      color: $orange

  .submit
    +position(absolute, 30% 5% null null)

    height: 16px
    width: 12px
    +sprite(0 -30px, 12px, 16px)
    background-color: rgba(0,0,0,0.0)
    outline: none
    border: none
    cursor: pointer
    +transform(scale(1.0))
    +transition(all 0.5s)

    input
      &::-webkit-input-placeholder
        padding-left: 10%
        opacity: 0
        +transition(all 1s)

      &:focus:-moz-placeholder
        padding-left: 10%
        opacity: 0
        +transition(all 1s)

      &:focus:-ms-input-placeholder
        padding-left: 10%
        opacity: 0
        +transition(all 1s)

+media-query-height(750px)
  .search-bar
    display: none