body {
    padding-top: 85px;
}

main {
    min-height: 100vh;
}

.font-12 {
    font-size: 12px;
}

.font-14 {
    font-size: 14px;
}

.c-gray-2 {
    color: #eaeaea;
}

.c-primary {
    color: #3f5c9d;
}

.bg-main {
    background-color: #3f5c9d;
}

.mt-6 {
    margin-top: 4rem!important;
}

.article-3 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    text-overflow: ellipsis;
}
.article-4 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
    text-overflow: ellipsis;
}

.nav-bar {
    position: absolute;
    top: -52px;
    left: 0;
}
.nav-bar .nav-item {
    border: 1px solid #999;
    padding: 8px 36px;
    border-radius: 24px;
}
.a-decoration {
    color: inherit;
    text-decoration: none;
}

.topnav {
    transition: padding 0.3s ease-in-out;
}

.nav-item a {
    color: rgba(255, 255, 255, 0.7);
}

.dropdown-menu a {
    color: #01036f;
}
.navbar-dark .navbar-nav .nav-link {
    color: #fff!important;
}

@media (min-width: 768px) {
    .publish {
        position: absolute;
        top: 0;
        right: 0;
    }

    .list-group-item .image {
        max-width: 220px;
        min-width: 168px;
        height: 138px;
        overflow: hidden;
    }

    .nav-item {
        position: relative;
    }


    .nav-item:hover .dropdown-menu {
        top: 100%;
        opacity: 1;
    }

    .nav-item:hover .nav-link::before {
        width: 70%;
        visibility: visible;
    }

    .nav-item .nav-link::before {
        content: "";
        position: absolute;
        width: 0;
        height: 3px;
        bottom: 1px;
        left: 8px;
        background-color: #fff;
        border-radius: 4px;
        visibility: hidden;
        transition: width 0.3s ease-in-out;
    }

    .dropdown-menu {
        margin: 0;
        top: calc(100% + 30px);
        display: block;
        visibility: hidden;
        opacity: 0;
        border: unset;
        transition: top 0.3s ease-in-out, opacity 0.3s ease-in-out;
    }


}

@media (max-width: 768px) {
    .list-group-item {
        padding: 0.75rem 0!important;
    }

    .list-group-item .image {
        width: 128px;
        height: 98px;
        overflow: hidden;
    }

    .publish {
        margin-top: 8px;
    }
}