/*=====================================================================
 *
 * Filename: layout.css
 * Website: www.uruku.com.
 * Author: Nivanka Fonseka - SilverStripers
 * Date Created: 18/11/2009
 * Media: Screen
 *
 * Description
 * -----------
 * Layout Style Sheet
 *
 *=====================================================================*/ 
 
/* Layout styles
	index -> 	
				CSS reset
*/


/* =css reset     
--------------------- */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, img, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline; 
	list-style-type:none;
	z-index:10 !important;
	font-family:Arial, Helvetica, sans-serif;
}

/* =Background for the HTML     
--------------------- */
html{
	background-color:#b6e5ff;
}

/* =clear     
--------------------- */
.clear{
	height:0px;
	clear:both;
	font-size:0px;
	line-height:0px;
}



/* =background image on footer    
--------------------- */
#Background{
	z-index:1 !important;
	left:0;
	bottom:64px;
	position:fixed;
	width:100%;
}

/* =Middle
--------------------- */
.middle{
	width:920px;
	margin:0px auto;
	position:relative;
	top:0px;
	left:0px;
}

/* =Navigation
--------------------- */
#Navigation{
	background-color:#000;
	height:32px;
	position:relative;
	top:0px;
	left:0px;
	z-index:100;
}

	#Navigation ul{
		display:block;
	}

		#Navigation ul li{
			float:left;
			margin-right:20px;
		}

/* =URUKU logo
--------------------- */		
#Logo{
	position:absolute;
	margin:20px 0px 0px -170px;

}

/* =OffSet boxes
--------------------- */
.offset{
	border-right:#FFF 10px solid;
	border-bottom:#FFF 10px solid;
	padding:10px 10px 10px 0px;
	position:relative;
	top:10px;
	left:10px;
}

	.container{
		background:#def4ff;
		margin-bottom:80px;
	}

	.container.first{
		background:#def4ff;
		margin-bottom:20px;
	}



/* =Footer style
--------------------- */
#Footer{
	background:url(../images/footer.gif) repeat-x;
	position:fixed;
	left:0px;
	bottom:0px;
	height:64px;
	width:100%;
}

	#Footer .middle div{
		height:32px;
		display:block;
	}

	

/* =HomePage

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

#HomeIntro{
	width:440px;
	position:relative;
	top:0px;
	left:0px;
	display:block;
	float:left;
}

#VideoIntro{
	width:440px;
	position:relative;
	top:0px;
	left:10px;
	display:block;
	min-height:100px;
	float:left;
}

/* =Sign up button
--------------------- */
#Signup-Home{
	display:block;
	width:244px;
	height:48px;
	background-image:url(../images/sprite.png);
	background-position:0px 0px;
	border:none;
	text-indent:-90000px;
	overflow:hidden;
}

/* =Why choose us list
--------------------- */
#WhyChoose li{
	width:290px;
	height:180px;
	margin-bottom:10px;
	margin-left:15px;
	float:left;
}		

	#WhyChoose li.first{
		margin-left:0px;
	}

/* =Playboard on URUKU functions
--------------------- */	
#PlayBoard{
	width:710px;
	position:relative;
	top:0px;
	left:0px;
	float:left;
}

/* =Controller links on the right
--------------------- */	
.controllers{
	width:209px;
	position:relative;
	top:60px;
	left:1px;
	float:left;
}

	.controllers ul li{
		height:30px;
		padding-left:25px;
		background-image:url(../images/sprite.png);
		background-repeat:no-repeat;
		opacity:0.9;
		border-bottom:1px #FFF solid;
	}

	.controllers ul li:focus, .controllers ul li:hover{ opacity:1;}
	.controllers ul li.newClient{ background-position:-679px 0px;}
	.controllers ul li.newProduct{ background-position:-679px -30px;}
	.controllers ul li.newInvoice{ background-position:-679px -60px;}
	.controllers ul li.invoiceSetup{ background-position:-679px -90px;}
	.controllers ul li.updateProfile{ background-position:-679px -120px;}
	.controllers ul li.upgradeAccount{ background-position:-679px -150px;}
	.controllers ul li.logout{ background-position:-679px -180px;}

	
/* =uruku functions link
--------------------- */	
#InvoiceSection{
	height:36px;
	background-image:url(../images/sprite.png);
	background-position:0px -444px;
	width:690px;
	padding:0px 6px 0px 0px;
	margin-bottom:30px;
	overflow:hidden;
}

	#InvoiceSection a{
		display:block;
		position:relative;
		width:230px;
		top:0px;
		left:0px;
		text-transform:uppercase;
		line-height:30px;
		float:left;
		border:none;
		color:#FFFFFF;
		font-weight:600;
		text-align:center;
	}

	#InvoiceSection a.center{
		width:228px;
		border-left:1px solid #8fa661;
		border-right:1px solid #8fa661;
	}

	#InvoiceSection a:hover, #InvoiceSection a.current{
		color:#333;
	}

/* =Edit table
--------------------- */
#EditTable{
	padding:10px;
	background:#FFF;
	width:500px;
	position:fixed;
	z-index:999999;
	margin-left:160px;
	display:none;
	border:#999 5px solid;
}
	#EditTable td{
		padding:4px;
		vertical-align:top;
	}
	#EditTable input, #EditTable textarea{
		width:250px;
	}
	#EditTable #SaveEdit{
		width:80px;
	}
	#EditTable #CloseEditTable{
		text-align:right;
		margin:10px 0px;
	}
	#EditTable #CloseEditTable img{
		cursor:pointer;
	}

/* =Information Table
--------------------- */
#InformationTable, #SalesItemTable{
	border-left:1px solid #FFF;
	border-bottom:1px solid #FFF;
	width:100%;
}
	#InformationTable td, #SalesItemTable td{
		padding:5px;
		border:1px solid #FFF;
		border-left:none;
		border-bottom:none;
		line-height:150%;
		vertical-align:top;
	}
	#InformationTable .TableHeader th, #SalesItemTable .TableHeader th{
		border:1px solid #FFF;
		border-left:none;
		border-bottom:none;
		font-weight:600;
		line-height:30px;
		height:30px;
	}
	.ClientData{
		float:left;
		width:200px;
	}
	.InvoiceData{
		float:left;
		width:468px;
		margin-left:10px;
	}
	
/* =Create new invoice
--------------------- */
.CreateInvoice{
	margin:10px 0px;
}
	.CreateInvoice label{
		display:block;
		width:150px;
		float:left;
		margin:0px 5px 0px 0px !important;
		text-align:right;
		font-weight:600;
	}
	#InformationTable label{
		display:block;
		width:120px;
		float:left;
		margin:0px 5px 0px 0px !important;
		font-weight:600;
		clear:left;
	}
	.CreateInvoice .field{
		margin:4px 0px;
	}
	.CreateInvoice.rightAligned{
		padding-left:402px;
	}
		.CreateInvoice.rightAligned input{
			width:127px;
		}
	#SalesItemTable, #InformationTable{
		margin-top:20px;
	}
	#SalesItemTable .nopadding{
		padding:0px;
		vertical-align:bottom;
		border:none;
		position:absolute;
		margin-left:-684px;
		top:270px;
		*top:262px;
	}
	#SalesItemTable .nopadding{
		border:none;
	}
	#SalesItemTable .nopadding .remove{
		margin-left:17px;
	}
#LastInvoice{
	color:#009900;
	font-weight:bold;
}
.ErrorMSG{
	color:#990000;
	font-weight:bold;
	display:none;
	margin-right:10px;
}
.errorRow{
	border:1px #990000 solid !important;
}
.itemline{
	display:table-row !important;
}
	.duplicate{
		text-indent:-900000px;
		overflow:hidden;
		background:url(../images/add.png);
		width:16px;
		height:16px;
		display:block;
	}
	.remove{
		text-indent:-900000px;
		overflow:hidden;
		background:url(../images/delete.png);
		width:16px;
		height:16px;
		display:block;
	}
	.remove-forbidden{
		background:url(../images/delete-grey.png) !important;
	}
	.Title{
		clear:left;
		float:left;
		border:none !important;
		margin-right:25px;
	}
	.EditItem{
		background-image:url(../images/sprite.png);
		background-position:-679px -215px;
		width:22px;
		height:22px;
		display:block;
		float:left;
		border:none !important;
		text-indent:-9000px;
		cursor:pointer;
	}
	.DeleteItem{
		background-image:url(../images/sprite.png);
		background-position:-679px -245px;
		width:22px;
		height:22px;
		display:block;
		float:left;
		border:none !important;
		text-indent:-9000px;
		cursor:pointer;
	}

/* =Inner Links
--------------------- */
.inner-links{
	display:block;
	clear:both;
}
	.inner-links li{
		float:left;
		margin-right:10px;
		padding-right:10px;
		border-right:2px #CCC solid;
	}
	.inner-links li a{
		font-weight:600;
		border:none;
	}

/* =Paginations
--------------------- */
.Paginations{
	display:block;
	clear:both;
	margin:10px 0px;
}
	.Paginations li{
		float:left;
		margin-right:7px;
	}
	.Paginations li a{
		background-color:#bbe1f4;
		color:#FFFFFF;
		cursor:pointer;
		height:11px;
		padding:5px 8px;
		width:5px;
		border:1px solid #CCC;
	}
	.Paginations li a.active, .Paginations li a:hover{
		background:#87d2f8;	
	}
	

/* =WideTable
--------------------- */
.wideTable{
	border-left:1px #FFF solid;
	border-bottom:1px #FFF solid;
	width:100%;
}
	.wideTable td{
		padding:7px;
		font-weight:600;
		border-right:1px #FFF solid;
		border-top:1px #FFF solid;
	}
	
/* = Twitter
--------------------- */
#twtr-widget-1 .twtr-doc, #twtr-widget-1 .twtr-hd a, #twtr-widget-1 h3, #twtr-widget-1 h4{
	background:none !important;
	color:#000 !important;
}
.twtr-hd{
	padding:0px !important;
	margin-bottom:5px;
}
.twtr-widget .twtr-tweet-wrap{
	padding:0px !important;
}