/*  ------------------------------------------------------

Stylesheet zu www.harrys-tattoo.de
2005
*  *  *  *
Design: www.viridis.de //

DIE CSS-DEFINITIONEN SIND NACH CSS2 VALIDIERT UND FUER AKTUELLE
BROWSERVERSIONEN OPTIMIERT UND GETESTET.

--------------------------------------------------------*/

/* 				Used Colors:                                                 			*/
/*  ------------------------------------------------------
BASICS
--------------------------------------------------------*/
* {margin: 0; padding: 0;}

body {
color: #312D26;
font: 100.1% "Helvetica", "Verdana", "Arial", sans-serif;
background: #6A6054 url(/img/bg.jpg) 0 0 !important;
}

table, tr, th, td, img, fieldset {border: 0 none;}

img {
vertical-align: middle;
}

table {
border-collapse: collapse;
border-spacing: 0;
}

q:before, q:after,
blockquote:before, blockquote:after {
content: "";
}

ul, ol {
list-style-type: none;
}

/*  ------------------------------------------------------
COMMON CLASSES
--------------------------------------------------------*/
.hidden {
position: absolute;
left: -3000px;
top: -1000px;
}

.floatLeft {
float: left;
margin: 0 18px 18px 0;
padding: 0 !important;
}

.floatRight {
float: right;
}

.clear {
clear: both;
height: 0;
font-size: 0;
overflow: hidden;
}

/*  ------------------------------------------------------
HEADER
--------------------------------------------------------*/
div.header {
background: #2F291F url(/img/headerbg.jpg) repeat-x 0 0;
}

div.headerCont {
background: url(/img/header.png) no-repeat 0 0;
height: 158px;
width: 760px;
margin: 0 auto;
}

/*  ------------------------------------------------------
LOGO
--------------------------------------------------------*/
div.logo {
width: 147px;
height: 106px;
background: url(/img/dragon.png) no-repeat 0 0;
position: absolute;
z-index: 10000;
top: -89px;
left: 316px;
}

/*  ------------------------------------------------------
CONTENT
--------------------------------------------------------*/
div.content {
background: #fff;
}

div.contentCont {
width: 760px;
margin: 0 auto 0 auto;
position: relative;
z-index: 0;
padding: 40px 0 24px 0;
}

/*  ------------------------------------------------------
TYPOGRAPHIE
--------------------------------------------------------*/
h2.welcome,
h2.gal,
h2.tattoo,
h2.contact,
h2.impressum {
height: 22px;
width: 400px;
margin: 0 0 12px 0;
}

h2.welcome { background: url(/img/head_welcome.gif) no-repeat 0 0;}
h2.gal { background: url(/img/head_gallery.gif) no-repeat 0 0;}
h2.tattoo { background: url(/img/head_tattoo.gif) no-repeat 0 0;}
h2.contact { background: url(/img/head_contact.gif) no-repeat 0 0;}
h2.impressum { background: url(/img/head_impressum.gif) no-repeat 0 0;}

div.contentCont p,
div.contentCont address {
padding: 12px 64px 12px 0;
font-size: 13px;
font-style: normal;
}

div.contentCont p a {
text-decoration: none;
color: #85401D;
border-bottom: #312D26 1px solid;
}

div.contentCont p a:hover {
color: #FF7D31;
}

div.contentCont p a.go {
background: url(/img/go.gif) no-repeat 0 60%;
padding: 0 0 0 26px;
}

div.contentCont p acronym {
color: #6C6456
border-bottom: #6C6456 dashed 1px;
}

/*------------------------------------------------------
GALLERY
--------------------------------------------------------*/
div.galTop {
background: url(/img/bg_bot.gif) repeat-x 0 0;
}

div.galBot {
background: url(/img/bg_bot.gif) repeat-x bottom right;
padding: 20px 0 10px 14px;
}

ul#gallery li {
float: left;
margin: 0 10px 10px 0;
}

ul#gallery li a img {
padding: 2px;
border: #302B25 1px solid;
}

ul#gallery li a {
text-decoration: none
}

/*  ------------------------------------------------------
DOLLS
--------------------------------------------------------*/
div#doll1,
div#doll2,
div#doll3 {
position: absolute;
height: 90px;
width: 84px;
visibility: hidden;
cursor: move !important;
}

div#doll1 { background: url(/img/doll1.png) no-repeat 0 50%; }
div#doll2 { background: url(/img/doll2.png) no-repeat 0 50%; }
div#doll3 { background: url(/img/doll3.png) no-repeat 0 50%; }

/*  ------------------------------------------------------
IMPRESSUM
--------------------------------------------------------*/
div.impressum {
margin: 12px 0 0 0;
border-left: #696057 1px solid;
float: left;
width: 460px;
}

div.addressBlock {
float: left;
width: 260px;
text-align: right;
}

div.addressBlock p,
div.addressBlock address {
padding: 12px 24px 12px 0;
}


h3 {
font-size: 10px;
padding: 0 0 6px 8px;
}

ol.impressum {
padding: 0 0 0 8px;
}

ol.impressum li {
font-size: 10px;
margin: 0 0 12px 0;
}

ol.impressum li strong {
color: #EB661F;
font-weight: normal;
}

/*  ------------------------------------------------------
FOOTER
--------------------------------------------------------*/
div.footer {
background: url(/img/footerbg.gif) repeat-x 0 0;
padding: 20px 0 0 0;
}

div.footer ol {
width: 760px;
margin: 0 auto;
}

div.footer ol li.footInfo {
float: left;
width: 150px;
}

div.footer ol li.footNote {
float: left;
width: 460px;
text-align: center;
}

div.footer ol li.footNote strong {
display: block;
background: url(/img/footNote.gif) 0 0;
width: 132px;
height: 21px;
margin: 0 auto 12px auto;
}

div.footer ol li.footLinks {
float: left;
width: 150px;
text-align: right;
}

div.footer p,
div.footer address {
color: #3B3631;
font-size: 10px;
line-height: 130%;
font-style: normal;
}

div.footer p a {
color: #3B3631;
text-decoration: underline;
}

/*anchor*/
p.anchor {
padding: 12px 0 24px 0;
}

p.anchor a {
display: block;
margin: 0 auto;
height: 22px;
width: 22px;
background: url(/img/tot.gif) 0 0;
}