/* CSS Document */
html { font-size:100% }
body { font-size:62.5%; 
	background:#5b6ca6 url(images/siteImages/background-gradient.jpg) -50px 0 repeat-x; 
	text-align:center; padding:0; margin:0; 
	font-family:Verdana, Arial, Helvetica, sans-serif; position:relative; }
/* multiple backgrounds and gradients experiment 
body {
	background-image:url(images/siteImages/background-gradient-clear.png), -moz-linear-gradient(top, #000, #5b6ca6 498px);
	background-image:url(images/siteImages/background-gradient-clear.png), -webkit-gradient(linear, center top, center bottom, from(#000), color-stop(45%, #5b6ca6));
	background-repeat:repeat-x, repeat-x;
	background-position:-50px top, 0 top;
}*/


h1, h2, h3, h4, h5 {color:#5b6ca6; padding:0; margin:0.5em 0; text-align:left }
h1 {font-size:1.7em; margin-top:0; }
h2 {font-size:1.5em; }
h3 {font-size:1.3em; }
h4 {font-size:1.1em; }
h5 {font-size:1em; }
img { padding:0; margin:0; border:none; }
a { color:#885ba6; text-decoration:none; }
a:hover, a:focus, a:active { text-decoration:underline; }

p { padding:0; margin:0 0.6em 0.8em 2px; }
p a, li a { color:#885ba6; }

hr { color:#beaacc; background-color:#beaacc; height:2px; border:none; margin:6px 0 }

input, textarea { border:2px solid #beaacc; background-color:#FFF; color:#5B6CA6; font-size:1em; width:95%; margin-bottom:0.4em; }
textarea { font-family:Verdana, Arial, Helvetica, sans-serif; }
input.button, button { background-color:#FFFFFF; color:#885ba6; border:none; margin-top:0.5em; }

.bulletList li { margin-bottom:4px }

div#container { color:#5b6ca6; font-size:1.4em; margin:0 auto; text-align:left; width:842px; }

div#header { position:relative; margin-bottom:6px; background:url(images/siteImages/loose-bulbs.png) right bottom no-repeat }
div#header img { margin-top: 140px; }

div#footer { font-size:1em; font-style:italic; color:#FFF; background:#19243d; padding:15px 0; text-align:center; }
div#footer .footerContent { margin:0 auto; text-align:right; width:810px; }
div#footer .footerContent a { color:#FFF }
.copyRight { float:left }
.footerTwitter, .footerRSS {background:url(images/siteImages/footer-TwitterSprite.gif) 0 0 no-repeat; line-height:1.6em; margin-right:5px; padding:1px 0 4px 18px }
.footerRSS { background-image:url(images/siteImages/footer-FeedSprite.gif); }
.footerTwitter:hover, .footerRSS:hover,
.footerTwitter:focus, .footerRSS:focus { background-position:0 -25px; }

#skiplinks { position:absolute; top:0; right:0; font-size:0.714em; }
#skiplinks ul {margin:0; padding:0; white-space:nowrap; }
#skiplinks li {display:inline; list-style-type:none; margin:0.5em;}
#skiplinks a { color:#ccccff; text-decoration:none; }
#skiplinks a:link, #skiplinks a:visited
	{ border-bottom:1px dotted white; }
#skiplinks a:hover, #skiplinks a:active, #skiplinks a:focus
	{ color:#FFFFFF; border-bottom:1px solid white; outline:none }

div#bground { word-spacing:-1em; }
div#content, div.content, div#right { display:inline-block;min-height:500px; vertical-align:top; word-spacing:normal }

div#content, div.content { width:480px; padding:10px 14px; text-align:justify; 
	background-color:#FFFFFF; border:2px solid #5b6ca6; border-bottom:0; }
div#content, div.content { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; 
	-moz-border-radius: 12px 0 0 0; -webkit-border-radius: 12px 0 0 0; border-radius: 12px 0 0 0; }

div#right { text-align:center; width:350px; padding:0; margin:0; color:white;
	background:url(images/siteImages/blue-background-75.png);
	background: rgba(91, 108, 166, 0.75) none; }
div#right { -moz-border-radius: 0 12px 0 0; -webkit-border-radius: 0 12px 0 0; border-radius: 0 12px 0 0;}

#right h2 { margin:7px 0; font-size:1.3em; line-height:1.8em; }
#right h3 { margin:0 0 7px; font-size:1em; }
#right h2, #right h4, #right ul li, #right dl { text-align:left; color:#FFFFFF;  }
#right a { border-bottom:1px solid #fff; color:white; text-decoration:none; }
#right ul li { list-style-type:circle; margin-left:0; padding-left:0; }
#right dl dt { font-weight:bold; }
#right ul li a, #right dl dt a { text-decoration:none; }
#right ul li a:hover, #right dl dt a:hover, #right ul li a:focus, #right dl dt a:focus { text-decoration:underline; outline:none }

#right .photo { margin-top:10px }
#right fieldset { border:none; text-align:left }
#right legend { float: left; margin:0; padding:0 0 6px; white-space: normal;}
#right legend span { display:block; }
#right legend span span { display:inline; padding:0 }

#blog h2, #blog h3 { text-align:left; padding:0 1em 0 0; }

.blogPost { margin:0; padding:0 1em 0 0; text-align:left; }
.blogPost img { border:4px solid #5b6ca6; }

div.rightem, fieldset.rightem { width:90%; margin:0.5em auto 0.5em auto; overflow:hidden; padding:0.5em; text-align:left; }

ul.menu { margin:0 0 1em 0; padding:0; list-style-type:none; word-spacing:normal }
ul.menu li { text-align:left; margin:0; display:inline }
ul.menu li a { color:#FFFFFF; margin:0; font-weight:bold; text-decoration:none; display:inline-block; padding:0.5em;}
ul.menu li a:hover, ul.menu li a:focus { background-color:#929dbd; color:#FFFFFF; text-decoration:none; outline:none}
li.highlight { background-color:#5b6ca6;}
li.highlight a { background-color:#5b6ca6; color:#FFFFFF;}

img.floatleft { float:left; margin-right:4px; }
img.floatright { float:right; margin-left:4px; }
.hide { position: absolute; left: -100em; width: 20em; }
.clear {clear:both; height:0.1em; font-size:0.1em; }
.clearnorm { clear:both; }

#flickrImages a { float:left; margin-right:3px }
#newsItems { text-align:left }
	#newsItems h2 { margin:20px 0 0; }
	#newsItems h3 { margin:15px 0 10px; font-size:1.1em }
	#newsItems .post { margin:0 0 10px }
	
a.daftApeth { position:absolute; left:0; bottom:0; padding:0; display:block; width:148px; height:141px;
	background:url(images/siteImages/daftApeth.png) left bottom no-repeat; text-indent:-1000px }
a.daftApeth:hover, a.daftApeth:focus { background-position:-200px bottom }

/* text styles */
.ifs { font-style:italic; font-weight:bold; }
.italic { font-style:italic; }
.bold { font-weight:bold; }
.aligncenter { text-align:center }
.alignright { text-align:right }

/* carousel */
.carousel { position:relative; text-align:left; padding:0 0.5em; width:90%; margin:0.9em auto }
.carouselWrapper { overflow:hidden; }
.carousel .item { clear:both }
.jsEnabled .carousel .item { float:left; clear:none }
.carouselControls { float:right; clear:left }
	.carouselControls a, #right .carouselControls a { background:url(images/siteImages/carouselControlSprite.gif) right -2px no-repeat; border-bottom:none; line-height:20px; margin-left:10px; padding-right:22px; text-decoration:underline }
	.carouselControls a.previousItem, #right .carouselControls a.previousItem { background-position:left -82px; padding:0 0 0 22px; }
.carouselIndicators { background:url(images/siteImages/indicatorSprite.png) 0 0 no-repeat; height:20px; }
.indicate0 { background-position:0 0; }
.indicate1 { background-position:0 -20px; }
.indicate2 { background-position:0 -40px; }
.indicate3 { background-position:0 -60px; }
.indicate4 { background-position:0 -80px; }

.sandBoxHeader { margin:12px 0 }
.sandBoxContent { padding:20px 14px; text-align:center; margin:0 auto;
	background-color:#FFFFFF; border:2px solid #5b6ca6; border-bottom:0; }

/* vcard */
.vcard .email { display:block }
#right .vcard .url { border-bottom:none }

/* code snippits */
pre { background:#E6E6E6; font-family:monospace; font-size:1.23em; line-height:2em; padding:1em 1em }

/* colour changer */
#colourOptions { float:right; display:none }
#colourOptions > li { background:red; float:left; height:40px; list-style:none; padding:0; margin:0; width:40px; }

/* css animation for the background */
@-webkit-keyframes backgroundPan {
	0% { background-position: -50px 0; }
	100% { background-position: 1210px 0; }
}

body {
 -webkit-animation-name: backgroundPan;
 -webkit-animation-duration: 60s;
 -webkit-animation-iteration-count: infinite;
 -webkit-animation-timing-function: linear;
}