/**
* @file
* nih specific custom CSS.
*/

#navbar-top {
    background: #20558a;
    padding: 0px;
  }

    .l-ribbon .link-wrapper-dpcpsi {
        display: block;
    }

    .l-ribbon-wrapper,
    .l-banner-wrapper,
    .l-navigation-wrapper,
    .l-main-wrapper,
    .l-footer-wrapper {
        padding-left: 0em;
        padding-right: 0em;
    }

    .l-region--utilities,
    .l-region--search {
        float: right;
        clear: right;
    }

    @media (min-width:800px) {
    .l-header {
        height: 145px;
    }
  }

    .tb-megamenu, .tbm {
        background-color: #20558a;
    }

  @media (min-width: 800px) {
    .tb-megamenu .nav>.active>a,
    .tb-megamenu .nav>.active>a:hover,
    .tb-megamenu .nav li.dropdown.active>.dropdown-toggle,
    .tb-megamenu .nav li.dropdown.open.active>.dropdown-toggle,
    .tb-megamenu .nav>li.dropdown.open.active>a:hover,
    .tb-megamenu .nav>li.dropdown.open.active>span.tb-megamenu-no-link:hover {
        background-image: linear-gradient(#012b5b, #092a4d 70%);
        color: #fff;
        border: 5px solid #092a4d;
    }

    .tb-megamenu .nav>li>a,
    .tb-megamenu .nav>li>span.tb-megamenu-no-link {
        font: 1.1em "Droid Sans", Trebuchet MS, Arial, Helvetica, sans-serif;
        border: 5px solid #20558A;
        text-align: center;
        padding: 6px 0px;
    }

    .tb-megamenu .nav>li>span.tb-megamenu-no-link:hover,
    .tb-megamenu .nav>li>a:hover {
        background-image: linear-gradient(#012b5b, #092a4d 70%);
        color: #fff;
        border: 5px solid #092a4d;
    }

    .tb-megamenu .nav>.dropdown.open>a {
        background-color: white !important;
        background-image: none !important;
        color: #a00000 !important;
        text-decoration: underline !important;
        outline: none !important;
        border: 5px solid #a1a1a1 !important;
    }

    .tb-megamenu .nav li.dropdown.active>a::after {
        background: #092a4d;
    }

    .tb-megamenu .nav li.dropdown.open>a::after {
        background: #fff!important;
    }

    .mega-dropdown-inner {
        margin-left: -1px;
    }

    .mega-dropdown-inner li a:hover {
        color: #a00000 !important;
        background: none;
    }

    .mega-align-right .mega-dropdown-inner {
        margin-right: -1px;
    }

    .tb-megamenu-nav li.dropdown>a::after, .tb-megamenu-nav li.dropdown>span.dropdown-toggle::after {
        content: '';
        height: 5px;
        width: auto;
        position: absolute;
        left: 5px;
        right: 5px;
        bottom: 0;
        border: 0px;
        margin: 0px;
        z-index: 999;
        /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ed8034+0,ed8034+33,feb123+33,feb123+66,2184cd+66,2184cd+100 */
        background: #20558A;
        /* Old browsers */
        background: -moz-linear-gradient(left, #20558A 0%, #20558A 100%);
        /* FF3.6-15 */
        background: -webkit-linear-gradient(left, #20558A 0%, #20558A 100%);
        /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to right, #20558A 0%, #20558A 100%);
    }
    .tb-megamenu-nav li.dropdown>a.tb-megamenu-clicked::after, .tb-megamenu-nav li.dropdown.open > .dropdown-toggle::after {
      background: #fff;
    }
  }
    .inline-block-wrapper>* {
        display: inline-block;
    }

    .inline-block-wrapper ul {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding-inline-start: 30px;
    }

    .header-with-icon {
        position: relative;
        padding-left: 0;
    }

    .header-icon--exclamation-mark-white {
        background-image: url(/themes/custom/nih/images/generated/icons-sc634ce7975.png);
        background-position: -96px -87px;
        background-repeat: no-repeat;
        overflow: hidden;
        display: block;
        height: 32px;
        width: 32px;
    }

    .header-icon {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
    }

    .messageforemergencies p:first-child {
        margin-bottom: 0;
    }

    .messageforemergencies,
    .messageforemergencies a {
        color: #fff;
    }

    .messageforemergencies .content {
        background-color: #666;
        padding: 0.5em 1.5em 0.5em 1.5em;
    }

    .flexslider ul.slides {
        background-color: #012d4e;
    }

    .flexslider ul.slides li {
        background-color: #012d4e;
    }

    .l-region--slideshow .flexslider .flex-control-nav,
    .l-region--section-header .flexslider .flex-control-nav {
        background: none;
    }

    .ctct-form-defaults {
        background-color: #E3E3E3 !important;
        border-radius: 0px!important;
    }

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

    .l-footer {
        padding-top: 2em;
    }

    .main-content .node__content {
        margin-top: 0px;
    }

    .data-ai .card {
        min-height: 650px;
    }

    .backlight {
        background-color: #092A4D;
        background-image: url(/sites/default/files/pictures/dark_band_bg.png);
        background-repeat: no-repeat;
        padding-bottom: 50px;
        background-size: cover;
    }

    .darkcard {
        background: rgba(51, 51, 51, 0.7);
        margin: 35px auto;
        height: auto;
        color: white;
    }

    .darkcard h3 {
        color: #87C4FF;
        padding-bottom: 0px;
        margin-bottom: 0px;
    }

    .coding-image {
      padding-bottom: 20px;
    }

    .darkcard a {
      color:white;
      text-decoration: underline;
    }

    .darkcard a:hover {
      color: #87C4FF;
    }



    .btn-primary.calendar {
        color: #ffffff;
        background-color: #092A4D;
        border: none;
    }

    .btn-primary.calendar:hover {
      background-color: #0d6cfd;
      border: none;
      text-decoration: underline;
      color: white;
    }


    .btn-primary.calendar a {
          text-decoration: none;
    }

    .btn-primary.calendar a:hover {
      color: white;
      text-decoration: underline;
    }

  .pull-left.month {
    color: white;
  }

   .sans-serif {
        margin: 0;
        padding: 0;
        font-family: Helvetica, sans-serif;
        border: none;
        font-weight: 600;
        letter-spacing: normal;
    }

    .cards-hover .card-image {
        text-align: center;
    }

    .row.card {
      background-color: #efefef;
    }

    .card-image img {
        width: 100px;
        padding: 10px;
        border-radius: 50%;
        border: 3px solid #fff;
        box-shadow: 3px 3px 6px rgba(0 0 0 / 13%);
        margin: 40px 0 20px 0;
        background-color: #fff;
    }

    .card:hover>.card-image img {
        box-shadow: 3px 3px 6px rgba(0 0 0 / 53%);
    }

    .card-body {
        padding: 15px 30px;
    }

    .card-body.eco {
      border-top: 5px solid #718ca6;
      width: 100%;
      padding: 15px 20px 20px;
      background-color: #efefef;
    }

    .card-body.eco a:hover {
      color: #ffffff;
      text-decoration: none;
    }

    p.card-text {
      font-size: 1rem;
      padding-top: 15px;
    }

    .card2.fhir {
      box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
      text-align: center;
      margin: 0.5rem 0;
      height: auto;
    }

    .card-body.tools a:hover {
      color: #ffffff;
      text-decoration: none;
    }

    .card-body.infa a:hover {
      color: #ffffff;
      text-decoration: none;
    }

h4.card-title {
    margin: 10px;
}

.l-ribbon .link-wrapper-dpcpsi {
    display: block;
}

.l-ribbon-wrapper,
.l-banner-wrapper,
.l-navigation-wrapper,
.l-main-wrapper,
.l-footer-wrapper {
    padding-left: 0em;
    padding-right: 0em;
}

.l-region--utilities,
.l-region--search {
    float: right;
    clear: right;
}

@media (min-width:800px) {
.l-header {
    height: unset;
    margin-bottom:2em;
}
}

.tb-megamenu {
    background-color: #20558a;
}

@media (min-width: 800px) {
.tb-megamenu .nav>.active>a,
.tb-megamenu .nav>.active>a:hover,
.tb-megamenu .nav li.dropdown.active>.dropdown-toggle,
.tb-megamenu .nav li.dropdown.open.active>.dropdown-toggle,
.tb-megamenu .nav>li.dropdown.open.active>a:hover,
.tb-megamenu .nav>li.dropdown.open.active>span.tb-megamenu-no-link:hover {
    background-image: linear-gradient(#012b5b, #092a4d 70%);
    color: #fff;
    border: 5px solid #092a4d;
}

.tb-megamenu .nav>li>a,
.tb-megamenu .nav>li>span.tb-megamenu-no-link, .tbm-item.level-1 {
    font: 1.1em "Droid Sans", Trebuchet MS, Arial, Helvetica, sans-serif;
    /*border: 5px solid #20558A;*/
    text-align: center;
    padding: 0;
}

.tbm-link.level-1 {
  color: #fff;
  justify-content: center;
}

.tbm-link.level-1:hover, .tbm-link.level-1:focus, .tbm-item.level-1.active {
  background-color: #092a4d;
}

.tbm-item.level-2.active a {
 font-weight:600;
}

.tbm-item.level-2 {
  text-align: left;
}

.tb-megamenu .nav>li>span.tb-megamenu-no-link:hover,
.tb-megamenu .nav>li>a:hover {
    background-image: linear-gradient(#012b5b, #092a4d 70%);
    color: #fff;
    border: 5px solid #092a4d;
}

.tb-megamenu .nav>.dropdown.open>a {
    background-color: white !important;
    background-image: none !important;
    color: #a00000 !important;
    text-decoration: underline !important;
    outline: none !important;
    border: 5px solid #a1a1a1 !important;
}

.tb-megamenu .nav li.dropdown.active>a::after {
    background: #092a4d;
}

.tb-megamenu .nav li.dropdown.open>a::after, .tb-megamenu .nav li.dropdown.open> span::after {
    background: #fff!important;
    z-index:9999;
}
.tb-megamenu .nav li.dropdown.open.active a.active-trail {
  font-weight: bold !important;
  color: #333 !important;
  background-image: unset;
  background:#fff!important;
}
.mega-dropdown-inner {
    margin-left: -1px;
}

.mega-dropdown-inner li a:hover {
    color: #a00000 !important;
    background: none;
}

.mega-align-right .mega-dropdown-inner {
    margin-right: -1px;
}
.tb-megamenu-nav, .tbm-nav {
  display:flex;
}
.tb-megamenu-nav > li, .tbm-nav > li {
  float:none;
    flex: 1 1 auto;
}
.tb-megamenu-nav li.dropdown>a::after, .tb-megamenu-nav li.dropdown>span.dropdown-toggle::after {
    content: '';
    height: 5px;
    width: auto;
    position: absolute;
    left: 5px;
    right: 5px;
    bottom: 0;
    border: 0px;
    margin: 0px;
    z-index: 999;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ed8034+0,ed8034+33,feb123+33,feb123+66,2184cd+66,2184cd+100 */
    background: #20558A;
    /* Old browsers */
    background: -moz-linear-gradient(left, #20558A 0%, #20558A 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #20558A 0%, #20558A 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #20558A 0%, #20558A 100%);
}
.tb-megamenu-nav li.dropdown>a.tb-megamenu-clicked::after, .tb-megamenu-nav li.dropdown.open > .dropdown-toggle::after {
  background: #fff;
}
}
.inline-block-wrapper>* {
    display: inline-block;
}

.inline-block-wrapper ul {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-inline-start: 30px;
}

.header-with-icon {
    position: relative;
    padding-left: 0;
}

.header-icon--exclamation-mark-white {
    background-image: url(/themes/custom/nih/images/generated/icons-sc634ce7975.png);
    background-position: -96px -87px;
    background-repeat: no-repeat;
    overflow: hidden;
    display: block;
    height: 32px;
    width: 32px;
}

.header-icon {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}

.messageforemergencies p:first-child {
    margin-bottom: 0;
}

.messageforemergencies,
.messageforemergencies a {
    color: #fff;
}

.messageforemergencies .content {
    background-color: #666;
    padding: 0.5em 1.5em 0.5em 1.5em;
}

.flexslider ul.slides {
    background-color: #012d4e;
}

.flexslider ul.slides li {
    background-color: #012d4e;
}

.l-region--slideshow .flexslider .flex-control-nav,
.l-region--section-header .flexslider .flex-control-nav {
    background: none;
}

.ctct-form-defaults {
    background-color: #E3E3E3 !important;
    border-radius: 0px!important;
}

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

.l-footer {
    padding-top: 2em;
}

.main-content .node__content {
    margin-top: 0px;
}

/*
.row.cards {
    display: flex;
    flex-flow: column;
    margin-right: 15px;
    margin-left: 15px;
}
*/
.card {
padding:1em;
margin-bottom:1em;
}
.cards-hover .card {
   padding: 0;
margin: 7px 0px;
background-color: #efefef;
border-top: 5px solid #718ca6;
box-shadow: 3px 3px 6px rgba(0 0 0 / 13%);
transition: all .3s ease;
position: relative;
flex-shrink: unset;
}
@media (min-width: 768px) {
  .cards-hover .card {
    margin: 7px 15px;
  }
}
.data-ai .card {
    min-height: 650px;
}

.cards-hover .card:hover {
    background-color: #718ca6;
    box-shadow: 3px 3px 6px rgba(0 0 0 / 0%);
    transition: all .3s ease;
}
.green .card {
  border-top: 5px solid #7A905D;
}
.green .card:hover {
  background-color: #7A905D;
}
.teal .card {
  border-top: 5px solid #64acb5;
}
.teal .card:hover {
  background-color: #64acb5;
}
.purple .card {
  border-top: 5px solid #a87db0;
}
.purple .card:hover {
  background-color: #a87db0;
}
.blue .card {
  border-top: 5px solid #0A5C8B;
}
.blue .card:hover {
  background-color: #0A5C8B;
}

.backlight {
background-color:#092A4D;
background-image: url("/sites/default/files/pictures/dark_band_bg.png");
background-repeat: no-repeat;
background-size: cover;
}

.darkcard {
background: rgba(51, 51, 51, 0.7);
color: #fff;
margin: 35px auto;
height: 400px;
overflow: visible;
}

.darkcard h3 {
color: #87C4FF;
padding-bottom: 0px;
margin-bottom: 0px;
}

.darkcard h4 {
color: #ffffff;
font-size: 20px;
}

.darkcard h5 {
color: #87C4FF;
font-size: 18px;
font-weight: bold;
}

.darkcard p {
color: #ffffff;
font-size: 16px;
}

.darkcard a {
color: #ffffff;
text-decoration: underline;
}

.darkcard a:hover {
color: #87C4FF;
text-decoration: underline;
}

.sans-serif {
    margin: 0;
    padding: 0;
    font-family: Helvetica, sans-serif;
    border: none;
    font-weight: 600;
    letter-spacing: normal;
}

.cards-hover .card-image {
    text-align: center;
}

.cards-hover .card-image img {
    width: 100px;
    padding: 10px;
    border-radius: 50%;
    border: 3px solid #fff;
    box-shadow: 3px 3px 6px rgba(0 0 0 / 13%);
    margin: 40px 0 20px 0;
    background-color: #fff;
}

.cards-hover .card:hover>.card-body h2 a,
.cards-hover .card:hover>.card-body p {
    color: #fff;
}

.cards-hover .card:hover>.card-image img {
    box-shadow: 3px 3px 6px rgba(0 0 0 / 53%);
}

.cards-hover .card-body {
    padding: 15px 30px 50px;
    margin-bottom: 40px;
}

.cards-hover .card-body h2 {
    font-family: Helvetica, sans-serif;
    margin: 0;
    text-align: center;
    font-size: 1.4em;
    text-align: center;
    font-weight: 600;
    letter-spacing: normal;
}

.cards-hover .card-body p {
    font-size: 1rem;
    margin-bottom: 1.2em!important;
    margin-top: 1.2rem;
}

.data-landing p {
    margin-bottom: 1.2em!important;
    margin-top: 1.2rem;
}

a.stretched-link {
    color: #5a5245;
}

a.stretched-link:hover {
    text-decoration: none;
}

a.stretched-link::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    pointer-events: auto;
    content: "";
    background-color: rgba(0, 0, 0, 0);
}

h2.sans-serif {
    color: #A34A43;
}

h1.title {
    background-color: #092a4d;
    color: #FFF;
    font-family: "Droid Sans", Trebuchet MS, Arial, Helvetica, sans-serif !important;
    font-weight: 400;
    text-rendering: optimizelegibility;
    border: none;
    letter-spacing: .2rem;
    margin: 0;
    line-height: normal;
    margin: 0;
    padding: 0.2em;
    padding-left: 1.9rem;
    font-size: 1.3rem;
    padding-top: 30px;
    padding-bottom: 30px;
}

.breadcrumb {
    padding-left: 30px;
    background: #f6f9f9;
    font: 0.8em/1.5em "Droid Sans", Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #030D19;
}

.breadcrumb a {
    color: #030D19;
}

.breadcrumb-item.active {
    padding-left: 0;
    color: #030D19;
}

.breadcrumb-item.active:before {
    padding-left: 0;
    padding-right: 5px;
}

.breadcrumb .breadcrumb-item {
    float: left;
    padding-right: 5px;
}

.tb-megamenu .dropdown-menu {
    border-bottom: 0px;
}

@media (min-width: 800px) {
.mega-dropdown-inner .tb-megamenu-row {
    border: 5px solid #a1a1a1;
    -moz-box-shadow: 0 5px 1 0 rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0 5px 1 0 rgba(0, 0, 0, 0.3);
    box-shadow: 0 5px 1 0 rgba(0, 0, 0, 0.3);
    background-color: white;
    float: left;
    padding: 1.5em;
    padding-bottom: 0.75em;
    padding-top: 0.9em;
    position: relative;
    z-index: 100;
    padding-right: -8px;
    margin-top: -5px;
}
}
.profile {
    box-shadow: -8px -8px #20558a;
    margin-bottom: 35px;
}

.page-node-3348 .collapsible-content {
    background-color: aliceblue;
    box-shadow: 8px 8px #20558a;
    padding: 5px 10px 5px 10px;
    margin-bottom: 3em;
    margin-right: 1.5em;
}

.group-right.block-views {
    float: left;
    width: 50%;
    background-color: #f2f2ed;
    padding-left: 1em;
    padding-right: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    border-radius: 5px 0px 0px 5px;
    clear: right;
}

.group-left.block-views .row,
.group-right.block-views .row {
    margin-left: -11px;
    margin-right: -11px;
}

.group-left.block-views h2,
.group-right.block-views h2 {
    letter-spacing: -0.02em;
    text-rendering: optimizelegibility;
    color: #A34A43;
    margin-top: 15px;
    border-bottom: 0;
    margin-bottom: 10px;
    font-size: 1.4rem;
    font-weight: 400;
    font-family: "Droid Sans", Trebuchet MS, Arial, Helvetica, sans-serif!important;
}

.group-right.block-views .teaser {
    width: 100%;
    float: left;
    float: none;
    margin-bottom: 1em;
}

.group-right.block-views .views-field-field-image {
    width: 30px;
    float: left;
    margin-right: 1.52672%;
    height: 30px;
    background: #ccc;
}

.group-right.block-views .views-field-title a,
.group-right.block-views .teaser-description {
    width: 91.45038%;
    float: right;
    margin-right: 0;
    font: 400 16px "Droid Sans", Trebuchet MS, Arial, Helvetica, sans-serif;
}

.group-right.block-views .views-field-title a {
    color: #004fba;
}

.group-left.block-views {
    clear: both;
    float: left;
    width: 50%;
    padding-right: 2em;
    background-color: #f6f9f9;
    padding-top: 10px;
    min-height: 368px;
    padding-left: 20px;
}

.group-left.block-views .view-content {
    margin-bottom: 20px;
}

.more-link a {
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background-color: #20558a;
    border: none;
    color: #fff;
    display: inline-block;
    position: relative;
    text-decoration: none;
    font-size: 14px!important;
    padding: 3px 20px;
    margin-left: 0px;
}

.data-ecosystem-grid {
  margin-top: 30px;
  margin-bottom: 30px;
}

@media (max-width: 767px) {
    .col-xs-5 {
        clear: left;
    }
}

@media (min-width: 768px) and (max-width: 992px) {
    .col-sm-3 {
        clear: left;
    }
}

@media (max-width: 992px) {
    .collapsible-content {
        margin-right: 0px;
    }
}

@media (min-width: 992px) {
    .row.cards {
        display: flex;
        flex-flow: row;
        margin: 30px 0;
    }
}

@media (min-width: 1200px) {
    .container {
        width: 1200px;
    }
}
