.bigimage {
  width:80%;
  max-width: 400px;
  margin:20px auto;
  margin-top: 100px;
  & img {
    width:100%;
  }
}

.presentation-header{
  @include outer-container(100%);

  .presentation-img{
    width:100%;
    height:1px;
    background-color: $grey;
  }

  .bjs-moto{
    text-align : center;
    font-size  : 1em;
    font-weight: normal;
  }
}

.selection-toggle{
  background-color: $grey !important;
}
.toggle-selected{
  background-color: $dark !important;
}

.bjs-components{
  @include outer-container(80%);

  .bjs-component{
    @include span-columns(4);
    padding : 0px 50px;

    h1{
      text-align  : center;
    }
    p{
      text-align : justify;
    }
  }
}

.bjs-demo{
  width:100%;
  h1{
    text-align  : center;
  }

  #demo-item{
    cursor: pointer;
    position:relative;
    width:400px;
    height:250px;
    text-align: center;
    max-width: 100%;
    margin: 10px auto;

    .demo-img{
      max-width:100%;
    }
  }
}

.getting-started{
  @include outer-container(80%);

  h1{
    text-align  : center;
  }
}

.hljs{
  background: rgb(240, 240, 240);
  border-left: 5px solid $blue;
  padding-left: 15px;
}
