@charset "UTF-8";

/* CSS Document */

html, body {
    margin: 0;
    padding: 0;

    min-height: 100%;
}

div {
	position: relative;
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100vw;
    height: 100vh;

    animation: logo 3s linear .5s 1 normal both;

    background-color: white;
}

@keyframes logo {
    0%      { opacity: 0; }
    25%     { opacity: 1; }
    100%    { opacity: 1; }
}

logo {
    z-index: 1;
    position: absolute; top: 0; right: 0; bottom: 0; left: 0;
    margin: auto;

    width: 50vw; max-width: 300px;
    height: 50vw; max-height: 300px;

    background-image: url(img/logo.svg);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

prox {
    width: 90vw; max-width: 550px;
    height: 90vw; max-height: 550px;

    animation: prox 30s linear infinite;

    background-image: url(img/proximamente.svg);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

@keyframes prox {
    0%      { rotate: 0deg; }
    100%    { rotate: 360deg; }
}