@charset "utf-8";

/* --------------------------------------------------------

	Ceekayed.com designed by
	Miska Närhi, miska@pulse247.info
	
----------------------------------------------------------- */
@import "base.css";
@import "base.forms.css";

/* Layout
----------------------------------------------------------- */

html, body { height: 100%; width: 100%; }
html { background: #131414 url(../i/pattern.jpg) repeat left top; }
body { background: url(../i/highlight.jpg) no-repeat left top; height: auto !important; min-height: 100%; }
#Wrapper { min-height: 100%; background: url(../i/viivat.png) repeat-y left top; }
#Header {
	overflow: hidden; margin: 0 0 12px;
	padding: 92px 14px 30px 10px; height: 60px; width: 940px;
	background: url(../i/header.jpg) no-repeat left bottom;
}
.HeadWrap { overflow: hidden; width: 100%; height: 45px; margin: 0 0 5px; }
#Header h1, #Header h2 { margin: 0; padding: 0; height: 30px; }
#Header h1 a, #Header h2 a { display: block; height: 30px; }
#Header h1 a span, #Header h2 a span, .HeadWrap h2, .HeadWrap h3 { display: block; overflow: hidden; text-indent: -1000em; }
#SongsHeader { background: url(../i/h-songs.png) no-repeat left top; }
#AboutHeader { background: url(../i/h-about.png) no-repeat left top; }
#ContactHeader { background: url(../i/h-contact.png) no-repeat left top; }
#BlogHeader { background: url(../i/h-diary.png) no-repeat left top; }
#LinksHeader { background: url(../i/h-elsewhere.png) no-repeat left top; margin-top: 30px; }

.Col {
	position: relative; float: left;
	width: 200px; padding: 0 20px;
}
.Wide { width: 440px; }
.SplitterWrapper { width: 480px; overflow: hidden; margin: 0; padding: 0; }
.Split {
	width: 480px; overflow: hidden; margin: 0; padding: 0; clear: left;
	background: url(../i/viiva.png) repeat-y 239px top;
}
#SongsWrapper {
	background: url(../i/splitter.png) no-repeat left bottom;
	padding: 0 20px 30px;
}
.SongsIntro { margin-bottom: 30px; }
.Song {
	position: relative; padding: 0 0 0 60px;
	padding-bottom: 15px;
}
.Song h3 { width: 440px; height: 15px; margin-bottom: 5px; font-size: 11px; }

.Song dl { margin-bottom: 10px; padding: 0; }
.Song dt, .Song dd { width: 60px; margin: 0; clear: none; font-size: 10px; }
.Song dt { width: 50px; color: #454745; }
.Song dt.Long { clear: left; width: 85px; }
.Song dd {}
.Song dd.Long { width: 185px; }

.Song .PlayButton {
	position: absolute; display: block;	top: 0px; left: 0px;
	width: 440px; height: 50px;	margin: 0; padding: 0;
	background: url(../i/PlayStop.gif) no-repeat left top;
	text-indent: 60px;
}
.Song .Playing { background-position: left -50px; }
.Song .PlayButton:hover { background-position: left -100px; }
.Song .Playing:hover { background-position: left -150px; }
.Song .PlayButton span { display: none; }

.BlogEntry .PlayButton { padding-left: 18px; background: url(../i/SmallPlay.gif) no-repeat left top; }
.BlogEntry .PlayButton:hover { background-position: left -15px; }
.BlogEntry .Playing { background-position: left -30px; }
.BlogEntry .Playing:hover { background-position: left -45px; }

.BlogEntry {
	width: 440px; margin: 0 -20px; padding: 0 20px 30px;
	background: url(../i/separator.png) no-repeat left bottom;
}
.BlogEntry dl {
	margin: -15px 0 15px; display: block;
	padding: 0; float: none; width: 100%;
	height: auto; font-size: 10px;
}
.BlogEntry dt, .BlogEntry dd { float: none; clear: none; margin: 0; padding: 0 2px 0 0; display: inline; }
.BlogEntry dt { color: #454745; }
.BlogEntry dd { padding: 0 8px 0 0; }

.CommentStatus {
	margin: 0; padding: 0; line-height: 30px;
	width: 100%; overflow: hidden;
}
.ShowCommentsLink, .HideCommentsLink {
	display: block; height: 30px; line-height: 30px; color: #737a73;
	margin: 0; padding: 0 0 0 25px; text-decoration: none; font-weight: bold;
	background: url(../i/CommentButton.gif) no-repeat left top;
}
.ShowCommentsLink:hover, .HideCommentsLink:hover { background-position: left -30px; }

.PostCommentsWrapper {
	display: none; padding-bottom: 15px;
}
ol.CommentList {
	margin: 0; padding: 0;
	list-style: none outside;
}
.LeaveReply, ol.CommentList li, .navigation {
	border: 1px solid #333630;
	background: url(../i/overlay.png) repeat left top;
	margin: 0 1px 5px; padding: 10px 10px 5px 23px;
	-moz-border-radius: 3px; -webkit-border-radius: 3px;
}
.LeaveReply { padding-bottom: 10px; }
ol.CommentList dl, .LeaveReply h4 {
	width: auto; padding: 5px 0 5px 13px; margin: 0 0 10px -13px;
	background: #1a1b1a; border: 1px solid #252625;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}
.navigation {
	border: 1px solid #333630; background: url(../i/overlay.png) repeat left top;
	margin: 0 -10px; padding: 9px; width: 100%; overflow: hidden;
	-moz-border-radius: 3px; -webkit-border-radius: 3px;
}
.navigation div { width: 50%; float: left; }
.navigation div.alignleft { text-align: left; float: left; }
.navigation div.alignright { text-align: right; float: right; }