/*
HPE Certification and Support Matrix CSS
Last Updated 2-18-20
*/

@charset "utf-8";

.contentWrapper{
	margin:10px 0 40px 0;
	width:100%;
	overflow:auto;
	font-size:15px;
	line-height:22px;
	font-family:Arial, Helvetica, sans-serif;
}

.flexContent{
	max-width:1000px;
	margin-left:auto;margin-right:auto;
	padding:0 10px;
}

#bannerTitle{
	font-size:30px;
	font-weight:bold;
	line-height:36px;
	margin-top:10px;
}

#bannerSubtitle{
	margin-top:5px;
	font-size:20px;
	line-height:24px;
}

#divMenu{border:1px solid #CCC;}

/*General CSS*/

.show{display:block;}
.hide{display:none;}

.floatLeft{float:left;}
.floatRight{float:right;}

a{outline:none;color:#008767;text-decoration:none;}
a:hover{text-decoration:underline;}

h1, h2, h3, h4, h5, h6{margin:0;padding:0;}
ul{list-style-type:none;margin:0;padding:0;}

.auto-col li.stg {font-weight:bold;padding-top:3px;padding-bottom:2px;}

/*Margins and Padding*/
.marg5{margin:5px;}
.marg10{margin:10px;}
.marg15{margin:15px;}
.marg20{margin:20px;}
.margTop5{margin-top:5px;}
.margTop10{margin-top:10px;}
.margTop15{margin-top:15px;}
.margTop20{margin-top:20px;}
.margTop30{margin-top:30px;}
.margTop40{margin-top:40px;}
.margBtm5{margin-bottom:5px;}
.margBtm10{margin-bottom:10px;}
.margBtm15{margin-bottom:15px;}
.margBtm20{margin-bottom:20px;}
.margLeft10{margin-left:10px;}
.margLeft15{margin-left:15px;}
.margLeft20{margin-left:20px;}
.margRht5{margin-right:5px;}
.margRht10{margin-right:10px;}
.margRht15{margin-right:15px;}
.margRht20{margin-right:20px;}

.pad5{padding:5px;}
.pad10{padding:10px;}
.pad15{padding:15px;}
.pad20{padding:20px;}
.padTop5{padding-top:5px;}
.padTop10{padding-top:10px;}
.padTop15{padding-top:15px;}
.padTop20{padding-top:20px;}
.padBtm5{padding-bottom:5px;}
.padBtm10{padding-bottom:10px;}
.padBtm15{padding-bottom:15px;}
.padBtm20{padding-bottom:20px;}
.padLeft5{padding-left:5px;}
.padLeft10{padding-left:10px;}
.padLeft15{padding-left:15px;}
.padLeft20{padding-left:20px;}
.padRht5{padding-right:5px;}
.padRht10{padding-right:10px;}
.padRht15{padding-right:15px;}
.padRht20{padding-right:20px;}

.contentDivider{width:100%;border-bottom:1px solid #CCC;margin:10px auto;}
.contentDivider10{width:100%;border-bottom:1px solid #CCC;margin:10px auto;}
.contentDivider12{width:100%;border-bottom:1px solid #CCC;margin:12px auto;}
.contentDivider15{width:100%;border-bottom:1px solid #CCC;margin:15px auto;}
.contentDivider20{width:100%;border-bottom:1px solid #CCC;margin:20px auto;}

.textCenter{text-align:center;}

.hpe-breadcrumbs{
	color:#5a5a5a;
}

#noResults{color:#464646;}

#legacyBannerDesc{
	float:left;
	width:65%;
}

#legacyLegend{
	float:right;
	width:32%;
}

.flexContent h3{
	color:#f59964;
	font-size:20px;
}

#legacyBannerDesc, #bannerDesc{font-size:15px;line-height:22px;}
#legacyLegend{font-size:14px;line-height:18px;}

#legacyLegend h3{font-size:16px !important;color:#000;}

#legacyLegend table tr td{padding:2px;}

#legacyBannerDesc p, #bannerDesc p{margin:10px 0 0 0;}


.flexTable, .blockTable {
	border-top:1px solid #CCC;
	border-left:1px solid #CCC;
	border-collapse: collapse;
	border-spacing:0;
	margin-top:10px;
	padding: 0;
	table-layout: fixed;
	width: 100%;
}

.flexTable tr, .blockTable tr {
  padding: 5px;
}
		
.flexTable th, .blockTable th, .flexTable td, .blockTable td {
	font-size:15px;
  	padding: .625em;
  	min-height:25px;
  	color:#333;
  	border-bottom:1px solid #CCC;
  	border-right:1px solid #CCC;
}
		
.flexTable td p, .blockTable td p{
	font-size:15px;
	margin:10px 0 0 0;
}

.flexTable th, .blockTable th{
	text-align:center !important;
	background-color:#666;
	color:#f6f6f6;
	vertical-align:middle;
}

.flexTable td, .blockTable td{
	background-repeat:no-repeat;
	background-position:center;
	/*text-align: left;*/
	vertical-align:middle;
}

.flexTable th a, .flexTable th a:visited, .flexTable th a:active, .blockTable th a, .blockTable th a:visited, .blockTable th a:active{color:#FFF;}

.productTable strong{color:#4b4b4b;}

.tableHeader{
	font-size:17px;
	line-height:22px;
	font-weight:bold;
}

.flexTable img, .blockTable img{
	height:18px;
	vertical-align:middle;
}

.tr-footnotes{
	display:none;
	background-color:#f8f8f8;
}

.tr-footnotes.active{
	display:table-row;
}

.tr-footnotes td{padding-top:2px;position:relative;}

.sectionHeading, #matrixTableHeader{
	font-size:18px;
	font-weight:bold;
	line-height:22px;
}

.auto-col {
	height: auto;
	-webkit-column-count: 1;
	-moz-column-count: 1;
	column-count: 1;
	-webkit-column-gap: 8px;
	-moz-column-gap: 8px;
	column-gap: 8px;
	margin-top:3px;
}

.auto-col li{
	display: inline-block;
	width:100%;
	font-size:15px;
	line-height:26px;
}
.auto-col li h4{margin-top:3px;}

.go-top{
	position:fixed;
	right:20px;
	bottom: 20px;
	text-decoration: none;
	color: #FFF !important;
	background-color: rgba(118,118,118, 0.9);
	font-family:Arial, Helvetica, sans-serif;
	padding: 10px 12px;
	text-decoration:none;
	border:1px solid #FFF;
	display: none;
	z-index: 9999;
}
		
.go-top:hover{
	background-color: rgba(0, 0, 0, 0.6);
	text-decoration:none !important;
}

.toggle-icon{font-size:18px;line-height:22px;margin:0 auto;}
.toggle-icon:hover{text-decoration:none !important;}

.noBottom{border-bottom:none !important;}

td.textLeft{text-align:left;font-weight:normal;color:#333;}

.matrix-resources{list-style-type:none;margin:5px 0 0 0;padding:0;}
.matrix-resources li{padding-bottom:3px;}

.jump-links{
	width:100%;
	overflow:auto;
	margin-top:5px;
}

.small-notes{font-size:14px;line-height:22px;}
.small-notes p{
	font-size:14px;
	line-height:22px;
	padding-top:3px;
	padding-bottom:4px;
	margin:0;
}
.small-notes strong{
	color:#464646;
}

.small-notes ul{margin-top:8px;}
.small-notes ul li{padding-bottom:5px;}


/*Legacy content*/
input.styled_light,input.styled_dark { display: none; } 
select.styled_dark,select.styled_light { position: relative; width:463px; height:32px; opacity: 0; filter: alpha(opacity=0); z-index: 5; } 
.disabled { opacity: 0.5; filter: alpha(opacity=50);}

#divTypes{width:100%;overflow:auto;}
#divTypes .boxRadio{/*margin-left:8px;*/}
#divTypes .answerRadio{width:auto;margin-right:8px;}
#divTypes h2, .cell1 h2{margin:0;padding:0;font-size:16px;font-weight:bold;}

.labelCheck{width:auto;padding-top:3px;}
.checkWrapper{overflow:hidden;}
.radioForm{padding-top:0;}
.radioFormBlock .answerRadio{width:auto;padding-top:3px;}
.borderRight{border-right:1px solid #CCC;}
.cell1{float:left;height:auto;min-width:75px;margin:0 0 -1980px 2px;padding:5px 15px 2000px 5px;}
.tabularSurround{width:100%;overflow:hidden;}

.check{background-image:url('/images/supportmatrix/check.gif');}
.checkSquare{background-image:url('/images/supportmatrix/check-sq.gif');}
.t{background-image:url('/images/supportmatrix/crcl.jpg');}
.pSquare{background-image:url('/images/supportmatrix/square-p.gif');}
.p{background-image:url('/images/supportmatrix/trans-p.gif');}

.series-links{width:100%;overflow:auto;}
.series-links ul{list-style-type:none;margin:0;padding:0;}
.series-links ul li{padding-bottom:4px;}
.series-section{float:left;width:33%;}

.gray{background-color:#DDD;}
.blockTable td:empty{display:table-cell;background-color:#DDD;}



@media screen and (min-width: 220px){
	.go-top{font-size:14px;}
}

@media screen and (min-width: 430px){
	.auto-col {
		-webkit-column-count: 2;
		-moz-column-count: 2;
		column-count: 2;
	}
}

@media screen and (min-width: 500px){
	.go-top{font-size:13px;}
}

@media screen and (min-width: 630px){
	.auto-col {
		-webkit-column-count: 3;
		-moz-column-count: 3;
		column-count: 3;
	}
}

/*Mobile CSS*/
@media screen and (max-width: 750px) {
	.blockTable td:empty{display:none;}
	
	.series-section{float:none;width:100%;}
	
	.cell1{float:none;border-right:none;}
	
	.go-top{
		font-size:14px;
		right:16px;
		bottom:0;
		border-left:1px solid #FFF;
		border-right:1px solid #FFF;
		border-top:1px solid #FFF;
		border-bottom:none;
	}
	.toggle-icon{margin:0 auto;}
	
	/*.productTable{
		border: none;
	}
			
	.productTable thead {
		border: none;
		clip: rect(0 0 0 0);
		height: 1px;
		margin: -1px;
		overflow: hidden;
		padding: 0;
		position: absolute;
		width: 1px;
	}
			
	.productTable th, .productTable td {
		font-size:14px;
		border:none;
	}
	*/
		  
	/*.productTable tr {
		border:1px solid #CACACA;
		display: block;
		margin-bottom:15px;
		padding-top:0;
	}
	
	.productTable td {
	  display: table-row;
	  text-align:left;
	  height:auto;
	}

	.productTable td::before {
	  display:table-cell;
	  text-align:right;
	  min-width:65px;
	  white-space:normal;
	  font-weight:bold;
	}
	*/
	
	
	/*
	.blockTable - Tables with links, strong tags, long text, etc
	.flexTable - Minimal text or icons with no links, etc.
	*/
	
	/*Master Table Styles*/
	.blockTable, .flexTable{border:none;}
	/*.blockTable, .flexTable, .blockTable td, .flexTable td{border:none;}*/
	.blockTable thead, .flexTable thead{display:none;}
	.blockTable td, .flexTable td{border-bottom:1px solid #dedede;border-right:none !important;border-left:none !important;font-size:14px;}
	.blockTable td:last-child, .flexTable td:last-child, .blockTable td:first-child, .flexTable td:first-child{border-bottom:none !important;}
	.blockTable tr:not(.tr-footnotes) td:nth-of-type(1), .flexTable tr:not(.tr-footnotes) td:nth-of-type(1){
		display:block;
		text-align:center;
		font-weight:bold;
		padding:2px;
	}
	/*End of Master Table Styles*/
	
	
	td.empty{display:none !important;}
	
	/*Flex Box Table*/
	.flexTable tr{
		display:block;
		border:1px solid #CCC;
		margin-bottom:15px;
		padding:5px;
	}
	.flexTable td{
		display:flex;
		padding:3px;
		/*border:none;*/
		
		
	}
	.flexTable td::before{
		font-weight:bold;
		width:40%;
		min-width:40%;
		padding-right:6px;
		text-align:right;
	}
	/*.flexTable tr.tr-footnotes td:nth-of-type(1):before { content: ""; }*/
	/*End of Flex Box Model*/
	
	/*Block Level Table*/
	.blockTable td, .blockTable tr {
		display: block;
		/*text-align: left;*/
	}
	.blockTable td:before{
		display:block;
		font-weight:bold;
	}
	.blockTable tr{
		border:1px solid #CCC;
		margin-bottom:15px;
		padding:5px;
	}
	
	.blockTable td{padding:5px 3px;}
	
	.blockTable td strong{color:#627a76;}
	/*End of Block Level Table*/
	
	
	
	.tr-footnotes{
		display:none !important;
		background-color:#FFF;
	}
	
	.blockTable tr.tr-footnotes td{
		font-weight:normal !important;
		text-align:left;
		padding-top:0;
	}
	
	.tr-footnotes.active{
		display:block !important;
		margin-top: -15px;
		border-top: none;
	}

	
	
	
	
	/*.productTable td:before, .productTable td{padding:3px 5px 3px 0;}*/
	
	.productTable tbody tr td{background-repeat:no-repeat;background-position:left;}
	
	#legacyBannerDesc{
		float:none;
		display:block;
		width:auto;
		padding:0;
	}
	
	#legacyLegend{
		float:none;
		display:block;
		width:auto;
		padding-top:10px;
		margin-top:10px;
		border-top:1px solid #CCC;
	}
}
/*End of Mobile Styles*/

