
/*--------------------------
	CSS by Rod Miles	
	One Grey Paw
	www.OneGreyPaw.com
	
	July 2008
	
	CSS Styles for
	StatusMedia.ca
----------------------------*/
 
 
/*----------------------
	Imports
-----------------------*/

@import url('content.css'); 
@import url('mainmenu.css'); 


/*----------------------
	Global Reset
------------------------*/

* {
margin:0;
padding:0;
}

h1,h2,h3,h4,h5,h6,blockquote,form,label,ol,dl,fieldset,address {
margin:0.5em 0;
}

dd { margin-left:1em; }

fieldset { padding:.5em; }

img { border: none; }

p { padding: 0; margin: 0.6em 0 0.8em 0; }

 
/*----------------------
	HTML Items
-----------------------*/
 
body
	{
	margin: 0;
	padding: 0;
	font: 100.01%/120% arial,helvetica,geneva,verdana,sans-serif;
	color: #4D4D4D;
	text-align: center;	
	background: #fff url('../images/body-bg.gif') repeat-x 0 0;
	}
 
h1,h2,h3 { font: normal normal 2.3em arial,helvetica,verdana,sans-serif; color: #50AF50; }
h1 { margin: 0 0 0.3em 0; padding: 0; border-bottom: 1px solid #ccc; }
h2 { font-size: 1.7em; margin: 0.8em 0 0.5em 0; padding-bottom: 0; }
h3 { font-size: 1.4em; font-weight: bold; margin: 0.8em 0 0.5em 0; padding-bottom: 0; }

a { color: #547AAF; }
a:hover { color: #999; text-decoration: none; }
a:active { color: #3F9C47; }




/*----------------------
	Layout Items
-----------------------*/

#mainWrapper
	{
	position: relative;
	width: 100%;
	margin: 0 auto;
	padding: 0;	
	text-align: center;
	font-size: 75%;
	}

#header, #content, #footerInside
	{
	position: relative;
	width: 902px;
	height: auto;
	text-align: left;
	margin: 0 auto;
	padding: 0;
	}	
 
#header
	{
	height: 156px;
	background: url('../images/header-bg.jpg') no-repeat 100% top;
	}

#topMenu
	{
	float: right;
	height: 58px;
	margin: 0 20px 0 0;
	text-align: right;
	font-size: 0.9em;
	background: url('../images/header-phone.gif') no-repeat 100% 0;
	}

#smLogo
	{
	position: relative;
	float: left;
	width: 308px;
	height: 122px;
	margin: 0;
	background: url('../images/status-media-logo.jpg') no-repeat 0 0;
	}
	
#breadcrumbs 
	{ 
	font-size: 0.9em; 
	margin: 3px 0 1.1em 0; 
	color: #999;
	}

#mainMenu
	{
	position: relative;
	z-index: 200;
	clear: both;
	width: 100%;
	height: 35px;
	margin: 0;
	text-align: left;
	background: url('../images/mainmenu-bg.gif') no-repeat 0 0;
	}

#content
	{
	clear: both;
	padding: 1px 0;
	z-index: 1;
	height: auto;
	overflow: hidden;
	}

* html #content { z-index: -1 } /*for dd menus*/

#contentBody
	{
	position: relative;
	padding: 0 0 1em 0;
	line-height: 1.5em;
	float: right;
	width: 655px;
	}

#midPanel
	{
	position: relative;
	float: left;
	width: 415px;
	}
	
#rightPanel
	{
	position: relative;
	float: right;
	width: 210px;
	height: auto;
	padding: 55px 0 2.5em 0;
	line-height: 1.5em;
	}

#leftPanel
	{	
	position: relative;
	float: left;
	width: 230px;
	margin: 10px 0 0 8px;
	height: auto;
	}

#footer
	{
	width: 100%;
	clear: both;
	margin: 2em 0;
	padding: 0;
	font-size: 1em;
	background: url('../images/footer-bg.gif') repeat-x 0 0;
	}

#footerMenu 
	{
	padding: 0;
	float: left;
	color: #fff;
	background: url('../images/footer-bg-inside.jpg') no-repeat top center;
	height: 147px;
	width: 100%;
	overflow: hidden;
	margin-top: 5px;
	line-height: 1.3em;
	}

#footerInfo
	{
	clear: both;
	padding: 1em 0;
	margin: 0;
	line-height: 1.5em;
	font-size: 0.9em;
	color: #888;
	}

#footerLinks
	{
	float: right;
	width: 54%;
	text-align: right;
	}

/*--------------------------------
	Menus (exlcluding mainmenu)
---------------------------------*/

#topMenu ul { margin: 0; padding: 10px 0 0 0; list-style: none;  }
#topMenu ul li { margin: 0; padding: 0 0 0 5px; display: inline; }
#topMenu ul li .pipe { color: #4BB546 !important; padding: 0 5px 0 0; }
#topMenu ul li a { color: #777; text-decoration: none; padding: 0 6px 0 0; }
#topMenu ul li a:hover { color: #ccc; text-decoration: underline; }
#topMenu ul li a:active { color: #999; text-decoration: none; }

#breadcrumbs ul { margin: 0; padding: 0; list-style: none; }
#breadcrumbs ul li { margin: 0; padding: 0 3px 0 0; display: inline; }
#breadcrumbs a { background: url('../images/bc-arrow.gif') no-repeat 100% 5px; padding-right: 10px; }

.leftMenu { background: url('../images/lm-bg.gif') no-repeat 0 bottom; padding-bottom: 0; margin-bottom: 2em; font-size: 0.9em; }
.leftMenu ul { padding: 0 0 10px 0; margin: 12px 0 0 28px; color: #378B47; list-style: none; }
.leftMenu ul li { padding: 0; list-style: none; }
.leftMenu ul li a { color: #777; text-decoration: none; border-left: 2px solid #547AAF; padding: 0 5px; }
.leftMenu ul li a:hover { color: #fff; border-width: 0px; background-color: #547AAF; }
.leftMenu ul li a:active { border-width: 0px; background-color: #3F9C47; }
.leftMenu ul ul { margin: 0 0 0 15px; }
.leftMenu ul ul li a { border-left: 2px solid #3F9C47; }
.leftMenu ul ul li a:hover { background-color: #3F9C47; }
.leftMenu ul ul li a:active { background-color: #547AAF; }

.leftMenuHeading { width: 220px; height: 24px; }
#lmSignage.leftMenuHeading { background: url('../images/lm-digital-signage.gif') no-repeat 0 0; }
#lmVideo.leftMenuHeading { background: url('../images/lm-video-02.gif') no-repeat 0 0; }
#lmDvd.leftMenuHeading { background: url('../images/lm-dvd.gif') no-repeat 0 0; }
#lmWeb.leftMenuHeading { background: url('../images/lm-web-design.gif') no-repeat 0 0; }
#lmDesign.leftMenuHeading { background: url('../images/lm-design.gif') no-repeat 0 0; }
#lmCompany.leftMenuHeading { background: url('../images/lm-company.gif') no-repeat 0 0; }
#lmClient.leftMenuHeading { background: url('../images/lm-client.gif') no-repeat 0 0; }

.footerMenu { float: left; width: 167px; padding: 22px 0 0 0; margin: 0 78px 0 0; }
.footerMenu ul { margin: 0 0 0 15px; padding: 0; list-style: none; }
.footerMenu ul li { margin: 0; padding: 0;  }
.footerMenu a { color: #fff; text-decoration: none; padding: 0 6px 0 0; }
.footerMenu a:hover { color: #ccc; text-decoration: underline; }
.footerMenu a:active { color: #999; text-decoration: none; }

#fmProduction.footerMenu { background: url('../images/fm-production.gif') no-repeat 0 0; } 
#fmDesign.footerMenu { background: url('../images/fm-design.gif') no-repeat 0 0; } 
#fmClient.footerMenu { background: url('../images/fm-client.gif') no-repeat 0 0; } 
#fmContact.footerMenu { background: url('../images/fm-contact.gif') no-repeat 0 0; margin-right: 0; } 
#fmContact.footerMenu p { margin: 0 0 0 13px; padding: 0; }


/*----------------------
	Base Classes
-----------------------*/

.adobe { background: url('../images/adobe-icon.gif') no-repeat 0 0; padding-left: 20px; }

.clear { clear: both; }
	
.tBold { font-weight: bold; }
.tItalic { font-style: italic; }
.tSmall { font-size: 0.8em; }
.tLarge { font-size: 1.5em; }
.tCenter { text-align: center; }
.tBlue { color: #036; }

.imgR { float: right; margin: 0.8em 0 1em 1em; }
.imgL { float: left; margin: 0.8em 1em 1em 0; }
 
.horizBorder { border-top: 1px solid #ccc; height: 1px; }
.horizDouble { border-top: 3px double #ccc; height: 3px; }

.pipe { padding: 0 4px; color: #c93; }

.required { color: #974D73; font-weight: bold; }

.noShow, #smLogo b { display: none; }