/*
// ------------------------------------
// App-specific settings
// ------------------------------------
*/

/* This style is used by the AcgApp.isEnanced() method to determine if we are using the enhanced stylesheet */
body:after
{
	content:'default';
	display:none;
}

body
{
    max-width: 100%;
    overflow-x: hidden;	/* Causes Chrome to add a vertical scrollbar */
}

#cssCheck
{
	font-weight:800;
}

.outerArea
{
	jbackground-color:rgb(242,242,242);
	padding:0em 0;
	width:100%;
	/* Had to remove overflow-x because it prevents "sticky" position from working */
	joverflow-x:hidden;	/* This is required to fix "position:fixed" issues on iOS */
	joverflow:hidden;	/* Why is this needed? Causes problems with "sticky" sections. */

	/* height:100%; */
	jmin-height:100%;	/* Moved to .acg class in global. We want to ensure an app covers browser height, but not necessarily an individual "outerArea" */
	jtext-align:center;
	jcolor:#374850;
	jz-index:1;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box; 
	box-sizing: border-box;
}

.headerOuterArea
{
	background-color:rgb(0,74,134);
	text-align:center;
	color:white;
	font-size:2rem;
}
.acgRwdNarrow .headerOuterArea
{
	font-size:1rem;
	font-weight:bold;
}

.headerOuterArea .innerArea
{
	padding:0.5em;
}

.innerArea
{
	jbackground-color:rgb(255,255,255);

	jdisplay:inline-block;	/* caused a scrollbar to appear even though content fit */
	position:relative;
	max-width:1240px;
	width:100%;
	jmin-height:100%;	/* Moved to .acg class in global. We want to ensure an app covers browser height, but not necessarily an individual "innerArea" */
	
	margin:auto;
	jpadding:1em;
	joverflow:hidden;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box; 
	box-sizing: border-box;
}

.acgSlideMenuArea
{
	background-color:rgb(231,231,231);
	border-bottom:1px solid rgb(215,215,215);
	color:rgb(0,113,197);
}
.acgTitle
{
	font-family:intelone;
	color:rgb(0,113,197);
	text-align:center;
	jmargin-top:1.5rem;
	font-size:2rem;
	jpadding-top:1.5rem;
	jpadding-bottom:1rem;
	jjmargin-top:1.5rem;
	margin-bottom:1rem;
}
.acgRwdNarrow .acgTitle
{
	font-size:1.5rem;
	jpadding-top:0.5rem;
	jpadding-bottom:0.5rem;
	jjmargin-top:1rem;
	margin-bottom:0.5rem;
}
.acgSubtitle
{
	font-family:intelone;
	color:rgb(128,128,128);
	text-align:center;
	font-size:1.25em;
	margin-bottom:1.5rem;
}
.acgRwdNarrow .acgSubtitle
{
	font-size:1.125rem;
	margin-bottom:0.5rem;
}
.acgTextArea
{
	padding:0 0.5rem;
	padding-top:1.5rem;
}
.acgBlock
{
	margin-bottom:1.25rem;
}
.acgBlockTitle
{
	font-family:intelone;
	color:rgb(0,113,197);
	jcolor:rgb(0,104,181);
	font-size:1.25rem;
	jjmargin-top:1em;
	margin-bottom:0.5em;
}
.acgRwdNarrow .acgBlockTitle
{
	font-size:1.125rem;
}
.acgBlockTitleLarge
{
	font-size:2rem;
	margin-top:2rem;
}
.acgVideoLabel
{
	color:rgb(0,113,197);
	font-size:0.9em;
	font-weight:bold;
}
.acgFootnotes
{
	margin-top:0.5rem;
	font-size:0.7em;
}
.acgProductTableCell
{
	display:table-cell;
	box-sizing:border-box;
	width:calc(1/2*100%);	/* IMPORTANT: This must be adjusted to the number of columns! */
	min-width:250px;
	padding-right:1em;
	vertical-align:top;
	text-align:center;
	padding:1rem;
}
.acgProductTableLabel
{
	display:table-cell;
	box-sizing:border-box;
	jvertical-align:middle;
	vertical-align:top;
	padding:1rem;
	min-width:100px;
	max-width:100px;
	position:sticky;
	left:0;
	background-color:inherit;	/* background-color must be set, otherwise scrolled content shows through */
	jpadding-left:1rem;
	font-size:0.8em;
	color:rgb(0,113,197);
	font-weight:bold;
	z-index:1;
}
.acgProductTablePart2 .acgProductTableLabel
{
	vertical-align:top;
	padding-top:1rem;
}
.acgProductTableRow
{
	display:table-row;
	background-color:rgb(255,255,255);
}
.acgProductTableRow:nth-child(odd)
{
	background-color:rgb(243,243,243);
}

table thead
{
	position: sticky;
	top:141px;
}
table thead
{
  jinset-block-start: 0; /* "top" */
}
/*
th
{
	width:calc(1/3*100%);
	min-width:400px;
}
*/

.acgTableBlockFull
{
	display:inline-block;
	box-sizing:border-box;
	width:30px;
	height:30px;
	background-color:rgb(0,104,181);
}
.acgTableBlockHalf
{
	display:inline-block;
	box-sizing:border-box;
	width:30px;
	height:30px;
	background-color:rgb(118,206,255);
}
.acgTableBlockEmpty
{
	display:inline-block;
	box-sizing:border-box;
	width:30px;
	height:30px;
	background-color:rgb(255,255,255);
	border:2px solid rgb(118,206,255);
}
.acgTableBlockSmall
{
	width:15px !important;
	height:15px !important;
}
.acgTableGradient
{
	height:20px;
	position:absolute;
	jleft:100px;
	jwidth:calc(100% - 100px);
	width:calc(100% - 0px);
	jbottom:0;
	box-sizing:border-box;
	
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&1+0,0+100 */
	background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */
}
.acgTableGradientLabel
{
	width:30px;
	height:200px;
	
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#022957+0,ffffff+100 */
background: rgb(2,41,87); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(2,41,87,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(2,41,87,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(2,41,87,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#022957', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}
.acgTableGradientLabel1
{
	vertical-align:top;
	width:60px;
	border-right:40px solid white;
	
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#022856+0,6581a0+100 */
background: rgb(2,40,86); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(2,40,86,1) 0%, rgba(101,129,160,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(2,40,86,1) 0%,rgba(101,129,160,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(2,40,86,1) 0%,rgba(101,129,160,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#022856', endColorstr='#6581a0',GradientType=0 ); /* IE6-9 */
}
.acgTableGradientLabel2
{
	width:60px;
	border-right:40px solid white;
	
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#6581a0+0,ffffff+100 */
background: rgb(101,129,160); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(101,129,160,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(101,129,160,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(101,129,160,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6581a0', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}
.acgUpTo
{
	font-size:0.5em;
}
.acgProductTableMeasurement
{
	font-size:0.8em;
	font-weight:bold;
}
.acgProductTableMeasurementSmall
{
	font-size:0.5em;
}
.acgSectionTitle
{
	color:rgb(0,113,197);
	font-weight:bold;
}

.acgScaleAnimationBefore
{
	transform:scale(0.5);
	opacity:0.3;
	transition:transform .4s cubic-bezier(.25,.8,.25,1), opacity .4s cubic-bezier(.25,.8,.25,1);
}

.acgQuoteContainer
{
	jpadding:20px;
	padding-bottom:20px;
	jmax-width:360px;
	margin:auto;
	margin-bottom:2rem;
	box-sizing:border-box;
	
	jtransition:transform .4s cubic-bezier(.25,.8,.25,1);
}

.acgQuoteBox
{
	background-color:rgb(234,234,234);
	padding:2em;
	jmargin-bottom:2rem;
	jmax-width:300px;
	jmargin:auto;
	jtransform:scale(0.5);
}
.acgQuoteBoxFull, .acgScaleAnimationAfter
{
	transform:scale(1) !important;
	opacity:1 !important;
	
	transition:transform .4s cubic-bezier(.25,.8,.25,1), opacity .4s cubic-bezier(.25,.8,.25,1);
}
.acgQuote
{
	color:rgb(0,113,197);
	font-weight:bold;
}
.acgQuoteSource
{
	color:rgb(128,128,128);
	padding-left:1em;
	margin-top:1em;
}
.acgExpandRight
{
	transform-origin:bottom left;
	padding-left:20px;
}
.acgExpandLeft
{
	transform-origin:bottom right;
	padding-right:20px;
}
.acgExpandCenter
{
	transform-origin:bottom center;
}

.acgShrink
{
	transform:scale(0.5);
}
.acgGrayBox
{
	box-sizing:border-box;
	background-color:rgb(231,231,231);
	padding:1em; 
}
.acgChipProducerTable th:not(:last-child), .acgChipProducerTable td:not(:last-child)
{
	border-right:1px solid rgb(200,200,200);
}
.acgFadeAnimationBefore
{
	opacity:0.3;
	transition:opacity .4s cubic-bezier(.25,.8,.25,1);
}
.acgFadeAnimationAfter
{
	opacity:1 !important;
	
	transition:opacity .4s cubic-bezier(.25,.8,.25,1);
}
.acgGrayLine
{
	height:2px;
	background-color:rgb(200,200,200);
	margin-bottom:1.25rem;
}
.acgRwdWide #hciDeploymentGrowthNumbers
{
	padding-right:30px;
}
.acgRwdNarrow #hciDeploymentGrowthNumbers
{
	margin-bottom:1rem;
}
.acgRwdWide #whyIsHciBeingAdoptedTitle
{
	margin-bottom:0.5rem;
}
.acgRwdNarrow #why-intel-server-systems-header
{
	jbackground-color:rgb(255,255,255);
}
#server-systems-circle
{
	width:337px;
	height:323px;
}
.acgRwdNarrow #server-systems-circle
{
	width:168px;
	height:161px;	
}
.acgRwdFlexTable2Item
{
	display:inline-block;
	flex-grow:1;
	text-align:center;
	width:25%;
}
.acgRwdNarrow .acgRwdFlexTable2Item
{
	width:50%;
}
.acgRwdWide .acgWhyIntelServerSystemsContent
{
	margin-top:-333px; /* 333px comes from height of lottie area (lottie height plus padding) */
}
.acgCertifiedSolutions
{
	jdisplay:table-cell;
	vertical-align:middle;
	text-align:right;
	jfont-size:0.9em;
	jfont-weight:bold;
	color:rgb(128,128,128);
	padding-right:1rem;
}
.acgRwdNarrow .acgCertifiedSolutions
{
	text-align:center;
	padding-right:0;
}
.acgCertifiedSolutionsCompaniesArea
{
	display:flex;
	jjustify-content:center;
	box-sizing:border-box;
	width:50%;
	padding:0.5em 0;
}
.acgRwdWide .acgCertifiedSolutionsCompaniesArea
{
	padding-left:1rem;
	border-left:1px solid rgb(113,113,113);
}
#three-families
{
	font-size:1em;
	jfont-weight:bold;
}
.acgBarExpandRight
{
	transform-origin:center left;
}
.acgWhatMakesItem
{
	margin-bottom:1em;
}