html {
height:100.1%;
}

body {
	text-align: center;
	margin	: 0px;
	background-image: url(images/background.jpg);
	background-repeat: repeat-x;
	background-color: #36378A;
}
#pagewrapper {
  	margin	: 0 auto;
  	width	: 1000px;
  	text-align: left;
	background-image: url(images/page-bottom.gif);
	background-repeat: no-repeat;

  }

/*page structure */
	
#banner {
	margin-top: 0px;
	margin-left: 0px;
	height:153px;
	width:1000px;
	z-index:1;
	position:absolute;
	background-color: #000000;
	}

#menu {
	margin-top: 153px;
	margin-left: 0px;
	width:1000px;
	height:46px;
	z-index:2;
	position:absolute;
	background-color:#FFFFFF;
	}
	

#pagecontent {
	margin-top: 199px;
	margin-left: 0px;
	width: 1000px;
	position:absolute;
	padding-bottom:10px;
	background-color:#FFFFFF;
	background-image: url(images/page-bottom.gif);
	background-repeat: no-repeat;
	background-position:bottom;
	z-index:23;
	min-height: 45%;
	}
	
/* Banner Replacement */

h1#banner {
    position: relative;
    padding: 0;
    margin: 0;
    width: 1000px; /* image width */
    height: 153px; /* image height */
    overflow: hidden;
}

h1#banner span {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	padding: 0;
	margin: 0;
	width: 1000px; /* image width */
	height: 153px; /* image height */
	background: url(images/banner-background.jpg) top left no-repeat;
}

/* Menu Styles */
ul#menu { /* all lists */
	padding:0;
	margin:0 0 0 0px;
	height:46px;
	list-style:none;
	display:block;
}



#menu li{ /* float list items */
	float:left;
}

#menu li#home {width:125px;}
#menu li#videoanddvdproduction {width:125px;}
#menu li#design {width:125px;}
#menu li#photography {width:125px;}
#menu li#marketing {width:125px;}
#menu li#conversion {width:125px;}
#menu li#clients {width:125px;}
#menu li#contactus {width:125px;}

#menu a.top-level { /* this class causes IE 5.01 and 5.5 to behave badly... */
	display:block;
	height:46px;
	text-indent:-9999px;
}

li#home a {background:transparent url("images/menu-home.gif") no-repeat 0 -46px;}
li#videoanddvdproduction a {background:transparent url("images/menu-video-and-dvd-production.gif") no-repeat 0 -46px;}
li#design a {background:transparent url("images/menu-design.gif") no-repeat 0 -46px;}
li#photography a {background:transparent url("images/menu-photography.gif") no-repeat 0 -46px;}
li#marketing a {background:transparent url("images/menu-marketing.gif") no-repeat 0 -46px;}
li#conversion a {background:transparent url("images/menu-conversion.gif") no-repeat 0 -46px;}
li#clients a {background:transparent url("images/menu-clients.gif") no-repeat 0 -46px;}
li#contactus a {background:transparent url("images/menu-contact-jam-media.gif") no-repeat 0 -46px;}


#menu li a:hover {background-position:0 0px;} /* hover */

p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	margin-left: 10px;
	
}

/* Background for text boxes */

.boxtop{
	/*make this the same size as the top image*/	
		display:block;
	width:397px;
	height:50px;
	/*set the image as a background*/	
		background-position:left top;
	background-repeat:no-repeat;
	background-image:url(images/top.gif);
	}	
	.topcontent{
	/*set the font style for the box title*/	
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:200;
	color:white;
	/*shift the title down a bit and center it*/	
		padding-top:15px;
		padding-left:20px;
	}	
	.boxbottom{	
		/*make this the same width as the bottom image*/	
		/*don’t set the height as this needs to be flexible*/	
		display:block;	
		width:397px;	
		/*set the image as a background*/	
		background-position:left bottom;	
		background-repeat:no-repeat;	
		background-image:url(images/bottom.gif);	
	}	
	.maincontent{	
		/*set the font style for the main content*/	
		color:white;	
		font-family:Verdana, Arial, Helvetica, sans-serif;	
		font-size:10pt;	
		display:block;	
		/*align the main content nicely*/	
		padding-top:0px;
		padding-left:10px;	
		padding-bottom:20px;	
		padding-right:30px;	
	}
	.maincontent p {
	margin-top : 0px; /* to remove p padding in Mozilla browsers */
	}
	.contentbox{
		padding-left:50px;
		}
		
/* CSS for two colum layout in main page content */

.twocolumnwrapper {
    width:100%;	}
	
.twocolumnleftcol {
    float:left;
    width:425px;
    }
.twocolumnrightcol {
	float:right;
	width:50%;
	padding: 0px;
    }

.twocolumnrightcol-home {
	float:right;
	width:475px;
	padding: 0px;
	}
.twocolumnrightcol-thumbs {
	float:right;
	width:540px;
	margin:0px;
	}
	
	#pagewrapper #pagecontent .twocolumnwrapper .twocolumnleftcol .contentbox .boxbottom .maincontent p {
	line-height: 1.4em;
}

/* Links CSS */

a:link, a:visited {
	color: #C2CE2C;
	text-decoration: none;
	
}

/* Thumbnail Graphics */
ul.thumbnails {
	margin: 0px;
	float:left;
	line-height:1em;
	list-style:none;
	}
	
ul.thumbnails li {
	display: inline;

	margin: 0px;
	}

	ul.thumbnails li img {
	margin:0;
	padding:2px;
	border:0;
	vertical-align: middle;
	}

/* Client Logos*/
ul.clients {
	margin: 0px;
	float:left;
	line-height:1em;
	list-style:none;
	}
	
ul.clients li {
	display: inline;

	margin: 0px;
	}

	ul.clients li img {
	margin:0;
	padding:10px;
	border:0;
	vertical-align: middle;
	}
	
ul.design li {
	display: inline;
	margin: 0px;
	}

ul.design li img {
	margin:0;
	padding:14px;
	vertical-align: middle;
	border:0;
	}
	
ul.design li img.nopadding {
	margin:0;
	padding:2px;
	vertical-align: middle;
	border:0;
	}

	

.centeredlist { /*required to center in Mozilla and Safari */
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	}

.bumpitdownabit {/*to move the design box on the front page down so its bottom aligns with the photography box */
	margin-top: 16px;
	}#pagewrapper #pagecontent h1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #36378A;
}