@charset "utf-8";

/* CSS RESET */
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}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}
body{font:13px/1.5 Arial, Helvetica, sans-serif;}hr{border:0 #ccc solid;border-top-width:1px;clear:both;height:0}h1{font-size:25px}h2{font-size:23px}h3{font-size:21px}h4{font-size:19px}h5{font-size:17px}h6{font-size:15px}ol{list-style:decimal}ul{list-style:square}li{margin-left:30px}p,dl,hr,h1,h2,h3,h4,h5,h6,ol,ul,pre,table,address,fieldset{margin-bottom:20px}

/* GENERAL STUFF */
html, body {margin:0; padding:0; width:100%; height:100%; overflow-y: auto; font-family: "Courier New", Courier, monospace; }
.clear { clear: both }
.hidden { display: none; }
.relative { position: relative; display: block }
.hover { cursor: pointer }
a { color: #1c87cb }
a:hover { color: #000000 }

h1 { font-size: 28px; text-align:right;  margin-bottom: 1px; color: #1c87cb}

.cufonised { text-indent : -9000px; } /* TRYING TO FIX FLASH OF TEXT  */


/* GRID SET UP */
#background{position:fixed; z-index:-1; top: 0px; bottom: 0px; width:100%; height:100%;}

#outer {position: relative; height: 100%; display: table; vertical-align:middle; /* overflow: hidden; */ width:  100%;  }
#inner {position: absolute; top:50%; height: 520px;display:table_cell; width: 100%;  }
#middle { bottom: 50%; position: relative; border: 0px solid #336600;width: 100% }



/* #post_card { width: 960px; height: 606px; background: url(../images/postcard.jpg); color: #ffffff; position: relative; border: 6px solid #ffffff} */
#post_card { width: 810px; height:500px; background: url(../images/paper10x.jpg); border: 1px solid #ffffff; position: relative; margin: 0px auto }
#opentable { margin: 10px auto 0 auto; width: 810px}
#opentable-inner { position: relative; left: -35px; }



#logo { width: 253px; height: 121px; background: url(../images/kanella_logo.png); position: absolute; top: 20px; left: 20px; z-index: 500 }
#logo:hover {cursor: pointer}
#stamps { width: 149px; height: 119px; background: url(../images/stamps.png); position: absolute; top: 10px; right: 20px; }
#copyright { width: 800px; margin: 5px auto 0px auto; font-size: 10px; color:#ffffff }
#copyright a { color: #ffffff }

#address { position: absolute; top: 180px; left: 430px; font-size: 24px; line-height: 24px; text-align: center; color: #1c87cb }
#phone {position: absolute; bottom: 130px; right: 10px; font-size: 34px; }
#tagline { font-size:23px;width: 400px }
.subline {font-size:20px; margin-bottom: 10px }

#collage { position: absolute; top: 190px; left: 20px; width: 420px; height: 300px; display: block }

.border { border: 1px solid #666666 }
.address { margin-bottom: 15px; width: 380px;  }
.hours  { font-size: 16px; width: 400px; line-height: 16px}

#nav { position: absolute; top:132px; left:55px; margin: 0px; z-index: 501  }
#nav_bg {  position: absolute; top:130px; left:0px; width: 810px; height:30px;  opacity: 0.8; background: url(../images/trans_bg.png);}
.nav_item { display: inline-block; float:left; min-width: 120px; font-weight: bold; font-size: 18px; margin: 0px; padding: 0}
.nav_item a:hover, .nav_item.selected a, #menus .selected a { color: #000 }
/*  .nav_item:hover { border-left: 2px solid #009ece} */

#accolades { width: 310px; position: absolute; left: 300px; top: 30px }
#accolades span { color: #666666; font-family:Courier; font-size: 11px; text-align:justify; display: none; }


#content { /*border: 0px solid #CECECE; width: 500px; position: absolute; top: 170px; right: 10px; height: 300px; overflow-y: auto; padding: 10px */ }
#content_copy { color: #000000; font-family: "Courier New", Courier, monospace; text-align: justify; width: 770px; margin: auto; position: absolute; top: 175px; left: 10px; height: 300px; overflow-y: auto; overflow-x: hidden; padding: 10px }

#bio_image {position: absolute; left: 20px; top: 180px; width: 150px	 }
#bio_copy { color: #000000; font-family: "Courier New", Courier, monospace; text-align: justify;border: 0px solid #CECECE; width: 540px; position: absolute; top: 170px; right: 10px; height: 290px; overflow-y: auto; padding: 10px 20px 10px 10px }


#menu_copy { color: #000000; font-family: "Courier New", Courier, monospace; text-align: justify;border: 0px solid #CECECE; width: 550px; position: absolute; top: 170px; right: 10px; height: 290px; overflow-y: auto; padding: 10px 10px 10px 10px }

#menus { position: absolute; top: 20px; left: 10px; width: 200px;  }
.menu_item { font-size: 20px }

/* LISTS */

li { margin-bottom: 10px;  }
li a { text-decoration: none; }
li a:hover { text-decoration: underline }


/* NEWS */
.headline { font-weight: bold}
.news_date { font-size: 11px }
.news_item { margin: 5px 0 15px 0 }



/* EVENTS CALENDAR */

#calendar { position: relative; }

.calendar_event { margin: 2px 0px 2px 0px; text-align:center; font-size: 12px; padding: 4px 2px 4px 2px; font-weight: bold;}
.calendar { margin: 0; padding: 0; font-size: 12px; width: 100%; /* background-color:#FFFFFF;*/ }
.calendar caption { margin: 0; padding: .3em 0; }
.calendar th {border: 1px dotted #1c87cb;font-weight: normal; background: #1c87cb; color: #ffffff; padding: 5px 0px 2px 0px; width: auto; opacity: 0.7 }
.calendar td { border: 1px dotted #1c87cb; padding: .1em .3em ; text-align: center; height: 50px; vertical-align: top; width: 70px;}
.calendar a { color:#1c87cb;}
.calendar td.today { background: #ffc; }
.calendar td.selected { border: 1px dotted #ff7800; }
.calendar td.highlighted {background: #fc9;}


#calendar .menu_item { font-size: 14px; text-align: center; font-weight: bold; }
/*	
.calendar td:hover, .calendar td.today:hover, 
.calendar td.selected:hover, .calendar td.highlighted:hover {
	background: #cff;
	border: 1px solid #09f;
	}
*/
table.calendar td.pad { color: #999;background:#CCCCCC;opacity: 0.5}
.sunday, .saturday { /*background:#DDDABE;*/ }
	#year { padding: 0; width: 500px; list-style: none; }
#year:after {content: ""; display: block; height: 0;clear: both;visibility: hidden;}
#year li { float: left; padding: 0 .5em .5em 0; height: 150px;}

.ticket_info {
	background: #EFEFEF; padding: 8px;
}








/*
 * CSS Styles that are needed by jScrollPane for it to operate correctly.
 *
 * Include this stylesheet in your site or copy and paste the styles below into your stylesheet - jScrollPane
 * may not operate correctly without them.
 */

.jspContainer
{
	overflow: hidden;
	position: relative;
}

.jspPane
{
	position: absolute;
}

.jspVerticalBar
{
	position: absolute;
	top: 0;
	right: 0;
	width: 6px;
	height: 100%;
	background: red;
}

.jspHorizontalBar
{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 16px;
	background: red;
}

.jspVerticalBar *,
.jspHorizontalBar *
{
	margin: 0;
	padding: 0;
}

.jspCap
{
	display: none;
}

.jspHorizontalBar .jspCap
{
	float: left;
}

.jspTrack
{
	background: #dde;
	position: relative;
}

.jspDrag
{
	background:#666;
	position: relative;
	top: 0;
	left: 0;
	cursor: pointer;
}

.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag
{
	float: left;
	height: 100%;
}

.jspArrow
{
	background: #50506d;
	text-indent: -20000px;
	display: block;
	cursor: pointer;
}

.jspArrow.jspDisabled
{
	cursor: default;
	background: #80808d;
}

.jspVerticalBar .jspArrow
{
	height: 16px;
}

.jspHorizontalBar .jspArrow
{
	width: 16px;
	float: left;
	height: 100%;
}

.jspVerticalBar .jspArrow:focus
{
	outline: none;
}

.jspCorner
{
	background: #eeeef4;
	float: left;
	height: 100%;
}

/* Yuk! CSS Hack for IE6 3 pixel bug :( */
* html .jspCorner
{
	margin: 0 -3px 0 0;
}