/***********************************************/
/* WHURL INTERACTIVE 2008          */
/* stylesheet_promo.css             */
/***********************************************/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, ul, ol, li, form, fieldset, img {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
}
body {
  /*background-color: #353c48;*/
  background-color:#000000;
  color: #2d2e2e;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 95%;
  line-height: 1.2em;
  margin-bottom:20px; /*add the bottom margin to cope with IE nonesense*/
  text-align:center; /*to center outerWrapper in IE5*/
}
h1, h2, h3, h4, h5, h6 {
  color: #69c;
  line-height: 1.2em;
}
h1 {
  font-size: 240%;
}
h2 {
  font-size: 150%;
}
h3 {
  font-size: 120%;
}
h4 {
  font-size: 100%;
}
p {
  font-size: 100%;
  line-height: 1.2em;
}
/* Sets the style for unvisited links. */
a,  a:link {
  /*color: #4095df;*/
  color: #03B5E9;
  /*color: #99BFCC;*/
  
  text-decoration: none;
}
/* Sets the style for visited links. */
a:visited {
  /*color: #4095df;*/
  color: #03B5E9;
  /*color: #99BFCC;*/
  text-decoration: none;
}
/* Sets the style for links on mouseover. */
a:hover {
  color: #2170bd;
  text-decoration: underline;
}
/* Sets the style for a link that has focus. */
a:focus {
  color: #2170bd;
}
/* Sets the style for a link that is being activated/clicked. */
a:active {
  color: #039;
}

/* p7wrapper used only by p7 script for IE6 min-width */
/* To prevent recursive resizing (browser freezes) do not attempt to apply the behavior to a single div (or page element) if the design contains other elements outside of this div that affect the page width, or to an element whose border, width, padding or margin styles are set in ems or percentages. */
#p7Wrapper {

}
#wrapper {
  /*background-color: #fff;*/
  margin: 0 auto 0 auto;
  /*min-width: 760px;*/
  text-align: left; /* Redefines the text alignment defined by the body element. */
  width: 760px;
  /*width: 80%;*/
  border:solid 2px #FFFFFF;
}

/*-------- HEADER STYLES --------*/

#header {
  background-color: #9bb6d2;
  color: #FFFFFF;
  padding: 10px 10px 10px 10px;
}
#header h1 {
  font-size:220%;
}
#header h1, #header h2, #header h3 {
  color:#FFFFFF;
}
#header h1 {
  float:left;
}
#header img {
  float:left;
  margin-right: 10px;
}

/*-------- SKIP NAVIGATION MENU STYLES --------*/
#skipNav {
  background-color:#000000;
  text-align:right;
  font-size: .8em;
  font-weight: bold;
}

a.skipLink, a.skipLink:visited, a.skipLink:hover {
  text-decoration: none;
  color: #000000;
  /*display: inline;*/
  padding: 0;
  margin: 0;
  /*border: 1px solid #353c48;*/
  cursor: default;
}
a.skipLink:active, a.skipLink:focus {
  background-color: #FFFFFF;
}

/*-------- GLOBAL NAVIGATION MENU STYLES --------*/

#globalNav {
  padding-left: 0;
  margin-left: 0;
  background-color: #036;
  color: White;
  float: left;
  width: 100%;
  font-size: 85%;
  font-weight: bold;
}
#globalNav ul{
  border: 0;
  margin: 0;
  padding: 0;
  list-style-type: none;
  text-align: center;
  white-space: nowrap;
  width:100%;
}
#globalNav ul li{
  display: inline;
}
#globalNav ul li a{
  padding: 0.2em 1em;
  background-color: #036;
  color: White;
  text-decoration: none;
  float: left;
  border-right: 1px solid #fff;
}
#globalNav ul li a:hover, #globalNav ul li a:focus, #globalNav ul li a:active{
  background-color: #369;
  color:#FFF;
}

/*-------- MAIN CONTENT STYLES --------*/

#columnWrapper {
  
}
#imagePanel{
  background-color: #9bb6d2;
  background-image:url(../images/image_panel.jpg);
  width:100%;
  height: 160px;
  margin: 0;
  padding: 0;
  display:block;
}
#imagePanelFixed{
  background-color: #9bb6d2;
  background-image:url(../images/sxc_583998_med.jpg);
  background-position:center;
  background-repeat:no-repeat;
  width:100%;
  height: 297px;
  margin: 0;
  padding: 0;
  display:block;
  text-align:center;
}
#contentWrapper {
  width: 100%;
  float:left;
  margin-right: -220px;
}
#content {
  /*margin: 0 26% 0 0;*/
  background-color:#FFFFFF;
  margin-right: 220px;
  /*padding: 10px 20px 10px 20px;*/
  padding: 10px 20px 10px 20px;
}
#content h1 {
  color: #69c;
  line-height: 1.2em;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
}
#content h2, #content h3, #content h4, #content h5, #content h6 {
  color: #69c;
  line-height: 1.2em;
  /*margin-top: 1em;
  margin-bottom: 0.5em;*/
  padding-top: 0em;
  padding-bottom: 1em;
}
#content p, #content ul, #content ol, #content li, #content blockquote {
  padding: 0 0 0.8em 0;
  border: 0;
}
#content ul{
  width: 80%;
  text-align: left;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  list-style-type:square;
}
#content ol{
  width: 80%;
  text-align: left;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
}

#content .imageLeft {
  float:left;
  margin: 0em 1em 1em 0;
  /*margin-right: 1em;
  margin-bottom: 1em;*/
}
#content .imageRight {
  float:right;
  margin-left: 10px;
}
#content .box {
  /*border: 2px solid #eaeff5;*/
  border: 2px solid #9bb6d2;
  /*border: 2px solid #69c;*/
  margin-bottom: 1em;
  padding:1em;
  /*width:99%*/;
}
#content .textBarBox {
  border: 2px solid #9bb6d2;
  margin-top: -1em;
  margin-bottom: 1em;
  padding:1em;
}
#content .textBarBox strong{
  color: #69c;
}
#content .box cite {
  color: #69c;
}
#content form{
  background-color:#99BFCC;
  width:auto;
  margin: 0 auto 1em auto;
  padding: 0.5em;
  color:#FFFFFF;
}
#content form div{
  display:block;
  margin-bottom: 0.5em;
  white-space: nowrap;
}
#content form .button{
  width:20%;
}
#content form label{
  float:left;
  width:30%;
  display: block;
  text-align:right;
  margin-right:1em;
  min-height: 1em; /* avoids empty label not being displayed (for input position) in Firefox */
}
#content form input, #content form textarea{
  width:50%;
}
#guaranteeBox {
  font-weight:bold;
  border: 1px solid #9bb6d2;
  text-align:center;
  width:99%;
  margin:1em 0;
}
#guaranteeBox img{
  display:inline;
  float:right;
}

/*-------- SIDE BAR STYLES --------*/

#sideBar {
  background-color: #eaeff5;
  /*background-color: #99BFCC;*/
  
  /*border-left: solid 1px #9bb6d2;*/
  float: right;
  padding: 10px;
  width: 200px;
}
#sideBar form {
  /*width: 180px;*/
  padding: 5px;
  background-color: #9bb6d2;
  color:#FFFFFF;
  margin-bottom: 10px;
}
#sideBar form .button{
  width:auto;
}
#sideBar form label{
  display: block;
  float: left;
  width: 50px;
  text-align: right;
  margin: 8px 0 0 0;
  white-space: nowrap;
  font-weight:bold;
  /*background:#FF0000;*/
}
#sideBar form input{
  display:block;
  float:right;
  margin:0;
  margin: 5px 0 0 0;
  padding: 0;
  width:130px;
  /*width:auto;*/
}
#sideBar form fieldset label:first-letter {
  text-decoration:underline;
}
#sideBar form br {
  clear:both;
}
#sideBar form h3 {
  color:#FFFFFF;
  text-align:center;
}
#sideBar .ctaBox {
  display:block;
  background-color:#FFFFFF;
  background-position:center;
  background-repeat:no-repeat;
  width:200px;
  height:80px;
  margin-bottom:10px;
}
.imageMFAA{
  background-image:url(../images/logo_mfaa.gif);
}
.imagePlan{
  background-image:url(../images/logo_plan.gif);
}
.imageCtaContact{
  background-image:url(../images/cta_contact.jpg);
}

/*-------- NOTEBOX STYLES --------*/
.noteBoxFixed {
  background-image:url(../images/note_yellow.gif);
  /* Actual image size is 200x163 */
  width: 180px;
  height: 113px;
  padding: 30px 10px 20px 10px;
}
.noteBoxStretchTop, .noteBoxStretchMid, .noteBoxStretchBot{
  font-style:italic;
  padding: 0 10px 0 10px;
  width: 180px; /*width must be declared to fix IE6 italics bug*/
  overflow:hidden;
  color:#036;
}
.noteBoxStretchTop {
  background-image:url(../images/note_brightyellow_top.gif);
  height: 40px;
  /*margin-top: 20px;*/
}
.noteBoxStretchMid {
  background-image:url(../images/note_brightyellow_mid.gif);
  background-repeat:repeat-y;
}
.noteBoxStretchBot {
  background-image:url(../images/note_brightyellow_bot.gif);
  height: 40px;
  text-align: right;
  margin-bottom: 10px;
}
/*-------- FOOTER STYLES --------*/
#footer {
  /*background-color: #eaeff5;*/
  /*background-color: #8E9681;*/
  /*background-color: #A1AC9C;*/
  background-color: #99BFCC;
  padding: 5px 5px 5px 20px;
  font-size: 75%;
  text-align:left;
  clear:both;
}
#footer a,  #footer a:link{
  color:#000000;
  font-weight:normal;
}
#footer img {
  float:right;
  margin-left: 30px;
}
#credit {
  text-align:left;
  /*border:solid 2px #FFFFFF;*/
  width:100%;
  margin:0px;
  padding:0px;
}
.contactLeftCol{
  float:left;
  width:auto;
  padding-right: 1em;
}
.contactRightCol{
  float:left;
  width:auto;
}
.clearFloat {
  clear: both;
  display: block;
  /*background-color:#0000FF;*/
}
.center {
  text-align:center;
}
.right {
  text-align:right;
}
.underline {
  text-decoration:underline;
}
.red {
  color:#FF0000;
}
.black {
  color:#000000;
}
.headingColor {
  color: #69c;
}
.highlight {
  background-color:#FFFF00;
}
.textBar {
  background-color:#99BFCC;
  font-size: 100%;
  font-weight:bold;
  color:#FFFFFF;
  padding: 0.2em 0.5em 0.2em 0.5em;
  margin: 1em 0 1em 0;
}
.p7EqualColsLastElement{
  margin:0;
  padding:0;
  /*background-color:#FF0000;*/
}
.noHeight{
  height:0px;
}