@import "../../css/forms-angular-bs2.less";
@import "../../bower_components/components-font-awesome/less/variables.less";
@import "../../bower_components/components-font-awesome/less/mixins.less";
@import "../../bower_components/components-font-awesome/less/path.less";
@import "../../bower_components/components-font-awesome/less/core.less";
@import "../../bower_components/components-font-awesome/less/bootstrap.less";
@import "../../bower_components/components-font-awesome/less/extras.less";
@import "../../bower_components/components-font-awesome/less/icons.less";

@FontAwesomePath:    "/styles/components-font-awesome/font";

// Use a free Bootswatch (http://bootswatch.com/) theme for the demo
@import "bootswatch-cerulean-2.3.2.less";
@import "variables-cerulean-2.3.2.less";

@import "demo-bs-common.less";

.big-box {
  height: 17em;
  padding : 21px;
}

.docs-sidenav.ui-scrollfix  {
  top: 50px;
}

.friend {
  float: left;
  margin: 7px;
  text-align: center;
  cursor: pointer;
  padding: 10px;
  min-height: 20px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  button.close {
    padding-left: 8px;
    float:none;
  }
}


/* Responsive
-------------------------------------------------- */

/* Desktop large
------------------------- */
@media (min-width: 1200px) {
  .docs-container {
    max-width: 970px;
  }
  .docs-sidenav {
    width: 258px;
  }
  .docs-sidenav > li > a {
    width: 230px \9; /* Override the previous IE8-9 hack */
  }
}

/* Desktop
------------------------- */
@media (max-width: 980px) {
  /* Unfloat brand */
  body > .navbar-fixed-top .brand {
    float: left;
    margin-left: 0;
    padding-left: 10px;
    padding-right: 10px;
  }

  /* Inline-block quick links for more spacing */
  .quick-links li {
    display: inline-block;
    margin: 5px;
  }

  /* When affixed, space properly */
  .docs-sidenav {
    top: 0;
    width: 218px;
    margin-top: 30px;
    margin-right: 0;
  }

  .subhead h1,
  .subhead .lead {
    margin-right: 0;
  }

  .carbonad {
    position: static;
    width: auto !important;
    margin-top: 30px !important;
  }

}

/* Tablet to desktop
------------------------- */
@media (min-width: 768px) and (max-width: 979px) {
  /* Remove any padding from the body */
  body {
    padding-top: 0;
  }
  /* Widen masthead and social buttons to fill body padding */
  .jumbotron {
    margin-top: -20px; /* Offset bottom margin on .navbar */
  }
  /* Adjust sidenav width */
  .docs-sidenav {
    width: 166px;
    margin-top: 20px;
  }
  .docs-sidenav.affix {
    top: 0;
  }
}

/* Tablet
------------------------- */
@media (max-width: 767px) {
  /* Remove any padding from the body */
  body {
    padding-top: 0;
  }

  /* Space out the show-grid examples */
  .show-grid [class*="span"] {
    margin-bottom: 5px;
  }

  /* Sidenav */
  .docs-sidenav {
    width: auto;
    margin-bottom: 20px;
  }
  .docs-sidenav.affix {
    position: static;
    width: auto;
    top: 0;
  }

  /* Unfloat the back to top link in footer */
  .footer {
    margin-left: -20px;
    margin-right: -20px;
    padding-left: 20px;
    padding-right: 20px;
  }
  .footer p {
    margin-bottom: 9px;
  }
}

/* Landscape phones
------------------------- */
@media (max-width: 480px) {
  /* Remove padding above jumbotron */
  body {
    padding-top: 0;
  }

  /* Change up some type stuff */
  h2 small {
    display: block;
  }

  /* Do our best to make tables work in narrow viewports */
  table code {
    white-space: normal;
    word-wrap: break-word;
    word-break: break-all;
  }

  /* Tighten up footer */
  .footer {
    padding-top: 20px;
    padding-bottom: 20px;
  }
}

