/* ================================ +
   		  OPENLUCHT THEATER
 + ================================ */



/* 
** Made by: Thomas Lievestro
** Email:	info@lievestro.com
** Website:	www.lievestro.com
*/



/* ================================ +
               STANDARDS 
+  ================================ */

/* start RESET DEFAULT styles */
*{ 
	margin:					0;
	padding:				0; 
	border: 				0;
}

*:focus { 
	outline: 				0; 
}

html {
	background: 		url('../images/bg.jpg') no-repeat;
}

body { 
	font-family: 		arial, helvetica, sans-serif;
	font-size:			13px;
	line-height:		18px;
	color: 					#000000;
}
	
img { 
	border:					0px; 
}	

ul { 
	list-style:			none; 
	white-space: 		nowrap; 
}

li a {
	height:					1%; /* geen whitespace tussen link list items */
}

a { 
	text-decoration:		none; 
	color:					#000000
}

a:hover{ 
	text-decoration: underline; 
	color:					#000000;
}

a img {
	border: 				0px;	
}

.clear {
	clear:					both;
}

p {
	margin-bottom:	12px;	
}

address{
	font-style:			normal;
}

textarea {	
	overflow:				auto;
}

/* end RESET DEFAULT styles */

/* ================================ +
             GLOBAL LAYOUT
+  ================================ */

#wrapper {	
	width:					990px;
	margin-left:		auto;
	margin-right:		auto;
}

#header {
	width:					990px;
	height:					155px;
	overflow:				hidden;
}

#logo{
	position:				absolute;
	display:				block;
	width:					712px;
	height:					83px;
	margin:					29px 0 0 242px;
	background:			url('../images/logo.png') no-repeat;	
	text-indent:		-1000em;
	overflow:				hidden
}

#menu {
	position:				absolute;
	width:					992px;
	height:					25px;
	margin-top:			130px;		
}


#menu  li{
	display: 				inline;
	width:					122px;
	height:					25px;
	margin-right:		2px;
	float:					left;
}

#menu li a {
	display:				block; 
	width:					122px;
	height:					44px;
	text-indent:		-1000em;
	overflow:				hidden
}

#nav_1 a {background: url('../images/nav.gif') no-repeat  0px   0px;}
#nav_2 a {background: url('../images/nav.gif') no-repeat -124px 0px;}
#nav_3 a {background: url('../images/nav.gif') no-repeat -248px 0px;}
#nav_4 a {background: url('../images/nav.gif') no-repeat -372px 0px;}
#nav_5 a {background: url('../images/nav.gif') no-repeat -496px 0px;}
#nav_6 a {background: url('../images/nav.gif') no-repeat -620px 0px;}
#nav_7 a {background: url('../images/nav.gif') no-repeat -744px 0px;}
#nav_8 a {background: url('../images/nav.gif') no-repeat -868px 0px;}

#nav_1 a:hover, #nav_1.active a {background: url('../images/nav.gif') no-repeat -1000px 0px;}
#nav_2 a:hover, #nav_2.active a {background: url('../images/nav.gif') no-repeat -1124px 0px;}
#nav_3 a:hover, #nav_3.active a {background: url('../images/nav.gif') no-repeat -1248px 0px;}
#nav_4 a:hover, #nav_4.active a {background: url('../images/nav.gif') no-repeat -1372px 0px;}
#nav_5 a:hover, #nav_5.active a {background: url('../images/nav.gif') no-repeat -1496px 0px;}
#nav_6 a:hover, #nav_6.active a {background: url('../images/nav.gif') no-repeat -1620px 0px;}
#nav_7 a:hover, #nav_7.active a {background: url('../images/nav.gif') no-repeat -1744px 0px;}
#nav_8 a:hover, #nav_8.active a {background: url('../images/nav.gif') no-repeat -1868px 0px;}


#footer_nav {
	width:					575px;
	height:					25px;	
}

#footer_nav li {
	display: 				inline;
	width:					122px;
	height:					25px;
	margin-right:		2px;
	float:					left;
}

#footer_nav li a {
	display:				block; 
	width:					122px;
	height:					44px;
	text-indent:		-1000em;
	overflow:				hidden
}

#content_container {
	position:				relative;
	width:					990px;
	height:					449px;
	padding-top:		1px;
}

.colofon {
  font-family:    arial, helvetica, sans-serif;
  font-size:      11px;
  line-height:    13px;
  color:          #000000;
}

#plattegrond #content_container {
	margin-top:			9px;
	height:					440px;	
}

.column_590 {
	width:					545px;
	height:					220px;
	margin:					55px 30px 0 0;
	padding:				30px 15px 30px 30px;
	background:			url('../images/bg_590x280.png') no-repeat;
	float:					left;
}

#home .column_590 {
	width:					586px;
	height:					276px;
	margin:					55px 30px 0 0;
	padding:				2px;
}

#home .column_590 .image{
	width:					586px;
	height:					276px;
	-moz-border-radius:		21px;
	-webkit-border-radius:	21px;
	-opera-border-radius:	21px;
	-khtml-border-radius:	21px;
	border-radius:			21px;
}

.column_590 .scroller_block {	
	height:					220px;
	padding-right:	15px;
}

/* gastenboek */
.column_748 {
	width:				  703px;
	height:				  370px;
	margin:				  9px 0 0 25px;
	padding:			  30px 15px 30px 30px;
	background:		  url('../images/bg_748x430.png') no-repeat;
	float:				  left;
}

.column_748 .scroller_block {	
	height:					370px;
	padding-right:	15px;
}

.column_590x335 {
	width:					545px;
	height:					275px;
	margin:					55px 30px 0 0;
	padding:				30px 15px 30px 30px;
	background:			url('../images/bg_590x335.png') no-repeat;
	float:					left;
}

.column_370 {				
	width:					325px;
	height:					220px;
	margin:					55px 0 0 0;	
	padding:				30px 15px 30px 30px;
	background:				url('../images/bg_370x280.png') no-repeat;
	float:					left;
}

.column_370.img {				
	width:					370px;
	height:					280px;
	margin:					55px 0 0 0;	
	padding:				0;
	background:				url('../images/bg_370x280.png') no-repeat;
	float:					left;
}

.column_370 .scroller_block { 
  height:        	220px;
  padding-right:  10px;
}

.column_370 a {
  text-decoration:  none; 
  /* oranje */
  color:          #f07d00;
  /* paars
  color:          #cc006a;
  */
}
.column_370 a:hover {
  text-decoration: underline; 
  /* oranje */
  color:          #f07d00;
  /* paars
  color:          #cc006a;
  */
}
	
.column_320 {				
	width:					290px;
	height:					305px;
	margin:					55px 10px 0 0;	
	padding:				15px;
	background:				url('../images/bg_320x335.png') no-repeat;
	float:					left;
}

.column_320.right{				
	width:					290px;
	height:					305px;
	margin:					55px 0 0 0;	
	padding:				15px;
	background:			url('../images/bg_320x335.png') no-repeat;
	float:					left;
}

.column_320 .scroller_block {	
	height:					300px;
	padding-right:	15px;
}

.column_120 {
	width:					80px;
	height:					400px;
	margin:					9px 2px 0 0;
	padding:				30px 0 0 40px;
	background:			url('../images/bg_120x430.png') no-repeat;
	float:					left;
}

.column_120 a {
	display:				block;
	font-size:			11px;
	margin-bottom:	11px
}

.programmadata {
	font-size: 11px;
}

.column_120 a:hover,
.column_120 a.active {
	color:					#37aae1;
}

.column_212 {
	width:					182px;
	height:					400px;
	margin:					9px 0 0 5px;
	padding:				15px;
	background:			url('../images/bg_212x430.png') no-repeat;
	float:					left;
}

.column_212 .scroller_block { 
  height:         390px;
  padding-right:  15px;
}

.column_212.vr h3 {
  /* oranje */
	color:          #f07d00;
  border-bottom:  2px solid #f07d00;
	/* paars
	color:					#cc006a;
	border-bottom:	2px solid #cc006a;
	*/
	line-height:		30px;
}

.column_212 .event {
	margin-top:			10px;
}

.column_212.vr .event .time {
	font-size:			14px;
  /* oranje */
  color:          #f07d00;
  /* paars
  color:          #cc006a;
  */
}

.column_212.vr .event .genre {
	font-size:			14px;
	float:					right;
  /* oranje */
  color:          #f07d00;
  /* paars
  color:          #cc006a;
  */
}
.column_212.vr .dagtitel {
  margin-top:     10px;
  font-size:      14px;
  /* oranje */
  color:          #f07d00;
  /* paars
  color:          #cc006a;
  */
}

.column_212.za h3 {
	color:					#36a9e0;
	border-bottom:	2px solid #36a9e0;
	line-height:		30px;
}

.column_212.za .event .time {
	font-size:			14px;
	color:					#36a9e0;
}

.column_212.za .event .genre {
	font-size:			14px;
	float:					right;
	color:					#36a9e0;
}
.column_212.za .dagtitel {
  margin-top:     10px;
  font-size:      14px;
  color:          #36a9e0;
}

.column_212.zo h3 {
	color:					#88BB11;
	border-bottom:	2px solid #88BB11;
	line-height:		30px;
}

.column_212.zo .event .time {
	font-size:			14px;
	color:					#88BB11;
}

.column_212.zo .event .genre {
	font-size:			14px;
	float:					right;
	color:					#88BB11;
}
.column_212.zo .dagtitel {
  margin-top:     10px;
  font-size:      14px;
  color:          #88BB11;
}

/* 212 colom voor fotoarchief */
.column_212foto {
  width:          182px;
  height:         400px;
  margin:         9px 0 0 5px;
  padding:        15px;
  background:     url('../images/bg_212x430.png') no-repeat;
  float:          left;
}

.column_212foto .scroller_block { 
  height:         390px;
  padding-right:  15px;
}

.column_212foto a {
  text-decoration:  none; 
  /* oranje */
  color:          #f07d00;
  /* paars
  color:          #cc006a;
  */
}
.column_212foto a:hover {
  text-decoration: underline; 
  /* oranje */
  color:          #f07d00;
  /* paars
  color:          #cc006a;
  */
}

.small {
  font-size: 10px;
  padding:   10px;
}

#nav_9 a  {background: url('../images/footer_nav.gif') no-repeat  0px   0px;}
#nav_10 a {background: url('../images/footer_nav.gif') no-repeat -124px 0px;}
/*#nav_11 a {background: url('../images/footer_nav.gif') no-repeat -248px 0px;}*/
#nav_9 a:hover,  #nav_9.active a  {background: url('../images/footer_nav.gif') no-repeat -372px 0px;}
#nav_10 a:hover, #nav_10.active a {background: url('../images/footer_nav.gif') no-repeat -496px 0px;}
/*#nav_11 a:hover, #nav_11.active a {background: url('../images/footer_nav.gif') no-repeat -620px 0px;}*/

#prog_nav1 a  {background: url('../images/footer_nav.gif') no-repeat  -248px   0px;}
#prog_nav1 a:hover,  prog_nav1.active a  {background: url('../images/footer_nav.gif') no-repeat -620px 0px;}

#footer_nav img {
	float:left;
	margin-right: 2px;
}


/* CARROUSEL */

#carrousel {
	width:					586px;
	height:					276px; 
	overflow:				hidden; 
}

#carrousel_items {
	width:					586px;
	height:					276px; 
	overflow:				hidden; 
}

.carrousel_item {
	position:				absolute;
	width:					586px;
	height:					276px; 
  	overflow:				hidden;
  	opacity:				0.0;
  	z-index:				1;
}

#carrousel .active {
    z-index:				10;
    opacity:				1.0;
}

#carrousel .last-active {
    z-index:				9;
    opacity:				1.0;
}

.carrousel_link {
	position:				absolute;	
	width:					586px;
	height:					69px; 
	margin-top:				214px;
	margin-top:				220px !important;
	text-align:				right;
    z-index:				12;		
}

.carrousel_link h2 {
	height:					38px; 	
	font-size:				18px;
  /* oranje */
  color:          #f07d00;
  /* paars
  color:          #cc006a;
  */
}

.carrousel_link h3 {
	height:					30px; 
	font-size:				16px;
}

.carrousel_link  span {
	padding:				9px 20px 7px 20px;
	background:				url('../images/bg_carrousel_titles.png') no-repeat top left;
	
}

.carrousel_link h2  span {
	-moz-border-radius-bottomright:		20px;
	-webkit-border-bottom-right-radius:	20px;
	-opera-border-bottom-right-radius:	20px;
	-khtml-border-bottom-right-radius:	20px;
	border-bottom-right-radius:			20px;	
}

#carrousel_items:hover .carrousel_link h2 span {
	color:					#88b812;
}



/* ================================ +
            
+  ================================ */


.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	background: #ffffff;
}
.jScrollPaneDrag {
	position: absolute;
	background: #88BB11;
	cursor: pointer;
	overflow: hidden;
}
.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	background: url('../images/arrows.gif') no-repeat 0 0;
	height: 9px;
}
a.jScrollArrowUp:hover {
	/*background-color: #f60;*/
}

a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	background: url('../images/arrows.gif') no-repeat -20px 0;
	height: 9px;
}
a.jScrollArrowDown:hover {
	/*background-color: #f60;*/
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	/*background-color: #f00;*/
}

/* old (coldfusion site) styles for gastenboek */
.reactie {
  margin:  5px 5px 5px 0;
  padding: 5px;
}
.date {
  font-size: 12px;
  color:     #88BB11;
}

.gastmain {
  float: left;
  overflow : auto;
  width: 575px;
  margin: 10px 10px 0 0px;
}

/* old (coldfusion site) styles for gastenboek reactie plaatsen */
.gastformtext {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  width:375px;
  height: 100px;
  padding: 3px;
  opacity: .80;
  filter: alpha(opacity=80);
  border : 1px solid #88BB11;
}

.gastformtext2 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  width:350px;
  height: 25px;
  padding: 3px;
  opacity: .80;
  filter: alpha(opacity=80);
  border : 1px solid #88BB11;
}

.gastformsend {
  opacity: .80;
  filter: alpha(opacity=80);
  background-color : #88BB11;
}

/* old (coldfusion site) styles for reserveringsformulier */
.reserveerform
{
  opacity: .85;
  filter: alpha(opacity=85);
}

.reserveerbutton
{
  opacity: .80;
  filter: alpha(opacity=80);
  background-color : #88BB11;
  font-weight:bold;
}

.reserverpadding {
  padding:5px;
  }
  
.reserveren td {
  font-size : 12px;
	margin: 3px;
}

.reserveerform td {
  font-size : 12px;
  padding: 2px;
}

.reserveertitel {
  font-size : 16px;
  line-height : 13px;
  font-weight: bold;
}

input {
  font-size : 11px;
  border : 1px solid #009900;
  margin-left:10px;
}

.reserveerselect {
  font-size : 11px;
  width:500px;
  border : 1px solid #009900;
  margin-left:10px;
}

.reserveerselect2 {
  font-size : 11px;
  width:150px;
  border : 1px solid #009900;
  margin-left:10px;
}

/* old (coldfusion site) styles for aanmelding nieuwsbrief */
.nieuwsbriefmain {
  overflow : auto;
  width: 575px;
  /*height: 365px;*/
  float: left;
}

#nieuwsbriefintro {
  float: left;
  text-align:left;
  width: 540px;
  padding: 5px;
  /*margin-left:7px;*/
  opacity: .80;
  filter: alpha(opacity=80);
}

.nieuwsbriefexplain {
  text-align:left;
  float: left;
  width: 120px;
  padding: 5px;
  line-height : 13px;
  opacity: .80;
  filter: alpha(opacity=80);
}

.nieuwsbriefsend
{
  font-size: 14px;
  font-weight: bold;
	width:100px;
  opacity: .80;
  filter: alpha(opacity=80);
  background-color: #88BB11;
  border : 1px solid #009900;
}

/* algemene styles voor forms (gastenboek, reserveren, nieuwsbrief) */
#form {
  float: left;
}
#form td {
	float:left;
	margin: 0 5px 5px 0;
}

#form td.sendButton {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: bold;
	text-align: center;
  width:150px;
  opacity: .80;
  filter: alpha(opacity=80);
  background-color: #88BB11;
  border : 1px solid #009900;
}

.sponsorlogo {
	/*padding-top: 1px;*/
}
#sponsorlogos {
	width: 300px;
  margin: 5px 0 25px 0;
}


/* #### LIGHTBOX STYLES #### */
#overlay_bg_container {
  display:      none;
  position:     fixed;
  top:          0;
  left:         0;
  width:        100%;
  height:       100%;
  z-index:      2000;
 }
#overlay_bg {
  width:        100%;
  height:       100%;
  top:          0;
  left:         0;
  background-color: #552222;
  z-index:      2001;
  filter:       alpha(opacity=90);
  opacity:      0.30;
  }
#overlay_programma{
  position:     fixed;
  top:          150px;
  z-index:      2020;
  display:      none;
  }
.lightbox_detail {
  width:        590px;
  height:       280px;
  background:   url('../images/bg_590x280.png') no-repeat;
  padding:      15px;
}
.lightbox_detail .scroller_block { 
  height:         220px;
  padding-right:  15px;
}
.close_lightbox {
  display:      block;
/*
  position:     absolute;
  width:        17px;
  height:       17px;
  right:        50px;
  top:          10px;
  z-index:      2221;
*/  
  }
/* #### END LIGHTBOX STYLES #### */