/* CSS Document */
/* SPNG Global - used on all pages  */
/* JMP - removed per v18 (story 1224297).
$colorTopicCommunity: $paletteBlue40;
$colorTopicDefault: $paletteCoolGray40;
$colorTopicDocumentation: $paletteTeal40;
$colorTopicDownloads: $paletteOrange30;
$colorTopicMysupport: $palettePurple60;
$colorTopicTicketing: $paletteMagenta50;
$colorTopicTraining: $paletteGreen40;
*/
/* JMP - removed per v18 (story 1224297).
$mapTopicsToColors: (
        mysupport: $colorTopicMysupport,
        downloads: $colorTopicDownloads,
        ticketing: $colorTopicTicketing,
        documentation: $colorTopicDocumentation,
        community: $colorTopicCommunity,
        training: $colorTopicTraining
);
*/
/* JMP - removed per v18 (story 1224297).
@mixin cardTopStripe($color: $colorTopicDefault) {
  border-top-color: $color;
  background-image: linear-gradient(to bottom, $color 3px, transparent 3px);
}
@mixin cardShadow($state: normal, $color: black, $alpha: if($state == active, 0.1, 0.05)) {
  $cardNormalShadowSizes: 0 4px 14px 0;
  $cardActiveShadowSizes: 0 4px 17px 0;
  box-shadow: if($state == active, $cardActiveShadowSizes, $cardNormalShadowSizes) rgba($color, $alpha);
}
@mixin pulseShadowKeyframes($color: $colorTopicDefault) {
  0%, 20%, 40%, 100% {
    @include cardShadow;
  }
  10%, 30%, 50% {
    @include cardShadow(normal, $color, 0.5);
  }
}
*/
.ng-cloak {
  display: none !important; }

#ietran_ui_langselect {
  font-family: inherit !important;
  font-size: inherit !important;
  height: 2.5rem;
  padding: .5rem; }

#ibm-translate-module p {
  float: right; }

#ibm-top {
  background-color: transparent; }
  #ibm-top.spng-omnibox-open {
    min-height: 1007px; }

#ibm-content-main {
  min-height: 700px; }

.ibm-landing-page ul#ibm-navigation-trail {
  padding-top: 10px; }

#spng-top-tools {
  background-color: #f9f9f9;
  min-height: 0;
  padding: 5px 0; }

#home {
  margin-bottom: 2rem; }
  #home .ibm-columns .ibm-col-1-1 {
    text-align: center; }

span.spng-icon-link {
  display: inline-block;
  margin: 70px 10px 0; }

span.whats-new {
  font-size: 14px;
  color: white;
  padding-left: 18px;
  text-decoration: underline; }
  span.whats-new a {
    color: #ffffff !important; }
    span.whats-new a:visited {
      color: #ffffff !important; }

.nowrap {
  white-space: nowrap; }

#home-icons .ibm-columns .ibm-col-6-1 a:hover span.spng-icon-link, #home-icons .ibm-columns .ibm-col-6-1 a:focus span.spng-icon-link {
  color: white; }

/*TopLinks menus Ends Here */
#searchFilter-label {
  width: 570px; }

/* CONTENT CARD STYLES - BEGIN */
.ibm-card-spng {
  min-height: 260px;
  position: relative; }
  html.ibm-grid-small .ibm-card-spng, html.ibm-grid-xsmall .ibm-card-spng, html.touchevents .ibm-card-spng {
    min-height: unset; }

.ibm-col-6-2 .ibm-card-spng,
.ibm-col-6-4 .ibm.-card-spng {
  height: 260px;
  overflow: hidden; }
  html.ibm-grid-small .ibm-col-6-2 .ibm-card-spng, html.ibm-grid-xsmall .ibm-col-6-2 .ibm-card-spng, html.touchevents .ibm-col-6-2 .ibm-card-spng, html.ibm-grid-small
  .ibm-col-6-4 .ibm.-card-spng, html.ibm-grid-xsmall
  .ibm-col-6-4 .ibm.-card-spng, html.touchevents
  .ibm-col-6-4 .ibm.-card-spng {
    height: unset;
    overflow: initial; }

.ibm-col-6-2.spng-rows-2 .ibm-card-spng {
  height: 540px; }

/* CONTENT CARD STYLES - END */
div#product-content div[class^=ibm-col-] .ibm-card {
  /* Allow only one line for each link. */
  /* Make sure the "View all ..." link in content cards is always dark gray. */ }
  div#product-content div[class^=ibm-col-] .ibm-card li a {
    line-height: 1.62rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 90%; }
    html.ibm-grid-small div#product-content div[class^=ibm-col-] .ibm-card li a, html.ibm-grid-xsmall div#product-content div[class^=ibm-col-] .ibm-card li a, html.touchevents div#product-content div[class^=ibm-col-] .ibm-card li a {
      overflow: initial;
      text-overflow: initial;
      white-space: normal; }
  div#product-content div[class^=ibm-col-] .ibm-card li.spng-view-all-link a, div#product-content div[class^=ibm-col-] .ibm-card li.spng-view-all-link a:link, div#product-content div[class^=ibm-col-] .ibm-card li.spng-view-all-link a:visited, div#product-content div[class^=ibm-col-] .ibm-card li.spng-view-all-link a:hover, div#product-content div[class^=ibm-col-] .ibm-card li.spng-view-all-link a:focus {
    color: #323232 !important; }

/* Avoid link icon clipping in IE (modernizr tags <html> with "unknownX" and "gecko1" classes for IE) */
html.unknownX.gecko1 div#product-content div[class^='ibm-col-'] .ibm-card li a[class*='-link']::before {
  padding: 1px 0 0 1px; }

/*Styles for pop-up links*/
.ibm-popup-link {
  display: inline-block;
  margin: 0;
  padding-left: 2.2em;
  position: relative;
  cursor: pointer; }

/* Leadspace */
.spng-home-leadspace {
  background: url("images/spng_leadspace_home.png") no-repeat 50% 50%/cover;
  background-color: #264a60; }

.lead-new-link {
  float: right;
  margin-top: 0.6em;
  padding-left: 10px; }
  .lead-new-link ::before {
    clear: both; }
  .lead-new-link ::after {
    clear: both; }

.home-new-link {
  float: right;
  margin-top: -30px; }
  .home-new-link ::before {
    clear: both; }
  .home-new-link ::after {
    clear: both; }

.spng-home-title {
  margin: auto; }
  .spng-home-title ::after {
    clear: both; }

/* OMNIBOX */
/* #spng-search is the form that wraps the omnibox components */
#spng-search {
  margin: 5px auto 5px;
  display: inline-block;
  position: relative;
  width: 100%; }

/*
  Wrapper for the omnibox results section
  we need position relative to frame the reference for the results section,
  which is position:absolute, letting it be 'outside' the lead space
*/
.search-results-wrapper {
  position: relative; }
  .search-results-wrapper ::before {
    clear: both; }

/*
  Omnibox search results section on the home page only
*/
.home-search-results {
  margin-left: auto;
  margin-right: auto;
  min-width: 556px;
  max-width: 710px !important;
  left: -4px;
  margin-top: -2px; }

/*
  Omnibox search results section on secondary pages only
*/
.small-search-results {
  max-width: 458px !important;
  left: 0;
  margin-top: -10px; }

/*
 Omnibox search results - styles common to all versions
  */
.common-search-results {
  border: 1px solid #3c4646;
  background-color: #ffffff;
  width: calc(80% - 42px);
  padding: 10px 20px;
  position: absolute;
  height: auto;
  max-height: 400px;
  min-height: 157px;
  overflow-y: scroll;
  right: 0;
  top: 1px;
  z-index: 9999; }
  .common-search-results ul li, .common-search-results p, .common-search-results h2 {
    text-align: left; }
  .common-search-results .result_section {
    clear: both; }
  .common-search-results .category {
    float: left;
    width: 120px;
    padding: 8px;
    color: #ffffff;
    text-align: left; }
    .common-search-results .category p {
      color: #ffffff; }
  .common-search-results .results {
    float: left;
    width: 500px;
    padding: 8px 0 8px 8px; }
    .common-search-results .results ul {
      margin-top: 0; }
    .common-search-results .results .more {
      float: right; }

.home-search-query {
  margin-bottom: 0;
  background-color: white;
  border-radius: 4px 4px 4px 4px;
  font-weight: normal;
  padding: 0 2px 0 10px;
  text-align: left;
  width: 80%;
  min-width: 600px;
  max-width: 752px !important;
  vertical-align: bottom;
  -webkit-appearance: none; }
  .home-search-query:focus {
    color: black; }

.small-search-query {
  width: 80%;
  max-width: 500px !important; }

.common-search-link {
  display: inline-block;
  line-height: 2.5em;
  position: relative;
  left: 10px;
  text-decoration: none;
  text-indent: -9999px;
  width: 0; }

.common-search-link::before {
  text-indent: 0; }

.home-search-link {
  line-height: 2.5em; }

/* Omnibox on all secondary pages */
#search-header-wrapper {
  background-color: #4178be;
  border-top: 1px solid #ececec;
  border-width: 1px 0;
  margin-bottom: 1.25rem; }

#search-header {
  padding: 25px 0; }

#search-header-small {
  padding: 25px 0; }
  #search-header-small h3 a {
    color: #ffffff; }
  #search-header-small h3 a:visited {
    color: #ffffff; }

/* TOP HEADING BAR STARTS */
#small-header {
  background-color: white;
  border-bottom: 1px solid #ececec;
  margin-bottom: 1em; }
  #small-header h2 {
    padding: 0; }
    #small-header h2 img {
      vertical-align: bottom;
      margin-right: 5px; }

/* Product optional info (Lenovo link and alert link) colors. */
product-optional-text a.ibm-textcolor-orange-50:link,
product-optional-text a.ibm-textcolor-orange-50:visited {
  color: #d74108; }
product-optional-text a.ibm-textcolor-red-50:link,
product-optional-text a.ibm-textcolor-red-50:visited {
  color: #e71d32; }
product-optional-text a.ibm-textcolor-blue-50:link,
product-optional-text a.ibm-textcolor-blue-50:visited {
  color: #4178be; }

/* Search results formatting */
.ibm-search-results mark {
  background: none;
  color: inherit;
  font-weight: bold; }

/* Chat Invitation */
#divChatInvite {
  padding: 5px;
  z-index: 9999999999;
  background-color: #4178be;
  border: 0px solid #4178be; }
  #divChatInvite .chatInviteClose {
    float: right;
    padding-top: 5px; }
  #divChatInvite .chatInviteContent {
    padding: 20px 15px 10px 15px; }

.hand-pointer {
  cursor: pointer;
  cursor: hand; }

/* Orchestrator */
.watsonRecommendsImage {
  background: url("images/watson-recommends.png") no-repeat center center;
  height: 20px;
  width: 22px;
  display: inline-block;
  cursor: pointer;
  cursor: hand;
  margin-left: 5px; }

/* Overlays */
.WEAContainer {
  padding: 10px;
  height: 565px; }

.ng-modal-overlay {
  /* A dark translucent div that covers the whole screen */
  position: absolute;
  z-index: 900;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #111;
  opacity: 0.5; }

.ng-modal-dialog {
  /* A centered div above the overlay with a box shadow. */
  z-index: 920;
  position: absolute;
  width: 750px;
  /* Default */
  /* Center the dialog */
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  background-color: #ffffff;
  box-shadow: 4px 4px 80px #000; }

.ng-modal-dialog-content {
  padding: 0 20px 0 20px;
  text-align: left;
  max-height: 600px; }

.ng-modal-close {
  margin: 0;
  padding: 5px 5px 0 0;
  position: absolute;
  right: 0; }

.ng-modal-noninteractive {
  padding-top: 40px;
  padding-bottom: 40px; }

.invalidTicketDialogField {
  background: #FCD3D0 none repeat scroll 0 0 !important; }

/* MEDIA QUERIES STARTS
 Note - omnibox current defaults to 'mobile mode' for widths under 768px,
 aligning media query limit to match - in mobile mode there is no type-ahead support
 so we don't have to worry about the inline results section
*/
@media only screen and (min-width: 481px) and (max-width: 767px) {
  #spng-search {
    min-width: 410px;
    /* setting width for Mac Pro safari issue */ }

  #spng-search input[type="search"] {
    border: medium none;
    border-radius: 0;
    color: #ccc;
    font-size: 1.5em !important;
    font-weight: normal;
    /* height: auto !important; - Removed per defect 1425621. Seems to work fine in all browsers (in desktop and mobile modes) without it. */
    width: 75%; }

  .common-search-results {
    width: calc(75% - 42px);
    min-width: 320px; }

  .home-search-query {
    min-width: 360px; } }
@media only screen and (max-width: 480px) {
  #home {
    min-height: 128px;
    padding-top: 8px !important; }

  .common-search-link {
    left: 0; }

  .small-search-link {
    left: 10px; }

  .home-search-results {
    width: calc(100% - 67px);
    min-width: 200px;
    padding: 10px 10px 10px 5px;
    margin-left: 0;
    margin-right: 0;
    left: 0; }

  .small-search-results {
    width: calc(100% - 92px);
    min-width: 200px; }

  #spng-search {
    width: calc(100vw - 40px);
    max-width: calc( 100% - 10px);
    min-width: calc( 100% - 10px);
    margin: 0px auto 0px; }
    #spng-search input[type="search"] {
      width: calc(100% - 50px);
      float: left; }

  .home-search-results-wrapper {
    /* width: calc(100vw - 50px); */
    width: 100%; }

  .home-search-query {
    min-width: 260px; } }
/* CHWE details page */
.ng-sys-details tbody {
  background-color: white; }

/* END CHWE details page */
/* Offscreen iframes used by httpRetryInterceptor.factory.js::loadInIframe(). */
iframe.spng-load-helper {
  position: absolute;
  top: 0;
  left: -10000px;
  width: 1px;
  height: 1px;
  border: 0; }

/* Error pages: extra blank space for <br> within error message. */
#error-page h2 + p {
  /*
  &:first-line {
    font-weight: bolder;
  }
  */ }
  #error-page h2 + p br {
    content: " ";
    display: block;
    margin: 1em 0; }

/*# sourceMappingURL=spng.css.map */
