/*	Desc: Seltrade Trading Company Screen Style Sheet
	Author: SepiaSolutions
	+ Colours
	- *colour hex* *colour name* (*purpose*)
=== === === === === === === === === === */
/*=Tag Redefine
=== === === === === === === === === === */
* {margin:0;padding:0;border: 0 none;}
html, body {}
body, div, font, input, li, option, p, select, table, textarea, td, th, tr, ul, ol {color:#4d4d4d;font: 11px/14px Tahoma, Verdana, Arial, Helvetica, sans-serif;}
body {padding:0;text-align:center;background: #add0ec url(../images/bg.gif) repeat-x;}

A{color:#276ead;text-decoration:none}
A:hover{text-decoration:underline;color:#8bb2d4;}
input, textarea, select{color:#383e46;border:1px solid #b3b3b3;font-size:12px;padding:2px;}
input:focus.txtFld , textarea:focus.txtFld {background: #efefef;color: #000;}

p, li {line-height: 150%;}
h1,h2,h3,h4,h5,h6{margin:20px 0 8px}
h1,h2,h3,h4,h5,h6, h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{font-weight:bold;color:#807474;font-size:16px}
h2, h2 a{color:#5d8599}
h3, h3 a{color:#DA7070}
h4,h5,h6, h4 a,h5 a,h6 a{font-weight:bold;color:#807474;font-size: 14px;text-decoration: underline;}
h5, h5 a{color:#5d8599;}
h6, h6 a{color:#DA7070;font-size: 12px;}
blockquote{padding:20px;}
strong{font-size: 110%;}
em{color: red;}

.CT{text-align:center;vertical-align:top}
.CM, div.CM, .nSep, .glry{text-align:center;vertical-align:middle}
.LM{text-align:Left;vertical-align:middle}
.LB{text-align:left;vertical-align:text-bottom}
.RB{text-align:right;vertical-align:text-bottom}
.RM, .top, .srch{text-align:right;vertical-align:middle}
.RT{text-align:right;vertical-align:top}
.TL, td, .nav{text-align:left;vertical-align:top}

/* ====================================================================
Structure Properties
-------------------------------------------------------------------- */
#mainCont{width:780px;height:100%;margin:0 auto;background:#fff;overflow: visible;}
#header{ height:214px;}
#header, .tphd, .nav{ background: #d7e6f2;}

.rdBar{height:23px;border-bottom: 1px solid #fff;background: #d10000;padding: 5px 10px 5px 0px;}
.rdBar div{color:#fc0;overflow: hidden;text-align: center;}
.rdBar .menu ul{float: left;text-align: center;}
.rdBar .menu ul li { display: inline;}
.rdBar .menu ul li a{color: #fc0;padding: 0.2em 0.5em;text-decoration: none;float: left;border-right: 1px solid #fc0;}
.rdBar .menu ul li a.last{border-right-width: 0px;}
.rdBar .menu ul li a:hover{color: #fff;}
.rdBar .sbMnu{width: auto;display: none;filter:alpha(opacity=0);-moz-opacity:0;}
.rdBar .Loct{margin-left:100px;}


.tpBtn{ height:18px; width:220px; background: #d5d6d7; padding: 5px 10px 0px 0px; margin-bottom: 11px; clear: both; border-top: 2px solid #d7e6f2; border-right: 2px solid #d7e6f2; }
.tpBtn a, .tpBtn a:hover{color:#000;text-decoration: none;}
.tpBtn a:hover{color:#444;}
.tpBtn .home {padding-left: 17px;margin-right: 18px;background: url(../images/home.gif) no-repeat left center;}
.tpBtn .sitemap {padding-left: 22px;margin-right: 18px;background: url(../images/sitemap.gif) no-repeat left center;}
.tpBtn .contact {padding-left: 12px;background: url(../images/contact.gif) no-repeat left center;}

.hdImg{ height:149px; background: #1b6bac; }

.content{height: 100%;width: 772px;margin: 4px 4px 0px;}

.sideBar{width: 221px;background: #d7e6f2;}
.lftBx{padding: 10px 6px;color: #504f4f;}
.gap{border-top: 4px solid #fff;}
.lgFrm{font-weight: bold;color: #d10000;}
.lgFrm label {color: #d10000;width: 60px;padding: 0.5em;text-align: left;font-weight: bold;}/*float: left;*/
.lgFrm div {margin-top: .5em;padding: 0;display: block;}
.nDat{font-weight: bold;color: #0f3e59;}
.nTxt a, .nTxt a:hover{color: #504f4f;}
div.sep {margin:16px auto;height: 1px;background: #96c7e4;width: 70%;}
div.sep hr {display: none;}

.midBar{padding-left: 4px; margin-left:4px;}
.SecPart{padding-top: 15px;}
.located{width: 348px;padding-top:4px;float: left;}

/* START OF CSS FOR MAP */
dl.map {position:relative;width:348px;height:195px;background:url(../images/locMap.gif) no-repeat;text-align:left;margin:0px auto;padding:0px;}
dl.map dt {list-style:none;display:inline;}
dl.map dd {position:absolute;left:-9999px;width:200px;padding:4px;border:#222 2px solid;background:#666;-moz-border-radius:8px;border-radius:8px;z-index:11;font-size:0.8em;color:#fff;}
dl.map a.location {display:block;position:absolute;text-indent:-9999px;background:url(../images/point.gif) no-repeat;width:10px;height:10px;outline:none;z-index:10;text-decoration:none;}
dl.map a.location:hover {background:url(../images/point.gif) no-repeat -1px -1px;}
/* START OF CSS FOR MAP POINTS */
dl.map a#location01 {top:75px;left:72px;}
dl.map a#location02 {top:95px;left:202px;}
dl.map a#location03 {top:93px;left:210px;}
dl.map a#location04 {top:87px;left:223px;}
dl.map a#location05 {top:82px;left:253px;}


#bubble_tooltip{width:147px;position:absolute;display:none;z-index: 100;}
#bubble_tooltip .bubble_top{background: url(../images/bubble_top.gif) no-repeat;height:16px;}
#bubble_tooltip .bubble_middle{background: url(../images/bubble_middle.gif) repeat-y left bottom;padding-left:7px;padding-right:7px;}
#bubble_tooltip .bubble_middle span{position:relative;top:-8px;font-size:13px;color: #1c77b4;font-weight: bold;}
#bubble_tooltip .bubble_bottom{background: url(../images/bubble_bottom.gif);background-repeat:no-repeat;height:44px;position:relative;top:-6px;}



.footer{background: url(../images/btmBg.gif) no-repeat center bottom;clear: both;height: 66px;padding-top: 50px;}
.footer div{color: #276ead;text-align: center;vertical-align: bottom;padding-top: 8px;}
.footer span, .footer span a, .footer span a:hover{color: #c42020}

/* ================== Main Content =====================*/
.info{padding: 4px 4px 15px;height:400px;min-height:400px;}
html>body .info{height:100%;}
.info, .info div, .info span, .info p, .info li{font:11px/16px Verdana, Arial, Helvetica, sans-serif;text-align:justify;color: #708387;}
.info ul, .info ol{margin:4px 0 0 20px;display: block;}
.info ul.sbpg{margin:4px 0 0 50px}
.info li{font-size:11px;padding:1px;list-style: url(../images/blt.gif);}
.info div.pic{text-align: center;}
span.blu{color: #1c77b4;font-weight: bold;}
div.rMor{text-align:right;color:#cc0505;font-size:11px;padding:5px;clear: both;}
.CountSel{margin: 30px 0px;}

.srch #q{background: #edf5fb;font-size: 11px;border-color: #1d2326;}



/* ================== Image Headings =====================*/
.pgHdg, .MainHdg{background: #c42020;height: 25px;padding: 0px 10px;}
.pgHdg h4, .MainHdg h4{position: relative;margin:0px;color: #fff;height: 100%;}
.pgHdg span, .MainHdg span{position: absolute;width: 100%;height: 100%;margin-top: 2px;}
.MainHdg{background: transparent;padding: 0px;margin-bottom:6px;}
.MainHdg h4{color: #c42020;}

.pgHdg span.email{background: url(../images/member.gif) no-repeat;}
.pgHdg span.nws{background: url(../images/news.gif) no-repeat;}

.MainHdg span.welcm{background: url(../images/welcome.gif) no-repeat;}
.MainHdg span.abt{background: url(../images/about.gif) no-repeat;}
.MainHdg span.prod{background: url(../images/products.gif) no-repeat;}
.MainHdg span.loc{background: url(../images/locations.gif) no-repeat;}
.MainHdg span.serv{background: url(../images/services.gif) no-repeat;}
.MainHdg span.quot{background: url(../images/quote.gif) no-repeat;}
.MainHdg span.broch{background: url(../images/brochure.gif) no-repeat;}
.MainHdg span.sm{background: url(../images/sitemap1.gif) no-repeat;}
.MainHdg span.cont{background: url(../images/contact1.gif) no-repeat;}
.MainHdg span.ltNws{background: url(../images/ltNews.gif) no-repeat;}
.MainHdg span.msg{background: url(../images/message.gif) no-repeat;}
.MainHdg span.srch{background: url(../images/srch.gif) no-repeat;}
.MainHdg span.prsn{ background: url(../images/presn.gif) no-repeat; }


/* ================== Image Submit Button =====================*/
.Login, .Search, .goAro, .okBtn{margin: 0;padding: 0;border: 0;text-indent: -1000em;cursor: pointer;cursor: hand;}
.Login{width: 62px;height: 20px;background: transparent url(../images/login.gif) no-repeat center top;margin-right: 6px;}
.goAro{width: 21px;height: 21px;background: transparent url(../images/go.gif) no-repeat center top;margin-left:3px;}
.Search{width: 57px;height: 24px;background: transparent url(../images/search.gif) no-repeat center top;padding-bottom:2px;}
.okBtn{width: 30px;height: 23px;background: transparent url(../images/ok.gif) no-repeat center top;margin-top: 3px;}

/* ====================================================================
Navigation Button
-------------------------------------------------------------------- */
.nav{height:31px;}
#btns {position: relative; width: 689px; height: 31px;}
#btns li {width: 114px;height: 31px;position: absolute;background: url(../images/btn.gif) no-repeat 0 0;display: inline;list-style: none;}
#btns a {width: 114px; height: 31px; display: block;}
#btns a span{display: none;}

#btns #abt {left: 0; background-position: 0 0;}
#btns #prod {left: 115px; background-position: -115px 0;}
#btns #loc {left: 230px; background-position: -230px 0;}
#btns #serv {left: 345px; background-position: -345px 0;}
#btns #req {left: 460px; background-position: -460px 0;}
#btns #broch {left: 575px; background-position: -575px 0;}

#btns #abt a:hover {background: url(../images/btn_.gif) 0 0 no-repeat;}
#btns #prod a:hover {background: url(../images/btn_.gif) -115px 0 no-repeat;}
#btns #loc a:hover {background: url(../images/btn_.gif) -230px 0 no-repeat;}
#btns #serv a:hover {background: url(../images/btn_.gif) -345px 0 no-repeat;}
#btns #req a:hover {background: url(../images/btn_.gif) -460px 0 no-repeat;}
#btns #broch a:hover {background: url(../images/btn_.gif) -575px 0 no-repeat;}

/* ================== Spedific Page Red Curl =====================
#btns #broch, #btns #broch a:hover {background: url(../images/btnSel.gif) -575px 0 no-repeat;}*/


/* ====================================================================
Product Category Bar
-------------------------------------------------------------------- */
.prodBar{background: #f8f7f7 url(../images/bxMid.gif) repeat-y;width: 187px;float: right;}
.pbTop{background: url(../images/bxTop.gif) no-repeat left top;padding-bottom: 4px;height: 24px;}
.pbBtm{background: url(../images/bxBtm.gif) no-repeat left bottom;padding-top: 4px;height: 24px;}
.pbMid{padding: 0px 20px;}

#ProdLst{margin:0;padding:0;list-style-type:none;background-color:transparent;width:auto}
#ProdCatg {clear: both;width: 100%;margin: 10px 0px;}
#ProdCatg li{margin:0px;padding-left: 8px;border-bottom: 1px dotted #bababa;list-style: url(none) none;background: url(../images/blt.gif) no-repeat left center;}
#ProdCatg li.last{border-bottom-width: 0px;}
#ProdCatg a{height:16px;display:block;text-align:left;text-decoration:none;padding-top:3px;color:#1a88b8;}
html>body #ProdCatg a{height:auto;}
#ProdCatg a:hover{text-decoration:none;color:#6cc5ec;}

#ProRng{color: #707070;font-size: 10px;font-family: Tahoma;}
#ProRng select{color: #898989;font-size:10px;width: 112px;}
#ProRng optgroup{font-weight: bold; padding:0;margin:0; }
#ProRng option{ padding-left:10px; }
.find{padding-top: 6px;}
.find a, .find a:hover{font: 9px Tahoma;color: #5aa623;text-decoration: underline;}



/* ====================================================================
Sub Page Icons
-------------------------------------------------------------------- */
#sbPg{padding: 0px 0px 6px;clear: both;width: 100%;}
#sbLnk{text-align: left;}
#sbLnk, #sbLnk A, #sbLnk A:Hover{color:#494B4C;font-size:9px;text-transform:lowercase}
#sbLnk A{background: url(../images/aro.gif) no-repeat right center;padding-right: 7px;}
#ts{font-size:9px;float:right;}
.h{background: url(../images/sbPg.gif) no-repeat left center;padding-left: 5px;}


/* Starting Of Product Listing*/
.ProdGlry, .glry{list-style-type:none;background-color:transparent;width:auto;clear:both}
.ProdGlry li{display:inline;list-style:url(none) none;padding:0px}
.ProdGlry li a, .ProdGlry li a:hover{background:#f7f7f7;float:left;text-decoration:none;padding:10px;margin:4px;height:130px;width:215px;text-align:center;vertical-align:middle}
.ProdGlry li a:hover{background:#eee;}
.MorInfo{text-align:right;padding:5px;clear: both;float: right;}



.PgTxt{font-size:10px;font-weight:normal;color:#000000;text-align:right;float:right}
.rit div{font-weight:bold;color:#C40000;font-size:10px}
#pgNo{padding:8px;font-size:14px;font-weight:bold;float: right;}
#pgNo A{font-size:11px;padding:2px;color:#598094;border:1px solid #CCC;background-color:#E6E6E6}
#pgNo A:hover{background:#F0F0F0}
.glryImg{display: block;margin: 6px;clear: both;}
.glryPN{display: block;clear: both;margin: 6px;padding-top: 20px;}
.Lpic{float: left;padding: 0px 6px 6px 0px;}
.Rpic{float: right;padding: 0px 0px 10px 10px;}
.add{padding:6px;padding-left:60px;}

/* Starting Of Gallery*/
.glry{clear:both}
.glry li{display:inline;list-style:url(none) none;padding:0px}
.glry li a{background:#EEE;float:left;text-decoration:none;padding:4px;margin:1px;height:80px;width:150px;text-align:center;vertical-align:middle}
.glry li a:hover{background:#CCC}
/* Ending Of Gallery*/


/* ====================================================================
Form
-------------------------------------------------------------------- */
fieldset {margin: 1em 0;border: none;border-top: 1px solid #ccc;}
legend {margin: 1em 0;padding: 0 .5em;color: #036;background: transparent;font-size: 1.3em;font-weight: bold;}
label {float: left;width: 120px;padding: 0 1em;text-align: right;}
fieldset div {margin-bottom: .5em;padding: 0;display: block;}
fieldset div input, fieldset div textarea {width: 150px;border-top: 1px solid #555;border-left: 1px solid #555;border-bottom: 1px solid #ccc;border-right: 1px solid #ccc;padding: 1px;color: #333;}
fieldset div select {padding: 1px;}
div.fm-multi div {margin: 5px 0;}
div.fm-multi input {width: 1em;}
div.fm-multi label {display: block;width: 40px;padding-left: 5em;text-align: left;}
#fm-submit {clear: both;padding-top: 1em;text-align: center;}
#fm-submit input { border: 1px solid #333; padding: 2px 1em; background: #d7e6f2; color: #000; font-size: 100%; }
input:focus, textarea:focus {background: #efefef;color: #000;}
fieldset div.fm-req {font-weight: bold;}
fieldset div.fm-req label:before {content: "* ";}


/* classes for validator */
.error, div.error{background:#ffc;text-align: left;padding: 5px 20px 5px 30px;border:solid 1px #CC3;border-top: 2px solid #ffd324;border-bottom: 2px solid #ffd324;}
.eAlrt, #frmTbl .eAlrt, .error{color:#f00;font-weight:bold;}
.eRglr, #frmTbl .eRglr, .error{font-weight:normal}
