html, body, img, a { margin: 0; padding: 0; border: 0; }
body { width:960px; height:540px; color:#4c4c4c; font-family:"Lucida Grande","Lucida Sans Unicode",Arial,Verdana,sans-serif; font-size:12px; font-size-adjust:none; font-style:normal; font-variant:normal; font-weight:normal; line-height:18px; }

h1 { font-size:16px; text-align:center; margin-top:331px; }
h2 { font-size:18px; font-weight:bold; text-align:center; margin-top:19px; }
h3 { font-size:18px; font-weight:normal; margin-bottom:-10px; margin-top: -10px; }

a { color:#0088CC; }
a:link, a:visited, a:active { text-decoration:none; }
a:hover { text-decoration:underline; }
a.more { background:transparent url(/euro/welcomescreen/iwork09/images/morearrow_08c.gif) no-repeat scroll 100% 50%;	padding-right:10px; white-space:nowrap; }
@media only screen {
    a.more { background-image:url(/euro/global/elements/arrows/morearrow_08c.svg); }
}

ul { list-style-image:none; list-style-position:outside; list-style-type:none; }
#MASKED-clicktoplay img.left, #MASKED-clicktoplay img.right { margin-top:20px; }
#MASKED-clicktoplay img.left { margin-left:172px; }
#MASKED-clicktoplay { float:left; height:540px; width:720px; }
body#keynote #MASKED-clicktoplay, body#keynote .endState { background: url('/euro/welcomescreen/iwork09/images/ws_iwork09_keynote-bgnd.jpg') no-repeat 0 60px; }
body#numbers #MASKED-clicktoplay, body#numbers .endState { background: url('/euro/welcomescreen/iwork09/images/ws_iwork09_numbers-bgnd.jpg') no-repeat 0 60px; }
body#pages #MASKED-clicktoplay, body#pages .endState { background: url('/euro/welcomescreen/iwork09/images/ws_iwork09_pages-bgnd.jpg') no-repeat 0 60px; }
#MASKED-clicktoplay p, .endState p { font-size:15px; width:480px; margin:-5px auto; text-align:center; line-height:19px; }
.last { border-left:1px solid #e5e5e5; padding-left:25px; padding-right:25px; padding-bottom:25px; padding-top:35px; float:right; _float:left; width:189px; /* height:480px; */ background-color:#EEE; }
.last p { text-align: left; margin-bottom:0px; }
.last p.push-up { margin-top:-2px; }
.last img.hands-on { margin:25px auto -4px auto; }
a.block { display:block; }
a.block .envelope { margin-bottom:-15px; margin-top:26px; }
h3.epub { margin-top:52px; }
.push-up { margin-top:-6px; }
img.help { margin: -32px 0 -50px -32px; }
p.url { margin-top:26px; }

/* pill buttons */
a.pillbutton { float:left; display:inline-block; position:relative; margin:0 236px; padding-right:43px; font-size:15px; line-height:1.3em; color:#fff; text-decoration:none; outline:none; z-index:2; }
a.pillbutton span,
a.pillbutton b { display:block; width:auto; padding:15px 0; text-align:left; }
a.pillbutton span { padding-right:8px; padding-left:25px; background:url(/euro/global/elements/buttons/pillbevel_leftcap.png) no-repeat 0 50%; _background-image:url(/euro/global/elements/buttons/pill_leftcap.gif); }
a.pillbutton b { position:absolute; width:43px; top:0; right:0; text-indent:-9999px; background:url(/euro/global/elements/buttons/pillbevel_rightcap.png) no-repeat 0 50%; _background-image:url(/euro/global/elements/buttons/pill_rightcap.gif); }
a.pillbutton:hover, #main #hero a.pillbutton:focus { color:#e6e6e6; }
.endState ul a.pillbutton { margin:0 -111px 0 127px; }

/* NEW OverlayPanel quicktime controller */
 .controllerPanel { position:relative; width:640px; height:12px; padding:0; margin:12px 0 0 0; }
 .controllerPanel div.control,
.overlaypanel .controllerPanel div.control { position:relative; width:10px; height:10px; top: -5px; text-indent:-999px; cursor:pointer; overflow:hidden; background:url(/euro/global/elements/overlay/overlay_movie_playpause20070807.gif) no-repeat left top; }
 .controllerPanel div.control.pause { background-position:left -10px; }
 .controllerPanel div.sliderPanel { position:absolute; top:0; left:16px; height:12px; width:624px; }
 .controllerPanel div.sliderPanel div.track,
.overlaypanel .controllerPanel div.sliderPanel div.track { position:absolute; left:0; width:624px; height:12px; text-align:left; background:url(/euro/global/elements/overlay/overlay_movie_bgtrack_load20070807.gif) no-repeat 0 0; }
 .controllerPanel div.sliderPanel div.track div.loadedProgress,
.overlaypanel .controllerPanel div.sliderPanel div.track div.loadedProgress { position:absolute; top:0; height:12px; background:url(/euro/global/elements/overlay/overlay_movie_bgtrack20070807.gif) no-repeat 0 0; }
 .controllerPanel div.sliderPanel div.track div.trackProgress { position:absolute; height:12px; background:none; }
 .controllerPanel div.sliderPanel div.track div.playHead,
.overlaypanel .controllerPanel div.sliderPanel div.track div.playHead { position:absolute; top:-1px; margin:0 1px; width:13px; height:12px; background:url(/euro/global/elements/overlay/overlay_movie_pointer20070807.png) no-repeat 0 0; cursor:pointer; behavior:url(/euro/global/scripts/lib/iepngfix.htc); }
 .controllerPanel.inactive { display: none; }
 div.overlayPanelContent { left: 12px; }
.popped .closeButtonContainer { left: -17px; top: -15px; }
.popped a.close { left: 0px; width: 60px; }

#mov { float:left; height:540px; width:720px; }
.endState { float:left; height:540px; width:720px; margin:-50px -37px; }
#videocontent, #MASKED-videocontent { display:none; }
.swapView #MASKED-videocontent { display:block; margin:50px 37px; }

/* Update Page */
body.update { width:870px; }
.update h1 { margin-top:40px; }
.update img.new { position:absolute; top:0; left:0; }
.update { padding-left:90px; width:630px; }
.update #mov h1, .update #mov h2, .update #mov h3, .update #mov p { text-align:left; }
.update #mov h2 { margin-top:-12px; font-weight:normal; }
.update #mov p { width:auto; margin-bottom:20px; }
.update #mov p.intro { font-weight:bold; color:#666; font-size:15px; margin-top:-6px; }
.update #mov p.bottom { font-size:14px; }
.update #mov img.push-left { margin-left:30px; }
.update video { position:absolute; top:176px; left:258px; }
.update #mov { width:630px; }

@media only screen and (max-device-width: 768px) {
.swapView #MASKED-videocontent { display:block; margin:250px 37px 50px; }
}