.portfolio_1{
    .container{
        position: relative;
        z-index: 11;
        .portfolio-card {
            position: relative;
            margin: auto;
            overflow: hidden;
            .card-overlay {
                background: linear-gradient(0deg, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8));
                position: absolute;
                height: 100%;
                width: 100%;
                left: 0;
                top: 0;
                opacity: 0;
                -webkit-transition: all 0.4s ease-in-out 0s;
                -moz-transition: all 0.4s ease-in-out 0s;
                transition: all 0.4s ease-in-out 0s;
            }
            &:hover {
                .card-overlay {
                    opacity: 1;
                }
                .card-details {
                    top: 40%;
                    left: 50%;
                    opacity: 1;
                }
            }
        }
        .card-image {
            width: 100%;
        }
        .card-details {
            position: absolute;
            width: 100%;
            top: 50%;
            left: 50%;
            opacity: 0;
            -webkit-transform: translate(-50%, -50%);
            -moz-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
            -webkit-transition: all 0.3s ease-in-out 0s;
            -moz-transition: all 0.3s ease-in-out 0s;
            transition: all 0.3s ease-in-out 0s;
            .category{
                width: 40%;
                padding: 21px 0 0 45px;
                border-bottom: 1px solid $accent-1;
                @include media-query(1350px) {
                    padding: 78px 0 0 45px;
                }
                h6{
                    margin-bottom: 1px;
                }
            }
            .content{
                padding: 53px 88px 0;
                @include media-query(1350px) {
                    padding: 30px 30px 0;
                }
            }
        }
        .box-fadeIn-bottom {
            top: 80%;
            @include media-query(1350px) {
                top: 40%;
            }
        }

        .nav-tabs{
            border-bottom: none;
            padding: 24px 0;
            .nav-item{
                .nav-link{
                    border: none;
                    background-color: transparent;
                    color: $gray-2;
                    font-weight: 700;
                    font-size: 21px;
                    line-height: 130%;
                    &.active{
                        color: $accent-1;
                    }
                }
            }
        }
    }
}
.portfolio_2{
    .content{
        position: relative;
        z-index: 11;
       
    }
}