


.overview-page-tile {
    width: calc((100% / 3) - 26px);
    display: inline-block;
    vertical-align: top;
    margin-bottom: 32px;
    margin-right: 30px;
    background-color: #fff;
    border: 1px solid #e2e2e2;
    position: relative;
    transition: none;
    border-radius: 10px;
    overflow: hidden;
}



    .overview-page-tile:hover:after {
        opacity: 0;
        -webkit-transform: scale(0);
        transform: scale(0);
    }

    .overview-page-tile:hover:before {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }


    .overview-page-tile:nth-child(3n) {
        margin-right: 0px;
    }

    .overview-page-tile a {
        text-decoration: none;
        position: relative;
        height: 100%;
        display: inline-block;
        width: 100%;
    }

        .overview-page-tile a .image,
        .overview-page-tile a .image .no-image {
            position: relative;
            width: 100%;
            height: auto;
            vertical-align: middle;
            -webkit-transition: .4s -webkit-transform cubic-bezier(.13,.61,.4,.96);
            transition: .4s -webkit-transform cubic-bezier(.13,.61,.4,.96);
            transition: .4s transform cubic-bezier(.13,.61,.4,.96);
            transition: .4s transform cubic-bezier(.13,.61,.4,.96),.4s -webkit-transform cubic-bezier(.13,.61,.4,.96);
        }

            .overview-page-tile a .image .no-image {
                min-height: 220px;
            }

            .overview-page-tile a .image .state {
                top: 0;
                position: absolute;
                left: 34px;
                z-index: 2;
                background: var(--orange);
                border-radius: 13px;
                padding: 0 17px;
                color: #fff;
                display: inline-block;
                font-size: 14px;
                letter-spacing: .5px;
                line-height: 26px;
                margin-top: 16px;
                margin-bottom: 15px;
            }

            .overview-page-tile a .image .cal {
                top: 54%;
                left: 22%;
                transform: translate(-50%,-50%);
                position: absolute;
                background: #fff;
                width: 111px;
                height: 104px;
                z-index: 10;
                text-align: center;
            }

                .overview-page-tile a .image .cal:before {
                    content: "";
                    display: block;
                    width: 100%;
                    height: 16px;
                    background: var(--orange);
                    position: absolute;
                    top: 0px;
                }


                .overview-page-tile a .image .cal .day {
                    line-height: 52px;
                    display: block;
                    font-family: abold,Verdana,Helvetica,Arial,sans-serif;
                    font-size: 38px;
                    color: var(--blue);
                    width: 100%;
                    text-align: center;
                    padding-top: 20px;
                    letter-spacing: .5px;
                }

                .overview-page-tile a .image .cal .month,
                .overview-page-tile a .image .cal .year {
                    width: 100%;
                    text-align: center;
                    color: var(--blue);
                    font-family: aregular,Verdana,Helvetica,Arial,sans-serif;
                    font-size: 14px;
                    letter-spacing: .5px;
                }


            .overview-page-tile a .image .play-button {
                z-index: 10;
                background: var(--orange);
                font-family: abold,Verdana,Helvetica,Arial,sans-serif;
                float: left;
                padding: 3px 3px 3px 11px;
                line-height: 34px;
                display: block;
                width: auto;
                border-radius: 25px;
                color: #fff;
                top: 50%;
                left: 50%;
                transform: translate(-50%,-50%);
                position: absolute;
                cursor: pointer;
            }

                .overview-page-tile a .image .play-button .text {
                    display: block;
                    float: left;
                    padding-right: 10px;
                }

                .overview-page-tile a .image .play-button .arrow {
                    display: block;
                    width: 34px;
                    height: 34px;
                    position: relative;
                    float: right;
                }

                    .overview-page-tile a .image .play-button .arrow:before {
                        content: "";
                        height: 34px;
                        width: 34px;
                        background: #e66900;
                        border-radius: 18px;
                        display: inline-block;
                        position: absolute;
                        top: 0;
                        right: 0;
                        z-index: 2;
                    }

                    .overview-page-tile a .image .play-button .arrow:after {
                        content: "";
                        width: 0;
                        height: 0;
                        border-style: solid;
                        border-width: 7px 0 7px 14px;
                        border-color: transparent transparent transparent #fff;
                        display: inline-block;
                        position: absolute;
                        top: 9px;
                        right: 8px;
                        z-index: 2;
                    }


            .overview-page-tile a .image:hover {
                -webkit-transform: scale(1.05);
                transform: scale(1.05);
            }

            .overview-page-tile a .image picture img {
                width: 100%;
                height: 100%;
                margin-top: 0;
                -o-object-fit: cover;
                object-fit: cover;
                -o-object-position: 50% 50%;
                object-position: 50% 50%;
                font-family: 'object-fit: cover; object-position: 50% 50%;';
                border-top-left-radius: 10px;
                border-top-right-radius: 10px;
            }

        .overview-page-tile a .content-wrapper {
            padding-bottom: 23px;
            padding-left: 23px;
            padding-right: 23px;
            margin-top: 16px;
        }

            .overview-page-tile a .content-wrapper .date,
            .overview-page-tile a .content-wrapper .todo {
                color: #9596a4;
                font-family: alight,Verdana,Helvetica,Arial,sans-serif;
                font-size: 14px;
                letter-spacing: .5px;
                line-height: 22px;
                width: 100%;
            }

            .overview-page-tile a .content-wrapper .occupation {
                display: block;
                font-family: aregular,Verdana,Helvetica,Arial,sans-serif;
                font-size: 14px;
                letter-spacing: .5px;
                color: #81808f;
            }

            .overview-page-tile a .content-wrapper .title {
                line-height: 28px;
                margin-bottom: 8px;
                color: var(--blue);
                font-family: abold,Verdana,Helvetica,Arial,sans-serif;
                font-size: 19px;
                font-weight: 400;
            }


            .overview-page-tile a .content-wrapper .description {
                color: #00011f;
                font-family: alight,Verdana,Helvetica,Arial,sans-serif;
                font-size: 14px;
                margin: 0;
                line-height: 26px;
                overflow: hidden;
                text-overflow: ellipsis;
                -webkit-line-clamp: 3;
                display: -webkit-box;
                -webkit-box-orient: vertical;
            }

            .overview-page-tile a .content-wrapper .readmore {
                font-family: aregular,Verdana,Helvetica,Arial,sans-serif;
                font-size: 14px;
                letter-spacing: .5px;
                line-height: 22px;
                color: #ff6400;
                display: inline-block;
                position: relative;
            }

                .overview-page-tile a .content-wrapper .readmore:after {
                    content: "";
                    width: 100%;
                    height: 2px;
                    border-radius: 0;
                    background: #ff6400;
                    position: absolute;
                    bottom: 0;
                    left: 0;
                    z-index: 10;
                    transform: scale(1);
                    transition: all .3s ease-in-out;
                }

@media (max-width: 850px) {
    .overview-page-tile {
        width: calc((100% / 2) - 26px);
    }

        .overview-page-tile:nth-child(3n) {
            margin-right: 30px
        }
        .overview-page-tile:nth-child(2n) {
            margin-right: 0px
        }
}


@media (max-width: 550px) {
    .overview-page-tile {
        width: 100%;
    }

    .searchresult-wrapper .overview-page-tile:nth-last-child(2) {
        margin-bottom: 0px;
    }


        .overview-page-tile:nth-child(2n) {
            margin-right: 0px
        }

        .overview-page-tile:nth-child(1n) {
            margin-right: 0px
        }
}