/* CSS Document */
html {
	padding: 0;
	margin: 0;
	background-color: #090018;
	border-top: 1px solid #f3007e;
}

body {
	margin: 0;
	padding: 0;
	color: #fff;
	font: 15px/1.5 "Myriad Pro", "Myriad Web", Myriad, Arial, Helvetica, Sans-serif;
	border-top: 1px solid #c3004e;
	background: #090018 url(/sup/img/css/sky.jpg) top no-repeat;
}

p {
	margin: 1em 0;
}

a {
	text-decoration: none;
	color: #ff9;
}
a:hover {
	text-decoration: underline;
	color: #ff3;
}

a img {
	border: none;
}

h1, h2, h3, h4, h5, h6 {
	margin: 1em 0 .6em;
	padding: 0;
	line-height: 1;
}

h1, h2 {
	font-family: "Myriad Pro Black", "Myriad Pro", Myriad, Helvetica, "Lucida Sans Unicode", Arial, sans-serif;
	font-weight: normal;
}

h1 {
	font-size: 2.5em;
}

h2 {
	font-size: 2.2em;
	color: #e4ceff;
}

h3 {
	font-weight: normal;
	font-size: 1.8em;
	color: #ffc;
	letter-spacing: -0.03em;
	margin-bottom: -.25em;
}
.secondary h3 {
	font-size: 1.4em;
}
h3 sup {
	font-size: .5em;
}

h4 {
	margin: 0;
	color: #ff0083;
	font-size: 1.3em;
	font-weight: normal;
}


small {
	font-size: .9em;
}

big {
	font-size: 1.25em;
	line-height: 1.3;
}

ul {
	margin: 1em 0;
	padding: 0 1.25em;
}

 ul ul  {
	 margin: 0;
}

li {
	margin: 0 0 .4em;
}

li li {
	margin: 0;
}

acronym {
	cursor: help;
}

html>body #sky_stuff {
	background: url(/sup/img/css/sky_stuff.png) center no-repeat;
}

#container {
	background: url(/sup/img/css/horizon.gif) bottom no-repeat;
	position: relative;
	border-top: 6px solid #e9e9e9;
}
html>body #container {
	background-image: url(/sup/img/css/horizon.png);
}

#ie6_warning {
	background-color: #e9e9e9;
	margin: 0;
	padding: .1em 0;
	text-align: center;
	color: #333;
	font-weight: bold;
}

#ie6_warning a {
	color: #ff0083;
}

#navigation {
	width: 620px;
	margin: 0 auto;
}

#tagline {
	display: none;
}

#navigation ul, #navigation li {
	margin: 0;
	padding: 0;
	list-style: none;
}
#navigation ul li {
	float: left;
	line-height: 1;
	margin-left: 115px;
}
#navigation ul li.first {
	margin-left: 0;
}
#navigation ul li.last {
	float: right;
	margin-left: 0;
}

#navigation ul li a {
	display: block;
	line-height: 1;
	color: #666688;
	font-size: 1.5em;
	margin-top: 30px;
	padding-bottom: 12px;
	background-image:  url(/sup/img/css/vert_arrow.gif);
	background-repeat: no-repeat;
	background-position: 0 500px;
	outline: black;
}
#navigation ul li a:hover, #navigation ul li a.active {
	color: #fff;
	text-decoration: none;
	background-color: transparent;
}
#navigation ul li a.active {
	padding-top: 30px;
	margin-top: 0;
	background-position: 50% 0;
}

#sections {
	position: relative;
	clear: both;
	width: 620px;
	margin: 0 auto;
	padding: 25px 5px 0;
	border-top: 1px solid #4e496e;
}

.section {
	clear: both;
	overflow: hidden;
}

.section h2 {
	margin: 0;
	padding: .1em 0;
}

.primary {
	float: left;
	width: 56.5%;
	padding-bottom: 1em;
}

.secondary {
	float: right;
	width: 33%;
	padding-left: 5%;
	margin-bottom: 1.5em;
	border-left: 1px dotted #4e496e;
	font-size: .9em;
}

/* specific section items */
#logo {
	padding: 0;
	margin: 0 -15px;
}
#logo h1 {
	margin: 0;
	padding-left: 15px;
	font-size: 65px;
	line-height: .8;
}
#logo h1 span {
	display: block;
}
#logo h1 .black {
	font-size: 1.5em;
}
#logo h1 .fish {
	font-size: 2.5em;
}
#logo h1 .int {
	color: #f3007e;
}

#welcome .primary {
	padding-top: .75em;
	width: 54%;
}

#welcome .more {
	padding: 0 14px 2em 0;
}

#welcome .secondary {
	width: 38%;
	font-size: 16px;
	margin-top: 1em;
}

#welcome .secondary .intro {
	margin-top: 0;
}


#work {
	position: relative;
}

#work .item {
	width: 385px;
}

#work .primary {
	float: left;
	padding: 0;
	margin-bottom: 1em;
	width: 405px;
	overflow: hidden;
}

#work .primary h3 {
	margin-top: .5em;
}

#work .secondary {
	border-left: 1px dotted #4e496e;
	margin: 10px 0 0;
	padding: 1em 4% 0 4%;
	width: 26%;
}

#work #spotlight h3 {
	margin-top: 0;
}

#work #spotlight ul {
	list-style: none;
	padding: 0;
	margin: 1em 0;
}

#work #spotlight ul li {
	margin: 0;
	padding: 0;
}

#work #spotlight ul li .active {
	color: #fff;
	text-decoration: none;
	background-color: transparent;
}

#work #clients {
	padding-top: 1em;
	color: #ddd;
	font-size: .9em;
}

#work .link {
	margin: 1em 0 -.5em;
}

#work .link a {
	font-style: italic;
	font-size: 1.4em;
}

#work p {
	font-size: .9em;
}

#work .callout p {
	margin-top: .25em;
	font-size: 1.1em;
}

blockquote {
	clear: both;
	margin: 2em 0 4em;
	padding: 12px;
	border-top: 1px solid #5E597E;
	font-size: .9em;
	color: #dfdfff;
	text-align: center;
}
html>body blockquote {
	background: transparent url('/sup/img/css/gradient_fade.png');
}
#work blockquote {
	font-size: 1em;
}

blockquote p {
	margin: 0;
}
blockquote cite {
	font-size: 1.1em;
	display: block;
	padding-top: .3em;
}

#footer {
	clear: both;
	margin: 0 auto;
	width: 618px;
	color: #ccc;
	padding-top: 25px;
	height: 118px;
	line-height: 1.8;
}

#footer small {
	font-size: .8em;
	color: #777;
}

/* form elements */

.input {
	padding: .2em 0;
	clear: both;
}
.input label {
	float: left;
	width: 22%;
	text-align: right;
	padding: 3px 8px 0 0;
}

.input input, .input textarea {
	padding: 4px 5px;
	font: .9em/1.4 Verdana, Arial, Helvetica, sans-serif;
	margin: 0;
	background: #d3c6d3;
	color: #111;
	border: 1px solid #fff;
}

.input #name_input, .input #email_input, .input #comment_textarea {
	width: 240px;
}

.input #phone_input {
	width: 150px;
}

.input textarea {
	display: block;
	height: 8em;
}

.actions {
	clear: both;
	padding: .5em 0;
	overflow: hidden;
	text-align: right;
	padding-right: 13px;
}

.actions .submit {
	cursor: pointer;
}

.actions .wait {
	margin: 1px 5px 0 0;
	padding: .2em .5em .1em;
	float: right;
	color: #ddd;
	font-style: italic;
}
.error, .exception, .success, .info {
	margin: 1em 0;
	padding: .2em 1em;
	border-style: dotted;
	border-width: 1px;
	border-color: #fff;
	color: #fff;
}

.error, .validation_exception {
	background: #c33;
}
html>body .error, html>body .validation_exception {
	background: transparent url('/sup/img/css/red_fade.png');
}

.success {
	background: #4c7648;
}
html>body .success {
	background: transparent url('/sup/img/css/green_fade.png');
}

.error ul, .exception ul, .success ul, .info ul {
	margin: -.5em 0 1em 1.2em;
	padding: 0 .5em;
}
.error ul li, .exception ul li, .success ul li, .info ul li {
	margin-bottom: 0;
}

.more {
	font-size: 1.1em;
	text-align: right;
	margin: .5em 0 0 0;
}

.callout {
	border: 1px solid #000;
	color: #fff;
	margin: 1em 0;
	padding: 1em 15px;
	background: #103;
}

html>body .callout {
	background: transparent url('/sup/img/css/gradient_fade.png');
}

.end {
	clear: both;
}

/* tank styles */

#tank_header {
	text-align: center;
	margin: .5em 0 .2em;
}

#last_updated {
	text-align: right;
	float: left;
	width: 48%;
	font-size: 1.2em;
}

#total_amps {
	text-align: left;
	float: right;
	width: 48%;
	padding-left: 2.2%;
	border-left: 1px solid #4E496E;
	font-size: 1.2em;
}

#total_amps span, #last_updated span, .param_list dt {
	opacity: .7;
	font-size: .8em;
}

.param_list {
	float: left;
	width: 33.3%;
	padding-bottom: 2em;
}

.param_list h3 {
	font-size: 1.2em;
	text-align: center;
	margin: .5em 0 .5em;
}

.param_list dl {
	font-size: 1.25em;
}

.param_list dt {
	float: left;
	clear: left;
	width: 48%;
	padding: 0 12px 0 0;
	line-height: 2.2;
	margin: 0;
	text-align: right;
}
.param_list dd {
	float: left;
	width: 30%;
	padding: 0;
	margin: 0;
	text-align: left;
	font-size: 1.1em;
}

#da_link {
	clear: both;
	text-align: center;
	padding-bottom: 13em;
}

@media only screen and (max-width: 680px), handset {

}