body {
  text-align: center; 
  /*background: #fffff0;*/
  background: #ffffff;
  color: #333;
}

body {
  font-family: 'Lucinda Grande', 'Lucida Sans Unicode', verdana, tahoma, arial, sans-serif;
  font-size: .75em;
  line-height: 1.5;
}

#a {color: #000; padding: 0 2px;}
a:hover {color: #b00;}

#center a {color: #946d84;}
#center a:hover {background: #d6aeb5; color: #000;}

h1, h2, h3, h4, p {margin: 1em 0;}
ul {margin: 1em 2em;}
  
table {
    border-collapse: separate;
    border-spacing: 0;
}
/**************** Layout CSS begins ****************************/
/*
div definitions
mainwrapper - top level wrapper that wraps everything
  header - wrapper for top of page 
  contentwrapper - one or more wrappers for sections of the page
  footer - wrapper for bottom of page

contentwrapper sub divs
  leftwrapper - wraps left and center columns
    left - left column
    content center column
  rightwrapper - wraps right column

 |.............     mainwrapper   ...............|
 |     |...............header.................|  |
 |     |                                      |  |
 |     |......................................|  |
 |                                               |
 |     |.............contentwrapper...........|  |    
 |     | |.............menuwrapper..........| |  |    
 |     | |                                  | |  |
 |     | | ... menu ....................... | |  |
 |     | | |                              | | |  |
 |     | | ................................ | |  |
 |     | |..................................| |  |
 |     |......................................|  |
 |                                               |
 |                                               |    3 column content
 |     |...............contentwrapper.........|  |    one or more - right full width
 |     |    leftwrapper3col    | right        |  |    <=(f) : Float Left
 |     |                       | wrapper3col  |  |    (f)=> : Float Right 
 |     |         <=(f)         |  (f)=>       |  |    
 |     |  ___________________  |              |  |
 |     | |      |            | | |.........|  |  |
 |     | |      |            | | |         |  |  |
 |     | | left | content3col| | |right3col|  |  |       Note: The rightwrapper div can contain
 |     | | <=(f)|   (f)=>    | | |         |  |  |       a second content div just like the 
 |     | |______|____________| | |.........|  |  |      left wrapper
 |     |......................................|  |
 |                                               |    2 column content
 |     |...............contentwrapper.........|  |    one or more - no right column
 |     |    leftwrapper2col                   |  |    <=(f) : Float Left
 |     |                                      |  |    (f)=> : Float Right 
 |     |         <=(f)                        |  |    
 |     |  _________________________________   |  |
 |     | |         |                       |  |  |
 |     | |         |                       |  |  |
 |     | | left    |            content2col|  |  |     
 |     | | <=(f)   |              (f)=>    |  |  |     
 |     | |_________|_______________________|  |  |     
 |     |......................................|  |
 |                                               |    1 column content
 |     |...............contentwrapper.........|  |    one or more - no right column. no left column
 |     |    leftwrapper1col                   |  |    <=(f) : Float Left
 |     |                                      |  |    (f)=> : Float Right 
 |     |         <=(f)                        |  |    different image used for background
 |     |  _________________________________   |  |
 |     | |         |                       |  |  |
 |     | |         |                       |  |  |
 |     | | left    |            content2col|  |  |     
 |     | | <=(f)   |              (f)=>    |  |  |     
 |     | |_________|_______________________|  |  |     
 |     |......................................|  |
 |                                               |
 |     |...............footer.................|  |
 |     |                                      |  |
 |     |......................................|  |
 |                                               |
 |...............................................|

*/

#mainwrapper { /* also holds the left "sliding" tab */
  /*background: #ffffff url(/libtpfimg/PFCGradient170x20.gif) repeat-y 0 0;*/
  text-align: left;
  width: 1000px;
  margin: 0 auto; /* NN will put content out of scrollable reach if auto is used unless there's a min-width on body too*/
  margin-top: 8px;
  font-size: 1em;
}
#mainwrapper1col { /* also holds the left "sliding" tab */
  background: #ffffff;
  background: /*#ffffff url(/libtpfimg/lp.gif) repeat-y 0 0;*/
  text-align: left;
  width: 1000px;
  margin: 0 auto; /* NN will put content out of scrollable reach if auto is used unless there's a min-width on body too*/
  margin-top: 8px;
  font-size: 1em;
}

#header, #subnav, #footer {
  clear: both; 
  width: 100%;
}

#header a {
  height: 59px;
  /*background: #ffffff url(/libtpfimg/PFCGradientBanner900x60.gif) repeat-y 0 0;*/
  background: #ffffff url(/libtpf/img/tpfLogo3.jpg) repeat-y 0 0;
display: block;
}
#header a span {
visibility: hidden;
}
/*
#footer {
  height: 60px;
  text-align: center;
  color: #fff;
  background: #4a1c21 url(/libtpfimg/footer.gif) no-repeat 0 0px;
}
*/
#footerwrapper {
  margin-top: 0; 
  margin-bottom: 8px; 
  float:left;
  width: 100%; 
  margin-right: -95%; 
  background: url('/img/Footer.jpg') no-repeat;
}

#contentwrapper {/* also makes the right "sliding" tab */
  /*background: url(/libtpfimg/rp.gif) repeat-y 100% 0;*/
  float: left;
  width: 100%;
  position: relative;
}

#contentwrapper:after {
 /* this is for NN6 to clear floats */
    content: "."; 
    display: block; 
    height: 0px;
    clear: both; 
    visibility: hidden;
}

/*
#menuwrapper {
  float:left;
  width: 100%; 
  margin-right: -95%; 
  background: url(/libtpfimg/PFCTopMenuGradient.gif); 
}
*/

#menuwrapper {
  margin-top: 2px; 
  float:left;
  width: 100%; 
  margin-right: -95%; 
  /*background: url('/img/MenuBarGreen.jpg') no-repeat;*/
  border-bottom: 1px solid #aaa;
  /*height: 36px; */
  color:#333;
}


#menu {
  margin: 0 170px;
  #height: 24px; 
  #margin-top: 10px;
}

#checkoutheader {
  margin: 0 20px;
  height: 24px; 
  margin-top: 10px;
}

#menu ul {
  display: inline; 
}
#menu li {
  display: inline; 
}
#menu a {
  color: #333; 
}
#menu a {
  color: #333; 
  text-decoration:none;
}
#menu a:hover {
  color: #dd3c0e; 
}


#content3col {
  width: 570px;
  float:right;
}
#content2col {
  width: 820px;
  float:right;
}
#content1col {
  width: 950px;
  float:left;
}


#content3col  ul {
  margin: 4px;
  display: block; 
  color: black; 
  list-style:disc inside; 
}
#content3col li {
  margin-left: 10px; 
}
#content3col a {
  color: blue; 
}
#content3col a:hover {
  color: red; 
}

#leftwrapper3col {
  color: #333;
  float:left;
  /*width: 100%; */
  width: 750px; 
  margin-right: -95%;  
 /*overflow:hidden;*/
	/* this needs to be less than 100% for Moz/Mac which thinks 
         it's empty otherwise. The difference is made up by putting a 
         negative left margin on the left float:
	   Note IE/Mac doesn't like this method ~ it wants the 100% so it can 
	   be fed in using IE only CSS below becasue IE/Win also works with the 100% method.  
	*/
}

#leftwrapper2col {
  color: #333;
  float:left;
  /*width: 100%; */
  width: 100%; 
  margin-right: -95%;  
	/* this needs to be less than 100% for Moz/Mac which thinks 
         it's empty otherwise. The difference is made up by putting a 
         negative left margin on the left float:
	   Note IE/Mac doesn't like this method ~ it wants the 100% so it can 
	   be fed in using IE only CSS below becasue IE/Win also works with the 100% method.  
	*/
}

#leftwrapper1col {
  color: #333;
  float:left;
  width: 100%; 
 /* margin-right: -95%;  */
 margin-left:30px;
 overflow:hidden;
	/* this needs to be less than 100% for Moz/Mac which thinks 
         it's empty otherwise. The difference is made up by putting a 
         negative left margin on the left float:
	   Note IE/Mac doesn't like this method ~ it wants the 100% so it can 
	   be fed in using IE only CSS below becasue IE/Win also works with the 100% method.  
	*/
}


#left {
  float:left;
  width: 170px;
  /* margin-left: -5%; */ /* the difference to make the left colum appear flush left */
  color: #ffffff;
}

#rightwrapper3col {
  color: #333;
  float:right;
  width: 150px;       
  margin-right:2px; 
/*  margin-right: -95%; */
	/* this needs to be less than 100% for Moz/Mac which thinks 
         it's empty otherwise. The difference is made up by putting a 
         negative left margin on the left float:
	   Note IE/Mac doesn't like this method ~ it wants the 100% so it can 
	   be fed in using IE only CSS below becasue IE/Win also works with the 100% method.  
	*/
}

#right3col {
  float:right;
  /*width: 130px;
  color: #333;  */
}

#right3col img {
  margin-right: 0px;
}

.notrounded222Small
{
  /*width: 222px; */
  width: 100%; 
  height: 24px; 
  font-family: verdana, Geneva, arial, tahoma, 'Lucinda Grande', 'Lucida Sans Unicode', sans-serif;
	font-size: 1.2em;
  line-height: 1.2em;
  color:#444; 
  text-align:center;
  padding-top:2px;
}
.notrounded222
{
  margin: 0 auto;
  width: 222px; 
  height: 30px; 
  background-color:#76a681; 
  font-family: verdana, Geneva, arial, tahoma, 'Lucinda Grande', 'Lucida Sans Unicode', sans-serif;
  font-size: 150%;
  line-height: 1.2em; 
  color: #ddd;
  text-align: center;
}
.notrounded222small .notrounded222smallcontent,
.notrounded222small div 
{
 background:transparent url(/libtpfnew/img/notrounded222Green.png) repeat-x top left;
 _background-image:url(/libtpfnew/img/notrounded222Green.gif) repeat-x top left;
 height:32px;
 color:#444; 
 color:#000; 
 color:#FFF; 
  font-size:1.2em;
  padding-top:8px;
}
.notrounded222 .notrounded222content,
.notrounded222 div 
{
 background:transparent url(/libtpfnew/img/notrounded222Green.png) no-repeat top right;
 _background-image:url(/libtpfnew/img/notrounded222Green.gif);
 height:24px;
}

.notrounded222Small a, .notrounded222 a 
{
  color:#666;
}

.notrounded222Small a:hover, .notrounded222 a:hover 
{
  color:#dd3c03;
}




/*************       For IE Mac           **************/
/* IE/Win is also using these rules, but it doesn't mind */
* html div#center {margin-right: -100%;}
* html div#left {margin-left: 0;}

#left h3, #left p,
#right3col h3, #right3col p
{
  padding: 0 20px; 
}

#wrapper {
  position: relative;
  z-index: 500;
}


#photodiv {
  background-repeat: no-repeat;
  margin-left: 170px;
}
/*==============================================*\
  Buttons
\*==============================================*/
span.button-black-white
{
	white-space: nowrap;
}

span.button-black-white img
{
	width: 12px;
	height: 24px;
	float: left;
}
span.button-black-white-nofloat img
{
	width: 12px;
	height: 24px;
}

span.button-black-white img.button-left
{
	background: url('/libtpfimg/bLeft.gif') no-repeat;
}

span.button-black-white img.button-right
{
	background: url('/libtpfimg/bRight.gif') no-repeat;
}

span.button-black-white a
{
	display: block;
	float: left;
	background: #CCC url('/libtpfimg/bMiddle.gif') repeat-x top left;
	font: bold 11px/22px  sans-serif;
	color: #FFF;
	height: 24px;
	padding: 0 10px;
	text-decoration: none;
}

span.button-black-white a:hover
{
	color: #FFF;
}

span.button-black-white input, span.button-black-white button
{
	float: left;
	border: 0;
	background: #CCC url('/libtpfimg/bMiddle.gif') repeat-x top left;
	font: bold 11px/17px  sans-serif;
	color: #FFF;
	height: 24px;
	padding: 0 5px 5px 5px;
	cursor: pointer;
	margin: 0;
}

span.button-black-white-greenbkgd
{
	white-space: nowrap;
    margin-left: 30 px;
}

span.button-black-white-greenbkgd  img
{
	width: 12px;
	height: 24px;
	float: left;
}

span.button-black-white-greenbkgd  img.button-left
{
	background: url('/libtpfimg/bLeftGreenBkgd.gif') no-repeat;
}

span.button-black-white-greenbkgd  img.button-right
{
	background: url('/libtpfimg/bRightGreenBkgd.gif') no-repeat;
}

span.button-black-white-greenbkgd  a
{
	display: block;
	float: left;
	background: #CCC url('/libtpfimg/bMiddleGreenBkgd.gif') repeat-x top left;
	font: bold 11px/22px  sans-serif;
	color: #FFF;
	height: 24px;
	padding: 0 10px;
	text-decoration: none;
}

span.button-black-white-greenbkgd  a:hover
{
	color: #FFF;
}

span.button-black-white-greenbkgd  input, span.button-black-white-greenbkgd  button
{
	float: left;
	border: 0;
	background: #CCC url('/libtpfimg/bMiddleGreenBkgd.gif') repeat-x top left;
	font: bold 11px/17px  sans-serif;
	color: #FFF;
	height: 24px;
	padding: 0 5px 5px 5px;
	cursor: pointer;
	margin: 0;
}

/*
.rp {
	background-image : url(/libtpfimg/rp.gif);
}
.rp1 {
	background-image : url(/libtpfimg/rp1.gif);
}
.lp {
	background-image : url(/libtpfimg/lp.gif);
}
*/
.greenBackground160x28 {
	color:white;
	background-image : url(/libtpfimg/PFCGradient160x28.gif);
}
/*
.greenBackground170x20 {
	color:white;
	background-image : url(/libtpfimg/PFCGradient170x20.gif);
}

.greenBackground220x20 {
	color:white;
	background-image : url(/libtpfimg/MFCGradient220x20.jpg);
}
*/
.whiteMenuText{
	color:white;
	font-size:.688em;
}
.yellowMenuText{
	color:yellow;
	font-size:.813em;
}
/*  Store Menu Text Original */
.catMenuText{
	color:yellow;
	font-size:.75em;
}
.subMenuText{
	color:#E9F47B;
	font-size:.75em;
}
.subsubMenuText{
	color:white;
	font-size:.625em;
}
/*  Store Menu Text Original */


/*  New Store Menu Button classes */
.butMenuClass{
	margin :0px 0px 0px 4px;
	color:yellow;
	font-size:.75em;
}
.butsubMenuClass{
	margin :0px 0px 0px 0px;
	color:#E9F47B;
	font-size:.688em;
}

/*  New Store Menu Header classes */
.subMenuClass{
	margin :0px 0px 0px 24px;
	color:#E9F47B;
	font-size:.688em;
    display:none;
}
.subsubMenuClass{
    color:white;
    font-size:.625em;
    display:none;
}

/*  New Store Menu Link classes */
.subMenuLink{
	color:#E9F47B;
	font-size:.688em;
}
.subsubMenuLink{
	margin :0px 0px 0px 20px;
	color:white;
	font-size:.625em;
}

.smallTD {
	font-size:.688em;
}
.smallTD10 {
	font-size:.625em;
}
.yellowText{
	color:yellow;
}
.blackText{
	color:black;
}
.blackSmallText{
	font-size:.563em;
	color:black;
}
.greenText{
	color:green;
}
.redSmallText{
	font-size:.72em;
	color:red
}
.blueSmallText{
	font-size:.72em;
	color: Blue;
}
.whiteBoldText{
	color:white;
	font-weight:600;
}
.blueBoldText {
	color:#003399;
	font-weight:600;
}
.blueText {
	color:#003399;
}

.Bold {
	font-weight : 600;
}
.Transparent
{
	background: transparent;
}

.FramePageDiv
{          
  width:820px;
}
.FramePageDiv1
{          
  width:820px;
}

.FramePageDiv p
{          
  text-align: center;
}
.FramePageDiv br
{          
  margin-bottom:18px;
}


select.FramePageDiv 
{          
  text-align: center;
  margin-bottom:8px;
}


.FramePageDiv  h2
{
  text-align: center;
  font-family:georgia, "new century schoolbook", times, serif;
  /*font-family: Trebuchet, 'Trebuchet MS', 'Lucida Grande', Arial, sans-serif; */
  font-size: 2em;
  color: #01330b;
}
.FramePageDiv  h3
{
  text-align: center;
  font-family:georgia, "new century schoolbook", times, serif;
  /*font-family: Trebuchet, 'Trebuchet MS', 'Lucida Grande', Arial, sans-serif;*/
  font-size: 1.5em;
  color: #01330b;
}

p.FramePageDiv
{
  /*font: 12/18px tahoma,verdana,sans-serif;	*/
  color: #444;
  margin-left:8px;
    clear: both; 
}

hr.FramePageDiv
{
  color: #444;
}


img.floatLeftClear { 
    float: left; 
    clear: left; 
    margin: 8px; 
}

.centeredImage
{
  text-align:center;
  display:block;
}

main1 {
  ;
}
main1 p {
  color: green;
}


/* Large Banners */
.banner666 .banner666content,
.banner666 div 
{
 background:transparent url(/img/banner640.png) no-repeat top center;
 _background-image:url(/img/banner640.gif);
 height:44px;
}


.banner666, .banner626, .banner888, .banner888 {
 position:relative;
 color:#fff;
 /*z-index:9;*/
 margin-bottom:0.5em;
}

.banner666 .banner666content,
.banner666 div 
{
 background:transparent url(/libtpfnew/img/banner666Green.png) no-repeat top center;
 _background-image:url(/libtpfnew/img/banner666Green.gif);
 height:44px;
}

.banner666 h4, .banner626 h4, .banner888 h4  {
  /*font-family:georgia, "new century schoolbook", times, serif;*/
  /*font-family: 'Lucinda Grande', 'Lucida Sans Unicode', verdana, tahoma, arial, sans-serif;*/
  font-size: 1.6em;
  /*font-weight:600;*/
  line-height: 1.8em; 
  // color:#444; 
  color:#fff; 
  text-align: center;
  margin:0;

  font-style: none;
  text-decoration: none;

}
.banner666 a, .banner626 a,   .banner888 a {
   /* font-family:georgia, "new century schoolbook", times, serif; */

  /*font-family: 'Lucinda Grande', 'Lucida Sans Unicode', verdana, tahoma, arial, sans-serif;*/
  font-size: 1.6em;
  font-weight:600;
  line-height: 1.8em; 
  color:#444; 
  color:white;
  text-align: center;
  margin-top:6px;
}
.banner888 a:hover {color: #b00;}
.banner666 a:hover {color: #b00;}
.banner626 a:hover {color: #b00;}


.banner888 .banner888content,
.banner888 div 
{
 background:transparent url(/libtpfnew/img/banner888Green.png) no-repeat top center;
 _background-image:url(/libtpfnew/img/banner888Green.gif);
 height:44px;
}

.banner666 .banner666content,
.banner666 div 
{
 background:transparent url(/img/banner640.png) no-repeat top center;
 _background-image:url(/img/banner640.gif);
 height:44px;
}

.banner666, .banner626, .banner888, .banner888 {
 position:relative;
 color:#fff;
 /*z-index:9;*/
 margin-bottom:0.5em;
}




/* Small Banners */

.banner666Small .banner666contentSmall,
.banner666Small div 
{
 background:transparent url(/libtpfnew/img/banner666GreenSmall.png) no-repeat top center;
 _background-image:url(/libtpfnew/img/banner666GreenSmall.gif);
 height:32px;
}

.banner666Small h4, .banner626Small h4, .banner888Small h4  {
  font-size: 1.2em;
  line-height: 2.0em; 
  // color:#444; 
  color:#fff; 
  text-align: center;
  margin:0;

  font-style: none;
  text-decoration: none;

}
.banner666Small a, .banner626Small a,   .banner888Small a {
  font-size: 1.2em;
  font-weight:600;
  line-height: 1.2em; 
  color:#444; 
  color:white;
  text-align: center;
  //margin-top:8px;
}
.banner888Small a:hover {color: #b00;}
.banner666Small a:hover {color: #b00;}
.banner626Small a:hover {color: #b00;}


.banner888Small .banner888contentSmall,
.banner888Small div 
{
 background:transparent url(/libtpfnew/img/banner888GreenSmall.png) no-repeat top center;
 _background-image:url(/libtpfnew/img/banner888GreenSmall.gif);
 height:32px;
}






/*
.banner640 h4 {
  font-family: 'Lucinda Grande', 'Lucida Sans Unicode', verdana, tahoma, arial, sans-serif;
  font-size: 1.6em;
  font-weight:600;
  line-height: 1.8em; 
  color:#444; 
  text-align: center;
}
*/

.bannerOverlay
{
 color:#fff;
 /*z-index:1;*/
 height: 60px; 
 margin-top:30px;
 margin-bottom:0.5em;
}
.bannerOverlay .bannerOverlaycontent,.bannerOverlay div 
{
/*
 background:transparent url(/img/banner640.png) no-repeat top right;
 _background-image:url(/img/banner640.gif);
*/
 background:transparent url(/libtpfnew/img/banner666Green.png) no-repeat top right;
 _background-image:url(/libtpfnew/img/banner666Green.gif);

 height:44px;
}

.bannerOverlay h4 {
  margin-top:0px;
  _margin-top:0px;
  font-family: verdana, Geneva, arial, tahoma, 'Lucinda Grande', 'Lucida Sans Unicode', sans-serif;
  font-size: 1.6em;
  font-weight:600;
  font-style:normal;
  text-decoration:none;
  line-height: 1.8em; 
  color:#fff; 
  text-align: center;
}


.AccountDiv, .AccountDiv1
{
  font-family: 'Lucinda Grande', 'Lucida Sans Unicode', verdana, tahoma, arial, sans-serif;
  font-size: 11px;
  *font-size:small;
  *font:x-small;
}
.AccountDiv td, .AccountDiv1 td
{
	font-family: verdana, Geneva, arial, tahoma, 'Lucinda Grande', 'Lucida Sans Unicode', sans-serif;
  text-align: left;
   padding:4px; 
  font-size:11px;
  color:#00549a;
  color:#666;
}
.AccountDiv a{color:#00549a;}
.AccountDiv td{width:320px;}

/*
tr.expand {
   height: 30px;
}
tr {
   height: 30px;
}

tr.expand:hover {
   height: 300px;
}
tr:hover {
   height: 300px;
}
expand {
   height: 30px;
   overflow:hidden;
}
*/

/*
span.desc300, span.desc400, span.desc500, span.desc600, span.desc700, span.desc800, span.desc900, span.desc1000, span.desc1100, span.desc1200   {
    display: inline-block;
    overflow: hidden;
    /*white-space: nowrap;*/
	height:240px;
    width: 490px;
}

span.desc300:hover, span.desc400:hover, span.desc500:hover {
{
    display: inline-block;
    overflow: hidden;
    width: 490px;
}
*/

/*
span.desc300:hover
{
	
    display: inline-block;
    overflow: hidden;
    width: 490px;
	height:300px;
}

span.desc400:hover
{
    display: inline-block;
    overflow: hidden;
    width: 490px;
	height:400px;
}

span.desc500:hover 
{
    display: inline-block;
    overflow: hidden;
    width: 490px;
	height:500px;
}
span.desc600:hover 
{
    display: inline-block;
    overflow: hidden;
    width: 490px;
	height:600px;
}
span.desc700:hover 
{
    display: inline-block;
    overflow: hidden;
    width: 490px;
	height:700px;
}
span.desc800:hover 
{
    display: inline-block;
    overflow: hidden;
    width: 490px;
	height:800px;
}

span.desc900:hover 
{
    display: inline-block;
    overflow: hidden;
    width: 490px;
	height:900px;
}

span.desc1000:hover 
{
    display: inline-block;
    overflow: hidden;
    width: 490px;
	height:1000px;
}
span.desc1100:hover 
{
    display: inline-block;
    overflow: hidden;
    width: 490px;
	height:1100px;
}
span.desc1200:hover 
{
    display: inline-block;
    overflow: hidden;
    width: 490px;
	height:1200px;
}
*/