/*****************************************************************************************************

This file should contain all div tags structuring the layout of the website

reasoning : 

so this style sheet could be used to re-structure the website and when removed
should produce the website as a easily readable list which can be used for small
screens (such as phones)

*****************************************************************************************************/

/*************************************** Structure Settings *****************************************/

html
{
	margin:0px;
	padding:0px;
}
body
{
	margin:0;
	padding:0;
	line-height: 1.2em;
	text-align:left;
}

#layout
{
	width:875px;
	margin:auto;
	padding:5px 55px;
	overflow:hidden;
}
#header
{
	width: 100%;
	height:auto; /*Height of top section*/
	margin-bottom:10px;
	clear: left;
}
#contentwrapper
{
	float: left;
	width: 100%;
}
#contentcolumn
{
	margin: 0 185px 0 180px; /*Margins for content column. Should be "0 right-column-width 0 left-column-width*/
}
#leftcolumn
{
	float: left;
	width: 150px; /*Width of left column in percentage*/
	margin-left: -875px;
	margin-bottom: 20px;
}
#rightcolumn
{
	float: left;
	width: 150px; /*Width of right column in pixels*/
	margin-left: -150px; /*Set margin to -(RightColumnWidth)*/
	margin-bottom: 20px;
}
#footer
{
	width: 100%;
	height:auto; /*Height of bottom section*/
	clear: left;
}

.hr { overflow:hidden; height:0px; clear:both; margin:0px; padding:0px; /*Force hr of floating objects*/ }/*****************************************************************************************************

This file should contain
1.) all site wide colour, background and font styles for html tags
2.) a selection of class(.) styles that can be used in the cms text editor

reasoning : so this style sheet could be used to re-style the website

*****************************************************************************************************/

/**************************************** Website Settings *******************************************/

body
{
	background-color: #A14B9A;
	color: #FFFFFF;
	font: small/18px Arial, Verdana, Helvetica, sans-serif; /* Medium = 11 px - Small = 9px */
}

#layout
{
	background-color: #FFFFFF;
	color: #9f9e9e;
}

/* TinyMCE specific rules */
body.mceContentBody {
   background-color: #F0F8F6;
   color:#59595B;
}

.purplefont { color:#A14B9A; }

/**************************************** Text Settings **********************************************/

h1, h2, h3, h4, h5, h6
{
	font-weight:bold;
	line-height:1.2em;
	margin:0px 0px 1em 0px;
}
p
{
	margin:0px 0px 1em 0px;
	line-height:1.2em;
}
li
{
	margin:0em;
	padding:0em; 
	line-height:1.2em;
}
a
{
	color:#67BC65;
	text-decoration:none;
	outline:none;
}
a:hover
{
	text-decoration:underline;
}

/************************************** Image Settings ***********************************************/

img { border:0px solid #000000; }

/************************************** Table Settings ***********************************************/

caption { text-align:left; }

/*************************************** Form Settings ************************************************/

form
{
	margin:0px;
	padding:0px; 
}
fieldset
{
	border:1px solid #999;
	padding:1em;
	margin:0;
}
legend
{
	color:#000;
	font-size:1.2em;
}
fieldset div
{
	clear:left;
	margin:0.5em 0em 0em;
	padding:0.1em 0.3em 0.1em 0em;
}
fieldset div label
{
	display:block;
	float:left;
	width:20%;
	padding:0em;
	margin:0em 0.5em;
	text-align:right;
}
fieldset div span.block
{
	display:block;
	float:left;
	width:75%;
	padding:0em;
}
fieldset div * label
{
	display:inline-block;
	float:none;
	width:auto;
	padding:0px;
	margin:0px;
	text-align:left;
}
fieldset div input[type="text"],
fieldset div input[type="password"],
fieldset div textarea,
fieldset div select { width:60%; min-width:200px; max-width:400px; border:1px solid black; margin-right:1em; }
fieldset input:focus,
fieldset textarea:focus,
fieldset select:focus { border:1px dotted black !important; }
fieldset input.error,
fieldset textarea.error,
fieldset select.error { border:1px dotted red !important; }

label.error
{
	/* remove the next line when you have trouble in IE6 with labels in list */
	color:red;
	font-style:italic;
	text-align:left;
	width:auto;
}

/*************************************** Header Settings ************************************************/

div#header { border-bottom:4px solid #1FB0BD; }
div#info { float:right; }
div#phonenumber
{
	float:right;
	clear:both;
	width:345px;
	height:16px;
	background:url(/images/phone.gif) no-repeat scroll 0 0 transparent;
	overflow:hidden;
	margin-bottom:5px;
}
div#phonenumber a
{
	display:block;
	text-decoration:none;
	text-indent:-99999px;
	width:345px;
	height:16px;
}
div#search 
{
	float:right;
	clear:both;
	height:24px;
	width:auto;
}
div#search label
{
	background:url(/images/search.gif) no-repeat scroll 0 0 transparent;
	display:block;
	float:left;
	height:10px;
	margin-right:4px;
	margin-top:5px;
	text-align:left;
	text-indent:-9999px;
	width:46px;
}
div#search div#searchbox
{
	border:1px solid #68BC65;
	color:#00ABCD;
	display:block;
	float:left;
	margin:0;
	width:125px;
	height:auto;
}
div#search input#frm_searchbox
{
	color:#00ABCD;
	margin:0;
	padding:0;
	width:100px;
	border:1px solid #ffffff;
	height:13px;
	font-size:11px;
	float:left;
	display:block;
}
div#search input#frm_searchbutton { display:none }
div#search a#searchbutton
{
	display:block;
	float:right;
	background:url(/images/go.gif) no-repeat scroll 0 0 transparent;
	text-indent:-99999px;
	height:15px;
	width:21px;
}
div#logo
{
	display:block;
	float:left;
	background:url(/images/logo.gif) no-repeat scroll 0 0 transparent;
	height:140px;
	width:200px;
	overflow:hidden;
	margin-bottom:5px;
}
div#logo h1 { margin:0px; }
div#logo h1 a
{
	display:block;
	height:140px;
	width:200px;
	text-indent:-99999px;
}
div#donatenow
{
	float:right;
	clear:right;
	width:60px;
	height:60px;
}
div#donatenow a
{
	display:block;
	width:60px;
	height:60px;
	text-indent:-99999px;
}
div#cadsdvd
{
	background:url(/images/cads-dvd.gif) repeat scroll 0 0 transparent;
	float:right;
	clear:right;
	width:92px;
	height:44px;
}
div#cadsdvd a
{
	display:block;
	width:92px;
	height:44px;
	text-indent:-99999px;
}

/************************************** Header Navigation ***********************************************/

div.topmenu
{
	float:left;
	margin:0px 0px 10px 30px;
	padding:0px;
	width:500px;
	height:auto;
}
div.topmenu ul
{
	display:block;
	list-style:none;
	margin:0px;
	padding:0px;
	border:none;
	float:left;
}
div.topmenu ul li
{
	display:block;
	list-style:none;
	margin:0px;
	padding:0px;
	width:250px;
	height:16px;
	float:left;
}
div.topmenu ul li a
{
	display:block;
	width:250px;
	height:18px;
	float:left;
	background-position:0 0;
	background-repeat:no-repeat;
	text-indent:-99999px;
}
div.topmenu ul li a:hover, div.topmenu ul li a.selected { background-position:0px -18px; }

/************************************** Footer Settings ***********************************************/

div#footer { padding: 4px 0; border-top:4px solid #E4E2E2; }
p#charitynumber
{
	float:left;
	width:115px;
	height:30px;
	background:url(/images/registeredcharity.gif) no-repeat scroll 0 0 transparent;
	text-indent:-99999px;
	margin:0 15px 0 0;
}
p#charitynumber a
{
	display:block;
	width:115px;
	height:30px;
	text-indent:-99999px;
	text-decoration:none;
}
p#fatfrog
{
	float:right;
	width:35px;
	height:15px;
	background:url(/images/fatfrog.gif) no-repeat scroll 0 0 transparent;
	text-indent:-99999px;
	margin: 5px 0 0 0;
}
p#fatfrog a
{
	display:block;
	width:35px;
	height:15px;
	text-indent:-99999px;
	text-decoration:none;
}

/************************************* Footer Navigation **********************************************/

div.footermenu
{
	width:auto;
	float:left;
	font-family:"Times New Roman", Times, serif;
}
div.footermenu ul
{
	list-style-type: none;
	list-style-image: none;
	margin: 0;
	padding: 0;
}
div.footermenu li
{
	display: inline;
	margin: 0 25px 0 0 ;
}
div.footermenu li a
{
	color: #d1c6ba;
	font-size: 0.9em;
}
div.footermenu li a:hover
{
	color:#67BC65;
	text-decoration: none;
}
div.footermenu li a.selected
{
	color:#67BC65;
	text-decoration: none;
}

/************************************** Left Navigation ***********************************************/

div.leftmenu
{
	width:100%;
	padding:0px;
	margin:10px 0px 10px 0px;
	background-color:#ffffff;
}
div.leftmenu ul
{
	list-style-type: none;
	padding: 0px;
	margin: 0px;
}
div.leftmenu li
{
	background-image: url(/images/bullet.gif);
	background-repeat: no-repeat;
	background-position: 0px 2px;
	padding-left: 14px;
}
div.leftmenu li a
{
	color:#939598;
	font-size:0.9em;
	font-weight:bold;
}
div.leftmenu li a:hover, div.leftmenu li.selected a { color:#00ABCC; }

#leftcolumn #supportedby h4.supportedby
{
	width:120px;
	height:18px;
	background:url(/images/left/cads-supportedbytitle.gif) left top no-repeat;
	text-indent:-9999px;
	margin-bottom:5px;
}

/*************************************** Right Column Settings ************************************************/

div#cadsgallery a
{
	background:url(/images/cadsgallery.jpg) no-repeat scroll 0 0 transparent;
	display:block;
	height:89px;
	margin:0;
	overflow:hidden;
	padding:0;
	text-indent:-9999px;
	width:150px;
}

div#newspanel .paneltitle h4
{
	background-image:url(/images/titlecorner.png);
	background-repeat:no-repeat;
	background-position:right top;
	background-color:#1EB0BD;
	font-family:"Times New Roman", Times, serif;
	font-size:1.2em;
	color:#FFFFFF;
	margin:0px;
	padding:3px;
}
div#newspanel .panelcontent
{
	background-color:#e5f6fa;
	color: #808284;
	margin-bottom:10px;
	padding:0px;
	font-size:0.9em;
}
div#newspanel .panelcontent ul
{
	list-style:none;
	margin:0px;
	padding:0px;
}
div#newspanel .panelcontent ul li
{
	list-style:none;
	margin:0px 0px 3px 0px;
	padding:5px;
	border-bottom:1px solid #FFFFFF;
}
div#newspanel .panelcontent ul li div.more
{
	padding-top:5px;
	text-align:right;
}

/*************************************** Page Settings ************************************************/

#contentwrapper { margin:0 0 10px 0; }
#contentcolumn { background-color:#F0F8F6; color:#59595B; }

#breadcrumbs { color:#999999; font-size:0.8em; margin:0 10px 10px 10px; padding-top:10px; }
#breadcrumbs span.currentpage { color:#00ABCC; }
#breadcrumbs a { color:#999999; }
.pagetitle h2
{
	margin:10px;
	padding:0px;
	color:#68BC65;
	font-weight:bold; 
}
.pagetitle h3 { margin:0px 10px; font-size:1em; }
.content { margin:10px; }


/*************************************** List Settings ************************************************/

.groupmenu { margin-bottom:1em; }
.groupmenu li {}

.list { margin:10px; }
.listgroup { margin:20px 0 0 0; padding:0px; }
.listgrouptitle { text-transform:lowercase; font-size:1.5em; }
.listrow {}
.listdetails {}
.listtitle { margin-bottom:0em; }
.listthumbnail { display:inline; float:right; padding:0 0 1em 1em; }
.listcaption { margin-bottom:1em; }
.listselect {}
.listmore { padding:0em; margin:0em; text-align:right; }
.listunavailable {}
 
.selectedtitle {}
.selectedimage { display:inline; float:right; padding:0 0 1em 1em; }
.selectedtext {}
.selectedunavailable {}

.pagenavigation {}
.previouspage {}#sb-title-inner,#sb-info-inner,#sb-loading-inner,div.sb-message{font-family:"HelveticaNeue-Light","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:200;color:#fff;}
#sb-container{position:fixed;margin:0;padding:0;top:0;left:0;z-index:999;text-align:left;visibility:hidden;display:none;}
#sb-overlay{position:relative;height:100%;width:100%;}
#sb-wrapper{position:absolute;visibility:hidden;width:100px;}
#sb-wrapper-inner{position:relative;border:1px solid #303030;overflow:hidden;height:100px;}
#sb-body{position:relative;height:100%;}
#sb-body-inner{position:absolute;height:100%;width:100%;}
#sb-player.html{height:100%;overflow:auto;}
#sb-body img{border:none;}
#sb-loading{position:relative;height:100%;}
#sb-loading-inner{position:absolute;font-size:14px;line-height:24px;height:24px;top:50%;margin-top:-12px;width:100%;text-align:center;}
#sb-loading-inner span{background:url(/scripts/shadowbox/loading.gif) no-repeat;padding-left:34px;display:inline-block;}
#sb-body,#sb-loading{background-color:#060606;}
#sb-title,#sb-info{position:relative;margin:0;padding:0;overflow:hidden;}
#sb-title,#sb-title-inner{height:26px;line-height:26px;}
#sb-title-inner{font-size:16px;}
#sb-info,#sb-info-inner{height:20px;line-height:20px;}
#sb-info-inner{font-size:12px;}
#sb-nav{float:right;height:16px;padding:2px 0;width:45%;}
#sb-nav a{display:block;float:right;height:16px;width:16px;margin-left:3px;cursor:pointer;background-repeat:no-repeat;}
#sb-nav-close{background-image:url(/scripts/shadowbox/close.png);}
#sb-nav-next{background-image:url(/scripts/shadowbox/next.png);}
#sb-nav-previous{background-image:url(/scripts/shadowbox/previous.png);}
#sb-nav-play{background-image:url(/scripts/shadowbox/play.png);}
#sb-nav-pause{background-image:url(/scripts/shadowbox/pause.png);}
#sb-counter{float:left;width:45%;}
#sb-counter a{padding:0 4px 0 0;text-decoration:none;cursor:pointer;color:#fff;}
#sb-counter a.sb-counter-current{text-decoration:underline;}
div.sb-message{font-size:12px;padding:10px;text-align:center;}
div.sb-message a:link,div.sb-message a:visited{color:#fff;text-decoration:underline;}

