:root {
    --main_color: #5349f8;
    --black_color: #292d32;
    --green_color: #36ae7c;
    --white_color: #fff;
    --input_bg_color: #eef3ff;
    --gray_light: #f9f9f9;
    --border_color: #cbcbcb;
    --pink_color: #ed3573;
    --placeholder_color: #757575;
}

/* ///////// navbar sm */
#bottom-nav {
    background: #f9f9f9;
    border-top: 1px solid #cbcbcb;
    z-index: 999;
    position: fixed;
    bottom: 0;
    width: 100%;
    display: block;
    transition: bottom 0.3s;
    right: 0;
}

.navbar_sm_bg a {
    text-decoration: none;
    color: var(--black_color);
}

.offcanvas-body ul li {
    list-style: none;
}

.navbar_sm_bg p {
    margin-bottom: 0;
}

.cool-link {
    display: inline-block;
    color: var(--black_color);
    text-decoration: none;
}

.cool-link::after {
    content: "";
    display: block;
    width: 0;
    height: 2px;
    background: var(--main_color);
    transition: width 0.7s;
}

.cool-link:hover::after,
.cool-link.active::after {
    width: 100%;
}