/* CSS Document */ /* Size and center the page inside the body tag */ html, body {width:100%; background:#fff url(http://nsystems.com/img/bg.jpg) repeat-x; text-align:center;} div#page {margin:0 auto; width:900px; border:2px solid #fff; text-align:left; background:url(http://nsystems.com/img/) repeat-y #fff;} /* Font preferences */ * { font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#444; line-height:18px; } p, td, div, {font-size:12px; line-height:16px;} a:active {outline: none;} a:focus {-moz-outline-style: none;} /* Header and bold tags */ h1 {line-height:21px; border-bottom:none; color:#0000a0; font-size:18px; font-weight:900; margin-top:0; text-transform:none;} h2 {line-height:16px; padding-top:12px; padding-bottom:1px; color:#000; font-weight:900; font-size:15px; margin:0;} h3 {line-height:15px; padding:4px 0; color:#000; font-weight:900; font-size:14px;} h4 {line-height:14px; padding:4px 0; color:#000; font-weight:900; font-size:13px;} strong {color:#000; font-weight:900;} object, embed {display:block; text-align:center; margin:0 auto;} /* Defualt unordered lists */ ul li {background:url(http://nsystems.com/img/bullet.gif) no-repeat 0 6px; padding-left:15px; list-style:none; padding-bottom:8px;} ul {margin:0px; padding:0 0 0 20px;} li.nsi {background:url(http://nsystems.com/img/nsi_logo_bullet.png) no-repeat 0 4px; padding-left:15px; list-style:none; padding-bottom:6px; font-weight:bold;} /* Defualt definition lists */ dt {color:#0000a0;font-weight:900;margin:10px 0pt; border-bottom: #CCCCCC 1px solid;} dd {text-indent:0pt; padding-bottom:30px;} /* Default link and hover preferences */ a {color:#0000a0; text-decoration:underline;} a:hover {color:#0066CC; text-decoration:underline;} /* Main block elements */ #header {background:#fff; height:86px; position:relative;} #header #headGraphic {background:url(http://nsystems.com/img/head.png) no-repeat; height:200px; position:absolute; z-index:5; width:900px; height:179; left:0; top:0;} #left {vertical-align:top; border-right:#E6E6E6 2px solid;} #right {vertical-align:top; padding-top:13px;} #footer {height:10px; line-height:10px; font-size:10px; padding:2px 10px 10px 0 ; background:#003399 url(http://nsystems.com/img/footer-bg.jpg) repeat-x; text-align:right; color:#FFFFFF;} #footer a {color:#FFFFFF; text-decoration:none; font-size:10px;} #footer a:hover {color:#FFFFFF; text-decoration:underline;} #mainTable {display:block; width:900px;} #seo {width:900px; margin:10px auto; text-align:center; font-size:10px; color:#479;} #leftContent, #productMain #rightContent, #appMain #rightContent {padding:0 20px 20px 20px;} #leftContent h1 {border-bottom:0px dashed #FF3300; color:#0000a0; font-size:18px; font-family:Futura,"Century Gothic",AppleGothic,"Trebuchet MS",sans-serif; font-weight:900; margin-top:0;} #rightContent {padding-left:6px; padding-right:13px;} #rightContentnew {padding-left:5px; padding-right:2px;} /* Home Conditionals */ #home #left {width:581px; background:url(http://nsystems.com/img/body-bg.jpg) repeat-x 0 340px;} #home #single {width:900px; background:#fff; } #home #center {width:900px; background:url(http://nsystems.com/img/body-bg.jpg) repeat-x 0 340px;} #home #right {width:321px; padding-top:55px;} #home #rightContent {padding-right:0;} #home h1 {line-height:21px; padding:4px 0; color:#0000a0; font-weight:900; font-size:19px; border-bottom:#0000a0 0px solid; text-transform:none;} /*Home Page News */ #news { border: 0px solid #0000a0; } #news td { width:305px; height:36px; background: url(http://nsystems.com/img/news_table_header.png) no-repeat; padding-left:8px; padding-right:17px; } #news h2 { line-height:10px; border-bottom:none; color:#0000a0; font-size:18px; font-weight:900; margin-bottom:20px; text-transform:none; text-align:center; } #news p.link { font-size: 14px; font-weight:bold; text-align:center; } /* Product Main Conditionals */ #productMain #left, #productSub #left, #appMain #left {width:244px; background:url(http://nsystems.com/img/pm-left-bg.jpg) repeat-y;} #productMain #leftContent, #productSub #leftContent, #appMain #leftContent {padding-top:15px;} #productMain #right, #productSub #right, #appMain #right {width:654px; background:url(http://nsystems.com/img/body-bg.jpg) repeat-x;} /* NAV */ #header ul.nav {position:absolute; width: 900px; left:0px; top:69px; height:25px; overflow:visible; display:block; padding:0; margin:0; z-index:6;} #header ul.nav li {display:inline; float:right; padding:0; margin:0; color:#000000; width: } /* #header ul.nav li + li a {border-right:1px #000000 solid;} Replace with hover arrow */ #header ul.nav a {display:block; color:#fff; text-decoration:none; font-size:13px; height:15px; min-width:10px; line-height:15px; padding:2px 14px; font-weight:normal; text-align:center;} div#header ul.nav a:hover {color:#FF3300; background:url(http://nsystems.com/img/nav-arrow.gif) no-repeat 0 9px;} #left ul.nav {display:block; margin:0; padding:0;} #left ul.nav li {display:block; margin:0; padding:0;} #left ul.nav a {display:block; color:#FFF; text-decoration:none; font-size:12px; height:12px; line-height:14px; padding:4px 10px; font-weight:900; color:#000;} #left ul.nav a:hover {color:#666;} /* Sticky Nav */ body.productPage a.productPage, body.companyPage a.companyPage, body.homePage a.homePage, body.appPage a.appPage, body.contactPage a.contactPage, body.supportPage a.supportPage, body.newsPage a.newsPage, #productMain a.productPage, #productSub a.productPage, #appMain a.appPage, #appSub a.appPage {background:url(http://nsystems.com/img/nav-arrow.gif) no-repeat 0 9px;} /* Paragraph classes (use sparingly - use tag globals whenever possible) */ p.caption {font-size:10px; color:#999999; line-height:normal;} strong.red {color:#CC0000;} em.red {color:#CC0000;} /* Category Main - preferences here need to be customized for your needs */ /* category structure:

- for secondary text, not used in example below

*/ div.category {border-bottom:#999999 1px dashed; position:relative; padding:15px; height:250px; width:163px; float:left;} div.category img {border:none; background:url(http://nsystems.com/img/no-image.jpg) no-repeat; width:163px;} div.category h1 {position:absolute; left:15px; top:185px; width:163px; height:42px; line-height:14px; padding:4px 0; color:#666; font-weight:900; font-size:14px; overflow:hidden;} /* adjust div.category height if you use this: div.category h2 {position:absolute; left:15px; top:250px; width:163px; height:42px; line-height:14px; padding:4px 0; color:#ccc; font-weight:500; font-size:12px; overflow:hidden;} /* Products Main */ /* This is set up as 1-wide, set width and float left to make columns. */ /* product structure:

or
    needs "view" or "buy" button

*/ div.product {border-bottom:#999 1px dashed; position:relative; padding:15px 0; height:200px;} div.product img {border:none; background:url(http://nsystems.com/img/no-image.jpg) no-repeat; width:100px;} div.product h1 {position:absolute; left:175px; top:15px; width:420px; height:14px; line-height:14px; padding:4px 0; color:#000; font-weight:900; font-size:14px; border-bottom:#ccc 1px dotted; overflow:hidden;} div.product h2, div.product ul {position:absolute; left:175px; top:45px; width:420px; height:120px; line-height:normal; padding:0; color:#ccc; font-weight:normal; font-size:11px; overflow:hidden;} div.product ul li {padding-bottom:5px;} div.product a.prodButton {position:absolute; left:488px; top:145px; background:url(http://nsystems.com/img/view-button.jpg) no-repeat; display:block; height:30px; width:117px;} /* Products Details */ /* To be elaborated... */ div.detail img {width:300px; border:none;} div.detail {border-right:#999999 1px dashed; position:relative; width:300px; padding-right:14px;} div.detail label {display:block; height:auto; line-height:14px; padding:4px 0; color:#800000; font-weight:900; font-size:14px; border-bottom:#800000 1px solid; margin-bottom:15px;} div.detail p {line-height:normal; padding:0; color:#888; font-weight:normal; font-size:11px; overflow:hidden;} div.detail form {display:block; padding:0; margin:0; position:relative; height:90px;} div.detail input.submit {background:url(http://nsystems.com/img/buy-now.jpg) no-repeat; display:block; height:30px; width:117px; position:absolute; top:45px; left:163px; border:none;} div.detail select.ddl, div.detail select.ddm, div.detail select.ddr {width:80px;position:absolute; top:16px;} div.detail label.ddl, div.detail label.ddm, div.detail label.ddr {width:90px;position:absolute; top:0; display:block; font-size:12px; height:12px;} /* Affiliated products */ /* use for related products on detail page */ #aff {float:right; width:265px; padding-right:15px;} div.aff img {height:75px; width:75px; border:none;} div.aff {border-bottom:#999999 1px dashed; position:relative; padding:15px 0; height:100px; margin:20px 0;} div.aff label {display:block; height:auto; line-height:12px; padding:4px 0; color:#800000; font-weight:900; font-size:12px; border-bottom:#800000 1px dotted; margin-bottom:10px;} #aff a {text-decoration:none; display:block; width:180px; height:14px; position:absolute; left:85px; top:107px; background:#FFFFFF url(http://nsystems.com/img/view-more.jpg) no-repeat;} #aff h1 {height:14px; line-height:14px; padding:4px 0; color:#800000; font-weight:900; font-size:14px; border-bottom:#800000 1px solid; margin:0 0 10px 0;} div.aff p {position:absolute; left:85px; top:45px; width:180px; padding:0; margin:0; height:42px; line-height:14px; overflow:hidden;} /* FORMS */ #form, #form li {display:block; list-style:none; margin:0; padding:0; position:relative; background:none;} #form li label {display:block; width:155px; background:#E9E9E9; line-height:16px; padding:2px 5px; text-align:right;} #form li input, #form li textarea , #form li select {position:relative; left:170px; width:370px; top:-21px;} /* Top H1 element */ h1#title {display:block; text-align:center; width:850px; margin:5px auto; border:none; font-size:10px; color:#666666; padding:0; text-transform:none;} /* Newsfeed */ #newsfeed {padding:0 14px 0 5px; margin:0;} #newsfeed li {padding:10px 5px 10px 0; margin:0; clear:both; border-bottom:#e6e6e6 0px dashed;} #newsfeed li h1 {padding:0 0 3px 0; margin:0; font-size:12px; border:none; color:#000;} #newsfeed li p {padding:0 0 3px 0; margin:0; font-size:12px; border:none; color:#0000a0} #newsfeed li img {float:right;} /* Product page left nav */ .productNav {padding:0 0 15px 5px; margin:0;} .productNav li {padding:6px 0 6px 20px; margin:0; clear:both; border-bottom:#e6e6e6 0px dashed; background: url(http://nsystems.com/img/left-bull.jpg) no-repeat 0 10px;} .productNav li a {color:#0000a0; text-decoration:none} .productNav li a:hover {text-decoration: underline} #productList {position:relative; z-index:100; margin:0; padding-left:0px; height:346px; padding-top:52px} #productList.productNav li {padding-bottom:0px;} /*#productList.productNav li a {padding:0; margin:0; display:block; height:30px; text-decoration:none;} */ #productListnew {position:relative; z-index:100; margin:0; padding-left:10px; height:346px; padding-top:52px} #productListnew.productNav li {padding:0; margin:0; } #productListnew.productNav li a {padding:0; margin:0; text-decoration:none;} .productNavNew {padding:0 0 0px 0px; margin:0;} .productNavNew li {padding:0px 0 0px 0px; margin:0; clear:both;} .productNavNew li a {color:#0000a0; text-decoration:none;} .productNavNew li a:hover {text-decoration: none;} /* Product page sub nav */ #subNav {display:block; padding:0 0 0 554px; margin:0; height:35px; position:relative; background:url(http://nsystems.com/img/pm-sub-nav.jpg) no-repeat;} /* Product Classes*/ #page.cm #subNav {background-image:url(http://nsystems.com/img/sub/cm-sub-nav.jpg);} #page.mc #subNav {background-image:url(http://nsystems.com/img/sub/mc-sub-nav.jpg);} #page.np #subNav {background-image:url(http://nsystems.com/img/sub/np-sub-nav.jpg);} #page.npr #subNav {background-image:url(http://nsystems.com/img/sub/np-r-sub-nav.jpg);} #page.npt #subNav {background-image:url(http://nsystems.com/img/sub/np-t-sub-nav.jpg);} #page.ot #subNav {background-image:url(http://nsystems.com/img/sub/ot-sub-nav.jpg);} #page.qd #subNav {background-image:url(http://nsystems.com/img/sub/qd-sub-nav.jpg);} #page.qk #subNav {background-image:url(http://nsystems.com/img/sub/qk-sub-nav.jpg);} #page.sp #subNav {background-image:url(http://nsystems.com/img/sub/sp-sub-nav.jpg);} #page.ssa #subNav {background-image:url(http://nsystems.com/img/sub/ssa-sub-nav.jpg);} #page.ss #subNav {background-image:url(http://nsystems.com/img/sub/ss-sub-nav.jpg);} #page.sts #subNav {background-image:url(http://nsystems.com/img/sub/sts-sub-nav.jpg);} #page.am #subNav {background-image:url(http://nsystems.com/img/sub/am-sub-nav.jpg);} #page.ac #subNav {background-image:url(http://nsystems.com/img/sub/ac-sub-nav.jpg);} #page.ar #subNav {background-image:url(http://nsystems.com/img/sub/ar-sub-nav.jpg);} #page.mu #subNav {background-image:url(http://nsystems.com/img/sub/mu-sub-nav.jpg);} #subNav li {display:block; width:111px; float:left; padding:0; margin:0;} #subNav li a { display:block; height:35px; text-decoration:none;} #subNav li a:hover, body.features a.features, body.downloads a.downloads, body.overview a.overview {background:url(http://nsystems.com/img/pm-sub-nav-hover.jpg) no-repeat 11px 12px;} #breadcrumb {padding:90px 0 15px 15px; background:#fff;} #breadcrumb a {color:#0000a0; font-weight:900;} #productMain #breadcrumb, #appMain #breadcrumb {padding:15px; display:none;} img.productMainTop {display:none} #productMain img.productMainTop, #appMain img.productMainTop {display:block;} ul.disc {padding-bottom:12px;} ul.disc li {padding-left:20px; background: url(http://nsystems.com/img/bul.png) no-repeat} ul.disc8 {padding-bottom:5px;} ul.disc8 li {padding-left:20px; background: url(http://nsystems.com/img/bul.png) no-repeat} ul.disc_body {padding-bottom:2px; padding-left:265px;} ul.disc_body li {padding-left:20px; padding-bottom:2px; background: url(http://nsystems.com/img/bul.png) no-repeat} ul.productNavDownloads {padding:0 0 15px 5px; margin:0;} ul.productNavDownloads li {padding:6px 5px 6px 20px; margin:0; clear:both; border-bottom:#e6e6e6 0px dashed; background: url(http://nsystems.com/img/pdf-icon.jpg) no-repeat 0 10px;} ul.productNavDownloads li a {color:#0000a0; text-decoration:none} ul.productNavDownloads li a:hover {text-decoration: underline} /* Camera Icon */ a.cameraIcon { background:url(http://nsystems.com/img/camera.jpg) no-repeat 3px 3px #fff; height:15px; padding:4px 4px 5px 29px; line-height:15px; border:4px #D8E4FC solid; color:#000; display:block; text-decoration:none;} a.cameraIcon:hover {border:4px #ccc solid;} a.pdf { background:url(http://nsystems.com/img/pdf-icon.jpg) no-repeat 2px 2px #fff; height:12px; padding:5px 5px 5px 29px; line-height:12px; border:3px #D8E4FC solid; color:#000; display:block; text-decoration:none; font-size:12px; margin-bottom:20px;} a.pdf:hover {border-color:#ccc;}