/* 

Dark Blue (H2 - H3): 	#005480
Brown (h1):					#965418
Text:								#000000
Light Blue	(textarea):	#09A1DE
Light Blue	(links):		#009DDC

*/

body {
	font-family: "Trebuchet MS", Helvetica, sans-serif;
	color: #000;
	font-size: 12px;
}

h1 {
	font-weight: bolder;
	font-family: Verdana, Geneva, sans-serif;
	color: #965418;
	font-size: 2em; /* 24px */
	line-height: 1.5em; /* 36px */
	margin: 1.5em 0 0.75em 0; /*  */
}

h2, h3 {
	color: #005480;
}


#contents h1:first-child {
	margin-top: -49px;
	margin-top: -49px;
}

p.intro {
	color: #005480;
}
/** FIELDSET **/

fieldset, .set {
	border: 1px solid #CCC;
	background: #f5f4f5 url(/images/background/fieldset.gif) top left repeat-x;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	margin-bottom: 10px;
	padding: 10px;
	position: relative;
}
ul.set {
	margin-left: 0; 
	padding-left: 2.5em;
}

.edit-profile fieldset h3  {
	margin: 0;
	float: left;
	width: 115px;
	margin-top: 3px;
	margin-left: -117px;
}
.edit-test fieldset h3  {
	margin: 0;
	float: left;
	width: 170px;
	margin-top: 3px;
	color: #999;
	position: absolute;
}

fieldset p {
	vertical-align: top;
	margin: 3px 0 7px 0;
}

fieldset label {
	font-weight: normal;
}

/** INPUT **/

input, select {
	vertical-align: text-bottom;
	margin-top: 0px;
	font-size: 11px;
}

input[type=text], input[type=password] {
	background: url(/images/background/input.gif) top left no-repeat;
	border: 1px inset #CCC;
	width: 150px;
	height: 15px;
	line-height: 15px;
	padding: 2px 0 1px 2px;
}


/* Submit buttons */
input[type=submit], input[type=button], button, a.button  {
	padding: 0;
	color: white;
	font-weight: bold;
	background: url(/images/background/sprite.png)  0 -22px no-repeat;
	border: none;
	height: 22px;
	width: 120px;
	text-decoration: none;
	cursor: pointer;
}

input[type=submit]::-moz-focus-inner, input[type=button]::-moz-focus-inner, button::-moz-focus-inner { 
	border: 0;
}

input[type=submit]:hover, input[type=submit]:focus, input[type=button]:hover, input[type=button]:focus, button:hover, button:focus {
	background-position: -240px  -22px;
}
input[type=submit]:active, input[type=button]:active, button:active {
	background-position: -120px  -22px;
}
a.button {
	display: inline-block;
	line-height: 22px;
}
.button.confirm {
	width: 164px;
	background-position: 0 -44px;
}
.button.cancel {
	width: 164px;
	background-position:  0 -66px;
}
.button.submit {
	width: 164px;
	background-position:  0 -88px;
}

.button.confirm:hover, .button.confirm:focus { background-position: -328px -44px !important;  }
.button.cancel:hover, .button.cancel:focus { background-position: -328px  -66px !important; }
.button.submit:hover, .button.submit:focus { background-position: -328px  -88px !important; }
.button.confirm:active { background-position:  -164px -44px !important; }
.button.cancel:active {background-position: -164px  -66px !important;}
.button.submit:active {background-position: -164px  -88px !important;}


input.next-step, input.next-tab, input#next-step {
	float: right;
}
input.stap0 {
	display: none;
}

input.register {
	margin-left: 150px;
}

/* For 1 or 2 characters */
input.tiny { 
	width: 15px;
}

/* For 3 or 4 characters */
input.small { 
	width: 28px;
}

/* Input for max 10 characters */
input.medium { 
	width: 54px;
}

input.left-medium { 
	margin-left: 150px;	
}

input.slider { 

}

input.disabled, select.disabled, input[disabled=disabled] {
	border: 1px dotted grey;
	background-color: #FDFDFD !important;
	color: #222 !important;
	cursor: default;
}

input.slider {
	border: none;
	background: none;
}

input.error {
	border: 1px dotted red;
}

textarea {
	font-size: 12px;
	font-family: "Trebuchet MS", Helvetica, sans-serif;
	color: #005480;
}

/** LABELS **/
label {
	line-height: 20px;
	margin-top: 0px;
	cursor: pointer;
	float: none; 
	vertical-align: baseline;
}

label.medium {
	float: left; 
	width: 150px;
}

label.small { 
	float: left; 
	width: 180px; 
}

label.radio {
	display: inline-block;
	width: auto;
	float: none;
}

label.error {
	color: red;
	font-weight: bold;
	padding-left: 5px;
}
label.checked {
	display: inline-block;
	text-indent: -5555px !important;
	background: url(/images/icon/accept.png) 5px center no-repeat;
}

label.slider {
	display: inline-block;
	width: 32%;
	margin-top: 0;
}

label.image {
	width: 110px;
	text-align: center;
	display: inline-block;
	position: relative;
	margin: 0; padding: 0;
}
label.image img {
	border: 1px dashed grey;
	margin-bottom: 3px;
}

label.image img.selected {
	border: 1px solid #72A9D3;
}

label.image input {

}

label.visible, label.invisible, dfn.visible, dfn.invisible {
	background-image: url(/images/icon/visibility.png) ;
	background-repeat:  no-repeat;
	padding-right: 25px;
	margin-right: 10px;
}
label.visible {  background-position: right -54px;}
label.visible:hover { background-position: right -36px; }

label.invisible { background-position: right -18px ; }
label.invisible:hover { background-position:  right -0px; }

dfn.visible, dfn.invisible {
	text-indent: -5555px;
	display: inline-block;
	width: 25px;
	padding-right: 0;
	margin-right: 0px;
}
dfn.visible {
	background-position: left -36px;
}

h2 a {
	font-size: 0.7em;
}

p {

}

p.split {
	width: 49%;
	display: inline-block;
}

a.small {
	font-size: 0.8em;
}

a {
	color: #009DDC;
}

a:hover {	
	text-decoration: none;
}
a.label {
	text-decoration: none;
}
a.label:hover{
	background-color: #009DDC !important;
	color: white;
}
q {
	quotes: none;
	font-style: normal;
}
span.slider {
	margin-top: 5px;
	width: 45%;
	display: block;
}
span.trider {
	top: auto; left: auto;
	display: inline-block;
	width: 520px;
	margin-top: 3px;
	margin-bottom: 5px;
}
span.trider * {

}

span .ui-sider-handle {
	cursor: pointer !important;
}
/* Homepage */
.alg-voorw {
	font-size: 0.9em;
	color: #666;
}

.icons > * {
	float: left;
}

.icons p {
	width: 150px;
}
.icons img {
	margin: 36px 4px 0 5px;
}
#UU {
	display: none;
}

/* Edit Profile Elements */
.edit-profile fieldset {
	padding-left: 125px;
}

fieldset#location {
	position: relative;
	height: 151px;
}

fieldset#location p {
	width: 315px;
}
fieldset#location span.slider {
	width: 274px;
}
fieldset#location label.medium {
	width: 195px;
}

.edit-profile label.error {
	display: block;
	float: none;
	width: 274px;
	padding-left: 0;
}

.edit-profile #distance-map {
	float: right;
	height: 150px;
	width: 260px;
	border: 1px solid #CCC;
}

.edit-profile #distance-map span, .edit-profile #distance-map a{
	font-size: 9px;
	
}
.edit-profile .submit {
	margin-left: 30%;
	margin-top: 4px;
}


/* Edit Test Elements */

.edit-test #contents label {
	float: left;
	width: 155px;
	font-weight: bold;
	margin-right: 0px;
	font-size: 0.9em;
}

.edit-test #contents label.slider {
	width: 171px;
	text-align: center;
	margin-bottom: 6px;
	font-weight: normal;
}

.edit-test label.first {
	margin-left: 160px;
}

.edit-test #contents label.hechting {
	width: 20%;
	text-align: center;
}

.edit-test fieldset.big5 br {
	clear: left;
}
.edit-test fieldset.big5 p {
	background: url(/images/background/big5.png)  159px center no-repeat;
	margin: 0; padding: 0;
	height: 90px;
}


/* Matches */

.fotoselectie fieldset {
	position: relative;
	min-height: 330px;
	padding: 0px;
}

.fotoselectie fieldset p {
	margin-left: 0;
	margin-top: 300px;
	text-align: center;
}

.fotoselectie fieldset img {
	position: absolute;
	border: 1px solid #CCCCCC;
}

.fotoselectie input {
	float: none;
	margin: 10px 40px;
}

.fotoselectie img.foto0, .fotoselectie img {
	z-index: 0;
}
.fotoselectie .foto1 {

}
.fotoselectie  img.foto1, .fotoselectie  .foto0 {
	z-index: 1;
	height: 100px;
	left: 10px;
	top: 100px;
}
.fotoselectie  img.foto2 {
	z-index: 20;
	height: 134px;
	left: 60px;
	top: 80px;
}
.fotoselectie  img.foto3 {
	z-index: 30;
	height: 187px;
	left: 140px;
	top: 50px;
}
.fotoselectie  img.foto4 {
	z-index: 81;
	height: 267px;
	left: 248px;
	top: 10px;
}
.fotoselectie   img.foto5{
	z-index: 30;
	height: 187px;
	left: 420px;
	top: 50px;
}
.fotoselectie img.foto6 {
	z-index: 20;
	height: 134px;
	left: 544px;
	top: 80px;
}
.fotoselectie  img.foto7 {
	z-index: 1;
	height: 100px;
	left: 612px;
	top: 100px;
}
.fotoselectie  img.foto8 {
	z-index: 0;
	width: 1%;
	left: 617px;
	top: 120px;
}
.fotoselectie  img.preload {
	visibility: hidden;
}

.fotoselectie fieldset p img {
	margin: 0 20px;
}
.fotoselectie #iRateText {
	margin: 0 auto;
	border: none;
	width: 90%;
	font-size: 22px;
	font-weight: bold;
	background: none;
	text-align: center;
	padding: 0;
	color: #005480;
	line-height: 30px;
	float: none;
}

.fotoselectie .bodytype {
	position: absolute;
	left: 300px;
	top: 60px;
	z-index: 1;
	display: none;
}

.fotoselectie #iRate {
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 4px;
	vertical-align: text-top;
}

.fotoselectie #fade {
	position: absolute;
	width: 100%;
	height: 300px;
	background: #f5f4f5 url(/images/background/fieldset.gif) top left repeat-x;
	z-index: 80;
}

.fotoselectie #stars {
	position: relative;
	display: inline-block;
	width: 200px;
	height: 34px;
	background: url(/images/icon/rate.png) top left repeat-x;
}
.fotoselectie #stars label {
	position: absolute;
	display: inline-block;
	width: 40px;
	height: 34px;
	text-indent: -5555px;
	left: 0;
	top: 0;
}

.fotoselectie #stars label.selected {
	background: url(/images/icon/rate.png) 0 -34px repeat-x;
}

.fotoselectie #stars:hover label.selected {
	background: none;
}
.fotoselectie #stars label:hover {
	background: url(/images/icon/rate.png) bottom left repeat-x !important;
}

.fotoselectie #stars .iRate20 {
	width: 40px;
	z-index: 10;
}
.fotoselectie #stars .iRate40 {
	width: 80px;
	z-index: 9;
}

.fotoselectie #stars .iRate60 {
	width: 120px;
	z-index: 8;
}
.fotoselectie #stars .iRate80 {
	width: 160px;
	z-index: 7;
}
.fotoselectie #stars .iRate100 {
	width: 200px;
	z-index: 6;
}

#showEndMessage, #endMessage {
	display: none;
	z-index: 2000;
}

/* Foto upload */
.edit-photo #contents #otherPhotos ul {
	list-style: none;
	clear: both;
	margin: 0;
}

.edit-photo #contents #otherPhotos ul li {
	display: block;
	float: left;
	width: 166px;
	margin: 7px;
	text-align: center;
}
.edit-photo #contents img, .matches #contents img , .overview #contents img, .contacts #contents img, img.pasfoto {
	border: 1px solid #AAA;
	padding: 3px;
}
.edit-photo #contents a:hover img, .matches #contents a:hover img , .overview #contents a:hover img, .contacts #contents a:hover img, a:hover img.pasfoto {
	padding: 0px;
	border: 4px solid #09A1DE;
}
.edit-photo #contents ul + p {
	clear: both;
}

.edit-photo #contents #pasfotos {
	width: 385px;
	float:right;
	padding-left: 25px;
}

.edit-photo label {
	width: 110px;
}
.edit-photo input[type=file] {
	width: 200px;
}
a.delete {
	color: #333;
	padding-left: 20px;
	background: url(/images/icon/delete.png) left center no-repeat;
}

#showWarning, #photoWarning {
	display: none;
}

/* Messages */
.messages #contents p {
	min-height: 39px;
	padding-bottom:8px;
	border-bottom: 2px solid #FDFDFD;
	margin-bottom: 8px;
	color: #888;
	font-size: 0.9em;
}
.messages p.other {
	padding-right: 58px;
}
.messages p.me {
}
.messages #contents  p.reply, .messages #contents  p.last {
	margin-bottom: 0;
	border-bottom: none;
	min-height: 0;
	padding-bottom: 0;
}
.messages q {
	display: block;
	font-style: normal;
	color: #000;
	padding-top: 6px;
	font-size: 1.1em;
	line-height: 1.6em;
}
.messages #main p a {
	font-weight: bold;
}
.messages p img {
	padding: 2px;
	border: 1px solid #DDD;
	width: 35px;
}
.messages p a:hover img {
	padding: 0px;
	border: 3px solid #09A1DE;	
}
.messages .me img {
	float: left;
	margin-right: 6px;
} 
.messages .other img {
	position: absolute;
	left: 407px;
}
.messages .reply img {
	vertical-align: text-bottom;
}
.messages textarea {
	width: 263px;
	height: 69px;
	padding: 2px;
	vertical-align: text-bottom;
	border: 1px solid #09A1DE;
}
.messages .nofocus img {
	display: none;
}
.messages .nofocus input {
	display: none;
}
.messages .nofocus textarea {
	height: 18px;
	width: 99%;
	overflow-y: hidden;
	font-style: italic;
	color: #777;
	border-color: #CCCCCC;
}
.messages #contactoptions {
	position: absolute;
	top: 54px;
	right: -240px;
	width: 200px;
}
.messages #contactoptions h2 img{
	float: right;
}
.messages #contactoptions p{
	padding-bottom: 0;
}
.messages #contactoptions p.contact strong{
	color: green;
}
.messages #contactoptions p.contact{
	background: url(/images/icon/sprite.png) 0 -172px no-repeat;
	padding-left: 38px;
	clear: both;
}
.messages #contactoptions p.messages{
	background: url(/images/icon/sprite.png) 0 -207px no-repeat;
	padding-left: 38px;
}
.messages #contactoptions p.profile{
	background: url(/images/icon/sprite.png) 0 -272px no-repeat;
	padding-left: 38px;
}

/* view-profile */
#idMakeContact, #idCancelContact, #idPostponeContact {
	display: none;
}
.view-profile p.contact {
	background: url(/images/icon/sprite.png) 0 -525px no-repeat;
	padding: 3px 0 3px 30px;
	margin: 0;
}
.view-profile textarea {
	width: 390px;
	height: 50px;
}

.view-profile dl {
	min-height: 95px;
	width: 480px;
	margin-bottom: 1.5em;
}
.view-profile dt {
	float: left;
	clear: left;
	margin: 0;
	width: 50%;
	font-weight: normal;
}
.view-profile dd {
	float: left;
	margin: 0;
	width: 50%;
	font-weight: bold;
}

.view-profile #personal dl {
	width: 196px;
	padding-left: 4px;
	margin-bottom: 1.5em;
	min-height: 0px;
}
.view-profile #personal dt {

}
.view-profile #personal dd {

}
.view-profile #personal dd#bodytype img {
	width: 50px;
}


.set h2:first-child {
	margin-top: 0px !important;
}
.view-profile h2 {
	clear: left;
}
.view-profile div.profile.set {
	position: relative;
	min-height: 420px;
}
.view-profile #profilePhoto {
}
.view-profile #distance-map {
	clear: left;
	height: 250px;
	width: 435px;
	border: 1px solid #CCC;
}

.photoalbum {
	margin: 0; padding: 0;
	list-style: none;
}
.photoalbum li {
	float: left;
	width: 136px;
	height: 136px;
	padding: 4px;
}
.photoalbum li a {
	display: table-cell; 
	vertical-align: middle;
	width: 136px;
	height: 136px;
	line-height: 136px;
	text-align: center;
}
.photoalbum li a img {
	display: block;
	padding: 3px;
	border: 1px solid #CCC;
	vertical-align: middle;
	margin: auto;
}

.contacts .set{
	width: 211px;
	float: left;
	margin-right: 10px;
	height: 142px;
	padding: 5px;
	overflow-y: hidden;
}
.contacts .set a{	
	display: inline-block;
	margin-bottom: 5px;
}
.contacts .set img {
	float: left;
	padding: 3px;
	border: 1px solid #CCC;
	margin-right: 5px;
}
.contacts .screenname {
	font-weight: bold;
	margin-bottom: 20px;
}
.contacts a.view-profile, .contacts a.send-message {
	display: inline-block;
	line-height: 29px;
	background: url(/images/icon/sprite.png) 0 -274px no-repeat;
	padding-left: 38px;
	padding-right: 6px;
	margin-bottom: 0px;	
}
 .contacts a.send-message {
	background: url(/images/icon/sprite.png) 0 -308px no-repeat;

 }
 .contacts q {
	display: block;
	margin-top: 5px;
	font-size: 0.9em;
}

 .online, .offline  {
	display: block;
	position: absolute;
	top:35px; 	left: 0px;
	width: 24px; height: 18px;
	padding: 3px 0px;
	text-align: center;
	background-image: url(/images/icon/sprite.png);
	background-repeat: no-repeat;
	text-decoration: none;
	font-weight: bold;
	font-size: 0.8em;
	color: white;
}
 .online {
	background-position: 0px -372px;
}
 .offline {
	background-position: 0px -398px;
}
#contents a.edit {
	display: inline-block;
	height: 32px;
	width: 32px;
	margin-top: 4px;
	background: url(/images/icon/sprite.png) 0 -242px no-repeat;
	text-indent: -5555px;
}
#contents a.edit:hover {
	background-color: transparent;
}

.overview #statusForm small {
	display: none;
}

.overview #statusForm textarea {
	color: #005480;
	font-weight: bold;
	font-size: 1.25em;
	width: 100%;
	height: 69px;
	padding: 2px;
	vertical-align: text-bottom;
	border: 1px solid #09A1DE;
}

.overview #statusForm p {
	vertical-align: bottom;
}
.overview #statusForm strong {
	display: block;
	font-size: 1.4em;
	margin: 5px 4px;
	float: left;
	color: #005480;
	line-height: 32px;
}

.overview h3 {
	margin-top: 8px;
}
.overview h3.date {
	padding-top:8px;
	border-top: 2px solid #FDFDFD;
}
.overview ul, .overview #main p {
	margin: 0;
	list-style: none;
}
.overview #contents ul li {
	padding-left: 1.6em;
	line-height: 1.8em;
	
}
.overview ul li a{
	text-decoration: none;
}
.overview ul li a:hover{
	text-decoration: underline;

}
.overview ul.contact-accepted li { background: url(/images/icon/sprite.png) 0 -486px no-repeat;	}
.overview ul.contact-rejected li { background: url(/images/icon/sprite.png) 0 -467px no-repeat;	}
.overview ul.contact-requested li { background: url(/images/icon/sprite.png) 0 -447px no-repeat;	}
.overview ul.new-messages li { background: url(/images/icon/sprite.png) 0 -505px no-repeat;	}

.overview #people, .view-profile #personal {
	position: absolute;
	top: 54px;
	right: -240px;
	width: 200px;
}
.overview #people h2 {
	clear: both;
}
span.profilestatus {
	float: left;
	position: relative;
	margin: 4px;
	margin-top: 0px;
}
.overview #people .contacten img.contact {
}

.overview #people .matches img.match {
	width: 38px !important;
	height: 38px !important;
	float: left;
	margin: 2px;
}

/*  */
.edit-notifications table {
	width: 100%;
	border-spacing: 10px 3px;
}
.edit-notifications .col1 {
	width: 190px;
	text-align: left;
}
.edit-notifications col {
	width: 10%;	
}	
.edit-notifications td, .edit-notifications th {
	text-align: center;
}

dl.USP dt{
	background: url(/images/icon/sprite.png) 0 -340px no-repeat;	
	padding-left: 32px;
	line-height: 20px;
	margin-top: 8px;
}
dl.USP dd{
	margin-left: 32px;
}
dl.support dt{
	background: url(/images/icon/sprite.png) 0 -553px no-repeat;	
	padding-left: 32px;
	line-height: 20px;
	margin-top: 8px;
}

dl.support dd{
	margin-left: 32px;
}

/* send a friend */
#sendFriend textarea {
	width: 494px;
	height: 150px;
	overflow-y: scroll;
}
#regFeedback textarea {
	width: 720px;
	height: 20px;
}
#regFeedback textarea:focus {
	height: 130px;
}

#confirmFeedback, #showConfirmFeedback, #confirmFriend, #showConfirmFriend {
	display: none;
}

#fancy_wrap, #fancy_wrap * {
}
#fancy_content div#fancy_div {
	background:#FFF none repeat scroll 0 0;
	color: #000;
	z-index: 1000;
}

#fancy_div > *:first-child, #fancy_div > h2 {
	margin-top: 20px;
}
#fancy_div > * {
	margin-left: 20px;
	margin-right: 20px;
}
#fancy_div > *:last-child {
	margin-bottom: 60px;
}
/* Credits 
****************/
.credits dl {
	margin: 0; padding: 0;
}
.credits dl dt{
	float: left;
	width: 80%;
	margin-top: 0;
	font-weight: normal;
}
.credits dl dd{
	text-align: right;
}



/* Feedback
***********************************/

div#warning, div#error, div#confirm {
	position: relative;
	margin: 0 0 15px 0;
}

div#warning ul, div#error ul, div#confirm ul {
	padding: 0; 
	margin: 0 25px 0 15px;
}

.close {
	position: absolute;
	top: 2px;
	right: 2px;
	text-indent: -5555px;
	display: block;
	background: url(/images/icon/close.png) center center no-repeat;
	width: 20px; height: 20px;
}
.close:hover {
	background: url(/images/icon/close.png) center center no-repeat !important;
}