@import "woople-theme/variables.css.less";
@import "woople-theme/colours.css.less";

body {
  background:@background;
}

body > .container {
  margin-bottom:40px;
}

.close-navigation, .navigation {
  display:none;
}

a {
  color:@primary;
}

a:hover {
  color:@primary;
}

#masthead {
  padding-top:@logoSize;
  padding-bottom:@logoSize;
  height:@logoSize;
  position:relative;
  z-index:1000;

  .masthead-logo {
    width:140px;
  }
}

.copyright {
  float:right;
  clear: left;
  text-align:right;
  margin-right:30px;
  margin-top:15px;
  color:rgba(0,0,0,0.5);
}

.nowrap {
  white-space: nowrap;
}

@media (max-width: 768px) {
  .container > .row {
    margin-left:0;
  }

  #masthead {
    .masthead-logo {
      display:block;
      margin-left:auto;
      margin-right:auto;
    }
  }

  #body-container {
    position:relative;
    top:0;
    left:0;
    width:100%;
    float: left;
  }

  body {
    padding:0;
  }

  body > .container {
    margin-left:0;
    margin-right:0;
    overflow-x: visible;
  }

  .close-navigation {
    z-index:1002;
  }

  .navigation {
    display:block;
    z-index:1001;
    text-decoration: none;

    .icon-menu {
      background:url(/assets/woople-theme/icons/menu.png);
      background-position:0 50%;
      background-repeat: no-repeat;
    }
  }

  .navigation, .close-navigation {
    position:absolute;
    margin-right:0;
    margin-bottom:0;
    width:50%;
    line-height:@logoWithPadding;
    text-indent:@phoneMargin;
  }

  #navigation:target .close-navigation {
    display:block;
    left:0;
  }

  #navigation:target .navigation {
    display:none;
  }

  #navigation:target {
    width:100%;
    overflow: hidden;
  }
}


a.loading_indicator {
  outline: none;
  display: inline-block;

  span {
    display: inline;

    .spinner {
      display: inline-block;
      position: relative;
      padding-left: 0.6em;
      top: -0.4em;
    }
  }
}

.impersonation-banner {
  background: @contentBackground;
  line-height: 24px;
  padding: 4px 1em;
  margin: 0 auto;
  width: 80%;
  text-align: center;
  .box-shadow(@default-shadow);
  .hanging-border-radius(8px);
}

.breadcrumb {
  .border-radius(0);
  .box-shadow(0);
  border-right: 0;
  border-left: 0;
  border-top: 0;
  margin-bottom: 0;
  color: #555;
  .divider {
    color: #555;
    padding: 0;
  }
}

@media (min-width: 768px) {
  .impersonation-banner {
    .span6:first-child {
      text-align: right;
    }
    .span6:last-child {
      text-align: left;
    }
  }
}