@import url(reset.css);

body {
margin-top:10px;
font-family:'Trebuchet MS', Helvetica, sans-serif;
font-size:100%;
}

#ns {
width:675px;
margin-top:150px;
margin-bottom:600px;
margin-left:auto;
margin-right:auto;
border:3px solid #000;
text-align:center;
padding-top:50px;
padding-bottom:50px;
color:#000;
background-color:#fff;
}

#container {
width:936px;
margin-left:auto;
margin-right:auto;
border:1px solid #fff;
}

#wordBox {
margin-top:2px;
float:right;
width:400px;
height:450px;
background:#fff url(../imgs/wordbox.png) no-repeat;
border:1px solid #fff;
}

#wordBox a {
display:block; 
width:400px; 
color:#fff;
text-decoration:none !important;
text-align:right;
}

a#sw {height:63px;}
a#sw:hover {background: url(../imgs/sw.png) no-repeat;}

a#ws {height:119px; margin-top:-4px}
a#ws:hover {background: url(../imgs/ws.png) no-repeat;}

a#ds {height:124px; margin-top:-33px}
a#ds:hover {background: url(../imgs/ds.png) no-repeat;}

a#dv {height:114px; margin-top:-21px}
a#dv:hover {background: url(../imgs/dv.png) no-repeat;}

a#cs {height:77px; margin-top:-39px}
a#cs:hover {background: url(../imgs/cs.png) no-repeat;}

ul#subnav li {
display:inline;
}

ul#subnav li#exW {
margin-right:230px;
}

ul#subnav a {
display:inline;
color:#808080;
width:100px;
font-size:0.7em;
text-align:left;
text-decoration:none !important;
}

ul#subnav a:hover {
color:#5e7f8e;
}

a.email,
a.contactLink {
margin-top:10px;
color:#808080;
font-size:0.7em;
text-align:right;
text-decoration:none !important;
}

a.email:hover,
a.contactLink:hover,
ul#navigate li a:hover,
ul#navigate2 li a:hover {
color:#5e7f8e;
}

#graphicBox {
margin-top:210px;
margin-left:50px;
float:left;
width:400px;
height:410px;
}

#graphic {
width:400px;
height:400px;
background: url(../imgs/box2.jpg) no-repeat;
border: 1px solid #c0c0c0;
}

#footer {
height:15px;
width:400px;
float:right;
text-align:right;
}

#footer span {
font-size:0.7em;
color:#cfb0b0;
}


/* Topic Pages */

#contentBox {
margin-top:100px;
margin-left:50px;
float:left;
width:400px;
height:410px;
}

ul#navigate {
text-align:right;
}

ul#navigate2 {
margin-top:16px;
}

ul#navigate li {
display:inline;
}

ul#navigate li.spacer {
color:#bbb;
font-size:0.7em;
}

ul#navigate li a {
font-size:0.7em;
color:#909090;
text-decoration:none !important;
}

ul#navigate2 li a {
color:#909090;
text-decoration:none !important;
}

#textHere {
width:380px;
height:310px;
background: url(../imgs/box2a.jpg) no-repeat;
border: 1px solid #c0c0c0;
padding:80px 10px 10px 10px;
}

#textHere ul {
list-style-type:disc;
padding-left:40px;
}

#textHere ul li {
padding-left:10px;
width:90%;
margin-bottom:6px;
}

#sampleBox {
margin-top:-60px;
float:right;
width:360px;
padding:10px;
border:1px solid #333;
background-color:#333;
}

#sampleBox img {
display:block;
width:250px;
margin-left:auto;
margin-right:auto;
margin-bottom:6px;
}

#sampleSites li,
#sampleApps li {
text-align:center;
margin-top:20px;
margin-bottom:40px;
}

#sampleSites li a,
#sampleApps li a {
font-size:0.8em;
color:#fff;
text-decoration:underline !important;
}

#sampleSites li a {
padding-right:18px;
background: url(../imgs/elink2.png) 100% 80% no-repeat;
}

ul#sampleApps {
color:#fff;
}

h1 {
color:#5e7f8e;
font-size:1.2em;
font-weight:bold;
margin-bottom:18px;
}

strong {
font-weight:bold;
}

#textHere ul, p {
font-family: Verdana, Geneva, sans-serif;
margin-bottom:6px;
font-size:0.8em;
color:#606060;
width:90%;
margin-left:auto;
margin-right:auto;
}

.hiddenContent {
width:650px;
height:250px;
padding:20px 10px;
}

.hiddenContent p {
font-size:0.7em;
}

.hiddenContent img {
width:300px;
float:left;
margin-right:20px;
}

.hiddenContent h2 {
margin-bottom:14px;
font-family:"arial narrow";
color:#5e7f8e;
}

#imageBox,
#imageBox2,
#imageBox3,
#imageBox4 {
margin-top:2px;
float:right;
width:400px;
height:400px;
background:#fff url(../imgs/puzzleglobe.jpg) 0% 0% no-repeat;
border:1px solid #fff;
}

#imageBox2 {
background:#fff url(../imgs/design.jpg) 0% 0% no-repeat;
}

#imageBox3 {
background:#fff url(../imgs/develop.jpg) 0% 0% no-repeat;
}

#imageBox4 {
background:#fff url(../imgs/contact.jpg) 0% 0% no-repeat;
}

/* Contact popup */
#contactBox {
width:400px;
height:200px;
background: url(../imgs/box2a.jpg) no-repeat;
padding:40px 0px 0px 0px;
}

#contactBox h1 {
text-align:center;
}

#contactBox ul {
list-style-type:disc;
padding-left:40px;
}

#contactBox ul li {
padding-left:10px;
width:90%;
margin-bottom:6px;
}