/* CSS used when a customer is logged in */

/* Basic layout */
body {
	color: #444444;
	line-height: 14pt;
	margin: 0px;
	background-color: #fff;
	background-image: url(../images/pipe_extender.gif);
	background-repeat: repeat-x;
	background-position: center 190px;
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	font-size: 11px;
	padding-top: 30px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}

/* Change container width below to make content use more of the page's width (it's smaller for customer section by default) */
#container { width: 790px; margin: auto; text-align: left; background-color: #FFFFFF; }
#inner_container {
	border-top-width: 0px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #e4e3e3;
	border-right-color: #e4e3e3;
	border-bottom-color: #e4e3e3;
	border-left-color: #e4e3e3;
	overflow: auto;
	padding-top: 20px;
	padding-right: 16px;
	padding-bottom: 16px;
	padding-left: 16px;
	margin-bottom: 30px;
}
#logo_container { 
	background-color: #fbfbfb;
	border: 1px solid #e4e3e3;
	padding: 7px;
	height: 108px;
}
#logo_container .background {
	background-image: url(../images/header_background.jpg);
	background-color: #d3d3d3;
	border: 1px solid #4b7dcf;
	height:86px;
	padding-top: 16px;
	padding-right: 16px;
	padding-bottom: 4px;
	padding-left: 16px;
	background-position: left center;
	background-repeat: no-repeat;
}
#logo_container h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #0046ba;
	letter-spacing: -1px;
	float: right;
	margin-top: 28px;
}

#title {
	float: left;
	color: #0046BA;
	margin-bottom: 22px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12pt;
	font-weight: bold;
}
#login_message { float: right }
#calendar { width: 250px }

#copyright { float: right; margin-top: 20px }
#language_select { float: left; margin-top: 20px }

/* Basic styles */
a, a:visited, a:active, a:hover {
	color: #0046ba;
	text-decoration: none;
}

ul { list-style: url(../images/li.gif); margin-top: 8px; margin-bottom: 0px; }
li { line-height: 10pt; padding-bottom: 8px; }

img { border: 0px; vertical-align: middle; }
img.icon { vertical-align: middle; }
img.icontext { vertical-align: middle; margin-right: 5px }

.description { padding-bottom: 20px }
.popup { position: absolute; visibility: hidden; z-index: 101; left: 0px; top: 0px; border: 1px solid #307fff; background-color: #f0f4f9; padding: 5px; width: 200px }
.bold { font-weight: bold }
.required { border-bottom: 1px dashed red }

/* Forms and inputs */
form { margin: 0px; padding: 0px;  }
input.checkbox { border: 0px; }

input.button {
	background-color: #ff5f00;
	padding-right: 8px;
	padding-left: 8px;
	color: #FFFFFF;
	border-style:solid;
	border-width: 1px;
	border-top-color: #FF8E4A;
	border-right-color: #BF4800;
	border-bottom-color: #BF4800;
	border-left-color: #FF8E4A;
	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;
	font-weight: bold;
}
input.button:active { border: 2px solid #DDDDDD; border-top: 2px solid #666666; border-left: 2px solid #666666; }
input.space { margin: 4px 0px }

textarea, input, select { border: 1px solid #307fff; font: 8pt Tahoma, Verdana, Arial, Helvetica, sans-serif; color: #444444; }
input.medium { width: 150px }
input.large { width: 250px }
textarea.fixed { font-family: Courier New; width: 100%; height: 200px }

textarea.small { width: 300px; height: 75px }
textarea.medium { width: 100%; height: 100px }
textarea.full { width: 100%; height: 150px }

/* Iframe style used for loading of inline text/wysiwyg editor */
iframe.wysiwyg { border-width: 0px; width: 100%; height: 1px } /* 1px height will auto-resize */

/* Notices and warnings */
div.notice {
	padding-left: 36px;
	margin-bottom: 20px;
	background: #f1f1f1 url(../images/noteinfo.gif) no-repeat 10px center;
	padding-top: 8px;
	padding-right: 8px;
	padding-bottom: 10px;
}
div.warning { padding: 6px; padding-left: 35px; margin-bottom: 15px; background: #f1f1f1 url(../images/warning.gif) no-repeat 10px center; }
div.error { padding: 6px; padding-left: 35px; margin-bottom: 15px; background: #f1f1f1 url(../images/notedelete.gif) no-repeat 10px center; }

.search_navigate { clear: both; margin-top: 5px; line-height: 10pt }

/* Top menu */
#menu_bar {
	background: url(../images/bargray2.gif);
	height: 28px;
	border-bottom: 1px solid #ff6000;
}

#menu, #menu ul { padding: 0; margin: 0; list-style: none; position: relative; z-index: 100; }

#menu li {
	position: relative;
	border-right: 1px solid #FFFFFF;
	background: url(../images/bargray2.gif);
	width: 157px;
	float: left;
	text-align: center;
	text-transform: capitalize;
	color: #0046ba;
	cursor: pointer;
	padding: 0;
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
}

#menu li ul { display: none; position: absolute; top: 22px; left: 0px; border: 1px solid #4992B6; text-transform: none; background-color: #f0f4f9; width: 175px; }

#menu li a {
	height: 28px;
	display: block;
	text-decoration: none;
	line-height: 28px;
}
#menu li a:hover { background: url(../images/barblue.gif); color: #FFFFFF; }

#menu li ul li {
	background: none;
	text-transform: none;
	text-align: left;
	height: 28px;
	cursor: pointer;
	color: #0046ba;
	width: 175px;
	border: 0px;
	border-top: 1px solid #FFFFFF
}
#menu li ul li a { padding-left: 14px; display: block; font-weight: normal; font-size: 8pt; }

#menu li:hover ul, #menu li.over ul { display: block; }

/* Table styles */
table.a { width: 100%; background-color: #FFFFFF }
table.a td { padding: 2px }

tr.a, td.a { background-color: #FFFFFF; }
tr.b, td.b { background-color: #f1f1f1; }
tr.msg_a, td.msg_a { background-color: #FFFFFF; vertical-align: top }
tr.msg_b, td.msg_b { background-color: #f1f1f1; vertical-align: top }
tr.head {
	color: #FFFFFF;
	font-weight: bold;
	background-image: url(../images/barblue.gif);
	background-color: #fd6001;
}
tr.head td { padding: 2px }
tr.a:hover, tr.b:hover, tr.hover { background-color: #e8eef6; }
td.icon { width: 16px; text-align: center; vertical-align: top; }

/* Table used for forms */
table.form { width: 100%; border: 1px solid #307fff; background-color: #FFFFFF }
table.noborder { border: 0px }
table.form td.label {
	padding: 3px;
	height: 20px;
	text-align: right;
	width: 26%;
	vertical-align: top
}
table.form td.short { width: auto }
table.form td.field { background-color: #f0f4f9; padding: 3px; height: 20px; vertical-align: top; }
table.form td.space { padding-bottom: 20px }

/* Table used for the customer homepage icons */
table.home_menu td { padding: 10px }
table.home_menu td.image { width: 50px;   }
table.home_menu td.name { width: 50%; line-height: 12pt; }
table.home_menu td.name a { text-decoration: none; }
table.home_menu td.name a span { display: block; padding-bottom: 8px; font-size: 10pt; font-weight: bold }

/* Table used for statistics */
table.stats { width: 100%; font-size: 7pt; }
table.stats tr.stat { padding: 2px; height: 95px; vertical-align: bottom; text-align: center; background-color: #f1f1f1 }
table.stats tr.header { padding: 2px; text-align: center }
table.stats td.label { padding: 2px; text-align: right; width: 150px; }
table.stats tr.stat div { width: 15px; margin: auto }
table.stats tr.stat div img { width: 15px; float: left }

table.calendar tr.days td { width: 14%; font-weight: bold; text-align: center }

/* Boxes */
div.light_blue_box { background-color: #f0f4f9; padding: 10px }

div.rounded_light_blue_box {
	background-color: #f0f4f9;
	-moz-border-radius: 12px
}
div.rounded_dark_blue_box {
	background-color: #307fff;
	-moz-border-radius: 12px;
	color: #FFFFFF;
	border: 1px solid #0048bc;
}

div.rounded_light_blue_box .content, div.rounded_dark_blue_box .content2 { padding: 10px }

div.rounded_light_blue_box .title {
	color: #ff5f00;
	font-size: 10pt;
	font-weight: bold;
	margin-bottom: 10px;
}
div.rounded_dark_blue_box .title { color: #FFFFFF; font-size: 10pt; font-weight: bold; margin-bottom: 10px; }

/* Side box (i.e. login box on homepage */
div.side_box { padding: 4px;}
div.side_box div.head {
	color: #FFFFFF;
	font-weight: bold;
	font-size: 11pt;
	padding: 2px;
	font-family: Arial, Helvetica, sans-serif;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFFFFF;
	margin-bottom: 8px;
}
div.side_box div.content { padding: 2px }

/* Switchable tabs */
div.tab { border: 0px; cursor: pointer; float: left; margin-right: 2px; margin-top: 0px; background-image: url(../images/bargray.gif); position: relative; z-index: 2; border: 1px solid #307fff; }
div.tab_on { border: 0px; cursor: pointer; float: left; margin-right: 2px; margin-top: 0px; background-image: url(../images/barblue.gif); position: relative; z-index: 4; border: 1px solid #307fff; border-bottom: 0px }
div.tab a.tablink { float: left; display: block; font: Tahoma, Verdana, Arial, Helvetica, sans-serif; padding: 1px 10px 4px 10px; height: 17px; text-decoration: none }
div.tab_on a.tablink { float: left; display: block; padding: 1px 10px 4px 10px; font-weight: bold; height: 18px; color: white; text-decoration: none }

div.tabbox { display: none }
div.tabbox_on { border: 1px solid #307fff; padding: 12px; margin-top: -2px; z-index: 3; position: relative }
div.tabline { border-top: 1px solid #307fff; height: 1px; line-height: 0pt; font-size: 0px; margin-top: -2px; z-index: 3; position: relative }

/* Basic container with title (used all over) */
div.container .name { float: left; line-height: 16px; font-weight: bold; margin-bottom: 4px }
div.container .right_name { float: right; line-height: 16px }
div.container .content { clear: left; border: 1px solid #307fff; padding: 2px; background-color: #FFFFFF }

/* Popup content with shadow (for calendar, etc.) */
div.shadow { position: absolute; visibility: hidden; z-index: 101; background: url(../images/shadow.png) no-repeat bottom right; margin: 10px 0 0 10px; width: 200px }
div.shadow div.content { position: relative; background-color: #FFFFFF; border: 1px solid #307fff; margin: -6px 6px 6px -6px; padding: 8px; }

.leftbox { float: left; margin-right: 20px }
.rightbox { float: left }

/* Horizontal lines */
div.text_line { font-weight: bold; padding-bottom: 2px; border-bottom: 1px solid #307fff; margin-bottom: 15px; height: auto }
hr { border: 0px; height: 1px; line-height: 0pt; color: #307fff; background-color: #307fff }

/* Spacers */
div.smallspace { height: 5px; line-height: 0pt; }
div.medspace { height: 10px; line-height: 0pt; }
div.bigspace { height: 15px; line-height: 0pt; }

/* Buttons for div dropdown boxes */
div.menu_button { width: 150px; float: left; margin-right: 5px; margin-bottom: 5px; position: relative; }

div.button { border: 1px solid #307fff; padding: 1px; width: 200px }
div.button a, div.button a:visited { display: block; background: url(../images/navdown.gif) 3px 0px no-repeat; background-color: #FFFFFF; height: 18px; line-height: 18px; padding-left: 22px; vertical-align: middle; margin: 0px; text-decoration: none; }

div.button a:hover { background-color: #f0f4f9; text-decoration: none; }

div.drop_box { width: 300px }
div.drop_box table { margin-top: -1px; }

/* Holly hack for IE (which doesn't display CSS properly) \*/
* html div { height: 1%; }
/* End hide from IE5-mac */
