/* CSS Document */

BODY{
	background-color:#51565a;
	background-image:url(../images/background.jpg);
	background-repeat:no-repeat;
	color:#CCCCCC;
	font-family:"Arial Narrow", Verdana, Arial, Helvetica, sans-serif;
	font-size:13px;
	text-align: center;
	margin-top:3px;
	background-position: center top;
}


.descrip{
	background-image:url(../images/descrip.png);
	color:#CCCCCC;
	padding:10px;
	text-align: left;
	width:210px;
	vertical-align:top;
	line-height:1.2em;
	background-repeat: no-repeat;
	background-position: 0px 2px;
}

.descrip a{
color:#000000;
text-decoration:none;
}

.descrip ul {
	padding-left:15px!important;
	margin:0px!important;
}	

.wider {
	width:690px!important;
	background-repeat:repeat!important;
}
.descrip  a:hover {
color:#FFFFFF;
text-decoration:none;
}


/* IMAGES GALLERY CSS BELOW */
.pikachoose ul{ padding-left:0;width:740px;margin:0;overflow:hidden;}
.pikachoose ul li{float: right;border:1px solid #666;padding:0;margin:0 6px 4px 5px; position:relative;overflow:hidden; margin-right:0;}
.pikachoose ul li div img{position:relative;cursor:pointer;}

/* this is the surroundner for all your elements. This is also the fake border around the main img and room for caption */
.pika_main{width:740px;height:452px;display:block;position:relative; overflow:hidden;}
/*sine we give it the fake border, you need to position the image a little. */
.pika_main_img{
position:absolute;
top:0px;
left:2px;
}
.pika_back_img{position:relative;top:0px;}
.pika_subdiv{position:relative;border:1px solid #555;padding-left:2px;}
.pika_subdiv img, .pika_subdiv a img{border:none;}
.pika_caption{width:740px;height:16px;padding-top:4px;text-align:center;position:absolute;bottom:7px;left:3px;background:url('black.png') top left;}
.pika_caption a{color:white;}

.pika_play{position:absolute;z-index:1;left:50%;margin-left:-25px;width:50px;top:5px;}
.pika_play a{position:relative;margin-left:auto;cursor:pointer;display: block;width:50px;height:50px;background:url('play.png') top center no-repeat;}
.pika_play a{position:relative;margin-left:auto;cursor:pointer;display: block;width:50px;height:50px;background:url('pause.png') top center no-repeat;}

.pika_navigation a{font-size: 12px; text-decoration: none;}
.pika_navigation a:hover{text-decoration: underline;}
.pika_navigation{visibility:hidden;}

/* if you want to 'hide' these jus make their height and width 1px */
.pika_prev_hover{position:absolute;top:5px;left:5px;height:1px;width:1px;background:url('rewind.png') top left no-repeat;}
.pika_next_hover{position:absolute;top:5px;right:5px;height:1px;width:1px;background:url('fastf.png') top right no-repeat;}
#pikame{
margin-top:4px;
margin-left:-210px;
width:950px;
}


/* IMAGES ON contact PAGE CSS */
.homepikachoose ul{ padding-left:0; width:950px; margin:0;overflow:hidden;}
.homepikachoose ul li{float: right;border:1px solid #666;padding:0;margin:0 6px 4px 5px; position:relative;overflow:hidden; margin-right:0;}
.homepikachoose ul li div img{position:relative;cursor:pointer;}

/* this is the surroundner for all your elements. This is also the fake border around the main img and room for caption */
.homepika_main{width:950px;height:400px;display:block;position:relative; overflow:hidden;}
/*sine we give it the fake border, you need to position the image a little. */
.homepika_main_img{position:absolute;top:0px;left:2px;}
.homepika_back_img{position:relative;top:0px;}
.homepika_subdiv{position:relative;border:1px solid #555;padding-left:2px;}
.homepika_subdiv img, .pika_subdiv a img{border:none;}
.homepika_caption{width:950px;height:16px;padding-top:4px;text-align:center;position:absolute;bottom:7px;left:3px;background:url('black.png') top left;}
.homepika_caption a{color:white;}

.homepika_play{position:absolute;z-index:1;left:50%;margin-left:-25px;width:50px;top:5px;}
.homepika_play a{position:relative;margin-left:auto;cursor:pointer;display: block;width:50px;height:50px;background:url('play.png') top center no-repeat;}
.homepika_play a{position:relative;margin-left:auto;cursor:pointer;display: block;width:50px;height:50px;background:url('pause.png') top center no-repeat;}

.homepika_navigation a{font-size: 12px; text-decoration: none;}
.homepika_navigation a:hover{text-decoration: underline;}
.homepika_navigation{visibility:hidden;}

/* if you want to 'hide' these jus make their height and width 1px */
.pika_prev_hover{position:absolute;top:5px;left:5px;height:1px;width:1px;background:url('rewind.png') top left no-repeat;}
.pika_next_hover{position:absolute;top:5px;right:5px;height:1px;width:1px;background:url('fastf.png') top right no-repeat;}
#homepikame{margin-top:10px; height:0px; visibility:hidden;}


#imageContainer {
	position:relative;
	margin:auto;
	width:950px;
	height: 400px;
	overflow:hidden;
	margin-bottom:10px;
}

#imageContainer img {
	display:none;
	position:absolute;
	top:0; left:0;
}




.logo{
margin-top:5px;
float:right;
position:absolute;
z-index:999;
}

/*
for IE 7, thanks
*/
*:first-child+html body .logo{
margin-top:0;
float:right;
position:absolute;
z-index:999;
}

.footer{
font-size:9px;
padding:2px;
margin:0;
color:#999999;
text-align:center;
}

.footer a{
	color:#999999;
	text-decoration: none;
}

.footer a:hover{
	color:#999999;
	text-decoration:underline;
}

.navImgRight{
padding-left:20px;
}

.nav{
border-bottom:#e06c07;
border-bottom-style:solid;
border-bottom-width:2px;
height:20px;
}


.subnav {
		margin-left:-40px;
		margin-top:-4px;
		margin-bottom:0px;
		height:20px;
}

.subnav ul li{
			position: relative;
			color:#CCCCCC;
			display:block;
			float:left;
			padding-right:20px;
			font-size:12px;
}


.subnav ul li a {
			color:#CCCCCC;
			text-decoration:none;
}


.subnav ul li a:hover {
			color:#FFFFFF;
			text-decoration:none;
}


/* SCROLLER */

.simply-scroll-container { /* Container DIV - automatically generated */
	position: relative;
}

	.simply-scroll-clip { /* Clip DIV - automatically generated */
		position: relative;
		overflow: hidden;
		z-index: 2;
	}

	.simply-scroll-list { /* UL/OL/DIV - the element that simplyScroll is inited on */
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		overflow: hidden;
		margin: 0;
		padding: 0;
		list-style: none;
	}
	
		.simply-scroll-list li {
			padding: 0;
			margin: 0;
			list-style: none;
		}
	
		.simply-scroll-list li img {
			border: none;
			display: block;
		}
	
	.simply-scroll-btn {
		position: absolute;
		background-image: url(buttons.png);
		width: 42px;
		height: 44px;
		z-index:3;
		cursor: pointer;
	}
	
	.simply-scroll-btn-left {
		left: 6px;
		bottom: 6px;
		background-position: 0 -44px;
	}
	.simply-scroll-btn-left.disabled {
		background-position: 0 0 !important;
	}
	.simply-scroll-btn-left:hover {
		background-position: 0 -88px;
	}
	
	.simply-scroll-btn-right {
		right: 6px;
		bottom: 6px;
		background-position: 84px -44px;
	}
	.simply-scroll-btn-right.disabled {
		background-position: 84px 0 !important;
	}
	.simply-scroll-btn-right:hover {
		background-position: 84px -88px;
	}
	
	.simply-scroll-btn-up {
		right: 6px;
		top: 6px;
		background-position: -126px -44px;
	}
	.simply-scroll-btn-up.disabled {
		background-position: -126px 0 !important;
	}
	.simply-scroll-btn-up:hover {
		background-position: -126px -88px;
	}
	
	.simply-scroll-btn-down {
		right: 6px;
		bottom: 6px;
		background-position: -42px -44px;
	}
	.simply-scroll-btn-down.disabled {
		background-position: -42px 0 !important;
	}
	.simply-scroll-btn-down:hover {
		background-position: -42px -88px;
	}

/* Custom class modifications - override classees

.simply-scroll is default

*/

.simply-scroll { /* Customisable base class for style override DIV */
	width: 950px;
	height: 54px;
	margin-bottom: 1em;
	margin-top:5px;
}

	.simply-scroll .simply-scroll-clip {
		width: 950px;
		height: 54px;
	}
	
		.simply-scroll .simply-scroll-list {}
		
		.simply-scroll .simply-scroll-list li {
			float: left;
	/*		width: 180px;
	*/		height: 54px;
		}
		.simply-scroll .simply-scroll-list li img {}
	
	.simply-scroll .simply-scroll-btn {}
	
	.simply-scroll .simply-scroll-btn-left {}
	.simply-scroll .simply-scroll-btn-left.disabled {}
	.simply-scroll .simply-scroll-btn-left:hover {}
	
	.simply-scroll .simply-scroll-btn-right {}
	.simply-scroll .simply-scroll-btn-right.disabled {}
	.simply-scroll .simply-scroll-btn-right:hover {}
	
	.simply-scroll .simply-scroll-btn-up {}
	.simply-scroll .simply-scroll-btn-up.disabled {}
	.simply-scroll .simply-scroll-btn-up:hover {}
	
	.simply-scroll .simply-scroll-btn-down {}
	.simply-scroll .simply-scroll-btn-down.disabled {}
	.simply-scroll .simply-scroll-btn-down:hover {}
	


/* Vertical scroller example */

.vert { /* wider than clip to position buttons to side */
	width: 340px;
	height: 400px;
	margin-bottom: 1.5em;
}

	.vert .simply-scroll-clip {
		width: 290px;
		height: 400px;
	}
	
		.vert .simply-scroll-list {}
		
		.vert .simply-scroll-list li {
			width: 290px;
			height: 200px;
		}
		.vert .simply-scroll-list li img {}
	
	.vert .simply-scroll-btn {}

	.vert .simply-scroll-btn-up { /* modified btn pos */
		right: 0;
		top: 0;
	}
	.vert .simply-scroll-btn-up.disabled {}
	.vert .simply-scroll-btn-up:hover {}
	
	.vert .simply-scroll-btn-down { /* modified btn pos */
		right: 0;
		top: 52px;
	}
	.vert .simply-scroll-btn-down.disabled {}
	.vert .simply-scroll-btn-down:hover {}
	
	/* NOTE left-right classes wouldn't be needed on vertical scroller */
	
/* Flickr example 

Images created from a data source use simpler format i.e.

<div>
	<img/>
	<img/>
	...
</div>

*/

.flickr {
	width: 576px;
	height: 180px;
	margin-bottom: 1.5em;
}

	.flickr .simply-scroll-clip {
		width: 576px;
		height: 180px;
	}
		
		.flickr .simply-scroll-list img {
			float: left;
			border: none;
			display: block;
		}



/* menu styles */
#jsddm
{	margin: 0;
	padding: 0
	
	}

	#jsddm li
	{	float: left;
		list-style: none;
		}

	#jsddm li a
	{
	display: block;
	color: #CCCCCC;
	white-space: nowrap;
	text-decoration:none;
	padding-top: 5px;
	padding-right: 24px;
	padding-bottom: 5px;
	padding-left: 0px;
		}
		

	#jsddm li a:hover
	{
	}
	
#jsddm li ul {
	margin-top: 5px;
	margin-left:0px;
	padding: 0;
			text-align:left;
			position: absolute;
			visibility: hidden;
			background-image:url(../images/orange.png);
			width:112px;
			z-index:999;
			color:#333333;
			top:23px;
}	

#jsddm li ul.interiordropdown {
	width:121px;
}			
	
/*
for IE 7, thanks
*/
*:first-child+html body #jsddm li ul
		{	margin-top: 8px;
		margin-left:0px;
			padding: 0;
			text-align:left;
			position: absolute;
			visibility: hidden;
			background-image:url(../images/orange.png);
			width:200px;
			z-index:999;
			color:#333333;
			}			
			

				
			#jsddm li ul li
			{	float: none;
				display: inline}
			
			#jsddm li ul li a
			{	width: auto;
			padding-top:10px;
			padding-left:5px;
			padding-right:3px;
			padding-bottom:10px;
	color:#333333;
	/* background-image:url(../images/orange.png); */
			
}

			#jsddm li ul li a:hover;
			{	width: auto;
	color:#CCCCCC;
	background-image:url(../images/orange.png);
			
}