/*--------------------------------------------*/
/*-----------www.ashanjaydesigns.com----------*/

* {margin:0; padding:0; color:#50514e;
	font-family:arial;
}
img {border:medium none;}
em {display:none;}
ul {list-style-image:none;  list-style:none; font-family:Tahoma; font-size:12px; color:#6A5A4D;}


/*
-------------------------------------
FONT STYLES
-------------------------------------
*/
p {font-family: Arial; font-size:12px;}
#container a {text-decoration:none; color:#1a8ab6;}
	#container a:hover{text-decoration: none; color:#0e4a62;}
h2 {line-height:30px;font-family: Arial; font-size:36px; color:#2c93bd;font-weight:bold; padding-top:44px;}
h3 {font-family:Arial; font-size:16px;color:#50514e}
#content h4 {font-family:Arial; font-size:14px; color:#888274;padding-left:3px;}
#serv_RHS h4 {font-family: Arial; font-size:20px; color:#50514e;padding:0px 0px 8px 0px;}
#serv_LHS p{ font-size:12px; padding-bottom:10px;}
#serv_LHS h4 {font-family:Tahoma; font-size:18px; color:#50514e; padding:5px 0px 5px 0px;}
#container h5 {font-family: Tahoma; font-size:14px; }


/*
-------------------------------------
SITE STRUCTURE
-------------------------------------
*/
body {background: #093242 none repeat scroll 0 0; }
#container {
	margin:0 auto; 
	width: 1000px;
	text-align:left;
	padding-top:7px;
}
#wrapper {background: #f5edd3 url(images/header_bg.png) repeat-x scroll top center; 
		margin-top:22px;}
#wrapper_port {background: #f5edd3 url(images/background_port.png) repeat-x scroll top center; 
		margin-top:22px;}
#wrapper_noc {background: #f5edd3 url(images/background.jpg) repeat-x scroll top center; 
		margin-top:0px;}/*-- smaller height background w/o contact bar--*/
		
		
	#header { height: 60px;
		margin-bottom:20px;
	}
		.header_left {float:left;width:280px;}			
		.header_right {float:right; width:260px;}
			#header-links {margin-top:15px; width:279px;height:35px;}
			#header-links a {background: url(images/sitenavbg.jpg) ;}
					#header-links li {display:inline; margin:0;}
					#header-links li em {display:none;}
					ul#hlinks-but {display:inline; margin:0; bottom:0;}
						ul#hlinks-but a { margin-right: 10px;overflow:hidden;}
							li#home a {background-position: 0 0; height:29px; float:left;width:74px;}
							li#serv a {background-position: -74px 0; height:29px; float:left;width:85px;}
							li#port a {background-position: -159px 0; height:29px; float:left;width:90px;}
							li#contact a {background-position: -249px 0; height:29px; float:left;width:82px;}
								li#home a:hover {background-position: 0 -29px;}
								li#serv a:hover {background-position: -74px -29px;}
								li#port a:hover {background-position: -159px -29px;}
								li#contact a:hover {background-position: -249px -29px;}								
									a#home_focus {background-position:0 -58px !important;}
									a#serv_focus {background-position: -74px -58px !important;}
									a#port_focus {background-position:-159px -58px !important;}
									a#contact_focus {background-position:-249px -58px !important;}

/*-- Landing  page (INDEX)--*/
#content {
	padding-bottom:50px;
}	
#cont_in{
	width:1000px;
	overflow:hidden;
	background:url(images/cat_headerbg.png) top left no-repeat;
}
#con_20 td{
	vertical-align:top;
}
#cont_in_in{
	position:relative;
	top:0;
}
.cont_body{
	background:url(images/cat_headerbg.png) top left no-repeat;
	width:928px;
	height:270px;
	padding: 0 36px;
}
.cont_body_short{
	background:url(images/cat_smallbar.png) top left no-repeat;
	width:928px;
	height:45px;
	padding: 0 36px;
}
#bar3d{
	margin-top:10px;
}
#barPaint{
	height:68px;
}

#graphic, #brand{
	padding: 0 36px;
	margin-left:1000px;
	width:928px;
	position:relative;
	top:0;
}
.cont_sub_head{
	padding:10px 5px 0;
	height:45px;
}
.cont_sub_head_short{
	padding:4px 5px 0;
	height:35px;
}
p.cont_h1{
	color:#b2a47e;
	font-size:24px;
	letter-spacing:-1px;
	float:left;
	width:390px;
}

#content a.cont_a{
	color:#9c8e68;
	font-size:12px;
	float:right;
	width:235px;
	margin-top:9px;
	text-align:right;
	cursor:pointer;
}

/*-- go back and forward arrows--*/
#go_back, #go_back2, #go_back3, #go_back4, #go_back5{width:140px !important;}
#cont_in a.cont_a span.arrowA{
	background: url(images/home_7.png) no-repeat;
	height:11px;
	width:10px;
	position:relative;	
	margin:2px 0 0 5px;
}

#content #cont_in  span.forward{
	float:right;
	background-position:-471px 0;	
}
#content #cont_in a.cont_a:hover span.forward{
	background-position:-471px -11px;	
}

#content #cont_in  span.back{
	float:left;
	background-position:-481px 0 !important;	
}
#content #cont_in a.cont_a:hover span.back{
	background-position:-481px -11px !important;	
}
/*-- smaller (short) boxes row and boxes--*/
.shortrow{
	height:245px !important;
}
.shortrowIN{height:190px !important;}

/*--inside pages small box--*/

p.box_h1{
	padding:10px 0 0 5px;
	color:#666666;
	font-size:12px;
}
p.box_h2{
	padding:0 7px 0 5px;
	color:#b89c50;
	font-size:11px;
}
	p.box_h2 span{
		float:right;
		color:#c3b99d;
		font-weight:bold;
		letter-spacing:-1px;
	}

/*-- category boxes--*/
.cont_sub_body{
	height:216px;
}

/*-- web boxes on home page--*/
#cont_in_in a.wbox_in{
	background: url(images/portfolio/HP_7_web_M.jpg) top left no-repeat;
	height:196px;
	width:214px;	
	margin:10px 0 0 9px;
	display:block;
}
#cont_in_in a.wbg1, a.wbg1{background-position:0 0 !important;}
#cont_in_in a.wbg2, a.wbg2{background-position:-214px 0 !important;}
#cont_in_in a.wbg3, a.wbg3{background-position:-428px 0 !important;}
#cont_in_in a.wbg4, a.wbg4{background-position:-642px 0 !important;}

/*---- =============================================---*/
/*--- inside category pages from javascript--*/
.inside_cat_bholder{
	overflow:hidden;
	height:705px;
}
.insideC_bhIN{}
	/*-- bottom vertical nav guide--*/	
	.UDM_guider{
		background:url(images/cat_bot_gu.png) top center no-repeat;
		min-height:68px;
		padding-top:40px;
		text-align:center;
		width:928px;		
	}
	#gr_UDMG_next, #gr_UDMG_prev{cursor:pointer;}
/*--- ENDS: inside category pages from javascript--*/
/*-- smaller boxes--*/
	a.wboxx{
		display:block;
		height:173px;
		width:167px;
		margin:9px 0 0 9px;
	}
/*-- individual boxes common for all small boxes--*/
#cont_in_in a.wbgS1, a.wbgS1{background-position:0 0 !important;}
#cont_in_in a.wbgS2, a.wbgS2{background-position:-167px 0 !important;}
#cont_in_in a.wbgS3, a.wbgS3{background-position:-334px 0 !important;}
#cont_in_in a.wbgS4, a.wbgS4{background-position:-501px 0 !important;}
#cont_in_in a.wbgS5, a.wbgS5{background-position:-668px 0 !important;}
#cont_in_in a.wbgS6, a.wbgS6{background-position:0 -173px !important;}
#cont_in_in a.wbgS7, a.wbgS7{background-position:-167px -173px !important;}
#cont_in_in a.wbgS8, a.wbgS8{background-position:-334px -173px !important;}
#cont_in_in a.wbgS9, a.wbgS9{background-position:-501px -173px !important;}
#cont_in_in a.wbgS10, a.wbgS10{background-position:-668px -173px !important;}
#cont_in_in a.wbgS11, a.wbgS11{background-position:0 -346px !important;}
#cont_in_in a.wbgS12, a.wbgS12{background-position:-167px -346px !important;}
#cont_in_in a.wbgS13, a.wbgS13{background-position:-334px -346px !important;}
#cont_in_in a.wbgS14, a.wbgS14{background-position:-501px -346px !important;}
#cont_in_in a.wbgS15, a.wbgS15{background-position:-668px -346px !important;}

/*-- inside pages boxes--*/
#graphic a.wboxGRA1, #GRA_main a.wboxGRA1{
	background: url(images/portfolio/HP_7_gra_1.jpg) top left no-repeat;
}
#graphic a.wboxGRA2, #GRA_main a.wboxGRA2{
	background: url(images/portfolio/HP_7_gra_2.jpg) top left no-repeat;
}
#brand a.wboxBRA1, #BRA_main a.wboxBRA1{
	background: url(images/portfolio/HP_7_bra_1.jpg) top left no-repeat;
}								
	
/*==================================================================*/			
/*-- home page sprites--*/
#content .hpSprite, #foot .hpSprite{
	background: url(images/home_7.png) top left no-repeat;
}
#content .wb_short{
	background-position:0 0;
	height:190px;
	width:185px;
	float:left;
}
#content .work_box{
	background-position:-185px 0;
	height:216px;
	width:232px;
	float:left;
}
#content .wb_short2{
	background-position:0 0;
	height:235px;	
	float:left;
	width:185px;
}
	
/*==================================================================*/	
/*---- FOOTER ---*/	
#footer_top {
	background-color:#156b8e;
	height:290px;
}

#foot {margin: 0 auto; padding-top:0px; width:925px;text-align:left;}
	#foot_wrap {float:left; width:925px;}
			/*--- back to top icon----*/
			p#to_top {position: relative; height:0; width:60px; right: 0; top:-34px; float:right;}
				p#to_top a.hpSprite {cursor:pointer; 
					background-position:-417px 0; 
					display:block; 
					height:34px; 
					text-indent:-9999px; 
					width:54px;					
					}
				p#to_top a:hover {background-position: -417px -37px;}
		.sec1 {float:left; margin-top:25px; margin-right:24px; width:260px;}			
		.sec2 {float:left;margin-top:25px;margin-right:24px; width:310px;}			
		.sec3 {float:left;margin-top:25px; width:307px;}

#footer_foot{background-color:#093242;}
	#foot2{height:45px;margin:0 auto; padding-top:0px; width:925px;text-align:left;}
		#ft2_LHS2 {float: left; width: 340px; }	
		#ft2_RHS {width:460px;float:right; text-align:right;}		
.clearDeb {display:block;}	
	/*-- NEWS and Updates--*/
	#newsU td{
		padding-bottom:4px;
	}
	.foot_h1{color:#f6ecd1; font-size:20px;
		padding-bottom:5px;
	}
	 .foot_h2{color:#f6ecd1; font-size:12px;}
	 .foot_h2_a{color:#f6ecd1; font-size:12px;
		padding-bottom:4px;}
	 .foot_h3{color:#77cbee; font-size:12px;}
	 .foot_h4{color:#77cbee; font-size:10px;}
	 .foot_h6{color:#96c1d2; font-size:10px;
		padding-bottom:4px;
	}
	
	/*-- footer sec3 twitter javascript--*/
	#foot_wrap .rss-item{
		color:#f6ecd1;
		font-size:10px;
		margin-bottom:6px;
	}
	#foot_wrap .rss-item:hover{
		color:#ffffff;
	}
	#foot2 p {color:#4296b7; 
		float:left;
		font-family:Arial,Helvectica; 
		font-size:10px; 
		padding-top:13px;
		width:280px;
	}
	/* lower footer xhtml and logo*/
	#foot2 .footL{
		background:url(images/footerL.gif) top left no-repeat;
		float:left;
	}
	#foot2 .xhtml{
		width:99px;
		height:16px
	}
	#foot2.logoF{
		width:26px;
		height:24px;
	}
	
	
	.foot_h5{color:#f6ecd1; font-size:12px;}
	.foot_h5 span{color:#77cbee}
	
	#foot a {color:#e8c849; text-decoration:none;}
		#foot a:hover {color:#e89f49; text-decoration:none;}

	p#ft2_RHS2 {float:left; width:425px;}
		#foot2 a{color:#e8c849; text-decoration:none;}
		#foot2 a:hover{color:#e89f49; text-decoration:none;}

/*==================================================================*/

/*----- tool tips---*/
.tipsy { padding: 5px; font-size: 10px; font-family:arial;opacity: 0.8; filter: alpha(opacity=80); background-repeat: no-repeat; }
  .tipsy-inner { padding: 4px 5px; background-color: black; color: white; max-width: 200px; text-align: center; }
  .tipsy-north { background-image: url(images/tipsy-north.gif); background-position: top center; }
  .tipsy-south { background-image: url(images/tipsy-south.gif); background-position: bottom center; }
  .tipsy-east { background-image: url(images/tipsy-east.gif); background-position: right center; }
  .tipsy-west { background-image: url(images/tipsy-west.gif); background-position: left center; }
  
/*==================================================================*/	
 /*----- contact top bar-----*/
 /*--'contu_btn' class will open the contact top bar on anywhere--*/ 
 /*--- FONTS---*/
 #contact_top p{color:#67b6d9; font-size:14px;padding-top:5px;}
	#contact_btn {color:#f1e4ba;font-size:14px; cursor:pointer;}	
	#cff_left p {font-size:14px; color:#f1e4ba; line-height:20px;}
 /*---FONTS---*/
 
 a.contu_btn {cursor:pointer;}/*-- Click on anywhere will open contact form--*/
 #contact_f {background: #12607f url(images/contact_bar.png) repeat-x top left;position: fixed; top:0;z-index:10; width:100%;}
	#contact_wrap {margin:0 auto;width:925px;}
		#contact_top {height:29px; text-align:right;}
		#the_contact {height:300px;overflow:hidden;clear:both; position:relative; vertical-align:baseline;}
	#cff_left p.email {font-size:12px; padding-top:8px;}

/*--- inside drop down form--*/
#cff_inside {height:280; position:absolute; bottom:0;}
#cff_left {float:left; padding-right:50px; width:200px;}
#cff_right {float:left; font-family:arial; font-size:18px; width:675px;}
	.container {padding-bottom: 15px;}
	
	/*-- Labels and headings and errors--*/
	.label {height:25px;}
		.label p.field{color:#F3E9C6; font-size:18px; }	
			.label p.error {color:#e7ae2c; font-size:14px; padding: 4px 0 0 5px;
				font-style:italic;}
	.label p{float:left; }
		
		#cff_right input, #cff_right select, #cff_right textarea {
			background-color:#f3e9c6; border-style:none;
			padding:5px;
			font-size:18px; font-family:arial; width:325px;}
		
		#cff_right textarea { height:183px;}
	.subbmit_btn {text-align:right;}
		#cff_right button {border:none; padding:5px; cursor:pointer;
			color:#0e5676; font-size:18px; font-family:arial; margin-top:8px;}
		#cff_right button[type="reset"] {background-color:#227ca0; margin-right:4px;}
			#cff_right button[type="reset"]:hover {background-color:#3190b6;}
		#cff_right button[type="submit"] {background-color:#ffffff; }
			#cff_right button[type="submit"]:hover {background-color:#c0eafa;}
	.first, .second {float:left; width:325px;}
	.second {padding-left:20px; }
	
/*--- Message sent text---*/
p.msg_sent, p.msg_sent_sub {color:#f3e9c6;}
	p.msg_sent {font-size:24px;}
	p.msg_sent_sub {font-size:14px; padding-top:10px; width:500px;}


/*==================================================================*/		
/* ----------------------------------
		Picture Box Theme
	----------------------------------- */
	
	div.dark_square .pp_top,
	div.dark_square .pp_bottom .pp_left,
	div.dark_square .pp_bottom .pp_middle,
	div.dark_square .pp_bottom .pp_right,
	div.dark_square .pp_content { background: url(../images/prettyPhoto/contentPattern.png) top left repeat; }
	div.dark_square .currentTextHolder { color: #c4c4c4; }
	div.dark_square  p.pp_description { color: #fff; }
	div.dark_square .pp_loaderIcon { background: url(../images/prettyPhoto/loader.gif) center center no-repeat; } /* Loader icon */
	
	div.dark_square .pp_content a.pp_expand { background: url(../images/prettyPhoto/sprite.png) -31px -26px no-repeat; cursor: pointer; } /* Expand button */
	div.dark_square .pp_content a.pp_expand:hover { background: url(../images/prettyPhoto/sprite.png) -31px -47px no-repeat; cursor: pointer; } /* Expand button hover */
	div.dark_square .pp_content a.pp_contract { background: url(../images/prettyPhoto/sprite.png) 0 -26px no-repeat; cursor: pointer; } /* Contract button */
	div.dark_square .pp_content a.pp_contract:hover { background: url(../images/prettyPhoto/sprite.png) 0 -47px no-repeat; cursor: pointer; } /* Contract button hover */
	div.dark_square  a.pp_close { width: 75px; height: 22px; background: url(../images/prettyPhoto/sprite.png) -10px -5px no-repeat; cursor: pointer; } /* Close button */
	
	div.dark_square  .pp_details .pp_nav a.pp_arrow_previous { background: url(../images/prettyPhoto/sprite.png) -5px -75px no-repeat; } /* The previous arrow in the bottom nav */
		div.dark_square  .pp_details .pp_nav a.pp_arrow_previous.disabled { background-position: -5px -91px; cursor: default; }
	div.dark_square .pp_details .pp_nav a.pp_arrow_next { background: url(../images/prettyPhoto/sprite.png) -30px -75px no-repeat; } /* The next arrow in the bottom nav */
		div.dark_square .pp_details .pp_nav a.pp_arrow_next.disabled { background-position: -30px -91px; cursor: default; }
	
	div.dark_square .pp_content a.pp_next:hover { background: url(../images/prettyPhoto/btnNext.png) center right  no-repeat; cursor: pointer; right:-45px;position:relative;} /* Next button */
	div.dark_square .pp_content a.pp_previous:hover { background: url(../images/prettyPhoto/btnPrevious.png) center left no-repeat; cursor: pointer; left:-45px;position:relative;} /* Previous button */

/*---- Further css codes relating to the lightBox---*/
	div.pp_pic_holder a:focus { outline:none; }

	div.pp_overlay {
		background: #000;
		position: absolute; top: 0; left: 0;
		z-index: 9500;
		width: 100%;
	}
	
	div.pp_pic_holder {
		position: absolute; z-index: 10000;
		width: 100px;
	}
		
		div.pp_pic_holder .pp_top{
			position: relative;
			height: 10px;
		}
			* html div.pp_pic_holder .pp_top { padding: 0 20px; }
		
			div.pp_pic_holder .pp_top .pp_left {
				position: absolute;
				left: 0;
				width: 10px; height: 10px;
			}
			div.pp_pic_holder .pp_top .pp_middle {
				position: absolute;
				left: 20px; right: 20px;
				height: 10px;
			}
				* html div.pp_pic_holder .pp_top .pp_middle { position: static; left: 0; }
			
			div.pp_pic_holder .pp_top .pp_right {
				position: absolute;
				top: 0; left: auto; right: 0;
				width: 10px; height: 10px;
			}
		
		div.pp_pic_holder .pp_content {
			position: relative;
			text-align: left;
			width: 100%; height: 40px;
		}
		
			div.pp_pic_holder .pp_details {
				display: none;
				margin: 3px 0 2px 10px;
			}
				div.pp_pic_holder .pp_content .pp_details p.pp_description { display: none; float: left; margin: 0; }
				
				div.pp_pic_holder  .pp_details .pp_nav {
					float: left;
					margin: 3px 0 0 0;
				}
				
					div.pp_pic_holder  .pp_details .pp_nav p { float: left; margin: 2px 4px; }
				
					div.pp_pic_holder .pp_details .pp_nav a.pp_arrow_previous,
					div.pp_pic_holder  .pp_details .pp_nav a.pp_arrow_next {
						float: left;
						display: block;
						width: 14px; height: 15px;
						overflow: hidden;
						text-indent: -10000px;
						margin-top: 4px;
					}
		
		div.pp_pic_holder .pp_content div.pp_hoverContainer {
			position: absolute; z-index: 2000;
			top: 0; left: 0;
			width: 100%;
		}
		
		div.pp_pic_holder .pp_content a.pp_next {
			display: block; float: right;
			text-indent: -10000px;
			width: 49%; height: 100%;
			background: url(../images/prettyPhoto/btnNext.png) 10000px 10000px no-repeat;
		}
			
		div.pp_pic_holder .pp_content a.pp_previous {
			display: block; float: left;
			text-indent: -10000px;
			width: 49%; height: 100%;
			background: url(../images/prettyPhoto/btnPrevious.png) 10000px 10000px no-repeat;
		}
		
		div.pp_pic_holder .pp_content a.pp_expand,
		div.pp_pic_holder .pp_content a.pp_contract {
			position: absolute; z-index: 20000;
			top: 10px; right: 30px;
			cursor: pointer;
			display: none;
			text-indent: -10000px;
			width: 20px; height: 20px;	
		}
			
		div.pp_pic_holder  a.pp_close {
			float: right;
			display: block;
			text-indent: -10000px;
		}
		
		div.pp_pic_holder .pp_bottom {
			position: relative;
			height: 20px;
		}
			* html div.pp_pic_holder .pp_bottom { padding: 0 20px; }
			
			div.pp_pic_holder .pp_bottom .pp_left {
				position: absolute;
				left: 0;
				width: 20px; height: 20px;
			}
			div.pp_pic_holder .pp_bottom .pp_middle {
				position: absolute;
				left: 20px; right: 20px;
				height: 20px;
			}
				* html div.pp_pic_holder .pp_bottom .pp_middle { position: static; left: 0; }
				
			div.pp_pic_holder .pp_bottom .pp_right {
				position: absolute;
				top: 0; left: auto; right: 0;
				width: 20px; height: 20px;
			}
		
		div.pp_pic_holder .pp_loaderIcon {
			display: none;
			position: absolute;
			top: 50%; left: 50%;
			margin: -12px 0 0 -12px;
			width: 24px; height: 24px;
		}
		
		div.pp_pic_holder #pp_full_res { display: block; margin: 0 auto; width: 100%; text-align: center; }
		div.pp_pic_holder #pp_full_res object,
		div.pp_pic_holder #pp_full_res embed { visibility: hidden; }
	
		div.ppt {
			display: none;
			position: absolute;
			top: 0; left: 0;
			z-index: 9999;
			color: #fff;
			font-size: 17px;
		}

/*--- Misc.----*/

	.clearfix:after {
	    content: "."; 
	    display: block; 
	    height: 0; 
	    clear: both; 
	    visibility: hidden;
	}

	.clearfix {display: inline-block;}

	/* Hides from IE-mac \*/
	* html .clearfix {height: 1%;}
	.clearfix {display: block;}
	/* End hide from IE-mac */