* {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    vertical-align: baseline;
}

@font-face {
    font-family: 'SF Pro Display';
    src: local('SF Pro Display');
    src: url(SF-Pro-Display-Regular.woff2);
    font-weight: 500;
}

@font-face {
    font-family: 'SF Pro Display';
    src: local('SF Pro Display');
    src: url(SF-Pro-Display-Thin.woff2);
    font-weight: 300;
}

html {
    font-size: 16px;
    height: 100%;
}

body {
    background: rgba(94, 84, 142, 1);
    font-size: calc(1rem + 1vmax);
    height: 100%;
}

body>div {
    display: flex;
    flex-flow: column nowrap;
    align-content: center;
    align-items: center;
    justify-content: center;
    height: 100%;
    height: -webkit-fill-available;
    width: 100vw;
}

h1 {
    color: white;
    font-size: 1.5rem;
    font-family: 'SF Pro Display', sans-serif;
    font-weight: 500;
    text-align: center;
    line-height: 1em;
    padding: 0;
    margin: 0;
}

h1::before {
    content: "";
    display: block;
    margin: 0 auto;
    background: url(oscarardevol.svg) no-repeat 0 0;
    background-size: contain;
    width: 4rem;
    height: 3.6rem;
    margin-bottom: 1rem;
}

h1 a {
    color: white;
    display: block;
    padding: .62rem;
    text-decoration: none;
}

span[itemprop='name'] a {
	color: white;
    text-decoration: none;
	position: relative;
    font-weight: 500;
}

span[itemprop='name'] a:after {
	content: " ";
    width:  100%;
	max-width: 0.91em;
    background: white;
	height: .05rem;
	left: calc(50% - 0.455em);
	position: absolute;
	top: 1.34rem;
	transition: all .5s ease;
	position: absolute;
}

span[itemprop='name']:hover a:after {
	background: white;
	content: " ";
	left: 0;
	max-width: 100%;
	transition: all .5s ease;
}

div p {
    font-family: 'SF Pro Display', sans-serif;
    color: white;
    font-size: 1rem;
    font-weight: 300;
    line-height: 1.2em;
    text-align: center;
    margin: 1rem 2rem;
}