@import "../../bower_components/bootstrap/less/bootstrap.less";
@import "../../bower_components/fontawesome/less/font-awesome.less";

@redy: #e62b1e;

.navbar-brand {
  .icon {
    color: @redy;
    font-size: 100px;
    position: absolute;
    top: 5px;
    opacity: 0.8;
    left: 5px;
  }
}

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
  display: none !important;
}
.navbar-static-top.navbar-default {
  border-bottom-width: 2px;
  border-color: @redy;
  background-color: #f1f1f1;
  .fa { font-size: 19px; }
}

.navbar-default .navbar-nav>.active>a {
  font-weight: bold;
}

.view {
  padding: 20px 50px;
  margin: 0 auto;
  &.ng-enter,
  &.ng-leave {
    -webkit-transition: 455ms cubic-bezier(0.190, 1.000, 0.220, 1.000) all;
    -moz-transition: 455ms cubic-bezier(0.190, 1.000, 0.220, 1.000) all;
    -ms-transition: 455ms cubic-bezier(0.190, 1.000, 0.220, 1.000) all;
    -o-transition: 455ms cubic-bezier(0.190, 1.000, 0.220, 1.000) all;
    transition: 1000ms cubic-bezier(0.190, 1.000, 0.220, 1.000) all;
    &.ng-leave-active {
      display: none;
    }
  }

  &.ng-enter {
    opacity: 0.1;
    position: relative;
    &.ng-enter-active { opacity: 1; }
  }
}

.fs-sample {
  position: relative;
  margin: 60px 0 60px 0;
  padding: 30px;
  border: 1px solid #ddd;
  border-radius: 4px;
  .fstabs{
    position: absolute;
    top: -18px;
    right: 30px;
  }

  pre:last-child {
    margin-bottom: 0;
  }

  pre {
    font-size: 13px;
    font-family: monospace;
    padding: 20px;
    .important {
      color: red;
    }
  }

  .example-label {
    opacity: 1;
  }

  & > h4 {
    margin: 0;
    margin-top: -46px;
    background-color: #fff;
    padding: 5px;
  }
}
@font-face {
  font-family: 'LogosFont';
  src: url('../fonts/LogosFont.ttf');
  font-weight: normal;
  font-style: normal;
}

.icon {
  display: inline-block;
  font-family: LogosFont ;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.navbar-default .navbar-nav>li>a {
  color: #666;
  font-weight: bold;
}
.navbar-default .navbar-nav a {
  position: relative;

  -webkit-transition: 1455ms cubic-bezier(0.190, 1.000, 0.220, 1.000) all;
  -moz-transition: 1455ms cubic-bezier(0.190, 1.000, 0.220, 1.000) all;
  -ms-transition: 1455ms cubic-bezier(0.190, 1.000, 0.220, 1.000) all;
  -o-transition: 1455ms cubic-bezier(0.190, 1.000, 0.220, 1.000) all;
  transition: 1455ms cubic-bezier(0.190, 1.000, 0.220, 1.000) all;

  &:before {
    content: ' ';
    z-index: 1000;
    position: absolute;
    opacity: 0;
    bottom: 0;
    left: 50%;
    margin-bottom: -6px;
    display: inline-block;
    width: 10px;
    height: 10px;
    border: 2px solid @redy;
    border-radius: 100%;
    background-color: white;

    -webkit-transition: 1455ms cubic-bezier(0.190, 1.000, 0.220, 1.000) all;
    -moz-transition: 1455ms cubic-bezier(0.190, 1.000, 0.220, 1.000) all;
    -ms-transition: 1455ms cubic-bezier(0.190, 1.000, 0.220, 1.000) all;
    -o-transition: 1455ms cubic-bezier(0.190, 1.000, 0.220, 1.000) all;
    transition: 1455ms cubic-bezier(0.190, 1.000, 0.220, 1.000) all;
  }
}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus {
  background-color: transparent;
  color: black;
}
.navbar-default .navbar-nav>.active>a {
  &:before {
    opacity: 1;
  }
}
