@charset "utf-8";
/* CSS Document */
body            {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 13px; line-height:1.3; 
                 padding:0; margin:0; background-color: #ccc; color: #000;}    
h1,h2,h3        {margin-top: 5px;}
h1              {font-size: 130%;}
#contentwrapper h1{color: #ff8000; padding: 4px 20px 0px 20px; height: 36px; }
h2              {font-size: 120%; color: #eee;}
#contentwrapper h2{ color: #000; padding: 2px 20px 5px 20px; height: 36px; display: inline;}
h3              {font-size: 110%;}
#contentwrapper h3{ color: #30345f;} 
.h3div          {margin-left:30px;}
strong          {color:#503050;}
p               {margin: 14px;}
fieldset        {background-color:#eee; color:#000;}
input           {font-size:11px;}
hr              {color:#ccc;}
a:link          {color:#000;}
a:visited       {color:#000;}
a:active        {color:#000;}
a:hover         {text-decoration: underline; color: #ff8000;}
a img           {text-decoration: none; border: 0 none;}
#contentwrapper {float: left;width: 100%; background-color:#fff;}
           
#contentcolumn  {margin-left: 185px;}
#leftcolumn     {float: left;width: 185px; margin-left: -100%; margin-top:0;}
.innertube      {margin: 0 10px 0px 10px; padding: 10px 0 10px 0;}
#wrapper        {margin: auto; width: 1024px;; padding-top:0px;  min-height:500px; 
                 background-color: #90B4D7; color:#000; border: ridge 2px #ccc; }
#hdr            {float: left; width: 100%;  height:111px;  
                 background-image:url(../images/BST_Header_BG.png); background-repeat:no-repeat;}
				 background-color: #b2bcc1; color: #000;}
.social_media{float:left; width:180px; height:111px; 
			  background-image:url(../images/sm_bg.png); background-repeat:no-repeat;}
.smicon           {float:right; margin:50px 5px 0 0;}
.smicon a    {text-decoration:none;  border: 0 none;}	
#hdrlh          {display: none;} /* letterhead */
#logo           {float: left;}
#inheadertext   {float:right; padding-top: 10px; padding-left:50px;  width: 350px; height: 100px;}

.notify         {float:right; padding:5px; font-size: 90%; background-color:#eee; color:#ff3333; border: ridge 2px #ccc;}
.subdiv         {float:left; padding:5px; background-color:#eee; color:#000; border: ridge 2px #ccc;}
.polldiv        {float:right; padding:5px; font-size: 90%; background-color:#eee; color:#000; border: ridge 2px #ccc;}
.login          {float:left; padding:5px; font-size: 90%; background-color:#eee; color:#000; border: ridge 2px #ccc;}
.contact        {float:left; padding:5px; font-size: 90%; background-color:#eee; color:#000; border: ridge 2px #ccc;}
.contact h2     {color:#000; background-image:none;}

#ftr            {width: 100%; text-align:center; color:#000;  font-size:80%;  }
#ftr a          {color: #007;}
#ftr p          {margin:5px;}
#ftr a:hover    {text-decoration: underline; color: #733;}							  
.break          {page-break-before: always; }
/* ============================================================================== */
/* Use for fluid left content + fixed right side column */
#subcontentwrapper {float: left; width: 100%; 
                    background-image:url(../images/2ColumnPage_BodyTile.png); background-repeat:repeat-y;}
#subcontentcolumn  {margin-right: 220px; }
#subrightcolumn    {float: left; width: 200px; margin-left: -200px;}

.bordered          {border: 1px ridge #000000; box-shadow: 5px 5px 5px #333333; margin: 5px;}
.tinyborder      {border: 1px ridge #000000; box-shadow: 1px 1px 1px #333333; margin: 5px;;}
/* ============================================================================== */
.fl             {float:left; padding-right:5px;}
.fr             {float:right;padding-right:5px;}
.fc             {margin:auto;}
.tinydiv        {font-size: 90%;}
.tinydiv input  {font-size: 90%;}
.bold           {font-weight:bold;}
.alignleft      {text-align:left;}
.aligncenter    {text-align:center;}
.alignright     {text-align:right;}
.label          {float:left; width:150px;}
.hdrlbl         {color:blue; background-color: #eee;}
.code           {float:left;  font-size:10px; background-color:white; color:green; }
.hlight         {color:#cc0001; font-style:italic;}
.tagline        {font-weight:bold;}
.error          {color: blue;}
.widthall       {float:left; width:100%;}
.product        {float:left; width:75px;}
.product img {border:solid 1px white;}
.product img:hover {border:solid 1px orange ;}
.width50        {float:left; width:50px;}
.width75        {float:left; width:75px;}
.width100       {float:left; width:100px;}
.width150       {float:left; width:150px;}
.width200       {float:left; width:200px;}
.width250       {float:left; width:250px;}
.width300       {float:left; width:300px;}
.width350       {float:left; width:350px;}
.width400       {float:left; width:400px;}
.width500       {float:left; width:500px;}
.width550       {float:left; width:550px;}
.width600       {float:left; width:600px;}
.widthall       {float:left; width:90%;}

.cb             {clear:both;}
.rightdiv       {float:right; width:100px;}

table.basetable        {margin: 1em 1em 1em 2em; background: whitesmoke; border-collapse: collapse; color:#666;}
table.basetable td     {border: 1px silver solid; padding: 0.2em; padding-left: 5px; padding-right: 15px;}
table.basetable th     {border: 1px silver solid; padding: 0.2em; background: gainsboro; text-align: left;}
#mask {position:absolute; left:0; top:0; z-index:9000; background-color:#000; display:none;}
#boxes .window {position:absolute; left:0; top:0; width:640px; height:640px; display:none; z-index:9999; padding:20px; background-color:#ffffff;}
/* ============================================================================== */
/* ============================================================================== */
/* ========================== Pure CSS --- $pfx ================================== */
/* ============================================================================== */
.selected       {font-weight:bold; color: #ff8000;}
body{behavior: url(csshover3.htc);}
.navigation     {color:#fff; overflow:hidden;}
.navigation     {overflow:hidden; padding:0; margin:0; font-family:Arial,sans-serif; font-size:14px; }	
/* Styling ---------------------------------------------------------------------- */ 
.nav,
.nav ul,
.nav li              {list-style: none; padding:0; margin:0; overflow:hidden; text-transform:uppercase;}
.nav li              {display:block;   margin:5px 3px; border: 2px ridge #333; background-color: #10499E;}		 
.nav li a            {font-weight: bold; color: #fff; padding: 2px 15px 2px 15px; }
.nav > li.cp > a,
.nav > li:hover > a  {color: #ff8000; background-color:#092653;}
.nav li:hover ul     {display: block; list-style: none;}
/* Submenu ---------------------------------------------------------------------- */
.nav ul             {position: absolute; display: none; z-index: 999; padding:5px; background-color:#EEEEEE;}
.nav li:hover ul li {margin:2px 1px;}
.nav ul li a        {width: 250px; font-weight: bold;}
.nav ul li > a      {color: #000000; background-color:#6F9AD0; border:1px solid #000;}
.nav ul > li.cp > a,
.nav ul li:hover a  {color: #ff8000; background-color: transparent; }
/* Horizontal ------------------------------------------------------------------- */
.navH ul           {border: 1px ridge #000000;  
			 box-shadow: 5px 5px 5px #333333; font-size:12px;}
.navH li            {display:inline; float:left; border-radius: 0px 0px 0px 0px;  box-shadow: 2px 2px 2px #ccc;}
.navH ul li         {display:block; float:none;}
.navH li a          {display: block; text-decoration: none;}	
/* Vertical --------------------------------------------------------------------- */
.navV li            {text-align: right; width: 170px;}
.navV li li         {width:300px; text-align: left;}
.navV li a          {position: relative; display: block; text-decoration: none; }
.navV li:hover ul   {margin-left: 155px; position: absolute; margin-top:-35px;}
.navV ul li a       {padding: 2px 10px; width:300px; display: block; text-decoration: none; }
/* ============================================================================== */
/* ========================== Sitemap Navigation ================================ */
/* ============================================================================== */
.sitemap li     {list-style: none; font-size:14px;  color:#eee;}
.sitemap li a   {font-weight: normal; font-size:14px; }
/* ============================================================================== */
/* ========================== Page Footer Navigation ============================ */
/* ============================================================================== */
.bottomnav                     {font-size:10px; float:right; margin: 3px 10px; border:none;}
.bottomnav>.nav li             {Border:none; box-shadow: none;}
.bottomnav>.nav li a           {background-image: none;}
.bottomnav>.nav ul li:hover a  {color: #777; background-color: transparent; background-image:none;}
.bottomnav>.nav li:hover ul li {margin:0px 0;}
/* ============================================================================== */
/* ========================== Sub Category Navigation =========================== */
/* ============================================================================== */
.subcatnavigation              {font-size:12px; }
/* ============================================================================== */
/* ========================== basic horizontal menu ============================= */
/* ============================================================================== */
.hmenu        {padding:0; margin:0;}
.hmenu  li    {display: inline; list-style-type: none; padding: 0 20px 0 0;}
/* ============================================================================== */
/* ========================== End Pure CSS ====================================== */
/* ============================================================================== */
/* ============================================================================== */
/* ============================================================================== */
/* Tooltip span processing */
span.tt            {position:relative;}
span.tt span       {display: none; z-index:1}
span.tt:hover span {display:block; position:absolute; top:-30px; left:0px; text-align: left; padding: 5px; 
                    font-size: 90%; font-weight: bold; border: ridge 1px #CCCCCC; 
                    background-color: #F7F8FC; color:#030303; }
/* Used in the site build to provide tool tips */                    
span.ttb            {position:relative;}
span.ttb span       {display: none; z-index:1}
span.ttb:hover span {display:block; position:absolute; text-align: left; padding: 5px; border: 1px ridge #CCCCCC; margin:5px; 
                     font-size: x-small; font-weight: bold;  background-color: #eee; color:#777; white-space:nowrap; 
                     box-shadow: 5px 5px 5px #333; -moz-box-shadow: 5px 5px 5px #333; -webkit-box-shadow: 5px 5px 5px #333; -khtml-box-shadow: 5px 5px 5px #333;}
span.tts           {position:relative;}
span.tts span      {display: none; z-index:1}
span.tts:hover span{display:block; position:absolute; top:20px; left:200px; width:400px; text-align: left; padding: 5px; 
                    font-size: 80%; font-weight: normal; border: ridge 2px gold; background-color: #333; color:#eee; }	
span.ttf{position:relative;}
span.ttf span{display: none; z-index:1}
span.ttf:hover span{display:block; position:absolute; top:-40px; left:-230px; width:200px; text-align:left; padding: 5px; 
		 font-size: 80%; font-weight: normal; border: ridge 4px #333; background-color: #ccc; color: #333; }
/* ============================================================================== */
.quotediv       {float:left; padding:5px; font-size: 90%; background-color:#eee; color:#000; border: ridge 2px #ccc;}
.shortcontact   {float:left; width:400px; padding:5px; font-size: 90%; background-color:#eee; color:#000; border: ridge 2px #ccc;}
.section        {float:left; width:100%;}
#cartcontent    {float:left; width:100%;}
.instruct       {float:left; }
.instruct dt    {font-size:10px; font-weight:bold; color:green;}
.instruct dl    {font-size:10px;}
.padlr          {padding-left:10px; padding-right:10px;}
.searchdiv      {float: right; color:#fff; margin-top:-25px;}
.enews          {background-color: #b2bcc1; color:#fff; margin-top:-20px; padding: 0px 5px 5px 5px; width:175px; }
/* 
.enews h3       {font-size:110%; text-transform: uppercase; font-family: Arial Narrow; margin-bottom:0;}
*/
.enews h3       {font-size:11px; text-transform: uppercase; font-family: Arial; margin-bottom:0;}
.prodhead       {font-size:200%; color:orange !important;}

/* ============================================================================== */
/* ============================================================================== */
.prodgroups  {float:left; width:250px; min-height:860px; 
             background-image:url(../../../images/bluebg_m.png);}
.prodgroup{float:left; width:110px; height:90px; margin:5px; background-color:#fff;
            text-align:center;
			border: 1px ridge #000000; box-shadow: 1px 1px 1px #333333;}


		   
.verticals  {float:left; width:1020px; min-height:100px ;margin:0 0px 0 0; padding:0 0 10px 0;
			background-image:url(../../../images/bluebg_w.png); background-repeat:repeat-y;}
.vertical{float:left; width:130px; height:120px; margin:0 5px;  background-color:#fff;
           text-align:center; padding:10px 0 0 0;
		   border: 1px ridge #000000; box-shadow: 1px 1px 1px #333333;}		   

.feature    {float:left;}
.featured  {float:left; background-image:url(../../../images/bluebg_n.png); background-repeat:repeat-y;}  
.prodcode  {font-size:120%; color:#35568e;} 

#main-content {width:700px; padding:0 10px; float:left;}
.sub-content  {width:250px; margin:10px 0; padding:1px; float:right;}
.blogpost     {margin:8px; box-shadow:none;}
.blogpost-sum {width:'.($pwidth-14).'px; '
                     .'height:'.$pheight.'px; '
                     .'background-color: #ffffff; '
                     .'overflow:hidden; '
                     .'padding:0 1px;'
                     .'text-align:center;'
                     .'font-size:small;'
                     .$this->new_background($val).'"';}
.articleimage            {width: inherit; max-width: 100%; height: auto;}
.media-summary           {max-width:220px; height:350px; float:left; margin:5px; 
                     border:1px solid #ccc; 
                     background-color:white; overflow:hidden;}
.media-summary  img   {width: inherit; max-width: 100%; height: auto;}
.media-summary-date      {font-size:x-small; color:#777;}
.media-summary-subject   {font-size:x-small; color:#000066; font-weight:bold;}
.media-summary-summary   {font-size:x-small; color:#000;}	
.home-media-summary           {max-width:100%; margin:5px; 
                     border:1px solid #ccc; 
                     background-color:white; overflow:hidden;}
.media-detail-image {display:block; float:left; margin:20px; }
.media-detail-image img  {width: inherit; max-width: 100%; height: auto;}
.media-detail-subject   {Font-size:120%; color:#000066; font-weight:bold;}
.media-detail-description  {color:#000;}	

.supplier-link      {padding: 2px; width:450px; height:150px; float:left; overflow:hidden;
                  border: 1px ridge #000000; box-shadow: 1px 1px 1px #333333; margin: 5px;} 
.supplier-link  img {display:block; float:left;
                   margin:0 5px; padding:5px; border:1px solid #ccc; max-width:100px; height:auto;}				  
.supplier-link  a> img:hover {border:2px ridge #000; }
.supplier-site-button    {float:right; padding:10px; border:1px solid #ddd; border-radius: 0px;}
.supplier-site-button form input  {color:#003B77; font: bold 14px Arial, Sans-serif;  }
.supplier-site-link{float:left;   text-align:center; margin:0 1px; }
.supplier-site-link img{max-height:30px; width: auto !important; }
.supplier-site-link a{padding:5px; text-decoration:none; display:block; border:1px solid #ccc;}
.supplier-site-link a:hover{border:2px ridge #000; text-decoration:none;}
.three-d a{ 
    font-family: "Merienda One",cursive; letter-spacing: 2px; Color:red;
	font-size:160%; text-decoration:none; margin:10px 0;
    text-shadow: 0 1px 0 #888,
                 0 2px 0 #898989,
                 0 3px 0 #777,
                 0 4px 0 #797979,
                 0 5px 0 #666,
                 0 6px 1px rgba(0,0,0,.1),
                 0 0 5px rgba(0,0,0,.1),
                 0 1px 3px rgba(0,0,0,.3),
                 0 3px 5px rgba(0,0,0,.2),
                 0 5px 10px rgba(0,0,0,.25),
                 0 10px 10px rgba(0,0,0,.2),
                 0 20px 20px rgba(0,0,0,.15);
	}
.three-d a:hover{
	transform: scale(2.2);
}
.threez-d a{ 
    font-family: "Merienda One",cursive; letter-spacing: 2px;
	font-size:140%; text-decoration:none; margin:10px 0;
    text-shadow: 0 1px 0 #ccc,
                 0 2px 0 #c9c9c9,
                 0 3px 0 #bbb,
                 0 4px 0 #b9b9b9,
                 0 5px 0 #aaa,
                 0 6px 1px rgba(0,0,0,.1),
                 0 0 5px rgba(0,0,0,.1),
                 0 1px 3px rgba(0,0,0,.3),
                 0 3px 5px rgba(0,0,0,.2),
                 0 5px 10px rgba(0,0,0,.25),
                 0 10px 10px rgba(0,0,0,.2),
                 0 20px 20px rgba(0,0,0,.15);
	}