/**************************************************
*	CSS-styles for Telkku.com-mobile.
***************************************************/

*{
	border: 0;
	margin: 0;
	padding: 0;
	color: #2f3136;
}
a {
	text-decoration: none;
}

#header {
	background: transparent url('images/header_bg.png') repeat-x;
	background-position: 0 2px;
	height: 58px;
	margin-left: 2px; 	/* For borders */
	margin-right: 2px; 	/* For borders */
}

#logo{
	background-image: url("images/telkku_logo.png");
	background-repeat: no-repeat;
	background-position: 0 2px;
	height: 57px;
	width: 142px;
	border: 0;
	margin: 0 auto 0 auto;
	padding: 0;
	display: block;
}

/* Rounded corners */
.top  { background: url('images/horizontal_border.png') repeat-x top; }
.bottom { background: url('images/horizontal_border.png') repeat-x bottom; }
.left  { background: url('images/vertical_border.png') repeat-y left; }
.right { background: url('images/vertical_border.png') repeat-y right; }
.upper-left { background: url('images/ul_corner.png') no-repeat top left; }
.upper-right { background: url('images/ur_corner.png') no-repeat top right; }
.bottom-left { background: url('images/bl_corner.png') no-repeat bottom left; }
.bottom-right { background: url('images/br_corner.png') no-repeat bottom right; }

/******************************
*	NAVIGATION STYLES
******************************/

#navi {
}

#navi select {
	margin: 0 auto;
	display: block;
	border: 1px solid #3A71FF;
}

#content, #navi {
	margin-left: 2px;	/* For borders */
	margin-right: 2px;	/* For borders */
}

.naviLink{
	color: #456fdc !important;
	text-decoration: none;
	font-weight: bold;
	font-size: 80%;
}

#channelGroupSelector{
	list-style: none;
	font-size: 80%;
	display: none;
}

#channelGroupSelector .channelGroup{
	float: left;
	margin: 2px;
	border: 1px solid #DCE7FF;
	padding: 1px 2px 2px 2px;
	height: 110px;
	width: 100px;
	overflow: hidden;
}

#channelGroupSelector .groupLink{
	display: block;
	width: 100%;
	height: 100%;
}

#channelGroupSelector .groupLink:hover{
	background-color: #f5f8ff;
}

#channelGroupSelector .selectedGroupLink{
	background-color: #E3EEFF;
}

#channelGroupSelector .groupTitle{
	background-color: #DCE7FF;
	font-weight: bold;
	display: block;
	width: 100%;
	text-align: center;
}

#channelGroupSelectorButton{
	height: 18px;
	background: transparent url('images/selector_right.png') no-repeat scroll top right;
	padding-right: 14px;
	cursor: pointer;
	display: block;
}

#channelGroupSelectorButton span{
	background: transparent url('images/selector_left.png') no-repeat;
	line-height: 18px;
	display: block;
	font-size: 80%;
	font-weight: bold;
	padding: 0 3px 0 3px;
	color: #5477BC;
}

#naviBar{
	list-style: none;
	line-height: 18px;
}

#naviBar li{
	float: left;
}

#naviBar .subsequentNaviBarItem{
	margin-left: 5px;
}

/*********************************
*	CONTENT AREA
*********************************/

#content{
	padding: 5px 2px 5px 2px;
}

#content table {
	border-collapse: collapse;
	width: 100%;
}

#content table td {
	padding: 1px 3px;
}

#content table .back {
	text-align: right;
}

#content table .current {
	background-color: #c7dfff;
}
#content table caption {
	font-weight: bold;
	font-size: large;
}

#content .normalLinkColors {
	color: #456fdc !important;
	text-decoration: underline !important;
	font-weight: bold;
	font-size: 80%;
}

#content #selectedDate{
	font-size: 80%;
	font-weight: bold;
	color: #456fdc !important;
}

/************************************
*	PROGRAM TABLE STYLES
************************************/

.programTable{

}

.programTable a{
	color: #214CA5;
}

.programTable a:hover{
	color: #0A3A6E;
}

.programInfoImage {
	width: 100%;
}

.programInfo {
}

.progTime{
	width: 5%;
}

.progName{
}

.currentProgramTime{
	background-color: #9BC6FE;
}

.currentProgram{
	background-color: #C7DFFF;
}

.programDescription{
	margin-top: 5px;
	padding-left: 3px;
	font-size: 90%;
}

.calendarBrowseLink{
	font-size: 80%;
	font-weight: bold;
	color: #456FDC;
	margin: 5px 0 5px;
}
#previousDayLink{
	float: left;
}

#nextDayLink{
	float: right;
}

.addToCalendar{
	color: #d02a14 !important;
	text-decoration: none !important;
	font-weight: bold;
	font-size: 80%;
}