/*
  Document   : style.css
  Created on : 28.11.2009, 11:21:57
	Author     : Nicolas Perrenoud <mail@dysign.ch>
	Description: Main Stylesheet 

	$Rev$

	TABLE OF CONTENTS
	
	<TODO>
		
	COLOR PALETTE
	

*/

/*
* Load defaults
*/

/* Reset all elements */
* {
	padding:0px;
	margin:0px;
	border:none;
}

/* Apply default styles from http://www.w3.org/TR/CSS2/sample.html */
html, address,
blockquote,
body, dd, div,
dl, dt, fieldset, form,
frame, frameset,
h1, h2, h3, h4,
h5, h6, noframes,
ol, p, ul, center,
dir, hr, menu, pre   { display: block }
li              { display: list-item }
head            { display: none }
table           { display: table }
tr              { display: table-row }
thead           { display: table-header-group }
tbody           { display: table-row-group }
tfoot           { display: table-footer-group }
col             { display: table-column }
colgroup        { display: table-column-group }
td, th          { display: table-cell }
caption         { display: table-caption }
th              { font-weight: bolder; text-align: center }
caption         { text-align: center }
body            { margin: 8px }
h1              { font-size: 2em; margin: .67em 0 }
h2              { font-size: 1.5em; margin: .75em 0 }
h3              { font-size: 1.17em; margin: .83em 0 }
h4, p,
blockquote, ul,
fieldset, form,
ol, dl, dir,
menu            { margin: 1.12em 0 }
h5              { font-size: .83em; margin: 1.5em 0 }
h6              { font-size: .75em; margin: 1.67em 0 }
h1, h2, h3, h4,
h5, h6, b,
strong          { font-weight: bolder }
blockquote      { margin-left: 40px; margin-right: 40px }
i, cite, em,
var, address    { font-style: italic }
pre, tt, code,
kbd, samp       { font-family: monospace }
pre             { white-space: pre }
button, textarea,
input, select   { display: inline-block }
big             { font-size: 1.17em }
small, sub, sup { font-size: .83em }
sub             { vertical-align: sub }
sup             { vertical-align: super }
table           { border-spacing: 2px; }
thead, tbody,
tfoot           { vertical-align: middle }
td, th, tr      { vertical-align: inherit }
s, strike, del  { text-decoration: line-through }
hr              { border: 1px inset }
ol, ul, dir,
menu, dd        { margin-left: 40px }
ol              { list-style-type: decimal }
ol ul, ul ol,
ul ul, ol ol    { margin-top: 0; margin-bottom: 0 }
u, ins          { text-decoration: underline }
br:before       { content: "\A"; white-space: pre-line }
center          { text-align: center }
:link, :visited { text-decoration: underline }


/* Begin bidirectionality settings (do not change) */
BDO[DIR="ltr"]  { direction: ltr; unicode-bidi: bidi-override }
BDO[DIR="rtl"]  { direction: rtl; unicode-bidi: bidi-override }

*[DIR="ltr"]    { direction: ltr; unicode-bidi: embed }
*[DIR="rtl"]    { direction: rtl; unicode-bidi: embed }

@media print {
  h1            { page-break-before: always }
  h1, h2, h3,
  h4, h5, h6    { page-break-after: avoid }
  ul, ol, dl    { page-break-before: avoid }
}

/* 
* Base elements 
*/

body	{
	font-family:sans-serif;
	margin:0px;
	padding:0px;
	min-height: 100%;
	background:#808080 url('images/bg.jpg') no-repeat center top;
	min-width:750px;
}

body.page_art	{
	background:#B0B0B0 url('images/bg_art.jpg') no-repeat center top;
}

body.page_music	{
	background:#B0B0B0 url('images/bg_music.jpg') no-repeat center top;
}

body.page_blog	{
	background:#B0B0B0 url('images/bg_blog.jpg') no-repeat center top;
}

body.page_contact	{
	background:#B0B0B0 url('images/bg_contact.jpg') no-repeat center top;
}


h1	{
}

h2	{	

}

h3	{	

}

a	{	
	color:#000;
}

a:hover	{	
	text-decoration:none;
}

/*
* Document layout 
*/

#layoutcontainer	{
	margin:0px auto;
	padding:0px;
	width:700px;
	position:relative;
}

#nav	{
	position:relative;
	width:100%;
	margin:0px auto;
	margin-top:119px;
	height:270px;
}

#contentcontainer	{
	position:relative;
	width:100%;
	margin:0px auto;
	margin-top:20px;
	padding-bottom:10px;
}

#footer	{
	margin-bottom:10px;
	font-size:8pt;
	text-align:center;
}

/*
* Navigation
*/

.navhome	{
	position:absolute;
	top:0px;
	left:120px;
	width:460px;
	height:245px;
}

.navhome:hover	{
	background:url('images/nav_hover_home.png') no-repeat -120px 0px;
}

.navart	{
	position:absolute;
	top:170px;
	left:45px;
	width:120px;
	height:75px;
}

.navart:hover	{
	background:url('images/nav_hover.png') no-repeat -45px -170px;
}

.navmusic	{
	position:absolute;
	top:170px;
	left:185px;
	width:140px;
	height:75px;
}

.navmusic:hover	{
	background:url('images/nav_hover.png') no-repeat -185px -170px;
}

.navblog	{
	position:absolute;
	top:170px;
	left:326px;
	width:145px;
	height:90px;
}

.navblog:hover	{
	background:url('images/nav_hover.png') no-repeat -326px -170px;
}

.navcontact	{
	position:absolute;
	top:165px;
	left:472px;
	width:200px;
	height:80px;
}

.navcontact:hover	{
	background:url('images/nav_hover.png') no-repeat -472px -165px;
}


/*
* Forms
*/

input, select, textarea	{
	padding:5px;
	font-size:13px;
	border:none;
	font-family:verdana, arial, helvetica;
	background:#ccc;
	color:black;
	margin-bottom:10px;
	vertical-align:top;
}

input[type="submit"]	{
	font-weight:bold;
}

/*
* Page specific stuff
*/

/* Home */

#slidercontainer	{
	margin:10px auto;
	left:150px;
	width:475px;
	height:350px;
}

/* Art */

.artportfolio_imagecontainer	{

}

.artportfolio_imagecontainer img	{
	width:120px;
	height:120px;
	margin:3px;
}

/* Blog */

#blog_main	{
	float:left;
	width:500px;
	text-align:justify;
}

#blog_side	{
	 float:right;
	 width:150px;
	 margin-left:15px;
}

/* Contact */

.contactform {
	margin:20px auto;
	width:600px;
	padding-top:30px;
}

.contactform label	{
	display:inline-block;
	width:120px;
	text-align:right;
	margin-right:10px;
	margin-top:3px;
	vertical-align:top;
}

.contactform input[type="submit"]	{
	margin-left:130px;
}

.imagelinks	{
	text-align:center;
}
.imagelinks	img	{
	padding:2px 10px;
	vertical-align: middle;
}