@font-face {
    font-family: Exo2;
    src: url('Exo2-Regular.ttf');
}

body {
    background-color: #222;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100vw;
    height: 90vh;
    padding: 0;
    margin: 0;
    font-family: Exo2, sans-serif;
    color: #fff;
    overflow: hidden;
}

@media screen and ( min-width: 800px ) {
    body {
        background: #222 url('background.svg') bottom right no-repeat;
        background-size: auto 100%;
        height: 100vh;
    }
}

a,
a:visited,
a:active {
    color: #fff;
    text-decoration: none;
    border-bottom: 1px solid #fff;
}

a:hover {
    border-bottom: 1px solid transparent;
}

.vcard {
    width: 400px;
    height: 600px;
    background: #cb300b url('footer.svg') bottom right no-repeat;
    box-shadow: 3px 10px 20px rgba(0,0,0,0.5);
    border-radius: 2px;
    padding: 40px;
    box-sizing: border-box;
    font-size: 1.2em;
    line-height: 1.4em;
}

.logo {
    margin: 90px auto 40px auto;
}

.links {
    font-size: 0.7em;
    line-height: 1.5em;
}