/**************************************
 * Reset
 * 
 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }
:focus { outline: 0; }
ins { text-decoration: none; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }


/************************************
 * Basic elements
 *
 */
 
body {
	font: normal 10px/1.3 Verdana, Helvetica, Arial, sans-serif;
	color: #ffffff; 
	text-align: center;
	background: #4d6bb3 url('images/bg-body.jpg') no-repeat center top;*/
}

html {
	background: #4d6bb3 url('images/bg-body.jpg') no-repeat center top;
}


/************************************
 * Basic elements
 *
 */

p {	text-align: left; }
p { margin-top: 0; margin-bottom: 0; padding-right: 12px; }

a:link, a:visited { text-decoration: none; color: #8f93c1; }
a:hover, a:active { text-decoration: underline; color: #8f93c1; }

img { margin: 0; padding: 0; border: 0; }

h1, h2, h3 {
	margin: 0 0 1em; padding: 0; text-align: left; font-weight: bold;
	color: #ffffff;
}
h1 { font-size: 18px; }
h2 { font-size: 18px; color: #8f93c1; }
h3 { font-size: 14px; color: #ffffff; }
h2.italic { font-style: italic; }

sub { vertical-align: baseline; position: relative; bottom: -0.25em; font-size: smaller; }
sup { vertical-align: baseline; position: relative; bottom: 0.33em; font-size: smaller; }

table { border-collapse: collapse; }
th { text-align: left; font-weight: normal; }
td { vertical-align: top; padding: 1px; text-align: left; }
td p { margin: 0; padding: 0; font-size: 1em; }

/************************************
 * Basic layout
 *
 */


#header {
	position: relative; width: 950px; height: 170px;
	margin: 0 auto; clear: both;  
	background: #0057a4 url('images/bg-header.jpg') no-repeat left top;
}
a#header-home { text-indent: -999em; display: block; position:absolute; top: 12px; left: 20px; width: 150px; height: 145px; }
a#header-league { text-indent: -999em; display: block; position:absolute; right: 10px; top: 9px; width: 120px; height: 30px; }

#page { color: white; width: 950px; margin: 0 auto; text-align: left; position: relative; background-color: #000000; clear: both; }
body#fanshop #page { color: #000000; background-color: #ffffff; }

#navigation { 
    /*background-color: #1c3376;*/ 
    background-color: #0057a4; 
    min-height: 22px; height: auto !important; height: 22px; 
    border-right: 1px solid #000000; 
    z-index: 1000; position: relative;
    clear: both;  
}

#rss { position: absolute; top: 3px; right: 3px; }

#container { border-top: 8px solid #000000; border-bottom: 8px solid #000000; z-index: 10;  position: relative; }
body#fanshop #container { border-top: 8px solid #ffffff; border-bottom: 8px solid #ffffff; }
#content-wrapper {
	margin: 0; padding: 0;
	min-height: 600px; height: auto !important; height: 600px;
	clear: both;
	background: #000000 url('images/bg-fp-main.gif') repeat-y 12px 0;
	z-index: 5;
}
body#fanshop #content-wrapper { background-color: #ffffff; background-image: none; }

#content-sidebar {
	width: 210px;
	min-height: 600px; height: auto !important; height: 600px; float: left;
	margin: 0 8px 0 10px;
	padding-top: 12px; 
}
body#fanshop #content-sidebar { display: none; }


#content-main { 
    float: right;
    margin: 0 12px 0 0; padding: 12px 0 0 0;
	width: 675px; min-height: 600px; height: auto !important; height: 600px;
}
body#fanshop #content-main { float: left; width: 925px; margin: 0 12px; }

#footer { clear: both; background-color: #ffffff; color: black; position: relative; width: 950px; margin: 0 auto; text-align: center; padding: 8px 0; }
#footer img { vertical-align: middle; }

/***************************************
 *	Navigation
 *
 */

#navigation ul { font-family: Arial, Helvetica, sans-serif; margin: 0; padding: 0; list-style-type: none; text-align: right; padding-right: 66px; float: right; clear: both; }
#navigation ul li { margin: 0; padding: 0; position: relative; margin-right: 18px; padding: 8px 0 8px; display: block; float: left;  }
#navigation ul li.last { margin-right: 0; }
#navigation ul li a { color: #ffffff; font-size: 18px; font-weight: bold; text-transform: uppercase; }
#navigation ul li a:hover { text-decoration: none; }

#navigation li ul {
    display: none; position: absolute; top: 32px; left: 2px;
    width: 120px; float: none; z-index: 1100;
    text-align: left;
    background: url('images/blank.gif') repeat; 
    
}


#navigation li ul li,
#navigation li.last ul li { height: auto; display: block; line-height: 20px; width: 100%; background-color: #ffffff; margin: 0; padding: 3px 5px; white-space: nowrap;   }
#navigation li ul li.last { }
#navigation li ul li a,
#navigation li.last ul li a,
#navigation ul li.active ul li a
{
    color: #0057a4;
    display: block; position: relative;
    text-align: left;
    margin: 0; font-size: 14px; text-transform: none;
    width: 100%;   
}
/*#navigation li:hover ul { display: block; }*/
#navigation li ul li a:hover { text-decoration: underline; }

#subnavigation ul { list-style-type: none; margin: 1em; padding-left: 0; }
#subnavigation ul li { text-transform: uppercase; font-weight: bold; margin: 0 0 1em 0; }
#subnavigation ul li ul { list-style-type: none; padding-left: 0.3em; margin: 0 0 0 0.6em; }
#subnavigation ul li ul li { text-transform: none; font-weight: normal; margin: 0; }
#subnavigation ul li ul li ul { list-style-type: none; 	margin-left: 0.6em; padding-left: 0.6em; margin-bottom: 0; }
#subnavigation ul li ul li ul li { text-transform: none; font-weight: normal; }


#extra-navigation ul { font-family: Arial, Helvetica, sans-serif; margin: 2px 0 0 0; padding: 0; list-style-type: none; text-align: left; padding-left: 16px; }
#extra-navigation ul li { margin: 0; padding: 0 0 8px 0; position: relative; display: block; height: auto; line-height: 1.1; }
#extra-navigation ul li a { color: #ffffff; font-size: 18px; font-weight: bold; text-transform: uppercase; }
#extra-navigation ul li a:hover { text-decoration: none; }

#junior-navigation h2 { color: #ffffff; border-bottom: 1px solid #8F93C1; text-transform: uppercase; }
#junior-navigation ul { font-family: Arial, Helvetica, sans-serif; margin: 0 0 20px 0; padding: 0; list-style-type: none; text-align: left; clear: both; }
#junior-navigation ul li { margin: 0; padding: 0; position: relative; padding: 1px 0 1px; display: block; }
#junior-navigation ul li.last { margin-right: 0; }
#junior-navigation ul li a { color: #8F93C1; font-size: 14px; font-weight: bold; text-transform: uppercase; }
#junior-navigation ul li a:hover { text-decoration: underline; }
#junior-navigation ul li.active a { color: #ffffff; }

/************************************
 * Slideshow
 *
 */
#slideshow-container { width: 705px; height: 395px; }
.slideshow-slide { width: 100%; height: 395px; position: relative; }
.slideshow-slide img { width: 100%; }
.slideshow-caption { position: absolute; bottom: 16px; left: 16px; /*text-shadow: #000000 1px 1px 2px; */text-align: left; }
.slideshow-caption,
.slideshow-caption p { font-size: 10px; font-weight: bold; color: #000000; }
.slideshow-caption h4 { margin: 0; font-size: 14px; color: #000000; }
.slideshow-caption a { color: #0057a4; /*text-shadow: #000000 1px 1px 0px;*/ }

#slideshow-thumbs { position: absolute; right: 20px; top: 8px; z-index: 100; }
#slideshow-thumbs li { display: block; margin-bottom: 5px; }
#slideshow-thumbs li a img { border: 1px solid #333; }
#slideshow-thumbs li.activeSlide a img { border: 1px solid #eee; }


/************************************
 * Blocks
 *
 */


.graybox { background-color: #e9e9e9;}
.orange-gradient { background: white url('/assets/templates/ops/images/heading-orange-background.gif') repeat-x center left; }
h2.block,
h3.block { display: block; padding: 4px 12px; text-transform: uppercase; margin: 0 0 6px 0; color: white; }
.block-blue { 
    /*background-color: #1c3376;*/
    background-color: #0057a4; 
}

/************************************ 
 * Forms
 *
 */

form { margin: 40px 0 20px 60px; }
label { display: block; clear: both; font-weight: bold; margin: 0 0 3px 0; font-size: 11px; }
input.inputField { font: normal 11px/normal Verdana, Arial, Helvetica, sans-serif; display: block; margin: 0 0 6px 0; width: 15em; }
input.button { font: normal 11px/normal Verdana, Arial, Helvetica, sans-serif; background-color: #f7f7f7; }


/************************************ 
 * Home
 *
 */

.fp-main { 
    background: #000000 url('images/bg-fp-main.gif') repeat-y left top; 
    clear: both; 
    border-top: 4px solid #000000;
    border-bottom: 4px solid #000000;
}

.fp-col1 { width: 208px; float: left; margin-left: 8px; position: relative; z-index: 1000; }
.fp-col2 { width: 705px; float: right; margin-left: 6px; margin-right: 14px; z-index: 10;}
#extra-banner { width: 720px; float: right; margin-right: 5px; margin-left: 0; }
#fp-slideshow { 
    margin-bottom: 6px; text-align: center; position: relative; 
    width: 705px; height: 395px; overflow: hidden; 
    background-color: white; 
}
.fp-col2-inner {}
.fp-col2-left { width: 450px; float: left; margin-left: 6px; }
.fp-col2-right { width: 200px; float: right; }
.fp-fb-box { background-color: #1d3479; /*background-color: #0057a4;*/  font-size: 14px; color: white; padding: 12px; }
.fp-fb-box .facebook-embed { background-color: white; padding: 12px 0 0 12px }
.fp-fb-box p { text-align: center; padding: 20px 20px 0px 20px; margin: 0 0 12px; }
.fp-fb-box a { color: white; font-weight: bold; }
.fp-box { padding: 12px 0 20px 0; background: #000000 url('images/bg-fp-box.gif') no-repeat left bottom; min-height: 20px; height: auto !important; height: 20px; }
.fp-box-plain { background-image: none; }

.fp-separator { background: #000000 url('images/bg-fp-separator.gif') no-repeat left top; height: 12px; clear: both; }

.fp-col-wide { margin: 12px 0; clear: both; }

.fp-col1 h2 { color: white; text-align: center; margin-bottom: 4px; font-style: italic; text-transform: uppercase;  }

#bottom-ads { padding-left: 24px; padding-right: 24px; clear: both; }
#bottom-ads div.bottom-banner { width: 275px; }
#bottom-ads #bottom-col1 { float: left; }
#bottom-ads #bottom-col2 { float: left; margin-left: 35px; }
#bottom-ads #bottom-col3 { float: right; }

#fp-league-table { padding: 12px 0 20px 0; }
#fp-league-table h2 { color: white; text-align: center; margin-bottom: 4px; }
table.league-table { width: 93%; background-color: white; margin: 0 auto; }
table.league-table th { /*background-color: #1c3376;*/ background-color: #0057a4; color: white; font-weight: bold; padding: 2px 3px; }
table.league-table td.matches { text-align: center; }
table.league-table td.points { text-align: center; }
table.league-table td { padding: 2px 2px; color: black; }

/************************************ 
 * Calendar
 *
 */
div#fp-calendar p { margin: 10px 0 0; text-align: center; position: relative;}
div#calendar-events { position: relative; }
table.calendar { margin: 0 auto; }
table.calendar th { background-color: white; color: black; padding: 4px; text-align: center;  }
table.calendar td {
    background-color: #0057a4; color: white;
    border: 2px solid black; border-left: none; border-bottom: none;
    text-align: center; font-weight: bold; 
    padding: 3px;
}
div.calendar-navigation { text-align: center; }
caption.calendar-month, 
a#calendar-prev, 
a#calendar-next { color: white; text-decoration: none; font-weight: bold;}
caption.calendar-month { text-align: center; margin: 1em auto 0 auto; }
table.calendar td { font-size: 11px;  }
table.calendar td.cal_link,
/*table.calendar td.calendar-link,*/
table.calendar td.curDay { background-color: #ccc; }
table.calendar td.cal_link a,
table.calendar td.curDay a { 
    text-decoration: none; background-color: #ccc; color: black; display: block;
}
table.calendar td.calendar-day-empty { background-color: black; }

table.calendar td.home a { color: #102561; }
table.calendar td.away a { color: #8f8b8b; }
table.calendar td.win a { color: #f49e23; }
table.calendar td.draw a { color: #0f924b; }
table.calendar td.lose a { color: #ff0000; }

a.calender-tooltip-link { display: block; }
/* Tooltips */
div#fp-calendar table.calendar td div.tooltip
{
    border: 1px solid #0057a4;  
    display: none;
    background: #000000;
    font-size: 10px;
    width: 170px;
    min-height: 50px; height: auto !important; height: 50px;  
    padding: 8px;
    color: white;   
    font-weight: normal; 
    text-align: left; 
}

div#fp-calendar table.calendar td div.tooltip p { text-align: left; margin-bottom: 12px; margin-top: 0;  }
table.calendar td.home div.tooltip a,
table.calendar td.away div.tooltip a,
table.calendar td.win div.tooltip a,
table.calendar td.draw div.tooltip a,
table.calendar td.lose div.tooltip a { color: #8f93c1; }

/************************************ 
 * News
 *
 */

div.shortNewsEntry { margin-bottom: 18px; }
div.shortNewsEntry p.date { color: #8f93c1; font-size: 10px; }
div.shortNewsEntry p { font-size: 10px; }
div.shortNewsEntry h3 { margin-bottom: 4px; }

div.shortNewsPageEntry { margin-bottom: 18px; }
div.shortNewsPageEntry p.date { color: #8f93c1; font-size: 10px; }
div.shortNewsPageEntry p { font-size: 10px; }
div.shortNewsPageEntry h3 { margin-bottom: 4px; font-size: 10px; }

div.shortNewsArchiveEntry {
	padding: 0 12px 0 0;
	font-size: 11px;
}

div.shortNewsArchiveEntry h3 {
	margin-bottom: 0;
}

div.newsEntry { margin: 12px 24px 24px 0; }
div.newsEntry p.date { margin-bottom: 4px; color: #8f93c1; }
div.newsEntry h2 { margin: 0 0 0.2em 0; padding: 0; }
div.newsEntry h3 { font-weight: normal; margin: 0 0 18px 0; padding: 0; }
div.newsEntry img.newsImage { float: left; margin-right: 16px; margin-bottom: 16px; }
div.newsEntry div { clear: both; }

.news-links { clear: both; margin: 12px 12px 12px 0; }

.news-links span.left { width: 40%; float: left; text-align: left; }
.news-links span.right { width: 40%; float: right; text-align: right; }

/************************************ 
 * Fixes and special cases
 *
 */

.clearfix:after,
#header:after, div.newsEntry:after, div.shortNewsEntry:after, div.newsEntry div:after,
#branding:after, #page:after, #footer:after, #container:after, #content-wrapper:after, #navigation:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;	
}

.hidden {
	display: none;
}