/*
define font-family globally
*/

	body, .body_css {
		font-family: arial;
		margin: 0;
		padding: 0
	}

	.d2 {
	padding:10px !important;	
	margin: 8px;
	
	}

/* NWA: background-color van hoofdtabel.*/
.main2 td {
	
}
/*NWA: backgrouncolor van stoelenplan*/
#seats {
	background-color: white;
}
/*NWA: define border/colors of +/- buttons*/
.up_down_backgournd , .up_down_backgournd td { /*let op spelfout! */
	border: none;
	background-color: #FFF;
}
.up_down_text {
	font-weight: bold;
	color: white;
}
/*NWA: tabletitel*/
.tabletitle {
	color: white;
	font-size: 12px;
	font-weight:bold;
	padding: 0 0 0 5px;
	
}

/* 
define banner image (.banner1 td)
	-width of image should be equal to width in eSRO-settings
	-don't forget to set height, same as height of image, or:
	-if you need 'white-space' below banner and above page-title:make height a little higher

*/

.banner1 td, #header{
	background-image: url(images/header_lievevrouw.gif);
	background-repeat: no-repeat;
	background-position: left 8px;
	height:95px;
	position: relative;
}
.footer td, div.footer{
	background-image: url(images/footer_lievevrouw.gif);
	background-repeat: no-repeat;
	background-position: left 20px;
	xborder: solid 1px #CC071E;
	height:71px;
	position: relative;
	
}
/* define location of helpbutton (somewhere within the banner header */
.banner1 td div.helpbutton, #header .helpbutton {
	position: absolute;
	width: 100px; /* define height and with */
	height: 20px;
	xborder: solid 1px #CC071E; /* use only to show where the button is */
	left: 437px; /* define location of banner (relative to top left corner of banner) */
	top: 43px;
}
.banner1 td div.helpbutton a, #header .helpbutton a {
	position:absolute;/*don't change */
	display:block; /*don't change */
	width:100%; /* don't change; takes over the width and height of .helpbutton (above)*/
	height: 100%; /* don't change: takes over the width and height of .helpbutton (above)*/
	text-indent: -9000px; /*needed to hide the actual text, and to show the text in the header image */
}
/*
define look and feel of title of page (eg. 'area seating plan')
*/
.general_caption, .ncolh1 {
	background-color: purple !important;
	font-size: 14px;
	font-weight: bold;
	color: white;
	padding: 8px;
	text-align:left;
	
}
.scnd_caption, h2 {
	background-color: pink ;
	font-size: 12px;
	font-weight: bold;
	color: white;
	padding: 3px;
	margin: 10px 0;
}
/*
define look and feel of second/smaller title of page (eg. 'area seating plan')
*/
.general_caption2 {
	background-color: black;
	font-size: 14px;
	font-weight: bold;
	color: pink;
	padding: 2px 6px;
	
}
/*mededelingen*/
.mededeling1 {
	color: blue;
	font-weight: bold;
	padding: 10px; 
	margin-left: 3px;
}

/*mededelingen*/
.mededeling2 {
	color: blue;
	font-weight: bold;
	padding: 10px; 
	margin-left: 3px;
	margin-top: -100px;
}
/* +-+-+-+-+-+-+-+- SEATS PAGE+-+-+-+-+-+-+-+-+-+- */

/* loading-text on seatspage*/
.loading {
	text-align: center;
	color: #CC071E;
	font-style: italic;
	font-weight: bold;
}


/*
define td just below title of page (let's call that td 'Gerard')
*/
.item_background {
	background-color: none;
	border: solid 1px black;	
}
/*
define rows in table within 'Gerard'
*/
.item_data_background {
	background-color: white;
}
/*
define colors of text within row
	-if you don't set it, it will be grey (#616161)
*/
.small_text_b { 
	color: black;
}

/*
define 'names' in rows (like 'event', 'On', 'Location', 'area', 'tickets type' etc.
*/
.small_text_b b {
	font-weight: bold;
	color: #CC071E;
}
/*amount of tickets ordered - TOP */
#lblSummary {
	display: block;
	width: 100%;
	height: 18px;
	font-weight: bold;
	color: #CC071E;
	padding: 3px 0;
}
/*amount of tickets ordered - BOTTOM */
#lblDetails {
	display: block;
	width: 100%;
	height: 18px;
	font-weight: bold;
	color: #CC071E;
	padding: -10px;
}

.baga_passnummer_label_postion, baga_passnummer_textfield_postion{
	font-size: 12px;
	display: inline;
	float: left;
}
.baga_passnummer_label_postion {
	padding: 2px 0;
	color: #CC071E;
}

/* +-+-+-+-+-+-+-+- BASKET PAGE +-+-+-+-+-+-+-+-+-+- */

.small_text_a {
	font-size: 11px;
	color: black;

}
td.small_text_d, td.small_text_a{
	padding: 0 0 0 8px;
	vertical-align:top;
}

/* .basket_border is used for both the event-data (title, date/time and location) and for the rows within the basket, 
but the rows in the basket are nested, so you can address them, but it means that if you define .basket_border in the first
declaration (below), you have to redefine it in the second.. capiche? */

/* 
define box for event name, date/time and location
*/
	.small_text_a .basket_border {
		border:solid 1px white ;
		padding: 5px;
	}
/*
define row-headers (th) in basket (with seat number, ticket type, price etc)
*/
	.small_text_a .small_text_a th.basket_border {
		border:none;
		background-color: #CC071E;
		padding: 3px;
		text-align: left;
	}
/*
define rows and tables in basket (with seat number, ticket type, price etc)
*/
	.small_text_a .small_text_a .basket_border {
		border:none;
		border-top: solid 1px #000;
		border-bottom: solid 1px #000;
		padding: 3px;
	}
/*totals of basket*/
.small_text_c {
	font-size: 11px;
}

table.totalbutton{
	width: 100%;
}
tr.total td {
	
	font-weight: bold;
	padding: 2px 0 4px 0;
	
}
tr.total td .small_text_c{
	color: salmon;
	font-size: 14px;
}
tr.total td .small_text_a{
	color: #000 ;
	font-size: 14px;
}

.melding {
	padding: 10px 0;
}
.alertmelding {
	padding: 10px 0;
	color: #CC071E;

}

/* +-+-+-+-+-+-+-+- PAY FORM AND OR LOGIN FORM +-+-+-+-+-+-+-+-+-+- */

/*define basket on creditcard form-page*/
.screen_object_background_c {
	background-color:lavender;
	border: solid 1px navy;
}

/*define header from basket contents on creditcard form page */
.screen_object_caption_c {
	background-color: aqua;	
	font-weight:bold;
	color:deeppink
	
}
/*define line between amount of tickets and total in basket*/
.screen_object_background_c .screen_object_seperator_a {
	border-bottom: solid 1px white;
}
/*define line between login-form and creditcard-form*/
.screen_object_seperator_a {
	border-bottom: solid 1px #CC071E;
}
form td.small_text_d {
	padding-top: 15px;
}
.must_field {
	color: #CC071E;
	font-size: 15px;
	xtext-decoration: blink;
}
.explaininput {
	color: orange; 
	font-size: 10px;
	padding-bottom: 3px;
}

/* +-+-+-+-+-+-+-+- BUTTONS +-+-+-+-+-+-+-+-+-+- */
/*
define buttons
*/
tr.button td {
	text-align: right;
	
}
.small_button_a, .small_button_b, .small_button_c, a.buttonfake, input.ncol {
	background-color: green;
	border: solid 1px black;
	font-family: arial;
	font-size: 10px;
	padding: 2px;
	height: auto;
}

/*
define button is mouseover state
*/
.small_button_a_hover, .small_button_b_hover, .small_button_c_hover,  a.buttonfake:hover, .ncol {
	background-color: orange;
	border: solid 1px black;
	font-family: arial;
	font-size: 10px;
	padding: 2px;
	height: auto;
}
/*
define individual buttons (but define 'global' buttons above!) -only if you like!
*/
.small_button_a {}
.small_button_a_hover {}
.small_button_b {}
.small_button_b_hover {}
.small_button_c {}
.small_button_c_hover {}

/*define 'fake-buttons' (on page crm_login.asp): links that appear as buttons 
if you don't want them to look like the other buttons, romove below styles AND remove "a.buttonfake" and "a.buttonfake:hover" declaration above
*/
a.buttonfake {
	color: white;
	width: 45px !important;
	text-decoration: none;
	display:block;
	clear:both;
	text-align:center;
	margin: 4px 0;
	
	
	
	
}

/* +-+-+-+-+-+-+-+- LINKS +-+-+-+-+-+-+-+-+-+- */
/*
define hyperlinks
*/

.shoppingcard_hlink {text-align:right;padding: 2px 0}
.shoppingcard_hlink a {
	background:#fff url(images/shoppingcard.gif) no-repeat top left;
	padding: 0 0 0 15px;
	font-size: 12px;
	color: black;
	text-decoration: none;
}
.shoppingcard_hlink img {
	padding: 2px;
	border: none;
	
}



/* +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+- */
/* +-+-+-+-+-+-+-+- SPECIFIC OGONE STYLES +-+-+-+-+-+-+-+-+-+- */
/* +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+- */

/*definte container, should be same width as width of table in eSRO pages*/
body, html {height: 100%;}
#container {width: 550px; height: 100%; position: relative;left: 50%; margin-left:-275px;}


/* set styles of tables*/
#ogonecontent {
	padding: 0 10px;
	position: relative;
	
}
table.ncoltable1, table.ncoltable2, table.ncoltable3 {
	color: #000;
	font-size: 12px;
	background-color: white;
}
table.ncoltable2 {
	border: solid 1px black;
	padding: 9px;
}
.ncoltxtl small, .ncoltxtr small b, .ncoltxtl2 small{
	font-size: 12px;
	font-style:normal;
}

input.ncol {
	font-size: 12px;
	padding: 3px 10px;
}
#xform3 {
	position: relative;
	margin-top: -150px;
	border: solid 1px #CC071E;
	text-align: right;
}


/* +-+-+-+-+-+-+-+- USERDATA +-+-+-+-+-+-+-+-+-+- */

.hr1,.hr2, .hr3 {
	height: 1px;
	border: 0px;
	margin: 0px;
	border-top: 1px solid #ce2863;
} 
.hr2 {
	border: none;
	display: none;
}

