/*****************
 * General stuff *
 *****************/
.print_only {display:none}

h1 {font-size:140%;}
h2 {font-size:120%}
h3 {font-size:110%}
h1,h2,h3 {padding-top:10px;margin:0px;margin-bottom:0.25em;}
h1 {margin-bottom:10px;}

img {border:none;}

a {color:#000;}
a:hover {text-decoration:underline;}
ul {margin-left:0px;padding-left:40px;}
li {margin:0;padding:0;margin-bottom:5px;padding-left:5px;}
li p {line-height:180%;}
p {line-height:180%;margin:10px 0px;}

.larger {font-size:110%;}
.largest {font-size:120%;}
.smaller {font-size:90%}
.lighter {color:#777;}

span.description {padding-left:30px;color:#777;font-style:italic;}
div.example_box {float:right;width:40%;background:#f3dfad;margin-bottom:40px;padding-left:10px;}
div.bg_box {background:#f3dfad;padding:10px;}

.notice_msg, .error_msg, .warning_msg {padding:5px 10px;margin:5px 15px 10px 15px;font-weight:bold;}
.error_msg {background-color:#FFDFDF;border:2px solid #990000;color:#990000;}
.warning_msg, .yellow_notice_msg {background-color:#fffec9;border:2px solid #ffd800;color:#2f2f2f;}
.notice_msg {background-color:#DDFFDD;border:2px solid #228822;color:#228822;}
.notice_msg img, .error_msg img, .warning_msg img {position:relative;top:3px;}

.help_link {margin:0.5em;}
.help_link a {color:#555;text-decoration:none;}
.help_link a:hover {color:#000;text-decoration:underline;}
.help_link img {padding-right:0.25em;position:relative;top:2px;}

.help_icon {position:relative;top:2px;}

.left {float:left;margin:0px;}
.right {float:right;margin:0px;}

#content .column, .column {width:49.99%;margin:0px;padding:0px;}
#content .column *, .column * {margin-left:0px;margin-right:0px;}
#content .column * *, .column * * {margin-left:0px;margin-right:0px;}

.no_underline {text-decoration:none;}

.rss {font-size:100%;padding:5px;}
.rss a {text-decoration:none;font-weight:bold;border-bottom:1px dotted #777;color:#555;margin:0px;}
.rss a.rss_image {border:none;}
.rss a img {border:none;position:relative;top:3px;}

form {margin:0px;padding:0px;padding-top:5px;}

table.left_right th, table.horizontal th {text-align:left;padding-right:10px;}
table.left_right th.no_padding, table.horizontal th.no_padding {padding-right:0px;}
table.left_right, table.horizontal {line-height:2em;}

#breadcrumb {margin-top:10px; width:100%; color:#555; font-size:90%}
#breadcrumb a {padding:5px;color:#555;}

.plain_list {list-style:none;margin:0px;padding:0px;padding-left:10px;}
.plain_list li {margin:10px;padding:0px;}

.help_message {display:none;}

.foot_note {border-top:1px solid #999;margin-top:15px; font-size:80%; color:#555;}

.tick_list, .tick_list li {margin:0;padding:0;list-style-type:none;line-height:150%;}
.tick_list li {background:url(../images/ukpower/tick.gif) 0px 5px no-repeat;padding-left:30px;padding-bottom:10px;}

/*****************
 * Will Paginate *
 *****************/
.pagination {
  margin-top:2em;
  background: white;
  font-size:90%;
  text-align:center;
  /* self-clearing method: */ }
  .pagination a, .pagination span {
    padding: 0 .8em;
	display:inline-block;
    margin-right: 1px; }
  .pagination span.disabled {
    color: #999;
    border: 1px solid #DDD; }
  .pagination span.current {
    font-weight: bold;
    background: #2E6AB1;
    color: white;
    border: 1px solid #2E6AB1; }
  .pagination a {
    text-decoration: none;
    color: #105CB6;
    border: 1px solid #9AAFE5; }
    .pagination a:hover, .pagination a:focus {
      color: #003;
      border-color: #003; }
  .pagination .page_info {
    background: #2E6AB1;
    color: white;
    padding: .4em .6em;
    width: 22em;
    margin-bottom: .3em;
    text-align: center; }
    .pagination .page_info b {
      color: #003;
      background: #6aa6ed;
      padding: .1em .25em; }
  .pagination:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden; }
  * html .pagination {
    height: 1%; }
  *:first-child+html .pagination {
    overflow: hidden; }


/****************************
 * Box with Rounded Corners *
 ****************************/
.box_container {margin:0px;}
.box {margin-top:0px;min-height:1px;padding:0px;margin-bottom:15px;background-color:#f2f2f2;}
.t {background: url(../images/box_grey/dot.gif) 0 0 repeat-x;}
.b {background: url(../images/box_grey/dot-bottom.gif) 0 100% repeat-x}
.l {background: url(../images/box_grey/dot.gif) 0 0 repeat-y}
.r {background: url(../images/box_grey/dot-right.gif) 100% 0 repeat-y}
.bl {background: url(../images/box_grey/bl.gif) 0 100% no-repeat}
.br {background: url(../images/box_grey/br.gif) 100% 100% no-repeat}
.tl {background: url(../images/box_grey/tl.gif) 0 0 no-repeat; z-index:1}
.tr {background: url(../images/box_grey/tr.gif) 100% 0 no-repeat; z-index:-1;padding:0px 10px 10px 10px; }
.box_inside {padding:0 5px 5px 0;}

.box ul {line-height:180%;}

.blue .t {background: url(../images/box_blue/dot-top.gif) 0 0 repeat-x;}
.blue .b {background: url(../images/box_blue/dot-bottom.gif) 0 100% repeat-x}
.blue .l {background: url(../images/box_blue/dot-left.gif) 0 0 repeat-y}
.blue .r {background: url(../images/box_blue/dot-right.gif) 100% 0 repeat-y}
.blue .bl {background: url(../images/box_blue/bl.gif) 0 100% no-repeat}
.blue .br {background: url(../images/box_blue/br.gif) 100% 100% no-repeat;}
.blue .tl {background: url(../images/box_blue/tl.gif) 0 0 no-repeat; z-index:1;}
.blue .tr {background: url(../images/box_blue/tr.gif) 100% 0 no-repeat; z-index:-1;padding:0px 10px 10px 10px; }
.blue .box {background:#0a1976;}

.green .t {background: url(../images/box_green/dot.gif) 0 0 repeat-x;}
.green .b {background: url(../images/box_green/dot.gif) 0 100% repeat-x}
.green .l {background: url(../images/box_green/dot.gif) 0 0 repeat-y}
.green .r {background: url(../images/box_green/dot.gif) 100% 0 repeat-y}
.green .bl {background: url(../images/box_green/bl.gif) 0 100% no-repeat}
.green .br {background: url(../images/box_green/br.gif) 100% 100% no-repeat}
.green .tl {background: url(../images/box_green/tl.gif) 0 0 no-repeat; z-index:1}
.green .tr {background: url(../images/box_green/tr.gif) 100% 0 no-repeat; z-index:-1;padding:0px 10px 10px 10px; }

.white .t {background: url(../images/box_white/dot-top.gif) 0 0 repeat-x;}
.white .b {background: url(../images/box_white/dot-bottom.gif) 0 100% repeat-x}
.white .l {background: url(../images/box_white/dot-left.gif) 0 0 repeat-y}
.white .r {background: url(../images/box_white/dot-right.gif) 100% 0 repeat-y}
.white .bl {background: url(../images/box_white/bl.gif) 0 100% no-repeat}
.white .br {background: url(../images/box_white/br.gif) 100% 100% no-repeat}
.white .tl {background: url(../images/box_white/tl.gif) 0 0 no-repeat; z-index:1}
.white .tr {background: url(../images/box_white/tr.gif) 100% 0 no-repeat; z-index:-1;padding:0px 10px 10px 10px; }
.white .box {background:#fff;}

.orange .t {background: url(../images/box_orange/dot.gif) 0 0 repeat-x;}
.orange .b {background: url(../images/box_orange/dot.gif) 0 100% repeat-x}
.orange .l {background: url(../images/box_orange/dot.gif) 0 0 repeat-y}
.orange .r {background: url(../images/box_orange/dot.gif) 100% 0 repeat-y}
.orange .bl {background: url(../images/box_orange/bl.gif) 0 100% no-repeat}
.orange .br {background: url(../images/box_orange/br.gif) 100% 100% no-repeat}
.orange .tl {background: url(../images/box_orange/tl.gif) 0 0 no-repeat; z-index:1}
.orange .tr {background: url(../images/box_orange/tr.gif) 100% 0 no-repeat; z-index:-1;padding:0px 10px 10px 10px; }

.grey .t {background: url(../images/box_grey/dot.gif) 0 0 repeat-x;}
.grey .b {background: url(../images/box_grey/dot-bottom.gif) 0 100% repeat-x}
.grey .l {background: url(../images/box_grey/dot.gif) 0 0 repeat-y}
.grey .r {background: url(../images/box_grey/dot-right.gif) 100% 0 repeat-y}
.grey .bl {background: url(../images/box_grey/bl.gif) 0 100% no-repeat}
.grey .br {background: url(../images/box_grey/br.gif) 100% 100% no-repeat}
.grey .tl {background: url(../images/box_grey/tl.gif) 0 0 no-repeat; z-index:1}
.grey .tr {background: url(../images/box_grey/tr.gif) 100% 0 no-repeat; z-index:-1;padding:0px 10px 10px 10px; }

.grey_gradient .t {background: url(../images/box_grey_gradient/dot.gif) 0 0 repeat-x;}
.grey_gradient .b {background: url(../images/box_grey_gradient/dot.gif) 0 100% repeat-x}
.grey_gradient .l {background: url(../images/box_grey_gradient/dot.gif) 0 0 repeat-y}
.grey_gradient .r {background: url(../images/box_grey_gradient/dot.gif) 100% 0 repeat-y}
.grey_gradient .bl {background: url(../images/box_grey_gradient/bl.gif) 0 100% no-repeat}
.grey_gradient .br {background: url(../images/box_grey_gradient/br.gif) 100% 100% no-repeat}
.grey_gradient .tl {background: url(../images/box_grey_gradient/tl.gif) 0 0 no-repeat; z-index:1}
.grey_gradient .tr {background: url(../images/box_grey_gradient/tr.gif) 100% 0 no-repeat; z-index:-1;padding:0px 10px 10px 10px; }
.grey_gradient .box {background-color:#fff;background-image: url(../images/box_grey_gradient/box_bg.gif); background-position: 0 100%;background-repeat:repeat-x;}

.yellow .t {background: url(../images/box_yellow/dot-top.gif) 0 0 repeat-x;}
.yellow .b {background: url(../images/box_yellow/dot-bottom.gif) 0 100% repeat-x}
.yellow .l {background: url(../images/box_yellow/dot-left.gif) 0 0 repeat-y}
.yellow .r {background: url(../images/box_yellow/dot-right.gif) 100% 0 repeat-y}
.yellow .bl {background: url(../images/box_yellow/bl.gif) 0 100% no-repeat}
.yellow .br {background: url(../images/box_yellow/br.gif) 100% 100% no-repeat}
.yellow .tl {background: url(../images/box_yellow/tl.gif) 0 0 no-repeat; z-index:1}
.yellow .tr {background: url(../images/box_yellow/tr.gif) 100% 0 no-repeat; z-index:-1;padding:0px 10px 10px 10px; }
.yellow .box {background:#fdedaf;}
.yellow .box_inside {padding:0px 5px 5px 40px;}


#content .yellow h2 {position:relative;top:-10px;margin-left:-40px;margin-bottom:-10px;}
#content .yellow h2 img {position:relative;top:10px;}
#content .yellow {color:#0a1976}


#switch_breadcrumb {font-size:90%; color:#0a1976;text-decoration:none;}
#switch_breadcrumb { margin:0px; margin-top:5px; float:right;}
#switch_breadcrumb li { margin:0px; display:block; float:left; line-height:1em;list-style-type:none; margin:0;margin-right:5px; padding:0;}
#switch_breadcrumb a, #switch_breadcrumb span { text-decoration:none;display:block; float:left;margin:0px; padding:6px 7px 6px 7px; color:#000; background-color:#fff6a6;border:1px solid #ffba00;}
#switch_breadcrumb li.active a {background-color:#ffba00;font-weight:bold;color:#000;}
#switch_breadcrumb a:hover {text-decoration:underline;}
#switch_breadcrumb #process_label {background:none;padding-left:0;padding-right:0;border:none;}
#switch_breadcrumb a {color:#000;}

a.back_link {position:relative;top:5px;font-size:110%;font-weight:bold;text-decoration:none;}
a.back_link:hover {text-decoration:underline;}

#price_updates tr.odd td {background:#fff;}

.postcode_entry_box {color:#000;}

#standalone_postcode_box {margin-left:auto;margin-right:auto;margin-top:40px;width:24em;color:#000;}
#standalone_postcode_box label {font-size:100%;position:relative;top:-5px;}
.postcode_entry_box .continue, #standalone_postcode_box .continue {position:relative;top:7px;}

#small_postcode_entry_box {width:273px;float:right;padding-top:1em;}
#small_postcode_entry_box #postcode {width:213px;}
#postcode {font-size:160%;text-transform: uppercase;}

#postcode_label {font-size:120%;padding-right:5px;font-weight:bold;}
#compare_prices {position:relative;top:7px;left:5px;;}

#supplier_logos ul {margin:0;padding:0;width:100%;}
#supplier_logos li {list-style:none;margin:0;padding:0;float:left;width:24%;text-align:center;height:60px;}

/*****************
 * Results Table *
 *****************/
#details_block {width:860px;}
#details_block #current_suppliers td, #details_block #current_suppliers th {padding:5px;vertical-align:top;}
#details_block .top_row th {border-bottom:1px solid #ccc;padding-bottom:5px;}
#details_block a {display:block;text-align:right;padding:10px;color:#FF5400}

#postcode_region {margin:0;margin-bottom:5px; padding:0;font-size:100%;}

#cheaper_tariffs_available {background-color:#fffec9;border:2px solid #ffd800;color:#2f2f2f;padding:7px;}
#cheaper_tariffs_available p {margin:0;}
#cheaper_tariffs_available img {float:left;margin-right:10px;position:relative;top:-5px;}
#cheaper_tariffs_available .saving {color:#338700;font-size:120%;margin-left:2px;margin-right:2px;}

#results_container {margin:0px;padding:0px;}
#results_container .box_inside {padding:0;background:#fff;position:relative;top:2px;}

#payment_type {color:#000;font-weight:bold;float:right;padding-left:10px;padding-top:0px;padding-bottom:10px;}

#result_tabs {position:relative;top:0em;}
#result_tabs li { display:block; float:left; line-height:1em;list-style-type:none; margin:0;margin-right:8px; padding:0; background:#eee;}
#result_tabs a, #result_tabs li a { height:13px;text-decoration:none;display:block; float:left;margin:0px; padding:13px 18px; color:#000; background-color:#b4bbe8; font-size:14px;font-weight:bold; }
#result_tabs li.active { background-color:#5a69c9;}
#result_tabs li.active a {background-color:#5a69c9;color:#fff;}
#result_tabs a:hover {text-decoration:underline;}

#results_container #filters {list-style:none;margin:0;padding:0;height:40px;background:#5a69c9;clear:both;}
#results_container #filters li {float:left;display:block;margin-bottom:15px;}
#results_container #filters li img {display:none;}
#results_container #filters li.show {padding:0.75em;font-weight:bold;color:#fff;}
#results_container #filters li a {margin:0;margin-left:0.5em;display:inline-block;padding:0.75em 1.5em;color:#fff;}
#results_container #filters li.active img {display:inline;position:relative;top:2px;right:5px;}
#results_container #filters li.active a {margin-left:0.5em;background-color:#0a1976;color:#fff;text-decoration:none;font-weight:bold;}

#results_table {clear:both;width:100%;margin-top:0px;padding-top:0px;position:relative;top:-20px;background-color:#fff;}
#results_table th {color:#fff;background-color:#0a1976;border-bottom:2px solid #555;padding:0.5em 1em;text-align:left;font-weight:bold;font-size:110%;}
#results_table th img {margin-bottom:-2px;margin-left:5px;}
#results_table th a {color:#fff;}
#results_table td {padding:0.5em 1em;background:#fff;}
#results_table td {border-top:1px solid #ddd;}
#results_table td.supplier {text-align:center;}
#results_table td.jdpower {text-align:right;line-height:1.5em;}
#results_table td.co2 { font-weight:bold;font-size:110%;font-weight:bold;text-align:center;}
#results_table td.co2 .fuel_mix {margin:5px 0;}
#results_table td.co2 .fuel_mix a {font-size:80%;font-weight:normal;color:#555}
#results_table td.cost { font-weight:bold;font-size:110%;font-weight:bold;text-align:center;}
#results_table span.saving { font-weight:bold;font-size:100%;font-weight:bold;text-align:center;padding-bottom:2px;display:inline-block;margin-top:5px;}
#results_table span.positive, .positive {color:#338700;}
#results_table span.negative {color:#960000;}
#results_table span.tariff_title {font-weight:bold;font-size:105%;color:#0a1976;margin-bottom:0px;}
#results_table span.tariff_title a {font-weight:bold;font-size:110%;color:#0a1976;text-decoration: none;margin-bottom:0px;}
#results_table span.tariff_title a:hover {text-decoration: underline;margin-bottom:0px;}

#results_table ul {padding:0px;margin:0px;margin-bottom:3px;margin-top:3px;}
#results_table ul li {margin:0px;padding:0px;font-size:90%;color:#555;margin-left:1.5em;line-height:130%;}

#results_table td.switch {text-align:center;}
#results_table td.switch input {font-weight:bold; font-size:120%}
#results_table td.switch .more_details { font-size:90%;}
#results_table td.switch em { font-size:90%;}

#results_table .tariff_details_link a {font-size:95%;display:inline-block;color:#333;margin-top:5px;}

#results_footer {background:white;text-align:center;font-size:90%;border-top:1px solid #999;color:#333;}

#current_suppliers td, #current_suppliers th {padding-left:10px;}

table.data {width:100%;margin-top:0px;padding-top:0px;}
table.data th {color:#fff;background-color:#0b5a8c;border-bottom:2px solid #333;padding-left:8px;padding-right:8px;text-align:left;}
table.data th img {margin-bottom:-2px;margin-left:5px;}
table.data td {padding:2px 8px;}
table.data td {border-top:2px solid #ddd;}

#switch_breadcrumb a {color:#0a1976;}

.co2_up, .co2_down {background-position:0 2px; background-repeat:no-repeat; padding-left:15px;}
.co2_up {color:#960000;background-image:url(/images/co2_up.gif)}
.co2_down {color:#338700;background-image:url(/images/co2_down.gif);}

.important_note, .important {color:#960000}

/******************
 * Tariff Details *
 ******************/
.calculation {width:100%;}
.calculation td {padding:3px 0px;}
.calculation .subtotal td {font-weight:bold;border-top:1px solid #000;text-align:right;}
.calculation .total td {font-weight:bold;border-top:2px solid #000;text-align:right;}
.calculation td.number {text-align:right;width:5.5em;}

#switch {text-align:center;padding:0px;}
#switch input {font-size:180%;padding:0.5em 2em;margin:0.5em;background:orange;}

.big_button {font-size:140%;padding:5px 15px;}

.vat_inc_rates {display:block;color:#222;font-size:90%;margin-top:2px;}

#content #alternative_tariffs {margin-bottom:2em;margin-top:1em;width:99%;}
#content #alternative_tariffs a {color:#000;text-decoration:none;}

#green_energy_scheme_table {margin-top:10px;width:600px;border:2px solid #006224}
#green_energy_scheme_table tr td {border:2px solid #006224;padding:5px 8px;}
#green_energy_scheme_table tr td.bottom {background: #006224;color:#fff;}

/**********************
 * Switch Application *
 **********************/
#terms_and_conditions label {font-weight:normal;}
#terms_and_conditions input {margin-right:0.5em;display:inline-block;}

#ukpower_communications label {font-weight:normal;}
#ukpower_communications input {margin-right:0.5em;display:inline-block;}

#supplier_communications label {font-weight:normal;}
#supplier_communications #dpa label {font-weight:bold;}
#supplier_communications input {margin-right:0.5em;display:inline-block;}

#field_home_energy_transaction_details_preferred_communication_method label {font-weight:bold;margin-top:10px;width:250px;}

/*************
 * Layout fixes * 
 *************/
.clearboth {clear:both;}
#wrapper:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
#wrapper{display: inline-block;}

/* Hides from IE-mac \*/
* html #wrapper { height: 1%; }
#wrapper { display: block; }
/* End hide from IE-mac */

#sub_wrapper:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
#sub_wrapper { display: inline-block; }

/* Hides from IE-mac \*/
* html #sub_wrapper { height: 1%; }
#sub_wrapper { display: block; }
/* End hide from IE-mac */

span.required { font-size: 90%; color: #990000; }
form.form_builder br.clear { clear: both;}

form.form_builder div.field { width: 95%; margin: 5px 5px 0px 0px; padding: 1px; }
form.form_builder label { color: #333; font-weight: bold;padding-bottom:2px;padding-top:4px;}
form.form_builder label img {padding-left:6px;margin:-2px}

form.form_builder div.fieldrow:after, div.field:after { content: "."; clear: both; display: block; visibility: hidden; height: 0px; }
form.form_builder div.fieldrow div.field { float: left; margin-right: 10px;  }

/* sizes */
form.form_builder div.half, form.form_builder input.half, form.form_builder textarea.half          { width: 45%; }
form.form_builder div.third, form.form_builder input.third, form.form_builder textarea.third       { width: 30%; }
form.form_builder div.quarter, form.form_builder input.quarter, form.form_builder textarea.quarter { width: 22%; }
form.form_builder div.fifth, form.form_builder input.fifth, form.form_builder textarea.fifth       { width: 18%; }
form.form_builder div.sixth, form.form_builder input.sixth, form.form_builder textarea.sixth       { width: 15%; }
form.form_builder div.full, form.form_builder input.full, form.form_builder textarea.full          { width: 90%; }

/* text */
form.form_builder input.text { width: 100%; }
form.form_builder input.big { font-size: 150%; line-height: 150%;} 

/* textarea */
form.form_builder textarea { width: 100%;}
form.form_builder textarea.large { height: 400px; }
form.form_builder textarea.medium { height: 200px; }
form.form_builder textarea.small { height: 100px; }

/* fieldset */
form.form_builder fieldset.half { float: left; width: 45%; margin-right: 10px; }
form.form_builder fieldset.third { float: left; width: 30%; margin-right: 10px; }
form.form_builder fieldset.quarter { float: left; width: 22%; margin-right: 10px; }
form.form_builder fieldset {margin-top:10px;border:1px solid #aaaaaa;padding:8px;}
form.form_builder legend {border: 1px solid #aaaaaa;padding: 2px 6px;font-weight:bold;}

/* error messages */
form.form_builder div.error_message, .errorExplanation { color: #990000; font-weight:bold;clear: both; padding: 3px 6px; margin: 5px 0px; display: none; background: #FFDFDF; border: 1px solid #990000; }
form.form_builder div.error div.error_message, span.error div.error_message, .errorExplanation { display: block;}

/* special cases */
form.form_builder div.full_name span.title { width: 10%; }
form.form_builder div.full_name span.first_name, div.full_name span.last_name { width: 40%;}

/* groups */
form.form_builder label.under { display: block; }
form.form_builder div.group label { font-weight: normal; }
form.form_builder div.two_col span { width: 45%;}
form.form_builder div.three_col span { width: 30%;}
form.form_builder div.four_col span { width: 30%;}

form.form_builder div.field label {display:inline-block;margin-bottom:2px;}
form.form_builder div.horizontal span { float: left; margin-right: 7px; display:inline-block; width:auto; padding: 3px;}
form.form_builder div.horizontal label {display:inline-block; margin-left:10px; width:1em;}
form.form_builder div.vertical span { display: block; margin-right: 7px; padding: 3px;}

div.buttons {margin-top:10px;padding-top:10px;clear:both;border-top:1px solid #ccc;text-align:right;}
div.buttons ol {list-style:none;margin:0;padding:0}
div.buttons ol li {float:right;margin:0px;padding:0px;padding-left:10px;}
div.buttons input, input.button, input.back {
	padding:2px 8px;
	font-size:120%;
}
input.back {float:left;margin-top:-5px;}
div.buttons input:hover, input.button:hover {
	cursor:pointer;
}
div.buttons form {margin:0px;padding:0px;}

.button {font-size:120%; font-weight:bold;}
a.button {border:1px solid #FFAF6F;background-color:#FFEFAF; padding:4px 8px;color:#000;text-decoration:none;line-height:1em;}

.fieldWithErrors {display:inline;}


#facebox .b {
  background:url(/images/facebox/b.png);
}

#facebox .tl {
  background:url(/images/facebox/tl.png);
}

#facebox .tr {
  background:url(/images/facebox/tr.png);
}

#facebox .bl {
  background:url(/images/facebox/bl.png);
}

#facebox .br {
  background:url(/images/facebox/br.png);
}

#facebox {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
  text-align: left;
}

#facebox .popup {
  position: relative;
}

#facebox table {
  border-collapse: collapse;
}

#facebox td {
  border-bottom: 0;
  padding: 0;
}

#facebox .body {
  padding: 10px;
  background: #fff;
  width: 370px;
}

#facebox .loading {
  text-align: center;
}

#facebox .image {
  text-align: center;
}

#facebox img {
  border: 0;
  margin: 0;
}

#facebox .footer {
  border-top: 1px solid #DDDDDD;
  padding-top: 5px;
  margin-top: 10px;
  text-align: right;
}

#facebox .tl, #facebox .tr, #facebox .bl, #facebox .br {
  height: 10px;
  width: 10px;
  overflow: hidden;
  padding: 0;
}

#facebox_overlay {
  position: fixed;
  top: 0px;
  left: 0px;
  height:100%;
  width:100%;
}

.facebox_hide {
  z-index:-100;
}

.facebox_overlayBG {
  background-color: #000;
  z-index: 99;
}

* html #facebox_overlay { /* ie6 hack */
  position: absolute;
  height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}


/* -------------------------------------------------------------------------------------------------

It's *strongly* suggested that you don't modify this file.  Instead, load a new stylesheet after
this one in your layouts (eg formtastic_changes.css) and override the styles to suit your needs.
This will allow you to update formtastic.css with new releases without clobbering your own changes.

This stylesheet forms part of the Formtastic Rails Plugin
(c) 2008 Justin French

--------------------------------------------------------------------------------------------------*/


/* NORMALIZE AND RESET
--------------------------------------------------------------------------------------------------*/

/* obviously inspired by Yahoo's reset.css, but scoped to just form.formtastic elements that we care about */
form.formtastic, form.formtastic ul, form.formtastic ol, form.formtastic li, form.formtastic fieldset, form.formtastic legend, form.formtastic input, form.formtastic textarea, form.formtastic p { margin:0; padding:0; }
form.formtastic fieldset { border:0; }
form.formtastic em, form.formtastic strong { font-style:normal; font-weight:normal; }
form.formtastic li { list-style:none; }
form.formtastic abbr, form.formtastic acronym { border:0; font-variant:normal; }
form.formtastic input, form.formtastic textarea, form.formtastic select { font-family:inherit; font-size:inherit; font-weight:inherit; }
form.formtastic input, form.formtastic textarea, form.formtastic select { font-size:100%; }
form.formtastic legend { color:#000; }

/* Rails wraps error fields with divs */
div.fieldWithErrors { display:inline; margin:0; padding:0; }


/* FIELDSETS & LISTS
--------------------------------------------------------------------------------------------------*/

form.formtastic fieldset { }
form.formtastic fieldset.inputs { border-top:1px solid #eee; }
form.formtastic fieldset.buttons { padding:10px; }
form.formtastic fieldset ol { }

/* clearfixing the fieldsets */
form.formtastic fieldset { display: inline-block; }
form.formtastic fieldset:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
html[xmlns] form.formtastic fieldset { display: block; }
* html form.formtastic fieldset { height: 1%; }


/* INPUT LIs
--------------------------------------------------------------------------------------------------*/

form.formtastic fieldset ol li { border-bottom:1px solid #eee; padding:5px; }

/* clearfixing the li's */
form.formtastic fieldset ol li { display: inline-block; }
form.formtastic fieldset ol li:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
html[xmlns] form.formtastic fieldset ol li { display: block; }
* html form.formtastic fieldset ol li { height: 1%; }

form.formtastic fieldset ol li.required {  }
form.formtastic fieldset ol li.optional {  }
form.formtastic fieldset ol li.error { background:#FFCCCC; }
  

/* LABELS
--------------------------------------------------------------------------------------------------*/
  
form.formtastic fieldset ol li label { display:block; width:25%; float:left; }


/* INLINE HINTS
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li p.inline-hints { color:#666; margin:0.5em 0 0 25%; }


/* INLINE ERRORS
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li p.inline-errors { color:red; margin:0.5em 0 0 25%; }

/* STRING & NUMERIC OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.string input { width:74%; }
form.formtastic fieldset ol li.numeric input { width:74%; }

/* TEXTAREA OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.text textarea { width:74%; }


/* BOOLEAN (CHECKBOX) OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.boolean label { padding-left:25%; width:auto; }
form.formtastic fieldset ol li.boolean label input { margin:0 0.5em 0 0.2em; }


/* BELONGS_TO (RADIO) OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.radio fieldset { }
form.formtastic fieldset ol li.radio fieldset legend { display:block; float:left; width:25%; position:relative; }
form.formtastic fieldset ol li.radio fieldset legend span { }
form.formtastic fieldset ol li.radio fieldset ol { float:left; width:74%; }
form.formtastic fieldset ol li.radio fieldset ol li { padding:0; border:0; margin-bottom:.2em; }
form.formtastic fieldset ol li.radio fieldset ol li label { float:none; width:100%; }
form.formtastic fieldset ol li.radio fieldset ol li label input { margin-right:0.5em; }


/* DATE & TIME OVERRIDES
--------------------------------------------------------------------------------------------------*/

form.formtastic fieldset ol li.date fieldset,
form.formtastic fieldset ol li.time fieldset,
form.formtastic fieldset ol li.datetime fieldset {}

form.formtastic fieldset ol li.date fieldset legend,
form.formtastic fieldset ol li.time fieldset legend,
form.formtastic fieldset ol li.datetime fieldset legend,

form.formtastic fieldset ol li.date fieldset legend,
form.formtastic fieldset ol li.time fieldset legend,
form.formtastic fieldset ol li.datetime fieldset legend { display:block; float:left; width:25%; position:relative; }

form.formtastic fieldset ol li.date fieldset legend span,
form.formtastic fieldset ol li.time fieldset legend span,
form.formtastic fieldset ol li.datetime fieldset legend span {  }

form.formtastic fieldset ol li.date fieldset ol,
form.formtastic fieldset ol li.time fieldset ol,
form.formtastic fieldset ol li.datetime fieldset ol { float:left; width:74%; margin:0; padding:0; }

form.formtastic fieldset ol li.date fieldset ol li,
form.formtastic fieldset ol li.time fieldset ol li,
form.formtastic fieldset ol li.datetime fieldset ol li { float:left; width:auto; margin:0; padding:0; border:0; }

form.formtastic fieldset ol li.date fieldset ol li label,
form.formtastic fieldset ol li.time fieldset ol li label,
form.formtastic fieldset ol li.datetime fieldset ol li label { display:none; }

form.formtastic fieldset ol li.date fieldset ol li label input, 
form.formtastic fieldset ol li.time fieldset ol li label input, 
form.formtastic fieldset ol li.datetime fieldset ol li label input { display:inline; margin:0; padding:0;  }


/* -------------------------------------------------------------------------------------------------

Load this stylesheet after formtastic.css in your layouts to override the CSS to suit your needs.
This will allow you to update formtastic.css with new releases without clobbering your own changes.

For example, to make the inline hint paragraphs a little darker in color than the standard #666:

form.formtastic fieldset ol li p.inline-hints { color:#333; }

--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li label { display:block; width:100%; font-weight:bold; color:#333;line-height:2em; }
form.formtastic fieldset.inputs { border:none; }
form.formtastic fieldset ol li { border:none; }
form.formtastic fieldset ol li p.inline-errors { color:#C33; font-weight:bold; margin:0.5em 0 0 0; }
form.formtastic fieldset ol li.error { background:#FFCCCC;border:2px solid #C33;margin-bottom:1em;}

/* STRING & NUMERIC OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.string input { width:99%; }
form.formtastic fieldset ol li.numeric input { width:100%; }

/* TEXTAREA OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.text textarea { width:100%; }


/* BOOLEAN (CHECKBOX) OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.boolean label { padding-left:0; width:auto; }
form.formtastic fieldset ol li.boolean label input { margin:0 0.5em 0 0.2em; }


/* BELONGS_TO (RADIO) OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.radio fieldset legend { display:block; width:100%; position:relative; }
form.formtastic fieldset ol li.radio fieldset ol { float:left; width:100%; }
form.formtastic fieldset ol li.radio fieldset ol li { padding:0; border:0; margin-bottom:.2em; }
form.formtastic fieldset ol li.radio fieldset ol li label { float:none; width:100%; }
form.formtastic fieldset ol li.radio fieldset ol li label input { margin-right:0.5em; }

form.formtastic fieldset.buttons {clear:both;border-top:1px solid #777;}
form.formtastic fieldset.buttons li {float:right;}
form.formtastic fieldset.buttons input {font-size:120%; font-weight:bold;padding: 0.25em 0.5em}

.calendar_date_select {
  color:white;
  border:#777 1px solid;
  display:block;
  width:195px;
  z-index: 1000;
}
/* this is a fun ie6 hack to get drop downs to stay behind the popup window.  This should always be just underneath .calendar_date_select */
iframe.ie6_blocker {
  position: absolute;
  z-index: 999;
}

.calendar_date_select thead th {
  font-weight:bold;
  background-color: #000;
  border-top:1px solid #777;
  border-bottom:2px solid #333;
  color: white !important;
}

.calendar_date_select .cds_buttons {
  text-align:center;
  padding:5px 0px;
  background-color: #555;
}

.calendar_date_select .cds_footer {
  background-color: black;
  padding:3px;
  font-size:12px;
  text-align:center;
}

.calendar_date_select table {
  margin: 0px;
  padding: 0px;
}


.calendar_date_select .cds_header {
  background-color: #ccc;
  border-bottom: 2px solid #aaa;
  text-align:center;
}

.calendar_date_select .cds_header span {
  font-size:15px;
  color: black;
  font-weight: bold;
}

.calendar_date_select select { font-size:11px;}

.calendar_date_select .cds_header a:hover {
  color: white;
}
.calendar_date_select .cds_header a {
  width:22px;
  height:20px;
  text-decoration: none;
  font-size:14px;
  color:black !important;
}

.calendar_date_select .cds_header a.prev {
  float:left;
}
.calendar_date_select .cds_header a.next {
  float:right;
}
.calendar_date_select .cds_header a.close {
  float:right;
  display:none;
}

.calendar_date_select .cds_header select.month {
  width:90px;
}

.calendar_date_select .cds_header select.year {
  width:61px;
}

.calendar_date_select .cds_buttons a {
  color: white;
  font-size: 9px;
}
.calendar_date_select td {
  font-size:12px;
  width: 24px;
  height: 21px;
  text-align:center;
  vertical-align: middle;
  background-color: #666666;
}
.calendar_date_select td.weekend {
  background-color: #606060;
}

.calendar_date_select td div {
  color: #fff;
}
.calendar_date_select td div.other {
  color: #888;
}
.calendar_date_select td.selected div {
  color:black;
}

.calendar_date_select tbody td {
  border-bottom: 1px solid #555;
}
.calendar_date_select td.selected {
  background-color:white;
}

.calendar_date_select td:hover {
  background-color:#ccc;
}

.calendar_date_select td.today {
  border: 1px dashed #999;
}

.calendar_date_select td.disabled div {
  color: #454545;
}


.fieldWithErrors .calendar_date_select {
  border: 2px solid red;
}