/* Main Size, Colors and Fonts */
body {
    width: 600px;
    margin: 1em auto;
    background-image: url(../media/background.jpg);
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: cover;
    background-color: #eecc88;
    color: #773300;
    border: 10px ridge #e17023;
    text-align: center;
    font-family: "Plus Jakarta Sans", sans-serif;
}

.background {
    background-color: #eecc88;
}

/* Header Styles */
header div {
    display: flex;
    flex-direction: row;
    padding: 10px;
    background-color: #eecc88;
}

.left {
    order: -1;
    margin-right: 20px;
}

.right {
    margin-left: 20px;
}


/* Artists & Celebrities */
.artists {
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    background-color: #cc9955;
    color: #faebd7;
}

figure {
    border: 5px solid #e17023;
    background-color: #e17023;
}

/* Makes images bigger when you hover over them, and animates them slower */
.artists figure:hover {
    transition: transform 0.2s ease-in-out;
    transform: scale(1.1);
}

/* Call to Action Button */
.button {
    display: flex;
    justify-content: center;
}

.button a {
    background-color: #e17023;
    color: #faebd7;
    text-decoration: none;
    padding: 20px 10px 20px 10px;
    border-radius: 10px;
}

.button a:hover {
    background-color: #dd4433;

    /* Makes button bigger when you hover over it, and animates it slower */
    transition: transform 0.2s ease-in-out;
    transform: scale(1.1);
}

/* About */
.about {
    padding: 10px
}

/* Footer */
footer {
    color: #faebd7;
    background-color: #e17023;
    padding: 20px;
}

footer a {
    color: #ffc400;
    text-decoration: none;
}

footer a:hover {
    color: #ffe100;
}

footer a:visited {
    color: #ffb1b1
}