/* 
* @website www.hartdesign.co.nz/ 
* @updated 7/05/2010
*
*/

/* MAIN LAYOUT */

body { margin: 0px auto; background-color: #fff; }
div#header { height: 134px; padding-top: 16px; width: 100%; margin: 0px auto; background: url(../img/header.png); background-repeat: no-repeat; background-position: center; background-color: #FFF; }
div#header-vm { height: 134px; padding-top: 16px; width: 100%; margin: 0px auto; background: url(../email-marketing/img/header.png); background-repeat: no-repeat; background-position: center; /* background-color: #FFF; */ }
div#header-sml { height: 112px; padding-top: 6px; width: 715px; margin: 0px auto; background: url(../img/header-sml.png); background-repeat: no-repeat; }
div#header-nav-container { margin: 0px auto; width: 910px; position: relative; top: 13px; }
div#canvas { background-image: url(../img/bg-canvas.gif); background-repeat: repeat-y; background-position: right; background-color: #F7F7F7; }
div#nav { margin: 0px auto; width: 916px; padding: 4px 2px; }
div#content-home { margin: 0px auto; width: 920px; border-top: 1px solid black; padding-bottom: 20px; }
div#canvas-blank { width:100%; background-color: #FFF; }
div#flash { margin: 0px auto; width: 920px; height: 300px; /* background-image: url(../img/home-features/rotator.php); background-repeat: no-repeat; */ }
div#feature { margin: 0px auto; width: 100%; background-image: url(../img/bg-feature.gif); background-repeat: repeat-x; height: 270px; }
div#feature-content { margin: 0px auto; width: 910px; height: 238px; padding: 35px 0px 0px 10px; }
div#wrapper { width: 920px; margin: 0px auto; padding-bottom: 60px; background: url(../img/bg-wrapper.gif); background-repeat: repeat-y; background-position: top center; }
div#left { width: 247px; float: left; padding: 0px; }
div#left-content { width: 200px; padding: 0px; }
div#content { position: relative; top: -20px; width: 633px; float: right; padding: 0px 40px 0px 0px; margin: 0; }
div#content-sml { width: 633px; padding: 0px 41px 0px 41px; margin: 0 auto; }
div.clearing { clear: both; }
div.clearingForm { clear: both; height: 3px; }
div#footer { width: 100%; margin: 0px auto; padding-top: 28px; background-image: url(../img/bg-footer.gif); background-repeat:repeat-x; height:141px; }
div#footercontent-1 { width: 240px; background: url(../img/footer-sep.gif) no-repeat right; height: 141px; float: left; }
div#footercontent-2 { width: 230px; background: url(../img/footer-sep.gif) no-repeat right; height: 141px; float: left; }
div#footercontent-3 { width: 230px; background: url(../img/footer-sep.gif) no-repeat right; height: 141px; float: left; }
div#footercontent-4 { width: 220px; height: 141px; float: left; }
div#gallery { width: 160px; float: left; margin: 10px 20px 0px 0px; }
div#followUs { margin: 0px auto; width: 920px; background: url(../img/bg-followUs.gif) no-repeat; padding: 6px 0px 22px 0px; } 

/* Follow Us */
#followUs p { font: 10px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; font-weight: bold; color: #999; float: left; margin: 16px 0px 12px 20px; padding: 0px; }
#followUs h2 { font: 10px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; font-weight: bold; color: #999; float: right; margin: 16px 20px 12px 0px; padding: 0px; text-transform:uppercase; }
#followUs a { color: #999; text-decoration: none; }
#followUs a:hover { color: #09F; text-decoration:underline; }
#followUs a:active { color: #333; text-decoration:none; }
#followUs .textfield { border: 0px; background: url(../img/textbox.gif) no-repeat; padding: 2px 5px 0px 5px; width: 110px; height: 18px; }
#followUs .subForm { float: right; position: relative; top: -4px; padding-left: 2px; }
#followUs .btnGo { position: relative; top: -2px; }

/* HEADER STYLING */
/* h1 provides top menu styling */
#header h1, #header-sml h1, #header-vm h1 { margin: 0px auto; padding: 98px 10px 0px 0px; font: 11px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; font-weight: bold; color: #999; float: left; }
#header .highlight, #header-sml .highlight, #header-vm .highlight { color: #999; padding: 0px 1px; }
#header h2, #header-sml h2, #header-vm h2 { width: 900px; margin: 0px auto; padding: 0px 10px; font: 11px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; font-weight: bold; color: #000; }
#header h3, #header-sml h3, #header-vm h3 { margin: 0px auto; padding: 98px 15px 0px 10px; font: 11px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; font-weight: bold; color: #999; float: right; }
#header a, #header-sml a, #header-vm a { color: #e30020; text-decoration: none; }
#header a:hover, #header-sml a:hover, #header-vm a:hover { color: #000; }
#header a:active, #header-sml a:active, #header-vm a:active { color: #999; }
#header .active, #header-vm .active { color: #000; }

/* FEATURE STYLING */
#feature-content h1 { margin: 15px 0px; width: 430px; padding: 0px; font: 17px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; font-weight: normal; color: #FFF; }

/* LEFT CONTENT STYLING */
#left-content h2 { font: 13px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #e30020; margin: 4px 0px 4px 8px; }
#left-content h3 { font: 11px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #000; margin: 4px 0px 8px 8px; }
#left-content p { font: 11px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #555; margin: 10px 47px 4px 8px; }
#left-content ul { margin: 4px 0px; padding: 0px 0px 0px 30px; }
#left-content li { list-style-image: url(../img/bullet.gif); font: 11px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #555; line-height: 16px; margin: 0px; }
#left-content .active { font-weight: bold; color: #555; } 

/* LOGIN FORM */
#left form { margin-left: 8px; }
#left label {font: bold 11px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #555; margin: 0px 47px 0px 0px; }
#left input { border: none; margin: 4px 0px; padding: 4px 3px; width: 154px; height: 15px; background-image: url(../email-marketing/img/left-text-box.png); }
#left .button { border: none; margin: 2px 0px; padding: 0px; width: auto; height: auto; background: none; }

/* NAV STYLING - HOME PAGE */
#nav h1 { margin: 0; font: 11px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; font-weight: normal; color: #888; margin: 6px 6px 6px 0px; float: left; text-transform: uppercase; }
#nav h2 { margin: 0; font: 11px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; font-weight: bold; color: #888; margin: 6px 0px; float: left; }
#nav h3 { margin: 0; font: 11px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; font-weight: bold; color: #888; margin: 6px 0px; float: right; }
#nav a { color: #000; text-decoration: none; }
#nav a:hover { color: #e30020; }
#nav a:active { color: #999; }

/* MENU STYLING */
#mainNav { position: relative; top: -20px; font: 13px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; font-weight: bold; margin: 0px; padding: 0px; list-style-image: none;list-style-type: none; }
#mainNav ul { margin: 0px; padding: 0px; font: 13px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; font-weight: bold; color: #FFF; }
#mainNav ul li { width: 231px; display: block; list-style: none; margin: 0px; padding: 12px 8px 12px 8px; height: 17px; background-image: url(../img/bg-menu.png); background-repeat: no-repeat; }
#mainNav a { color: #555; text-decoration: none; padding: 0px; display: block; }
#mainNav a:hover { color: #e30020; text-decoration: none; }
#mainNav a:active { color: #000; text-decoration: none; }
#mainNav ul li:hover { background-image: url(../img/bg-menu-over.png); background-repeat: no-repeat; color: #e30020; }
#mainNav .active { background-image: url(../img/bg-menu-active.png); background-repeat: no-repeat; height: 17px; } 

/* Fonts */
#content h1, #content-sml h1 { clear: both; font: 21px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #e30020; font-weight: normal; margin: 0px; padding: 8px 0px; }
.highlight { font-weight: bold; color: #C40202; }
#content h2, #content-sml h2 { margin: 12px 0 0px 0; font: 13px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #999; font-weight: bold; text-transform: uppercase; }
#content h3, #content-sml h3 { clear: both; margin-bottom: 8px; font: 12px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #e30020; font-weight: bold; padding: 3px 5px 4px 5px; border-top: 1px dotted #999999; border-bottom: 1px dotted #999999; }
#content h4, #content-sml h4 { background: #f0f0f0; height: 14px; float: left; width: 130px; font: 12px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #000; font-weight: bold; padding: 4px 6px; margin: 0px; }
#content h5, #content-sml h5 { background: #f0f0f0; height: 14px; float: left; width: 330px; font: 12px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #000; font-weight: normal; padding: 4px 6px; margin: 0px; }
#content h6, #content-sml h2 { margin: 0px 0 5px 0; font: 11px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #000; font-weight: bold; }
#content p, #content-sml p { margin: 5px 0 5px 0; font: 12px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #000; padding: 0px; line-height: 21px; }
#content ul, #content-sml ul { margin: 4px 0px; }
#content li, #content-sml li { list-style-image: url(../img/bullet.gif); font: 12px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #000; line-height: 16px; }

#left p { margin: 0; font: 11px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #000; margin: 4px 47px 4px 13px; }
#gallery p { margin: 0; font: 11px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #888; margin: 4px 0px; text-align: center; }
#gallery img { border: 1px dotted silver; }

#portfolio { margin: 0px auto; }
#portfolio .portfolio { width: 135px; height: 96px; padding: 2px; border: 2px solid #ccc; margin: 10px 10px 0px 0px; }
#portfolio img:hover { border: 2px solid #e30020; }

#content-home h1 { font: 21px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #e30020; font-weight: normal; text-align: center; margin: 0px; padding: 22px 0px 4px 0px; }
#content-home h2 { font: 13px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #c00; font-weight: bold; text-align: center; margin: 0px; padding: 12px 0px 4px 0px; }
#content-home p { margin: 5px 0px; font: 12px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #000; text-align: center; padding: 0px; line-height: 21px; }

/* Links */
#content a, #content-sml a, #content-home a { color: #555; text-decoration: underline; }
#content a:hover, #content-sml a:hover, #content-home a:hover { color: #e30020; text-decoration: none; }
#content a:active, #content-sml a:active, #content-home a:active { color: #555; text-decoration: none; }
#feature-content a { color: #FFF; text-decoration: underline; }
#feature-content a:hover { color: #e30020; text-decoration: none; }
#feature-content a:active { color: #DDD; text-decoration: none; }
#left-content a, #content-sml a { color: #e30020; text-decoration: none; }
#left-content a:hover, #content-sml a:hover { color: #e30020; text-decoration: underline; }
#left-content a:active, #content-sml a:active { color: #000; text-decoration: none; }
#gallery a { color: #666; text-decoration: none; }
#gallery a:hover { color: #e30020; text-decoration: none; }
#gallery a:active { color: #333; text-decoration: none; }

/* Lists */
#middle li { line-height: 18px; margin: 0px; padding: 0px; list-style-image: url(../img/right.ul.gif); margin: 0; font: 0.7em "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #6B017D; }

/* Footer styling */
#footer h1 { margin: 0px auto; font: 10px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #888; padding: 0px 0px 10px 0px; font-weight: normal; text-align: center; }
#footer h3 { margin: 0px auto; font: bold 11px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; text-align: left; color: #4c4c4c; padding: 13px 0px 3px 0px; }
#footer p { margin: 0px auto; width: 920px; font: 10px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; text-align: center; color: #888; padding: 0px 0px 20px 0px; }
#footer ul { margin: 0px 0px; padding: 0px; }
#footer li { list-style: none; font: 11px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #8b8b8b; line-height: 16px; }
#footer a { color: #6b6b6b; text-decoration: none; }
#footer a:hover { color: #e30020; }
#footer a:active { color: #333; }
#footer hr { border: none; border-top: 1px dotted #4c4c4c; padding: 0px; margin: 6px 0px; }

/* Misc. */
#content .textarea { background: #f1f1f1; border: #e30020 1px solid; padding: 4px 2px; margin: 0px 1px; width: 420px; height: 90px;font: 10px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #333; position: relative; top: 0px; }
#content .textbox { background: #f1f1f1; border: #e30020 1px solid; padding: 4px 2px; margin: 0px 1px; width: 255px; height: 12px;font: 10px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #333; position: relative; top: 0px; }
#content .textbox-sml { background: #f1f1f1; border: #e30020 1px solid; padding: 4px 2px; margin: 0px 1px; width: 55px; height: 12px;font: 10px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #333; text-align: right; position: relative; top: 0px; }
#content .btnSubmit { margin: 5px 0px 0px 143px; }
#content .btnReset { background-image: url(../images/btn-reset.gif); border: none; width: 64px; height: 24px; }
#content .btnSubscribe { background-image: url(../images/btn-subscribe.gif); border: none; width: 76px; height: 24px; }
#content .img { margin: 0 5px 0 0; padding: 1px; border: 2px solid #cccccc; float: left; }
hr { border: none; border-top: 1px dotted #C40202; }
.spacer { padding: 0px 1px; font-weight: normal; text-transform: capitalize; }
.icon { float: left; margin: 0px 10px 30px 0px; clear: left; }
.image-right { float: right; margin: 0px 0px 20px 10px; }
.labelText { font: 10px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #333; position: relative; top: -2px; }
.thumbs { width: 95px; height: 80px; margin: 0px 15px 10px 0px;}
.web650-gallery { margin-right: 11px; }
.border0 { border: none; }

#map_canvas { background: #f0f0f0; font: 12px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #e30020; }
.tableHrd { background: #e30020; font: bold 11px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #fff; text-transform: uppercase; }
.tableRow1 { background: #fff; font: 11px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #000; }
.tableRow2 { background: #f0f0f0; font: 11px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #000; }
.tableTotal { background: #ccc; font: bold 11px "Lucida Grande","Tahoma","Trebuchet MS",Arial,Helvetica,sans-serif; color: #000; border-top: 1px solid #000; }