/* Donker blauw: #006792
 * Lichter blauw: #56B4DB
 * Heel donker blauw: #034E6E
 */

body {
	font-family: arial,helvetica,sans-serif;
    font-size: 12px;
	color:#333333;
	
	background-color:#FFFFFF;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 0px;
}
table {
	/* text in table erft body font niet over, in klasse zetten */
	font-family: arial,helvetica,sans-serif;
    font-size: 12px;
	color:#333333;
	
	border:0;
	padding:0;
}
a:link, a:visited {
	color: #006792;
	text-decoration: none;
}
a:hover, a:active {
	color: #56B4DB;
	text-decoration:underline;
}
.smallfont {
	font-family: arial,helvetica,sans-serif;
    font-size: 10px;
	color:#333333;
}

img {
	border: 0;
}

form {
	margin-top: 0;
	padding-top: 0;
}

.paypalfrm {
	margin: 0;
	padding: 0;
}
.red {
	color: #FF0000
}

/*--streepjeslijn--*/
.dashed-ruler, .dashed-ruler-rel, .dashed-ruler-100 {
	border-width: 1px; border-style: dashed; border-color: #919191;
	
	border-top: 1px dashed #919191;
	border-bottom: 0px solid #fff;
	color: #fff;
	background-color: #fff;
	height: 1px;
	
	margin-top: 7px;
	width: 749px;
}
.dashed-ruler-rel, .copy-rel {
	/* ruler die niet onder de navigatie komt, maar lager (zoals in FAQ.php) */
	/* ook het copy statement moet dan naar links! */
	position: relative;
	left: -185px;
}
.dashed-ruler-100 {
	width: 100%;
}

/*--streepjesboxen--*/
#wallpapers {
	border:dashed 1px #ccc;
	padding:0;
	margin:0;
	height: 148px;
}
#wallpapers1 {
	border:dashed 1px #ccc;
	padding:0;
	margin:0;
	height: 74px;
}
#ringtones, #ingelogd {
	border:dashed 1px #ccc;
	padding:0;
	margin:0;
	width: 196px;
	overflow: hidden;
}
#ingelogd {
	padding: 8px;
	padding-bottom: 12px;
	width: 196px;
}
/* VOOR niet IE browsers smaller: */
html>body #ingelogd { width: 180px }


#smspictures {
	border:dashed 1px #ccc;
	padding:0;
	margin:0;
	height: 148px;
}

/*--Fonts--*/
.hoofding {
	font-family: arial,helvetica,sans-serif;
    font-size: 15px;
	font-weight:bold;
	color:#333;
	margin-bottom: 3px;
}

/*--Main layers met backgr. images--*/
#id01 {
	position:absolute;
	left:0px;
	top:0px;
	width:770px;
	height:149px;
	background: url(../images/01.jpg);
}

#id02 {
	position:absolute;
	left:0px;
	top:149px;
	width:531px;
	height:63px;
	background: url(../images/02.jpg);
}

#id03 {
	position:absolute;
	left:531px;
	top:149px;
	width:238px;
	height:63px;
	background: url(../images/03.jpg);
}

#id04 {
	position:absolute;
	left:0px;
	top:212px;
	width:769px;
	height:248px;
	background: url(../images/04.jpg) no-repeat;
}

#jackpot, #jackpot_shadow {
	position:absolute;
	left:640px;
	top:170px;
	width:100px;
	height:101px;
	background: url(../images/jackpot.gif) no-repeat;
	z-index:2;
	padding-left:35px;
	padding-top:55px;
	
	/* font */
	font-family: arial,helvetica,sans-serif;
    font-size: 25px;
	font-weight:bold;
	/*color:#999999;*/
	color:#6E9FB3;
}
#jackpot_shadow {
	/* eigenlijk is dit de lichte kleur, omdat die bovenop moet komen
	 * 2px naar boven en links */
	background: none;
	z-index:3;
	left:638px;
	top:168px;
	
	/* font */
	color:#006792;
}

#gebruiker {
	position:absolute;
	left:566px;
	top:130px;
	width:200px;
	height:16px;
	z-index:2;

	/* font */
	font-family: arial,helvetica,sans-serif;
    font-size: 12px;
	font-weight:normal;
	color:white;
}

/*--CSS Buttons--*/
/* create a button look for links */
#knoppen a:link, #knoppen a:visited, .cat {
	background-color:#006792;
    border-bottom:#039 solid 1px;
    border-right:#039 solid 1px;
    border-left:#9cf solid 1px;
    border-top:#9cf solid 1px;
    color:white;
    font-family:arial,helvetica,sans-serif;
    font-size:11px;
    font-weight:bold;
    letter-spacing: .5pt;
    padding:1px;
	padding-left: 3px;
    text-decoration:none;
    width:165px;
	display: block;
}

.cat {
	background-color:#034E6E;
}


#knoppen a:hover {
	background-color: #56B4DB;
}

/* depress effect on click */
#knoppen a:active, #knoppen a:focus {
	border-bottom:#9cf solid 1px;
    border-left:#039 solid 2px;
    border-right:#9cf solid 1px;
    border-top:#039 solid 1px;
    letter-spacing: .3pt;
    width:165px;
}

#knoppen {
	position:absolute;
	top: 70px;  /* plaats de knoppen */
	left: 20px; /* onder de bol      */
}

/*--Content layer--*/
#content, #contentIndex {
	position:absolute;
	top: 70px;  /* plaats de knoppen */
	left: 205px; /* onder de bol      */
	width:560px;
}
#contentIndex {
	/* (smaller) */
	width:340px; /* max breedte, want ook nog rechter kolom */
}

/*--Rechter layer--*/
#rechts {
	position:absolute;
	top: 70px; 
	left: 569px;
	width:200px;
	overflow: hidden; /* de niet-wrappende ringtones zorgen voor meer breedte! */
	/* als we niet clippen kan er dmv slepen nog worden verschoven in de layer: clip:rect(top,right,bottom,left) */
	clip:rect(0,200px,1000px,0); 
}

/*--login form---*/
label, #signupfrm label, #actfrm label {
	margin: 0;
	padding-top:6px;
	padding-bottom:3px;
	text-align:right;
	width:61px;
	float:left;
}
#signupfrm label {
	/* breder */
	width:150px;
}
#actfrm label {
	/* middelmatig breed */
	width:100px;
}
.fieldset, #signupfrm .fieldset {
	border:dashed 1px #ccc;
	width:196px; /* max, anders te groot in firefox */
	padding:0;
}
#signupfrm .fieldset {
	/* breder */
	width:296px;
}
#actfrm .fieldset {
	/* middelmatig breed */
	width:246px;
}
#frmlogin {
	margin:0;
	padding:0;
	margin-bottom: 1px;
}
.nobr {
	display:none;
}
.selectbox {
	font:11px  Verdana, Arial, Helvetica, sans-serif ;
	color:#333 ;
	height:20px;
	margin-top:15px;
}
.textfield, .textfieldLeft {
	font:11px  Verdana, Arial, Helvetica, sans-serif ;
	color:#333 ;
	margin:3px;
	margin-left:0;
	margin-right:2;
	height:22px;
	border:solid 1 #fff;
	padding: 3px 8px; /* top-bot left-right */
	background: transparent url(../images/textfield_bg.gif) no-repeat fixed;
	width:143px;
	voice-family: "\"}\""; /* IE stopt hier */
	voice-family:inherit;
	width:127px;
	float:right;
}
.textfieldLeft {
	float: none;
}
html>body .textfield {
	/* FOR OPERA ONLY */
	width:125px;
} 

fieldset>input.textfield {
	/* Dit ziet IE niet */
	background: transparent url(../images/textfield_bg.gif) no-repeat;
}

/* om layout juist te houden, een onzichtbare textfield creeren voro labels */
.whiteLabel {
	background-color:#FFFFFF;
	font:11px  Verdana, Arial, Helvetica, sans-serif ;
	color:#333 ;
	margin:3px;
	height:20px;
	border:solid 0 #fff;
	padding: 3px 8px; /* top-bot left-right */
	width:141px;
	voice-family: "\"}\""; /* IE stopt hier */
	voice-family:inherit;
	width:125px;
	float:right;
}
html>body .whiteLabel {
	/* FOR OPERA ONLY */
	width:125px;
} 

.selectbox {
	background-color:#CCCCCC;
	font:11px  Verdana, Arial, Helvetica, sans-serif ;
	color:#333 ;

	border-color: #FFFFFF;
	border-style: inset;
}

textarea {
/* EM NOG OMZETTEN NAAR PX !! */
	font:1.1em Verdana, Arial, Helvetica, sans-serif;
	color:#333 ;
	margin:3px;
	height:165px;
	border:solid 0 #fff;
	padding: 0 8px;
	background: transparent url(../images/textarea_bg.gif) no-repeat fixed;
	width:200px;
	voice-family: "\"}\""; 
	voice-family:inherit;
	width:190px;
}
fieldset>textarea {
	background: transparent url(../images/textarea_bg.gif) no-repeat;
}

.submit, .submitSignup {
	margin:3px;
	background: transparent url(../images/submit.gif) no-repeat;
	height:20px;
	border:solid 0 #fff;
	width:80px;
	font:11px Verdana, Arial, Helvetica, sans-serif;
	color:#666;
	font-weight: bold;
}
.submitSignup {
	float: right;
}
.radio {
	margin-left: 11px;
}


.labelInForm {
	/* kleine marge voorzien */
	margin-left: 3px;
	margin-top: 1px;
}

/*--Ringtones mogen niet wrappen!--*/
.ringtext {
	white-space: nowrap;
}

.invisible {
	position:absolute; left:0px; top:0px; width:80%; height:1px; z-index:0; visibility:hidden;
}

