@charset "utf-8";



/* CSS Document */











/*-----------------------font--------------------------*/



h1, h2, h3, h4, h5 {



	font-family: Helvetica, Arial, Verdana, sans-serif;



	font-weight: normal;



	margin: 0;



	padding: 0;



}







.textcontent {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #000000;
	text-decoration: none;
	line-height: 15px;
}










.textcontent2 {

	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #000000;
	text-decoration: none;
	margin:0;
	line-height:18px;
}



.contact-text {

	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #000000;
	text-decoration: none;
	margin:0px;
	padding:0px 0px 3px 0px;}

/*-----------------------------------------------------*/


* { 

	padding: 0;

	margin: 0;


}



/*-----------------------------------------------------*/




body {


	background: url(images/container-bg.jpg) repeat-x #000000;

	text-align: center;


}


#bgholder {


	height: 1000px;

	width: 100%;

	background: url(images/bgtop.jpg) no-repeat center top;


}


#topbox {

	width: 873px;
	height: 105px;
	position: relative;

}


#topleft {
	margin: 0;
	padding: 0;
	width: 293px;
	height:53px;
	top: 29px;
	
	position: relative;
	float: left;
}

#topright {
	margin: 0;
	padding: 0;
	height: 105px;
	float: right;}


#menu {

	height: 52px;
	width: 873px;
	position: relative;
	top: -7px;
}



#cbox {


	width: 887px;

	height: 245px;

	position: relative;

	top: 27px;
}

#conthold {

	width:937px;
	height: 245px;
	position: relative;
	top: 39px;
	left: 25px;
}



#main-content {
background:#FFFFFF;
	width: 887px;
	height: 245px;
	position: relative;
	background:url(images/main-content.png) no-repeat;
	text-align: left;
	float: left;

}











#reflection {







	width: 887px;



	



	height: 245px;



	



	position: relative;



	



	top: 49px;







}







#reflection2 {







	width: 887px;



	



	height: 245px;



	



	position: relative;



	



	top: 26px;







}



#index-leftbox {
	width: 429px;
	height:213px;
	text-align: left;
	position: relative;
	float: left;
	left:7px;
	
	background:url(images/recent-pack.jpg) no-repeat;
	
}


#index-rightbox {
	width: 429px;
	height:213px;
	text-align: right;
	position: relative;
	float: right;
	right:7px;
	background:url(images/recent-brand.jpg) no-repeat top left;
	
}


#slider {
	width: 395px;
	height:113px;
	text-align:center;
	position: relative;
	left:16px;
	top:50px;
	right:20px;
	
}


#index-left {
	width: 306px;
	height: 245px;
	text-align: left;
	position: relative;
	float: left;
}


#index-left img {
	position: relative;
	left: 41px;
	top: 15px;
}




#index-text {







	width: 542px;



	



	height: 186px;



	



	text-align: left;



	



	position: relative;



	



	top: 27px;



	



	left: -47px;



	



	float: right;



	



}












#tab-index {







	width: 50px;



	



	height: 239px;



	



	position: relative;



	



	float: right;



	



	left: -7px;







}



#inside-content-bg {

	width: 887px;

	height: 503px;

	background: url(images/insidebg-contact.jpg) no-repeat;

	position: relative;

	top: 27px;

}







#inside-content {







	width: 887px;



	



	height: 503px;



	



	background: url(images/insidebg.jpg) no-repeat;







	position: relative;



	



	top: 27px;



	



}











#consultancy-left {







	width: 304px;



	



	height: 496px;



	



	position: relative;



	



	float: left;







}











#consultancy-middle {
	width: 540px;
	position: relative;
	top: 36px;
	float: left;
	text-align: left;
}

#printing-middle {
	width: 540px;
	position: relative;
	top: 36px;
	float: left;
	text-align: left;
}





#consultancy-right {







	width: 540px;



	



	position: relative;



	



	text-align: left;



	



	top: 36px;



	



	float: right;



	



	left: -42px;







}











#branding-left {







	width: 443px;



	



	height: 496px;



	



	position: relative;



	



	float: left;







}















#branding-right {







	width: 398px;



	



	position: relative;



	



	text-align: left;



	



	top: 36px;



	



	float: right;



	



	left: -42px;







}











#websites-holder {
	width:930px;
	height: 503px;
	background: url(images/insidebg.jpg) no-repeat;
	position: relative;
	top: 27px;
	left: 21px;
	background-image: url(images/insidebg.jpg);
}

#websites-testimonial {
	width:930px;
	height: 503px;
	background: url(images/insidetestimonial.jpg) no-repeat;
	position: relative;
	top: 27px;
	left: 21px;
}

#packaging-printing{
	width:930px;
	height: 503px;
	background: url(images/insideprinting.jpg) no-repeat;
	position: relative;
	top: 27px;
	left: 21px;
}



#websites-holder-bg {







	width:930px;



	



	height: 503px;



	



	background: url(images/insidebg-contact.jpg) no-repeat;







	position: relative;



	



	top: 27px;



	



	left: 21px;







}



#websites-holder2 {







	width:930px;



	



	height: 503px;



	



	background: url(images/insidebg-contact.jpg) no-repeat;







	position: relative;



	



	top: 27px;



	



	left: 21px;







}





#websites-left {







	width: 443px;



	



	height: 496px;



	



	position: relative;



	



	float: left;







}











#websites-middle {







	width: 404px;



	



	position: relative;



	



	top: 39px;



	



	float: left;



	



	text-align: left;







}











#websites-folio {







	width: 700px;



	



	height: 450px;



	



	position: relative;



	



	top: 23px;



	



	left: 94px;



	



	float: left;



	



	text-align: left;







}











#websites-right {







	width: 50px;



	



	height: 496px;



	



	position: relative;



	



	float: right;







}











#print-left {







	width: 443px;



	



	height: 496px;



	



	position: relative;



	



	float: left;







}











#print-middle {







	width: 404px;



	



	position: relative;



	



	top: 39px;



	



	float: left;



	



	text-align: left;







}











#print-right {

	width: 50px;

	height: 496px;

	position: relative;

	float: right;

}











#contact-holder {







	width:930px;



	



	height: 503px;



	



	background: url(images/insidebg-contact.jpg) no-repeat;







	position: relative;



	



	top: 27px;



	



	left: 21px;







}











#estimate-left {







	width: 349px;



	



	height: 451px;



	



	position: relative;



	



	float: left;



	



	padding: 45px 0 0 60px;;



	



	text-align: left;







}











#estimate-middle {







	width: 404px;



	



	position: relative;



	



	top: 39px;



	



	float: left;



	



	text-align: left;







}











#estimate-right {

	width: 50px;

	height: 496px;

	position: relative;

	float: right;

}


#contact-details {


	width: 184px;

	position: relative;

	float: left;
}




#contact-details2 {

	width: 278px;

	position: relative;

	float: left;
	padding: 0 0 0 30px;
}







#contact-details3 {
	width: 270px;
	position: relative;
	float: right;
	padding: 0 0 0 0px;

}











#contact-left {







	width: 765px;



	



	height: 451px;



	



	position: relative;



	



	float: left;



	



	padding: 45px 0 0 60px;;



	



	text-align: left;







}











#contact-middle {







	width: 150px;



	



	position: relative;



	



	top: 39px;



	



	float: left;



	



	text-align: left;

}





#news-left {







	width: 765px;



	



	height: 451px;



	



	position: relative;



	



	float: left;



	



	padding: 45px 0 0 60px;;



	



	text-align: left;







}





#news-form {







	width: 315px;



	



	position: relative;



	



	float: left;



	



}





#news-vertical {







	width: 41px;



	



	position: relative;



	



	float: left;



	top: -15px;



}





#news-announcement {







	width: 400px;



	



	position: relative;



	



	float: right;





}





.tint {

	font-family: Arial, Helvetica, sans-serif;

	font-size: 14px;

	color: #666;

	text-decoration: none;

	line-height: 18px;

}

#tabs{
	height:35px;
	left: 15px;
	top: -12px;
	position: relative;
}




/*---------------------------------------------------*/


#printbtn1{
	height:41px;
	width: 178px;
	float: left;
}

a#rollover1{ 
	background:url(images/printtab.png) no-repeat; 
	height:41px; 
	width:178px; 
	display:block; 
}

a#rollover1 span{ 
	display:none; 
}

a#rollover1:hover{ 
	background: url(images/printtab-over.png) no-repeat;
}





#printbtn2{
	position: relative;
	left: 2px;
	height:41px;
	width: 178px;
	float: left;
}

a#rollover2{ 
	background:url(images/printtab2.png) no-repeat; 
	height:41px; 
	width:178px; 
	display:block; 
}

a#rollover2 span{ 
	display:none; 
}

a#rollover2:hover{ 
	background: url(images/printtab-over2.png) no-repeat;
}



#printbtn3{
	position: relative;
	left: 4px;
	height:41px;
	width: 178px;
	float: left;
}

a#rollover3{ 
	background:url(images/printtab3.png) no-repeat; 
	height:41px; 
	width:178px; 
	display:block; 
}

a#rollover3 span{ 
	display:none; 
}

a#rollover3:hover{ 
	background: url(images/printtab-over3.png) no-repeat;
}



#printbtn4{
	position: relative;
	left: 6px;
	height:41px;
	width: 178px;
	float: left;
}

a#rollover4{ 
	background:url(images/printtab4.png) no-repeat; 
	height:41px; 
	width:178px; 
	display:block; 
}

a#rollover4 span{ 
	display:none; 
}

a#rollover4:hover{ 
	background: url(images/printtab-over4.png) no-repeat;
}


/*---------------------development slider------------------------------*/


#developmentbtn1{
	height:41px;
	width: 178px;
	float: left;
}

a#developmentrollover1{ 
	background:url(images/developmenttab.png) no-repeat; 
	height:41px; 
	width:178px; 
	display:block; 
}

a#developmentrollover1 span{ 
	display:none; 
}

a#developmentrollover1:hover{ 
	background: url(images/development-over.png) no-repeat;
}





#developmentbtn2{
	position: relative;
	left: 2px;
	height:41px;
	width: 178px;
	float: left;
}

a#developmentrollover2{ 
	background:url(images/developmenttab2.png) no-repeat; 
	height:41px; 
	width:178px; 
	display:block; 
}

a#developmentrollover2 span{ 
	display:none; 
}

a#developmentrollover2:hover{ 
	background: url(images/development-over2.png) no-repeat;
}



#developmentbtn3{
	position: relative;
	left: 4px;
	height:41px;
	width: 178px;
	float: left;
}

a#developmentrollover3{ 
	background:url(images/developmenttab3.png) no-repeat; 
	height:41px; 
	width:178px; 
	display:block; 
}

a#developmentrollover3 span{ 
	display:none; 
}

a#developmentrollover3:hover{ 
	background: url(images/development-over3.png) no-repeat;
}



#developmentbtn4{
	position: relative;
	left: 6px;
	height:41px;
	width: 178px;
	float: left;
}

a#developmentrollover4{ 
	background:url(images/developmenttab4.png) no-repeat; 
	height:41px; 
	width:178px; 
	display:block; 
}

a#developmentrollover4 span{ 
	display:none; 
}

a#developmentrollover4:hover{ 
	background: url(images/development-over4.png) no-repeat;
}


/*----------------------------------*/



#carousel_inner {
float:left; /* important for inline positioning */
width:315px; /* important (this width = width of list item(including margin) 
 items shown */ 
overflow: hidden;  /* important (hide the items outside the div) */
/* non-important styling bellow */
}
 
#carousel_ul {
position:relative;
left:-230px; /* important (this should be negative number of list items width(including margin) */
list-style-type: none; /* removing the default styling for unordered list items */
margin: 0px;
padding: 0px;
width:6999px; /* important */
/* non-important styling bellow */
padding-bottom:10px;
}
 
#carousel_ul li{
float: left; /* important for inline positioning of the list items */                                    
width:105px;  /* fixed width, important */
/* just styling bellow*/
padding:0px;
height:113px;

margin-top:10px;
margin-bottom:10px; 
 
}
 
#carousel_ul li img {
margin-bottom:-4px; /* IE is making a 4px gap bellow an image inside of an anchor (<a href...>) so this is to fix that*/
/* styling */
cursor:pointer;
cursor: hand; 
border:0px; 
}
#left_scroll, #right_scroll{
float:left; 
height:113px; 
width:25px;
padding:5px 3px 0px 10px;


}
#left_scroll img, #right_scroll img{
/*styling*/
cursor: pointer;
cursor: hand;
}

/*slider*/