/* aysels.se - ver 0.7 - 2007-05-13 */

* {
	font-family: Georgia, "Times New Roman", Times, serif ;
	}  

body {
	font-size: 76%; 
	background-color: #fff; 
	margin: 2px; 
	padding: 2px; 
	background-image: url(../grafik/pattern_062.gif);
	}


/* Container ----------------------------- */


#container {
	position:relative;
	width: 870px;
	\width: 890px;	
	w\idth: 870px;	
	border: 1px solid #666;	
	overflow: visible;
	margin: 20px auto 10px auto;
	padding: 8px; 
	background: #fff;
	voice-family: "\"}\""; 
	voice-family: inherit;
	overflow:hidden;
	}

strong, b { 
	font-weight: bold; 	
	}

p {	
	margin-bottom: 10px; 
	margin-top: 0; 
	}
	
h2 {
	background-color: transparent; 
	margin-top: 10px; 
	padding-bottom: 5px; 
	color:#01196E; 
	font: normal 1.6em; 
	}
	
h3 {
	background-color: transparent;
	margin-top: 10px;	
	padding-bottom: 0; 
	margin-bottom: 5px; 
	color:#01196E;
	font-size: bold 1.2em Arial, Helvetica, sans-serif; 
	}


/* Formulär -------------------- */


form {
	margin: 0; 
	padding: 0;
	}

input, textarea {
	font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	}

input.button { 
	background: #666; 
	border: 1px solid #333;	
	color: #fff; 
	font-size: 1.1em; 
	padding: 2px;
	}
	
input.button:hover { 
	background: #333; 
	border: 1px solid #666;
	color: #fff; 
	}
	
input.text { 
	background: #fff; 
	border: 1px solid #ccc;
	color: #333; 
	font-size: 1.0em; 
	padding-left: 3px; 
	width: 248px;
	}
	
input.text:focus { 
	background: #efefef; 
	border: 1px solid #ED2D00; 
	color: #000;
	}

textarea {	
	background: #fff; 
	border: 1px solid #ccc;
	color: #333; 
	font-size: 1.0em; 
	padding-left: 3px; 
	width: 248px;
	}

textarea:focus { 
	background: #efefef; 
	border: 1px solid #ED2D00; 
	color: #000;
	}

.obligatoriskt { 
	color: #ED2D00; 
	cursor: help;
	}
	
		
/* Sidhuvud -------------------- */


#index_film {
	background: transparent;
	position: absolute;
	text-align:left;
	top: 52px;
	right: 23px;
	width: 440px;
	height: 250px;
	}


#banner_index {clear: both; padding: 0; background: transparent url(../grafik/head/banner57.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_index h1{position:absolute; top:166px; left:17px; padding-top:0; width:370px; height:141px; text-indent:-9999px; margin:0;}

#banner_produkter {clear: both; padding: 0; background: transparent url(../grafik/head/banner39.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_produkter h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_kontakt {clear: both; padding: 0; background: transparent url(../grafik/head/banner37.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_kontakt h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_om {clear: both; padding: 0; background: transparent url(../grafik/head/banner6.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_om h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_aloevera {clear: both; padding: 0; background: transparent url(../grafik/head/banner50.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_aloevera h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_behandling {clear: both; padding: 0; background: transparent url(../grafik/head/banner36.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_behandling h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_nyheter {clear: both; padding: 0; background: transparent url(../grafik/head/banner38.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_nyheter h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_man {clear: both; padding: 0; background: transparent url(../grafik/head/banner44.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_man h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_manikyr {clear: both; padding: 0; background: transparent url(../grafik/head/banner47.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_manikyr h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_makeup {clear: both; padding: 0; background: transparent url(../grafik/head/banner45.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_makeup h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_dermanord {clear: both; padding: 0; background: transparent url(../grafik/head/banner52.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_dermanord h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_exuviance {clear: both; padding: 0; background: transparent url(../grafik/head/banner53.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_exuviance h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_ansikte {clear: both; padding: 0; background: transparent url(../grafik/head/banner40.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_ansikte h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_babor {clear: both; padding: 0; background: transparent url(../grafik/head/banner51.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_babor h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_soldusch {clear: both; padding: 0; background: transparent url(../grafik/head/banner14.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_soldusch h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_trad {clear: both; padding: 0; background: transparent url(../grafik/head/banner35.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_trad h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_massage {clear: both; padding: 0; background: transparent url(../grafik/head/banner46.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_massage h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_diatermi {clear: both; padding: 0; background: transparent url(../grafik/head/banner41.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_diatermi h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_idmakeup {clear: both; padding: 0; background: transparent url(../grafik/head/banner55.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_idmakeup h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_gliamati {clear: both; padding: 0; background: transparent url(../grafik/head/banner54.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_gliamati h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_pedikyr {clear: both; padding: 0; background: transparent url(../grafik/head/banner56.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_pedikyr h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_lhe {clear: both; padding: 0; background: transparent url(../grafik/head/banner43.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_lhe h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_vaxning {clear: both; padding: 0; background: transparent url(../grafik/head/banner48.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_vaxning h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}

#banner_fransar {clear: both; padding: 0; background: transparent url(../grafik/head/banner42.jpg) no-repeat; height: 270px; width: 870px; border-bottom: 5px solid #01196E;}
#banner_fransar h1{position:relative; top:130px; left:490px; padding-top:0; width:370px; height:130px; text-indent:-9999px; margin:0;}


		
/* Navigation ---------------------- */ 	
		
/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/simple_vertical.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */

/* Add a margin - and a relative position with a high z-index to make it appear over any element below */
#menu_container {margin:0; position:relative; width:100%; height:35px; z-index:500; background:#01196E; background-image: url(../grafik/nav_bg.gif);}

/* Get rid of the margin, padding and bullets in the unordered lists */
#pmenu, #pmenu ul {padding:0; margin:0; list-style-type: none;}

/* Set up the link size, color and borders */
#pmenu a, #pmenu a:visited {display:block; font-family:Arial, Helvetica, sans-serif; font-size: 0.9em; width:144px; text-transform: uppercase; color:#fff; height:35px; line-height:34px; text-decoration:none; text-indent:5px; border-right:1px dotted #ccc;  }

/* Set up the sub level borders */
#pmenu li ul li a, #pmenu li ul li a:visited {border-left:1px dotted #ccc; border-bottom: 1px dotted #ccc;}
#pmenu li a.enclose, #pmenu li a.enclose:visited {border-width:1px;}

/* Set up the list items */
#pmenu li {float:left; background:#01196E; background-image: url(../grafik/nav_bg.gif);}

/* For Non-IE browsers and IE7 */
#pmenu li:hover {position:relative;}

/* Make the hovered list color persist */
#pmenu li:hover > a {background:#496FAA; background-image: url(../grafik/nav_act.gif); color:#fff; }

/* Set up the sublevel lists with a position absolute for flyouts and overrun padding. The transparent gif is for IE to work */
#pmenu li ul {display:none;}

/* For Non-IE and IE7 make the sublevels visible on list hover. This is all it needs */
#pmenu li:hover > ul {display:block; position:absolute; top:-11px; left:80px; padding:20px 30px 30px 30px; background:transparent url(transparent.gif);}

/* Position the first sub level beneath the top level liinks */
#pmenu > li:hover > ul {left:-30px; top:16px;}

/* get rid of the table */
#pmenu table {position:absolute; border-collapse:collapse; top:0; left:0; z-index:400; font-size:1em;}

/* For IE5.5 and IE6 give the hovered links a position relative and a change of background and foreground color. This is needed to trigger IE to show the sub levels */
* html #pmenu li a:hover {position:relative; background:#496FAA; background-image: url(../grafik/nav_act.gif); color:#fff;}

/* For accessibility of the top level menu when tabbing */
#pmenu li a:active, #pmenu li a:focus {background:#496FAA; background-image: url(../grafik/nav_act.gif); color:#fff;}

/* Set up the pointers for the sub level indication */
#pmenu li.fly {background:#496FAA url(../grafik/fly.gif) no-repeat right center;}
#pmenu li.drop {background:#01196E url(../grafik/drop.gif) no-repeat right center;}


/* This lot is for IE5.5 and IE6 ONLY and is necessary to make the sublevels appear */

/* change the drop down levels from display:none; to visibility:hidden; */
* html #pmenu li ul {visibility:hidden; display:block; position:absolute; top:-11px; left:80px; padding:20px 30px 30px 30px; background:transparent url(transparent.gif);}

/* keep the third level+ hidden when you hover on first level link */
#pmenu li a:hover ul ul{visibility:hidden;}

/* keep the fourth level+ hidden when you hover on second level link */
#pmenu li a:hover ul a:hover ul ul{visibility:hidden;}

/* keep the fifth level hidden when you hover on third level link */
#pmenu li a:hover ul a:hover ul a:hover ul ul{visibility:hidden;}

/* keep the sixth level hidden when you hover on fourth level link */
#pmenu li a:hover ul a:hover ul a:hover ul a:hover ul ul {visibility:hidden;}

/* make the second level visible when hover on first level link and position it */
#pmenu li a:hover ul {visibility:visible; left:-30px; top:14px; lef\t:-31px; to\p:15px;}

/* make the third level visible when you hover over second level link and position it and all further levels */
#pmenu li a:hover ul a:hover ul{ visibility:visible; top:-11px; left:80px;}


/* Innehåll ----------------------- */


#content { 
	width: 600px; 
	float: left; 
	margin: 5px 5px; 
	padding: 5px 10px;
	background-color: #fff; 
	color:#333; 
	font-size: 1.1em; 
	text-decoration: none; 
	overflow: auto; 
	line-height: 1.5em;	
	}
	
/* Inledande bild/bokstav på indexsidan */	

span.dropcap { 
	display:block; 
	float:left; 
	width:51px; 
	height:53px; 
	margin-right:5px; 
	background-image:url("../grafik/dropcap_v.gif"); 
	background-repeat:no-repeat; 
	}
  
span.dropcap span {
	display:none;
	}
	

/* Länkar */
	
#content a:link { color: #446AAA; background-color: #fff; font-weight: normal;text-decoration: underline; }
#content a:visited { color: #446AAA; background-color: #fff; font-weight: normal; text-decoration: underline; }
#content a:hover { color: #7396D6; background-color: #fff; font-weight: normal; text-decoration: underline; }
#content a:active {	color: #446AAA;	background-color: #fff;	font-weight: normal; text-decoration: underline; }
#content a.external { background-image: url(../grafik/extarnlank.gif); background-position: center right; background-repeat: no-repeat; padding-right: 18px;}


/* Acronymer/förkortningar */	

#content abbr, acronym {
	border-bottom: 1px dotted #ccc; 
	cursor: help; 
	}	
	
/* Citat */	

#content blockquote, .quote {
	line-height:1.5em; 
	font-style:italic; 
	margin:15px 10px 0 15px; 
	padding:10px 10px 5px 30px; 
	background:url(../grafik/quote.gif) no-repeat;	
	}

/* Grafik för punktlista */

#content ul, #content li {	
	list-style: url(../grafik/dutt.gif); 
	padding-bottom: 5px; 
	}
	
/* Tabeller, priser på behandlingar  */

#content table {width: 100%; border-collapse: collapse;}
	
#content table .tidpris {
	color: #01196E;
	font: normal 1.0em Georgia, "Times New Roman", Times, serif ;  
	padding-top: 10px; 
	}

#content caption {
	margin: 0 0 5px 5px; 
	font: bold 1.2em Arial, "sans-serif";
	}

#content th, #content td {
	padding: 5px; 
	text-align: left;
	}

#content th {
	font: bold 1.2em Georgia, "Times New Roman", Times, serif ;
	border-bottom: 3px solid #ccc; 
	background: #efefef;
	} 

#content th .normal {
	font-weight: bold;
	}

#content td {
	border-bottom: 1px solid #eee;
	}

/* hantering av foton */
	
#content .fotoram { 
	float: none; 
	padding: 5px; 
	border: 1px solid #ccc; 
	}

#content .fototillhoger { 
	float: right; 
	margin-left: 15px; 
	padding: 5px;	
	}
	
#content .fototillvanster {	
	float: left; 
	margin-right: 15px; 
	padding: 5px;	
	}

#content .fototillvanster-ram {	
	float: left; 
	margin-right: 15px; 
	padding: 5px; 
	border: 1px solid #ccc; 
	}

#content .fototillhoger-ram { 
	float: right; 
	margin-left: 15px; 
	padding: 5px; 
	border: 1px solid #ccc; 
	}
	
#content #personal {
	float: left; 
	margin-right: 15px; 
	font: normal .7em Georgia, "Times New Roman", Times, serif ;
	text-align: center;
}

/* Högerspalt ------------------------------------- */


#sidebar {	
	float: right; 
	width: 220px; 
	padding: 5px; 
	background: #fff;	
	}
	

#sidebar .fotoram { 
	float: none;
	padding: 5px; 
	background-image: url(../grafik/shackram.gif); 
	margin-bottom: 5px;	
	}	

/* Loggor från SHR och Cidesco  */

#sidebar .logo {
	margin: 5px 0 2px 35px; 
	}


/* Box nr 1 med rundade hörn (årets erbjudande) ------------------------------  */

.xsnazzy h3, .xsnazzy p {margin:0 10px;}
.xsnazzy h3 {font-size:1.1em; text-transform:uppercase; letter-spacing: 1px; color:#FFF; border:0; padding-top: 0.5em;}
.xsnazzy p {font-size: 1.1em; padding-bottom:0.5em; color:#FFF; }
.xsnazzy {background: transparent; margin:0.5em;}
.xsnazzy li, .zsnazzy ul {color:#fff; list-style:square;}

.xsnazzy a:link { color: #FFF; font-weight: normal;text-decoration: underline; }
.xsnazzy a:visited { color: #FFF;  font-weight: normal; text-decoration: underline;	}
.xsnazzy a:hover { color: #FFF;  font-weight: normal; text-decoration: underline; }
.xsnazzy a:active {	color: #FFF; font-weight: normal; text-decoration: underline; }
.xsnazzy a.external { background-image: url(../grafik/extarnlank.gif); background-position: center right; background-repeat: no-repeat; padding-right: 18px;}


.xb1, .xb2, .xb3, .xb4, .xb5, .xb6, .xb7 {display:block; overflow:hidden; font-size:0;}
.xb1, .xb2, .xb3, .xb4, .xb5, .xb6 {height:1px;}
.xb4, .xb5, .xb6, .xb7 {background:#ccc; border-left:1px solid #ccc; border-right:1px solid #ccc;}

.xb1 {margin:0 8px; background:#ccc;}
.xb2 {margin:0 6px; background:#ccc;}
.xb3 {margin:0 4px; background:#ccc;}
.xb4 {margin:0 3px; background:#094FA3; border-width:0 5px;}

.xb5 {margin:0 2px; background:#094FA3; border-width:0 4px;}
.xb6 {margin:0 2px; background:#094FA3; border-width:0 3px;} 
.xb7 {margin:0 1px; background:#094FA3; border-width:0 3px; height:2px;} 

.xboxcontent {display:block; background: #094FA3 /* url(../grafik/augusti2008.jpg) no-repeat bottom right */ ; border:3px solid #ccc; border-width:0 3px;}


/* Box nr 2 med rundade hörn (öppettider) ----------------------  */


.zsnazzy h3, .zsnazzy p {margin:0 10px;}
.zsnazzy h3 {font-size:1.3em; text-transform:uppercase; letter-spacing: 1px; color:#fff; border: 0; padding-top: 0.5em;}
.zsnazzy p {font-size: 1.1em; padding-bottom:0.3em; color:#000;}
.zsnazzy {background: transparent; margin:0.5em;}
.zsnazzy li, .zsnazzy ul {color:#fff; list-style:square;}

.zsnazzy img {margin-bottom:8px;}

.zsnazzy a:link { color: #000; font-weight: normal;text-decoration: underline; }
.zsnazzy a:visited { color: #000;  font-weight: normal; text-decoration: underline;	}
.zsnazzy a:hover { color: #000;  font-weight: normal; text-decoration: underline; }
.zsnazzy a:active {	color: #000; font-weight: normal; text-decoration: underline; }
.zsnazzy a.external { background-image: url(../grafik/extarnlank.gif); background-position: center right; background-repeat: no-repeat; padding-right: 18px;}

.zb1, .zb2, .zb3, .zb4, .zb5, .zb6, .zb7 {display:block; overflow:hidden; font-size:0;}
.zb1, .zb2, .zb3, .zb4, .zb5, .zb6 {height:1px;}
.zb4, .zb5, .zb6, .zb7 {background:#ccc; border-left:1px solid #ccc; border-right:1px solid #ccc;}

.zb1 {margin:0 8px; background:#ccc;}
.zb2 {margin:0 6px; background:#ccc;}
.zb3 {margin:0 4px; background:#ccc;}
.zb4 {margin:0 3px; background:#F39A35; border-width:0 5px;}

.zb5 {margin:0 2px; background:#F39A35; border-width:0 4px;}
.zb6 {margin:0 2px; background:#F39A35; border-width:0 3px;} 
.zb7 {margin:0 1px; background:#F39A35; border-width:0 3px; height:2px;} 

.zboxcontent {display:block; background:#F39A35; border:3px solid #ccc; border-width:0 3px;}


/* Sidfot --------------------------- */

#footer {
/*	border-top: 1px solid #ccc;  */
	float:left; 
	width:860px; 
	padding:5px 3px 3px 7px; 
	color:#666; 
	font-weight: normal; 
	font-size: 0.9em; 
	text-decoration: none; 
	}
	
#footer a {	
	color:#666;	
	text-decoration: none;
	}

/* producerad av ... --------------------------- */

#producerad {
	background-color: transparent; 
	text-align: right; 
	width: 890px;
	\width: 910px; 
	w\idth: 890px; 
	font-size: 0.9em; 
	text-decoration: none; 
	margin: -5px auto 0 auto; 
	}
	
#producerad a {	
	color:#fff;	
	text-decoration: none;
	}