/*
    NASCOR JOISTS Universal CSS
    Put CSS in here to be used anywhere on site
    CSS by Ian Russell @ EVOLVS.COM  Dec 2005
    www.evolvs.com | ian@evolvs.com
*/

/*FIX BG IMAGE IN BODY*/

body {
    padding: 0px;
    margin: 0px;
    background: #FFF url(../images/gradient-bg.jpg) left top repeat-x;
}

a {
    text-decoration: none;
}

#masterContainer a:link, #masterContainer a:visited {
    color: #77781D;
}

#masterContainer a:hover {
    color: #000;
    text-decoration: underline;

}


/*
CONTAINER
*/

#masterContainer {
    width: 770px;
    padding-top: 0px;
    background: url(../images/content-bg.png) 0px 0px repeat-y;
    overflow: hidden;
    height:auto;


}

#headerBox {
    position: relative;
    background: url(../images/header-bg.png) 0px 0px no-repeat;
    height: 144px;
}

#contentWrap {
    font: 12px "Georgia", Times-Roman, serif;
    line-height: 20px;
    height:auto;
    background: url(../images/content-bottom.png);
    background-position:bottom left;
    background-repeat: no-repeat;



    /*background: red 0px bottom no-repeat;*/


}
#contentArea {
    background-image:url(images/bonkers.gif);
    background-repeat:no-repeat;
    background-position:left top;
    padding: 15px 20px 20px 12px;

    text-align: left;


}
#contentArea #leftColumn {
    float:left;
    margin:0;
    width:530px;

    background-image:url(../images/bgBoxShadow.gif);
    background-position:left top;
    background-repeat:no-repeat;
    background-color:none;
    padding-left:13px;
    padding-right:7px;
}
#contentArea  #leftColumn .h4 {
    padding:0;
    margin:0;
    padding-bottom:8px;
    padding-top:17px;
    display:inline;
    margin-left:-1px;
}
#contentArea #leftColumn .h4 img {

    display:inherit;

}
#contentArea #leftColumn table tr td.listBullet {
    background-image:url(../images/blueListStar.jpg);
    background-position:left top;
    background-repeat:no-repeat;
    width:25px;


}
#botBar {

    /*border: 1px solid springgreen;*/
    height: 200px;
    font: 10px Tahoma, Verdana, Arial, Helvetica, sans-serif;
    padding-top:20px;
    line-height:10px;
    background-color:#FFF;
    margin-bottom:-150px;
}
#botBar div a {
    float: left;
    display: block;
    padding: 10px;
}

#botBar span {
    float: right;
    padding: 10px 20px 10px 10px;
    color: #999;
}

#botBar span a:link, a:visited, a:hover {
    color: #000;
    text-decoration: underline;
}

#botBar div a:link, a:visited, a:hover {
    color: #999;
    text-decoration: none;
}

#botBar div  a:hover {
    text-decoration: underline;
}


/* LOGO */

#logo {

}

#logo h2 {
    margin: 0;
    padding: 0;
    height: 143px;
    width: 320px;
    float: left;
    /*border: 1px solid springgreen;*/
}

#logo h2 a {
    display: block;
    margin: 0;
    padding: 0;
    height: 100%;
}

#logo h2 a:link, #logo h2 a:visited {
    background: url(../images/top-logo.png) 0px 0px no-repeat;
}

#logo h2 a:hover  {
    background: url(../images/top-logo.png) 0px -143px no-repeat;
}

#logo h2 b {
    display: none;
}

/*
NAVIGATION
*/

#tabNav {
    position: absolute;
    left: 262px;
    top: 119px;
}

#tabNav a {
    float: left;
    padding: 0px 10px 0px 5px;
    margin: 5px 5px 5px 0px;
    border-left: 3px solid #DED2A1;
}

#tabNav a:hover {
    border-left: 3px solid #000;
}

#tabNav  a.current{

    border-left: 3px solid #000 !important
}

#roleNav {
    margin: 1px 15px 0px 5px;
    height: 37px;
    overflow: hidden;
    width:  760px;
}

#roleNav  a {
    float: left;
    background: #C0A94A;
}

#roleNav  a:hover {
    background: #7F6F2B;
}

#roleNav  a.current {
    background: #000;
}

a.tips {
    position: absolute;
    width: 63px;
    height: 144px;
    text-indent: -9999px;
    top: 0px;
    left: 709px;
    background: url(../images/nav-tips.png) 0px 0px no-repeat;
    border:none;
    text-decoration:none;
}

a.tips:hover {
    background: url(../images/nav-tips.png) 0px -144px no-repeat;
    border:none;
    text-decoration:none;
}

a.framing {
    position: absolute;
    width: 63px;
    height: 144px;
    text-indent: -9999px;
    top: 0px;
    left: 640px;
    background: url(../images/framing_demo.png) 0px 0px no-repeat;
    border:none;
    text-decoration:none;
}

a.framing:hover {
    background: url(../images/framing_demo.png) 0px -144px no-repeat;
    border:none;
    text-decoration:none;
}

#joists a {
    position: absolute;
    width: 65px;
    height: 96px;
    text-indent: -9999px;
    top: 20px;
    border:none;
    text-decoration:none;

}

a#joist1, a:link#joist1, a:visited#joist1 {
    left: 376px;
    background: url(../images/header-joists-nj.png);
    background-repeat:no-repeat;
    background-position:left top;
    border:none;
    text-decoration:none;

}

a:hover#joist1 {
    background: url(../images/header-joists-nj-over.png);
    background-repeat:no-repeat;
    background-position:left top;
    border:none;
    text-decoration:none;

}

a#joist2, a:link#joist2, a:visited#joist2 {
    left: 441px;
    background: url(../images/header-joists-njh.png);
    background-repeat:no-repeat;
    background-position:left top;
    border:none;
    text-decoration:none;

}

a:hover#joist2 {
    background: url(../images/header-joists-njh-over.png);
    background-repeat:no-repeat;
    background-position:left top;
    border:none;
    text-decoration:none;

}

a#joist3, a:link#joist3, a:visited#joist3 {
    left: 506px;
    background: url(../images/header-joists-nju.png);
    background-repeat:no-repeat;
    background-position:left top;
    border:none;
    text-decoration:none;

}

a:hover#joist3 {
    background: url(../images/header-joists-nju-over.png);
    background-repeat:no-repeat;
    background-position:left top;
    border:none;
    text-decoration:none;

}
/*
RIGHT BAR (BLUE SLANTY LINE HEADERS, ON THE RIGHT)
*/
#rightBar {
    float:right;
    font-size:10px;
    margin:0;
    padding:0;
    margin-right:2px;

    margin-top:2px;
    /*margin-top:-5px;*/
    background-image:url(../images/blueSideNavList-bg-middle.jpg);
    background-repeat:repeat-y;
    background-position:top;
    width:175px;

}
#rightBar h3 {
    background-image:url(../images/blueSideNav-bg-bar.gif);
    background-position:right top;
    background-repeat:no-repeat;
    margin:0;
    padding:0;
    color:#FFFFFF;


}
#rightBar h3 img.leftBar{
    padding:0;
    margin:0;
    display:inline;
    float:left;
    height:25px;
}
#rightBar h3 img.title{
    display:inline;
}
#rightBar #text {
    background-image:url(../images/blueSideNavList-bg-bottom.jpg);
    background-position:bottom;
    background-repeat:no-repeat;
}
#rightBar ul {
    padding:0;
    margin:0;
    padding-left:26px;
    padding-top:4px;
    font-size:11px;
    font-weight:bold;
    line-height:1.5em;
}
#rightBar #text a img{
    border:none;
    padding-left:5px;
}
#rightBar #text strong {
    padding-left:13px;
    font-size:10px;
}
#rightBar #text a.pdf{
    line-height:1.2em;
    vertical-align:top;
    display:block;
    padding-top:5px;
    padding-bottom:6px;
    text-decoration:none;
}
#rightBar #text a.pdf:hover{
    background-color:#ECEFF4;
    text-decoration:none;
}
#rightBar #text a.pdf img{
    float:left;
}
#rightBar #text a.pdf .title{
    color:#000000;
}
#rightBar #text a.pdf .size{
    color:#666666;
}
#rightBar .rightBarClear {
    clear:both;
    background-color:#FFFFFF;
    height:15px;
}
/*
TIP BAR (PRETTY)
*/
#tipBar {
    display:block;
    width:533px;
    line-height:1.6em;
    padding:0;
    margin:0;
    margin-left:-4px;

}
#tipBar table #text {
    padding-top:12%;
    padding-bottom:6%;
    margin-bottom:-5px;
    width:533px;
    background-image:url(../images/tip-bottom.jpg);
    background-position:bottom;
    background-repeat:no-repeat;

}
#tipBar table #text p{
    padding-left:45px;
    height:70%;
    width:460px;
}
.productTable {
    text-decoration:none;
}
.productTable a {
    text-decoration:none;
    color:red;
}
.productTable a:hover {
    border:none;
    text-decoration:none;
}
.productTableLink {
    border:none;
    text-decoration:none;
    text-transform:uppercase;
    font-size:10px;
    line-height:1.3em;

}
.productTable img{
    border:none;
    text-decoration:none;
}

.upper {
    text-transform:uppercase;
    line-height:1.3em;

}
.upperSmall {
    text-transform:uppercase;
    font-size:10px;
    line-height:1.3em;
    color:#666666;
}.upperSmall:hover {
    color:#000000;
    }
.spec {
    color:#666666;

}
.resourcesList {


    padding-bottom:10px;
    height:auto;
}
.resourcesList a {
    line-height:2em;
    padding-top:3px;
    padding-bottom:3px;
    margin-left:20px;

}

.resourcesList a:hover{
    color:#333333;
}
.resourceIcon {
    border:none;
    vertical-align:bottom;
}
.tipsList {
    padding-bottom:10px;
    height:auto;

}
.tipsList div {
    margin-left:20px;
    margin-right:20px;
}
.tipsList div p {
    padding-left:10px;
    padding-right:10px;
}
.tipsTitleOdd {
    /*border-left:4px solid #77781D;*/

    font-weight:800;

}
.tipsTitleEven {
    /*border-left:4px solid #77781D;*/

    font-weight:800;

}
.tipsTopAnchor {

    margin-left:30px;


}
.Odd {
    /*background-color:#EEE;
*/
}
.Even {

}
.tipsHeader {
    font-weight:bold;
    margin-left:22px;

}