/* 	
 *	Ohrid Choir Festival: Archive 2013
 *	by Aleksandar Gjoreski
 *
*/

body {
	margin: 0;
	/*background: #c2c2c2 url("../images/backgroundGradient.png") repeat-x top;*/
	font: 13px/1.6em "Lucida Grande", Tahoma, Verdana, Arial, sans-serif;
}
a,
a:active,
a:visited,
a:link {
	color: #000;
	text-decoration: underline;
	outline: none;
}
a:hover {
	color: #f7a600;
	text-decoration: none;
}
#frame1 {
	margin: 0 auto;
	width: 955px;
	background: url("../images/shadowLeft.png") repeat-y left;
}
#frame2 {
	background: url("../images/shadowRight.png") repeat-y right;
}
#wrapper {
	margin: 0 15px;
	width: 925px;
	background: #f5f5f5 url("../images/sidebarBg.png") no-repeat top left;
	background-position: 630px 200px;
}
#header {
	height: 199px;
	background: #000 url("../images/headerBackground.jpg") no-repeat top;
	/*background: #000 url("../images/belowMenu.png") repeat-x bottom;*/
	text-align: center;
}
#headerGraphic {
	float: left;
	margin: -158px 0 0 0px;
}
#headerOcfText {
	margin: 20px 0 45px 660px;
}
#ocfLogo {
	float: right;
	margin: -160px 50px 0 0;
}

/* ============== menu ==============*/
#menu {
	position: relative;
	top: 14px;
	height: 49px;
	background: url("../images/menuBackgound.png") repeat-x top;
}
#menu ul {
	margin: 0;
	padding: 15px 0 0 0;
	list-style-type: none;
	text-align: center;
}
#menu ul li {
	display: inline;
}
#menu ul li a {
	position: relative;
	margin: 0 0 0 -10px;
	padding: 10px 20px 9px 20px;
	text-decoration: none;
	color: #fff;
	font: bold 13px/1.6em "Lucida Grande", Tahoma, Verdana, Arial, sans-serif;
	background: url("../images/menuDivider.png") no-repeat right;
}
#menu ul li#menuListLast a {
	background-image: none;
}
#menu ul li a:hover {
	padding: 10px 20px 8px 20px;
	color: #fff;
	background-color: #5e6373;
	background-image: none;	
}
#menu ul li a:active {
	top: 1px;
	padding: 11px 20px 7px 20px;
	color: #fff;
	background-color: #454956;
	background-image: none;	
}
/* ============== end menu ==============*/

/* ============== content ===============*/
#content {
	float: left;
	width: 656px;
	padding: 0 28px 0 40px;
}
h1 {
	margin: 35px 0 0 0;
	text-align: left;
	padding: 0 0 4px 0;
	text-transform: none;
	color: #000;
	font: bold italic 20px Arial, Helvetica, sans-serif;
	background: url("../images/participantsDivider.png") repeat-x bottom right;
}
.place {
	text-align: left;
	margin: 0;
	padding: 5px 0 0 0;
	color: #000;
	font: bold italic 13px Arial, Helvetica, sans-serif;
}
.importantPeople {
	text-align: right;
	margin: 40px 0 0 0;
	padding: 0;
	color: #000	;
	font: bold italic 12px Arial, Helvetica, sans-serif;
}
.photo {
	float: left;
	position: relative;
	margin: 0 25px 0 0;
	background-color: #fff;
	padding: 6px;
	border: 2px #5e6373 solid;
	-moz-box-shadow:    0px 0px 7px 1px #555;
  	-webkit-box-shadow: 0px 0px 7px 1px #555;
  	box-shadow:         0px 0px 7px 1px #555;
}
a:hover .photo {
	background-color: #eee;
	border: 2px #9e2525 solid;
	-moz-box-shadow:    0px 0px 7px 0px #555;
  	-webkit-box-shadow: 0px 0px 7px 0px #555;
  	box-shadow:         0px 0px 7px 0px #555;
}
a:active .photo {
	top: 1px;
	background-color: #fff;
	border: 2px #cd1e1e solid;
	-moz-box-shadow:    0px 0px 7px 0px #555;
  	-webkit-box-shadow: 0px 0px 7px 0px #555;
  	box-shadow:         0px 0px 7px 0px #555;
}
#photoConductor,
.photoConductor  {
	float: right;
	position: relative;
	top: -10px;
	padding: 4px;
	margin: 0 0 0 15px;
}
a:active #photoConductor,
a:active .photoConductor  {
	top: -9px;
}
.choirDescription {
	padding: 10px 35px 20px 35px;
	text-align: justify;
	font: 13px/1.7em "Lucida Grande", Tahoma, Verdana, Arial, sans-serif;
}

.choirDescription ul {
	text-align: justify;
	font: 13px/1.7em "Lucida Grande", Tahoma, Verdana, Arial, sans-serif;
}

/* ============ end content ============*/

/* ============= concerts ==============*/
h2 {
	margin: 0;
	text-align: left;
	padding: 0 0 4px 0px;
	color: #5e6373;
	font: bold italic 1.15em Arial, Helvetica, sans-serif;
	border-bottom: 1px #5e6373 dotted;
}
.concerts {
	margin: 10px 0 30px 30px;
	padding: 0;
	width: 591px;
	text-align: left;
	font: 13px/1.3em "Lucida Grande", Tahoma, Verdana, Arial, sans-serif;
	color: #000;
}	
.concerts th {
	width: 197px;
	text-align: center;
	padding: 7px;
	border: 1px #ccc solid;
	background-color: #eeeeee;
	-webkit-border-radius: 	5px;
	-moz-border-radius: 	5px;
	border-radius: 			5px;	
}
.concerts td {
	width: 197px;
	padding: 2px 10px;
	border: 1px #ccc solid;
	background-color: #eeeeee;
	-webkit-border-radius: 	5px;
	-moz-border-radius: 	5px;
	border-radius: 			5px;
}
/* =========== end concerts ============*/



/* ============== sidebar ==============*/
#sidebar {
	float: left;
	width: 200px;
}
#sidebarUp {
	height: 44px;
	width: 12px;
	background: url("../images/sidebarShadUp.png") no-repeat left bottom;
}
#sidebarContent {
	background: url("../images/sidebarShadMid.png") repeat-y left center;
}
#sidebarDown {
	height: 44px;
	width: 12px;
	background: url("../images/sidebarShadDown.png") left top;
}
#participantsHeading{
	margin: 0 0 35px 12px;
	text-align: center;
	color: #000;
	font: bold 13px/1.6em Arial, Helvetica, sans-serif;
}
#participants {
	margin: 0 0 0 12px;
	padding: 0 15px 5px 15px;
	list-style-type: none;
	text-align: center;
}
#participantsLast a, 
#participants a:active,
#participants a:visited,
#participants a:link {
	position: relative;
	display: block;
	padding: 0 0 6px 0;
	color: #000;
	font: normal 11px/1.0em "Lucida Grande", Tahoma, Verdana, Arial, sans-serif;
	text-decoration: none;
	/* background: url("../images/participantsDivider.png") no-repeat bottom; */
}
#participants a#participantsLast {
	background-image: none;
}
#participants a:hover {
	background-color: #eaeaea;
	-webkit-border-radius: 	5px;
	-moz-border-radius: 	5px;
	border-radius: 			5px;
}
#participants a:active {
	top: 1px;
}
#participants li{
	margin: 0 0 1px 0;
}
a.selected {
	padding: 2px 0 3px 0 !important;
	margin-bottom: 6px;
	background-color: #eee;
	border: 1px #ccc solid;
	-webkit-border-radius: 	5px;
	-moz-border-radius: 	5px;
	border-radius: 			5px;
}

/* ============== end sidebar ==============*/

#footer{
	clear: both;
}
#author {
	margin: 0;
	padding: 0 200px 0 0;
	text-align: center;
	font-size: 10px;
}
#author a,
#author a:active
#author a:visited,
#author a :link{
	color: #000;
}
#author a:hover {
	color: #5e6373;
	text-decoration: none;
}


/* =========== appendix01: photos ===========*/

.clearer {
	clear: both;
	margin-bottom: 30px;
}
.photosContainer{
	text-align: center;
	margin-bottom: 40px;
}
.galleryPhoto {
	float: none;
	margin: 10px;
	border: 2px #5e6373 solid;
}
a:hover .galleryPhoto {
	border: 2px #9e2525 solid;
}
a:active .galleryPhoto {
	border: 2px #cd1e1e solid;
}
.diploma {
	margin-top: 13px;
	background-color: #fff;
	padding: 8px;
	border: 2px #5e6373 solid;
}
a:hover .diploma {
	background-color: #fff;
	border: 2px #9e2525 solid;
}
a:active .diploma {
	background-color: #fff;
	border: 2px #cd1e1e solid;
}


/* =========== appendix02: videos ===========*/

#divVideo {
    margin: 0;
    padding: 10px 0 50px 0;
    text-align: center;
}
#video {
    margin: 0;
    padding: 0px;
    background-color: #f5f5f5;
    -moz-box-shadow: 0px 0px 15px 1px #000;
    -webkit-box-shadow: 0px 0px 15px 1px #000;
    box-shadow: 0px 0px 15px 1px #000;
}



/* =========== concertTable ===========*/



table.concertTable2014 a:link,
table.concertTable2014 a:visited,
table.concertTable2014 a:active,
table.concertTable2014 a:hover {
	color: #000;
	text-decoration:none;
}
table.concertTable2014 {
	font-family: Arial, Helvetica, sans-serif;
	color: #000;
	font-size: 12px;
	text-shadow: 1px 1px 0px #fff;
	background: #eaebec;
	margin: 10px 0px 30px 35px;
	border: #ccc 1px solid;
	
	width: 585px;
	line-height: 1.2em;

	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;

	-moz-box-shadow: 0 1px 2px #d1d1d1;
	-webkit-box-shadow: 0 1px 2px #d1d1d1;
	box-shadow: 0 1px 2px #d1d1d1;
}
table.concertTable2014 th {
	text-align: center;

	padding:5px 25px 6px 25px;
	border-top:1px solid #fafafa;
	border-bottom:1px solid #e0e0e0;

	background: #ededed;
	background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#ebebeb));
	background: -moz-linear-gradient(top,  #ededed,  #ebebeb);
	background: linear-gradient(to bottom, #ededed 0%,#ebebeb 100%);

}
table.concertTable2014 th:first-child {
	text-align: center;
	padding-left:20px;
}
table.concertTable2014 tr:first-child th:first-child {
	-moz-border-radius-topleft:3px;
	-webkit-border-top-left-radius:3px;
	border-top-left-radius:3px;
}
table.concertTable2014 tr:first-child th:last-child {
	-moz-border-radius-topright:3px;
	-webkit-border-top-right-radius:3px;
	border-top-right-radius:3px;
}
table.concertTable2014 tr {
	text-align: left;
	padding-left:10px;
}
table.concertTable2014 td:first-child {
	text-align: left;
	padding-left:10px;
	border-left: 0;
}
table.concertTable2014 td {
	width: 200px;
	padding:5px 10px;
	border-top: 1px solid #ffffff;
	border-bottom:1px solid #e0e0e0;

	background: #f6f6f6;
	background: -webkit-gradient(linear, left top, left bottom, from(#f8f8f8), to(#f6f6f6));
	background: -moz-linear-gradient(top,  #f8f8f8,  #f6f6f6);
	background: linear-gradient(to bottom, #f8f8f8 0%,#f6f6f6 100%);
}
table.concertTable2014 tr:last-child td {
	border-bottom:0;
}
table.concertTable2014 tr:last-child td:first-child {
	-moz-border-radius-bottomleft:3px;
	-webkit-border-bottom-left-radius:3px;
	border-bottom-left-radius:3px;
}
table.concertTable2014 tr:last-child td:last-child {
	-moz-border-radius-bottomright:3px;
	-webkit-border-bottom-right-radius:3px;
	border-bottom-right-radius:3px;
}
table.concertTable2014 tr.clickableRow:hover td {
	background: #faefef; /* gray f2f2f2 to f0f0f0  */
	background: -webkit-gradient(linear, left top, left bottom, from(#faefef), to(#f6ebeb));
	background: -moz-linear-gradient(top,  #faefef,  #f6ebeb);	
	background: linear-gradient(to bottom, #faefef 0%,#f6ebeb 100%);
}

/* ========= */

table.concertTable2014 tr.hover {
   cursor: pointer;
}


table.concertTable2014 td:nth-child(1) {
  width: 295px;
}
table.concertTable2014 td:nth-child(2){
    width: 145px;
}
table.concertTable2014 td:nth-child(3) {
	width: 145px;
}