/* css for Cristin Lindqvist's/Kartis' website 
   by Cristin Lindqvist aka Kartis, http://www.cristinlindqvist.com */
/* This css is fully compatible for all browsers that support CSS2.1. 
   Internet Explorer 6 and earlier for Windows don't support this level of CSS well.
   There might be some serious layout problems in earlier browsers. */
   
/* IMPORTANT */
/* This design is not a template. You may not reproduce it elsewhere without the 
   designer's written permission. However, feel free to study the CSS and use 
   techniques you learn from it elsewhere. */

* {
 margin: 0;
 padding: 0;
}
body {
 background: #e9e4d9 url(bilder/bg.gif) repeat-x 0 100%;
 font: 62.5% "Trebuchet MS", Verdana, sans-serif;
 color: #633;
 text-align: justify;
}
/* ---------------------------------------------------------------------------------------------------- */
/* ----- Blocks for layout (960/5) ----- */
#wrap { /* Wraps all content and puts a background image in the top. */
 background: url(bilder/wrap.gif) repeat-x;
}
#page { /* Wraps all content inside wrap block, gives it width and makes it centered. Puts background image for body. */
 margin: 0 auto;
 width: 960px; /* The magic number that is divided into five for "columns" */
 background: #f7ecdd url(bilder/page.gif) repeat-y;
}
#header { /* Header block inside page block with a height of a fifth of page blocks width. */
 height: 263px; /* 192px + 71px extra for header image to look like it interferes with body. */
 background: #bf8e71 url(bilder/header.gif) no-repeat bottom;
}
 #header h1 { /* Header font style only in header block */
  float: right;
  font: bold 1.6em "Trebuchet MS", Verdana, sans-serif;
  margin: 100px 18px 10px 0;
  border: none;
  color: #f7ecdd;
 }
/* ---------------------------------------------------------------------------------------------------- */
/* ---- Link styles ---- */
a:link, a:visited a:active {
 text-decoration : none;
}
a:link {
 color : #0b4f67;
}
a:hover {
 text-decoration : underline; 
}
a:visited {
 color : #d85;
}
a:active {
 color : #ffc;
}
/* ---------------------------------------------------------------------------------------------------- */
/* ---- Right sidebar block ---- */
#prim { /* page block divided into three floating blocks from right to left: prim, sekund and ters. */
 float: right;
 margin: 40px 18px 0 18px;
 width: 156px; /* 192 minus 36 for margin */
 display: inline;
}
 #prim p {
  text-align: left;
  margin: 0 0 10px 0;
  font-size: 1em;
  text-indent: 0px;
 }
 #prim img { /* divider */
  text-align: center;
  padding: 24px 0;
  border: none;
 }
/* ---------------------------------------------------------------------------------------------------- */
/* ---- Center main block ---- */
#sekund { /* page block divided into three floating blocks from right to left: prim, sekund and ters. */
 float: right; /* Frame block. Starts 192 from right edge with 12px marg left/right. */
 padding: 0px 12px;
 width: 480px; /* 576 minus 24 (padding) minus 72 for empty space on left side */
 display: inline;
}
 #sekund p {
  padding-bottom: 8px;
  text-align: justify;
 }
 #sekund img {
  float: left;
  margin: -12px 12px 0 -84px; /* All images starts at the very left edge of sekund block, merging into text */
  padding: 3px;
  border: 2px solid #dcc;
  background: #edd;
 }
 .show {
  float: left;
  margin: 6px 10px 4px 0;
  padding: 0 0 4px 0;
 }
 #sekund a:link {
  font-weight: bold;
 }
/* ---------------------------------------------------------------------------------------------------- */
/* ---- Left sidebar block ---- */
#ters { /* page block divided into three floating blocks from right to left: prim, sekund and ters. */
 float: right; /* Starts 192 + 576 from right edge (center block including 72px margin) on right side */
 margin: 40px 72px 0 0;
 padding: 0 18px;
 width: 156px; /* 192 minus 36 for padding */
 display: inline;
}
 #ters p {
  text-align: left;
  margin-top: 3px;
  margin-bottom: 10px;
  font-size: 0.9em;
 }
 #ters img { /* divider */
  text-align: center;
  padding: 24px 0 24px 0;
  border: none;
 }
/* ---------------------------------------------------------------------------------------------------- */
/* ---- Footer block ---- */
#footer {
 clear: right;
 height: 196px;
 background: #433 url(bilder/footer.gif) top no-repeat;
 line-height: 1em;
 color: #f7ecdd;
}
#footer p {
 padding: 100px 20px 0px 0px;
 text-align: right;
}
#footer a:link, a:visited {
 color: #d85;
}
/* ----- Clearing ----- */
.clear {
 clear: both;
}

/* ---------------------------------------------------------------------------------------------------- */
/* ----- Font styles ----- */
/* --- Headers --- */
h1 {
 margin-bottom: 11px;
 margin-left: -86px;
 padding: 0px 0 21px 86px;
 border-bottom: 1px solid #dcc;
 font: normal italic 2.2em Georgia, serif;
 background: transparent;
 color: #cbb;
}
/* --Textens titel på Kalam o Kartis-- */
h2 {
 font-size: 1.5em;
 font-weight: normal;
 letter-spacing: 0.3em;
 margin-top: 30px;
 margin-bottom: 10px;
}
/* -- Underrubriker -- */
h3 {
 margin: 15px 0 6px -56px;
 font: normal italic 1.4em Georgia, serif;
} 
/* -- Länkar på Anti-Ageing -- */
h4 {
 font-size: 1.2em;
 font-weight: bold;
 letter-spacing: 0.1em;
 margin-top: 1px;
 margin-bottom: 5px;
}
/* -- Titlar i Sidebar -- */
h5 {
 margin-top: 4px;
 margin-bottom: 10px;
 margin-left: 10px;
 padding: 0;
 font: normal italic 1.2em Georgia, serif;
 background: transparent;
 color: #cbb;
}
/* --Undertitlar i Sidebar -- */
h6 {
 font-size: 1.1em;
 font-weight: bold;
 margin-top: 6px;
 margin-bottom: 0;
 letter-spacing: 0.2em;
}
/* --- Paragraphs and other styles --- */
p {
 font-size: 1.1em;
 text-align: justify;
 text-indent: 8px;
 margin-top: 2px;
 margin-bottom: 8px;
}
p:first-letter {
  font-size: 120%;
}
/* -- indraget stycke för citat - anti-ageing -- */
p.indrag {
 text-align: justify;
 text-indent: 0px;
 margin: 4px 30px 4px 30px;
}
/* --Textstorlek på ToTop-- */
.tiny {
 font-size: 0.8em;
 text-align: center;
 margin-top: 3px;
 margin-bottom: 10px;
}
/* ---------------------------------------------------------------------------------------------------- */
/* ----- Tables ----- */


/* ---------------------------------------------------------------------------------------------------- */
/* ----- Divider and List styles ---- */
hr {
	color: #cbb;
	background-color: #cbb;
	border: none;
	margin: 16px 0 8px 0;
	height: 1px;
	width: 100%;
}
/* --Numrerad lista på Webdesign 1-sida-- */
ol {
 list-style-type: decimal;
 margin: 5px 20px 10px 20px;
}
/* --Punktlistor på Spirit-sidor och web show-- */
ul.bull {
 padding-left: 9px;
 margin: 9px 0 0 18px;
}
 ul.bull li {
  padding-top: 5px;
  font-size: 1.1em;
 }