/*============================== Generic Elements ==============================*/
* {
    color: #25282e;
}

a {
    color: #444;
    text-decoration: none;

    transition: all 0.5s;
}

a:hover {
    color: #c1b696;
}

ul {
    padding-left: 0;

    list-style: none;
}

main {
    padding: 1rem;

    color: #555;
}

/*============================== Generic Classes ==============================*/
.fit-image {
    background-size: cover;
    background-position: center;
}

.btn {
    background-color: #25282e;

    color: #fff;
}

.art-card {
    background-color: #fff;

    width: 400px;
    max-width: 50%;
    min-width: 225px;

    position: absolute;
    left: 1rem;
    bottom: 1rem;

    padding: 1rem;
}

/*============================== Page - Top to Bottom ==============================*/
/* HEADER */
.header__intro {
    border-bottom: 1px solid #ccc;
    padding: 0.5rem;
}

    .header__mark {
        display: flex;
    }

    .header__mark__logo {
        width: 40px;

        margin-right: 0.5rem;
    }

.header__nav {
    padding: 0.5rem;
}

    .header__item {
        max-width: fit-content;
    }
    
    .header__item__link {
        color: #444;

        transition: all 0.25s;
    }

        .header__item__link:hover {
            color: #c1b696;
        }

/* MAIN ART */
.main-art {
    background-image: url("../images/g_1.jpg");
    
    height: 500px;

    position: relative;
}

/* ARTS */
.arts__title {
    margin: 2rem;
}

.arts__art {
    margin-bottom: 3rem;
}

    .arts__art__image {
        height: 300px;

        margin-bottom: 1rem;
    }

        .arts__art__image--1 {
            background-image: url("../images/g_2.jpg");
        }
        .arts__art__image--2 {
            background-image: url("..//images/g_3.jpg");
        }
        .arts__art__image--3 {
            background-image: url("..//images/g_4.jpg");
        }
        .arts__art__image--4 {
            background-image: url("..//images/g_5.jpg");
        }
        .arts__art__image--5 {
            background-image: url("..//images/g_6.jpg");
        }

/* FOOTER */
.footer {
    border-top: 1px solid #ccc;
}

    .footer > * {
        margin: 2.5rem;
    }

    .footer__link i {
        font-size: 1.25rem;

        transition: all 0.25s;
    }

    .footer__link:hover i {
        color: #c1b696;
    }