/* Motion CSS */

/* globalheader updates */
#motion #globalheader { background:#2b2b2b; background:rgba(85,85,85,0.5); }
@media only screen and (max-device-width: 767px) {
	#motion #globalheader .gh-nav-view { background:#2b2b2b; background:rgba(85,85,85,0.5); }
}

#motion .divider-bottom { border-bottom:1px solid #ddd; }
#motion .divider-bottom-dark { margin-top:38px; border-color:#333; }
#motion .black-bg.offblack { margin-top:-1px; border-top:1px solid #000; }
#motion .copy-link { margin-bottom:9px; }

#motion #main .section { width:980px; margin-top:64px; margin-left:auto; margin-right:auto; padding-top:90px; border-top:1px solid #e6e6e6; }

#motion p.intro { font-size:1em; padding:0 100px; margin-bottom:75px; }
#motion .column { width:400px; padding-right:80px; }
#motion .column h2 { padding:17px 0 5px; }
#motion .block { margin:15px 0 27px; }

#motion #hero { margin-top:40px; }
#motion #hero.sticky { margin-top:0; padding-top:40px; }
#motion #hero h1,
#motion #hero h2 { position:relative; z-index:2; }
#motion #hero h2 { margin-top:-16px; }
#motion #hero .hero-image { position:relative; margin:40px auto 0; z-index:1; }

#motion .download-now { padding:45px 0 25px; }
#motion .download-now p { width:840px; margin-bottom:18px; }
#motion .download-now .cta-download { display:inline-block; padding:2px 0 0 36px; min-height:30px; background:url(http://images.apple.com/v/final-cut-pro/f/images/download_arrow.png) no-repeat; *display:inline; *position:relative; *padding-bottom:7px; }

#motion #main .scroll-nav { margin-top:35px; font-size:.85em; }
#motion #main .scroll-nav .scrollToAnchor { width:163px; padding-bottom:12px; }
#motion #main .scroll-nav .scrollToAnchor p { margin-bottom:2px; }

#motion #main #video-swap { width:980px; padding-bottom:50px; }
#motion #main #video-swap .hero-video-swap { width:980px; }
#motion #main #video-swap .play-icon { position:relative; display:block; width:100px; height:100px; margin-top:-300px; background:url(http://images.apple.com/v/final-cut-pro/f/images/play_button_white.png) no-repeat; }
#motion #main #video-swap .icon:hover .play-icon { background:url(http://images.apple.com/v/final-cut-pro/f/images/play_button_blue.png) no-repeat; }
#motion #main #video-swap .close { display:block; float:left; width:30px; height:30px; background:url(http://images.apple.com/v/final-cut-pro/f/images/close.png) 0 0 no-repeat; background-size:30px 30px; text-indent:-9999em; }
#motion #main #video-swap .hero-video-swap-trigger { display:block; position:relative; height:551px; width:979px; }
#motion #main #video-swap .moviePanel { width:848px; height:480px; margin:0 auto; }

#motion#main .rounded { border-radius: 15px; }

#motion #buystrip + .sosumi { border-color:#333; }

@media only screen {
	#motion #main #video-swap .play-icon {
		background-image: url(/v/final-cut-pro/f/images/play_white.svg);
	}
	#motion #main #video-swap .icon:hover .play-icon {
		background-image: url(/v/final-cut-pro/f/images/play_blue.svg);
	}
}

@media only screen {
	#motion #main #video-swap .close {
		background-image:url(/v/final-cut-pro/f/images/close.svg);
	}
}

#motion #main #titles { margin-top:10px; padding-top:90px; border-top:none; }
#motion #main #motion-graphics { padding-top:90px; }

#motion #output .pro-res .legal { margin-top:16px; padding-top:8px; width:150px; font-size:.8em; border-top:1px solid #ddd; }
#motion #output { margin-bottom:75px; }
#motion #main .promo { width:980px; margin:0 auto; padding:0; color:#999; }
#motion #main .promo .grid2col { position:relative; padding-top:95px; z-index:1; overflow:hidden; }
#motion #main .promo .first { min-height:305px; }
#motion #main .promo p { width:420px; }
#motion #main .promo img.right { position:absolute; float:none; margin:0; bottom:0; right:-15px; z-index:1; }

#motion #ac-globalfooter { background-color: #202020; }

/* Sub-pixel rendering fix for iPad with Retina */
@media only screen and (-webkit-min-device-pixel-ratio:1.5) and (min-device-width:481px)
and (max-device-width:768px), only screen and (min-device-pixel-ratio:1.5) and
(min-device-width:481px) and (max-device-width:768px) {
	#motion #main .promo img.right { bottom:-1px; }
}
