body { font-family: Helvetica, Arial, sans-serif; color: #020202; margin-top: 0; font-size: 0.8em;  }

body.body { background-color: #DDD; }

img { border: 0; margin: 0; padding: 0; }
h1, h2, h3, h4 { margin: 0; padding: 0; }
h1 { margin-bottom: 20px; }
p { margin: 0 0 5px 0; padding: 0; }

#container { width: 900px; margin: 10px auto 0 auto; border: 1px solid #EEE; background-color: #FFF; }

.clearfix:after { content: " "; display: block;	clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix { display: inline-block; }
html[xmlns] .clearfix { display: block; }
* html .clearfix { height: 1%; }

#header { font-size: 1em; margin: 20px 20px 0 20px; width: 860px; }
#main { margin: 0px 20px 5px 20px; padding: 0; width: 860px; }

/* widths */
#leftheader, #leftcol { width: 160px; }
#rightheader, #rightcol { }
#midheader, #midcol { width: 500px; padding: 0 5px; }

/* top */
#leftheader { float: left; background-color: #57196C; height: 141px; position: relative; }
#leftheader p { position: absolute; bottom: 5px; left: 5px; margin: 0; padding: 0 3px; }

#midheader { float: left; height: 151px; border-top: 0; border-bottom: 0; }

div.leftcolcontainer { padding-bottom: 7px; float: left; margin-right: 10px; }
div.rightcolcontainer { padding-bottom: 7px; float: right; }
/* end top */

/* content row */
#leftcol { float: left; margin-right: 10px; }
#midcol { float: left; }
#midcol h2 { font-size: 15px; color: #000; }
#midcol p { margin-bottom: 10px; font-size: 1.0em; }

#midcol.double { border-right: 0; width: 777px !important; }

#rightcol { float: right; margin-left: 10px; }
/* end content row */

#mainnav { list-style-type: none; margin: 0; padding: 0; font-size: 1.0em; }
#mainnav li { display: block; background-color: #DCDDDE; margin-bottom: 4px; padding: 8px 20px 8px 8px; position: relative; width: 132px; }
#mainnav li.selected { background-color: #6AB834; }
#mainnav li.subnav { margin: 0; padding: 0; background-color: #FFF; border: 1px solid #FFF; }
#mainnav li a { color: #333; text-decoration: none; }
#mainnav li a:hover { }
#mainnav li.selected a { color: #FFF; }
#mainnav img { position: absolute; top: 5px; right: 5px; margin-bottom: 5px; }

#subnav { list-style-type: none; margin: 0; padding: 0; font-size: 1.1em; }
#subnav li { background-color: #FFF; padding: 6px 8px 10px 8px; margin-bottom: 0; border-bottom: 1px solid #DCDDDE; }
#subnav li a { color: #333; font-weight: normal !important; text-decoration: none !important; }
#subnav li a:hover { color: #999; }
#subnav li.selected { background-color: #FFF; }
#subnav li.selected a { color: #20A50B !important; font-weight: bold !important; text-decoration: none !important; }

#subsubnav { margin: 0; padding: 0; }
#subsubnav li { padding: 0; margin: 0 0 5px 0; border-bottom: 1px solid #DCDDDE; }

#footer { clear: both; text-align: left; font-size: 0.9em; padding-top: 20px; background: url(./images/line-horiz.gif) no-repeat center left; width: 860px; margin: 5px 0 10px 20px; }
#footer ul { list-style-type: none; margin: 0; padding: 0; }
#footer li { float: left; margin-right: 5px; vertical-align: text-bottom; line-height: 22px;}
#footer a { color: #020202; }
#footer a.highlighted { background-color: #FFF; border: 1px solid #999; }
#footer a.textsize { padding: 0 2px; display: block; float: left; height: 24px; }

#small { font-size: 1em; }
#medium { font-size: 1.2em; }
#large { font-size: 1.4em; }

img.imageheader { border-bottom: 3px solid #57196C; padding-bottom: 5px; } 
p.altlink { color: #DA0065; font-weight: bold; }
p.altlink a { color: #DA0065 !important; }

#resources { padding-right: 10px; margin-top: 10px; border-right: 1px solid #B3B3B3; width: 620px; }
#resources div.story { border-bottom: 1px solid #B3B3B3; position: relative; width: 620px; padding: 15px 0 25px 0; }
#resources div.story p { width: 460px;}
#resources div.story img { position: absolute; top:15px; right: 0; }
#resources div.last { border-bottom: 0; }
#resources a { color: #020202; font-weight: bold; }

#singlestory h1 { color: #5D5E60; font-family: georgia, times; font-size: 24px; font-weight: normal; }
#singlestory h2 { color: #5D5E60; font-family: Georgia, Times, "Times New Roman", serif; margin: 0 0 8px 0; padding: 0; font-size: 1.6em; font-weight: normal; }
#singlestory div.standfirst { color: #5D5E60; font-family: georgia, times; font-size: 24px; width: 450px; }
#singlestory p { margin: 0; padding: 0; font-size: 1.1em; margin-bottom: 10px; color: #5D5E60; line-height: 1.4em; }
#singlestory a { text-decoration: none; color: #20A50B; font-weight: bold; }
#singlestory div.story { border-bottom: 1px solid #B3B3B3; width: 100%; padding: 0 0 25px 0; }
#singlestory div.story img { position: absolute; top:15px; right: 0; }
#singlestory div.last { border-bottom: 0; }

#singlestory #story { width: 466px; padding: 0 0 15px 0; position: relative; float: left; }
#singlestory #story p { padding-bottom: 10px; }
#singlestory a.newslink { background: url(./images/icon-link.gif) no-repeat top left; margin: 5px 0; padding: 10px 0 20px 30px; display: block; cursor: pointer; font-size: 1.6em; color: #57196C; }

#singlestory #storyimage { float: left; border-left: 1px solid #B3B3B3; width: 300px; padding-left: 10px; margin-top: 10px; }
#singlestory #storyimage p { float: left; width: 160px; margin-top: 10px; font-weight: bold; color: #1F6A29; }
img.quote { float: right; margin-top: 10px; }

div.box { padding: 0 0 7px 0; margin-bottom: 28px; width: 160px; }
div.box a.main { color: #FFF; font-weight: normal; background: url(/images/arrow-right.gif) no-repeat top right; display: block; padding: 0 0 0 0; margin: 0 20px 0 0; text-decoration: none; }
div.box p { font-size: 12px; }
div.box p.title { color: #FFF; padding: 5px 10px 5px 5px; font-size: 1.3em; text-transform: uppercase; width: 145px; background: url(/images/box-arrow.jpg) no-repeat top right; background-color: #6AB834; }
div.box p.standfirst { background-color: #DCDDDE; margin: 0; padding: 0; }
div.box img { }
div.box h3 { margin-top: 0; }
div.box a { text-decoration: none; color: #20A50B; font-weight: bold; }

div.promo { margin: 25px 0;}
#left1 { margin-top: 25px; } 

/* Image slideshow */

#portfolio { position: relative; width: 480px; clear: both; }

#portfolio div.photographer { position: absolute; top: 14px; right: 0px; font-size: 0.9em; }
#portfolio .panel .overview { position: absolute; bottom: 0; left: 0; padding: 0px; }
#portfolio .panel .details { background:transparent url(/images/text.png) repeat scroll 0 0; left:0; padding:0; position:absolute; top:0; width:480px; color: #FFF; }

#portfolio .panel { position: relative; width: 480px; height: 382px; }
#portfolio .panel .details { position: absolute; top: 0; left: 0; width: 480px; padding: 0; background: url(../images/text.png); }
#portfolio .panel .overview { position: absolute; bottom: 0; left: 0; width: 480px; padding: 15px 0px; background: #FFF; color: #000; }
#portfolio .panel .overview.withButtons { padding-bottom: 30px; }
#portfolio .carouselContainer { margin: 0; padding: 0; list-style-type: none; }

.carouselContainer li { width: 480px; }

.scrollButton { z-index: 9999; position: absolute; display: block; bottom: 5px; height: 27px; line-height: 27px; background: url(../images/arrows.png) no-repeat; }
#scrollLeft { padding-left: 0px; left: 0px; color: #000; background-position: 0 0; font-weight: normal; }
#scrollLeft:hover, #scrollLeft.hover { cursor: pointer; background-position: 0 -27px; }
#scrollRight { padding-right: 0px; right: 0px; color: #000; background-position: right -54px; font-weight: normal; }
#scrollRight:hover, #scrollRight.hover { cursor: pointer; background-position: right -81px; }

#fadebox { width: 480px; height: 319px; margin-bottom: 15px; }