@charset "UTF-8";
/* CSS Document */
*{margin:0px; padding:0px;}
body{margin:0px; text-align:center; background-color:#FFF;}
a {text-decoration:none; color:#FFF;}
a:hover{ text-decoration:none; color:#0CC;}
#wrap{margin-left:auto; margin-right:auto; width:996px; height:693px; background:url(images/bg.jpg) no-repeat; overflow:hidden;}
#wrap1{margin-left:auto; margin-right:auto; width:991px; height:689px; overflow:hidden; text-align:center; padding-left:-5px;}
#swrap {position:relative; width:996px; height:693px; }

#menu{
	position:absolute;
	width:302px;
	height:77px;
	left: 193px;
	top: 62px;
	text-align:left;
}
#title{
	position:absolute;
	width:229px;
	height:46px;
	left: 105px;
	top: 170px;
}
#submenu{
	position:absolute;
	width:150px;
	left: 148px;
	top: 223px;
	height: 4px;
}
#content{
	position:absolute;
	width:600px;
	height:458px;
	left: 314px;
	top: 174px;
	text-align:justify;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:13px;
	color:#fff;
}
#content p{ margin:10px 0px 0px 0px;line-height:28px;letter-spacing:0.15em;}
#content ul {margin-left:15px;}
#content h1{background:url(images/workbit.png) no-repeat left;padding-left:25px;padding-top:5px; padding-bottom:3px;font-size:16px; margin-bottom:10px; border-bottom:#FFF dotted 1px;}



#work{float:left; height:245px; margin-bottom:3px;}
#work a img{border:#FFF solid 1px; padding:3px; background-color:#CCC;}
#work a:hover img{border:#0CC solid 1px;}

#workthumb{ float:left; text-align:left; text-align:left;}
#workthumb a img{border:#FFF solid 1px; margin-top:2px; float:left; margin-right:2px;}
#workthumb a:hover img{border:#0CC solid 1px;}

#worktitle{
	position:absolute;
	width:162px;
	height:30px;
	background:url(images/workbit.png) no-repeat left;
	padding-left:25px;
	padding-top:10px;
	font-size:16px;
	font-weight:bold;
	color:#FFF;
	left: 330px;
	top: 17px;
}
#up{
	position:absolute;
	width:27px;
	height:27px;
	left: 173px;
	top: 12px;
}
#down{
	position:absolute;
	width:27px;
	height:27px;
	left: 180px;
	top: 435px;
}
.news{float:left; width:200px; height:400px; }
.news ul li{list-style-type:circle; margin-left:30px; line-height:28px; font-size:13px; letter-spacing:0.1em; }

#newst1alpha{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/newstitle1.png');
	width:51px;
	height:32px;
	position:absolute;
	top:29px;
	z-index:5;
	right: 507px;
}
.newst1{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);background: url("images/newstitle1.png") left;width:51px;
height:32px;}
#newst2alpha{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/newstitle2.png');
	width:75px;
	height:33px;
	position:absolute;
	top:30px;
	z-index:5;
	right: 299px;
}
.newst2{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);background: url("images/newstitle2.png") left;width:75px;
height:33px;}
#newst3alpha{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/newstitle3.png');
	width:67px;
	height:32px;
	position:absolute;
	top:34px;
	z-index:5;
	right: 76px;
}
.newst3{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);background: url("images/newstitle3.png") left;width:67px;
height:32px;}




#drop1alpha{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/drop1.png');
	width:21px;
	height:22px;
	position:absolute;
	top:270px;
	z-index:5;
	right: 199px;
}
.drop1{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);background: url("images/drop1.png") left;width:21px;
height:19px;}

#drop2alpha{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/drop2.png');
	width:20px;
	height:25px;
	position:absolute;
	top:273px;
	z-index:5;
	right: 77px;
}
.drop2{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);background: url("images/drop2.png") left;width:20px;
height:25px;}
/* content bg */
#aboutbgalpha{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/newstitle3.png');
	width:470px;
	height:32px;
	position:absolute;
	top:368px;
	z-index:5;
	right: 10px;
}
.aboutbg{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);background: url("images/abouttocca.png") left;width:470px;
height:33px;}

#contactbgalpha{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/contact.png');
	width:424px;
	height:31px;
	position:absolute;
	top:287px;
	z-index:5;
	right: -1px;
}
.contactbg{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);background: url("images/contact.png") left;width:424px;
height:31px;}


#designerbgalpha{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/designer.png');
	width:298px;
	height:33px;
	position:absolute;
	top:591px;
	z-index:5;
	right: 110px;
}
.designerbg{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);background: url("images/designer.png") left;width:298px;
height:33px;}

#productbgalpha{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/productdesign.png');
	width:388px;
	height:33px;
	position:absolute;
	top:595px;
	z-index:5;
	right: 82px;
}
.productbg{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);background: url("images/productdesign.png") left;width:388px;
height:33px;}

#packagingbgalpha{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/packagingdesign.png');
	width:426px;
	height:27px;
	position:absolute;
	top:598px;
	z-index:5;
	right: 109px;
}
.packagingbg{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);background: url("images/packagingdesign.png") left;width:426px;
height:27px;}

#visualbgalpha{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/visualdesign.png');
	width:351px;
	height:26px;
	position:absolute;
	top:598px;
	z-index:5;
	right: 109px;
}
.visualbg{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);background: url("images/visualdesign.png") left;width:351px;
height:26px;}

#newsbgalpha{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/news.png');
	width:193px;
	height:30px;
	position:absolute;
	top:602px;
	z-index:5;
	right: 136px;
}
.newsbg{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);background: url("images/news.png") left;width:193px;
height:30px;}

#mapbgalpha{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/map.png');
	width:165px;
	height:37px;
	position:absolute;
	top:585px;
	z-index:5;
	right: 111px;
}
.mapbg{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);background: url("images/map.png") left;width:165px;
height:37px;}

/* content bg end */

.map a img{border:0px;}
.map a:hover img{border:0px;}

/* codda menu*/
#nav{
	position:absolute;
	font-size:10px;
	left: 465px;
	width: 134px;
	height: 17px;
	top: 4px;
	letter-spacing:0.6em;
	list-style-type:none;
}
#nav a{color:#FFF; text-decoration:none;}
#nav a:hover{color:#999; text-decoration:none;}
.csw {width: 500px; height: 400px;overflow:hidden}
		
		.stripViewer { /* This is the viewing window */
			position: relative;
			overflow: hidden; 
			width: 500px; /* Also specified in  .stripViewer .panelContainer .panel  below */
			height: 400px;
			clear: both;
		}
		
		.stripViewer .panelContainer { /* This is the big long container used to house your end-to-end divs. Width is calculated and specified by the JS  */
			position: relative;
			left: 0; top: 0;
			width: 500px;
			
			/* -moz-user-select: none; // This breaks CSS validation but stops accidental (and intentional - beware) panel highlighting in Firefox. Some people might find this useful, crazy fools. */
		}
		
		.stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */
			float:left;
			height: 400px;
			position: relative;
			width:500px; /* Also specified in  .stripViewer  above */
		}
		
		.stripViewer .panelContainer .panel .wrapper { /* Wrapper to give some padding in the panels, without messing with existing panel width */
		text-align:left;
		}
		.wrapper a img{ border:#FFF solid 1px; padding:4px; margin:3px;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=60);}
		.wrapper a:hover img {border:#0CC solid 1px;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); }
		.wrapper td{padding:2px;}
		.wrapper1 a img{ border:0px;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);}
		.wrapper1 a:hover img {border:0px;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); }
		.stripNav { /* This is the div to hold your nav (the UL generated at run time) */
			position:absolute;
			right:0px;
			top:0px;
		}
		
		.stripNav ul { /* The auto-generated set of links */
			float: left;list-style-type:none;
		}
		
		.stripNav ul li {
			float: left;list-style-type:none;
			margin-right: 2px; /* If you change this, be sure to adjust the initial value of navWidth in coda-slider.1.1.1.js */
		}
		
		.stripNav a { /* The nav links */
			font-size: 10px;
			font-weight: bold;
			text-align: left;
			line-height: 0px;
			text-decoration: none;
			display:inline;
			padding: 0 1px;
			color:#CCC9C3;
		}
		
		.stripNav li.tab1 a { background: none }
		.stripNav li.tab2 a { background: none }
		.stripNav li.tab3 a { background: none }
		.stripNav li.tab4 a { background: none }
		.stripNav li.tab5 a { background: none }
		
		.stripNav li a:hover {
			background: none;
		}
		
		.stripNav li a.current {
			background:none;
			color: none;
		}
		
		.stripNavL, .stripNavR { /* The left and right arrows */
			position: absolute;
			top: 230px;
			text-indent: -9000em;
		}
		
		.stripNavL a, .stripNavR a {
			display: block;
			height: 0px;
			width: 0px;
		}
		
		.stripNavL {
			left: 0;
		}
		
		.stripNavR {
			right: 0;
		}
		
		.stripNavL {
			background: url("images/arrow-left.gif") no-repeat center;
		}
		
		.stripNavR {
			background: url("images/arrow-right.gif") no-repeat center;
		}
/*codda menu end*/		



/*highslide*/
.highslide {
	cursor: url(highslide/graphics/zoomin.cur), pointer;
    outline: none;
}
.highslide-active-anchor img {
	visibility: hidden;
}
.highslide img {
	border: 2px solid gray;
}
.highslide:hover img {
	border: 2px solid white;
}

.highslide-wrapper {
	background: white;
}
.highslide-image {
    border: 2px solid white;
}
.highslide-image-blur {
}
.highslide-caption {
    display: none;
    
    border: 2px solid white;
    border-top: none;
    font-family: Verdana, Helvetica;
    font-size: 10pt;
    padding: 5px;
    background-color: white;
}
.highslide-loading {
    display: block;
	color: black;
	font-size: 8pt;
	font-family: sans-serif;
	font-weight: bold;
    text-decoration: none;
	padding: 2px;
	border: 1px solid black;
    background-color: white;
    
    padding-left: 22px;
    background-image: url(highslide/graphics/loader.white.gif);
    background-repeat: no-repeat;
    background-position: 3px 1px;
}
a.highslide-credits,
a.highslide-credits i {
    padding: 2px;
    color: silver;
    text-decoration: none;
	font-size: 10px;
}
a.highslide-credits:hover,
a.highslide-credits:hover i {
    color: white;
    background-color: gray;
}

.highslide-move {
    cursor: move;
}

.highslide-overlay {
	display: none;
}

a.highslide-full-expand {
	background: url(highslide/graphics/fullexpand.gif) no-repeat;
	display: block;
	margin: 0 10px 10px 0;
	width: 34px;
	height: 34px;
}


/* Controlbar example */
.controlbar {	
	background: url(highslide/graphics/controlbar4.gif);
	width: 167px;
	height: 34px;
}
.controlbar a {	
	display: block;
	float: left;
	/*margin: 0px 0 0 4px;*/	
	height: 27px;
}
.controlbar a:hover {
	background-image: url(highslide/graphics/controlbar4-hover.gif);
}
.controlbar .previous {
	width: 50px;
}
.controlbar .next {
	width: 40px;
	background-position: -50px 0;
}
.controlbar .highslide-move {
	width: 40px;
	background-position: -90px 0;
}
.controlbar .close {
	width: 36px;
	background-position: -130px 0;
}


/* Necessary for functionality */
.highslide-display-block {
    display: block;
}
.highslide-display-none {
    display: none;
}
/*highslide end*/