@charset "UTF-8";
/* CSS Document */

* {
	margin: 0;
	padding: 0;
}

html {
	height:100%;
}

body {
	margin:0px auto;
	padding:0px;
	text-align:center;
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 11px;
	color: #71b1d1;
	background-color:#FFF;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	text-decoration: none;
	height:100%;
}

#Container {
	width:919px;
	height:685px;
	text-align:center;
	position:absolute;
	top:50%;
	left:50%;
	margin-left:-459px;
	margin-top:-342px;
}

#Logo {
	width: 919px;
	height:85px;
	text-align: left;
	background-image:url(../images/logo.jpg);
	background-repeat:no-repeat;
	float:left;
}

#MainContentHome {
	border: 3px solid;
	border-collapse:collapse;
	border-color:#71b1d1;
	margin:0px auto;
	padding:7px;
	width:750px;
	height:605px;
	float:left;
}

#MainContentAbout {
	border: 3px solid;
	border-collapse:collapse;
	border-color:#8dcbec;
	margin:0px auto;
	padding:7px;
	width:750px;
	height:605px;
	float:left;
	background-image:url(../images/hs-bg.gif);
	background-repeat:no-repeat;
	background-position:right;
}

#MainContentCommercial {
	border: 3px solid;
	border-collapse:collapse;
	border-color:#bbd13b;
	margin:0px auto;
	padding:7px;
	width:750px;
	height:605px;
	float:left;
}

#MainContentFashion {
	border: 3px solid;
	border-collapse:collapse;
	border-color:#96c03e;
	margin:0px auto;
	padding:7px;
	width:750px;
	height:605px;
	float:left;
}

#MainContentFood {
	border: 3px solid;
	border-collapse:collapse;
	border-color:#aab949;
	margin:0px auto;
	padding:7px;
	width:750px;
	height:605px;
	float:left;
}

#MainContentHotels {
	border: 3px solid;
	border-collapse:collapse;
	border-color:#ab9d48;
	margin:0px auto;
	padding:7px;
	width:750px;
	height:605px;
	float:left;
}

#MainContentIndustrial {
	border: 3px solid;
	border-collapse:collapse;
	border-color:#adab46;
	margin:0px auto;
	padding:7px;
	width:750px;
	height:605px;
	float:left;
}

#MainContentJewellery {
	border: 3px solid;
	border-collapse:collapse;
	border-color:#c9c43e;
	margin:0px auto;
	padding:7px;
	width:750px;
	height:605px;
	float:left;
}

#AboutImage {
	border:0px;
	background-image:url(../images/about-image.jpg);
	background-repeat:no-repeat;
	width:375px;
	height:604px;
	margin: 0px auto;
	float: left;
}

#AboutContent {
	border: 0px;
	width:365px;
	text-align:justify;
	height: 448px;
	margin-top:112px;
	float: right;
}

#NavHeader {
	position:relative;
	width: 149px;
	height: 358px;
	float:right;
	text-align:right;
	margin-top:267px;
	padding:0px;
}

#nav {
    width: 149px; height: 358px;
    background:url(../images/nav-sprite.jpg);
    margin: 0px auto; padding: 0;
    position: relative;
}

#nav li {
    margin: 0; padding: 0; list-style: none;
    position: absolute; top: 267;
}

#nav li, #nav a {
    height: 22px; width: 149px; display: block; 
}

#nav-home {top: 0; height: 22px; width: 149px;}
 
#nav-about {top: 22px; height: 22px; width: 149px;}

#nav-commercial {top: 226px; height: 22px; width: 149px;}

#nav-fashion {top: 248px; height: 22px; width: 149px;}

#nav-food {top: 270px; height: 22px; width: 149px;}

#nav-hotels {top: 292px; height: 22px; width: 149px;}

#nav-industrial {top: 314px; height: 22px; width: 149px;}

#nav-jewellery {top: 336px; height: 22px; width: 149px;}


#nav-home a:hover {
    background: transparent url(../images/nav-sprite.jpg)
    -149px 0px no-repeat;}

#nav-about a:hover {
    background: transparent url(../images/nav-sprite.jpg)
    -149px -22px no-repeat;}

#nav-commercial a:hover {
    background: transparent url(../images/nav-sprite.jpg)
    -149px -226px no-repeat;}

#nav-fashion a:hover {
    background: transparent url(../images/nav-sprite.jpg)
    -149px -248px no-repeat;}
	
#nav-food a:hover {
    background: transparent url(../images/nav-sprite.jpg)
    -149px -270px no-repeat;}
	
#nav-hotels a:hover {
    background: transparent url(../images/nav-sprite.jpg)
    -149px -292px no-repeat;}
	
#nav-industrial a:hover {
    background: transparent url(../images/nav-sprite.jpg)
    -149px -314px no-repeat;}
	
#nav-jewellery a:hover {
    background: transparent url(../images/nav-sprite.jpg)
    -149px -336px no-repeat;}


#nav-home a:active {
    background: transparent url(../images/nav-sprite.jpg)
    -149px 0px no-repeat;}

#nav-about a:active {
    background: transparent url(../images/nav-sprite.jpg)
    -149px -22px no-repeat;}

#nav-commercial a:active {
    background: transparent url(../images/nav-sprite.jpg)
    -149px -226px no-repeat;}

#nav-fashion a:active {
    background: transparent url(../images/nav-sprite.jpg)
    -149px -248px no-repeat;}
	
#nav-food a:active {
    background: transparent url(../images/nav-sprite.jpg)
    -149px -270px no-repeat;}
	
#nav-hotels a:active {
    background: transparent url(../images/nav-sprite.jpg)
    -149px -292px no-repeat;}
	
#nav-industrial a:active {
    background: transparent url(../images/nav-sprite.jpg)
    -149px -314px no-repeat;}
	
#nav-jewellery a:active {
    background: transparent url(../images/nav-sprite.jpg)
    -149px -336px no-repeat;}
	
	
#nav-home_active {
	top: 0; height: 22px; width: 149px;
    background: transparent url(../images/nav-sprite.jpg)
    -149px 0px no-repeat;}

#nav-about_active {
	top: 22px; height: 22px; width: 149px;
    background: transparent url(../images/nav-sprite.jpg)
    -149px -22px no-repeat;}

#nav-commercial_active {
	top: 226px; height: 22px; width: 149px;
    background: transparent url(../images/nav-sprite.jpg)
    -149px -226px no-repeat;}

#nav-fashion_active {
	top: 248px; height: 22px; width: 149px;
    background: transparent url(../images/nav-sprite.jpg)
    -149px -248px no-repeat;}
	
#nav-food_active {
	top: 270px; height: 22px; width: 149px;
    background: transparent url(../images/nav-sprite.jpg)
    -149px -270px no-repeat;}
	
#nav-hotels_active {
	top: 292px; height: 22px; width: 149px;
    background: transparent url(../images/nav-sprite.jpg)
    -149px -292px no-repeat;}
	
#nav-industrial_active {
	top: 314px; height: 22px; width: 149px;
    background: transparent url(../images/nav-sprite.jpg)
    -149px -314px no-repeat;}
	
#nav-jewellery_active {
	top: 336px; height: 22px; width: 149px;
    background: transparent url(../images/nav-sprite.jpg)
    -149px -336px no-repeat;}
	
#Contact {
	width: 360px;
	height: 17px;
	float:right;
	background-color:#8dcbec;
	font-family:Tahoma, Geneva, sans-serif;
	color:#FFFFFF;
	text-align:right;
	padding-top: 3px;
	padding-right:5px;
	margin-top:24px;
}

#Contact a:link, a:visited, a:active {
	font-family:Tahoma, Geneva, sans-serif;
	color:#FFFFFF;
	text-align:right;
	padding-top:3px;
	padding-right:5px;
	text-decoration:none;
}

#Contact a:hover, a:visited:hover, a:active:hover {
	font-family:Tahoma, Geneva, sans-serif;
	color:#FFFFFF;
	text-align:right;
	padding-top:3px;
	padding-right:5px;
	text-decoration:none;
	font-style:italic;
}

/* ----------------------------- start Content Div Scroll ----------------------------- */

#ContentScroll {
	width: 355px;
	height: 403px;
	overflow: auto;
	/* IE overflow fix, position must be relative or absolute*/
	position: relative;
	margin-right: 0px;
	margin-left: 10px;
	margin-top: 59px;
	margin-bottom: 20px;
	padding-right: 10px;
	padding-left: 0px;
	padding-bottom: 0px;
	padding-top: 0px;
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 11px;
	color: #71b1d1;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	float:right;
}

.scrollgeneric {
line-height: 1px;
font-size: 1px;
position: absolute;
top: 0; left: 0;
}

.vscrollerbase {
width:10px;
}
.vscrollerbar {
background-image: url(../images/scrollbar.png);
background-repeat:repeat;
width: 10px;
/* following is the bit that allows us fixed height scrollbars */
height: 70px !important;
/* for fixed height, we force the vscrollerbar class with an !important decleration, and fleXcroll follows suit.*/

background-image: url(../images/scrollbar.png);
/* unfortunately, due to limitations of CSS, we cannot provide a color for the background when we are
using alpha images, thay have to be transparent.*/
}

/* do not forget to give horizontal scrollbars some color properties even if you don't plan on using them */
.hscrollerbase {height: 17px;}
.hscrollerbar {height: 17px; background-color:#333}

.vscrollerbar, .hscrollerbar {
/* paddings of these elements will decide how far the scrollbar will stop in both ends, and are not actually
used for styling, and are set to 0 by the script, here we will set them the size of our faux arrows */
padding: 0px;
z-index: 2;
}

/* ----------------------------- end Content Div Scroll ----------------------------- */