* { margin: 0; padding: 0 }
html, body { 
    font-family: "Bookman Old Style" "Georgia", sans-serif;
    background: white url(images/layout/background.jpg) top center }
body, a { color: #804000; text-decoration: none }
a:hover { text-decoration: underline }
h3 { font-size: 29px }
h2 { margin: 30px 0 5px 0; font-size: 30px }
h3 { margin: 5px 0 }
ul { margin: 1.2em 30px }
dt { padding-left: 3ex; font-weight: bold; float: left }
dt:after { content: " - "; font-weight: normal }
* html dt { 
    margin-right: 5px; padding-right: 11px; 
    background: url(images/layout/hyphen.png) no-repeat center right }
p, dd { margin: 1.2em 0 }
p { text-indent: 3ex }

h1 { 
    height: 130px; text-indent: -1000ex; overflow: hidden; 
    background: url(images/content/logo.png) no-repeat center }

#pattern { 
    position: absolute; top: 131px; width: 100%; height: 251px; 
    background: url(images/layout/pattern.jpg) repeat-x bottom center }

.paper, .paper .top, .paper .bottom, .paper .left, .paper .right { 
    position: absolute; background: url(images/layout/paper.jpg) no-repeat }
.paper { 
    top: 48px; left: 50%; width: 640px; margin-left: -320px;
    background: url(images/layout/paper_tile.jpg) repeat-y }
.paper .content { padding: 20px; font-size: 16px }
* html body .paper { height: 1% }
.paper .top { top: -39px; left: -38px; width: 737px; height: 39px }
.paper .left { 
    top: auto; left: -38px; width: 38px; height: 83px; 
    background-position: -737px 0 }
.paper .right { 
    top: auto; left: auto; right: -59px; width: 59px; height: 83px; 
    background-position: top right !important }
.paper .bottom { 
    bottom: -60px; left: -38px; width: 737px; height: 60px; 
    background-position: bottom left }
.paper .pattern { top: 83px; height: 251px; background: url(images/layout/pattern.jpg) }
.paper .shadow { height: 100%; background: url(images/layout/shadow.jpg) }

.toc { margin: 1em 0; font-size: 1.3em; text-align: center }

.mainpage h2, h3 { text-align: center }
.mainpage h2 { margin: 80px 0 5px 0; text-transform: uppercase }
.mainpage h3 { margin: 5px 0 80px 0; text-transform: lowercase }
.mainpage ul { 
    margin: 90px 0 90px 60px; font-size: 29px; font-weight: bold; 
    text-align: left; list-style-type: none }
.mainpage li { 
    padding: 15px 0 15px 30px; 
    background: url(images/layout/marker.png) no-repeat left center }

.thumbnail { 
    display: block; display: inline; float: left; 
    width: 201px; height: 154px; margin: .5em 1em 0 0;
    background: url(images/content/thumbnails.jpg) }
.design p, .design dd { margin: 5px 0; text-indent: 0 }
.design dt { padding-left: 0 }
.design dt:after { content: ": "; font-weight: bold }
* html .design dt { 
    padding-right: 5px;
    background: url(images/layout/colon.png) no-repeat 70% right }
#petronetwork { background-position: top left }
#petronetwork:hover { background-position: bottom left }
#tesall { background-position: top center }
#tesall:hover { background-position: bottom center }
#chashchinski { background-position: top right }

#blues { background-image: url(images/content/other.jpg) }
#blues:hover { background-position: bottom }
#chashchinski:hover { background-position: bottom right }

#glassmen { background-image: url(images/content/glassmen.jpg) }
#glassmen:hover { background-position: bottom }

#balero { background-image: url(images/content/balero.jpg) }
#balero:hover { background-position: bottom }