body   { text-align: center; }

body,div,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {  
margin:0; 
padding:0; 
font-family: Arial, Arial, Helvetica, sans-serif;
} 
table { 
 
} 
img {  
 border:0; 
} 

a {
text-decoration:none;
} 
 
h1,h2,h3,h4,h5,h6, p { 
font-size:100.1%; 
font-weight:normal; 
} 


#wrapper   { width: 980px; margin: 15px auto; border: solid 1px #999  }

#header  { background-image: url("../images/Esso_logo.jpg"); background-repeat: no-repeat; text-align: left; display: block; position: relative; height: 68px }

#header_fr  { background-image: url("../images/Esso_logo_fr.jpg"); background-repeat: no-repeat; text-align: left; display: block; position: relative; height: 68px }

#header_fr h1, #header h1 { text-indent: -9999px; width: 300px; margin-left: -9999px; }

#navcontainer  { position: relative; height: 2.5em  }

#navcontainer ul
  { color: white; font-size: 0.95em; font-family: arial, helvetica, sans-serif; background-color: #c00; padding: 0px; margin: 0px; width: 100%; float: left }

#navcontainer ul li { display: inline; }

#navcontainer ul li a
 { color: white; text-decoration: none; background-color: #c00; padding: 0.3em 1em; float: left; border-right: 1px solid #fff }
 
 #navcontainer ul li#active a
 { color: white; text-decoration: none; background-color: #7f0000; padding: 0.3em 1em; float: left; border-right: 1px solid #fff }

#navcontainer ul li a:hover
 { color: #fff; background-color: #7f0000 }

#content, #content_2  { font-size: 0.9em; text-align: left; position: relative; }

#content  { margin-right: 100px; margin-left: 100px; }

#content_2  { width: 605px; float: left; padding-right: 100px; padding-left: 75px; display:inline: }

#content ol { margin-left: 20px; list-style-type: decimal; }

#content ol ol { margin-left: 40px; list-style-type: upper-alpha; }

#content ol li { margin-top: 9px; }

#content_2 ul { margin-top: 5px; padding-left: 45px; }

#content_2 li { padding-bottom: 9px; }

#content h2, #content_2 h2  { font-size: 1.3em; font-weight: bold; margin-top: 20px; margin-bottom: 20px ; border-bottom: 1px solid #c00; }

#content h2 sup, #content_2 h2 sup, sup {
font-size: .6em;
}

#content h3, #content_2 h3  { font-size: 1.2em; margin-top: 20px; margin-bottom: 20px ; }

#content h3  { font-size: 1.1em; font-weight: bolder; padding: 3px 0px; margin: 0px; }

#content h4, #content_2 h4 { font-size: 1.1em; font-weight: bold; }

#content h4 sup, #content_2 h4 sup {
font-size:.4em;
}


#content h5, #content_2 h5 { color: #343434; font-size: 1.2em; font-weight: bolder; }

#content p, #content_2 p { margin-top: 2px; margin-bottom: 3px; }

.content_image { position: relative; width: 600px; }

.content_image img { float: right; padding: 0px 0px 0px 7px; }

.content_image, .content_image_1 { position: relative; width: 600px; }

.content_image_1 { width: 290px; float: left }

.content_2 .content_image .content_image_1 ul  { margin: 0; padding: 0 }

.content_image h4 { float: left; }

h2 img { vertical-align: middle; }

img#bottomRight  { padding-top: 11px; padding-left: 30px; top: 0; right: 0; float: left }

img#topLeft {  }



#footer     { color: #fff; font-size: 0.8em; background-color: #6e6e6e; position: relative; padding: 5px 20px; height: 1.1em ; }

#footer p   { display: inline; float: left }

#footer p#footer_right  { display: inline; float: right }

#footer span   { float: right }

#footer a:link, #footer a:visited, #footer a:active { color: #fff; text-decoration: none; }

#footer a:hover  { color: #c00 }

.container_row   { margin: 50px auto; width: 440px; height: 115px }



#sub_nav .container  {   padding: 0; width: 180px;  margin: 50px 0 0 0;   }

#sub_nav .container p { font-size: 0.9em; }

#sub_nav .container p.container_top { background: url("../images/container_bg_small1.jpg") no-repeat left 0pt; padding:10px 20px 0 0;  }

#sub_nav .container p.container_btm { background: url("../images/container_bg_small1.jpg") no-repeat left 100%; padding:15px 0 15px 0; }

#sub_nav .container  a:link, #sub_nav .container a:visited  { color: #039 ; text-decoration: none; }

#sub_nav .container a { font-weight: bolder;  text-align: center; background-color:transparent; border:none; }

#sub_nav .container a:hover  { color: #c00; text-decoration: underline; background-color: transparent; background-image: none }

#content .container a { font-weight: bold; text-decoration: none }
#content .container p, .container p  {  }

.container ul  { text-align: left; margin-top: 5px; margin-left: 45px }
.container li  { list-style-type: disc }

/* Form Parts */
/* Form styles */

.form_container { font-size: 0.96em; text-align: left; margin: 3px 10px 0 11px; padding: 0 0 5px; }
.form_container h3 { font-size: 1em; padding-bottom: 1em; }

.form_container img { border-style: none; }

.form_container .input_width select { width: 125px; }

p.legend { margin-bottom: 1em; }
p.legend em { color: #C00; font-style: normal; }

.form_container form p { margin: 0; }
.form_container form p.note { margin-left: 170px; font-size: 90%; color: #333; }
#main_content2 .form_container form .hint { padding-left: 290px; color: #7a0c0c; font-size: 0.85em;  }


.form_container form fieldset { width: 400px; margin: 10px auto 0; padding: 10px; border: solid 1px #ddd; display: block; }
.form_container form legend { font-size: 0.96em; padding-bottom: 3px; font-weight: bold; color: #333; }
.form_container form fieldset div{ font-size: 0.9em; padding-top: 0.25em; padding-bottom: 0.25em;overflow:hidden; }
.form_container label, 
.form_container span.label { padding-right: 10px; width:180px; display: block; float: left; text-align: right; }

.form_container_results_1 span.label_6 { padding-right: 10px; width:120px; display: block; float: left; text-align: right; position: relative; }
.form_container_results_1 span.label_7 { padding-right: 10px; width:47%; display: block; float: left; text-align: right; position: relative; }
.form_container span {}
.form_container strong { }
.form_container span.label_1 { font-size: 0.9em; font-weight: bolder; padding-right: 5px; width:220px; display: block; float: left; text-align: right; position: relative; margin-top: 5px; }
.form_container label.error, 
.form_container span.error { color: #931818; text-align: left; margin-top: 2px; margin-bottom: 10px; margin-left: 190px; }
.form_container label em, 
.form_container span.label em { position: absolute; right: 0; font-size: 120%; font-style: normal; color: #C00; }
.form_container input{ font-size: 0.8em; }
.form_container select{ font-size: 0.8em; }
.form_container input.error { border: solid 1px #9b3535; }
.form_container input:focus,
.form_container input.error:focus, 
.form_container textarea:focus {	background-color: #FFC; border-color: #FC6; }
.form_container p.button_row { text-align: center; margin-top: 10px;  padding-bottom: 5px; }
.form_container form .hint, .hint { color: #7a0c0c; font-size: 1.1em; padding-right: 4px; }

/* */
.center { text-align: center;}

/* */
table#rebates { font-size: 1.1em; margin-top: 30px; margin-bottom: 40px; }

table#rebates thead td { color: #cc0000 ; font-size: 1.2em; font-weight: bold; text-align: center; padding-bottom: 5px; border-bottom: 1px solid #b0b0b0; }

table#rebates tbody td { font-weight: bold; text-align: center; padding-top: 3px; padding-bottom: 3px; border-bottom: 1px solid #b0b0b0; }

/* */
.small { font-size: 0.8em; }

/* */
#left { width: 200px; float: left ;  }

/* */
#sub_nav { margin-top: 20px; padding-left:20px; width: 180px; float:left; overflow:hidden;  }

#sub_nav h3 { font-size: 1em; font-weight: bold; text-align: left; margin: 0; padding: 0; }

#sub_nav ul#sub_navlist
{ font-size: 0.9em; padding-top: 5px; padding-bottom: 5px; padding: 0;  margin:0; list-style-type: none; }

#sub_nav ul#sub_navlist li { padding-left: 0; margin-left:0; }

#sub_nav #sub_navlist li.topItem { padding-top: 3px; }

#sub_nav #sub_navlist li.bottomItem { padding-bottom: 3px; }

#sub_nav a
{ display: block; padding: 2px 12px; width: 150px; background-color: #369; background-image: none;  border-bottom: 1px solid #eee; }

#sub_nav a:link, #sub_navlist a:visited
{
color: #EEE;
text-decoration: none;
}

#sub_nav a:hover
{ background-color: #036; color: #fff; background-image: url(../images/menu_off.jpg); background-repeat: no-repeat; background-position: left 0; }

#sub_nav #selected a { background-color: #036; background-image: url(../images/menu_off.jpg); background-repeat: no-repeat; background-position: left 0; }

/* */
.clear { clear: both; padding: 0pt; margin: 0pt}

/* */
#content_2 .row, #content_2 .row_2 { text-align: left; width: 280px; float: left; margin: 0; padding: 0; }

#content_2 .row ul, #content_2 .row_2 ul { width: 280px; margin: 0; padding: 0; }

#content_2 .row li, #content_2 .row_2 li { padding-left: 30px; list-style-type: none; }

#content_2 .row_2 { margin-left: 25px; }

#content_2 .row img, #content_2 .row_2 img { float: left; }

#content_2 .row li#number_1 { background: url("../images/Numbers_1.jpg") no-repeat left 50%; }

#content_2 .row li#number_2 { background: url("../images/Numbers_2.jpg") no-repeat left 50%; }

#content_2 .row li#number_3 { background: url("../images/Numbers_3.jpg") no-repeat left 50%; }

#content_2 .row li#number_4, #content_2 .row_2 li#number_4 { background: url("../images/Numbers_4.jpg") no-repeat left 50%; }

#content_2 .row li#number_5, #content_2 .row_2 li#number_5 { background: url("../images/Numbers_5.jpg") no-repeat left 50%; }

#content_2 .row li#number_6, #content_2 .row_2 li#number_6 { background: url("../images/Numbers_6.jpg") no-repeat left 50%; }

#content_2 .row_2 li#number_7 { background: url("../images/Numbers_7.jpg") no-repeat left 50%; }

#content_2 .row_2 li#number_8 { background: url("../images/Numbers_8.jpg") no-repeat left 50%; }

#content_2 .row_2 li#number_9 { background: url("../images/Numbers_9.jpg") no-repeat left 50%; }

#content_2 .row_2 li#number_10 { background: url("../images/Numbers_10.jpg") no-repeat left 50%; }


.highlight { color:#003366; }

/* */
#content .row, #content .row_2     { text-align: left; margin: 0 0 20px 30px; padding: 0; position: relative; width: 330px; float: left }

#content .row h3, #content .row_2 h3   { font-size: 1em; border-bottom: 1px solid #c00 }

#content .row h4, #content .row_2 h4     { font-size: 0.9em; padding-top: 7px }

#content .row p, #content .row_2 p   { font-size: .9em; padding-top: 5px; padding-left: 7px;  }

#content .row ul, #content .row_2 ul { width: 280px; margin: 0; padding: 0; }

#content .row li, #content .row_2 li { padding: 2px 0px 2px 15px; list-style-type: none; font-size: .9em; }

#content .row_2     { margin-left: 50px }

#content .row img, #content .row_2 img    { margin-top: 5px; float: right }

/* */
#content #home_info   { clear: both }

#content #home_info h3   { font-weight: normal }

#content #home_info img  { padding-right: 10px; float: left }

/* */
#home_signup, 
#home_signup_fr   
{ margin: 10px auto 40px; padding-top: 3px; padding-bottom: 3px; position: relative; width: 370px; overflow:hidden; }

#home_signup_fr { width: 475px; }

#home_signup ul, 
#home_signup_fr ul  
{ padding: 12px 0; margin:0;  }


#home_signup li, 
#home_signup_fr li     
{ display:block; background-color: #f6f6f6; list-style-type: none; display: inline; margin-left: 7px; padding: 11px 7px; border: solid 1px #999; display:block;}

#home_signup li.left, 
#home_signup_fr li.left 
{
float:left;
}

#home_signup li.right, 
#home_signup_fr li.right 
{
float:right;
}


#home_signup li span, 
#home_signup_fr li span   
{ background-color: #fff; padding: 5px 7px; border: solid 1px #c00; }

#home_signup a, 
#home_signup_fr a  
{ font-weight: bolder; }

#home_signup a:link, 
#home_signup a:visited,
#home_signup_fr a:link, 
#home_signup_fr a:visited
 { color: #039 ; text-decoration: none; }

#home_signup a:hover, 
#home_signup_fr a:hover 
{ color: #c00; text-decoration: underline; background-color: transparent; background-image: none;  }

.lang  { padding: 0 12px 0 0; float: right; }

.lang p { font-size: .8em; }

.lang a { text-decoration: none;}

table.esso-card-features { font-size: .9em; text-align: center; width: 100%;   }
		


table.esso-card-features td, table.esso-card-features th { padding: 3px 10px;}

table.esso-card-features th { background-color: #036; color: #fff;}

table.esso-card-features tbody .row-1 th {
background-color: #F9F9F9;
color:#000;
}

table.esso-card-features tbody .row-2 th {
background-color: #e3e3e3;
color:#000;
}

table.esso-card-features .first-col { 
text-align: left; 
}

table.esso-card-features .row-1 { background-color: #f9f9f9 }

table.esso-card-features .row-2 {  background-color: #e3e3e3 }

table.esso-card-features .callout-row { background-color: #036; color: #fff; }

table.esso-card-features .highlight-1  { background-color: #e6c975 }

table.esso-card-features .highlight-2   { background-color: #dcaa18 }

table.esso-card-features tfoot { font-weight: bolder; padding: none; }

table.esso-card-features tfoot img { padding: none; margin: none;
}

table.esso-card-features  th.card-size {
width: 90px;
}

table.esso-card-features .table-image-holder {
padding: 0;
}

.table-blurb span {
font-weight:bold;
font-size:1.1em;
display:block;
border-bottom:1px solid #569957;
padding:0 0 2px 0;
}

.table-blurb em {
font-weight:bold;

}


img.img-right { float: right; }

.img_box {
float: right;
width: 220px;
text-align: center;
}

.content_image .img_box img {
float: none;
}

.img_box p {
text-align: center;
font-size: .8em;
}

.row-container {
width: 690px;
margin: 0 auto;
}

.row-container h3 {
border-bottom:1px solid #CC0000;
}

#content .row-container h4, #content_2 .row-container h4 {
font-size:0.9em;
padding-top:7px;
}

#content .row-container p, #content_2 .row-container p {
font-size:0.9em;
padding-left:7px;
padding-top:5px;
}

#content .row-container li, #content_2 .row-container li {
font-size:0.9em;
}

.row-left {
width: 300px;
float:left;
}

.row-right {
width: 300px;
float:right;
}

.row-left div, .row-right div {
width: 290px;
margin: 0 0 40px 0;
}

#content_2 .ui-tabs-nav .inner-container #fragment-1 li, #content_2 .ui-tabs-nav  .inner-container #fragment-2 li, #content_2 .inner-container .ui-tabs-nav  #fragment-3 li, #content_2 .inner-container .ui-tabs-nav  #fragment-4 li, #content_2 .inner-container .ui-tabs-nav  #fragment-5 li  {
list-style-type: disc;
min-width: none;
float:none;
}

ul.inside-list li {
list-style-type: disc;
min-width: none;
float:none;
}

#content_2 ul.ui-tabs-nav li {
padding-bottom: 0;
}

.ui-tabs-panel {
border: 1px solid #686868;
padding: 7px;
}

.inner-container ul {
text-align: left;
}



/* On Line App */
.form-container-2 {
width:600px;
font-size:.9em;
margin:30px auto;
}

.form-container-2 div, .form-container-2 div.options {
padding:5px 0;
overflow:hidden;
}

.form-container-2 fieldset {
border:none;
border-top:1px solid #666666;
padding:10px;
margin:0 0 25px 0;

}

.form-container-2 .last-fieldset {
margin:0;
}

.form-container-2 fieldset fieldset {
border:1px solid #ccc;
padding:10px;
margin:0 0 25px 0;
background:none;
background-color:#FFFFFF;

}

.form-container-2 fieldset legend {
padding:3px 9px;
font-weight:bold;
font-size:1.1em;
font-family:Georgia, "Times New Roman", Times, serif;
}

.form-container-2 fieldset fieldset legend {
padding:3px 9px;
font-weight:bold;
font-size:1em;
}

.form-container-2 label, span.label {
width:40%;
text-align:right;
display:inline;
float:left;
padding:0 5px 0 0;
vertical-align:bottom;
}

.form-container-2 input {
font-size:.75em;
margin:0 2px;
padding:0;

}

.form-container-2 select {
float:left;
font-size:.9em;
}

.form-container-2 div.options label {
text-align:left;
width:auto;
padding:0 10px 0 0;
}

.form-container-2 div.data {
border-bottom: 1px dashed #ccc;
padding:15px 0 15px 40px;
}

.form-container-2 div.data div {
padding:15px 0 0 0;
}

.form-container-2 div.data div.options span.label {
width:auto;
}

.form-container-2 div.data label {
width:auto;
text-align:left;
display:inline;
float:none;
}

.form-container-2 div.data input {

}

.form-container-2 .button_row {
text-align:center;
}

.form-container-2 .button_row input {
font-size:1em;

}

.hint {
color:#931818;
padding:0 3px 0 0;
}



/* Errors */
.form-container-2 label.error, 
.form-container-2 span.error { 
color: #931818; 
text-align: left; 
margin-top: 2px; 
margin-bottom: 10px; 
margin-left: 40%; 
background-color:#FFFFCC;
}

.form-container-2 input.error { 
border: solid 1px #9b3535; 
}

.form-container-2 input:focus,
.form-container-2 input.error:focus, 
.form-container-2 textarea:focus {	
background-color: #FFC; 
border-color: #FC6; 
}




/* Numbers on form elemets */
div.nmb_1 {
background: url("../images/nmb_1.jpg") no-repeat left 50%;
}

div.nmb_2 {
background: url("../images/nmb_2.jpg") no-repeat left 50%;
}

div.nmb_3 {
background: url("../images/nmb_3.jpg") no-repeat left 50%;
}

div.nmb_4 {
background: url("../images/nmb_4.jpg") no-repeat left 50%;
}

small {
font-size:.9em;
}


/* */
ul#rsvp {
text-align: center;
}


/* */
.image-box {
width:235px;
float:right;
text-align:center;
}

.image-box p {
text-align:center;
}

#content .row-wide { text-align: left; width: 320px; float: left; margin: 0 50px 0 0; padding: 0; }

#content .row-wide-2 { text-align: left; width: 390px; float: left; margin: 0; padding: 0; }

#content .row-wide-2 p span { font-weight:bold; }

#content .row-wide h4 { font-size:1em; font-style:normal; }

#content .row-wide img {
float:right;
padding:0 0 0 5px;
}

/* */

.invite {
text-align:center;
}

#content .invite p {
width:210px;
border:1px solid #ccc;
text-align:center;
padding:10px;
margin:0 auto;
}

/* */

.col-1 {
float:left;
width: 450px;
}

.col-2 {
float:right;
width: 400px;
}

/* */
table#events {
width:90%;
text-align:left;
font-size:.9em;
}

table#events caption {
text-align:left;
font-weight:bold;
font-size:1.1em;
padding:0 0 7px 0;
}

.alt {
background:#e5e5e5;
}

table#events thead th {
border-bottom: 1px solid #ccc;
background-color:#CC0000;
color:#fff;
}

table#events th, table#events td {
padding:3px;
}

table#events tr {
border-bottom:1px solid #e5e5e5;
border-left:1px solid #e5e5e5;
border-right:1px solid #e5e5e5;
}

#content-wide  { margin-right: 50px; margin-left: 50px; overflow:hidden; }

#content-wide h3 { font-size:1.2em; font-weight:bold; padding:0 0 10px 0; }

#content-wide p, #content-wide li { font-size:.95em; }

#content_2  { width: 605px; float: left; padding-right: 75px; padding-left: 75px; }

#content ol, #content-wide ol { margin-left: 20px; list-style-type: decimal; }

#content ol ol, #content-wide ol ol { margin-left: 40px; list-style-type: upper-alpha; }

#content ol li, #content-wide ol li { margin-top: 9px; }


/* */
.form-container {
padding:0 0 0 20px;
}

.form-container .fieldset-look {
border:1px solid #999;
margin:15px 5px;
width:670px;
position:relative;
}

.form-container .fieldset-look p {
padding:0;
margin:0;
font-size:.9em;
overflow:hidden;
}

.form-container form .fieldset-look div {
padding:2px 0;
overflow:hidden;
}

#content .form-container .fieldset-look h3 {
padding:0px;
margin:-7px 0 0 15px;
font-size:1em;
text-align:left;
}

.form-container .fieldset-look h3 span {
background-color:#fff;
padding:3px 9px;
position:relative;
}

.form-container .fieldset-look div {
overflow:hidden;
display:block;
width:100%;
}

.form-container .label-look{
display:block;
font-size:1em;
width:40%;
text-align:right;
float:left;
position:relative;
padding:0 5px 0 0;
}

.form-container .input-look {
font-weight:bold;
float:left;
}

/* */
.security {
position:absolute;
top:-20px;
right:-100px;
}

/* */
.apply-container {
width:550px;
margin:0 auto;
}


/* Numbers on form elemets */
.nmb_1_apply {
background: url("../images/nmb_1.jpg") no-repeat left 50%;
padding:15px 0 15px 40px;
}

.nmb_2_apply {
background: url("../images/nmb_2.jpg") no-repeat left top;
padding:0 0 15px 40px;
}

.nmb_3 {
background: url("../images/nmb_3.jpg") no-repeat left 50%;
}

.nmb_4 {
background: url("../images/nmb_4.jpg") no-repeat left 50%;
}

.nmb_2_apply p {
padding:7px 0 0 0;
}

/* */
.or {
padding:7px 0 15px 105px;
font-style:italic;
font-weight:bold;
}

/* */ /* There is an IE fix on the ie.css sheet */ */
#content h3.apply_button  {  
margin: 0 auto;
text-align:center;


}

#content h3.apply_button a, #content h3.apply_button_fr a {
background: url("../images/click_apply.jpg") no-repeat left top;
display:block;
height:90px;
width:250px;
text-align:center;
margin:0 auto;
padding:27px 0 0 0;
color:#1258ae;
font-weight:bold;
font-size:1.3em;

}

#content h3.apply_button_fr a {
padding:11px 0 0 0;
font-size:1.1em;
line-height:1;
} 

#content h3.apply_button a span, #content h3.apply_button_fr a span {
font-size:.63em;
display:block;
}

#content h3.apply_button a:hover, #content h3.apply_button_fr a:hover {
background: url("../images/click_apply_hover.jpg") no-repeat left top;
color:#cc0000;

}

/* */
.trademarks {
font-size:.65em;
margin:0 auto 15px auto;
width: 980px;
}
 
.trademarks p {
text-align:left;
}


