.c-card-wrapper.active {
    opacity: 1 !important;
    transition: all 0.8s ease-in-out;
}

.c-card-wrapper.card-hidden {
    opacity: 0;
    transition: all 0.8s ease-in-out;
}

.c-card-wrapper.subscribe {
    margin: 0 0 30px 0;
}

.archive-list {
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
}

.archive-list {
    display: flex;
    justify-content: space-between;
    flex-flow: row wrap;
}

.archive-list .c-card-wrapper {
    display: flex;
    flex-direction: column;
    background-color: #fff;
    box-shadow: 4px 12px 40px rgba(66, 94, 165, 0.1);
    border-radius: 10px;
    overflow: hidden;
    max-width: 350px;
    width: 100%;
    height: 406px;
    position: relative;
    margin: 0 0 35px 0;
}

.archive-list .c-card-wrapper .img {
    height: 176px;
    min-height: 176px;
}

.archive-list .c-card-wrapper .content {
    padding: 24px 16px 85px 16px;
    background-color: #fff;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 230px;
    transition: all 0.2s linear;
}

.archive-list .c-card-wrapper:hover .content {
    height: 100%;
    transition: all 0.2s linear;
}

.archive-list .c-card-wrapper .title {
    font-weight: 700;
    font-size: 20px;
    line-height: 28px;
    min-height: 87px;
    color: #000000;
    margin: 0 0 24px 0;
}

.archive-list .c-card-wrapper .text {
    display: block;
    font-weight: 300;
    font-size: 16px;
    line-height: 22px;
   color: #000000;
}


/* .archive-list .c-card-wrapper:hover .text {
    display: block;
} */

.archive-list .c-card-wrapper .link {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50px;
    padding: 0 16px;
    background-color: #fff;
}

.archive-list .c-card-wrapper .link span {
    font-weight: normal;
    font-size: 16px;
    line-height: 32px;
    color: #2671FF;
}

.archive-list .c-card-wrapper .info {
    display: flex;
    flex-direction: row;
    justify-content: start;
    margin: 0 0 23px 0;
}

.archive-list .c-card-wrapper .info .type {
    font-weight: bold;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
}

.archive-list .c-card-wrapper .info .time {
    font-weight: 300;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
}

.archive-list .c-card-wrapper .info .separator {
    height: 17px;
    width: 1px;
    background-color: #000000;
    margin: 0 10px;
}

.archive-list .subscribe .card {
    position: relative;
    display: flex;
    width: 100%;
    height: 100%;
}
/*.archive-list .subscribe .card {
    border: 0;
}*/
.archive-list .bg-wrapper {
/*    display: none;*/
    width: 100%;
    height: 100%;
    background-color: #fff;
    background: linear-gradient( 56.87deg, #269AFF -5.22%, #2671FF 40.13%, #2660F7 71.26%, #2652F2 92.09%); 
     box-shadow: 0px 4px 20px #eaeaea; 
}

.archive-list .subscribe-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    padding: 30px;
}

.archive-list .subscribe .card .subscribe-wrapper h3 {
    color: #000000;
    color: #ffffff;
    font-weight: 700;
    font-display: swap;
    font-size: 20px;
    line-height: 26px;
    margin-bottom: 14px;
    text-align: center;
}

.archive-list .subscribe .card .subscribe-wrapper p {
    font-size: 16px;
    line-height: 1.5;
    margin-bottom: 14px;
    text-align: center;
/*    color: #000000;*/
/*    padding: 15px 0;*/
}
/*.archive-list .subscribe-wrapper .button-wrapper {
    align-items: center;
    justify-content: center;
}
.archive-list .subscribe-wrapper .button-wrapper a {
    display: flex;
    justify-content: center;
    align-self: center;
    cursor: pointer;
    background-color: #2671FF;
    height: 48px;
    line-height: 48px;
    padding: 0 24px;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    border-radius: 8px;
    opacity: 1;
    transition: 0.2s ease-in-out;
    min-width: 176px;
}
.archive-list .subscribe-wrapper {
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
}*/
.archive-list .subscribe .card .subscribe-wrapper form p {
    text-align: left;
    font-size: 12px;
    line-height: 16px;
}

#loading-resources {
    display: block;
    width: 100%;
    height: 400px;
    background-image: url(https://res.cloudinary.com/anodot/image/upload/v1549297038/img/loading.svg);
    background-repeat: no-repeat;
    background-position: center center;
}


/* FILTERS */

.filters .filter-group.filter-group-tabs a {
    font-display: swap;
    height: 56px;
    line-height: 56px;
    font-weight: 500;
    font-size: 15px;
    padding: 0;
    margin: 2px 8px 2px 5px;
    color: #353d46;
    position: relative;
}

.filters .filter-group.filter-group-tabs a.toggle,
.filters .filter-group.filter-group-tabs a.active {
    color: #2671FF;
    font-weight: bold;
}

.filters .filter-group.filter-group-tabs a.toggle:after,
.filters .filter-group.filter-group-tabs a.active:after,
.filters .filter-group.filter-group-tabs a:active:after {
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    background-color: #2671FF;
    position: absolute;
    bottom: 5px;
    left: 0;
}

.filters .filter-group {
    width: 100%;
}

.page-template-jobs .active-item-name::after,
#tag-filter-name::after,
#resources-filter-name::after,
#verticals-filter-name::after {
    content: " ";
    position: absolute;
    top: 12px;
    top: 21px;
    right: 14px;
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 0.255em;
    vertical-align: 0.255em;
    border-top: 1px solid #353d47;
    border-right: 1px solid #353d47;
    border-bottom: 0;
    border-left: 0;
    transform: rotate( 135deg);
    width: 10px;
    height: 10px;
    transition: transform 0.2s ease-in-out;
}

.page-template-jobs [aria-expanded="true"] .active-item-name::after,
[aria-expanded="true"] #tag-filter-name::after,
[aria-expanded="true"] #resources-filter-name::after,
[aria-expanded="true"] #verticals-filter-name::after {
    transform: rotate( 315deg);
    transition: transform 0.2s ease-in-out;
    top: 25px;
}


/* END FILTERS */

.c-card-wrapper .img.img-wrapper {
    padding: 25px;
}

.c-card-wrapper .img-inner {
    border: 1px solid #c7c7c7;
    border-radius: 12px;
    padding: 15px 55px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 100%;
}

.c-card-wrapper .img-inner img {
    display: block;
    object-fit: contain;
    width: 100%;
    height: 100%;
}

#search-filter-pane .row {
    /* max-width: 1050px; */
    margin: auto;
}

#search-filter-pane .filter-group-tabs .tab-button {
    font-weight: bold;
    font-size: 14px;
    line-height: 25px;
    display: flex;
    align-items: center;
    text-align: center;
    text-transform: uppercase;
    color: #353D46;
    margin: 0 20px;
    position: relative;
}

#search-filter-pane .filter-group-tabs .tab-button.active:after,
#search-filter-pane .filter-group-tabs .tab-button:hover:after {
    content: " ";
    position: absolute;
    bottom: -10px;
    left: 0;
    display: block;
    width: 100%;
    height: 6px;
    opacity: 0.24;
    background-color: #353D46;
}

#search-filter-pane .filter-group-tabs .tab-button.active:after {
    opacity: 1;
}
#resource-main-title-mobile {
    display: none;
}
@media (max-width: 1168px) {
    .archive-list,
    #main-resource-inner,
    #resource-main-title-inner {
        padding: 0 24px;
        max-width: none;
    }
    .archive-list .c-card-wrapper {
        max-width: 31%;
    }
}
@media (max-width: 992px) {
    body.sticky {
        padding: 63px 0 0;
    }
    #pin {
        top: 63px!important;
    }
    #main-resource-section.hide-mobile {
        display: none!important;
    }
    #main-resource-section .featured-image-wrapper {
        position: relative;
        height: 200px;
    }
    #main-resource-section .featured-image-wrapper img {
        height: 100%;
        width: auto;
        display: block;
        position: absolute;
        top: 0;
        left: 50%;
    }
    #main-resource-section .main-resource-info {
        color: #353d46;
        height: calc(100% - 200px);
        display: flex;
        flex-direction: column;
        padding: 24px 32px;
    }
    #main-resource-section .main-resource-info h6 {
        font-size: 14px;
        font-weight: 400;
        margin: 0 0 16px 0!important;
    }
    #main-resource-section .main-resource-info h2 {
        font-size: 20px;
    }
    #main-resource-section .blogpost-author {
        margin-top: 16px!important;
    }
    #main-resource-section .blogpost-author .author-image .avatar {
        width: auto;
        height: 30px;
        display: block;
        border-radius: 30px;
        /* box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); */
    }
    #main-resource-section .blogpost-author .author-name {
        float: left;
        height: 30px;
        line-height: 30px;
        margin-left: 10px;
        font-size: 14px;
    }
    #main-resource-section .featured-image-wrapper img.resize-height {
        width: 100%;
        max-width: none !important;
        max-height: none !important;
        height: auto;
        position: static!important;
        margin-left: 0!important;
    }
    .archive-list .c-card-wrapper {
        max-width: 48%;
    }
}

@media (max-width: 768px) {
    #resource-main-title-mobile {
        display: block;
        padding: 48px 0;
    }
    #resource-main-title-mobile .title {
        font-size: 24px;
        line-height: 32px;
        font-weight: 700;
    }
    .archive-list .c-card-wrapper {
        max-width: none;
    }
    #resource-main-title.simple {
        background-color: transparent;
        padding: 48px 0
    }
    #resource-main-title.mobile-filters {
        background-color: #2671FF;
        padding: 16px 0;
    }
    #resource-main-title.mobile-filters .archive-main-title {
        color: #fff;
        font-size: 20px;
        line-height: 42px;
        margin-bottom: 0!important;
        padding: 0!important;
        font-weight: 500;
        /* text-transform: uppercase; */
        display: inline-block;
        text-align: left;
    }
    #main-resource {
        max-width: 460px;
        margin: 90px auto 90px auto;
    }



    #main-resource .main-resource-info {
        padding: 35px 39px;
    }
    #main-resource .featured-image-wrapper img {
        max-height: 214px;
    }
    #resource-main-title.mobile-filters .title {
        color: #fff;
        font-size: 20px;
        line-height: 42px;
        margin-bottom: 0!important;
        padding: 0!important;
        font-weight: 500;
        display: inline-block;
        text-align: left;
        float: left;
    }
    #resource-main-title #search-filter-toggle {
        font-size: 14px;
        color: #6d6d6d;
        background-color: #fff;
        border-color: #ececec;
        border: 1px solid rgba(0, 0, 0, .15);
        padding: 0.375rem 2.25rem;
        height: 42px;
        line-height: 30px;
        float: right;
    }
    #resource-main-title-inner {}
    #resource-main-title-inner,
    .archive-list {
        max-width: 540px;
        padding: 0 24px;
        margin: 0 auto;
    }
    #search-filter-pane .container,
    #search-filter-pane .row {
        padding: 0 !important;
        margin: 0!important
    }
    #apply-filters-btn-wrapper {
        position: absolute;
        width: 100%;
        height: 82px;
        bottom: 0;
        left: 0;
    }
    #apply-filters-btn-use-cases,
    #apply-filters-btn {
        margin: 20px auto;
        display: block;
        width: 240px;
        height: 40px;
        background-color: #2671FF;
        color: #fff;
        border-radius: 20px;
        line-height: 38px;
        text-align: center;
        cursor: pointer;
    }
    #search-filter-pane {
        height: 100%;
    }
    #search-filter-pane .container {
        width: 100%;
        min-width: 100%;
    }
    #search-filter-pane .filter-group.search {
        width: 100%;
    }
    #search-filter-pane.active {
        top: 0px;
        display: block;
    }
    #search-filter-pane {
        position: fixed;
        width: 100%;
        /* height: calc(100% - 86px); */
        height: 100%;
        top: 100%;
        left: 0;
        z-index: 99999;
        background-color: #fff;
        transition: top 0.5s ease-in-out;
    }
}

.post-type-archive-use-cases .resource-box-item.d-flex {
    display: none!important;
}
.post-type-archive-use-cases .resource-box-item.d-flex.show {
    display: flex!important;
}
.post-type-archive-use-cases #search-filter-pane .container {
    max-width: 1100px;
}
@media (max-width: 998px) {
    .post-type-archive-use-cases  #search-filter-pane .filter-group.filter-group-tabs a span {
        display: none;
    }
}