/* latin */
@font-face {
    font-family: 'Alatsi';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Alatsi Regular'), local('Alatsi-Regular'), url(https://fonts.gstatic.com/s/alatsi/v1/TK3iWkUJAxQ2nLN2GT8Gl-1PKw.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
    font-family: 'Amatic SC';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Amatic SC Regular'), local('AmaticSC-Regular'), url(https://fonts.gstatic.com/s/amaticsc/v13/TUZyzwprpvBS1izr_vOECuSfU5cP1Q.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

.house-wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 367.25px;
    height: 293.58px;
    background: rgba(255, 103, 0, 0.6);
    border-radius: 10px;
    display: grid;
    grid-template: 206.58px repeat(2, 1fr) / repeat(2, 1fr);
    -webkit-box-shadow: 0 0 50px 0 rgba(0,0,0,0.3);
    box-shadow: 0 0 50px 0 rgba(0,0,0,0.3);

    transition: background 1s ease;
}

.house-wrapper:hover {
    background: rgba(255, 103, 0, 0.8);
}

img {
    width: 367.25px;
    height: 206.58px;
    object-fit: cover;
    border-radius: 10px;
    grid-area: 1 / 1 / 1 / 3;
}

.title-wrapper, .time-wrapper {
    display: grid;
    font-family: "Amatic SC", sans-serif;
    font-size: 20px;
}

.title-wrapper h3, .time-wrapper h3{
    margin: 0;
    padding: 1px 5px 1px 5px;
    Align-self: center;

}

.title-wrapper {
    grid-area: 2 / 1 / 2 / 2;
    text-align: left;
}

.time-wrapper {
    grid-area: 2 / 2 / 2 / 3;
    text-align: right;
}

.tag-wrapper {
    font-family: "Amatic SC", sans-serif;
    font-size: 14px;
    padding: 1px 5px 1px 5px;
}

.tag {
    display: inline-block;
    border: 1px solid rgba(122, 122, 122, 0.5);
    border-radius: 10px;
    padding: 5px 20px 5px 20px;
    background: rgba(122, 122, 122, 0.5);
}