/*
    Digital Maelstrom LLC
    (c) 2009. All rights reserved.
    Author: Jeff Hall../images
*/

/* --- Tags --- */
html {
    padding: 0;
    margin: 0;
}

body {
    padding: 0px;
    margin: 0px;
    background-color: #f2f2f2;
    font-family: verdana, "Lucida Grande", arial, helvetica, sans-serif;
    font-size:  76%;  /* Sane-font sizing */
}

p, ul, span {
  font-size: 1.4em;
}

h1, h2, h3, h4 {
  font-family: sans-serif;
}

h2 {
  font-size: 1.875em;
  margin: 0.5em 0px 0.5em 0px;
}

h3 {
  font-size: 1.7em;
  margin: 0.5em 0px 0.5em 0px;
}

h4 {
  font-size: 1.5em;
  margin: 0.5em 0px 0.5em 0px;
}

ul {
  list-style-type: none;
}

dl {
	margin: 0px;
	overflow-y: auto;
}

dt {
	font-weight: bold;
}

dd {
	margin-left: 30px;
}

/* Specific containers */
div#frame {
    background-color: white;
    position: relative;
    padding-left: 50px;
    padding-right: 50px;
    padding-top: 64px;
    padding-bottom: 70px;
    margin: 0px;
    background-image: url('../images/background-24.png');
    background-repeat: no-repeat;
    width: 970px;
    min-height: 900px;
}

/* --- Header --- */
div#header {
    position: absolute;
    left: 55px;
    top: -10px;
    width: 970px;
    height: 110px;
    background-image: url('../images/logo-24.png');
    background-repeat: no-repeat;
}

div#header h1 {
    display: none;
}

div#header ul.nav {
    position: absolute;
    top:  40px;
    right: 0px;
}

/* --- Main Window --- */
div#main {
    top: 40px;
    position: relative;
    
}

div#main li:before {
      content: "\00BB \0020";
}

.reduced {
  font-size: 1.0em;
}

/* --- Main Content: Services --- */
.sidebox {
  color: white;
  min-width: 230px;
  background-repeat: no-repeat;
  padding-bottom: 5px;
  
  font-size: 1.1em;  
}

.sidebox.purple {
    background-image: url('../images/purple-box.png');
}

.sidebox.green {
    background-image: url('../images/green-box.png');
}

.sidebox.orange {
    background-image: url('../images/orange-box.png');
}

.sidebox.blue {
    background-image: url('../images/blue-box.png');
}

div.side {
    width: 35%;
    float: right;
    clear: right;
    height: 540px;
    border-left: 1px solid black;
    
    padding-left: 1em;
    margin-top: 1em;
    margin-left: 1em;
    margin-right: 1em;
    margin-bottom: 5em;
}

div#main div.content {
    min-height: 600px;
}

div.content ul {
    margin: 0px;
}

div.side ul {
    list-style-type: none;
    margin: 1em 0px 1em 0px;
    padding-top:  20px;
    padding-left: 20px;
    padding-bottom: 10px;
}

div.content ul:before {
    content: attr(title);
    color: white;
    font-size: 1.15em;
    font-weight: bold;
    text-decoration: underline;
}


/* --- Right Column --- */
div#sidepanel {
    position: absolute;
    width: 309px;
    right: 40px;
    top: 105px;
    min-height: 700px;
}

div#sidepanel .container {
    font-size: 0.9em;
    margin-bottom: 20px;
}

div#sidepanel ul {
  padding-left: 5px;
}

div#sidepanel li:before {
      content: "\00BB \0020";
}

div#friendconnect {
    width: 270px;
    border: 4px solid #e2e5fe;
    position: relative;
    left: 17px;
}

ul#badges {
    list-style-type: none;
    right: 55px;
    bottom: 60px;
    position: absolute;
}

ul#badges li {
    display: inline;
}

ul#badges li a {
    width: 48px;
    height: 36px;
}

/* --- Footer --- */
div#footer {
    width: 970px;
    height: 122px;
    right: 0px;
    bottom: 0px;
    position: absolute;
    margin: 0px;
    padding: 0px;
    background-position: right bottom;
    background-image: url('../images/bottom-24.png');
    background-repeat: no-repeat;
}

div#footer #copyright {
  	font-size: 1.0em;
    position: absolute;
    bottom: 10px;
    left: 60px;
}

div#footer ul.nav {
    position: absolute;
    bottom: 10px;
    right: 20px;
}
/* --- General --- */
ul.nav {
    list-style-type: none;
    margin-top: 20px;
}

ul.nav li {
    display: inline;
    margin-left: 4px;
    margin-right: 4px;
}

ul.nav li[selected=true] {
  background-image: url('../images/triangle-24.png');
  background-repeat: no-repeat;
  padding-top:  44px;
  background-position: top center;
}

ul#nav-bottom, ul#nav-bottom span {
	font-size: 1.0em;
}

ul#nav-bottom li a {
	text-decoration: none;
}

/* Remove blue border from hyperlink images */
ul li a img {
    border: none;
    display: inline;
}

/* --- Containers --- */
.container.narrow .content {
	font-size: 0.9em;
}
/* --- Form elements --- */
.subnote {
  font-size: small;
}
fieldset {
  border: none;
}

.required { 
  color: blue;
}

#sales-form input[type=text],textarea {
  width: 100%;
}

form textarea {
  height: 14em;
}

.errorExplanation {
  border: 2px solid red;
  background-color: #ffeeee;
  width: 515px;
  padding: 2px 6px 4px 6px;
  font-size: small;
}

.errorExplanation li {
	font-size: 0.75em;
}

.errorExplanation p {
	margin-top: 4px;
	margin-bottom: 4px;
	font-size: 1em;
}

.errorExplanation h2 {
  font-size: 1em;
}

.fieldWithErrors input, .fieldWithErrors textarea
{
  border-color: red;
}

.fieldWithErrors select
{
  border-color: red;
}

form label {
	font-weight: bold;
}

form div.form {
	diplay: table;
	height: 160px;
}

form div.cell {
	float: left;
	display: table-cell;
	width: 300px;
	margin-top: 3px;
	margin-bottom: 3px;
	position: relative;
	height: 30px;
}

form div.cell label {
	position: absolute;
	right: 190px;
	top: 4px;
}

form div.cell input,
form div.cell select {
	position: absolute;
	right: 0px;
	width: 175px;
	clear:both;
}



#form-middle {
}


#form-bottom {
}