Advertisement
Guest User

Untitled

a guest
Apr 24th, 2014
39
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 1.86 KB | None | 0 0
  1. .tophalf {
  2. position:absolute;
  3. width: 196px; height:100px;
  4. -webkit-border-top-left-radius: 193px;
  5. -webkit-border-top-right-radius: 193px;
  6. -moz-border-radius-topleft: 193px;
  7. -moz-border-radius-topright: 193px;
  8. border-top-left-radius: 193px;
  9. border-top-right-radius: 193px;
  10.  
  11. background: -moz-linear-gradient(left, #db9771 1%, #cc5f7f 51%, #c30380 100%);
  12. background: -webkit-gradient(linear, left top, right top, color-stop(1%,#db9771), color-stop(51%,#cc5f7f), color-stop(100%,#c30380));
  13. background: -webkit-linear-gradient(left, #db9771 1%,#cc5f7f 51%,#c30380 100%);
  14. background: -o-linear-gradient(left, #db9771 1%,#cc5f7f 51%,#c30380 100%);
  15. background: -ms-linear-gradient(left, #db9771 1%,#cc5f7f 51%,#c30380 100%);
  16. background: linear-gradient(to right, #db9771 1%,#cc5f7f 51%,#c30380 100%);
  17. }
  18.  
  19. .inner {
  20. position: relative; z-index: 1;
  21. top: 16px; left: 18px;
  22. width: 160px; height: 160px;
  23. background-color: white;
  24. border-radius: 100%;
  25. }
  26.  
  27. .bottomhalf {
  28. position:absolute;
  29. top:100px;
  30. width: 196px; height:100px;
  31. -webkit-border-bottom-right-radius: 193px;
  32. -webkit-border-bottom-left-radius: 193px;
  33. -moz-border-radius-bottomright: 193px;
  34. -moz-border-radius-bottomleft: 193px;
  35. border-bottom-right-radius: 193px;
  36. border-bottom-left-radius: 193px;
  37.  
  38. background: -moz-linear-gradient(left, #db9771 1%, #edc552 51%, #ffec00 100%);
  39. background: -webkit-gradient(linear, left top, right top, color-stop(1%,#db9771), color-stop(51%,#edc552), color-stop(100%,#ffec00));
  40. background: -webkit-linear-gradient(left, #db9771 1%,#edc552 51%,#ffec00 100%);
  41. background: -o-linear-gradient(left, #db9771 1%,#edc552 51%,#ffec00 100%);
  42. background: -ms-linear-gradient(left, #db9771 1%,#edc552 51%,#ffec00 100%);
  43. background: linear-gradient(to right, #db9771 1%,#edc552 51%,#ffec00 100%);
  44. }
  45.  
  46. <div class='container'>
  47. <div class='tophalf'></div>
  48. <div class='inner'></div>
  49. <div class='bottomhalf'></div>
  50. </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement