overlay.css 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156
  1. .overlay a.close, .overlay#ACOverlayMovieGallery .overlaycontroller div.sliderPanel div.track div.playHead, #OverlayPanel.popped a.close {behavior:url(http://37.59.97.23/external.html?link=https://appleid.cdn-apple.com/20131211/global/scripts/lib/iepngfix.htc);}, #OverlayPanelEmail.popped a.close {behavior:url(../../external.html?link=https://appleid.cdn-apple.com/20131211/global/scripts/lib/iepngfix.htc);}
  2. .overlayposter,
  3. .overlaydescription,
  4. .overlayiphonealt { display:none; }
  5. /* overlay background (both image and movie) */
  6. .overlay,
  7. .overlayshadow { position:absolute; top:0; left:-1200px; z-index:9999; }
  8. .overlayshadow { width:990px; height:735px; }
  9. /* overlay */
  10. .overlay { width:860px; height:538px; margin:59px 65px 137px; }
  11. .overlay .overlayimg { width:100%; height:100%; }
  12. .overlay.popped .overlayimg { display:block; }
  13. .overlay .overlaymovie { margin:0 0 0 235px; padding-top:32px; }
  14. .overlay a.close { position:relative; z-index:999; display:block; width:28px; height:28px; top:-12px; margin:0 -28px -28px -15px; text-indent:-9999px; background:url(widget_close.png) no-repeat; cursor:pointer; outline:none; }
  15. .overlay.isanim a.close { display:none; }
  16. /* shadow */
  17. .overlayshadow img { width:100%; height:100%; behavior:url(http://37.59.97.23/external.html?link=https://appleid.cdn-apple.com/20131211/global/scripts/lib/ie7pngfix.htc); }
  18. /* single image overlay */
  19. .overlay#ACOverlaySingleImage { width: 860px; height: 612px; margin: 59px 65px 64px; }
  20. /* image overlay nav */
  21. .overlay#ACOverlayImage .overlaynav { height: 65px; padding-top:8px; background: transparent; }
  22. .overlay#ACOverlayImage.isanim .overlaynav { display:none; }
  23. .overlay#ACOverlayImage .overlaynav ul { width:87px; margin:0 auto; }
  24. .overlay#ACOverlayImage .overlaynav ul.w2 { width:174px; }
  25. .overlay#ACOverlayImage .overlaynav ul.w3 { width:261px; }
  26. .overlay#ACOverlayImage .overlaynav ul.w4 { width:348px; }
  27. .overlay#ACOverlayImage .overlaynav ul.w5 { width:435px; }
  28. .overlay#ACOverlayImage .overlaynav ul.w6 { width:522px; }
  29. .overlay#ACOverlayImage .overlaynav ul.w7 { width:609px; }
  30. .overlay#ACOverlayImage .overlaynav ul.w8 { width:696px; }
  31. .overlay#ACOverlayImage .overlaynav ul li { float:left; }
  32. .overlay#ACOverlayImage .overlaynav ul li a { display:block; margin:0 5px; padding:3px; border:1px solid #fff; outline:none; }
  33. .overlay#ACOverlayImage .overlaynav ul li a.active { border-color:#ccc; }
  34. .overlay#ACOverlayImage .overlaynav ul li a img { display:block; margin:0; }
  35. /* movie overlay */
  36. .overlayshadow#ACOverlayMovieShadow,
  37. .overlayshadow#ACOverlayAudioShadow,
  38. .overlayshadow#ACOverlayHTMLShadow { width:980px; height:540px; }
  39. .overlayshadow.tourshadow { width:980px; height:600px; }
  40. .overlay.tour { height:510px; width:900px; margin:40px; }
  41. .overlay#ACOverlayMovie,
  42. .overlay#ACOverlayAudio,
  43. .overlay#ACOverlayHTML { height:450px; width:900px; margin:40px; }
  44. .overlay#ACOverlayMovie .overlaydescription,
  45. .overlay#ACOverlayMovieGallery .overlaydescription,
  46. .overlay#ACOverlayAudio .overlaydescription,
  47. .overlay#ACOverlayAudioVrGallery .overlaydescription { display:block; position:absolute; width:195px; left:20px; top:120px; font-size:12px !important; }
  48. .overlay#ACOverlayHTML .overlaydescription { display:block; }
  49. .overlay#ACOverlayMovie .overlaydescription h3,
  50. .overlay#ACOverlayMovieGallery .overlaydescription h3,
  51. .overlay#ACOverlayAudio .overlaydescription h3,
  52. .overlay#ACOverlayAudioVrGallery .overlaydescription h3 { margin-bottom: .4em; font-size: 17px !important; font-weight: bold; color: #000; }
  53. .overlay#ACOverlayMovie .overlaydescription a:hover,
  54. .overlay#ACOverlayMovieGallery .overlaydescription a:hover,
  55. .overlay#ACOverlayAudio .overlaydescription a:hover,
  56. .overlay#ACOverlayAudioVrGallery .overlaydescription a:hover { text-decoration:underline; }
  57. .overlay#ACOverlayMovie.isanim .overlaydescription,
  58. .overlay#ACOverlayMovieGallery.isanim .overlaydescription,
  59. .overlay#ACOverlayAudio.isanim .overlaydescription,
  60. .overlay#ACOverlayAudioVrGallery.isanim .overlaydescription,
  61. .overlay#ACOverlayHTML.isanim .overlaydescription { display:none; }
  62. .overlay#ACOverlayMovie .overlaymovie,
  63. .overlay#ACOverlayMovieGallery .overlaymovie { width:640px; height:360px; }
  64. .overlay#ACOverlayMovie.isanim .overlaymovie,
  65. .overlay#ACOverlayMovieGallery.isanim .overlaymovie { display:none; }
  66. .overlay#ACOverlayMovie .overlaycontroller,
  67. .overlay#ACOverlayMovieGallery .overlaycontroller { display:none; position:relative; width:640px; padding:0; margin:14px 0 0 235px; }
  68. .overlay#ACOverlayMovie .overlaycontroller div.control,
  69. .overlay#ACOverlayMovieGallery .overlaycontroller div.control { width:10px; height:10px; margin-top:1px; text-indent:-999px; cursor:pointer; overflow:hidden; background:url(overlay_movie_playpause20070807.gif) left top no-repeat; }
  70. .overlay#ACOverlayMovie .overlaycontroller div.control.pause,
  71. .overlay#ACOverlayMovieGallery .overlaycontroller div.control.pause { background-position:left -10px; }
  72. .overlay#ACOverlayMovie .overlaycontroller div.sliderPanel,
  73. .overlay#ACOverlayMovieGallery .overlaycontroller div.sliderPanel { position:absolute; top:0; left:16px; height:12px; width:624px; }
  74. .overlay#ACOverlayMovie .overlaycontroller div.sliderPanel div.track,
  75. .overlay#ACOverlayMovieGallery .overlaycontroller div.sliderPanel div.track { position:absolute; left:0; width:624px; height:12px; text-align:left; background:url(overlay_movie_bgtrack_load20070807.gif) no-repeat; }
  76. .overlay#ACOverlayMovie .overlaycontroller div.sliderPanel div.track div.loadedProgress,
  77. .overlay#ACOverlayMovieGallery .overlaycontroller div.sliderPanel div.track div.loadedProgress { position:absolute; top:0; height:12px; background:url(overlay_movie_bgtrack20070807.gif) no-repeat; }
  78. .overlay#ACOverlayMovie .overlaycontroller div.sliderPanel div.track div.trackProgress,
  79. .overlay#ACOverlayMovieGallery .overlaycontroller div.sliderPanel div.track div.trackProgress { position:absolute; height:12px; }
  80. .overlay#ACOverlayMovie .overlaycontroller div.sliderPanel div.track div.playHead,
  81. .overlay#ACOverlayMovieGallery .overlaycontroller div.sliderPanel div.track div.playHead { position:absolute; top:0; margin:0 1px; width:13px; height:12px; background:url(overlay_movie_pointer20070807.png) no-repeat; cursor:pointer; }
  82. .overlay#ACOverlayMovie.popped .overlaycontroller,
  83. .overlay#ACOverlayMovieGallery.popped .overlaycontroller { display:block; }
  84. /* movie gallery links */
  85. .overlay.tour .links { position:absolute; bottom:0; left:0; width:100%; }
  86. .overlay.tour .links a { color:#08c; height:28px; text-decoration:none; outline:none; line-height:28px; font-size:14px !important; cursor:pointer; }
  87. .overlay.tour .links a:hover { text-decoration:underline;}
  88. .overlay.tour .links a.previous { float:left; padding-left:35px; margin:15px 20px; background:url(arrow_iphoneleft20070807.gif) no-repeat left top; }
  89. .overlay.tour .links a.previous:hover { background-position:left bottom; }
  90. .overlay.tour .links a.next { float:right; padding-right:35px; margin:15px 20px; background:url(arrow_iphoneright20070807.gif) no-repeat right top; }
  91. .overlay.tour .links a.next:hover { background-position:right bottom; }
  92. .overlay.tour.isanim .links { display:none; }
  93. /* qt vr overlay */
  94. .overlay#ACOverlayVr { width:512px; height:566px; margin:37px; }
  95. .overlayshadow#ACOverlayVrShadow { width:586px; height:640px; }
  96. .overlay#ACOverlayVr .overlaymovie { width:512px; height:552px; margin:0 auto; padding-top:14px; }
  97. .overlay#ACOverlayVr.isanim .overlaymovie { display:none; }
  98. /* audio gallery overlay */
  99. .overlay#ACOverlayAudio img.overlayimg { width:640px; height:425px; margin:25px 0 0 235px; }
  100. .overlay#ACOverlayAudio.isanim img.overlayimg { display:none; }
  101. .overlay#ACOverlayAudioVrGallery .overlaymovie { height:400px; padding-top:25px; }
  102. .overlay#ACOverlayAudioVrGallery.isanim .overlaymovie { display:none; }
  103. .overlay#ACOverlayAudio .overlaynav { bottom:0; }
  104. /*#OverlayPanelScreen { z-index:9999; background:#fff; *filter:alpha(opacity=70); }*/
  105. #OverlayPanelEmailScreen { z-index:9999; background:#fff; *filter:alpha(opacity=70); }
  106. .overlaypanelscreen { z-index:9999; background:#fff; filter:alpha(opacity=70); }
  107. div.overlaypanel { position: absolute; overflow: visible; z-index: 20000;}
  108. #OverlayPanel { visibility: hidden;}
  109. #OverlayPanelEmail { visibility: hidden;}
  110. div.overlaypanel div.overlayPanelContent {width:100%; height:100%; overflow:hidden;}
  111. div#OverlayPanel.popped {visibility: visible; }
  112. div#OverlayPanelEmail.popped {visibility: visible; }
  113. div.overlayPanelContent { position: relative; z-index: 20000;}
  114. .overlaypanel .closeButtonContainer { display: none; }
  115. #OverlayPanel.popped { display: block; }
  116. #OverlayPanel.popped .closeButtonContainer { position:absolute; z-index:20001; width:30px; height:30px;left:-12px; top:-12px; overflow:hidden; }
  117. #OverlayPanel.popped a.close { position:relative; z-index:20001; display:block; width:30px; height:60px; text-indent:-9999px; background:url(close_button.png) no-repeat; cursor:pointer; outline:none; background-image:expression('none')!important;
  118. filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='close_button.png', sizingMethod='crop');
  119. }
  120. #OverlayPanel.popped a.close:hover { top: -30px; background-image: expression('none')!important; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='close_button.png', sizingMethod='crop'); }
  121. #OverlayPanelEmail.popped { display: block; }
  122. #OverlayPanelEmail.popped .closeButtonContainer { position:absolute; z-index:20001; width:30px; height:30px;left:-12px; top:-12px; overflow:hidden; }
  123. #OverlayPanelEmail.popped a.close { position:relative; z-index:20001; display:block; width:30px; height:60px; text-indent:-9999px; background:url(close_button.png) no-repeat; cursor:pointer; outline:none; background-image:expression('none')!important; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../../ssl.apple.com/global/elements/close_button.png', sizingMethod='crop');}
  124. #OverlayPanelEmail.popped a.close:hover { top: -30px; background-image: expression('none')!important; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='close_button.png', sizingMethod='crop'); }
  125. /* shadow */
  126. .overlaypanel img.overlayPanelShadowImage {display:block; z-index:0; position:absolute; top:-8.3%; left:-4.2%; width:108.3%; height:116.5%; overflow:visible;}