/* This css file serves as a template for styling your kwicks.  Feel free to modify, but please make note of the comments - some of them are important. */


.nav-container {  
  position: absolute;
	z-index: 1;
	right: 4%;
	bottom: 80%;


}
.kwicks {
	/* recommended styles for kwicks ul container */
	list-style: none;
	position: relative;
	margin: 0;
	padding: 0;
	}
.kwicks li{
	/* these are required, but the values are up to you (must be pixel) */
	width: 122px;
	height: 68px;

	/*do not change these */
	display: block;
	overflow: hidden;
	padding: 0;  /* if you need padding, do so with an inner div (or implement your own box-model hack) */
}
.kwicks.horizontal li {
	/* This is optional and will be disregarded by the script.  However, it should be provided for non-JS enabled browsers. */
	margin-right: 5px; /*Set to same as spacing option. */	
	float: left;
}
.kwicks.vertical  li{
	/* This is optional and will be disregarded by the script.  However, it should be provided for non-JS enabled browsers. */
	margin-bottom: 5px; /*Set to same as spacing option. */	
}

#kwick_1 { 
	background:url(../images/nav-opc1.jpg) no-repeat; cursor:pointer;
	}
	#kwick_1 span {display:none;}
	#kwick_1 a {display:block; width:220px;height:68px;}
	
#kwick_2 {
	background:url(../images/nav-opc2.jpg) no-repeat; cursor:pointer;
	}
	#kwick_2 span {display:none;}
	#kwick_2 a {display:block; width:220px;height:68px;}
	
#kwick_3 {
	background:url(../images/nav-opc3.jpg) no-repeat; cursor:pointer;
	}
	#kwick_3 span {display:none;}
	#kwick_3 a {display:block; width:220px;height:68px;}

#kwick_4 { 
	background:url(../images/nav-opc4.jpg) no-repeat; cursor:pointer;
	}
	#kwick_4 span {display:none;}
	#kwick_4 a {display:block; width:220px;height:68px;}
	
#kwick_5 { 
	background:url(../images/nav-opc5.jpg) no-repeat; cursor:pointer;
	}
	#kwick_5 span {display:none;}
	#kwick_5 a {display:block; width:220px;height:68px;}

.kwicks.horizontal #kwick_5 {
	margin-right: 0; /* cancel margin on last kiwck (if you set a margin above) */
}
.kwicks.vertical #kwick_5 {
	margin-bottom: 0; /* cancel margin on last kiwck (if you set a margin above) */
}


/* ------ navigation framework ------------------------------------------------- */
#nav { 
	background:url(../images/nav.jpg) no-repeat; 
	width:640px; 
	height:68px; 
	margin:0;
	padding:0; 
	float:left;
	}
	#nav span { display: none; }
	#nav li, #nav a { height:68px; display:block; } 
	#nav li { float:left; list-style:none; display:inline; }
	#nav-01 { width: 132px;}
	#nav-02 { width: 131px;}
	#nav-03 { width: 130px;}
	#nav-04 { width: 130px;}
	#nav-05 { width: 81px;}
	#nav-01 a:hover { background:url(../images/nav.jpg)  -0px -68px no-repeat; }
		body#square #nav-01 a:hover { background:url(../images/nav.jpg)  -0px -136px no-repeat; }
	#nav-02 a:hover { background:url(../images/nav.jpg) -132px -68px no-repeat; }
		body#can-do-that #nav-02 a:hover { background:url(../images/nav.jpg) -132px -136px no-repeat; }
	#nav-03 a:hover { background:url(../images/nav.jpg) -263px -68px no-repeat; }
		body#results  #nav-03 a:hover { background:url(../images/nav.jpg) -263px -136px no-repeat; }
	#nav-04 a:hover { background:url(../images/nav.jpg) -393px -68px no-repeat; }
		body#random-acts #nav-04 a:hover { background:url(../images/nav.jpg) -393px -136px no-repeat; }
	#nav-05 a:hover { background:url(../images/nav.jpg) -523px -68px no-repeat; }
		body#contact  #nav-05 a:hover { background:url(../images/nav.jpg) -523px -136px no-repeat; }
	#nav-01 a:hover { background:url(../images/nav.jpg)  -0px -68px no-repeat; }
	#nav-02 a:hover { background:url(../images/nav.jpg) -132px -68px no-repeat; }
	#nav-03 a:hover { background:url(../images/nav.jpg) -263px -68px no-repeat; }
	#nav-04 a:hover { background:url(../images/nav.jpg) -393px -68px no-repeat; }
	#nav-05 a:hover { background:url(../images/nav.jpg) -523px -68px no-repeat; }
	body#square #nav-01 { background:url(../images/nav.jpg)  -0px -136px no-repeat; }
	body#can-do-that #nav-02 { background:url(../images/nav.jpg) -132px -136px no-repeat; }
	body#results  #nav-03 { background:url(../images/nav.jpg) -263px -136px no-repeat; }
	body#random-acts #nav-04 { background:url(../images/nav.jpg) -393px -136px no-repeat; }
	body#contact  #nav-05 { background:url(../images/nav.jpg) -523px -136px no-repeat; }