@font-face {
    font-family: "BeauRivage-Regular";
    src: local("BeauRivage-Regular"), url("BeauRivage-Regular.ttf") format("TrueType")
}

@font-face {
    font-family: "BebasNeue-Regular";
    src: local("BebasNeue-Regular"), url("BebasNeue-Regular.ttf") format("TrueType")
}

@font-face {
    font-family: "Baloo2-Regular";
    src: local("Baloo2-Regular"), url("Baloo2-Regular.ttf") format("TrueType")
}

:root {
    --colors-darkbg: #0F0F0F;
    --colors-lightbg: #EDEDED;
    --colors-highlight: #79CDCD;
    --colors-fontnormal: #828282;
    --colors-title: #79CDCD;
}


body {
    background-color: var(--colors-lightbg);
    background-image: url('BG.jpg');
    background-size: cover;
}

.house {
    background-image: url('HouseIcon.png');
    background-size: cover;
    opacity: 0.5;
    width: 360px;
    height: 325px;
    position: absolute;
    left: 50px;
    top: 50px;
}

.white {
    position: absolute;
    left: 0;
    top: 10em;
    min-height: 40em;
    min-width: 80em;
    background-color: rgba(255,255,255, 0.6);
}

.title_wrapper {
    width: 48em;
    /*    margin-top: 100px;*/
    margin-left: 100px;
    position: relative;
}

.title_header {
    font-family: BeauRivage-Regular;
    color: var(--colors-title);
    font-size: 15em;
    position: relative;
    top: 80px;
    left: 200px;
    z-index: 10;
    -webkit-text-stroke: var(--colors-darkbg) 0.5px; 
}

.title_subtext {
    border-top: 7px solid var(--colors-highlight);
    font-family: BebasNeue-Regular;
    color: var(--colors-fontnormal);
    font-size: 4em;
    width: 12em;
}

.deco_relief {
    text-shadow: -1px -1px 1px #fff, 1px 1px 1px #000;
    opacity: 0.8;
    animation: shine 3s linear infinite;
}

.deco_footer {
    font-family: Baloo2-Regular;
    position: absolute;
    bottom: 1em;
    right: 0;
    font-size: 0.3em;
    color: var(--colors-darkbg);
}