/* http://meyerweb.com/eric/tools/css/reset/ 
----------------------------------------------------------------------------------------- */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin : 0; padding : 0; border : 0; outline : 0; font-size : 100%; vertical-align : baseline; background : transparent; }
body { line-height : 1; }
ol, ul { list-style : none; }
blockquote, q { quotes : none; }
blockquote:before, blockquote:after, q:before, q:after { content : ''; content : none; }
:focus { outline : 0; }
ins { text-decoration : none; }
del { text-decoration : line-through; }
table { border-collapse : collapse; border-spacing : 0; }

/* Modified from: http://code.google.com/p/blueprintcss/ 
----------------------------------------------------------------------------------------- */
body { font : 75%/1.5 'calibri', Helvetica, Arial, Verdana, sans-serif; color:#333; background: fixed url(../images/bg_body.jpg) no-repeat #e6cf96}
h1,h2,h3,h4,h5,h6 { font-weight : normal; }
h1 { font-size : 3em; line-height : 1; margin-bottom : 0.5em; }
h2 { font-size : 2em; margin-bottom : .75em; }
h3 { font-size : 1.5em; line-height : 1; margin-bottom : 1em; }
h4 { font-size : 1.2em; line-height : 1.25; margin-bottom : 1.25em; }
h5 { font-size : 1em; font-weight: bold; margin-bottom : 1.5em; }
h6 { font-size : 1em; font-weight : bold; }
p { margin : 0 0 1.5em; }
ul, ol { margin : 0 1.5em 1.5em 0; }
ul { list-style-type : none; }
ol { list-style-type : decimal; }
dl { margin : 0 0 1.5em 0; }
dt { font-weight : bold; }
dd { margin-left : 1.5em;}
abbr, acronym { border-bottom-width : 0; }
address { margin-top : 1.5em; font-style : normal; }
del { color : #666; }
blockquote { margin : 1.5em 0; }
strong { font-weight : bold; }
em, dfn { font-style : italic; }
dfn { font-weight : bold; }
pre, code { margin : 1.5em 0; white-space : pre; }
pre, code, tt { font : 1em 'andale mono', 'monotype.com', 'lucida console', monospace; line-height : 1.5; } 
tt { display : block; margin : 1.5em 0; line-height : 1.5; }
table { margin-bottom : 1.4em; }
th { }
td { }
th,td { padding : 4px 10px 4px 0; }
tfoot { font-style : italic; }
caption { background : #ffc; }

/* http://meyerweb.com/eric/tools/css/diagnostics/ 
----------------------------------------------------------------------------------------- 

div:empty, span:empty, li:empty, p:empty, td:empty, th:empty { padding : 0.5em; background : yellow; }
*[style], font, center { outline : 5px solid red; } 
*[class=""], *[id=""] { outline : 5px dotted red; }
img[alt=""] { border : 3px dotted red; }
img:not([alt]) { border : 5px solid red; }
img[title=""] { outline : 3px dotted fuchsia; }
img:not([title]) { outline : 5px solid fuchsia; }
table:not([summary]) { outline : 5px solid red; }
table[summary=""] { outline : 3px dotted red; }
th { border : 2px solid red; }
th[scope="col"], th[scope="row"] { border : none; }
a[href]:not([title]) { border : 5px solid red; }
a[title=""] { outline : 3px dotted red; }
a[href="#"] { background : lime; }
a[href=""] { background : fuchsia; } 

----------------------------------------------------------------------------------------- */

html {text-align:center; color: black; overflow-y: scroll;}
img {border:none;}
.image_border {border:1px solid #CCCCCC; margin:0px 0px 4px; padding:4px;}
.border {border:1px solid #ccc; background:#fff; margin:4px; padding:2px}
.disclaimer-txt {font-size: 10px; padding-left:5px }
.script {font-family: Geneva, Arial, Helvetica, sans-serif}
pre { display:none }

/************************************************************************ FORM STYLING ************************************************************************/

form {font-family: 'calibri', 'lucida grande', Verdana, Geneva, sans-serif; overflow:hidden; padding-top:5px;}

.submit {width:180px; height:30px; background:#000; margin-top:4px; font-weight:bold;}

tr {border:none; border-collapse:collapse; padding: 10px; vertical-align:middle; text-align:right}
td {vertical-align:top; text-align:right}

table {margin-top:5px; margin-bottom:5px; line-height:130%; background:#fff; -moz-border-radius: 5px; -webkit-border-radius:5px;}

input {background:#fff; color:#435070; border:1px solid #ccc; font-family: 'calibri', 'lucida grande'; padding:5px 2px; font-size:12px; float:right; width:174px; margin-bottom:5px; text-transform:capitalize; -moz-border-radius: 3px; -webkit-border-radius: 3px;}

select {background:#eee; font-family: 'calibri', 'lucida grande'; border:1px solid #ccc; padding:1px 2px; font-size:12px; padding-left:5px; margin-bottom:5px; width:180px; float:right; -moz-border-radius: 3px; -webkit-border-radius:3px;}

textarea {background:#fff; text-transform:capitalize; color:#435070; font-family: 'calibri', 'lucida grande'; font-size:12px; border:1px solid #ccc; padding:5px 2px; float:right; padding-left:3px; width:173px; margin-bottom:5px; -moz-border-radius: 3px; -webkit-border-radius:3px; float:right}


/************************************************************************ <h> TAGS CSS ************************************************************************/

h1 {font-size:150%; color:#333333; font-weight:bold}
h2 {font-size:130%; color:#ffdd00; font-weight:bold;}
h3 {font-size:110%; color:#333333; font-weight:bold;}
h4 {font-size:100%; color:#323232}
h6 {font-size:90%; color:#cf9300;}

/************************************************************************ LIST ITEMS CSS ************************************************************************/

ul, li { list-style-image: url(../images/listImg.jpg); list-style-position:inside; }

li a:link {color:#333; text-decoration:underline; font-weight:bold; margin-left:3px}
li a:hover {color:#c68b00; text-decoration:underline; font-weight:bold}
li a:visited {color:#333; text-decoration:underline; font-weight:bold; margin-left:3px}

p a:link {color:#333; text-decoration:underline; font-weight:bold; margin-left:3px}
p a:hover {color:#c68b00; text-decoration:underline; font-weight:bold}
p a:visited {color:#c68b00; text-decoration:underline; font-weight:bold; margin-left:3px}

/************************************************************************ PSEUDO CLASSES CSS ************************************************************************/

a:link, a:visited {color:#c68b00; text-decoration:underline; font-weight:bold}
a:hover {color:#7d7c81;}

/******************************************************************************** HOMEPAGE BASE CSS ELEMENTS ************************************************************************/
#wrapper {width:100%; margin:10px auto 0px;}

#containerWrap {width:950px; padding:0px; margin:10px auto; position:relative;}
#hardhat {width:200px; height:186px; position:absolute; top:0px; left:765px; background-image:url(../images/bg_hardhat.png)}
#container {width:950px; overflow:hidden; padding-bottom:20px; margin:auto auto auto 0px; background: /*url(../images/bg_enquiry.jpg) repeat-x*/ #fff; border:10px solid #fff; -moz-border-radius: 10px; -webkit-border-radius: 10px;}


/******************************************************************************** HEADER ELEMENTS ************************************************************************/

#header {width:950px; background:url(../images/bg_header.jpg) #fff; height:100px;}
#header .logo {width:145px; height:122px; position:absolute; top:10px; left:40px; background:url(../images/header-logo.jpg) no-repeat}
#header .contact {width:270px; text-align:left; padding-right:5px; font-size:40px; font-weight:bold; color:#7d7c81;  position:absolute; top:5px; right:155px;}
#header .email {text-align:right; width:160px; padding-right:5px; font-size:20px; font-weight:bold; color:#7d7c81;  position:absolute; top:45px; right:25px;}
#header .slogan {text-align:left; width:310px; padding-right:5px; position:absolute; top:15px; left:200px;}

/******************************************************************************** TOPNAV ELEMENTS ************************************************************************/

#topNav {width:630px; height:10px; padding:5px 160px; border-bottom:3px solid #958000; text-align:left; background: url(../images/bg_topnav.jpg) #ffdd00}
#topNav a:link, a:visited {color:#fff}
#topNav a:hover {color:#c7db00}
#topNav .aboutUs {height:25px; color:#fff; padding-top:5px; float:left; padding-left:26px; margin-right:10px; background:url(../images/topNav1.jpg) no-repeat}
#topNav .Delivery {height:25px; color:#fff; padding-top:5px; float:left; padding-left:30px; margin-right:5px; background:url(../images/topNav2.jpg) no-repeat}
#topNav .Calculator {height:25px; color:#fff; padding-top:5px; float:left; padding-left:26px; margin-right:5px; background:url(../images/topNav3.jpg) no-repeat}
#topNav .contactUs {height:25px; color:#fff; padding-top:5px; float:left; padding-left:25px; margin-right:5px; background:url(../images/topNav4.jpg) no-repeat}
#topNav .cartSummary {width:135px; height:25px; color:#fff; font-weight:bold; padding-top:5px; float:right; padding-left:42px; background:url(../images/topNavCart.jpg) no-repeat}

/*************************************************************************************************************************************************************************/

#content {width:535px; padding: 10px 0px 10px 10px; text-align:justify; float:left; margin:0px 0px 5x; margin-left:205px; -moz-border-radius: 0px 0px 5px 5px; -webkit-border-radius: 0px 0px 5px 5px;}
.content-slideshow {width:531px; height:230px; border:1px solid #ccc; float:left}
#content-txt {width:214px; padding:10px 5px 5px; height:215px; margin-right:5px; border: 1px solid #ccc; background:#fff; float:left}
#content-txt h3 {text-align:left}
#quickEnquiry {width:190px; margin-left:5px; text-align:center; margin-top:0px; margin-bottom:10px; padding:50px 5px 20px 0px; background:#ffdd00; float:right; -moz-border-radius: 0px 0px 5px 5px; -webkit-border-radius: 0px 0px 5px 5px;}
#quickEnquiry a:link, a:visited {color:#c68b00}
#quickEnquiry a:hover {color:#c68b00}


#quickEnquiry2 {width:500px; margin-left:5px; margin-top:0px; margin-bottom:10px; padding:10px 5px 20px 0px; -moz-border-radius: 0px 0px 5px 5px; -webkit-border-radius: 0px 0px 5px 5px;}
#quickEnquiry2 a:link, a:visited {color:#c68b00}
#quickEnquiry2 a:hover {color:#c68b00}


.quickEnquiryButtons{ margin-top:20px;}




.promo-right {width:183px; clear:right; margin-left:5px; border: 1px solid #ccc; text-align:center; margin-bottom:10px; padding:0px 5px; background:#fff; float:right; -moz-border-radius: 5px; -webkit-border-radius:5px;}

#pageWrapper {width:740px; float:left; margin-top:0px; margin-left:8px; text-align:left;}

/******************************************************************************** NEWS CSS ************************************************************************/

#latestNews {width:175px; float:left; font-size:12px; background:#333; border: 1px solid #fff; color:#fff; margin-top:20px; margin-right:9px; text-align:left; padding:10px;  -moz-border-radius: 5px; -webkit-border-radius: 5px; }

.latestNewsArticle {width:175px; float:left; font-size:11px; color:#fff; border-bottom:2px solid #666; padding-bottom:5px; margin-top:0px; margin-bottom:3px; text-align:left;}
.latestNewsArticle a:link, .latestNewsArticle a:visited {color:#c68b00}
.latestNewsArticle a:hover {color:#ccc}
.newstitle{font-size:14px; color:#ccc}
#pageText {width:512px; float:left; background:#eee; border: 1px solid #ccc; margin-top:0px; text-align:left; padding:10px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }

#pageText p {margin-bottom:8px}

.latestPdf {width:140px; float:left; font-size:11px; background:url(../images/bg_pdf_downloads.jpg) top left no-repeat #333; padding-left:35px; padding-top:5px; color:#fff; border-bottom:2px solid #666; padding-bottom:5px; margin-top:0px; margin-bottom:3px; text-align:left;}
.latestPdf a:link, .latestPdf a:visited {color:#fff; text-decoration:none}
.latestPdf a:hover {color:#ffdd00}

/******************************************************************************** LEFT NAVIGATION CSS ************************************************************************/

#leftNav {width:210px; position:absolute; top:135px; left:10px; z-index:99; font-size:13px; padding-bottom:0px; -moz-border-radius: 0px 0px 0px 5px; -webkit-border-radius: 0px 0px 0px 5px; }

.leftNavMenu {float:left; width:200px; height:19px; background:#fff; text-align:left; padding:5px 3px 6px; padding-left:8px; -moz-border-radius: 5px; -webkit-border-radius: 5px; margin:3px 24px 0px; border:1px solid #a49583}

.leftNavPromo {width:175px; float:left; font-size:12px; background:#eee; border: 1px solid #ccc; color:#fff; margin-top:10px; margin-right:9px; text-align:left; padding:10px;  -moz-border-radius: 5px; -webkit-border-radius: 5px; }

.pdfLink {float:left; padding:10px; padding-left:50px; margin-bottom:5px; width:452px; clear:left; background:url(../images/bg_pdf.jpg) top left no-repeat #eee; text-align:left}

.pdfLink a:link {color:#333; text-decoration:underline; font-weight:bold; margin-left:3px}
.pdfLink a:hover {color:#c68b00; text-decoration:underline; font-weight:bold}
.pdfLink a:visited {color:#333; text-decoration:underline; font-weight:bold; margin-left:3px}

/******************************************************************************** FOOTER / BOTTOM LINKS CSS **********************************************************/

#copyright {padding:10px 20px; text-align:left; color:#666; font-weight:bold; float:left}
#companyAddress {padding:10px 20px; text-align:left; color:#666; font-weight:bold; float:left}
#footerWrap {width:990px; margin:0px auto; padding:0px 0px 0px 18px;}
#footer {width:970px; background:#fff; overflow:hidden; margin:0px auto 20px; padding-bottom:10px; -moz-border-radius: 5px; -webkit-border-radius: 5px;}
.footerPromoBox {width:230px; height:100px; float:left; text-align:left; background:#fff; border:2px solid #a89973; -moz-border-radius: 5px; -webkit-border-radius: 5px; position:relative; padding:10px; margin-right:28px;}
.footerPromoBox h3 {font-size:20px; color:#fff}
.footerPromoBox a:link, .footerPromoBox a:visited {color:#fff;}
.footerPromoBox a:hover {color:#fff;}
.footerPromoText {font-size:14px; width:157px; line-height:110%; height:70px; color:#c7db00; font-weight:bold; position:absolute; top:37px; left:9px;}
#designby {width:111px; height:44px; padding-top:5px; padding-right:11px; text-align:right; border:none; background-image:url(../images/tcm-logo.jpg); float:right; margin-right:10px}
#designby a:link, #designby a:visited {color:#666;}
#designby a:hover {color:#666;}
/********************************************************************************  SEO TXT CSS **********************************************************/

#seoText {width:950px; padding:20px; margin-top:20px; text-align:justify; margin:0px auto;}

/******************************************************************************** HOMEPAGE ELEMENTS CSS ************************************************************************/

.holdBox {height:100px; width:115px; float:left; background:url(../images/anybox_home.jpg); margin:0px 5px 5px -25px}

.homeBox {width:165px; position:relative; height:190px; float:left; margin:0px 5px 5px 0px; padding:3px 5px 5px; border:5px solid #c8cf83; text-align:left; font-size:11px; -moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px; background:url(../images/bg_LeftMenu.jpg) top right no-repeat #eaeebd;}
.homeBox h3 {color:#fff; font-weight:bold; font-size:14px}
.homeBoxWrap {position:absolute; bottom:5px; left:5px; width:170px;}
.homeBoxPic {width:75px; height:65px; border:1px solid #7d705e; float:left; margin-left:0px; margin-right:0px; margin-top:5px; background:#fff}
.homeBoxPrices {width:75px; height:20px; border:1px solid #7d705e; padding:3px; font-size:12px; text-align:center; float:right; margin-right:5px; font-weight:bold; margin-top:5px; background:#fff}
.homeBoxViewProd {width:81px; height:31px; border:1px solid #7d705e; padding:0px; text-align:center; float:right; margin-right:5px; font-weight:bold; margin-top:5px; background:#fff}

/************************************************************************ MARGINS & PADDING ************************************************************************/

.noMarginRight {margin-right:0px}
.noMarginLeft {margin-left:0px}

.noPaddingRight {padding-right:0px}
.noPaddingLeft {padding-left:0px}

/************************************************************************ SUB-NAVIGATION ELEMENTS ************************************************************************/

.arrowlistmenu{width: 200px; margin:0px; padding-left:6px;  /*width of accordion menu*/}

.arrowlistmenu .menuheader{ /*CSS class for menu headers in general (expanding or not!)*/font: bold 14px 'calibri', Verdana, Arial, Helvetica, sans-serif; color: #fff; background: #ffd900; margin-bottom: 1px; /*bottom spacing between header and rest of content*/ border:2px solid #fff; -moz-border-radius: 5px; -webkit-border-radius: 5px; text-align:left; padding: 5px 20px 5px 10px; /*header text is indented 10px*/ cursor: crosshair}

.arrowlistmenu .menuheader:hover {background: #ffd900; padding: 5px 20px 5px 10px; color:#fff}

.arrowlistmenu .openheader{ /*CSS class to apply to expandable header when it's expanded*/ color:#fff; border:2px solid #fff; -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 5px 20px 5px 10px; }

.arrowlistmenu ul{ /*CSS for UL of each sub menu*/ list-style-type: none; list-style-image:none; margin: 0; padding: 0; margin-bottom: 5px; /*bottom spacing between each UL and rest of content*/
}

.arrowlistmenu ul li{padding-bottom: 2px; list-style-type: none; list-style-image:none; /*bottom spacing between menu items*/}

.arrowlistmenu ul li a{color: #34281c; background-color: #fff; text-decoration:none; border: 1px solid #a49583; /*custom bullet list image*/ display: block; padding: 2px 0; /*link text is indented 19px*/  font-weight: bold;  list-style-type: none; margin-bottom:2px; margin-left:2px; text-align:left; padding:5px 10px; width:174px; -moz-border-radius: 5px; -webkit-border-radius:5px;}

.arrowlistmenu ul li a:visited{color: #333;}

.arrowlistmenu ul li a:hover{ /*hover state CSS*/ color: #34281c; background: url(../images/bg_menu.jpg) top right no-repeat #feeb72; border: 1px solid #a49583; -moz-border-radius: 5px; -webkit-border-radius: 5px; text-decoration: underline;}

.selected { /*hover state CSS*/ color: #34281c; background: url(../images/bg_menu.jpg) top right no-repeat #feeb72; border: 1px solid #a49583; -moz-border-radius: 5px; -webkit-border-radius: 5px; text-decoration: underline;}

/********************************************************************** INFO NAV ELEMENTS ****************************************************************/

.infomenu{width: 200px; margin:20px 24px 0px; padding-left:6px;  /*width of accordion menu*/}

.infomenu .menuheader{ /*CSS class for menu headers in general (expanding or not!)*/font: bold 14px 'calibri', Verdana, Arial, Helvetica, sans-serif; color: #fff; background: #435070; margin-bottom: 5px; /*bottom spacing between header and rest of content*/-moz-border-radius: 5px 5px 5px 5px; border:1px solid #a49583; -moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px; text-align:left; padding: 5px 5px; /*header text is indented 10px*/ cursor: hand; cursor: pointer;}

.infomenu .menuheader:hover {background:#435070; color:#fff}

.infomenu .openheader{ /*CSS class to apply to expandable header when it's expanded*/background: #435070; border:1px solid #a49583; -moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px;}

.infomenu ul{ /*CSS for UL of each sub menu*/ list-style-type: none; list-style-image:none; margin: 0; padding: 0; margin-bottom: 5px; /*bottom spacing between each UL and rest of content*/
}

.infomenu ul li{padding-bottom: 2px; list-style-type: none; list-style-image:none; /*bottom spacing between menu items*/}

.infomenu ul li a{color: #333; background-color: #ebf2a2; text-decoration:none; border: 1px solid #a49583; /*custom bullet list image*/ display: block; padding: 2px 0; /*link text is indented 19px*/  font-weight: bold;  font-size: 10px; list-style-type: none; margin-bottom:2px; margin-left:2px; text-align:left; padding:5px 10px; width:174px; -moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px;}

.infomenu ul li a:visited{color: #333;}

.infomenu ul li a:hover{ /*hover state CSS*/ color: #34281c; background: #d4db90; border: 1px solid #a49583; -moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px; text-decoration: underline;}
