/** Color Schema: This is a kind of light on dark Schema, when the light colors are warm colors that has association of natural lights:
	1. Real black for an empty background or for some of the non empty backgrouns
	2. Dark gray for non empty backgrounds
	3. Whites - from real white to warm white for texts
	4. Hues of Orange for links and some of the navigation option backgrounds when hovering or choosinig
    5. Light Orange -  to indicate error in form fields or a mandatory fields indication 
	6. Very fiew exceptions like a category background for categorized navigation bar
  
    Colors that are used:      	
*/
	/*********************************************** HTML elements**********************************/
BODY {
	background-color: black;
	background-image: url(images/banners/Spin.gif);
	background-repeat:no-repeat;
	background-position: center;
	margin-top: 0px;
	height: 800px;
	color: rgb(190,174,153);
}

BODY, select {
	font-family: Arial Unicode MS, Arial, sans-serif;
	font-size: 15px;
}

A,A:VISITED {
	color: rgb(120, 84, 60);
	text-decoration: none;
	font-weight: bold;
}

.FakeHyperlink {
	border-bottom: solid .2em white;
}

A:HOVER,.FakeHyperlink:HOVER {
	color: rgb(180, 120, 60);
	cursor: pointer;
}

h1,h2,h3 {
	margin-top: 0px;
	color: rgb(70, 70, 70);
}

p {
	margin-top: 0px;
	margin-bottom: .5em;
}

ul {
	margin: 0px;
}

li {
	list-style-image: url(images/liBullet.png);
}

table {
	border-spacing: 0px;
}

td {
	padding: 0px;
}

/************************************** GWT predefined GUI objects ******************************/
.gwt-Button {
	background-image: none;
}

.gwt-ListBox {
	margin: 3px 10px;
}

.gwt-DisclosurePanel .header {
}

.gwt-DisclosurePanel .header:HOVER {
	border-bottom: none;
	/* Since the header is a link disable bottom border */
}

.gwt-DisclosurePanel .header img {
	margin-top: 2px;
	margin-left: 5px;
	/*margin-left: -220px;*/
}

/**************************** Application specific objects **************************************/

.NavigatorCompatible {
	margin-top: -200px;
	background-color: black;
	width: 400px;
	padding: 10px;
	border: solid 1px rgb(100,100,100);
}

.NavigatorCompatible .gwt-HTML{
	margin-bottom: 20px;
}

.NavigatorCompatible .gwt-Hyperlink {
	margin-top: 20px;
	margin-left: 20px;
} 

.NavigatorCompatible A {
	line-height: 2em;
	padding: 10px;
	color: rgb(180,159,127) !important;
	background-color: rgb(100,70,50);
}

.NavigatorCompatible A:HOVER {
	color: white !important;
	background-color: rgb(180,120,60);
}

.RootPanel {
	width: 850px;
	margin-left: auto;
	margin-right: auto;
}

/* To make all column height equal (according to http://www.chilipepperdesign.com/2009/05/03/css-equal-height-columns-with-bottom-border-and-margin) */
/* Doesn't work roperly in explorer for all cases - TODO investigate more
.Column1, .Column2, .Column3 {
	padding-bottom: 32767px !important;
	margin-bottom: -32767px !important;
}

.RootPanel {
	overflow: hidden;
}*/
/*  End make all column height equal rules */

.Banner {
	height: 40px;
}

.CursorWait {
	cursor: wait;
}

.Bullet {
	width: 16px;
	height: 16px;
	margin-left: 5px;
}

.ChangeLanguageButton {
	width:57px;
	margin-top: 10px;
	margin-right: 10px;
	padding: 2px 2px 5px 2px;
	font-size: 1em;
	color: rgb(170,150,120);
	background-color: black;
	border-style: none;
	cursor: pointer;
}

.ChangeLanguageButton:HOVER {
	color: white !important;
}

.MuteButton {
	width: 16px;
	height: 16px;
	padding: 5px;
	margin-right: 756px;
	margin-top: 10px;
	cursor: pointer;
}

.ChangeLanguageButton:HOVER , .MuteButton:HOVER {
	background-color: rgb(180,120,60);
}

/* Default for any navigation bar - used here for most of the navigations except the main navigation bar */

div:FOCUS, a:FOCUS {
	outline: none;
}

.Navigation {
	margin-right: 15px;
}

.Navigation .gwt-DisclosurePanel .header {
	color: rgb(170,150,120);
	background-color: rgb(37, 32, 22);
	border: 1px solid rgb(60, 60, 60);
	cursor: pointer;
}

.Nav-Option {
	color: rgb(170, 150, 120);
	background-color: rgb(25, 25, 25);
	border: 1px solid rgb(60, 60, 60);
	cursor: pointer;
}

.Nav-Option.Hover, .Nav-Option.Chosen {
	color: rgb(60, 50, 35);
	background-color: rgb(240, 180, 130);
}

/************************************ Any page main content ****************************/
.PageMainContent {
	min-height: 590px;
	margin-right: 10px;
	padding: 15px;
	background-color: rgb(25,25,25);
}

/***************************************** Footer **************************************/
.Footer {
	width: 100%;
	font-size: 0.8em;
	margin-top: 13px;
	padding-top: 7px;
	border-top: solid 1px rgb(60,60,60);
}

.Footer, .Footer A, .Footer A:VISITED {
	color: rgb(100,100,95);
}

.Footer A:HOVER {
	color: rgb(180, 120, 60);
}

.FooterCopyright {
	float: left;
}

.FooterPoweredBy {
	float: right;
}

/***************************************** Main navigation **************************************/
.MainNavigation {
	width: 110px;
	margin-right: 0px;
	border: none;
}

.MainNavigation .Nav-Option {
	font-size: 1.2em;
	color: rgb(140,125,115);
	cursor: pointer;
	padding-bottom: 20px;
	background-color: black;
	border: none;
}

.MainNavigation .FirstOption img {
	height: 190px;
	width: 76px;
}

.MainNavigation .NonFirstOption {
}


.MainNavigation .Nav-Option.Hover,.MainNavigation .Nav-Option.Chosen {
	color: rgb(250,240,200);
}

/******************************************* Home panel ****************************************/

.Home .PageMainContent {
	padding: 0px 15px;
	min-height: 620px;
	background-image: url(images/banners/Background.jpg);
	background-repeat: no-repeat;
}

.Home .PageMainContent .gwt-HTML {
	margin-top: 420px;
	padding: 10px;
	height: 165px;
	background-color: rgb(90,70,50);
	filter: alpha(opacity = 60); /* IE */
	opacity: 0.6; /* non-IE */
	color: white;
}

.Home .critic {
	margin-bottom: 5px;
	font-size: 1.1em;
	font-weight: bold;
}

.Home .signature+.critic {
	margin-top: 10px;
	padding-top: 10px;
	border-top: solid 1px rgb(150,150,150);
}

.Home p.signature {
	margin-bottom: 0px !important;
}

/****************************************** Listening panel ************************************/

.Listen .PageMainContent {
	width: 440px;
}

.Listen .PageMainContent p {
	margin-bottom: 0.5em;
}

.Listen .PageMainContent #Instructions {
	margin-top: 3em;
	color: rgb(180,159,127);
}

.Listen .PageMainContent #PictureDiv { 
	margin: 0px 10px 10px 0px;
	padding: 1px;
	border: 1px solid rgb(100, 100, 100);
	float: left;
}

.Listen .PageMainContent .Slide, .Listen .PageMainContent #PictureDiv #Picture {
	width: 200px !important;
	height: 200px !important;
}

.Listen .PageMainContent #PictureDiv #Picture /* For IE6 */ {
	margin-top: 0px;
	border: none;
}

.Listen .Navigation table tbody tr+tr .gwt-DisclosurePanel {
	margin-top: 17px;
}

.Listen .Nav-Option, .Listen .gwt-DisclosurePanel .header {
	Width: 230px;
	padding: 6px;
	font-weight: bold;
	font-size: 1em;
}

.Listen .Nav-Option {
	text-align: left;
}

.Listen .Nav-Option {
	border-top: none;
}

/*** Player ***/
.Listen .PageMainContent .ExpandedPlayer {
	margin-top: 20px;
}

.Player {
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	cursor: pointer;
}

.MiniPlayer {
	bottom: 10px;
	width: 25px;
	height: 28px;
	/*-webkit-box-shadow: 4px 4px 3px #aaa !important;*/
	width: 28px;
	display: none;
}

.MiniPlayer .AudioControlImage {
	margin: 5px;
}

.AudioPlaying, .AudioPaused {
	background-color: rgb(80,80,80);
	/*-webkit-box-shadow: 8px 8px 5px #999;*/
}

.Player .Title {
	font-size: 1.1em;
	font-weight: bold;
	margin: 8px 15px 0px 15px;
}

.Player .Title .Subtitle {
	font-size: 0.8em;
	line-height: 2em;
}

.Player .Description {
	margin: 8px 15px;
	padding: 10px 0px;
	border-bottom: 1px solid rgb(120,120,120);
	border-top: 1px solid rgb(120,120,120);
	text-align: left;
	font-size: 0.8em;
	min-height: 60px;
}

.AudioControlImage {
	margin: 3px;
}

/* Just for IE6, other browser need only the general .Bullet rule */
.Listen .PageMainContent .AudioControlImage {
	width: 18px;
	height: 18px;
	border: none;
}

.ProgressBar {
	width: 330px;
	height: 10px;
	margin: 5px 3px;
	border: 2px solid white;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	cursor: default;
	background-color: rgb(110,105,100);
}

.ProgressBar>table {
	float: left;
}

.ProgressBar .ProgressPlayed, .ProgressBar .ProgressLoaded {
	height: 10px;
}

.ProgressBar .ProgressPlayed {
	background-color: rgb(240,159,92);
}

.ProgressBar .ProgressLoaded {
	background-color: rgb(240,205,176);
}

.AudioPaused .ProgressBar .ProgressPlayed {
	background-color: rgb(180,150,120);
}

.TimeProgressLabel {
	margin: 4px 6px 0px 6px;
	font-size: 0.8em;
}

.Player .Title, .Player .Description, .TimeProgressLabel {
	color: white;
}

.Player.AudioPaused .Title, .Player.AudioPaused .Description, .AudioPaused .TimeProgressLabel {
	color: rgb(140,130,120);
}

/****************************************** Video panel ******************************************/
.View .PageMainContent {
	width: 440px;
}

.View .Nav-Option {
	Width: 230px;
	padding: 6px;
	font-weight: bold;
	font-size: 1em;
	text-align: left;
}

.View .Navigation table tbody tr+tr .Nav-Option {
	margin-top: 15px;
}

.View .Title {
	font-size: 1.1em;
	font-weight: bold;
	height: 15px;
	text-align: left;
}

.View .Description {
	height: 200px;
}

/*** flow player container ***/
div.FlowPlayer {
	height: 323px;
	width: 430px;
	padding-top: 5px;
	padding-left: 5px;
	padding-right: 5px;
	background-color: rgb(80,80,80);
	margin: 10px 0px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}

/* play button */
div.FlowPlayer img {
	margin-top: 67px;
	opacity: 0.7;
	filter: alpha(opacity = 70); /* IE */
}

div.FlowPlayer img:HOVER {
	opacity: 1;
	filter: alpha(opacity = 100); /* IE */
}

/****************************************** Concerts panel ******************************************/
.Concerts .PageMainContent {
	Width: 470px;
	background-image: url();
}

.Concerts .PageMainContent #Picture {
	float: left;
	margin: 40px 0px 0px 0px;
	/* For IE6 */
	width: 230px;
	height: 440px;
	border: none;
}

.Concerts .Nav-Option {
	padding: 5px;
	margin-bottom: 15px;
	width: 202px;
}

.Concerts .Nav-Option .gwt-Label {
	font-weight: bold;
	font-size: 1.1em;
}

.Concerts .ComingConcert {
	width: 202px;
	font-weight: bold;
	background-color: rgb(25, 25, 25);
	border-top: 1px solid rgb(60, 60, 60);
	border-right: 1px solid rgb(60, 60, 60);
	border-left: 1px solid rgb(60, 60, 60);
	padding: 5px;
	color: rgb(247,178,110);
	text-align: center;
}

.Concerts .Nav-Option .Date {
	margin-top: 5px; 
	font-size: 1em;
	font-weight: normal;
}

.Concerts .Title {
	margin: 0px 15px 10px 0px; 
	font-size : 1.4em;
	color: rgb(180,159,127);
}

/* Just for IE6, other browser need only the general .Bullet rule */
.Concerts .PageMainContent .Bullet {
	width: 16px;
	height: 16px;
	border: none;
}

.Concerts .PageMainContent .Title {
	Width: 255px;
	margin: 0px 0px 7px 0px;
	font-weight: bold;
	font-size: 1.8em;
}

.Concerts .PageMainContent .Image {
	width: 150px;
	height: 150px;
	padding: 1px;
	margin-right: 60px;
	border: 1px solid rgb(100, 100, 100);
}

.Concerts .Title2, .Concerts .Title3, .Concerts .ShortDescription {
	color: rgb(180,159,127);
	font-weight: bold;
}

.Concerts .Title2 {
	display: none;
	font-size: 1.1em;
	margin-bottom: 10px;
}

.Concerts .Title3 {
	margin-bottom: 5px;
}

.Concerts .Title4 {
	color: rgb(130,110,84);
	font-weight: bold;
	font-size: 1.2em;
	margin-bottom: 8px;
}

.Concerts .ShortDescription {
	margin-top: 5px;
}

.Concerts .Description {
	margin: 10px 20px;
	padding: 10px 0px; 
	border-bottom: 1px solid rgb(60, 60, 60);
	border-top: 1px solid rgb(60, 60, 60);
}

.Concerts .Bullet.Separator {
	width: 8px;
	height: auto;
	margin: 6px 5px 0px 5px;
}

.Concerts .gwt-ToggleButton {
	margin: 3px 30px 0px 0px;
	color: rgb(120,84,60);
	font-weight: bold;
	cursor: pointer;
}

.Concerts .gwt-ToggleButton:HOVER {
	color: rgb(180,120,60);
}

/* Hall information */
.HallPanel {
}

.HallPanel .gwt-Label {
	margin-bottom: 5px;
}

.HallPanel .Title4 {
	color: rgb(140,128,105);
	font-size: 1em;
	margin-bottom: 5px;
	margin-left: 7px;
}

.Concerts .gwt-DisclosurePanel {
	margin: -4px 15px 15px 0px;
}

.Concerts .gwt-DisclosurePanel .content {
	width: 420px;
	background-color: rgb(40, 40, 40);
	border: solid 1px rgb(70, 70, 70);
	-moz-border-radius-bottomleft: 20px;
	-webkit-border-radius-bottomleft: 20px;
	padding: 8px;
	margin-bottom: 20px;
	margin-top: 5px;
	color: rgb(210,194,162);
}

.HallPanel .content A {
	color: rgb(140, 98, 70);
}

.HallPanel .content A:HOVER {
	color: rgb(200, 133, 67);
}
/*************************************** About panel *******************************************/
.About.PageMainContent {
	width: 670px;
	min-height: 600px;
	padding: 15px 30px 5px 30px !important;
}

.AboutContentRight, .AboutContentLeft {
	Width: 320px;
	margin-bottom: 10px;
}

.AboutContentRight {
	float: right;
	margin-left: 10px;
}

.AboutContentLeft {
	float: left;
}

.About.PageMainContent img {
	margin-top: 10px;
	width: 666px;
	height: auto;
	padding: 1px;
	border: 1px solid rgb(100, 100, 100);
}

#AboutImage1 {
	margin-top: 30px;
}

#AboutImage2 {
	margin-top: 18px;
}


/**************************************** Members panel ***************************************/
.Members .PageMainContent {
	Width: 343px;
}

.Members .PageMainContent .MemberName,.Members .PageMainContent .MemberRole	{
	font-size: 1.1em;
	margin-bottom: 15px;
}

.Members .PageMainContent .MemberName {
	color: rgb(180,159,127);
}

.Members .PageMainContent .MemberRole {
	margin-right: 15px;
}

.Members .PageMainContent .MiniPlayer {
	position: absolute;
	top: 550px;
}

.Members td {
	padding: 0px;
}

.Members table {
	border-spacing: 0px;
}

.MemberImage {
	padding: 1px;
	width: 100px;
	height: 100px;
	border-bottom: 1px solid rgb(60, 60, 60);
}

.MemberName,.MemberRole {
	font-weight: bold;
	padding: 1px;
}

.MemberRole {
	color: rgb(130,119,98);
}
.Members .Navigation {
	margin-right: 5px;
}

.Members .Nav-Option {
	margin-right: 13px;
}

.Members .Navigation table tbody tr+tr .Nav-Option {
	margin-top: 13px;
}

/* member role hover and chosen color does not change */
.Nav-Option.Hover .MemberRole,.Nav-Option.Chosen .MemberRole {
	color: rgb(130,119,98);
}

/****************************************** Press panel ****************************************/

.Press .PageMainContent, .Press .IPaper {
	width: 488px;
}

.Press .PageMainContent {
	height: 590px;
}

.Press div.FlowPlayer {
	margin-top: 140px;
	width: 480px;
	height: 383px;
}

.Press .IPaper {
	margin-top: 20px;
}

.Press .Title2, .Press .Title3 {
	color: rgb(180,159,127);
}

.Press .Title2 {
	font-weight: bold;
	font-size: 1.1em;
	margin-bottom: 7px;
}

.Press .Title3 {
	font-size: 0.8em;
	margin-bottom: 20px;
}

.Press .Navigation {
	margin-right: 15px;
}

.Press .Navigation table tbody tr+tr .gwt-DisclosurePanel {
	margin-top: 20px;
}

.Press .Nav-Option, .Press .gwt-DisclosurePanel .header {
	Width: 180px;
	padding: 7px;
	font-weight: bold;
	font-size: 1em;
}

.Press .Nav-Option {
	border-top: none;
}

.Press .Nav-Option .Date {
	color: rgb(130,119,98);
	margin-top: 5px; 
	font-weight : normal;
	font-size: 0.8em;
}

/****************************************** Contact Us panel **********************************/

.ContactUs .PageMainContent {
	width: 400px;
}

.ContactUsDetailsPanel {
	height: 590px;
	width: 250px;
	margin-right: 20px;
	padding: 15px;
	background-color: rgb(25,25,25);
}

.ContactUs .PageMainContent .Title, .ContactUsDetailsPanel .gwt-Label.Title {
	margin-bottom: 25px;
	color: rgb(180,159,127);
	font-weight: bold;
	font-size: 1.2em;
}

.mceLayout {
	width: 400px !important;
}

.ContactUsMessage:FOCUS {
	background-color: rgb(225, 215, 150);
}

.ContactUs .PageMainContent input[type="checkbox"], .ContactUs .PageMainContent select {
	margin-top: 15px;
}

.ContactUs .PageMainContent .gwt-CheckBox {
}

.ContactUs .PageMainContent select {
	width: 12em;
}

.ContactUs .PageMainContent .PhoneNo {
	width: 10em !important;
}

.ContactUsDetailsPanel .gwt-Label {
	margin-bottom: 10px;
	font-size: 1.1em;
}

.ContactUsDetailsPanel .gwt-Image {
	width: 246px;
	height: auto;
	padding: 1px;
	margin-top: 140px;
	border: 1px solid rgb(100, 100, 100);
}

/************************************ Any form panel **************************/
	/* General HTML elements */
FORM {
}

INPUT, BODY.mceContentBody, .mceToolbar, .gwt-ListBox {
}

INPUT:FOCUS {
	background-color: rgb(230, 170, 120);
}

/* Application specific */
.FormLabel {
	margin-top: 10px;
	margin-bottom: 3px;
	font-weight: bold;
}

.FormField {
	margin-bottom: 7px;
	width: 18em;
}

.MandatoryField {
	color: rgb(255,120,0);
	width: .7em;
	margin-top:3px;
}

.ErrorField {
	background-color: rgb(216,122,93);
}

.SubmitButton {
	margin-top: 20px;
	margin-right: 320px;
	padding: 6px;
	font-size: 1.1em;
	color: rgb(180,159,127);
	background-color: rgb(100,70,50);
	border-style: none;
	cursor: pointer;
}

.SubmitButton:HOVER {
	color: white;
	background-color: rgb(180,120,60);
}

.SubmitResult {
	height: 20px;
	padding: 5px;
	margin: 8px 0px;
	font-weight: bold;
}

.SubmitResultOK {
	background-color: rgb(90, 90, 60);
}

.SubmitResultError {
	background-color: rgb(160,60,30);
}

/******************************************* Declarations that is used directly from html blocks */
.emphazised {
	color: rgb(180, 159, 127);
	font-size: 1.2em;
	font-weight: bold;
}

.credits {
	line-height: 2em;
	font-size: 0.8em;
	color: rgb(130,130,130);
}

/*** Sound Manager ***/
	/* Prevent horizontal scroll - since sound manager creates this element at position -256px that generates this scroll */
.movieContainer {
	left: 0px !important;
}

/*** Hyper content ***/
.PreviousPage {
	float: right;
	clear: both;
}

.NextPage {
	float: left;
	clear: both;
}