/* ----------------------------------------------
	Skin Affair Stylesheet
	All rights reserved (c)2008-2009
	Authored by CryptoNet
	www.cryptonet.be
---------------------------------------------- */

/* ### RESET ################################# */

* {
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
	text-decoration: none;
	outline: none;
	font-size: 1em;
}

.clearfloat {
	clear: both;
}

/* ### BODY ################################## */

body {
	background: #edecd8 url('../images/bg.jpg') repeat-x;
	color: #766e61;
	font-family: "Lucida Grande", Arial, sans-serif;
	font-size:  12px;
	line-height: 18px;
	padding: 0;
}

body.main {
	background: #edecd8 url('../images/bg-main.jpg') repeat-x;
}

.wrapper {
	clear: both;
	margin:  0 auto;
	position: relative;
	width: 960px;
}

textarea, input {
	background: #ffffff url('../images/input-bg.gif') no-repeat left top;
	border: 1px solid #ffffff;
	padding: 3px 5px;
}

/* ### LAYOUT ############################### */

.header-container {
	background: url('../images/header/header-bg.jpg') no-repeat;
	height: 181px;
	margin: 0 10px;
	position: relative;
	width:  940px;
}

#logo {
	background: url('../images/header/skinaffair-logo.jpg') no-repeat;
	float: left;
	height: 132px;
	margin: 23px 0;
	text-indent:  -9999px;
	position: relative;
	width: 220px;
}

ul#navigation {
	float: right;
	height: 39px;	
	margin: 141px 59px 0 0;
	position: relative;
	width: 640px;
	display: inline;
}

ul#navigation li {
	position: relative;
	float: left;
	display: inline;
	text-indent: -9999px;
	list-style: none;
}

ul#navigation li a {
	display: block;
	color: #000000;
	height: 39px;
	text-decoration: none;
}

	ul#navigation li a#home { background: url('../images/navigation/nav-home.jpg') no-repeat left top; width: 97px;	}
	
	ul#navigation li a#home:hover { background-position: left -39px; }

	ul#navigation li a#home.active { background-position: left -78px; }
	
	ul#navigation li a#behandelingen { background: url('../images/navigation/nav-behandelingen.jpg') no-repeat left top; width: 173px; }
	
	ul#navigation li a#behandelingen:hover { background-position: left -39px; }

	ul#navigation li a#behandelingen.active { background-position: left -78px; }

	ul#navigation li a#crystalclear { background: url('../images/navigation/nav-crystalclear.jpg') no-repeat left top; width: 156px; }
	
	ul#navigation li a#crystalclear:hover { background-position: left -39px; }

	ul#navigation li a#crystalclear.active { background-position: left -78px; }
	
	ul#navigation li a#ahava { background: url('../images/navigation/nav-ahava.jpg') no-repeat left top; width: 100px; }
	
	ul#navigation li a#ahava:hover { background-position: left -39px; }

	ul#navigation li a#ahava.active { background-position: left -78px; }
	
	ul#navigation li a#contact { background: url('../images/navigation/nav-contact.jpg') no-repeat left top; width: 114px; }
	
	ul#navigation li a#contact:hover { background-position: left -39px; }

	ul#navigation li a#contact.active { background-position: left -78px; }


ul#navigation li ul li {
	width: 173px;
	font-weight: normal;
	text-indent: 0px;
	color: #ffffff;
	float: none;
}

ul#navigation li ul li a:hover {
	background: #655c4f;
}

ul#navigation li ul li a {
	height: 18px;
	padding: 3px 20px;
	color: #ffffff;
	border-bottom: 1px solid #4b4236; 
}

ul#navigation li ul {
	width: 173px;
	background: #42382d;
	visibility: hidden;
	position: absolute;
	top: 100%; 
	left: 0;
	z-index: 2;
}
	
#welcome {
	background: url('../images/welcome/welcome-bg.jpg') no-repeat;
	color: #ffffff;
	clear: both;
	height: 259px;
	margin: 20px 10px 70px;
	position: relative;
	width: 940px;
}

.spotlight {
	border: 5px solid #ffffff;
	float: left;
	line-height: 0px;
	margin: 28px 10px 72px;
	position: relative;
	width: 290px;
}

#content {
	float: left;
	margin: 0 10px;
	position: relative;
	width: 700px;
}

#content.main {
	width: 540px;
}

.sidebar {
	border: 5px solid #ffffff;
	float: right;
	line-height: 0px;
	margin: 0 10px 20px;
	position: relative;
	width: 130px;
}

#newsletter-box {
	background: url('../images/newsletter/newsletter-bg.png') no-repeat;
	color: #ffffff;
	float: right;
	height: 237px;
	margin: 0 10px;
	padding: 25px;
	position: relative;
	width: 252px;
}

#newsletter-box input#email, #gsm {
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	width: 170px;	
}

input#gsm {
	margin: 0 0 5px;
}

.footer-wrapper {
	background: #85796d url('../images/footer/footer-bg.jpg') repeat-x top;
	color: #ffffff;
	clear: both;
	float: left;
	margin: 40px 0 0 0;
	padding: 23px 0 17px;
	position: relative;
	width: 100%;
}

#copyright-wrapper {
	background: #85796d;
	clear: both;
	color: #eeedd9;
	padding: 10px 0;
	position: relative;
	width: 100%;
}

.footer-col {
	float: left;
	margin: 0 22px;
	position: relative;
	width: 276px;
	height: 140px;
}

.footer-col ul {
	list-style: none;
	margin: 0 0 10px 0;
}

.footer-col ul li {
	line-height: 24px;
	font-size: 12px;
	border-bottom: 1px solid #a69887;
}

.footer-col li a {
	color: #ffffff;
	text-decoration: none;
}

.footer-col li a:hover {
	color: #edecd8;
	text-decoration: none;
}

.footer-col img {
	float: left;
	margin: 30px 0 0 0;
}

#contactform p span {
	float: left;
	font-weight: bold;
	width: 120px;
}

#contactform input#name, #email, #tel {
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	width: 290px;
}

#contactform textarea {
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	font-family: "Lucida Grande", Arial, sans-serif;
	font-size: 12px;
	width: 290px;
}

#contactform input#sendform {
	background: url('../images/button-bg.jpg') repeat-x;
	border: 1px solid #af9f90;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	color: #ffffff;
	cursor: hand;
	cursor: pointer;
	font-family: "Lucida Grande", Arial, sans-serif;
	font-weight: bold;
	line-height: 18px;
	padding: 3px 10px;
	text-align: center;
}

#contactform input#sendform:hover {
	background: url('../images/button-bg-hover.jpg') repeat-x;
	border-color: #b4a99d;
}

#contactinfo {
	background: #5f554b url('../images/contact/contactinfo-bg.jpg') top repeat-x;
	border: 5px solid #ffffff;
	color: #ffffff;
	float: right;
	padding: 15px;
	width: 260px;
}

#contactinfo dl { }

#contactinfo dt {
	float: left;
	width: 100px;
	font-weight: bold;
}

#contactinfo dd {
	width: 150px;
	float: left;
	margin: 0 0 5px 0;
}

#contactinfo dd span {
	width: 50px;
	float: left;
}

/* ### TYPE ############################### */

h1 { font-size: 28px; font-weight: normal; margin: 0 0 20px 0; }

h2 { font-size: 22px; font-weight: normal; margin: 0 0 20px 0; }

h3 { font-size: 18px; font-weight: normal; margin: 0 0 20px 0; }

p { margin: 0 0 15px 0; }

#welcome p { float: left; width: 495px; margin: 15px 0 0 410px;}

#welcome h1 { float: left; font-family: Georgia, Times New Roman, Lucida Grande, sans-serif; margin: 40px 0 0 410px; }

#welcome h3 { float: left; margin: 10px 0 0 410px; }

#content h2 {
	background: url('../images/heading-button.gif') no-repeat;
	text-indent:  35px;
}

#newsletter-box h2 { 
	font-family: Georgia, Times New Roman, Lucida Grande, sans-serif;
	font-size: 20px;
	font-weight: normal;
	line-height: 28px;
	margin: 0 0 15px 0;
}

#newsletter-box p { margin: 0 0 1px; }

.footer-col h3 { margin: 0 0 10px; }

#copyright-wrapper p { float: left; line-height: 12px; margin: 0 10px; }

/* ### LINKS ############################### */

#content p {
	text-align: justify;
}

#content p a {
	font-weight: bold;
	color: #766e61;
	text-decoration: underline;
}

#content p a:hover {
	color: #9b9386;
}

a.button {
	background: url('../images/button-bg.jpg') repeat-x;
	border: 1px solid #af9f90;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	color: #ffffff;
	display: block;
	font-weight: bold;
	float: left;
	padding: 3px 10px;
	text-align: center;
}

a.button:hover {
	background: url('../images/button-bg-hover.jpg') repeat-x;
	border-color: #b4a99d;
	color: #ffffff;
	text-decoration: none;
}

#welcome a.button { margin: 15px 0 0 410px; }

input#send {
	background: url('../images/button-bg.jpg') repeat-x;
	border: 1px solid #af9f90;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	color: #ffffff;
	cursor: hand;
	cursor: pointer;
	font-family: "Lucida Grande", Arial, sans-serif;
	font-weight: bold;
	float: left;
	line-height: 18px;
	margin: 10px 0 0 0;
	padding: 3px 10px;
	text-align: center;
}

input#send:hover {
	background: url('../images/button-bg-hover.jpg') repeat-x;
	border-color: #b4a99d;
}

#copyright-wrapper a {
	color: #eeedd9;
	font-weight: bold;
	text-indent: 28px;
	line-height: 12px;
	margin: 0;
}

#copyright-wrapper a#cn-link {
	background: url('../images/footer/cryptonet-logo.gif') no-repeat;
	float: right;
}

#copyright-wrapper a:hover {
	color: #ffffff;
	text-decoration: none;
}

span.notice {
  font-weight: bold;
}

div#sf_admin_container input[type=text] {
  width: 450px;
}