Added shimmer/glare to rotating iPhone

I added a little shimmer / glare as the phone rotates (with CSS, obviously didn't edit the images to remove the static glare).

FYI, I did this in Chrome's dev tools as pure CSS and then re-wrote it as SASS, just in case there's a syntax error. I use LESS usually, so I've no idea how to use SASS' `radial-gradient()` mixin. Especially because there's no entry for it in the SASS documentation. That's why I'm given each vendor-specific rule here. It would be handy if you knew if `radial-gradient()` could ouput those dynamically.

---

Just as reference (in case there's a SASS syntax mistake), this is the desired CSS:

```css
.phone-container {
  margin: 100px auto;
  width: 251px;
  height: 537px;
  -webkit-perspective: 800px;
  -moz-perspective: 800px;
  -ms-perspective: 800px;
  -o-perspective: 800px;
  perspective: 800px;
}

.phone-container * {
  position: absolute;
  -webkit-transition: all 1500ms;
  -moz-transition: all 1500ms;
  -o-transition: all 1500ms;
  transition: all 1500ms;
}
.phone-container .phone {
  left: 125px;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform: rotateY(-80deg);
  -moz-transform: rotateY(-80deg);
  -ms-transform: rotateY(-80deg);
  -o-transform: rotateY(-80deg);
  transform: rotateY(-80deg);
  -webkit-animation: rotate-phone 5s linear infinite;
  -moz-animation: rotate-phone 5s linear infinite;
  -ms-animation: rotate-phone 5s linear infinite;
  -o-animation: rotate-phone 5s linear infinite;
  animation: rotate-phone 5s linear infinite;
}

.phone-container .front {
  width: 251px;
  height: 537px;
  background: url(/images/phone_parts/front.png) no-repeat;
  -webkit-transform: translateX(-125px) rotateY(0deg) translateZ(14px);
  -moz-transform: translateX(-125px) rotateY(0deg) translateZ(14px);
  -ms-transform: translateX(-125px) rotateY(0deg) translateZ(14px);
  -o-transform: translateX(-125px) rotateY(0deg) translateZ(14px);
  transform: translateX(-125px) rotateY(0deg) translateZ(14px);
}

.front:after, .back:after{
    
  -webkit-animation: shimmer 2.5s ease-in-out infinite;
  -moz-animation: shimmer 2.5s ease-in-out infinite;
  -ms-animation: shimmer 2.5s ease-in-out infinite;
  -o-animation: shimmer 2.5s ease-in-out infinite;
  animation: shimmer 2.5s ease-in-out infinite;
    
  content:' ';
  position: absolute;
  top:-400%;
  left:0;
  width:200%;
  height:800%;
  opacity:0;
   
  background: -moz-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 25%); /* FF3.6+ */
  background: -webkit-radial-gradient(center, ellipse cover, rgba(255,255,255,0.6) 0%,rgba(255,255,255,0) 25%); /* Chrome10+,Safari5.1+ */
  background: -o-radial-gradient(center, ellipse cover, rgba(255,255,255,0.15) 0%,rgba(255,255,255,0) 25%); /* Opera 12+ */
  background: -ms-radial-gradient(center, ellipse cover, rgba(255,255,255,0.15) 0%,rgba(255,255,255,0) 25%); /* IE10+ */
  background: radial-gradient(ellipse at center, rgba(255,255,255,0.15) 0%,rgba(255,255,255,0) 25%); /* W3C */
 
}

.phone-container .back {
  width: 251px;
  height: 537px;
  background: url(/images/phone_parts/back.png) no-repeat;
  -webkit-transform: translateX(-125px) rotateY(180deg) translateZ(13px);
  -moz-transform: translateX(-125px) rotateY(180deg) translateZ(13px);
  -ms-transform: translateX(-125px) rotateY(180deg) translateZ(13px);
  -o-transform: translateX(-125px) rotateY(180deg) translateZ(13px);
  transform: translateX(-125px) rotateY(180deg) translateZ(13px);
}
.phone-container .left {
  width: 31px;
  height: 537px;
  background: url(/images/phone_parts/left_side.png) no-repeat;
  -webkit-transform: translateX(-138px) rotateY(-90deg);
  -moz-transform: translateX(-138px) rotateY(-90deg);
  -ms-transform: translateX(-138px) rotateY(-90deg);
  -o-transform: translateX(-138px) rotateY(-90deg);
  transform: translateX(-138px) rotateY(-90deg);
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  -o-border-radius: 20px;
  border-radius: 20px;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;
}
.phone-container .left-top {
  background: black;
  width: 29px;
  height: 30px;
  top: 4px;
  -webkit-transform: translateX(-129px) rotateY(-90deg) rotateX(30deg);
  -moz-transform: translateX(-129px) rotateY(-90deg) rotateX(30deg);
  -ms-transform: translateX(-129px) rotateY(-90deg) rotateX(30deg);
  -o-transform: translateX(-129px) rotateY(-90deg) rotateX(30deg);
  transform: translateX(-129px) rotateY(-90deg) rotateX(30deg);
}
.phone-container .left-bottom {
  background: black;
  width: 29px;
  height: 25px;
  -webkit-transform: translateX(-131px) translateY(490px) rotateY(-90deg) rotateX(-30deg);
  -moz-transform: translateX(-131px) translateY(490px) rotateY(-90deg) rotateX(-30deg);
  -ms-transform: translateX(-131px) translateY(490px) rotateY(-90deg) rotateX(-30deg);
  -o-transform: translateX(-131px) translateY(490px) rotateY(-90deg) rotateX(-30deg);
  transform: translateX(-131px) translateY(490px) rotateY(-90deg) rotateX(-30deg);
}
.phone-container .right {
  width: 31px;
  height: 537px;
  background: url(/images/phone_parts/right_side.png) no-repeat;
  -webkit-transform: translateX(105px) rotateY(90deg);
  -moz-transform: translateX(105px) rotateY(90deg);
  -ms-transform: translateX(105px) rotateY(90deg);
  -o-transform: translateX(105px) rotateY(90deg);
  transform: translateX(105px) rotateY(90deg);
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;
}
.phone-container .right-top {
  background: black;
  width: 29px;
  height: 29px;
  top: 4px;
  -webkit-transform: translateX(98px) rotateY(-90deg) rotateX(-30deg);
  -moz-transform: translateX(98px) rotateY(-90deg) rotateX(-30deg);
  -ms-transform: translateX(98px) rotateY(-90deg) rotateX(-30deg);
  -o-transform: translateX(98px) rotateY(-90deg) rotateX(-30deg);
  transform: translateX(98px) rotateY(-90deg) rotateX(-30deg);
}
.phone-container .right-bottom {
  background: black;
  width: 29px;
  height: 25px;
  -webkit-transform: translateX(100px) translateY(490px) rotateY(-90deg) rotateX(30deg);
  -moz-transform: translateX(100px) translateY(490px) rotateY(-90deg) rotateX(30deg);
  -ms-transform: translateX(100px) translateY(490px) rotateY(-90deg) rotateX(30deg);
  -o-transform: translateX(100px) translateY(490px) rotateY(-90deg) rotateX(30deg);
  transform: translateX(100px) translateY(490px) rotateY(-90deg) rotateX(30deg);
}
.phone-container .shadow {
  width: 250px;
  height: 20px;
  -webkit-transform: translateX(-125px) translateY(530px) rotateX(90deg) translateY(-60px);
  -moz-transform: translateX(-125px) translateY(530px) rotateX(90deg) translateY(-60px);
  -ms-transform: translateX(-125px) translateY(530px) rotateX(90deg) translateY(-60px);
  -o-transform: translateX(-125px) translateY(530px) rotateX(90deg) translateY(-60px);
  transform: translateX(-125px) translateY(530px) rotateX(90deg) translateY(-60px);
  -webkit-box-shadow: 0 60px 60px black;
  -moz-box-shadow: 0 60px 60px black;
  box-shadow: 0 60px 60px black;
}

@-moz-keyframes rotate-phone {
  0% {
    -moz-transform: rotateY(0);
    transform: rotateY(0);
  }

  100% {
    -moz-transform: rotateY(360deg);
    transform: rotateY(360deg);
  }
}

@-webkit-keyframes rotate-phone {
  0% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
  }

  100% {
    -webkit-transform: rotateY(360deg);
    transform: rotateY(360deg);
  }
}

@-o-keyframes rotate-phone {
  0% {
    -o-transform: rotateY(0);
    transform: rotateY(0);
  }

  100% {
    -o-transform: rotateY(360deg);
    transform: rotateY(360deg);
  }
}

@-ms-keyframes rotate-phone {
  0% {
    -ms-transform: rotateY(0);
    transform: rotateY(0);
  }

  100% {
    -ms-transform: rotateY(360deg);
    transform: rotateY(360deg);
  }
}

@keyframes rotate-phone {
  0% {
    transform: rotateY(0);
  }

  100% {
    transform: rotateY(360deg);
  }
}

@-webkit-keyframes shimmer {
  45% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    opacity: 0.4;
  }
    
  55% {
    -webkit-transform: translateX(-100%);  
    transform: translateX(100%);  
    opacity:0;
  }
}

@-moz-keyframes shimmer {
  45% {
    -moz-transform: translateX(-100%);
    transform: translateX(-100%);
    opacity: 0.4;
  }
    
  55% {
    -moz-transform: translateX(100%);  
    transform: translateX(100%);  
    opacity:0;
  }
}

@-ms-keyframes shimmer {
  45% {
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
    opacity: 0.4;
  }
    
  55% {
    -ms-transform: translateX(100%);  
    transform: translateX(100%);  
    opacity:0;
  }
}

@-o-keyframes shimmer {
  45% {
    -o-transform: translateX(-100%);
    transform: translateX(-100%);
    opacity: 0.4;
  }
    
  55% {
    -o-transform: translateX(100%);  
    transform: translateX(100%);  
    opacity:0;
  }
}

@keyframes shimmer {
  45% {
    transform: translateX(-100%);
    opacity: 0.4;
  }
 
  55% {
    transform: translateX(100%);  
    opacity:0;
  }
}
```