
/* ------------------------------------------------------------------
	MAIN STYLESHEET
	
	Project: Checkmate Public Affairs
	Created: 2009-05-07
	Created by: Cindy Dochstader cindy@rkd.ca
	
	COLOURS:	
	Background Grey: #d1d7da
	Blue: #005581
	Link Red: #b41515
------------------------------------------------------------------- */


/* TABLE OF CONTENTS */
/* ---------------------------------------- HTML, BODY, RESETS */
/* ---------------------------------------- GLOBAL STYLES */
/* ---------------------------------------- STRUCTURE */
/* -------------------------------------------- Header */
/* ----------------------------------------------- Top Nav */
/* ----------------------------------------------- Top Bio Products Nav */
/* -------------------------------------------- Content Area */
/* ----------------------------------------------- Accordian */
/* ----------------------------------------------- Form Elements */
/* -------------------------------------------- Side Bar */
/* ----------------------------------------------- Side Bar Callouts */
/* ----------------------------------------------- Side Bar Nav */
/* -------------------------------------------- Footer */




@import url("reset.css");

 
/* ----------------------------------------------
	HTML, BODY, RESETS
---------------------------------------------- */

html { 
	overflow-y: scroll; /* keeps vertical scroll bar in firefox at all times so page doesn't jump around */
	height: 100%;
	}

body {
	background: #fff; /* background colour should be same as content area background colour to ensure WYSIWYG looks same as website */
	margin: 0;
	padding: 0;
	top: 0;
	left: 0px;
	font: 14px/22px Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
	color:#000;
	}
	.BodyStyle { /* use this class to set body background colour so that it does not interfere with the WYSIWYG editor */
		color:#000;
		background: #d1d7da url(../../images/header-bg.png) repeat-x;
		}

img, form { /* removes all default formatting on images and forms */
	margin: 0;
	padding: 0;
	border: 0;
	}

:focus { outline: none; } /* removes dotted outline from links */

.Clear { clear: both; } /* clears all floats; apply to empty divs */



/* ----------------------------------------------
	GLOBAL STYLES - style as necessary
---------------------------------------------- */

a:link, a:visited {
	color: #b41515;
	text-decoration: none;
	}

a:hover, a:active {
	color: #b41515;
	text-decoration: underline;
	}
	.ArrowLinks { margin-top:15px; }
		.Arrow {
			background: url(../../images/arrow-links.png) no-repeat 0 3px;
			padding-left:22px;
			margin-right:40px;
			font-weight:bold;
			}
		.ArrowPrevious {
			background: url(../../images/arrow-links-previous.png) no-repeat 0 3px;
			padding-left:22px;
			margin-right:40px;
			font-weight:bold;
			}
		.ArrowSecondary {
			background: url(../../images/arrow-links.png) no-repeat 0 3px;
			padding-left:22px;
			font-weight:bold;
			}

p, td, div { 
	font: 14px/22px Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
	}
	p {
	padding:0 0 10px 0;
	}

strong, b {
	font-weight: bold;
	font-size:15px;
	}

em, i {
	font-style: italic;
	}

h1 {
	color: #005581;
	font: 20px Georgia, Times New Roman, Times, serif;
	text-transform: uppercase;
	}
	h1.ImgReplace {
		height: 30px;
		text-indent: -9999px;
		background-repeat: no-repeat;
		background-position: left top;
		margin-bottom:25px;
		}
	h1.ImgReplace2Lines {
		height: 58px;
		text-indent: -9999px;
		background-repeat: no-repeat;
		background-position: left top;
		margin-bottom:25px;
		}	
		
h2 {
	color: #005581;
	font: 20px Georgia, Times New Roman, Times, serif;
	margin:15px 0 12px 0;
	}
	h2.ImgReplaceH1Style {
		height: 30px;
		text-indent: -9999px;
		background-repeat: no-repeat;
		background-position: left top;
		margin-bottom:25px;
		font: 23px Georgia, Times New Roman, Times, serif;
	    text-transform: uppercase;
		}


h3 {
	color: #005581;
	font: 17px Georgia, Times New Roman, Times, serif;
	margin:15px 0 12px 0;
	}
			
ul { 
	list-style-position:outside; 
	margin:0 0 15px 30px; 
	}

li { margin-bottom:5px; }

div.hr {
	margin:20px 0 40px 0;
	height: 20px;
	background: url(../../images/hr.png) no-repeat;
	}
	div.hr hr {
		display: none;
		}

.ImageFloatLeft {
	float:left;
	padding-right:20px;
	}
	
.ULBesideImageFloatLeftHome { 
	width:520px;
	float:right;
	}
	.ULBesideImageFloatLeft { 
		width:460px;
		float:right;
		}
		
.Note {
	margin-top:20px;
	font-size:12px;
	line-height:20px;
	}

.P12px {
	font-size:12px;
	}
	
.MarginTop10px {
	margin-top:10px;
	}
.MarginTop20px {
	margin-top:20px;
	}
	
.MarginBottom10px {
	margin-bottom:10px;
	}
	
.MarginBottom30px {
	margin-bottom:30px;
	}
	
.MarginBottom40px {
	margin-bottom:40px;
	}

.MarginBottom60px {
	margin-bottom:60px;
	}

.PhotoFloatRight {float:right; padding:10px; background:#e4e9ec;}	

/* styles used by WYSIWYG - style as necessary */
pre { }
address { }




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

/* ---------------------------------------- Header */

#PrintHeader { display: none; }

#Header { 
	width: 940px;
	margin:0 auto;
	padding:0;
 	}

.ContactLink a {
		float:right; 
		display:block;  
		width:189px;
		height:56px;
		background:url(../../images/header-contact.png) no-repeat; 
		text-indent:-9000px;
		background-position:0 0;
		}
		
.BioContactLink a {
		float:right; 
		display:block;  
		width:189px;
		height:56px;
		background:url(../../images/header-bio-contact.png) no-repeat; 
		text-indent:-9000px;
		background-position:0 0;
		}	
			
		.ContactLink a:hover, .BioContactLink a:hover  {
			background-position:0 -56px;
			}

.Logo { 
	float:left; 
	margin-top:107px;
	}
	
.BioLogo { 
	float:left; 
	margin-top:112px;
	}
	
.HeaderImage { 
	float:right; 
	}



/* ---------------------------------------- Top Nav */
/* ---------------------------------------- Blog had it's own nav styles and include file in the Big City folder */
		
.TopNav {
	width:940px;
	height:30px;
	}
	
.TopNav ul {
	list-style: none;
	padding:0;
	margin:0;
	line-height:0;
	}
	.TopNav li {
		list-style: none outside;
		padding:0;
		margin:0;
		line-height:0;
		}
	
.TopNav a {
	display:block;
	float:left;
	height:30px;
	background:url(../../images/topnav.png) no-repeat; 
	text-indent:-9000px;
	}

.TopNav a.NavHome  {
	background-position:0 0;
	width: 63px;
	}	
	.TopNav a.NavHome:hover  {
		background-position:0 -30px;
		}
		
.TopNav a.NavFreeStuff  {
	background-position:-63px 0;
	width:118px;
	}	
	.TopNav a.NavFreeStuff:hover  {
		background-position:-63px -30px;
		}
		
.TopNav a.NavIsThisYou  {
	background-position:-181px 0;
	width:126px;
	}	
	.TopNav a.NavIsThisYou:hover  {
		background-position:-181px -30px;
		}
		
.TopNav a.NavHowIWork  {
	background-position:-312px 0;
	width:131px;
	}	
	.TopNav a.NavHowIWork:hover  {
		background-position:-312px -30px;
		}
		
.TopNav a.NavProducts  {
	background-position:-443px 0;
	width:200px;
	}	
	.TopNav a.NavProducts:hover  {
		background-position:-443px -30px;
		}
		
.TopNav a.NavCaseStudies  {
	background-position:-643px 0;
	width:135px;
	}	
	.TopNav a.NavCaseStudies:hover  {
		background-position:-643px -30px;
		}
		
.TopNav a.NavBlog  {
	background-position:-779px 0;
	width:72px;
	}	
	.TopNav a.NavBlog:hover  {
		background-position:-779px -30px;
		}
		
.TopNav a.NavAboutMe  {
	background-position:-852px 0;
	width:95px;
	}	
	.TopNav a.NavAboutMe:hover  {
		background-position:-852px -30px;
		}
	
	

/* ---------------------------------------- Top Bio Products Nav */
		
.BioTopNav {
	width:940px;
	height:30px;
	}
	
.BioTopNav ul {
	list-style: none;
	padding:0;
	margin:0;
	line-height:0;
	}
	.BioTopNav li {
		list-style: none outside;
		padding:0;
		margin:0;
		line-height:0;
		}
	
.BioTopNav a {
	display:block;
	float:left;
	height:30px;
	background:url(../../images/biotopnav.png) no-repeat; 
	text-indent:-9000px;
	}
	
.BioTopNav a.BioNavHome  {
	background-position:0 0;
	width: 80px;
	}	
	.BioTopNav a.BioNavHome:hover  {
		background-position:0 -30px;
		}
		
.BioTopNav a.BioNavCheckmate  {
	background-position:-80px 0;
	width:276px;
	}	
	.BioTopNav a.BioNavCheckmate:hover  {
		background-position:-80px -30px;
		}
		
.BioTopNav a.BioNavAboutJeff  {
	background-position:-356px 0;
	width:148px;
	}	
	.BioTopNav a.BioNavAboutJeff:hover  {
		background-position:-356px -30px;
		}
		
.BioTopNav a.BioNavOAFT  {
	background-position:-504px 0;
	width:105px;
	}	
	.BioTopNav a.BioNavOAFT:hover  {
		background-position:-504px -30px;
		}
		
.BioTopNav a.BioNavAboutGord  {
	background-position:-609px 0;
	width:160px;
	}	
	.BioTopNav a.BioNavAboutGord:hover  {
		background-position:-609px -30px;
		}
		
.BioTopNav a.BioNavWhyWeAreHere  {
	background-position:-769px 0;
	width:171px;
	}	
	.BioTopNav a.BioNavWhyWeAreHere:hover  {
		background-position:-769px -30px;
		}
		
			
/* ---------------------------------------- Content Area */
	
#Wrapper {
	width: 940px;
	margin: 0 auto;
	background: url(../../images/wrapper-bg.png) repeat-y;
	}
	
#ContentHome {
	float:left;
	width:700px;
	margin-top:40px;
	padding-bottom:40px;
	background: url(../../images/home-jeff.jpg) no-repeat right bottom;
	}	
	.HomeThereIsHelp {
	width:410px;
	}
	
#Content {
	float:left;
	width:700px;
	margin:40px 0 40px 0;
	}

.MainPageCallout a {
	float:left; 
	display:block;  
	margin:25px 20px 0 0;
	padding-bottom:20px;
	height:232px;
	width:219px;
	background: no-repeat; 
	text-indent:-9000px;
	background-position:0 0;
	}
	.MainPageCalloutLast a {
		float:left; 
		display:block;  
		margin-top:25px;
		padding-bottom:20px;
		height:232px;
		width:219px;
		background: no-repeat; 
		text-indent:-9000px;
		background-position:0 0;
			}
			.MainPageCallout a:hover, .MainPageCalloutLast a:hover {
				background-position:-219px 0;
				}
				
				
				
/* ---------------------------------------- Form Elements */

.RadioButtons {
	padding-right:5px;
	}
	
.Input { 
	background: #fff url(../../images/input-bg.gif) repeat;
	border: 1px solid #aeb2b4;
	margin:5px 0;
	padding:1px 0 0 5px;
	width:200px;
	height:20px; 
	}

.SearchInput { 
	background: #fff url(../../images/input-bg.gif) repeat;
	border: 1px solid #aeb2b4;
	margin:5px 0;
	padding:1px 0 0 5px;
	width:191px;
	height:20px; 
	}

/* ---------------------------------------- Accordian */

#accordion {
	padding-bottom:15px;
	}

.ui-accordion .ui-accordion-header { cursor: pointer; position: relative; margin-top: 20px; zoom: 1; }
.ui-accordion .ui-accordion-li-fix { display: inline; }
.ui-accordion .ui-accordion-header-active { border-bottom: 0 !important; }
.ui-accordion .ui-accordion-header a { display: block; padding: 10px 10px 10px 45px; }
.ui-accordion .ui-accordion-header .ui-icon { position: absolute; left:12px; margin-top: 11px; }
.ui-accordion .ui-accordion-content { margin-bottom:20px; border-top: 0; position: relative; overflow: auto; display: none; }
.ui-accordion .ui-accordion-content-active { display: block;}


#accordion .ui-icon-plus {background:url(../../images/h4-arrow-close.png) top left no-repeat; width: 21px; height:23px;}
#accordion .ui-icon-minus {background: url(../../images/h4-arrow-open.png) top left no-repeat; width: 21px; height:23px;}

h4 {
	background-color:#e0e6e9;
	font: 20px Georgia, Times New Roman, Times, serif;
	margin:15px 0 12px 0;
	border: 1px solid #fff;
	}	
	
	#accordion h4 a:link, #accordion h4 a:visited {
		color:#005581;
		text-decoration: none;
		}
		#accordion h4 a:hover, #accordion h4 a:active {
			color:#005581;
			text-decoration: underline;
			}
	
	.LookLikeP {
		font: 14px/22px Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
		}
	a:link .LookLikeP, a:visited .LookLikeP  {
		color: #b41515;
		text-decoration: none;
		}
		a:hover .LookLikeP , a:active .LookLikeP  {
			color: #b41515;
			text-decoration: underline;
			}



/* ---------------------------------------- Side Bar Callouts */

#SideBarCallouts {
	float:right;
	width: 200px;
	margin-top:40px;
	}

.SideText {
	margin-top:-7px;
	margin-left:48px;
	font:13px/22px Arial, Helvetica, sans-serif;
	}
	
.SidebarHr {
	margin:30px 0 40px 0;
	height: 10px;
	background: url(../../images/sidebar-hr.png) no-repeat;
	}
	.SidebarHr hr {
		display: none;
		}
		
.SearchTitle {
	height: 11px;
	text-indent: -9999px;
	background-repeat: no-repeat;
	background-position: left top;
	margin-bottom:5px;
	}
	
.SearchButton {
	margin-top:5px;
	float:right;
	}
		
		
		
/* ---------------------------------------- Side Bar Nav */

#SideBarNav {
	float:right;
	width: 219px;
	margin-top:20px;
	}
		
#SideNavHowIWork {
	width: 219px;
	height:153px;
	}
	#SideNavHowIWork a {
		display:block;
		height:51px;
		background: url(../../images/howiwork-sidenav.png) no-repeat;
		text-indent:-9000px; 
		}	
		
#SideNavHowIWork a.SideNav1 {
	background-position:0 0;
	}	
	#SideNavHowIWork a.SideNav1:hover {
		background-position:-219px 0;
		}
		
#SideNavHowIWork a.SideNav2 {
	background-position:0 -51px;
	}	
	#SideNavHowIWork a.SideNav2:hover {
		background-position:-219px -51px;
		}		

#SideNavHowIWork a.SideNav3 {
	background-position:0 -102px;
	}	
	#SideNavHowIWork a.SideNav3:hover {
		background-position:-219px -102px;
		}

#SideNavCaseStudies {
	width: 219px;
	height:197px;
	}
	#SideNavCaseStudies a {
		display:block;
		height:66px;
		background: url(../../images/casestudies-sidenav.png) no-repeat;
		text-indent:-9000px; 
		}	
		
#SideNavCaseStudies a.SideNav1 {
	background-position:0 0;
	}	
	#SideNavCaseStudies a.SideNav1:hover {
		background-position:-219px 0;
		}
		
#SideNavCaseStudies a.SideNav2 {
	background-position:0 -66px;
	}	
	#SideNavCaseStudies a.SideNav2:hover {
		background-position:-219px -66px;
		}		

#SideNavCaseStudies a.SideNav3 {
	background-position:0 -132px;
	}	
	#SideNavCaseStudies a.SideNav3:hover {
		background-position:-219px -132px;
		}
		
#SideNavFreeStuff {
	width: 219px;
	height:227px;
	}
	#SideNavFreeStuff a {
		display:block;
		height:81px;
		background: url(../../images/freestuff-sidenav.png) no-repeat;
		text-indent:-9000px; 
		}	
		
#SideNavFreeStuff a.SideNav1 {
	background-position:0 0;
	}	
	#SideNavFreeStuff a.SideNav1:hover {
		background-position:-219px 0;
		}
		
#SideNavFreeStuff a.SideNav2 {
	background-position:0 -81px;
	}	
	#SideNavFreeStuff a.SideNav2:hover {
		background-position:-219px -81px;
		}		

#SideNavFreeStuff a.SideNav3 {
	background-position:0 -162px;
	}	
	#SideNavFreeStuff a.SideNav3:hover {
		background-position:-219px -162px;
		}
		
#SideNavProducts {
	width: 219px;
	height:182px;
	}
	#SideNavProducts a {
		display:block;
		height:66px;
		background: url(../../images/products-sidenav.png) no-repeat;
		text-indent:-9000px; 
		}	
		
#SideNavProducts a.SideNav1 {
	background-position:0 0;
	}	
	#SideNavProducts a.SideNav1:hover {
		background-position:-219px 0;
		}
		
#SideNavProducts a.SideNav2 {
	background-position:0 -66px;
	}	
	#SideNavProducts a.SideNav2:hover {
		background-position:-219px -66px;
		}		

#SideNavProducts a.SideNav3 {
	background-position:0 -132px;
	height:51px;
	}	
	#SideNavProducts a.SideNav3:hover {
		background-position:-219px -132px;
		}
		

/* ---------------------------------------- Footer*/

#Footer { 
	background: url(../../images/footer-bg.png) repeat-y;
	width:940px;
	margin:0 auto;
	padding-bottom:12px;
	}
			
.SocialMedia {
	background: url(../../images/socialmedia-bg.png) no-repeat;
	width:940px;
	height:101px;
	margin:0 auto;
	}
	
	.SocialMedia .Facebook a {
		float:left; 
		display:block;  
		margin-top:35px;
		height:32px;
		width:144px;
		background:url(../../images/facebook-icon.png) no-repeat; 
		text-indent:-9000px;
		background-position:0 0;
		}
		.SocialMedia .Facebook a:hover {
			background-position:0 -32px;
			}
		
	.SocialMedia .Twitter a {
		float:left;
		display:block;  
		margin:35px 0 0 53px;
		height:32px;
		width:129px;
		background:url(../../images/twitter-icon.png) no-repeat; 
		text-indent:-9000px;
		background-position:0 0;
		}
		.SocialMedia .Twitter a:hover {
			background-position:0 -32px;
			}
			
	.SocialMedia .LinkedIn a {
		float:left;
		display:block;  
		margin:35px 0 0 53px;
		height:32px;
		width:141px;
		background:url(../../images/linkedin-icon.png) no-repeat; 
		text-indent:-9000px;
		background-position:0 0;
		}
		.SocialMedia .LinkedIn a:hover {
			background-position:0 -32px;
			}
			
	.SocialMedia .Blog a {
		float:left;
		display:block;  
		margin:35px 0 0 53px;
		height:32px;
		width:152px;
		background:url(../../images/blog-icon.png) no-repeat; 
		text-indent:-9000px;
		background-position:0 0;
		}
		.SocialMedia .Blog a:hover {
			background-position:0 -32px;
			}
			
	.SocialMedia .Newsletter a {
		float:left;
		display:block;  
		margin:35px 0 0 53px;
		height:32px;
		width:160px;
		background:url(../../images/newsletter-icon.png) no-repeat; 
		text-indent:-9000px;
		background-position:0 0;
		}
		.SocialMedia .Newsletter a:hover {
			background-position:0 -32px;
			}
			
	.SocialMedia .PANewsletter a {
		float:left;
		display:block;  
		margin:35px 0 0 53px;
		height:32px;
		width:160px;
		background:url(../../images/pa-newsletter-icon.png) no-repeat; 
		text-indent:-9000px;
		background-position:0 0;
		}
		.SocialMedia .PANewsletter a:hover {
			background-position:0 -32px;
			}
			
.Copyright {
	margin-top:17px;
	font: 12px Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
	color:#000;
	float:left;
	}
	
.FooterLinks {
	margin-top:16px;
	font: 14px Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
	color:#000;
	float:right;
	}
	.FooterLinks a:link, .FooterLinks a:visited {
		color:#000;
		}		
	.FooterLinks a:hover, .FooterLinks a:active {
		color:#000;
		}
	
.SiteByRKD {
	clear:both;
	padding:35px 0 0 0;
	font: 12px Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
	color:#8e9193;
	}
	.SiteByRKD a:link, .SiteByRKD a:visited {
		color:#8e9193;
		}
	.SiteByRKD a:hover, .SiteByRKD a:active {
		color:#8e9193;
		}
