body {
    background-color: rgba(238, 241, 241, 0.705);
}
/*tabs*/
.tabs {
    flex-direction: column;
    margin: 2rem 0rem;
    position: absolute;
    left: 0;
    top: 25%;
}

.tab-item {
    width: 4.2rem;
    height: 4.2rem;
    background-color: beige;
    text-align: center;
    /*border-bottom: 1.8px solid rgb(175 175 175 / 40%);*/
}
.tab-item:hover {
    background-color: rgb(242, 242, 242);
}

.tab-item.active {
   background-color: rgb(242, 242, 242);
   cursor:text;
}

.tab-item button {
        padding-top: .5rem;
        display: inline-block;
        width: 100%;
        height: 100%;
        text-decoration: none;
        cursor: pointer;
        border: none;
        background: none;
    }

        .tab-item button i {
            font-size: 1.8rem;
            line-height: 1rem;
        }

        .tab-item button span {
            display: block;
            font-size: .79rem;
            width: 100%;
            margin-top: .1rem;
        }

@media (max-width:767.5px) {
    .tabs {
        flex-direction: row;
        position: relative;
        justify-content: center;
        width: 100%;
    }
}