/* ---------------------- GENERAL ---------------------- */

body {
    background-image: linear-gradient(45deg, #23303D, #2c3e50);
}

a:hover {
    text-decoration: underline;
}

b, strong {
    font-weight: bold;
}

body.eui-layout button, body.eui-layout [type=button] {
    -webkit-appearance: unset;
    -moz-appearance: unset;
}
.eui-badge--sm, .eui-badge--md {
  font-weight: 400;
}

/* ---------------------- JUMBOTRON ---------------------- */
.carousel {
    min-height: 700px;
    max-height: 700px;
}

.carousel-inner {
    max-height: 700px;
}

.carousel-caption {
    background-color: rgba(19, 39, 65, 0.534);
    text-align: left;
    left: 0 !important;
    bottom: 0 !important;
    padding-bottom: 0 !important;
    padding-top: 10px !important;
    margin-bottom: 0 !important;
}

.carousel-caption-inner {
    min-height: 125px;
    text-align: left;
    padding-left: 20px;
    padding-top: 10px;
}

.carousel-image {
    height: 700px;
    object-fit: cover;
}

.bg-article.container {
    background: url("../images/MicroArticles.png") no-repeat center top;
    background-size: cover;
    min-height: 20vh;
}

.bg-recipe.container {
    background: url("../images/DataELearning.png") no-repeat center top;
    background-size: cover;
    min-height: 20vh;
}

.bg-outreach.container {
    background: url("../images/OutreachMaterials.png") no-repeat center top;
    background-size: cover;
    min-height: 20vh;
}

.access-data-recipe {
    color: white;
    background: linear-gradient(to bottom, rgba(29, 96, 138, 0.99), rgba(0, 0, 0, 0));
    padding-left: 50px;
    padding-right: 50px;
}

.jumbo {
    padding: 0;
}

.eui-point {
    left: 7%;
    top: 53%;
}

.callout-content h3 {
    margin: 0.25em 0;
}

.callout-content h4 {
    margin: 0;
}

.access-data {
    color: white;
}

.wrap {
    display: flex;
    flex: 1 100%;
    padding: 0 2em;
}

.box {
    flex: 1 auto;
    padding: 1em;
}

.box-buttons {
    align-items: center;
    flex: 2 auto;

    /* browser-specific */
    display: -webkit-flex;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
}

.box-buttons > a {
    margin: 0.25em;
    width: fit-content;
    padding: 0.5em 1.1em;
}

/* ---------------------- CONTENT ---------------------- */
.content {
    width: 95%;
    margin: auto;
    color: inherit;
}

.content a {
    color: #7ab5da;
}

.content a:hover {
    color: #418196;
}

.eui-layout .content .breadcrumb {
    background-color: rgba(0, 0, 0, 0.25);
}

.eui-layout .content .breadcrumb .active {
    color: #ababab;
}

.eui-layout .content .eui-accordion__header {
    border-bottom: 5px solid #1A2F3E;
}

#publications > tbody > tr > td.citation {
    text-indent: -1.5em;
    padding: 8px 24px;
}

body.eui-layout section.content button.eui-btn--green {
 background-color: #22867B;
 font-weight: lighter;
}

body.eui-layout section.content button.eui-btn--green:hover {
 background-color: #035D53;
}

body.eui-layout section.content .eui-badge--md {
 background-color: #418196;

}

body.eui-layout section.content .eui-badge--green {
    background-color: #22867B;
}

body.eui-layout header.masthead {
  background-image: linear-gradient(to bottom, #23303D, #2c3e50);
}

ul, #ek-el {
  list-style-type: none;
}

#ek-el {
  margin: 0;
  padding: 0;
}

.caret {
  cursor: pointer;
  user-select: none;
}

.caret::before {
  content: "\25B6";
  color: black;
  display: inline-block;
  margin-right: 6px;
}

.caret-down::before {
  transform: rotate(90deg);
}

#ek-el .nested {
  display: none;
}

#ek-el .active {
  display: block;
}

/* ---------------------- DATATABLES ---------------------- */
.eui-layout .content .dataTables_wrapper {
    color: #dedede;
}

.eui-layout .content .content-block .dataTables_wrapper {
    color: #333;
}

.eui-layout .content .dataTables_wrapper th {
    background-color: #1B2833;
    border: 0.1em solid #283848;
    color: #dedede; 
    font-size: larger;
    font-weight: 400;
}

.eui-layout .content .dataTables_wrapper tbody td {
    background-color: #2c3e50;
    border: 0.1em solid #283848;
    color: #dedede;
}

.dataTables_length label select.custom-select.form-control-sm {
    height: 2.5rem;
}

.eui-layout .content .dataTables_wrapper .dataTables_filter {
    width: 50%;
    float: right;
}

.eui-layout .content .dataTables_wrapper .dataTables_filter label {
    display: flex;
    flex: 1 1 auto;
}

.eui-layout .content .dataTables_wrapper .dataTables_filter label input {
    display: flex;
    flex: 2 1 auto;
}

.eui-layout .content .dataTables_wrapper .dataTables_info,
.eui-layout .content .dataTables_wrapper li:not(.disabled) {
    color: inherit !important;
}


.eui-layout .content .dataTables_wrapper li:not(.disabled) {
    color: inherit !important;
}


.eui-layout .content .dataTables_wrapper li:not(.disabled) a {
    border: none;
    color: inherit !important;
}

.eui-layout .content .dataTables_wrapper a {
    color: #7ab5da;
}

.eui-layout .content .dataTables_wrapper a:hover {
    color: #418196;
}

.eui-layout .content .dataTables_wrapper li.paginate_button:not(.disabled) a {
    color: #323232 !important;
}
.eui-layout .content .dataTables_wrapper li.paginate_button.active a {
    background: linear-gradient(to bottom, #2276ac 0%, #33688A 100%);
    color: white !important;
}

.eui-layout .content .dataTables_wrapper li.paginate_button.disabled a {
    border: none;
    color: #ababab;
}
.eui-layout .content .dataTables_wrapper li.paginate_button:not(.disabled) a:hover {
    background: linear-gradient(to bottom, #33688A 0%, #335972 100%);
    color: white !important;
}

.eui-layout .content .dataTables_wrapper .dataTables_filter {
    width: 40rem;
    float: left;
}

.dataTables_wrapper .dataTables_paginate .pagination {
	margin: 2px 0;
	white-space: nowrap;
    float: right;
}

.dataTables_filter {
    color: white;
    float: left;
}

.dataTables_filter label {
    color: white;
}

.dataTables_info {
    color: white;
    float: left;
}

.tooltip-inner {
    max-width: 350px;
}

#news-card {
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

#article-card {
    display: table-cell;
}

#eui-bullet {
    display: table-cell;
    position: relative;
    top: 70px;
}

#eui-bullet-card {
    display: table-cell;
}

.eui-fa-align-left {
    background: #95a5a6;
    width: 4em; text-align:
    center; color: white;
    width: 4em; height: 4em;
    border-radius: 50%;
    padding: 20px;
}
/* ---------------------- CONTENT BLOCKS ---------------------- */
body.eui-layout section.content .content-block {
    background-color: #dedede;
    color: #333;
    box-shadow: 0 0.2em 0.2em rgba(0, 0, 0, 0.75);
    margin-top: 2em;
}

.content-block h1 {
    color: inherit;
}


.content-block h1.project-title {
    text-align: center;
}

.content-block a {
    color: #177392;
}

.content-block a:hover {
    color: #185B71;
}

.collections-list td.project {
    width: 10%;
}

.clear-both {
    clear: both;
}

.eui-badge--sm.discipline {
    text-transform: none;
}

.eui-badge--sm.discipline#Aerosols {
    background-color: #62B3AA;
}

.eui-badge--sm.discipline#Clouds {
    background-color: #7C90B5;
}

.eui-badge--sm.discipline#Radiation\ Budget {
    background-color: #D89F37;
}

.eui-badge--sm.discipline#Tropospheric\ Composition {
    background-color: #177392;
}

.eui-badge--sm .discipline#Field\ Campaigns {
    background-color: #22867B;
}

.eui-badge--sm.discipline#MEaSUREs {
    background-color: #2F518F;
}

.content-block h3 {
    font-weight: lighter;
}

.spatial-container {
    background: #28495c;
    position: relative;
    width: 100%;
    max-width: 300px;
}

.image {
    display: block;
    width: 100%;
    height: auto;
    padding: 0px;
    border: 1px solid #bcbcbc;
}

.project-logo {
    max-height: 100px;
}

.overlay {
    position: absolute;
}

.overlay-pin {
    text-indent: -0.5em;
    vertical-align: bottom;
    color: rgb(38, 111, 135);
}

.content-block .toggle-extended-content {
    border-radius: 3px;
    margin-bottom: -25px;
    width: 20%;
    background: linear-gradient(to bottom, #135a72, #0e5066);
     color: #7aa1b0;

}

.content-block .toggle-extended-content:hover {
    background: linear-gradient(to bottom, #135a72, #06475D);
}

.content-block .toggle-extended-content a i {
    color: #7aa1b0;
    opacity: 0.7;
}

.content-block .toggle-extended-content a i:hover {
    opacity: 1;
}

.content-block .card-columns {
    column-count: 1;
    -webkit-column-count: 1;
    -moz-column-count: 1;
}

.content-block .card .card-header {
    background-color: #177392;
    padding: 0px;
    color: white;
    display: inline-flex;
    width: 100%;
}

.content-block .card .card-header .card-badge {
    background-color: #185B71;
    padding: 1em;
    flex: 1 1 1;
    height: 100%;
}

.eui-layout .content .content-block .nav-link.badge-dropdown-item:hover,
.eui-layout .content .content-block .badge-dropdown .nav-item.show .badge-dropdown-item {
    background-color: #0C3745;
}

.content-block .card .top-left {
    border-top-left-radius: 3px;
    float: left;
    text-align: start;
}
.content-block .card .top-right {
    border-top-right-radius: 3px;
    float: right;
    text-align: end;
}
.content-block .card .bottom-left {
    border-bottom-left-radius: 3px;
    float: left;
    text-align: start;
}
.content-block .card .bottom-right {
    border-bottom-right-radius: 3px;
    float: right;
    text-align: end;
}

.content-block .card .card-header .card-header-title {
    padding: 0.5em;
    margin-bottom: 0px;
    font-weight: lighter;
    flex: 3 4 auto;
}

.eui-layout .content .content-block#keywordsContainer {
    padding-top: 0px;
}

.eui-layout .content .content-block#imageryContainer {
    padding-top: 0px;
}

.eui-layout .content .content-block #sk-ul {
    padding: 0px;
}

.eui-layout .content .content-block #sk-ul #sk-category {
    background-color: #0C303C;
}

.eui-layout .content .content-block #sk-ul #sk-category:after {
    border-left: 10px solid #0C303C;
}

.eui-layout .content .content-block #sk-ul #sk-topic {
    background-color: #0C3745;
}

.eui-layout .content .content-block #sk-ul #sk-topic:after {
    border-left: 10px solid #0C3745;
}

.eui-layout .content .content-block #sk-ul #sk-term {
    background-color: #0F4455;
}

.eui-layout .content .content-block #sk-ul #sk-term:after {
    border-left: 10px solid #0F4455;
}

.eui-layout .content .content-block #sk-ul #sk-variable-level-1 {
    background-color: #145165;
}

.eui-layout .content .content-block #sk-ul #sk-variable-level-1:after {
    border-left: 10px solid #145165;
}

.eui-layout .content .content-block #sk-ul #sk-variable-level-2 {
    background-color: #185B71;
}

.eui-layout .content .content-block #sk-ul #sk-variable-level-2:after {
    border-left: 10px solid #185B71;
}

.eui-layout .content .content-block #sk-ul #sk-variable-level-3 {
    background-color: #177392;
}

.eui-layout .content .content-block #sk-ul #sk-variable-level-3:after {
    border-left: 10px solid #177392;
}

.eui-layout .content .content-block div.citation {
    text-indent: -1.5em;
    padding: 8px 24px;
    color: inherit;
}

/* ---------------------- TABS ---------------------- */

.eui-layout .content .content-block .nav-item i {
    padding-top: 0.1em;
    padding-bottom: 0.1em;
}

body.eui-layout section.content div.content-block .nav-link:not(.disabled) {
    color: inherit;
}

body.eui-layout section.content div.content-block .nav:not(.badge-dropdown) {
    color: inherit;
    padding: 0.5em 0 0;
    border-bottom: 1px solid #bcbcbc;
    margin-bottom: 0.5em;
}

body.eui-layout section.content div.content-block .nav-link.disabled:not(.badge-dropdown-item) {
    color: #898989;

}

body.eui-layout section.content div.content-block .nav-link:not(.disabled):not(.badge-dropdown-item):hover {
    background-color: #cdcdcd;
    border: 1px solid #cccccc;
}

body.eui-layout section.content div.content-block .nav-link.active:not(.badge-dropdown-item) {
    background-color: #bcbcbc;
    border: 1px solid #bbbbbb;
}

body.eui-layout section.content div.content-block .nav-link.active:not(.badge-dropdown-item) h3 {
    font-weight: 400;
}
/*-------------- TOOLS page ------------*/

.btn-asdc-tools {
  background-color: #dedede;
  color: #464646;
  padding: 12px 16px;
  cursor: pointer;
  border-bottom: 5px solid #cdcdcd;
}

.btn-asdc-tools:hover {
  background-color: #efefef;
  border-bottom-color: #dedede;
  color: #323232;
  transition: color .1s linear;
}

.btn-asdc-tools:active {
  background-color: #cdcdcd;
  border-bottom-color: #ababab;
}

.flex-container {
  padding: 0;
  margin: 0;
  list-style: none;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-flow: row wrap;
  justify-content: flex-start;
}

.flex-item {
  padding: 5px;
  color: white;
  font-weight: bold;
  font-size: 1em;
  text-align: center;
}

.card.filter h6.capabilities span:hover {
  color: #323232;
  transition: color .2s linear;
}

.toolset {
    /* background: linear-gradient(
        to bottom, 
        rgba(23, 115, 146, .4), 
        rgba(23, 115, 146, 0)
    ); */
    background-color: rgba(23, 115, 146, .4);
}

/* ---------------------- FONTS ---------------------- */

.font-raleway {
    font-family: 'Raleway', sans-serif;
}

.font-raleway-200 {
    font-family: 'Raleway', sans-serif;
    font-weight: 200;
}

.font-source-sans {
    font-family: 'Source Sans Pro', sans-serif;
}

.font-source-sans-bold {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: bold;
}

.font-source-sans-ital {
    font-family: 'Source Sans Pro', sans-serif;
    font-style: italic;
}

.font-plex-mono {
    font-family: 'IBM Plex Mono', monospace;
}

.font-plex-mono-300 {
    font-family: 'IBM Plex Mono', monospace;
    font-weight: 300;
}

.project-list {
    height: 20rem;
}