/*
STYLESHEET FOR JPW TATTOO 2008

ToC:
	1. DEFAULTS
	2. STRUCTURE
	3. LINKS AND NAVIGATION
	4. FONTS
	5. IMAGES

Notes:
	Använder !important hack för min-height.
*/

/* --------------- 1. DEFAULTS --------------- */

* {
margin: 0;
padding: 0;
}

body {
font: 62.5% gill sans, arial, sans-serif; /* 62.5% resets 1em to 10px */
color: #000;
background: url(../bilder/bg2.jpg) repeat-x #FFFFFF top left;
text-align:center;
}

span {															/* döljer tagg */
display: none;
}

.clear {
clear:both;
}

/* --------------- 2. STRUCTURE --------------- */

#wrapper {
margin: 0 auto;
width: 1000px;
padding-top:24px;
padding-bottom:24px;
text-align:left;
}

#logo_holder {
float: left;
width: 600px;
height:143px;
background: url(../bilder/logo.jpg) #000 no-repeat top left;
}

#content_wrapper {
float: left;
width:600px;
background-color: #FFF;
}

#content {
float:left;
width: 100%;
background-color: #FFF;
padding-bottom: 40px;
}

.prislista #content {
background: url(../bilder/tattoogun.jpg) #FFF no-repeat center right;
}

#left_image {
width: 200px;
float:left;
height: 500px;
background: url(../bilder/left_image.jpg) no-repeat top right;
}

#right_image {
width: 200px;
height: 500px;
float: left;
background: url(../bilder/right_image.jpg) no-repeat top left;
}

#galleri {
margin: 0 auto;
margin-top: 20px;
width: 520px;
}

#footer {
clear:both;
float: left;
width: 600px;
height: 35px;
background: #FFF;
border-top: 3px solid #000;
text-align:center;
line-height:3.2em;
}



/* --------------- 3. LINKS AND NAVIGATION --------------- */

ul#main_nav {
float:left;
padding-left: 0;
margin-left: 0;
width: 600px;
list-style:none;
background-color:#FFFFFF;
border-bottom: 3px solid #000;
text-align:center;
}

ul#main_nav a {
padding: 9px 15px 8px 15px;
margin-right:5px;
text-decoration: none;
}

#main_nav li {
display: inline;
}

#main_nav li a {
font-size: 1.1em;
line-height: 3em;
color: #000;
width: 9em;
}

#main_nav li a:hover {
background: #880202;
color:#FFF;
}

ul#hygien {
padding-left: 40px;
padding-right: 48px;
padding-bottom:10px;
margin-left: 0;
background-color:#FFFFFF;
list-style-position:inside;
list-style-type:square;
}

#h1_valkommen {																/* ersätter H1-tagg med bild */
background: url(../bilder/h1_valkommen.jpg) no-repeat;
width: 260px;
height: 75px;
text-indent: -9999px;
}

#h1_galleri {																/* ersätter H1-tagg med bild */
background: url(../bilder/h1_galleri.jpg) no-repeat;
width: 300px;
height: 55px;
text-indent: -9999px;
}

#h1_skotselrad {															/* ersätter H1-tagg med bild */
background: url(../bilder/h1_hygienrutin.jpg) no-repeat;
width: 350px;
height: 50px;
text-indent: -9999px;
}

#h1_prislista {																/* ersätter H1-tagg med bild */
background: url(../bilder/h1_prislista.jpg) no-repeat;
width: 350px;
height: 54px;
text-indent: -9999px;
}

#h2_oppettider {															/* ersätter H2-tagg med bild */
background: url(../bilder/h2_oppettider.jpg) no-repeat;
width: 200px;
height: 26px;
text-indent: -9999px;
}

#h2_vagbeskrivning {														/* ersätter H2-tagg med bild */
background: url(../bilder/h2_vagbeskrivning.jpg) no-repeat;
width: 260px;
height: 26px;
text-indent: -9999px;
}

#h2_tatuering {																/* ersätter H2-tagg med bild */
background: url(../bilder/h2_tatuering.jpg) no-repeat;
width: 150px;
height: 26px;
text-indent: -9999px;
}

#h2_piercing {																/* ersätter H2-tagg med bild */
background: url(../bilder/h2_piercing.jpg) no-repeat;
width: 150px;
height: 26px;
text-indent: -9999px;
}

.start #main_nav .start a, .galleri #main_nav .galleri a, .skotselrad #main_nav .skotselrad a, .prislista #main_nav .prislista a  { 				 					/*-- markerar aktuell sida --*/
background: #880202;
color:#FFF;
}


/* --------------- 4. FONTS --------------- */
h1 {
font-family: arial;
font-size: 1.6em;
font-weight:bold;
margin-top:30px;
margin-left: 40px;
margin-right: 35px;
margin-bottom:15px;
}

h2 {
font-size: 1.3em;
font-weight: bold;
margin-left: 40px;
margin-right: 48px;
margin-top: 5px;
color: #880202;
}

h3 {
font-size: 1.2em;
font-weight: normal;
margin-left: 40px;
margin-right: 48px;
padding-top:10px;
padding-bottom: 30px;
color: #000;
}

p {
margin-bottom: 10px;
margin-left: 40px;
margin-right: 48px;
margin-top: 5px;
}

.recept {font-weight: bold; text-transform: uppercase;}

/* --------------- 5. IMAGES --------------- */

#galleri img {
float:left;
margin-right:20px;
margin-bottom:20px;
border:none;
}

.last {margin-right: 0px;}