/*!
Theme Name: lucio
Theme URI: http://underscores.me/
Author: Jamie Pickett
Author URI: https://developer.ibm.com
Description: Base theme for IBM Code.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: lucio
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

lucio is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/* ------------------------------------
 Helper functions
------------------------------------ */
/* ------------------------------------
 Colors
------------------------------------ */
/* ------------------------------------
 Scaffolding
------------------------------------ */
/* ------------------------------------
 Left Navigation
------------------------------------ */
/* ------------------------------------
 Right Navigation
------------------------------------ */
/* ------------------------------------
 Single Content Header Section
------------------------------------ */
/* overwrite values for patterns.  Its the blacksheep of post types */
.code_p_announcement {
  background: #000000;
  padding: 2vw 0; }
  .code_p_announcement p {
    color: #4ca7a5;
    text-align: center;
    font-size: .9375rem;
    font-weight: 400; }
    .code_p_announcement p a.bx--btn.bx--btn--secondary {
      margin-left: 20px;
      border-color: #4ca7a5;
      color: #4ca7a5; }
      .code_p_announcement p a.bx--btn.bx--btn--secondary:hover {
        border-color: #4ca7a5;
        background: #4ca7a5;
        color: #fff; }

/* search fome in the header */
.bx--cloud-header .code_search__form {
  display: flex;
  height: 30px; }
  .bx--cloud-header .code_search__form label {
    display: none !important; }
  .bx--cloud-header .code_search__form input {
    background: none;
    border: none;
    border-bottom: 1px solid #a1a1a1;
    display: inline-block;
    color: #a1a1a1;
    padding: 3px 5px;
    font-size: .875rem; }
    .bx--cloud-header .code_search__form input::placeholder {
      color: #a1a1a1; }
  .bx--cloud-header .code_search__form button {
    width: 40px; }
    .bx--cloud-header .code_search__form button svg {
      fill: #a1a1a1 !important; }

/*--------------------------------------------------------------
# Carbon Header
# We should be writing the css for mobile first
--------------------------------------------------------------*/
.site-navigation {
  background-color: #3f3f3f; }
  .site-navigation.toggled {
    height: auto; }
    .site-navigation.toggled .site-navigation__wrap {
      display: block; }
    .site-navigation.toggled .menu-toggle span:before {
      content: "\f335"; }
    .site-navigation.toggled #primary-menu {
      display: block; }

/* this is more of a global style that needs to get moved to scaffolding */
#site-navigation .code_content__wrap,
#code-footer .code_content__wrap,
#dw-footer .code_content__wrap {
  margin: 0 auto;
  padding: 0 3.5vw;
  max-width: 1500px; }

#site-footer .code_content__wrap {
  margin: 0 auto;
  padding: 0 3.5vw;
  max-width: 1500px; }

x-#site-content.code_content__wrap {
  margin: 0 auto;
  padding: 0 3.5vw;
  max-width: 1000px; }

.page-template-default .code_container {
  margin: 0 auto;
  padding: 0;
  max-width: 100%; }
  .page-template-default .code_container .code_content__wrap {
    margin: 0 auto;
    padding: 0 3.5vw;
    max-width: 1500px; }

.bx--cloud-header {
  color: #fff;
  height: auto;
  width: 100%;
  position: relative; }
  .bx--cloud-header #logo {
    font-weight: 400;
    color: #fff;
    text-decoration: none;
    margin-right: 60px;
    display: inline-block;
    height: 100%;
    line-height: 3rem; }
    .bx--cloud-header #logo span {
      font-weight: 600; }
  .bx--cloud-header .site-navigation__wrap {
    display: none;
    padding: 0 20px;
    background: rgba(255, 255, 255, 0.1); }
    .bx--cloud-header .site-navigation__wrap h6 {
      border-bottom: 1px solid rgba(255, 255, 255, 0.1);
      padding: 10px 0;
      font-weight: 400;
      margin: 0 0 10px 0; }
    .bx--cloud-header .site-navigation__wrap .code_search__form {
      padding: 10px 0;
      height: auto; }
      .bx--cloud-header .site-navigation__wrap .code_search__form input {
        display: block;
        height: 40px;
        background: #fff;
        width: calc(100% - 40px);
        border: none; }
        .bx--cloud-header .site-navigation__wrap .code_search__form input:placeholder {
          color: #333; }
      .bx--cloud-header .site-navigation__wrap .code_search__form button {
        width: 40px;
        height: 40px;
        border: none; }
        .bx--cloud-header .site-navigation__wrap .code_search__form button svg {
          fill: #333; }
  .bx--cloud-header .menu-toggle {
    position: absolute;
    right: 10px;
    border: 1px solid;
    border-color: #60d3d1;
    border-radius: 3px;
    background: #60d3d1;
    color: #3f3f3f;
    font-size: 0.75rem;
    height: 3em;
    top: 0.5em;
    cursor: pointer; }
  .bx--cloud-header .bx--cloud-header-list {
    display: none; }
  .bx--cloud-header .bx--cloud-header-list > .menu-item > a {
    font-size: 0.875rem;
    padding: 0;
    height: 100%;
    line-height: 2rem;
    display: block;
    align-items: center;
    font-weight: 400;
    color: #fff;
    text-decoration: none;
    transition: color 250ms cubic-bezier(0.5, 0, 0.1, 1); }
  .bx--cloud-header .menu-item.menu-item-has-children svg,
  .bx--cloud-header .menu-item.menu-item-has-mega svg {
    display: none;
    fill: #a2a2a2;
    height: .75rem;
    width: .75rem;
    margin-left: 10px; }

@media only screen and (min-width: 760px) {
  .bx--cloud-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 3rem; }
    .bx--cloud-header .bx--cloud-header__wrapper,
    .bx--cloud-header .bx--cloud-header-brand {
      height: 100%;
      display: flex;
      align-items: center; }
    .bx--cloud-header .bx--cloud-header__wrapper .bx--cloud-header-list {
      height: 100%;
      display: flex;
      align-items: center;
      list-style: none;
      padding: 0;
      z-index: 1000; }
      .bx--cloud-header .bx--cloud-header__wrapper .bx--cloud-header-list:after {
        content: "";
        clear: both;
        display: table; }
    .bx--cloud-header .bx--cloud-header__wrapper .bx--cloud-header-list > .menu-item {
      height: 100%;
      display: block;
      line-height: 3rem;
      float: left; }
    .bx--cloud-header .bx--cloud-header__wrapper .bx--cloud-header-list > .menu-item > a {
      font-size: 0.875rem;
      padding: 0 1rem;
      height: 100%;
      display: flex;
      align-items: center;
      font-weight: 400;
      color: #fff;
      text-decoration: none;
      transition: color 250ms cubic-bezier(0.5, 0, 0.1, 1); }
    .bx--cloud-header .bx--cloud-header__wrapper .bx--cloud-header-list > .menu-item > a:hover {
      color: #fff; }
    .bx--cloud-header .bx--cloud-header__wrapper .bx--cloud-header-list__btn {
      font-family: "ibm-plex-sans", Helvetica Neue, Arial, sans-serif;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      letter-spacing: 0.5px;
      display: inline-block;
      background: none;
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      border: 0;
      padding: 0;
      cursor: pointer;
      width: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      height: 100%;
      padding: 0 1rem; }
    .bx--cloud-header .bx--cloud-header__wrapper .bx--cloud-header-list__btn svg {
      fill: #fff;
      height: 1rem;
      width: 1rem;
      transition: fill 250ms cubic-bezier(0.5, 0, 0.1, 1); }
    .bx--cloud-header .bx--cloud-header__wrapper .menu-item.menu-item-has-children svg,
    .bx--cloud-header .bx--cloud-header__wrapper .menu-item.menu-item-has-mega svg {
      display: inline-block; }
    .bx--cloud-header .bx--cloud-header__wrapper .menu-item .mega-menu {
      background-color: #fff;
      border: 1px solid #e0e0e0;
      display: none;
      position: absolute;
      color: #333;
      z-index: 1000; }
    .bx--cloud-header .bx--cloud-header__wrapper .menu-item:hover .mega-menu {
      display: block; }
    .bx--cloud-header .menu-toggle {
      display: none !important; }
    .bx--cloud-header .site-navigation__wrap {
      background: none;
      padding: 0;
      height: 100%;
      display: flex !important;
      align-items: center !important; }
      .bx--cloud-header .site-navigation__wrap h6 {
        display: none; }
      .bx--cloud-header .site-navigation__wrap .code_search__form {
        display: none; } }
@media only screen and (max-width: 759px) and (min-width: 0) {
  .menu-item-has-mega .mega-menu {
    display: none; } }
/* dealing with submenus - TODO */
/*--------------------------------------------------------------
# Carbon Header
# Dealing with a mega menu
--------------------------------------------------------------*/
#primary-menu .menu-item-has-mega .mega-menu {
  max-width: 800px;
  min-width: 200px;
  -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
  /* global mega menu styling */ }
  #primary-menu .menu-item-has-mega .mega-menu .bx--grid {
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0px;
    padding-right: 0px; }
    #primary-menu .menu-item-has-mega .mega-menu .bx--grid .bx--row {
      margin: 0; }
      #primary-menu .menu-item-has-mega .mega-menu .bx--grid .bx--row:last-child {
        margin-bottom: 0; }
  #primary-menu .menu-item-has-mega .mega-menu ul {
    padding-bottom: 0vw; }
    #primary-menu .menu-item-has-mega .mega-menu ul li {
      margin-bottom: 3px; }
      #primary-menu .menu-item-has-mega .mega-menu ul li a {
        padding: 5px;
        display: block;
        font-size: .875rem;
        text-decoration: none;
        color: #53b7b5;
        line-height: normal; }
        #primary-menu .menu-item-has-mega .mega-menu ul li a:hover {
          background: #53b7b5;
          color: #fff;
          text-decoration: none; }
  #primary-menu .menu-item-has-mega .mega-menu h5 {
    margin: 0;
    padding: 1vw 0;
    color: #8d8a8a;
    text-transform: uppercase;
    font-size: .8125rem;
    font-weight: 400; }
  #primary-menu .menu-item-has-mega .mega-menu .add-line-b {
    border-bottom: 1px solid #ebebeb; }
  #primary-menu .menu-item-has-mega .mega-menu .add-line-l {
    position: relative; }
    #primary-menu .menu-item-has-mega .mega-menu .add-line-l:after {
      content: "";
      width: 1px;
      background: #ebebeb;
      top: 0;
      left: 0;
      bottom: 0;
      position: absolute; }
  #primary-menu .menu-item-has-mega .mega-menu .no-pad-t {
    padding-top: 0;
    padding-bottom: 0; }
    #primary-menu .menu-item-has-mega .mega-menu .no-pad-t [class*='bx--col'] {
      padding-top: 0;
      padding-bottom: 0; }
  #primary-menu .menu-item-has-mega .mega-menu [class*='bx--col'] {
    padding: 10px; }
#primary-menu #topics .mega-menu {
  min-width: 800px; }
#primary-menu #topics .ibm--card__link {
  text-decoration: none;
  padding-bottom: 20px;
  display: block;
  position: relative;
  padding-left: 70px; }
  #primary-menu #topics .ibm--card__link + .ibm--card__link {
    border-bottom: none;
    padding-bottom: 0; }
  #primary-menu #topics .ibm--card__link img {
    height: 50px;
    position: absolute;
    left: 0; }
  #primary-menu #topics .ibm--card__link h3 {
    text-decoration: none;
    color: #6b6b6b;
    font-size: .9375rem;
    font-weight: bold; }
  #primary-menu #topics .ibm--card__link p {
    text-decoration: none;
    color: #6b6b6b;
    font-size: .875rem; }
#primary-menu #topics ul {
  padding-bottom: 1vw; }
  #primary-menu #topics ul li {
    margin-bottom: 3px; }
    #primary-menu #topics ul li a {
      padding: 5px;
      display: block;
      font-size: .875rem;
      text-decoration: none;
      color: #53b7b5;
      line-height: normal; }
      #primary-menu #topics ul li a:hover {
        background: #53b7b5;
        color: #fff;
        text-decoration: none; }

.code--single__hero {
  padding: 20px 0;
  border-bottom: 1px solid #e2e2e2;
  color: #868686; }

body.search-results .code_container {
  max-width: 100% !important;
  padding: 0 !important; }

body.search-results .cpt-body {
  margin: 0 auto;
  padding: 0 3.5vw;
  max-width: 1500px; }

/*--------------------------------------------------------------
# new scaffolding
--------------------------------------------------------------*/
.code_container {
  display: grid;
  grid-gap: 0px;
  grid-template-columns: auto;
  grid-template-areas: "code-aside" "code-main";
  margin: 0 auto;
  padding: 0 3.5vw;
  max-width: 1500px; }

.code_main {
  background: #ffffff;
  grid-area: code-main; }

body.archive .code_aside {
  background: #fff; }

.code_aside {
  background: #f8f8f8;
  grid-area: code-aside;
  position: relative;
  font-size: .8125rem; }

body.single {
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f8f8f8+0,f8f8f8+50,ffffff+51,ffffff+100 */
  background: #f8f8f8;
  /* Old browsers */ }

body.single.nosb {
  background: #fff; }

.code_container.nosb .code_aside {
  display: none; }

/* scaffolding for the post body layouts */
.cpt-body,
.cpt-aside {
  display: block;
  grid-gap: 0px;
  /* grid-template-columns: auto; */ }

.cpt-body.cpt-archive .cpt-controls {
  grid-column: auto;
  grid-row: auto; }
  .cpt-body.cpt-archive .cpt-controls .cpt-controls__wrap {
    padding: 3vw 0 0; }

.cpt-content__wrap {
  box-sizing: border-box;
  padding: 0 5vw;
  padding-right: 3vw; }

.cpt-aside__wrap {
  box-sizing: border-box;
  padding: 2.7777777778vw 2vw 0 0; }

.cpt-byline__wrap {
  padding: 2.7777777778vw 3vw 3vw 5vw; }

@media only screen and (min-width: 900px) {
  .code_container {
    grid-template-columns: 225px calc(100% - 225px);
    grid-template-areas: "code-aside code-main"; }

  .code_container.nosb {
    grid-template-columns: 100%;
    grid-template-areas: "code-main"; }

  .cpt-hero__wrap {
    width: calc(100% - 240px); }

  .cpt-body {
    display: grid;
    grid-gap: 0px;
    grid-template-columns: calc(100% - 240px) 240px; }

  .cpt-byline {
    grid-column: 1 / 2;
    grid-row: 1; }

  .cpt-content {
    grid-column: 1;
    grid-row: 2; }

  .cpt-aside {
    grid-column: 2;
    grid-row: 1 / 4;
    position: relative; }

  /* aside stacked */
  .cpt-body.cpt-archive {
    grid-template-columns: auto; }
    .cpt-body.cpt-archive .cpt-content {
      grid-column: auto;
      grid-row: auto; }

  /* for profiles */
  .cpt-body.cpt__ibmcode_profiles-single {
    display: grid;
    grid-gap: 0px;
    grid-template-columns: 320px calc(100% - 320px); }
    .cpt-body.cpt__ibmcode_profiles-single .cpt-content {
      grid-column: 2;
      grid-row: 1 / 4; }
    .cpt-body.cpt__ibmcode_profiles-single .cpt-aside {
      grid-column: 1;
      grid-row: 2;
      position: relative; } }
/* new button styles for Manny */
.bx--btn.bx--btn--primary {
  background: #4ca7a5;
  color: #fff; }
  .bx--btn.bx--btn--primary.code-white {
    background: #fff;
    color: #000000; }
    .bx--btn.bx--btn--primary.code-white:focus {
      border: 2px solid #fff;
      outline: 2px solid #ccc; }
  .bx--btn.bx--btn--primary.code-black {
    background: #000;
    color: #fff; }
    .bx--btn.bx--btn--primary.code-black:focus {
      border: 2px solid #000;
      outline: 2px solid #fff; }
.bx--btn.bx--btn--secondary {
  border-color: #4ca7a5;
  color: #4ca7a5; }
  .bx--btn.bx--btn--secondary:hover {
    background: #4ca7a5;
    color: #fff; }
  .bx--btn.bx--btn--secondary.code-white {
    color: #fff;
    border-color: #fff; }
    .bx--btn.bx--btn--secondary.code-white:hover {
      color: #000;
      background: #fff; }
  .bx--btn.bx--btn--secondary.code-black {
    color: #000;
    border-color: #000; }
    .bx--btn.bx--btn--secondary.code-black:hover {
      color: #fff;
      background: #000; }

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
  /* Many screen reader and browser combinations announce broken words as they would appear visually. */ }

.screen-reader-text:focus {
  background-color: #f1f1f1;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  clip-path: none;
  color: #21759b;
  display: block;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: bold;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
  /* Above WP toolbar. */ }

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
  outline: 0; }

/*--------------------------------------------------------------
# Carbon Header
--------------------------------------------------------------*/
.site-content,
.wp-content {
  /* special heading styles */ }
  .site-content table,
  .wp-content table {
    width: 100%;
    max-width: 55rem;
    margin-top: 1rem;
    margin-bottom: 1.5rem;
    line-height: 1.25;
    border-collapse: collapse;
    border-spacing: 0; }
    .site-content table tr,
    .wp-content table tr {
      border-bottom: 1px solid #dfe3e6; }
      .site-content table tr th, .site-content table tr td,
      .wp-content table tr th,
      .wp-content table tr td {
        font-size: 0.875rem;
        padding: 1rem 3rem 1rem 0;
        line-height: 1.25; }
      .site-content table tr th,
      .wp-content table tr th {
        font-size: 0.875rem;
        font-weight: 600;
        text-align: left;
        line-height: 1.25;
        padding: 1rem 3rem 1rem 0;
        border-bottom: 2px solid #60d3d1;
        white-space: nowrap; }
    .site-content table thead th,
    .wp-content table thead th {
      font-size: 0.875rem;
      font-weight: 600;
      text-align: left;
      line-height: 1.25;
      padding: 1rem 3rem 1rem 0;
      border-bottom: 2px solid #60d3d1;
      white-space: nowrap; }
    .site-content table th,
    .wp-content table th {
      font-weight: bold; }
  .site-content table.data-table,
  .wp-content table.data-table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    border: 1px solid #dfe3e6; }
    .site-content table.data-table tr,
    .wp-content table.data-table tr {
      height: 3rem; }
      .site-content table.data-table tr th, .site-content table.data-table tr td,
      .wp-content table.data-table tr th,
      .wp-content table.data-table tr td {
        padding-left: 0.75rem;
        vertical-align: middle;
        text-align: left;
        color: #152935;
        padding-left: 1.5rem;
        border: none;
        border-bottom: 1px solid #dfe3e6; }
        .site-content table.data-table tr th:first-of-type, .site-content table.data-table tr td:first-of-type,
        .wp-content table.data-table tr th:first-of-type,
        .wp-content table.data-table tr td:first-of-type {
          font-size: 0.875rem; }
      .site-content table.data-table tr th,
      .wp-content table.data-table tr th {
        font-weight: bold;
        background: #60d3d1;
        color: #fff; }
    .site-content table.data-table tbody tr:nth-child(even),
    .wp-content table.data-table tbody tr:nth-child(even) {
      background-color: #f8f8f8; }
  .site-content a,
  .wp-content a {
    color: #53918f;
    text-decoration: none; }
  .site-content p, .site-content ul, .site-content ol,
  .wp-content p,
  .wp-content ul,
  .wp-content ol {
    padding: 0 0 22px;
    line-height: 1.625rem; }
  .site-content h1, .site-content h2, .site-content h3, .site-content h4, .site-content h5, .site-content h6,
  .wp-content h1,
  .wp-content h2,
  .wp-content h3,
  .wp-content h4,
  .wp-content h5,
  .wp-content h6 {
    font-size: 1rem;
    line-height: 1.625rem;
    font-weight: normal;
    padding: 0 0 22px; }
  .site-content h1,
  .wp-content h1 {
    font-size: 2.5rem;
    line-height: 2.8125rem;
    font-weight: 600; }
  .site-content h2,
  .wp-content h2 {
    font-size: 1.875rem;
    line-height: 2.1875rem;
    font-weight: 300; }
  .site-content h3,
  .wp-content h3 {
    font-size: 1.5625rem;
    line-height: 1.875rem; }
  .site-content h4,
  .wp-content h4 {
    font-size: 1.25rem;
    line-height: 1.5625rem; }
  .site-content h5,
  .wp-content h5 {
    font-size: 1rem;
    line-height: 1.625rem;
    font-weight: 600; }
  .site-content h6,
  .wp-content h6 {
    font-size: 1rem;
    line-height: 1.625rem; }
  .site-content .hs1, .site-content body.single-ibmcode_patterns .wp-content h2, body.single-ibmcode_patterns .wp-content .site-content h2,
  .wp-content .hs1,
  body.single-ibmcode_patterns .wp-content h2 {
    padding-bottom: 10px;
    margin-bottom: 22px;
    border-bottom: 3px solid #60d3d1;
    display: inline-block; }
  .site-content .hs2,
  .wp-content .hs2 {
    border-left: 3px solid #60d3d1;
    padding: 11px 0 11px 22px;
    margin-left: -25px;
    margin-bottom: 22px;
    position: relative; }
  .site-content ul, .site-content ol,
  .wp-content ul,
  .wp-content ol {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-left: 2rem;
    line-height: 1.5; }
  .site-content ul ul, .site-content ol ol,
  .wp-content ul ul,
  .wp-content ol ol {
    padding-top: 5px;
    padding-bottom: 0; }
  .site-content ul li, .site-content ol li,
  .wp-content ul li,
  .wp-content ol li {
    padding-left: 0.25rem;
    padding-bottom: 5px; }
  .site-content ol li,
  .wp-content ol li {
    list-style-type: decimal; }
  .site-content ul li,
  .wp-content ul li {
    list-style-type: disc; }
  .site-content ul.code-nolist li,
  .site-content ol.code-nolist li,
  .wp-content ul.code-nolist li,
  .wp-content ol.code-nolist li {
    list-style-type: none; }

.wp-content img {
  max-width: 100%;
  height: auto; }
.wp-content iframe {
  max-width: 100%; }

/* restyling the primary buttons */
.cpt-byline p {
  padding: 0; }
.cpt-byline hr {
  border: 0;
  height: 0;
  border-bottom: 1px solid #dfdddf;
  margin-top: 2.7777777778vw; }
.cpt-byline .cpt-byline__subtitle {
  margin-top: 1.3888888889vw;
  font-size: 1.125rem;
  font-weight: 300; }
.cpt-byline .cpt-byline__giturl {
  margin-top: 1.0416666667vw; }
.cpt-byline .cpt-byline__categories {
  margin-top: 1.7361111111vw;
  /* styleing of the category pills */ }
  .cpt-byline .cpt-byline__categories .bx--tag--category {
    background: #f7f7f7;
    color: #5c5c5c;
    margin-right: 5px; }
    .cpt-byline .cpt-byline__categories .bx--tag--category:last-child {
      margin-right: 0; }
.cpt-byline .github-link {
  color: #53918f;
  text-decoration: none; }
.cpt-byline .github-link svg {
  color: #313131;
  height: 1rem;
  width: 1rem;
  position: relative;
  top: 2px;
  margin-right: 5px; }
.cpt-byline .bx--tag {
  text-decoration: none; }
.cpt-byline .cpt-byline__posttype {
  padding-bottom: 0.8333333333vw;
  border-bottom: 3px solid #60d3d1;
  font-size: 1rem;
  font-weight: normal;
  text-transform: uppercase;
  display: inline-block; }
.cpt-byline .cpt-byline__title {
  font-weight: normal;
  font-size: 2.5rem;
  line-height: 3rem;
  padding: 0;
  margin-top: 2.7777777778vw; }
.cpt-byline .cpt-byline__author {
  color: #393939;
  font-size: .875rem;
  margin-top: 2.7777777778vw; }

/* specific styles for the pattern byline hero section */
.cpt-hero {
  position: relative;
  color: #fff; }
  .cpt-hero p {
    padding: 0; }
  .cpt-hero .cpt-hero__wrap {
    position: relative;
    z-index: 1;
    padding: 2.7777777778vw 3vw 4vw 5vw; }
    .cpt-hero .cpt-hero__wrap .cpt-byline__posttype {
      padding-bottom: 0.8333333333vw;
      border-bottom: 3px solid #60d3d1;
      font-size: 1rem;
      font-weight: normal;
      text-transform: uppercase;
      display: inline-block; }
    .cpt-hero .cpt-hero__wrap .cpt-byline__title {
      font-weight: normal;
      font-size: 2.5rem;
      line-height: 3rem;
      padding: 0;
      margin-top: 2.7777777778vw; }
    .cpt-hero .cpt-hero__wrap .cpt-byline__subtitle {
      margin-top: 1.3888888889vw;
      font-size: 1.125rem;
      font-weight: 300; }
    .cpt-hero .cpt-hero__wrap .github-link {
      color: #53918f;
      text-decoration: none; }
    .cpt-hero .cpt-hero__wrap .github-link svg {
      color: #313131;
      height: 1rem;
      width: 1rem;
      position: relative;
      top: 2px;
      margin-right: 5px; }
    .cpt-hero .cpt-hero__wrap .cpt-byline__giturl {
      margin-top: 1.0416666667vw; }
    .cpt-hero .cpt-hero__wrap .hero_buttons {
      margin-top: 2.7777777778vw; }
      .cpt-hero .cpt-hero__wrap .hero_buttons svg {
        fill: #fff;
        margin-right: 5px;
        height: 1em;
        width: 1em; }
      .cpt-hero .cpt-hero__wrap .hero_buttons .bx--btn--primary {
        margin-right: 1rem; }
      .cpt-hero .cpt-hero__wrap .hero_buttons .bx--btn--secondary {
        background-color: transparent;
        border-width: 2px;
        border-style: solid;
        border-color: #fff;
        color: #fff;
        margin-right: 1rem; }
        .cpt-hero .cpt-hero__wrap .hero_buttons .bx--btn--secondary:hover {
          background-color: #fff;
          color: #333; }
          .cpt-hero .cpt-hero__wrap .hero_buttons .bx--btn--secondary:hover svg {
            fill: #333; }
  .cpt-hero:after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(22, 22, 22, 0.75); }

.single-ibmcode_patterns .cpt-byline__author {
  margin-top: 0 !important; }

.code--entry-footer {
  border-bottom: 1px solid #dddddd;
  border-top: 1px solid #dddddd;
  padding: 30px 0;
  display: block; }
  .code--entry-footer:empty {
    display: none !important; }
  .code--entry-footer .code__components,
  .code--entry-footer .code__collections {
    font-size: .6875rem;
    text-transform: uppercase;
    color: #333333;
    font-weight: 700;
    margin: 0;
    padding: 0; }
    .code--entry-footer .code__components a.bx--tag,
    .code--entry-footer .code__collections a.bx--tag {
      font-size: .6875rem;
      color: #666666; }

.code--taxonomy__featured,
.code--taxonomy__alpha {
  margin-top: 5%;
  margin-bottom: 5%;
  margin-left: 0;
  margin-right: 0;
  padding-left: 0px;
  padding-right: 0px; }
  .code--taxonomy__featured .bx--row,
  .code--taxonomy__alpha .bx--row {
    margin-bottom: 20px; }
    .code--taxonomy__featured .bx--row:last-child,
    .code--taxonomy__alpha .bx--row:last-child {
      margin-bottom: 0; }
  .code--taxonomy__featured > h3,
  .code--taxonomy__alpha > h3 {
    font-size: .9375rem;
    color: #bcbcbc; }

/* styles for the featured cards */
.code--taxonomy__featured .ibm--card {
  text-align: center; }
  .code--taxonomy__featured .ibm--card .ibm--card__link {
    display: block; }
  .code--taxonomy__featured .ibm--card .ibm--card__icon {
    margin-top: 2vw;
    margin-bottom: 2vw; }

/* the alpha cards need to have borders and such removed */
.code--taxonomy__alpha .ibm--card.taxonomy_card_image .ibm--card__image {
  background: transparent url("img/citycard.jpg") scroll no-repeat center/cover; }
.code--taxonomy__alpha .ibm--card.taxonomy_card_icon {
  border: none;
  box-shadow: none; }
  .code--taxonomy__alpha .ibm--card.taxonomy_card_icon .ibm--card__body {
    position: relative;
    padding-left: 70px; }
    .code--taxonomy__alpha .ibm--card.taxonomy_card_icon .ibm--card__body .ibm--card__icon {
      position: absolute;
      left: 0; }
    .code--taxonomy__alpha .ibm--card.taxonomy_card_icon .ibm--card__body .ibm--card__title {
      color: #5bb6b6;
      font-size: 1.375rem;
      padding-bottom: 5px;
      font-weight: normal; }
    .code--taxonomy__alpha .ibm--card.taxonomy_card_icon .ibm--card__body .ibm--card__excerpt p {
      font-size: .9375rem;
      color: #4a4a4a;
      line-height: 1.5; }

.code--taxonomy__getstarted {
  margin-top: 5%;
  padding-top: 10px;
  padding-bottom: 5%;
  margin-bottom: 5%;
  border-bottom: 1px solid #e6e6e6; }
  .code--taxonomy__getstarted h4 {
    font-size: 1.375rem; }
  .code--taxonomy__getstarted p {
    font-size: .9375rem;
    line-height: 1.5; }
    .code--taxonomy__getstarted p + p {
      padding-bottom: 0; }

.code--taxonomy__hero {
  padding: 20px 0px;
  display: flex;
  justify-content: left;
  align-items: center;
  margin: 0 auto;
  padding: 20px 3.5vw;
  max-width: 1500px; }
  .code--taxonomy__hero .code--taxonomy__icon {
    height: 50px;
    width: auto;
    margin-right: 10px; }
    .code--taxonomy__hero .code--taxonomy__icon img {
      height: 100%;
      width: auto; }
  .code--taxonomy__hero .taxonomy__hero-heading {
    font-size: 1.625rem;
    padding: 0;
    color: #343434; }
  .code--taxonomy__hero .taxonomy__hero-description {
    display: none;
    font-size: .875rem; }
    .code--taxonomy__hero .taxonomy__hero-description p {
      font-size: inherit;
      padding: 0;
      color: #f6f6f6; }

.code--taxonomy__hero-city {
  background: transparent url("img/cityscape.jpg") scroll no-repeat center/cover;
  margin: 0 0 40px 0;
  position: relative;
  color: #fff; }
  .code--taxonomy__hero-city .code_content__wrap {
    position: relative;
    z-index: 100;
    padding: 3vw 3.5vw 2vw 3.5vw;
    margin: 0 auto;
    max-width: 1500px; }
  .code--taxonomy__hero-city:after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(22, 22, 22, 0.5);
    z-index: 2; }

.taxonomy__hero-description_cities {
  margin-bottom: 2vw; }
  .taxonomy__hero-description_cities h4 {
    color: #454545;
    font-size: 1rem;
    font-wieght: 400; }
  .taxonomy__hero-description_cities > div {
    color: #454545;
    font-size: 1rem;
    line-height: 1.2; }

.code--taxonomy__hero1 {
  padding: 30px 20px 30px 0;
  padding: 3vw 3.5vw 2vw 3.5vw;
  margin: 0 auto;
  max-width: 1500px; }
  .code--taxonomy__hero1 .taxonomy__hero-heading {
    font-size: 2.1875rem;
    padding: 0;
    color: #4a4a4a;
    font-weight: lighter;
    padding-bottom: 2vw; }
  .code--taxonomy__hero1 .taxonomy__hero-description {
    font-size: .875rem;
    color: #4a4a4a; }
    .code--taxonomy__hero1 .taxonomy__hero-description p {
      font-size: inherit;
      padding: 0;
      color: #4a4a4a; }

.code--taxonomy__list {
  margin-right: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  padding-left: 0 !important;
  margin-bottom: 150px; }
  .code--taxonomy__list .bx--row {
    margin-bottom: 20px; }
  .code--taxonomy__list .ibmcode__type {
    color: #d3d3d3;
    font-size: .75rem;
    font-weight: 800;
    text-transform: uppercase;
    padding: 0;
    margin: 0 0 1vw 0; }
  .code--taxonomy__list .code--taxonomy__list_header {
    position: relative;
    z-index: 11;
    margin-bottom: 2.2vw; }
    .code--taxonomy__list .code--taxonomy__list_header h4 {
      color: #fff;
      text-transform: uppercase;
      font-size: .875rem;
      font-weight: 600;
      padding: 0; }
      .code--taxonomy__list .code--taxonomy__list_header h4 span {
        position: relative;
        padding: 0.3472222222vw 2.4305555556vw;
        background: #60d3d1;
        z-index: 11;
        display: inline-block; }
    .code--taxonomy__list .code--taxonomy__list_header a {
      position: absolute;
      right: 0;
      top: 5px;
      display: inline-block;
      font-size: .875rem;
      font-weight: 600;
      color: #4ab5b3; }
      .code--taxonomy__list .code--taxonomy__list_header a span {
        position: relative;
        padding: 0.5vw 0 0.5vw 3vw;
        background: #fff;
        z-index: 11;
        display: inline-block; }
    .code--taxonomy__list .code--taxonomy__list_header:after {
      content: "";
      display: block;
      height: 1px;
      width: 100%;
      background: #d7d7d7;
      position: absolute;
      z-index: 10;
      top: 50%; }
  .code--taxonomy__list .nocard-ibmcode {
    margin-bottom: 3vw; }
    .code--taxonomy__list .nocard-ibmcode .ibm--card__block_link {
      display: block; }
      .code--taxonomy__list .nocard-ibmcode .ibm--card__block_link:hover .nocard-ibmcode__title span {
        box-shadow: inset 0px -14px 0px 0px rgba(85, 182, 180, 0.5); }
    .code--taxonomy__list .nocard-ibmcode .nocard-ibmcode__type {
      color: #d3d3d3;
      font-size: .75rem;
      font-weight: 800;
      text-transform: uppercase;
      padding: 0;
      margin: 0; }
    .code--taxonomy__list .nocard-ibmcode .nocard-ibmcode__title {
      padding-bottom: 15px;
      font-size: 2.1875rem;
      margin-top: 1vw;
      font-weight: 800;
      line-height: 1.4;
      color: #313131; }
      .code--taxonomy__list .nocard-ibmcode .nocard-ibmcode__title span {
        box-shadow: inset 0px -14px 0px 0px rgba(85, 182, 180, 0.25); }
    .code--taxonomy__list .nocard-ibmcode .nocard-ibmcode__date-cats .nocard-ibmcode__date {
      color: #b6b6b6;
      font-size: .75rem;
      display: inline-block; }
    .code--taxonomy__list .nocard-ibmcode .nocard-ibmcode__date-cats .cpt-byline__categories {
      display: inline-block;
      margin-left: 8px; }
      .code--taxonomy__list .nocard-ibmcode .nocard-ibmcode__date-cats .cpt-byline__categories .bx--tag--category {
        background-color: #f7f7f7;
        color: #5c5c5c; }
      .code--taxonomy__list .nocard-ibmcode .nocard-ibmcode__date-cats .cpt-byline__categories span {
        color: #5c5c5c; }
    .code--taxonomy__list .nocard-ibmcode .nocard-ibmcode__excerpt {
      color: #141414;
      font-size: .9375rem;
      padding: 0; }

#ibm-content-wrapper {
  position: relative;
  -webkit-transition: all 0.25s linear;
  -moz-transition: all 0.25s linear;
  -o-transition: all 0.25s linear;
  transition: all 0.25s linear;
  left: 0; }

.code_aside #code_aside__navtoggle {
  display: block; }
.code_aside #code_aside__navtoggle_open,
.code_aside #code_aside__navtoggle_close {
  display: inline-block;
  border: none;
  background: none;
  line-height: 1.5;
  font-size: .875rem;
  cursor: pointer; }
.code_aside #code_aside__navtoggle_close {
  display: none; }

body.sb-viewing {
  overflow: hidden; }
  body.sb-viewing #ibm-content-wrapper {
    left: 80%; }
  body.sb-viewing .code_aside .code_leftnav {
    left: 0; }
  body.sb-viewing .code_aside .code_aside__overlay {
    position: fixed;
    background: rgba(0, 0, 0, 0.9);
    width: 20%;
    left: 80%;
    top: 0;
    bottom: 0;
    z-index: 301;
    display: block;
    -webkit-box-shadow: -4px 0px 3px -2px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: -4px 0px 3px -2px rgba(0, 0, 0, 0.5);
    box-shadow: -4px 0px 3px -2px rgba(0, 0, 0, 0.5); }
  body.sb-viewing .code_aside #code_aside__navtoggle_close {
    position: fixed;
    left: auto;
    right: 25%;
    top: 20px;
    z-index: 301;
    display: inline-block;
    display: none; }
  body.sb-viewing .code_aside #code_aside__navtoggle {
    display: block; }

body.single .code_leftnav {
  padding: 2.7777777778vw 0 0 0; }

.code_leftnav {
  -webkit-transition: all 0.25s linear;
  -moz-transition: all 0.25s linear;
  -o-transition: all 0.25s linear;
  transition: all 0.25s linear;
  position: fixed;
  width: 80%;
  left: -80%;
  top: 0;
  bottom: 0;
  z-index: 1;
  padding: 0; }
  .code_leftnav .code--taxonomy__icon {
    padding-bottom: 28px;
    margin-bottom: 28px;
    border-bottom: 1px solid #dedede;
    position: relative; }
    .code_leftnav .code--taxonomy__icon a {
      color: #53918f;
      font-size: 1rem;
      position: relative;
      padding-left: 37px;
      display: block;
      line-height: 1.2; }
      .code_leftnav .code--taxonomy__icon a img {
        height: 33px;
        width: auto;
        vertical-align: text-bottom;
        margin-right: 5px;
        position: absolute;
        left: 0;
        top: -7px; }
  .code_leftnav nav {
    margin: 0 0 2.7777777778vw 0;
    max-width: 90%; }
    .code_leftnav nav h4 {
      color: #bbbbbb;
      text-transform: uppercase;
      font-size: .875rem;
      font-weight: 400;
      padding: 0;
      margin-bottom: 0.5555555556vw; }
  .code_leftnav ul {
    padding: 0;
    margin: 0; }
    .code_leftnav ul li {
      list-style-type: none;
      padding: 0; }
      .code_leftnav ul li a {
        color: #666;
        font-size: .875rem;
        font-weight: normal; }
        .code_leftnav ul li a:hover {
          color: #202020; }
      .code_leftnav ul li.nav-head {
        margin-top: 30px;
        margin-bottom: 10px; }
        .code_leftnav ul li.nav-head a {
          color: #c9c9c9;
          text-transform: uppercase;
          font-size: .875rem;
          font-weight: 300; }

@media only screen and (min-width: 900px) {
  #code_aside__navtoggle_open,
  #code_aside__navtoggle_close {
    display: none !important; }

  .code_leftnav {
    position: static;
    width: auto;
    left: auto;
    top: 0;
    bottom: 0;
    z-index: 1; }

  body.sb-viewing .code_aside .code_aside__overlay {
    display: none !important; }

  body.sb-viewing #ibm-content-wrapper {
    left: auto; } }
#content .cpt-aside h1, #content .cpt-aside h2, #content .cpt-aside h3, #content .cpt-aside h4, #content .cpt-aside h5, #content .cpt-aside h6 {
  text-transform: uppercase;
  color: #c9c9c9;
  font-size: .875rem;
  font-weight: 400;
  line-height: 1.625rem;
  margin-bottom: 1.25vw;
  padding: 0; }
#content .cpt-aside nav {
  margin: 0 0 2.7777777778vw 0; }
#content .cpt-aside p, #content .cpt-aside li {
  font-size: .875rem;
  list-style-type: none;
  line-height: 1.2em;
  padding-bottom: 15px; }
  #content .cpt-aside p a, #content .cpt-aside li a {
    color: #666;
    display: block; }
    #content .cpt-aside p a:hover, #content .cpt-aside li a:hover {
      color: #202020; }
#content .cpt-aside ul, #content .cpt-aside ol {
  padding: 0;
  margin: 0; }
  #content .cpt-aside ul ol, #content .cpt-aside ul ul, #content .cpt-aside ol ol, #content .cpt-aside ol ul {
    margin-left: 1rem; }
#content .cpt-aside .cpt-social ul {
  list-style-type: none;
  display: flex;
  padding: 0;
  margin: 0; }
  #content .cpt-aside .cpt-social ul li {
    list-style-type: none;
    padding: 0;
    margin-right: 25px; }
    #content .cpt-aside .cpt-social ul li a span {
      display: none; }
    #content .cpt-aside .cpt-social ul li svg {
      fill: #8b8b8b;
      height: 1rem;
      width: 1rem; }

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
#code-footer {
  background: #3f3f3f;
  padding: 3vw 0;
  color: #fff;
  font-weight: 300;
  font-size: .875rem;
  position: relative; }
  #code-footer .bx--grid {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0; }
  #code-footer ul li {
    position: relative; }
    #code-footer ul li.heading {
      padding: 10px 0;
      font-weight: 600; }
    #code-footer ul li b {
      font-weight: 600; }
    #code-footer ul li a {
      position: relative;
      text-decoration: none;
      color: #fff;
      padding: 10px 0;
      display: inline-block; }
  #code-footer h5 {
    margin: 15px 0;
    font-weight: 400; }
  #code-footer .social-box p {
    float: left;
    margin-right: 15px;
    margin-bottom: 15px; }
    #code-footer .social-box p a {
      display: block; }
    #code-footer .social-box p.dw-footer-social {
      clear: left; }
  #code-footer .social-box:after {
    content: "";
    clear: both;
    display: table; }

#dw-footer {
  background: #f4f4f4;
  padding: 10px 0; }
  #dw-footer .dw-footer-corporate-links {
    display: inline-block;
    padding: 22px 0; }
    #dw-footer .dw-footer-corporate-links ul {
      padding-bottom: 0; }
      #dw-footer .dw-footer-corporate-links ul li {
        display: inline-block;
        padding: 0 20px 0 0; }
        #dw-footer .dw-footer-corporate-links ul li a {
          padding: 10px 0;
          display: inline-block;
          color: #5a5a5a;
          text-decoration: none; }

/* apply a different style to the pattern headings */
/* styling the card override used for the patterns & videos post type */
.ibm--card.ibm--card__ibmcode_patterns .ibm--card__image {
  padding: 1rem;
  position: relative; }

.ibm--card.ibm--card__ibmcode_patterns .ibm--card__image .ibm--card__title,
.ibm--card.ibm--card__ibmcode_patterns .ibm--card__image .ibm--card__type {
  position: relative;
  z-index: 10; }

.ibm--card.ibm--card__ibmcode_patterns .ibm--card__image .ibm--card__title {
  color: #fff; }

.ibm--card.ibm--card__ibmcode_patterns {
  position: relative;
  color: #fff; }

.ibm--card.ibm--card__ibmcode_patterns:after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(22, 22, 22, 0.75); }

.ibm--card.ibm--card__ibmcode_patterns .ibm--card__body,
.ibm--card.ibm--card__ibmcode_patterns .ibm--card__bottom {
  position: relative;
  z-index: 10; }

.ibm--card.ibm--card__ibmcode_patterns .ibm--card__title,
.ibm--card.ibm--card__ibmcode_patterns .ibm--card__date {
  color: #fff; }

.ibm--card.ibm--card__ibmcode_videos .ibm--card__image {
  position: relative; }
  .ibm--card.ibm--card__ibmcode_videos .ibm--card__image svg {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    overflow: hidden;
    position: absolute;
    right: 15px;
    top: 15px; }
    .ibm--card.ibm--card__ibmcode_videos .ibm--card__image svg path {
      fill: #fff; }

/* cpt archive filters */
.test-old {
  display: flex; }
  .test-old .cpt-archive-filters {
    vertical-align: middle;
    position: relative;
    margin-left: 40px;
    top: 6px; }

.cpt-applied-filters {
  border-top: 1px solid #ebebeb;
  border-bottom: 1px solid #ebebeb;
  margin-bottom: 2vw; }
  .cpt-applied-filters .cpt-applied-filters__wrap {
    padding: 1vw 0; }
  .cpt-applied-filters .ao-opp {
    color: #ababab;
    font-size: .875rem;
    margin-right: 2px; }
  .cpt-applied-filters .svg-icon {
    margin-left: 5px;
    display: inline-flex;
    align-self: center;
    position: relative;
    width: .5em;
    height: .5em; }
    .cpt-applied-filters .svg-icon svg {
      width: .5em;
      height: .5em;
      fill: #333; }

/* hoping to generally style all of the custom post type pages */
.cpt-archive .cpt--item__row .bx--row {
  margin-bottom: 20px; }

body.post-type-archive .cpt-archive-hero {
  background: #3f3f3f;
  color: #fff; }
  body.post-type-archive .cpt-archive-hero .cpt-archive-hero__inner {
    padding: 2vw; }

.bx--grid.no-pad {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important; }

/* not really sure where to put this for the time being */
.ibmcode_content_series {
  border: 1px solid #eee;
  background-color: #f9f9f9;
  margin-bottom: 25px;
  margin-top: 40px;
  padding: 20px; }
  .ibmcode_content_series > h4 {
    font-size: 1.1rem;
    font-weight: bold;
    padding-bottom: 0px; }
  .ibmcode_content_series > p {
    color: #666666; }
    .ibmcode_content_series > p a {
      color: #666666;
      font-weight: bold; }
  .ibmcode_content_series > ul {
    list-style-type: none;
    padding-left: 0;
    margin-left: 0; }
    .ibmcode_content_series > ul li {
      list-style-type: none; }

.ibm--card.ibm--card__ibmcode_videos .ibm--card__image:after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(22, 22, 22, 0.15); }

.cpt__related_content {
  padding: 0 0 5vw 5vw;
  margin-top: 2vw;
  border-top: 1px solid #dfe3e6; }
  .cpt__related_content > h4 {
    box-sizing: border-box;
    padding: 0;
    margin-bottom: 5vw; }
    .cpt__related_content > h4 span {
      display: inline-block;
      border: 1px solid #dfe3e6;
      border-top: none;
      padding: 0.5vw 2vw;
      font-size: 1rem; }
  .cpt__related_content > .bx--grid {
    margin: 0 !important;
    padding: 0 !important; }
  .cpt__related_content #ftrelated {
    padding-right: 3vw; }

@media only screen and (max-width: 579px) and (min-width: 0) {
  .ibm--card {
    height: auto !important; } }
@media only screen and (max-width: 1023px) and (min-width: 0) {
  body.archive.category .code_main .bx--row {
    display: block; }
  body.archive.category .code_main .ibm--card {
    margin-bottom: 2vw; } }
.ibm--card {
  font-family: "ibm-plex-sans", Helvetica Neue, Arial, sans-serif;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
  background-color: #fff;
  border: 1px solid #dfe3e6;
  height: 100%;
  padding-bottom: 10px; }
  .ibm--card .ibm--card__block_link {
    display: block; }
  .ibm--card .ibm--card__type {
    font-size: .875rem;
    color: #61d4d1;
    font-weight: 600;
    padding-bottom: 11px;
    padding: 0;
    margin: 0;
    text-transform: uppercase; }
  .ibm--card .ibm--card__date {
    font-size: .8125rem;
    font-weight: 300;
    color: #a1a1a1;
    padding: 0;
    margin: 1.5vw 0 0 0;
    line-height: 1; }
    .ibm--card .ibm--card__date:before {
      content: " | ";
      color: #a1a1a1;
      margin: 0 5px; }
  .ibm--card .ibm--card__location {
    margin: 0;
    padding: 0;
    color: #a1a1a1;
    font-size: .8125rem;
    font-weight: 600;
    line-height: 1;
    margin: 0.5vw 0 0 0; }
  .ibm--card .ibm--card__title {
    font-size: 1.4375rem;
    font-weight: 500;
    color: #323232;
    line-height: 1.3;
    padding: 0;
    margin: 1.2vw 0 0 0; }
  .ibm--card .ibm--card__excerpt {
    font-size: 1rem;
    color: #141414;
    line-height: 1.4;
    padding: 0;
    margin: 1.5vw 0 0 0;
    font-weight: 300; }
  .ibm--card .cpt-byline__categories {
    position: relative; }
    .ibm--card .cpt-byline__categories .bx--tag--category {
      border: 1px solid #cfcfcf;
      color: #7e7e7e; }
    .ibm--card .cpt-byline__categories .bx--tag--category_more {
      color: #7e7e7e; }
  .ibm--card .ibm--card__readmore {
    padding: 0; }
    .ibm--card .ibm--card__readmore a {
      font-size: .875rem;
      background: #60d3d1;
      color: #fff;
      padding: 7px 20px; }
  .ibm--card .ibm--card__image {
    position: relative;
    margin: -1.5rem -2rem 1rem -2rem;
    height: 160px; }
    .ibm--card .ibm--card__image img {
      display: none;
      height: auto !important;
      max-height: 160px;
      width: 100%; }
  .ibm--card .ibm--card__bottom {
    padding: 0 2rem;
    margin-top: 1rem; }
    .ibm--card .ibm--card__bottom p {
      border-top: 1px solid #ededed;
      padding: 0.5rem 0; }
    .ibm--card .ibm--card__bottom:empty {
      display: none !important; }
  .ibm--card .ibm--card__body {
    position: relative;
    padding: 1.5rem 2rem; }
  .ibm--card.ibm--card__ibmcode_events .ibm--card__title {
    font-weight: 600; }
  .ibm--card.ibm--card__ibmcode_events .ibm--card__date svg,
  .ibm--card.ibm--card__ibmcode_events .ibm--card__location svg {
    margin-right: 5px;
    width: 14px;
    height: auto;
    fill: #bd7174;
    position: relative;
    top: 2px; }
  .ibm--card.ibm--card__ibmcode_events .ibm--card__date {
    font-size: .875rem;
    font-weight: 500;
    color: #5c5c5c;
    padding: 0;
    margin: 1.5vw 0 0 0;
    line-height: 1; }
    .ibm--card.ibm--card__ibmcode_events .ibm--card__date:before {
      display: none; }
  .ibm--card.ibm--card__ibmcode_videos .ibm--card__type {
    background: #fff;
    display: inline-block;
    padding: 0 10px 0 10px;
    position: relative;
    left: -10px; }
  .ibm--card.ibm--card__ibmcode_patterns .bx--tag--category {
    border: 1px solid #b0b0b0;
    color: #ababab; }
  .ibm--card.ibm--card__ibmcode_patterns .ibm--card__bottom {
    margin-top: 0; }
    .ibm--card.ibm--card__ibmcode_patterns .ibm--card__bottom p.cpt-byline__categories {
      border-top: none !important; }
  .ibm--card.ibm--card__ibmcode_patterns .ibm--card__getcode {
    padding: 6px 20px;
    margin: 2vw 0 0 0;
    border: 1px solid #56d3d0;
    display: inline-block;
    color: #56d3d0;
    font-weight: 600; }
    .ibm--card.ibm--card__ibmcode_patterns .ibm--card__getcode span {
      font-weight: 400; }
  .ibm--card.ibm--card__ibmcode_patterns:hover .ibm--card__getcode {
    border: 1px solid #56d3d0;
    background: #56d3d0;
    color: #000; }
  .ibm--card.ibm--card__ibmcode_tutorials .ibm--card__bottom {
    margin-top: 0; }
    .ibm--card.ibm--card__ibmcode_tutorials .ibm--card__bottom .cpt-byline__categories {
      border-top: none; }
  .ibm--card.ibm--card__ibmcode_tutorials .ibm--card__title:after {
    content: "";
    display: block;
    width: 70%;
    height: 3px;
    background: #53b7b5;
    margin-top: 1.5vw; }
  .ibm--card.ibm--card__ibmcode_model_assets {
    background: #60d3d1;
    border: 1px solid #60d3d1; }
    .ibm--card.ibm--card__ibmcode_model_assets .ibm--card__type {
      color: #3f3f3f; }
    .ibm--card.ibm--card__ibmcode_model_assets .ibm--card__date {
      color: #fff; }
      .ibm--card.ibm--card__ibmcode_model_assets .ibm--card__date:before {
        color: #fff; }
    .ibm--card.ibm--card__ibmcode_model_assets .ibm--card__excerpt {
      color: #fff; }
    .ibm--card.ibm--card__ibmcode_model_assets .ibm--card__title {
      color: #fff; }
    .ibm--card.ibm--card__ibmcode_model_assets .ibm--card__bottom {
      margin-top: 0; }
      .ibm--card.ibm--card__ibmcode_model_assets .ibm--card__bottom .cpt-byline__categories {
        border-top: none; }
        .ibm--card.ibm--card__ibmcode_model_assets .ibm--card__bottom .cpt-byline__categories .bx--tag--category {
          border: 1px solid #fff;
          color: #fff; }
        .ibm--card.ibm--card__ibmcode_model_assets .ibm--card__bottom .cpt-byline__categories .bx--tag--category_more {
          color: #fff; }
  .ibm--card.ibm--card__post .ibm--card__title {
    font-weight: 600;
    line-height: 1.4; }
    .ibm--card.ibm--card__post .ibm--card__title span {
      box-shadow: inset 0px -8px 0px 0px rgba(85, 182, 180, 0.25); }
  .ibm--card.ibm--card__post:hover .ibm--card__title span {
    box-shadow: inset 0px -8px 0px 0px rgba(85, 182, 180, 0.5); }

.code__navigation {
  margin: 30px 0 0 0; }
  .code__navigation ul {
    padding: 0;
    margin: 0; }
  .code__navigation li a,
  .code__navigation li a:hover,
  .code__navigation li.active a,
  .code__navigation li.disabled {
    color: #fff;
    text-decoration: none; }
  .code__navigation li {
    display: inline-block;
    margin: 0; }
    .code__navigation li a {
      display: block; }
  .code__navigation li a,
  .code__navigation li a:hover,
  .code__navigation li.active a,
  .code__navigation li.disabled {
    background-color: #6FB7E9;
    border-radius: 3px;
    cursor: pointer;
    padding: 12px;
    padding: 0.75rem; }
  .code__navigation li a:hover,
  .code__navigation li.active a {
    background-color: #3C8DC5; }

.cptFilterForm {
  background: #f8f8f8;
  position: fixed;
  width: 80%;
  left: -80%;
  top: 0;
  bottom: 0;
  z-index: 20;
  -webkit-transition: all 0.25s linear;
  -moz-transition: all 0.25s linear;
  -o-transition: all 0.25s linear;
  transition: all 0.25s linear; }

body.cpt-viewing {
  overflow: hidden; }
  body.cpt-viewing #ibm-content-wrapper {
    left: 80%; }
  body.cpt-viewing .cptFilterForm {
    left: 0;
    overflow: scroll; }
  body.cpt-viewing .cptArchive__overlay {
    position: fixed;
    background: rgba(0, 0, 0, 0.9);
    width: 20%;
    left: 80%;
    top: 0;
    bottom: 0;
    z-index: 301;
    display: block;
    -webkit-box-shadow: -4px 0px 3px -2px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: -4px 0px 3px -2px rgba(0, 0, 0, 0.5);
    box-shadow: -4px 0px 3px -2px rgba(0, 0, 0, 0.5); }

@media only screen and (min-width: 800px) {
  .cptToggleFilters {
    display: none; }

  .cptFilterForm {
    background: transparent;
    position: relative;
    width: auto;
    left: auto;
    top: auto;
    bottom: auto; }

  ul.cpt-archive-filters {
    position: relative;
    z-index: 200;
    display: flex;
    list-style-type: none;
    margin: 0; }
    ul.cpt-archive-filters > li {
      list-style-type: none !important;
      position: relative;
      margin-right: 40px;
      font-size: .875rem; }
      ul.cpt-archive-filters > li a {
        color: #454545; }
        ul.cpt-archive-filters > li a span {
          color: #ababab; }
      ul.cpt-archive-filters > li:last-child {
        margin-right: 0; }
      ul.cpt-archive-filters > li .svg-icon {
        margin-left: 5px;
        display: inline-flex;
        align-self: center;
        position: relative;
        width: .5em;
        height: .5em; }
        ul.cpt-archive-filters > li .svg-icon svg {
          width: .5em;
          height: .5em;
          fill: #333; }
      ul.cpt-archive-filters > li .cpt-archive-filters__dropdown {
        display: none;
        background: #fff;
        border: 1px solid #dfe3e6;
        z-index: 11;
        -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
        box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1); }
        ul.cpt-archive-filters > li .cpt-archive-filters__dropdown ul {
          margin: 0;
          padding: 15px;
          min-width: 200px; }
          ul.cpt-archive-filters > li .cpt-archive-filters__dropdown ul li {
            list-style-type: none;
            padding-right: 5px;
            position: relative; }
            ul.cpt-archive-filters > li .cpt-archive-filters__dropdown ul li label {
              cursor: pointer; }
        ul.cpt-archive-filters > li .cpt-archive-filters__dropdown.has__checkboxes ul li {
          padding-left: 25px; }
          ul.cpt-archive-filters > li .cpt-archive-filters__dropdown.has__checkboxes ul li input[type="checkbox"] {
            position: absolute;
            left: 0; }
      ul.cpt-archive-filters > li:hover > a {
        color: #53b7b5; }
      ul.cpt-archive-filters > li:hover .cpt-archive-filters__dropdown {
        display: flex;
        position: absolute;
        left: 0; }
      ul.cpt-archive-filters > li x-ul {
        display: none;
        width: 300px;
        margin: 0;
        background: #fff;
        border: 1px solid #dfe3e6;
        -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
        box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1); }
        ul.cpt-archive-filters > li x-ul li {
          list-style-type: none; } }
/* profile scaffolding */
.profile-container {
  display: grid;
  grid-gap: 0px;
  grid-template-columns: auto;
  grid-template-areas: "profile-aside" "profile-content"; }
  .profile-container .profile-sidebar {
    grid-area: profile-aside; }
  .profile-container .profile-content {
    grid-area: profile-content; }

.profile-sidebar {
  background: #454545; }
  .profile-sidebar .profile-picture {
    background: #6db6b5; }
    .profile-sidebar .profile-picture .profile-picture__wrap {
      display: block;
      width: 150px;
      height: 150px;
      margin: 0 auto 2vw auto;
      border-radius: 50%;
      border: 3px solid #bdbdbd;
      overflow: hidden;
      position: relative;
      top: 2vw; }
      .profile-sidebar .profile-picture .profile-picture__wrap img {
        display: block;
        width: 100%;
        height: auto; }
  .profile-sidebar .profile-bio {
    padding: 2vw;
    text-align: center;
    color: #d3d3d3; }
    .profile-sidebar .profile-bio .profile-bio__name {
      font-weight: 600;
      font-size: 1.75rem;
      color: #fff; }
    .profile-sidebar .profile-bio .profile-bio__title {
      font-weight: 400;
      font-size: 1rem;
      margin: 0;
      padding: 0; }
    .profile-sidebar .profile-bio .profile-bio__location {
      font-weight: 400;
      font-size: 1rem;
      margin: 0;
      padding: 0; }
    .profile-sidebar .profile-bio .profile-bio__bio {
      font-weight: 300;
      font-size: 1rem;
      line-height: 1.3;
      margin: 3vw 0;
      padding: 0; }
  .profile-sidebar .profile-bio-edit {
    display: none; }

.profile-content .ibm--card {
  border: none;
  box-shadow: none; }
  .profile-content .ibm--card .ibm--card__body {
    padding: 0; }
  .profile-content .ibm--card .ibm--card__readmore {
    display: none; }
.profile-content .profile-content__filters {
  list-style-type: none;
  display: flex;
  display: none;
  margin: 40px 0;
  padding: 0; }
  .profile-content .profile-content__filters li {
    list-style: none;
    margin-right: 15px; }
    .profile-content .profile-content__filters li a {
      color: #999999;
      padding: 10px 0; }
    .profile-content .profile-content__filters li.active a {
      color: #6db6b5;
      border-bottom: 3px solid #6db6b5; }

@media only screen and (min-width: 900px) {
  .profile-container {
    grid-template-areas: "profile-aside profile-content";
    grid-template-columns: 300px calc(100% - 300px); } }
@media only screen and (min-width: 1024px) {
  .bx--row {
    display: flex; }

  .profile-content__filters {
    display: flex !important; }

  #profile-content-switch {
    display: none !important; } }
.code_search__form .code_search__inputs {
  padding: 2vw 3.5vw;
  background: #3f3f3f; }
  .code_search__form .code_search__inputs .code_search__s {
    background: #716f71;
    display: block;
    padding: 0 1rem 0 0;
    width: calc(90% - 350px);
    width: 100%; }
    .code_search__form .code_search__inputs .code_search__s:after {
      content: "";
      clear: both;
      display: block; }
    .code_search__form .code_search__inputs .code_search__s input {
      border: none;
      background: none;
      color: #fff;
      font-size: 1rem;
      height: 40px;
      font-weight: 300;
      display: block;
      float: left;
      padding-left: 1.5rem;
      width: calc(100% - 40px); }
    .code_search__form .code_search__inputs .code_search__s button {
      border: none;
      background: none;
      width: 40px;
      height: 40px;
      line-height: 40px;
      cursor: pointer; }
      .code_search__form .code_search__inputs .code_search__s button span {
        display: none; }
      .code_search__form .code_search__inputs .code_search__s button svg {
        width: 1rem;
        height: 1rem;
        fill: #62d3d2;
        position: relative;
        top: 2px; }
.code_search__form .code_search__filters {
  padding: 2vw 3.5vw 1vw 3.5vw;
  background: #ffffff; }

body.search-results .cpt-byline__wrap {
  padding-left: 0; }
body.search-results .cpt-content__wrap {
  padding-left: 0; }
body.search-results .code_search_result {
  width: 80%;
  margin-bottom: 3vw; }
  body.search-results .code_search_result .title {
    font-weight: 600;
    font-size: 1.125rem;
    padding: 0;
    margin: 0 0 0.5vw 0; }
    body.search-results .code_search_result .title a {
      color: #37b4b2; }
  body.search-results .code_search_result .excerpt {
    font-size: .8125rem;
    color: #3f3f3f;
    padding: 0;
    margin: 0 0 0.5vw 0; }
  body.search-results .code_search_result .date {
    color: #b1b1b1;
    font-size: .8125rem;
    padding: 0;
    margin: 0; }
  body.search-results .code_search_result .type {
    color: #b1b1b1;
    font-size: .8125rem;
    padding: 0;
    margin: 0; }

body.search.search-results .bx--cloud-header .code_search__form.hsearch {
  display: none !important; }

@media only screen and (min-width: 760px) {
  .code_search__form .code_search__inputs .code_search__s {
    width: calc(90% - 350px); } }
/* general styles */
.code-featured {
  /* margin-bottom: 60px; */
  margin: 0 auto;
  padding: 0 3.5vw !important;
  max-width: 1500px !important; }

.code-featured[class*='fcb'] {
  margin-bottom: 60px; }

.code-featured[class*='fcb'] .fwrap {
  display: grid;
  grid-gap: 0.5vw;
  grid-row-gap: 0.5vw;
  /* repeat(auto-fit, minmax(200px,1fr)); */ }

.code-featured[class*='fcb'] .fblock > .featured_link {
  position: relative;
  display: block;
  height: 100%;
  display: flex;
  color: #fff;
  padding: 2vw;
  overflow: hidden; }

.code-featured[class*='fcb'] .fblock > .featured_link:after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(22, 22, 22, 0.75); }

.code-featured[class*='fcb'] .fblock > .featured_link.noimage:after {
  display: none; }

.code-featured[class*='fcb'] .fblock > .featured_link .fcontent {
  display: inline-block;
  align-self: flex-end;
  position: relative;
  z-index: 100;
  /* margin-right: 7vw; */ }

.code-featured[class*='fcb'] .fblock > .featured_link .fcontent h3 {
  padding: 0;
  font-size: 1.375rem;
  font-weight: 600;
  line-height: 1.4; }

.code-featured[class*='fcb'] .fblock > .featured_link .fcontent p {
  font-weight: 400;
  padding: 0 0 0.5vw 0;
  font-size: .8125rem; }

.code-featured[class*='fcb'] .fblock > .featured_link .fcontent p span {
  font-weight: 600;
  text-transform: uppercase;
  color: #61d4d1; }

.code-featured[class*='fcb'] .fblock > .featured_link .fcontent p.excerpt {
  display: none;
  margin-top: 1.5vw;
  font-size: .9375rem; }

.code-featured[class*='fcb'] .fblock > .featured_link .icon {
  width: 200px;
  height: auto;
  opacity: 0.10;
  position: absolute;
  right: -65px;
  bottom: -65px;
  display: none; }

.code-featured[class*='fcb'] .fblock > .featured_link.noimage .icon {
  display: block; }

/* .code-featured[class*='fcb'] .fblock > .featured_link.noimage .icon svg{
  width: 1em;
  height: 1em;
} */
/* featured 1 display block */
.code-featured.fcb1 .fwrap {
  display: grid;
  height: 100%;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
  /* grid-gap: 1vw 1vw; */
  grid-template-areas: "code_featured_1"; }

.code-featured.fcb1 .fwrap .fc1 {
  grid-area: code_featured_1; }

.code-featured.fcb1 .fblock.fc1 > .featured_link .fcontent h3 {
  font-size: 2.625rem;
  line-height: 1.2; }

.code-featured.fcb1 .fblock.fc1 > .featured_link .fcontent p.excerpt {
  display: block !important; }

.code-featured.fcb1 .fblock.fc1 > .featured_link .icon {
  width: 400px; }

.code-featured.fcb1 [class*='fc'] > a {
  min-height: 375px;
  max-height: 375px;
  height: 375px; }

/* featured 2 display block */
.code-featured.fcb2 .fwrap {
  display: grid;
  height: 100%;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr;
  /* grid-gap: 1vw 1vw; */
  grid-template-areas: "code_featured_1 code_featured_1 code_featured_2"; }

.code-featured.fcb2 .fwrap .fc1 {
  grid-area: code_featured_1; }

.code-featured.fcb2 .fwrap .fc2 {
  grid-area: code_featured_2; }

.code-featured.fcb2 .fwrap .fc1 > a {
  min-height: 375px;
  max-height: 375px;
  height: 375px; }

.code-featured.fcb2 .fblock.fc1 > .featured_link .fcontent p.excerpt,
.code-featured.fcb2 .fblock.fc2 > .featured_link .fcontent p.excerpt {
  display: block !important; }

.code-featured.fcb2 .fblock.fc1 > .featured_link .fcontent h3 {
  font-size: 2.225rem;
  line-height: 1.2; }

.code-featured.fcb2 .fblock.fc2 > .featured_link .fcontent h3 {
  font-size: 2rem;
  line-height: 1.2; }

.code-featured.fcb2 .fblock.fc1 > .featured_link .icon,
.code-featured.fcb2 .fblock.fc2 > .featured_link .icon {
  width: 400px; }

/* featured 3 display block */
.code-featured.fcb3 .fwrap {
  display: grid;
  height: 100%;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  /* grid-gap: 1vw 1vw; */
  grid-template-areas: "code_featured_1 code_featured_1 code_featured_2" "code_featured_1 code_featured_1 code_featured_3"; }

.code-featured.fcb3 .fwrap .fc1 {
  grid-area: code_featured_1; }

.code-featured.fcb3 .fwrap .fc2 {
  grid-area: code_featured_2; }

.code-featured.fcb3 .fwrap .fc3 {
  grid-area: code_featured_3; }

.code-featured.fcb3 .fwrap .fc1 > a {
  min-height: 375px;
  /* max-height: 375px; */
  /* height: 375px; */ }

.code-featured.fcb3 .fblock.fc1 > .featured_link .fcontent p.excerpt {
  display: block !important; }

.code-featured.fcb3 .fblock.fc1 > .featured_link .fcontent h3 {
  font-size: 2.625rem;
  line-height: 1.2; }

.code-featured.fcb3 .fblock.fc1 > .featured_link .icon {
  width: 400px; }

/* featured 4 display block */
.code-featured.fcb4 .fwrap {
  display: grid;
  height: 100%;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  /* grid-gap: 1vw 1vw; */
  grid-template-areas: "code_featured_1 code_featured_2 code_featured_3" "code_featured_1 code_featured_2 code_featured_4"; }

.code-featured.fcb4 .fwrap .fc1 {
  grid-area: code_featured_1; }

.code-featured.fcb4 .fwrap .fc2 {
  grid-area: code_featured_2; }

.code-featured.fcb4 .fwrap .fc3 {
  grid-area: code_featured_3; }

.code-featured.fcb4 .fwrap .fc4 {
  grid-area: code_featured_4; }

.code-featured.fcb4 .fwrap .fc1 > a {
  min-height: 375px;
  /* max-height: 375px; */
  /* height: 375px; */ }

.code-featured.fcb4 .fblock.fc1 > .featured_link .fcontent h3,
.code-featured.fcb4 .fblock.fc2 > .featured_link .fcontent h3 {
  font-size: 2rem;
  line-height: 1.2; }

.code-featured.fcb4 .fblock.fc1 > .featured_link .fcontent p.excerpt,
.code-featured.fcb4 .fblock.fc2 > .featured_link .fcontent p.excerpt {
  display: block !important; }

/* featured 5 display block */
.code-featured.fcb5 .fwrap {
  display: grid;
  height: 100%;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  /* grid-gap: 1vw 1vw; */
  grid-template-areas: "code_featured_1 code_featured_2 code_featured_4" "code_featured_1 code_featured_3 code_featured_5"; }

.code-featured.fcb5 .fwrap .fc1 {
  grid-area: code_featured_1; }

.code-featured.fcb5 .fwrap .fc2 {
  grid-area: code_featured_2; }

.code-featured.fcb5 .fwrap .fc3 {
  grid-area: code_featured_3; }

.code-featured.fcb5 .fwrap .fc4 {
  grid-area: code_featured_4; }

.code-featured.fcb5 .fwrap .fc5 {
  grid-area: code_featured_5; }

.code-featured.fcb5 .fwrap .fc1 > a {
  min-height: 375px;
  /* max-height: 375px; */
  /* height: 375px; */ }

.code-featured.fcb5 .fblock.fc1 > .featured_link .fcontent h3 {
  font-size: 2rem;
  line-height: 1.2; }

.code-featured.fcb5 .fblock.fc1 > .featured_link .fcontent p.excerpt {
  display: block !important; }

/* featured 6 display block */
.code-featured.fcb6 .fwrap {
  display: grid;
  height: 100%;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  /* grid-gap: 1vw 1vw; */
  grid-template-areas: "code_featured_1 code_featured_2 code_featured_3" "code_featured_4 code_featured_5 code_featured_6"; }

.code-featured.fcb6 .fwrap .fc1 {
  grid-area: code_featured_1; }

.code-featured.fcb6 .fwrap .fc2 {
  grid-area: code_featured_2; }

.code-featured.fcb6 .fwrap .fc3 {
  grid-area: code_featured_3; }

.code-featured.fcb6 .fwrap .fc4 {
  grid-area: code_featured_4; }

.code-featured.fcb6 .fwrap .fc5 {
  grid-area: code_featured_5; }

.code-featured.fcb6 .fwrap .fc6 {
  grid-area: code_featured_6; }

.code-featured.fcb6 .fwrap .fc1 > a {
  min-height: 187px;
  max-height: 187px;
  height: 187px; }

/* default styles for the featured blocks based on post type */
.code-featured .featured_ibmcode_articles {
  background: #41a7a5; }

.code-featured .featured_ibmcode_events {
  background: #bb5458; }

.code-featured .featured_post.noimage {
  background: #0d0d0d; }

.code-featured .featured_ibmcode_patterns.noimage {
  background: #0d0d0d; }

.code-featured .featured_ibmcode_patterns.noimage:after {
  display: block !important; }

.code-featured .featured_ibmcode_tutorials {
  background: #3f3f3f; }

.code-featured .featured_ibmcode_tutorials.noimage .icon {
  opacity: .32 !important; }

.code-featured .featured_ibmcode_tutorials.noimage .icon svg {
  fill: #45918e; }

.code-featured .featured_ibmcode_videos {
  background: #72a1b5; }

.code-featured .featured_ibmcode_videos.featured_link:after {
  /* background: rgba(22, 22, 22, 0.2) !important; */
  background: -moz-linear-gradient(top, rgba(22, 22, 22, 0) 0%, rgba(22, 22, 22, 0.75) 70%) !important;
  background: -webkit-linear-gradient(top, rgba(22, 22, 22, 0) 0%, rgba(22, 22, 22, 0.75) 70%) !important;
  background: linear-gradient(to bottom, rgba(22, 22, 22, 0) 0%, rgba(22, 22, 22, 0.75) 70%) !important; }

.code-featured .featured_ibmcode_announce {
  background: #5da06e; }

@media only screen and (max-width: 579px) and (min-width: 0) {
  .code-featured[class*='fcb'] .fwrap {
    display: block !important; }

  .code-featured[class*='fcb'] .fblock {
    margin-bottom: 10px !important; } }
body {
  background: #ffffff;
  overflow-x: hidden; }

.ibm-access {
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px); }