body {
	background:#fff url(../img/layout/body/background.jpg) top left no-repeat;
	background-attachment: fixed;
}

#container {
	margin:0 auto;
	max-width:800px;
}

.skip-link {
	background:#1277be;
	color:#fff;
	display:block;
	font-size:13px;
	font-weight:bold;
	left:-9999px;
	padding:10px 20px;
	position:absolute;
	top:0;
	z-index:100;
}

.skip-link:focus {
	color:#fff;
	left:0;
}

#header {
	overflow:auto;
	width:100%;
}

#header .logo {
	float:right;
	padding:56px 40px 21px 0;
	width:181px;
}

#header .banner {
	margin:10px 0 0 0;
	max-width:800px;
}

#header .banner img {
  height:auto;
  width:100%;
}

.main-menu {
	background:#1277be;
	clear:both;
	height:56px;
	overflow:hidden;
}

.main-menu ul {
	float:right;
	list-style:none;
	margin:0;
	overflow:visible;
	width:auto;
}

.main-menu ul li {
	float:left;
}

.main-menu ul li a {
	color:#fff;
	display:block;
	font-size:14px;
	font-weight:bold;
	line-height:56px;
	padding:0 20px;
}

.main-menu ul li a.active,
.main-menu ul li a:hover {
	background:#444;
}

@media only screen and (max-width: 800px) {
  .main-menu ul li a {
    padding:0 10px;
  }
}

@media only screen and (max-width: 650px) {
  body {
    background:none;
  }

  .main-menu {
    height:42px;
  }

  .main-menu ul li a {
    font-size:12px;
    line-height:42px;
  }
}

@media only screen and (max-width: 560px) {
  #header .logo {
    float:none;
    margin:0 auto;
    padding:21px 0;
  }

  .main-menu:before {
    content: "Menu \f0c9";
    color:#fff;
    display:inline-block;
    float:right;
    font: normal normal normal 22px/1 FontAwesome;
    padding:10px;
    text-rendering: auto;
    text-align:center;
    -webkit-font-smoothing: antialiased;
  }

  .main-menu ul {
    display:none;
  }

  .main-menu.show-menu {
    height:auto;
    overflow:auto;
  }

  .main-menu.show-menu ul {
    border-top:1px solid #fff;
    float:left;
    display:block;
    width:100%;
  }

  .main-menu.show-menu ul li {
    text-align:center;
    width:33.33%;
  }

  .main-menu.show-menu ul li a {
    font-size:14px;
  }
}

@media only screen and (max-width: 400px) {
  .main-menu.show-menu ul li {
    text-align:center;
    width:50%;
  }
}

#body {
	overflow:auto;
	padding:30px 28px;
}

@media only screen and (max-width: 400px) {
  #body {
    padding:15px;
  }
}

.home #content {
	float:left;
	width:60%;
}

@media only screen and (max-width: 600px) {
  .home #content {
    float:none;
    width:100%;
  }
}

#content h1 {
	color:#1277be;
	font-size:18px;
	margin:0 0 20px 0;
}

.home #content .content {
	padding:0 28px 0 0;
}

#content .content h2 {
	font-size:14px;
	margin:11px 0;
}

#content .content p {
	margin:11px 0;
}

#content .content dl dd h2 {
	font-size:13px;
	margin:0;
}

#content .content img {
  height:auto;
  max-width:100%;
}

#content .content p.view {
	background:url(../img/layout/icons/arrow.gif) no-repeat;
	line-height:16px;
	padding:0 0 0 22px;
}

#content .content ul {
	margin:0 0 11px 15px;
}

#content .content dl {
	margin:15px 0;
	overflow:auto;
	float:left;
	min-height:150px;
	width:50%;
}

@media only screen and (max-width: 600px) {
  #content .content dl {
    float:none;
    min-height:auto;
    width:100%;
  }
}

#content .content dl dt {
	float:left;
	width:125px;
}

#content .content dl dd {
  margin-left:125px;
}

@media only screen and (max-width: 400px) {
  #content .content p img {
    margin:12px 0;
    width:100%;
  }
}

#side {
	float:left;
	width:40%;
}

@media only screen and (max-width: 600px) {
  #side {
    float:none;
    width:100%;
  }
}

#footer {
	background:#f6f6f6;
	font-size:11px;
	padding:15px 30px 30px;
}

#footer a.safety-manual {
  color:#f6f6f6;
  float:right;
}

#footer a.safety-manual:hover {
  color:#1277be;
}

@media only screen and (max-width: 400px) {
  #footer {
    padding:15px 15px 30px;
  }
}

/** STOCKQUOTES **/

#stockquotes-block {
	float:right;
	padding:80px 0 0 0;
	width:auto;
}

#stockquotes-block a {
	font-weight: bold;
}

#stockquotes-block a,
#stockquotes-block span {
	margin:0 5px;
	overflow:auto;
	width:auto;
}

/** RENTALS BLOCK **/

#rentals_block h2 {
	font-size:18px;
	margin:0 0 20px 0;
}

#rentals_block .block dl {
	overflow:auto;
	width:100%;
}

#rentals_block .block dl dt {
	float:left;
	width:125px;
}

#rentals_block .block dl dd {
	margin:0 0 0 125px;
}

#rentals_block .block dl dd h3 {
	color:#1277be;
	font-weight:bold;
	margin:0 0 5px 0;
}

#rentals_block .block p.viewall {
	background:url(../img/layout/icons/arrow.gif) no-repeat;
	line-height:16px;
	margin:11px 0 0 0;
	padding:0 0 0 22px;
}

#certifications_block {
  clear:both;
  padding-top:30px;
}

#certifications_block .block {
  text-align:center;
}

#certifications_block .block a {
  display:inline-block;
  width:20%;
}

#certifications_block .block a img {
  height:auto;
  max-width:80%;
  vertical-align:middle;
}

/* COLORBOX MODAL — removed.

   This block styled jQuery Colorbox, which is not loaded on any page: no
   colorbox.js is included anywhere, the .colorbox() call in assets/js/default.js
   is commented out, and no page uses the rel="modal" hook it bound to. Every
   selector here (#colorbox, #cbox*) therefore matched nothing.

   Two of its background images had also gone missing from the theme —
   img/header/loader.gif and img/icons/disk.gif — so the rules were dangling as
   well as dead. The remaining modal-*.gif files are still in assets/img/icons/.

   The rentals page thumbnails currently link straight to the full-size JPEG,
   which is a working fallback. To bring the lightbox back, install Colorbox
   properly: its own JS and CSS plus its full image set, rather than restoring
   these orphaned rules. */
