/* Shared Styles
-----------------------------*/
@media only screen and (max-device-width:768px) {
	body#performance #globalheader { position:relative; z-index:2; }
	body#performance #main { position:relative; z-index:1; margin-top:-100px; padding-top:100px; }
}

body#performance .row { padding-top:76px; padding-bottom:0; }
body#performance .row h1 { zoom:1; margin-bottom:40px; }
body#performance .row h1:after { content:'.'; display:block; height:0; clear:both; visibility:hidden; }
body#performance .row h1 img { float:left; margin-right:-50px; *position:relative; *z-index:1; }
body#performance .row h1 .icon { margin-right:30px; }
body#performance .row .hero-image { display:block; margin-top:30px; border-bottom:1px solid #e2e2e2; }
body#performance .row.flushpad { border-top:1px solid #e2e2e2; }

body#performance .grid2col .column { width:47.5%; }


/* Section Specific Styles
-----------------------------*/
body#performance #hero { padding-top:85px; padding-left:110px; min-height:530px; border-top:none; position:relative; z-index:1; }
body#performance #hero h1 { margin-bottom:14px; }
body#performance #hero .column.first { width:370px; padding-bottom:160px; }
body#performance #hero .hero-image { border-bottom:none; position:absolute; z-index:1; bottom:0; right:45px; }

body#performance #configure { padding-bottom:50px; }
body#performance #configure h1 { margin-bottom:25px; }

body#performance #graphics .grid2col { padding-bottom:70px; }

body#performance #wifi { padding-bottom:40px; border-bottom:1px solid #e2e2e2; }
body#performance #wifi .icon { margin-right:25px; }



/* Bar Charts
-----------------------------*/
/* bar charts shared */
body#performance .chart-title { margin-bottom:20px; }
body#performance .bars { width:370px; }
body#performance .bars li { width:100%; }
body#performance .bars .bar { width:0; height:36px; position:relative; z-index:1; }
body#performance .bars .bar.blue { background:#99cfeb; }
body#performance .bars .bar.grey { background:#d6d6d6; }
body#performance .bars .text-value { position:absolute; right:12px; top:7px; font-size:14px; color:#fff; }
body#performance .bars .text-value.grey { color:#aaa; }
body#performance .bars .caption { padding:1px 0 8px 0; font-size:11px; background:#fff; }
body#performance .can-animate .text-value { opacity:0; }
body#performance .animate .bars .bar {
	-webkit-transition:width 600ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
	   -moz-transition:width 600ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
	        transition:width 600ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
	-webkit-transform:translateZ(0);
}
body#performance .animate .bar-one .bar {
	-webkit-transition-delay:300ms;
	   -moz-transition-delay:300ms;
	        transition-delay:300ms;
}
body#performance .animate .bar-two .bar {
	-webkit-transition-delay:180ms;
	   -moz-transition-delay:180ms;
	        transition-delay:180ms;
}
body#performance .animate .bar-three .bar {
	-webkit-transition-delay:140ms;
	   -moz-transition-delay:140ms;
	        transition-delay:140ms;
}
body#performance .animate .bar-four .bar {
	-webkit-transition-delay:100ms;
	   -moz-transition-delay:100ms;
	        transition-delay:100ms;
}
body#performance .animate .text-value {
	opacity:1;
	-webkit-transition:opacity .5s;
	   -moz-transition:opacity .5s;
	        transition:opacity .5s;
	-webkit-transition-delay:700ms;
	   -moz-transition-delay:700ms;
	        transition-delay:700ms;
}

/* fade chart numbers in when slide changes */
body#performance #graphics-chart-gallery.animate .text-value {
	-webkit-animation:fadein .5s .6s both;
}

@-webkit-keyframes fadein {
	0% { opacity:0; }
	100% { opacity:1; }
}


/* bar chart gallery - graphics */
body#performance #graphics-chart-gallery { position:relative; z-index:2; min-height:268px; background:#fff; }
body#performance #graphics-chart-gallery .gallery-content { position:absolute; top:0; left:0; -webkit-transform:translateZ(0); }
body#performance #graphics .gallery .nav { width:390px; padding-top:7px; }
body#performance #graphics .gallery .nav li { display:block; float:left; line-height:1.2em; }
body#performance #graphics .gallery .nav li.first-child { width:52%; border-right:1px solid #bbb; text-align:left; }
body#performance #graphics .gallery .nav li.last-child { width:47%; text-align:right; float:right; }
body#performance #graphics .gallery .nav a.active { color:#666; }
body#performance #graphics .gallery .nav a.active:hover { text-decoration:none; cursor:default; }

/* graphics - gt */
body#performance #graphics-chart-gallery .bar-one .bar,
body#performance #graphics-chart-gallery.can-animate .graphics-chart-gt .bar-one .bar,
body#performance #graphics-chart-gallery.animate .bar-one .bar { width:100%; }
body#performance #graphics-chart-gallery .bar-two .bar,
body#performance #graphics-chart-gallery.can-animate .graphics-chart-gt .bar-two .bar,
body#performance #graphics-chart-gallery.animate .bar-two .bar { width:100%; }
body#performance #graphics-chart-gallery .bar-three .bar,
body#performance #graphics-chart-gallery.can-animate .graphics-chart-gt .bar-three .bar,
body#performance #graphics-chart-gallery.animate .bar-three .bar { width:94%; }
body#performance #graphics-chart-gallery .bar-four .bar,
body#performance #graphics-chart-gallery.animate .bar-four .bar { width:62.5%; }

body#performance #graphics-chart-gallery.can-animate .bar,
body#performance #graphics-chart-gallery.can-animate .graphics-chart .bar-one .bar,
body#performance #graphics-chart-gallery.can-animate .graphics-chart .bar-two .bar,
body#performance #graphics-chart-gallery.can-animate .graphics-chart .bar-three .bar,
body#performance #graphics-chart-gallery.can-animate .graphics-chart .bar-four .bar { width:0; }


/* graphics - gtx only */
body#performance #graphics-chart-gallery .graphics-chart .bar-one .bar,
body#performance #graphics-chart-gallery.animate .graphics-chart .bar-one .bar { width:100%; }
body#performance #graphics-chart-gallery .graphics-chart .bar-two .bar,
body#performance #graphics-chart-gallery.animate .graphics-chart .bar-two .bar { width:90.6%; }
body#performance #graphics-chart-gallery .graphics-chart .bar-three .bar,
body#performance #graphics-chart-gallery.animate .graphics-chart .bar-three .bar { width:81.25%; }
body#performance #graphics-chart-gallery .graphics-chart .bar-four .bar,
body#performance #graphics-chart-gallery.animate .graphics-chart .bar-four .bar { width:62.5%; }


/* graphics - gtx toggle */
body#performance #graphics-chart-gallery .graphics-chart-gt .bar-one .bar,
body#performance #graphics-chart-gallery.second-section.animate .bar-one .bar { width:81.25%; }
body#performance #graphics-chart-gallery .graphics-chart-gt .bar-two .bar,
body#performance #graphics-chart-gallery.second-section.animate .bar-two .bar { width:75%; }
body#performance #graphics-chart-gallery .graphics-chart-gt .bar-three .bar,
body#performance #graphics-chart-gallery.second-section.animate .bar-three .bar { width:87.5%; }

/* bar chart - thunderbolt */
body#performance #thunderbolt-chart .bar-one .bar,
body#performance #thunderbolt-chart.animate .bar-one .bar { width:100%; }
body#performance #thunderbolt-chart .bar-two .bar,
body#performance #thunderbolt-chart.animate .bar-two .bar { width:100%; }
body#performance #thunderbolt-chart .bar-three .bar,
body#performance #thunderbolt-chart.animate .bar-three .bar { width:50%; }
body#performance #thunderbolt-chart .bar-four .bar,
body#performance #thunderbolt-chart.animate .bar-four .bar { width:8%; }
body#performance #thunderbolt-chart .bar-four .text-value { right:-80px; }

body#performance #thunderbolt-chart.can-animate .bar { width:0; }

/* bar chart - wifi */
body#performance #wifi-chart .bar-one .bar,
body#performance #wifi-chart.animate .bar-one .bar { width:100%; }
body#performance #wifi-chart .bar-two .bar,
body#performance #wifi-chart.animate .bar-two .bar { width:34.6%; }
body#performance #wifi-chart .bar-three .bar,
body#performance #wifi-chart.animate .bar-three .bar { width:4.15%; }
body#performance #wifi-chart .bar-three .text-value { right:-70px; }

body#performance #wifi-chart.can-animate .bar { width:0; }

/* bar chart - fusion */
body#performance #fusion .column.first { width:345px; }

body#performance #fusion-chart .bar-one .bar,
body#performance #fusion-chart.animate .bar-one .bar { width:100%; }
body#performance #fusion-chart .bar-two .bar,
body#performance #fusion-chart.animate .bar-two .bar { width:100%; }
body#performance #fusion-chart .bar-three .bar,
body#performance #fusion-chart.animate .bar-three .bar { width:48.5%; }
body#performance #fusion-chart .bar-four .bar,
body#performance #fusion-chart.animate .bar-four .bar { width:28.5%; }

body#performance #fusion-chart.can-animate .bar { width:0; }

/* bar chart - storage combo chart */
body#performance #fusion-chart.combo-chart .bar-one .bar,
body#performance #fusion-chart.combo-chart.animate .bar-one .bar { width:100%; }
body#performance #fusion-chart.combo-chart .bar-two .bar,
body#performance #fusion-chart.combo-chart.animate .bar-two .bar { width:66.7%; }

body#performance #fusion-chart.combo-chart.can-animate .bar { width:0; }

body#performance #fusion-chart.combo-chart .fusion-drive { margin-bottom:45px; }

/* comingsoon footer */
body#performance #comingsoon .grid2col .column.first { width:260px; }
body#performance #comingsoon .grid2col .column.available { width:820px; }

@media only screen and (max-device-width:768px) {
	body#performance #comingsoon .grid2col .column.available { width:764px; }
}