body, h1, h2, h3, h4, p, ul, li, form, textarea, input, label		{margin:0; padding:0;}

* {font-weight:100;}

body					{
						background:#747474;
						text-align:center; /* for IE */
						padding:0 0 20px 0;
						}
						
a:link					{
						text-decoration:none;
						color:#333300;
						}
						
a:visited					{
						text-decoration:none;
						color:#333300;
						}
						
a:hover					{
						text-decoration:none;
						color:#000;
						}
						
a:active				{
						text-decoration:none;
						color:blue;
						}

#wrap					{
						position:relative;
						margin:20px auto;
						padding:0 0 0 0;
						width:850px;
						text-align:left; /* for IE */
						background:#ddd;
						background:url('http://fourjay.com/images/wrapBG.gif') top left no-repeat;
						
						/* tweak */
						background-position:fixed;
						margin-top:0;
						}

#foot { 
	float:left;
	clear:both;
	width:850px;
	height:30px;
	background:url('http://fourjay.com/images/footBG.gif') top left no-repeat;
	text-align:center;
	color:#0066cc;
}
			

						
/* Search */
						
#search					{
						position:relative;
						width:211px;
						height:37px;
						/*margin:0 0 0 550px;
						top:16px;*/
						background:transparent;
						background:url('http://fourjay.com/images/search_bg-new.png') no-repeat;
						
						/* tweak */
						position:fixed;
						left:50%;
						margin:0 0 0 120px;
						top:10px;
						z-index:999;
						}
						
						
#search form			{
						position:absolute;
						left:0;
						bottom:0;
						width:210px;
						height:40px;
						}
						
label					{
						margin-left:-9999px;
						}

.searchbox				{
						position:absolute;
						top:14px;
						left:7px;
						margin:0;
						width:180px;
						}
						
.submit					{
						position:absolute;
						top:2px;
						right:3px;
						width:35px;
						height:35px;
						margin:0;
						padding:0;
						border:0;
						background:url('http://fourjay.com/images/submit-trans.png');
						}
						
/* end Search */


/* Head */

#head					{
						position:relative;
						width:685px;
						height:68px;
						/*margin:-20px 0 0 90px;*/
						background:url('http://fourjay.com/images/nav_bg_new-trans.png') no-repeat;
						
						/* tweak */
						position:fixed; 
						left:50%;
						margin:12px 0 0 -330px;
						z-index:998;
						
						}
		
/* end head */

div#headbg {position:fixed; width:850px; height:127px; z-index:777; background:url('http://fourjay.com/images/headBG-trans.png');}


/* Typography */

body					{
						font-family: Helvetica, Verdana, 'Arial Narrow', Arial, Courier, sans-serif;
						font-size:13px;
						color:#333300;
						}
						
#head					{
						top:35px;
						font-size:1.1em;
						color:#333300;
						}
						
h1						{
						position:absolute;
						display:block;
					  /*top:37px;
						right:510px;*/ 
						width:271px;
						height:300px;
						font-size:30px;
						background:url('http://fourjay.com/images/fourjay_h1-trans.png') no-repeat;
						text-indent:-9999px;
						
						/* tweak */
						position:fixed;
						left:50%;
						margin:0 0 0 -215px;
						top:15px;
						z-index:999;
						}
						
h2						{
						font-size:1.8em;
						}
						
h3 {
	font-size:16px;
}
						
p						{
						line-height:1.5em;
						}
						
li						{
						font-size:1em;
						}
						
li ul					{
						font-size:0.9em;
						}
	

/* end Typography */

/* Logo */

#logo					{
						position:absolute;
						top:2px;
						left:15px;
						width:150px;
						height:158px;
						background:url('http://fourjay.com/images/logosmaller-trans.png');
						z-index:999;
						
						/* tweak */
						position:fixed;
						left:50%;
						margin:0 0 0 -420px;
						top:2px;
						}

/* end Logo */

/* CONTENT 1 */

#content1 {
	position:relative;
	top:29px;
	left:30px;
	width:250px;
	height:370px;
	background:url('http://fourjay.com/images/content1-trans.png');
}

#content1 p {
	float:left;
	width:85%;
	margin:50px 20px;
	left:20px;
	font-size:1.6em;
	line-height:1.7em;
	font-weight:100;
	letter-spacing:-1px;
	text-indent:-9999px; 
}

/* end CONTENT 1 */


/* CONTENT 2 */

#content2 {
	position:absolute;
	top:365px;
	left:300px;
	width:255px;
	height:108px;
	background:url('http://fourjay.com/images/content2-trans.png');
}

#content2 ul {
	list-style:none;
	font-size:1.4em;
	padding:15px 0 0 15px;
	font-weight:100;
}

/* end CONTENT 1 */



/* Catalog Index Pages */

#cat_content	 		{
						position:relative;
						float:left;
						top:63px;
						left:35px;
						width:625px;  
						padding-bottom:10px;
						background:#f5f5f5;
						
						/* tweak */
						top:130px;
						}
						
#cat_content a			{
						color:#f1f1f1;
						}
						
#cat_content a:hover	{
						color:#ff9900;
						}

a img					{
						border:0;
						}
						
#cat_content h2, #contact h2, #pdetail h2 {
						width:100%;
						height:27px;
						line-height:1.7em;
						padding-top:20px;
						background:url('http://fourjay.com/images/h2BG.jpg') top left no-repeat;
						margin:0px 0 4px 0px; 
						text-indent:3px;
						}
						
						
#cat_content h2 span {
	position:absolute;
	right:5px;
	top:18px;
	font-size:12px;
	color:brown;
}	

#cat_content h2 span img {
	position:absolute;
	margin:6px 3px 0 -23px;
}
						
#cat_content h4			{
						float:left;
						dislay:block;
						width:100%;
						margin:4px 0 10px 0;
						padding:6px 0 4px 0;
						background:url('http://fourjay.com/images/sub_head_bg1.gif');
						border-top:2px solid #fff;
						border-bottom:2px solid #fff;
						text-indent:5px;
						font-size:1.4em;
						line-height:1.5em;
						color:#192292;
						font-weight:normal;
						}
						
#cat_content p			{
						width:94%;
						text-align:justify;
						margin:0 8px;
						}
						
						
/* end cat index pages */


/* Product Series */

.series					{
						position:relative;
						float:left;
						width:450px;
						background:#fff; 
						margin:0 0 10px 40px;
						border-bottom:1px solid #cacaca;
						border-right:1px solid #cacaca;
						overflow:visible;
						}
						
.series *				{
						float:left;
						}
						
.series p				{
						width:96%;
						padding:4px 0;
						text-align:justify;
						}
						
.series p img			{
						float:left;
						padding:2px 4px 0 0;
						margin:0 3px 0 0;
						}
						
.series h3  			{
						float:none;
						width:500px;
						height:35px;
						margin-left:-18px;
						line-height:35px;
						text-indent:10px;
						background:url('http://fourjay.com/images/item_head.gif') no-repeat top left;
						color:#f5f5f5;
						font-weight:100;
						overflow:visible;
						}
						
.series span			{
						position:absolute;
						display:block;
						top:0px;
						right:0px;
						width:70px;
						height:46px;
						}
						
.series span a			{
						width:55px;
						height:32px;
						text-indent:-9999px;
						z-index:999;
						display:block;
						background:url('http://fourjay.com/images/pdf_img_new.png') no-repeat top left;
						}
						
.series span a:hover	{
						background:url('http://fourjay.com/images/pdf_img_hov_new.png') no-repeat top left;
						}
						

/* end Product Series */


/* Product Detail */

#pdetail, #contact		{
						position:relative;
						float:left;
						top:63px;
						left:35px;
						width:625px;  
						padding-bottom:10px;
						background:#f5f5f5;
						
						/* tweak */
						top:130px;
						}
						
#pdetail img			{
						position:relative;
						float:right;
						border:2px solid #ddd;
						margin:-35px 10px 0 8px;
						padding:3px;
						z-index:500;
						}
						
#pdetail p				{
						margin:7px 10px; 0 8px;
						line-height:1.4em;
						}
						
#pdetail h2 + p { 
	min-height:90px;						
}
						
/*
#pdetail h2				{
						margin:5px 0 0 4px;
						padding-top:7px;
						}
*/						
#pdetail h3				{
						font-size:0.95em;
						font-weight:bold;
						margin:3px;
						}
						
#pdetail span			{
						color:#000;
						}
						

						
#pdetail table			{
						clear:both;
						margin:5px auto;
						width:96%;
						border-top:1px solid #e0e0e0;
						border-right:1px solid #e0e0e0;
						border-left:1px solid #e0e0e0;
						line-height:1.3em;
						background:#f5f5f5;
						font-size:0.95em;
						}
						
#pdetail table a		{
						color:blue;
						}
						
#pdetail table a:hover	{
						border-bottom:1px dotted blue;
						}
						
div#pdetail table tr td img {margin:0; padding:0;}

						
#pdetail tr:first-child	{
						color:#f2f2f2;
						background:#333;		
						}
						
#pdetail .infoblock		{
						width:92%;
						background:#fafafa;
						margin:7px auto;
						border-top:1px solid blue;
						}
						
#pdetail .infoblock	p	{
						display:block;
						min-height:17px;
						}
						
#pdetail .infoblock	img	{
						margin:0;
						}
						
.detail_col_L { float:left; width:48%; margin:5px 0 0 5px; }
						
.detail_col_R { float:right; width:48%; margin:5px 0 0 5px; }
						
.detail_col_L ul { margin:2px 0 0 19px; list-style:none; }
						
.detail_col_R ul { margin:2px 0 0 19px; list-style:none; }

.detail_col_L span { margin:2px 0 0 19px; list-style:none; }
						
.detail_col_R span { margin:2px 0 0 19px; list-style:none; }
					
#pdetail li				{
						color:#333;
						}

/* end Product Detail */


/* Contact Info Box */

#contact_info { 
	width: 190px; 
	height:37px;
	position:fixed; 
	top: 185px; 
	left:50%; 
	background:url('http://fourjay.com/images/call_to_order.png'); 
	margin-left:235px;
	border-top:2px solid #fff;
	border-bottom:2px solid #fff;
}

#contact_info p	{ 
	text-indent:-9999px;
}

/*  end contact info box */

#comp_chart { 
	width: 190px; 
	height:37px;
	position:fixed; 
	top: 300px; 
	left:50%; 
	background:url('http://fourjay.com/images/comp_chart.jpg'); 
	margin-left:235px;
	border-top:2px solid #fff;
	border-bottom:2px solid #fff;
}

#comp_chart p	{ 
	position:relative;
}

#comp_chart p a	{ 
	position:relative;
	display:block;
	line-height:37px;
	text-indent:-9999px;

}


/* Classes and Miscellany */

div#pdetail img .longheader {padding-top:1000px; margin-top:1000px; }

#pdetail table img.pdflogo {
						border:2px solid #f5f5f5;
						}
						
#pdetail table img.pdflogo:hover {
						border:2px solid blue;
						}
						
strong					{
						font-weight:bold;
						}

						
.smallerText			{
						font-size:9px;
						}
						
tr.smallerText>td:first-child {font-size:1em}

.stretch					{
							display:block;
							clear:both;
							height:15px;
							position:relative;
							margin:0;
							margin-top:60px;
							padding-top:130px;
							}
							
.toprow					{
						background:#333;
						}
							
.withimgs img			{
						padding:0 18px;
						}
							

							
.series p.widep			{
						width:96%;
						margin:0 0 3px 3px;
						}


.series table			{
						font-size:0.95em;
						width:430px;
						margin:3px 10px;
						border-top:1px solid #e0e0e0;
						border-right:1px solid #e0e0e0;
						border-left:1px solid #e0e0e0;
						line-height:16px;
						}
						
.series tr				{
						display:block;
						width:430px;
						border-bottom:1px solid #e0e0e0;
						}
						
.series td				{
						display:block;
						width:74%;
						}
						
.series tr>td:first-child {
						width:25%;
						background:#f0f0f0;
						}
						
.widenote				{
						position:relative;
						text-align:center;
						display:block;
						width:96%;
						margin:8px;
						padding:3px;
						background:#ffffcc;
						border:1px solid #999;
						}
						
#cat_content p.loner	{
						position:relative;
						display:block;
						float:left;
						width:94%;
						background:#e5e5e5;
						margin:0px 7px 3px 7px;
						padding:5px;
						}

/* home page */


.collage {position:relative; width:723px; height:301px; top:130px; left:45px;}

#tagline {position:relative; top:135px; left:53px; width:710px; height:68px; background:url('http://fourjay.com/images/tagline.gif'); text-indent:-9999px;}

#feature {position:relative; top:149px; left:53px; width:448px; height:163px; background:url('http://fourjay.com/images/feature.jpg'); text-indent:-9999px; margin-bottom:0px;}

#feature span {position:absolute; bottom:16px; right:22px; width:99px; height:22px; z-index:99999; text-indent:0; background:url('images/learn-more.png') top left no-repeat;}
#feature span a {display:block; width:100%; height:100%; margin:6px 0 0 15px; color:blue;}
#feature span a:hover {font-weight:bold;}

#orgs {float:right; position:relative; width:235px; height:175px; margin:-10px 90px 0 0;}

#orgs img {position:absolute;}

.nsca {top:0; left:33px;}

.ipma {top:80px; left:0;}

.ibma {top:80px; left:120px;}						

/* end home page */


/* NEWNAV */

#newnav					{
						position:absolute;
						top:90px;
						left:170px;
						z-index:9999;
						font-size:16px;
						
						/* tweak */
						position:fixed; 
						left:50%;
						margin:0 0 0 -270px;
						top:80px;
						}
						

/* START CSS MENU REQUIREMENTS */

    /* This is the part for the CSS menu - these settings are for a horizontal menu */
    #dmenu{                         /* menu list container */
        list-style-type: none;      /* disable the display of the list item bullets */
        margin: 0px;                /* space around the list container */
        padding: 0px;               /* space within the list container */
        position: static;           /* need this so that the z-index stuff works correctly */
        background:transparent;     /* the default background color within the main menu container */
        color: #000;                /* the default font color (not links) within the main menu container */
        z-index:9999;                /* push the menu up in the layer order a bit so it isn't hidden behind anything */
            /* Browser plug-ins like Flash or Quicktime may not allow you to overlap then with this menu! */
    }
    #dmenu li{                      /* top-level menu element */
        list-style-type: none;      /* disable the display of the list item bullets */
        float: left;                /* this is to allow for the horizontal main menu */
        border:0;    /* border for each of the main menu items */
        background: transparent;     /* main menu item background color */
        color: #000;                /* main menu item font color (not links) */
        margin: 0px;                /* spacing between main menu items */
        padding: 0px;               /* padding within main menu items */
        width: 120px;               /* the width of each main menu item */
        display: block;
    }

    #dmenu ul {                     /* third-level (or greater) menu element list elements */
        position: absolute;         /* this is so that it doesn't push that page content around on hover */
        margin: 0px;                /* space around the list container */
        padding: 0px;               /* space within the list container */
        list-style-type: none;      /* disable the display of the list item bullets */
        display: none;
        width: 120px;               /* should be the same as #dmenu li width */
        background:transparent;     /* sub-menu default background color */
        border:0;     /* the border around the sub-menu list */
        color: #000;                /* sub-menu default font color (not links) */
        z-index: 99;                /* want to be sure this is above the rest of the menu */
    }

    #dmenu ul li{                   /* second-level or greater menu element links */
        background-color: #fff;     /* default background color for sub-menu container */
        color: #000;                /* default font color (not links) for sub-menu container */
        border: none;               /* sub-menu item border settings */
        margin: 0px;                /* spacing between sub-menu containers */
        padding: 3px;               /* This is for padding between menu items in the drop-downs */
        width: 120px;               /* (padding*2) must be subtracted from #dmenu li width and set for this one, or borders won't display properly. */
    }

    #dmenu li a{                    /* top-level menu element links */
        text-align: center;         /* text alignment in main menu item links */
        width: 120px;               /* set this to #dmenu ul width */
        display: block;
    }
    
    #dmenu ul a {                   /* all the other level menu link elements */
        padding: 3px;
        margin: 0px;
        width: 120px;               /* (padding*2) must be subtracted from #dmenu ul li width and set for this one, or borders won't display properly. */
        display: block;
    }

    #dmenu a:hover,                 /* top-level hovering properties */
    #dmenu li:hover{
        display: block;
        background-color: #fff;
        color: #000033;
    }
    
    #dmenu ul li:hover,             /* higher level hovering properties */
    #dmenu ul li a:hover{
        display: block;
        width: 120px;               /* should be set to the same value as #dmenu ul li width */
        background-color: #ccc;
        color: blue;
    }

    #dmenu ul ul{                   /* higher-level list containers */
        display: none;              /* don't display by default */
        position: absolute;
        margin-left: 120px;         /* this should be the width of #dmenu ul li */
        margin-top: -2em;           /* this will push the sub-menu up to the level of it's parent */
    }

    /* only non-MSIE browsers use this */
    #dmenu ul li>ul,
    #dmenu ul ul li>ul{
        margin-top: -2em;           /* should be set to the same as #dmenu ul ul margin-top */
    }

    /* additional sub-menu levels in the next 2 blocks. (For up to 5 levels of drop menus) */
    #dmenu li:hover ul ul,              
    #dmenu li:hover ul ul ul,
    #dmenu li:hover ul ul ul ul,
    #dmenu li:hover ul ul ul ul ul{
        display:none;
    }

    #dmenu li:hover ul,
    #dmenu ul li:hover ul,
    #dmenu ul ul li:hover ul,
    #dmenu ul ul ul li:hover ul,
    #dmenu ul ul ul ul li:hover ul{
        display:block;
    }

    li>ul {
        top: auto;
        left: auto;
    }

	.content {                      /* This is used for the content that will appear below the menu */
        clear: left;
    }
    
  /* nav bx patch */
ul#dmenu li, ul#dmenu li ul, ul#dmenu li ul li, ul#dmenu li ul li:hover, ul#dmenu li ul li a, ul#dmenu li ul li a:hover  {width:125px; margin:0 0 0 0; padding:3px 0 3px 0;}
ul#dmenu li {width:126px;}
ul#dmenu li ul li a {font-size:12px !important;}
ul#dmenu li ul {background:transparent;}
ul#dmenu li {border:1px solid #f5f5f5;}
ul#dmenu li:hover {border:1px solid #f0f0f0;}


/* new contact thickbox */
div#ajax_contact div#cardholder {margin-left:12px;}
div#ajax_contact div#cardholder div.org, .adr, .street-address, .locality, .region, .postal-code, .email, .tel, .fax, a.email {line-height:20px; font-size:17px;}
div#ajax_contact div#cardholder span.vcard {font-size:13px;}
div#ajax_contact h2.a_contact {padding:7px 0 10px 0; font-size:26px;}
div#ajax_contact div#cardholder img.hcard {display:block; padding-top:17px;}

/* multi PDF thickbox */
div#multiPDF {display:block; position:relative; top:0; left:0; background:#fff;}
div#multiPDF span {display:block; float:left; clear:left; width:200px; text-align:center; margin:0 auto;}
div#multiPDF span a {display:block; float:left; clear:left; width:80%; padding:10px; margin-top:7px; background:#eee; border:1px solid #999;}
div#multiPDF span a:hover {background:#f4f4f4;}