/* 
'TAKING PART IN THE ARTS' STYLE SHEET: MAIN STYLES (CIRCLES)
Style sheet by Rupert Sliwa
[ www.sliwacreative.com ]
----------------------------------------------- */

body {background-color:#fff; color:#333; margin:0; text-align:center; font-family:Arial, Helvetica, sans-serif}
ul {list-style-type:disc; margin-top:5px; padding-left:10px; margin-left:10px}
ol {list-style-type:decimal; margin-top:5px; padding-left:10px; margin-left:10px}
table, tr, td {margin:0; padding:0; border:0}
img {border:0}


/* General links
----------------------------------------------- */

a, a:link, a:visited {color:#333; text-decoration:underline; font-weight:normal}
a:hover, a:active {color:#000; text-decoration:underline; font-weight:normal}

a.aceaction, a.aceaction:link, a.aceaction:visited {color:#990; text-decoration:underline; font-weight:bold}
a.aceaction:hover, a.aceaction:active {color:#cc0; text-decoration:underline; font-weight:bold}

a.casestudies, a.casestudies:link, a.casestudies:visited {color:#699; text-decoration:underline; font-weight:bold}
a.casestudies:hover, a.casestudies:active {color:#9cc; text-decoration:underline; font-weight:bold}

a.factsfigures, a.factsfigures:link, a.factsfigures:visited {color:#f09; text-decoration:underline; font-weight:bold}
a.factsfigures:hover, a.factsfigures:active {color:#f39; text-decoration:underline; font-weight:bold}

a.guidance, a.guidance:link, a.guidance:visited {color:#636; text-decoration:underline; font-weight:bold}
a.guidance:hover, a.guidance:active {color:#939; text-decoration:underline; font-weight:bold}

a.hlink, a.hlink:link, a.hlink:visited {text-decoration:none; font-weight:bold; color:#333}
a.hlink:hover, a.hlink:active {text-decoration:underline; font-weight:bold; color:#333}

a.heavy {font-weight:bold}

a.access, a.access:link, a.access:visited {display:none}
a.access:hover, a.access:active {display:none}


/* Framed version for Facts & figures section
----------------------------------------------- */

#topframe {background:#fff url(../images/topframe_bg.gif) top repeat-x}
#topframe #aceContent {margin:0; border:0; padding:0; width:100%; position:absolute; top:140px; left:0; height:75%}

#topframeMasthead {margin:10px 0 20px 6px; width:420px; float:left; text-align:left}

#topframeMasthead .logo {float:left}
#topframeMasthead .logotype {float:left; margin:26px 0 0 12px; color:#333}
#topframeMasthead .logotype a.heading {font-weight:bold; font-size:150%; color:#333; text-decoration:none; letter-spacing:-1px}


/* Masthead and Search box
----------------------------------------------- */

#masthead {margin:30px 0 30px 10px; width:420px; float:left; text-align:left}

#masthead .logo {float:left}
#masthead .logotype {float:left; margin:14px 0 0 20px; font:bold 200% Arial, Helvetica, sans-serif; color:#333; letter-spacing:-1px}
#masthead .logotype a {font-weight:bold; color:#333; text-decoration:none}

#searchBox {width:438px; margin:0 6px 0 26px; background:#fff url(../images/search_bg.gif) top right no-repeat; float:right; height:105px}
#searchBox .padding, #searchExtension .padding {padding:20px 34px 0 34px}

#searchBox .searchField {border:1px solid #666; border-right:0; height:16px; padding:6px; background:#fff url(../images/search_box.gif) top left no-repeat; font:90% Arial, Helvetica, sans-serif; width:192px; display:block; float:left}
#searchBox .searchSend {float:left}

#searchBox .advanced {float:left; padding:15px 0 0 10px}
#searchBox .advanced a {color:#333}

#searchExtension {width:438px; margin:0 6px 0 26px; background:#fff url(../images/search_bg_ext.gif) top right repeat-y; float:right}


/* Search pop-up
----------------------------------------------- */

#searchPopup {width:392px; display:none; position:absolute; top:78px; left:50%; margin-left:35px; z-index:1}

#searchPopup .top {height:41px; background:transparent url(../images/searchpopup_bg_top.png) top left no-repeat}
#searchPopup .mid {background:transparent url(../images/searchpopup_bg_mid.png) left repeat-y; padding:0 22px 5px 32px}
#searchPopup .bot {height:23px; background:transparent url(../images/searchpopup_bg_bot.png) top left no-repeat}


/* Navigation
----------------------------------------------- */

#navCircles table {width:204px; border-collapse:collapse; text-align:left; table-layout:fixed}
#navCircles table tr .spacer {height:8px !important; background:none}
#navCircles .holder {width:86px; margin-left:5px; text-align:center}
#navCircles table tr td {font-size:100%; width:104px; height:96px; background:#fff url(../images/circle_empty.gif) top left no-repeat; vertical-align:middle}

#navCircles a, #navCircles a:link, #navCircles a:visited {display:block; font-weight:bold; font-size:80%; text-decoration:none; line-height:16px}
#navCircles a:hover, #navCircles a:active {display:block; font-weight:bold; font-size:80%; text-decoration:underline; line-height:16px}

#navCircles .selected a, #navCircles .selected a:link, #navCircles .selected a:visited {display:block; color:#fff; font-weight:bold; font-size:80%; text-decoration:none; line-height:16px}
#navCircles .selected a:hover, #navCircles .selected a:active {display:block; color:#fff; font-weight:bold; font-size:80%; text-decoration:underline; line-height:16px}

.otherSection {width:106px; height:105px; margin-left:-5px; margin-right:3px; float:left}
.otherSection h4 {display:none}
.otherSection a {display:block; width:100%; height:100%}
.otherSectionText {float:left; width:96px}
.aceaction {background:#fff url(../images/sticker_aceaction_small.gif) top left no-repeat}
.casestudies {background:#fff url(../images/sticker_casestudies_small.gif) top left no-repeat}
.factsfigures {background:#fff url(../images/sticker_factsfigures_small.gif) top left no-repeat}
.guidance {background:#fff url(../images/sticker_guidance_small.gif) top left no-repeat}


/* Headings
----------------------------------------------- */

h1 {font:bold 180% Arial, Helvetica, sans-serif; color:#333; margin:0; padding-bottom:15px; letter-spacing:-1px}
h2 {font:bold 150% Arial, Helvetica, sans-serif; color:#333; margin:0; padding-bottom:10px; letter-spacing:-1px}
h3 {font:bold 110%/120% Arial, Helvetica, sans-serif; color:#333; margin:0; padding-bottom:20px}
h4 {font:bold 85%/130% Arial, Helvetica, sans-serif; color:#333; margin:0; padding:5px 0 5px 0}

#contentStory h4 {font:110% Arial, Helvetica, sans-serif; color:#333; margin:0; padding:5px 0 10px 0}

.crumbTrail {color:#999 !important; padding-bottom:10px !important}
.crumbOne {color:#999 !important}
.crumbTwo {color:#666 !important}


/* Text
----------------------------------------------- */

p {font:80% Arial, Helvetica, sans-serif; line-height:20px; margin:0 0 15px 0; padding:0; display:block}
.text {font:80% Arial, Helvetica, sans-serif; line-height:20px}
.textSmall {font:75% Arial, Helvetica, sans-serif; line-height:18px}
.textSmallprint {font:70% Arial, Helvetica, sans-serif; line-height:16px; margin-top:5px}
.textLarge {font:90% Arial, Helvetica, sans-serif; line-height:24px}
.textFooter {font:75% Arial, Helvetica, sans-serif; color:#666}

.imgCaption {font:70% Arial, Helvetica, sans-serif; color:#999; width:326px; text-align:left}

.grey {color:#999}

/* Homepage only
----------------------------------------------- */

.introText {clear:both; width:555px; text-align:left; margin-left:10px}

#homeColumns h2 {display:none}
#homeColumns .holder {width:86px; margin-left:5px; text-align:center}

#homeColumns table {margin-left:10px; width:210px; border-collapse:collapse; text-align:left; table-layout:fixed}
#homeColumns table tr .spacer {height:8px !important; background:none}
#homeColumns table tr .empty {opacity:0.2; filter:alpha(opacity=20)}

#homeColumns a, #homeColumns a:link, #homeColumns a:visited {display:block; color:#fff; font-weight:bold; font-size:80%; text-decoration:none; line-height:16px}
#homeColumns a:hover, #homeColumns a:active {display:block; color:#fff; font-weight:bold; font-size:80%; text-decoration:underline; line-height:16px}

#homeColumns a.access, #homeColumns a.access:link, #homeColumns a.access:visited {display:none}
#homeColumns a.access:hover, #homeColumns a.access:active {display:none}

#homeColumns .sticker a {display:block; width:100%; height:100%; font-size:100%}

#homeColOne {width:220px; text-align:left; margin-right:10px; float:left}
#homeColOne .sticker {background:#f09 url(../images/sticker_factsfigures_large.jpg) top left no-repeat; height:218px}
#homeColOne table tr td {font-size:100%; width:105px; height:96px; background:#fff url(../images/circle_factsfigures.gif) top left no-repeat; vertical-align:middle}

#homeColTwo {width:220px; text-align:left; margin-right:10px; float:left}
#homeColTwo .sticker {background:#9cc url(../images/sticker_casestudies_large.jpg) top left no-repeat; height:218px}
#homeColTwo table tr td {font-size:100%; width:105px; height:96px; background:#fff url(../images/circle_casestudies.gif) top left no-repeat; vertical-align:middle}

#homeColThree {width:220px; text-align:left; margin-right:10px; float:left}
#homeColThree .sticker {background:#636 url(../images/sticker_guidance_large.jpg) top left no-repeat; height:218px}
#homeColThree table tr td {font-size:100%; width:105px; height:96px; background:#fff url(../images/circle_guidance.gif) top left no-repeat; vertical-align:middle}

#homeColFour {width:220px; text-align:left; float:left}
#homeColFour .sticker {background:#cc0 url(../images/sticker_aceaction_large.jpg) top left no-repeat; height:218px}
#homeColFour table tr td {font-size:100%; width:105px; height:96px; background:#fff url(../images/circle_aceaction.gif) top left no-repeat; vertical-align:middle}


/* Advanced search page
----------------------------------------------- */

#advSearchColumns {text-align:left}

#advSearchColumns .oneCol {width:200px; margin:0 20px 0 10px; float:left}
#advSearchColumns .oneColLast {width:200px; margin:0 0 0 10px; float:left}

#advSearchColumns .twoColLeft {width:430px; margin:0 0 0 10px; float:left}
#advSearchColumns .twoColRight {width:430px; margin:0 0 0 30px; float:left}

#advSearchColumns .twoColLeft .oneColLeft, #advSearchColumns .twoColRight .oneColLeft {width:200px; margin:0 30px 0 0; float:left}
#advSearchColumns .twoColLeft .oneColRight, #advSearchColumns .twoColRight .oneColRight {width:200px; margin:0; float:left}

#advSearchColumns .all {background-color:#eee}


/* General layout
----------------------------------------------- */

.clearboth {clear:both; height:1px}
.gap {height:20px}
.gapTen {height:10px}

#container {margin:0 auto; width:910px; text-align:left}

#mainColumn {text-align:left; float:left; width:660px; margin:10px 0 0 10px}
#rightColumn {text-align:left; float:left; margin:10px 0 0 15px; padding-left:14px; border-left:1px dotted #999; width:214px; width/* */:/**/200px; width:/**/200px}

p.page_navigation {
	text-align: right;
	margin: 0px 0px 10px;
	padding: 0px 10px 0px 0px;
}
p.page_navigation a {font-size: 11px; font-weight: bold; text-decoration: none; background: none; padding: 1px;}
p.page_navigation a:hover {background: #eee;}

.floatLeft {float:left}
.floatRight {float:right}

.arrow {padding-right:22px; margin-right:8px; background:#fff url(../images/icon_arrow.gif) top right no-repeat}

ul .web {list-style-type:none; background:transparent url(../images/icon_website.gif) top left no-repeat; padding:1px 0 0 25px; margin-left:-20px}
ul .pdf {list-style-type:none; background:transparent url(../images/icon_pdf.gif) top left no-repeat; padding:3px 0 0 25px; margin-left:-20px}
ul .word {list-style-type:none; background:transparent url(../images/icon_word.gif) top left no-repeat; padding:3px 0 0 25px; margin-left:-20px}
ul .powerpoint {list-style-type:none; background:transparent url(../images/icon_powerpoint.gif) top left no-repeat; padding:3px 0 0 25px; margin-left:-20px}
ul .media {list-style-type:none; background:transparent url(../images/icon_media.gif) top left no-repeat; padding:3px 0 0 25px; margin-left:-20px}
ul .excel {list-style-type:none; background:transparent url(../images/icon_excel.gif) top left no-repeat; padding:3px 0 0 25px; margin-left:-20px}
ul .pub {list-style-type:none; background:transparent url(../images/icon_publication.gif) top left no-repeat; padding:3px 0 0 25px; margin-left:-20px}

.bullet {font:80% Arial, Helvetica, sans-serif; background:#fff url(../images/bullet_arrow.gif) no-repeat; padding-left:14px; display:block; margin-bottom:10px}
.bulletWeb {background:transparent url(../images/icon_website_bullet.gif) no-repeat; padding-left:25px; margin-top:5px; display:block}

.ruler {padding-bottom:20px; border-top:#ccc 1px solid}

.imageLeft {float:left; margin:5px 16px 5px 0}
.imageRight {float:right; margin:5px 0 5px 16px}
.imageFull {width:660px; margin:5px 0 10px 0}
.caption {width:326px; padding-top:5px; font:70% Arial, Helvetica, sans-serif; color:#666; text-align:left}
.imageRight .caption {text-align:right}
.imageFull .caption {width:660px}

.listCircle {font-size:80%; font-weight:bold; width:96px; height:96px; padding-top:24px; margin-left:8px; float:left; color:#fff; text-align:center}
.listCircle ul {margin-bottom:0; padding-bottom:0}
.listCircle ul li {padding:3px 0 0 0; margin:0 0 5px 0}
.listText {width:222px; float:left; margin-left:8px}
.listText ul {list-style-type:none; margin:0; padding:0}
.listText ul li {margin-bottom:8px}
.listText hr {display:none}
.noMargin {margin:0}
.publication {text-align:left; padding-left:16px !important; margin-top:-5px !important}

.infoBox {font-size:90%; margin-bottom:20px; padding:12px; width:658px; width/* */:/**/634px; width:/**/634px}
.infoBox .label {padding-bottom:5px; font-weight:bold; text-align:right}
.infoBox .info {padding:0 0 5px 20px; text-align:left}
#contentStory .infoBox {background:none; border:1px solid #ccc}
.infoBox ul li {padding-bottom:8px}

#contentStory .backTop {clear:both; font-size:75%}

p.error {font-weight: bold; color: #990000; background: #FFECEC; border: 1px dotted #990000; padding: 4px; margin-top: 8px; margin-bottom: 10px;}

/* Formatting for stories within the contentStory section
---------------------------------------------------------- */
#contentStory ul {font:80% Arial, Helvetica, sans-serif; line-height:20px; margin:0; padding:10 0 20 30; display:block}
#contentStory li {margin: 4px 4px 4px 12px; padding: 0px; list-style: disc outside;}

/* Forms
----------------------------------------------- */

form {margin:0}

.dropDown {font:80% Arial, Helvetica, sans-serif; padding:0; display:block; width:140px; color:#666}
.wider {width:200px}

.formLabel {font:bold 75% Arial, Helvetica, sans-serif; margin:5px 10px 0 5px; width:150px; display:block; float:left; text-align:right}
.formPad {padding:5px; margin-bottom:2px; background-color:#e5e5e5; clear:both}
.formField {border:1px solid #999; background:#fff; margin-top:4px; font:80% Arial, Helvetica, sans-serif; width:250px; display:block; float:left}
.formArea {border:1px solid #999; background:#fff; margin-top:4px; font:80% Arial, Helvetica, sans-serif; width:250px; display:block}
.formSend {border:#999 1px solid; background:#f09; color:#fff; padding:1px; font:bold 80% Arial, Helvetica, sans-serif; float:left; margin-right:10px}


/* Contact Form
----------------------------------------------- */

table.contact th {font-size: 10px; font-weight: bold; text-align: right; vertical-align: top; padding-top: 5px;}
table.contact td {font: 11px Arial, Helvetica, sans-serif; width: 300px;}
table.contact td input, table.contact td textarea {font: Arial, Helvetica, sans-serif; border: 1px solid #CCCCCC; width: 300px;}
table.contact td input.button {width: auto;}

/* Footer
----------------------------------------------- */

#footer {text-align:right; margin:40px 10px 30px 10px; width:890px}
#footer a, #footer a:link {color:#666; text-decoration:underline; font-weight:normal}
#footer a:hover, #footer a:active {color:#000; text-decoration:underline; font-weight:normal; background-color:#eee}
