/* CONTENTS
----------------------------------------------- 
Author: Rosie Sturman

01 - BASIC/HTML TAGS
02 - COLOURS
03 - STRUCTURE
04 - NAVIGATION
05 - MAINBODY
06 - SIDEBARS
07 - FOOTER
08 - FRONT PAGE OBJECTS
09 - MISC
*/


body {
	margin: 0;
	padding: 0;
	font-size: x-small; /* for IE5/Win */
	voice-family: "\"}\"";
	voice-family: inherit;
	font-size: small; /*for compliant browsers*/
	font-family: "Trebuchet MS", sans-serif;
	background: #b01e5d url(../Images/darkPinkGrad.gif) repeat-y center 0;
	text-align: center; /*margin: auto fix for IE6*/
}

html>body { /* be nice to Opera */
	font-size: small;
}

/* BASIC/HTML TAGS
----------------------------------------------- */
	
h1 {
	font-size: 150%;
	margin: 0;
	padding: 0 0 15px 0;
	color: #b01e5d;
	font-weight: normal;
}
	
h2 {
	font-size: 130%;
	margin: 0;
	padding: 0 0 10px 0;
	color: #59a5e5;
	line-height: 120%;
	font-weight: normal;
}
	
h3 {
	font-size: 110%;
	margin: 0;
	padding: 0 0 10px 0;
	line-height: 120%;
	color: #b01e5d;
	font-weight: bold;
}

h4{
	font-size: 100%;
	margin: 0;
	padding: 0 0 10px 0;
	line-height: 120%;
	color: #b01e5d;
	font-weight: bold;
}

p {
	font-size: 100%;
	margin: 0;
	padding: 0 0 7px 0;
	font-size: 90%;
	line-height: 120%;
	color: #333;
}
	
a {	
	margin: 0;
	padding: 0;
	font-size: 100%;
	color: #b01e5d;
	font-weight: bold;
}

blockquote {
	margin: 0;
	padding: 0 0 7px 0;
	font-style: italic;
}

blockquote p{
	color: #b01e5d;
	line-height: 120%;
	font-size: 100%;
}

/*---------------------------------------------*/
em {font-style: normal;}

.clear {clear: both;}
.left {float: left;}
.right {float: right;}
.altAlign {text-align: right;}
	

/* COLOURS
----------------------------------------------- */
.lightPink {background: #f4bcec;}
.midPink {background: #ea7ad9;}
.darkPink {background: #b01e5d;}
.green {background: #b2e559;}
.blue {background: #59a5e5;}
	
/*---------------------------------------------*/




/* STRUCTURE
------------------------------------------------ */

.wrap {
	margin: 0;
	padding: 0;
	width: 100%;
}

#one.wrap {background: #ea7ad9 url(../Images/green.gif) repeat-x 0 bottom;}
#two.wrap {background: #fff;}
#three.wrap {background: url(../Images/lightPinkGreen.gif) repeat-x 0 0;}
	

.wrap-inner {
	position: relative;
	margin: 0 auto;
	padding: 0;
	width: 720px;
	text-align: left;/*margin: auto fix for IE6*/
}

#two .wrap-inner {background: url(../Images/main.gif) repeat-y 0 0;}

	
.ribbon {
	float: right; 
	margin: 5px 30px 0 0;
		display: inline; /*to fix double margin in IE6*/
	padding: 0;
	height: 120px;
	width: 230px;
	background: url(../Images/logo.jpg) no-repeat 0 0;
}

#header {
	float: left;
	margin: 0;
	padding: 0;
	width: 720px;
	background: url(../Images/pinkGrad.gif) repeat-y 0 0;
}

/* NAVIGATION 
------------------------------------------------ */

#mainNav {
	float: left;
	margin: -10px 0 0 0;
	padding: 0;
	width: 720px;
	background: url(../Images/greenGrad.gif) no-repeat 0 bottom;
}

#mainNav ul {
	float: left;
	margin: 0;
	padding: 0 0 0 40px;
}
	
#mainNav ul li {
	position: relative;
	z-index: 100;
	float: left;
	margin: 0 0 0 5px;
		display: inline; /*to fix double margin in IE6*/
	padding: 0;
	list-style: none;
	background: #b01e5d url(../Images/navTR.gif) no-repeat right 0;
}


#mainNav ul li a{
	float: left;
	margin: 0;
	padding: 10px 10px 5px 10px;
	text-decoration: none;
	color: #fff;
	background: url(../Images/navTL.gif) no-repeat 0 0;
	border-bottom: 5px solid #b2e559;
}

#mainNav ul li a:hover, #mainNav ul li.selected a {padding-bottom: 10px; border-bottom: none;}

	
/* MAINBODY
------------------------------------------------ */
	
#main-body {
	float: left;
	margin: 20px 0 10px 40px;
		display: inline; /*to fix double margin in IE6*/
	padding: 0;
	width: 400px;
}

#content {
	float: left;
	margin: 0;
	padding: 0;
	width: 400px;
}	
	
/* SIDEBARS
------------------------------------------------ */

#sidebar1 {
	float: right;
	margin: 20px 40px 10px 0;
		display: inline; /*to fix double margin in IE6*/
	padding: 0;
	width: 230px;
}

#sidebar2 {
	float: left;
	margin: 0;
	padding: 0 0 10px 0;
	width: 400px;
}

/* FOOTER
------------------------------------------------ */
	
#footer {
	position: relative;
	clear: both;
	float: left;
	margin: 0 0 10px 0;
	padding: 37px 0 0 0;
	width: 720px;
	background: url(../Images/lightPinkGreenGrad.gif) no-repeat 0 0;
}

#footer p{margin: 0 40px; color: #fff;}
#footer a{color: #fff;}

#footer  p.siteBy {
	margin: 0 40px 0 0;
	padding: 0;
	float: right;
	font-size: 90%;
}

#footer  p.siteBy a{
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
}

#footer .grass1,
#footer .grass2 {
	position: absolute;
	top: -70px; 
	left: -100px;
	height: 100px;
	width: 100px;
	background: url(../Images/grass1.png) no-repeat 0 0;
}

#footer .grass2{left: 720px; background: url(../Images/grass2.png) no-repeat 0 0;}


/* FRONT PAGE OBJECTS
------------------------------------------------ */	
.welcome {
	float: left;
	margin: 0 0 10px 0;
	padding: 0 0 3px 0;
	border: 1px solid #b01e5d;
	width: 398px;
	background: url(../Images/hug.jpg) no-repeat right bottom;
}

.welcome h1{
	margin: 13px 0 0 10px;
	padding: 0;
	height: 55px;
	width: 204px;
	background: url(../Images/textReplace/joinUs.gif) no-repeat right 0;
}
.welcome h1 em{display: none}
.welcome h2 {margin: 12px 0 0 20px; line-height: 110%; color: #ea7ad9;}


.featuredArticle {
	position: relative; 
	float: left;
	margin: 5px 0 10px 0;
	padding: 0;
	border: 1px solid #59a5e5;
}

.featuredArticle img{width: 398px; margin-bottom: -4px /* <-- ???*/;}
#sidebar1 .featuredArticle img{width: 228px;}

.featuredArticle h2 {
	z-index: 10;
	position: absolute;
	bottom: 0;
	left: 0;
	margin: 0;
	padding: 7px 0 8px  0;
	width: 398px;
	font-size: 120%;
	background: url(../Images/green80.png) repeat 0 0;
}

.featuredArticle h2 a{position: relative; z-index: 100; float: left; margin: 0 10px; color: #333; text-decoration: none;}

.featuredArticle .summary{padding-bottom: 3em;}

#sidebar1 .featuredArticle h2 {width: 228px;}

/* MISC
------------------------------------------------ */

.newsList {
	margin: 0 0 10px 0;
	padding: 0;
}
.newsList .article {
	margin: 0;
	padding: 0 0 10px 0;
	border-bottom: 1px solid #ea7ad9;
}

.newsList h2 {
	margin: 0;
	padding: 8px 10px;
	color: #fff;
	background: #b01e5d;
}
.newsList h2 a{font-weight: normal; color: #fff; text-decoration: none;}

.newsList .box {
	margin: 0;
	padding: 0 10px 10px 10px;
	border: 1px solid #ea7ad9;
	border-top: none;
}

.newsList h3{margin: 0; padding: 10px 0 3px 0; color: #59a5e5;}
.newsList h3 em {margin: 0; padding: 0 4px 0 0; color: #b01e5d; font-size: 130%;}
.newsList p{margin: 0; padding: 0;}
.newsList p a{margin: 0; padding: 0; text-decoration: none;}
.newsList img{margin: 5px 0;}




.pinkTab {
	position: relative;
	margin: 0 0 10px 0;
	padding: 0;
	width: 218px;
	text-align: right;
	border: 6px solid #b2e559;
	background: #ea7ad9 url(../Images/pinkTabTR.gif) no-repeat right 0;
}
.pinkTab h2{
	margin: 0;
	padding: 8px 10px 7px 80px;
	text-decoration: none;
	font-size: 140%;
	border-bottom: 1px solid #fff;
	color: #fff;
	background: url(../Images/pinkTabTL.gif) no-repeat 0 0;
}

.pinkBox {
	margin: 0;
	padding: 5px 10px 5px 80px;
	background: #f4bcec ;
}

.pinkBox p {font-size: 100%; font-weight: bold;}

.pinkBox .date {position: absolute; top: 3px; left: 12px; height: 83px; width: 80px; background: url(../Images/date.png) no-repeat 0 0;}

.logos {clear: both; padding: 0 40px 0 40px; }
.logos img {float: right; margin: 0 0 10px 10px;}



/* FORMS
------------------------------------------------ */
.item {clear: both; float: left; margin: 0; padding: 0 0 10px 0; width: 100%;}

label {float: left; margin: 0; padding: 0; color: #333; font-weight: bold;}
input {margin: 0; padding: 2px; border: 1px solid #59a5e5;}

textarea {float: left; margin: 0; padding: 2px;}
input.textinput {float: left;}

input.submitbutton {clear: both; float: right; background: #59a5e5; color: #fff;}
select {float: left; margin: 0; padding: 2px;}

/*------------------------------------------------ */

.logIn {
	float: left; 
	margin: 0; 
	padding: 10px;
	border: 1px solid #b01e5d;
	width: 314px;
}
.logIn label {width: 120px;}