/* CSS Document */

html, body, form, fieldset, table, tr, td, img {
	font: 100%/150% Verdana, Arial, Helvetica, sans-serif;
}
body {
	background-color: #a3a3a3;
	font-size: 12px;
	line-height: 1.5em;
}

.clear { clear: both; }

/* Elements that need to enclose floats */
#content_vlak:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

img.png {
   behavior: url("./css/pngbehavior.htc");
}

ul ul {
	margin-left: 1.5em;
}

a, a:link {
	border-bottom: 1px solid rgb(230,225,175);
	color: #81017e;
	text-decoration: none;
}
a:visited {
	border-bottom-color: rgb(215,205,185);
}
a:hover {
	border-bottom-color: #81017e;
}

#page_content_header a, #page_content_header img, #winkelwagen a, #headernav a {
	border: none;
}

#container {
	background-color: #FFFFFF;
	background-image: url(../images/container_top_bg.jpg);
	background-repeat: repeat-x;
	margin: 0px;
}

#page_holder {
	background-image: url(../images/page_holder_bottom_bg.jpg);
	background-repeat: repeat-x;
	background-position: bottom left;
	text-align: center;
	margin: 0px;
}

#page {
	position: relative;
	margin: 0px auto;
	min-height: 770px;
	_height: 770px;
	width: 1000px;
	text-align: left;
	background-image: url(../images/page_bg.png);
	_background-image: url(../images/page_bg.gif);
	background-repeat: repeat-y;
}

#page_content {
	background-image:url(../images/page_header_bg.jpg);
	_background-image:url(../images/page_header_bg2.jpg);
	background-repeat: no-repeat;
	padding: 85px 25px 0;
	position: static;
}

#page_middle {
	padding: 0px 25px;
}

#logo {
	position: absolute;
	left: 30px;
	top: 35px;
}
#vindvolgLogo {
	position: absolute;
	right: 60px;
	top: 52px;
}

#hmenu {
	position: relative;
}

#hmenu ul, #hmenu ul li {
	color: #FFF;
	display: inline;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}
#hmenu ul li {
	float: left;
	padding: 0 0.5em;
}

#hmenu ul li a {
	border: none;
	color: #FFF;
	display: block;
	font-weight: bold;
	height: 25px;
	margin-top: 3px;
	padding: 0.2em 1em 0;
	text-align: center;
	text-decoration: none;
	background-position: left top;
}

#hmenu ul li a:hover, #hmenu ul li a.actief, body.index #hmenu_information, body.activation #hmenu_activation, body.qanda #hmenu_qanda  {
	background-position: left -25px;
	background-color: #FFF;
	color: #000;
}

/* IE6 needs explicit widths.. */

#hmenu #hmenu_information {
	/*padding: 0;
	width: 221px;
	background-image: url(../images/btn_abonnementen_sim.gif);*/
	width: 7em;
}
#hmenu #hmenu_activation {
	width: 10em;
}
#hmenu #hmenu_login {
	width: 5em;
}
#hmenu #hmenu_qanda {
	width: 10em;
}

#submenu {
	clear: both;
	position: relative;
	background-color: #FFF;
	height: 25px;
	border-bottom: 1px solid #f9f3f9;
}

#submenu ul, #submenu ul li {
	display: inline;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}
#submenu ul li {
	float: left;
	padding-top: 1px;
}
#submenu ul li a {
	display: block;
	padding: 2px 20px 2px 16px;
	color: #81017e;
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
	background-color: #FFFFFF;
}
#submenu ul li a:hover, #submenu ul li a.current {
	color: #000000;
}

#winkelwagen, #loginLink {
	position: absolute;
	top: 85px;
	right: 25px;
	width: 150px;
	background-image: url(../images/winkelwagen_separator.gif);
	background-repeat: no-repeat;
	z-index: 10;
}
#winkelwagen img {
	vertical-align: middle;
}
#loginLink {
	padding-top: 2px;
	right: 175px;
	text-align: center;
	width: 100px;
}

#ww_tekst {
	display: block;
	position: relative;
	height: 23px;
	text-align: right;
	padding-top: 2px;
}

#loginLink a, #ww_tekst a {
	border-bottom-color: #999;
	color: #fff;
	font-size: 11px;
}
#loginLink a:hover, #ww_tekst a:hover {
	border-bottom-color: #fff;
}

#toptabs {
	position: absolute;
	top: 32px;
	left: 350px;
	background-image: url(../images/_tabs.gif);
	background-repeat: no-repeat;
	width: 302px;
	height: 25px;
}
#toptabs span {
	display: none;
}

#search_form {
	position: absolute;
	top: 38px;
	right: 31px;
}

#search_q {
	vertical-align: top;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	width: 156px;
	padding: 2px 6px;
	color: #a1a1a1;
	border: 1px solid #e4e4e4;
}

#hmenu {
	height: 25px;
	background-color: #81017e;
}

#content_vlak {
	background: url("../images/background.jpg") repeat-x -25px 0;
	min-height: 550px;
	_height: 550px;
	padding-bottom: 3em;
	text-align: center;
}

#content .largeFlash {
}
#content .smallFlash {
	display: none;
	float: right;
	height: 143px;
	margin-top: -1.5em;
	padding: 1em 0 1.5em 1em;
	width: 215px;
}

#content_inhoud, #targetGroups {
	margin: 0 auto;
	width: 850px;
	text-align: left;
}

#targetGroups h2 {
	color: #81017E;
}
#targetGroups img {
	float: left;
	padding-right: 1.5em;
}

#targetGroups div.group {
	display: none;
	margin-top: 1.5em;
}
#targetGroups div.demo .demo {
	margin: 0 auto;
	padding: 1.5em 0;
	width: 425px;
}

#targetGroups div.info img {
	margin-left: -40px;
	padding-top: 1em;
}
#targetGroups div.info div {
	margin-left: 272px;
}

#targetGroups table .col2, #targetGroups table .col3 {
	width: 16em;
}
table {
	border: none;
	margin-bottom: 1.5em;
}
table td, table th {
	border-bottom: 1px solid #ccc;
	padding: 0.5em;
}
table th {
	border-color: #999;
}

#etalage {
    position: relative;
    height: 178px;
    border-bottom: 1px solid #a1a1a1;
    background-color: #FFFFFF;
    background-repeat: no-repeat;
    background-position: left top;
}

div.tussenlijn {
	width: 689px;
	height: 5px;
	background-image: url("../images/tussenlijn.png");
	background-repeat: no-repeat;
	background-position: top center;
	margin: 15px 0px;
}

/* FOOTER */
#footer_tekst {
	font-size: 14px;
	color: #019272;
	font-weight: bold;
	padding: 16px 0px 12px 0px;
}
#footer_links {
	font-size: 11px;
	color: #e4e4e4;
}
#footer_links a {
	color: #e4e4e4;
	text-decoration: none;
}
#footer_links a:hover {
	border-bottom-color: #fff;
}

#page_footer2 {
    height: 75px;
    width: 1000px;
    text-align: center;
    position: absolute;
    z-index: 99;
}

#m5ftrbg {
	display: block;
}

.qanda dt {
	font-size: 108.3%;
	margin: 1.5em 0;
	padding: 0.3em 0.2em;
}
.qanda dl.algemeen dt {
	background-color: #e1e1e1;
}
.qanda dl.site dt {
	background-color: #ecd9ec;
}
.qanda dl.alerts dt {
	background-color: #eaf2b7;
}

.qanda table.buttons .col1, .qanda table.buttons .col3 {
	width: 15em;
}
.qanda table.colours .col1, .qanda table.colours .col2 {
	width: 25em;
}

/********************************************************************
		Activation page
********************************************************************/

form ul {
	list-style-type: none;
}

form ul li {
	clear: left;
}

li button {
	margin-right: 1em;
}

input[type=text], select, input[type=password] {
	border: 1px solid rgb(46, 126, 184);
	width: 10em;
}
input:focus, input.focus, select:focus, select.focus {
	border-color: rgb(6, 76, 134);
}
select {
	width: auto;
}
select option.group, select optgroup {
	font-style: italic;
	font-weight: bold;
}
select option {
	margin: 0.2em 0;
}

input, select {
	padding: 0.2em;
}

.inactive {
	color: rgb(153, 134, 117);
}

.error {
	color: rgb(190,47,45);
}

.error ul {
	list-style-type: disc;
}

.description {
	color: #777;
	display: block;
	/*font-size: 91.6%;*/
	line-height: 140%;
}

input.error {
	background-color: rgb(250,230,230);
	border-color: rgb(220,20,20);
}

label.left span {
	display: block;
	float: left;
	margin-right: 1em;
	text-align: right;
	width: 8em;
}

label.left input, label.left select {
	float: left;
	margin-bottom: 1em;
}

label.top {
	display: block;
}

form .align {
	margin-left: 9em;
}

li.login input {
	width: 15em;
}
li.name input {
	width: 12em;
}

form.flyoutDescription div.description {
	background-color: rgb(250,250,190);
	border: 1px solid rgb(230,230,140);
	display: none;
	position: absolute;
	left: 24em;
	padding: 0.2em 0.5em;
	top: 0;
	width: 20em;
	z-index: 2;
}
form.flyoutDescription ul li {
	position: relative;
}
#formTwo div.description {
	background: rgb(250,250,250);
	border: solid rgb(210,210,210);
	border-width: 1px 0;
	margin: 3em auto 1em;
	padding: 1em 1.5em;
	position: static;
	width: 70%;
}
#formTwo div.description img {
	display: block;
	margin: 0 auto;
}

div.loading {
	background: url("../gfx/ajax-loader_circle-ball-339900.gif") no-repeat;
	display: none;
	height: 16px;
	padding: 0 8px;
}
.submitting div.loading {
	display: inline;
}

.activation #login {
	display: none;
}

.activation #content {
	min-height: 65em;
}

.activation #content form li {
	border-top: 1px solid rgb(233, 223, 212);
	padding-top: 0.5em;
}
.activation #content form li.first {
	border-top: none;
}
.activation #content form div.error li {
	border-top: none;
}

.activation #formOne, .activation #formTwo {
	border-right: 1px solid #ccc;
	float: left;
	padding: 0 12px 0 0;
	width: 48%
}
.activation #formTwo {
	border-right: none;
	padding: 0 0 0 12px;
}

.activation h2 .order {
	color: rgb(153, 134, 117);
	font-size: 250%;
	padding-right: 12px;
	vertical-align: middle;
}
.activation h2 {
	margin-bottom: 2em;
}

.activation #formOne label.left span, .activation #formTwo label.left span {
	width: 15em;
}

.activation #formOne .align, .activation #formTwo .align {
	margin-left: 16em;
}

.activation form div.description {
	left: 27em;
	top: 0.5em;
}

.activation form li.login div.description {
	left: 32em;
}

.activation .stepDone {
	color: #AAA;
	text-decoration: line-through;
}
.activation h4.stepOne, .activation h4.stepTwo {
	color: rgb(10,120,20);
	display: none;
	text-align: center;
}

.activation span.login {
	font-weight: bold;
}

.activation #checkFormOneDialog {
	display: none;
}
.activation #checkFormOneDialog  .formData p {
	clear: left;
	padding-left: 9em;
}
.activation #checkFormOneDialog  .formData span.fieldName {
	clear: left;
	float: left;
	margin-left: -9em;
	vertical-align: middle;
	width: 8.9em;
}

#loginDialog {
	display: none;
}
#loginDialog a {
	font-size: 91.6%;
}
#loginDialog .success {
	color: rgb(25,198,15);
}
#loginDialog .success ul {
	list-style-type: disc;
}

/********************************************************************
		jQuery UI
********************************************************************/

/*dialog*/
.ui-dialog {
	/*resets*/margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none;
	background: #ffffff;
	border: 2px solid #d3d3d3;
	position: relative;
}
.ui-dialog-content {
	background: #ffffff;
	color: #222222;
	padding: 1em 0;
	margin: 0 1.5em;
}
.ui-dialog-overlay {
	opacity: 0.5;
	background: #000;
} 
.ui-resizable-handle {
	position: absolute;
	font-size: 0.1px;
	z-index: 99999;
}
.ui-resizable .ui-resizable-handle {
	display: block; 
}
body .ui-resizable-disabled .ui-resizable-handle { display: none; } /* use 'body' to make it more specific (css order) */
body .ui-resizable-autohide .ui-resizable-handle { display: none; } /* use 'body' to make it more specific (css order) */
.ui-resizable-n {
	cursor: n-resize; 
	height: 7px; 
	width: 100%; 
	top: -5px; 
	left: 0px;  
}
.ui-resizable-s {
	cursor: s-resize; 
	height: 7px; 
	width: 100%; 
	bottom: -5px; 
	left: 0px; 
}
.ui-resizable-e {
	cursor: e-resize; 
	width: 7px; 
	right: -5px; 
	top: 0px; 
	height: 100%; 
}
.ui-resizable-w {
	cursor: w-resize; 
	width: 7px; 
	left: -5px; 
	top: 0px; 
	height: 100%;
}
.ui-resizable-se {
	cursor: se-resize; 
	width: 13px; 
	height: 13px; 
	right: 0px; 
	bottom: 0px; 
	background: url("../gfx/ui/222222_11x11_icon_resize_se.gif") no-repeat 0 0;
}
.ui-resizable-sw { 
	cursor: sw-resize; 
	width: 9px; 
	height: 9px; 
	left: 0px; 
	bottom: 0px;  
}
.ui-resizable-nw { 
	cursor: nw-resize; 
	width: 9px; 
	height: 9px; 
	left: 0px; 
	top: 0px; 
}
.ui-resizable-ne { 
	cursor: ne-resize; 
	width: 9px; 
	height: 9px; 
	right: 0px; 
	top: 0px; 
}
.ui-dialog-titlebar {
	/*resets*/margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none;
	padding: .5em 1.5em .5em 1em;
	color: #555555;
	background: #e6e6e6 url("../gfx/ui/e6e6e6_40x100_textures_02_glass_75.png") 0 50% repeat-x;
	border-bottom: 1px solid #d3d3d3;
	font-size: 1.1em;
	font-weight: normal;
	position: relative;
}
.ui-dialog-title {

}
.ui-dialog-titlebar-close {
	/*resets*/margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none;
	background: url("../gfx/ui/888888_11x11_icon_close.gif") 0 0 no-repeat;
	position: absolute;
	right: 8px;
	top: .7em;
	width: 11px;
	height: 11px;
	z-index: 100;
}
.ui-dialog-titlebar-close-hover, .ui-dialog-titlebar-close:hover {
	background: url("../gfx/ui/454545_11x11_icon_close.gif") 0 0 no-repeat;
}
.ui-dialog-titlebar-close:active {
	background: url("../gfx/ui/222222_11x11_icon_close.gif") 0 0 no-repeat;
}
.ui-dialog-titlebar-close span {
	display: none;
}

.ui-dialog-buttonpane {
	position: absolute;
	bottom: 0;
	width: 100%;
	text-align: right;
	border-top: 1px solid #d3d3d3;
	background: ;
}
.ui-dialog-buttonpane button {
	margin: .5em 8px .5em 0px;
	color: #555555;
	background: #e6e6e6 url("../gfx/ui/e6e6e6_40x100_textures_02_glass_75.png") 0 50% repeat-x;
	font-size: 1.1em;
	border: 1px solid #d3d3d3;
	cursor: pointer;
	padding: .2em .6em .3em .6em;
	line-height: 1.4em;
}
.ui-dialog-buttonpane button:hover {
	color: #212121;
	background: #dadada url("../gfx/ui/dadada_40x100_textures_02_glass_75.png") 0 50% repeat-x;
	border: 1px solid #999999;
}
.ui-dialog-buttonpane button:active {
	color: #222222;
	background: #ffffff url("../gfx/ui/ffffff_40x100_textures_02_glass_65.png") 0 50% repeat-x;
	border: 1px solid #dddddd;
}
/* This file skins dialog */
.ui-dialog.ui-draggable .ui-dialog-titlebar,
.ui-dialog.ui-draggable .ui-dialog-titlebar {
	cursor: move;
}
