CSS / Absolute Positioning Wont Work for Safari

Question

I am building a wordpress site and am trying to absolutely position some social media icons on the bottom right for a site >60em and the top right for <60em screen resolution. The follow code works fine in all browsers and OS except Safari. Not sure what's going on. Any thoughts?

Site: http://www.itsjustchicken.com (see instagram icon on right)

.social-icons {
  margin: 1% 1%;
  position: absolute;
  bottom: 0;
  right: 0;
}
  @media (max-width: 60em) {
    .social-icons {
      margin: 1% 1%;
      position: absolute;
      top: 0;
      right: 0;
    }
}

Answer 1

Try this:

@media screen and (max-width: 60em) {
     .social-icons {
        margin: 1% 1%;
        position: absolute;
        top: 0;
        right: 0;
    }
}