/* Colors
#222363 Cor primária
#25aae1 Cor secundária 
*/

/* Globals and resets */
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700');

html, body {
    font-family: 'Open Sans', 'Ubuntu', Arial, "Myriad Pro", "Myriad Pro Regular", "Helvetica Neue", Helvetica, sans-serif!important;
}
  /* Portal Colors Reset */
  a {
    color: #bbbbbb;
  }
  a:hover, a:focus, .ibm-sp-launcher-link a:hover .launcher-subtitle, .ibm-sp-launcher-link a:active .launcher-subtitle, .ibm-sp-launcher-link a:focus .launcher-subtitle {
    color: #4C4C4C;
  }
  button.ibm-sp-action,
  .btn-primary,
  .sp-primary-button {
    border-color: #222363!important;
    background-color: #222363!important;
  }
  button.ibm-sp-action:hover,
  .btn-primary:hover,
  .sp-primary-button:hover,
  button.ibm-sp-action:focus,
  .btn-primary:focus,
  .sp-primary-button:focus,
  button.ibm-sp-action:active,
  .btn-primary:active,
  .sp-primary-button:active {
    outline: none;
    border-color: #25aae1!important;
    background-color: #25aae1!important;
  }
  button.ibm-sp-action.ibm-sp-secondary-button:hover {
    color: #FFFFFF!important;
    border-color: #222363!important;
    background-color: #222363!important;
  }
  button.ibm-sp-action.ibm-sp-secondary-button {
    color: #222363!important;
    background-color: transparent!important;
  }
  .cdui-modal .cdui-modal-dialog .cdui-modal-header,
  .cdui-modal-header {
    background-color: #222363!important;
  }
  .sp-asterisk:before {
    color: #222363;
  }

/* Página de Login */
.login-page { background-color: #f2f2f2; }
.login-page > header { 
    text-align: right;
    background-color: #f2f2f2;
}
.login-page > header > .header-center {
    max-width: 400px;
    padding: 0 15px;
    margin: 0 auto;
}
@media screen and (max-width: 480px) {
  .login-page > header > .header-center {
    max-width: 320px;
  }
}
.login-page > header .small-logo {
    width: 100px;
    height: 52px;
    padding: 10px;
    margin: 0;
    background-size: 100px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url('logo.png');
}
.login-page > header .header-2 { color: #222363; }

.login-body { height: auto; }

.login-page .container {
  padding: 0;
  height: auto;
}

.login-page #loginContainer {
    max-width: 500px;
    width: 100%;
    margin: 30px auto 0;
    padding: 40px;
    border-radius: 35px;
    background-color: #f7f7f7;
    -webkit-box-shadow: 0px 10px 20px #E2E2E2;
    box-shadow: 0px 10px 20px #E2E2E2;
    box-sizing: border-box;
}

.login-page #loginContainer .page-header {
    margin-top: 0;
    font-size: 20px;
    color: #222363;
}

#loginSection label { color: #333333; }
.login-page .copyright { color: #b3b3b3; }

#loginSection > #loginContainer .form-item > input,
#loginSection > #loginContainer .form-item > select {
  border: 2px solid transparent;
  outline: none;
  -webkit-transition: .3s all ease-in-out;
  transition: .3s all ease-in-out;
}

#loginSection > #loginContainer .form-item > input:hover,
#loginSection > #loginContainer .form-item > select:hover,
#loginSection > #loginContainer .form-item > input:focus,
#loginSection > #loginContainer .form-item > select:focus {
  border: 2px solid #25aae1;
  outline: none;
}

#loginSection > #loginContainer .form-item > .validation-error {
  margin-top: 5px;
}
#loginSection > #loginContainer .form-item:last-child {
  text-align: center;
}

.login-button {
    padding: 8px 35px;
    background-color: #25aae1;
}
@media screen and (max-width: 480px) {
  .login-page > header > .header-center { padding: 0 10px; }
  .login-page > header .small-logo {
      width: 60px;
      background-size: 60px;
  }
  .login-page > header .header-2 { font-size: 16px; }
  .login-page #loginContainer {
    padding: 30px 25px;
  }
}

/* Navbar */
.ss-navbar-top {
    color: #B2B2B2;
    background-color: #F7F7F7;
  }
  .ss-product-title,
  .ss-product-title:hover {
    color: #B2B2B2;
  }
  .ss-navbar-top .sp-navbar-container .sp-nav-user-toolbar-list .ss-toolbar-icon-user .st0, .ss-navbar-top .sp-navbar-container .sp-nav-user-toolbar-list .ss-toolbar-icon-info .st0, .ss-navbar-top .sp-navbar-container .sp-nav-user-toolbar-list .ss-toolbar-icon-switch .st0,
  .sp-navbar .sp-navbar-container .sp-nav-user-toolbar-list .ss-toolbar-icon-switch svg .st0 {
    fill: #222363;
  }
  .ss-navbar-top .sp-navbar-container .sp-nav-user-toolbar-list li:hover,
  .ss-navbar-top .sp-navbar-container .sp-nav-user-toolbar-list li:active,
  .ss-navbar-top .sp-navbar-container .sp-nav-user-toolbar-list li:focus {
    border-color: #E6E6E6;
    outline: none;
    background-color: #E6E6E6;
  }
  .ss-navbar-top .sp-navbar-container .sp-nav-user-toolbar-list .open {
    background-color: #FFFFFF;
  }
  .sp-navbar .sp-navbar-container .sp-nav-user-toolbar-list a {
    color: #222363;
  }
  .sp-navbar .sp-navbar-container .sp-nav-user-toolbar-list a.logout {
    font-size: 17px;
    padding: 0 25px 0 20px;
  }
  .ss-navbar .ss-navbar-container {
    padding: 0 20px;
  }
  .ss-navbar .ss-navbar-container .ss-main-navbar > li > a:hover {
    color: #FFFFFF;
  }
  .ss-navbar-top .sp-navbar-container .sp-nav-user-toolbar-list .dropdown-menu .title-section {
    background-color: #222363;
  }
  .ss-navbar .ss-navbar-container {
    background-color: #222363;
  }
  
  /* Portal Navbar Mobile */
  .sp-navbar-header-mobile {
    color: #B2B2B2;
    background-color: #F2F2F2;
  }
  .navbar-toggle .icon-bar {
    background-color: #25aae1;
  }
  .sp-navbar-mobile-menu {
    right: 0;
    left: 0;
    background-color: #B2B2B2;
  }
  .sp-navbar-mobile-menu .nav li a {
    padding-left: 25px;
    padding-right: 25px;
  }
  .sp-mobile-product-title {
    font-size: 18px;
    line-height: 3;
    color: #B2B2B2;
  }
  .sp-mobile-product-title:hover {
    color: #B2B2B2;
  }
  .sp-navbar-mobile-menu .navbar-nav > li > a:hover, .sp-navbar-mobile-menu .navbar-nav > li > a:focus {
    background-color: #222363!important;
  }
  @media (max-width: 420px) {
      .sp-mobile-product-title {
          display: none;
      }
    .branding {
      margin-bottom: 10px;
    }
    .navbar .small-logo, .sp-navbar .small-logo {
      width: 5px;
    }
  }

  /* Portal nav tabs */
  .sp-view-ticket .ibm-sp-tab-navbar ul {
    border-color: #222363;
  }
  .ibm-sp-tab-navbar .nav.nav-tabs > li a {
    color: #222363;
  }
  .ibm-sp-tab-navbar .nav.nav-tabs > li.active {
    background-color: #222363;
  }
  .ibm-sp-query-link {
    display: block;
    float: none;
    padding: 5px 10px;
    color: #222363;
    background-color: #f9f9f9;
  }
  @media (max-width: 480px) {
    .ibm-sp-tab-navbar .nav.nav-tabs > li {
      width: 100%;
    }
  }
  .ibm-sp-tab-navbar ul {
    border-color: #222363;
  }
  
  /* Portal Widget Tickets Recentes */
  .ibm-sp-page-header > div {
    color: #222363;
    border-color: #222363;
  }
  .ibm-sp-ticket-circle {
    background-color: #f1f1f1;
  }
  ibm-sp-ticket-status .new:nth-child(1) {
    background-color: #bbbbbb;
  }
  ibm-sp-ticket-status .approvedLM:nth-child(1) {
    background-color: #f7f8f8;
  }
  ibm-sp-ticket-status .approvedLM:nth-child(2) {
    background-color: #bbbbbb;
  }
  ibm-sp-ticket-status .approvedFM:nth-child(1),
  ibm-sp-ticket-status :nth-child(2) {
    background-color: #f7f8f8;
  }
  ibm-sp-ticket-status .approvedFM:nth-child(3) {
    background-color: #bbbbbb;
  }
  ibm-sp-ticket-status .approved:nth-child(-n+3) {
    background-color: #f7f8f8;
  }
  ibm-sp-ticket-status .approved:nth-child(4) {
    background-color: #bbbbbb;
  }
  ibm-sp-ticket-status .queued:nth-child(-n+4) {
    background-color: #f7f8f8;
  }
  ibm-sp-ticket-status .queued:nth-child(5) {
    background-color: #bbbbbb;
  }
  ibm-sp-ticket-status .inprog:nth-child(-n+5) {
    background-color: #f7f8f8;
  }
  ibm-sp-ticket-status .inprog:nth-child(6) {
    background-color: #bbbbbb;
  }
  ibm-sp-ticket-status .pending:nth-child(-n+6) {
    background-color: #f7f8f8;
  }
  ibm-sp-ticket-status .pending:nth-child(7) {
    background-color: #bbbbbb;
  }
  ibm-sp-ticket-status .resolved:nth-child(-n+7) {
    background-color: #f7f8f8;
  }
  ibm-sp-ticket-status .resolved:nth-child(8) {
    background-color: #bbbbbb;
  }
  ibm-sp-ticket-status .closed:nth-child(-n+8) {
    background-color: #f7f8f8;
  }
  ibm-sp-ticket-status .closed:nth-child(9) {
    background-color: #bbbbbb;
  }
  .ibm-sp-home-row .status {
    display: block;
    margin: 0;
    color: #222363;
  }
  .ss-dashboard-page .my-recent-tickets-container ibm-sp-tickets-row .ibm-sp-home-row .title a {
    color: #333333;
    font-weight: bold;
  }
  
  /* Portal Launchers Home */
  .ibm-sp-launcher-link .launcher-title,
  .ibm-sp-launcher-link .launcher-subtitle,
  .ibm-sp-launcher-link .st0 {
    color: #4C4C4C;
    fill: #222363;
    -webkit-transition: .5s all ease-in-out;
    transition: .5s all ease-in-out;
  }
  .ibm-sp-launcher-link a:hover .launcher-title,
  .ibm-sp-launcher-link a:active .launcher-title,
  .ibm-sp-launcher-link a:focus .launcher-title,
  .ibm-sp-launcher-link a:hover .launcher-subtitle,
  .ibm-sp-launcher-link a:active .launcher-subtitle,
  .ibm-sp-launcher-link a:focus .launcher-subtitle,
  .ibm-sp-launcher-link a:hover .st0,
  .ibm-sp-launcher-link a:active .st0,
  .ibm-sp-launcher-link a:focus .st0 {
    color: #222363;
    fill: #222363;
  }
  .ibm-sp-launcher-link {
    padding: 0 10px!important;
    background-color: transparent;
  }
  .ibm-sp-launcher-link a {
    -webkit-box-shadow: 0px 15px 30px #f5f5f5;
    box-shadow: 0px 15px 30px #f5f5f5;
    background-color: #f9f9f9;
  }
  @media (max-width: 992px) {
    .ibm-sp-launcher-link {
      margin-bottom: 30px;
    }
  }
  @media (max-width: 600px) {
    .ss-dashboard-page .ibm-sp-launcher-link {
      width: 100%;
    }
  }
  @media (min-width: 768px) and (max-width: 992px) {
      .ibm-sp-launcher-link {
          width: 100%!important;
      margin-bottom: 10px;
      }
  }
  @media (min-width: 992px) {
      .ibm-sp-launcher-link {
          width: 33.33%!important;
      }
  }
  
  /* Portal Chat fixed icon */
  .ibm-sp-follow-me .ibm-sp-follow-me-icon {
    display: none;
    visibility: hidden;
    background-color: #bbbbbb;
  }

  /* Portal Virtual Assistant */
  .sp-va-container .sp-va-summary p {
    color: #25aae1;
  }
  .sp-va-container .sp-va-details .link-container li, .sp-va-container .sp-va-details .link-container a {
    color: #25aae1;
  }
  .sp-va-container .sp-va-details .solution-container a, .sp-va-container .sp-va-details .template-container a {
    color: #222363;
  }
  .sp-va-container {
    margin-top: 15px;
  }
  .sp-va-container .sp-va-summary {
    border-color: #25aae1;
  }
  .ibm-sp-is-required .ibm-sp-widget-label:before {
    color: #25aae1;
  }
  
  /* Portal Page Problem  */
  #selfserv-report-issue-form h1 {
    font-size: 1.5em;
    color: #222363;
  }
  .ibm-sp-section .ibm-sp-section-header > label {
    color: #4C4C4C;
  }
  .ibm-sp-section .ibm-sp-section-icon {
    border-color: #222363;
  }
  .ibm-sp-section .ibm-sp-section-header {
    border-color: #222363;
  }
  .ibm-sp-widget-label {
    color: #333333;
  }
  ibm-sp-section + .ibm-sp-button-bar, .ibm-sp-layout-item + .ibm-sp-button-bar {
    margin: 25px 0;
  }
  
  /* Portal Page My Tickets */
  .ss-reporter-tickets .sp-table-title {
    color: #222363;
    font-size: 1.5em;
  }
  .ss-reporter-tickets .sp-table .sp-table-header {
    color: #4C4C4C;
  }
  .ss-reporter-tickets .sp-table .ngHeaderContainer {
    border-color: #222363;
  }
  .ss-reporter-tickets .sp-table .sp-table-text {
    color: #333333;
  }
  .ss-reporter-tickets .sp-table .sp-table-text a {
    color: #4C4C4C;
  }
  .ss-reporter-tickets .sp-table .sp-table-text.col2.colt2 {
    color: #222363;
  }
  
  /* Portal Page Ticket */
  .cdui-viewissue-header-container h1 {
    width: 100%;
    margin-bottom: 15px;
    float: none;
    color: #222363;
    font-size: 1.5em;
  }
  @media (max-width: 480px) {
    .cdui-viewissue-header-container h1 {
      font-size: 16px;
    }
  }
  .sp-table-nav .sp-table-button {
    color: #222363;
  }
  .ss-view .cdui-viewissue-header-details .incident-status .ibm-sp-static-text-input {
      color: #25aae1!important;
  }
  
  /* Portal Page Requests */
  .ss-catalog-header {
    font-size: 1.5em;
    color: #222363;
    text-align: center;
  }
  .ss-filter-link {
    color: #222363;
  }
  .ss-catalogentry-title {
    color: #222363;
  }
  .ss-category-container, .ss-offering-container {
    border-color: #f7f8f8;
    -webkit-box-shadow: 0px 5px 15px #f5f5f5;
    box-shadow: 0px 5px 15px #f5f5f5;
    -webkit-transition: .3s all ease-in-out;
    transition: .3s all ease-in-out;
  }
  .ss-category-container:hover, .ss-offering-container:hover {
    border-color: #bbbbbb!important;
    box-shadow: 0px 5px 15px #f7f8f8;
  }
  .cdui-breadcrumbs-list {
    width: 100%;
    text-align: center;
  }
  .ss-empty-catalog-message {
    text-align: center;
  }
  .ss-offering-side-column {
    border-color: #222363;
    min-height: 100%;
    padding: 70px 0;
  }
  .ibm-sp-tab-navbar .ibm-sp-navtab-icon .st0 {
    fill: #222363;
  }
  cdui-add-review-pane cdui-nav .sp-table-nav-container {
    background-color: #f7f8f8;
  }
  .ibm-sp-select-from-table-dialog .btn.btn-primary, .ibm-sp-select-from-table-dialog .ngHeaderButton, .ibm-sp-select-from-table-dialog .ngPagerButton {
    background-color: #222363 !important;
  }
  .modal-backdrop.in {
    background-color: #222363;
  }
  .cdui-add-attachment-link a {
    display: inline-block;
    padding: 5px 20px;
    margin-top: 5px;
    color: #f1f1f1;
    background-color: #bbbbbb;
  }
  @media (max-width: 768px) {
    .ss-catalog-search-bar {
      max-width: 100%;
    }
    .ss-catalog-container {
      padding: 0 10px;
    }
    .ss-catalog-container .catalog-list {
      padding: 0;
    }
    .ss-catalog-search-header  {
      margin: 0 10px;
    }
    .ss-offering-title {
      height: 100%;
      font-size: 18px;
    }
    .ss-offering-image {
      max-width: 64px;
      max-height: 64px;
      width: 100%;
      height: auto;
    }
    .ibm-sp-tab-navbar .nav.nav-tabs > li {
      padding: 5px;
    }
    .ss-offering-side-column {
      min-height: 260px;
    }
    .ss-offering-center-column {
      padding-left: 10px;
      padding-right: 10px;
    }
    .cdui-new-attachments-container .cdui-new-attachment-container, .cdui-attachments-container .cdui-new-attachment-container {
      padding: 5px 10px;
      margin: 5px 0;
    }
    .ibm-sp-select-from-table-dialog .btn.btn-primary, .ibm-sp-select-from-table-dialog .ngHeaderButton, .ibm-sp-select-from-table-dialog .ngPagerButton {
      width: auto;
    }
    .modal-dialog {
      max-width: 720px!important;
      width: 95%!important;
    }
    .modal-body {
      font-size: 12px;
      overflow-y: scroll!important;
      clear: both;
    }
    .modal-body img,
    #solution img {
      max-width: 100%!important;
      width: 100%!important;
      height: auto!important;
    }
    .ss-catalogentry-description-full {
      width: 100%;
      padding: 15px;
    }
  }
  @media (max-width: 480px) {
    .ss-catalogentry-title {
      font-size: 14px;
    }
    .ss-catalogentry-description > p {
      font-size: 12px;
    }
    .ss-catalogentry-description,
    .ss-catalogentry-image-container {
      display: block;
      width: 100%;
      float: none;
      text-align: center;
    }
    .ss-catalogentry-image {
      max-width: 50px;
      max-height: 50px;
      width: 100%;
      height: auto;
    }
    .offering-page-body {
      padding: 0 10px;
    }
    .ss-offering-title,
    .ss-offering-last-update {
      margin: 0;
      text-align: center;
    }
    .cdui-add-attachment-link {
      text-align: center;
    }
    .cdui-new-attachments-container .cdui-new-attachment-container cdui-input, .cdui-attachments-container .cdui-new-attachment-container cdui-input {
      width: 100%;
      float: none;
    }
    .cdui-new-attachments-container .cdui-new-attachment-container .addnew-icon, .cdui-attachments-container .cdui-new-attachment-container .addnew-icon {
      margin-left: 0;
      margin-right: 5px;
    }
    .cdui-new-attachments-container .cdui-new-attachment-container .addnew-label, .cdui-attachments-container .cdui-new-attachment-container .addnew-label {
      font-size: 13px;
    }
  }
  
  /* Portal Search results */
  .ss-search-page .ss-result-info,
  .ss-search-page .ss-dashboard-list-title,
  .ss-search-page .ss-dashboard-list-title {
    font-size: 1.5em;
    color: #222363;
    border-color: #222363;
  }
  .ss-search-page .ss-dashboard-list-title .ss-dashboard-list-item-count {
    color: #4C4C4C;
  }
  @media (max-width: 992px) {
    .ss-search-page .ss-search-filters {
      margin-top: 0;
      width: 100%;
      right: auto;
      float: none;
    }
  }
  @media (max-width: 480px) {
    .ss-search-page .ss-result-info {
      font-size: 16px;
    }
    .page-margin {
      margin: 0 10px;
    }
    .ss-search-page .ss-search-no-items-found {
      margin: 0;
    }
    .ss-search-page .ss-dashboard-list-title {
      margin: 15px 0 0;
    }
    .ss-dashboard-list-items .ss-dashboard-list-item {
      margin: 0;
    }
  }
  
  /* Portal Bar Status on Ticket Page */
  .bar-status {
    padding: 15px 0;
  }
  .bar-status > .bar-status-nav {
    display: block;
    align-items: center;
    padding: 0;
    margin: 0;
    transition: .5s all ease-in-out;
  }
  
  .bar-status > .bar-status-nav > .bar-status-nav-tag {
    position: relative;
    display: inline-block;
    padding: 5px 10px;
    margin: 0 0 4px;
    font-size: 14px;
    font-weight: 500;
    color: #4C4C4C;
    list-style: none;
    text-align: center;
    background-color: #f7f8f8;
  }
  @media (max-width: 768px) {
    .bar-status {
      display: none;
    }
  }
  .bar-status > .bar-status-nav > .bar-status-nav-tag:nth-of-type(odd) {
    background-color: #F2F2F2;
  }
  .bar-status > .bar-status-nav > .bar-status-nav-tag.active {
    color: #FFF;
    overflow: visible;
    background-color: #25aae1;
  }
  
  
  /* Portal Ajustes Gerais Mobile */
  @media (max-width: 480px) {
    .sp-view-ticket {
      margin: 0 10px;
    }
    .ss-dashboard-page,
    .ss-page-margin {
      margin: 0 10px;
    }
    .ibm-sp-follow-me {
      display: none;
      visibility: hidden;
    }
    .ibm-sp-search-bar .sp-search-bar-input-group .sp-search-bar-input {
      font-size: 12px;
    }
    .ss-reporter-tickets .sp-table-title > span,
    #selfserv-report-issue-form h1,
    .ss-catalog-header {
      font-size: 16px;
      margin-right: 0;
      margin-left: 0;
    }
    .ibm-sp-section .ibm-sp-section-header > label {
      font-size: 15px;
    }
    .ibm-sp-widget-label {
      font-size: 14px;
    }
  
  }

/* PAGE SOLUTION */
#solution {
  padding: 0 15px;
}
#solution .cdui-stars {
  width: 100%;
}
#solution .ss-solution-description {
  color: #4c4c4c;
}
#solution .describtion-sub-section h2 {
  color: #b2b2b2;
}
#solution .ss-solution-bookmark {
  color: #25aae1;
}
.ibm-sp-bookmark-icon .st0 {
  fill: #25aae1;
}
.ibm-sp-home-row .solution {
  color: #222363;
}

/* Pop-up SOLUTION */
#solutionModal .modal-content {
  margin-top: 20px;
  margin-bottom: 20px;
}
#solutionModal .modal-content .solution-header .solution-title {
  font-size: 1.5em;
  color: #222363;
}
#solutionModal .modal-content .solution-link-container a.active,
#solutionModal .modal-content .solution-link-container {
  border-color: #4c4c4c;
}
#solutionModal .modal-content .solution-link-container li, #solutionModal .modal-content .solution-link-container a {
  color: #4c4c4c;
}
#solutionModal .modal-content .solution-header .bookmark {
  color: #25aae1;
}
#feedbackModal .feedback-modal-content .modal-header {
  background-color: #4c4c4c;
}
#feedbackModal .feedback-modal-content .modal-header .feedback-header-icon {
  background-color: #222363;
}
#solutionModal .modal-content {
  width: 100%;
}
@media (min-width: 992px) {
  #solutionModal .modal-content {
    width: 70%;
    padding: 2em;
  }
  #feedbackModal .feedback-modal-content {
    width: 600px;
    max-width: 100%;
    padding: 0;
  }
}