/* mixins */
/*
hero fadeIn
*/
@-webkit-keyframes heroFadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes heroFadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

/* 
menu: secondary sidebar style 
*/
/* 
icons: video play icon
*/
/*
css transitions
*/
/* 
easings 
*/
/* 
colors: nsi palette 
*/
/* 
colors: form validation 
*/
/* 
font: frutiger  
*/
/* 
font: nsi face  
*/
/* 
font: nsi face  
*/
.monochrome {
  /* wrap everything in class */
  /* images */
  /* base */
  /* header */
  /* hero */
  /* menu */
  /* main content */
  /* home */
  /* promos */
  /* message banner */
  /* left nav */
  /* prize checker */
  /* footer */
  /* help */
  /* focus styles */
  /* transactional specific */
  /*
    component: bi-option switch
    */
  /*
    component: resources-list
    */
  /*
    page: contact
    */ }
  .monochrome img,
  .monochrome video,
  .monochrome .promotion,
  .monochrome .section-fullbackground,
  .monochrome .promo--inline-image-spread,
  .monochrome .addthis_toolbox {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%); }
  .monochrome h1,
  .monochrome h2,
  .monochrome h3,
  .monochrome h4,
  .monochrome h5,
  .monochrome h6,
  .monochrome p,
  .monochrome ul,
  .monochrome em,
  .monochrome .cookie-message strong,
  .monochrome .holder-number {
    color: #000; }
  .monochrome input:focus,
  .monochrome select:focus,
  .monochrome textarea:focus {
    outline: 2px dotted #000; }
  .monochrome input,
  .monochrome select,
  .monochrome .field-valid input,
  .monochrome .field-valid select,
  .monochrome .field-valid textarea {
    border-color: #000 !important;
    color: #000 !important; }
  .monochrome .error,
  .monochrome .field-valid:after,
  .monochrome .field-error:after {
    color: #000 !important; }
  .monochrome input[type="checkbox"] + label:before,
  .monochrome input[type="radio"] + label:before {
    border-color: #000 !important; }
  .monochrome input[type="radio"]:checked + label:before {
    background-position: 0 -18px; }
  .monochrome input[type="checkbox"]:checked + label:before {
    background-position: -18px -18px; }
  .monochrome .logo {
    background-color: #000 !important;
    background-image: url(../img/nsi-logo-monochrome.png);
    background-repeat: no-repeat;
    background-position: 0 10px;
    margin-top: 3px;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover; }
    .monochrome .logo img {
      display: none; }
  .monochrome .hero.hero--static {
    background: #000;
    border-bottom: 10px solid #ededed; }
  .monochrome .hero .hero-content h1,
  .monochrome .hero .hero-content p,
  .monochrome .hero .hero-content em,
  .monochrome .hero .hero-content .value,
  .monochrome .hero .hero-content .value-small,
  .monochrome .hero .hero-content .header--bold {
    color: #fff !important; }
  .monochrome .hero .hero-product-name strong {
    background: #fff;
    color: #000; }
  .monochrome.theme--inverse .hero .slides, .monochrome.theme--inverse .hero.hero--static {
    background: #fff; }
  .monochrome.theme--inverse .hero .hero-content:not(.hero--static-image-content) h1,
  .monochrome.theme--inverse .hero .hero-content:not(.hero--static-image-content) p,
  .monochrome.theme--inverse .hero .hero-content:not(.hero--static-image-content) .value,
  .monochrome.theme--inverse .hero .hero-content:not(.hero--static-image-content) .value-small,
  .monochrome.theme--inverse .hero .hero-content:not(.hero--static-image-content) .header--bold {
    color: #000 !important; }
  .monochrome.theme--inverse .hero .hero-product-name strong {
    background: #000;
    color: #fff; }
  .monochrome .slider-hero .slides {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -o-transition: none !important;
    transition: none !important; }
  .monochrome .navigation--primary,
  .monochrome .menu--primary {
    background: #000; }
  .monochrome .menu--primary .menu-item a {
    color: #fff; }
    .monochrome .menu--primary .menu-item a:first-child:before {
      color: #fff !important; }
    .monochrome .menu--primary .menu-item a:after {
      background: #fff; }
  .monochrome .menu--primary .active a,
  .monochrome .menu--primary a:hover {
    background: #000;
    border-color: #fff; }
  .monochrome .menu-toggle,
  .monochrome .top-navigation-link {
    color: #fff; }
    .monochrome .menu-toggle:hover,
    .monochrome .top-navigation-link:hover {
      color: #fff; }
  .monochrome.page-login .menu-toggle,
  .monochrome.page-login .top-navigation-link {
    color: #000; }
    .monochrome.page-login .menu-toggle:hover,
    .monochrome.page-login .top-navigation-link:hover {
      color: #000; }
    .monochrome.page-login .menu-toggle:focus,
    .monochrome.page-login .top-navigation-link:focus {
      background-color: inherit; }
  .monochrome .color-overlay {
    display: none; }
  .monochrome .section-highlight,
  .monochrome .product--summary-container {
    background: #fff; }
    .monochrome .section-highlight td,
    .monochrome .product--summary-container td {
      border-color: #000;
      color: #000; }
  .monochrome .main a {
    color: #000; }
  .monochrome .main a[class*="btn--"],
  .monochrome .main .module--download .btn {
    background: #000 !important;
    color: #fff !important; }
    .monochrome .main a[class*="btn--"]:hover,
    .monochrome .main .module--download .btn:hover {
      background: #ededed;
      color: #000; }
  .monochrome .main .btn {
    background: #ededed;
    color: #000;
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -o-transition: none !important;
    transition: none !important; }
    .monochrome .main .btn:hover {
      background: #000;
      color: #fff !important; }
  .monochrome .main .module--download .btn:hover {
    background: #fff; }
  .monochrome .panel--hero {
    background: #fff;
    color: #000; }
    .monochrome .panel--hero h1,
    .monochrome .panel--hero p {
      color: inherit; }
  .monochrome .cta-product h3,
  .monochrome .cta-product p {
    color: #fff; }
  .monochrome .cta-product .btn {
    background: #fff;
    color: #000; }
  .monochrome [class*="cta--"] {
    background: #000;
    border-color: #000;
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -o-transition: none !important;
    transition: none !important; }
    .monochrome [class*="cta--"] > th:hover {
      background: #ededed;
      color: #000; }
      .monochrome [class*="cta--"] > th:hover .btn {
        background: #000;
        color: #fff; }
    .monochrome [class*="cta--"] h4 {
      color: #fff; }
  .monochrome .cta-product:hover {
    background: #ededed;
    border-color: transparent;
    color: #000; }
    .monochrome .cta-product:hover h3,
    .monochrome .cta-product:hover p {
      color: #000 !important; }
    .monochrome .cta-product:hover .btn {
      background: #000;
      color: #fff; }
  .monochrome .table--products td {
    border: 1px solid #dfdfdf;
    border-right-width: 0; }
    .monochrome .table--products td:last-child {
      border-right-width: 1px; }
  .monochrome .table--products .btn {
    background: #fff;
    color: #000; }
  .monochrome .product-info-highlight {
    border-color: #000; }
    .monochrome .product-info-highlight li {
      border-color: inherit; }
    .monochrome .product-info-highlight em {
      color: #000; }
  .monochrome .list-suitable li:before,
  .monochrome .list-not-suitable li:before {
    background-color: #000 !important; }
  .monochrome .menu-tabs-dropdown {
    background: #000; }
  .monochrome .promotion-content,
  .monochrome .promotion .promotion-content {
    background: #000 !important;
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -o-transition: none !important;
    transition: none !important; }
    .monochrome .promotion-content:hover,
    .monochrome .promotion .promotion-content:hover {
      background: #000 !important;
      background-color: #000 !important; }
    .monochrome .promotion-content h2,
    .monochrome .promotion-content p,
    .monochrome .promotion-content a,
    .monochrome .promotion-content span,
    .monochrome .promotion .promotion-content h2,
    .monochrome .promotion .promotion-content p,
    .monochrome .promotion .promotion-content a,
    .monochrome .promotion .promotion-content span {
      color: #fff; }
    .monochrome .promotion-content .btn,
    .monochrome .promotion .promotion-content .btn {
      background: #fff;
      color: #000; }
      .monochrome .promotion-content .btn:hover,
      .monochrome .promotion .promotion-content .btn:hover {
        text-decoration: underline; }
  .monochrome .message {
    background: #000; }
    .monochrome .message p,
    .monochrome .message a {
      color: #fff; }
  .monochrome .menu--secondary > li > a {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -o-transition: none !important;
    transition: none !important; }
    .monochrome .menu--secondary > li > a.active, .monochrome .menu--secondary > li > a:hover {
      background: #000; }
  .monochrome .module--prize-info {
    border-color: #000; }
  .monochrome .module--prize-info.last .module--prize-info-inner {
    background: #000; }
    .monochrome .module--prize-info.last .module--prize-info-inner h4,
    .monochrome .module--prize-info.last .module--prize-info-inner li {
      color: #fff; }
  .monochrome #table-prizewinner_wrapper a {
    color: #000; }
  .monochrome #table-prizewinner_wrapper th:after {
    color: #000; }
  .monochrome .prize-value {
    color: #000; }
  .monochrome .footer {
    background: #000;
    border: 0 !important;
    color: #fff; }
    .monochrome .footer h4,
    .monochrome .footer p,
    .monochrome .footer a {
      color: #fff; }
  .monochrome .menu--accessibility a {
    color: #000; }
  .monochrome .menu-contact li {
    background: #000; }
    .monochrome .menu-contact li a {
      color: #000; }
  .monochrome .menu--help-dropdown {
    background-color: #000; }
  .monochrome .navigation--help,
  .monochrome .cta-help {
    border: 0; }
  .monochrome .form-help .btn {
    background-color: #fff;
    color: #000 !important; }
    .monochrome .form-help .btn:hover {
      background-color: #ededed; }
  .monochrome .cta-help {
    background-color: #ededed; }
    .monochrome .cta-help h3 {
      color: #000; }
    .monochrome .cta-help .btn {
      background-color: #000;
      color: #fff !important; }
    .monochrome .cta-help:hover {
      background-color: #000; }
      .monochrome .cta-help:hover h3 {
        color: #fff; }
      .monochrome .cta-help:hover .btn {
        background-color: #fff;
        color: #000; }
  .monochrome .menu--secondary :before {
    color: #000; }
  .monochrome .menu--secondary .has-subnav:hover {
    background: #000;
    color: #fff; }
  .monochrome .menu--secondary .menu-sub a:hover {
    color: #000;
    text-decoration: underline; }
  .monochrome .menu--secondary .active .has-subnav {
    background: #000;
    color: #fff; }
  .monochrome .menu--primary .menu-item a:focus,
  .monochrome .footer a:focus,
  .monochrome .hero a:focus {
    background-color: #fff;
    color: #000 !important;
    outline: 2px solid #fff; }
    .monochrome .menu--primary .menu-item a:focus:before,
    .monochrome .footer a:focus:before,
    .monochrome .hero a:focus:before {
      color: #000 !important; }
  .monochrome .hero .block-link:focus {
    background: transparent;
    border-color: #fff; }
  .monochrome .main .btn:focus {
    color: #000;
    outline-style: dotted; }
  .monochrome .main [class*="btn--"]:focus {
    background-color: #ededed;
    color: #000; }
  .monochrome .main .block-link:focus {
    background-color: transparent;
    border-color: #fff;
    outline: 0; }
  .monochrome a:focus,
  .monochrome .menu-contact a:focus {
    background-color: #000;
    color: #fff !important;
    outline: 2px solid #000; }
  .monochrome .message a:focus {
    background-color: #fff;
    color: #000 !important;
    outline-color: #fff; }
  .monochrome .header--accordian a:focus:hover {
    color: #fff; }
  .monochrome .section--help {
    background-color: #000; }
    .monochrome .section--help .help-header * {
      color: #fff; }
    .monochrome .section--help .help-toggle {
      background-color: #fff;
      border-style: solid;
      border-color: #000;
      border-width: 1px 0 1px 1px;
      color: #000; }
    .monochrome .section--help .help-content,
    .monochrome .section--help .help-content-related,
    .monochrome .section--help .menu-sub--help {
      background-color: #000; }
      .monochrome .section--help .help-content *,
      .monochrome .section--help .help-content-related *,
      .monochrome .section--help .menu-sub--help * {
        color: #fff; }
  .monochrome .main a.btn--back {
    background-color: transparent; }
  .monochrome .list--options label:after,
  .monochrome .field--transparent label:after {
    color: #000 !important; }
  .monochrome .navigation--primary.active {
    background: #000; }
  .monochrome .notification {
    background: #000; }
    .monochrome .notification *,
    .monochrome .notification a {
      color: #fff; }
    .monochrome .notification .icon:before {
      background: #fff;
      color: #000; }
  .monochrome .message--unread td {
    background: #000; }
    .monochrome .message--unread td:before {
      background: #000; }
  .monochrome .message--read td {
    background: #fff;
    color: #000; }
    .monochrome .message--read td:before {
      background: inherit;
      color: inherit; }
  .monochrome .info-panel--error {
    border-color: #000; }
    .monochrome .info-panel--error:before {
      background: #000; }
  .monochrome .menu-contact {
    background: #fff; }
    .monochrome .menu-contact .contact--inverse span {
      background: #000; }
      .monochrome .menu-contact .contact--inverse span a {
        color: #fff; }
  .monochrome .form-steps li:before {
    border-left-color: #000; }
  .monochrome .form-steps .complete {
    background: #000;
    color: #fff; }
    .monochrome .form-steps .complete:after {
      border-left-color: #000; }
  .monochrome .form-steps .active {
    background: #fff;
    color: #000; }
    .monochrome .form-steps .active:after {
      border-left-color: #fff; }
  .monochrome .calculator-container {
    border: 1px solid #d9d9d9; }
    .monochrome .calculator-container td {
      color: #000 !important; }
  .monochrome .hero-product-name strong,
  .monochrome .password-strength-bar span {
    background: #000; }
  .monochrome .field--decision.selected {
    background: #fff; }
  .monochrome .account-tile,
  .monochrome .account-select,
  .monochrome .key-number {
    border-color: #000; }
  .monochrome .value,
  .monochrome .value-small,
  .monochrome .key-number-value,
  .monochrome .field--decision h3,
  .monochrome .next-steps .step,
  .monochrome .list--options:after,
  .monochrome .field--transparent:after,
  .monochrome .value-positive:before,
  .monochrome .value-negative:before,
  .monochrome .tooltip,
  .monochrome .btn--multiple:after {
    color: #000 !important; }
  .monochrome .label-account em,
  .monochrome .btn--multiple a {
    color: #fff !important; }
  .monochrome .panel--landing-info .dark-container {
    background: #000 !important; }
    .monochrome .panel--landing-info .dark-container p, .monochrome .panel--landing-info .dark-container h3 {
      color: #fff !important; }
    .monochrome .panel--landing-info .dark-container .btn:not(.btn--tab) {
      color: #000 !important;
      background: #fff !important; }
    .monochrome .panel--landing-info .dark-container .btn--tab {
      border: 0px solid #fff !important; }
      .monochrome .panel--landing-info .dark-container .btn--tab.active {
        color: #000 !important;
        background: #fff !important; }
  .monochrome .hero--caption,
  .monochrome .side-caption,
  .monochrome .form-info,
  .monochrome .info-card {
    color: #fff !important;
    background: #000 !important; }
    .monochrome .hero--caption h1, .monochrome .hero--caption h2, .monochrome .hero--caption h3, .monochrome .hero--caption h4, .monochrome .hero--caption h5, .monochrome .hero--caption h6, .monochrome .hero--caption p,
    .monochrome .side-caption h1,
    .monochrome .side-caption h2,
    .monochrome .side-caption h3,
    .monochrome .side-caption h4,
    .monochrome .side-caption h5,
    .monochrome .side-caption h6,
    .monochrome .side-caption p,
    .monochrome .form-info h1,
    .monochrome .form-info h2,
    .monochrome .form-info h3,
    .monochrome .form-info h4,
    .monochrome .form-info h5,
    .monochrome .form-info h6,
    .monochrome .form-info p,
    .monochrome .info-card h1,
    .monochrome .info-card h2,
    .monochrome .info-card h3,
    .monochrome .info-card h4,
    .monochrome .info-card h5,
    .monochrome .info-card h6,
    .monochrome .info-card p {
      color: #fff !important; }
  .monochrome .resource-list .sub-info {
    color: #000 !important; }
  .monochrome .site-bar .bar {
    background: #000 !important; }
  .monochrome .product-table h5, .monochrome .product-table h6 {
    color: #fff !important; }
  .monochrome .menu-toggle,
  .monochrome .top-navigation-link {
    background: #000 !important; }
  .monochrome .view-selector {
    border: 1px solid black; }
    .monochrome .view-selector .selector {
      background-color: black !important; }
      .monochrome .view-selector .selector p {
        color: white !important; }
      .monochrome .view-selector .selector:hover {
        background-color: black !important; }
      .monochrome .view-selector .selector.selected {
        background-color: white !important; }
        .monochrome .view-selector .selector.selected p {
          color: black !important; }
        .monochrome .view-selector .selector.selected:hover {
          background-color: white !important; }
  .monochrome .list--products-item .list--products-item-info-list {
    border: 1px solid #000; }
  .monochrome .list--products-item em {
    color: black !important; }
  .monochrome .list--products-item .cta-product .list--products-item-description, .monochrome .list--products-item .cta-product td, .monochrome .list--products-item .cta-product td h5, .monochrome .list--products-item .cta-product td h6, .monochrome .list--products-item .cta-product td p {
    color: white; }
  .monochrome .list--products-item .cta-product:hover .slides td, .monochrome .list--products-item .cta-product:hover .slides td h6, .monochrome .list--products-item .cta-product:hover .slides td h5, .monochrome .list--products-item .cta-product:hover .list--products-item-description, .monochrome .list--products-item .cta-product:hover td, .monochrome .list--products-item .cta-product:hover td h5, .monochrome .list--products-item .cta-product:hover td h6, .monochrome .list--products-item .cta-product:hover td p {
    color: black !important; }
  .monochrome .bg-img-mono-fallback {
    display: block !important; }
  .monochrome .bottom-bordered {
    border-color: #000; }
  .monochrome .promotion--quotes p, .monochrome .promotion--quotes h3, .monochrome .promotion--quotes h6, .monochrome .promotion--quotes em {
    color: #fff; }
  .monochrome .bi-option-switch .option-switch {
    border: 1px solid #fff !important;
    background-color: #000 !important; }
    .monochrome .bi-option-switch .option-switch p, .monochrome .bi-option-switch .option-switch i, .monochrome .bi-option-switch .option-switch span {
      color: #fff !important; }
  .monochrome .bi-option-switch .option-switch.selected {
    border: 1px solid #000 !important;
    background-color: #fff !important; }
    .monochrome .bi-option-switch .option-switch.selected p, .monochrome .bi-option-switch .option-switch.selected i, .monochrome .bi-option-switch .option-switch.selected span {
      color: #000 !important; }
  .monochrome .resource-list li:before {
    background-color: transparent !important;
    background-image: url("../img/icons/icon-resource.png") !important; }
  .monochrome .resource-list li .sub-info {
    color: #000; }
  .monochrome .tab-filters a.active {
    background-color: #000 !important; }
  .monochrome .resource-list li a:focus p {
    color: #fff !important; }
  .monochrome .list--help__contact p, .monochrome .list--help__contact h4 {
    color: #000; }
  .monochrome .list--help__contact li:hover i:before {
    color: #000; }
  .monochrome .list--help__contact .btn-with-icon:hover {
    color: #000 !important; }
  .monochrome .hero--static .info-panel p {
    color: #000 !important; }
  .monochrome .social-nav li {
    background-color: #000 !important;
    border: 1px solid #fff !important; }
  .monochrome .search-overlay {
    background-color: #000 !important; }
  .monochrome .promo-bg {
    background-color: #000 !important;
    color: #fff !important; }
    .monochrome .promo-bg h2, .monochrome .promo-bg p, .monochrome .promo-bg li, .monochrome .promo-bg h5, .monochrome .promo-bg h1, .monochrome .promo-bg h3, .monochrome .promo-bg h4, .monochrome .promo-bg .product-rate-labels div {
      color: #fff !important; }
  .monochrome .product-container .header--accordian a {
    background-color: #fff !important;
    color: #000 !important; }
    .monochrome .product-container .header--accordian a:hover {
      background-color: #000 !important;
      color: #fff !important; }
  .monochrome .bar p {
    color: #000 !important; }
  .monochrome .site-bar .bar {
    background-color: #fff !important; }
  .monochrome .why-top-panel ul {
    background-color: #ededed !important; }
  .monochrome .image-25 {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%); }
  .monochrome .why-top-panel ul .quote-25 {
    background-color: #000000 !important; }
    .monochrome .why-top-panel ul .quote-25 h2 {
      color: #ffffff !important; }
  .monochrome .info-card-border {
    border: 1px solid #000 !important;
    background-color: #ffffff; }
    .monochrome .info-card-border h4, .monochrome .info-card-border h2 {
      color: #000 !important; }
    .monochrome .info-card-border:hover {
      background-color: #000 !important; }
      .monochrome .info-card-border:hover h4, .monochrome .info-card-border:hover h2 {
        color: #fff !important; }
  .monochrome.page-product .product-container .cta-product:hover span.btn.btn--deepyellow {
    color: white !important; }
  .monochrome .cta--yellow.cta-help:hover h4, .monochrome .cta--yellow.cta-help:hover h3, .monochrome .cta--yellow.cta-help:hover p, .monochrome .cta--yellow.cta-help:hover a {
    color: white !important; }
  .monochrome .cta-help:hover a:hover,
  .monochrome .cta-help:hover .underline-link:hover {
    color: white !important; }
  .monochrome .yellow-background {
    background-color: #ededed !important; }
  .monochrome .product-rate, .monochrome .product-rate-50, .monochrome .product-rate-501 {
    color: #000 !important; }
  .monochrome .hist-panel .front, .monochrome .hist-panel .back,
  .monochrome .marker .check {
    background-color: #000 !important; }
  .monochrome .hist-panel h4, .monochrome .hist-panel p, .monochrome .hist-panel li {
    color: #fff !important; }
  .monochrome .search-overlay.is-active input {
    border: 1px solid #000 !important; }
  .monochrome .search-overlay-content .input--large {
    background: #fff; }
  .monochrome .modal-dialog {
    background: #ededed; }
  .monochrome .modal-header {
    background: #000;
    color: #fff; }
    .monochrome .modal-header h4 {
      color: #fff; }
  .monochrome .modal-body p {
    color: #000; }
  .monochrome .modal-body .btn {
    background: #000;
    color: #fff; }

/* end wrapper class */
