.shadow { box-shadow: rgba(0,0,0,0.4) 0 1px 3px; -webkit-box-shadow: rgba(0,0,0,0.4) 0 1px 3px; -mox-box-shadow: rgba(0,0,0,0.4) 0 1px 3px; -o-box-shadow: rgba(0,0,0,0.4) 0 1px 3px; -ms-box-shadow: rgba(0,0,0,0.4) 0 1px 3px; }

/*---- layout ----*/
html { -webkit-font-smoothing: antialiased; }
html, body { background: #f8f8f8; }
#main { margin: 0 auto 18px; width: 980px; }
#main.stripe { background: url(/ca/mobileme/images/content_stripe_bg20100518.png) repeat-y 0 0; padding: 0 50px 45px 0; width: 930px; }
.badge_new { vertical-align: middle; }

/*---- product header ----*/
#productheader h1 a { width: 129px; background-image: url(/ca/mobileme/images/productnav_title20080609.gif); }

#productheader a.freetrial, #productheader span.freetrial {width: 100px;} /*CA FR Fix */

.pricing   #productheader ul#productnav li#pn-pricing a,
.whatsnew  #productheader ul#productnav li#pn-whatsnew a,
.features  #productheader ul#productnav li#pn-services a,
.tutorials #productheader ul#productnav li#pn-tutorials a { color: #999; }
#pricing   #productheader ul#productnav li#pn-pricing a,
#whats-new  #productheader ul#productnav li#pn-whatsnew a,
#features  #productheader ul#productnav li#pn-services a,
#tutorials #productheader ul#productnav li#pn-tutorials a { color: #999 !important; cursor: default; }

/*-- sosumi --*/
.sosumi_features {clear: both; width: 940px; margin: 0 auto; padding: 9px 20px 0; text-align: center; }

/*---- sidenavs ----*/
#sidenav { float: left; width: 204px; padding-top: 15px;  }
#sidenav ul { margin: 0; }
#sidenav ul.rule { padding-top: 20px; background: url(/ca/mobileme/features/images/sidenav_rule20080609.gif) no-repeat 18px 10px; }
#sidenav ul li { clear: left; line-height: 35px; padding: 0; *height: 35px; }
#sidenav ul li a { background: url(/ca/mobileme/features/images/sidenav_arrow_20100622.png) no-repeat 90% -4px; color: #666; display: block; position: relative; padding: 4px 30px 3px 66px; outline: none; text-decoration: none; }
#sidenav ul li a:hover { color: #08c; background-position: 90% -58px; }
#sidenav ul li a img { display: block; position: absolute; top: 4px; left: 8px; *top: -7px; behaviour: url(/global/scripts/lib/iepngfix.htc); }
#sidenav ul li a img.for-ie { *left: -56px; }

#sidenav #sn-mail { *height: 53px; }
#sidenav #sn-mail a { background-position: 90% 0; line-height: 1.2; min-height: 40px; padding-top: 13px; *height: 40px; }
#sidenav #sn-mail a img { *top: 4px; *left: 8px; }
#sidenav #sn-mail a:hover { background-position: 90% -54px; }


#sidenav #sn-findmyiphone { *height: 53px; }
#sidenav #sn-findmyiphone a { background-position: 90% 0; line-height: 1.2; min-height: 35px; padding-top:7px; *height: 40px; }
#sidenav #sn-findmyiphone a img { *top: 4px; *left: 8px; }
#sidenav #sn-findmyiphone a:hover { background-position: 90% -54px; }

.features#mcc			#sidenav #sn-mail,
.features#gallery		#sidenav #sn-gallery,
.features#idisk			#sidenav #sn-idisk,
.features#findmyiphone	#sidenav #sn-findmyiphone,
.features#medotcom		#sidenav #sn-medotcom,
.features#mac			#sidenav #sn-mac,
.features#pc			#sidenav #sn-pc,
.features#iphone		#sidenav #sn-iphone,
.features#ipad			#sidenav #sn-ipad { background: #f5f5f5 url(/ca/mobileme/features/images/sidenav_item_bg20080609.gif) repeat-x 0 100%; }
.features#mcc			#sidenav #sn-mail a { background-position: 90% -108px; }
.features#gallery		#sidenav #sn-gallery a,
.features#idisk			#sidenav #sn-idisk a,
.features#findmyiphone	#sidenav #sn-findmyiphone a,
.features#medotcom		#sidenav #sn-medotcom a,
.features#mac			#sidenav #sn-mac a,
.features#pc			#sidenav #sn-pc a,
.features#iphone		#sidenav #sn-iphone a,
.features#ipad			#sidenav #sn-ipad a { color: #000; background-position: 90% -112px; cursor: default; }

#sidenav #badge_mailbeta { background:url(/ca/mobileme/features/images/badge_iPad_bg20100326.png) no-repeat; height: 182px; margin: 30px auto 0; padding: 12px 0 0; width: 162px; text-align: center; }
#sidenav #badge_mailbeta a { display: block; float: left; text-decoration: none; }
#sidenav #badge_mailbeta p { color: #000; font-size: 14px; line-height: 1.3; margin: 3px 0 0; padding: 0; }
#sidenav #badge_mailbeta .more { background: url(/ca/global/elements/arrows/morearrow_08c.gif) no-repeat 100% 60%; color: #08c; font-size: 12px; padding-right: 10px; }
#sidenav #badge_mailbeta a:hover .more { text-decoration: underline; }

/*---- elements ----*/
#main .center { text-align: center; }
/*#main h2 { margin-bottom: 2em; }*/
#main .end { margin-bottom: 0; }
#main li.end { margin-right: 0 !important; }
#main .intro { font-size: 18px; line-height: 1.3em; color: #777; font-weight: normal; margin-bottom: 80px; }
#main .intro span { color: #000; }
#main img.right.flushright { position: relative; margin-right: -48px; z-index: 10; }
p.underpromos { margin-bottom: 0; }

/*---- hr ----*/
#main .hr { position: relative; margin: 0 -2px; height: 38px; background: #f8f8f8; }
#main .hr .maincap.bottom { top: 0; }
#main .hr .maincap.top { bottom: 0; top: auto; }
#main .hr hr { display: none; }

#main div.inaction { width: 264px; min-height: 310px; padding: 18px 18px 0; background: url(/ca/mobileme/images/inaction_callout20080609.gif) no-repeat 0 0; }
#main div.inaction a.thumb { display: block; width: 89px; float: left; margin-left: 0; margin-top: 60px; }
#main div a.title { display: block; width: 130px; float: left; margin-left: 15px; margin-top: 80px; line-height: 1.4em; }
#main img.badge { margin: 0 0 -7px 10px; }

/*---- callouts ----*/
#main .callout { background: #fcfcfc; border-top: 2px solid #dedede; border-left: 1px solid #dedede; border-right: 1px solid #dedede; border-bottom: 1px solid #f2f2f2; float: left; margin: 0 0 1.5em; padding: 20px; position: relative; width: 80%; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; -ms-border-radius: 4px; border-radius: 4px; }
#main .callout .thumb { background: #fff; float: left; padding: 5px; z-index: 1; }
#main .callout .thumb img { display: block; }
#main .callout h3,
#main .callout h4 { font-size: 12px; }
#main .callout h3,
#main .callout h4,
#main .callout p { margin-left: 184px; }

#main .video_pop { background: #fff; float: right; font-size: 12px; margin-left: 20px; margin-top: 18px; padding: 8px; position: relative; width: 114px; z-index: 3; }
#main .video_pop .OverlayPanel { text-align: center; }
#main .video_pop .OverlayPanel img { border: 5px solid #fff; display: block; margin-bottom: 5px; margin-left: 3px; }
#main .video_pop .enlarge { background: url(/ca/global/elements/buttons/icon-play.png) no-repeat 0 0; height: 25px; position: absolute; top: 0; left: 0; width: 25px; z-index: 3; behaviour: url(/global/scripts/lib/iepngfix.htc); }
#main .video_pop .more { background: url(/ca/global/elements/arrows/morearrow_08c.gif) no-repeat 100% 50%; padding-right: 10px; }

/* overlays */
#ACOverlayImageShadow { behaviour: url(/global/scripts/lib/iepngfix.htc); }
.overlay a.close { behaviour: url(/global/scripts/lib/iepngfix.htc); }


/*---- pagenav ----*/
#main #pagenav { border-top: 1px solid #e0e1e2; clear: both; padding-top: 18px; margin-top:60px; margin-right: auto; margin-left: auto; width: 633px; }
#main #pagenav .column { padding-bottom: 18px; margin-bottom: -20px; }
#main #pagenav .first { text-align: left; }
#main #pagenav .first a { padding-left: 20px; background: url(/ca/global/elements/arrows/arrow_prev.gif) no-repeat 0 50%; }
#main #pagenav .last { text-align: right; }
#main #pagenav .last a { padding-right: 20px; background: url(/ca/global/elements/arrows/arrow_next.gif) no-repeat 100% 50%; }

p.sosumi {clear:both; margin:0 auto; padding:12px 20px 0; width:940px;}


/* promofooter */
#promofooter ul#promos li.signup { padding-top: 19px; min-height: 0; _height: 0; }
#promofooter ul#promos li.signup img { display: block; margin: 0 auto 10px auto;  }
#promofooter ul#promos li.signup h3 { margin: 2px 2px 0 0; }
#promofooter ul#promos li.signup h4 { margin: 26px 20px 14px; padding-bottom: 15px; text-align: center; font-size: 15px; line-height: 18px; font-weight: normal; color: #000; background: url(/ca/mobileme/images/contentfooter_rulebg20090502.gif) repeat-x 0 100%; }
#promofooter #promo_trial_button { background: url(/ca/global/elements/buttons/freetrials.png) no-repeat 0 0; display: block; height: 25px; margin: 0 auto; overflow: hidden; position: relative; text-indent: -9999px; width: 82px; }
#promofooter #promo_trial_button:hover { background-position: 0 -25px; }
#promofooter #promo_trial_button:active { background-position: 0 -50px; }


/*---- overview ----*/
#overview #hero { background: #efefef url(/ca/mobileme/images/overview_hero_bg_20100622.gif) repeat-x 0 0; height: 475px; margin: 0 0 1.5em; padding: 0 0 45px; position: relative; width: 980px; }

#overview #hero .herocontent { position: absolute; top: 0; left: 0; width: 980px; height: 475px; }
#overview #hero .herocontent .hero_image { margin-left: -45px; position: absolute; right: 0; top: -9px; }
#overview #freetrial { display: block; position: absolute; bottom: 85px; left: 48px; }

#overview #hero .herocontent h1,
#overview #hero .herocontent .intro { margin-left: 48px; }
#overview #hero .herocontent h1 { font-size: 0; float: left; margin-top: 72px; }
#overview #hero .herocontent h2 { float: left; font-size: 0; margin-top: 148px; margin-bottom: 0; }
#overview #hero .herocontent .intro { clear: left; font-size: 16px; font-weight: normal; line-height: 1.4; margin-bottom: 0; width: 280px; }
#overview #hero .hero_icon { float: left; margin: 125px 11px 9px 48px; }

#overview #hero #MASKED-mobileme .intro { width: 437px; }

#overview #hero .hero_nav { background: #f2f2f2 url(/ca/mobileme/images/overview_heronav_bg_20100622.jpg) repeat-x 0 0; position: absolute; bottom: 0; left: 0; right: 0; -webkit-border-bottom-left-radius: 4px; -webkit-border-bottom-right-radius: 4px; }
#overview #nav { position: relative; }
#overview #nav,
#overview #nav li { float: left; height: 42px; }
#overview #nav { border-left: 1px solid rgba(226,226,226,1); border-right: 1px solid rgba(255,255,255,1); height: 40px; margin-top: 2px; }
#overview #nav .hero_trigger { background-image: url(/ca/mobileme/images/overview_gallerynav_icons_20100622.jpg); background-repeat: no-repeat; display: block; float: left; height: 42px; margin-top: -2px; overflow: hidden; outline: none; position: relative; text-align: center; text-indent: -9999px; width: 61px; }
#overview #hero .nav_title { color: #808080; float: left; line-height: 42px; margin-bottom: 0; padding-right: 20px; text-align: right; width: 225px; }
#overview #hero #nav #indicator { height: 10px; position: absolute; top: -5px; left: 23px; width: 15px; _top: 0; }

/* -- positions for indicator arrow -- */
#overview #hero #nav #indicator.trigger_mobileme 	{ left: 23px; }
#overview #hero #nav #indicator.trigger_mail		{ left: 84px; }
#overview #hero #nav #indicator.trigger_calendar	{ left: 145px; }
#overview #hero #nav #indicator.trigger_contacts 	{ left: 206px; }
#overview #hero #nav #indicator.trigger_fmip	 	{ left: 267px; }
#overview #hero #nav #indicator.trigger_gallery 	{ left: 328px; }
#overview #hero #nav #indicator.trigger_idisk	 	{ left: 389px; }
#overview #hero #nav #indicator.trigger_medotcom 	{ left: 450px; }
#overview #hero #nav #indicator.trigger_mobileme,
#overview #hero #nav #indicator.trigger_mail, 
#overview #hero #nav #indicator.trigger_calendar, 
#overview #hero #nav #indicator.trigger_contacts, 
#overview #hero #nav #indicator.trigger_fmip, 
#overview #hero #nav #indicator.trigger_gallery, 
#overview #hero #nav #indicator.trigger_idisk, 
#overview #hero #nav #indicator.trigger_medotcom 	{ -webkit-transition: left 0.3s cubic-bezier(0,0.8,0,0.8); }

#overview #trigger_mobileme .hero_trigger.active 	{ background-position: 0 0; }
#overview #trigger_mail .hero_trigger.active		{ background-position: -61px 0; }
#overview #trigger_calendar .hero_trigger.active	{ background-position: -122px 0; }
#overview #trigger_contacts .hero_trigger.active	{ background-position: -183px 0; }
#overview #trigger_fmip .hero_trigger.active		{ background-position: -244px 0; }
#overview #trigger_gallery .hero_trigger.active		{ background-position: -305px 0; }
#overview #trigger_idisk .hero_trigger.active		{ background-position: -366px 0; }
#overview #trigger_medotcom .hero_trigger.active	{ background-position: -427px 0; }

#overview #trigger_mobileme .hero_trigger	{ background-position: 0 -42px; }
#overview #trigger_mail .hero_trigger		{ background-position: -61px -42px; }
#overview #trigger_calendar .hero_trigger	{ background-position: -122px -42px; }
#overview #trigger_contacts .hero_trigger	{ background-position: -183px -42px; }
#overview #trigger_fmip .hero_trigger		{ background-position: -244px -42px; }
#overview #trigger_gallery .hero_trigger	{ background-position: -305px -42px; }
#overview #trigger_idisk .hero_trigger		{ background-position: -366px -42px; }
#overview #trigger_medotcom .hero_trigger	{ background-position: -427px -42px; }

#overview #features { background: #fff; float: left; position: relative; padding: 0; width: 980px; }
#overview #features .feature { background: url(/ca/mobileme/images/overview_features_bg_20100622.png) no-repeat 0 100%; border-right: 1px solid #e5e5e5; float: left; margin: 0; min-height: 415px; padding: 25px 18px  0; position: relative; width: 208px; *height: 341px; }
#overview #features .feature:hover { background: #f9f9f9; }
#overview #features .feature.last { border-right: none; -webkit-border-bottom-right-radius: 4px; -o-border-bottom-right-radius: 4px; -moz-border-radius-bottomright: 4px; -webkit-border-top-right-radius: 4px; -o-border-top-right-radius: 4px; -moz-border-radius-topright: 4px; }
#overview #features .feature.first { -webkit-border-bottom-left-radius: 4px; -o-border-bottom-left-radius: 4px; -moz-border-radius-bottomleft: 4px; -webkit-border-top-left-radius: 4px; -o-border-top-left-radius: 4px; -moz-border-radius-topleft: 4px; }
#overview #features .feature h3 { margin-bottom: 5px; font-size: 1.1em; *margin-right: -10px; }
#overview #features .feature h3 a { color: #000; text-decoration: none; }
#overview #features .feature h3 a:hover { color: #08c; }
#overview #features .feature p { margin-bottom:0.7em; }

#overview #features .feature .image_link { display: block; position: absolute; bottom: 0; left: 0; }
#overview #features .bug_updated { position: absolute; left: 18px; top: 8px; }

li.feature p a.more{text-align: left !important;}

#overview #promos { margin: 1.5em auto 0; min-height: 155px; position: relative; width: 980px; _height: 155px; }

#overview #free_trial { padding: 12px 20px 0; width: 940px; background: #fff url(/ca/mobileme/images/overview_trial_bg_20100622.gif) repeat-x 0 100%; }
#overview #free_trial .column { margin: 0; }
#overview #free_trial .column.first { padding-left: 25px; width: 580px; }
#overview #free_trial .column.first img.left { position: relative; margin: 0 35px 10px 0; }
#overview #free_trial #trial_button { background: url(/ca/fr/global/elements/buttons/freetrials.png) no-repeat 0 0; display: block; height: 25px; margin-left: -5px; overflow: hidden; position: relative; text-indent: -9999px; width: 90px; behaviour: url(/global/scripts/lib/iepngfix.htc); }
#overview #free_trial #trial_button:hover { background-position: 0 -25px; }
#overview #free_trial #trial_button:active { background-position: 0 -50px; }
#overview #free_trial h3 { margin-top: 0.7em; margin-bottom: 2px; font-size: 1.6em; font-weight: normal; }
#overview #free_trial .column.last { padding: 0 12px 10px 35px; width: 285px; min-height: 110px; _height: 110px; background: url(/ca/mobileme/images/overview_trial_divider_20100622.gif) no-repeat 0 20%; }
#overview #free_trial .column.last h3 { font-weight: normal; }
#overview #free_trial h3 a { color: #000; }
#overview #free_trial h3 a:hover { color: #08c; text-decoration: none; }
#overview #free_trial p { margin-bottom: 2px; font-size: 14px; }
#overview #free_trial p span { display: block; }
/*#overview #free_trial .column.last p { width: 275px; }*/

/*---- pricing ----*/
#pricing #main { padding: 45px 48px; width: 884px; }
#pricing #main h2 { margin-left: -8px; }
#pricing #main h5 { font-size: 1.2em; font-weight: normal; }
#pricing #main h5 span { color: #999; }

#pricing #main #hero { padding: 50px 100px 50px; margin: -36px -48px 45px; background: url(/ca/mobileme/pricing/images/hero_bg20080711.gif) repeat-x 0 100%; }
#pricing #main #hero img.right.hero { margin: 40px 0 0; }
#pricing #main #hero h2 { margin: 0 -6px 55px; }

#pricing #main .membership { width: 370px; }
#pricing #main .membership img.right.icon { position: relative; margin: 0 0 0 20px; }
#pricing #main .membership p { margin-top: 2.6em; }
#pricing #main .membership img.btn { margin-left: -2px; }

#pricing #main .others { margin: 55px 0 42px 52px; width: 830px; }
#pricing #main .others img.right.icon { position: relative; margin-top: -1em; }
#pricing #main .others p { margin-top: 3em; }
#pricing #main .others .column.first { width: 373px; }
#pricing #main .others .column.last { width: 310px; }
#pricing #main .others .column.last h3 { margin-top: 0; margin-bottom: 3.95em; }

#pricing #main .buynow { margin: 0 2px 45px; padding: 22px 50px; width: 780px; height: 106px; background: url(/ca/mobileme/pricing/images/buynow_bg20090502.png) no-repeat 0 0; }
#pricing #main .buynow .column.first { width: 500px; }
#pricing #main .buynow .column.first img.left { margin: 0 35px 0 -10px; }
#pricing #main .buynow .column.first h3 { margin-bottom: 7px; padding-top: 23px; font-size: 1.2em; }
#pricing #main .buynow .column.first p strong { color: #000; }
#pricing #main .buynow .column.last { width: 225px; }
#pricing #main .buynow .column.last ul { margin: 5px 0; }

#pricing #main div.sosumi { padding: 0 52px; line-height: 1.4em; color: #999 !important; }
#pricing #main div.sosumi h3 { font-size: 14px; font-weight: normal; margin-bottom: 1em; color: #999; }
#pricing #main div.sosumi a { color: #333; }
#pricing #main div.sosumi p.last {margin-top: -10px; }

#pricing #main p.language { margin: 30px 0 0; text-align: center; }
#pricing #main p.language a { padding: 0 6px; color: #999; }
#pricing #main p.language a.active { color: #333; cursor: default; text-decoration: none; }


/*---- sign-up ----*/
#signup #main .maincap.bottom { background-image: url(/ca/mobileme/images/signup_bgbottom20090502.png); }
#signup #main { padding-bottom: 0; overflow: hidden; }

#signup #main h1 {margin: 10px 0 5px 5px; position: relative; }
#signup #main #hero { position: absolute; top: 28px; left: 590px; }
#signup #main p.intro {width: 450px; font-size: 18px; color: #636363; margin: 0 0 1em 5px; }
#signup #signupcontent { padding: 0 76px 10px; height: 234px; background: url(/ca/mobileme/signup/images/contentbg20090502.gif) repeat-x 0 100%; }
#signup #main iframe,
#signup #main div#iframeplaceholder { width: 600px; height: 10em; }


/*---- migrating ----*/
#migrating #content { width: 904px; min-height: 800px; padding: 45px 30px 30px 50px; }
#migrating #content h3 { font-size: 16px; color: #252525; margin-bottom: 5px; }
#migrating #content h4 { font-size: 14px; color: #252525; }
#migrating #content h1 {margin-top: 10px; }
#migrating #content p.intro {margin-bottom: 35px}
#migrating #content h1, body#migrating #content .subtitle { padding-right: 20px; }
#migrating #content .subtitle { margin-bottom: 60px; }
#migrating #content #hero { position: relative; width: 980px; margin: -20px -28px 35px -48px; }

#migrating #content_features { clear: both; margin-top: -10px; }
#migrating #content_features .column { margin-top: 30px; }
#migrating #content_features .column.first { width: 565px; }
#migrating #content_features div.right, body#migrating #content_features div.left { width: 260px; }
#migrating #content_features div.right { float: right; }
#migrating #content_features div.left { float: left; clear: both; }
#migrating #content_features img.left.margin { margin: -18px 20px 0 -35px; }
#migrating #content_features .column p { margin-left: 70px; margin-right: 0; }
#migrating #content_features .column img.left { margin-right: 16px; }
#migrating #content_features strong { color: #252525; }

#migrating #content_features .inaction { float: right; }
#migrating #content_features .inaction .watchvideo a span { display: block; margin-top: 5px; margin-bottom: 32px; }*/
#migrating #content .imagegallery span { width: 160px; float: right; padding-top: 20px; }

#migrating #content_whatis { margin-top: 40px; margin-bottom: 18px; }
#migrating #content_whatis .column { width: 48%; }
#migrating #content_whatis .column.first img.right { margin: 2px 30px 16px 10px; }
#migrating #content_whatis .column.first p.top { width: 455px; margin-bottom: 45px; }
#migrating #content_whatis .column.last img.top { margin: -82px 0 32px 27px; position: relative; }

#migrating #content .sosumi a {color: #76797c; }


/*---- whats new----*/
#whats-new .overlaypanel #MASKED-remote-wipe { width: 743px; height: 534px; position: relative; left:55px; }

/*---- overlays ----*/
.overlaypanel img.overlayPanelShadowImage { top: -7.5% !important; left: -4.6% !important; width: 109.1% !important; height: 115% !important; }
.overlaypanel .overlaycontent { width: 898px; position:absolute; top:0; left: 0; height:539px; }
.overlaypanel .overlaycontent .moviePanel { width: 640px; height: 400px; margin:75px; /**margin-left: -55px; _margin-left: 75px; margin-left: 75px;*/ }
.overlaypanel .overlaycontent .moviePanel.movie-loading { background-image: url(/ca/global/elements/quicktime/qt_loading640x400.gif); /**margin-left: -55px; _margin-left: 75px;*/ margin-left: 75px; }
.overlaypanel .overlaycontent .controllerPanel { top: 485px; left: 50px; width: 640px; }
.overlaypanel .overlaycontent .overlaydescription { display: block; }
.overlaypanel .overlaycontent .overlaydescription h2 { position: absolute; top:24px; left: 74px; font-size: 20px; }
.overlaypanel .overlaycontent .overlaydescription p { position: absolute; top:72px; right: 50px; width: 125px; }

.overlaypanel.gallery-iphone .overlaycontent .moviePanel,
.overlaypanel.gallery-app-overlay .overlaycontent .moviePanel { height: 360px; }
.overlaycontent .endState { display: none; }
.overlaypanel .overlaycontent .endState { display: block; *margin-left: 130px; *width: 640px; _margin-left: 0; }