html {
    scroll-behavior: smooth;
}

.back-to-top {
    display: block;

    width: 200px;

    margin: 40px auto;

    padding: 12px;

    text-align: center;
    text-decoration: none;

    color: white;
    background-color: rgb(35, 35, 35);

    border-radius: 8px;

    transition: background-color 0.3s ease;
}

.back-to-top:hover {
    background-color: rgb(70, 70, 70);
}

.page {
    animation: FadeIn;
    animation-duration: 1s;
    animation-timing-function: ease;
}

@keyframes FadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}


.favorite-food-section {
    width: 650px;
    margin: 40px auto 0 auto;

    border-radius: 6px 6px 0 0;

    text-align: center;
    background-color: rgb(240, 135, 45);
}

.favorite-food-section h2 {
    margin: 0;
    padding: 10px;

    font-size: 30px;
}

.favorite-food {
    width: 650px;
    margin: 0 auto 80px auto;

    border-radius: 0 0 6px 6px;

    text-align: center;
    overflow: hidden;

    background-color: rgb(185, 85, 25);

    transition: box-shadow 0.3s ease;
}

.favorite-food:hover {
    box-shadow: 0 12px 28px rgba(223, 223, 223, 0.4);
}

.favorite-food p {
    padding: 20px;
    margin: 0;
    line-height: 1.5;
    font-size: 25px;
}

.favorite-food-image {
    width: 100%;
    height: 450px;

    object-fit: cover;
    object-position: center 35%;

    display: block;

    transition: transform 0.3s ease;
}

.favorite-food-image:hover {
    transform: scale(1.03);
}

.favorite-drink-section {
    width: 650px;
    margin: 40px auto 0 auto;

    border-radius: 6px 6px 0 0;

    text-align: center;
    background-color: rgb(155, 95, 45);
}

.favorite-drink-section h2 {
    margin: 0;
    padding: 10px;

    font-size: 30px;
}

.favorite-drink {
    width: 650px;
    margin: 0 auto 80px auto;

    border-radius: 0 0 6px 6px;

    text-align: center;
    overflow: hidden;

    background-color: rgb(105, 60, 25);
    
    transition: box-shadow 0.3s ease;
}

.favorite-drink:hover {
    box-shadow: 0 12px 28px rgba(223, 223, 223, 0.4);
}

.favorite-drink p {
    padding: 20px;
    margin: 0;
    line-height: 1.5;
    font-size: 25px;
}

.favorite-drink-image {
    width: 100%;
    height: 650px;

    object-fit: cover;
    object-position: center 35%;

    display: block;

    transition: transform 0.3s ease;
}

.favorite-drink-image:hover {
    transform: scale(1.03);
}

.favorite-sport-section {
    width: 650px;
    margin: 40px auto 0 auto;

    border-radius: 6px 6px 0 0;

    text-align: center;
    background-color: rgb(220, 65, 65);
}

.favorite-sport-section h2 {
    margin: 0;
    padding: 10px;

    font-size: 30px;
}

.favorite-sport {
    width: 650px;
    margin: 0 auto 80px auto;

    border-radius: 0 0 6px 6px;

    text-align: center;
    overflow: hidden;

    background-color: rgb(160, 40, 40);

    transition: box-shadow 0.3s ease;
}

.favorite-sport:hover {
    box-shadow: 0 12px 28px rgba(223, 223, 223, 0.4);
}

.favorite-sport p {
    padding: 20px;
    margin: 0;
    line-height: 1.5;
    font-size: 25px;
}

.favorite-sport-image {
    width: 100%;
    height: 450px;

    object-fit: cover;
    object-position: center 35%;

    display: block;

    transition: transform 0.3s ease;
}

.favorite-sport-image:hover {
    transform: scale(1.03);
}

.favorite-movie-section {
    width: 650px;
    margin: 40px auto 0 auto;

    border-radius: 6px 6px 0 0;

    text-align: center;
    background-color: rgb(95, 100, 110);
}

.favorite-movie-section h2 {
    margin: 0;
    padding: 10px;

    font-size: 30px;
}

.favorite-movie {
    width: 650px;
    margin: 0 auto 80px auto;

    border-radius: 0 0 6px 6px;

    text-align: center;
    overflow: hidden;

    background-color: rgb(55, 60, 70);

    transition: box-shadow 0.3s ease;
}

.favorite-movie:hover {
    box-shadow: 0 12px 28px rgba(223, 223, 223, 0.4);
}

.favorite-movie p {
    padding: 20px;
    margin: 0;
    line-height: 1.5;
    font-size: 25px;
}

.favorite-movie-image {
    width: 100%;
    height: 450px;

    object-fit: cover;
    object-position: center 35%;

    display: block;

    transition: transform 0.3s ease;
}

.favorite-movie-image:hover {
    transform: scale(1.03);
}

.favorite-tv-series-section {
    width: 650px;
    margin: 40px auto 0 auto;

    border-radius: 6px 6px 0 0;

    text-align: center;
    background-color: rgb(135, 75, 210);
}

.favorite-tv-series-section h2 {
    margin: 0;
    padding: 10px;

    font-size: 30px;
}

.favorite-tv-series {
    width: 650px;
    margin: 0 auto 80px auto;

    border-radius: 0 0 6px 6px;

    text-align: center;
    overflow: hidden;

    background-color: rgb(85, 45, 145);

    transition: box-shadow 0.3s ease;
}

.favorite-tv-series:hover {
    box-shadow: 0 12px 28px rgba(223, 223, 223, 0.4);
}

.favorite-tv-series p {
    padding: 20px;
    margin: 0;
    line-height: 1.5;
    font-size: 25px;
}

.favorite-tv-series-image {
    width: 100%;
    height: 350px;

    object-fit: cover;
    object-position: center 35%;

    display: block;

    transition: transform 0.3s ease;
}

.favorite-tv-series-image:hover {
    transform: scale(1.03);
}

.favorite-game-section {
    width: 650px;
    margin: 40px auto 0 auto;

    border-radius: 6px 6px 0 0;

    text-align: center;
    background-color: rgb(55, 125, 220);
}

.favorite-game-section h2 {
    margin: 0;
    padding: 10px;

    font-size: 30px;
}

.favorite-game {
    width: 650px;
    margin: 0 auto 80px auto;

    border-radius: 0 0 6px 6px;

    text-align: center;
    overflow: hidden;

    background-color: rgb(35, 80, 160);

    transition: box-shadow 0.3s ease;
}

.favorite-game:hover {
    box-shadow: 0 12px 28px rgba(223, 223, 223, 0.4);
}

.favorite-game p {
    padding: 20px;
    margin: 0;
    line-height: 1.5;
    font-size: 25px;
}

.favorite-game-image {
    width: 100%;
    height: 350px;

    object-fit: cover;
    object-position: center 35%;

    display: block;

    transition: transform 0.3s ease;
}

.favorite-game-image:hover {
    transform: scale(1.03);
}


.favorite-music-genre-section {
    width: 650px;
    margin: 40px auto 0 auto;

    border-radius: 6px 6px 0 0;

    text-align: center;
    background-color: rgb(175, 55, 65);
}

.favorite-music-genre-section h2 {
    margin: 0;
    padding: 10px;

    font-size: 30px;
}

.favorite-music-genre {
    width: 650px;
    margin: 0 auto 80px auto;

    border-radius: 0 0 6px 6px;

    text-align: center;
    overflow: hidden;

    background-color: rgb(115, 30, 40);

    transition: box-shadow 0.3s ease;
}

.favorite-music-genre:hover {
    box-shadow: 0 12px 28px rgba(223, 223, 223, 0.4);
}

.favorite-music-genre p {
    padding: 20px;
    margin: 0;
    line-height: 1.5;
    font-size: 25px;
}

.favorite-music-genre-image {
    width: 100%;
    height: 650px;

    object-fit: cover;
    object-position: center 35%;

    display: block;

    transition: transform 0.3s ease;
}

.favorite-music-genre-image:hover {
    transform: scale(1.03);
}

.favorite-artist-section {
    width: 650px;
    margin: 40px auto 0 auto;

    border-radius: 6px 6px 0 0;

    text-align: center;
    background-color: rgb(125, 125, 125);
}

.favorite-artist-section h2 {
    margin: 0;
    padding: 10px;

    font-size: 30px;
}

.favorite-artist {
    width: 650px;
    margin: 0 auto 80px auto;

    border-radius: 0 0 6px 6px;

    text-align: center;
    overflow: hidden;

    background-color: rgb(75, 75, 75);

    transition: box-shadow 0.3s ease;
}

.favorite-artist:hover {
    box-shadow: 0 12px 28px rgba(223, 223, 223, 0.4);
}

.favorite-artist p {
    padding: 20px;
    margin: 0;
    line-height: 1.5;
    font-size: 25px;
}

.favorite-artist-image{
    width: 100%;
    height: 600px;

    object-fit: cover;
    object-position: center 35%;

    display: block;

    transition: transform 0.3s ease;
}

.favorite-artist-image:hover {
    transform: scale(1.03);
}

.favorite-season-section {
    width: 650px;
    margin: 40px auto 0 auto;

    border-radius: 6px 6px 0 0;

    text-align: center;
    background-color: rgb(245, 195, 45);
}

.favorite-season-section h2 {
    margin: 0;
    padding: 10px;

    font-size: 30px;
}

.favorite-season {
    width: 650px;
    margin: 0 auto 80px auto;

    border-radius: 0 0 6px 6px;

    text-align: center;
    overflow: hidden;

    background-color: rgb(190, 140, 25);

    transition: box-shadow 0.3s ease;
}

.favorite-season:hover {
    box-shadow: 0 12px 28px rgba(223, 223, 223, 0.4);
}


.favorite-season p {
    padding: 20px;
    margin: 0;
    line-height: 1.5;
    font-size: 25px;
}

.favorite-season-image{
    width: 100%;
    height: 450px;

    object-fit: cover;
    object-position: center 35%;

    display: block;

    transition: transform 0.3s ease;
}

.favorite-season-image:hover {
    transform: scale(1.03);
}


.favorite-hobby-section {
    width: 650px;
    margin: 40px auto 0 auto;

    border-radius: 6px 6px 0 0;

    text-align: center;
    background-color: rgb(55, 180, 85);
}

.favorite-hobby-section h2 {
    margin: 0;
    padding: 10px;

    font-size: 30px;
}

.favorite-hobby {
    width: 650px;
    margin: 0 auto 80px auto;

    border-radius: 0 0 6px 6px;

    text-align: center;
    overflow: hidden;

    background-color: rgb(35, 125, 60);

    transition: box-shadow 0.3s ease;
}

.favorite-hobby:hover {
    box-shadow: 0 12px 28px rgba(223, 223, 223, 0.4);
}

.favorite-hobby p {
    padding: 20px;
    margin: 0;
    line-height: 1.5;
    font-size: 25px;
}

.favorite-hobby-image{
    width: 100%;
    height: 450px;

    object-fit: cover;
    object-position: center 35%;

    display: block;

    transition: transform 0.3s ease;
}

.favorite-hobby-image:hover {
    transform: scale(1.03);
}


.favorite-country-section {
    width: 650px;
    margin: 40px auto 0 auto;

    border-radius: 6px 6px 0 0;

    text-align: center;
    background-color: rgb(45, 185, 170);
}

.favorite-country-section h2 {
    margin: 0;
    padding: 10px;

    font-size: 30px;
}

.favorite-country {
    width: 650px;
    margin: 0 auto 80px auto;

    border-radius: 0 0 6px 6px;

    text-align: center;
    overflow: hidden;

    background-color: rgb(30, 125, 115);

    transition: box-shadow 0.3s ease;
}

.favorite-country:hover {
    box-shadow: 0 12px 28px rgba(223, 223, 223, 0.4);
}

.favorite-country p {
    padding: 20px;
    margin: 0;
    line-height: 1.5;
    font-size: 25px;
}

.favorite-country-image{
    width: 100%;
    height: 450px;

    object-fit: cover;
    object-position: center 35%;

    display: block;

    transition: transform 0.3s ease;
}

.favorite-country-image:hover {
    transform: scale(1.03);
}

.favorite-animal-section {
    width: 650px;
    margin: 40px auto 0 auto;

    border-radius: 6px 6px 0 0;

    text-align: center;
    background-color: rgb(80, 165, 225);
}

.favorite-animal-section h2 {
    margin: 0;
    padding: 10px;

    font-size: 30px;
}

.favorite-animal {
    width: 650px;
    margin: 0 auto 80px auto;

    border-radius: 0 0 6px 6px;

    text-align: center;
    overflow: hidden;

    background-color: rgb(45, 110, 170);

    transition: box-shadow 0.3s ease;
}

.favorite-animal:hover {
    box-shadow: 0 12px 28px rgba(223, 223, 223, 0.4);
}

.favorite-animal p {
    padding: 20px;
    margin: 0;
    line-height: 1.5;
    font-size: 25px;
}

.favorite-animal-image{
    width: 100%;
    height: 450px;

    object-fit: cover;
    object-position: center 35%;

    display: block;

    transition: transform 0.3s ease;
}

.favorite-animal-image:hover {
    transform: scale(1.03);
}


.page-bottom-space {
    height: 30px;
}

@media (max-width: 600px) {

    .favorite-food-section,
    .favorite-food,
    .favorite-drink-section,
    .favorite-drink,
    .favorite-sport-section,
    .favorite-sport,
    .favorite-movie-section,
    .favorite-movie,
    .favorite-tv-series-section,
    .favorite-tv-series,
    .favorite-game-section,
    .favorite-game,
    .favorite-music-genre-section,
    .favorite-music-genre,
    .favorite-artist-section,
    .favorite-artist,
    .favorite-season-section,
    .favorite-season,
    .favorite-hobby-section,
    .favorite-hobby,
    .favorite-country-section,
    .favorite-country,
    .favorite-animal-section,
    .favorite-animal {
        width: 90%;
    }

    .favorite-food p,
    .favorite-drink p,
    .favorite-sport p,
    .favorite-movie p,
    .favorite-tv-series p,
    .favorite-game p,
    .favorite-music-genre p,
    .favorite-artist p,
    .favorite-season p,
    .favorite-hobby p,
    .favorite-country p,
    .favorite-animal p {
        font-size: 18px;
    }

    .favorite-food-section h2,
    .favorite-drink-section h2,
    .favorite-sport-section h2,
    .favorite-movie-section h2,
    .favorite-tv-series-section h2,
    .favorite-game-section h2,
    .favorite-music-genre-section h2,
    .favorite-artist-section h2,
    .favorite-season-section h2,
    .favorite-hobby-section h2,
    .favorite-country-section h2,
    .favorite-animal-section h2 {
        font-size: 24px;
    }

    .favorite-food-image,
    .favorite-drink-image,
    .favorite-sport-image,
    .favorite-movie-image,
    .favorite-tv-series-image,
    .favorite-game-image,
    .favorite-music-genre-image,
    .favorite-artist-image,
    .favorite-season-image,
    .favorite-hobby-image,
    .favorite-country-image,
    .favorite-animal-image {
        height: 250px;
    }

    body > p {
        font-size: 18px;
        padding: 0 20px;
    }
}