﻿.link_container {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
}

    .link_container .link {
        margin: 10px;
        padding: 10px;
        border-radius: 5px;
        background-color: #DCEBF9;
        height: fit-content;
        width: calc(25% - 20px);
        box-shadow: 5px 5px 5px rgb(0 0 0 / 70%);
    }

        .link_container .link .content {
        }

            .link_container .link .content .image {
                margin: 0.5rem auto;
                cursor: pointer;
            }

                .link_container .link .content .image img {
                    width: 100%;
                    height: auto;
                    border-radius: 5px;
                }

                .link_container .link .content .image div {
                    width: 100%;
                    height: auto;
                    border-radius: 15px;
                }

            .link_container .link .content .title {
                width: 100%;
                padding: 0 0.5rem;
            }

                .link_container .link .content .title p {
                    font-weight: bold;
                    overflow: hidden;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    margin-bottom: 0px;
                }

@media only screen and (max-width: 1023px) {
    .link_container .link {
        width: calc(33.33333% - 1rem);
    }
}

@media only screen and (max-width: 767px) {
    .link_container .link {
        width: calc(50% - 1rem);
    }
}

@media only screen and (max-width: 480px) {
    .link_container .link {
        width: 100%;
    }
}


