/* WebguruIndia.com CSS Document {} */

body {

	padding:0px; margin:0px; 
	font:11px Tahoma, Arial, Helvetica, sans-serif; color:#474747;
	background:url(../images/top-bg.gif) repeat-x ;

}

div, p, ul, h2, h3, h4, h5, img, p {padding:0px; margin:0px;}



ul{list-style-type:none}


h1{font:20px/20px "Trebuchet MS", Arial, Helvetica, sans-serif; background:inherit; color: #909090; background:inherit;}

h2{font:20px/20px "Trebuchet MS", Arial, Helvetica, sans-serif; background:inherit; color: #909090; background:inherit;}

h3 {font:bold 11px Verdana, Arial, Helvetica, sans-serif; color: #2d9bda; margin:0; height:20px;}


h1 .orange {color:#eb5612;}
h1 .blue {color:#2d9bda;}

h2 .orange {color:#eb5612;}
h2 .blue {color:#2d9bda;}



p {font:12px normal Verdana, Arial, Helvetica, sans-serif; color: #474747;}



/*text color*/

.gray {color: #b3b3b3;}

.orange {color: #eb5612;}



.hrline {background: #dddddd; height:1px; border:0px;}



.spacer {

	clear: both; font-size: 0px; line-height: 0px;

}



/*-----------------+ wrapper +-----------------*/

#Warpper  {width: auto; background:url(../images/shadow-bg.gif) repeat-y center top;}



/*-----------------+ TopPannel +-----------------*/

#topPan{width:778px; margin:0 auto; height:271px; background:url(../images/top-bg.gif) repeat-x ; position:relative;}



#topPan img.logo{width:139px; height:87px; position:absolute; top:20px; left:100px; z-index: 2;}



/*TopNavigation*/

#topnav {

	width:250px;  position:absolute; top:25px; left:68%; padding:20px 0 0;

	font:11px normal Verdana, Arial, Helvetica, sans-serif; color: #474747;	

}



#topnav ul{display: block; font:11px normal Verdana, Arial, Helvetica, sans-serif; color: #474747;}

#topnav ul li{float:left; display:block; padding:0px;} 

#topnav ul li a{color: #474747; text-decoration: none;}

#topnav ul li a:hover{ color: #990000; text-decoration: none;}



a{color: #2d9bda; text-decoration: none;}

a:hover{ color: #990000; text-decoration: none;}



/*banner*/

#topPan #homeBanner{margin:0 auto; width: 776px;  height:162px; position: relative; top: 109px;

	background:url(../images/home-banner.jpg) no-repeat left top; z-index: 1;	 

}



/*Main Navigation*/

#topPan #homeBanner #mainnav {margin: 0 auto; position: relative; top: 130px; left: 0px; width: 714px;

	color: #474747;	font:bold 10px Verdana, Arial, Helvetica, sans-serif;

	background:url(../images/mainnav-bg.gif) repeat-x bottom;

}



#topPan #homeBanner #mainnav ul{display: block; clear: both;}



#topPan #homeBanner #mainnav ul li{ 

	float:left; display:block; width: 91px;

	background:url(../images/nav-bg.jpg) no-repeat left bottom; 

	padding:10px 0; margin:0 2px; text-align: center;

}

#topPan #homeBanner #mainnav ul li a{ float:auto; color: #024c71; text-decoration: none;}

#topPan #homeBanner #mainnav ul li a:hover{color: #0066FF; text-decoration: none;}

/*-----------------+ end TopPannel +-----------------*/



/*-----------------+ Body Pannel +-----------------*/

#bodyPan{width:714px; position:relative; margin:0 auto; padding:0 32px 0 58px;}



/*-----------------+ Body LeftPannel +-----------------*/

/*-------------------+ Left Pannel +-------------------*/

#LeftPan {float: left; width: 407px; background: inherit; margin:0 10px 0 10px; display: block; padding-top:30px;}

#LeftPan h1 {width:397px; background:inherit; margin-left:8px; line-height:24px;}

#LeftPan h2 {width:397px; background:inherit; margin-left:8px; line-height:24px;}

#LeftPan p {background:inherit; margin: 8px 0 0 10px;}

#LeftPan p.border{background:url(../images/hr-line.gif) 0% 50% repeat-x; padding:0px; margin:22px 0px;}



/*----Services----*/

#LeftPan #ServicesPan ul{float:left; width:auto; padding:10px 0 10px 25px;}

#LeftPan #ServicesPan ul li{width:165px; height:22px; margin:0 10px 0 0;}

#LeftPan #ServicesPan  ul li a{width:auto; display:block; background:url(../images/bullet.gif) 0 9px no-repeat; color:#3D3C2C; font:normal 11px/20px Verdana, Arial, Helvetica, sans-serif; text-decoration:none; padding:0 0 0 16px;}

#LeftPan #ServicesPan  ul li a:hover{width:auto; background:url(../images/bullet2.gif) 0 9px no-repeat; color:#2d9bda; text-decoration:none;}



/*----/work----*/

#work { 

	margin:15px 0px 6px 10px; padding:10px ;

	background:url(../images/work-bg.jpg) no-repeat center top;

}



#work .one {float: left; width: 120px;}

#work .one h3 { font:bold 11px Verdana, Arial, Helvetica, sans-serif; color: #ec5712; text-align: center; margin:0; padding:0; height:20px;}

#work .one img {width: 92px; height: 69px; margin:3px 0 3px 18px; padding:0; border:0px;}

#work .one p {text-align: center;}



#work .two {float: left; width: 120px;}

#work .two h3 { font:bold 11px Verdana, Arial, Helvetica, sans-serif; color: #ec5712; text-align: center; margin:0; padding:0; height:20px;}

#work .two img {width: 92px; height: 69px; margin:3px 0 3px 18px; padding:0; border:0px;}

#work .two p {text-align: center;}



#work .three {float: left; width: 120px;}

#work .three h3 { font:bold 11px Verdana, Arial, Helvetica, sans-serif; color: #ec5712; text-align: center; margin:0; padding:0; height:20px;}

#work .three img {width: 92px; height: 69px; margin:3px 0 3px 18px; padding:0; border:0px;}

#work .three p {text-align: center;}





/*-------------------+ Right Pannel +-------------------*/

#RightPan {float: left; width: 264px; display: block; height: auto; background:url(../images/right-pan-bg.gif) repeat-y left top; margin:0px; padding:0px;}

#RightPan h2 {

	width: 264;

	background:url(../images/right-top-bg.jpg) no-repeat left top; 

	margin:0px; padding:0px;clear: both;

	padding:76px 0 50px 0px; color: #ffffff; text-align:center;

}



#RightPan .Pro1 { margin:0 auto; height:100px; width: 228px;}

#RightPan .Pro1 h3 {font:bold 11px Verdana, Arial, Helvetica, sans-serif; color: #2d9bda; margin:0; padding:0 0 0 7px; height:20px;}

#RightPan .Pro1 img {float: left; margin:0; padding:0; border:0;}

#RightPan .Pro1 p {float: left; width: 120px; margin: 4px;}



#RightPan .Pro1 p a { color:#474747; text-decoration: none;}

#RightPan .Pro1 p a:hover { color: #0066FF; text-decoration: none;}



#RightPan .Pro2 { margin:0 auto; height:100px; width: 228px;}

#RightPan .Pro2 h3 {font:bold 11px Verdana, Arial, Helvetica, sans-serif; color: #2d9bda; margin:0; padding:0 0 0 7px; height:20px;}

#RightPan .Pro2 img {float: left; margin:0; padding:0; border:0;}

#RightPan .Pro2 p {float: left; width: 120px; margin: 4px;}



#RightPan .Pro2 p a { color:#474747; text-decoration: none;}

#RightPan .Pro2 p a:hover { color: #0066FF; text-decoration: none;}



#RightPan .Pro3 { margin:0 auto; height:100px; width: 228px;}

#RightPan .Pro3 h3 {font:bold 11px Verdana, Arial, Helvetica, sans-serif; color: #2d9bda; margin:0; padding:0 0 0 7px; height:20px;}

#RightPan .Pro3 img {float: left; margin:0; padding:0; border:0;}

#RightPan .Pro3 p {float: left; width: 120px; margin: 4px;}



#RightPan .Pro3 p a { color:#474747; text-decoration: none;}

#RightPan .Pro3 p a:hover { color: #0066FF; text-decoration: none;}



#RightPan .Pro4 { margin:0 auto; height:112px; width: 228px;}

#RightPan .Pro4 h3 {font:bold 11px Verdana, Arial, Helvetica, sans-serif; color: #2d9bda; margin:0; padding:0 0 0 7px; height:20px;}

#RightPan .Pro4 img {float: left; margin:0; padding:0; border:0;}

#RightPan .Pro4 p {float: left; width: 120px; margin: 4px;}



#RightPan .Pro4 p a { color:#474747; text-decoration: none;}

#RightPan .Pro4 p a:hover { color: #0066FF; text-decoration: none;}



#RightPan .blanker {height:50px;}

#RightPan .Rightbotom {width:251px;  background:url(../images/right-bottom-bg.gif) no-repeat left bottom; height:78px; padding-top:70px; margin:0px; padding:0px;}

/*------------------ // Footer ------------------*/



#footermainPan {

	margin: 0 auto; clear: both;width: 714px; height: 142px; color:#fff; padding: 0;

	background:url(../images/footer-bg1.gif) no-repeat left top;

}



#footermainPan ul{width:650px; height:20px; top: 100px; position: relative; clear: both; margin: 0 auto;}

#footermainPan li{float:left; }

#footermainPan ul li a{padding:0 10px 0; color:#ffffff; text-decoration:none; font-size:11px;}

#footermainPan ul li a:hover{text-decoration:underline;}





/*----------------------------------------------

About Us

----------------------------------------------*/



#innerLeft {float: left; width: 150px; background: inherit; margin:0 10px 0 10px; display: block; padding-top:30px; }



#innerRight {float: left; width: 490px; display: block; height: auto;  margin:0px; padding:0px; padding-top:30px;}

#innerRight p {margin-top: 8px;}



/*----------------------------------------------

Service

----------------------------------------------*/



#aboutRight ul{float:left; width:auto; padding:6px 0 10px 12px;}

#aboutRight ul li{width:auto; height:22px; margin:0 10px 0 0;}

#aboutRight ul li a{width:auto; display:block; background:url(../images/arrow.gif) 0 9px no-repeat; color:#ea5612; font:normal 11px/20px Verdana, Arial, Helvetica, sans-serif; text-decoration:underline; padding:0 0 0 16px;}

#aboutRight ul li a:hover{width:auto; background:url(../images/arrow2.gif) 0 9px no-repeat; color:#ea5612; text-decoration:none;}



.inputbox {

	background-color: #fff;

	font-family: Verdana, Arial, Helvetica, sans-serif;

	font-size: 11px;

	border-top: 2px solid #575757;

	border-right: 1px solid #999999;

	border-bottom: 1px solid #999999;

	border-left: 2px solid #575757;

}

/**
 * jQuery lightBox plugin
 * This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
 * and adapted to me for use like a plugin from jQuery.
 * @name jquery-lightbox-0.5.css
 * @author Leandro Vieira Pinho - http://leandrovieira.com
 * @version 0.5
 * @date April 11, 2008
 * @category jQuery plugin
 * @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
 * @license CC Attribution-No Derivative Works 2.5 Brazil - http://creativecommons.org/licenses/by-nd/2.5/br/deed.en_US
 * @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
 */
#jquery-overlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
}
#jquery-lightbox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}
#lightbox-nav {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
	width: 49%;
	height: 100%;
	zoom: 1;
	display: block;
}
#lightbox-nav-btnPrev { 
	left: 0; 
	float: left;
}
#lightbox-nav-btnNext { 
	right: 0; 
	float: right;
}
#lightbox-container-image-data-box {
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%;
	padding: 0 10px 0;
}
#lightbox-container-image-data {
	padding: 0 10px; 
	color: #666; 
}
#lightbox-container-image-data #lightbox-image-details { 
	width: 70%; 
	float: left; 
	text-align: left; 
}	
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber {
	display: block; 
	clear: left; 
	padding-bottom: 1.0em;	
}			
#lightbox-secNav-btnClose {
	width: 66px; 
	float: right;
	padding-bottom: 0.7em;	
}

#gallery {
	padding: 0px;
}
#gallery ul { list-style: none; }
#gallery ul li { display: inline;}
#gallery ul img {
	border: 5px solid #0db7f5;
	border-width: 5px 5px 5px;
}
#gallery ul a:hover img {
	border: 5px solid #000;
	border-width: 5px 5px 5px;
	color: #fff;
}
#gallery ul a:hover { color: #fff; }