home *** CD-ROM | disk | FTP | other *** search
/ developer.apple.com / developer.apple.com.tar / developer.apple.com / videos / styles / videos.css
Cascading Style Sheet File  |  2010-06-17  |  8KB  |  96 lines
  1. /* styles for Development Videos */
  2.  
  3. .videos a.block, a.block:hover { color:#000; display:block; text-decoration:none; }
  4. .videos div.block a:hover { text-decoration:none; }
  5. .videos div.block a em.more { background:transparent url(http://images.apple.com/global/elements/arrows/morearrow_08c.gif) no-repeat scroll 100% 0.4em; color:#08c; font-style:normal; padding-right:10px; white-space:nowrap; }
  6. .videos div.block a:hover em.more { text-decoration:underline; }
  7. .videos a.block:hover h2,
  8. .videos a.block:hover h3 { color:#08c !important; }
  9.  
  10. .videos .bottom-callout { clear:both; margin:0 -23px -17px; padding:0; background:#e9e9e9 url(http://devimages.apple.com/videos/images/bottom-callout-bg.png) repeat-x; border-top:1px solid #d8d8d8; height:49px; line-height:49px; width:980px; text-align:center; }
  11. .videos div.block a.more { background-position:100% 50%; }
  12. .videos .bottom-callout img { vertical-align: middle; margin-right: 5px; display: inline; }
  13. .videos .bottom-callout img.divider { margin-left:26px; margin-right:22px; }
  14. .videos .bottom-callout img.callout-itunes { margin-left:23px; }
  15.  
  16. .videos #main #content { padding: 43px 25px 20px !important; }
  17.  
  18. /* Overview */
  19. #overview.videos #main #content .hero { margin: 0 -23px; padding: 0 0 0 41px; height: 350px; }
  20. #overview.videos #main #content .hero img.hero-image.right{margin:34px 60px 16px;}
  21. #overview.videos #main #content .hero h1 { padding-top: 23px;}
  22. #overview.videos #main #content .hero p.intro { font-size: 14px; line-height: 1.5em; width: 475px; }
  23. #overview.videos #main #content .hero .wwdc img.wwdcvideos{float:left;margin-right:20px}
  24. #overview.videos #main #content .hero .wwdc h3{padding-top:4px;font-size:12px;}
  25. #overview.videos #main #content .hero .wwdc h3 img.videosnew{display:inline;padding-left:10px;margin-bottom:-1px;}
  26. #overview.videos #main #content .hero .wwdc p{color:#797C80;}
  27.  
  28. #overview.videos #main #content .grid3col .column { width: 276px; padding: 15px 25px 30px 0; margin: 0 0 0 25px; border-right: 1px solid #e0e0e0; }
  29. #overview.videos #main #content .grid3col .column p { color: #666; }
  30. #overview.videos #main #content .grid3col .column img { margin-top: 5px; }
  31. #overview.videos #main #content .grid3col .column.last { border-right: none; padding-right: 2px; }
  32.  
  33.  
  34. /* pillbuttons */
  35. a.pillbutton { display:inline-block; position:relative; padding-right:43px; font-size:15px; line-height:1.3em; color:#fff; text-decoration:none; outline:none; z-index:2; }
  36. a.pillbutton, x:-moz-any-link { display:block; width:14em; margin:0 auto; } /* this is for firefox2 because inline-block doesn't work */
  37. a.pillbutton, x:-moz-any-link, x:default { display:inline-block; width:auto; } /* firefox3 reset */
  38. a.pillbutton span,
  39. a.pillbutton b { display:block; width:auto; padding:15px 0; text-align:left; }
  40. a.pillbutton span { padding-right:8px; padding-left:25px; background:url(http://devimages.apple.com/assets/elements/buttons/pillbevel_leftcap.png) no-repeat 0 50%; _background-image:url(http://devimages.apple.com/assets/elements/buttons/pill_leftcap.gif); }
  41. a.pillbutton b { position:absolute; width:43px; top:0; right:0; text-indent:-9999px; background:url(http://devimages.apple.com/assets/elements/buttons/pillbevel_rightcap.png) no-repeat 0 50%; _background-image:url(http://devimages.apple.com/assets/elements/buttons/pill_rightcap.gif); }
  42. a.pillbutton:hover, a.pillbutton:focus { color:#e6e6e6; }
  43.  
  44.  
  45. /* Development Video Previews */
  46. .videos.previews #main #content { padding: 0 !important; }
  47. .videos.previews #main #content .hero { padding: 46px 0 0; margin: 0 40px 25px; border-bottom: 1px solid #e0e0e0; }
  48. .videos.previews #main #content .hero h1 { margin-bottom: .75em; }
  49. .videos.previews #main #content .hero p.intro { font-size: 16px; margin-bottom: 1em; }
  50.  
  51. .videos.previews #main #content #video-container { padding: 0 40px 50px; margin: 0 2px; border-bottom: 1px solid #e0e0e0; }
  52.  
  53. .videos.previews .video-lists { margin: 0 2px; padding: 22px 40px; background: url(http://devimages.apple.com/videos/images/videos-list-background-gradient.png) repeat-x 0 -1px; }
  54. .videos.previews .video-lists .grid2col .column.first { width: 45%; padding-right: 40px; border-right: 1px solid #e0e0e0; }
  55. .videos.previews .video-lists .grid2col .column.last { width: 45%; }
  56. .videos.previews .video-lists h2.title { font-size: 1.2em; font-weight: normal; margin-bottom: 1.35em; }
  57. .videos.previews .video-lists h3 { padding-top: 7px; margin-bottom: 0; }
  58. .videos.previews .video-lists p.intro { font-size: .9em; width: 295px; margin-bottom: 0; line-height: 1.5em; }
  59. .videos.previews .video-lists img.left { margin-bottom: 0; }
  60. .videos.previews .video-lists img.new { margin-left: 15px; }
  61.  
  62. .videos.previews  ul.video-list { margin-left: -25px; padding-top: 30px; clear: both; }
  63. .videos.previews  ul.video-list li { margin-bottom: 9px; font-size: .9em; }
  64. .videos.previews  ul.video-list li a { height: 19px; padding-left: 25px; display: inline-block; color: #333; line-height:19px; outline: none; }
  65. .videos.previews  ul.video-list li a:hover { color: #08c; text-decoration: none; }
  66. .videos.previews  ul.video-list li a.visited { background: url(http://devimages.apple.com/videos/images/videos-video-trigger-visited.png) no-repeat 5px 50%; }
  67. .videos.previews  ul.video-list li a.active { background: url(http://devimages.apple.com/videos/images/videos-video-trigger-left-cap.png) no-repeat; }
  68. .videos.previews  ul.video-list li a.active span { background: url(http://devimages.apple.com/videos/images/videos-video-trigger-right-cap.png) no-repeat 100% 0; height: 19px; display: block; padding-right: 25px; }
  69.  
  70. .videos.previews #video-container .clicktoplay .movie { text-align: center; padding-top: 190px; height: 250px; background: url(http://devimages.apple.com/videos/images/video-placeholder.jpg) no-repeat; }
  71. .videos.previews #video-container .moviePanel { background: url(http://devimages.apple.com/assets/elements/quicktime/qt_loading560x352.gif) no-repeat 50% 50%; }
  72.  
  73. .videos.previews #video-container .video-container .endState { text-align: center; background: url(http://devimages.apple.com/assets/elements/quicktime/qt_endstate640x400.jpg) no-repeat 50% 50%; }
  74. .videos.previews #video-container .video-container .endState .pillbutton { margin-top: 34%; }
  75.  
  76. .videos.previews #video-container { height: 355px; }
  77. .videos.previews #video-container .video-container { position: absolute; width: 900px; }
  78. .videos.previews #video-container .video-container .endState,
  79. .videos.previews #video-container .video-container .movie .moviePanel,
  80. .videos.previews #video-container .video-container .movie-loading-panel_540x405 { width: 448px; height: 336px; }
  81. .videos.previews #video-container .column.last { padding-top:5px; width: 300px; padding-right: 10px; width:410px; }
  82. .videos.previews #video-container .column.first { width:458px; }
  83. .videos.previews #video-container .column.last h3 { margin-bottom: .5em; }
  84. .videos.previews #video-container .column.last p,
  85. .videos.previews #video-container .column.last li { font-size: 11px; }
  86. .videos.previews #video-container .column.last ul li.video a,
  87. .videos.previews #video-container .column.last ul li.devtopic a { padding-left: 23px; margin: 2px 0 6px 5px; color: #000; height: 20px; display: inline-block; }
  88. .videos.previews #video-container .column.last ul li.video a:hover,
  89. .videos.previews #video-container .column.last ul li.devtopic a:hover { color: #08c; text-decoration: none; }
  90. .videos.previews #video-container .column.last ul li.video a { background: url(http://devimages.apple.com/assets/elements/icons/16x16/video.gif) no-repeat 0 50%; }
  91. .videos.previews #video-container .column.last ul li.devtopic a { background: url(http://devimages.apple.com/assets/elements/icons/16x16/devtopic.gif) no-repeat 0 50%; }
  92. .videos.previews #video-container .column.last .sosumi { border-top: 1px solid #e0e0e0; padding-top: 20px; }
  93. .videos.previews #video-container .column.last .sosumi p { font-size: 10px; }
  94.  
  95.  
  96.