/* CSS Document used for the coffee table homework assignment
Author: Justin Zeigler
Course: ITWP 1000
File: styles.css
Information on using external CSS style sheet is located in Chapter 3. Information on media queires is located in chapter 7. Information on tables and CSS formatting for tables is located in Chapter 8.
*/

/* General Styling */
body {
    margin-top: 1em;
    margin-bottom: auto;
    font-family: Arial, sans-serif;
}

h1 {
    text-align: center;
    font-size: 2.5em;
}

p, div {
    margin: 10px;
    padding: 20px;
    line-height: 1.5em;
}

/* Table Formatting */
table {
    margin: auto;
    border: 5px solid #3f2a14;
    width: 100%;
    border-spacing: 0;
}

td, th {
    border-style: none;
    padding: 0.5em;
    width: auto;
}

tfoot td {
    font-size: 9px;
    font-style: italic;
    text-align: center;
}

/* Zebra Striping for Table Rows */
tr:nth-of-type(even) {
    background-color: #eaeaea;
}

/* Styling for First Row in the Header */
thead:first-of-type {
    background-color: #3f2a14;
    color: #FFF;
}

/* Caption Styling */
caption {
    font-family: Impact, "Franklin Gothic Bold", "Arial Black", "sans-serif";
    font-weight: bold;
    font-size: 1.75em;
    padding-bottom: 0.5em;
}

/* Responsive Image */
.responsive {
    max-width: 100%;
    height: auto;
    border: 1px solid #51471A;
    border-radius: 10px;
}

/* Specialty and Price Columns */
td.price {
    white-space: nowrap;
}

td.specialty {
    white-space: nowrap;
}

/* Footer Validation */
#validation {
    text-align: center;
}

/* Media Query - Hide Image for Small Screens */
@media only screen and (max-width: 550px) {
    img {
        display: none;
    }
}