@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700&display=swap');

:root {
    --clr-bg: #0A1A2F;
    --clr-crd: #333;
    --clr-mdm: #777;
    --clr-txt: #FBFBFB;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

a,
a:active,
a:focus,
a:hover,
a:visited {
    color: var(--clr-txt) !important;
    text-decoration: none;
}

body {
    --ion-background-color: var(--clr-bg);
    align-items: center;
    display: flex;
    font-family: 'Open Sans', sans-serif;
    height: auto !important;
    max-height: unset !important;
    justify-content: center;
    overflow: auto !important;
    position: relative !important;

.card {
    background-color: var(--clr-crd);
    border-radius: 1em;
    padding: 32px;
    width: min(75%, 500px);
    text-align: center;
    color: var(--clr-txt);
    transition: all 1000ms;

    .profile-pic {
        background-color: var(--clr-mdm);
        background-image: url(https://www.jerem.re/sharedAssets/logo/logoBlue.png);
        background-size: cover;
        border-radius: 50%;
        height: 70px;
        margin: 0 auto 20px;
        width: 70px;
    }

    .button {
        display: flex;
        align-items: center;
        justify-content: space-between;
        background-color: #555;
        border: 1px solid #666;
        border-radius: .5em;
        padding: 10px;
        margin: 10px 0;
        color: #fff;

        ion-icon {
            font-size: 1.5em;
        }
    }

    .footer {
        margin-top: 3em;
        font-size: .5em;
        color: var(--clr-mdm);
    }
}
}

.pix-web {
    background-image: url(https://www.jerem.re/sharedAssets/ico/fav.png);
    background-size: cover;
}

.pix-cv {
    background-image: url(https://www.jerem.re/sharedAssets/img/cv.jpg);
    background-size: cover;
}

.pix-github {
    background-image: url(https://svgl.app/library/github_light.svg);
    background-size: cover;
}

.pix-linkedin {
    background-image: url(https://svgl.app/library/linkedin.svg);
    background-size: cover;
}

.pix-instagram {
    background-image: url(https://svgl.app/library/instagram-icon.svg);
    background-size: cover;
}

@media (max-width: 700px) {
    .ml-3 {
        text-transform: capitalize;

       a span {
        display: none;
        }
    }
}