@import url('https://fonts.googleapis.com/css2?family=Fleur+De+Leah&display=swap');

:root{
    --golden: rgb(200 154 01)
}
.awesome * {
    font-family: 'Fleur De Leah', cursive;
}

.awesome {
    background-image: url(./bg.gif);
    background-repeat: repeat;
}

.portrait img {
    animation: spin 0.5s linear infinite;
}

@-moz-keyframes spin {
    20% {
        -moz-transform: rotate(15deg);
    }
    60% {
        -moz-transform: rotate(-15deg);
    }
}

@-webkit-keyframes spin {
    20% {
        -webkit-transform: rotate(15deg);
    }
    60% {
        -webkit-transform: rotate(-15deg);
    }
}

@keyframes spin {
    20% {
        -webkit-transform: rotate(15deg);
        transform: rotate(15deg);
    }
    60% {
        -webkit-transform: rotate(-15deg);
        transform: rotate(-15deg);
    }
}

.red-text-border {
    /*
    text-shadow: 2px 0 0 var(--golden), -2px 0 0 var(--golden), 0 2px 0 var(--golden), 0 -2px 0 var(--golden), 1px 1px var(--golden), -1px -1px 0 var(--golden), 1px -1px 0 var(--golden), -1px 1px 0 var(--golden);
     */

}
body{
    overflow-x:hidden;
}

.blink {
    animation: blink-animation 2s steps(5, start) infinite;
    -webkit-animation: blink-animation 2s steps(5, start) infinite;
}

@keyframes blink-animation {
    to {
        visibility: hidden;
    }
}

@-webkit-keyframes blink-animation {
    to {
        visibility: hidden;
    }
}

.rotatehover {
    transition: transform .7s ease-in-out;
}
.rotatehover:hover {
    transform: rotate(360deg);
}
.bigger:hover{
    width: 50%;
}