@keyframes growFrame {
    from {
        transform: scaleX(0);
        transform-origin: left;
    }

    to {
        transform: scaleX(1);
        transform-origin: left;
    }
}

@keyframes growHorizontal {
    from {
        transform: scaleX(0);
        transform-origin: left;
    }

    to {
        transform: scaleX(1);
        transform-origin: left;
    }
}

@keyframes growVertical {
    from {
        transform: scaleY(0);
        transform-origin: top;
    }

    to {
        transform: scaleY(1);
        transform-origin: top;
    }
}

@keyframes appear {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes popIn {
    0% {
        opacity: 0;
        transform: scale(0.85);
    }

    70% {
        transform: scale(1.03);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

/* Main newspaper frame */

.main {
    animation: growFrame 0.8s ease-in-out both;
}

/* Newspaper title */

.newspaper_wrapper h1 {
    animation: growHorizontal 0.7s ease-in-out 0.5s both;
}

/* Date */

.newspaper_wrapper p {
    animation: appear 0.5s ease-in-out 1s both;
}

/* Main photograph */

.image_wrapper {
    animation: popIn 0.7s ease-in-out 0.8s both;
}

/* Floating articles */

.floating_description_1 {
    animation: appear 0.5s ease-in-out 1.1s both;
}

.floating_description_2 {
    animation: appear 0.5s ease-in-out 1.25s both;
}

.floating_description_3 {
    animation: appear 0.5s ease-in-out 1.4s both;
}

.floating_description_4 {
    animation: appear 0.5s ease-in-out 1.55s both;
}

.floating_description_1::before {
    animation: growHorizontal 0.5s ease-in-out 1.2s both;
}

.floating_description_1::after {
    animation: growHorizontal 0.5s ease-in-out 1.35s both;
}

.floating_description_2::before {
    animation: growHorizontal 0.5s ease-in-out 1.3s both;
}

.floating_description_2::after {
    animation: growVertical 0.5s ease-in-out 1.45s both;
}

.floating_description_3::before {
    animation: growHorizontal 0.5s ease-in-out 1.4s both;
}

.floating_description_4::before {
    animation: growHorizontal 0.5s ease-in-out 1.5s both;
}

.floating_description_4::after {
    animation: growVertical 0.5s ease-in-out 1.6s both;
}