/******************/
/*  MAIN SECTION  */
/******************/


/* MAIN NAVIGATION */
.nav3-grid {width:199px; border-bottom:solid 1px rgb(200,200,200);}
.nav3-grid dt a, .nav3-grid dt a:visited {display:block; min-height:2em; height:auto !important; height:2.0em /*IE6*/; line-height:2em; padding:0px 10px 0px 15px;  border-top: solid 1px rgb(200,200,200); text-decoration:none; color:rgb(70,122,167); font-weight:bold; font-size:110%;}
.nav3-grid dd a, .nav3-grid dd a:visited {display:block; min-height:1.7em /*Non-IE6*/; height:auto !important; height:1.7em /*IE6*/; line-height:1.7em; padding:0px 10px 0px 40px; border:none; font-weight:normal; text-decoration:none; color:rgb(70,122,167); font-size:110%;}
.nav3-grid dt a:hover, .nav3-grid dd a:hover {background-color:rgb(225,225,225); color:rgb(42,90,138); text-decoration:none;}

.nav3-bullet {width:170px; margin:10px 0 0 20px;}
.nav3-bullet dt a, .nav3-bullet dt a:visited {line-height:2.0em; padding:0 0 0 10px; background:url(../images/bg_bullet_full_1.gif) no-repeat 0px 50%; text-decoration:none; color:rgb(70,122,167); font-weight:bold; font-size:120%;}
.nav3-bullet dd a, .nav3-bullet dd a:visited {line-height:1.7em; margin:0 0 0 15px; padding:0 0 0 10px; background:url(../images/bg_bullet_half_1.gif) no-repeat 0px 50%; text-decoration:none; color:rgb(70,122,167); font-weight:normal; font-size:120%;}
.nav3-bullet dt a:hover {background:url(../images/bg_bullet_full_2.gif) no-repeat 0px 50%; text-decoration:underline; color:rgb(42,90,138);}
.nav3-bullet dd a:hover {background:url(../images/bg_bullet_half_2.gif) no-repeat 0px 50%; text-decoration:underline; color:rgb(42,90,138);}

.nav3-nobullet {width:170px; margin:10px 0 0 20px;}
.nav3-nobullet dt a, .nav3-nobullet dt a:visited {line-height:2.0em; text-decoration:none; color:rgb(70,122,167); font-weight:bold; font-size:120%;}
.nav3-nobullet dd a, .nav3-nobullet dd a:visited {line-height:1.7em; margin:0 0 0 15px; text-decoration:none; color:rgb(70,122,167); font-weight:normal; font-size:120%;}
.nav3-nobullet dt a:hover, .nav3-nobullet dd a:hover {text-decoration:underline; color:rgb(42,90,138);}


.main-navigation h1.first {clear:both; margin:0px; padding:4px 20px 3px 15px; background-color:rgb(190,190,190); font-family:"trebuchet ms",arial,sans-serif; color:rgb(255,255,255); font-weight:bold; font-size:150%;}
.main-navigation h1 {clear:both; margin:30px 0 20px 0; padding:4px 20px 3px 20px; background:rgb(190,190,190); font-family:"trebuchet ms",arial,sans-serif; color:rgb(255,255,255); font-weight:bold; font-size:150%;}
.main-navigation h2 {clear:both; margin:20px 10px 10px 20px; font-family:"trebuchet ms",arial,sans-serif; color:rgb(100,100,100); font-weight:bold; font-size:150%;}
.main-navigation h3 {clear:both; margin:10px 10px 5px 20px; color:rgb(80,80,80); font-weight:bold; font-size:110%;} /* Note: h2 not existent, to make identical to formats for main-navigation for easier exchange */
.main-navigation p {clear:both; margin:0 10px 10px 20px; color:rgb(80,80,80); line-height:1.3em; font-size:110%;}
.main-navigation p.center {text-align:center;}
.main-navigation p.right {text-align:right;}

.main-navigation ul {list-style:none; margin:0.5em 10px 1.0em 20px;}
.main-navigation ul li {margin:5px 0 0.2em 2px; padding:0px 0px 0 11px; background:url(../images/bg_bullet_full_1.gif) no-repeat 0 0.5em; line-height:1.2em; font-size:110%;}
.main-navigation ol {margin:0.5em 10px 1.0em 40px !important /*Non-IE6*/; margin:0.5em 10px 1.0em 45px /*IE6*/;}
.main-navigation ol li {list-style-position:outside; margin:0 0 0.4em 0; font-size:110%;}

/* MAIN CONTENT */
.main-content h1.pagetitle {margin:0 0 0.4em 0; padding:0 0 2px 0; font-family:"trebuchet ms",arial,sans-serif; color:#2a3b58; font-weight:bold; font-size:220%;}
.main-content h1.block {clear:both; margin:1.0em 0 0em 0; padding:2px 0 2px 2px; background:rgb(190,190,190); font-family:"trebuchet ms",arial,sans-serif; color:rgb(255,255,255); font-weight:bold; font-size:220%;}
.main-content h1 {clear:both; margin:0 0 0.5em 0; font-family:"trebuchet ms",arial,sans-serif; color:rgb(80,80,80); font-weight:normal; font-size:210%;}
.main-content h2 {
	clear:both;
	font-family:"trebuchet ms",arial,sans-serif;
	color:#5355A2;
	font-weight:normal;
	font-size:170%;
	margin-top: 1em;
	margin-right: 0;
	margin-bottom: 0.5em;
	margin-left: 0;
}
.main-content h3 {clear:both; margin:-1.0em 0 0.5em 0; font-family:"trebuchet ms",arial,sans-serif; color:rgb(125,125,125); font-weight:normal; font-size:130%;}
.main-content h1.side {clear:none;}
.main-content h2.side {clear:none;}
.main-content h3.side {clear:none;}

.main-content h4 {margin:1.5em 0 1.0em 0; color:rgb(80,80,80); font-family:"trebuchet ms",arial,sans-serif; font-weight:normal; font-size:170%;}
.main-content h5 {margin:1.5em 0 1.0em 0; color:rgb(80,80,80); font-family:"trebuchet ms",arial,sans-serif; font-size:140%;}
.main-content h6 {margin:1.5em 0 1.0em 0; color:rgb(80,80,80); font-family:"trebuchet ms",verdana,arial,sans-serif; font-weight:normal; font-size:140%;}
.main-content p {margin:0 0 1.0em 0; line-height:1.5em; font-size:120%;}
.main-content p.center {text-align:center;}
.main-content p.right {text-align:right;}
.main-content p.details {clear:both; margin:-0.25em 0 1.0em 0; line-height:1.0em; font-size:110%;}
.main-content blockquote {clear:both; margin:0 30px 0.6em 30px; font-size:90%;}

.main-content table {clear:both; width:600px; margin:2.0em 0 0.2em 20px; table-layout: fixed; border-collapse:collapse; empty-cells:show; background-color:rgb(233,232,244);}
.main-content table th.top {height:3.5em; padding:0 7px 0 7px; empty-cells:show; background-color:rgb(175,175,175); text-align:left; color:rgb(255,255,255); font-weight:bold; font-size:110%;}
.main-content table th {height:3.0em; padding:2px 20px 2px 7px; border-left:solid 2px rgb(255,255,255); border-right:solid 2px rgb(255,255,255); border-top:solid 2px rgb(255,255,255); border-bottom:solid 2px rgb(255,255,255); background-color:rgb(225,225,225); text-align:left; color:rgb(80,80,80); font-weight:bold; font-size:110%;}
.main-content table td {height:3.0em; padding:2px 7px 2px 7px; border-left:solid 2px rgb(255,255,255); border-right:solid 2px rgb(255,255,255); border-top:solid 2px rgb(255,255,255); border-bottom:solid 2px rgb(255,255,255); background-color:rgb(225,225,225); text-align:left; font-weight:normal; color:rgb(80,80,80); font-size:110%;}
p.caption {clear:both; margin:0.5em 0 2.0em 20px; text-align:left; color:rgb(80,80,80); font-size:110%;}

.main-content ul {list-style:none; margin:0.5em 0 1.0em 0;}
.main-content ul li {margin:0 0 0.2em 2px; padding:0 0 0 12px; background:url(../images/bg_bullet_full_1.gif) no-repeat 0 0.4em; line-height:1.4em; font-size:120%;}
.main-content ol {margin:0.5em 0 1.0em 20px !important /*Non-IE6*/; margin:0.5em 0 1.0em 25px /*IE6*/;}
.main-content ol li {list-style-position:outside; margin:0 0 0.2em 0; line-height:1.4em; font-size:120%;}



.contactform {
	width:450px;
	margin:2.0em 0 0 0;
	padding:10px 10px 0 10px;
}
.contactform fieldset {padding:20px 0 0 0 !important /*Non-IE6*/; padding:0 /*IE6*/; margin:0 0 20px 0; }
.contactform fieldset legend {margin:0 0 10px 5px !important /*Non-IE*/; margin:0 0 20px 5px /*IE6*/; padding:0 2px 0 2px; color:rgb(80,80,80); font-weight:bold; font-size:130%;}
.contactform label.left {float:left; width:100px; margin:0 0 0 10px; padding:2px; font-size:110%;}
.contactform select.combo {width:175px; padding:2px; border:solid 1px rgb(200,200,200); font-family:verdana,arial,sans-serif; font-size:110%;}
.contactform input.field {width:275px; padding:2px; border:solid 1px rgb(200,200,200); font-family:verdana,arial,sans-serif; font-size:110%;}
.contactform textarea {width:275px; padding:2px; border:solid 1px rgb(200,200,200); font-family:verdana,arial,sans-serif; font-size:110%;}
.contactform input.button {float:right; width:9.0em; margin-right:20px; padding:1px !important /*Non-IE6*/; padding:0 /*IE6*/; background:rgb(230,230,230); border:solid 1px rgb(150,150,150); text-align:center; font-family:verdana,arial,sans-serif; color:rgb(150,150,150); font-size:110%;}
.contactform input.button:hover {cursor: pointer; border:solid 1px rgb(80,80,80); background:rgb(220,220,220); color:rgb(80,80,80);}

/********************/
/*  COMMON CLASSES  */
/********************/


.main a {color:rgb(70,122,167); font-weight:bold; text-decoration:none;}
.main-content h1 a {color:rgb(70,122,167); font-weight:normal; text-decoration:none;}
.main a:hover {color:rgb(42,90,138); text-decoration:underline;}
.main a:visited {color:rgb(42,90,138);}


.buildContainer{
	position: relative;
	height: 800px;
}
#tankerImage{
	position: absolute;
	left: 247px;
	top: 196px;
	width: 356px;
	height: 356px;
	background-image: url(../images/alpha-tanker-main.gif);
}
#delivery-type {
	position: absolute;
	left: 10px;
	top: 10px;
}
#delivery-intake {
	position: absolute;
	left: 30px;
	top: 237px;
}


#product-conveyed{
	position: absolute;
	left: 10px;
	top: 71px;
}
#product-details-title {
	position: absolute;
	left: 10px;
	top: 51px;
	font-size: 16px;
	font-weight: bold;
}
#hose-details-title {
	font-size: 16px;
	position: absolute;
	top: 141px;
	left: 10px;
	font-weight: bold;
}



#product-temp{
	position: absolute;
	left: 280px;
	top: 71px;
}
#working-pressure{
	position: absolute;
	left: 10px;
	top: 104px;
}
#test-pressure{
	position: absolute;
	left: 158px;
	top: 104px;
}
#hose-manufacturer{
	position: absolute;
	left: 334px;
	top: 167px;
}
#hose-working-pressure{
	position: absolute;
	left: 161px;
	top: 167px;
}
#min-burst-pressure{
	position: absolute;
	left: 10px;
	top: 167px;
}
#flexible-hose{
	position: absolute;
	left: 36px;
	top: 297px;
}
#terminal-pipework{
	position: absolute;
	left: 8px;
	top: 376px;
}
#flange-type{
	position: absolute;
	left: 52px;
	top: 336px;
}
#additional-details{
	position: absolute;
	left: 290px;
	top: 551px;
	height: 150px;
	width: 285px;
}
.resultsDiv{
	position: absolute;
	left: 10px;
	top: 413px;
	width: 220px;
}
.resultsDiv img{
	border:1px solid #003300;
	padding:2px;
	margin:3px;
}
.buildContainer input.digit-input {
	width:30px;
	font-size: 10px;
}
.buildContainer input.digit-input-text {
	width:90px;
	font-size: 10px;
}


.contactdetails {
	width:450px;
	margin:0;
	padding:0;
}
.contactdetails fieldset{padding:20px 0 0 0 !important /*Non-IE6*/; padding:0 /*IE6*/; margin:0 0 20px 0; }
.contactdetails fieldset legend {margin:0 0 10px 5px !important /*Non-IE*/; margin:0 0 20px 5px /*IE6*/; padding:0 2px 0 2px; color:rgb(80,80,80); font-weight:bold; font-size:130%;}
.contactdetails label.left, .buildContainer label.left {
	float:left;
	width:120px;
	margin:0 0 0 10px;
	padding:2px;
	font-size:110%;
}
.contactdetails select.combo, .buildContainer select.combo {width:175px; padding:2px; border:solid 1px rgb(200,200,200); font-family:verdana,arial,sans-serif; font-size:110%;}
.contactdetails input.field, .buildContainer input.fields {width:275px; padding:2px; border:solid 1px rgb(200,200,200); font-family:verdana,arial,sans-serif; font-size:110%;}
.contactdetails textarea, .buildContainer textarea {
	width:275px;
	height:120px;
	padding:2px;
	border:solid 1px rgb(200,200,200);
	font-family:verdana,arial,sans-serif;
	font-size:110%;
}
.contactdetails input.button, .buildContainer input.button {float:right; width:9.0em; margin-right:20px; padding:1px !important /*Non-IE6*/; padding:0 /*IE6*/; background:rgb(230,230,230); border:solid 1px rgb(150,150,150); text-align:center; font-family:verdana,arial,sans-serif; color:rgb(150,150,150); font-size:110%;}
.contactdetails input.button:hover, .buildContainer input.button:hover {cursor: pointer; border:solid 1px rgb(80,80,80); background:rgb(220,220,220); color:rgb(80,80,80);}


#typecontainer{
	width:500px;
	margin-left:auto;
	margin-right:auto;
}
.type{
	margin-right:10px;
	margin-bottom:15px;
	float:left;
	text-align:center;
}
.success {
	background-color: #CDE855;
    border: 1px solid #A7C520;
}

.error {
	background-color: #FEB19A;
    border: 1px solid #A62409;
}
.error li {
	list-style:square;
}
.error h2 {
	color: #000000;
	font-size:18px;
	margin-left:5px;
}
