/*==================================
Projects Page
==================================*/

.projects-page{

    width:100%;

    padding:140px 45px;

    box-sizing:border-box;

}

.post-type-archive-project .bc-hamburger {
    display:none;
}

.post-type-archive-project .bc-back-home {
    display:block;
}

/*==================================
Grid
==================================*/

.projects-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    column-gap:80px;

    row-gap:150px;
     align-items:center;

}

/*==================================
Card
==================================*/

.project-card{

     display:flex;

    justify-content:center;

    align-items:center;

}

.project-inner{

     display:flex;

    flex-direction:column;

}
/*==================================
Link
==================================*/

.project-trigger{

    display:block;

    text-decoration:none;

    color:inherit;

}

/*==================================
Image Container
==================================*/

.project-image{

    display:flex;
    justify-content:center;

}





/*==================================
Actual Image
==================================*/

.project-image img{

    width:100%;
    height:auto;
    display:block;
}


/*==================================
Info
==================================*/

.project-image,
.project-info{

    display:flex;
    justify-content:center;
    align-items: center;
}

.project-info{

    margin-top:14px;

}

.project-info h3{

     margin:0;

    font-size:18px;

    font-weight:500;

    opacity:0;

    transition: 0.35s;

}

.project-card:hover .project-info h3{

    opacity:1;

}



/*==================================
Tablet
==================================*/

@media(max-width:1024px){

    .projects-grid{

        grid-template-columns:repeat(2,1fr);

        column-gap:40px;

        row-gap:70px;

    }

}

/*==================================
Mobile
==================================*/

@media(max-width:768px){

    .projects-page{

        width:90%;

        padding:70px 0;

    }

    .projects-grid{

        grid-template-columns:1fr;

        row-gap:55px;

    }

    .project-info h3{

        opacity:1;

        transform:none;

    }

}

/*==================================*
* Fancybox - White Overlay
*==================================*/

.fancybox__container {
    margin-top: 80px;
}

.fancybox__backdrop {
    background: #fff !important;
    opacity: 1 !important;
}

.fancybox__container,
.fancybox__carousel,
.fancybox__viewport {
    background: #fff !important;
}

/* Loading animation */
.fancybox__spinner {
    color: #222;
}

/* Navigation buttons */
.f-button {
    background: transparent !important;
    color: #222 !important;
    border: none;
    box-shadow: none;
}

.f-button:hover {
    background: rgba(0, 0, 0, 0.05) !important;
}

/* Close button */
.f-button svg {
    stroke: #222;
}

/* Caption */
.fancybox__caption {
    color: #222;
    font-size: 15px;
}

/* Counter (1 / 4) */
.fancybox__toolbar {
    color: #222;
}

/* Prevent image from touching edges */
.fancybox__content img {
    max-height: 88vh;
}

.bc-project-footer{

    position:fixed;

    left:0;

    right:0;

    bottom:0;

    background:#fff;

    border-top:1px solid #ececec;

    padding:28px 60px;

    z-index:999999;

}

.bc-footer-title{

    font-size:20px;

    margin-bottom:12px;

}

.bc-footer-bottom{

    display:flex;

    justify-content:space-between;

    align-items:center;

}

.bc-details-btn{

    background:none;

    border:none;

    cursor:pointer;

    padding:0;

    color:#444;

}

.bc-counter{

    color:#777;

}