/*--------------------------------------------------------------------------
	FONTS - web fonts
---------------------------------------------------------------------------*/
@font-face
{
	font-family: RockwellWeb;
	src: url('../Fonts/Rockwell-Regular.eot');
	src: local('Rockwell'), url('../Fonts/Rockwell-Regular.ttf') format('truetype'); 
}
@font-face
{
	font-family: RockwellWeb;
	font-weight: bold;
	src: url('../Fonts/Rockwell-Bold.eot');
	src: local('Rockwell Bold'), url('../Fonts/Rockwell-Bold.ttf') format('truetype'); 
}

/*--------------------------------------------------------------------------
	RESET - resets margin and padding of elements
---------------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	/* background: transparent; */
}

/*--------------------------------------------------------------------------
	LAYOUT / Base page Styling
---------------------------------------------------------------------------*/

body {
	color: #bbb;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 75%;
	background: url("../../Graphics/contentBG.jpg");
}

h1, h2, h3, h4, .month { font-family: Rockwell, RockwellWeb, Arial Black, serif; }

a, p, h3, h4 { line-height: 16px;}
h1, h2, h3 {	text-transform: uppercase; }
h1, h2 { font-weight: bold;	line-height: 0; }
h1 { font-size: 300%;	line-height: 36px; }
h1.heading1 { margin-top: 7px; }
h2 { font-size: 250%;	}
h3 { font-size: 160%;	font-weight: normal;	}
h4 { font-size: 133% }
h4:hover { color: red; }
strong, h5 { color: white; }
h6.month { font-size: 900%; }
p, ul, ol { margin-bottom: 16px; }

.TAright { text-align: right; }

.newsDateColor { color: #ffed00; }
.eventNameColor { color: #11c6d6; }
.lightYellow { color: #ffea63; }
.chrisClark { color: #7ee8b8; }

.noBottomMargin { margin-bottom: 0 !important; }
.noRightMargin { margin-right: 0 !important; }


		/*--------------------------------------------------------------------------
			MONTHS & COLORS
		---------------------------------------------------------------------------*/		
		.january { color: #69085a; } /* purple */
		.february { color: #e3004f; } /* awesome pink */
		.march { color: #ffed00; } /* submarine */
		.april { color: #7ee8b8; } /* light&gay green */
		.may { color: #11c6d6; } /* cyan */
		.june { color: #59493f; } /* brown*/
		
		.july { color: #69085a; }
		.august { color: #e3004f; }
		.september { color: #ffed00; }
		.october { color: #7ee8b8; }
		.november { color: #11c6d6; }
		.december { color: #59493f; }

		.bloodRed { color: #e63333; }
		/*--------------------------------------------------------------------------
			LINKS
		---------------------------------------------------------------------------*/
			.sliderText a, #newsPanel a, .event a , #businessConditions a, ul.UPnavigation a, #businessConditions ul.BCnavigation a , #news a,
			#registration a {
				color: white;
				font-weight: bold;
				text-decoration: underline;
			}
			.sliderText a:hover, #newsPanel a:hover, .event a:hover, #businessConditions a:hover, ul.UPnavigation a:hover, #businessConditions ul.BCnavigation a:hover, #news a:hover,
			#registration a:hover  {
				text-decoration: none;
			}
			.event a { color: #7ee8b8; }
			
			#login a , #eventLinks a, #eventMp3 a, #boughtTickets .in table a, #ticketReservation .in a, .footerNavigation a { color: #bbb; text-decoration: none; }
			#login a:hover, #eventLinks a:hover, #eventMp3 a:hover, #boughtTickets .in table a:hover, #ticketReservation .in a:hover, .footerNavigation a:hover { text-decoration: underline; } 
			#boughtTickets .in table a:hover, #ticketReservation .in a:hover { color: #1c171d; }
			

	
			
ul { list-style-type: none; }
li { display: inline; }

	.cleaner {
      clear:both;
      height:1px;
      margin: -1px 0 0 0; padding:0;
      border:none;
      visibility: hidden;

   }


#login, #navigation, #header, #content { margin: 0px 0px 0px 40px; width: 960px;}

#loginWrap, #navigationWrap, #headerWrap, #contentWrap { width: 100%;}

/*--------------------------------------------------------------------------
	LOGIN
---------------------------------------------------------------------------*/

#loginWrap { background: black; }
	#login { height: 30px; line-height: 30px; } /* line-height: zajistuje vertikalni centrovani jednoradkoveho textu */		
		
		#login ul { float: right; }
		.rollover { float: right; position: relative;	}
		.rollover, .rollover a { height: 30px; width: 100px; }
				.rollover a  {
					background: url("../../Graphics/Navigation/login.jpg") no-repeat 0 0;
					display: block;
					position: absolute;
					text-indent: -900%;
				}	
				.rollover a:hover, .rollover a.active { background-position: left bottom; }						
				
				#login .shoppingCart { color: white; font-weight: bold; }
				
				
	/*--------------------------------------------------------------------------
		LOGINFORM
	---------------------------------------------------------------------------*/
	#loginForm {
		background: black;
		color: white;
		display: none;
		height: 165px;
		left: 750px;
		line-height: 17px;
		position: absolute;
		padding: 10px 10px 0px 10px;
		width: 230px;
		top: 30px;
		z-index: 4; /* nejvyssi z protoze vyjizdi loginForm ktery musi prekryt vse pod nim*/
	}
	#loginForm p { margin-bottom: 8px;}
	
		#loginForm a { color: white; padding: 0px 10px; text-decoration: underline; }
		#loginForm a:hover { text-decoration: none; }		
		#loginForm label { float: left; font-weight: bold; width: 40px; }
		#loginForm input { width: 180px; }
		#loginForm .loginFormButton { width: 100px; margin: 0; margin-left: 130px;}
		
		#loginForm #closeLogin { float: right; font-weight: normal; color: #bbb; padding: 5px 10px; text-decoration: none; }
		#loginForm #closeLogin:hover { text-decoration: line-through; }
	
/*--------------------------------------------------------------------------
	NAVIGATION
---------------------------------------------------------------------------*/
#navigationWrap { background: url("../../Graphics/Navigation/navigation-bg.jpg"); position: relative; z-index: 3;}

	#navigation { height: 120px; position: relative; z-index: 1;}

		#navigation ul {	float: right; height: 105px; position: relative; width: 665px;	}		
				#navigation a {
					border-bottom: 1px dotted white;
					display: block;
					padding-bottom: 1px; /* odsazeni borderu o 1px aby se pri hoveru po vynulovani odsazeni 3pxborder centroval*/
					position: absolute;
					text-indent: -900%;
				}				
				#navigation a:hover, #navigation a.active {
					background-position: left bottom;
					border-bottom: 3px solid #ffed00;
					padding-bottom: 0px;
				}		
				#navigation a.active { background-position: 0 -105px; }
				#navigation .mainPage, #navigation .partners, #navigation .FAQ, #navigation .businessConditions, #navigation .contact{
					height: 105px;
				}				
				#navigation .mainPage {
					background: url("../../Graphics/Navigation/mainPage.jpg") no-repeat 0 0;
					width: 185px;
				}				
				#navigation .partners{
					background: url("../../Graphics/Navigation/partners.jpg") no-repeat 0 0;
					width: 102px;
					left: 185px;
				}				
				#navigation .FAQ{
					background: url("../../Graphics/Navigation/FAQ.jpg") no-repeat 0 0;
					left: 287px;
					width: 51px;
				}				
				#navigation .businessConditions{
					background: url("../../Graphics/Navigation/businessConditions.jpg") no-repeat 0 0;
					left: 338px;
					width: 169px;
				}				
				#navigation .contact{
					background: url("../../Graphics/Navigation/contact.jpg") no-repeat 0 0;
					left: 507px;
					width: 158px;
				}
				
		/*--------------------------------------------------------------------------
			LOGO
		---------------------------------------------------------------------------*/
		#navigation img {
			position: absolute; /* vyrazeni z normalniho toku dokumentu */
			left: -40px;
		}

/*--------------------------------------------------------------------------
	HEADER
---------------------------------------------------------------------------*/
#headerWrap { background: url("../../Graphics/Header/pattern-BG.jpg"); }
	#header { height: 310px; padding: 20px 0px;}
	
		/*--------------------------------------------------------------------------
			SLIDER PANEL
		---------------------------------------------------------------------------*/
		#sliderPanel, #newsPanel { float: left; height: 310px;	}
		#sliderPanel { background: #2a212c;	width: 660px; }
		
						.sliderText, #sliderPhoto { float: left; }
						.sliderText { margin: 36px 0px 0px 20px; width: 210px;	}
						.sliderText h2 { line-height: 100%; margin-bottom: 5px; }
						
						#sliderPhoto {
							background: url("../../Graphics/Header/sliderPhotoBG.jpg");				
							height: 285px;
							margin: 20px 0px 0px 15px;
							width: 400px;				
						}			
							#sliderPhoto img { border: 1px solid #b8b2b9;	margin: 17px 0px 0px 16px;	}

		/*--------------------------------------------------------------------------
			SLIDER PANEL > SLIDESHOW
		---------------------------------------------------------------------------*/ 
				#sliderPanel ul { height: 1%; /* IE fix */ }  
				#sliderPanel ul:after {  
					content: ".";  
					clear: both;  
					display: block;  
					height: 0;  
					visibility: hidden;
				}              
		
			#sliderPanel .slides { overflow: hidden; width: 660px;	}  			
				#sliderPanel .slides ul { width: 1980px; }  /* total width of all slides - 660px/slide * number of slides (3) */
					#sliderPanel .slides li { float: left; }		
				
			/* Values lower than 1.2 (which is usually the default) behave as if line-height: 1.2 was set. */
			/* for equal line-height in supported browsers by cufon
			#sliderPanel h2 { line-height: 1.2; } 
			*/
			
		/*--------------------------------------------------------------------------
			NEWS PANEL
		---------------------------------------------------------------------------*/
		#newsPanel {
			margin: 0px 0px 0px 10px;
			width: 290px;			
		}				
		
			#newsPanel h2 { line-height: 0px; margin-bottom: 12px; } /* zaporny margin kvuli pevne vysce canvasu u cufonu -> moc velke odsazeni*/ 
			#newsPanel h2 a { color: #2a212c; line-height: 22px; text-decoration: none;}
			#newsPanel h2 a:hover { text-decoration: underline; }
			#newsPanel h4 a { color: #ffed00; text-decoration: none; }
			#newsPanel h4 a:hover { color: #e3004f; }
			
			.news { background: #2a212c;	margin: 10px 0px 0px 0px; }
			.news { height: 65px;	padding: 0px 10px; width: 270px;}
				.news h4  { padding-top: 9px; }
					#newsPanel h4 canvas { top: 0px !important; }

/*--------------------------------------------------------------------------
	CONTENT
---------------------------------------------------------------------------*/
#contentWrap { position: relative; } 
	.BGlines, .BGdots {
		background: url("../../Graphics/BGlines.png") no-repeat 0 0;		
		left: 0px;
		position: absolute;		
		width: 100%;
		height: 100%;
		z-index: 1;		
	}
	.BGdots { background: url("../../Graphics/Header/pattern-BG.jpg"); height: 350px; }
	
	#content { min-height: 380px; position: relative; z-index: 2; padding: 20px 0px 0px 0px; }	
		
		/*--------------------------------------------------------------------------
			MAIN PAGE
		---------------------------------------------------------------------------*/
		#heading { 
			background: #1c171d;
			height: 40px;
			margin: -7px 0px 13px 0px;
			padding: 10px 0px 0px 10px;
			width: 950px;
		}
			#heading canvas { top: 0px !important; } /* upravuje spravne odsazeni pri pouziti Cufonu*/		
			#heading h1 { color: #ffed00; line-height: 100%; padding: 0; }	
		
		/*--------------------------------------------------------------------------
			MAIN PAGE > LIST OF EVENTS
		---------------------------------------------------------------------------*/
		.eventWrap {
			background: #1c171d;
			float: left;
			height: 320px;
			margin: 0px 13px 13px 0px;
			padding: 10px;
			width: 210px;
			word-wrap: break-word; /* zalamovani dlouhych radku bez mezer*/
		}
			.eventWrap h3 { color: #11c6d6; margin: 12px 0px 5px 0px; }
			.eventWrap img { height: 190px; width: 210px; line-height: 0; display: block; }			
				.eventWrap p strong { text-transform: uppercase; }
		
		/*--------------------------------------------------------------------------
			EVENT DETAIL
		---------------------------------------------------------------------------*/
		.leftColumn, .rightColumn { float: left; }
		.leftColumn { margin-right: 10px; width: 420px; }
		.rightColumn { width: 530px; }	
		
			.refactoring { 
				background: #1c171d;	
				margin-bottom: 10px;				
				padding: 20px; 
				word-wrap: break-word; /* zalamovani dlouhych radku bez mezer*/
			}
			
			/*--------------------------------------------------------------------------
				EVENT INFO
			---------------------------------------------------------------------------*/
					#eventInfo { white-space: pre-wrap; }
					#eventInfo p strong { text-transform: uppercase; }
					/*odsazeni kvuli diakritice u jinych nadpisu; v eventInfo diky pismu nemame hacky/carky ->
					tudiz musi byt odsazeni napevno*/
					#eventInfo h1 { padding-top: 7px;} 
			
			#eventPriceCalendar, #buyingTickets { padding-top: 15px; } /* mensi odsazeni kvuli hackum/carkam */
			#eventMp3, #eventLinks { float: left; height: 130px; width: 220px; }	
			#eventMp3 { margin-right: 10px; }		
			#eventPictures { height: 387px; width: 470px; padding: 20px 30px; position: relative; }			    
				#eventPictures img { display: inline; padding: 0px 0px 10px 0px; }
				#eventPictures #thumbs { margin-right: -25px; }
				#eventPictures .arrow { position: absolute; left: 10px; }
				#eventPictures .right { left: 510px; }
					#eventPictures #thumbs img { margin: 0px 5px 0px 0px; padding: 0; }
					#eventPictures #thumbs div { margin: 0px 5px 0px 0px; padding: 0; }
			
			.leftColumn h2, .rightColumn h2, #eventPriceCalendar img, #buyingTickets img, h1 { padding: 0px 0px 10px 0px; }		
			.refactoring table { border-collapse: collapse; }				 
				.refactoring table thead tr { text-align: center; border: 0; }	
				.refactoring table thead th.eventName { text-align: left;}
				.refactoring table td { text-align: center;}
			
			/*--------------------------------------------------------------------------
				EVENT PRICE CALENDAR
			---------------------------------------------------------------------------*/
			
			#eventPriceCalendar table { width: 380px;}				
					.refactoring td { border-top: 1px dashed #bbb; border-bottom: 1px dashed #bbb; padding: 0px 5px;}
					.refactoring .tableForm td { border: 0;}
					
					#eventPriceCalendar  th, #eventPriceCalendar  td, #buyingTickets td, #buyingTickets th {
						width: 126px;
						height: 2em;
						vertical-align: middle;
					}
		
					#eventPriceCalendar tr:hover { background: #ffea63; color: #1c171d; }
					#eventPriceCalendar thead tr:hover { background: #1c171d; color: #bbb; }
					
				tr.actualPrice { background: #f85757; color: #1c171d; font-weight: bold; }
					tr.actualPrice td { background: #f85757; color: #1c171d; font-weight: bold;}
		
				#buyingTickets table { width: 490px; }		
					.name { width: 170px; }
					.date { width: 90px; }
					.numOfTickets { width: 90px; }		
						#buyingTickets input { width: 60px; }
						#buyingTickets .formButton input { width: 130px;}
		
		/*--------------------------------------------------------------------------
			REGISTRATION
		---------------------------------------------------------------------------*/
		
		
		.refactoring  { background: #1c171d; }
			.minHeight { min-height: 310px; }
			.refactoring img { /*display: block;*/ padding: 0px 0px 20px 0px; }
			.refactoring li img, .refactoring p img { padding: 0; vertical-align: middle; margin-top: -1px; _margin-top: 1px;}
				
				#registration .in form { float: left; color: white; width: 390px; }	
				#registration .in p , .registrationInfo, #registration h5{ width: 400px; }
				#registration .in .registrationInfo, #registration h5 { float: left; padding-left: 10px; }
				#registration .in div.error  { margin-bottom: 16px; }
				.registrationInfo { float: left; }
				.registrationInfo li { display: block; line-height: 17px;}
				.registrationInfo ul { margin-bottom: 16px; font-style: italic;}
				ul.registrationInfo { margin-bottom: 16px; font-style: italic;}
				.registrationInfo span { color: #e63333; font-weight: bold; margin-bottom: 16px; }
				
				
					#registration .in form table { border-right: 1px dashed #bbb; }
					#registration p.error { /*display:none;*/ color: #e63333; font-weight: bold; }					
					#registration .registrationInfo, p.error { border-left: 1px dashed #bbb; }
					p.error { border-color: #e63333 !important; }
					#registration .noBorder { border: none !important;}
					
							#registration th { text-align: right; vertical-align: middle; width: 100px; }						
								#registration input { margin: 5px 10px; padding: 5px 7px; width: 250px; }
							#registration .formButton { text-align: right;}
								#registration .formButton input { padding: 0; width: 150px;}
		
		/*--------------------------------------------------------------------------
			BOUGHT TICKETS
		---------------------------------------------------------------------------*/		
				.refactoring table { width: 920px; margin-bottom: 20px; }
				.refactoring table.basketTableButtons { margin-bottom: 0;}
		.refactoring .tableForm  { float: left; width: 385px; }
		.refactoring .tableForm  tr:hover { background: #1c171d; color: #bbb; width: 385px; }
		
				#ticketReservation table { width: 920px; }				
						.refactoring th, .refactoring td { height: 2em; vertical-align: middle; }
						.refactoring th { color: white; }
						.refactoring table td.eventName { text-align: left; }
		#boughtTickets .info { width: 480px; }
		#boughtTickets .info li { display: block; line-height: 17px; }
		#boughtTickets ul.info { margin-bottom: 16px; font-style: italic;}		
		#boughtTickets ul.info li ul { margin: 16px 0px 0px 16px;}
		#ticketReservation p { margin-right: 170px; width: 380px; }
		#buyingTickets tr:hover  { background: #1c171d; color: #bbb; }
		.refactoring tr:hover { background: #b0d7dd; color: #1c171d; }
		
		.refactoring thead tr:hover, #buyingTickets  .refactoring thead tr:hover { background: #1c171d; color: #bbb; }
		#boughtTickets .eventName, #ticketReservation .eventName { width: 180px; }
		
		.eventDate { width: 90px; }
		.barCodes{ width: 105px; }
		.quantity  { width: 65px !important; }
		
		.executionDateTime, .pricePerUnit  { width: 130px; }
		.checkbox { width: 50px; }
		
		ul.UPnavigation { float: right; width: 200px; margin-top: -2px;}				
		.UPnavigation li { display: block; border-bottom: 1px dashed #bbb; margin: 5px 0px; padding: 0px 10px 5px 10px; }		
		
		/*--------------------------------------------------------------------------
			NEWS
		---------------------------------------------------------------------------*/	
		
		#news p {
			border-top: 1px solid #bbb;
			float: left;
			padding: 8px 0px; 
			width: 460px;
		}
		#news a { padding: 3px; }
		#news a img { padding: 0px; position: relative; top: 10px; }
		
		#news p:hover { color: white; }
		#news .month {
		font-size: 900%;
		display: block;
		float: left;
		width: 130px;
		margin: -27px 10px 0px 0px;
		text-align: right;
		line-height: 108px; /* osetruje rozdily mezi IE a FF v odsazeni cufon*/
		}
		.month {_margin-top: 50px;}
		
		#news .heading1 { border-bottom: 0px;}
		#news h4 { margin-left: 140px; }
		canvas, span { margin: 0; padding: 0;}
		
		/*--------------------------------------------------------------------------
			RESERVATION
		---------------------------------------------------------------------------*/	
		#boughtTickets tr:hover a, #ticketReservation tr:hover a { color: #1c171d; }
		#ticketReservation .formButton { margin-bottom: 15px;}
		
		.basketTableButtons  td { border: 0 !important; width: 150px; }
		.basketTableButtons  tr:hover { background: #1c171d !important;}
		.basketTableButtons .empty { width: 100%; }
		.basketTableButtons  tr td .formButton { width: 150px; margin-bottom: 0 !important;}
		.testB { width: 150px; }
		
		/*--------------------------------------------------------------------------
			PARTNERS
		---------------------------------------------------------------------------*/	
		#partners a img { display: block; padding: 0; margin: 10px 0px 10px 0px;}
		#partners .partnerLogo { float: left; margin: 0px 15px 15px 0px; border-top: 1px dashed #bbb; }
		#partners a { color: #bbb; font-weight: bold; text-decoration: none;}
		#partners a:hover { color: #fff; text-decoration: underline; }
		#partners .in { padding: 0px 0px 0px 30px; }
		
		
		
		/*--------------------------------------------------------------------------
			BUSINESS CONDITIONS / BC
		---------------------------------------------------------------------------*/	
		#businessConditions ul, #businessConditions ol { line-height: 17px; margin: 0px 0px 16px 10px; }	
		#businessConditions li { display: block; }
		#businessConditions ol li { margin-bottom: 5px;  }
		#businessConditions ul.BCnavigation { color: white; float: right; height: 185px; width: 230px; padding-top: 10px; }		
		
		#businessConditions .BCnavigation li { display: block; border-bottom: 1px dashed #bbb; margin: 5px 10px; padding: 0px 10px 5px 10px; }		
		#businessConditions p, #businessConditions ul, #businessConditions ol  { width: 600px; list-style-type: decimal ; }		
		
		.heading1 { display: block; padding-bottom: 15px; }
		.underline { border-bottom: 1px dashed #bbb; }
		.heading2 { margin-top: 10px; }
		
		
		/*--------------------------------------------------------------------------
			CONTACT
		---------------------------------------------------------------------------*/	
		.contact { float: right; width: 350px; margin-right: 130px; }
		.contact ul { margin-left: 0 !important; }
		
	/*--------------------------------------------------------------------------
		FOOTER
	---------------------------------------------------------------------------*/
	#footer { margin-left: 60px; padding: 15px 0px; position: relative; width: 920px; z-index: 2; }
				#footer a img { float: right; margin: 0px 0px 15px 5px; }
				#footer .emailImage { vertical-align: middle; }
		
		.footerNavigation { background: #1c171d; height: 40px; line-height: 40px; padding: 0px 10px; margin-bottom: 13px; }
			.footerNavigation a, .footerNavigation p, .footerNavigation strong { color: #bbb; font-style: oblique; }
			.footerNavigation p, .footerNavigation ul { margin-bottom: 0px; }
			.footerNavigation p { float: left; line-height: 40px; } 
			.footerNavigation  ul { float: right; }
		
		.siteGods { font-style: oblique; text-align: center; }
			.siteGods p { float: none; width: 350px; margin: 0 auto; }
				.siteGods a { color: #11c6d6; font-style: normal; font-weight: bold; }
			.niie a {color:#f77c7c;}
                         .rsiie a {color:#111;}

