/* Styles for Module 4 Pages started Monday 10.16 */

* {
    margin: 0; padding: 0; border: 0; box-sizing: border-box;
}

body {
    background-color: grey;
    padding-bottom: 600%;
}

#div1, #div2 {
    width: 500px; height:250px;
    border: 40px solid orange;
    margin: 20px auto; /* center this block horizontally on the page */
    text-align: center; /* centers images, too */
}

#div2 {
    border: 40px solid rgb(17, 14, 184);
    background-image: url(../images/Bobcat.png), url(../images/Bobcat-icon.png);
    background-repeat: no-repeat;
    background-size: 100px;
    background-position: left center, right center;
}

#div2 a {
    display: block;
    width: 100%; height: 100%;
}

#div1 img {
    width: 100px;
}

#square-parent {
    display: flex; /* creates a flex parent */
    justify-content: space-around;
    padding: 40px 0;
}

#square-parent div {
    width: 100px; height: 100px;
    border: 4px solid rgb(56, 3, 3);
    /* display: inline-block;  puts items side by side */ 
}