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

header{
    background-color: rgba(49, 106, 140, 0.75);
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;

}

h1 {
    margin-top: 0.5rem;
}

p{
    color: white;
    font-size: xx-large;
}

.logo {
    text-align: center;
    padding:1rem;
}

img{
    background-color: rgba(221, 243, 239, 0.73);
    padding: 0.8rem;
    border-radius: 0.2rem;
    animation-name: usk-logo;
    animation-duration: 6s;
    animation-direction: alternate;
    animation-iteration-count: max(2) ;
    animation-timing-function: linear;
    animation-play-state: running;
    animation-delay: 1.5s;

}

@keyframes usk-logo{
    0%{
        background-color: rgba(140, 49, 51, 0.91);
        transform: translate(0,0);
    }
    25%{
        border-top-left-radius: 3rem;
        transform: rotate(2deg);
    }
    50%{
        border-top-right-radius: 3rem;
    }
    75%{
        border-bottom-right-radius: 3rem;
        transform: rotate(-2deg);
    }
    100%{
        border-bottom-left-radius: 3rem;
    }
}