@import url("components.css");

/******************************************************************************
 * Generic CSS
 *****************************************************************************/
body {
	font-family: Arial, Verdana, sans-serif; font-size:12px; color:#666666;
	border:0px; margin:10px auto 0px auto; padding:0px 0px 0px 0px;
	text-align:center; background-color:#fbfbfb;
}

* html body { text-align: center; /* IE 5 centering */ }

/******************************************************************************
* GENERIC FORMATTING
*****************************************************************************/

p { }

a { color:#666666; }

h1 { font-size:16px; margin:0px 0px 10px 0px; }

h2 { font-size:14px; margin:0px 0px 10px 0px; }

h3 { font-size:12px; margin:0px 0px 10px 0px; }

textarea {
	font-family: Verdana, Arial, sans-serif; font-size:12px;
}

/******************************************************************************
* Normal Images
*****************************************************************************/
img { border:none; margin:0px; padding:0px; }

/******************************************************************************
* Normal Unordered List
*****************************************************************************/
ul {
	display:block; list-style:none;
	padding:0px 0px 0px 0px; margin:0px 0px 15px 0px;
}

ul li {
	display:block; line-height:18px;
	margin:0px 0px 0px 0px; padding:0px 0px 0px 10px;
	background-image:url(../images/ul_bullet.gif);
	background-repeat:no-repeat; background-position:0px 7px;
	color:#555555;
}

/******************************************************************************
* Main Headings
*****************************************************************************/
h1.mainHeading {
	border-bottom:2px solid #bbbbbb;
	border-top:2px solid #bbbbbb;
	padding-bottom:9px; padding-top:10px;
	color:#210E7D;
}

/******************************************************************************
* Misc
*****************************************************************************/
div.centered { text-align:center; }

/******************************************************************************
* wrapper
*****************************************************************************/
div#wrapper {
	width:800px; margin:0px auto 0px auto; text-align:left;
}

* html div#wrapper { text-align: left; /* Win IE 5 left align after centering */ }

/******************************************************************************
* header
*****************************************************************************/
div#header {
	float:left; width:800px; height:70px;
}

div#header div#header-title {
	float:left;
}

div#header img#logo { display:block; float:left; margin-top:10px; }

div#header h1 {
	display:block; float:left; width:167px; height:19px; margin:25px 0px 0px 30px;
	background-image:url(../images/header-title.gif);
}

div#header h1 span { display:none; }

div#header div#header-details {
	float:right; width:450px; margin-top:20px;
}

div#header div#header-details p { margin:0px; }

div#header div#header-details p#header-user {
	float:right; margin:5px 10px 0px 0px;
}

div#header div#header-details p#header-logout-button {
	float:right; width:86px;
}

div#header div#header-details p#header-logout-button a {
	display:block; width:86px; height:26px;
	background-image:url(../images/buttons/logout.jpg);
}

div#header div#header-details p#header-logout-button a span { display:none; }

div#header div#header-details p#header-logout-button a:hover { background-position: 0px -26px; }

/******************************************************************************
* login
*****************************************************************************/
div#login {
	margin-top:40px; text-align:center;
}

div#login h1 {
	display:block; width:167px; height:19px; margin:20px auto 0px auto;
	background-image:url(../images/header-title.gif);
}

div#login h1 span { display:none; }

div#login form { margin-top:20px; }

div#login div.formElement {
	width:200px; margin:0px auto 0px auto;
	text-align:left;
}

div#login div.formElement p { font-weight:bold; }

div#login div.formElement input {
	width:100%;
}

div#login input#submit { margin-top:10px; }

/******************************************************************************
* buttons
*****************************************************************************/
h2.withButton, h3.withButton {
	display:block; float:left; width:100%; clear:both; height:26px;
	margin:0px 0px 0px 0px;
}

h2.withButton {
	margin:0px 0px 5px 0px;
}

h3.withButton {
	margin:0px 0px 5px 0px; padding-top:5px;
	border-top:2px solid #dddddd;
}

h2.withButton span, h3.withButton span  { display:block; float:left; padding-top:5px; }

h2.withButton a.button, h3.withButton a.button { float:right; clear:none; }

p.buttonRow {
	display:block; float:left; width:100%; clear:both; height:26px;
	margin:0px 0px 0px 0px;
}

p.buttonRow span {
	display:block; float:left; padding-top:5px;
}

p.buttonRow a.button {
	float:left; clear:none;
}

a.button { display:block; height:26px; }

a.button span { display:none; }

a.button:hover { background-position:0px -26px; }

a.editButton { background-image:url(../images/buttons/edit.jpg); width:76px; }
a.addButton  { background-image:url(../images/buttons/add-white.jpg); width:66px; }
a.saveButton { background-image:url(../images/buttons/save.jpg); width:76px; }
a.cancelButton { background-image:url(../images/buttons/cancel.jpg); width:76px; }
a.deleteButton { background-image:url(../images/buttons/delete.jpg); width:76px; }
a.backButton { background-image:url(../images/buttons/back.jpg); width:77px; }
a.returnButton { background-image:url(../images/buttons/return.jpg); width:77px; }
a.addCustButton { background-image:url(../images/buttons/addCustomer.jpg); width:118px; }
a.addDistButton { background-image:url(../images/buttons/addDistributer.jpg); width:124px; }
a.addContractButton { background-image:url(../images/buttons/addContract.jpg); width:118px; }
a.editContractButton { background-image:url(../images/buttons/editContract.jpg); width:118px; }
a.createNewButton { background-image:url(../images/buttons/createNew.jpg); width:101px; }
a.proceed { background-image:url(../images/buttons/proceed.jpg); width:87px; }
a.addStaffButton { background-image:url(../images/buttons/addStaff.jpg); width:88px; }

/******************************************************************************
* customer-view-calls
*****************************************************************************/
table.basic {
	border-collapse:collapse; width:800px; margin-bottom:15px;
	float:left; font-size:11px;
}

table.basic th {
	border:1px solid #999999;  background-color:#555555;
	color:#ffffff; padding:5px; text-align:left;
	background-image:url(../images/tables/basic-hr-bg.jpg);
}

table.basic td {
	border:1px solid #999999; padding:5px; font-weight:normal;
	vertical-align:top;
}

table.basic tr th.editDelete, table.basic tr td.editDelete {
	width:90px;
}

/******************************************************************************
* generic form elements
*****************************************************************************/
p.singleLineFormEntry {
	display:block; float:left; width:100%; margin:0px 0px 10px 0px;
}

p.singleLineFormEntry span.label {
	display:block; float:left; font-weight:bold; padding-top:3px;
}

p.singleLineFormEntry input {
	margin-left:10px; color:#666666; padding:1px 1px 0px 2px;
}

p.singleLineFormEntry select {
	margin-left:10px; color:#666666; padding:1px 1px 0px 0px;
	width:268px;
}

/******************************************************************************
* horizontalList
*****************************************************************************/
p.horizontalList {
	display:block; float:left; margin:0px 0px 10px 10px;
}

p.horizontalList a {
	display:block; float:left; padding:5px 5px 5px 5px;
	margin:0px 10px 10px 0px; text-decoration:none;
	background-color:#eeeeee; color:#666666; font-weight:bold;
}

p.horizontalList a:hover { background-color:#666666; color:#eeeeee; }

/******************************************************************************
* debug
*****************************************************************************/
div#debugBlock {
	float:left; width:100%; padding:5px 5px 5px 0px; margin-top:120px;
	background-color:#eeeeee;
}

div.debug {
	float:left; margin-left:5px; padding:5px 15px 5px 5px;
	background-color:white; border:2px solid #cccccc;
}

div.debug p {
	margin:0px; font-size:11px;
}

div.debug pre { font-size:11px; }

/******************************************************************************
* datejs
*****************************************************************************/