/*	------------------------------------------------------------
	Style Sheet
	eastwesticepalace.com
	by Tom Zepko
   	------------------------------------------------------------ */

/*	---- CSS reset ---- */
* 
	{
	margin:				0;
	padding:			0;
	border:				none;
	}

/*	---- basic html tags ---- */
h1, h2, h3, h4
	{
	font-family:		"Lucida Grande", "Arial", "Helvetica", sans-serif;
	font-weight:		bold;
	line-height:		150%
	}
h1
	{
	margin:				6px 0 0 0;
	font-size:			20px;
	text-align:			left;
	}
h2
	{
	margin:				15px 0 5px 0;
	font-size:			16px;
	text-align:			center;
	}
h3
	{
	margin:				16px 0 5px 0;
	font-size:			14px;
	text-align:			left;
	}
h4
	{
	margin:				8px 10px 5px 15px;
	font-size:			13px;
	text-align:			left;
	}
p
	{
	margin:				5px 0;
	}
hr
	{
	margin:				15px auto 15px auto;
	border:				1px solid #555;
	clear:				both;
	}
ul, ol
	{
	margin:				8px 20px 5px 15px;
	}
li
	{
	margin:				2px 20px 2px 45px;
	}
li.level2
	{
	margin:				2px 20px 2px 65px;
	}
img
	{
	font-family:		"Arial", "Helvetica", sans-serif;
	font-size:			9px;
	border:				none;
	}
table
	{
	border-spacing:		0;
	border-collapse:	collapse;
	}

/*	---- body ---- */
body
	{
	font-family:		"Times New Roman", "Times", serif;
	color:				black;
	font-size:			13px;
	background: 		#ccc url(graphics/background.png) repeat-y;
	-webkit-text-size-adjust:	none;
	}

/*	---- links ---- */
a
	{
	padding:			0 2px 2px 2px;
	}

/* link within this site */
a:link
	{
	color:				#22b;
	}
a:visited
	{
	color:				#22b;
	}
a:hover
	{
	color:				#0b0;
	}
a:active
	{
	color:				#0b0;
	background-color:	#ff9;
	}

/* link to another site */
a.web:link
	{
	color:				#b26;
	}
a.web:visited
	{
	color:				#626;
	}
a.web:active
	{
	color:				#090;
	background-color:	#ff9;
	}
a.web:hover
	{
	color:				#f00;
	}

/* email address */
a.email:link
	{
	color:				#c60;
	}
a.email:visited
	{
	color:				#c60;
	}
a.email:active
	{
	color:				#900;
	background-color:	#ff9;
	}
a.email:hover
	{
	color:				#c00;
	}

/* icon link */
a.icon:link
	{
	padding:			0;
	color:				transparent;
	background-color:	transparent;
	}

/*	---- navigation bar ---- */
#navbar div
	{
	width:				150px;
	margin:				8px 0 0 1px;
	padding:			0;
	border:				none;
	}
#navbar hr
	{
	width:				70%;
	margin:				6px auto;
	border-color:		#557;
	}
#navbar p, #navbar a
	{
	display:			block;
	margin:				0;
	padding:			4px 5px 4px 12px;
	font-family:		"Lucida Grande", "Arial", "Helvetica", sans-serif;
	font-size:			12px;
	}
#navbar p		/* current page */
	{
	color:				#ff3;
	border-radius:		5px;
	background-color:	#558;
	background:			-webkit-gradient(linear, 0% 0%, 0% 100%, from(#558), to(#447));
	background:			-webkit-linear-gradient(top, #558, #447);
	background:			-moz-linear-gradient(top, #558, #447);
	background:			-ms-linear-gradient(top, #558, #447);
	background:			-o-linear-gradient(top, #558, #447);
	}
#navbar p.indent1, #navbar a.indent1
	{
	padding-left:		22px;
	font-size:			11px;
	}
#navbar a:link
	{
	color:				white;
	text-decoration:	none;
	}
#navbar a:visited
	{
	color:				white;
	text-decoration:	none;
	}
#navbar a:hover
	{
	color:				#0f3;
	text-decoration:	none;
	}
#navbar a:active
	{
	color:				#0f3;
	text-decoration:	underline;
	background-color:	#336;
	}

/*	---- page content ---- */
div.content
	{
	width:				700px;
	border:				1px solid #558;
	margin:				10px 5px 10px 15px;
	padding:			0px 15px 15px 15px;
	background-color:	white;
	}

/*	---- page sections ---- */
div.header
	{
	margin:				5px 5px 20px 5px;
	padding:			0 0 8px 0;
	border-width:		3px;
	border-style:		none none solid none;
	border-color:		#558;
	}
p.current-path
	{
	margin:				1px 0 4px 0;
	font-family:		"Lucida Grande", "Arial", "Helvetica", sans-serif;
	font-size:			11px;
	}
#home-button
	{
	width:				70px;
	text-align:			left;
	}
#page-loc
	{
	text-align:			left;
	padding-left:		4px
	}
#page-buttons
	{
	width:				80px;
	text-align:			right;
	}
#page-buttons-daily
	{
	width:				160px;
	text-align:			right;
	}
div.main
	{
	margin:				5px;
	border:				none;
	text-align:			left;
	}
div.footer
	{
	margin:				20px 5px 5px 5px;
	border-width:		3px;
	border-style:		solid none none none;
	border-color:		#558;
	padding:			12px 0 6px 0;
	text-align:			right;
	clear:				both;
	}

/*	---- main navigation ---- */
div.main-nav
	{
	width:				600px;
	margin:				15px auto;
	font-family:		"Arial", "Helvetica", sans-serif;
	font-size:			12px;
	font-weight:		bold;
	text-align:			center;
	padding:			10px 0;
	border:				1px solid #558;
	border-radius:		8px;
	background:			#eee;
	background:			-webkit-gradient(linear, 0% 0%, 0% 100%, from(#f8f8f8), to(#ddd));
	background:			-webkit-linear-gradient(top, #f8f8f8, #ddd);
	background:			-moz-linear-gradient(top, #f8f8f8, #ddd);
	background:			-ms-linear-gradient(top, #f8f8f8, #ddd);
	background:			-o-linear-gradient(top, #f8f8f8, #ddd);
	}
h2 + div.main-nav
	{
	margin-top:			5px;
	}
div.main-nav table
	{
	margin:				0 auto;
	}
div.main-nav td
	{
	padding:			5px;
	}
div.main-nav img
	{
	margin:				10px 0 8px;
	}
div.main-nav p
	{
	font-size:			14px;
	margin:				13px 0;
	}
div.main-nav a
	{
	padding:			8px 0;
	}
div.main-nav a:link
	{
	color:				#226;
	text-decoration:	none;
	}
div.main-nav a:visited
	{
	color:				#226;
	text-decoration:	none;
	}
div.main-nav a:hover
	{
	color:				#0b0;
	text-decoration:	none;
	}
div.main-nav a:active
	{
	color:				#0c0;
	background:			none;
	text-decoration:	underline;
	}

/*	---- plain boxes ---- */
div.boxed
	{
	width:				600px;
	margin:				15px auto 10px auto;
	border:				1px solid #555;
	background-color:	#eee;
	}
div.boxed div.boxed		/* inner box */
	{
	width:				425px;
	margin:				10px auto 20px;
	padding:			5px;
	border:				1px solid #555;
	background-color:	white;
	}
p.title
	{
	margin:				0 0 6px 0;
	padding:			6px;
	font-family:		"Arial", "Helvetica", sans-serif;
	font-weight:		bold;
	text-align:			center;
	}
div.boxed p.title
	{
	margin:				0 0 6px 0;
	color:				white;
	background-color:	#336;
	background:			-webkit-gradient(linear, 0% 0%, 0% 100%, from(#669), to(#336));
	background:			-webkit-linear-gradient(top, #669, #336);
	background:			-moz-linear-gradient(top, #669, #336);
	background:			-ms-linear-gradient(top, #669, #336);
	background:			-o-linear-gradient(top, #669, #336);
	}

/*	---- attention boxes ---- */
div.attention, div.attention-strong
	{
	width:				600px;
	margin:				24px auto;
	padding:			0 0 5px 0;
	border-radius:		8px;
	-webkit-box-shadow:	3px 3px 8px 0 rgba(0,0,0,0.4);
	box-shadow:			3px 3px 8px 0 rgba(0,0,0,0.4);
	}
div.attention
	{
	border:				1px solid #336;
	background-color:	#e2e2e8;
	}
div.attention-strong
	{
	border:				1px solid #a00;
	background-color:	#fee;
	}
div.attention hr
	{
	width:				60%;
	margin:				15px auto;
	border-color:		#336;
	}
div.attention-strong hr
	{
	width:				60%;
	margin:				15px auto;
	border-color:		#b00;
	}
div.attention p.title
	{
	border-radius:		8px 8px 0 0;
	color:				white;
	background-color:	#336;
	background:			-webkit-gradient(linear, 0% 0%, 0% 100%, from(#558), to(#336));
	background:			-webkit-linear-gradient(top, #558, #336);
	background:			-moz-linear-gradient(top, #558, #336);
	background:			-ms-linear-gradient(top, #558, #336);
	background:			-o-linear-gradient(top, #558, #336);
	}
div.attention-strong p.title
	{
	border-radius:		8px 8px 0 0;
	color:				white;
	background-color:	#a00;
	background:			-webkit-gradient(linear, 0% 0%, 0% 100%, from(#d33), to(#a00));
	background:			-webkit-linear-gradient(top, #d33, #a00);
	background:			-moz-linear-gradient(top, #d33, #a00);
	background:			-ms-linear-gradient(top, #d33, #a00);
	background:			-o-linear-gradient(top, #d33, #a00);
	}
p.attention, p.attention-large, p.attention-xlarge
	{
	margin:				10px 20px 10px 20px;
	font-family:		"Arial", "Helvetica", sans-serif;
	font-size:			12px;
	line-height:		150%;
	}
p.attention-large
	{
	font-size:			14px;
	}
p.attention-xlarge
	{
	font-size:			16px;
	}

/*	---- schedules ---- */
table.schedule
	{
	margin:				10px auto;
	border:				1px solid #555;
	font-family:		"Arial", "Helvetica", sans-serif;
	font-size:			15px;
	background:			white;
	border-collapse:	separate;
	border-spacing:		2px;
	}
td.session, td.empty, td.special, td.canceled, td.ice
	{
	font-family:		"Arial", "Helvetica", sans-serif;
	font-size:			13px;
	padding:			5px 10px;
	text-align:			center;
	background-color: 	#dddde8;
	}
td.empty
	{
	color:				#b00;
	background-color: 	white;
	}
td.special
	{
	border:				1px solid #b00;
	background-color:	#ffe8e8;
	}
td.canceled
	{
	border:				1px solid #b00;
	color:				#b00;
	background-color:	white;
	}
td.ice
	{
	font-size:			9px;
	padding:			2px;
	color:				#999;
	background-color: 	white;
	}

/*	---- daily ice schedule ---- */
/* columns */
td.time, td.description, td.duration, td.resurface
	{
	font-family:		"Arial", "Helvetica", sans-serif;
	font-size:			13px;
	padding:			5px 10px;
	}
td.time
	{
	text-align:			center;
	}
td.description
	{
	padding:			4px 8px 4px 8px;
	text-align:			left;
	}
td.duration
	{
	padding:			4px 8px 4px 2px;
	text-align:			right;
	}
td.resurface
	{
	font-size:			9px;
	text-align:			center;
	padding:			3px;
	color:				#999;
	background-color: 	white;
	}
/* background color determined by by session kind */
td.public
	{
	background-color: 	#c0ffc0;
	}
td.private
	{
	background-color: 	#fcd;
	}
td.rental
	{
	background-color: 	#ebf;
	}
td.freestyle
	{
	background-color: 	#ffb;
	}
td.class
	{
	background-color: 	#fd7;
	}
td.hockeyGame
	{
	background-color: 	#abf;
	}
td.hockeyPractice
	{
	background-color: 	#cdf;
	}
td.hockeyStickTime
	{
	background-color: 	#9ff;
	}
td.hockeyPickup
	{
	background-color: 	#9ef;
	}
td.other
	{
	background-color: 	#eee;
	}
td.synchro
	{
	background-color:	#ffa078;
	}
/* schedule app */
div.app-notice
	{
	width:				500px;
	margin:				20px auto 10px;
	border:				1px solid #555;
	padding:			4px;
	background-color:	#f8f8f8;
	}
div.app-notice p
	{
	margin:				6px 10px;
	text-align:			center;
	font-family:		"Arial", "Helvetica", sans-serif;
	font-size:			10px;
	}

/* color overrides in the context of an attention-strong box */
div.attention-strong table.schedule
	{
	border-color:		#b00;
	}
div.attention-strong td.session
	{
	background-color:	#ffe8e8;
	border:				1px solid #b00;
	}
div.attention-strong th.head
	{
	background-color:	#a11;
	}
div.attention-strong th.day-of-week
	{
	background-color:	#c55;
	}

/*	---- other classes ---- */
p.facebook, p.facebook-indent
	{
	margin:				25px 20px 5px 60px;
	font-family:		'Arial', 'Helvetica', sans-serif;
	font-size:			12px;
	}
p.facebook-indent
	{
	margin:				5px 20px 5px 100px;
	}
p.centerphoto
	{
	text-align:			center;
	margin-top:			12px;
	margin-bottom:		5px;
	}
table.bordered
	{
	border:				1px solid #666;
	border-collapse:	separate;
	border-spacing:		2px;
	}
table.center
	{
	margin:				15px auto;
	}
h2+table.center					/* table is adjacent sibling of h2 */
	{
	margin-top:			0;
	}
table.full-width
	{
	width:				100%;
	}
table.thumbnail-grid
	{
	width:				100%;
	border-collapse:	separate;
	border-spacing:		10px;
	margin:				0;
	}
table.photo-grid
	{
	border-collapse:	separate;
	border-spacing:		15px;
	margin:				0 auto;
	}
table.content-grid
	{
	border-collapse:	separate;
	border-spacing:		10px;
	margin:				0;
	}
th.head
	{
	font-family:		"Arial", "Helvetica", sans-serif;
	font-size:			13px;
	line-height:		140%;
	padding:			4px 8px 4px 8px;
	text-align:			center;
	color:				white;
	background-color: 	#447;
	}
th.subhead, th.day-of-week
	{
	font-family:		"Arial", "Helvetica", sans-serif;
	font-size:			12px;
	line-height:		140%;
	padding:			3px 8px 3px 8px;
	text-align:			center;
	color:				white;
	background-color: 	#668;
	}
th.day-of-week
	{
	background-color: 	#668;
	font-size:			13px;
	line-height:		150%;
	padding:			5px 10px 5px 10px;
	}
td.item
	{
	font-family:		"Arial", "Helvetica", sans-serif;
	font-size:			11px;
	background:			#eee;
	padding:			4px;
	}
td.text
	{
	font-family:		"Times New Roman", "Times", serif;
	font-size:			13px;
	padding:			3px 25px 3px 0;
	}
img.icon
	{
	vertical-align:		middle;
	}
img.home-icon
	{
	margin:				8px 0 0 0;
	border:				none;
	}
img.photo
	{
	border:				1px solid #555;
	}
img.screenshot
	{
	margin: 			5px 20px;
	border:				1px solid #bbb;
	-webkit-box-shadow:	3px 3px 6px 0 rgba(0,0,0,0.3);
	box-shadow:			3px 3px 6px 0 rgba(0,0,0,0.3);
	}

/*	---- classes for any element ---- */
.clear
	{
	clear:				both;
	}
.centered
	{
	text-align:			center;
	margin-left:		auto;
	margin-right:		auto;
	}
.right
	{
	float:				right;
	clear:				both;
	margin:				5px 5px 10px 15px;
	}
.left
	{
	float:				left;
	clear:				both;
	margin:				5px 15px 10px 0;
	}
.body
	{
	margin:				8px 20px 5px 15px;
	}
.indent
	{
	margin:				3px 20px 5px 30px;
	}
.indent2
	{
	margin:				3px 20px 5px 45px;
	}
.note
	{
	margin:				8px;
	font-family:		"Arial", "Helvetica", sans-serif;
	font-size:			11px;
	}

/*	---- special-purpose classes ---- */
p.homepagedesc
	{
	margin:				10px 0 10px 0;
	font-family:		"Arial", "Helvetica", sans-serif;
	font-size:			15px;
	line-height:		120%;
	text-align:			center;
	}
p.caption
	{
	font-family:		"Arial", "Helvetica", sans-serif;
	font-weight:		bold;
	font-size:			13px;
	text-align:			left;
	margin:				5px 0 5px 8px;
	}
p.photoNum
	{
	font-family:		"Arial", "Helvetica", sans-serif;
	font-size:			10px;
	margin:				5px 0 5px 8px;
	}
p.date
	{
	font-family:		"Arial", "Helvetica", sans-serif;
	font-size:			10px;
	margin:				5px 0 5px 8px;
	}
p.filename
	{
	font-family:		"Arial", "Helvetica", sans-serif;
	font-size:			10px;
	margin:				5px 0 5px 8px;
	}
p.revised
	{
	margin:				6px 10px 6px 10px;
	text-align:			center;
	font-family:		"Arial", "Helvetica", sans-serif;
	font-size:			12px;
	color:				#e00;
	}
p.photo-caption
	{
	font-family:		"Arial", "Helvetica", sans-serif;
	font-weight:		bold;
	font-size:			12px;
	text-align:			center;
	margin:				8px 0;
	}
span.time-note
	{
	font-size:			10px;
	color:				#444;
	}
span.time-special
	{
	font-size:			11px;
	color:				#b00;
	}
td.class-period, td.class-time
	{
	font-family:		"Arial", "Helvetica", sans-serif;
	line-height:		175%;
	text-align:			left;
	font-size:			12px;
	padding:			3px 8px 3px 8px;
	background:			#eee;
	}
td.class-time
	{
	text-align:			center;
	}
td.price
	{
	font-family:		"Arial", "Helvetica", sans-serif;
	font-size:			14px;
	text-align:			left;
	padding:			5px 10px 5px 10px;
	}
#prevPhotoButton
	{
	vertical-align:		middle;
	text-align:			right;
	margin-right:		5px;
	}
#nextPhotoButton
	{
	vertical-align:		middle;
	text-align:			left;
	margin-left:		5px;
	}
#prevDay, #today, #nextDay
	{
	margin:				0 5px;
	vertical-align:		middle;
	}