Advertisement
hogash

imag carousel

Apr 10th, 2012
69
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.05 KB | None | 0 0
  1. /* PORTFOLIO CATEGORY */
  2. .project {margin-bottom:35px; padding-bottom:20px; border-bottom:1px solid #eaeaea;}
  3. .project h3 {font:16px/1.4 'CartoGothicStdBook', arial, serif; padding-top:10px; text-transform:uppercase; color:#111;}
  4. .project .we_did li {width:160px; display:inline-block;}
  5. .project .images-carousel { height: 300px; overflow:hidden;
  6. outline: 2px solid rgba(0, 0, 0, 0.2);
  7. -moz-transition: outline 250ms ease-in;
  8. -webkit-transition: outline 250ms ease-in;
  9. -o-transition: outline 250ms ease-in;
  10. transition: outline 250ms ease-in;
  11. }
  12. .project .images-carousel:hover { outline: 6px solid rgba(0, 0, 0, 0.4); }
  13. .project .images-carousel .viewport { float: left; width: 540px; height: 300px; overflow: hidden; position: relative; }
  14. .project .images-carousel .buttons-container {width:65px; height:32px; position:absolute; left:50%; margin-left:-33px; bottom:14px;}
  15. .project .images-carousel .buttons { background: url("../images/plus-sprite.png") no-repeat scroll 0 0 transparent; cursor: pointer; display: block; height: 32px; text-indent: -9999px; width: 32px; float:left; }
  16. .project .images-carousel .prev { background-position: 0 -32px;
  17. -webkit-border-top-left-radius: 3px;
  18. -webkit-border-bottom-left-radius: 3px;
  19. -moz-border-radius-topleft: 3px;
  20. -moz-border-radius-bottomleft: 3px;
  21. border-top-left-radius: 3px;
  22. border-bottom-left-radius: 3px;}
  23. .project .images-carousel .prev:hover{background-position: 0 0;}
  24. .project .images-carousel .next { margin-left:1px; background-position: -32px -32px;
  25. -webkit-border-top-right-radius: 3px;
  26. -webkit-border-bottom-right-radius: 3px;
  27. -moz-border-radius-topright: 3px;
  28. -moz-border-radius-bottomright: 3px;
  29. border-top-right-radius: 3px;
  30. border-bottom-right-radius: 3px;
  31. }
  32. .project .images-carousel .next:hover{background-position: -32px 0;}
  33.  
  34. .project .images-carousel .disable { opacity:0.5; filter:alpha(opacity=50) }
  35. .project .images-carousel .overview { list-style: none; position: absolute; padding: 0; margin: 0; left: 0; top: 0;}
  36. .project .images-carousel .overview li { float: left; height: 300px; width: 540px; }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement