@charset "UTF-8";
body {
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #FFF;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-size: 75%;
	line-height: 1.7em;
	font-weight: normal;
	background: #000 url(images/NB-background-wacom.jpg) no-repeat center -30px;
	overflow:auto;
	position:static;
}

a {	color:#DC8128;}

#container {
	width: 880px; /* the auto margins (in conjunction with a width) center the page */
	border: 1px solid #000000;
	text-align: left;
	background-image: url(images/NB-wallpaper1.jpg);
	background-repeat: no-repeat;
	height: 545px;
	margin-left: auto;
	margin-right: auto;
	top: 79px;
	position: relative;
}

#containerBlank {
	width: 880px; /* the auto margins (in conjunction with a width) center the page */
	border: 1px solid #000000;
	text-align: left;
	background-image: url(images/NB-wallpaper.jpg);
	background-repeat: no-repeat;
	height: 545px;
	margin-left: auto;
	margin-right: auto;
	top: 79px;
	position: relative;
}

#containerOff {
	width: 880px; /* the auto margins (in conjunction with a width) center the page */
	border: 1px solid #000000;
	text-align: left;
	height: 545px;
	margin-left: auto;
	margin-right: auto;
	top: 79px;
	position: relative;
}

#containerAbout {
	width: 880px; /* the auto margins (in conjunction with a width) center the page */
	border: 1px solid #000000;
	text-align: left;
	background-image: url(images/NB-about.jpg);
	background-repeat: no-repeat;
	height: 545px;
	margin-left: auto;
	margin-right: auto;
	top: 79px;
	position: relative;
}

#containerContact {
	width: 880px; /* the auto margins (in conjunction with a width) center the page */
	border: 1px solid #000000;
	text-align: left;
	background-image: url(images/NB-contact.jpg);
	background-repeat: no-repeat;
	height: 545px;
	margin-left: auto;
	margin-right: auto;
	top: 79px;
	position: relative;
}
#portfolio {
	width: 880px; /* the auto margins (in conjunction with a width) center the page */
	border: 1px solid #000000;
	text-align: left;
	background-image: url(images/NB-portfolio.jpg);
	background-repeat: no-repeat;
	height: 545px;
	margin-left: auto;
	margin-right: auto;
	top: 79px;
	position: relative;
}

#containerLogo {
	width: 880px; /* the auto margins (in conjunction with a width) center the page */
	border: 1px solid #000000;
	text-align: left;
	background-image: url(images/NB-logos.jpg);
	background-repeat: no-repeat;
	height: 545px;
	margin-left: auto;
	margin-right: auto;
	top: 79px;
	position: relative;
}

#containerWeb {
	width: 880px; /* the auto margins (in conjunction with a width) center the page */
	border: 1px solid #000000;
	text-align: left;
	background-image: url(images/NB-web.jpg);
	background-repeat: no-repeat;
	height: 545px;
	margin-left: auto;
	margin-right: auto;
	top: 79px;
	position: relative;
}

#containerArt {
	width: 880px; /* the auto margins (in conjunction with a width) center the page */
	border: 1px solid #000000;
	text-align: left;
	background-image: url(images/NB-illustration.jpg);
	background-repeat: no-repeat;
	height: 545px;
	margin-left: auto;
	margin-right: auto;
	top: 79px;
	position: relative;
}

#containerLogo {
	width: 880px; /* the auto margins (in conjunction with a width) center the page */
	border: 1px solid #000000;
	text-align: left;
	background-image: url(images/NB-logos.jpg);
	background-repeat: no-repeat;
	height: 545px;
	margin-left: auto;
	margin-right: auto;
	top: 79px;
	position: relative;
}

#header {
	background-image: url(images/NB-menu-bg-trans.png);
	background-repeat: repeat-x;
	height: 20px;
	padding-top: 0;
	padding-right: 10px;
	padding-bottom: 0;
	padding-left: 10px;
}
#header h1 {
	margin: 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
	font-size: .95em;
	line-height: normal;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-weight: normal;
	color: #000;
	padding-top: 0px;
	padding-right: 0;
	padding-bottom: 1px;
	padding-left: 0;
}
#mainContent {
	padding-right: 20px;
	padding-bottom: 20px;
	padding-left: 20px;
	padding-top: 10px;
	height: 495px;
}
#footer {
	height: 54px;
	padding-top: 0;
	padding-right: 10px;
	padding-bottom: 0;
	padding-left: 10px;
	position: absolute;
	top: 495px;
	width: 859px;
	background-attachment: scroll;
	background-repeat: no-repeat;
	background-position: center 18px;
}
#footer a#contactLink{
	background-image: url(images/NB-dock-contact.png);
	background-repeat: no-repeat;
	margin-top: 100px;
	background-attachment: scroll;
	background-position: center center;
	padding-left: 65px;
	padding-top: 50px;
	padding-bottom: 50px;
}
#footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}
#footer a:hover#contactLink{
	background-image: url(images/NB-dock-contactHover.png);
}
#footer a#logoLink {
	background-image: url(images/NB-dock-logo.png);
	background-repeat: no-repeat;
	margin-top: 100px;
	background-attachment: scroll;
	background-position: center center;
	padding-left: 65px;
	padding-top: 50px;
	padding-bottom: 50px;
}
#footer a:hover#logoLink {
	background-image: url(images/NB-dock-logoHover.png);
}
#footer a#sketchLink {
	background-image: url(images/NB-dock-sketch.png);
	background-repeat: no-repeat;
	margin-top: 100px;
	background-attachment: scroll;
	background-position: center 0px;
	padding-left: 65px;
	padding-top: 50px;
	padding-bottom: 50px;
}
#footer a:hover#sketchLink {
	background-image: url(images/NB-dock-sketchHover.png);
}
#footer a#cintiqLink {
	background-image: url(images/NB-dock-cintiq.png);
	background-repeat: no-repeat;
	margin-top: 100px;
	background-attachment: scroll;
	background-position: center 7px;
	padding-left: 85px;
	padding-top: 50px;
	padding-bottom: 50px;
}
#footer a:hover#cintiqLink {
	background-image: url(images/NB-dock-cintiqHover.png);
}
#footer a#portfolioLink {
	background-image: url(images/NB-dock-portfolio.png);
	background-repeat: no-repeat;
	margin-top: 100px;
	background-attachment: scroll;
	background-position: center 13px;
	padding-left: 100px;
	padding-top: 50px;
	padding-bottom: 50px;
	margin-left: -25px;
}
#footer a:hover#portfolioLink {
	background-image: url(images/NB-dock-portfolioHover.png);
}
#footer a#webLink {
	background-image: url(images/NB-dock-web.png);
	background-repeat: no-repeat;
	margin-top: 100px;
	background-attachment: scroll;
	background-position: center 13px;
	padding-left: 100px;
	padding-top: 50px;
	padding-bottom: 50px;
	margin-left: -25px;
}
#footer a:hover#webLink {
	background-image: url(images/NB-dock-webHover.png);
}

/* dock - top */
.dock {
	position: relative; 
	height: 50px; 
	text-align: center;
}
.dock-container {
	position: absolute;
	height: 50px;
	background: url(images/dock-bg2.gif);
	padding-left: 20px;
}
a.dock-item {
	display: block;
	width: 40px;
	color: #000;
	position: absolute;
	top: 0px;
	text-align: center;
	text-decoration: none;
	font: bold 12px Arial, Helvetica, sans-serif;
}
.dock-item img {
	border: none; 
	margin: 5px 10px 0px; 
	width: 100%; 
}
.dock-item span {
	display: none; 
	padding-left: 20px;
}

/* dock2 - bottom */
#dock2 {
	width: 100%;
	bottom: 0px;
	position: absolute;
	left: -10px;
}
.dock-container2 {
	position: absolute;
	height: 50px;
	padding-left: 20px;
	bottom: 0px;
	background-image: url(images/mydock_center.png);
	background-attachment: scroll;
	background-repeat: repeat-x;
	background-position: bottom;
}
a.dock-item2 {
	display: block;
	font: bold 12px Arial, Helvetica, sans-serif;
	width: 40px;
	color: #FFF;
	bottom: 0px;
	position: absolute;
	text-align: center;
	text-decoration: none;
}
.dock-item2 span {
	display: none;
	padding-left: 20px;
}
.dock-item2 img {
	border: none; 
	margin: 5px 10px 0px; 
	width: 100%; 
}

#index-col1 {
	width: 291px;
	height: 199px;
	position: absolute;
	left:111px;
	top: 169px;
	padding-right:30px;
	border:none;
}

#index-col2 {
	width: 390px;
	height: 365px;
	border: none;
	position: absolute;
	left: 455px;
	top: 65px;
	padding-right:10px;
	padding-top: 5px;
	overflow:auto;
}

#index-col2 ul, li{
margin:0;
padding:0;
list-style-type:none;
}

#index-col2 li{
background:url(images/nate-blog.png) left 5px no-repeat;
padding-left: 30px;
} 

#index-col2 li .date{
margin-top: -5px;
font-size: .7em;
border-bottom:grey 1px solid;

} 

#index-col2 li .headline{
	margin-top: -15px;
	font-size: 1.1em;
}

#index-col2 li .headline a{
	text-decoration: none;
}


#index-col2 li img{
padding: 10px 20px 10px 0 !important;
width: 125px;
height:auto;
float: left;

}



#aboutcol {
	width: 337px;
	height: 386px;
	border: none;
	position: absolute;
	left: 278px;
	top: 45px;
	padding-right:30px;
	overflow:auto;
	padding-left: 20px;
}

#contactcol {
	width: 454px;
	height: 367px;
	border: none;
	position: absolute;
	left: 69px;
	top: 72px;
	padding-right:30px;
	overflow-y:auto;
	overflow-x:hidden;

}
#portfoliocol {
	width: 359px;
	height: 367px;
	border: none;
	position: absolute;
	left: 55px;
	top: 80px;
	padding-right:30px;
	overflow-y:auto;
	overflow-x:hidden;
}

#portfoliocol2 {
	width: 359px;
	height: 367px;
	border: none;
	position: absolute;
	left: 478px;
	top: 80px;
	padding-right:30px;
	overflow-y:auto;
	overflow-x:hidden;
}

#webcontent{
	width: 551px;
	height: 415px;
	border: none;
	position: absolute;
	left: 350px;
	top: 52px;
	overflow-y:auto;
	overflow-x:hidden;
}

#webcontent2{
	position: absolute;
	left: 437px;
	top: 53px;
	text-align:left;
	width: 397px;
}

#sliderContent{
		margin:175px auto;
		position:relative;
		text-align:left;
		width:696px;
}

#artcontent{
	width: 800px;
	height: 415px;
	border: none;
	position: absolute;
	left:60px;
	top: 100px;
	overflow-y:auto;
	overflow-x:hidden;
}

#artContent2{
	width: 670px;
	height: 1199px;
	position: absolute;
	left:128px;
	top: 102px;
	text-align:center;
	}
	

#balloon{
	display:none;
	width: 162px;
	height: 173px;
	position: absolute;
	left:469px;
	top: 115px;
	overflow-y:hidden;
	overflow-x:hidden;
}

#like{
	width: 346px;
	height: 35px;
	position: absolute;
	left:494px;
	top: 57px;
	overflow-y:hidden;
	overflow-x:hidden;
}

#sliderContent{
		margin:175px auto;
		position:relative;
		text-align:left;
		width:696px;
}

img{border:none;}


#logocol {
	width: 873px;
	height: 370px;
	border: none;
	position: absolute;
	left: 6px;
	top: -27px;
	overflow:hidden;
}

.tbmain{ 
 /* Changes on the form */
}
.left{
  /* Changes on the form */
  color: #cccccc !important; 
  font-family: Verdana !important;
  font-size: 12px !important;
}
td.left {
   font-family: "Trebuchet MS";
   font-size: 12px;
   font-weight:normal;
   color:#cccccc;
   vertical-align: top;
   text-align: left;
}
.pagebreak{
   font-family: "Trebuchet MS";
   font-size: 12px;
   font-weight:bold;
   color:black;
}
td.right {
   font-family: "Trebuchet MS";
   font-size: 12px;
   font-weight:normal;
   color:#cccccc;
   vertical-align: top;   
   text-align: left;   
}
.tbmain{
   height:100%;
}
.head{
   font-family: "Trebuchet MS";
   font-size: large;
   font-weight:bold;
   color:#ffffff;
   vertical-align: top;
   text-align: left;
}
.notvalid{
   border:2px red solid;
   font-family:"Trebuchet MS";
}
.text{
   font-family: "Trebuchet MS";
   font-size: 12px;
   font-weight:normal;
   color:#cccccc;
   border:1px #000000 solid;
   background:url(http://jotform.com/images/styles/style4_txt_bg.gif) #333333 top repeat-x;
}
select.other{
   font-family: "Trebuchet MS";
   font-size: 12px;
   font-weight:normal;
   color:#ffffff;
   border:1px #000000 solid;
   background:url(http://jotform.com/images/styles/style4_txt_bg.gif) #333333 top repeat-x;
}
.btn{
   font-family: "Trebuchet MS";
   font-size: 12px;
   font-weight:normal;
   color:#cccccc;
   border:1px #000000 solid;
   background: url(http://jotform.com/images/styles/style4_btn_bg.gif) #333333 top repeat-x;
}
span.required{
  font-size: 13px !important;
  color: red !important;
}
 
div.backButton{
    background: transparent url("http://jotform.com//images/btn_back.gif") no-repeat scroll 0 0;
    height:16px;
    width:53px;
    float:left;
    margin-bottom:15px;
    padding-right:5px;
}
div.backButton:hover{
    background: transparent url("http://jotform.com//images/btn_back_over.gif") no-repeat scroll 0 0;
}
div.backButton:active{
    background: transparent url("http://jotform.com//images/btn_back_down.gif") no-repeat scroll 0 0;
}
div.nextButton{
    background: transparent url("http://jotform.com//images/btn_next.gif") no-repeat scroll 0 0;
    height:16px;
    width:53px;
    float: left;
    margin-bottom:15px;
    padding-right:5px;
}
div.nextButton:hover{
    background: transparent url("http://jotform.com//images/btn_next_over.gif") no-repeat scroll 0 0;
}
div.nextButton:active{
    background: transparent url("http://jotform.com//images/btn_next_down.gif") no-repeat scroll 0 0;
}
.pageinfo{
    padding-right:5px;
    margin-bottom:15px;
    float:left;
}

.thumbnail {
	float: left;
		text-align: center;
	width: 165px;
	height: 100px;
}

.artthumbnail {
	float: left;
		text-align: center;
	width: 125px;
	height: 125px;
}

.artthumbnail2 {
	float: left;
		text-align: center;
	width: 114px;
	height: 114px;
}


p.captions {
	color: white;
	font-weight: bold;
	font-size: .7em;
	line-height: 1.2em;
	display: inline-block;
}

.morepages {
	width: 490px;
	font-size: 0.85em;
	font-weight: bold;
	height: 20px;
	border: none;
	position: absolute;
	left: 350px;
	top: 25px;
	overflow-y:hidden;
	overflow-x:hidden;
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;
}


.facebook {
	width: 300px;
	font-size: 0.85em;
	font-weight: bold;
	height: 600px;
	border: none;
	position: absolute;
	left: 687px;
	top: 37px;
	overflow-y:hidden;
	overflow-x:hidden;
	font-family: Arial, Helvetica, sans-serif;
}

#morepages{
	width: 104px;
	height: 30px;
	border: none;
	position: absolute;
	left: 398px;
	top: 75px;
	overflow-y:auto;
	overflow-x:hidden;
	font-weight:bold;
}

#morepages a{
	text-decoration:none;
}

#onButton {
	width:67px;
	height:20px;
	border: 1px white solid;
	position:absolute;
	top: 18px;
	left: 50%;
	margin-left:-33px;
}

#game {
	width: 528px;
	height: 232px;
	position: absolute;
	left:50%;
	margin-left:-353px;
	top: 20px;
	padding-right:30px;
	border:none;
}


#aboutLinks {
	width: 192px;
	height: 153px;
	position: absolute;
	left:32px;
	top: 280px;
	border:none;
}
	
#gameHome{
	width: 104px;
	height: 30px;
	border: none;
	position: absolute;
	left: 21px;
	top: 40px;
	overflow-y:auto;
	overflow-x:hidden;
	font-weight:bold;
}

#boxtest{
		width:67px;
	height:20px;
	border: 1px white solid;
	}