/*
Information Libraries Shared Styles
Last Updated 11/15/2018
*/

@charset "utf-8";
@font-face {
    font-family: 'Metric Light';
    src: url('/fonts/MetricHPE-Web-Light.eot') format('embedded-opentype'), url('/fonts/MetricHPE-Web-Light.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-stretch: normal
}

@font-face {
    font-family: 'Metric Light Italic';
    src: url('/fonts/MetricHPE-Web-LightItalic.eot') format('embedded-opentype'), url('/fonts/MetricHPE-Web-LightItalic.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-stretch: normal
}

@font-face {
    font-family: 'Metric Medium';
    src: url('/fonts/MetricHPE-Web-Medium.eot') format('embedded-opentype'), url('/fonts/MetricHPE-Web-Medium.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-stretch: normal
}

@font-face {
    font-family: 'Metric Medium Italic';
    src: url('/fonts/MetricHPE-Web-MediumItalic.eot') format('embedded-opentype'), url('/fonts/MetricHPE-Web-MediumItalic.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-stretch: normal
}

@font-face {
    font-family: 'Metric Regular';
    src: url('/fonts/MetricHPE-Web-Regular.eot') format('embedded-opentype'), url('/fonts/MetricHPE-Web-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-stretch: normal
}

@font-face {
    font-family: 'Metric Regular Italic';
    src: url('/fonts/MetricHPE-Web-RegularItalic.eot') format('embedded-opentype'), url('/fonts/MetricHPE-Web-RegularItalic.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-stretch: normal
}

@font-face {
    font-family: 'Metric Semibold';
    src: url('/fonts/MetricHPE-Web-Semibold.eot') format('embedded-opentype'), url('/fonts/MetricHPE-Web-Semibold.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-stretch: normal
}

@font-face {
    font-family: 'Metric Semibold Italic';
    src: url('/fonts/MetricHPE-Web-SemiboldItalic.eot') format('embedded-opentype'), url('/fonts/MetricHPE-Web-SemiboldItalic.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-stretch: normal
}

@font-face {
    font-family: 'Metric Bold';
    src: url('/fonts/MetricHPE-Web-Bold.eot') format('embedded-opentype'), url('/fonts/MetricHPE-Web-Bold.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-stretch: normal
}

@font-face {
    font-family: 'Metric Bold Italic';
    src: url('/fonts/MetricHPE-Web-BoldItalic.eot') format('embedded-opentype'), url('/fonts/MetricHPE-Web-BoldItalic.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-stretch: normal
}

@font-face {
    font-family: 'Metric Black';
    src: url('/fonts/MetricHPE-Web-Black.eot') format('embedded-opentype'), url('/fonts/MetricHPE-Web-Black.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-stretch: normal
}

@font-face {
    font-family: 'Metric Black Italic';
    src: url('/fonts/MetricHPE-Web-BlackItalic.eot') format('embedded-opentype'), url('/fonts/MetricHPE-Web-BlackItalic.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-stretch: normal
}

@font-face {
    font-family: 'Metric Thin';
    src: url('/fonts/MetricHPE-Web-Thin.eot') format('embedded-opentype'), url('/fonts/MetricHPE-Web-Thin.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-stretch: normal
}

@font-face {
    font-family: 'Metric Thin Italic';
    src: url('/fonts/MetricHPE-Web-ThinItalic.eot') format('embedded-opentype'), url('/fonts/MetricHPE-Web-ThinItalic.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-stretch: normal
}

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);
}

.sign-in a {
    color: #01a982;
}

/*Dropdown bars*/

.dropdown {
    font-family: Arial, sans-serif;
    min-width: 285px;
    max-width: 1000px;
    padding: 4px 10px;
    background-color: #01a982;
    vertical-align: middle;
    margin: 10px 0 0 0;
    cursor: pointer;
}

/*.dropdown{font-family:Arial,sans-serif;min-width:285px;max-width:1000px;padding:4px 10px;border:2px solid #2ad2c9;background-color:#FFF;vertical-align:middle;margin:10px 0 0 0;cursor:pointer;}*/

.dropdown-full {
    width: 100%;
    overflow: hidden;
}

.dropdown-text {
    min-width: 220px;
    color: #FFF;
    font-size: 15px;
    font-weight: bold;
}

/*.dropdown-text{float:left;min-width:220px;color:#666;font-size:16px;font-weight:bold;}*/

.dropdown-image {
    width: 20px;
    padding-top: 10px;
}

.dropdown-selection {
    color: #FFF;
    font-size: 14px;
    width: 100%;
    padding-top: 2px;
}

.popup {
    font-family: Arial, sans-serif;
    max-width: 1000px;
    min-width: 285px;
    border: 2px solid #CCC;
    padding: 5px 10px;
    overflow: hidden;
    margin-top: 3px;
}

.popup,
.labelCheck,
.answerRadio,
.cat33 {
    font-family: Arial, sans-serif;
}

.auto-col {
    height: auto;
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
    -webkit-column-gap: 8px;
    -moz-column-gap: 8px;
    column-gap: 8px;
    margin-top: 3px;
}

.auto-col li {
    display: inline-block;
    width: 100%;
    line-height: 20px;
}

.auto-col li h4 {
    margin-top: 3px;
}

.hpeRuler {
    width: 100%;
    border-bottom: 1px solid #CCC;
    margin: 8px 0 8px 0;
}

#divSort {
    margin-top: 20px;
    width: 100%;
    overflow: auto;
    padding-bottom: 4px;
    border-bottom: 1px solid #CCC;
}

#divResultsNum {
    float: left;
    margin-left: 10px;
    margin-top: 10px;
}

#divSortSelect {
    float: right;
    margin-right: 10px;
}

#sortSelect {
    margin: 0;
    padding: 5px;
}

#sortSelect option {
    padding: 5px;
}

.totalNumber {
    color: #000;
}

#totalNum {
    font-weight: 800;
}

.sort-highlight {
    background-color: #f6f6f6;
}

.raLink {
    font-size: 14px;
    margin-top: 3px;
}

.searchWrapper {
    width: 285px;
    float: right;
    text-align: right;
    overflow: hidden;
    border: 2px solid #CCC;
    margin-bottom: 3px;
}

.searchWrapper:hover {
    border: 2px solid #767676;
}

.searchWrapper #rfSearch {
    width: 220px;
    border: 0;
    padding: 4px;
    margin: 0;
    font-size: 14px;
    color: #767676;
    outline: 0;
}

#txtSearch {
    padding: 6px;
    font-size: 16px;
    color: #6f6f6f;
    width: 275px;
    border: 1px solid #CCC;
    display: inline;
    margin-right: 3px;
}

#searchHelp {
    padding-left: 10px;
    margin-top: 10px;
}

#searchHelp ul {
    list-style-type: circle;
    padding-left: 18px;
}

#searchHelp ul li {
    padding-bottom: 5px;
}

.help {
    float: right;
    margin: 6px 8px 0 5px;
    height: 15px;
    width: 15px;
    background: transparent url("/tridion/assets/i/common/s-21px-hpe.png") no-repeat scroll 0 -949px;
}

.help:hover {
    cursor: pointer;
}

#minimizeIcon {
    height: 18px;
    width: 18px;
    background: transparent url("/tridion/assets/i/common/s-21px-hpe.png") no-repeat scroll 0 -877px;
    cursor: pointer;
}

input {
    padding-bottom: 1px;
}

.redNum {
    color: #FFF;
}

.returnTop {
    min-width: 285px;
    max-width: 1000px;
    text-align: right;
    font-size: 14px;
    width: auto !important
}

.returnTop a {
    color: #808080;
    text-decoration: none;
}

.returnTop a:hover {
    text-decoration: underline;
}

/*HPE Tables*/

.newTable {
    min-width: 285px;
    max-width: 1000px;
    width: 100%;
    border-left: 1px solid #CCC !important;
    border-top: 1px solid #CCC !important;
    border-collapse: collapse;
}

.newTable thead tr th {
    background-color: #767676;
    text-align: left;
    padding: 12px 10px;
    color: #FFF;
    font-size: 15px;
}

/*.newTable thead tr th{background-color:#617C91;text-align:left;padding:12px 10px;color:#FFF;font-size:15px;}*/

.newTable tbody tr td {
    border-bottom: 1px solid #CCC;
    border-right: 1px solid #CCC;
    padding: 12px 10px;
    color: #5a5a5a;
    font-size: 14px;
}

/*.newTable tbody tr td a{color:#007DBA;text-decoration:none;}*/

.newTable tbody tr td a {
    color: #008767;
    text-decoration: none;
}

.newTable tbody tr td a:hover {
    text-decoration: none;
}

.newTable th a:link {
    color: #FFF;
    text-decoration: none;
}

.newTable th a:active {
    color: #FFF;
    text-decoration: none;
}

.newTable th a:visited {
    color: #FFF;
    text-decoration: none;
}

.newTable th a:hover {
    color: #FFF;
    text-decoration: none;
}

.newTable tbody tr td:nth-child(3) {
    min-width: 65px;
}

.newTable tbody tr td:nth-child(4) {
    min-width: 65px;
}

.hpeTable tr td a {
    color: #00A882;
    text-decoration: none;
}

.hpeTable tr td a:hover {
    text-decoration: underline !important;
}

#divClear {
    float: right;
}

.divDivider {
    width: 100%;
    margin: 6px 0 6px 0;
    border-bottom: 1px solid #CCC;
}

.clearIcon {
    height: 15px;
    width: 15px;
}

.clearIcon.enabled {
    background: transparent url("/tridion/assets/i/common/s-21px-hpe.png") no-repeat scroll 0 -879px;
}

.clearIcon.enabled:hover {
    cursor: pointer;
}

.clearIcon.disabled {
    background: transparent url("/tridion/assets/i/common/s-21px-hpe.png") no-repeat scroll 0 -914px;
}

#noCollateral {
    margin-top: 10px;
    padding: 10px;
    font-style: italic;
}

#divShowHide {
    font-size: 16px;
}

.cat33 {
    float: left;
    width: 33%;
}

.cat25 {
    float: left;
    width: 25%;
}

.cat20 {
    float: left;
    width: 20%;
}

.hpeWrapper {
    width: 100%;
    height: auto;
    color: #000;
    padding-right: 8px;
    display: inline-block;
}

.hpeCheck,
.hpeRadio {
    float: left;
}

.hpeLabel {
    float: left;
    max-width: 90%;
    font-size: 14px !important;
    padding-top: 2px;
}

.cat33 h4,
.popup h4 {
    font-size: 16px;
    line-height: 20px;
}

#topClear {
    max-width: 1000px;
    min-width: 285px;
    text-align: right;
    margin-top: -35px;
}

/*Selector Tools*/

#divNumAndCompare {
    width: 100%;
    overflow: auto;
    margin: 10px 0;
}

#numitems {
    padding: 5px;
    width: 650px;
    overflow: auto;
    float: left;
    color: #D7410B;
}

#divNum {
    width: auto;
    float: left;
}

#divInstruct {
    width: auto;
    float: left;
}

/*Buttons*/

a.btn {
    float: none;
    display: inline-block;
    margin: 0;
    padding: 6px 18px;
    text-decoration: none;
}

a.btn:hover {
    text-decoration: none !important;
}

a.btn-default {
    border: 2px solid #01a982;
    color: #000 !important;
    border-collapse: collapse;
}

a.btn-default:hover {
    background: 0 0;
    box-shadow: none;
    color: #000;
    outline: #00B388 solid 4px;
    outline-offset: -2px
}

a.btn-secondary {
    border: 2px solid #858585;
    color: #000;
    border-collapse: collapse;
}

a.btn-secondary:hover {
    background: 0 0;
    box-shadow: none;
    color: #000;
    outline: #a3a3a3 solid 4px;
    outline-offset: -2px
}

a.secondary-button {
    min-height: 40px;
    min-width: 200px;
    max-width: 400px;
    background: 0 0;
    color: #000;
    outline: 0;
    border: 2px solid #00B388;
}

.primary-button {
    color: #000;
    border: 2px solid #00B388;
    border-collapse: collapse
}

/*Gray HPE button*/

a.gray-button {
    float: none;
    width: auto;
    padding: 5px 18px;
    height: 30px;
    color: #FFF !important;
    background-color: #767676;
    ;
    font-size: 18px;
    line-height: 30px !important;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border: 0;
    cursor: pointer;
    text-decoration: none !important;
}

a.gray-button:hover {
    float: none;
    text-decoration: none !important;
    width: auto;
    padding: 5px 18px;
    color: #FFF !important;
    background-color: #5A5A5A;
    font-size: 18px;
    line-height: 30px !important;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border: 0;
    cursor: pointer;
}

a.primary-button {
    width: auto;
    float: left;
    padding: 0 20px;
    height: 34px;
    color: #FFF !important;
    background: #01a982;
    font-size: 18px;
    line-height: 34px !important;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border: 0;
    cursor: pointer;
}

a:hover.primary-button {
    width: auto;
    float: left;
    padding: 0 20px;
    color: #FFF !important;
    background: #0f8568;
    font-size: 18px;
    line-height: 34px !important;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border: 0;
    cursor: pointer;
    text-decoration: none !important;
}

/*Green primary button*/

a.blue-button {
    width: auto;
    margin: 0;
    padding: 5px 20px;
    height: 34px;
    color: #FFF !important;
    background: #01a982;
    font-size: 16px;
    line-height: 34px !important;
    border: 0;
    cursor: pointer;
}

a.blue-button:hover {
    width: auto;
    padding: 5px 20px;
    color: #FFF !important;
    background: #0f8568;
    font-size: 16px;
    line-height: 34px !important;
    border: 0;
    cursor: pointer;
    text-decoration: none !important;
}

/*Green primary button*/

a.green-button {
    width: auto;
    margin: 0;
    padding: 5px 20px;
    height: 34px;
    color: #FFF !important;
    background: #01a982;
    font-size: 16px;
    line-height: 34px !important;
    border: 0;
    cursor: pointer;
}

a.green-button:hover {
    width: auto;
    padding: 5px 20px;
    color: #FFF !important;
    background: #0f8568;
    font-size: 16px;
    line-height: 34px !important;
    border: 0;
    cursor: pointer;
    text-decoration: none !important;
}

/*Disabled HPE button*/

a.disabled-button {
    width: auto;
    margin: 0;
    padding: 5px 20px;
    height: 34px;
    color: #FFF !important;
    background-color: #CCC;
    font-size: 16px;
    line-height: 34px !important;
    border: 0;
    cursor: default;
    text-decoration: none !important;
}

a.disabled-button:hover {
    text-decoration: none !important;
}

.resource_icon {
    clear: left;
    color: #000 !important;
    display: inline;
    padding-left: 20px;
    line-height: 22px;
    background: url(/tridion/assets/i/common/s-15px-hpe.png) no-repeat scroll;
}

.icn_jpg {
    background: url(/tridion/assets/i/common/s-15px-hpe.png) no-repeat scroll 0 -1425px transparent;
}

.icn_manual {
    background: url(/tridion/assets/i/common/s-15px-hpe.png) no-repeat scroll 0 -1495px transparent;
}

.icn_qs {
    background: url(/tridion/assets/i/common/s-15px-hpe.png) no-repeat scroll 0 -1250px transparent;
}

.icn_pdf {
    background: url(/tridion/assets/i/common/s-15px-hpe.png) no-repeat scroll 0 -41px transparent;
}

.icn_html {
    background: url(/tridion/assets/i/common/s-15px-hpe.png) no-repeat scroll 0 -1322px transparent;
}

.icn_video {
    background: url(/tridion/assets/i/common/s-15px-hpe.png) no-repeat scroll 0 -681px transparent;
}

.icn_ppt {
    background: url(/tridion/assets/i/common/s-15px-hpe.png) no-repeat scroll 0 -2372px transparent;
}

.jon-tooltip {
    display: inline;
    position: relative;
}

.jon-tooltip:hover:after {
    background: #e5e5e5;
    border-radius: 5px;
    bottom: 26px;
    color: #000;
    content: attr(title);
    left: 20%;
    padding: 5px 15px;
    position: absolute;
    z-index: 98;
    width: 220px;
}

.jon-tooltip:hover:before {
    border: solid;
    border-color: #e5e5e5 transparent;
    border-width: 6px 6px 0 6px;
    bottom: 20px;
    content: "";
    left: 50%;
    position: absolute;
    z-index: 99;
}

/*General CSS*/

.tabularSurround {
    width: 100%;
    overflow: hidden;
}

.show {
    display: block;
}

.hide {
    display: none;
}

.floatLeft {
    float: left;
}

.floatRight {
    float: right;
}

a {
    outline: none;
    color: #008767;
}

.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;
}

.topText {
    width: 100%;
    padding: 30px 0 0 10px;
}

@media screen and (min-width: 220px) {
    #topClear,
    .topText {
        margin-right: 8px;
    }
    #topClear {
        margin-top: 10px;
    }
    .newTable thead tr th,
    .newTable thead tr td {
        padding: 5px;
    }
}

@media screen and (min-width: 500px) {
    .newTable thead tr th,
    .newTable thead tr td {
        padding: 12px 10px;
    }
}

@media screen and (min-width: 875px) {
    #topClear {
        margin-top: -30px;
    }
}

@media screen and (min-width: 1000px) {
    #topClear,
    .topText {
        margin-right: 0;
    }
}