/*
	COLORS
	--------------------------------------
	Background ..... #191919
	Font ........... #666
	Headings ....... #642f33
	Link ........... #666
	Link hover ..... #999
	--------------------------------------
*/

body { background-color: #191919; font-family: Verdana, Sans-Serif; font-size: 62.5%; color: #666; }

.clear { height: 0; overflow: hidden; clear: both; }

ul { list-style-type: none; }

h1 { text-indent: -9999px; width: 748px; height: 74px; background: url(/gfx/logo.gif); margin: 0 auto; }
h2 { font: normal 2.8em Arial, Sans-Serif; text-transform: lowercase; color: #642f33; margin-bottom: 0.5em; }
h3 { font-weight: bold; font-size: 1.2em; color: #642f33 !important; line-height: 2em; }

p { margin-bottom: 1.6em; font-size: 1.2em; line-height: 1.4em; }

a { color: #666 !important; font-weight: bold; }
a:hover { color: #999 !important; }
		
input.txt,
button,
textarea { font-family: Verdana, Sans-Serif; font-size: 1.2em; border-style: solid; border-width: 1px 1px 3px 1px; font-weight: bold; padding: 0.2em 0.4em; color: #666; }	
input.txt { border-color: #9d9d9d; }
button { float: left; border-color: #9d9d9d; background-color: #d0d0d0; margin-top: 1.4em; }
textarea { border-color: #9d9d9d; }
label { display: block; margin: 0.5em 0 0.3em 0; }

#top { background: white url("/gfx/bg.gif") repeat-x left top; }
#topInner { width: 78.4em; margin: 0 auto; }

#header { position: relative; height: 131px; text-align: center; }
#header a { color: #999 !important; }
#header a:hover { color: #ccc !important; }

#page { background: url("/gfx/page-splash.gif") no-repeat center top; padding: 2em 1.6em; }
#primary   { float: left;  width: 42em; }
#secondary { float: right; width: 30em; }
#bottom { clear: both; text-align: center; font-size: 1.2em; padding: 1.5em 0; color: white; }

/* Navigation ................................... */

#nav { margin: 6px auto; width: 455px; height: 45px; }
#nav li { float: left; background-image: url("/gfx/nav.gif"); background-repeat: no-repeat; text-indent: -9999px; }
#nav li a { display: block; height: 45px; background-image: url("/gfx/nav.gif"); background-repeat: no-repeat; }

#navStart,
#navStart a                    { background-position:      0      0; width:  80px; }
#navStart a:hover              { background-position:      0  -45px; }
#start #navStart,
#start #navStart a             { background-position:      0  -90px; }
#start #navStart a:hover       { background-position:      0 -135px; }

#navKlubben,
#navKlubben a                  { background-position:  -80px      0; width: 100px; }
#navKlubben a:hover            { background-position:  -80px  -45px; }
#klubben #navKlubben,
#klubben #navKlubben a         { background-position:  -80px  -90px; }
#klubben #navKlubben a:hover   { background-position:  -80px -135px; }

#navLagen,
#navLagen a                    { background-position: -180px      0; width:  81px; }
#navLagen a:hover              { background-position: -180px  -45px; }
#lagen #navLagen,
#lagen #navLagen a             { background-position: -180px  -90px; }
#lagen #navLagen a:hover       { background-position: -180px -135px; }

#navKalender,
#navKalender a                 { background-position: -261px      0; width: 109px; }
#navKalender a:hover           { background-position: -261px  -45px; }
#kalender #navKalender,
#kalender #navKalender a       { background-position: -261px  -90px; }
#kalender #navKalender a:hover { background-position: -261px -135px; }

#navSnack,
#navSnack a                    { background-position: -370px      0; width:  82px; }
#navSnack a:hover              { background-position: -370px  -45px; }
#snack #navSnack,
#snack #navSnack a             { background-position: -370px  -90px; }
#snack #navSnack a:hover       { background-position: -370px -135px; }

/* Alert ........................................ */

div.alert { position: relative; }
div.alert ul { opacity: .7; filter: alpha(opacity = 70); -moz-opacity: .70; background-color: white; padding: 2.5em 2.5em 2.5em 65px; margin-bottom: 2em; font-weight: bold; }
		
div.error * { color: #350b0e; }
div.message * { color: #350b0e; }
div.alert img { position: absolute; top: 16px; left: 16px; }


/* ================================================================================================ */
/* START                                                                                            */
/* ------------------------------------------------------------------------------------------------ */

#flickr { width: 308px; margin-right: -8px; height: 69px; margin-bottom: 1.6em; overflow: hidden; }
#flickr li { float: left; margin-right: 8px; }
#flickr li a img { border: 4px solid #444; width: 61px; height: 61px; }


/* ================================================================================================ */
/* KLUBBEN                                                                                          */
/* ------------------------------------------------------------------------------------------------ */

#board li { margin-bottom: 1.2em; }
#board li img { float: left; margin-right: 0.8em; }


/* ================================================================================================ */
/* LAGEN                                                                                            */
/* ------------------------------------------------------------------------------------------------ */

.teams { float: left; font-size: 1.2em; width: 17.4em; }
.teams li { float: left; display: inline; text-align: center; }
.teams li a { display: block; padding: 5px; font-weight: bold; text-decoration: none; }
.teams li a:hover { color: #333 !important; background-color: #bbb; }
.teams li a img { display: block; margin-bottom: 3px; border: 1px solid #666; }

.team-photo { float: left; display: inline; border: 1px solid #666; margin: 0 1.5em 2.5em 0; }	

#practice { margin-bottom: 2.5em; }
#practice table { margin-top: 0.4em; font-size: 1.2em; line-height: 1.4em; }
#practice table td { padding-right: 0.8em; }
#practice table td.day { font-weight: bold; }

#players li { float: left; width: 18em; margin: 0 1.2em 1.2em 0; }
#players li img { float: left; margin-right: 0.8em; }


/* ================================================================================================ */
/* KALENDER                                                                                         */
/* ------------------------------------------------------------------------------------------------ */

#kalender #primary { width: 78.4em; }

#calendar h3 { text-transform: uppercase; text-align: center; }
#calendar #monthNav { height: 1.6em; margin-top: -17px; font-size: 1.2em; line-height: 1.4em; }
#calendar #nextMonth { float: right; padding-right: 20px; background: url(/gfx/icon-nav-next.gif) no-repeat top right; }
#calendar #prevMonth { float: left;  padding-left:  20px; background: url(/gfx/icon-nav-prev.gif) no-repeat top left; }
#calendar #nextMonth,
#calendar #prevMonth,
#calendar .wday { text-transform: capitalize; }

#calendar table { width: 100%; margin-top: 1em; }
#calendar dl { width: 100%; }
#calendar dt,
#calendar dd { padding: 0.2em 0; }
#calendar dt { float: left; width: 8%; clear: left; }
#calendar dd { float: left; width: 82%; }
* html #calendar dd { float: none; margin-left: 8%; }

#calendar th,
#calendar td { padding: 0.4em 0.8em; font-size: 1.2em; }

#calendar th { color: white; background-color: #642f33; text-align: center; font-weight: bold; }
#calendar td { border-bottom: 1px solid #bbb; }
#calendar .date { width: 6em; background-color: #ddd; }
#calendar .holiday span { color: #e00; }
#calendar .mday { float: left; width: 1.3em; text-align: right; font-size: 1.5em; font-weight: bold; margin-right: 0.5em; }
#calendar .wday { float: left; width: 3.2em; margin-top: 0.4em; }
#calendar .today { background-color: #0d2ef8; }
#calendar .today * { color: white !important; };
#calendar dd span { font-weight: bold; color: #642f33; }


/* ================================================================================================ */
/* SNACK                                                                                            */
/* ------------------------------------------------------------------------------------------------ */

a.addComment { font-size: 1.2em; padding-left: 2em; padding-bottom: 2px; background: url(/gfx/icon-add-comment.gif) no-repeat; }

.intervals { font-weight: bold; color: #642f33; }

#msgForm input.txt,
#msgForm textarea { width: 23.8em; margin-bottom: 0.5em; }
#msgForm button { width: 6em; }
#msgRemembered { margin: 0.6em 0.6em 0.3em 0; }
#msgRememberedLabel { margin: 1em 0 0.3em 0; }
#msgRemembered,
#msgRememberedLabel { float: left; }
#msgCaptcha { width: 13.5em !important; }
#msgForm img { float: right; width: 100px; height: 40px; margin: 2px 2px 0 0; }

#forum { position: relative; margin-top: 1.6em; font-size: 1em; line-height: 1.4em; color: black; filter: alpha(opacity=55); -moz-opacity: .55; opacity: .55; }
#forum li { margin-bottom: 1.2em; }
#forum li .bubble { background-color: #ccc; padding: 1.2em; }
#forum li .author { color: black !important; text-align: right;	padding: 3px 32px 0 0; background: url(/gfx/forum-bubble-arrow.gif) no-repeat top right; }


/* ================================================================================================ */
/* Common                                                                                           */
/* ------------------------------------------------------------------------------------------------ */

#articles li { clear: left; }
#articles .date { float: left; background-image: url("/gfx/date-bg.gif"); width: 38px; height: 35px; text-align: center; margin: 6px 16px 16px 0; padding-top: 15px; }
#articles .date .day { font: bold 17px/17px Arial, Sans-Serif; color: white !important; }
#articles .date .month { font: 12px/12px Arial, Sans-Serif; color: white !important; text-transform: uppercase; }
#articles .text { float: left; width: 350px; }

ul.tabs { height: 1.3em; margin: 0 -10px 1.4em; padding-left: 10px; font-size: 1.2em; }
ul.tabs li { float: left;  margin-right: 5px; }
ul.tabs a { display: block; padding: 4px 16px; text-decoration: none; font-weight: normal; background-color: #ddd; border: 1px solid #999; }
ul.tabs li.selected a { color: black !important; font-weight: bold; background-color: transparent; border-bottom: 1px solid #f2f2f2; }