.cb-audio {
  background-color: #1c2732;
  color: #1c2732; }

.cb-connect {
  background-color: #34495e;
  color: #34495e; }

.cb-radio {
  background-color: #4c6b8a;
  color: #4c6b8a; }

.cb-television {
  background-color: #a3b8cc;
  color: #a3b8cc; }

.cb-test {
  background-color: #df6c68;
  color: #df6c68; }

.cb-transmission, .cb-more {
  background-color: #d64541;
  color: #d64541; }

.cb-title {
  color: black; }

.cb-title {
  text-transform: uppercase; }

.cb-view-wrapper {
  padding: 0 2rem; }
  .cb-view-wrapper .cb-faded-hr {
    margin-top: 0; }

.cb-splash {
  text-align: center; }

.cb-inline-search {
  display: inline-block;
  padding: 0 5px; }
  .cb-inline-search input {
    width: 120px;
    text-align: center;
    border: none;
    border-bottom: 1px solid #000; }
  .cb-inline-search i {
    padding-right: 5px; }

ul {
  margin: 0;
  padding: 0;
  list-style-type: none; }

html {
  height: 100%; }

body {
  height: 100%;
  min-height: 100%; }

a {
  text-decoration: none; }
  a:link {
    color: #95a5a6; }
  a:visited {
    color: #95a5a6; }
  a:active {
    color: #34495e; }

/* Necessary when using Pure grids. */
body, button, input, select, textarea, .pure-g [class*='pure-u'] {
  font-family: 'Lato', sans-serif; }

header, header body, header button, header input, header select, header textarea, header .pure-g [class*='pure-u'],
footer,
footer body,
footer button,
footer input,
footer select,
footer textarea,
footer .pure-g [class*='pure-u'] {
  font-family: 'Montserrat', sans-serif;
  font-size: 9px;
  font-size: 0.9rem;
  line-height: 13.5px;
  line-height: 1.35rem;
  text-transform: uppercase;
  color: #95a5a6; }
header .cb-copyright,
footer .cb-copyright {
  font-size: 8px;
  font-size: 0.8rem;
  line-height: 12.0px;
  line-height: 1.2rem; }
header i,
footer i {
  color: #34495e; }

header {
  position: relative;
  text-align: center; }
  header .cb-search {
    padding-right: 1rem; }
    header .cb-search input {
      width: 160px;
      color: #34495e;
      /* TODO Check this - can I use a mixin to generate these..? */ }
      header .cb-search input ::-webkit-input-placeholder,
      header .cb-search input :-moz-placeholder,
      header .cb-search input ::-moz-placeholder,
      header .cb-search input :-ms-input-placeholder,
      header .cb-search input placeholder {
        color: #95a5a6; }
  header .cb-logo {
    position: absolute;
    top: 0.5rem;
    left: 1rem; }
    header .cb-logo, header .cb-logo img {
      height: 30px; }
  header .cb-nav .cb-active {
    color: #34495e; }
  header .cb-nav-wrapper {
    padding: 1rem 0; }

.cb-content-wrapper {
  min-height: 100%;
  display: table;
  height: 100%;
  width: 100%; }

.cb-main-view-container {
  overflow: auto;
  padding-bottom: 180px; }

footer {
  position: relative;
  clear: both;
  overflow: hidden;
  height: 180px;
  margin-top: -180px;
  text-align: center; }
  footer .cb-footer-wrapper {
    padding: 40px 0 20px 0; }
  footer li {
    padding-bottom: .4em; }

@media screen and (max-width: 639px) {
  html {
    font-size: 14px; }

  .cb-nav.cb-show {
    display: block; }

  .cb-nav,
  .cb-search {
    display: none; } }
@media screen and (min-width: 640px) {
  html {
    font-size: 16px; }

  .cb-menu {
    display: none; }

  .cb-nav {
    padding-right: 30px; }
    .cb-nav li {
      display: inline-block;
      padding-right: 1rem; }
      .cb-nav li:last-child {
        padding-right: 0; }

  .cb-search,
  .cb-nav {
    float: right; }

  .cb-search {
    margin-top: -2px;
    /* Making search line up with menu items */ }
    .cb-search input {
      border: 0; }
    .cb-search i {
      padding-right: .2rem; }

  .cb-main-view-container {
    padding-bottom: 150px; }

  footer {
    height: 150px;
    margin-top: -150px; } }
@media screen and (min-width: 1441px) {
  footer .pure-g [class*='pure-u'] {
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 18px;
    line-height: 1.8rem; } }
.cb-faded-hr {
  float: none;
  clear: both;
  width: 100%;
  height: 1px;
  margin: 1.4em 0;
  border: none;
  background: #ddd;
  background-image: -webkit-gradient(linear, left bottom, right bottom, color-stop(0, white), color-stop(0.1, #dddddd), color-stop(0.9, #dddddd), color-stop(1, white));
  background-image: -moz-linear-gradient(left center, white 0%, #dddddd 10%, #dddddd 90%, white 100%); }

/**
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    contenteditable attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that are clearfixed.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
.cf:before,
.cf:after {
  display: table;
  /* 2 */
  content: ' ';
  /* 1 */ }

.cf:after {
  clear: both; }

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.cf {
  *zoom: 1; }
