@import "reset.css";
/* Nechells POD Main Screen CSS Document */
/* Produced by James King, LittleTreeSoftware.com */
body {background:#3d454e url(../img/page-bg.gif) top repeat-x; font:62.5% Arial, Helvetica, sans-serif; color:#666;}

a {color:#309bcb; text-decoration:none;}
a:hover, a:active, a:focus {text-decoration:underline; color:#6b8c00;}

.hidden, hr {font-size:0 !important; position:absolute !important; height:0 !important; left:-9999px !important;}
.clear:after, .row:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}

p, li, dt, dd, label, input, textarea, legend {font-size:1.2em;}
li a, li p, li p a, p a, dt a, dd a, label input, label textarea, h1 a, h2 a, h3 a, h4 a, h5 a, li li, p label, li label, li input, .article p a, .article li a, li dt, li dd {font-size:1em;}

input, select, textarea {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#000;}

.wrap {width:960px; margin:0 auto;}
.header {height:100px; position:relative; background:url(../img/header-bg.jpg) no-repeat;}
.header p.logo {height:43px; width:100px; top:30px; left:40px; position:absolute;}
.header p.strapline {width:400px; height:35px; background:#ccc; right:40px; top:35px; position:absolute; text-indent:-9999px; background:url(../img/strapline.png) no-repeat;}

.navigation * {z-index:3;}
.navigation {background:#010101 url(../img/navigation-bg.gif) top repeat-x;}
.navigation li {float:left; position: relative;}
.navigation li a {display:block; color:#bcd9ea; text-decoration:none; padding:.5em .8em .6em .8em; border-right:1px solid #010101;}
.navigation li a:hover, .navigation li a:focus, .navigation li a:active {background:#394451 url(../img/navigation-hover-bg.gif) top repeat-x; color:#fff;}
.navigation li.current {background:#1c8fc3 url(../img/navigation-selected-bg.gif) top repeat-x;}
.navigation li.current a {background:url(../img/navigation-selected-arrow.gif) bottom center no-repeat; color:#fff;}

.navigation ul li ul {display: none; background:#1c2228; z-index:3; width:170px; position: absolute; top: 100%; left: 0; text-align:left; margin:0; float:left;}
.navigation ul li:hover ul, .navigation ul li.over ul {display: block;}
.navigation ul li:hover ul li ul, .navigation ul li.over ul li ul {display: none;}
.navigation ul li ul li a, .navigation ul li.current ul li a {background:none; color:#bcd9ea; height:auto; width:150px; text-decoration:none; border-right:0;  border-bottom:1px solid #010101;}
.navigation ul li.current ul li.current a {color:#fff;}
.navigation ul li ul li a:hover, .navigation ul li ul li a:focus, .navigation ul li ul li a:active {}

.navigation ul li ul li ul {display:none; float:none; position:absolute; top:0; left:100%;}
.navigation ul li ul li:hover ul, .navigation ul li ul li.over ul {display:block;}

.content {background:#fff url(../img/rainbow-grad.jpg) bottom no-repeat; padding-bottom:4px;}
.content p {padding:0.5em 0; line-height:1.5em;}
.content ol {margin:1em 3em; list-style-type:decimal;}
.content ul {margin:1em 3em; list-style:disc;}
.content ul li, .content ol li {padding-bottom:.3em; line-height:1.6em;}

.content .event-dates ul {margin:2em 0 0; list-style:none;}
.content .event-dates ul li {background:#ddd; padding:.5em .8em; margin-bottom:1px;}
.content .event-dates ul li.alt {background:#eee;}
.content .event-dates ul li span {display:block; float:left;}
.content .event-dates ul li span.date-details {width:400px;}
.content .event-dates ul li span.location {float:right; color:#97C10E; font-weight:bold; text-align:right; width:200px;}

.col {float:left; display:inline; padding:30px;}
.col .col {padding:10px;}
.one {width:180px; min-height:230px; background:url(../img/col-one-bg.gif) top left no-repeat;}
.two {width:420px;}
.three {width:660px;}
.four {width:420px;}

.two img {padding:2px; border:2px solid #A7D7E9; margin:1em 1em 1em 0;}
.three img {padding:2px; border:2px solid #A7D7E9; margin:1em 1em 1em 0;}

h1 {color:#309bcb; font-size:3em; font-weight:normal; margin-bottom:0.25em; letter-spacing:-.05em;}
.two h2, .three h2 {color:#97C10E; font-size:2em; font-weight:normal; margin-bottom:0.25em;}
h2 a {color:#000;}
h2 a:hover, h2 a:active, h2 a:focus {color:#060; text-decoration:none; background:#f5f5f5;}

.one h3 {font-weight:bold; color:#000; font-size:1.3em; padding-bottom:0.6em; border-bottom:2px solid #a7d7e9; margin-bottom:0.8em;}
.two h3, .three h3 {font-weight:bold; color:#8EBA00; font-size:1.4em; margin:0.8em 0;}
.calendar h3, #calendar h3 {border-bottom-color:#97c10e;}
h4 {font-size:1.2em; font-weight:bold; margin-bottom:0.3em; line-height:1.6em;}
.one h4 a {display:block;}
.calendar h4 a {color:#8eba00;}

.content .two .highlight {font-size:1.8em; font-weight:bold; line-height:1.4em;}

#map {width:656px; height:400px; border:2px solid #A7D7E9;}
.map-content {height:100px; overflow:hidden;}

.footer {padding:0.5em 0;}
.footer ul li {display:block; float:left; font-size:1.2em; margin-right:1em;}
.footer ul li.nechells-plus {width:244px; height:39px; text-indent:-9999px; background:url(../img/logo-empowering-learning.gif) top left;}
.footer ul li.birmingham-city-council {width:164px; height:39px; text-indent:-9999px; background:url(../img/logo-birmingham-council.gif) bottom left no-repeat;}
.footer ul li.littletree {float:right; margin:1em 0 0 1em; color:#7e8996;}
.footer ul li.littletree a {color:#7e8996;}

.content .cal-navigation {display:none;}
.hasJs .content ul.cal-navigation {display:block; margin:1em 0; list-style:none;}
.hasJs .content ul.cal-navigation li {width:50%; float:left; padding:0;}
.hasJs .content ul.cal-navigation li a {padding:.6em 0; color:#97C10E; display:block; text-align:left;}
.hasJs .content ul.cal-navigation li a:hover, .hasJs .content ul.cal-navigation li a:focus,
.hasJs .content ul.cal-navigation li a:active {background:#fff; text-decoration:none;}
.hasJs .content ul.cal-navigation li a.cal-next {text-align:right;}

.content #calendar-holder {position:relative;}
.content #calendar-holder .cal-loader {position:absolute; left:0; top:0; width:100%; height:100%;}
.content #calendar-holder .cal-loader span.bg {position:absolute; left:0; top:0; width:100%; height:100%; background:#fff; opacity:0.8;}
.content #calendar-holder .cal-loader span.text {position:absolute; width:32px; height:32px; left:50%; top:50%; margin:-25px 0 0 -25px; background:#1f2228; padding:9px; text-align:center; opacity:1; color:#fff; display:block; -moz-border-radius-topleft:4px; -moz-border-radius:4px; -webkit-border-radius:4px;}

.content .calendar-small {text-align:center;}
.content .calendar-small table {margin:3px auto;}
.content .calendar-small table th {padding:.4em 0 1em 0;}
.content .calendar-small table th, .calendar-small table td {color:#555;}
.content .calendar-small table td span, .calendar-small table td a {background:#ddd; font-size:12px; display:block; margin:0 1px 1px 0; text-decoration:none; width:24px; padding:.5em 0 .5em 0;}
.content .calendar-small table td.prev_month span, .calendar-small table td.prev_month a,
.content .calendar-small table td.next_month span, .calendar-small table td.next_month a{background:#f5f5f5; color:#555;}
.content .calendar-small table td a {color:#fff; background:#97C10E;}
.content .calendar-small table td a:hover, .calendar-small table td a:focus, .calendar-small table td a:active {background:#fff; color:#97C10E;}


/* Blog */
.blog-post {border-bottom:1px solid #eee; padding:1.5em 0;}
.blog-post .blog-date {width:90px; float:left;}
.blog-post .blog-date .date {float:left; padding:0; margin:0; background:url(../img/date-icon.gif) top left no-repeat;}
.blog-post .blog-date .date .month {display:block; width:70px; color:#fff; text-align:center; text-transform:uppercase; padding:.3em 0;}
.blog-post .blog-date .date .day {display:block; width:70px; color:#333; text-align:center; font-size:1.8em; padding:.7em 0;}
.blog-post .blog-summary {width:430px; float:left;}
.blog-post .blog-summary h2 {font-size:1.4em; padding-top:0;}
.blog-post .blog-summary img {float:left;}
.blog-post .retweet-button {width:80px; float:right;}
.blog-header-image img {margin-bottom:1em;}
.add-comment {background-image:url(../img/button-comment-add.gif); margin:2em 0;}
.blog-post .blog-summary .add-comment {margin:0;}

/* BLOG */
.comment img {float:left;}
.comment p {float:right; width:300px;}

.categories li {line-height:1em;}
.categories li ul.children {margin:.8em 0 .5em 2em;}

.blog-info {margin:0 0 1em 0; padding:.4em .7em; clear:both; background:#f2f6f9; border:1px solid #e4ebf0;}

.social-bookmarks {margin:0 0 1em 0; padding:1em; clear:both; background:#f2f6f9; border:1px solid #e4ebf0;}
.social-bookmarks dt {font-weight:bold; padding-bottom:.7em; line-height:normal; margin:0;}
.social-bookmarks dd {float:left; margin:.3em .6em .3em 0; font-size:1.2em}
.social-bookmarks dd a {font-size:1em; position:relative; padding-left:20px; display:block; float:left;}
.social-bookmarks dd span {background-image:url(../img/icons-social-bookmarks.gif); width:16px; height:16px; position:absolute; left:0; cursor:pointer;}
.social-bookmarks dd#diggit span {background-position:0 -16px;}
.social-bookmarks dd#facebook span {background-position:0 -48px;}
.social-bookmarks dd#reddit span {background-position:0 -32px;}
.social-bookmarks dd#stumbleupon {margin-right:0;}
.social-bookmarks dd#stumbleupon span {background-position:0 -64px;}

.form form {margin-bottom:4em;}
.form {padding:1em 0;}
.form h3 {font-size:1.8em; font-weight:normal; color:#00a8ff; border-bottom:1px dotted #dedede; margin-bottom:0.5em;}
.form fieldset {border:0; margin:0 0 1em 0; padding:1em;}
.form fieldset legend {padding:0 0.5em; display:none;}
.form .row {clear:both; display:block; margin:0.5em 0; padding:0.25em 0;}
.form .row label {float:left; line-height:1.25em; margin:0 8px 0 0; padding:6px 0; text-align:right; width:150px;}
.form .row input.text, .form .row input.text-small, .form .row textarea {border:1px solid #ccc; color:#403f41; padding:5px; width:350px; margin-right:5px;}
.form .row input.text-small {width:100px;}
.form .row select.select, .form .row .select select {border:1px solid #ccc; color:#403f41; padding:5px; width:350px;}
.form .row textarea {height:5em;}
.form .row input.text:focus, .form .row textarea:focus {border-color:#309bcb;}
.form .instruction {color:#888; font-size:1em; line-height:1.35em; margin:0.2em 0 0; padding:0.5em 156px 0;}
.form .error {color:#00a8ff; font-size:1em; line-height:1.35em; margin:0.2em 0 0; padding:0.5em 0;}
.form .error-message {color:#00a8ff; font-size:1em; line-height:1.35em; margin:0.2em 0 0; padding:0.5em 156px 0;}
.form a {text-decoration:underline; color:#309bcb;}
.form a:hover, .form a:active, .form a:focus {text-decoration:none;}
.form .buttons {padding-left:158px;}
.form .button {padding:0.3em 9px 0.3em; background-color:#309bcb; border-color:#309bcb; border-style:solid; border-width:1px; color:#fff; cursor:pointer; margin-right:3px; font-weight:bold;}
.form .message {color:#ea0e7d; padding-bottom:1em;}

.message {font-size:1.2em; padding:1em; margin-bottom:1em; background:#fffaea; border:1px solid #eccd6a;}

/* Blog Related */
.post-header h1 {width:500px; float:left;}
.post-header .rss-link {width:24px; float:right;}
.post-header .rss-link a {width:24px; height:24px; display:block; background-image:url(/theme/seouk/img/feed-24x24.png); text-indent:-9999px;}

ul.comments {margin:0 0 1em 0; list-style:none;}
ul.comments li {margin:0 0 1em 0; padding:1em; border:1px solid #ddd; background:#f5f5f5;}
ul.comments li p {padding:0.3em 0;}
ul.comments li h3 {color:#333; font-size:1.4em; letter-spacing:-.05em;}

.link-icon {float:left; background:#fff; border:1px solid #a7d7e9; margin:0 2px; position:relative; display:block; color:#309bcb !important; padding:9px 1em 9px 35px; width:auto; text-decoration:none;}
.link-icon span {background-image:url(/theme/seouk/img/icons.png); background-repeat:no-repeat; height:24px; width:24px; display:block; position:absolute; left:5px; top:5px;}
a.article span {background-position:0 -24px;}
.link-icon:hover, .link-icon:focus, .link-icon:active {background:#a7d7e9; text-decoration:none;}

.content ul.post-navigator {margin:1em 0; list-style:none;}
.content ul.post-navigator li {float:left; padding:1em;}
.content ul.post-navigator li .disabled {display:none;}
.content p.post-date {padding:.3em 0; color:#999; border-bottom:1px dotted #999;}
.content .one p.post-date {padding:0; color:#999; border-bottom:none;}

.image-button {display:block; width:170px; height:27px; text-indent:-9999px; background-position:top left; background-repeat:no-repeat;}
.blog-posts {background-image:url(../img/button-blog-all.gif);}
.all-events {background-image:url(../img/button-events-all.gif); margin-bottom:3em;}

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 10000; text-align: center; line-height: 0;}
#lightbox img { width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../img/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../img/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }



.content .three ul.events-list {list-style:none; margin:2em 0; border-top:2px solid #DCE7C5; border-bottom:1px solid #DCE7C5;}
.content .three ul.events-list li {line-height:normal; border-bottom:1px solid #DCE7C5; background:#EEF2E1; padding-bottom:0;}
.content .three ul.events-list li a {display:block; text-decoration:none; padding:.6em 10px;}
.content .three ul.events-list li a .event-name {float:left; width:190px; color:#97C10E; font-weight:bold;}
.content .three ul.events-list li a .event-date {float:right; font-size:.9em; width:220px; color:#555; text-align:right;}
.content .three ul.events-list li a:hover, .content .two ul.events-list li a:focus, .content .two ul.events-list li a:active {background:#DCE7C5;}

.content .three ul.event-nav {list-style:none; margin:3em 0 0 0;}
.content .three ul.event-nav li {width:150px; margin-right:1px; float:left;}
.content .three ul.event-nav li a {background:#EEF2E1; color:#555; display:block; padding:.6em 1em; text-decoration:none;}
.content .three ul.event-nav li.next a {text-align:right;}
.content .three ul.event-nav li a:hover, .content .two ul.event-nav li a:focus, .content .two ul.event-nav li a:active {background:#DCE7C5;}



/* GALLERIES */
/* Galleria */	
.content .three ul.gallery_demo {list-style:none; margin:1em 0;}
.content .three ul.gallery_demo li {height:50px; margin: 0 5px 5px 0; background:#fff; float:left; border:1px solid #739E3D; padding:2px;}
.content .three ul.gallery_demo li img {height:50px; margin:0 !important; padding:0; border:0; cursor:pointer;}
.content .three .galleria_container {width:430px;}
.content .three .galleria_container img {margin:0 0 1em;}
.content .three .galleria_container .caption {display:none !important;}
/* Lightbox */
.content .three ul.lightbox-gallery {list-style:none; margin:1em 0;}
.content .three ul.lightbox-gallery li {width:50px; height:50px; margin: 0 5px 0 0; background:#fff; float:left; border:2px solid #A7D7E9; padding:2px;}
.content .three ul.lightbox-gallery li img {width:50px; height:50px; margin:0; padding:0; border:0;}

#jquery-overlay {position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px;}
#jquery-lightbox {position: absolute; top: 0; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#jquery-lightbox a img {border: none; }
#lightbox-container-image-box {position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto;}
#lightbox-container-image {padding: 10px; }
#lightbox-loading {position: absolute; top: 40%; width: 100%; text-align: center; line-height: 0;}
#lightbox-loading a img {text-align:center; margin:0 auto;}
#lightbox-nav {position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10;}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a {outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext { width: 49%; height: 100%; zoom: 1; display: block;}
#lightbox-nav-btnPrev {left: 0; float: left;}
#lightbox-nav-btnNext {right: 0; float: right;}
#lightbox-container-image-data-box {background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%; padding: 0 10px 10px 10px; font-family:Arial, Helvetica, sans-serif; font-size:12px;}
#lightbox-container-image-data {padding: 0; color:#666; }
#lightbox-container-image-data #lightbox-image-details {  width: 70%;  float: left;  text-align: left; }	
#lightbox-image-details-caption {font-weight: bold; }
#lightbox-image-details-currentNumber {display: block;  clear: left;}			
#lightbox-secNav-btnClose {width:66px; float: right;}

#main_image{margin:0 auto 60px auto;height:438px;width:700px;background:black;}
#main_image img{margin-bottom:10px;} 
.nav{padding-top:15px;clear:both;font:80% 'helvetica neue',sans-serif;letter-spacing:3px;text-transform:uppercase;}
	
.info{text-align:left;width:700px;margin:30px auto;border-top:1px dotted #221;padding-top:30px;}
.info p{margin-top:1.6em;}


	
/* SIFR */
.sIFR-flash {visibility: visible !important; margin: 0; padding: 0;}
.sIFR-replaced, .sIFR-ignore {visibility: visible !important;}
.sIFR-alternate {position: absolute; left: 0; top: 0; width: 0; height: 0; display: block; overflow: hidden;}
.sIFR-replaced div.sIFR-fixfocus {margin: 0pt; padding: 0pt; overflow: auto; letter-spacing: 0px; float: none;}