
/* ----- CNC CSS FRAMEWORK v1.1 ---------------------------------------------------- */
/* ----- Created by Creative Nature Communications 2010/1/12 ----------------------- */
/* ----- McCulloch Suzuki Website  ------------------------------------------------- */
/* ----- Credits: UX: Tim Paul, DEV: Khalid Balkhi  -------------------------------- */


/* TABLE OF CONTENTS

00 - Global Includes
01 - Typography 
02 - Main Structure - The core Structure + Homepage + Common Styles
03 - Internal Page Styles 	
04 - Products Area Styles (please goto products.css)

*/

/* 00 - Global Includes  */
/* --------------------------------------------------------------------------------------------------------------------------- */


@import url(cssreset.css);
@import url(navigation.css);
@import url(modules/modules.css);


/* 01 - Typography  */
/* --------------------------------------------------------------------------------------------------------------------------- */


html { font-size:16px; } 

body {
	font-family: Tahoma, Arial, Helvetica, sans-serif;

	font-size: 62.5%; /* 16px * 62.5% = 10px : 1em now = 10px */
	
	line-height: 1.8em;
	color: #000;
	width: 100%;
	margin: 0;
	background: #282828 url(../Images/main-wrap-bg.jpg) center top repeat-x;
}
h1 {
	color: #fff;
	font-size: 5.0em;
	letter-spacing: -0.09em;
	line-height: 1.0em;
	font-weight: bold;
	margin: 0 0 0.5em 0;
}
#h1-page-title {
	clear: both;
	margin: 40px 0 0 30px;
	padding: 0;
	display: block;
	float: left;
	width: 920px;
	position: relative;
	z-index: 4
}
h2 {
	color: #cccccc;
	font-size: 3.8em;
	letter-spacing: -0.09em;
	line-height: 1.0em;
	font-weight: bold;
	margin: 0 0 0.5em 0;
}
h3 {
	color: #7e7e7e;
	font-size: 4.7em;
	letter-spacing: -0.07em;
	line-height: 1.0em;
	font-weight: bold;
	margin: 0 0 0.5em 0;
}
#h3-contct {
	color: #066bb1;
	margin: 0 0 0.5em 0;
}
.internal #h3-contct {
	color: #d70b0b;
}
h4 {
	color: #fff;
	font-size: 2.8em;
	letter-spacing: -0.05em;
	line-height: 1.0em;
	font-weight: bold;
	margin: 0 0 0.5em 0;
}
#d-footer h4 {
	color: #1a1a1a	
}
#h4-u-r-here {
	color: #4490d6;
	letter-spacing: -0.07em;
	width: 195px;
	float: left;
	margin: 0;
}
h5 {
	color: #80a834;
	font-size: 1.9em;
	letter-spacing: -0.05em;
	line-height: 1.0em;
	font-weight: normal;
	margin: 0 0 0.5em 0;
}
h6 {
	color: #80a834;
	font-size: 1.3em;
	letter-spacing: -0.02em;
	line-height: 1.0em;
	font-weight: normal;
	margin: 0 0 0.5em 0;
}

ul{}
ol{}
li{}

a {
	color: #C7C7C7;
	text-decoration: none;
}
a:hover {
	color: #fff;
	text-decoration: underline;
}
.mainContent img {
	border: 6px solid #f2ead5;
	padding: 1px;
	background: #fff;
}
p {
	clear: left;
	line-height: 1.70em;
	color: #8a8a8a;
}
.d-cms-input p, .d-cms-input ul, .d-cms-input ol, .d-cms-input table, .d-rightCol p, .d-cms-input span
{
	font-size: 1.0em;
	line-height: 1.9em;
	color: #898888;
}
.home .d-cms-input p {
	color: #c7c7c7;
}
.d-cms-input table p, .d-cms-input table ul, .d-cms-input table ol, .d-cms-input table table {
/*	font-size: 1.0em;*/
}
.d-cms-input table p.p-first {
	margin: 0;
}
.d-cms-input ul, .d-cms-input ol {
	color: #7fb033;
	background: #f9f9f9;
	padding: 0.5em 15px;
}
.d-cms-input ul li {
	list-style: outside circle;
	padding: 0.5em 0 0.5em 15px;
}
.d-cms-input ol li {
	list-style: outside lower-roman;
	padding: 0.5em 0 0.5em 15px;
}
.d-cms-input ul ul, .d-cms-input ol ol, .d-cms-input ul ol, .d-cms-input ol ul {
	font-size: 1.0em;
	color: #62911a;
}
.d-cmsInput.homePage p {
	font-size: 1.5em;
	letter-spacing: -0.06em;
	font-weight: normal;
	color: #5b6e1b;
	margin: 0;
}
p.p-first {
	font-size: 1.50em;
	line-height: 1.8em;
	letter-spacing: -0.02em;
	color: #078fee;
	margin: 0 0 1.2em 0;
}
.p-copyright {
	font-size: 1.0em;
	color: #066bb1;
	padding: 1.5em 0 0 5px;
	margin: 0;
}
#p-copyRight strong {
	color: #fff;
}
.hidden {
	display: none;
}

/* 02 - Main Structure - The core Structure + Homepage + Common Styles 
/* --------------------------------------------------------------------------------------------------------------------------- */

/* Core Div Structure Elements */

#d-cntainr {
	width: 970px;
	background: url(../Images/main-bg.jpg) center 11px no-repeat;
	margin: 0 auto;
	padding: 0;
	font-size: 1.2em;
	min-height: 627px;
}
#d-lft-strps {
	width: 100%;
	height: 630px;
	position: absolute;
	z-index: 3;
	background: url(../Images/bg-strpes-lft.png) top center no-repeat;
	margin: 0;
}
#d-rght-strps {
	width: 100%;
	height: 630px;
	position: absolute;
	z-index: 1;
	background: url(../Images/bg-strpes-rght.png) top center no-repeat;
	margin: 0;
}

#d-header {
	width: 100%;
	clear: left;
}
#d-pge-optns {
	float: right;
	clear: both;
	width: 235px;
	position: relative;
	z-index: 4;
}
#d-input-bg {
	width: 220px;
	min-height: 39px;
	float: right;
	background: url(../Images/search-bg.png) 0 0 no-repeat;
	padding: 0 0 0 15px;
}
#d-input-bg:hover {
	background: url(../Images/search-bg-hov.png) 0 0 no-repeat;
}
#d-input-bg:hover input {
	color: #fff;
}
#d-mid-cntnt {
	width: 100%;
	clear: left;
	float: left;
	position: relative;
	z-index: 4;
	font-size: 0.9em;
	padding: 15px 0 0 0;
}
.d-lft-col, .d-mid-col, .d-rght-col {
	float: left;
}
.d-lft-col {
	width: 500px;
	padding: 15px 0 0 0;
	border-top: 12px solid #3e3e3e;
}
.d-mid-col {
	width: 200px;
	padding: 15px 40px 0 0;
	border-top: 12px solid #3e3e3e;
}
.d-rght-col {
	width: 200px;
	padding: 15px 0 0 0;
	border-top: 12px solid #066bb1;
}
#d-header .d-lft-col {
	width: 335px;
	border: none;
	padding: 0;
}
#d-header .d-rght-col {
	width: 635px;
	border: none;
	padding: 0;
}

.d-lft-col table {
	margin: -20px 0 0 -17px;
	table-layout: fixed;
}
.internal .d-lft-col table {
	margin: 0;
	padding: 10px;
	table-layout: auto
}












/* Other Core Structure Elements */

#a-mcs-logo {
	display: block;
	float: left;
	position: relative;
	z-index: 4;
	width: 325px;
	height: 90px;
	background: url(../Images/mcs-logo.png) 0 0 no-repeat;
	text-indent: -3000em;
	margin: 75px 0 0 10px;
	padding: 0;
	border: none;
}
#d-input-bg input {
	background: transparent;
	border: none;
	color: #078fee;
	width: 155px;
	font-size: 1.2em;
	line-height: 1.0em;
	padding: 12px 5px 10px 5px;
	float: left;
}
#d-input-bg input.i-go-btn {
	float: left;
	width: 30px;
	height: 30px;
	margin: 4px 0 0 18px;
	padding: 0;
	text-indent: -3000em;
	background: url(../Images/search-go-btn.png) 0 0 no-repeat;
	cursor: pointer;
}
#d-input-bg input.i-go-btn:hover {
	background-position: 0 -30px;
}


.ul-accsblty {
	display: block;
	float: left;
	margin: 10px 0 0 118px;
	padding: 0;
	width: 110px;
}
.ul-accsblty li, .ul-accsblty a {
	float: left;
	margin: 0;
	display: block;
	padding: 0;
	width: auto;
	height: 25px;
}
.ul-accsblty a {
	background: url(../Images/accssblty-btns.png) 0 0 no-repeat;
	border: none;
	margin: 0 0 0 2px;
	width: 25px;
	text-indent: -3000em;
}
.ul-accsblty a#a-toggleTextMinus {
	background-position: 0 0;
}
.ul-accsblty a#a-toggleTextPlus {
	background-position: -25px 0;
}
.ul-accsblty a#a-print {
	background-position: -50px 0;
}
.ul-accsblty a#a-down2Content {
	background-position: -75px 0;
}


.ul-accsblty a#a-toggleTextMinus:hover {
	background-position: 0 -25px;
}
.ul-accsblty a#a-toggleTextPlus:hover {
	background-position: -25px -25px;
}
.ul-accsblty a#a-print:hover {
	background-position: -50px -25px;
}
.ul-accsblty a#a-down2Content:hover {
	background-position: -75px -25px;
}
#content-starts {
	border: none;
	text-indent: -3000em;
	padding: 0;
}


#ul-news {
	float: left;
	padding: 0;
	margin: -7px 0 0 0;
	list-style: none;
	width: 200px;
}
#ul-news li {
	float: left;
	padding: 0;
	margin: 0 0 0.6em 0;
	width: 200px;
	list-style: none;
}
#ul-news li a {
	display: block;
	float: left;
	color: #7e7e7e;
	background: transparent;
	font-size: 1.1em;
	line-height: 1.6em;
	cursor: pointer;
	padding: 7px;
	margin: 0 0 0 -4px;
	width: 200px;
	border: none;
	font-size: 1.0em;
	line-height: 1.8em;
}
#ul-news li a:hover {
	background: #066bb1;
	color: #a9d6f5;
	text-decoration: none;
}
#ul-news .sp-itm-date {
	display: block;
	float: left;
	margin: 0;
	padding: 0 0 0.5em 0;
	width: 100%;
	font-weight: bold;
	color: #066bb1;
	line-height: 1.0em;
}
#ul-news li a:hover .sp-itm-date {
	color: #12354d;
}
#d-mid-cntnt .d-rght-col span, #d-page-cntnt .d-rght-col span {
	color: #7e7e7e;
	display: block;
	clear: left;
	padding: 0 0 1.2em 65px;
	line-height: 1.8em;
}
#sp-addr {
	background: url(../Images/mail-icn.png) 3px 3px no-repeat; 
}
#sp-sales-ph {
	background: url(../Images/store-icn.png) 1px 2px no-repeat; 
}
#sp-srvce-ph {
	background: url(../Images/service-icn.png) 4px 2px no-repeat; 
}
#sp-emails {
	background: url(../Images/email-icn.png) 4px 3px no-repeat; 
}
#sp-fax {
	background: url(../Images/fax-icn.png) 4px 4px no-repeat; 
}
#sp-fcebk {
	background: url(../Images/fcebk-icn.png) 4px 2px no-repeat; 	
}



/* Footer Area */

#d-footer {
	width: 970px;
	float: left;
	background: url(../Images/footr-bg.jpg) bottom center no-repeat;
	margin: 0 0 0 0;
	padding: 10px 0;
	border-top: 12px solid #171717
}
.ul-link-array {
	float: left;
	clear: left;
	width: 600px;
	margin: 5px 0 5px -5px;
	padding: 0;
}
.ul-link-array li {
	float: left;
	margin: 0 6px;
	padding: 0;
	list-style: none;
}
.ul-link-array li a {
	display: block;
	float: left;
	background: #373737;
	color: #6f6f6f;
	text-decoration: none;
	padding: 4px 8px;
	border: none;
	font-size: 0.95em;
}
.ul-link-array.bottom li a {
	background: #1b1b1b;
	color: #4b4b4b;
}
.ul-link-array li a:hover {
	background-color: #72a529;
	color: #f5ffa4;
}
.ul-link-array.bottom li a:hover {
	background-color: #507816;
	color: #c8e553;
}
#a-cnc-logo {
	display: block;
	float: right;
	margin: 0 15px 0 0;
	padding: 0;
	width: 77px;
	height: 42px;
	background: url(../Images/cnc-logo.png) 0 0 no-repeat;
	text-indent: -3000em;
	border: none;
}
#d-footer .d-lft-col {
	width: 650px;
	border: none;
	padding: 5px 0 0 0;
}
#d-footer .d-rght-col {
	width: 150px;
	float: right;
	margin: 0;
	padding: 10px 0 0 0;
	border: none;
}


/* 03 - Internal Page Styles 	
/* --------------------------------------------------------------------------------------------------------------------------- */

/* Core Div Structure Elements */

#d-cntainr.internal {
	background: url(../Images/main-bg-intrnl.jpg) center 11px no-repeat;
}
#d-page-cntnt {
	width: 100%;
	clear: left;
	float: left;
	position: relative;
	z-index: 4;
	font-size: 0.9em;
	padding: 0;
	margin: -12px 0 0 0;
}
#d-page-cntnt .d-lft-col {
	width: 735px;
	background:  url(../Images/page-cntnt-transp-bg.png) 0 0 repeat;
	border: none;
}
#d-lft-col-top {
	width: 735px;
	height: 12px;
	float: left;
	margin: 0 0 1px 0;
	background: #3e3e3e;
}
#d-page-cntnt .d-rght-col {
	width: 200px;
	padding: 15px 30px 0 0;
	background: url(../Images/page-cntnt-transp-bg.png) 0 0 repeat;
	border: none;
}
#d-rght-col-top {
	width: 230px;
	height: 12px;
	float: left;
	margin: 0 0 1px 1px;
	background: #d70b0b;
}
.internal .d-cms-input {
	width: 655px;
	margin: 0 0 0 35px;
	float: left;
	padding: 15px 0;
}
#d-bc-area, #d-bc-top, #d-bc-mid, #d-bc-bot {
	width: 681px;
	float: left;
}
#d-bc-area {
	margin: 0 0 0 10px;
}
#d-bc-top {
	background: url(../Images/bc-top.png) 0 0 no-repeat;
	height: 12px;
}
#d-bc-mid {
	background: url(../Images/bc-mid.png) 0 0 repeat-y;
	width: 631px;
	padding: 16px 25px 0 25px;
}
#d-bc-bot {
	background: url(../Images/bc-bot.png) 0 0 no-repeat;
	height: 12px;
}
.internal #d-footer .d-lft-col {
	padding: 5px 0 0 35px;
	width: 750px;
}





/* Other Core Structure Elements */

#ul-bc-lst {
	display: block;
	float: left;
	list-style: none;
	text-align: left;
	padding: 0 0 0 15px;
	margin: -2px 0 0 0;
	font-weight: normal;
	color: #3b520d;
	border: none;
	background: transparent;
	width: 420px;
}
#ul-bc-lst li {
	display: block;
	float: left;
	padding: 0 30px 0 0;
	margin: 0 15px 0 0;
	background: transparent;
	list-style: none;
	width: auto;
	font-size: 1.0em;
	color: #315009;
	background: url(../Images/bc-arrow.png) right 3px no-repeat; 

}
#ul-bc-lst li.li-last {
	background: none;
} 

#ul-bc-lst li a {
	display: block;
	float: left;
	color: #97caf9;
	line-height: 1.7em;
	text-decoration: none;
	margin: 0;
	padding: 0;
	min-height: 30px;
	background: transparent;
}
#ul-bc-lst li span {
	display: block;
	float: left;
	min-height: 30px;
}
.sp-bc-lft {
	width: 7px;
	background: url(../Images/bc-lft.png) 0 0 no-repeat; 
}
.sp-bc-rght {
	width: auto;
	background: url(../Images/bc-rght.png) top right no-repeat;
	padding: 5px 17px 0 10px; 
	min-height: 25px;
}
.li-last .sp-bc-lft {
	background: url(../Images/bc-txt-lft.png) 0 0 no-repeat; 
}
.li-last .sp-bc-rght {
	background: url(../Images/bc-txt-rght.png) top right no-repeat;
	color: #143a55;
}



#ul-bc-lst li a:hover {
	color: #9c9c9c
}
#ul-bc-lst li a:hover .sp-bc-lft {
	background: url(../Images/bc-lft-hov.png) 0 0 no-repeat; 
}
#ul-bc-lst li a:hover .sp-bc-rght {
	background: url(../Images/bc-rght-hov.png) top right no-repeat;
}



.internal #sp-addr {
	background: url(../Images/red-mail-icn.png) 3px 3px no-repeat; 
}
.internal #sp-sales-ph {
	background: url(../Images/red-store-icn.png) 1px 2px no-repeat; 
}
.internal #sp-srvce-ph {
	background: url(../Images/red-service-icn.png) 4px 2px no-repeat; 
}
.internal #sp-emails {
	background: url(../Images/red-email-icn.png) 4px 3px no-repeat; 
}
.internal #sp-fax {
	background: url(../Images/red-fax-icn.png) 4px 4px no-repeat; 
}
.internal #sp-fcebk {
	background: url(../Images/red-fcebk-icn.png) 4px 2px no-repeat; 	
}

.internal #d-page-cntnt .d-rght-col span {
	color: #7e7e7e;
	display: block;
	clear: left;
	padding: 0 0 1.2em 65px;
	line-height: 1.8em;

}








/* ---------- Easy Slider Styles  ------------------ */

#d-slid-contnr {
	height: 349px;
	width: 970px;
	clear: left;
	overflow: hidden;
}
#slider ul, #slider li{
	margin:0;
	padding:0;
	list-style: none;
	width: 970px;
	height: 349px;
}
#slider {
	width: 970px;
	height: 349px;
	overflow: hidden;
	margin: 0 0 0 0; 
	clear: both;
	position: relative;
	z-index: 2;
	position: relative;
}
#slider li {  /* ie 7 hacked */
/* define width and height of container element and list item (slide)
list items must be the same size as the slider area	*/ 
	overflow: hidden;
	margin: 0; 
	float: left;
}
/*--------- Slider Control Button Styles -----------------------------------------------*/
#d-sliderControl {
	position: absolute;
	z-index: 4;
	margin: -130px 0 0 0;
	width: 121px;
	height: 89px;
	background: url(../Images/slider-cntrl-bg.png) 0 0 no-repeat;
}
span#prevBtn, span#nextBtn {
	display: block;
	float: left;
}
span#prevBtn {
	margin: 30px 0 0 13px;
}
span#nextBtn { 
	margin: 30px 0 0 20px;
}
span#prevBtn a, span#nextBtn a {
	display: block;
	float: left;
	width: 36px;
	height: 47px;
	background: url(../Images/slider-cntrl-btns.png) no-repeat;
	text-indent: -3000em;
	margin: 0;
	padding: 0;
	outline: none;
	border: none;
}
span#prevBtn a:hover {
	background: url(../Images/slider-cntrl-btns.png) 0 -47px no-repeat;
}			
span#nextBtn a {
	background: url(../Images/slider-cntrl-btns.png) -38px 0 no-repeat;
}
span#nextBtn a:hover {
	background: url(../Images/slider-cntrl-btns.png) -38px -47px no-repeat;

}


