/* CSS Reset */
* { margin:0; padding:0; }
body {
  font:normal 11px Verdana, Geneva, sans-serif;
  color:#ccc;
    background: url(../images/body.jpg) repeat-x 0 0;
  }
#container {
  width:1024px;
  margin:0 auto;
}

#smallcontainer {
  width:939px;
  margin:0 auto;
}

#gridcontainer {
position: relative;
  width:939px;
  margin:0 auto;
}

#header {
  height:222px;
  width:939px;
  margin:-10px auto 0 auto;
}
#header h1 {
  display:block;
  float:left;
  width:939px;
  height:222px;
  background:url(../images/title.png) no-repeat 0 0;
}

#navbar{
margin:8px auto 0  auto;

}  

#navbar ul {
  padding-left: 15px;
  display:block;
  float:left;
  width:939px;
  height:48px;
  background:url(../images/nav.png) no-repeat 0 0;
  list-style:none;
}
#navbar li {
  padding-left: 15px;
  display:block;
  float:left;
  height:48px;
  text-indent:-10000px;
}

#navbar ul li a {
    padding-left: 15px;
 	float:left;
    display:block;
    width:100%;
    height:100%;
  }

#interactive {
width:205px;
}

#animation{
width:180px;
}

#gaming{
width:145px;
}

#design{
width:135px;
}

#video{
width:125px;
}

#navbar ul li a {

    display:block;
    width:100%;
    height:100%;
}
  
#interactive a:hover {
    background:url(../images/nav.png) no-repeat -30px -48px;
  }
#animation a:hover {
    background:url(../images/nav.png) no-repeat -250px -48px;
  }
#gaming a:hover {
    background:url(../images/nav.png) no-repeat -445px -48px;
  }
#design a:hover {
    background:url(../images/nav.png) no-repeat -605px -48px;
  }
#video a:hover{
 	background:url(../images/nav.png) no-repeat -756px -48px;
}

#footer{

  margin: 38px;
  width:939px;
  height: 41 px;
  color:#5f5f5f;
}


#navbottom{
}  

#navbottom ul {
  margin: -31px;
  display:block;
  float:right;
  width:260px;
  height:41px;
  background:url(../images/navbottom.png) no-repeat 0 0;
  list-style:none;
}
#navbottom li {

  display:block;
  float:right;
  height:41px;
  text-indent:-10000px;
}

#navbottom ul li a {

 	float:right;
    display:block;
    width:100%;
    height:100%;
  }

#about {
width:135px;
}

#contact{
width:115px;
}

#about:hover {
    background:url(../images/navbottom.png) no-repeat -125px -42px;
  }
#contact a:hover {
    background:url(../images/navbottom.png) no-repeat -10px -42px;
  }





<!-- slideshow
#slideshow {
	margin:0 auto;
	width:800px;
	height:300px;
	background:transparent url(../img/bg_slideshow.jpg) no-repeat 0 0;
	position:relative;
}
#slideshow #slidesContainer {
  margin:0 auto;
  width:800px;
  height:300px;
  overflow:auto; /* allow scrollbar */
  position:relative;
}
#slideshow #slidesContainer .slide {

  margin:0 auto;
  width:800px; /* reduce by 20 pixels of #slidesContainer to avoid horizontal scroll */
  height:300px;
}

/** 
 * Slideshow controls style rules.
 */
.control {
  display:block;
  width:39px;
  height:300px;
  text-indent:-10000px;
  position:absolute;
  cursor: pointer;
}
#leftControl {
  top:0;
  left:0;
  background:transparent url(../images/control_left.png) no-repeat 0 0;
}
#rightControl {
  top:0;
  right:0;
  background:transparent url(../images/control_right.png) no-repeat 0 0;
}


a {
  color: #fff;
  font-weight:bold;
  text-decoration:none;
}
a:hover {
  text-decoration:underline;
}
a img {border:2px solid #ccc;}

#pageContainer h1 {
  display:block;
  width:960px;
  height:114px;
  background:transparent url(../img/bg_pagecontainer_h1.jpg) no-repeat top left;
  text-indent: -10000px;
}
.slide h2, .slide p {
  margin:15px;
}
.slide h2 {
  font:italic 24px Georgia, "Times New Roman", Times, serif;
  color:#ccc;
  letter-spacing:-1px;
}
.slide img {
  float:right;
  margin:0 15px;
}

.right_current a:hover{

 	margin-left: -15px;

}


.current#interactive{
 	margin-left: 15px;
    background:url(../images/nav.png) no-repeat -30px -48px;
  }
  
  .current#interactive a:hover{
 	margin-left: -15px;
  }
    
.current#animation {
 	margin-left: 15px;
    background:url(../images/nav.png) no-repeat -250px -48px;
	
  }
  
  .current#animation a:hover{
 	margin-left: -15px;
  }
  
.current#gaming{
 	margin-left: 15px;
    background:url(../images/nav.png) no-repeat -445px -48px;
  }
  
  .current#gaming a:hover{
 	margin-left: -15px;
  }
  
.current#design{
 	margin-left: 15px;
    background:url(../images/nav.png) no-repeat -605px -48px;
  }
  
  .current#design a:hover{
 	margin-left: -15px;
  }
  
.current#video{
 	margin-left: 15px;
 	background:url(../images/nav.png) no-repeat -756px -48px;
}

.current#video a:hover{
 	margin-left: -15px;
  }