/* Sew Brilliant CSS 
written by Joanna Candler of Jo Can Do
28th May 2009
*/
body {
text-align: center;
min-width: 950px;
background: url(images/repeat.gif);
font-size: 62.5%;
}

#wrapper {
width: 900px;
margin: 0 auto;
text-align: left;
background: #fff url(images/background.gif) repeat-y;
margin-top: 20px;
}

#header {
position: relative;
height: 220px;
}

#header h1 {
position: absolute;
top: -500px;
}

#header #logo {
position:absolute;
left: 210px;
top: 20px;
border: none;
}

#header #topstitch {
position:absolute;
top: -4px;
left: 0;
}

#header #zebra {
position:absolute;
top: 4px;
left: -20px;
}

#header #giraffe{
position:absolute;
top: 2px;
left: -22px;
}

#header #butterfly {
position:absolute;
top: 4px;
left: 720px;
}

#header #ladybird{
position:absolute;
top: 2px;
left: 720px;
}

#navigation {
float: left;
width: 180px;
padding-left: 30px;
position:relative;
}

#twitter {
position:absolute;
bottom: -40px;
left: 10px;
}

#twitter img {
border: none;
}

#twitter a:hover, #twitter a:visited, #twitter a:active, #twitter a:focus  {
background: none;
}


#facebook {
position:absolute;
bottom: -110px;
left: 0;
}

#facebook img {
border: none;
}

#facebook a:hover, #facebook a:visited, #facebook a:active, #facebook a:focus  {
background: none;
}


.menu a.current {
color: #000000; 
background: url(images/button-over.gif) no-repeat; /*button image background */
}

#maincontent {
margin-left: 200px;
background: url(images/content-sides.gif) repeat-y top left;
width:660px;
font-family: "Comic Sans MS", Arial, Helvetica, sans-serif;
}

#maincontent h2 {
background:  url("images/content-topstitch.gif") repeat-x top left;
padding-top: 10px;
margin-left: 8px; /* margins to position stitching image */
margin-right: 6px;
padding-left: 10px; /* padding to give space to text */
font-size: 1.8em;
}

#maincontent h3 {
font-size: 1.6em;
margin-top: 1.5em;
margin-bottom: 0.5em;
}

#maincontent h4 {
font-size: 1.4em;
margin-top: 1.2em;
margin-bottom: 0.3em;
}

#maincontent h2, #maincontent h3 {
color: #f5a519;
font-family:Verdana, Arial, Helvetica, sans-serif;
}

#maincontent p.stitches {
background: url(images/content-bottomstitch.gif) repeat-x bottom left;
margin-left: 8px; /* margins to position stitching image */
margin-right: 6px;
}

#maincontent p {
font-size: 1.4em;
color: #13235a;
}

#maincontent a {
color: #099030;
text-decoration: none;
border-bottom: 1px dashed #099030;
}

#maincontent a:hover {
border-bottom: 1px solid #099030;
}

#maincontent h3, #maincontent h4, #maincontent p {
margin-left: 25px;
margin-right: 20px;
}

#maincontent ul {
margin: 0;
padding: 0;
list-style-type: none;
margin-left: 30px;
}

#maincontent ul li {
background: url(images/bullet2.gif) no-repeat 0 2px;
padding-left: 30px;
font-size: 1.4em;
padding-bottom: 5px;
margin-right: 25px;
}

#maincontent ol {
margin: 0;
padding: 0;
margin-left: 30px;
}

#maincontent ol li {
list-style-position:outside;
padding-left: 5px;
margin-left: 25px;
font-size: 1.4em;
padding-bottom: 5px;
margin-right: 25px;
}

#maincontent p.question {
color:#f5a519;
font-weight: bold;
font-family:Verdana, Arial, Helvetica, sans-serif;
}

.image {
padding: 3px;
border: 1px dashed #099030;
}

#footer {
clear: both;
position: relative;
height: 40px;
}

#footer p {
text-align: center;
font-size: 1.2em;
font-family: Arial, Helvetica, sans-serif;
color: #13235a;
}

#footer #bottomstitch {
position: absolute;
left:0;
top: 21px;
}

#credits {
font-family: Arial, Helvetica, sans-serif;
font-size: 1.2em;
margin-top: 0.3em;
}

#credits a, #credits a:visited {
color: #13235a;
text-decoration: none;
}