/* --- This wrapper goes around all the sliding divs -----------*/

#content { 
	width:603px;
	height:603px;
	margin:0 13px;
	float:left;
	background:url(../img/white-transparency-50.png) repeat 0 0; }
	
#text { 
	width:594px;
	height:594px;
	padding:4px !important;
	background:url(../img/white-transparency-50.png) repeat 0 0; }

#aboutContent {
	padding:20px 28px 0px 28px;
	height:575px;
	background-color:#FFF;
}


/* --- Navigation block -----------*/

#navigation {
	width:132px;
	padding:7px 0 0 0;
	float:left;
	background:#fff; }

/* ---------------------------------------------
HOME SECTION STYLES
-----------------------------------------------*/

/* --- Standard column override styles  -----------*/

#home .home_blog {
	position:relative; /* So we can position the RSS icon absolutely within the div */
	float:left;
	width:360px;
	margin:12px 37px 0 0;
	color:#999;
}

#home .home_work {
	float:left;
	width:267px;
	margin:12px 22px 0 0;
	color:#999;
}

#home .home_labs {
	float:left;
	width:74px;
	margin-top:0;
	color:#999;
}

#home .home_labs h3 { 
	padding:12px 0 15px 0;
	margin:0;
	color:#000;
	/*
	background:url(/images/template/icon_labs.gif) top left no-repeat;
	*/
}

#home .home_blog h3 {
	margin-bottom:10px;
}

#home .home_work h3, #home .home_labs h3 {
	margin-bottom:0;
}

#home dl.latest dt {
	color:#333;
  	font-size: 1.45em;
	font-weight:bold;
	margin:3px 0 5px 0;
	width:370px;
	overflow:hidden;
}

/* --- Comments  -----------*/

#home dl.latest dt a {
	float:left;
	margin-right:10px;
}

#home dl.latest dt em {
	color:#000;
  	font-size: 0.55em;
	font-weight:normal;
	background:url(../img/comments_back.gif);
	width:10px;
	height:13px;
	margin-top:3px;
	display:block;
	font-style:normal;
	padding:1px 0 0 4px;
	float:left;
	line-height:9px;
}

#home dl.latest dd {
	margin:0 0 10px 0;
	line-height:1.6em;
}

#home ul.selected li, #home ul.labs li {
	float:left;
	position:relative;
	width:74px;
	height:74px;
	margin:15px 15px 0 0;
	z-index:100;
}

#home ul.labs li {
	margin:15px 0 0 0;
}

#home ul.labs li.top { /* Remove the top margin off the top labs project image */
	margin:0;
}


#home ul.selected li a, #home ul.labs li a{
	display:block;
	width:74px;
	height:74px;
}

#home ul.selected li div,
div#rss_link div{
	position:absolute;
	left:50%;
	top:-20px;
	display:block;
	white-space:nowrap;
	z-index:1000;
	overflow:visible;
	text-align:center;
}

div#rss_link div{
	left:253px;
	top:-28px;
}

#home ul.selected li div span,
div#rss_link div span{
	display:block;
	padding:6px;
	border:solid 1px #FFF000;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	background:#000;
	color:#000;
	font-weight:bold;
	font-size:14px;
	overflow:visible;
}
#home ul.selected li div img,
div#rss_link div img{
	display:block;
	margin:-1px auto 0;
}

/* ---------------------------------------------
ABOUT 
-----------------------------------------------*/

#about_alex {
	background:url(/images/template/alex.jpg) bottom left no-repeat;
}

#about_dave {
	background:url(/images/template/dave.jpg) bottom left no-repeat;
}

#about_alex .one_col,
#about_dave .one_col {
	float:right;
}

#about_dave h4,
#about_alex h4 {
	color:#000;
	margin:0 0 10px 0;
}

#about_dave .one_col ul.next_prev,
#about_alex .one_col ul.next_prev {
	border-top:1px dotted #666;
	width:190px;
	overflow:hidden;
	position:absolute;
	top:543px;
}

/* ---------------------------------------------
WORK SECTION STYLES
 -----------------------------------------------*/
 
#work .two_col h2.strike {
 background:url(/images/template/strikethrough.gif) 128px 9px no-repeat;
}
 
#work .one_col, #work .two_col  {
	margin-top:40px;
}

#work .recog {
	padding-left:20px;
	width:170px;
}
 
#work .one_col ul {
	margin-top:0;
}
 
.worksection #work .one_col ul.recognition li {
	border-bottom:none;
	margin:10px 5px 0 0;
}

#work_a, #work_b, #work_c, #work_d, #work_e, #work_f, #work_g, #work_h, #work_i, #work_j {
	background:url(/images/template/portfolio_back.jpg) 0 82px no-repeat;
}

.worksection .three_col {
	position:relative;
}

.worksection .one_col {
	position:relative;
}


/* --- Position each screen 'object' e.g beer glass, burger etc. -----------*/

.worksection .three_col {
	height:520px;
}

#work_a .three_col {
	background:url(/images/portfolio/atr/back.jpg) 0 282px no-repeat;
}

#work_b .three_col {
	background:url(/images/portfolio/propaganda/back.jpg) 0 282px no-repeat;
}

/* --- Position the portfolio images in the right place over the screen -----------*/

.worksection .three_col ul.sequence {
	margin:47px 0 0 89px;
	background:url(/images/ajax-loader.gif) 50% 50% no-repeat;
	width:378px;
	height:235px;
}

.worksection .three_col ul.sequence li.loading{
	display:none;
}

/* --- Style the right hand column description list -----------*/

.worksection .one_col ul {
	margin:17px 0 20px 0;
}

.worksection .one_col ul li {
	border-bottom:1px dotted #666;
	padding:5px 0;
	color:#000;
}

.worksection .one_col ul li strong {
	color:#FFF000;
	font-weight:normal;
}


/* --- Style the next and previous links -----------*/

.one_col ul.next_prev {
	border-top:1px dotted #666;
	width:190px;
	top:440px;
	position:absolute;
}

.one_col ul.next_prev li {
	border-bottom:none;
	float:left;
	padding:5px 0;
}

.one_col ul.next_prev li.prev {
	width:95px;
}

.one_col ul.next_prev li.prev a{
	padding-left:8px;
	background:url(/images/template/bullet_left.gif) center left no-repeat;
}

.one_col ul.next_prev li.next {
	width:95px;
	text-align:right;
}

 .one_col ul.next_prev li.next a{
	padding-right:8px;
	background:url(/images/template/bullet_right.gif) center right no-repeat;
}





/* ---------------------------------------------
NAV.CSS
-----------------------------------------------*/

#navigation ul.primary {
	display:none; }

#navigation a { 
	text-decoration:underline;
	color:#999; } 

#navigation a:hover { 
	text-decoration:none; } 

#navigation ul li a {
	display:block;
	width:132px;
	height:23px; }

#navigation ul li ul {
	display:none; }


#navigation ul li ul li a {
	color:#000;
	text-decoration:none; }

#navigation ul li ul li a:hover {
	text-decoration:underline; }

#navigation ul li a.scrolling {
	color:#fff000;
	text-decoration:underline; }

#navigation ul li{ display:inline; }

#navigation ul li a span{ display:none; }


#navigation ul li a strong{
	color:#fff000;
	font-weight:normal; }

#navigation ul.primary li a {
	background-image:url(../img/nav.gif); }
	
	#navigation ul.primary li.products ul.subnav li a {
	display:block;
	width:132px;
	height:17px;
	margin:0 0 4px 0;
	background-image:url(../img/sub-nav.gif); }
/* --- I added the 6 lines below this -----------*/
	#navigation ul.primary li.products ul.subnav1 li a {
	display:block;
	width:132px;
	height:17px;
	margin:0 0 4px 0;
	background-image:url(../img/sub-nav1.gif); }

#navigation ul li.home a {
	background-position:0 0;
	color:#000; }

#navigation ul li.home a:hover {
	background-position:-132px 0; }
	
#navigation ul li.home a.scrolling {
	background-position:-264px 0; }


#navigation ul li.home-off a {
	background-position:0 0; }

#navigation ul li.home-off a:hover, #navigation ul li.home-off a.scrolling {
	background-position:-132px 0; }
	

#navigation ul li.home-off ul li a, #navigation ul li.home-off ul li a:hover, #navigation ul li.home-off ul li a.scrolling {
	background:none; }


#navigation ul li.products a {
	background-position:0 -23px; }

#navigation ul li.products a:hover {
	background-position:-132px -23px; }
	
#navigation ul li.products a.scrolling {
	background-position:-264px -23px; }

#navigation ul li.products ul li a, #navigation ul li.products ul li a:hover, #navigation ul li.products ul li a.scrolling {
	background:none; }

#navigation ul li.stores a {
	background-position:0 -44px; }

#navigation ul li.stores a:hover {
	background-position:-132px -44px; }
	
#navigation ul li.stores a.scrolling {
	background-position:-264px -44px; }

#navigation ul li.stores ul li a, #navigation ul li.stores ul li a:hover, #navigation ul li.stores ul li a.scrolling {
	background:none; }

#navigation ul li.order a {
	background-position:0 -65px; }

#navigation ul li.order a:hover {
	background-position:-132px -65px; }
	
 #navigation ul li.order a.scrolling {
	background-position:-264px -65px; }

#navigation ul li.order ul li a, #navigation ul li.order ul li a:hover, #navigation ul li.order ul li a.scrolling {
	background:none; }

#navigation ul li.contact a {
	background-position:0 -86px; }

#navigation ul li.contact a:hover {
	background-position:-132px -86px; }
	
#navigation ul li.contact a.scrolling {
	background-position:-264px -86px; }

#navigation ul li.contact ul li a, #navigation ul li.contact ul li a:hover, #navigation ul li.contact ul li a.scrolling {
	background:none; }
	
#navigation ul.subnav li.moon a {
	background-position:0 0; }

#navigation ul.subnav li.moon a:hover {
	background-position:-132px 0; }
	
#navigation ul.subnav li.moon a.scrolling {
	background-position:-264px 0; }

#navigation ul.subnav li.moon ul li a, #navigation ul.subnav li.moon ul li a:hover, #navigation ul.subnav li.moon ul li a.scrolling {
	background:none; }
	
#navigation ul.subnav li.tides a {
	background-position:0 -21px; }

#navigation ul.subnav li.tides a:hover {
	background-position:-132px -21px; }
	
#navigation ul.subnav li.tides a.scrolling {
	background-position:-264px -21px; }

#navigation ul.subnav li.tides ul li a, #navigation ul.subnav li.tides ul li a:hover, #navigation ul.subnav li.tides ul li a.scrolling {
	background:none; }
	
#navigation ul.subnav li.south a {
	background-position:0 -42px; }

#navigation ul.subnav li.south a:hover {
	background-position:-132px -42px; }
	
#navigation ul.subnav li.south a.scrolling {
	background-position:-264px -42px; }

#navigation ul.subnav li.south ul li a, #navigation ul.subnav li.south ul li a:hover, #navigation ul.subnav li.south ul li a.scrolling {
	background:none; }
	
#navigation ul.subnav li.days a {
	background-position:0 -63px; }

#navigation ul.subnav li.days a:hover {
	background-position:-132px -63px; }
	
#navigation ul.subnav li.days a.scrolling {
	background-position:-264px -63px; }

#navigation ul.subnav li.days ul li a, #navigation ul.subnav li.days ul li a:hover, #navigation ul.subnav li.days ul li a.scrolling {
	background:none; }
	
#navigation ul.subnav li.family a {
	background-position:0 -84px; }

#navigation ul.subnav li.family a:hover {
	background-position:-132px -84px; }
	
#navigation ul.subnav li.family a.scrolling {
	background-position:-264px -84px; }

#navigation ul.subnav li.family ul li a, #navigation ul.subnav li.family ul li a:hover, #navigation ul.subnav li.family ul li a.scrolling {
	background:none; }
	
#navigation ul.subnav li.year a {
	background-position:0 -105px; }

#navigation ul.subnav li.year a:hover {
	background-position:-132px -105px; }
	
 #navigation ul.subnav li.year a.scrolling {
	background-position:-264px -105px; }

#navigation ul.subnav li.year ul li a, #navigation ul.subnav li.year ul li a:hover, #navigation ul.subnav li.year ul li a.scrolling {
	background:none; }
	
#navigation ul.subnav li.cape a {
	background-position:0 -126px; }

#navigation ul.subnav li.cape a:hover {
	background-position:-132px -126px; }
	
#navigation ul.subnav li.cape a.scrolling {
	background-position:-264px -126px; }

#navigation ul.subnav li.cape ul li a, #navigation ul.subnav li.cape ul li a:hover, #navigation ul.subnav li.cape ul li a.scrolling {
	background:none; }
	
#navigation ul.subnav li.note-pads a {
	background-position:0 -147px; }

#navigation ul.subnav li.note-pads a:hover {
	background-position:-132px -147px; }
	
#navigation ul.subnav li.note-pads a.scrolling {
	background-position:-264px -147px; }

#navigation ul.subnav li.note-pads ul li a, #navigation ul.subnav li.note-pads ul li a:hover, #navigation ul.subnav li.note-pads ul li a.scrolling {
	background:none; }
	
#navigation ul.subnav li.limpopo a {
	background-position:0 -168px; }

#navigation ul.subnav li.limpopo a:hover {
	background-position:-132px -168px; }
	
#navigation ul.subnav li.limpopo a.scrolling {
	background-position:-264px -168px; }

#navigation ul.subnav li.limpopo ul li a, #navigation ul.subnav li.limpopo ul li a:hover, #navigation ul.subnav li.limpopo ul li a.scrolling {
	background:none; }
	
#navigation ul.subnav li.magnets a {
	background-position:0 -189px; }

#navigation ul.subnav li.magnets a:hover {
	background-position:-132px -189px; }
	
#navigation ul.subnav li.magnets a.scrolling {
	background-position:-264px -189px; }

#navigation ul.subnav li.magnets ul li a, #navigation ul.subnav li.magnets ul li a:hover, #navigation ul.subnav li.magnets ul li a.scrolling {
	background:none; }
	
#navigation ul.subnav li.stickers a {
	background-position:0 -210px; }

#navigation ul.subnav li.stickers a:hover {
	background-position:-132px -210px; }
	
#navigation ul.subnav li.stickers a.scrolling {
	background-position:-264px -210px; }

#navigation ul.subnav li.stickers ul li a, #navigation ul.subnav li.stickers ul li a:hover, #navigation ul.subnav li.stickers ul li a.scrolling {
	background:none; }
	
#navigation ul.subnav1 li.langa a {
	background-position:0 0; }

#navigation ul.subnav1 li.langa a:hover {
	background-position:-132px 0; }
	
#navigation ul.subnav1 li.langa a.scrolling {
	background-position:-264px 0; }

#navigation ul.subnav1 li.langa ul li a, #navigation ul.subnav1 li.langa ul li a:hover, #navigation ul.subnav1 li.langa ul li a.scrolling {
	background:none; }
	
#navigation ul.subnav1 li.phillipi a {
	background-position:0 -21px; }

#navigation ul.subnav1 li.phillipi a:hover {
	background-position:-132px -21px; }
	
#navigation ul.subnav1 li.phillipi a.scrolling {
	background-position:-264px -21px; }

#navigation ul.subnav1 li.phillipi ul li a, #navigation ul.subnav1 li.phillipi ul li a:hover, #navigation ul.subnav1 li.phillipi ul li a.scrolling {
	background:none; }
	
#navigation ul.subnav1 li.greenpoint a {
	background-position:0 -42px; }

#navigation ul.subnav1 li.greenpoint a:hover {
	background-position:-132px -42px; }
	
#navigation ul.subnav1 li.greenpoint a.scrolling {
	background-position:-264px -42px; }

#navigation ul.subnav1 li.greenpoint ul li a, #navigation ul.subnav1 li.greenpoint ul li a:hover, #navigation ul.subnav1 li.greenpoint ul li a.scrolling {
	background:none; }
	
#navigation ul.subnav1 li.arabella a {
	background-position:0 -63px; }

#navigation ul.subnav1 li.arabella a:hover {
	background-position:-132px -63px; }
	
#navigation ul.subnav1 li.arabella a.scrolling {
	background-position:-264px -63px; }

#navigation ul.subnav1 li.arabella ul li a, #navigation ul.subnav1 li.arabella ul li a:hover, #navigation ul.subnav1 li.arabella ul li a.scrolling {
	background:none; }
	
#navigation ul.subnav1 li.fynbos a {
	background-position:0 -84px; }

#navigation ul.subnav1 li.fynbos a:hover {
	background-position:-132px -84px; }
	
#navigation ul.subnav1 li.fynbos a.scrolling {
	background-position:-264px -84px; }

#navigation ul.subnav1 li.fynbos ul li a, #navigation ul.subnav1 li.fynbos ul li a:hover, #navigation ul.subnav1 li.fynbos ul li a.scrolling {
	background:none; }
	
#navigation ul.subnav1 li.round a {
	background-position:0 -105px; }

#navigation ul.subnav1 li.round a:hover {
	background-position:-132px -105px; }
	
 #navigation ul.subnav1 li.round a.scrolling {
	background-position:-264px -105px; }

#navigation ul.subnav1 li.round ul li a, #navigation ul.subnav1 li.round ul li a:hover, #navigation ul.subnav1 li.round ul li a.scrolling {
	background:none; }
	
#navigation ul.subnav1 li.various a {
	background-position:0 -126px; }

#navigation ul.subnav1 li.various a:hover {
	background-position:-132px -126px; }
	
#navigation ul.subnav1 li.various a.scrolling {
	background-position:-264px -126px; }

#navigation ul.subnav1 li.various ul li a, #navigation ul.subnav1 li.various ul li a:hover, #navigation ul.subnav1 li.various ul li a.scrolling {
	background:none; }
	
#navigation ul.subnav1 li.more a {
	background-position:0 -147px; }

#navigation ul.subnav1 li.more a:hover {
	background-position:-132px -147px; }
	
#navigation ul.subnav1 li.more a.scrolling {
	background-position:-264px -147px; }

#navigation ul.subnav1 li.more ul li a, #navigation ul.subnav1 li.more ul li a:hover, #navigation ul.subnav1 li.more ul li a.scrolling {
	background:none; }
	


.error404 {
	width:445px;
	margin:170px auto;
}