/* dr, kkh/2019.08.23 13:55 */

/* gradient backgrounds based on bgcolor */
#NPXBanner.bg-dark-purple-tint1 {
    background: #291b44 linear-gradient(120deg, #291b44 0%, #8d3785 100%);
}
#NPXBanner.bg-blue-tint2 {
    background: #225792 linear-gradient(120deg, #000000 0%, #225792 100%);
}
#NPXBanner.bg-red {
    background: #e90029 linear-gradient(120deg, #000000 0%, #e90029 100%);
}
#NPXBanner.bg-teal {
    background: #07858b linear-gradient(120deg, #225792 0%, #07858b 100%);
}

#NPXProdCTA.bg-dark-purple-tint1 {
    background: #2d1945 linear-gradient(120deg, #2d1945 0%, #5b348a 100%);
}
#NPXKeySpecifications.bg-dark-purple-tint2 {
    background: #442667 linear-gradient(90deg, #2d1945 0%, #5b348a 50%, #2d1945 100%);
}

/* sets vertical alignment in banners */
#NPXBanner > div > div > .layout-multicolumn,
#NPXProdBanner > div > div > .layout-multicolumn {
    align-items: center;
}
#NPXProdBanner h1 {
    margin-top: 0;
}
#NPXProdBanner {
    padding-top: 1.2em;
}

/* image carousel navigation */
#NPXProdBanner .carousel-list {
    padding: 16px 0;
}
#NPXProdBanner .carousel .carousel-list img  {
    width: 80%;
    height: auto !important;
    margin-left: 10%;
}
#NPXProdBanner .carousel-pagination {
    bottom: -16px;
}

/* special handling for series CTAs to ensure red tertiary and red
   primary both use dark red hover. To avoid messing with other red
   tertiary buttons, the special handling is tied to orange tertiarry
   buttons */

#NPXProdBanner a.btn-teritiary.bg-orange {
    color: #e90029 !important;
    border-color: #e90029 !important;
    background: transparent !important;
}

#NPXProdBanner a.btn-teritiary.bg-orange:hover {
    color: #f8f8f8 !important;
    background: #740014 !important;
    border-color: #740014 !important;
}

/* reduce vertical for CTA preceding or following tabs/grid panel */
#NPXTabsCTA {
    padding-top: 0;
    margin-top: -1.5em;
}
#NPXGridCTA {
    padding-top: 0.5em;
}
#NPXExploreAll h3 {
    margin-top: 1.7em;
}
#NPXExploreAllTopCTA {
    padding-bottom: 0;
}

/* reduce related item list link font size when used in tabs panel
   with multiple column controls */
#NPXExploreAllTabs .keysight-column-control + .keysight-column-control .three-columns .keysight-related-item-list .relLink,
#NPXExploreAllTabs .keysight-column-control + .keysight-column-control .four-columns .keysight-related-item-list .relLink,
#NPXExploreAllTabs .keysight-column-control + .keysight-column-control .five-columns .keysight-related-item-list .relLink,
#NPXExploreAllTabs .keysight-column-control + .keysight-column-control .six-columns .keysight-related-item-list .relLink {
    font-size: 1rem;
}

/* reduce indent for bulleted list in cards */
.grid-four .card-desc ul,
.grid-five .card-desc ul,
.grid-six  .card-desc ul {
    padding-left: 1.5em;
}

/* styling for related item list in grid panel */
.layout-grid .keysight-related-item-list h4.relLink-subTitle {
    font-size: .92em;
    margin-top: 2.4em; 
}
.layout-grid .keysight-related-item-list p.relLink {
    font-size: 1em;
}
.layout-grid .keysight-related-item-list p.relLink a {
    display: inline;
}

/* anchor links strip */
#NPXAnchorLinks { 
    padding: 0;
} 
#NPXAnchorLinks p { 
    margin: 0.7em 1em; 
}
#NPXAnchorLinks .card {
    margin-top: 0;
    margin-bottom: 0;
}
#NPXAnchorLinks .card .card-desc p {
    border-bottom: 1px solid transparent;
}
#NPXAnchorLinks .card:hover .card-desc p { 
   border-bottom: 1px solid #ae001e;
}
#NPXAnchorLinks .card .card-desc {
    font-size: 1.1rem;
    text-align: center;
}
#NPXAnchorLinks .card .card-desc p span {
    font-size: 100% !important;
}

@media (min-width: 1075px) {
  #NPXAnchorLinks .grid-six > *,
  #NPXAnchorLinks .grid-five > * {
    width: auto;
  }
}
@media (min-width: 860px) {
  #NPXAnchorLinks .grid-six > *,
  #NPXAnchorLinks .grid-five > * {
    width: auto;
  }
}
@media (min-width: 645px) {
  #NPXAnchorLinks .grid-six > *,
  #NPXAnchorLinks .grid-five > * {
    width: auto;
  }
}

/* Configurations Panel Spacing */
#NPXStdConfig {
  padding-bottom: 0;
}

/* vertically center headings in tables */
.rte table h1, .rte table h2, .rte table h3, .rte table h4, .rte table h5, .rte table h6 { 
  margin: 0.25em 0; 
}

/* Product last panel CTA */
#NPXProdCTA .eqCol {
   min-height: 150px;
}
#NPXProdCTA .rte p {
    margin-bottom: 1.3em;
    font-size: 1.25rem;
}
#NPXProdCTA div.keysight-image {
    position: relative;
    left: 50%;
    margin-left: -128px;
    height: 144px;
    width: 256px;
}
@media (min-width: 1075px) {
  #NPXProdCTA div.keysight-image {
    position: absolute;
    right: 0;
    left: auto;
    margin-left: 0;
    height: 144px;
    width: 256px;
  }
}