@media all
{
    body
    {
        font-family: sans-serif;
        padding         : 0;
        margin          : 170px 4% 0 4%;
        line-height     : 1.5em;
        letter-spacing  : 0.02em;
        background      : white;
    }

    li ul {
        border-left: 1px dotted black;
    }
    ul li {
        list-style-type: square;
        margin-left: 0.2em;
    }

    address {
        font-style: normal;
    }

    code, pre
    {
        display         : block;
        border          : 1px dashed black;
        padding         : 1em;
        overflow        : auto;
        margin          : 1em;
    }

    a:link
    {
        text-decoration : none;
        color           : #596e9d;
        margin          : 0 0.2em;
    }
    a:visited
    {
        text-decoration : none;
        color           : #091e4d;
        margin          : 0 0.2em;
    }
    a:hover, a:focus
    {
        text-decoration : none;
        color           : #00f;
    }
    a img {
        border: none;
    }

    dt a:link, dt a:visited, dt a:focus
    {
        text-decoration : none;
        color           : black;
    }
    dt a:hover
    {
        text-decoration : none;
        color           : gray;
    }

    h1, h2, h3, h4, h5, h6
    {
        color           : #596e9d;
    }
    h1 {
        color: black;
        font-size: 1.4em;
    }
    h2 {
        font-size: 1.2em;
        border-bottom: 1px dashed #596e9d;
    }
    h3 {
        font-size: 1.1em;
        border-bottom: 1px dashed #596e9d;
    }

    h1 a:link, h1 a:visited, h1 a:focus,
    h2 a:link, h2 a:visited, h2 a:focus,
    h3 a:link, h3 a:visited, h3 a:focus,
    h4 a:link, h4 a:visited, h4 a:focus,
    h5 a:link, h5 a:visited, h5 a:focus,
    h6 a:link, h6 a:visited, h6 a:focus
    {
        color           : #091e4d;
        text-decoration : none;
    }

    p, ul, ol, dl, table 
    {
        text-align      : justify;
        margin-left     : 0;
	}
    table {
        text-align: left;
    }
    table th {
        font-weight: bold;
        padding-right: 1em;
    }

    dl dt
    {
        font-weight     : bold;
        border-bottom   : 1px dashed black;
        margin-bottom   : 0.5em;
    }

    table.image td {
        margin: 1em;
        padding: 0.5em;
        border: none;
    }

    textarea.error, input.error, p.error {
        border: 1px solid red;
    }
    p.error, th.error {
        color: red;
    }
    p.success {
        color: green;
        border: 1px solid green;
    }
    p.error, p.success {
        padding: 0.5em;
    }

	div#content {
        margin: 1em 0 1em 18em;
        position:absolute;
        padding: 0 0 0 2em;
        top: 190px;
        right: 4%;
        min-width: 60%;
    }
    div#content h1 { margin-top:0; }

    ul.infoline, ul.infoline li {
        margin: 2em 0 0 0;
        padding: 0 0.3em;
        ist-style-type: none;
    }
    ul.infoline li {
        display: inline;
        border-right: 1px solid gray;
        padding-right: 0.5em;
    }
    ul.infoline {
        font-weight     : bold;
        font-size       : 0.8em;
        border          : dotted gray;
        border-width    : 1px 0;
    }

    p#logo {
        position: absolute;
        top: 0;
        right: 4%;
    }

    ul#menu li {
        width: 100%;
        margin: 0.2em 0 0.4em 0.2em;
        padding: 0;
        list-style-type: none;
    }
    ul#menu li.active a {
        width: 90%;
        background: #ddd;
    }
    ul#menu li a {
        display: block;
        width: 80%;
        padding: 0.2em 0.2em 0.2em 0.4em;
        background: #eee;
    }
    ul#menu li a:hover {
        display: block;
        width: 90%;
        padding: 0.2em 0.2em 0.2em 0.4em;
        background: #ccf;
    }
    ul#menu {
        padding: 0.2em 0 0 0;
        list-style-type: none;
        border: dotted gray 1px;
        width: 100%;
    }

    div#leftbox {
        position:absolute;
        padding: 0 1em 0 0;
        top: 190px;
        left: 4%;
        width: 15em;
    }

    div#shopbox {
        border: dotted gray 1px;
        width: 100%;
        padding: 0;
    }
    div#shopbox h2 {
        margin: 0.2em 5% 0 5%;
        width: 90%;
        font-size: 0.9em;
    }
    div#shopbox p {
        margin: 5%;
    }

    #content img {
        margin: 1em;
    }

    table.shop th, table.shop td {
        border-right: 1px dotted #596e9d;
        padding-left: 1em;
    }
    table.shop th {
        text-align: center;
    }
    table.list td, table.list th {
        border-bottom: 1px dotted #596e9d;
        padding: 1em 1em 1em 0;
    }
    table td.price {
        text-align: right;
        padding-right: 1em;
        white-space: nowrap;
    }
    table tr.sum td {
        border-top: 2px solid black;
        padding-top: 0.2em;
        font-weight: bold;
    }
    p.shopbutton {
        text-align: right;
    }

    ul.productphotos {
        margin: 0;
        padding: 0;
    }
    ul.productphotos li {
        display: inline;
        padding: 0;
    }
    ul.productphotos img {
        margin: 0 2em 2em 0;
    }

    #print {
        display: none;
    }
}

@media print {
    body {
        margin: 1em;
        padding: 1em;
    }
    div#content {
        left: 0;
        top: 0;
        margin: 0;
    }
    div#content p {
        text-align: left;
    }
    #print {
        display: block;
        margin-top: 1em;
        padding-top: 1em;
        border-top: 1px solid black;
    }
    div#shopbox, p#logo, ul#menu, ul.infoline {
        display: none;
    }
}