@use '../utils' as *;

/*=============================
    	25. venue
===============================*/

.td-venue{
    &-thumb{
        height: 100%;
        & img{
            border-radius: 20px;
            height: 100%;
            object-fit: cover;
        }
    }
    &-content{
        &-wrap{
            background: #f2f7f7;
            border-radius: 20px;
            padding: 90px 90px 85px 100px;
            height: 100%;
            @media #{$xl,$lg,$md,$sm} {
                padding: 60px 55px 55px 65px;
            }
            @media #{$xs} {
                padding: 20px 15px 15px 25px;
            }
        }
    }
    &-subtitle{
        font-weight: 500;
        text-transform: capitalize;
        color: var(--td-theme-primary);
    }
    &-title{
        font-weight: 700;
        font-size: 24px;
        line-height: 150%;
        text-transform: capitalize;
    }
    &-text{
        font-family: var(--td-ff-poppins);
        line-height: 30px;
        text-transform: capitalize;
        color: var(--td-grey-1);
    }
    &-info{
        display: flex;
        &-icon{
            font-size: 40px;
            color: var(--td-theme-secondary);
            flex: 0 0 auto;
            margin-right: 4px;
            transform: translateY(-5px);
        }
        & .subtitle{
            font-weight: 500;
            font-size: 14px;
            text-transform: capitalize;
            color: var(--td-common-black);
            display: block;
            line-height: 1.3;
        }
        & .links{
            font-family: var(--td-ff-poppins);
            color: var(--td-grey-1);
            &:hover{
                color: var(--td-theme-primary);
            }
        }
    }
}