@charset "utf-8";
/* CSS Document */
/* This file holds the general css for the WeboniseLab site */


/* CANCELLING ISSUES IN DIFFERENT BROWSERS */

html,body,div,span,img,applet,embed,canvas,object,iframe {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	background:transparent
}
h1,h2,h3,h4,h5,h6,p {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	background:transparent
}
ol,ul,li {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	background:transparent
}
fieldset,form,label,legend,button,table,caption,tbody,tfoot,thead,tr,th,td {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	background:transparent
}
ul,li {
	list-style:none; 
}
li {
	display:inline
}
/* GENERAL REDEFINITIONS */
html {
	width:100%;
	height:100%;
	margin:0;
}
body {
	background:#fff url(../images/bodyTopBg.jpg) top left repeat-x;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	margin:0;
	padding:0;
	color:#868686;
	line-height:18px;
}
a {
	color:#000;
	outline:none;
	text-decoration:none;
}
a:hover {
	color:#84c225;
	outline:none;
}
a img{
border:none;
}
.clr {
	clear:both;
}
/* LAYOUT-STRUCTURE */
#wrapper {
	width:100%;
	margin:0 auto;
	background:url(../images/wrapperBotBg.jpg) bottom repeat-x;
}
/* Header CSS start here */
#header {
	margin:0 auto;
	width:960px;
	height:60px;
}
.logo {
	background:url(../images/logo.jpg) no-repeat;
	margin:15px 0 0 0;
	width:210px;
	height:30px;
	float:left;
	z-index:100;
}
.logo a {
	text-indent:-5000px;
	display:block;
	width:210px;
	height:30px;
	z-index:100;
	cursor:pointer;
}
.navigation {
	float:right;
	margin-top:25px;
}
.navigation ul.mainNav {
	float:right;
	height:20px;
}
.navigation ul.mainNav li {
	display:block;
	height:20px;
	float:left;
	margin-left:20px;
}
.navigation ul.mainNav li a {
	display:block;
	height:20px;
	cursor:pointer;
	background-position:0 0;
	text-indent:-5000px;
}
.navigation ul.mainNav li a.home {
	background:url(../images/homeNavBg.jpg) no-repeat;
	width:40px;
}
.navigation ul.mainNav li a.about {
	background:url(../images/aboutNavBg.jpg) no-repeat;
	width:45px;
}
.navigation ul.mainNav li a.portfolio {
	background:url(../images/portfolioNavBg.jpg) no-repeat;
	width:65px;
}
.navigation ul.mainNav li a.services {
	background:url(../images/servicesNavBg.jpg) no-repeat;
	width:65px;
}
.navigation ul.mainNav li a.technology {
	background:url(../images/technologyNavBg.jpg) no-repeat;
	width:80px;
}
.navigation ul.mainNav li a.careers {
	background:url(../images/careersNavBg.jpg) no-repeat;
	width:55px;
}
.navigation ul.mainNav li a.blog {
	background:url(../images/blogNavBg.jpg) no-repeat;
	width:35px;
}
.navigation ul.mainNav li a.contact {
	background:url(../images/contactNavBg.jpg) no-repeat;
	width:55px;
}
.navigation ul.mainNav li a:hover, .navigation ul.mainNav li a.active {
	background-position:0 -20px!important;
}
/* Header CSS start here */

/* Content CSS start */
#content {
	width:960px;
	margin:0 auto;
	padding-top:40px;
}

#content h1 {
	display:block;
	height:40px;
	text-indent:-5000px;
	float:left;
}
#content h2 {
	display:block;
	height:22px;
	text-indent:-5000px;
	margin-bottom:18px;
	float:left;
}
h3 {
	display:block;
	height:15px;
	text-indent:-5000px;
	margin-bottom:15px;
}
h4 {
font-size:16px;
font-weight:bold;
height:20px;
}
#content .left {
	float:left;
	width:630px;
}
#content .right {
	float:right;
	width:300px;
	margin-left:30px;
}
.indexFlashHolder {
	height:350px;
	width:630px;
	float:left;
	margin:40px 0;
}
h2.ourExpertise {
	background:url(../images/ourExpertise.jpg) no-repeat;
	width:130px;
}
h2.upcomingProduct {
	background:url(../images/upcomingProduct.jpg) no-repeat;
	width:165px;
}
h2.portfolio {
	background:url(../images/portfolio.jpg) no-repeat;
	width:80px;
}
h2.blog {
	background:url(../images/blog.jpg) no-repeat;
	width:40px;
}
h2.weboniseLab {
	background:url(../images/weboniseLab.jpg) no-repeat;
	width:130px;
}
h2.ourValues {
	background:url(../images/ourValues.jpg) no-repeat;
	width:130px;
}
h2.founderWebonisers {
	background:url(../images/founderWebonisers.jpg) no-repeat;
	width:190px;
}
h2.story {
	background:url(../images/story.jpg) no-repeat;
	width:50px;
}
h2.branding {
	background:url(../images/branding.jpg) no-repeat;
	width:80px;
}
h2.uiUx {
	background:url(../images/uiUx.jpg) no-repeat;
	width:55px;
}
h2.productDevelopment {
	background:url(../images/productDevelopment.jpg) no-repeat;
	width:200px;
}
h2.socialApplications {
	background:url(../images/socialApplications.jpg) no-repeat;
	width:175px;
}
h2.rubyOnRails {
	background:url(../images/rubyOnRails.jpg) no-repeat;
	width:175px;
}
h2.cakePhp {
	background:url(../images/cakePhp.jpg) no-repeat;
	width:175px;
}
h2.contactDetail {
	background:url(../images/contactDetail.jpg) no-repeat;
	width:130px;
}
h2.location {
	background:url(../images/location.jpg) no-repeat;
	width:80px;
}
h2.quickResponse {
	background:url(../images/quickResponse.jpg) no-repeat;
	width:140px;
}
ul.ourExpertiseList {
	width:300px;
	margin-bottom:15px;
	height:375px;
}
ul.ourExpertiseList li {
	height:100px;
	width:135px;
	float:left;
	margin-bottom:25px;
	background-position:0 0;
}
ul.ourExpertiseList li.indexBrandingIcon {
	background:url(../images/indexBrandingIcon.jpg) no-repeat;
}
ul.ourExpertiseList li.indexUserInterfaceIcon  {
	background:url(../images/indexUserInterfaceIcon.jpg) no-repeat;
}
ul.ourExpertiseList li.indexRubyOnRailsIcon  {
	background:url(../images/indexRubyOnRailsIcon.jpg) no-repeat;
}
ul.ourExpertiseList li.indexCakePhpIcon  {
	background:url(../images/indexCakePhpIcon.jpg) no-repeat;
}
ul.ourExpertiseList li.indexWordpressIcon  {
	background:url(../images/indexWordpressIcon.jpg) no-repeat;
}
ul.ourExpertiseList li.indexSocialAppsIcon {
	background:url(../images/indexSocialAppsIcon.jpg) no-repeat;
}
ul.ourExpertiseList li:hover {
	background-position:0 -100px!important;
}
ul.ourExpertiseList li a {
	display:block;
	text-indent:-5000px;
	height:100px;
	width:135px;
}
.indexUpcomingProduct, .aboutWeboniseLab, .contactDetailWrapper {
	width:300px;
	margin-right:30px;
	float:left;
	margin-bottom:40px;
}
.aboutWeboniseLab p {
	margin-bottom:7px;
}
.indexPortfolio, .founderWebonisersWrapper, .locationWrapper, .ourValues {
	width:300px;
	float:left;
	margin-bottom:40px;
}
.founderWebonisersWrapper {
	width:960px;
}
ul.productList {
}
ul.productList li.product {
	display:block;
	float:left;
	height:365px;
	width:300px;
	margin:0 30px 40px 0;
}
.indexUpcomingProduct ul.productList li.product, .indexPortfolio ul.productList li.product {
	margin:0;
}
ul.productList li.product .productName {
	height:20px;
	float:left;
	font-size:16px;
	font-weight:bold;
}
ul.expertiseUsed, .pageHeading ul.expertiseList {
	height:20px;
	float:right;
}
.portfolioDetail .left ul.expertiseUsed {
	float:left;
}
.pageHeading ul.expertiseList {
	margin-top:10px;
}
ul.expertiseUsed li, .pageHeading ul.expertiseList li, ul.followMe li {
	height:20px;
	width:20px;
	margin-left:10px;
	background-position:0 0;
	display:block;
	float:left;
}
ul.expertiseUsed li a, .pageHeading ul.expertiseList li a, ul.followMe li a {
	height:20px;
	width:20px;
	display:block;
	text-indent:-5000px;
}
ul.expertiseUsed li.brandingIcon, .pageHeading ul.expertiseList li.brandingIcon {
	background:url(../images/brandingIcon.jpg) no-repeat;
}
ul.expertiseUsed li.userInterfaceIcon, .pageHeading ul.expertiseList li.userInterfaceIcon  {
	background:url(../images/userInterfaceIcon.jpg) no-repeat;
}
ul.expertiseUsed li.rubyOnRailsIcon, .pageHeading ul.expertiseList li.rubyOnRailsIcon  {
	background:url(../images/rubyOnRailsIcon.jpg) no-repeat;
}
ul.expertiseUsed li.cakePhpIcon, .pageHeading ul.expertiseList li.cakePhpIcon  {
	background:url(../images/cakePhpIcon.jpg) no-repeat;
}
ul.expertiseUsed li.wordpressIcon, .pageHeading ul.expertiseList li.wordpressIcon  {
	background:url(../images/wordpressIcon.jpg) no-repeat;
}
ul.expertiseUsed li.socialAppsIcon, .pageHeading ul.expertiseList li.socialAppsIcon {
	background:url(../images/socialAppsIcon.jpg) no-repeat;
}
ul.expertiseUsed li.flashIcon, .pageHeading ul.expertiseList li.flashIcon {
	background:url(../images/flashIcon.jpg) no-repeat;
}
ul.expertiseUsed li.joomlaIcon, .pageHeading ul.expertiseList li.joomlaIcon {
	background:url(../images/joomlaIcon.jpg) no-repeat;
}
ul.expertiseUsed li.phpIcon, .pageHeading ul.expertiseList li.phpIcon {
	background:url(../images/phpIcon.jpg) no-repeat;
}
ul.followMe li.twitterIcon {
	background:url(../images/twitterIcon.jpg) no-repeat;
}
ul.followMe li.facebookIcon {
	background:url(../images/facebookIcon.jpg) no-repeat;
}
ul.followMe li.linkedInIcon {
	background:url(../images/linkedInIcon.jpg) no-repeat;
}
ul.expertiseUsed li:hover, .pageHeading ul.expertiseList li:hover, ul.followMe li:hover {
	background-position:0 -20px!important;
}
.pageHeading ul.expertiseList li.filterByCategory {
	line-height:20px;
	text-indent:0;
	font-size:16px;
	padding-right:25px;
	width:auto;
}
ul.productList li.product .productImage {
	height:180px;
	width:300px;
	margin:10px 0 15px 0;
}
ul.productList li.product .productDescription {
	height:110px;
	width:300px;
	margin:0 0 10px 0;
	text-align:justify;
}
ul.productList li.product .links {
	height:20px;
}
ul.productList li.product .links span {
	float:left;
	padding-right:20px;
}
ul.productList li.product .links span.feedback {
	float:right;
	display:block;
	padding-left:25px;
	padding-right:0;
	height:20px;
	background:url(../images/feedbackIcon.jpg) left center no-repeat;
}
span.viewAll {
	float:right;
}
ul.blogPosts {
	width:300px;
}
ul.blogPosts li.post {
	display:block;
	border-bottom:1px solid #dadada;
	margin-bottom:15px;
}
ul.blogPosts li.post .heading .title {
	font-weight:bold;
	padding-bottom:5px;
}
ul.blogPosts li.post .heading .date {
	font-size:10px;
	padding-bottom:7px;
	line-height:10px;
}
ul.blogPosts li.post .entry {
	margin-bottom:10px;
}
ul.blogPosts li.post .links {
	height:20px;
	padding-bottom:10px;
}
ul.blogPosts li.post .links a.readmore {
	float:left;
}
ul.blogPosts li.post .links .comment {
	float:right;
}
.pageHeading {
	height:40px;
	width:960px;
	margin-bottom:40px;
}
h1.portfolio {
	width:140px;
	background:url(../images/portfolioBig.jpg) no-repeat;
}
h1.services {
	width:140px;
	background:url(../images/servicesBig.jpg) no-repeat;
}
h1.technology {
	width:180px;
	background:url(../images/technologyBig.jpg) no-repeat;
}
h1.careers {
	width:125px;
	background:url(../images/careersBig.jpg) no-repeat;
}

h1.contact {
	width:130px;
	background:url(../images/contactBig.jpg) no-repeat;
}
.portfolioWrapper {
	width:960px;
}
ul.productList li.marRightNone {
	margin-right:0 !important;
}
.pageNavigation {
	height:20px;
	margin-bottom:40px;
}
.pageNavigation ul {
	height:20px;
	float:left;
}
.pageNavigation ul li{
	margin-right:10px;
	float:left;
}
.pageNavigation ul li a {
	height:20px;
	width:30px;
	text-align:center;
	display:block;
	line-height:20px;
	color:#fff;
	background:#000;
	cursor:pointer;
}
.pageNavigation ul li a.prevBtn {
	width:40px;
	background:url(../images/prevArrowBg.jpg) no-repeat;
	text-indent:-5000px;
}
.pageNavigation ul li a.nextBtn {
	width:40px;
	background:url(../images/nextArrowBg.jpg) no-repeat;
	text-indent:-5000px;
}
.pageNavigation ul li a.prevBtn:hover {
	width:40px;
	background:url(../images/prevArrowSelBg.jpg) no-repeat;
}
.pageNavigation ul li a.nextBtn:hover {
	width:40px;
	background:url(../images/nextArrowSelBg.jpg) no-repeat;
}
.pageNavigation ul li a:hover, .pageNavigation ul li a.active {
	color:#000;
	background:#84c225;
}
.pageHeading .projectNavigation {
	height:20px;
	float:right;
	line-height:20px;
	text-indent:0;
	font-size:14px;
	padding-right:30px;
	width:auto;
	margin-top:10px;
	font-weight:bold;
}
#content .portfolioDetail .left, #content .services .left, #content .careersWrapper .left {
	width:300px;
}
#content .portfolioDetail .right, #content .services .right, #content .careersWrapper .right {
	width:630px;
}
#content .careersWrapper .left p {
	margin-bottom:30px;
}
#content .careersWrapper .right p, .careersWrapper ol {
	margin-bottom:25px;
}
#content .services .right {
	height:320px;
}
#content .services .right a.thumb {
cursor:pointer;
width:630px;
height:320px;
}
#content .services .right span {
display:block;
overflow:hidden;
width:630px;
height:320px;
}
#content .services .right a {text-decoration: none; color: #777; display: block;}
.portfolioDetail .left h4.portfolioName {
	height:30px;
	font-size:24px;
	font-weight:normal;
	color:#000;
	margin-bottom:20px;
}
.siteLink {
	font-size:14px;
	line-height:12px;
	padding-bottom:20px;
	display:block;
	font-weight:bold;
}
.portfolioDetail .left .PortfolioDescription {
	margin-bottom:25px;
}
.portfolioDetail .left .PortfolioDescription p, .services .left p {
	padding-bottom:5px;
	text-align:justify;
}
.portfolioDetail .left .rating {
	margin-top:20px;
}
.portfolioDetail .left .rating span {
	display:block;
	height:20px;
	background:url(../images/feedbackIcon.jpg) left center no-repeat;
	padding-left:30px;
	color:#000;
}
.portfolioDetail .left .rating span.appreciations {
	float:left;
}
.portfolioDetail .left .rating span.appreciate {
	float:right;
}
.portfolioDetail .right .projectNextPrev {
	height:20px;
	padding:5px 0;
	margin-bottom:20px;
}
.portfolioDetail .right .projectNextPrev a {
	display:block;
	width:auto;
	height:20px;
	margin-left:10px;
	padding:0 10px;
	background:#000;
	color:#fff;
	line-height:20px;
	float:right;
}
.portfolioDetail .right .projectNextPrev a:hover {
	background:#84c225;
	color:#fff;
}
.portfolioSlidshow {
	width:630px;
	margin-bottom:40px;
	overflow:hidden;
}
.portfolioSlidshow .content {
	height:380px;
	width:630px;
}
ul.founders {
	width:960px;
}
ul.founders>li {
	width:300px;
	height:90px;
	display:block;
	margin-bottom:30px;
	margin-right:30px;
	float:left;
}
ul.founders>li.marRightNone {
	margin-right:0;
}
ul.founders li .detail {
	width:190px;
	padding-right:15px;
	float:left;
}
ul.founders li .founderImage {
	width:95px;
	height:90px;
	float:right;
}
ul.founders li .detail .founderName {
font-size:16px;
font-weight:bold;
height:20px;
color:#000;
}
ul.founders li .detail .aboutFounder {
height:45px;
padding-top:5px;
}
ul.founders li .detail ul.followMe {
	float:left;
}
ul.founders li .detail ul.followMe li {
	margin-left:0;
	margin-right:10px;
}
.contactForm input {
	width:290px;
	background:url(../images/inputBg.jpg) no-repeat;
	border:none;
	font-size:12px;
	padding:9px 5px;
}
.contactForm textarea {
	width:290px;
	height:80px;
	background:url(../images/textareaBg.jpg) no-repeat;
	border:none;
	padding:5px;
	font-size:12px;
}
.contactForm input.sendBtn {
	width:60px;
	height:30px;
	border:none;
	text-indent:-5000px;
	background:url(../images/sendBtnBg.jpg) no-repeat;
	cursor:pointer;
	padding:0;
	position:relative;
	display:block;
	float:left;
}
.contactForm .field {
	height:30px;
	width:300px;
	position:relative;
	margin:5px 0 10px;
}
.contactForm .textareaWrapper {
	height:90px;
	width:300px;
	position:relative;
	margin:5px 0 10px;
}
.contactForm span.LV_validation_message {
	position:absolute;
	top:-25px;
	left:0;
	display:block;
	width:300px;
	text-align:right;
	color:#84c225;
	font-size:16px;
	font-family:Arial, Helvetica, sans-serif;
}
.contactReply {
	float:right;
	line-height:30px;
}
.careersSubHeading {
	height:45px;
	background:url(../images/careersSubHeading.jpg) top left no-repeat;
	border-bottom:1px solid #e4e4e4;
	text-indent:-5000px;
	margin-bottom:30px;
}
#content h3.careersHeading {
	font-size:24px;
	color:#000;
	text-indent:0;
	margin-bottom:25px;
	font-weight:normal;
	line-height:24px;
}
#content .careersWrapper h4 {
	font-size:16px;
	color:#868686;
	text-indent:0;
	margin-bottom:10px;
	font-weight:bold;
}
#content  h3.careersHeading span {
	font-size:16px;
	color:#868686;
	font-weight:bold;
}
#content .careersWrapper {
	border-bottom:1px solid #e4e4e4;
	margin-bottom:30px;
}

.careersWrapper ol li {
	display:block;
	display:list-item;
	list-style:decimal;
	padding-left:20px;
	line-height:20px;
}
.careersWrapper ol {
	padding-left:25px;
}
/* Content CSS end */

/*Footer Start Here*/
#footer {
	width:960px;
	height:210px;
	margin:20px auto 0;
}
.whatsInLabWrapper {
	width:300px;
	margin-right:30px;
	float:left;
}
.associatesWrapper {
	width:135px;
	margin-right:30px;
	float:left;
}
.socialNetworkWrapper {
	width:135px;
	float:left;
}
h3.whatsInLab {
	background:url(../images/whatsInLab.jpg) no-repeat;
	width:90px;
}
h3.associates {
	background:url(../images/associates.jpg) no-repeat;
	width:75px;
}
h3.socialNetwork {
	background:url(../images/socialNetwork.jpg) no-repeat;
	width:105px;
}
#footer ul {
	width:135px;
	float:left;
}
#footer ul li {
	width:135px;
	height:20px;
	display:block;
	margin-bottom:10px;
	font-size:14px;
	line-height:20px;
	font-weight:bold;
}
#footer ul.socialNetworkList li {
	width:105px;
	padding-left:30px;
	background-position:0 0;
}
#footer ul.socialNetworkList li:hover {
	background-position:0 -20px!important;
}
#footer ul.socialNetworkList li.facebook {
	background:url(../images/facebookIcon.jpg) top left no-repeat;
}
#footer ul.socialNetworkList li.orkut {
	background:url(../images/orkutIcon.jpg) top left no-repeat;
}
#footer ul.socialNetworkList li.linkedIn {
	background:url(../images/linkedInIcon.jpg) top left no-repeat;
}
#footer ul.socialNetworkList li.wordpress {
	background:url(../images/wordpressIcon.jpg) top left no-repeat;
}
.twitterWrapper {
	height:140px;
	width:300px;
	float:right;
	background:url(../images/twitterWrapperBg.jpg) no-repeat;
}
#twitter {
	height:60px;
	width:260px;
	margin:25px 20px 5px;
	color:#8e8cc7;
}
#twitter ul {
	height:80px;
	width:260px;
}
#twitter ul li {
	height:80px;
	width:260px;
	font-weight:normal;
	line-height:18px;
	font-size:12px;
}
#twitter ul li span {
	display:block;
	height:60px;
}
#twitter ul li span+a {
	color:#8e8cc7;
}
	
/*.twittTime {
	line-height:10px;
	font-size:10px;
	color:#8e8cc7;
	margin:0 20px 0;
}*/
h3.folloUs {
	background:url(../images/followUs.jpg) no-repeat;
	width:65px;
	margin:35px 0 0 140px;
}
h3.folloUs a {
	display:block;
	width:65px;
	height:20px;
	cursor:pointer;
}
#footer .copyrightWrapper {
	height:40px;
	margin-top:20px;
}
.footerLogo {
	height:20px;
	width:140px;
	float:left;
	margin-top:10px;
	background:url(../images/footerLogo.jpg) no-repeat;
	text-indent:-5000px;
}
.copyright {
	height:12px;
	line-height:12px;
	float:right;
	color:#868686;
	margin-top:14px;
}
.services {
	margin-bottom:40px;
}
/*Footer CSS end*/

/*Other CSS start*/
.marTop5{margin-top:5px}.marTop10{margin-top:10px}.marTop15{margin-top:15px}.marTop20{margin-top:20px}.marTop25{margin-top:25px}.marTop3{margin-top:30px}.marTop35{margin-top:35px}.marTop40{margin-top:40px}.marTop50{margin-top:50px}.marTop100{margin-top:100px}.marBot5{margin-bottom:5px}.marBot10{margin-bottom:10px}.marBot15{margin-bottom:15px}.marBot20{margin-bottom:20px}.marBot25{margin-bottom:25px}.marBot30{margin-bottom:30px}.marBot35{margin-bottom:35px}.marBot40{margin-bottom:40px}.marBot45{margin-bottom:45px}.marBot50{margin-bottom:50px}.bold{font-weight:bold}.normal{font-weight:normal}.red{color:#F00}.green{color:#008000}.black{color:#000}.white{color:#FFF}.rightSide{float:right}.leftSide{float:left}.marRight30{margin-right:30px}
/*Other CSS end*/