body { background-color: #FCEBB6;
    background-image: url(windingroad.jpg);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    background-position: center;
    color: #221811;
    font-family: Tahoma, Arial, sans-serif;
    box-sizing: border-box;
}
#wrapper { width: 80%;
    min-width: 900px;
    max-width: 1280px;
    box-shadow: 2px 2px 5px 3px;
    margin-right: auto;
    margin-left: auto;
    background-color: #231814;
    padding: 0;
}
header { background-color: #D2B48C;
    color: #231814;
    background-image: url(javajamlogo.jpg);
    background-size: 200px;
    background-position-y: center;
    background-repeat: no-repeat;
    padding-left: 240px;
    padding-top: 5px;
    padding-bottom: 5px;
}
header a { text-decoration: none;}
header a:link { color: #231814;}
header a:visited { color: #231814}
header a:hover { color: #FEF6C2;}
h1 { background-color: #D2B48C;
    font-size: 3em;
}
h2 { color: #8C3826;}
h3 { color: #8C3826;}
h4 { background-color: #D2B48C;
    text-transform: capitalize;
    border-bottom: 3px inset #9e8e78;
    font-size: 1.2em;
    padding-left: 0.5em;
    padding-bottom: 0;
    clear: left;
    box-shadow: 0px 1px 5px 0;
}
nav { font-weight: bold;
    font-size: 1.5em;
    float: left;
    width: 200px;
}
nav a { text-decoration: none;}
nav a:link { color: #FEF6C2;}
nav a:visited { color: #D2B48C}
nav a:hover { color: #CC9933;}
nav ul { list-style-type: unset;}
dt { font-weight: bold;
    color: #8C3826;
}
li { padding-left: 20px;}
footer { font-size: 0.6em;
    padding: 1em;
    text-align: center;
    font-style: italic;
    background-color: #D2B48C;
    border-top: 2px solid #8C3826;
}
main { padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    margin-left: 200px;
    background-color: #FEF6C2;
    overflow: auto;
}
main h2 { padding-left: 3em;
    padding-right: 2em;
}
main h3 { padding-left: 3em;
    padding-right: 2em;
}
main h4 { padding-left: 3em;
    padding-right: 2em;
}
main p { padding-left: 3em;
    padding-right: 2em;
}
main div { padding-left: 3em;
    padding-right: 2em;
}
main ul { padding-left: 3em;
    padding-right: 2em;
}
main dl { padding-left: 3em;
    padding-right: 2em;
}
#details { padding-left: 20%;
    padding-right: 20%;
    text-align: center;
    overflow: auto;
}
#homehero { height: 300px;
    background-image: url(windingroad.jpg);
    background-size: 100%100%;
    background-repeat: no-repeat;
}
#heromugs { height: 300px;
    background-image: url(mugs.jpg);
    background-size: 100%100%;
    background-repeat: no-repeat;
}
#heroguitar { height: 300px;
    background-image: url(guitar.jpg);
    background-size: 100%100%;
    background-repeat: no-repeat;
}
.floatleft { float: left;
    padding-right: 2em;
    padding-bottom: 2em;
}
.onethird { float: left;
    width: 33%;
    padding-left: 0;
    padding-right: 0;
    padding-top: 2em;
    padding-bottom: 2em;
}
header, nav, main, footer { display: block;}