/* Archives */

#main-archive .bc-product-card:not(.slide) img {
    /*opacity: 0;*/
}

#main-archive.products .bc-product-card:not(.slide) {
    background: #fff;
}

.nav-archive {
    margin: 0 0 40px;
}

ul#main-archive {
    position: relative;
    float: left;
    list-style: none;
    padding: 80px 40px;
    margin: 0;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

ul#main-archive .facetwp-template {
    position: relative;
    float: left;
    list-style: none;
    margin: 0;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

/*
ul#main-archive .facetwp-template li:not(.slide) {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

ul#main-archive .facetwp-template .meta {
    position: relative;
    width: 100%;
    float: left;
}
*/

ul#main-archive p {
    margin: 0 0 20px;
    font-size: 14px;
}

ul#main-archive li:not(.slide) {
    position: relative;
    display: inline;
    float: left;
    width: 48%;
    margin: 0 0 60px 0;
    background: #fff;
}

ul#main-archive li ul,
ul#main-archive li ul li {
    list-style: disc;
    margin: 0 20px 20px;
    padding: 0;
    border: none;
    background: none;
    width: 100%;
    font-size: 14px;
}


ul#main-archive.products li:not(.slide) {
    width: 33.333%;
    margin: 0 0 80px 0;
    border-right: 1px solid rgba(0, 0, 0, 0.1)
}

ul#main-archive.products li:not(.slide):nth-child(3) {
    border-right: 1px solid rgba(0, 0, 0, 0)
}

ul#main-archive li.sticky {
    width: 100%;
}

ul#main-archive li a:not(.button) {
    float: left;
    width: 100%;
}


body.post-type-archive-documenatation ul#main-archive li a.cat-link.documenatation,
body.post-type-archive-faq ul#main-archive li a.cat-link.faq,
body.post-type-archive-videos ul#main-archive li a.cat-link.video,
body.post-type-archive-software ul#main-archive li a.cat-link.software {
    display: none;
}


ul#main-archive li:not(.slide) .thumbnail {
    position: relative;
    z-index: 1;
    float: left;
    width: 100%;
    margin: 0 0 10px 0;
}

ul#main-archive li.type-videos .thumbnail:before {
    content: "";
    position: absolute;
    z-index: 3;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;

    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 20.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 60 60' style='enable-background:new 0 0 60 60;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:none;stroke:%23FFFFFF;stroke-width:3;stroke-miterlimit:10;%7D .st1:hover .st0 %7B -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); %7D .st1%7Bfill:%23FFFFFF;%7D%0A%3C/style%3E%3Ccircle id='my-circle' class='st0' cx='30' cy='30' r='28.5'/%3E%3Cpolyline class='st1' points='43.5,29.9 23.5,20.4 23.5,39.4 43.5,29.9 '/%3E%3C/svg%3E%0A");

    background-size: 32%;
    background-repeat: no-repeat;
    background-position: center center;
}

ul#main-archive li .thumbnail:after,
ul#main-archive li.type-videos .thumbnail:after {
    content: "";
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.4);
}

ul#main-archive li .thumbnail:after {
    background: rgba(0, 0, 0, 0);
}

ul#main-archive li.type-videos .thumbnail:hover:before {
    background-size: 34% !important;
}

ul#main-archive li:hover .thumbnail:after {
    background: rgba(0, 0, 0, 0.04);
}

ul#main-archive li.type-videos:hover .thumbnail:after {
    background: rgba(0, 0, 0, 0.6);
}


ul#main-archive li:not(.slide) img {
    float: left;
    width: 100%;
    margin: 0;
}

ul#main-archive li .entry-content,
ul#main-archive li .entry-footer,
ul.content li .entry-content,
ul.content li .entry-footer {
    width: 100%;
    margin: 20px 0 40px;
}

ul#main-archive li .meta,
ul.content li .meta {
    position: absolute;
    z-index: 2;
    width: auto;
    top: 10px;
    right: 10px;
    text-align: center;
    font-size: 12px;
}

ul#main-archive li .meta a {
    float: right;
    width: auto !important;
    margin: 0 0 10px 10px;
}

/* DIV STYLE */
/* Archives */

#main-archive {
    position: relative;
    float: left;
    list-style: none;
    padding: 0;
    margin: 0;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

/* To left align last row */
/* via https://stackoverflow.com/a/34816625 */

#main-archive.products::after {
    content: "";
    flex: auto;
}
