/* Features
------------------------*/

/* shared styles */
.features .row { padding-top:90px; padding-bottom:72px; }
.features .hero { padding-top:50px; padding-bottom:52px; }
.features .hero h1 { margin-bottom:14px; }


/* icloud include */
.features .icloud { background:url(/v/macbook-pro/a/images/linen_bg.jpg) 0 0 repeat; }
.features .icloud .grid2colb .column.first { width:638px; padding-left:158px; }
.features .icloud img.screen { margin:20px 0 0 29px; }
.features .icloud img.retina { margin-left:36px; }

.features .sosumi ul { padding-left:7px; }


/* support include */
.features .support { position:relative; z-index:1; padding:65px 115px 50px; }
.features .support h1,
.features .support .intro { margin:0 0 10px; width:665px; }
.features .support h1 img { behavior: none; }
.features .support .intro { width:669px; }
.features .support img.bg { position:absolute; bottom:0; right:0; z-index:1; }
.features .support .grid2col { width:610px; margin-top:39px; }
.features .support .applecare { width:285px; }
.features .support .retail { width:300px; }
.features .support .applecare p,
.features .support .retail p { line-height:21px;}


/* loupe */
@-webkit-keyframes touchBobble {
	0%   { -webkit-transform:scale(1.04); }
	100%  { -webkit-transform:scale(1); }
}
.loupe-gallery { height:735px; margin-top:10px; padding-bottom:40px; background:no-repeat 50% 0; background-size:1086px 622px; }

.loupe-container { position:relative; z-index:5; width:1120px; height:744px;  overflow:hidden; }
.loupe-container .spinner { position:relative; z-index:1005; top:-327px; left:50%; margin-left:-28px; width:86px; height:58px; padding:25px 0 0; text-align:center; background:#000; opacity:0.7; border-radius:10px;
	-webkit-transition:opacity 0.6s ease;
	   -moz-transition:opacity 0.7s ease;
	        transition:opacity 0.7s ease;
}
.loupe-container .spinner.right { float:none; margin-left:-88px; }
.loupe-container .column.last { width:548px; }
.loupe-gallery .caption { width:585px; padding:0; font-size:0.93em; color:#000; font-weight:bold; text-align:center; }
.loupe-gallery .caption.right { width:565px; padding-right:20px; }

.loupe { position:absolute; z-index:1002; top:60px; width:265px; height:265px; visibility:hidden; cursor:move; cursor:-webkit-grab; cursor:-moz-grab; cursor:grabbing; }
.loupe.grabbing { cursor:none; *cursor:move; }
.loupe .loupe-image { position:absolute; top:0; left:0; z-index:3; }
.loupe .canvas-fade { position:absolute; display:inline-block; border-radius:100px; top:24px; left:23px; -webkit-transition:opacity 0.4s; -moz-transition:opacity 0.4s; transition:opacity 0.4s; z-index:1; }
.loupe .tooltip { display:none; z-index:2; position:absolute; top:104px; left:52%; margin-left:-84px; width:145px; padding:10px 0 9px; border-radius:25px; color:#fff; font-family:'Lucida Grande', Helvetica, Arial, Verdana; font-weight:bold; font-size:14px; text-align:center; opacity:0;
	background:rgb(32,32,32);
	background:rgba(32,32,32,0.7);
	-webkit-transition:opacity 0.6s ease;
	   -moz-transition:opacity 0.7s ease;
	        transition:opacity 0.7s ease;
}
.loupe .canvas { display:inline-block; border-radius:100px; margin:24px 0 0 23px; *position:relative; *top:24px;
	-ms-filter:'progid:DXImageTransform.Microsoft.Alpha( Opacity=100, FinishOpacity=0, Style=1, StartX=90,  FinishX=100, StartY=75, FinishY=85), progid:DXImageTransform.Microsoft.Alpha( Opacity=100, FinishOpacity=0, Style=1, StartX=77,  FinishX=87, StartY=10, FinishY=0), progid:DXImageTransform.Microsoft.Alpha( Opacity=100, FinishOpacity=0, Style=1, StartX=10,  FinishX=0, StartY=75, FinishY=85), progid:DXImageTransform.Microsoft.Alpha( Opacity=100, FinishOpacity=0, Style=1, StartX=20,  FinishX=10, StartY=10, FinishY=0)';
	*filter:progid:DXImageTransform.Microsoft.Alpha( Opacity=100, FinishOpacity=0, Style=1, StartX=90,  FinishX=100, StartY=75, FinishY=85)
	progid:DXImageTransform.Microsoft.Alpha( Opacity=100, FinishOpacity=0, Style=1, StartX=77,  FinishX=87, StartY=10, FinishY=0)
	progid:DXImageTransform.Microsoft.Alpha( Opacity=100, FinishOpacity=0, Style=1, StartX=10,  FinishX=0, StartY=75, FinishY=85)
	progid:DXImageTransform.Microsoft.Alpha( Opacity=100, FinishOpacity=0, Style=1, StartX=20,  FinishX=10, StartY=10, FinishY=0);
}
.loupeLeft { left:55px;
	-webkit-transform:translate(-800px, 228px);
	   -moz-transform:translate(-800px, 228px);
	    -ms-transform:translate(-800px, 228px);
	        transform:translate(-800px, 228px);
}
.loupeRight { left:561px; top:65px;
	-webkit-transform:translate(800px, 228px);
	   -moz-transform:translate(800px, 228px);
	    -ms-transform:translate(800px, 228px);
	    	transform:translate(800px, 228px);
}

#gallery-loupeViewLeft,
#gallery-loupeViewRight { margin:87px 0 0 68px; height:508px; z-index:1; overflow:hidden; }
#gallery-loupeViewRight { margin-left:2px; }
#gallery-loupeViewLeft img,
#gallery-loupeViewRight img { width:446px; height:508px; }

/* Gallery Loupe fallback */
.retina img.loupe-still { display:none; _margin-top:30px; _margin-left:20px; margin-left:10px; }
.retina .vision { _padding-top:10px; }

.retina.fallback .loupe-gallery { display:none; }
.retina.fallback .loupe-still { display:block; }

/* Gallery Loupe degradation */
@media only screen and (max-device-width:768px) {
	.retina.degraded .vision { padding-top:10px; }
}


/* Page Specific
------------------------*/

/* features-retina */
#features-retina .row { border-top:1px solid #fff; border-bottom:1px solid #e0e0e0; }
#features-retina .nointro { margin-bottom:50px; }

#features-retina .row h1 { margin-left:151px; *margin-left:0; *padding-left:151px; }
#features-retina .row p.intro { margin-left:158px; *margin-left:0; *padding-left:158px; }
#features-retina .row h1 { height:84px; }
#features-retina .row p.intro { margin-right:154px; margin-bottom:60px; color:#666; }
#features-retina .row .chart .header h1 { height:auto; margin:0; *padding-left:0; }

#features-retina .details { width:894px; margin:37px auto 0; }
#features-retina .details > .column { width:417px; }
#features-retina .details figure,
#features-retina figure.screen { text-align:center; }
#features-retina .details figcaption { font-size:0.86em; color:#666; }

#features-retina .narrow { width:665px; margin:36px auto 0; }

#features-retina .hero img.flushright { margin-top:-28px; _position:relative; _z-index:1; }
#features-retina .hero .intro { width:893px; }

#features-retina .retina h1,
#features-retina .retina p.intro { margin-left:116px; *margin-left:0; *padding-left:116px; }
#features-retina .retina .details figure { margin-top:30px; text-align:left; }
#features-retina .retina .details figcaption { margin:10px 0 0; line-height:1.4em; }
#features-retina .retina .details figcaption p { margin-bottom:10px; }
#features-retina .retina .details figcaption a { color:#08c; }
#features-retina .retina .details figcaption img { margin:0 4px -3px 0; position:relative; z-index:1; }

#features-retina .i7 .narrow .first { width:470px; }
#features-retina .i7 .narrow .last img { margin-top:25px; margin-bottom:-10px; }
#features-retina .i7 .narrow .last p.caption { margin-left:-10px; width:180px; font-size:0.86em; line-height:1.5em; text-align:center; color:#666; }

#features-retina .flash { padding-bottom:70px; }
#features-retina .flash .vrcontainer { cursor:default; width:888px; height:171px; margin:0 auto; }
#features-retina .flash .vrcontainer .vr { cursor:default; }
#features-retina .flash .vrcontainer .vr img { width:888px; height:171px; }
#features-retina .flash .chart dt.copy strong,
#features-retina .flash .chart dt.open strong { margin-top:-2px; padding-top:0; }
#features-retina .flash .chart dt.copy span { width:83px; }
#features-retina .flash .chart dd { margin-bottom:20px; }
#features-retina .flash .chart dd.copy { width:275px; }
#features-retina .flash .chart dd.open { width:158px; }
#features-retina .flash .chart dd.boot { width:145px; *margin-right:80px; }
#features-retina .flash .chart dd.baseline { width:55px; margin-bottom:0; }

#features-retina .ports .first img,
#features-retina .ports .last img { margin-bottom:2px; }
#features-retina .ports .last img.right { margin-left:0px; }
#features-retina .ports figcaption ul:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
#features-retina .ports figcaption ul li { float:left; display:inline; text-align:center; font-size:13px; }
#features-retina .ports .first figcaption { margin-left:65px; }
#features-retina .ports .first figcaption ul li.first { width:130px; }
#features-retina .ports .first figcaption ul li.second { width:138px; }
#features-retina .ports .first figcaption ul li.last { width:60px; }
#features-retina .ports .last figcaption { margin-right:-10px; _position:relative; _z-index:1; }
#features-retina .ports .last figcaption ul li.first { width:74px; }
#features-retina .ports .last figcaption ul li.second { width:176px; }
#features-retina .ports .last figcaption ul li.third { width:70px; }
#features-retina .ports .last figcaption ul li.last { width:80px; }
#features-retina .ports .narrow { margin-top:60px; }
#features-retina .ports .narrow img.right { _position:relative; margin-right:-40px; }

#main .callout { background:url(/v/macbook-pro/a/images/features_callout_bg.jpg); background-size:10px 345px; font-size:12px; line-height:1.5em; }

#features-retina .av.row { border-bottom:none; }
#features-retina .av .details { margin-top:60px; }
#features-retina .av .grid2colb .column.first { width:623px; }
#features-retina .av .grid2colb .column.first p { width:95%; }
#features-retina .av .grid2colb .column.last { width:257px; }
#features-retina #main .av .callout { width:205px; padding:21px 26px 4px; _position:relative; }
#features-retina .av .callout figure { margin-bottom:18px; width:186px; background:url(/v/macbook-pro/a/images/horizontal_rule.png) repeat-x 0 100%; background-size:1px 2px; }
#features-retina .av .callout figure figcaption { padding-bottom:10px; font-size:14px; line-height:0.9em; color:#333; }
#features-retina #main .content .av .callout h4 { margin:0 -9px 2px 0; font-size:12px; }

/* av gallery */
#features-retina .av .gallery { width:1120px; height:700px; background:no-repeat 50% 0; background-size:854px 626px; }
#features-retina .av .gallery .gallery-view figure { height:672px; }
#features-retina .av .gallery .speakers img { margin:244px 0 130px 20px; _margin-bottom:145px; }
#features-retina .av .gallery .mics img { margin:187px 0 0 128px; }
#features-retina .av .gallery .toggle-nav { position:relative; z-index:1001; margin:0 auto; }
#features-retina .av .gallery .toggle-nav li a.last-child  { border-right:1px solid #cfcfcf; }

	
#features-retina .keyboard { border:none; background:#000; }
#features-retina .keyboard h1 { margin-left:121px; }
#features-retina .keyboard .details { margin-top:64px; }
#features-retina .keyboard h3,
#features-retina .keyboard p { color:#fff; }

#features-retina .keyboard .keyboard-image-container { position: relative; }
#features-retina .keyboard .keyboard-image-container #ambient-backlit-keyboard { position: absolute; top: 0; left: 111px; display: none; }
#features-retina .keyboard #ambient-backlit-keyboard.ambient-backlit-keyboard-prepped { opacity: 1; display: inline; }
#features-retina .keyboard #ambient-backlit-keyboard.ambient-backlit-keyboard-complete { opacity: 0; 
	-webkit-transition: all 1500ms cubic-bezier(0.445, 0.050, 0.550, 0.950);
	   -moz-transition: all 1500ms cubic-bezier(0.445, 0.050, 0.550, 0.950);
	   	 -o-transition: all 1500ms cubic-bezier(0.445, 0.050, 0.550, 0.950);
	        transition: all 1500ms cubic-bezier(0.445, 0.050, 0.550, 0.950);
} 

#features-retina .battery header img { margin-left:-8px; }
#features-retina .battery .grid2colb { width:812px; margin:16px 0 0 157px; }
#features-retina .battery .grid2colb .column.first { width:510px; }
#features-retina .battery .grid2colb .column.last { width:100px; }
#features-retina .battery .grid2colb figure { width:100px; position:relative; z-index:1; zoom:1; }

#features-retina .battery .grid2colb figure figcaption { position:absolute; top:130px; width:150px; margin:0 0 0 -20px; text-align:center; font-size:14px; }
#features-retina .battery .grid2colb figure figcaption em { font-size:21px; font-style:normal; }
#features-retina .battery .grid2colb figure figcaption em span { margin-right:-3px; font-size:29px; }

#features-retina .battery .battery-clock { position:absolute; top:32px; left:-150px; width:100px; height:100px; }
#features-retina .battery .battery-clock img,
#features-retina .battery .battery-clock canvas { display:none; }
#features-retina .battery .battery-clock .degradation { display:block; }

#features-retina .battery .battery-clock.enhanced { z-index:1100; -webkit-box-reflect:below -1px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(0.70, transparent), to(rgba(255,255,255,0.2))); }
#features-retina .battery .battery-clock.enhanced img,
#features-retina .battery .battery-clock.enhanced canvas { display:block; width:100px; height:100px; position:absolute; z-index:1101; }
#features-retina .battery .battery-clock.enhanced canvas { z-index:1100; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%; }
#features-retina .battery .battery-clock.enhanced .degradation { display:none; width:100px; height:126px; }

#features-retina .icloud h1 { margin-left:0; margin-bottom:30px; *padding-left:0; }

#features-retina .software { padding-bottom:0; }
#features-retina .software h1 { margin-left:48px; height:auto; *margin-left:0; *padding-left:48px; }
#features-retina .software .grid2colb { margin-top:36px; margin-bottom:35px; }
#features-retina .software .grid2colb .column.first { width:522px; }
#features-retina .software .grid2colb .column.last { position:relative; width:320px; zoom:1; }
#features-retina .software .callout { width:270px; padding:26px 20px 6px; }
#features-retina .software .callout img.left { margin-left:10px; }
#features-retina .software img.flushleft { display:block; }


/* retina example screenshot */
body.retina-example { font-size:0; line-height:0; }
/* reduce size in half for high-dpi devices */
@media only screen and (min-device-pixel-ratio:1.5) and (min-device-width:321px),
	only screen and (-webkit-min-device-pixel-ratio:1.5) and (min-device-width:321px) {
		body.retina-example img { width:1440px; height:900px; }
}


/* features-non-retina */
#features-non-retina #main .content { margin-left:-70px; margin-right:-70px; width:980px; padding-left:70px; padding-right:70px; }

#features-non-retina .content .flushpad,
#features-non-retina .content .padright { padding-right:70px; }
#features-non-retina .content .flushpad,
#features-non-retina .content .padleft { padding-left:70px; }
#features-non-retina .content .flushpad,
#features-non-retina .content .flushright { margin-right:-70px; }
#features-non-retina .content .flushpad,
#features-non-retina .content .flushleft { margin-left:-70px; }

#features-non-retina .grid2colf .column.last { margin-right:95px; width:710px; }

#features-non-retina .row { padding-top:70px; padding-bottom:0; }
#features-non-retina .icon { float:left; }

#features-non-retina .hero .intro { width:570px; margin-bottom:50px; }

#features-non-retina .processor h1 { margin-bottom:22px; }
#features-non-retina .processor img.flushleft { position:relative; z-index:1; margin-top:-441px; }
#features-non-retina .processor .column.last { position:relative; z-index:2; width:472px; padding-top:33px; }
#features-non-retina .processor .column.last img.right { position:relative; margin:2px 0 16px 0; zoom:1; }

#features-non-retina .graphics .column.first { position:relative; z-index:2; width:360px; }
#features-non-retina .graphics img.flushright { position:relative; z-index:1; margin-top:-480px; }
#features-non-retina .graphics img.left { margin:5px 20px 5px 0; }

#features-non-retina .connectivity { padding-top:20px; }
#features-non-retina .connectivity .icon { margin-left:52px; }
#features-non-retina .connectivity img.thunderbolt { margin:22px 52px 0; }

#features-non-retina .versatile .grid2colf img.left { margin-left:50px; }
#features-non-retina .versatile img.center { margin-top:50px; }

#features-non-retina .facetime .icon { margin-left:40px; }
#features-non-retina .facetime .gallery { margin:50px 11px 0; width:958px; background:url(/v/macbook-pro/a/images/facetime_hardware.jpg) no-repeat 50% 0; background-size:958px 551px; }
#features-non-retina .facetime .gallery .gallery-view  { height:590px !important; }
#features-non-retina .facetime .gallery .gallery-view .gallery-content img { position:absolute; z-index:1; left:152px; top:35px; }
#features-non-retina .facetime .gallery .gallery-view .gallery-content figcaption { position:absolute; z-index:2; left:0; top:553px; width:100%; text-align:center; }

#features-non-retina .multitouch .flushright { margin-bottom:-283px; margin-left:0; }
#features-non-retina .multitouch .column.first { margin-top:-432px; width:380px; }

#features-non-retina .battery .icon { margin-left:52px; }
#features-non-retina .battery .column.last { margin-right:171px; width:634px; }

#features-non-retina .wireless .icon { margin-left:52px; }

#features-non-retina .ports .icon { margin-left:30px; }
#features-non-retina .ports .gallery { height:216px; }
#features-non-retina .ports .gallery-view { margin-left: 7px; }
#features-non-retina .ports .arrow-nav { margin:0 auto 10px; width:100%; text-align:center; }
#features-non-retina .ports .arrow-nav li,
#features-non-retina .ports .arrow-nav li a { display:-moz-table-cell; display:inline-block; *display:inline; *zoom:1; color:#333; }
#features-non-retina .ports .arrow-nav li a { padding:10px; }
#features-non-retina .ports .arrow-nav li a.active { color:#888; text-decoration:none; background:url(/v/macbook-pro/a/images/downarrow.gif) no-repeat 50% 100%; background-size:9px 5px; }

@media only screen and (min-device-pixel-ratio:1.5) and (min-device-width:321px),
       only screen and (-webkit-min-device-pixel-ratio:1.5) and (min-device-width:321px) {
	#features-non-retina .ports .arrow-nav li a.active { background:url(/v/macbook-pro/a/images/downarrow_2x.gif) no-repeat 50% 100%; }
	#features-non-retina .facetime .gallery { background:url(/v/macbook-pro/a/images/facetime_hardware_2x.jpg) no-repeat 50% 0; background-size:958px 551px;}
}

#features-non-retina .ports .gallery img { margin:0 47px -60px; *margin-bottom:-58px; }
#features-non-retina .ports figcaption ul:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
#features-non-retina .ports figcaption ul li { position:relative; z-index:1; float:left; display:inline; text-align:center; font-size:12px; }

#features-non-retina .ports .gallery-ports-13 figcaption ul.row1 { margin-left:154px; }
#features-non-retina .ports .gallery-ports-13 figcaption ul.row1 li.first { width:120px; }
#features-non-retina .ports .gallery-ports-13 figcaption ul.row1 li.second { width:89px; }
#features-non-retina .ports .gallery-ports-13 figcaption ul.row1 li.last { width:278px; }
#features-non-retina .ports .gallery-ports-13 figcaption ul.row2 { margin-top:13px; margin-left:100px; }
#features-non-retina .ports .gallery-ports-13 figcaption ul.row2 li.first { width:120px; }
#features-non-retina .ports .gallery-ports-13 figcaption ul.row2 li.second { width:102px; }
#features-non-retina .ports .gallery-ports-13 figcaption ul.row2 li.third { width:143px; }
#features-non-retina .ports .gallery-ports-13 figcaption ul.row2 li.fourth { margin-left:60px; width:100px; }
#features-non-retina .ports .gallery-ports-13 figcaption ul.row2 li.last { margin-left:37px; width:200px; }

#features-non-retina .ports .gallery-ports-15 figcaption ul.row1 { margin-left:125px; }
#features-non-retina .ports .gallery-ports-15 figcaption ul.row1 li.first { width:120px; }
#features-non-retina .ports .gallery-ports-15 figcaption ul.row1 li.second { width:85px; }
#features-non-retina .ports .gallery-ports-15 figcaption ul.row1 li.last { width:295px; }
#features-non-retina .ports .gallery-ports-15 figcaption ul.row2 { margin-top:13px; margin-left:65px; }
#features-non-retina .ports .gallery-ports-15 figcaption ul.row2 li.first { width:120px; }
#features-non-retina .ports .gallery-ports-15 figcaption ul.row2 li.second { width:105px; }
#features-non-retina .ports .gallery-ports-15 figcaption ul.row2 li.third { width:143px; }
#features-non-retina .ports .gallery-ports-15 figcaption ul.row2 li.fourth { margin-left:67px; width:65px; }
#features-non-retina .ports .gallery-ports-15 figcaption ul.row2 li.fifth { width:65px; }
#features-non-retina .ports .gallery-ports-15 figcaption ul.row2 li.last { margin-left:80px; width:200px; }

#features-non-retina .sdcards img { margin-left:34px; }
#features-non-retina .sdcards .column.last { padding-top:10px; }
#features-non-retina .sdcards .column.last p { width:95%; }

#features-non-retina .superdrive img.flushleft { margin-top:20px; }
#features-non-retina .superdrive .column.last { width:40%; }

#features-non-retina .icloud .column.first { padding-left:127px; }
#features-non-retina .icloud img.screen { margin-left:3px; }

@media only screen and (-webkit-min-device-pixel-ratio:1.5) and (max-device-width:768px) {
	#features-non-retina .processor { height:625px; }
	#features-non-retina .processor .column.last { width: 440px; margin-right:40px; }
	#features-non-retina .graphics .column.first { padding-left:22px; }
	#features-non-retina .multitouch .column.first { padding-left:38px; }
	#features-non-retina .support h1,
	#features-non-retina .support .intro,
	#features-non-retina .grid2col { margin-left:30px; }
	#features-non-retina .superdrive .column.last { padding-right:32px; }

}


/* geo-alt */
.features.geo-alt .support { border-bottom:1px solid #e2e2e2; }

.features.geo-alt .promos { width:auto; margin:40px 0; padding-bottom:5px; *padding-bottom:0; font-size:.9em; line-height:1.5em; background:url(/v/macbook-pro/a/images/dividerline_short.png) no-repeat 50% 50%; }
.features.geo-alt .promos h4 { margin-bottom:0; padding-top:7px; }
.features.geo-alt .promos .column { padding-top:20px; }
.features.geo-alt .promos .column.first { width:454px; padding-left:18px; }
.features.geo-alt .promos .column.first img { margin:0 8px 0 0; }
.features.geo-alt .promos .column.last { width:395px; padding-left:30px; padding-right:70px; }
.features.geo-alt .promos .column.last img { margin:0 25px 0 0; }

@media only screen and (max-device-width:768px) {
	.features.geo-alt .promos { margin-left:30px; margin-right:30px; }
	.features.geo-alt .promos .column.first { width:420px; }
	.features.geo-alt .promos .column.last { width:380px; padding-right:50px; }
}