/*
Stylesheet for Joy & Freedom website
*/


/* website main structure */
body {text-align: center; background: #57836a url(images/main_bg3.jpg) repeat-x; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 20px; margin: 0; padding: 0;}
#wrapper {width: 960px; text-align: left; margin: auto;}
#wrapper2 {padding: 15px; background: #effb84;}
#header_top {display: none; height: 10px; background: url(images/header_top.png) no-repeat;}
#header {background: #fe72a4 url(images/header_image2.jpg); height: 270px; border: solid 2px #f3efdb;/* border-top: none; border-bottom: none;*/position: relative;}
#header_bottom {display: none; height: 10px; background: url(images/header_bottom.png) no-repeat;}
#strapline {color: #fff; font-family: georgia; font-size: 30px; font-weight: normal; margin: 210px 0 0 20px;}
#content_top {height: 30px; background: url(images/content_top.png) no-repeat;}
#content {padding: 0 20px 20px 20px; border: solid 2px #fff; border-top: none; border-bottom: none; background: #f9f8f5;}
#content_bottom {height: 10px; background: url(images/content_bottom.png) no-repeat;}
#left {width: 600px; float: left;}
#left.home {width: 550px;}
#right {width: 250px; float: right; margin: 45px 0 0 0;}
#footer {padding: 10px; font-size: 11px; color: #555;}

#red_cross {background: #fff; width: 231px; height: 149px; position: absolute; top: 100px; right: 20px;}
#red_cross a {display: block; border: solid 2px #76a0b0;}
#red_cross a:hover {border-color: #f00;}

/* top navigation */
#top_navigation {margin: 5px 0 5px 20px;}
#top_navigation ul {margin: 0; padding: 0; list-style: none;}
#top_navigation li {margin: 0 25px 0 0; padding: 0; list-style: none; float: left;}
#top_navigation li.last {float: right;}
#top_navigation a {font-size: 16px; padding: 10px 0; display: block;}
#top_navigation li.selected a {font-weight: bold;}

/* general tags */
/* red large colour */
h1 {font-family: georgia; font-size: 26px; line-height: 30px; color: #f8364b; font-weight: normal; margin: 0 0 15px 0; padding: 0;}
/* green large colour */
h2 {font-family: georgia; font-size: 20px; line-height: 20px; color: #418247; font-weight: normal; margin: 0 0 10px 0; padding: 0;}
/* little black bold */
h3 {font-family: verdana; font-size: 14px; line-height: 20px; color: #000000; font-weight: bold; margin: 0 0 10px 0; padding: 0;}
/* little blue bold */
h4 {font-family: verdana; font-size: 16px; line-height: 20px; color: #2272a7; font-weight: bold; margin: 0 0 10px 0; padding: 0;}
/* little orange bold */
h5 {font-family: verdana; font-size: 16px; line-height: 20px; color: #fc8804; font-weight: bold; margin: 0 0 10px 0; padding: 0;}   
/* blue large colour */
h6 {font-family: georgia; font-size: 22px; line-height: 20px; color: #2272a7; font-weight: normal; margin: 0 0 10px 0; padding: 0;}

a:link, a:visited {color:#365e79; text-decoration:none;}
a:hover {color:#fe72a4; text-decoration:underline;}
a:active {outline: none;}
a img {border-width:0;}
p {padding: 0; margin: 0 0 15px 0;}
ul {margin: 0 0 15px 15px; padding: 0;}
div.clear {clear: both;}

img.right {border: solid 1px #ccc; float: right; margin: 0 0 15px 0;}
img.thumbnail {float: left; margin: 0 15px 15px 0;}

div.col-left {float: left; width: 350px;}
div.col-right {float: left; width: 320px;}

.message {background: #d5f2d0; padding: 10px; border: solid 1px #77b36d; margin-bottom: 15px; font-size: 90%;}