to master

to master

//@background-color:#333,#fff,#333,#d5d5d5,#f5f5f5;
@import "default_theme.less";
@import "animation";
@header-color:#333,#fff,#e7e7e7,#0099cc,#e0e0e0;
.transition(@time){
  -webkit-transition:all @time;
  -moz-transition:all @time;
  -ms-transition:all @time;
  -o-transition:all @time;
  transition:all @time;
}
.table-cell{
  display: table-cell;
  vertical-align: middle;
}
a{
  .transition(0.9s);
}
.clear:after{
  content:'';
  clear: both;
  display: block;
}

//header
//#wiki-body{
//  border: 1px solid;
//  border-color: @test-color;
//}
.header{
  background-color:extract(@header-color,2);
  border-color:extract(@header-color,3);
  margin-bottom: 0;
  transition: top 0.2s ease-in-out;
  border: none;
  .navbar-container{
    .box-shadow();
  }
  .navbar-nav>li>a{
    color: extract(@header-color, 2);
    &:hover{
      color:extract(@header-color,2);
    }
    &:focus{
      color: extract(@header-color,2);
    }
  }
  .navbar-header {
    background-color:extract(@header-color,1);
    #menu-toggle{
      z-index: 1200;
      border-right: 1px solid #666;
      padding-top: 15px;
      margin-right: 10px;
      .transition(0.9s);
      &:hover{
        opacity: 0.7;
      }
      .menu-active {
        color: #fff;
      }
      .icon-bar{
        display: block;
        width: 22px;
        height: 2px;
        background: #fff;
        .transition(0.2s);
        &+.icon-bar{
          margin-top: 6px;
          width: 17px;
        }
        &:last-child{
          width: 12px;
        }
      }
    }
    .search-toggle{
      float: right;
      line-height: 50px;
      margin:0;
      color: #fff;
      font-size: 20px;
      padding-left: 10px;
      padding-right: 10px;
    }
    .navbar-toggle {
      position: relative;
      float: right;
      font-size: 20px;
      line-height: 50px;
      margin: 0;
      padding:0 10px;
      background-color: transparent;
      background-image: none;
      border: none;
      color: extract(@header-color,2);
    }
    .navbar-brand {
      padding:10px;
      img {
        margin-right: 0.5em;
        max-height: 30px;
      }
    }
    .wiki-toggle{
      float: left;
      color: #fff;
      height: 50px;
      line-height: 50px;
      padding-right: 20px;
      cursor: pointer;
    }
    #searchformphone{
      display: none;
    }
  }
  #icon-section{
    background-color:extract(@header-color,1);
    .hub-menu{
      padding: 0;
      width: 250px;
      background-color:extract(@header-color,5);
      &>li{
        float: left;
        &>ul{
          padding-left: 0;
          &>li{
            list-style-type: none;
            padding: 5px 10px;
            cursor: pointer;
          }
        }
      }
      .hub-list{
        background: extract(@header-color,2);
        color: #999;
        .active{
          background-color:extract(@header-color,5);
          color: extract(@header-color,1);
        }
      }
      .hub-selection{
        display: none;
        background-color:extract(@header-color,5);
        .wiki-random{
          position: absolute;
          bottom: 5px;
          right: 10px;
          font-size: 12px;
          color: extract(@header-color,4);
        }
        a{
          color: extract(@header-color,1);
          &:hover{
            text-decoration: none;
          }
        }
        &.active{
          display: block;
        }
      }
    }
  }
  .navbar-form{
    width: 2000px;
    padding-left: 30px;
    .navbar-search{
      font-size: 18px;
      position: absolute;
      left: 460px;
      top: 15px;
      color: #888;
    }
    .form-control{
      width: 100%;
      margin-top: 8px;
      border: none;
      box-shadow: none;
    }
  }
  .navbar-user{
    //    border-left: 1px solid extract(@header-color,3);
    .set{
      padding-right: 20px;
      .set-menu{
        min-width: 110px;
      }
    }
    .mw-echo-notifications-badge{
      color: #fff;
      background: #fff;
      border-radius: 50%;
      font-size: 10px;
      line-height: 15px;
      text-align: center;
      position: absolute;
      top: 10px;
      right: 5px;
      padding: 0;
      width: 15px;
      height: 15px;
      cursor: pointer;
    }
    .collect-menu{
      right: -10px;
    }
    &>li>a{
      color: extract(@header-color, 1);
      &:hover{
        color:extract(@header-color,1);
      }
      &:focus{
        color: extract(@header-color,1);
      }
    }
    .dropdown-menu{
      li {
        padding: 0 2px;
        a {
          line-height: 30px;
          padding-left: 10px;
        }
      }
    }
    li{
      line-height: 50px;
      padding: 0 8px;
      &.open>a,&.open>a:hover,&.open>a:focus{
        background: none;
        .fa{
          color: extract(@header-color,4);
        }
      }
      &>a{
        padding: 0;
        line-height: 50px;
      }
      .fa{
        font-size: 18px;
        cursor: pointer;
      }
    }
  }
  .navbar .navbar-inner .btn {
    margin-top: 0;
  }
  .user-icon {
    display: inline-block;
    margin-right: 0.5em;
    img {
      border:none;
      width: 20px;
      height: 20px;
    }
  }
  .navbar-login>li>a{
    color: extract(@header-color,1);
  }
}
body{
  background-color: extract(@background-color,1);
  color: extract(@font-color,1);
  font-family: "Lantinghei SC", "Open Sans", Arial, "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", "STHeiti", "WenQuanYi Micro Hei", SimSun, sans-serif;
  overflow-x: hidden;
  overflow-y: auto;
  #wrapper{
    .transition(0.2s);
  }
  ::selection {
    background:extract(@selection-color,1);
    color:extract(@selection-color,2);
    text-shadow: none;
  }
  ::-moz-selection{
    background:extract(@selection-color,1);
    color:extract(@selection-color,2);
    text-shadow: none;
  }
  @media screen and (max-width: 767px) {
    .mw-echo-overlay{
      top:90px;
      width: 100%;
      left: 0!important;
      &::before{
        left: auto!important;
        right: 69px;
      }
    }
  }
}
#sidebar-wrapper{
  background-color: extract(@background-color,2);
  z-index: 1000;
  position: fixed;
  width: 240px;
  top: 50px;
  bottom: 0;
  left:-240px;
  overflow-x: hidden;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  .transition(0.2s);
  .sidebar-nav {
    padding-left: 0px;
    &>li{
      padding-top: 10px;
      padding-bottom: 10px;
    }
    li{
      height: auto;
      display: block;
      text-indent: 25px;
    }
    ul{
      padding-left: 10px;
      padding-right: 20px;
      li{
        text-indent: 15px;
        line-height: 30px;
        .transition(0.9s);
        a {
          display: block;
          text-decoration: none;
          &:hover,&:focus,&:active{
            text-decoration: none;
          }
        }
        a#site-article-count, span#site-follower-count{
          display: inline;
          text-decoration:underline;
          color: #999;
        }
        a.left-author {
          display:inline;
        }
      }
    }
    p{
      color: extract(@font-color, 2);
      display: block;
      text-decoration: none;
      padding-left: 0px;
      padding-right: 10px;
      line-height: 20px;
      font-size: 12px;
    }
    i{
      display: inline-block;
      margin-right: 5px;
      height: 14px;
      width: 14px;
      &:before{
        position:relative;
        right:14px;
      }
    }
    ul>li>a:hover{
      background: none;
    }
    .dropdown-menu a{
      padding: 8px 0;
      color:#333;
      font-size: 12px;
    }
    .sidebar-header{
      text-align: center;
      text-indent: 0;
      word-break: break-all;
      &>a{
        display: block;
        font-size: 24px;
      }
      button{
        display: block;
        padding: 0;
        margin: 5px auto;
      }
    }
    .sidebar-behavior{
      ul::after{
        content: '';
        display: block;
        clear: both;
      }
      &>ul>li{
        width: 50%;
        float: left;
        a{
          white-space:nowrap;
        }
      }
      .copy i{
        float: right;
        margin-right: 10px;
        ::before{
          position: static!important;
        }
      }
    }
    .left-follow{
      padding-top:15px;
      .logo-wiki-user{
        float: none;
        margin-top: 5px;
        cursor: pointer;
        padding-left:0;
        text-align: center;
        text-indent: 0;
        font-weight: bold;
        font-size:14px
      }
      #user-site-follow{
        padding: 0px;
        margin: 0 auto 10px auto;
        display: block;
        text-align: center
      }
      #site-follower-count{
        cursor: pointer;
      }
    }
    .sidebar-brand {
      border-top: 1px solid;
      border-color:@sidebar-border-color;
      font-size: 12px;
      line-height: 34px;
      .headimg{
        border-color: extract(@background-color,2);
      }
      a{
        overflow: hidden;
        text-overflow: ellipsis;
        width: 190px;
        white-space: nowrap;
      }
      .dropdown-menu {
        padding:0;
        width: 200px;
        li{
          &:hover{
            background: #ddd;
          }
        }
      }
    }
    .left-author>ul {
      li{
        height: 30px;
      }
      img{
        margin-right: 5px;
        border: 1px solid rgba(0,0,0,0.5);
        float: left;
        margin-top: 5px;
        margin-left: 15px;
        vertical-align: inherit;
      }
      a {
        float: left;
        max-height: 30px;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100px;
        white-space: nowrap;
      }
      span {
        float: right;
        margin-right: 20px;
        color:extract(@a-color,1);
        text-indent: 0;
      }
    }
    .sidebar-create {
      padding-top: 5px;
      padding-bottom: 5px;
      text-indent: 0;
      .create-group{
        margin: auto 15px;
        #mw-input-preload{
          width: 20px;
          padding: 0;
        }
        .createboxInput {
          height: 34px;
          width: 100px;
        }
        .createboxButton{
          min-width: 30px;
        }
        input{
          height: 30px;
          padding: 0 5px;
        }
      }
      &:hover{
        background-color: extract(@header-color,1);
      }
    }
    .left-manager .more{
      margin-left: 10px;
    }
  }
  a{
    color: extract(@a-color,1);
  }
  .left-nav>ul>li:hover,.left-tool>ul>li:hover{
    //    @leftbar-hover;
    background-color:#fff;
    a{
      color: #333;
    }
    .dropdown-menu a{
      color:#333;
    }
  }
}

a{
  color: extract(@a-color,3);
}
textarea {
  width: 95%;
  color: extract(@font-color,1);
}
.modal-dialog{
  color: extract(@font-color,1);
}
.thumbinner{
  background-color: #fff;
}
.popover {
  color: #333;
}
.subnav{
  //@hover{
  //  background-color: extract(@sub-hover-color,1);
  //  color:extract(@sub-hover-color,2);
  //}
  .box-shadow();
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
  background-color: extract(@background-color,3);
  font-size: 14px;
  width: 100%;
  position:fixed;
  top:50px;
  z-index: 100;
  &.subnav-up {
    top:-1000px;
    display: none;
  }
  .nav>li:first-child a{
    font-size: 26px;
    letter-spacing: 1px;
    font-weight: 600;
  }
  #subnav-select{
    display: none;
  }
  #user-site-follow{
    min-width: 40px;
    padding: 0 5px;
    margin-top: 10px;
    span{
      display:none;
    }
  }
  .site-count{
    float: right;
    &>p {
      margin-bottom: 0;
      margin-top: 5px;
      float: right;
      a {
        font-size: 24px;
        color: @sub-site-count-color;
        cursor: pointer;
      }
    }
  }
  #subnav-toggle{
    display: none;
    position: absolute;
    right: 15px;
    top: 0;
    font-size: 18px;
    height: 50px;
    line-height: 50px;
    padding: 0 10px;
  }
  .dropdown-menu{
    @media screen and (min-width: 769px) {
      max-height: none!important;
    }
  }
  .nav>li>a{
    color:extract(@a-color,2);
    border: none;
    font-size: 16px;
    height: 50px;
    padding-top: 15px;
    border-radius: 0;
    &:hover,&:focus,&:active{
      //    @hover;
      background-color: extract(@sub-hover-color,1);
      color:extract(@sub-hover-color,2);
    }
    &.active{
      //    @hover;
      background-color: extract(@sub-hover-color,1);
      color:extract(@sub-hover-color,2);
    }
  }
}

//.bell-animation{
//  color: red;
//  animation:bell 5s infinite linear;
//  -webkit-animation:bell 5s infinite linear;s
//  -moz-animation:bell 5s infinite linear;
//  -o-animation:bell 5s infinite linear;
//  position:relative;
//  left: 5px;
//}
.ns-0 #wiki-outer-body{
  font-size: 16px;
  .wiki-body-section  {
    a:not(.image) {
      &:hover {
        text-decoration: none;
      }
      &.new {
        color: extract(@content-acolor, 2);
        &:hover {
          color: extract(@a-hover-color, 2);
        }
      }
    }
  }
  .caret,.arrow{
    border-left-color: @transparent;
    border-right-color: @transparent;
  }
}
.ns-0 #wiki-outer-body .familyTree, .ns-0 #wiki-outer-body .reflist, .ns-0 #wiki-outer-body .infobox{
  font-size: 14px;
}
#wiki-body{
  @media (min-width: 769px){
    padding-left: 35px;
    padding-right: 35px;
  }
}

#wiki-outer-body {
  padding-top: 100px;
  .toc-sidebar li{
    a{
      border-color: extract(@toc-sidebar-color,3);
      &:hover{
        border-left: 1px solid;
      }
    }
    &.active>a:hover{
        border-left-width:2px;
    }
  }
  .popover{
    background: #fff;
    border:1px solid rgba(0,0,0,.2);
    .edit-input{
      border:1px solid rgba(0,0,0,.2);
    }
  }
}
.bottom{
  font-size: 14px;
  background-color: extract(@background-color,4);
  a{
    color:extract(@a-color,3);
  }
  footer{
    color: @footer-color;
  }
}
@media screen and (min-width: 1366px){
  .menu-active{
    .icon-bar:nth-child(2){
      margin-left: 5px;
    }
    .icon-bar:last-child{
      margin-left: 10px;
    }
  }
}
@media screen and (max-width: 1365px) {
  .smenu-active {
    .icon-bar:nth-child(2) {
      margin-left: 5px;
    }
    .icon-bar:last-child {
      margin-left: 10px;
    }
  }
}
@media screen and (min-width: 1200px) {
  #scrollDiv {
    width: 10px;
    position: absolute;
    top: 0;
    background: rgba(225,225,225,.15);
    border-radius: 10px;
  }
  #sidebar-wrapper{
    overflow-y: hidden;
    .sidebar-nav{
      position: absolute;
      left: 0;
      top: 0;
    }
  }
}
@media screen and (max-width: 1200px){
  .subnav-up{
    top: -42px;
  }
  .nav-up{
    top: 0;
  }
}
@media  screen and (min-width: 1440px) and (max-width: 1919px) {
  .subnav {
    .nav > li:nth-child(n+16) {
      display: none;
    }
    .nav > li.site-count {
      display: inline-block;
      .follower-count{
        display:none;
      }
    }
  }
}
@media  screen and (min-width: 1201px) and (max-width: 1439px) {
  .subnav {
    .nav > li:nth-child(n+9) {
      display: none;
    }
    .nav > li.site-count {
      display: inline-block;
      .follower-count{
        display:none;
      }
      .edit-count{
        display:none;
      }
    }
  }
}
@media  screen and (min-width: 993px) and (max-width: 1200px) {
  .subnav {
    .nav > li:nth-child(n+7) {
      display: none;
    }
    .nav > li.site-count {
      display: inline-block;
      .follower-count{
        display:none;
      }
      .edit-count{
        display:none;
      }
    }
  }
}
@media screen and (min-width: 768px) and (max-width: 992px){
  .header {
    #icon-section {
      position: absolute;
      display: none;
      top: 50px;
      &.xs-show{
        display: block;
      }
      & > li {
        float: none;
        width: 300px;
        top: 30px;
        &:nth-child(2) {
          top: auto;
          bottom: 30px;
        }
        & > a {
          line-height: 30px;
          padding: 0;
          padding-left: 10px;
          .caret {
            display: none;
          }
        }
        .hub-menu {
          display: block;
          width: 300px ;
          background-color: #444 ;
          border: none;
          &::before{
            display: none;
          }
          .hub-list {
            background: #333;
            color: #fff;
            .active {
              background-color: #444;
              color: #fff;
            }
          }
          .hub-selection{
            background-color: #444;
            color: extract(@header-color,2);
            a{
              color: extract(@header-color,2);
            }
          }
        }
      }
      &>.open>a, &>.open>a:hover, &>.open>a:focus {
        color: extract(@header-color,2);
        background-color: extract(@header-color,1);
      }
    }
    .navbar-form .navbar-search {
      left: 230px;
    }
  }
  .subnav {
    .nav > li:nth-child(n+6) {
      display: none;
    }
    .nav > li.site-count {
      display: none;
    }
  }
}
@media screen and (max-width: 767px) {
  .header{
    #searchformphone{
      position: absolute;
      padding: 0;
      margin: 0;
      top: 50px;
      width: 100%;
      z-index:1;
      .form-control{
        margin-top: 0;
        box-shadow: 0 0 5px rgba(0,0,0,.8);
        border-radius: 0;
        border: none;
      }
    }
    .navbar-collapse{
      background-color: extract(@header-color,1);
      padding: 0px;
      &.in{
        overflow-y: visible;
      }
      #icon-section{
        margin: 0;
        float: left;
        .hub-menu{
          position: absolute;
          width: 100%;
        }
        &>li{
          float: left;
          position: static;
          .caret{
            display: none;
          }
        }
        &>.open>a, &>.open>a:hover, &>.open>a:focus {
          color: extract(@header-color,2);
          background-color: extract(@header-color,1);
        }
      }
      .navbar-user{
        float: right;
        border-left: none;
        margin: 0;
        .mw-echo-notifications-badge {
          color: #333;
          background: #333;
        }
        li{
          float: left;
          padding: 0;
          position: static;
          &.set{
            padding-right: 20px;
          }
          &>a{
            padding: 0 5px;
            line-height: 40px;
            color: #fff;
            .user-icon{
              margin-right: 0;
            }
          }
        }
        .collect-menu::before {
          right: 42px;
        }
        .open .dropdown-menu{
          position: absolute;
          background-color: extract(@header-color,2);
          border: 1px solid #ccc;
          border: 1px solid rgba(0,0,0,.15);
          border-radius: 4px;
          -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
          box-shadow: 0 6px 12px rgba(0,0,0,.175);
          width: 100%;
        }
        .nav{
          margin: 0;
        }
      }
      .navbar-login{
        margin: 0;
        float: right;
        &>li{
          display: inline-block;
          &>a{
            color: extract(@header-color,2);
          }
        }
      }
    }
    .navbar-header {
      #menu-toggle {
        margin-right: 0;
        padding-left: 0;
        border-right: none;
      }
    }
  }
  .subnav{
    position: absolute;
    top: 50px;
    .nav{
      &.phone-open{
        min-height: 242px;
      }
      .dropdown {
        position: static;
        clear: left;
        float: none;
        background: extract(@header-color, 2);
        display: none;
        & > a {
          padding: 5px 10px;
          background: extract(@background-color, 3);
          width: 150px;
          height: inherit;
          //          &:hover{
          //            background-color: extract(@background-color, 3);
          //            color:extract(@sub-hover-color,2);
          //          }
        }
        &.phone-active > a {
          background: extract(@header-color, 2);
        }
        &.primary-nav a{
          color: extract(@a-color,3);
        }
      }
      .dropdown-menu {
        left: 152px;
        right: 0;
        top: 50px;
        margin: 0;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        overflow-y: auto;
        -webkit-overflow-scrolling:touch;
        display: none!important;
        &.phone-active {
          display: block!important;
        }
      }
      &>li:first-child a {
        font-size: 16px;
        font-weight: 600;
      }
    }
    .site-count{
      display: none;
    }
    #subnav-toggle{
      display: block;
    }
  }
  .container-fluid{
    padding: 0;
  }
  .subnav.subnav-up{
    top:50px;
    display: block;
  }
  .nav-up{
    top: 0;
  }
  #firstHeading h1{
    font-size: 2.2em;
    display:inline-block;
  }
  #huiji-h1-edit-button{
    font-size: 1.6em;
    display:inline-block;
  }
  .phone-wrapper{
    position: fixed;
    left:0;
    right: 0;
    top: 50px;
    bottom: 0;
    background: rgba(0,0,0,.1);
    z-index: 100;
  }
}
#wiki-body ul.profile-interactive li{
  line-height: 34px;
}
.dropping{
  -webkit-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  -ms-user-select: none;
  cursor: default;
}

error: pathspec 'lock-style.less' did not match any file(s) known to git


Toning-down he heading font sizes.

Toning-down he heading font sizes.

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/QueensSailing/QueensSailing.github.io.git/'


Changed theme color

Changed theme color

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/jwspitznagel/jwspitznagel.github.io.git/'


Updated our custom variables.less for the latest version of Bootstrap.


fix(Button): Add disabled class to root_callToAction Button (#222)

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/seekinternational/seek-asia-style-guide.git/'


fix single celled tfoot

fix single celled tfoot

In the case of a single celled tfoot the `:last-child` overrides the `:first-child` and leaves the table with a sharp bottom-left corner. An good example of this use case would be if you had a button action at the end of the table, similar to the first table example in the docs.

```
<table class="ui table segment">
  <thead>
    <tr><th>Name</th>
    <th>Status</th>
    <th>Notes</th>
  </tr></thead>
  <tbody>
    <tr>
      <td>John</td>
      <td>Approved</td>
      <td>None</td>
    </tr>
    <tr>
      <td>Jamie</td>
      <td>Approved</td>
      <td>Requires call</td>
    </tr>
    <tr>
      <td>Jill</td>
      <td>Denied</td>
      <td>None</td>
    </tr>
  </tbody>
  <tfoot>
    <tr><th colspan="3">
      <div class="ui blue labeled icon button"><i class="user icon"></i> Add User</div>
    </th>
  </tr></tfoot>
</table>
  <tfoot>
    <tr><th></th></tr>
  </tfoot>
</table>
```

There's probably a better way to do this, but it worked for me in my project.

/*
 * # Semantic - Table
 * http://github.com/jlukic/semantic-ui/
 *
 *
 * Copyright 2013 Contributors
 * Released under the MIT license
 * http://opensource.org/licenses/MIT
 *
 */

/*******************************
             Table
*******************************/

/* Prototype */
.ui.table {
  width: 100%;
  border-collapse: collapse;
}

/* Table Content */
.ui.table th,
.ui.table tr,
.ui.table td {
  border-collapse: collapse;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;

  -webkit-transition: all 0.1s ease-out;
  -moz-transition: all 0.1s ease-out;
  -o-transition: all 0.1s ease-out;
  -ms-transition: all 0.1s ease-out;
  transition: all 0.1s ease-out;
}

/* Headers */
.ui.table thead {
  border-bottom: 1px solid rgba(0, 0, 0, 0.03);
}
.ui.table tfoot th {
  background-color: rgba(0, 0, 0, 0.03);
}
.ui.table th {
  cursor: auto;

  background-color: rgba(0, 0, 0, 0.05);

  text-align: left;
  color: rgba(0, 0, 0, 0.8);
  padding: 0.5em 0.7em;
  vertical-align: middle;
}
.ui.table thead th:first-child {
  border-radius: 5px 0px 0px 0px;
}
.ui.table thead th:last-child {
  border-radius: 0px 5px 0px 0px;
}
.ui.table tfoot th:first-child {
  border-radius: 0px 0px 0px 5px;
}
.ui.table tfoot th:last-child {
  border-radius: 0px 0px 5px 0px;
}
.ui.table tfoot th:first-child:last-child {
  border-radius: 0px 0px 5px 5px;
}

/* Table Cells */
.ui.table td {
  padding: 0.40em 0.7em;
  vertical-align: middle;
}

/* Footer */
.ui.table tfoot {
  border-top: 1px solid rgba(0, 0, 0, 0.03);
}
.ui.table tfoot th {
  font-weight: normal;
  font-style: italic;
}

/* Table Striping */
.ui.table tbody tr:nth-child(2n) {
  background-color: rgba(0, 0, 50, 0.02);
}

/* Icons */
.ui.table > .icon {
  vertical-align: baseline;
}
.ui.table > .icon:only-child {
  margin: 0em;
}

/* Table Segment */
.ui.table.segment:after {
  display: none;
}
.ui.table.segment.stacked:after {
  display: block;
}

/* Responsive */

@media only screen and (max-width : 768px) {
  .ui.table {
    display: block;
    padding: 0em;
  }
  .ui.table thead,
  .ui.table tfoot {
    display: none;
  }
  .ui.table tbody {
    display: block;
  }
  .ui.table tr {
    display: block;
  }

  .ui.table tr > td {
    width: 100% !important;
    display: block;
    border: none !important;
    padding: 0.25em 0.75em;
    box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.05) !important;
  }
  .ui.table td:first-child {
    font-weight: bold;
    padding-top: 1em;
  }
  .ui.table td:last-child {
    box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1) inset !important;
    padding-bottom: 1em;
  }

  /* Clear BG Colors */
  .ui.table tr > td.warning,
  .ui.table tr > td.error,
  .ui.table tr > td.active,
  .ui.table tr > td.positive,
  .ui.table tr > td.negative {
    background-color: transparent !important;
  }
}

/*******************************
             States
*******************************/

/*--------------
      Hover
---------------*/

/* Sortable */
.ui.sortable.table th.disabled:hover {
  cursor: auto;
  text-align: left;
  font-weight: bold;
  color: #333333;
  color: rgba(0, 0, 0, 0.8);
}
.ui.sortable.table thead th:hover {
  background-color: rgba(0, 0, 0, 0.13);
  color: rgba(0, 0, 0, 0.8);
}

/* Inverted Sortable */
.ui.inverted.sortable.table thead th:hover {
  background-color: rgba(255, 255, 255, 0.13);
  color: rgba(255, 255, 255, 1);
}

/*--------------
    Positive
---------------*/

.ui.table tr.positive,
.ui.table td.positive {
  -webkit-box-shadow: 2px 0px 0px #119000 inset;
  -moz-box-shadow: 2px 0px 0px #119000 inset;
  box-shadow: 2px 0px 0px #119000 inset;
}
.ui.table tr.positive td,
.ui.table td.positive {
  background-color: #F2F8F0 !important;
  color: #119000 !important;
}
.ui.celled.table tr.positive:hover td,
.ui.celled.table tr:hover td.positive,
.ui.table tr.positive:hover td,
.ui.table td:hover.positive,
.ui.table th:hover.positive {
  background-color: #ECF5E9 !important;
  color: #119000 !important;
}

/*--------------
     Negative
---------------*/

.ui.table tr.negative,
.ui.table td.negative {
  -webkit-box-shadow: 2px 0px 0px #CD2929 inset;
  -moz-box-shadow: 2px 0px 0px #CD2929 inset;
  box-shadow: 2px 0px 0px #CD2929 inset;
}
.ui.table tr.negative td,
.ui.table td.negative {
  background-color: #F9F4F4;
  color: #CD2929 !important;
}
.ui.celled.table tr.negative:hover td,
.ui.celled.table tr:hover td.negative,
.ui.table tr.negative:hover td,
.ui.table td:hover.negative,
.ui.table th:hover.negative {
  background-color: #F2E8E8;
  color: #CD2929;
}

/*--------------
      Error
---------------*/

.ui.table tr.error,
.ui.table td.error {
  -webkit-box-shadow: 2px 0px 0px #CD2929 inset;
  -moz-box-shadow: 2px 0px 0px #CD2929 inset;
  box-shadow: 2px 0px 0px #CD2929 inset;
}
.ui.table tr.error td,
.ui.table td.error,
.ui.table th.error {
  background-color: #F9F4F4;
  color: #CD2929;
}
.ui.celled.table tr.error:hover td,
.ui.celled.table tr:hover td.error,
.ui.table tr.error:hover td,
.ui.table td:hover.error,
.ui.table th:hover.error {
  background-color: #F2E8E8;
  color: #CD2929;
}

/*--------------
     Warning
---------------*/

.ui.table tr.warning,
.ui.table td.warning {
  -webkit-box-shadow: 2px 0px 0px #7D6C00 inset;
  -moz-box-shadow: 2px 0px 0px #7D6C00 inset;
  box-shadow: 2px 0px 0px #7D6C00 inset;
}
.ui.table tr.warning td,
.ui.table td.warning,
.ui.table th.warning {
  background-color: #FBF6E9;
  color: #7D6C00;
}
.ui.celled.table tr.warning:hover td,
.ui.celled.table tr:hover td.warning,
.ui.table tr.warning:hover td,
.ui.table td:hover.warning,
.ui.table th:hover.warning {
  background-color: #F3EDDC;
  color: #7D6C00;
}

/*--------------
     Active
---------------*/

.ui.table tr.active,
.ui.table td.active {
  -webkit-box-shadow: 2px 0px 0px rgba(50, 50, 50, 0.9) inset;
  -moz-box-shadow: 2px 0px 0px rgba(50, 50, 50, 0.9) inset;
  box-shadow: 2px 0px 0px rgba(50, 50, 50, 0.9) inset;
}

.ui.table tr.active td,
.ui.table tr td.active {
  background-color: #E0E0E0;
  color: rgba(50, 50, 50, 0.9);
  /* border-color: rgba(0, 0, 0, 0.15) !important; */
}

/*--------------
     Disabled
---------------*/

.ui.table tr.disabled td,
.ui.table tr td.disabled,
.ui.table tr.disabled:hover td,
.ui.table tr:hover td.disabled {
  color: rgba(150, 150, 150, 0.3);
}

/*******************************
          Variations
*******************************/

/*--------------
  Column Count
---------------*/

.ui.two.column.table td {
  width: 50%;
}
.ui.three.column.table td {
  width: 33.3333%;
}
.ui.four.column.table td {
  width: 25%;
}
.ui.five.column.table td {
  width: 20%;
}
.ui.six.column.table td {
  width: 16.66667%;
}
.ui.seven.column.table td {
  width: 14.2857%;
}
.ui.eight.column.table td {
  width: 12.5%;
}
.ui.nine.column.table td {
  width: 11.1111%;
}
.ui.ten.column.table td {
  width: 10%;
}
.ui.eleven.column.table td {
  width: 9.0909%;
}
.ui.twelve.column.table td {
  width: 8.3333%;
}
.ui.thirteen.column.table td {
  width: 7.6923%;
}
.ui.fourteen.column.table td {
  width: 7.1428%;
}
.ui.fifteen.column.table td {
  width: 6.6666%;
}
.ui.sixteen.column.table td {
  width: 6.25%;
}

/* Column Width */
.ui.table th.one.wide,
.ui.table td.one.wide {
  width: 6.25%;
}
.ui.table th.two.wide,
.ui.table td.two.wide {
  width: 12.5%;
}
.ui.table th.three.wide,
.ui.table td.three.wide {
  width: 18.75%;
}
.ui.table th.four.wide,
.ui.table td.four.wide {
  width: 25%;
}
.ui.table th.five.wide,
.ui.table td.five.wide {
  width: 31.25%;
}
.ui.table th.six.wide,
.ui.table td.six.wide {
  width: 37.5%;
}
.ui.table th.seven.wide,
.ui.table td.seven.wide {
  width: 43.75%;
}
.ui.table th.eight.wide,
.ui.table td.eight.wide {
  width: 50%;
}
.ui.table th.nine.wide,
.ui.table td.nine.wide {
  width: 56.25%;
}
.ui.table th.ten.wide,
.ui.table td.ten.wide {
  width: 62.5%;
}
.ui.table th.eleven.wide,
.ui.table td.eleven.wide {
  width: 68.75%;
}
.ui.table th.twelve.wide,
.ui.table td.twelve.wide {
  width: 75%;
}
.ui.table th.thirteen.wide,
.ui.table td.thirteen.wide {
  width: 81.25%;
}
.ui.table th.fourteen.wide,
.ui.table td.fourteen.wide {
  width: 87.5%;
}
.ui.table th.fifteen.wide,
.ui.table td.fifteen.wide {
  width: 93.75%;
}
.ui.table th.sixteen.wide,
.ui.table td.sixteen.wide {
  width: 100%;
}

/*--------------
     Celled
---------------*/

.ui.celled.table {
  color: rgba(0, 0, 0, 0.8);
}
.ui.celled.table tbody tr,
.ui.celled.table tfoot tr {
  border: none;
}
.ui.celled.table th,
.ui.celled.table td {
  border: 1px solid rgba(0, 0, 0, 0.1);
}

/* Coupling with segment */
.ui.celled.table.segment th:first-child,
.ui.celled.table.segment td:first-child {
  border-left: none;
}
.ui.celled.table.segment th:last-child,
.ui.celled.table.segment td:last-child {
  border-right: none;
}

/*--------------
    Sortable
---------------*/

.ui.sortable.table thead th {
  cursor: pointer;
  white-space: nowrap;
}
.ui.sortable.table thead th.sorted,
.ui.sortable.table thead th.sorted:hover {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ui.sortable.table thead th:after {
  display: inline-block;
  content: '';
  width: 1em;
  opacity: 0.8;

  margin: 0em 0em 0em 0.5em;

  font-family: 'Icons';
  font-style: normal;
  font-weight: normal;
  text-decoration: inherit;
}
.ui.sortable.table thead th.ascending:after {
  content: '\25b4';
}
.ui.sortable.table thead th.descending:after {
  content: '\25be';
}

/*--------------
    Inverted
---------------*/

/* Text Color */
.ui.inverted.table td {
  color: rgba(255, 255, 255, 0.9);
}
.ui.inverted.table th {
  background-color: rgba(0, 0, 0, 0.15);
  color: rgba(255, 255, 255, 0.9);
}

/* Stripes */
.ui.inverted.table tbody tr:nth-child(2n) {
  background-color: rgba(255, 255, 255, 0.06);
}

/*--------------
   Definition
---------------*/

.ui.definition.table td:first-child {
  font-weight: bold;
}

/*--------------
   Collapsing
---------------*/

.ui.collapsing.table {
  width: auto;
}

/*--------------
      Basic
---------------*/

.ui.basic.table th {
  background-color: transparent;
  padding: 0.5em;
}
.ui.basic.table tbody tr {
  border-bottom: 1px solid rgba(0, 0, 0, 0.03);
}
.ui.basic.table td {
  padding: 0.8em 0.5em;
}
.ui.basic.table tbody tr:nth-child(2n) {
  background-color: transparent !important;
}

/*--------------
     Padded
---------------*/

.ui.padded.table th,
.ui.padded.table td {
  padding: 0.8em 1em;
}

.ui.compact.table th {
  padding: 0.3em 0.5em;
}
.ui.compact.table td {
  padding: 0.2em 0.5em;
}

/*--------------
      Sizes
---------------*/

/* Small */
.ui.small.table {
  font-size: 0.875em;
}

/* Standard */
.ui.table {
  font-size: 1em;
}

/* Large */
.ui.large.table {
  font-size: 1.1em;
}

/*
 * # Semantic - Table
 * http://github.com/jlukic/semantic-ui/
 *
 *
 * Copyright 2013 Contributors
 * Released under the MIT license
 * http://opensource.org/licenses/MIT
 *
 */

/*******************************
             Table
*******************************/

/* Prototype */
.ui.table {
  width: 100%;
  border-collapse: collapse;
}

/* Table Content */
.ui.table th,
.ui.table tr,
.ui.table td {
  border-collapse: collapse;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;

  -webkit-transition: all 0.1s ease-out;
  -moz-transition: all 0.1s ease-out;
  -o-transition: all 0.1s ease-out;
  -ms-transition: all 0.1s ease-out;
  transition: all 0.1s ease-out;
}

/* Headers */
.ui.table thead {
  border-bottom: 1px solid rgba(0, 0, 0, 0.03);
}
.ui.table tfoot th {
  background-color: rgba(0, 0, 0, 0.03);
}
.ui.table th {
  cursor: auto;

  background-color: rgba(0, 0, 0, 0.05);

  text-align: left;
  color: rgba(0, 0, 0, 0.8);
  padding: 0.5em 0.7em;
  vertical-align: middle;
}
.ui.table thead th:first-child {
  border-radius: 5px 0px 0px 0px;
}
.ui.table thead th:last-child {
  border-radius: 0px 5px 0px 0px;
}
.ui.table tfoot th:first-child {
  border-radius: 0px 0px 0px 5px;
}
.ui.table tfoot th:last-child {
  border-radius: 0px 0px 5px 0px;
}

/* Table Cells */
.ui.table td {
  padding: 0.40em 0.7em;
  vertical-align: middle;
}

/* Footer */
.ui.table tfoot {
  border-top: 1px solid rgba(0, 0, 0, 0.03);
}
.ui.table tfoot th {
  font-weight: normal;
  font-style: italic;
}

/* Table Striping */
.ui.table tbody tr:nth-child(2n) {
  background-color: rgba(0, 0, 50, 0.02);
}

/* Icons */
.ui.table > .icon {
  vertical-align: baseline;
}
.ui.table > .icon:only-child {
  margin: 0em;
}

/* Table Segment */
.ui.table.segment:after {
  display: none;
}
.ui.table.segment.stacked:after {
  display: block;
}

/* Responsive */

@media only screen and (max-width : 768px) {
  .ui.table {
    display: block;
    padding: 0em;
  }
  .ui.table thead,
  .ui.table tfoot {
    display: none;
  }
  .ui.table tbody {
    display: block;
  }
  .ui.table tr {
    display: block;
  }

  .ui.table tr > td {
    width: 100% !important;
    display: block;
    border: none !important;
    padding: 0.25em 0.75em;
    box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.05) !important;
  }
  .ui.table td:first-child {
    font-weight: bold;
    padding-top: 1em;
  }
  .ui.table td:last-child {
    box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1) inset !important;
    padding-bottom: 1em;
  }

  /* Clear BG Colors */
  .ui.table tr > td.warning,
  .ui.table tr > td.error,
  .ui.table tr > td.active,
  .ui.table tr > td.positive,
  .ui.table tr > td.negative {
    background-color: transparent !important;
  }
}

/*******************************
             States
*******************************/

/*--------------
      Hover
---------------*/

/* Sortable */
.ui.sortable.table th.disabled:hover {
  cursor: auto;
  text-align: left;
  font-weight: bold;
  color: #333333;
  color: rgba(0, 0, 0, 0.8);
}
.ui.sortable.table thead th:hover {
  background-color: rgba(0, 0, 0, 0.13);
  color: rgba(0, 0, 0, 0.8);
}

/* Inverted Sortable */
.ui.inverted.sortable.table thead th:hover {
  background-color: rgba(255, 255, 255, 0.13);
  color: rgba(255, 255, 255, 1);
}

/*--------------
    Positive
---------------*/

.ui.table tr.positive,
.ui.table td.positive {
  -webkit-box-shadow: 2px 0px 0px #119000 inset;
  -moz-box-shadow: 2px 0px 0px #119000 inset;
  box-shadow: 2px 0px 0px #119000 inset;
}
.ui.table tr.positive td,
.ui.table td.positive {
  background-color: #F2F8F0 !important;
  color: #119000 !important;
}
.ui.celled.table tr.positive:hover td,
.ui.celled.table tr:hover td.positive,
.ui.table tr.positive:hover td,
.ui.table td:hover.positive,
.ui.table th:hover.positive {
  background-color: #ECF5E9 !important;
  color: #119000 !important;
}

/*--------------
     Negative
---------------*/

.ui.table tr.negative,
.ui.table td.negative {
  -webkit-box-shadow: 2px 0px 0px #CD2929 inset;
  -moz-box-shadow: 2px 0px 0px #CD2929 inset;
  box-shadow: 2px 0px 0px #CD2929 inset;
}
.ui.table tr.negative td,
.ui.table td.negative {
  background-color: #F9F4F4;
  color: #CD2929 !important;
}
.ui.celled.table tr.negative:hover td,
.ui.celled.table tr:hover td.negative,
.ui.table tr.negative:hover td,
.ui.table td:hover.negative,
.ui.table th:hover.negative {
  background-color: #F2E8E8;
  color: #CD2929;
}

/*--------------
      Error
---------------*/

.ui.table tr.error,
.ui.table td.error {
  -webkit-box-shadow: 2px 0px 0px #CD2929 inset;
  -moz-box-shadow: 2px 0px 0px #CD2929 inset;
  box-shadow: 2px 0px 0px #CD2929 inset;
}
.ui.table tr.error td,
.ui.table td.error,
.ui.table th.error {
  background-color: #F9F4F4;
  color: #CD2929;
}
.ui.celled.table tr.error:hover td,
.ui.celled.table tr:hover td.error,
.ui.table tr.error:hover td,
.ui.table td:hover.error,
.ui.table th:hover.error {
  background-color: #F2E8E8;
  color: #CD2929;
}

/*--------------
     Warning
---------------*/

.ui.table tr.warning,
.ui.table td.warning {
  -webkit-box-shadow: 2px 0px 0px #7D6C00 inset;
  -moz-box-shadow: 2px 0px 0px #7D6C00 inset;
  box-shadow: 2px 0px 0px #7D6C00 inset;
}
.ui.table tr.warning td,
.ui.table td.warning,
.ui.table th.warning {
  background-color: #FBF6E9;
  color: #7D6C00;
}
.ui.celled.table tr.warning:hover td,
.ui.celled.table tr:hover td.warning,
.ui.table tr.warning:hover td,
.ui.table td:hover.warning,
.ui.table th:hover.warning {
  background-color: #F3EDDC;
  color: #7D6C00;
}

/*--------------
     Active
---------------*/

.ui.table tr.active,
.ui.table td.active {
  -webkit-box-shadow: 2px 0px 0px rgba(50, 50, 50, 0.9) inset;
  -moz-box-shadow: 2px 0px 0px rgba(50, 50, 50, 0.9) inset;
  box-shadow: 2px 0px 0px rgba(50, 50, 50, 0.9) inset;
}

.ui.table tr.active td,
.ui.table tr td.active {
  background-color: #E0E0E0;
  color: rgba(50, 50, 50, 0.9);
  /* border-color: rgba(0, 0, 0, 0.15) !important; */
}

/*--------------
     Disabled
---------------*/

.ui.table tr.disabled td,
.ui.table tr td.disabled,
.ui.table tr.disabled:hover td,
.ui.table tr:hover td.disabled {
  color: rgba(150, 150, 150, 0.3);
}

/*******************************
          Variations
*******************************/

/*--------------
  Column Count
---------------*/

.ui.two.column.table td {
  width: 50%;
}
.ui.three.column.table td {
  width: 33.3333%;
}
.ui.four.column.table td {
  width: 25%;
}
.ui.five.column.table td {
  width: 20%;
}
.ui.six.column.table td {
  width: 16.66667%;
}
.ui.seven.column.table td {
  width: 14.2857%;
}
.ui.eight.column.table td {
  width: 12.5%;
}
.ui.nine.column.table td {
  width: 11.1111%;
}
.ui.ten.column.table td {
  width: 10%;
}
.ui.eleven.column.table td {
  width: 9.0909%;
}
.ui.twelve.column.table td {
  width: 8.3333%;
}
.ui.thirteen.column.table td {
  width: 7.6923%;
}
.ui.fourteen.column.table td {
  width: 7.1428%;
}
.ui.fifteen.column.table td {
  width: 6.6666%;
}
.ui.sixteen.column.table td {
  width: 6.25%;
}

/* Column Width */
.ui.table th.one.wide,
.ui.table td.one.wide {
  width: 6.25%;
}
.ui.table th.two.wide,
.ui.table td.two.wide {
  width: 12.5%;
}
.ui.table th.three.wide,
.ui.table td.three.wide {
  width: 18.75%;
}
.ui.table th.four.wide,
.ui.table td.four.wide {
  width: 25%;
}
.ui.table th.five.wide,
.ui.table td.five.wide {
  width: 31.25%;
}
.ui.table th.six.wide,
.ui.table td.six.wide {
  width: 37.5%;
}
.ui.table th.seven.wide,
.ui.table td.seven.wide {
  width: 43.75%;
}
.ui.table th.eight.wide,
.ui.table td.eight.wide {
  width: 50%;
}
.ui.table th.nine.wide,
.ui.table td.nine.wide {
  width: 56.25%;
}
.ui.table th.ten.wide,
.ui.table td.ten.wide {
  width: 62.5%;
}
.ui.table th.eleven.wide,
.ui.table td.eleven.wide {
  width: 68.75%;
}
.ui.table th.twelve.wide,
.ui.table td.twelve.wide {
  width: 75%;
}
.ui.table th.thirteen.wide,
.ui.table td.thirteen.wide {
  width: 81.25%;
}
.ui.table th.fourteen.wide,
.ui.table td.fourteen.wide {
  width: 87.5%;
}
.ui.table th.fifteen.wide,
.ui.table td.fifteen.wide {
  width: 93.75%;
}
.ui.table th.sixteen.wide,
.ui.table td.sixteen.wide {
  width: 100%;
}

/*--------------
     Celled
---------------*/

.ui.celled.table {
  color: rgba(0, 0, 0, 0.8);
}
.ui.celled.table tbody tr,
.ui.celled.table tfoot tr {
  border: none;
}
.ui.celled.table th,
.ui.celled.table td {
  border: 1px solid rgba(0, 0, 0, 0.1);
}

/* Coupling with segment */
.ui.celled.table.segment th:first-child,
.ui.celled.table.segment td:first-child {
  border-left: none;
}
.ui.celled.table.segment th:last-child,
.ui.celled.table.segment td:last-child {
  border-right: none;
}

/*--------------
    Sortable
---------------*/

.ui.sortable.table thead th {
  cursor: pointer;
  white-space: nowrap;
}
.ui.sortable.table thead th.sorted,
.ui.sortable.table thead th.sorted:hover {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ui.sortable.table thead th:after {
  display: inline-block;
  content: '';
  width: 1em;
  opacity: 0.8;

  margin: 0em 0em 0em 0.5em;

  font-family: 'Icons';
  font-style: normal;
  font-weight: normal;
  text-decoration: inherit;
}
.ui.sortable.table thead th.ascending:after {
  content: '\25b4';
}
.ui.sortable.table thead th.descending:after {
  content: '\25be';
}

/*--------------
    Inverted
---------------*/

/* Text Color */
.ui.inverted.table td {
  color: rgba(255, 255, 255, 0.9);
}
.ui.inverted.table th {
  background-color: rgba(0, 0, 0, 0.15);
  color: rgba(255, 255, 255, 0.9);
}

/* Stripes */
.ui.inverted.table tbody tr:nth-child(2n) {
  background-color: rgba(255, 255, 255, 0.06);
}

/*--------------
   Definition
---------------*/

.ui.definition.table td:first-child {
  font-weight: bold;
}

/*--------------
   Collapsing
---------------*/

.ui.collapsing.table {
  width: auto;
}

/*--------------
      Basic
---------------*/

.ui.basic.table th {
  background-color: transparent;
  padding: 0.5em;
}
.ui.basic.table tbody tr {
  border-bottom: 1px solid rgba(0, 0, 0, 0.03);
}
.ui.basic.table td {
  padding: 0.8em 0.5em;
}
.ui.basic.table tbody tr:nth-child(2n) {
  background-color: transparent !important;
}

/*--------------
     Padded
---------------*/

.ui.padded.table th,
.ui.padded.table td {
  padding: 0.8em 1em;
}

.ui.compact.table th {
  padding: 0.3em 0.5em;
}
.ui.compact.table td {
  padding: 0.2em 0.5em;
}

/*--------------
      Sizes
---------------*/

/* Small */
.ui.small.table {
  font-size: 0.875em;
}

/* Standard */
.ui.table {
  font-size: 1em;
}

/* Large */
.ui.large.table {
  font-size: 1.1em;
}


fix(rc): combine loan amount & state rules

/* ==========================================================================
   "Rate checker" custom styles
   ========================================================================== */

.rate-checker {
    .webfont-regular();

    .page-intro {
      border-bottom: 1px solid @gray-20;
    }
}

.rc-illu-inner {
  padding: 1em 4.5em 0 4.5em;
}

/*
    layout
    --------------------------- */

.calculator {
  .grid_column( 4 );
  .grid_push( 8 );
}

.rc-results {
  .grid_column( 8 );
  .grid_pull( 4 );
}

@media (max-width: 720px) {
  .calculator,
  .rc-results {
    .grid_column( 12 );
    .grid_push( 0 );
  }
}

/*
    Sidebar with all the user input
    --------------------------- */

.calculator {
   background: @gray-5;
   .webfont-regular();

    p:last-child,
    section p:last-child {
      margin: 0;
    }

    label {
      .webfont-medium();
      margin-bottom: 4px;
      text-transform: none;
    }

    .help {
        font-size: .9em;
    }

    section {
      margin: 0 15px;
      padding: 30px 0;
      border-top: 1px solid @gray-20;
    }

    section:first-child,
    section:nth-child(2) {
      border-top: none;
    }

    section:first-child {
      padding: 30px 0 0 0;
    }

    .calc-footer {
      padding: 15px 0; // the bottom <section> has less padding
    }

    input[type='number'] {
        -moz-appearance:textfield;
    }

    input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button {
        -webkit-appearance: none;
    }

    .calc-subsection {
      border-top: none;
      padding: 0 0 30px 0;
    }

    .form-sub {
      font-size: 0.714285714em;
      .webfont-regular();
      color: @darkgray;
    }

    #arm-warning {
      border-top: 0;
      padding-top: 0;
      margin-top: -10px;
    }
}

.calc-loan-details {
  .upper {
    margin-bottom: 15px;
  }
}

.loan-amt-total {
  padding-top: 10px;

  span {
    display: block;
    .webfont-medium();
    margin-top: 10px;
  }
}

.loan-amt-total,
.state-col {
  border-width: 0;

  .wrapper {
    padding: 0;
  }
}

.county {

  padding-top: 10px;

}

.downpayment-warning {
  font-size: 0.875em;
  padding-top: 10px;
}

.timestamp-message {
  font-size: 0.875em;
  text-align: right;
  margin-right: 1.25em; //align it nicely with the chart
}

/*
    Range slider for credit score
    --------------------------- */

.credit-score {
  position: relative;

  .labels {
    line-height: 0;
    margin: 15px 0 8px;
    font-size: .625em;
  }

  .max {
    float: right;
  }
}

.range {
  margin-bottom: 1.5em;
}

.range-text {
  position: absolute;
  display: block;
  margin-left: -10px;
  white-space: nowrap;
  font-size: .875em;
}

.rangeslider {
  background: transparent url(../img/slider-bg.png) scroll no-repeat center center;
  background-size: 100%;
  display: block;
  height: 20px;
  width: 100%;
  position: relative;
}

.rangeslider__fill {
  background: #00ff00;
  position: absolute;
  top: 0;
}

.rangeslider__handle {
  display: inline-block;
  width: 22px;
  height: 21px;
  position: absolute;
  background: transparent url(../img/slider-handle.png) no-repeat 0 0;
  background-size: 100%;
  border: 0;

  &.warning {
    background: transparent url(../img/slider-handle.png) no-repeat 0 100%;
    width: 22px;
    height: 21px;
    background-size: 100%;
  }

}

#credit-score:focus + .rangeslider .rangeslider__handle {
  border: 1px solid #0072ce;
  outline: 1px solid #0072ce;
  outline-offset: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
}

@media
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
  .rangeslider__handle {
    width: 22px;
    height: 21px;
    background: transparent url(../img/slider-handle@2x.png) no-repeat 0 0;
    background-size: 100%;
    border: 0;

    &.warning {
      background: transparent url(../img/slider-handle@2x.png) no-repeat 0 100%;
      width: 22px;
      height: 21px;
      background-size: 100%;
    }
  }
}

#slider-range {
  text-align: center;
}

/*
    Main section with output
    --------------------------- */

.rate-checker-heading {
  font-size: 1.375em;
  margin-top: 40px;
}

@media (min-width: 1000px) {
  // line break in the summary on large screens
 .rate-checker-heading {
    width: 75%;
  }
}

/*
    Middle section with chart
    --------------------------- */

// this is shameful, but this is needed to force highcharts to display overflowing tooltips
.highcharts-container {
  overflow: visible !important;
}

.chart {

  margin: 20px 20px 20px 0;
  padding-top: 40px;
  border-top: 1px solid @gray-20;
  border-bottom: 1px solid @gray-20;

  &.geolocating {
    background: transparent url(http://www.consumerfinance.gov/hmda/static/img/icon_spinner.gif) scroll no-repeat center center;
    #chart {
      opacity: 0;
    }
  }

  figure {
    .reset;
  }

}

.data-label {
  text-align: center;
  background-color: #fff;
}

.chart-caption {
  font-size: 1em;
  padding: 0 1em 1em 1em;
}

.caption-title {
  .webfont-regular();
  color: @black;
}

.rc-data-link {
  text-align: right;
  .webfont-medium();

  a {
    border-bottom-width: 1px;
  }
}

@media (max-width: 720px) {
  .rc-data-link {
    display: none;
  }
}

.highcharts-tooltip > span {
  z-index: 9999;
  background-color: #fff;
  color: @darkgray;
  border: 2px solid @green-midtone;
  padding: 4px 10px 4px 8px;
  margin: 0 2px;
}

.chart-tooltip {
  z-index: 9999;
  .lenders {
    .webfont-demi();
    display: inline-block;
    font-size: 3em;
    width: 20%;
  }
  .text {
    display: inline-block;
    width: 80%;
  }
}

@keyframes fadein {
    from { opacity: .3; }
    to { opacity: 1; }
}

/*
    "Compare interest rate costs"
    --------------------------- */

.compare {

  .webfont-regular();

  margin-top: 30px;

    label {
       .u-visually-hidden;
    }
}

//layout

.rc-comp-1 {
  .grid_column( 1 );
}

.rc-comp-3 {
  .grid_column( 3 );
}

.rc-comp-3-push {
  .grid_column( @columns: 3; @prefix: 1; @suffix: 0 )
}

.rc-comp-5 {
  .grid_column( 5 );
}

.vs {
  text-align: center;
  font-size: 1.375em;
}

.rc-comparison-subhead {
  font-size: 1em;
}

.rc-comparison-subsection {
  border-top: 1px solid @gray-10;
  padding: 1em 0;
}

.interest-cost {
  font-size: 1.625em;
  text-align: right;
}

.rate-compare-container {
  .grid_column( 6 );
  position: relative;
  margin-bottom: 10px;
}

.dollar-input,
.percent-input {
  position: relative;

  input {
    width: 100%;
    padding-left: 15px;
    border: solid 1px #d0d0ce;
  }

  .unit {
    position: absolute;
    display: block;
    left: 5px;
    top: 0.2em;
    z-index: 9;
    color: @gray;
  }
}

.down-payment {
  border-width: 0;
  .dollar-input {
    width: 65%;
    display: inline-block;
  }
  .percent-input {
    width: 32%;
    display: inline-block;
  }

  input {
    border: solid 1px #d0d0ce;
  }
}

@media (max-width: 1000px) {
  .down-payment {
    margin-top: 20px;
  }
}

.arm-info-comparison {
  .webfont-regular();
  padding: 1em 0;
  font-size: 0.75em;
  display: block;
  position: absolute;
  width: 200%;
}

@media (max-width: 1000px) {
  .flex-input {
    .grid_column(12);
  }
}

@media (max-width: 800px) {

  .rc-comparison-section {
    margin-top: 1.5em;
  }

  .rc-comparison-subsection {
    padding: 1em 0 0 0;
  }

  .rc-comp-1 {
  .grid_column( 2 );
}

  .rc-comp-3 {
    .grid_column( 5 );
  }

  .rc-comp-3-push {
  .grid_column( @columns: 5; @prefix: 1; @suffix: 0 )
}

  .rc-comp-5 {
    .grid_column( 12 );
  }

  .interest-cost {
    margin-bottom: .5em;
    .webfont-demi();
    color: @gray-80;
  }
}

/*
    "Next steps"
    --------------------------- */

.next-steps {
  margin-top: 5em;
  margin-bottom: 3.625em;

  .tabs {
    margin-top: 2em;
  }

  > p {
    margin-bottom: 55px;
  }
}

.next-steps-list {
  .reset;
}

.next-steps-heading {
  font-size: 1.125em;
  .webfont-regular();
  margin-bottom: 1em;
}

.next-steps-list {
  padding-left: 30px; // match the negative outdent of the numbering
  margin: 0;
  counter-reset: li;
  list-style: none;
  position: relative;

  li {
    display: inline-block;
    position: relative;
  }

}

.next-steps-list > li:before {
  content: counter(li);
  counter-increment: li;
  background: @green-midtone;
  color: @black;
  font-size: 12px;
  .webfont-demi();
  position: absolute;
  text-align: center;
  left: -30px;
  top: 1px;
  height: 20px;
  width: 20px;
  line-height: 20px;
  border-radius: 20px;
}

/*
    about
    --------------------------- */

    .about {
      border-top: 1px solid @gray-20;
      margin-top: 3.75em;
    }

    .feedback {
      background: @gray-5;
      padding: 24px 15px 80px 15px;
    }

/*
    Alerts and warnings
    --------------------------- */

.chart {
  .warning {
    position: relative;;

    .highcharts-container {
      opacity: .3;
    }
  }
}

.result-alert {
  border: 1px solid @redorange-50;
  background: #fff;
}

.chart-alert {
  position: absolute;
  top: 30%;
  background: #fff;
  padding: 1em 2em 1em 3em;
  .webfont-regular();

  .point-right {
    font-size: 1.5em;
  }
}

.credit-alert {
  font-size: 0.75em;
  padding: .714em .714em .714em 2.142em;
  background: @gray-5;
  color: @darkgray;
  margin: 2.5em 0 1em 0;
}

.form-sub.warning {
  margin-top: -20px;
  padding-top: 0;
  border-top: 0;
}

.warning-text {
  padding-left: 1.2em;
}

.warning-text:before {
  .cf-icon;
  content: "\e103";
  color:  @gold;
  text-indent: -1.2em;
  margin-right: .2em;
}

/* ==========================================================================
   "Rate checker" custom styles
   ========================================================================== */

.rate-checker {
    .webfont-regular();

    .page-intro {
      border-bottom: 1px solid @gray-20;
    }
}

.rc-illu-inner {
  padding: 1em 4.5em 0 4.5em;
}

/*
    layout
    --------------------------- */

.calculator {
  .grid_column( 4 );
  .grid_push( 8 );
}

.rc-results {
  .grid_column( 8 );
  .grid_pull( 4 );
}

@media (max-width: 720px) {
  .calculator,
  .rc-results {
    .grid_column( 12 );
    .grid_push( 0 );
  }
}

/*
    Sidebar with all the user input
    --------------------------- */

.calculator {
   background: @gray-5;
   .webfont-regular();

    p:last-child,
    section p:last-child {
      margin: 0;
    }

    label {
      .webfont-medium();
      margin-bottom: 4px;
      text-transform: none;
    }

    .help {
        font-size: .9em;
    }

    section {
      margin: 0 15px;
      padding: 30px 0;
      border-top: 1px solid @gray-20;
    }

    section:first-child,
    section:nth-child(2) {
      border-top: none;
    }

    section:first-child {
      padding: 30px 0 0 0;
    }

    .calc-footer {
      padding: 15px 0; // the bottom <section> has less padding
    }

    input[type='number'] {
        -moz-appearance:textfield;
    }

    input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button {
        -webkit-appearance: none;
    }

    .calc-subsection {
      border-top: none;
      padding: 0 0 30px 0;
    }

    .form-sub {
      font-size: 0.714285714em;
      .webfont-regular();
      color: @darkgray;
    }

    #arm-warning {
      border-top: 0;
      padding-top: 0;
      margin-top: -10px;
    }
}

.calc-loan-details {
  .upper {
    margin-bottom: 15px;
  }
}

.loan-amt-total {
  padding-top: 10px;
  border-width: 0;

  .wrapper {
    padding: 0;
  }

  span {
    display: block;
    .webfont-medium();
    margin-top: 10px;
  }
}

.county {

  padding-top: 10px;

}

.downpayment-warning {
  font-size: 0.875em;
  padding-top: 10px;
}

.timestamp-message {
  font-size: 0.875em;
  text-align: right;
  margin-right: 1.25em; //align it nicely with the chart
}

/*
    Range slider for credit score
    --------------------------- */

.credit-score {
  position: relative;

  .labels {
    line-height: 0;
    margin: 15px 0 8px;
    font-size: .625em;
  }

  .max {
    float: right;
  }
}

.range {
  margin-bottom: 1.5em;
}

.range-text {
  position: absolute;
  display: block;
  margin-left: -10px;
  white-space: nowrap;
  font-size: .875em;
}

.rangeslider {
  background: transparent url(../img/slider-bg.png) scroll no-repeat center center;
  background-size: 100%;
  display: block;
  height: 20px;
  width: 100%;
  position: relative;
}

.rangeslider__fill {
  background: #00ff00;
  position: absolute;
  top: 0;
}

.rangeslider__handle {
  display: inline-block;
  width: 22px;
  height: 21px;
  position: absolute;
  background: transparent url(../img/slider-handle.png) no-repeat 0 0;
  background-size: 100%;
  border: 0;

  &.warning {
    background: transparent url(../img/slider-handle.png) no-repeat 0 100%;
    width: 22px;
    height: 21px;
    background-size: 100%;
  }

}

#credit-score:focus + .rangeslider .rangeslider__handle {
  border: 1px solid #0072ce;
  outline: 1px solid #0072ce;
  outline-offset: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
}

@media
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
  .rangeslider__handle {
    width: 22px;
    height: 21px;
    background: transparent url(../img/slider-handle@2x.png) no-repeat 0 0;
    background-size: 100%;
    border: 0;

    &.warning {
      background: transparent url(../img/slider-handle@2x.png) no-repeat 0 100%;
      width: 22px;
      height: 21px;
      background-size: 100%;
    }
  }
}

#slider-range {
  text-align: center;
}

/*
    Main section with output
    --------------------------- */

.rate-checker-heading {
  font-size: 1.375em;
  margin-top: 40px;
}

@media (min-width: 1000px) {
  // line break in the summary on large screens
 .rate-checker-heading {
    width: 75%;
  }
}

/*
    Middle section with chart
    --------------------------- */

// this is shameful, but this is needed to force highcharts to display overflowing tooltips
.highcharts-container {
  overflow: visible !important;
}

.chart {

  margin: 20px 20px 20px 0;
  padding-top: 40px;
  border-top: 1px solid @gray-20;
  border-bottom: 1px solid @gray-20;

  &.geolocating {
    background: transparent url(http://www.consumerfinance.gov/hmda/static/img/icon_spinner.gif) scroll no-repeat center center;
    #chart {
      opacity: 0;
    }
  }

  figure {
    .reset;
  }

}

.data-label {
  text-align: center;
  background-color: #fff;
}

.chart-caption {
  font-size: 1em;
  padding: 0 1em 1em 1em;
}

.caption-title {
  .webfont-regular();
  color: @black;
}

.rc-data-link {
  text-align: right;
  .webfont-medium();

  a {
    border-bottom-width: 1px;
  }
}

@media (max-width: 720px) {
  .rc-data-link {
    display: none;
  }
}

.highcharts-tooltip > span {
  z-index: 9999;
  background-color: #fff;
  color: @darkgray;
  border: 2px solid @green-midtone;
  padding: 4px 10px 4px 8px;
  margin: 0 2px;
}

.chart-tooltip {
  z-index: 9999;
  .lenders {
    .webfont-demi();
    display: inline-block;
    font-size: 3em;
    width: 20%;
  }
  .text {
    display: inline-block;
    width: 80%;
  }
}

@keyframes fadein {
    from { opacity: .3; }
    to { opacity: 1; }
}

/*
    "Compare interest rate costs"
    --------------------------- */

.compare {

  .webfont-regular();

  margin-top: 30px;

    label {
       .u-visually-hidden;
    }
}

//layout

.rc-comp-1 {
  .grid_column( 1 );
}

.rc-comp-3 {
  .grid_column( 3 );
}

.rc-comp-3-push {
  .grid_column( @columns: 3; @prefix: 1; @suffix: 0 )
}

.rc-comp-5 {
  .grid_column( 5 );
}

.vs {
  text-align: center;
  font-size: 1.375em;
}

.rc-comparison-subhead {
  font-size: 1em;
}

.rc-comparison-subsection {
  border-top: 1px solid @gray-10;
  padding: 1em 0;
}

.interest-cost {
  font-size: 1.625em;
  text-align: right;
}

.rate-compare-container {
  .grid_column( 6 );
  position: relative;
  margin-bottom: 10px;
}

.dollar-input,
.percent-input {
  position: relative;

  input {
    width: 100%;
    padding-left: 15px;
    border: solid 1px #d0d0ce;
  }

  .unit {
    position: absolute;
    display: block;
    left: 5px;
    top: 0.2em;
    z-index: 9;
    color: @gray;
  }
}

.down-payment {
  border-width: 0;
  .dollar-input {
    width: 65%;
    display: inline-block;
  }
  .percent-input {
    width: 32%;
    display: inline-block;
  }

  input {
    border: solid 1px #d0d0ce;
  }
}

.state-col {
  border-width: 0;

  .wrapper {
    padding: 0;
  }
}

@media (max-width: 1000px) {
  .down-payment {
    margin-top: 20px;
  }
}

.arm-info-comparison {
  .webfont-regular();
  padding: 1em 0;
  font-size: 0.75em;
  display: block;
  position: absolute;
  width: 200%;
}

@media (max-width: 1000px) {
  .flex-input {
    .grid_column(12);
  }
}

@media (max-width: 800px) {

  .rc-comparison-section {
    margin-top: 1.5em;
  }

  .rc-comparison-subsection {
    padding: 1em 0 0 0;
  }

  .rc-comp-1 {
  .grid_column( 2 );
}

  .rc-comp-3 {
    .grid_column( 5 );
  }

  .rc-comp-3-push {
  .grid_column( @columns: 5; @prefix: 1; @suffix: 0 )
}

  .rc-comp-5 {
    .grid_column( 12 );
  }

  .interest-cost {
    margin-bottom: .5em;
    .webfont-demi();
    color: @gray-80;
  }
}

/*
    "Next steps"
    --------------------------- */

.next-steps {
  margin-top: 5em;
  margin-bottom: 3.625em;

  .tabs {
    margin-top: 2em;
  }

  > p {
    margin-bottom: 55px;
  }
}

.next-steps-list {
  .reset;
}

.next-steps-heading {
  font-size: 1.125em;
  .webfont-regular();
  margin-bottom: 1em;
}

.next-steps-list {
  padding-left: 30px; // match the negative outdent of the numbering
  margin: 0;
  counter-reset: li;
  list-style: none;
  position: relative;

  li {
    display: inline-block;
    position: relative;
  }

}

.next-steps-list > li:before {
  content: counter(li);
  counter-increment: li;
  background: @green-midtone;
  color: @black;
  font-size: 12px;
  .webfont-demi();
  position: absolute;
  text-align: center;
  left: -30px;
  top: 1px;
  height: 20px;
  width: 20px;
  line-height: 20px;
  border-radius: 20px;
}

/*
    about
    --------------------------- */

    .about {
      border-top: 1px solid @gray-20;
      margin-top: 3.75em;
    }

    .feedback {
      background: @gray-5;
      padding: 24px 15px 80px 15px;
    }

/*
    Alerts and warnings
    --------------------------- */

.chart {
  .warning {
    position: relative;;

    .highcharts-container {
      opacity: .3;
    }
  }
}

.result-alert {
  border: 1px solid @redorange-50;
  background: #fff;
}

.chart-alert {
  position: absolute;
  top: 30%;
  background: #fff;
  padding: 1em 2em 1em 3em;
  .webfont-regular();

  .point-right {
    font-size: 1.5em;
  }
}

.credit-alert {
  font-size: 0.75em;
  padding: .714em .714em .714em 2.142em;
  background: @gray-5;
  color: @darkgray;
  margin: 2.5em 0 1em 0;
}

.form-sub.warning {
  margin-top: -20px;
  padding-top: 0;
  border-top: 0;
}

.warning-text {
  padding-left: 1.2em;
}

.warning-text:before {
  .cf-icon;
  content: "\e103";
  color:  @gold;
  text-indent: -1.2em;
  margin-right: .2em;
}


changed border radius

changed border radius

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/dedalozzo/pit-bootstrap.git/'


Update path in comment for less-imports rename

// Import from the theme's variables with a fallback to /static/variables/ui-variables.less
@import "ui-variables";
@import "octicon-utf-codes";
@import "octicon-mixins";

@import "root-view.less";
@import "overlay.less";
@import "popover-list.less";
@import "notification.less";
@import "markdown.less";
@import "editor.less";
@import "select-list.less";

:focus {
  outline: none;
}

// Import from the theme's variables with a fallback to /static/less-imports/ui-variables.less
@import "ui-variables";
@import "octicon-utf-codes";
@import "octicon-mixins";

@import "root-view.less";
@import "overlay.less";
@import "popover-list.less";
@import "notification.less";
@import "markdown.less";
@import "editor.less";
@import "select-list.less";

:focus {
  outline: none;
}


change mobile breakpoint

change mobile breakpoint

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/MerlinBB/atp-marketing.git/'


style <hr> within blog posts

style <hr> within blog posts

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/crdx/crdx.org.git/'


Improved tablet styling.

Improved tablet styling.

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/simonpfry/AuctionHouse.git/'


Trying to fix the white background issue in the settings view

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/jasonhulbert/termal-ui.git/'


add secondary color

add secondary color

// -----------------------------------------
// BaseKit Standard Template: LESS > Widgets
// -----------------------------------------

// -----------------------------
// #Table of Contents
// -----------------------------

//  1.   #LOGO
//  2.   #COMPANY NAME
//  3.   #NAVIGATION
//  4.   #FEATURE

//  5.   #IMAGES
//  6.   #GALLERY
//  7.   #SLIDESHOW

//  8.   #BUTTONS
//  8.1  -- #STANDARD
//  8.2  -- #TWEET
//  8.3  -- #DROPBOX
//  8.4  -- #CLICK TO CALL
//  8.5  -- #PAYPAL

//  9.   #CONTACT FORM
// 10.   #SIGNUP FORM & BLOG SEARCH

// 11.   #SOCIAL ICONS
// 12.   #TWITTER FEED

// 13.   #DIVIDER (KEYLINE)
// 14.   #PROFILE
// 15.   #MAP
// 16.   #YELP

// -----------------------------
// 1-2  #Logo & #Company Name
// -----------------------------

.brand {
    text-align: center;
    margin: 0 0 .5em;
}

.logo-image {
    display: inline-block;
    margin-bottom: 10px;
}

a.company-link:hover {
    text-decoration: none;
    color: @color__secondary;
}

// -----------------------------
// 3.  #Navigation
// -----------------------------

// Widget Overlay
.widget__extendednavigation {
    + .widget-overlay {
        @media @tablet {
            display: none;
        }
    }

    &.open + .widget-overlay {
        @media @tablet {
            z-index: 10400!important;
            display: block;
            margin: 44px auto 0;

            &:hover {
                background: rgba(0, 147, 135, 0.2);
                border: 1px solid rgb(0, 148, 136);
                box-shadow: rgba(0, 147, 135, 0.2) 0px 0px 0px 3px inset;
            }
        }
    }
}

// Remove margin from ul nav list and widget

.widget[data-widget-type="extendednavigation"] {
    margin-bottom: 0;
}

.navigation-list {
    margin: 0;
    background-color: @color__navigation--background;
    @media only screen and (min-width: 769px) {
        padding: 10px 0;
    }
}

// Navigation alignment

.extendednavigation {
    &.align-left { text-align: left; }
    &.align-right { text-align: right; }
    &.align-center { text-align: center; }
}

// Nav font

.extendednavigation {
    &__item-name.item-name {
        color: @color__navigation--text;
        font-size: @font__navigation--font-size;
        font-weight: @font__navigation--font-weight;
        line-height: @font__navigation--line-height;
        letter-spacing: @font__navigation--letter-spacing;
        &:hover {
            color: @color__navigation--text--hover;
        }
    }
}

// Dropdown Menu - Folder Item Parent: Gives arrow

.item-name--parent:after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    margin-left: 4px;
    border: 5px solid transparent;
    border-top-color: @color__navigation--text;
}

.item-name--parent:hover:after {
    border-top-color: @color__navigation--text--hover;
}

// Selected nav item

.navigation-item.selected > .item-name {
    color: @color__navigation--text--selected;
}

// Folder

.navigation-list--children {
    left: inherit;
    right: 0;
    width: auto;
    min-width: 200px;
    white-space: normal;
    border: 1px solid darken(@color__body--background, 7%);
    background-color: @color__navigation--background;
    // Padding for folder list and folder items on desktop
    @media only screen and (min-width: 769px) {
        padding: 7px 0;
        .item-name {
            padding: 7px 14px;
        }
    }
    @media @tablet {
        width: 100%;
    }
}

// Collapsible navigation
// ----------------------
// MISSING CLASS IN THE TOGGLE WHEN YOU CLICK ON IT.
// A SCRIPT FOR THE TOGGLE TO WORK HAS BEEN ADDED TO LAYOUT.TWIG

.navigation-toggle {
    display: none;
}

@media @mobile {
    .navigation-toggle {
        display: block;
        overflow: hidden;
        width: 100%;
        height: 45px;
        text-indent: -9999px;
        line-height: 0;
        background-color: darken(@color__navigation--background, 10%);
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0;
        outline: 0;
        &:before {
            content: '';
            position: absolute;
            width: 26px;
            height: 3px;
            top: 0;
            left: 50%;
            right: 0;
            margin-top: 15px;
            margin-left: -13px;
            background: darken(@color__navigation--background, 50%);
            box-shadow: 0 6px 0 darken(@color__navigation--background, 50%);
            .transition( all, 0.5s, ease );
        }
        &:after {
            content: '';
            position: absolute;
            width: 26px;
            height: 3px;
            top: 12px;
            left: 50%;
            right: 0;
            margin-top: 15px;
            margin-left: -13px;
            background: darken(@color__navigation--background, 50%);
            .transition( all, 0.5s, ease );
        }
    }
    .navigation-toggle:hover {
        background-color: darken(@color__navigation--background, 10%);
            &:before {
                background: @color__body--background;
                box-shadow: 0 6px 0 @color__body--background;
            }
            &:after {
                background: @color__body--background;
            }
    }
    // Toggle Button Open State
    .open & {
        &.navigation-toggle {
            background-color: darken(@color__navigation--background, 10%);
            &:before {
                margin-top: 21px;
                background: darken(@color__navigation--background, 50%);
                box-shadow: none;
                -webkit-transform: rotate(45deg);
                -moz-transform: rotate(45deg);
                -o-transform: rotate(45deg);
                -ms-transform: rotate(45deg);
                transform: rotate(45deg);
                .transition( all, 0.5s, ease );
            }
            &:after {
                content: '';
                position: absolute;
                width: 26px;
                height: 3px;
                top: 0;
                left: 50%;
                right: 0;
                margin-top: 21px;
                margin-left: -13px;
                background: darken(@color__navigation--background, 50%);
                box-shadow: none;
                -webkit-transform: rotate(-45deg);
                -moz-transform: rotate(-45deg);
                -o-transform: rotate(-45deg);
                -ms-transform: rotate(-45deg);
                transform: rotate(-45deg);
                .transition( all, 0.5s, ease );
            }
        }
        &.navigation-toggle:hover {
            &:before,
            &:after {
                background: @color__body--background;
            }
        }
    }
    .navigation-body {
        display: none;
        .open & {
            display: block;
        }
    }
    .navigation-item {
        width: 100%;
        border-bottom: 1px solid darken(@color__body--background, 7%);
    }
}

// -----------------------------
// 4.  #Feature
// -----------------------------

// -----------------------------
// 5.  #Images
// -----------------------------

// Image Captions
// --------------

// Image Widget
.imagewidget__image-title {
    color: @color__image-title--text;
    font-family: @font__h4--font-family;
    font-size: @font__h4--font-size;
    font-weight: @font__h4--font-weight;
    line-height: @font__h4--line-height;
}
.imagewidget__image-description {
    color: @color__image-description--text;
    font-family: @font__p--font-family;
    font-size: @font__p--font-size;
    font-weight: @font__p--font-weight;
    line-height: @font__p--line-height;
}

// -----------------------------
// 6.  #Gallery
// -----------------------------

// The following styles give you a three column gallery layout with a
// coloured overlay

// Gallery Layout
// --------------

// Gallery List
.gallery-list {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

// Gallery Item
.gallery__gallery-item {
    position: relative;
    width: 32%;
    margin-bottom: 20px;
    // Display 100% at mobile
    @media @mobile {
        width: 100%;
    }
}

// Gallery Images
// --------------

// Use Background-image Method
.gallery__image-link {
    display: block;
    height: 280px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    @media @tablet {
        height: 210px;
    }
}

.gallery__caption {
    .caption-link:hover {
        text-decoration: none;
    }
    .image-title,
    .image-description {
        &:hover {
            color: @color__secondary;
        }
    }
    @media @tablet {
        padding: 10px;
        .image-title,
        .image-description {
            font-size: bkscale(@font__p--font-size, .9);
            line-height: bkscale(@font__p--line-height, .9);
        }
    }
}

// Gallery Images in Responsive Columns

// Two Columns
.columns-two-left,
.columns-two-right {
    .gallery__image-link {
        height: 150px;
        @media @tablet {
            height: 107px;
        }
        @media @mobile {
            height: 200px;
        }
    }
    .gallery__caption {
        padding: 10px;
        // hide description on desktop
        @media only screen and (min-width: 768px) {
            .image-description {
                display: none;
            }
        }
    }
    // hide caption on tablet only
    @media only screen and (max-width : 768px) and (min-width : 480px) {
        .gallery__figure:hover .gallery__caption {
            display: none;
        }
    }
}
// Three Columns
.columns-three-left,
.columns-three-middle,
.columns-three-right {
    .gallery__image-link {
        height: 95px;
        @media @tablet {
            height: 69px;
        }
        @media @mobile {
            height: 200px;
        }
    }
    // hide caption on desktop and tablet
    @media only screen and (min-width: 480px) {
        .gallery__figure:hover .gallery__caption {
            display: none;
        }
    }
}
// Four Columns
.columns-four-first,
.columns-four-second,
.columns-four-third,
.columns-four-fourth {
    .gallery__image-link {
        height: 69px;
        @media @tablet {
            height: 107px;
        }
        @media @mobile {
            height: 200px;
        }
    }
    // hide caption on desktop and tablet
    @media only screen and (min-width: 480px) {
        .gallery__figure:hover .gallery__caption {
            display: none;
        }
    }
}

// Hide Img Element
.gallery__image { display: none; }

// Gallery Image Captions
// ----------------------

// Hide Caption
.gallery__caption {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 20px;
    opacity: 0;
    background-color: hsla(hue(@color__body--background),
                           saturation(@color__body--background),
                           lightness(@color__body--background), 0.8);
    border: 1px solid darken(@color__body--background, 5%);
    .transition( all, 0.5s, ease );
}

.gallery__image-title {
    color: @color-swatch4;
    .transition( all, 0.5s, ease );
}

.gallery__image-description {
    color: @color-swatch5;
    .transition( all, 0.5s, ease );
}

// Show Caption
.gallery__figure:hover .gallery__caption {
    opacity: 1;
    a:hover {
        text-decoration: none;
        .image-title,
        .image-description {
            color: @color__secondary;
        }
    }
}

// -----------------------------
// 7.  #Slideshow
// -----------------------------

// Slideshow Layout
// ----------------

// Slideshow Height
.slides-list {
    max-height: 400px;
    overflow: hidden;
    @media @tablet {
        max-height: 300px;
    }
    @media @mobile {
        max-height: 200px;
    }
}

.slides-list,
.responsiveslideshow .figure {
    position: relative;
    min-height: 400px;
    @media @tablet {
        min-height: 300px;
    }
    @media @mobile {
        min-height: 200px;
    }
}

// Slideshow Images
// ----------------

// Use Background-image Method
.responsiveslideshow .figure {
    background-size: cover;
    background-position: center;
}
// Hide Img Element
.responsiveslideshow .image { display: none; }

// Slideshow Image Captions
// ------------------------

.responsiveslideshow .caption {
    position: absolute;
    bottom: 0;
    width: auto;
    padding: 20px;
    background-color: none;
    @media @tablet {
        padding: 10px;
    }
    .image-title,
    .image-description {
        color: @color__body--background;
        @media @tablet {
            font-size: bkscale(@font__p--font-size,0.9);
            line-height: bkscale(@font__feature-strapline--line-height,0.9);
        }
        @media @mobile {
            font-size: bkscale(@font__p--font-size,0.8);
            line-height: bkscale(@font__feature-strapline--line-height,0.8);
        }
    }
}

// Slideshow Navigation
// --------------------

.slide-navigation {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-direction: normal;
    -moz-box-direction: normal;
    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-content: flex-end;
    -ms-flex-line-pack: end;
    align-content: flex-end;
    -webkit-box-align: start;
    -moz-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    .button.icon:before,
    .button.icon:after {
        margin-right: 0;
        margin-left: 0;
    }
    // Removes button text
    .control-text {
        display: none;
    }
    // Same height as images
    min-height: 400px;
    @media @tablet {
        min-height: 300px;
    }
    @media @mobile {
        min-height: 200px;
    }
}

// Slideshow Navigation for Tablet and Desktop
@media only screen and (min-width:480px) {
    .slide-navigation {
        position: absolute;
        top: 0;
        width: 100%;
        margin: 0;
        .button {
            color: @color__body--background;
            padding: 0;
            outline: 0;
            -webkit-border-radius: 0;
            -moz-border-radius: 0;
            border-radius: 0;
        }
        .button:hover {
            color: @color__navigation--text--hover;
            background-color: transparent;
        }
        .previous-button,
        .next-button,
        .pause-toggle {
            position: absolute;
            top: 0;
            width: 30px;
            height: 100%;
            background-color: transparent;
        }
        .previous-button {
            left: 0;
        }
        .next-button {
            right: 0;
        }
        .pause-toggle {
            right: 48%;
        }
    }
}

// Centre pause button
.slide-navigation .pause-toggle {
    margin: 0 auto;
}

// Slideshow Navigation for Mobile
@media only screen and (max-width:480px) {
    .slide-navigation {
        margin: 20px 0;
        min-height: inherit;
    }
}

// Slideshow Pagination
// --------------------

.slide-pagination {
    position: relative;
}

.slide-pagination .pagination-list {
    display: inline-block;
    width: 100%;
    margin-top: 20px;
    text-align: center;
    .pagination-item {
        margin: 0 2px;
        display: inline-block;
    }
    .button {
        width: 8px;
        height: 8px;
        padding: 0;
        text-indent: -9999px;
        overflow: hidden;
        box-shadow: none;
        -webkit-border-radius: 50px;
           -moz-border-radius: 50px;
                border-radius: 50px;
        background-color: darken(@color__body--background, 20%);
    }
    .pagination-item.selected .button {
        background-color: @color-swatch4;
    }
}

// -----------------------------
// 8.  #Buttons
// -----------------------------

// All buttons inherit #Standard button styles

//  8.1  #Standard
//  --------------

button,
.button {
    padding: 9px 18px;
    .border-radius(3px);
    .transition( all, 0.5s, ease );
    cursor: pointer;
    background-color: @color__button--background;
    color: @color__button--text;
    &:hover {
        background-color: @color__button--background--hover;
    }
}

.click-to-call .icon:before {
    margin-left: 2px;
}

//  8.5  #Paypal
//  ------------

.paypalbuynow form {
    margin-bottom: 0;
}

// -----------------------------
// 9.  #Contact Form
// -----------------------------

// Global form styles are set in 'less > template.less' (4. #Forms)

// --------------------------------
// 10.  #Signup Form & #Blog Search
// --------------------------------

// Styles are set in 'less > template.less' (4. #Forms)

// -----------------------------
// 11.  #Social Icons
// -----------------------------

.social-item {
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    background-color: @color__socialicons--icon--background;
    width: 28px;
    height: 28px;
    margin-right: 3px;
    text-align: center;
    &:hover {
        background-color: darken(@color__socialicons--icon--background, 10%);
    }
    .social-link {
        display: inline-block;
        padding: 5px 8px 6px;
        color: @color__socialicons--icon;
        &:before {
            margin-right: 0;
            font-size: 14px;
            color: @color__socialicons--icon;
        }
        &:hover {
            text-decoration: none;
        }
    }
    .social-name {
        display: none;
    }
}

// -----------------------------
// 12.  #Twitter Feed
// -----------------------------

.tweet-item {
    background-color: @color__twitter-item--background;
    border: 2px solid darken(@color__twitter-item--background, 6%);
    padding: 2em;
    p {
        padding-bottom: 0;
    }
    .avatar {
        max-width: 17%;
        margin-right: 2%;
    }
    .tweet-wrap {
        max-width: 80%;
    }
    .avatar,
    .tweet-wrap {
        display: inline-block;
        vertical-align: top;
        @media @mobile {
            max-width: 100%;
            width: auto;
            margin: 0 auto;
        }
    }
    .account-link {
        color: @color__twitter-account-name--text;
    }
    .account-name {
        font-family: @font__p--font-family;
        color: @color__twitter-account-name--text;
        font-size: @font__p--font-size;
        font-weight: @font__p--font-weight;
        line-height: @font__p--line-height;
    }
    .tweet-content {
        color: @color__twitter-tweet--text;
        word-wrap: break-word;
        word-break: break-word;
    }
    .tweet-metadata {
        font-size: 90%;
        .timestamp, .via {
            color: lighten(@color__twitter-tweet--text, 15%);
        }
    }
    .timestamp {
        margin-right: 5px;
    }
}

// Responsive columns
.columns-four-first,
.columns-four-second,
.columns-four-third,
.columns-four-fourth,
.columns-three-left,
.columns-three-middle,
.columns-three-right {
    .tweet-item {
        padding: 1em;
    }
    .avatar,
    .tweet-wrap {
        max-width: 100%;
        width: auto;
        margin: 0 auto;
    }
}

// -----------------------------
// 13.  #Divider (Keyline)
// -----------------------------

hr.rule {
    height: 3px;
    background-color: darken(@color__body--background, 8%);
}

// Horizontal rule in blog posts
hr {
    height: 2px;
    border: 0;
    margin-bottom: 18px;
    background-color: darken(@color__body--background, 8%);
}

// -----------------------------
// 14. #Profile
// -----------------------------

.profile {
    text-align: center;
    @media only screen and (min-width: 678px) {
        padding: 0 8em 0;
    }
    h1,h2,h3,p {
        font-family: @font__p--font-family;
        color: @color__p--text;
        font-size: @font__p--font-size;
        font-weight: @font__p--font-weight;
        line-height: @font__p--line-height;
    }
    // Twitter
    .tweet-item {
        padding: 0;
        padding-left: 0;
        margin: 0 auto;
        background-color: @color__body--background;
        border: none;
        max-width: 100%;
    }
    .avatar-image { display: none; }

    // Social Icons
    .social-list {
        margin-top: 18px;
    }

    // Address
    .address-line {
        padding-bottom: 0;
    }
    // Profile Signup Form: Styles are set in 'less > template.less' (4. #Forms)
}

// Phone number for tablet and desktop styled as normal paragraph text
@media only screen and (min-width: 481px) {
    .profile a.phone-number-link {
        color: @color-swatch5;
        &:hover {
            text-decoration: none;
            cursor: default;
        }
    }
}

// -----------------------------
// 15.  #Map
// -----------------------------

.bk-map.map.widget__map {
    height: auto;
}

// -----------------------------
// 16.  #Yelp
// -----------------------------

.yelpreview ul {
    list-style: none;
    margin: 16px 0;
}

error: pathspec 'widgets.less' did not match any file(s) known to git


Create stacked.less

Create stacked.less

// Stacked Icons
// -------------------------

.@{fa-css-prefix}-stack {
  position: relative;
  display: inline-block;
  width: 2em;
  height: 2em;
  line-height: 2em;
  vertical-align: middle;
}
.@{fa-css-prefix}-stack-1x, .@{fa-css-prefix}-stack-2x {
  position: absolute;
  left: 0;
  width: 100%;
  text-align: center;
}
.@{fa-css-prefix}-stack-1x { line-height: inherit; }
.@{fa-css-prefix}-stack-2x { font-size: 2em; }
.@{fa-css-prefix}-inverse { color: @fa-inverse; }

error: pathspec 'font-awesome/less/stacked.less' did not match any file(s) known to git


Adding some global table styles for "active" statuses

html {
  height:100vh;
  width:100vw;
  max-width:@app-container-size;
  margin:0 auto;
  overflow:hidden;
  background-color:@html-bg;
}

body {
  height:100%;
  width:100%;
  overflow:hidden;
  position:relative;
}

main {
  flex:1 1 auto;
  overflow:hidden;
  position:relative;
  > [id^="COMPONENT_"] { //Make the component container element fill the entire <main> for background styles
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    top:0;
    overflow-y:auto;
    overflow-x:hidden;
    padding-bottom:25px;
  }
}

[ui-sref],
[ng-click]{
  cursor: pointer;
}

.container {
  max-width:100%;
}

.pagination {
  margin:0;
}

//TABLES WITH FIXED HEADERS
.table-fixed-header {
  position:relative;
  padding-top:@table-header-height;
  margin-bottom:@line-height-computed;
  overflow:hidden;
  .table-header-bg {
    position:absolute;
    left:0; right:0; top:0;
    height:@table-header-height;
    background:@table-bg;
    border:1px solid @table-border-color;
    border-bottom-width:2px;
  }
  .table-container {
    background-color:@table-bg;
    overflow-y:auto;
    overflow-x:hidden;
    max-height:@infinite-scroll-size;
    border: 1px solid @table-border-color;
    border-top-width:0;
    table {
      border-spacing:0;
      margin-bottom:0;
    }
    td {
      border:1px solid @table-border-color;
      vertical-align:middle;
      &:first-child {
        border-left:none;
      }
      &:last-child {
        border-left:none;
      }
    }
    th {
      height: 0;
      line-height: 0;
      padding: 0 25px;
      color: transparent;
      border: none;
      white-space: nowrap;
      span {
        max-height:0;
        height:0;
        line-height:0;
        margin:0;
        padding:0;
      }
      div{
        position: absolute;
        background: transparent;
        padding:@table-cell-padding;
        color: @text-color;
        top: 0;
        margin-left: -25px;
        line-height: @line-height-base;
        vertical-align: bottom;
        border-left:1px solid @table-border-color;
      }
      &:first-child div{
        border: none;
      }
    }
    tbody tr {
      &:first-child {
        td {
          border-top:none;
        }
      }
      &:last-child {
        td {
          border-bottom:none;
        }
      }
    }
  }
}
colgroup {
  > col {
    .action-column {
      width:70px;
    }
  }
}

.table > tbody > tr {
  > td {
	&.actions-cell {
	  text-align:right;
	  white-space: nowrap;
	  @media(max-width:@screen-xs-max) {
		text-align:center;
	  }
	}
  }
}

// OC Responsive Tables
// commandeered from http://codepen.io/pixelchar/pen/rfuqK
.oc-table-responsive {
  &.table-bordered {
    border:none;
    & > tbody > tr{
      & > th {
        border:none;
      }
      & > td {
        border-width:1px 0 0 0;
      }
    }
  }

  > thead,
  > tbody,
  > tfoot {
    > tr {
      > th,
      > td {
        vertical-align: middle;
      }
    }
  }

  thead {
    // Accessibly hide <thead> on narrow viewports
    position: absolute;
    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
    clip: rect(1px, 1px, 1px, 1px);
    padding: 0;
    border: 0;
    height: 1px;
    width: 1px;
    overflow: hidden;
  }

  // Set these items to display: block for narrow viewports
  tbody,
  tr,
  th,
  td {
    display: block;
    white-space: normal;
  }

  tr {
    &:extend(.panel); //Mobile table row looks like a bootstrap panel
    border-color: @panel-default-border;
    overflow:hidden;
  }

  tbody {
    & > tr > th {
      border-top: none;
      background-color: @panel-default-heading-bg;
    }
    td {
      &[data-title] {
        .clearfix(); //Clearfix solution for empty table cells on mobile
        &:before {
          content: attr(data-title);
          float: left;
          color: @gray-light;
        }
      }
      @media(max-width:@screen-sm-min) {
        text-align:right;
      }
    }
  }

  @media(min-width:@screen-sm-min) {
    &.table-bordered {
      border:1px solid @table-border-color;
      & > tbody > tr{
        & > th {
          border:1px solid @table-border-color;
        }
        & > td {
          border-width:1px;
        }
      }
    }
    thead {
      position: relative;
      clip: auto;
      height: auto;
      width: auto;
      overflow: auto;
    }
    tr {
      display: table-row;
      margin-bottom: 0;
      border: none;
    }
    th,
    td {
      // Undo display: block
      display: table-cell;
    }
    tbody {
      display:table-row-group;
      tr {
        display:table-row;
      }
      & > tr > th {
        border-top: 1px solid @table-border-color;
        background-color: transparent;
      }
      td {
        &[data-title]:before {
          content: none;
        }
      }
    }
  }
  .fa-circle {
    color:@gray-lighter;
    &.active {
      color:@brand-success;
    }
  }
}

html {
  height:100vh;
  width:100vw;
  max-width:@app-container-size;
  margin:0 auto;
  overflow:hidden;
  background-color:@html-bg;
}

body {
  height:100%;
  width:100%;
  overflow:hidden;
  position:relative;
}

main {
  flex:1 1 auto;
  overflow:hidden;
  position:relative;
  > [id^="COMPONENT_"] { //Make the component container element fill the entire <main> for background styles
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    top:0;
    overflow-y:auto;
    overflow-x:hidden;
    padding-bottom:25px;
  }
}

[ui-sref],
[ng-click]{
  cursor: pointer;
}

.container {
  max-width:100%;
}

.pagination {
  margin:0;
}

//TABLES WITH FIXED HEADERS
.table-fixed-header {
  position:relative;
  padding-top:@table-header-height;
  margin-bottom:@line-height-computed;
  overflow:hidden;
  .table-header-bg {
    position:absolute;
    left:0; right:0; top:0;
    height:@table-header-height;
    background:@table-bg;
    border:1px solid @table-border-color;
    border-bottom-width:2px;
  }
  .table-container {
    background-color:@table-bg;
    overflow-y:auto;
    overflow-x:hidden;
    max-height:@infinite-scroll-size;
    border: 1px solid @table-border-color;
    border-top-width:0;
    table {
      border-spacing:0;
      margin-bottom:0;
    }
    td {
      border:1px solid @table-border-color;
      vertical-align:middle;
      &:first-child {
        border-left:none;
      }
      &:last-child {
        border-left:none;
      }
    }
    th {
      height: 0;
      line-height: 0;
      padding: 0 25px;
      color: transparent;
      border: none;
      white-space: nowrap;
      span {
        max-height:0;
        height:0;
        line-height:0;
        margin:0;
        padding:0;
      }
      div{
        position: absolute;
        background: transparent;
        padding:@table-cell-padding;
        color: @text-color;
        top: 0;
        margin-left: -25px;
        line-height: @line-height-base;
        vertical-align: bottom;
        border-left:1px solid @table-border-color;
      }
      &:first-child div{
        border: none;
      }
    }
    tbody tr {
      &:first-child {
        td {
          border-top:none;
        }
      }
      &:last-child {
        td {
          border-bottom:none;
        }
      }
    }
  }
}
colgroup {
  > col {
    .action-column {
      width:70px;
    }
  }
}

.table > tbody > tr {
  > td {
	&.actions-cell {
	  text-align:right;
	  white-space: nowrap;
	  @media(max-width:@screen-xs-max) {
		text-align:center;
	  }
	}
  }
}

// OC Responsive Tables
// commandeered from http://codepen.io/pixelchar/pen/rfuqK
.oc-table-responsive {
  &.table-bordered {
    border:none;
    & > tbody > tr{
      & > th {
        border:none;
      }
      & > td {
        border-width:1px 0 0 0;
      }
    }
  }

  > thead,
  > tbody,
  > tfoot {
    > tr {
      > th,
      > td {
        vertical-align: middle;
      }
    }
  }

  thead {
    // Accessibly hide <thead> on narrow viewports
    position: absolute;
    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
    clip: rect(1px, 1px, 1px, 1px);
    padding: 0;
    border: 0;
    height: 1px;
    width: 1px;
    overflow: hidden;
  }

  // Set these items to display: block for narrow viewports
  tbody,
  tr,
  th,
  td {
    display: block;
    white-space: normal;
  }

  tr {
    &:extend(.panel); //Mobile table row looks like a bootstrap panel
    border-color: @panel-default-border;
    overflow:hidden;
  }

  tbody {
    & > tr > th {
      border-top: none;
      background-color: @panel-default-heading-bg;
    }
    td {
      &[data-title] {
        .clearfix(); //Clearfix solution for empty table cells on mobile
        &:before {
          content: attr(data-title);
          float: left;
          color: @gray-light;
        }
      }
      @media(max-width:@screen-sm-min) {
        text-align:right;
      }
    }
  }

  @media(min-width:@screen-sm-min) {
    &.table-bordered {
      border:1px solid @table-border-color;
      & > tbody > tr{
        & > th {
          border:1px solid @table-border-color;
        }
        & > td {
          border-width:1px;
        }
      }
    }
    thead {
      position: relative;
      clip: auto;
      height: auto;
      width: auto;
      overflow: auto;
    }
    tr {
      display: table-row;
      margin-bottom: 0;
      border: none;
    }
    th,
    td {
      // Undo display: block
      display: table-cell;
    }
    tbody {
      display:table-row-group;
      tr {
        display:table-row;
      }
      & > tr > th {
        border-top: 1px solid @table-border-color;
        background-color: transparent;
      }
      td {
        &[data-title]:before {
          content: none;
        }
      }
    }

  }
}


公式编辑器 固定值滚动条

公式编辑器 固定值滚动条

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/yyssc/ssc30-admin.git/'


SW-9355 Added: Styling for the finish page

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/simkli/shopware.git/'


Style focus & pressed state for dev buttons

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/jerone/flex-toolbar.git/'