@charset "utf-8";
/* 
	BILD.ca Screen Styles

	Table of Contents 
		layout
		typography
		forms
*/

/* layout
----------------------------------------------- */

* {
	margin:0;
	padding:0;
}

body {
	background: #666666 url(images/html-bg.gif) repeat-x;
	margin-bottom: 20px;
	/*text-align:center;*/
}


#page {
	background: url(images/main-bg.jpg) no-repeat center top;
	z-index: 20;
}

#wrapper {
	width: 960px;
	background: #FFFFFF url(images/content-bg.gif) repeat-y;
	text-align:left;
	margin: 0px auto;
	position: relative;	
	border-left: 10px solid white;
	border-right: 10px solid white;
	border-bottom: 10px solid white;
}


#header {
	width: 980px;
	height: 150px;
	margin: 0px auto;
	position: relative;	
	background: #fff url(images/header_logo.gif);
}

#headerMember {
	width: 980px;
	height: 150px;
	margin: 0px auto;
	position: relative;
	background: #fff url(images/header_logo_member.gif) no-repeat;
}


#membersOnlyHeader {
	float: right;
	color: #FFFFFF;
	width: 180px;
	background: url(images/members_only.gif) no-repeat;
	margin-right:8px;
	margin-top: 80px;
	text-align:left;	
}


#searchFormHeader {
	float: right;
	color: #FFFFFF;
	width: 180px;
	margin-right:8px;
	margin-top: 124px;
	text-align:left;	
}

#searchFormHeaderMember {
	float: right;
	color: #FFFFFF;
	width: 180px;
	margin-right:8px;
	text-align:left;	
}

#searchFormHeaderMember input {
	padding:3px;
}

#searchFormHeader .field {
	padding-top: 1px;
	padding-bottom: 1px;
	padding-left: 3px;
	color: #666666; 
	border: 1px solid #999999;
}


#nav {
	width: 960px;
	height: 31px;
	border-bottom: 10px solid white;
	background: #89C33E;
}



#navMember {
	width: 958px;
	height: 31px;
	border-bottom: 10px solid white;
	background: #89C33E;
}

#mainContent {
	width: 669px;
	float: left;
	background: #fff;
}

#mainContent img {
	padding: 5px;
}


/*The following allows whitespace around CMS content without having to style tags such as <p> <li> etc... */

#mainContentCMS {
	padding-left: 10px;
	padding-right: 20px;
	padding-top: 10px;
	margin-top: 10px;
	border: 1px solid #999999;
}

#mainContentCMS img {

}


#secondaryContent {
	width: 282px;
	/*background: #CCCCCC;*/
	float: right;
}


#secondaryContentContainer {
	margin-left: 15px;
	margin-right: 20px;
	margin-top: 10px;

}

#sideNav {
}

#CRMbuttons img {
	border-bottom: 1px solid #fff;
}


#memberLoginBox {
	margin-left: 20px;
	margin-right: 20px;
	margin-top: 0px;
	margin-bottom: 25px;
}

#memberLoginBox .sidebarTop {
	background-image: url(images/memberlogin_bkrnd.gif);
}

#randomImage {
}

#randomImage p {
	margin:0;
	padding:0;
}

#randomImage img {
	margin:0;
	padding:0;
}



#footer {
	width: 980px;	
	height: 103px;
	color: #000;
	/*text-align: left;	*/
	margin: 0px auto;
	background: #fff;
	border-bottom: 8px solid #fff;	
}
#footerText  {
	width:980px;
	margin-left:10px;
}


#footerText img {
	margin-top:10px;
	padding:0;
}




/*Styles Collections*/

#mainContent #mainContentCMS #collection {
	padding-left: 5px;	
	padding-right: 5px;	
	padding-bottom:10px;	
	margin-bottom: 10px;
	width:630px;
	text-align: left;
	background: #EAEAEA;
	border-bottom: 1px solid #999999;
	border-right: 1px solid #999999;	
	float: left;
}

#mainContent #mainContentCMS #collection a {
	color: #666666;
}

#mainContent #mainContentCMS #collection ul {
	list-style: none;
	margin: 0;
	padding: 0;
	margin-bottom:5px;
}

#mainContent #mainContentCMS #collection ul li {
	float: left;
	border-right: 1px solid;
	line-height: .88em;
	padding-right: 10px;	
	margin-left: 10px;
	padding-bottom: 5px;
	color: #666666;	
}





.clear {
	clear:both;
}

#mainContent #mainContentCMS .imageAlignRight {
	float: right;
	margin-left: 10px;
}

#mainContent #mainContentCMS .imageAlignLeft {
	float: left;
	margin-right: 10px;
}


/* Typography
-----------------------------------------------// 

IMPORTANT NOTE!
Any typographical changes to this file below must also be made for mainContent.css and sidebarContent.css (depending on the DIV you are changing). These two files are utilized by the eWebEditPro editor to simulate what the text will look like when formatted by the globalcss.css file. This is because the content blocks do not pick up on the DIV formatting that they are contained within. The actualu formatting is performed by globalcss.css - glenp@gkmedia.com.

*/

body {font-size: 62.5%; font-family:Arial, Helvetica, sans-serif;}

h1 {font-size:2em;}  /* displayed at 24px */
H2 {font-size:1.5em;}  /* displayed at 18px */
H3 {font-size:1.25em;}  /* displayed at 15px */
H4 {font-size:1em;}  /* displayed at 12px */


p {	line-height: 1.4em;	margin: 0.5em 0 1.5em 0; }

.field {
	font-size: 11px;
}

#mainContent {
	font-size: 1.3em;
	text-align:justify;
	color: #666666;
}

#mainContent h1 {
	color: #4F4F4F;
	font-size: 30px;;
	font-weight: normal;
	margin-bottom: 10px;
	margin-left: -2px;
	letter-spacing: -.05em;
}

#mainContent h2 {
	border-bottom: 3px solid #8CC740;
	line-height: 1.6em;
	font-size: 16px;
	text-transform: uppercase;
	font-weight: bold;
	margin-bottom: 6px;
}

#mainContent h3 {
	margin-bottom: 0px;
	font-size: 1.4em;
	letter-spacing: -.03em;
}

#mainContent h4 {
	margin-top: 16px;
	margin-bottom: 1px;
	font-size: 1em;
}


#mainContent a:link {
	color: #8CC740;
	text-decoration:none;
	font-weight: bold;
}

#mainContent a:visited {
	color: #8CC740;	
	text-decoration: none;
	border-bottom: none; 
	font-weight: bold;
}

#mainContent a:hover  {
	color: #EEB01F;
	text-decoration:none;
	border-bottom: 1px dashed #EEB01F;
}

#mainContent a:active {
	color: #8CC740;	
	text-decoration:none;
}


/* Styles bullets in mainContent area */
#mainContent ul {
	list-style-type: square;
	margin-bottom: 22px;
	margin-top: 10px;
	margin-right: 40px;
}


#mainContent #mainContentCMS li {
	/*font-size:.85em;*/
	margin-top: 10px;
	line-height: 1.3em;
	/*background: url(images/bullet_mainContent.gif) no-repeat 0 40%;*/
	margin-left: 25px;
}

#mainContent li li {
	list-style-type: disc;
}

#mainContent ol {
	margin-bottom: 15px;
}


#mainContent strong {
	color: #666666;
}

#mainContent table {
	margin-top: 10px;
}

#mainContent hr {
	border: 0;
	width:100%;
	color: #8CC740;
	margin-bottom: 5px;
	background-color:#8CC740;
} 

.cellBorderBottom td {
	border-bottom: 1px dotted #666666;
	padding: 4px;
	text-align:left;
}

.cellGray td {
	border: 1px solid #CCCCCC;
	padding: 4px;
	text-align:left;
}

#mainContentCMS .callout {
	font-size: 1.1em;
	color: #666666;
	background: #EDF3FB;
	padding: 10px;  
	/*font-weight:bold;*/
	line-height:1.2em;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-right: 20px;
	margin-left: 10px;
	width: 200px;
	float: right;
	border-top: 3px double #D6E3F5C;
	border-bottom: 3px double #D6E3F5;
	border-left: 5px solid #D6E3F5;
}

#mainContentCMS .calloutCenter {
	font-size: 1.1em;
	color: #666666;
	background: #EDF3FB;
	padding: 10px;  
	/*font-weight:bold;*/
	line-height:1.2em;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-right: 20px;
	margin-left: 90px;
	width: 400px;
	border-top: 3px double #D6E3F5C;
	border-bottom: 3px double #D6E3F5;
	border-left: 5px solid #D6E3F5;
}

#mainContentCMS .creditsource {
	font-size: .7em;
}


#secondaryContent {
	font-size: 1.1em;
	color: #666666;

}

#secondaryContent a:link {
	color: #333333;
	text-decoration:none;
	font-weight: bold;
}

#secondaryContent a:visited {
	color: #333333;
	text-decoration:none;
	font-weight: bold;
}

#secondaryContent a:hover  {
	color: #EEB01F;
	text-decoration:none;
	
}

#secondaryContent a:active {
	color: #cc0000;
}


#secondaryContent p {
	line-height: 1.5em;	margin: 0.5em 0 1.5em 0; 
}


#secondaryContent h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.65em;
	line-height: 1.4em;
	letter-spacing: -.05em;
	color: #666666;
	font-weight: normal;
	border-bottom: 1px solid #666666;
	padding-top: 10px;
	margin-bottom: 10px;
}

#secondaryContent ul {
	margin: 0;
	margin-bottom: 20px;
	padding: 0;
	list-style-type: none;	
} 

#secondaryContent li {
	background: url(images/bullet_sidebar.gif) no-repeat 0 59%;
	font-weight:bold;
	margin-left: 5px;
	margin-top: 10px;
	padding-left: 16px; 
}

#sideNav a:link, a:visited {}

#sideNav a:hover, a:active {
	border: none;
}



#footer a:link {
	color: #fff;
	text-decoration:none;
}

#footer a:visited {
	color: #fff;
	text-decoration:none;
}

#footer a:hover  {
	color: #fff;
	border-bottom: 1px solid #fff;
}

#footer a:active {
	color: #fff;
	border-bottom: 1px solid #fff;
}


.importantInfo {
	color: #4f4f4f;
	font-weight: bold;
	font-size: 1.2em;
	line-height: 1.4em;
	margin-bottom: 8px;
}

.TxtSmall {
	font-size: 11px;
}

/* Used to emphasize blocks of content, such as on 5 reasons to join */
.contentBox {
	margin-left: 20px;
	margin-right: 20px;
	margin-top: 10px;
	padding: 10px;
	background: #F6F7F7;
	border: 1px solid #CCCCCC; 
}

.contentBox strong {
	font-size: 18px;
	line-height: 1em;
	text-align:left;
}


/*End of Typographical Area-----------------------------------*/


/* forms
----------------------------------------------- */
INPUT, SELECT, TH, TD {font-size:1em}





/*For DHTML Menu - adds a border to submenu items
----------------------------------------------- */
.mmbord{
	border-bottom:2px solid #CDCDCD;
	text-decoration:none;
	font-size:10px;
	padding-left:5px;
	padding-top:0;
	padding-bottom:0;
	padding-right:15px;
}

.mmborMember{
	border-bottom:2px solid #CDCDCD;
	text-decoration:none;
	font-size:10px;
	padding-left:5px;
	padding-top:0;
	padding-bottom:0;
	padding-right:15px;
}

/* End Menu Settings---------------- */


.Highlight {
	background:#FFFF00;
	color: #000000;	
}

.darkBlue {
	background: #8CC740;
	font-size: 14px;
	color: #FFFFFF;
	padding-top: 4px;
}

.tableFormat td {
	padding: 7px;
	border-bottom: 1px solid #CCCCCC;
}

.tableFormat a[href^="http:"] {
	background: url(images/externalLink.gif) no-repeat left top;
	padding-left:15px;
}

#mainContent .greenHeading {
	background: #8CC740;
	font-size: 19px;
	color: #fff;
	border-bottom: 5px solid #D0E8B0;
	padding-left: 12px;
	padding-top: 5px;
	padding-bottom: 2px;
	margin-left:0px;
}

#mainContent .eventBox {
	width: 300px;
	height: 30px;
	margin: 10px;
	padding: 10px;
	background: #F6F7F7;
	border: 1px solid #CCCCCC;
}
.imagepadding {
	padding:5px;
}