/* colors */

.title-sepa, .frame, .navi, .navi-item, .band-line1, .band-ball1, .chat, .chat-item, .chat-send, .chat-message
{
	background-color: #113311;
}
body, .title
{
	background-color: #000000;
}
.page
{
	background-color: #224422;
}
.navi-item:hover, .chat-send:hover, .chat-message:hover
{
	background-color: #335533;
	box-shadow: 0px 2px 2px #002200;
}
.band-line2, .band-ball2
{
	background-color: #557755;
}

.tab-info, a.tab-button, a.tab-button:link, a.tab-button:visited, a.tab-button:active, a.tab-gogo, a.tab-gogo:link, a.tab-gogo:visited, a.tab-gogo:active, .texttab-info, .texttab-close
{
	border: solid 1px #113311;
	background-color: #395b39;
	box-shadow: 1px 1px 2px #113311;
}
.tab-info:hover, a.tab-button:hover, a.tab-gogo:hover, .texttab-close:hover
{
	background-color: #557755;
}
textarea#chat-send-text
{
	border: solid 1px #002200;
	background-color: #224422;
	box-shadow: 1px 1px 2px #002200 inset;
}



/* fonts */

/* .navi-text, .navi-count, .band-name, .band-album, .tab-info, a.tab-button, a.tab-button:link, a.tab-button:visited, a.tab-button:active, a.tab-gogo, a.tab-gogo:link, a.tab-gogo:visited, a.tab-gogo:active, .chat-message, textarea#chat-send-text, #chat-response */
body, div, a, textarea
{
	font-family: sans-serif;
	color: #ffffff;
}
.chat-message-info
{
	font-size: 11px;
}
.tab-info-text, .chat-message, textarea#chat-send-text
{
	font-size: 13px;
}
.navi-text, .navi-count, .band-album, .tab-info, a.tab-button, a.tab-button:link, a.tab-button:visited, a.tab-button:active, a.tab-gogo, a.tab-gogo:link, a.tab-gogo:visited, a.tab-gogo:active, #chat-response, .texttab-close
{
	font-size: 14px;
}
.band-name
{
	font-size: 16px;
}





body
{
	margin: 0px;
}

body, .title
{
	background-image: url("res/alexi.jpg");
	background-repeat: no-repeat;
	background-attachment: fixed;
}

.title
{
	position: fixed;
	height: 132px;
	top: 0px;
	width: 100%;
	text-align: center;
	z-index: 100;
}

.logo
{
	height: 97px;
	padding: 6px;
}

.title-sepa
{
	width: 1000px;
	height: 24px;
	margin-left: auto;
	margin-right: auto;
}

.frame
{
	width: 1000px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 133px;
}

.navi
{
	position: fixed;
	width: 200px;
	height: 100%;
	overflow-x: hidden;
	z-index: 90;
}

.page
{
	margin-left: 200px;
	width: 600px;
	padding-top: 2px;
	padding-bottom: 32px;
	z-index: 5;
}

.navi-sepa
{
	height: 12px;
}

.navi-item
{
	height: 24px;
	padding: 4px 8px;
	position: relative;
	z-index: 92;
}
.navi-item:hover
{
	z-index: 93;
}

img.icon
{
	width: 24px;
	height: 24px;
}

.navi-text, .navi-count
{
	display: inline-block;
	text-decoration: none;
	position: relative;
	vertical-align: top;
	top: 4px;
}
.navi-text
{
	margin-left: 12px;
}
.navi-count
{
	float: right;
}

.band
{
	position: relative;
	margin: 32px 16px;
}

.band-offset
{
	display: block;
	position: absolute;
	top: -136px;
}

.band-right
{
	margin-left: 28px;
}

.band-line1
{
	width: 12px;
	height: 100%;
	top: 12px;
	left: 18px;
	border-radius: 6px;
	position: absolute;
	z-index: 10;
}

.band-line2
{
	width: 4px;
	height: 100%;
	top: 8px;
	left: 22px;
	border-radius: 2px;
	position: absolute;
	z-index: 30;
}

.band-ball1
{
	text-align: center;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	overflow: hidden;
	position: absolute;
	z-index: 20;
}

.band-ball2
{
	text-align: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	overflow: hidden;
	position: absolute;
	top: 4px;
	left: 4px;
	z-index: 40;
}
.band-line2, .band-ball2
{
	transition: background-color 0.5s;
}

.band-ball2-icon
{
	position: relative;
	top: 9px;
}

.band-name
{
	padding: 16px 8px 4px 26px;
	width: 474px;
}

.band-album
{
	padding: 8px 0px 2px 14px;
	width: 498px;
}

.band-tab
{
	white-space: nowrap;
	width: 502px;
	margin-left: 6px;
}

.tab-info, a.tab-button, a.tab-button:link, a.tab-button:visited, a.tab-button:active, a.tab-gogo, a.tab-gogo:link, a.tab-gogo:visited, a.tab-gogo:active
{
	display: inline-block;
	text-decoration: none;
	padding: 8px 4px;
	margin: 2px;
	vertical-align: top;
	overflow: hidden;
	cursor: pointer;
}
a.tab-button, a.tab-button:link, a.tab-button:visited, a.tab-button:active
{
	width: 32px;
	text-align: center;
}
a.tab-gogo, a.tab-gogo:link, a.tab-gogo:visited, a.tab-gogo:active
{
	width: 124px;
	text-align: center;
}

.tab-info
{
	width: 350px;
	white-space: normal;
}

.tab-info-title
{
	display: inline-block;
	white-space: nowrap;
}

.tab-info-date
{
	display: inline-block;
	position: relative;
	float: right;
}

.tab-info-text
{
	display: none;
	padding: 14px 4px 2px 4px;
}

.chat
{
	position: absolute;
	margin-left: 800px;
	width: 200px;
	overflow-x: hidden;
	z-index: 80;
}

.chat-item, .chat-send
{
	height: 24px;
	padding: 4px 8px;
	position: relative;
	z-index: 82;
}
.chat-send:hover
{
	z-index: 83;
}

.chat-item, .chat-message, #chat-response
{
	cursor: default;
}

.chat-message
{
	padding: 8px;
	position: relative;
	z-index: 82;
}
.chat-message:hover
{
	z-index: 83;
}

.chat-message-sepa
{
	height: 4px;
}

#chat-hidden
{
	display: none;
}

.chat-text
{
	text-align: center;
}

textarea#chat-send-text
{
	resize: none;
	width: 160px;
	height: 80px;
	padding: 6px;
	margin-bottom: 2px;
}

.chat-send
{
	cursor: pointer;
}

#chat-response
{
	text-align: center;
	padding: 8px 0px;
	position: relative;
}

.texttab-info, .texttab-close
{
	display: block;
	width: 488px;
	padding: 8px 4px;
	margin: 2px;
	vertical-align: top;
	overflow: auto;
	text-decoration: none;
	text-align: center;
}
.texttab-info
{
	font-family: monospace;
	font-size: 12px;
}
.texttab-close
{
	position: relative;
	top: -3px;
	cursor: pointer;
}