/*
Cell styles for a table based layout in which a row typically contains : 
 td.label : text label identifying the field
 td. control : the form control
 td.message : used for messages
 td.error : used for error messages. 
  When used in conjunction with tabmanager.js, one or other of these
  styles is applied to the same table cell, depending on the status 
Other cell styles
 td.field: generic cell style, other cell styles typically inherit from this 
 td.text: a generic style for a cell containing simple text 
-*/
body {
font-family: Arial;
}

table {
		font-family: inherit;
		font-size: 12px;
}

table.outline {
	border: 1px solid #A8A8FF;
}

tr.left {
	text-align: left;	
}

table.form {
		width: 100%;
		font-family: inherit;
		font-size: inherit;
		vertical-align: top;

}
td.price {
	color: red;
	font-weight: bold;
	font-size: 16px;
	text-align: center;
}

td.amt {
  text-align: right;
	width: 30px;
}

td.tot {
  text-align: right;
	width: 40px;
}

td.left {
				text-align: left;
				padding: 1px 1px 1px 5px;
}

td.right {
				 text-align: right;
				 padding: 1px 5px 1px 1px;
}

td.info {
				font-size: 10px;
}

td.img {
	text-align: center;

}

td.formImg {

	padding-top:15px;
	vertical-align: top;
	text-align: center;
	width: 150px;
	/*height: 200px;*/
	/*border: 1px solid red;*/
}

td.field {
	padding: 5px 2px 5px 2px;
	vertical-align: top;
}
/* delivery options form of shop */
td.thin {
	text-align: right;
	/*font-weight: bold;
	color: white;
	background-color:#A8A8FF;*/
	vertical-align: middle;
	font-size: 12px;
	width: 100px;
}

td.label {
	text-align: right;
	/*font-weight: bold;
	color: white;
	background-color:#A8A8FF;*/
	vertical-align: middle;
	font-size: 12px;
	width: 110px;
}

td.helpText {
	text-align: left;
	color: gray;
	font-size: 10px;
}

td.title {
	text-align: center;
	vertical-align: top;
	font-size: 16px;

}

.helpText {
	text-align: left;
	color: gray;
	font-size: 10px;
}


td.control {	
	text-align: left;
	width: 260px;
}

td.message {
	text-align: left;
  font-size: 12px;
	width: 260px;
	padding: 5px 2px 5px 2px;
	margin: 0px 0px 0px 0px;
	/*background-color: inherit; 
	color: inherit;*/
	
	/*padding: 5px 2px 5px 2px;
	margin: 0px 0px 0px 0px;
	 border: 1px solid green;*/
	
}

td.error {
 text-align: left;
 font-size: 12px;
 width: 260px;
 color: red;
 padding: 5px 2px 5px 2px;
 margin: 0px 0px 0px 0px;

 /*padding: 5px 2px 5px 2px;
 margin: 0px 0px 0px 0px;
 border: 1px solid red;*/
 /*font-weight: bold;*/
 /*border-top: 1px solid black;
 border-bottom: 1px solid black;
 border-left: 1px solid black;*/
}

th {
	 background-color: #A8A8FF;
	 color: white;
	 font-size: 12px;
}


.text {
	text-align: center;
	font-size: 12px;
}

.fill {
 margin: 0px 0px 0px 0px;
 padding: 0px 0px 0px 0px;
}


/*
Form Elements
Styles for HTML form controls 
.element: generic style from which all controls can inherit
.select: specfic style for a select control. See comment below.
.textarea: specfifc style for a textarea control
.mandatory: style for flagging mandatory items
*/
.element {
 border: 1px solid #A8A8FF;
 background-color: #FFFFE5;
 color: black;
 width: 260px;
}
 .qty {
  border: 1px solid #A8A8FF;
	margin: 1px 5px 1px 5px;
  background-color: #FFFFE5;
	text-align: right;
  color: black;
  width: 30px;
 }

/* 
To make select borders stylable in IE, insert in the head
<meta http-equiv="X-UA-Compatible" content="IE=100" >
*/
.select {
 width: 264px;
}
.textarea {
 height: 80px;
}
.mandatory {
 color: red;
 font-weight: bold;
 margin-right: 5px;
}

.formTitle{
 text-align: left;
 font-size: 16px;	
}

 hr {
 		width: 100%;
		color: #A8A8FF;
		background-color: #A8A8FF;
		height: 2px;
 }