/**********************************************************************************************

	CSS on Sails
	Title: Malibu
	Author: Oxford Media Works
	Date: May 2009

***********************************************************************************************
		
	1. BASE
			1.1 Reset
			1.2 Accessibility Navigation & Hide
			1.3 Default Styles
			1.4 Combined Styles
	
  2. LAYOUT
			2.1 Clearfix
			2.2 Columns
			
	3. HEADER
	    3.1 Quick Links
	    3.2 Collage
	    3.3 Site Name
	    3.4 Search
	
  4. NAVIGATION
  
  5. CONTENT
	    5.1 Sections
	    5.2 Headers
	    5.3 Body
	    5.4 Miscellaneous 
	    5.5 Specific
	    
	6. FOOTER

***********************************************************************************************/


/* 1. =BASE
-----------------------------------------------------------------------------------------------
===============================================================================================*/	

/* 1.1 Reset
-----------------------------------------------------------------------------------------------*/	

html, body, div, span,  object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strike, strong, sub, sup, tt, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { 
  background: transparent; 
  border: 0;
  font-size: 100%;
  margin: 0;
  padding: 0;
  vertical-align: baseline;
}

body { 
  line-height: 1; 
}

ol, ul { 
  list-style: none; 
}

blockquote, q { 
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after { 
  content: ''; 
  content: none; 
}

ins, del { 
  text-decoration: none; 
}

button, input, textarea, select, option, optgroup {
  font: inherit;
  margin: 0;
}

/* 1.2 Accessibility Navigation & Hide
-----------------------------------------------------------------------------------------------*/	

ol#accessibility-nav,
.hidden { 
  height: 1px;
  left: -999em;
  position: absolute;
  top: -999em;
  width: 1px;
}

/* 1.3 Default Styles
-----------------------------------------------------------------------------------------------*/

body { 
  background: #fff url("../images/bg_body.png");
  color: #fff;
  font: normal 62.5% "Trebuchet MS", Arial, sans-serif; /* 10px */
}

del { 
  text-decoration: line-through; 
}

table { 
  border-collapse: collapse;
  border-spacing: 0;
}

td {
	color: #000;
}
address { 
  font-style: normal;
}

abbr, acronym { 
  border-bottom: 1px dotted #999;
  cursor: help;
}

a {
  color: #1566ab;
}

a:hover,
a:focus {
  text-decoration: none;
  color: #000;
}

/* 1.4 Combined Styles
-----------------------------------------------------------------------------------------------*/

dt a,
.header-minor a,
.article .header-article {
  background: url("../images/bullet_headline.png") no-repeat 0 5px;
  padding-left: 9px;
}

#navigation a,
.header-minor a,
.article .header-article a,
.photos .more,
.button a,
.quick-links li a,
.section .header-panel a {
  text-decoration: none
}

/* 2. LAYOUT
-----------------------------------------------------------------------------------------------
===============================================================================================*/	

#header,
#main,
#footer {
  margin: 0 auto;
  width: 934px;
  font-size: 1.3em; /* 10px → 13px */
  color: #000;
}


/* 2.1 Clearfix
-----------------------------------------------------------------------------------------------*/

.columns:after,
.quick-links:after,
.quick-links ul:after,
#navigation ul:after,
.banners:after,
.calendar dl:after,
.photos .body:after,
#footer .legal:after,
#footer .legal ul:after {
  content: "";
  display: block;
  height: 0;
  overflow: hidden;
  clear: both;
}

/* 2.2 Columns
-----------------------------------------------------------------------------------------------*/

.columns {
  margin: 0 40px;
}

.columns.main-aside {
  margin: 0 27px 0 40px;
  background: url("../images/bg_columns_mainaside.png") no-repeat 100% 100%;
}

.columns.aside-main {
  margin: 0 36px 0 35px;
  background: url("../images/bg_columns_asidemain.png") no-repeat 0 0;
}

.columns .primary,
.columns .secondary {
  float: left;
  width: 50%;
}

.columns.main-aside .primary {
  width: 561px;
  padding-right: 11px;
}

.columns.main-aside .secondary {
  width: 264px;
  padding: 0 11px 18px 20px;
  background: url("../images/bg_columns_mainaside_aside.png") no-repeat 100% 0;
}

.columns.aside-main .primary {
  width: 611px;
  float: right;
}

.columns.aside-main .secondary {
  width: 227px;
  padding-right: 25px;
}

/* 3. =HEADER
-----------------------------------------------------------------------------------------------
===============================================================================================*/

#header {
  position: relative;
  z-index: 9999;
  padding-top: 299px;
}

#header.compact {
  padding-top: 239px;
}

/* 3.1 Quick Links
-----------------------------------------------------------------------------------------------*/

.quick-links {
  background: url("../images/bg_quicklinks.png") no-repeat 100% 0;
  position: absolute;
  width: 630px;
  right: 11px;
  top: 11px;
  z-index: 30;
}

.quick-links ul {
  float: right;
  padding: 1px 24px 0 30px;
  font-family: Tahoma, Verdana, Arial, "Helvetica Neue", Tahoma, Verdana, Geneva, sans-serif;
  font-size: 0.846em; /* 13px → 11px */
}

.quick-links li {
  float: left;
  background: url("../images/separator_quicklinks.png") no-repeat 0 50%;
  padding-left: 2px;
  padding-right: 6px;
}

.quick-links li:first-child {
  padding-left: 0;
  background: none;
}

.quick-links li a {
  display: block;
  background: url("../images/bullet_quicklinks.png") no-repeat 6px 13px;
  padding: 7px 0 5px 15px;
  color: #0c2d47;
}

.quick-links span.bottom {
  /* FIXME */
  display: block;
  height: 1px;
  overflow: hidden;
  background: url("../images/bg_quicklinks_border.png") no-repeat 100% 100%;
  clear: both;
  position: relative;
  top: 1px;
}

/* 3.2 Collage
-----------------------------------------------------------------------------------------------*/

.collage span {
  position: absolute;
  background: url("../images/bg_top.png") no-repeat;
  height: 299px;
  width: 100%;
  left: 0;
  top: 0;
  z-index: 20;
}

#header.compact .collage span {
  background-image: url("../images/bg_top_small.png");
  height: 239px;
}

.collage img {
  position: absolute;
  left: 12px;
  top: 39px;
  z-index: 10;
  background-color: #fff;
}

/* 3.3 Site Name
-----------------------------------------------------------------------------------------------*/

.site-name {
  display: block;
  position: absolute;
  right: 82px;
  top: 83px;
  width: 163px;
  height: 164px;
  background: url("../images/logo_malibu.png") no-repeat;
  z-index: 40;
  text-indent: -1000em;
}

#header.compact .site-name {
  top: 49px;
  background-image: url("../images/logo_malibu_small.png");
  width: 151px;
  height: 152px;
}

.site-name:focus {
  outline: 0;
}

/* 3.4 Search
-----------------------------------------------------------------------------------------------*/

#header legend {
  display: none;
}

#header form {
  position: absolute;
  top: 263px;
  left: 647px;
  z-index: 50;
  font-size: 0.923em; /* 13px → 12px */
}

#header.compact form {
  top: 203px;
}

#search {
  border: 0;
  background: #fff url("../images/bg_search.png") no-repeat;
  width: 127px;
  padding: 5px;
  height: 14px;
}

#search-submit {
  border: 0;
  padding: 0;
  background: url("../images/bg_search_button.png") no-repeat;
  width: 52px;
  height: 17px;
  line-height: 17px;
  color: #fff;
  cursor: pointer;
}

#search-submit::-moz-focus-inner {
  padding: 0;
  border: 0;
}


/* 4. =NAVIGATION
-----------------------------------------------------------------------------------------------
===============================================================================================*/

#navigation {
  background: url("../images/bg_navigation.png") no-repeat 0 100%;
  padding-bottom: 19px;
  font-size: 0.962em; /* 13px → 12.5px */
}

#navigation ul {
  background: url("../images/bg_navigation_top.png") no-repeat;
  margin: 0 36px 0 39px;
  padding: 0 25px;
}

#navigation li {
  background: url("../images/separator_navigation.png") no-repeat 0 50%;
  padding-left: 2px;
  float: left;
}

#navigation li.first {
  padding-left: 0;
  background: none;
}

#navigation li a {
  display: block;
  padding: 7px 10px 7px 20px;
  background: url("../images/bullet_navigation.png") no-repeat 10px 50%;
  color: #0f0f0f;
}

#navigation ul ul {
  position: absolute;
  display: none;
  margin: -0.5em 0 0 0;
  width: 180px;
  background: #d8e6f1;
  border: 1px solid #7aa9d3;
  padding: 1px;
  z-index: 1000;
}

.js #navigation ul ul {
  margin-top: -1px;
}

#navigation ul ul ul,
.js #navigation ul ul ul {
  margin: -1.85em 0 0 180px;
}

#navigation ul ul li {
  float: none;
  padding: 3px 0;
  background: none;
  border-bottom: 1px solid #c3d2de;
}

#navigation ul ul li.last {
	border-bottom: none; }

#navigation ul ul li a {
  background: none;
  padding: 2px 5px;
}

#navigation ul ul li:hover,
#navigation ul ul li a:hover,
#navigation ul ul li a:focus {
  background-color: #9ec1de;
  color: #fff;
}

#navigation .parent {
  background: url("../images/icon_arrow.png") no-repeat 100% 50%;
}

#navigation .parent ul a {
  background: none;
}

#navigation ul li:hover ul {
  display: block;
}

#navigation ul li:hover ul ul {
  display: none;
}

#navigation ul ul li:hover ul {
  display: block;
}

/* 5. =CONTENT
-----------------------------------------------------------------------------------------------
===============================================================================================*/

#main {
  background: url("../images/bg_main.png") repeat-y;
}

#content ul {
	margin-bottom: 1em;
}
#content H2, #content H3, #content H4, #content H5, #content H6 {
	color: #125288;
	margin-bottom: 1em;
}  
#content H2 {
	font-size: 1.2em;
}
#content H3 {
	font-size: 1.1em;
}

#content H4 {
	font-size: 1em;
}
#content H5 {
	font-size: .95em;
}
#content H6 {
	font-size: .9em;
}

/* 5.1 Sections
-----------------------------------------------------------------------------------------------*/

.section {
  margin-bottom: 18px;
}

.section,
.section span.bottom {
  display: block;
  background-repeat: no-repeat;
}

/* closed */

.section.closed {
  background-image: url("../images/bg_section_closed.png");
  padding: 14px 22px 0;
}

.section.closed span.bottom {
  height: 14px;
  margin: 0 -22px;
  overflow: hidden;
  background-image: url("../images/bg_section_closed_bottom.png");
}

/* open */

.section.open {
  background-image: url("../images/bg_section_open.png");
  padding: 19px 27px 0 23px;
}

/* panel */

.section.panel .header-panel {
  background: url("../images/bg_section_panel_header.png") no-repeat;
  font-family: Arial, sans-serif;
  padding: 11px 8px 2px 21px;
}

.section .header-panel a {
  color: #000;
  background: url("../images/bullet_header_panel.png") no-repeat 0 3px; /* FIXME */
  padding-left: 11px;
}

.section.panel .body {
  background: url("../images/bg_section_panel.png") no-repeat 0 100%;
  padding: 0 3px 3px;
}

.section.panel span.top {
  display: block;
  background: #8a9095 url("../images/bg_section_panel_line.png") no-repeat;
  height: 1px;
  margin: 0 1px;
  overflow: hidden;
}

/* panel, alternative */

.section.panel.alternative .header-panel {
  background-image: url("../images/bg_section_panel_alt_header.png");
}

.section.panel.alternative .header-panel a {
  color: #fff;
}

.section.panel.alternative .body {
  background-image: url("../images/bg_section_panel_alt.png");
}

.section.panel.alternative span.top {
  background-color: #92989d;
  background-image: url("../images/bg_section_panel_alt_line.png");
}

/* calendar */

.calendar {
  position: relative;
}

.calendar .header-panel img {
  position: absolute;
  right: 10px;
  top: 6px;
}

.calendar .body {
  font-size: 0.923em; /* 13px → 12px */
  color: #0b0b0b;
}

.calendar dl {
  margin: 12px 12px 12px 20px;
}

.calendar .body dl a {
  color: #002c6f;
  display: block;
}

.calendar .body dt,
.calendar .body dd {
  padding-bottom: 5px;
}

.calendar .body dt {
  float: left;
  width: 65%;
  clear: left;
}

.calendar .body dd {
  width: 35%;
  text-align: right;
  float: right;
}

.calendar .more {
  margin: 0 12px 12px 0;
}

.calendar .more a {
  color: #c13200;
}

/* photos */

.photos img, 
.photos object {
  display: block;
  margin: 7px auto;
}

.photos .more {
  float: right;
  margin: 0 17px 10px 0;
  color: #fff;
  font-size: 0.923em; /* 13px → 12px */
  color: #d9eeff;
}

.photos .more,
.photos .more span {
  display: block;
  background: url("../images/bg_button_small.png") no-repeat;
}

.photos .more span {
  background-position: 100% -24px;
  padding: 4px 12px 5px 17px;
}

/* links-gallery */

.links-gallery {
  padding: 27px 12px 0;
}

.links-gallery h2 {
	color: #002c6f;
	font-size: 1.1em;
	margin: 0 0 .5em 0;
}

.links-gallery dt {
	font-size: .9em;
	margin-bottom: .5em;
	line-height: 140%;
}
.links-gallery ul {
  list-style-type: none !important;
  margin-left: 0px;
   
 
}
.links-gallery li {
  font-size: .9em;
  list-style: none !important;
  padding-left: 10px !important;
  line-height: 140%;
  margin: 2px 0;
  background: url("../images/bullet_quicklinks.png") no-repeat 0 6px;
 
}

.links-gallery img {
  display: block;
  margin: 30px auto 0;
}

.links-gallery a {
  color: #002c6f;
  text-decoration: none;
  display: block !important;
}

.links-gallery a:hover {
  text-decoration: underline;
}

.links-gallery .on {
	font-weight: bold;
}
/* 5.2 Headers
-----------------------------------------------------------------------------------------------*/

.header-section {
  background: url("../images/bullet_header_major.png") no-repeat;
  color: #037b00;
  font-size: 1.077em; /* 13px → 14px */
  line-height: 1.214em; /* 14px → 17px */
  padding-left: 25px;
  padding-top: 2px;
  margin-bottom: 12px;
}

.section.open .header-section {
  background: none;
  font-size: 1.385em; /* 13px → 18px */
  line-height: 1em; /* 18px */
  color: #176ab0;
  text-transform: uppercase;
  text-align: left;
  font-family: Arial, "Helvetica Neue", Tahoma, Verdana, Geneva, sans-serif;
  padding: 35px 0 0 0;
  margin: 0 0 10px 0;
}

h1.header-section {
	line-height: 125%!important;
}

.header-minor {
  text-transform: uppercase;
  margin: 0 0 14px 0;
  padding-top: 10px;
  clear: left;
}

.header-minor a {
  color: #3c3c3c;
}

/* 5.3 Body
-----------------------------------------------------------------------------------------------*/

.section li {
  list-style-position: inside;
}

.section ul li {
  list-style-type: disc;
  padding-left: 10px;
  line-height: 140%;
  margin-bottom: .3em;

}
.section ul li ul  {
	padding-bottom: 10px;
}
.section ul li ul li {
	padding-left: 20px;
}

.section ol li {
  list-style-type: decimal;
}

/* article */

.article .header {
  font-weight: bold;
  margin-bottom: 5px;
}

.article .header-article {
  display: inline;
}

.article .header-article a {
  color: #292929;
}

.article .thumbnail {
  float: left;
  border: 1px solid #8099ad;
  padding: 1px;
  background-color: #fff;
  margin-right: 12px;
}

.article .thumbnail.alternative {
  float: right;
  margin-right: 0;
  margin-left: 12px;
}

.article .more {
  font-size: 0.923em; /* 13px → 12px */
}

.article .more a {
  background: url("../images/bullet_article_more.png") no-repeat 0 5px; /* FIXME */
  padding-left: 7px;
}

/* links */
.breadcrumbs {
	padding: 0;
	margin: -12px 30px 0 0;
	border: 0px solid red;
}
.breadcrumbs a {
	text-decoration: none;
}
.breadcrumbs a:hover {
	text-decoration: underline;
}

.more {
  text-align: right;
}

.more a,
a.more {
  color: #ff6000;
}

blockquote {
	background-color: #EFEFEF;
	border-bottom: 5px solid #244D77;
	border-right: 1px solid #E7E7EB;
	border-top: 5px solid #244D77;
	color: #000000;
	margin: 10px 0 10px 0;
	padding: 10px 8px 10px 8px;
	font-style: italic;
	line-height: 140%;
}
/* list columns */

.section .columns {
  margin: 0;
}

.section ul.columns li {
  float: left;
  width: 48%;
  padding-left: 2%;
  list-style-type:none;
  font-size: .9em;
}

/* open */

.section.open p,
.section.open dl {
  margin-bottom: 10px;
  line-height: 140%;
}

.section.open dl {
  font-size: 0.923em; /* 13px → 12px */
}

.section.open dt a {
  padding-left: 11px;
}

.section.open dd {
  padding-left: 11px;
  margin: 5px 0 10px 0;
}

.section.open dd p {
  margin-bottom: 0;
  line-height: 140%;
}


/* 5.4 Miscellaneous 
-----------------------------------------------------------------------------------------------*/

.banners {
  margin-right: -11px;
}

.banners li {
  float: left;
  width: auto;
  list-style: none;
}

.button {
  margin-left: 10px;
  margin-right: 10px;
  padding-bottom: 6px;
}

.button a,
.button span {
  background: url("../images/bg_button.png") no-repeat;
  display: block;
}

.button a {
  margin: 0 7px;
  color: #d9eeff;
  text-align: center;
}

.button a span {
  background-position: -230px 100%;
  padding: 7px 0 9px;
}

.button a span span {
  display: inline;
  background: url("../images/bullet_headline.png") no-repeat 0 5px;
  padding: 0 0 0 10px;

}

.postdate {
	color: #5C89B0;
	font-style: italic;
}

.email {
	background: url(../images/mail.gif) no-repeat left;
	padding-left: 20px;
	margin: 1em 0 0 1.5em;
}
.rss {
	background: transparent url(../images/feed-icon16.gif) no-repeat scroll left center;
	margin: 1em 0 0 0em;
	padding: .25em 0 0 20px;
}
.separated {
  background: url("../images/separator_dotted.png") repeat-x 0 100%;
  padding-bottom: 2px;
}

.button.separated {
  padding-bottom: 8px;
}

.flabel {
	vertical-align: top;
	padding-right: 10px;
}

.nextprev {
	font-size: .8em;
	text-align: center;
	margin: 0 0 0 0;
	padding: 12px;
}
.nextprev a:link, .nextprev a:visited {
	background-color: #fff;
	border: 1px solid #ddd;
	padding: 4px;
	text-decoration: none !important;
}
.nextprev a:hover {
	background-color: #eee;
	border: 1px solid #176AB0;
	color: #176AB0 !important;
	padding: 4px;
	text-decoration: none !important;
}
.paging {
	text-align: center;
}
.paging a:link, .paging a:visited {
	background-color: #fff;
	border: 1px solid #ddd;
	padding: 4px;
	text-decoration: none;
}
.paging a:hover {
	background-color: #eee;
	border: 1px solid #176AB0;
	padding: 4px;
	text-decoration: none;
}
/* 5.4.4 Calendar
-----------------------------------------------------------------------------------------------*/
.calmonthnav {
	text-align: center;
	padding-bottom: 10px ;
}
.callink  {
	font-size: .75em;
	background: url(../images/calendar.gif) no-repeat left;
	padding-left: 10px;
	margin: 1em 0 1em 1.5em;
}
.callink a:link, .callink a:visited {
	text-decoration: none;
}
.callink a:hover {
	text-decoration: underline !important;
}
.calhelp {
	font-size: .9em;
	background: url(../images/add_10.gif) no-repeat left;
	padding: 10px 0 10px 15px;
}
.calnav, .calnav:focus {
		background: #346DAA; 
		border: 1px solid #244D77; 
		color: white;
		font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
		font-size: .8em;
}
.eventlink {
	font-size: .75em;
	line-height: 110%;
	margin-bottom: 1.2em;
}
.eventlink a:link, .eventlink a:visited {
	font-size: .75em !important;
	text-decoration: none !important;
}
.eventlink a:hover, .eventlink a:active {
	text-decoration: underline !important;
}
.today {
	background: #eee;
}
#calendargrid {
	width: 575px;
	font-size: 1.2em;
}
#calendargrid table {
	width: 100%;
	border-collapse: collapse:
}
#calendargrid table td, #calendargrid table th {
	border: solid 1px #5C89B0;
	vertical-align: top!important;
		border-collapse: collapse;
}
#calendargrid table th {
	background: #eee;
}
#calendargrid table tr td table  {
		border: solid white 0px;
		padding: 0;
		margin: 0;
}
#calendargrid table tr td table tr td {
		border: solid white 0px;
		padding: 0;
		margin: 0;
}
#EventDetail {
	margin: 1.5em 0 0 5px;
	border: dotted 0px #003599;
}
.content #EventDetail h2 {
	font-size: 1.6em !important;
	margin-top: 4px !important;
	margin-bottom: 6px !important;
}
#EventDetail p {
	margin-left: 0px;
}
#EventDetail h2 a:link, EventDetail h2 a:visited {
	margin-left: 0;
}
#EventDetail h2 a:hover {
	text-decoration: underline;
}
#EventDetail .dates {
	font-size: 1.2em;
	font-weight: bold;
	color: #7f3818;
	margin-top: 2em;
	display: block;
}
#EventDetail .audiolink {
	font-size: .75em;
	background: url(../images/web.gif) no-repeat left;
	padding-left: 20px;
	margin: 0 0 .5em 0;
}
#EventDetail .calmainlink {
	font-size: .75em;
	background: url(../images/calendar.gif) no-repeat left;
	padding: 5px 0 0 20px;
	margin: 1em 0 .5em 0;
	clear: left;
}
.calmainlink a:link, .calmainlink a:visited {
	text-decoration: none !important;
}
.calmainlink a:hover, .calmainlink a:active {
	text-decoration: underline !important;
}
#EventDetail .icallink {
	font-size: .75em;
	background: url(../images/add_10.gif) no-repeat left;
	padding-left: 15px;
	margin: 1em 0 .5em 0;
	clear: left;
}
.icallink a:link, .icallink a:visited {
	text-decoration: none !important;
}
.icallink a:hover, .icallink a:active {
	text-decoration: underline !important;
}

/* 5.5 Specific
-----------------------------------------------------------------------------------------------*/

.columns.main-aside .primary .section ul.columns li {
  padding-left: 10px;
}

.columns.main-aside .primary .section ul.columns li {
  width: 248px;
}
.listoptions {
	padding: .25em 0;
}

#content table {
  border: solid #003569 1px;
  border-collapse: collapse;
  margin: 1em auto;
  width: 90%;
}
#content table th {
 text-align: center;
 background-color: #244D77;
 color: #fff;
 padding: 2px;
 border: solid #003569 1px;
}
#content table td {
 padding: 4px;
 border: solid #244D77 1px;
 text-align: left;
}
#content td {
	padding: 5px;
}

#content table.noborders, #content table.noborders td {
	border: none;
}

.contentimage {
	float: right;
	padding: 0 0px 20px 10px;
}

.imgleft {
	float: left;
	margin: 0 1em .5em 0;
}
.imgright {
	float: right;
	margin: 0 0 .5em 1em;
}	
.boxtext {
	border: 1px solid #206ba4;
	background: #eee;
	padding: .5em;
}
.centerblock {
	text-align: center;
}
.urgent {
	font-size: 1.1em;
	color: #7f3818;
	font-weight: bold;
}
.smaller {
	font-size: .75em;
}

.hrnav {
   margin: 1.5em auto;
   width: 50%;
}

/* 6. FOOTER
-----------------------------------------------------------------------------------------------
===============================================================================================*/	
#footer {
	text-align: center;
}

#footer .contact {
  background: url("../images/bg_footer.png") no-repeat 0 100%;
  padding: 10px 49px 29px; 
}

#footer .contact dt,
#footer .contact dd {
  display: inline;
}

#footer .contact dt {
  color: #1262a5;
}

#footer .contact dd {
  padding-right: 1ex;
}

#footer .legal {
  padding: 10px 73px 27px;
  font-size: 0.923em; /* 13px → 12px */
  color: #fff;
}

#footer .legal ul,
#footer .legal li {
  float: left;
}

#footer .legal li {
  padding-right: 0.5ex;
}

#footer .legal address {
  float: right;
}

#footer .legal li,
#footer .legal li a {
  color: #ffe681;
}

#footer .legal address a {
  color: #fff;
}