Fixed style

Fixed style

@import "reset.css";
@import 'mixins';

@sprite : url(/img/pages/promotions/apps/sprite.png);
@sprite-bgsize : 300px 200px;
@global-font: Helvetica, Arial, serif;
@bg-color: #f5f7f7;
@global-text-color: #2c373c;
@link-color: #3457c0;
@link-hover-color: #ed002d;

@font-face {
  font-family: 'museo_sans_cyrl';
  src: url('/fonts/museosanscyrl_500-webfont.eot');
  src: url('/fonts/museosanscyrl_500-webfont.eot?#iefix') format('embedded-opentype'),
  url('/fonts/museosanscyrl_500-webfont.woff') format('woff'),
  url('/fonts/museosanscyrl_500-webfont.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;

}

@font-face {
  font-family: 'museo_sans_cyrl';
  src: url('/fonts/museosanscyrl_500-webfont.eot');
  src: url('/fonts/museosanscyrl_500-webfont.eot?#iefix') format('embedded-opentype'),
  url('/fonts/museosanscyrl_500-webfont.woff') format('woff'),
  url('/fonts/museosanscyrl_500-webfont.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;

}

body {
  min-height: 100%;
  line-height: 1.4;
  font-size: 1em;
  color: @global-text-color;
  font-family: @global-font;
  background-color: @bg-color;
}

::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

img {
  vertical-align: middle;
}

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

textarea {
  resize: vertical;
}

.clearfix, .wrap, .line {
  &:before, &:after {
    content: "";
    display: table;
  }
  &:after {
    clear: both;
  }
}

h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  font-family: 'museo_sans_cyrl', @global-font;
  font-weight: normal;
  line-height: 1.1em;
}

h4, h5, h6 {
  font-family: @global-font;
}

h1 {
  font-size: 3.4rem;
  font-weight: normal;
  text-align: center;
  line-height: 1.02em;
}

h2 {
  font-size: 2.571rem;
  font-weight: normal;
}

h3 {
  font-size: 1.5rem;
  font-weight: normal;
}

h4 {
  font-size: 1rem;
  font-weight: bold;
}

h5 {
  font-size: 1rem;
  font-weight: bold;
}

h6 {
  font-size: 1rem;
  font-weight: normal;
  text-transform: uppercase;
}

p {
  font-size: 1.5rem;
  line-height: 1.429em;
}

@media screen and (max-width: 1330px) {
  h1 {
    font-size: 2.571rem;
  }

  h2 {
    font-size: 2rem;
  }

  p {
    font-size: 1.143rem;
    line-height: 1.5em;
  }

  h3 {
    font-size: 1.214rem;
  }

  h4 {
    font-size: 1.143rem;
  }
}

@media screen and (max-width: 1023px) {
  h1 {
    font-size: 2rem;
  }

  h2 {
    font-size: 1.714rem;
  }

  p {
    font-size: 1rem;
    line-height: 1.643em;
  }
}

ul {
  padding: 0;
  margin: 0;
}

li {
  list-style: none;
}

a {
  color: @link-color;
  &:hover {
    color: @link-hover-color;
    border-color: @link-hover-color;
  }
}

.float-left {
  float: left !important;
}

.float-right {
  float: right !important;
}

.address-list {
  li {
    margin-bottom: 13px;

    & > span:first-child {
      display: block;
      color: #919699;
      font-size: 0.857rem;
    }
  }
  .tel {
    text-decoration: none;
  }
}

.icon {
  display: inline-block;
  background: @sprite no-repeat;
  -webkit-background-size: @sprite-bgsize;
  background-size: @sprite-bgsize;
}

.icon-share {
  .sq(16px);
  background-position: -90px -160px;
}

.icon-facebook {
  .sq(24px);
  background-position: 0px -160px;
}

.icon-twitter {
  .sq(24px);
  background-position: -30px -160px;
}

.icon-github {
  .sq(24px);
  background-position: -60px -160px;
}

.icon-quote {
  .box(19px, 14px);
  background-position: -110px -160px;
}

.icon-android {
  .box(36px, 44px);
  background-position: 0 -70px;
}

.icon-apple {
  .box(35px, 42px);
  background-position: -40px -70px;
}

#scroll-down {
  display: block;
  cursor: pointer;
  .box(28px, 15px);
  position: absolute;
  left: 50%;
  margin-left: -14px;
  bottom: 67px;
  background-position: -80px -70px;

  &:before {
    display: block;
    content: "";
    position: absolute;
    top: -10px;
    right: -10px;
    bottom: -10px;
    left: -10px;
  }
  &:hover {
    background-position: -80px -90px;
  }
  &:active {
    bottom: 60px;

    &:before {
      top: -17px;
    }
  }
}

@media screen and (max-width: 660px) {
  #scroll-down {
    display: none;
  }
}

.hidden {
  display: none !important;
  visibility: hidden;
}

.wrap {
  width: 960px;
  margin: 0 auto;
  position: relative;
  min-width: 280px;
}

@media screen and (max-width: 1020px) {
  .wrap {
    width: auto;
    padding-left: 30px;
    padding-right: 30px;
  }
}

@media screen and (max-width: 640px) {
  .wrap {
    padding-left: 20px;
    padding-right: 20px;
  }
}

.blue-line {
  color: #ffffff;
  background: #7eb5e0; /* Old browsers */
  background: -moz-linear-gradient(-45deg, #7eb5e0 0%, #6576cd 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, #7eb5e0), color-stop(100%, #6576cd)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(-45deg, #7eb5e0 0%, #6576cd 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(-45deg, #7eb5e0 0%, #6576cd 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(-45deg, #7eb5e0 0%, #6576cd 100%); /* IE10+ */
  background: linear-gradient(135deg, #7eb5e0 0%, #6576cd 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7eb5e0', endColorstr='#6576cd', GradientType=1); /* IE6-9 fallback on horizontal gradient */

  h1 {
    color: #ffffff;
    text-align: center;
    margin: 0 0 71px;
  }
  .wrap {
    padding-top: 60px;
    padding-bottom: 72px;
  }
  form {
    width: 630px;
    margin: 0 auto;
  }
}

@media screen and (max-width: 690px) {
  .blue-line {
    h1 {
      margin-bottom: 36px;
    }
    .wrap{
      padding-top: 30px;
      padding-bottom: 36px;
    }
    form {
      margin: 0;
      width: 100%;
    }
  }
}

.slide {
  display: table;
  position: relative;
  width: 100%;
  overflow: hidden;
  -webkit-background-size: auto 100%;
  background-size: auto 100%;
  background-position: center center;
  background-repeat: no-repeat;

  &.header-slide {
    height: 100%;
    background-image: url("/img/pages/promotions/apps/slides/header-slide.jpg");
    background-color: #252e33;
    background-size: cover;

    color: #ffffff;

    .inner {
      font-size: 0em;
    }
    .inner-content {
      text-align: center;
      font-size: 1em;
      padding: 140px 30px;
    }
    p {
      line-height: 1.329em;
    }
    .platforms {
      font-size: 0;
      margin: 41px 0 48px;

      .icon {
        margin: 0 12px 0 11px;
      }
    }
    h1 {
      font-size: 3.85rem;
      line-height: 1.08em;
      margin: 0 0 32px;
    }
  }
  .inner {
    display: table-cell;
    position: relative;
    height: 100%;
    width: 100%;
    text-align: center;
    z-index: 2;
    vertical-align: middle;
    white-space: nowrap;

    &:before {
      content: "";
      display: inline-block;
      height: 100%;
      width: 0;
      vertical-align: middle;
    }
  }
  .inner-content {
    font-size: 1em;
    display: inline-block;
    max-width: 680px;
    padding: 30px;
    white-space: normal;
    vertical-align: middle;
    text-align: left;
  }
}

.testimonials {
  background-image: url("/img/pages/promotions/apps/slides/slide_testimonials.jpg");
  background-color: #293338;
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: auto 100%;
  background-size: auto 100%;
  // height: 513px;
  color: #ffffff;

  .wrap {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}

@media screen and (max-width: 1023px) {
  .slide.header-slide {
    h1 {
      font-size: 3rem;
    }
  }
}

@media screen and (max-width: 855px) {
  .slide.header-slide {
    h1 {
      font-size: 2.5rem;
    }
  }
}

@media screen and (max-width: 660px) {
  .slide.header-slide {
    h1 {
      font-size: 2rem;
    }
    .inner-content {
      padding: 70px 30px 50px;
    }
  }
}

@media screen and (max-height: 500px) {
  .slide.header-slide {
    height: auto;
  }
}

/*
app slides
*/
.app-slide {
  color: #ffffff;
  -webkit-background-size: auto 100%;
  background-size: auto 100%;
  overflow: hidden;

  .wrap {
    min-height: 680px;
    padding-top: 0;
    padding-bottom: 0;
  }
  .app-inf {
    position: absolute;
  }
  h1 {
    font-size: 2rem;
    line-height: 1.2em;
    margin: 0 0 26px;
    text-align: inherit;
  }
  p {
    font-size: 1.215rem;
    line-height: 1.4em;
  }
  .app-img {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;

    a {
      display: block;
    }
    img {
      display: block;
      margin: 0 auto;
    }
  }
}

.mfb {
  background-image: url("/img/pages/promotions/apps/slides/slide_mfb.jpg");
  background-color: #1c311d;

  .app-inf {
    width: 234px;
    top: 162px;
    right: 0;
  }
}

.cookorama {
  background-image: url("/img/pages/promotions/apps/slides/slide_cookorama.jpg");
  background-color: #6d5e50;

  .app-inf {
    top: 44px;
    left: 170px;
    right: 170px;
    text-align: center;
  }
}

.keepsnap {
  background-image: url("/img/pages/promotions/apps/slides/slide_keepsnap.jpg");
  background-color: #5a6873;

  .app-inf {
    width: 234px;
    top: 162px;
    right: 0;
  }
}

.megasos {
  background-image: url("/img/pages/promotions/apps/slides/slide_megasos.jpg");
  background-color: #1e252a;

  .app-inf {
    top: 44px;
    left: 170px;
    right: 170px;
    text-align: center;
  }
}

.nizam {
  background-image: url("/img/pages/promotions/apps/slides/slide_nizam.jpg");
  background-color: #546480;

  .app-inf {
    top: 44px;
    left: 165px;
    right: 165px;
    text-align: center;
  }
  .app-img {
    bottom: 45px;
  }
}

.galaxyrecon {
  background-image: url("/img/pages/promotions/apps/slides/slide_galaxyrecon.jpg");
  background-color: #3b3638;

  .app-inf {
    top: 44px;
    left: 170px;
    right: 170px;
    text-align: center;
  }
  .app-img {
    bottom: 45px;
  }
}

@media screen and (min-width: 1441px) {
  .slide,
  .app-slide,
  .testimonials {
    -webkit-background-size: 100% auto;
    background-size: cover;
  }
}

@media screen and (max-width: 1020px) {

  .app-slide .wrap {
    min-height: 0;
  }

  .mfb,
  .keepsnap{
    .app-inf {
      position: static;
      margin: 44px auto 30px;
      text-align: center;
      width: 500px;
    }
    .app-img {
      position: static;
    }
  }
  .cookorama {
    .app-img {
      left: auto;
      right: 30px;
      img {
        float: right;
      }
    }
    .app-inf {
      position: static;
      margin: 44px auto 30px;
      text-align: center;
      width: 600px;
    }
  }
  .cookorama,
  .megasos,
  .nizam,
  .galaxyrecon {
    .app-inf {
      position: static;
      margin: 44px auto 41px;
      text-align: center;
      width: 600px;
    }
    .app-img {
      position: static;
    }
  }
  .keepsnap,
  .megasos {
    .wrap {
      min-height: 580px;
    }
  }
  .nizam,
  .galaxyrecon {
    .app-img {
      float: right;
      margin-right: -124px;
      margin-bottom: 45px;
    }
  }
}
/*
@media screen and (max-width: 765px) {
  .nizam,
  .galaxyrecon {
    .app-img {
      left: auto;
      right: -95px;
    }
  }
}*/

@media screen and (max-width: 660px) {
  .mfb,
  .keepsnap,
  .cookorama,
  .megasos,
  .nizam,
  .galaxyrecon {
    .app-inf {
      width:auto;
    }
  }
}

@media screen and (max-width: 603px) {
  .megasos {
    .app-img {
      float: right;
    }
  }
}

@media screen and (max-width: 467px) {
  .keepsnap {
    .app-img {
      img {
        width: 100%;
        height: auto;
      }
    }
  }
}

@media screen and (max-width: 462px) {
  .mfb {
    .app-img {
      img {
        width: 100%;
        height: auto;
      }
    }
  }
}

/*
header
*/
.logo {
  position: absolute;
  background: @sprite no-repeat;
  -webkit-background-size: @sprite-bgsize;
  background-size: @sprite-bgsize;
  top: 71px;
  left: 50%;
  .box(177px, 35px);
  margin-left: -88px;
  background-position: 0 -120px;
}

@media screen and (max-width: 660px) {
  .logo {
    top: 20px;
  }
}

/*
our-advantages
*/
.our-advantages-wr {
  padding: 60px 0 60px;
}

.our-advantages {
  position: relative;
  padding: 53px 0 32px;
  margin: 68px 0 0;

  &:before {
    display: block;
    content: "";
    background: url("/img/pages/promotions/apps/falcon-img.png") center center no-repeat;
    .box(314px, 300px);
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -157px;
  }
  .column {
    width: 300px;
  }
  .advantage-item {
    margin: 0 0 37px;
    height: 100px;
    padding: 0 0 0 85px;
    position: relative;

    &:before {
      display: block;
      content: "";
      background: @sprite no-repeat;
      -webkit-background-size: @sprite-bgsize;
      background-size: @sprite-bgsize;
      .sq(64px);
      position: absolute;
      top: 50%;
      left: 0;
      margin-top: -32px;
    }
    &:hover:before {
      background-position: -70px 0;
    }
    &:last-child {
      margin-bottom: 0;
    }
    p {
      font-size: 1.1rem;
      line-height: 1.3em;
    }
  }
  .inf-pad {
    display: table;
    width: 100%;
    height: 100px;

    .wr {
      display: table-cell;
      vertical-align: middle;
    }
  }
}

@media screen and (max-width: 1023px) {
  .our-advantages {
    margin: 0 0 0;

    &:before {
      -webkit-background-size: cover;
      background-size: 100% auto;
      width: 20%;
      height: 100%;
      left: 50%;
      margin-left: -10%;
    }
  }
}

@media screen and (max-width: 855px) {
  .our-advantages-wr {
    padding: 40px 0 40px;
  }
  .our-advantages {
    padding: 26px 0 0;

    &:before {
      display: none;
    }
    .column {
      width: 50%;
      .box-sizing(border-box);
      padding: 0 15px;
      margin: 0 -15px;
    }
    .advantage-item ,
    .advantage-item:last-child{
      margin: 0 0 10px;
    }
  }
}

@media screen and (max-width: 660px) {

  .our-advantages-wr {
    padding: 30px 0 30px;
  }
  .our-advantages {
    padding: 16px 0 0;

    .column {
      padding: 0;
      margin: 0;
      width: 100%;
    }
  }
}

/*
buttons
*/

.btn {
  display: inline-block;
  cursor: pointer;
  text-decoration: none;
  .box-sizing(border-box);
  background: #6a84d1;
  border: none;
  border-radius: 4px;
  padding: 0 47px;
  height: 51px;
  font-size: 15px;
  text-transform: uppercase;
  color: #ffffff;
  text-decoration: none;

  &:hover {
    background: #5273d7;
    color: #ffffff;
  }
  &:active {
    background: #ed002d;
  }
  &.btn-black {
    background: #2c373c;

    &:hover {
      background: #202629;
    }
    &:active {
      background: #ed002d;
    }
  }
}

a.btn,
div.btn {
  padding-top: 15px;
}

@media screen and (max-width: 690px) {
  .btn {
    width: 100%;
    padding: 0 15px;
  }
}

/*
form elements
*/

input[type=text],
input[type=password],
input[type=email],
textarea {
  display: block;
  .box-sizing(border-box);
  width: 100%;
  border: none;
  border-radius: 4px;
  background: #fff;
  .box-shadow(0 1px 1px rgba(0, 0, 0, 0.35));
  font-size: 18px;
  color: #2c373c;
  font-family: @global-font;
  line-height: 26px;
  padding: 13px 17px 12px;

  &:focus {
    background: #f5f7f7;
  }
}

input[type=text],
input[type=password],
input[type=email],
{
  height: 51px;
}

textarea {
  height: 138px;
}

form {
  position: relative;

  .line {
    margin: 0 0 30px;
    position: relative;

    &:last-child {
      margin-bottom: 0;
    }
  }
  .col2 {
    width: 300px;
    position: relative;
  }
}

.form-success {
  display: none;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;

  .wr {
    display: table;
    width: 100%;
    height: 100%;
  }
  .inner-pad {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
  }
  h3 {
    font-size: 3rem;
    margin: 0 0 64px;
  }
  p {
    line-height: 1.329em;
  }
}

/*placeholder css*/
form :-moz-placeholder {
  /*Firefox 4-18*/
  color: #919699;
  opacity: 1 !important;
}

form ::-moz-placeholder {
  /*Firefox 19+ */
  color: #919699;
  opacity: 1 !important;
}

form ::-webkit-input-placeholder {
  /*webkit*/
  color: #919699;
  opacity: 1 !important;
  line-height: 26px;
}

form :-ms-input-placeholder {
  /*ie10*/
  color: #919699;
  opacity: 1 !important;
}

.error-wr {
  position: relative;
}

textarea.error,
input.error {
  border: 3px solid #fcd9e0;
}

textarea.error,
input.error {
  padding: 10px 14px 9px;
}

.error-pad {
  display: block;
  position: relative;
  z-index: 11;
  /*left: 6px;
  bottom: 10px;*/
  color: #ffffff;
  margin: -10px 0 0 6px;

  .error {
    display: inline-block !important;
    border-radius: 3px;
    background: #ed002d;
    .box-shadow(0 2px 3px rgba(0, 0, 0, 0.35));
    padding: 9px 11px;
    //white-space: nowrap;

    &:before {
      display: block;
      content: "";
      position: absolute;
      top: -12px;
      left: 12px;
      border-style: solid;
      border-width: 6px 6px 6px 5px;
      border-color: transparent transparent #ed002d transparent;
    }
  }
}

@media screen and (max-width: 690px) {
  form {
    .line {
      margin: 0 0 15px;
    }
    .col2 {
      width: 100%;
      margin: 0 0 15px;
    }
    .col2 + .col2 {
      margin: 0;
    }
    .btn {
      width: 100%;
    }
  }
}

/*
  slider
*/

.testimonials {
  h3 {
    font-size: 3rem;
    margin: 0 0 55px;
    text-align: center;
  }
  .icon-quote {
    display: block;
    margin: 0 auto 19px;
  }
}

#slider {
  //height: 393px;
  width: 100%;

  .frame .slidee {
    margin: 0;
    padding: 0;
    height: 100%;
    list-style: none;
  }
  li {
    float: left;
    text-align: center;
    width: 660px;
    padding: 0 150px;
    height: 100%;
    opacity:0;
    -webkit-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    -ms-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;

    &.active {
      opacity:1;
      -webkit-transition: all 0.6s ease-in-out;
      -moz-transition: all 0.6s ease-in-out;
      -ms-transition: all 0.6s ease-in-out;
      -o-transition: all 0.6s ease-in-out;
      transition: all 0.6s ease-in-out;
    }
  }
  p {
    font-size: 1.2rem;
    line-height: 1.55em;
  }
  .review-author {
    position: relative;
    margin: 54px 0 0;

    &:before {
      display: block;
      content: "";
      position: absolute;
      top: -21px;
      width: 91px;
      border-top: 1px solid #ffffff;
      left: 50%;
      margin-left: -45px;
    }
    p {
      font-size: 0.9rem;
      line-height: 1.55em;
      /*      opacity: 0.4;*/
      color: #9e9e9e;
    }
    .name {
      font-size: 1.1rem;
      line-height: 1.25em;
      /*      opacity: 1;*/
      color: #ffffff;
    }
  }
  .inf-pad {
    display: table;
    width: 100%;

    .wr {
      display: table-cell;
      vertical-align: middle;
    }
  }
}

#slider-prev,
#slider-next {
  display: block;
  .box(32px, 62px);
  position: absolute;
  z-index: 12;
  top: 50%;
  margin-top: -31px;
  background: @sprite no-repeat;
  -webkit-background-size: @sprite-bgsize;
  background-size: @sprite-bgsize;

  &.disabled {
    display: none !important;
  }
}

#slider-prev {
  background-position: -180px 0;
  left: -136px;

  &:hover {
    background-position: -180px -70px;
  }
  &:active {
    left: -144px;
  }
}

#slider-next {
  background-position: -220px 0;
  right: -136px;

  &:hover {
    background-position: -220px -70px;
  }
  &:active {
    right: -144px;
  }
}

@media screen and (max-width: 1240px) {

  #slider-prev ,
  #slider-next {
    display: none;
  }

}

@media screen and (max-width: 1023px) {

  .testimonials .wrap {
    padding-top: 40px;
    padding-bottom: 40px;

    h3 {
      font-size: 2.5rem;
      margin: 0 0 35px;
    }
  }

  #slider {
    height: 370px;

    li {
      padding: 0 100px;
    }
    p {
      font-size: 1rem;
    }
    .inf-pad {
      height: 370px;
    }
  }

}

@media screen and (max-width: 855px) {

  .testimonials .wrap {
    padding-top: 30px;
    padding-bottom: 30px;

    h3 {
      font-size: 2rem;
    }
  }

  #slider {
    height: 320px;

    li {
      width: 560px;
      padding: 0px;
    }
    p {
      font-size: 1rem;
    }
    .inf-pad {
      height: 320px;
    }
  }
}

@media screen and (max-width: 660px) {

  .testimonials .wrap {
    h3 {
      font-size: 1.5rem;
    }
  }

  #slider {
    li {
      width: 500px;
      padding: 0;
    }
    p {
      font-size: 1rem;
    }
  }
}

@media screen and (max-width: 580px) {
  #slider {
    li {
      width: 400px;
    }
  }
}

@media screen and (max-width: 480px) {
  #slider {
    height: 370px;

    li {
      width: 380px;
    }
    .inf-pad {
      height: 370px;
    }
  }
}

@media screen and (max-width: 400px) {
  #slider {
    //    height: 370px;

    li {
      width: 340px;
    }
    .inf-pad {
      //    height: 450px;
    }
  }
}

@media screen and (max-width: 370px) {
  #slider {
    li {
      width: 280px;
    }
  }
}

/* footer */

footer {
  border-top: solid 4px #2c373c;
  padding: 41px 0 50px;
  overflow: hidden;

  a {
    color: @global-text-color;
  }
  time {
    border: none;
    color: #919699;
    font-size: 0.857rem;
  }
  h3 {
    margin: 0 0 28px;
    font-size: 1.214rem;
    line-height: 1.3em;
  }
}

.contacts {
  width: 30.2727%;
  float: left;
  margin-right: 4.6511%;
}

.socials {
  overflow: hidden;
  margin: 4px 0 39px;

  li {
    float: left;
    margin-right: 12px;
  }
  a {
    display: block;
  }
}

.blog-posts {
  width: 30.2727%;
  float: left;
  margin-right: 4.6511%;

  time {
    display: block;
  }
  li {
    margin-bottom: 24px;
  }
  .icon-share {
    margin-left: 6px;
    vertical-align: -3px;
  }
  h4 {
    margin: 0;
    font-weight: normal;
    line-height: 1.3em;
  }
}

@media screen and (max-width: 1023px) {
  .blog-posts {
    h4 {
      font-size: 1rem;
    }
  }
}

@media screen and (max-width: 715px) {
  footer {
    padding-bottom: 50px;
    .contacts {
      width: 47.61%;
      margin-right: 0;
    }
    .link-cnt {
      clear: both;
    }
    .copyright {
      float: left;
      margin-top: 7px;
    }
  }

  .socials {
    float: left;
    margin-right: 10px;
    margin-bottom: 10px;

    li {
      margin-right: 20px;
    }
  }

  .blog-posts {
    width: 47.61%;
    margin-right: 3.7425%;
  }
}

@media screen and (max-width: 410px) {
  footer {
    padding: 15px 0 23px;
    text-align: center;

    .copyright {
      float: none;
      font-size: 0.875rem;
    }
    .contacts {
      width: 100%;
      float: none;

      h3 {
        margin-bottom: 10px;
      }
    }
  }

  .socials {
    float: none;
    margin-bottom: 12px;
    width: auto;

    li {
      display: inline-block;
      float: none;

      &:last-child {
        margin-right: 0;
      }
    }
  }

  .blog-posts {
    display: none;
  }
}

iframe[name="google_conversion_frame"] {
  display: none;
}

/* footer */

/*

@media screen and (max-width: 1240px) {960}
@media screen and (max-width: 1023px) {960}
@media screen and (max-width: 960px) {800}
@media screen and (max-width: 800px) {720}
@media screen and (max-width: 640px) {600}
@media screen and (max-width: 480px) {320}

*/

@import "reset.css";
@import 'mixins';

@sprite : url(/img/pages/promotions/apps/sprite.png);
@sprite-bgsize : 300px 200px;
@global-font: Helvetica, Arial, serif;
@bg-color: #f5f7f7;
@global-text-color: #2c373c;
@link-color: #3457c0;
@link-hover-color: #ed002d;

@font-face {
  font-family: 'museo_sans_cyrl';
  src: url('/fonts/museosanscyrl_500-webfont.eot');
  src: url('/fonts/museosanscyrl_500-webfont.eot?#iefix') format('embedded-opentype'),
  url('/fonts/museosanscyrl_500-webfont.woff') format('woff'),
  url('/fonts/museosanscyrl_500-webfont.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;

}

@font-face {
  font-family: 'museo_sans_cyrl';
  src: url('/fonts/museosanscyrl_500-webfont.eot');
  src: url('/fonts/museosanscyrl_500-webfont.eot?#iefix') format('embedded-opentype'),
  url('/fonts/museosanscyrl_500-webfont.woff') format('woff'),
  url('/fonts/museosanscyrl_500-webfont.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;

}

body {
  min-height: 100%;
  line-height: 1.4;
  font-size: 1em;
  color: @global-text-color;
  font-family: @global-font;
  background-color: @bg-color;
}

::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

img {
  vertical-align: middle;
}

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

textarea {
  resize: vertical;
}

.clearfix, .wrap, .line {
  &:before, &:after {
    content: "";
    display: table;
  }
  &:after {
    clear: both;
  }
}

h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  font-family: 'museo_sans_cyrl', @global-font;
  font-weight: normal;
  line-height: 1.1em;
}

h4, h5, h6 {
  font-family: @global-font;
}

h1 {
  font-size: 3.4rem;
  font-weight: normal;
  text-align: center;
  line-height: 1.02em;
}

h2 {
  font-size: 2.571rem;
  font-weight: normal;
}

h3 {
  font-size: 1.5rem;
  font-weight: normal;
}

h4 {
  font-size: 1rem;
  font-weight: bold;
}

h5 {
  font-size: 1rem;
  font-weight: bold;
}

h6 {
  font-size: 1rem;
  font-weight: normal;
  text-transform: uppercase;
}

p {
  font-size: 1.5rem;
  line-height: 1.429em;
}

@media screen and (max-width: 1330px) {
  h1 {
    font-size: 2.571rem;
  }

  h2 {
    font-size: 2rem;
  }

  p {
    font-size: 1.143rem;
    line-height: 1.5em;
  }

  h3 {
    font-size: 1.214rem;
  }

  h4 {
    font-size: 1.143rem;
  }
}

@media screen and (max-width: 1023px) {
  h1 {
    font-size: 2rem;
  }

  h2 {
    font-size: 1.714rem;
  }

  p {
    font-size: 1rem;
    line-height: 1.643em;
  }
}

ul {
  padding: 0;
  margin: 0;
}

li {
  list-style: none;
}

a {
  color: @link-color;
  &:hover {
    color: @link-hover-color;
    border-color: @link-hover-color;
  }
}

.float-left {
  float: left !important;
}

.float-right {
  float: right !important;
}

.address-list {
  li {
    margin-bottom: 13px;

    & > span:first-child {
      display: block;
      color: #919699;
      font-size: 0.857rem;
    }
  }
  .tel {
    text-decoration: none;
  }
}

.icon {
  display: inline-block;
  background: @sprite no-repeat;
  -webkit-background-size: @sprite-bgsize;
  background-size: @sprite-bgsize;
}

.icon-share {
  .sq(16px);
  background-position: -90px -160px;
}

.icon-facebook {
  .sq(24px);
  background-position: 0px -160px;
}

.icon-twitter {
  .sq(24px);
  background-position: -30px -160px;
}

.icon-github {
  .sq(24px);
  background-position: -60px -160px;
}

.icon-quote {
  .box(19px, 14px);
  background-position: -110px -160px;
}

.icon-android {
  .box(36px, 44px);
  background-position: 0 -70px;
}

.icon-apple {
  .box(35px, 42px);
  background-position: -40px -70px;
}

#scroll-down {
  display: block;
  cursor: pointer;
  .box(28px, 15px);
  position: absolute;
  left: 50%;
  margin-left: -14px;
  bottom: 67px;
  background-position: -80px -70px;

  &:before {
    display: block;
    content: "";
    position: absolute;
    top: -10px;
    right: -10px;
    bottom: -10px;
    left: -10px;
  }
  &:hover {
    background-position: -80px -90px;
  }
  &:active {
    bottom: 60px;

    &:before {
      top: -17px;
    }
  }
}

@media screen and (max-width: 660px) {
  #scroll-down {
    display: none;
  }
}

.hidden {
  display: none !important;
  visibility: hidden;
}

.wrap {
  width: 960px;
  margin: 0 auto;
  position: relative;
  min-width: 280px;
}

@media screen and (max-width: 1020px) {
  .wrap {
    width: auto;
    padding-left: 30px;
    padding-right: 30px;
  }
}

@media screen and (max-width: 640px) {
  .wrap {
    padding-left: 20px;
    padding-right: 20px;
  }
}

.blue-line {
  color: #ffffff;
  background: #7eb5e0; /* Old browsers */
  background: -moz-linear-gradient(-45deg, #7eb5e0 0%, #6576cd 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, #7eb5e0), color-stop(100%, #6576cd)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(-45deg, #7eb5e0 0%, #6576cd 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(-45deg, #7eb5e0 0%, #6576cd 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(-45deg, #7eb5e0 0%, #6576cd 100%); /* IE10+ */
  background: linear-gradient(135deg, #7eb5e0 0%, #6576cd 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7eb5e0', endColorstr='#6576cd', GradientType=1); /* IE6-9 fallback on horizontal gradient */

  h1 {
    color: #ffffff;
    text-align: center;
    margin: 0 0 71px;
  }
  .wrap {
    padding-top: 60px;
    padding-bottom: 72px;
  }
  form {
    width: 630px;
    margin: 0 auto;
  }
}

@media screen and (max-width: 690px) {
  .blue-line {
    h1 {
      margin-bottom: 36px;
    }
    .wrap{
      padding-top: 30px;
      padding-bottom: 36px;
    }
    form {
      margin: 0;
      width: 100%;
    }
  }
}

.slide {
  display: table;
  position: relative;
  width: 100%;
  overflow: hidden;
  -webkit-background-size: auto 100%;
  background-size: auto 100%;
  background-position: center center;
  background-repeat: no-repeat;

  &.header-slide {
    height: 100%;
    background-image: url("/img/pages/promotions/apps/slides/header-slide.jpg");
    background-color: #252e33;
    background-size: cover;

    color: #ffffff;

    .inner {
      font-size: 0em;
    }
    .inner-content {
      text-align: center;
      font-size: 1em;
      padding: 140px 30px;
    }
    p {
      line-height: 1.329em;
    }
    .platforms {
      font-size: 0;
      margin: 41px 0 48px;

      .icon {
        margin: 0 12px 0 11px;
      }
    }
    h1 {
      font-size: 3.85rem;
      line-height: 1.08em;
      margin: 0 0 32px;
    }
  }
  .inner {
    display: table-cell;
    position: relative;
    height: 100%;
    width: 100%;
    text-align: center;
    z-index: 2;
    vertical-align: middle;
    white-space: nowrap;

    &:before {
      content: "";
      display: inline-block;
      height: 100%;
      width: 0;
      vertical-align: middle;
    }
  }
  .inner-content {
    font-size: 1em;
    display: inline-block;
    max-width: 680px;
    padding: 30px;
    white-space: normal;
    vertical-align: middle;
    text-align: left;
  }
}

.testimonials {
  background-image: url("/img/pages/promotions/apps/slides/slide_testimonials.jpg");
  background-color: #293338;
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: auto 100%;
  background-size: auto 100%;
  // height: 513px;
  color: #ffffff;

  .wrap {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}

@media screen and (max-width: 1023px) {
  .slide.header-slide {
    h1 {
      font-size: 3rem;
    }
  }
}

@media screen and (max-width: 855px) {
  .slide.header-slide {
    h1 {
      font-size: 2.5rem;
    }
  }
}

@media screen and (max-width: 660px) {
  .slide.header-slide {
    h1 {
      font-size: 2rem;
    }
    .inner-content {
      padding: 70px 30px 50px;
    }
  }
}

@media screen and (max-height: 500px) {
  .slide.header-slide {
    height: auto;
  }
}

/*
app slides
*/
.app-slide {
  color: #ffffff;
  -webkit-background-size: auto 100%;
  background-size: auto 100%;
  overflow: hidden;

  .wrap {
    min-height: 680px;
    padding-top: 0;
    padding-bottom: 0;
  }
  .app-inf {
    position: absolute;
  }
  h1 {
    font-size: 2rem;
    line-height: 1.2em;
    margin: 0 0 26px;
    text-align: inherit;
  }
  p {
    font-size: 1.215rem;
    line-height: 1.4em;
  }
  .app-img {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;

    a {
      display: block;
    }
    img {
      display: block;
      margin: 0 auto;
    }
  }
}

.mfb {
  background-image: url("/img/pages/promotions/apps/slides/slide_mfb.jpg");
  background-color: #1c311d;

  .app-inf {
    width: 234px;
    top: 162px;
    right: 0;
  }
}

.cookorama {
  background-image: url("/img/pages/promotions/apps/slides/slide_cookorama.jpg");
  background-color: #6d5e50;

  .app-inf {
    top: 44px;
    left: 170px;
    right: 170px;
    text-align: center;
  }
}

.keepsnap {
  background-image: url("/img/pages/promotions/apps/slides/slide_keepsnap.jpg");
  background-color: #5a6873;

  .app-inf {
    width: 234px;
    top: 162px;
    right: 0;
  }
}

.megasos {
  background-image: url("/img/pages/promotions/apps/slides/slide_megasos.jpg");
  background-color: #1e252a;

  .app-inf {
    top: 44px;
    left: 170px;
    right: 170px;
    text-align: center;
  }
}

.nizam {
  background-image: url("/img/pages/promotions/apps/slides/slide_nizam.jpg");
  background-color: #546480;

  .app-inf {
    top: 44px;
    left: 165px;
    right: 165px;
    text-align: center;
  }
  .app-img {
    bottom: 45px;
  }
}

.galaxyrecon {
  background-image: url("/img/pages/promotions/apps/slides/slide_galaxyrecon.jpg");
  background-color: #3b3638;

  .app-inf {
    top: 44px;
    left: 170px;
    right: 170px;
    text-align: center;
  }
  .app-img {
    bottom: 45px;
  }
}

@media screen and (min-width: 1441px) {
  .slide,
  .app-slide,
  .testimonials {
    -webkit-background-size: 100% auto;
    background-size: cover;
  }
}

@media screen and (max-width: 1020px) {

  .app-slide .wrap {
    min-height: 0;
  }

  .mfb,
  .keepsnap{
    .app-inf {
      position: static;
      margin: 44px auto 30px;
      text-align: center;
      width: 500px;
    }
    .app-img {
      position: static;
    }
  }
  .cookorama {
    .app-img {
      left: auto;
      right: 30px;
      img {
        float: right;
      }
    }
    .app-inf {
      position: static;
      margin: 44px auto 30px;
      text-align: center;
      width: 600px;
    }
  }
  .cookorama,
  .megasos,
  .nizam,
  .galaxyrecon {
    .app-inf {
      position: static;
      margin: 44px auto 41px;
      text-align: center;
      width: 600px;
    }
    .app-img {
      position: static;
    }
  }
  .keepsnap,
  .megasos {
    .wrap {
      min-height: 580px;
    }
  }
  .nizam,
  .galaxyrecon {
    .app-img {
      float: right;
      margin-right: -124px;
      margin-bottom: 45px;
    }
  }
}
/*
@media screen and (max-width: 765px) {
  .nizam,
  .galaxyrecon {
    .app-img {
      left: auto;
      right: -95px;
    }
  }
}*/

@media screen and (max-width: 660px) {
  .mfb,
  .keepsnap,
  .cookorama,
  .megasos,
  .nizam,
  .galaxyrecon {
    .app-inf {
      width:auto;
    }
  }
}

@media screen and (max-width: 603px) {
  .megasos {
    .app-img {
      float: right;
    }
  }
}

@media screen and (max-width: 467px) {
  .keepsnap {
    .app-img {
      img {
        width: 100%;
        height: auto;
      }
    }
  }
}

@media screen and (max-width: 462px) {
  .mfb {
    .app-img {
      img {
        width: 100%;
        height: auto;
      }
    }
  }
}

/*
header
*/
.logo {
  position: absolute;
  background: @sprite no-repeat;
  -webkit-background-size: @sprite-bgsize;
  background-size: @sprite-bgsize;
  top: 71px;
  left: 50%;
  .box(177px, 35px);
  margin-left: -88px;
  background-position: 0 -120px;
}

@media screen and (max-width: 660px) {
  .logo {
    top: 20px;
  }
}

/*
our-advantages
*/
.our-advantages-wr {
  padding: 60px 0 60px;
}

.our-advantages {
  position: relative;
  padding: 53px 0 32px;
  margin: 68px 0 0;

  &:before {
    display: block;
    content: "";
    background: url("/img/pages/promotions/apps/falcon-img.png") center center no-repeat;
    .box(314px, 300px);
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -157px;
  }
  .column {
    width: 300px;
  }
  .advantage-item {
    margin: 0 0 37px;
    height: 100px;
    padding: 0 0 0 85px;
    position: relative;

    &:before {
      display: block;
      content: "";
      background: @sprite no-repeat;
      -webkit-background-size: @sprite-bgsize;
      background-size: @sprite-bgsize;
      .sq(64px);
      position: absolute;
      top: 50%;
      left: 0;
      margin-top: -32px;
    }
    &:hover:before {
      background-position: -70px 0;
    }
    &:last-child {
      margin-bottom: 0;
    }
    p {
      font-size: 1.1rem;
      line-height: 1.3em;
    }
  }
  .inf-pad {
    display: table;
    width: 100%;
    height: 100px;

    .wr {
      display: table-cell;
      vertical-align: middle;
    }
  }
}

@media screen and (max-width: 1023px) {
  .our-advantages {
    margin: 0 0 0;

    &:before {
      -webkit-background-size: cover;
      background-size: 100% auto;
      width: 20%;
      height: 100%;
      left: 50%;
      margin-left: -10%;
    }
  }
}

@media screen and (max-width: 855px) {
  .our-advantages-wr {
    padding: 40px 0 40px;
  }
  .our-advantages {
    padding: 26px 0 0;

    &:before {
      display: none;
    }
    .column {
      width: 50%;
      .box-sizing(border-box);
      padding: 0 15px;
      margin: 0 -15px;
    }
    .advantage-item ,
    .advantage-item:last-child{
      margin: 0 0 10px;
    }
  }
}

@media screen and (max-width: 660px) {

  .our-advantages-wr {
    padding: 30px 0 30px;
  }
  .our-advantages {
    padding: 16px 0 0;

    .column {
      padding: 0;
      margin: 0;
      width: 100%;
    }
  }
}

/*
buttons
*/

.btn {
  display: inline-block;
  cursor: pointer;
  text-decoration: none;
  .box-sizing(border-box);
  background: #6a84d1;
  border: none;
  border-radius: 4px;
  padding: 0 47px;
  height: 51px;
  font-size: 15px;
  text-transform: uppercase;
  color: #ffffff;
  text-decoration: none;

  &:hover {
    background: #5273d7;
    color: #ffffff;
  }
  &:active {
    background: #ed002d;
  }
  &.btn-black {
    background: #2c373c;

    &:hover {
      background: #202629;
    }
    &:active {
      background: #ed002d;
    }
  }
}

a.btn,
div.btn {
  padding-top: 15px;
}

@media screen and (max-width: 690px) {
  .btn {
    width: 100%;
    padding: 0 15px;
  }
}

/*
form elements
*/

input[type=text],
input[type=password],
input[type=email],
textarea {
  display: block;
  .box-sizing(border-box);
  width: 100%;
  border: none;
  border-radius: 4px;
  background: #fff;
  .box-shadow(0 1px 1px rgba(0, 0, 0, 0.35));
  font-size: 18px;
  color: #2c373c;
  font-family: @global-font;
  line-height: 26px;
  padding: 13px 17px 12px;

  &:focus {
    background: #f5f7f7;
  }
}

input[type=text],
input[type=password],
input[type=email],
{
  height: 51px;
}

textarea {
  height: 138px;
}

form {
  position: relative;

  .line {
    margin: 0 0 30px;
    position: relative;

    &:last-child {
      margin-bottom: 0;
    }
  }
  .col2 {
    width: 300px;
    position: relative;
  }
}

.form-success {
  display: none;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;

  .wr {
    display: table;
    width: 100%;
    height: 100%;
  }
  .inner-pad {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
  }
  h3 {
    font-size: 3rem;
    margin: 0 0 64px;
  }
  p {
    line-height: 1.329em;
  }
}

/*placeholder css*/
form :-moz-placeholder {
  /*Firefox 4-18*/
  color: #919699;
  opacity: 1 !important;
}

form ::-moz-placeholder {
  /*Firefox 19+ */
  color: #919699;
  opacity: 1 !important;
}

form ::-webkit-input-placeholder {
  /*webkit*/
  color: #919699;
  opacity: 1 !important;
  line-height: 26px;
}

form :-ms-input-placeholder {
  /*ie10*/
  color: #919699;
  opacity: 1 !important;
}

.error-wr {
  position: relative;
}

textarea.error,
input.error {
  border: 3px solid #fcd9e0;
}

textarea.error,
input.error {
  padding: 10px 14px 9px;
}

.error-pad {
  display: block;
  position: relative;
  z-index: 11;
  /*left: 6px;
  bottom: 10px;*/
  color: #ffffff;
  margin: -10px 0 0 6px;

  .error {
    display: inline-block !important;
    border-radius: 3px;
    background: #ed002d;
    .box-shadow(0 2px 3px rgba(0, 0, 0, 0.35));
    padding: 9px 11px;
    //white-space: nowrap;

    &:before {
      display: block;
      content: "";
      position: absolute;
      top: -12px;
      left: 12px;
      border-style: solid;
      border-width: 6px 6px 6px 5px;
      border-color: transparent transparent #ed002d transparent;
    }
  }
}

@media screen and (max-width: 690px) {
  form {
    .line {
      margin: 0 0 15px;
    }
    .col2 {
      width: 100%;
      margin: 0 0 15px;
    }
    .col2 + .col2 {
      margin: 0;
    }
    .btn {
      width: 100%;
    }
  }
}

/*
  slider
*/

.testimonials {
  h3 {
    font-size: 3rem;
    margin: 0 0 55px;
    text-align: center;
  }
  .icon-quote {
    display: block;
    margin: 0 auto 19px;
  }
}

#slider {
  //height: 393px;
  width: 100%;

  .frame .slidee {
    margin: 0;
    padding: 0;
    height: 100%;
    list-style: none;
  }
  li {
    float: left;
    text-align: center;
    width: 660px;
    padding: 0 150px;
    height: 100%;
    opacity:0;
    -webkit-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    -ms-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;

    &.active {
      opacity:1;
      -webkit-transition: all 0.6s ease-in-out;
      -moz-transition: all 0.6s ease-in-out;
      -ms-transition: all 0.6s ease-in-out;
      -o-transition: all 0.6s ease-in-out;
      transition: all 0.6s ease-in-out;
    }
  }
  p {
    font-size: 1.2rem;
    line-height: 1.55em;
  }
  .review-author {
    position: relative;
    margin: 54px 0 0;

    &:before {
      display: block;
      content: "";
      position: absolute;
      top: -21px;
      width: 91px;
      border-top: 1px solid #ffffff;
      left: 50%;
      margin-left: -45px;
    }
    p {
      font-size: 0.9rem;
      line-height: 1.55em;
      /*      opacity: 0.4;*/
      color: #9e9e9e;
    }
    .name {
      font-size: 1.1rem;
      line-height: 1.25em;
      /*      opacity: 1;*/
      color: #ffffff;
    }
  }
  .inf-pad {
    display: table;
    width: 100%;

    .wr {
      display: table-cell;
      vertical-align: middle;
    }
  }
}

#slider-prev,
#slider-next {
  display: block;
  .box(32px, 62px);
  position: absolute;
  z-index: 12;
  top: 50%;
  margin-top: -31px;
  background: @sprite no-repeat;
  -webkit-background-size: @sprite-bgsize;
  background-size: @sprite-bgsize;

  &.disabled {
    display: none !important;
  }
}

#slider-prev {
  background-position: -180px 0;
  left: -136px;

  &:hover {
    background-position: -180px -70px;
  }
  &:active {
    left: -144px;
  }
}

#slider-next {
  background-position: -220px 0;
  right: -136px;

  &:hover {
    background-position: -220px -70px;
  }
  &:active {
    right: -144px;
  }
}

@media screen and (max-width: 1240px) {

  #slider-prev ,
  #slider-next {
    display: none;
  }

}

@media screen and (max-width: 1023px) {

  .testimonials .wrap {
    padding-top: 40px;
    padding-bottom: 40px;

    h3 {
      font-size: 2.5rem;
      margin: 0 0 35px;
    }
  }

  #slider {
    height: 370px;

    li {
      padding: 0 100px;
    }
    p {
      font-size: 1rem;
    }
    .inf-pad {
      height: 370px;
    }
  }

}

@media screen and (max-width: 855px) {

  .testimonials .wrap {
    padding-top: 30px;
    padding-bottom: 30px;

    h3 {
      font-size: 2rem;
    }
  }

  #slider {
    height: 320px;

    li {
      width: 560px;
      padding: 0px;
    }
    p {
      font-size: 1rem;
    }
    .inf-pad {
      height: 320px;
    }
  }
}

@media screen and (max-width: 660px) {

  .testimonials .wrap {
    h3 {
      font-size: 1.5rem;
    }
  }

  #slider {
    li {
      width: 500px;
      padding: 0;
    }
    p {
      font-size: 1rem;
    }
  }
}

@media screen and (max-width: 580px) {
  #slider {
    li {
      width: 400px;
    }
  }
}

@media screen and (max-width: 480px) {
  #slider {
    height: 370px;

    li {
      width: 380px;
    }
    .inf-pad {
      height: 370px;
    }
  }
}

@media screen and (max-width: 400px) {
  #slider {
    //    height: 370px;

    li {
      width: 340px;
    }
    .inf-pad {
      //    height: 450px;
    }
  }
}

@media screen and (max-width: 370px) {
  #slider {
    li {
      width: 280px;
    }
  }
}

/* footer */

footer {
  border-top: solid 4px #2c373c;
  padding: 41px 0 50px;
  overflow: hidden;

  a {
    color: @global-text-color;
  }
  time {
    border: none;
    color: #919699;
    font-size: 0.857rem;
  }
  h3 {
    margin: 0 0 28px;
    font-size: 1.214rem;
    line-height: 1.3em;
  }
}

.contacts {
  width: 30.2727%;
  float: left;
  margin-right: 4.6511%;
}

.socials {
  overflow: hidden;
  margin: 4px 0 39px;

  li {
    float: left;
    margin-right: 12px;
  }
  a {
    display: block;
  }
}

.blog-posts {
  width: 30.2727%;
  float: left;
  margin-right: 4.6511%;

  time {
    display: block;
  }
  li {
    margin-bottom: 24px;
  }
  .icon-share {
    margin-left: 6px;
    vertical-align: -3px;
  }
  h4 {
    margin: 0;
    font-weight: normal;
    line-height: 1.3em;
  }
}

@media screen and (max-width: 1023px) {
  .blog-posts {
    h4 {
      font-size: 1rem;
    }
  }
}

@media screen and (max-width: 715px) {
  footer {
    padding-bottom: 50px;
    .contacts {
      width: 47.61%;
      margin-right: 0;
    }
    .link-cnt {
      clear: both;
    }
    .copyright {
      float: left;
      margin-top: 7px;
    }
  }

  .socials {
    float: left;
    margin-right: 10px;
    margin-bottom: 10px;

    li {
      margin-right: 20px;
    }
  }

  .blog-posts {
    width: 47.61%;
    margin-right: 3.7425%;
  }
}

@media screen and (max-width: 410px) {
  footer {
    padding: 15px 0 23px;
    text-align: center;

    .copyright {
      float: none;
      font-size: 0.875rem;
    }
    .contacts {
      width: 100%;
      float: none;

      h3 {
        margin-bottom: 10px;
      }
    }
  }

  .socials {
    float: none;
    margin-bottom: 12px;
    width: auto;

    li {
      display: inline-block;
      float: none;

      &:last-child {
        margin-right: 0;
      }
    }
  }

  .blog-posts {
    display: none;
  }
}

/* footer */

/*

@media screen and (max-width: 1240px) {960}
@media screen and (max-width: 1023px) {960}
@media screen and (max-width: 960px) {800}
@media screen and (max-width: 800px) {720}
@media screen and (max-width: 640px) {600}
@media screen and (max-width: 480px) {320}

*/


add clockhand module

add clockhand module

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/Julienedies/est.git/'


Less repaints

Less repaints

/**
 *    Copyright 2015-2016 ppy Pty. Ltd.
 *
 *    This file is part of osu!web. osu!web is distributed with the hope of
 *    attracting more community contributions to the core ecosystem of osu!.
 *
 *    osu!web is free software: you can redistribute it and/or modify
 *    it under the terms of the Affero GNU General Public License version 3
 *    as published by the Free Software Foundation.
 *
 *    osu!web is distributed WITHOUT ANY WARRANTY; without even the implied
 *    warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
 *    See the GNU Affero General Public License for more details.
 *
 *    You should have received a copy of the GNU Affero General Public License
 *    along with osu!web.  If not, see <http://www.gnu.org/licenses/>.
 *
 */

.beatmapset-beatmap-picker {
  @padding: (@spacing / 2);
  @gutter: 2px;
  display: flex;
  flex-wrap: wrap;
  margin: 0 (-@padding + -@gutter) @spacing;

  &__beatmap {
    .own-layer();
    .link-plain();
    .fade-element(100ms);
    padding: (@padding + @gutter);
    opacity: 0.7;

    &:hover {
      opacity: 1;
    }

    &::before {
      .full-size();
      .default-border-radius();
      background-color: fade(@gray-0, 50%);
      width: calc(100% ~'-' @gutter);
      height: calc(100% ~'-' @gutter);
      top: (@gutter / 2);
      left: (@gutter / 2);
      opacity: 0;
    }

    &:hover::before {
      opacity: 1;
    }

    &--active {
      opacity: 1;

      &::before {
        opacity: 1;
        background-color: fade(@gray-0, 50%);
      }
    }
  }
}

/**
 *    Copyright 2015-2016 ppy Pty. Ltd.
 *
 *    This file is part of osu!web. osu!web is distributed with the hope of
 *    attracting more community contributions to the core ecosystem of osu!.
 *
 *    osu!web is free software: you can redistribute it and/or modify
 *    it under the terms of the Affero GNU General Public License version 3
 *    as published by the Free Software Foundation.
 *
 *    osu!web is distributed WITHOUT ANY WARRANTY; without even the implied
 *    warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
 *    See the GNU Affero General Public License for more details.
 *
 *    You should have received a copy of the GNU Affero General Public License
 *    along with osu!web.  If not, see <http://www.gnu.org/licenses/>.
 *
 */

.beatmapset-beatmap-picker {
  @padding: (@spacing / 2);
  @gutter: 2px;
  display: flex;
  flex-wrap: wrap;
  margin: 0 (-@padding + -@gutter) @spacing;

  &__beatmap {
    .fade-element(100ms);
    padding: (@padding + @gutter);
    opacity: 0.7;

    &:active,
    &:focus {
      text-decoration: none;
    }

    &:hover {
      opacity: 1;
      text-decoration: none;
    }

    &::before {
      .full-size();
      .default-border-radius();
      width: calc(100% ~'-' @gutter);
      height: calc(100% ~'-' @gutter);
      top: (@gutter / 2);
      left: (@gutter / 2);
    }

    &:hover::before {
      background-color: fade(@gray-0, 50%);
    }

    &--active {
      opacity: 1;

      &::before {
        background-color: fade(@gray-0, 50%);
      }
    }
  }
}


added file

added file

error: pathspec '_fe/less/components/button.less' did not match any file(s) known to git


Blocks pattern CSS tidy up

Blocks pattern CSS tidy up

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/putterschool/styleguide.git/'


update breakpoint function

update breakpoint function

// =============================================
// Mixin - Breakpoint
// =============================================

.bp(max, @value, @content) {
    @media only screen {
        @media (max-width: @value) {
            @content();
        }
    }
}

.bp(min, @value, @content) {
    @media only screen {
        @media (min-width: @value) {
            @content();
        }
    }
}

.bp(range, @minValue, @maxValue, @content) {
    @media only screen {
        @media (min-width: @minValue) {
            @media (min-width: @maxValue) {
                @content();
            }
        }
    }
}
//
// breakpoint mixin demo:
//
// 1. max-width query:
//.content {
//    .bp(max, 1200px, {
//        div { color:#888; }
//    });
//}
//
// output:
//@media only screen and (max-width: 1200px) {
//  .content div {
//    color: #888;
//  }
//}
//
// 2. min-width qurey:
//.content {
//    .bp(min, 1200px, {
//        div { background-color:#888; }
//    });
//}
//
// output:
//@media only screen and (min-width: 1200px) {
//  .content div {
//    background-color: #888;
//  }
//}
//
// 3. both query:
//.content {
//    .bp(range, 640px, 768px, {
//        div { color:#888; }
//    });
//}
//
// output:
//@media only screen and (min-width: 640px) and (min-width: 768px) {
//  .content div {
//    color: #888;
//  }
//}


use @border-radius-base

use @border-radius-base

@import "../mixins/index";

@table-prefix-cls: ~"@{css-prefix}table";
@table-head-background-color: #f7f7f7;

.@{table-prefix-cls} {
  font-size: @font-size-base;
  color: @text-color;
  border-radius: @border-radius-base @border-radius-base 0 0;
  overflow: hidden;
  position: relative;
  border-radius: @border-radius-base @border-radius-base 0 0;
  overflow: hidden;

  &-body {
    transition: opacity 0.3s ease;
  }

  table {
    width: 100%;
    border-collapse: separate;
    text-align: left;
  }

  th {
    background: @table-head-background-color;
    font-weight: bold;
    transition: background .3s ease;
    text-align: left;

    .anticon-filter {
      margin-left: 4px;
      .iconfont-size-under-12px(10px);
      cursor: pointer;
      color: #aaa;
      transition: all 0.3s ease;
      &:hover {
        color: #666;
      }
    }

    .@{table-prefix-cls}-filter-selected.anticon-filter {
      color: @primary-color;
    }
  }

  td {
    border-bottom: 1px solid @border-color-split;
  }

  tr {
    transition: all .3s ease;
    &.@{table-prefix-cls}-row-hover,
    &:hover {
      background: tint(@primary-color, 90%);
    }
  }

  thead tr:hover {
    background: none;
  }

  &-footer {
    padding: 16px 8px;
    margin: 0 3px;
    background: @table-head-background-color;
    position: relative;
    top: -1px;
    border-radius: 0 0 @border-radius-base @border-radius-base;
  }

  tr.@{table-prefix-cls}-row-selected {
    background: #fafafa;
  }

  th.@{table-prefix-cls}-column-sort {
    background: #eaeaea;
  }

  th,
  td {
    padding: 16px 8px;
    word-break: break-all;
  }

  th.@{table-prefix-cls}-selection-column,
  td.@{table-prefix-cls}-selection-column {
    text-align: center;
    width: 60px;
  }

  &-header {
    background: @table-head-background-color;
    overflow: hidden;
    border-radius: @border-radius-base @border-radius-base 0 0;
  }

  &-header table {
    border-radius: @border-radius-base @border-radius-base 0 0;
  }

  &-loading {
    position: relative;
    .@{table-prefix-cls}-body {
      background: #fff;
      opacity: 0.5;
    }
    .@{table-prefix-cls}-spin-holder {
      height: 20px;
      line-height: 20px;
      left: 50%;
      top: 50%;
      margin-left: -30px;
      position: absolute;
    }
    .@{table-prefix-cls}-with-pagination {
      margin-top: -20px;
    }
    .@{table-prefix-cls}-without-pagination {
      margin-top: 10px;
    }
  }

  &-middle {
    th,
    td {
      padding: 10px 8px;
    }
  }

  &-small {
    table {
      border: 1px solid @border-color-split;
      padding: 0 8px;
      border-radius: @border-radius-base;
    }

    th {
      padding: 10px 8px;
      background: #fff;
      border-bottom: 1px solid @border-color-split;
    }

    td {
      padding: 6px 8px;
    }
    .ant-table-row:last-child td {
      border-bottom: 0;
    }
  }

  &-column-sorter {
    margin-left: 4px;
    display: inline-block;
    width: 12px;
    height: 14px;
    vertical-align: middle;
    text-align: center;
    &-up,
    &-down {
      line-height: 4px;
      height: 6px;
      display: block;
      width: 12px;
      cursor: pointer;
      &:hover .anticon {
        color: #666;
      }
      &.on {
        .anticon-caret-up,
        .anticon-caret-down {
          color: @primary-color;
        }
      }
    }
    .anticon-caret-up,
    .anticon-caret-down {
      .iconfont-size-under-12px(6px);
      line-height: 6px;
      height: 6px;
      color: #aaa;
      &:before {
        -moz-transform-origin: 53% 50%; /* fix firefox position */
      }
    }
  }

  &.@{table-prefix-cls}-bordered {
    table {
      border: 1px solid @border-color-split;
    }

    th {
      border-bottom: 1px solid @border-color-split;
    }

    tbody tr:last-child {
      th,
      td {
        border-bottom: 0;
      }
    }

    th,
    td {
      border-right: 1px solid @border-color-split;
      &:last-child {
        border-right: 0;
      }
    }
  }

  &-empty {
    position: relative;
    margin-bottom: 16px;
  }

  &-empty &-body {
    height: 150px;
  }

  &-placeholder {
    height: 100px;
    line-height: 100px;
    text-align: center;
    font-size: 12px;
    color: #999;
    border-bottom: 1px solid @border-color-split;
    position: absolute;
    top: 50px;
    left: 0;
    width: 100%;
    .anticon {
      margin-right: 4px;
    }
  }

  &-pagination {
    margin: 16px 0;
    float: right;
  }

  &-filter-dropdown {
    min-width: 96px;
    margin-left: -8px;
    background: #fff;
    border-radius: @border-radius-base;
    border: 1px solid @border-color-base;
    box-shadow: @box-shadow-base;

    .ant-dropdown-menu {
      border: 0;
      box-shadow: none;
      border-radius: @border-radius-base @border-radius-base 0 0;

      &-sub {
        border-radius: @border-radius-base;
        border: 1px solid @border-color-base;
        box-shadow: @box-shadow-base;
      }

      .ant-dropdown-submenu-contain-selected {
        .ant-dropdown-menu-submenu-title:after {
          color: @primary-color;
          font-weight: bold;
          text-shadow: 0 0 2px tint(@primary-color, 80%);
        }
      }
    }

    .ant-dropdown-menu-item {
      overflow: hidden;
    }

    > .ant-dropdown-menu > .ant-dropdown-menu-item:last-child,
    > .ant-dropdown-menu > .ant-dropdown-menu-submenu:last-child .ant-dropdown-menu-submenu-title {
      border-radius: 0;
    }

    &-btns {
      overflow: hidden;
      padding: 7px 15px;
      border-top: 1px solid @border-color-split;
    }

    &-link {
      color: @link-color;
      &:hover {
        color: @link-hover-color;
      }
      &:active {
        color: @link-active-color;
      }
      &.confirm {
        float: left;
      }
      &.clear {
        float: right;
      }
    }
  }

  &-row {
    &-expand-icon {
      cursor: pointer;
      display: inline-block;
      width: 18px;
      height: 18px;
      text-align: center;
      line-height: 15px;
      border: 1px solid @border-color-split;
      user-select: none;
      background: #fff;
      &-cell {
        width: 18px;
      }
    }

    &-expanded:after {
      content: '-';
    }

    &-collapsed:after {
      content: '+';
    }

    &-spaced {
      visibility: hidden;
      &:after {
        content: '.';
      }
    }

    &[class*="@{table-prefix-cls}-row-level-0"] .@{table-prefix-cls}-selection-column > span {
      display: inline-block;
    }
  }

  tr&-expanded-row {
    &,
    &:hover {
      background: #fbfbfb;
    }
  }

  .@{table-prefix-cls}-row-indent + .@{table-prefix-cls}-row-expand-icon {
    margin-right: 8px;
  }

  &-scroll {
    overflow: auto;
  }

  &-body-inner {
    height: 100%;
  }

  &-fixed-header &-body-inner {
    overflow: scroll;
  }

  &-fixed {
    table-layout: fixed;
  }

  &-fixed-left,
  &-fixed-right {
    position: absolute;
    top: 0;
    overflow: hidden;
    z-index: 1;
    transition: box-shadow .3s ease;
    border-radius: 0;
    table {
      width: auto;
      background: #fff;
    }
  }

  &-fixed-left {
    left: 0;
    box-shadow: 4px 0 4px rgba(0, 0, 0, 0.08);
    border-radius: @border-radius-base 0 0 0;
    & .@{table-prefix-cls}-body-inner {
      margin-right: -20px;
    }
  }

  &-fixed-right {
    right: 0;
    box-shadow: -4px 0 4px rgba(0, 0, 0, 0.08);
    border-radius: 0 @border-radius-base 0 0;
  }

  &&-scroll-position-left &-fixed-left {
    box-shadow: none;
  }

  &&-scroll-position-right &-fixed-right {
    box-shadow: none;
  }

  &-column-hidden {
    display: none;
  }

  th&-column-has-prev {
    position: relative;
  }

  th&-column-has-prev,
  td&-column-has-prev {
    padding-left: 24px;
  }

  &-prev-columns-page,
  &-next-columns-page {
    cursor: pointer;
    color: #666;
    z-index: 1;
    &:hover {
      color: @primary-color;
    }
    &-disabled {
      cursor: not-allowed;
      color: #bbb;
      &:hover {
        color: #bbb;
      }
    }
  }

  &-prev-columns-page {
    position: absolute;
    left: 8px;
    &:before {
      content: '\e601';
      .iconfont-size-under-12px(9px);
      font-weight: bold;
      font-family: anticon;
    }
  }

  &-next-columns-page {
    float: right;
    margin-left: 8px;
    &:before {
      content: '\e600';
      .iconfont-size-under-12px(9px);
      font-weight: bold;
      font-family: anticon;
    }
  }
}

@import "../mixins/index";

@table-prefix-cls: ~"@{css-prefix}table";
@table-head-background-color: #f7f7f7;

.@{table-prefix-cls} {
  font-size: @font-size-base;
  color: @text-color;
  border-radius: @border-radius-base @border-radius-base 0 0;
  overflow: hidden;
  position: relative;
  border-radius: @border-radius-base @border-radius-base 0 0;
  overflow: hidden;

  &-body {
    transition: opacity 0.3s ease;
  }

  table {
    width: 100%;
    border-collapse: separate;
    text-align: left;
  }

  th {
    background: @table-head-background-color;
    font-weight: bold;
    transition: background .3s ease;
    text-align: left;

    .anticon-filter {
      margin-left: 4px;
      .iconfont-size-under-12px(10px);
      cursor: pointer;
      color: #aaa;
      transition: all 0.3s ease;
      &:hover {
        color: #666;
      }
    }

    .@{table-prefix-cls}-filter-selected.anticon-filter {
      color: @primary-color;
    }
  }

  td {
    border-bottom: 1px solid @border-color-split;
  }

  tr {
    transition: all .3s ease;
    &.@{table-prefix-cls}-row-hover,
    &:hover {
      background: tint(@primary-color, 90%);
    }
  }

  thead tr:hover {
    background: none;
  }

  &-footer {
    padding: 16px 8px;
    margin: 0 3px;
    background: @table-head-background-color;
    position: relative;
    top: -1px;
    border-radius: 0 0 @border-radius-base @border-radius-base;
  }

  tr.@{table-prefix-cls}-row-selected {
    background: #fafafa;
  }

  th.@{table-prefix-cls}-column-sort {
    background: #eaeaea;
  }

  th,
  td {
    padding: 16px 8px;
    word-break: break-all;
  }

  th.@{table-prefix-cls}-selection-column,
  td.@{table-prefix-cls}-selection-column {
    text-align: center;
    width: 60px;
  }

  &-header {
    background: @table-head-background-color;
    overflow: hidden;
    border-radius: @border-radius-base @border-radius-base 0 0;
  }

  &-header table {
    border-radius: @border-radius-base @border-radius-base 0 0;
  }

  &-loading {
    position: relative;
    .@{table-prefix-cls}-body {
      background: #fff;
      opacity: 0.5;
    }
    .@{table-prefix-cls}-spin-holder {
      height: 20px;
      line-height: 20px;
      left: 50%;
      top: 50%;
      margin-left: -30px;
      position: absolute;
    }
    .@{table-prefix-cls}-with-pagination {
      margin-top: -20px;
    }
    .@{table-prefix-cls}-without-pagination {
      margin-top: 10px;
    }
  }

  &-middle {
    th,
    td {
      padding: 10px 8px;
    }
  }

  &-small {
    table {
      border: 1px solid @border-color-split;
      padding: 0 8px;
      border-radius: 6px 6px 0 0;
    }

    th {
      padding: 10px 8px;
      background: #fff;
      border-bottom: 1px solid @border-color-split;
    }

    td {
      padding: 6px 8px;
    }
    .ant-table-row:last-child td {
      border-bottom: 0;
    }
  }

  &-column-sorter {
    margin-left: 4px;
    display: inline-block;
    width: 12px;
    height: 14px;
    vertical-align: middle;
    text-align: center;
    &-up,
    &-down {
      line-height: 4px;
      height: 6px;
      display: block;
      width: 12px;
      cursor: pointer;
      &:hover .anticon {
        color: #666;
      }
      &.on {
        .anticon-caret-up,
        .anticon-caret-down {
          color: @primary-color;
        }
      }
    }
    .anticon-caret-up,
    .anticon-caret-down {
      .iconfont-size-under-12px(6px);
      line-height: 6px;
      height: 6px;
      color: #aaa;
      &:before {
        -moz-transform-origin: 53% 50%; /* fix firefox position */
      }
    }
  }

  &.@{table-prefix-cls}-bordered {
    table {
      border: 1px solid @border-color-split;
    }

    th {
      border-bottom: 1px solid @border-color-split;
    }

    tbody tr:last-child {
      th,
      td {
        border-bottom: 0;
      }
    }

    th,
    td {
      border-right: 1px solid @border-color-split;
      &:last-child {
        border-right: 0;
      }
    }
  }

  &-empty {
    position: relative;
    margin-bottom: 16px;
  }

  &-empty &-body {
    height: 150px;
  }

  &-placeholder {
    height: 100px;
    line-height: 100px;
    text-align: center;
    font-size: 12px;
    color: #999;
    border-bottom: 1px solid @border-color-split;
    position: absolute;
    top: 50px;
    left: 0;
    width: 100%;
    .anticon {
      margin-right: 4px;
    }
  }

  &-pagination {
    margin: 16px 0;
    float: right;
  }

  &-filter-dropdown {
    min-width: 96px;
    margin-left: -8px;
    background: #fff;
    border-radius: @border-radius-base;
    border: 1px solid @border-color-base;
    box-shadow: @box-shadow-base;

    .ant-dropdown-menu {
      border: 0;
      box-shadow: none;
      border-radius: @border-radius-base @border-radius-base 0 0;

      &-sub {
        border-radius: @border-radius-base;
        border: 1px solid @border-color-base;
        box-shadow: @box-shadow-base;
      }

      .ant-dropdown-submenu-contain-selected {
        .ant-dropdown-menu-submenu-title:after {
          color: @primary-color;
          font-weight: bold;
          text-shadow: 0 0 2px tint(@primary-color, 80%);
        }
      }
    }

    .ant-dropdown-menu-item {
      overflow: hidden;
    }

    > .ant-dropdown-menu > .ant-dropdown-menu-item:last-child,
    > .ant-dropdown-menu > .ant-dropdown-menu-submenu:last-child .ant-dropdown-menu-submenu-title {
      border-radius: 0;
    }

    &-btns {
      overflow: hidden;
      padding: 7px 15px;
      border-top: 1px solid @border-color-split;
    }

    &-link {
      color: @link-color;
      &:hover {
        color: @link-hover-color;
      }
      &:active {
        color: @link-active-color;
      }
      &.confirm {
        float: left;
      }
      &.clear {
        float: right;
      }
    }
  }

  &-row {
    &-expand-icon {
      cursor: pointer;
      display: inline-block;
      width: 18px;
      height: 18px;
      text-align: center;
      line-height: 15px;
      border: 1px solid @border-color-split;
      user-select: none;
      background: #fff;
      &-cell {
        width: 18px;
      }
    }

    &-expanded:after {
      content: '-';
    }

    &-collapsed:after {
      content: '+';
    }

    &-spaced {
      visibility: hidden;
      &:after {
        content: '.';
      }
    }

    &[class*="@{table-prefix-cls}-row-level-0"] .@{table-prefix-cls}-selection-column > span {
      display: inline-block;
    }
  }

  tr&-expanded-row {
    &,
    &:hover {
      background: #fbfbfb;
    }
  }

  .@{table-prefix-cls}-row-indent + .@{table-prefix-cls}-row-expand-icon {
    margin-right: 8px;
  }

  &-scroll {
    overflow: auto;
  }

  &-body-inner {
    height: 100%;
  }

  &-fixed-header &-body-inner {
    overflow: scroll;
  }

  &-fixed {
    table-layout: fixed;
  }

  &-fixed-left,
  &-fixed-right {
    position: absolute;
    top: 0;
    overflow: hidden;
    z-index: 1;
    transition: box-shadow .3s ease;
    border-radius: 0;
    table {
      width: auto;
      background: #fff;
    }
  }

  &-fixed-left {
    left: 0;
    box-shadow: 4px 0 4px rgba(0, 0, 0, 0.08);
    border-radius: @border-radius-base 0 0 0;
    & .@{table-prefix-cls}-body-inner {
      margin-right: -20px;
    }
  }

  &-fixed-right {
    right: 0;
    box-shadow: -4px 0 4px rgba(0, 0, 0, 0.08);
    border-radius: 0 @border-radius-base 0 0;
  }

  &&-scroll-position-left &-fixed-left {
    box-shadow: none;
  }

  &&-scroll-position-right &-fixed-right {
    box-shadow: none;
  }

  &-column-hidden {
    display: none;
  }

  th&-column-has-prev {
    position: relative;
  }

  th&-column-has-prev,
  td&-column-has-prev {
    padding-left: 24px;
  }

  &-prev-columns-page,
  &-next-columns-page {
    cursor: pointer;
    color: #666;
    z-index: 1;
    &:hover {
      color: @primary-color;
    }
    &-disabled {
      cursor: not-allowed;
      color: #bbb;
      &:hover {
        color: #bbb;
      }
    }
  }

  &-prev-columns-page {
    position: absolute;
    left: 8px;
    &:before {
      content: '\e601';
      .iconfont-size-under-12px(9px);
      font-weight: bold;
      font-family: anticon;
    }
  }

  &-next-columns-page {
    float: right;
    margin-left: 8px;
    &:before {
      content: '\e600';
      .iconfont-size-under-12px(9px);
      font-weight: bold;
      font-family: anticon;
    }
  }
}


revert to native underline

revert to native underline

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/MatTheCat/clean.git/'


fix 404 page style

fix 404 page style

fatal: unable to access 'https://github.com/hjin-me/ant-design.git/': The requested URL returned error: 403


profiles horizontal line margin

profiles horizontal line margin

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/esleau/esleau-theme.git/'


Admin Tables

Admin Tables

- Modified admin table styles to display images correctly

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/mxabierto/dgm.git/'


Style user avatar image to jut out sort of like in the tour interesting users step.

fatal: unable to access 'https://github.com/daukantas/factlink-core.git/': The requested URL returned error: 403


add hover state to tags

add hover state to tags

fatal: unable to access 'https://github.com/Thinkful/ui.git/': The requested URL returned error: 403


Style like fact-body-displaystring-clickable

@import "bootstrap/mixins";

.formatted-comment-content-factlink {
  padding: 1px 0;
  background-color: @factlinkInactiveColor;
  .transition(background-color 0.4s);

  &:hover {
    background-color: @factlinkActiveColor;
  }
}

error: pathspec 'core/app/assets/stylesheets/comments/formatted_comment_content.css.less' did not match any file(s) known to git


added icon circle

added icon circle

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/TuhuFE/wepy.git/'


slight adjustment to multiple select

slight adjustment to multiple select

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/DellGDC/dell-ui-components.git/'


Move dialog width style from .modal to .modal-header and .modal-body. Allow .modal-footer to use nowrap so buttons don't wrap

// Copyright (c) 2012 Adobe Systems Incorporated. All rights reserved.
//
// Permission is hereby granted, free of charge, to any person obtaining a
// copy of this software and associated documentation files (the "Software"),
// to deal in the Software without restriction, including without limitation
// the rights to use, copy, modify, merge, publish, distribute, sublicense,
// and/or sell copies of the Software, and to permit persons to whom the
// Software is furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in
// all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
// DEALINGS IN THE SOFTWARE.

/* Brackets patterns (and overrides and re-definitions of Bootstrap patterns)
 *
 * This file should contain all _reusable_ UI elements / LESS definitions
 * That is, things that will either a.) be used for more than one element or
 * b.) exist in multiple versions of brackets (e.g. App, In-Browser, etc.)
 *
 * Note that if you want a UI element to be themeable, you should put the
 * themeable part in "brackets_theme_default" as variables/mixins.
 *
 */

.project-panel-background {
    background: rgb(73,77,77); /* Old browsers */
    background: -moz-linear-gradient(top,  rgb(73,77,77) 0%, rgb(59,63,65) 51%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(73,77,77)), color-stop(51%,rgb(59,63,65))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgb(73,77,77) 0%,rgb(59,63,65) 51%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgb(73,77,77) 0%,rgb(59,63,65) 51%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgb(73,77,77) 0%,rgb(59,63,65) 51%); /* IE10+ */
    background: linear-gradient(top,  rgb(73,77,77) 0%,rgb(59,63,65) 51%); /* W3C */
    filter: ~"progid:DXImageTransform.Microsoft.gradient( startColorstr='#494d4d', endColorstr='#3b3f41',GradientType=0 )";  /* IE6-9 */
}

.panel {
    .vbox;
    .box-flex(1);

    padding: 0;
    margin: 0;

    .project-panel-background;
    color: #bbb;
    letter-spacing: .01em;
    text-shadow: 0px 1px 2px rgba(0,0,0,.5);
}

/* Toolbar-related styles */

/* Simple toolbar layout (project panel, find in files, etc.)
   We don't set this directly on .toolbar because it'd be a pain to override all the pieces
   if other code (e.g. #main-toolbar) wants to do a different layout */
.simple-toolbar-layout.toolbar {
    .hbox;
    .box-align(center);
    .title-wrapper {
        /* This is necessary because text-overflow: ellipsis doesn't work when it's set
           directly on a flexing box in Chrome currently. */
        .box-flex(1);
    }
    .buttons {
        .hbox;
        margin-left: 4px;
    }
}

/* Editor toolbar layout

   CSS hack based on this code: http://jsfiddle.net/cD657/3/ (via StackOverflow)
   This center-aligns the title across the full width of the toolbar (ignoring the width of the nav floated
   left and buttons floated right), yet still have the browser automatically wrap the floats onto a 2nd row
   if they collide with the title. But the centered content must be a block element with fixed width. Since
   the editor title (filename) varies in width, we rely on JS code to update the width whenever the string
   changes.

   Another wrinkle: wrapping to/from the two-line toolbar layout requires notifying the CodeMirror editor that
   its height changed. Currently, we assume this can ONLY happen in two cases:
    - the window resizes (handled by general listener in EditorManager)
    - title content changes (the same JS code that sets .title-wrapper's fixed width is expected to handle this)
*/
#main-toolbar.toolbar {
    text-align: center;
    .nav {
        float: left;
        text-align: left;
    }
    .title {
        float: none;
        display: inline;  // must be an inline for JS to measure text size
    }
    .title-wrapper {
        margin: 0 auto;
        display: block;  // must be a block for the fixed width applied by JS to be respected
        // width set in px is appled/updated by JavaScript in DocumentCommandHandlers
    }
    .buttons {
        float: right;
        text-align: left;
    }
}

/* Toolbar appearance - shared by all toolbars, independent of layout */

@toolbar-top-gap-px: 5px;

.toolbar {
    font-size: @label-font-size;
    padding: 4px 8px;
    background-color: @bc-white;
    color: @bc-black;

    position: relative; // starts a new stacking group so that the drop shadow shows up on top of the code editor
    .box-shadow(0 1px 1px 0 fadeout(@bc-black, 90%));

    .title-wrapper {
        // Title is taller than menu text, so reduce top padding to keep its baseline aligned
        padding: (@toolbar-top-gap-px - 3px) 0 3px 0;
    }
    .title {
        font-size: @title-font-size;
        line-height: normal;
        font-weight: @font-weight-light;

        // On Win, the size+weight combo used above does not look good for the bullet character
        .dirty-dot {
            font-weight: normal;
        }

        white-space: nowrap;
        overflow: hidden;
        -ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
    }

    .buttons {
        margin: @toolbar-top-gap-px 0 0 4px;

        .experimental-label {
            color: #a0a0a0;
            font-size: 15px;
            line-height: 20px;  // prevent jumping when 20px-tall JSLint star is added/removed
            font-weight: normal;
            font-style: italic;
            padding-right: 22px;
        }
    }
}

/* Menu-related styles */

@menubar-top-padding: 8px;
@menubar-bottom-padding: 6px;
@menubar-h-padding: 9px;
@item-highlight-color: #e0f0fa;

.toolbar .nav, .context-menu, .codehint-menu {

    // The 1px adjustments here are to account for the border around the top-level menu items.
    margin: (@toolbar-top-gap-px - @menubar-top-padding - 1) 0 (-@menubar-bottom-padding + 1) (-@menubar-h-padding + 4);

    // General item appearance
    a {
        color: @bc-black;
        text-shadow: none;
    }

    // Menubar item appearance
    .dropdown-toggle {
        padding: @menubar-top-padding @menubar-h-padding @menubar-bottom-padding;
        border: 1px solid rgba(0, 0, 0, 0); // transparent border just to hold the layout so it doesn't shift on hover
        color: fadeout(@bc-black, 25%);
        font-weight: @font-weight-light;
    }
    .dropdown-toggle:hover, .dropdown.open .dropdown-toggle {
        /* Note: we need several selectors for this in order to match the specificity of all the various Bootstrap
           color rules we need to override (and Bootstrap has several selectors because the colors really differ
           in their defaults). */
        color: @bc-black;
        background: @item-highlight-color;
        border-color: #dbeaf4;
    }

    // no triangle icon after menu items
    .dropdown-toggle:after {
        border: 0;
        margin: 0;
    }

    // Menu dropdown appearance
    .dropdown-menu {
        top: 34px; // Offset from top of menubar item

        background-color: @bc-white;
        border: 1px solid #c8c8c8;
        .border-radius(0 0 3px 3px);
        .box-shadow(0 6px 18px 0 rgba(0, 0, 0, .2));

        // Menu items
        li {
            a {
                font-size: @menu-item-font-size;
                line-height: 18px;

                // Slightly less padding on left to account for checkmark.
                // More padding on top than bottom to center font within its bg highlight better.
                padding: 2px 10px 0px 6px;

                color: @bc-black;
                text-shadow: none;
                white-space: nowrap;
                .box-shadow(none);

                &:hover, &.highlight {
                    color: @bc-black;
                    background: @item-highlight-color;
                }

                &.disabled {
                    color: @bc-gray;

                    &:hover {
                        background: @bc-white;
                    }
                }

                /* hidden checkmark for all list item content ensures consistent left spacing */
                &::before {
                    content: "✓\00a0"; /* non-breaking space */
                    visibility: hidden;
                }
                /* toggle checkmark visibility */
                &.checked::before {
                    visibility: visible;
                }
            }
        }

        .divider {
            background-color: #eaeaea;
            border: 0;
        }
    }

    // Ensure a minimum amount of space to the left of the shortcut
    .menu-shortcut {
        margin-left: 15px;
    }
}

/* Context menu styles */

.context-menu, .codehint-menu {
    position: absolute;
    z-index: @z-index-brackets-context-menu-base;
    list-style-type: none;

    .dropdown-menu {
        .border-radius(3px);
    }

    .menu-shortcut {
        float: right;
    }
}

.codehint-menu {
    .dropdown-menu {
        .box-shadow(none);
        max-height: 160px;
        overflow-y: auto;

        padding: 0;

        li {
            a {
                // Less padding than on menus. More padding on top than bottom
                // to center font within its bg highlight better.
                padding: 2px 0px 0px 0px;

                // Don't show highlighting on hover for code hints...
                &:hover {
                    color: @bc-black;
                    background-color: @bc-white;
                }

				// ...except for selected item
                &.highlight:hover {
                    color: @bc-black;
                    background-color: @item-highlight-color;
                }
            }
        }
    }
}

#context-menu-bar {
    margin: 0;
}

/* Dialog-related styles */

.modal {
    width: auto;
}

.modal-body, .modal-header {
    width: 560px;
}

.modal-footer {
    white-space: nowrap;
}

.modal-footer .btn.left {
    float: left;
}

.modal-body ul {
    /* Bootstrap's type.less defines a heavy margin-bottom on ul/ol that we don't want in dialogs
       since they have heavy padding instead. */
    margin-bottom: 0;
}

.dialog-title {
    margin-bottom: 0;
    font-size: 26px;
    line-height: 40px;
    font-weight: @font-weight-light;
}

.dialog-message {
    font-size: 16px;
    line-height: 26px;
    margin-bottom: 20px;
    font-weight: @font-weight-light;
}

/* bootstrap's base color for generic li is gray */
.dialog-message li {
    line-height: 26px;
    color: @grayDark;
}

.dialog-filename {
    font-weight: @font-weight-semibold;
}

.btn {
    font-size: 16px;
    font-weight: @font-weight-semibold;
    color: #454545;

    // On hover, gradient slides away to reveal a solid-color bg. Want same bg color in non-hover
    // too so we don't see the color cross-fading during the gradient slide animation
    background-color: #fff;
    &:hover {
        background-position: 0 15px;
    }

    &.primary {
        background-color: @blue;
    }
}

/* Update dialog */
.update-dialog .modal-body {
    position: relative;
    .update-icon {
        position: absolute;
        left: 30px; // relative to border of modal-body
        top: 20px;
        width: 80px;
        height: 80px;
    }
    .update-text {
        // Icon is 120px, so we need at least that much left padding/margin to avoid overlap
        margin: 0 10px 0 123px;

        .update-info {
            max-height: 200px;
            overflow: auto;
        }
    }
}

/* About dialog */
.about-dialog .modal-body {
    // Simple two-column layout: image on left, text taking up remaining space on right
    position: relative;
    .about-icon {
        position: absolute;
        left: 10px;  // relative to border of modal-body (bounds outside padding)
        top:  11px;
    }
    .about-text {
        // Icon is 120px, so we need at least that much left padding/margin to avoid overlap
        margin: 0 10px 0 123px;

        #about-build-number {
            color: #b0b0b0;
        }
    }

    h2 {
        font-weight: normal;
        font-size: 25px;
        margin-bottom: -8px;
        margin-top: 3px;
    }
    .dialog-message {
        font-size: 14px;
        line-height: 17px;

        // Enable text selection, since URLs aren't clickable
        cursor: auto;
        -webkit-user-select: text;
        -khtml-user-select: text;
        -moz-user-select: text;
        -ms-user-select: text;
        -o-user-select: text;
        user-select: text;
    }
}

// Copyright (c) 2012 Adobe Systems Incorporated. All rights reserved.
//
// Permission is hereby granted, free of charge, to any person obtaining a
// copy of this software and associated documentation files (the "Software"),
// to deal in the Software without restriction, including without limitation
// the rights to use, copy, modify, merge, publish, distribute, sublicense,
// and/or sell copies of the Software, and to permit persons to whom the
// Software is furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in
// all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
// DEALINGS IN THE SOFTWARE.

/* Brackets patterns (and overrides and re-definitions of Bootstrap patterns)
 *
 * This file should contain all _reusable_ UI elements / LESS definitions
 * That is, things that will either a.) be used for more than one element or
 * b.) exist in multiple versions of brackets (e.g. App, In-Browser, etc.)
 *
 * Note that if you want a UI element to be themeable, you should put the
 * themeable part in "brackets_theme_default" as variables/mixins.
 *
 */

.project-panel-background {
    background: rgb(73,77,77); /* Old browsers */
    background: -moz-linear-gradient(top,  rgb(73,77,77) 0%, rgb(59,63,65) 51%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(73,77,77)), color-stop(51%,rgb(59,63,65))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgb(73,77,77) 0%,rgb(59,63,65) 51%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgb(73,77,77) 0%,rgb(59,63,65) 51%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgb(73,77,77) 0%,rgb(59,63,65) 51%); /* IE10+ */
    background: linear-gradient(top,  rgb(73,77,77) 0%,rgb(59,63,65) 51%); /* W3C */
    filter: ~"progid:DXImageTransform.Microsoft.gradient( startColorstr='#494d4d', endColorstr='#3b3f41',GradientType=0 )";  /* IE6-9 */
}

.panel {
    .vbox;
    .box-flex(1);

    padding: 0;
    margin: 0;

    .project-panel-background;
    color: #bbb;
    letter-spacing: .01em;
    text-shadow: 0px 1px 2px rgba(0,0,0,.5);
}

/* Toolbar-related styles */

/* Simple toolbar layout (project panel, find in files, etc.)
   We don't set this directly on .toolbar because it'd be a pain to override all the pieces
   if other code (e.g. #main-toolbar) wants to do a different layout */
.simple-toolbar-layout.toolbar {
    .hbox;
    .box-align(center);
    .title-wrapper {
        /* This is necessary because text-overflow: ellipsis doesn't work when it's set
           directly on a flexing box in Chrome currently. */
        .box-flex(1);
    }
    .buttons {
        .hbox;
        margin-left: 4px;
    }
}

/* Editor toolbar layout

   CSS hack based on this code: http://jsfiddle.net/cD657/3/ (via StackOverflow)
   This center-aligns the title across the full width of the toolbar (ignoring the width of the nav floated
   left and buttons floated right), yet still have the browser automatically wrap the floats onto a 2nd row
   if they collide with the title. But the centered content must be a block element with fixed width. Since
   the editor title (filename) varies in width, we rely on JS code to update the width whenever the string
   changes.

   Another wrinkle: wrapping to/from the two-line toolbar layout requires notifying the CodeMirror editor that
   its height changed. Currently, we assume this can ONLY happen in two cases:
    - the window resizes (handled by general listener in EditorManager)
    - title content changes (the same JS code that sets .title-wrapper's fixed width is expected to handle this)
*/
#main-toolbar.toolbar {
    text-align: center;
    .nav {
        float: left;
        text-align: left;
    }
    .title {
        float: none;
        display: inline;  // must be an inline for JS to measure text size
    }
    .title-wrapper {
        margin: 0 auto;
        display: block;  // must be a block for the fixed width applied by JS to be respected
        // width set in px is appled/updated by JavaScript in DocumentCommandHandlers
    }
    .buttons {
        float: right;
        text-align: left;
    }
}

/* Toolbar appearance - shared by all toolbars, independent of layout */

@toolbar-top-gap-px: 5px;

.toolbar {
    font-size: @label-font-size;
    padding: 4px 8px;
    background-color: @bc-white;
    color: @bc-black;

    position: relative; // starts a new stacking group so that the drop shadow shows up on top of the code editor
    .box-shadow(0 1px 1px 0 fadeout(@bc-black, 90%));

    .title-wrapper {
        // Title is taller than menu text, so reduce top padding to keep its baseline aligned
        padding: (@toolbar-top-gap-px - 3px) 0 3px 0;
    }
    .title {
        font-size: @title-font-size;
        line-height: normal;
        font-weight: @font-weight-light;

        // On Win, the size+weight combo used above does not look good for the bullet character
        .dirty-dot {
            font-weight: normal;
        }

        white-space: nowrap;
        overflow: hidden;
        -ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
    }

    .buttons {
        margin: @toolbar-top-gap-px 0 0 4px;

        .experimental-label {
            color: #a0a0a0;
            font-size: 15px;
            line-height: 20px;  // prevent jumping when 20px-tall JSLint star is added/removed
            font-weight: normal;
            font-style: italic;
            padding-right: 22px;
        }
    }
}

/* Menu-related styles */

@menubar-top-padding: 8px;
@menubar-bottom-padding: 6px;
@menubar-h-padding: 9px;
@item-highlight-color: #e0f0fa;

.toolbar .nav, .context-menu, .codehint-menu {

    // The 1px adjustments here are to account for the border around the top-level menu items.
    margin: (@toolbar-top-gap-px - @menubar-top-padding - 1) 0 (-@menubar-bottom-padding + 1) (-@menubar-h-padding + 4);

    // General item appearance
    a {
        color: @bc-black;
        text-shadow: none;
    }

    // Menubar item appearance
    .dropdown-toggle {
        padding: @menubar-top-padding @menubar-h-padding @menubar-bottom-padding;
        border: 1px solid rgba(0, 0, 0, 0); // transparent border just to hold the layout so it doesn't shift on hover
        color: fadeout(@bc-black, 25%);
        font-weight: @font-weight-light;
    }
    .dropdown-toggle:hover, .dropdown.open .dropdown-toggle {
        /* Note: we need several selectors for this in order to match the specificity of all the various Bootstrap
           color rules we need to override (and Bootstrap has several selectors because the colors really differ
           in their defaults). */
        color: @bc-black;
        background: @item-highlight-color;
        border-color: #dbeaf4;
    }

    // no triangle icon after menu items
    .dropdown-toggle:after {
        border: 0;
        margin: 0;
    }

    // Menu dropdown appearance
    .dropdown-menu {
        top: 34px; // Offset from top of menubar item

        background-color: @bc-white;
        border: 1px solid #c8c8c8;
        .border-radius(0 0 3px 3px);
        .box-shadow(0 6px 18px 0 rgba(0, 0, 0, .2));

        // Menu items
        li {
            a {
                font-size: @menu-item-font-size;
                line-height: 18px;

                // Slightly less padding on left to account for checkmark.
                // More padding on top than bottom to center font within its bg highlight better.
                padding: 2px 10px 0px 6px;

                color: @bc-black;
                text-shadow: none;
                white-space: nowrap;
                .box-shadow(none);

                &:hover, &.highlight {
                    color: @bc-black;
                    background: @item-highlight-color;
                }

                &.disabled {
                    color: @bc-gray;

                    &:hover {
                        background: @bc-white;
                    }
                }

                /* hidden checkmark for all list item content ensures consistent left spacing */
                &::before {
                    content: "✓\00a0"; /* non-breaking space */
                    visibility: hidden;
                }
                /* toggle checkmark visibility */
                &.checked::before {
                    visibility: visible;
                }
            }
        }

        .divider {
            background-color: #eaeaea;
            border: 0;
        }
    }

    // Ensure a minimum amount of space to the left of the shortcut
    .menu-shortcut {
        margin-left: 15px;
    }
}

/* Context menu styles */

.context-menu, .codehint-menu {
    position: absolute;
    z-index: @z-index-brackets-context-menu-base;
    list-style-type: none;

    .dropdown-menu {
        .border-radius(3px);
    }

    .menu-shortcut {
        float: right;
    }
}

.codehint-menu {
    .dropdown-menu {
        .box-shadow(none);
        max-height: 160px;
        overflow-y: auto;

        padding: 0;

        li {
            a {
                // Less padding than on menus. More padding on top than bottom
                // to center font within its bg highlight better.
                padding: 2px 0px 0px 0px;

                // Don't show highlighting on hover for code hints...
                &:hover {
                    color: @bc-black;
                    background-color: @bc-white;
                }

				// ...except for selected item
                &.highlight:hover {
                    color: @bc-black;
                    background-color: @item-highlight-color;
                }
            }
        }
    }
}

#context-menu-bar {
    margin: 0;
}

/* Dialog-related styles */

.modal-footer .btn.left {
    float: left;
}

.modal-body ul {
    /* Bootstrap's type.less defines a heavy margin-bottom on ul/ol that we don't want in dialogs
       since they have heavy padding instead. */
    margin-bottom: 0;
}

.dialog-title {
    margin-bottom: 0;
    font-size: 26px;
    line-height: 40px;
    font-weight: @font-weight-light;
}

.dialog-message {
    font-size: 16px;
    line-height: 26px;
    margin-bottom: 20px;
    font-weight: @font-weight-light;
}

/* bootstrap's base color for generic li is gray */
.dialog-message li {
    line-height: 26px;
    color: @grayDark;
}

.dialog-filename {
    font-weight: @font-weight-semibold;
}

.btn {
    font-size: 16px;
    font-weight: @font-weight-semibold;
    color: #454545;

    // On hover, gradient slides away to reveal a solid-color bg. Want same bg color in non-hover
    // too so we don't see the color cross-fading during the gradient slide animation
    background-color: #fff;
    &:hover {
        background-position: 0 15px;
    }

    &.primary {
        background-color: @blue;
    }
}

/* Update dialog */
.update-dialog .modal-body {
    position: relative;
    .update-icon {
        position: absolute;
        left: 30px; // relative to border of modal-body
        top: 20px;
        width: 80px;
        height: 80px;
    }
    .update-text {
        // Icon is 120px, so we need at least that much left padding/margin to avoid overlap
        margin: 0 10px 0 123px;

        .update-info {
            max-height: 200px;
            overflow: auto;
        }
    }
}

/* About dialog */
.about-dialog .modal-body {
    // Simple two-column layout: image on left, text taking up remaining space on right
    position: relative;
    .about-icon {
        position: absolute;
        left: 10px;  // relative to border of modal-body (bounds outside padding)
        top:  11px;
    }
    .about-text {
        // Icon is 120px, so we need at least that much left padding/margin to avoid overlap
        margin: 0 10px 0 123px;

        #about-build-number {
            color: #b0b0b0;
        }
    }

    h2 {
        font-weight: normal;
        font-size: 25px;
        margin-bottom: -8px;
        margin-top: 3px;
    }
    .dialog-message {
        font-size: 14px;
        line-height: 17px;

        // Enable text selection, since URLs aren't clickable
        cursor: auto;
        -webkit-user-select: text;
        -khtml-user-select: text;
        -moz-user-select: text;
        -ms-user-select: text;
        -o-user-select: text;
        user-select: text;
    }
}


yangshi

yangshi

fatal: unable to access 'https://github.com/XUEJS/xue-project.git/': The requested URL returned error: 403


Hide the blue line in the widget header

Hide the blue line in the widget header

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/classcentral/class-central.git/'


Change datepicker border to gray25

Change datepicker border to gray25

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/Thinkful/ui.git/'


Fix pricing header

Fix pricing header

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/getinsomnia/website.git/'


Margins for span+i and span+span in navbar left/right

fatal: unable to access 'https://github.com/StudyForFun/Framework7-Plus.git/': The requested URL returned error: 403


Update profile pricing

Update profile pricing

fatal: unable to access 'https://github.com/manti-by/Boogi.git/': The requested URL returned error: 403


Add clearfix

Add clearfix

fatal: unable to access 'https://github.com/busyorg/busy.git/': The requested URL returned error: 403