/* All styles that appear in the main content area must be declared without
containers (e.g. p instead of #content p).  This is so dub3 can pick up the
styles in the editor (the editor can't see the master page, and thus the
parent div.  All conflicting styles (such as in the left column) should be
declared explicitly where their styles might conflict with the default. */

* { margin:0; padding: 0; } /* Reset all default margins and padding */

/* body.site is used to set a background/style where it will appear different
to the one in the content area.  Dub3 won't see the class on the body tag so
will pick up the default body style.  For this reason the body tag's background
should match the content area */

body { font-family:Arial; font-size:0.9em;} 
body.site { background:#f3f3f3; } 

/* Content styles */
/* Try to put padding on the parent div, rather than margins on the element */

p, h1, h2, h3 { margin-bottom:0.8em; }
ul, ol { margin: 15px 35px; }

h1 
{
    font-size:1.4em; 
    border-bottom: 1px solid #8E9788; 
    font-weight: normal; 
    color: #8e9788;
}

h2 { font-size:1.2em; border-bottom:1px solid #8E9788; font-weight: normal; color: #8e9788; }
h3 { font-size:1.1em; border-bottom:2px solid #8E9788; font-weight: normal; color: #8e9788; padding: 0 0 5px 0;}
h4 { color: #000; font-size:0.9em; margin: 0 0 10px 0;}
h5 { color: #5b6851;}
h6 { font-size: 14px; font-weight: bold;}
a { color:#333; text-decoration:underline; }
a:hover { color: #6699cc;}
p {color: #444;}
abbr, acronym { 
	border-bottom: 1px dotted #f00; 
	cursor: help; 
}
img { border:0; }


.welcomeBox 
{
    width: 340px;
    height: 211px;
    background: url('/cms/outertemplates/images/welcomeBoxBG.jpg');
    padding: 40px 15px 0 10px;
}

/* Page building styles */
#bgWrap {width: 998px; background: url('/cms/outertemplates/images/bg.gif') center repeat-y; margin: 0 auto;}
#wrap { width:980px; margin: 0 auto; border: 1px solid #ccc;}
#header { width:100%; clear: both; background: #ccc url('/cms/outertemplates/images/header.jpg') center; height: 123px; }
#middleWrap { width:980px; margin:0 auto; background:#E9E9E9 url('/cms/outertemplates/images/bgContent.jpg') center top repeat-y;}
#middleWrap.wide { background:none;}
#content { width:615px; float:left; background: #fff; padding: 0 0 15px 0;}
#content.wide { width:980px; }
#contentPad
{
    width: 585px;
    padding: 15px;
    margin: 0 auto;
    background: url('/cms/outertemplates/images/heading_bg.jpg') repeat-x top;
}
#contentPad.wide { width:950px; }

#search {clear: both; height: 30px; width: 305px; margin: 55px auto 0 auto;}

.homeSplash 
{
    height:251px;
    width: 615px;
    background: #fff url('/cms/outertemplates/images/home_splash.jpg') center top no-repeat;
    position: relative;
    margin: 0;
    padding: 0;
}

.homeSplash p {color: #ffe66a; margin: 0;}

.homeSplash .tranBox 
{
    background: url('/cms/outertemplates/images/splashBG.png') repeat; 
    padding: 15px; position: absolute; bottom:0; right:0; width: 585px;}

#rightCol { width: 363px; float:left;}

.sideBoxes 
{
    background:#fff url('/cms/outertemplates/images/sideboxBg.gif') repeat-y;
    margin:15px 22px 0;
    width:320px;
    clear: both;
}

.sideBoxesContent
{
    padding: 10px;
}

.sideBoxFooter 
{
    background: url('/cms/outertemplates/images/sideBoxFooter.gif') top center no-repeat;
    height: 7px;
    clear: both;
    overflow: hidden;
}

.sideBoxes .rssButton
{
    right: 15px;
    top: 15px;
    position:absolute;
}

.sideBoxes h3 
{
    background: url('/cms/outertemplates/images/sideboxHeader.gif') center no-repeat;
    height: 44px;
    line-height: 44px;
    display: inherit;
    padding: 0 0 0 15px;
    border-bottom: 1px solid #ddd; 
}

#fixedLinks {width: 280px; float: right; margin: 50px 0 0 0; text-align: right; padding: 0 30px 0 0;}
#fixedLinks a {color: #ffe76b; margin: 0 0 10px 0; text-decoration: underline;}
#fixedLinks ul {margin: 0; height: 30px; line-height: 30px;}
#fixedLinks li { display:inline; list-style:none; padding: 0 0 0 10px; background: url('/cms/outertemplates/images/footerSep.gif') left no-repeat; }
#fixedLinks li:first-child { background: none; }

#fixedLinks li a { color: #ffe76b; text-decoration: none;} 

#divbreadcrumb p { float:left; margin:5px; }
#divbreadcrumb ul { float:left; margin: 5px; }
#divbreadcrumb li { display:inline; padding-left:8px; background:url(/cms/outertemplates/images/default/breadcrumb.gif) left no-repeat; }

#footer {font-size:0.9em; background: url('/cms/outertemplates/images/footer.gif') center no-repeat; height: 120px;}
#footer p { text-align:center; }
#footerCopyright {text-align: center; margin: 15px auto; font-size: 12px;}
#footerCopyright a {color: #333;}

#news {margin: 0 15px 0 0;}

.linksBox 
{
    width: 280px;
    height: 240px;
    background: #fff url('/cms/outertemplates/images/contentBoxHeader.gif') top left repeat-x;
    border: 1px solid #ccc;
    float: left;
}

.linksBox ul { margin: 5px 5px 5px 25px; height: 183px; overflow: scroll; margin: 0 auto; padding: 10px;}
.linksBox li { list-style-type: none; }
.linksBox h3 {
    border-bottom:1px solid #DDDDDD;
    height:36px;
    margin: 0;
    line-height:36px;
    padding:0 0 0 15px;
}

#news ul {}
#news h3 { border-bottom:1px solid #ddd; height:36px; line-height:36px; padding:0 0 0 15px; }


#news li { list-style-type: none; }

#skipLinks {position:absolute; left:-9999px;}

/* Box styles */
.box1
{
	float:right;
	width:230px; /* When using the corners include this must be an even number 
					or IE6 displays the bottom and right corners wrong */
	border: 1px solid #96D6F1;
	background:#D1EBF6;
	padding:8px;
	position:relative;
	margin:5px;
}

.box2
{
	float:left;
	width:230px; /* When using the corners include this must be an even number 
					or IE6 displays the bottom and right corners wrong */
	background:#c5eff2;
	border:1px solid #54bbc1;
	padding:8px;
	position:relative;
	margin:5px;
}

.box2 .tl { background-image: url(/cms/outertemplates/images/default/box2-tl.gif); }
.box2 .tr { background-image: url(/cms/outertemplates/images/default/box2-tr.gif); }
.box2 .bl { background-image: url(/cms/outertemplates/images/default/box2-bl.gif); }
.box2 .br { background-image: url(/cms/outertemplates/images/default/box2-br.gif); }
.box2 .btm { background-image: url(/cms/outertemplates/images/default/box2-btm.gif); }


/* Tabbed links */
ul.tabs
{
	clear:both;
	position:absolute;
	top:-26px;
	right:10px;
	margin:0;
}

ul.tabs li
{
	list-style:none;
	float:left;
	background:#c5eff2 ;
	border-top:1px solid #54bbc1;
	margin:0 2px;
	line-height:26px;
	height:25px;
}
ul.tabs li a
{
	position:relative;
	top:-1px;
	height:26px;
	display:block;
	float:left;
	background: #54bbc1 url(/cms/outertemplates/images/default/green-tab-right.gif) bottom right no-repeat;
	text-decoration:none;
	cursor:pointer;
	color:#FFF;
}
ul.tabs li a:hover, ul.tabs li.active a
{
	background: url(/cms/outertemplates/images/default/green-tab-right.gif) top right no-repeat;
	color:#54bbc1;
}

ul.tabs li a span
{
	height:26px;
	display:block;
	padding:0 10px;
	background: url(/cms/outertemplates/images/default/green-tab-left.gif) bottom left no-repeat;
	float:left;
}
ul.tabs li a:hover span, ul.tabs li.active a span {	background-position:top left; }


/* Reusable classes */
p.left { text-align:left }
p.right { text-align:right; }
.red { color:#F00; }
div.left, input.left { float:left; }
div.right, input.right { float:right; }
img.left { float:left; margin: 5px 5px 5px 0; }
img.right { float:right; margin:5px 0 5px 5px; }
ul.inline li { display:inline; padding:0 4px; }
.left2Col { float:left; width:50%; }
.right2Col { float:right; width:50%; }

p.small, span.small, ul.small, li.small, div.small, a.small, td.small { font-size: 0.9em; }
p.large, span.large, ul.large, li.large, div.large, a.large, td.large { font-size: 1.1em; }
p.error, span.error, ul.error, li.error, div.error { color: #f00; }

.left { text-align: left; }
.right { text-align: right; }
.center { text-align: center; }
.justify { text-align: justify; }
p.indent { margin-left: 25px; }
span.underline { text-decoration: underline; }

div.clear { clear:both; }

/* Clearfix for non ie browsers */
	.clearfix:after {
		content: ".";
		display: block;
		clear: both;
		visibility: hidden;
		line-height: 0;
		height: 0;
	}
	.clearfix { display: inline-block; }
	html[xmlns] .clearfix { display: block; }
/* End of Clearfix */


.weather {width: 80px; float: left; display: inline; border: 1px solid #999; margin: 0 9px 10px 9px; text-align: center;}
.weather p {margin: 0 0 3px 0; font-size: 12px;}

.addThis{background: url('/cms/outertemplates/images/sideboxBannerHeader.gif') no-repeat; padding: 10px; width: 301px; height: 14px;}
.addThis img {margin: 0 120px 0 0; float: left;}

.localWeather{position: relative;}
.polls{}
.parishCouncil{position: relative;}
.parishCouncil .sideBoxesContent {padding:5px;}
.parishCouncil .sideBoxesContent p {padding:5px;}
.busTimes{background: url('/cms/outertemplates/images/bus_times.gif') no-repeat; height: 57px; width: 220px; padding: 0 50px;}
.busTimes h4 a{ color: #ff6b05; line-height: 57px; font-size: 16px; text-align: center; text-decoration: none;}
.feedback{position: relative;}
.theReef a{background: url('/cms/outertemplates/images/the_reef.gif') no-repeat; width: 320px; height: 102px; display:block;}

div.pager {clear:left;}
div.pager span {display:block; text-align:center;}
ul.pager, div.pager ul
{
    margin: 10px auto;
    text-align: center;
    clear: both;
}

ul.pager2
{
    margin: 10px auto;
    text-align: center;
    padding: 10px 0 0 0;
    border-top: 1px solid #ccc;
    clear: both;
}

ul.pager li, ul.pager2 li, div.pager ul li
{
    list-style-type: none;
    display: inline;
    color: #004a00;
    padding: 0 5px;
    font-size: 11px;
}

ul.pager li a, ul.pager2 li a, div.pager ul li a
{
    color: #004a00;
    padding: 0 3px;
}

ul.pager li a:hover, ul.pager2 li a:hover, div.pager ul li a:hover
{
    color: #fff;
    background: #004a00;
}



blockquote.welQuote 
{
    background: url('/cms/outertemplates/images/quotes_01.gif') top left no-repeat;
    padding: 10px 0 0 25px;
    height: 100px;
    font-size: 18px;
    color: #004a00;
    width:310px;
}

blockquote span
{
    background: url('/cms/outertemplates/images/quotes_02.gif') bottom right no-repeat;
    display: block;
    width: 279px;
    padding: 0 0 20px 0;
}



a.rssButton
{
    background: url('/cms/outertemplates/images/default/rss.gif') center no-repeat;
    position: absolute;
    height: 16px;
    width: 17px;
    overflow: hidden;
    text-indent: -999em;
    display: block;
    right: 5px;
    top: 2px;
}

a#smallFont, a#mediumFont, a#largeFont 
{
    display: block; 
    text-align: center; 
    margin: 0 2px; 
    height: 15px;
    width: 12px; 
    background: #dcdcdc; 
    float: left;
}
a#smallFont {font-size: 10px;}
a#mediumFont {font-size: 12px;}
a#largeFont {font-size: 14px;}

body.smallFont {font-size:0.9em;}
body.mediumFont {font-size:1.1em;}
body.largeFont {font-size:1.3em;}

#newsBlock {position: relative; width: 585px;}

a.agendaDownload, a.minutesDownload {display: block; overflow: hidden; margin: 0 0 10px 0; height: 43px; float: left; text-indent: -999em;}
a.agendaDownload { background: url('/cms/outertemplates/images/agenda.gif') center no-repeat; width: 150px;}
a.minutesDownload { background: url('/cms/outertemplates/images/minutes.gif') -1px 0 no-repeat; width: 160px;}

a.cornerLink 
{
    width: 30px; 
    height: 28px; 
    display: block; 
    position: absolute;
    bottom: 0;
    right: 0;
    background: url('/cms/outertemplates/images/sideBoxFeedbackButton.gif') right no-repeat;
    text-indent: -999em;
    overflow: hidden;
}


.iconDownload {background: url('/cms/outertemplates/images/icon_download.gif') no-repeat; 
    position: absolute; 
    top: 10px; 
    right: 10px;
    height: 24px;
    width: 24px;
}

.iconFeedback {background: url('/cms/outertemplates/images/icon_feedback.gif') no-repeat; 
    position: absolute; 
    top: 10px; 
    right: 10px;
    height: 24px;
    width: 24px;
}

.prevNext {height: 16px; line-height: 16px; font-size: 12px; border-bottom: 1px solid #d0d0d0; padding: 0 0 5px 0; margin: 0 0 10px 0;}
.prevNext .prev {float: left;}
.prevNext .more {float: right;}

/* POLL */

.PollContainer 
{
    clear: both;
    padding: 0 15px;
}

.pollBar 
{
    background: #004a00;
    height:12px;
    margin: 0 0 10px 0;
    width:30px;
}




.poll {width: 300px; position: relative;}

.pollQuestion {clear: both; margin:0 0 10px 0;}

.pollResult{clear: both; height:16px; line-height: 16px; width: 300px; margin: 0 0 10px 0;}
.polleBar {background: #e4e4e4; width: 180px; height:16px; line-height: 16px;}
.pollBar1 {background: #e4e4e4; width: 100%; height:16px; line-height: 16px;}
.pollBar2 {background: #004a00; height:16px; line-height: 16px;}
.pollAnswers {width: 120px; position: relative; top: -17px; left: 190px; height:16px; line-height: 16px;}
.pollAnswerString {float: left; text-align: left; font-size: 10px; width:80px;}
.pollAwnswerPercent {width:40px; float: left; text-align: center; font-size: 12px;}

.allPolls {text-align: right;}

/* Carousel */
table#tblScroller {position:relative; font-size:0.8em;}
div.carouselWrap {position:relative; width:585px; background:#FFF; overflow:hidden; padding:25px 0 0;}
div.carouselWrap td.scrollCell div.scrollCell {width:565px; padding:10px; border-bottom:1px solid #d0d0d0; border-top:1px solid #d0d0d0;}

div.carouselWrap div.scrollButtons {
	width:100%; 
	position:absolute; 
	top:0; 
	left:0;
	z-index:10; 
	text-align:center;
	font-size:0.8em;
}
div.carouselWrap div.scrollButtons a {
	float:left; 
	display:inline; 
	text-align:left;
	padding:0;
	margin:0 5px;
	background-position:top;
	background-repeat:no-repeat;
	text-decoration:none;
}
div.carouselWrap div.scrollButtons a:hover {}

div.carouselWrap div.scrollButtons a#scrollPrev {
	float:left;
}
div.carouselWrap div.scrollButtons a#scrollNext {
	float:right;
}

ul#scrollPager {margin:10px 0; width:100%; text-align:center;}
ul#scrollPager li {display:inline; padding:0 5px;}
ul#scrollPager li a {color:#5a6851; text-decoration:none; padding:2px;}
ul#scrollPager li a.active {background:#5a6851; color:#FFF;}

a.newsHeader {display:block; margin:0 0 10px; font-weight:bold; text-decoration:none;}
a.newsHeader:hover {text-decoration:underline;}