/* Author:Nathaniel Madden Date:02/26/2025 File Name:styles.css */
 
/* CSS Reset */
body, header, nav, main, footer, img, h1, h3 { 
    margin: 0; 
    padding: 0; 
    border: 0; 
}
 
/* Style rule for body and images */
body { 
    background-color: #f6eee4; 
}
 
img { 
    max-width: 100%; 
    display: block; 
}
 
/* Style rules for mobile viewpoint */
.mobile { 
    display: block; 
}
 
.tab-desk { 
    display: none; 
}
 
/* Style rules for header area */
.mobile h1 { 
    padding: 2%; 
    text-align: center; 
    font-family: 'Emblema One', sans-serif; 
}
 
.mobile h3 { 
    padding: 2%; 
    text-align: center; 
    font-family: 'Lora', sans-serif; 
}
 
/* Style rules for navigation area */
nav { 
    background-color: #2a1f14; 
}
 
nav ul { 
    list-style-type: none; 
    margin: 0; 
    text-align: center; 
}
 
nav li { 
    display: inline-block; 
    font-size: 1.5em; 
    font-family: Geneva, Arial, sans-serif; 
    font-weight: bold; 
}
 
nav li a { 
    display: block; 
    color: #f6eee4; 
    padding: 0.5em 2em; 
    text-decoration: none; 
}
 
/* Style rules for main content */
main { 
    padding: 2%; 
    font-family: Verdana, Arial, sans-serif; 
}
 
main p { 
    font-size: 1.25em; 
}
 
main h3 { 
    padding: 2%; 
}
 
main ul { 
    list-style-type: square; 
}
 
.link { 
    color: #4d3319; 
    text-decoration: none; 
    font-weight: bold; 
    font-style: italic; 
}
 
.action { 
    font-size: 1.75em; 
    font-weight: bold; 
    text-align: center; 
}
 
.round {
    border-radius: 6px;
}
 
#contact { 
    text-align: center; 
}
 
.tel-link {
    background-color: #2a1f14;
    padding: 2%;
    width: 80%;
    margin: 0 auto;
}
 
.tel-link a {
    color: #f6eee4;
    text-decoration: none;
    font-weight: bold;
}
 
/* Style rules for footer content */
footer { 
    text-align: center; 
    font-size: 0.85em; 
    background-color: #2a1f14; 
    color: #f6eee4; 
    padding: 1% 0%; 
}
 
#info ul {
    margin-left: 10%;
}
 
footer a { 
    color: #f3e6d8; 
    text-decoration: none; 
}
 
/* Media Query for Tablet Viewport */
@media screen and (min-width: 620px), print {
    /* Tablet Viewport: Show tab-desk class, hide mobile class */
    .tab-desk {
        display: block;
    }
 
    #wrapper {
        width: 1920px;
        margin: 0 auto;
    }
 
    main {
        background-color: #f6eee4;
    }
}
 
/* Media Query for Print */
@media print {
    body {
        background-color: white;
        color: black;
    }
}